/* Sdílený stylesheet veřejných stránek. Do balíku F byly tytéž tokeny opsané
   v 7 souborech; hodnoty jsou převzaté beze změny, aby extrakce byla čistě
   mechanická a případná regrese šla poznat okamžitě.

   Task 13 (F6): typová škála (--fs-*), jednotný breakpoint (640px) a
   vizuální hierarchie detailu rozhodnutí podle schválené varianty
   "scannovatelná hierarchie" — odůvodnění jednotlivých rozhodnutí je v
   .superpowers/sdd/2026-09-21-audit-vlna-3-balik-f-ui/task-13-report.md. */
:root {
  --bg: #fafaf7;
  --fg: #1a1a1a;
  --muted: #666;
  --border: #e5e5e0;
  --accent: #1e40af;
  --pill: #f0eee8;
  --pill-fg: #444;
  --card: #fff;
  --hover: #fbfaf6;
  --info-bg: #eef2ff;
  --info-fg: #3730a3;
  --warn-bg: #fef3c7;
  --warn-fg: #92400e;
  --derived-bg: #fef9c3;
  --derived-fg: #854d0e;
  --derived-border: #fde68a;
  --err-bg: #fdecea;
  --err-fg: #8a1f11;
  --mono: ui-monospace, "SF Mono", Menlo, monospace;
  --serif: "Source Serif 4", Georgia, serif;
  --sans: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;

  /* Typová škála (Task 13, Krok 1) — nahrazuje ~28 ad hoc velikostí (20× px,
     8× rem, s duplikáty typu 15,5 vs 14,5 px pro tutéž komponentu) jednou
     sadou proměnných v rem (báze 16px = kořenová velikost body). --fs-label
     je jediná hodnota mimo čistý geometrický krok — je to schválená hodnota
     z designové varianty (12,5px u skupinových popisků), ne odvozený krok. */
  --fs-2xs: 0.75rem;      /* 12px */
  --fs-label: 0.78125rem; /* 12,5px — schválená hodnota skupinového popisku */
  --fs-xs: 0.8125rem;     /* 13px */
  --fs-sm: 0.875rem;      /* 14px */
  --fs-base: 0.9375rem;   /* 15px */
  --fs-md: 1rem;          /* 16px */
  --fs-lg: 1.0625rem;     /* 17px */
  --fs-xl: 1.25rem;       /* 20px */
  --fs-2xl: 1.5rem;       /* 24px */
  --fs-3xl: 1.625rem;     /* 26px */
  --fs-4xl: 2rem;         /* 32px */
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  background: var(--bg);
  color: var(--fg);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.6;
}

/* ---- společné pro decision.ejs a search.ejs (header.brand má v obou souborech
   identické hodnoty, proto beze jmenné kolize) ---- */
header.brand {
  display: flex; justify-content: space-between; align-items: center;
  padding-bottom: 16px; border-bottom: 1px solid var(--border); margin-bottom: 32px;
}
.brand a { color: var(--fg); text-decoration: none; font-weight: 600; font-size: var(--fs-lg); }
.brand .lang { color: var(--muted); font-size: var(--fs-xs); }

/* ---- decision.ejs (detail rozhodnutí) ----
   Kontejner je namespacovaný na .wrap--decision (kolize s search.ejs na
   jiné max-width). Task 13: h2 je teď scoped na `.wrap--decision h2` místo
   holého h2 — bezpečná změna, protože decision.ejs byl jediný skutečný
   konzument holého h2 (search.ejs žádné h2 nemá, legislativa má vlastní
   `.wrap--leg h2` override s vyšší specificitou). */
