/* ============================================================
   Billboard Stream — CSS portado del handoff de diseño (Claude Design).
   Solo componentes específicos del stream. El shell del sitio
   (header/ticker/nav/footer/fuentes) ya está cargado aparte.
   ============================================================ */

/* Fallbacks para tokens que el diseño usa y el shell puede no tener.
   No piso los que el shell ya define (usa el valor del shell si existe). */
:root{
  --live:#dc2626;
  --line-strong:rgba(255,255,255,0.16);
  --scrim:rgba(0,0,0,0.6);
  --ease:cubic-bezier(.2,.8,.2,1);
  --maxw:1240px;
  --font-display:'Bebas Neue',sans-serif;
  --font-body:'Space Grotesk',sans-serif;
  --font-mono:'JetBrains Mono',monospace;
}
:root[data-theme="light"]{ --line-strong:rgba(0,0,0,0.16); }

/* ============================================================
   Keyframes
   ============================================================ */
@keyframes tkpulse{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes livepulse{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes floatup{
  0%{transform:translateY(0);opacity:0}
  15%{opacity:1}
  100%{transform:translateY(-200px);opacity:0}
}
@keyframes reactpop{0%{transform:scale(1)}45%{transform:scale(1.4)}100%{transform:scale(1)}}
@keyframes cmtin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@keyframes evtin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes oain{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

/* ============================================================
   Primitivos / utilidades de stream
   ============================================================ */
.bbz-eyebrow{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted);font-weight:500;
  display:inline-flex;align-items:center;gap:7px;
}
.bbz-eyebrow .dot{width:6px;height:6px;border-radius:999px;background:var(--accent)}

.bbz-btn{
  font-family:var(--font-body);font-weight:600;font-size:13px;
  border-radius:999px;border:1px solid var(--line-strong);
  background:transparent;color:var(--ink);padding:11px 20px;
  display:inline-flex;align-items:center;gap:8px;transition:.18s var(--ease);
  white-space:nowrap;
}
.bbz-btn:hover{border-color:var(--ink)}
.bbz-btn:active{transform:scale(.98)}
.bbz-btn--accent{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.bbz-btn--accent:hover{filter:brightness(1.08)}
.bbz-btn--sm{padding:8px 14px;font-size:12px}

.bbz-section-tag{display:flex;align-items:center;gap:12px;margin:0 0 16px}
.bbz-section-tag .rule{height:1px;flex:1;background:var(--line)}

/* ============================================================
   Player
   ============================================================ */
.bbz-live__player{
  position:relative;background:#000;border-radius:18px;overflow:hidden;
  display:flex;align-items:center;justify-content:center;isolation:isolate;
}
.bbz-live__stage{
  position:relative;width:100%;
  background:
    radial-gradient(120% 80% at 25% 15%, rgba(124,58,237,.45), transparent 55%),
    radial-gradient(110% 90% at 80% 25%, rgba(0,255,154,.30), transparent 50%),
    radial-gradient(140% 120% at 50% 110%, rgba(255,45,135,.40), transparent 60%),
    #0c0c12;
  aspect-ratio:16/9;
}
.bbz-live__player[data-ratio="9:16"] .bbz-live__stage{aspect-ratio:9/16;width:auto;height:min(74vh,660px)}
.bbz-live__stage::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.78) 0%,rgba(0,0,0,.15) 42%,transparent 70%)}

.bbz-live__poster-note{
  position:absolute;inset:0;display:grid;place-items:center;z-index:0;
  font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;color:rgba(255,255,255,.28);
  text-transform:uppercase;
}

.bbz-live__play{
  position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);
  width:84px;height:84px;border-radius:999px;
  background:rgba(255,255,255,.14);backdrop-filter:blur(6px);
  color:#fff;font-size:30px;display:grid;place-items:center;transition:.18s var(--ease);
  border:1.5px solid rgba(255,255,255,.5);
}
.bbz-live__play:hover{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);transform:translate(-50%,-50%) scale(1.05)}
.bbz-live__play.is-playing{opacity:0;pointer-events:none}

