:root{--bg:#0d0d0d;--surface:#1a1a19;--surface-2:#232321;--border:#2f2f2c;--ink:#f0efec;--ink-2:#c3c2b7;--muted:#8a897f;--accent:#3987e5;--nav-w:clamp(210px, 12vw, 275px);--panel-w:clamp(250px, 15vw, 320px);--shell:2600px;--fs-ui:clamp(13px, .25vw + 9.5px, 16px);--fs-body:clamp(14px, .3vw + 9.5px, 17px);--fs-head:clamp(22px, .9vw + 8px, 30px);--fs-caption:clamp(12px, .15vw + 10px, 14px);color:var(--ink);background:var(--bg);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:system-ui,-apple-system,sans-serif}*{box-sizing:border-box}body{min-height:100vh;margin:0}#app{grid-template-columns:var(--nav-w) minmax(0, 1fr);min-height:100vh;max-width:var(--shell);margin-inline:auto;display:grid}nav{border-right:1px solid var(--border);height:100vh;padding:clamp(18px,1vw,26px) clamp(12px,.7vw,18px);position:sticky;top:0;overflow-y:auto}nav .brand{padding:0 8px 14px;font-size:clamp(15px,.2vw + 12.5px,18px);font-weight:650}nav .group{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding:14px 8px 6px;font-size:clamp(11px,.1vw + 9.5px,13px)}nav a{color:var(--ink-2);border-radius:6px;padding:clamp(6px,.4vh,9px) clamp(8px,.5vw,12px);font-size:clamp(14px,.2vw + 11.5px,17px);text-decoration:none;display:block}nav a:hover{background:var(--surface)}nav a[aria-current=page]{background:var(--surface-2);color:var(--ink)}main{min-width:0;padding:clamp(22px,1vw + 8px,36px) clamp(26px,1.2vw + 9px,52px) clamp(40px,3vw,72px)}.lesson-head h1{font-size:var(--fs-head);margin:0 0 6px;font-weight:650;line-height:1.2}.lesson-head p{color:var(--ink-2);max-width:75ch;line-height:1.5;font-size:var(--fs-body);margin:0 0 18px}.lesson-body{grid-template-columns:minmax(0, 1fr) var(--panel-w);align-items:start;gap:clamp(18px,1vw,28px);display:grid}.stage{gap:clamp(12px,.7vw,18px);min-width:0;display:grid}.stage.two{grid-template-columns:1fr 1fr}.plot-wrap{min-width:0}.cap{font-size:var(--fs-caption);color:var(--muted);margin:0 0 6px}canvas.plot{width:100%;height:calc(var(--plot-h,420px) * var(--plot-scale,1));border:1px solid var(--border);touch-action:none;cursor:crosshair;border-radius:8px;display:block}.panel{background:var(--surface);border:1px solid var(--border);border-radius:8px;flex-direction:column;gap:clamp(14px,.6vw,20px);padding:clamp(14px,.5vw + 8px,22px);display:flex}.ctl{font-size:var(--fs-ui);color:var(--ink-2);flex-direction:column;gap:6px;display:flex}.ctl .row{justify-content:space-between;display:flex}.ctl .val{color:var(--ink);font-family:ui-monospace,monospace}input[type=range]{width:100%;accent-color:var(--accent)}.check{font-size:var(--fs-ui);color:var(--ink-2);align-items:center;gap:8px;display:flex}.check input{accent-color:var(--accent)}button{font:inherit;font-size:var(--fs-ui);border:1px solid var(--border);background:var(--surface-2);color:var(--ink);cursor:pointer;border-radius:6px;padding:clamp(6px,.3vw,9px) clamp(10px,.5vw,14px)}button:hover{border-color:#4a4a46}button.primary{background:var(--accent);border-color:var(--accent);color:#fff}.btns{flex-wrap:wrap;gap:6px;display:flex}.seg{background:var(--bg);border-radius:7px;flex-wrap:wrap;gap:2px;padding:2px;display:flex}.seg button{color:var(--ink-2);background:0 0;border:0;flex:1;padding:5px 6px}.seg button[aria-pressed=true]{background:var(--surface-2);color:var(--ink)}.stats{font-size:var(--fs-ui);grid-template-columns:auto 1fr;gap:4px 10px;margin:0;display:grid}.stats dt{color:var(--muted)}.stats dd{text-align:right;margin:0;font-family:ui-monospace,monospace}.legend{font-size:var(--fs-caption);color:var(--ink-2);flex-wrap:wrap;gap:4px 12px;display:flex}.legend .item{align-items:center;gap:6px;display:inline-flex}.legend .sw.dot{border-radius:50%;width:9px;height:9px}.legend .sw.line{width:14px;height:2px}.hint{font-size:var(--fs-caption);color:var(--muted);margin:0;line-height:1.45}.notes{color:var(--ink-2);max-width:78ch;line-height:1.55;font-size:var(--fs-body);margin-top:22px}.notes h2{color:var(--ink);margin:18px 0 6px;font-size:clamp(15px,.3vw + 10.5px,18px)}code,kbd{background:var(--surface-2);border-radius:4px;padding:1px 4px;font-family:ui-monospace,monospace;font-size:.92em}@media (width>=1400px){:root{--plot-scale:1.1}}@media (width>=1700px){:root{--plot-scale:1.25}}@media (width>=2000px){:root{--plot-scale:1.4}}@media (width>=2500px){:root{--plot-scale:1.55}}@media (width<=860px){#app{grid-template-columns:1fr}nav{border-right:0;border-bottom:1px solid var(--border);height:auto;position:static}.lesson-body,.stage.two{grid-template-columns:1fr}}table.cm{border-collapse:collapse;font-size:var(--fs-ui);font-family:ui-monospace,monospace}table.cm th,table.cm td{border:1px solid var(--border);text-align:center;padding:8px 12px}table.cm th{color:var(--muted);font-family:system-ui,sans-serif;font-weight:500}table.cm td.bad{color:#e66767}.notes b{color:var(--ink);font-weight:600}.conv-row{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}canvas.grid-canvas{aspect-ratio:1;border:1px solid var(--border);touch-action:none;cursor:crosshair;border-radius:6px;width:100%;display:block}pre.calc{background:var(--surface);border:1px solid var(--border);color:var(--ink-2);white-space:pre-wrap;word-break:break-word;border-radius:8px;margin:0;padding:10px 12px;font-size:12px}.kgrid{grid-template-columns:repeat(3,1fr);gap:4px;display:grid}.kgrid input{background:var(--bg);width:100%;color:var(--ink);border:1px solid var(--border);text-align:center;border-radius:4px;padding:5px 4px;font:13px ui-monospace,monospace}.mini-row{grid-template-columns:repeat(6,1fr);gap:8px;display:grid}.mini-row canvas.plot{cursor:default}.scroll{overflow-x:auto}table.onehot td,table.onehot th{font-size:var(--fs-caption);padding:5px 8px}table.onehot td.on{color:var(--ink);background:#3987e54d}.rec-row{grid-template-columns:1.2fr 1fr;align-items:start;gap:12px;display:grid}table.rec td{cursor:pointer;min-width:34px;padding:6px 4px}table.rec td.known{color:var(--ink);font-weight:700}table.rec td.pred{color:var(--muted)}table.rec th.mv{writing-mode:vertical-rl;height:90px;padding:6px 2px;font-size:11px;transform:rotate(180deg)}@media (width<=1100px){.rec-row{grid-template-columns:1fr}}.map{grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px;display:grid}.map section{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:14px 16px}.map h2{align-items:baseline;gap:10px;margin:0 0 10px;font-size:15px;display:flex}.map h2 span{color:var(--muted);font-family:ui-monospace,monospace;font-size:13px}.map ul{font-size:var(--fs-ui);gap:8px;margin:0;padding:0;list-style:none;display:grid}.map li{flex-direction:column;gap:2px;display:flex}.map a{color:#86b6ef;text-decoration:none}.map a:hover{text-decoration:underline}.map .nolink{color:var(--ink)}.map .note{color:var(--muted);font-size:var(--fs-caption);line-height:1.4}.notes a{color:#86b6ef}.readmore{font-size:var(--fs-ui);color:var(--muted);max-width:90ch;margin:-8px 0 18px;line-height:1.6}.readmore a{color:#86b6ef;text-decoration:none}.readmore a:hover{text-decoration:underline}.map h2 a.pg{white-space:nowrap;margin-left:auto;font-size:12px;font-weight:400}
