/* Cade basketball v8 (2026-10-06): the NBA game centre in the v8 language. The shared language and the product parts
   (hero, wide stage, stats band, the ghost keys, the comparison bars, the box score, the play log, the cards) are the kit
   /lib/v8/v8.css (README there); THE LIVE COURT + its market is the kit skycam on the NBA court (/lib/v8/skycam.css + skycam.js,
   the client's second sportcade render, ported 1:1). This file keeps only the page: the game band layout, the frame around
   the court, and the deltas on cream / violet. */

/* ═════ HERO: the kit's wide stage (21:9 on desktop, so the court arrives early) ═════ */
.bb8 .stage-art{--obj:60% 38%;--obj-sm:64% 40%}
.bb8 .stage-h{top:6.4cqw;font-size:clamp(30px,8.6cqw,124px)}
.bb8 .stage-sign{top:auto;bottom:6cqw;right:5cqw}
/* the kit band, the game layout: the game line | the numbers over the door (the category head's rule and width step back) */
.band-face{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"m st" "m more";gap:8px 40px}
.band-m{grid-area:m;min-width:0}
.band-k{margin:0;font-family:var(--data);font-weight:800;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--orange)}
.band-h{margin:8px 0 0;display:flex;align-items:baseline;gap:.22em;flex-wrap:wrap;padding-right:0;border-right:0;line-height:.88;white-space:normal;min-width:0}
.band-h b{font-family:var(--data);font-style:normal;font-weight:800;font-size:.78em;color:var(--yellow);font-variant-numeric:tabular-nums}
.band-h i{font-style:normal;font-family:var(--data);font-size:.6em;color:var(--muted)}
.band-p{margin:10px 0 0;font-size:clamp(16px,1.3vw,19px);color:var(--muted);max-width:52ch}
.band-st dd{font-size:clamp(26px,2.4vw,36px)}
.band-more{grid-area:more;justify-self:end;align-self:auto}

