/* monitor / preview */
.monitor{position:relative;flex:1;min-height:360px;border-radius:10px;border:1px solid var(--line,#232b36);overflow:hidden;background:#0f131a}
.monitor.small{min-height:200px}
.monitor.checker::before{content:'';position:absolute;inset:0;z-index:0;background-image:linear-gradient(45deg,#1c2029 25%,transparent 25%),linear-gradient(-45deg,#1c2029 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#1c2029 75%),linear-gradient(-45deg,transparent 75%,#1c2029 75%);background-size:26px 26px;background-position:0 0,0 13px,13px -13px,-13px 0;background-color:#14181f}
.monitor .field{position:absolute;inset:0;z-index:0;opacity:.92;background:repeating-linear-gradient(90deg,#2f6d33 0 56px,#357a39 56px 112px)}
.monitor .field::before{content:'';position:absolute;inset:7% 6%;border:2px solid rgba(255,255,255,.4)}
.monitor.checker .field{display:none}
/* Preview-only sport backdrops (designer): a wood court for basketball/volleyball/tennis. */
.monitor.look-court .field{opacity:.95;background:repeating-linear-gradient(90deg,#b07a3c 0 60px,#bb8446 60px 120px)}
.monitor.look-court .field::before{border-color:rgba(255,255,255,.55)}
.monitor .safe{position:absolute;inset:5%;z-index:3;pointer-events:none;border:1.5px dashed rgba(255,255,255,.4)}
.monitor .safe.hidden{display:none}
.monitor .safe.past{border-color:#ff3b47;border-style:solid;box-shadow:0 0 0 1px rgba(255,59,71,.45)}
.monitor .mount{position:absolute;z-index:4;left:50%;bottom:8%;transform-origin:bottom center;transform:translateX(-50%) translate(var(--sb-x,0px),var(--sb-y,0px)) scale(var(--sb-scale,1))}

/* ===== football banner ===== */
.fbug{position:relative;display:inline-block;padding:40px 0 42px;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 8px 22px rgba(0,0,0,.55));user-select:none}
.fbug .mainrow{display:flex;align-items:stretch;justify-content:center;height:70px}
.fbug .tb{flex:1;display:flex;align-items:center;gap:12px;padding:0 22px;position:relative;z-index:1;overflow:visible}
.fbug .tb.home{border-radius:11px 0 0 11px;justify-content:flex-start;padding-left:22px;padding-right:50px}
.fbug .tb.away{border-radius:0 11px 11px 0;justify-content:flex-end;padding-right:22px;padding-left:50px}
.fbug .tb .lg{width:44px;height:44px;object-fit:contain;flex:none}.fbug .tb .lg.empty{display:none}
.fbug .tb .tbtext{display:flex;flex-direction:column;justify-content:center;min-width:0}
.fbug .tb.home .tbtext{align-items:flex-start}.fbug .tb.away .tbtext{align-items:flex-end}
.fbug .tb .school{font-family:var(--st-tn-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-tn-size,var(--school-size,15px));letter-spacing:.04em;line-height:1.05;color:var(--st-tn-color,rgba(255,255,255,.82));white-space:nowrap}
.fbug .tb .nm{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-nm-size,var(--nm-size,31px));line-height:.98;letter-spacing:.02em;color:var(--st-nm-color,#fff);white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.28)}
/* Optional AP rank (small, non-bold, before the name) + per-game record (line under it) */
.fbug .tb .nm .rk{font-weight:600;font-size:.56em;opacity:.85;vertical-align:top;margin-right:.28em;letter-spacing:0}
/* Penalty flag / message bar — pinned in the band directly above each team, level with the
   clock/console. Aligned to the team's outer edge; max-width reserves room on the inner
   side so the note never slides under the center console. */
.fbug .tb .topnotes{position:absolute;bottom:100%;margin-bottom:5px;z-index:2;display:flex;flex-direction:column;gap:3px;max-width:calc(100% - 150px)}
.fbug .tb.home .topnotes{left:22px;align-items:flex-start}
.fbug .tb.away .topnotes{right:22px;align-items:flex-end}
.fbug .tb .topnotes .penflag,.fbug .tb .topnotes .msgbar{width:auto;max-width:100%;border-radius:4px;padding:2px 12px;font-size:11px;box-shadow:0 2px 6px rgba(0,0,0,.35)}
.fbug .tb .topnotes .msgbar{font-size:10px}
.fbug .tb .rec{font-family:var(--bug-font,'Barlow Condensed'),sans-serif;font-weight:700;font-size:13px;letter-spacing:.04em;line-height:1;margin-top:5px;color:var(--tb-text,#fff);opacity:.72}
/* Center console — clock, score and down/distance stacked as three equal-width tiers in
   one panel. align-self:center lets it overrun the 70px team row symmetrically so the
   clock tier rises above and the down/distance tier drops below the team bars. min-width
   keeps it from collapsing narrower than the score row; width fits the widest tier. */
.fbug .fbcon{align-self:center;margin:0 -40px;z-index:5;min-width:210px;display:flex;flex-direction:column;align-items:stretch;background:var(--st-sc-bg,#0a0d12);border-radius:12px;overflow:hidden;box-shadow:0 5px 16px rgba(0,0,0,.4)}
.fbug .fbscore{height:70px;display:flex;align-items:center;justify-content:center;gap:14px;padding:0 20px}
.fbug .fbscore .pd{width:12px;height:12px;border-radius:50%;background:#ffcb2b;box-shadow:0 0 9px rgba(255,203,43,.75);flex:none;opacity:0;transition:opacity .2s}.fbug .fbscore .pd.on{opacity:1}
.fbug .fbscore .sc{font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,40px);color:var(--st-sc-color,#fff);font-variant-numeric:tabular-nums;min-width:44px;text-align:center;border-radius:6px;padding:0 4px}
.fbug .fbscore .sc[data-side="home"]{background:var(--sb-c-scH-bg,transparent);color:var(--sb-c-scH-fg,var(--st-sc-color,#fff))}
.fbug .fbscore .sc[data-side="away"]{background:var(--sb-c-scA-bg,transparent);color:var(--sb-c-scA-fg,var(--st-sc-color,#fff))}
.fbug .fbscore .dash{color:#8b95a3;font-weight:700;font-size:30px;margin:0 -3px}
.fbug .fbcon .clocktab{height:34px;flex:none;background:var(--sb-c-clock-bg,rgba(255,255,255,.05));display:flex;align-items:center;justify-content:center;gap:15px;padding:0 18px}
.fbug .fbcon .clocktab .q{font-family:var(--st-q-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-q-size,18px);color:var(--sb-c-q-fg,var(--st-q-color,#ffcb2b));background:var(--sb-c-q-bg,transparent);border-radius:5px;padding:1px 5px;letter-spacing:.02em}.fbug .fbcon .clocktab .c{font-family:var(--st-gc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-gc-size,23px);color:var(--sb-c-gc-fg,var(--st-gc-color,#fff));font-variant-numeric:tabular-nums}.fbug .fbcon .clocktab.hidden{display:none}
.fbug .fbcon .clocktab .ttol{display:flex;gap:4px}.fbug .fbcon .clocktab .ttol .tl{width:13px;height:3px;border-radius:2px;background:rgba(255,255,255,.3)}.fbug .fbcon .clocktab .ttol.tol-home .tl.on{background:var(--st-tol-home-color,#fff)}.fbug .fbcon .clocktab .ttol.tol-away .tl.on{background:var(--st-tol-away-color,#fff)}
/* Optional event-title footer — a connected tier the full width of the console. */
.fbug .fbcon .fbtitle{flex:none;padding:4px 16px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:var(--sb-c-msg-bg,rgba(0,0,0,.32));box-shadow:inset 0 1px 0 rgba(255,255,255,.07);font-family:var(--st-msg-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-msg-size,11px);letter-spacing:.14em;text-transform:uppercase;color:var(--st-msg-color,#c4cdd8)}
.fbug.hastitle{padding-top:46px;padding-bottom:50px}
/* TOL 'below' style — bars under each team name */
.fbug .tb .tol{display:flex;gap:5px;margin-top:6px}
.fbug .tb .tol .tl{width:18px;height:3px;border-radius:2px;background:rgba(255,255,255,.32);background:color-mix(in srgb,var(--tb-text,#fff) 32%,transparent)}.fbug .tb .tol-home .tl.on{background:var(--st-tol-home-color,var(--st-tol-color,var(--tb-text,#fff)))}.fbug .tb .tol-away .tl.on{background:var(--st-tol-away-color,var(--st-tol-color,var(--tb-text,#fff)))}
/* TOL 'ticks' style — slanted tick marks stacked just inside each box edge (clear of the wedge) */
.fbug .tb .tdots{position:absolute;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:4px;z-index:3}
.fbug .tb.home .tdots{right:50px}.fbug .tb.away .tdots{left:50px}
/* 'ticks' mode: extra inner padding so the name doesn't crowd the tick column */
.fbug.toldots .tb.home{padding-right:82px}.fbug.toldots .tb.away{padding-left:82px}
.fbug .tb .tdots .td{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.34);background:color-mix(in srgb,var(--tb-text,#fff) 34%,transparent)}.fbug .tb .tdots.tol-home .td.on{background:var(--st-tol-home-color,var(--st-tol-color,var(--tb-text,#fff)))}.fbug .tb .tdots.tol-away .td.on{background:var(--st-tol-away-color,var(--st-tol-color,var(--tb-text,#fff)))}
/* 'ticks' variant — slanted bars instead of round dots */
.fbug .tb .tdots.ticks .td{width:5px;height:15px;border-radius:2px;transform:skewX(-16deg)}
/* Console edge variants — the slant is applied to the whole console so all three tiers
   keep one shared, aligned edge (radius drops so the clipped corners stay crisp). */
.fbug .fbcon.slant{clip-path:polygon(7% 0,93% 0,100% 100%,0 100%);border-radius:0}
.fbug .fbcon.slantdown{clip-path:polygon(0 0,100% 0,93% 100%,7% 100%);border-radius:0}
.fbug .fbcon .dnd{flex:none;display:flex;align-items:stretch}
.fbug .fbcon .dnd .cell{flex:1;display:flex;align-items:center;justify-content:center;padding:5px 22px;font-family:var(--st-dnd-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-dnd-size,18px);color:var(--sb-c-dnd-fg,var(--st-dnd-color,#fff));letter-spacing:.03em;background:var(--sb-c-dnd-bg,transparent);white-space:nowrap}.fbug .fbcon .dnd.hidden{display:none}
.fbug .fbcon .dnd .cell .sep{display:inline-block;width:4px;height:4px;border-radius:50%;background:#5a6472;margin:0 13px;flex:none}

/* ===== football champion (ESPN-style title bar) =====
   Top strip: team name · down&distance · team name. Main row: logos on the outer
   edges, records + big scores toward a center quarter/clock/play-clock console.
   Bottom: full-width event-title strip. */
.fbch{position:relative;display:inline-flex;flex-direction:column;min-width:520px;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 8px 22px rgba(0,0,0,.55));user-select:none}
.fbch-top{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;column-gap:16px;padding:5px 20px;background:linear-gradient(180deg,#242c37,#161d26);border-radius:8px 8px 0 0}
.fbch-top .fbch-name{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-nm-size,16px);letter-spacing:.04em;color:var(--st-nm-color,#fff);white-space:nowrap}
.fbch-top .fbch-name.L{justify-self:start}.fbch-top .fbch-name.R{justify-self:end}
.fbch-top .fbch-name .rk{font-weight:600;font-size:.72em;opacity:.85;margin-right:.35em;letter-spacing:0}
.fbch-top .fbch-dnd{justify-self:center;font-family:var(--st-dnd-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-dnd-size,14px);letter-spacing:.05em;color:var(--st-dnd-color,#ffcb2b);white-space:nowrap}
.fbch-row{display:flex;align-items:stretch;height:58px;background:linear-gradient(180deg,#131922,#0a0f16)}
.fbch-side{flex:1;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:0 20px;min-width:0}
.fbch-side .lg{width:40px;height:40px;object-fit:contain;flex:none}.fbch-side .lg.empty{display:none}
.fbch-scg{display:flex;align-items:center;gap:11px}
.fbch-rec{font-weight:700;font-size:13px;letter-spacing:.03em;color:#93a0b1;white-space:nowrap;align-self:center}
.fbch-scw{display:flex;flex-direction:column;align-items:center;gap:5px}
.fbch-sc{display:flex;align-items:center;justify-content:center;min-width:46px;font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,40px);line-height:1;color:var(--st-sc-color,#fff);font-variant-numeric:tabular-nums;text-shadow:0 1px 3px rgba(0,0,0,.4)}
.fbch-tol{display:flex;gap:4px}
.fbch-tol .tl{width:14px;height:3px;border-radius:2px;background:rgba(255,255,255,.26)}
.fbch-tol.tol-home .tl.on{background:var(--st-tol-home-color,var(--st-tol-color,var(--tc,#ffcb2b)))}
.fbch-tol.tol-away .tl.on{background:var(--st-tol-away-color,var(--st-tol-color,var(--tc,#ffcb2b)))}
.fbch-mid{display:flex;align-items:center;gap:11px;padding:0 16px;background:#090d13;box-shadow:inset 1px 0 0 rgba(255,255,255,.05),inset -1px 0 0 rgba(255,255,255,.05)}
.fbch-mid .q{font-family:var(--st-q-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-q-size,15px);color:var(--st-q-color,#ffcb2b);letter-spacing:.03em}
.fbch-mid .q.fin{color:#ff6470}
.fbch-mid .c{font-family:var(--st-gc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-gc-size,20px);color:var(--st-gc-color,#fff);font-variant-numeric:tabular-nums}
.fbch-mid .pc{font-family:var(--st-pc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-pc-size,15px);color:#090d13;background:var(--st-pc-color,#ffcb2b);border-radius:4px;padding:1px 6px;font-variant-numeric:tabular-nums}
.fbch-mid .pc.clklow{background:#ff4b5c;color:#fff}
.fbch-pd{width:9px;height:9px;border-radius:50%;background:#ffcb2b;box-shadow:0 0 8px rgba(255,203,43,.7);flex:none;opacity:0;transition:opacity .2s}.fbch-pd.on{opacity:1}
.fbch-title{text-align:center;background:linear-gradient(180deg,#1d242e,#10151c);border-radius:0 0 8px 8px;font-family:var(--st-msg-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-msg-size,11px);letter-spacing:.16em;text-transform:uppercase;color:var(--st-msg-color,#c4cdd8);padding:4px 16px}

/* ===== football primetime (ESPN-style low bar) ===== */
.fe{position:relative;display:inline-flex;flex-direction:column;align-items:center;padding-top:16px;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 8px 22px rgba(0,0,0,.55));user-select:none}
.fe-tab{position:absolute;top:0;left:50%;transform:translateX(-50%);z-index:5;height:24px;display:flex;align-items:center;gap:9px;padding:0 18px;background:linear-gradient(180deg,#2b3542,#141b24);border-radius:6px 6px 0 0;font-family:var(--st-dnd-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-dnd-size,14px);letter-spacing:.05em;color:var(--st-dnd-color,#ffcf3f);white-space:nowrap}
.fe-tab.flag{background:linear-gradient(180deg,#6a5717,#3c300a);color:#f6e59a;box-shadow:inset 0 0 0 1px rgba(214,183,92,.55)}
.fe-tab.msg{color:#e7edf4}
.fe-tab.brand{gap:8px}
.fe-tab.brand .bn{font-style:italic;font-weight:800;letter-spacing:.02em;color:#fff}
.fe-tab .fe-brandlogo{height:18px;width:auto;object-fit:contain}
.fe-tab .ch{color:#ffcf3f;font-size:11px}
/* Penalty text — a flag-coloured chip riding just above the flagged team's name, placed
   over its side (never inside .fe-bar, so it isn't clipped and never nudges the bar). */
.fe-pennote{position:absolute;top:-1px;z-index:6;max-width:46%;padding:2px 10px;border-radius:5px 5px 0 0;background:linear-gradient(180deg,#f6e59a,#e6cf6a);color:#3c300a;font-family:var(--st-dnd-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:11px;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:0 -2px 6px rgba(0,0,0,.35)}
.fe-pennote.L{left:10px}
.fe-pennote.R{right:10px}
.fe-bar{display:flex;align-items:stretch;height:66px;border-radius:8px;overflow:hidden;box-shadow:inset 0 0 0 1.5px rgba(206,176,92,.45)}
.fe-side{flex:1;display:flex;flex-direction:column;gap:4px;min-width:170px;padding:5px 16px 6px}
/* A little breathing room between the logo and the name / record column. */
.fe-side.L .fe-btm{padding-left:4px}.fe-side.R .fe-btm{padding-right:4px}
.fe-btm .lg{margin:0 3px}
.fe-side.L{background:linear-gradient(90deg,var(--tc) 0%,var(--tc) 22%,#0a0e14 92%)}
.fe-side.R{background:linear-gradient(270deg,var(--tc) 0%,var(--tc) 22%,#0a0e14 92%)}
.fe-name{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-nm-size,14px);letter-spacing:.03em;color:var(--st-nm-color,#fff);white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.45);line-height:1.1}
.fe-side.R .fe-name{text-align:right}
.fe-name .rk{font-weight:600;font-size:.72em;opacity:.8;margin-right:.35em;vertical-align:top}
.fe-btm{flex:1;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:0}
.fe-grp{display:flex;align-items:center;gap:11px}
.fe-rec{display:flex;flex-direction:column;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;font-weight:700;font-size:11px;letter-spacing:.03em;line-height:1.12;color:rgba(255,255,255,.82);white-space:nowrap}
.fe-side.R .fe-rec{align-items:flex-end}
.fe-rec .fe-rec2{font-weight:600;font-size:.92em;opacity:.8}
.fe-side .lg{width:44px;height:44px;object-fit:contain;flex:none}.fe-side .lg.empty{display:none}
.fe-scw{display:flex;flex-direction:column;align-items:center;gap:4px}
.fe-sc{font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,38px);line-height:1;color:var(--st-sc-color,#fff);font-variant-numeric:tabular-nums;text-shadow:0 1px 3px rgba(0,0,0,.4)}
.fe-tol{display:flex;gap:4px}
.fe-tol .tl{width:13px;height:3px;border-radius:2px;background:rgba(255,255,255,.28)}
.fe-tol.tol-home .tl.on{background:var(--st-tol-home-color,var(--st-tol-color,#fff))}
.fe-tol.tol-away .tl.on{background:var(--st-tol-away-color,var(--st-tol-color,#fff))}
.fe-pd{width:9px;height:9px;border-radius:50%;background:#ffcf3f;box-shadow:0 0 8px rgba(255,207,63,.7);align-self:center;flex:none;opacity:0;transition:opacity .2s}.fe-pd.on{opacity:1}
.fe-mid{display:flex;align-items:center;gap:11px;padding:0 16px;background:#080b10;align-self:stretch}
.fe-mid .q{font-family:var(--st-q-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-q-size,14px);color:var(--st-q-color,#ffcf3f)}
.fe-mid .q.fin{color:#ff6470}
.fe-mid .c{font-family:var(--st-gc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-gc-size,19px);color:var(--st-gc-color,#fff);font-variant-numeric:tabular-nums}
.fe-mid .pc{font-family:var(--st-pc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-pc-size,14px);color:var(--st-pc-color,#ffcf3f);font-variant-numeric:tabular-nums}
.fe-mid .pc.clklow{color:#ff5a6a}
.fe-title{align-self:stretch;margin-top:4px;text-align:center;background:linear-gradient(180deg,#232b36,#141a22);border-radius:0 0 8px 8px;padding:4px 16px;font-family:var(--st-msg-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-msg-size,11px);letter-spacing:.16em;text-transform:uppercase;color:var(--st-msg-color,#c4cdd8)}

/* "New down" flash: when the down advances, enlarge just the down ordinal (.dn) and hide
   the distance / ball-on (.dx) for a few seconds so the operator can set the rest. */
/* Freeze the width of live-changing readouts so the bug never grows or shrinks as the
   value updates (clock 12:00 → :01, score 0 → 14). tabular-nums equalizes digit widths;
   min-width (in ch, so it scales with each element's font) reserves room for the widest
   value; the clock is right-aligned in its fixed box, scores are centered. */
.c,.clock,.vclk-t,.vb-clk,.clkbox .t,.bbclock .t{display:inline-block;min-width:5ch;text-align:right;font-variant-numeric:tabular-nums}
.sc,.fe-sc,.fbch-sc,.vbc-sc,.vbk-won{font-variant-numeric:tabular-nums}
.fe-sc,.vbc-sc{display:inline-block;min-width:2ch;text-align:center}
.fbcast .cx .cclk,.fbang .cx .cclk{min-width:5ch;text-align:center;font-variant-numeric:tabular-nums}
.fbcast .sc .v,.fbang .sc .v{display:inline-block;min-width:2ch;text-align:center;font-variant-numeric:tabular-nums}

.dn{margin-right:.28em}
.dnw{display:none}                       /* the word "DOWN", shown only during the new-down state */
.downflash .dx{display:none!important}
.downflash .dn{font-size:1.45em;font-weight:800;letter-spacing:.02em}
.downflash .dnw{display:inline;font-size:1.45em;font-weight:800;letter-spacing:.02em}

/* ===== basketball bug ===== */
.bbug{font-family:var(--bug-font,'Barlow Condensed'),sans-serif;display:inline-flex;flex-direction:column;filter:drop-shadow(0 6px 18px rgba(0,0,0,.55));user-select:none}
.bbug .main{display:flex;align-items:stretch;border-radius:6px;overflow:hidden;background:rgba(10,12,16,.94);height:46px}
.bbug .team{display:flex;align-items:center;gap:9px;position:relative}
.bbug .chip{width:7px;align-self:stretch}
.bbug .lg{width:26px;height:26px;margin-left:10px;object-fit:contain;border-radius:3px;background:rgba(255,255,255,.06)}.bbug .lg.empty{display:none}
.bbug .abbr{font-weight:700;font-size:21px;letter-spacing:.04em;color:#fff;min-width:44px}
.bbug .sc{font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,26px);color:var(--st-sc-color,#fff);background:var(--st-sc-bg,transparent);min-width:34px;text-align:right;font-variant-numeric:tabular-nums;padding-right:12px}
/* Score as a separate light box (scoreBox toggle) — full-height chip at the row end */
.bbug .sc.box{margin-left:8px;padding:0 12px;min-width:44px;text-align:center;align-self:stretch;display:flex;align-items:center;justify-content:center;background:var(--st-sc-bg,#f4f5f7);color:var(--st-sc-color,#0b0e13);font-size:var(--st-sc-size,24px)}
.bbug .main>.team:last-child .sc.box{background:var(--st-sc-bg,#e8eaed)}
.bbug .team.poss .abbr::before{content:'●';color:#27d17c;font-size:9px;margin-right:5px;vertical-align:middle}
.bbug .mid{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 15px;background:var(--st-gc-bg,rgba(0,0,0,.35));min-width:74px}
.bbug .clock{font-family:var(--st-gc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-gc-size,19px);color:var(--st-gc-color,#fff);line-height:1;font-variant-numeric:tabular-nums}
.bbug .per{font-family:var(--st-q-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:600;font-size:var(--st-q-size,11px);letter-spacing:.1em;color:var(--st-q-color,#ffd24a);text-transform:uppercase;margin-top:2px}
.bbug .shotc{font-family:var(--st-pc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-pc-size,13px);color:var(--st-pc-color,#ff8a3d);font-variant-numeric:tabular-nums;line-height:1;margin-top:3px}
.bbug .sub{display:flex;margin-top:4px;border-radius:5px;overflow:hidden;background:rgba(10,12,16,.9);height:22px}
.bbug .sub .cell{display:flex;align-items:center;gap:6px;padding:0 11px;font-family:'Barlow',sans-serif;font-weight:600;font-size:11px;color:#c9d2de}
.bbug .sub .cell .k{color:#5a6472;font-size:9.5px;text-transform:uppercase;letter-spacing:.1em}
.bbug .sub .cell.bonus{color:#ffd24a}.bbug .sub.hidden,.bbug .sub .cell.hidden{display:none}

.soonbug{min-width:420px;height:60px;border-radius:10px;background:rgba(9,11,15,.9);border:1px dashed var(--line2,#2e3846);display:flex;align-items:center;justify-content:center;gap:10px;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:19px;letter-spacing:.05em;color:#8a94a3;text-transform:uppercase}
.soonbug .d{width:9px;height:9px;border-radius:50%;background:#27d17c}

/* ===== TOL pips + play clock (football) ===== */
.pips{display:inline-flex;gap:3px;margin:0 6px;align-items:center}
.pip{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.35)}
.pip.on{background:#fff}
.fbug .clocktab .pc{font-family:var(--st-pc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-pc-size,15px);color:var(--sb-c-pc-fg,var(--st-pc-color,#ff8a3d));font-variant-numeric:tabular-nums}

/* ===== soccer + volleyball bugs (share the compact bar structure) ===== */
.sbug,.vbug{font-family:var(--bug-font,'Barlow Condensed'),sans-serif;display:inline-flex;flex-direction:column;filter:drop-shadow(0 6px 18px rgba(0,0,0,.55));user-select:none}
.sbug .main,.vbug .main{display:flex;align-items:stretch;border-radius:6px;overflow:hidden;background:rgba(10,12,16,.94);height:46px;perspective:320px}
.sbug .team,.vbug .team{display:flex;align-items:center;gap:9px}
.sbug .chip,.vbug .chip{width:7px;align-self:stretch}
.sbug .lg,.vbug .lg{width:26px;height:26px;margin-left:10px;object-fit:contain;border-radius:3px;background:rgba(255,255,255,.06)}
.sbug .lg.empty,.vbug .lg.empty{display:none}
.sbug .abbr,.vbug .abbr{font-weight:700;font-size:21px;letter-spacing:.04em;color:#fff;min-width:44px}
.sbug .sc,.vbug .sc{font-weight:800;font-size:26px;color:#fff;min-width:34px;text-align:right;font-variant-numeric:tabular-nums;padding-right:12px}
.sbug .mid,.vbug .mid{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 15px;background:rgba(0,0,0,.35);min-width:78px}
.sbug .clock{font-weight:700;font-size:19px;color:#fff;line-height:1;font-variant-numeric:tabular-nums}
.sbug .per,.vbug .per{font-weight:600;font-size:11px;letter-spacing:.1em;color:#ffd24a;text-transform:uppercase;margin-top:2px}
.vbug .per{font-size:13px}
.vbug .srv{color:#27d17c;font-size:9px;margin-right:5px;vertical-align:middle}
.vbug .sw{font-weight:800;font-size:15px;color:#ffd24a;margin-right:6px;min-width:14px;text-align:center}
.sbug .sub,.vbug .sub{display:flex;margin-top:4px;border-radius:5px;overflow:hidden;background:rgba(10,12,16,.9);height:22px}
.sbug .sub .cell,.vbug .sub .cell{display:flex;align-items:center;gap:6px;padding:0 11px;font-family:'Barlow',sans-serif;font-weight:600;font-size:11px;color:#c9d2de}
.sbug .sub .cell .k,.vbug .sub .cell .k{color:#5a6472;font-size:9.5px;text-transform:uppercase;letter-spacing:.1em}

/* ===== flip score animation (flip-clock tile) ===== */
.bbug .main,.sbug .main,.vbug .main{perspective:320px}
.sc{display:inline-block;transform-origin:center;backface-visibility:hidden}
.sc.flip{animation:scoreflip .30s ease-out}
@keyframes scoreflip{0%{transform:rotateX(-90deg);opacity:.15}55%{transform:rotateX(12deg)}100%{transform:rotateX(0);opacity:1}}

/* ===== score takeover (TOUCHDOWN / GOOOOAL) ===== */
/* Covers only the scorebug it replaces. Font sizes + text color are set inline by
   fireTakeover() (px, measured) so it renders in browsers without container queries. */
.takeover{position:absolute;inset:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3%;background:var(--tc);animation:tkin .35s ease-out;pointer-events:none;border-radius:8px;overflow:hidden}
.takeover::after{content:'';position:absolute;inset:0;background:radial-gradient(120% 100% at 50% 0%,rgba(255,255,255,.12),transparent 60%)}
.takeover img{position:relative;object-fit:contain;filter:drop-shadow(0 4px 10px rgba(0,0,0,.45))}
.takeover .tk-text{position:relative;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;font-weight:800;line-height:.92;letter-spacing:.14em;padding-left:.14em;color:#fff;text-transform:uppercase;white-space:nowrap}
.takeover .tk-row{position:relative;display:flex;align-items:center;justify-content:center;gap:.55em;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;font-weight:700;letter-spacing:.16em;padding-left:.16em;color:rgba(255,255,255,.92);text-transform:uppercase;white-space:nowrap}
.takeover.out{animation:tkout .45s ease-in forwards}
@keyframes tkin{0%{opacity:0;transform:scale(1.09)}100%{opacity:1;transform:scale(1)}}
@keyframes tkout{0%{opacity:1}100%{opacity:0}}

/* ============================================================
   TEMPLATE VARIANTS (reference-matched, refined)
   ============================================================ */

/* ---- Football — Broadcast Bar (rounded clock console, slanted ends) ---- */
.fbcast{display:inline-flex;align-items:flex-end;height:64px;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;user-select:none;
  filter:drop-shadow(0 8px 18px rgba(0,0,0,.5))}
.fbcast .tb{height:64px;display:flex;align-items:center;gap:13px;padding:0 20px;position:relative;background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(0,0,0,.24)),var(--tc)}
/* Slanted outer ends (splayed wider at the bottom). */
.fbcast .tb.away{padding-left:16px;border-radius:6px 0 0 6px}
.fbcast .tb.home{padding-right:16px;border-radius:0 6px 6px 0}
.fbcast .tb .lg{width:42px;height:42px;object-fit:contain;flex:none}.fbcast .tb .lg.empty{display:none}
.fbcast .tb .tmtext{display:flex;flex-direction:column;justify-content:center;min-width:0;align-items:flex-start}
.fbcast .tb.home .tmtext{align-items:flex-start;text-align:left}
.fbcast .tb .school{font-family:var(--st-tn-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-tn-size,var(--sch-size,13px));letter-spacing:.05em;line-height:1.05;color:var(--st-tn-color,rgba(255,255,255,.82));white-space:nowrap;text-transform:uppercase}
.fbcast .tb .nm{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-nm-size,var(--nm-size,27px));line-height:.96;letter-spacing:.02em;color:var(--st-nm-color,#fff);text-transform:uppercase;text-shadow:0 1px 2px rgba(0,0,0,.3)}
.fbcast .tb .nm .rk{font-weight:600;font-size:.58em;opacity:.85;vertical-align:top;margin-right:.26em;letter-spacing:0}
/* Timeout dashes sit under the name, lined up with the team text's inner edge
   (away = end, home = begin), and run a bit longer. */
.fbcast .tb .tol{display:flex;gap:6px;margin-top:5px}
.fbcast .tb.away .tol{align-self:flex-end}.fbcast .tb.home .tol{align-self:flex-start}
.fbcast .tb .tol .td{width:26px;height:4px;border-radius:2px;background:rgba(255,255,255,.26)}
.fbcast .tb .tol.tol-away .td.on,.fbcast .tb .tol.tol-home .td.on{background:var(--st-tol-color,#ffd21e)}
/* Big score flanking the console — a darker shade of the team color so it reads as its
   own panel next to the name section. */
.fbcast .sc{height:64px;display:flex;align-items:center;justify-content:center;gap:8px;min-width:48px;padding:0 16px;background:var(--st-sc-bg,linear-gradient(180deg,rgba(0,0,0,.30),rgba(0,0,0,.5)),var(--tc))}
.fbcast .sc .v{font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,36px);color:var(--st-sc-color,#fff);font-variant-numeric:tabular-nums;line-height:1;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.fbcast .sc .pd{width:10px;height:10px;border-radius:50%;background:#ffd21e;box-shadow:0 0 8px rgba(255,210,30,.7);flex:none;opacity:0;transition:opacity .2s}.fbcast .sc .pd.on{opacity:1}
/* Navy center block behind the console so the bar reads as one continuous shape. */
.fbcast .cxwrap{display:flex;align-items:flex-end;justify-content:center;align-self:flex-end;position:relative;z-index:2;height:64px;
  background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(0,0,0,.24)),var(--st-spine-color,#16294e)}
/* Console: a wide top that angles inward down to the narrower down-strip (the reference
   funnel shape). A thin white keyline (stacked drop-shadows) wraps just the box — not
   the team blocks. Tunable via --st-key-color. */
.fbcast .cx{position:relative;display:flex;flex-direction:column;align-items:center;z-index:3;height:64px;box-sizing:border-box;background:#f4f4ef;padding:0 3px 3px;
  border-radius:3px;border:2px solid var(--st-key-color,#fff);box-shadow:0 3px 8px rgba(0,0,0,.35)}
.fbcast .cx.hasbrand{padding-top:14px}
.fbcast .cx .cbrand{position:absolute;top:0;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:5px;height:15px;padding:0 9px 2px;z-index:1;white-space:nowrap}
.fbcast .cx .cbrand .cb-txt{font-family:var(--bug-font,'Barlow Condensed'),sans-serif;font-weight:800;font-size:9px;letter-spacing:.1em;color:#14284d}
.fbcast .cx .cbrand .cb-logo{height:12px;width:auto;object-fit:contain}
/* Top row: Quarter | clock | Ball on — navy on the white box, thin dividers. */
.fbcast .cx .ctop{display:flex;align-items:center;flex:1;padding:0 7px}
.fbcast .cx .cs{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 11px;gap:1px}
.fbcast .cx .cs .l{font-family:var(--st-q-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:10px;letter-spacing:.02em;color:#111;line-height:1;white-space:nowrap}
.fbcast .cx .cs .v{font-family:var(--bug-font,'Barlow Condensed'),sans-serif;font-weight:800;font-size:23px;color:#111;line-height:1;font-variant-numeric:tabular-nums}
/* Game clock in a regular yellow on the light console. */
.fbcast .cx .cclk{font-family:var(--st-gc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:27px;color:var(--st-gc-color,#e8bc1c);font-variant-numeric:tabular-nums;line-height:1;padding:0 13px;letter-spacing:.01em}
.fbcast .cx .cclk.fin{font-size:20px;color:#b3261e;letter-spacing:.04em}
.fbcast .cx .cdiv{width:1.5px;height:30px;background:rgba(0,0,0,.22);flex:none}
/* Bottom down-strip: a rounded navy band inset in the white box (white keyline around it). */
/* Square navy down-strip inset in the white box (white keyline shows around it). */
.fbcast .cx .cdrow{display:flex;align-items:center;justify-content:center;gap:11px;height:23px;padding:0 12px;margin:2px 3px 3px;background:#0b0b0b;border-radius:2px;align-self:stretch}
.fbcast .cx .cdrow .cd-dd{font-family:var(--st-dnd-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:17px;color:#fff;line-height:1;letter-spacing:.04em;white-space:nowrap}
.fbcast .cx .cdrow .cd-sep{width:4px;height:4px;border-radius:50%;background:rgba(255,255,255,.3);flex:none}
.fbcast .cx .cdrow .cd-pc{font-family:var(--st-pc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:16px;color:var(--st-pc-color,#ff9e2c);line-height:1;font-variant-numeric:tabular-nums;letter-spacing:.02em}
/* Inverted console: dark main box (no white keyline), light down-strip, flipped colors. */
.fbcast .cx.inv{background:#141618;border-color:transparent}
.fbcast .cx.inv .cs .l{color:#c7ccd4}
.fbcast .cx.inv .cs .v{color:#fff}
.fbcast .cx.inv .cclk{color:var(--st-gc-color,#ffd21e)}
.fbcast .cx.inv .cdiv{background:rgba(255,255,255,.22)}
.fbcast .cx.inv .cdrow{background:#f4f4ef}
.fbcast .cx.inv .cdrow .cd-dd{color:#111}
.fbcast .cx.inv .cdrow .cd-sep{background:rgba(0,0,0,.35)}

/* ---- Football — Angled Broadcast (chamfered center console) ---- */
/* Uniform-height bar: the two team blocks are forced to equal width (grid 1fr tracks)
   so the center console sits dead-centre. Console top and bottom line up flush with the
   teams (no poke); the console's bottom corners chamfer inward to tuck the down-strip,
   and the score panels' inner edges chamfer to mate against it. Console fill defaults to
   near-black and is operator-settable via --st-con-color. */
.fbang{display:inline-grid;grid-template-columns:minmax(min-content,1fr) auto auto auto minmax(min-content,1fr);align-items:stretch;height:var(--fbh,76px);
  font-family:var(--bug-font,'Barlow Condensed'),sans-serif;user-select:none;filter:drop-shadow(0 8px 18px rgba(0,0,0,.5))}
.fbang .tb{min-width:0;display:flex;align-items:center;gap:13px;padding:0 20px;position:relative;z-index:1;background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(0,0,0,.24)),var(--tc)}
/* Logo hugs the outer edge, name toward the score; the extra width on the shorter team
   opens up next to the console, keeping both blocks the same length. */
.fbang .tb.away{padding-left:16px;border-radius:6px 0 0 6px;justify-content:flex-start}
.fbang .tb.home{padding-right:16px;border-radius:0 6px 6px 0;justify-content:flex-end}
.fbang .tb .lg{width:44px;height:44px;object-fit:contain;flex:none}.fbang .tb .lg.empty{display:none}
.fbang .tb .tmtext{display:flex;flex-direction:column;justify-content:center;min-width:0;align-items:flex-start}
.fbang .tb.home .tmtext{align-items:flex-end}
.fbang .tb .school{font-family:var(--st-tn-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-tn-size,var(--sch-size,13px));letter-spacing:.05em;line-height:1.05;color:var(--st-tn-color,rgba(255,255,255,.82));white-space:nowrap;text-transform:uppercase}
.fbang .tb .nm{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-nm-size,var(--nm-size,27px));line-height:.96;letter-spacing:.02em;color:var(--st-nm-color,#fff);text-transform:uppercase;text-shadow:0 1px 2px rgba(0,0,0,.3);white-space:nowrap}
.fbang .tb .nm .rk{font-weight:600;font-size:.58em;opacity:.85;vertical-align:top;margin-right:.26em;letter-spacing:0}
.fbang .tb .tol{display:flex;gap:6px;margin-top:5px}
.fbang .tb.away .tol{align-self:flex-start}.fbang .tb.home .tol{align-self:flex-end}
.fbang .tb .tol .td{width:26px;height:4px;border-radius:2px;background:rgba(255,255,255,.26)}
.fbang .tb .tol.tol-away .td.on,.fbang .tb .tol.tol-home .td.on{background:var(--st-tol-color,#ffd21e)}
/* Score panels — equal fixed width so the console stays centered; darker shade of team
   color; rounded-corner boxes that butt up against the console (no overlap, not tucked
   under). A hair of separation on the inner edge keeps the rounded corners readable. */
.fbang .sc{width:86px;display:flex;align-items:center;justify-content:center;gap:8px;position:relative;z-index:2;background:var(--st-sc-bg,linear-gradient(180deg,rgba(0,0,0,.30),rgba(0,0,0,.5)),var(--tc))}
.fbang .sc.away{border-radius:0 9px 9px 0;margin-right:1px}
.fbang .sc.home{border-radius:9px 0 0 9px;margin-left:1px}
.fbang .sc .v{font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,36px);color:var(--st-sc-color,#fff);font-variant-numeric:tabular-nums;line-height:1;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.fbang .sc .pd{width:9px;height:9px;border-radius:50%;background:#ffd21e;box-shadow:0 0 8px rgba(255,210,30,.7);flex:none;opacity:0;transition:opacity .2s}.fbang .sc .pd.on{opacity:1}
/* Center console: solid black box with straight vertical sides (so the score boxes meet
   it flush, not under an overhang) but faceted/chamfered corners for an angled look. */
.fbang .cxwrap{position:relative;z-index:1;height:100%;display:flex;align-items:stretch;justify-content:center;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.4))}
.fbang .cx{position:relative;display:flex;flex-direction:column;align-items:center;min-width:248px;height:100%;box-sizing:border-box;
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,0)),var(--st-con-color,#0b0b0b);
  clip-path:polygon(13px 0,calc(100% - 13px) 0,100% 13px,100% calc(100% - 13px),calc(100% - 13px) 100%,13px 100%,0 calc(100% - 13px),0 13px)}
/* Top row: Quarter | clock | Play — white text, thin dividers. */
.fbang .cx .ctop{display:flex;align-items:center;flex:1;padding:0 20px}
.fbang .cx .cs{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 10px;gap:1px}
.fbang .cx .cs .l{font-family:var(--st-q-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:10px;letter-spacing:.02em;color:rgba(255,255,255,.72);line-height:1;white-space:nowrap}
.fbang .cx .cs .v{font-family:var(--bug-font,'Barlow Condensed'),sans-serif;font-weight:800;font-size:23px;color:#fff;line-height:1;font-variant-numeric:tabular-nums}
.fbang .cx .cclk{font-family:var(--st-gc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:27px;color:var(--st-gc-color,#fff);font-variant-numeric:tabular-nums;line-height:1;padding:0 12px;letter-spacing:.01em}
.fbang .cx .cclk.fin{font-size:20px;color:#ffcf33;letter-spacing:.04em}
.fbang .cx .cdiv{width:1.5px;height:26px;background:rgba(255,255,255,.2);flex:none}
/* Bottom down-strip in the narrow tuck — slightly darker inset band. */
.fbang .cx .cdrow{display:flex;align-items:center;justify-content:center;gap:11px;height:22px;margin-bottom:2px;padding:0 10px}
.fbang .cx .cdrow .cd-dd{font-family:var(--st-dnd-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:17px;color:#fff;line-height:1;letter-spacing:.04em;white-space:nowrap}

/* ---- Football — Classic (segmented broadcast lower-third) ---- */
.fbcl{display:inline-flex;align-items:stretch;gap:4px;height:52px;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 7px 18px rgba(0,0,0,.5));user-select:none}
.fbcl > *{border-radius:6px}
.fbcl .spon{display:flex;align-items:center;justify-content:center;padding:0 13px;background:linear-gradient(180deg,#ffffff,#dfe3e8);box-shadow:inset 0 0 0 1px rgba(0,0,0,.14)}
.fbcl .spon img{max-height:34px;max-width:112px;object-fit:contain;display:block}
.fbcl .spon.txt{font-weight:800;font-size:18px;letter-spacing:.02em;color:#0c0f14}
.fbcl .tm{display:flex;align-items:center;gap:10px;padding:0 10px 0 13px;position:relative;background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(0,0,0,.28)),var(--tc);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.fbcl .tm .pd{width:0;height:0;border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:9px solid #ffd21e;filter:drop-shadow(0 0 5px rgba(255,210,30,.7));flex:none;opacity:0;transition:opacity .2s}
.fbcl .tm .pd.on{opacity:1}
.fbcl .tm .ab{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-nm-size,26px);letter-spacing:.02em;color:var(--st-nm-color,#fff);text-transform:uppercase;line-height:1;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.fbcl .tm .lg{width:38px;height:38px;object-fit:contain;flex:none}
.fbcl .tm .tx{display:flex;flex-direction:column;justify-content:center;gap:3px;min-width:0}
.fbcl .tm .tol{display:flex;gap:4px}
.fbcl .tm .tol .td{width:13px;height:3px;border-radius:2px;background:rgba(255,255,255,.3)}
.fbcl .tm .tol-home .td.on,.fbcl .tm .tol-away .td.on{background:var(--st-tol-color,#fff)}
.fbcl .tm .sc{margin-left:auto;min-width:40px;padding:0 9px;height:38px;display:flex;align-items:center;justify-content:center;border-radius:5px;background:var(--st-sc-bg,linear-gradient(180deg,#fdfdfd,#c5cad1));box-shadow:inset 0 1px 0 rgba(255,255,255,.9),inset 0 -1px 3px rgba(0,0,0,.2);font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,28px);color:var(--st-sc-color,#12161d);font-variant-numeric:tabular-nums;line-height:1}
.fbcl .info{display:flex;align-items:stretch;overflow:hidden;background:var(--sb-c-clock-bg,linear-gradient(180deg,#232a33,#12161d));box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.fbcl .info .ic{display:flex;align-items:center;gap:9px;padding:0 13px}
.fbcl .info .q{font-family:var(--st-q-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:16px;color:#cfd6df;letter-spacing:.03em;text-transform:uppercase}
.fbcl .info .c{font-family:var(--st-gc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:24px;color:var(--st-gc-color,#fff);font-variant-numeric:tabular-nums;line-height:1}
.fbcl .info .c.fin{font-size:18px;color:#ffcf33;letter-spacing:.04em}
.fbcl .info .pc{display:flex;align-items:center;padding:0 11px;font-family:var(--st-pc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:22px;color:#fff;font-variant-numeric:tabular-nums;background:#c1272d;box-shadow:inset 0 1px 0 rgba(255,255,255,.22)}
.fbcl .info .pc.clklow{background:var(--st-warn-color,#ff2d33)}
.fbcl .dnd{display:flex;align-items:center;padding:0 16px;background:var(--sb-c-dnd-bg,linear-gradient(180deg,#fdfdfd,#c5cad1));box-shadow:inset 0 1px 0 rgba(255,255,255,.9);font-family:var(--st-dnd-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-dnd-size,19px);color:var(--st-dnd-color,#12161d);letter-spacing:.03em;text-transform:uppercase;white-space:nowrap}

/* ---- Football — Down & Distance banner (standalone on-field graphic) ----
   Coloured for the ball team; vertical gradient cap up front, arrow chevron at the
   end. Flatten / rotate / skew (inline transform) lay it onto the yard lines; flip
   mirrors direction (the text is counter-flipped so it still reads correctly). */
.fbdd{display:inline-flex;align-items:center;gap:7px;height:52px;transform-origin:center bottom;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 8px 20px rgba(0,0,0,.55));user-select:none}
.fbdd .body{position:relative;display:flex;align-items:center;height:100%;background:var(--dd-bg,#0b0d10);border:var(--dd-bd,0 solid transparent);border-radius:3px;box-shadow:inset 0 1px 0 rgba(255,255,255,.14),inset 0 -2px 4px rgba(0,0,0,.28)}
.fbdd .cap{position:absolute;left:0;top:0;bottom:0;width:12px;border-radius:3px 0 0 3px;background:linear-gradient(180deg,var(--dd-fg,#fff),var(--dd-bg,#0b0d10))}
.fbdd .dd{padding:0 22px 0 26px;font-family:var(--st-dnd-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-dnd-size,28px);letter-spacing:.05em;color:var(--dd-fg,#fff);text-transform:uppercase;white-space:nowrap;line-height:1;text-shadow:0 1px 2px rgba(0,0,0,.28)}
.fbdd .arw{width:26px;height:74%;flex:none;background:var(--dd-acc,#fff);clip-path:polygon(0 0,55% 0,100% 50%,55% 100%,0 100%,45% 50%)}
.fbdd.flip .dd{transform:scaleX(-1)}

/* ---- Football — Score Bar (single row) ---- */
.fbar{display:inline-flex;align-items:stretch;height:56px;border-radius:8px;overflow:hidden;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 7px 18px rgba(0,0,0,.5));user-select:none;perspective:420px}
.fbar .tm{display:flex;align-items:center;gap:10px;padding:0 15px 0 13px;background:linear-gradient(180deg,rgba(255,255,255,.15),rgba(0,0,0,.2)),var(--tc)}
.fbar .tm .lg{width:34px;height:34px;object-fit:contain;flex:none}.fbar .tm .lg.empty{display:none}
.fbar .tm .tmtext{display:flex;flex-direction:column;justify-content:center;gap:1px;min-width:0}
.fbar .tm .school{font-family:var(--st-tn-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-tn-size,var(--school-size,11px));line-height:1;letter-spacing:.04em;color:var(--st-tn-color,rgba(255,255,255,.82));white-space:nowrap}
.fbar .tm .nm{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-nm-size,var(--nm-size,23px));line-height:1;letter-spacing:.02em;color:var(--st-nm-color,#fff);white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.fbar .tm .nm .rk{font-weight:600;font-size:.6em;opacity:.85;vertical-align:top;margin-right:.24em}
.fbar .tm .rec{font-weight:700;font-size:10px;letter-spacing:.04em;line-height:1;margin-top:2px;color:rgba(255,255,255,.7)}
.fbar .tm .tol{display:flex;gap:4px}.fbar .tm .tol .tl{width:15px;height:3px;border-radius:2px;background:rgba(255,255,255,.36)}.fbar .tm .tol-home .tl.on{background:var(--st-tol-home-color,var(--st-tol-color,#fff))}.fbar .tm .tol-away .tl.on{background:var(--st-tol-away-color,var(--st-tol-color,#fff))}
.fbar .tm .pd{color:#ffd24a;font-size:12px;margin:0 -4px 0 -2px;flex:none}
/* Logo only: crest (+ possession) + a vertical timeout dot column, no name gap. */
.fbar .tm.logoonly{gap:10px;padding:0 13px}
.fbar .tm .todots{display:flex;flex-direction:column;justify-content:center;gap:4px;flex:none}
.fbar .tm .todots .td{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.34)}
.fbar .tm .todots.tol-home .td.on{background:var(--st-tol-home-color,var(--st-tol-color,#ffd24a))}
.fbar .tm .todots.tol-away .td.on{background:var(--st-tol-away-color,var(--st-tol-color,#ffd24a))}
.fbar .sc{display:flex;align-items:center;justify-content:center;min-width:46px;padding:0 14px;background:var(--st-sc-bg,linear-gradient(180deg,rgba(255,255,255,.15),rgba(0,0,0,.2)),var(--tc));color:var(--st-sc-color,#fff);font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,31px);font-variant-numeric:tabular-nums;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.fbar .sc.box{padding:0 12px;background:var(--st-sc-bg,#f4f5f7);color:var(--st-sc-color,#0b0e13);text-shadow:none}
.fbar .sc.box[data-side="away"]{background:var(--st-sc-bg,#e8eaed)}
.fbar .data{display:flex;align-items:center;gap:14px;padding:0 18px;background:var(--sb-c-clock-bg,#0b0e13);color:#fff}
.fbar .data .pc{font-family:var(--st-pc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-pc-size,17px);color:var(--st-pc-color,#ff9e2c);font-variant-numeric:tabular-nums}
.fbar .data .c{font-family:var(--st-gc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-gc-size,24px);color:var(--st-gc-color,#fff);font-variant-numeric:tabular-nums}
.fbar .data .q{font-family:var(--st-q-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-q-size,17px);color:var(--st-q-color,#ffd24a)}
.fbar .dnd{display:flex;align-items:center;padding:0 17px;background:var(--sb-c-dnd-bg,#222834);font-family:var(--st-dnd-font,var(--bug-font,'Barlow Condensed')),sans-serif;color:var(--st-dnd-color,#ffd24a);font-weight:700;font-size:var(--st-dnd-size,18px);letter-spacing:.03em;white-space:nowrap}

/* ---- Soccer — score bar + clock (right / below) ---- */
/* Soccer score bar — crest + school + nickname, score, center clock (time + half) */
.socbug{display:inline-flex;align-items:center;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 8px 22px rgba(0,0,0,.55));user-select:none}
.socbug .tm{display:flex;align-items:center;gap:9px;height:44px;padding:0 15px;background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(0,0,0,.22)),var(--tc)}
.socbug .tm.home{border-radius:8px 0 0 8px}
.socbug .tm.away{border-radius:0 8px 8px 0}
.socbug .smono{display:flex;flex-direction:column;line-height:1;min-width:0}
.socbug .tm.away .smono{align-items:flex-end}
.socbug .school{font-family:var(--st-tn-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-tn-size,10px);letter-spacing:.03em;color:var(--st-tn-color,rgba(255,255,255,.82));white-space:nowrap}
.socbug .nm{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-nm-size,21px);letter-spacing:.04em;color:var(--st-nm-color,#fff);text-shadow:0 1px 2px rgba(0,0,0,.4);white-space:nowrap}
.socbug .crest{width:28px;height:28px;border-radius:5px;object-fit:contain;flex:none}
.socbug .crest.empty{background:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px}
/* Score — inline on the team-color block (default) or a separate white box (.box) */
.socbug .sc{display:flex;align-items:center;justify-content:center;min-width:40px;height:44px;padding:0 12px;background:var(--st-sc-bg,linear-gradient(180deg,rgba(255,255,255,.16),rgba(0,0,0,.22)),var(--tc));color:var(--st-sc-color,#fff);font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,23px);font-variant-numeric:tabular-nums;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.socbug .sc.box{padding:0;background:var(--st-sc-bg,#f4f5f7);color:var(--st-sc-color,#0b0e13);text-shadow:none}
.socbug .sc.box[data-side="away"]{background:var(--st-sc-bg,#e8eaed)}
.socbug .clk{display:flex;flex-direction:column;align-items:center;justify-content:center;height:44px;min-width:92px;padding:0 14px;background:var(--st-gc-bg,var(--info-bg,#0a0d12))}
.socbug .clk .t{font-family:var(--st-gc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-gc-size,20px);color:var(--st-gc-color,#fff);font-variant-numeric:tabular-nums;line-height:1}
.socbug .clk .h{font-family:var(--st-q-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-q-size,10px);letter-spacing:.1em;text-transform:uppercase;color:var(--st-q-color,#ffd24a);margin-top:3px}

.socbar{display:inline-flex;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 7px 18px rgba(0,0,0,.5));user-select:none}
.socbar.right{align-items:center;gap:9px}
.socbar.below{flex-direction:column;align-items:center}
.socbar .barrow{display:inline-flex;align-items:stretch;height:40px;border-radius:8px;overflow:hidden;perspective:420px}
.socbar .tm{display:flex;align-items:center;gap:9px;padding:0 14px;background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(0,0,0,.2)),var(--tc)}
.socbar .tm .lg{width:24px;height:24px;object-fit:contain}.socbar .tm .lg.empty{display:none}
.socbar .tm .nm{font-weight:800;font-size:19px;letter-spacing:.04em;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.socbar .sc.box{display:flex;align-items:center;justify-content:center;min-width:36px;background:var(--st-sc-bg,#f4f5f7);color:var(--st-sc-color,#0b0e13);font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,21px);font-variant-numeric:tabular-nums}
.socbar .sc.box[data-side="home"]{box-shadow:inset -1px 0 0 rgba(0,0,0,.12)}
.socbar .sc.box[data-side="away"]{background:var(--st-sc-bg,#e8eaed)}
.socbar .clockbox{display:inline-flex;align-items:center;gap:10px;height:32px;padding:0 15px;background:var(--st-gc-bg,#0b0e13);color:#fff;border-radius:7px;font-weight:700;font-variant-numeric:tabular-nums;box-shadow:0 5px 14px rgba(0,0,0,.45)}
.socbar .clockbox .c{font-family:var(--st-gc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-size:var(--st-gc-size,17px);color:var(--st-gc-color,#fff)}
.socbar .clockbox .h{font-family:var(--st-q-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-size:var(--st-q-size,13px);color:var(--st-q-color,#ffd24a);letter-spacing:.08em}
.socbar.below .clockbox.under{margin-top:7px}
.socbar .sub{display:flex;margin-top:6px;border-radius:6px;overflow:hidden;background:rgba(10,12,16,.9);height:22px}
.socbar .sub .cell{display:flex;align-items:center;gap:6px;padding:0 11px;font-family:'Barlow',sans-serif;font-weight:600;font-size:11px;color:#c9d2de}
.socbar .sub .cell .k{color:#5a6472;font-size:9.5px;text-transform:uppercase;letter-spacing:.1em}

/* ---- Soccer — penalty shootout (made ● / missed ✕ / upcoming numbered box) ---- */
.pkbug{display:inline-flex;flex-direction:column;gap:3px;padding:8px;border-radius:12px;background:#0b0e13;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 8px 22px rgba(0,0,0,.55));user-select:none}
.pkrow{display:flex;align-items:center;gap:10px;height:44px;padding:0 8px}
.pkrow .flag{width:38px;height:26px;object-fit:cover;border-radius:4px;flex:none;box-shadow:0 0 0 1px rgba(255,255,255,.16)}
.pkrow .flag.empty{display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px;color:#fff}
.pkrow .ab{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-nm-size,26px);letter-spacing:.04em;color:var(--st-nm-color,#fff);min-width:62px}
.pkrow .pk{display:flex;align-items:center;justify-content:center;min-width:38px;height:34px;border-radius:7px;background:#35d0c4;color:#06201e;font-weight:800;font-size:24px;font-variant-numeric:tabular-nums}
.pkrow .pkdiv{width:2px;align-self:stretch;margin:6px 3px;background:rgba(255,255,255,.2);border-radius:1px}
.pkrow .kicks{display:flex;align-items:center;gap:6px}
.pkrow .k{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:7px;font-weight:800;font-size:16px;flex:none;font-variant-numeric:tabular-nums}
.pkrow .k.pend{background:#eef0f3;color:#0b0e13}
.pkrow .k.miss{background:#dc4636;color:#fff;font-size:15px}
.pkrow .k.made{background:#2ea94d}
.pkrow .k.made i{width:15px;height:15px;border-radius:50%;border:3px solid rgba(255,255,255,.92)}
.pkbug.decided .pkrow:not(.win){opacity:.72}
.pkrow.win .pk{background:#7ef0a6;color:#04220f}

/* ---- Volleyball — two-row grid (simple / set scores) ---- */
.vwrap{display:inline-flex;flex-direction:column;align-items:center;gap:5px}
.vclock{display:inline-flex;align-items:center;gap:12px;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;font-weight:800;color:#fff;background:var(--st-gc-bg,rgba(10,12,16,.94));border-radius:5px;padding:3px 14px;letter-spacing:.02em;font-variant-numeric:tabular-nums;filter:drop-shadow(0 5px 14px rgba(0,0,0,.5))}
.vclock .vsetn{font-family:var(--st-q-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-size:var(--st-q-size,13px);letter-spacing:.06em;color:var(--st-q-color,#ffd24a)}
.vclock .vclk-t{font-family:var(--st-gc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-size:var(--st-gc-size,15px);color:var(--st-gc-color,#fff)}
.vgrid{display:inline-grid;grid-auto-rows:27px;gap:0;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;background:#0b0e13;border-radius:5px;overflow:hidden;filter:drop-shadow(0 7px 18px rgba(0,0,0,.5));user-select:none;perspective:420px}
.vgrid .vrow{display:contents}
.vgrid .lg{width:26px;height:100%;object-fit:contain;background:#161b22}
.vgrid .lg.empty{background:var(--tc)}
.vgrid .nm{display:flex;align-items:center;padding:0 11px;font-weight:800;font-size:16px;letter-spacing:.03em;color:#fff;background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(0,0,0,.18)),var(--tc);white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.3)}
.vgrid .nm .srv{color:#27d17c;font-size:9px;margin-left:9px;vertical-align:middle}
.vgrid .tol{display:flex;align-items:center;justify-content:center;background:#12161d}
.vgrid .tol .pips{margin:0}
.vgrid .setsc{display:flex;align-items:center;justify-content:center;font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,18px);color:var(--st-sc-color,#fff);background:var(--st-sc-bg,#1b2230);font-variant-numeric:tabular-nums}
.vgrid .setcell{display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;color:#8a94a3;background:#12161d;font-variant-numeric:tabular-nums}
.vgrid .won{display:flex;align-items:center;justify-content:center;font-family:var(--st-sw-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sw-size,18px);color:var(--st-sw-color,#0b0e13);background:var(--st-sw-bg,#e8eaed);font-variant-numeric:tabular-nums}

/* ---- Volleyball — Classic (wide bar: name + record, set score, SET box,
   sets-won summary "<leader> N SETS TO M" / "TIED 1-1") ---- */
.vcl{display:inline-flex;align-items:stretch;height:52px;border-radius:8px;overflow:hidden;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 7px 18px rgba(0,0,0,.5));user-select:none;background:#0b0e13}
.vcl .tm{display:flex;align-items:center;gap:11px;padding:0 15px;background:linear-gradient(180deg,rgba(255,255,255,.15),rgba(0,0,0,.2)),var(--tc);min-width:0}
.vcl .tm .lg{width:32px;height:32px;object-fit:contain;flex:none}
.vcl .tm .tx{display:flex;flex-direction:column;justify-content:center;gap:3px;min-width:0}
.vcl .tm .nm{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-nm-size,21px);letter-spacing:.02em;color:var(--st-nm-color,#fff);line-height:1;white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.vcl .tm .nm .rk{font-weight:600;font-size:.6em;opacity:.85;vertical-align:top;margin-right:.3em;letter-spacing:0}
.vcl .tm .nm .srv{color:#27d17c;font-size:.46em;vertical-align:middle;margin-left:.5em}
.vcl .tm .rec{font-weight:600;font-size:9.5px;color:rgba(255,255,255,.66);line-height:1;letter-spacing:.03em}
.vcl .tm .sc{display:flex;align-items:center;justify-content:center;font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,26px);color:var(--st-sc-color,#fff);background:var(--st-sc-bg,transparent);font-variant-numeric:tabular-nums;margin-left:auto;padding-left:16px;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.vcl .setn{display:flex;align-items:center;justify-content:center;min-width:66px;padding:0 15px;background:var(--st-q-bg,#12161d);font-family:var(--st-q-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-q-size,15px);color:var(--st-q-color,#cdd3dd);letter-spacing:.06em;white-space:nowrap}
.vcl .wins{display:flex;align-items:center;justify-content:center;min-width:118px;padding:0 20px;background:var(--st-sw-bg,#1b2230);font-family:var(--st-sw-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sw-size,18px);color:var(--st-sw-color,#fff);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}

/* Volleyball Marquee — mirrored bar: team | sets won | set score, serve arrow in
   the middle, step-by-step scores under (hidden by default). */
.vbar{display:inline-flex;flex-direction:column;align-items:center;gap:6px;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;user-select:none}
.vb-row{display:inline-flex;align-items:stretch;height:52px;border-radius:8px;overflow:hidden;background:#0b0e13;filter:drop-shadow(0 7px 18px rgba(0,0,0,.5));box-shadow:inset 0 0 0 1.5px rgba(233,185,35,.4)}
.vb-side{display:flex;align-items:stretch}
.vb-team{display:flex;align-items:center;gap:10px;padding:0 15px;background:linear-gradient(180deg,rgba(255,255,255,.15),rgba(0,0,0,.2)),var(--tc);min-width:0}
.vb-team .lg{width:32px;height:32px;object-fit:contain;flex:none}
.vb-team .lg.empty{display:none}
.vb-team .nm{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-nm-size,21px);letter-spacing:.02em;color:var(--st-nm-color,#fff);white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.vb-sets{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:42px;padding:0 10px;background:var(--st-sw-bg,#e8eaed);color:var(--st-sw-color,#0b0e13);line-height:1}
.vb-sets .k{font-size:8px;font-weight:800;letter-spacing:.13em;color:#9a7d1e;margin-bottom:2px}
.vb-sets .v{font-family:var(--st-sw-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sw-size,20px);color:var(--st-sw-color,#0b0e13);font-variant-numeric:tabular-nums}
.vb-side .sc{display:flex;align-items:center;justify-content:center;min-width:46px;padding:0 12px;font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,28px);color:var(--st-sc-color,#0b0e13);background:var(--st-sc-bg,#f2c14e);font-variant-numeric:tabular-nums}
/* Per-team score-box background (each falls back to the shared bg, then stock). */
.vb-side.home .sc{background:var(--st-sc-home-bg,var(--st-sc-bg,#f2c14e))}
.vb-side.away .sc{background:var(--st-sc-away-bg,var(--st-sc-bg,#f2c14e))}
/* Center console: set number (top) · serve arrow · timeout clock (bottom). */
.vb-mid{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:24px;padding:0 6px;background:#0b0e13}
.vb-serve{display:flex;align-items:center;justify-content:center;color:#f2c14e;font-size:13px;line-height:1}
.vb-setn{font-family:var(--st-q-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-size:9px;font-weight:800;letter-spacing:.1em;color:var(--st-q-color,#9aa4b2);white-space:nowrap}
.vb-clk{font-family:var(--st-gc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-size:12px;font-weight:800;color:var(--st-gc-color,#f2c14e);font-variant-numeric:tabular-nums;line-height:1}
/* Name + timeout dots as a column when timeouts are shown. */
.vb-nmcol{display:flex;flex-direction:column;justify-content:center;gap:2px;min-width:0;align-items:flex-start}
.vb-side.R .vb-nmcol{align-items:flex-end}
.vb-nmcol .nm{line-height:1.02}
.vb-school{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:11px;letter-spacing:.04em;text-transform:uppercase;line-height:1;color:var(--st-nm-color,#fff);opacity:.72;white-space:nowrap}
.vb-to{display:flex;gap:4px}
.vb-side.R .vb-to{justify-content:flex-end}
.vb-to .d{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.28)}
.vb-to.tol-home .d.on{background:var(--st-tol-home-color,var(--st-tol-color,#fff))}
.vb-to.tol-away .d.on{background:var(--st-tol-away-color,var(--st-tol-color,#fff))}
.vb-steps{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:6px}
.vb-steps .stp{display:inline-flex;align-items:center;gap:6px;background:rgba(10,12,16,.92);border-radius:5px;padding:3px 10px;font-weight:700;font-size:12px;color:#cdd3dd;font-variant-numeric:tabular-nums;filter:drop-shadow(0 4px 12px rgba(0,0,0,.45))}
.vb-steps .stp .n{font-size:9px;font-weight:800;letter-spacing:.08em;color:#8a94a3;background:rgba(255,255,255,.08);border-radius:3px;padding:1px 5px}
.vb-steps .stp i{color:#5a6472;font-style:normal;margin:0 1px}

/* ===== volleyball broadcast (message bar + big set score + sets-won) ===== */
.vbc{display:inline-flex;flex-direction:column;min-width:300px;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;border-radius:8px;overflow:hidden;filter:drop-shadow(0 7px 18px rgba(0,0,0,.5));user-select:none;background:linear-gradient(180deg,#2b323b 0%,#171b21 62%,#0e1116 100%)}
.vbc-msg{text-align:center;font-family:var(--st-msg-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--st-msg-color,#fff);font-size:var(--st-msg-size,13px);padding:5px 14px;background:var(--st-msg-bg,linear-gradient(180deg,#3b434d,#232830));border-bottom:1px solid rgba(0,0,0,.4)}
.vbc-body{display:flex;align-items:stretch}
.vbc-half{flex:1;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 16px;min-width:0}
.vbc-team{display:flex;align-items:center;gap:9px;min-width:0}
.vbc .lg{width:40px;height:40px;object-fit:contain;flex:none}
.vbc .lg.empty{width:6px;height:40px;background:var(--tc);border-radius:2px}
.vbc-ab{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-nm-size,21px);letter-spacing:.02em;color:var(--st-nm-color,#fff);white-space:nowrap}
.vbc-srv{color:#27d17c;font-size:9px;margin-left:6px;vertical-align:middle}
.vbc-scw{display:flex;flex-direction:column;align-items:center;gap:4px}
.vbc-half.L .vbc-scw{margin-left:16px}
.vbc-half.R .vbc-scw{margin-right:16px}
.vbc-sc{font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,34px);line-height:1;color:var(--st-sc-color,#fff);font-variant-numeric:tabular-nums;text-shadow:0 1px 3px rgba(0,0,0,.4)}
.vbc-to{display:flex;gap:3px}
.vbc-to .b{width:14px;height:3px;border-radius:2px;background:rgba(255,255,255,.22)}
.vbc-to .b.on{background:var(--st-tol-color,#ffd24a)}
.vbc-div{width:1px;background:rgba(255,255,255,.14);margin:8px 0}
.vbc-sets{display:flex;align-items:center;justify-content:center;gap:9px;padding:4px 0 6px;font-family:var(--st-sw-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sw-size,15px);color:var(--st-sw-color,#cdd4dd);letter-spacing:.1em;background:rgba(0,0,0,.28);font-variant-numeric:tabular-nums}
.vbc-sets i{font-style:normal;opacity:.5}

/* ===== volleyball breakboard (set-by-set board) ===== */
.vbk{display:inline-flex;flex-direction:column;min-width:340px;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;border-radius:8px;overflow:hidden;filter:drop-shadow(0 7px 18px rgba(0,0,0,.5));user-select:none;background:linear-gradient(180deg,#20252c,#12151a)}
.vbk-h{text-align:center;font-family:var(--st-msg-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--st-msg-color,#fff);font-size:var(--st-msg-size,13px);padding:6px 14px;background:var(--st-msg-bg,linear-gradient(180deg,#3b434d,#232830));border-bottom:1px solid rgba(0,0,0,.4)}
.vbk-row{display:flex;align-items:center;gap:12px;padding:10px 16px;background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(0,0,0,.22)),var(--tc)}
.vbk-row+.vbk-row{border-top:1px solid rgba(0,0,0,.35)}
.vbk .lg{width:44px;height:44px;object-fit:contain;flex:none}
.vbk .lg.empty{width:8px;height:44px;background:rgba(0,0,0,.28);border-radius:2px}
.vbk-ab{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-nm-size,22px);color:var(--st-nm-color,#fff);letter-spacing:.02em;min-width:60px;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.vbk-cells{display:flex;align-items:center;gap:14px;margin-left:auto}
.vbk-cell{font-weight:700;font-size:18px;color:rgba(255,255,255,.82);font-variant-numeric:tabular-nums;min-width:20px;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.vbk-cell.live{color:var(--st-sc-color,#ffe08a);font-weight:800}
.vbk-won{font-family:var(--st-sw-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sw-size,30px);color:var(--st-sw-color,#fff);min-width:34px;text-align:right;font-variant-numeric:tabular-nums;padding-left:6px;text-shadow:0 1px 3px rgba(0,0,0,.45)}

/* ===== tennis ===== */
/* Two stacked rows with a GAME + set-number header between them:
   name | game score (0/15/30/40) | games per set. */
.tnbug{display:inline-block;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 7px 18px rgba(0,0,0,.5));user-select:none}
.tngrid{display:inline-grid;grid-auto-rows:minmax(26px,auto);background:#0b0e13;border-radius:6px;overflow:hidden}
.tngrid>span{display:flex;align-items:center}
/* Header strip (row 1): muted labels over the game + set columns. */
.tngrid .tnh{justify-content:center;font-family:'Barlow',sans-serif;font-weight:700;font-size:10px;letter-spacing:.06em;color:#8a94a3;background:#12161d}
.tngrid .tnh.nm{background:#12161d}
.tngrid .tnh.gm{color:#c9d2de}
/* Team name block (team color). */
.tngrid .tnnm{gap:9px;padding:5px 11px;background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(0,0,0,.2)),var(--tc);min-width:0}
.tngrid .tnnm .lg{width:22px;height:22px;object-fit:contain;flex:none}
.tngrid .tnnm .lg.empty{display:none}
.tngrid .tnnm .tntext{display:flex;flex-direction:column;justify-content:center;gap:1px;min-width:0}
/* Small line: team name (or nickname) above the large player/nickname line. */
.tngrid .tnnm .tnsub{font-family:var(--st-tn-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-tn-size,10.5px);letter-spacing:.03em;line-height:1.05;color:var(--st-tn-color,rgba(255,255,255,.74));white-space:nowrap}
.tngrid .tnnm .nm{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-nm-size,17px);letter-spacing:.02em;line-height:1.02;color:var(--st-nm-color,#fff);white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.3)}
.tngrid .tnnm .srv{color:#eaff3a;font-size:9px;margin-left:auto;flex:none;align-self:center}
/* Game score (the live 0/15/30/40 or tiebreak count). */
.tngrid .tngm{justify-content:center;font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,18px);color:var(--st-sc-color,#fff);background:var(--st-sc-bg,#171d27);font-variant-numeric:tabular-nums}
/* Per-set games; the live (current) set is highlighted. */
.tngrid .tnst{justify-content:center;font-weight:700;font-size:15px;color:#aeb7c4;background:#12161d;font-variant-numeric:tabular-nums}
.tngrid .tnst.live{color:#fff;background:#1b2230}

/* score-flip works on the boxed scores too */
.fbar .sc,.socbar .sc,.vgrid .setsc,.vb-side .sc{transform-origin:center;backface-visibility:hidden}

/* ===== baseball ===== */
.bbbug{display:inline-flex;align-items:stretch;height:74px;border-radius:7px;overflow:hidden;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 7px 18px rgba(0,0,0,.5));user-select:none;background:#0b0e13}
.bbbug .bbteams{display:flex;flex-direction:column}
.bbbug .bbrow{display:flex;align-items:center;gap:8px;height:37px;padding:0 12px 0 10px;min-width:150px;background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(0,0,0,.2)),var(--tc)}
/* Logo only: no abbreviation, so drop the min-width and let the crest sit right by the score. */
.bbbug.logoonly .bbrow{min-width:0;padding-right:10px}
.bbbug .bbrow .lg{width:24px;height:24px;object-fit:contain;flex:none}.bbbug .bbrow .lg.empty{display:none}
.bbbug .bbrow .ab{font-weight:800;font-size:19px;letter-spacing:.03em;color:var(--st-nm-color,#fff);text-shadow:0 1px 2px rgba(0,0,0,.35)}
.bbbug .bbrow .sc{margin-left:auto;font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,23px);color:var(--st-sc-color,#fff);background:var(--st-sc-bg,transparent);font-variant-numeric:tabular-nums;min-width:26px;text-align:right}
/* Score as a separate white box (scoreBox toggle); sits flush to the center block */
.bbbug.scorebox .bbrow{padding-right:0}
.bbbug .bbrow .sc.box{margin-left:auto;padding:0;min-width:42px;text-align:center;align-self:stretch;display:flex;align-items:center;justify-content:center;background:var(--st-sc-bg,#f4f5f7);color:var(--st-sc-color,#0b0e13);text-shadow:none}
.bbbug .bbrow.away .sc.box{background:var(--st-sc-bg,#e8eaed)}
/* center: inning arrows + bases diamond + outs */
.bbcenter{display:flex;align-items:center;gap:12px;padding:0 15px;background:#12161d}
/* small optional running-time clock (youth time-limit stopwatch) */
.bbcenter .bbclock .t{font-family:var(--st-gc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-gc-size,14px);color:var(--st-gc-color,#cfe0ee);font-variant-numeric:tabular-nums;letter-spacing:.02em;background:var(--st-gc-bg,#0b0e13);border-radius:5px;padding:3px 7px;line-height:1}
.bbinn{display:flex;flex-direction:column;align-items:center;line-height:.8}
.bbinn .ar{font-size:11px;color:#3a434f}.bbinn .ar.on{color:#ffcb2b}
.bbinn .innum{font-weight:800;font-size:26px;color:#fff;margin:1px 0}
.bbmid{display:flex;flex-direction:column;align-items:center;gap:5px}
.bbdia{position:relative;width:30px;height:30px}
.bbdia .bs{position:absolute;width:13px;height:13px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.3);transform:rotate(45deg)}
.bbdia .bs.on{background:#ffcb2b;border-color:#ffcb2b}
.bbdia .bs.second{top:0;left:50%;margin-left:-6.5px}
.bbdia .bs.third{top:50%;left:0;margin-top:-6.5px}
.bbdia .bs.first{top:50%;right:0;margin-top:-6.5px}
.bbouts{display:flex;gap:6px}
.bbouts .od{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.22)}
.bbouts .od.on{background:#ff4d4d}
/* right: count + pitches */
.bbright{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:0 15px;background:#0b0e13;min-width:64px}
.bbcount{font-weight:800;font-size:23px;color:#fff;font-variant-numeric:tabular-nums}
.bbcount.fin{font-size:17px;color:#ffcb2b;letter-spacing:.05em}
.bbpitch{font-weight:700;font-size:10px;color:#8a94a3;letter-spacing:.03em}.bbpitch .k{color:#5a6472}
/* side-by-side scorebug */
.bbbar{display:inline-flex;align-items:stretch;height:52px;border-radius:7px;overflow:hidden;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 7px 18px rgba(0,0,0,.5));user-select:none;background:#0b0e13}
.bbbar .tm{display:flex;align-items:center;gap:9px;padding:0 13px;background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(0,0,0,.2)),var(--tc)}
.bbbar .tm.logoonly{padding:0 11px}
.bbbar .tm .lg{width:30px;height:30px;object-fit:contain;flex:none}.bbbar .tm .lg.empty{display:none}
.bbbar .tm .tmtext{display:flex;flex-direction:column;justify-content:center}
.bbbar .tm .school{font-weight:700;font-size:11px;letter-spacing:.04em;color:rgba(255,255,255,.82)}
.bbbar .tm .nm{font-weight:800;font-size:20px;letter-spacing:.02em;color:#fff;line-height:1;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.bbbar .sc{display:flex;align-items:center;justify-content:center;min-width:40px;padding:0 13px;background:var(--st-sc-bg,linear-gradient(180deg,rgba(255,255,255,.14),rgba(0,0,0,.2)),var(--tc));color:var(--st-sc-color,#fff);font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,26px);font-variant-numeric:tabular-nums;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.bbbar .sc.box{padding:0;background:var(--st-sc-bg,#f4f5f7);color:var(--st-sc-color,#0b0e13);text-shadow:none}
.bbbar .sc.box[data-side="away"]{background:var(--st-sc-bg,#e8eaed)}
.bbbar .bbcenter{background:#12161d}
.bbbar .bbright{background:#0b0e13}
/* linescore board */
.bbline{display:inline-flex;flex-direction:column;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;background:#0b0e13;border-radius:6px;overflow:hidden;filter:drop-shadow(0 7px 18px rgba(0,0,0,.5));user-select:none}
.bbline .lrow{display:flex;align-items:center;height:34px;border-top:1px solid rgba(255,255,255,.05)}
.bbline .lrow.lhead{height:26px;background:#12161d;border-top:0}
.bbline .lrow.away{background:linear-gradient(90deg,var(--tc),rgba(0,0,0,.15))}
.bbline .lrow.home{background:linear-gradient(90deg,var(--tc),rgba(0,0,0,.15))}
.bbline .lgpad{width:0}
.bbline .lg{width:22px;height:22px;object-fit:contain;margin-left:9px;flex:none}.bbline .lg.empty{display:none}
.bbline .ab{width:52px;padding-left:9px;font-weight:800;font-size:15px;color:#fff;letter-spacing:.02em;white-space:nowrap}
.bbline .lhead .ab{width:52px}
.bbline .lcells{display:flex}
.bbline .lc{width:24px;text-align:center;font-weight:700;font-size:15px;color:#dfe4ea;font-variant-numeric:tabular-nums}
.bbline .lhead .lc.inh{color:#8a94a3;font-size:12px;font-weight:700}
.bbline .rc{width:26px;text-align:center;font-weight:800;font-size:16px;color:#fff;font-variant-numeric:tabular-nums;background:rgba(0,0,0,.28)}
.bbline .rc.rh{color:#8a94a3;font-size:12px}
.bbline .lrow .rc:first-of-type{color:#ffcb2b}

/* ===== basketball — ESPN-style bar ===== */
/* Grid so the two team blocks are always equal width (1fr each) regardless of
   content — a BONUS badge on one side no longer makes that block wider. */
.bkbar{display:inline-grid;grid-template-columns:1fr auto auto auto 1fr;align-items:stretch;height:58px;border-radius:7px;overflow:hidden;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 7px 18px rgba(0,0,0,.5));user-select:none;background:#0b0e13}
.bkbar .tm{display:flex;align-items:center;gap:11px;padding:0 15px;background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(0,0,0,.2)),var(--tc);min-width:0}
.bkbar .tm.away{justify-content:flex-start}
.bkbar .tm.home{justify-content:flex-end}
.bkbar .tm .lg{width:36px;height:36px;object-fit:contain;flex:none}.bkbar .tm .lg.empty{display:none}
.bkbar .tm .tmtext{display:flex;flex-direction:column;justify-content:center;gap:2px}
.bkbar .tm.home .tmtext{align-items:flex-end}
.bkbar .tm .nm{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-nm-size,21px);color:var(--st-nm-color,#fff);letter-spacing:.02em;line-height:1;text-shadow:0 1px 2px rgba(0,0,0,.35);white-space:nowrap}
.bkbar .tm .nm .rk{font-weight:600;font-size:.6em;opacity:.85;vertical-align:top;margin-right:.28em;letter-spacing:0}
.bkbar .tm .rec{font-weight:600;font-size:9.5px;color:rgba(255,255,255,.68);line-height:1;letter-spacing:.03em}
.bkbar .tm .meta{display:flex;gap:9px;font-size:13px;font-weight:700;letter-spacing:.05em;line-height:1;margin-top:3px}
.bkbar .tm .meta .fl{color:rgba(255,255,255,.6)}
.bkbar .tm .meta .bn{color:#ffcb2b}
/* timeouts-left as a vertical dot column, pinned toward the score */
/* Logo only: crest with fouls/bonus as small text beneath it. */
.bkbar .tm.logoonly .tmlogo{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.bkbar .tm.logoonly .meta{font-size:9px;gap:6px;margin-top:0;justify-content:center;letter-spacing:.04em}
.bkbar .tm .todots{display:flex;flex-direction:column;justify-content:center;gap:4px;padding:0 2px;flex:none}
/* Timeout dots hug the inner (score) edge and mirror between the two teams. */
.bkbar .tm.away .todots{margin-left:auto}
.bkbar .tm.home .todots{margin-right:auto}
.bkbar .tm .todots .td{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.28)}
.bkbar .tm .todots.tol-home .td.on{background:var(--st-tol-home-color,#ffd24a)}
.bkbar .tm .todots.tol-away .td.on{background:var(--st-tol-away-color,#ffd24a)}
.bkbar .sc{display:flex;align-items:center;justify-content:center;min-width:48px;padding:0 14px;background:var(--st-sc-bg,linear-gradient(180deg,rgba(255,255,255,.14),rgba(0,0,0,.2)),var(--tc));color:var(--st-sc-color,#fff);font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,30px);font-variant-numeric:tabular-nums;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.bkbar .sc.box{padding:0;background:var(--st-sc-bg,#f4f5f7);color:var(--st-sc-color,#0b0e13);text-shadow:none}
.bkbar .sc.box[data-side="away"]{background:var(--st-sc-bg,#e8eaed)}
.bkbar .bkmid{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 16px;background:var(--st-gc-bg,#12161d);min-width:66px}
.bkbar .bkmid .c{font-family:var(--st-gc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-gc-size,20px);color:var(--st-gc-color,#fff);font-variant-numeric:tabular-nums}
.bkbar .bkmid .q{font-family:var(--st-q-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-q-size,12px);color:var(--st-q-color,#ffcb2b);letter-spacing:.03em}
.bkbar .bkmid .sclk{font-family:var(--st-pc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-pc-size,13px);color:var(--st-pc-color,#ff8a3d);font-variant-numeric:tabular-nums;line-height:1;margin-top:2px}

/* ===== basketball — Classic (wide bar: name + TO/FOULS/BONUS, inline score,
   period / clock / shot-clock boxes) ===== */
.bkcl{display:inline-flex;align-items:stretch;height:64px;border-radius:8px;overflow:hidden;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 7px 18px rgba(0,0,0,.5));user-select:none;background:#0b0e13}
.bkcl .tm{display:flex;align-items:center;gap:12px;padding:0 16px;background:linear-gradient(180deg,rgba(255,255,255,.15),rgba(0,0,0,.2)),var(--tc);min-width:0}
.bkcl .tm .lg{width:40px;height:40px;object-fit:contain;flex:none}
.bkcl .tm .tx{display:flex;flex-direction:column;justify-content:center;gap:5px;min-width:0;flex:0 1 auto}
.bkcl .tm .nm{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-nm-size,24px);letter-spacing:.02em;color:var(--st-nm-color,#fff);line-height:1;white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.bkcl .tm .nm .rk{font-weight:600;font-size:.6em;opacity:.85;vertical-align:top;margin-right:.3em;letter-spacing:0}
.bkcl .tm .nm .pd{color:#ffd24a;font-size:.46em;vertical-align:middle;margin-right:.34em}
/* timeouts-left as thin bars beneath the name */
.bkcl .tm .tolbars{display:flex;gap:5px}
.bkcl .tm .tolbars .tl{width:22px;height:4px;border-radius:2px;background:rgba(255,255,255,.30)}
.bkcl .tm .tolbars.tol-home .tl.on{background:var(--st-tol-home-color,#ffd24a)}
.bkcl .tm .tolbars.tol-away .tl.on{background:var(--st-tol-away-color,#ffd24a)}
/* Timeout style options: numeric "TO 3" under the name, or a vertical dot column
   to the right of the name (before the score). */
.bkcl .tm .tonum{display:inline-flex;align-items:baseline;gap:5px;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;font-weight:800;font-size:15px;color:#fff;line-height:1;font-variant-numeric:tabular-nums}
.bkcl .tm .tonum i{font-style:normal;font-size:10px;font-weight:700;color:rgba(255,255,255,.6);letter-spacing:.05em}
.bkcl .tm .todots{display:flex;flex-direction:column;justify-content:center;gap:4px;flex:none;margin-left:2px}
.bkcl .tm .todots .td{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.28)}
.bkcl .tm .todots.tol-home .td.on{background:var(--st-tol-home-color,#ffd24a)}
.bkcl .tm .todots.tol-away .td.on{background:var(--st-tol-away-color,#ffd24a)}
/* fouls + bonus — a dark chip sitting close to the name (equal min-width on both
   sides so the two team blocks read the same with or without a bonus badge) */
.bkcl .tm .fbox{display:flex;align-items:center;justify-content:center;gap:8px;flex:none;padding:5px 11px;background:rgba(0,0,0,.30);border-radius:7px}
.bkcl .tm .fbox .fl{font-weight:800;font-size:18px;color:#fff;line-height:1;font-variant-numeric:tabular-nums;white-space:nowrap}
.bkcl .tm .fbox .fl i{font-style:normal;font-size:10px;font-weight:700;color:rgba(255,255,255,.62);margin-right:5px;letter-spacing:.05em}
.bkcl .tm .fbox .bn{font-weight:800;font-size:13px;color:#0b0e13;background:#ffcb2b;border-radius:4px;padding:3px 7px;letter-spacing:.02em;line-height:1}
/* Score number. A custom score-box color (--st-score-bg) turns it into a rounded chip;
   left transparent by default so it reads as plain text on the team color. */
.bkcl .tm .sc{display:flex;align-items:center;justify-content:center;font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,34px);color:var(--st-sc-color,#fff);font-variant-numeric:tabular-nums;flex:none;margin-left:auto;padding:2px 14px;border-radius:8px;background:var(--st-sc-bg,var(--st-score-bg,transparent));text-shadow:0 1px 2px rgba(0,0,0,.4)}
.bkcl .per{display:flex;align-items:center;justify-content:center;min-width:58px;padding:0 12px;background:var(--st-q-bg,#12161d);font-family:var(--st-q-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-q-size,16px);color:var(--st-q-color,#ffcb2b);letter-spacing:.04em}
.bkcl .clk{display:flex;align-items:center;justify-content:center;min-width:106px;padding:0 16px;background:var(--st-gc-bg,#1b2230);font-family:var(--st-gc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-gc-size,30px);color:var(--st-gc-color,#fff);font-variant-numeric:tabular-nums}
.bkcl .shot{display:flex;align-items:center;justify-content:center;min-width:52px;padding:0 12px;background:var(--st-pc-bg,#12161d);font-family:var(--st-pc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-pc-size,22px);color:var(--st-pc-color,#ff8a3d);font-variant-numeric:tabular-nums}

/* ===== Basketball Simple — name + score over a smaller darker stat strip, then
   quarter/clock and a full-height shot clock ===== */
.bksimple{display:inline-flex;align-items:stretch;height:64px;border-radius:8px;overflow:hidden;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 7px 18px rgba(0,0,0,.5));user-select:none;background:#0b0e13}
.bksimple .tm{display:flex;flex-direction:column;min-width:0;background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(0,0,0,.14)),var(--tc)}
/* Name + big score row. */
.bksimple .tm .head{flex:1;display:flex;align-items:center;gap:10px;padding:0 15px;min-width:0}
.bksimple .tm .head .lg{width:34px;height:34px;object-fit:contain;flex:none}.bksimple .tm .head .lg.empty{display:none}
.bksimple .tm .head .nm{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-nm-size,23px);letter-spacing:.02em;color:var(--st-nm-color,#fff);line-height:1;white-space:nowrap;text-transform:uppercase;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.bksimple .tm .head .nm .rk{font-weight:600;font-size:.58em;opacity:.85;vertical-align:top;margin-right:.28em;letter-spacing:0}
.bksimple .tm .head .sc{margin-left:auto;padding-left:14px;font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,32px);color:var(--st-sc-color,#fff);background:var(--st-sc-bg,transparent);font-variant-numeric:tabular-nums;line-height:1;text-shadow:0 1px 2px rgba(0,0,0,.4)}
/* Timeout dots option: a vertical dot column to the right of the name, before the score. */
.bksimple .tm .head .todots{display:flex;flex-direction:column;justify-content:center;gap:4px;flex:none;margin-left:auto}
.bksimple .tm .head .todots+.sc{margin-left:14px}
.bksimple .tm .head .todots .td{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.3)}
.bksimple .tm .head .todots.tol-home .td.on,.bksimple .tm .head .todots.tol-away .td.on{background:var(--st-tol-color,#ffd21e)}
/* Smaller stat strip: a darker shade of the team color, a line separating it above. */
.bksimple .tm .stats{display:flex;align-items:center;gap:13px;height:20px;padding:0 15px;background:rgba(0,0,0,.30);box-shadow:inset 0 1px 0 rgba(255,255,255,.22)}
.bksimple .tm .stats .st{font-weight:800;font-size:12px;color:rgba(255,255,255,.92);line-height:1;font-variant-numeric:tabular-nums;white-space:nowrap}
.bksimple .tm .stats .st i{font-style:normal;font-size:10px;font-weight:700;color:rgba(255,255,255,.6);margin-right:5px;letter-spacing:.05em}
.bksimple .tm .stats .bn{font-weight:800;font-size:11px;color:#0b0e13;background:#ffcb2b;border-radius:4px;padding:2px 6px;letter-spacing:.02em;line-height:1}
/* Quarter, game clock and shot clock — three separate full-height sections. */
.bksimple .q{display:flex;align-items:center;justify-content:center;min-width:54px;padding:0 12px;background:var(--st-q-bg,#12161d);font-family:var(--st-q-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-q-size,17px);letter-spacing:.04em;color:var(--st-q-color,#ffcb2b);line-height:1}
.bksimple .clk{display:flex;align-items:center;justify-content:center;min-width:100px;padding:0 16px;background:var(--st-gc-bg,#1b2230);font-family:var(--st-gc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-gc-size,30px);color:var(--st-gc-color,#fff);font-variant-numeric:tabular-nums;line-height:1}
.bksimple .shot{display:flex;align-items:center;justify-content:center;min-width:50px;padding:0 12px;background:var(--st-pc-bg,#12161d)}
.bksimple .shot span{font-family:var(--st-pc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-pc-size,30px);color:var(--st-pc-color,#ff8a3d);font-variant-numeric:tabular-nums;line-height:1}
.bksimple .shot.clklow span{color:var(--st-warn-color,#ff2f2f)}

/* ===== Basketball Players — two vertical roster panels (#, PTS, F) ===== */
.bkplayers{display:inline-flex;gap:14px;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 8px 22px rgba(0,0,0,.55));user-select:none}
.bkplayers .bp-team{display:flex;flex-direction:column;min-width:264px;border-radius:9px;overflow:hidden;background:rgba(11,14,19,.96)}
.bkplayers .bp-hdr{display:flex;align-items:center;gap:10px;padding:9px 14px;background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(0,0,0,.22)),var(--tc)}
.bkplayers .bp-hdr .lg{width:30px;height:30px;object-fit:contain;flex:none}.bkplayers .bp-hdr .lg.empty{display:none}
.bkplayers .bp-hdr .bp-nm{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:21px;color:var(--st-nm-color,#fff);letter-spacing:.02em;white-space:nowrap;text-transform:uppercase;min-width:0;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.bkplayers .bp-hdr .bp-sc{font-weight:800;font-size:26px;color:#fff;font-variant-numeric:tabular-nums;margin-left:auto;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.bkplayers .bp-colhead{display:flex;padding:5px 14px;background:rgba(255,255,255,.05);font-size:11px;font-weight:700;letter-spacing:.06em;color:#8a94a3}
.bkplayers .bp-colhead .num{flex:1}.bkplayers .bp-colhead .pts{width:58px;text-align:center}.bkplayers .bp-colhead .f{width:42px;text-align:center}
.bkplayers .bp-row{display:flex;align-items:center;padding:7px 14px;border-top:1px solid rgba(255,255,255,.05)}
.bkplayers .bp-row .num{flex:1;font-weight:800;font-size:20px;color:#fff;font-variant-numeric:tabular-nums}
.bkplayers .bp-row .num::before{content:"#";font-size:.7em;opacity:.55;margin-right:1px}
.bkplayers .bp-row .pts{width:58px;text-align:center;font-weight:800;font-size:20px;color:#fff;font-variant-numeric:tabular-nums}
.bkplayers .bp-row .f{width:42px;text-align:center;font-weight:700;font-size:18px;color:#ffcb2b;font-variant-numeric:tabular-nums}
.bkplayers .bp-empty{padding:14px;color:#5a6472;font-size:15px;text-align:center}

/* ===== Basketball Player Ticker — thin lower-third strip; each cell breaks out
   the jersey #, PTS and F ===== */
.bkpbar{display:inline-flex;align-items:stretch;height:54px;border-radius:7px;overflow:hidden;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 6px 16px rgba(0,0,0,.5));user-select:none;background:#0b0e13}
.bkpbar .ptside{display:flex;align-items:center;gap:10px;padding:0 13px;background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(0,0,0,.2)),var(--tc);min-width:0}
.bkpbar .ptabbr{font-weight:800;font-size:18px;color:#fff;letter-spacing:.03em;flex:none;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.bkpbar .ptchips{display:flex;gap:7px;overflow:hidden}
.bkpbar .pcell{display:inline-flex;align-items:center;gap:9px;background:rgba(0,0,0,.28);border-radius:6px;padding:4px 10px;flex:none}
.bkpbar .pcell.dim{color:#5a6472}
.bkpbar .pcell .p-num{font-weight:800;font-size:20px;color:#fff;font-variant-numeric:tabular-nums;line-height:1}
.bkpbar .pcell .p-num::before{content:"#";font-size:.6em;opacity:.6;margin-right:.5px}
.bkpbar .pcell .p-stat{display:flex;flex-direction:column;align-items:center;line-height:1}
.bkpbar .pcell .p-stat b{font-weight:800;font-size:17px;color:#fff;font-variant-numeric:tabular-nums}
.bkpbar .pcell .p-stat i{font-style:normal;font-size:8px;font-weight:700;letter-spacing:.07em;color:rgba(255,255,255,.5);margin-top:2px}
.bkpbar .pcell .p-stat.f b{color:#ffcb2b}

/* ===== lacrosse — soccer bar + shot clock ===== */
.socbug.lax .shotclk{display:flex;flex-direction:column;align-items:center;justify-content:center;height:44px;min-width:40px;padding:0 9px;background:#1c1206;border-left:1px solid rgba(0,0,0,.35)}
.socbug.lax .shotclk i{font-style:normal;font-size:8px;font-weight:700;letter-spacing:.12em;color:#8a6a3a;line-height:1}
.socbug.lax .shotclk .scn{font-weight:800;font-size:22px;color:#ff8a3d;font-variant-numeric:tabular-nums;line-height:1.05}

/* ===== goal-sport stat strip (lacrosse / field hockey): centered under the bar ===== */
.gwrap{display:inline-flex;flex-direction:column;align-items:center;gap:5px}
.gstats{display:inline-flex;gap:6px;background:rgba(12,16,22,.92);border-radius:7px;padding:5px 9px}
.gstats .gs{display:inline-flex;align-items:center;gap:5px;font-weight:700;font-size:13px;color:#eef3f9;font-variant-numeric:tabular-nums;white-space:nowrap}
.gstats .gs i{font-style:normal;font-size:9px;font-weight:800;letter-spacing:.1em;color:#9aa6b4}

/* ---- Stack layout: two team rows + right clock box + optional info strip ----
   Shared by the Soccer / Football / Basketball "Stack" templates. Score is inline
   on the team-color row by default; .scorebox flips it to a separate white box. */
.stackbug{display:inline-flex;flex-direction:column;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 8px 22px rgba(0,0,0,.55));user-select:none;border-radius:8px;overflow:hidden}
.stackbug .core{display:flex;align-items:stretch}
.stackbug .rows{display:flex;flex-direction:column;min-width:250px;flex:1}
.stackbug .row{display:flex;align-items:center;gap:10px;min-height:34px;padding:0 0 0 13px;background:linear-gradient(180deg,rgba(255,255,255,.15),rgba(0,0,0,.20)),var(--tc)}
.stackbug .row+.row{box-shadow:inset 0 1px 0 rgba(0,0,0,.32)}
.stackbug .crest{width:24px;height:24px;border-radius:4px;object-fit:contain;flex:none}
.stackbug .nmwrap{display:flex;flex-direction:column;line-height:1;min-width:0;flex:1}
.stackbug .school{font-family:var(--st-tn-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-tn-size,9px);letter-spacing:.04em;color:var(--st-tn-color,rgba(255,255,255,.8));white-space:nowrap}
.stackbug .nm{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-nm-size,18px);letter-spacing:.04em;color:var(--st-nm-color,#fff);text-shadow:0 1px 2px rgba(0,0,0,.4);white-space:nowrap}
/* Score — inline on the team row (default) */
.stackbug .sc{font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-sc-size,20px);color:var(--st-sc-color,#fff);background:var(--st-sc-bg,transparent);min-width:24px;text-align:center;font-variant-numeric:tabular-nums;flex:none;padding:0 6px;text-shadow:0 1px 2px rgba(0,0,0,.4);align-self:stretch;display:flex;align-items:center;justify-content:center}
/* Score — separate white box (scoreBox toggle); flush to the clock box (no
   team-color sliver past the white box) */
.stackbug.scorebox .row{padding-right:0}
.stackbug.scorebox .sc{background:var(--st-sc-bg,#f4f5f7);color:var(--st-sc-color,#0b0e13);text-shadow:none;min-width:40px}
.stackbug.scorebox .row.away .sc{background:var(--st-sc-bg,#e8eaed)}
/* Optional per-team stat column (goal sports): label + value list between the
   name and the score. Rows grow taller to fit it. */
.stackbug.gs .row{height:auto;min-height:52px;padding-top:4px;padding-bottom:4px}
.stackbug .statcol{display:flex;flex-direction:column;justify-content:center;gap:3px;flex:none;padding:0 12px}
.stackbug .statcol .sline{display:flex;align-items:center;gap:8px;line-height:1}
.stackbug .statcol .sline i{font-style:normal;font-weight:700;font-size:9px;letter-spacing:.05em;color:rgba(255,255,255,.62);min-width:24px}
.stackbug .statcol .sline b{font-weight:800;font-size:13px;color:#fff;font-variant-numeric:tabular-nums;min-width:14px;text-align:right}
/* Basketball Stack: taller rows to fit timeout bars under the name plus a
   per-team fouls/bonus box between the name and the score */
.stackbug.bk .row{min-height:42px}
.stackbug.bk .nmwrap .foulline{display:flex;align-items:center;gap:6px;margin-top:4px;white-space:nowrap}
.stackbug.bk .nmwrap .foulline .fl{font-weight:800;font-size:11px;letter-spacing:.04em;color:rgba(255,255,255,.82);font-variant-numeric:tabular-nums}
.stackbug.bk .nmwrap .foulline .bn{font-weight:800;font-size:10px;color:#0b0e13;background:#ffcb2b;border-radius:3px;padding:1px 5px;line-height:1.2}
.stackbug.bk .todots{display:flex;flex-direction:column;justify-content:center;gap:3px;flex:none;padding:0 12px}
.stackbug.bk .todots .td{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.30)}
.stackbug.bk .todots.tol-home .td.on{background:var(--st-tol-home-color,#ffd24a)}
.stackbug.bk .todots.tol-away .td.on{background:var(--st-tol-away-color,#ffd24a)}
/* Football stack — record + timeout bars under each name (taller rows to fit). */
.stackbug.fb .row{min-height:44px}
/* Possession marker (a small football shape) by the score of the team with the ball. */
.stackbug .row .pmark{flex:none;width:0;height:0;margin-right:4px;
  border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:9px solid #ffd21e;
  filter:drop-shadow(0 0 4px rgba(255,210,30,.6))}
.stackbug.fb .nmwrap .fbline{display:flex;align-items:center;gap:9px;margin-top:4px;white-space:nowrap}
.stackbug.fb .nmwrap .rec{font-weight:700;font-size:11px;letter-spacing:.03em;color:rgba(255,255,255,.72);line-height:1}
.stackbug.fb .nmwrap .tol{display:flex;gap:4px}
.stackbug.fb .nmwrap .tol .tl{width:16px;height:3px;border-radius:2px;background:rgba(255,255,255,.32)}
.stackbug.fb .nmwrap .tol.tol-home .tl.on{background:var(--st-tol-home-color,var(--st-tol-color,#fff))}
.stackbug.fb .nmwrap .tol.tol-away .tl.on{background:var(--st-tol-away-color,var(--st-tol-color,#fff))}
.stackbug .clkbox{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;background:var(--info-bg,#0a0d12);padding:0 11px;min-width:64px}
.stackbug .clkbox .t{font-family:var(--st-gc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:var(--st-gc-size,20px);color:var(--st-gc-color,#fff);font-variant-numeric:tabular-nums;line-height:1}
.stackbug .clkbox .h{font-family:var(--st-q-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-q-size,10px);letter-spacing:.08em;text-transform:uppercase;color:var(--st-q-color,#cdd3dd);line-height:1}
.stackbug .clkbox .sh{font-weight:800;font-size:var(--st-pc-size,13px);color:var(--st-pc-color,#ff8a3d);font-variant-numeric:tabular-nums;line-height:1}
.stackbug .clkbox .pc{font-weight:800;font-size:var(--st-pc-size,13px);color:var(--st-pc-color,#ff8a3d);font-variant-numeric:tabular-nums;line-height:1}
.stackbug .clkbox .pc.clklow,.stackbug .clkbox .sh.clklow{color:var(--st-warn-color,#ff2f2f)}
.stackbug .clkbox .info{font-family:var(--st-dnd-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-dnd-size,9px);letter-spacing:.04em;text-transform:uppercase;color:var(--st-dnd-color,#aeb6c4);line-height:1;white-space:nowrap;margin-top:1px}
/* Optional info strip below the rows (down & distance, fouls…) */
.stackbug .infobar{display:flex;align-items:center;justify-content:center;min-height:20px;background:rgba(0,0,0,.55);font-family:var(--st-dnd-font,var(--bug-font,'Barlow Condensed')),sans-serif;color:var(--st-dnd-color,#e7ebf2);font-weight:700;font-size:var(--st-dnd-size,11px);letter-spacing:.05em;text-transform:uppercase}
.stackbug .infobar i{font-style:normal;opacity:.5;margin:0 8px}

/* ---------------- FULL-HEIGHT LOGO (per-overlay "Logo size: Full height") ----------------
   Grows the crest to fill the bar's box height while keeping its aspect ratio
   (height drives, width:auto follows). Bars only — stacks and bugs have no rule
   here and keep the standard logo. On the flex bars each .tm stretches to the bar
   height, so calc(100% - Npx) leaves a little breathing room top and bottom. */
/* NOTE: the `fulllogo` modifier is added to the FIRST class in the rendered HTML —
   usually the template root itself (class="fulllogo fbar"), but for stacks with a
   stat column it's an outer wrapper (class="fulllogo gwrap") with the bar nested.
   So match BOTH the compound (same element) and descendant (wrapped) forms. */
.fulllogo.fbar .tm .lg,.fulllogo .fbar .tm .lg{height:calc(100% - 8px);width:auto;max-height:none}
.fulllogo.bbbar .tm .lg,.fulllogo .bbbar .tm .lg{height:calc(100% - 8px);width:auto;max-height:none}
/* bkbar is an inline-GRID, not a flex bar: a percentage logo height resolves against the
   grid item's own (content-driven) height, so calc(100%) balloons to the image's natural
   size and is clipped by the bar. Use a fixed size like the other grid templates. */
.fulllogo.bkbar .tm .lg,.fulllogo .bkbar .tm .lg{width:46px;height:46px;max-height:none}
.fulllogo.socbug .tm .crest,.fulllogo .socbug .tm .crest{height:calc(100% - 10px);width:auto;max-height:none;border-radius:5px}
/* Give the crest and the name a touch more air so the taller logo doesn't crowd the
   text; the football bar re-equalizes both team boxes (fitFootball) after render, so
   longer names still get the room they need and never clip against the score box. */
.fulllogo.fbar .tm,.fulllogo .fbar .tm{gap:12px}
.fulllogo.bbbar .tm,.fulllogo .bbbar .tm{gap:11px}
.fulllogo.bkbar .tm,.fulllogo .bkbar .tm{gap:13px}

/* Full-height logo for the remaining templates. Where the logo's row has a FIXED height
   (fbcast 64px, pkrow 44px, bbbug 37px) we fill it with calc(100% - Npx); everywhere else
   the row height is content-driven, so a percentage height would resolve to `auto` and
   blow the image up to its natural size — there we step up to a larger FIXED size that
   reads as "max logo" without overflowing. Each rule matches both the compound (modifier
   on the root) and descendant (modifier on an outer .gwrap wrapper) forms, and is one
   class deeper than the base rule so it wins on specificity. */
.fulllogo.fbug .tb .lg,.fulllogo .fbug .tb .lg{width:60px;height:60px}
.fulllogo.fbcast .tb .lg,.fulllogo .fbcast .tb .lg{height:calc(100% - 10px);width:auto;max-height:none}
.fulllogo.fbang .tb .lg,.fulllogo .fbang .tb .lg{width:58px;height:58px}
.fulllogo.fbcl .tm .lg,.fulllogo .fbcl .tm .lg{width:50px;height:50px}
.fulllogo.bbug .team .lg,.fulllogo .bbug .team .lg{width:36px;height:36px}
.fulllogo.bkcl .tm .lg,.fulllogo .bkcl .tm .lg{width:52px;height:52px}
.fulllogo.bksimple .head .lg,.fulllogo .bksimple .head .lg{width:46px;height:46px}
.fulllogo.bkplayers .bp-hdr .lg,.fulllogo .bkplayers .bp-hdr .lg{width:40px;height:40px}
.fulllogo.pkbug .pkrow .flag,.fulllogo .pkbug .pkrow .flag{height:calc(100% - 8px);width:auto;max-height:none}
.fulllogo.vcl .tm .lg,.fulllogo .vcl .tm .lg{width:44px;height:44px}
.fulllogo.vbar .vb-team .lg,.fulllogo .vbar .vb-team .lg{width:44px;height:44px}
.fulllogo .vgrid .lg{width:34px;height:100%}
.fulllogo.bbbug .bbrow .lg,.fulllogo .bbbug .bbrow .lg{height:calc(100% - 8px);width:auto;max-height:none}
.fulllogo.bbline .lrow .lg,.fulllogo .bbline .lrow .lg{width:30px;height:30px}
.fulllogo .tngrid .tnnm .lg{width:30px;height:30px}
/* All stack templates share .stackbug .crest — one rule covers football / basketball /
   soccer / lacrosse / field-hockey stacks (wrapped as class="fulllogo gwrap"). */
.fulllogo.stackbug .row .crest,.fulllogo .stackbug .row .crest{width:34px;height:34px}
/* 'Full' logo tier (.maxlogo, added alongside .fulllogo) — the crest covers the ENTIRE bar
   height, edge to edge, like a broadcast school badge. Bar templates only; other templates
   keep the .fulllogo (middle) size. */
.fulllogo.maxlogo.fbar .tm .lg,.fulllogo.maxlogo .fbar .tm .lg,
.fulllogo.maxlogo.bbbar .tm .lg,.fulllogo.maxlogo .bbbar .tm .lg,
.fulllogo.maxlogo.fbcast .tb .lg,.fulllogo.maxlogo .fbcast .tb .lg,
.fulllogo.maxlogo.socbug .tm .crest,.fulllogo.maxlogo .socbug .tm .crest,
.fulllogo.maxlogo.pkbug .pkrow .flag,.fulllogo.maxlogo .pkbug .pkrow .flag,
.fulllogo.maxlogo.bbbug .bbrow .lg,.fulllogo.maxlogo .bbbug .bbrow .lg{height:100%;width:auto;max-height:none;border-radius:0}

/* Low play/shot clock warning — turns red (default) at/under the threshold (≤5s). */
.clklow{color:var(--st-warn-color,#ff2f2f)!important}

/* Manual penalty flag + message bar (football, horizontal templates). Both are pinned
   to the top of the flagged team's box and clipped to the box width so long labels
   ellipsize instead of overflowing. Penalty is broadcast yellow (--pen-bg/--pen-tx);
   the message bar is team-colored (set inline) and a touch smaller. Anchored at top:0
   so they survive the overflow:hidden on .fbug/.fbar. On the Pro banner both stack in a
   .topnotes column so a penalty and a message never overlap. */
.penflag,.msgbar{box-sizing:border-box;width:100%;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;
  letter-spacing:.05em;text-transform:uppercase;text-align:center;padding:1px 8px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none;line-height:1.35}
.penflag{background:var(--pen-bg,#ffd21e);color:var(--pen-tx,#151515);font-weight:800;font-size:10px;box-shadow:0 1px 3px rgba(0,0,0,.4)}
.msgbar{font-weight:700;font-size:8.5px;letter-spacing:.03em}
/* Overlay frame: the bug in the middle, with the penalty/message row and the event-title
   strip added IN-FLOW above/below (via CSS order) so the whole overlay is one box that
   stays within the safe area. .sb-frame.flip swaps the two ends (title top, notes bottom). */
.sb-frame{position:relative;display:flex;flex-direction:column;align-items:center;gap:5px}
/* Advertising layer — sponsor logos to the left/right of the bug and a banner strip below it.
   Positioned outside the bug box so ads never nudge the scorebar; sized in JS to line up. */
.sb-ads{position:absolute;inset:0;pointer-events:none;z-index:3}
.sb-ad{position:absolute;display:flex;align-items:center;justify-content:center}
.sb-ad img{object-fit:contain;display:block;border-radius:4px;filter:drop-shadow(0 3px 10px rgba(0,0,0,.45))}
.sb-ad img.fade{animation:sbAdFade .5s ease}
@keyframes sbAdFade{from{opacity:0}to{opacity:1}}
/* Side logos are sized by the bug's height (set in JS); the banner by its width. */
.sb-ad-left,.sb-ad-right{bottom:0}
.sb-ad-left img,.sb-ad-right img{height:100%;width:auto;max-width:220px}
.sb-ad-left{right:100%;margin-right:12px}
.sb-ad-right{left:100%;margin-left:12px}
.sb-ad-banner{top:100%;left:0;margin-top:8px;justify-content:flex-start}
.sb-ad-banner img{width:100%;height:auto;max-height:120px}
/* The penalty/message row floats ABOVE the bug (absolute) rather than sitting in-flow, so
   turning a penalty on never nudges the scorebar. Flip drops it below instead. */
.sb-frame>.sb-notes{position:absolute;left:0;right:0;bottom:100%;margin-bottom:5px;z-index:4}
.sb-frame.flip>.sb-notes{bottom:auto;top:100%;margin-bottom:0;margin-top:5px}
.sb-frame>.sb-eventtitle{order:1}
.sb-frame.flip>.sb-eventtitle{order:-1}
/* Penalty flag + message bar row — each team's note pinned to its own side. */
.sb-notes{align-self:stretch;display:flex}
.sb-note{display:flex;flex-direction:column;gap:4px;width:46%}
.sb-note.l{margin-right:auto}
.sb-note.r{margin-left:auto}
.sb-note .penflag,.sb-note .msgbar{width:100%;border-radius:4px;padding:2px 11px;font-size:11px}
.sb-note .msgbar{font-size:10px}
/* Event-title strip — a standalone chip centered above/below the bar. */
.sb-eventtitle{white-space:nowrap;background:linear-gradient(180deg,#232b36,#141a22);border-radius:6px;padding:3px 15px;
  font-family:var(--st-msg-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:700;font-size:var(--st-msg-size,11px);
  letter-spacing:.14em;text-transform:uppercase;color:var(--st-msg-color,#c4cdd8);box-shadow:0 6px 16px rgba(0,0,0,.4)}

/* ===== Ice hockey — stacked two-team board (crest · abbr · goals), a narrow SOG column and
   the period + game clock on the right, with a broadcast title strip on top and an optional
   team-coloured POWER PLAY bar below (ESPN/TNT-style lower third). ===== */
.hk{display:inline-flex;flex-direction:column;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;filter:drop-shadow(0 8px 22px rgba(0,0,0,.55));user-select:none}
.hk-title{align-self:center;max-width:100%;text-align:center;background:linear-gradient(180deg,#242c37,#161d26);color:#e6edf5;font-weight:800;font-size:13px;letter-spacing:.1em;text-transform:uppercase;padding:4px 22px;border-radius:7px 7px 0 0;box-shadow:inset 0 1px 0 rgba(255,255,255,.08);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hk-boardwrap{position:relative;display:flex}
.hk-main{position:relative;z-index:2;flex:1;display:flex;align-items:stretch;background:#0a0d12;border-radius:8px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
/* Penalty fly-outs — up to two per team, tucked behind the board's right edge and sliding
   out to the right when a penalty appears. Two layouts share one container. */
.hk-pens{position:absolute;left:calc(100% + 6px);top:0;bottom:0;z-index:1;display:flex;flex-direction:column;white-space:nowrap}
@keyframes hkPensIn{from{opacity:0;transform:translateX(-48px)}to{opacity:1;transform:none}}
.hk-pens.flyin{animation:hkPensIn .5s cubic-bezier(.2,.85,.2,1) both}
/* 'list' — a thin stacked list; jersey # and clock on one line, colour-chipped per team. */
.hk-pens.list{justify-content:center;gap:4px}
.hk-penrow{display:flex;align-items:center;gap:10px;height:22px;padding:0 11px 0 9px;background:var(--tc,#a11);border-radius:5px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.hk-penrow .hk-pnum{font-weight:800;font-style:italic;font-size:15px;line-height:1;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.hk-penrow .hk-pclk{margin-left:auto;font-weight:800;font-size:14px;color:#fff;font-variant-numeric:tabular-nums;line-height:1}
/* 'aligned' — two lanes level with the board's two rows; each side's boxes sit on its row,
   jersey # above the clock. */
.hk-pens.aligned{justify-content:stretch}
.hk-penlane{flex:1;display:flex;align-items:center;gap:4px}
.hk-penbox{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:38px;padding:2px 8px;background:var(--tc,#a11);border-radius:5px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.hk-penbox .hk-pnum{font-weight:800;font-style:italic;font-size:15px;line-height:1.05;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.hk-penbox .hk-pclk{font-weight:700;font-size:10px;color:#fff;font-variant-numeric:tabular-nums;line-height:1.05}
.hk-scores{display:flex;flex-direction:column;min-width:196px}
.hk-row{display:flex;align-items:center;gap:11px;height:38px;padding:0 14px 0 12px;background:var(--tc,#15181f)}
.hk-row .lg{width:28px;height:28px;object-fit:contain;flex:none}.hk-row .lg.empty{display:none}
.hk-abbr{font-family:var(--st-nm-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:23px;letter-spacing:.02em;color:var(--st-nm-color,#fff);text-transform:uppercase;line-height:1;white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.hk-sc{margin-left:auto;font-family:var(--st-sc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:26px;color:var(--st-sc-color,#fff);font-variant-numeric:tabular-nums;min-width:1.4ch;text-align:center;line-height:1;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.hk-sog{display:grid;grid-template-rows:1fr auto 1fr;align-items:center;justify-items:center;min-width:42px;padding:0 6px;background:#12161d}
.hk-sogv{font-family:var(--bug-font,'Barlow Condensed'),sans-serif;font-weight:700;font-size:18px;color:#dfe6ef;font-variant-numeric:tabular-nums}
.hk-soglbl{font-family:var(--mono,'JetBrains Mono'),monospace;font-size:8px;font-weight:700;letter-spacing:.11em;color:#8794a5}
.hk-clk{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:80px;padding:0 12px;background:#0a0d12}
.hk-per{font-family:var(--st-q-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:16px;letter-spacing:.03em;color:var(--st-q-color,#fff)}
.hk-per.fin{color:#ff6470}
.hk-time{font-family:var(--st-gc-font,var(--bug-font,'Barlow Condensed')),sans-serif;font-weight:800;font-size:26px;color:var(--st-gc-color,#fff);font-variant-numeric:tabular-nums;line-height:1}
.hk-pp{align-self:stretch;display:flex;align-items:center;justify-content:space-between;gap:12px;height:26px;margin-top:2px;padding:0 16px;background:var(--tc,#a11);border-radius:0 0 8px 8px;box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}
.hk.haspp .hk-main{border-radius:8px 8px 0 0}
.hk-pp-t{font-weight:800;font-style:italic;font-size:14px;letter-spacing:.05em;text-transform:uppercase;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.hk-pp-c{font-weight:800;font-style:italic;font-size:15px;color:#fff;font-variant-numeric:tabular-nums}

/* Ice-hockey GOAL animation: the board fills with the scoring team's colour + crest and
   G-O-A-L spell out one letter at a time, each flying in from the right. */
.hk-goal{position:absolute;inset:0;display:flex;flex-direction:column;align-items:stretch;z-index:20;font-family:var(--bug-font,'Barlow Condensed'),sans-serif;transition:opacity .4s ease}
.hk-goal.out{opacity:0}
.hk-goal .hk-title{align-self:center}
.hk-goal-main{flex:1;display:flex;align-items:center;gap:18px;padding:0 24px;border-radius:8px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);background:linear-gradient(90deg,var(--tc) 0%,color-mix(in srgb,var(--tc) 55%,#0a0d12) 32%,#0a0d12 74%)}
.hk-goal-logo{height:76%;max-height:92px;width:auto;object-fit:contain;flex:none;animation:hkGoalLogo .5s cubic-bezier(.2,.9,.2,1) both}
@keyframes hkGoalLogo{from{opacity:0;transform:scale(.45)}to{opacity:1;transform:none}}
.hk-goal-word{display:flex;gap:.03em;margin-left:auto;margin-right:auto}
.hk-goal-l{font-weight:800;font-style:italic;letter-spacing:.005em;line-height:1;color:#fff;text-shadow:0 3px 10px rgba(0,0,0,.5);opacity:0;animation:hkGoalIn .5s cubic-bezier(.2,.8,.15,1.12) both}
@keyframes hkGoalIn{0%{opacity:0;transform:translateX(1.3em) scale(1.5) rotate(7deg)}55%{opacity:1}100%{opacity:1;transform:none}}