.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-options[data-choices="5"]>:nth-child(5){grid-column:1/-1;justify-self:center;width:calc(50% - 5px)}.music-options[data-choices="6"]{grid-template-columns:repeat(3,minmax(0,1fr))}.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;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;padding:12px;font-weight:600;line-height:1.4;display:flex}.music-option-label{flex-basis:100%;display:block}.music-options[data-kind=chord-builder] .music-option-label{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.music-option:disabled{opacity:1;cursor:default}.music-options[data-locked=true] .music-option{color:var(--muted);background:var(--bg);border-style:dashed}.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{margin-block:24px 8px;padding-top:16px}.music-feedback>.practice-verdict{margin-top:0}.music-feedback:focus{outline:none}.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<=26.25em){.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-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}}