/* Večírkovky — design tokeny. Jediný zdroj barev, písma, rozměrů a pohybu pro web,
   konfigurátor, herní runtime, karty v chatu a e-maily. Odchylka v kanálu se opravuje
   v kanálu, ne tady. Verze 1, 2026-09-25. Popis rolí: brand/BRAND.md */
@import url('./fonts/fonts.css');

:root {
  /* ---- Značka (neměnné) ---- */
  --vk-ink: #0F1B33;          /* inkoust: text, obrys jmenovky, tmavý sál */
  --vk-paper: #FFFFFF;        /* jmenovka, karty, světlé plochy */
  --vk-red: #DC3034;          /* hlavička „Ahoj, jsem", razítko, hlavní tlačítko na webu; bílý text 4,65:1 */
  --vk-red-text: #C8262A;     /* červený text na bílé (5,58:1); --vk-red na text nepoužívat */
  --vk-los: #FFC940;          /* kredit-los, výhra; jen plocha s inkoustovým textem (11,2:1), nikdy text na bílé */
  --vk-ground: #E9ECF3;       /* konferenční šedá: podklad webu a konfigurátoru */

  /* ---- Neutrály s nádechem inkoustu ---- */
  --vk-ink-2: #1C2B4D;        /* panel v tmavém sále */
  --vk-ink-3: #2E4270;        /* linky a obrysy v tmavém sále */
  --vk-muted: #56627A;        /* vedlejší text na bílé (6,1:1) a na šedé (5,2:1) */
  --vk-muted-dark: #A9B6D3;   /* vedlejší text v sále (8,4:1 na inkoustu) */
  --vk-line: #D5DAE6;         /* linky na světlém */

  /* ---- Význam (oddělený od značky) ---- */
  --vk-ok: #177A4B;           /* správná odpověď, hotovo (5,3:1 na bílé) */
  --vk-ok-dark: #3FCB86;      /* totéž v sále */
  --vk-warn: #9A5B00;         /* chybí podklady (5,5:1 na bílé) */
  --vk-err: #B42318;          /* chyba formuláře (ne --vk-red, ta je značka) */

  /* ---- Barva zákazníka (dosazuje runtime podle akce; výchozí = inkoust) ---- */
  --cb: var(--vk-ink);        /* šňůrka, výběr odpovědi, zvýraznění páru */
  --cb-on: #FFFFFF;           /* text na --cb, přepne se na #14101C u světlých barev */
  --cb-text: var(--vk-ink);   /* varianta --cb pro text na bílé, kontrast ≥ 4,5:1 */
  --cb-glow: #A9B6D3;         /* varianta --cb pro obrys v sále, kontrast ≥ 3:1 na inkoustu */

  /* ---- Písmo ---- */
  --vk-font-display: 'Familjen Grotesk', 'Hanken Grotesk', system-ui, sans-serif; /* titulky, čísla, tlačítka */
  --vk-font-text: 'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif; /* text */
  --vk-font-hand: 'Patrick Hand', 'Comic Sans MS', cursive; /* JEN jméno a zajímavost na jmenovce */

  /* Typová škála (web a konfigurátor), poměr ~1,25 */
  --vk-fs-12: 0.75rem; --vk-fs-14: 0.875rem; --vk-fs-16: 1rem; --vk-fs-20: 1.25rem;
  --vk-fs-25: 1.5625rem; --vk-fs-31: 1.9375rem; --vk-fs-39: 2.4375rem; --vk-fs-49: 3.0625rem;
  /* Plátno: velikosti v cqw (šířka plátna), nejmenší text 1,8 cqw ≈ 35 px na 1920 */
  --vk-screen-min: 1.8cqw; --vk-screen-body: 2.2cqw; --vk-screen-title: 6cqw; --vk-screen-number: 11cqw;

  /* ---- Tvar ---- */
  --vk-radius-badge: 14px;    /* jmenovka */
  --vk-radius-card: 12px;     /* běžná karta */
  --vk-radius-los: 10px;      /* los */
  --vk-radius-pill: 999px;
  --vk-tap: 48px;             /* nejmenší cíl dotyku v herním runtime */
  --vk-lanyard: 10px;         /* výška šňůrky na horní hraně obrazovky */

  /* ---- Pohyb ---- */
  --vk-ease: cubic-bezier(.2, .8, .2, 1);
  --vk-dur-fast: 150ms; --vk-dur: 280ms; --vk-dur-flip: 450ms; --vk-dur-drum: 3200ms;
}

@media (prefers-reduced-motion: reduce) {
  :root { --vk-dur-fast: 0ms; --vk-dur: 0ms; --vk-dur-flip: 0ms; --vk-dur-drum: 600ms; }
}