/* czechdatasets.com: Česko po vrstvách (směr B · Les)
   Tokeny podle design/brand/BRAND.md. Mřížka 12 sloupců, mezera 24 px, max. 1280 px.
   Poloměry 6 / 10 / 16 / 24. Karty a tlačítka mají „tloušťku desky“ (tmavší spodní hranu). */

@font-face { font-family: "Bricolage Grotesque"; src: url(/fonts/bricolage-latin.woff2) format("woff2"); font-weight: 600 800; font-display: swap;
  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: "Bricolage Grotesque"; src: url(/fonts/bricolage-latin-ext.woff2) format("woff2"); font-weight: 600 800; font-display: swap;
  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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Figtree"; src: url(/fonts/figtree-latin.woff2) format("woff2"); font-weight: 400 600; font-display: swap;
  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: "Figtree"; src: url(/fonts/figtree-latin-ext.woff2) format("woff2"); font-weight: 400 600; font-display: swap;
  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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "JetBrains Mono"; src: url(/fonts/jetbrains-mono-latin.woff2) format("woff2"); font-weight: 400 600; font-display: swap;
  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: "JetBrains Mono"; src: url(/fonts/jetbrains-mono-latin-ext.woff2) format("woff2"); font-weight: 400 600; font-display: swap;
  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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  --bg: #F7F2E8; --povrch: #FFFDF8; --povrch-2: #F0E8DA; --ink: #2B2723; --muted: #6B635A;
  --linka: #E5DCCB; --linka-silna: #D3C7B2;
  --brand: #2F6A4A; --brand-hrana: #1F4A33; --on-brand: #FFFFFF; --brand-tint: #E3EDE4;
  --repka: #EFCB5A; --repka-hrana: #C9A23C; --cihla: #D2694A;
  --louka: #A9C686; --louka-hrana: #8AA66A; --les: #4E7A57; --psenice: #E4C28E; --psenice-hrana: #C9A673; --oranice: #B98A64;
  --odemceno: #CCDAB2; --k-ret: #8A4A2C;
  --rm-deska: #F3ECDF; --rm-louka: #D6E3C0; --rm-pole: #EFE2C6; --rm-mlha: #EBE4D6; --rm-tecky: #8C8274; --rm-brazdy: #B98A64;
  --nadpis: "Bricolage Grotesque", Figtree, ui-sans-serif, system-ui, sans-serif;
  --text: Figtree, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --r-chip: 6px; --r-tl: 10px; --r-karta: 16px; --r-panel: 24px;
  --ram: 1280px; --mezera: 24px; --okraj: 48px; --oddil: 104px;
  --pohyb: .16s ease-out;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #1C1A17; --povrch: #26231F; --povrch-2: #2F2B26; --ink: #EFE8DC; --muted: #B3AA9C;
    --linka: #3A352F; --linka-silna: #4A443C;
    --brand: #7DBB93; --brand-hrana: #4E8463; --on-brand: #1C1A17; --brand-tint: #24342A;
    --repka: #D9B24A; --repka-hrana: #A88A35; --cihla: #D97A5C;
    --louka: #7E9C63; --louka-hrana: #637D4D; --les: #6F9A77; --psenice: #BFA073; --psenice-hrana: #9A805A; --oranice: #9A7354;
    --odemceno: #526141; --k-ret: #E0A27F;
    --rm-deska: #2A2622; --rm-louka: #34402B; --rm-pole: #3D352A; --rm-mlha: #2B2824; --rm-tecky: #8F8778; --rm-brazdy: #9A7354;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #1C1A17; --povrch: #26231F; --povrch-2: #2F2B26; --ink: #EFE8DC; --muted: #B3AA9C;
  --linka: #3A352F; --linka-silna: #4A443C;
  --brand: #7DBB93; --brand-hrana: #4E8463; --on-brand: #1C1A17; --brand-tint: #24342A;
  --repka: #D9B24A; --repka-hrana: #A88A35; --cihla: #D97A5C;
  --louka: #7E9C63; --louka-hrana: #637D4D; --les: #6F9A77; --psenice: #BFA073; --psenice-hrana: #9A805A; --oranice: #9A7354;
  --odemceno: #526141; --k-ret: #E0A27F;
  --rm-deska: #2A2622; --rm-louka: #34402B; --rm-pole: #3D352A; --rm-mlha: #2B2824; --rm-tecky: #8F8778; --rm-brazdy: #9A7354;
  color-scheme: dark;
}

