:root{--bg:#090c19;--panel:#151a2d;--panel2:#1d2440;--text:#f7f8ff;--muted:#aab2ca;--line:#303852;--accent:#8d78ff;--accent2:#38d6cb}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--text);line-height:1.6}body.light{--bg:#f8f9ff;--panel:#fff;--panel2:#eff1fc;--text:#171a30;--muted:#636b81;--line:#dfe3f0}a{color:inherit;text-decoration:none}header{max-width:1200px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:24px 22px}nav{display:flex;align-items:center;gap:24px;color:var(--muted)}button,input,select,textarea{font:inherit}button{cursor:pointer}nav button,.ghost{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:12px;padding:9px 14px}.logo{font-size:20px;font-weight:800;letter-spacing:-.6px}.logo span{color:var(--accent)}main{max-width:1200px;margin:auto;padding:0 22px}.hero{text-align:center;padding:105px 0 115px;background:radial-gradient(ellipse at 50% 40%,#7156ed30,transparent 58%)}.pill{display:inline-block;border:1px solid var(--line);background:var(--panel);padding:7px 17px;border-radius:50px;color:var(--accent2);font-size:13px}.hero h1{font-size:clamp(49px,7vw,92px);line-height:1.06;letter-spacing:-4px;margin:28px 0}.hero h1 em{font-style:normal;background:linear-gradient(100deg,var(--accent),var(--accent2));background-clip:text;color:transparent}.hero p{color:var(--muted);max-width:590px;margin:0 auto 30px;font-size:18px}.primary{background:linear-gradient(110deg,#7962f3,#6b52d9);color:white;border:0;border-radius:13px;padding:14px 23px;display:inline-block;font-weight:700}.sectionhead{display:flex;justify-content:space-between;align-items:center;gap:20px}.sectionhead h2,.about h2{font-size:32px;letter-spacing:-1px;margin:0}.sectionhead p,.about p{color:var(--muted);margin:4px 0 0}input,select,textarea{background:var(--panel2);color:var(--text);border:1px solid var(--line);border-radius:12px;padding:12px 14px;max-width:100%}input:focus,select:focus,textarea:focus{outline:2px solid var(--accent)}.tabs{display:flex;flex-wrap:wrap;gap:9px;margin:26px 0}.tab{background:var(--panel);color:var(--muted);border:1px solid var(--line);padding:9px 16px;border-radius:40px}.tab.active{background:var(--accent);color:#fff}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.card{border:1px solid var(--line);background:var(--panel);padding:24px;border-radius:20px;text-align:left;color:var(--text);transition:transform .2s,border-color .2s;min-height:150px}.card:hover{transform:translateY(-4px);border-color:var(--accent)}.card .symbol{font-size:27px}.card strong{display:block;margin-top:12px;font-size:17px}.card small{color:var(--muted)}.workspace{background:var(--panel);border:1px solid var(--line);border-radius:24px;margin:50px 0;padding:30px;scroll-margin-top:20px}.eyebrow{color:var(--accent2);text-transform:uppercase;font-size:12px;font-weight:800;letter-spacing:2px}.controls{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0}.controls label{display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:13px}.controls label input,.controls label select{min-width:150px}.drop{display:block;text-align:center;border:2px dashed var(--line);border-radius:18px;padding:40px 20px;background:var(--panel2);margin:22px 0;cursor:pointer}.drop.drag{border-color:var(--accent)}.drop input{display:none}.drop b{display:block;font-size:22px}.drop span{color:var(--muted)}#status{margin-top:15px;white-space:pre-wrap;overflow-wrap:anywhere}.result{background:var(--panel2);padding:16px;border-radius:12px;overflow-wrap:anywhere;white-space:pre-wrap;max-height:380px;overflow:auto}.about{text-align:center;padding:100px 15px;max-width:700px;margin:auto}footer{text-align:center;color:var(--muted);padding:25px;border-top:1px solid var(--line)}footer a{margin-left:12px}textarea{width:100%;min-height:160px}.hidden{display:none!important}@media(max-width:750px){.cards{grid-template-columns:repeat(2,1fr)}.sectionhead{align-items:flex-start;flex-direction:column}.hero{padding:65px 0}.hero h1{letter-spacing:-2px}nav{gap:12px}.workspace{padding:18px}}@media(max-width:470px){.cards{grid-template-columns:1fr}.logo{font-size:16px}nav a{display:none}}