/* ECC 2026 – česká reprezentace. Vizuálně navazuje na czechteamtrials.cz (stejný vzhled jako ostatní turnajové weby).
   Navy foundation, light surfaces, restrained blue accent.
   --focus / --focus-tint / --stripe-* are overridden at runtime from data/config.json (focus team). */

:root {
  --navy-950: #0b1830;
  --navy-900: #0f1f3a;
  --navy-800: #122443;
  --navy-700: #1c3461;
  --navy-600: #2a4679;
  --ink: #18263d;
  --ink-2: #3a4a63;
  --muted: #5d6c83;
  --line: #e0e6ee;
  --line-2: #cfd8e4;
  --bg: #f5f7fa;
  --surface: #ffffff;
  --surface-2: #f8fafc;
  --blue: #2856c6;
  --blue-600: #1f47a8;
  --blue-50: #edf2fc;
  --win: #16794a;
  --win-50: #e8f5ee;
  --loss: #b3261e;
  --gold: #c9a227;
  --silver: #9aa4b1;
  --bronze: #b07a45;
  --focus: #c98a00;
  --focus-tint: #fff6de;
  --radius: 8px;
  --radius-sm: 6px;
  --shadow: 0 1px 2px rgba(16, 32, 64, .05), 0 1px 1px rgba(16, 32, 64, .03);
  --shadow-2: 0 4px 16px rgba(16, 32, 64, .08);
  --font: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --wrap: 1200px;
  --gutter: 16px;
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.5;
  color: var(--ink);
  background: var(--bg);
  font-feature-settings: "tnum" 0;
  overflow-x: hidden;
}
/* jemný vzor kuželek a koulí stojí na místě a karty přes něj plují
   (pevná vrstva místo background-attachment: fixed, které iOS Safari ignoruje) */
body::before {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background: url("../img/bowling-bg.svg") 0 0 / 220px 220px repeat;
}
img, svg { max-width: 100%; }
h1, h2, h3, h4, h5 { margin: 0; line-height: 1.25; color: var(--ink); letter-spacing: -.01em; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; }
a { color: var(--blue); }
abbr[title] { text-decoration: none; }
button { font: inherit; }
[hidden] { display: none !important; }

.wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); }
@media (min-width: 900px) { :root { --gutter: 28px; } }

.sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.skip-link {
  position: absolute; left: 12px; top: -60px; z-index: 100;
  background: #fff; color: var(--navy-800); padding: 10px 14px; border-radius: var(--radius-sm);
  font-weight: 600; box-shadow: var(--shadow-2);
}
.skip-link:focus { top: 12px; }

:focus-visible { outline: 3px solid #5b8def; outline-offset: 2px; border-radius: 4px; }
h1:focus, h2:focus, main:focus { outline: none; }

.muted { color: var(--muted); }
.small { font-size: .875rem; }
.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.label { font-weight: 600; color: var(--ink-2); }

/* ------------------------------------------------ header & nav */
.site-header { background: var(--navy-800); color: #d9e1ef; position: sticky; top: 0; z-index: 50; box-shadow: 0 1px 0 rgba(0, 0, 0, .2); }
.site-header__inner { display: flex; align-items: center; gap: 16px; min-height: 60px; }
.brand { display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; min-width: 0; }
.brand__mark { width: 46px; height: 46px; flex: none; object-fit: contain; }
.brand__text { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; }
.brand__text strong { font-size: .9375rem; letter-spacing: .01em; }
.brand__text span { font-size: .75rem; color: #9fb0cb; }

.site-nav { margin-left: auto; }
.site-nav ul { list-style: none; display: flex; gap: 2px; }
.site-nav a {
  display: block; padding: 9px 12px; border-radius: var(--radius-sm); color: #d9e1ef; text-decoration: none;
  font-size: .9375rem; font-weight: 500; white-space: nowrap;
}
.site-nav a:hover { background: rgba(255, 255, 255, .07); color: #fff; }
.site-nav a[aria-current="page"] { background: var(--navy-700); color: #fff; box-shadow: inset 0 -2px 0 #7fa3ff; }

.nav-toggle {
  display: none; margin-left: auto; align-items: center; gap: 8px; background: transparent; color: #fff;
  border: 1px solid rgba(255, 255, 255, .25); border-radius: var(--radius-sm); padding: 8px 12px; min-height: 44px; cursor: pointer;
}
.nav-toggle__bars, .nav-toggle__bars::before, .nav-toggle__bars::after {
  display: block; width: 16px; height: 2px; background: currentColor; border-radius: 1px; position: relative; content: "";
}
.nav-toggle__bars::before { position: absolute; top: -5px; }
.nav-toggle__bars::after { position: absolute; top: 5px; }

@media (max-width: 859px) {
  .nav-toggle { display: inline-flex; }
  .site-nav { position: absolute; left: 0; right: 0; top: 100%; background: var(--navy-800); border-top: 1px solid rgba(255, 255, 255, .08); display: none; box-shadow: var(--shadow-2); }
  .nav-open .site-nav { display: block; }
  .site-nav ul { flex-direction: column; padding: 8px var(--gutter) 14px; gap: 2px; }
  .site-nav a { padding: 12px; font-size: 1rem; }
}

/* ------------------------------------------------ layout primitives */
main { display: block; min-height: 60vh; }
.view-body { padding-top: 24px; padding-bottom: 56px; }
.stack { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.grid { display: grid; gap: 16px; margin-bottom: 16px; }
.grid > * { min-width: 0; }
.grid--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); }
.grid--4 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
.grid--main { grid-template-columns: minmax(0, 1fr); }
.grid--cards { grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); align-items: start; }
@media (min-width: 960px) { .grid--main { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); align-items: start; } }

.page-head { margin-bottom: 20px; position: relative; }
.page-head h1 { font-size: clamp(1.625rem, 1.2rem + 1.6vw, 2.0625rem); font-weight: 700; }
.page-head .stripe { margin-bottom: 10px; }
.lead { color: var(--ink-2); margin-top: 6px; max-width: 72ch; }
.sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 28px 0 12px; flex-wrap: wrap; }
.sec-head h2 { font-size: 1.25rem; }
.more-link { font-size: .875rem; font-weight: 600; text-decoration: none; white-space: nowrap; }
.more-link:hover { text-decoration: underline; }
.note { color: var(--muted); font-size: .875rem; margin: 8px 0 16px; max-width: 80ch; }
.notice { background: var(--surface); border: 1px solid var(--line); border-left: 4px solid var(--blue); border-radius: var(--radius); padding: 14px 16px; margin: 16px 0; }
.notice--hist { border-left-color: #f2c14e; }
.notice--error { border-left-color: var(--loss); }
.app-loading { padding-top: 40px; padding-bottom: 40px; color: var(--muted); }

/* ------------------------------------------------ cards */
.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); min-width: 0; }
.card__head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 14px 16px 0; flex-wrap: wrap; }
.card__title, .card__head h2, .card__head h3, .card__head h4 { font-size: 1rem; font-weight: 700; }
.card__body { padding: 12px 16px 16px; }
a.card { color: inherit; text-decoration: none; display: block; transition: border-color .15s; }
a.card:hover { border-color: var(--line-2); box-shadow: var(--shadow-2); }