/* ---------- základ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 24px; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body { margin: 0; background: var(--bg); color: var(--ink); font: 400 17px/1.6 var(--text); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, p, figure, dl, dd, ol, ul { margin: 0; }
h1, h2, h3, h4 { font-family: var(--nadpis); font-weight: 700; letter-spacing: -.02em; text-wrap: balance; }
h1 { font-weight: 800; letter-spacing: -.03em; }
p { text-wrap: pretty; }
ul, ol { padding: 0; list-style: none; }
a { color: var(--brand); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--brand); outline-offset: 3px; border-radius: 4px; }
::selection { background: var(--brand); color: var(--on-brand); }
img { display: block; max-width: 100%; height: auto; }
picture { display: block; }
code, pre, textarea, kbd { font-family: var(--mono); font-variant-ligatures: none; }
code { font-size: .86em; padding: .08em .35em; border-radius: var(--r-chip); background: var(--povrch-2); }
pre code { padding: 0; background: none; }
button { font: inherit; color: inherit; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.preskocit { position: absolute; z-index: 20; left: 12px; top: -80px; padding: 12px 16px; border-radius: var(--r-tl); background: var(--ink); color: var(--bg); }
.preskocit:focus { top: 12px; }
.ram { width: min(var(--ram), 100% - 2 * var(--okraj)); margin-inline: auto; }
.jen-firemni { display: none; }
:is(.nakup, .produkt, .souhrn):has(.licence input:checked) .jen-osobni { display: none; }
:is(.nakup, .produkt, .souhrn):has(.licence input:checked) .jen-firemni { display: inline; }

/* ---------- desky: karty a tlačítka */
.karta { background: var(--povrch); border: 1px solid var(--linka); border-radius: var(--r-karta); box-shadow: 4px 4px 0 var(--linka); }
.tlacitko {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; margin-bottom: 3px; padding: 0 22px;
  border: 0; border-radius: var(--r-tl); background: var(--brand); color: var(--on-brand); box-shadow: 0 3px 0 var(--brand-hrana);
  font: 600 16px/1.2 var(--text); text-decoration: none; white-space: nowrap; cursor: pointer;
  transition: transform var(--pohyb), box-shadow var(--pohyb);
}
.tlacitko:hover { transform: translateY(-2px); box-shadow: 0 5px 0 var(--brand-hrana); }
.tlacitko:active { transform: translateY(2px); box-shadow: 0 1px 0 var(--brand-hrana); }
.tlacitko-druhe { background: var(--povrch); color: var(--ink); box-shadow: inset 0 0 0 1px var(--linka), 0 3px 0 var(--linka-silna); }
.tlacitko-druhe:hover { box-shadow: inset 0 0 0 1px var(--linka-silna), 0 5px 0 var(--linka-silna); }
.tlacitko-druhe:active { box-shadow: inset 0 0 0 1px var(--linka-silna), 0 1px 0 var(--linka-silna); }
.odkaz { font-weight: 600; }
.odkaz-tlacitko { padding: 4px 0; border: 0; background: none; color: var(--brand); font: 600 14px/1.4 var(--text); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.stitek-odemceno { display: inline-flex; align-items: center; gap: 7px; width: fit-content; padding: 4px 11px; border-radius: 999px; background: var(--odemceno); color: var(--ink); font: 600 13px/1.4 var(--text); text-decoration: none; }
.stitek-odemceno::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--les); }
.stitek-maly { margin-left: 8px; padding: 1px 9px; font-size: 12px; vertical-align: 1px; }
@media (prefers-reduced-motion: reduce) {
  .tlacitko, .karta-odkaz, .licence-kolej, .licence-kolej::after, .sada-odkaz { transition: none; }
  .tlacitko:hover, .tlacitko:active, .karta-odkaz:hover { transform: none; }
}

/* přepínač firemní licence */
.nakup { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.licence { position: relative; display: inline-flex; align-items: center; gap: 8px; min-height: 32px; color: var(--muted); font: 500 14px/1.3 var(--text); cursor: pointer; }
.licence input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.licence-kolej { position: relative; flex: none; width: 34px; height: 20px; border-radius: 999px; background: var(--linka-silna); transition: background var(--pohyb); }
.licence-kolej::after { content: ""; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: var(--povrch); box-shadow: 0 1px 0 rgba(43, 39, 35, .25); transition: transform var(--pohyb); }
.licence input:checked + .licence-kolej { background: var(--brand); }
.licence input:checked + .licence-kolej::after { transform: translateX(14px); }
.licence input:checked ~ span:last-child { color: var(--ink); }
.licence input:focus-visible + .licence-kolej { outline: 3px solid var(--brand); outline-offset: 2px; }

/* ---------- hlavička */
.hlavicka-ram { display: flex; align-items: center; gap: 32px; min-height: 76px; }
.znacka { display: inline-flex; align-items: center; gap: 10px; flex: none; color: var(--ink); text-decoration: none; }
.znacka img { width: auto; height: 32px; }
.znacka-slovo { font: 700 21px/1 var(--nadpis); letter-spacing: -.02em; }
.znacka-slovo span { color: var(--muted); }
.znak path, .znak ellipse { stroke-linejoin: round; }
.zn-dole { fill: var(--louka); stroke: var(--louka-hrana); stroke-width: .8; }
.zn-dole-bok { fill: var(--les); }
.zn-nahore { fill: var(--repka); stroke: var(--repka-hrana); stroke-width: .8; }
.zn-nahore-bok { fill: var(--repka-hrana); }
.zn-stin { fill: var(--repka-hrana); opacity: .7; }
.zn-spendlik { fill: var(--brand); stroke: var(--brand-hrana); stroke-width: .8; }
.menu { display: flex; gap: 4px; margin-left: auto; font: 500 15px var(--text); }
.menu a { padding: 8px 12px; border-radius: var(--r-tl); color: var(--ink); text-decoration: none; }
.menu a:hover { background: var(--povrch-2); }
.prepinac {
  display: grid; place-items: center; flex: none; width: 44px; height: 44px; padding: 0; border: 0; border-radius: var(--r-tl);
  background: var(--povrch); color: var(--ink); box-shadow: inset 0 0 0 1px var(--linka), 0 3px 0 var(--linka-silna); cursor: pointer;
}
.prepinac:hover { box-shadow: inset 0 0 0 1px var(--linka-silna), 0 3px 0 var(--linka-silna); }

/* ---------- úvod (hero) */
.uvod { padding-block: 48px 96px; }
.uvod-ram { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--mezera); align-items: start; }
.uvod-text { grid-column: 1 / span 6; padding-top: 56px; }
.uvod h1 { font-size: clamp(44px, 5.4vw, 72px); line-height: 1.02; }
.perex { margin-top: 20px; max-width: 34em; font-size: 20px; line-height: 1.55; color: var(--muted); }
.perex-ink { color: var(--ink); }
.uvod-akce { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 12px 16px; margin-top: 32px; }
.uvod-pozn { margin-top: 18px; font-size: 15px; color: var(--muted); }
.uvod-vizual { grid-column: 7 / span 6; align-self: center; }
.uvod-text .fakta { margin-top: 40px; max-width: 560px; }
.uvod-obr { overflow: hidden; border-radius: var(--r-panel); }
.uvod-obr img { width: 100%; }
.fakta { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); }
.fakta > div { grid-column: span 3; min-width: 0; padding: 14px 20px; border-bottom: 1px solid var(--linka); }
.fakta > div:nth-child(odd):not(.fakta-cela) { border-right: 1px solid var(--linka); }
.fakta > .fakta-cela { grid-column: 1 / -1; }
.fakta > div:last-child { border-bottom: 0; }
.fakta dt { font: 500 13px/1.4 var(--text); color: var(--muted); }
.fakta dd { margin-top: 2px; font-weight: 600; line-height: 1.4; }

