@font-face{font-family:"Press Start 2P";src:url(../fonts/PressStart2P-Regular.ttf) format("truetype");font-display:swap}:root{--bg: #04030f;--ink: #e8f4ff;--dim: #8ec8ff;--accent: #5ec8ff;--danger: #ff4a4a;--gold: #ffd54a;--pix: "Press Start 2P", ui-monospace, "SF Mono", Menlo, monospace}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,sans-serif;overflow:hidden;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}#app{position:fixed;inset:0;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}#stage{position:absolute;inset:0;touch-action:none}#game{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;outline:none;background:transparent;z-index:1}[hidden]{display:none!important}#ui{position:absolute;inset:0;z-index:2;pointer-events:none;font-family:var(--pix)}#ui button,#ui input,#ui .panel,#ui .slot{pointer-events:auto}.col{position:absolute;left:var(--wx);top:var(--wy);width:var(--ww);height:var(--wh);overflow:visible}.lbl{color:var(--dim);letter-spacing:.08em}.val{color:var(--ink);text-shadow:0 0 8px rgba(94,200,255,.45)}.hud{position:absolute;left:var(--hx);top:var(--hy);width:var(--hw);height:var(--hh);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:calc(var(--u) * 10);padding:0 calc(var(--u) * 8)}.hud-btns{display:flex;gap:max(8px,calc(var(--u) * 8))}.icon-btn{width:max(34px,calc(var(--u) * 40));height:max(34px,calc(var(--u) * 40));border-radius:10px;border:1px solid rgba(120,200,255,.45);background:#060c22b8;color:var(--ink);display:grid;place-items:center;cursor:pointer;padding:0;backdrop-filter:blur(3px)}.icon-btn{position:relative}.icon-btn:after{content:"";position:absolute;inset:-5px}.icon-btn:hover,.icon-btn:focus-visible{border-color:var(--accent);box-shadow:0 0 12px #5ec8ff80;outline:none}.ico-pause{width:36%;height:42%;border-left:3px solid currentColor;border-right:3px solid currentColor}.ico-snd{display:block}.ico-snd .slash{display:none}.icon-btn.muted{color:var(--danger)}.icon-btn.muted .ico-snd .slash{display:block}.icon-btn.muted .ico-snd .waves{display:none}.hud-best,.hud-time{display:flex;flex-direction:column;gap:6px}.hud-best{align-items:flex-start;font-size:max(8px,calc(var(--u) * 9))}.hud-best .val{font-size:max(10px,calc(var(--u) * 13))}.hud-time{align-items:flex-end;font-size:max(8px,calc(var(--u) * 9))}.hud-time .val{font-size:max(14px,calc(var(--u) * 22))}.overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.overlay.dim{background:#03051280;backdrop-filter:blur(1.5px)}.panel{width:calc(var(--u) * 360);max-width:94%;padding:calc(var(--u) * 26) calc(var(--u) * 24);border:2px solid rgba(120,200,255,.55);border-radius:14px;background:linear-gradient(180deg,#0a1234f0,#05081cf0);box-shadow:0 0 30px #3c8cff47,inset 0 0 20px #3c8cff14;display:flex;flex-direction:column;align-items:stretch;gap:calc(var(--u) * 12);text-align:center}.panel.go{border-color:#78c8ff57;box-shadow:0 0 18px #3c8cff24,inset 0 0 14px #3c8cff0d}.panel h2{margin:0 0 calc(var(--u) * 6);font-size:max(13px,calc(var(--u) * 20));letter-spacing:.06em;font-weight:400;color:var(--ink);text-shadow:0 0 12px rgba(94,200,255,.6)}.panel h2.bad{color:var(--danger);text-shadow:0 0 14px rgba(255,74,74,.7)}.small{margin:2px 0 0;font-size:max(7px,calc(var(--u) * 8));color:var(--dim)}.btn{font-family:var(--pix);font-size:max(10px,calc(var(--u) * 13));letter-spacing:.05em;color:var(--ink);background:#0e1a46e6;border:2px solid rgba(120,200,255,.55);border-radius:10px;padding:calc(var(--u) * 14) calc(var(--u) * 16);cursor:pointer;min-height:44px}.btn:hover,.btn:focus-visible{border-color:var(--accent);box-shadow:0 0 14px #5ec8ff8c;outline:none}.btn:active{transform:translateY(1px)}.btn.primary{background:linear-gradient(180deg,#ff5a4a,#c4162e);border-color:#ffb0a0;color:#fff;text-shadow:0 2px 0 rgba(0,0,0,.35);box-shadow:0 0 18px #ff4a4a73}.btn.primary:hover,.btn.primary:focus-visible{box-shadow:0 0 26px #ff6e5acc;border-color:#fff}.btn.ghost{background:transparent;color:var(--dim)}.btn.big{font-size:max(14px,calc(var(--u) * 24));padding:calc(var(--u) * 20) calc(var(--u) * 40)}.small-btn{min-height:34px;padding:6px 10px;font-size:max(8px,calc(var(--u) * 10))}.menu{justify-content:flex-start;padding:calc(var(--u) * 14) calc(var(--u) * 20) calc(var(--u) * 22)}.menu .title{text-align:center;margin-top:calc(var(--u) * 40)}.menu h1{margin:0;display:flex;flex-direction:column;gap:calc(var(--u) * 6);font-weight:400}.menu .t1{font-size:max(18px,calc(var(--u) * 38));color:#ff5a4a;text-shadow:0 4px 0 #6a0b1c,0 0 24px rgba(255,74,74,.7)}.menu .t2{font-size:max(22px,calc(var(--u) * 50));color:#fff;text-shadow:0 4px 0 #1c3a8a,0 0 26px rgba(94,200,255,.8)}.menu .tag{margin:calc(var(--u) * 14) 0 calc(var(--u) * 18);font-size:max(8px,calc(var(--u) * 11));color:var(--dim);letter-spacing:.12em}.menu-body{margin-top:auto;margin-bottom:calc(var(--u) * 16);display:flex;flex-direction:column;align-items:center;gap:calc(var(--u) * 14);width:100%}.menu-best{font-size:max(9px,calc(var(--u) * 12));margin-bottom:calc(var(--u) * 14)}.how{list-style:none;padding:0;margin:0;font-size:max(7px,calc(var(--u) * 9));line-height:1.9;color:var(--dim);text-align:center;text-shadow:0 1px 4px #000}.slot{font-size:max(7px,calc(var(--u) * 8));color:var(--dim);text-align:center}.slot-user{align-self:flex-end;padding:6px 10px;border:1px dashed rgba(142,200,255,.4);border-radius:8px;opacity:.75}.slot-user b{color:var(--ink);font-weight:400}.slot-brand{display:flex;flex-direction:column;align-items:center;gap:8px;opacity:.92}.slot-brand .logo{box-sizing:content-box;display:block;height:max(24px,calc(var(--u) * 28));width:auto;max-width:100%;padding:2px 8px;background:linear-gradient(180deg,#f6fafff0,#cedcfae0);border-radius:7px;box-shadow:0 0 10px #19e3ff4d}.menu .slot-user{position:absolute;top:calc(var(--u) * 8);right:calc(var(--u) * 10)}.go-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:max(8px,calc(var(--u) * 10))}.go-row .val{font-size:max(11px,calc(var(--u) * 16))}.go-row .val.big{font-size:max(16px,calc(var(--u) * 26));color:#fff}.badge{align-self:center;color:#2a1c00;background:var(--gold);border-radius:6px;padding:8px 12px;font-size:max(9px,calc(var(--u) * 12));box-shadow:0 0 18px #ffd54ab3;animation:blink .9s steps(2,jump-none) infinite}@keyframes blink{50%{filter:brightness(1.35);transform:scale(1.04)}}.settings .rows{display:flex;flex-direction:column;gap:calc(var(--u) * 12)}.row{display:grid;grid-template-columns:6.2em 1fr auto;align-items:center;gap:10px;font-size:max(8px,calc(var(--u) * 10));color:var(--dim);text-align:left}.row input[type=range]{width:100%;accent-color:#ff5a4a;height:28px}.row input[type=checkbox]{width:24px;height:24px;accent-color:#ff5a4a;justify-self:start}.row.disabled{opacity:.45}.row em{font-style:normal;font-size:.8em;color:var(--gold)}.row .mini{display:flex;align-items:center;gap:6px}.countdown{position:absolute;inset:0;display:grid;place-items:center;font-size:max(40px,calc(var(--u) * 120));color:#fff;text-shadow:0 6px 0 #1c3a8a,0 0 40px rgba(94,200,255,.9);pointer-events:none}.countdown.tick{animation:tick .6s ease-out}@keyframes tick{0%{transform:scale(1.6);opacity:0}30%{opacity:1}to{transform:scale(1)}}.hold-hint{position:absolute;left:-50%;right:-50%;white-space:nowrap;bottom:calc(var(--u) * 70);text-align:center;font-size:max(8px,calc(var(--u) * 11));color:#fff;text-shadow:0 2px 6px #000,0 0 12px rgba(94,200,255,.7);animation:pulse 1.1s ease-in-out infinite;pointer-events:none}@keyframes pulse{50%{opacity:.45}}.hold-hint .mouse{display:inline}.hold-hint .touch,.how .touch{display:none}@media(pointer:coarse){.hold-hint .touch,.how .touch{display:inline}.hold-hint .mouse,.how .mouse{display:none}}.hold-glow{position:absolute;left:0;right:0;bottom:0;height:calc(var(--u) * 150);background:linear-gradient(0deg,#5ec8ff4d,#5ec8ff00);opacity:0;transition:opacity .08s linear;pointer-events:none}.hold-glow.on{opacity:1}#loading{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--pix);font-size:12px;letter-spacing:.1em;color:var(--dim);background:var(--bg);z-index:5}@media(prefers-reduced-motion:reduce){.badge,.hold-hint,.countdown.tick{animation:none}}#ui[data-compact="1"] .overlay{left:calc(var(--wx) * -1);right:auto;width:var(--vw);top:calc(var(--wy) * -1);bottom:auto;height:var(--vh)}#ui[data-compact="1"] .menu{display:block;padding:0}#ui[data-compact="1"] .menu .title{position:absolute;left:0;top:0;bottom:0;width:var(--wx);margin:0;padding:0 10px;display:flex;flex-direction:column;align-items:center;justify-content:center}#ui[data-compact="1"] .menu .tag{margin:8px 0}#ui[data-compact="1"] .menu-best{margin-bottom:8px}#ui[data-compact="1"] .how{line-height:1.7}#ui[data-compact="1"] .menu-body{position:absolute;right:0;top:0;width:var(--wx);height:100%;margin:0;justify-content:center;padding-bottom:40px}#ui[data-compact="1"] .slot-brand .logo{height:max(20px,calc(var(--u) * 24));padding:1px 6px}#ui[data-compact="1"] .slot-brand{position:absolute;right:0;bottom:calc(8px + env(safe-area-inset-bottom));width:var(--wx);padding-right:env(safe-area-inset-right)}#ui[data-compact="1"] .menu .slot-user{top:6px;right:calc(10px + env(safe-area-inset-right))}#ui[data-compact="1"] .menu .title{padding-left:calc(10px + env(safe-area-inset-left))}#ui[data-compact="1"] .menu-body{padding-right:env(safe-area-inset-right)}#ui[data-compact="1"] .hud{left:calc(env(safe-area-inset-left) + 8px);width:calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right) - 16px);top:6px;height:44px}#ui[data-compact="1"] .panel.settings{max-height:calc(var(--vh) - 16px);overflow-y:auto}#ui[data-compact="1"] .settings .rows{display:grid;grid-template-columns:1fr 1fr;column-gap:18px;row-gap:8px}#ui[data-compact="1"] .settings .row.music{grid-column:1 / -1}#bg{position:absolute;inset:0;overflow:hidden;z-index:0;pointer-events:none;background:linear-gradient(180deg,#04030f,#070b22 55%,#0c0a24)}#bg .bg-nebula{position:absolute;left:-4%;top:-4%;width:108%;height:108%;animation:nebula-drift 46s ease-in-out infinite alternate;will-change:transform}#bg .bg-stars{position:absolute;left:0;width:100%;background-repeat:repeat;will-change:transform,opacity}#bg .bg-vignette{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,#0000 38%,#0000069e)}#bg[data-motion=reduced] .bg-nebula{animation:none}@keyframes nebula-drift{0%{transform:translate3d(0,-1.6%,0) scale(1)}to{transform:translate3d(0,1.6%,0) scale(1.03)}}.btn.busy{opacity:.7}