:root{--bg:#f7f7f5;--fg:#1c1c1c;--muted:#666;--line:#9a9a9a;--lit:#1f9d55;--lit-bg:#d9f5e3;--accent:#2b59c3;--code-bg:#f0f0ee;color:var(--fg);background:var(--bg);font-family:system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.5}*{box-sizing:border-box}body{margin:0}.site-header{background:#fff;border-bottom:1px solid #ddd;flex-wrap:wrap;align-items:flex-start;gap:1rem;padding:.75rem 1rem;display:flex}.brand{color:var(--fg);font-weight:700;text-decoration:none}.nav{flex-wrap:wrap;gap:1.25rem;display:flex}.nav-title{text-transform:uppercase;color:var(--muted);font-size:.8rem;display:block}.nav ul{flex-wrap:wrap;gap:.25rem .75rem;margin:.25rem 0 0;padding:0;list-style:none;display:flex}.nav a{color:var(--accent)}.nav a.active{font-weight:700;text-decoration:underline}.content{max-width:1100px;margin:0 auto;padding:1rem}.page h1{font-size:1.4rem}.page h2{margin-top:1.5rem;font-size:1.1rem}.hint{color:var(--muted);font-size:.9rem}.note{background:#fff8e1;border-left:3px solid #e0a800;padding:.5rem .75rem}.circuit-grid{grid-template-columns:minmax(0,2fr) minmax(0,1fr);align-items:start;gap:1rem;display:grid}.diagram{background:#fff;border:1px solid #ddd;border-radius:6px;width:100%;position:relative;overflow:hidden}.diagram-svg{width:100%;height:100%;position:absolute;inset:0}.wire{fill:none;stroke:var(--line);stroke-width:2px}.wire.lit{stroke:var(--lit);stroke-width:3px}.gate-body{fill:#fff;stroke:#333;stroke-width:2px}.gate-body.lit{fill:var(--lit-bg);stroke:var(--lit)}.gate-extra{fill:none;stroke:#333;stroke-width:2px}.bubble{fill:#fff;stroke:#333;stroke-width:2px}.junction{fill:#333}.wire-value{fill:var(--muted);font-size:11px}.wire-value.on{fill:var(--lit);font-weight:700}.out-box{fill:#fff;stroke:#333;stroke-width:2px}.out-box.lit{fill:var(--lit-bg);stroke:var(--lit)}.block{fill:#fafafa;stroke:#333;stroke-width:2px}.block.lit{fill:var(--lit-bg);stroke:var(--lit)}.block-title{fill:var(--fg);font-size:13px;font-weight:700}.pin-name{fill:var(--muted);font-size:11px}.node-label{fill:var(--fg);font-size:13px}.node-value{fill:var(--fg);font-size:15px;font-weight:700}.toggle{font:inherit;cursor:pointer;background:#fff;border:1px solid #888;border-radius:4px;flex-direction:row;justify-content:space-between;align-items:center;gap:3px;padding:0 5px;font-size:12px;display:flex;position:absolute;transform:translateY(0)}.toggle:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.toggle.on{background:var(--lit-bg);border-color:var(--lit)}.toggle-name{white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-weight:600;overflow:hidden}.toggle-value{font-weight:700}.code{background:var(--code-bg);white-space:pre;border-radius:6px;margin:0;padding:.75rem;font-size:.85rem;overflow-x:auto}.code-line{display:inline}.code-line.active{background:var(--lit-bg);font-weight:700}.bit-row{flex-wrap:wrap;gap:.25rem;margin:.5rem 0;display:flex}.bit-cell{flex-direction:column;align-items:center;display:flex}.bit{min-width:2.25rem;min-height:2.25rem;font:inherit;cursor:pointer;background:#fff;border:1px solid #888;border-radius:4px;font-weight:700}.bit.on{background:var(--lit-bg);border-color:var(--lit);color:#145c33}.bit:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.weight,.row-label{color:var(--muted);font-size:.8rem}.bit-value{font-weight:700}.weights{flex-wrap:wrap;gap:.5rem;display:flex}.weight-cell{flex-direction:column;align-items:center;min-width:2.5rem;display:flex}.mux-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem;margin:1rem 0;display:grid}.mux-input{margin-bottom:.5rem}.panel{background:#fff;border:1px solid #ddd;border-radius:6px;padding:.75rem}.readout{margin:.75rem 0}.card{background:#fff;border:1px solid #ddd;border-radius:6px;margin-bottom:.75rem;padding:.75rem 1rem}.card h2{margin-top:0}.steps,.values{border-collapse:collapse;background:#fff;margin:.75rem 0}.steps th,.steps td,.values th,.values td{text-align:right;border:1px solid #ddd;padding:.3rem .6rem}.field,.choice{margin:.5rem 0;display:block}.field input,.field select{font:inherit;width:8rem;padding:.25rem .4rem}.choice{border:none;padding:0}@media (width<=760px){.circuit-grid,.mux-grid{grid-template-columns:minmax(0,1fr)}.nav{gap:.75rem}}.circuit-grid.wide{grid-template-columns:minmax(0,1fr)}.diagram-scroll{padding:2px;overflow-x:auto}.wire-underlay{fill:none;stroke:#fff;stroke-width:6px}.wide .wire-value,.wide .pin-name{font-size:14px}.wide .block-title{font-size:17px}.wide .node-label{font-size:15px}.mux-diagram{background:#fff;border:1px solid #ddd;border-radius:6px;width:100%;min-width:540px;max-width:820px;display:block}.mux-caption{fill:var(--fg);font:15px system-ui,sans-serif}@media (width<=480px){.steps th,.steps td,.values th,.values td{padding:.3rem .35rem;font-size:.875rem}}