/* ---------- oddíly */
.oddil { padding-block: var(--oddil) 0; }
main > .oddil:last-child { padding-bottom: var(--oddil); }
.oddil-ram { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--mezera); }
.oddil-hlava { grid-column: 1 / span 4; align-self: start; }
.oddil-telo { grid-column: 5 / -1; min-width: 0; }
.oddil h2 { font-size: clamp(30px, 3vw, 40px); line-height: 1.1; }
.oddil-hlava h2 { max-width: 13ch; }
.oddil-hlava p { margin-top: 14px; max-width: 34ch; color: var(--muted); }
.oddil-hlava .stitek-odemceno { margin-bottom: 14px; }
.oddil-obr { margin-top: 32px; overflow: hidden; border-radius: var(--r-panel); }
@media (min-width: 1101px) and (min-height: 760px) { .oddil-ram > .oddil-hlava { position: sticky; top: 32px; } }
.oddil-hlava-siroka { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--mezera); align-items: end; margin-bottom: 40px; }
.oddil-hlava-siroka h2 { grid-column: 1 / span 5; }
.oddil-hlava-siroka > p, .katalog-uvod { grid-column: 6 / -1; color: var(--muted); max-width: 60ch; }
.katalog-uvod p + p { margin-top: 8px; }
.oddil-historie, .oddil-roadmap { margin-top: var(--oddil); padding-block: 88px; background: var(--povrch-2); }
.oddil-historie + .oddil, .oddil-roadmap + .oddil { padding-top: var(--oddil); }
.oddil-navazuje { margin-top: 0; }
.mezititulek { margin: 48px 0 14px; font-size: 20px; }
.mezititulek:first-child { margin-top: 0; }
.pozn { margin-top: 14px; font-size: 14px; color: var(--muted); max-width: 72ch; }
.akce { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin-top: 32px; }

/* ---------- katalog: produkt = karta, sady jako podřádky */
.katalog { display: grid; gap: 24px; }
.produkt { overflow: hidden; }
.produkt-hlava { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px 32px; padding: 22px 28px; }
.produkt-nazev h3 { font-size: 23px; line-height: 1.2; }
.produkt-nazev p { margin-top: 2px; font-size: 14px; color: var(--muted); }
.produkt-cena { font: 800 30px/1 var(--nadpis); letter-spacing: -.02em; white-space: nowrap; text-align: right; }
.produkt-cena small { display: block; margin-top: 6px; font: 500 13px/1.3 var(--text); letter-spacing: 0; color: var(--muted); }
.produkt .nakup { align-items: flex-end; }
.produkt-zdarma .produkt-cena { color: var(--les); }
.produkt-vse { background: var(--brand-tint); border-color: var(--linka-silna); box-shadow: 4px 4px 0 var(--linka-silna); }
.produkt-sady { border-top: 1px solid var(--linka); }
.sada + .sada { border-top: 1px solid var(--linka); }
.sada-odkaz { display: grid; grid-template-columns: 44px minmax(0, 1fr) minmax(200px, 270px); gap: 2px 20px; align-items: start; padding: 16px 28px 18px; color: inherit; text-decoration: none; transition: background var(--pohyb); }
.sada-odkaz:not(:has(.znak-sady)) { grid-template-columns: minmax(0, 1fr) minmax(200px, 270px); }
.sada-odkaz:hover { background: var(--brand-tint); }
.sada-odkaz:hover .sada-jmeno { text-decoration: underline; text-underline-offset: 3px; }
.znak-sady img { width: 44px; height: 44px; }
.sada-text { min-width: 0; }
.sada-jmeno { display: block; font-weight: 600; color: var(--ink); }
.sada-pitch { display: block; margin-top: 2px; max-width: 64ch; font-size: 15px; line-height: 1.5; color: var(--muted); }
.sada-cisla { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; padding-top: 2px; font-size: 14px; line-height: 1.45; color: var(--muted); text-align: right; }
.sada-cisla b { font-weight: 600; color: var(--ink); }

/* ---------- historie: měřítko 134 měsíců */
.kota { margin-bottom: 64px; }
.kota-meze { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 10px; font: 600 14px var(--text); color: var(--ink); }
.kota-meze span:nth-child(2) { color: var(--muted); font-weight: 500; }
.kota-vykres { position: relative; padding-bottom: 72px; }
.kota-pravitko { display: block; width: 100%; height: 34px; overflow: visible; }
.kota-pravitko path { fill: none; stroke: var(--muted); stroke-width: 1; vector-effect: non-scaling-stroke; shape-rendering: crispEdges; }
.kota-pravitko .kota-udalost { stroke: var(--cihla); stroke-width: 3; }
.kota-roky { display: grid; grid-template-columns: repeat(var(--mesicu), minmax(0, 1fr)); margin-top: 4px; font: 500 13px/1.4 var(--text); color: var(--muted); }
.kota-roky li { padding-left: 5px; }
.kota-udalost-text { position: absolute; top: 70px; left: var(--x); max-width: min(34ch, calc(100% - var(--x))); padding-left: 14px; font-size: 14px; line-height: 1.45; }
.kota-udalost-text::before { content: ""; position: absolute; left: -1px; top: -30px; width: 3px; height: 40px; border-radius: 2px; background: var(--cihla); }
.historie-obsah { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--mezera); align-items: center; }
.historie-text { grid-column: 1 / span 6; }
.historie-text .kod { margin-block: 24px; }
.historie-obr { grid-column: 7 / span 6; overflow: hidden; border-radius: var(--r-panel); }