.wrap--decision { max-width: 820px; margin: 0 auto; padding: 32px 24px 80px; }
.wrap--decision h1 {
  font-family: var(--mono); font-size: var(--fs-3xl); font-weight: 600;
  margin: 0 0 8px; line-height: 1.25;
}
/* ECLI hned pod H1 (schválená varianta) — mono, muted, break-all. */
.h1-ecli { font-family: var(--mono); font-size: var(--fs-xs); color: var(--muted); word-break: break-all; margin: 4px 0 0; }
/* Sekční nadpis (Task 13, řádek 1 tabulky): nahrazuje dřívější verzálkový
   muted popisek (generický default) — 15px/600, fg barva, malý accent
   "praporek" před textem přes ::before (žádná nová značka v EJS). Neplatí
   pro poslední h2 ("Text rozhodnutí") — ten má vlastní styl přes
   .fulltext-divider níže a svůj ::before tam ruší. */
.wrap--decision h2 {
  display: flex; align-items: baseline; gap: 0.5rem;
  font-size: var(--fs-base); font-weight: 600; color: var(--fg);
  margin: 32px 0 12px;
}
.wrap--decision h2::before {
  content: ""; display: inline-block; flex: none;
  width: 3px; height: 15px; background: var(--accent); border-radius: 2px;
}
/* Skupinový popisek pod nadpisem (Task 13, řádek 2 tabulky) — slovně (ne jen
   barvou) odlišuje ustanovení/hesla/klíčová slova. Nahrazuje dřívější jediné
   vizuální odlišení hesel bordrem (viz a.pill--heslo níže). */
.grp-label { display: flex; align-items: center; gap: 6px; font-size: var(--fs-label); color: var(--muted); margin: 2px 0 8px; }
.grp-label svg { flex: none; }
/* Metadata (Task 13, řádek 5 tabulky): karta s rámečkem, mřížka 150px/1fr,
   hairline mezi řádky. dt i dd nesou border-bottom a nemají mezi sebou
   column-gap, takže spolu tvoří jednu souvislou linku napříč řádkem. */
.meta {
  display: grid; grid-template-columns: 150px 1fr;
  font-size: var(--fs-sm); margin: 0 0 24px;
  background: var(--card); border: 1px solid var(--border); border-radius: 8px;
  overflow: hidden;
}
.meta dt { color: var(--muted); padding: 10px 20px; border-bottom: 1px solid var(--border); }
.meta dd { margin: 0; padding: 10px 20px; border-bottom: 1px solid var(--border); font-variant-numeric: tabular-nums; }
.meta dt:last-of-type, .meta dd:last-of-type { border-bottom: none; }
.ecli { font-family: var(--mono); font-size: var(--fs-xs); color: var(--muted); word-break: break-all; }
.pills { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 8px; }
.pill {
  background: var(--pill); color: var(--pill-fg);
  padding: 4px 12px; border-radius: 999px; font-size: var(--fs-xs);
  text-decoration: none; border: 1px solid transparent;
  transition: border-color 0.15s, color 0.15s;
}
a.pill { cursor: pointer; }
a.pill:hover { border-color: var(--fg); color: var(--fg); }
/* Task 13, "TŘI VĚCI" #3: schválená varianta nekreslí hesla a klíčová slova
   jinou barvou pilulky — obě skupiny vypadají stejně (kulatá pilulka,
   --pill/--pill-fg). Rozlišení je teď výraznější, ale SLOVNÍ (.grp-label
   výš: "Prohledat rejstřík hesel" vs. "Fulltextové vyhledávání"), takže
   dřívější border-color na pill--heslo (F2, rozdíl ~11 jednotek na kanál —
   na hraně postřehnutelnosti) odpadá. Třída pill--heslo v markupu i testech
   zůstává (je to hook, ne jen styl), jen už nenese vlastní vzhled. */
