:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ink:#f4f1ff;--muted:#b9b2d6;--panel:#0e0c20b8;--panel-border:#a094ff47;--accent:#ff5a5f;--accent-2:#4fd1ff;--good:#7ee787}*{box-sizing:border-box}html,body{height:100%;color:var(--ink);-webkit-font-smoothing:antialiased;overscroll-behavior:none;touch-action:none;background:#05040d;margin:0;padding:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;overflow:hidden}.stage{position:fixed;inset:0}.stage canvas{touch-action:none;display:block}.hud{pointer-events:none;z-index:10;flex-direction:column;justify-content:space-between;gap:12px;padding:clamp(10px,2vw,20px);display:flex;position:fixed;inset:0}.hud__top{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.panel{background:var(--panel);border:1px solid var(--panel-border);-webkit-backdrop-filter:blur(10px);border-radius:14px;padding:10px 14px;box-shadow:0 8px 30px #00000059}.stat{align-items:baseline;gap:8px;line-height:1.1;display:flex}.stat__label{letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-size:11px}.stat__value{font-variant-numeric:tabular-nums;font-size:clamp(20px,3.4vw,30px);font-weight:700}.stat__sub{color:var(--muted);font-variant-numeric:tabular-nums;font-size:12px}.score{flex-direction:column;gap:2px;min-width:150px;display:flex}.combo{color:var(--accent);font-variant-numeric:tabular-nums;min-height:1em;font-weight:700}.badge-row{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.badge{letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--panel-border);color:var(--muted);white-space:nowrap;background:#ffffff0d;border-radius:999px;padding:4px 8px;font-size:11px}.badge--live{color:#04121f;background:var(--accent-2);border-color:#0000;font-weight:700}.badge--music{color:#1a0b0b;background:var(--accent);border-color:#0000;font-weight:700}.achievements{pointer-events:auto;touch-action:pan-y;scrollbar-width:thin;flex-direction:column;align-items:flex-end;gap:8px;max-width:min(320px,44vw);max-height:min(58vh,560px);padding-right:2px;display:flex;overflow-y:auto}.badge--button{pointer-events:auto;cursor:pointer;font:inherit}.achievements__toggle{pointer-events:auto;cursor:pointer;font:inherit;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);background:var(--panel);border:1px solid var(--panel-border);border-radius:999px;padding:6px 12px;font-size:12px}.achievement{background:var(--panel);border:1px solid var(--panel-border);opacity:.55;border-radius:12px;align-items:center;gap:10px;width:100%;padding:8px 10px;transition:opacity .25s,transform .25s;display:flex}.achievement--unlocked{opacity:1;border-color:#ff5a5fa6;animation:.4s pop}.achievement__icon{background:#ffffff14;border-radius:8px;flex:0 0 26px;place-items:center;height:26px;font-size:14px;display:grid}.achievement--unlocked .achievement__icon{background:var(--accent)}.achievement__body{flex:1;min-width:0}.achievement__name{font-size:13px;font-weight:600}.achievement__meta{color:var(--muted);font-size:11px}.achievement__bar{background:#ffffff1f;border-radius:999px;height:3px;margin-top:4px;overflow:hidden}.achievement__fill{background:var(--accent);height:100%;transition:width .3s}@keyframes pop{0%{transform:scale(.94)}60%{transform:scale(1.02)}to{transform:scale(1)}}.toasts{z-index:12;pointer-events:none;flex-direction:column;align-items:center;gap:8px;display:flex;position:fixed;top:clamp(64px,14vh,150px);left:50%;transform:translate(-50%)}.toast{border:1px solid var(--panel-border);white-space:nowrap;background:#141028db;border-radius:999px;padding:8px 16px;font-size:14px;font-weight:600;animation:.25s toastIn,.4s 1.5s forwards toastOut}.toast--achievement{border-color:var(--accent);color:#fff}@keyframes toastIn{0%{opacity:0;transform:translateY(-8px)scale(.96)}to{opacity:1;transform:none}}@keyframes toastOut{to{opacity:0;transform:translateY(-10px)}}.hud__bottom{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;display:flex}.keys{flex-wrap:wrap;gap:6px;max-width:62ch;display:flex}.key{color:var(--muted);background:var(--panel);border:1px solid var(--panel-border);border-radius:8px;align-items:center;gap:6px;padding:4px 8px;font-size:11px;display:inline-flex}.key kbd{font:inherit;color:var(--ink);text-align:center;background:#ffffff1a;border-radius:4px;min-width:18px;padding:1px 5px;font-weight:700}.touch{pointer-events:auto;flex-wrap:wrap;align-items:flex-end;gap:10px;display:none}.touch__cluster{gap:8px;display:flex}.touch__btn{-webkit-tap-highlight-color:transparent;touch-action:none;-webkit-user-select:none;user-select:none;cursor:pointer;min-width:64px;min-height:56px;font:inherit;letter-spacing:.04em;color:var(--ink);border:1px solid var(--panel-border);-webkit-backdrop-filter:blur(8px);background:#14102cc7;border-radius:16px;padding:10px 14px;font-size:13px;font-weight:700;transition:transform 80ms,background .15s}.touch__btn:active,.touch__btn[data-active=true]{background:#4fd1ff47;transform:translateY(2px)scale(.97)}.touch__btn--accent{border-color:#ff5a5f99}@media (pointer:coarse),(max-width:860px){.touch{display:flex}.keys{display:none}.achievements{max-width:60vw}}.start{z-index:20;-webkit-backdrop-filter:blur(3px);text-align:center;background:radial-gradient(120% 90% at 50% 20%,#3c1e5099,#04030cf0);place-items:center;padding:24px;display:grid;position:fixed;inset:0}.start__card{flex-direction:column;align-items:center;gap:14px;max-width:560px;display:flex}.start h1{letter-spacing:-.02em;margin:0;font-size:clamp(28px,6vw,52px);line-height:1.05}.start p{color:var(--muted);margin:0;font-size:clamp(14px,2vw,17px);line-height:1.5}.start__btn{pointer-events:auto;cursor:pointer;font:inherit;color:#180a10;background:linear-gradient(180deg, #ff8a5f, var(--accent));border:none;border-radius:999px;padding:14px 34px;font-size:18px;font-weight:700;box-shadow:0 10px 30px #ff5a5f59}.start__hint{color:var(--muted);font-size:12px}.perf{z-index:11;font-variant-numeric:tabular-nums;color:var(--muted);background:var(--panel);border:1px solid var(--panel-border);pointer-events:none;border-radius:10px;padding:6px 10px;font-size:11px;line-height:1.5;position:fixed;bottom:clamp(10px,2vw,20px);right:clamp(10px,2vw,20px)}.perf b{color:var(--ink);font-weight:600}@media (pointer:coarse),(max-width:860px){.perf{padding:4px 8px;font-size:10px;top:clamp(10px,2vw,20px);bottom:auto}}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}
