/* Služebkář.cz – design tokens (redesign 2026, styl 1a)
   Zdroj: THEMES v prototypech (Kalkulacka.dc.html). Světlý = :root, tmavý = [data-theme="dark"].
   Font: Manrope 400–800, hostovaný lokálně (fonts/manrope/, OFL – fonts/manrope/OFL.txt), fallback system-ui.
   Žádný požadavek na Google Fonts (DECISIONS.md bod 3). Variabilní řez (wght 200–800) z @fontsource-variable/manrope 5.3.0,
   subsety latin + latin-ext (čeština potřebuje oba); oba soubory se přednačítají v <head> každé stránky.
   Tmavý režim: [data-theme="dark"] nastavuje components/theme-init.js (před prvním vykreslením) a přepínač v hlavičce.
   Chybové --er/--erbg/--erb prototypy nemají – převzaté z hromadného importu (fáze 5), sdílené od DECISIONS.md bodu 24. */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url(/fonts/manrope/manrope-latin-ext-wght-normal.woff2) format('woff2-variations'), url(/fonts/manrope/manrope-latin-ext-wght-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: 'Manrope';
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url(/fonts/manrope/manrope-latin-wght-normal.woff2) format('woff2-variations'), url(/fonts/manrope/manrope-latin-wght-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;
}
:root {
  color-scheme: light;
  --bg: #f5f7fb; /* Pozadí stránky */
  --bg2: #e4e8ef; /* Pozadí za mobilním rámem */
  --glow: radial-gradient(55% 100% at 25% 0%, rgba(96,150,255,.17), rgba(96,150,255,0) 70%); /* Záře pod hlavičkou (background main) */
  --hd: rgba(255,255,255,.84); /* Hlavička (sticky, blur 14px) */
  --hdb: #e6ebf3; /* Spodní linka hlavičky / horní linka patičky */
  --card: #ffffff; /* Karta */
  --cb: #e7ecf4; /* Okraj karty */
  --csh: 0 1px 2px rgba(15,26,51,.04),0 10px 30px rgba(30,60,120,.05); /* Stín karty */
  --sh2: 0 1px 2px rgba(15,26,51,.04),0 20px 50px rgba(30,60,120,.13); /* Stín plovoucích prvků (dropdown, panel, souhrn) */
  --fld: #f7f9fc; /* Výplň pole */
  --fb: #e1e7f0; /* Okraj pole */
  --t1: #0f1a33; /* Text primární */
  --t2: #2c3850; /* Text sekundární */
  --t3: #4a5a7a; /* Text terciární */
  --t4: #5f6b82; /* Text popisky */
  --t5: #8a95a8; /* Text placeholder/jednotky */
  --ac: #2563eb; /* Akcent */
  --ac2: #1d4ed8; /* Akcent text/odkaz */
  --at: #e8f0fe; /* Akcent tint (hover, aktivní) */
  --at2: #f2f6ff; /* Akcent tint jemný */
  --acb: #2563eb; /* Akcent okraj */
  --seg: #e9edf4; /* Segment pozadí */
  --segon: #ffffff; /* Segment aktivní */
  --segsh: 0 1px 3px rgba(15,26,51,.12); /* Segment aktivní stín */
  --dv: #eef1f6; /* Oddělovač */
  --sumhd: linear-gradient(160deg,#f3f7ff,#e3edff); /* Pozadí hlavičky souhrnu / zvýrazněné karty */
  --btn: linear-gradient(180deg,#3b82f6,#1d4ed8); /* Primární tlačítko (gradient) */
  --btnsh: 0 6px 16px rgba(37,99,235,.28),inset 0 1px 0 rgba(255,255,255,.25); /* Primární tlačítko stín */
  --ok: #17703f; /* Úspěch text */
  --okbg: #e3f5ea; /* Úspěch pozadí */
  --wn: #7a4a00; /* Varování text */
  --wnbg: #fff7e6; /* Varování pozadí */
  --wnb: #f6dfb0; /* Varování okraj */
  --er: #c43030; /* Chyba text (kontrast ≥ 4,5 : 1 na --card, --bg, --fld i s --erbg – tests/error-tokens.test.mjs) */
  --erbg: rgba(220,59,59,.06); /* Chyba pozadí */
  --erb: rgba(220,59,59,.3); /* Chyba okraj */
  --erfb: #e36a6a; /* Chyba: okraj chybného pole (netextový prvek, ≥ 3 : 1 na --fld i --card; úkol 081, README v1.1) */
  --ih1: #ffffff; /* Ikona halo 1 */
  --ih2: #e8f0fd; /* Ikona halo 2 */
  --ih3: #d6e4fb; /* Ikona halo 3 */
  --idot: #8db8ff; /* Ikona akcent tečka */
  --tog: #d3d9e4; /* Přepínač vypnuto */
  --ghb: #d6e2fa; /* Sekundární tlačítko okraj */
  --mono: #f3f6fb; /* Výplň vzorce (mono box) */
  --chip: #eaf1fe; /* Čip / štítek pozadí */
}
/* Tmavé tokeny jen na obrazovce - tisk (PDF souhrnu) je vždy světlý (DECISIONS.md bod 40, N6); viz @media print níž. */
@media not print {
[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0a1324; /* Pozadí stránky */
  --bg2: #050a14; /* Pozadí za mobilním rámem */
  --glow: radial-gradient(50% 100% at 80% 0%, rgba(59,123,255,.22), rgba(59,123,255,0) 70%); /* Záře pod hlavičkou (background main) */
  --hd: rgba(10,19,36,.84); /* Hlavička (sticky, blur 14px) */
  --hdb: rgba(255,255,255,.07); /* Spodní linka hlavičky / horní linka patičky */
  --card: #101b31; /* Karta */
  --cb: rgba(255,255,255,.08); /* Okraj karty */
  --csh: inset 0 1px 0 rgba(255,255,255,.04); /* Stín karty */
  --sh2: 0 20px 60px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.06); /* Stín plovoucích prvků (dropdown, panel, souhrn) */
  --fld: rgba(255,255,255,.04); /* Výplň pole */
  --fb: rgba(255,255,255,.10); /* Okraj pole */
  --t1: #e7edf8; /* Text primární */
  --t2: #c9d6ee; /* Text sekundární */
  --t3: #a9b8d3; /* Text terciární */
  --t4: #93a3c2; /* Text popisky */
  --t5: #6f7f9e; /* Text placeholder/jednotky */
  --ac: #4f8cff; /* Akcent */
  --ac2: #9cc3ff; /* Akcent text/odkaz */
  --at: rgba(106,166,255,.16); /* Akcent tint (hover, aktivní) */
  --at2: rgba(76,141,255,.10); /* Akcent tint jemný */
  --acb: rgba(106,166,255,.65); /* Akcent okraj */
  --seg: rgba(255,255,255,.05); /* Segment pozadí */
  --segon: rgba(255,255,255,.12); /* Segment aktivní */
  --segsh: none; /* Segment aktivní stín */
  --dv: rgba(255,255,255,.06); /* Oddělovač */
  --sumhd: linear-gradient(180deg,#17284d,#111d36); /* Pozadí hlavičky souhrnu / zvýrazněné karty */
  /* Primární tlačítko (gradient). Ztmavené proti prototypu (#5b97ff → #2a5fe0; DECISIONS.md bod 40, N8): bílý text měl
     jen ≈ 3,9 : 1. Teď ≥ 4,5 : 1 i v nejsvětlejším místě (horní zastávka 5,0 : 1, i s hoverem brightness(1.06)); spodní
     zastávka beze změny, „404“ vyplněné gradientem má proti --bg dál ≥ 3 : 1 (tests/btn-contrast.test.mjs). */
  --btn: linear-gradient(180deg,#3167e5,#2a5fe0);
  --btnsh: 0 8px 24px rgba(59,123,255,.4),inset 0 1px 0 rgba(255,255,255,.3); /* Primární tlačítko stín */
  --ok: #6ee7a8; /* Úspěch text */
  --okbg: rgba(52,199,120,.14); /* Úspěch pozadí */
  --wn: #fcd38d; /* Varování text */
  --wnbg: rgba(251,191,36,.10); /* Varování pozadí */
  --wnb: rgba(251,191,36,.28); /* Varování okraj */
  --er: #ff9b9b; /* Chyba text */
  --erbg: rgba(248,113,113,.08); /* Chyba pozadí */
  --erb: rgba(248,113,113,.32); /* Chyba okraj */
  --erfb: #f07a7a; /* Chyba: okraj chybného pole (netextový prvek, ≥ 3 : 1; úkol 081) */
  --ih1: rgba(150,190,255,.34); /* Ikona halo 1 */
  --ih2: rgba(70,130,255,.16); /* Ikona halo 2 */
  --ih3: rgba(59,123,255,.08); /* Ikona halo 3 */
  --idot: #6aa6ff; /* Ikona akcent tečka */
  --tog: rgba(255,255,255,.16); /* Přepínač vypnuto */
  --ghb: rgba(255,255,255,.12); /* Sekundární tlačítko okraj */
  --mono: rgba(255,255,255,.04); /* Výplň vzorce (mono box) */
  --chip: rgba(106,166,255,.14); /* Čip / štítek pozadí */
}
}
/* Tisk z tmavého režimu: světlé tokeny (blok výš platí jen mimo tisk) a světlé color-scheme i proti starším pravidlům
   :root[data-theme="dark"] v index.html / styles/landing.css - jinak tmavé okraje stránky (plátno) a tmavé prvky. */
@media print {
  :root, :root[data-theme] { color-scheme: light !important; }
}

/* Typografie */
:root {
  --font: 'Manrope', system-ui, -apple-system, sans-serif;
  --fs-h1: 40px;      /* mobil 28px; SEO články 40/28, kalkulačka L.h1 */
  --fs-h2: 20px;      /* nadpis karty článku; v kalkulačce 17px */
  --fs-body: 15px;    /* line-height 1.7 v článcích */
  --fs-label: 12px;   /* popisek pole, weight 700, color --t3 */
  --fs-small: 13px;
  --fs-total: 44px;   /* Náhrada celkem (desktop), weight 800, letter-spacing -.03em */
}
/* Poloměry */
:root { --r-pill: 999px; --r-field: 12px; --r-btn: 12px; --r-card: 20px; --r-card-lg: 22px; --r-chip: 6px; --r-icon: 11px; }
/* Výšky ovládacích prvků */
:root { --h-field: 44px; --h-btn-sm: 38px; --h-touch-min: 44px; }
/* Šířky layoutu */
:root { --w-page: 1280px; --w-article: 1180px; --w-sidebar: 320px; --w-sidebar-mid: 280px; --w-summary: 384px; --w-summary-mid: 340px; --pad-x: 40px; --pad-x-mid: 24px; --pad-x-mobile: 16px; }
/* Breakpointy: compact < 900px, mid < 1120px */

/* Hlavička přijde až fetchem components/header.html (fixní lišta + rozpěrka 65 px; header-loader.js na podstránkách,
   inline kopie v index.html). Prázdný #header proto drží její výšku, ať se obsah po vložení neposune - posun main#obsah
   o 65 px byl při první návštěvě CLS 0,079 na mobilu / 0,048 na desktopu (DECISIONS.md bod 40). Jedno pravidlo pro
   všechny stránky; po vložení hlavičky už :empty neplatí a výšku dává rozpěrka. */
#header:empty { height: 65px; }

/* iOS Safari při fokusu přiblíží stránku, když má pole písmo menší než 16 px (prototypy mají 15 px). Na mobilu proto
   mají všechna vstupní pole 16 px - jedno pravidlo pro všechny stránky (DECISIONS.md bod 30). !important kvůli polím
   s inline font-size (vkládají je i skripty, např. řádky položek v kalkulačce); vzhled jinak beze změny. */
@media (max-width: 860px) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  select,
  textarea { font-size: 16px !important; }
}