/* Compact training layouts. Stable slots remain present before/after reveal. */
.back{text-decoration:underline;text-underline-offset:5px;font-weight:650;min-height:38px}
.training-heading{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-bottom:16px}.training-heading h1{margin:0;font-size:28px}
.combo-toggle{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}.combo-toggle span{font-weight:800;background:linear-gradient(100deg,#bf343e,#ae6111,#718407,#138856,#1785ac,#7851bc);background-clip:text;-webkit-background-clip:text;color:transparent}
.combo-settings,.combo-settings label{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.combo-settings{gap:14px}.combo-settings input[type=range]{width:95px}.combo-settings input[type=number]{width:67px;padding:5px}
.training-settings{border:1px solid var(--line,#d4d3cc);border-radius:12px;padding:10px 16px;margin-bottom:14px;background:#f9f8f5}.settings-primary{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.settings-primary>label{display:flex;gap:7px;align-items:center;margin:0}.settings-primary select{width:auto;min-width:95px;padding:6px}.training-settings .mode-presets{display:flex;gap:4px;margin:0}.training-settings .mode-presets button{padding:7px 14px;font-size:13px}.training-settings summary{padding:7px 0;font-size:12px}.training-settings details{margin:0;border:0}.settings-expanded{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:start;padding-top:10px}.settings-expanded>.keyboard-degree-option{grid-column:1/-1}.settings-expanded .field{margin:0}.settings-expanded .range-details{grid-column:1/-1}.settings-expanded .audio-settings{padding:0}.settings-expanded .audio-settings>label{font-size:12px}.settings-expanded .field p{font-size:11px}.settings-expanded input[type=number]{padding:7px;width:100%}#practice-categories{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.training-settings .category{margin:0;padding:10px}.training-settings .choice-list{gap:6px 12px}.extension-options{margin:10px 0!important}.training-stage{border:1px solid #d1d0c9;border-radius:15px;background:#fffefa;padding:14px 20px}.stage-top{display:flex;justify-content:space-between;align-items:center;min-height:28px;font-size:12px;color:#777}.practice-question-line{display:flex;align-items:baseline;justify-content:center;gap:.22em;min-height:78px;font-size:clamp(25px,4vw,48px);line-height:1.3;white-space:nowrap;overflow-x:auto;padding:8px 0}.practice-question-line #practice-symbol,.practice-question-line #practice-key-context,.practice-question-line #practice-fixed{font:inherit;letter-spacing:inherit;color:inherit;margin:0;line-height:inherit}.practice-question-line #practice-fixed{margin-left:.55em}.practice-question-line #practice-fixed::before{content:'('}.practice-question-line #practice-fixed::after{content:')'}.stage-toolbar{display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap}.training-stage .audio-bar{margin:0;gap:6px}.training-stage .audio-icon{width:34px;height:34px}.training-stage .practice-actions{display:flex;gap:8px;margin:0}.training-stage .practice-actions button{padding:9px 18px;font-size:13px}.training-stage .audio-status,.training-stage .status{margin:0;min-height:0}.training-stage .audio-status:not(:empty),.training-stage .status:not(:empty){margin:5px 0}.training-stage .answer-panel{margin:8px 0 0;padding:0;border:0;box-shadow:none;background:transparent}.training-stage .keyboard{height:180px;margin:0}.keyboard-bottom{display:flex;align-items:center;gap:12px;min-height:51px}.clear-keys{display:inline-flex;align-items:center;gap:5px;min-width:80px;min-height:40px;border:1px solid #aaa;border-radius:7px;background:#faf9f6;padding:7px 10px;font-size:12px;flex-shrink:0}.clear-keys svg{width:22px;height:22px}.clear-keys:disabled{opacity:.38;cursor:default}.keyboard-bottom>p{flex:1;margin:0;min-height:20px}.midi-controls{display:flex;align-items:center;gap:6px}.midi-controls select{max-width:180px;width:auto;font-size:12px;padding:6px}.training-stage #practice-midi-status{margin:0;min-height:0}.training-stage .practice-timer{margin:6px 0}.training-stage .countdown{min-height:35px;margin:5px 0;font-size:24px;font-variant-numeric:tabular-nums}.training-stage .answer-heading{margin:0;min-height:25px}.training-stage .answer-heading h2{font-size:13px}.training-stage .answer-notes{min-height:33px;margin:5px 0;display:flex;gap:10px;align-items:center;flex-wrap:wrap}.training-stage #answer-bass,.training-stage #answer-description{min-height:18px;margin:2px 0;font-size:11px}.training-stage .avoid-legend{min-height:17px;margin:0;font-size:10px}.training-stage [hidden],.training-heading [hidden]{display:none!important}.training-stage .practice-report{margin-top:20px}.combo-questions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:1fr;gap:6px;height:112px;margin:4px 0 8px;overflow:auto}.combo-questions button{font-size:clamp(12px,1.8vw,22px);padding:6px 5px;background:#f3f2ec;border:1px solid #d4d2ca;border-radius:7px;min-width:0;overflow-wrap:anywhere;line-height:1.12;position:relative}.combo-questions button.current{border:2px solid #262723;background:#fff6cf;box-shadow:0 0 0 2px #e8debb}.combo-questions button.solved{background:#daefe0;border-color:#5a9d6a;color:#245d33}.combo-questions button.skipped:not(.current){border-style:dashed}.combo-questions small{font-size:10px;display:block;opacity:.7;margin-top:3px}.combo-questions[data-many=true] button{font-size:13px}.combo-questions[data-many=true]{gap:4px}.combo-active .practice-question-line{min-height:50px;font-size:clamp(21px,3vw,31px);padding:1px 0}.combo-active .keyboard{height:165px}.music-accidental{display:inline-block;width:.43em;height:.76em;vertical-align:.13em;position:relative;margin:0 .025em;line-height:0}.music-accidental svg{width:100%;height:100%;overflow:visible}.music-glyph-accessible{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.training-stage .key-label .music-accidental{width:.43em!important;height:.76em!important}
.scale-settings .settings-primary{gap:16px}.scale-question{font-size:clamp(25px,3vw,40px);text-align:center;min-height:65px;display:flex;justify-content:center;align-items:center;gap:10px}.scale-sequence{min-height:32px;display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin:5px 0}.scale-sequence span{min-width:25px;text-align:center;border-radius:4px;padding:4px 6px;background:#ecebe5;font-size:12px}.scale-sequence .wrong{background:#f8dcdc;color:#9e2b2b}.scale-sequence .correct{background:#dfefdf}.scale-guitar-controls{display:flex;gap:16px;align-items:center;flex-wrap:wrap;min-height:40px;font-size:12px}.scale-guitar-controls input[type=range]{width:130px}.scale-timer-progress{height:10px;border-radius:20px;background:#deded5;overflow:hidden}.scale-timer-fill{height:100%;background:linear-gradient(90deg,#e58a64,#859e80,#77a3b9);transform-origin:left;transition:transform .12s linear}.scale-answer{min-height:52px}.scale-report{margin-top:16px;padding:16px;border:1px solid #ddd9cf;border-radius:12px}.scale-report .report-actions{flex-wrap:wrap}.scale-report img{max-width:360px;width:100%;display:block}.training-stage .keyboard .key-label[hidden]{display:none!important}
@media(min-width:1000px){.combo-settings{flex:1}.combo-time-hint{flex-basis:100%;font-size:10px;margin:0}.training-tool .tool-heading{margin-top:10px}.training-stage{padding-top:9px}}
@media(max-width:760px){.settings-expanded{grid-template-columns:repeat(2,minmax(0,1fr))}#practice-categories{grid-template-columns:repeat(2,minmax(0,1fr))}.training-stage{padding:10px}.settings-primary{gap:10px}.training-stage .keyboard{height:155px}.practice-question-line{font-size:26px;min-height:59px}.training-stage .practice-actions button{padding:8px 11px}.combo-settings{flex-basis:100%;gap:8px}.keyboard-bottom{gap:6px;flex-wrap:wrap}.keyboard-bottom>p{font-size:11px}.combo-questions{height:124px}.midi-controls{margin-left:auto}.training-heading h1{font-size:24px}}
@media(max-width:450px){.training-settings{padding:8px}.settings-expanded{grid-template-columns:1fr}#practice-categories{grid-template-columns:1fr}.training-stage .keyboard{height:145px}.practice-question-line{font-size:22px}.stage-toolbar{gap:5px}.stage-toolbar .audio-mode{font-size:11px;padding:5px}.combo-questions[data-many=true] button{font-size:11px}.training-stage .audio-icon{width:30px;height:30px}.training-stage .practice-actions{gap:4px}.training-stage .practice-actions button{font-size:11px}.keyboard-bottom .midi-controls select{max-width:130px}}
/* Keep common laptop viewports focused on the question and input area. */
@media(min-width:851px){.tool-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.tool-card:nth-child(4){background:#e3e5e6}.tool-card:nth-child(4) .tool-icon{background:#3d535c}body:has(.training-tool:not([hidden])) .site-return{padding-top:12px}body:has(.training-tool:not([hidden])) header{height:54px}body:has(.training-tool:not([hidden])) .global-display{margin-bottom:6px}body:has(.training-tool:not([hidden])) .back{margin:0;padding:7px 0;min-height:32px}.training-tool .training-heading{margin:5px 0 12px}.training-stage .practice-question-line{min-height:66px}.combo-active .training-stage .practice-question-line{min-height:44px}}
.training-stage .answer-notes{height:54px;min-height:54px;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;justify-content:flex-start;white-space:nowrap;font-size:19px}.training-stage .answer-note{flex-shrink:0;padding:2px 4px}.training-stage .answer-panel{text-align:left}.training-stage #answer-description{height:32px;min-height:32px;overflow:auto;line-height:1.4}.training-stage #answer-bass{height:18px;overflow:hidden}.training-stage .answer-heading{padding-top:0}.scale-answer #scale-description{min-height:34px;max-height:52px;overflow:auto;line-height:1.5;margin:3px 0}.scale-answer{min-height:116px}.training-stage .practice-actions .primary{width:auto}.training-settings input[type=range]{accent-color:#6d8569}.training-settings label,.combo-settings{font-size:12px}.settings-primary>label{white-space:nowrap}.scale-sequence{height:36px;overflow-x:auto;flex-wrap:nowrap;white-space:nowrap}.training-stage .key-label .music-glyph-accessible{display:block!important}.training-stage .key-label{white-space:nowrap}.training-stage .music-accidental{word-spacing:0;letter-spacing:0}.combo-questions button .music-accidental{vertical-align:.1em}.combo-questions small{white-space:nowrap}.scale-board button{touch-action:manipulation}

/* Disclosure state is visible independently of the browser's native marker. */
.training-settings .more-settings-summary{display:flex;align-items:center;justify-content:flex-start;gap:8px;cursor:pointer;list-style:none}.more-settings-summary::-webkit-details-marker{display:none}.disclosure-chevron{display:inline-block;width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);transition:transform .15s}details[open]>.more-settings-summary .disclosure-chevron{transform:rotate(225deg)}
.training-settings [hidden]{display:none!important}.training-settings .mode-presets{flex-wrap:wrap}.training-settings .mode-presets button{padding:7px 10px}#practice-specialty{max-width:185px}#scale-board{margin-top:4px;touch-action:pan-y}#scale-board .guitar-position.is-dimmed{cursor:pointer}#scale-board .guitar-position[aria-disabled=true]{pointer-events:none}#scale-board [data-window-drag]{cursor:grab}#scale-board .guitar-position:focus-visible{outline:2px solid #356b88}#scale-board .guitar-position.is-tonic:not(.is-selected) circle{fill:#fff;stroke:#111;stroke-width:2}#scale-board .guitar-position.is-tonic:not(.is-selected) text{fill:#111}#scale-board .guitar-position.is-wrong circle{fill:#ef9e9e}
@media(prefers-reduced-motion:reduce){.disclosure-chevron{transition:none}}

#scale-board .guitar-svg{width:120%;min-width:1176px;height:auto}@media(max-width:700px){#scale-board .guitar-svg{min-width:1320px}}

/* v0.11: stable heading, roomy question grid, horizontal pitch labels. */
#practice-tool .training-heading{display:flex;flex-direction:column;align-items:stretch;gap:10px}.practice-title-row{display:flex;align-items:center;gap:20px;flex-wrap:nowrap}.practice-title-row h1{flex:none}.practice-title-row .combo-toggle{flex:none;margin:0}#combo-settings{flex:none;align-self:stretch}.combo-questions{height:232px;grid-auto-rows:minmax(0,1fr);overflow:visible}.combo-questions button{min-height:0;overflow:hidden}.combo-questions[data-many=true] button{font-size:14px}
.training-stage .keyboard .key-label{writing-mode:horizontal-tb;display:flex;flex-direction:row;justify-content:center;align-items:center;font-size:11px;bottom:12px}.training-stage .keyboard .key-label.enharmonic-label{flex-direction:column;gap:1px}.training-stage .key-label>span{display:block;writing-mode:horizontal-tb}#scale-tool .stage-toolbar{margin-bottom:18px}#scale-tool .keyboard-bottom{justify-content:flex-start;gap:14px}#scale-tool .keyboard-bottom .midi-controls{margin-left:auto}#scale-keyboard .piano-key.scale-correct{background:#d4edd9;border-color:#73a884}#scale-keyboard .piano-key.black.scale-correct{background:#4a9362}#scale-keyboard .piano-key.scale-wrong{background:#edb0ac;border-color:#c26159}#scale-keyboard .piano-key.black.scale-wrong{background:#b75951}#scale-board .guitar-position.is-empty>circle,#scale-board .guitar-position.is-empty>path,#scale-board .guitar-position.is-empty>text{visibility:hidden}#scale-board .guitar-position.is-correct>circle:not([fill="none"]){fill:#7dc898;stroke:#358254}#scale-board .guitar-position.is-wrong>circle:not([fill="none"]){fill:#ef9d9d;stroke:#b94b48}#scale-board .guitar-position:not(.is-empty)>text{fill:var(--note-color,#333)}#scale-board [data-window-drag]{cursor:default}.guitar-cell-target{cursor:pointer}.guitar-cell-target:hover{fill:#e8b46d22}#scale-board .guitar-position.is-empty:focus-visible .guitar-cell-target{stroke:#356b88;stroke-width:2}
@media(max-width:760px){.combo-questions{height:260px}.combo-questions[data-many=true] button{font-size:12px}.practice-title-row{gap:12px}.practice-title-row h1{font-size:23px}.training-stage .keyboard .key-label{font-size:9px}}

@media(max-width:760px){.combo-questions{height:360px}}#scale-board .guitar-position>g[aria-label] text,#scale-board .guitar-position>g[aria-label] path{fill:var(--note-color,#333)}

#scale-board .guitar-position[aria-disabled=true] .guitar-cell-target{pointer-events:none}
/* v0.12: compact category directory, shared label badges and readable scale markers. */
.tool-directory{display:flex;flex-direction:column;gap:25px;margin:24px 0 48px}.tool-category{display:grid;grid-template-columns:125px minmax(0,1fr);gap:24px;align-items:start;padding-top:20px;border-top:1px solid #dddcd3}.tool-category>h2{font-size:14px;font-weight:500;margin:12px 0;color:#6d7467}.tool-category-list{display:flex;flex-direction:column;gap:8px}#tool-grid .tool-card{display:flex;align-items:center;gap:16px;text-align:left;padding:13px 16px;min-height:70px;border:1px solid #dedfd4;background:#f6f6ef;border-radius:10px;box-shadow:none}#tool-grid .tool-card:hover{background:#eaf0e3;transform:none}#tool-grid .tool-icon{width:38px;height:38px;flex:0 0 38px;display:flex;align-items:center;justify-content:center;border-radius:9px;margin:0;font-size:15px;background:#dce5d1;color:#39492e}#tool-grid .tool-card h3{font-size:16px;margin:0;flex:1}#tool-grid .tool-cover{width:38px;height:38px;aspect-ratio:1;object-fit:cover;margin:0;border-radius:9px;flex:0 0 38px}#tool-grid .has-cover .tool-icon{display:none}.tool-arrow{color:#748465}.tool-badge{font-size:11px;background:#e9e8df;color:#777567;border-radius:20px;padding:4px 9px;white-space:nowrap}#piano-falls-frame{width:100%;height:900px;border:0;display:block;background:#faf9f6}.tool-pending{padding:55px 20px;text-align:center;background:#f4f3ec;border:1px dashed #c8cabb;border-radius:15px;color:#79806e}.tool-pending>span{font-size:34px}.tool-pending p{font-size:14px}
#scale-keyboard .piano-key.scale-correct{background:#fffefa;border-color:#d8c6b6}#scale-keyboard .piano-key.black.scale-correct{background:#3a3933;border-color:#333}#scale-keyboard .scale-correct .key-label{width:calc(100% - 4px);left:2px;border:2px solid var(--note-color);border-radius:7px;padding:3px 0;background:#fffefa;color:#20231e!important;box-sizing:border-box}#scale-answer-notes .answer-note{color:#20231e;background:#fffefa}
#scale-board .guitar-position text,#scale-board .guitar-position g[aria-label] path{fill:var(--label-color,#171713)!important}#scale-board .guitar-position.is-correct>circle:not([fill="none"]){fill:#a8cdb7;stroke:#588e70}#scale-board .guitar-position.is-wrong>circle:not([fill="none"]){fill:#e7aaa1;stroke:#b66a5f}#scale-board .guitar-position.is-tonic>circle:not([fill="none"]){fill:#fff!important;stroke:#b64b40!important;stroke-width:2}#scale-board .guitar-position.is-tonic text,#scale-board .guitar-position.is-tonic g[aria-label] path{fill:#b84436!important}.scale-label-fixed{animation:scale-fixed-fade 6s ease-in-out infinite}.scale-label-degree{animation:scale-degree-fade 6s ease-in-out infinite;opacity:0}@keyframes scale-fixed-fade{0%,35%,100%{opacity:1}45%,85%{opacity:0}}@keyframes scale-degree-fade{0%,35%,100%{opacity:0}45%,85%{opacity:1}}@media(prefers-reduced-motion:reduce){.scale-label-fixed{animation:none;opacity:1}.scale-label-degree{animation:none;opacity:0}}@media(max-width:600px){.tool-category{grid-template-columns:1fr;gap:10px}.tool-category>h2{margin:0}#tool-grid .tool-card{padding:11px 12px;gap:12px}#tool-grid .tool-card h3{font-size:15px}}

#scale-board .guitar-position g[aria-label] path{fill:none!important;stroke:var(--label-color,#171713)!important}#scale-board .guitar-position.is-tonic g[aria-label] path{fill:none!important;stroke:#b84436!important}

/* 1.0 candidate: four category columns with generous tool covers. */
.tool-directory{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;align-items:start}.tool-category{display:block;min-width:0;padding-top:15px}.tool-category>h2{margin:0 0 18px;font-size:15px}.tool-category-list{gap:18px}#tool-grid .tool-card{position:relative;flex-direction:column;align-items:flex-start;padding:22px;gap:18px;min-height:205px}#tool-grid .tool-icon,#tool-grid .tool-cover{width:88px;height:88px;flex:0 0 88px;border-radius:20px;font-size:31px}#tool-grid .tool-card h3{font-size:16px;line-height:1.5;flex:0}#tool-grid .tool-arrow,#tool-grid .tool-badge{position:absolute;right:13px;top:14px}.practice-question-line #practice-key-context,.chord .key-context{margin-right:1em;font:inherit;white-space:nowrap}.combo-key-context{display:inline-block;margin-right:1em}.combo-questions button>span{display:inline;line-height:1.5}
#keyboard .piano-key.answer-correct{background:#b8dbc6!important;border-color:#649378!important}#keyboard .piano-key.black.answer-correct{background:#59896c!important}#keyboard .piano-key.answer-wrong{background:#e7aaa1!important;border-color:#b66a5f!important}#keyboard .piano-key.black.answer-wrong{background:#b9675d!important}
@media(max-width:960px){.tool-directory{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:480px){.tool-directory{grid-template-columns:1fr}.tool-category-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}#tool-grid .tool-card{padding:16px;min-height:190px}#tool-grid .tool-card h3{font-size:14px}#tool-grid .tool-icon,#tool-grid .tool-cover{width:76px;height:76px;flex-basis:76px}.practice-question-line #practice-key-context{margin-right:.5em}}

#guitar-key-context{margin-right:1em}

.inversion-display-toggle{gap:8px!important}.inversion-display-toggle .muted{color:#999b94}.inversion-display-toggle .selected{color:#30392c}.inversion-display-toggle input{appearance:none;width:42px!important;min-width:42px;height:24px;border:1px solid #a5b09c;border-radius:20px;background:#dfe5d8;position:relative;margin:0;cursor:pointer}.inversion-display-toggle input:before{content:'';position:absolute;left:3px;top:3px;width:16px;height:16px;background:#526a48;border-radius:50%;transition:transform .15s}.inversion-display-toggle input:checked:before{transform:translateX(18px)}.inversion-ordinal{white-space:pre;font:inherit}

.practice-question-line{gap:0}.combo-key-context{margin-right:0!important}#practice-key-context{margin-right:0!important}.scale-guitar-controls{display:flex;gap:18px;flex-wrap:wrap}.scale-guitar-disabled{opacity:.35;pointer-events:none}
