:is(a,button,input,select,textarea,summary,[tabindex]):focus-visible {
  outline: 3px solid #0856b8;
  outline-offset: 3px;
}
.modal .modal-content, .filters .filters-card {
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.playback-status {
  padding: 12px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  color: var(--text);
  margin-top: 12px;
}
.playback-status p { margin: 0 0 8px; }
.playback-status a { text-decoration: underline; }
.playback-status[hidden] { display: none; }
@media (max-width: 1250px) {
  .container > #player { flex: none; width: 100%; }
  .container > .notes-panel { flex: 0 1 auto; min-width: 0; width: 100%; }
}
@media (max-width: 600px) {
  html body { padding: 12px; }
  .filters .filters-card { width: calc(100vw - 24px); max-width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}