:root{--bg:#0a0a0a;--surface:#141414;--border:#2a2a2a;--text-primary:#f5f5f5;--text-muted:#8a8a8a;--text-hint:#2e2e2e;--green:#22c55e;--yellow:#eab308;--orange:#f97316;--red:#ef4444;--pill-active-bg:#f5f5f5;--pill-active-text:#0a0a0a;--pill-inactive-text:#555;--pill-inactive-border:#2a2a2a;--gauge-track:#1c1c1c;--gauge-tick:#2e2e2e;--gauge-tick-major:#555;--gauge-label:#555;--needle:#e0e0e0;--needle-idle:#2a2a2a;--pivot:#666;--pivot-idle:#222;--font-sans:"DM Sans", sans-serif;--font-mono:"DM Mono", monospace}[data-theme=light]{--bg:#f5f5f0;--surface:#ebebeb;--border:#d8d8d8;--text-primary:#0a0a0a;--text-muted:#666;--text-hint:#c8c8c8;--pill-active-bg:#0a0a0a;--pill-active-text:#f5f5f5;--pill-inactive-text:#888;--pill-inactive-border:#d0d0d0;--gauge-track:#e4e4de;--gauge-tick:#cfcfc8;--gauge-tick-major:#8a8a8a;--gauge-label:#9a9a9a;--needle:#1a1a1a;--needle-idle:#c8c8c8;--pivot:#555;--pivot-idle:#c8c8c8}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{height:100%}body{background:var(--bg);color:var(--text-primary);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100dvh;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);transition:background .4s}#root{flex-direction:column;min-height:100dvh;display:flex}button{cursor:pointer;font-family:var(--font-sans);color:inherit;-webkit-tap-highlight-color:transparent;background:0 0;border:none}ul{list-style:none}@keyframes pivot-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.4)}}@keyframes bloom-expand{0%{opacity:.7;transform:scale(.8)}to{opacity:0;transform:scale(2.4)}}@keyframes note-pop{0%{opacity:0;transform:scale(.92)}60%{transform:scale(1.04)}to{opacity:1;transform:scale(1)}}button,a,input{touch-action:manipulation}button{-webkit-user-select:none;user-select:none}button:focus-visible{outline:2px solid var(--text-muted);outline-offset:2px}.app-shell{min-height:100dvh;padding-top:env(safe-area-inset-top);z-index:1;flex-direction:column;width:100%;max-width:560px;margin:0 auto;display:flex;position:relative}.start-panel{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:16px;padding:24px 32px;display:flex}.tuner-gauge{max-width:min(340px,86vw);margin:0 auto}.note-display{font-size:clamp(72px,24vw,112px)!important}@media (height<=640px){.note-display{font-size:64px!important}.tuner-gauge{max-width:240px}}@media (height<=460px){.note-display{font-size:44px!important}.tuner-gauge{max-width:170px}.start-panel{gap:8px;padding:8px 24px}.start-panel p{display:none}}.bpm-slider{appearance:none;background:0 0;height:32px}.bpm-slider::-webkit-slider-runnable-track{background:var(--border);border-radius:2px;height:4px}.bpm-slider::-moz-range-track{background:var(--border);border-radius:2px;height:4px}.bpm-slider::-webkit-slider-thumb{-webkit-appearance:none;background:var(--text-primary);border:none;border-radius:50%;width:28px;height:28px;margin-top:-12px}.bpm-slider::-moz-range-thumb{background:var(--text-primary);border:none;border-radius:50%;width:28px;height:28px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}