@charset "UTF-8";

/* ------------------------------------------------------------------ písma
   IBM Plex leží přímo na webu (assets/fonty, licence OFL) – žádný požadavek
   na Google Fonts, který by blokoval vykreslení a posílal IP návštěvníků
   Googlu. Každý řez má dvě části: základní latinku a rozšířenou s háčky
   a čárkami; prohlížeč si stáhne jen tu, kterou na stránce opravdu potřebuje. */
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url(fonty/ibm-plex-sans-latin-400-normal.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: 400; font-display: swap; src: url(fonty/ibm-plex-sans-latin-ext-400-normal.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(fonty/ibm-plex-sans-latin-500-normal.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(fonty/ibm-plex-sans-latin-ext-500-normal.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(fonty/ibm-plex-sans-latin-600-normal.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(fonty/ibm-plex-sans-latin-ext-600-normal.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 Condensed'; font-style: normal; font-weight: 600; font-display: swap; src: url(fonty/ibm-plex-sans-condensed-latin-600-normal.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 Condensed'; font-style: normal; font-weight: 600; font-display: swap; src: url(fonty/ibm-plex-sans-condensed-latin-ext-600-normal.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 Condensed'; font-style: normal; font-weight: 700; font-display: swap; src: url(fonty/ibm-plex-sans-condensed-latin-700-normal.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 Condensed'; font-style: normal; font-weight: 700; font-display: swap; src: url(fonty/ibm-plex-sans-condensed-latin-ext-700-normal.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(fonty/ibm-plex-mono-latin-400-normal.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(fonty/ibm-plex-mono-latin-ext-400-normal.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(fonty/ibm-plex-mono-latin-500-normal.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(fonty/ibm-plex-mono-latin-ext-500-normal.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: 600; font-display: swap; src: url(fonty/ibm-plex-mono-latin-600-normal.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: 600; font-display: swap; src: url(fonty/ibm-plex-mono-latin-ext-600-normal.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; }

/* =========================================================================
   Zápasový zpravodaj JMOP – vzhled
   Barvy: tráva a inkoust na světlém papíře, okrová jen pro „dnes“.
   Písma: IBM Plex Sans Condensed (titulky), IBM Plex Sans (text),
          IBM Plex Mono (časy, čísla utkání, skóre).
   ========================================================================= */

:root {
  --papir:        #eceef2;
  --papir-2:      #f6f7fa;
  --karta:        #fbfcfe;
  --inkoust:      #14161f;
  --inkoust-2:    #565b66;
  --travnik:      #16588f;   /* modrá z loga – hlavní barva webu */
  --travnik-tmavy:#242454;   /* tmavá modř z loga – záhlaví */
  --okr:          #b8830f;
  --okr-svetly:   #f3e4bd;
  --lajna:        rgba(20, 22, 31, .13);
  --lajna-silna:  rgba(20, 22, 31, .30);
  --barva:        var(--inkoust-2);

  --titulky: "IBM Plex Sans Condensed", "Arial Narrow", system-ui, sans-serif;
  --text:    "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --data:    "IBM Plex Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;

  --sirka: 68rem;
  --vyska-filtru: 0px;
}

* { box-sizing: border-box; }

/* ---------------------------------------------------------------- archiv
   Odehrané ročníky mají teplou paletu, aby na první pohled bylo poznat, že
   nejde o probíhající sezónu. Mění se jen odstíny, rozvržení zůstává stejné.
   Barvy kategorií se nepřebarvují – ty musí zůstat stejné napříč ročníky. */

body.archiv {
  --papir:        #f1ede4;
  --papir-2:      #faf7f0;
  --karta:        #fdfbf6;
  --inkoust:      #211a12;
  --inkoust-2:    #61564a;
  --travnik:      #a95419;   /* pálená oranžová v roli hlavní barvy */
  --travnik-tmavy:#6b3310;
  --okr:          #2c6b47;   /* zvýraznění naopak zezelená, ať je vidět */
  --okr-svetly:   #dcebdf;
  --lajna:        rgba(33, 26, 18, .13);
  --lajna-silna:  rgba(33, 26, 18, .30);
}

/* Odvozené barvy. Definují se na body, aby se přepočítaly i z archivní
   palety; tmavý režim je přepíše vlastními. */
body {
  --odkaz:         var(--travnik-tmavy);   /* odkazy a tmavě modré popisky */
  --plocha:        var(--travnik-tmavy);   /* podklad plných tlačítek a vybraných voleb */
  --na-plose:      var(--papir-2);         /* text na takovém podkladu */
  --hlavicka:      var(--travnik-tmavy);   /* záhlaví stránky */
  --hlavicka-text: var(--papir-2);
  --liga-podklad:  #eef1f6;
  --chyba:         #a8402c;
}

.odznak-archiv {
  display: inline-block;
  margin-inline-start: .6em;
  padding: .12em .5em .16em;
  border: 1px solid rgba(250, 247, 240, .45);
  font: 600 .62rem/1.25 var(--text);
  letter-spacing: .14em;
  text-transform: uppercase;
  vertical-align: .12em;
}

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

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

body {
  margin: 0;
  background: var(--papir);
  color: var(--inkoust);
  font: 400 clamp(.95rem, .35vw + .88rem, 1.02rem)/1.5 var(--text);
  font-feature-settings: "tnum" 0;
}

.obal { width: min(100% - 2.4rem, var(--sirka)); margin-inline: auto; }

.jen-pro-ctecky {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap;
}

a { color: var(--odkaz); }

:focus-visible {
  outline: 2px solid var(--travnik);
  outline-offset: 2px;
  border-radius: 2px;
}

/* ---------------------------------------------------------------- hlavička */

/* Záhlaví: logo vlevo, název vedle něj. Na úzkém displeji jde logo nad text. */
.hlavicka__obal {
  display: flex;
  align-items: center;
  gap: 1.2rem;
}

.hlavicka__logo {
  flex: none;
  width: auto;
  height: 7.5rem;
}

.hlavicka__text { min-width: 0; }

/* Vedle názvu smí logo stát až od šířky, kde se obojí opravdu vejde; níž jde
   nad něj, jinak by nadpis přetekl mimo obrazovku. */
@media (max-width: 62rem) {
  .hlavicka__obal {
    display: block;
  }
  .hlavicka__logo {
    height: 3.6rem;
    margin-bottom: .5rem;
  }
}

.hlavicka {
  background: var(--hlavicka);
  color: var(--hlavicka-text);
  padding: clamp(1.4rem, 4vw, 2.6rem) 0 clamp(1.2rem, 3vw, 2rem);
  /* jemné vodorovné lajny jako na hřišti */
  background-image: repeating-linear-gradient(
    to bottom, rgba(255,255,255,.045) 0 1px, transparent 1px 7px);
}

.nadtitulek {
  margin: 0 0 .5rem;
  font: 600 .74rem/1.3 var(--text);
  letter-spacing: .13em;
  text-transform: uppercase;
  color: rgba(247, 248, 242, .62);
}

.znacka {
  margin: .12em 0 0;
  font-family: var(--titulky);
  font-weight: 700;
  /* Vedle loga zbývá na nadpis méně místa, proto o něco menší krok než dřív. */
  font-size: clamp(2rem, 9vw, 6rem);
  line-height: .88;
  letter-spacing: -.025em;
  text-transform: uppercase;
}

.znacka__slovo { display: inline-block; }

.znacka__slovo--obrys {
  color: transparent;
  -webkit-text-stroke: 1.4px rgba(247, 248, 242, .8);
}

@supports not (-webkit-text-stroke: 1px #000) {
  .znacka__slovo--obrys { color: rgba(247, 248, 242, .55); }
}

.sezona {
  margin: .95rem 0 0;
  font: 500 .95rem/1 var(--data);
  letter-spacing: .06em;
  color: rgba(247, 248, 242, .78);
}
.sezona span { color: var(--hlavicka-text); }
.sezona__lomeno { color: rgba(247, 248, 242, .45); padding-inline: .1em; }

/* přepínač ročníků */
.rocniky { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .9rem; }

.rocnik {
  display: inline-flex;
  align-items: baseline;
  gap: .4em;
  padding: .28rem .6rem .3rem;
  border: 1px solid rgba(247, 248, 242, .3);
  color: rgba(247, 248, 242, .8);
  text-decoration: none;
  font: 500 .84rem/1.2 var(--data);
  letter-spacing: .02em;
}
.rocnik:not(.rocnik--vybrany):hover { border-color: var(--hlavicka-text); color: var(--hlavicka-text); }

.rocnik--vybrany {
  background: var(--hlavicka-text);
  border-color: var(--hlavicka-text);
  color: var(--hlavicka);
  font-weight: 600;
}

.blok .rocnik__stav {
  margin-inline-start: .45em;
  font: 500 .62rem/1 var(--text);
  letter-spacing: .1em;
  text-transform: uppercase;
  opacity: .7;
}

.rocnik__stav {
  font: 500 .64rem/1 var(--text);
  letter-spacing: .1em;
  text-transform: uppercase;
  opacity: .65;
}

/* ------------------------------------------------------- nejbližší hrací den */

.dalsi {
  margin: clamp(1.4rem, 4vw, 2.6rem) 0 clamp(1rem, 2.5vw, 1.6rem);
  padding-bottom: clamp(1rem, 2.5vw, 1.5rem);
  border-bottom: 1px solid var(--lajna);
}

.dalsi__stitek {
  margin: 0 0 .35rem;
  font: 600 .72rem/1 var(--text);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--travnik);
}

.dalsi__den {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0 .5em;
  font-family: var(--titulky);
  font-weight: 700;
  line-height: .95;
  letter-spacing: -.02em;
}

.dalsi__dow {
  font-size: clamp(1.1rem, 3.4vw, 1.7rem);
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--travnik);
}

.dalsi__datum { font-size: clamp(2.1rem, 8.5vw, 4.2rem); }

.dalsi__souhrn {
  margin: .5rem 0 0;
  font: 500 .95rem/1.45 var(--data);
  color: var(--inkoust-2);
}

.dalsi__odkaz { margin: .6rem 0 0; }
.dalsi__odkaz a {
  font: 600 .88rem/1 var(--text);
  text-decoration: none;
  border-bottom: 2px solid var(--travnik);
  padding-bottom: .15em;
}
.dalsi__odkaz a:hover { color: var(--travnik); }

/* ------------------------------------------------------------- pás sezóny */

.pas { margin: 0 0 clamp(1.2rem, 3vw, 2rem); }

.pas__dny {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  margin: 0;
  padding: 0 0 1.35rem;
  list-style: none;
  height: 5.5rem;
  border-bottom: 1px solid var(--lajna-silna);
  position: relative;
}

.pas__polozka { flex: 1 1 0; min-width: 3px; position: relative; height: 100%; }

.pas__prestavka {
  flex: 0 1 7rem;
  min-width: 2.5rem;
  align-self: stretch;
  position: relative;
}
.pas__prestavka::before {
  content: "";
  position: absolute;
  inset-inline: .35rem;
  bottom: 0;
  border-bottom: 1px dashed var(--lajna-silna);
}
.pas__prestavka span {
  position: absolute;
  bottom: .3rem;
  inset-inline: 0;
  text-align: center;
  font: 500 .62rem/1 var(--text);
  letter-spacing: .04em;
  color: var(--inkoust-2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pas__den {
  display: block;
  height: 100%;
  position: relative;
  text-decoration: none;
}

.pas__sloupec {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: calc(14% + var(--v, .2) * 86%);
  background: var(--travnik);
  transition: background-color .15s ease, height .2s ease;
}

.pas__den--minule .pas__sloupec { background: rgba(44, 107, 71, .32); }
.pas--archiv .pas__den--minule .pas__sloupec { background: var(--travnik); }
.pas__den:hover .pas__sloupec,
.pas__den:focus-visible .pas__sloupec { background: var(--okr); }
.pas__den--prazdny .pas__sloupec { background: var(--lajna); height: 4px; }

.pas__polozka--mesic::after {
  content: attr(data-mesic);
  position: absolute;
  bottom: -1.15rem;
  left: 0;
  font: 500 .66rem/1 var(--data);
  color: var(--inkoust-2);
  letter-spacing: .02em;
}

.pas__legenda {
  margin: .45rem 0 0;
  font: 400 .78rem/1.4 var(--text);
  color: var(--inkoust-2);
}
.pas__legenda [data-role="pas-shrnuti"] { color: var(--inkoust); font-weight: 500; }

/* ---------------------------------------------------------------- filtry */

.filtry {
  position: sticky;
  top: 0;
  z-index: 20;
  margin: 0 0 1.5rem;
  padding: .7rem 0 .6rem;
  background: color-mix(in srgb, var(--papir) 92%, transparent);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--lajna);
  display: grid;
  gap: .55rem;
}

.filtry__lista,
.filtry__radek { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem .55rem; }

.filtry__panel { display: grid; gap: .55rem; }

.tlacitko--filtr { display: none; }

.stitky {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  border: 0;
  margin: 0;
  padding: 0;
}

.stitek { position: relative; }
.stitek input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; cursor: pointer; }

.stitek span {
  display: inline-block;
  padding: .3rem .6rem .32rem;
  border: 1px solid var(--lajna-silna);
  border-left: 3px solid var(--barva);
  background: var(--karta);
  font: 500 .82rem/1.15 var(--text);
  white-space: nowrap;
  transition: background-color .12s ease, color .12s ease;
}

.stitek input:checked + span {
  background: var(--barva);
  border-color: var(--barva);
  color: #fff;
}
.stitek input:focus-visible + span { outline: 2px solid var(--travnik); outline-offset: 2px; }
.stitek:hover span { background: var(--papir-2); }
.stitek input:checked + span:hover { background: var(--barva); }

.pole { display: flex; align-items: center; gap: .4rem; }
.pole__popis {
  font: 600 .7rem/1 var(--text);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--inkoust-2);
}
.pole select,
.pole input {
  font: 400 .88rem/1.2 var(--text);
  padding: .34rem .5rem;
  border: 1px solid var(--lajna-silna);
  background: var(--karta);
  color: inherit;
  border-radius: 0;
  max-width: 100%;
}
.pole--hledat { flex: 1 1 12rem; }
.pole--hledat input { flex: 1 1 auto; min-width: 0; }

.prepinac { display: flex; border: 1px solid var(--lajna-silna); background: var(--karta); }
.prepinac label { position: relative; }
.prepinac input { position: absolute; opacity: 0; inset: 0; width: 100%; cursor: pointer; }
.prepinac span {
  display: block;
  padding: .34rem .65rem;
  font: 500 .82rem/1.2 var(--text);
  white-space: nowrap;
}
.prepinac input:checked + span { background: var(--plocha); color: var(--na-plose); }
.prepinac input:focus-visible + span { outline: 2px solid var(--travnik); outline-offset: -2px; }

.tlacitko {
  font: 500 .82rem/1.2 var(--text);
  padding: .38rem .7rem;
  border: 1px solid var(--lajna-silna);
  background: var(--karta);
  color: var(--inkoust);
  cursor: pointer;
  text-decoration: none;
  border-radius: 0;
}
.tlacitko:hover { background: var(--papir-2); border-color: var(--travnik); }
.tlacitko--odeslat { background: var(--plocha); color: var(--na-plose); border-color: var(--plocha); }
.tlacitko--odeslat:hover { background: var(--travnik); border-color: var(--travnik); color: #fff; }

/* Když funguje JavaScript, tlačítko pro odeslání filtru není potřeba. Platí to
   jen pro filtry – přihlašovací formulář musí své tlačítko mít vždy. */
.js .filtry .tlacitko--odeslat,
.js .muj-oddil .tlacitko--odeslat { display: none; }

.filtry__stav {
  margin: 0;
  margin-inline-end: auto;
  font: 500 .8rem/1.3 var(--data);
  color: var(--inkoust-2);
}

/* ------------------------------------------------------------- kalendář */

.kalendar { margin-bottom: 2rem; scroll-margin-top: calc(var(--vyska-filtru) + 1rem); }

.kalendar__ovladani {
  display: flex;
  align-items: center;
  gap: .6rem;
  margin-bottom: .6rem;
}

.kalendar__nazev {
  margin: 0;
  order: -1;
  font: 700 clamp(1.1rem, 3.2vw, 1.5rem)/1.1 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .01em;
  flex: 1 1 auto;
}

.kalendar__sip {
  width: 2.1rem; height: 2.1rem;
  border: 1px solid var(--lajna-silna);
  background: var(--karta);
  color: var(--inkoust);
  font-size: 1rem;
  cursor: pointer;
}
.kalendar__sip:hover { background: var(--plocha); color: var(--na-plose); }
.kalendar__sip[disabled] { opacity: .35; cursor: default; }
.kalendar__sip[disabled]:hover { background: var(--karta); color: var(--inkoust); }

.kalendar__mrizka {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 1px;
  background: var(--lajna);
  border: 1px solid var(--lajna);
}

.kalendar__zahlavi {
  background: var(--papir);
  padding: .3rem .4rem;
  font: 600 .68rem/1 var(--text);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--inkoust-2);
  text-align: center;
}

.kalendar__bunka {
  background: var(--karta);
  min-height: 3.6rem;
  padding: .3rem .35rem .4rem;
  display: flex;
  flex-direction: column;
  gap: .22rem;
  text-align: left;
  border: 0;
  font: inherit;
  color: inherit;
  cursor: default;
}
.kalendar__bunka--mimo { background: var(--papir); opacity: .5; }
.kalendar__bunka--hraci { cursor: pointer; }
.kalendar__bunka--hraci:hover { background: var(--papir-2); box-shadow: inset 0 0 0 2px var(--travnik); }
.kalendar__bunka--dnes { box-shadow: inset 0 0 0 2px var(--okr); background: var(--okr-svetly); }
.kalendar__bunka--vikend .kalendar__cislo { color: var(--travnik); }

.kalendar__cislo { font: 500 .82rem/1 var(--data); color: var(--inkoust-2); }
.kalendar__hraci .kalendar__cislo { color: var(--inkoust); font-weight: 600; }

.kalendar__pruhy { display: flex; flex-direction: column; gap: 2px; }
.kalendar__pruh { height: 4px; background: var(--barva); }
.kalendar__vic { font: 500 .66rem/1 var(--data); color: var(--inkoust-2); }

.kalendar__napoveda {
  margin: .5rem 0 0;
  font: 400 .78rem/1.4 var(--text);
  color: var(--inkoust-2);
}

/* --------------------------------------------------------------- seznam */

.den { margin-bottom: 1.6rem; scroll-margin-top: calc(var(--vyska-filtru) + 1rem); }
.den[hidden] { display: none; }

.den__hlava {
  position: sticky;
  top: var(--vyska-filtru);
  z-index: 10;
  display: flex;
  align-items: baseline;
  gap: .55rem;
  margin: 0 0 .4rem;
  padding: .35rem 0 .3rem;
  background: color-mix(in srgb, var(--papir) 94%, transparent);
  backdrop-filter: blur(6px);
  border-bottom: 2px solid var(--inkoust);
  font-family: var(--titulky);
  font-weight: 700;
}

.den__dow {
  font-size: .78rem;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--travnik);
}
.den__datum { font-size: clamp(1.05rem, 3vw, 1.3rem); letter-spacing: -.01em; }
.den__pocet {
  margin-inline-start: auto;
  font: 500 .78rem/1 var(--data);
  color: var(--inkoust-2);
}

.den--dnes .den__hlava { border-bottom-color: var(--okr); }
.den--dnes .den__dow { color: var(--okr); }
.den--minule { opacity: .72; }
.seznam--archiv .den--minule { opacity: 1; }
.den--zvyrazneno .den__hlava { border-bottom-color: var(--okr); }

/* Na přehledu je hlavní sloupec užší (vedle je postranní panel), takže názvy
   družstev se do jednoho řádku vejdou jen tehdy, když se ostatní údaje – kolo,
   číslo utkání a rozhodčí – přesunou pod ně. */
@media (min-width: 46.01rem) {
  .mrizka__hlavni .zapasy {
    grid-template-columns: 3.4rem 7.6rem minmax(0, 1fr) auto;
  }
  .mrizka__hlavni .zapas {
    grid-template-areas:
      "cas kat utkani       skore"
      "cas kat meta         meta"
      "cas kat rozhodci     rozhodci"
      "cas kat podrobnosti  podrobnosti"
      "cas kat zapis        zapis";
    row-gap: .05rem;
  }
  .mrizka__hlavni .zapas__meta,
  .mrizka__hlavni .zapas__rozhodci {
    text-align: left;
    white-space: normal;
  }
  .mrizka__hlavni .zapas__utkani { white-space: normal; }
}

/* Sloupce se určují na seznamu, jednotlivé zápasy je přebírají přes subgrid.
   Bez toho má každý řádek vlastní mřížku a skóre se mezi řádky posouvá. */
/* Posun po filtrování si řídí skript sám (drží zápas, který má člověk před
   očima). Vlastní dorovnávání prohlížeče by mu do toho mluvilo. */
.zapasy { overflow-anchor: none; }

.zapasy {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 3.6rem 8.5rem minmax(0, 1fr) auto auto auto;
}

/* V rozpisu mají poslední tři sloupce pevnou šířku. S „auto“ se sice přizpůsobí
   obsahu, ale každý hrací den je vlastní seznam, takže by den s dlouhým zápisem
   rozhodčích posunul skóre jinam než ostatní dny. Na přehledu je sloupec užší,
   tam by pevné šířky nenechaly místo na názvy oddílů – proto jen tady. */
.seznam .zapasy {
  grid-template-columns: 3.6rem 8.5rem minmax(0, 1fr) 8.2rem 9.4rem 9.6rem;
}

/* Chybějící údaj (skóre, rozhodčí, poznámka) nechá svou buňku prázdnou,
   takže zarovnání zůstane stejné napříč celým seznamem. */
.zapas {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: subgrid;
  grid-template-areas:
    "cas kat utkani      skore       meta        rozhodci"
    "cas kat podrobnosti podrobnosti podrobnosti podrobnosti"
    "cas kat zapis       zapis       zapis       zapis";
  align-items: baseline;
  gap: .1rem .7rem;
  padding: .42rem .5rem .42rem .55rem;
  border-bottom: 1px solid var(--lajna);
  border-left: 3px solid var(--barva);
  background: var(--karta);
}
.zapas[hidden] { display: none; }
.zapas:hover { background: var(--papir-2); }

.zapas__cas {
  grid-area: cas;
  font: 500 .88rem/1.4 var(--data);
  color: var(--inkoust);
  font-variant-numeric: tabular-nums;
}

.zapas__kategorie {
  grid-area: kat;
  font: 600 .72rem/1.35 var(--text);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--barva);
  /* Dlouhý název se zalomí na dva řádky; tři tečky až na třetím. */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  overflow-wrap: anywhere;
  padding-top: .1em;
}

.zapas__utkani { grid-area: utkani; }
.zapas__tym { font-weight: 500; }
.zapas__vs { color: var(--inkoust-2); white-space: nowrap; }
.zapas__turnaj { font-weight: 600; }
.zapas__poradatel { color: var(--inkoust-2); font-size: .92em; }

.zapas__meta {
  grid-area: meta;
  font: 400 .76rem/1.5 var(--data);
  color: var(--inkoust-2);
  /* Dlouhý popis kola („Předehrávka · č. u. 701M“) se zalomí stejně jako
     rozhodčí; s nowrap přetékal do vedlejšího sloupce. */
  overflow-wrap: anywhere;
}

.zapas__skore {
  grid-area: skore;
  white-space: nowrap;
  font: 600 .95rem/1.4 var(--data);
  font-variant-numeric: tabular-nums;
}
/* Vítězné číslo skóre. Odstín drží zelenou linii webu a je dost tmavý na to,
   aby zůstal čitelný i pro toho, kdo barvy rozlišuje hůř. */
.zapas__vitez { color: #24603a; }

.zapas__polocas { font-weight: 400; color: var(--inkoust-2); margin-inline-start: .35em; }

/* Poznámka je výjimečná, dostane vlastní řádek pod utkáním. */
.zapas__podrobnosti {
  grid-area: podrobnosti;
  font: 400 .78rem/1.4 var(--text);
  color: var(--inkoust-2);
}

.zapas__rozhodci {
  grid-area: rozhodci;
  font: 400 .76rem/1.5 var(--text);
  color: var(--inkoust-2);
  /* U turnajů bývá rozhodčích několik – ať se zalomí, než aby roztáhli sloupec. */
  overflow-wrap: anywhere;
}
/* Samotné jméno by nebylo poznat, proto nenápadný popisek. */
.zapas__rozhodci::before {
  content: "rozhodčí ";
  font-size: .88em;
  opacity: .75;
}

/* Prohlížeče bez subgridu: řádky se mezi sebou nezarovnají, obsah ale zůstane
   čitelný a na svém místě. */
@supports not (grid-template-columns: subgrid) {
  .zapasy { display: block; }
  .zapas { grid-template-columns: 3.6rem 8.5rem minmax(0, 1fr) auto auto auto; }
  .seznam .zapas { grid-template-columns: 3.6rem 8.5rem minmax(0, 1fr) 8.2rem 9.4rem 9.6rem; }

  @media (max-width: 46rem) {
    .zapas { grid-template-columns: 3.4rem minmax(0, 1fr) auto; }
  }
}

/* Jednoduché zobrazení: zůstane čas, kategorie, soupeři a skóre. Kolo, číslo
   utkání, rozhodčí ani poznámka se nezobrazují – zápas se tím vejde na jeden
   řádek i na telefonu. */
.zobrazeni-jednoduche .zapas__meta,
.zobrazeni-jednoduche .zapas__rozhodci,
.zobrazeni-jednoduche .zapas__podrobnosti { display: none; }

/* Za skóre zůstává prázdný sloupec, aby zůstalo přibližně tam, kde je
   v podrobném zobrazení, a při přepnutí neuskočilo na pravý okraj. */
.zobrazeni-jednoduche .zapasy {
  grid-template-columns: 3.6rem 8.5rem minmax(0, 1fr) auto minmax(0, .6fr);
}

/* Šířky odpovídají podrobnému zobrazení (poslední sloupec zastupuje zmizelé
   údaje i mezeru mezi nimi), takže skóre zůstane na stejném místě. */
.zobrazeni-jednoduche .seznam .zapasy {
  grid-template-columns: 3.6rem 8.5rem minmax(0, 1fr) 8.2rem 19rem;
}

.zobrazeni-jednoduche .zapas {
  grid-template-areas: "cas kat utkani skore konec";
}
/* Jednoduché zobrazení má být stručné – zápis o utkání do něj nepatří. */
.zobrazeni-jednoduche .zapis { display: none; }

/* Značka „přeloženo“ míří do oblasti podrobností, kterou tahle mřížka nemá –
   bez přeřazení by ji prohlížeč odsunul do vlastního řádku vpravo. */
.zobrazeni-jednoduche .zapas__prelozeno {
  grid-area: utkani;
  justify-self: end;
  align-self: center;
}

/* Vložený turnaj tvoří v rozpisu celek: hlavička a pod ní jeho zápasy.
   Odsazovat obsah nejde – řádky sdílejí mřížku a skóre by se rozjelo –, proto
   se skupina odliší podbarvením a svislou linkou u levého okraje. */
.zapas--v-turnaji {
  background: #f4f2ea;
  box-shadow: inset .5rem 0 0 -.36rem var(--lajna-silna);
}
.zapas--v-turnaji .zapas__utkani { font-size: .95em; }

/* Konec skupiny uzavře silnější linka pod posledním zápasem turnaje. */
.zapas--konec-turnaje { border-bottom: 2px solid var(--lajna-silna); }

/* Hlavička turnaje se chová jako záhlaví skupiny – tmavší podklad a odsazený
   popisek, aby bylo poznat, že následující zápasy patří k ní. */
.zapas--turnaj.zapas--zahlavi {
  background: #e8e6dc;
  border-bottom: 1px solid var(--lajna-silna);
}
.zapas--turnaj.zapas--zahlavi .zapas__utkani::after {
  content: "zápasy turnaje níže";
  display: block;
  margin-top: .1rem;
  font: 400 .72rem/1.4 var(--text);
  color: var(--inkoust-2);
}

.zapas--turnaj { border-left-style: dashed; }

/* --------------------------------------------------------------- ostatní */

.hlaska {
  margin: 1.5rem 0;
  padding: .8rem 1rem;
  background: var(--karta);
  border-left: 3px solid var(--travnik);
  font-size: .95rem;
}
.hlaska--chyba { border-left-color: var(--chyba); }
.hlaska code { font-family: var(--data); font-size: .9em; }

.paticka {
  margin-top: 2.5rem;
  padding: 1.4rem 0 2rem;
  border-top: 1px solid var(--lajna);
  color: var(--inkoust-2);
  font-size: .82rem;
}
.paticka p { margin: .2rem 0; }

.paticka__zdroj { margin-top: .6rem; }

.paticka__podpis {
  margin-top: 1.1rem;
  padding-top: .8rem;
  border-top: 1px solid var(--lajna);
  color: var(--odkaz);
  font-style: italic;
}

/* Vlastník domény a verze tvoří spolu s podpisem uzavírající blok. */
/* Doplňkový řádek o sešitu – hlavní je nad ním údaj o eZápisu. */
/* Názvy sešitů bývají dlouhé a bez mezer – na úzkém displeji je nechme zalomit. */
.paticka p { overflow-wrap: anywhere; }

.paticka__zdroj-sesit {
  margin-top: .1rem;
  font-size: .82rem;
  opacity: .85;
}

.paticka__domena {
  margin-top: .35rem;
  font-size: .8rem;
}

.paticka__verze {
  font: 400 .74rem/1.4 var(--data);
  color: var(--inkoust-2);
}
.paticka__zdroj--chyba {
  padding: .4rem .6rem;
  border-left: 3px solid #a8402c;
  background: var(--karta);
  color: var(--inkoust);
}

/* ------------------------------------------------------------- tabulky */

.rozcestnik {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .5rem;
  margin: 1.4rem 0 1.2rem;
  padding-bottom: .8rem;
  border-bottom: 1px solid var(--lajna);
  font: 500 .86rem/1.4 var(--text);
}
.rozcestnik span { color: var(--inkoust-2); }
.rozcestnik strong { font-weight: 600; }

.odkaz-tabulky {
  display: inline-flex;
  align-items: center;
  gap: .35em;
  font: 600 .84rem/1.2 var(--text);
  text-decoration: none;
  padding: .3rem .65rem;
  border: 1px solid var(--travnik);
  color: var(--odkaz);
  background: var(--karta);
}
.odkaz-tabulky:hover { background: var(--plocha); border-color: var(--plocha); color: var(--na-plose); }

.bloky { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1.4rem; }

.blok {
  padding: .4rem .8rem;
  border: 1px solid var(--lajna-silna);
  background: var(--karta);
  color: var(--inkoust);
  text-decoration: none;
  font: 500 .88rem/1.3 var(--text);
}
.blok:hover { border-color: var(--travnik); }
.blok--vybrany {
  background: var(--plocha);
  border-color: var(--plocha);
  color: var(--na-plose);
  font-weight: 600;
}

.tabulky__nadpis {
  margin: 0 0 1.2rem;
  font: 700 clamp(1.2rem, 3.4vw, 1.6rem)/1.1 var(--titulky);
  text-transform: uppercase;
  letter-spacing: -.01em;
}

.kotvy { display: flex; flex-wrap: wrap; gap: .3rem; margin-bottom: 1.8rem; }
.kotvy a {
  padding: .24rem .55rem .26rem;
  border-left: 3px solid var(--barva);
  border-block: 1px solid var(--lajna);
  border-right: 1px solid var(--lajna);
  background: var(--karta);
  color: var(--inkoust);
  text-decoration: none;
  font: 500 .8rem/1.2 var(--text);
}
.kotvy a:hover { background: var(--barva); border-color: var(--barva); color: #fff; }

.tabulka { margin-bottom: 2.2rem; scroll-margin-top: 1rem; }

.tabulka__nazev {
  margin: 0 0 .5rem;
  padding-bottom: .3rem;
  border-bottom: 2px solid var(--barva);
  font: 700 clamp(1.05rem, 3vw, 1.3rem)/1.15 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .01em;
  color: var(--barva);
}

.tabulka__obal { overflow-x: auto; }

.poradi {
  width: 100%;
  border-collapse: collapse;
  background: var(--karta);
  font-size: .9rem;
}

.poradi th,
.poradi td {
  padding: .38rem .45rem;
  border-bottom: 1px solid var(--lajna);
  text-align: right;
  vertical-align: baseline;
}

.poradi thead th {
  font: 600 .7rem/1.2 var(--text);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--inkoust-2);
  border-bottom: 1px solid var(--lajna-silna);
  white-space: nowrap;
}

.poradi abbr { text-decoration: none; border-bottom: 1px dotted var(--lajna-silna); cursor: help; }

.poradi__misto {
  width: 2.4rem;
  font: 500 .85rem/1.4 var(--data);
  color: var(--inkoust-2);
  text-align: right;
}

.poradi .poradi__tym {
  text-align: left;
  font: 500 .92rem/1.35 var(--text);
  width: 99%;
}

.poradi__cislo,
.poradi__skore,
.poradi__body {
  font-family: var(--data);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.poradi__cislo { width: 2.2rem; }
.poradi__skore { width: 4.6rem; color: var(--inkoust-2); }
.poradi__rozdil { color: var(--inkoust-2); }
.poradi__body { width: 3rem; font-weight: 600; }
.poradi__cislo--prazdno { color: var(--inkoust-2); opacity: .6; }

.poradi tbody tr:hover { background: var(--papir-2); }

.poradi__radek--prvni .poradi__tym { font-weight: 600; }
.poradi__radek--prvni .poradi__misto { color: var(--okr); font-weight: 600; }
.poradi__radek--prvni td,
.poradi__radek--prvni th { border-bottom-color: var(--lajna-silna); }

.tabulka__legenda {
  margin: .5rem 0 0;
  font: 400 .78rem/1.45 var(--text);
  color: var(--inkoust-2);
}

/* ------------------------------------------------------------ nápověda */

.kotvy--obsah a { --barva: var(--travnik); }

.navod__uvod {
  margin: 0 0 1.4rem;
  max-width: 42rem;
  font-size: 1.05rem;
  line-height: 1.6;
}

.navod {
  margin-bottom: 2rem;
  max-width: 42rem;
  scroll-margin-top: 1rem;
}

.navod h2 {
  margin: 0 0 .5rem;
  padding-bottom: .3rem;
  border-bottom: 2px solid var(--travnik);
  font: 700 clamp(1.05rem, 3vw, 1.3rem)/1.15 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .01em;
  color: var(--odkaz);
}

.navod p { margin: .6rem 0; line-height: 1.6; }
.navod code { font: 500 .88em/1.4 var(--data); }

.navod__ukazka {
  padding: .5rem .7rem;
  background: var(--karta);
  border-left: 3px solid var(--lajna-silna);
  overflow-wrap: anywhere;
}

.navod__seznam { margin: .8rem 0 0; }

.navod__seznam dt {
  margin-top: .8rem;
  font-weight: 600;
}
.navod__seznam dt:first-child { margin-top: 0; }

.navod__seznam dd {
  margin: .15rem 0 0;
  padding-left: .9rem;
  border-left: 2px solid var(--lajna);
  color: var(--inkoust-2);
  line-height: 1.55;
}

.navod__znak {
  font-family: var(--data);
  font-weight: 500;
  color: var(--inkoust);
}

/* drobné ukázky ovládacích prvků přímo v textu */
.stitek--ukazka,
.tlacitko--ukazka {
  vertical-align: baseline;
  cursor: default;
  pointer-events: none;
}
.stitek--ukazka span { padding-block: .12rem .14rem; font-size: .78rem; }
.tlacitko--ukazka { padding: .14rem .45rem; font-size: .78rem; }

/* ---------------------------------------------------------- přehled (dashboard) */

.muj-oddil {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  margin: 1.4rem 0 1.6rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--lajna);
}

.muj-oddil__poznamka {
  font-size: .78rem;
  color: var(--inkoust-2);
}

.muj-oddil__vysvetleni {
  flex-basis: 100%;
  margin: .1rem 0 0;
  font-size: .82rem;
  color: var(--inkoust-2);
}

.mrizka {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  gap: 1.6rem;
  align-items: start;
}

.mrizka__strana { display: grid; gap: 1.2rem; position: sticky; top: 1rem; }

.panel { margin-bottom: 1.8rem; }
.mrizka__strana .panel { margin-bottom: 0; }

.panel__nazev {
  margin: 0 0 .7rem;
  padding-bottom: .3rem;
  border-bottom: 2px solid var(--inkoust);
  font: 700 clamp(1rem, 2.6vw, 1.2rem)/1.15 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .02em;
}

.panel__poznamka,
.panel__prazdno {
  margin: 0 0 .8rem;
  color: var(--inkoust-2);
  font-size: .9rem;
}

.panel__prazdno {
  padding: .9rem 1rem;
  background: var(--karta);
  border-left: 3px solid var(--lajna-silna);
}

.den__vice {
  margin: .3rem 0 0;
  font-size: .82rem;
}
.den__vice a { color: var(--inkoust-2); }
.den__vice a:hover { color: var(--travnik); }

.panel__dal { margin: .8rem 0 0; }
.panel__dal a {
  font: 600 .88rem/1.2 var(--text);
  text-decoration: none;
  border-bottom: 2px solid var(--travnik);
  padding-bottom: .12em;
}
.panel__dal a:hover { color: var(--travnik); }

/* v přehledu jsou hlavičky dnů kratší a nelepí se */
.panel .den { margin-bottom: 1.1rem; }
.panel .den__hlava { position: static; backdrop-filter: none; background: none; }

.panel--oznameni { padding: .9rem 1rem 1rem; background: var(--karta); border-left: 3px solid var(--okr); }
.panel--oznameni .panel__nazev { border-bottom-color: var(--okr); }
.oznameni p { margin: .4rem 0; font-size: .92rem; line-height: 1.55; }
.oznameni p:first-child { margin-top: 0; }

.rozcestí { margin: 0; padding: 0; list-style: none; }
.rozcestí li { border-bottom: 1px solid var(--lajna); }
.rozcestí a {
  display: block;
  padding: .5rem .1rem;
  text-decoration: none;
  font: 500 .9rem/1.35 var(--text);
  color: var(--inkoust);
}
.rozcestí a:hover { color: var(--travnik); padding-left: .35rem; }

.cisla { margin: 0; display: grid; gap: .1rem; }
.cisla > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .6rem;
  padding: .32rem 0;
  border-bottom: 1px solid var(--lajna);
}
.cisla dt { color: var(--inkoust-2); font-size: .86rem; }
.cisla dd {
  margin: 0;
  font: 600 1.05rem/1 var(--data);
  font-variant-numeric: tabular-nums;
}

.panel--tabulka { margin-top: .6rem; }
.kotvy--tabulky { margin-bottom: 1rem; }
.kotvy a.kotvy--vybrano {
  background: var(--barva);
  border-color: var(--barva);
  color: #fff;
  font-weight: 600;
}

/* Družstvo v tabulce vede na jeho zápasy; podtržení až při najetí, ať tabulka
   nevypadá jako změť odkazů. */
.poradi__tym a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px dotted var(--lajna-silna);
}
.poradi__tym a:hover,
.poradi__tym a:focus-visible { color: var(--travnik); border-bottom-color: var(--travnik); }

/* Forma: posledních pět zápasů zleva doprava, nejnovější vpravo. */
.poradi__forma { white-space: nowrap; text-align: right; }

.forma { display: inline-flex; gap: .15rem; }

.forma__znak {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.15rem;
  height: 1.15rem;
  border-radius: 2px;
  font: 600 .62rem/1 var(--text);
  color: var(--na-plose);
  cursor: help;
}
.forma__znak--vyhra  { background: #24603a; }
.forma__znak--remiza { background: #a8801a; }
.forma__znak--prohra { background: #9a3324; }
.forma__prazdno { color: var(--inkoust-2); opacity: .5; }

/* Přehled formy za celou sezónu – vlastní oddíl na konci stránky, kde je na
   všechna kola místo i na telefonu. */
.forma-sezona {
  margin-top: 2.2rem;
  padding-top: 1.2rem;
  border-top: 2px solid var(--inkoust);
}

.forma-sezona__nazev {
  margin: 0 0 .2rem;
  font: 700 clamp(1.05rem, 2.8vw, 1.25rem)/1.15 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .02em;
}

.forma-sezona__popis {
  margin: 0 0 1rem;
  font-size: .86rem;
  color: var(--inkoust-2);
}

.forma-sezona__kategorie { margin-bottom: 1.4rem; }

.forma-sezona__kat-nazev {
  margin: 0 0 .3rem;
  padding-bottom: .2rem;
  border-bottom: 1px solid var(--lajna-silna);
  font: 600 .78rem/1.3 var(--text);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--barva, var(--inkoust-2));
}

.forma-sezona__seznam { list-style: none; margin: 0; padding: 0; display: grid; gap: .1rem; }

.forma-sezona__radek {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .3rem .8rem;
  padding: .3rem .5rem .3rem .1rem;
  border-bottom: 1px solid var(--lajna);
  background: var(--karta);
}

.forma-sezona__tym { font-size: .9rem; }
/* Značky u pravého okraje – řady pod sebou pak končí zarovnaně. */
.forma-sezona .forma { flex-wrap: wrap; justify-content: flex-end; }

@media (max-width: 46rem) {
  /* Název družstva nad značkami – na řadu kol je pak celá šířka. */
  .forma-sezona__radek {
    grid-template-columns: minmax(0, 1fr);
    padding: .45rem .5rem;
  }
  .forma-sezona__tym { font-weight: 600; font-size: .88rem; }
  .forma-sezona .forma__znak { width: 1.05rem; height: 1.05rem; font-size: .58rem; }
}

/* Tabulky ještě nezahrnují zápasy doplněné z eZápisu – po vydání nového sešitu
   se přepočítají a hláška zmizí. */
.tabulky__varovani {
  margin: .6rem 0 1rem;
  padding: .6rem .8rem;
  background: #fbeceb;
  border-left: 3px solid #9a3324;
  color: #9a3324;
  font: 700 .84rem/1.45 var(--text);
  letter-spacing: .02em;
}

/* Legenda formy stojí jednou pod přepínačem kategorií, ne u každé tabulky. */
.legenda-formy {
  margin: .6rem 0 1.2rem;
  font-size: .86rem;
  color: var(--inkoust-2);
}
.legenda-formy .forma__znak { vertical-align: -.2em; margin: 0 .1em; }

@media (max-width: 46rem) {
  .legenda-formy { display: none; }   /* sloupec Forma se v tabulce nezobrazuje */
}

.poradi__radek--muj { background: var(--okr-svetly); }
.poradi__radek--muj .poradi__tym { font-weight: 600; }

@media (max-width: 60rem) {
  .mrizka { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .mrizka__strana { position: static; }
}

/* ------------------------------------------------------------ novinky */

.novinky { list-style: none; margin: 1.4rem 0 0; padding: 0; }

.novinky__polozka {
  padding: .9rem 0 1rem;
  border-top: 1px solid var(--lajna);
}
.novinky__polozka:first-child { border-top: 2px solid var(--inkoust); }

.novinky__hlava {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .2rem .8rem;
  margin-bottom: .4rem;
}

.novinky__verze {
  font: 600 .95rem/1.2 var(--data);
  color: var(--odkaz);
}

.novinky__datum {
  font: 400 .82rem/1.3 var(--data);
  color: var(--inkoust-2);
}

.novinky__seznam { margin: 0; padding-left: 1.1rem; }
.novinky__seznam li { margin-bottom: .3rem; line-height: 1.5; }

.novinky__poznamka {
  margin-top: 1.6rem;
  padding-top: .9rem;
  border-top: 1px solid var(--lajna);
  font-size: .86rem;
  color: var(--inkoust-2);
}

/* ------------------------------------------------------------- o webu */

.autori { list-style: none; margin: 1rem 0; padding: 0; display: grid; gap: .5rem; }

.autor {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: baseline;
  gap: .2rem .9rem;
  padding: .6rem .7rem;
  background: var(--karta);
  border-left: 3px solid var(--travnik);
}

.autor__jmeno { font-weight: 600; }

.autor__role {
  grid-column: 1;
  font-size: .84rem;
  color: var(--inkoust-2);
}

.autor__mail {
  grid-row: 1 / 3;
  grid-column: 2;
  align-self: center;
  font: 500 .92rem/1.3 var(--data);
  color: var(--odkaz);
  word-break: break-all;
}

.navod__poznamka {
  font-size: .86rem;
  color: var(--inkoust-2);
}

@media (max-width: 46rem) {
  .autor {
    grid-template-columns: minmax(0, 1fr);
  }
  .autor__mail { grid-row: auto; grid-column: 1; align-self: start; margin-top: .2rem; }
}

/* ----------------------------------------------------- zápis o utkání */

.zapis {
  grid-area: zapis;      /* vlastní řádek, jinak by ležel přes poznámku */
  margin-top: .2rem;
}

.zapis__prepinac {
  display: inline-block;
  padding: .1rem .4rem;
  border: 1px solid var(--lajna-silna);
  background: var(--papir-2);
  font: 400 .72rem/1.5 var(--text);
  color: var(--inkoust-2);
  cursor: pointer;
  list-style: none;
}
.zapis__prepinac::-webkit-details-marker { display: none; }
.zapis__prepinac::before { content: "▸ "; }
.zapis[open] .zapis__prepinac::before { content: "▾ "; }
.zapis__prepinac:hover { color: var(--travnik); border-color: var(--travnik); }

.zapis__obsah {
  margin-top: .5rem;
  padding: .7rem .8rem;
  background: var(--papir-2);
  border-left: 3px solid var(--lajna-silna);
}

.zapis__hlava { margin: 0 0 .5rem; font: 400 .8rem/1.4 var(--data); color: var(--inkoust-2); }

.zapis__sestavy {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  gap: 1rem;
}

.sestava__nazev {
  margin: 0 0 .3rem;
  padding-bottom: .2rem;
  border-bottom: 1px solid var(--lajna-silna);
  font: 600 .8rem/1.3 var(--text);
}

.sestava__seznam { list-style: none; margin: 0; padding: 0; }

.sestava__hrac {
  display: grid;
  grid-template-columns: 1.6rem minmax(0, 1fr) auto 1.6rem;
  align-items: baseline;
  gap: .3rem;
  padding: .12rem 0;
  font-size: .84rem;
}

.sestava__cislo { font: 400 .74rem/1.4 var(--data); color: var(--inkoust-2); text-align: right; }
.sestava__role { font-size: .78em; color: var(--inkoust-2); }
.sestava__branky {
  font: 600 .84rem/1.4 var(--data);
  font-variant-numeric: tabular-nums;
  text-align: right;
}

/* Značky (zranění, karta) sdílejí jeden sloupec mřížky. */
.sestava__znacky {
  display: inline-flex;
  align-items: baseline;
  gap: .3rem;
  justify-content: flex-end;
}

/* Zranění – nenápadný odznak, podrobnost je v titulku. */
.sestava__zraneni {
  padding: 0 .25rem;
  font: 400 .62rem/1.5 var(--text);
  color: var(--inkoust-2);
  border: 1px solid var(--lajna-silna);
  border-radius: 2px;
  cursor: help;
  white-space: nowrap;
}

.sestava__karta {
  min-width: 2rem;
  font: 600 .64rem/1.5 var(--text);
  text-align: center;
  cursor: help;
}
.sestava__karta--žk { color: #8a6a12; }
.sestava__karta--čk5,
.sestava__karta--čk10 { color: #9a3324; }
.sestava__karta--ot { color: #6b3a8a; }

.sestava__realizacni {
  margin: .3rem 0 0;
  font-size: .76rem;
  color: var(--inkoust-2);
}

.zapis__udaje {
  margin: .7rem 0 0;
  padding-top: .5rem;
  border-top: 1px solid var(--lajna);
  font-size: .78rem;
  color: var(--inkoust-2);
}

/* -------------------------------------------------- odkaz na sociální síť */

.odkaz-site {
  display: inline-flex;
  align-items: center;
  gap: .35em;
  white-space: nowrap;
}
/* V seznamu Kam dál mají odkazy display: block; ikona s textem ale potřebují
   flex, jinak se mezera mezi nimi neuplatní. */
.rozcestí .odkaz-site {
  display: inline-flex;
  width: 100%;
}

/* V patičce odkaz pokračuje v řádku s ostatními, nesmí zabrat celou šířku. */
.paticka .odkaz-site {
  display: inline-flex;
  width: auto;
  vertical-align: baseline;
}

.ikona-site {
  width: 1em;
  height: 1em;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
}
.ikona-site__tecka { fill: currentColor; stroke: none; }

/* Šipka říká, že odkaz vede mimo web – zvlášť v neveřejné části se hodí vědět,
   že člověk odchází pryč. */
.odkaz-site__ven {
  font-size: .8em;
  opacity: .65;
}

/* ------------------------------------------------------ vývoj pořadí */

.vyvoj-sezona {
  margin-top: 2.4rem;
  padding-top: 1.2rem;
  border-top: 2px solid var(--inkoust);
}

.vyvoj {
  margin-bottom: 1.8rem;
  --vyvoj-0: #16588f;
  --vyvoj-1: #c0392b;
  --vyvoj-2: #1e8449;
  --vyvoj-3: #8e44ad;
  --vyvoj-4: #b9770e;
  --vyvoj-5: #117a65;
  --vyvoj-6: #7d3c98;
  --vyvoj-7: #a04000;
}

.vyvoj__nazev {
  margin: 0 0 .4rem;
  font: 600 .8rem/1.3 var(--text);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--inkoust-2);
}

.vyvoj__graf {
  display: block;
  width: 100%;
  height: auto;
  background: var(--karta);
  border: 1px solid var(--lajna);
}

.vyvoj__linka { stroke: var(--lajna); stroke-width: 1; }
.vyvoj__cara { fill: none; stroke-width: 2.4; stroke-linejoin: round; stroke-linecap: round; opacity: .92; }
.vyvoj__misto { font: 400 13px var(--data); fill: var(--inkoust-2); }
.vyvoj__den   { font: 400 12px var(--data); fill: var(--inkoust-2); }
.vyvoj__tym   { font: 600 13.5px var(--text); }

/* Zimní přestávka – hraje se turnajově, tabulka se nemění. */
/* Čárkovaná spojnice od názvu k místu, kde družstvo vstoupilo do grafu. */
.vyvoj__vodici {
  stroke-width: 1.2;
  stroke-dasharray: 3 3;
  opacity: .45;
}

.vyvoj__prestavka {
  stroke: var(--lajna-silna);
  stroke-width: 1;
  stroke-dasharray: 4 3;
}
.vyvoj__prestavka-popis {
  font: 400 11.5px var(--text);
  fill: var(--inkoust-2);
}

/* Výpis míst – náhrada grafu na úzkém displeji. */
.vyvoj__vypis { display: none; list-style: none; margin: 0; padding: 0; }

.vyvoj__radek {
  display: grid;
  gap: .05rem;
  padding: .4rem .5rem;
  border-bottom: 1px solid var(--lajna);
  background: var(--karta);
}
.vyvoj__radek-tym { font-size: .92rem; font-weight: 600; }
.vyvoj__radek-mista {
  font: 400 .84rem/1.5 var(--data);
  color: var(--inkoust-2);
}

@media (max-width: 46rem) {
  .vyvoj__graf { display: none; }
  .vyvoj__vypis { display: block; }
}

/* Záložky na přehledu zastupují nadpis panelu: vybraná splývá s obsahem pod
   sebou, druhá je odsazená dozadu. */
.zalozky {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
  margin: 0 0 -1px;
  border-bottom: 2px solid var(--inkoust);
}

.zalozka {
  padding: .4rem .85rem .35rem;
  border: 1px solid var(--lajna-silna);
  border-bottom: 0;
  border-radius: 3px 3px 0 0;
  background: var(--papir-2);
  font: 700 clamp(.82rem, 2.1vw, .95rem)/1.3 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .02em;
  color: var(--inkoust-2);
  text-decoration: none;
}

.zalozka:hover { color: var(--travnik); }

.zalozka--vybrana {
  background: var(--papir);
  border-color: var(--inkoust);
  border-width: 2px 2px 0;
  color: var(--inkoust);
  position: relative;
  z-index: 1;
}

.panel__obsah { padding-top: .9rem; }
.panel__obsah[hidden] { display: none; }

/* ------------------------------------------- kód pro vložení na cizí web */

.vlozit__nazev {
  margin: 1.8rem 0 .3rem;
  font: 700 clamp(1rem, 2.6vw, 1.2rem)/1.2 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .02em;
}

.vlozit__popis { margin: 0 0 .8rem; font-size: .9rem; color: var(--inkoust-2); }

.vlozit__kod {
  margin: 0 0 .6rem;
  padding: .8rem;
  overflow-x: auto;
  background: var(--karta);
  border: 1px solid var(--lajna-silna);
  font: 400 .82rem/1.6 var(--data);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.vlozit__stav { margin-left: .6rem; font-size: .85rem; color: var(--travnik); }

/* Náhled má vypadat jako cizí stránka, proto rámeček a vlastní podklad. */
.vlozit__nahled {
  padding: 1rem;
  background: #fff;
  border: 1px dashed var(--lajna-silna);
}

.vlozit__volby { margin: 0 0 1rem; font-size: .9rem; }
.vlozit__volby dt { font: 600 .85rem/1.6 var(--data); margin-top: .5rem; }
.vlozit__volby dd { margin: 0 0 .2rem; color: var(--inkoust-2); }

/* ------------------------------------------- týdenní rozvrh (rozpis hřiště) */

.prepinace-hriste {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem 1.2rem;
}

.tyden { margin-bottom: 1.8rem; }

.tyden__nazev {
  margin: 0 0 .3rem;
  padding-bottom: .25rem;
  border-bottom: 2px solid var(--inkoust);
  font: 700 clamp(.95rem, 2.4vw, 1.1rem)/1.2 var(--titulky);
}

/* Mřížka je široká; na úzkém displeji se posouvá do stran místo mačkání. */
.tyden__mrizka {
  --vyska-hodiny: 3.9rem;

  display: grid;
  grid-template-columns: 3.4rem repeat(var(--sloupcu, 7), minmax(8.5rem, 1fr));
  min-width: calc(3.4rem + var(--sloupcu, 7) * 8.5rem);
  background: var(--karta);
  border: 1px solid var(--lajna);
}

.tyden {
  overflow-x: auto;
}

.tyden__roh { border-bottom: 2px solid var(--inkoust); }

.tyden__den {
  display: flex;
  align-items: baseline;
  gap: .35rem;
  padding: .4rem .5rem;
  border-bottom: 2px solid var(--inkoust);
  border-left: 1px solid var(--lajna);
}
.tyden__den--prazdny { opacity: .45; }
.tyden__den--dnes { background: var(--zvyrazneni, #fdf3d8); }

.tyden__nazev-dne {
  font: 700 .78rem/1.2 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.tyden__datum { font: 400 .74rem/1.2 var(--data); color: var(--inkoust-2); }
.tyden__pocet { margin-left: auto; font: 400 .7rem var(--data); color: var(--inkoust-2); }

.tyden__osa { position: relative; }
.tyden__hodina {
  position: relative;
  height: var(--vyska-hodiny);
  border-bottom: 1px solid var(--lajna);
}

/* Popisek sedí na čáře nad buňkou; u první by přetekl ven, proto se posune
   dovnitř. */
.tyden__hodina span {
  position: absolute;
  top: -.55em;
  right: .35rem;
  font: 400 .7rem var(--data);
  color: var(--inkoust-2);
}
.tyden__hodina:first-child span { top: .1em; }

.tyden__sloupec { position: relative; border-left: 1px solid var(--lajna); }
.tyden__bunka { height: var(--vyska-hodiny); border-bottom: 1px solid var(--lajna); }

/* Blok zápasu sedí na hodinové mřížce: --zacatek a --delka jsou v hodinách.
   Překrývající se zápasy se rozdělí do sloupců (--sloupec z --soubezne), aby se
   neschovaly jeden za druhým. */
.tyden__zapas {
  --sirka: calc((100% - 4px) / var(--soubezne, 1));

  position: absolute;
  left: calc(2px + var(--sloupec, 0) * var(--sirka));
  width: calc(var(--sirka) - 2px);
  top: calc(var(--zacatek) * var(--vyska-hodiny));
  height: calc(var(--delka) * var(--vyska-hodiny));
  overflow: hidden;
  padding: .2rem .4rem;
  background: var(--papir);
  border-left: 3px solid var(--barva, var(--lajna-silna));
  box-shadow: 0 1px 2px rgba(20, 25, 45, .12);
}

.tyden__zapas--liga {
  background: var(--liga-podklad);
  border-left-color: var(--plocha);
}

/* Čas a skóre sdílejí první řádek bloku. */
.tyden__hlava {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .4rem;
}
.tyden__cas { font: 600 .72rem/1.3 var(--data); color: var(--inkoust-2); }
.tyden__kategorie {
  display: block;
  font: 600 .64rem/1.3 var(--text);
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--barva, var(--inkoust-2));
  overflow-wrap: anywhere;
}
.tyden__tymy { display: block; font-size: .76rem; line-height: 1.25; }
.tyden__skore { font: 700 .74rem/1.3 var(--data); white-space: nowrap; }

/* Na úzkém displeji jsou sloupce užší, text se láme na víc řádků – hodina proto
   dostane víc místa, aby se blok neořezával. */
@media (max-width: 46rem) {
  .tyden__mrizka { --vyska-hodiny: 7.4rem; }

  /* Užší sloupec znamená delší lámání názvů, proto drobnější písmo. */
  .tyden__zapas { padding: .15rem .3rem; }
  .tyden__tymy { font-size: .72rem; line-height: 1.2; }
  .tyden__kategorie { font-size: .6rem; }
}

/* --------------------------------------------- karty, tresty a zranění */

.statistika__podnazev {
  display: flex;
  align-items: baseline;
  gap: .5rem;
  margin: 1rem 0 .3rem;
  font: 600 .82rem/1.3 var(--text);
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--inkoust-2);
}
.statistika__pocet { margin-left: auto; font: 400 .78rem var(--data); }

.tresty { list-style: none; margin: 0; padding: 0; }

.tresty__radek {
  display: grid;
  grid-template-columns: 3rem minmax(7rem, 1fr) minmax(7rem, 1fr) minmax(8rem, 1.4fr) auto;
  align-items: baseline;
  gap: .2rem .8rem;
  padding: .35rem 0;
  border-bottom: 1px solid var(--lajna);
}
/* U zranění odpadá sloupec se značkou trestu. */
.tresty__radek--zraneni { grid-template-columns: minmax(7rem, 1fr) minmax(7rem, 1fr) minmax(8rem, 1.4fr) auto; }

.tresty__karta {
  justify-self: start;
  padding: .05rem .35rem;
  border-radius: 2px;
  font: 700 .72rem/1.5 var(--data);
  color: #fff;
  background: var(--inkoust-2);
}
.tresty__karta--zk { background: #b9770e; }
.tresty__karta--ck5, .tresty__karta--ck { background: #a4262c; }
.tresty__karta--ot { background: #6b3fa0; }

.tresty__role { color: var(--inkoust-2); font-size: .85em; }

/* Zda hráč utkání dohrál – u zranění to bývá to hlavní. */
.tresty__dohral {
  margin-left: .3rem;
  padding: .02rem .3rem;
  border-radius: 2px;
  background: var(--papir-2);
  font: 600 .74rem/1.5 var(--text);
  color: var(--inkoust-2);
}
.tresty__dohral--ne { background: #a4262c; color: #fff; }
.tresty__druzstvo { color: var(--inkoust-2); font-size: .9rem; }
.tresty__popis { font-size: .9rem; }
.tresty__zapas { font: 400 .78rem var(--data); color: var(--inkoust-2); white-space: nowrap; text-align: right; }

@media (max-width: 46rem) {
  .tresty__radek,
  .tresty__radek--zraneni {
    grid-template-columns: 3rem minmax(0, 1fr);
    grid-template-areas: "karta kdo" "karta druzstvo" "karta popis" "karta zapas";
  }
  .tresty__karta { grid-area: karta; }
  .tresty__kdo { grid-area: kdo; }
  .tresty__druzstvo { grid-area: druzstvo; }
  .tresty__popis { grid-area: popis; }
  .tresty__zapas { grid-area: zapas; text-align: left; }
  .tresty__radek--zraneni { grid-template-columns: minmax(0, 1fr); grid-template-areas: "kdo" "druzstvo" "popis" "zapas"; }
}

/* --------------------------------------------------------- moje družstva */

.moje__nazev {
  margin: 1.8rem 0 .6rem;
  font: 700 clamp(1.05rem, 2.8vw, 1.3rem)/1.2 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .02em;
}

.moje-vyber { margin-bottom: 1.4rem; }
.moje-vyber__nazev {
  margin: 0 0 .4rem;
  font: 600 .8rem/1.3 var(--text);
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--inkoust-2);
}

.stitky-tymu { list-style: none; display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 .8rem; padding: 0; }

.stitek-tymu {
  display: flex;
  align-items: center;
  gap: .4rem;
  padding: .25rem .5rem .25rem .6rem;
  background: var(--karta);
  border: 1px solid var(--lajna-silna);
  border-left: 4px solid var(--barva, var(--lajna-silna));
}
.stitek-tymu__nazev { font-weight: 600; }
.stitek-tymu__kategorie { font-size: .82rem; color: var(--inkoust-2); }
.stitek-tymu__pryc {
  margin-left: .1rem;
  padding: 0 .25rem;
  font: 400 1.1rem/1 var(--text);
  color: var(--inkoust-2);
  text-decoration: none;
}
.stitek-tymu__pryc:hover { color: var(--odkaz); }

.moje-vyber__akce { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0; }

/* Postavení v tabulce – jen družstvo a jeho sousedé. */
.moje-tabulky { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); }

.moje-tabulka {
  background: var(--karta);
  border: 1px solid var(--lajna);
  border-top: 3px solid var(--barva, var(--lajna-silna));
  padding: .5rem .7rem .6rem;
}
.moje-tabulka__nazev {
  margin: 0 0 .3rem;
  font: 600 .78rem/1.3 var(--text);
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--barva, var(--inkoust-2));
}
.moje-tabulka__seznam { list-style: none; margin: 0; padding: 0; }

.moje-tabulka__radek {
  display: grid;
  grid-template-columns: 1.8rem minmax(0, 1fr) auto auto;
  gap: .2rem .6rem;
  padding: .2rem 0;
  font-size: .9rem;
}
.moje-tabulka__radek--muj { font-weight: 700; }
.moje-tabulka__misto { color: var(--inkoust-2); text-align: right; font: 400 .85rem var(--data); }
.moje-tabulka__radek--muj .moje-tabulka__misto { font-weight: 700; color: inherit; }
.moje-tabulka__skore { font: 400 .85rem var(--data); color: var(--inkoust-2); }
.moje-tabulka__body { font: 600 .85rem var(--data); }

/* Výběr družstev */
.moje-seznam { margin-top: 2rem; }
.moje-seznam__popis { margin: 0 0 1rem; color: var(--inkoust-2); font-size: .92rem; }

.moje-oddil { margin: 0 0 .9rem; padding: 0; border: 0; }
.moje-oddil__nazev {
  padding: 0;
  margin-bottom: .3rem;
  font: 600 .82rem/1.3 var(--text);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.moje-oddil__tymy { display: flex; flex-wrap: wrap; gap: .3rem; }

.moje-seznam__akce { display: flex; align-items: center; gap: .7rem; margin-top: 1rem; }
.moje-seznam__pocet { font: 400 .85rem var(--data); color: var(--inkoust-2); }

/* ------------------------------------------------- informace oblasti (MD) */

.obsah-md { max-width: 52rem; }

.obsah-md h2 {
  margin: 2.2rem 0 .7rem;
  padding-bottom: .3rem;
  border-bottom: 2px solid var(--inkoust);
  font: 700 clamp(1.15rem, 3vw, 1.45rem)/1.25 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .02em;
}
.obsah-md > h2:first-child { margin-top: .6rem; }
.obsah-md h3 {
  margin: 1.6rem 0 .5rem;
  font: 700 1.08rem/1.3 var(--titulky);
}
.obsah-md h4, .obsah-md h5, .obsah-md h6 {
  margin: 1.2rem 0 .4rem;
  font: 600 .95rem/1.3 var(--text);
}

.obsah-md p { margin: 0 0 .8rem; line-height: 1.6; }
.obsah-md ul, .obsah-md ol { margin: 0 0 .9rem; padding-left: 1.4rem; line-height: 1.6; }
.obsah-md li { margin: .15rem 0; }
.obsah-md a { color: var(--odkaz); overflow-wrap: anywhere; }

.obsah-md hr {
  margin: 1.8rem 0;
  border: 0;
  border-top: 1px solid var(--lajna);
}

.obsah-md code {
  padding: .05rem .3rem;
  background: var(--papir-2);
  border-radius: 2px;
  font: 500 .95em var(--data);
}

/* Zvýrazněné upozornění (> v souboru). */
.obsah-md blockquote {
  margin: .8rem 0 1rem;
  padding: .6rem .9rem;
  background: var(--karta);
  border-left: 4px solid var(--lajna-silna);
}
.obsah-md blockquote p:last-child { margin-bottom: 0; }

/* Tabulka se na úzkém displeji posouvá do stran, stránka ne. */
.obsah-md__tabulka { overflow-x: auto; margin: .4rem 0 1.1rem; }
.obsah-md table {
  width: 100%;
  border-collapse: collapse;
  background: var(--karta);
  font-size: .95rem;
}
.obsah-md th, .obsah-md td {
  padding: .45rem .7rem;
  border-bottom: 1px solid var(--lajna);
  text-align: left;
  vertical-align: top;
}
.obsah-md th {
  font: 600 .78rem/1.3 var(--text);
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--inkoust-2);
  border-bottom: 2px solid var(--lajna-silna);
}

/* ------------------------------------------------ editor informací oblasti */

.editor { max-width: 60rem; }
.editor__lista { display: flex; flex-wrap: wrap; gap: .3rem; margin-bottom: .5rem; }
.editor__pole { display: block; }
.editor__pole textarea {
  display: block;
  width: 100%;
  min-height: 24rem;
  margin-top: .3rem;
  padding: .7rem .8rem;
  font: 400 .92rem/1.55 var(--data);
  color: var(--inkoust);
  background: var(--karta);
  border: 1px solid var(--lajna-silna);
  resize: vertical;
  box-sizing: border-box;
}
.editor__akce { display: flex; flex-wrap: wrap; gap: .5rem; margin: .8rem 0 1rem; }
.editor__napoveda, .editor__zalohy { max-width: 60rem; margin: 1rem 0; }
.editor__napoveda summary, .editor__zalohy summary { cursor: pointer; font-weight: 600; }
.editor__napoveda ul, .editor__zalohy ol { margin: .5rem 0 0; padding-left: 1.3rem; line-height: 1.7; }
.editor__nahled {
  padding: .4rem 1.2rem 1rem;
  background: var(--papir-2);
  border: 1px dashed var(--lajna-silna);
}
.editor__odhlasit { margin: 2rem 0 0; }
.editor__hash { display: inline-block; margin-top: .3rem; overflow-wrap: anywhere; }

.hlaska--ok { border-left-color: #2e7d4f; }

/* ------------------------------------------------------ celostátní ligy */

.liga__nazev {
  margin: 2rem 0 .6rem;
  font: 700 clamp(1.1rem, 3vw, 1.4rem)/1.2 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .02em;
}

/* Vysvětlení zvýraznění – bez něj není poznat, proč jsou některé řádky tučné. */
.liga__legenda {
  margin: .4rem 0 1rem;
  font: 400 .85rem/1.5 var(--text);
  color: var(--inkoust-2);
}

/* Forma za celou sezónu na stránce Liga. Vlastní třídy, protože obdobný
   přehled u oblastních tabulek má jiné rozvržení. */
.liga-forma {
  list-style: none;
  margin: 0 0 1.6rem;
  padding: 0;
  background: var(--karta);
  border: 1px solid var(--lajna);
}

.liga-forma__radek {
  display: grid;
  grid-template-columns: 2.4rem minmax(0, 1fr) auto;
  align-items: center;
  gap: .2rem .7rem;
  padding: .4rem .6rem;
  border-bottom: 1px solid var(--lajna);
}
.liga-forma__radek:last-child { border-bottom: 0; }
.liga-forma__radek--nas { background: var(--papir-2); }
.liga-forma__radek--nas .liga-forma__tym { font-weight: 700; }

.liga-forma__misto { font: 400 .85rem var(--data); color: var(--inkoust-2); text-align: right; }
.liga-forma__tym { min-width: 0; }
.liga-forma__znacky { justify-self: end; }
.liga-forma__znacky .forma { flex-wrap: wrap; justify-content: flex-end; }

/* Na úzkém displeji se značky zalomí pod název, ať se nemačkají. */
@media (max-width: 34em) {
  .liga-forma__radek { grid-template-columns: 2.4rem minmax(0, 1fr); }
  .liga-forma__znacky { grid-column: 2; justify-self: start; }
  .liga-forma__znacky .forma { justify-content: flex-start; }
}

.liga__popis { margin: 0 0 .7rem; font-size: .9rem; color: var(--inkoust-2); }

.liga-kolo { margin-bottom: 1.4rem; }

.liga-kolo__nazev {
  display: flex;
  align-items: baseline;
  gap: .6rem;
  margin: 0 0 .3rem;
  padding-bottom: .2rem;
  border-bottom: 1px solid var(--lajna-silna);
  font: 700 .95rem/1.2 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .03em;
}
.liga-kolo__datum {
  margin-left: auto;
  font: 400 .8rem var(--data);
  text-transform: none;
  letter-spacing: 0;
  color: var(--inkoust-2);
}

.liga-zapasy { list-style: none; margin: 0; padding: 0; }

.liga-zapas {
  display: grid;
  grid-template-columns: 9.5rem minmax(0, 1fr) 4.5rem 6rem;
  align-items: baseline;
  gap: .2rem .8rem;
  padding: .3rem 0;
  border-bottom: 1px solid var(--lajna);
}
.liga-zapas--dnes { background: var(--papir-2); }

.liga-zapas__kdy { font: 400 .82rem/1.4 var(--data); color: var(--inkoust-2); }
.liga-zapas__tymy { min-width: 0; }
.liga-zapas__tymy--nas { font-weight: 600; }
.liga-zapas__skore { font: 700 .95rem/1.4 var(--data); text-align: right; }
.liga-zapas__cislo {
  font: 400 .78rem/1.4 var(--data);
  color: var(--inkoust-2);
  text-align: right;
  white-space: nowrap;
}

/* Družstvo z naší oblasti se v tabulce zvýrazní – je to první, co člověk hledá. */
.poradi__radek--nas { background: var(--papir-2); }
.poradi__radek--nas .poradi__tym { font-weight: 700; }

@media (max-width: 40rem) {
  .liga-zapas {
    grid-template-columns: minmax(0, 1fr) 4rem;
    grid-template-areas:
      "kdy    skore"
      "tymy   skore"
      "cislo  skore";
  }
  .liga-zapas__kdy { grid-area: kdy; }
  .liga-zapas__tymy { grid-area: tymy; }
  .liga-zapas__skore { grid-area: skore; align-self: center; }
  .liga-zapas__cislo { grid-area: cislo; text-align: left; }
}

/* -------------------------------------------------------- rozpis hřiště */

.filtry--hriste { margin-bottom: 1.4rem; }

/* Přepínač období z odkazů. Nedědí z .prepinac, protože ten je navržený pro
   formulářové prvky a roztáhl by se přes celou šířku. Odsazení dole ho odděluje
   od souhrnu, aby se texty nedotýkaly. */
.prepinac-odkazy {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin: 0 0 1rem;
}

.hriste-souhrn {
  margin: 0 0 1.2rem;
  font: 400 .88rem/1.5 var(--data);
  color: var(--inkoust-2);
}

.hriste-den { margin-bottom: 1.6rem; }
.hriste-den--minuly { opacity: .72; }

.hriste-den__nazev {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: .4rem .8rem;
  margin: 0 0 .3rem;
  padding-bottom: .25rem;
  border-bottom: 2px solid var(--inkoust);
  font: 700 clamp(.95rem, 2.4vw, 1.1rem)/1.2 var(--titulky);
}

.hriste-den__pocet {
  font: 400 .78rem/1.4 var(--data);
  color: var(--inkoust-2);
}

.hriste-zapasy { list-style: none; margin: 0; padding: 0; }

.hriste-zapas {
  display: grid;
  grid-template-columns: 3.4rem 9rem minmax(0, 1fr) 3.4rem 6rem;
  align-items: baseline;
  gap: .2rem .7rem;
  padding: .4rem .5rem;
  border-bottom: 1px solid var(--lajna);
  border-left: 3px solid var(--barva, var(--lajna-silna));
  background: var(--karta);
}
.hriste-zapas[hidden] { display: none; }

.hriste-zapas__cas { font: 400 .86rem/1.4 var(--data); }
.hriste-zapas__soutez {
  font: 600 .7rem/1.5 var(--text);
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--barva, var(--inkoust-2));
  overflow-wrap: anywhere;
}
.hriste-zapas__utkani { font-size: .95rem; }
.hriste-zapas__skore {
  font: 700 .9rem/1.4 var(--data);
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.hriste-zapas__cislo {
  font: 400 .74rem/1.5 var(--data);
  color: var(--inkoust-2);
  text-align: right;
}

/* Ligová utkání – jiný podklad, ať je poznat, že nejsou z našeho rozpisu. */
.hriste-zapas--liga {
  background: var(--liga-podklad);
  border-left-color: var(--plocha);
}
.hriste-zapas--liga .hriste-zapas__soutez { color: var(--odkaz); }

/* Delší pauza mezi utkáními – kdy je hřiště volné. */
.hriste-pauza {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .15rem .5rem;
  font: 400 .72rem/1.5 var(--data);
  color: var(--inkoust-2);
}
.hriste-pauza::before,
.hriste-pauza::after {
  content: "";
  flex: 1;
  border-top: 1px dashed var(--lajna-silna);
}

@media (max-width: 46rem) {
  .hriste-zapas {
    grid-template-columns: 3.2rem minmax(0, 1fr) auto;
    grid-template-areas:
      "cas utkani utkani"
      "cas soutez skore"
      "cas cislo  cislo";
  }
  .hriste-zapas__cas    { grid-area: cas; }
  .hriste-zapas__soutez { grid-area: soutez; }
  .hriste-zapas__utkani { grid-area: utkani; }
  .hriste-zapas__skore  { grid-area: skore; }
  .hriste-zapas__cislo  { grid-area: cislo; text-align: left; }
}

/* ------------------------------------------------------ změny termínů */

/* Posun času v rámci dne je drobnější zpráva než přeložení na jiný den,
   proto má klidnější barvu. */
.zapas__prelozeno--cas {
  background: var(--papir-2);
  border-color: var(--lajna-silna);
  color: var(--inkoust-2);
}

.zmena__den { margin-right: .4rem; color: var(--inkoust-2); }

.zmena__druh {
  font-weight: 600;
  color: var(--inkoust-2);
  text-transform: uppercase;
  font-size: .92em;
  letter-spacing: .03em;
}
.zmena--cas .zmena__druh { font-weight: 400; }

.zapas__prelozeno {
  grid-area: podrobnosti;
  justify-self: start;
  padding: .05rem .35rem;
  background: var(--okr-svetly, #f6ecd9);
  border: 1px solid var(--okr);
  border-radius: 2px;
  font: 600 .66rem/1.5 var(--text);
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--okr-tmavy, #8a5a12);
  cursor: help;
}

.zmeny {
  margin-top: 2.2rem;
  padding-top: 1.2rem;
  border-top: 2px solid var(--inkoust);
}

.zmeny__nazev {
  margin: 0 0 .2rem;
  font: 700 clamp(1.05rem, 2.8vw, 1.25rem)/1.15 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .02em;
}

.zmeny__popis {
  margin: 0 0 1rem;
  font-size: .86rem;
  color: var(--inkoust-2);
}

.zmeny__seznam { list-style: none; margin: 0; padding: 0; display: grid; gap: .1rem; }

/* display: grid by přebilo atribut hidden, proto výslovné skrytí. */
.zmena[hidden] { display: none; }

.zmena {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .15rem .9rem;
  padding: .5rem .6rem;
  background: var(--karta);
  border-left: 3px solid var(--okr);
}

.zmena__kdo { font-size: .95rem; }
.zmena__kat {
  margin-right: .4rem;
  font: 600 .68rem/1.5 var(--text);
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--barva, var(--inkoust-2));
}

.zmena__termin {
  grid-row: 1;
  grid-column: 2;
  font: 400 .88rem/1.4 var(--data);
  white-space: nowrap;
}
.zmena__puvodni { color: var(--inkoust-2); text-decoration: line-through; }
.zmena__sipka { margin: 0 .25rem; color: var(--inkoust-2); }
.zmena__novy { color: var(--travnik); }

.zmena__cislo {
  grid-column: 1 / -1;
  font: 400 .76rem/1.4 var(--data);
  color: var(--inkoust-2);
}

@media (max-width: 46rem) {
  .zmena { grid-template-columns: minmax(0, 1fr); }
  .zmena__termin { grid-row: auto; grid-column: 1; white-space: normal; }
}

/* --------------------------------------------------------- zpravodaje */

.dokumenty { margin-bottom: 2rem; }

.dokumenty__nazev {
  margin: 0 0 .2rem;
  padding-bottom: .3rem;
  border-bottom: 2px solid var(--inkoust);
  font: 700 clamp(1.05rem, 2.8vw, 1.25rem)/1.15 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .02em;
}

.dokumenty__popis {
  margin: .4rem 0 .2rem;
  font-size: .88rem;
  color: var(--inkoust-2);
}

.zpravodaje { list-style: none; margin: 0 0 1.2rem; padding: 0; }

.zpravodaj {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: baseline;
  gap: .3rem .9rem;
  padding: .6rem .7rem .6rem .6rem;
  border-bottom: 1px solid var(--lajna);
  border-left: 3px solid var(--travnik);
  background: var(--karta);
}
.zpravodaj:hover { background: var(--papir-2); }
.zpravodaj--nejnovejsi { border-left-color: var(--okr); }

.zpravodaj__nazev {
  font: 500 1rem/1.35 var(--text);
  color: var(--inkoust);
  text-decoration: none;
}
.zpravodaj__nazev:hover { color: var(--travnik); text-decoration: underline; }

.zpravodaj__typ {
  display: inline-block;
  margin-inline-start: .5em;
  padding: .05em .4em .1em;
  border: 1px solid var(--lajna-silna);
  font: 600 .62rem/1.5 var(--data);
  letter-spacing: .08em;
  color: var(--inkoust-2);
  vertical-align: .12em;
}

.zpravodaj__datum {
  font: 400 .82rem/1.4 var(--data);
  color: var(--inkoust-2);
  white-space: nowrap;
}

.zpravodaj__odznak {
  margin-inline-start: .5em;
  padding: .08em .45em .12em;
  background: var(--okr-svetly);
  color: var(--inkoust);
  font: 600 .62rem/1.5 var(--text);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.zpravodaj__stahnout {
  font: 500 .84rem/1.2 var(--text);
  padding: .28rem .6rem;
  border: 1px solid var(--lajna-silna);
  background: var(--papir-2);
  color: var(--inkoust);
  text-decoration: none;
  white-space: nowrap;
}
.zpravodaj__stahnout:hover { background: var(--plocha); border-color: var(--plocha); color: var(--na-plose); }

.zpravodaje__poznamka {
  font-size: .86rem;
  color: var(--inkoust-2);
  line-height: 1.5;
}

@media (max-width: 46rem) {
  .zpravodaj {
    grid-template-columns: minmax(0, 1fr) auto;
    row-gap: .35rem;
  }
  .zpravodaj__nazev { grid-column: 1 / -1; }
}

/* ------------------------------------------------------- kalendář akcí */

.akce { margin-bottom: 2.2rem; }

.akce__nazev {
  margin: 0 0 .6rem;
  padding-bottom: .3rem;
  border-bottom: 2px solid var(--inkoust);
  font: 700 clamp(1.05rem, 3vw, 1.3rem)/1.15 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .01em;
}

.akce__seznam { list-style: none; margin: 0; padding: 0; }

.akce__polozka {
  display: grid;
  grid-template-columns: 9.5rem minmax(0, 1fr);
  gap: .2rem .9rem;
  align-items: baseline;
  padding: .5rem .6rem .5rem .55rem;
  border-bottom: 1px solid var(--lajna);
  border-left: 3px solid var(--travnik);
  background: var(--karta);
}
.akce__polozka:hover { background: var(--papir-2); }

.akce__polozka--minula { opacity: .6; border-left-color: var(--lajna-silna); }
.akce__polozka--dnes { border-left-color: var(--okr); background: var(--okr-svetly); }

.akce__datum {
  display: flex;
  align-items: baseline;
  gap: .45em;
  font: 500 .88rem/1.4 var(--data);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.akce__dow {
  font: 600 .68rem/1.5 var(--text);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--travnik);
}
.akce__polozka--minula .akce__dow { color: var(--inkoust-2); }

/* Odkaz v popisu akce – ať je poznat, že se dá klepnout. */
.odkaz-akce {
  color: var(--odkaz);
  text-decoration: underline;
  text-underline-offset: .15em;
}
.odkaz-akce:hover { text-decoration-thickness: 2px; }

.akce__popis { line-height: 1.45; }

.akce__poznamka {
  margin-top: 1.6rem;
  padding-top: .9rem;
  border-top: 1px solid var(--lajna);
  font-size: .86rem;
  color: var(--inkoust-2);
}

@media (max-width: 46rem) {
  .akce__polozka {
    grid-template-columns: minmax(0, 1fr);
    row-gap: .1rem;
  }
  /* Odkaz v popisu akce – ať je poznat, že se dá klepnout. */
.odkaz-akce {
  color: var(--odkaz);
  text-decoration: underline;
  text-underline-offset: .15em;
}
.odkaz-akce:hover { text-decoration-thickness: 2px; }

.akce__popis { font-size: .92rem; }
}

/* -------------------------------------------------- statistika střelců */

/* --------------------------------------------- rozšířená statistika */

.pohledy { margin-bottom: 1.2rem; }

.kotvy--listy { margin-bottom: 1.2rem; }
.kotvy--listy .kotvy__vybrany {
  background: var(--travnik);
  color: var(--na-plose);
  border-color: var(--travnik);
}

.list { margin-bottom: 2rem; }

/* Rozšířená data mají hodně sloupců, proto smí vystoupit z obsahové šířky
   a roztáhnout se přes 80 % okna – rolování do strany je tak potřeba míň. */
@media (min-width: 62rem) {
  .list--siroky {
    width: 92vw;
    max-width: 92vw;
    margin-left: calc(50% - 46vw);
    margin-right: calc(50% - 46vw);
  }
}

/* Na širokých monitorech stačí 80 % okna, jak bylo domluveno; na užších se
   plocha rozšíří, aby se tabulka vešla bez rolování. */
@media (min-width: 100rem) {
  .list--siroky {
    width: 80vw;
    max-width: 80vw;
    margin-left: calc(50% - 40vw);
    margin-right: calc(50% - 40vw);
  }
}

.list__nazev {
  margin: 0 0 .2rem;
  padding-bottom: .3rem;
  border-bottom: 2px solid var(--inkoust);
  font: 700 clamp(1.05rem, 2.8vw, 1.3rem)/1.15 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .02em;
}

.list__souhrn {
  margin: .3rem 0 .8rem;
  font: 400 .84rem/1.4 var(--data);
  color: var(--inkoust-2);
}

.list__hledat {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .7rem;
  margin: 0 0 .8rem;
}
.list__hledat label {
  font: 600 .7rem/1.3 var(--text);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--inkoust-2);
}
.list__hledat input {
  flex: 1 1 16rem;
  padding: .45rem .6rem;
  border: 1px solid var(--lajna-silna);
  background: var(--karta);
  font: 400 .92rem/1.3 var(--text);
}
.list__stav { font: 400 .82rem/1.3 var(--data); color: var(--inkoust-2); }

.list__tabulka {
  width: 100%;
  border-collapse: collapse;
  background: var(--karta);
  font-size: .8rem;
}
.list__tabulka th,
.list__tabulka td {
  padding: .28rem .4rem;
  border-bottom: 1px solid var(--lajna);
  text-align: left;
  vertical-align: top;
  white-space: nowrap;
}
.list__tabulka thead th {
  position: sticky;
  top: 0;
  background: var(--papir-2);
  border-bottom: 1px solid var(--lajna-silna);
  font: 600 .7rem/1.3 var(--text);
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--inkoust-2);
}
.list__cislo {
  font: 400 .78rem/1.4 var(--data);
  color: var(--inkoust-2);
  text-align: right;
}
.list__hodnota { font-variant-numeric: tabular-nums; text-align: right; }

.strankovani {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .6rem .9rem;
  margin-top: .9rem;
}
.strankovani__stav { font: 400 .84rem/1.3 var(--data); color: var(--inkoust-2); }

/* Odkaz na sešit nad souhrnem – tlačítko a vedle něj vysvětlení. */
.statistika__sesit {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem .9rem;
  margin: 1rem 0 0;
}
.statistika__sesit span {
  font-size: .86rem;
  color: var(--inkoust-2);
}

.cisla--statistika {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr));
  gap: .1rem;
  list-style: none;
  margin: 1rem 0 1.6rem;
  padding: 0;
}
.cisla--statistika .cislo {
  padding: .7rem .8rem;
  background: var(--karta);
  border-left: 3px solid var(--travnik);
}
.cisla--statistika .cislo__hodnota {
  display: block;
  font: 700 1.5rem/1.1 var(--data);
  font-variant-numeric: tabular-nums;
}
.cisla--statistika .cislo__popis {
  display: block;
  margin-top: .15rem;
  font-size: .8rem;
  color: var(--inkoust-2);
}

.statistika { margin-bottom: 2.4rem; }

.statistika__nazev {
  margin: 0 0 .2rem;
  padding-bottom: .3rem;
  border-bottom: 2px solid var(--barva, var(--inkoust));
  font: 700 clamp(1.1rem, 3vw, 1.4rem)/1.15 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .01em;
  color: var(--barva, var(--inkoust));
}

.statistika__souhrn {
  margin: .3rem 0 .6rem;
  font: 400 .84rem/1.4 var(--data);
  color: var(--inkoust-2);
}

.statistika__podnazev {
  margin: 1.2rem 0 .4rem;
  font: 600 .78rem/1.3 var(--text);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--inkoust-2);
}

/* Šířky sloupců: jméno dostane zbytek místa, ostatní jen co potřebují –
   bez toho se název družstva láme po jednotlivých slovech. */
.strelci { table-layout: auto; }
.strelci .poradi__misto { width: 2.6rem; }
.strelci .poradi__tym { width: auto; }
.strelci__druzstvo {
  width: 1%;
  white-space: nowrap;
  color: var(--inkoust-2);
  font-size: .9rem;
}
.strelci .strelci__mimo { width: 3.4rem; }
.strelci .poradi__body { width: 4rem; }
.strelci__mimo {
  text-align: right;
  font: 400 .82rem/1.4 var(--data);
  color: var(--inkoust-2);
  white-space: nowrap;
}
.strelci__radek--prvni .poradi__tym,
.strelci__radek--prvni .poradi__body { font-weight: 700; }
.strelci__radek--prvni .poradi__misto { color: var(--okr); font-weight: 700; }

.statistika__vice { margin-top: .6rem; }

.druzstva-branky { list-style: none; margin: 0; padding: 0; display: grid; gap: .1rem; }

.druzstva-branky__radek {
  display: grid;
  grid-template-columns: minmax(0, 22rem) minmax(0, 1fr) auto;
  align-items: baseline;
  gap: .2rem .8rem;
  padding: .35rem .5rem .35rem .1rem;
  border-bottom: 1px solid var(--lajna);
  background: var(--karta);
}

.druzstva-branky__tym { font-size: .92rem; }
.druzstva-branky__tym a { color: inherit; text-decoration: none; border-bottom: 1px dotted var(--lajna-silna); }
.druzstva-branky__tym a:hover { color: var(--travnik); border-bottom-color: var(--travnik); }
.druzstva-branky__strelci { font-size: .82rem; color: var(--inkoust-2); }
.druzstva-branky__pocet { font: 600 .95rem/1.3 var(--data); font-variant-numeric: tabular-nums; }

.statistika__poznamka {
  margin-top: 1.6rem;
  padding-top: .9rem;
  border-top: 1px solid var(--lajna);
  font-size: .86rem;
  color: var(--inkoust-2);
}

@media (max-width: 46rem) {
  .strelci__druzstvo { display: none; }   /* jméno a branky mají přednost */
  .druzstva-branky__radek {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .druzstva-branky__strelci { grid-column: 1 / -1; }
}

/* --------------------------------------------------------- oddíly a hřiště */

/* Oddíly jsou rozdělené po oblastech; nadpis drží obě části pohromadě. */
.hriste__oblast { margin-bottom: 2rem; }
.hriste__oblast[hidden] { display: none; }

.hriste__nadpis {
  margin: 0 0 .2rem;
  padding-bottom: .3rem;
  border-bottom: 2px solid var(--inkoust);
  font: 700 clamp(1.05rem, 2.8vw, 1.25rem)/1.15 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .02em;
}

.hriste {
  list-style: none;
  margin: 1rem 0 1.4rem;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(19rem, 1fr));
  gap: .9rem;
}

.hriste__polozka {
  padding: .8rem .9rem .9rem;
  background: var(--karta);
  border-left: 3px solid var(--travnik);
}
.hriste__polozka[hidden] { display: none; }

/* Logo vedle názvu oddílu. Výška je pevná, šířka se dopočítá – loga mají různý
   poměr stran a stlačovat je na čtverec by je zdeformovalo. */
.hriste__logo {
  width: auto;
  height: 2.4rem;
  max-width: 4.5rem;
  object-fit: contain;
  flex: none;
}

.mapa__logo {
  display: block;
  height: 2.2rem;
  width: auto;
  max-width: 4rem;
  object-fit: contain;
  margin-bottom: .3rem;
}

.hriste__nazev {
  display: flex;
  align-items: center;
  gap: .6rem;
  margin: 0 0 .3rem;
  font: 700 1.05rem/1.2 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .01em;
}

.hriste__adresa { margin: 0 0 .6rem; font-size: .92rem; }
.hriste__adresa a { color: var(--odkaz); }

.hriste__udaje { margin: 0; display: grid; gap: .15rem; }
.hriste__udaje > div {
  display: grid;
  grid-template-columns: 9rem minmax(0, 1fr);
  gap: .3rem .6rem;
  padding: .22rem 0;
  border-top: 1px solid var(--lajna);
}
.hriste__udaje dt {
  font: 600 .68rem/1.6 var(--text);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--inkoust-2);
}
.hriste__udaje dd { margin: 0; font-size: .9rem; line-height: 1.4; }

.hriste__poznamka {
  margin-top: 1.4rem;
  padding-top: .9rem;
  border-top: 1px solid var(--lajna);
  font-size: .86rem;
  color: var(--inkoust-2);
}

@media (max-width: 46rem) {
  .hriste { grid-template-columns: minmax(0, 1fr); }
  .hriste__udaje > div { grid-template-columns: 8rem minmax(0, 1fr); }
}

/* ---------------------------------------------------------- mapa hřišť */

.mapa {
  margin-top: 2rem;
  padding-top: 1.2rem;
  border-top: 2px solid var(--inkoust);
}

.mapa__nazev {
  margin: 0 0 .2rem;
  font: 700 clamp(1.05rem, 2.8vw, 1.25rem)/1.15 var(--titulky);
  text-transform: uppercase;
  letter-spacing: .02em;
}

.mapa__popis {
  margin: 0 0 .8rem;
  font-size: .86rem;
  color: var(--inkoust-2);
}

.mapa__platno {
  height: 30rem;
  max-height: 70vh;
  border: 1px solid var(--lajna-silna);
  background: var(--karta);
}

/* Kolečko místo výchozího špendlíku – drží barvy webu. */
.mapa__znacka span {
  display: block;
  width: 18px;
  height: 18px;
  border: 2px solid var(--papir-2);
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .35);
}

.mapa__udaj { color: #5c6055; font-size: .86em; }

.leaflet-popup-content { font: 400 .9rem/1.45 var(--text); }
.leaflet-popup-content strong { font-family: var(--text); }
.leaflet-container { font-family: var(--text); }

@media (max-width: 46rem) {
  .mapa__platno { height: 24rem; }
}

/* ------------------------------------------------------------- kontakty */

.odhlasit { color: rgba(247, 248, 242, .85); }
.odhlasit:hover { color: var(--hlavicka-text); }

.prihlaseni {
  max-width: 30rem;
  margin: 2rem 0;
  padding: 1.4rem 1.5rem 1.6rem;
  background: var(--karta);
  border-left: 3px solid var(--travnik);
}

.prihlaseni__nazev {
  margin: 0 0 .5rem;
  font: 700 clamp(1.1rem, 3vw, 1.4rem)/1.15 var(--titulky);
  text-transform: uppercase;
}

.prihlaseni__popis { margin: 0 0 1rem; color: var(--inkoust-2); font-size: .92rem; }

.prihlaseni__formular { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.prihlaseni__formular input[type="password"] {
  font: 400 .95rem/1.2 var(--text);
  padding: .42rem .55rem;
  border: 1px solid var(--lajna-silna);
  background: var(--papir-2);
}

.filtry--kontakty { position: static; backdrop-filter: none; background: none; }

/* Tabulka kontaktů se roztáhne přes celou šířku okna, ne jen přes obsahový
   sloupec – u Oddílů je jedenáct sloupců a v užším prostoru se špatně ovládá. */
.kontakty__obal {
  width: 100vw;
  margin-inline: calc(50% - 50vw);
  padding-inline: clamp(.8rem, 2.5vw, 1.4rem);
  overflow-x: auto;
  overscroll-behavior-x: contain;
}

/* Tabulka, která se ani přes celou šířku okna nevejde, dostane vlastní okno
   s rolováním – vodorovný posuvník je pak po ruce, ne až pod celou tabulkou.
   Třídu přidává skript jen tehdy, když je potřeba; jinak stránka roluje běžně. */
.kontakty__obal--siroka {
  max-height: calc(100vh - 5rem);
  overflow: auto;
}

.kontakty {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: var(--karta);
  font-size: .88rem;
}

.kontakty th,
.kontakty td {
  padding: .42rem .5rem;
  border-bottom: 1px solid var(--lajna);
  text-align: left;
  vertical-align: baseline;
}

.kontakty thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--papir);
  font: 600 .7rem/1.25 var(--text);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--inkoust-2);
  border-bottom: 1px solid var(--lajna-silna);
  white-space: nowrap;
}

/* Sloupec s oddílem zůstane vidět i po odrolování doprava, jinak by nebylo
   poznat, ke komu řádek patří. */
.kontakty th:first-child,
.kontakty td:first-child {
  position: sticky;
  left: 0;
  z-index: 1;
  background: var(--karta);
  box-shadow: 1px 0 0 var(--lajna);
}
.kontakty thead th:first-child { z-index: 3; background: var(--papir); }
.kontakty tbody tr:hover td:first-child { background: var(--papir-2); }

.kontakty tbody tr:hover { background: var(--papir-2); }
/* Telefon ani e-mail se nemá lámat uprostřed. */
.kontakty td[data-sloupec*="Mobil"],
.kontakty td[data-sloupec*="Telefon"] { white-space: nowrap; }
.kontakty td[data-sloupec="Oddíl"] { white-space: nowrap; }
.kontakty tr[hidden] { display: none; }
.kontakty a { color: var(--odkaz); }
.kontakty__prazdno,
.kontakt__prazdno { color: var(--inkoust-2); opacity: .5; }
.kontakt__ano { font-weight: 600; color: var(--travnik); }

/* Na úzkém displeji se tabulka rozpadne na kartičky, ať se nemusí rolovat do stran. */
@media (max-width: 46rem) {
  .kontakty__obal {
    width: auto;
    margin-inline: 0;
    padding-inline: 0;
    overflow-x: visible;
  }

  .kontakty thead { display: none; }
  .kontakty td:first-child { position: static; box-shadow: none; background: none; }
  .kontakty,
  .kontakty tbody,
  .kontakty tr,
  .kontakty td { display: block; width: 100%; }

  .kontakty tr {
    margin-bottom: .7rem;
    padding: .5rem .6rem .6rem;
    background: var(--karta);
    border-left: 3px solid var(--travnik);
  }

  .kontakty td {
    display: grid;
    grid-template-columns: 7.5rem minmax(0, 1fr);
    gap: .5rem;
    padding: .18rem 0;
    border: 0;
  }
  .kontakty td::before {
    content: attr(data-sloupec);
    font: 600 .68rem/1.5 var(--text);
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--inkoust-2);
  }
}

/* ------------------------------------------------------ zpět na začátek */

.nahoru {
  position: fixed;
  right: clamp(.7rem, 2.5vw, 1.4rem);
  bottom: calc(clamp(.7rem, 2.5vw, 1.4rem) + env(safe-area-inset-bottom, 0px));
  z-index: 30;

  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.9rem;
  height: 2.9rem;

  background: var(--plocha);
  color: var(--na-plose);
  border: 1px solid var(--plocha);
  text-decoration: none;
  font-size: 1.15rem;
  line-height: 1;

  box-shadow: 0 2px 10px rgba(19, 29, 23, .22);
  transition: opacity .18s ease, transform .18s ease, background-color .15s ease;
}

.nahoru:hover { background: var(--travnik); border-color: var(--travnik); }
.nahoru:active { transform: translateY(1px); }

/* Bez JavaScriptu je odkaz vidět pořád, s ním se objeví až po odrolování. */
.js .nahoru {
  opacity: 0;
  visibility: hidden;
  transform: translateY(.5rem);
}

.js .nahoru--videt {
  opacity: 1;
  visibility: visible;
  transform: none;
}

/* Telefon na šířku: displej je široký, ale nízký. Filtry i záhlaví by zabraly
   celou obrazovku, proto se srazí – rozhoduje výška, ne šířka. */
@media (max-height: 30rem) and (orientation: landscape) {
  /* Záhlaví na jeden řádek: menší logo, menší nadpis, méně odsazení. */
  .hlavicka { padding: .5rem 0; }
  .hlavicka__obal { align-items: center; gap: .8rem; }
  .hlavicka__logo { height: 2.6rem; }
  .znacka { font-size: clamp(1.4rem, 4vw, 2rem); }
  .nadtitulek { font-size: .7rem; margin-bottom: .1rem; }
  .sezona { margin-top: .2rem; font-size: .8rem; }
  .sezony { margin-top: .4rem; }

  /* Blok s nejbližším hracím dnem je na výšku obrazovky moc velký. */
  .dalsi { padding: .6rem 0; }
  .dalsi__datum { font-size: clamp(1.6rem, 5vw, 2.4rem); }
  .dalsi__popis { font-size: .7rem; }

  .filtry { display: flex; flex-direction: column; position: static; }
  .filtry__lista { order: -1; }

  .js .tlacitko--filtr { display: inline-block; }
  .js .filtry--otevreno .tlacitko--filtr {
    background: var(--plocha);
    border-color: var(--plocha);
    color: var(--na-plose);
  }
  .js .filtry__panel { display: none; }
  .js .filtry--otevreno .filtry__panel { display: grid; }
}

@media print {
  .nahoru { display: none; }
}

/* ---------------------------------------------------------------- mobil */

@media (max-width: 46rem) {
  .obal { width: min(100% - 1.6rem, var(--sirka)); }

  /* Šipka „nahoru“ je ukotvená k oknu – patička jí uhne, ať nepřekrývá podpis. */
  .paticka { padding-bottom: 4.4rem; }

  /* Název utkání dostane celou šířku, aby se dlouhé názvy oddílů nelámaly po
     slabikách; rozhodčí a poznámka mají vlastní řádek pod skóre. */
  /* Stejná specificita jako pravidla pro rozpis výše, jinak by je nepřebila
     a pevné šířky by na úzkém displeji nutily rolovat do stran. */
  .zapasy,
  .seznam .zapasy,
  .zobrazeni-jednoduche .zapasy,
  .zobrazeni-jednoduche .seznam .zapasy { grid-template-columns: 3.4rem minmax(0, 1fr) auto; }

  /* Skóre stojí vpravo vedle kategorie – stejně jako v jednoduchém zobrazení,
     aby při přepnutí neuskakovalo. Podrobnosti se řadí pod to. */
  .zapas {
    grid-template-columns: subgrid;
    grid-template-areas:
      "cas utkani      utkani"
      "cas kat         skore"
      "cas meta        meta"
      "cas rozhodci    rozhodci"
      "cas podrobnosti podrobnosti"
      "zapis zapis     zapis";
    row-gap: .12rem;
    padding-block: .5rem;
  }

  .zapas__rozhodci { font-size: .74rem; white-space: normal; }

  .zobrazeni-jednoduche .zapasy {
    grid-template-columns: 3.4rem minmax(0, 1fr) auto;
  }
  .zobrazeni-jednoduche .zapas {
    grid-template-areas:
      "cas utkani utkani"
      "cas kat    skore"
      "cas prelozeno prelozeno";
  }
  /* Na úzkém displeji má značka vlastní řádek – vedle názvu by ho překryla. */
  .zobrazeni-jednoduche .zapas__prelozeno {
    grid-area: prelozeno;
    justify-self: start;
  }

  .zapas__utkani { display: block; }
  .zapas__vs { padding-inline: .15em; }
  .zapas__meta { font-size: .72rem; text-align: left; }
  .zapas__kategorie { font-size: .68rem; }

  .pas__dny { height: 4.2rem; gap: 1px; }
  .pas__prestavka span { font-size: .55rem; }
  .pas__vysvetleni { display: none; }

  /* Na malém displeji je málo místa, filtry proto s obsahem odrolují pryč
     a nezabírají část obrazovky trvale. Hlavičky dnů lepivé zůstávají – ty jsou
     úzké a při rolování dlouhým rozpisem se hodí vědět, který den se čte. */
  .filtry { display: flex; flex-direction: column; position: static; }
  .filtry__lista { order: -1; }
  .js .tlacitko--filtr { display: inline-block; }
  .js .filtry--otevreno .tlacitko--filtr {
    background: var(--plocha);
    border-color: var(--plocha);
    color: var(--na-plose);
  }
  .js .filtry__panel { display: none; }
  .js .filtry--otevreno .filtry__panel { display: grid; }

  .filtry__lista .filtry__stav { flex-basis: 100%; order: 3; }
  .filtry__lista [data-role="ical"],
  .filtry__lista [data-role="vycistit"] { font-size: .76rem; padding: .32rem .5rem; }

  .pole { flex-wrap: wrap; }
  .pole--hledat { flex-basis: 100%; }

  /* Na úzkém displeji ustoupí rozdíl skóre, zbytek tabulky zůstane čitelný. */
  .poradi { font-size: .82rem; }
  .poradi th, .poradi td { padding: .34rem .28rem; }
  .poradi__rozdil { display: none; }

  /* Na úzkém displeji se forma nevejde – tabulka by přetekla a člověk by ji
     musel hledat rolováním do strany. Ostatní sloupce jsou důležitější. */
  .poradi__forma { display: none; }

  .zapas__podrobnosti { font-size: .74rem; }
  .poradi__tym { font-size: .84rem; }
  .poradi__misto { width: 1.9rem; }
  .poradi__cislo { width: 1.6rem; }
  .poradi__skore { width: 3.9rem; font-size: .78rem; }

  .kalendar__bunka { min-height: 3.4rem; padding: .25rem .2rem .3rem; }
  .kalendar__cislo { font-size: .72rem; text-align: center; }
  .kalendar__pruh { height: 3px; }
}

/* Prohlížeče bez :has() – řádek se skóre se zalomí, ale zůstane čitelný. */
@media print {
  .filtry, .pas, .kalendar, .dalsi__odkaz { display: none; }
  body { background: #fff; }
  .hlavicka { background: #fff; color: #000; }
  .znacka__slovo--obrys { color: #000; -webkit-text-stroke: 0; }
  .zapas { break-inside: avoid; }
}

/* ------------------------------------------------------------------ Správa oblasti */
.sprava { list-style: none; margin: 1rem 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); }
.sprava__karta { padding: 1rem 1.1rem; background: var(--karta); border-left: 3px solid var(--travnik); }
.sprava__karta p { margin: .4rem 0 0; font-size: .94rem; }
.sprava__nazev { margin: 0; font: 600 1.25rem/1.2 var(--titulky); }
.sprava__nazev a { color: var(--inkoust); }
.sprava__nazev a:hover { color: var(--travnik); }
.sprava__stav { color: var(--inkoust-2); font: 400 .82rem/1.4 var(--data) !important; }

.drobecky { margin: .6rem 0 1rem; font-size: .9rem; color: var(--inkoust-2); }

.sprava-blok { margin: 1.6rem 0 2.2rem; }
.sprava-formular { display: flex; flex-wrap: wrap; gap: .8rem 1.2rem; align-items: flex-start; max-width: 60rem; }
.sprava-formular .editor__akce { flex-basis: 100%; margin: 0; }
.sprava-pole { display: flex; flex-direction: column; gap: .3rem; min-width: 0; }
.sprava-pole--siroke { flex: 1 1 100%; }
.sprava-pole[hidden] { display: none; }
.sprava-pole input[type="text"],
.sprava-pole input[type="date"],
.sprava-pole input[type="file"],
.sprava-pole select {
  font: 400 .92rem/1.3 var(--text);
  padding: .4rem .5rem;
  border: 1px solid var(--lajna-silna);
  background: var(--karta);
  color: inherit;
  border-radius: 0;
  max-width: 100%;
  box-sizing: border-box;
}
.sprava-pole--siroke input { width: 100%; }
.sprava-pole__napoveda { font-size: .82rem; color: var(--inkoust-2); }
.sprava-zaskrtavatko { flex-basis: 100%; display: flex; gap: .45rem; align-items: baseline; font-size: .94rem; }

.sprava-kapitoly { list-style: none; margin: 0 0 1rem; padding: 0; max-width: 60rem; }
.sprava-kapitola { padding: .55rem .7rem; border-bottom: 1px solid var(--lajna); border-left: 3px solid var(--travnik); background: var(--karta); }
.sprava-kapitola__hlava { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .9rem; }
.sprava-kapitola__nazev { font: 600 1rem/1.3 var(--text); color: var(--inkoust); }
.sprava-kapitola__info { flex: 1 1 auto; font: 400 .8rem/1.4 var(--data); color: var(--inkoust-2); }
.sprava-kapitola__posun { display: flex; gap: .25rem; }

.sprava-upravit { margin: .4rem 0 0; }
.sprava-upravit > summary { cursor: pointer; font-size: .86rem; color: var(--travnik); width: max-content; }
.sprava-upravit[open] > summary { margin-bottom: .7rem; }
.sprava-upravit > .sprava-formular { padding: .8rem .9rem; background: var(--papir-2); border: 1px dashed var(--lajna-silna); }
.sprava-blok > .sprava-upravit > summary { font-weight: 600; font-size: .95rem; }

.sprava-rocnik { margin: 1.1rem 0 .4rem; font: 600 .75rem/1 var(--text); letter-spacing: .1em; text-transform: uppercase; color: var(--inkoust-2); }
.sprava-soubory { list-style: none; margin: 0; padding: 0; max-width: 60rem; }
.sprava-soubor { padding: .5rem .7rem; border-bottom: 1px solid var(--lajna); border-left: 3px solid var(--travnik); background: var(--karta); }
.sprava-soubor--skryty { border-left-style: dashed; opacity: .75; }
.sprava-soubor__radek { display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem .6rem; }
.sprava-soubor__nazev { font: 500 .98rem/1.35 var(--text); color: var(--inkoust); overflow-wrap: anywhere; }
.sprava-soubor__radek .zpravodaj__typ { margin-inline-start: 0; }
.sprava-soubor__skryty { padding: .05em .45em; background: var(--okr-svetly); font: 600 .62rem/1.5 var(--text); letter-spacing: .08em; text-transform: uppercase; }
.sprava-soubor__info { margin-inline-start: auto; font: 400 .8rem/1.4 var(--data); color: var(--inkoust-2); }
.sprava-soubor__puvodni { flex-basis: 100%; margin: 0; font-size: .8rem; color: var(--inkoust-2); overflow-wrap: anywhere; }
.sprava-soubor__akce { display: flex; gap: .3rem; flex-basis: 100%; justify-content: flex-end; }

.tlacitko--male { padding: .22rem .5rem; font-size: .78rem; }
.tlacitko:disabled { opacity: .45; cursor: default; }
.tlacitko--nebezpecne { color: var(--chyba); border-color: rgba(168, 64, 44, .5); }
.tlacitko--nebezpecne:hover { background: #a8402c; border-color: #a8402c; color: #fff; }
.hlaska > p { margin: .2rem 0; }

.sprava-uvod { max-width: 60rem; margin: 0 0 1rem; font-size: .94rem; line-height: 1.55; }
.sprava-uvod code { font-family: var(--data); font-size: .88em; background: var(--papir-2); padding: 0 .25em; }
.editor__pole textarea.editor__kratky { min-height: 9rem; }
.sprava-pole--datum { margin-top: .8rem; max-width: 60rem; }
.sprava-pole--datum input { width: max-content; }
.sprava-problemy { list-style: none; margin: 0; padding: 0; max-width: 60rem; }
.sprava-problemy li { display: flex; flex-wrap: wrap; gap: .2rem .7rem; align-items: baseline; padding: .45rem .7rem; background: var(--karta); border-left: 3px solid #a8402c; border-bottom: 1px solid var(--lajna); }
.sprava-problemy__radek { font: 600 .75rem/1.4 var(--data); color: var(--chyba); white-space: nowrap; }
.sprava-problemy code { font: 400 .84rem/1.4 var(--data); overflow-wrap: anywhere; }
.sprava-problemy__proc { flex-basis: 100%; font-size: .86rem; color: var(--inkoust-2); }
.sprava-denik { max-width: 60rem; }
.sprava-denik__tabulka { width: 100%; border-collapse: collapse; margin-top: .6rem; font-size: .88rem; }
.sprava-denik__tabulka th { text-align: left; font: 600 .7rem/1.2 var(--text); letter-spacing: .1em; text-transform: uppercase; color: var(--inkoust-2); padding: .3rem .5rem; border-bottom: 1px solid var(--lajna-silna); }
.sprava-denik__tabulka td { padding: .35rem .5rem; border-bottom: 1px solid var(--lajna); vertical-align: top; }
.sprava-denik__cas { font-family: var(--data); font-size: .8rem; white-space: nowrap; color: var(--inkoust-2); }
.sprava-denik__ip, .sprava-denik__detail { display: block; font-size: .78rem; color: var(--inkoust-2); overflow-wrap: anywhere; }
.sprava-denik__ip { font-family: var(--data); }
.prihlaseni .pole { margin-bottom: .6rem; }
@media (max-width: 34rem) {
  .sprava-denik__tabulka thead { display: none; }
  .sprava-denik__tabulka tr { display: grid; grid-template-columns: auto 1fr; gap: 0 .6rem; padding: .35rem 0; border-bottom: 1px solid var(--lajna); }
  .sprava-denik__tabulka td { border: 0; padding: .1rem .2rem; }
  .sprava-denik__tabulka td:last-child { grid-column: 1 / -1; }
}
.sprava-denik__tabulka td:nth-child(2) { white-space: nowrap; }


/* ============================================================ tmavý režim
   Zapíná se ikonou v záhlaví (atribut data-rezim na <html>, volbu si pamatuje
   prohlížeč). Jde o druhou sadu barev; rozvržení se nemění. Tisk je vždy světlý. */
@media screen {
  html[data-rezim="tmavy"] { color-scheme: dark; }

  html[data-rezim="tmavy"] body {
    --papir:        #12141a;
    --papir-2:      #191c23;
    --karta:        #1d2029;
    --inkoust:      #e3e6ec;
    --inkoust-2:    #9ba2af;
    --travnik:      #6fa8e0;
    --travnik-tmavy:#0c1022;
    --okr:          #d6a53a;
    --okr-svetly:   #3d3217;
    --okr-tmavy:    #e9c46a;
    --lajna:        rgba(227, 230, 236, .10);
    --lajna-silna:  rgba(227, 230, 236, .26);
    --odkaz:        #9cc4ee;
    --plocha:       #2d5d91;
    --na-plose:     #f3f5f9;
    --hlavicka:     #0c1022;
    --hlavicka-text:#eceef3;
    --liga-podklad: #1f2633;
    --chyba:        #e2806b;
    --zvyrazneni:   #3a3018;
  }

  /* Archiv zůstane teplý, jen potmě. */
  html[data-rezim="tmavy"] body.archiv {
    --papir:        #16130f;
    --papir-2:      #1e1a15;
    --karta:        #231e18;
    --inkoust:      #ece4d8;
    --inkoust-2:    #aa9c8a;
    --travnik:      #e0975a;
    --travnik-tmavy:#1a0f07;
    --okr:          #6cc08f;
    --okr-svetly:   #1d3426;
    --lajna:        rgba(236, 228, 216, .10);
    --lajna-silna:  rgba(236, 228, 216, .26);
    --odkaz:        #f0b27a;
    --plocha:       #8a4a1c;
    --na-plose:     #fff6ec;
    --hlavicka:     #1a0f07;
    --hlavicka-text:#f4ebdf;
    --liga-podklad: #2a231b;
  }

  html[data-rezim="tmavy"] .hlavicka__logo { filter: brightness(.88); }

  /* Vybraná kategorie má světlý podklad – bílé písmo by na něm zanikalo. */
  html[data-rezim="tmavy"] .kotvy a.kotvy--vybrano,
  html[data-rezim="tmavy"] .kotvy a:hover,
  html[data-rezim="tmavy"] .stitek input:checked + span { color: #12141a; }

  /* Barvy napevno ze světlé verze. */
  html[data-rezim="tmavy"] .zapas__vitez { color: #7fcf97; }
  html[data-rezim="tmavy"] .zapas--v-turnaji { background: #1a1d24; }
  html[data-rezim="tmavy"] .zapas--turnaj.zapas--zahlavi { background: #232733; }
  html[data-rezim="tmavy"] .tabulky__varovani { background: #3a1f1b; border-left-color: #e2806b; color: #f0a896; }
  html[data-rezim="tmavy"] .sestava__karta--žk { color: #e3c255; }
  html[data-rezim="tmavy"] .sestava__karta--čk10 { color: #f08a75; }
  html[data-rezim="tmavy"] .sestava__karta--ot { color: #c7a1e6; }
  html[data-rezim="tmavy"] .mapa__udaj { color: #aeb3a8; }
  html[data-rezim="tmavy"] .hlaska--ok { border-left-color: #6cc08f; }
  html[data-rezim="tmavy"] .vyvoj {
    --vyvoj-0: #6fa8e0;
    --vyvoj-1: #ef7b6d;
    --vyvoj-2: #62c287;
    --vyvoj-3: #c58be0;
    --vyvoj-4: #e8b04a;
    --vyvoj-5: #4fc3ad;
    --vyvoj-6: #b88ad8;
    --vyvoj-7: #ec8d4f;
  }
  html[data-rezim="tmavy"] .pas__den--minule .pas__sloupec { background: rgba(98, 194, 135, .28); }
  html[data-rezim="tmavy"] input,
  html[data-rezim="tmavy"] select,
  html[data-rezim="tmavy"] textarea { color-scheme: dark; }
}

/* Přepínač režimu v záhlaví. */
.prepinac-rezimu {
  position: absolute;
  top: .7rem;
  right: .7rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.4rem;
  height: 2.4rem;
  padding: 0;
  border: 1px solid rgba(247, 248, 242, .3);
  border-radius: 50%;
  background: transparent;
  color: var(--hlavicka-text);
  cursor: pointer;
}
.prepinac-rezimu:hover { border-color: var(--hlavicka-text); background: rgba(255, 255, 255, .08); }
.prepinac-rezimu svg { width: 1.2rem; height: 1.2rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.prepinac-rezimu .ikona-slunce { display: none; }
html[data-rezim="tmavy"] .prepinac-rezimu .ikona-slunce { display: block; }
html[data-rezim="tmavy"] .prepinac-rezimu .ikona-mesic { display: none; }
.hlavicka { position: relative; }
@media print { .prepinac-rezimu { display: none; } }