:root{--game-gate:#ffc233;--game-collectible:#fff0b0;--game-obstacle:#e23b2a;--game-jump:#ff8f2e;--game-slide:#ff7ab0;--legend-chip-bg:#090b16d9;--j-perfect:#35c2dd;--j-great:#4fce89;--j-good:#e0a53a;--j-miss:#ff5a6a;--danger:#ff5a6a;--danger-soft:#ff5a6a1f;--mono:ui-monospace, "Cascadia Code", Consolas, monospace;--bg-0:#17120b;--bg-1:#1f1810;--bg-2:#2a2015;--body-bg:radial-gradient(1100px 700px at 15% -10%, #2a1e0f 0%, transparent 60%), radial-gradient(900px 650px at 110% 0%, #3a1c0c 0%, transparent 55%), var(--bg-0);--panel:#261d12bd;--panel-border:#e8b05c3d;--surface-2:#1e160c99;--input-bg:#140e07b3;--btn-bg:#382a1899;--stage-bg:repeating-linear-gradient(0deg, #ffaa460d 0 2px, transparent 2px 5px), radial-gradient(120% 80% at 50% 0%, #ff78321a, transparent 60%), #160f07;--overlay-scrim:#0f0a049e;--text:#eaddc7;--text-dim:#b39b76;--text-h:#fff4e2;--accent:#ffb43d;--accent-2:#ff7a3d;--accent-contrast:#201404;--accent-soft:#ffb43d21;--btn-primary-bg:linear-gradient(135deg, #ffbe4d 0%, #ff7a3d 100%);--glow-hover:0 0 0 1px var(--accent), 0 6px 20px #ff8c3c38;--glow-strong:0 8px 26px #ff7a3d66;--focus-ring:0 0 0 3px #ffb43d33;--shadow-card:0 26px 70px #00000080, inset 0 1px 0 var(--hi-inset);--shadow-inset:inset 0 0 60px #0000008c;--divider:#fff0d21a;--hi-inset:#fff0d20f;--track-bg:#fff0d21f;--font-display:"Bahnschrift", "Franklin Gothic Medium", "Arial Narrow Bold", "Segoe UI", sans-serif;--font-body:"Segoe UI", system-ui, Roboto, sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:var(--font-body);color:var(--text)}[data-theme=editorial]{--bg-0:#0b0b0d;--bg-1:#101013;--bg-2:#17171b;--body-bg:var(--bg-0);--panel:#121216;--panel-border:#ffffff1f;--surface-2:#171519;--input-bg:#0e0e11;--btn-bg:#17171c;--stage-bg:radial-gradient(#ffffff1a 2px, transparent 2.4px) 0 0 / 22px 22px, #0b0b0d;--overlay-scrim:#08080ab8;--text:#d7d7dd;--text-dim:#85858f;--text-h:#f5f5f7;--accent:#ff4d2e;--accent-2:#ff4d2e;--accent-contrast:#fff;--accent-soft:#ff4d2e1f;--btn-primary-bg:var(--accent);--glow-hover:0 0 0 1px var(--accent);--glow-strong:0 0 0 1px var(--accent);--focus-ring:0 0 0 2px var(--accent);--shadow-card:0 20px 60px #00000080;--shadow-inset:none;--divider:#ffffff1a;--hi-inset:#ffffff0a;--track-bg:#ffffff1a;--font-display:Georgia, "Times New Roman", serif;--font-body:"Segoe UI", system-ui, Roboto, sans-serif;--game-gate:#fff;--game-collectible:#ffb020;--game-obstacle:#ff3b30;--game-jump:#3ddc97;--game-slide:#9aa0aa;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-theme=riso]{--bg-0:#ece5d6;--bg-1:#e4dccb;--bg-2:#dcd3bf;--body-bg:radial-gradient(1200px 800px at 15% -10%, #f3eddf 0%, transparent 60%), var(--bg-0);--panel:#f5efe2;--panel-border:#2b44d638;--surface-2:#ebe3d1;--input-bg:#fbf7ee;--btn-bg:#ece4d1;--stage-bg:radial-gradient(#2b44d629 1.4px, transparent 1.6px) 0 0 / 11px 11px, radial-gradient(#f2452e1f 1.4px, transparent 1.6px) 5.5px 5.5px / 11px 11px, #e8e2d4;--overlay-scrim:#2b2f458c;--text:#2b2f45;--text-dim:#6b6f86;--text-h:#191d33;--accent:#2b44d6;--accent-2:#f2452e;--accent-contrast:#f7f2e7;--accent-soft:#2b44d61a;--btn-primary-bg:var(--accent);--glow-hover:3px 3px 0 #2b44d62e;--glow-strong:4px 4px 0 var(--accent-2);--focus-ring:0 0 0 3px #2b44d638;--shadow-card:8px 8px 0 #2b44d61a;--shadow-inset:none;--divider:#2b2f4524;--hi-inset:#ffffff80;--track-bg:#2b2f451f;--font-display:Georgia, "Iowan Old Style", "Times New Roman", serif;--font-body:"Segoe UI", system-ui, Roboto, sans-serif;--game-gate:#ff4d8a;--game-collectible:#ffd24d;--game-obstacle:#f2452e;--game-jump:#ff7a3d;--game-slide:#8a6cff;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[data-theme=slate]{--bg-0:#12151b;--bg-1:#171b22;--bg-2:#1e232c;--body-bg:radial-gradient(1100px 700px at 20% -10%, #1a2029 0%, transparent 60%), var(--bg-0);--panel:#1a1f27bd;--panel-border:#94a3b829;--surface-2:#161b2299;--input-bg:#0e1116b3;--btn-bg:#262d388c;--stage-bg:linear-gradient(#96afcd0f 1px, transparent 1px) 0 0 / 36px 36px, linear-gradient(90deg, #96afcd0f 1px, transparent 1px) 0 0 / 36px 36px, radial-gradient(120% 80% at 50% 0%, #7896be0f, transparent 60%), #0e1218;--overlay-scrim:#0c0f149e;--text:#cdd4de;--text-dim:#838d9c;--text-h:#eef2f7;--accent:#45b3a2;--accent-2:#6bbfd6;--accent-contrast:#0c1214;--accent-soft:#45b3a21f;--btn-primary-bg:linear-gradient(135deg, #45b3a2, #57bcd0);--glow-hover:0 0 0 1px var(--accent), 0 6px 18px #45b3a229;--glow-strong:0 8px 22px #45b3a247;--focus-ring:0 0 0 3px #45b3a22e;--shadow-card:0 24px 64px #00000080, inset 0 1px 0 var(--hi-inset);--shadow-inset:inset 0 0 60px #0000008c;--divider:#ffffff0f;--hi-inset:#ffffff0d;--track-bg:#ffffff14;--font-display:"Segoe UI Semibold", "Segoe UI", system-ui, sans-serif;--font-body:"Segoe UI", system-ui, Roboto, sans-serif;--game-gate:#4fd0c0;--game-collectible:#e8eef2;--game-obstacle:#ff5a6a;--game-jump:#5ab0e0;--game-slide:#8a9bd0;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-theme=neon]{--bg-0:#05060f;--bg-1:#0b0d1c;--bg-2:#12152b;--body-bg:radial-gradient(1200px 800px at 15% -10%, #14183a 0%, transparent 60%), radial-gradient(1000px 700px at 110% 10%, #2a0f3a 0%, transparent 55%), var(--bg-0);--panel:#12152bb8;--panel-border:#7882ff38;--surface-2:#0a0d1e99;--input-bg:#050814b3;--btn-bg:#1e2242b3;--stage-bg:radial-gradient(120% 80% at 50% 0%, #7c5cff1f, transparent 60%), #05060f;--overlay-scrim:#05060f99;--text:#cdd3f5;--text-dim:#7b83b4;--text-h:#eef1ff;--accent:#59f7ff;--accent-2:#ff5cc8;--accent-contrast:#05060f;--accent-soft:#59f7ff1a;--btn-primary-bg:linear-gradient(135deg, #22d3ee 0%, #7c5cff 100%);--glow-hover:0 0 0 1px var(--accent), 0 6px 22px #59f7ff2e;--glow-strong:0 0 24px #7c5cff8c;--focus-ring:0 0 0 3px #59f7ff29;--shadow-card:0 30px 80px #0000008c, inset 0 1px 0 var(--hi-inset);--shadow-inset:inset 0 0 60px #0009;--divider:#ffffff0f;--hi-inset:#ffffff0d;--track-bg:#ffffff14;--font-display:"Segoe UI", system-ui, Roboto, sans-serif;--font-body:"Segoe UI", system-ui, Roboto, sans-serif;--game-gate:#59f7ff;--game-collectible:#ffd166;--game-obstacle:#ff4d6d;--game-jump:#ff9e3d;--game-slide:#c77dff;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;min-height:100svh;margin:0}body{background:var(--body-bg);color:var(--text);font-family:var(--font-body);-webkit-font-smoothing:antialiased;background-attachment:fixed}button{font-family:inherit}a{color:var(--accent)}.btn{appearance:none;border:1px solid var(--panel-border);background:var(--btn-bg);color:var(--text-h);letter-spacing:.02em;cursor:pointer;border-radius:10px;padding:11px 18px;font-size:15px;font-weight:600;transition:transform 80ms,border-color .15s,box-shadow .15s,background .15s}.btn:hover:not(:disabled){border-color:var(--accent);box-shadow:var(--glow-hover);transform:translateY(-1px)}.btn:active:not(:disabled){transform:translateY(0)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:var(--btn-primary-bg);color:var(--accent-contrast);text-shadow:none;border-color:#0000}.btn-primary:hover:not(:disabled){box-shadow:var(--glow-strong)}.btn-ghost{background:0 0}.btn-small{padding:7px 12px;font-size:13px}.btn-generate{width:100%;margin-top:4px;padding:15px;font-size:17px}code{font-family:var(--mono);background:var(--accent-soft);color:var(--accent);border-radius:4px;padding:1px 5px}.landing{place-items:center;min-height:100svh;padding:24px;display:grid}.landing-card{background:var(--panel);border:1px solid var(--panel-border);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);width:min(560px,100%);box-shadow:var(--shadow-card);border-radius:20px;padding:34px 34px 26px;position:relative}.landing-toolbar{justify-content:space-between;align-items:flex-start;gap:12px;display:flex;position:absolute;top:14px;left:16px;right:16px}.brand{text-align:center;margin:30px 0 26px}.brand-mark{color:var(--accent);letter-spacing:4px;text-shadow:0 0 18px var(--accent-soft);margin-bottom:6px;font-size:26px;display:inline-block}.brand h1{font-family:var(--font-display);letter-spacing:-.02em;color:var(--text-h);margin:6px 0 8px;font-size:42px;font-weight:800}.brand-accent{background:linear-gradient(90deg, var(--accent), var(--accent-2));color:#0000;-webkit-background-clip:text;background-clip:text}.tagline{color:var(--text-dim);font-size:15px}.song-form{flex-direction:column;gap:18px;display:flex}.field{flex-direction:column;gap:8px;display:flex}.field-label{text-transform:uppercase;letter-spacing:.12em;color:var(--text-dim);font-size:13px}.text-input{background:var(--input-bg);border:1px solid var(--panel-border);color:var(--text-h);border-radius:10px;outline:none;padding:13px 14px;font-size:15px;transition:border-color .15s,box-shadow .15s}.text-input:focus{border-color:var(--accent);box-shadow:var(--focus-ring)}.field-bpm{max-width:140px}.difficulty-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.difficulty-btn{text-align:left;border:1px solid var(--panel-border);background:var(--surface-2);color:var(--text);cursor:pointer;border-radius:12px;flex-direction:column;align-items:flex-start;gap:3px;padding:12px 14px;transition:all .14s;display:flex}.difficulty-btn:hover{border-color:var(--accent)}.difficulty-btn.active{border-color:var(--accent);background:var(--accent-soft);box-shadow:var(--glow-hover)}.difficulty-name{color:var(--text-h);font-size:15px;font-weight:700}.difficulty-blurb{color:var(--text-dim);font-size:12px}.form-error{color:var(--danger);background:var(--danger-soft);border:1px solid var(--danger);border-radius:8px;padding:10px 12px;font-size:14px}.hint{color:var(--text-dim);margin-top:18px;font-size:13px;line-height:1.5}.reco{border-top:1px solid var(--divider);margin-top:22px;padding-top:18px}.reco-head{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.reco-title{text-transform:uppercase;letter-spacing:.12em;color:var(--text-dim);font-size:13px}.reco-shuffle{appearance:none;border:1px solid var(--panel-border);color:var(--accent);cursor:pointer;background:0 0;border-radius:999px;padding:5px 10px;font-size:12px;font-weight:600;transition:all .14s}.reco-shuffle:hover{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.reco-loading{min-height:118px;color:var(--text-dim);flex-direction:column;justify-content:center;align-items:center;gap:10px;font-size:12px;display:flex}.reco-spinner{border:3px solid var(--accent-soft);border-top-color:var(--accent);border-radius:50%;width:28px;height:28px;animation:.8s linear infinite spin}.reco-grid{grid-template-columns:1fr 1fr 1fr;gap:10px;display:grid}.reco-card{border:1px solid var(--panel-border);background:var(--surface-2);color:var(--text);cursor:pointer;text-align:left;border-radius:12px;flex-direction:column;gap:8px;padding:0;transition:transform .1s,border-color .15s,box-shadow .15s;display:flex;overflow:hidden}.reco-card:hover:not(:disabled){border-color:var(--accent);box-shadow:var(--glow-strong);transform:translateY(-2px)}.reco-card:disabled{opacity:.5;cursor:not-allowed}.reco-thumb{aspect-ratio:16/9;object-fit:cover;background:var(--bg-0);width:100%;display:block}.reco-thumb-wrap{display:block;position:relative}.reco-difficulty{color:#fff;letter-spacing:.04em;text-transform:uppercase;background:#080c16e6;border:1px solid #ffffff47;border-radius:999px;padding:3px 7px;font-size:10px;font-weight:800;line-height:1;position:absolute;bottom:7px;right:7px;box-shadow:0 2px 8px #00000073}.reco-difficulty.difficulty-easy{background:#146f48f0}.reco-difficulty.difficulty-medium{background:#1e5c9df0}.reco-difficulty.difficulty-hard{background:#a35914f0}.reco-difficulty.difficulty-extreme{background:#971e4cf0}.reco-name{color:var(--text-h);-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;padding:0 10px 10px;font-size:12px;line-height:1.3;display:-webkit-box;overflow:hidden}.game-view{grid-template:"stage video""stage sidebar"1fr/1fr 380px;gap:18px;min-height:100svh;padding:18px;display:grid;position:relative}.stage{grid-area:stage}.game-view>.video-frame{grid-area:video}.sidebar{grid-area:sidebar;align-self:start}.menu-toggle,.menu-scrim{display:none}.help-toggle{z-index:60;border:1px solid var(--panel-border);background:var(--panel);min-height:42px;color:var(--text-h);font:700 12px/1 var(--font-body);cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--shadow-card);border-radius:999px;align-items:center;gap:8px;padding:8px 14px 8px 9px;transition:transform 80ms,border-color .15s,box-shadow .15s;display:inline-flex;position:fixed;bottom:18px;right:18px}.help-toggle:hover{border-color:var(--accent);box-shadow:var(--glow-hover);transform:translateY(-1px)}.help-toggle:focus-visible{border-color:var(--accent);box-shadow:var(--focus-ring);outline:none}.help-toggle-icon{background:var(--accent);width:26px;height:26px;color:var(--accent-contrast);font-family:var(--font-display);border-radius:50%;flex:none;place-items:center;font-size:17px;font-weight:900;display:inline-grid}.recording-indicator{z-index:70;border:1px solid var(--panel-border);background:color-mix(in srgb, var(--panel) 94%, transparent);max-width:min(360px,100vw - 36px);min-height:38px;color:var(--text-h);letter-spacing:.025em;box-shadow:var(--shadow-card);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:999px;align-items:center;gap:8px;padding:8px 12px;font-size:12px;font-weight:800;display:flex;position:fixed;top:18px;right:18px}.recording-indicator-dot{background:var(--text-dim);width:9px;height:9px;box-shadow:0 0 0 3px color-mix(in srgb, var(--text-dim) 18%, transparent);border-radius:50%;flex:none}.recording-indicator.is-armed,.recording-indicator.is-recording,.recording-indicator.is-paused{border-color:color-mix(in srgb, #ff365f 62%, var(--panel-border))}.recording-indicator.is-armed .recording-indicator-dot,.recording-indicator.is-recording .recording-indicator-dot,.recording-indicator.is-paused .recording-indicator-dot{background:#ff365f;box-shadow:0 0 0 3px #ff365f33}.recording-indicator.is-recording .recording-indicator-dot{animation:1.2s ease-in-out infinite recording-pulse}.recording-indicator.is-processing .recording-indicator-dot{background:var(--accent-2)}.recording-indicator.is-saved .recording-indicator-dot{background:var(--accent)}.recording-indicator.is-error{border-color:color-mix(in srgb, #ff365f 72%, var(--panel-border))}.recording-indicator.is-error .recording-indicator-dot{background:#ff365f}.recording-indicator-label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.recording-indicator-time{color:#ff7692;font-variant-numeric:tabular-nums}.recording-indicator-download{border:1px solid var(--accent);color:var(--accent);font:inherit;cursor:pointer;background:0 0;border-radius:999px;flex:none;padding:4px 8px;font-size:10px}.recording-indicator-download:hover{background:var(--accent-soft)}@keyframes recording-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.78)}}.stage{flex-direction:column;gap:12px;min-width:0;display:flex}.canvas-wrap{border:1px solid var(--panel-border);background:var(--stage-bg);min-height:420px;box-shadow:var(--shadow-inset);border-radius:18px;flex:1;position:relative;overflow:hidden}.game-host{touch-action:none;outline:none;position:absolute;inset:0}.game-host canvas{touch-action:none;-webkit-user-select:none;user-select:none;display:block}@media (prefers-reduced-motion:reduce){.recording-indicator-dot{animation:none}}.stage-overlay{background:var(--overlay-scrim);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:5;place-items:center;display:grid;position:absolute;inset:0}.overlay-card{text-align:center;background:var(--panel);border:1px solid var(--panel-border);border-radius:16px;flex-direction:column;align-items:center;gap:12px;padding:26px 34px;display:flex}.overlay-card h2{font-family:var(--font-display);color:var(--text-h);margin:0;font-size:26px}.overlay-card p{color:var(--text-dim);margin:0}.spinner{border:3px solid var(--accent-soft);border-top-color:var(--accent);border-radius:50%;width:34px;height:34px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.analysis-bar{background:var(--track-bg);border-radius:999px;width:240px;max-width:60vw;height:6px;overflow:hidden}.analysis-bar-fill{background:linear-gradient(90deg, var(--accent), var(--accent-2));border-radius:999px;height:100%;transition:width .2s}.overlay-error{color:var(--danger);word-break:break-word;max-width:320px;font-size:13px}.overlay-note{color:var(--text-dim);max-width:300px;font-size:12px}.first-run-splash{z-index:100;background:radial-gradient(circle at 50% 18%, var(--accent-soft), transparent 42%), var(--overlay-scrim);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);place-items:center;padding:20px;display:grid;position:fixed;inset:0;overflow-y:auto}.first-run-card{border:1px solid var(--panel-border);background:var(--panel);width:min(860px,100%);max-height:calc(100dvh - 40px);box-shadow:var(--shadow-card);border-radius:20px;padding:28px;overflow-y:auto}.first-run-header{text-align:center;max-width:620px;margin:0 auto 20px}.first-run-eyebrow{color:var(--accent);font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;margin-bottom:7px;font-size:11px;font-weight:800;display:inline-block}.first-run-header h2{color:var(--text-h);font-family:var(--font-display);margin:0 0 8px;font-size:34px}.first-run-header p,.tutorial-goal p,.tutorial-step p,.first-run-actions p{color:var(--text-dim);margin:0;line-height:1.45}.tutorial-hero{border:1px solid var(--panel-border);background:var(--surface-2);border-radius:16px;grid-template-columns:minmax(250px,.9fr) minmax(240px,1.1fr);align-items:center;gap:24px;padding:18px 22px;display:grid}.tutorial-game-preview{aspect-ratio:9/10;pointer-events:none;background:0 0;width:min(290px,100%);margin:0 auto;position:relative;overflow:hidden}.tutorial-game-preview canvas{clip-path:polygon(45% 10%,55% 10%,78% 92%,22% 92%);display:block;position:absolute;inset:0;width:100%!important;height:100%!important}.tutorial-goal h3,.tutorial-step h3{color:var(--text-h);font-family:var(--font-display);margin:0 0 5px}.tutorial-goal h3{font-size:20px}.tutorial-goal p{font-size:14px}.tutorial-mini-legend{color:var(--text-dim);letter-spacing:.08em;text-transform:uppercase;flex-wrap:wrap;gap:16px;margin-top:14px;font-size:11px;font-weight:700;display:flex}.tutorial-mini-legend span{align-items:center;gap:7px;display:inline-flex}.tutorial-mini-legend i{width:15px;height:15px;font-style:normal;display:inline-block}.tutorial-legend-gate{border:3px solid var(--accent);border-radius:3px;width:18px!important;height:10px!important}.tutorial-legend-runner{clip-path:polygon(50% 0,100% 100%,0 100%);background:var(--accent-2)}.tutorial-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px;display:grid}.tutorial-step{border:1px solid var(--panel-border);background:var(--surface-2);text-align:center;border-radius:14px;min-width:0;padding:15px}.tutorial-control-visual{min-height:64px;color:var(--accent);justify-content:center;align-items:center;gap:7px;margin-bottom:10px;display:flex}.tutorial-step h3{font-size:16px}.tutorial-step p{font-size:12px}.tutorial-key-row{gap:6px;display:flex}.tutorial-key{border:1px solid var(--accent);background:var(--panel);min-width:34px;height:34px;color:var(--text-h);font-family:var(--mono);box-shadow:0 0 12px var(--accent-soft);border-bottom-width:3px;border-radius:7px;place-items:center;padding:0 8px;font-size:12px;font-weight:800;display:inline-grid}.tutorial-key-wide{min-width:76px}.tutorial-phone{border:2px solid var(--text-h);width:32px;height:48px;color:var(--accent);box-shadow:0 0 12px var(--accent-soft);border-radius:8px;place-items:center;font-size:17px;font-weight:900;display:inline-grid}.tutorial-phone.is-tilting{transform:rotate(-9deg)}.tutorial-gesture-arrow{font-size:22px;font-weight:900}.tutorial-note-picture{aspect-ratio:120/82;pointer-events:none;flex:none;width:86px;position:relative}.tutorial-note-picture canvas{display:block;position:absolute;inset:0;width:100%!important;height:100%!important}.tutorial-tap{border:1px solid var(--accent);color:var(--text-h);font-family:var(--mono);border-radius:999px;padding:5px 8px;font-size:10px;font-weight:900}.tutorial-hazard-pictures{justify-content:center;align-items:flex-start;gap:6px;display:flex}.tutorial-hazard-picture{color:var(--text-dim);font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;flex-direction:column;align-items:center;gap:1px;font-size:8px;font-weight:800;display:flex}.tutorial-hazard-picture .tutorial-note-picture{width:70px}.first-run-actions{text-align:center;flex-direction:column;align-items:center;gap:8px;margin-top:18px;display:flex}.first-run-start{min-width:210px}.first-run-actions p{font-size:12px}.mode-badge{letter-spacing:.04em;text-transform:uppercase;color:var(--accent);border:1px solid var(--accent);background:var(--accent-soft);border-radius:999px;margin-left:auto;padding:4px 10px;font-size:11px;font-weight:700}.touch-controls{color:var(--text-dim);flex-wrap:wrap;justify-content:center;gap:8px;font-size:12px;display:flex}.touch-controls span{border:1px solid var(--panel-border);background:var(--surface-2);border-radius:999px;padding:4px 12px}.hud{background:var(--panel);border:1px solid var(--panel-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:14px;padding:12px 18px}.hud-backdrop{display:none}.hud-row{align-items:flex-end;gap:28px;display:flex}.hud-group{display:contents}.hud-stat{flex-direction:column;gap:2px;display:flex}.hud-stat-right{text-align:right;margin-left:auto}.hud-label{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.14em;color:var(--text-dim);font-size:11px}.hud-value{color:var(--text-h);font-variant-numeric:tabular-nums;font-size:24px;font-weight:800;line-height:1}.hud-score{color:var(--accent);text-shadow:0 0 16px var(--accent-soft)}.hud-combo{color:var(--accent-2)}.hud-sub{color:var(--text-dim);font-size:14px;font-weight:600}.hud-time{font-size:18px}.hud-progress{background:var(--track-bg);border-radius:999px;height:5px;margin-top:10px;overflow:hidden}.hud-progress-fill{background:linear-gradient(90deg, var(--accent), var(--accent-2));border-radius:999px;height:100%;transition:width .1s linear}.hud-maxcombo{color:var(--text-dim);letter-spacing:.05em;margin-top:6px;font-size:11px}.sidebar{background:var(--panel);border:1px solid var(--panel-border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:18px;flex-direction:column;gap:14px;height:fit-content;padding:16px;display:flex}.sidebar-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;display:flex}.theme-switcher{align-items:center;gap:8px;display:inline-flex}.theme-switcher-label{text-transform:uppercase;letter-spacing:.12em;color:var(--text-dim);font-size:11px}.theme-select{background:var(--surface-2);color:var(--text-h);border:1px solid var(--panel-border);cursor:pointer;border-radius:8px;padding:5px 8px;font-family:inherit;font-size:12px;font-weight:600;transition:border-color .15s}.theme-select:hover{border-color:var(--accent)}.theme-select:focus-visible{border-color:var(--accent);box-shadow:var(--focus-ring);outline:none}.landing-theme{flex:none}.account-control{align-items:center;gap:8px;min-width:0;display:flex}.account-name{max-width:150px;color:var(--text-h);font-family:var(--mono);text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:700;overflow:hidden}.account-action{appearance:none;border:1px solid var(--panel-border);background:var(--surface-2);color:var(--accent);font:600 12px/1 var(--font-body);cursor:pointer;border-radius:999px;padding:6px 10px}.account-action:hover:not(:disabled){border-color:var(--accent);box-shadow:var(--glow-hover)}.account-action:disabled{opacity:.55;cursor:wait}.account-error{border:1px solid var(--danger);background:var(--panel);width:min(320px,80vw);color:var(--danger);z-index:2;border-radius:8px;padding:7px 9px;font-size:11px;line-height:1.35;position:absolute;top:calc(100% + 6px);left:0}.sidebar-account{border-bottom:1px solid var(--divider);justify-content:flex-end;padding-bottom:10px;position:relative}.sidebar-account .account-error{left:auto;right:0}.video-frame{aspect-ratio:16/9;border:1px solid var(--panel-border);width:100%;box-shadow:var(--glow-strong);background:#000;border-radius:12px;position:relative;overflow:hidden}.video-iframe,.video-iframe iframe{border:0;position:absolute;inset:0;width:100%!important;height:100%!important}.inline-play{color:var(--accent-contrast);background:var(--accent);border-radius:6px;margin:0 2px;padding:1px 9px;font-size:.8em;display:inline-block;transform:translateY(1px)}.controls-hint{color:var(--text-dim);margin:0;font-size:12px;line-height:1.4}.yt-link{color:var(--accent);align-items:center;gap:6px;font-size:14px;font-weight:600;text-decoration:none;display:inline-flex}.yt-link:hover{text-decoration:underline}.controls{border-top:1px solid var(--divider);flex-direction:column;gap:12px;padding-top:4px;display:flex}.control-row{gap:10px;display:flex}.control-row .btn{flex:1}.fullscreen-btn{width:100%;display:none}.volume-control{flex-direction:column;gap:6px;display:flex}.volume-label{text-transform:uppercase;letter-spacing:.14em;color:var(--text-dim);justify-content:space-between;align-items:center;font-size:11px;display:flex}.volume-value{color:var(--text-h);letter-spacing:0;font-variant-numeric:tabular-nums}.volume-slider{width:100%;accent-color:var(--accent);cursor:pointer}.control-label{text-transform:uppercase;letter-spacing:.14em;color:var(--text-dim);font-size:11px}.control-difficulty{flex-direction:column;gap:8px;display:flex}.difficulty-pills{gap:6px;display:flex}.pill{text-transform:capitalize;border:1px solid var(--panel-border);background:var(--surface-2);color:var(--text-dim);cursor:pointer;border-radius:8px;flex:1;padding:8px 6px;font-size:12px;font-weight:600;transition:all .14s}.pill:hover:not(:disabled){color:var(--text-h);border-color:var(--accent)}.pill.active{color:var(--accent-contrast);background:var(--btn-primary-bg);border-color:#0000}.pill:disabled{opacity:.5;cursor:not-allowed}.legend{border-top:1px solid var(--divider);flex-wrap:wrap;gap:8px;padding-top:10px;display:flex}.legend-item{background:var(--legend-chip-bg);border:1px solid #0000;border-radius:999px;padding:4px 9px;font-size:11px}.legend-gate{color:var(--game-gate);border-color:color-mix(in srgb, var(--game-gate) 45%, transparent)}.legend-collectible{color:var(--game-collectible);border-color:color-mix(in srgb, var(--game-collectible) 45%, transparent)}.legend-obstacle{color:var(--game-obstacle);border-color:color-mix(in srgb, var(--game-obstacle) 45%, transparent)}.legend-jump{color:var(--game-jump);border-color:color-mix(in srgb, var(--game-jump) 45%, transparent)}.legend-slide{color:var(--game-slide);border-color:color-mix(in srgb, var(--game-slide) 45%, transparent)}.gesture-help{border-top:1px solid var(--divider);padding-top:10px;display:none}.gesture-help-title{text-transform:uppercase;letter-spacing:.14em;color:var(--text-dim);font-size:11px}.gesture-help-list{color:var(--text);grid-template-columns:1fr 1fr;gap:6px 12px;margin:8px 0 0;padding:0;font-size:13px;list-style:none;display:grid}.results-overlay{z-index:50;-webkit-overflow-scrolling:touch;background:var(--overlay-scrim);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:24px;animation:.25s fade-in;display:flex;position:fixed;inset:0;overflow-y:auto}@keyframes fade-in{0%{opacity:0}}.results-card{background:var(--panel);border:1px solid var(--panel-border);text-align:center;width:min(520px,100%);box-shadow:var(--shadow-card);border-radius:20px;margin:auto;padding:30px}.results-title{letter-spacing:.04em;text-transform:uppercase;color:var(--text-dim);margin:0 0 12px;font-size:22px}.results-grademark{background:linear-gradient(135deg, var(--accent), var(--accent-2));color:#0000;filter:drop-shadow(0 0 24px var(--accent-soft));-webkit-background-clip:text;background-clip:text;margin:6px 0 14px;font-size:92px;font-weight:900;line-height:1}.results-grademark[data-grade=SS],.results-grademark[data-grade=S]{background:linear-gradient(135deg, var(--game-collectible), var(--accent-2));-webkit-background-clip:text;background-clip:text}.results-headline{margin-bottom:20px}.results-score{color:var(--text-h);font-variant-numeric:tabular-nums;font-size:44px;font-weight:800}.results-sub{color:var(--text-dim);margin-top:4px;font-size:14px}.results-judgments{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:22px;display:grid}.results-jrow{background:var(--surface-2);border:1px solid var(--panel-border);border-radius:10px;justify-content:space-between;align-items:center;padding:10px 14px;display:flex}.results-jlabel{letter-spacing:.05em;font-size:13px;font-weight:700}.results-jval{color:var(--text-h);font-variant-numeric:tabular-nums;font-size:18px;font-weight:800}.j-perfect{color:var(--j-perfect)}.j-great{color:var(--j-great)}.j-good{color:var(--j-good)}.j-miss{color:var(--j-miss)}.results-actions{flex-direction:column;gap:10px;display:flex}.results-actions .btn{width:100%}@media (width<=900px){.first-run-splash{padding:max(10px, env(safe-area-inset-top,0px)) 10px max(10px, env(safe-area-inset-bottom,0px));place-items:start center}.first-run-card{width:100%;max-height:calc(100dvh - 20px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));border-radius:16px;padding:18px}.first-run-header{margin-bottom:14px}.first-run-header h2{font-size:28px}.first-run-header p{font-size:13px}.tutorial-hero{grid-template-columns:minmax(118px,.75fr) minmax(150px,1.25fr);gap:14px;padding:12px}.tutorial-goal h3{font-size:17px}.tutorial-goal p{font-size:12px}.tutorial-mini-legend{gap:10px;margin-top:9px;font-size:9px}.tutorial-steps{grid-template-columns:1fr;gap:8px;margin-top:10px}.tutorial-step{text-align:left;grid-template-columns:104px minmax(0,1fr);align-items:center;gap:10px;padding:10px 12px;display:grid}.tutorial-control-visual{min-height:50px;margin:0}.tutorial-step h3{font-size:14px}.tutorial-step p{font-size:11px}.tutorial-key{min-width:26px;height:29px;padding:0 5px}.tutorial-key-wide{min-width:68px}.tutorial-phone{height:42px}.tutorial-note-picture{width:64px}.tutorial-hazard-picture .tutorial-note-picture{width:48px}.tutorial-hazard-picture{font-size:7px}.first-run-actions{margin-top:12px}.game-view{--hdr-top:calc(6px + env(safe-area-inset-top,0px));--video-w:min(248px, 58vw);--video-h:calc(var(--video-w) * 9 / 16);--banner-h:calc((var(--video-h) + 6px) / .9467);--hud-h:82px;--game-top:calc(var(--hdr-top) + var(--hud-h));gap:0;height:100dvh;min-height:0;max-height:100dvh;padding:0;display:block;position:relative;overflow:hidden}.stage{gap:0;display:block;position:absolute;inset:0}.canvas-wrap{top:var(--game-top);min-height:0;box-shadow:none;border:none;border-radius:0;position:absolute;bottom:0;left:0;right:0}.hud-backdrop{height:calc(var(--banner-h) + env(safe-area-inset-top,0px));z-index:10;pointer-events:none;background:var(--stage-bg);background-color:var(--bg-0);clip-path:url(#hudBannerClip);filter:drop-shadow(0 5px 12px #00000080);display:block;position:absolute;top:0;left:0;right:0}.hud-backdrop-defs{position:absolute}.hud{top:0;left:0;right:calc(var(--video-w) + 16px);height:calc(var(--banner-h) + env(safe-area-inset-top,0px));z-index:15;-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border:none;border-radius:0;padding:0 10px 22px 14px;position:absolute}.hud-row{flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:2px;height:100%;display:flex}.hud-group{display:contents}.hud-group-right{text-align:left}.hud-stat{text-align:left;align-items:flex-start;gap:1px}.hud-stat-right{top:calc(var(--hdr-top) + var(--video-h) + 5px);z-index:15;width:var(--video-w);text-align:right;align-items:flex-end;margin-left:0;display:flex;position:fixed;right:8px}.hud-value{white-space:nowrap;font-size:18px;line-height:1}.hud-label{letter-spacing:.03em;white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-size:11px;overflow:hidden}.hud-stat-right .hud-label{letter-spacing:.02em;color:var(--text);font-size:11px}.hud-time,.hud-maxcombo{display:none}.hud-progress{z-index:16;border-radius:0;height:5px;margin:0;position:fixed;bottom:0;left:0;right:0}.touch-controls{display:none}.fullscreen-btn{display:block}.game-view>.video-frame{top:var(--hdr-top);z-index:25;width:var(--video-w);aspect-ratio:16/9;border:1px solid var(--panel-border);max-width:none;box-shadow:var(--glow-strong);border-radius:12px;margin:0;position:fixed;left:auto;right:8px;transform:none}.menu-toggle{z-index:40;top:auto;left:auto;right:14px;bottom:calc(16px + env(safe-area-inset-bottom,0px));border:1px solid var(--panel-border);background:var(--panel);width:52px;height:52px;color:var(--text-h);cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--shadow-card);border-radius:15px;place-items:center;font-size:20px;line-height:1;display:grid;position:fixed}.menu-toggle svg{width:26px;height:26px;display:block}.menu-toggle:active{transform:scale(.95)}.help-toggle{right:14px;bottom:calc(16px + env(safe-area-inset-bottom,0px));border-radius:15px;justify-content:center;width:52px;min-height:52px;padding:0}.help-toggle-game{right:78px}.help-toggle-icon{width:30px;height:30px;font-size:19px}.help-toggle-label{display:none}.recording-indicator{top:max(8px, env(safe-area-inset-top,0px));gap:6px;max-width:calc(100vw - 144px);min-height:34px;padding:6px 9px;font-size:10px;right:72px}.recording-indicator-download{padding:3px 6px;font-size:9px}.menu-scrim{z-index:30;background:var(--overlay-scrim);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .25s;display:block;position:fixed;inset:0}.game-view.menu-open .menu-scrim{opacity:1;pointer-events:auto}.sidebar{z-index:35;height:auto;max-height:84dvh;padding:22px 16px calc(20px + env(safe-area-inset-bottom,0px));border-radius:20px 20px 0 0;transition:transform .28s;position:fixed;bottom:0;left:0;right:0;overflow-y:auto;transform:translateY(102%);box-shadow:0 -12px 40px #00000080}.sidebar:before{content:"";background:var(--text-dim);opacity:.5;border-radius:999px;width:42px;height:4px;position:absolute;top:8px;left:50%;transform:translate(-50%)}.game-view.menu-open .sidebar{transform:translateY(0)}.legend{justify-content:center}.gesture-help{display:block}}@media (width<=520px){.difficulty-grid{grid-template-columns:1fr}}.not-mapped{border:1px solid var(--panel-border);background:var(--accent-soft);text-align:left;border-radius:12px;margin-top:18px;padding:18px}.not-mapped-title{font-family:var(--font-display);color:var(--text-h);margin:0 0 8px;font-size:18px}.not-mapped-body{color:var(--text-dim);margin:0 0 8px;font-size:14px;line-height:1.5}.not-mapped-actions{flex-wrap:wrap;gap:10px;margin-top:12px;display:flex}.not-mapped-note{color:var(--text-dim);font-size:13px}.results-record{font-family:var(--mono);color:var(--accent);letter-spacing:.04em;margin-top:6px;font-size:13px}.results-scores{text-align:left;margin:16px 0 4px}.results-scores-head{font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);margin-bottom:8px;font-size:12px}.results-scores-list{flex-direction:column;gap:4px;max-height:210px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.results-scores-row{background:var(--btn-bg);font-family:var(--mono);border:1px solid #0000;border-radius:8px;grid-template-columns:28px 34px 1fr auto;align-items:center;gap:8px;padding:6px 10px;font-size:13px;display:grid}.results-scores-row.is-current{border-color:var(--accent);box-shadow:var(--glow-hover)}.results-scores-rank{color:var(--text-dim)}.results-scores-grade{color:var(--accent);font-weight:700}.results-scores-val{color:var(--text-h);font-weight:600}.results-scores-acc{color:var(--text-dim)}.results-signin{margin:12px 0}.btn-signin{width:100%}.results-signin-note{color:var(--text-dim);margin:8px 0 0;font-size:12px;line-height:1.4}.results-leaderboard{border-top:1px solid var(--divider);padding-top:12px}.results-leaderboard-row{grid-template-columns:28px minmax(0,1fr) auto auto}.results-leaderboard-user{color:var(--text-h);text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.results-list-note{background:var(--surface-2);color:var(--text-dim);text-align:center;border-radius:8px;margin:0;padding:10px;font-size:12px;line-height:1.4}.results-account-status{color:var(--text-dim);margin:0;font-size:13px;line-height:1.45}.results-account-status strong{color:var(--accent)}.results-sync-error{color:var(--danger);margin:8px 0 0;font-size:12px;line-height:1.4}.auth-overlay{z-index:100;background:var(--overlay-scrim);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);place-items:center;padding:24px;display:grid;position:fixed;inset:0;overflow-y:auto}.auth-dialog{border:1px solid var(--panel-border);background:var(--panel);width:min(430px,100%);box-shadow:var(--shadow-card);border-radius:20px;padding:30px;position:relative}.auth-dialog h2{color:var(--text-h);font-family:var(--font-display);margin:0;font-size:28px}.auth-subtitle{color:var(--text-dim);margin:7px 34px 22px 0;font-size:14px;line-height:1.45}.auth-close{border:1px solid var(--panel-border);background:var(--surface-2);width:34px;height:34px;color:var(--text-h);cursor:pointer;border-radius:50%;font-size:24px;line-height:1;position:absolute;top:14px;right:14px}.auth-tabs{background:var(--surface-2);border-radius:12px;grid-template-columns:1fr 1fr;gap:5px;margin-bottom:20px;padding:4px;display:grid}.auth-tabs button{color:var(--text-dim);font:700 13px/1 var(--font-body);cursor:pointer;background:0 0;border:0;border-radius:9px;padding:9px}.auth-tabs button.active{background:var(--accent-soft);color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.auth-form{flex-direction:column;gap:15px;display:flex}.auth-submit{width:100%;margin-top:3px}.auth-note{color:var(--text-dim);margin:14px 0 0;font-size:12px;line-height:1.45}@media (width<=520px){.landing-card{padding-top:28px}.landing-toolbar{align-items:center;margin-bottom:20px;position:static}.brand{margin-top:0}.account-name{max-width:90px}.auth-overlay{align-items:start;padding:14px}.auth-dialog{margin:auto 0;padding:24px 20px}}
