/* The instrument, playback status and Stop action stay together. */
.trainer-listening-deck{margin:18px -6px 12px;padding:14px;background:#12253e;border:1px solid #8299ba;border-radius:14px;scroll-margin-top:12px}
.trainer-listening-deck.is-playing{position:sticky;top:12px;z-index:5;box-shadow:0 7px 24px #050c1f66;border-color:#dcc3f7}
.trainer-playback-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.trainer-playback-label{margin:0;color:#f1e5ff;font-size:14px;font-weight:800}
#trainer-stop-example{font:inherit;font-size:13px;font-weight:800;min-height:44px;padding:10px 14px;border:1px solid #f0d3b0;border-radius:10px;background:#f4d9ba;color:#252035;cursor:pointer}
#trainer-stop-example[aria-disabled="true"]{background:#233954;border-color:#8b9eb6;color:#d0ddee;cursor:default}
.trainer-playback-hint{font-size:11px!important;line-height:1.5;color:#c2d3e8;margin:9px 0 0}
.trainer-instrument .trainer-listening-deck .trainer-keys{min-height:156px;height:156px;margin:12px 0}
.trainer-instrument .trainer-listening-deck .trainer-key{min-height:0;padding-bottom:13px}
.trainer-listening-deck .trainer-current-note{margin:10px 0 6px;min-height:0;padding:8px 10px}
.trainer-playback-status{font-size:12px!important;line-height:1.5;color:#e9ddfa;margin:7px 0 0;overflow-wrap:anywhere}
.trainer-listening-deck.is-playing .trainer-key{cursor:default}
.trainer-listening-deck.is-playing .trainer-key:disabled{opacity:1}
.trainer-listening-deck.is-playing .trainer-key.coach-target{box-shadow:none}
@media(max-width:420px){
 .trainer-listening-deck{padding:11px;margin-left:-5px;margin-right:-5px;scroll-margin-top:10px}
 .trainer-listening-deck.is-playing{top:10px}
 .trainer-playback-bar{gap:8px}
 .trainer-playback-label{font-size:12px}
 #trainer-stop-example{font-size:12px;padding:9px 11px}
 .trainer-instrument .trainer-listening-deck .trainer-keys{height:132px;min-height:132px}
 .trainer-listening-deck .trainer-current-note{font-size:12px!important}
}
@media(max-height:520px){
 .trainer-instrument .trainer-listening-deck .trainer-keys{height:96px;min-height:96px}
 .trainer-playback-hint{display:none}
}
@media(prefers-reduced-motion:reduce){.trainer-listening-deck{scroll-behavior:auto}}