/* ---------- postup, ostatní sady, zdarma */
.kroky { counter-reset: krok; padding: 6px 24px; }
.kroky li { counter-increment: krok; display: grid; grid-template-columns: 40px 1fr; padding: 14px 0; max-width: 70ch; }
.kroky li + li { border-top: 1px solid var(--linka); }
.kroky li::before { content: counter(krok); display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--repka); color: #2B2723; font: 700 14px/1 var(--nadpis); }
.zaver { margin-top: 28px; font: 700 clamp(22px, 2.2vw, 28px)/1.25 var(--nadpis); letter-spacing: -.02em; max-width: 28ch; }
.prace > div { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); column-gap: var(--mezera); padding: 14px 0; border-bottom: 1px solid var(--linka); }
.prace dt { grid-column: 1 / span 3; font-weight: 600; }
.prace dt a { color: var(--ink); text-decoration: none; }
.prace dt a:hover { text-decoration: underline; }
.prace dd { grid-column: 4 / -1; color: var(--muted); font-size: 15px; }
.zdarma-mrizka { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.zdarma-mrizka li { padding: 18px 20px 20px; }
.zdarma-mrizka h3 { font-size: 18px; }
.zdarma-mrizka p { margin-top: 4px; font-size: 15px; color: var(--muted); }

/* ---------- kód */
.kody { display: grid; gap: 24px; }
.kod { min-width: 0; overflow: hidden; border: 1px solid var(--linka); border-radius: var(--r-karta); background: var(--povrch-2); }
.kod figcaption { display: flex; align-items: center; gap: 16px; min-height: 46px; padding-left: 18px; border-bottom: 1px solid var(--linka); font-size: 14px; }
.kod-nazev { font-weight: 600; }
.kod-prostredi { margin-left: auto; padding-right: 18px; color: var(--muted); }
.kopirovat { align-self: stretch; margin-left: -2px; padding: 0 18px; border: 0; border-left: 1px solid var(--linka); background: transparent; font: 600 13px var(--text); cursor: pointer; }
.kopirovat:hover { background: var(--povrch); }
.kopirovat:not([hidden]) { display: block; }
.kod pre { margin: 0; padding: 18px 20px 20px; overflow-x: auto; font-size: 13.5px; line-height: 1.7; tab-size: 2; }
.kod pre:focus-visible { outline-offset: -3px; }
.kod code { font-size: inherit; }
.k-kw { color: var(--brand); font-weight: 600; }
.k-ret { color: var(--k-ret); }
.k-kom { color: var(--muted); }

/* ---------- otázky */
.otazky { display: grid; gap: 12px; }
.otazky details { padding: 0 22px; border: 1px solid var(--linka); border-radius: var(--r-karta); background: var(--povrch); }
.otazky details[open] { box-shadow: 4px 4px 0 var(--linka); }
.otazky summary { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 18px 0; font: 700 19px/1.3 var(--nadpis); letter-spacing: -.01em; cursor: pointer; list-style: none; }
.otazky summary::-webkit-details-marker { display: none; }
.otazky summary::after {
  content: ""; flex: none; width: 14px; height: 14px;
  background: linear-gradient(currentColor, currentColor) center / 14px 2px no-repeat, linear-gradient(currentColor, currentColor) center / 2px 14px no-repeat;
  border-radius: 1px;
}
.otazky details[open] summary::after { background: linear-gradient(currentColor, currentColor) center / 14px 2px no-repeat; }
.otazky details p { padding-bottom: 20px; max-width: 66ch; color: var(--muted); }

/* ---------- závěr */
.oddil-zaver { padding-bottom: var(--oddil); }
.zaver-panel { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 24px 48px; padding: 44px 48px; border-radius: var(--r-panel); background: var(--brand-tint); border: 1px solid var(--linka-silna); box-shadow: 4px 4px 0 var(--linka-silna); }
.zaver-panel h2 { font-size: clamp(32px, 3.6vw, 48px); line-height: 1.05; }
.zaver-panel p { margin-top: 12px; max-width: 52ch; color: var(--muted); }

/* ---------- patička */
.paticka { padding-block: 64px 48px; border-top: 1px solid var(--linka); font-size: 15px; color: var(--muted); }
.paticka-ram { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--mezera); row-gap: 40px; }
.paticka h2 { margin-bottom: 12px; font: 700 15px var(--nadpis); color: var(--ink); letter-spacing: 0; }
.paticka-znacka { grid-column: 1 / span 4; }
.paticka-znacka p { margin-top: 16px; max-width: 34ch; }
.paticka-sady { grid-column: 5 / span 4; }
.paticka-sady ul { columns: 2; column-gap: var(--mezera); }
.paticka-sady li { padding-block: 3px; break-inside: avoid; }
.paticka-info { grid-column: 9 / span 4; }
.paticka-info p + p { margin-top: 8px; }
.paticka a { color: var(--ink); text-decoration: none; }
.paticka a:hover { text-decoration: underline; }
.paticka-zdroje { grid-column: 1 / -1; padding-top: 24px; border-top: 1px solid var(--linka); font-size: 14px; }
.paticka-zdroje:only-child { padding-top: 0; border-top: 0; }

