:root{--bg:#05090f;--panel:#08121ebd;--panel-hi:#0c1a2adb;--line:#60b2e042;--line-hi:#78d2ff9e;--ink:#dbeefb;--ink-dim:#c6e2f59e;--accent:#4dd0ff;--accent-dim:#4dd0ff59;--warn:#ff9d8e;--ok:#63f0c8;--ui:"Inter", "Segoe UI", system-ui, -apple-system, sans-serif;--mono:"JetBrains Mono", "SF Mono", ui-monospace, Consolas, monospace;--lesson-w:clamp(300px, 27vw, 400px)}@media (width<=900px){:root{--lesson-w:clamp(224px, 34vw, 300px)}}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;font-family:var(--ui);color:var(--ink);-webkit-font-smoothing:antialiased;overscroll-behavior:none;margin:0;overflow:hidden}#stage{touch-action:none;width:100%;height:100%;display:block;position:fixed;inset:0}body:after{content:"";z-index:5;pointer-events:none;background:radial-gradient(120% 90% at 50% 45%,#0000 52%,#0208108c 100%);position:fixed;inset:0}#labels{pointer-events:none;z-index:10;position:fixed;inset:0}.tag{background:var(--panel-hi);border:1px solid var(--line);border-left:2px solid var(--accent);-webkit-backdrop-filter:blur(11px);backdrop-filter:blur(11px);white-space:nowrap;opacity:0;border-radius:3px;padding:8px 12px 9px;transition:opacity .13s,transform .2s cubic-bezier(.22,1,.36,1);position:absolute;transform:translate(-50%,-100%);box-shadow:0 0 0 1px #00000059,0 10px 30px #00000073}.tag.on{opacity:1}.tag-name{letter-spacing:.015em;font-size:13px;font-weight:640;line-height:1.15;display:block}.tag-role{font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--accent);opacity:.85;margin-top:3px;font-size:9.5px;display:block}.tag-swatch{vertical-align:1px;border-radius:1px;width:8px;height:8px;margin-right:8px;display:inline-block;box-shadow:0 0 0 1px #ffffff38}.tag:after{content:"";background:linear-gradient(180deg, var(--line-hi), transparent);width:1px;height:15px;position:absolute;top:100%;left:50%}#reticle{z-index:11;pointer-events:none;opacity:0;width:28px;height:28px;margin:-14px 0 0 -14px;transition:opacity .2s;position:fixed;top:50%;left:50%}#reticle.live{opacity:1}#reticle:before{content:"";border:1.5px solid var(--accent-dim);border-radius:50%;transition:transform .18s cubic-bezier(.22,1,.36,1),border-color .18s,box-shadow .18s;position:absolute;inset:0;transform:scale(.4)}#reticle i{background:var(--accent);border-radius:50%;width:3px;height:3px;margin:-1.5px 0 0 -1.5px;transition:transform .18s cubic-bezier(.22,1,.36,1),background .18s;position:absolute;top:50%;left:50%}#reticle[data-state=hot]:before{border-color:var(--accent);transform:scale(1);box-shadow:0 0 14px #4dd0ff66,inset 0 0 8px #4dd0ff29}#reticle[data-state=hot] i{transform:scale(0)}#reticle[data-state=wrong]:before{border-color:var(--warn);transform:scale(.85);box-shadow:0 0 12px #ff9d8e4d}#reticle[data-state=wrong] i{background:var(--warn)}#reticle[data-state=busy]{opacity:.22}#lock-prompt{z-index:14;background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);pointer-events:none;border-radius:4px;justify-items:center;gap:8px;padding:16px 26px 17px;transition:opacity .24s;display:grid;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 40px #061a2c99,inset 0 1px #8cd7ff14}#lock-prompt.hidden{opacity:0}#lock-prompt span{font-size:13.5px;font-weight:620}#lock-prompt em{font-style:normal;font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-dim);font-size:9.5px}#hud{z-index:12;pointer-events:none;background:linear-gradient(#0000,#03080ee6 88%);padding:22px 26px 24px;position:fixed;bottom:0;left:0;right:0}#step-line{align-items:baseline;gap:14px;display:flex}#step-index{font-family:var(--mono);letter-spacing:.12em;color:var(--accent);min-width:3.2em;font-size:11px}#step-text{font-size:17px;font-weight:620}#step-hint{color:var(--ink-dim);min-height:1.2em;margin-top:6px;margin-left:calc(3.2em + 14px);font-size:12.5px}#step-hint.warn{color:var(--warn)}#controls{z-index:13;align-items:center;gap:10px;padding:16px 18px;display:flex;position:fixed;top:0;right:0}#keys{font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-dim);gap:12px;font-size:9.5px;display:flex}#keys b{border:1px solid var(--line);min-width:20px;color:var(--accent);text-align:center;background:#0a1826b3;border-radius:2px;margin-right:5px;padding:2px 5px;font-weight:600;display:inline-block}#exit{pointer-events:auto;appearance:none;cursor:pointer;font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);border:1px solid var(--line);background:var(--panel);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:3px;padding:9px 14px;font-size:10px;transition:border-color .16s,color .16s,background .16s}#exit:hover,#exit:focus-visible{border-color:var(--line-hi);color:var(--accent);background:var(--panel-hi);outline:none}#lesson{z-index:22;width:var(--lesson-w);border-right:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);pointer-events:auto;background:linear-gradient(#060e18f2,#040a12f7);grid-template-rows:auto auto 1fr auto;display:none;position:fixed;top:0;bottom:0;left:0}#lesson.on{display:grid}#lesson.busy{cursor:progress}#lesson>header{border-bottom:1px solid var(--line);font-family:var(--mono);letter-spacing:.2em;text-transform:uppercase;justify-content:space-between;align-items:center;padding:18px 22px 14px;font-size:10px;display:flex}.lesson-eyebrow{color:var(--accent)}#lesson-progress{color:var(--ink-dim)}#lesson-rail{gap:3px;padding:14px 22px 0;display:flex}#lesson-rail i{background:#60b2e02e;flex:1;height:2px;transition:background .24s}#lesson-rail i.done{background:var(--accent-dim)}#lesson-rail i.current{background:var(--accent)}.lesson-body{padding:22px;overflow-y:auto}#lesson-section{font-family:var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-dim);font-size:9.5px;display:block}#lesson-title{color:var(--ink);margin:10px 0 0;font-size:23px;font-weight:600;line-height:1.2}#lesson-subtitle{font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-top:5px;font-size:10px;display:block}#lesson-subtitle[hidden]{display:none}#lesson-text p{color:#dbeefbdb;margin:15px 0 0;font-size:14px;line-height:1.62}#lesson>footer{border-top:1px solid var(--line);flex-wrap:wrap;gap:8px;padding:16px 22px 20px;display:flex}#lesson button{appearance:none;cursor:pointer;font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:3px;padding:10px 14px;font-size:10px;transition:border-color .16s,color .16s,background .16s,opacity .16s}#lesson button:hover:not(:disabled),#lesson button:focus-visible:not(:disabled){border-color:var(--line-hi);color:var(--accent);background:var(--panel-hi);outline:none}#lesson button:disabled{opacity:.35;cursor:default}#lesson-next{border-color:var(--accent-dim);color:var(--accent);flex:1}.lesson-foot-row{flex-basis:100%;justify-content:space-between;align-items:center;gap:8px;padding-top:4px;display:flex}#lesson-skip{color:var(--ink-dim);text-align:left;background:0 0;border:none;padding:4px 0}#lesson-skip:hover,#lesson-skip:focus-visible{color:var(--accent);background:0 0}#decolor-clock{z-index:16;border:1px solid var(--line);background:var(--panel);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:none;opacity:0;border-radius:4px;grid-template-columns:auto auto;align-items:center;gap:4px 14px;padding:12px 18px 13px;transition:opacity .2s,transform .2s,border-color .3s;display:none;position:fixed;top:74px;left:50%;transform:translate(-50%,-6px)}#decolor-clock.on{opacity:1;display:grid;transform:translate(-50%)}.clock-label{font-family:var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-dim);font-size:9.5px}#clock-value{font-family:var(--mono);font-variant-numeric:tabular-nums;color:var(--accent);justify-self:end;font-size:19px;font-weight:600;transition:color .3s}.clock-hint{font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-dim);grid-column:1/-1;margin-top:5px;font-size:8.5px}body.lesson-mode #decolor-clock{display:none}.read-btn{appearance:none;cursor:pointer;font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--line);background:var(--panel);color:var(--ink-dim);pointer-events:auto;border-radius:3px;align-items:center;gap:7px;padding:7px 11px;font-size:9.5px;transition:border-color .16s,color .16s,background .16s;display:inline-flex}.read-btn:hover,.read-btn:focus-visible{border-color:var(--line-hi);color:var(--accent);background:var(--panel-hi);outline:none}.read-btn svg{fill:none;stroke:currentColor;stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:14px;height:14px}.read-btn[aria-pressed=true]{border-color:var(--accent-dim);color:var(--accent)}.read-btn[data-speaking="1"] .wave{transform-origin:12px 12px;animation:1.1s ease-in-out infinite read-pulse}.read-btn[data-speaking="1"] .wave:last-of-type{animation-delay:.18s}@keyframes read-pulse{0%,to{opacity:.35}50%{opacity:1}}.read-btn[hidden]{display:none}#scope-read{margin-bottom:14px}body.lesson-mode #reticle,body.lesson-mode #hud,body.lesson-mode #lock-prompt{display:none}body.lesson-mode #caption{left:calc(50% + clamp(150px,13.5vw,200px))}body.lesson-mode #lesson{z-index:34}body.lesson-mode #scope.on{padding-left:calc(var(--lesson-w) + 28px)}@media (width<=900px){#lesson>header{padding:13px 16px 10px}.lesson-body{padding:15px 16px}#lesson>footer{padding:12px 16px 15px}#lesson-rail{padding:10px 16px 0}#lesson-title{font-size:17px}#lesson-subtitle{font-size:9px}#lesson-text p{margin-top:11px;font-size:12.5px}#lesson button{padding:8px 11px;font-size:9px}body.lesson-mode #caption{left:calc(50% + var(--lesson-w) / 2)}}@media (orientation:portrait) and (width<=760px){#lesson{border-right:none;border-top:1px solid var(--line);width:100%;height:min(52vh,340px);top:auto}body.lesson-mode #caption{top:16px;bottom:auto;left:50%}body.lesson-mode #scope.on{padding-bottom:min(52vh,340px);padding-left:0}}.sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}#mute{pointer-events:auto;appearance:none;cursor:pointer;border:1px solid var(--line);background:var(--panel);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:3px;place-items:center;width:32px;height:32px;padding:0;transition:border-color .16s,background .16s;display:grid}#mute:hover,#mute:focus-visible{border-color:var(--line-hi);background:var(--panel-hi);outline:none}#mute svg{fill:none;width:17px;height:17px;stroke:var(--accent);stroke-width:1.5px;stroke-linecap:round;stroke-linejoin:round}#mute .slash{opacity:0;stroke:var(--warn)}#mute[data-muted="1"] svg{stroke:var(--ink-dim)}#mute[data-muted="1"] .wave{opacity:0}#mute[data-muted="1"] .slash{opacity:1}#caption{z-index:14;border:1px solid var(--line);border-left:2px solid var(--accent);background:var(--panel);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);text-align:center;max-width:min(640px,74vw);color:var(--ink);pointer-events:none;opacity:0;border-radius:4px;padding:11px 18px;font-size:14px;line-height:1.5;transition:opacity .26s,transform .26s;position:fixed;bottom:106px;left:50%;transform:translate(-50%,8px)}#caption.on{opacity:1;transform:translate(-50%)}body.examining #caption{display:none}@media (width<=700px){#caption{max-width:86vw;padding:9px 14px;font-size:12.5px;bottom:76px}}.scope-coach{border-left:2px solid var(--accent);color:var(--ink-dim);opacity:0;margin:0 0 14px;padding-left:11px;font-size:13px;line-height:1.5;transition:opacity .3s}.scope-coach.on{opacity:1}#loader{z-index:40;background:var(--bg);place-content:center;gap:16px;transition:opacity .52s;display:grid;position:fixed;inset:0}#loader.done{opacity:0;pointer-events:none}.loader-bar{background:#60b2e033;width:200px;height:1px;overflow:hidden}.loader-fill{background:var(--accent);width:0%;height:100%;box-shadow:0 0 10px var(--accent);transition:width .22s}.loader-text{font-family:var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-dim);text-align:center;font-size:9.5px}#reticle[data-state=alt]:before{border-color:#c6e2f58c;transform:scale(.72)}#reticle[data-state=alt] i{background:#c6e2f5cc}#scope{z-index:30;opacity:0;background:#03060a;display:none;position:fixed;inset:0}#scope.on{justify-content:center;align-items:center;gap:clamp(18px,4vw,60px);padding:clamp(14px,3vw,46px);display:flex}.scope-field{border-radius:50%;flex:none;animation:26s ease-in-out infinite alternate scope-drift;position:relative;overflow:hidden;-webkit-mask-image:radial-gradient(circle,#000 58%,#000000d9 74%,#00000040 90%,#0000 99%);mask-image:radial-gradient(circle,#000 58%,#000000d9 74%,#00000040 90%,#0000 99%)}.scope-field canvas{display:block}.scope-rim{pointer-events:none;background:radial-gradient(circle,#0000 56%,#03060a80 82%,#03060af2 97%),radial-gradient(circle,#0000 70%,#5a96ff24 84%,#0000 90%),radial-gradient(circle,#0000 72%,#ff825a1a 86%,#0000 92%);border-radius:50%;position:absolute;inset:0;box-shadow:inset 0 0 60px #0000008c}@keyframes scope-drift{0%{transform:translate(-.6%,.4%)scale(1)}to{transform:translate(.7%,-.5%)scale(1.03)}}.scope-readout{text-align:left;pointer-events:none;flex:0 clamp(230px,28vw,360px)}@media (aspect-ratio<=1){#scope.on{flex-direction:column;gap:clamp(12px,3vh,28px)}.scope-readout{text-align:center;flex:none;max-width:46ch}.scope-readout p{margin-inline:auto}}.scope-readout span{font-family:var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--accent);font-size:10px;display:block}.scope-readout p{max-width:42ch;color:var(--ink);margin:9px 0 12px;font-size:14px;line-height:1.5}.scope-readout em{font-style:normal;font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-dim);font-size:9px;display:block}#rotate{z-index:60;background:var(--bg);text-align:center;place-content:center;justify-items:center;gap:18px;padding:30px;display:none;position:fixed;inset:0}#rotate svg{width:54px;height:54px;stroke:var(--accent);fill:none;stroke-width:1.4px}#rotate p{margin:0;font-size:14px;font-weight:600}#rotate small{font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-dim);font-size:9.5px}body.is-portrait #rotate{display:grid}body.is-touch #lock-prompt,body.is-touch #keys{display:none}body.is-touch #reticle{opacity:1}@media (prefers-reduced-motion:reduce){.tag,#loader,#lock-prompt,#reticle:before,#reticle i{transition:none}}