/* ═══════════════════════════════════════════════════════════════════════════
   RespinnersTV — VÝSLEDKOVÁ DESKA (.lsb-*)
   Hustý třísloupcový výpis zápasů ve stylu výsledkových služeb.
   Načítá se AŽ ZA page-sport.css (viz includes/header.php), je to vrstva nad ní.
   ---------------------------------------------------------------------------
   ZÁMĚR: tohle není marketingová stránka, ale tabulka. Řádek zápasu je vysoký
   44 až 52 px, mezi zápasy je linka místo mezery, skupiny lig jdou těsně pod
   sebou. Oko má na jedné obrazovce přečíst dvacet zápasů, ne tři karty.

   ČTYŘI PRAVIDLA, KTERÁ TU PLATÍ BEZ VÝJIMKY:
     1. každý selektor začíná .lsb (soubor běží vedle page-sport.css a nesmí
        přetéct na nic jiného, proto žádné :root a žádné holé tagy),
     2. žádné velké zaoblení, žádné záře, žádné stíny (je to tabulka),
     3. barva nese informaci: akcent = aktivní stav, odkaz a živý zápas,
        všechno ostatní je stupnice bílé na tmavé,
     4. tabulární číslice všude, kde stojí čas nebo skóre, jinak sloupec tančí.

   DVĚ PASTI TOHOTO WEBU, na které soubor reaguje:
     • base.css dává KAŽDÉMU <section> display:flex a `padding: X 0`. Deska se
       proto nespoléhá na to, že je section blok, a explicitně si display
       nastavuje sama.
     • .sp-badge-img (znak týmu z page-sport.css) nese margin-right a pevných
       18 px. Uvnitř desky se přepisuje na menší rozměr bez okraje, viz
       .lsb-crest.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Tokeny desky ───────────────────────────────────────────────────────────
   Schválně na kořenové třídě, ne na :root. Deska je komponenta, ne téma webu,
   a nesmí si sáhnout na barvy zbytku stránky. */
.lsb {
    --lsb-accent:      #00f5ff;                    /* aktivní stav, odkaz, živě */
    --lsb-accent-ink:  #06232a;                    /* text na plném akcentu */
    --lsb-accent-bg:   rgba(0, 245, 255, 0.12);    /* výplň aktivního stavu */
    --lsb-accent-line: rgba(0, 245, 255, 0.45);

    --lsb-surface:   #0d1017;   /* plocha panelu a výpisu */
    --lsb-surface-2: #131820;   /* hover řádku, hlavička panelu */
    --lsb-band:      #1b2434;   /* pruh ligy: zřetelně světlejší než plocha */
    --lsb-band-2:    #223047;   /* hover pruhu ligy */

    --lsb-line:      rgba(255, 255, 255, 0.11);   /* rámeček prvku */
    --lsb-line-soft: rgba(255, 255, 255, 0.06);   /* linka mezi zápasy */

    --lsb-ink:   #ffffff;                    /* jméno vítěze, skóre, nadpis */
    --lsb-ink-2: rgba(255, 255, 255, 0.74);  /* běžný text, jméno týmu */
    --lsb-ink-3: rgba(255, 255, 255, 0.46);  /* čas, meta, počty */

    /* Sticky lišty se lepí pod navigaci. Fallback 116 px odpovídá nejvyšší
       variantě navbaru (viz navbar.css), na užších oknech je --nav-height nižší. */
    --lsb-stick: calc(var(--nav-height, 116px) + 8px);

    --lsb-r:    6px;   /* panel, skupina ligy */
    --lsb-r-s:  4px;   /* tlačítko, čip, položka seznamu */
    --lsb-r-xs: 3px;   /* odznak, počítadlo */

    display: block;          /* proti globálnímu section{display:flex} */
    width: 100%;
    max-width: 100%;
    color: var(--lsb-ink-2);
    font-family: var(--font-body, 'Montserrat', sans-serif);
    font-size: 13px;
    line-height: 1.35;
}

/* Blokové obaly, aby žádný z nich nespadl do flexu z base.css. */
.lsb-shell,
.lsb-aside,
.lsb-aside-block,
.lsb-main,
.lsb-rail,
.lsb-panel,
.lsb-league,
.lsb-league-body { display: block; }