.block { margin-top: 28px; }
.block__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.block__head h3 { font-size: 1.0625rem; }

.details-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 0 16px; }
.details-card > summary { cursor: pointer; padding: 14px 0; list-style: none; display: flex; align-items: center; gap: 10px; }
.details-card > summary::-webkit-details-marker { display: none; }
.details-card > summary::before { content: ""; width: 8px; height: 8px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(-45deg); transition: transform .15s; flex: none; }
.details-card[open] > summary::before { transform: rotate(45deg); }
.details-card > summary h3, .details-card > summary h4 { font-size: 1rem; display: inline; }
.details-card[open] { padding-bottom: 16px; }

/* ------------------------------------------------ focus-team system */
.stripe { display: inline-flex; width: 36px; height: 6px; border-radius: 2px; overflow: hidden; vertical-align: middle; flex: none; }
.stripe i { flex: 1; }
/* jemný obrys, aby bílý pruh nesplýval se světlým podkladem (v tmavém hero není potřeba) */
.stripe { position: relative; }
.stripe::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(16, 32, 64, .2); pointer-events: none; }
.hero .stripe::after { content: none; }
.flag { filter: drop-shadow(0 0 .5px rgba(16, 32, 64, .55)); }
.chip.is-on .flag { filter: none; }

.fed {
  display: inline-flex; align-items: center; gap: 4px; font-size: .6875rem; font-weight: 700; letter-spacing: .04em;
  color: var(--ink-2); background: var(--surface-2); border: 1px solid var(--line); border-radius: 4px; padding: 1px 5px;
  line-height: 1.4; vertical-align: middle; white-space: nowrap;
}
.fed--focus { background: var(--focus-tint); border-color: var(--focus); color: var(--ink); }
.fed__flag { font-size: .8125rem; line-height: 1; }
.fed--bye { color: var(--muted); font-weight: 500; }

.focus-badge {
  display: inline-flex; align-items: center; gap: 4px; font-size: .75rem; font-weight: 700; letter-spacing: .02em;
  background: var(--focus-tint); color: var(--ink); border: 1px solid var(--focus); border-radius: 4px; padding: 2px 7px; white-space: nowrap;
}

.is-focus { position: relative; }
tr.is-focus > td { background: var(--focus-tint); }
tr.is-focus > td:first-child { box-shadow: inset 3px 0 0 var(--focus); }
li.is-focus { background: var(--focus-tint); box-shadow: inset 3px 0 0 var(--focus); }

.focus-card { border-top: 3px solid var(--focus); }
.focus-card__head { display: flex; flex-direction: column; gap: 8px; padding: 14px 16px 0; }
.focus-card__head h2, .focus-card__head h3 { font-size: 1rem; font-weight: 800; letter-spacing: .02em; }

