/* Cade basketball v9 (2026-10-06): the broadcast basketball detail. Every part is the broadcast layer (/lib/v8/broadcast.css) on the
   kit (/lib/v8/v8.css, skycam.css: the stage keys .b-keys, the lock sticker's line, an empty list row, the answers .b-faq are the
   layer's); this file keeps the page's deltas and its own pieces: .b-rnd-k, .b-legend, .b-court, .b-poss, .bb-sub, .b-kv, the tall
   promo (.bb-tall). Shapes: only the layer's (torn panels, the sign polygon, the CTA plates); the court, the shot dots and the
   timeline nodes are data marks. Nothing under 11px. */
.bbv9 .b-stage-sec{padding-top:24px}
.bbv9 .bb-strip{padding-top:28px}
.bbv9 .bb-row1{padding-top:32px}
.bbv9 .fine{margin-top:40px}

/* the round panel: the kicker under the question, the sticker's line */
.b-rnd-k{margin:12px 0 0;font-family:var(--data);font-weight:700;font-size:var(--fs-key);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.b-ph .tag{flex:none;background:var(--yellow)}

/* ═════ the shot chart panel: the court + the timeline, the round numbers beside ═════ */
.bb-row2{align-items:stretch}
.b-shots{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:28px;height:100%}
.b-shots-main{min-width:0}
.b-shots-side{padding-left:26px;border-left:2px solid var(--b-rule)}
.b-shots .b-ph{align-items:center;flex-wrap:wrap}
.b-legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin:0;font-family:var(--data);font-weight:700;font-size:var(--fs-key);letter-spacing:.06em;text-transform:uppercase;color:var(--paper)}
.b-legend span{display:inline-flex;align-items:center;gap:7px}
.b-legend i{width:14px;height:14px;border-radius:50%;border:3px solid var(--paper);background:transparent}
.b-legend i.m{background:var(--paper);border-color:var(--ink);box-shadow:0 0 0 1px var(--paper)}
.b-legend i.t{border-radius:0;border:2px solid var(--ink);background:var(--c);box-shadow:0 0 0 1px var(--line)}
.b-court{position:relative;filter:drop-shadow(var(--sh-4))}
.b-court svg{display:block;width:100%;height:auto}
.b-court-mk{filter:brightness(0);opacity:.82}
.b-court g.new{transform-box:fill-box;transform-origin:center;animation:bShot .6s var(--e-out)}
@keyframes bShot{0%{transform:scale(2.4);opacity:0}60%{transform:scale(.9);opacity:1}100%{transform:none}}
.bb-sub{margin:24px 0 12px;font-family:var(--data);font-weight:800;font-size:var(--fs-key);letter-spacing:.12em;text-transform:uppercase;color:var(--orange)}
.b-shots-side .bb-sub:first-child{margin-top:4px}
.b-poss{list-style:none;margin:0;padding:0;position:relative;display:flex;align-items:center;justify-content:space-between;gap:4px;min-height:28px}
.b-poss::before{content:"";position:absolute;left:0;right:0;top:50%;height:2px;background:var(--b-rule)}
.b-poss li{position:relative;width:16px;height:16px;border-radius:50%;background:var(--bg1);border:3px solid var(--c)}
.b-poss li[data-scored]{background:var(--c);border-color:var(--ink);box-shadow:0 0 0 1px var(--c)}
.b-poss li.now{box-shadow:0 0 0 3px var(--bg2),0 0 0 6px var(--yellow)}
.b-kv{margin:0;display:flex;flex-direction:column}
.b-kv div{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:2px solid var(--b-rule)}
.b-kv div:last-child{border-bottom:0}
.b-kv dt{font-family:var(--data);font-weight:700;font-size:var(--fs-key);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.b-kv dd{margin:0;font-family:var(--data);font-weight:800;font-size:var(--fs-field);color:var(--paper);font-variant-numeric:tabular-nums;white-space:nowrap}

/* the tall promo beside the shot chart */
.bb-tall .b-promo,.bb-tall .b-promo-f{height:100%}
.bb-tall .b-promo-f{flex-direction:column;align-items:flex-start;justify-content:space-between;min-height:420px;padding:32px 30px 34px}
.bb-tall .b-sign{max-width:100%;padding:24px 34px 28px 26px}
.bb-tall .b-sign b{font-size:clamp(32px,3vw,46px)}

.bb-row5{align-items:stretch}
.bb-row5>.pnl>.pnl-face{height:100%}
.bb-row5 #promo,.bb-row5 #promo .b-promo,.bb-row5 #promo .b-promo-f{height:100%}
.bb-row5 #promo .b-promo-f{flex-direction:column;align-items:flex-start;justify-content:space-between}

@media (prefers-reduced-motion:reduce){.b-court g.new{animation:none}}
html.static .b-court g.new{animation:none}

@media (max-width:1180px){
  .b-shots{grid-template-columns:1fr;gap:8px}
  .b-shots-side{padding-left:0;border-left:0;display:grid;grid-template-columns:1fr 1fr;gap:0 28px;align-items:start}
  .b-shots-side .bb-sub{grid-row:1}.b-shots-side .bb-sub:first-child{margin-top:24px}
  .b-shots-side .b-kv{grid-row:2}
}
@media (max-width:1023px){
  .bb-tall .b-promo-f{min-height:320px}
}
@media (max-width:760px){
  .bbv9 .bb-strip,.bbv9 .bb-row1{padding-top:24px}
  .b-shots-side{grid-template-columns:1fr;gap:0}
  .b-shots-side .bb-sub,.b-shots-side .b-kv{grid-row:auto}
  .b-legend{gap:6px 12px}
  .b-poss li{width:13px;height:13px;border-width:2px}
  .b-poss li.now{box-shadow:0 0 0 2px var(--bg2),0 0 0 5px var(--yellow)}
  .bb-tall .b-promo-f{min-height:340px;padding:26px 22px 28px}
  .bb-tall .b-promo .plate,.bb-row5 #promo .plate{margin-top:120px}
}
/* review 2026-10-07: the resolved chip keeps its last letter clear of the chip's cut */
.bbv9 .b-rsv .b-st{padding-right:34px;white-space:nowrap}
.bbv9 .b-rsv-q{text-wrap:balance}
/* review 2026-10-07: the next rounds and the play-by-play stand the same height */
.bbv9 .b-cols.even{align-items:stretch}
.bbv9 .b-cols.even>.pnl>.pnl-face{height:100%}
.bbv9 .b-rnd-q{text-wrap:balance}
.bbv9 .b-sw{white-space:nowrap}