/* Rozměry se počítají včetně rámečku. base.css to sice nastavuje globálně,
   ale deska je komponenta a nesmí stát na cizím resetu: pevné výšky řádku
   a lišt by se bez toho rozjely. */
.lsb,
.lsb *,
.lsb *::before,
.lsb *::after { box-sizing: border-box; }

.lsb a { text-decoration: none; color: inherit; }
.lsb :focus-visible { outline: 2px solid var(--lsb-accent); outline-offset: 1px; }
/* Písmo tlačítek se dědí, VELIKOST ne: font-size si každé tlačítko určuje
   samo a `font: inherit` by ho svou vyšší specifičností přebilo. */
.lsb button { font-family: inherit; color: inherit; }

/* ═══ LIŠTA SPORTŮ ══════════════════════════════════════════════════════════
   Nejvyšší patro navigace. Na užším okně se posouvá vodorovně, nikdy se
   nezalamuje do dvou řad, jinak deska začne skákat. */
.lsb-sports {
    display: flex;
    align-items: stretch;
    gap: 2px;
    margin: 0 0 10px;
    padding: 0;
    background: var(--lsb-surface);
    border: 1px solid var(--lsb-line);
    border-radius: var(--lsb-r);
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
}
.lsb-sports::-webkit-scrollbar { height: 4px; }
.lsb-sports::-webkit-scrollbar-thumb { background: var(--lsb-line); border-radius: 2px; }

.lsb-sport {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 13px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
    white-space: nowrap;
    color: var(--lsb-ink-3);
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    transition: color .12s ease, background-color .12s ease, border-color .12s ease;
}
.lsb-sport:hover { color: var(--lsb-ink); background: var(--lsb-surface-2); }
.lsb-sport.is-active {
    color: var(--lsb-ink);
    background: var(--lsb-surface-2);
    border-bottom-color: var(--lsb-accent);
}

/* Ikona odvětví. Markup posílá inline <svg> BEZ width/height (sportIcoSvg),
   takže rozměr musí dát CSS. Bez tohohle pravidla se svg jako flex položka
   smrskne na nulu a lišta sportů je jen text. */
.lsb-sport-ico {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
}
.lsb-sport-ico svg { width: 14px; height: 14px; }

.lsb-sport-count {
    display: inline-block;
    min-width: 18px;
    padding: 1px 5px;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.5;
    text-align: center;
    color: var(--lsb-ink-3);
    background: rgba(255, 255, 255, 0.07);
    border-radius: var(--lsb-r-xs);
    font-variant-numeric: tabular-nums;
}
.lsb-sport.is-active .lsb-sport-count {
    color: var(--lsb-accent-ink);
    background: var(--lsb-accent);
}

/* ═══ TŘI SLOUPCE ═══════════════════════════════════════════════════════════
   Vlevo ligy a země, uprostřed výsledky, vpravo postranní panel.
   minmax(0, 1fr) je povinné: bez něj by dlouhý název týmu roztáhl střední
   sloupec a vystrčil pravý panel z okna. */
.lsb-shell {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr) 300px;
    gap: 12px;
    align-items: start;
}

.lsb-aside,
.lsb-main,
.lsb-rail { min-width: 0; }

/* Krajní sloupce se drží pod navigací, střední sloupec pod nimi projíždí.
   Vlastní posuvník mají proto, aby dlouhý seznam lig nepřerostl obrazovku. */
.lsb-aside,
.lsb-rail {
    position: sticky;
    top: var(--lsb-stick);
    max-height: calc(100vh - var(--lsb-stick) - 12px);
    overflow-y: auto;
    scrollbar-width: thin;
}
.lsb-aside::-webkit-scrollbar,
.lsb-rail::-webkit-scrollbar { width: 5px; }
.lsb-aside::-webkit-scrollbar-thumb,
.lsb-rail::-webkit-scrollbar-thumb { background: var(--lsb-line); border-radius: 3px; }

/* ═══ LEVÝ SLOUPEC: ligy a země ═════════════════════════════════════════════ */
.lsb-aside-block {
    background: var(--lsb-surface);
    border: 1px solid var(--lsb-line);
    border-radius: var(--lsb-r);
    overflow: hidden;
}
.lsb-aside-block + .lsb-aside-block { margin-top: 8px; }