.ust { display: flex; flex-direction: column; gap: 6px; }
.ust a { color: var(--accent); text-decoration: none; font-size: var(--fs-sm); }
.ust a:hover { text-decoration: underline; }
.ust .plain { color: var(--muted); font-size: var(--fs-sm); }
.meta dd a, .judge-link { color: var(--fg); text-decoration: none; border-bottom: 1px dotted var(--muted); }
.meta dd a:hover, .judge-link:hover { color: var(--accent); border-bottom-color: var(--accent); }
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 24px 0; padding: 16px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.links { display: flex; flex-direction: column; gap: 10px; margin: 8px 0 16px; }
.links .row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: var(--fs-sm); padding: 10px 12px; background: var(--card); border: 1px solid var(--border); border-radius: 8px; }
.links .row .typ { background: var(--info-bg); color: var(--info-fg); padding: 2px 8px; border-radius: 999px; font-size: var(--fs-2xs); font-weight: 500; }
.links .row .typ.back { background: var(--warn-bg); color: var(--warn-fg); }
.links .row .jc { font-family: var(--mono); font-size: var(--fs-sm); color: var(--accent); word-break: break-word; }
/* T13-b: spisová značka je od Tasku 13 obarvená akcentem jako skutečné odkazy, ale byla
   to jen <span> — falešná afordance (klik nic neudělal, fungovalo až sousední „otevřít →").
   Teď je to odkaz všude, kde cíl v DB existuje; řádky bez cíle zůstávají <span> se stejným
   vzhledem, takže se výpis vizuálně nerozpadne. */
.links .row a.jc { text-decoration: none; }
.links .row a.jc:hover { text-decoration: underline; }
.links .row .soud { color: var(--muted); font-size: var(--fs-xs); }
.links .row a.go { margin-left: auto; color: var(--accent); text-decoration: none; font-size: var(--fs-sm); }
.links .row a.go:hover { text-decoration: underline; }
.links .row .nolink { margin-left: auto; color: var(--muted); font-size: var(--fs-2xs); font-style: italic; }
/* B2: vazby odvozené heuristikou z plného textu se musí poznat na první pohled. */
.links .row .derived { background: var(--derived-bg); color: var(--derived-fg); border: 1px solid var(--derived-border); padding: 2px 8px; border-radius: 999px; font-size: var(--fs-2xs); }
.links .row .jistota { color: var(--muted); font-size: var(--fs-2xs); font-variant-numeric: tabular-nums; }
.links .row a.cand { color: var(--accent); font-size: var(--fs-xs); text-decoration: none; }
.links .row a.cand:hover { text-decoration: underline; }
.links-note { color: var(--muted); font-size: var(--fs-xs); margin: -8px 0 16px; }
.btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 16px; border-radius: 6px; text-decoration: none;
  font-size: var(--fs-sm); font-weight: 500; border: 1px solid var(--border);
  background: var(--card); color: var(--fg);
}
.btn:hover { border-color: var(--fg); }
.btn.primary { background: var(--fg); color: white; border-color: var(--fg); }
.fulltext {
  font-family: var(--serif);
  font-size: var(--fs-lg); line-height: 1.7;
  word-wrap: break-word;
  max-width: 72ch;
  margin-top: 16px;
}
.fulltext p { margin: 0 0 1rem; white-space: pre-wrap; word-wrap: break-word; text-align: justify; -webkit-hyphens: auto; hyphens: auto; }
.fulltext p:last-child { margin-bottom: 0; }
.fulltext h3.ft-h { font-family: 'Inter', sans-serif; font-size: 15px; font-weight: 600; margin: 1.6em 0 0.5em; }
.fulltext h3.ft-h:first-child { margin-top: 0; }
.empty { color: var(--muted); font-style: italic; padding: 24px; background: var(--card); border-radius: 8px; border: 1px dashed var(--border); }
@media (max-width: 640px) {
  .meta { grid-template-columns: 1fr; }
  .meta dt { font-weight: 600; margin-top: 8px; }
  .meta dt, .meta dd { border-bottom: none; padding: 4px 0; }
  .meta dd:not(:last-of-type) { border-bottom: 1px solid var(--border); padding-bottom: 8px; margin-bottom: 4px; }
  .wrap--decision h1 { font-size: var(--fs-xl); }
  /* Krok 3: a.go s margin-left:auto uvnitř flex-wrap řádku skákal na vlastní
     řádek, jakmile se .row na mobilu zalomilo — na malé šířce necháváme
     "otevřít →" plynout přirozeně za ostatními štítky místo vynuceného
     doražení doprava. */
  .links .row a.go { margin-left: 0; }
}
/* Právní věta (Task 13, řádek 7 tabulky): levý accent proužek, serif,
   BEZ bílé karty (dřív měla rámeček + pozadí + radius). */
