:root,:root[data-theme=dark]{--bg:#0e1412;--bg-elev:#151d1a;--bg-card:#1a2420;--bg-card-2:#20302a;--text:#ecf2ee;--text-muted:#8fa39a;--text-faint:#5d7268;--border:#2b3a33;--border-strong:#3d5248;--accent:#f4c95d;--accent-strong:#ffd97a;--accent-dim:#f4c95d29;--accent-text:#1a1406;--green:#35d98f;--red:#ff5d5d;--blue:#4fc3ff;--ok:var(--green);--danger:var(--red);--shadow:0 6px 22px #00000073;--shadow-lift:0 10px 30px #0000008c;--glow-accent:0 0 0 2px #f4c95d80, 0 0 18px #f4c95d73;--glow-green:0 0 0 2px #35d98f80, 0 0 20px #35d98f80;--mono:ui-monospace, "SF Mono", "Cascadia Mono", "JetBrains Mono", Menlo, Consolas, "Liberation Mono", monospace;--sans:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif}:root[data-theme=light]{--bg:#f6f1e5;--bg-elev:#fffaf0;--bg-card:#fff;--bg-card-2:#fdf6e3;--text:#232019;--text-muted:#6b6353;--text-faint:#9a917d;--border:#e0d6bd;--border-strong:#c9b98f;--accent:#c8951c;--accent-strong:#a87c12;--accent-dim:#c8951c24;--accent-text:#fff;--green:#12865b;--red:#c03a2f;--blue:#1272a8;--ok:var(--green);--danger:var(--red);--shadow:0 6px 20px #5a4b2829;--shadow-lift:0 12px 30px #5a4b2838;--glow-accent:0 0 0 2px #c8951c8c, 0 0 16px #c8951c59;--glow-green:0 0 0 2px #12865b80, 0 0 18px #12865b66}*{box-sizing:border-box}html,body{height:100%}body{background:var(--bg);color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;background-image:radial-gradient(1200px 700px at 50% -12%, var(--bg-elev), transparent 62%);background-repeat:no-repeat;margin:0;line-height:1.5}#app{min-height:100%}.game{flex-direction:column;gap:clamp(14px,2.5vw,22px);max-width:720px;margin:0 auto;padding:clamp(14px,3vw,28px) clamp(14px,4vw,24px) 48px;display:flex}.game-header{justify-content:space-between;align-items:center;gap:12px;display:flex}.game-title{font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);text-shadow:0 0 14px var(--accent-dim);margin:0;font-size:1.05rem;font-weight:800}.title-slash{color:var(--text-faint);font-weight:600}.title-sub{color:var(--text-muted);font-weight:600}.theme-toggle{border:1px solid var(--border-strong);background:var(--bg-card);min-width:44px;min-height:44px;color:var(--text-muted);font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em;cursor:pointer;border-radius:10px;justify-content:center;align-items:center;padding:0 12px;font-size:.8rem;display:inline-flex}.theme-toggle:hover{border-color:var(--accent);color:var(--accent)}.theme-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.hud-bar{border:1px solid var(--border);background:var(--bg-card);box-shadow:var(--shadow);font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em;border-radius:10px;justify-content:space-between;align-items:center;gap:10px;padding:8px 12px;font-size:.82rem;font-weight:700;display:flex}.hud-signpost{color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.hud-score{color:var(--text);white-space:nowrap}.hud-score b{color:var(--accent);font-variant-numeric:tabular-nums;text-align:right;min-width:3ch;font-weight:800;display:inline-block}.hud-streak{color:var(--text-muted);white-space:nowrap;border-left:1px solid var(--border);padding-left:10px}.hud-streak b{font-variant-numeric:tabular-nums;text-align:center;min-width:2ch;color:var(--text);font-weight:800;transition:color .18s,text-shadow .18s,transform .18s;display:inline-block}.hud-bar[data-streak-hot] .hud-streak b{color:var(--accent-strong);text-shadow:0 0 12px var(--accent), 0 0 24px #ff8a4c8c;transform:scale(1.12)}.hud-bar[data-streak-hot] .hud-streak{color:var(--accent)}.hud-streak b.is-pop{animation:.26s ease-out hud-pop}@keyframes hud-pop{0%{transform:scale(1)}40%{transform:scale(1.5)}to{transform:scale(1)}}.sentence-ticker{border:1px solid var(--border);background:var(--bg-card);box-shadow:var(--shadow);border-radius:12px;padding:14px 18px;position:relative;overflow:hidden}.sentence-ticker:before,.sentence-ticker:after{content:"";pointer-events:none;z-index:2;width:34px;position:absolute;top:0;bottom:0}.sentence-ticker:before{background:linear-gradient(to right, var(--bg-card), transparent);left:0}.sentence-ticker:after{background:linear-gradient(to left, var(--bg-card), transparent);right:0}.context-text{font-family:var(--mono);text-align:center;color:var(--text);word-break:break-word;min-height:1.6em;margin:0;font-size:1.25rem;font-weight:700;line-height:1.55}@media (width>=520px){.context-text{font-size:1.45rem}}.machine-stage{border:1px solid var(--border-strong);background:radial-gradient(120% 120% at 50% 0%, var(--bg-card-2), var(--bg-card) 70%);box-shadow:var(--shadow-lift);border-radius:16px;height:clamp(200px,34vw,320px);min-height:200px;position:relative;overflow:hidden}.machine-canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.machine-stage.is-thinking{animation:1.1s ease-in-out infinite stage-think}@keyframes stage-think{0%,to{box-shadow:var(--shadow-lift);filter:brightness()}50%{box-shadow:0 0 0 3px var(--accent-dim), var(--shadow-lift);filter:brightness(1.06)}}.game[data-phase=debrief] .machine-stage,.game[data-phase=transfer] .machine-stage,.game[data-phase=end] .machine-stage{display:none}.reels-panel{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.reel-card{border:1px solid var(--border);background:var(--bg-card);min-height:96px;box-shadow:var(--shadow);cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:10px;min-width:44px;padding:12px 8px;transition:border-color .16s,box-shadow .16s,transform .16s;display:flex;position:relative}.reel-card:hover{border-color:var(--border-strong)}.reel-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media (hover:hover) and (pointer:fine){.reel-card:hover{border-color:var(--accent);transform:translateY(-2px)}}.reel-token{font-family:var(--mono);color:var(--text);padding:8px 6px;font-size:1.6rem;font-weight:800;line-height:1}.reel-card:not(.revealed) .reel-bar,.reel-card:not(.revealed) .reel-prob{display:none!important}.reel-bar{border:1px solid var(--border-strong);background:var(--bg-card-2);border-radius:6px;width:22px;height:56px;position:relative;overflow:hidden}.reel-bar-fill{background:linear-gradient(to top, var(--accent), var(--accent-strong));border-radius:4px;height:0%;transition:height .48s cubic-bezier(.22,1,.36,1);position:absolute;bottom:0;left:0;right:0}.reel-card.is-argmax .reel-bar-fill{background:linear-gradient(to top, var(--green), #6cf0b0)}.reel-card.spinning .reel-token{content:"";color:var(--text-faint);animation:.18s linear infinite reel-blur}@keyframes reel-blur{0%{filter:blur();transform:translateY(-2px)}50%{filter:blur(1.6px);transform:translateY(2px)}to{filter:blur();transform:translateY(-2px)}}.reel-card.selected{border-color:var(--accent);box-shadow:var(--glow-accent)}.reel-card.selected:after{content:"YOUR PICK";font-family:var(--mono);letter-spacing:.1em;background:var(--accent);color:var(--accent-text);border-radius:4px;padding:2px 6px;font-size:.58rem;font-weight:800;position:absolute;top:6px;left:50%;transform:translate(-50%)}.reel-card.machine-pick{border-color:var(--green);box-shadow:var(--glow-green);animation:.9s ease-in-out 2 pulse-pick}.reel-card.machine-pick:after{content:"MACHINE PICK";font-family:var(--mono);letter-spacing:.1em;background:var(--green);color:#06251a;white-space:nowrap;border-radius:4px;padding:2px 6px;font-size:.58rem;font-weight:800;position:absolute;top:6px;left:50%;transform:translate(-50%)}.reel-card.argmax{border-top:2px solid var(--green)}.reel-card.argmax:after{content:"MOST LIKELY";font-family:var(--mono);letter-spacing:.1em;color:var(--green);white-space:nowrap;background:#35d98f33;border-radius:4px;padding:2px 6px;font-size:.58rem;font-weight:800;position:absolute;top:6px;left:50%;transform:translate(-50%)}.reel-card.selected.machine-pick:after{content:"MACHINE PICK";background:var(--green);color:#06251a}@keyframes pulse-pick{0%,to{box-shadow:var(--glow-green)}50%{box-shadow:0 0 0 4px #35d98fb3,0 0 28px #35d98fa6}}.feedback-panel{min-height:44px;font-family:var(--mono);text-align:center;justify-content:center;align-items:center;display:flex}.feedback-text{letter-spacing:.04em;margin:0;font-size:1rem;font-weight:800}.feedback-text.is-pop{animation:.52s cubic-bezier(.22,1,.36,1) feedback-rise}@keyframes feedback-rise{0%{opacity:0;transform:translateY(14px)scale(.8)}30%{opacity:1;transform:translateY(0)scale(1.15)}70%{transform:translateY(-2px)scale(1)}to{opacity:0;transform:translateY(-16px)scale(1)}}.feedback-panel[data-kind=match-agree] .feedback-text{color:var(--ok)}.feedback-panel[data-kind=match-diverge] .feedback-text{color:var(--accent)}.feedback-panel[data-kind=miss] .feedback-text{color:var(--danger)}.game.is-streak-broken{animation:.42s shake}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-5px)}80%{transform:translate(5px)}}.journal-panel{border:1px solid var(--border);background:var(--bg-card);box-shadow:var(--shadow);border-radius:12px;padding:12px 14px}.journal-panel h2{font-family:var(--mono);text-transform:uppercase;letter-spacing:.16em;color:var(--text-faint);margin:0 0 8px;font-size:.72rem}.journal-list{max-height:180px;font-family:var(--mono);color:var(--text-muted);margin:0;padding:0;font-size:.85rem;list-style:none;overflow-y:auto}.journal-list li{border-bottom:1px dashed var(--border);align-items:baseline;gap:8px;padding:3px 0;display:flex}.journal-list li:last-child{border-bottom:none}.journal-list li .journal-token{color:var(--accent);font-weight:800}.journal-list li.is-new{animation:.32s ease-out journal-in}@keyframes journal-in{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:translate(0)}}.journal-step{color:var(--text-faint)}.journal-entry{color:var(--text-muted)}.journal-why{color:var(--text-faint);font-style:italic}.btn-primary,.pull-btn{background:linear-gradient(180deg, var(--accent-strong), var(--accent));min-height:52px;color:var(--accent-text);font-family:var(--mono);text-transform:uppercase;letter-spacing:.12em;cursor:pointer;box-shadow:var(--shadow-lift);border:none;border-radius:14px;justify-content:center;align-items:center;gap:10px;padding:14px 22px;font-size:1rem;font-weight:800;transition:transform .12s,box-shadow .16s,filter .16s,opacity .16s;display:inline-flex}.pull-btn{width:100%}.lever-icon{font-size:1.2rem;line-height:1;display:inline-block}.btn-primary:hover,.pull-btn:hover{filter:brightness(1.06)}@media (hover:hover) and (pointer:fine){.btn-primary:hover,.pull-btn:hover{transform:translateY(-2px);box-shadow:0 14px 34px #0006}}.btn-primary:active,.pull-btn:active{transform:translateY(1px)scale(.98)}.btn-primary:focus-visible,.pull-btn:focus-visible{outline:3px solid var(--text);outline-offset:2px}.btn-primary:disabled,.pull-btn:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.6);box-shadow:none;transform:none}.pull-btn kbd,.advance-btn kbd{font-family:var(--mono);opacity:.75;border:1px solid;border-radius:4px;padding:2px 6px;font-size:.7rem}.choices-prompt{font-family:var(--mono);text-align:center;color:var(--text-muted);font-size:.9rem}.intro-panel{border:1px solid var(--border);background:var(--bg-card);box-shadow:var(--shadow-lift);border-radius:16px;flex-direction:column;gap:14px;padding:22px 18px;display:flex}.intro-panel h1{font-family:var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--accent);margin:0;font-size:1.6rem}.intro-panel p{color:var(--text-muted);margin:0}.debrief-panel{border:1px solid var(--border);background:var(--bg-card);box-shadow:var(--shadow-lift);border-radius:16px;flex-direction:column;gap:14px;padding:22px 18px;display:flex}.debrief-panel h2{font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--text);margin:0}.debrief-score,.score{font-family:var(--mono);color:var(--accent);font-size:2rem;font-weight:800}.final-sentence{font-family:var(--mono);color:var(--text);font-size:1.1rem}.debrief-copy{color:var(--text-muted)}.debrief-actions{flex-wrap:wrap;gap:12px;display:flex}.copy-btn{border:1px solid var(--border-strong);background:var(--bg-card-2);min-height:44px;color:var(--text);font-family:var(--mono);cursor:pointer;border-radius:10px;padding:0 16px;font-size:.85rem;font-weight:700}.copy-btn:hover{border-color:var(--accent);color:var(--accent)}.copy-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.learning-panel{border:1px solid var(--border);background:var(--bg-card);box-shadow:var(--shadow-lift);border-radius:16px;flex-direction:column;gap:14px;padding:20px 18px;display:flex}.transfer-prompt{font-family:var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--text-faint);font-size:.75rem}.learning-question{color:var(--text);margin:0;font-size:1.05rem;font-weight:700}.transfer-options{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.transfer-option{text-align:left;border:1px solid var(--border-strong);background:var(--bg-card-2);min-height:48px;color:var(--text);font-family:var(--sans);cursor:pointer;border-radius:10px;padding:12px 14px;font-size:.95rem}.transfer-option:hover{border-color:var(--accent)}.transfer-option:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.choice-card.correct{border-color:var(--ok);box-shadow:0 0 0 2px #35d98f66}.choice-card.incorrect{border-color:var(--danger)}.transfer-verdict{font-family:var(--mono);font-weight:800}.transfer-results{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.transfer-results li{border:1px solid var(--border);background:var(--bg-card-2);border-radius:8px;padding:10px 12px;font-size:.9rem}.tier-correct{color:var(--ok)}.tier-incorrect{color:var(--danger)}.correct-explanation{color:var(--text-muted)}.end-summary{font-family:var(--mono);color:var(--text);font-size:1.1rem}.disclaimer{text-align:center;color:var(--text-faint);margin:0;font-size:.72rem}.intro-panel,.debrief-panel,.learning-panel,.feedback-panel,.sentence-ticker,.reels-panel,.machine-stage,.journal-panel{display:flex}.reels-panel{display:grid}.game[data-phase=intro] .hud-bar,.game[data-phase=intro] .sentence-ticker,.game[data-phase=intro] .machine-stage,.game[data-phase=intro] .reels-panel,.game[data-phase=intro] .feedback-panel,.game[data-phase=intro] .journal-panel,.game[data-phase=intro] .pull-btn,.game[data-phase=choose] .intro-panel,.game[data-phase=choose] .debrief-panel,.game[data-phase=choose] .learning-panel,.game:not([data-phase=intro]) .intro-panel,.game[data-phase=debrief] .reels-panel,.game[data-phase=debrief] .machine-stage,.game[data-phase=transfer] .machine-stage,.game[data-phase=transfer] .reels-panel,.game[data-phase=transfer] .sentence-ticker,.game[data-phase=transfer] .journal-panel,.game[data-phase=transfer] .pull-btn,.game[data-phase=end] .machine-stage,.game[data-phase=end] .reels-panel,.game[data-phase=end] .sentence-ticker,.game[data-phase=end] .journal-panel{display:none}.game [hidden]{display:none!important}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}.reel-card:hover,.btn-primary:hover,.pull-btn:hover{transform:none}}@media (width<=519.98px){.reels-panel{grid-template-columns:1fr;gap:10px}.reel-card{flex-direction:row;justify-content:space-between;gap:12px;min-height:60px;padding:10px 14px}.reel-bar{width:44px;height:100%;min-height:34px}.machine-stage{height:140px;min-height:140px}.hud-bar{letter-spacing:.05em;font-size:.7rem}.context-text{font-size:1.05rem}}@media (width<=380px){.hud-bar{flex-wrap:wrap;row-gap:4px}.hud-signpost{flex-basis:100%}}