/* Live Home: one spacious media stage and one quiet, useful sidebar.
   Offline Home is unaffected; this file loads after the shared styles. */
html.is-live body.home-page .hero{background:#080d10}
html.is-live body.home-page .hero-bg{opacity:.2;filter:saturate(.5) brightness(.45)}
html.is-live body.home-page .hero-content{
  width:min(1380px,calc(100% - 48px));max-width:none;
  min-height:0;padding:80px 0 22px;
  display:grid;grid-template-columns:minmax(0,1fr);align-content:start;justify-items:stretch
}
html.is-live body.home-page #hero-takeover{
  display:grid;width:100%;max-width:none;min-width:0;justify-self:stretch;
  grid-template-columns:minmax(0,1fr);gap:9px 24px;align-items:start;
  position:relative;padding:22px 24px;border:1px solid rgba(130,255,255,.19);border-radius:20px;
  background:radial-gradient(circle at 84% 0,rgba(130,255,255,.075),transparent 34%),linear-gradient(150deg,#111c20,#080d10);
  box-shadow:inset 0 1px rgba(255,255,255,.045),0 30px 78px -53px #000;
  animation:none
}
html.is-live body.home-page #hero-takeover::before{
  content:"";position:absolute;top:0;left:24px;right:24px;height:2px;
  background:linear-gradient(90deg,#82ffff,rgba(130,255,255,.18) 62%,transparent);
  pointer-events:none
}
html.is-live body.home-page .ht-label{
  display:flex;align-items:center;gap:8px;min-width:0;margin:0;
  justify-self:start;min-height:26px;padding:5px 10px;
  border:1px solid rgba(255,67,87,.3);border-radius:999px;
  background:rgba(255,31,55,.10);color:#ffafb6;
  font-size:.58rem;font-weight:850;letter-spacing:.12em
}
html.is-live body.home-page .ht-head{
  max-width:100%;min-width:0;margin:0;padding:0;overflow:visible;
  color:#f3fafa;font-size:clamp(1.85rem,2.8vw,2.8rem);
  line-height:1.08;letter-spacing:-.046em;text-wrap:balance;overflow-wrap:anywhere
}
html.is-live body.home-page .ht-head.is-long-title{font-size:clamp(1.65rem,2.35vw,2.3rem)}
html.is-live body.home-page .ht-head.is-very-long-title{font-size:clamp(1.48rem,2vw,1.95rem)}
html.is-live body.home-page .ht-sub{
  max-width:100%;margin:0 0 6px;color:#91a8aa;
  font-size:.77rem;line-height:1.45
}
html.is-live body.home-page .ht-player-stack{
  display:block;min-width:0;align-self:start;margin:0
}
html.is-live body.home-page .ht-player{
  width:100%;max-width:none;aspect-ratio:16/9;overflow:hidden;
  border:1px solid rgba(130,255,255,.28);border-radius:13px;
  background:#030708;box-shadow:0 0 0 1px rgba(130,255,255,.045),0 30px 78px -52px rgba(0,20,25,.95)
}
html.is-live body.home-page .ht-video-controls{
  display:grid;grid-template-columns:minmax(0,1fr);gap:15px;
  min-width:0;align-self:start;margin:0;padding:0
}
html.is-live body.home-page .ht-actions{
  display:flex;align-items:center;gap:9px;min-width:0
}
html.is-live body.home-page .ht-actions .btn{
  justify-content:center;min-width:0;min-height:42px;padding:10px 13px;
  font-size:.73rem;white-space:normal
}
html.is-live body.home-page .ht-actions .btn-live{
  flex:1 1 auto;border-color:rgba(255,113,126,.38);
  background:linear-gradient(130deg,#ee213b,#c91630);
  box-shadow:0 10px 28px -17px rgba(255,40,65,.8),inset 0 1px rgba(255,255,255,.15)
}
html.is-live body.home-page .ht-watch-btn{
  flex:0 0 auto;border:1px solid rgba(255,255,255,.08);
  border-radius:9px;background:rgba(255,255,255,.025);
  color:#b7c9ca;box-shadow:none
}
html.is-live body.home-page .ht-watch-btn:hover{
  border-color:rgba(130,255,255,.2);
  background:rgba(130,255,255,.085);color:#fff
}
html.is-live body.home-page .ht-simulcast{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:5px;min-width:0;margin:0
}
html.is-live body.home-page .ht-sim-label{
  grid-column:1/-1;display:flex;align-items:center;gap:7px;
  margin:0 0 6px;color:#b4f7f7;font-size:.59rem;font-weight:850;letter-spacing:.075em
}
html.is-live body.home-page .ht-platform-btn{
  display:flex;grid-column:auto;align-items:center;justify-content:flex-start;
  gap:7px;min-width:0;min-height:35px;padding:6px 7px;
  border:1px solid rgba(130,255,255,.085);border-radius:8px;
  background:rgba(130,255,255,.022);color:#d9e6e7;
  font-size:.64rem;box-shadow:none
}
html.is-live body.home-page .ht-platform-btn:hover{
  border-color:rgba(130,255,255,.15);
  background:rgba(130,255,255,.055);color:#fff
}
html.is-live body.home-page .ht-platform-btn i{flex:none;width:14px;height:14px}
html.is-live body.home-page .ht-platform-btn b{display:none}
html.is-live body.home-page .ht-explore{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px 8px;align-self:start;min-width:0;
  width:100%;max-width:none;margin:0;padding:12px 0 0;
  border-top:1px solid rgba(255,255,255,.08)
}
html.is-live body.home-page .ht-explore-title{
  grid-column:1/-1;margin:0 0 2px;color:#90cacc;
  font-size:.53rem;font-weight:850;letter-spacing:.13em
}
html.is-live body.home-page .ht-explore-link{
  display:flex;align-items:center;gap:9px;min-width:0;min-height:40px;
  padding:7px 8px;border:1px solid rgba(130,255,255,.08);border-radius:9px;
  background:rgba(130,255,255,.027);color:#d0e1e2;box-shadow:none
}
html.is-live body.home-page .ht-explore-link:hover{
  transform:none;border-color:rgba(130,255,255,.26);background:rgba(130,255,255,.08);color:#fff
}
html.is-live body.home-page .ht-explore-icon{
  flex:none;display:grid;place-items:center;
  width:22px;height:22px;border:0;border-radius:6px;
  background:rgba(130,255,255,.05)
}
html.is-live body.home-page .ht-explore-icon i{width:13px;height:13px;color:#82ffff}
html.is-live body.home-page .ht-explore-primary .ht-explore-icon i{color:#b1b9ff}
html.is-live body.home-page .ht-explore-copy{min-width:0}
html.is-live body.home-page .ht-explore-copy strong{
  display:block;min-width:0;color:inherit;font-size:.7rem;
  white-space:normal;overflow-wrap:anywhere
}
html.is-live body.home-page .ht-explore-copy small{display:none}

/* Three compact, visible tools keep the sidebar useful without six wide CTAs. */
html.is-live body.home-page .ht-trackers{
  display:block;align-self:end;min-width:0;width:100%;max-width:none;
  margin:0;padding:12px 0 0;overflow:visible;
  border:0;border-top:1px solid rgba(255,255,255,.08);
  border-radius:0;background:none;box-shadow:none
}
html.is-live body.home-page .ht-trackers-head{
  display:flex;align-items:center;margin:0 0 5px;padding:0;
  border:0;color:#b3f1f1;font-size:.56rem;
  font-weight:850;letter-spacing:.13em
}
html.is-live body.home-page .ht-tracker-list{
  display:grid;grid-template-columns:minmax(0,1fr);
  gap:0;min-width:0;margin:0
}
html.is-live body.home-page .ht-tracker-card{
  display:grid;grid-template-columns:24px minmax(0,1fr) auto;
  grid-template-rows:auto;align-items:center;gap:7px;min-width:0;min-height:57px;
  padding:9px 7px;border:0;border-radius:9px;background:none;box-shadow:none
}
html.is-live body.home-page .ht-tracker-card+.ht-tracker-card{
  border:0;border-top:1px solid rgba(255,255,255,.055)
}
html.is-live body.home-page .ht-tracker-card:nth-child(-n+2){
  min-height:72px;margin:2px 0;
  border:1px solid rgba(130,255,255,.16);
  background:linear-gradient(115deg,rgba(130,255,255,.08),rgba(130,255,255,.018) 78%)
}
html.is-live body.home-page .ht-tracker-card:nth-child(-n+2) .ht-tracker-icon{
  background:rgba(130,255,255,.13)
}
html.is-live body.home-page .ht-tracker-card:nth-child(-n+2) .ht-tracker-page{
  border-color:rgba(130,255,255,.26);background:rgba(130,255,255,.10);color:#baffff
}
html.is-live body.home-page .ht-tracker-card::before{display:none}
html.is-live body.home-page .ht-tracker-icon{
  display:grid;place-items:center;width:24px;height:24px;
  border:0;border-radius:6px;background:rgba(130,255,255,.055)
}
html.is-live body.home-page .ht-tracker-icon i{width:13px;height:13px;color:#82ffff}
html.is-live body.home-page .ht-tracker-copy{
  display:grid;gap:3px;min-width:0
}
html.is-live body.home-page .ht-tracker-copy strong{
  color:#edf8f8;font-size:.72rem;line-height:1.22;white-space:normal
}
html.is-live body.home-page .ht-tracker-copy small{
  color:#98afb1;font-size:.59rem;line-height:1.3;white-space:normal
}
html.is-live body.home-page .ht-tracker-actions{
  grid-column:3;grid-row:1;display:flex;gap:4px;
  align-items:center;min-width:0
}
html.is-live body.home-page .ht-tracker-action{
  display:flex;align-items:center;justify-content:center;gap:4px;
  min-width:0;min-height:30px;padding:5px 6px;
  border:1px solid rgba(130,255,255,.1);border-radius:7px;
  background:rgba(130,255,255,.035);color:#d0e3e4;
  font-size:.53rem;text-decoration:none
}
html.is-live body.home-page .ht-tracker-action i{width:11px;height:11px}
html.is-live body.home-page .ht-tracker-page i{color:#82ffff}
html.is-live body.home-page .ht-tracker-channel i{color:#aab5ff}
html.is-live body.home-page .ht-tracker-action:hover{
  border-color:rgba(130,255,255,.18);color:#fff
}
html.is-live body.home-page .ht-platform-btn:focus-visible,
html.is-live body.home-page .ht-explore-link:focus-visible,
html.is-live body.home-page .ht-tracker-action:focus-visible{
  outline:2px solid #82ffff;outline-offset:2px
}
@media(min-width:1360px){
  html.is-live body.home-page #hero-takeover{
    grid-template-columns:minmax(0,1.78fr) minmax(355px,.83fr);
    grid-template-areas:"label label" "head head" "sub sub"
                        "video controls" "video links" "video trackers";
    grid-template-rows:auto auto auto minmax(0,1fr) auto auto
  }
  html.is-live body.home-page .ht-player-stack{grid-area:video}
  html.is-live body.home-page .ht-video-controls{grid-area:controls}
  html.is-live body.home-page .ht-explore{grid-area:links}
  html.is-live body.home-page .ht-trackers{grid-area:trackers}
}
@media(max-width:1359px){
  html.is-live body.home-page .hero-content{
    width:min(100% - 40px,1000px);padding-top:76px
  }
  html.is-live body.home-page #hero-takeover{
    grid-template-columns:minmax(0,1fr);
    grid-template-areas:"label" "head" "sub" "video" "controls" "links" "trackers";
    gap:11px
  }
  html.is-live body.home-page .ht-player-stack{grid-area:video}
  html.is-live body.home-page .ht-video-controls{grid-area:controls}
  html.is-live body.home-page .ht-explore{grid-area:links;grid-template-columns:repeat(4,minmax(0,1fr))}
  html.is-live body.home-page .ht-trackers{grid-area:trackers}
  html.is-live body.home-page .ht-tracker-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  html.is-live body.home-page .ht-tracker-card{
    grid-template-columns:24px minmax(0,1fr);
    grid-template-rows:auto auto;border:1px solid rgba(255,255,255,.07);
    border-radius:10px;padding:10px
  }
  html.is-live body.home-page .ht-tracker-actions{grid-column:1/-1;grid-row:2}
}
@media(max-width:979px){
  html.is-live body.home-page .hero-content{
    width:min(100% - 32px,720px);padding-top:82px
  }
  html.is-live body.home-page #hero-takeover{
    grid-template-areas:"label" "head" "sub" "video" "controls";
    padding:14px;gap:9px
  }
  html.is-live body.home-page .ht-head{font-size:clamp(1.6rem,6vw,2.2rem)}
  html.is-live body.home-page .ht-video-controls{gap:10px}
  html.is-live body.home-page .ht-explore,
  html.is-live body.home-page .ht-trackers{display:none}
}
@media(max-width:420px){
  html.is-live body.home-page .ht-simulcast{grid-template-columns:repeat(2,minmax(0,1fr))}
  html.is-live body.home-page .ht-actions{display:grid;grid-template-columns:minmax(0,1fr)}
  html.is-live body.home-page .ht-actions .btn{width:100%}
}