:root{--bg:#07060a;--ink:#f3ece2;--ink-dim:#b5a99a;--ink-faint:#7d7368;--panel:#120d0bd1;--panel-edge:#ffd69624;--gold:#f1b94a;--gold-deep:#c98a22;--emerald:#3fd28a;--cherry:#ff5468;--focus:#ffe2a6;--radius:14px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;margin:0;font:16px/1.45 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;overflow:hidden}#app{position:fixed;inset:0}.stage{background:radial-gradient(at 50% 40%,#16100c 0%,#07060a 70%);place-items:center;display:grid;position:absolute;inset:0}.stage canvas{display:block}.classic-canvas{width:min(100vw,160vh);height:min(100vh,62.5vw);image-rendering:pixelated;image-rendering:crisp-edges}.has-touch .classic-canvas{align-self:start;width:min(100vw,131.2vh);height:min(82vh,62.5vw)}@media (orientation:portrait){.has-touch .classic-canvas{margin-top:calc(max(16px, env(safe-area-inset-top)) + 56px)}}.stage[data-mode=hd] canvas{width:100%;height:100%;position:absolute;inset:0}.stage.crt:not([data-mode=hd]) .classic-canvas{filter:saturate(1.15)contrast(1.06)brightness(1.08)drop-shadow(0 0 6px #ff783c40);border-radius:1.2%/2%}.stage.crt:not([data-mode=hd]):after{content:"";pointer-events:none;mix-blend-mode:multiply;background:repeating-linear-gradient(#0000 0 2px,#00000038 3px,#0000 4px),radial-gradient(#0000 55%,#0000008c 100%);position:absolute;inset:0}.ui{pointer-events:none;position:absolute;inset:0}.ui>*{pointer-events:auto}.ui.dim .panel-wrap{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0403038c}.panel-wrap{place-items:center;padding:16px;display:grid;position:absolute;inset:0;overflow:auto}.panel-wrap[hidden],.hud-p[hidden],.hud[hidden],.skip-hint[hidden]{display:none}.panel{border-radius:var(--radius);background:var(--panel);border:1px solid var(--panel-edge);-webkit-backdrop-filter:blur(14px)saturate(1.2);backdrop-filter:blur(14px)saturate(1.2);text-align:center;width:min(560px,100%);padding:28px 32px 26px;animation:.35s cubic-bezier(.2,.8,.2,1) rise;box-shadow:0 30px 80px #0009,inset 0 1px #ffffff0a}.panel>.close{z-index:1;background:#140e0ae6;border-radius:50%;width:40px;height:40px;margin:-12px -10px -28px auto;padding:0;font-size:1.5rem;line-height:1;display:block;position:sticky;top:4px}.panel.menu,.panel.boot{background:linear-gradient(#0e0a088c,#0e0a08c7);width:min(440px,100%)}.panel.loading{width:min(440px,100%)}.panel.loading p:not(.fine){color:var(--ink-dim);margin:0 0 14px}.progress-pct{font-variant-numeric:tabular-nums;color:var(--ink)}.progress{background:#ffffff14;border-radius:99px;height:8px;margin-bottom:22px;overflow:hidden}.progress i{border-radius:inherit;background:linear-gradient(90deg, var(--gold-deep), var(--gold));width:0;height:100%;transition:width .2s ease-out;display:block}.panel.settings{text-align:left;width:min(980px,100%)}@keyframes rise{0%{opacity:0;transform:translateY(14px)scale(.985)}}h1,h2,h3{letter-spacing:.06em;margin:0 0 18px;font-weight:800}h2{text-transform:uppercase;font-size:1.6rem}h3{letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:14px;font-size:.8rem}.logo{letter-spacing:.14em;background:linear-gradient(180deg, #fff3d6 0%, var(--gold) 55%, var(--gold-deep) 100%);color:#0000;filter:drop-shadow(0 4px 18px #f1b94a59);-webkit-background-clip:text;background-clip:text;margin-bottom:26px;font-size:clamp(2.6rem,9vw,4.2rem);line-height:.95}.logo span{letter-spacing:.9em;color:var(--ink-dim);-webkit-text-fill-color:var(--ink-dim);filter:none;background:0 0;margin-top:8px;padding-left:.9em;font-size:.34em;display:block}.fine{color:var(--ink-faint);margin:18px 0 0;font-size:.8rem}.buttons{gap:10px;display:grid}.buttons.row{justify-content:center;margin-top:22px;display:flex}button{font:inherit;color:var(--ink);cursor:pointer;letter-spacing:.04em;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:10px;padding:11px 22px;transition:background .15s,border-color .15s,transform .1s}button:hover{background:#ffffff1a;border-color:#fff3}button:active{transform:translateY(1px)}button:focus-visible,input:focus-visible{outline:2px solid var(--focus);outline-offset:2px}button.primary{color:#241505;background:linear-gradient(#f6c35c,#d89526);border-color:#ffe6aa99;font-weight:700}button.primary:hover{background:linear-gradient(#ffd27a,#e5a234)}button.big{padding:15px 30px;font-size:1.05rem;animation:2.4s ease-in-out infinite pulse}@keyframes pulse{50%{box-shadow:0 0 0 8px #f1b94a14,0 0 30px #f1b94a40}}button.danger{color:#ffb3bd;border-color:#ff546866}button[disabled]{opacity:.6;cursor:default}.settings-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:28px;display:grid}.settings section{flex-direction:column;gap:8px;display:flex}.row-label{color:var(--ink-dim);margin-top:8px;font-size:.85rem}.row-label kbd{border:1px solid var(--ink-faint);border-radius:4px;margin-left:4px;padding:0 4px;font:.7rem ui-monospace,monospace}.tag{color:var(--emerald);letter-spacing:.05em;background:#3fd28a26;border-radius:99px;margin-left:6px;padding:1px 6px;font-size:.68rem}.hint{color:var(--ink-faint);margin:2px 0 0;font-size:.78rem}.seg{background:#00000059;border:1px solid #ffffff14;border-radius:10px;gap:3px;padding:3px;display:flex}.seg button{color:var(--ink-dim);background:0 0;border:0;border-radius:7px;flex:1;padding:7px 8px;font-size:.86rem}.seg button[aria-checked=true]{color:var(--focus);background:#f1b94a2e;box-shadow:inset 0 0 0 1px #f1b94a73}.slider{grid-template-columns:70px 1fr 34px;align-items:center;gap:10px;font-size:.9rem;display:grid}.slider output{text-align:right;color:var(--ink-dim);font-variant-numeric:tabular-nums}input[type=range]{appearance:none;background:0 0;width:100%;height:22px}input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(90deg, var(--gold-deep), var(--gold));border-radius:6px;height:6px}input[type=range]::-moz-range-track{background:linear-gradient(90deg, var(--gold-deep), var(--gold));border-radius:6px;height:6px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;border:2px solid var(--gold-deep);background:#fff4dc;border-radius:50%;width:18px;height:18px;margin-top:-6px}input[type=range]::-moz-range-thumb{border:2px solid var(--gold-deep);background:#fff4dc;border-radius:50%;width:16px;height:16px}.table{font-variant-numeric:tabular-nums;max-width:340px;margin:0 auto;padding:0;list-style:none}.table li{text-align:left;border-bottom:1px solid #ffffff0f;grid-template-columns:36px 1fr auto;padding:7px 4px;display:grid}.table li:first-child{color:var(--gold);font-weight:700}.table .rank{color:var(--ink-faint)}.table .ini{letter-spacing:.3em;font-family:ui-monospace,Cascadia Mono,Menlo,monospace}.table sup{color:var(--ink-faint)}.panel.help{width:min(680px,100%)}.help-grid{text-align:left;color:var(--ink-dim);gap:10px;display:grid}.help-grid p{margin:0}.help-grid b{color:var(--ink)}.help-grid .em{color:var(--emerald)}.help-grid .gold{color:var(--gold)}.help-grid .cherry{color:var(--cherry)}.big-score{color:var(--gold);font-variant-numeric:tabular-nums;margin:-6px 0 6px;font-size:2.4rem;font-weight:800}.ini-boxes{cursor:text;justify-content:center;gap:12px;margin:14px 0 4px;display:flex}.ini-boxes span{background:#0006;border:1px solid #ffffff1f;border-radius:10px;place-items:center;width:58px;height:70px;font:800 2.2rem ui-monospace,monospace;display:grid}.ini-boxes span.cur{border-color:var(--gold);box-shadow:0 0 0 3px #f1b94a33}.ini-input{opacity:0;pointer-events:none;width:1px;position:absolute}.hud{padding:max(14px, env(safe-area-inset-top)) max(22px, env(safe-area-inset-right)) 0 max(22px, env(safe-area-inset-left));pointer-events:none;text-shadow:0 2px 10px #000c;justify-content:space-between;align-items:flex-start;display:flex;position:absolute;top:0;left:0;right:0}.hud-p{flex-direction:column;min-width:140px;display:flex}.hud-p2{align-items:flex-end}.hud-label{letter-spacing:.25em;text-transform:uppercase;color:var(--ink-dim);font-size:.7rem}.hud-score{font-variant-numeric:tabular-nums;letter-spacing:.04em;color:#fff7e6;font-size:1.9rem;font-weight:800}.hud-p.active .hud-label{color:var(--gold)}.hud-mid{flex-direction:column;align-items:center;gap:6px;display:flex}.hud-level{letter-spacing:.3em;text-transform:uppercase;color:var(--ink-dim);font-size:.75rem}.hud-lives{gap:6px;display:flex}.life{background:linear-gradient(#ff6b4f,#c1301d);border-radius:5px 5px 3px 3px;width:26px;height:16px;position:relative;box-shadow:inset 0 -4px #3a2a22,0 0 8px #ff643c59}.life:after{content:"";border:4px solid #0000;border-left:7px solid #e8c35a;position:absolute;top:4px;right:-7px}.era{top:max(14px, env(safe-area-inset-top));right:max(16px, env(safe-area-inset-right));letter-spacing:.18em;color:var(--gold);border-color:var(--panel-edge);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#140e0a99;border-radius:99px;padding:6px 13px 6px 11px;font-size:.85rem;font-weight:800;position:absolute}.era[hidden]{display:none}.era:before{content:"⇄";letter-spacing:0;opacity:.7;margin-right:7px}.era:hover{background:#281c12cc;border-color:#ffd69666}.era-boot{background:#140e0a99;border-color:#ffd69659;flex-direction:column;align-items:center;gap:2px;width:100%;margin-top:14px;padding:12px 18px;display:flex}.era-boot b{letter-spacing:.22em;color:var(--gold);font-size:1.7rem;font-weight:900;line-height:1.1}.era-boot b:before{content:"⇄";letter-spacing:0;opacity:.7;margin-right:10px;font-size:.7em}.era-boot small{color:var(--ink-dim);font-size:.8rem}.era-boot[data-era="1983"] b{color:#5f5}.era-boot[data-era="1983"] small{color:#f55}.era-boot[data-era="1983"],.era[data-era="1983"]{color:#5f5;-webkit-backdrop-filter:none;backdrop-filter:none;background:#000000bf;border-color:#f55;border-radius:0;font-family:ui-monospace,Cascadia Mono,Menlo,monospace}.has-touch .era{right:calc(max(16px, env(safe-area-inset-right)) + 56px);min-height:44px;top:16px}.fade{opacity:0;pointer-events:none;z-index:1;background:#000;transition:opacity .9s;position:absolute;inset:0}.fade.on{opacity:1;transition-duration:1.6s}.skip-hint.armed{color:var(--gold);opacity:1;font-weight:700;animation:none}.hud-title{letter-spacing:.32em;background:linear-gradient(180deg, #fff3d6 0%, var(--gold) 60%, var(--gold-deep) 100%);color:#0000;filter:drop-shadow(0 2px 8px #000c);-webkit-background-clip:text;background-clip:text;font-size:1.05rem;font-weight:900}.hud-title b{letter-spacing:.4em;opacity:.8;font-weight:600}.skip-hint{bottom:max(18px, env(safe-area-inset-bottom));letter-spacing:.14em;z-index:2;text-transform:uppercase;color:var(--ink-dim);opacity:.8;pointer-events:none;font-size:clamp(.95rem,1.6vw,1.25rem);font-weight:600;animation:2s ease-in-out infinite blink;position:absolute;right:22px}body:not(.has-touch) .skip-hint{font-size:clamp(1.9rem,3.2vw,2.5rem)}@keyframes blink{50%{opacity:.35}}.toast{border:1px solid var(--panel-edge);opacity:0;pointer-events:none;letter-spacing:.05em;background:#140e0ad9;border-radius:99px;padding:9px 18px;font-size:.9rem;transition:opacity .25s,transform .25s;position:absolute;top:18%;left:50%;transform:translate(-50%,-8px)}.toast.show{opacity:1;transform:translate(-50%)}.touch{z-index:5;pointer-events:none;touch-action:none;transition:opacity .2s;position:fixed;inset:0}.touch[hidden],.touch.away{display:none}.stick-zone{pointer-events:auto;touch-action:none;width:55%;position:absolute;top:70px;bottom:0;left:0}.stick-base{opacity:.45;background:radial-gradient(circle,#ffffff0f 0%,#ffffff1f 70%,#ffffff0a 100%);border:2px solid #ffffff38;border-radius:50%;width:120px;height:120px;margin:-60px 0 0 -60px;transition:opacity .15s;position:absolute;top:calc(100% - 120px);left:110px}.touch.stick-on .stick-base{opacity:1}.stick-knob{background:radial-gradient(circle at 35% 30%,#fff0d2e6,#f1b94a99);border-radius:50%;width:54px;height:54px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 4px 14px #00000080}.stick-hint{letter-spacing:.2em;text-transform:uppercase;color:#ffffff73;font-size:.7rem;position:absolute;bottom:20px;left:110px;transform:translate(-50%)}.touch.stick-on .stick-hint{display:none}.fire-zone{pointer-events:auto;touch-action:none;width:40%;position:absolute;top:70px;bottom:0;right:0}.touch .fire{letter-spacing:.1em;color:#ffffffd9;pointer-events:none;background:#f1b94a38;border:2px solid #f1b94a8c;border-radius:50%;width:104px;height:104px;padding:0;font-size:.85rem;font-weight:800;position:absolute;bottom:36px;right:28px}.touch .fire.down{background:#f1b94a80;transform:scale(.94)}.touch .tpause{pointer-events:auto;color:#ffffffbf;background:#ffffff1a;border:1px solid #fff3;border-radius:50%;width:44px;height:44px;padding:0;font-size:.8rem;position:fixed;top:16px;right:16px}@media (max-width:640px){.panel{padding:22px 18px}.hud-score{font-size:1.35rem}.hud-p{min-width:0}}@media (prefers-reduced-motion:reduce){.panel,button.big,.skip-hint{animation:none}}.stage[data-mode=hd]:after{content:"";pointer-events:none;background:radial-gradient(at 50% 55%,#0000 55%,#00000080 100%);position:absolute;inset:0}.popups,.cast-labels{pointer-events:none;position:absolute;inset:0;overflow:hidden}.popup{letter-spacing:.06em;color:#fff3d0;text-shadow:0 0 10px #ffbe50cc,0 2px 4px #000000e6;white-space:nowrap;will-change:transform, opacity;font-size:clamp(.8rem,1.6vw,1.15rem);font-weight:800;position:absolute;top:0;left:0}.popup.big{color:#c9ffe4;text-shadow:0 0 14px #50ffaacc,0 2px 4px #000000e6;font-size:clamp(1rem,2.2vw,1.6rem)}.title-card{text-align:center;opacity:0;pointer-events:none;position:absolute;top:44%;left:50%;transform:translate(-50%,-50%)}.title-card.show{animation:2.4s cubic-bezier(.2,.7,.2,1) forwards card}.tc-main{letter-spacing:.18em;text-transform:uppercase;background:linear-gradient(180deg, #fff6df 0%, var(--gold) 60%, var(--gold-deep) 100%);color:#0000;filter:drop-shadow(0 6px 24px #000c);-webkit-background-clip:text;background-clip:text;font-size:clamp(2.2rem,7vw,5rem);font-weight:900}.tc-sub{letter-spacing:.4em;text-transform:uppercase;color:var(--ink-dim);text-shadow:0 2px 8px #000000e6;margin-top:6px;font-size:clamp(.8rem,1.6vw,1.1rem)}@keyframes card{0%{opacity:0;letter-spacing:.3em;transform:translate(-50%,-50%)scale(1.08)}18%{opacity:1;transform:translate(-50%,-50%)scale(1)}78%{opacity:1}to{opacity:0;transform:translate(-50%,-54%)scale(.98)}}.cast-label{letter-spacing:.3em;text-transform:uppercase;color:#fff1d6;text-shadow:0 2px 10px #000000f2;opacity:0;filter:blur(4px);font-size:clamp(.7rem,1.5vw,1.1rem);font-weight:800;transition:opacity .6s,filter .6s;position:absolute;top:0;left:0}.cast-label.show{opacity:1;filter:none}.ui.title .panel-wrap{padding:12px;container-type:size}[data-dock=left] .ui.title .panel-wrap{width:var(--dock-left);padding-left:max(12px, env(safe-area-inset-left));right:auto}[data-dock=bottom] .ui.title .panel-wrap{height:var(--dock-bottom);padding-bottom:max(12px, env(safe-area-inset-bottom));background:linear-gradient(#07060a00,#07060ae6 55%);top:auto}[data-dock=bottom] .ui.title .panel{align-self:end}[data-dock=left] .classic-canvas,[data-dock=bottom] .classic-canvas{width:min(100vw - var(--dock-left), (100vh - var(--dock-bottom)) * 1.6);height:min(100vh - var(--dock-bottom), (100vw - var(--dock-left)) / 1.6);margin-top:calc((100vh - var(--dock-bottom) - min(100vh - var(--dock-bottom), (100vw - var(--dock-left)) / 1.6)) / 2);place-self:start center}[data-dock=left] .classic-canvas{place-self:center end;margin-top:0}@container (height<=560px){.panel.menu,.panel.boot{padding:14px 16px}.panel .logo{margin-bottom:12px;font-size:min(2.6rem,13cqh)}.panel.menu .buttons{grid-template-columns:1fr 1fr;gap:8px}.panel.menu .buttons>*{padding:9px 6px;font-size:.9rem}.panel.menu .fine{display:none}.panel.boot .fine{margin-top:10px}.panel.boot .era-boot{margin-top:10px;padding:8px 14px}.panel.boot .era-boot b{font-size:1.35rem}.panel.menu .lvl-pick{margin-top:8px}}a.button{font:inherit;color:var(--ink-dim);letter-spacing:.04em;background:#ffffff08;border:1px solid #ffffff14;border-radius:10px;padding:11px 22px;text-decoration:none;transition:background .15s,color .15s;display:block}a.button:hover{color:var(--ink);background:#ffffff1a}a.button:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.menu-scores{display:none}@container (width>=600px) and (height>=480px){.ui.hd-attract .panel.menu{grid-template-columns:1fr 1fr;align-items:start;gap:0 26px;width:min(620px,100%);display:grid}.ui.hd-attract .panel.menu .logo,.ui.hd-attract .panel.menu .fine{grid-column:1/-1}.ui.hd-attract .menu-scores{text-align:left;grid-area:2/2/span 2;display:block}.ui.hd-attract .panel.menu .lvl-pick{grid-column:1}}.menu-scores h3{margin-bottom:8px}.menu-scores ol{font-variant-numeric:tabular-nums;margin:0;padding:0;font-size:.9rem;list-style:none}.menu-scores li{color:var(--ink-dim);border-bottom:1px solid #ffffff0f;justify-content:space-between;padding:4px 2px;display:flex}.menu-scores li:first-child{color:var(--gold);font-weight:700}.menu-scores .ini{letter-spacing:.3em;font-family:ui-monospace,Cascadia Mono,Menlo,monospace}.hud{grid-template-columns:1fr auto 1fr;display:grid}.hud-p2{justify-self:end;margin-right:84px}.has-touch .hud-p2{margin-right:140px}.caption{left:50%;bottom:max(56px, calc(env(safe-area-inset-bottom) + 44px));color:#fff;letter-spacing:.03em;opacity:0;pointer-events:none;white-space:nowrap;background:#000000b8;border-radius:8px;padding:5px 14px;font-size:.95rem;transition:opacity .2s;position:absolute;transform:translate(-50%)}.caption.show{opacity:1}.lvl-pick{color:var(--ink-dim);justify-content:center;align-items:center;gap:10px;margin-top:12px;font-size:.9rem;display:flex}.lvl-pick button{padding:4px 12px}.lvl-pick b{text-align:center;min-width:2ch;color:var(--gold);font-size:1.1rem}.key-row{grid-template-columns:60px 1fr;align-items:center;gap:10px;font-size:.9rem;display:grid}.key-row button{text-align:left;padding:6px 10px;font-family:ui-monospace,Cascadia Mono,Menlo,monospace;font-size:.85rem}.key-row button.listening{border-color:var(--gold);color:var(--gold)}.stage.loading canvas{visibility:hidden}.hotkeys{grid-template-columns:auto 1fr;gap:6px 14px;margin:0;font-size:.88rem;display:grid}.hotkeys dt{color:var(--gold);white-space:nowrap;font-family:ui-monospace,Cascadia Mono,Menlo,monospace}.hotkeys dd{color:var(--ink-dim);margin:0}.rotate-hint{color:var(--ink-dim);white-space:nowrap;background:#0009;border-radius:99px;padding:6px 14px;font-size:.8rem;display:none;position:absolute;top:22%;left:50%;transform:translate(-50%)}@media (orientation:portrait){.rotate-hint{animation:.8s 10s forwards rotate-hint-out;display:block}}@keyframes rotate-hint-out{to{opacity:0;visibility:hidden}}@media (max-height:500px){.hud{padding-top:max(6px, env(safe-area-inset-top))}.hud-score{font-size:1.3rem}.hud-title{font-size:.8rem}.hud-level{letter-spacing:.2em;font-size:.62rem}.hud-mid{gap:2px}.life{width:20px;height:12px}}