@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@500;700;800&family=Manrope:wght@500;600;700;800&family=Unbounded:wght@600;700;800;900&display=swap";:root{--bg-base: #06080f;--surface: #0e1222;--surface-2: #131829;--surface-3: #181f34;--surface-glass: rgba(14, 18, 34, .75);--border: rgba(255,255,255,.06);--border-subtle: rgba(94, 158, 200, .18);--border-glow: rgba(34, 211, 238, .3);--border-active: rgba(34, 211, 238, .6);--text-primary: #e8edf5;--text-secondary: #7a8ba8;--text-muted: #3e4a60;--cyan: #22d3ee;--cyan-dim: #0e9dc0;--cyan-glow: rgba(34, 211, 238, .12);--cyan-glow-strong: rgba(34, 211, 238, .35);--blue: #3b82f6;--purple: #a855f7;--purple-dim: rgba(168, 85, 247, .15);--amber: #f59e0b;--gold: #fbbf24;--red: #ef4444;--green: #22c55e;--font-brand: "Unbounded", sans-serif;--font-heading: "Manrope", sans-serif;--font-body: "Inter", sans-serif;--font-mono: "JetBrains Mono", monospace;--sidebar-width: 248px;--mobile-nav-height: 64px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-pill: 999px;--shadow-sm: 0 1px 3px rgba(0,0,0,.4);--shadow-md: 0 4px 16px rgba(0,0,0,.55);--shadow-lg: 0 8px 32px rgba(0,0,0,.65);--shadow-glow-cyan: 0 0 24px rgba(34,211,238,.25), 0 0 48px rgba(34,211,238,.1);--shadow-card: 0 1px 0 rgba(255,255,255,.03) inset, 0 4px 24px rgba(0,0,0,.5), 0 0 0 1px var(--border);--ease-expo: cubic-bezier(.22, 1, .36, 1);--t-fast: .16s var(--ease-expo);--t-normal: .24s var(--ease-expo);--t-slow: .36s var(--ease-expo);--bg-gradient-1: radial-gradient(ellipse 60% 40% at 15% 10%, rgba(59,130,246,.1) 0%, transparent 70%);--bg-gradient-2: radial-gradient(ellipse 50% 40% at 85% 20%, rgba(168,85,247,.08) 0%, transparent 65%);--bg-gradient-3: radial-gradient(ellipse 40% 30% at 50% 90%, rgba(34,211,238,.05) 0%, transparent 60%)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html{scroll-behavior:smooth}body{font-family:var(--font-body);background:var(--bg-base);color:var(--text-primary);min-height:100dvh;overflow:hidden;-webkit-font-smoothing:antialiased}body:before{content:"";position:fixed;inset:0;background:var(--bg-gradient-1),var(--bg-gradient-2),var(--bg-gradient-3);pointer-events:none;z-index:0}a{color:inherit;text-decoration:none}button{cursor:pointer;border:none;background:none;font-family:inherit}.living-bg-container{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:0;overflow:hidden}.drift-blob{position:absolute;border-radius:50%;filter:blur(80px);opacity:.18;pointer-events:none;animation:drift 20s ease-in-out infinite alternate}.drift-blob-1{width:500px;height:500px;background:radial-gradient(circle,#38bdf8 0%,transparent 70%);top:-100px;left:20%;animation-duration:25s}.drift-blob-2{width:600px;height:600px;background:radial-gradient(circle,#818cf8 0%,transparent 70%);bottom:-150px;right:15%;animation-duration:30s;animation-delay:-7s}.drift-blob-3{width:400px;height:400px;background:radial-gradient(circle,#c084fc 0%,transparent 70%);top:40%;left:60%;animation-duration:22s;animation-delay:-14s}@keyframes drift{0%{transform:translate(0) scale(1)}50%{transform:translate(40px,-30px) scale(1.08)}to{transform:translate(-30px,40px) scale(.95)}}.stardust-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.app-shell{display:flex;height:100dvh;width:100vw;position:relative;z-index:1}.sidebar{width:var(--sidebar-width);min-width:var(--sidebar-width);height:100dvh;background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;position:relative;z-index:100;flex-shrink:0;overflow:hidden}.sidebar:after{content:"";position:absolute;top:0;left:0;right:0;height:200px;background:radial-gradient(ellipse at 50% 0%,rgba(34,211,238,.06) 0%,transparent 70%);pointer-events:none}.sidebar-brand{display:flex;align-items:center;gap:10px;padding:20px 18px 16px;border-bottom:1px solid var(--border);flex-shrink:0}.sidebar-brand-logo{width:36px;height:36px;flex-shrink:0}.sidebar-brand-text{display:flex;flex-direction:column;gap:1px}.sidebar-brand-name{font-family:var(--font-brand);font-size:13px;font-weight:800;letter-spacing:1.5px;color:var(--text-primary);line-height:1}.sidebar-brand-sub{font-size:10px;color:var(--text-muted);letter-spacing:.5px;font-weight:500}.sidebar-nav{padding:10px;display:flex;flex-direction:column;gap:2px;flex-shrink:0}.nav-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--radius-md);font-size:12px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;color:var(--text-secondary);cursor:pointer;position:relative;transition:color var(--t-fast),background var(--t-fast);border:none;background:none;width:100%;text-align:left}.nav-item .nav-icon{width:20px;height:20px;display:flex;align-items:center;justify-content:center;flex-shrink:0;opacity:.6;transition:opacity var(--t-fast)}.nav-item:hover{color:var(--text-primary);background:#ffffff08}.nav-item:hover .nav-icon{opacity:.9}.nav-item.active{color:var(--cyan);background:var(--cyan-glow)}.nav-item.active .nav-icon{opacity:1;color:var(--cyan)}.nav-item.active:before{content:"";position:absolute;left:-10px;top:50%;transform:translateY(-50%);width:3px;height:20px;border-radius:0 3px 3px 0;background:var(--cyan);box-shadow:0 0 8px var(--cyan)}.nav-item.nav-admin{margin-top:8px;padding-top:12px;border-top:1px solid var(--border);color:var(--purple)}.nav-item.nav-admin .nav-icon{color:var(--purple)}.nav-item.nav-admin:hover{background:#a855f714;color:var(--purple)}.sidebar-bottom{margin-top:auto;border-top:1px solid var(--border);flex-shrink:0}.sidebar-user{display:flex;align-items:center;gap:10px;padding:14px 16px;cursor:pointer;transition:background var(--t-fast)}.sidebar-user:hover{background:#ffffff08}.sidebar-user-avatar{width:34px;height:34px;border-radius:50%;border:1.5px solid var(--border-subtle);flex-shrink:0;object-fit:cover}.sidebar-user-info{flex:1;min-width:0}.sidebar-user-name{font-size:13px;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}.sidebar-user-role{font-size:10px;color:var(--text-muted);letter-spacing:.3px}.sidebar-user-status{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 6px var(--green);flex-shrink:0}.sidebar-user-login-btn{display:flex;align-items:center;gap:8px;padding:10px 16px;font-size:12px;font-weight:600;color:var(--cyan);letter-spacing:.5px;cursor:pointer;transition:background var(--t-fast);width:100%;border:none;background:none}.sidebar-user-login-btn:hover{background:var(--cyan-glow)}.sidebar-audio{padding:12px 16px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:8px}.audio-row{display:flex;align-items:center;gap:8px}.audio-label{font-size:10px;color:var(--text-muted);font-weight:600;letter-spacing:.5px;text-transform:uppercase;flex:1;display:flex;align-items:center;gap:5px}.audio-label svg{opacity:.5}.toggle-switch{position:relative;display:inline-block;width:34px;height:18px;flex-shrink:0}.toggle-switch input{opacity:0;width:0;height:0}.switch-track{position:absolute;inset:0;background:var(--surface-3);border-radius:999px;border:1px solid var(--border);cursor:pointer;transition:background var(--t-fast),border-color var(--t-fast)}.switch-track:after{content:"";position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:var(--text-muted);transition:transform var(--t-fast),background var(--t-fast)}.toggle-switch input:checked+.switch-track{background:#22d3ee33;border-color:var(--cyan-dim)}.toggle-switch input:checked+.switch-track:after{transform:translate(16px);background:var(--cyan)}.range-slider{-webkit-appearance:none;width:100%;height:3px;border-radius:999px;background:var(--surface-3);outline:none;cursor:pointer}.range-slider::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:var(--cyan);cursor:pointer;box-shadow:0 0 6px var(--cyan-dim)}.range-slider::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--cyan);cursor:pointer;border:none}.main-content{flex:1;min-width:0;height:100dvh;overflow:hidden;display:flex;flex-direction:column;position:relative}.page{display:flex;flex-direction:column;height:100%;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--surface-3) transparent}.page::-webkit-scrollbar{width:4px}.page::-webkit-scrollbar-thumb{background:var(--surface-3);border-radius:4px}.page.hidden{display:none}.page-home-inner{display:flex;flex-direction:column;height:100%;align-items:center;justify-content:center;overflow:hidden}.game-frame-wrapper{flex:1;width:100%;display:flex;align-items:stretch;justify-content:center;padding:12px;min-height:0;box-sizing:border-box}.arcade-frame{position:relative;display:flex;align-items:stretch;justify-content:center;background:var(--bg-base);border:1px solid var(--border);border-radius:var(--radius-xl);overflow:hidden;flex:1;max-width:480px;box-shadow:var(--shadow-md),inset 0 0 40px #0000004d}.arcade-frame canvas{display:block;width:100%;height:100%;object-fit:contain}.game-hud{position:absolute;top:12px;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 12px;z-index:10;pointer-events:none}.hud-pill{display:inline-flex;align-items:center;gap:5px;background:#090c17e0;backdrop-filter:blur(8px);border:1px solid var(--border);border-radius:var(--radius-pill);padding:5px 10px;font-family:var(--font-mono);font-size:12px;font-weight:700;color:var(--text-primary)}.hud-pill svg{width:12px;height:12px}.timer-pill{color:var(--cyan);border-color:#22d3ee40}.score-pill{color:#a78bfa}.floor-pill{color:var(--text-secondary)}.hud-bottom{position:absolute;bottom:12px;right:12px;display:flex;gap:8px;z-index:10}.howl-btn{width:44px;height:44px;border-radius:50%;background:#090c17d9;backdrop-filter:blur(8px);border:1px solid rgba(168,85,247,.3);color:var(--purple);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer;transition:background var(--t-fast),border-color var(--t-fast),transform var(--t-fast)}.howl-btn:hover{background:#a855f726;border-color:var(--purple);transform:scale(1.05)}.howl-btn svg{width:16px;height:16px}.howl-cooldown-ring{font-family:var(--font-mono);font-size:8px;font-weight:800;line-height:1}.btn-pause{width:44px;height:44px;border-radius:50%;background:#090c17d9;backdrop-filter:blur(8px);border:1px solid var(--border);color:var(--text-secondary);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background var(--t-fast),color var(--t-fast),transform var(--t-fast)}.btn-pause:hover{background:#ffffff14;color:var(--text-primary);transform:scale(1.05)}.btn-pause svg{width:16px;height:16px}.combo-badge{position:absolute;top:52px;left:50%;transform:translate(-50%) translateY(-8px);background:linear-gradient(135deg,#f59e0b,#ef4444);color:#fff;font-family:var(--font-brand);font-size:11px;font-weight:800;letter-spacing:1px;padding:4px 14px;border-radius:var(--radius-pill);opacity:0;pointer-events:none;transition:opacity var(--t-fast),transform var(--t-fast);z-index:20;white-space:nowrap}.combo-badge.active{opacity:1;transform:translate(-50%) translateY(0)}.danger-vignette{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:5;opacity:0;box-shadow:inset 0 0 60px #ef444473;transition:opacity .3s ease}.danger-vignette.active{opacity:1}.onscreen-controls{position:absolute;bottom:64px;left:0;right:0;display:flex;justify-content:space-between;padding:0 8px;z-index:10}.control-btn{width:72px;height:52px;border-radius:var(--radius-md);background:#090c17cc;backdrop-filter:blur(8px);border:1px solid var(--border);color:var(--text-secondary);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:8px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;cursor:pointer;user-select:none;transition:background var(--t-fast),color var(--t-fast),transform 80ms ease;touch-action:manipulation}.control-btn:active{background:var(--cyan-glow);border-color:var(--cyan-dim);color:var(--cyan);transform:scale(.95)}.control-btn svg{width:20px;height:20px}.btn-subtext{font-size:7px}.btn-jump{width:88px;background:#22d3ee14;border-color:#22d3ee33;color:var(--cyan)}.btn-jump:active{background:#22d3ee38;border-color:var(--cyan)}.game-overlay-screen{position:absolute;inset:0;background:#06080feb;backdrop-filter:blur(12px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px 20px;z-index:50;border-radius:inherit}.game-overlay-screen.hidden{display:none}.overlay-lock-box{width:56px;height:56px;border-radius:var(--radius-lg);background:var(--surface-2);border:1px solid var(--border-subtle);display:flex;align-items:center;justify-content:center;margin-bottom:16px;color:var(--text-secondary)}.overlay-mascot-box{width:64px;height:64px;border-radius:50%;background:#22d3ee14;border:1px solid var(--border-glow);display:flex;align-items:center;justify-content:center;margin-bottom:16px}.overlay-title{font-family:var(--font-brand);font-size:18px;font-weight:900;letter-spacing:2px;color:var(--text-primary);margin-bottom:8px}.overlay-desc{font-size:13px;color:var(--text-secondary);line-height:1.6;max-width:280px;margin-bottom:20px}.overlay-cta-group{width:100%;display:flex;flex-direction:column;gap:8px;max-width:280px}.controls-hint-badge{margin-top:16px;font-size:10px;color:var(--text-muted);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-pill);padding:5px 12px;letter-spacing:.3px}.game-pause-overlay{position:absolute;inset:0;background:#06080fe0;backdrop-filter:blur(16px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;z-index:40;border-radius:inherit}.game-pause-overlay.hidden{display:none}.pause-badge{font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--cyan);border:1px solid var(--border-glow);padding:4px 12px;border-radius:var(--radius-pill);margin-bottom:12px}.pause-title{font-family:var(--font-brand);font-size:24px;font-weight:900;letter-spacing:3px;color:var(--text-primary);margin-bottom:8px}.pause-subtitle{font-size:13px;color:var(--text-secondary);line-height:1.6;max-width:260px;margin-bottom:20px}.page-header{padding:20px 24px 14px;border-bottom:1px solid var(--border);flex-shrink:0}.page-title{font-family:var(--font-brand);font-size:14px;font-weight:800;letter-spacing:2px;color:var(--text-primary);margin-bottom:3px}.page-subtitle{font-size:11px;color:var(--text-muted);letter-spacing:.3px}.tab-row{display:flex;gap:4px;padding:14px 20px 0;flex-shrink:0}.tab-btn{padding:7px 14px;border-radius:var(--radius-pill);font-size:10px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--text-muted);background:none;border:1px solid transparent;cursor:pointer;transition:all var(--t-fast)}.tab-btn:hover{color:var(--text-secondary);background:#ffffff0a}.tab-btn.active{color:var(--cyan);background:var(--cyan-glow);border-color:#22d3ee33}.leaderboard-list{padding:10px 14px;display:flex;flex-direction:column;gap:4px;overflow-y:auto;flex:1}.rank-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--radius-md);background:var(--surface-2);border:1px solid var(--border);transition:background var(--t-fast),border-color var(--t-fast)}.rank-row:hover{background:var(--surface-3);border-color:var(--border-subtle)}.rank-row.current-user{border-color:#22d3ee4d;background:#22d3ee0a}.rank-row.rank-1{border-color:#fbbf2459}.rank-row.rank-2{border-color:#94a3b833}.rank-row.rank-3{border-color:#b4783c33}.rank-number{width:26px;font-family:var(--font-mono);font-size:12px;font-weight:800;text-align:center;flex-shrink:0}.rank-number.gold{color:var(--gold)}.rank-number.silver{color:#9ab0c8}.rank-number.bronze{color:#b47840}.rank-number.normal{color:var(--text-muted)}.rank-avatar{width:28px;height:28px;border-radius:50%;border:1px solid var(--border);flex-shrink:0;object-fit:cover}.rank-player{flex:1;min-width:0}.rank-name{font-size:13px;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rank-sub{font-size:10px;color:var(--text-muted)}.rank-score{font-family:var(--font-mono);font-size:13px;font-weight:700;color:var(--text-primary);text-align:right}.rank-score small{display:block;font-size:10px;color:var(--text-muted);font-weight:500}.leaderboard-empty{text-align:center;padding:40px 20px;color:var(--text-muted);font-size:14px}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:16px 20px}.stat-card{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;display:flex;flex-direction:column;gap:4px;transition:border-color var(--t-fast)}.stat-card:hover{border-color:var(--border-subtle)}.stat-card-label{font-size:10px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--text-muted);display:flex;align-items:center;gap:4px}.stat-card-value{font-family:var(--font-mono);font-size:22px;font-weight:800;color:var(--text-primary);line-height:1.1}.stat-card-sub{font-size:11px;color:var(--text-muted)}.perf-section{padding:0 20px 16px}.perf-title{font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--text-muted);margin-bottom:10px;display:flex;align-items:center;gap:6px}.perf-chart{display:flex;align-items:flex-end;gap:5px;height:70px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:10px}.perf-bar-wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:3px}.perf-bar{width:100%;border-radius:3px 3px 0 0;background:linear-gradient(to top,var(--cyan-dim),var(--cyan));min-height:4px}.perf-bar-label{font-size:7px;color:var(--text-muted);font-weight:600}.recent-section{padding:0 20px 20px}.recent-table{width:100%;border-collapse:collapse;font-size:12px}.recent-table th{text-align:left;font-size:9px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--text-muted);padding:6px 8px;border-bottom:1px solid var(--border)}.recent-table td{padding:8px;color:var(--text-secondary);border-bottom:1px solid var(--border);vertical-align:middle}.recent-table tr:last-child td{border-bottom:none}.recent-table td.score-col{font-family:var(--font-mono);font-weight:700;color:var(--text-primary)}.howtoplay-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:16px 20px}.howto-card{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;display:flex;flex-direction:column;gap:8px;transition:border-color var(--t-fast),background var(--t-fast)}.howto-card:hover{border-color:var(--border-subtle);background:var(--surface-3)}.howto-number{font-family:var(--font-mono);font-size:10px;font-weight:800;color:var(--cyan);letter-spacing:1px}.howto-action{font-size:14px;font-weight:700;color:var(--text-primary);line-height:1.2}.howto-key{display:inline-flex;align-items:center;gap:4px;flex-wrap:wrap}.key-badge{display:inline-block;background:var(--surface-3);border:1px solid var(--border-subtle);border-bottom:2px solid var(--border-subtle);border-radius:5px;padding:2px 8px;font-family:var(--font-mono);font-size:11px;font-weight:700;color:var(--text-primary)}.howto-desc{font-size:11px;color:var(--text-muted);line-height:1.5}.mobile-tip{margin:0 20px 20px;background:#22d3ee0a;border:1px solid rgba(34,211,238,.12);border-radius:var(--radius-lg);padding:14px 16px;font-size:12px;color:var(--text-secondary);line-height:1.6}.mobile-tip strong{color:var(--cyan)}.btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 18px;background:var(--surface-2);border:1px solid var(--border-subtle);border-radius:var(--radius-pill);font-size:12px;font-weight:600;color:var(--text-primary);cursor:pointer;transition:background var(--t-fast),border-color var(--t-fast),transform var(--t-fast)}.btn-secondary:hover{background:var(--surface-3);border-color:#ffffff1f;transform:translateY(-1px)}.btn-secondary:active{transform:translateY(0)}.btn-google-official{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:48px;padding:0 24px;width:100%;background:#fff;border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-pill);font-family:var(--font-body);font-size:14px;font-weight:600;color:#1f2937;cursor:pointer;transition:background var(--t-fast),box-shadow var(--t-fast),transform var(--t-fast);box-shadow:0 2px 8px #0000004d}.btn-google-official:hover{background:#f8fafc;box-shadow:0 4px 16px #0006;transform:translateY(-1px)}.btn-pill{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:var(--radius-pill);padding:0 20px;height:44px;font-size:13px;font-weight:700;cursor:pointer;transition:all var(--t-fast);border:1px solid transparent}.btn-primary{background:linear-gradient(135deg,#0ea5e9,#22d3ee);color:#fff;box-shadow:0 0 20px #22d3ee4d}.btn-primary:hover{box-shadow:0 0 30px #22d3ee80;transform:translateY(-1px);filter:brightness(1.05)}.btn-pill.btn-secondary{background:var(--surface-2);border-color:var(--border-subtle);color:var(--text-secondary)}.btn-pill.btn-secondary:hover{background:var(--surface-3);color:var(--text-primary)}.modal-backdrop{position:fixed;inset:0;background:#000000bf;backdrop-filter:blur(8px);z-index:1000;display:flex;align-items:center;justify-content:center;padding:16px;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-box{background:var(--surface);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);box-shadow:0 32px 80px #000000bf,0 0 0 1px var(--border-glow);width:100%;max-width:460px;max-height:88vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .25s var(--ease-expo)}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid var(--border);flex-shrink:0}.modal-title-wrapper{display:flex;align-items:center}.modal-title{font-family:var(--font-heading);font-size:16px;font-weight:700;color:var(--text-primary);display:flex;align-items:center;gap:8px}.modal-close-btn{width:32px;height:32px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;color:var(--text-muted);cursor:pointer;transition:background var(--t-fast),color var(--t-fast);border:none;background:none}.modal-close-btn:hover{background:#ffffff0f;color:var(--text-primary)}.modal-body{overflow-y:auto;padding:20px;flex:1;scrollbar-width:thin}.game-over-score-hero{text-align:center;padding:12px 0 6px}.game-over-label{font-size:10px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--text-muted);margin-bottom:6px}.game-over-score{font-family:var(--font-mono);font-size:44px;font-weight:800;color:var(--cyan);line-height:1;text-shadow:0 0 30px rgba(34,211,238,.4)}.game-over-record-badge{display:inline-block;margin-top:8px;background:linear-gradient(135deg,#fbbf2433,#f59e0b1a);border:1px solid rgba(251,191,36,.3);border-radius:var(--radius-pill);padding:3px 12px;font-size:11px;font-weight:700;color:var(--gold);letter-spacing:.5px}.game-over-stats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin:14px 0}.go-stat{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);padding:10px;text-align:center}.go-stat-v{font-family:var(--font-mono);font-size:18px;font-weight:800;color:var(--text-primary)}.go-stat-l{font-size:9px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-top:2px}.toast-container{position:fixed;bottom:90px;left:50%;transform:translate(-50%);z-index:9999;display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none}.toast-message{display:inline-flex;align-items:center;gap:8px;background:#0e1222f7;border:1px solid var(--border-subtle);backdrop-filter:blur(16px);border-radius:var(--radius-pill);padding:10px 18px;font-size:13px;font-weight:600;color:var(--text-primary);white-space:nowrap;box-shadow:var(--shadow-lg);animation:toastIn .25s var(--ease-expo)}@keyframes toastIn{0%{opacity:0;transform:translateY(8px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.mobile-bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;height:var(--mobile-nav-height);background:#090c17f7;backdrop-filter:blur(20px);border-top:1px solid var(--border);z-index:200;align-items:stretch}.mobile-nav-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer;color:var(--text-muted);font-size:9px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;transition:color var(--t-fast);border:none;background:none}.mobile-nav-item .mnav-icon{width:22px;height:22px;display:flex;align-items:center;justify-content:center}.mobile-nav-item:hover,.mobile-nav-item.active{color:var(--cyan)}.mobile-nav-play{flex:1.3}.mobile-nav-play .mnav-icon{width:42px;height:42px;background:linear-gradient(135deg,#0ea5e9,#22d3ee);border-radius:50%;box-shadow:0 0 20px #22d3ee66;color:#fff;transition:transform var(--t-fast),box-shadow var(--t-fast)}.mobile-nav-play:hover .mnav-icon{transform:scale(1.08);box-shadow:0 0 28px #22d3ee8c}body.game-active .sidebar,body.game-active .mobile-bottom-nav,body.game-active .hero-section{display:none}body.game-active .main-content{padding:0}body.game-active .page-home-inner{height:100dvh}body.game-active .game-frame-wrapper{padding:0;max-width:none;border-radius:0}body.game-active .arcade-frame{max-width:none;width:100%;border-radius:0;border:none}#bg-canvas-1,#bg-canvas-2,#bg-particles{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}.settings-row{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--border)}.settings-row:last-child{border-bottom:none}.settings-label{font-size:13px;font-weight:600;color:var(--text-primary);display:flex;align-items:center;gap:8px}.settings-sub{font-size:11px;color:var(--text-muted);margin-top:2px}.admin-metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px}.admin-metric-card{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:14px}.admin-metric-label{font-size:10px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--text-muted);margin-bottom:6px}.admin-metric-value{font-family:var(--font-mono);font-size:22px;font-weight:800;color:var(--text-primary)}.google-auth-dialog{display:flex;flex-direction:column;gap:16px}@media (max-width: 1024px){:root{--sidebar-width: 220px}}@media (max-width: 768px){body{overflow:hidden}.app-shell{flex-direction:column}.sidebar{display:none}.main-content{height:calc(100dvh - var(--mobile-nav-height))}.mobile-bottom-nav{display:flex}.game-frame-wrapper{padding:4px 4px 6px}.arcade-frame{border-radius:var(--radius-lg);max-width:none;width:100%;border:1px solid var(--border)}.page-header{padding:14px 16px 10px}.stats-grid,.howtoplay-grid{gap:8px;padding:12px 14px}.leaderboard-list{padding:8px 10px}.tab-row{padding:10px 14px 0}.toast-container{bottom:calc(var(--mobile-nav-height) + 10px)}body.game-active .main-content{height:100dvh}body.game-active .mobile-bottom-nav{display:none}body.game-active .game-frame-wrapper{padding:0}body.game-active .arcade-frame{border-radius:0;border:none}}@media (max-width: 480px){.howtoplay-grid{grid-template-columns:1fr}.rank-avatar{display:none}.game-over-stats{grid-template-columns:1fr 1fr 1fr}.control-btn{width:68px;height:50px}.btn-jump{width:84px}}.hidden{display:none!important}*{scrollbar-width:thin;scrollbar-color:var(--surface-3) transparent}*::-webkit-scrollbar{width:4px}*::-webkit-scrollbar-thumb{background:var(--surface-3);border-radius:4px}:focus-visible{outline:2px solid var(--cyan);outline-offset:2px;border-radius:4px}