:root{--bg:#10151f;--panel:#19222f;--panel2:#202c3b;--text:#eff3f8;--muted:#aab7c8;--mint:#8aebd0;--violet:#ada3ff;--line:#314052;color-scheme:dark;font-family:system-ui,-apple-system,"Segoe UI",sans-serif}
html,body{margin:0;padding:0;min-height:0;height:auto;background:var(--bg);font:16px/1.55 system-ui,-apple-system,"Segoe UI",sans-serif;overflow-x:hidden;color:var(--text)}
#practiceApp{margin:0;padding:0;width:100%;max-width:none}
.record-actions{display:flex;flex-direction:column;align-items:flex-end;font-size:12px;color:#90a9b8}.record-actions .textbtn{font-size:10px;color:#92bcb4;padding:5px 0;min-height:32px}.record-actions [hidden]{display:none}
*{box-sizing:border-box}button,input,textarea{font:inherit}button{touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--violet);outline-offset:4px}button:disabled{opacity:.45;cursor:default}.btn{border-radius:11px;min-height:44px;font-size:14px;font-weight:650;border:1px solid var(--line);background:var(--panel2);color:var(--text);padding:10px 13px;display:inline-flex;align-items:center;justify-content:center;gap:8px;line-height:1.35;cursor:pointer}.btn.primary{background:var(--mint);color:#102b2b;border-color:var(--mint)}.btn.soft{background:#25444a;border-color:#4d7b7a}.textbtn{border:0;background:none;color:var(--mint);min-height:42px;padding:8px;font-size:13px;cursor:pointer}.eyebrow{font-size:10px;letter-spacing:1.5px;font-weight:700;color:var(--mint);margin:0 0 13px}.studio-head{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line);padding:20px 24px;background:#131e29}.studio-brand{display:flex;align-items:center;gap:10px;font-size:22px;font-weight:750;text-decoration:none;color:var(--text);letter-spacing:-.8px}.studio-brand img{border-radius:8px}.studio-brand>span>span{color:var(--mint)}.studio-label{color:#9ab8ba;font-size:12px;letter-spacing:.2px}.studio-layout{display:grid;grid-template-columns:235px minmax(0,1fr);min-width:0}.exercise-library{min-height:0;padding:26px 18px;border-right:1px solid var(--line);background:#131c28;min-width:0}.exercise-choice{display:block;width:100%;text-align:left;background:transparent;border:1px solid transparent;border-radius:12px;color:var(--text);padding:16px 13px;margin:0 0 9px;cursor:pointer;transition:background .2s,border-color .2s}.exercise-choice:hover{background:#1d2b3a}.exercise-choice[aria-pressed=true]{background:#203d40;border-color:#649d94}.exercise-choice>small{display:block;color:#8ab9b4;font-size:10px;text-transform:uppercase;letter-spacing:1px;margin-bottom:7px}.exercise-choice>strong{display:block;font-size:16px;line-height:1.4;font-weight:650}.exercise-choice>span{display:block;color:#a8b9c8;font-size:12px;margin-top:8px}.library-note{font-size:12px;color:#9eafc0;margin:24px 10px;line-height:1.75}.session-route{display:flex;flex-direction:column;gap:13px;border-top:1px solid var(--line);padding:22px 10px;font-size:12px;color:#b2c5c7}.practice-workspace{padding:24px;min-width:0}.exercise-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:20px}.exercise-category{font-size:10px;text-transform:uppercase;letter-spacing:1.3px;color:var(--mint);font-weight:700}.exercise-heading h1{font-size:clamp(23px,3.2vw,32px);line-height:1.2;letter-spacing:-.8px;margin:7px 0 0;font-weight:700}.exercise-meter{font-size:12px;color:#c4baff;border:1px solid #ada3ff40;border-radius:8px;padding:8px 10px;white-space:nowrap}#dialog.preview-player.practice-compact{position:static;display:block;inset:auto;transform:none;width:100%;max-width:none;height:auto;max-height:none;margin:0;padding:0;border:1px solid #4b6d72;border-radius:15px;background:#131e2b;overflow:hidden;box-shadow:none;color:var(--text)}#dialog.preview-player #compact1511Transport{display:flex;align-items:stretch;flex-wrap:wrap;gap:14px;padding:17px 18px;background:#172f38;min-width:0;border-bottom:1px solid #4b6d72}#dialog.preview-player #compact1511Transport button{font-size:13px;min-width:44px;min-height:44px;margin:0;display:inline-flex;gap:6px;border-radius:10px;padding:9px 11px;line-height:1.3}#compact1511Transport svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;display:block}#compact1511Transport button>span:has(svg){flex-shrink:0}.clock-unit{display:flex;align-items:center;justify-content:space-between;gap:13px;flex:1 1 190px;min-width:0}.clock-unit>div{display:flex;flex-direction:column;gap:3px}.clock-unit>div>span{font-size:10px;color:#a2bdc1}#practiceClock{font-size:29px;line-height:1.2;letter-spacing:-1px;font-variant-numeric:tabular-nums;font-weight:700;color:#baf5df}.bpm-unit{display:flex;flex-direction:column;gap:3px;justify-content:center;flex:0 1 153px}.bpm-caption{font-size:10px;color:#a2bdc1}.bpm-unit>div{display:flex;align-items:center;gap:5px}#practiceBpm{width:62px;min-width:0;min-height:44px;text-align:center;font-size:22px;font-weight:700;border:1px solid #48646b;background:#101f2b;border-radius:8px;color:var(--text);padding:3px;appearance:textfield}#practiceBpm::-webkit-inner-spin-button{appearance:none}#dialog.preview-player #compact1511Transport .bpm-unit button{padding:5px;min-width:36px;font-size:12px}.player-actions{display:flex;gap:7px;align-items:flex-end;flex:1 1 290px;justify-content:flex-end}#metronomeToggle[aria-pressed=true]{border-color:var(--mint);color:var(--mint)}#exampleToggle[aria-pressed=true]{background:var(--mint);color:#102b2b;border-color:var(--mint)}.player-utility{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 17px}.player-utility>div{display:flex;gap:5px;align-items:center}.player-utility p{margin:0;font-size:12px;color:#a8bdcc}.player-utility p[data-active=true]{color:var(--mint)}#loopToggle[aria-pressed=true]{color:var(--mint);background:#8aebd012;border-radius:8px}#loopToggle[aria-pressed=false]{color:#8b9aaa}.score-help{font-size:12px;line-height:1.7;color:#b0bfcd;margin:0;padding:0 18px 15px}.practice-scores{padding:0 17px 18px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scrollbar-color:#527478 #172333;scrollbar-width:thin;min-width:0}.score-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;min-width:0}.studio-score-bar{min-width:0;border:1px solid #354858;background:#101925;border-radius:11px;overflow:hidden}.studio-score-title{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:9px 12px;border-bottom:1px solid #2b3d4c;min-width:0}.studio-score-title strong{font-size:11px;color:#d7e5ec}.studio-score-title span{font-size:10px;color:#a3b6c5}.studio-score-scroll{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin}.studio-score-svg{display:block;max-width:none;touch-action:pan-x pan-y}.studio-score-svg .note-target{cursor:pointer;outline:none}.studio-score-svg .note-target:focus .note-bg{stroke:var(--violet);stroke-width:2}.studio-score-svg .note-target.is-current .note-bg,.studio-score-svg .note-target.is-selected .note-bg{fill:#28554e;stroke:#8aebd0;stroke-width:1.5}.studio-score-svg .note-target.is-current .fret-text{fill:#baffdc}.studio-score-svg .note-hit{fill:transparent;pointer-events:all}.studio-score-svg text{user-select:none}.notation-key{display:flex;flex-wrap:wrap;gap:8px 18px;padding:12px 18px;border-top:1px solid #314052;font-size:10px;line-height:1.7;color:#a2b6c4}.practice-advice{padding:18px;background:#192b35;border-top:1px solid #314c57}.practice-advice>strong{font-size:13px;color:#c6f5e3}.practice-advice p{font-size:13px;line-height:1.8;color:#beced8;margin:8px 0 0}#audioError{padding:15px;background:#472e36;color:#ffccd0;font-size:14px;border-radius:10px}.practice-records{margin-top:27px;padding-top:23px;border-top:1px solid var(--line)}.records-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:15px}.records-heading .eyebrow{margin-bottom:7px}.records-heading h2{font-size:22px;line-height:1.25;letter-spacing:-.5px;margin:0}.records-heading>span{font-size:12px;color:#90a9b8}.history-empty{border:1px dashed #3d5668;border-radius:12px;color:#9eb0be;padding:24px;font-size:14px;line-height:1.8}.history-entry{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px 18px;padding:16px 0;border-bottom:1px solid #2c4050}.history-entry strong{font-size:14px;font-weight:650;line-height:1.5}.history-entry time{font-size:11px;color:#9ab0bf}.history-entry>div{display:flex;flex-wrap:wrap;gap:9px;font-size:12px;color:#baf0df}.history-entry>p{grid-column:1/-1;font-size:13px;color:#acbdcb;margin:0;overflow-wrap:anywhere}.record-storage{font-size:11px;color:#92a6b5;line-height:1.8;margin:15px 0 0}.studio-foot{display:flex;align-items:center;justify-content:space-between;gap:22px;border-top:1px solid var(--line);padding:21px 24px;background:#13272b}.studio-foot p{font-size:13px;line-height:1.7;max-width:520px;color:#bed5d8;margin:0}.studio-foot a{font-size:13px;flex-shrink:0;text-decoration:none}.session-summary{width:min(520px,calc(100% - 28px));max-width:none;max-height:calc(100% - 32px);top:0;margin:16px auto;padding:28px;border:1px solid #58776e;border-radius:17px;background:#142632;color:var(--text);box-shadow:0 20px 100px #0008;position:fixed;overflow:auto}.session-summary::backdrop{background:#031018c9}.session-summary h2{font-size:29px;letter-spacing:-.8px;line-height:1.2;margin:8px 0 10px}.session-summary p{font-size:14px;color:#b8cbd7;margin:0 0 20px}.summary-close{position:absolute;right:12px;top:10px;width:38px;height:38px;border:0;background:transparent;color:#dceee6;font-size:25px;cursor:pointer}.summary-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0 23px}.summary-stats>div{padding:15px;border:1px solid #345056;border-radius:10px;display:flex;flex-direction:column;gap:6px}.summary-stats span{font-size:11px;color:#9fb7c4}.summary-stats strong{font-size:25px;color:var(--mint);font-variant-numeric:tabular-nums}.session-summary label{display:block;font-size:13px;font-weight:600;margin:17px 0 7px}.session-summary input,.session-summary textarea{width:100%;border:1px solid #4c6775;border-radius:9px;background:#0d1e2a;color:var(--text);padding:12px;min-height:46px;font-size:15px}.session-summary textarea{resize:vertical}.save-session{width:100%;margin-top:20px}.discard-session{display:block;margin:8px auto 0;color:#adbec8}
@media(min-width:1100px){.score-grid:has(.studio-score-bar:nth-child(3)){grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.studio-layout{grid-template-columns:minmax(0,1fr)}.exercise-library{border-right:0;border-bottom:1px solid var(--line);padding:20px}.exercise-library>.eyebrow{margin-bottom:12px}#exerciseChoices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.exercise-choice{padding:13px 11px;margin:0;height:100%}.exercise-choice>strong{font-size:14px}.exercise-choice>small{font-size:9px}.exercise-choice>span{font-size:11px}.library-note{margin:14px 0 0}.session-route{display:none}.practice-workspace{padding:22px 20px}.player-actions{flex:1 1 250px}.studio-foot{align-items:flex-start}.studio-foot p{max-width:340px}.score-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:600px){.studio-head{padding:15px 16px}.studio-brand{font-size:20px}.studio-label{font-size:11px;max-width:100px;text-align:right}.exercise-library{min-height:0;padding:18px 14px}#exerciseChoices{display:flex;overflow-x:auto;gap:9px;padding-bottom:8px;scroll-snap-type:x mandatory}.exercise-choice{flex:0 0 200px;scroll-snap-align:start;min-height:113px}.practice-workspace{padding:20px 12px}.exercise-heading{align-items:flex-start;flex-direction:column;gap:12px}.exercise-heading h1{font-size:25px}.exercise-meter{font-size:11px;padding:6px 9px}#dialog.preview-player #compact1511Transport{gap:14px 10px;padding:14px 12px}.clock-unit{flex:1 1 140px;gap:8px}.clock-unit .btn>span:last-child{font-size:11px}#practiceClock{font-size:25px}.bpm-unit{flex:0 0 138px}#practiceBpm{width:52px;font-size:20px}.player-actions{flex:1 1 100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.player-actions .btn{font-size:12px}#dialog.preview-player #compact1511Transport button{font-size:12px;padding:9px 8px}.player-actions .btn svg{width:18px}.player-utility{padding:10px 12px;flex-wrap:wrap}.player-utility p{flex:1 1 150px;font-size:11px}.player-utility .textbtn{font-size:12px}.score-help{padding:0 12px 13px;font-size:12px}.practice-scores{padding:0 10px 14px}.notation-key{padding:11px 12px;font-size:10px;gap:6px 12px}.practice-advice{padding:15px 13px}.practice-advice p{font-size:13px}.practice-records{margin-top:23px}.records-heading h2{font-size:21px}.history-empty{padding:20px 17px;font-size:13px}.history-entry{grid-template-columns:minmax(0,1fr)}.history-entry time{grid-row:2}.history-entry>p{grid-column:auto}.studio-foot{padding:20px 17px;flex-direction:column;gap:15px}.studio-foot a{width:100%;text-align:center;white-space:normal}.session-summary{padding:24px 20px}.session-summary h2{font-size:26px}}
@media(max-width:350px){.clock-unit{flex-basis:100%;justify-content:flex-start;gap:20px}.bpm-unit{flex-basis:100%}.bpm-unit>div{justify-content:space-between}.bpm-unit #practiceBpm{flex:1}.player-actions .btn>span:last-child{font-size:11px}.player-actions .btn{gap:4px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.score-part-label{font-size:10px;color:#99b9be;padding:9px 12px 0;border-top:1px solid #263c49}.score-part-label:first-of-type{border-top:0}
.practice-scores .score-head{margin:4px 0 12px}.practice-scores .score-bars147{display:flex;flex-wrap:wrap;align-items:flex-start;gap:14px;width:100%;max-width:100%}.practice-scores .score-bar{flex:0 0 auto;max-width:100%;margin:0}.practice-scores .tab-staff{max-width:none;touch-action:pan-x pan-y}.practice-scores [data-demo-note][role=button]{cursor:pointer}.practice-scores [data-demo-note]:focus-visible{outline:2px solid var(--violet);outline-offset:2px}.practice-scores [data-demo-note][role=img]{cursor:default}.practice-scores .sounding .rest-mark150{fill:var(--mint);stroke:var(--mint)}#exampleToggle[aria-busy=true]{opacity:.8}
.notation-key .rest-legend{display:inline-flex;align-items:center;gap:5px}.notation-key .rest-legend[hidden]{display:none}.rest-legend svg{flex:none;display:block}

/* Both live stores are available from the standalone practice page. */
.studio-foot{flex-wrap:wrap}.studio-stores{display:flex;align-items:stretch;flex-wrap:wrap;gap:10px}.studio-stores .studio-download{min-height:48px}
@media(max-width:700px){.studio-stores{width:100%;flex-direction:column}.studio-stores .studio-download{width:100%;white-space:normal}}