.pravni-veta { border-left: 4px solid var(--accent); padding: 4px 0 4px 16px; font-family: var(--serif); font-size: var(--fs-md); line-height: 1.7; white-space: pre-wrap; word-wrap: break-word; margin: 0 0 8px; }
/* Dotčená ustanovení (Task 13, řádek 3 tabulky): hranatý chip s levým accent
   proužkem místo kulaté pilulky — vizuálně odlišuje ustanovení od hesel a
   klíčových slov, ne jen podle textu popisku. */
a.pill.sb {
  display: inline-flex; align-items: center;
  border-radius: 6px; border: 1px solid #bfd0f2; border-left: 4px solid var(--accent);
  background: #eef2ff; color: #3730a3; font-weight: 500;
  padding: 4px 12px 4px 10px;
}
a.pill.sb:hover { background: #e0e7ff; }
/* Předěl před textem rozhodnutí (Task 13, řádek 9 tabulky): dvojitá linka +
   serifový nadpis + popisek "verbatim". Vlastní h2::before ruší accent
   praporek zděděný z obecného .wrap--decision h2 pravidla výš. */
.fulltext-divider { display: flex; align-items: baseline; gap: 12px; border-top: 3px double var(--border); margin-top: 32px; padding-top: 24px; }
.fulltext-divider h2 { margin: 0; font-family: var(--serif); font-size: var(--fs-xl); font-weight: 600; }
.fulltext-divider h2::before { content: none; }
.fulltext-caption { font-size: var(--fs-xs); color: var(--muted); }

/* ---- search.ejs (seznam / hledání), převzato ze search.ejs:19-45 ----
   .wrap → .wrap--search (kolize s decision.ejs), .empty → .list-empty (kolize
   s decision.ejs .empty, jiné hodnoty). Holá .row v originále by přes vyšší
   specificitu .links .row v decision.ejs prosákla (border-bottom/hover navíc
   na odkazech vazeb) → přejmenováno na .list-row (sedí s .list kontejnerem). */
.wrap--search { max-width: 960px; margin: 0 auto; padding: 32px 24px 80px; }
.wrap--search h1 { font-size: var(--fs-2xl); font-weight: 700; margin: 0 0 8px; line-height: 1.3; }
.count { color: var(--muted); font-size: var(--fs-sm); margin: 0 0 20px; }
.filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 24px; }
.chip { display: inline-flex; align-items: center; gap: 6px; background: var(--card); border: 1px solid var(--border); padding: 4px 10px 4px 12px; border-radius: 999px; font-size: var(--fs-xs); color: var(--fg); }
.chip .label { color: var(--muted); font-size: var(--fs-2xs); }
.chip a.x { color: var(--muted); text-decoration: none; font-weight: 600; padding: 0 4px; }
.chip a.x:hover { color: var(--fg); }
.list { display: flex; flex-direction: column; gap: 0; background: var(--card); border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
.list-row { display: grid; grid-template-columns: 110px 1fr auto; gap: 14px; padding: 14px 16px; border-bottom: 1px solid var(--border); align-items: baseline; }
.list-row:last-child { border-bottom: none; }
.list-row:hover { background: var(--hover); }
/* Oprava neplatné deklarace `tabular-nums: true` (nebyla platné CSS) na
   `font-variant-numeric: tabular-nums` — jediná schválená hodnotová změna v tomto úkolu. */
.list-row .date { color: var(--muted); font-size: var(--fs-xs); font-variant-numeric: tabular-nums; white-space: nowrap; }
.list-row .body { min-width: 0; }
.list-row .body a.jc { color: var(--fg); text-decoration: none; font-weight: 600; font-size: var(--fs-base); }
.list-row .body a.jc:hover { color: var(--accent); }
.list-row .body .soud { color: var(--muted); font-size: var(--fs-xs); margin-left: 8px; }
.list-row .body .predmet { color: #444; font-size: var(--fs-xs); margin-top: 4px; }
.list-row .body .ecli { font-family: var(--mono); font-size: var(--fs-2xs); color: var(--muted); margin-top: 4px; word-break: break-all; }
.list-empty { padding: 48px 24px; text-align: center; color: var(--muted); background: var(--card); border: 1px dashed var(--border); border-radius: 8px; }
.pagination { display: flex; justify-content: space-between; align-items: center; margin-top: 24px; font-size: var(--fs-sm); color: var(--muted); }
.pagination a { color: var(--accent); text-decoration: none; padding: 8px 14px; border: 1px solid var(--border); border-radius: 6px; background: var(--card); }
.pagination a:hover { border-color: var(--fg); color: var(--fg); }
.pagination .spacer { flex: 1; }
@media (max-width: 640px) {
  .list-row { grid-template-columns: 1fr; gap: 4px; }
  .wrap--search h1 { font-size: var(--fs-xl); }
}

/* ---- legislativa (fragment/předpis), Task 2 balíku F ----
   legislativa-fragment.ejs a legislativa-predpis.ejs mají mnoho shodně
   pojmenovaných holých selektorů (header.brand/.brand, h1, h2, .meta, .filters,
   .chip, .pagination), které kolidují s pravidly výše (decision.ejs/search.ejs)
   i mezi sebou navzájem. Řešeno scopováním pod `.wrap--leg` (NE přejmenováním
   tříd), s explicitním resetem vlastností, které globální pravidlo nastavuje,
   ale zdrojový soubor je nikdy neměl (jinak by "prosákly" do leg stránek —
   typicky header.brand border/padding-bottom a h2 text-transform/letter-spacing/
   color). U h1 se oba soubory liší hodnotou (1.6rem vs 1.5rem) → rozlišeno
   dalším modifikátorem na wrap divu (`wrap--leg-fragment` / `wrap--leg-predpis`),
   analogicky k wrap--decision/wrap--search.

   Task 13: velikosti sjednoceny na stejnou --fs-* škálu jako zbytek souboru
   (báze teď identická 16px u obou jednotek, takže hodnoty jsou vizuálně beze
   změny tam, kde přesně padly na krok škály; sub-pixelové posuny <1px u
   ostatních jsou zamýšlený důsledek sjednocení, viz report). Nová pravidla
   `.meta`/`.jud .meta` explicitně ruší kartu (border/background/radius),
   kterou teď nese sdílená `.meta` výš — legislativa vlastní kartový vzhled
   metadat nikdy neměla a Task 13 ji tam nezavádí (mockup je jen pro
   decision.ejs). */
.wrap--leg { max-width: 760px; margin: 0 auto; padding: 2rem 1.25rem 4rem; }

.wrap--leg header.brand {
  display: flex; justify-content: space-between; align-items: center;
  padding-bottom: 0; border-bottom: none; margin-bottom: 1.5rem;
  font-size: var(--fs-xs); color: var(--muted);
}
.wrap--leg header.brand a { color: var(--accent); text-decoration: none; font-weight: 600; font-size: inherit; }

.wrap--leg-fragment h1 { font-size: var(--fs-3xl); margin: .2rem 0 .4rem; font-weight: 700; }
.wrap--leg-predpis h1 { font-size: var(--fs-2xl); margin: .2rem 0 1rem; font-weight: 700; }

.wrap--leg .predpis { font-size: var(--fs-base); color: var(--muted); margin-bottom: 1rem; }
.wrap--leg .cite { background: var(--pill); border: 1px solid var(--border); border-radius: 8px; padding: .6rem .8rem; font-size: var(--fs-xs); color: var(--pill-fg); margin: 1rem 0; }
/* Task 13, Krok 4: dlouhý čtecí režim sjednocený s .fulltext (decision.ejs) —
   stejná velikost, řádkování, zarovnání a dělení slov; šablona teď navíc
   nese lang="cs" (viz legislativa-fragment.ejs), aby dělení slov fungovalo
   podle českých pravidel stejně jako u textu rozhodnutí. overflow-x je
   defenzivní pojistka (vzor z leg-web) pro dlouhé nedělitelné tokeny, které
   by i přes hyphens/max-width mohly přetéct. */
.wrap--leg .text {
  font-family: var(--serif); font-size: var(--fs-lg); line-height: 1.7;
  max-width: 72ch; text-align: justify; -webkit-hyphens: auto; hyphens: auto;
  white-space: pre-wrap; word-wrap: break-word; overflow-x: auto;
  margin: 1.2rem 0; padding: 1rem 0;
  border-top: 1px solid var(--border); border-bottom: 1px solid var(--border);
}
.wrap--leg .ucinnost { font-size: var(--fs-2xs); color: var(--muted); margin-bottom: 1rem; font-variant-numeric: tabular-nums; }
.wrap--leg .ucinnost-warn { color: var(--err-fg); background: var(--err-bg); border: 1px solid #f5c2c0; padding: .5rem .75rem; border-radius: 6px; font-size: var(--fs-sm); }
.wrap--leg .nav { display: flex; justify-content: space-between; gap: 1rem; margin: 1.5rem 0; }
.wrap--leg .nav a { color: var(--accent); text-decoration: none; font-size: var(--fs-sm); font-weight: 500; }

.wrap--leg h2 {
  font-size: var(--fs-md); margin: 2rem 0 .6rem; font-weight: 600;
  text-transform: none; letter-spacing: normal; color: var(--fg);
}

.wrap--leg .jud { list-style: none; padding: 0; margin: 0; }
.wrap--leg .jud li { padding: .5rem 0; border-bottom: 1px solid var(--border); font-size: var(--fs-sm); }
.wrap--leg .jud a { color: var(--accent); text-decoration: none; font-weight: 500; }
/* .jud .meta reuses třídu "meta" pro jinou věc než decision.ejs dl.meta — bez
   explicitního resetu by sem prosákl grid layout i nová karta (border/
   background/radius) z dekorativního .meta výše. */
.wrap--leg .jud .meta { display: block; margin: 0; border: none; background: none; border-radius: 0; color: var(--muted); font-size: var(--fs-xs); }
.wrap--leg .jud-empty { color: var(--muted); font-size: var(--fs-sm); margin: .5rem 0; }

.wrap--leg .filters { display: flex; flex-wrap: wrap; gap: 6px; margin: .75rem 0; }
.wrap--leg .chip { display: inline-flex; align-items: center; gap: 4px; background: var(--pill); border: 1px solid var(--border); padding: 3px 10px; border-radius: 999px; font-size: var(--fs-xs); color: var(--pill-fg); text-decoration: none; }
.wrap--leg .chip.active { background: var(--accent); border-color: var(--accent); color: #fff; }
.wrap--leg .chip .n { font-weight: 600; }

.wrap--leg .pagination { display: flex; justify-content: space-between; align-items: center; margin-top: 1rem; font-size: var(--fs-xs); color: var(--muted); }
.wrap--leg .pagination a { color: var(--accent); text-decoration: none; padding: 6px 12px; border: 1px solid var(--border); border-radius: 6px; background: var(--pill); }
/* Task 13, "TŘI VĚCI" #1: explicitní no-op hover. Specificita je identická s
   `.pagination a:hover` výš (sekce search.ejs) — bez tohohle pravidla by
   chování záviselo na pořadí pravidel v souboru, což se při přeuspořádání
   CSS v tomto úkolu snadno rozbije. Legislativní stránkování nikdy hover
   efekt nemělo, takže tu jen znovu potvrzujeme klidový vzhled. */
.wrap--leg .pagination a:hover { border-color: var(--border); color: var(--accent); }

.wrap--leg dl.meta { display: grid; grid-template-columns: auto 1fr; gap: .35rem 1rem; font-size: var(--fs-sm); margin: 1rem 0; border: none; background: none; border-radius: 0; overflow: visible; }
/* dl.meta dt/dd: originál nikdy neměl font-weight/margin-top (uniklo by z media
   query .meta dt výše) ani margin:0 na dd (uniklo by z .meta dd výše a smazalo
   by výchozí odsazení prohlížeče, které originál taky nikdy nepřepisoval).
   Krok 3: min-width:0 + overflow-wrap na dd — bez nich přetékal dlouhý název
   předpisu/hodnota mimo grid track. padding/border-bottom nulujeme, protože
   je teď nastavuje sdílené .meta dt/.meta dd výše (karta pro decision.ejs). */
.wrap--leg dl.meta dt { color: var(--muted); font-weight: normal; margin-top: 0; padding: 0; border-bottom: none; }
.wrap--leg dl.meta dd { margin: revert; padding: 0; border-bottom: none; min-width: 0; overflow-wrap: break-word; }
@media (max-width: 640px) {
  .wrap--leg dl.meta { grid-template-columns: 1fr; }
}

/* ---- not-found.ejs (404 stránka rozhodnutí) ----
   Historicky bez div.wrap — stylovalo se přímo tělo <body> (padding 80px,
   text-align:center). Nový modifikátor wrap--notfound drží layout 1:1, ale
   NEsdílí wrap--leg (ten má jiný padding/max-width a jeho vlastní h1/p by se
   s touto stránkou nezávisle kolidovaly). Barvy byly shodné hex hodnoty jako
   tokeny níže → převedeno na var(). Font se poprvé skutečně načítá (viz <link>
   v not-found.ejs) — schválená výjimka mimo tabular-nums fix.
   Oprava 1/5 (Important): sdílené `body` pravidlo výše vnucuje line-height:1.6,
   který originální inline styl not-found.ejs nikdy neměl (jen font-family/
   background/color/margin/padding/text-align) — bez resetu by šlo o
   neschválenou vizuální změnu (jiné řádkování). `line-height: normal` obnovuje
   prohlížečovou výchozí hodnotu, kterou originál fakticky měl. */
.wrap--notfound { padding: 80px 24px; text-align: center; line-height: normal; }
.wrap--notfound h1 { font-size: var(--fs-3xl); margin: 0 0 12px; }
.wrap--notfound p { color: var(--muted); max-width: 480px; margin: 0 auto 8px; }
.wrap--notfound code { background: var(--pill); padding: 2px 8px; border-radius: 4px; font-size: var(--fs-xs); }
.wrap--notfound a { color: var(--accent); }
@media (max-width: 640px) {
  .wrap--notfound { padding: 48px 20px; }
  .wrap--notfound h1 { font-size: var(--fs-xl); }
}

/* ---- home.ejs (veřejný rozcestník na /), Task 3 balíku F ----
   Nová stránka (brief zná jen díru na "/", žádný zdrojový soubor k 1:1 přenosu
   nemá) — proto vlastní malý blok místo "převzato z X", ale drží se stejné
   sady tokenů jako zbytek souboru (žádné nové barvy). `.actions`/`.btn`
   výše (decision.ejs sekce) se recyklují beze změny pro dva odkazy; jen
   zarovnání na střed doplněno scopovaně, ať to neovlivní decision.ejs. */
.wrap--home { max-width: 640px; margin: 0 auto; padding: 80px 24px; text-align: center; }
.wrap--home h1 { font-size: var(--fs-4xl); font-weight: 700; margin: 0 0 12px; }
.wrap--home p { color: var(--muted); font-size: var(--fs-md); margin: 0 0 32px; }
.wrap--home .actions { justify-content: center; margin: 0; padding: 0; border: none; }
