:root{--bg:#eef1f4;--panel:#fff;--ink:#14181d;--muted:#5b6673;--line:#d4dae1;--copper:#b4611a;--copper-deep:#8a4a12;--safety:#f2b705;--ok:#1f7a3d;--err:#b3261e;--wire-hot:#1a1a1a;--wire-neutral:#f5f5f2;--wire-ground:#2e7d32;--brass:#c9a227;--silver:#9aa4ad;--font-display:"Chakra Petch", system-ui, sans-serif;--font-body:"Archivo", system-ui, sans-serif;--font-mono:"IBM Plex Mono", ui-monospace, monospace}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--ink);font-family:var(--font-body);margin:0;padding:0;font-size:16px;line-height:1.6}a{color:var(--copper-deep);text-decoration:none}a:hover{text-decoration:underline}.wrap{max-width:980px;margin:0 auto;padding:0 20px}.nav{border-bottom:2px solid var(--ink);background:var(--panel);z-index:20;position:sticky;top:0}.nav-inner{justify-content:space-between;align-items:center;gap:16px;max-width:980px;margin:0 auto;padding:12px 20px;display:flex}.logo{font-family:var(--font-display);letter-spacing:.02em;color:var(--ink);font-size:18px;font-weight:700}.logo:hover{text-decoration:none}.logo .amp{color:var(--copper)}.nav-links{gap:18px;font-size:14px;display:flex}.nav-links a{color:var(--ink);font-family:var(--font-display);letter-spacing:.04em;text-transform:uppercase;border-bottom:2px solid #0000;padding:2px 0;font-size:12.5px}.nav-links a:hover{border-bottom-color:var(--copper);text-decoration:none}.eyebrow{font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--copper-deep);border:1px solid var(--copper);background:#faf3ea;border-radius:2px;padding:3px 8px;font-size:11.5px;display:inline-block}h1,h2,h3{font-family:var(--font-display);line-height:1.2}h1{margin:14px 0 10px;font-size:clamp(30px,6vw,46px);font-weight:700}h2{margin:0 0 8px;font-size:24px}h3{margin:0 0 6px;font-size:17px}.sub{color:var(--muted);max-width:62ch}.panel{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:22px}.panel+.panel{margin-top:16px}.kv{background:var(--line);border:1px solid var(--line);border-radius:4px;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1px;margin:18px 0;display:grid;overflow:hidden}.kv>div{background:var(--panel);padding:10px 14px}.kv .k{font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-size:10.5px}.kv .v{font-family:var(--font-display);font-size:15px;font-weight:600}.btn{font-family:var(--font-display);letter-spacing:.05em;text-transform:uppercase;background:var(--ink);color:#fff;border:2px solid var(--ink);cursor:pointer;border-radius:4px;padding:10px 18px;font-size:14px;display:inline-block}.btn:hover{background:var(--copper-deep);border-color:var(--copper-deep);text-decoration:none}.btn.ghost{color:var(--ink);background:0 0}.btn.ghost:hover{background:var(--ink);color:#fff}.btn:disabled{opacity:.45;cursor:not-allowed}.btn:focus-visible,a:focus-visible{outline:3px solid var(--safety);outline-offset:2px}.wire-rule{border:1px solid var(--line);border-radius:3px;height:14px;margin:26px 0;display:flex;overflow:hidden}.wire-rule span:first-child{background:var(--wire-hot);flex:1}.wire-rule span:nth-child(2){background:var(--wire-neutral);border-left:1px solid var(--line);border-right:1px solid var(--line);flex:1}.wire-rule span:nth-child(3){background:var(--wire-ground);flex:1}.lesson-card{background:var(--panel);border:1px solid var(--line);border-left:5px solid var(--copper);color:var(--ink);border-radius:4px;margin-bottom:12px;padding:16px 18px;display:block}.lesson-card:hover{border-color:var(--ink);border-left-color:var(--copper);text-decoration:none}.lesson-card .meta{font-family:var(--font-mono);letter-spacing:.08em;color:var(--muted);text-transform:uppercase;font-size:11px}.lesson-card h3{margin-top:4px}.quiz-q{margin-bottom:20px}.quiz-q p.qt{margin:0 0 8px;font-weight:600}.opt{text-align:left;width:100%;font:inherit;background:var(--bg);border:1px solid var(--line);cursor:pointer;border-radius:4px;margin-bottom:8px;padding:10px 12px;display:block}.opt:hover{border-color:var(--ink)}.opt.picked{border-color:var(--copper);background:#faf3ea}.opt.correct{border-color:var(--ok);background:#ecf6ef}.opt.wrong{border-color:var(--err);background:#fbeeee}.explain{border-left:3px solid var(--safety);background:#fdf7e3;margin:4px 0 0;padding:8px 12px;font-size:14px}.score{font-family:var(--font-display);font-size:18px;font-weight:700}.solver-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;display:grid}.field label{font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:4px;font-size:11px;display:block}.field input,.field select{width:100%;font-family:var(--font-mono);border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:4px;padding:9px 10px;font-size:15px}.field input:focus,.field select:focus{outline:3px solid var(--safety);outline-offset:1px}.steps{font-family:var(--font-mono);background:var(--ink);color:#e8ecef;border-radius:4px;margin-top:14px;padding:14px 16px;font-size:14px;overflow-x:auto}.steps .result{color:var(--safety);font-weight:700}.note{color:var(--muted);font-size:13px}.sandbox-status{font-family:var(--font-display);border-radius:4px;margin-top:12px;padding:10px 14px;font-weight:600}.sandbox-status.ok{border:1px solid var(--ok);color:var(--ok);background:#ecf6ef}.sandbox-status.err{border:1px solid var(--err);color:var(--err);background:#fbeeee}.sandbox-status.idle{background:var(--bg);border:1px solid var(--line);color:var(--muted)}footer.site{border-top:2px solid var(--ink);background:var(--panel);color:var(--muted);margin-top:60px;padding:22px 0 30px;font-size:13px}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}.notice{border:1px solid var(--safety);border-left:5px solid var(--safety);background:#fdf7e3;border-radius:4px;margin:18px 0;padding:12px 16px;font-size:13.5px;line-height:1.55}@keyframes flow{to{stroke-dashoffset:-24px}}.energized{stroke-dasharray:10 6;animation:.7s linear infinite flow}.lamp-on{animation:1.6s ease-in-out infinite glow}@keyframes glow{0%,to{opacity:1}50%{opacity:.72}}.probe{font-family:var(--font-mono);font-size:10.5px}@media (max-width:720px){.nav-inner{gap:10px;padding:10px 14px}.nav-links{scrollbar-width:none;-webkit-overflow-scrolling:touch;gap:14px;overflow-x:auto}.nav-links::-webkit-scrollbar{display:none}.nav-links a{white-space:nowrap}.logo{font-size:15px}}