/* ---------- detail sady */
.drobky { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; font-size: 14px; color: var(--muted); }
.drobky a { color: var(--ink); }
.uvod-detail { padding-top: 28px; }
.uvod-detail .uvod-text { padding-top: 32px; }
.uvod-detail h1 { font-size: clamp(38px, 4.4vw, 60px); line-height: 1.04; }
.kotvy { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.kotvy a { display: inline-block; padding: 6px 12px; border-radius: var(--r-chip); background: var(--povrch); box-shadow: inset 0 0 0 1px var(--linka); color: var(--ink); font: 500 14px var(--text); text-decoration: none; }
.kotvy a:hover { box-shadow: inset 0 0 0 1px var(--linka-silna); background: var(--povrch-2); }
.detail-volne { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 20px; font-size: 15px; color: var(--muted); }
.detail-ram { grid-template-areas: "text souhrn" "obr souhrn"; grid-template-rows: auto 1fr; }
.detail-ram .uvod-text { grid-area: text; grid-column: 1 / span 6; }
.detail-ram .souhrn { grid-area: souhrn; grid-column: 7 / span 6; margin-top: 32px; }
.detail-ram .detail-obr { grid-area: obr; grid-column: 1 / span 6; margin-top: 40px; max-width: 560px; }
.souhrn { overflow: hidden; }
.oddil-telo .pozn + .kod { margin-top: 24px; }
.souhrn .fakta > div:nth-child(1), .souhrn .fakta > div:nth-child(2), .souhrn .fakta > div:nth-child(3) { grid-column: span 2; border-right: 1px solid var(--linka); }
.souhrn .fakta > div:nth-child(3) { border-right: 0; }
.souhrn .fakta > div:last-child { border-bottom: 1px solid var(--linka); }
.souhrn-cena { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 8px 24px; padding: 20px 20px 18px; }
.souhrn-cena .produkt-cena { text-align: left; }
.souhrn-cena .nakup { justify-self: end; align-items: flex-end; }
.souhrn-cena .stitek-odemceno, .souhrn-cena .cena-pozn { grid-column: 1; }
.souhrn-cena > .tlacitko { grid-column: 2; grid-row: 1 / span 2; justify-self: end; }
.souhrn-vse { grid-column: 1 / -1; }
.cena-pozn { font-size: 14px; color: var(--muted); }
.tabulka-ram { overflow: hidden; }
.tabulka { width: 100%; border-collapse: collapse; font-size: 15px; }
.tabulka + .tabulka { border-top: 1px solid var(--linka-silna); }
.tabulka th, .tabulka td { padding: 12px 20px; border-bottom: 1px solid var(--linka); text-align: left; vertical-align: top; }
.tabulka tbody tr:last-child > * { border-bottom: 0; }
.tabulka thead th { padding-block: 10px; background: var(--povrch-2); font: 500 13px var(--text); color: var(--muted); white-space: nowrap; }
.tabulka tbody th { font-weight: 600; }
.tabulka tbody th code { background: none; padding: 0; font-size: 14px; }
.td-popis { display: block; margin-top: 2px; font-weight: 400; font-size: 14px; color: var(--muted); }
.tabulka .num { text-align: right; white-space: nowrap; font-family: var(--mono); font-size: 14px; font-variant-numeric: tabular-nums; }
.tabulka thead .num { font-family: var(--text); }
.tabulka-data td { font-family: var(--mono); font-size: 14px; }
.null { color: var(--muted); }
.pohled { margin-left: 8px; font-size: 12px; font-weight: 400; color: var(--muted); }
.dostupne { display: inline-block; padding: 1px 9px; border-radius: 999px; background: var(--odemceno); color: var(--ink); font: 600 12.5px/1.5 var(--text); white-space: nowrap; }
.dostupne-ne { background: var(--povrch-2); box-shadow: inset 0 0 0 1px var(--linka-silna); }
.pripravujeme { display: grid; gap: 8px; margin-top: 16px; font-size: 15px; color: var(--muted); }
.dalsi-vrstvy { border-top: 1px solid var(--linka); }
.dalsi-vrstvy summary { display: flex; align-items: center; gap: 8px; padding: 14px 20px; color: var(--brand); font-weight: 600; cursor: pointer; list-style: none; }
.dalsi-vrstvy summary::-webkit-details-marker { display: none; }
.dalsi-vrstvy summary::before { content: ""; width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(-45deg); transition: transform var(--pohyb); }
.dalsi-vrstvy[open] summary::before { transform: rotate(45deg); }
.dalsi-vrstvy[open] summary { border-bottom: 1px solid var(--linka); }
.zdroj > div { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); column-gap: var(--mezera); padding: 14px 0; border-bottom: 1px solid var(--linka); }
.zdroj dt { grid-column: 1 / span 2; color: var(--muted); font-size: 15px; }
.zdroj dd { grid-column: 3 / -1; }
.zdroj li + li { margin-top: 6px; }
.souvisi { display: grid; gap: 12px; }
.souvisi li { padding: 16px 20px; border: 1px solid var(--linka); border-radius: var(--r-karta); background: var(--povrch); transition: transform var(--pohyb), box-shadow var(--pohyb); }
.souvisi li:hover { transform: translateY(-2px); box-shadow: 4px 6px 0 var(--linka); }
.souvisi a { font: 700 19px var(--nadpis); color: var(--ink); text-decoration: none; }
.souvisi a::after { content: ""; position: absolute; inset: 0; }
.souvisi li { position: relative; }
.souvisi p { margin-top: 2px; font-size: 15px; color: var(--muted); max-width: 64ch; }
.dalsi { columns: 3; column-gap: var(--mezera); }
.dalsi li { padding-block: 4px; break-inside: avoid; }

