/* Two persistent listening frames; reveal adds notes, not another panel. */
.scale-listen #notation svg { width:560px; height:390px; }
.scale-listen .row-caption { font:14px system-ui,sans-serif; fill:currentColor; }
.scale-listen .active > .staff-line { stroke:var(--gold); }
.scale-listen .active .row-caption { fill:var(--gold); font-weight:700; }
.scale-listen .change-mark { stroke:var(--gold); stroke-width:2; }
.scale-listen .transport { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; max-width:350px; margin:12px auto 0; }
.scale-listen .transport button { font-size:15px; min-width:0; padding:7px 8px; }
.scale-listen #pair { background:#21465d; color:white; border-color:#21465d; }
.scale-listen #audio-status { min-height:3em; font-size:.85rem; line-height:1.4; text-align:center; margin:8px 0; }
.scale-listen #answers { min-inline-size:0; width:100%; border:0; padding:0; margin:6px 0; font-size:.9rem; }
.scale-listen legend { font-weight:650; padding:0; margin-bottom:6px; }
.scale-listen .listen-choices { display:flex; flex-direction:column; gap:2px; }
.scale-listen .listen-choices label { display:flex; gap:8px; align-items:center; min-height:44px; }
.scale-listen input[type=radio] { width:20px; height:20px; margin:0; }
.scale-listen .degree-choice { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:4px 0; }
.scale-listen #degree { font:inherit; min-height:44px; padding:5px 8px; border:1px solid #abb5b9; border-radius:8px; color:var(--ink); background:white; }
.scale-listen .feedback-shell { min-height:7em; font-size:.9rem; line-height:1.45; text-align:center; }
.scale-listen #feedback { min-height:0; padding:6px 0; }
.scale-listen #explanation { margin:0 0 6px; }
.scale-listen #check { min-width:180px; }
.scale-listen .practice-actions { gap:16px; }
.scale-listen :is(input,fieldset):focus-visible { outline:2px solid #21465d; outline-offset:3px; }