.bbz-live__badge{
  position:absolute;z-index:4;top:16px;left:16px;
  display:inline-flex;align-items:center;gap:7px;
  background:var(--live);color:#fff;font-family:var(--font-mono);font-weight:800;
  font-size:11px;letter-spacing:.06em;padding:6px 11px;border-radius:8px;
}
.bbz-live__badge i{width:8px;height:8px;border-radius:999px;background:#fff;animation:livepulse 1.3s infinite}
.bbz-live__badge--replay{background:var(--surf2);color:var(--accent);border:1px solid var(--accent)}
.bbz-live__badge--replay i{background:var(--accent);animation:none}

.bbz-live__platform{
  position:absolute;z-index:4;top:16px;right:16px;
  display:inline-flex;align-items:center;gap:7px;
  background:rgba(10,10,12,.66);backdrop-filter:blur(6px);color:#fff;
  font-family:var(--font-mono);font-weight:700;font-size:10px;letter-spacing:.06em;
  padding:6px 11px 6px 8px;border-radius:999px;border:1px solid rgba(255,255,255,.16);
}
.bbz-live__platform svg{width:15px;height:15px;display:block}

.bbz-live__viewers{
  position:absolute;z-index:4;left:16px;bottom:16px;
  display:inline-flex;align-items:center;gap:7px;
  font-family:var(--font-mono);font-size:11px;font-weight:600;color:#fff;
  background:rgba(10,10,12,.5);backdrop-filter:blur(4px);
  padding:6px 11px;border-radius:999px;border:1px solid rgba(255,255,255,.14);
}
.bbz-live__viewers i{width:7px;height:7px;border-radius:999px;background:var(--live)}

.bbz-live__floats{position:absolute;z-index:5;inset:0 0 0 auto;width:120px;right:18px;bottom:0;pointer-events:none;overflow:hidden}
.bbz-float{position:absolute;bottom:8px;font-size:30px;will-change:transform,opacity;animation:floatup 2.6s var(--ease) forwards}

.bbz-live__brand-overlay{position:absolute;z-index:4;inset:0;pointer-events:none;display:none}
.bbz-live__player.is-branded .bbz-live__brand-overlay{display:block}
.bbz-live__brand-frame{position:absolute;inset:0;border:3px solid var(--accent);border-radius:18px}
.bbz-live__brand-corner{
  position:absolute;left:16px;top:54px;display:inline-flex;align-items:center;gap:8px;
  background:rgba(10,10,12,.62);backdrop-filter:blur(6px);padding:6px 12px;border-radius:10px;
  font-family:var(--font-mono);font-size:9px;letter-spacing:.1em;color:#fff;border:1px solid rgba(255,255,255,.14);
}
.bbz-live__brand-corner b{font-family:var(--font-display);font-size:18px;letter-spacing:.02em;line-height:1;color:var(--accent2)}
.bbz-live__player[data-ratio="9:16"] .bbz-live__brand-corner{top:auto;bottom:54px}

.bbz-live__meta{margin-top:18px}
.bbz-live__title{font-family:var(--font-display);font-size:clamp(34px,4.4vw,56px);line-height:.9;letter-spacing:.01em;text-transform:uppercase;margin:8px 0 0}
.bbz-live__dek{color:var(--muted);font-size:15px;max-width:62ch;margin:10px 0 0}
.bbz-live__present{margin-top:12px;display:inline-flex;align-items:center;gap:9px;font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;color:var(--muted);text-transform:uppercase}
.bbz-live__present b{font-family:var(--font-display);font-size:19px;letter-spacing:.02em;color:var(--ink)}

/* ============================================================
   Reactions
   ============================================================ */
.bbz-live__reactions{display:flex;align-items:center;gap:10px;margin-top:18px;flex-wrap:wrap}
.bbz-react{
  display:inline-flex;align-items:center;gap:8px;background:var(--surf);
  border:1px solid var(--line);border-radius:999px;padding:8px 14px 8px 12px;
  font-family:var(--font-mono);font-size:12px;font-weight:600;color:var(--ink);transition:.15s var(--ease);
}
.bbz-react .emo{font-size:18px;line-height:1;transition:transform .15s var(--ease)}
.bbz-react:hover{border-color:var(--line-strong);transform:translateY(-1px)}
.bbz-react:hover .emo{transform:scale(1.25)}
.bbz-react:active{transform:scale(.95)}
.bbz-react .cnt{color:var(--muted);min-width:14px;text-align:left}
.bbz-react.pop .emo{animation:reactpop .35s var(--ease)}
.bbz-react--brand{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,var(--surf))}

