.music-practice{--music-line:#71867a;--music-soft:#eaf1eb}.music-stage{background:var(--subject-surface,#eaf1eb)}.music-stage>h2{margin-top:12px}.music-stage .board-top{margin-bottom:20px}.music-example{margin-top:24px}.music-material{min-width:0;margin-block:24px}.music-audio{margin-block:20px}.music-audio-actions{flex-wrap:wrap;align-items:center;gap:8px 12px;display:flex}.music-audio-actions>.btn{white-space:normal;flex:0 auto;width:auto;min-width:88px;min-height:44px}.music-volume{flex:160px;align-items:center;gap:12px;min-width:0;font-size:.875rem;display:flex}.music-volume span{overflow-wrap:anywhere}.music-volume input{width:100%;min-width:70px;max-width:160px;min-height:44px;accent-color:var(--accent);cursor:pointer;margin:0}.music-audio p{margin-block:8px 0}.music-audio p:empty{display:none}.music-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-block:20px 8px;display:grid}.music-option{border:1px solid var(--music-line);background:var(--card);min-width:0;min-height:58px;color:var(--ink);font:inherit;cursor:pointer;overflow-wrap:anywhere;touch-action:manipulation;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:12px;font-weight:600;line-height:1.4;display:flex}.music-option[aria-pressed=true]{background:var(--music-soft);outline:2px solid var(--accent);outline-offset:-2px}.music-option[data-correct=true]{border-width:2px;border-color:var(--accent)}.music-option:disabled{opacity:1;cursor:default}.music-options[data-locked=true] .music-option{color:var(--muted);background:var(--bg);border-style:dashed}.music-option-mark{flex:none;width:1.3em;font-size:1.2rem}.music-option-mark:empty{display:none}.music-choice-symbol{flex:0 0 28px}.music-choice-symbol svg{width:28px;height:44px;display:block}.music-selection{min-height:1.5em;font-size:.875rem}.music-options[data-kind=chord-builder]{grid-template-columns:repeat(4,minmax(0,1fr))}.music-options[data-kind=chord-builder] .music-option{flex-direction:column;gap:2px;min-height:68px;padding:8px 4px}.music-options[data-kind=chord-builder] .music-option small{font-size:.75rem;font-weight:500}.music-option[data-root=true]{border-style:dashed}.music-bar{border-block:1px solid var(--music-line);align-items:stretch;gap:6px;padding:16px 0;display:flex}.music-signature{flex-direction:column;flex:0 0 24px;align-self:center;font-size:1.4rem;font-weight:700;line-height:1;display:flex}.music-cell{border:1px solid #0000;border-radius:10px;flex-direction:column;flex:1 1 0;justify-content:center;align-items:center;min-width:0;padding:8px 2px;display:flex}.music-cell[data-missing=true]{border:2px dashed var(--music-line)}.music-cell[data-playing=true],.music-phrase[data-playing=true],.music-tone[data-playing=true]{outline:3px solid var(--accent);outline-offset:2px}.music-cell svg{width:40px;max-width:100%;height:62px;overflow:visible}.music-cell .music-missing{place-items:center;height:62px;font-size:2rem;display:grid}.music-cell-label{text-align:center;overflow-wrap:anywhere;margin-top:8px;font-size:.75rem;line-height:1.35}.music-tones,.music-phrases{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.music-tone,.music-phrase{background:var(--card);border:1px solid var(--music-line);border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:16px;min-width:0;min-height:136px;padding:20px 12px;display:flex}.music-tone>strong,.music-phrase>strong{font-size:1.5rem;font-weight:600}.music-pulse{background:var(--ink);border-radius:50%;width:22px;height:22px}.music-note-row{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.music-note-row span{background:var(--ink);border-radius:50%;width:10px;height:10px}.music-note-names{text-align:center;overflow-wrap:anywhere;line-height:1.8}.music-root{border-block:1px solid var(--music-line);flex-wrap:wrap;justify-content:center;align-items:baseline;gap:8px 16px;padding:20px;display:flex}.music-root strong{font-size:2rem}.music-feedback{border-top:1px solid var(--music-line);margin-block:24px 8px;padding-top:16px}.music-feedback>p:first-child{margin-top:0;font-weight:700}.music-feedback:focus{outline:none}.music-review{margin-block:20px}.music-review>summary{cursor:pointer;align-items:center;min-height:44px;font-weight:600;display:flex}.music-review>ol{padding-inline-start:24px}.music-review li{border-top:1px solid var(--music-line);padding-block:16px}.music-review h3{font-size:1rem}.music-review p{font-size:.875rem}.music-error{padding-block:12px;font-weight:600}.music-practice button:focus-visible,.music-practice input:focus-visible,.music-practice summary:focus-visible{outline:3px solid var(--accent);outline-offset:3px}@media (hover:hover){.music-option:not(:disabled):hover{background:var(--music-soft)}}@media (width<=420px){.music-bar{gap:2px}.music-cell-label{font-size:.75rem}.music-signature{flex-basis:18px;font-size:1.2rem}.music-tones,.music-phrases{gap:10px}.music-tone,.music-phrase{padding-inline:8px}.music-options{gap:8px}.music-option{padding-inline:8px}}@media (prefers-reduced-motion:reduce){.music-practice *,.music-practice :before,.music-practice :after{transition:none!important;animation:none!important}}@media (forced-colors:active){.music-practice{--music-line:CanvasText}.music-option[aria-pressed=true],.music-cell[data-playing=true],.music-phrase[data-playing=true],.music-tone[data-playing=true]{outline-color:highlight}.music-pulse,.music-note-row span{background:canvastext}}