:root{--app-font: "Nunito", system-ui, Avenir, Helvetica, Arial, sans-serif;font-family:var(--app-font);line-height:1.5;font-weight:400;color-scheme:dark;--bg-primary: #1a1a2e;--bg-secondary: #2a2a3e;--bg-tertiary: #16213e;--bg-pure: #0f0f0f;--bg-gradient-start: #1a1a2e;--bg-gradient-end: #0a0a15;--bg-panel: #2a2a3e;--bg-panel-hover: #3a3a4e;--bg-modal: #1e293b;--bg-form: #1f2937;--text-primary: #ffffff;--text-secondary: #e2e8f0;--text-muted: #94a3b8;--text-dim: #666666;--accent-primary: #6366f1;--accent-primary-hover: #818cf8;--accent-primary-dark: #4f46e5;--border-primary: #444444;--border-secondary: #333333;--border-subtle: rgba(255, 255, 255, .1);--border-accent: rgba(99, 102, 241, .3);--status-success: #10b981;--status-error: #ef4444;--status-warning: #f59e0b;--status-info: #3b82f6;--approach-circle: #60a5fa;--hold-note-active: #ff4444;--hit-perfect: #00ff00;--hit-great: #ffff00;--hit-good: #ff8800;--hit-bad: #ff0000;--diff-easy: #4ade80;--diff-normal: #3b82f6;--diff-hard: #f59e0b;--diff-insane: #ef4444;--diff-expert: #8b5cf6;--rank-gold: #ffd700;--rank-silver: #c0c0c0;--rank-bronze: #cd7f32;--shadow-light: rgba(0, 0, 0, .2);--shadow-medium: rgba(0, 0, 0, .5);--overlay-light: rgba(0, 0, 0, .5);--overlay-dark: rgba(0, 0, 0, .8);--glow-accent: rgba(99, 102, 241, .3);color:var(--text-primary);background:linear-gradient(135deg,var(--bg-gradient-start),var(--bg-gradient-end));font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}a{font-weight:500;color:var(--accent-primary);text-decoration:inherit}a:hover{color:var(--accent-primary-hover)}html{height:100%}body{margin:0;display:flex;justify-content:center;align-items:center;min-width:320px;min-height:100vh;background:linear-gradient(135deg,var(--bg-gradient-start),var(--bg-gradient-end));height:100%;width:100%;font-family:var(--app-font)}#root{width:100%;height:100%;position:relative}h1{font-size:3.2em;line-height:1.1;margin:0}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:var(--accent-primary-dark);color:var(--text-primary);cursor:pointer;transition:all .25s;box-shadow:0 4px 12px var(--shadow-light)}button:hover{background-color:var(--accent-primary);transform:translateY(-2px)}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}*{box-sizing:border-box}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--border-primary);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--border-secondary)}.hide-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.hide-scrollbar::-webkit-scrollbar{display:none}.beatmap-selection-container{overflow:hidden;height:100vh;width:100vw}::selection{background-color:var(--accent-primary);color:var(--text-primary)}:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}canvas{will-change:transform;transform:translateZ(0);backface-visibility:hidden;image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}body:fullscreen,body:-webkit-full-screen,body:-moz-full-screen,body:-ms-fullscreen{overflow:hidden}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}