/* ============================================================
   Comments
   ============================================================ */
.bbz-live__comments{
  background:var(--surf);border:1px solid var(--line);border-radius:18px;
  display:flex;flex-direction:column;overflow:hidden;min-height:0;
}
.bbz-live__comments-head{
  display:flex;align-items:center;gap:9px;padding:15px 18px;border-bottom:1px solid var(--line);flex:0 0 auto;
}
.bbz-live__comments-head .ttl{font-family:var(--font-display);font-size:21px;letter-spacing:.02em;text-transform:uppercase;line-height:1}
.bbz-live__comments-head .cnt{margin-left:auto;font-family:var(--font-mono);font-size:10px;color:var(--muted);letter-spacing:.06em}
.bbz-live__comments-head .live-dot{width:7px;height:7px;border-radius:999px;background:var(--live);animation:livepulse 1.3s infinite}
.bbz-live__comments-list{flex:1 1 auto;overflow-y:auto;padding:14px 18px;display:flex;flex-direction:column;gap:14px;min-height:0;scrollbar-width:thin}

.bbz-cmt{display:flex;gap:10px;animation:cmtin .3s var(--ease)}
.bbz-cmt .av{width:30px;height:30px;border-radius:999px;flex:0 0 auto;display:grid;place-items:center;font-family:var(--font-mono);font-size:11px;font-weight:700;color:var(--accent-ink)}
.bbz-cmt .bd{min-width:0}
.bbz-cmt .nm{font-weight:600;font-size:12.5px;display:flex;align-items:center;gap:7px}
.bbz-cmt .nm .t{font-family:var(--font-mono);font-size:9px;color:var(--muted);font-weight:500}
.bbz-cmt .nm .mod{font-family:var(--font-mono);font-size:8px;letter-spacing:.06em;background:var(--accent);color:var(--accent-ink);padding:1px 5px;border-radius:4px;font-weight:700}
.bbz-cmt .tx{font-size:13px;color:var(--ink);margin-top:1px;word-wrap:break-word}

.bbz-live__comments-foot{flex:0 0 auto;border-top:1px solid var(--line);padding:12px}
.bbz-live__cmt-form{display:flex;gap:8px}
.bbz-live__cmt-form input{
  flex:1;background:var(--surf2);border:1px solid var(--line);border-radius:999px;
  color:var(--ink);font-family:var(--font-body);font-size:13px;padding:10px 15px;outline:none;transition:.15s;min-width:0;
}
.bbz-live__cmt-form input:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 28%,transparent)}
.bbz-live__cmt-form button{flex:0 0 auto;width:42px;height:42px;border-radius:999px;border:none;background:var(--accent);color:var(--accent-ink);font-size:17px;display:grid;place-items:center}

.bbz-live__gate{display:flex;flex-direction:column;gap:8px;align-items:stretch;text-align:center}
.bbz-live__gate p{margin:0;color:var(--muted);font-size:12.5px}

/* ============================================================
   Eventos / Trivia
   ============================================================ */