/* ------------------------------------------------ hero */
.hero { background: linear-gradient(180deg, var(--navy-800) 0%, var(--navy-900) 100%); color: #e6ecf6; }
.hero__inner { display: flex; flex-wrap: wrap; gap: 20px 32px; align-items: flex-end; justify-content: space-between; padding-top: 26px; padding-bottom: 26px; }
.hero__main { min-width: 0; flex: 1 1 420px; }
.hero h1 { color: #fff; font-size: clamp(1.75rem, 1.2rem + 2.4vw, 2.75rem); font-weight: 800; letter-spacing: -.015em; }
.hero__meta { display: flex; flex-wrap: wrap; gap: 4px 18px; margin-top: 8px; font-size: 1.0625rem; font-weight: 600; color: #fff; }
.hero__venue { color: #a9b9d3; font-size: .875rem; margin-top: 4px; }
.hero__follow {
  flex: 0 1 300px; min-width: 0; display: flex; flex-direction: column; gap: 4px; background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .14); border-radius: var(--radius); padding: 14px 16px;
}
.hero__follow .stripe { width: 48px; margin-bottom: 4px; }
.hero__follow-label { font-size: .6875rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #9fb0cb; }
.hero__follow-team { font-size: 1.5rem; font-weight: 800; color: #fff; letter-spacing: .02em; }
.hero__follow-team > span { margin-right: .25em; }
.hero__state { font-size: .8125rem; color: #cbd5e6; }

/* ------------------------------------------------ quick access */
.quick { margin-bottom: 16px; }
.quick ul { list-style: none; display: grid; gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 640px) { .quick ul { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .quick ul { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.quick__item {
  display: flex; flex-direction: column; gap: 2px; position: relative; height: 100%; min-height: 64px;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 11px 32px 11px 14px;
  color: var(--ink); text-decoration: none; box-shadow: var(--shadow);
}
.quick__item:hover { border-color: var(--blue); }
.quick__item .i-ext { position: absolute; right: 12px; top: 13px; color: var(--muted); }
.quick__item--muted { background: var(--surface-2); }
.quick__title { font-weight: 700; font-size: .9375rem; }
.quick__meta { font-size: .8125rem; color: var(--muted); }

.i-ext { width: 12px; height: 12px; flex: none; margin-left: 4px; vertical-align: -1px; }

/* ------------------------------------------------ states */
.state { display: inline-block; font-size: .6875rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; padding: 2px 6px; border-radius: 4px; white-space: nowrap; }
.state--archived { background: #eef1f5; color: #4b5a70; border: 1px solid var(--line-2); }
.state--off { background: #f6eaea; color: #8c2a24; border: 1px solid #ecd0cd; }
.state--soon { background: var(--blue-50); color: var(--blue-600); border: 1px solid #cddbf6; }
.state--live { background: #e03a2f; color: #fff; }

/* ------------------------------------------------ status card */
.status-card .card__body { padding-top: 16px; }
.status-card__q { font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.status-card__a { font-size: 1.125rem; font-weight: 700; margin: 2px 0 10px; }
.status-row { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: var(--radius-sm); background: var(--surface-2); border: 1px solid var(--line); margin-top: 8px; }
.status-row--now { background: var(--focus-tint); border-color: var(--focus); }
.status-row__label { font-size: .75rem; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; }
.status-row__note { font-size: .875rem; color: var(--ink-2); }
.sess-line strong { font-weight: 700; }
.status-card__tz { font-size: .8125rem; color: var(--muted); margin-top: 10px; }

/* ------------------------------------------------ summary */
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 10px; margin: 0 0 12px; }
.kpis > div { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 10px 12px; min-width: 0; }
.kpis dt { font-size: .75rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.kpis dd { margin: 2px 0 0; font-weight: 700; font-size: 1rem; }
.kpis small { font-weight: 500; color: var(--muted); font-size: .8125rem; }
.medal-line { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }

.sum-list { list-style: none; border: 1px solid var(--line); border-radius: var(--radius-sm); overflow: hidden; }
.sum-list li + li { border-top: 1px solid var(--line); }
.sum-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; padding: 10px 12px; color: inherit; text-decoration: none; }
.sum-row:hover { background: var(--surface-2); }
.sum-row__event { font-weight: 700; }
.sum-row__finish { text-align: right; font-weight: 600; display: inline-flex; align-items: center; gap: 4px; justify-content: flex-end; flex-wrap: wrap; }
.sum-row__detail { grid-column: 1 / -1; font-size: .875rem; color: var(--ink-2); }

/* medaile: kotouč na stuze v barvách sledované země, bez čísla */
.medal { display: inline-block; width: 18px; height: 26px; flex: none; vertical-align: middle; line-height: 0; }
.medal svg { display: block; width: 100%; height: 100%; overflow: visible; }
.medal__rib1 { fill: var(--stripe-3, #11457e); }
.medal__rib2 { fill: var(--stripe-2, #d7141a); }
.medal__disc { fill: var(--m-base); stroke: var(--m-lo); stroke-width: 1; }
.medal__ring { fill: none; stroke: rgba(255, 255, 255, .55); stroke-width: 1; }
.medal--gold { --m-base: #d9b13b; --m-lo: #9c7a12; }
.medal--silver { --m-base: #bfc7d1; --m-lo: #7f8a98; }
.medal--bronze { --m-base: #c4834a; --m-lo: #86522a; }
.medal-run { display: inline-flex; flex-wrap: wrap; gap: 3px; }
.card__body > .kpis:last-child { margin-bottom: 0; }

/* highlights */
.hl-list { list-style: none; display: flex; flex-direction: column; gap: 8px; }
.hl { display: flex; gap: 10px; align-items: flex-start; padding: 8px 10px; border-radius: var(--radius-sm); background: var(--surface-2); border: 1px solid var(--line); font-size: .9375rem; }
.hl--medal { background: var(--focus-tint); border-color: var(--focus); }
.hl .medal { margin-top: 1px; }
.hl__pos { flex: none; min-width: 40px; text-align: center; font-weight: 800; font-size: .8125rem; background: #fff; border: 1px solid var(--line-2); border-radius: 4px; padding: 1px 4px; font-variant-numeric: tabular-nums; }

/* medalists overview */
.mini-event { padding: 14px 16px; display: flex !important; flex-direction: column; gap: 10px; }
.mini-event h3 { font-size: 1rem; }
.mini-event__focus { margin-top: auto; font-size: .875rem; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; border-top: 1px solid var(--line); padding-top: 10px; }
.podium-list { list-style: none; display: flex; flex-direction: column; gap: 4px; }
.podium-list li { display: flex; align-items: center; gap: 8px; padding: 4px 6px; border-radius: 4px; min-width: 0; }
.pl-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; font-size: .9375rem; }
.podium-list--lg li { padding: 8px 10px; border: 1px solid var(--line); background: var(--surface-2); }
.podium-list--lg li.is-focus { background: var(--focus-tint); border-color: var(--focus); }

/* ------------------------------------------------ matches */
.match { border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); overflow: hidden; }
.match + .match { margin-top: 8px; }
.match.has-focus { border-color: var(--focus); box-shadow: 0 0 0 1px var(--focus) inset; }
.m-label { font-size: .75rem; font-weight: 700; color: var(--muted); padding: 6px 10px 0; text-transform: uppercase; letter-spacing: .04em; }
.m-side { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; grid-template-areas: "name fed score" "games games games"; align-items: center; gap: 2px 8px; padding: 7px 10px; }
.m-side + .m-side { border-top: 1px solid var(--line); }
.m-name { grid-area: name; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .9375rem; color: var(--ink-2); }
.m-side .fed { grid-area: fed; }
.m-score { grid-area: score; font-weight: 800; min-width: 22px; text-align: center; font-variant-numeric: tabular-nums; border-radius: 4px; padding: 0 4px; color: var(--muted); }
.m-games { grid-area: games; display: flex; flex-wrap: wrap; gap: 3px; }
.g { font-size: .75rem; font-variant-numeric: tabular-nums; color: var(--muted); padding: 0 4px; border-radius: 3px; background: var(--surface-2); border: 1px solid transparent; }
.g--w { color: var(--ink); font-weight: 700; border-color: var(--line-2); background: #fff; }
.g--ro { font-style: italic; }
.m-side.is-win .m-name { color: var(--ink); font-weight: 700; }
.m-side.is-win .m-score { background: var(--navy-800); color: #fff; }
.m-side.is-focus { background: var(--focus-tint); box-shadow: inset 3px 0 0 var(--focus); }
.m-note { font-size: .75rem; color: var(--muted); padding: 4px 10px 6px; border-top: 1px dashed var(--line); }

/* bracket: columns on wide screens (locally scrollable), stacked rounds on phones */
.bracket-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: var(--radius); }
.bracket { display: grid; gap: 14px; grid-template-columns: repeat(var(--rounds), minmax(200px, 1fr)); min-width: min-content; padding-bottom: 6px; }
.round { min-width: 0; display: flex; flex-direction: column; }
.round__title { font-size: .8125rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-2); padding: 0 2px 8px; display: flex; flex-direction: column; gap: 1px; }
.round__when { font-weight: 500; font-size: .75rem; color: var(--muted); letter-spacing: 0; text-transform: none; }
.round__matches { display: flex; flex-direction: column; justify-content: space-around; flex: 1; gap: 8px; }
.round__matches .match + .match { margin-top: 0; }
@media (max-width: 719px) {
  .bracket-scroll { overflow: visible; }
  /* phones: latest round first; match cards are not focusable, so reading order stays sensible */
  .bracket { display: flex; flex-direction: column-reverse; min-width: 0; gap: 22px; }
}

/* knockout path (player cards) */
.path { list-style: none; display: flex; flex-direction: column; gap: 6px; }
.path li { padding: 7px 10px 8px; border-radius: var(--radius-sm); background: var(--surface-2); border: 1px solid var(--line); }
.path li.is-win { border-left: 3px solid var(--win); }
.path li.is-loss { border-left: 3px solid var(--line-2); }
.path__top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.path__round { font-size: .6875rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.path__score { font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; display: inline-flex; align-items: center; }
.path__res { font-size: .9375rem; margin-top: 2px; }
.path__games { font-size: .8125rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.nw, .tbl--rr td:nth-child(2) { white-space: nowrap; }

.cpath { list-style: none; display: flex; flex-direction: column; gap: 4px; margin-top: 4px; }
.cpath li { display: flex; align-items: baseline; gap: 6px; font-size: .875rem; padding: 3px 0 3px 10px; border-left: 3px solid var(--line-2); }
.cpath li.is-win { border-left-color: var(--win); }
.cpath__r { flex: none; width: 108px; white-space: nowrap; font-size: .6875rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.cpath__o { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink-2); }
.cpath strong { font-variant-numeric: tabular-nums; }

/* ------------------------------------------------ tables */
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.tbl { width: 100%; border-collapse: collapse; font-size: .9375rem; }
.tbl th { text-align: left; font-size: .75rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); padding: 8px 10px; border-bottom: 1px solid var(--line-2); white-space: nowrap; }
.tbl th.num { text-align: right; }
.tbl td { padding: 8px 10px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.tbl tbody tr:last-child td { border-bottom: 0; }
.tbl tr.cut td { border-bottom: 2px dashed var(--line-2); }
.tbl tr.gap td { text-align: center; color: var(--muted); padding: 2px; }
.tbl--class .pos { width: 1%; }
.tbl--class .pos .medal { margin-right: 6px; vertical-align: middle; }
.name-cell .nm { font-weight: 600; }
.tbl--rr tr.is-win td:first-child { box-shadow: inset 3px 0 0 var(--win); }
.wl { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 4px; font-size: .6875rem; font-weight: 800; margin-right: 4px; }
.wl--w { background: var(--win-50); color: var(--win); }
.wl--l { background: #f3f4f6; color: var(--muted); }
.card .table-scroll { margin: 8px -16px -16px; }
.card .table-scroll .tbl td:first-child, .card .table-scroll .tbl th:first-child { padding-left: 16px; }
.card .table-scroll .tbl td:last-child, .card .table-scroll .tbl th:last-child { padding-right: 16px; }
.block > .table-scroll { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
@media (max-width: 719px) { .hide-sm { display: none; } }
@media (max-width: 400px) { .hide-xs { display: none; } .tbl td, .tbl th { padding: 8px 6px; } }

/* ------------------------------------------------ chips, switch, subnav */
.chip {
  display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 6px 12px; border-radius: var(--radius-sm);
  border: 1px solid var(--line-2); background: var(--surface); color: var(--ink); font-size: .875rem; font-weight: 600; cursor: pointer;
}
.chip:hover { border-color: var(--blue); }
.chip.is-on { background: var(--navy-800); border-color: var(--navy-800); color: #fff; }
.filter { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.toolbar { display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap; margin-bottom: 6px; }
.link { color: var(--blue); font-weight: 600; text-decoration: none; }
.link:hover { text-decoration: underline; }

.switch { display: inline-flex; align-items: center; gap: 8px; font-size: .875rem; font-weight: 600; cursor: pointer; min-height: 36px; }
.switch input { width: 18px; height: 18px; accent-color: var(--navy-800); margin: 0; }

.subnav { margin-bottom: 20px; border-bottom: 1px solid var(--line-2); overflow-x: auto; -webkit-overflow-scrolling: touch; }
.subnav ul { list-style: none; display: flex; gap: 2px; min-width: max-content; }
.subnav a {
  display: inline-flex; align-items: center; gap: 6px; padding: 10px 14px; color: var(--ink-2); text-decoration: none; font-weight: 600;
  font-size: .9375rem; border-bottom: 3px solid transparent; margin-bottom: -1px; white-space: nowrap;
}
.subnav a:hover { color: var(--ink); }
.subnav a[aria-current="page"] { color: var(--navy-800); border-bottom-color: var(--navy-800); }
.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--focus); display: inline-block; }

.event-head { margin-bottom: 16px; }
.event-head h2 { font-size: 1.375rem; margin-bottom: 4px; }
.event-head p { font-size: .9375rem; }

.focus-list { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.focus-list__top { display: flex; justify-content: space-between; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 6px; }
.focus-list__top > span { display: inline-flex; align-items: center; gap: 4px; font-weight: 600; }

/* ------------------------------------------------ schedule */
.days { display: flex; flex-direction: column; gap: 14px; margin-top: 8px; }
.day { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.day--focus { border-color: var(--line-2); }
.day--today { border-color: var(--blue); box-shadow: 0 0 0 2px var(--blue-50); }
.day__head { display: flex; align-items: center; gap: 8px 12px; flex-wrap: wrap; padding: 12px 16px; background: var(--surface-2); border-bottom: 1px solid var(--line); }
.day__head h2 { font-size: 1rem; }
.day__dow { color: var(--ink-2); font-weight: 600; }
.day__label { color: var(--muted); font-size: .875rem; flex: 1; min-width: 0; }
.sessions { list-style: none; }
.sess { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 12px; padding: 12px 16px; border-top: 1px solid var(--line); }
.sess:first-child { border-top: 0; }
.sess__time { font-variant-numeric: tabular-nums; font-weight: 700; display: flex; flex-direction: column; line-height: 1.3; }
.sess__end { font-weight: 500; color: var(--muted); font-size: .875rem; }
.sess__title { font-weight: 600; }
.sess__meta { display: flex; gap: 4px 10px; flex-wrap: wrap; align-items: center; font-size: .8125rem; margin-top: 3px; }
.kind { font-size: .6875rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 2px 6px; border-radius: 4px; background: var(--blue-50); color: var(--blue-600); }
.kind--singles-women, .kind--team-women { background: #f3edfb; color: #5b3a9a; }
.kind--singles-both, .kind--team-both { background: #eef1f5; color: #3a4a63; }
.kind--practice, .kind--ceremony { background: #f1f3f5; color: var(--muted); }
.sess--focus { background: var(--focus-tint); box-shadow: inset 4px 0 0 var(--focus); }
.sess--possible { background: repeating-linear-gradient(135deg, #fffdf6, #fffdf6 8px, var(--focus-tint) 8px, var(--focus-tint) 16px); box-shadow: inset 4px 0 0 transparent; border-left: 4px dashed var(--focus); padding-left: 12px; }
.sess__focus { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; margin-top: 8px; font-size: .875rem; }
.sess__athletes { font-weight: 700; }
.sess__note { color: var(--ink-2); flex-basis: 100%; }
@media (max-width: 420px) { .sess { grid-template-columns: 58px minmax(0, 1fr); gap: 10px; padding: 12px; } }

/* ------------------------------------------------ team page */
.team-group { margin-top: 32px; }
.group-title { font-size: 1.25rem; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.count { font-size: .75rem; font-weight: 700; color: var(--muted); background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 1px 8px; }
.player-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 14px 16px 16px; min-width: 0; border-top: 3px solid var(--focus); }
.player-card--medal { box-shadow: 0 0 0 1px var(--focus), var(--shadow-2); }
.team-event-card { border-top-color: var(--navy-700); }
.grid--cards > .team-event-card { grid-column: 1 / -1; }
.te-grid { display: grid; gap: 4px 24px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .te-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); } }
.te-grid .pc-q { margin-top: 4px; }
.pc-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.pc-name { font-size: 1.125rem; font-weight: 800; min-width: 0; }
.pc-sub { display: flex; justify-content: space-between; align-items: center; gap: 6px 10px; flex-wrap: wrap; margin: 4px 0 10px; font-size: .875rem; }
.pc-place { display: inline-flex; align-items: center; gap: 5px; font-weight: 700; font-size: .875rem; background: var(--surface-2); border: 1px solid var(--line); border-radius: 4px; padding: 2px 8px; }
.pc-place--gold, .pc-place--silver, .pc-place--bronze { background: var(--focus-tint); border-color: var(--focus); }
.pc-block { margin-top: 12px; }
.pc-block h4 { font-size: .75rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin-bottom: 6px; }
.pc-q { font-size: .9375rem; }
.games { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(40px, 1fr)); gap: 4px; margin-top: 8px; }
.games li { text-align: center; font-size: .8125rem; font-variant-numeric: tabular-nums; padding: 3px 0; border-radius: 4px; background: var(--surface-2); border: 1px solid var(--line); color: var(--muted); }
.games li.is-win { background: var(--win-50); border-color: #bfe0cd; color: var(--win); font-weight: 700; }
.staff-list { list-style: none; display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.staff-list li { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px 16px; display: flex; flex-direction: column; }

/* ------------------------------------------------ live & destinations */
.dest { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; display: flex; flex-direction: column; gap: 6px; box-shadow: var(--shadow); min-width: 0; }
.dest--big { padding: 20px; }
.dest__head { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.dest__title { font-size: 1.125rem; font-weight: 800; letter-spacing: .04em; }
.dest__provider { font-weight: 600; color: var(--ink-2); }
.dest__label, .dest__note { font-size: .875rem; color: var(--muted); }
.dest__action { margin-top: auto; padding-top: 10px; }
.dest--live { border-color: #e03a2f; }
.dest--coming-soon, .dest--unavailable { background: var(--surface-2); }

.btn { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 10px 16px; border-radius: var(--radius-sm); font-weight: 700; font-size: .9375rem; text-decoration: none; border: 1px solid transparent; }
.btn--primary { background: var(--navy-800); color: #fff; }
.btn--primary:hover { background: var(--navy-700); }
.btn--ghost { background: #fff; color: var(--ink); border-color: var(--line-2); }
.btn--ghost:hover { border-color: var(--blue); color: var(--blue); }
.btn--disabled { background: #eceff3; color: #6b778a; cursor: not-allowed; user-select: none; }
.preview { margin-top: 20px; }
.preview .grid { margin-top: 4px; }

/* ------------------------------------------------ documents & pattern */
.docs-layout { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); align-items: start; }
.docs-main, .docs-side { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
@media (min-width: 960px) { .docs-layout { grid-template-columns: minmax(0, 1fr) 360px; } .docs-side { position: sticky; top: 76px; } }
.doc-list { list-style: none; display: flex; flex-direction: column; }
.doc-list li { padding: 9px 0; border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 2px; }
.doc-list li:first-child { border-top: 0; }
.doc-list--compact li { padding: 7px 0; }
.doc-group .doc-list { padding: 4px 16px 8px; }
.doc-link { color: var(--ink); font-weight: 600; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.doc-link:hover { color: var(--blue); }
.doc-link:hover .doc-title { text-decoration: underline; }
.doc-note { font-size: .8125rem; color: var(--muted); }
.type-badge { font-size: .625rem; font-weight: 800; letter-spacing: .06em; padding: 2px 5px; border-radius: 3px; background: #eef1f5; color: #4b5a70; border: 1px solid var(--line-2); }

.pattern-name { font-weight: 700; margin-bottom: 8px; }
.lane-viz { position: relative; height: 22px; border-radius: 4px; background: repeating-linear-gradient(90deg, #f0e3c8 0 10px, #ecdcbc 10px 11px); border: 1px solid #e0cfa8; overflow: hidden; margin-bottom: 12px; }
.lane-viz__oil { position: absolute; left: 0; top: 0; bottom: 0; background: linear-gradient(90deg, rgba(40, 86, 198, .45), rgba(40, 86, 198, .18)); border-right: 2px solid var(--blue); }
.lane-viz__label { position: absolute; right: 8px; top: 2px; font-size: .75rem; font-weight: 700; color: var(--ink-2); }
.pattern-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 8px; margin: 0 0 12px; }
.pattern-grid div { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 8px 10px; }
.pattern-grid dt { font-size: .6875rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.pattern-grid dd { margin: 2px 0 0; font-weight: 800; font-variant-numeric: tabular-nums; }
.pattern-links { font-size: .9375rem; }
.pattern-alt { font-size: .8125rem; color: var(--muted); margin-top: 8px; }

.notes { margin-top: 28px; font-size: .875rem; color: var(--ink-2); }
.notes summary { cursor: pointer; font-weight: 700; color: var(--ink); padding: 6px 0; }
.notes ul { padding-left: 20px; display: flex; flex-direction: column; gap: 6px; max-width: 90ch; }

/* ------------------------------------------------ footer */
.site-footer { background: var(--navy-800); color: #aebbd2; font-size: .875rem; }
.site-footer__inner { padding-top: 22px; padding-bottom: 26px; display: flex; flex-direction: column; gap: 6px; }
.site-footer a { color: #fff; }
.site-footer__links .i-ext { color: #aebbd2; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

@media print {
  .site-header, .quick, .toolbar, .subnav, .switch { display: none !important; }
  body { background: #fff; }
}

/* results event tabs become a 2×2 grid on phones so no event is hidden off-screen */
@media (max-width: 639px) {
  .subnav { border-bottom: 0; overflow: visible; }
  .subnav ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; min-width: 0; }
  .subnav a { display: flex; justify-content: center; border: 1px solid var(--line-2); border-radius: var(--radius-sm); background: var(--surface); margin: 0; padding: 10px 8px; white-space: normal; text-align: center; min-height: 44px; }
  .subnav a[aria-current="page"] { background: var(--navy-800); color: #fff; border-color: var(--navy-800); }
}

/* compact hero on phones so the key answers stay near the top */
@media (max-width: 599px) {
  .hero__inner { padding-top: 18px; padding-bottom: 18px; gap: 14px; }
  .hero__meta { font-size: 1rem; gap: 2px 14px; }
  .hero__follow { flex: 1 1 100%; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 4px 10px; padding: 10px 12px; }
  .hero__follow .stripe { width: 28px; margin: 0; }
  .hero__follow-team { font-size: 1.125rem; }
  .hero__state { flex-basis: 100%; }
}

/* ------------------------------------------------ živá data a české starty */
.update-line { display: flex; align-items: center; gap: 8px; font-size: .8125rem; color: var(--muted); margin: 0 0 12px; }
.pulse { width: 8px; height: 8px; border-radius: 50%; background: #1f9d55; box-shadow: 0 0 0 0 rgba(31, 157, 85, .5); animation: pulse 2s infinite; flex: none; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(31, 157, 85, .45); } 70% { box-shadow: 0 0 0 8px rgba(31, 157, 85, 0); } 100% { box-shadow: 0 0 0 0 rgba(31, 157, 85, 0); } }
.page-head .update-line { margin-top: 10px; }

.legend { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: .8125rem; color: var(--ink-2); margin: 0 0 12px; }
.legend__i { display: inline-flex; align-items: center; gap: 6px; }
.legend__i::before { content: ""; width: 14px; height: 14px; border-radius: 3px; flex: none; }
.legend__i--focus::before { background: var(--focus-tint); box-shadow: inset 3px 0 0 var(--focus); border: 1px solid var(--line-2); }
.legend__i--possible::before { background: repeating-linear-gradient(135deg, #fff, #fff 3px, var(--focus-tint) 3px, var(--focus-tint) 6px); border: 1px dashed var(--focus); }

.next-list, .standing-list { list-style: none; display: flex; flex-direction: column; gap: 8px; }
.next-list li { display: flex; flex-direction: column; gap: 1px; padding: 8px 10px; border-radius: var(--radius-sm); background: var(--focus-tint); box-shadow: inset 3px 0 0 var(--focus); }
.next-list li.is-possible { background: var(--surface-2); box-shadow: inset 3px 0 0 var(--line-2); }
.next-list__when { font-size: .75rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-2); }
.next-list__what { font-weight: 600; }
.next-list__who { font-size: .875rem; }
.standing-list li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 12px; padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-2); font-size: .9375rem; }
.lr { font-weight: 700; white-space: nowrap; }

.roster-mini { display: grid; gap: 10px; margin: 0; }
.roster-mini dt { font-size: .75rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.roster-mini dd { margin: 2px 0 0; font-weight: 600; }

.pools { display: flex; flex-direction: column; gap: 8px; }
.pool > summary { flex-wrap: wrap; }
.pool > summary h4 { margin-right: auto; }
.pool .table-scroll { margin: 0 -16px; }
.pool .tbl td:first-child, .pool .tbl th:first-child { padding-left: 16px; }
.pool .tbl td:last-child, .pool .tbl th:last-child { padding-right: 16px; }

.match.is-live { border-style: dashed; }
.path li.is-live, .cpath li.is-live { border-left-color: #1f9d55; }
.wl--o { background: #e6f5ec; color: #1f7a45; }
.ok { color: var(--win); font-weight: 700; }
.pc-empty { margin-top: 8px; }
.games--rr { grid-template-columns: repeat(auto-fill, minmax(30px, 1fr)); }

/* ------------------------------------------------ ECC: doplňky ve stejném stylu */
/* barvy proužku sledované země (bez inline stylů kvůli CSP) */
.stripe i:nth-child(1) { background: var(--stripe-1, #fff); }
.stripe i:nth-child(2) { background: var(--stripe-2, #d7141a); }
.stripe i:nth-child(3) { background: var(--stripe-3, #11457e); }

/* stavové štítky postupu (stejný tvar jako .state) */
.st { display: inline-block; font-size: .6875rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; padding: 2px 6px; border-radius: 4px; white-space: nowrap; vertical-align: middle; }
.st--none { background: #eef1f5; color: #4b5a70; border: 1px solid var(--line-2); }
.st--up { background: var(--win-50); color: var(--win); border: 1px solid #bfe0cd; }
.st--line { background: var(--blue-50); color: var(--blue-600); border: 1px solid #cddbf6; }
.st--down { background: #fff4dc; color: #8a5a00; border: 1px solid #f0d9a4; }
.st--out { background: #f6eaea; color: #8c2a24; border: 1px solid #ecd0cd; }
.st--live { background: #e03a2f; color: #fff; }
.st--gold { background: var(--focus-tint); color: var(--ink); border: 1px solid var(--focus); }
.sum-row__detail .st, .focus-list__top .st, .name-cell .st { margin-left: 2px; }

/* čas v Česku u českých startů, poznámka k automatickým výsledkům */
/* časy ve tvaru „14:00 (🇨🇿13:00)“: sloupec času se přizpůsobí, na telefonu je čas nad popisem */
.sess { grid-template-columns: max-content minmax(0, 1fr); }
.sess__time { white-space: nowrap; }
@media (max-width: 520px) {
  .sess { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .sess__time { flex-direction: row; flex-wrap: wrap; gap: 0 6px; }
  .sess__end::before { content: "– "; }
}
.status-row__rel { font-weight: 600; color: var(--ink-2); text-transform: none; letter-spacing: 0; }
.derived-note { flex-basis: 100%; }
.update-line { flex-wrap: wrap; }

/* program: podmíněný start (jen při postupu), úprava drah, probíhá / skončilo */
.sess--conditional { background: var(--surface-2); border-left: 4px dashed var(--line-2); padding-left: 12px; }
.legend__i--conditional::before { background: var(--surface-2); border: 1px dashed var(--muted); }
.sess--maintenance { padding-top: 6px; padding-bottom: 6px; }
.sess--maintenance .sess__title, .sess--maintenance .sess__time { font-weight: 500; font-size: .875rem; color: var(--muted); }
.sess--done { opacity: .75; }
.sess__links { margin-top: 4px; font-size: .875rem; }
.kind--women { background: #f3edfb; color: #5b3a9a; }
.kind--mixed, .kind--finals { background: #eef1f5; color: #3a4a63; }
.kind--admin, .kind--meeting, .kind--maintenance { background: #f1f3f5; color: var(--muted); }
.state--done { background: #f1f3f5; color: var(--muted); }

/* výsledky bloků hráče, dvojice, mazací model s tolerancí */
.games--blocks { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.games--blocks li { display: flex; flex-direction: column; padding: 4px 0; }
.games--blocks small { font-size: .6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
.games--blocks strong { color: var(--ink); }
.pair-names { display: block; font-size: .8125rem; color: var(--ink-2); }
.lane-viz { --oil: 73%; --tol: 0%; }
.lane-viz__oil { width: var(--oil); }
.lane-viz__tol { position: absolute; top: 0; bottom: 0; left: calc(var(--oil) - var(--tol)); width: calc(var(--tol) * 2); background: repeating-linear-gradient(135deg, rgba(40, 86, 198, .2) 0 3px, transparent 3px 6px); }
.pattern-status { font-weight: 600; margin-bottom: 4px; }
.format-list { padding-left: 20px; display: flex; flex-direction: column; gap: 6px; font-size: .9375rem; margin-top: 8px; }
.quick__meta .state { white-space: normal; }