.lsb-aside-title {
    margin: 0;
    padding: 8px 10px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--lsb-ink-3);
    background: var(--lsb-surface-2);
    border-bottom: 1px solid var(--lsb-line);
}

.lsb-aside-list {
    display: block;
    margin: 0;
    padding: 4px;
    list-style: none;
}
.lsb-aside-list > li { display: block; }

.lsb-aside-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 7px;
    border-radius: var(--lsb-r-s);
    border-left: 2px solid transparent;
    color: var(--lsb-ink-2);
    font-size: 12.5px;
    line-height: 1.3;
    transition: color .12s ease, background-color .12s ease, border-color .12s ease;
}
.lsb-aside-item:hover { color: var(--lsb-ink); background: var(--lsb-surface-2); }
.lsb-aside-item.is-active {
    color: var(--lsb-ink);
    background: var(--lsb-accent-bg);
    border-left-color: var(--lsb-accent);
}

/* Vlajka je emoji ze sport-countries.php. Pevný rámeček má proto, aby
   položka bez vlajky (neznámá země) zabrala přesně stejné místo
   a seznam neposkakoval. */
.lsb-aside-flag {
    flex: 0 0 18px;
    width: 18px;
    height: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    line-height: 1;
    overflow: hidden;
    border-radius: 2px;
}
.lsb-aside-name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lsb-aside-count {
    flex: 0 0 auto;
    font-size: 11px;
    font-weight: 700;
    color: var(--lsb-ink-3);
    font-variant-numeric: tabular-nums;
}
.lsb-aside-item.is-active .lsb-aside-count { color: var(--lsb-accent); }

/* ═══ STŘEDNÍ SLOUPEC ═══════════════════════════════════════════════════════ */

/* ── Lišta filtrů a data ────────────────────────────────────────────────────
   Lepí se pod navigaci, aby při projíždění dlouhého výpisu bylo pořád vidět,
   který den a který filtr je zapnutý. Podklad je proto neprůhledný. */
.lsb-toolbar {
    position: sticky;
    top: var(--lsb-stick);
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 8px;
    padding: 5px 8px;
    background: var(--lsb-surface);
    border: 1px solid var(--lsb-line);
    border-radius: var(--lsb-r);
}

.lsb-tabs {
    display: flex;
    align-items: center;
    gap: 2px;
    min-width: 0;
    margin: 0;
    padding: 0;
    overflow-x: auto;
    scrollbar-width: none;
}
.lsb-tabs::-webkit-scrollbar { display: none; }

.lsb-tab {
    flex: 0 0 auto;
    display: inline-block;
    padding: 6px 10px;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    white-space: nowrap;
    color: var(--lsb-ink-3);
    background: transparent;
    border: 0;
    border-radius: var(--lsb-r-s);
    cursor: pointer;
    transition: color .12s ease, background-color .12s ease;
}
.lsb-tab:hover { color: var(--lsb-ink); background: var(--lsb-surface-2); }
.lsb-tab.is-active {
    color: var(--lsb-accent-ink);
    background: var(--lsb-accent);
}

/* ── Přepínač data ───────────────────────────────────────────────────────── */
.lsb-date {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 2px;
}

.lsb-date-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    padding: 0;
    color: var(--lsb-ink-3);
    background: transparent;
    border: 1px solid var(--lsb-line);
    border-radius: var(--lsb-r-s);
    font-size: 12px;
    line-height: 1;
    cursor: pointer;
    transition: color .12s ease, background-color .12s ease, border-color .12s ease;
}
.lsb-date-btn svg { width: 14px; height: 14px; }
.lsb-date-btn:hover {
    color: var(--lsb-ink);
    background: var(--lsb-surface-2);
    border-color: var(--lsb-accent-line);
}
/* Na kraji okna (±14 dní) není šipka odkaz, ale <span aria-disabled>. Musí to
   být vidět, jinak vypadá jako tlačítko, které po kliknutí nic neudělá. */
.lsb-date-btn[aria-disabled="true"] {
    opacity: .3;
    cursor: default;
    pointer-events: none;
}

.lsb-date-label {
    min-width: 96px;
    padding: 0 6px;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--lsb-ink);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* ═══ SKUPINA LIGY ══════════════════════════════════════════════════════════
   Skupiny jdou těsně pod sebou, mezera 8 px. Pruh ligy je zřetelně světlejší
   než plocha výpisu, takže hranice skupin je vidět na první pohled. */
