/* ------------------------------------------------------------------
   Football Stats – works with CS1-theme (uses its primary colour and
   palette variables) and any Bootstrap-based theme.
   ------------------------------------------------------------------ */
.fs-root {
    --fs-home: #1f9d55;           /* home team: green */
    --fs-away: #2b6fd6;           /* away team: blue */
    --fs-draw: #7d838a;           /* draw: neutral grey */
    --fs-win: #22a35a;
    --fs-mid: #f0ad1e;            /* amber */
    --fs-loss: #d9363e;
    --fs-home-light: #dcf5e3;     /* table highlight, home */
    --fs-away-light: #dde9fb;     /* table highlight, away */
    --fs-over: #475569;
    --fs-under: #cbd5e1;
    --fs-line: #e3e6ea;
    --fs-soft: #f5f7f9;
    --fs-muted: #6c757d;
    --fs-ink: #1f2933;
    --fs-accent: var(--cs1-p1, var(--bs-primary, #1B7DFF));
    --fs-on-accent: var(--cs1-on-p1, #fff);
    color: var(--fs-ink);
}

.fs-h2 { font-size: 1.45rem; margin: 2.25rem 0 1rem; }
.fs-h2 small, .fs-h3 small { font-size: .7em; color: var(--fs-muted); font-weight: 400; }
.fs-card > .fs-h2:first-child, .fs-card-head .fs-h2 { margin-top: 0; }
.fs-h3 { font-size: 1.05rem; margin: 1.5rem 0 .75rem; font-weight: 700; }
.fs-intro { margin-bottom: 1rem; }
.fs-note { font-size: .8rem; color: var(--fs-muted); margin: .6rem 0 0; }
.fs-credit { font-size: .75rem; color: var(--fs-muted); margin-top: 2.5rem; border-top: 1px solid var(--fs-line); padding-top: .75rem; }
.fs-none { color: var(--fs-muted); font-size: .85rem; }
.fs-nowrap { white-space: nowrap; }
.fs-empty { background: var(--fs-soft); border: 1px dashed var(--fs-line); padding: 1.25rem; border-radius: 6px; }
.fs-empty p:last-child { margin-bottom: 0; }
.fs-empty-line { background: var(--fs-soft); padding: 1rem 1.25rem; border-radius: 6px; margin: 0; color: var(--fs-muted); }

/* ---------- form squares ---------- */
.fs-form { display: inline-flex; gap: 3px; vertical-align: middle; }
.fs-sq {
    width: 20px; height: 20px; border-radius: 3px; display: inline-flex; align-items: center; justify-content: center;
    font-size: 10px; font-weight: 700; line-height: 1; color: #fff; cursor: default; position: relative;
    transition: transform .1s ease;
}
.fs-sq:hover, .fs-sq:focus-visible { transform: scale(1.15); outline: none; box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--fs-ink); z-index: 2; }
.fs-W { background: var(--fs-win); color: #fff; }
.fs-D { background: var(--fs-mid); color: #3b2a00; }
.fs-L { background: var(--fs-loss); color: #fff; }

/* ---------- tooltip (positioned by football.js) ---------- */
.fs-tooltip {
    position: fixed; z-index: 2000; max-width: 280px; pointer-events: none;
    background: #1f2933; color: #fff; font-size: .78rem; line-height: 1.35; padding: .4rem .6rem; border-radius: 5px;
    box-shadow: 0 4px 14px rgba(0,0,0,.18); opacity: 0; transition: opacity .1s ease;
}
.fs-tooltip.show { opacity: 1; }

/* ---------- match list ---------- */
.fs-toolbar { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-bottom: .75rem; }
.fs-toolbar-label { font-size: .85rem; color: var(--fs-muted); }
.fs-sort, .fs-tab {
    border: 1px solid var(--fs-line); background: #fff; color: var(--fs-ink); border-radius: 999px;
    padding: .3rem .85rem; font-size: .85rem; line-height: 1.3; cursor: pointer;
}
.fs-sort:hover, .fs-tab:hover { border-color: var(--fs-accent); }
.fs-sort.active, .fs-tab.active { background: var(--fs-accent); border-color: var(--fs-accent); color: var(--fs-on-accent); }
.fs-count { margin-left: auto; font-size: .85rem; color: var(--fs-muted); }

.fs-head, .fs-r1 {
    display: grid;
    grid-template-columns: minmax(118px, 1.5fr) repeat(5, minmax(46px, .62fr)) minmax(140px, 1.55fr);
    align-items: center; column-gap: 6px;
}
.fs-head {
    font-size: .7rem; text-transform: uppercase; letter-spacing: .03em; color: var(--fs-muted);
    padding: 0 .75rem .35rem; font-weight: 600;
}
.fs-c-odd { text-align: center; }
.fs-c-tip { text-align: right; }

.fs-match {
    border: 1px solid var(--fs-line); border-radius: 8px; background: #fff; margin-bottom: .6rem;
    cursor: pointer; transition: border-color .12s ease, box-shadow .12s ease;
}
.fs-match:hover { border-color: var(--fs-accent); box-shadow: 0 3px 12px rgba(0,0,0,.07); }
.fs-r1 { padding: .55rem .75rem; background: var(--fs-soft); border-bottom: 1px solid var(--fs-line); border-radius: 8px 8px 0 0; }
.fs-when { display: flex; flex-wrap: wrap; align-items: baseline; gap: .1rem .45rem; font-size: .9rem; }
.fs-date { color: var(--fs-muted); }
.fs-time { font-weight: 700; }
.fs-lg-badge {
    flex-basis: 100%; font-size: .72rem; color: var(--fs-accent); text-decoration: none; font-weight: 600;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.fs-lg-badge:hover { text-decoration: underline; }
.fs-odd { text-align: center; font-variant-numeric: tabular-nums; font-size: .92rem; padding: .2rem 0; border-radius: 4px; }
.fs-odd-label { display: none; font-size: .65rem; color: var(--fs-muted); }
.fs-odd-tip { background: #fff; box-shadow: inset 0 0 0 2px var(--fs-accent); font-weight: 700; }
.fs-tip { display: flex; justify-content: flex-end; gap: .35rem; flex-wrap: wrap; }
.fs-tip-item {
    font-size: .8rem; font-weight: 700; padding: .2rem .5rem; border-radius: 4px; white-space: nowrap;
    background: #fff; border: 1px solid var(--fs-line);
}
.fs-tip-item small { font-weight: 400; color: var(--fs-muted); }
.fs-tip-H { border-left: 4px solid var(--fs-home); }
.fs-tip-A { border-left: 4px solid var(--fs-away); }
.fs-tip-D { border-left: 4px solid var(--fs-draw); }
.fs-tip-ou { border-left: 4px solid var(--fs-over); }

.fs-r2 {
    display: grid; grid-template-columns: 1fr auto 1fr auto; align-items: center; column-gap: 1rem;
    padding: .6rem .75rem .7rem;
}
.fs-team { min-width: 0; }
.fs-team-a { text-align: right; }
.fs-name {
    display: block; font-weight: 700; font-size: 1rem; color: var(--fs-ink); text-decoration: none; margin-bottom: .3rem;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.fs-team-h .fs-name::before, .fs-team-a .fs-name::after {
    content: ''; display: inline-block; width: 9px; height: 9px; border-radius: 50%; vertical-align: 1px;
}
.fs-team-h .fs-name::before { background: var(--fs-home); margin-right: .4rem; }
.fs-team-a .fs-name::after { background: var(--fs-away); margin-left: .4rem; }
.fs-name:hover { color: var(--fs-accent); }
.fs-formline { display: flex; align-items: center; gap: .45rem; margin-top: 3px; }
.fs-team-a .fs-formline { justify-content: flex-end; }
.fs-team-a .fs-fl { order: 2; }
.fs-fl { font-size: .68rem; text-transform: uppercase; color: var(--fs-muted); width: 2.6rem; letter-spacing: .02em; }
.fs-team-a .fs-fl { text-align: left; }
.fs-vs { color: var(--fs-muted); font-size: .8rem; text-transform: uppercase; }
.fs-more {
    font-size: .8rem; font-weight: 600; text-decoration: none; color: var(--fs-accent); white-space: nowrap;
    border-left: 1px solid var(--fs-line); padding-left: 1rem; align-self: stretch; display: flex; align-items: center; gap: .35rem;
}
.fs-league-sep {
    display: flex; align-items: baseline; justify-content: space-between; margin: 1.4rem 0 .5rem;
    padding-bottom: .3rem; border-bottom: 2px solid var(--fs-accent);
}
.fs-league-sep:first-child { margin-top: .25rem; }
.fs-league-sep a { font-weight: 700; color: var(--fs-ink); text-decoration: none; font-size: 1.02rem; }
.fs-league-sep a:hover { color: var(--fs-accent); }
.fs-league-sep span { font-size: .8rem; color: var(--fs-muted); }
.fs-sorted-league .fs-lg-badge { display: none; }

/* ---------- tables ---------- */
.fs-tabs { display: flex; gap: .4rem; flex-wrap: wrap; margin-bottom: .75rem; }
.fs-panel { display: none; }
.fs-panel.active { display: block; }
.no-js .fs-panel { display: block; }
.fs-table, .fs-mtable { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.fs-table th, .fs-table td { padding: .45rem .5rem; text-align: center; border-bottom: 1px solid var(--fs-line); font-size: .9rem; }
.fs-table thead th { font-size: .72rem; text-transform: uppercase; color: var(--fs-muted); font-weight: 600; border-bottom: 2px solid var(--fs-line); }
.fs-table tbody th { font-weight: 600; }
.fs-table tbody tr:hover { background: var(--fs-soft); }
.fs-left { text-align: left !important; }
.fs-num { color: var(--fs-muted); width: 2.2rem; }
.fs-pts { font-weight: 700; }
.fs-table tr.fs-hl-home, .fs-table tr.fs-hl-home:hover { background: var(--fs-home-light); }
.fs-table tr.fs-hl-away, .fs-table tr.fs-hl-away:hover { background: var(--fs-away-light); }
.fs-table tr.fs-hl-home td:first-child { box-shadow: inset 4px 0 0 var(--fs-home); }
.fs-table tr.fs-hl-away td:first-child { box-shadow: inset 4px 0 0 var(--fs-away); }
.fs-key { display: inline-block; width: 12px; height: 12px; border-radius: 3px; vertical-align: -1px; margin-right: .25rem; }
.fs-key-hl-home { background: var(--fs-home-light); box-shadow: inset 0 0 0 1px var(--fs-home); }
.fs-key-hl-away { background: var(--fs-away-light); box-shadow: inset 0 0 0 1px var(--fs-away); }

.fs-mtable th, .fs-mtable td { padding: .35rem .4rem; border-bottom: 1px solid var(--fs-line); font-size: .82rem; text-align: center; }
.fs-mtable thead th { font-size: .68rem; text-transform: uppercase; color: var(--fs-muted); font-weight: 600; }
.fs-mt-match { min-width: 11rem; }
.fs-me { font-weight: 700; }
.fs-dash { color: var(--fs-muted); }
.fs-comp { display: inline-block; margin-left: .3rem; font-size: .62rem; padding: 0 .25rem; border-radius: 3px; background: var(--fs-soft); color: var(--fs-muted); border: 1px solid var(--fs-line); }
.fs-badge { display: inline-block; min-width: 2.6rem; padding: .1rem .35rem; border-radius: 4px; font-weight: 700; }
.fs-ht { color: var(--fs-muted); margin-left: .15rem; }
.fs-o { color: var(--fs-muted); }
.fs-o-won { color: var(--fs-ink); font-weight: 700; }

/* ---------- cards & preview ---------- */
.fs-card { border: 1px solid var(--fs-line); border-radius: 10px; padding: 1.25rem 1.25rem 1.1rem; margin-top: 1.5rem; background: #fff; }
.fs-card-head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; margin-bottom: .5rem; }
.fs-card-head .fs-tabs { margin-bottom: 0; }

.fs-mhead { border-bottom: 1px solid var(--fs-line); padding-bottom: 1.25rem; }
.fs-mhead-meta { display: flex; flex-wrap: wrap; gap: .4rem; font-size: .9rem; color: var(--fs-muted); }
.fs-mhead-meta a { font-weight: 600; color: var(--fs-accent); text-decoration: none; }
.fs-mtitle { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; font-size: 2rem; margin: .5rem 0 1rem; }
.fs-mvs { font-size: .5em; color: var(--fs-muted); text-transform: uppercase; }
.fs-dot { display: inline-block; width: .55em; height: .55em; border-radius: 50%; margin: 0 .4em; vertical-align: .1em; }
.fs-side-h .fs-dot, .fs-side-h.fs-dot { background: var(--fs-home); }
.fs-side-a .fs-dot, .fs-side-a.fs-dot { background: var(--fs-away); }
.fs-mtitle .fs-side-h .fs-dot { margin-left: 0; }
.fs-mtitle .fs-side-a .fs-dot { margin-right: 0; }
.fs-modds { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .5rem; max-width: 640px; }
.fs-modd { border: 1px solid var(--fs-line); border-radius: 8px; padding: .45rem .5rem; text-align: center; background: var(--fs-soft); }
.fs-modd-l { display: block; font-size: .7rem; text-transform: uppercase; color: var(--fs-muted); }
.fs-modd-v { display: block; font-size: 1.25rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.fs-modd-f { display: block; font-size: .7rem; color: var(--fs-muted); }
.fs-modd.fs-odd-tip { background: #fff; box-shadow: inset 0 0 0 2px var(--fs-accent); }

.fs-pred-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: 2rem; }
.fs-pred-picks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; margin-bottom: 1.1rem; }
.fs-pick { background: var(--fs-soft); border-radius: 8px; padding: .55rem .7rem; }
.fs-pick-l { display: block; font-size: .7rem; text-transform: uppercase; color: var(--fs-muted); }
.fs-pick-v { display: block; font-weight: 700; font-size: 1rem; line-height: 1.25; }
.fs-pick-H { color: var(--fs-home); }
.fs-pick-A { color: var(--fs-away); }
.fs-prob { margin-bottom: 1rem; }
.fs-prob-title { font-size: .8rem; font-weight: 600; color: var(--fs-muted); margin-bottom: .35rem; text-transform: uppercase; letter-spacing: .02em; }
.fs-stack { display: flex; gap: 2px; height: 30px; border-radius: 6px; overflow: hidden; }
.fs-stack-lg { height: 34px; }
.fs-seg {
    display: flex; align-items: center; justify-content: center; min-width: 2.2rem;
    color: #fff; font-weight: 700; font-size: .82rem; white-space: nowrap;
}
.fs-seg-h { background: var(--fs-home); }
.fs-seg-d { background: var(--fs-draw); }
.fs-seg-a { background: var(--fs-away); }
.fs-seg-o { background: var(--fs-over); }
.fs-seg-u { background: var(--fs-under); color: #1f2933; }
.fs-stack-legend { display: flex; justify-content: space-between; font-size: .75rem; color: var(--fs-muted); margin-top: .25rem; }

.fs-cols { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; height: 170px; align-items: end; }
.fs-col { display: flex; flex-direction: column; align-items: center; height: 100%; outline: none; }
.fs-col-v { font-size: .75rem; color: var(--fs-muted); margin-bottom: 2px; }
.fs-col-bar { flex: 1; width: 100%; display: flex; align-items: flex-end; }
.fs-col-bar i { display: block; width: 100%; background: var(--fs-under); border-radius: 4px 4px 0 0; min-height: 2px; }
.fs-col-over .fs-col-bar i { background: var(--fs-over); }
.fs-col:hover .fs-col-bar i, .fs-col:focus-visible .fs-col-bar i { filter: brightness(.9); }
.fs-col-l { font-size: .8rem; font-weight: 600; margin-top: 3px; }
.fs-scores { display: flex; gap: .4rem; flex-wrap: wrap; }
.fs-score { background: var(--fs-soft); border-radius: 6px; padding: .25rem .6rem; font-size: .85rem; color: var(--fs-muted); }
.fs-score b { color: var(--fs-ink); font-size: 1rem; margin-right: .2rem; }

.fs-disclaimer {
    display: flex; gap: .75rem; align-items: flex-start; margin-top: 1.25rem; padding: .85rem 1rem;
    background: #fff8e6; border: 1px solid #f5dfa3; border-radius: 8px; font-size: .85rem; color: #5c4610;
}
.fs-disclaimer i { font-size: 1.2rem; margin-top: .1rem; color: #b07d00; }
.fs-disclaimer p { margin: 0; }
.fs-disclaimer a { color: inherit; font-weight: 600; }

.fs-teamcards { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; margin-top: .75rem; }
.fs-teamcard { border-radius: 8px; background: var(--fs-soft); padding: .85rem 1rem; border-top: 4px solid var(--fs-home); }
.fs-teamcard.fs-side-a { border-top-color: var(--fs-away); }
.fs-teamcard-head { display: flex; align-items: baseline; gap: .1rem; flex-wrap: wrap; margin-bottom: .6rem; }
.fs-teamcard-head .fs-dot { margin-left: 0; }
.fs-teamcard-head strong { font-size: 1.05rem; margin-right: .5rem; }
.fs-scope { font-size: .78rem; color: var(--fs-muted); }
.fs-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; margin-bottom: .75rem; }
.fs-kpis-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 1rem; }
.fs-kpi { background: #fff; border-radius: 6px; padding: .45rem .55rem; }
.fs-kpi-v { display: block; font-size: 1.35rem; font-weight: 700; line-height: 1.15; font-variant-numeric: tabular-nums; }
.fs-kpi-l { display: block; font-size: .7rem; color: var(--fs-muted); }
.fs-record { display: flex; gap: 2px; height: 24px; border-radius: 5px; overflow: hidden; }
.fs-rec { display: flex; align-items: center; justify-content: center; font-size: .78rem; font-weight: 700; color: #fff; min-width: 1.4rem; }
.fs-rec-w { background: var(--fs-win); }
.fs-rec-d { background: var(--fs-mid); color: #3b2a00; }
.fs-rec-l { background: var(--fs-loss); }
.fs-record-legend { display: flex; gap: .75rem; font-size: .72rem; color: var(--fs-muted); margin-top: .35rem; flex-wrap: wrap; }
.fs-record-legend .fs-key { width: 9px; height: 9px; }

.fs-cmp { margin-top: 1.25rem; }
.fs-cmp-head { display: flex; justify-content: space-between; font-weight: 700; font-size: .92rem; padding-bottom: .4rem; border-bottom: 1px solid var(--fs-line); }
.fs-cmp-head small { font-weight: 400; color: var(--fs-muted); }
.fs-cmp-head .fs-side-h .fs-dot { margin-left: 0; }
.fs-cmp-head .fs-side-a .fs-dot { margin-right: 0; }
.fs-cmp-row {
    display: grid; grid-template-columns: 3.4rem 1fr minmax(9.5rem, auto) 1fr 3.4rem; align-items: center;
    column-gap: .6rem; padding: .28rem 0; font-variant-numeric: tabular-nums;
}
.fs-cmp-row:hover { background: var(--fs-soft); }
.fs-cmp-v { font-weight: 700; font-size: .9rem; }
.fs-cmp-va { text-align: right; }
.fs-cmp-label { text-align: center; font-size: .82rem; color: var(--fs-muted); }
.fs-cmp-bar { height: 10px; background: var(--fs-soft); border-radius: 5px; display: flex; overflow: hidden; }
.fs-cmp-l { justify-content: flex-end; }
.fs-cmp-bar i { display: block; height: 100%; }
.fs-cmp-l i { background: var(--fs-home); border-radius: 5px 0 0 5px; }
.fs-cmp-r i { background: var(--fs-away); border-radius: 0 5px 5px 0; }

.fs-gcharts { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.5rem; }
.fs-gchart-title { font-weight: 700; font-size: .9rem; margin-bottom: .35rem; }
.fs-gchart-title .fs-dot { margin-left: 0; }
.fs-gchart-title small { font-weight: 400; color: var(--fs-muted); }
.fs-gchart { display: flex; gap: 4px; height: 150px; align-items: stretch; border-radius: 6px; background: var(--fs-soft); padding: 6px; }
.fs-gcol { flex: 1; display: flex; flex-direction: column; min-width: 0; outline: none; border-radius: 4px; }
.fs-gcol:hover, .fs-gcol:focus-visible { background: rgba(0,0,0,.05); }
.fs-gup, .fs-gdown { flex: 1; display: flex; }
.fs-gup { align-items: flex-end; border-bottom: 1px solid #b8bec5; }
.fs-gdown { align-items: flex-start; }
.fs-gup i, .fs-gdown i { font-style: normal; display: flex; width: 70%; margin: 0 auto; justify-content: center; position: relative; }
.fs-gup i { background: var(--fs-home); border-radius: 4px 4px 0 0; align-items: flex-start; }
.fs-side-a .fs-gup i { background: var(--fs-away); }
.fs-gdown i { background: #9aa1a9; border-radius: 0 0 4px 4px; align-items: flex-end; }
.fs-gup b, .fs-gdown b { font-style: normal; font-size: .68rem; color: #fff; line-height: 1.3; }
.fs-gres { font-size: .62rem; font-weight: 700; text-align: center; border-radius: 3px; margin-top: 3px; }

.fs-lists { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 1.5rem; }
.fs-list, .fs-teamcard, .fs-gcharts > div { min-width: 0; }
.fs-list .fs-h3 { margin-top: 1rem; }
.fs-list .fs-h3 .fs-dot { margin-left: 0; }

.fs-h2h-sum { margin-bottom: 1rem; max-width: 640px; }

/* ---------- leagues index ---------- */
.fs-countries { columns: 2 280px; column-gap: 2rem; }
.fs-country { break-inside: avoid; margin-bottom: 1.5rem; }
.fs-country-name { font-size: 1.1rem; border-bottom: 2px solid var(--fs-accent); padding-bottom: .3rem; margin-bottom: .5rem; }
.fs-league-list { list-style: none; padding: 0; margin: 0; }
.fs-league-list li { display: flex; justify-content: space-between; gap: 1rem; padding: .35rem 0; border-bottom: 1px solid var(--fs-line); }
.fs-league-list a { font-weight: 600; text-decoration: none; }
.fs-league-meta { font-size: .8rem; color: var(--fs-muted); white-space: nowrap; }

/* Leagues dropdown in the main menu: two columns when it gets long */
@media (min-width: 1200px) {
    .navbar .dropdown:has(> a[href$="/leagues"]) .dropdown-menu { column-count: 2; column-gap: 0; min-width: 30rem; }
    .navbar .dropdown:has(> a[href$="/leagues"]) .dropdown-item { break-inside: avoid; }
}

/* ---------- responsive ---------- */
@media (max-width: 991.98px) {
    .fs-pred-grid { grid-template-columns: 1fr; gap: 1.25rem; }
    .fs-lists { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767.98px) {
    .fs-head { display: none; }
    .fs-r1 { grid-template-columns: repeat(5, minmax(0, 1fr)); row-gap: .4rem; }
    .fs-when { grid-column: 1 / -1; }
    .fs-tip { grid-column: 1 / -1; justify-content: flex-start; }
    .fs-odd-label { display: block; }
    .fs-r2 { grid-template-columns: 1fr 1fr; row-gap: .5rem; }
    .fs-vs { display: none; }
    .fs-more { grid-column: 1 / -1; border-left: 0; padding-left: 0; border-top: 1px solid var(--fs-line); padding-top: .5rem; justify-content: center; }
    .fs-teamcards, .fs-gcharts { grid-template-columns: minmax(0, 1fr); }
    .fs-table th, .fs-table td { padding: .4rem .3rem; font-size: .82rem; }
    .fs-mtable th, .fs-mtable td { padding: .3rem .25rem; }
    .fs-mt-match { min-width: 9rem; }
    .fs-cmp-row { grid-template-columns: 2.8rem 1fr 1fr 2.8rem; row-gap: 2px; }
    .fs-cmp-label { grid-column: 1 / -1; grid-row: 1; }
    .fs-mtitle { font-size: 1.5rem; }
    .fs-modds { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .3rem; }
    .fs-modd-v { font-size: 1.05rem; }
    .fs-pred-picks { grid-template-columns: 1fr; }
    .fs-kpis-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 420px) {
    .fs-sq { width: 17px; height: 17px; font-size: 9px; }
    .fs-fl { width: 2.2rem; font-size: .6rem; }
    .fs-card { padding: 1rem .8rem; }
}

@media (forced-colors: active) {
    .fs-sq, .fs-seg, .fs-rec { border: 1px solid CanvasText; }
}

/* ---------- Leagues box in the sidebar (every page) ---------- */
.fs-sb-leagues { --fs-accent: var(--cs1-p1, var(--bs-primary, #1B7DFF)); --fs-on-accent: var(--cs1-on-p1, #fff); background: #fff; }
.fs-sb-country {
    font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: #6c757d;
    margin: .85rem 0 .2rem; padding-bottom: .2rem; border-bottom: 1px solid #e3e6ea;
}
.fs-sb-leagues h4 + .fs-sb-country { margin-top: 0; }
.fs-sb-list { list-style: none; margin: 0; padding: 0; }
.fs-sb-list a {
    display: flex; align-items: baseline; gap: .3rem;
    padding: .3rem .5rem; margin: 0 -.5rem; border-radius: 5px; color: #1f2933; text-decoration: none; font-size: .92rem;
}
.fs-sb-list a:hover { background: #f5f7f9; color: var(--fs-accent); }
.fs-sb-list a.active { background: var(--fs-accent); color: var(--fs-on-accent); font-weight: 600; }
.fs-sb-count { color: #6c757d; font-size: .88rem; }
.fs-sb-list a.active .fs-sb-count { color: inherit; opacity: .85; }