/* PASS 93 — VISUAL COHERENCE RESCUE
   CSS-only visual correction for the public homepage.
   No player internals, audio, PayPal, Worker, builder, upload logic, D1 or R2 logic changed.
   Goal: one premium broadcast language across dark and light themes. */

/* ---------- Shared premium shell ---------- */
:root{
  --p93-surface:#071019;
  --p93-surface-2:#0a1621;
  --p93-surface-3:#0d1b27;
  --p93-line:rgba(161,210,230,.14);
  --p93-ink:#f5fbff;
  --p93-muted:#91a6b5;
  --p93-soft:#68889a;
  --p93-shadow:0 24px 70px rgba(0,0,0,.34);
}

/* Light themes were visually splitting the homepage in half.
   Keep the public broadcast stage dark/premium while the theme accent still changes. */
body[data-theme] .topbar{
  min-height:64px!important;
  height:64px!important;
  background:rgba(5,12,18,.91)!important;
  border-bottom:1px solid rgba(180,220,235,.12)!important;
  box-shadow:0 10px 30px rgba(0,0,0,.20)!important;
  color:var(--p93-ink)!important;
}
body[data-theme] .topbar .brand-copy strong,
body[data-theme] .topbar .nav,
body[data-theme] .topbar .nav a,
body[data-theme] .topbar .nav button,
body[data-theme] .topbar .ghost-pill,
body[data-theme] .topbar .theme-pill{color:var(--p93-ink)!important}
body[data-theme] .topbar .brand-copy small{color:#7fa0af!important}
body[data-theme] .topbar .ghost-pill,
body[data-theme] .topbar .theme-pill{
  background:rgba(255,255,255,.035)!important;
  border-color:rgba(185,220,235,.14)!important;
  box-shadow:none!important;
}
body[data-theme] .topbar .brand-mark{
  width:42px!important;height:42px!important;border-radius:13px!important;
  box-shadow:0 8px 24px color-mix(in srgb,var(--a1) 17%,transparent)!important;
}

/* ---------- Hero / stage ---------- */
@media (min-width:1241px){
  .hero.section-shell{
    width:min(1540px,calc(100vw - 44px))!important;
    grid-template-columns:minmax(470px,.92fr) minmax(620px,1.08fr)!important;
    column-gap:18px!important;
    row-gap:12px!important;
    padding-top:20px!important;
    padding-bottom:24px!important;
  }
  .hero.section-shell::after{
    background:
      linear-gradient(90deg,rgba(2,7,11,.66),rgba(2,7,11,.26) 48%,rgba(2,7,11,.46)),
      linear-gradient(180deg,rgba(2,7,11,.10),rgba(2,7,11,.32) 65%,rgba(2,7,11,.70)),
      radial-gradient(circle at 70% 24%,color-mix(in srgb,var(--a1) 10%,transparent),transparent 35%)!important;
  }
  .hero-transmit-card,
  .hero-copy{
    background:linear-gradient(180deg,rgba(6,15,23,.93),rgba(5,12,18,.95))!important;
    border-color:var(--p93-line)!important;
    box-shadow:var(--p93-shadow)!important;
    backdrop-filter:blur(18px) saturate(125%)!important;
  }
  .hero-transmit-card{padding:12px!important;border-radius:18px!important}
  .hero-transmit-card .cinema{height:214px!important;border-radius:13px!important}
  .hero-transmit-card .hero-radio-top h2{font-size:17px!important;color:var(--p93-ink)!important}
  .hero-transmit-card .hero-radio-top small{color:#6d95a8!important;letter-spacing:.13em!important}

  .hero-copy{padding:17px 18px 15px!important;border-radius:18px!important}
  .hero-copy .eyebrow{color:#8fddeb!important;border-color:rgba(81,214,236,.20)!important;background:rgba(81,214,236,.055)!important}
  .hero-copy h1,.hero h1{font-size:clamp(25px,1.72vw,31px)!important;color:var(--p93-ink)!important;margin:10px 0 8px!important}
  .hero-copy .hero-lede{font-size:10px!important;color:#8da4b5!important;line-height:1.45!important}
  .hero-copy .hero-actions button{font-size:8px!important;min-height:31px!important}
  .hero-copy .hero-split article,
  .hero-copy .signal-ribbon>div{
    background:rgba(255,255,255,.022)!important;
    border:1px solid rgba(175,215,232,.09)!important;
  }
  .hero-copy .hero-split strong{color:#dff6ff!important}
  .hero-copy .hero-split p,
  .hero-copy .signal-ribbon span{color:#7692a2!important}

  /* Player remains untouched internally — only stage scale/placement. */
  .hero-player-stage{
    width:min(660px,100%)!important;
    justify-self:end!important;
    margin-top:2px!important;
    filter:drop-shadow(0 24px 45px rgba(0,0,0,.28))!important;
  }
  .hero-player-stage .ai1-ref-radio{max-width:660px!important}
}

/* ---------- Master Control: stop light-theme bleed ---------- */
#control-deck{
  color:var(--p93-ink)!important;
  background:
    radial-gradient(circle at 80% -20%,color-mix(in srgb,var(--a1) 8%,transparent),transparent 38%),
    linear-gradient(180deg,rgba(6,14,21,.96),rgba(4,10,16,.98))!important;
  border-color:var(--p93-line)!important;
  box-shadow:0 20px 60px rgba(0,0,0,.30)!important;
}
#control-deck .deck-head h2,
#control-deck .deck-clock span,
#control-deck .console-strip-head b,
#control-deck .console-readout strong,
#control-deck .route b{color:var(--p93-ink)!important}
#control-deck .deck-head .mini-label,
#control-deck .deck-clock small,
#control-deck .console-strip-head,
#control-deck .console-readout small,
#control-deck .console-readout span,
#control-deck .route small,
#control-deck .route-meter small{color:var(--p93-soft)!important}
#control-deck .console-channel,
#control-deck .console-eq,
#control-deck .console-routing{
  background:linear-gradient(180deg,rgba(11,24,34,.92),rgba(7,16,24,.96))!important;
  border:1px solid rgba(167,210,226,.11)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}
#control-deck .big-spectrum,
#control-deck .console-readout,
#control-deck .eq-rack label,
#control-deck .route,
#control-deck .preset-row button{
  background:rgba(2,8,13,.48)!important;
  border-color:rgba(166,208,225,.10)!important;
  color:var(--p93-ink)!important;
}
#control-deck .route.active{
  background:color-mix(in srgb,var(--a1) 7%,rgba(3,11,16,.70))!important;
  border-color:color-mix(in srgb,var(--a1) 30%,rgba(166,208,225,.10))!important;
}
#control-deck .transport:not(.active),
#control-deck .preset-row button{
  color:#b8cbd5!important;
}
#control-deck .deck-footer span{
  background:rgba(255,255,255,.025)!important;
  border-color:rgba(166,208,225,.09)!important;
  color:#7592a2!important;
}