.lsb-league {
    background: var(--lsb-surface);
    border: 1px solid var(--lsb-line);
    border-radius: var(--lsb-r);
    overflow: hidden;
    scroll-margin-top: calc(var(--lsb-stick) + 44px);
}
.lsb-league + .lsb-league { margin-top: 8px; }

.lsb-league-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 5px 10px;
    min-height: 30px;
    background: var(--lsb-band);
    border-bottom: 1px solid var(--lsb-line);
}

.lsb-league-flag {
    flex: 0 0 18px;
    width: 18px;
    height: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    line-height: 1;
    overflow: hidden;
    border-radius: 2px;
}
/* "ZEMĚ: Liga". Země zůstává v běžné váze, název ligy nese tučný řez,
   takže se dvě informace v jednom řádku nepletou. */
.lsb-league-name {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;              /* h3 v pruhu ligy nesmí táhnout výchozí okraje */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--lsb-ink);
}
.lsb-league-actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 6px;
}

.lsb-league-table {
    display: inline-block;
    padding: 2px 7px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--lsb-ink-2);
    background: rgba(255, 255, 255, 0.07);
    border-radius: var(--lsb-r-xs);
    white-space: nowrap;
    transition: color .12s ease, background-color .12s ease;
}
.lsb-league-table:hover {
    color: var(--lsb-accent-ink);
    background: var(--lsb-accent);
}

/* Šipka na sbalení je nakreslená z rámečku, aby nezávisela na fontu ikon. */
.lsb-league-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding: 0;
    color: var(--lsb-ink-2);
    background: transparent;
    border: 0;
    border-radius: var(--lsb-r-xs);
    cursor: pointer;
    font-size: 0;
    transition: color .12s ease, background-color .12s ease;
}
.lsb-league-toggle:hover { color: var(--lsb-ink); background: var(--lsb-band-2); }
/* Šipku kreslí CSS z rámečku, markup do tlačítka žádnou ikonu nevkládá.
   Nezávisí tak na fontu ikon ani na žádném <svg>. */
.lsb-league-toggle::before {
    content: "";
    width: 6px;
    height: 6px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-2px) rotate(45deg);
    transition: transform .15s ease;
}

/* Sbalený stav: šipka ukazuje doleva. Čte se ze stavu těla skupiny (:has)
   i z aria-expanded na tlačítku, podle toho, co markup nese. */
.lsb-league-toggle[aria-expanded="false"]::before {
    transform: translate(2px, 0) rotate(-45deg);
}
/* Vlastní pravidlo, ne položka výčtu výš: neznámý :has() by shodil i tu část,
   která si vystačí s aria-expanded (a to je ta, kterou nastavuje skript). */
.lsb-league:has(.lsb-league-body.is-collapsed) .lsb-league-toggle::before {
    transform: translate(2px, 0) rotate(-45deg);
}

.lsb-league-body {
    margin: 0;
    padding: 0;
}
.lsb-league-body.is-collapsed { display: none; }

/* ═══ ŘÁDEK ZÁPASU ══════════════════════════════════════════════════════════
   Jádro celé desky. Čtyři sloupce: hvězdička, čas, oba týmy pod sebou, skóre.
   Sloupce jsou pevné, takže délka názvu týmu nikam neposouvá skóre a celý
   výpis je svisle zarovnaný.

   PROČ MŘÍŽKA A NE FLEX: odznak stavu (.lsb-badge) existuje jen u některých
   zápasů (živě, konec, odloženo) a markup ho vkládá dovnitř .lsb-time.
   Ve flexu by jeho šířka posunula skóre jen na těch řádcích, v pevné mřížce
   sedí celý ve sloupci času a do šířky sloupců nemluví vůbec.

   Výška: 2 řádky týmů po 17 px + mezera 3 px + 6 px svislého odsazení
   nahoře i dole = 49 px. To je cíl, ne náhoda. */
