/* ============================================================
   COFTA 2026 — alternative directions, switchable per device.
   Each is a token override on the same structure, so the app can
   be judged in every style with live data rather than mockups.
   ============================================================ */

/* ── Broadcast: dark, television graphics ─────────────────── */
[data-theme="broadcast"]{
  --bg:oklch(.165 .012 262);
  --card:oklch(.205 .014 260);
  --fg:oklch(.94 .012 88);
  --fg2:oklch(.83 .012 88);
  --dim:oklch(.62 .014 255);
  --line:oklch(.28 .012 260);
  --line2:oklch(.37 .014 260);
  --gold:oklch(.66 .095 82);
  --acc:oklch(.70 .17 42);
  --accfg:oklch(.15 .012 262);
  --ok:oklch(.72 .13 152);
}
[data-theme="broadcast"] .hd{border-bottom-color:oklch(.52 .11 45)}
[data-theme="broadcast"] .fx:hover{background:oklch(.235 .014 260)}
[data-theme="broadcast"] .pk:active{background:oklch(.26 .014 260)}
[data-theme="broadcast"] tbody tr.unres td{background:oklch(.27 .04 82)}
[data-theme="broadcast"] .tile{box-shadow:inset 0 0 0 1px rgba(255,255,255,.12),0 0 0 1px var(--gold)}
[data-theme="broadcast"] .sl .bdg{box-shadow:inset 0 0 0 1px rgba(255,255,255,.12),0 0 0 1px var(--gold)}

/* ── Terrace: club colour turned right up ─────────────────── */
[data-theme="terrace"]{
  --bg:oklch(.958 .018 78);
  --gold:oklch(.70 .12 68);
  --acc:oklch(.49 .20 29);
}
[data-theme="terrace"] .hd h1{color:var(--acc)}
[data-theme="terrace"] .sl{background:color-mix(in oklab,var(--c) 26%,var(--card))}
[data-theme="terrace"] .sl .bdg{width:54px;height:54px}
[data-theme="terrace"] .sl .bdg img{width:40px;height:40px}
[data-theme="terrace"] .fx .side{padding-left:11px}
[data-theme="terrace"] .fx .side::before{width:5px}
[data-theme="terrace"] .fx .r{font-size:23px}

