/* Semantic utilities kept last so genre themes cannot override hidden states. */
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.external-dialog p,.station-card p,.station-card h2,.station-card h3,.journal-card h2,.journal-card h3 { overflow-wrap: anywhere; }
.hero-copy,.hero-story,.editorial-copy,.section-head > * { min-width: 0; }
/* Controls follow controller state in either language, never translated aria text. */
#player-play:is([data-player-state="playing"],[data-player-state="connecting"],[data-player-state="widget-open"])::before { clip-path: inset(12%); }
.site-nav a { justify-content: center; min-inline-size: 44px; }
.volume-control input { min-height: 44px; }
.site-footer { padding-bottom: max(130px, calc(var(--player-reserve, 0px) + 24px)); }
/* Beat legacy/theme :has reserves; without ResizeObserver, reserve at most one
   viewport for the expanded dock. The footer is the only reserved block. */
body:has(#station-widget:not([hidden])) .site-footer { padding-bottom: max(130px, calc(var(--player-reserve, 100vh) + 24px)); }
html { scroll-padding-bottom: max(140px, calc(var(--player-reserve, 0px) + 24px)); }

/* V2 local identity and state decoration; art never represents frequency data. */
.brand-mark:has(.brand-logo) { display: flex; width: var(--brand-logo-size, 40px); height: var(--brand-logo-size, 40px); flex: 0 0 auto; padding: 0; border: 0; background: transparent; }
.brand-mark .brand-logo { display: block; width: 100%; height: 100%; object-fit: contain; }
.player-visual { position: relative; display: block; flex: 0 0 var(--player-art-size, 40px); width: var(--player-art-size, 40px); height: var(--player-art-size, 40px); color: var(--player-motion-color, var(--accent)); opacity: .45; }
.player-disc { position: absolute; inset: 0 20% 20% 0; border: 2px solid currentColor; border-radius: 50%; background: repeating-radial-gradient(circle at center, transparent 0 3px, currentColor 4px, transparent 5px 7px); }
.player-disc::after { content: ''; position: absolute; inset: 40%; border-radius: 50%; background: currentColor; }
.player-wave { position: absolute; right: 0; bottom: 0; display: flex; align-items: center; justify-content: space-between; gap: 2px; width: 65%; height: 45%; }
.player-wave > span { display: block; flex: 1; height: 45%; border-radius: 2px; background: currentColor; transform-origin: center; }
.player-wave > span:nth-child(2) { height: 75%; }
.player-wave > span:nth-child(3) { height: 100%; }
.player-wave > span:nth-child(4) { height: 65%; }
.player-shell[data-player-state="connecting"] .player-disc { border-style: dashed; }
.player-shell[data-player-state="error"] .player-visual { color: var(--player-error, #be3d51); }
.player-shell[data-player-state="playing"] .player-visual { opacity: 1; }
.player-shell[data-player-motion="running"] .player-disc { animation: player-disc-turn var(--player-disc-duration, 8s) linear infinite; }
.player-shell[data-player-motion="running"] .player-wave > span { animation: player-wave-shift var(--player-wave-duration, .8s) ease-in-out infinite alternate; }
.player-shell[data-player-motion="running"] .player-wave > span:nth-child(2n) { animation-delay: -.3s; }
.player-shell[data-player-motion="running"] .player-wave > span:nth-child(3n) { animation-delay: -.6s; }
.player-shell[data-player-motion="paused"] .player-visual,
.player-shell[data-player-motion="paused"] .player-visual *,
.player-shell[data-player-motion="paused"] .player-visual::before,
.player-shell[data-player-motion="paused"] .player-visual::after,
.player-shell[data-player-motion="paused"] .player-visual *::before,
.player-shell[data-player-motion="paused"] .player-visual *::after { animation-play-state: paused !important; }
@keyframes player-disc-turn { to { transform: rotate(1turn); } }
@keyframes player-wave-shift { from { transform: scaleY(.35); } to { transform: scaleY(1); } }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  .player-shell .player-visual, .player-shell .player-visual *,
  .player-shell .player-visual::before, .player-shell .player-visual::after,
  .player-shell .player-visual *::before, .player-shell .player-visual *::after { animation: none !important; transition: none !important; }
}

/* PLAYER-V3 owns geometry; theme paint and original player artwork stay intact. */
#radio-player.player-shell[data-player-layout="compact"] {
  position: fixed; inset: auto 0 0; transform: none; width: 100%; max-width: none;
  height: auto; min-height: 0; max-height: min(65dvh, 440px); margin: 0;
  padding: 8px 12px calc(8px + env(safe-area-inset-bottom));
  display: block; grid-template: none; gap: 0; box-sizing: border-box;
  border-width: 1px; border-style: solid; overflow-x: hidden; overflow-y: auto;
  overscroll-behavior: contain; scroll-padding-block: 8px;
}
#radio-player .player-bar {
  position: sticky; top: 0; z-index: 2; display: grid;
  grid-template-columns: minmax(0, 1fr) 140px minmax(0, 1fr);
  grid-template-rows: 44px; gap: 0; align-items: center; min-width: 0;
  background: inherit;
}
#radio-player .player-info { grid-area: 1 / 1; display: flex; gap: 8px; min-width: 0; max-width: 100%; margin: 0; padding: 0; }
#radio-player .player-info > span:last-child { display: block; flex: 1; min-width: 0; }
#radio-player #player-station { display: block; margin: 0; font-size: 13px; line-height: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#radio-player #player-status { display: block; margin: 0; font-size: 11px; line-height: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#radio-player .player-visual { --player-art-size: 28px; display: block; flex: 0 0 28px; width: 28px; height: 28px; margin: 0; }
#radio-player .player-controls { grid-area: 1 / 2; display: grid; grid-template: 44px / repeat(3, 44px); gap: 4px; width: 140px; margin: 0; padding: 0; justify-self: center; align-items: center; justify-content: center; }
#radio-player .player-actions { grid-area: 1 / 3; display: flex; align-items: center; justify-content: flex-end; gap: 4px; min-width: 0; }
#radio-player .player-options { display: flex; align-items: center; gap: 8px; min-width: 0; }
#radio-player :is(#player-prev, #player-next, #player-play, #player-toggle, #player-source) {
  display: grid; place-items: center; width: 44px; height: 44px; min-width: 44px; min-height: 44px;
  max-width: 44px; max-height: 44px; margin: 0; padding: 0; flex: 0 0 44px;
  position: relative; inset: auto; transform: none; grid-area: auto; line-height: 1;
}
#radio-player #player-play { font-size: 0; grid-template: 1fr / 1fr; gap: 0; border-width: 1px; }
#radio-player #player-play::before, #radio-player #player-play::after { content: none !important; display: none !important; animation: none !important; }
#radio-player :is(#player-play,#player-toggle,#player-prev,#player-next,#player-source,#player-volume):focus-visible { outline-width: 2px; outline-style: solid; outline-offset: 2px; }
#radio-player #player-play .player-glyph { position: absolute; inset: 0; margin: auto; display: block; width: 22px; height: 22px; transform: none; pointer-events: none; }
#radio-player #player-play .player-glyph-stop { display: none; }
#radio-player #player-play:is([data-player-state="connecting"],[data-player-state="playing"],[data-player-state="widget-open"]) .player-glyph-play { display: none; }
#radio-player #player-play:is([data-player-state="connecting"],[data-player-state="playing"],[data-player-state="widget-open"]) .player-glyph-stop { display: block; }
#radio-player .volume-control { display: flex; flex-direction: row; grid-area: auto; gap: 8px; margin: 0; font-size: 11px; line-height: 1; }
#radio-player .volume-control input { width: 88px; height: 44px; min-height: 44px; margin: 0; }
#radio-player #player-source { overflow: hidden; white-space: nowrap; text-decoration: none; }
#radio-player #player-source .icon { width: 18px; height: 18px; }
#radio-player .player-details { display: block; min-width: 0; margin-top: 8px; }
#radio-player .station-widget { display: block; width: min(400px, 100%); height: 200px; max-width: 100%; margin: 0 auto; grid-area: auto; }
#radio-player .widget-help { margin: 8px 0 0; font-size: 12px; line-height: 1.4; }
#radio-player .widget-help a { display: inline-flex; align-items: center; min-height: 44px; }
#radio-player.player-shell[data-player-layout="compact"][data-player-view="collapsed"] { padding-block: 4px calc(4px + env(safe-area-inset-bottom)); }
#radio-player[data-player-view="collapsed"] .player-bar { grid-template-columns: minmax(0, 1fr) 44px minmax(0, 1fr); grid-template-rows: 44px; }
#radio-player[data-player-view="collapsed"] .player-controls { display: grid; grid-area: 1 / 2; width: 44px; grid-template: 44px / 44px; gap: 0; }
#radio-player[data-player-view="collapsed"] .player-visual { display: none; }
#radio-player[data-player-view="collapsed"] #player-status { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
#radio-player[data-player-view="collapsed"] .player-toggle-icon { transform: rotate(180deg); }
@media (max-width: 767px) {
  #radio-player .volume-control { display: none; }
}
@media (max-width: 640px) {
  #radio-player.player-shell[data-player-layout="compact"] { padding-top: 6px; padding-bottom: calc(6px + env(safe-area-inset-bottom)); }
  #radio-player .player-bar { grid-template-columns: minmax(0, 1fr) 44px minmax(0, 1fr); grid-template-rows: 30px 44px; row-gap: 4px; }
  #radio-player .player-info { grid-area: 1 / 1 / 2 / -1; gap: 6px; }
  #radio-player .player-visual { --player-art-size: 24px; width: 24px; height: 24px; flex-basis: 24px; }
  #radio-player #player-station { line-height: 16px; }
  #radio-player #player-status { line-height: 14px; }
  #radio-player .player-controls { display: contents; }
  #radio-player #player-prev { grid-area: 2 / 1; justify-self: start; }
  #radio-player #player-next { grid-area: 2 / 1; justify-self: start; margin-inline-start: 48px; }
  #radio-player #player-play { grid-area: 2 / 2; justify-self: center; }
  #radio-player .player-actions { grid-area: 2 / 3; }
  #radio-player.player-shell[data-player-layout="compact"][data-player-view="collapsed"] { padding-block: 4px calc(4px + env(safe-area-inset-bottom)); }
  #radio-player[data-player-view="collapsed"] .player-info { grid-area: 1 / 1; }
  #radio-player[data-player-view="collapsed"] #player-play { grid-area: auto; }
  #radio-player[data-player-view="collapsed"] .player-actions { grid-area: 1 / 3; }
}

/* PLAYER-V5: the collapsed player is a corner widget, with one CORE reserve. */
#radio-player.player-shell[data-player-layout="compact"][data-player-view="collapsed"] {
  inset: auto max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) auto;
  width: min(320px, calc(100% - 24px)); max-width: calc(100% - 24px);
  padding: 9px; border-radius: 18px; max-height: none;
}
#radio-player[data-player-view="collapsed"] .player-bar {
  grid-template-columns: minmax(0, 1fr) 44px minmax(0, 1fr); grid-template-rows: 44px; gap: 6px;
}
#radio-player[data-player-view="collapsed"] .player-info { grid-area: 1 / 1; }
#radio-player[data-player-view="collapsed"] .player-controls { grid-area: 1 / 2; }
#radio-player[data-player-view="collapsed"] .player-actions { grid-area: 1 / 3; }
#radio-player[data-player-view="collapsed"] #player-status {
  position: static; display: block; width: auto; height: auto; margin: 0; padding: 0;
  overflow: hidden; clip-path: none; white-space: nowrap; text-overflow: ellipsis;
}