.lsb-match {
    display: grid;
    grid-template-columns: auto 58px minmax(0, 1fr) minmax(30px, auto);
    column-gap: 8px;
    align-items: center;
    padding: 6px 10px;
    border-bottom: 1px solid var(--lsb-line-soft);
    color: var(--lsb-ink-2);
    border-left: 2px solid transparent;
    transition: background-color .12s ease;
}
/* Linka odděluje zápas OD ZÁPASU. Poslední řádek ve skupině ji nemá, i když
   za ním v těle skupiny ještě leží tabulka soutěže (ta bývá sbalená a linka
   by pod skupinou zůstala viset). Proto se ptáme na následující zápas, ne
   na poslední prvek. */
.lsb-match:last-child { border-bottom: 0; }
/* Vlastní pravidlo, ne další položka výčtu výš: neznámý :has() by shodil
   celé pravidlo včetně :last-child. */
.lsb-match:not(:has(~ .lsb-match)) { border-bottom: 0; }
.lsb-match:hover { background: var(--lsb-surface-2); }

/* Pevné umístění do buněk. Píše se přes přímé potomky, aby to platilo i tehdy,
   když markup některý prvek vnoří hlouběji (typicky odznak uvnitř času). */
.lsb-match > .lsb-star   { grid-column: 1; grid-row: 1; align-self: start; }
.lsb-match > .lsb-time   { grid-column: 2; grid-row: 1; align-self: start; padding-top: 1px; }
.lsb-match > .lsb-teams  { grid-column: 3; grid-row: 1; }
.lsb-match > .lsb-scores { grid-column: 4; grid-row: 1; }

/* ── Hvězdička oblíbených ───────────────────────────────────────────────────
   Styl je připravený, ale platí domácí pravidlo: hvězdičku do markupu jen
   tehdy, když opravdu ukládá do localStorage a napájí filtr Oblíbené. */
.lsb-star {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    padding: 0;
    font-size: 12px;
    line-height: 1;
    color: rgba(255, 255, 255, 0.22);
    background: transparent;
    border: 0;
    cursor: pointer;
    transition: color .12s ease;
}
/* Hvězdička je inline <svg> bez rozměrů, obrys se plní až po zapnutí. */
.lsb-star svg { width: 15px; height: 15px; }
.lsb-star:hover { color: rgba(255, 255, 255, 0.55); }
.lsb-star.is-on { color: var(--lsb-accent); }
.lsb-star.is-on svg { fill: currentColor; }

/* ── Čas, případně stav ─────────────────────────────────────────────────────
   Sloupec je úzký, ale pevný. Sloupec se zápasy začíná u všech řádků stejně. */
.lsb-time {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 2px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--lsb-ink-3);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
/* ── Dva týmy pod sebou ─────────────────────────────────────────────────────
   Jedna mřížka pro oba řádky: jména i znaky lícují a řádek nikdy nepřeteče. */
.lsb-teams {
    display: grid;
    grid-auto-rows: minmax(17px, auto);
    gap: 3px;
    min-width: 0;
}

.lsb-team {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    font-size: 13.5px;
    line-height: 1.25;
    color: var(--lsb-ink-2);
}
.lsb-team.is-winner { color: var(--lsb-ink); font-weight: 700; }

/* Znak týmu. page-sport.css mu dává 18 px a pravý okraj, tady je menší
   a bez okraje, protože mezeru řeší gap. Monogramová náhrada má schválně
   stejné rozměry, aby řádky bez znaku neposkakovaly. */
