/* menegio — design tokens. GENEROVÁNO z tokens/*.json — needitujte ručně. */
/* Barvy: řetěz Mapped → Alias → Brand přes var(); hex existuje jen v Brand. */
:root {

  /* ===== BRAND — surové barvy (jediné hex) ===== */
  --mng-color-terracotta-50: #FBEEE7;  /* Nejsvětlejší terracotta — podklad pilulky a jemných výzev. */
  --mng-color-terracotta-100: #F4D2C2;  /* Světlá terracotta — linky a plochy na tmavém podkladu. */
  --mng-color-terracotta-300: #E08D63;  /* Světlá smyčka — akcent v tmavém režimu, na tmavé ploše 6,91:1. */
  --mng-color-terracotta-500: #C24A1F;  /* Terracotta — základ značky: smyčka, hlavní tlačítko, odkaz. */
  --mng-color-terracotta-700: #93350F;  /* Tmavá terracotta — hover tlačítka a text stavu na cestě. */
  --mng-color-terracotta-900: #5A1F07;  /* Nejtmavší terracotta — tisk a velké plochy značky. */
  --mng-color-inkoust-100: #E7E9EC;  /* Nejsvětlejší inkoust — linky na tmavé ploše. */
  --mng-color-inkoust-300: #ADB2BA;  /* Světlý inkoust — obrysy polí, doplňkový text na tmavém. */
  --mng-color-inkoust-500: #6B717C;  /* Tlumený inkoust — popisky a tlumený text (4,70:1 na papíru). */
  --mng-color-inkoust-700: #3A4048;  /* Inkoust — běžný text, druhé tlačítko, obrysy. */
  --mng-color-inkoust-800: #20252C;  /* Tmavý inkoust — tmavé sekce webu a plocha v tmavém režimu. */
  --mng-color-inkoust-900: #15181D;  /* Nejtmavší inkoust — nadpisy a plocha stránky v tmavém režimu. */
  --mng-color-papir-0: #FFFFFF;  /* Bílá — karty a pole nad plochou stránky. */
  --mng-color-papir-50: #FBFAF7;  /* Papír — plocha celé stránky ve světlém režimu. */
  --mng-color-papir-100: #F6F4EF;  /* Teplý papír — odsazené sekce a text na tmavé ploše. */
  --mng-color-papir-200: #ECE8DF;  /* Tmavší papír — linky, oddělovače a obrysy karet. */
  --mng-color-petrol-100: #E3F0EE;  /* Světlý petrol — podklad stavu doručeno. */
  --mng-color-petrol-300: #5CA89C;  /* Střední petrol — stav doručeno v tmavém režimu. */
  --mng-color-petrol-500: #0E6E63;  /* Petrol — doplňková barva, ikona hotového kroku. */
  --mng-color-petrol-700: #0A5048;  /* Tmavý petrol — text stavu doručeno (7,97:1 na světlém petrolu). */
  --mng-color-amber-100: #FAEEDA;  /* Světlý amber — podklad stavu karanténa. */
  --mng-color-amber-700: #854F0B;  /* Tmavý amber — text stavu karanténa. */
  --mng-color-cervena-50: #FBE9E8;  /* Světlá červená — podklad chybové hlášky. */
  --mng-color-cervena-300: #E57373;  /* Světlá chybová — chyba v tmavém režimu. */
  --mng-color-cervena-500: #C62828;  /* Červená — chyba a destruktivní akce. Značka ji nemá, je systémová. */
  --mng-color-cervena-700: #8E1B1B;  /* Tmavá červená — text chyby na světlém podkladu. */

  /* ===== ALIAS — role značky ===== */
  --mng-primary: var(--mng-color-inkoust-700);  /* Inkoust je kotva značky — běžný text, druhé tlačítko, obrysy. */
  --mng-primary-light: var(--mng-color-inkoust-500);
  --mng-primary-lighter: var(--mng-color-inkoust-300);
  --mng-primary-dark: var(--mng-color-inkoust-900);  /* Nejtmavší inkoust — nadpisy. */
  --mng-secondary: var(--mng-color-papir-100);  /* Teplý papír — odsazené sekce, štítky a jemně podbarvené bloky. */
  --mng-secondary-dark: var(--mng-color-papir-200);
  --mng-accent: var(--mng-color-terracotta-500);  /* Terracotta — podpis značky: smyčka, číslo v tmavé kartě, linka sekce. */
  --mng-accent-light: var(--mng-color-terracotta-50);
  --mng-accent-dark: var(--mng-color-terracotta-700);
  --mng-conversion: var(--mng-color-terracotta-500);  /* Hlavní tlačítko a odkaz. Bílý text na ní má 4,89:1. */
  --mng-conversion-dark: var(--mng-color-terracotta-700);  /* Hover hlavního tlačítka jde ve světlém režimu do tmava (7,62:1 s bílou). */
  --mng-neutral: var(--mng-color-inkoust-500);  /* Tlumený text a popisky — 4,70:1 na papíru. */
  --mng-neutral-light: var(--mng-color-papir-200);  /* Linka, obrys karty a podklad neutrálního štítku. */
  --mng-neutral-lighter: var(--mng-color-papir-100);
  --mng-neutral-dark: var(--mng-color-inkoust-700);
  --mng-neutral-strong: var(--mng-color-inkoust-300);  /* Silnější obrys — pole formuláře, výrazná hranice. */
  --mng-neutral-soft: var(--mng-color-inkoust-300);  /* Zástupný a neaktivní text. Záměrně tlumený, nikdy pro obsah. */
  --mng-neutral-subtle: var(--mng-color-papir-100);
  --mng-surface: var(--mng-color-papir-50);  /* Papír — plocha celé stránky. */
  --mng-surface-raised: var(--mng-color-papir-0);  /* Bílá — karty a pole nad plochou. */
  --mng-surface-invert: var(--mng-color-inkoust-800);  /* Tmavá sekce — architektura platformy, závěrečná výzva, patička. */
  --mng-on-surface: var(--mng-color-inkoust-900);
  --mng-on-invert: var(--mng-color-papir-100);  /* Text na tmavé sekci — 14,02:1 na tmavém inkoustu. */
  --mng-on-invert-muted: var(--mng-color-inkoust-300);  /* Doplňkový text na tmavé sekci — 7,2:1. */
  --mng-on-tint: var(--mng-color-inkoust-900);  /* Text na barevném podkladu štítku. */
  --mng-on-action: var(--mng-color-papir-0);  /* Bílá na terracottovém tlačítku (4,89:1). */
  --mng-on-action-secondary: var(--mng-color-papir-0);  /* Bílá na inkoustovém druhém tlačítku. */
  --mng-success: var(--mng-color-petrol-700);  /* Doručeno, hotovo — podle manuálu petrol. */
  --mng-success-light: var(--mng-color-petrol-100);
  --mng-warning: var(--mng-color-amber-700);  /* Karanténa a varování — podle manuálu amber. */
  --mng-warning-light: var(--mng-color-amber-100);
  --mng-error: var(--mng-color-cervena-500);  /* Chyba a destruktivní akce. Systémová barva, značka ji nemá. */
  --mng-error-light: var(--mng-color-cervena-50);
  --mng-info: var(--mng-color-terracotta-700);  /* Na cestě, informace — podle manuálu terracotta (6,71:1 na světlé). */
  --mng-info-light: var(--mng-color-terracotta-50);

  /* ===== MAPPED — sloty použití (jediná vrstva pro komponenty) ===== */
  --mng-background-page: var(--mng-surface);
  --mng-background-surface: var(--mng-surface-raised);  /* Plocha nad stránkou — karty, tabulky, inputy. */
  --mng-background-subtle: var(--mng-secondary);  /* Jemně podbarvený blok — poznámka, citát, krok procesu. */
  --mng-background-section: var(--mng-surface);
  --mng-background-section-dark: var(--mng-surface-invert);  /* Tmavá sekce (hero s logem, patička). */
  --mng-background-chip-primary: var(--mng-secondary);
  --mng-background-chip-secondary: var(--mng-neutral-light);
  --mng-background-chip-conversion: var(--mng-accent-light);
  --mng-background-row-hover: var(--mng-secondary);
  --mng-background-muted: var(--mng-neutral-subtle);  /* Jemná neutrální plocha — pruh v tabulce, podklad bloku. */
  --mng-background-disabled: var(--mng-neutral-subtle);  /* Výplň vypnutého prvku. */
  --mng-border: var(--mng-neutral-light);
  --mng-border-strong: var(--mng-primary);
  --mng-border-accent: var(--mng-conversion);
  --mng-border-outline: var(--mng-neutral-strong);  /* Výrazný obrys — pole formuláře, tlačítko s obrysem. Jemné oddělovače zůstávají na cremě. */
  --mng-text-default: var(--mng-on-surface);
  --mng-text-headline: var(--mng-primary-dark);  /* Nadpisy jedou nocí, o stupeň tmavší než běžný text. */
  --mng-text-secondary: var(--mng-primary);
  --mng-text-muted: var(--mng-neutral);  /* Popisky, metadata a doplňkové texty. Na tmavou plochu ani barevnou výplň nepatří. */
  --mng-text-reversed: var(--mng-on-invert);
  --mng-text-on-dark: var(--mng-on-invert-muted);  /* Doplňkový text na tmavé sekci. */
  --mng-text-on-chip: var(--mng-primary);  /* Text ve štítku (novinka, sezóna, vegan). */
  --mng-text-accent: var(--mng-conversion);
  --mng-text-link: var(--mng-primary);
  --mng-text-link-hover: var(--mng-conversion);
  --mng-text-placeholder: var(--mng-neutral-soft);  /* Text v prázdném poli. */
  --mng-text-disabled: var(--mng-neutral-soft);  /* Popisek vypnutého prvku. */
  --mng-text-on-tint: var(--mng-on-tint);  /* Tělo alertu a poznámky — tmavý text na světlém tintu, v obou režimech stejně. */
  --mng-icon-default: var(--mng-on-surface);
  --mng-icon-muted: var(--mng-neutral);
  --mng-icon-accent: var(--mng-conversion);
  --mng-icon-on-dark: var(--mng-on-invert);
  --mng-button-default: var(--mng-conversion);  /* Hlavní tlačítko nese terracottu — jediná akční barva na stránce. V tmavém režimu ji střídá terracotta 300. */
  --mng-button-hover: var(--mng-conversion-dark);
  --mng-button-text: var(--mng-on-action);  /* Bílá na terracottě (4,89:1) ve světlém režimu, inkoust na světlé terracottě (6,91:1) v tmavém. */
  --mng-button-secondary: var(--mng-primary);
  --mng-button-secondary-text: var(--mng-on-action-secondary);  /* Inkoustové tlačítko v tmavém režimu zesvětlá — popisek na něm musí ztmavnout stejně jako u hlavního. */
  --mng-button-outline-text: var(--mng-primary);  /* Obrysové tlačítko — popisek. Tišší než sekundární, pro odkaz, který není akcí obrazovky. */
  --mng-button-outline-line: var(--mng-primary);  /* Obrysové tlačítko — obrys. Stálý, ne indikace najetí; prstenec patří fokusu. */
  --mng-button-ghost-text: var(--mng-primary);  /* Druhotná akce bez výplně — text s podtrženou linkou. */
  --mng-button-ghost-hover: var(--mng-conversion);
  --mng-button-ghost-line: var(--mng-neutral-light);
  --mng-button-destructive: var(--mng-error);  /* Nevratná akce. Jediné místo, kde se v rozhraní objeví červená. */
  --mng-button-destructive-text: var(--mng-on-invert);
  --mng-card-background: var(--mng-surface-raised);
  --mng-card-border: var(--mng-neutral-light);
  --mng-card-featured-background: var(--mng-surface-invert);  /* Vypíchnutá karta (údaj z provozu, reference) je tmavý inkoust. */
  --mng-card-featured-label: var(--mng-on-invert-muted);
  --mng-card-featured-value: var(--mng-accent);  /* Číslo nebo krátký údaj na tmavé kartě svítí terracottou 300 (6,91:1). */
  --mng-card-featured-detail: var(--mng-on-invert);
  --mng-focus: var(--mng-primary-light);  /* Focus ring. Tlumený inkoust na papíru, světlá linka na tmavé ploše v tmavém režimu. */
  --mng-state-success: var(--mng-success);
  --mng-state-success-light: var(--mng-success-light);
  --mng-state-warning: var(--mng-warning);
  --mng-state-warning-light: var(--mng-warning-light);
  --mng-state-error: var(--mng-error);
  --mng-state-error-light: var(--mng-error-light);
  --mng-state-info: var(--mng-info);
  --mng-state-info-light: var(--mng-info-light);

  /* ===== TYPOGRAPHY — písma, váhy, škály ===== */
  --mng-font-display: 'Schibsted Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;  /* Schibsted Grotesk — nadpisy i wordmark. Značka druhé písmo na nadpisy nemá. */
  --mng-font-body: 'Schibsted Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;  /* Totéž písmo v textu — jednota je záměr, rozdíl dělá řez a velikost. */
  --mng-font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;  /* JetBrains Mono — kód, adresy služeb, identifikátory a čísla v tabulkách. */
  --mng-font-weight-light: 400;  /* Značka lehčí řez než Regular nepoužívá — token míří na Regular. */
  --mng-font-weight-regular: 400;
  --mng-font-weight-medium: 500;  /* H3, popisky odkazů a navigace. */
  --mng-font-weight-semibold: 600;  /* Wordmark, nadpisy a tlačítka. Nejtěžší řez, který značka má. */
  --mng-font-weight-bold: 600;  /* Tučnější řez než SemiBold se nesází — token míří zpět na SemiBold. */
  --mng-font-weight-display: var(--mng-font-weight-semibold);  /* Řez nadpisů podle manuálu: Display, H1 i H2 jsou SemiBold. */
  --mng-display-2xl-size: clamp(2.25rem, 1.45rem + 3.4vw, 3.75rem);  /* 36→60px — hero webu. Nad rámec manuálu, který končí u 44px. */
  --mng-display-xl-size: clamp(2rem, 1.7rem + 1.3vw, 2.75rem);  /* 32→44px — Display z manuálu, nadpis sekce. */
  --mng-display-lg-size: 2rem;  /* 32px — H1 z manuálu. */
  --mng-display-md-size: 1.5rem;  /* 24px — H2 z manuálu. */
  --mng-display-sm-size: 1.125rem;  /* 18px — H3 z manuálu, nejmenší nadpisový stupeň. */
  --mng-display-line-height-tight: 1.09;  /* 44/48 z manuálu — jednořádkový Display. */
  --mng-display-line-height: 1.19;  /* 32/38 z manuálu — víceřádkový nadpis, háčky nad verzálkami potřebují vzduch. */
  --mng-display-letter-spacing: -0.02em;  /* Manuál stahuje Display o 1px a H1 o 0,5px — v em to vychází na -0,02. */
  --mng-display-transform: none;  /* Nadpisy se NEverzálkují. Wordmark menegio se píše minuskami i na začátku věty. */
  --mng-label-size: 0.8125rem;  /* 13px — Popisek z manuálu: štítek, pilulka stavu, popiska pod obrázkem. */
  --mng-label-letter-spacing: 0;  /* Bez prostrkání — značka prostrkané verzálky jako štítek nepoužívá. */
  --mng-label-transform: none;  /* Štítek se sází běžným písmem, ne verzálkami. */
  --mng-label-weight: var(--mng-font-weight-medium);
  --mng-text-xs-size: 0.75rem;  /* 12px — drobná metadata a právní texty. */
  --mng-text-xs-line-height: 1.4;
  --mng-text-sm-size: 0.8125rem;  /* 13px — Popisek a Mono z manuálu. */
  --mng-text-sm-line-height: 1.46;  /* 13/19 z manuálu. */
  --mng-text-md-size: 1rem;  /* 16px — základní text webu i rozhraní. */
  --mng-text-md-line-height: 1.625;  /* 16/26 z manuálu. */
  --mng-text-lg-size: 1.125rem;  /* 18px — perex a úvodní odstavec. */
  --mng-text-lg-line-height: 1.56;
  --mng-text-xl-size: 1.25rem;  /* 20px — úvodní věta sekce na webu. */
  --mng-text-xl-line-height: 1.5;
  --mng-text-letter-spacing: 0;  /* Text se netrackuje. */
  --mng-text-heading-letter-spacing: -0.015em;  /* Nadpisy v rozhraní — manuál stahuje H2 o 0,3px. */
  --mng-heading-letter-spacing: var(--mng-text-heading-letter-spacing);  /* Zkratka pro nadpisy v UI — ukazuje na typografickou škálu, aby se ladila na jednom místě. */

  /* ===== DIMENSION — spacing, radius, stíny, motion, … ===== */
  --mng-space-0: 0;
  --mng-space-1: 0.25rem;  /* 4px */
  --mng-space-2: 0.5rem;  /* 8px */
  --mng-space-3: 0.75rem;  /* 12px */
  --mng-space-4: 1rem;  /* 16px */
  --mng-space-5: 1.25rem;  /* 20px */
  --mng-space-6: 1.5rem;  /* 24px */
  --mng-space-8: 2rem;  /* 32px */
  --mng-space-10: 2.5rem;  /* 40px */
  --mng-space-12: 3rem;  /* 48px */
  --mng-space-16: 4rem;  /* 64px */
  --mng-space-20: 5rem;  /* 80px */
  --mng-space-24: 6rem;  /* 96px */
  --mng-space-32: 8rem;  /* 128px */
  --mng-space-inline-gap: var(--mng-space-2);  /* ikona ↔ text */
  --mng-space-stack-gap: var(--mng-space-4);  /* prvky ve formuláři/kartě */
  --mng-space-card-padding: var(--mng-space-6);
  --mng-space-section-gap: clamp(3rem, 8vw, 6rem);  /* mezi sekcemi (fluid) */
  --mng-space-container-max: 75rem;  /* 1200px */
  --mng-space-container-pad: clamp(1rem, 4vw, 2rem);
  --mng-radius-xs: 0.125rem;  /* 2px — štítky, checkboxy */
  --mng-radius-s: 0.1875rem;  /* 3px — tlačítka */
  --mng-radius-m: 0.25rem;  /* 4px — karty, inputy */
  --mng-radius-l: 0.375rem;  /* 6px — panely */
  --mng-radius-xl: 0.5rem;  /* 8px — sekční kontejnery */
  --mng-radius-2xl: 0.75rem;  /* 12px — maximum, používat výjimečně */
  --mng-radius-pill: 62.4375rem;  /* 999px — pills, badges */
  --mng-radius-round: 50%;  /* avatary, ikonové kruhy */
  --mng-radius-control-tiny: var(--mng-radius-xs);  /* drobné ovládací prvky (checkbox, malý chip) */
  --mng-radius-control-small: var(--mng-radius-xs);  /* malé ovládací prvky (button small, tag) */
  --mng-radius-control: var(--mng-radius-s);  /* ovládací prvky (button medium/large, input) */
  --mng-radius-container: var(--mng-radius-m);  /* VELIKOSTNÍ KONTEXT: kontejner = o krok výš než ovládací prvek (karty nad tlačítky) */
  --mng-radius-container-large: var(--mng-radius-l);  /* VELIKOSTNÍ KONTEXT: o 2 kroky výš (modal/panel nad ovládacími prvky) */
  --mng-radius-container-section: var(--mng-radius-xl);  /* VELIKOSTNÍ KONTEXT: o 3 kroky výš (hero, sekční kontejnery nad panely) */
  --mng-icon-tiny: 1rem;  /* 16px — inline v textu a v drobném UI (tah 2px je tu už hutný, používat výjimečně) */
  --mng-icon-small: 1.25rem;  /* 20px — v tlačítkách, labelech a metadatech */
  --mng-icon-medium: 1.5rem;  /* 24px — výchozí; nativní grid sady Tabler, tah 2px sedí bez kompromisu */
  --mng-icon-large: 2rem;  /* 32px — USP bloky, prázdné stavy, ikonové kruhy */
  --mng-border-width-s: 1px;
  --mng-border-width-m: 2px;
  --mng-border-width-l: 4px;  /* akcentní pruh */
  --mng-shadow-color: 21 24 29;  /* RGB kanály inkoustu 900 — stíny jsou tónované barvou textu, ne černé */
  --mng-shadow-xs: 0 1px 2px rgb(var(--mng-shadow-color) / 0.06);
  --mng-shadow-s: 0 1px 3px rgb(var(--mng-shadow-color) / 0.08), 0 1px 2px rgb(var(--mng-shadow-color) / 0.05);
  --mng-shadow-m: 0 4px 8px rgb(var(--mng-shadow-color) / 0.08), 0 2px 4px rgb(var(--mng-shadow-color) / 0.05);
  --mng-shadow-l: 0 12px 24px rgb(var(--mng-shadow-color) / 0.10), 0 4px 8px rgb(var(--mng-shadow-color) / 0.05);
  --mng-shadow-xl: 0 24px 48px rgb(var(--mng-shadow-color) / 0.14);  /* modaly */
  --mng-shadow-focus: 0 0 0 3px rgb(58 64 72 / 0.35);  /* focus ring — inkoust 700, ladí s --mng-focus. POZOR: rgb() trojice, hex gate ji nechytí; při změně značky se musí přepsat ručně. */
  --mng-z-base: 0;
  --mng-z-raised: 10;
  --mng-z-dropdown: 1000;
  --mng-z-sticky: 1100;
  --mng-z-overlay: 1300;
  --mng-z-modal: 1400;
  --mng-z-popover: 1500;
  --mng-z-toast: 1700;
  --mng-duration-instant: 100ms;  /* hover feedback */
  --mng-duration-fast: 150ms;  /* tlačítka, inputy */
  --mng-duration-base: 250ms;  /* dropdowny, accordion */
  --mng-duration-slow: 400ms;  /* modaly */
  --mng-ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --mng-ease-enter: cubic-bezier(0, 0, 0.2, 1);
  --mng-ease-exit: cubic-bezier(0.4, 0, 1, 1);
  --mng-transition-interactive: background-color var(--mng-duration-fast) var(--mng-ease-standard), color var(--mng-duration-fast) var(--mng-ease-standard), border-color var(--mng-duration-fast) var(--mng-ease-standard), box-shadow var(--mng-duration-fast) var(--mng-ease-standard);  /* sjednocený přechod pro interaktivní prvky */
  --mng-bp-xs: 30rem;  /* 480px — POZOR: CSS var nefunguje v media queries; použijte literál. Tady pro JS/dokumentaci. */
  --mng-bp-sm: 48rem;  /* 768px */
  --mng-bp-md: 64rem;  /* 1024px */
  --mng-bp-lg: 80rem;  /* 1280px */
  --mng-bp-xl: 96rem;  /* 1536px */
}

