:root{--bg:#111316;--panel:#17191d;--panel-2:#1e2126;--line:#2a2e35;--text:#e7e9ec;--muted:#9aa1ab;--accent:#f0b429;--red:#e5483d;--green:#3ccf6a;--blue:#5b8def;--mono:"JetBrains Mono", ui-monospace, Consolas, monospace;color:var(--text);background:var(--bg);font-family:Inter,Segoe UI,system-ui,sans-serif}*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden}#app{height:100vh;display:flex}#viewport{flex:1;min-width:0;position:relative}#viewport canvas{outline:none;display:block}body.holding #viewport canvas{cursor:crosshair!important}#panel{background:var(--panel);border-left:1px solid var(--line);flex:none;width:400px;padding:0 0 40px;font-size:13px;line-height:1.45;overflow-y:auto}#panel section{border-bottom:1px solid var(--line);padding:14px 18px}#panel h1{letter-spacing:-.01em;margin:0;font-size:17px}#panel h2{text-transform:uppercase;letter-spacing:.08em;color:var(--accent);margin:0 0 10px;font-size:12px}#panel h3{color:var(--text);margin:14px 0 8px;font-size:12.5px}#panel h3 small{color:var(--muted);font-weight:400}.brand{border-bottom:1px solid var(--line);background:linear-gradient(180deg, #1c1f24, var(--panel));justify-content:space-between;align-items:center;padding:16px 18px;display:flex}.brand p{color:var(--muted);margin:2px 0 0;font-size:11.5px}.brand a{color:var(--muted)}.lbl{color:var(--muted);margin-bottom:4px;font-size:11.5px;display:block}.desc{color:var(--muted);margin:8px 0 10px}select,input[type=number]{background:var(--panel-2);width:100%;color:var(--text);border:1px solid var(--line);font:inherit;border-radius:7px;padding:7px 9px}input[type=number]{width:84px;font-family:var(--mono)}button{font:inherit;color:var(--text);background:var(--panel-2);border:1px solid var(--line);cursor:pointer;border-radius:7px;padding:6px 10px;transition:background .12s,border-color .12s}button:hover{background:#252930;border-color:#3c424b}button.primary{background:var(--accent);color:#1b1405;border-color:var(--accent);width:100%;padding:9px;font-weight:700}button.ghost{background:0 0}button.small{padding:2px 8px;font-size:11.5px}button.icon{background:0 0;border:none;font-size:18px}kbd{font-family:var(--mono);color:var(--muted);border:1px solid #454b55;border-bottom-width:2px;border-radius:4px;padding:0 4px;font-size:10.5px}.views{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.views button{padding:6px 4px;font-size:12px}.row{margin:8px 0}.row.two{align-items:center;gap:14px;display:flex}.row.two label{color:var(--muted);align-items:center;gap:6px;display:flex}.row.buttons,.row.probes{gap:6px;display:flex}.row.buttons button{font-family:var(--mono);flex:1;font-size:12px}.row.probes button{flex:1;font-size:12px}.probe.red{border-left:4px solid var(--red)}.probe.black{border-left:4px solid #000}.seg{gap:4px;display:flex}.seg button{font-family:var(--mono);flex:1}.seg button.on{border-color:var(--red);color:#ffb3ad;background:#3a1d1b}.small{color:var(--muted);font-size:11.5px}.dot{vertical-align:-1px;border-radius:50%;width:9px;height:9px;display:inline-block}.dot.red{background:var(--red)}.dot.black{background:#000;border:1px solid #555}.ok{color:var(--green)}.bad{color:var(--red);font-weight:600}.warm{color:var(--accent)}.muted{color:var(--muted)}.warn{color:var(--accent);font-size:12px}.mono{font-family:var(--mono)}.readout{font-family:var(--mono);border:1px solid var(--line);color:#cfe0bd;background:#0c0d0f;border-radius:8px;padding:10px 12px;font-size:22px}.readout small{color:var(--muted);margin-left:6px;font-size:11px}.readout.psu .v{color:#ff5a4a}.readout.psu .a{color:#4cff6a}button.output{letter-spacing:.04em;width:100%;margin-top:4px;font-weight:700}button.output.on{border-color:var(--green);color:#b9f5c9;background:#163a20}.hint{color:#f4e7c2;background:#1b1d12;font-size:12.5px}.hint .i{margin-right:2px}.resistor{background:var(--panel-2);border:1px solid var(--line);border-radius:9px;margin-bottom:8px;padding:8px 10px}.resistor.selected{border-color:var(--accent)}.rhead{align-items:center;gap:10px;margin-bottom:6px;display:flex}.bands{background:#d8bf8f;border-radius:8px;gap:3px;padding:3px 7px;display:inline-flex}.bands.metal{background:#79a9d6}.bands i{border-radius:1px;width:6px;height:14px;display:inline-block}.rstate{margin-left:auto;font-size:11px;font-weight:700}.rctl{grid-template-columns:1.1fr 1.3fr .8fr;gap:5px;display:grid}.rctl select{padding:5px 6px;font-size:12px}.rinfo{color:var(--muted);justify-content:space-between;align-items:center;margin-top:6px;font-size:11.5px;display:flex}.jumpers{flex-wrap:wrap;gap:6px;display:flex}.jumpers button{border-left:5px solid var(--wire);font-family:var(--mono)}.jumpers button.off{opacity:.55;border-style:dashed;text-decoration:line-through}table{border-collapse:collapse;width:100%;margin-top:10px;font-size:12px}th{text-align:left;color:var(--muted);border-bottom:1px solid var(--line);padding:4px;font-weight:500}td{vertical-align:top;border-bottom:1px solid #22252b;padding:5px 4px}td.mono{white-space:nowrap}.x{color:var(--muted);background:0 0;border:none;padding:0 6px}.calc{margin-top:6px}.calc .row.two label{flex:1}.calc select{font-size:12px}.result{border:1px solid var(--line);background:#0c0d0f;border-radius:8px;margin-top:6px;padding:8px 10px}.result b{font-family:var(--mono);color:var(--accent);font-size:15px}.tasks{margin:0 0 10px;padding-left:18px}.tasks li{margin-bottom:6px}.check{color:var(--muted);align-items:center;gap:8px;margin:6px 0;display:flex}table.theory td span{font-family:var(--mono);font-size:11.5px;display:block}.truth{color:#8fd3ff}.help ul{color:var(--muted);margin:0;padding-left:18px}.tooltip{pointer-events:none;color:var(--text);opacity:0;z-index:20;background:#0e0f12f0;border:1px solid #333842;border-radius:8px;max-width:330px;padding:7px 10px;font-size:12.5px;transition:opacity .1s;position:fixed;top:0;left:0;box-shadow:0 6px 20px #00000059}.tooltip .k{color:var(--accent);font-size:11.5px}#toasts{z-index:30;pointer-events:none;flex-direction:column;gap:8px;display:flex;position:fixed;top:16px;left:calc(50vw - 200px);transform:translate(-50%)}.toast{border:1px solid #39404a;border-left:4px solid var(--blue);background:#14161af5;border-radius:8px;max-width:460px;padding:9px 14px;font-size:13px;transition:opacity .5s,transform .5s}.toast.bad{border-left-color:var(--red)}.toast.ok{border-left-color:var(--green)}.toast.out{opacity:0;transform:translateY(-6px)}#loading{z-index:50;background:#0a0b0dd1;place-items:center;transition:opacity .6s;display:grid;position:fixed;inset:0}#loading.done{opacity:0;pointer-events:none}#loading .box{flex-direction:column;gap:8px;width:320px;display:flex}#loading .label{color:var(--muted);font-size:12.5px}#loading .bar{background:#2a2e35;border-radius:2px;height:4px;overflow:hidden}#loading .bar i{background:var(--accent);width:0;height:100%;transition:width .3s;display:block}@media (width<=900px){#app{flex-direction:column}#viewport{flex:none;height:55vh}#panel{border-left:none;border-top:1px solid var(--line);width:100%}#toasts{left:50%}}body.capture *,body.capture :before,body.capture :after{transition:none!important}body.capture,body.capture #viewport canvas{cursor:none!important}body.capture .tooltip{font-size:14px}.cap-caption{border-left:5px solid var(--accent);pointer-events:none;opacity:0;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:15;background:#0c0d10d1;border-radius:10px;max-width:calc(100% - 72px);padding:14px 22px 15px 20px;position:absolute;bottom:34px;left:36px;box-shadow:0 10px 30px #00000059}.cap-caption b{letter-spacing:-.015em;font-size:30px;font-weight:800;line-height:1.15;display:block}.cap-caption span{color:#c3c8cf;margin-top:5px;font-size:18px;display:block}.cap-caption span:empty{display:none}.cap-card{z-index:70;opacity:0;pointer-events:none;background:radial-gradient(#0a0b0e8c,#0a0b0ee6);place-items:center;display:grid;position:fixed;inset:0}.cap-card .in{text-align:center;max-width:1100px;padding:0 40px}.cap-card small{color:var(--accent);letter-spacing:.14em;text-transform:uppercase;margin-bottom:16px;font-size:20px;font-weight:700;display:block}.cap-card h1{letter-spacing:-.03em;margin:0;font-size:76px;font-weight:800;line-height:1.02}.cap-card p{color:#c9ced6;margin:22px 0 0;font-size:26px;line-height:1.4}.cap-card p code{font-family:var(--mono);color:#fff;background:#ffffff14;border-radius:6px;padding:2px 10px}.cap-cursor{z-index:60;pointer-events:none;filter:drop-shadow(0 2px 3px #00000073);position:fixed;top:0;left:0}.cap-ripple{border:3px solid var(--accent);pointer-events:none;z-index:59;background:#f0b4292e;border-radius:50%;width:42px;height:42px;position:fixed}