/* ── Swiss: white, black, one red ─────────────────────────── */
[data-theme="swiss"]{
  --bg:#ffffff; --card:#ffffff;
  --fg:#101010; --fg2:#333; --dim:#767676;
  --line:#e7e7e7; --line2:#cfcfcf;
  --gold:#101010;
  --acc:#d2202a; --accfg:#ffffff;
  --ok:#1a7f37;
}
[data-theme="swiss"] .hd{border-bottom:3px solid #101010}
[data-theme="swiss"] .sect::after{height:1px}
[data-theme="swiss"] .fx:hover{background:#f7f7f7}
[data-theme="swiss"] .pk:active{background:#f2f2f2}
[data-theme="swiss"] tbody tr.unres td{background:#f5f5f5}
[data-theme="swiss"] .act,[data-theme="swiss"] .lg,[data-theme="swiss"] .pens,
[data-theme="swiss"] input,[data-theme="swiss"] select,[data-theme="swiss"] textarea,
[data-theme="swiss"] .banner,[data-theme="swiss"] .award,[data-theme="swiss"] .picker,
[data-theme="swiss"] .tile,[data-theme="swiss"] .sl .bdg{border-radius:0}
[data-theme="swiss"] .tile{box-shadow:inset 0 0 0 1px rgba(0,0,0,.14)}

/* ── Matchday: the modern sports-app synthesis ─────────────
   Split-colour match header from the Premier League app, card
   system and pill navigation from the current app generation,
   FotMob's scorer lines, Sofascore's live accents. Club text
   colours come from the database so every kit stays legible. */
[data-theme="matchday"]{
  --bg:#eef0f3; --card:#ffffff;
  /* --dim was #6d7183: 4.84:1 on a white card but only 4.24:1 on the grey
     page background, where most of the small text actually sits (.note,
     .sect, leaderboard sub-labels). Darkened to clear AA on both. */
  --fg:#16182b; --fg2:#3a3d55; --dim:#65697b;
  --line:#e6e8ef; --line2:#d3d6e0;
  --gold:#d3d6e0;
  --acc:#38003c; --accfg:#ffffff;
  --ok:#00b060;
  --r:12px;
}
[data-theme="matchday"] body{font-family:-apple-system,'Segoe UI',Roboto,'Helvetica Neue',sans-serif;font-size:14px}
[data-theme="matchday"] .note,[data-theme="matchday"] .hd .meta{font-style:normal}

/* masthead and nav become cards and pills */
[data-theme="matchday"] .hd{background:var(--card);border-bottom:none;margin:10px 10px 0;
  border-radius:16px;padding:16px 16px 13px;box-shadow:0 1px 2px rgba(18,20,40,.07)}
[data-theme="matchday"] .hd h1{font-size:44px}
[data-theme="matchday"] .nav{border-bottom:none;gap:7px;padding:10px}
[data-theme="matchday"] .nav button{background:var(--card);border-radius:999px;padding:9px 14px;
  margin:0;border-bottom:none;font-size:11.5px;box-shadow:0 1px 2px rgba(18,20,40,.06)}
[data-theme="matchday"] .nav button.on{background:var(--acc);color:var(--accfg)}
[data-theme="matchday"] .scroll{padding:0 10px 64px}
[data-theme="matchday"] .daysel{gap:8px}
[data-theme="matchday"] .daysel button{background:var(--card);border-radius:999px;
  padding:8px 14px;border-bottom:none;box-shadow:0 1px 2px rgba(18,20,40,.05)}
[data-theme="matchday"] .daysel button.on{background:var(--fg);color:#fff}
[data-theme="matchday"] .sect{color:var(--dim)}
[data-theme="matchday"] .sect::after{background:var(--line)}

/* fixtures and report entries as cards */
[data-theme="matchday"] .fx{background:var(--card);border-radius:14px;border-bottom:none;
  margin-bottom:9px;padding:13px 12px;box-shadow:0 1px 2px rgba(18,20,40,.06)}
[data-theme="matchday"] .fx:hover{background:var(--card)}
[data-theme="matchday"] .fx .r .st.live{color:#e0003c}
[data-theme="matchday"] .tl li{background:var(--card);border-radius:12px;border-bottom:none;
  margin-bottom:8px;padding:12px;box-shadow:0 1px 2px rgba(18,20,40,.05)}
[data-theme="matchday"] .empty{background:var(--card);border-radius:12px;border-bottom:none;
  padding:16px;box-shadow:0 1px 2px rgba(18,20,40,.05)}

/* the split-colour match header */
[data-theme="matchday"] .stack{display:grid;grid-template-columns:1fr 1fr;border:none;
  border-radius:16px;overflow:hidden;box-shadow:0 2px 6px rgba(18,20,40,.14)}
[data-theme="matchday"] .sl{flex-direction:column;justify-content:flex-start;text-align:center;
  gap:9px;background:var(--c);padding:18px 10px 16px}
/* The divider is drawn as two hairlines rather than one — see the block
   further down, which supplies them. A single colour cannot separate every
   pairing: rgba(255,255,255,.18) vanished on Hounslow's white, and any mid
   grey washes out on Croydon's blue. */
[data-theme="matchday"] .sl+.sl{border-top:none;border-left:none}
[data-theme="matchday"] .sl .bdg{width:58px;height:58px;border-radius:14px;
  background:rgba(255,255,255,.94);box-shadow:0 1px 3px rgba(0,0,0,.18)}
[data-theme="matchday"] .sl .bdg img{width:44px;height:44px}
[data-theme="matchday"] .sl .who{flex:none}
[data-theme="matchday"] .sl .who b{color:var(--tc);font-size:14.5px}
[data-theme="matchday"] .sl .who i{color:var(--tc);opacity:.72}
[data-theme="matchday"] .sl .gl{color:var(--tc);font-size:46px;text-align:center;min-width:0}
[data-theme="matchday"] .sl .gls .gline{color:var(--tc);opacity:.85}
[data-theme="matchday"] .ck{background:var(--card);border:none;border-radius:14px;
  padding:14px;margin-top:10px;box-shadow:0 1px 2px rgba(18,20,40,.06)}
[data-theme="matchday"] .ck .m{color:#e0003c}
[data-theme="matchday"] .kick{justify-content:center}

/* tables and knockout rows */
[data-theme="matchday"] table{background:var(--card);border-radius:14px;overflow:hidden;
  box-shadow:0 1px 2px rgba(18,20,40,.06)}
[data-theme="matchday"] thead th{padding:11px 4px}
[data-theme="matchday"] tbody td{padding:12px 4px}
[data-theme="matchday"] tbody tr:last-child td{border-bottom:none}
[data-theme="matchday"] tbody tr.unres td{background:#f4f1e2}
/* The last oklch() left in a component rule the public theme did not already
   override. Harmless where oklch is unsupported — the tag keeps the plain tag
   colour — but Matchday should not depend on a 2022 colour function at all. */
[data-theme="matchday"] .tag.so{color:#8a6a12}
[data-theme="matchday"] .ko{background:var(--card);border-radius:12px;border-bottom:none;
  padding:13px 14px;margin-bottom:8px;box-shadow:0 1px 2px rgba(18,20,40,.05)}
[data-theme="matchday"] .ko .w{font-style:normal}

/* controls */
[data-theme="matchday"] .act{border-radius:999px}
[data-theme="matchday"] .lg,[data-theme="matchday"] .pens,[data-theme="matchday"] .picker,
[data-theme="matchday"] .banner,[data-theme="matchday"] .award{background:var(--card);
  border:none;border-radius:14px;box-shadow:0 1px 2px rgba(18,20,40,.07)}
[data-theme="matchday"] .banner.warn{box-shadow:inset 0 0 0 1px #e0003c;color:#b30030}
[data-theme="matchday"] input,[data-theme="matchday"] select,[data-theme="matchday"] textarea{
  border-radius:12px;border-color:var(--line2)}
[data-theme="matchday"] .pk:active{background:#f2f3f7}
[data-theme="matchday"] .themes button,[data-theme="matchday"] .dqlist button{
  background:var(--card);border-radius:999px;box-shadow:0 1px 2px rgba(18,20,40,.06)}
[data-theme="matchday"] .themes button.on{box-shadow:inset 0 0 0 1.5px var(--acc);color:var(--acc)}

/* ── Matchday refinements from live testing ───────────────── */
/* ── CREST PRESENTATION IS SETTLED ────────────────────────────
   No plates, no rings, no contours. A crest is drawn alone on the club's
   colour with one soft drop shadow, on the split header and on both phead
   club/player headers. Where a crest does not separate from its background,
   the fix goes into the asset — see smpk.webp, whose ring and edge are now
   baked into the artwork — not into a filter here.

   Do not restyle these two rules without an explicit instruction naming
   this comment. They have been reverted to this exact state more than once.

   NOTE: an earlier [data-theme="matchday"] .sl .bdg above sets a white pill
   (58px, radius 14, rgba(255,255,255,.94)). It is dead — the rules below
   override every property of it — and it is what makes a grep look alarming.
   Reading this file top to bottom, the last declaration is the one that
   ships. */
/* 2: no white pill — crests sit straight on the club colour */
[data-theme="matchday"] .sl .bdg{background:transparent;box-shadow:none;
  width:64px;height:64px;border-radius:0}
[data-theme="matchday"] .sl .bdg img{width:62px;height:62px;
  filter:drop-shadow(0 3px 9px rgba(0,0,0,.32))}
/* 1: crest → name → score → scorers, top to bottom */
[data-theme="matchday"] .sl .gls{flex-basis:auto;margin:2px 0 0}
/* 3: vertical scores on the list — one number per club row */
[data-theme="matchday"] .fx .rsc{display:none}
[data-theme="matchday"] .fx .side .ssc{display:block;margin-left:auto;
  font-family:var(--num);font-weight:800;font-size:21px;line-height:1}
[data-theme="matchday"] .fx .side .who{flex:1}
[data-theme="matchday"] .fx .r{align-self:center}
[data-theme="matchday"] .fx .r .st{margin-top:0}
/* squads page in the card language */
[data-theme="matchday"] .stat{border:none;box-shadow:0 1px 2px rgba(18,20,40,.06)}
[data-theme="matchday"] .pk{background:var(--card);border-radius:12px;border-bottom:none;
  margin-bottom:7px;box-shadow:0 1px 2px rgba(18,20,40,.05)}

/* ── SETTLED LAYOUT INVARIANTS ────────────────────────────────
   Five things about the Matchday header and fixtures list are decided, and
   they hold together — changing one usually breaks another:

     1. the chip is an ABSOLUTE OVERLAY, dead-centre. position:absolute,
        top/left 50%, translate(-50%,-50%) against .stack's position:relative.
        It is never a grid item and never in flow.
     2. the halves SHARE ROWS via subgrid, so a wrapped name on one side does
        not push that side's rows out of step with the other's.
     3. SCORES ARE LEVEL. This follows from 2 and is the thing a reader
        actually notices, so it is worth checking on its own.
     4. content is CENTRED with SYMMETRIC padding-inline, never with
        asymmetric padding to dodge the chip — that moves each half's content
        box off the half's own centre.

     5. in the FIXTURES LIST, the SCORE DIGIT POSITION IS INVARIANT and
        ANNOTATIONS NEVER DISPLACE IT. .ssc is a fixed-width centred box;
        a penalty tally hangs off it absolutely and cannot widen it or
        pull the digit out of the column the non-penalty rows sit in. The
        horizontal reserve for the annotation is applied to every row,
        because a column that lines up only on some rows is not a column.

   Any change here must re-verify all five. The measurements that count, at
   375px, on a two-line name against a one-line one (Golders Green against
   Kidane Mihret): chip offset from card centre 0.00px on both axes and 0.00px
   from the divider; both halves' .gl at an identical top; card the same
   height before kick-off as after it.

   ASSERTIONS. Verify numerically, not by eye — an earlier pass checked
   only vertical alignment and card height and so missed a 15.76px
   horizontal offset for several rounds. For each half, in each state
   (pre-match, live with scorer lines, FT, penalties strip), at 375px and
   desktop, from getBoundingClientRect():

     |centre(.bdg)  - centre(half)| <= 1.5px
     |centre(.who)  - centre(half)| <= 1.5px
     |centre(.gl)   - centre(half)| <= 1.5px
     |top(.gl left) - top(.gl right)| <= 1.0px      (scores share a row)
     |centre(.midchip) - centre(.stack)| <= 1.0px   (both axes)
     |centre-x(.ssc row A) - centre-x(.ssc row B)| <= 1.0px  (fixtures,
                                    penalty and non-penalty rows alike)
     |centre-y(.spen) - centre-y(.ssc)|  <= 1.0px   (annotation on the
                                    digit's centre, not its baseline)

   Last measured: worst horizontal delta 0.01px, score-row delta 0.00px,
   chip 0.00px on both axes, and in the fixtures list digit-column spread
   0.00px with the annotation 0.00px off the digit centre, at 375px and 1280px.

   NOTE: .midchip is declared twice below. The second wins and is the live
   one; the first is an earlier version left in place. Read to the bottom
   before concluding anything about what ships. */
/* the centred time/minute chip, Premier League style */
[data-theme="matchday"] .stack{position:relative}
[data-theme="matchday"] .midchip{display:block;position:absolute;left:50%;top:50%;
  transform:translate(-50%,-50%);z-index:2;background:#fff;color:var(--fg);
  font-family:var(--num);font-weight:800;font-size:21px;line-height:1;
  padding:10px 14px;border-radius:12px;min-width:58px;text-align:center;
  box-shadow:0 2px 10px rgba(0,0,0,.28);font-variant-numeric:tabular-nums}
[data-theme="matchday"] .midchip.live{color:#e0003c}

/* the PL-style centre chip: kick-off before, ticking minute during, FT after */
[data-theme="matchday"] .midchip{display:flex;align-items:center;justify-content:center;
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  background:#fff;color:var(--fg);border-radius:12px;padding:8px 13px;
  font-family:var(--num);font-weight:800;font-size:21px;line-height:1;
  box-shadow:0 2px 8px rgba(18,20,40,.28);min-width:2.6em}
[data-theme="matchday"] .midchip.live{color:#e0003c}

/* matchday list centring: time | status | clubs, scores flush right */
[data-theme="matchday"] .fx{grid-template-columns:46px minmax(48px,auto) 1fr;gap:10px}
[data-theme="matchday"] .fx .t{grid-column:1}
[data-theme="matchday"] .fx .r{grid-column:2;align-self:center;text-align:left}
[data-theme="matchday"] .fx .n{grid-column:3;gap:8px}
[data-theme="matchday"] .fx.sched .r{display:none}
[data-theme="matchday"] .fx.sched .n{grid-column:2/4}
[data-theme="matchday"] .fx .side .ssc{min-width:1.15em;text-align:right}

/* matchday list, corrected: one fixed left column, clubs never shift */
[data-theme="matchday"] .fx{grid-template-columns:52px 1fr;gap:12px}
[data-theme="matchday"] .fx .r{display:none}
[data-theme="matchday"] .fx .n,[data-theme="matchday"] .fx.sched .n{grid-column:2}
[data-theme="matchday"] .fx .t .tst{display:block;margin-top:4px;
  font-family:var(--num);font-weight:800;font-size:13px;letter-spacing:.02em;
  color:var(--dim)}
[data-theme="matchday"] .fx .t .tst.live{color:#e0003c}
[data-theme="matchday"] .fx .t .tst i{display:block;font-style:normal;
  font-size:9.5px;font-weight:600;margin-top:1px}

/* Matchday hides the combined score column, so a shoot-out had nowhere to go
   but the narrow left column, in 9.5px type nobody reads. It now sits in
   brackets beside each club's own score, where the eye already is, with the
   winning tally in the accent. */
[data-theme="matchday"] .fx .side .ssc .spen{font-style:normal;font-size:13px;
  margin-left:5px;color:var(--dim)}
[data-theme="matchday"] .fx .side .ssc .spen.won{color:var(--acc)}

/* ── Matchday: surfaces that predate it ───────────────────────
   Row lists were styled before Matchday existed and still wore the base
   sheet's bare hairlines on the page background. They become one card with
   dividers inside, the same treatment the tables already get, rather than
   one card per row — these are ranked or enumerated lists, and boxing every
   line breaks the column the eye is reading down. */
[data-theme="matchday"] .lb,
[data-theme="matchday"] .squad,
[data-theme="matchday"] .honours,
[data-theme="matchday"] .susp{background:var(--card);border-radius:14px;border-top:none;
  overflow:hidden;box-shadow:0 1px 2px rgba(18,20,40,.06)}
[data-theme="matchday"] .lb .lbr,
[data-theme="matchday"] .squad li,
[data-theme="matchday"] .honours li,
[data-theme="matchday"] .susp li{padding-left:13px;padding-right:13px;border-color:var(--line)}
[data-theme="matchday"] .lb .lbr:last-child,
[data-theme="matchday"] .squad li:last-child,
[data-theme="matchday"] .honours li:last-child,
[data-theme="matchday"] .susp li:last-child{border-bottom:none}

/* qualification rows join the knockout rows they sit beside */
[data-theme="matchday"] .qrow{background:var(--card);border-radius:12px;border-bottom:none;
  padding:12px 13px;margin-bottom:8px;box-shadow:0 1px 2px rgba(18,20,40,.05)}

/* the trophy chips read as removable tokens, not as another card */
[data-theme="matchday"] .tchip{border-radius:999px;padding:7px 8px 7px 12px}

/* ── Matchday: the split-colour header, finished ──────────────
   A white half on a white card reads as a hole rather than a panel, so every
   half carries a neutral inset hairline. It is invisible on a dark kit and
   does the whole job on a white one. Scoped away from .stack.one, which is
   the single-block squad and player header, not a match. */
[data-theme="matchday"] .stack:not(.one) .sl{
  box-shadow:inset 0 0 0 1px rgba(18,20,40,.07)}

/* The divider between the halves is a light hairline and a dark one side by
   side. Whatever the club colour, one of the two reads: the dark line does
   the work on Hounslow's white, the light line on Kensington's near-black,
   and on a mid tone like Croydon's blue — where a single grey washes out
   entirely — both are faintly visible. Drawn as insets so it costs no width. */
[data-theme="matchday"] .stack:not(.one) .sl:first-child + .sl{
  box-shadow:inset 0 0 0 1px rgba(18,20,40,.07),
             inset 1px 0 0 rgba(255,255,255,.34),
             inset 2px 0 0 rgba(18,20,40,.20)}

/* Clearing the centre chip started as asymmetric padding — 46px on each
   half's inner edge — which pushed every half's content box outward, so the
   crest, name and score sat 18px toward the outside. Symmetric padding-inline
   instead: the content box stays concentric with the half, so everything in
   it is dead-centre, and a long name still runs out of room before it reaches
   the chip because the room is taken off both ends equally.

   41px is the number that makes that true at the tightest width. At 375px a
   half is 177.5px, leaving 95.5px of content, and the widest chip reaches
   36.3px from the centre, so the two clear each other by 4.7px. Going wider
   buys more air but costs a line: at 42px "St Mary & Archangel Michael"
   breaks to three lines and the card grows 26px. That name and "St Mary &
   Pope Kyrillos VI" are the two that decide the value. */
[data-theme="matchday"] .stack:not(.one) .sl{padding-inline:41px}

/* the chip sits on the halves rather than hovering above them: a lighter
   shadow, and a hairline so it still has an edge against a white kit */
[data-theme="matchday"] .midchip{border:1px solid var(--line2);
  box-shadow:0 1px 4px rgba(18,20,40,.16)}

/* before kick-off the rail is a single muted line */
[data-theme="matchday"] .ck.pre{padding:16px 14px;border-bottom:none}

/* Focus rings. The accent is near-black purple, which is legible on white
   and on the grey page but disappears into a club's own colour, so the
   split-colour header and anything else sitting on --c gets a white ring. */
[data-theme="matchday"] :focus-visible{outline-color:var(--acc)}
[data-theme="matchday"] .sl:focus-visible,
[data-theme="matchday"] .fx .side:focus-visible{outline-color:#fff;outline-offset:-3px}

/* matchday: score digits optically centred against the full row */
[data-theme="matchday"] .fx .side{align-items:stretch}
[data-theme="matchday"] .fx .side .tile,
[data-theme="matchday"] .fx .side .who{align-self:center}
[data-theme="matchday"] .fx .side .ssc{display:flex;align-items:center;margin-left:auto}

/* matchday: the award as a small chip */
[data-theme="matchday"] .motmline{font-style:normal;background:var(--card);
  width:fit-content;margin:10px auto 0;padding:7px 15px;border-radius:999px;
  box-shadow:0 1px 2px rgba(18,20,40,.08);font-size:12px}
[data-theme="matchday"] .mstar{color:#f0a500}

/* matchday: digits pinned to the exact vertical centre of their row,
   immune to font metrics and to rows growing an extra line */
[data-theme="matchday"] .fx .side{position:relative;padding-right:1.5em;align-items:center}
[data-theme="matchday"] .fx .side .ssc{position:absolute;right:0;top:50%;
  transform:translateY(-50%);margin:0;display:block;line-height:1}

/* matchday: the alt half stays a white card; digits centre in a fixed box
   so 0 and 1 align on optical centres, not on glyph side-bearings */
[data-theme="matchday"] .sl.alt{background:var(--card)}
[data-theme="matchday"] .sl.alt .altbox b{color:var(--fg)}
[data-theme="matchday"] .fx .side .ssc{width:1.35em;text-align:center}

/* matchday player header: one full-colour block, number in the club's
   text colour — dark on SMPK's white, white on Rotherham's navy */
[data-theme="matchday"] .stack.one{grid-template-columns:1fr}
[data-theme="matchday"] .sl.phead{flex-direction:row;text-align:left;
  align-items:center;gap:14px;padding:20px 18px}
[data-theme="matchday"] .sl.phead .who{flex:1}
[data-theme="matchday"] .sl.phead .who b{font-size:17px}
[data-theme="matchday"] .sl.phead .bignum{color:var(--tc);font-size:58px;margin-left:auto}

/* matchday: club meta in the club's own text colour */
[data-theme="matchday"] .sl.phead .clubmeta i,
[data-theme="matchday"] .sl.phead .clubmeta b{color:var(--tc)}
[data-theme="matchday"] .sl.phead .clubmeta i{opacity:.75}

/* The penalties strip is a sibling of the header rather than a row inside it
   (see styles.css), so it re-joins the card here: the stack drops its bottom
   corners when a strip follows and the strip carries them instead. */
[data-theme="matchday"] .pnstrip{border-bottom:none;padding:11px 12px;
  border-radius:0 0 16px 16px;box-shadow:0 2px 6px rgba(18,20,40,.14)}
[data-theme="matchday"] .stack:has(+ .pnstrip){
  border-bottom-left-radius:0;border-bottom-right-radius:0}

/* ── Matchday: the header before kick-off ─────────────────────
   A scheduled half has no score row, so it is short by exactly the score
   (46px) plus the column gap (9px). Blanking the cell instead of dropping it
   kept the height but left all 55px hanging below the club name, which put
   the crest and name above centre — the regression this fixes.

   The 55px is given back as symmetric padding instead: same total height as
   a started half, so the card does not resize when the scores appear, and
   the content sits centred. Padding rather than a translate or a centred
   flex box on purpose — both halves keep the same padding-top, so their
   crests stay on one line even when one club's name wraps and the other's
   does not. min-height is a floor for the shortest possible pairing. */
[data-theme="matchday"] .stack.pre .sl{
  padding-top:calc(18px + 27px);
  padding-bottom:calc(16px + 28px);
  min-height:191px}

/* ── Matchday: the two halves share rows ──────────────────────
   The halves were independent columns, so each sized its own content: when
   one club's name wrapped and the other's did not, the big scores landed at
   different heights and the header read as two posters rather than one.

   subgrid fixes it at the layout level rather than by guessing heights. The
   stack owns four rows — crest, name+city, score, scorer lines — and each
   half spans all four and adopts them, so every row is as tall as the taller
   half needs and the scores always sit on one line.

   Spacing is a margin on each cell rather than a row-gap. A gap is charged
   even when the track beside it is empty, so a scheduled match — no score
   row, no scorer row — paid 18px for two rows that are not there and the
   card grew by that much. A margin lives inside its track and collapses
   with it, which keeps the pre-match card exactly the height it will have
   once the clock starts.

   Behind @supports on purpose. Where subgrid is missing the flex column
   above still applies untouched, which is precisely the behaviour this
   replaces — degraded, not broken. Scoped to matchday: the other four themes
   lay a half out as a horizontal row and must not become a grid. */
@supports (grid-template-rows: subgrid) {
  [data-theme="matchday"] .stack:not(.one){
    grid-template-rows:auto auto auto auto;
    row-gap:0}
  [data-theme="matchday"] .stack:not(.one) .sl{
    display:grid;
    grid-row:span 4;
    grid-template-rows:subgrid;
    /* The column must be declared. Left implicit, it sized to the widest
       item — 64px for the crest when the club name did not wrap — and
       justify-content parked that narrow track at the start, so
       justify-items:center centred the content inside a track that was
       itself off-centre: (95.5 - 64) / 2 = 15.75px adrift, on exactly the
       half whose name fitted on one line. minmax(0,1fr) makes the track
       fill the content box, so centring in the track is centring in the
       half. minmax(0,…) rather than 1fr so a long unbroken word cannot
       push the track wider than its half. */
    grid-template-columns:minmax(0,1fr);
    row-gap:0;
    justify-items:center;
    align-items:center}
  /* each cell centres its own content, so a wrapped name and a single-line
     one still read as sitting on the same line */
  [data-theme="matchday"] .stack:not(.one) .sl > *{grid-column:1;text-align:center}
  [data-theme="matchday"] .stack:not(.one) .sl > * + *{margin-top:9px}
}

/* ── Matchday: the score digit's box never moves ──────────────
   A penalty tally is an annotation hung off the digit, not part of it. Set
   inline inside .ssc it did two things wrong at once: it widened the box, so
   the digit slid out of the column every non-penalty row still sat in, and
   it aligned to the text baseline rather than the digit's centre, so it
   floated high against a 21px numeral.

   Absolutely positioned against .ssc — which is itself absolutely positioned
   and so is its own containing block — it cannot affect the digit's box at
   all, and translateY(-50%) off top:50% centres it on the digit rather than
   on a baseline.

   The horizontal reserve is applied to EVERY row, penalty or not. A column
   that only lines up on the rows without annotations is not a column. */
[data-theme="matchday"] .fx .side{padding-right:calc(1.5em + 26px)}
[data-theme="matchday"] .fx .side .ssc{right:26px}
[data-theme="matchday"] .fx .side .ssc .spen{position:absolute;left:100%;top:50%;
  transform:translateY(-50%);margin-left:4px;font-style:normal;font-size:13px;
  line-height:1;white-space:nowrap;color:var(--dim)}
[data-theme="matchday"] .fx .side .ssc .spen.won{color:var(--acc)}

/* Stats hub in the card language. The honours strip takes the gold edge the
   confirmed award cards used, so a decided trophy reads the same wherever it
   appears. */
[data-theme="matchday"] .scard,
[data-theme="matchday"] .hon{background:var(--card);border-radius:12px;border-bottom:none;
  margin-bottom:8px;padding:12px 13px;box-shadow:0 1px 2px rgba(18,20,40,.05)}
[data-theme="matchday"] .honstrip{border-top:none}
[data-theme="matchday"] .hon{box-shadow:inset 0 0 0 1px var(--gold)}
[data-theme="matchday"] .srow:active,
[data-theme="matchday"] .hon:active{background:color-mix(in oklab,var(--acc) 4%,var(--card))}
[data-theme="matchday"] .scard{padding:2px 13px 6px;border-bottom:none}
[data-theme="matchday"] .scard .sch{padding:11px 0 7px}
/* the rounded active state needs the row to have corners to round */
[data-theme="matchday"] .srow{border-radius:8px;padding-inline:4px;margin-inline:-4px}
[data-theme="matchday"] .snone{padding:2px 0 8px}

/* History on Broadcast.
   The six competition identities are fixed colours chosen against a light
   card — COFTA's #38003c is near-black, and on Broadcast's dark card it
   disappears entirely. Each identity carries a light companion (--cl) for
   exactly this case; Broadcast switches to it wherever the identity is used
   as ink or as a rule. The other three themes are light and use --ci as-is. */
[data-theme="broadcast"] .ccn,
[data-theme="broadcast"] .chead h2      {color:var(--cl,var(--fg))}
[data-theme="broadcast"] .ccard         {border-left-color:var(--cl,var(--acc))}
[data-theme="broadcast"] .chead         {border-bottom-color:var(--cl,var(--acc))}
[data-theme="broadcast"] .mono          {box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