/* ═════ THE LIVE COURT + MARKET: the kit skycam on the NBA court (/lib/v8/skycam.*, the client's sportcade render), torn frame, the keys under it ═════ */
.sky{position:relative;filter:drop-shadow(var(--sh-9))}
.sky .skc-st{clip-path:var(--clip-panel)}
.sky-bar{display:flex;align-items:center;justify-content:space-between;gap:16px 28px;flex-wrap:wrap;margin-top:24px}
.sky-note{margin:0;font-family:var(--data);font-weight:700;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.sky-ctl{display:flex;flex-wrap:wrap;gap:12px}
.sky-ctl .ghost{padding:0 16px}
.sky-ctl[hidden]{display:none}

/* ═════ THE BOX SCORE: duel bars (their battle parallelograms), the log on violet, the team stats on cream ═════ */
.duels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 34px;margin-bottom:44px}
.duel{margin:0;min-width:0}
.duel-hd{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.duel-hd h3{margin:0;font-family:var(--data);font-weight:800;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);text-align:center}
.duel-hd b{display:flex;align-items:center;gap:10px;font-family:var(--data);font-weight:800;font-size:22px;color:var(--paper);font-variant-numeric:tabular-nums}
.duel-hd b span{width:42px;height:42px;display:block}
.duel-hd b span svg{width:100%;height:100%;display:block}
.box-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px;align-items:stretch}
.box-g .pnl-face{height:100%}
.log{padding:32px 34px 34px 32px}
.log-hd{display:flex;align-items:baseline;justify-content:space-between;gap:10px 18px;flex-wrap:wrap}
.log-h{margin:0;font-size:clamp(34px,3vw,44px);color:var(--paper);text-shadow:var(--sh-3)}
.log-s{margin:0;font-family:var(--data);font-weight:800;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#E4D8FF}
/* the kit play log on violet ink */
.plog{margin-top:20px}
.plog li{gap:12px;min-height:50px;padding:6px 16px 6px 12px;background:var(--violet-ink);box-shadow:var(--sh-3)}
.plog li:first-child{background:var(--ink)}
.plog-t{font-size:13px;color:#E4D8FF;white-space:nowrap}
.plog-m{width:42px;height:42px}
.plog-m svg{width:100%;height:100%;display:block}
.plog-w{font-size:20px;color:#fff}
.plog-r{font-size:14px;color:#fff;font-variant-numeric:tabular-nums}
.plog-r.hit{padding:4px 8px 3px}
.team{padding:28px 34px 30px 32px;display:flex;flex-direction:column}
/* the kit box score on cream, the octagons on top */
.ts{font-variant-numeric:tabular-nums}
.ts th{padding:0 0 14px}
.ts :where(thead th){font:inherit;letter-spacing:inherit;color:inherit}   /* the octagons and "vs." head this table, not the kit's DATA labels */
.ts-med{display:inline-block;width:64px;height:64px;vertical-align:middle}
.ts-med svg{width:100%;height:100%;display:block}
.ts-vs{font-family:var(--shout);font-style:italic;font-weight:800;font-size:40px;text-transform:uppercase;color:var(--ink)}
.ts td{padding:9px 0;border-top:2px solid #D7CDB4;font-size:clamp(20px,1.9vw,26px);color:var(--ink)}
.ts th.k{padding:9px 0;border-top:2px solid #D7CDB4;text-align:center;font-family:var(--data);font-weight:800;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#4A453C}
.ts td.hi{color:var(--violet-deep)}
.comm{margin:auto 0 0;padding:14px 16px 12px;background:var(--ink);color:var(--paper);box-shadow:var(--sh-4);display:flex;flex-direction:column;gap:6px}
.ts+.comm{margin-top:20px}
.comm span{font-family:var(--data);font-weight:800;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--orange)}
.comm b{font-family:var(--read);font-weight:400;font-size:17px;line-height:1.35}

/* ═════ LIVE MARKETS (kit cards, .more-row) ═════ */
.fine{margin-top:40px}

/* ═════ the 1180 / 1023 / 760 / 360 rungs ═════ */
@media (max-width:1180px){
  .band-st{margin-top:0;padding-top:0;border-top:0;justify-content:normal}
  .band-st div:first-child{padding-left:24px}
}
@media (max-width:1023px){
  .band-face{grid-template-columns:1fr;grid-template-areas:"m" "st" "more"}
  .band-st{margin-top:16px;padding-top:18px;border-top:2px solid #34312d;justify-content:start}
  .band-st div:first-child{padding-left:0}
  .band-more{justify-self:start}
  .box-g{grid-template-columns:1fr}
}
@media (max-width:760px){
  .hero-in{gap:28px}
  .band{margin-top:0}
  .bb8 .stage-h{top:7cqw;font-size:13cqw}
  .bb8 .stage-sign{bottom:7cqw;right:6cqw}
  .band-face{display:grid;align-items:center;padding:24px 22px 26px 20px;gap:6px}
  .band-h{font-size:min(12vw,52px)}
  .band-p{font-size:16px}
  .band-st{width:auto;margin-top:16px;padding-top:18px;grid-template-columns:repeat(3,auto);grid-auto-flow:row;justify-content:space-between}
  .band-st div{padding:0 0 0 12px}
  .band-st dd{font-size:clamp(18px,5.6vw,24px)}
  .band-st dt{font-size:14px}
  .duels{grid-template-columns:1fr;gap:20px;margin-bottom:36px}
  .duel-hd b{font-size:19px}
  .box-g{gap:30px}
  .log{padding:24px 18px 26px 16px}
  .plog li{grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"m t r" "m w w";gap:4px 12px;padding:8px 12px 9px 10px}
  .plog-t{grid-area:t}.plog-m{grid-area:m}.plog-w{grid-area:w;font-size:18px}.plog-r{grid-area:r}
  .team{padding:24px 20px 26px 18px}
  .ts-med{width:52px;height:52px}
  .ts-vs{font-size:32px}
  .ts td{font-size:20px}
  .comm b{font-size:16px}
  .mk-tabs{width:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
  .mk-tabs .tab span{gap:6px}
  .fine{margin-top:32px}
}
@media (max-width:360px){
  .band-st dd{font-size:17px}
  .band-st div{padding-left:8px}
  .mk-tabs .tab span{font-size:14px;padding:0 6px 0 8px}
  .mk-tabs .tab i{display:none}
}
