@font-face{font-family:Space;src:url('assets/space-grotesk-400.woff2')}@font-face{font-family:Space;src:url('assets/space-grotesk-600.woff2');font-weight:600}@font-face{font-family:Plex;src:url('assets/plex-mono.woff2')}
:root{--paper:#f4f6f8;--ink:#20242a;--muted:#646c78;--line:#d8dde4;--green:#c4f566;--purple:#b59af0;--edge:clamp(24px,5.55vw,100px);--pad:336px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:76px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Space,Arial,sans-serif}button,input,a{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{font:inherit;cursor:pointer;color:inherit;border:0;background:none}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,summary:focus-visible,canvas:focus-visible,input:focus-visible{outline:2px solid currentColor;outline-offset:4px}button:active{transform:translateY(1px)}h1,h2,h3,p{margin:0}h1,h2{font-weight:600;letter-spacing:-.05em;line-height:1.05}p{font-size:17px;line-height:1.5}canvas{touch-action:none;cursor:crosshair}.mono{font-family:Plex,monospace;font-size:13px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.site-header{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 var(--edge);position:sticky;top:0;z-index:20;background:var(--paper);border-bottom:1px solid var(--line)}.wordmark{font-size:27px;letter-spacing:-1px;font-weight:600;display:flex;align-items:center;gap:11px}.wordmark>span{font-size:28px;font-weight:400}.site-header nav{display:flex;gap:36px;font-size:14px}.site-header a:hover{opacity:.65}.hero{min-height:calc(100svh - 76px);padding:90px var(--edge) 130px;display:flex;align-items:center}.experiment{width:100%;display:grid;grid-template-columns:var(--pad) minmax(300px,1fr) 200px;gap:22px}.experiment h1{font-size:25px;letter-spacing:-.035em}.experiment h2{font-size:16px;letter-spacing:-.015em;font-weight:400}.draw-panel>h1,.panel-heading,.prediction-panel>h2{height:49px;display:flex;align-items:flex-start}.panel-heading{justify-content:space-between}.panel-heading button{font-size:22px;line-height:1}.draw-surface{position:relative;width:var(--pad);height:var(--pad)}.draw-surface canvas{display:block;width:100%;height:100%;border-radius:2px}.canvas-corner{position:absolute;bottom:10px;right:12px;font-family:Plex,monospace;font-size:12px;color:#c5cbd3;pointer-events:none}#drawHint{position:absolute;inset:0;display:grid;place-items:center;color:#c5cbd3;font-size:18px;pointer-events:none}#drawHint[hidden]{display:none}.draw-actions{display:flex;justify-content:space-between;align-items:center;padding-top:15px;gap:10px}.digit-presets{display:flex;gap:3px}.digit-presets button{height:34px;min-width:34px;font-family:Plex,monospace;font-size:13px;border:1px solid transparent;border-radius:2px}.digit-presets .selected{border-color:var(--ink);background:#e6eaf0}.digit-presets button:hover{background:#e6eaf0}.text-button{font-size:13px;white-space:nowrap;padding:8px 0}.text-button:hover{text-decoration:underline}.network-panel{min-width:0}.network-panel svg{display:block;width:100%;height:336px;overflow:visible}.signal-status{display:block;margin-top:43px;font-size:13px;color:var(--muted)}.predictions{padding-top:0}.prediction-row{height:35px;display:grid;grid-template-columns:17px minmax(20px,1fr) 57px;gap:9px;align-items:center;font-family:Plex,monospace;font-size:12px;color:var(--muted)}.prediction-row>span:first-child{font-size:16px;color:var(--ink)}.prediction-track{height:7px;background:#e1e5eb}.prediction-fill{display:block;height:100%;background:#a5adb8;transition:width .35s ease}.prediction-score{text-align:right;font-size:12px}.winner .prediction-fill,.contender .prediction-fill{background:var(--green)}.winner .prediction-score,.contender .prediction-score{color:var(--ink)}.winner .prediction-row{font-weight:600}.weights-section{background:var(--ink);color:var(--paper);padding:0 var(--edge)}.weight-stage{min-height:calc(100svh - 76px);padding:64px 0 54px;display:flex;flex-direction:column;justify-content:center}.weight-heading{display:flex;align-items:center;justify-content:space-between}.weight-heading h2,.section-intro h2{font-size:48px}.skip{font-size:13px;color:#c5cbd3}.unfold-caption{font-size:17px;line-height:1.5;color:#c5cbd3;margin-top:18px}#unfold{width:100%;height:340px;display:block;margin:32px 0 34px;touch-action:none;overflow:visible}.weight-controls{width:min(680px,100%);margin:0 auto}.slider-title{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:14px}.slider-title strong{font-weight:400;font-family:Plex,monospace;font-size:13px}#weightLabel{margin-left:9px}.weight-controls input,.timeline-control input{width:100%;margin:19px 0 9px;appearance:none;height:2px;display:block;background:#707984;border:0;cursor:pointer}.weight-controls input::-webkit-slider-thumb,.timeline-control input::-webkit-slider-thumb{appearance:none;width:17px;height:17px;border-radius:50%;background:var(--paper);border:2px solid var(--ink)}.slider-scale{display:flex;justify-content:space-between;font-family:Plex,monospace;font-size:12px;color:#c5cbd3}.chapter{padding:90px var(--edge) 100px;min-height:calc(100svh - 76px)}.section-intro{display:flex;justify-content:space-between;align-items:flex-end;margin:0 auto 40px;max-width:1000px}.section-intro p{color:var(--muted);font-size:17px}.map-workspace{width:min(504px,100%);margin:auto}.map-tools{display:flex;justify-content:space-between;align-items:center;gap:12px;height:48px;font-size:13px}.map-tools button{padding:8px 10px;border-radius:2px;color:var(--muted)}.map-tools .active{background:#dfe4eb;color:var(--ink)}.neuron-picker{position:relative}.neuron-picker summary{display:flex;align-items:center;gap:14px;list-style:none;cursor:pointer;min-height:42px}.neuron-picker summary::-webkit-details-marker{display:none}.neuron-grid{position:absolute;top:46px;left:0;width:336px;background:var(--paper);border:1px solid var(--line);padding:12px;display:grid;grid-template-columns:repeat(8,1fr);gap:5px;z-index:10;box-shadow:0 12px 30px #20242a18}.neuron-grid button{height:49px;min-width:0;padding:3px;border:1px solid transparent;border-radius:2px}.neuron-grid canvas{display:block;width:28px;height:28px;margin:auto;image-rendering:pixelated}.neuron-grid span{font-family:Plex,monospace;font-size:10px;display:block;line-height:14px}.neuron-grid button[aria-pressed=true]{border-color:var(--ink)}.neuron-grid button:hover{background:#e1e5eb}.map-toggle{display:flex;gap:5px;align-items:center}.map-toggle input{accent-color:var(--ink);width:14px;height:14px}#weightMap{display:block;width:100%;height:auto;aspect-ratio:1;image-rendering:pixelated;background:var(--ink);border-radius:2px}.map-caption{display:flex;justify-content:space-between;padding-top:16px;font-family:Plex,monospace;font-size:12px;color:var(--muted)}.map-caption strong{font-weight:400;color:var(--ink)}.training-section{border-top:1px solid var(--line)}.practice-sheet{max-width:1000px;margin:auto}.sheet-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;font-size:14px;color:var(--muted)}.sheet-heading strong{color:var(--ink);font-weight:400}.training-grid{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:3px;perspective:900px}.training-tile{position:relative;aspect-ratio:1;background:var(--ink);border:1px solid transparent;padding:14%;border-radius:1px}.training-tile canvas{display:block;width:100%;height:100%;image-rendering:pixelated;cursor:inherit}.training-tile:hover,.training-tile.selected{border-color:#8b949f;background:#2a3038}.training-tile.selected:after{content:attr(data-guess);position:absolute;bottom:3px;right:4px;color:var(--paper);font-family:Plex,monospace;font-size:10px}.training-console{margin-top:24px;display:flex;gap:50px;align-items:flex-end;justify-content:space-between}.training-actions{display:flex;gap:22px;align-items:center}.outline-button{padding:13px 17px;border:1px solid var(--ink);border-radius:2px;font-size:14px;white-space:nowrap}.outline-button:hover{background:#e1e5eb}.timeline-control{flex:1;max-width:500px;min-width:0}.timeline-control label{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--muted)}.timeline-control label strong{font-family:Plex,monospace;font-size:12px;font-weight:400;color:var(--ink)}.timeline-control input{background:#a5adb8;margin:15px 0 12px}.timeline-control input::-webkit-slider-thumb{background:var(--ink);border:0}.site-footer{padding:28px var(--edge);display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);color:var(--muted)}.site-footer p,.site-footer a{font-size:13px}
@media(min-width:761px) and (max-width:1120px){:root{--edge:32px;--pad:280px}.experiment{grid-template-columns:280px minmax(200px,1fr) 160px;gap:16px}.network-panel svg{height:280px}.prediction-row{height:29px;grid-template-columns:15px minmax(20px,1fr) 50px;gap:5px}.hero{padding-top:70px}.signal-status{margin-top:36px}}
@media(max-width:760px){:root{--edge:24px;--pad:280px}html{scroll-padding-top:64px}.site-header{height:64px}.wordmark{font-size:23px;gap:8px}.wordmark>span{font-size:24px}.site-header nav{gap:17px;font-size:12px}.hero{min-height:calc(100svh - 64px);padding:40px var(--edge) 45px;align-items:flex-start}.experiment{grid-template-columns:1fr;gap:27px}.draw-panel{width:280px;margin:auto}.draw-panel>h1{height:42px;font-size:25px}.draw-actions{padding-top:10px}.network-panel{width:100%}.panel-heading{height:33px}.experiment h2{font-size:14px}.network-panel svg{height:125px}.signal-status{margin-top:27px;font-size:12px}.prediction-panel{margin-top:7px}.prediction-panel h2{height:30px}.predictions{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.prediction-row{height:27px;grid-template-columns:15px minmax(15px,1fr) 48px;gap:6px;font-size:12px}.prediction-row>span:first-child{font-size:14px}.prediction-score{font-size:11px}.weights-section{padding:0 var(--edge)}.weight-stage{min-height:calc(100svh - 64px);padding:40px 0 45px;justify-content:center}.weight-heading h2,.section-intro h2{font-size:35px}.unfold-caption{font-size:15px;margin-top:13px;max-width:290px}#unfold{height:300px;margin:30px 0 35px}.slider-title{font-size:13px;gap:8px}.slider-title strong{font-size:11px}.slider-title .text-button{font-size:12px}.chapter{padding:62px var(--edge) 68px;min-height:0}.section-intro{display:block;margin-bottom:30px}.section-intro p{font-size:15px;margin-top:16px;line-height:1.5}.map-tools{gap:4px;font-size:12px}.map-tools button{padding:8px}.neuron-picker summary{gap:9px}.neuron-grid{width:336px;left:0}.map-caption{font-size:11px;padding-top:13px}.sheet-heading{font-size:12px;gap:12px;line-height:1.4;margin-bottom:14px}.sheet-heading .mono{font-size:11px}.training-grid{gap:2px}.training-tile{padding:10%}.training-console{display:block;margin-top:22px}.training-actions{justify-content:space-between;margin-bottom:25px}.timeline-control{max-width:none}.training-tile.selected:after{font-size:8px;bottom:1px;right:1px}.site-footer{align-items:flex-start;gap:22px;padding-top:24px;padding-bottom:24px}.site-footer p{max-width:210px;font-size:12px}.site-footer a{font-size:12px;white-space:nowrap}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
/* art-1 visual pass 2: align the chain and let the figures carry the page. */
.prediction-row{height:calc(var(--pad) / 10)}
.map-workspace{width:min(448px,100%)}
.practice-sheet{max-width:880px}
.training-tile{aspect-ratio:2;padding:0}
.training-tile canvas{position:absolute;left:30%;top:10%;width:40%;height:80%}
@media(max-width:760px){:root{--pad:224px}.hero{padding-top:24px;padding-bottom:30px}.experiment{gap:18px}.draw-panel{width:224px}.draw-actions{gap:6px}.digit-presets{gap:0}.digit-presets button{min-width:27px;padding:0 4px}#ambiguous{font-size:12px}.draw-actions .text-button{font-size:12px}.prediction-panel{margin-top:0}.prediction-row{height:25px}.signal-status{margin-top:26px}.neuron-grid{width:336px}.training-tile{aspect-ratio:1}.training-tile canvas{left:10%;top:10%;width:80%;height:80%}.neuron-grid button{height:49px}.neuron-grid span{font-size:12px}}
.neuron-grid{grid-template-columns:repeat(7,1fr)}
.neuron-grid canvas{background:var(--ink)}
@media(max-width:760px){.prediction-score,.map-caption,.sheet-heading .mono,.slider-title strong{font-size:12px}.site-footer p{font-size:13px}}
/* Native chapter jumps keep controls and their hit areas in the same place. */
html{scroll-behavior:auto}

/* fix-3: keep the judgment boundary and the sum inside their existing figures. */
.prediction-limit{font-size:13px;line-height:1.45;color:var(--muted);margin-top:18px;max-width:200px}
.weight-equation{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:16px;margin-top:16px;font-size:14px;line-height:1.4;color:#c5cbd3}
.weight-equation>span:not(.operator){display:flex;justify-content:center;gap:9px;white-space:nowrap}
.weight-equation strong{font-family:Plex,monospace;font-size:14px;font-weight:400;color:var(--paper)}
.weight-equation .operator{font-family:Plex,monospace;font-size:17px}
.site-footer{justify-content:flex-end}
@media(max-width:760px){.prediction-limit{max-width:none;margin-top:10px;font-size:13px}.weight-equation{gap:8px;font-size:13px;margin-top:15px}.weight-equation>span:not(.operator){display:flex;flex-direction:column;gap:4px;text-align:center}.weight-equation strong{font-size:14px}#unfold{margin-bottom:22px}}

/* 0.19.1: keep the experiments legible and let their signals carry the detail. */
:root{--ease:cubic-bezier(.2,.7,.2,1);--short:180ms}
::selection{background:var(--green);color:var(--ink)}
body{font-variant-numeric:tabular-nums}
.wordmark{font-size:28px;letter-spacing:-1.2px}
.experiment h1{font-size:30px;font-weight:400;letter-spacing:-.055em}
.panel-heading{align-items:flex-start}
#replay{font-size:13px;line-height:1.3;padding-top:0;min-width:65px;text-align:right}
.weight-heading h2,.section-intro h2{font-weight:400;letter-spacing:-.055em;font-size:52px}
button,a,summary{transition:color var(--short) var(--ease),background-color var(--short) var(--ease),border-color var(--short) var(--ease),transform var(--short) var(--ease)}
.digit-presets button:hover,.map-tools button:hover{background:#e1e5eb}
button:active{transform:translateY(1px) scale(.98)}
.unfold-caption{max-width:760px;min-height:26px}
.weight-equation>span:last-child strong{color:var(--green)}
.weight-controls input{height:3px;background:linear-gradient(to right,var(--purple),#707984 50%,var(--green))}
.weight-controls input::-webkit-slider-thumb{width:20px;height:20px;box-shadow:0 0 0 1px #8993a0}
.neuron-grid{padding:12px;gap:6px;box-shadow:0 2px 5px #20242a0a,0 14px 35px #20242a12}
.neuron-grid button{transition:background-color var(--short) var(--ease),border-color var(--short) var(--ease)}
.training-grid{background:var(--ink);gap:1px;padding:1px;perspective:none}
.training-tile{border:0;border-radius:0;background:var(--ink)}
.training-tile:hover,.training-tile.selected{background:#30363e;box-shadow:inset 0 0 0 1px #87919e}
.training-tile:focus-visible{outline-color:var(--green);outline-offset:-2px;z-index:1}
.training-console{align-items:center}
.outline-button{background:var(--ink);color:var(--paper);border-color:var(--ink);min-width:145px;min-height:44px}
.outline-button:hover{background:#363d46}
.timeline-control{max-width:500px}
.timeline-control label{font-size:13px}
.timeline-control label strong{font-size:13px;white-space:nowrap}
.timeline-control input{height:3px;background:linear-gradient(to right,var(--ink) var(--recorded,0%),var(--line) var(--recorded,0%));margin-bottom:0}
.timeline-control input:disabled{cursor:default;opacity:.45}
.timeline-control input::-webkit-slider-thumb{width:18px;height:18px;box-shadow:0 0 0 3px var(--paper)}
@media(max-width:760px){
 .wordmark{font-size:24px}
 .site-header nav{font-size:13px;gap:17px}
 .hero{padding-top:20px}
 .experiment{gap:14px}
 .draw-panel>h1{font-size:28px;height:36px}
 .network-panel svg{height:125px}
 .signal-status{margin-top:44px;font-size:13px}
 .weight-heading h2,.section-intro h2{font-size:38px}
 .unfold-caption{max-width:none;min-height:45px}
 .neuron-grid{width:min(336px,calc(100vw - 48px))}
 .training-tile canvas{left:14%;top:14%;width:72%;height:72%}
 .map-caption{font-size:12px}
 .timeline-control label strong{font-size:12px}
 .outline-button{min-width:145px}
}
@media(prefers-reduced-motion:reduce){button,a,summary{transition:none}}
html[data-motion="reduce"] *,html[data-motion="reduce"] *:before,html[data-motion="reduce"] *:after{transition:none!important}