/* ---------- mapa odemykání */
.rm-hud { display: flex; align-items: flex-end; gap: 28px; margin-bottom: 24px; }
.rm-pocet { display: flex; flex-direction: column; flex: none; }
.rm-pocet-text { font: 500 14px var(--text); color: var(--muted); }
.rm-pocet-cislo { font: 800 44px/1 var(--nadpis); letter-spacing: -.03em; }
.rm-pruh { flex: 1; display: flex; gap: 3px; margin-bottom: 6px; }
.rm-pruh .rm-vzorek { flex: 1; height: 14px; border-radius: 4px; }
.rm-vzorek { display: inline-block; flex: none; width: 20px; height: 20px; border-radius: var(--r-chip); }
.rm-vzorek-hotovo { background: var(--repka); box-shadow: inset 0 -3px 0 var(--repka-hrana); }
.rm-vzorek-ve-vyrobe { background: var(--povrch); box-shadow: inset 0 0 0 2px var(--cihla); }
.rm-vzorek-planujeme { background: repeating-linear-gradient(-26.565deg, var(--oranice) 0 1.5px, transparent 1.5px 5px) var(--psenice); }
.rm-vzorek-zvazujeme { background: radial-gradient(circle, var(--muted) 1px, transparent 1.4px) 0 0 / 5px 5px var(--povrch); box-shadow: inset 0 0 0 1px var(--linka-silna); }
.rm-legenda { display: flex; flex-wrap: wrap; gap: 10px 28px; margin-top: 20px; font-size: 15px; }
.rm-legenda li { display: flex; align-items: center; gap: 10px; }
.rm-legenda b { font-weight: 600; }
.rm-leg-pozn { color: var(--muted); }
.rm-mapa { position: relative; max-width: 1040px; margin-inline: auto; }
.mapa-nahled .rm-mapa { max-width: none; }
.rm-svg { display: block; width: 100%; height: auto; overflow: visible; }
.rm-svg polygon { stroke-linejoin: round; }
.rm-deska { fill: var(--rm-deska); stroke: var(--rm-deska); stroke-width: 18; }
.rm-deska-bok { fill: var(--linka-silna); stroke: var(--linka-silna); stroke-width: 18; }
.rm-deska-bok-p { fill: color-mix(in srgb, var(--linka-silna) 82%, #000); stroke: color-mix(in srgb, var(--linka-silna) 82%, #000); }
.rm-puda { stroke-width: 7; }
.rm-puda-louka { fill: var(--rm-louka); stroke: var(--rm-louka); }
.rm-puda-pole { fill: var(--rm-pole); stroke: var(--rm-pole); }
.rm-puda-mlha { fill: var(--rm-mlha); stroke: var(--rm-mlha); }
.rm-mlha { fill: url(#rm-mlha-svetla); }
.rm-mlha-ctvrt { opacity: .8; }
.rm-h { stroke-width: 2.5; }
.rm-h.rm-vrch { fill: var(--repka); stroke: var(--repka); }
.rm-h.rm-bok-l { fill: color-mix(in srgb, var(--repka) 88%, #6b4a10); stroke: color-mix(in srgb, var(--repka) 88%, #6b4a10); }
.rm-h.rm-bok-p { fill: color-mix(in srgb, var(--repka) 76%, #6b4a10); stroke: color-mix(in srgb, var(--repka) 76%, #6b4a10); }
.rm-h-vzor { fill: url(#rm-tecky); opacity: .45; }
.rm-p { stroke-width: 2.5; }
.rm-p.rm-vrch { fill: var(--psenice); stroke: var(--psenice); }
.rm-p.rm-bok-l, .rm-p.rm-bok-p { fill: var(--psenice-hrana); stroke: var(--psenice-hrana); }
.rm-p-vzor { fill: url(#rm-brazdy); opacity: .7; }
.rm-v-stopa { fill: var(--rm-pole); }
.rm-leseni { fill: none; stroke: var(--cihla); stroke-width: 1.4; stroke-linecap: round; animation: rm-puls 2.4s ease-in-out infinite; }
@keyframes rm-puls { 50% { opacity: .4; } }
.rm-z-stopa { fill: none; stroke: var(--muted); stroke-width: 1; stroke-dasharray: 3 3; opacity: .5; }
.jen-tmavy { display: none; }
.rm-hit { fill: transparent; }
.rm-fokus { fill: none; stroke: none; pointer-events: none; }
.rm-d { cursor: pointer; outline: none; }
.rm-telo { transition: transform var(--pohyb); }
.rm-d:hover .rm-telo, .rm-d:focus-visible .rm-telo, .rm-d.rm-aktivni .rm-telo { transform: translateY(-3px); }
.rm-d:hover .rm-fokus, .rm-d.rm-aktivni .rm-fokus { stroke: var(--brand); stroke-width: 2; stroke-linejoin: round; }
.rm-d:focus-visible .rm-fokus { stroke: var(--brand); stroke-width: 3; stroke-linejoin: round; }
.rm-popisky { pointer-events: none; }
.rm-popisek rect { fill: var(--povrch); stroke: var(--linka-silna); stroke-width: 1; }
.rm-popisek path { stroke: var(--muted); stroke-width: 1; }
.rm-popisek circle { fill: var(--ink); }
.rm-popisek text { font: 600 11px var(--text); fill: var(--ink); }
.rm-popisek tspan { font-weight: 500; fill: var(--muted); }
.rm-leseni, .rm-telo { transform-box: fill-box; }
@media (prefers-reduced-motion: reduce) { .rm-leseni { animation: none; } .rm-telo { transition: none; } }
.rm-karta { position: absolute; z-index: 5; width: 290px; padding: 14px 16px 16px; font-size: 14px; line-height: 1.5;
  background: var(--povrch); border: 1px solid var(--linka); border-radius: var(--r-karta); box-shadow: 4px 4px 0 var(--linka-silna); }
.rm-karta-stav { font-size: 13px; color: var(--muted); }
.rm-karta-nazev { margin-top: 2px; font: 700 18px/1.25 var(--nadpis); letter-spacing: -.01em; }
.rm-karta-popis { margin-top: 6px; color: var(--muted); }
.rm-karta-akce { margin-top: 10px; font-weight: 600; }
.mapa-souhrn { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--mezera); align-items: center; }
.mapa-text { grid-column: 1 / span 5; }
.mapa-text h2 { margin-bottom: 12px; }
.mapa-text > p:first-of-type { color: var(--muted); margin-bottom: 28px; max-width: 42ch; }
.mapa-text .rm-hud { flex-direction: column; align-items: stretch; gap: 12px; }
.mapa-text .rm-legenda { flex-direction: column; gap: 8px; }
.mapa-nahled { grid-column: 6 / -1; }
.rm-seznam { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.rm-oblast { padding: 18px 20px 6px; }
.rm-seznam .rm-oblast-nazev { padding-bottom: 10px; border-bottom: 1px solid var(--linka); font-size: 18px; }
.rm-oblast-nazev span { font: 500 15px var(--text); color: var(--muted); }
.rm-polozka { padding: 12px 0 14px; scroll-margin-top: 80px; }
.rm-polozka + .rm-polozka { border-top: 1px solid var(--linka); }
.rm-stav { display: inline-flex; align-items: center; gap: 8px; font: 500 13px var(--text); color: var(--muted); }
.rm-stav .rm-vzorek { width: 14px; height: 14px; border-radius: 4px; }
.rm-p-nazev { margin-top: 2px; font-weight: 600; }
.rm-p-nazev a { color: var(--ink); }
.rm-p-popis { margin-top: 2px; font-size: 15px; color: var(--muted); }
.rm-chci { display: inline-block; margin-top: 6px; font-size: 14px; font-weight: 600; }
.rm-polozka:target { margin-inline: -12px; padding-inline: 12px; border-radius: var(--r-tl); background: var(--brand-tint); }

/* ---------- úzké stránky (OP, stažení, zdarma, 404) */
.uvod-uzky { padding-block: 64px 16px; }
.uvod-uzky h1 { font-size: clamp(38px, 4.6vw, 60px); line-height: 1.04; max-width: 18ch; }
.uvod-uzky .perex { margin-top: 18px; }
.uvod-uzky .akce { margin-top: 32px; }
.uvod-uzky .dalsi { margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--linka); }
.oddil-text { padding-top: 40px; }
.clanek { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--mezera); padding: 20px 0 22px; border-top: 1px solid var(--linka); }
.clanek:last-child { border-bottom: 1px solid var(--linka); }
.clanek h2 { grid-column: 1 / span 4; font-size: 18px; line-height: 1.4; }
.clanek p { grid-column: 5 / span 7; }
.rada { margin-top: 28px; padding: 16px 20px; max-width: 72ch; border-radius: var(--r-karta); background: var(--povrch-2); font-size: 15px; }
.rada p + p { margin-top: 8px; }
.obsah-stazeni { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.obsah-stazeni li { display: flex; justify-content: space-between; gap: 16px; padding: 12px 16px; border: 1px solid var(--linka); border-radius: var(--r-tl); background: var(--povrch); }
.obsah-stazeni span { color: var(--muted); white-space: nowrap; }
.slozka { margin: 36px 0 10px; font: 600 14px/1.4 var(--mono); color: var(--muted); }
.slozka:first-child { margin-top: 0; }
.tabulka-ram:has(.soubory) { border: 1px solid var(--linka); border-radius: var(--r-karta); background: var(--povrch); }
.soubory td:first-child { overflow-wrap: anywhere; }
.soubory a { font-family: var(--mono); font-size: 14px; }
.vse { display: block; width: 100%; min-height: 200px; padding: 14px 16px; border: 1px solid var(--linka); border-radius: var(--r-karta); background: var(--povrch-2); color: var(--ink); font-size: 13px; line-height: 1.6; resize: vertical; }
.prazdne { padding: 24px; border-radius: var(--r-karta); background: var(--povrch-2); color: var(--muted); }

/* ---------- tmavé varianty obrázků v SVG */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .jen-svetly { display: none; }
  :root:not([data-theme="light"]) .jen-tmavy { display: inline; }
  :root:not([data-theme="light"]) .rm-mlha { fill: url(#rm-mlha-tmava); }
}
:root[data-theme="dark"] .jen-svetly { display: none; }
:root[data-theme="dark"] .jen-tmavy { display: inline; }
:root[data-theme="dark"] .rm-mlha { fill: url(#rm-mlha-tmava); }

/* ---------- tablet */
@media (max-width: 1100px) {
  :root { --okraj: 32px; --oddil: 88px; }
  .uvod-text { grid-column: 1 / -1; padding-top: 16px; }
  .uvod-vizual { grid-column: 1 / -1; margin-top: 40px; max-width: 720px; }
  .uvod-text .fakta { max-width: 720px; }
  .detail-ram { grid-template-areas: "text" "souhrn" "obr"; grid-template-rows: auto; }
  .detail-ram .uvod-text, .detail-ram .souhrn, .detail-ram .detail-obr { grid-column: 1 / -1; }
  .detail-ram .souhrn { max-width: 720px; }
  .oddil-hlava { grid-column: 1 / -1; margin-bottom: 32px; }
  .oddil-hlava h2 { max-width: 20ch; }
  .oddil-obr { width: min(100%, 520px); }
  .oddil-telo { grid-column: 1 / -1; }
  .oddil-hlava-siroka h2, .oddil-hlava-siroka > p, .katalog-uvod { grid-column: 1 / -1; }
  .oddil-hlava-siroka > p, .katalog-uvod { margin-top: 12px; }
  .historie-text, .historie-obr { grid-column: 1 / -1; }
  .historie-obr { max-width: 640px; margin-top: 32px; }
  .mapa-text, .mapa-nahled { grid-column: 1 / -1; }
  .mapa-nahled { margin-top: 32px; }
  .rm-seznam { grid-template-columns: 1fr 1fr; }
  .paticka-znacka { grid-column: 1 / -1; }
  .paticka-sady { grid-column: 1 / span 7; }
  .paticka-info { grid-column: 8 / -1; }
  .clanek h2 { grid-column: 1 / span 4; }
  .clanek p { grid-column: 5 / -1; }
}

/* ---------- telefon */
@media (max-width: 760px) {
  :root { --okraj: 20px; --mezera: 16px; --oddil: 72px; }
  body { font-size: 16px; }
  .hlavicka-ram { flex-wrap: wrap; gap: 8px 12px; min-height: 0; padding-top: 12px; }
  .znacka-slovo { font-size: 19px; }
  .prepinac { margin-left: auto; width: 40px; height: 40px; }
  .menu { order: 3; width: calc(100% + 16px); margin: 2px -8px 4px; gap: 0; justify-content: space-between; font-size: 14px; }
  .menu a { padding: 8px; }
  .uvod { padding-block: 16px 64px; }
  .uvod-text { padding-top: 12px; }
  .uvod h1 { font-size: clamp(40px, 11.5vw, 50px); }
  .perex { margin-top: 14px; font-size: 17px; }
  .uvod-akce { margin-top: 22px; gap: 12px; }
  .uvod-akce .nakup-hlavni { width: 100%; }
  .uvod-akce .nakup-hlavni .tlacitko { width: 100%; }
  .uvod-pozn { margin-top: 12px; font-size: 14px; }
  .uvod-text .fakta { margin-top: 28px; }
  .uvod-vizual { margin-top: 32px; }
  .fakta > div { padding: 12px 16px; }
  .oddil-historie, .oddil-roadmap { padding-block: 64px; }
  .produkt-hlava { grid-template-columns: minmax(0, 1fr); padding: 18px 18px 16px; gap: 12px 16px; }
  .produkt-nazev h3 { font-size: 20px; }
  .produkt-cena { font-size: 24px; }
  .produkt .nakup { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; }
  .produkt .nakup .tlacitko { flex: 1 1 auto; }
  .sada-odkaz, .sada-odkaz:not(:has(.znak-sady)) { grid-template-columns: minmax(0, 1fr); padding: 14px 18px 16px; }
  .sada-odkaz:has(.znak-sady) { grid-template-columns: 36px minmax(0, 1fr); }
  .znak-sady img { width: 36px; height: 36px; }
  .sada-cisla { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: 2px 14px; margin-top: 8px; padding-top: 0; text-align: left; }
  .kota-roky .licha { visibility: hidden; }
  .kota-roky li { padding-left: 3px; font-size: 12px; }
  .kota-meze { font-size: 13px; }
  .kota-meze span:nth-child(2) { display: none; }
  .kota-vykres { padding-bottom: 104px; }
  .kota-udalost-text { left: auto; right: calc(100% - var(--x)); max-width: var(--x); padding: 0 14px 0 0; text-align: right; font-size: 13px; }
  .kota-udalost-text::before { left: auto; right: -2px; }
  .kroky { padding: 4px 16px; }
  .kroky li { grid-template-columns: 36px 1fr; }
  .prace > div, .zdroj > div { grid-template-columns: 1fr; row-gap: 4px; }
  .prace dt, .prace dd, .zdroj dt, .zdroj dd { grid-column: 1; }
  .zdarma-mrizka { grid-template-columns: 1fr; gap: 12px; }
  .kod pre { padding: 16px; font-size: 12.5px; }
  .kod figcaption { padding-left: 14px; }
  .kod-prostredi { display: none; }
  .kopirovat { margin-left: auto; }
  .otazky details { padding: 0 16px; }
  .otazky summary { font-size: 17px; }
  .zaver-panel { grid-template-columns: 1fr; padding: 28px 22px; }
  .zaver-panel .nakup, .zaver-panel .tlacitko { width: 100%; }
  .paticka-sady, .paticka-info { grid-column: 1 / -1; }
  .dalsi, .obsah-stazeni { columns: 1; grid-template-columns: 1fr; }
  .clanek h2, .clanek p { grid-column: 1 / -1; }
  .clanek p { margin-top: 6px; }
  .uvod-detail { padding-top: 16px; }
  .uvod-detail .uvod-text { padding-top: 16px; }
  .kotvy { margin-top: 20px; }
  .souhrn-cena { grid-template-columns: minmax(0, 1fr); }
  .souhrn-cena .nakup { justify-self: stretch; align-items: stretch; }
  .souhrn-cena .nakup .tlacitko { width: 100%; }
  .souhrn-cena > .tlacitko { grid-column: 1; grid-row: auto; justify-self: stretch; }
  .rm-hud { flex-direction: column; align-items: stretch; gap: 10px; }
  .rm-pocet { flex-direction: row; align-items: baseline; gap: 10px; }
  .rm-pocet-cislo { font-size: 34px; }
  .rm-popisky { display: none; }
  .rm-karta { width: min(290px, 100%); }
  .rm-legenda { flex-direction: column; gap: 8px; }
  .rm-seznam { grid-template-columns: 1fr; gap: 16px; }
  .mapa-nahled { margin-top: 24px; }
  /* tabulky na telefonu: název a popis, pod nimi čísla s popisky */
  .tabulka thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .tabulka tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 16px; padding: 14px 16px; border-bottom: 1px solid var(--linka); }
  .tabulka tr:has(> td:nth-of-type(3)) { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px 12px; }
  .tabulka-data tr:has(> td:nth-of-type(3)) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tabulka tbody tr:last-child { border-bottom: 0; }
  .tabulka th, .tabulka td { padding: 0; border: 0; }
  .tabulka tbody th { grid-column: 1 / -1; }
  .tabulka .num { text-align: left; }
  .tabulka td[data-p]::before { content: attr(data-p); display: block; font: 500 12px/1.5 var(--text); color: var(--muted); }
  .tabulka-data tr { grid-template-columns: 1fr 1fr; }
  .soubory tr { grid-template-columns: minmax(0, 1fr) auto; }
  .soubory td[data-p]::before { display: none; }
}