.lsb-crest {
    flex: 0 0 16px;
    width: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.lsb-crest img,
.lsb-crest .sp-badge-img,
.lsb .lsb-crest .sp-badge-img {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    margin: 0;
    vertical-align: middle;
    object-fit: contain;
}
.lsb .lsb-crest .sp-badge-img--mono { font-size: 9px; border-radius: 2px; }

.lsb-team-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Skóre ──────────────────────────────────────────────────────────────────
   Dvě čísla pod sebou, zarovnaná doprava, tabulární číslice.
   U nedohraných zápasů drží sloupec šířku pomlčkou z markupu. */
.lsb-scores {
    display: grid;
    grid-auto-rows: minmax(17px, auto);
    gap: 3px;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.lsb-score {
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.25;
    color: var(--lsb-ink-3);
    white-space: nowrap;
}
.lsb-score.is-winner { color: var(--lsb-ink); font-weight: 800; }

/* ── Stavy řádku ────────────────────────────────────────────────────────────
   ŽIVĚ musí být poznat na první pohled: svislý pruh u kraje, světlejší
   podklad, akcentní čas i skóre. Akcent se v řádku jinde neobjevuje, takže
   živý zápas nemá s čím splynout.
   DOHRÁNO je naopak klidné: skóre zbělá, čas zůstane tlumený. */
.lsb-match.is-live {
    background: rgba(0, 245, 255, 0.05);
    border-left-color: var(--lsb-accent);
}
.lsb-match.is-live:hover { background: rgba(0, 245, 255, 0.09); }
.lsb-match.is-live .lsb-time { color: var(--lsb-accent); font-weight: 800; }
.lsb-match.is-live .lsb-score { color: var(--lsb-accent); font-weight: 800; }
.lsb-match.is-live .lsb-team { color: var(--lsb-ink); }

.lsb-match.is-finished .lsb-score { color: var(--lsb-ink-2); }
.lsb-match.is-finished .lsb-score.is-winner { color: var(--lsb-ink); font-weight: 800; }

/* ── Odznak stavu ───────────────────────────────────────────────────────── */
.lsb-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    max-width: 100%;
    overflow: hidden;
    padding: 1px 5px;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .03em;
    line-height: 1.6;
    text-transform: uppercase;
    white-space: nowrap;
    color: var(--lsb-ink-3);
    background: rgba(255, 255, 255, 0.07);
    border-radius: var(--lsb-r-xs);
}
.lsb-badge.is-live {
    color: var(--lsb-accent-ink);
    background: var(--lsb-accent);
}
.lsb-badge.is-live::before {
    content: "";
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: currentColor;
    animation: lsb-live-pulse 1.4s ease-in-out infinite;
}
@keyframes lsb-live-pulse {
    0%, 100% { opacity: 1; }
    50%      { opacity: .25; }
}

/* ═══ PRAVÝ SLOUPEC ═════════════════════════════════════════════════════════ */
.lsb-panel {
    background: var(--lsb-surface);
    border: 1px solid var(--lsb-line);
    border-radius: var(--lsb-r);
    overflow: hidden;
}
.lsb-panel + .lsb-panel { margin-top: 8px; }

.lsb-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 0;
    padding: 8px 10px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--lsb-ink-3);
    background: var(--lsb-surface-2);
    border-bottom: 1px solid var(--lsb-line);
}

.lsb-panel-body {
    display: block;
    padding: 8px 10px;
    font-size: 12.5px;
    line-height: 1.5;
    color: var(--lsb-ink-2);
}
.lsb-panel-body > p { margin: 0 0 6px; }
.lsb-panel-body > p:last-child { margin-bottom: 0; }
.lsb-panel-body a { color: var(--lsb-accent); }
.lsb-panel-body a:hover { text-decoration: underline; }

/* ═══ PRÁZDNÝ STAV ══════════════════════════════════════════════════════════ */
.lsb-empty {
    display: block;
    margin: 0;
    padding: 22px 14px;
    text-align: center;
    font-size: 13px;
    line-height: 1.5;
    color: var(--lsb-ink-3);
    background: var(--lsb-surface);
    border: 1px solid var(--lsb-line);
    border-radius: var(--lsb-r);
}
/* Skript schovává hlášku „nemáš žádný oblíbený zápas" atributem hidden.
   Bez tohohle řádku ji display: block o kus výš přebije (autorský styl vyhrává
   nad stylem prohlížeče) a hláška svítí ve filtru Oblíbené pořád, i když
   oblíbené zápasy jsou. */
.lsb-empty[hidden] { display: none; }
.lsb-empty strong { color: var(--lsb-ink-2); font-weight: 700; }
.lsb-empty a { color: var(--lsb-accent); }

/* ═══ TABULKA SOUTĚŽE ══════════════════════════════════════════════════════
   Pořadí ze sport_tables, schované pod odkazem „Tabulka" v pruhu ligy.
   Blok nese i .ed-table-wrap z obsahové vrstvy, jenže ta je stavěná na článek:
   16 px odsazení buněk, vlastní rámeček a přechod na pozadí. Uvnitř desky se
   to musí utáhnout, jinak jedna tabulka přeroste celý den zápasů.
   Skript blok schovává přes style.display, proto tu žádný display nestojí. */
