:root{--vkeys-height: 0px;--mono: "JetBrains Mono", "SF Mono", ui-monospace, Menlo, Consolas, monospace}html,body,#root{margin:0;width:100%;height:100%;overflow:hidden;background:#020203;font-family:var(--mono);color:#f2f2f2}.hud{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;padding:24px;display:flex;flex-direction:column;gap:6px}.hud-header{display:flex;align-items:center;justify-content:space-between}.hud-title{display:block;width:min(260px,50vw);height:auto;opacity:.9}.hud-credit{position:absolute;bottom:calc(24px + env(safe-area-inset-bottom));left:0;right:0;width:max-content;margin:0 auto;pointer-events:auto;color:inherit;font-size:10px;letter-spacing:.1em;text-transform:uppercase;text-decoration:underline;text-underline-offset:3px;opacity:.35;transition:opacity .15s}.hud-credit:hover{opacity:.7}.hud-gauge{position:absolute;left:24px;bottom:calc(24px + var(--vkeys-height));padding:12px 16px 10px;background:linear-gradient(to right,#0000008c,#0000);font-variant-numeric:tabular-nums;text-transform:uppercase}.hud-gauge small{font-size:11px;letter-spacing:.2em;opacity:.55}.hud-gauge-speed{display:flex;align-items:baseline;gap:8px;font-size:48px;font-weight:700;line-height:1;text-shadow:0 0 12px rgba(255,255,255,.35)}.hud-gauge-row{display:flex;align-items:baseline;gap:8px;margin-top:6px;font-size:16px}.hud-hint{position:absolute;bottom:calc(32px + var(--vkeys-height));left:0;right:0;text-align:center;font-size:15px;letter-spacing:.15em;text-transform:uppercase;opacity:.85}.hud-controls{position:absolute;bottom:68px;right:24px;display:flex;flex-direction:column;align-items:flex-end;gap:10px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;opacity:.85}.hud-help{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:1px solid rgba(255,255,255,.35);border-radius:50%;background:none;color:inherit;font:inherit;font-size:13px;opacity:.6;cursor:pointer;pointer-events:auto;transition:opacity .15s}.hud-help:hover{opacity:1}.hud-help[hidden]{display:none}.hud-controls kbd+kbd{margin-left:0}.hud-note{font-size:12px;opacity:.55;text-transform:uppercase}.hud-meter{position:absolute;bottom:calc(70px + var(--vkeys-height));left:50%;width:min(360px,70vw);height:14px;transform:translate(-50%);border:1px solid rgba(255,255,255,.5);border-radius:7px;background:#9696a059;overflow:hidden}.hud-meter[hidden]{display:none}.hud-meter-fill{position:absolute;top:3px;bottom:3px;left:0;border-radius:4px;background:#f2f2f2;box-shadow:0 0 8px #fffc}.hud-score{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;pointer-events:auto;cursor:pointer;background:radial-gradient(ellipse at center,#000000b8,#0000008c);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);animation:score-dim .4s ease-out}.hud-score-retry-tap{display:none}.hud-score>*{animation:score-in .35s cubic-bezier(.2,1.6,.4,1)}.hud-score-logo{width:min(260px,50vw);height:auto;margin-bottom:48px;opacity:.9}.hud-score-total{font-variant-numeric:tabular-nums;font-size:clamp(64px,14vw,180px);font-weight:800;letter-spacing:.04em;line-height:1;text-shadow:0 0 30px rgba(255,255,255,.45),0 4px 24px rgba(0,0,0,.6)}.hud-score-stats{display:grid;grid-template-columns:auto auto;gap:4px 24px;width:max-content;margin:40px auto 0;font-size:13px;letter-spacing:.12em;text-transform:uppercase}.hud-score-stats dt{text-align:left;opacity:.55}.hud-score-stats dd{margin:0;text-align:right;font-variant-numeric:tabular-nums}.hud-score-retry{margin-top:22px;font-size:16px;letter-spacing:.15em;text-transform:uppercase;opacity:.85}kbd{display:inline-block;margin:0 .4em;padding:.3em .7em .25em;border:1px solid rgba(255,255,255,.55);border-bottom-width:3px;border-radius:6px;background:#ffffff14;font-family:inherit;font-size:.85em;letter-spacing:.08em;line-height:1;vertical-align:.1em}.hud-score[hidden]{display:none}@keyframes score-in{0%{opacity:0;transform:scale(.6)}}@keyframes score-dim{0%{opacity:0}}.tutorial{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1;display:flex;justify-content:center;align-items:flex-start;padding:0 16px;padding-top:18vh;pointer-events:none}.tutorial[data-paused]{background:#00000073;animation:score-dim .25s ease-out}.tutorial-card{width:min(440px,100%);padding:20px 24px;border:1px solid rgba(255,255,255,.35);border-radius:10px;background:#08080cd1;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);text-align:center;animation:score-in .35s cubic-bezier(.2,1.6,.4,1)}.tutorial-title{font-size:18px;font-weight:700;letter-spacing:.2em;text-transform:uppercase}.tutorial-body{margin:12px 0 0;font-size:13px;line-height:1.9;opacity:.85}.tutorial-prompt{margin-top:16px;font-size:13px;letter-spacing:.12em;text-transform:uppercase}.tutorial-skip{margin-top:18px;padding:0;border:0;background:none;color:inherit;font:inherit;font-size:10px;letter-spacing:.1em;text-transform:uppercase;opacity:.45;cursor:pointer;pointer-events:auto;transition:opacity .15s}.tutorial-skip:hover{opacity:.8}.loading{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:28px;background:#020203;transition:opacity .5s ease-out}.loading[data-loaded]{opacity:0;pointer-events:none}.loading-logo{width:min(260px,50vw);height:auto;opacity:.9}.loading-bar{position:relative;width:min(360px,70vw);height:14px;border:1px solid rgba(255,255,255,.5);border-radius:7px;background:#9696a059;overflow:hidden}.loading-bar-fill{position:absolute;top:3px;bottom:3px;left:0;border-radius:4px;background:#f2f2f2;box-shadow:0 0 8px #fffc;transition:width .2s ease-out}.loading-label{font-size:12px;letter-spacing:.15em;text-transform:uppercase;font-variant-numeric:tabular-nums;opacity:.55}.vkeys{position:fixed;right:0;bottom:0;z-index:1;display:flex;flex-direction:column-reverse;align-items:flex-end;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.vkeys-tab{display:flex;align-items:center;justify-content:center;width:48px;height:32px;padding:0;border:1px solid rgba(255,255,255,.35);border-right:0;border-bottom:0;border-radius:8px 0 0;background:#08080cd1;color:inherit;opacity:.6;cursor:pointer;transition:opacity .15s}.vkeys-tab:hover,.vkeys[data-open] .vkeys-tab{opacity:1}.vkeys-panel{display:flex;align-items:stretch;gap:12px;margin-bottom:-1px;padding:14px;border:1px solid rgba(255,255,255,.35);border-right:0;border-bottom:0;border-radius:10px 0 0;background:#08080cd1;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.vkeys:not([data-open]) .vkeys-panel{display:none}body:has(.vkeys[data-open]) .hud-controls{bottom:170px}.vkeys-arrows{display:grid;grid-template-columns:repeat(3,var(--vkeys-key, 44px));grid-template-rows:repeat(2,var(--vkeys-key, 44px));gap:6px}.vkeys-up{grid-area:1 / 2}.vkeys-left{grid-area:2 / 1}.vkeys-down{grid-area:2 / 2}.vkeys-right{grid-area:2 / 3}.vkeys-key{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:0;border:1px solid rgba(255,255,255,.55);border-bottom-width:3px;border-radius:6px;background:#ffffff14;color:inherit;font:inherit;font-size:16px;line-height:1;touch-action:none;cursor:pointer}.vkeys-key:active{border-bottom-width:1px;background:#ffffff38}.vkeys-action{min-width:96px;font-size:13px;letter-spacing:.12em;text-transform:uppercase}.vkeys-action small{font-size:9px;opacity:.55}@media(hover:none)and (pointer:coarse){:root{--vkeys-height: 150px}.vkeys{left:0;right:0}.vkeys-tab,.hud-controls{display:none}.vkeys-panel,.vkeys:not([data-open]) .vkeys-panel{display:flex;align-self:stretch;--vkeys-key: 56px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));border-radius:0;border-left:0;border-right:0}.vkeys-action{width:128px;margin-left:auto;font-size:16px}body:has(.hud-score:not([hidden])) .vkeys{display:none}.hud-score-retry-key{display:none}.hud-score-retry-tap{display:inline}.hud-meter{bottom:calc(12px + var(--vkeys-height));left:24px;right:24px;width:auto;transform:none}.hud-gauge{position:static;align-self:flex-start;margin:8px 0 0 -16px;display:flex;align-items:baseline;gap:20px}.hud-gauge-speed{font-size:36px}.hud-gauge-row{margin-top:0}.hud-hint{position:static;align-self:flex-end;max-width:70%;margin-top:12px;text-align:right;font-size:13px;line-height:1.8}}