.bbz-chat-event{
  position:relative;overflow:hidden;border-radius:14px;padding:13px 14px 13px 16px;
  display:flex;flex-direction:column;gap:11px;
  border:1px solid var(--brand,var(--accent));
  background:color-mix(in srgb, var(--brand,var(--accent)) 9%, var(--surf2));
  animation:evtin .42s var(--ease);
}
.bbz-chat-event::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--brand,var(--accent))}
.bbz-evt-kicker{font-family:var(--font-mono);font-size:8px;letter-spacing:.1em;color:var(--muted);text-transform:uppercase;display:flex;align-items:center;gap:6px}
.bbz-evt-kicker i{width:6px;height:6px;border-radius:999px;background:var(--live);animation:livepulse 1.3s infinite}
.bbz-evt-head{display:flex;align-items:center;gap:8px}
.bbz-evt-mk{width:26px;height:26px;border-radius:7px;flex:0 0 auto;display:grid;place-items:center;font-family:var(--font-display);font-size:17px;line-height:1;background:var(--brand,var(--accent));color:var(--brand-ink,#0a0a0c)}
.bbz-evt-brand{font-weight:600;font-size:12.5px}
.bbz-evt-type{margin-left:auto;font-family:var(--font-mono);font-size:8px;letter-spacing:.08em;font-weight:700;text-transform:uppercase;padding:3px 9px;border-radius:999px;background:var(--brand,var(--accent));color:var(--brand-ink,#0a0a0c)}
.bbz-evt-q{font-family:var(--font-display);font-size:21px;line-height:.95;letter-spacing:.02em;text-transform:uppercase}
.bbz-evt-opts{display:flex;flex-direction:column;gap:7px}
.bbz-evt-opt{position:relative;overflow:hidden;display:flex;align-items:center;gap:10px;text-align:left;background:var(--surf);border:1px solid var(--line);border-radius:10px;padding:9px 12px;font-family:var(--font-body);font-size:13px;font-weight:500;color:var(--ink);transition:.15s var(--ease)}
.bbz-evt-opt:hover{border-color:var(--line-strong);transform:translateX(2px)}
.bbz-evt-opt .bar{position:absolute;left:0;top:0;bottom:0;width:0;background:color-mix(in srgb,var(--brand,var(--accent)) 24%,transparent);transition:width .6s var(--ease);z-index:0}
.bbz-evt-opt .lbl{position:relative;z-index:1}
.bbz-evt-opt .pct{position:relative;z-index:1;margin-left:auto;font-family:var(--font-mono);font-size:11px;color:var(--muted);opacity:0;transition:.3s}
.bbz-evt-opt.revealed .pct{opacity:1}
.bbz-evt-opt.revealed{cursor:default}
.bbz-evt-opt.correct{border-color:var(--accent)}
.bbz-evt-opt.correct .lbl::after{content:" \2713";color:var(--accent);font-weight:700}
.bbz-evt-opt.wrong{border-color:var(--live)}
.bbz-evt-foot{font-family:var(--font-mono);font-size:9px;color:var(--muted);letter-spacing:.04em;line-height:1.4}
.bbz-evt-cta{align-self:flex-start}

/* ============================================================
   Ads (slot estático + overlay)
   ============================================================ */
.bbz-live__ad{
  position:relative;border:1px dashed var(--line-strong);border-radius:14px;overflow:hidden;
  background:repeating-linear-gradient(135deg,var(--surf) 0 14px,var(--surf2) 14px 28px);
  display:grid;place-items:center;min-height:96px;
}
.bbz-live__ad-label{position:absolute;top:8px;left:10px;font-family:var(--font-mono);font-size:8px;letter-spacing:.12em;color:var(--muted);background:var(--bg);padding:2px 7px;border-radius:5px;border:1px solid var(--line)}
.bbz-live__ad-inner{text-align:center;color:var(--muted);font-family:var(--font-mono);font-size:11px;letter-spacing:.06em}
.bbz-live__ad-inner b{display:block;font-family:var(--font-display);font-size:26px;color:var(--ink);letter-spacing:.02em;margin-bottom:2px}

.bbz-live__overlay-ad{
  position:absolute;z-index:6;left:16px;right:16px;bottom:16px;
  display:flex;align-items:center;gap:11px;
  background:rgba(10,10,12,.84);backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.16);border-radius:12px;padding:9px 11px;
  animation:oain .25s var(--ease);
}
.bbz-live__player.has-overlay-ad .bbz-live__viewers{bottom:76px}
.has-overlay-ad .bbz-live__brand-corner{bottom:80px}
.bbz-live__overlay-ad .oa-mk{width:30px;height:30px;border-radius:8px;flex:0 0 auto;display:grid;place-items:center;font-family:var(--font-display);font-size:19px;line-height:1}
.bbz-live__overlay-ad .oa-bd{min-width:0;flex:1;color:#fff;font-size:12.5px;line-height:1.3;overflow:hidden}
.bbz-live__overlay-ad .oa-bd b{font-weight:700}
.bbz-live__overlay-ad .oa-tag{display:inline-block;font-family:var(--font-mono);font-size:7px;letter-spacing:.12em;color:rgba(255,255,255,.6);border:1px solid rgba(255,255,255,.25);padding:1px 5px;border-radius:4px;margin-right:7px;vertical-align:middle}
.bbz-live__overlay-ad .oa-cta{flex:0 0 auto;font-family:var(--font-body);font-weight:600;font-size:12px;background:var(--accent);color:var(--accent-ink);border:none;border-radius:999px;padding:8px 14px;white-space:nowrap}
.bbz-live__overlay-ad .oa-x{flex:0 0 auto;width:26px;height:26px;border-radius:999px;background:rgba(255,255,255,.14);border:none;color:#fff;font-size:12px}
.bbz-live__overlay-ad .oa-x:hover{background:rgba(255,255,255,.26)}

/* ============================================================
   Offline / Countdown
   ============================================================ */
.bbz-live__offline{
  position:relative;border-radius:18px;overflow:hidden;background:#000;
  display:grid;place-items:center;text-align:center;aspect-ratio:16/9;
}
.bbz-live__offline .bg{position:absolute;inset:0;background:
  radial-gradient(120% 90% at 30% 10%, rgba(124,58,237,.40), transparent 55%),
  radial-gradient(120% 90% at 80% 90%, rgba(0,255,154,.26), transparent 55%),#0c0c12}
.bbz-live__offline .bg::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.45)}
.bbz-live__offline .inner{position:relative;z-index:2;padding:24px}
.bbz-live__offline h3{font-family:var(--font-display);font-size:clamp(40px,6vw,76px);line-height:.85;letter-spacing:.02em;text-transform:uppercase;margin:10px 0 4px;color:#fff}
.bbz-live__offline .sub{color:rgba(255,255,255,.7);font-size:14px;margin-bottom:22px}
.bbz-countdown{display:inline-flex;gap:10px}
.bbz-cd-cell{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:12px;padding:12px 14px;min-width:74px;backdrop-filter:blur(4px)}
.bbz-cd-cell .n{font-family:var(--font-display);font-size:46px;line-height:.9;color:var(--accent)}
.bbz-cd-cell .l{font-family:var(--font-mono);font-size:9px;letter-spacing:.1em;color:rgba(255,255,255,.6);text-transform:uppercase;margin-top:4px}

/* ============================================================
   Archive / Replays
   ============================================================ */
.bbz-arch__head{display:flex;align-items:flex-end;gap:18px;flex-wrap:wrap;margin-bottom:22px}
.bbz-arch__head h2{font-family:var(--font-display);font-size:clamp(34px,4vw,48px);line-height:.9;text-transform:uppercase;letter-spacing:.02em;margin:6px 0 0}
.bbz-arch__filters{display:flex;gap:8px;margin-left:auto;flex-wrap:wrap}

.bbz-chip{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.04em;font-weight:600;
  border:1px solid var(--line);background:var(--surf);color:var(--muted);
  border-radius:999px;padding:7px 14px;transition:.15s var(--ease);display:inline-flex;align-items:center;gap:6px;
}
.bbz-chip:hover{color:var(--ink);border-color:var(--line-strong)}
.bbz-chip.is-active{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}

.bbz-arch__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}

.bbz-replay{text-align:left;background:transparent;border:none;padding:0;display:flex;flex-direction:column;gap:10px;transition:.18s var(--ease)}
.bbz-replay:hover{transform:translateY(-3px)}
.bbz-replay__thumb{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:16/9;background:#0c0c12;border:1px solid var(--line)}
.bbz-replay__thumb[data-ratio="9:16"]{aspect-ratio:9/16}
.bbz-replay__thumb .ph{position:absolute;inset:0;background:
  radial-gradient(110% 90% at 30% 20%, rgba(124,58,237,.5), transparent 55%),
  radial-gradient(110% 90% at 80% 80%, rgba(0,255,154,.3), transparent 55%),#0c0c12}
.bbz-replay__thumb .scrim{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.7),transparent 60%)}
.bbz-replay__thumb .badge{position:absolute;top:9px;left:9px;font-family:var(--font-mono);font-size:8px;font-weight:800;letter-spacing:.06em;background:var(--surf2);color:var(--accent);border:1px solid var(--accent);padding:3px 7px;border-radius:6px}
.bbz-replay__thumb .plat{position:absolute;top:9px;right:9px;width:24px;height:24px;border-radius:7px;background:rgba(10,10,12,.7);display:grid;place-items:center;border:1px solid rgba(255,255,255,.15)}
.bbz-replay__thumb .plat svg{width:14px;height:14px}
.bbz-replay__thumb .dur{position:absolute;bottom:9px;right:9px;font-family:var(--font-mono);font-size:9px;font-weight:600;color:#fff;background:rgba(10,10,12,.7);padding:3px 7px;border-radius:6px}
.bbz-replay__thumb .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:999px;background:rgba(255,255,255,.16);border:1.5px solid rgba(255,255,255,.5);display:grid;place-items:center;color:#fff;font-size:16px;transition:.18s var(--ease)}
.bbz-replay:hover .play{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.bbz-replay__ttl{font-weight:600;font-size:14px;line-height:1.3}
.bbz-replay__meta{font-family:var(--font-mono);font-size:10px;color:var(--muted);letter-spacing:.04em}

/* ============================================================
   Brand module
   ============================================================ */
.bbz-brandmod{
  border:1px solid var(--accent);border-radius:16px;overflow:hidden;margin-top:18px;
  background:color-mix(in srgb,var(--accent) 7%,var(--surf));
}
.bbz-brandmod__head{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid color-mix(in srgb,var(--accent) 22%,transparent)}
.bbz-brandmod__logo{font-family:var(--font-display);font-size:28px;letter-spacing:.02em;line-height:1;color:var(--ink);display:flex;align-items:center;gap:9px}
.bbz-brandmod__logo .mk{width:30px;height:30px;border-radius:8px;background:var(--accent2);color:var(--accent-ink);display:grid;place-items:center;font-family:var(--font-display);font-size:20px}
.bbz-brandmod__tag{font-family:var(--font-mono);font-size:9px;letter-spacing:.1em;color:var(--muted);text-transform:uppercase}
.bbz-brandmod__body{padding:16px 18px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.bbz-brandmod__body p{margin:0;flex:1;min-width:200px;color:var(--ink);font-size:14px}
.bbz-brandmod__body p b{color:var(--accent)}

/* ============================================================
   Layouts
   ============================================================ */
.bbz-live-home{padding:26px 0 10px}
.bbz-live__grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:24px;align-items:start}
.bbz-live__grid .col-main{min-width:0}
.bbz-live__grid .col-side{position:sticky;top:80px;height:min(78vh,720px);display:flex;flex-direction:column;gap:16px}
.bbz-live__grid .col-side .bbz-live__comments{flex:1 1 auto}
.bbz-live__cta-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:18px}

.bbz-stream-hero{padding:24px 0 0}
.bbz-stream__grid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:24px;align-items:start}
.bbz-stream__grid .col-side{position:sticky;top:80px;height:min(80vh,760px);display:flex;flex-direction:column;gap:16px}
.bbz-stream__grid .col-side .bbz-live__comments{flex:1 1 auto}

.bbz-comments-toggle{display:none}
.bbz-collapsed-mobile{display:block}
.bbz-collapsed-mobile.is-collapsed{display:none}

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width:1040px){
  .bbz-arch__grid{grid-template-columns:repeat(3,1fr)}
  .bbz-live__grid,.bbz-stream__grid{grid-template-columns:1fr}
  .bbz-live__grid .col-side,.bbz-stream__grid .col-side{position:static;height:auto}
  .bbz-live__grid .col-side .bbz-live__comments,.bbz-stream__grid .col-side .bbz-live__comments{height:440px}
}

@media (max-width:720px){
  .bbz-arch__grid{grid-template-columns:repeat(2,1fr)}
  .bbz-comments-toggle{display:flex;width:100%;justify-content:center;margin-top:4px}
  .bbz-live__stage{height:min(78vh,560px)}
}

@media (max-width:560px){
  .bbz-arch__grid{grid-template-columns:1fr}
}