/* Season One Listen — mobile-first broadcast player */

.lx-page{background:var(--bg, #0a162c);color:var(--text, #eef3fa)}
html[data-theme="light"] .lx-page,
.lx-page.nhl-light{background:#f4f6fa;color:#121826}

.lx-hero{
  padding:2.4rem 4vw 1.85rem;color:#fff;text-align:center;
  background:
    radial-gradient(circle at 30% 0%, rgba(240,215,140,.22), transparent 45%),
    linear-gradient(160deg,#041018 0%,#0a2a28 40%,#163a74 100%);
}
.lx-hero .kicker{font-size:.68rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#f0d78c}
.lx-hero h1{font-family:var(--display);font-size:clamp(2.2rem,7vw,3.6rem);letter-spacing:.04em;margin:.4rem 0}
.lx-hero p{max-width:34rem;margin:.5rem auto 0;color:rgba(238,243,250,.78);line-height:1.5;font-size:.95rem}

.lx-wrap{
  max-width:920px;margin:0 auto;
  padding:1.25rem 4vw calc(7.5rem + env(safe-area-inset-bottom));
}

.lx-picker{display:grid;gap:.65rem;margin:0 0 1.25rem}
@media(min-width:720px){.lx-picker{grid-template-columns:1fr 1fr 1fr}}
.lx-pick{
  display:block;text-align:left;padding:1rem 1.05rem;border-radius:14px;
  border:1px solid rgba(18,24,38,.1);background:#fff;cursor:pointer;color:#121826;
  min-height:44px;-webkit-tap-highlight-color:transparent;
}
html:not([data-theme="light"]) .lx-page:not(.nhl-light) .lx-pick{
  background:rgba(255,255,255,.04);border-color:var(--line-soft);color:var(--text);
}
.lx-pick.is-on{border-color:#163a74;box-shadow:0 0 0 2px rgba(22,58,116,.18)}
.lx-pick .show{font-size:.62rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#8a93a3}
.lx-pick h3{font-family:var(--display);font-size:1.05rem;margin:.25rem 0 .35rem;letter-spacing:.02em}
.lx-pick p{font-size:.78rem;color:#5c6473;line-height:1.4;margin:0}
html:not([data-theme="light"]) .lx-page:not(.nhl-light) .lx-pick p{color:var(--muted)}

.lx-stage{
  border-radius:18px;padding:1.25rem 1.15rem 1.1rem;color:#fff;margin-bottom:1.1rem;
  background:linear-gradient(145deg,#163a74,#0b1220);
}
.lx-stage .meta{font-size:.62rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:rgba(240,215,140,.9)}
.lx-stage h2{font-family:var(--display);font-size:clamp(1.35rem,3.5vw,1.9rem);margin:.35rem 0 .45rem;letter-spacing:.03em}
.lx-stage .now{font-size:.88rem;color:rgba(238,243,250,.78);margin:0 0 .85rem;line-height:1.35}
.lx-stage .times{display:flex;justify-content:space-between;font-size:.68rem;font-weight:800;letter-spacing:.06em;color:rgba(238,243,250,.55);margin:.35rem 0 0}
.lx-controls{display:flex;flex-wrap:wrap;gap:.55rem;align-items:center}
.lx-controls button{
  min-height:44px;min-width:44px;
  font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  padding:.55rem .95rem;border-radius:999px;border:0;cursor:pointer;
  background:#f0d78c;color:#121826;-webkit-tap-highlight-color:transparent;
}
.lx-controls button.ghost{background:rgba(255,255,255,.12);color:#fff}
.lx-controls .prog{
  flex:1;min-width:120px;height:10px;border-radius:999px;background:rgba(255,255,255,.18);
  overflow:hidden;cursor:pointer;touch-action:none;position:relative;
}
@media(max-width:420px){
  .lx-controls .prog{min-width:0;flex:1 1 100%;order:5}
  .lx-controls{gap:.45rem}
}
.lx-controls .prog > i{display:block;height:100%;width:0;background:#f0d78c;pointer-events:none}

.lx-dl{
  margin:0 0 1.1rem;padding:1rem 1.05rem;border-radius:14px;
  border:1px solid rgba(18,24,38,.1);background:#fff;
}
html:not([data-theme="light"]) .lx-page:not(.nhl-light) .lx-dl{
  background:rgba(255,255,255,.04);border-color:var(--line-soft);
}
.lx-dl-head{display:grid;gap:.2rem;margin-bottom:.7rem}
.lx-dl-head strong{font-size:.88rem}
.lx-dl-head span{font-size:.72rem;color:#8a93a3}
html:not([data-theme="light"]) .lx-page:not(.nhl-light) .lx-dl-head span{color:var(--muted)}
.lx-dl-actions{display:flex;flex-wrap:wrap;gap:.4rem}
.lx-dl-actions a{
  display:inline-flex;align-items:center;min-height:var(--touch, 44px);padding:.55rem .85rem;border-radius:999px;
  font-size:.68rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;
  color:#163a74;border:1px solid rgba(22,58,116,.28);background:rgba(22,58,116,.06);
}
.lx-dl-actions a.primary{background:#163a74;color:#fff;border-color:#163a74}
html:not([data-theme="light"]) .lx-page:not(.nhl-light) .lx-dl-actions a{
  color:#f0d78c;border-color:rgba(240,215,140,.35);background:rgba(255,255,255,.06);
}
html:not([data-theme="light"]) .lx-page:not(.nhl-light) .lx-dl-actions a.primary{
  background:#f0d78c;color:#121826;border-color:#f0d78c;
}

.lx-tracks{
  display:grid;gap:.4rem;
  max-height:min(52vh, 520px);
  overflow-y:auto;overscroll-behavior:contain;
  padding-right:.1rem;
  scrollbar-width:thin;
}
.lx-track-row{display:grid;grid-template-columns:1fr auto;gap:.4rem;align-items:stretch}
.lx-track-dl{
  display:grid;place-items:center;min-width:44px;min-height:52px;border-radius:12px;
  text-decoration:none;font-weight:800;color:#163a74;
  border:1px solid rgba(18,24,38,.08);background:#fff;
}
html:not([data-theme="light"]) .lx-page:not(.nhl-light) .lx-track-dl{
  background:rgba(255,255,255,.04);border-color:var(--line-soft);color:#f0d78c;
}
.lx-track-row.is-on .lx-track-dl{border-color:#163a74;background:#eef4ff}
html:not([data-theme="light"]) .lx-page:not(.nhl-light) .lx-track-row.is-on .lx-track-dl{
  background:rgba(22,58,116,.35);
}
.lx-track{
  display:grid;grid-template-columns:auto 1fr auto;gap:.75rem;align-items:center;
  padding:.85rem .9rem;border-radius:12px;border:1px solid rgba(18,24,38,.08);background:#fff;
  cursor:pointer;text-align:left;width:100%;font:inherit;color:inherit;
  min-height:52px;-webkit-tap-highlight-color:transparent;
}
html:not([data-theme="light"]) .lx-page:not(.nhl-light) .lx-track{
  background:rgba(255,255,255,.04);border-color:var(--line-soft);color:var(--text);
}
.lx-track:hover,.lx-track:focus-visible{border-color:#163a74;outline:none}
.lx-track.is-on{border-color:#163a74;background:#eef4ff}
html:not([data-theme="light"]) .lx-page:not(.nhl-light) .lx-track.is-on{background:rgba(22,58,116,.35)}
.lx-track .n{font-family:var(--display);font-size:1.05rem;color:#163a74;min-width:1.5rem}
html:not([data-theme="light"]) .lx-page:not(.nhl-light) .lx-track .n{color:#f0d78c}
.lx-track .lbl{font-weight:700;font-size:.88rem}
.lx-track .voice{font-size:.72rem;color:#8a93a3;margin-top:.15rem}
.lx-track .dur{font-size:.68rem;font-weight:800;color:#8a93a3;letter-spacing:.06em}
.lx-note{font-size:.78rem;color:#5c6473;margin:1.25rem 0 0;line-height:1.45}
.lx-note a{color:#163a74}
html:not([data-theme="light"]) .lx-page:not(.nhl-light) .lx-note{color:var(--muted)}
html:not([data-theme="light"]) .lx-page:not(.nhl-light) .lx-note a{color:#f0d78c}

/* Sticky mobile dock — always on thumb zone */
.lx-dock{
  position:fixed;left:0;right:0;bottom:0;z-index:86;
  padding:.65rem max(.85rem, 4vw) calc(.7rem + env(safe-area-inset-bottom));
  background:rgba(10,22,44,.94);backdrop-filter:blur(16px);
  border-top:1px solid rgba(240,215,140,.28);
  color:#fff;display:grid;gap:.45rem;
  box-shadow:0 -12px 32px rgba(0,0,0,.28);
}
.lx-dock-row{display:grid;grid-template-columns:1fr auto;gap:.75rem;align-items:center}
.lx-dock .ep{min-width:0}
.lx-dock .ep .show{font-size:.58rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#f0d78c}
.lx-dock .ep .ttl{
  font-family:var(--display);font-size:.95rem;letter-spacing:.02em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:.1rem 0;
}
.lx-dock .ep .sub{font-size:.72rem;color:rgba(238,243,250,.65);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lx-dock .ep .xp{
  margin-top:.2rem;font-size:.62rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  color:rgba(240,215,140,.9);
}
.lx-dock-farm{
  display:flex;flex-wrap:wrap;gap:.35rem;justify-content:flex-start;
}
.lx-dock-farm a{
  display:inline-flex;align-items:center;min-height:36px;padding:.35rem .65rem;border-radius:999px;
  font-size:.58rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;
  color:#f0d78c;border:1px solid rgba(240,215,140,.35);background:rgba(255,255,255,.06);
}
.lx-dock-btns{display:flex;gap:.4rem;align-items:center}
.lx-dock-btns button{
  width:44px;height:44px;border-radius:999px;border:0;cursor:pointer;
  background:rgba(255,255,255,.1);color:#fff;font-size:1rem;line-height:1;
  display:grid;place-items:center;-webkit-tap-highlight-color:transparent;
}
.lx-dock-btns button.primary{background:#f0d78c;color:#121826;width:52px;height:52px;font-size:1.15rem}
.lx-dock .prog{
  height:6px;border-radius:999px;background:rgba(255,255,255,.16);overflow:hidden;cursor:pointer;
}
.lx-dock .prog > i{display:block;height:100%;width:0;background:#f0d78c;pointer-events:none}

/* Keep EQ / Pucky clear of dock */
.lx-page .av-toggle.av-float,
.lx-page body > .av-toggle,
body.lx-page > .av-toggle{
  bottom:calc(5.6rem + env(safe-area-inset-bottom)) !important;
}
body.lx-page .pgb-support-fab,
body.lx-page .pgb-pucky-bubble{
  bottom:calc(7.4rem + env(safe-area-inset-bottom)) !important;
}
.lx-page .av-toggle.av-float,
body.lx-page > .av-toggle{
  bottom:calc(7.4rem + env(safe-area-inset-bottom)) !important;
}
body.lx-page{padding-bottom:calc(7.2rem + env(safe-area-inset-bottom))}

@media(min-width:900px){
  .lx-wrap{padding-bottom:4rem}
  .lx-dock{display:none}
  .lx-page .av-toggle.av-float,
  body.lx-page > .av-toggle{
    bottom:max(1.15rem, env(safe-area-inset-bottom)) !important;
  }
}

/* XP toast — Expansion farm feedback */
.lx-xp{
  position:fixed;left:50%;bottom:calc(6.4rem + env(safe-area-inset-bottom));
  transform:translateX(-50%) translateY(12px);z-index:90;
  padding:.65rem 1rem;border-radius:999px;
  background:rgba(10,22,44,.94);border:1px solid rgba(240,215,140,.45);
  color:#f0d78c;font-size:.78rem;font-weight:800;letter-spacing:.06em;
  opacity:0;pointer-events:none;transition:opacity .25s, transform .25s;
  white-space:nowrap;max-width:92vw;
}
.lx-xp.is-on{opacity:1;transform:translateX(-50%) translateY(0)}
@media(min-width:900px){
  .lx-xp{bottom:1.5rem}
}
.lx-farm{
  display:flex;flex-wrap:wrap;gap:.45rem;align-items:center;
  margin:0 0 1rem;padding:.75rem .9rem;border-radius:12px;
  background:linear-gradient(145deg,#0b1220,#163a74);color:#fff;
  font-size:.78rem;line-height:1.35;
}
.lx-farm strong{color:#f0d78c}
.lx-farm a{color:#f0d78c;font-weight:800}