/* Inline phone player; desktop opens only when the Listen tab is activated. */
[data-site-player] {
  position: static;
  z-index: 12;
  display: block;
  gap: 18px;
  align-items: center;
  width: min(1180px, calc(100% - 48px));
  margin: 12px auto 0;
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, var(--atmo-accent, #d0a45d) 54%, transparent);
  border-left: 3px solid var(--atmo-accent, #d0a45d);
  background: #15100c;
  box-shadow: 0 9px 22px rgba(0, 0, 0, .24), inset 0 0 0 1px rgba(255, 222, 167, .025);
}

[data-player-panel] { display: grid; gap: 12px; min-width: 0; }
[data-player-panel][hidden], [data-player-toggle][hidden] { display: none !important; }
[data-player-toggle] { min-width: 96px; min-height: 44px; padding: 10px 14px; border: 1px solid #d0a45d; color: #f2e4d2; background: #15100c; font: 500 .75rem 'DM Mono', monospace; cursor: pointer; }
[data-player-toggle]:focus-visible { outline: 3px solid #f2e4d2; outline-offset: 3px; }

@media (min-width: 900px) {
  /* A narrow desktop margin keeps the closed tab off links and form buttons. */
  body:has([data-site-player]) { padding-bottom: 84px; padding-inline-end: 116px; }
  [data-site-player] { position: fixed; top: auto; right: 20px; bottom: 20px; width: 330px; max-height: calc(100dvh - 40px); overflow: auto; margin: 0; padding: 12px; border: 1px solid #d0a45d; }
  [data-site-player][data-player-expanded="false"] { width: auto; padding: 0; border: 0; box-shadow: 0 4px 16px #0008; }
  [data-player-toggle] { display: block; margin-left: auto; }
  [data-player-panel] { margin-top: 12px; }
  [data-player-controls] { grid-template-columns: 1fr 1fr !important; }
  [data-player-controls] label, [data-player-controls] output { grid-column: 1 / -1; }
}

[data-site-player] .listening-dock-copy { display: grid; gap: 4px; min-width: 0; }
[data-site-player] .listening-dock-copy .eyebrow { margin: 0; color: var(--atmo-accent, #d0a45d); font-size: .58rem; }
[data-site-player] .listening-dock-copy strong { color: var(--atmo-foreground, #f2e4d2); font: 500 1.05rem/1 'Newsreader', Georgia, serif; }
[data-site-player] .listening-dock-copy a { width: fit-content; color: var(--atmo-accent, #d0a45d); font: 500 .62rem 'DM Mono', monospace; letter-spacing: .06em; text-decoration: underline; text-underline-offset: 3px; }
[data-site-player] .listening-dock-copy a:hover,
[data-site-player] .listening-dock-copy a:focus-visible { color: var(--atmo-foreground, #f2e4d2); }
[data-site-player] iframe { display: block; width: 100%; min-width: 0; height: 112px; border: 0; background: #191919; }

[data-player-controls] {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: auto auto minmax(150px, .7fr) minmax(180px, 1fr) auto;
  gap: 8px 12px;
  align-items: center;
  margin-top: 2px;
  padding-top: 9px;
  border-top: 1px solid color-mix(in srgb, var(--atmo-accent, #d0a45d) 22%, transparent);
}

[data-player-controls] button,
[data-player-controls] label,
[data-player-controls] output,
[data-player-status] {
  color: var(--atmo-foreground, #f2e4d2);
  font: 500 .68rem 'DM Mono', monospace;
  letter-spacing: .04em;
}

[data-player-controls] button {
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid color-mix(in srgb, var(--atmo-accent, #d0a45d) 58%, transparent);
  color: var(--atmo-accent, #d0a45d);
  background: rgba(0, 0, 0, .2);
}

[data-player-controls] button:hover:not(:disabled),
[data-player-controls] button:focus-visible:not(:disabled) {
  color: #160b06;
  border-color: var(--atmo-accent, #d0a45d);
  background: var(--atmo-accent, #d0a45d);
}

[data-player-controls] button:disabled,
[data-player-controls] input:disabled { cursor: not-allowed; opacity: .48; }
[data-player-controls] label { display: grid; grid-template-columns: auto minmax(70px, 1fr); gap: 8px; align-items: center; min-width: 0; }
[data-player-controls] input[type="range"] { width: 100%; min-width: 0; accent-color: var(--atmo-accent, #d0a45d); }
[data-player-controls] output { color: var(--muted, #c1a58a); text-align: right; white-space: nowrap; }
[data-player-status] { grid-column: 1 / -1; margin: 0; color: var(--muted, #c1a58a); font-size: .6rem; line-height: 1.35; }

@media (max-width: 760px) {
  [data-site-player] { grid-template-columns: 1fr; width: min(1180px, calc(100% - 30px)); }
  [data-player-controls] { grid-template-columns: auto auto minmax(120px, 1fr) auto; }
  [data-player-controls] .player-volume { grid-column: 1 / -1; }
}

@media (max-width: 480px) {
  [data-site-player] { margin-top: 8px; padding: 8px; }
  [data-site-player] iframe { height: 96px; }
  [data-player-controls] { grid-template-columns: 1fr 1fr; }
  [data-player-controls] button { width: 100%; }
  [data-player-controls] label,
  [data-player-controls] output { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
  [data-site-player], [data-site-player] * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
