/* ── LCC Radio ──────────────────────────────────────────────
   Opt-in background audio. The button sits with the other header tools; the
   panel is a plain positioned div rather than a modal so it never traps focus
   or blocks the room behind it. */
.radio-btn.radio-on { color: var(--purple, #7c5cff); }
.radio-panel {
  position: fixed;
  z-index: 3000;
  width: 236px;
  padding: 12px;
  border-radius: 14px;
  background: var(--card, #fff);
  border: 1px solid var(--line, rgba(0,0,0,.1));
  box-shadow: 0 12px 32px rgba(0,0,0,.18);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.radio-panel[hidden] { display: none; }
.radio-title { font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--muted, #888); margin-bottom: 2px; }
.radio-ch {
  display: flex; flex-direction: column; align-items: flex-start; gap: 1px;
  width: 100%; padding: 8px 10px; border-radius: 10px; cursor: pointer;
  background: transparent; border: 1px solid transparent; text-align: left;
  font-size: 14px; color: inherit;
}
.radio-ch:hover { background: var(--hover, rgba(0,0,0,.04)); }
.radio-ch.on { border-color: var(--purple, #7c5cff); background: rgba(124,92,255,.08); }
.radio-ch small { font-size: 11px; color: var(--muted, #888); }
.radio-row { display: flex; align-items: center; gap: 8px; margin-top: 4px; }
.radio-play {
  padding: 6px 14px; border-radius: 999px; cursor: pointer; font-size: 13px; font-weight: 600;
  background: var(--purple, #7c5cff); color: #fff; border: 0;
}
.radio-row input[type=range] { flex: 1; accent-color: var(--purple, #7c5cff); }
.radio-note { font-size: 10px; color: var(--muted, #888); line-height: 1.4; }

/* Landing page: the nav has no .tb-btn styling of its own. */
.nav-links .radio-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; padding: 0;
  background: transparent; border: 0; cursor: pointer;
  color: inherit; opacity: .85;
}
.nav-links .radio-btn:hover { opacity: 1; }

.radio-note a { color: var(--purple, #7c5cff); text-decoration: none; }
.radio-note a:hover { text-decoration: underline; }