.audio-recovery-banner{background:var(--warning-bg);color:var(--warning-text);border:1px solid var(--warning-border);border-radius:4px;flex-wrap:wrap;align-items:center;gap:.75rem;padding:.5rem .75rem;display:flex}.audio-recovery-banner p{margin:0}.audio-recovery-banner button{min-width:44px;min-height:44px}.audio-recovery-banner button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.built-in-score-selector{flex-wrap:wrap;align-items:center;gap:.5rem;font-size:.85rem;display:flex}.built-in-score-selector select{min-height:44px}.built-in-score-selector select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.built-in-score-selector__note{color:var(--muted);flex:1 0 100%;margin:0}.built-in-score-selector__disabled-reason{color:var(--warning-text);flex:1 0 100%;margin:0}.session-edit-controls{background:var(--surface);border:1px solid var(--border);padding:.6rem 1rem}.session-edit-controls p{margin:.3rem 0 .6rem;font-size:.9rem}.session-edit-controls>div{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.session-edit-controls button{min-height:40px;padding:.5rem .75rem}.session-edit-controls [role=status]{color:var(--muted);font-size:.85rem}.score-viewer{position:relative}.note-edit-gesture{z-index:5;pointer-events:none;border:1px solid var(--border);background:var(--surface);border-radius:.3rem;padding:.25rem .7rem;font-size:.85rem;position:absolute;top:3rem;left:1rem}.note-pitch-preview{z-index:4;pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute}.note-pitch-preview:before{background:var(--text);width:12px;height:8px;box-shadow:0 0 0 2px var(--surface);content:"";border-radius:50%;transform:rotate(-12deg)}.score-viewer{flex-direction:column;flex:1;width:100%;min-height:320px;display:flex}.score-viewer__toolbar{align-items:center;gap:.5rem;padding:.5rem;display:flex}.score-viewer__toolbar button,.score-viewer__status button{border:1px solid var(--border);background:var(--surface);cursor:pointer;border-radius:4px;min-width:44px;min-height:44px}.score-viewer__toolbar button:disabled{cursor:default;opacity:.5}.score-viewer__toolbar button:focus-visible,.score-viewer__status button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.score-viewer__zoom-label{text-align:center;font-variant-numeric:tabular-nums;min-width:3.5rem}.score-viewer__viewport{flex:1;min-height:0;position:relative;overflow:auto}.score-viewer__status{flex-direction:column;align-items:flex-start;gap:.5rem;padding:1rem;display:flex}.score-viewer__status--error{color:var(--error)}.score-viewer__status--error p{margin:0}.score-viewer__stage{animation:.15s ease-out score-viewer-fade-in;position:relative}@keyframes score-viewer-fade-in{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion:reduce){.score-viewer__stage{animation:none}}.score-viewer__container{width:100%}.score-viewer__toolbar{flex-wrap:wrap}.score-viewer__empty-setting{align-items:center;gap:.4rem;min-height:44px;margin-left:.5rem;font-size:.8rem;display:flex}.score-viewer__toolbar [role=alert]{color:var(--error);font-size:.8rem}.piano-visualizer{width:100%;height:auto;display:block}.piano-key{stroke:#1a1a1a;stroke-width:.5px;transition:fill 60ms ease-out}.piano-key--white{fill:#fff}.piano-key--black{fill:#1a1a1a}.piano-key--active.piano-key--white{fill:#6fb3e0}.piano-key--active.piano-key--black{fill:#2f7cb0}.analysis-mode-selector{align-items:center;gap:.5rem;display:flex}.analysis-mode-selector select{min-height:44px}.analysis-mode-selector select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.clips-panel{flex-direction:column;gap:.5rem;display:flex}.clips-panel__create{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.clips-panel__create input[type=text]{min-height:44px}.clips-panel__create label{align-items:center;gap:.25rem;font-size:.85rem;display:flex}.clips-panel__create button{min-width:44px;min-height:44px}.clips-panel__create button:focus-visible,.clips-panel__create input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.clips-panel__list{flex-direction:column;gap:.25rem;margin:0;padding:0;list-style:none;display:flex}.clips-panel__item{align-items:center;gap:.5rem;font-size:.85rem;display:flex}.clips-panel__item--active{font-weight:700}.clips-panel__item button{min-width:44px;min-height:44px}.clips-panel__item button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.clips-panel__item button[aria-pressed=true]{background:var(--accent);color:var(--on-accent)}.clips-panel__range{color:var(--muted)}.clips-panel__empty{color:var(--muted);font-size:.85rem}.clips-panel__error{color:var(--error);margin:0;font-size:.85rem}.focus-mode-controls{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.focus-mode-controls label{align-items:center;gap:.25rem;font-size:.85rem;display:flex}.focus-mode-controls input[type=number]{width:3.5rem;min-height:44px}.focus-mode-controls button{min-width:44px;min-height:44px}.focus-mode-controls button:focus-visible,.focus-mode-controls input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.focus-mode-controls__status{font-size:.85rem}.focus-mode-controls__toggle.is-active{border-color:var(--accent);background:var(--accent);color:var(--on-accent);font-weight:700}.performance-recording-controls{flex-direction:column;gap:.5rem;font-size:.85rem;display:flex}.performance-recording-controls__transport{gap:.5rem;display:flex}.performance-recording-controls__transport button{min-height:44px}.performance-recording-controls__list{flex-direction:column;gap:.5rem;margin:0;padding:0;list-style:none;display:flex}.performance-recording-controls__list li{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.performance-recording-controls__error{color:var(--error);margin:0}.performance-recording-controls__save-error{color:var(--error);flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.performance-recording-controls__save-error p{margin:0}.performance-recording-controls__save-error button{min-height:44px}.practice-stats-panel{font-size:.85rem}.practice-stats-panel dl{flex-wrap:wrap;gap:1rem 1.5rem;margin:0;display:flex}.practice-stats-panel dl>div{flex-direction:column;display:flex}.practice-stats-panel dt{text-transform:uppercase;letter-spacing:.03em;opacity:.7;font-size:.7rem}.practice-stats-panel dd{margin:0;font-weight:600}.practice-stats-panel__error{color:var(--error);margin:0 0 .5rem}.speed-trainer-controls{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.speed-trainer-controls label{align-items:center;gap:.25rem;font-size:.85rem;display:flex}.speed-trainer-controls input[type=number]{width:3.5rem;min-height:44px}.speed-trainer-controls button{min-width:44px;min-height:44px}.speed-trainer-controls button:focus-visible,.speed-trainer-controls input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.speed-trainer-controls__progress{font-size:.85rem}.stem-mixer-panel{flex-direction:column;gap:.5rem;font-size:.85rem;display:flex}.stem-mixer-panel__row{align-items:center;gap:.5rem;display:flex}.stem-mixer-panel__label{min-width:4.5rem}.stem-mixer-panel__toggle{border:2px solid var(--border);background:var(--surface);border-radius:6px;min-width:64px;min-height:44px;font-weight:500}.stem-mixer-panel__toggle:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.stem-mixer-panel__toggle.is-active{color:#fff;background:#c0392b;border-color:#c0392b;font-weight:700}.twelve-key-practice-controls{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.twelve-key-practice-controls label{align-items:center;gap:.25rem;font-size:.85rem;display:flex}.twelve-key-practice-controls input,.twelve-key-practice-controls select{min-height:44px}.twelve-key-practice-controls input[type=number]{width:3.5rem}.twelve-key-practice-controls button{min-width:44px;min-height:44px}.twelve-key-practice-controls button:focus-visible,.twelve-key-practice-controls input:focus-visible,.twelve-key-practice-controls select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.twelve-key-practice-controls__progress{font-size:.85rem}.practice-panel{border-top:1px solid var(--border);background:var(--surface);flex-direction:column;gap:.75rem;max-height:30vh;padding:.75rem 1.25rem;display:flex;overflow-y:auto}.loop-controls{align-items:center;gap:.5rem;display:flex}.loop-controls button{min-width:44px;min-height:44px}.loop-controls button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.loop-controls button[aria-pressed=true]{color:#fff;background:#c0392b}.loop-controls button span{font-size:1.5rem;line-height:1}.metronome-controls{align-items:center;gap:.5rem;display:flex}.metronome-controls button{min-width:44px;min-height:44px}.metronome-controls button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.metronome-controls button[aria-pressed=true]{color:#fff;background:#c0392b}.source-selector{flex-wrap:wrap;align-items:center;gap:.5rem;font-size:.85rem;display:flex}.source-selector select{min-height:44px}.source-selector [data-testid=source-selector-error]{color:var(--error)}.source-selector__note{color:var(--warning-text);flex:1 0 100%;margin:0;font-style:italic}.numeric-control{flex-wrap:wrap;align-items:center;gap:.45rem;display:flex}.numeric-control label{color:var(--muted);font-size:.75rem;font-weight:600}.numeric-control__box{border:1px solid var(--border);background:var(--surface);border-radius:6px;align-items:center;padding-right:.45rem;display:flex}.numeric-control input{width:3.4rem;min-height:42px;color:var(--text);text-align:center;font:inherit;background:0 0;border:0;border-radius:6px}.numeric-control input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.numeric-control input[aria-invalid=true]{outline:2px solid var(--error)}.numeric-control__error{max-width:18rem;color:var(--error);flex:1 0 100%;font-size:.8rem}.speed-control{flex-wrap:wrap;align-items:center;gap:.25rem;display:flex}.speed-control__error{max-width:22rem;color:var(--error);flex:1 0 100%;margin:0 0 .25rem;font-size:.8rem}.transpose-control{align-items:center;gap:.25rem;display:flex}.transport{background:var(--surface);border-top:1px solid var(--border);border-bottom:1px solid var(--border);flex-direction:column;gap:.65rem;padding:.85rem 1.25rem;display:flex}.transport__primary{flex-wrap:wrap;align-items:center;gap:1rem;display:flex}.transport__secondary{border-top:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:.6rem;padding-top:.6rem;display:flex}.transport__group{border:1px solid var(--border);background:var(--background);border-radius:8px;align-items:center;padding:.3rem .55rem;display:flex}.transport__play-pause{background:var(--accent);min-width:60px;min-height:60px;color:var(--on-accent);border:none;border-radius:50%;font-size:.8rem;font-weight:600}.transport__play-pause:disabled{color:#eef3fc;cursor:not-allowed;background:#b7cdf0}.transport__play-pause:focus-visible,.transport__seek:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.transport__seek{flex:1;min-width:8rem;min-height:44px}.transport__time,.transport__duration{font-variant-numeric:tabular-nums;min-width:3ch}.transport__timeline{flex:1;min-width:8rem;position:relative}.transport__timeline .transport__seek{width:100%;margin:0;display:block}.transport__chapters{height:24px;margin:0 8px;position:relative}.transport__chapter{color:var(--accent);cursor:pointer;background:0 0;border:0;min-width:20px;min-height:24px;padding:2px;position:absolute;transform:translate(-50%)}.transport__chapter:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.transport__chapter-preview{z-index:10;background:var(--tooltip);width:max-content;max-width:220px;color:var(--tooltip-text);text-align:left;border-radius:5px;padding:8px 10px;font-size:.8rem;display:none;position:absolute;bottom:28px;box-shadow:0 3px 8px #0003}.transport__chapter:hover .transport__chapter-preview,.transport__chapter:focus .transport__chapter-preview{display:block}.numeric-control input[title]{touch-action:none}.player-shell{flex-direction:column;width:100%;height:100%;min-height:1100px;display:flex}.player-shell__media{flex-direction:column;flex:1;min-height:480px;display:flex}.player-shell__visualizer{border-top:1px solid var(--border);background:var(--surface);flex-shrink:0;padding:.75rem 1.25rem}.player-shell__workspace{display:contents}.player-shell__workspace:has(.youtube-panel[data-open=true]){flex:1;grid-template-columns:minmax(420px,1fr) minmax(350px,420px);align-items:start;min-width:0;min-height:480px;display:grid}.player-shell__workspace:has(.youtube-panel[data-open=true])>.player-shell__media{min-width:0;height:clamp(480px,100vh - 300px,760px)}.youtube-panel[data-open=true]{box-sizing:border-box;max-height:clamp(480px,100vh - 300px,760px);overflow:auto}@media (width<=950px){.player-shell__workspace:has(.youtube-panel[data-open=true]){grid-template-columns:minmax(0,1fr)}}.app{height:100vh;color:var(--text);background:var(--background);flex-direction:column;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;display:flex}.app__header{border-bottom:1px solid var(--border);background:var(--surface);padding:.5rem 1rem}.app__header h1{letter-spacing:.02em;margin:0;font-size:1.1rem;font-weight:600}.app__main{flex:1;min-height:0;overflow-y:auto}.app__crashed{color:var(--error);padding:1rem}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--text:#1a1a1a;--muted:#555;--background:#fafafa;--surface:#fff;--border:#c7cbd2;--accent:#1767cf;--on-accent:#fff;--error:#b00020;--warning-text:#664d03;--warning-bg:#fff3cd;--warning-border:#ffe69c;--tooltip:#20242b;--tooltip-text:#fff}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--text:#edf0f5;--muted:#b8c0ce;--background:#14171d;--surface:#20242d;--border:#535e70;--accent:#83b6ff;--on-accent:#101b2e;--error:#ff9eae;--warning-text:#ffe39c;--warning-bg:#3a301a;--warning-border:#8a7543;--tooltip:#e7edf7;--tooltip-text:#14171d}.app__header{justify-content:space-between;align-items:center;gap:1rem;display:flex}.appearance-control{align-items:center;gap:.6rem;font-size:.8rem;display:flex}.appearance-control select{min-height:36px}.app select,.app input:not([type=range]):not([type=checkbox]){color:var(--text);background-color:var(--surface);border-color:var(--border)}.app button{cursor:pointer}.app button:disabled{cursor:default}.app :is(button,input,select):focus-visible{outline:2px solid var(--accent);outline-offset:3px}.score-viewer__stage{color:#1a1a1a;background:#fff}
