/* ===== Písma (self-hosted) =====
   „Results LED" = vlastní písmo značky a číselných údajů (čas, rok, výsledek),
   matice 5×7 s kulatou nulou; vzniklo z `static/fonts/build_led.py` a obsahuje
   JEN číslice, `: . , + - – [ ]` a písmena r e s u l t c z. Jiný znak spadne
   do náhradního písma, takže se do LED textu nic jiného psát nesmí.
   „Results LED Grid" kreslí ZHASNUTÉ body pod svítícím textem (viz `.led-board`).
   IBM Plex Sans = text, IBM Plex Mono = štítky, čísla v tabulkách.
   Soubory leží v repozitáři schválně: web by jinak na každé načtení volal
   Google Fonts — což je externí závislost, zdržení a stopa návštěvníka
   u třetí strany. `latin-ext` nese českou diakritiku, bez něj by háčky
   propadly na náhradní písmo. Obojí je pod OFL (viz static/fonts/LICENSE). ===== */
@font-face {
  font-family: 'Results LED';
  font-style: normal;
  font-weight: 400;
  /* `block`, ne `swap`: LED text je krátký údaj (čas, rok) a probliknutí
     náhradním písmem by v něm bylo vidět víc než krátké prázdno. */
  font-display: block;
  src: url('/static/fonts/ResultsLED.woff2') format('woff2');
}
@font-face {
  font-family: 'Results LED Grid';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/static/fonts/ResultsLED-Grid.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/static/fonts/plex-sans-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/static/fonts/plex-sans-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/static/fonts/plex-sans-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/static/fonts/plex-sans-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/static/fonts/plex-sans-600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/static/fonts/plex-sans-600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/static/fonts/plex-mono-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/static/fonts/plex-mono-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/static/fonts/plex-mono-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/static/fonts/plex-mono-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ===== Theme palette (Wave: light/dark toggle) =====
   Neutrály jako proměnné: dark = default (beze změny), light = override.
   Akcenty zůstávají literály (fungují na obou motivech). ===== */
/* ===== Paleta (redesign 2026) =====
   Zdroj je `tokens.css` z návrhu; tmavý motiv má hodnoty PŘESNĚ podle něj,
   světlý je dopočítaný ze stejných ROLÍ (pozadí ↔ text se prohodí).

   Tokeny `--c-xxxxxx` jsou pojmenované podle své původní hodnoty ze starého
   vzhledu — přejmenovat je všude by byl mechanický zásah do tisíců řádků,
   takže místo toho drží NOVOU hodnotu ve své roli. Nový kód píše sémantické
   názvy (`--surface`, `--border`, `--text-2`), staré názvy jsou jejich
   aliasy a postupně vymizí.

   Akcent (`--accent`) je ve tmavém žlutá #ffb020 podle návrhu; ve světlém
   motivu by žlutá na bílé nebyla čitelná, proto tmavší jantar. Barva textu
   NA akcentu je `--accent-ink` (tmavá v obou motivech). ===== */
:root{
  --bg: #0e141f;
  --surface: #161f2e;
  --surface-2: #111926;
  --border: #243047;
  --line: #1f2a3d;
  --line-strong: #2a3547;
  --text: #e6ebf2;
  --text-2: #b8c2d0;
  --faint: #6f7b8d;
  --accent-ink: #14100a;
  --logo: #d7e3ff;
  --live-text: #ff8577;
  --led-off: #2b2414;

  /* Staré názvy = aliasy nových rolí (viz komentář výš). */
  --c-facc15: #ffb020;
  --c-fde047: #ffd166;
  --c-0a0a0a: var(--bg);
  --c-0c1a2e: #0a0e15;
  --c-0f172a: var(--surface-2);
  --c-1e293b: var(--surface);
  --c-243245: #1b2433;
  --c-273449: var(--line);
  --c-334155: var(--border);
  --c-475569: var(--line-strong);
  --c-94a3b8: #8591a3;
  --c-cbd5e1: var(--text-2);
  --c-e2e8f0: var(--text);
  --c-f1f5f9: #f2f6fb;

  --font-sans: 'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', monospace;
  --font-led: 'Results LED', var(--font-mono);

  --radius-panel: 10px;
  --radius-btn: 8px;
  --radius-chip: 6px;
  --radius-pill: 14px;
}
:root[data-theme="light"]{
  --bg: #f4f7fb;
  --surface: #ffffff;
  --surface-2: #eef2f8;
  --border: #d3dced;
  --line: #e2e8f2;
  --line-strong: #c6d0e0;
  --text: #16202e;
  --text-2: #3d4a5c;
  --faint: #7b8699;
  --accent-ink: #ffffff;
  --logo: #1b2b4d;
  --live-text: #b3251a;
  --led-off: #e7dcc6;

  --c-facc15: #b45309;
  --c-fde047: #c2410c;
  --c-0a0a0a: var(--bg);
  --c-0c1a2e: #e4eaf3;
  --c-0f172a: var(--surface-2);
  --c-1e293b: var(--surface);
  --c-243245: #e6eaf0;
  --c-273449: var(--line);
  --c-334155: var(--border);
  --c-475569: var(--line-strong);
  --c-94a3b8: #5d6a7d;
  --c-cbd5e1: var(--text-2);
  --c-e2e8f0: var(--text);
  --c-f1f5f9: #0b1420;
}
/* ── Odvozené tokeny ── */
:root {
  --card-bg: var(--surface);
  --card-border: var(--border);
  --accent: #ffb020;
  --accent-rgb: 255, 176, 32;   /* týž akcent pro rgba(…) */
  --muted: #8591a3;
  --live: #ff4c3c;
  --live-soft: rgba(255, 76, 60, 0.15);
}
:root[data-theme="light"] {
  /* Žlutá na bílé nemá kontrast — akcent ve světlém motivu ztmavne, aby se
     na něm dal přečíst text i on sám na pozadí. */
  --accent: #a85a06;
  --accent-rgb: 168, 90, 6;
  --muted: #5d6a7d;
  --live: #cc2418;
  --live-soft: rgba(204, 36, 24, 0.12);
}

/* Výsledkové stránky (živě, pavouk, startovky, rozpis, rozcestník) mají akcent
   BLEDĚ MODRÝ — žlutá je značka firemního webu (`body.site-shell`: úvod, o nás,
   galerie, archiv). Na výsledcích by žlutý akcent splýval se žlutou, která tam
   něco ZNAMENÁ (sloupec eskymáka, žlutá vesta). Ve světlém motivu tmavší
   modrá, světlá #38bdf8 na bílé nemá kontrast. */
body:not(.site-shell) {
  --accent: #38bdf8;
  --accent-rgb: 56, 189, 248;
}
:root[data-theme="light"] body:not(.site-shell) {
  --accent: #0369a1;
  --accent-rgb: 3, 105, 161;
}

/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; -webkit-text-size-adjust: 100%; }

body {
  font-family: var(--font-sans);
  /* Čísla v tabulkách musí stát pod sebou — jinak se sloupec časů „vlní". */
  font-variant-numeric: tabular-nums;
  background: var(--bg);
  color: var(--text);
  line-height: 1.5;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ── Layout ── */
.site-header {
  background: var(--c-1e293b);
  padding: 0 0.75rem;
  min-height: 55px;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  border-bottom: 1px solid var(--c-334155);
}
.site-header-event {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25rem 0.6rem;
  min-width: 0;
}
.site-header-event-name {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--c-f1f5f9);
  line-height: 1.1;
}
.site-header-event-meta {
  font-size: 0.78rem;
  color: var(--c-94a3b8);
}

.site-main {
  flex: 1;
  padding: 1rem;
  max-width: 900px;
  width: 100%;
  margin: 0 auto;
}

.breadcrumb {
  font-size: 0.85rem;
  color: var(--c-94a3b8);
  margin-bottom: 1rem;
}
.breadcrumb a { color: var(--c-94a3b8); }
.breadcrumb span { color: var(--c-e2e8f0); }

h1 { font-size: 1.5rem; font-weight: 700; margin-bottom: 1rem; color: var(--c-f1f5f9); }
h2 { font-size: 1.15rem; font-weight: 600; margin: 1.5rem 0 0.75rem; color: var(--c-f1f5f9); }
h3 { font-size: 1rem; font-weight: 600; margin: 1rem 0 0.5rem; color: var(--c-cbd5e1); }

h1 small { font-size: 0.8em; color: var(--c-94a3b8); font-weight: 400; }

/* ── Event detail ── */
.event-meta { display: grid; grid-template-columns: max-content 1fr; gap: 0.25rem 0.75rem; font-size: 0.9rem; margin-bottom: 1.5rem; }
.event-meta dt { color: var(--c-94a3b8); }
.event-meta dd { color: var(--c-e2e8f0); }

.category-list { list-style: none; display: flex; flex-direction: column; gap: 0.5rem; }
.category-card { background: var(--c-1e293b); border: 1px solid var(--c-334155); border-radius: 8px; }
.category-card a { display: flex; align-items: center; gap: 0.75rem; padding: 0.75rem 1rem; color: inherit; text-decoration: none; }
.category-card a:hover { background: var(--c-273449); text-decoration: none; }
.category-card-code { font-weight: 700; color: var(--accent); min-width: 3.5rem; font-family: monospace; }
.category-card-name { flex: 1; color: var(--c-f1f5f9); }
.category-card-meta { display: flex; gap: 0.5rem; align-items: center; }

/* ── Badges ── */
.status-badge, .phase-badge, .race-status, .junior-badge {
  display: inline-block;
  padding: 0.1rem 0.5rem;
  border-radius: 4px;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.status-upcoming { background: #1e3a8a; color: #bfdbfe; }
.status-live     { background: #14532d; color: #86efac; }
.status-finished { background: var(--c-334155); color: var(--c-94a3b8); }

.phase-tt            { background: #3730a3; color: #c7d2fe; }
.phase-heats         { background: #1e40af; color: #bfdbfe; }
.phase-quarterfinals { background: #7c2d12; color: #fed7aa; }
.phase-semifinals    { background: #9a3412; color: #fed7aa; }
.phase-finals        { background: #166534; color: #86efac; }
.phase-done          { background: var(--c-334155); color: var(--c-94a3b8); }

.junior-badge { background: #6b21a8; color: #e9d5ff; }

/* Live karta: status u done (✓) a pending (čas) je čistý text — bez podbarvení
   a bez rámečku. Active si žlutozelený badge ponechává (zvýraznění běžící jízdy). */
.race-status-pending { color: var(--c-cbd5e1); }
.race-status-active  { background: #15803d; color: #bbf7d0; }
.race-status-done    { color: var(--c-94a3b8); }

.race-time { font-size: 0.8rem; color: var(--c-94a3b8); font-weight: 400; margin-left: 0.5rem; }

/* ── Category dump ── */
.category-header { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; margin-bottom: 1rem; font-size: 0.9rem; color: var(--c-94a3b8); }

.dump-section { margin-bottom: 2rem; }
.dump-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
}
.dump-table th, .dump-table td {
  text-align: left;
  padding: 0.4rem 0.5rem;
  border-bottom: 1px solid var(--c-1e293b);
}
.dump-table th {
  background: var(--c-1e293b);
  color: var(--c-94a3b8);
  font-weight: 600;
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.race-block { margin-bottom: 1.25rem; }

.race-athlete-empty td { color: var(--c-475569); font-style: italic; }

/* ── Bib colors ── */
.bib-color {
  display: inline-block;
  padding: 0.1rem 0.4rem;
  border-radius: 3px;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--c-0f172a);
}
.bib-red    { background: #ef4444; color: #fff; }
.bib-green  { background: #22c55e; color: var(--c-0f172a); }
.bib-blue   { background: #3b82f6; color: #fff; }
.bib-yellow { background: #eab308; color: var(--c-0f172a); }

/* ── Empty state ── */
.empty-state { color: #64748b; font-style: italic; text-align: center; padding: 2rem 1rem; }

/* ── Technical meta (collapsed details) ── */
.technical-meta {
  margin-top: 2rem;
  border-top: 1px solid var(--c-1e293b);
  padding-top: 1rem;
  font-size: 0.8rem;
  color: #64748b;
}
.technical-meta summary { cursor: pointer; color: var(--c-94a3b8); }
.technical-meta dl { display: grid; grid-template-columns: max-content 1fr; gap: 0.25rem 0.75rem; margin-top: 0.5rem; }
.technical-meta dt { color: #64748b; }

/* ── 404 ── */
.error-page { text-align: center; padding: 3rem 1rem; }
.error-page h1 { font-size: 4rem; color: var(--c-334155); margin-bottom: 0.5rem; }

/* ── TT Live View ── */
.live-indicator {
  color: #ef4444;
  font-weight: bold;
  margin-right: 1rem;
}
.tt-refresh-info {
  color: var(--c-94a3b8);
  font-size: 0.9em;
}
.tt-live-header {
  margin-bottom: 1rem;
}
.tt-live-link {
  margin: 0.5rem 0 1rem 0;
}
.tt-live-link a {
  font-weight: bold;
}
.race-athlete-dnf {
  opacity: 0.65;
}

/* Wave 2.4.11: latest finisher highlight — green persistence (15s server-driven)
   plus a one-shot 2s pulse triggered by JS on 0→1 transition.
   box-shadow inset gives a 4px left accent bar without affecting layout. */
.dump-table tbody tr[data-latest-finisher="1"] {
  background-color: rgba(34, 197, 94, 0.22);
  box-shadow: inset 4px 0 0 #22c55e;
  transition: background-color 0.5s ease-out;
}
.dump-table tbody tr[data-latest-finisher="1"] td {
  color: var(--c-f1f5f9);
  font-weight: 600;
}
@keyframes latest-finisher-pulse {
  0%   { background-color: rgba(34, 197, 94, 0.70); }
  50%  { background-color: rgba(34, 197, 94, 0.45); }
  100% { background-color: rgba(34, 197, 94, 0.22); }
}
.dump-table tbody tr.latest-finisher-pulse {
  animation: latest-finisher-pulse 2s ease-out;
}
/* Defensive: latest finisher cannot have a finish_time AND be disqualified
   (server only flags rows with finish_time), but if data shape ever changes
   keep the DNF coloring visually dominant. */
.dump-table tbody tr.race-athlete-dnf[data-latest-finisher="1"] {
  background-color: rgba(239, 68, 68, 0.15);
  box-shadow: inset 4px 0 0 #ef4444;
}
.scroll-x {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.on-track-running {
  font-variant-numeric: tabular-nums;
  color: var(--accent);
  font-weight: 600;
}
.on-track-running.finished-pending {
  color: #22c55e;
}

/* Vlna 2.4.9: hlavička brán v "Na trati" — barevné odlišení dle typu */
.gate-th {
  text-align: center;
  font-weight: 700;
  font-size: 0.78rem;
  padding: 0.35rem 0.2rem;
  min-width: 1.8rem;
}
/* Bumpne specificitu (0,2,1) přes .dump-table th/td (0,1,1), aby text-align:
   center skutečně vyhrál → digit v hlavičce a badge v body cellu jsou
   centrované ve sloupci (vizuální center-to-center alignment). */
.dump-table thead th.gate-th { text-align: center; }
.dump-table td.gate-cell     { text-align: center; }
/* Vlna 2.4.9.2: decentní styl podle hlavního KXRS — pozadí dědí z .dump-table
   thead th (var(--c-1e293b)), žádný spodní border, jen barevný text. Specificita
   .dump-table thead th.gate-th-* (0,3,1) přebíjí .dump-table th (0,1,1) color. */
.dump-table thead th.gate-th-downstream { color: #4ade80; }   /* zelená — povodná */
.dump-table thead th.gate-th-upstream   { color: #f87171; }   /* červená — protivoda */
.dump-table thead th.gate-th-eskimo     { color: var(--c-fde047); }   /* žlutá — eskymák */

/* Vlna 2.4.9: penalty buňky jako badge, ne plnobarevné pozadí */
.gate-cell {
  text-align: center;
  background: transparent;
  padding: 0.2rem 0.15rem;
}
.gate-cell .penalty-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.4rem;
  height: 1.05rem;
  padding: 0 0.3rem;
  border-radius: 4px;
  font-size: 0.65rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.02em;
}
/* CLEAN en-dash: bez letter-spacing, ať pomlčka nevypadá zbytečně tažená */
.cell-clean .penalty-badge { letter-spacing: 0; }
.cell-flt .penalty-badge {
  background: #7f1d1d;
  color: #fecaca;
  border: 1px solid #ef4444;
}
.cell-clean .penalty-badge {
  background: #14532d;
  color: #86efac;
  border: 1px solid #22c55e;
}
.cell-pending .penalty-badge {
  background: transparent;
  color: var(--c-475569);
  border: none;
}
.flt-badge {
  background: rgba(239, 68, 68, 0.2);
  color: #ef4444;
  font-weight: bold;
  padding: 0.1em 0.4em;
  border-radius: 3px;
  font-size: 0.85em;
}
.empty-note {
  color: var(--c-94a3b8);
  font-style: italic;
}


/* ─── Wave 2.4.12: Denser "Pořadí" table ─── */
/* Tighter padding + slightly smaller font for the ranking table.
   Scoped to #tt-section-ranking so the scoreboard "Na trati" keeps its
   own sizing. Specificity (1,1,1) wins over .dump-table th/td (0,1,1). */
#tt-section-ranking .dump-table th,
#tt-section-ranking .dump-table td {
  padding: 0.25rem 0.45rem;
  font-size: 0.78rem;
  line-height: 1.25;
}
#tt-section-ranking .dump-table th {
  font-size: 0.68rem;
}

/* Wave 2.7.16: scoreboard look v2 — refactor of Wave 2.4.12.
   Unified yellow palette (FLT no longer red), modern monospace
   stack, dashed dividers, ID-scoped to prevent global bleed.
   Stadium LED feel for projector / event-center display.
   Gate header color rules (.gate-th-downstream/upstream/eskimo)
   are intentionally NOT overridden — those colors are part of
   the gate-type semantics, not the scoreboard chrome. */

#tt-section-on-course {
  background: var(--c-0a0a0a);
  border: 2px solid var(--c-facc15);
  border-radius: 8px;
  padding: 1rem;
  margin-bottom: 1.25rem;
}

#tt-section-on-course .dump-table,
#tt-section-on-course .dump-table th,
#tt-section-on-course .dump-table td {
  background: transparent;
  color: var(--c-facc15);
  font-family: ui-monospace, "SF Mono", Monaco, "Cascadia Code",
               "Roboto Mono", Consolas, "Liberation Mono",
               "Courier New", monospace;
  font-weight: 700;
}

#tt-section-on-course .dump-table thead {
  background: transparent;
  border-bottom: 1px solid var(--c-facc15);
}

#tt-section-on-course .dump-table thead th {
  color: var(--c-fde047);
  letter-spacing: 0.05em;
  text-transform: uppercase;
  font-size: 0.85rem;
  padding: 0.4rem 0.75rem;
}

#tt-section-on-course .dump-table tbody tr {
  background: transparent;
}

#tt-section-on-course .dump-table tbody tr:hover {
  background: rgba(250, 204, 21, 0.08);
}

#tt-section-on-course .dump-table td {
  padding: 0.55rem 0.75rem;
  border: none;
  border-bottom: 1px dashed rgba(250, 204, 21, 0.2);
}

#tt-section-on-course .dump-table tbody tr:last-child td {
  border-bottom: none;
}

/* Running clock — focal point: larger, bolder, glow, tabular-nums. */
#tt-section-on-course .on-track-running {
  font-size: 1.15rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.05em;
  text-shadow: 0 0 6px rgba(250, 204, 21, 0.4);
  white-space: nowrap;
}

/* Athlete finished but waiting for sync — dimmed, no glow. */
#tt-section-on-course .on-track-running.finished-pending {
  color: #ca8a04;
  text-shadow: none;
}

#tt-section-on-course .gate-cell {
  text-align: center;
  font-variant-numeric: tabular-nums;
}

#tt-section-on-course .gate-cell.cell-pending {
  color: #78716c;
}

#tt-section-on-course .gate-cell.cell-pending .penalty-badge {
  color: #78716c;
  background: transparent;
  border: none;
}

/* CLEAN cell — override the global green palette (background #14532d /
   color #86efac / border #22c55e) to fit the unified yellow scoreboard. */
#tt-section-on-course .gate-cell.cell-clean {
  color: var(--c-facc15);
  background: transparent;
}

#tt-section-on-course .gate-cell.cell-clean .penalty-badge {
  color: var(--c-facc15);
  background: transparent;
  border: 1px solid rgba(250, 204, 21, 0.4);
  font-weight: 600;
}

/* FLT cell — override the global red palette (background #7f1d1d /
   color #fecaca / border #ef4444). Yellow text + yellow border keeps
   FLT visually distinct without breaking the unified palette. */
#tt-section-on-course .gate-cell.cell-flt {
  background: transparent;
  color: var(--c-facc15);
}

#tt-section-on-course .gate-cell.cell-flt .penalty-badge {
  color: var(--c-facc15);
  background: transparent;
  border: 1px solid var(--c-facc15);
  font-weight: 800;
  padding: 0.05rem 0.3rem;
  border-radius: 3px;
}

#tt-section-on-course .gate-th {
  color: var(--c-fde047);
}

#tt-section-on-course .scroll-x {
  background: transparent;
}

/* ─── Wave 2.6.0: Bracket live (mobile-first) ─── */

/* Sticky chip navigation. Base header is not sticky/fixed, so top: 0
   pins to the viewport once the header scrolls out. */
.bracket-nav-sticky {
  position: sticky;
  top: 0;
  z-index: 10;
  background: var(--c-0f172a);
  border-bottom: 1px solid var(--c-1e293b);
  padding: 0.5rem 0;
  margin: -0.5rem -0.25rem 1rem;
}

.phase-tabs {
  display: flex;
  gap: 0.4rem;
  margin-bottom: 0.4rem;
  padding: 0 0.25rem;
}
.phase-tab {
  padding: 0.4rem 0.8rem;
  background: var(--c-1e293b);
  color: var(--c-cbd5e1);
  border: 1px solid var(--c-334155);
  border-radius: 6px;
  font-weight: 700;
  font-size: 0.85rem;
  cursor: pointer;
}
.phase-tab:hover { background: var(--c-273449); }

.race-chips {
  display: flex;
  gap: 0.3rem;
  overflow-x: auto;
  scrollbar-width: thin;
  padding: 0 0.25rem 0.2rem;
  -webkit-overflow-scrolling: touch;
}
.race-chip {
  flex: 0 0 auto;
  padding: 0.3rem 0.6rem;
  background: var(--c-1e293b);
  color: var(--c-cbd5e1);
  border: 1px solid var(--c-334155);
  border-radius: 6px;
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
  font-family: inherit;
}
.race-chip:hover { background: var(--c-273449); }
.race-chip-done {
  background: var(--c-0f172a);
  color: #64748b;
  border-color: var(--c-1e293b);
}
.race-chip-done::before { content: '✓ '; color: #22c55e; }
.race-chip-active {
  background: #064e3b;
  color: #6ee7b7;
  border-color: #10b981;
  animation: bracket-chip-pulse 1.5s ease-in-out infinite;
}
@keyframes bracket-chip-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.45); }
  50%      { box-shadow: 0 0 0 4px rgba(16, 185, 129, 0); }
}

/* Race blocks — extends existing .race-block (which only sets margin) with
   a card look + active-status border. */
.bracket-race-block {
  background: var(--c-1e293b);
  border: 1px solid var(--c-334155);
  border-radius: 8px;
  padding: 0.6rem 0.75rem;
  margin-bottom: 0.8rem;
  scroll-margin-top: 6.5rem;   /* sticky-nav height clearance for chip-jump */
}
.bracket-race-block.race-status-active {
  border-color: #10b981;
  box-shadow: 0 0 0 1px rgba(16, 185, 129, 0.35);
}
.bracket-race-block.race-status-done {
  border-color: #1e3a2e;
  opacity: 0.85;
}

.bracket-race-block .race-block-header {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
  font-size: 0.95rem;
}
.bracket-race-block .race-name {
  font-weight: 700;
  color: var(--c-e2e8f0);
}
.bracket-race-block .race-time {
  font-family: monospace;
  margin-left: 0;
}
.bracket-race-block .race-status-icon {
  margin-left: auto;
  font-size: 1rem;
}
.bracket-race-block.race-status-done .race-status-icon { color: #22c55e; }
.bracket-race-block.race-status-active .race-status-icon { color: #6ee7b7; }
.bracket-race-block.race-status-pending .race-status-icon { color: #64748b; }

/* Wave 2.6.6: compact bracket race table — no thead, fixed-layout columns
   so the BIB swatch sits next to its name regardless of how many cols
   the row has (4 for pending/active, 5 for done). */
.race-results-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.82rem;
  table-layout: fixed;
}
.race-results-table td {
  padding: 0.18rem 0.35rem;
  border-top: 1px solid var(--c-1e293b);
  color: var(--c-e2e8f0);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.race-results-table .race-pos {
  width: 2rem;
  font-weight: 700;
  color: var(--accent);
}
.race-results-table .race-stc {
  width: 2.2rem;
  color: var(--c-94a3b8);
}
.race-results-table .race-bib {
  width: 1.6rem;
  text-align: center;
  padding-left: 0.2rem;
  padding-right: 0.2rem;
}
/* Bib swatch — colored square only, no text. Reuses existing .bib-{color}
   classes from the .bib-color block (the per-color background rules apply
   to any element bearing the class). */
.bib-square {
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 3px;
  vertical-align: middle;
}
.race-results-table .race-name-cell { color: var(--c-e2e8f0); }
.race-results-table .race-flt {
  width: 3.4rem;
  text-align: right;
  font-family: monospace;
  color: #fca5a5;
}
.race-athlete-row.race-athlete-dnf .race-status-text {
  color: #fca5a5;
  font-size: 0.7rem;
  font-weight: 700;
}

.phase-heading {
  font-size: 0.95rem;
  color: var(--c-94a3b8);
  margin: 1rem 0 0.5rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.race-phase-section {
  scroll-margin-top: 6.5rem;
}

/* Wave 2.6.1: primary Live link in category.html — bolder green to signal
   it's the recommended single-URL entry point. */
.live-primary {
  font-weight: 700;
  color: #6ee7b7 !important;
}
.live-primary:hover { color: #a7f3d0 !important; }
.live-link-sep { color: var(--c-475569); }

/* ─── Wave 2.6.2b: live current_heat block ─── */
.live-current-heat {
  background: var(--c-1e293b);
  border: 1px solid var(--c-334155);
  border-radius: 8px;
  padding: 0.75rem 1rem;
  margin: 0 0 1rem 0;
}
.live-current-heat[data-status="active"] {
  border-color: #ef4444;
  box-shadow: 0 0 0 1px rgba(239, 68, 68, 0.2);
}
.live-current-heat[data-status="done"] {
  border-color: #10b981;
  opacity: 0.85;
}
/* Wave 2.6.14: live-current-heat header redesign — pulsing status dot
   in the top-right corner replaces the textual AKTIVNÍ/DOKONČENO badge. */
.live-current-heat .live-header {
  position: relative;       /* anchor for the absolutely positioned dot */
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.5rem;
  padding-right: 1.25rem;   /* leave room for the corner dot */
}
.live-current-heat .live-heat-label {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--c-e2e8f0);
}
.live-current-heat .live-status-dot {
  position: absolute;
  top: 0;
  right: 0;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--c-94a3b8);       /* fallback grey */
}
.live-current-heat .live-status-dot-active {
  background: #ef4444;       /* red */
  animation: live-status-pulse 1.5s ease-in-out infinite;
}
.live-current-heat .live-status-dot-done {
  background: #10b981;       /* green, no animation */
}
@keyframes live-status-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%      { opacity: 0.4; transform: scale(0.8); }
}

/* Wave 2.6.14.2: gate progress bar lives inline inside .live-header
   (between label and the absolute status dot). Cells are bare 10×6
   rectangles — grey border when pending, green fill when visited. */
.live-gates {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 3px;
  margin: 0;
}
/* Wave 2.6.14: visited progress instead of penalty-status colors.
   Gate cells turn green once the operator's focus has moved at or
   past that gate. Pending = neutral grey frame. Old gate-all_clean /
   gate-all_flt / gate-partial classes deprecated — kept in CSS as
   fallback so legacy snapshots don't render unstyled. */
.live-gates .gate-cell {
  display: inline-block;
  width: 10px;
  height: 6px;
  border-radius: 2px;
  background: transparent;
  border: 1px solid var(--c-475569);
  transition: background 0.25s ease, border-color 0.25s ease;
}
.live-gates .gate-cell.gate-pending {
  background: transparent;
  border-color: var(--c-475569);
}
.live-gates .gate-cell.gate-visited {
  background: #10b981;
  border-color: #10b981;
}
/* Legacy fallback — keep light styling so old snapshots without
   `visited` field render readable. */
.live-gates .gate-cell.gate-all_clean,
.live-gates .gate-cell.gate-all_flt,
.live-gates .gate-cell.gate-partial {
  background: #10b981;
  border-color: #10b981;
}

.live-current-heat .live-athletes {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.live-current-heat .live-athlete {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.25rem 0;
  font-size: 0.85rem;
  color: var(--c-e2e8f0);
}
.live-current-heat .athlete-final-pos {
  display: inline-block;
  min-width: 1.4rem;
  font-family: ui-monospace, "Courier New", monospace;
  font-size: 0.85rem;
  font-weight: 700;
  color: #fbbf24;
  text-align: right;
}
.live-current-heat .lane-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}
.live-current-heat .lane-red    .lane-dot { background: #ef4444; }
.live-current-heat .lane-green  .lane-dot { background: #22c55e; }
.live-current-heat .lane-blue   .lane-dot { background: #3b82f6; }
.live-current-heat .lane-yellow .lane-dot { background: #eab308; }
.live-current-heat .athlete-stc {
  font-family: ui-monospace, "Courier New", monospace;
  font-size: 0.8rem;
  color: #64748b;
  min-width: 2rem;
}
.live-current-heat .athlete-name {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.live-current-heat .athlete-status {
  font-family: ui-monospace, "Courier New", monospace;
  font-size: 0.75rem;
  padding: 0.1rem 0.4rem;
  border-radius: 3px;
  transition: background-color 0.3s ease;
}
.live-current-heat .status-ok {
  background: rgba(16, 185, 129, 0.15);
  color: #10b981;
}
/* Match any FLT-N (FLT-1, FLT-2, FLT-start, ...) — class is status-flt_N.
   Bílý text v červeném rámečku — parita s Pavouk (.athlete-flt) a TT (.tt-rank-flt). */
.live-current-heat .athlete-status[class*="status-flt"] {
  background: #b91c1c;
  color: #fff;
  font-weight: 700;
}
.live-current-heat .status-dns,
.live-current-heat .status-dnf,
.live-current-heat .status-ral,
.live-current-heat .status-dsq,
.live-current-heat .status-dqb {
  background: rgba(100, 116, 139, 0.2);
  color: var(--c-94a3b8);
}

/* Brief flash on per-cell update (driven by JS toggling .flash class). */
.live-gates .gate-cell.flash,
.live-current-heat .athlete-status.flash {
  animation: live-current-flash 0.6s ease-out;
}
@keyframes live-current-flash {
  0%   { background-color: rgba(var(--accent-rgb), 0.4); }
  100% { background-color: transparent; }
}

/* ─────────────────────────────────────────────────────────────────────
   Wave 2.7.5: a11y utilities
   ───────────────────────────────────────────────────────────────────── */

/* Screen-reader-only — visually hidden but in the accessibility tree. */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Focus-visible: outline only on keyboard nav, suppressed on click/touch. */
*:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 3px;
}
*:focus:not(:focus-visible) {
  outline: none;
}

/* ─────────────────────────────────────────────────────────────────────
   Vlna 1 fáze A: sjednocené TT live styly (sdílené desktop + mobile).
   DOM model = ol/li (převzato z mobilu). Layout řídí breakpoint v
   desktop.css / mobile.css. Per-branka detail (.gate-*/.cell-*) zůstává
   v base.css výše a aktivuje se ve fázi B (responzivní akordeon).
   ───────────────────────────────────────────────────────────────────── */

/* Sub-header s titulkem kategorie + cat-switcher dropdownem. */
.tt-subheader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.6rem 0.75rem 0.4rem;
  background: var(--c-0f172a);
  border-bottom: 1px solid var(--c-1e293b);
}
.tt-cat-title {
  margin: 0;
  font-size: 1rem;
  color: var(--c-f1f5f9);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tt-cat-switcher { position: relative; flex-shrink: 0; }

.cat-switch-btn {
  background: var(--c-1e293b);
  color: var(--c-f1f5f9);
  border: 1px solid var(--c-334155);
  padding: 0.35rem 0.7rem;
  border-radius: 6px;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
.cat-switch-menu {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  background: var(--c-1e293b);
  border: 1px solid var(--c-334155);
  border-radius: 8px;
  list-style: none;
  margin: 0;
  padding: 0.25rem 0;
  min-width: 200px;
  max-width: calc(100vw - 1.5rem);
  z-index: 50;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}
.cat-switch-menu li { margin: 0; padding: 0; }
.cat-switch-item {
  display: block;
  padding: 0.7rem 1rem;
  color: var(--c-f1f5f9);
  text-decoration: none;
  font-size: 0.9rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-height: 44px;
  line-height: 1.6;
}
.cat-switch-item.active { color: var(--accent); font-weight: 600; }
.cat-switch-item:active { background: var(--c-334155); }

/* TT live tělo — sdílený základ. */
.tt-live { padding: 0; }

/* Vlna 2.7.29 → 3-stavový přepínač „Živý čas v pořadí" vpravo v řádku
   kategorií (.tt-cat-tabs-strip.has-live-toggle). Klik cykluje režimy;
   stav řídí JS přes data-mode na <button>. Ikona má 3 podoby, všechny žluté
   (jen obrys): off = scoreboard (tabulka), light = dělící čára, full = hodiny.
   Klikací plocha ≥ 44px. */
.tt-live-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  margin-left: 0.5rem;
  min-width: 44px;
  min-height: 38px;
  padding: 0 0.4rem;
  color: var(--c-facc15);
  cursor: pointer;
  user-select: none;
  border: 0;
  /* pozadí pásu, aby pod ikonou „mizely" odscrollované kategorie */
  background: var(--c-0f172a);
}
.tt-live-toggle:hover { color: var(--c-fde047); }
.tt-live-toggle-icon {
  width: 22px;
  height: 22px;
  display: block;
  transition: color 0.15s;
}
/* Ikona má 3 podoby dle data-mode (vždy je vidět jen jedna):
     off   = scoreboard (.ic-board) — šedý
     light = žlutá dělící čára (.ic-divider)
     full  = hodiny (.ic-clock + .ic-clock-hands) — žluté
   Výchozí: hodiny i čára skryté, board zobrazen (off). */
.tt-live-toggle .ic-clock,
.tt-live-toggle .ic-clock-hands { display: none; }
.tt-live-toggle .ic-divider { opacity: 0; transition: opacity 0.15s; }
/* light — jen žlutá čára */
.tt-live-toggle[data-mode="light"] .ic-board { display: none; }
.tt-live-toggle[data-mode="light"] .ic-divider {
  opacity: 1;
  stroke: var(--c-facc15);
  stroke-width: 2.5;
}
/* full — jen žluté hodiny */
.tt-live-toggle[data-mode="full"] .ic-board { display: none; }
.tt-live-toggle[data-mode="full"] .ic-clock,
.tt-live-toggle[data-mode="full"] .ic-clock-hands { display: inline; }
.tt-live-toggle[data-mode="full"] { color: var(--c-facc15); }
.tt-live-toggle[data-mode="full"]:hover { color: var(--c-fde047); }
.tt-live-toggle:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 4px;
}

/* LIVE (kros TT i časové disciplíny): tentýž přepínač sedí v nástrojích
   hlavičky (.header-tools) před ikonou řádkování — pás pod hlavičkou se
   štítkem kategorie zmizel a obsah začíná rovnou pod dělící linkou záhlaví.
   Geometrii proto srovnáváme s ostatními ikonami hlavičky (28×38, bez
   vlastního pozadí a levého okraje); barvu (žlutá) i 3-stavovou ikonu
   necháváme — je to stavový přepínač, ne jen nástroj. */
.header-tools .tt-live-toggle {
  width: 28px;
  min-width: 28px;
  height: 38px;
  padding: 0;
  margin-left: 0;
  background: transparent;
}
.header-tools .tt-live-toggle-icon { width: 19px; height: 19px; }

/* Light varianta: zvýrazněná dělící čára v Pořadí (mezi řádky), na pozici
   dle živého času. Žlutá scoreboard paleta. Marker sdílí grid .tt-row-ranking
   (stejné sloupce), takže STČ a jméno korespondují se sloupci v Pořadí.
   Dělící čára = žlutá svítící horní hrana (přes celou šířku). Chip vlevo.
   Marker je <li> bez data-stc → neúčastní se serverové rekonciliace. */
.tt-rank-marker {
  position: relative;
  display: block;
  margin: 0;
  /* Řádkování = přesně jeden běžný řádek Pořadí. Kanonický je režim „plný
     řádek" (.tt-row--live), který výšku .tt-row nemění — dělící čára se řídí
     podle něj, takže přepnutí light ↔ full listinou neposune. Proto stejná
     velikost písma i svislý padding jako .tt-row (a stejné density varianty,
     viz :root[data-density=…] níž v souboru).
     Výšku určuje POUZE strut řádku: pilulka je vyňatá z toku (absolutní) a
     ::after se ZWSP drží prázdný line-box, aby marker nesplaskl na padding. */
  padding: 0.3rem 0.75rem;
  font-size: 0.92rem;
  /* Průhledná spodní linka: .tt-row má border-bottom 1px, bez něj by byl
     marker o pixel nižší (a přepnutí light ↔ full by listinu posunulo). */
  border-bottom: 1px solid transparent;
  list-style: none;
}
.tt-rank-marker::after { content: "\200B"; }
/* dělící čára — přes celou šířku, ve svislém středu markeru */
.tt-rank-marker::before {
  content: "";
  position: absolute;
  left: 0.75rem;
  right: 0.75rem;
  top: 50%;
  height: 2px;
  transform: translateY(-50%);
  background: var(--c-facc15);
  box-shadow: 0 0 6px rgba(250, 204, 21, 0.55);
}
/* pilulka „STČ + jméno" sedí NA čáře (z-index nad ní), zleva zarovnaná
   na sloupec STČ (≈ šířka sloupce pořadí + gap). Tmavý lem ji odděluje
   od čáry. */
.tt-rank-marker-chip {
  /* Absolutní pozice (dřív in-flow s margin-left): pilulka je vyšší než
     obsahová část řádku, v toku by tedy marker roztáhla nad výšku běžného
     řádku — nejvíc v kompaktním řádkování, kde byl marker dvojnásobný.
     left = padding markeru 0.75rem + zarovnání na sloupec STČ 2.35rem;
     top/transform ji drží na čáře (::before má stejné 50 %). */
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 3.1rem;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.06rem 0.5rem;
  background: var(--c-facc15);
  color: var(--c-0a0a0a);
  border-radius: 999px;
  font-size: 0.74rem;
  /* line-height: 1 — bez něj pilulka dědí řádkování stránky a v nejhustším
     režimu vyleze i z jednořádkové výšky (stejná past jako u .tt-rank-flt). */
  line-height: 1;
  font-weight: 700;
  box-shadow: 0 0 0 2px var(--c-0f172a);   /* tmavý lem proti čáře */
}
@media (min-width: 720px) {
  .tt-rank-marker-chip { left: 3.25rem; }   /* desktop gap 0.5rem */
}
.tt-rank-marker-stc {
  font-variant-numeric: tabular-nums;
  padding-right: 0.35rem;
  border-right: 1px solid rgba(10, 10, 10, 0.35);
}
.tt-rank-marker-name { font-weight: 700; }

.tt-on-course {
  background: var(--c-0c1a2e);
  border-bottom: 2px solid var(--accent);
}
.tt-rows {
  list-style: none;
  margin: 0;
  padding: 0;
}
/* Vlna 1 fáze A: 4 sloty on-course (stc | name | time | flt), 6 slotů
   ranking (rank | stc | name | time | diff | flt). Rozdíl přidán
   v této vlně. */
.tt-row {
  display: grid;
  grid-template-columns: 2.5rem 1fr auto 2.5rem;
  gap: 0.5rem;
  /* Vertikální zarovnání: center, NE baseline. Řádek míchá různé velikosti
     písma (běžící hodiny 1.05rem vs STČ 0.85rem) a badge s vlastním
     paddingem (FLT) — baseline pak sráží text k horní hraně řádku a posun
     kolísá řádek od řádku (nejvíc u live řádku v Pořadí, kde FLT badge má
     border). center drží text opticky uprostřed nezávisle na obsahu. */
  align-items: center;
  padding: 0.3rem 0.75rem;
  border-bottom: 1px solid var(--c-1e293b);
  font-size: 0.92rem;
}
/* `display: grid` výše přebíjí UA [hidden]{display:none} (autorské pravidlo
   vyhrává nad UA), takže `li.hidden` by řádek neskryl. Tohle pravidlo (vyšší
   specificita) hidden zase obnoví — full mód jím skrývá promovaného
   závodníka z „Na trati". */
.tt-row[hidden] { display: none; }
/* Delici cara postupu do vyrazovacich jizd (pavouka) v Poradi (TT). */
.tt-advance-cut {
  display: block;
  padding: 0;
  height: 0;
  line-height: 0;
  font-size: 0;
  border-top: 2px solid #22c55e;
}
/* STČ na trati BEZ vlastní velikosti — stejný důvod jako u žebříčku níž
   (dědí 0.92rem z .tt-row, ztlumení drží barva). */
.tt-row-on-course .tt-row-stc {
  color: var(--c-94a3b8);
  font-weight: 600;
}
/* Pořadí + STČ v žebříčku BEZ vlastní velikosti — dědí 0.92rem z .tt-row,
   tj. stejně velké jako jméno a čas. Dřív 0.85rem: identifikační sloupce
   byly proti zbytku řádku viditelně menší a v nejhustším řádkování
   (data-density="compact", root 13.5px) klesly na ~11.5px proti 12.4px
   jména. Ztlumené zůstávají barvou (--c-94a3b8), ne velikostí.
   Mobil (<720px) je řešený zvlášť — tam se zmenšuje celý řádek. */
.tt-row-ranking .tt-row-rank,
.tt-row-ranking .tt-row-stc {
  color: var(--c-94a3b8);
  font-weight: 600;
}
/* Pořadí zarovnat zprava (na úrovni jednotek) — tabular-nums drží číslice
   pod sebou, takže „1." a „10." lícují tečkou i jednotkami. padding-right
   zvětšuje mezeru mezi pořadím a startovním číslem. */
.tt-row-ranking .tt-row-rank {
  text-align: right;
  font-variant-numeric: tabular-nums;
  padding-right: 0.25rem;   /* STČ blízko k pořadí */
}
/* Startovní číslo vycentrovat (v pořadí (TT) i startovce, vč. hlaviček). */
.tt-row-ranking .tt-row-stc,
.tt-row-startlist .tt-row-stc,
.sl-head > span:first-child {
  text-align: center;
  font-variant-numeric: tabular-nums;
}
/* Detail buňky v ranking řádku (NAR/VK/VT/Oddíl) — na mobilu skryté
   (rozbalí se přes .sl-summary po tapu), na desktopu sloupce (viz @media). */
.tt-row-ranking .sl-cell { display: none; }
/* TT ranking hlavička — reuse .tt-row .tt-row-ranking gridu, přebarvená na
   muted header styl. */
.tt-rank-head {
  border-bottom: 1px solid var(--c-334155);
  /* zafixovat hlavičku pořadí pod sticky .site-header; z-index pod on-course
     scoreboardem (50), aby při aktivní NA TRATI sekci nepřekrývala. */
  position: sticky;
  top: var(--mobile-header-h, 100px);
  z-index: 40;
  background: var(--c-0f172a);
}
.tt-rank-head > span {
  color: #64748b !important;
  font-weight: 600 !important;
  font-size: 0.7rem !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
/* FLT v rankingu — červené pole „FLT-X" (parita s pavoukem,
   .bracket-race-athlete .athlete-flt). Žlutý badge .tt-row-flt zůstává
   on-course/scoreboardu. */
/* Výška badge = JEN font + padding (+ případný 1px obtah u živého řádku):
   inline-flex + line-height:1, stejně jako scoreboardový .tt-row-flt (Vlna 3
   K3). Bez toho badge dědil line-height řádku, takže v kompaktním řádkování
   byl přesně tak vysoký jako celá obsahová část řádku a rámeček vylézal ven
   (kompakt má padding jen 0.02rem). Zároveň to srovná optické centrování —
   „FLT-3" nemá dolní dotažnice, takže v běžném line-boxu sedělo výš. */
.tt-rank-flt {
  justify-self: start;
  align-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  background: #b91c1c;
  color: #fff;
  padding: 0.1rem 0.4rem;
  border-radius: 4px;
  /* Badge se NIKDY nesází monospace. Živý řádek scoreboardu má na rodiči
     ui-monospace a badge ho dědil — pomlčka pak sedí uprostřed plné
     monospace šířky, takže „FLT-3" vypadalo jako „FLT - 3". Explicitní
     sans stack (shodný s body) drží stejný vzhled jako v Pořadí. */
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-size: 0.7rem;
  font-weight: 600;
  white-space: nowrap;
}
.tt-row-ranking {
  /* Vlna 1 fáze A: pevné šířky Čas (4.5rem) + Rozdíl (3.5rem) — auto
     šířky by hodnotu cell po cellu měnily a desetinné tečky by neseděly
     pod sebou. tabular-nums + right-align v .tt-row-(time|diff) drží
     desetinné tečky zarovnané sloupcově. */
  grid-template-columns: 2.5rem 2.5rem 1fr 4.5rem 3.5rem 2.5rem;
}
.tt-row-ranking .tt-row-time {
  text-align: right;
}

/* Vlna 2.7.29: live-inline-ranking — scoreboard chrome na řádku v Pořadí.
   Paleta navazuje na Wave 2.7.16 scoreboard look (žlutá var(--c-facc15) na černém
   var(--c-0a0a0a), ui-monospace, dashed dividers). Žádný red FLT badge — uvnitř
   live řádku zůstává scoreboard yellow palette. Animace přesunu = Krok 4. */
.tt-row.tt-row--live {
  background: var(--c-0a0a0a);
  color: var(--c-facc15);
  font-family: ui-monospace, "SF Mono", Monaco, "Cascadia Code",
               "Roboto Mono", Consolas, "Liberation Mono",
               "Courier New", monospace;
  font-weight: 700;
  /* Rám: JEN spodní žlutá linka — parita s LED řádkem časových disciplín
     (.time-proj-row > td). Tam tabulka jede na `border-collapse: collapse`,
     takže horní hranu vždycky vykreslí dělítko předchozího řádku a žlutá je
     jen ta pod řádkem; tenhle vzhled je kanonický, kros se řídí podle něj.
     Dřív to byl obtah kolem celého řádku (inset 0 0 0 1px + 2px horní hrana),
     který v listině působil jako vyskakující rámeček; pak přibyla i horní
     linka přes inset shadow — zrušena, viz výše. Spodní linka přebarví už
     existující .tt-row border-bottom, takže řádek nezmění výšku. Boční hrany
     zrušeny (border-color: transparent). */
  border-color: transparent;
  border-bottom-color: rgba(250, 204, 21, 0.5);
  /* Levý žlutý proužek + tenká horní linka (inset stíny, ne border — border
     by změnil výšku i odsazení řádku a v listině by řádek povyskočil).
     Proužek říká „tenhle závodník je NA TRATI"; samotný černý podklad se
     v hustě řádkované listině čte jako další řádek. Horní linka je stejná
     jako spodní, takže řádek drží mezi dvěma linkami a nesplývá se sousedem
     nahoře — spodní linka sousedícího live řádku tak zůstává jen jedna. */
  box-shadow: inset 3px 0 0 var(--c-facc15),
              inset 0 1px 0 rgba(250, 204, 21, 0.5);
}
/* Optická korekce svislé polohy (stejný princip jako #tt-on-course .tt-row
   a .time-proj-row > td): na barevném podkladu je vidět, že ink písma sedí
   v line-boxu výš — pod účařím zůstává nevyužité místo pro dolní dotažnice,
   které STČ/VERZÁLKY/hodiny nemají.

   NEDĚLAT paddingem: `:root[data-density="compact"] .tt-row` (specificita
   0,3,0) přebíjí `.tt-row.tt-row--live` (0,2,0), takže v kompaktním i vzdušném
   řádkování by se korekce zahodila — a v kompaktním by vyšel padding-bottom
   dokonce záporný (celkem tam jsou 0.04rem). Proto posun obsahu přes
   `position: relative; top` na buňkách: nemění výšku řádku, škáluje s písmem
   (em) a žádné density pravidlo na něj nesahá.

   Měřeno po pixelech (scale 4, ink nad/pod uvnitř border-boxu):
     normální   6,00 / 11,75 → posun 0.19em
     vzdušná   10,00 / 16,00 → posun 0.19em (stejný poměr k font-size)
     kompaktní  1,50 /  4,25 → posun 0.16em (menší Δ kvůli line-height: 1.25)
   Chromium posun textu zaokrouhluje na celé CSS px, takže v kompaktním režimu
   0.14–0.18em vyjde shodně na 2 px (ideál 1,5 px není dosažitelný) — zbytkových
   0,75 px raději pod střed než nad něj, stížnost byla „text u horní linky". */
.tt-row.tt-row--live > * {
  position: relative;
  top: 0.19em;
}
:root[data-density="compact"] .tt-row.tt-row--live > * {
  top: 0.16em;
}
/* FLT badge z korekce VYJÍMÁME: korekce vyrovnává polohu *inkoustu* v
   line-boxu, jenže badge je ohraničený BOX — ten už `align-self: center`
   vystředí geometricky správně a posun ho jen sune k dolní lince (v
   kompaktním řádkování dokonce pod ni). Druhý selektor musí nést
   `:root[data-density]`, jinak by ho density pravidlo (0,4,0) přebilo. */
.tt-row.tt-row--live .tt-rank-flt,
:root[data-density] .tt-row.tt-row--live .tt-rank-flt {
  top: 0;
}
.tt-row.tt-row--live .tt-row-rank,
.tt-row.tt-row--live .tt-row-stc,
.tt-row.tt-row--live .tt-row-name,
.tt-row.tt-row--live .tt-row-time,
.tt-row.tt-row--live .tt-row-diff {
  color: var(--c-facc15);
  font-weight: 700;
}
/* Tikající elapsed — glow stejně jako scoreboard running clock. */
.tt-row.tt-row--live .tt-row-time {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.03em;
  text-shadow: 0 0 6px rgba(250, 204, 21, 0.4);
}
/* FLT badge na live řádku: yellow ghost (rámeček + transparentní pozadí),
   ne červené pole z normálního .tt-rank-flt. Drží scoreboard estetiku. */
.tt-row.tt-row--live .tt-rank-flt {
  background: transparent;
  color: var(--c-facc15);
  border: 1px solid var(--c-facc15);
}

/* Vlna 2.7.29: animace přesunů.
   Entry: "vyletí z Na trati a vlétne do Pořadí" — slide-down + fade-in.
   Reposition: FLIP-style (JS změří delta, CSS dotáhne transform → 0).
   Respektuje prefers-reduced-motion: animace se nahradí instantním cut. */
@keyframes tt-live-row-enter {
  from {
    opacity: 0;
    transform: translateY(-12px) scale(0.97);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
.tt-row--live-entering {
  animation: tt-live-row-enter 280ms ease-out both;
}
.tt-row--live-flipping {
  /* Used by JS FLIP — JS sets initial transform inline, this class drives
     the easing back to identity. */
  transition: transform 250ms ease-out;
}
@media (prefers-reduced-motion: reduce) {
  .tt-row--live-entering { animation: none; }
  .tt-row--live-flipping { transition: none; }
}
/* Startovní listina.
   Mobil (base): 3 sloty — stč | jméno | nasazený čas + chevron. Detailní
   buňky (ročník/VK/VT/oddíl) jsou skryté, rozbalí se po tapu (.is-expanded).
   Desktop (≥720px, viz @media níže): buňky jako plnohodnotné sloupce,
   řádek se nerozbaluje a hlavička .sl-head nese popisky. */
.tt-row-startlist {
  grid-template-columns: 2.5rem 1fr auto;
}
.tt-row-startlist .tt-row-stc {
  color: var(--c-94a3b8);
  font-weight: 600;
  font-size: 0.85rem;
}
.tt-row-startlist .tt-row-time {
  text-align: right;
}
/* POSÁDKY (C2 / raft / hlídky) ve startovní listině — stejný důvod i stejná
   čára jako ve výsledkové listině: jména členů jsou pod sebou (`.sl-crew-member`
   je `display: block`), takže výchozí 1px --c-1e293b (ve světlém motivu BÍLÁ,
   tedy neviditelná) hranici mezi loděmi neukáže a hlídky splývají. */
.tt-row-startlist.tt-row-crew {
  border-bottom: 2px solid var(--c-475569);
}
/* Rezervované místo pro dosud neznámého postupujícího (repasáž Finále B →
   Finále A): čas platí, jméno ještě ne. Ztlumené + kurzíva, ať je na první
   pohled jasné, že řádek není závodník. */
.tt-row-sl-pending { color: #64748b; }
.tt-row-sl-pending .tt-row-name {
  font-style: italic;
  font-weight: 400;
  color: #64748b;
}
.tt-row-sl-pending .tt-row-stc { color: #475569; }
.tt-row-sl-pending .tt-row-time { color: #64748b; }
/* Průběžně postupující ze zdrojové fáze (Finále B ještě nedojelo): jméno už
   známé, ale ne konečné. Kreslí se stejně jako rezervované místo výše —
   ztlumeně a kurzívou, ať je jedním pohledem vidět, které řádky Finále A ještě
   nejsou jisté; teprve po dojetí zdrojové fáze zesílí do normálu. */
.tt-row-sl-provisional { color: #64748b; }
.tt-row-sl-provisional .tt-row-name {
  font-weight: 400;
  color: #64748b;
}
.tt-row-sl-provisional .tt-row-stc { color: #475569; }
.tt-row-sl-provisional .tt-row-time,
.tt-row-sl-provisional .sl-cell,
.tt-row-sl-provisional .sl-summary { color: #64748b; }
.tt-row-sl-provisional .tt-row-name,
.tt-row-sl-provisional .tt-row-stc,
.tt-row-sl-provisional .tt-row-time,
.tt-row-sl-provisional .sl-cell,
.tt-row-sl-provisional .sl-summary { font-style: italic; }
/* „Právě startuje" — orientace v listině podle NASAZENÝCH časů (bez časomíry).
   Řídí startlist_now.js. JEDINÝ stav = jantarový řádek toho, kdo je na startu;
   jantar nekoliduje se zelenou, která v Live znamená „právě dojel".

   Dřív se kreslilo i „další na řadě" (modře) a odstartovaní se ztlumovali.
   Jenže listina se prohlíží po kategoriích a v každé, která ještě nezačala,
   svítil modrý první řádek — na obrazovce tak bylo „zvýrazněno" pět lidí
   naráz a nešlo poznat, kdo doopravdy startuje. Zůstal jeden stav, který se
   objeví jen v kategorii, kde se v tu chvíli opravdu startuje. */
:root {
  --sl-now-bg: rgba(250, 204, 21, 0.16);
  --sl-now-bar: #facc15;
  --sl-now-fg: #fde68a;
}
:root[data-theme="light"] {
  --sl-now-bg: rgba(234, 88, 12, 0.14);
  --sl-now-bar: #ea580c;
  --sl-now-fg: #9a3412;
}
.tt-row-startlist.tt-row-sl-now {
  background: var(--sl-now-bg);
  box-shadow: inset 4px 0 0 var(--sl-now-bar);
}
.tt-row-startlist.tt-row-sl-now .tt-row-name,
.tt-row-startlist.tt-row-sl-now .tt-row-stc { font-weight: 700; }
.tt-row-startlist.tt-row-sl-now .tt-row-name { color: var(--c-f1f5f9); }
/* Samotná buňka času: u dvoukolových formátů má každá jízda vlastní čas,
   takže se zvýrazní ta, která právě startuje — ne obě. */
.tt-row-startlist .tt-row-time.sl-time-now {
  color: var(--sl-now-fg);
  font-weight: 700;
}
/* Cedule náhledu (?now=) — simulovaný čas se nesmí splést se skutečným. */
.sl-now-note {
  border-left: 4px solid var(--sl-now-bar);
  background: var(--sl-now-bg);
  color: var(--c-e2e8f0);
}
/* Přepínač v hlavičce. Ikona je listina o třech řádcích; jantarem svítí JEN
   prostřední řádek s ukazatelem — přesně to, co tlačítko dělá na stránce.
   Zbytek listiny proto zůstává šedý (na rozdíl od .tt-live-toggle, kde se
   barví celá ikona), jinak by se význam „jeden řádek je zvýrazněný" ztratil.
     off    — šedá listina bez ukazatele
     mark   — jantarový ukazatel + prostřední řádek
     follow — navíc šipka (drž řádek ve výhledu) */
/* `hidden` MUSÍ přebít `display` z .tt-live-toggle — autorské pravidlo jinak
   vyhraje nad UA `[hidden]{display:none}` a schované tlačítko zůstane vidět.
   Přesně tak svítila ikona i tam, kde se nemá co zvýrazňovat. */
.sl-now-toggle[hidden] { display: none; }
.sl-now-toggle,
.sl-now-toggle:hover { color: var(--c-94a3b8); }
.sl-now-toggle[data-mode="off"] .ic-mark,
.sl-now-toggle[data-mode="off"] .ic-follow,
.sl-now-toggle[data-mode="mark"] .ic-follow { display: none; }
.sl-now-toggle:not([data-mode="off"]) .ic-mid { stroke: var(--c-facc15); stroke-width: 2.6; }
/* Šipka je drobná kresba — tlustý tah z ní udělá kaňku. */
.sl-now-toggle .ic-follow { stroke-width: 1.7; }
.sl-now-toggle:not([data-mode="off"]) .ic-follow { stroke: var(--c-facc15); }
.sl-now-toggle:not([data-mode="off"]) .ic-mark { fill: var(--c-facc15); }
.sl-now-toggle:hover:not([data-mode="off"]) .ic-mid,
.sl-now-toggle:hover:not([data-mode="off"]) .ic-follow { stroke: var(--c-fde047); }
.sl-now-toggle:hover:not([data-mode="off"]) .ic-mark { fill: var(--c-fde047); }

/* Hláška „listina ještě není úplná" nad startovkou fáze. */
.sl-pending-note {
  margin: 0;
  padding: 0.55rem 0.75rem;
  border-bottom: 1px solid var(--c-1e293b);
  font-size: 0.78rem;
  line-height: 1.35;
  color: #94a3b8;
}
/* detailní buňky (desktop sloupce) a mobilní souhrn — skryté ve výchozím stavu */
.tt-row-startlist .sl-cell { display: none; }
.sl-summary { display: none; }
/* Hlavička sloupců startovky. Mobil (base): 3 nadpisy (St.č | Jméno | Start)
   zarovnané s řádky; detailní nadpisy (Roč./VK/VT/Oddíl) skryté. Desktop
   (≥720px) přepne grid na 7 sloupců a detailní nadpisy zobrazí. */
.sl-head {
  display: grid;
  grid-template-columns: 2.5rem 1fr auto;
  gap: 0.5rem;
  padding: 0.4rem 0.75rem;
  border-bottom: 1px solid var(--c-1e293b);
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
  /* zafixovat hlavičku tabulky pod sticky .site-header (banner + cat-tabs).
     --mobile-header-h publikuje tt_sticky.js; var(--c-0f172a) pozadí kryje rolující
     řádky, z-index nad řádky a pod hlavičkou (100). */
  position: sticky;
  top: var(--mobile-header-h, 100px);
  z-index: 40;
  background: var(--c-0f172a);
}
.sl-head-detail { display: none; }
.sl-head-time { text-align: right; }

/* Mobil: sbalený řádek = jeden řádek (stč | jméno | čas); tap rozbalí druhý
   řádek se souhrnem (Oddíl, Ročník, VK, VT) bez popisků, oddělený čárkami. */
@media (max-width: 719.98px) {
  .tt-row-startlist { cursor: pointer; }
  /* souhrn těsně pod prvním řádkem (potlačit row-gap mřížky) */
  .tt-row-startlist.is-expanded { row-gap: 0; }
  .tt-row-startlist.is-expanded .sl-summary {
    display: block;
    grid-column: 1 / -1;
    padding: 0 0 0.15rem 3rem;
    font-size: 0.8rem;
    color: var(--c-94a3b8);
  }
  .tt-row-startlist.is-expanded .sl-summary:empty { display: none; }
}

/* Desktop: detailní buňky jako sloupce, žádné rozbalování.
   `.startlist` prefix zvyšuje specificitu nad duplicitní `.tt-row-startlist`
   pravidlo (grid 3 sloty) níže v souboru — bez něj by 7 buněk spadlo do
   3 sloupců a každý závodník by zabral 3 řádky. */
@media (min-width: 720px) {
  .startlist .sl-head,
  .startlist .tt-row-startlist {
    grid-template-columns: 2.5rem minmax(7rem, 1.4fr) 3.5rem 3rem 2.75rem minmax(5rem, 1fr) 5rem;
  }
  /* desktop: zobrazit i detailní nadpisy (Roč./VK/VT/Oddíl) */
  .sl-head-detail { display: block; }
  /* čas patří do posledního sloupce (vpravo), ač je v DOM hned za jménem */
  .tt-row-startlist .tt-row-time { order: 1; }
  .tt-row-startlist .sl-cell {
    display: block;
    font-size: 0.85rem;
    color: var(--c-cbd5e1);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .tt-row-startlist .sl-cell-year { font-variant-numeric: tabular-nums; }
  .tt-row-startlist .sl-cell::before { content: none; } /* popisek nese hlavička */
}

/* TT ranking — stejný princip jako startovka.
   Mobil: tap rozbalí souhrn (Oddíl, Ročník/VK, VT) pod řádkem. */
@media (max-width: 719.98px) {
  .tt-row-ranking { cursor: pointer; }
  /* Víc místa pro jméno — užší fixní sloupce + menší mezera, menší písmo
     jména a času. `.tt-ranking` prefix přebíjí duplicitní base grid.
     (platí i pro hlavičku .tt-rank-head, takže zarovnání drží.) */
  .tt-ranking .tt-row-ranking {
    /* první sloupec 2.5rem (ne 2rem) — hlavička nese slovo „POŘ.",
       které se do 2rem nevejde a oříznulo by se. */
    grid-template-columns: 2.5rem 2rem 1fr 3.5rem 2.75rem 3rem;
    gap: 0.35rem;
  }
  /* Na mobilu se zmenšuje CELÝ řádek — Poř./STČ musí jít dolů s jménem
     a časem, jinak by po zrušení jejich 0.85rem naopak přerostly. */
  .tt-row-ranking .tt-row-rank,
  .tt-row-ranking .tt-row-stc,
  .tt-row-ranking .tt-row-name,
  .tt-row-ranking .tt-row-time { font-size: 0.85rem; }
  /* Dělící čára (light) drží řádkování řádku i tady — výšku jí dává vlastní
     strut, takže musí zmenšit písmo se zbytkem řádku. */
  .tt-ranking .tt-rank-marker { font-size: 0.85rem; }
  .tt-row-ranking.is-expanded { row-gap: 0; }
  .tt-row-ranking.is-expanded .sl-summary {
    display: block;
    grid-column: 1 / -1;
    padding: 0 0 0.15rem 2.75rem;
    font-size: 0.8rem;
    color: var(--c-94a3b8);
  }
  .tt-row-ranking.is-expanded .sl-summary:empty { display: none; }
  /* hlavička se na mobilu nerozbaluje */
  .tt-rank-head { cursor: default; }
}

/* Desktop: NAR/VK/VT/Oddíl jako sloupce mezi jménem a časem → 10 sloupců.
   `.tt-ranking` prefix zvyšuje specificitu nad duplicitní `.tt-row-ranking`
   (6-sloupcové) pravidlo níže v souboru. */
@media (min-width: 720px) {
  .tt-ranking .tt-row-ranking {
    /* první sloupec 2.5rem — viz mobil: hlavička „POŘ." se do 2rem nevejde. */
    grid-template-columns: 2.5rem 2rem minmax(6rem, 1fr) 3.5rem 2rem 3rem 2.75rem minmax(4.5rem, 1fr) 4.5rem 3.5rem 3.25rem;
  }
  .tt-row-ranking .sl-cell {
    display: block;
    font-size: 0.85rem;
    color: var(--c-cbd5e1);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .tt-row-ranking .sl-cell-year { font-variant-numeric: tabular-nums; }
  .tt-row-ranking .sl-cell-vkrank { font-variant-numeric: tabular-nums; text-align: right; }
  .tt-row-ranking .sl-cell-vk { text-align: center; }
}
.tt-row-name {
  font-weight: 500;
  color: var(--c-f1f5f9);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tt-row-time {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: var(--c-cbd5e1);
}
.tt-row-on-course .tt-row-time { color: var(--accent); }
.tt-row-diff {
  font-variant-numeric: tabular-nums;
  color: var(--c-94a3b8);
  font-size: 0.85rem;
  text-align: right;
  white-space: nowrap;
}
/* Vlna 3 (C.1): FLT badge — žluté plné pozadí, černá číslice. Statický
   `G` prefix (G4) odstraněn z renderů — badge sám značí FLT, číslo
   uvnitř značí bránu.
   Vlna 3 (K3): vertikální centrování — inline-flex + align-items:center
   + line-height:1 + symetric padding. Bez line-height:1 sedí číslice
   v upper-half line-boxu (default 1.4, font bez descenderu) → opticky
   prázdné místo pod číslicí. */
.tt-row-flt {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  background: var(--c-facc15);
  color: var(--c-0a0a0a);
  padding: 0.2rem 0.4rem;
  border-radius: 4px;
  font-size: 0.72rem;
  font-weight: 700;
  white-space: nowrap;
}
.tt-row-flt-empty {
  color: var(--c-475569);
  text-align: center;
  font-size: 0.85rem;
}
.tt-row.status-dnf,
.tt-row.status-dns,
.tt-row.status-ral,
.tt-row.status-dsq,
.tt-row.status-dqb { opacity: 0.55; }
.tt-row.status-dnf .tt-row-time,
.tt-row.status-dns .tt-row-time,
.tt-row.status-ral .tt-row-time,
.tt-row.status-dsq .tt-row-time,
.tt-row.status-dqb .tt-row-time { color: #f87171; }
.tt-empty {
  padding: 1.5rem 1rem;
  text-align: center;
  color: #64748b;
}

/* Latest finisher highlight (sjednoceno s desktop wave 2.4.11 / mobile 2.7.19). */
.tt-row-ranking[data-latest-finisher="1"] {
  background-color: rgba(34, 197, 94, 0.18);
  box-shadow: inset 3px 0 0 #22c55e;
  transition: background-color 0.5s ease-out;
}
@keyframes tt-latest-finisher-pulse {
  0%   { background-color: rgba(34, 197, 94, 0.55); }
  50%  { background-color: rgba(34, 197, 94, 0.35); }
  100% { background-color: rgba(34, 197, 94, 0.18); }
}
.tt-row-ranking.latest-finisher-pulse {
  animation: tt-latest-finisher-pulse 2s ease-out;
}
.tt-row-ranking.status-dnf[data-latest-finisher="1"],
.tt-row-ranking.status-ral[data-latest-finisher="1"],
.tt-row-ranking.status-dns[data-latest-finisher="1"],
.tt-row-ranking.status-dsq[data-latest-finisher="1"],
.tt-row-ranking.status-dqb[data-latest-finisher="1"] {
  background-color: rgba(239, 68, 68, 0.12);
  box-shadow: inset 3px 0 0 #ef4444;
}

/* Na trati scoreboard look — sdílená yellow paleta (převzato z mobile 2.7.17). */
#tt-on-course {
  background: var(--c-0a0a0a);
  border: 2px solid var(--c-facc15);
  border-radius: 8px;
  padding: 0.5rem;
  margin-bottom: 1rem;
}
/* Optická korekce: obsah o ~1px níž. align-items: center vystředí BOXY,
   jenže ink písma sedí v line-boxu výš — pod účařím je vyhrazené místo pro
   dolní dotažnice, které STČ/jméno/hodiny nemají. Text pak opticky visí
   u horní hrany černého panelu (měřeno po pixelech: 5,3 px nad inkem vs
   7,4 px pod ním). Padding 0.36rem nahoře / 0.24rem dole — součet zůstává
   0.6rem, výška řádku se nemění. */
#tt-on-course .tt-row {
  background: transparent;
  color: var(--c-facc15);
  font-family: ui-monospace, "SF Mono", Monaco, "Cascadia Code",
               "Roboto Mono", Consolas, "Liberation Mono",
               "Courier New", monospace;
  font-weight: 700;
  border-bottom: 1px dashed rgba(250, 204, 21, 0.2);
  padding: 0.36rem 0.25rem 0.24rem;
}
#tt-on-course .tt-row:last-child {
  border-bottom: none;
}
/* STČ na LED tabuli ve velikosti řádku (dědí 0.92rem z .tt-row) — dřív
   0.85rem, což v nejhustším řádkování (root 13.5px) dávalo 11.5px proti
   12.4px jména; startovní číslo bylo viditelně menší než zbytek řádku.
   Odlišuje ho světlejší žlutá (--c-fde047), ne velikost. Běžící hodiny
   zůstávají větší (1.05rem) — ty jsou ohnisko tabule.
   Stejné pravidlo má .gm-stc v .time-live-board (časové disciplíny).
   Zarovnání doprava: jednotky startovních čísel lícují pod sebou
   (tabular-nums) — sloupec drží grid `.tt-row` (2.5rem), takže stačí
   text-align. POZOR: `#tt-on-course .tt-row-stc` je v tomhle souboru
   dvakrát (historické sloučení desktop + mobile stylů) — obě kopie musí
   zůstat shodné, jinak rozhoduje pořadí v souboru. */
#tt-on-course .tt-row-stc {
  color: var(--c-fde047);
  font-weight: 700;
  text-align: right;
}
#tt-on-course .tt-row-name {
  color: var(--c-facc15);
  font-weight: 700;
}
#tt-on-course .tt-row-on-course .tt-row-time {
  color: var(--c-facc15);
  font-size: 1.05rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.03em;
  text-shadow: 0 0 5px rgba(250, 204, 21, 0.4);
  white-space: nowrap;
}
/* Vlna 3 (C.1): scoreboard FLT badge sjednocený s globálním .tt-row-flt
   — plné žluté pozadí, černá číslice. Dřív transparentní s žlutým
   borderem; teď konzistentní look v on-course i ranking sekci.
   Vlna 3 (K3): vertikální centrování — inline-flex + line-height:1 dědí
   z globálního .tt-row-flt; padding přepisujeme jen pro scoreboard
   font-size (0.78rem) a větší font-weight. */
#tt-on-course .tt-row-flt {
  background: var(--c-facc15);
  color: var(--c-0a0a0a);
  padding: 0.2rem 0.4rem;
  border-radius: 3px;
  font-size: 0.78rem;
  font-weight: 800;
}
#tt-on-course .tt-row-flt-empty {
  color: #78716c;
  font-size: 0.78rem;
}

/* ─────────────────────────────────────────────────────────────────────
   Vlna 2 fáze A: TT live header rámec (banner + pás kategorií + status
   puntík). Sdílený _tt_frame.html partial v site-header bloku `header`.
   Mírné breakpoint úpravy v desktop.css / mobile.css drží šířky a tap
   targets (CSS unify → Commit 3b).
   ───────────────────────────────────────────────────────────────────── */

.tt-frame {
  display: flex;
  flex-direction: column;
  gap: 0;             /* divider na .event-banner sedí flush proti .tt-cat-tabs */
  flex: 1;            /* zabírá flex middle slot v site-header / site-header */
  min-width: 0;       /* prevent overflow z dlouhého názvu závodu */
}

/* Banner kontejner — robustní layout. Pozdější vlna vymění textový
   obsah za <img> / background-image bez změny okolního layoutu.
   Vlna 2 fáze B: dva řádky — název závodu (větší) + meta (venue + datum,
   menší, oba jsou volitelné).
   Vlna 3 (A, K1): KXRS top-stripe barva #1e3a5f — explicitní background
   na .event-banner, jen banner (NE celý header — outer .site-header /
   .site-header zůstává na var(--c-1e293b) a .tt-cat-tabs ji dědí). Spodní
   border var(--c-475569) odděluje banner od pásu kategorií.
   Vlna 3 (K2): redukované vertikální padding (0.35rem) + tightening
   line-heights (1.1) + meta margin (0.1rem) → výška banneru cca 47-48px
   (vs původních ~64px), opticky srovnatelné s KXRS header (~45px). */
.event-banner {
  background: #1e3a5f;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0.35rem 1rem;
  overflow: hidden;
  text-align: center;
  border-bottom: 1px solid var(--c-475569);
}
.event-banner-text {
  font-weight: 700;
  font-size: 1.15rem;
  line-height: 1.1;
  color: var(--c-f1f5f9);
  letter-spacing: 0.02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.event-banner-meta {
  font-size: 0.78rem;
  line-height: 1.1;
  color: var(--c-cbd5e1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  margin-top: 0.1rem;
}

/* Vlna 3 (K4): banner edge-to-edge — zrušit padding na .site-header /
   .site-header když je uvnitř .event-banner (TT view). Bez padding
   rodiče modrý banner lícuje s okrajem okna. Logo je v TT view skryté
   přes block site_logo override v tt_live.html (jinak by blokovalo
   left edge na desktopu). Kompenzaci poskytuje padding přímo na
   .tt-cat-tabs (níže) — vrátíme horizontální/vertikální offset, jen
   pro pás kategorií, ne pro banner. */
.site-header:has(.event-banner),
.site-header:has(.event-banner) {
  padding: 0;
}

/* Pás kategorií — anchor tlačítka místo popup. Status puntík na konci.
   Vlna 3 (K4): kompenzační padding (header v TT view má padding: 0
   kvůli edge-to-edge banneru) — vrací horizontální + vertikální offset,
   který měl předtím rodič. Banner ho NEMÁ (zůstává edge-to-edge). */
/* Segment control kategorií (varianta D): vnější pruh (full-width separátor
   pod hlavičkou + horizontální scroll) obaluje orámovaný blok segmentů bez
   mezer. Sdílí TT / pavouk / startovka. */
.tt-cat-tabs-strip {
  /* Flex řádek: vlevo scrollovatelný pás kategorií (.tt-cat-tabs), volitelně
     vpravo ikona „Živý čas v pořadí" (.tt-live-toggle, jen TT). Scroll se
     odehrává uvnitř .tt-cat-tabs, takže ikona zůstává trvale vpravo. */
  display: flex;
  align-items: center;
  /* .site-header má horizontální padding 0.75rem — prolomíme ho negativním
     okrajem, aby band sahal až k okrajům obrazovky, a kompenzujeme vnitřním
     paddingem 1.5rem (0.75 header + 0.75), aby tlačítka zůstala zarovnaná
     s titulem v hlavičce. */
  margin: 0 -0.75rem;
  padding: 0.3rem 1.5rem;
  /* Pozadí sjednoceno s obsahem pod ním (tabulka s pořadím = var(--c-0f172a), body),
     ne s hlavičkou (var(--c-1e293b)). */
  background: var(--c-0f172a);
  /* Header-unify: pás sedí pod hlavním řádkem záhlaví (TT + pavouk),
     tenká linka ho odděluje. */
  border-top: 1px solid var(--c-334155);
}
/* Live ve fázi TT: místo přepínače kategorií jen štítek aktivní kategorie
   (live_tt.html). Sdílí band (.tt-cat-tabs-strip), label je needitovatelný. */
.live-focus-strip {
  min-height: 38px;          /* parita výšky s pásem kategorií */
}
.live-focus-label {
  display: inline-flex;
  align-items: center;
  flex: 1 1 auto;            /* roztáhne se → přepínač vzhledu / PDF chipy vpravo */
  min-width: 0;
  min-height: 38px;
  font-weight: 600;
  font-size: 0.95rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--c-e2e8f0);
}
/* Konečné výsledky: nadpis na velikost nadpisu sekce v Rozpisu (1.05rem). */
.live-focus-label--lg { font-size: 1.05rem; font-weight: 700; }
/* Label aktivní fáze (KVAL/FA/FB) PŘED názvem kategorie v záhlaví LIVE —
   přesunutý z nadpisu nad výsledky. Akcentní, oddělený svislítkem
   (.live-focus-sep) mezi fází a názvem kategorie. */
.live-focus-phase {
  flex: 0 0 auto;
  font-weight: 700;
  color: var(--accent);
}
/* Svislítko oddělující text fáze (KVALIFIKACE) od názvu kategorie. */
.live-focus-sep {
  flex: 0 0 auto;
  margin: 0 0.5rem;
  font-weight: 400;
  color: var(--c-94a3b8);
}
/* Celkové (event-level) PDF chipy v řádku s nadpisem. */
.live-focus-docs { display: flex; align-items: center; gap: 0.4rem; flex: 0 0 auto; }
/* Live „konečné výsledky" — responzivní grid karet (1 na kategorii), uvnitř
   top-4 finále A. Athlete řádky reusují .race-card-athlete (vč. desktop
   sloupce oddíl/stát + FLT pruhu). */
.results-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr));
  gap: 0.6rem;
  padding: 0.5rem;
}
.results-card {
  background: var(--c-1e293b);
  border: 1px solid var(--c-475569);
  border-radius: 8px;
  padding: 0.6rem 0.75rem;
}
.results-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  font-weight: 700;
  color: var(--c-f1f5f9);
  font-size: 1.05rem;          /* parita s .rozpis-section-title */
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-bottom: 0.4rem;
  padding-bottom: 0.3rem;
  border-bottom: 1px solid var(--c-334155);
}
.results-card-title { min-width: 0; }
.results-card-docs { display: flex; gap: 0.35rem; flex: 0 0 auto; }
/* Podsekce Finále A / Finále B v rámci karty kategorie. */
.results-final + .results-final { margin-top: 0.5rem; }
.results-card-sublabel {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--c-94a3b8);
  margin: 0.25rem 0 0.1rem;
}
.results-card-athletes { list-style: none; margin: 0; padding: 0; }
/* o malinko čitelnější než kompaktní prev/next karty + řádkové rozestupy */
.results-card-athletes .race-card-athlete {
  font-size: 0.85rem;
  padding: 0.18rem 0;
}
/* medaile pro top 3 (zlato/stříbro/bronz) — jen číslo pořadí */
.results-card-athletes .race-card-athlete[data-pos="1"] .athlete-pos { color: #facc15; }
.results-card-athletes .race-card-athlete[data-pos="2"] .athlete-pos { color: #cbd5e1; }
.results-card-athletes .race-card-athlete[data-pos="3"] .athlete-pos { color: #d97706; }

.tt-cat-tabs {
  display: flex;              /* řada tlačítek kategorií */
  align-items: center;
  gap: 0;                     /* segmenty bez mezer */
  flex-wrap: nowrap;
  flex: 1 1 auto;            /* zabere zbytek řádku, ikona vpravo si nechá své */
  min-width: 0;             /* dovolí scroll uvnitř flex itemu */
  overflow-x: auto;          /* scroll přesunut sem ze stripu (kvůli ikoně vpravo) */
  -webkit-overflow-scrolling: touch;
  /* 7+ kategorií → blok přeteče → plynulý scroll se scroll-snapem.
     proximity (ne mandatory) snapne jen blízko hranice, jinak volný scroll. */
  scroll-snap-type: x proximity;
  scrollbar-width: none;      /* Firefox: skrýt scrollbar */
  /* bez orámování — jednotlivá tlačítka si nesou vlastní styl (aktivní pilulka) */
}
.tt-cat-tabs::-webkit-scrollbar { display: none; }  /* WebKit: skrýt scrollbar */
/* Segment: štíhlejší (~38px tap-target, kompromis vs 44px a11y floor
   z Wave 2.7.5), jen jemně zaoblený (4px). Aktivní = modrá + bílá;
   neaktivní = transparentní + světle šedá + hover. */
.tt-cat-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;             /* nezmenšovat → 7+ položek korektně scrolluje */
  scroll-snap-align: start;
  min-height: 38px;
  min-width: 3rem;
  padding: 0.4rem 1.05rem;    /* ~6px svisle, ~17px vodorovně */
  border-radius: 4px;
  background: transparent;
  color: var(--c-cbd5e1);
  text-decoration: none;
  font-weight: 600;
  font-size: 0.9rem;
  letter-spacing: 0.02em;
  white-space: nowrap;
  transition: background 0.15s, color 0.15s;
}
.tt-cat-tab:hover {
  background: rgba(255, 255, 255, 0.08);
  color: var(--c-f1f5f9);
  text-decoration: none;
}
.tt-cat-tab.active {
  background: var(--accent);
  color: #ffffff;             /* aktivní text bílý (dříve tmavý var(--c-0f172a)) */
}
.tt-cat-tab:active { transform: scale(0.97); }

/* Desktop: zarovnat obsah hlavičky (titul) i tlačítka kategorií s levým
   okrajem tabulky (startovka / TT / pořadí). Obsah .site-main je max-width
   900px centrovaný (+1rem padding); bandy hlavičky (var(--c-1e293b)) a pruhu
   kategorií (var(--c-0f172a)) zůstávají full-width, ale jejich OBSAH dostane stejný
   kontejner (max-width 900 + margin:auto + 1rem padding). margin:auto drží
   shodný střed jako .site-main → levé okraje lícují, bez 100vw/scrollbar
   nesouladu. */
@media (min-width: 720px) {
  .site-header-main {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    padding-left: 1rem;
    padding-right: 1rem;
  }
  /* Landing: tabulka závodů (.home) je max-width 1280px — titul v hlavičce
     zarovnáme na stejnou šířku, ať lícuje s jejím levým okrajem. */
  body.home-no-dock .site-header-main {
    max-width: 1280px;
  }
  /* Band zůstává full-width (var(--c-0f172a)), ale jeho OBSAH (nav + ikona) se
     centruje do 900px sloupce přes symetrický padding. Levý okraj navu tak
     lícuje s tabulkou pod ním, ikona „Živý čas" sedí na pravém okraji
     stejného sloupce. max() drží min. 1rem padding na užších desktopech. */
  .tt-cat-tabs-strip {
    padding-left: max(1rem, (100% - 900px) / 2);
    padding-right: max(1rem, (100% - 900px) / 2);
  }
  /* Desktop: pravá hrana PDF skupiny (a tím i fázového přepínače — je to tentýž
     element) lícuje svisle s přepínačem jazyka CZ|EN, tj. s posledním prvkem
     hlavičky. Cílový odstup od pravé hrany pásu je `centrovací offset hlavičky
     + 1.5rem` (0.75rem breakout margin pásu + 0.75rem padding .site-header).

     Proč to není jedna konstanta ani jedna formule:
     a) pás i hlavička se centrují na 900px sloupec, ale KLAMPUJÍ jinde —
        hlavička `max-width` + `margin:auto` (offset nikdy < 0), pás
        `padding: max(1rem, …)` (podlaha 1rem). Dřívější konstanta 1.75rem tak
        seděla jen nad 956px; pod ní ujížděla doleva až o 20px.
     b) PAST: % v `margin` téhle flex položky se počítá z CONTENT boxu pásu
        (tj. už BEZ jeho paddingu), ne z hlavičky jako padding výše — proto
        v (100% - 892px) figuruje 892 = 924 - 2*1rem, ne 900. Nad breakpointem
        je navíc ten content box konstantních 924px, takže tam % nic neřeší
        a musí nastoupit konstanta.
     Zlom 956px = šířka, při které padding pásu opouští podlahu 1rem
     ((956 - 24 - 900) / 2 = 16px). Ověřeno měřením na 22 šířkách 360–1920px
     (Výsledky bez přepínače i Startovka s přepínačem), odchylka 0px. */
  .tt-doc-switch {
    margin-right: calc(clamp(0px, (100% - 892px) / 2, 1rem) + 0.5rem);
  }
  @media (min-width: 956px) {
    .tt-doc-switch { margin-right: 1.5rem; }
  }
  .tt-cat-tabs {
    flex: 1 1 auto;
    margin: 0;
    padding: 0;
    justify-content: flex-start;
  }
}

/* Mobil (< 720px): zhusti taby kategorií i PDF přepínač, ať se vejdou vedle
   sebe do jednoho řádku bez zbytečného scrollování. Zmenšujeme hlavně
   vodorovné rozměry (padding/min-width/font) — výšku tap-targetu držíme na
   38px (a11y). PDF skupina (.tt-doc-switch) se přitiskne blíž k tabům. */
@media (max-width: 719px) {
  .tt-cat-tab {
    min-width: 2.1rem;
    padding: 0.4rem 0.55rem;
    font-size: 0.82rem;
    letter-spacing: 0.01em;
  }
  .tt-doc-switch { margin-left: 0.4rem; }
  .tt-doc-switch .doc-chip--tabs { padding: 3px 6px; }
  .doc-chip--phase .doc-chip-lbl { min-width: 12px; font-size: 11px; }
}

/* Status puntík — bez textu, barva podle stavu. Žije na konci pásu
   kategorií (margin-left: auto). Class řídí connection_status.js přes
   classList add/remove (ne přes celý className přepis — jinak by se
   .tt-conn-dot ztratil). Specificita .tt-conn-dot.connection-status-*
   (0,2,0) > .connection-status-* (0,1,0) → puntík background vyhrává
   nad původním badge backgroundem. */
.tt-conn-dot {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #4ade80;       /* default online */
  margin-left: auto;
  flex-shrink: 0;
  transition: background 0.2s, box-shadow 0.2s;
}
.tt-conn-dot.connection-status-online   { background: #4ade80; }
.tt-conn-dot.connection-status-stale    {
  background: #fb923c;
  animation: live-pulse 1.5s ease-in-out infinite;
}
.tt-conn-dot.connection-status-offline  { background: #ef4444; }
.tt-conn-dot.connection-status-recovered {
  background: #4ade80;
  box-shadow: 0 0 8px rgba(74, 222, 128, 0.8);
}

/* ── Home page (Wave 2.13.0 landing-sections) ── */
.home {
  max-width: 1280px;
  margin: 0 auto;
  padding: 1.5rem 1rem;
}

.home-section {
  margin-bottom: 2.5rem;
}

.event-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 1rem;
}

.event-grid--compact {
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 0.6rem;
}

.event-card {
  display: block;
  padding: 1rem;
  border-radius: 8px;
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.15s, transform 0.15s;
}
.event-card:hover {
  border-color: var(--accent);
  transform: translateY(-1px);
  text-decoration: none;
}

.event-card--live {
  border-color: rgba(34, 197, 94, 0.5);
  background:
    linear-gradient(135deg, rgba(34,197,94,0.08), transparent 60%),
    var(--card-bg);
}
.event-card--finished {
  opacity: 0.75;
}

.event-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}

.event-card-name {
  font-size: 1.05rem;
  font-weight: 600;
  margin: 0;
  line-height: 1.3;
  color: var(--c-f1f5f9);
}

.event-card-live-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  background: var(--live-soft);
  color: #4ade80;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  white-space: nowrap;
  flex-shrink: 0;
}

.event-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  font-size: 0.85rem;
  color: var(--muted);
}
.event-card-meta > span + span::before {
  content: "·  ";
  margin-right: 0.2rem;
  opacity: 0.6;
}

.event-card-updated {
  margin-top: 0.6rem;
  font-size: 0.75rem;
  color: #4ade80;
}

/* Wave 2.13.3: .live-pulse + @keyframes live-pulse-anim removed —
   landing status indicator is a static colored dot (.event-dot), no
   animation. The unrelated .live-dot pulse in TT live banner uses
   @keyframes live-pulse (no -anim suffix) in mobile.css/desktop.css. */

/* Mobile úpravy: na úzkém viewportu jen menší padding, sekce jdou
   přirozeně do 1 sloupce díky auto-fill 320px minimum. */
@media (max-width: 480px) {
  .home {
    /* L/R padding 1rem = stejně jako hlavička (.site-header-main) → levý okraj
       tabulky lícuje s názvem a pravý s ikonou režim. */
    padding: 1rem;
  }
  .home-section {
    margin-bottom: 1.6rem;
  }
  .event-card {
    padding: 0.8rem;
  }
}

/* ── Wave 2.13.4: unified landing layout ──
   Desktop: single <table> with sections as <tbody> (live/recent/upcoming;
   archive sits in its own table inside <details>),
   one <thead> for column alignment, visible separator between sections.
   Mobile: dedicated <div>-based cards (separate partial). Markup is split
   per layout — CSS toggles which one is visible. No table-reset gymnastics.
*/

/* Status dot — shared between desktop table cell and mobile card header. */
.event-dot {
  display: inline-block;
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 50%;
  flex-shrink: 0;
  vertical-align: middle;
}
.event-dot--live      { background: #22c55e; }
.event-dot--upcoming  { background: var(--accent); }
.event-dot--finished  { background: var(--muted); }
/* live_now: běží živé výsledky → červená pulzující tečka (radar ping),
   stejná červená jako Live puntík v docku. Odlišuje „běží výsledky" od
   pouhého „probíhá" (zelená). */
.event-dot--livenow {
  background: #ef4444;
  animation: event-dot-pulse 1.8s ease-out infinite;
}
@keyframes event-dot-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.55); }
  70%  { box-shadow: 0 0 0 6px rgba(239, 68, 68, 0); }
  100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .event-dot--livenow { animation: none; }
}

/* ── Mobile default (<720px): show cards, hide table ── */

.event-table {
  display: none;
}
.event-cards {
  display: block;
}

.event-cards-section {
  margin-bottom: 1.2rem;
}
.event-cards-section:last-child {
  margin-bottom: 0;
}

.event-mobile-card {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 0.6rem;
  row-gap: 0.25rem;
  align-items: center;
  padding: 0.8rem 1rem;
  margin-bottom: 0.6rem;
  border-radius: 8px;
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.15s;
}
.event-mobile-card:hover {
  border-color: var(--accent);
  text-decoration: none;
}
.event-mobile-card--live {
  border-color: rgba(34, 197, 94, 0.5);
  background:
    linear-gradient(135deg, rgba(34,197,94,0.08), transparent 60%),
    var(--card-bg);
}
.event-mobile-card--finished {
  opacity: 0.75;
}

.event-mobile-card-header {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.event-mobile-card-name {
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.3;
  color: var(--c-f1f5f9);
}

.event-mobile-card-meta {
  grid-column: 2;   /* aligned with name (offset right of dot column) */
  font-size: 0.85rem;
  color: var(--muted);
  line-height: 1.5;
}
.event-mobile-card-sep {
  margin: 0 0.2rem;
  opacity: 0.5;
}
.event-mobile-card-number {
  font-variant-numeric: tabular-nums;
}


/* ── Desktop (>=720px): show table, hide cards ── */

@media (min-width: 720px) {
  .event-cards {
    display: none;
  }
  .event-table {
    display: table;
    width: 100%;
    border-collapse: collapse;
    /* Bez `fixed` je `width` u sloupce jen PREFERENCE — prohlížeč si šířky
       dopočítá z obsahu, a hlavní tabulka s archivem obsah sdílený nemají:
       nad přehybem visí až devět chipů (propozice, rozpis, SL série, SL, TT,
       pavouk, VL, XLS, XML), v archivu nejvýš čtyři (VL, podrobná VL, XLS,
       XML). Sloupec Dokumenty tak vyšel v archivu o 238 px užší, pružný
       sloupec Název ten rozdíl spolkl a Místo začínalo v archivu o 238 px
       vpravo. Totéž umí udělat i Č.: roztržený kros („122 / 123") sloupec
       rozšíří jen v té tabulce, kde takový závod zrovna je. Fixní rozvržení
       dělá z deklarovaných šířek závazek, takže obě tabulky lícují bez
       ohledu na to, co v které sekci právě visí. */
    table-layout: fixed;
  }

  .event-table thead {
    display: table-header-group;
  }
  .event-table th {
    padding: 0.65rem 0.8rem;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid var(--card-border);
    text-align: left;
  }

  .event-table .event-tbody {
    display: table-row-group;
  }
  /* Visible separator between sections: thicker top border on the first
     row of any non-first <tbody>. Pseudo-elements on <tbody> are spotty
     across browsers, so we put the border on the first <tr>'s cells. */
  .event-table .event-tbody + .event-tbody .event-row:first-child > td {
    border-top: 2px solid var(--card-border);
    padding-top: 1.05rem;  /* visual breathing room above the separator */
  }

  .event-row {
    display: table-row;
    cursor: pointer;
    transition: background-color 0.12s;
  }
  .event-row > td {
    display: table-cell;
    padding: 0.65rem 0.8rem;
    vertical-align: middle;
    border-bottom: 1px solid rgba(51, 65, 85, 0.5);
  }
  .event-row:hover {
    background: rgba(var(--accent-rgb), 0.06);
  }
  .event-row--live {
    background: rgba(34, 197, 94, 0.04);
  }
  .event-row--live:hover {
    background: rgba(34, 197, 94, 0.10);
  }
  .event-row--finished {
    opacity: 0.85;
  }

  .event-row > td.col-name {
    font-size: 1rem;
    font-weight: 700;
  }
  .event-row > td.col-name a {
    color: var(--c-f1f5f9);
    text-decoration: none;
  }
  .event-row > td.col-name a:hover {
    color: var(--accent);
  }

  /* Číslo závodu, datum a místo menším písmem (méně výrazné než název). */
  .event-row > td.col-number,
  .event-row > td.col-date,
  .event-row > td.col-venue {
    font-size: 0.82rem;
  }

  /* Šířky sloupců — závazné díky `table-layout: fixed` výše, a v PROCENTECH,
     ne v rem. Šest sloupců se pod ~1100 px prostě nevejde: pevné hodnoty
     rozpočítané na širokou obrazovku by tam Název srazily na nulu a text by
     přetekl do Místa, kdežto poměrné se s tabulkou zmenší a řádek zůstane
     čitelný. Jediný pružný sloupec je Název — `auto` mu dá zbytek. Hodnoty
     jsou odměřené na plné šířce obsahu (1248 px), kde na Název zbývá 33.5 %. */
  .event-table .col-status { width: 5%; text-align: center; }
  /* 7 % = 87 px na plné šířce, tedy dvojice čísel roztrženého krosu
     („122 / 123") na jeden řádek. Zalomení se povoluje pro užší okna: číslo
     přetečené ze sloupce ven je horší než na dva řádky. */
  .event-table .col-number { width: 7%; text-align: center; font-variant-numeric: tabular-nums; color: var(--muted); }
  /* 14 % = 175 px, tedy dvoudenní závod („09.09.2026 – 10.09.2026") na
     jeden řádek; `czdate` doplňuje nuly, takže nejširší datum je vždy stejně
     široké. Na užších oknech se rozsah zalomí u pomlčky. */
  .event-table .col-date   { width: 14%; }
  .event-table .col-name   { width: auto; }
  .event-table .col-venue  { width: 13%; }
  /* 28 % = 349 px. Sada, která se v praxi vyskytne, se do toho vejde:
     chystaný/běžící závod má nejvýš sedm chipů (propozice, rozpis, SL série,
     SL, TT, pavouk, VL) a všechny úzké — sešit a XML vznikají až s výsledky,
     a to už je závod ukončený a nese jen čtyři, byť široké (PDF, PDF+, XLS,
     XML ≈ 210 px). Devět chipů NAJEDNOU, a k tomu tři široké, dá dohromady
     412 px a zalomí se na dva řádky; je to ale kombinace, která znamená
     „odevzdané výsledky u závodu, který ještě neskončil".
     Zalomení se schválně POVOLUJE (globální `.col-docs` má `nowrap`): na
     užším okně i po přibytí desátého druhu dokumentu řádek povyroste — to
     je vidět a dá se spravit, kdežto chip přetečený z tabulky ven ne. */
  .event-table .col-docs   { width: 28%; white-space: normal; }
}


/* ═══════════════════════════════════════════════════════════════════
   Wave 2.14.0 Commit 3b: merged from mobile.css (mobile-first ground state).
   Linked after the base rules above — same cascade order as the previous
   base.css + mobile.css <link> pair, so rendering is unchanged.
   ═══════════════════════════════════════════════════════════════════ */

/* Wave 2.7.1 + 2.7.2: mobile-specific styles. Loaded only when shell == "mobile". */

/* From base style.css (Wave 2.6.2b live chip polish): tighter padding */
@media (max-width: 480px) {
  .live-current-heat { padding: 0.5rem 0.75rem; }
  .live-current-heat .athlete-name { font-size: 0.8rem; }
}

/* Wave 2.14.0: dead blocks removed (shell-toggle, mobile-placeholder,
   shell-mobile) — shell mechanism + placeholder page jsou pryč; dark theme
   žije na `body` v base.css. */

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  background: var(--c-1e293b);
  border-bottom: 1px solid var(--c-334155);
}
/* Header-unify: hlavní řádek záhlaví — event-info (vlevo) + connection-status. */
.site-header-main {
  display: flex;
  align-items: center;
  /* menší mezera než dřív (0.75rem): ovládací prvky vpravo žijí ve vlastním
     sevřeném shluku (.header-tools), takže tenhle gap odděluje už jen titul
     od shluku — víc místa na název závodu. */
  gap: 0.5rem;
  /* mobil: levý padding 0 → logo flush k okraji; pravý 0.75rem drží přepínač
     režimu uvnitř obrazovky. Desktop padding přepíše @media (min-width:720px). */
  padding: 0.5rem 0.75rem 0.5rem 0;
  min-height: 53px;
}
/* Logo „kros.results.cz" je v hlavičce jen na landing (jako titul stránky);
   na stránkách závodu hlavičku nese blok .site-event-info. */
.site-brand {
  font-weight: 700;
  font-size: 1.15rem;
  color: var(--c-f1f5f9);
  text-decoration: none;
}
.site-brand:hover { text-decoration: none; }
/* Detail závodu v hlavičce: dvouřádkový blok — název (větší) + pod ním
   místo · datum · #číslo (menší, tlumené). flex:1 + min-width:0 + ellipsis
   na obou řádcích nechá dlouhý text useknout, aby neodtlačil connection-status. */
.site-event-line {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.1rem;
  color: var(--c-f1f5f9);
}
.site-event-name {
  font-size: 1.1rem;   /* mobil; desktop zvětší v @media (min-width:720px) */
  font-weight: 700;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.site-event-meta {
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--c-94a3b8);
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Hlavička je odkaz na landing — potlač defaultní podtržení/barvu odkazu,
   jemný hover jako náznak klikatelnosti (parita s domečkem v docku). */
a.site-event-line {
  text-decoration: none;
  cursor: pointer;
  transition: opacity 0.15s ease;
}
a.site-event-line:hover {
  opacity: 0.8;
}

.live-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  background: #0c4a6e;
  color: var(--c-f1f5f9);
  border-radius: 999px;
  padding: 0.3rem 0.7rem;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  user-select: none;
  border: none;
}
.live-badge[data-state="paused"] {
  background: var(--c-475569);
  opacity: 0.85;
}
.live-badge.live-badge-error {
  background: #7f1d1d;
}
.live-badge .live-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--accent);
  animation: live-pulse 1.5s ease-in-out infinite;
}
.live-badge[data-state="paused"] .live-dot {
  animation: none;
  background: var(--c-94a3b8);
}
@keyframes live-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%      { opacity: 0.5; transform: scale(1.3); }
}
.live-badge .live-scope {
  font-size: 0.78rem;
  opacity: 0.85;
  text-transform: lowercase;
}

.site-main {
  padding-bottom: 56px;
  min-height: calc(100vh - 48px - 56px);
}
/* Wave 2.13.4: landing page nemá dock — uvolnit rezervovaný spodní prostor. */
body.home-no-dock .site-main {
  padding-bottom: 1rem;
  min-height: calc(100vh - 48px);
  /* Landing: nech šířku řídit .home (max-width 1280), ať tabulka lícuje
     s hlavičkou (taky 1280). Bez tohoto by .site-main (900) tabulku seřízl. */
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}

/* ─────────────────────────────────────────────────────────────────────
   Race strip
   ───────────────────────────────────────────────────────────────────── */

.race-strip {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 0.5rem;
}

/* Compact cards (prev/next).
   Wave 2.7.12: status-driven border — done (prev) gets a soft green,
   pending (next) gets the hero pending blue. Default fallback is a
   light gray visible against the var(--c-1e293b) background. The same color
   protocol as the hero card but subtler since compacts are secondary. */
.race-card-compact {
  background: var(--c-1e293b);
  border: 1px solid var(--c-475569);
  border-radius: 8px;
  padding: 0.6rem 0.75rem;
  cursor: pointer;
  transition: background 0.15s, border-color 0.3s;
  min-height: 80px;
}
.race-card-compact[data-race-status="done"] {
  border-color: rgba(74, 222, 128, 0.4); /* mírná zelená */
}
.race-card-compact[data-race-status="pending"] {
  border-color: var(--accent); /* hero pending blue */
}
.race-card-compact:active { background: var(--c-334155); }
.race-card-compact-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 0.4rem;
  font-size: 0.85rem;
}
.race-card-label { font-weight: 600; color: var(--c-f1f5f9); }
.race-card-status { font-size: 0.78rem; color: var(--c-94a3b8); }
.race-card-status.race-status-active { color: var(--accent); }
/* Předstart = otevřená, ale ještě nejedoucí rozjížďka (další operátor si
   potvrzuje nasazení) — rámeček jako připravená, štítek akcentem. */
.race-card-compact[data-race-status="prestart"] { border-color: var(--accent); }
.race-card-status.race-status-prestart { color: var(--accent); font-weight: 600; }
.race-card-status.race-status-done { color: #4ade80; }

.race-card-athletes {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.2rem 0.5rem;
}
.race-card-athlete {
  font-size: 0.78rem;
  color: var(--c-cbd5e1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: flex;
  align-items: baseline;
  gap: 0.25rem;
}
.race-card-athlete .athlete-pos {
  display: inline-block;
  width: 1.2em;
  font-weight: 600;
  color: var(--c-f1f5f9);
  flex-shrink: 0;
}
.race-card-athlete .athlete-name {
  overflow: hidden;
  text-overflow: ellipsis;
}
.race-card-athlete .athlete-flt {
  font-size: 0.7rem;
  background: #b91c1c;
  color: #fff;
  padding: 0.1rem 0.45rem;
  border-radius: 4px;
  margin-left: 0.2em;
}
.race-card-athlete.athlete-status-dns,
.race-card-athlete.athlete-status-dnf,
.race-card-athlete.athlete-status-ral,
.race-card-athlete.athlete-status-dsq,
.race-card-athlete.athlete-status-dqb { opacity: 0.55; }
/* Wave 2.7.11: junior italic dropped — was a desktop bracket-table legacy
   that mobile inherited; Wave 2.6.6 already removed it from the desktop
   side. Class .athlete-junior is still emitted by templates for any
   future hook but no longer carries a font-style. */

/* Hero card.
   Wave 2.7.8: auto-height (drop min-height: 280px) — card sizes to actual
   content, no empty space below 4 athletes. Asymmetric padding: 0.5rem
   right (was 0.75rem) so the right column (pulsing dot in header, status
   pills in athlete rows) sits closer to content rather than glued to the
   card edge. Left padding unchanged to preserve label position. */
.race-card-hero {
  background: var(--c-1e293b);
  border-radius: 12px;
  padding: 0.75rem 0.5rem 0.75rem 0.75rem;
  border: 2px solid var(--accent); /* default = pending / unknown */
  transition: border-color 0.3s;
}
/* Wave 2.7.7: status-driven border colors. Mirror the .live-current-heat
   convention (red=active, green=done) so the outer hero ring agrees with
   the inner live chip. Pending falls back to the default blue. */
.race-card-hero[data-race-status="active"] {
  border-color: #ef4444;
}
.race-card-hero[data-race-status="done"] {
  border-color: #4ade80;
}
/* Wave 2.7.13: strip ALL chrome from the inner .live-current-heat
   section when nested in the mobile hero. base.css gives that section
   padding, margin, and border for standalone use (desktop bracket_live
   and category overview), but inside the hero card the outer
   .race-card-hero already carries border / background / padding —
   the inner section should be a transparent passthrough. Without this,
   active hero was visibly taller than done hero (margin-bottom: 1rem
   from base.css plus residual padding leaked ~32px of extra height).
   This rule supersedes the partial Wave 2.7.7 (border-color transparent
   only) and Wave 2.7.10 (margin-top + partial padding only) overrides. */
.race-card-hero .live-current-heat {
  padding: 0;
  margin: 0;
  border: none;
  background: transparent;
  box-shadow: none;
}
/* Wave 2.7.9: pulsing red dot in the hero header right side, replacing
   the "Live" text we dropped in 2.7.8. The inner .live-current-heat dot
   is hidden when this is shown (suppress duplicate). */
.race-hero-live-dot {
  display: inline-block;   /* funguje i mimo flex (bracket status span) */
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #ef4444;
  flex-shrink: 0;
  animation: live-pulse 1.5s ease-in-out infinite;
}
.race-card-hero[data-race-status="active"] .live-current-heat .live-status-dot {
  display: none;
}
/* Wave 2.7.10: hero header lays out as label + (gate bar) + (dot or status)
   on a single row. Wave 2.7.11: gates sit immediately to the right of the
   label (not pushed to the right edge). The pulsing dot is then pushed to
   the right edge via margin-left: auto on .race-hero-live-dot, and the
   non-active status text uses justify-content: space-between as a fallback. */
.race-hero-header {
  display: flex;
  justify-content: space-between;
  align-items: center;       /* was baseline — center fits dot + gate cells */
  gap: 0.5rem;
  margin-bottom: 0.6rem;
}
.race-hero-header .live-gates {
  flex: 0 0 auto;            /* sit right after label, no growing */
}
.race-hero-live-dot {
  margin-left: auto;         /* push to the far right of the row */
}
/* Wave 2.7.10/12 padding + margin override removed: superseded by the
   Wave 2.7.13 comprehensive .race-card-hero .live-current-heat reset
   above (padding: 0; margin: 0; border: none; background: transparent).
   The .live-status-pill column alignment that 2.7.10 cared about is
   now achieved by the inner section having zero horizontal padding. */
.race-hero-label {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--c-f1f5f9);
}
.race-hero-status { font-size: 0.85rem; font-weight: 600; }
.race-hero-status.race-status-active { color: var(--accent); }
.race-hero-status.race-status-done { color: #4ade80; }
.race-hero-status.race-status-pending { color: var(--c-94a3b8); }

.race-hero-athletes {
  list-style: none;
  margin: 0; padding: 0;
}
/* Wave 2.7.12: unified hero athlete row layout. Active state renders
   via _live_current_heat.html partial as <li class="live-athlete">;
   done state renders directly as <li class="race-hero-athlete">. Both
   share the same padding, border-bottom, and font-size so the hero
   card visuals are consistent regardless of state. The 3-class
   .race-card-hero .live-current-heat .live-athlete selector outranks
   the 2-class .live-current-heat .live-athlete rule in base.css, so
   this override is mobile-only — desktop bracket_live keeps its
   original layout. Last child has no border for a clean visual end. */
.race-hero-athlete,
.race-card-hero .live-current-heat .live-athlete {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.55rem 0;
  border-bottom: 1px solid var(--c-334155);
  font-size: 0.95rem;
}
.race-hero-athlete:last-child,
.race-card-hero .live-current-heat .live-athlete:last-child {
  border-bottom: none;
}
/* Suppress the inter-row gap from base.css when inside the hero —
   row dividers are now the visual separator, gap is redundant. */
.race-card-hero .live-current-heat .live-athletes {
  gap: 0;
  padding: 0;
}
.race-hero-athlete .athlete-pos {
  display: inline-block;
  width: 1.5rem;
  font-weight: 700;
  color: var(--accent);
}
.race-hero-athlete .athlete-name { flex: 1; min-width: 0; }
.race-hero-athlete .athlete-flt {
  background: #b91c1c;
  color: white;
  padding: 0.1rem 0.45rem;
  border-radius: 4px;
  font-size: 0.75rem;
}
.race-hero-athlete .athlete-tt {
  font-size: 0.75rem;
  color: var(--c-94a3b8);
}
.race-hero-athlete.athlete-status-dns,
.race-hero-athlete.athlete-status-dnf,
.race-hero-athlete.athlete-status-ral,
.race-hero-athlete.athlete-status-dsq,
.race-hero-athlete.athlete-status-dqb { opacity: 0.55; }
/* Wave 2.7.11: junior italic dropped (see .race-card-athlete note above). */

.race-hero-empty,
.race-hero-empty-row {
  text-align: center;
  padding: 2rem 1rem;
  color: var(--c-94a3b8);
}
.race-hero-empty-row { padding: 1rem; font-size: 0.9rem; }
.race-hero-empty .race-hero-next-hint {
  margin-top: 1rem;
  font-size: 0.9rem;
}

.race-card-empty {
  text-align: center;
  padding: 1.25rem 1rem;
  color: #64748b;
  font-size: 0.85rem;
  background: var(--c-1e293b);
  border-radius: 8px;
}

/* ─────────────────────────────────────────────────────────────────────
   Bottom dock
   ───────────────────────────────────────────────────────────────────── */

.site-dock {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  background: var(--c-1e293b);
  border-top: 1px solid var(--c-334155);
  display: flex;
  z-index: 99;
  padding-bottom: env(safe-area-inset-bottom, 0);
}
/* Tlačítka přizpůsobená šířce tabulky: max-width 900px (jako .site-main),
   centrovaná; band .site-dock zůstává full-width. Na užším viewportu (< 900)
   width:100% → tlačítka přes celou šířku jako dřív. */
.dock-inner {
  display: flex;
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
}
.dock-btn {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0.85rem 0;
  background: transparent;
  color: var(--c-94a3b8);
  text-decoration: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
  min-height: 56px;
}
.dock-btn-active { color: var(--accent); }
/* Live = živý přenos: ikona zčervená a halo prstenec pulzuje jako „radar
   ping" JEN když právě běží výsledky — třídu .dock-live-on nastavuje
   dock_live.js podle event.json.live_now. Bez ní Live drží normální barvu
   docku (šedá / aktivní modrá), prstenec je statický (opacity z SVG). */
/* Live tlačítko je v docku JEN když má co nabídnout — tedy když právě běží
   výsledky (dock_live.js nasadí .dock-live-on) nebo když na LIVE divák stojí.
   U závodu v přípravě i u dojetého vedlo na stránku s jedinou větou „právě se
   nezávodí"; puntík k tomu ještě sliboval dění. Skrýváme CSS, ne šablonou:
   tlačítko musí zůstat v DOM, jinak nemá dock_live.js z čeho vzít slug ani
   kde poznat, že závod naběhl. Ostatní ikony si šířku rozeberou samy
   (.dock-btn má flex: 1). */
.dock-btn[data-target="live"] { display: none; }
.dock-btn[data-target="live"].dock-live-on,
.dock-btn[data-target="live"].dock-btn-active { display: flex; }
.dock-btn[data-target="live"].dock-live-on { color: #ef4444; }
.dock-btn[data-target="live"].dock-live-on.dock-btn-active { color: #f87171; }
.dock-btn[data-target="live"].dock-live-on .dock-live-halo {
  transform-box: fill-box;
  transform-origin: center;
  animation: dock-live-ping 1.8s ease-out infinite;
}
@keyframes dock-live-ping {
  0%   { transform: scale(0.55); opacity: 0.7; }
  70%  { transform: scale(1.7);  opacity: 0; }
  100% { transform: scale(1.7);  opacity: 0; }
}
/* Respekt k uživatelům s omezeným pohybem — bez pingu, jen statický prstenec. */
@media (prefers-reduced-motion: reduce) {
  .dock-btn[data-target="live"].dock-live-on .dock-live-halo { animation: none; opacity: 0.5; }
}
.dock-btn[aria-disabled="true"] { opacity: 0.4; pointer-events: none; }
.dock-btn:active { background: var(--c-334155); }
/* Vlna 2 fáze B (B.2): inline SVG ikony, text popisky dropnuty. Velikost
   24×24 sedí na 56px dock-btn s vertikálním paddingem 0.85rem. */
.dock-icon-svg {
  width: 24px;
  height: 24px;
  display: block;
  stroke: currentColor;
}

/* ─────────────────────────────────────────────────────────────────────
   More menu (bottom sheet)
   ───────────────────────────────────────────────────────────────────── */

.more-menu-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.5);
  z-index: 200;
  opacity: 0;
  transition: opacity 0.2s;
}
body.more-menu-open .more-menu-overlay {
  opacity: 1;
}

.more-menu {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  background: var(--c-1e293b);
  border-radius: 16px 16px 0 0;
  z-index: 201;
  transform: translateY(100%);
  transition: transform 0.25s ease-out;
  padding-bottom: env(safe-area-inset-bottom, 0);
}
body.more-menu-open .more-menu {
  transform: translateY(0);
}
.more-menu-handle {
  width: 32px;
  height: 4px;
  background: var(--c-475569);
  border-radius: 2px;
  margin: 0.6rem auto;
}
.more-menu-content { padding: 0.5rem 0; }
.more-menu-item {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.85rem 1.25rem;
  color: var(--c-f1f5f9);
  text-decoration: none;
  font-size: 1rem;
}
.more-menu-item:active { background: var(--c-334155); }
.more-menu-icon {
  font-size: 1.25rem;
  width: 1.5em;
  text-align: center;
}
.more-menu-sep {
  margin: 0.5rem 1.25rem;
  border: none;
  border-top: 1px solid var(--c-334155);
}

/* ─────────────────────────────────────────────────────────────────────
   Athlete detail modal (long press)
   ───────────────────────────────────────────────────────────────────── */

.athlete-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.6);
  z-index: 300;
  animation: fade-in 0.2s ease-out;
}
.athlete-modal {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  background: var(--c-1e293b);
  border-radius: 16px 16px 0 0;
  padding: 0.5rem 1.25rem 2rem;
  z-index: 301;
  animation: slide-up 0.25s ease-out;
  padding-bottom: calc(2rem + env(safe-area-inset-bottom, 0));
}
.athlete-modal-handle {
  width: 32px;
  height: 4px;
  background: var(--c-475569);
  border-radius: 2px;
  margin: 0.5rem auto 1rem;
}
.athlete-modal h3 {
  margin: 0 0 0.85rem;
  font-size: 1.15rem;
  color: var(--c-f1f5f9);
}
.athlete-modal-meta {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 0.5rem 1rem;
  font-size: 0.95rem;
  margin: 0;
}
.athlete-modal-meta dt { color: var(--c-94a3b8); font-weight: 500; }
.athlete-modal-meta dd { margin: 0; color: var(--c-f1f5f9); }
.athlete-modal-note {
  color: var(--c-94a3b8);
  font-size: 0.9rem;
  font-style: italic;
}
@keyframes slide-up {
  from { transform: translateY(100%); }
  to   { transform: translateY(0); }
}
@keyframes fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ─────────────────────────────────────────────────────────────────────
   Wave 2.7.3: bracket mobile + TT mobile
   ───────────────────────────────────────────────────────────────────── */

/* Sub-header (kategorie + dropdown) — sdíleno bracket + TT */
.bracket-subheader, .tt-subheader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.6rem 0.75rem 0.4rem;
  background: var(--c-0f172a);
  border-bottom: 1px solid var(--c-1e293b);
}
.bracket-cat-title, .tt-cat-title {
  margin: 0;
  font-size: 1rem;
  color: var(--c-f1f5f9);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bracket-cat-switcher, .tt-cat-switcher { position: relative; flex-shrink: 0; }
.cat-switch-btn {
  background: var(--c-1e293b);
  color: var(--c-f1f5f9);
  border: 1px solid var(--c-334155);
  padding: 0.35rem 0.7rem;
  border-radius: 6px;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
}
.cat-switch-menu {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  background: var(--c-1e293b);
  border: 1px solid var(--c-334155);
  border-radius: 8px;
  list-style: none;
  margin: 0;
  padding: 0.25rem 0;
  min-width: 200px;
  max-width: calc(100vw - 1.5rem);
  z-index: 50;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}
.cat-switch-menu li { margin: 0; padding: 0; }
.cat-switch-item {
  display: block;
  padding: 0.6rem 1rem;
  color: var(--c-f1f5f9);
  text-decoration: none;
  font-size: 0.9rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cat-switch-item.active { color: var(--accent); font-weight: 600; }
.cat-switch-item:active { background: var(--c-334155); }

/* Phase strip (sticky tab bar) */
.phase-strip {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  position: sticky;
  top: 48px;
  z-index: 90;
  background: var(--c-1e293b);
  border-bottom: 1px solid var(--c-334155);
  /* celý strip (pozadí + spodní linka) na šířku karet rozjížděk — margin
     (ne padding), aby barevný pruh nebyl širší než karty. .bracket-races má
     padding 0.5rem, takže margin 0.5rem srovná okraje. */
  margin: 0 0.5rem;
}
.phase-tab {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  padding: 0.6rem 0.25rem;
  color: var(--c-94a3b8);
  text-decoration: none;
  font-weight: 600;
  font-size: 0.85rem;
  border-bottom: 2px solid transparent;
}
/* Globální a:hover podtrhává — u tlačítek fáze ho potlačíme i v hover/focus
   (text-decoration:none v base stavu sám hover/focus nepokryje). */
.phase-tab:hover,
.phase-tab:focus { text-decoration: none; }
.phase-tab-current {
  color: var(--accent);
  border-bottom-color: var(--accent);
}
.phase-tab-done { color: #4ade80; }
.phase-tab-current.phase-tab-done {
  color: #4ade80;
  border-bottom-color: #4ade80;
}
.phase-tab-dot {
  display: inline-block;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--accent);
  animation: live-pulse 1.5s ease-in-out infinite;
}
.phase-tab-short { line-height: 1; }

/* Bracket race cards */
.bracket-races {
  padding: 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.bracket-race-card {
  background: var(--c-1e293b);
  border-radius: 8px;
  /* Barevné orámování podle stavu — stejná konvence jako karty Live
     (active=červená, done=zelená, pending=modrá). box-sizing: border-box,
     padding kompenzuje 1px border, aby obsah nedrkal. */
  border: 1px solid var(--accent); /* default = pending (modrá), tenká čára */
  padding: calc(0.65rem - 1px) calc(0.75rem - 1px);
}
/* Běžící jízda zvýrazněna červeně — tenký rámeček + pulzující červený glow,
   aby okamžitě upoutala (auto-refresh ji překreslí po dojetí). */
.bracket-race-card.status-active {
  border-color: #ef4444;
  animation: bracket-active-pulse 1.6s ease-in-out infinite;
}
@keyframes bracket-active-pulse {
  0%, 100% { box-shadow: 0 0 0 1px #ef4444, 0 0 5px rgba(239, 68, 68, 0.30); }
  50%      { box-shadow: 0 0 0 1px #ef4444, 0 0 12px rgba(239, 68, 68, 0.60); }
}
.bracket-race-card.status-done   { border-color: #4ade80; } /* zelená */
/* Předstart: rámeček zůstává jako u připravené (výchozí akcent), jen štítek. */
.bracket-race-card.status-prestart .bracket-race-status {
  color: var(--accent);
  font-weight: 600;
}
/* Živý blok běžící jízdy nemá mít vlastní (vnitřní) rámeček — barevný rámeček
   nese jen vnější karta podle stavu. Strhneme chrome jako u Live hero. */
.bracket-race-card .live-current-heat {
  border: none;
  background: transparent;
  padding: 0;
  margin: 0;
  box-shadow: none;
}
.bracket-race-header {
  display: flex;
  justify-content: space-between;
  align-items: center;          /* vycentruje název + gate bar + status/puntík */
  gap: 0.5rem;
  margin-bottom: 0.4rem;
  font-size: 0.9rem;
}
.bracket-race-name { font-weight: 600; color: var(--c-f1f5f9); flex-shrink: 0; }
/* Běžící jízda: gate bar sedí hned za názvem, status/puntík vpravo (jako hero). */
.bracket-race-header .live-gates { margin-right: auto; }
.bracket-race-status { font-size: 0.78rem; color: var(--c-94a3b8); }
/* Název jízdy + její startovní čas jako JEDEN prvek hlavičky — hlavička je
   flex se `space-between` a za názvem jede u běžící jízdy gate bar, takže
   samostatný čas by se rozestupem odplavil doprostřed. */
.bracket-race-title {
  display: flex;
  align-items: baseline;
  gap: 0.45rem;
  flex-shrink: 0;
}
/* Čas tlumeně — dominantní zůstává název jízdy (QF1 …). */
.bracket-race-time {
  font-weight: 400;
  font-size: 0.78rem;
  color: var(--c-94a3b8);
  font-variant-numeric: tabular-nums;
}
.bracket-race-card.status-active .bracket-race-status {
  color: var(--accent);
  font-weight: 600;
}
.bracket-race-card.status-done .bracket-race-status { color: #4ade80; }
.bracket-race-athletes {
  list-style: none;
  margin: 0;
  padding: 0;
}
.bracket-race-athlete {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  padding: 0.32rem 0;
  font-size: 0.88rem;
  border-bottom: 1px solid var(--c-334155);
}
.bracket-race-athlete:last-child { border-bottom: none; }
.bracket-race-athlete .athlete-pos {
  display: inline-block;
  width: 1.5rem;
  font-weight: 700;
  color: var(--accent);
  flex-shrink: 0;
}
.bracket-race-athlete .athlete-name {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--c-cbd5e1);
}
.bracket-race-athlete .athlete-flt {
  background: #b91c1c;
  color: white;
  padding: 0.1rem 0.4rem;
  border-radius: 4px;
  font-size: 0.7rem;
  flex-shrink: 0;
}
.bracket-race-athlete.status-dns,
.bracket-race-athlete.status-dnf,
.bracket-race-athlete.status-ral,
.bracket-race-athlete.status-dsq,
.bracket-race-athlete.status-dqb { opacity: 0.55; }
/* Wave 2.7.11: junior italic dropped from the bracket card too. */

.bracket-empty {
  padding: 2.5rem 1rem;
  text-align: center;
  color: var(--c-94a3b8);
}

/* TT mobile rows */
.tt-mobile { padding: 0; }
.tt-section-title {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--c-94a3b8);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 0.6rem 0.75rem 0.3rem;
  margin: 0;
  background: var(--c-0f172a);
  position: sticky;
  top: 48px;
  z-index: 50;
}
.tt-on-course {
  background: var(--c-0c1a2e);
  border-bottom: 2px solid var(--accent);
}
.tt-on-course .tt-section-title {
  color: var(--accent);
  background: var(--c-0c1a2e);
}
.tt-rows {
  list-style: none;
  margin: 0;
  padding: 0;
}
.tt-row {
  display: grid;
  grid-template-columns: 2.5rem 1fr auto 2.5rem;
  gap: 0.5rem;
  /* Vertikální zarovnání: center, NE baseline. Řádek míchá různé velikosti
     písma (běžící hodiny 1.05rem vs STČ 0.85rem) a badge s vlastním
     paddingem (FLT) — baseline pak sráží text k horní hraně řádku a posun
     kolísá řádek od řádku (nejvíc u live řádku v Pořadí, kde FLT badge má
     border). center drží text opticky uprostřed nezávisle na obsahu. */
  align-items: center;
  padding: 0.3rem 0.75rem;
  border-bottom: 1px solid var(--c-1e293b);
  font-size: 0.92rem;
}
/* STČ na trati BEZ vlastní velikosti — stejný důvod jako u žebříčku níž
   (dědí 0.92rem z .tt-row, ztlumení drží barva). */
.tt-row-on-course .tt-row-stc {
  color: var(--c-94a3b8);
  font-weight: 600;
}
/* Pořadí + STČ v žebříčku BEZ vlastní velikosti — dědí 0.92rem z .tt-row,
   tj. stejně velké jako jméno a čas. Dřív 0.85rem: identifikační sloupce
   byly proti zbytku řádku viditelně menší a v nejhustším řádkování
   (data-density="compact", root 13.5px) klesly na ~11.5px proti 12.4px
   jména. Ztlumené zůstávají barvou (--c-94a3b8), ne velikostí.
   Mobil (<720px) je řešený zvlášť — tam se zmenšuje celý řádek. */
.tt-row-ranking .tt-row-rank,
.tt-row-ranking .tt-row-stc {
  color: var(--c-94a3b8);
  font-weight: 600;
}
.tt-row-ranking {
  /* Vlna 1 fáze A: 6 slotů — rank | stc | name | time | diff | flt.
     Pevné šířky Čas/Rozdíl (sjednoceno s base.css) — auto by zlomilo
     sloupcové zarovnání desetinných teček mezi řádky. */
  grid-template-columns: 2.5rem 2.5rem 1fr 4.5rem 3.5rem 2.5rem;
}
.tt-row-startlist {
  grid-template-columns: 2.5rem 1fr auto;
}
.tt-row-startlist .tt-row-time {
  text-align: right;
}
.tt-row-name {
  font-weight: 500;
  color: var(--c-f1f5f9);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tt-row-time {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: var(--c-cbd5e1);
}
.tt-row-on-course .tt-row-time { color: var(--accent); }
/* Vlna 3 (C.1, K3): viz base.css — žluté plné pozadí, černá číslice,
   inline-flex centering + line-height:1 + symetric padding (fix
   asymetrického místa kolem číslice v default line-boxu 1.4). */
.tt-row-flt {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  background: var(--c-facc15);
  color: var(--c-0a0a0a);
  padding: 0.2rem 0.4rem;
  border-radius: 4px;
  font-size: 0.72rem;
  font-weight: 700;
  white-space: nowrap;
}
.tt-row-flt-empty {
  color: var(--c-475569);
  text-align: center;
  font-size: 0.85rem;
}
.tt-row.status-dnf, .tt-row.status-dns, .tt-row.status-ral,
.tt-row.status-dsq, .tt-row.status-dqb { opacity: 0.55; }
.tt-row.status-dnf .tt-row-time,
.tt-row.status-dns .tt-row-time,
.tt-row.status-ral .tt-row-time,
.tt-row.status-dsq .tt-row-time,
.tt-row.status-dqb .tt-row-time { color: #f87171; }
.tt-empty {
  padding: 1.5rem 1rem;
  text-align: center;
  color: #64748b;
}

/* ─────────────────────────────────────────────────────────────────────
   Wave 2.7.19: latest finisher highlight in mobile ranking — mirrors
   desktop Wave 2.4.11 (.dump-table tbody tr[data-latest-finisher='1']).
   Persistent green tint + 4px-equivalent left accent (3px on mobile,
   proportional to narrower viewport) + 2s pulse on 0→1 transition.
   ───────────────────────────────────────────────────────────────────── */

.tt-row-ranking[data-latest-finisher="1"] {
  background-color: rgba(34, 197, 94, 0.18);
  box-shadow: inset 3px 0 0 #22c55e;
  transition: background-color 0.5s ease-out;
}

@keyframes latest-finisher-pulse-mobile {
  0%   { background-color: rgba(34, 197, 94, 0.55); }
  50%  { background-color: rgba(34, 197, 94, 0.35); }
  100% { background-color: rgba(34, 197, 94, 0.18); }
}

.tt-row-ranking.latest-finisher-pulse {
  animation: latest-finisher-pulse-mobile 2s ease-out;
}

/* Defensive: latest-finisher cannot be DNF/DNS/RAL by server logic
   (server only flags rows with finish_time), but if data shape ever
   changes keep the disqualified red coloring visually dominant. */
.tt-row-ranking.status-dnf[data-latest-finisher="1"],
.tt-row-ranking.status-ral[data-latest-finisher="1"],
.tt-row-ranking.status-dns[data-latest-finisher="1"],
.tt-row-ranking.status-dsq[data-latest-finisher="1"],
.tt-row-ranking.status-dqb[data-latest-finisher="1"] {
  background-color: rgba(239, 68, 68, 0.12);
  box-shadow: inset 3px 0 0 #ef4444;
}

/* ─────────────────────────────────────────────────────────────────────
   Wave 2.7.17: mobile NA TRATI scoreboard look — sjednoceno s desktop
   Wave 2.7.16. Stejná paleta (var(--c-facc15) na var(--c-0a0a0a)), modern monospace
   stack, glow effect na running clocku. Scaled-down padding/font pro
   mobile viewport. ID-scoped (1,0,0) — beats existing .tt-on-course
   class rules (0,1,0) bez !important. Pre-Wave-2.7.17 tu byla sky-blue
   paleta (var(--c-0c1a2e) bg + var(--accent) border + var(--accent) clock); FLT badges
   byly red (#b91c1c) — všechno teď unified yellow.
   Scope: jen #tt-on-course (mobile POŘADÍ + race-strip beze změny;
   .tt-row grid layout zachován — overridujeme jen colors/font/border).
   ───────────────────────────────────────────────────────────────────── */

#tt-on-course {
  background: var(--c-0a0a0a);
  border: 2px solid var(--c-facc15);
  border-radius: 8px;
  padding: 0.5rem;
  margin-bottom: 1rem;
  /* Vlna 2 fáze B (B.1): scoreboard zafixován pod sticky .site-header.
     Header drží banner + pás kategorií nahoře (site-header je sticky
     top:0 z Wave 2.7.x — neměníme ho), scoreboard sticky-uje s offsetem
     = reálná výška headeru. CSS proměnnou --mobile-header-h publikuje
     tt_sticky.js (ResizeObserver na .site-header). Fallback 132px
     kryje obvyklou výšku TT live headeru (banner 64 + cat-tabs ~44 +
     padding ~16 + gap ~6 + border 1).
     z-index: 50 — pod header (z-index 100), nad běžný obsah; při
     teoretickém vizuálním překryvu header vyhrává a yellow border
     scoreboardu neprosvítá.
     Stuck-state stín jen směrem dolů (negative spread + offset),
     dekorativně odděluje sticky chrome od scrollujícího pořadí. */
  position: sticky;
  top: var(--mobile-header-h, 132px);
  z-index: 50;
  box-shadow: 0 6px 12px -4px rgba(0, 0, 0, 0.65);
}

/* #tt-on-course[hidden] (= on_course prázdné) zruší display:block →
   display:none. Sticky se nemá kde projevit, žádná kolize. Pojistka
   pro jistotu, kdyby budoucí CSS reset hidden override: */
#tt-on-course[hidden] { display: none; }

/* Wave 2.7.18: #tt-on-course .tt-section-title rule removed — the
   <h3> element itself is gone (dropped in tt_mobile.html). */

/* Optická korekce: obsah o ~1px níž. align-items: center vystředí BOXY,
   jenže ink písma sedí v line-boxu výš — pod účařím je vyhrazené místo pro
   dolní dotažnice, které STČ/jméno/hodiny nemají. Text pak opticky visí
   u horní hrany černého panelu (měřeno po pixelech: 5,3 px nad inkem vs
   7,4 px pod ním). Padding 0.36rem nahoře / 0.24rem dole — součet zůstává
   0.6rem, výška řádku se nemění. */
#tt-on-course .tt-row {
  background: transparent;
  color: var(--c-facc15);
  font-family: ui-monospace, "SF Mono", Monaco, "Cascadia Code",
               "Roboto Mono", Consolas, "Liberation Mono",
               "Courier New", monospace;
  font-weight: 700;
  border-bottom: 1px dashed rgba(250, 204, 21, 0.2);
  padding: 0.36rem 0.25rem 0.24rem;
}

#tt-on-course .tt-row:last-child {
  border-bottom: none;
}

/* STČ na LED tabuli ve velikosti řádku (dědí 0.92rem z .tt-row) — dřív
   0.85rem, což v nejhustším řádkování (root 13.5px) dávalo 11.5px proti
   12.4px jména; startovní číslo bylo viditelně menší než zbytek řádku.
   Odlišuje ho světlejší žlutá (--c-fde047), ne velikost. Běžící hodiny
   zůstávají větší (1.05rem) — ty jsou ohnisko tabule.
   Stejné pravidlo má .gm-stc v .time-live-board (časové disciplíny).
   Zarovnání doprava: jednotky startovních čísel lícují pod sebou
   (tabular-nums) — sloupec drží grid `.tt-row` (2.5rem), takže stačí
   text-align. V žebříčku a startovce zůstává STČ vycentrované, tam je to
   sloupec tabulky s hlavičkou; tady jde o LED tabuli. */
#tt-on-course .tt-row-stc {
  color: var(--c-fde047);
  font-weight: 700;
  text-align: right;
}

#tt-on-course .tt-row-name {
  color: var(--c-facc15);
  font-weight: 700;
}

/* Running clock — focal point: bigger, glow, tabular-nums. */
#tt-on-course .tt-row-on-course .tt-row-time {
  color: var(--c-facc15);
  font-size: 1.05rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.03em;
  text-shadow: 0 0 5px rgba(250, 204, 21, 0.4);
  white-space: nowrap;
}

/* Vlna 3 (C.1, K3): scoreboard FLT badge — sjednocený s globálním
   .tt-row-flt (žluté plné pozadí, černá číslice, inline-flex centering
   dědí). Dřív transparentní s žlutým borderem. Padding přepisujeme
   pro scoreboard font-size (0.78rem) a větší font-weight. */
#tt-on-course .tt-row-flt {
  background: var(--c-facc15);
  color: var(--c-0a0a0a);
  padding: 0.2rem 0.4rem;
  border-radius: 3px;
  font-size: 0.78rem;
  font-weight: 800;
}

#tt-on-course .tt-row-flt-empty {
  color: #78716c;
  font-size: 0.78rem;
}

/* ─────────────────────────────────────────────────────────────────────
   Wave 2.7.5: tap target floor (Apple HIG ≥44×44px)
   Visual size unchanged where possible — padding/min-height expands the
   tap zone without changing layout flow.
   ───────────────────────────────────────────────────────────────────── */

.cat-switch-btn {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

.cat-switch-item {
  /* Wave 2.7.20: revert display from flex back to block. Wave 2.7.5
     set flex+align-items:center for the 44×44px tap target, but the
     <a class="cat-switch-item"> contains multi-line whitespace from
     Jinja loop indentation — flex layout treats whitespace text
     nodes as flex items, and the first item's real text rendered
     invisibly. Block + min-height + padding + line-height satisfies
     the 44px tap target without the flex whitespace quirk. The
     base rule at line ~597 already sets display: block; this
     override now keeps it block while bumping the tap zone.
     Tap math: padding 0.7rem (×2 ≈ 22px) + 0.9rem text × line-height
     1.6 ≈ 22px → ≈ 66px ≥ 44px ✓ */
  display: block;
  min-height: 44px;
  padding: 0.7rem 1rem;
  line-height: 1.6;
}

.phase-tab {
  min-height: 44px;
  /* phase-tab is already display:flex with align-items:center — just floor it */
}

/* dock-btn already ~56px (icon + label rows). live-badge stays 36px (informational). */

/* ─────────────────────────────────────────────────────────────────────
   Wave 2.7.5: athlete modal close button
   ───────────────────────────────────────────────────────────────────── */

.athlete-modal { position: fixed; }  /* re-affirm; existing rule already sets this */
.athlete-modal-close {
  position: absolute;
  top: 0.4rem;
  right: 0.4rem;
  background: transparent;
  border: none;
  color: var(--c-94a3b8);
  font-size: 1.6rem;
  line-height: 1;
  width: 44px;
  height: 44px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: inherit;
  border-radius: 50%;
}
.athlete-modal-close:hover { color: var(--c-f1f5f9); }
.athlete-modal-close:active { background: rgba(255, 255, 255, 0.08); }

/* ─────────────────────────────────────────────────────────────────────
   Wave 2.7.5: connection status badge (mobile — slot in site-header)
   ───────────────────────────────────────────────────────────────────── */

.connection-status {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-left: auto;
  margin-right: 0.5rem;
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 600;
  background: var(--c-1e293b);
  color: var(--c-f1f5f9);
  white-space: nowrap;
  transition: opacity 0.3s, background 0.2s;
}
.connection-status[hidden] { display: none; }
.connection-status .connection-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #4ade80;
}
.connection-status-stale {
  background: #78350f;
  color: #fed7aa;
}
.connection-status-stale .connection-dot {
  background: #fb923c;
  animation: live-pulse 1.5s ease-in-out infinite;
}
.connection-status-offline {
  background: #7f1d1d;
  color: #fee2e2;
}
.connection-status-offline .connection-dot {
  background: #ef4444;
}
.connection-status-recovered {
  background: #14532d;
  color: #d1fae5;
}
.connection-status-recovered .connection-dot {
  background: #4ade80;
}

/* ─────────────────────────────────────────────────────────────────────
   Wave 2.7.11: lane-dot + BIB shared between hero (done state) and
   compact race cards. Selectors target the dot directly via
   .lane-dot.lane-{color} so they do not collide with the existing
   .live-current-heat .lane-{color} .lane-dot rules in base.css (those
   put the lane class on the parent <li>, this puts it on the dot).
   ───────────────────────────────────────────────────────────────────── */

.race-hero-athletes .lane-dot,
.race-card-athletes .lane-dot,
.bracket-race-athletes .lane-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.lane-dot.lane-red    { background: #ef4444; }
.lane-dot.lane-green  { background: #22c55e; }
.lane-dot.lane-blue   { background: #3b82f6; }
.lane-dot.lane-yellow { background: #eab308; }
.lane-dot.lane-gray   { background: #6b7280; } /* fallback when bib_color missing */

.race-hero-athlete .athlete-bib,
.race-card-athlete .athlete-bib,
.bracket-race-athlete .athlete-bib {
  font-family: ui-monospace, "Courier New", monospace;
  font-size: 0.78rem;
  color: var(--c-94a3b8);
  font-variant-numeric: tabular-nums;
  min-width: 1.4rem;
  text-align: right;
}

/* ─────────────────────────────────────────────────────────────────────
   Site footer — jen landing page (© results.cz <rok> | ver. X.YY)
   ───────────────────────────────────────────────────────────────────── */
.site-footer {
  /* Spodní padding respektuje safe-area (home indicator / spodní lišta
     prohlížeče na mobilu) — bez toho text končí přesně pod ní. */
  padding: 1.5rem 1rem calc(1rem + env(safe-area-inset-bottom, 0px));
  text-align: center;
  font-size: 0.78rem;
  color: var(--c-94a3b8);
}


/* ── Publikované PDF dokumenty (SL/VL/TT) — Wave PDF docs ── */
/* Ikony dokumentů zarovnané zleva (řádky začínají na stejném místě a plní se
   doprava); první chip flush s hlavičkou „Dokumenty". */
.col-docs { width: 1%; white-space: nowrap; text-align: left; }
.col-docs .doc-chip:first-child { margin-left: 0; }
.doc-chip {
  display: inline-block; padding: 2px 9px; margin-left: 4px;
  border: 1px solid var(--card-border); border-radius: 99px;
  font-size: 11px; font-weight: 700; letter-spacing: .4px;
  color: var(--muted); line-height: 1.5;
  background: var(--card-bg);
}
.doc-chip:hover { border-color: var(--accent); color: var(--accent); text-decoration: none; }
/* chip v pásu kategorií (startovka/tt/pavouk) — drží se vpravo za taby.
   margin-right 0: poslední chip na pravém okraji obsahu pásu = svisle pod
   ikonou režim (theme-toggle) v hlavičce. */
.doc-chip--tabs { flex: 0 0 auto; margin-left: 8px; margin-right: 0; }

.doc-chip--mid { margin-right: 0; }

.doc-chip { display: inline-flex; align-items: center; justify-content: center; padding: 3px 7px; }
.doc-chip-ico { width: 15px; height: 15px; display: block; }
/* Fázový odznak (Σ/A/B/K/1/2) na tlačítkách přepínače POHLEDU — drží stejnou
   výšku jako ikonové chipy (15px box). Odkazy na PDF nesou vždy jen ikonu. */
.doc-chip--phase { min-width: 15px; }
.doc-chip-lbl {
  display: block; min-width: 13px; height: 15px; line-height: 15px;
  text-align: center; font-size: 12px; font-weight: 700; letter-spacing: .2px;
}
/* Odznak formátu („PDF" / „PDF+" / „XLS" / „XML") — tři až čtyři znaky místo
   jednoho, takže menší písmo a bez minimální šířky; jinak by chip vyrostl
   o polovinu proti sousedním ikonovým. */
.doc-chip-lbl--fmt { min-width: 0; font-size: 10px; letter-spacing: .3px; }

/* Segmentovaná skupina PDF odkazů (SL/VL fáze) v pásu kategorií — kompaktní
   „přepínač" ve stejném vizuálním jazyce jako segment-control kategorií
   (.tt-cat-tabs) a přepínač jízd v KXRS. Jednotlivé chipy (.doc-chip--tabs, jen
   v tomto pásu) splývají do jedné pilulky oddělené svislítkem; skupina nese
   rámeček i zaoblení. Šetří šířku → vejde se vedle tabů kategorií i na mobilu. */
.tt-doc-switch {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: stretch;
  margin-left: 8px;
  border: 1px solid var(--c-334155);
  border-radius: 6px;
  overflow: hidden;
}
.tt-doc-switch .doc-chip--tabs {
  margin: 0;
  min-height: 30px;
  border: none;
  border-radius: 0;
  background: transparent;
  color: var(--c-cbd5e1);
}
.tt-doc-switch .doc-chip--tabs + .doc-chip--tabs {
  border-left: 1px solid var(--c-334155);
}
.tt-doc-switch .doc-chip--tabs:hover {
  background: rgba(255, 255, 255, 0.08);
  color: var(--c-f1f5f9);
  border-color: var(--c-334155);   /* neztrácej svislítko při hoveru */
}
.tt-doc-switch .doc-chip-ico { color: var(--c-cbd5e1); }

/* ── Fázový přepínač POHLEDU — vlastní řádek pod pásem kategorií ──────────
   Dřív to byla úzká segmentovaná pilulka se čtyřmi ZNAKY (Σ · A · B · K)
   přilepená napravo k tabům kategorií. Vypadala jako další kategorie, „Σ" se
   nedalo přečíst a řada nic neříkala o tom, kde závod je. Teď má vlastní band,
   celá slova a stav fáze. Pilulka (.tt-doc-switch) tu ZÁMĚRNĚ není — segmenty
   splývající do jednoho bloku fungují pro jednoznakové značky, ne pro slova. */
.tt-phase-strip {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  /* stejné prolomení paddingu hlavičky jako .tt-cat-tabs-strip (band až k okraji) */
  margin: 0 -0.75rem;
  padding: 0.32rem 1.5rem;
  background: var(--c-0f172a);
  border-top: 1px solid var(--c-243245);
  /* Slova zaberou víc místa než značky. Když se nevejdou, pás se posouvá
     vodorovně sám v sobě — stránka se nesmí rozjet do strany. */
  overflow-x: auto;
  scrollbar-width: none;
}
.tt-phase-strip::-webkit-scrollbar { display: none; }
.tt-phase-switch {
  display: flex; align-items: center; gap: 0.3rem; flex: 1 1 auto;
}
.phase-chip {
  flex: 0 0 auto;
  display: inline-flex; align-items: center; gap: 0.28rem;
  min-height: 26px; padding: 0.18rem 0.5rem;
  border: 1px solid var(--c-334155); border-radius: 5px;
  background: transparent; color: var(--c-94a3b8);
  font: inherit; font-size: 0.78rem; font-weight: 600;
  white-space: nowrap; cursor: pointer;
}
.phase-chip-lbl { display: block; line-height: 1.2; }
.phase-view-btn:hover {
  background: rgba(255, 255, 255, 0.07);
  color: var(--c-f1f5f9);
}
/* Odjetá fáze — zaškrtnutí, text plnou barvou (dá se přečíst, že už je hotová). */
.phase-chip-tick { width: 11px; height: 11px; color: #22c55e; flex: 0 0 auto; }
.phase-view-btn:has(.phase-chip-tick) { color: var(--c-cbd5e1); }
/* Fáze, kam právě tečou časy. */
.phase-chip-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--accent, #0a9fb4); flex: 0 0 auto;
}
.phase-chip.is-live { color: var(--c-f1f5f9); border-color: var(--accent, #0a9fb4); }
@media (prefers-reduced-motion: no-preference) {
  .phase-chip-dot { animation: phase-live-pulse 1.8s ease-in-out infinite; }
}
@keyframes phase-live-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }
/* Vybraný pohled. */
.phase-chip.is-active {
  background: var(--c-334155); border-color: var(--c-475569);
  color: var(--c-f1f5f9);
}
.phase-chip.is-active:hover { background: var(--c-334155); }
/* Ohlášená, ale zatím neodjetá fáze — ztlumeně a bez kurzoru: panel nemá,
   kliknout na ni nejde. Zůstává vidět, aby divák znal členění celého dne. */
.phase-chip--soon {
  border-style: dashed; opacity: 0.55; cursor: default;
}
/* PDF právě zobrazené fáze — poslední ikona skupiny, odsazená doprava.

   Pravá hrana ikony lícuje s TABULKOU VÝSLEDKŮ. Pás se centruje na jiný
   sloupec než obsah stránky (924px vs. `.site-main` 900px, ze kterého si
   `.time-page` a `.time-table-wrap` ukrojí po 16 a 8 px), takže bez dorovnání
   ikona přečnívala o 36 px. Rozdíl není konstanta: nad 956 px je content box
   pásu konstantních 924 px → 36 px; mezi 900 a 956 px padding pásu leží na
   podlaze 1rem a rozdíl klesá lineárně na 8 px; pod 900 px se `.site-main`
   přestane centrovat a drží 8 px. Všechny tři úseky pokryje jeden clamp
   (`50%` se u marginu počítá z content boxu pásu, tedy W = 924 nahoře a
   viewport−32 dole). Ověřeno měřením na 12 šířkách 720–1920 px, odchylka 0. */
.tt-phase-switch .tt-phase-pdf {
  display: inline-flex; align-items: stretch; margin-left: auto;
  padding-left: 0.4rem;
  margin-right: 0;
}
@media (min-width: 720px) {
  .tt-phase-switch .tt-phase-pdf { margin-right: clamp(8px, 50% - 426px, 36px); }
}
.tt-phase-switch .tt-phase-pdf[hidden] { display: none; }
/* [hidden] samo nestačí — .tt-doc-switch má explicitní display (inline-flex),
   který by ho přebil. Fáze bez publikovaného PDF tak ikonu opravdu skryje. */
.tt-doc-switch[hidden] { display: none; }

/* Mobil (<720px): čtyři slova na úzký displej. Zúžíme band i odznaky; co se
   přesto nevejde, dojede vodorovným scrollem uvnitř pásu a na vybranou fázi
   doskroluje phase_view.js.
   POZOR: tenhle blok musí stát AŽ ZA základními pravidly .phase-chip výš —
   media query nezvyšuje specificitu, takže o výsledku rozhoduje pořadí. Když
   byl nahoře u ostatních mobilních pravidel pásu kategorií, neplatil vůbec. */
/* Desktop (≥720px): obsah pásu se centruje do TÉHOŽ 900px sloupce jako pás
   kategorií nad ním a tabulka pod ním — táž formule jako u .tt-cat-tabs-strip
   (oba pásy mají shodnou geometrii: breakout margin -0.75rem a stejného
   rodiče), takže první fázový odznak lícuje s první kategorií a ikona tisku
   (drží se `margin-left:auto`) sedí na pravé hraně tabulky. Bez toho pás
   začínal na holém paddingu bandu, tj. u levého okraje obrazovky — na 1920px
   o 434 px vlevo od kategorií.
   POZOR na pořadí: základní `.tt-phase-strip` výš nastavuje `padding`
   ZKRATKOU, takže tenhle blok musí stát ZA ní. V bloku u ostatních mobilních
   pravidel pásu kategorií (o ~1700 řádků výš) by ho zkratka přebila —
   media query specificitu nezvyšuje. */
@media (min-width: 720px) {
  .tt-phase-strip {
    padding-left: max(1rem, (100% - 900px) / 2);
    padding-right: max(1rem, (100% - 900px) / 2);
  }
}
@media (max-width: 719px) {
  /* Odstup od okraje týž jako u pásu kategorií (1.5rem), aby první odznak
     lícoval s první kategorií nad ním — jako na desktopu. Co se nevejde,
     dojede scrollem uvnitř pásu. */
  .tt-phase-strip { gap: 0.22rem; }
  .phase-chip { font-size: 0.66rem; padding: 0.16rem 0.28rem; gap: 0.18rem; }
  .phase-chip-tick { width: 9px; height: 9px; }
  .phase-chip-dot { width: 6px; height: 6px; }
  .tt-phase-switch .tt-phase-pdf { padding-left: 0.2rem; }
  .tt-phase-switch .tt-phase-pdf .doc-chip { padding: 3px 4px; }
}

/* odkaz na propozice závodu v hlavičce — ikona */
.site-propositions {
  display: inline-flex; align-items: center; justify-content: center;
  margin-left: 0.5rem; flex-shrink: 0; text-decoration: none;
  width: 30px; height: 30px; border-radius: 50%;
  color: var(--accent, #0a9fb4); border: 1px solid currentColor;
}
.site-propositions svg { width: 17px; height: 17px; }
.site-propositions:hover { background: var(--accent, #0a9fb4); color: #fff; }
/* mobilní karta — řádek s doc ikonami */
/* `wrap`, protože sedm chipů chystaného závodu se na úzký displej do jednoho
   řádku nevejde. Naměřeno: bez zalomení přeteče výsledková listina o okraj
   karty na 320px displeji (321 px proti 304 px); s ním nepřetéká nic ani
   na 320, ani na 390 px. Netýká se to jen odznaků formátu — přetéká to
   i se samými ikonovými chipy. Chip se nesmí
   smrsknout (`flex-shrink: 0`): zúžený by ořízl text přípony místo aby se
   zalomil. Odsazení řádků je menší než mezera mezi chipy, ať se dvojřádek
   čte jako jeden blok. */
.event-mobile-card-docs {
  grid-column: 1 / -1; display: flex; flex-wrap: wrap;
  gap: 0.3rem 0.45rem; margin-top: 0.4rem;
}
.event-mobile-card-docs .doc-chip { flex: 0 0 auto; }
a.event-mobile-card-name { color: inherit; text-decoration: none; }

/* ===== Shluk ovládacích prvků hlavičky (hustota / motiv / jazyk) =====
   Tři přepínače drží pohromadě u pravého okraje s minimální mezerou — vodorovně
   zabírají co nejmíň, aby zbylo místo na název závodu. Zužujeme jen ŠÍŘKY
   (ikony 28px místo 38px, užší pilulka jazyka, gap 2px); výšku tap-targetu
   držíme na 38px (a11y) — svisle stejně nic nekrade. */
.header-tools {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 2px;
  /* landing (bez event-line s flex:1) — odtlač shluk k pravému okraji */
  margin-left: auto;
}

/* ===== Přepínač světlý/tmavý motiv ===== */
.theme-toggle {
  flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 38px; padding: 0;
  background: transparent; border: none; cursor: pointer;
  color: var(--c-94a3b8);
}
.theme-toggle:hover { color: var(--c-f1f5f9); }
.theme-toggle svg { width: 19px; height: 19px; }
.theme-toggle .icon-moon { display: none; }
:root[data-theme="light"] .theme-toggle .icon-sun { display: none; }
:root[data-theme="light"] .theme-toggle .icon-moon { display: inline; }

/* Přepínač hustoty řádkování — vícestavová ikona jako v KXRS (tři vodorovné
   čáry, jejichž hustotu JS mění dle režimu). Ikonový button vedle přepínače
   motivu. Klik cykluje Kompaktní → Normální → Vzdušné. */
.density-toggle {
  flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 38px; padding: 0;
  background: transparent; border: none; cursor: pointer;
  color: var(--c-94a3b8);
}
.density-toggle:hover { color: var(--c-f1f5f9); }
.density-toggle svg { width: 19px; height: 19px; }

/* Hustota řádkování — tři úrovně jako v KXRS. „Normální" = základní pravidla
   bez atributu; „compact" zhustí a „airy" rozvolní svislé rozestupy. Cílí
   startovku/TT/pořadí (.tt-row), výsledkové tabulky časových disciplín
   (.time-table) i karty konečných výsledků (.race-card-athlete) na Live.
   Vyšší specificita (:root[...] .selektor) přebíjí i mobilní @media varianty.

   Kromě svislých rozestupů mění režim i velikost písma: kořenové `font-size`
   (base `html { font-size: 16px }`) škáluje všechny rem hodnoty naráz —
   fonty i rem-based šířky gridů/sloupců, takže nic nepřeteče ani neuřízne.
   Vzdušné = větší písmo (čitelné z dálky na plátně/tabuli), kompaktní = menší
   (víc řádků na obrazovku). Media queries se neposouvají — `px`/`em` v MQ se
   počítají z výchozí velikosti dokumentu, ne z této.

   Na mobilu je vzdušný krok menší (17px): výsledková tabulka se tam vejde na
   šířku jen tak tak, plných 18px by ji poslalo do vodorovného scrollu. Zmenšení
   (kompaktní) nic nepřetéká, takže platí na všech šířkách stejně. */
:root[data-density="compact"] { font-size: 13.5px; }
:root[data-density="airy"] { font-size: 17px; }
@media (min-width: 720px) {
  :root[data-density="airy"] { font-size: 18px; }
}

/* .tt-rank-marker (dělící čára v Pořadí) jede v hustotách s .tt-row — jinak by
   se v light režimu řádkování rozešlo s režimem „plný řádek". */
:root[data-density="compact"] .tt-row,
:root[data-density="compact"] .tt-rank-marker { padding-top: 0.02rem; padding-bottom: 0.02rem; line-height: 1.25; }
:root[data-density="compact"] .time-table th,
:root[data-density="compact"] .time-table td { padding-top: 0.08rem; padding-bottom: 0.08rem; line-height: 1.25; }
:root[data-density="compact"] .results-card-athletes .race-card-athlete { padding-top: 0; padding-bottom: 0; line-height: 1.3; }
:root[data-density="compact"] .race-card-athletes { row-gap: 0.02rem; }
/* LED tabule „na trati" (.gm-card) jede v hustotách s výsledkovou tabulkou.
   Bez toho zůstal řádek tabule na 0.3rem paddingu a děděném řádkování 1.5 —
   v kompaktním režimu 30 px proti 18 px řádku listiny pod ním. Na sjezdu, kde
   je na trati klidně 16 lidí, tabule sama přerostla okno a stránka dostala
   svislý posuvník, přestože v režimu „plný řádek" (tytéž závodníky nese
   tabulka) se všechno vešlo. Řádkování drží .gm-clock (největší písmo v
   řádku), proto se sráží line-height na .gm-head, ne jen padding. */
:root[data-density="compact"] .gm-card { padding-top: 0.08rem; padding-bottom: 0.08rem; }
:root[data-density="compact"] .gm-head { line-height: 1.1; }
/* Krosová LED tabule má tentýž problém z druhé strany: `.tt-row` svoje
   kompaktní pravidlo (výše) má, jenže `#tt-on-course .tt-row` ho přebíjí ID
   specificitou (1,1,0) a vrací padding 0.36/0.24rem — řádek tabule tak držel
   26,8 px proti 17,0 px řádku Pořadí. Obě tabule jsou záměrně jedna a tatáž
   LED plocha, takže dostávají shodné metriky (~18,7 px). Optická korekce
   svislé polohy se v kompaktním řádkování nedá dělat paddingem (celkem jsou
   to 2 px), takže ji obě tabule řeší posunem obsahu — viz níž. */
:root[data-density="compact"] #tt-on-course .tt-row {
  padding-top: 0.08rem; padding-bottom: 0.08rem; line-height: 1.1;
}
/* Optická korekce svislé polohy obou LED tabulí — stejný princip a stejný
   mechanismus jako u živého řádku v listině (.tt-row--live > *): ink písma
   sedí v line-boxu výš, protože pod účařím zůstává místo pro dolní dotažnice,
   které STČ/VERZÁLKY/hodiny nemají. Text pak visí u horní hrany řádku.

   Posun přes `position: relative; top` na obsahu, NE paddingem: v kompaktním
   řádkování jsou celkem 2 px paddingu, takže asymetrie paddingu na korekci
   nestačí; `top` navíc nemění výšku řádku a v `em` škáluje s písmem, takže
   jedna hodnota sedí ve všech třech hustotách.

   Měřeno po pixelech (scale 4, ink číslic uvnitř border-boxu řádku, světlý
   i tmavý motiv dávají shodné hodnoty). Před korekcí byl text nad středem:
     tabule čas. disciplín  kompaktní −1,62 px, normální −1,38, vzdušná −2,12
     krosová tabule         kompaktní −0,50 px, normální −1,25, vzdušná −1,12
   Zbytek po korekci je do půl pixelu; Chromium posun zaokrouhluje na celé
   CSS px, takže přesnější cílit nejde.

   Každá tabule má vlastní hodnotu: krosový řádek si v normálním a vzdušném
   řádkování drží asymetrický padding (0.36/0.24rem), který kus korekce udělá
   sám, kdežto .gm-card má padding symetrický a potřebuje o něco víc. */
.gm-head > * {
  position: relative;
  top: 0.11em;
}
/* Kompaktní řádkování má o půl pixelu víc — řádek je nejnižší (18,7 px), takže
   se tam stejný zbytek pozná nejvíc, a stížnost („text u horní hrany") přišla
   právě odtud. */
:root[data-density="compact"] .gm-head > * { top: 0.16em; }
#tt-on-course .tt-row > * {
  position: relative;
  top: 0.08em;
}
/* FLT badge z korekce VYJÍMÁME — je to ohraničený BOX, který `align-items:
   center` vystředí geometricky správně; posun by ho jen srazil k dolní lince
   (stejná výjimka jako u .tt-row--live .tt-rank-flt). */
#tt-on-course .tt-row-flt { top: 0; }

/* Vzdušné: rem paddingy níž než dřív — větší kořenový font je sám o sobě
   zvedá (0.45rem × 18px ≈ původních 0.55rem × 16px), jinak by řádky narostly
   dvakrát. */
:root[data-density="airy"] .tt-row,
:root[data-density="airy"] .tt-rank-marker { padding-top: 0.45rem; padding-bottom: 0.45rem; }
:root[data-density="airy"] .time-table th,
:root[data-density="airy"] .time-table td { padding-top: 0.5rem; padding-bottom: 0.5rem; }
:root[data-density="airy"] .results-card-athletes .race-card-athlete { padding-top: 0.28rem; padding-bottom: 0.28rem; }
:root[data-density="airy"] .race-card-athletes { row-gap: 0.34rem; }

/* Landing (seznam závodů) — hustota platí i tady, jinak by ikona v hlavičce
   měnila jen velikost písma. Desktop tabulka i mobilní karty; pravidla jsou
   mimo @media, ale skrytá varianta se stejně nevykresluje (display:none).
   Specifičnost (0,2,1) přebíjí základ (0,1,1) bez ohledu na pořadí. */
:root[data-density="compact"] .event-table th,
:root[data-density="compact"] .event-row > td { padding-top: 0.3rem; padding-bottom: 0.3rem; }
:root[data-density="compact"] .event-table .event-tbody + .event-tbody .event-row:first-child > td { padding-top: 0.55rem; }
:root[data-density="compact"] .event-mobile-card { padding: 0.45rem 0.7rem; margin-bottom: 0.35rem; row-gap: 0.1rem; }
:root[data-density="compact"] .event-mobile-card-name { line-height: 1.2; }

:root[data-density="airy"] .event-table th,
:root[data-density="airy"] .event-row > td { padding-top: 0.85rem; padding-bottom: 0.85rem; }
:root[data-density="airy"] .event-table .event-tbody + .event-tbody .event-row:first-child > td { padding-top: 1.3rem; }
:root[data-density="airy"] .event-mobile-card { padding: 1.05rem 1.1rem; margin-bottom: 0.85rem; row-gap: 0.4rem; }

/* Přepínač jazyka CZ | EN — segmentovaná pilulka vedle přepínače motivu.
   Aktivní strana zvýrazněná; klik nastaví cookie a reloadne (kxrsSetLang). */
.lang-toggle {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: stretch;
  /* mezeru od sousedů řeší gap shluku .header-tools */
  margin-left: 0;
  border: 1px solid var(--c-334155);
  border-radius: 6px;
  overflow: hidden;
}
.lang-opt {
  appearance: none;
  border: none;
  background: transparent;
  color: var(--c-94a3b8);
  font-family: inherit;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  padding: 0 0.3rem;
  min-height: 38px;          /* zarovnání výšky s .theme-toggle + a11y tap floor */
  cursor: pointer;
  line-height: 1;
}
.lang-opt + .lang-opt { border-left: 1px solid var(--c-334155); }
.lang-opt:hover { color: var(--c-f1f5f9); }
.lang-opt.is-active {
  background: var(--c-334155);
  color: var(--c-f1f5f9);
  cursor: default;
}

/* ===== Světlý režim: scoreboard jedoucího závodníka (TT) =====
   Žlutá výplň + černý text — analogie reálné světelné tabule, vysoká
   viditelnost na světlé stránce. (V tmavém režimu zůstává žlutá na černé.) */
:root[data-theme="light"] #tt-on-course {
  background: #facc15;
  border-color: #ca8a04;
}
:root[data-theme="light"] #tt-on-course .tt-row,
:root[data-theme="light"] #tt-on-course .tt-row-name,
:root[data-theme="light"] #tt-on-course .tt-row-stc,
:root[data-theme="light"] #tt-on-course .tt-row-on-course .tt-row-time {
  color: #0a0a0a;
}
:root[data-theme="light"] #tt-on-course .tt-row {
  border-bottom-color: rgba(10, 10, 10, 0.15);
}
/* FLT odznak na žlutém pozadí: invertovaný (černé pozadí + žlutý text). */
:root[data-theme="light"] #tt-on-course .tt-row-flt {
  background: #0a0a0a;
  color: #facc15;
}
:root[data-theme="light"] #tt-on-course .tt-row-flt-empty {
  color: rgba(10, 10, 10, 0.4);
}

/* Světlý režim: LED scoreboard „na trati" časových disc. — invert jako
   #tt-on-course (žlutý panel + černý text, glow hodin zhasnut). Prázdný
   panel (.is-empty) chrome nemá, takže se ho invert netýká. */
:root[data-theme="light"] .time-live-board:not(.is-empty) {
  /* Tlumenější jantar než u krosové tabule: ta visí na stránce sama,
     kdežto tady pod ní hned pokračuje výsledková tabulka a syté
     #facc15 přes celou šířku ji přebíjelo. */
  background: #fde68a;
  border-color: #d97706;
}
:root[data-theme="light"] .time-live-board .gm-head,
:root[data-theme="light"] .time-live-board .gm-stc,
:root[data-theme="light"] .time-live-board .gm-name,
:root[data-theme="light"] .time-live-board .gm-final,
:root[data-theme="light"] .time-live-board .gm-clock {
  color: #0a0a0a;
  text-shadow: none;
}
:root[data-theme="light"] .time-live-board .gm-card {
  border-bottom-color: rgba(10, 10, 10, 0.15);
}
/* Trestné sekundy zůstávají i ve světlém režimu ČERVENÉ (jsou to trestné
   sekundy, ne běžný údaj), ale tmavší — panel je tu žlutý a #f87171 by na
   něm zmizelo. */
:root[data-theme="light"] .time-proj-row .gm-pen,
:root[data-theme="light"] .time-live-board .gm-pen { color: #991b1b; }
:root[data-theme="light"] .time-live-board .gm-rank {
  /* Žlutá LITERÁLEM: `--c-facc15` je ve světlém motivu #ea580c
     (oranžová), takže by odznak nebyl invertem panelu. */
  background: #1c1917; color: #fbbf24;
}
:root[data-theme="light"] .time-live-board .gm-behind { color: #0f172a; }
/* Buňky branek: základní `.gm-gate` má `background: var(--c-0f172a)`, jenže
   ta proměnná je ve světlém motivu přemapovaná na #f1f5f9 (viz
   [[feedback_publish_theme_var_naming]]) — na jantarovém panelu z branek
   dělala BÍLÉ obdélníky. Místo světlé plochy proto teplý tmavý závoj: buňka
   je „vlisovaná" do panelu a čte se jako mřížka, ne jako dlaždice. */
:root[data-theme="light"] .time-proj-gates .gm-gate,
:root[data-theme="light"] .time-live-board .gm-gate {
  background: rgba(120, 53, 15, 0.10);
}
:root[data-theme="light"] .time-proj-gates .gm-num,
:root[data-theme="light"] .time-live-board .gm-num { color: rgba(69, 26, 3, 0.62); }
/* Protivodná: podtržení (viz .gm-num-up), barva čísla zůstává jako u ostatních. */
:root[data-theme="light"] .time-proj-gates .gm-gate-touch,
:root[data-theme="light"] .time-live-board .gm-gate-touch {
  background: rgba(180, 83, 9, 0.24);
}
:root[data-theme="light"] .time-proj-gates .gm-gate-touch .gm-val,
:root[data-theme="light"] .time-live-board .gm-gate-touch .gm-val { color: #7c2d12; }
:root[data-theme="light"] .time-proj-gates .gm-gate-miss,
:root[data-theme="light"] .time-live-board .gm-gate-miss {
  background: rgba(220, 38, 38, 0.22);
}
:root[data-theme="light"] .time-proj-gates .gm-gate-miss .gm-val,
:root[data-theme="light"] .time-live-board .gm-gate-miss .gm-val { color: #991b1b; }
/* Zelená čisté branky o stupeň tmavší — #22c55e je laděné na černý panel
   a na jantaru ztrácí kontrast. */
:root[data-theme="light"] .time-proj-gates .time-gate-dot,
:root[data-theme="light"] .time-live-board .time-gate-dot { background: #15803d; }
/* Světlý režim: projekce jako kros (.tt-row--live light) — žlutý řádek +
   černý text; čára/pilulka zůstávají žluté (chip má černý text). */
:root[data-theme="light"] .time-proj-row > td {
  background: #facc15; color: #0a0a0a;
  /* Plná #ca8a04 — poloprůhledná žlutá by na žlutém podkladu zmizela. Ze
     stejného důvodu je v tomhle odstínu i horní linka a levý proužek: žlutý
     proužek na žlutém řádku není vidět vůbec. */
  border-bottom-color: #ca8a04;
  box-shadow: inset 0 1px 0 #ca8a04;
}
:root[data-theme="light"] .time-proj-row > td:first-child {
  box-shadow: inset 3px 0 0 #ca8a04, inset 0 1px 0 #ca8a04;
}
:root[data-theme="light"] .time-proj-row .time-rank,
:root[data-theme="light"] .time-proj-row .time-name,
:root[data-theme="light"] .time-proj-final,
:root[data-theme="light"] .time-proj-clock { color: #0a0a0a; text-shadow: none; }
/* Pás s maticí branek drží barvu svého řádku (viz .time-proj-gates). */
:root[data-theme="light"] .time-proj-gates > td {
  background: #facc15; border-bottom-color: #ca8a04;
}
:root[data-theme="light"] .time-proj-gates:not(.time-proj-gates--run) > td:first-child {
  box-shadow: inset 3px 0 0 #ca8a04;
}
:root[data-theme="light"] .time-proj-gates--run > td {
  background: rgba(250, 204, 21, 0.28);
}

/* ===== Světlý režim: propadávající závodník v Pořadí (.tt-row--live) =====
   Stejně jako scoreboard #tt-on-course: žluté pozadí + černý text. */
:root[data-theme="light"] .tt-row.tt-row--live {
  background: #facc15;
  color: #0a0a0a;
  /* Spodní i horní linka a levý proužek — viz tmavý režim (parita
     s .time-proj-row). Odstín #ca8a04: na žlutém podkladu by žlutá zmizela. */
  border-bottom-color: #ca8a04;
  box-shadow: inset 3px 0 0 #ca8a04, inset 0 1px 0 #ca8a04;
}
:root[data-theme="light"] .tt-row.tt-row--live .tt-row-rank,
:root[data-theme="light"] .tt-row.tt-row--live .tt-row-stc,
:root[data-theme="light"] .tt-row.tt-row--live .tt-row-name,
:root[data-theme="light"] .tt-row.tt-row--live .tt-row-time,
:root[data-theme="light"] .tt-row.tt-row--live .tt-row-diff {
  color: #0a0a0a;
}
:root[data-theme="light"] .tt-row.tt-row--live .tt-row-time {
  text-shadow: none;
}
:root[data-theme="light"] .tt-row.tt-row--live .tt-rank-flt {
  background: #0a0a0a;
  color: #facc15;
  border-color: #0a0a0a;
}

/* ===== Logo ČSK v hlavičce (vlevo před názvem) =====
   Dvě průhledné varianty: barevné (RGB) pro světlý režim, bílé pro tmavý.
   Žádná podložka — každá varianta sedí na svém pozadí. */
.site-logo {
  flex: 0 0 auto;
  display: inline-flex; align-items: center;
  text-decoration: none;
}
/* Výška jen tady (žádný display — ten řídí .site-logo-rgb/.white, jinak by
   .site-logo img display:block přebíjelo skrytí špatné varianty). ~25 % větší. */
.site-logo img { height: 44px; width: auto; }
/* default = tmavý režim → bílé logo; světlý režim → barevné */
.site-logo-rgb { display: none; }
.site-logo-white { display: block; }
:root[data-theme="light"] .site-logo-rgb { display: block; }
:root[data-theme="light"] .site-logo-white { display: none; }

/* ===== Desktop (≥720px): větší logo, větší název, logo zpět z flush ===== */
@media (min-width: 720px) {
  .site-logo img { height: 56px; }
  .site-event-name { font-size: 1.3rem; }
}

/* ===== Live (časové disciplíny) — kompaktní horní část =====
   Live se kouká na telefonu u trati / na projektoru: nad LED tabulí byla
   hlavička (logo 44–56px + dvouřádkový titul) + pás kategorie, dohromady
   ~110px na mobilu a ~122px na desktopu, než začal obsah. Tady je vše
   zhuštěné (`body.live-compact`, nastavuje jen time_live.html):
     - menší logo a jednořádkový titul (venue · datum · #číslo jde vedle
       názvu, na mobilu se skryje — na Live nikoho nezajímá),
     - nižší pás s názvem kategorie,
     - poloviční odsazení obsahu pod hlavičkou.
   Úspora ≈ 40px (mobil) / ≈ 50px (desktop), tj. jeden a půl řádku výsledků
   navíc. Ostatní stránky (Výsledky, Startovka, Rozpis) zůstávají beze změny. */
body.live-compact .site-header-main {
  min-height: 40px;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  gap: 0.5rem;
}
body.live-compact .site-logo img { height: 32px; }
/* Dvouřádkový blok → jeden řádek: název + tlumené meta vedle sebe. */
body.live-compact .site-event-line {
  flex-direction: row;
  align-items: baseline;
  /* výchozí `justify-content: center` centruje ve SLOUPCI svisle — v řádku by
     odsunul titul od loga doprostřed, proto explicitně doleva. */
  justify-content: flex-start;
  gap: 0.5rem;
}
body.live-compact .site-event-name { font-size: 1rem; }
body.live-compact .site-event-meta { font-size: 0.72rem; }
/* Mobil: na jeden řádek se meta stejně nevejde (ellipsis na „Trnávka · 12…") —
   radši ji schovat celou, než ukazovat useknutý fragment. */
@media (max-width: 719px) {
  body.live-compact .site-event-meta { display: none; }
}
/* Pás s názvem kategorie na trati. */
body.live-compact .tt-cat-tabs-strip {
  padding-top: 0.15rem;
  padding-bottom: 0.15rem;
}
body.live-compact .live-focus-strip { min-height: 28px; }
body.live-compact .live-focus-label {
  min-height: 28px;
  font-size: 0.88rem;
}
/* Ikony v hlavičce (hustota / motiv / jazyk) a přepínač „Živý čas v pořadí"
   drží výšku pásů svým 38px tap-floorem — na Live je snížíme na 30px.
   Nejsou to primární ovládání (klikne se do nich jednou na začátku), tap
   plocha zůstává ≥30px i s okolním paddingem pásu. */
body.live-compact .theme-toggle,
body.live-compact .density-toggle { width: 32px; height: 30px; }
body.live-compact .lang-opt { min-height: 30px; }
body.live-compact .tt-live-toggle { min-height: 30px; min-width: 38px; }
/* Obsah začíná hned pod pásem (jinde .site-main drží 1rem). */
body.live-compact .site-main { padding-top: 0.5rem; }
@media (min-width: 720px) {
  body.live-compact .site-logo img { height: 38px; }
  body.live-compact .site-event-name { font-size: 1.1rem; }
}

/* ===== Světlý režim: scoreboard toggle žlutý (stejně jako v tmavém) =====
   Bez tohoto by zdědil oranžovou z var(--c-facc15). Uživatel chce žlutou v obou. */
:root[data-theme="light"] .tt-live-toggle,
:root[data-theme="light"] .tt-live-toggle[data-mode="full"] { color: #facc15; }
:root[data-theme="light"] .tt-live-toggle:hover,
:root[data-theme="light"] .tt-live-toggle[data-mode="full"]:hover { color: #fde047; }
:root[data-theme="light"] .tt-live-toggle[data-mode="light"] .ic-divider { stroke: #facc15; }


/* ───────────────────────────────────────────────────────────────────
   Landing (home) — fixní výška okna + sbalitelný archiv
   Cíl: hlavička i patička (ver./©) jsou vždy vidět; scrolluje jen
   prostřední oblast se seznamem závodů. Archiv je defaultně sbalený,
   takže Aktivní + Nadcházející padnou na obrazovku i přes dlouhou sezónu.
   ─────────────────────────────────────────────────────────────────── */
body.home-no-dock {
  min-height: 100vh;
  min-height: 100dvh;    /* mobil: respektuje pohyblivou lištu prohlížeče */
}
body.home-no-dock .site-main {
  flex: 1 1 auto;
  min-height: 0;         /* přebíjí dřívější min-height: calc(100vh - 48px) */
}
body.home-no-dock .site-footer {
  flex: 0 0 auto;        /* patička drží výšku, nezmizí pod přehyb */
}
/* …a totéž hlavička. `body.home-no-dock` je flex sloupec, takže hlavička jako
   flex položka SMRSKNE na výšku hlavního řádku (55 px) — jenže stránky
   archivu pod ním nesou ještě pás kategorií (`.tt-cat-tabs-strip`, 48 px).
   Ten pak přetekl přes obsah a překryl drobečkovou navigaci. */
body.home-no-dock .site-header {
  flex: 0 0 auto;
}

/* Fixní výška okna (patička přilepená dole, scrolluje jen seznam) jen na
   desktopu. Na mobilu ne: adresní/spodní lišta prohlížeče překrývá dolní
   okraj layoutového viewportu a `overflow: hidden` by patičku zamkla pod
   přehybem — nešla by k ní doscrollovat. Tam scrolluje celá stránka a
   patička je posledním blokem obsahu. */
@media (min-width: 720px) {
  body.home-no-dock {
    height: 100vh;
    height: 100dvh;
    overflow: hidden;    /* stránka sama nescrolluje; scrolluje .site-main */
  }
  body.home-no-dock .site-main {
    overflow-y: auto;    /* scrolluje jen seznam závodů */
  }
}

/* ── Odkaz do webového archivu na rozcestníku ──
   Nahradil sbalitelný seznam dojetých závodů: ty už na živých výsledcích
   nevisí vůbec (viz `ARCHIVE_GRACE_DAYS`), takže není co rozbalovat. */
.archive-odkaz {
  margin: 1.25rem 0 0;
  padding: 0 1rem;
  font-size: 0.85rem;
}
.archive-odkaz a { color: var(--muted); text-decoration: none; }
.archive-odkaz a:hover { color: var(--accent); text-decoration: underline; }
/* oddělovač nese summary → archivní tabulka/karty bez vlastního horního okraje */
.archive-details .event-table,
.archive-details .event-cards { margin-top: 0; }

/* Odkaz results.cz v patičce landingu — dědí barvu patičky, ne globální modrou. */
.site-footer-link { color: inherit; text-decoration: none; }
.site-footer-link:hover { color: var(--accent); }
/* „x" v KXRS jako křížek — stejná typografie jako .st-logo-mark .x v hlavní
   aplikaci (znak × obarvený akcentem). */
.site-footer-x { color: var(--accent); }

/* ─────────────────────────────────────────────────────────────────────
   Oddíl (domácí závod) / národnost (mezinárodní) na kartách Live + pavouk.
   Jen desktop (≥720px). Sloupce: jméno (roztáhne se) | oddíl/stát |
   rezervovaný sloupec FLT vpravo. FLT (karty) i stav (live heat) jsou
   absolutně ukotvené k pravému okraji, takže oddíl/stát končí VŽDY na
   stejné pozici bez ohledu na to, jestli řádek FLT má — sloupce jsou tak
   zarovnané napříč řádky. Na mobilu skryto.
   ───────────────────────────────────────────────────────────────────── */
.athlete-org { display: none; }
@media (min-width: 720px) {
  /* Rezervovaný pruh vpravo pro FLT / stav. */
  .race-card-athlete,
  .race-hero-athlete,
  .bracket-race-athlete,
  .live-current-heat .live-athlete {
    position: relative;
    padding-right: 3.4rem;
  }
  /* Hero živý (červeně orámovaný) heat: 3-class pravidlo
     `.race-card-hero .live-current-heat .live-athlete` (Wave 2.7.12,
     padding: 0.55rem 0) má vyšší specificitu než 2-class rezervace výše →
     padding-right spadne na 0 a oddíl (margin-left:auto) i stav/FLT
     (position:absolute; right:0) skončí oba vpravo (kolize). Obnovíme pruh
     stejně specifickým selektorem. */
  .race-card-hero .live-current-heat .live-athlete {
    padding-right: 3.4rem;
  }
  .race-card-athlete .athlete-org,
  .race-hero-athlete .athlete-org,
  .bracket-race-athlete .athlete-org,
  .live-current-heat .athlete-org {
    display: inline-block;
    margin-left: auto;
    padding-left: 0.6rem;
    text-align: right;
    flex-shrink: 0;
    max-width: 45%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--c-94a3b8);
    font-size: 0.82em;
    font-variant-numeric: tabular-nums;
  }
  /* FLT (karty) i stav (live heat) ukotvené do rezervovaného sloupce vpravo. */
  .race-card-athlete .athlete-flt,
  .race-hero-athlete .athlete-flt,
  .bracket-race-athlete .athlete-flt,
  .live-current-heat .athlete-status {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
  }
}

/* ─────────────────────────────────────────────────────────────────────
   Watermark s názvem stránky (STARTOVNÍ LISTINA / KVALIFIKACE / LIVE /
   VYŘAZOVACÍ JÍZDY / ROZPIS) — svisle podél levého okraje, písmo otočené
   o 180° (čte se zdola nahoru). Neinteraktivní (pointer-events:none),
   klipuje přetečení (žádný horizontální scroll), pod dockem i záhlavím.
   ───────────────────────────────────────────────────────────────────── */
.page-watermark {
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 40;            /* pod sticky záhlavím i dockem (99) */
}
.page-watermark-text {
  position: absolute;
  left: 0.1rem;
  top: 50%;
  transform: translateY(-50%) rotate(180deg);
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-weight: 800;
  /* Zhruba 2× větší než původní 1rem. `min(…, 3.2vh)` drží nápis na JEDNOM
     sloupci a celý ve výřezu: bez stropu by se delší popisky („STARTOVNÍ
     LISTINA · FINÁLE A") na nižších oknech buď zalomily do několika sloupců
     (a zalezly pod tabulku), nebo se oříznuly uprostřed slova. */
  font-size: min(1.9rem, 3.2vh);
  white-space: nowrap;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--c-e2e8f0);
  opacity: 0.11;
  user-select: none;
}
@media (min-width: 1200px) {
  /* Na širokém okně je vedle obsahu (max-width ~900px) volný pruh — odsadíme
     nápis od hrany, ať „nevisí" na okraji. */
  .page-watermark-text { left: 0.5rem; }
}

/* Live (kros TT i časové disciplíny): obsah je hustý a začíná hned u levé
   hrany, takže pořadí/StČ leží přímo na písmu watermarku. Prostor v řádku je
   (za jménem zbývá volno), proto celý obsah posuneme doprava za watermark.
   Šířka nápisu = font-size (svislé písmo) ≤ 1.9rem + left 0.1rem → 2.5rem
   nechá i mezeru. Nad ~980px je obsah (max-width 900) vycentrovaný a volný
   pruh vznikne sám → beze změny. */
@media (max-width: 980px) {
  body.live-page .site-main { padding-left: 2.5rem; }
}

/* Live = tabule, ne dokument: svislý scrollbar na pravé hraně ruší (naskakoval
   „občas" — podle toho, jestli se listina vešla do okna). Skrýváme jen jeho
   VZHLED; kolečkem / tahem prstu se stránka scrolluje dál, takže delší listina
   zůstává dostupná. Pravidlo musí sedět na <html> (viewport scrollbar dědí styl
   z kořene, ne z body) → :has() na body třídu. */
:root:has(body.live-page) { scrollbar-width: none; }
:root:has(body.live-page)::-webkit-scrollbar { width: 0; height: 0; }

/* Totéž pro scrollovací kontejnery UVNITŘ Live — jinak zůstane lišta přilepená
   na pravé hraně výsledkové tabulky (přes hlavičku a pár řádků), ne u okraje okna.
   Kde se bere: .time-table-wrap deklaruje jen `overflow-x: auto`, jenže podle
   spec tím `overflow-y` spadne z `visible` na `auto` — takže stačí, aby byla
   tabulka o zlomek pixelu vyšší než její box (zaokrouhlení výšky řádků), nebo
   aby si klasická vodorovná lišta ukousla ze spodku 15 px, a svislá lišta je
   tam. Proto „občas". `scrollbar-width: none` navíc znamená, že lišta zabírá
   NULOVOU šířku, takže to zároveň bere příčinu, ne jen vzhled; scrollovat
   (kolečko, shift+kolečko, tah prstem) jde dál. Mimo Live zůstává vodorovná
   lišta u širokých tabulek beze změny — tam je to užitečná nápověda. */
body.live-page .time-table-wrap,
body.live-page .scroll-x,
body.live-page .race-chips { scrollbar-width: none; }
body.live-page .time-table-wrap::-webkit-scrollbar,
body.live-page .scroll-x::-webkit-scrollbar,
body.live-page .race-chips::-webkit-scrollbar { width: 0; height: 0; }

/* ============================================================
   Časové disciplíny (slalom / sjezd / sprint) — vlna B
   Výsledkové tabulky + branková matice. Tabulky scrollují uvnitř
   .time-table-wrap (overflow-x), stránka nikdy horizontálně.
   ============================================================ */
.time-page { max-width: 900px; margin: 0 auto; padding: 0 0.5rem 1rem; }

.time-banner {
  display: flex; align-items: center; gap: 0.5rem;
  margin: 0.6rem 0; padding: 0.45rem 0.75rem;
  border-radius: 8px; font-size: 0.9rem; font-weight: 600;
  background: var(--c-1e293b); color: var(--c-e2e8f0);
  border: 1px solid var(--c-334155);
}
.time-banner-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.time-banner-running .time-banner-dot {
  background: #ef4444; animation: time-banner-pulse 1.4s ease-in-out infinite;
}
.time-banner-done .time-banner-dot { background: #22c55e; }
@keyframes time-banner-pulse { 50% { opacity: 0.35; } }

.time-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.time-table {
  width: 100%; border-collapse: collapse; font-size: 0.88rem;
  color: var(--c-e2e8f0);
}
.time-table th, .time-table td {
  padding: 0.4rem 0.5rem; text-align: left; white-space: nowrap;
  border-bottom: 1px solid var(--c-273449);
}
.time-table thead th {
  font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em;
  color: var(--c-94a3b8); border-bottom: 1px solid var(--c-334155);
  position: sticky; top: 0; background: var(--c-0f172a);
}
/* Čísla v listině (časy, penalizace, startovní čísla) sází mono písmo —
   číslice mají stejnou šířku, takže sloupec stojí a oko porovnává časy
   pod sebou, ne vedle sebe. */
.time-table .tt-num { text-align: right; font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
/* Jméno smí zalomit na 2 řádky, ale nešíří tabulku donekonečna — strop
   max-width; dlouhé jednoslovné příjmení se ořízne (…) s plným zněním v title. */
.time-table .time-name {
  white-space: normal; min-width: 10rem; max-width: 15rem;
  overflow: hidden; text-overflow: ellipsis;
}
/* Oddíl (na mobilu skrytý) — dlouhé názvy klubů neroztahují tabulku: pevný
   strop šířky + oříznutí s … (nowrap dědí z .time-table td). Plný název v title. */
.time-table td.time-col-club {
  max-width: 11rem; overflow: hidden; text-overflow: ellipsis;
}
/* Dvojice VK sloupců (pořadí ve VK „2." + samotná VK) pod jedním společným
   nadpisem „VK" (colspan=2). Sloupce těsně u sebe — pořadí zarovnané doprava
   s malým pravým paddingem, VK doleva s malým levým → „2. DS" čte se jako
   jeden celek. Viditelné i na mobilu (nemají .time-col-detail). */
.time-table th.time-vk-head { text-align: center; }
.time-table td.time-vkrank { text-align: right; font-variant-numeric: tabular-nums; padding-right: 0.15rem; }
.time-table td.time-vkcat  { text-align: left;  padding-left: 0.15rem; }
.time-rank { font-weight: 700; }
/* Výsledný čas je to, kvůli čemu se listina otevírá — nese ho barva akcentu
   a mono s tabulkovými číslicemi, aby časy stály pod sebou. LED písmo by
   v téhle velikosti (17 px) vypadalo přerušovaně. */
.time-total {
  font-family: var(--font-mono); font-weight: 500; font-size: 1.02rem;
  font-variant-numeric: tabular-nums; color: var(--accent);
}
.time-best { font-weight: 700; color: var(--c-fde047); }
/* Penalizace za časem (bez oddělovače, jen barvou), zarovnaná na 3 místa
   mezerami místo úvodních nul (white-space: pre je zachová). */
/* Penalizace stojí PŘED časem (viz `_time_results_body.html`), takže ji od
   něj odsazujeme zprava — bez toho se ve sloupcích „1. jízda"/„2. jízda"
   trestné body a čas slévaly v jedno číslo. */
.time-pen { color: #f87171; font-size: 0.78rem; white-space: pre; margin-right: 0.5rem; }
.time-flt { color: #f87171; font-size: 0.78rem; font-weight: 700; }
/* Trestné body jízdy mají VLASTNÍ sloupec (viz `run_cell`), takže je od
   času neodsazujeme zprava — `margin-right` na `.time-pen` platí pro
   sloupec ČAS jednokolových listin, kde penalizace stojí s časem v jedné
   buňce. Sloupec je úzký a drží se u pravé hrany jako ostatní čísla. */
.time-run-pen { width: 2.6rem; }
.time-run-pen .time-pen { margin-right: 0; }
/* Dvoukolovka má sloupec VÝSLEDEK v DOMu DVAKRÁT: mobilní kopie hned za jménem
   (rozhodující čas musí být vidět bez vodorovného rolování, jako ve sprintu),
   desktopová na svém obvyklém místě za oběma jízdami. Vždycky svítí právě
   jedna — `.time-col-mobile` jen pod 720 px, `.time-col-wide` jen nad. Obě
   nesou `.time-total`, takže je live JS čte i plní stejně (viz buildProjRow). */
.time-table .time-col-mobile { display: none; }
.time-behind { color: var(--c-94a3b8); }
.time-pending { color: var(--c-94a3b8); font-style: italic; }
.time-badge { font-size: 0.8rem; letter-spacing: 0.03em; }
/* Posádka (C2/raft): jeden pádler = jeden řádek, stejně jako v KXRS. Obě jména
   mají stejnou váhu — dřív se tu vypisoval slepený titulek a pod ním ještě
   jednou šedá sedadla, tedy dvakrát totéž. */
.time-crew-member { display: block; }
/* LIVE: titulek lodi na jednom řádku („NĚMEC - VESELÝ", tvar sloupce TITULEK
   ve startovní listině) — nesmí se lámat na pomlčce. */
.time-crew-title { white-space: nowrap; }
.sl-crew-member { display: block; }
/* Název lodi nad jmény členů: vlastní jméno hlídky (`Entry.label`), a kde
   označení („A"/„B") nesedí na sloučené buňce oddílu, i to. Tlumené a menší —
   je to štítek lodi, ne závodník; jména členů pod ním nesou plnou váhu.
   Tvarem odpovídá `.crew-label` v tištěných listinách. */
.time-crew-label,
.sl-crew-label {
  display: block; font-size: 0.78em; color: var(--c-94a3b8);
}

/* Dělící čáry: skupiny FA/FB + čára postupu (zelená, jako TT). */
.time-group-divider td {
  padding: 0.35rem 0.5rem; font-size: 0.72rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.05em;
  color: var(--c-94a3b8); background: var(--c-1e293b);
  border-top: 2px solid var(--c-475569);
}
/* POSÁDKY (C2 / raft / hlídky): řádek je vysoký na dvě až tři jména pod sebou,
   takže tenká linka mezi řádky (1px --c-273449) splyne s odřádkováním UVNITŘ
   řádku a listina hlídek se čte jako jeden slitý blok jmen. Posádkový řádek
   proto uzavírá výraznější čára — tvarem i barvou táž, jakou se oddělují
   skupiny FA/FB (`.time-group-divider`), aby listina nezaváděla třetí sílu
   linky. Značku nese `time-row-crew` z `crew_row_cls` (_name_macros.html). */
.time-table tbody tr.time-row-crew > td { border-bottom: 2px solid var(--c-475569); }
/* Čára postupu do Finále A musí zůstat vidět i v posádkové kategorii, takže
   stojí nad předchozím pravidlem specificitou (dřív `tr.time-advance-cut td`,
   tedy míň než posádkové pravidlo — zelená by se ztratila). */
.time-table tbody tr.time-advance-cut > td { border-bottom: 2px solid #22c55e; }
/* Postupový sloupec „Q" (poslední sloupec) — zelené Q u postupujících do
   Finále A (rank ≤ advance_count). Zůstává viditelný i na mobilu (není
   .time-col-detail), aby byl postup vždy vidět. */
.time-table th.time-col-q { text-align: center; width: 1.5rem; }
.time-table td.time-col-q { text-align: center; }
.time-q { color: #22c55e; font-weight: 700; }

/* Popisek aktuálního stavu nad výsledkovou tabulkou (Kvalifikace / Celkové
   výsledky) — NE sbalovací sekce, jen štítek fáze podle průběhu závodu. */
.time-stage-label {
  font-size: 0.78rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.05em; color: var(--c-94a3b8); margin: 0.1rem 0 0.5rem;
}

/* Poslední dojetý v LIVE výsledcích časové disciplíny — sjednoceno s kros
   latest-finisher (viz .tt-row-ranking výše). Trvalé zelené podbarvení + levý
   akcentový pruh drží server (data-latest-finisher, do dalšího dojezdu / max
   5 min); JEDNORÁZOVÝ pulz řídí JS (třída .latest-finisher-pulse) jen při
   změně dojetého (time_live.js), NE na každý swap — proto ne animace na
   atributovém selektoru. */
.time-table tbody tr.time-row[data-latest-finisher="1"] {
  background-color: rgba(34, 197, 94, 0.18);
  box-shadow: inset 3px 0 0 #22c55e;
  transition: background-color 0.5s ease-out;
}
.time-table tbody tr.time-row[data-latest-finisher="1"] > td {
  font-weight: 600;
}
@keyframes time-latest-finisher-pulse {
  0%   { background-color: rgba(34, 197, 94, 0.55); }
  50%  { background-color: rgba(34, 197, 94, 0.35); }
  100% { background-color: rgba(34, 197, 94, 0.18); }
}
.time-table tbody tr.time-row.latest-finisher-pulse {
  animation: time-latest-finisher-pulse 2s ease-out;
}
/* DNF/DSQ dominuje barvou i kdyby se sem řádek s terminálním stavem dostal
   (server značí jen řádně dojeté, tohle je jen obrana). */
.time-table tbody tr.time-row.race-athlete-dnf[data-latest-finisher="1"] {
  background-color: rgba(239, 68, 68, 0.12);
  box-shadow: inset 3px 0 0 #ef4444;
  animation: none;
}

/* Sbalitelné sekce (mezivýsledky, matice). */
.time-section { margin: 0.9rem 0; }
.time-section > summary {
  cursor: pointer; font-weight: 700; font-size: 0.92rem;
  padding: 0.45rem 0.2rem; color: var(--c-cbd5e1); user-select: none;
}
.time-section > summary::marker { color: var(--c-94a3b8); }
.time-matrix-label {
  font-size: 0.78rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.04em; color: var(--c-94a3b8); margin: 0.6rem 0 0.2rem;
}

/* Branková matice — živý pohled „na trati": karta per závodník, branky
   ve DVOU řádcích (grid ceil(n/2) sloupců), číslo branky v buňce.
   Protivodné branky = červené číslo (barvou, ne šipkou). */
/* Živý scoreboard „na trati" — jednotná LED tabule s kros TT (#tt-on-course):
   černý panel + žlutý rámeček, monospace žluté řádky, svítící běžící hodiny.
   Karta = plochý řádek (STČ · jméno · běžící čas), oddělený čárkovanou žlutou
   linkou. Branky (slalom/raft) se ukážou pod hlavičkou jako matice. */
.time-live-board {
  background: var(--c-0a0a0a);
  border: 2px solid var(--c-facc15);
  border-radius: 8px;
  padding: 0.5rem;
  margin-bottom: 1rem;
}
/* Prázdno (nikdo na trati) → žádná panelová chrome, jen prázdný stav uvnitř. */
.time-live-board.is-empty {
  background: transparent; border: 0; padding: 0; margin-bottom: 0.5rem;
}
/* Dojetá kategorie: nikdo na trati a žádná hláška („Nikdo právě není na trati"
   je pauza mezi závodníky, ne komentář k dojeté kategorii) → panel pryč
   i s mezerou, výsledky se posunou nahoru. */
.time-live-board.is-blank { display: none; }
.gm-card {
  margin: 0; padding: 0.3rem 0.25rem;
  background: transparent; border: 0; border-radius: 0;
  border-bottom: 1px dashed rgba(250, 204, 21, 0.2);
}
.gm-card:last-child { border-bottom: none; }
.gm-head {
  /* Pevná MŘÍŽKA, ne flex. Karta dojetého nese navíc odznak pořadí vlevo a
     ztrátu vpravo; při flexu se o jejich šířku posunuly STČ, jméno,
     penalizace i výsledek proti kartám závodníků na trati a tabule
     nelícovala ve sloupcích. Stopy jsou proto PEVNÉ (ne auto/obsahové) a
     každý údaj má přidělené své číslo sloupce — chybějící údaj nechá stopu
     prázdnou, místo aby posunul zbytek.
     center (ne baseline) — hodiny jsou větší než STČ/jméno, viz .tt-row. */
  display: grid;
  grid-template-columns: 2.5rem 3ch minmax(0, 1fr) 3.4rem 5.6rem 5rem;
  align-items: center; column-gap: 0.5rem;
  font-family: ui-monospace, "SF Mono", Monaco, "Cascadia Code",
               "Roboto Mono", Consolas, "Liberation Mono",
               "Courier New", monospace;
  font-weight: 700; color: var(--c-facc15);
  font-size: 0.95rem; min-width: 0; margin-bottom: 0;
}
/* STČ ve velikosti řádku (dědí 0.95rem z .gm-head) — viz #tt-on-course
   .tt-row-stc; menší písmo bylo v kompaktním řádkování nápadné. */
/* STČ zarovnané doprava na pevném sloupci: jednotky lícují pod sebou
   (tabular-nums) a jméno začíná na stejném x bez ohledu na to, jestli má
   startovní číslo jednu, dvě nebo tři číslice. Bez `min-width` by se sloupec
   smrskl na obsah řádku a jména by se zubatě posouvala. Krosová tabule má
   totéž na `#tt-on-course .tt-row-stc` (tam sloupec drží grid). */
/* Čísla sloupců mřížky (viz .gm-head): 1 pořadí · 2 STČ · 3 jméno ·
   4 penalizace · 5 čas (běžící i výsledný) · 6 ztráta. */
.gm-stc {
  grid-column: 2;
  font-weight: 700; font-variant-numeric: tabular-nums; color: var(--c-fde047);
  text-align: right;
}
.gm-name { grid-column: 3; font-weight: 700; color: var(--c-facc15); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Trestné sekundy ve velikosti hodin: v slalomu rozhodují o pořadí stejně
   jako čas, a v 0.82rem se na tabuli četly hůř než cokoliv kolem. */
.gm-pen { grid-column: 4; color: #f87171; font-weight: 800; font-size: 1.05rem; white-space: nowrap; text-align: right; }
/* ── Karta dojetého závodníka (zůstává na tabuli po cíli) ─────────────
   Pořadí v INVERZNÍM poli (černé písmo ve žlutém) — jediný plný blok na
   tabuli, takže výsledek utkví dřív, než ho vystřídá další jízda.
   Ve světlém motivu se panel invertuje na žlutý, kde by žluté pole
   zmizelo → prohozeno na černé pole se žlutým písmem (níž u ostatních
   light pravidel tabule). */
.gm-rank {
  /* Odznak drží vlastní šířku a hlásí se k levé hraně stopy — roztažený přes
     celou stopu by u jednociferných pořadí vypadal jako pruh. */
  grid-column: 1; justify-self: start;
  background: var(--c-facc15); color: #0f172a;
  font-weight: 800; font-variant-numeric: tabular-nums;
  border-radius: 3px; padding: 0 0.4rem; line-height: 1.35;
}
/* Výsledný čas má velikost hodin, které nahradil, ale nesvítí — jízda je
   rozhodnutá, ohnisko patří tomu, kdo je na trati. */
.gm-final {
  grid-column: 5;
  font-variant-numeric: tabular-nums; font-weight: 800;
  color: var(--c-facc15); font-size: 1.05rem; letter-spacing: 0.03em;
  white-space: nowrap; text-align: right;
}
.gm-behind {
  grid-column: 6;
  font-variant-numeric: tabular-nums; font-weight: 700;
  font-size: 0.95rem; color: var(--c-fde047); opacity: 0.75;
  white-space: nowrap; text-align: right;
}
/* ── Předběžný výsledek (dojel, branky ještě nejsou odbavené) ─────────
   Čas BLIKÁ. Na tabuli je blikání zavedený způsob, jak říct „tohle číslo
   ještě není konečné" — čte se z dálky a bez čtení, kdežto textová značka
   („předb." ve stopě ztráty) chtěla, aby si ji divák všiml a domyslel si ji.
   Bliká ČAS, ne penalizace: divák se ptá „je tenhle výsledek konečný?",
   a to je otázka na čas; počet trestných sekund je pravdivý údaj o tom,
   co je zadáno, a navíc se při nule nekreslí vůbec.
   Blikání je TVRDÉ (`steps`), jako na LED tabuli, ale jen do 0,35 — číslo
   nesmí zmizet, je to výsledek, ne upozornění. Dolní mez drží SVĚTLÝ motiv:
   tam je čas tmavý na jantarovém panelu, takže se při 0,25 srazil na sotva
   čitelnou šeď, kdežto v tmavém (žlutá na černé) byl pořád zřetelný. Velikost
   ani stopa se nemění, aby karta lícovala s kartami běžících hodin.
   Bliká se VŽDY — viz poznámka u `prefers-reduced-motion` níž. */
/* Promítnutý do pořadí bliká TOTOŽNĚ jako na kartě — jinak by odpověď na
   „je tenhle výsledek konečný?" závisela na tom, který režim má divák
   zapnutý. */
/* A stejně tak řádek předběžného výsledku ve VÝSLEDKOVÉ TABULCE (`.time-prov`,
   makro `total_or_prov`): závodník, který dojel a čeká na odbavení branek,
   v pořadí stojí na svém místě a blikáním říká, že to místo je předběžné.
   Bez toho z listiny po dojezdu zmizel a divák to četl jako „vypadl". */
.time-prov.is-prov,
.time-proj-final.is-prov,
.gm-final.is-prov {
  /* Tečkované podtržení je TRVALÁ druhá stopa — drží i tam, kde se animace
     nepřehraje vůbec (tisk, stará jádra, vypnuté animace v prohlížeči). */
  text-decoration: underline dotted;
  text-underline-offset: 0.22em;
  text-decoration-thickness: 1px;
  animation: gm-prov-blink 1.1s steps(1, end) infinite;
}
/* `prefers-reduced-motion: reduce` blikání ZMĚKČUJE, nevypíná.
   Do 1. 9. 2026 tu byla opačná úvaha — animace jen pod `no-preference`
   a jinak statické ztlumení — a byla ŠPATNĚ: uživatel s vypnutými animacemi
   ve Windows/macOS/GNOME (na VM běžné, kvůli softwarovému vykreslování)
   hlásil „neproblikává to" a měl pravdu. Blikání tady nese INFORMACI
   („tenhle výsledek ještě není konečný"), ne ozdobu, takže jeho vypnutí ten
   stav SKRYJE — a to je přesně ta výjimka, na kterou se preference nevztahuje.
   Respektuje se tedy jinak: pomalé měkké prolnutí místo tvrdého střihu,
   a mělčí (do 0,62), ať to v periferním vidění netluče. Frekvence je hluboko
   pod hranicí záblesků (0,9 Hz, resp. 0,4 Hz) a číslo nikdy nezmizí. */
@media (prefers-reduced-motion: reduce) {
  .time-prov.is-prov,
  .time-proj-final.is-prov,
  .gm-final.is-prov { animation: gm-prov-fade 2.6s ease-in-out infinite; }
}
/* Předběžný čas ve výsledkové tabulce drží tvar běžného výsledku (barva
   i tabular-nums z buňky `.time-total`) — odlišuje ho blikání a tečkované
   podtržení výše, ne jiná barva: je to pořád výsledek, jen ne konečný. */
.time-prov { font-variant-numeric: tabular-nums; }
@keyframes gm-prov-blink { 0%, 62% { opacity: 1; } 62.01%, 100% { opacity: 0.35; } }
@keyframes gm-prov-fade { 0%, 100% { opacity: 1; } 50% { opacity: 0.62; } }
.time-proj-row .gm-pen.is-prov,
.gm-pen.is-prov { opacity: 0.85; }
/* Běžící hodiny — ohnisko: větší, svítí (glow), tabular-nums (jako #tt-on-course). */
.gm-clock {
  grid-column: 5;
  font-variant-numeric: tabular-nums; font-weight: 800;
  color: var(--c-facc15); font-size: 1.05rem; letter-spacing: 0.03em;
  text-shadow: 0 0 5px rgba(250, 204, 21, 0.4);
  white-space: nowrap; text-align: right;
  /* MÍSTO PRO SETINU, kterou běžící hodiny nemají. Dojetý má čas na SETINY
     (`1:09,57` ze serveru), běžící jen na DESETINY (time_live.js fmtClock —
     tik je po 100 ms, takže by setina byla vždy nula). Obojí sedí v téže
     stopě mřížky zarovnané doprava, takže se sloupce číslic o ten jeden znak
     míjely: minuty, dvojtečka, sekundy i čárka dojetého stály o celý znak
     vlevo proti kartám nad ním a pod ním (naměřeno 10,6 px). Reference je
     DOJETÝ — jeho čas je výsledek a ten se nikam neposouvá —, takže místo
     pro chybějící setinu drží běžící hodiny odsazením zprava a čárka
     s desetinou lícují přes celou tabuli.
     Šířka znaku je `1ch` PLUS `letter-spacing` (0,03em za každým znakem
     včetně posledního) — samotné `1ch` by nechalo půl pixelu skluzu.
     Písmo je monospace, takže `ch` platí pro každou číslici i pro čárku;
     s velikostí písma se odsazení škáluje samo (viz mobilní @media). */
  padding-right: calc(1ch + 0.03em);
}
/* Úzká obrazovka: stopy se srazí (jméno je `1fr`, takže ustoupí první a má
   ellipsis), ať se tabule vejde bez vodorovného posuvníku. Responzivní blok
   stojí ZA základními pravidly — @media nezvyšuje specificitu. */
@media (max-width: 560px) {
  .gm-head {
    grid-template-columns: 2rem 2.6ch minmax(0, 1fr) 2.7rem 4.6rem 4.2rem;
    column-gap: 0.3rem; font-size: 0.85rem;
  }
  .gm-pen, .gm-clock, .gm-final { font-size: 0.92rem; }
  .gm-behind { font-size: 0.82rem; }
}
/* Když jsou branky (slalom/raft), oddělit matici od LED hlavičky. */
.gm-card .gm-gates { margin-top: 0.25rem; }
.gm-gates {
  display: grid; grid-template-columns: repeat(var(--gm-cols, 25), minmax(0, 1fr));
  gap: 1px;
}
.gm-gate {
  display: flex; flex-direction: column; align-items: center;
  padding: 0.15rem 0; border-radius: 5px;
  background: var(--c-0f172a); min-width: 0;
}
.gm-num { font-size: 0.62rem; line-height: 1.1; color: var(--c-94a3b8); font-variant-numeric: tabular-nums; }
/* Protivodná branka = PODTRŽENÉ číslo, ne červené číslo. Červená v matici
   znamená PENALIZACI (50 = neprůjezd) a barevné číslo branky se s ní pletlo;
   podtržení je kresba, ne barva, takže se obě informace v jedné buňce
   nepřebíjejí a nestojí ani žádné místo navíc (buňka je při 25 brankách na
   mobilu užší než dvojciferné číslo). Linku kreslí `currentColor`, takže si
   vezme barvu čísla i ve světlém motivu. */
.gm-num-up {
  text-decoration: underline; text-decoration-thickness: 1px;
  text-underline-offset: 1.5px; font-weight: 700;
}
/* Úzká obrazovka: při 25 brankách vyjde na buňku ~12 px a dvojciferné číslo se
   do ní nevešlo už dřív (sousedé se slepovali v „1011") — a slitá čísla by
   pod sebou nesla i slitou linku podtržení, takže by nebylo poznat, které
   z nich je protivodné. Menší číslo řadu rozdělí. Blok MUSÍ stát ZA `.gm-num`
   výše — @media nezvyšuje specificitu, takže dřívější zápis by pozdější
   0.62rem přebilo. */
@media (max-width: 560px) {
  .gm-num { font-size: 0.55rem; }
}
.gm-val {
  font-size: 0.78rem; font-weight: 700; line-height: 1.2; min-height: 1.05rem;
  display: flex; align-items: center; justify-content: center;
  font-variant-numeric: tabular-nums;
}
.gm-gate-touch .gm-val { color: var(--c-fde047); }
.gm-gate-miss .gm-val { color: #f87171; }
.gm-gate-touch { background: rgba(250, 204, 21, 0.12); }
.gm-gate-miss { background: rgba(239, 68, 68, 0.14); }
.time-gate-dot {
  display: inline-block; width: 7px; height: 7px; border-radius: 50%;
  background: #22c55e;
}
/* Na TABULI je puntík menší než základní velikost: většina branek bývá čistě
   projetá, takže plná řada velkých teček „svítila jako semafor" a přebíjela
   to, kvůli čemu se na tabuli kouká — číslo, jméno a čas. Penalizované branky
   (číslo 2 / 50) tím naopak vyniknou. Sdílená třída zůstává, jak byla, kvůli
   ostatním místům. */
.time-proj-gates .time-gate-dot,
.time-live-board .time-gate-dot { width: 4px; height: 4px; }

/* ── Rozbalovací kompaktní detail závodníka (klik na výsledkový řádek) ─────
   Barevně odlišené okno pod řádkem na 2–3 řádcích, BEZ popisků kolonek:
   1) nacionále (STČ · jméno · oddíl · roč · VK · VT · pořadí ve VK),
   2) výsledky 1. jízdy (pořadí · čas · pen · celkem + čipy branek),
   3) 2. jízda (je-li). Čipy: žlutá „2" dotek / červená „50" neprůjezd,
   protivodná = červené číslo. */
.time-row-clickable { cursor: pointer; }
.time-row-clickable:hover { background: var(--c-1e293b); }
.time-row-clickable:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.time-table tbody tr.time-row.is-open { background: var(--c-1e293b); }
.time-table tbody tr.time-row.is-open > td { font-weight: 600; border-bottom-color: transparent; }

/* Buňka detailu — bez tabulkového paddingu, panel si řídí vlastní odsazení. */
.time-detail-row > td { padding: 0 0.35rem 0.6rem; border-bottom: 1px solid var(--c-273449); }
/* Odsazovací buňka přes první čtyři sloupce (Poř. · VK · VK · StČ) — nese jen
   spodní linku, aby panel začal PŘESNĚ na hraně sloupce Jméno; proto i buňce
   s panelem bereme levé odsazení. U hrany tabulky panel splýval s řádky nad
   i pod sebou a nebylo poznat, ke komu patří. */
.td-lead { padding: 0 0 0.6rem; }
.time-detail-row > .td-lead + td { padding-left: 0; }

/* Barevně odlišené okno (accent proužek vlevo, tmavší podklad než řádek). */
.td-panel {
  background: var(--c-0f172a);
  border: 1px solid var(--c-334155);
  border-left: 3px solid var(--accent);
  border-radius: 8px;
  padding: 0.5rem 0.7rem 0.55rem;
  display: flex; flex-direction: column; gap: 0.3rem;
}

/* 1. řádek — nacionále, tečkami oddělené doplňky. */
.td-nat {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.15rem 0.5rem;
  font-size: 0.84rem; color: var(--c-cbd5e1);
}
.td-stc { font-weight: 700; font-variant-numeric: tabular-nums; color: var(--c-94a3b8); }
.td-name { font-weight: 700; color: var(--c-e2e8f0); }
/* Posádka v detailu — pádleři pod sebou (stejně jako ve výsledkové buňce),
   ročník za jménem ztlumeně. */
.td-crew-member { display: block; }
.td-crew-year { font-weight: 400; color: var(--c-94a3b8); }
.td-nat-x { display: inline; color: var(--c-94a3b8); }
.td-nat-x .nx { white-space: nowrap; }
.td-nat-x .nx + .nx::before { content: "·"; margin: 0 0.35rem; color: var(--c-475569); }

/* Jízdy stojí VEDLE SEBE (dřív pod sebou) — čtou se tak proti sobě a panel
   je o polovinu nižší. Na úzkém displeji se zalomí pod sebe. */
.td-panel--runs {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 0.35rem 0.6rem;
  /* Modrý proužek u levé hrany panelu je pryč — jízdy si teď nesou vlastní
     podklad, takže by se značky dvojily. */
  border-left: 1px solid var(--c-334155);
}

/* Každá jízda má PEVNOU šířku a vlastní podbarvení — bez toho se dvě jízdy
   vedle sebe slévaly v jeden řádek čísel a nešlo poznat, kde jedna končí.
   Na úzkém displeji se roztáhnou přes celou šířku a zalomí pod sebe. */
.td-runline {
  /* 21 rem: dvě jízdy vedle sebe se vejdou i do nejužšího panelu (tabulka
     archivu bývá ~46 rem), a přitom se do řádku vejde i pár čipů branek. */
  flex: 0 0 21rem;
  max-width: 100%;
  padding: 0.15rem 0.5rem;
  border-radius: 6px;
}
/* Obě jízdy mají STEJNÝ podklad — rozliší je odznak „1J"/„2J", ne barva. */
.td-run--1,
.td-run--2 { background: rgba(148, 163, 184, 0.10); }
@media (max-width: 719.98px) {
  .td-runline { flex: 1 1 100%; }
}

/* 2./3. řádek — jedna jízda na řádku, hodnoty bez popisků (rozliší barva). */
.td-runline {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.15rem 0.5rem;
  font-size: 0.85rem; font-variant-numeric: tabular-nums;
}
.td-run-rank {
  font-weight: 700; color: var(--c-e2e8f0);
  min-width: 1.6rem;
}
.td-run-rank::after { content: none; }
.td-net { color: var(--c-cbd5e1); }
.td-pen { color: #f87171; font-weight: 700; }
.td-total { color: var(--c-fde047); font-weight: 700; }
.td-flt { color: #f87171; font-size: 0.74rem; font-weight: 700; }
.td-run-badge {
  font-size: 0.7rem; font-weight: 700; letter-spacing: 0.03em;
  padding: 0.02rem 0.35rem; border-radius: 4px;
  background: rgba(239, 68, 68, 0.16); color: #f87171;
}
.td-badge-dns { background: rgba(148, 163, 184, 0.18); color: var(--c-94a3b8); }

/* Čipy penalizace (MOBIL) = JEN číslo branky v barevném poli: žluté = dotek
   (2 s), červené = neprůjezd (50 s). Hodnota se neuvádí, nese ji barva pole.
   Protivodná branka = podtržené číslo. */
.td-gates { display: inline-flex; flex-wrap: wrap; gap: 0.25rem; margin-left: 0.25rem; }
.td-gate {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 1.15rem; padding: 0.04rem 0.34rem; border-radius: 4px;
  font-size: 0.78rem; font-weight: 700; line-height: 1.2;
  font-variant-numeric: tabular-nums;
}
/* Protivodná = podtržené číslo, stejné znamení jako v brankové matici. */
.td-gate-up { text-decoration: underline; text-underline-offset: 2px; }
.td-gate-touch { background: rgba(250, 204, 21, 0.22); color: var(--c-fde047); }
.td-gate-miss { background: rgba(239, 68, 68, 0.26); color: #fca5a5; }

/* HLÍDKA (závod družstev) — MŘÍŽKA místo čipu. Branku hodnotí rozhodčí každé
   ze tří lodí zvlášť a do matice jde jejich SOUČET (0/2/4/6/50/52/…), který
   barva vyjádřit neumí: barevný čip nese jen „dotek / neprůjezd". Součet se
   proto vypisuje ČÍSLEM pod číslem branky — a protože jsou obě hodnoty čísla,
   nese mřížka vlevo popisek řádků („br." / „pen."), ať se nedají zaměnit.
   Barva zůstává jako rychlé znamení: žlutá = pod hranicí neprůjezdu, červená
   = s neprůjezdem. */
.td-gsums {
  display: inline-flex; flex-wrap: wrap; gap: 0.2rem;
  margin-left: 0.25rem; align-items: flex-start;
}
.td-gsum {
  display: inline-flex; flex-direction: column;
  min-width: 1.6rem; border: 1px solid var(--c-334155); border-radius: 4px;
  overflow: hidden; line-height: 1.3; font-variant-numeric: tabular-nums;
}
/* Horní patro = číslo branky: ztlumené a menší, ať dominuje hodnota. */
.td-gsum-gate {
  display: block; text-align: center; padding: 0 0.3rem;
  font-size: 0.68rem; font-weight: 600; color: var(--c-94a3b8);
  background: rgba(148, 163, 184, 0.14);
  border-bottom: 1px solid var(--c-334155);
}
/* Dolní patro = penalizace v sekundách. */
.td-gsum-val {
  display: block; text-align: center; padding: 0.02rem 0.3rem;
  font-size: 0.78rem; font-weight: 700; color: var(--c-cbd5e1);
}
/* Protivodná = podtržené číslo branky, stejné znamení jako v brankové matici. */
.td-gsum-up { text-decoration: underline; text-underline-offset: 2px; }
.td-gsum-touch .td-gsum-val { background: rgba(250, 204, 21, 0.22); color: var(--c-fde047); }
.td-gsum-miss .td-gsum-val { background: rgba(239, 68, 68, 0.26); color: #fca5a5; }
/* Popisek řádků — bez rámečku a výplně, ať se nečte jako další branka. */
.td-gsum-legend { border-color: transparent; min-width: 0; }
.td-gsum-legend .td-gsum-gate,
.td-gsum-legend .td-gsum-val {
  background: none; border-bottom-color: transparent;
  color: var(--c-475569); font-weight: 600; font-size: 0.64rem;
  text-align: right; padding-right: 0.2rem; padding-left: 0;
}
/* Světlý motiv: #fca5a5 je na bledě červené výplni nečitelné. */
:root[data-theme="light"] .td-gsum-miss .td-gsum-val { color: #b91c1c; }
/* Světlý motiv: čip neprůjezdu měl světle červené písmo na světle červeném
   poli — „50" se v něm ztrácelo. Totéž u doteku se žlutou. */
:root[data-theme="light"] .td-gate-miss { color: #b91c1c; }
:root[data-theme="light"] .td-gate-touch { color: #854d0e; }
:root[data-theme="light"] .td-gsum-touch .td-gsum-val { color: #854d0e; }

/* Desktop (≥720px): řádky jízd zůstávají STEJNÉ jako na mobilu (pořadí ·
   čistý čas · penalizace · výsledek · čísla penalizovaných branek). Skryje se
   jen řádek nacionále — ten na desktopu nese sama tabulka (NAR/VT/Oddíl/VK). */
@media (min-width: 720px) {
  .td-nat { display: none; }
  .td-panel { gap: 0.25rem; }
}

/* Mobil (<720px): detailové sloupce pryč, tabulka je kompaktní.
   Odsazení panelu pod jméno se ruší — na telefonu je šířka drahá (čipy branek
   se lámaly do dvou řádků) a hlavně tam panel VEDE řádkem nacionále (STČ +
   jméno), takže je i bez odsazení jasné, komu patří. Na desktopu je nacionále
   skrytá, a právě proto se tam panel pod jméno odsadit MUSÍ. */
@media (max-width: 719.98px) {
  .time-col-detail { display: none; }
  .td-lead { display: none; }
}

/* Mobil (<720px) — výsledky časových disciplín (LIVE panel i statická stránka
   Výsledky; .time-table je výhradně výsledková tabulka): vejít se na šířku
   obrazovky. Pořadí zarovnané doleva a bez levého odsazení (posun vlevo), jméno
   jen příjmení (.time-given skryto), a jen výsledek bez penalizací (sloupec ČAS
   .time-col-net + .time-pen pryč). */
@media (max-width: 719.98px) {
  .time-table .time-col-net,
  .time-table .time-pen,
  .time-table .time-given { display: none; }
  /* Dvoukolovka: trestné body pryč celé (sloupec i hlavička — prázdný úzký
     sloupec s nadpisem „PEN" jen ukusoval šířku), sloupce se prohodí na
     Výsledek · 1. jízda · 2. jízda přepnutím obou kopií VÝSLEDKU. */
  .time-table .time-run-pen,
  .time-table .time-col-wide { display: none; }
  .time-table .time-col-mobile { display: table-cell; }
  .time-table { font-size: 0.85rem; }
  .time-table th,
  .time-table td { padding: 0.35rem 0.3rem; }
  .time-table th:first-child,
  .time-table td:first-child {
    padding-left: 0.1rem; text-align: center;
  }
  .time-table .time-name {
    min-width: 0; white-space: nowrap;
  }
}

/* Startovka časových dvoukolových formátů (.sl-two-runs): oba startovní
   časy vedle sebe jako samostatné sloupce — mobil 4 sloty, desktop 8. */
.startlist.sl-two-runs .sl-head,
.startlist.sl-two-runs .tt-row-startlist {
  grid-template-columns: 2.5rem 1fr auto auto;
}
@media (min-width: 720px) {
  .startlist.sl-two-runs .sl-head,
  .startlist.sl-two-runs .tt-row-startlist {
    grid-template-columns: 2.5rem minmax(7rem, 1.4fr) 3.5rem 3rem 2.75rem minmax(5rem, 1fr) 5rem 5rem;
  }
}
.tt-row-startlist .tt-row-time2 { text-align: right; color: var(--c-cbd5e1); }

/* Startovka finále s výsledky předchozích fází (.sl-prior / .sl-prior-fb):
   Kvalifikace u obou finále, u Finále A navíc Finále B. Sloupce jsou
   běžné .sl-cell, takže na mobilu zůstávají skryté (jdou do souhrnu pod
   jménem) a přibývají jen na desktopu — mobilní mřížka se nemění. */
@media (min-width: 720px) {
  .startlist.sl-prior .sl-head,
  .startlist.sl-prior .tt-row-startlist {
    grid-template-columns: 2.5rem minmax(7rem, 1.4fr) 3.5rem 3rem 2.75rem minmax(5rem, 1fr) 4.5rem 5rem;
  }
  .startlist.sl-prior.sl-prior-fb .sl-head,
  .startlist.sl-prior.sl-prior-fb .tt-row-startlist {
    grid-template-columns: 2.5rem minmax(7rem, 1.4fr) 3.5rem 3rem 2.75rem minmax(5rem, 1fr) 4.5rem 4.5rem 5rem;
  }
  .sl-head-prior { text-align: right; }
  .tt-row-startlist .sl-cell-prior {
    text-align: right;
    font-variant-numeric: tabular-nums;
  }
  /* Započítaná jízda (lepší z obou) — zvýrazněná ve svém zdrojovém sloupci;
     samostatný sloupec „Lepší" se nevypisuje. */
  .tt-row-startlist .sl-cell-counted { color: var(--c-e2e8f0); font-weight: 600; }
}

/* ═══════════════════════════════════════════════════════════════════════
   LIVE pohled časové disciplíny (time_live.html) — event-level scoreboard
   „na trati" + přepínač typu scoreboardu + spodní přepínač fází.
   Používá paletové proměnné (--c-*), které se ve světlém motivu přemapují,
   takže je celý blok theme-aware bez extra overridů.
   ═══════════════════════════════════════════════════════════════════════ */

/* Přepínač „Živý čas v pořadí" na časových disciplínách sdílí komponent
   .tt-live-toggle s kros TT (styl viz ~ř. 965). Dřívější přepínač TYPU
   scoreboardu (.time-sb-toggle, matrix/compact/clock) byl odstraněn —
   scoreboard „na trati" je teď jednotná LED tabule (viz .time-live-board). */

/* Živá kategorie v horní liště — červená pulzující tečka */
.tt-cat-live-dot {
  display: inline-block; width: 7px; height: 7px; margin-left: 0.4rem;
  border-radius: 50%; background: #ef4444;
  animation: time-live-ping 1.6s ease-out infinite;
}
@keyframes time-live-ping {
  0%   { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.55); }
  70%  { box-shadow: 0 0 0 6px rgba(239, 68, 68, 0); }
  100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0); }
}

/* Kontejner — rezerva pod fázovou lištou (sticky pruh NAD app dockem). Platí
   jen když se lišta opravdu renderuje: partial _time_phase_dock.html dnes není
   nikam vložený, takže bezpodmínečná rezerva byla 60 px prázdna navíc a sama
   vyrobila přetečení stránky (svislý scrollbar) na nižších oknech. Místo pro
   app dock (56 px) drží .site-main, to se nemění. */
body:has(.time-phase-dock) .time-live { padding-bottom: 60px; }

/* Prázdný stav scoreboardu „na trati" */
.time-live-empty {
  text-align: center; color: var(--c-94a3b8); font-weight: 600;
  padding: 1.6rem 1rem; background: var(--c-1e293b);
  border: 1px dashed var(--c-334155); border-radius: 10px; margin: 0.5rem 0;
}

/* Výsledky aktivní fáze (bez ručního přepínače — auto-follow live fáze) */
.time-phase-panel.is-hidden { display: none; }

/* „Živý čas v pořadí" — projekce běžícího závodníka ze scoreboardu do
   výsledkové tabulky aktivní fáze (time_live.js, off/light/full). Vizuálně
   SHODNÉ s kros TT: full = LED řádek (.tt-row--live), light = svítící žlutá
   dělící čára + pilulka „STČ · jméno" (.tt-rank-marker). Default off. */
/* full = LED řádek: černý podklad, žlutý monospace, svítící hodiny, žlutý rám. */
.time-proj-row > td {
  background: var(--c-0a0a0a);
  color: var(--c-facc15);
  font-family: ui-monospace, "SF Mono", Monaco, "Cascadia Code",
               "Roboto Mono", Consolas, "Liberation Mono",
               "Courier New", monospace;
  font-weight: 700;
  /* Rám = JEN spodní žlutá linka. Horní hranu drží běžné dělítko předchozího
     řádku (tabulka má `border-collapse: collapse`, takže se o sdílenou hranu
     dělí se sousedem a při shodné šířce i stylu vyhraje soused — je dřív ve
     stromu). Tenhle vzhled je kanonický pro celý web, kros .tt-row--live ho
     kopíruje: žlutá linka jen pod řádkem, nahoře nic navíc. Dvě sousední
     projekce tak mezi sebou mají žlutou (dolní linka horního řádku). */
  border-bottom: 1px solid rgba(250, 204, 21, 0.5);
  /* Tenká horní linka — stejná jako spodní, ať řádek drží mezi dvěma linkami.
     Inset stín, ne `border-top`: tabulka jede na `border-collapse: collapse`,
     takže o sdílenou hranu by se řádek dělil se sousedem (a při shodné šířce
     by vyhrál soused, protože je dřív ve stromu) — a širší border by navíc
     posunul výšku řádku. */
  box-shadow: inset 0 1px 0 rgba(250, 204, 21, 0.5);
}
/* Levý žlutý proužek — parita s kros `.tt-row--live` a se zvýrazněným řádkem
   `.time-row--running`: říká „tenhle závodník je NA TRATI". Jen na první buňce,
   ta drží levou hranu řádku; ostatní buňky nesou pouze horní linku. */
.time-proj-row > td:first-child {
  box-shadow: inset 3px 0 0 var(--c-facc15),
              inset 0 1px 0 rgba(250, 204, 21, 0.5);
}
/* Optická korekce svislé polohy — shodně s kros živým řádkem
   (.tt-row--live). Řádek má barevný podklad (LED černý / ve světlém režimu
   žlutý), takže je vidět, že ink písma sedí v line-boxu výš: pod účařím
   zůstává nevyužité místo pro dolní dotažnice, které STČ/jméno/hodiny nemají.

   NEDĚLAT paddingem: `:root[data-density="compact"] .time-table td`
   (specificita 0,3,1) přebíjí `.time-proj-row > td` (0,1,1), takže korekce
   z v0.9x platila jen v normálním řádkování — v kompaktním i vzdušném se
   zahazovala. Proto posun obsahu přes `position: relative; top` na buňkách:
   nemění výšku řádku, škáluje s písmem a density pravidla na `top` nesahají.

   Měřeno po pixelech (scale 4, ink nad/pod uvnitř border-boxu), bez korekce:
     normální   7,86 / 12,03 → potřeba 2,09 px = 0.14em
     kompaktní  1,11 /  4,14 → potřeba 1,51 px = 0.13em
     vzdušná   11,88 / 13,89 → potřeba 1,01 px = 0.06em
   Chromium posun zaokrouhluje na celé CSS px, takže v kompaktním vyjdou 2 px
   (ideál 1,5 px nedosažitelný) — zbytek raději pod střed, stížnost byla
   „text u horní linky". */
.time-proj-row > td {
  position: relative;
  top: 0.14em;
}
:root[data-density="compact"] .time-proj-row > td { top: 0.13em; }
:root[data-density="airy"] .time-proj-row > td { top: 0.06em; }
.time-proj-row .time-rank,
.time-proj-row .time-name { color: var(--c-facc15); }
/* `.time-proj-final` = PŘEDBĚŽNÝ čas dojetého, který čeká na odbavení branek,
   promítnutý do pořadí (režim „plný řádek"). Hodiny už doběhly, takže je
   statický — vypadat ale musí stejně jako projekční hodiny, protože je to
   týž řádek téže tabule; že je předběžný, říká BLIKÁNÍ (`.is-prov` níž),
   ne jiná barva. */
.time-proj-final,
.time-proj-clock {
  color: var(--c-facc15); font-weight: 700; font-variant-numeric: tabular-nums;
  letter-spacing: 0.03em; text-shadow: 0 0 6px rgba(250, 204, 21, 0.4);
}
/* Trestné sekundy v projekčním řádku: odstup od času, ať `+4 1:12,10` nesplyne
   v jedno číslo. Na kartě ho dělá mřížka (gap), v buňce tabulky není co dělit.
   Pravidlo sedí ZA základním `.gm-pen` schválně — test `_rule(css, ".gm-pen")`
   hledá první výskyt neukotveně, takže dřív by mu vrátilo tohle. */
.time-proj-row .gm-pen { margin-right: 0.45em; }
/* Matice branek POD plným řádkem (režim „plný řádek") — klon `.gm-gates`
   z karty scoreboardu (time_live.js: buildProjGates), takže dlaždice si nesou
   svoje `.gm-*` třídy a platí pro ně TÁŽ pravidla jako na tabuli (proto jsou
   výš rozšířené o `.time-proj-gates` místo druhé sady hodnot). Ve full módu
   se scoreboard skrývá, takže je to jediné místo, kde jsou odbavené branky
   běžícího vidět. Pás pokračuje podkladem řádku a spodní žlutá linka se
   z řádku stěhuje pod matici (`has-proj-gates`), ať se dvojice čte jako jedna
   karta a ne jako dva řádky listiny. */
.time-proj-row.has-proj-gates > td { border-bottom: none; }
.time-proj-gates > td {
  background: var(--c-0a0a0a);
  border-bottom: 1px solid rgba(250, 204, 21, 0.5);
  padding-top: 0;
  padding-bottom: 0.3rem;
}
/* Proužek „na trati" pokračuje i pod matici — dvojice řádek + branky se čte
   jako jedna karta, takže by proužek useknutý v půlce vypadal jako chyba.
   Horní linka tu být NESMÍ: pás navazuje na řádek (`has-proj-gates` mu proto
   ruší spodní linku) a linka mezi nimi by kartu rozpůlila. */
.time-proj-gates:not(.time-proj-gates--run) > td:first-child {
  box-shadow: inset 3px 0 0 var(--c-facc15);
}
/* Závodník, který dosedl na svůj vlastní řádek (markRunningRow — formáty „na
   lepší jízdu"): pás má tlumené ladění zvýrazněného řádku včetně levého
   proužku, aby matice zůstala jeho součástí a nevypadala jako cizí LED
   vsuvka v listině. */
.time-proj-gates--run > td {
  background: rgba(250, 204, 21, 0.1);
  border-bottom: none;
  box-shadow: inset 3px 0 0 var(--c-facc15);
}
/* light = svítící žlutá dělící čára (::before přes celou šířku) + pilulka
   „STČ · jméno" na ní (mirror .tt-rank-marker / .tt-rank-marker-chip). */
/* Výšku buňky drží jen strut (ZWSP v ::after) — pilulka je mimo tok, stejně
   jako u kros .tt-rank-marker-chip. Padding ZÁMĚRNĚ nepřepisujeme: nechá se na
   `.time-table td` (včetně density i mobilní varianty), takže dělící čára je
   přesně jeden řádek tabulky — shodně s režimem „plný řádek" (.time-proj-row).
   Vlastní `padding: 0.4rem 0.5rem` tu dřív přebíjelo mobilní 0.35rem/0.3rem. */
.time-proj-cut > td { position: relative; }
.time-proj-cut > td::after { content: "\200B"; }
.time-proj-cut > td::before {
  content: ""; position: absolute; left: 0.5rem; right: 0.5rem; top: 50%;
  height: 2px; transform: translateY(-50%);
  background: var(--c-facc15); box-shadow: 0 0 6px rgba(250, 204, 21, 0.55);
}
.time-proj-chip {
  /* mimo tok (left = padding buňky 0.5rem + odsazení 2.5rem), na čáře */
  position: absolute; z-index: 1; top: 50%; left: 3rem;
  transform: translateY(-50%);
  display: inline-flex; align-items: center;
  gap: 0.35rem; padding: 0.06rem 0.5rem;
  background: var(--c-facc15); color: var(--c-0a0a0a); border-radius: 999px;
  font-size: 0.74rem; line-height: 1; font-weight: 700;
  box-shadow: 0 0 0 2px var(--c-0f172a);
}
.time-proj-chip-stc {
  font-variant-numeric: tabular-nums; padding-right: 0.35rem;
  border-right: 1px solid rgba(10, 10, 10, 0.35);
}
.time-proj-chip-name { font-weight: 700; }

/* Závodník PRÁVĚ NA TRATI ve formátu „na lepší jízdu" (Finále B best(KVAL, FB),
   2. jízda dvouběhu): dokud si nepolepšil, drží svůj dosavadní čas i pořadí —
   projekční duplikát by mu stál na vlastním řádku, tak se místo něj zvýrazní
   rovnou ten řádek (time_live.js: markRunningRow) a do buňky probíhající jízdy
   se vloží běžící hodiny. Tlumené LED ladění (žlutá), aby řádek zůstal čitelný
   jako součást listiny — na rozdíl od .time-proj-row, který je celý LED. */
.time-row--running > td {
  background: rgba(250, 204, 21, 0.1);
}
.time-row--running > td:first-child {
  box-shadow: inset 3px 0 0 var(--c-facc15);
}
:root[data-theme="light"] .time-row--running > td {
  background: rgba(250, 204, 21, 0.28);
}
.time-live-panels { margin-top: 0.9rem; }
/* Nadpis fáze nad výsledky (jen finále A/B — říká, která fáze se ukazuje) */
.time-phase-heading {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0.2rem 0 0.5rem;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--c-e2e8f0);
}

/* Spodní přepínač fází — sticky pruh NAD app dockem (.site-dock = 56px). */
.time-phase-dock {
  position: fixed; left: 0; right: 0;
  bottom: calc(56px + env(safe-area-inset-bottom, 0));
  background: var(--c-0f172a);
  border-top: 1px solid var(--c-273449);
  z-index: 98;
}
.time-phase-dock-inner {
  display: flex; width: 100%; max-width: 900px; margin: 0 auto; gap: 2px;
  padding: 0.25rem 0.4rem;
}
.time-phase-btn {
  flex: 1; display: inline-flex; align-items: center; justify-content: center;
  gap: 0.4rem; position: relative; min-height: 44px; padding: 0.35rem 0.5rem;
  background: transparent; color: var(--c-94a3b8);
  border: 1px solid transparent; border-radius: 8px;
  font-family: inherit; font-weight: 700; font-size: 0.9rem; cursor: pointer;
}
.time-phase-btn:hover { background: rgba(255, 255, 255, 0.06); color: var(--c-e2e8f0); }
.time-phase-btn.active { background: var(--accent); color: #fff; }
.time-phase-btn.is-empty { opacity: 0.5; }
.time-phase-ico { width: 20px; height: 20px; flex: 0 0 auto; }
.time-phase-letter { font-size: 1.1rem; font-weight: 800; line-height: 1; }
.time-phase-label { white-space: nowrap; }
.time-phase-live-dot {
  width: 7px; height: 7px; border-radius: 50%; background: #ef4444; flex: 0 0 auto;
  animation: time-live-ping 1.6s ease-out infinite;
}
.time-phase-btn.active .time-phase-live-dot { background: #fff; }

/* Úzký mobil: schovej textový popisek (nech ikonu/písmeno) */
@media (max-width: 519.98px) {
  .time-phase-label { display: none; }
}

/* ── Dlaždice disciplíny v seznamu závodů (landing) ───────────────────────
   Barva + tvar glyfu nesou disciplínu dvakrát → čitelné i při barvosleposti.
   Paleta se drží stejného mapování jako admin seznam závodů (KXRS
   studio-bridge.css), aby pořadatel i divák četli tutéž značku. Odstíny
   jsou laděné na tmavý default; light motiv jen ztmaví inkoust. */
.disc-tile--kayak_cross      { --d: #2bb6c9; --d-ink: #6fdcea; }
.disc-tile--slalom           { --d: #d6486b; --d-ink: #ff86a8; }
.disc-tile--downhill_classic { --d: var(--accent); --d-ink: #7fb0ff; }
.disc-tile--downhill_sprint  { --d: #6d5cd6; --d-ink: #b5a8ff; }
.disc-tile--raft             { --d: #c98414; --d-ink: #eab54f; }
:root[data-theme="light"] .disc-tile--kayak_cross      { --d-ink: #067382; }
:root[data-theme="light"] .disc-tile--slalom           { --d-ink: #b83557; }
:root[data-theme="light"] .disc-tile--downhill_classic { --d-ink: var(--accent); }
:root[data-theme="light"] .disc-tile--downhill_sprint  { --d-ink: #5546b8; }
:root[data-theme="light"] .disc-tile--raft             { --d-ink: #a06a0c; }

.disc-tile {
  display: inline-flex; align-items: center; justify-content: center;
  width: 24px; height: 24px; border-radius: 7px; flex: 0 0 auto;
  background: color-mix(in srgb, var(--d) 18%, transparent);
  border: 1px solid color-mix(in srgb, var(--d) 30%, transparent);
  color: var(--d-ink);
}
.disc-tile-ico { width: 15px; height: 15px; display: block; }
/* Název je pružný — dlouhé názvy se lámou uvnitř, dlaždice nesmí zúžit.
   align-items:center drží glyf na optické ose i u dvouřádkového názvu. */
.event-name-wrap { display: flex; align-items: center; gap: 9px; min-width: 0; }

/* ===========================================================================
   ARCHIV puvodniho results.cz (1986-2026) — staticke stranky, prefix `.arch-`.
   Vlastni prefix schvalne: `.archive-*` uz patri sbalenemu seznamu starsich
   PUBLIKOVANYCH zavodu na landingu, coz je neco jineho. Barvy jen z tokenu,
   aby archiv drzel svetly i tmavy motiv.
   =========================================================================== */
.arch-page { max-width: 62rem; margin: 0 auto; padding: 1rem 1rem 2rem; }
.arch-page-wide { max-width: 76rem; }
.arch-h1 { font-size: 1.5rem; margin: 0 0 .25rem; color: var(--c-f1f5f9); }
.arch-h1-sub { font-size: 1rem; font-weight: 400; color: var(--muted); }
.arch-h2 { font-size: 1.05rem; margin: 1.5rem 0 .5rem; color: var(--c-e2e8f0); }
.arch-lead { color: var(--muted); margin: 0 0 1rem; line-height: 1.5; }
.arch-link { color: var(--accent); text-decoration: none; white-space: nowrap; }
.arch-link:hover { text-decoration: underline; }
.arch-crumbs {
  font-size: .82rem; color: var(--muted); margin: 0 0 .75rem;
  display: flex; align-items: center; gap: .75rem;
}
.arch-crumbs a { color: var(--accent); text-decoration: none; }

/* Šipky na předchozí/další závod — nástroj na procházení archivu kus po kuse
   (totéž umí klávesy ←/→, viz `archiv_sousedi.js`). Na kraji archivu zůstane
   šipka na místě, jen zešedne: mizející ovladač by posouval ten druhý. */
.arch-sousedi { display: inline-flex; gap: .25rem; margin-left: auto; }
.arch-soused {
  display: inline-flex; align-items: center; justify-content: center;
  width: 1.9rem; height: 1.9rem; border-radius: 6px;
  border: 1px solid var(--card-border); font-size: 1.1rem; line-height: 1;
  color: var(--accent); text-decoration: none;
}
.arch-soused:hover { background: var(--card-bg); text-decoration: none; }
.arch-soused.is-disabled { color: var(--c-475569); border-color: var(--line); }

.arch-search { display: flex; gap: .5rem; margin: 0 0 1.25rem; max-width: 30rem; }
.arch-search input {
  flex: 1; min-width: 0; padding: .5rem .7rem; border-radius: 8px;
  border: 1px solid var(--card-border); background: var(--c-0f172a);
  color: var(--c-e2e8f0); font-size: .95rem;
}
.arch-search button {
  padding: .5rem 1rem; border-radius: 8px; border: 1px solid var(--card-border);
  background: var(--card-bg); color: var(--c-e2e8f0); cursor: pointer;
}
.arch-search button:hover { background: var(--c-273449); }

.arch-year-grid { display: grid; gap: .5rem; grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr)); }
.arch-year {
  display: flex; flex-direction: column; gap: .15rem; padding: .6rem .75rem;
  border-radius: 10px; border: 1px solid var(--card-border);
  background: var(--card-bg); text-decoration: none;
}
.arch-year:hover { border-color: var(--accent); }
.arch-year-num { font-size: 1.15rem; font-weight: 600; color: var(--c-f1f5f9); }
.arch-year-count { font-size: .78rem; color: var(--muted); }

.arch-year-nav { display: flex; flex-wrap: wrap; gap: .3rem; margin: 0 0 1.25rem; }
.arch-year-chip {
  padding: .2rem .55rem; border-radius: 999px; font-size: .8rem;
  border: 1px solid var(--card-border); color: var(--muted); text-decoration: none;
}
.arch-year-chip.is-current { background: var(--accent); color: #04121c; border-color: var(--accent); }

.arch-table-wrap { overflow-x: auto; width: fit-content; max-width: 100%; }
.arch-table { width: auto; border-collapse: collapse; font-size: .9rem; }
.arch-table th {
  text-align: left; font-size: .72rem; text-transform: uppercase;
  letter-spacing: .04em; color: var(--muted); padding: .35rem .5rem;
  border-bottom: 1px solid var(--card-border); white-space: nowrap;
}
.arch-table td { padding: .4rem .5rem; border-bottom: 1px solid var(--c-243245); vertical-align: top; }
.arch-table a { color: var(--c-e2e8f0); text-decoration: none; }
.arch-table a:hover { color: var(--accent); }
.arch-date, .arch-col-num { white-space: nowrap; color: var(--muted); }
.arch-col-num { text-align: right; font-variant-numeric: tabular-nums; }
.arch-venue { color: var(--muted); }
.arch-file {
  display: inline-block; font-size: .75rem; padding: .1rem .4rem; margin-right: .25rem;
  border: 1px solid var(--card-border); border-radius: 5px;
  color: var(--muted); text-decoration: none;
}
.arch-file:hover { border-color: var(--accent); color: var(--accent); }
.arch-downloads { color: var(--muted); font-size: .85rem; margin: 1rem 0; }

.arch-cats { display: flex; flex-wrap: wrap; gap: .4rem; }
.arch-cat {
  display: flex; flex-direction: column; gap: .1rem; padding: .45rem .7rem;
  border: 1px solid var(--card-border); border-radius: 9px;
  background: var(--card-bg); text-decoration: none; min-width: 6rem;
}
.arch-cat:hover { border-color: var(--accent); }
.arch-cat-code { font-weight: 600; color: var(--c-f1f5f9); }
.arch-cat-meta { font-size: .72rem; color: var(--muted); }
.arch-cats-inline { margin: 0 0 1rem; }
.arch-cat-chip {
  padding: .2rem .55rem; border-radius: 999px; font-size: .8rem;
  border: 1px solid var(--card-border); color: var(--muted); text-decoration: none;
}
.arch-cat-chip.is-current { background: var(--accent); color: #04121c; border-color: var(--accent); }
/* Nápověda nad listinou (řádky se rozbalují klikem). */
.arch-hint { font-size: .78rem; color: var(--muted); margin: 0 0 .4rem; }

/* Výsledková listina archivu — tabulka drží šířku obsahu, ne monitoru.
   Sloupce v pořadí čtení (Poř. · StČ · jméno · oddíl · časy · výsledek ·
   body); ročník, VK, VT a branky jsou v rozbalovacím detailu (`.td-*`,
   stejný panel jako u živých výsledků). Bez toho se listina roztáhla přes
   celou šířku a mezi pořadím vlevo a časem vpravo byl půlmetr prázdna.
   Pruhování je na TŘÍDĚ z šablony, ne `:nth-child` — mezi výsledkovými
   řádky stojí skryté řádky detailu a parita by se převracela. */
.arch-results-wrap { width: fit-content; max-width: 100%; }
/* Tabulka sedne na OBSAH (`width: auto`), ne na šířku okna — `.time-table`
   má `width: 100%` a na monitoru se listina napínala na 1180 px, takže mezi
   pořadím vlevo a časem vpravo zbyl pruh prázdna. Rám kolem tabulky se drží
   její šířky (`fit-content`), aby se nenapínal zvlášť. */
.arch-results { width: auto; font-size: .86rem; }
.arch-results tbody tr.time-row-clickable:hover > td,
.arch-results tbody tr.time-row.is-open > td { background: var(--c-1e293b); }
.arch-results td.arch-col-stc { color: var(--muted); }
.arch-results .arch-col-club { max-width: 12rem; overflow: hidden; text-overflow: ellipsis; }
.arch-results td.arch-col-pts { color: var(--muted); }
/* Odznak jízdy („1J" / „2J") — krátký, ať zabere co nejmíň místa a přesto
   řekne, ke které jízdě řádek patří. Barvu drží stejnou jako podklad jízdy. */
.td-run-tag {
  flex: 0 0 auto; min-width: 1.6rem; text-align: center;
  padding: 0 .3rem; border-radius: 4px;
  font-size: .72rem; font-weight: 700; letter-spacing: .04em;
  background: rgba(148, 163, 184, .18); color: var(--c-e2e8f0);
}

.td-clean { color: var(--muted); font-size: .78rem; }
/* Nulová penalizace je informace „čistá jízda", ne trest — červená jako
   u ostatních čísel ve sloupci by mátla. */
.arch-results .time-pen-zero { color: var(--muted); }
/* Řádek nacionálií v panelu živá listina na desktopu SKRÝVÁ — tam je nese
   sama tabulka (NAR/VK/VT/Oddíl). Archiv tyhle sloupce v tabulce nemá (kvůli
   šířce), takže ho tu naopak potřebuje i na desktopu. */
@media (min-width: 720px) {
  .arch-results .td-nat { display: flex; }
}
/* Panel nesmí tabulku ROZTÁHNOUT: tabulka archivu se šířkou řídí obsahem
   (`width: auto`), takže by dlouhý řádek nacionálií u posádky při rozbalení
   posunul sloupce a listina by pod rukou „poskočila". Strop šířky panelu to
   drží — delší text se zalomí. */
/* Panel nesmí tabulku ROZTÁHNOUT: šířku si tabulka bere z obsahu
   (`width: auto`), takže by rozbalený detail posunul sloupce a listina by
   pod rukou „poskočila". `width: 0` vyřadí panel z výpočtu šířky tabulky,
   `min-width: 100%` mu pak dá celou buňku. */
.arch-results .td-panel { width: 0; min-width: 100%; }
/* U posádky je v oddílu/VT/VK slepeno víc hodnot („KK Opava · Val.Mez."):
   `nowrap` z živé listiny by takový text vystrčil z panelu ven. */
.arch-results .td-nat-x .nx { white-space: normal; }
/* Mobil: sloupce jednotlivých jízd pryč — na šířku telefonu se vejde jen to
   podstatné (pořadí · StČ · jméno · výsledek), časy jízd i body jsou
   v rozbaleném detailu. */
@media (max-width: 719.98px) {
  .arch-results .arch-col-run { display: none; }
  /* Bez sloupců jízd se tabulka na telefonu smrskne na pár centimetrů —
     tam ať naopak vyplní šířku obrazovky. */
  .arch-results, .arch-results-wrap { width: 100%; }
}

.arch-list { list-style: none; padding: 0; margin: 0 0 1rem; }
.arch-list li { padding: .35rem 0; border-bottom: 1px solid var(--c-243245); }
.arch-list a { color: var(--c-e2e8f0); text-decoration: none; }
.arch-list a:hover { color: var(--accent); }
.arch-meta { display: block; font-size: .78rem; color: var(--muted); }

.arch-dl { display: grid; grid-template-columns: auto 1fr; gap: .2rem 1rem; font-size: .88rem; }
.arch-dl dt { color: var(--muted); }
.arch-dl dd { margin: 0; color: var(--c-e2e8f0); }

.arch-timeline { list-style: none; padding: 0; margin: 1rem 0; }
.arch-milestone { display: flex; gap: 1rem; padding: .6rem 0; border-bottom: 1px solid var(--c-243245); }
.arch-milestone-year {
  font-size: 1.1rem; font-weight: 600; color: var(--accent);
  min-width: 3.5rem; font-variant-numeric: tabular-nums;
}
.arch-milestone-body { display: flex; flex-direction: column; gap: .5rem; }
.arch-milestone-body strong { color: var(--c-f1f5f9); }
.arch-milestone-body p { margin: .2rem 0 .4rem; color: var(--muted); font-size: .88rem; }
/* Rok drží víc akcí (v roce 1995 tři, v roce 2007 taky) — každá na svém
   řádku, odkazy pod popisem, ať se nemíchají mezi sebou. */
.arch-milestone-akce { display: flex; flex-direction: column; gap: .2rem; }
.arch-milestone-odkazy { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; font-size: .82rem; }

/* ===== Firemní web (www.results.cz) — `templates/site/*` =====
   Textové stránky vedle výsledkových tabulek: široké řádky by se špatně četly,
   proto je obsah v úzkém sloupci (62rem jako archiv). Barvy jdou VÝHRADNĚ
   z tokenů, aby stránky fungovaly ve světlém i tmavém motivu — literál by
   v jednom z nich zmizel. ===== */
.co-page { max-width: 62rem; margin: 0 auto; padding: 1.25rem 1rem 2.5rem; }
.co-h1 { font-size: 1.75rem; line-height: 1.2; margin: 0 0 .75rem; color: var(--c-f1f5f9); }
.co-h2 { font-size: 1.15rem; margin: 0 0 .5rem; color: var(--c-e2e8f0); }
.co-kicker {
  font-size: .78rem; letter-spacing: .12em; text-transform: uppercase;
  color: var(--muted); margin: 0 0 .35rem;
}
.co-lead { font-size: 1.05rem; line-height: 1.6; color: var(--c-cbd5e1); margin: 0 0 1rem; }
.co-page p { line-height: 1.6; color: var(--c-cbd5e1); }
.co-muted { color: var(--muted); }
.co-small { font-size: .85rem; }
:where(.co-page) a { color: var(--accent); }

.co-hero { padding: .5rem 0 1.5rem; border-bottom: 1px solid var(--c-334155); margin-bottom: 1.5rem; }
/* Logo v hero: světelná tabule i se svým černým pozadím (rohy zaobluje CSS,
   obrázek je JPEG — kvantizované PNG rozbilo plynulou záři kolem diod). */
.co-hero-logo {
  display: block; width: 100%; max-width: 30rem; height: auto;
  border-radius: 14px; margin: 0 0 1.1rem;
}
:root:not([data-theme="light"]) .co-hero-logo { outline: 1px solid rgba(255, 255, 255, .12); }
.co-cta { display: flex; flex-wrap: wrap; gap: .6rem; margin: 1.25rem 0 0; }
/* Tlačítka jsou odkazy; barvu si nesou samy. Výchozí pravidlo pro odkazy
   uvnitř stránky je zapsané přes `:where()` (nulová specificita), takže je
   nepřebije — dřív z toho byl modrý text na modrém pozadí. */
.co-btn {
  display: inline-block; padding: .55rem 1.1rem; border-radius: 8px;
  border: 1px solid var(--c-334155); background: var(--c-1e293b);
  color: var(--c-e2e8f0); text-decoration: none; font-weight: 600; font-size: .95rem;
}
.co-btn:hover { border-color: var(--accent); }
/* Hlavní tlačítko nese barvu akcentu jako výplň, text je proto tmavý —
   akcent je v obou motivech světlý. */
.co-btn--primary { background: var(--accent); border-color: var(--accent); color: #0a0a0a; }
.co-btn--primary:hover { filter: brightness(1.08); }
.co-btn--small { padding: .35rem .7rem; font-size: .85rem; font-weight: 500; }

.co-section { margin: 0 0 2rem; }
.co-section--split { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.co-section--ask {
  border: 1px solid var(--c-334155); border-radius: 12px; padding: 1.1rem 1.25rem;
  background: var(--c-0f172a);
}
.co-more { margin: .6rem 0 0; font-size: .95rem; }
.co-contact-line { font-size: 1rem; }
.co-list { margin: .5rem 0 0; padding-left: 1.2rem; color: var(--c-cbd5e1); line-height: 1.7; }

.co-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: 1rem; }
.co-card {
  border: 1px solid var(--c-334155); border-radius: 12px; padding: 1rem 1.1rem;
  background: var(--c-1e293b);
}
.co-card h3 { margin: 0 0 .4rem; font-size: 1rem; color: var(--c-f1f5f9); }
.co-card p { margin: 0; font-size: .92rem; }
.co-files { display: flex; flex-wrap: wrap; gap: .4rem; margin: .75rem 0 0 !important; }

.co-contact { display: grid; grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); gap: 1rem; margin: 0 0 2rem; }
.co-card--contact h2 { margin-top: 0; }
.co-addr { line-height: 1.5; }
.co-person { margin: 0 0 1.4rem; line-height: 1.6; }
.co-person:last-child { margin-bottom: 0; }

/* Galerie: mřížka náhledů, obrázek vyplní dlaždici (poměr stran fotek se
   liší, `object-fit` je srovná na společnou výšku). */
.co-photos { display: grid; grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); gap: .75rem; }
.co-photo { margin: 0; }
.co-photo img {
  width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block;
  border-radius: 8px; border: 1px solid var(--c-334155); background: var(--c-0f172a);
}
.co-photo figcaption { font-size: .8rem; color: var(--muted); margin-top: .3rem; line-height: 1.35; }

.co-videos { display: grid; grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr)); gap: .9rem; }
.co-video { display: block; text-decoration: none; color: inherit; }
.co-video img {
  width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block;
  border-radius: 8px; border: 1px solid var(--c-334155); background: var(--c-0f172a);
}
.co-video-title { display: block; margin-top: .35rem; font-size: .9rem; color: var(--c-e2e8f0); line-height: 1.35; }
.co-video-date { display: block; font-size: .78rem; color: var(--muted); }
.co-video:hover img { border-color: var(--accent); }

/* Navigace firemního webu v hlavičce — jednoduché odkazy vedle přepínačů.
   Na úzké obrazovce se schová všechno kromě archivu; ostatní sekce jsou
   v patičce, takže se k nim dá dostat, aniž by se hlavička rozpadla. */
.co-nav { display: flex; align-items: center; gap: 1.25rem; font-size: .92rem; margin-right: .9rem; }
.co-nav a { color: var(--text-2); text-decoration: none; white-space: nowrap; }
.co-nav a:hover { color: var(--c-f1f5f9); }
.co-nav a.is-active { color: var(--c-f1f5f9); font-weight: 600; }
@media (max-width: 720px) {
  .co-nav { gap: .9rem; }
  .co-nav a:not([href="/archiv/"]) { display: none; }
}

/* Pás navigace: odkazy na výsledky patří vpravo, oddělené od sekcí webu.
   Pás kategorií se uvnitř posouvá (overflow), takže bez `flex-shrink: 0`
   by chipy zůstaly ležet PŘES poslední položky menu — na mobilu se pak
   „Fotogalerie" schovala pod „Živé výsledky". */
.co-nav-results { margin-left: auto; flex: 0 0 auto; }
.co-chip-live { font-weight: 600; }
@media (max-width: 720px) {
  /* Na úzké obrazovce se odkazy na výsledky zalomí pod menu — vedle sebe
     se nevejdou a jedno by překrylo druhé. */
  .tt-cat-tabs-strip:has(.co-nav) { flex-wrap: wrap; row-gap: .35rem; }
  .co-nav-results { margin-left: 0; width: 100%; }
}

@media (max-width: 720px) {
  .co-section--split { grid-template-columns: 1fr; gap: 1.25rem; }
  .co-h1 { font-size: 1.45rem; }
}

/* Logo results.cz v hlavičce. Je to SVG s body na celých pixelech, takže se
   NESMÍ škálovat — místo jedné zmenšované grafiky jsou dvě velikosti a CSS
   jednu skryje.

   Vlastní jméno třídy (`rc-`), ne `site-logo`: to už patří logu ČSK na
   stránkách závodu a jeho pravidlo `height: 44px` tohle logo roztáhlo. */
.rc-logo { display: inline-flex; align-items: center; text-decoration: none; }
/* Tady ŽÁDNÝ `display` — obecné pravidlo pro obrázek uvnitř třídy má vyšší
   specificitu než `.rc-logo-velke { display: none }` a kreslila by se obě
   loga vedle sebe (220 + 165 px, na mobilu přes okraj). Totéž varování je
   u loga ČSK o kus výš. */
.rc-logo img { width: auto; }
.rc-logo .rc-logo-male { display: none; }
@media (max-width: 720px) {
  .rc-logo .rc-logo-velke { display: none; }
  .rc-logo .rc-logo-male { display: block; }
}

/* Logo firemního webu v hlavičce (`templates/site/_zaklad.html`).
   Je to světelná tabule i s černým pozadím, takže vypadá stejně v obou
   motivech; na tmavém pruhu ji od okolí oddělí vlasový rámeček, aby
   nepůsobila jako díra v hlavičce. */
.co-logo { display: inline-flex; align-items: center; text-decoration: none; }
.co-logo img { height: 2.6rem; width: auto; display: block; border-radius: 10px; }
:root:not([data-theme="light"]) .co-logo img { outline: 1px solid rgba(255, 255, 255, .14); }
@media (max-width: 720px) {
  .co-logo img { height: 2rem; }
}

/* ===== Úvodní stránka results.cz (`templates/site/uvod.html`) =====
   Dva sloupce: vlevo panel „co se právě děje", vpravo závody sezóny. Poměr
   5:7 podle návrhu — panel musí unést dlouhý název závodu na dva řádky,
   seznam potřebuje šířku na název i dokumenty. ===== */
.hp { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 40px; align-items: start; }

.hp-panel {
  display: flex; flex-direction: column; gap: 14px;
  min-height: 34rem; padding: 2.25rem;
  border: 1px solid var(--border); border-radius: var(--radius-panel);
  background: var(--surface);
}
.hp-kicker {
  display: flex; align-items: center; gap: .7rem;
  font-family: var(--font-mono); font-size: .8rem; letter-spacing: .18em;
  text-transform: uppercase; color: var(--muted);
}
.hp-kicker--live { color: var(--live-text); }
/* Tečka u „právě živě" tepe — je to jediné místo na stránce, které se hýbe,
   takže nese informaci „tohle běží teď". Kdo má v systému vypnuté animace,
   dostane ji statickou. */
.hp-dot { width: 12px; height: 12px; border-radius: 50%; background: var(--live); animation: hp-pulse 1.6s infinite; }
@keyframes hp-pulse {
  0% { box-shadow: 0 0 0 0 rgba(255, 76, 60, .7); }
  70% { box-shadow: 0 0 0 14px rgba(255, 76, 60, 0); }
  100% { box-shadow: 0 0 0 0 rgba(255, 76, 60, 0); }
}
@media (prefers-reduced-motion: reduce) { .hp-dot { animation: none; } }

.hp-title { margin: 0; font-size: 2.35rem; line-height: 1.12; font-weight: 600; color: var(--c-f1f5f9); }
.hp-sub { margin: 0; font-size: 1.05rem; color: var(--text-2); }
/* CTA je jediné plné tlačítko na stránce — proto nese barvu akcentu a sedí
   dole v panelu (`margin-top: auto`), ať je na stejném místě ve všech čtyřech
   stavech a nepodskakuje podle délky obsahu. */
.hp-cta {
  margin-top: auto; display: flex; align-items: center; justify-content: center;
  height: 3.4rem; border-radius: var(--radius-btn);
  background: var(--accent); color: var(--accent-ink);
  font-weight: 600; font-size: 1.05rem; text-decoration: none;
}
.hp-cta:hover { filter: brightness(1.08); text-decoration: none; }

/* Bez prokladu: znaky LED písma mají pevnou šířku matice a jednička v ní
   nechává prázdný sloupec — každý přidaný proklad se po ní sečte do díry
   („201 0"). Proklad si nese jen logo, kde je záměrný. */
/* LED písmo JEN od 40 px výš: pod tím jsou body matice menší než 3 px a text
   vypadá přerušovaně. Menší údaje (data v seznamech, časy v tabulkách, roky
   v grafu, počítadla) sází `.cislo` — mono s tabulkovými číslicemi. */
.led { font-family: var(--font-led); font-weight: 400; letter-spacing: 0; }
.cislo {
  font-family: var(--font-mono); font-weight: 500;
  font-variant-numeric: tabular-nums; color: var(--accent);
}
/* Zhasnuté body tabule: týž text mřížkovým písmem pod svítícím.
   Použití: <span class="led led-board" data-text="01:23,45">01:23,45</span> */
.led-board { position: relative; display: inline-block; isolation: isolate; }
.led-board::before {
  content: attr(data-text); position: absolute; inset: 0;
  font-family: 'Results LED Grid'; color: var(--led-off); z-index: -1; pointer-events: none;
}


/* Odpočet: tři LED skupiny (dní / hod / min), pod nimi drobné popisky. */
.hp-countdown { display: flex; gap: 1.6rem; margin: .4rem 0; }
.hp-cd-part { display: flex; flex-direction: column; gap: .2rem; }
.hp-cd-part b { font-size: 2.6rem; line-height: 1; color: var(--accent); }
.hp-cd-part i {
  font-family: var(--font-mono); font-style: normal; font-size: .7rem;
  letter-spacing: .16em; text-transform: uppercase; color: var(--muted);
}

/* Pravý sloupec — sezóna a seznam závodů. */
.hp-season { display: flex; flex-direction: column; gap: 1.4rem; }
.hp-season-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1.5rem; }
.hp-season-year { display: flex; flex-direction: column; gap: .25rem; }
.hp-label { font-family: var(--font-mono); font-size: .75rem; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); }
.hp-year { font-size: 3.6rem; line-height: .95; color: var(--logo); }
.hp-archive-link { font-size: .95rem; color: var(--accent); white-space: nowrap; }

.hp-races { list-style: none; margin: 0; padding: 0; }
.hp-race {
  display: grid; grid-template-columns: 4.6rem minmax(0, 1fr) auto; gap: 1.2rem;
  align-items: center; padding: .85rem 0; border-bottom: 1px solid var(--line);
}
.hp-race-date { color: var(--accent); font-size: 1rem; white-space: nowrap; }
.hp-race-main { min-width: 0; display: flex; flex-direction: column; gap: .15rem; }
.hp-race-main a { color: var(--text); font-weight: 500; font-size: 1.02rem; }
.hp-race-main a:hover { color: var(--c-f1f5f9); }
.hp-race-meta { font-size: .82rem; color: var(--muted); }
.hp-race-docs { display: flex; gap: .8rem; font-family: var(--font-mono); font-size: .78rem; }
.hp-race-docs a { color: var(--muted); text-transform: uppercase; }
.hp-race-docs a:hover { color: var(--accent); text-decoration: none; }

@media (max-width: 900px) {
  /* Na úzké obrazovce jde panel nad seznam — je to to hlavní sdělení. */
  .hp { grid-template-columns: 1fr; gap: 1.75rem; }
  .hp-panel { min-height: 0; padding: 1.4rem; gap: .8rem; }
  .hp-title { font-size: 1.6rem; }
  .hp-year { font-size: 2.6rem; }
  .hp-race { grid-template-columns: 3.6rem minmax(0, 1fr); gap: .8rem; }
  .hp-race-docs { grid-column: 2; margin-top: .2rem; }
}

/* Zápatí firemního webu: firma vlevo, spojení vpravo (na mobilu pod sebou). */
.co-footer { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.co-footer-nav { display: flex; gap: 1.75rem; }
.co-footer-nav a.is-active { color: var(--c-f1f5f9); font-weight: 600; }
.co-footer-right { display: flex; align-items: center; gap: 1.25rem; }
.co-footer a { color: var(--text-2); }
.co-footer a:hover { color: var(--accent); }
@media (max-width: 720px) {
  .co-footer { flex-direction: column; gap: .4rem; text-align: center; }
  /* Pět odkazů se na šířku telefonu nevejde: zalomí se CELÁ položka na další
     řádek, ne slovo uvnitř („O / nás", „Původní / web"). */
  .co-footer-nav { flex-wrap: wrap; justify-content: center; gap: .4rem 1.25rem; }
  .co-footer-nav a { white-space: nowrap; }
}

/* ===== Archiv — rozcestník ročníků (`templates/archiv.html`) ===== */
.ar-head { display: grid; grid-template-columns: minmax(0, 1fr) 28rem; gap: 3rem; align-items: end; margin-bottom: 2.25rem; }
.ar-search {
  display: flex; align-items: center; gap: .75rem; height: 3.25rem;
  padding: 0 1.1rem; border-radius: var(--radius-panel);
  background: var(--surface); border: 1px solid var(--line-strong); color: var(--muted);
}
.ar-search input {
  flex: 1; min-width: 0; background: transparent; border: 0; outline: none;
  color: var(--text); font: inherit; font-size: .95rem;
}
.ar-year-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .75rem; }
.ar-year {
  display: flex; flex-direction: column; gap: .7rem;
  padding: 1.1rem 1.1rem 1rem; border-radius: var(--radius-btn);
  background: var(--surface); border: 1px solid var(--border); text-decoration: none;
}
.ar-year:hover { border-color: var(--accent); text-decoration: none; }
.ar-year-num { font-size: 2.05rem; line-height: 1; color: var(--logo); }
/* Proužek = podíl na nejsilnějším ročníku. */
.ar-year-bar { display: block; height: 4px; border-radius: 2px; background: var(--border); overflow: hidden; }
.ar-year-bar span { display: block; height: 100%; border-radius: 2px; background: var(--accent); }
.ar-year-count { font-size: .82rem; color: var(--muted); }
/* Léta před archivem mají jen vyprávění a naskenované listiny — dlaždice je
   proto odlišená přerušovaným rámečkem, ne barvou. */
.ar-year--history { justify-content: space-between; background: transparent; border-style: dashed; border-color: var(--line-strong); }
.ar-year-era { font-family: var(--font-mono); font-size: .8rem; color: var(--muted); }
.ar-year-more { font-size: .92rem; font-weight: 500; color: var(--accent); }

@media (max-width: 1100px) { .ar-year-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 720px) {
  .ar-head { grid-template-columns: 1fr; gap: 1.25rem; }
  .ar-year-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ===== Archiv — ročník (`templates/archiv_rok.html`) ===== */
.ay-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 2rem; margin: 0 0 1.75rem; }
.ay-title { display: flex; align-items: baseline; gap: 1.25rem; }
.ay-year { margin: 0; font-size: 4.5rem; line-height: .9; color: var(--logo); }
.ay-count { font-size: 1rem; color: var(--muted); }
.ay-nav { display: flex; gap: .5rem; }
.ay-step {
  display: flex; align-items: center; height: 2.75rem; padding: 0 1rem;
  border-radius: var(--radius-btn); border: 1px solid var(--line-strong);
  font-family: var(--font-mono); font-size: .88rem; color: var(--text-2); text-decoration: none;
}
.ay-step:hover { border-color: var(--accent); color: var(--text); text-decoration: none; }

.ay-body { display: grid; grid-template-columns: 14rem minmax(0, 1fr); gap: 3rem; align-items: start; }
.ay-sports { display: flex; flex-direction: column; gap: .15rem; position: sticky; top: 1rem; }
.ay-sports a {
  display: flex; justify-content: space-between; gap: .75rem;
  padding: .55rem .75rem; border-radius: var(--radius-chip);
  color: var(--text-2); text-decoration: none; font-size: .95rem;
}
.ay-sports a:hover { background: var(--surface); color: var(--text); text-decoration: none; }
.ay-sport-count { font-family: var(--font-mono); color: var(--muted); }
.ay-sports .hp-label { padding: 0 .75rem .4rem; }
.ay-label-more { padding-top: 1.1rem !important; }
.ay-groups { min-width: 0; }

@media (max-width: 900px) {
  .ay-body { grid-template-columns: 1fr; gap: 1.25rem; }
  /* Na mobilu je boční rozcestník zbytečný — sekce jsou hned pod sebou. */
  .ay-sports { display: none; }
  .ay-year { font-size: 3rem; }
}

/* Displej běžícího času na úvodu — velký LED údaj se září, jako tabule v cíli. */
.hp-runner { margin-top: auto; }
.hp-clock {
  font-size: 3.6rem; line-height: 1; color: var(--accent);
  text-shadow: 0 0 16px rgba(var(--accent-rgb), .35);
}
:root[data-theme="light"] .hp-clock { text-shadow: none; }
@media (max-width: 900px) { .hp-clock { font-size: 2.6rem; } }

/* Textové stránky firemního webu (O nás, Kontakt) — měřítko řádku, ať se
   dlouhý odstavec čte; širší sloupec už oko na konci řádku ztrácí. */
.co-text { max-width: 52rem; }
.co-text .co-section { margin-top: 2.25rem; }
/* Milníky jsou ROKY, ne pořadí — číslování seznamu by přidalo druhou řadu
   čísel vedle letopočtů. */
.co-milestones { list-style: none; margin: .75rem 0 0; padding: 0; }
.co-milestone { display: grid; grid-template-columns: 4.4rem minmax(0, 1fr); gap: 1rem; padding: .4rem 0; align-items: baseline; }
.co-milestone-year { color: var(--accent); font-size: 1rem; }


/* ===== Jednotný layout webu (zadání fáze 2, krok 1) =====
   Hlavička, obsah i patička mají JEDEN kontejner: stejné vodorovné odsazení
   a stejnou maximální šířku. Dřív měla každá část jinou — hlavička přes celou
   obrazovku, obsah v úzkém sloupci, patička od okraje — a stránka tím
   vypadala rozpadle.

   Platí pro stránky webu (`body.site-shell`); stránky závodu mají vlastní pás
   kategorií a dolní dock, ty se sem zatím netahají. ===== */
body.site-shell { min-height: 100dvh; }
body.site-shell .site-header,
body.site-shell .site-main,
body.site-shell .site-footer {
  width: 100%; max-width: 1440px; margin-inline: auto;
  padding-inline: var(--pad-x, 56px);
}
body.site-shell .site-header { height: 72px; padding-block: 0; }
/* Patička drží u dolního okraje i na krátké stránce — `auto` nahoře ji
   odsune, jakmile obsah nevyplní obrazovku. */
body.site-shell .site-footer { margin-top: auto; padding-block: 1.5rem; }
/* Nahoře nic: odstup od lišty drží `main` svým 1 rem a to stačí. Vlastní
   padding se k němu jen přičítal — spolu se spodním odsazením lišty z toho
   byla díra 50 px pod logem. */
body.site-shell .co-page,
body.site-shell .arch-page { max-width: none; padding-inline: 0; padding-block: 0 2.5rem; }

@media (max-width: 720px) {
  body.site-shell { --pad-x: 16px; }
  body.site-shell .site-header { height: 56px; }
}

/* Navigace v hlavičce: aktivní položka je bílá, tučná a podtržená akcentem —
   samotná barva by v pruhu plném odkazů nestačila. */
.co-nav a { padding: .35rem 0; border-bottom: 2px solid transparent; }
.co-nav a.is-active { color: var(--c-f1f5f9); font-weight: 600; border-bottom-color: var(--accent); }

/* Mobilní menu: ikona 44×44 (dotykový cíl) a rozbalený seznam VŠECH odkazů —
   schovat je úplně by znamenalo, že se na telefonu k sekcím nedá dostat. */
.co-menu-btn {
  display: none; width: 44px; height: 44px; align-items: center; justify-content: center;
  background: transparent; border: 0; color: var(--text); cursor: pointer;
}
.co-menu-panel {
  display: none; position: absolute; right: var(--pad-x, 16px); top: 56px; z-index: 40;
  min-width: 12rem; padding: .5rem; border-radius: var(--radius-panel);
  background: var(--surface); border: 1px solid var(--border);
  box-shadow: 0 12px 32px rgba(0, 0, 0, .35);
}
.co-menu-panel a { display: block; padding: .6rem .75rem; color: var(--text-2); text-decoration: none; }
.co-menu-panel a:hover { background: var(--surface-2); color: var(--text); }
.co-menu-panel[data-open="1"] { display: block; }

@media (max-width: 720px) {
  .co-nav { display: none; }
  .co-menu-btn { display: flex; }
}


/* Přepínač světlého režimu je podle zadání zatím schovaný — světlý motiv
   v CSS zůstává (dopočítaný), jen se na web nepřepíná. */
body.site-shell .theme-toggle,
body.site-shell .density-toggle { display: none !important; }

/* Archiv uvnitř společného kontejneru: šířku a odsazení řeší `.co-page`,
   `.arch-inner` už jen sdružuje obsah stránky. */
.arch-inner { width: 100%; }

/* Stránky webu rolují CELÝM oknem, ne uvnitř obsahu: patička je posledním
   blokem stránky, takže na dlouhém seznamu odjede nahoru a na krátké stránce
   zůstane dole. Landing výsledků (`home-no-dock` bez `site-shell`) si vnitřní
   rolování ponechává — tam je patička pod přehybem záměrně. */
@media (min-width: 720px) {
  body.site-shell { height: auto; overflow: visible; }
  body.site-shell .site-main { overflow-y: visible; min-height: 0; }
}

/* ===== Kontakt (`templates/site/kontakt.html`, návrh fáze 2) =====
   Vlevo výzva s tlačítky, vpravo lidé a firemní údaje — táž mřížka 5/7 jako
   úvod, aby stránky webu držely jeden rytmus. ===== */
/* Kontakt je od zrušení levého panelu jednosloupcový; šířku drží stejný
   strop jako ostatní textové stránky, aby řádky údajů nebyly přes celou
   obrazovku. */
.ko { display: flex; flex-direction: column; gap: 2.25rem; max-width: 900px; }
.ko-panel {
  display: flex; flex-direction: column; gap: 1.35rem; padding: 2.5rem;
  border: 1px solid var(--border); border-radius: var(--radius-panel); background: var(--surface);
}
.ko-h1 { margin: 0; font-size: 2.5rem; line-height: 1.1; font-weight: 600; color: var(--c-f1f5f9); }
.ko-lead { margin: 0; font-size: 1.05rem; line-height: 1.55; color: var(--text-2); }
.ko-actions { display: flex; flex-direction: column; gap: .6rem; margin-top: .5rem; }
/* Tlačítka jsou vysoká 56 px podle návrhu — a zároveň to je pohodlný dotykový
   cíl na telefonu, kde se z nich volá a píše nejčastěji. */
.ko-btn {
  display: flex; align-items: center; justify-content: center; gap: .6rem;
  height: 56px; border-radius: var(--radius-btn); font-size: 1.05rem; text-decoration: none;
}
.ko-btn--primary { background: var(--accent); color: var(--accent-ink); font-weight: 600; }
.ko-btn--primary:hover { filter: brightness(1.08); text-decoration: none; }
.ko-btn--ghost { border: 1px solid var(--line-strong); color: var(--text); font-family: var(--font-mono); }
.ko-btn--ghost:hover { border-color: var(--accent); text-decoration: none; }

.ko-right { display: flex; flex-direction: column; gap: 2.25rem; }
.ko-right .hp-label { display: block; margin-bottom: .9rem; }
.ko-people { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.ko-person {
  display: flex; flex-direction: column; gap: .85rem; padding: 1.5rem;
  border: 1px solid var(--border); border-radius: var(--radius-panel);
}
.ko-person-name { font-size: 1.25rem; font-weight: 600; color: var(--c-f1f5f9); }
.ko-person-links { display: flex; flex-direction: column; gap: .5rem; font-family: var(--font-mono); font-size: .95rem; }
/* Telefon je to, co člověk hledá první, když se něco děje na závodě — proto
   akcent; e-mail je klidnější. */
.ko-tel { color: var(--accent); }
.ko-mail { color: var(--text-2); }

.ko-firm { display: flex; flex-direction: column; border-top: 1px solid var(--line-strong); }
.ko-row {
  display: grid; grid-template-columns: 10rem minmax(0, 1fr) auto; gap: 1.25rem;
  align-items: baseline; padding: .9rem 0; border-bottom: 1px solid var(--line);
}
.ko-key { font-size: .88rem; color: var(--muted); }
.ko-val { font-size: 1rem; color: var(--text); }
.ko-val--mono { font-family: var(--font-mono); }
.ko-val--soft { font-size: .95rem; color: var(--text-2); }
.ko-action { font-size: .88rem; color: var(--accent); white-space: nowrap; }

@media (max-width: 900px) {
  .ko { grid-template-columns: 1fr; gap: 1.75rem; }
  .ko-panel { padding: 1.5rem; gap: 1rem; }
  .ko-h1 { font-size: 1.75rem; }
  .ko-people { grid-template-columns: 1fr; }
  /* Popisek nad hodnotou: na 390 px by sloupec 10rem nechal na adresu pás
     široký pár znaků. */
  .ko-row { grid-template-columns: minmax(0, 1fr) auto; gap: .35rem 1rem; }
  .ko-key { grid-column: 1 / -1; }
}

/* ===== Úvod, krok 2: panel podle návrhu a sezóna po místech ===== */
.hp-panel { min-height: 38rem; padding: 2.5rem; gap: 1.1rem; }
.hp-head { display: flex; flex-direction: column; gap: .35rem; }
.hp-title--sm { font-size: 1.9rem; }

/* Displej běžícího času. `led-board` pod ním kreslí zhasnuté body, takže
   stojí i na místě, kde zrovna svítí jen část číslic — jako na tabuli. */
.hp-clock-wrap { display: flex; flex-direction: column; gap: .4rem; margin-top: .75rem; }
.hp-clock { font-size: 3.9rem; line-height: 1; color: var(--accent); text-shadow: 0 0 16px rgba(var(--accent-rgb), .35); }
:root[data-theme="light"] .hp-clock { text-shadow: none; }


/* Odpočet: tři LED skupiny oddělené dvojtečkou, pod nimi popisky. */
.hp-countdown { display: flex; align-items: flex-start; gap: 1rem; margin: 1rem 0 .25rem; }
.hp-cd-part { display: flex; flex-direction: column; align-items: center; gap: .35rem; }
.hp-cd-part b { font-size: 3.6rem; line-height: 1; color: var(--accent); text-shadow: 0 0 16px rgba(var(--accent-rgb), .35); }
.hp-cd-sep { font-size: 3.6rem; line-height: 1; color: var(--led-off); }
:root[data-theme="light"] .hp-cd-part b { text-shadow: none; }
.hp-links { display: flex; gap: 1.25rem; font-size: .95rem; }
.hp-links a { color: var(--text); border-bottom: 1px solid var(--line-strong); }

/* Shrnutí sezóny: tři čísla vedle sebe. */
.hp-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-top: .75rem; }
.hp-stat { display: flex; flex-direction: column; gap: .3rem; }
.hp-stat-num { font-size: 2.6rem; line-height: 1; color: var(--accent); }
.hp-stat-label { font-size: .85rem; color: var(--muted); }

/* Sezóna po místech: hlavička skupiny (místo + rozsah dat) a pod ní závody. */
.hp-group { display: block; margin-bottom: 1.6rem; }
.hp-group-head {
  display: flex; justify-content: space-between; align-items: baseline;
  padding-bottom: .5rem; border-bottom: 1px solid var(--line-strong);
}
.hp-group-place { font-size: .98rem; font-weight: 600; color: var(--text); }
.hp-group-dates { font-family: var(--font-mono); font-size: .85rem; color: var(--muted); }
/* Celý řádek je odkaz (min. 56 px), ne jen název — na telefonu se do textu
   trefuje hůř než do pásu přes celou šířku. */
a.hp-race {
  display: grid; grid-template-columns: 4.2rem minmax(0, 1fr) auto; gap: 1.25rem;
  align-items: center; min-height: 56px; padding: .65rem 0;
  border-bottom: 1px solid var(--line); text-decoration: none; color: inherit;
}
a.hp-race:hover { text-decoration: none; }
a.hp-race:hover .hp-race-name { color: var(--c-f1f5f9); }
.hp-race-name { font-size: 1rem; font-weight: 500; color: var(--text); }
.hp-race-docs span { color: var(--muted); }

@media (max-width: 900px) {
  .hp-panel { min-height: 0; padding: 1.4rem; }
  .hp-clock { font-size: 2.8rem; }
  .hp-cd-part b, .hp-cd-sep { font-size: 2.6rem; }
  .hp-stat-num { font-size: 2rem; }
  /* Na telefonu má název celou šířku — sloupec disciplíny a dokumentů by z něj
     udělal pár znaků s třemi tečkami. */
  a.hp-race { grid-template-columns: 3.6rem minmax(0, 1fr); gap: .8rem; }
  .hp-race-main { flex-direction: column; align-items: flex-start; gap: .1rem; }
  .hp-race-name { white-space: normal; }
  .hp-race-docs { grid-column: 2; }
}

/* Atribut `hidden` musí schovat i prvek, kterému třída nastavuje display.
   Výchozí pravidlo prohlížeče (`[hidden] { display: none }`) má nižší
   specificitu než třída, takže `display: flex` ho jinak přebije a schovaný
   prvek zůstane vidět — přesně to se stalo displeji běžícího času. */
[hidden] { display: none !important; }

/* ===== Archiv — rozcestník V2 (`templates/archiv.html`, návrh fáze 2) ===== */
.av-head { display: flex; flex-direction: column; gap: 1rem; margin-bottom: 2.5rem; }
/* Titul stránky ve vzhledu štítku (`hp-label`) — h1 nesmí převzít velikost
   ani okraje nadpisu. */
.av-titul { margin: 0; font-weight: 400; }
/* Hledání v celém archivu (filtr sportů z rozcestníku zmizel). */
.av-tools { display: flex; align-items: center; gap: 1.5rem; }
.av-search { display: flex; gap: .5rem; flex: 0 1 640px; min-width: 0; }
.av-search-field {
  flex: 1; display: flex; align-items: center; gap: .75rem; height: 56px;
  padding: 0 1.1rem; border-radius: var(--radius-panel);
  background: var(--surface); border: 1px solid var(--line-strong); color: var(--muted);
}
.av-search-field input {
  flex: 1; min-width: 0; background: transparent; border: 0; outline: none;
  color: var(--text); font: inherit; font-size: 1rem;
}
.av-search-btn {
  height: 56px; padding: 0 1.5rem; border: 0; border-radius: var(--radius-panel);
  background: var(--accent); color: var(--accent-ink); font: inherit; font-weight: 600; cursor: pointer;
}
.av-search-btn:hover { filter: brightness(1.08); }
.av-filters { display: flex; flex-wrap: wrap; gap: .4rem; font-size: .82rem; }
.av-filter {
  padding: .35rem .75rem; border-radius: var(--radius-pill);
  border: 1px solid var(--line-strong); color: var(--text-2); text-decoration: none;
}
.av-filter:hover { border-color: var(--accent); text-decoration: none; }
.av-filter.is-active { background: var(--text); border-color: var(--text); color: var(--bg); font-weight: 500; }

.av-chart-panel {
  display: flex; flex-direction: column; gap: 1rem; margin-bottom: 2.5rem;
  padding: 1.75rem 1.75rem 1.25rem; border-radius: var(--radius-panel);
  background: var(--surface); border: 1px solid var(--border);
}
.av-chart-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; }
.av-chart-title { margin: 0; font-size: 1.05rem; font-weight: 600; color: var(--c-f1f5f9); }
.av-chart-hint { font-family: var(--font-mono); font-size: .8rem; color: var(--muted); }
/* Sloupec na rok; počet sloupců posílá šablona, ať se mřížka nedohaduje. */
.av-chart { display: grid; grid-template-columns: repeat(var(--av-sloupcu, 23), minmax(0, 1fr)); gap: 8px; align-items: end; height: 18rem; }
.av-bar { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: .5rem; height: 100%; text-decoration: none; }
.av-bar-count { font-family: var(--font-mono); font-size: .72rem; color: var(--muted); }
.av-bar-col { width: 100%; min-height: 3px; border-radius: 4px 4px 0 0; background: var(--accent); }
.av-bar-year { font-size: .8rem; color: var(--logo); }
/* Aktuální rok svítí víc (sezóna běží), nejstarší ročník jen s listinami je
   ztlumený — nejsou to úplná data. */
.av-bar.is-current .av-bar-col { background: #ffcf70; }
.av-bar.is-current .av-bar-year { color: #ffcf70; }
.av-bar.is-partial .av-bar-col { background: #4a3d1f; }
.av-bar:hover .av-bar-col { filter: brightness(1.15); }
.av-chart-foot {
  display: flex; justify-content: space-between; align-items: center; gap: 1rem;
  padding-top: .9rem; border-top: 1px solid var(--border); font-size: .88rem; color: var(--muted);
}

/* Mobilní seznam ročníků — na úzké obrazovce místo grafu. */
.av-years-list { display: none; }
.av-year-row {
  display: grid; grid-template-columns: 3.6rem minmax(0, 1fr) 2.2rem 1rem; gap: .75rem;
  align-items: center; min-height: 48px; border-bottom: 1px solid var(--line);
  text-decoration: none; color: inherit;
}
.av-year-row-year { color: var(--logo); font-size: .95rem; }
.av-year-row-bar { height: 6px; border-radius: 3px; background: var(--border); overflow: hidden; }
.av-year-row-bar span { display: block; height: 100%; background: var(--accent); }
.av-year-row-count { font-family: var(--font-mono); font-size: .8rem; color: var(--muted); text-align: right; }
.av-year-row-arrow { color: var(--muted); }

.av-history { display: flex; flex-direction: column; gap: .9rem; }
/* Menší karty: výběr má přes dvacet akcí, velké rámečky by ho natáhly na
   několik obrazovek. Karty se rozkládají podle šířky (na desktopu čtyři). */
.av-history-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: .6rem; }
.av-history-card {
  display: flex; gap: .8rem; align-items: center; padding: .65rem .85rem;
  border: 1px solid var(--border); border-radius: var(--radius-panel);
  text-decoration: none; color: inherit;
}
.av-history-card:hover { border-color: var(--accent); text-decoration: none; }
/* Pevná šířka sloupce s rokem: jednoletá karta („1986") i rozsah let pak
   mají text od stejného místa. */
.av-history-year { flex: 0 0 3.6rem; font-size: 1.3rem; color: var(--accent); }
/* Rozsah let je pod sebou („2006" nad „2017"), o stupeň menším písmem —
   vejde se do téže šířky jako jeden rok. */
.av-history-year--rozsah { font-size: 1.05rem; line-height: 1.15; }
/* Roky pod sebou s pomlčkou na samostatném řádku mezi nimi — vycentrovanou
   na šířku roku, menší a těsnou, ať karta nenaroste. */
.av-history-roky { display: inline-flex; flex-direction: column; align-items: center; }
.av-history-pomlcka { font-size: 1rem; line-height: .85; }
.av-history-text { font-size: .85rem; line-height: 1.35; }

@media (max-width: 900px) {
  /* Na mobilu pod sebou: hledání nahoře (hlavní akce), filtr pod ním. */
  .av-tools { flex-direction: column-reverse; align-items: stretch; gap: .75rem; }
  .av-search { flex-basis: auto; }
  .av-chart-panel { display: none; }     /* sloupce by měly pár pixelů */
  .av-years-list { display: block; margin-bottom: 2rem; }
  .av-history-cards { grid-template-columns: 1fr; }
}

/* ===== Archiv — ročník V2 (`templates/archiv_rok.html`) ===== */
.ay-title-wrap { display: flex; flex-direction: column; gap: .5rem; }
.ay-back { font-size: .88rem; color: var(--muted); }
.ay-search { max-width: 34rem; margin-bottom: 1.5rem; }

/* Vodorovný pás ročníků — na širokém displeji ho nahrazují šipky v hlavičce. */
.ay-years-strip { display: none; gap: .4rem; overflow-x: auto; padding-bottom: .75rem; margin-bottom: 1rem; }
.ay-years-all, .ay-year-chip {
  flex: 0 0 auto; padding: .4rem .8rem; border-radius: var(--radius-pill);
  border: 1px solid var(--line-strong); font-family: var(--font-mono); font-size: .85rem;
  color: var(--text-2); text-decoration: none; white-space: nowrap;
}
.ay-year-chip.is-active { background: var(--text); border-color: var(--text); color: var(--bg); }

.ay-group { margin-bottom: 2rem; }
.ay-group-title { margin: 0; font-size: 1.15rem; font-weight: 600; color: var(--c-f1f5f9); }
/* Řádek závodu = táž mřížka jako na úvodu, jen s místem navíc. Sloupec data
   drží krátký tvar („21.09.") — celé datum včetně roku jen opakuje nadpis
   stránky a v LED písmu sloupec rozhodí. */
.ay-race { grid-template-columns: 4.6rem minmax(0, 1fr) 11rem auto; align-items: center; }
.ay-race .hp-race-docs { justify-content: flex-end; gap: .7rem; }
.ay-race-venue { font-size: .88rem; color: var(--muted); }
.hp-race-doc { font-family: var(--font-mono); font-size: .78rem; color: var(--muted); text-transform: uppercase; }
.hp-race-doc:hover { color: var(--accent); text-decoration: none; }
/* Sporty mimo vodu jsou v rozcestníku tlumené — na kanoistický web nepatří
   stejný důraz jako na slalom a sjezd. */
.ay-sport-other { color: var(--muted) !important; }

@media (max-width: 900px) {
  /* Sloupec 220 px by na telefonu sebral půlku šířky; sporty se proto stanou
     vodorovnými záložkami a roky pásem nad nimi. */
  .ay-sports {
    display: flex; flex-direction: row; gap: .4rem; overflow-x: auto;
    position: static; padding-bottom: .75rem; margin-bottom: 1rem;
  }
  .ay-sports .hp-label { display: none; }
  .ay-sports a {
    flex: 0 0 auto; gap: .5rem; padding: .45rem .8rem; border-radius: var(--radius-pill);
    border: 1px solid var(--line-strong); white-space: nowrap;
  }
  .ay-years-strip { display: flex; }
  .ay-nav { display: none; }          /* šipky nahrazuje pás ročníků */
  /* Řádek ročníku podle `ArchivRokMobil.html`: datum | název + místo |
     dokumenty, všechno v JEDNOM řádku o výšce ~58 px. Dokumenty na vlastním
     řádku pod textem ho natáhly na dvojnásobek a na obrazovku se vešly
     čtyři závody místo osmi. */
  .ay-race { grid-template-columns: 4.2rem minmax(0, 1fr) auto; min-height: 58px; }
  .ay-race-venue { grid-column: 2; font-size: .8rem; }
  .ay-race .hp-race-docs { grid-column: 3; grid-row: 1 / span 2; align-self: center; }
}

/* ===== Fotogalerie (`templates/site/fotogalerie*.html`) ===== */
.ga-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; }
.ga-card { display: flex; flex-direction: column; gap: .5rem; text-decoration: none; color: inherit; }
.ga-cover { position: relative; display: block; }
.ga-cover img {
  width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block;
  border-radius: var(--radius-btn); border: 1px solid var(--border); background: var(--surface-2);
}
.ga-card:hover .ga-cover img { border-color: var(--accent); }
.ga-count {
  position: absolute; right: .5rem; bottom: .5rem; padding: .15rem .5rem;
  border-radius: var(--radius-chip); background: rgba(14, 20, 31, .82);
  font-family: var(--font-mono); font-size: .72rem; color: var(--text);
}
.ga-title { font-size: .98rem; font-weight: 500; color: var(--text); line-height: 1.35; }
.ga-meta { font-size: .82rem; color: var(--muted); }
.ga-meta .led { color: var(--accent); }

.ga-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 2rem; margin-bottom: 1.5rem; }
.ga-head-meta { margin: .35rem 0 0; font-size: .95rem; color: var(--muted); }
.ga-head-meta .led { color: var(--accent); }
.ga-photos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.ga-photo { padding: 0; border: 0; background: none; cursor: zoom-in; }
.ga-photo img {
  width: 100%; aspect-ratio: 3 / 2; object-fit: cover; display: block;
  border-radius: var(--radius-chip); border: 1px solid var(--border); background: var(--surface-2);
}
.ga-photo:hover img, .ga-photo:focus-visible img { border-color: var(--accent); }

/* Prohlížeč fotek podle návrhu: nahoře lišta (název alba, počítadlo, zavřít),
   po stranách kulaté šipky, dole autor s nápovědou ke klávesám a pás náhledů.
   Překryv je tmavší než stránka, ať fotka nekonkuruje s pozadím; tělo se pod
   ním nescrolluje. */
body.lb-otevreno { overflow: hidden; }
.lb {
  position: fixed; inset: 0; z-index: 100; display: none;
  grid-template-columns: 5rem minmax(0, 1fr) 5rem;
  grid-template-rows: auto minmax(0, 1fr) auto auto;
  align-items: center;
  /* Plná barva, ne průsvit: pět procent stačilo, aby pod překryvem prosvítaly
     jasné fotky z mřížky a oko je četlo jako šum za snímkem. */
  background: #0a0f18;
}
.lb.je-otevreny { display: grid; }
.lb-listva {
  grid-column: 1 / -1; grid-row: 1; display: flex; align-items: center; gap: 1.25rem;
  padding: 1rem 1.25rem;
}
.lb-nazev { display: flex; gap: .85rem; align-items: baseline; font-size: .95rem; min-width: 0; }
.lb-nazev b { font-weight: 600; color: var(--text); }
.lb-nazev i { font-style: normal; color: var(--muted); }
.lb-pocitadlo {
  margin-left: auto; font-family: var(--font-mono); font-weight: 500;
  font-size: 1rem; color: var(--accent);
}
.lb-zavrit {
  width: 44px; height: 44px; display: flex; align-items: center; justify-content: center;
  border: 0; border-radius: 22px; background: var(--surface); color: var(--text); cursor: pointer;
}
.lb-zavrit:hover, .lb-sip:hover { background: var(--line-strong); }
.lb-scena { grid-column: 2; grid-row: 2; margin: 0; display: flex; align-items: center;
            justify-content: center; min-height: 0; }
.lb-obraz { max-width: 100%; max-height: 68vh; object-fit: contain; border-radius: 4px; }
.lb-sip {
  grid-row: 2; width: 56px; height: 56px; display: flex; align-items: center;
  justify-content: center; border: 0; border-radius: 28px; background: var(--surface);
  color: var(--text); cursor: pointer; justify-self: center;
}
.lb-sip--vlevo { grid-column: 1; }
.lb-sip--vpravo { grid-column: 3; }
/* Nápověda ke klávesám: bez ní by je nikdo nehledal. */
.lb-popis { grid-column: 1 / -1; grid-row: 3; text-align: center; font-size: .82rem; color: var(--muted); }
.lb-pas {
  grid-column: 1 / -1; grid-row: 4; display: flex; gap: .4rem; overflow-x: auto;
  padding: .85rem 1rem 1.25rem; justify-content: center;
}
.lb-pas img {
  flex: 0 0 auto; width: 56px; height: 38px; object-fit: cover;
  border-radius: 3px; opacity: .45; cursor: pointer; outline: 2px solid transparent; outline-offset: 2px;
}
.lb-pas img.je-aktivni { opacity: 1; outline-color: var(--accent); }

@media (max-width: 900px) {
  .ga-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
  .ga-photos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ga-head { flex-direction: column; align-items: flex-start; gap: 1rem; }
  /* Na dotyku listují gesta, šipky jen zabíraly místo fotce. */
  .lb { grid-template-columns: 1fr; }
  .lb-sip { display: none; }
  .lb-scena { grid-column: 1; }
  .lb-obraz { max-height: 62vh; }
  .lb-pas { justify-content: flex-start; }
}

/* ===== Pás fotek na úvodu (`templates/site/uvod.html`) =====
   Táhne se přes celou šířku okna, i když sedí uvnitř kontejneru stránky
   (`margin-inline: calc(50% - 50vw)`), a je celý jedním odkazem do galerie. */
.ph-pas {
  position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: 1fr;
  gap: 3px; height: 160px; margin-inline: calc(50% - 50vw); margin-bottom: 1.75rem;
  /* Přisadí se rovnou pod hlavičku — horní odsazení obsahu by jinak nechalo
     nad pásem pruh pozadí a pás by „plaval". */
  margin-top: -1.5rem;
  overflow: hidden; text-decoration: none;
}
/* Dlaždice je ODKAZ do alba (dřív byl odkaz celý pás). `display: block`,
   aby obrázek vyplnil buňku, a bez podtržení. */
.ph-dil { position: relative; overflow: hidden; display: block; text-decoration: none; }
.ph-dil:hover { text-decoration: none; }
/* Zaostření a odclonění patří k odkazu; u fotky bez alba se nic neděje. */
.ph-dil:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.ph-dil img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  /* Tónování: fotky jsou kulisa, ne obsah — plná barva by přetáhla pozornost
     z panelu „co se právě děje". */
  filter: grayscale(1) contrast(1.1) brightness(.7);
  transition: filter .2s ease;
}
/* Překryv v barvě pozadí sjednotí různě exponované fotky do jednoho pásu. */
.ph-dil::after {
  content: ""; position: absolute; inset: 0; background: var(--bg); opacity: .35;
  transition: opacity .2s ease; pointer-events: none;
}
.ph-dil:hover img { filter: none; }
.ph-dil:hover::after { opacity: 0; }
@media (prefers-reduced-motion: reduce) {
  .ph-dil img, .ph-dil::after { transition: none; }
}
@media (max-width: 900px) {
  /* Na telefonu ubere pás výšku panelu, který je tam to hlavní — zůstanou
     tři fotky a nižší pruh. Mřížka musí mít taky tři sloupce, jinak by ty
     tři fotky zabraly jen tři osminy šířky. */
  .ph-pas { height: 96px; margin-bottom: 1.25rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ph-dil:nth-child(n + 4) { display: none; }
}

/* Logo drží svou šířku a nesmí vytlačit nástroje hlavičky: na 390 px se
   `.site-brand` roztáhl přes celý řádek a menu i přepínače skončily mimo
   obrazovku. */
.site-brand.rc-logo { flex: 0 0 auto; min-width: 0; }
@media (max-width: 420px) {
  /* Na nejužších displejích se logo o kousek zmenší, ať vedle něj zbude
     místo na ikonu menu a přepínač jazyka. */
  .rc-logo .rc-logo-male { width: 140px; height: auto; }
}

/* ===== Navigace podle návrhu: Výsledky · Živě · CZ/EN ===== */
.co-zive { display: inline-flex; align-items: center; gap: .5rem; }
/* Když nic neběží, je to jen prázdné kolečko — klidné, ale na stejném místě,
   takže se odznak „živě" neobjevuje a nemizí a hlavička nepodskakuje. */
.co-zive-tecka {
  width: 9px; height: 9px; border-radius: 50%;
  border: 2px solid var(--line-strong); box-sizing: border-box;
}
/* Běžící závod: pilulka v barvě živého stavu s pulzující tečkou a místem. */
.co-zive.je-zive {
  height: 38px; padding: 0 .9rem; border-radius: 19px;
  background: rgba(255, 76, 60, .12); border: 1px solid rgba(255, 76, 60, .45);
  color: var(--live-text); font-weight: 500;
}
.co-zive.je-zive .hp-dot { width: 9px; height: 9px; }
.co-zive.je-zive:hover { color: var(--text); }

/* Zápatí: sekce a věta vlevo, spojení vpravo. */
.co-footer-left { display: flex; align-items: center; gap: 1.5rem; }
/* Věta o firmě stojí vpravo vedle e-mailu. `--muted`, ne `--faint`: ten je
   pod 4,5:1 a v zápatí se to pozná. */
.co-footer-veta { font-size: .82rem; color: var(--muted); }

/* Galerie podle návrhu: mřížka alb 4 sloupce s většími mezerami mezi řádky. */
.ga-grid { gap: 28px 20px; }
.ga-card { gap: .75rem; }
.ga-cover img { border-radius: var(--radius-btn); }
.ga-count {
  right: 10px; bottom: 10px; padding: .25rem .55rem; border-radius: 12px;
  background: rgba(14, 20, 31, .85); font-size: .75rem;
}
.ga-title { font-size: 1rem; font-weight: 600; line-height: 1.3; }
.ga-meta { display: flex; gap: .6rem; align-items: baseline; font-size: .82rem; }
.ga-meta .cislo { font-size: .75rem; }

.ga-head-text { display: flex; flex-direction: column; gap: .35rem; }
.ga-head-rok { font-size: .85rem; }
.ga-head-meta a { color: var(--accent); }

/* Lupa v hlavičce — čtvercové tlačítko vedle odkazů, aby se netvářila jako
   další položka menu. */
.co-lupa {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: var(--radius-btn);
  border: 1px solid var(--border); color: var(--text-2);
}
.co-lupa:hover { border-color: var(--accent); color: var(--text); }

.hledat-pole { max-width: 40rem; margin: 1.25rem 0 2rem; }

/* ===== Úvod v3 (oprava podle screenshotu) ===== */
/* Hlavička splývá se stránkou — žádné vlastní pozadí ani rám, jen odsazení
   stejné jako obsah, aby logo lícovalo s pásem fotek i s mřížkou pod ním. */
/* Lišta nemá vlastní box (podle návrhu), ale POZADÍ stránky mít musí: je
   `sticky`, takže s průhledným pozadím se pod ní obsah roloval a prosvítal
   skrz — vypadalo to, že stránka jde přes lištu. Barva je táž jako pod ní,
   takže v klidu nahoře žádný box vidět není. */
body.site-shell .site-header {
  background: var(--bg); border: 0; box-shadow: none; height: auto;
  /* Dole jen zlomek toho co nahoře: lišta nemá vlastní pozadí ani rám, takže
     její spodní odsazení divák nevidí jako součást pruhu — sečte se mu
     s odsazením obsahu v jednu díru pod logem (bylo 50 px od spodní hrany
     claimu k prvnímu řádku obsahu). Nahoře 1.1rem zůstává: to je okraj
     stránky nad logem. */
  padding-block: 1.1rem 0.25rem;
}
body.site-shell .site-header-main { align-items: flex-start; }
/* Značka = logo a pod ním claim roztažený na TUTÉŽ šířku. Blok má proto
   pevnou šířku podle vkládaného loga (220 px desktop, 165 px mobil, 140 px
   na nejužších displejích) — logo se nesmí škálovat, takže šířku nelze
   nechat na obsahu. */
.rc-logo { flex-direction: column; align-items: flex-start; gap: 6px; width: 220px; }
/* Rozestup dělá `space-between`, ne `letter-spacing`: ten by přesnou šířku
   trefil jen u jedné jazykové verze claimu (CZ 15 znaků, EN 16). */
.rc-claim {
  /* `width: 100%` je nutné: bez něj se flex položka ve sloupci smrskne na
     obsah (128 px) a `space-between` nemá co rozestupovat. */
  display: flex; justify-content: space-between; width: 100%;
  font: 500 11px/1 var(--font-mono); text-transform: uppercase; color: var(--muted);
}
@media (max-width: 720px) {
  .rc-logo { width: 165px; }
  .rc-claim { font-size: 9px; }
}
@media (max-width: 420px) {
  .rc-logo { width: 140px; }
}

/* Pás fotek: uvnitř kontejneru a nikdy širší než okno. Trik s `50% - 50vw`
   počítal se šířkou VIEWPORTU včetně svislého posuvníku, takže na stránce
   vznikl vodorovný scroll. */
.ph-pas {
  width: 100%; margin-inline: 0; height: 130px; margin-top: 0;
  grid-auto-flow: unset; grid-template-columns: repeat(8, minmax(0, 1fr));
  border-radius: var(--radius-panel);
}
body.site-shell { overflow-x: hidden; }

/* Panel má výšku podle obsahu a při rolování zůstane vidět — seznam vpravo je
   dlouhý a panel „co se právě děje" je to, kvůli čemu sem lidi chodí. */
.hp-panel { min-height: 0; max-height: 560px; position: sticky; top: 24px; }

.hp-season-head { align-items: baseline; }
.hp-year { font-size: 48px; }

/* Záložky měsíců. Budoucí měsíc je tlumený: ví se o něm z kalendáře, ale
   výsledky ještě nemá. */
.hp-mesice { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 1rem; }
.hp-mesic {
  padding: .3rem .7rem; border-radius: var(--radius-pill); font-size: .82rem;
  border: 1px solid transparent; color: var(--text-2); text-decoration: none;
}
.hp-mesic:hover { border-color: var(--line-strong); text-decoration: none; }
.hp-mesic.is-active { background: var(--text); border-color: var(--text); color: var(--bg); font-weight: 500; }
.hp-mesic.je-budouci { color: var(--faint); }

/* Řádek závodu na JEDEN řádek: datum · název · disciplína · dokumenty. */
a.hp-race {
  grid-template-columns: 4rem minmax(0, 1fr) 5.5rem auto; min-height: 40px;
  padding: .35rem 0; gap: 1rem; align-items: center;
}
.hp-race-main { flex-direction: row; align-items: baseline; gap: .6rem; min-width: 0; }
.hp-race-name {
  font-size: .94rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.hp-race-date { font-size: .82rem; }
/* Disciplína je zkratka ve vlastním sloupci, ne pokračování názvu. */
.hp-race-meta {
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .5px; color: var(--muted); white-space: nowrap;
}
.hp-group-place { font-size: .82rem; font-weight: 600; color: var(--text-2); }
.hp-group { margin-bottom: 1.1rem; }

.hp-mesic-nav {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem;
  /* ŽÁDNÝ `border-top`: seznam už uzavírá spodní čára svého posledního řádku
     a druhá hned pod ní vypadala jako čára navíc. */
  margin-top: 1.1rem;
  font-size: .85rem; color: var(--muted);
}
.hp-mesic-nav a:last-child { justify-self: end; }
.hp-mesic-stred { color: var(--text-2); }

/* Patička na desktopu drží u spodní hrany okna — je to jen pruh s odkazy
   a takhle je po ruce, aniž by kvůli ní musel člověk rolovat na konec. */
@media (min-width: 900px) {
  body.site-shell .site-footer {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 20;
    height: 44px; padding-block: 0; margin-top: 0;
    /* Barva z TOKENU, ne natvrdo: zapsaná tmavá hodnota zůstala tmavá i ve
       světlém motivu a odkazy v patičce byly nečitelné. */
    background: var(--bg); border-top: 1px solid var(--line);
  }
  /* V pruhu 44 px musí být všechno na JEDNOM řádku, jinak text přeteče ven:
     věta o firmě jde vedle odkazů, ne pod ně. */
  body.site-shell .co-footer-left { flex-direction: row; align-items: center; gap: 1.5rem; }
  body.site-shell .site-main { padding-bottom: 68px; }
}
@media (min-width: 900px) and (max-width: 1200px) {
  /* Na užším desktopu se věta nevejde vedle odkazů ani kontaktů. */
  body.site-shell .co-footer-veta { display: none; }
}

/* Telefon — musí stát až tady, za blokem v3: dřívější media query by pozdější
   prosté pravidlo `.ph-pas` (stejná specifita) přebilo a pás by měl osm
   sloupců i na mobilu, kde jsou vidět tři fotky. */
@media (max-width: 900px) {
  .ph-pas { grid-template-columns: repeat(3, minmax(0, 1fr)); height: 96px; }
  /* Název má na telefonu celou šířku — vedle sloupce s disciplínou by z něj
     zbyly dva znaky a tři tečky. */
  a.hp-race { grid-template-columns: 3.6rem minmax(0, 1fr); row-gap: .15rem; }
  .hp-race-main { flex-direction: column; align-items: flex-start; gap: .1rem; }
  .hp-race-name { white-space: normal; overflow: visible; }
  .hp-race-docs { grid-column: 2; }
}

/* ── Stránka závodu v archivu (navrh/Zavod.html) ──────────────────────────
   Identita závodu je v OBSAHU: kód a sport, název, datum a místo, vpravo
   soubory ke stažení. Dřív ji nesla lišta nahoře vedle firemní navigace. */
/* Hlavička je jeden sloupec: číslo, název, pod ním datum, místo a soubory.
   Soubory dřív stály u pravého okraje stránky — 400 px za koncem listiny. */
.zv-head { display: flex; flex-direction: column; gap: .6rem; margin-bottom: 1.5rem; }
.zv-kod {
  font-family: var(--font-mono); font-size: 13px; letter-spacing: 1px; color: var(--muted);
}
.zv-h1 { margin: 0; font-size: 30px; line-height: 1.15; font-weight: 600; color: var(--text); text-wrap: balance; }
/* Horní řádek hlavičky: číslo a sport vlevo, listování vpravo. */
.zv-horni { display: flex; align-items: center; justify-content: space-between; gap: .5rem 1rem; flex-wrap: wrap; }
.zv-nav {
  display: flex; align-items: center; gap: .35rem 1rem; flex-wrap: wrap;
  font-size: .78rem; text-transform: uppercase; letter-spacing: .07em;
}
.zv-nav a { color: var(--text-2); text-decoration: none; }
.zv-nav a:hover { color: var(--accent); }
.zv-nav .arch-soused { width: auto; height: auto; border: 0; border-radius: 0; font-size: inherit; gap: .35rem; }
.zv-nav .arch-soused:hover { background: none; }
.zv-nav .arch-soused.is-disabled { color: var(--c-475569); }
.zv-nav-vse { padding: 0 .9rem; border-left: 1px solid var(--line); border-right: 1px solid var(--line); }
/* Telefon: navigace na vlastním řádku přes celou šířku — předchozí vlevo,
   ročník uprostřed, další vpravo (jinak se „Další" zalomilo samo). */
@media (max-width: 600px) {
  .zv-nav { width: 100%; justify-content: space-between; flex-wrap: nowrap; gap: .5rem; }
  .zv-nav-vse { padding: 0; border: 0; text-align: center; }
}
.zv-meta { display: flex; gap: .9rem; align-items: center; flex-wrap: wrap; font-size: 1rem; color: var(--text-2); }
.zv-datum { font-size: 18px; color: var(--accent); }
/* Soubory: chip nese FORMÁT (PDF / XLS) — obsah je u všech týž. */
.zv-docs { display: flex; gap: .5rem; font-family: var(--font-mono); font-size: 13px; margin-left: .3rem; }
.zv-doc {
  display: flex; align-items: center; height: 32px; padding: 0 12px;
  border-radius: 6px; border: 1px solid var(--line-strong); color: var(--text-2);
  text-decoration: none; white-space: nowrap;
}
.zv-doc:hover { border-color: var(--accent); color: var(--text); text-decoration: none; }

.zv-cats-row {
  display: flex; justify-content: space-between; align-items: center;
  gap: 1rem; flex-wrap: wrap; margin-bottom: 1.1rem;
}
.zv-cats { display: flex; gap: .4rem; flex-wrap: wrap; font-family: var(--font-mono); font-size: 14px; }
.zv-cat {
  padding: .5rem 1rem; border-radius: 6px; border: 1px solid var(--line-strong);
  color: var(--text-2); text-decoration: none;
}
.zv-cat:hover { border-color: var(--accent); color: var(--text); text-decoration: none; }
.zv-cat.is-active {
  background: var(--text); border-color: var(--text); color: var(--bg); font-weight: 500;
}

/* Listina je široká PODLE OBSAHU, jako na živých výsledcích. Roztažení na
   celou šířku nafouklo sloupec jména na 600 px (živá listina má 164) a za
   příjmením zbývalo prázdno přes půl obrazovky.
   Obal drží plnou šířku, aby tabulka mohla v úzkém okně rolovat do strany. */
.arch-results-wrap { width: 100%; }
.arch-results { width: auto; max-width: 100%; }

@media (max-width: 900px) {
  .zv-head { flex-direction: column; align-items: stretch; gap: 1rem; }
  .zv-h1 { font-size: 22px; }
  .zv-docs { flex-wrap: wrap; }
}
.zv-legenda { margin: .9rem 0 0; font-size: 13px; color: var(--muted); }

/* Archivní listina na tabletu. Plná listina (ročník, VT, oddíl, ztráta) se
   vejde až od ~1000 px — změřeno: v pásmu 720–1000 px přetékala o 60 až
   250 px a VÝSLEDEK, kvůli kterému sem člověk jde, končil mimo obraz.
   Platí JEN pro archiv: živé výsledky mají svůj breakpoint (720 px) a ten
   se tady neposouvá. */
@media (max-width: 999.98px) {
  .arch-results .time-col-detail { display: none; }
  .arch-results .td-lead { display: none; }
}

/* Čísla sezóny na úzkém panelu (desktop 900–1200 px). Panel je tam sloupec
   5/12, takže na jedno ze tří čísel zbylo 74–94 px — a čtyřmístný počet startů
   je v LED písmu 100 px široký. Číslice přetekly přes sousední sloupec a
   „4506" a „13" se četly jako „450613" (změřeno Playwrightem).
   Zmenšit písmo nejde: pod 40 px se LED matice rozpadá (zadání). Čísla proto
   jdou pod sebe a popisek si stoupne vedle. */
@media (min-width: 900px) and (max-width: 1199.98px) {
  .hp-stats { grid-template-columns: 1fr; gap: .5rem; }
  .hp-stat { flex-direction: row; align-items: baseline; gap: .7rem; }
  .hp-stat-num { min-width: 3.2em; }
}

/* Barevná varianta loga podle motivu. Body jsou světle modré (#d7e3ff) a na
   světlém pozadí by zmizely (kontrast 1,1:1), proto je vedle tmavé varianty
   i světlá s tmavými body.
   ŽÁDNÝ `display` na obecném `.rc-logo img` — to už tu jednou bylo a kreslila
   se obě velikosti vedle sebe; o viditelnosti rozhodují jen tyhle třídy. */
.rc-logo .rc-logo-svetlo { display: none; }
:root[data-theme="light"] .rc-logo .rc-logo-tma { display: none; }
:root[data-theme="light"] .rc-logo .rc-logo-velke.rc-logo-svetlo { display: block; }
@media (max-width: 720px) {
  :root[data-theme="light"] .rc-logo .rc-logo-velke.rc-logo-svetlo { display: none; }
  :root[data-theme="light"] .rc-logo .rc-logo-male.rc-logo-svetlo { display: block; }
}

/* ── Ročník archivu: uspořádání jako sezóna na úvodu ──────────────────────
   Pás ročníků platí na VŠECH šířkách. Dřív byl jen na telefonu a na desktopu
   zbyly šipky na sousední rok — z roku 2026 do roku 2008 tak vedlo osmnáct
   kliků. `flex-wrap` místo vodorovného rolování: dvacet tři ročníků se na
   širokou obrazovku vejde na dva řádky a nic se neschová za okraj. */
.ay-years-strip { display: flex; flex-wrap: wrap; overflow-x: visible; }
@media (max-width: 900px) {
  /* Na telefonu se řádky nelámou, pás roluje do strany — jinak by zabral
     půl obrazovky, než se návštěvník dostane k závodům. */
  .ay-years-strip { flex-wrap: nowrap; overflow-x: auto; }
}
/* Filtr sportů v ročníku: stejné chipy jako v rozcestníku, jen s odstupem
   od hledání nad ním. */
.ay-sports-row { margin: 0 0 1.25rem; }
/* Místo konání nese nadpis skupiny, takže řádek má jen datum, název
   a dokumenty — stejně jako na úvodu. */
.ay-race { grid-template-columns: 4.6rem minmax(0, 1fr) auto; align-items: center; }

/* ── Výběr ročníku (časová osa + mřížka desetiletí) ───────────────────────
   Nahradilo pás chipů se všemi ročníky: ten se na šířku nevešel čitelně
   a šipky na sousední rok znamenaly z roku 2026 do roku 2008 osmnáct kliků. */
.ay-year-btn {
  display: inline-flex; align-items: baseline; gap: .5rem;
  background: none; border: 0; padding: 0; cursor: pointer; color: inherit; font: inherit;
}
.ay-year-sip { font-size: 1.1rem; color: var(--muted); }
.ay-year-btn:hover .ay-year-sip { color: var(--text); }

/* Mřížka desetiletí. Roky bez dat zůstávají prázdné — je vidět, kde je
   v historii díra. */
.ay-year-panel {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-panel); box-shadow: 0 12px 32px rgba(0, 0, 0, .35);
  padding: 1rem; margin: 0 0 1.25rem; display: flex; flex-direction: column; gap: .5rem;
  max-width: 34rem;
}
.ay-decade { display: grid; grid-template-columns: 3.2rem minmax(0, 1fr); align-items: center; gap: .6rem; }
.ay-decade-label { font-size: .82rem; color: var(--muted); }
.ay-decade-cells { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: .25rem; }
.ay-cell {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .1rem; min-height: 2.6rem; border-radius: var(--radius-chip);
  border: 1px solid var(--line-strong); color: var(--text-2); text-decoration: none;
}
.ay-cell:hover { border-color: var(--accent); color: var(--text); text-decoration: none; }
.ay-cell.is-active {
  background: var(--accent); border-color: var(--accent); color: var(--accent-ink);
}
.ay-cell.is-active .ay-cell-pocet { color: var(--accent-ink); opacity: .75; }
.ay-cell-rok { font-size: .82rem; }
.ay-cell-pocet { font-size: .68rem; color: var(--muted); }
.ay-cell.je-prazdna { border: 0; min-height: 2.6rem; }

/* Časová osa. Výška sloupce = počet závodů; pás má 40 px, aby se vešel nad
   seznam a nepřebil ho. */
.ay-osa { margin: 0 0 1.5rem; }
.ay-osa-pas { display: grid; gap: 2px; align-items: end; height: 40px; }
.ay-osa-rok { display: flex; align-items: flex-end; height: 100%; text-decoration: none; }
.ay-osa-sloupec {
  width: 100%; border-radius: 2px 2px 0 0; background: #3a4760;
  transition: background .12s ease;
}
.ay-osa-rok:hover .ay-osa-sloupec { background: #5a6679; }
.ay-osa-rok.is-active .ay-osa-sloupec { background: var(--accent); }
.ay-osa-popisky { display: grid; gap: 2px; margin-top: .35rem; }
.ay-osa-popisek { font-size: 11px; color: var(--muted); text-align: center; white-space: nowrap; }

@media (prefers-reduced-motion: reduce) {
  .ay-osa-sloupec { transition: none; }
}
@media (max-width: 899.98px) {
  /* Na telefonu by sloupec měl pár pixelů a popisky by se slily — ročník se
     vybírá mřížkou z nadpisu. */
  .ay-osa { display: none; }
  .ay-year-panel { max-width: none; padding: .75rem; }
  .ay-decade { grid-template-columns: 1fr; gap: .25rem; }
  .ay-decade-cells { gap: .2rem; }
}

/* ── Stránka ročníku: dvě řady ovládání ───────────────────────────────────
   Dřív jich byly čtyři nad sebou (pilulky roků, hledání, sporty, měsíce)
   a seznam závodů začínal až v půlce obrazovky. */
.vr-radek {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1.5rem; flex-wrap: wrap; margin-bottom: 1.25rem;
}
.vr-rok { display: flex; align-items: center; gap: 1rem; min-width: 0; }
/* Kruhová šipka 44 px — cíl, do kterého se trefí i palec. */
.vr-sip {
  display: inline-flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; flex: 0 0 44px; border-radius: 50%;
  border: 1px solid var(--line-strong); color: var(--text-2);
  font-size: 1.3rem; line-height: 1; text-decoration: none;
}
.vr-sip:hover { border-color: var(--accent); color: var(--text); text-decoration: none; }
/* Vypnutá šipka zůstává na místě (jinak by rok poskakoval), ale nevede nikam. */
.vr-sip.je-vypnuta { border-color: var(--line); color: var(--faint); opacity: .45; }
.vr-year { font-size: 64px; margin: 0; line-height: 1; }
.vr-count { font-size: .9rem; color: var(--muted); white-space: nowrap; }

.vr-nastroje { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
/* Hledání bez tlačítka — odesílá Enter. */
.vr-hledani label {
  display: flex; align-items: center; gap: .6rem; width: 300px; height: 40px;
  box-sizing: border-box; padding: 0 .9rem; border-radius: var(--radius-btn);
  background: var(--surface); border: 1px solid var(--border); color: var(--muted);
}
.vr-hledani input {
  flex: 1 1 auto; min-width: 0; background: none; border: 0; outline: none;
  color: var(--text); font: inherit; font-size: .9rem;
}
.vr-roky { display: flex; align-items: stretch; }
.vr-roky-btn, .vr-roky-sip {
  height: 40px; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--line-strong); background: none; color: var(--text-2);
  font: inherit; font-size: .9rem; cursor: pointer; text-decoration: none;
}
.vr-roky-btn { padding: 0 .9rem; border-radius: var(--radius-btn) 0 0 var(--radius-btn); border-right: 0; }
.vr-roky-sip { width: 36px; border-radius: 0 var(--radius-btn) var(--radius-btn) 0; }
.vr-roky-btn:hover, .vr-roky-sip:hover { border-color: var(--accent); color: var(--text); text-decoration: none; }

/* Řada 2: měsíce vlevo, disciplíny vpravo, pod nimi jedna linka. */
.vr-filtry {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 1rem; flex-wrap: wrap; margin-bottom: 1.1rem;
  border-bottom: 1px solid var(--line);
}
.vr-mesice { display: flex; flex-wrap: wrap; gap: 1.1rem; }
.vr-mesic {
  padding: .45rem 0; color: var(--text-2); text-decoration: none; font-size: .9rem;
  border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.vr-mesic:hover { color: var(--text); text-decoration: none; }
.vr-mesic.is-active { color: var(--text); border-bottom-color: var(--accent); font-weight: 500; }
/* Segmentový přepínač disciplín. */
.vr-disc {
  display: flex; gap: 2px; padding: 3px; margin-bottom: .4rem;
  background: var(--surface); border-radius: var(--radius-btn);
}
.vr-disc-seg {
  padding: .3rem .75rem; border-radius: var(--radius-chip); font-size: .85rem;
  color: var(--text-2); text-decoration: none; white-space: nowrap;
}
.vr-disc-seg:hover { color: var(--text); text-decoration: none; }
.vr-disc-seg.is-active { background: var(--line-strong); color: var(--text); }

/* Disciplína jako vlastní sloupec v řádku závodu. */
.ay-race { grid-template-columns: 4.6rem minmax(0, 1fr) 90px auto; }
.vr-race-disc {
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .5px; color: var(--muted); white-space: nowrap;
}

@media (max-width: 899.98px) {
  .vr-radek { gap: .9rem; }
  .vr-year { font-size: 44px; }
  .vr-nastroje { width: 100%; }
  .vr-hledani { flex: 1 1 auto; }
  .vr-hledani label { width: 100%; }
  .vr-filtry { align-items: stretch; flex-direction: column; gap: .5rem; }
  .vr-mesice { overflow-x: auto; flex-wrap: nowrap; gap: .9rem; }
  .vr-disc { margin-bottom: .5rem; overflow-x: auto; }
  /* Disciplína se na telefonu vejde pod název, vlastní sloupec by ukrojil
     polovinu šířky. */
  .ay-race { grid-template-columns: 4.2rem minmax(0, 1fr) auto; }
  .vr-race-disc { grid-column: 2; }
}

/* ── Ročníky archivu jako mřížka desetiletí ───────────────────────────────
   Nahradilo sloupcový graf s počty závodů: srovnávat ročníky mezi sebou není
   smysl téhle stránky, návštěvník sem jde pro konkrétní rok. Tlačítka mají
   proto stejnou velikost a nesou jen letopočet. */
.av-roky-panel {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-panel); padding: 1.75rem 1.75rem 1.25rem;
  display: flex; flex-direction: column; gap: 1rem; margin-bottom: 2.5rem;
}
.av-roky { display: flex; flex-direction: column; gap: .5rem; }
.av-decade { display: grid; grid-template-columns: 3.4rem minmax(0, 1fr); align-items: center; gap: .75rem; }
.av-decade-label { font-size: .85rem; color: var(--muted); }
.av-decade-cells { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: .4rem; }
.av-rok {
  display: flex; align-items: center; justify-content: center; min-height: 2.6rem;
  border-radius: var(--radius-chip); border: 1px solid var(--line-strong);
  color: var(--text-2); text-decoration: none; font-family: var(--font-mono); font-size: .9rem;
}
.av-rok:hover { border-color: var(--accent); color: var(--text); text-decoration: none; }
.av-rok.is-current { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.av-rok.je-prazdny { border: 0; }

@media (max-width: 720px) {
  .av-roky-panel { padding: 1rem; }
  .av-decade { grid-template-columns: 1fr; gap: .3rem; }
  .av-decade-cells { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

/* Řádek ročníku po zjednodušení: vlevo šipky s rokem, vpravo textový odkaz
   na přehled. Hledání se přesunulo do lupy v hlavičce, mřížka ročníků do
   přehledu — co nepotřebuje většina návštěv, patří o úroveň hlouběji. */
.vr-radek { margin: 48px 0 36px; align-items: center; }
.vr-vsechny { color: var(--accent); font-size: .9rem; white-space: nowrap; }
.vr-filtry { margin-bottom: 36px; }

/* Hledání v hlavičce: pole se rozbalí vedle lupy, nezakrývá navigaci. */
.co-hledani label {
  display: flex; align-items: center; height: 36px; padding: 0 .8rem;
  border-radius: var(--radius-btn); background: var(--surface);
  border: 1px solid var(--border);
}
.co-hledani input {
  width: 15rem; max-width: 40vw; background: none; border: 0; outline: none;
  color: var(--text); font: inherit; font-size: .88rem;
}

@media (max-width: 899.98px) {
  .vr-radek { margin: 24px 0 20px; }
  .vr-filtry { margin-bottom: 20px; }
  .co-hledani input { width: 9rem; }
}

/* Léta před archivem (1986–2003) jsou ročník jako každý jiný — dlaždice
   přímo v mřížce na místě roku 2003, přes dvě políčka (rozsah je delší). */
.av-rok--rozsah { grid-column: span 2; padding: 0 .5rem; white-space: nowrap; }

/* Věta místo lišty měsíců (historie měsíce nemá). */
.vr-veta {
  margin: 0 0 36px; padding-bottom: .9rem; border-bottom: 1px solid var(--line);
  font-size: .9rem; color: var(--text-2);
}
.vr-veta a { color: var(--accent); }

/* Druhý řádek pod názvem: u historie popis služby („zpracování výsledků"),
   jinde cokoli, co k závodu patří, ale nemá ukusovat z jeho jména. */
.vr-race-popis { font-size: 13px; color: var(--muted); }

/* ── Stránka ročníku: mřížka 5/7 jako úvod ────────────────────────────────
   Vlevo identita ročníku (drží se při rolování), vpravo filtry a výpis —
   táž kostra jako na úvodní stránce, aby obě stránky vypadaly jako jedna věc. */
.vr-layout {
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  /* Mřížka je PRVNÍ věc na stránce — odsazení nahoře by se přičetlo k mezeře
     pod lištou (dřív 48 px navíc, celkem 88 px prázdna nad ročníkem). */
  gap: 40px; align-items: start; margin-top: 8px;
}
.vr-bok { display: flex; flex-direction: column; gap: 1rem; position: sticky; top: 24px; }
.vr-year { font-size: 112px; margin: 0; line-height: 1; }
.vr-sousedi { display: flex; gap: .5rem; flex-wrap: wrap; }
/* Pilulka nese LETOPOČET, ne jen šipku — je hned vidět, kam vede. */
.vr-sousedni {
  display: inline-flex; align-items: center; height: 44px; padding: 0 1rem;
  border-radius: var(--radius-pill); border: 1px solid var(--line-strong);
  color: var(--text-2); text-decoration: none; font-size: .9rem; white-space: nowrap;
}
.vr-sousedni:hover { border-color: var(--accent); color: var(--text); text-decoration: none; }
.vr-sousedni.je-vypnuta { border-color: var(--line); color: var(--faint); opacity: .45; }
.vr-obsah { min-width: 0; }

/* ── Řádek závodu: jedna komponenta pro úvod i ročník ─────────────────────
   52 px datum | název s disciplínou | 112 px dokumenty. Sloupec dokumentů má
   pevnou šířku a zarovnává se VLEVO, takže „PDF" je na každém řádku na témž
   místě a oko sjede po sloupci. */
.hp-race {
  display: grid; grid-template-columns: 52px minmax(0, 1fr) 112px;
  align-items: center; gap: 1rem; min-height: 40px; padding: .35rem 0;
  border-bottom: 1px solid var(--line); text-decoration: none; color: inherit;
}
.hp-race-date { font-family: var(--font-mono); font-weight: 500; font-size: 13px; color: var(--accent); }
.hp-race-main { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
.hp-race-name {
  font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: var(--text); text-decoration: none;
}
.hp-race-name:hover { color: var(--accent); text-decoration: none; }
/* Disciplína stojí hned za názvem a nesmí se zúžit — proto `flex-shrink: 0`. */
.hp-race-meta {
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .5px; color: var(--muted); white-space: nowrap; flex-shrink: 0;
}
.hp-race-docs { display: flex; gap: .7rem; justify-content: flex-start; }
/* Místo konání VŽDY na vlastním řádku pod názvem (jako popis závodu):
   za disciplínou by u krátkého názvu stálo vedle, u dlouhého se zalomilo
   a řádky seznamu by vypadaly každý jinak. Dlouhé se zkrátí. */
.hp-race-misto {
  flex-basis: 100%; font-size: .82rem; line-height: 1.3; color: var(--muted); min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/* Druhý řádek: místo konání a za ním značka sportu. Místo se smrskne
   a případně zkrátí, značka ne — ta je krátká a nese informaci. */
.hp-race-sub {
  /* VŽDY vlastní řádek pod názvem, i když by se vešel vedle: jinak mají
     krátké závody všechno na jednom řádku a dlouhé na dvou, a seznam pak
     nemá rytmus. Dřív tohle držel `flex-basis` na samotném místě konání. */
  flex-basis: 100%; display: flex; align-items: baseline; gap: .5rem; min-width: 0;
}
.hp-race-sub .hp-race-misto { flex: 0 1 auto; }
/* Tečka jen MEZI místem a značkou: sourozenecký selektor ji nenakreslí
   u závodu, který místo nemá — jinak by řádek začínal osamělou tečkou. */
.hp-race-sub .hp-race-misto + .hp-race-meta::before {
  /* Táž tečka jako mezi státy posádky (`.td-nat-x .nx + .nx::before`). */
  content: "·"; margin-right: .5rem; color: var(--c-475569);
}

/* Dlouhý název se nevejde a uřízne se třemi puntíky — čtyři části MS pak
   vypadají stejně („…SPRINT WORLD CHAMPIONS…"). Delší jméno proto dostane
   menší písmo; třídu přidává `_radek_zavodu.html`, protože CSS délku textu
   změřit neumí. Prahy sedí na nejužší sloupec názvu (stránka ročníku). */
/* Selektor musí nést i rodiče: `.hp-race-main a` (0,2,0) v tomhle souboru
   přebíjí samotnou třídu (0,1,0) — bez toho zůstal název ve velikosti
   16,32 px a zmenšení se neprojevilo vůbec. */
.hp-race-main .hp-race-name--dlouhy { font-size: 13.5px; }
.hp-race-main .hp-race-name--velmi-dlouhy { font-size: 12px; letter-spacing: -0.1px; }
/* Menší písmo samo nestačí: v pásmu kolem 1100 px zbývá na název jen 293 px
   a 62 znaků by se do něj vešlo jen nečitelně malé. Dlouhý název se proto
   smí ZALOMIT (nejvýš dva řádky) — uříznutý konec je horší, protože čtyři
   části MS se liší až posledním slovem. */
.hp-race-main .hp-race-name--dlouhy {
  white-space: normal; overflow-wrap: anywhere; line-height: 1.25;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
}

.hp-race-doc { font-family: var(--font-mono); font-size: 11px; color: var(--muted); text-decoration: none; }
.hp-race-doc:hover { color: var(--accent); text-decoration: none; }

@media (max-width: 899.98px) {
  .vr-layout { grid-template-columns: 1fr; gap: 1.25rem; margin-top: 8px; }
  .vr-bok { position: static; }
  .vr-year { font-size: 56px; }
  /* Na telefonu se název láme a dokumenty jdou pod něj — pevný sloupec by
     ukrojil třetinu šířky. */
  .hp-race { grid-template-columns: 52px minmax(0, 1fr); row-gap: .15rem; }
  .hp-race-main { flex-direction: column; align-items: flex-start; gap: .1rem; }
  .hp-race-name { white-space: normal; overflow: visible; }
  .hp-race-docs { grid-column: 2; }
}

/* Rozsah let v nadpisu: „1986–2003" je devět znaků proti čtyřem, ve 112 px se
   zalomí doprostřed. Zůstává nad hranicí 40 px, pod kterou se LED matice
   rozpadá. */
.vr-year--rozsah { font-size: 52px; white-space: nowrap; }

/* Druhý řádek pod názvem (u historie popis služby). `flex-basis: 100%` ho
   posadí pod název — `.hp-race-main` je řádek a bez toho by stál vedle. */
/* Mezi řádky jen 2 px: sdílený `gap` (10 px) je vodorovná mezera mezi
   názvem a disciplínou — svisle odtlačoval místo konání od názvu, jako by
   patřilo k jinému závodu. */
.hp-race-main { flex-wrap: wrap; row-gap: 2px; }
.vr-race-popis { flex-basis: 100%; font-size: 13px; color: var(--muted); }

@media (max-width: 899.98px) {
  .vr-year--rozsah { font-size: 40px; }
}

/* Číslo závodu v kalendáři: je to hlavní identifikátor v propozicích
   a rozpisu svazu, tak ať je vidět dřív než archivní kód. */
.zv-cislo { color: var(--text-2); }

/* Číslo závodu v seznamu: vlastní úzký sloupec mezi datem a názvem, aby
   čísla stála pod sebou a šlo po nich sjet okem. */
.hp-race { grid-template-columns: 52px 3rem minmax(0, 1fr) 112px; }
.hp-race-cislo { font-size: 12px; color: var(--muted); }

@media (max-width: 899.98px) {
  /* Na telefonu jde číslo k datu do prvního sloupce — vlastní sloupec by
     ukrojil z názvu. */
  .hp-race { grid-template-columns: 52px minmax(0, 1fr); }
  .hp-race-cislo { grid-column: 1; font-size: 11px; }
  .hp-race-main, .hp-race-docs { grid-column: 2; }
}


/* Archivní listina je vzdušnější než živá: na živé se kouká za jízdy a řádek
   se má vejít na obrazovku, tady se čte po řádcích a 38 px bylo těsné. */
.arch-results th, .arch-results td { padding: .6rem .7rem; }

/* Penalizace v rozjížďce (FLT-5 / FLT-E) — bílý text v červeném poli, parita
   s živou kvalifikací (`.tt-rank-flt`) i s pavoukem. Nikdy monospace: pomlčka
   by v něm seděla uprostřed plné šířky a „FLT-3" vypadalo jako „FLT - 3". */
.zv-flt {
  display: inline-flex; align-items: center; justify-content: center;
  background: #b91c1c; color: #fff; padding: .1rem .4rem; border-radius: 4px;
  font-size: .7rem; font-weight: 600; line-height: 1; white-space: nowrap;
}

/* Nejvyšší dosažené umístění ve vyřazovací části („2. Semifinále"). Nezalamuje
   se — pořadí a fáze patří k sobě a zalomený sloupec by řádek rozhodil. */
.zv-umisteni { white-space: nowrap; }

/* ===== Úvod: zimní spánek — analogové hodiny a 8bitový LED pás =====
   Jen ve stavu `zima` (hp_retro.js). Panel je tu vyšší než jinde, proto
   bez stropu výšky. */
.hp-panel--zima { max-height: none; }
/* Zimní panel je vyšší než běžná obrazovka; přilepený (sticky) by spodek se
   statistikou nechal navždy pod patičkou. Lepí se jen tam, kde se vejde. */
@media (max-height: 820px) { .hp-panel--zima { position: static; } }
.hp-zima-head { display: flow-root; }
.hp-zima-head .hp-kicker { display: block; margin-bottom: .45rem; }
.hp-zima-head .hp-title { margin: 0; }
.hp-hodiny { float: right; width: 112px; height: 112px; margin: 0 0 .5rem 1rem; }
.hp-hodiny-ram { fill: none; stroke: var(--led-off); stroke-width: 1.5; }
.hp-hodiny-min { fill: var(--led-off); }
.hp-hodiny-hod, .hp-hodiny-ruc { fill: var(--accent); }
.hp-hodiny-s { fill: #ff4c3c; }
.hp-retro { margin: .25rem 0 .35rem; }
/* Titulek pod pásem: vpravo pod pásem, kde stával popisek hry, písmem
   a prostrkáním jako ostatní popisky banneru — barvou LED, ať patří k pásu
   a nepřebíjí odpočet pod ním. */
.hp-retro-titulek {
  margin: .35rem 0 0; text-align: right; font-family: var(--font-mono);
  font-size: .78rem; letter-spacing: .18em; text-transform: uppercase;
  color: var(--accent); opacity: .75;
}
.hp-retro canvas { display: block; width: 100%; height: auto; aspect-ratio: 72 / 14; }
/* Historie v číslech: šest číslic (výsledky) se musí vejít do třetiny panelu. */
/* Odpočet i statistika přes celou šíři banneru ve TŘECH stejných sloupcích
   — DNÍ / HOD / MIN lícují se sloupci statistiky. Dvojtečky odpočtu jsou na
   hraně sloupců (pseudoprvek), ne vlastní sloupec, jinak by se mřížky rozešly. */
.hp-panel--zima .hp-countdown { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
.hp-panel--zima .hp-cd-sep { display: none; }
.hp-panel--zima .hp-cd-part { position: relative; }
.hp-panel--zima .hp-cd-part:not(:last-of-type)::after {
  content: ":"; position: absolute; right: 0; top: 0; transform: translateX(50%);
  font-family: var(--font-led); font-size: 3.6rem; line-height: 1; color: var(--led-off);
}
.hp-stats--historie { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem 0; margin-top: .25rem; }
.hp-stats--historie .hp-stat { align-items: center; text-align: center; }
.hp-stats--historie .hp-stat-num { font-size: 1.9rem; white-space: nowrap; }
.hp-stat-cas { font-size: .78rem; color: var(--muted); line-height: 1.3; }
@media (max-width: 720px) {
  .hp-hodiny { width: 84px; height: 84px; }
  .hp-stats--historie .hp-stat-num { font-size: 1.3rem; }
  /* Čtyři čísla v řadě se na úzkém displeji nedají přečíst → 2×2. Archiv
     (`.av-stats`) má totéž, ale u SVÉ definice — ta stojí v souboru níž
     a stejně specifické pravidlo odtud by přebila. */
  .hp-stats--historie { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hp-panel--zima .hp-cd-part:not(:last-of-type)::after { font-size: 2.6rem; }
}

/* ===== Úvod: výsledky posledního víkendu — moderní tabule =====
   Kategorie se střídají (`hp_vysledky.js`) a řádky postupně vjedou. Banner je
   vyšší než ostatní stavy, aby se vešlo všech 10 řádků bez rolování; jméno
   a oddíl jsou na JEDNOM řádku, ať řádek zůstane nízký. Jména a medailové
   barvy jako na živých výsledcích. */
/* `min-width: 0`: název závodu se nezalamuje a bez toho by roztáhl celou
   mřížku úvodu (na telefonu přes okraj obrazovky) místo aby se zkrátil „…". */
.hp-panel--vysledky { max-height: none; min-width: 0; }
@media (max-height: 820px) { .hp-panel--vysledky { position: static; } }
.hp-panel--vysledky .hp-title a { color: inherit; text-decoration: none; }
.hp-vys-titul { font-size: 1.2rem; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hp-vys-titul a { display: inline; }
.hp-panel--vysledky .hp-title a:hover { text-decoration: underline; }
.hp-vys { margin-top: .25rem; }
.hp-vys-nazev {
  margin: 0 0 .6rem; font-family: var(--font-mono); font-size: .8rem; font-weight: 600;
  letter-spacing: .18em; text-transform: uppercase; color: var(--accent);
}
/* Výška řádku je PEVNÁ, aby okno na plný počet řádků (`--radku`) mělo vždy
   stejnou výšku, ať má kategorie závodníků kolik chce. */
.hp-vys { --radek: 2.55rem; }
.hp-vys-nazev a { color: inherit; text-decoration: none; }
.hp-vys-nazev a:hover { text-decoration: underline; }
a.hp-vys-okno { display: block; color: inherit; text-decoration: none; transition: border-color .15s; }
a.hp-vys-okno:hover, a.hp-vys-okno:focus-visible { border-color: var(--accent); }
.hp-vys-okno {
  border-radius: 10px; background: var(--surface-2); border: 1px solid var(--line);
  min-height: calc(var(--radku, 10) * var(--radek) + .5rem + 2px);   /* + rámeček */
}
.hp-vys-seznam { list-style: none; margin: 0; padding: .25rem 0; }
.hp-vys-radek {
  /* Každý řádek je vlastní mřížka — čas a ztráta proto mají PEVNOU šířku,
     jinak by se u delší ztráty („+100,73") čas v řádku posunul. */
  display: grid; grid-template-columns: 1.8rem minmax(0, 1fr) 4.6rem 4.1rem; gap: .7rem; align-items: center;
  box-sizing: border-box; height: var(--radek); padding: 0 .9rem; border-bottom: 1px solid var(--line);
  animation: hp-vys-vjezd .45s cubic-bezier(.2, .7, .2, 1) both; animation-delay: calc(var(--i) * 70ms);
}
.hp-vys-radek:last-child { border-bottom: 0; }
@keyframes hp-vys-vjezd { from { opacity: 0; transform: translateX(-14px); } to { opacity: 1; transform: none; } }
.hp-vys-poradi {
  display: inline-grid; place-items: center; width: 1.7rem; height: 1.7rem; border-radius: 50%;
  font-family: var(--font-mono); font-weight: 600; font-size: .85rem; color: var(--text-2);
  background: var(--surface); border: 1px solid var(--line-strong);
}
/* medaile pro top 3 — tytéž barvy jako karty živých výsledků */
.hp-vys-radek[data-pos="1"] .hp-vys-poradi { background: #facc15; border-color: #facc15; color: #1a1300; }
.hp-vys-radek[data-pos="2"] .hp-vys-poradi { background: #cbd5e1; border-color: #cbd5e1; color: #0f172a; }
.hp-vys-radek[data-pos="3"] .hp-vys-poradi { background: #d97706; border-color: #d97706; color: #1a0d00; }
.hp-vys-jmeno { min-width: 0; display: flex; align-items: baseline; gap: .55rem; line-height: 1.3; }
.hp-vys-cele { flex: 0 1 auto; min-width: 0; }
.hp-vys-oddil { flex: 1 1 0; min-width: 0; }
.hp-vys-jmeno .time-surname { font-weight: 600; }
.hp-vys-cele, .hp-vys-oddil { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hp-vys-oddil { font-size: .8rem; color: var(--muted); }
.hp-vys-cas { font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-size: 1rem; color: var(--accent); text-align: right; }
/* Ztráta na vítěze — jako na živých výsledcích tlumeně; vítěz ji nemá. */
.hp-vys-ztrata { font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-size: .8rem; color: var(--muted); text-align: right; }
.bez-ztraty .hp-vys-radek { grid-template-columns: 1.8rem minmax(0, 1fr) 4.6rem; }
.bez-ztraty .hp-vys-ztrata { display: none; }
/* Telefon: křestní jméno pryč jako na živých výsledcích, ať se vejde
   příjmení, oddíl, čas i ztráta. */
@media (max-width: 480px) {
  .hp-vys .time-given { display: none; }
  .hp-vys-radek { gap: .5rem; padding: 0 .7rem; grid-template-columns: 1.7rem minmax(0, 1fr) 4.1rem 3.7rem; }
  .bez-ztraty .hp-vys-radek { grid-template-columns: 1.7rem minmax(0, 1fr) 4.1rem; }
  .hp-vys-cas { font-size: .92rem; }
}
@media (prefers-reduced-motion: reduce) { .hp-vys-radek { animation: none; } }

/* Šipka v odkazech (`sipka()` v šablonách): SVG místo znaku „→", který byl
   v Plex Sans krátký a tenký jako pomlčka. Velikost a barva z textu odkazu;
   pod myší se lehce posune ve směru odkazu. */
.sipka {
  display: inline-block; width: 1.05em; height: 1.05em; vertical-align: -0.17em;
  flex: 0 0 auto; transition: transform .15s ease;
}
a:hover > .sipka--vpravo, a:focus-visible > .sipka--vpravo { transform: translateX(2px); }
a:hover > .sipka--vlevo, a:focus-visible > .sipka--vlevo { transform: translateX(-2px); }
@media (prefers-reduced-motion: reduce) { .sipka { transition: none; } }

/* Odkazy v záhlaví a zápatí webu versálkami (text v šablonách zůstává, ať se
   nemíchá s překlady). Menší písmo a prostrkání, aby versálky nebyly těžké
   a záhlaví se nerozšířilo. E-mail a věta o firmě v zápatí zůstávají. */
.co-nav a, .co-menu-panel a, .co-footer-nav a {
  text-transform: uppercase; letter-spacing: .07em; font-size: .8rem;
}

/* Archiv výsledků: sekce Statistika pod „Z historie" — táž čísla jako zimní
   banner, ale bez LED: samostatné rámečky stejného stylu jako karty
   historie, mřížka přes celou šířku sekce (stejně široká jako karty nad ní)
   a čísla stejným písmem jako ročníky v kartách (`.cislo`, Plex Mono). */
.av-stats { display: flex; flex-direction: column; gap: .9rem; margin-top: 2rem; }
.av-stats .hp-stats--historie {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .6rem; margin: 0;
}
.av-stats .hp-stat {
  align-items: center; justify-content: center; text-align: center; gap: .3rem;
  padding: 1rem .85rem; border: 1px solid var(--border); border-radius: var(--radius-panel);
}
.av-stats .hp-stat-num {
  font-family: var(--font-mono); font-weight: 500; font-variant-numeric: tabular-nums;
  font-size: 1.3rem; line-height: 1.2; color: var(--accent);   /* = .av-history-year */
}
@media (max-width: 720px) {
  .av-stats .hp-stats--historie { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* Mapka míst pod čísly statistiky. Obrys je jen vodítko, nese ho tenká linka;
   tečky mají barvu zvýraznění a jsou poloprůhledné, aby u Prahy a Českých
   Vrbných bylo vidět, že se dvě místa překrývají. */
.av-mapa { margin: .9rem 0 0; }
/* Mapka je ilustrace, ne podklad k měření — přes celou šířku sekce by
   přerostla čísla nad sebou, proto strop a vycentrování. */
.av-mapa-svg { display: block; width: 100%; max-width: 760px; height: auto; margin: 0 auto; }
.av-mapa-soused { fill: none; stroke: var(--muted); stroke-width: 1.5; stroke-opacity: .55; stroke-dasharray: 5 4; }
.av-mapa-obrys { fill: var(--surface-2); stroke: var(--border); stroke-width: 2; }
.av-mapa-bod { fill: var(--accent); fill-opacity: .5; stroke: var(--accent); stroke-width: 1; }
.av-mapa-bod:hover { fill-opacity: .85; }
/* Sídlo firmy červenou z loga (`--live` má hodnotu pro oba motivy),
   plně krycí, ať je mezi ostatními tečkami poznat na první pohled. */
.av-mapa-bod--domov { fill: var(--live); stroke: var(--live); fill-opacity: 1; }
.av-mapa-popis { margin-top: .4rem; font-size: .78rem; color: var(--muted); text-align: center; }
@media (max-width: 480px) { .av-stats .hp-stat { padding: .8rem .4rem; } }

/* Hledání (archiv i stránka Hledání): hlavička s dotazem a „Zrušit",
   závodníci seskupení podle jména se starty pod rozbalovačem. */
.hl-hlavicka { display: flex; align-items: baseline; justify-content: space-between; gap: .5rem 1rem;
  flex-wrap: wrap; margin: 0 0 1rem; padding: .6rem .9rem; border: 1px solid var(--border);
  border-radius: var(--radius-panel); background: var(--surface); }
.hl-dotaz { color: var(--text-2); }
.hl-dotaz strong { color: var(--text); }
.hl-zrusit { font-size: .8rem; text-transform: uppercase; letter-spacing: .07em; color: var(--text-2); text-decoration: none; }
.hl-zrusit:hover { color: var(--accent); }
.hl-zavodnici { margin-top: 1.5rem; }
.hl-zav-seznam { display: flex; flex-direction: column; gap: .4rem; }
.hl-zav { border: 1px solid var(--border); border-radius: var(--radius-panel); }
.hl-zav > summary { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem;
  padding: .55rem .85rem; cursor: pointer; list-style: none; }
.hl-zav > summary::-webkit-details-marker { display: none; }
.hl-zav > summary::after { content: "▾"; color: var(--muted); margin-left: .5rem; }
.hl-zav[open] > summary::after { content: "▴"; }
.hl-zav-jmeno { font-weight: 600; }
.hl-zav-pocet { margin-left: auto; font-size: .82rem; color: var(--muted); }
.hl-zav-starty { list-style: none; margin: 0; padding: 0 .85rem .6rem; display: flex; flex-direction: column; gap: .25rem; }
.hl-zav-starty li { display: grid; grid-template-columns: 3rem minmax(0, 1fr) auto 2.6rem; gap: .7rem; align-items: baseline;
  font-size: .88rem; border-top: 1px solid var(--line); padding-top: .25rem; }
.hl-zav-starty a { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hl-zav-kat { color: var(--muted); font-size: .8rem; white-space: nowrap; }
.hl-zav-poradi { text-align: right; }
.hl-zav-vic { display: block !important; color: var(--muted); font-size: .8rem; }
@media (max-width: 600px) {
  .hl-zav-starty li { grid-template-columns: 2.6rem minmax(0, 1fr) 2.2rem; }
  .hl-zav-kat { display: none; }
}

/* Odpočet do startu dalšího závodu na úvodu — vycentrovaný (hodiny
   DNÍ : HOD : MIN i varianta „N dní do startu"). */
.hp-panel--odpocet .hp-countdown { justify-content: center; }
.hp-panel--odpocet .hp-stats { display: flex; justify-content: center; }
.hp-panel--odpocet .hp-stat { align-items: center; text-align: center; }
/* Tlačítko je pružný řádek a mezeru mezi textem a šipkou zahodí — šipka
   by byla nalepená („Detail závodu→"). */
.hp-cta .sipka { margin-left: .4em; }

/* Rok pod datem v řádku závodu — jen na stránce let 1986–2003. */
.hp-race-rok { display: block; font-size: .72rem; color: var(--muted); }