.scale-page{background:#f5eee1;color:#063051}.scale-shell{width:min(100% - 24px,1040px);margin:20px auto 48px}.scale-shell *{box-sizing:border-box}.scale-head{display:flex;justify-content:space-between;gap:20px;align-items:center;margin:24px 4px}.scale-head h1{font-size:clamp(28px,5vw,40px);margin:0}.scale-head p{margin:4px 0}.scale-kicker{text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:800;color:#6b7c86}.scale-instrument{padding:12px 18px;background:#2d6e60;color:white;border-radius:14px;font-weight:800;text-align:center}.scale-card{border:1px solid #d8cbb8;border-radius:18px;background:#fffaf2;margin:14px 0;padding:22px;box-shadow:0 3px 10px #263d4210}.scale-settings{background:#f0eadf}.scale-settings>summary{display:flex;justify-content:space-between;gap:14px;cursor:pointer;font-weight:800;min-height:32px;align-items:center}.scale-settings>summary:after{content:'⌄'}.scale-settings[open]>summary{margin-bottom:20px}.scale-settings small{font-size:12px;font-weight:500;color:#526b7e}.scale-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.scale-shell label{display:flex;flex-direction:column;gap:7px;font-size:13px;font-weight:700;min-width:0}.scale-shell select,.scale-shell input:not([type=checkbox]){width:100%;min-width:0;border:1px solid #cbbfae;border-radius:9px;background:white;color:#083052;font:inherit;padding:10px;min-height:44px}.scale-shell fieldset{border:0;padding:0;margin:0;min-width:0}.scale-shell button{border:1px solid #b6c8c0;background:#f0f2e9;color:#083052;border-radius:9px;padding:11px 16px;font:inherit;font-weight:750;min-height:44px;cursor:pointer}.scale-shell button:disabled{opacity:.45;cursor:default}.scale-shell .scale-primary{background:#2d6e60;border-color:#2d6e60;color:white}.scale-shell button:focus-visible,.scale-shell input:focus-visible,.scale-shell select:focus-visible,.scale-shell summary:focus-visible{outline:3px solid #c98c25;outline-offset:3px}.scale-shell .scale-check{display:flex;flex-direction:row;align-items:center;gap:8px;margin:10px 0}.scale-check input{width:20px;height:20px;accent-color:#2d6e60}.scale-tip,.scale-plan{font-size:13px;line-height:1.55;color:#4e665f}.scale-more{font-size:12px;line-height:1.6}.scale-more summary{cursor:pointer}.scale-work-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.scale-work-head h2{margin:4px 0 16px;font-size:clamp(22px,4vw,30px)}.scale-practice-options{display:grid;grid-template-columns:2fr 1fr;gap:14px!important;padding:14px!important;background:#f0eadf;border-radius:12px}.scale-practice-options>div{grid-column:1/-1}.scale-score{background:white;border:1px solid #ddd3c3;border-radius:12px;min-width:0;overflow:hidden;min-height:170px}.scale-score svg{display:block;max-width:100%}.scale-score-nav{display:flex;align-items:center;justify-content:center;gap:15px;margin:8px auto;font-size:12px}.scale-score-nav button{padding:4px 12px}.scale-current{display:flex;justify-content:center;align-items:center;gap:18px;min-height:60px}.scale-current strong{font-size:30px;color:#2d6e60}.scale-current>span{font-size:12px}.scale-progress{height:5px;background:#dfded7;border-radius:8px;overflow:hidden}.scale-progress>span{display:block;height:100%;width:0;background:#2d6e60;transition:width .15s}.scale-live{display:flex;flex-direction:column;text-align:center;align-items:center;gap:8px;padding:18px 8px;min-height:120px}.scale-live>strong{font-size:20px}.scale-live>span{font-size:13px;color:#536878}.scale-live[data-state=good]>strong{color:#18715d}.scale-live[data-state=low]>strong{color:#266f9e}.scale-live[data-state=high]>strong{color:#98600e}.lab-pitch-guide{display:flex;align-items:center;gap:12px;width:min(480px,100%);font-size:11px}.lab-pitch-guide>div{flex:1;height:12px;background:#e9e5d9;border-radius:8px;position:relative}.lab-pitch-guide b{position:absolute;left:44%;width:12%;top:0;height:100%;background:#c4dfcf}.lab-pitch-guide i{position:absolute;z-index:1;left:50%;top:-3px;width:4px;height:18px;border-radius:2px;background:#295b59;transform:translateX(-50%)}.scale-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.scale-mic-status{font-size:11px;text-align:center;color:#52685d}.scale-error{padding:12px;background:#fff2d8;border:1px solid #d6a64d;border-radius:10px;font-size:14px}.scale-fingering{border-top:1px solid #ddd3c3;padding-top:16px;margin-top:20px}.scale-fingering h3{text-align:center;font-size:14px}.scale-fingering>div{max-width:680px;margin:auto}.scale-fingering-text{text-align:center}.scale-report{border-top:4px solid #2d6e60}.scale-report h2{margin-top:4px}.scale-report p{line-height:1.6}.scale-report .scale-actions{justify-content:flex-start;margin-top:16px}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.scale-shell [hidden]{display:none!important}
@media(max-width:700px){.scale-shell{width:calc(100% - 16px);margin:10px auto 40px}.scale-head{margin:14px 4px;align-items:flex-start}.scale-head>div>p:last-child{font-size:12px}.scale-instrument{font-size:11px;max-width:140px;padding:10px}.scale-card{padding:14px;border-radius:14px}.scale-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.scale-settings>summary{flex-wrap:wrap}.scale-settings>summary small{flex-basis:100%}.scale-practice-options{padding:10px!important;gap:10px!important}.scale-actions{gap:7px}.scale-actions button{flex:1 1 140px;padding:10px}.scale-current{gap:10px}.scale-live>strong{font-size:18px}.scale-plan{font-size:12px}.scale-work-head{align-items:flex-start}.scale-work-head h2{margin-bottom:10px}.scale-work-head .scale-check{font-size:12px}.scale-score-nav{margin:4px auto}.scale-report .scale-actions button{flex:1 1 140px}}
@media(max-width:360px){.scale-fields,.scale-practice-options{grid-template-columns:1fr}.scale-head{gap:8px}.scale-instrument{max-width:110px}.scale-current strong{font-size:24px}}
@media(prefers-reduced-motion:reduce){.scale-progress>span{transition:none}}

/* Keep the activity compact despite the global module layout rules. */
body.scale-page main.scale-shell { width:min(1040px,calc(100% - 24px)) !important; margin:12px auto 32px !important; padding:0 !important; border:0 !important; background:transparent !important; box-shadow:none !important; }
body.scale-page .scale-head { margin:12px 4px; }
body.scale-page .scale-card { padding:18px; margin:10px 0; }
body.scale-page .scale-settings>summary { position:relative; padding-right:22px; }
body.scale-page .scale-settings>summary:after { position:absolute; right:0; top:5px; }
body.scale-page .scale-work-head h2 { margin:3px 0 10px; }
body.scale-page .scale-work-head .scale-kicker { margin:4px 0; }
body.scale-page .scale-live { min-height:96px; padding:12px 4px; }
@media(max-width:700px){body.scale-page main.scale-shell{width:calc(100% - 16px)!important}body.scale-page .scale-card{padding:12px}body.scale-page .scale-head>div>p:last-child{display:none}body.scale-page .scale-current{min-height:46px}body.scale-page .scale-score-nav{gap:8px}.scale-running #stopBtn{background:#2d6e60;color:white}}

/* Gammes v2: l'exercice reste au premier plan, les réglages sont secondaires. */
body.scale-page main.scale-shell{width:min(920px,calc(100% - 24px))!important}
body.scale-page .scale-head{padding:4px 2px 2px}
body.scale-page .scale-head h1{font-size:clamp(30px,4vw,38px)}
body.scale-page .scale-work{padding:20px 22px 22px}
body.scale-page .scale-practice-options{display:block;padding:0!important;background:transparent;border-radius:0}
.scale-mode-picker{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:8px 0 10px}
.scale-shell .scale-mode-picker button{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-height:70px;padding:13px 16px;text-align:left;background:#fff;border:2px solid #d4d8ce;border-radius:14px}
.scale-mode-picker button span{font-size:16px;font-weight:850}.scale-mode-picker button small{font-size:12px;font-weight:500;color:#52685d;line-height:1.35}
.scale-shell .scale-mode-picker button.is-active{border-color:#2d7764;background:#e8f3ee;box-shadow:0 0 0 1px #2d7764 inset}
.scale-practice-details{margin:0 0 10px;color:#53685f;font-size:12px}
.scale-practice-details>summary,.scale-metronome-more>summary{cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.scale-practice-details>label{max-width:260px;margin:10px 0}
#metroOptions{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:6px 16px;background:#f0eadf;border-radius:14px;padding:8px 10px;margin:6px 0}
.scale-tempo-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.scale-shell .scale-tempo-line button{width:38px;min-height:38px;padding:4px;border-radius:50%;font-size:22px;background:white}
.scale-tempo-line output{min-width:44px;text-align:center;font-size:22px;font-weight:900;color:#2d6e60}
.scale-tempo-line span{font-size:11px;color:#60736b}
.scale-rhythm-main{display:flex;align-items:center;gap:8px;min-width:0;margin:0}
.scale-rhythm-main>strong{font-size:13px;white-space:nowrap}
.scale-rhythm-choices{display:flex;align-items:center;gap:4px;min-width:0;overflow-x:auto;padding:3px 5px;scrollbar-width:thin}
.scale-shell .scale-rhythm-choices button{position:relative;flex:0 0 52px;width:52px;height:44px;min-height:44px;padding:0;border-radius:9px;background:#fff;border:1px solid #cbbfae}
.scale-shell .scale-rhythm-choices button[data-rhythm=eighth]{flex-basis:64px;width:64px}
.scale-shell .scale-rhythm-choices button.is-active{background:#e4f2ec;border:2px solid #2d7764;box-shadow:0 0 0 1px #2d7764 inset}
.scale-rhythm-choices button>span{display:block;width:48px;height:40px;margin:auto;pointer-events:none}
.scale-rhythm-choices button[data-rhythm=eighth]>span{width:58px}
.scale-rhythm-choices button svg{display:block;width:100%;height:100%;overflow:hidden}
.scale-rhythm-choices button small{position:absolute;right:2px;bottom:1px;padding:0 2px;border-radius:3px;background:#fffaf2;color:#315774;font-size:7px;line-height:1.2;pointer-events:none}
.scale-metronome-more{grid-column:1/-1;font-size:12px;color:#53685f}.scale-metronome-more .scale-fields{grid-template-columns:1fr 1fr;margin-top:10px}
.scale-plan{margin:8px 0 10px;padding-left:10px;border-left:3px solid #c98c25}
body.scale-page .scale-score{min-height:150px;border-color:#d7ccba}
body.scale-page .scale-current{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px;min-height:52px}
body.scale-page .scale-current #currentNote{grid-column:2;justify-self:center}
.scale-beat{grid-column:3;justify-self:start;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:78px;height:24px;visibility:hidden}
.scale-beat.is-visible{visibility:visible}
.scale-beat i{display:block;width:11px;height:11px;border-radius:50%;background:#d7d8d1;border:1px solid #aab7b0;transition:transform .1s ease,background .1s ease,box-shadow .1s ease}
.scale-beat.is-count-in i.is-past{background:#efd293;border-color:#d39a32}
.scale-beat i.is-active{background:#2d7764;border-color:#2d7764;box-shadow:0 0 0 5px rgba(45,119,100,.14);transform:scale(1.14)}
.scale-beat.is-count-in i.is-active{background:#d19528;border-color:#b77a14;box-shadow:0 0 0 5px rgba(209,149,40,.17)}
.scale-hold-ring{--hold-progress:0;position:relative;width:82px;height:82px;border-radius:50%;isolation:isolate;margin:10px auto 4px}
.scale-hold-ring>svg{display:block;width:100%;height:100%;overflow:visible}
.scale-hold-ring .ring-fill{fill:#2d7764}
.scale-hold-ring .ring-hole{fill:#fffaf2;r:var(--hole-radius,39);transition:r .12s ease}
.scale-hold-ring .ring-track{fill:none;stroke:#d9e2dd;stroke-width:6}
.scale-hold-ring .ring-check{position:absolute;inset:0;display:grid;place-items:center;color:white;font-size:30px;font-weight:900;line-height:1;opacity:0;transform:scale(.5);transition:opacity .18s ease,transform .35s ease}
.scale-hold-ring.is-complete{animation:hold-ring-validated .55s ease-out}
.scale-hold-ring.is-complete .ring-check{opacity:1;transform:scale(1)}
@keyframes hold-ring-validated{0%{transform:scale(1)}35%{transform:scale(1.15);filter:drop-shadow(0 0 8px rgba(45,119,100,.3))}100%{transform:scale(1)}}
@keyframes hold-ring-check{0%{opacity:0;transform:scale(.5)}100%{opacity:1;transform:scale(1)}}
.scale-fingering-switch{padding:8px 10px;border-radius:10px;background:#eef3ee;white-space:nowrap}
.scale-display-options{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap}
.scale-fingering{display:block;text-align:center;border:1px solid #afd0c3!important;background:#eef7f2;border-radius:14px;padding:10px 14px!important;margin:4px 0 12px!important}
.scale-fingering h3{margin:0;text-align:left!important;font-size:13px;color:#2d6e60}
.scale-fingering>div{display:flex;align-items:center;justify-content:center;width:100%;max-width:none!important;margin:0!important}
.fingering-visual{display:inline-grid;flex:0 0 auto}.fingering-visual.strings{grid-template-columns:repeat(var(--string-count,4),5px);gap:5px;height:32px}
.fingering-string{position:relative;width:var(--string-weight,2px);height:32px;justify-self:center;border-radius:4px;background:#bdc8d0}
.fingering-string.active{background:#1769c2}.fingering-string.active::after{content:attr(data-finger);position:absolute;left:50%;top:50%;translate:-50% -50%;display:grid;place-items:center;width:17px;height:17px;border-radius:50%;color:#fff;background:#ff665e;font-size:11px}
.bowed-string-help{display:inline-flex;align-items:center;justify-content:center;gap:10px}.fingering-visual.strings.bowed-string-fingering{position:relative;height:82px;padding-top:5px}
.bowed-string-fingering::before{content:"";position:absolute;z-index:2;top:3px;left:-3px;right:-3px;height:5px;border-radius:3px;background:#7c654a}.bowed-string-fingering .fingering-string{height:74px;background:linear-gradient(180deg,#e3e8eb,#aebbc4)}
.bowed-string-fingering .fingering-string.active::after{top:var(--finger-y,50%);transition:top .16s ease}.bowed-string-placement-label{white-space:nowrap;color:#315774;font-size:12px;font-weight:800}
.scale-main-actions{display:grid;grid-template-columns:1fr 1fr;margin-top:2px}
.scale-shell .scale-main-actions .scale-listen-primary{background:#e8b14e;border-color:#c58a22;color:#082f50;font-size:16px}
.scale-shell .scale-main-actions .scale-primary{font-size:16px}
.scale-main-actions .scale-note-action{grid-column:1/-1;grid-row:2;border:0;background:transparent;min-height:44px;padding:6px;text-decoration:underline;text-underline-offset:3px}
.scale-main-actions #stopBtn{grid-column:1/-1;grid-row:2;position:relative;z-index:2;background:#2d6e60;color:white}
.scale-error{margin:8px 0 0}.scale-mic-status{margin:8px 0 0}
@media(max-width:700px){body.scale-page .scale-work{padding:13px}.scale-mode-picker{grid-template-columns:1fr}.scale-shell .scale-mode-picker button{min-height:60px}.scale-practice-details{margin-bottom:7px}.scale-metronome-more .scale-fields{grid-template-columns:1fr}.scale-fingering{grid-template-columns:1fr;gap:6px}.scale-fingering h3{text-align:center!important}.bowed-string-help{margin:auto}.scale-main-actions{grid-template-columns:1fr 1fr}.scale-shell .scale-main-actions button{min-height:52px}.scale-main-actions .scale-note-action{min-height:52px!important}.scale-tempo-line span{display:none}.scale-display-options{width:100%;justify-content:flex-end}.scale-hold-ring{width:74px;height:74px;margin-top:8px}}
@media(max-width:540px){#metroOptions{grid-template-columns:1fr}.scale-metronome-more{grid-column:1}.scale-rhythm-choices{flex:1}.scale-rhythm-main>strong{min-width:48px}}
@media(max-width:390px){.scale-main-actions{grid-template-columns:1fr}.scale-main-actions #scaleListenBtn{grid-column:1;grid-row:1}.scale-main-actions #startBtn{grid-column:1;grid-row:2}.scale-main-actions .scale-note-action,.scale-main-actions #stopBtn{grid-column:1;grid-row:3}.scale-work-head{flex-wrap:wrap}.scale-fingering-switch{margin-left:auto!important}}

/* Partition complète sur ordinateur et tablette. */
.scale-score.is-overview{display:grid;gap:0;padding:7px 10px;min-height:0!important}
.scale-score-lane{display:block;min-width:0}
.scale-score-notation{min-width:0;overflow:hidden}
.scale-score-note-hit{fill:transparent;stroke:none;cursor:pointer;pointer-events:all}
.scale-score-note-hit:hover,.scale-score-note-hit:focus{fill:rgba(45,119,100,.09);stroke:#2d7764;stroke-width:1}
.scale-score-note-hit:focus{outline:none}
.scale-note-progress{pointer-events:none;overflow:visible;--note-progress:0}
.scale-note-progress .note-progress-track{fill:none;stroke:#d7e1dc;stroke-width:2.5;opacity:.95}
.scale-note-progress .note-progress-fill{fill:none;stroke:#2d7764;stroke-width:0;opacity:.94;transition:opacity .16s ease}
.scale-note-progress.is-complete .note-progress-fill{fill:#2d7764;opacity:1}
.scale-note-progress.is-complete{animation:scale-note-progress-validated .55s ease-out}
@keyframes scale-note-progress-validated{0%{transform:scale(1)}35%{transform:scale(1.16);filter:drop-shadow(0 0 6px rgba(45,119,100,.32))}100%{transform:scale(1)}}
.scale-running .scale-score-note-hit{pointer-events:none;cursor:default}
@media(max-width:700px){.scale-score-note-hit{display:none}}
@media(prefers-reduced-motion:reduce){.scale-note-progress .note-progress-fill,.scale-note-progress.is-complete{transition:none;animation:none}}
@media(prefers-reduced-motion:reduce){.scale-beat i{transition:none}}
@media(prefers-reduced-motion:reduce){.scale-hold-ring .ring-hole,.scale-hold-ring .ring-check,.scale-hold-ring.is-complete{transition:none;animation:none}}
.scale-core-fields{grid-template-columns:repeat(3,minmax(0,1fr))}.scale-selection-more{margin-top:14px;font-size:12px;color:#53685f}.scale-selection-more>summary{cursor:pointer;text-decoration:underline;text-underline-offset:3px}.scale-selection-more .scale-fields{margin-top:12px}

/* Pupitre de travail : choix compact, partition dominante, actions toujours proches. */
body.scale-page{background:radial-gradient(circle at 18% 5%,rgba(255,255,255,.9),transparent 34%),linear-gradient(145deg,#edf5f7 0,#e4f0f3 48%,#f7f2e9 100%);background-attachment:fixed}
body.scale-page main.scale-shell{width:min(1080px,calc(100% - 28px))!important;margin:14px auto 38px!important}
body.scale-page .scale-head{min-height:82px;margin:0 4px 10px;padding:10px 4px;align-items:center}
body.scale-page .scale-head h1{font-size:clamp(2rem,4vw,2.75rem);line-height:1;margin:3px 0 0}
body.scale-page .scale-head .scale-kicker{margin:0;color:#54706d}
.scale-shell .scale-instrument{border:0;min-height:42px;padding:10px 16px;border-radius:999px;background:#246d60;color:#fff;box-shadow:0 6px 16px rgba(15,65,70,.13);font-size:.9rem}
.scale-shell .scale-instrument:hover{background:#1f6257;transform:translateY(-1px)}
body.scale-page:has(#settings[open]) .scale-instrument{visibility:hidden;pointer-events:none}
body.scale-page .scale-card{border-color:#c8d9d5;background:rgba(255,252,247,.97);box-shadow:0 10px 28px rgba(31,65,75,.07)}
body.scale-page .scale-settings{padding:0 20px 16px;border-top:4px solid #2d7764;background:rgba(255,255,255,.94);overflow:hidden}
body.scale-page .scale-settings>summary{min-height:56px;margin:0!important;padding:0 26px 0 0;font-size:1rem}
body.scale-page .scale-settings>summary small{max-width:62%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#506b76}
body.scale-page .scale-settings[open]>summary small{display:none}
body.scale-page .scale-settings>summary:after{top:18px;font-size:18px;color:#2d7764}
.scale-core-fields{gap:10px!important}
.scale-core-fields>label{gap:5px!important;padding:9px 10px 10px;border:1px solid #d5e4e0;border-radius:12px;background:#f2f8f6;font-size:.82rem!important;color:#345d58}
.scale-shell .scale-core-fields select{min-height:40px;padding:6px 34px 6px 4px;border:0;border-bottom:2px solid #b8cec8;border-radius:0;background-color:transparent;font-size:.98rem;font-weight:800}
.scale-settings-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:34px;margin-top:8px}
.scale-settings-foot .scale-tip{flex:1;margin:0;padding-left:10px;border-left:3px solid #e0a33b;font-size:.78rem;line-height:1.35}
.scale-settings-foot .scale-selection-more{flex:0 0 auto;margin:0;font-size:.78rem}
.scale-selection-more>summary{padding:7px 0;color:#315e58;font-weight:750;text-decoration:none!important}
.scale-selection-more[open]{flex-basis:100%;width:100%}
.scale-selection-more[open] .scale-fields{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:8px}
.scale-selection-more[open] label{font-size:.78rem}
body.scale-page .scale-work{padding:20px 22px 24px;border-top:4px solid #d79a2f}
.scale-work-head{align-items:flex-start;padding-bottom:6px}
.scale-work-head h2{margin:0!important;font-size:clamp(1.55rem,3vw,2.05rem)!important;line-height:1.15}
.scale-work-head #rangeInfo{display:inline-flex;margin:7px 0 0;padding:4px 9px;border-radius:999px;background:#edf4f2;color:#476762;font-size:.72rem;letter-spacing:.055em}
.scale-display-options{gap:8px}
.scale-fingering-switch{min-height:38px;margin:0!important;padding:7px 11px;border:1px solid transparent;border-radius:999px;background:#edf4f2;font-size:.8rem!important}
.scale-fingering-switch:has(input:checked){border-color:#8bb7aa;background:#dff0e9;color:#1f6155}
.scale-fingering-switch input{width:18px;height:18px}
.scale-mode-picker{gap:8px;margin:10px 0 7px;padding:4px;border-radius:15px;background:#edf2ef}
.scale-shell .scale-mode-picker button{position:relative;min-height:58px;padding:10px 13px;border:1px solid transparent;border-radius:11px;background:transparent;box-shadow:none}
.scale-mode-picker button span{font-size:.98rem}.scale-mode-picker button small{font-size:.76rem}
.scale-shell .scale-mode-picker button.is-active{border-color:#9ec7bb;background:#fff;box-shadow:0 5px 12px rgba(33,74,73,.08)}
.scale-practice-details{margin:2px 0 8px;padding-left:3px}
.scale-practice-details>summary{color:#536d68;text-decoration:none;font-size:.75rem}
#metroOptions{margin:5px 0 8px;background:#edf3f0;border:1px solid #d5e2de}
.scale-main-actions{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:8px;margin:10px 0 0}
.scale-main-actions #scaleListenBtn{grid-column:1;grid-row:1}.scale-main-actions #startBtn{grid-column:2;grid-row:1}
.scale-shell .scale-main-actions .scale-listen-primary,.scale-shell .scale-main-actions .scale-primary{min-height:48px;border-radius:12px;font-size:.98rem;box-shadow:0 5px 12px rgba(37,74,72,.09)}
.scale-shell .scale-main-actions .scale-note-action{grid-column:3;grid-row:1;min-width:48px;width:48px;overflow:hidden;padding:0;border:1px solid #cbdad6;border-radius:12px;background:#fff;color:#173f58;font-size:0;text-decoration:none;white-space:nowrap}
.scale-shell .scale-main-actions .scale-note-action::before{content:'♫';font-size:1.15rem}
.scale-main-actions #stopBtn{grid-column:1/-1;grid-row:1;min-height:48px}
.scale-mic-status{min-height:18px;margin:4px 0 0!important;font-size:.68rem;color:#6d7d7a}
.scale-plan{margin:4px 0 8px;padding:7px 10px;border:0;border-radius:8px;background:#f8f3e8;color:#596b67;font-size:.75rem;line-height:1.35}
body.scale-page .scale-score{border:1px solid #bfcfcb;border-radius:14px;background:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 8px 20px rgba(36,67,73,.06)}
.scale-score.is-overview{padding:4px 8px}
body.scale-page .scale-current{min-height:44px}
body.scale-page .scale-live{min-height:84px;padding:9px 4px 4px}
.scale-live>strong{font-size:1.08rem}.scale-live>span{font-size:.75rem}
.scale-fingering{margin:8px 0!important;border-radius:12px}
.scale-report{border-top-color:#2d7764!important}
@media(max-width:700px){
 body.scale-page main.scale-shell{width:calc(100% - 14px)!important;margin-top:8px!important}
 body.scale-page .scale-head{min-height:66px;margin-bottom:6px;padding:6px 3px}
 body.scale-page .scale-head h1{font-size:1.95rem}
 .scale-shell .scale-instrument{max-width:46%;padding:9px 12px;font-size:.76rem}
 body.scale-page .scale-settings{padding:0 12px 12px}
 body.scale-page .scale-settings>summary{min-height:50px}
 .scale-core-fields{grid-template-columns:1.35fr .8fr!important;gap:8px!important}
 .scale-core-fields>label:first-child{grid-column:1/-1}
 .scale-core-fields>label{padding:7px 8px 8px}
 .scale-shell .scale-core-fields select{min-height:37px;font-size:.9rem}
 .scale-settings-foot{align-items:flex-start;flex-wrap:wrap;gap:2px 10px}
 .scale-settings-foot .scale-tip{flex-basis:100%}
 .scale-selection-more[open] .scale-fields{grid-template-columns:1fr 1fr}
 body.scale-page .scale-work{padding:14px 12px 18px}
 .scale-work-head{gap:8px;flex-wrap:wrap}
 .scale-work-head h2{font-size:1.5rem!important}
 .scale-display-options{width:100%;justify-content:flex-start}
 .scale-fingering-switch{font-size:.76rem!important}
 .scale-mode-picker{grid-template-columns:1fr 1fr}
 .scale-shell .scale-mode-picker button{min-height:56px;padding:9px}
 .scale-mode-picker button span{font-size:.85rem}.scale-mode-picker button small{display:none}
 .scale-main-actions{grid-template-columns:1fr 1fr auto}
 .scale-shell .scale-main-actions .scale-note-action{grid-column:3;grid-row:1;min-height:48px!important}
 .scale-score.is-overview{padding:2px 4px}
}
@media(max-width:390px){
 .scale-core-fields{grid-template-columns:1fr!important}.scale-core-fields>label:first-child{grid-column:1}
 .scale-mode-picker{grid-template-columns:1fr 1fr}
 .scale-main-actions{grid-template-columns:1fr 1fr}
 .scale-shell .scale-main-actions .scale-note-action{grid-column:1/-1;grid-row:2;width:auto;min-height:38px!important;color:#315774;font-size:.75rem}
 .scale-shell .scale-main-actions .scale-note-action::before{display:none}
 .scale-main-actions #stopBtn{grid-row:1;grid-column:1/-1}
}