.lsb-standings {
    margin: 0;
    border: 0;
    border-top: 1px solid var(--lsb-line);
    border-radius: 0;
    background: transparent;
}
.lsb-standings .ed-table th,
.lsb-standings .ed-table td {
    padding: 5px 8px;
    font-size: 11.5px;
    line-height: 1.3;
    white-space: nowrap;
}
.lsb-standings .ed-table th {
    font-family: inherit;
    letter-spacing: .06em;
    color: var(--lsb-ink-3);
    background: var(--lsb-surface-2);
    border-bottom: 1px solid var(--lsb-line);
}
.lsb-standings .ed-table td {
    color: var(--lsb-ink-2);
    font-variant-numeric: tabular-nums;
}
/* Druhý sloupec je jméno týmu, jen ten smí zabrat zbylé místo. */
.lsb-standings .ed-table td:nth-child(2) {
    width: 100%;
    white-space: normal;
}
.lsb-standings .ed-table strong { color: var(--lsb-ink); }

.lsb-standings-caption {
    padding: 6px 8px;
    text-align: left;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--lsb-ink-3);
}

/* ═══════════════════════════════════════════════════════════════════════════
   UŽŠÍ OKNA
   Pořadí ústupků: nejdřív odejde pravý panel pod obsah, potom i levý sloupec.
   Řádek zápasu se nezmenšuje do nečitelna, jen se mu utáhnou okraje.
   ═══════════════════════════════════════════════════════════════════════════ */

/* Pod 1100 px: dva sloupce, pravý panel padá pod obsah a rozloží se do mřížky. */
@media (max-width: 1100px) {
    .lsb-shell { grid-template-columns: 230px minmax(0, 1fr); }
    .lsb-rail {
        position: static;
        max-height: none;
        overflow: visible;
        grid-column: 1 / -1;
        display: grid;
        /* auto-fill, ne auto-fit: jediný panel má zůstat kartou v jednom
           sloupci, ne se roztáhnout přes celou šířku desky. */
        grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
        gap: 8px;
        align-items: start;
        margin-top: 4px;
    }
    .lsb-panel + .lsb-panel { margin-top: 0; }
}

/* Pod 860 px: jeden sloupec. Výsledky zůstávají první, pod nimi ligy a panely. */
@media (max-width: 860px) {
    .lsb-shell { grid-template-columns: minmax(0, 1fr); gap: 10px; }
    .lsb-main  { order: 1; }
    .lsb-aside { order: 2; }
    .lsb-rail  { order: 3; margin-top: 0; }
    .lsb-aside {
        position: static;
        max-height: none;
        overflow: visible;
    }
    .lsb-aside-block + .lsb-aside-block { margin-top: 8px; }
}

/* Pod 560 px: mobil. Sloupce se utáhnou, ale nic se neořezává,
   jméno týmu si drží 13 px a skóre zůstává vpravo. */
@media (max-width: 560px) {
    .lsb { font-size: 12.5px; }
    .lsb-sport { padding: 8px 10px; font-size: 11.5px; }
    .lsb-toolbar { padding: 5px 6px; gap: 6px; }
    .lsb-tab { padding: 6px 8px; font-size: 11px; }
    .lsb-date { margin-left: auto; }
    .lsb-date-label { min-width: 84px; font-size: 11.5px; }

    .lsb-league-head { padding: 6px 8px; }
    .lsb-league-name { font-size: 11.5px; }
    .lsb-league-table { padding: 2px 6px; font-size: 10px; }

    .lsb-match {
        grid-template-columns: auto 50px minmax(0, 1fr) minmax(26px, auto);
        column-gap: 6px;
        padding: 6px 8px;
    }
    .lsb-time { font-size: 11.5px; }
    .lsb-team { font-size: 13px; }
    .lsb-score { font-size: 13px; }
    .lsb-badge { font-size: 8.5px; letter-spacing: 0; }

    .lsb-panel-body { font-size: 12px; }
}

/* Velmi úzká okna: hvězdička a odznak ustupují, aby zbylo místo na jména. */
@media (max-width: 380px) {
    .lsb-match { grid-template-columns: auto 46px minmax(0, 1fr) minmax(24px, auto); }
    .lsb-team-name { letter-spacing: -.005em; }
}

/* ═══ POHYB ════════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
    .lsb *,
    .lsb *::before,
    .lsb *::after {
        transition: none !important;
        animation: none !important;
    }
}