@media (min-width:1241px){
  #control-deck{padding:11px 13px 10px!important;border-radius:19px!important;margin-top:0!important}
  #control-deck .deck-head{margin-bottom:7px!important}
  #control-deck .deck-head h2{font-size:22px!important}
  #control-deck .deck-clock span{font-size:16px!important}
  #control-deck .deck-grid{grid-template-columns:1.18fr .82fr .82fr!important;gap:8px!important}
  #control-deck .console-channel,#control-deck .console-eq,#control-deck .console-routing{padding:9px!important;border-radius:14px!important}
  #control-deck .big-spectrum{height:88px!important;border-radius:10px!important;padding:7px!important}
  #control-deck .eq-rack{height:152px!important;gap:5px!important}
  #control-deck .eq-rack input{height:94px!important}
  #control-deck .route{padding:6px 7px!important}
  #control-deck .transport{min-height:25px!important;padding:4px 9px!important}
  #control-deck .console-readout{padding:7px 8px!important}
  #control-deck .deck-footer{margin-top:6px!important}
}

/* ---------- Ticker: same visual world, no white stripe ---------- */
body[data-theme] .ticker-wrap{
  margin:0!important;
  background:rgba(5,13,19,.96)!important;
  border-top:1px solid rgba(166,208,225,.10)!important;
  border-bottom:1px solid rgba(166,208,225,.10)!important;
  color:var(--p93-ink)!important;
}
body[data-theme] .ticker{padding:10px 0!important}
body[data-theme] .ticker span{font-size:9px!important;color:#668696!important}
body[data-theme] .ticker b{color:#c7dce6!important}

/* ---------- Featured video: no giant white slab ---------- */
body[data-theme] .ai1-video-feature{
  width:min(1180px,calc(100% - 34px))!important;
  padding:18px 0 24px!important;
}
body[data-theme] .ai1-video-panel{
  padding:14px!important;
  border-radius:20px!important;
  background:linear-gradient(180deg,rgba(8,18,27,.95),rgba(5,12,19,.98))!important;
  border:1px solid rgba(166,208,225,.11)!important;
  box-shadow:0 20px 55px rgba(0,0,0,.25)!important;
  color:var(--p93-ink)!important;
}
body[data-theme] .ai1-video-head{margin-bottom:10px!important}
body[data-theme] .ai1-video-head h2{font-size:24px!important;color:var(--p93-ink)!important}
body[data-theme] .ai1-video-head p{font-size:10px!important;color:#7794a4!important}
body[data-theme] .ai1-video-frame{
  width:min(900px,100%)!important;
  margin:0 auto!important;
  border-radius:14px!important;
  border:1px solid rgba(166,208,225,.10)!important;
  box-shadow:0 16px 42px rgba(0,0,0,.28)!important;
}

/* ---------- Tablet/mobile coherence ---------- */
@media (max-width:1240px){
  body[data-theme] .hero-transmit-card,
  body[data-theme] .hero-copy,
  body[data-theme] #control-deck,
  body[data-theme] .ai1-video-panel{
    background:linear-gradient(180deg,rgba(7,17,25,.95),rgba(4,11,17,.98))!important;
    color:var(--p93-ink)!important;
    border-color:rgba(166,208,225,.11)!important;
  }
  body[data-theme] #control-deck .console-channel,
  body[data-theme] #control-deck .console-eq,
  body[data-theme] #control-deck .console-routing{
    background:linear-gradient(180deg,rgba(11,24,34,.94),rgba(7,16,24,.97))!important;
  }
}
@media (max-width:700px){
  body[data-theme] .topbar{height:auto!important;min-height:60px!important;background:rgba(5,12,18,.96)!important}
  .hero.section-shell{gap:8px!important}
  .hero-transmit-card .cinema{min-height:205px!important}
  .hero-copy h1,.hero h1{font-size:22px!important}
  body[data-theme] .ai1-video-feature{width:min(100% - 20px,1180px)!important;padding-top:10px!important}
  body[data-theme] .ai1-video-head h2{font-size:20px!important}
}