/* ===== DARK REŽIM =====
   Přepisuje se jen to, co se opravdu liší — zbytek se překlopí sám, protože
   ukazuje na roli, která se překlopila. Blok je záměrně dvakrát: v media query
   platí systémová preference, samostatný selektor je ruční přepnutí, které
   vyhrává v obou směrech (proto je až za ním a proto ta `:not()` výjimka). */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --mng-accent: var(--mng-color-terracotta-300);  /* Světlá smyčka — na tmavé ploše 6,91:1. */
    --mng-accent-dark: var(--mng-color-terracotta-100);
    --mng-accent-light: var(--mng-color-inkoust-800);
    --mng-conversion: var(--mng-color-terracotta-300);  /* Hlavní tlačítko je v tmavém režimu světlá terracotta s tmavým textem. */
    --mng-conversion-dark: var(--mng-color-terracotta-100);  /* Hover v tmavém režimu jde do světla. */
    --mng-error: var(--mng-color-cervena-300);  /* Světlá chybová — na tmavé ploše 5,16:1. */
    --mng-error-light: var(--mng-color-inkoust-800);
    --mng-info: var(--mng-color-terracotta-300);
    --mng-info-light: var(--mng-color-inkoust-800);
    --mng-neutral: var(--mng-color-inkoust-300);
    --mng-neutral-dark: var(--mng-color-papir-100);
    --mng-neutral-light: var(--mng-color-inkoust-700);
    --mng-neutral-lighter: var(--mng-color-inkoust-800);
    --mng-neutral-soft: var(--mng-color-inkoust-500);
    --mng-neutral-strong: var(--mng-color-inkoust-500);
    --mng-neutral-subtle: var(--mng-color-inkoust-800);
    --mng-on-action: var(--mng-color-inkoust-900);  /* Na světlém tlačítku je v tmavém režimu inkoust (manuál: na-akcentu). */
    --mng-on-action-secondary: var(--mng-color-inkoust-900);
    --mng-on-surface: var(--mng-color-papir-100);
    --mng-on-tint: var(--mng-color-papir-100);
    --mng-primary: var(--mng-color-papir-100);  /* V tmavém režimu nese text papír — inkoust je pod ním plocha. */
    --mng-primary-dark: var(--mng-color-papir-0);  /* Nadpis v tmavém režimu je nejsvětlejší, ne nejtmavší. */
    --mng-primary-light: var(--mng-color-inkoust-300);
    --mng-primary-lighter: var(--mng-color-inkoust-500);
    --mng-secondary: var(--mng-color-inkoust-800);
    --mng-secondary-dark: var(--mng-color-inkoust-700);
    --mng-success: var(--mng-color-petrol-300);  /* Na tmavé ploše 5,53:1 — tmavý petrol by zmizel. */
    --mng-success-light: var(--mng-color-inkoust-800);
    --mng-surface: var(--mng-color-inkoust-900);
    --mng-surface-raised: var(--mng-color-inkoust-800);
    --mng-warning: var(--mng-color-amber-100);
    --mng-warning-light: var(--mng-color-inkoust-800);
    --mng-button-destructive-text: var(--mng-on-action);  /* V tmavém režimu je destruktivní tlačítko SVĚTLÉ (červená 300), takže popisek musí být inkoust — papír by na něm měl 2,72:1. */
  }
}
:root[data-theme="dark"] {
  --mng-accent: var(--mng-color-terracotta-300);  /* Světlá smyčka — na tmavé ploše 6,91:1. */
  --mng-accent-dark: var(--mng-color-terracotta-100);
  --mng-accent-light: var(--mng-color-inkoust-800);
  --mng-conversion: var(--mng-color-terracotta-300);  /* Hlavní tlačítko je v tmavém režimu světlá terracotta s tmavým textem. */
  --mng-conversion-dark: var(--mng-color-terracotta-100);  /* Hover v tmavém režimu jde do světla. */
  --mng-error: var(--mng-color-cervena-300);  /* Světlá chybová — na tmavé ploše 5,16:1. */
  --mng-error-light: var(--mng-color-inkoust-800);
  --mng-info: var(--mng-color-terracotta-300);
  --mng-info-light: var(--mng-color-inkoust-800);
  --mng-neutral: var(--mng-color-inkoust-300);
  --mng-neutral-dark: var(--mng-color-papir-100);
  --mng-neutral-light: var(--mng-color-inkoust-700);
  --mng-neutral-lighter: var(--mng-color-inkoust-800);
  --mng-neutral-soft: var(--mng-color-inkoust-500);
  --mng-neutral-strong: var(--mng-color-inkoust-500);
  --mng-neutral-subtle: var(--mng-color-inkoust-800);
  --mng-on-action: var(--mng-color-inkoust-900);  /* Na světlém tlačítku je v tmavém režimu inkoust (manuál: na-akcentu). */
  --mng-on-action-secondary: var(--mng-color-inkoust-900);
  --mng-on-surface: var(--mng-color-papir-100);
  --mng-on-tint: var(--mng-color-papir-100);
  --mng-primary: var(--mng-color-papir-100);  /* V tmavém režimu nese text papír — inkoust je pod ním plocha. */
  --mng-primary-dark: var(--mng-color-papir-0);  /* Nadpis v tmavém režimu je nejsvětlejší, ne nejtmavší. */
  --mng-primary-light: var(--mng-color-inkoust-300);
  --mng-primary-lighter: var(--mng-color-inkoust-500);
  --mng-secondary: var(--mng-color-inkoust-800);
  --mng-secondary-dark: var(--mng-color-inkoust-700);
  --mng-success: var(--mng-color-petrol-300);  /* Na tmavé ploše 5,53:1 — tmavý petrol by zmizel. */
  --mng-success-light: var(--mng-color-inkoust-800);
  --mng-surface: var(--mng-color-inkoust-900);
  --mng-surface-raised: var(--mng-color-inkoust-800);
  --mng-warning: var(--mng-color-amber-100);
  --mng-warning-light: var(--mng-color-inkoust-800);
  --mng-button-destructive-text: var(--mng-on-action);  /* V tmavém režimu je destruktivní tlačítko SVĚTLÉ (červená 300), takže popisek musí být inkoust — papír by na něm měl 2,72:1. */
}