:root{--bg:#07111f;--panel:#101e2e;--line:#24394e;--text:#f1f6fa;--muted:#8fa2b7;--cyan:#43e6d0;--blue:#38a9ff;--amber:#ffb84a}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 75% 10%,#153253 0,transparent 32%),var(--bg);color:var(--text);font:15px Segoe UI,Arial,sans-serif}button{font:inherit}header{height:78px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff12}.brand{display:flex;align-items:center;gap:12px;cursor:pointer}.brand i{display:grid;place-items:center;width:40px;height:40px;border:1px solid #34536b;border-radius:10px;color:var(--cyan);font:italic 26px Georgia}.brand small{display:block;color:var(--muted);font-size:8px;letter-spacing:.14em;margin-top:4px}nav{display:flex;gap:5px}nav button{border:0;background:none;color:var(--muted);padding:10px 14px;border-radius:8px;cursor:pointer}nav button:hover,nav button.active{background:#13273a;color:white}.page{display:none;max-width:1400px;min-height:calc(100vh - 78px);margin:auto;padding:70px 5vw}.page.active{display:block}.hero{position:relative}.hero-copy{padding-top:6vh;max-width:750px;position:relative;z-index:2}.hero label,.heading label{color:var(--cyan);font-size:10px;letter-spacing:.22em;font-weight:700}.hero h1{font-size:clamp(48px,7vw,92px);line-height:.98;letter-spacing:-.05em;margin:22px 0}.hero h1 em{color:var(--cyan);font:normal italic 1em Georgia}.hero-copy>p{max-width:600px;color:var(--muted);font-size:18px;line-height:1.7}.actions{display:flex;gap:12px;margin-top:30px}.actions button{padding:15px 20px;background:var(--blue);color:#06121f;border:0;border-radius:9px;font-weight:700;cursor:pointer}.actions button+button{background:#14263a;color:white;border:1px solid #2b455e}.atom{position:absolute;right:9%;top:12%;width:310px;height:310px;border:1px solid #31516b;border-radius:50%;display:grid;place-items:center;animation:spin 18s linear infinite}.atom:after{content:"";position:absolute;width:180px;height:360px;border:1px solid #31516b;border-radius:50%}.atom div{width:135px;height:135px;border:2px solid var(--cyan);box-shadow:0 0 50px #43e6d044;transform:rotate(20deg)}.atom span{position:absolute;bottom:55px;color:var(--cyan);font:19px Georgia}.cards{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:100px;position:relative;z-index:2}.cards button{display:grid;grid-template-columns:auto 1fr auto;gap:20px;align-items:center;text-align:left;background:linear-gradient(135deg,#112236ee,#0c1827ee);border:1px solid var(--line);border-radius:14px;padding:23px;color:white;cursor:pointer;transition:.2s}.cards button:hover{transform:translateY(-4px);border-color:#3a6788}.cards i{width:55px;height:55px;display:grid;place-items:center;border-radius:12px;background:#16344d;color:var(--cyan);font-size:28px}.cards button+button i{color:var(--amber);background:#392b1c}.cards small{font-size:9px;letter-spacing:.15em;color:var(--muted)}.cards b{display:block;font-size:21px;margin:5px 0}.cards p{margin:0;color:var(--muted)}.heading h2{font-size:48px;margin:10px 0}.heading p{color:var(--muted)}.layout{display:grid;grid-template-columns:240px 1fr;gap:20px;margin-top:35px}aside{display:flex;flex-direction:column;gap:7px}.tool{border:1px solid transparent;background:none;color:var(--muted);padding:13px;text-align:left;border-radius:9px;cursor:pointer}.tool i{display:inline-block;width:30px;color:var(--cyan);font-style:normal;font-size:18px}.tool:hover,.tool.active{color:white;background:#13283c;border-color:#29455e}#electricTools .tool i{color:var(--amber)}.workspace{border:1px solid var(--line);border-radius:15px;background:linear-gradient(145deg,#101f30,#0b1724);overflow:hidden}.work-head{display:flex;justify-content:space-between;align-items:center;padding:24px 28px;border-bottom:1px solid var(--line)}.work-head small{font-size:9px;letter-spacing:.15em;color:var(--muted)}.work-head h3{font-size:27px;margin:7px 0 0}.work-head>label{color:var(--cyan);font-size:9px;letter-spacing:.12em}.work-head .amber{color:var(--amber)}.work-grid{display:grid;grid-template-columns:minmax(270px,.8fr) 1.2fr;min-height:400px}.controls{padding:28px;border-right:1px solid var(--line)}.control{margin-bottom:23px}.control-head{display:flex;justify-content:space-between;margin-bottom:9px;color:#cbd6e1}.control-head output{color:var(--cyan);font-weight:700}.electric~code{border-color:#73552b}input[type=range]{width:100%;accent-color:var(--blue)}.number{display:flex;margin-top:9px}.number input,.number span{background:#081522;border:1px solid #2b4359;color:white;padding:10px}.number input{width:100%;border-radius:8px 0 0 8px}.number span{border-radius:0 8px 8px 0;color:var(--muted)}.visual{display:grid;place-items:center;position:relative;padding:22px;background:radial-gradient(circle,#18364f 0,transparent 65%)}.visual svg{width:100%;max-height:290px}.visual code{position:absolute;bottom:17px;border:1px solid #2e4b63;background:#081522df;color:#c3d6e4;padding:9px 15px;border-radius:8px;font:17px Georgia}.result{display:grid;grid-template-columns:auto auto 1fr;gap:25px;align-items:center;background:#0c2932;padding:21px 28px;border-top:1px solid #215262}.result small{font-size:9px;letter-spacing:.17em;color:var(--muted)}.result b{font-size:29px;color:var(--cyan)}.result span{color:var(--muted)}.amber-result{background:#2a2117;border-color:#5b4426}.amber-result b{color:var(--amber)}.safety{margin:0;padding:13px 28px;background:#191713;color:#bbaa89;font-size:11px}footer{padding:24px 5vw;border-top:1px solid var(--line);font-weight:700}footer span{float:right;color:var(--muted);font-weight:400}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:900px){.atom{opacity:.2}.layout{grid-template-columns:1fr}aside{flex-direction:row;overflow:auto}.tool{min-width:165px}.work-grid{grid-template-columns:1fr}.controls{border-right:0;border-bottom:1px solid var(--line)}}@media(max-width:620px){header{height:auto;padding-top:13px;padding-bottom:13px;align-items:flex-start}.brand small{display:none}nav{flex-wrap:wrap;justify-content:flex-end}nav button{padding:7px}.page{padding-top:42px}.hero h1{font-size:47px}.atom{display:none}.actions{flex-direction:column}.cards{grid-template-columns:1fr;margin-top:65px}.work-head>label{display:none}.result{grid-template-columns:1fr;gap:7px}.heading h2{font-size:39px}footer span{float:none;display:block;margin-top:5px}}
