:root{--bg-primary: #000000;--bg-secondary: #16181c;--bg-tertiary: #202327;--bg-hover: rgba(255, 255, 255, .05);--bg-active-glow: rgba(29, 155, 240, .18);--bg-glass: rgba(22, 24, 28, .85);--text-primary: #f7f9f9;--text-secondary: #71767b;--text-muted: #53575b;--accent-primary: #1d9bf0;--accent-primary-hover: #1a8cd8;--accent-secondary: #00ba7c;--accent-warning: #ffd400;--accent-danger: #f4212e;--ruby-color: #1d9bf0;--ruby-known-color: transparent;--pitch-line-color: #00ba7c;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--border-color: #2f3336;--border-subtle: #202327;--border-radius-xs: 4px;--border-radius-sm: 8px;--border-radius-md: 14px;--border-radius-lg: 20px;--border-radius-full: 9999px;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-japanese: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", Meiryo, sans-serif;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .4);--shadow-md: 0 4px 20px rgba(0, 0, 0, .6);--shadow-glow: 0 0 12px rgba(29, 155, 240, .25);--glass-blur: blur(16px);--ease-spring: cubic-bezier(.16, 1, .3, 1);--duration-fast: .15s;--duration-normal: .25s}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;-ms-overflow-style:none;scrollbar-width:none;-webkit-overflow-scrolling:touch}*::-webkit-scrollbar{display:none;width:0;height:0}html,body{width:100%;height:100%;background-color:var(--bg-primary);color:var(--text-primary);font-family:var(--font-sans);overflow-x:hidden;-webkit-user-select:none;user-select:none}body{display:flex;justify-content:center;align-items:flex-start}#root{width:100%;max-width:480px;min-height:100vh;background-color:var(--bg-primary);border-left:1px solid var(--border-color);border-right:1px solid var(--border-color);position:relative;display:flex;flex-direction:column}ruby{ruby-position:over;font-family:var(--font-japanese)}rt{font-size:.65em;color:var(--ruby-color);-webkit-user-select:none;user-select:none;font-weight:600}button{font-family:inherit;-webkit-user-select:none;user-select:none;touch-action:manipulation}button:active{transform:scale(.97);transition:transform .08s var(--ease-spring)}@keyframes modalFadeIn{0%{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.animate-modal{animation:modalFadeIn .22s var(--ease-spring) forwards}