:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#090f1b;color:#e6eef8;--muted:#9aacc5;--line:#293950;--blue:#99b9ff;--mint:#92ddd1;--gold:#efc58f}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,select{color:inherit;background:#172438;border:1px solid #374c68;border-radius:8px;padding:10px 13px}button,select,summary{cursor:pointer}button:hover{border-color:#90b4e4;background:#223753}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--mint);outline-offset:4px}a{color:var(--blue);text-decoration:none}a:hover{text-decoration:underline}.primary{background:var(--blue);border-color:var(--blue);color:#102441;font-weight:750}.primary:hover{background:#b4cdff}p{line-height:1.7}small{line-height:1.6}#app{max-width:1430px;padding:25px 34px 35px;margin:auto}.nav{display:flex;align-items:center;gap:25px;font-size:12px}.nav>span{font-size:10px;letter-spacing:.14em;color:var(--muted)}.nav>div{margin-left:auto;display:flex;gap:12px}.eyebrow{color:var(--mint);font-size:10px;font-weight:700;letter-spacing:.14em}header{display:grid;grid-template-columns:1.4fr 1fr;align-items:end;gap:55px;margin:34px 0 28px}h1{font-size:clamp(34px,4vw,54px);line-height:1.06;letter-spacing:-.045em;margin:12px 0 0}header p{max-width:390px;margin:0;color:#acbfd7;font-size:14px}.setup{display:grid;grid-template-columns:1.2fr 1fr;gap:0;border:1px solid var(--line);border-radius:13px;overflow:hidden;background:#101d30}.prompt-box{padding:22px 25px;background:linear-gradient(110deg,#17283e,#122039)}.prompt-box>label{display:block;color:#91aace;font-size:10px;letter-spacing:.1em;margin-bottom:12px}.prompt-box select{max-width:100%;font-size:12px;background:#0e1a2b}.prompt-box blockquote{margin:20px 0 13px;font-size:23px;line-height:1.35;letter-spacing:-.02em;color:#e5eeff}.prompt-box small{color:var(--muted);font-size:11px}.conditions{padding:22px 25px;font-size:12px;display:flex;align-items:flex-start;flex-wrap:wrap;gap:9px 14px}.conditions>label{width:100%;display:flex;gap:7px;align-items:center}.conditions input{accent-color:var(--mint);width:16px;height:16px}.conditions p{width:100%;color:var(--muted);font-size:11px;margin:0 0 6px 24px}.conditions select{font-size:11px;padding:7px;margin-left:24px}.conditions small{display:block;color:#7f9bb8;font-size:10px;margin-left:24px}.model-note{font-size:10px;color:#94a7bf;margin:12px 2px 19px;letter-spacing:.025em}.metrics{display:grid;grid-template-columns:repeat(4,1fr);background:#101b2b;border:1px solid var(--line);border-radius:11px;overflow:hidden}.metrics article{padding:15px 19px;border-right:1px solid var(--line)}.metrics article:last-child{border:0}.metrics article>span{font-size:10px;color:var(--muted);display:block}.metrics strong{display:block;font-size:30px;line-height:1.4;color:var(--mint);font-variant-numeric:tabular-nums}.metrics article:nth-child(2) strong{color:var(--gold)}.metrics article:nth-child(3) strong{color:var(--blue)}.metrics small{display:block;font-size:9px;color:#8da3bf}.transport{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:17px 0}.transport button{font-size:12px}.transport label{font-size:11px;color:var(--muted)}.transport select{padding:7px;font-size:11px}.transport>span{font-size:10px;color:var(--muted);margin-left:auto}.workbench{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:22px}.machine-panel{border:1px solid #304764;border-radius:13px;background:radial-gradient(ellipse at 40% 30%,#14243e,#0b1526 70%);overflow:hidden;min-width:0}.panel-label{padding:17px 18px;display:flex;justify-content:space-between;gap:15px;font-size:9px;letter-spacing:.08em;color:#94abc6}.panel-label>span:last-child{letter-spacing:0;color:#6e8cac}.rail{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));padding:0 13px;gap:4px}.rail button{font-size:9px;background:#111e31;padding:10px 3px;border-color:#29394f;overflow-wrap:anywhere}.rail b{display:block;font-size:15px;color:#6d86a7;margin-bottom:5px}.rail button.visited b{color:#8fb1de}.rail button[aria-pressed=true]{background:#263e66;border-color:#93b8fc}.rail button[aria-pressed=true] b{color:var(--mint)}.output{border-top:1px solid #2b3e5b;background:#0c1525;padding:17px 21px}.output>div{display:flex;justify-content:space-between;color:#8eaaca;font-size:9px;letter-spacing:.1em}.output p{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:17px;min-height:66px;color:#6f88a6;line-height:1.7;margin:16px 0}.output p.has-output{color:#d9eee9}.output p.has-output:after{content:'▎';color:#9fd7c9}.output small{display:block;color:#bdad93;font-size:11px;line-height:1.7;min-height:35px}.inspector{background:#111c2c;border:1px solid var(--line);border-radius:12px;padding:20px;min-width:0}.inspector h2{font-size:22px;letter-spacing:-.025em;line-height:1.2;margin:12px 0}.inspector>p{font-size:12px;color:#adbed3}.small{font-size:11px;color:#91a8c4}#stage-detail{margin-top:18px}#stage-detail small{font-size:10px;color:#849bb7}.context-card{border:1px solid #2b405b;border-radius:7px;background:#17253a;padding:10px 12px;margin:8px 0;font-size:11px}.context-card b{font-size:9px;letter-spacing:.05em;color:#83a8d6}.context-card p{margin:6px 0 0;color:#cbd8e8;font-size:11px}.context-card.source{border-color:#736044}.context-card.source b{color:#e3bd8a}.document{background:#282419;border:1px solid #6a593d;border-radius:9px;padding:15px;color:#ead7bb}.document>span{color:#caa56e;font-size:9px}.document h3{font-size:14px}.document p{font-size:12px}.empty-source{border:1px dashed #3c4d63;padding:25px 12px;border-radius:8px;text-align:center;color:#8fabc8;font-size:12px}.token-list{display:flex;gap:5px;flex-wrap:wrap;max-height:285px;overflow:auto;padding:4px}.token-list button{display:flex;gap:8px;align-items:center;font-family:ui-monospace,monospace;font-size:11px;padding:6px;background:#21344f}.token-list button small{color:#7295c4!important;font-size:8px!important}.token-list button[aria-pressed=true]{border-color:var(--mint)}.vector-example{display:flex;gap:12px;align-items:center}.vector-example>code{max-width:95px;overflow-wrap:anywhere;color:#c5d6f8;padding:10px;border:1px solid #354b6c;border-radius:5px}.vector-example>div{display:grid;gap:5px;flex:1}.vector-example b{font-family:ui-monospace,monospace;font-size:11px;position:relative;padding:6px 8px;background:linear-gradient(90deg,color-mix(in srgb,var(--sign) 35%,transparent) var(--value),#1a263b var(--value));border-radius:3px}.query-tokens{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:15px}.query-tokens button{font-family:ui-monospace,monospace;font-size:10px;padding:5px 7px}.query-tokens button[aria-pressed=true]{border-color:#b2c9ed;background:#375279}.attention-row{display:grid;grid-template-columns:70px 1fr 35px;align-items:center;gap:6px;margin:7px 0;font-size:10px}.attention-row code{overflow:hidden;text-overflow:ellipsis}.attention-row>span{height:10px;border-radius:3px;background:linear-gradient(90deg,#95b9fa var(--strength),#1d2c41 var(--strength))}.attention-row b{text-align:right;color:#94b8d7;font-size:9px}.attention-row.masked{opacity:.35}.prob-row{display:grid;grid-template-columns:70px 1fr 56px;gap:9px;align-items:center;margin:13px 0;font-size:11px}.prob-row code{overflow-wrap:anywhere;color:#d0dfed}.prob-row>div{height:12px;background:#1c3048;border-radius:4px;overflow:hidden}.prob-row i{display:block;height:100%;background:linear-gradient(90deg,#76a6e3,#a1d9d9);border-radius:4px}.prob-row b{font-size:11px;text-align:right;color:#aac8e8;font-variant-numeric:tabular-nums}.formula{padding:12px 8px;background:#1a2b42;border-radius:7px;font-family:ui-monospace,monospace;font-size:11px;margin:15px 0 8px}.feedback-card{display:grid;gap:12px;justify-items:center;padding:16px;background:#122f37;border:1px solid #345660;border-radius:9px}.feedback-card span{font-size:9px;color:#8fbdbd;text-align:center}.feedback-card b{font-size:21px;color:var(--mint)}.feedback-card code{font-size:12px;color:#d2ece9;line-height:1.7;overflow-wrap:anywhere}.decoder,.training{display:grid;grid-template-columns:1fr 1fr;gap:55px;margin-top:40px;padding-top:30px;border-top:1px solid var(--line)}.decoder h2,.training h2{font-size:31px;line-height:1.16;letter-spacing:-.035em;margin:13px 0}.decoder p,.training p{font-size:13px;color:#a3b7d0}.decoder>div>button{font-size:12px;margin-top:9px}.decoder-controls{background:#132034;border:1px solid #2e4666;border-radius:11px;padding:20px}.decoder-controls>label{font-size:12px;display:flex;justify-content:space-between;gap:15px}.decoder-controls output{color:var(--mint);font-variant-numeric:tabular-nums}.decoder-controls input{width:100%;accent-color:var(--blue);margin:16px 0 20px}.decoder-controls select{font-size:12px;max-width:100%;margin:10px 7px 12px 0}.decoder-controls button{font-size:11px}.decoder-controls small{display:block;color:#8ba4c2;font-size:11px}.toy-label{font-size:10px!important;margin-bottom:0}.training>div>small{color:#7f98b9;font-size:11px}.training-lab{background:#12242c;border:1px solid #355253;border-radius:12px;padding:24px}.training-flow{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#9dbabf;font-size:12px}.weight-box{border:1px solid #638b88;background:#183e43;padding:13px;border-radius:6px;color:var(--mint)}.training-flow i{font-style:normal;color:#76aba8}.train-numbers{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:22px 0}.train-numbers span{display:block;font-size:10px;color:#90b1b9}.train-numbers strong{display:block;font-size:30px;letter-spacing:-.02em;color:#bde3da;margin-top:5px;font-variant-numeric:tabular-nums}.learning-meter{height:8px;background:#203a42;border-radius:5px;margin-bottom:21px;overflow:hidden}.learning-meter span{display:block;height:100%;background:#92dacc;transition:width .25s}.training-lab button{font-size:12px}.training-lab p{font-size:10px;color:#87abb6;margin:17px 0 8px}.training-lab>small{font-size:10px;color:#a4c2c8}.takeaways{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:40px 0 30px;padding-top:25px;border-top:1px solid var(--line)}.takeaways h3{font-size:16px;line-height:1.35}.takeaways p{font-size:12px;color:var(--muted)}.sources{font-size:12px;line-height:1.8;color:#8fa7c4}.sources summary{color:#bccce1;font-weight:600}.sources li{margin:7px 0}footer{border-top:1px solid var(--line);padding-top:20px;margin-top:25px;font-size:11px;color:var(--muted)}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media(max-width:1100px){.workbench{grid-template-columns:minmax(0,1fr) 275px;gap:15px}.inspector{padding:16px}.rail button{font-size:8px}.decoder,.training{gap:30px}.panel-label>span:last-child{display:none}}@media(max-width:820px){#app{padding:20px 15px 30px}header{gap:20px;margin:28px 0}h1{font-size:38px}header p{font-size:12px}.setup{grid-template-columns:1fr}.prompt-box{padding:19px}.conditions{padding:18px}.prompt-box blockquote{font-size:22px}.metrics{grid-template-columns:1fr 1fr}.metrics article{padding:13px 16px}.metrics article:nth-child(2){border-right:0}.metrics article:nth-child(n+3){border-top:1px solid var(--line)}.workbench{grid-template-columns:1fr}.inspector{padding:21px}.inspector h2{font-size:24px}.inspector>p{font-size:13px}.rail button{font-size:9px}.token-list{max-height:185px}.attention{max-width:500px}.transport>span{width:100%;margin:3px 0}.decoder,.training{gap:20px;grid-template-columns:1fr}.decoder h2,.training h2{font-size:28px}.takeaways{gap:20px;grid-template-columns:1fr}.takeaways h3{font-size:19px;margin-bottom:7px}.takeaways p{font-size:13px}.vector-example{max-width:400px}.context-card p{font-size:12px}.panel-label>span:last-child{display:block;font-size:8px}.nav{gap:15px}.nav>span{font-size:9px}.decoder p,.training p{font-size:13px}}@media(max-width:480px){header{display:block}h1{font-size:38px}header p{margin:18px 0 0;max-width:330px}.prompt-box select{width:100%;font-size:11px}.rail{grid-template-columns:repeat(4,1fr);gap:5px}.rail button{padding:7px 3px;display:flex;align-items:center;justify-content:center;gap:5px}.rail b{display:inline;font-size:11px;margin:0}.panel-label{padding:15px 12px;font-size:8px}.panel-label>span:last-child{display:none}.machine svg{min-height:190px;padding:6px 2px}.output{padding:16px}.output p{font-size:15px;min-height:72px}.transport{gap:6px}.transport button{padding:10px;font-size:11px}.inspector{padding:18px}.decoder-controls{padding:17px}.training-lab{padding:18px}.training-flow{font-size:10px}.train-numbers strong{font-size:28px}.metrics strong{font-size:28px}}
/* Narrated 3D walkthrough. The numeric inspector remains available without WebGL. */
.flow-dashboard{padding:17px 18px;background:linear-gradient(120deg,#142538,#122035);border-top:1px solid #30435e}
.flow-heading{display:flex;align-items:center;gap:9px;font-size:13px}.flow-heading>span:last-child{margin-left:auto;font-size:10px;color:#92aac6}.signal-dot{width:8px;height:8px;border-radius:50%;background:#ffd16a;box-shadow:0 0 12px #ffd16a88;flex-shrink:0}
.operation-rail{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;margin:15px 0}.operation-rail[hidden]{display:none}.operation-rail button{font-size:10px;padding:9px 5px;text-align:left;color:#a4bad3;line-height:1.4}.operation-rail b{display:block;color:#718fae;margin-bottom:4px}.operation-rail button[aria-pressed=true]{background:#403824;border-color:#c4a357;color:#ffe2a1}.operation-rail button[aria-pressed=true] b{color:#ffd16a}
#flow-formula{display:block;font-size:12px;color:#d8e9fc;line-height:1.8;margin-top:12px;overflow-wrap:anywhere}#flow-caption{font-size:12px;line-height:1.6;color:#acbfd6;margin:9px 0 13px;min-height:38px}.flow-legend{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:10px;color:#8fa9c4}.flow-legend .gold{color:#f0cd86}
.paper-note{padding:12px 16px;font-size:11px;line-height:1.7;color:#9fb5cf;border-bottom:1px solid #293e57}.paper-note summary{color:#bfd2e9}.paper-note p{max-width:78ch}
@media(max-width:480px){.flow-dashboard{padding:14px 12px}.flow-heading{font-size:12px}.flow-heading>span:last-child{max-width:90px;text-align:right}.operation-rail button{font-size:9px;padding:8px 4px}.flow-legend{font-size:9px}#flow-formula{font-size:11px}}
.machine{position:relative;height:clamp(480px,62vh,620px);isolation:isolate;background:#050b16;border-top:1px solid #233d56;border-bottom:1px solid #233d56;overflow:hidden}
.machine canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab;outline-offset:-3px}
.machine canvas:active{cursor:grabbing}.machine canvas:focus-visible{outline:2px solid #92ddd1}
.scene-tools{position:absolute;left:14px;top:13px;z-index:2;display:flex;gap:5px}.scene-tools button{font-size:11px;padding:8px 10px;background:#102033e8;backdrop-filter:blur(8px)}
.scene-hint{position:absolute;left:15px;bottom:5px;color:#90aac4;font-size:10px;pointer-events:none;letter-spacing:.02em}
.voice-controls{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center;padding:18px 16px 12px;font-size:11px;color:#b4c8de}
.voice-controls label{display:flex;align-items:center;gap:7px}.voice-controls input{accent-color:#9ec1ff;width:15px;height:15px}.voice-controls select{font-size:11px;padding:6px 8px}
.voice-progress{display:flex;gap:8px;flex-wrap:wrap;justify-content:space-between;padding:0 16px 14px;font-size:11px;color:#b1d9e4;min-height:47px}.voice-progress>div{width:100%;height:3px;background:#233d54;border-radius:5px;overflow:hidden}.voice-progress i{display:block;height:100%;width:0;background:#95e4d0;transition:width .15s linear}.voice-progress>span:last-of-type{color:#87a1bd;font-variant-numeric:tabular-nums}
.selection-readout{padding:12px 16px;min-height:43px;font-size:12px;background:#142437;color:#b9d5ec;border-bottom:1px solid #293e57;overflow-wrap:anywhere}
.voice-transcript{padding:12px 16px;font-size:12px;color:#9db4cc;line-height:1.75;border-bottom:1px solid #293e57}.voice-transcript summary{color:#c2d4e8}.voice-transcript p{margin:12px 0 0}
.world-fallback{padding:90px 30px;color:#b9cce1}.workbench{align-items:start}.inspector{position:sticky;top:15px}.rail{margin-bottom:6px}.transport{position:sticky;top:0;z-index:5;background:#090f1bf2;padding:10px 0;backdrop-filter:blur(10px)}
@media(max-width:1100px){.machine{height:clamp(440px,56vh,540px)}}
@media(max-width:820px){.inspector{position:static}.machine{height:450px}.voice-controls{gap:11px}.transport>span{font-size:11px}}
@media(max-width:480px){.machine{height:380px}.scene-tools{left:8px;top:8px}.scene-tools button{font-size:10px;padding:7px}.scene-hint{font-size:9px;left:10px}.voice-controls{padding:13px 12px;font-size:10px;gap:10px 13px}.voice-controls select{font-size:10px}.voice-progress{padding:0 12px 12px;font-size:10px}.selection-readout{font-size:11px}.transport{top:0;margin-top:10px}.transport #replay-voice{font-size:10px}.voice-transcript{font-size:12px}}
/* Entry points to the cinematic view. */
.nav .cinema-link{color:#ffcf7a;font-weight:650}
.hero-side{display:grid;gap:16px;justify-items:start}
.cinema-cta{display:grid;gap:5px;max-width:390px;padding:14px 16px;border-radius:12px;border:1px solid #6b5a33;background:linear-gradient(120deg,#2a2210,#141c33);box-shadow:0 10px 40px #ffcf7a1a;color:#e8dcc0;transition:border-color .2s,transform .2s}
.cinema-cta:hover{text-decoration:none;border-color:#ffcf7a;transform:translateY(-2px)}.cinema-cta b{color:#ffcf7a;font-size:13px}.cinema-cta span{font-size:12px;line-height:1.55;color:#c7bea9}

.has-atlas-player .voice-controls,.has-atlas-player #voice-state,.has-atlas-player #voice-time,.has-atlas-player .voice-progress,.has-atlas-player #play,.has-atlas-player #step,.has-atlas-player #replay-voice{display:none}

/* One narration timeline; paused inspection keeps the generated context. */
@media(max-width:820px){.nav{flex-wrap:wrap;gap:10px 16px}.nav>*{min-width:0}.nav>a{max-width:100%}.nav>div{margin-left:auto;flex-shrink:0}}
.atlas-player .ap-voice{display:flex;align-items:center;gap:4px;font-size:11px;color:#b4c8de;white-space:nowrap}.atlas-player .ap-voice input{width:16px;height:16px;accent-color:var(--mint)}.decoder-detail{font-size:11px;line-height:1.65;color:#b4c8de}.has-atlas-player .transport{position:static;background:transparent;padding:0}.has-atlas-player #status{margin-left:8px;color:#aac2d8}.operation-rail button[aria-pressed=true]{border-color:var(--gold);background:#30414b}.atlas-player .ap-marks button{min-width:18px}@media(max-width:480px){.transport{align-items:start}.transport #status{width:100%;margin-left:0}.atlas-player .ap-voice{font-size:10px}}
@media(max-width:700px){.machine[data-phase="5"]{height:560px}}