/* Cade NFL Madness matchup v9 (2026-10-06): the page's deltas on tournament.css + the broadcast layer.
   b- pieces for the layer: .b-vs (the versus stage), .b-crowd (the crowd split by credits), .b-rank (the rank meter). */

/* ═════ THE VERSUS STAGE (b-vs): the art in a torn panel, the two sides (their helmet medallions, the team colour box), the VS burst ═════ */
.b-vs{position:relative;filter:drop-shadow(var(--sh-9))}
.b-vs-f{position:relative;height:clamp(380px,34vw,440px);clip-path:var(--clip-panel);background:var(--violet-deep);overflow:hidden}
.b-vs-f::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(14,13,12,.82) 0,rgba(14,13,12,.15) 38%,rgba(14,13,12,0) 55%)}
.b-vs-in{position:absolute;inset:0;z-index:2}
.b-vs .b-livetag{position:absolute;left:30px;top:24px}
.b-vs-day{position:absolute;left:50%;top:26px;margin:0;transform:translateX(-50%) rotate(-2deg)}
.b-vs-burst{position:absolute;left:50%;top:50%;width:170px;height:170px;transform:translate(-50%,-38%) rotate(-6deg);filter:drop-shadow(var(--sh-6))}
.b-vs-burst span{font-family:var(--shout);font-style:italic;font-weight:800;font-size:72px;line-height:1;color:var(--ink)}
.b-vs-t{position:absolute;top:50%;transform:translateY(-36%);display:flex;flex-direction:column;align-items:center;gap:10px;width:30%}
.b-vs-t.a{left:4%}.b-vs-t.b{right:4%}
.b-vs-m svg{display:block;width:clamp(110px,11vw,150px);height:auto;filter:drop-shadow(var(--sh-4))}
.b-vs-t p{margin:0;display:flex;flex-direction:column;align-items:center;gap:8px}
.b-vs-ab{display:inline-flex;align-items:center;padding:6px 20px 5px 18px;color:#fff;font-family:var(--shout);font-style:italic;font-weight:800;font-size:30px;line-height:1;clip-path:var(--clip-chip);filter:drop-shadow(var(--sh-3))}
.b-vs-t b{font-family:var(--shout);font-style:italic;font-weight:800;font-size:clamp(34px,3.4vw,50px);line-height:.9;text-transform:uppercase;color:var(--paper);text-shadow:3px 3px 0 #000;white-space:nowrap}
.b-vs-note{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);margin:0;padding:6px 12px 5px;background:var(--ink);color:var(--paper);font-family:var(--data);font-weight:700;font-size:var(--fs-key);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}

.tmu .t-sky{padding-top:32px}
.tmu .t-row1{padding-top:40px}

/* ═════ the amount in credits: CR after the number ═════ */
.tmu .amt.b-dark span{font-size:var(--fs-field);color:var(--muted)}
.tkt-have{margin:14px 0 0;font-family:var(--data);font-weight:700;font-size:var(--fs-key);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:center}
.tkt-have b{color:var(--paper)}

/* ═════ the crowd split by credits (b-crowd): the kit duel bar, the two shares under it ═════ */
.b-crowd{margin-top:26px}
.b-crowd .ssb{--ssb-h:34px;--ssb-drop:3px}
.b-crowd-l{display:flex;justify-content:space-between;gap:12px;margin:10px 0 0;font-family:var(--shout);font-style:italic;font-weight:800;font-size:24px;text-transform:uppercase;line-height:1}
.b-crowd-l span:first-child{color:var(--yes)}.b-crowd-l span:last-child{color:var(--red-soft)}
.b-crowd-l b{font-family:var(--data);font-style:normal;font-size:22px;color:var(--paper)}
.b-crowd-l small{font-family:var(--data);font-style:normal;font-weight:700;font-size:var(--fs-label);letter-spacing:.1em;color:var(--muted)}

/* ═════ the rank meter (b-rank) ═════ */
.b-rank{display:grid;grid-template-columns:auto auto minmax(0,1fr);grid-template-areas:"f a n" "s s s" "u u u";align-items:center;gap:8px 16px}
.b-rank p{margin:0}
.b-rank-from{grid-area:f;display:flex;flex-direction:column;gap:4px}
.b-rank-now{grid-area:n;display:flex;flex-direction:column;gap:4px}
.b-rank small{font-family:var(--data);font-weight:700;font-size:var(--fs-label);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.b-rank-from b{font-family:var(--data);font-weight:800;font-size:34px;line-height:1;color:var(--muted)}
.b-rank-arw{grid-area:a;font-size:26px;color:var(--yes)}
.b-rank-now b{font-family:var(--shout);font-style:italic;font-weight:800;font-size:clamp(64px,6vw,84px);line-height:.85;color:var(--yes)}
.b-rank .b-spark{grid-area:s;width:100%;height:64px;--tone:var(--yes)}
.b-rank-up{grid-area:u;font-family:var(--shout);font-style:italic;font-weight:800;font-size:28px;text-transform:uppercase;color:var(--yes)}

/* the tournament standings, compact */
.b-stand-sm .b-stand td,.b-stand-sm .b-stand th[scope=row]{height:46px;padding:4px 8px}
.b-stand-sm .b-stand .b-av{width:30px;height:30px}
.b-stand-sm .b-stand td:last-child{font-size:var(--fs-field)}
.b-stand-sm .b-stand tr.you td{background:var(--yellow);color:var(--ink)}
.b-stand-sm .b-stand tr.you th{background:var(--yellow);color:var(--ink)}

.tmu .t-tabs{padding-top:48px}
.tmu .t-next{padding-top:40px}

@media (max-width:760px){
  .b-vs .b-livetag{display:none}
  .b-vs-day{top:18px;font-size:19px;padding:8px 30px 9px 20px}
  .b-vs-f{height:400px}
  .b-vs-burst{width:96px;height:96px;top:46%}
  .b-vs-burst span{font-size:40px}
  .b-vs-t{width:44%;top:46%}.b-vs-t.a{left:0}.b-vs-t.b{right:0}
  .b-vs-m svg{width:92px}
  .b-vs-ab{font-size:22px;padding:5px 14px 4px 12px}
  .b-vs-t b{font-size:clamp(22px,7vw,30px)}
  .b-vs-note{bottom:16px;font-size:var(--fs-floor);text-align:center}
  .b-vs-note .opt{display:none}
  .b-crowd-l{font-size:19px}.b-crowd-l b{font-size:18px}
  .b-crowd-l small{display:none}
  .tmu .t-sky,.tmu .t-row1,.tmu .t-tabs,.tmu .t-next{padding-top:32px}
}
@media (max-width:360px){
  .b-vs-t b{font-size:21px}
  .b-vs-m svg{width:80px}
}