/* eKonanie — dizajnové tokeny. Jediný zdroj farieb a rozmerov.
   Revízia 09.09.2026: identita Vybranej osoby — teplá sivá namiesto čiernej,
   akcent 861A1A „krvavá" (16.09.2026, R8) — detail na každej obrazovke, nikdy plocha (docs/brand.md).
   Podrobnosti v docs/brand.md. */
:root {
  --ink: #33332E;
  --ink-2: #5F5E57;
  --ink-3: #8E8D84;
  --ink-4: #B3B0A6;
  --bg: #F7F5EF;
  --bg-deep: #EFECE3;
  --surface: #FFFFFF;
  --surface-2: #FCFBF7;
  --line: #E6E2D8;
  --line-strong: #D6D1C4;
  --line-soft: #F0EDE5;
  --fill-soft: #F2EFE8;
  --fill-warm: #E8E3D6;
  --fill-quiet: #F4F1EA;
  --dot-quiet: #C2BEB2;
  --on-ink: #FFFFFF;
  --on-ink-2: #B6B4AA;
  --on-ink-3: #A9A79D;

  /* Akcent: bodky (slogan, nadpis, sekcie, čap značky), lehota, čísla v „čo
     horí", dni s lehotou, jedno hlavné tlačidlo. Nikdy plocha, nikdy listiny. */
  --accent: #861A1A;
  --accent-on-dark: #CC5858;
  --accent-soft: #861A1A1F;
  --dark: #3B3B35;

  --font-sans: "Geist", "Helvetica Neue", Arial, sans-serif;
  --font-display: "Bricolage Grotesque", "Geist", "Helvetica Neue", Arial, sans-serif;
  --font-num: "Jost", "Geist", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "Geist Mono", Menlo, ui-monospace, monospace;
  --font-serif: "Newsreader", "Times New Roman", Georgia, serif;

  --r-control: 12px;
  /* Miera riadku: koľko textu sa má zmestiť na jeden riadok (058 § 9).
     Asi 70 znakov — toľko, koľko má listina. Text roztiahnutý cez celú
     bunku sa nečíta, skáče sa v ňom. */
  --merka: 34rem;
  --r-card: 18px;
  --r-panel: 22px;
  --r-pill: 999px;

  --h-control: 42px;
  --h-action: 48px;
  --tap-min: 44px;

  --shadow-card: 0 1px 2px rgba(51, 51, 46, .03), 0 10px 30px -12px rgba(51, 51, 46, .10);
  --shadow-pop: 0 2px 6px rgba(51, 51, 46, .06), 0 24px 48px -20px rgba(51, 51, 46, .18);
  --ring: 0 0 0 4px rgba(51, 51, 46, .07);
}

html { background: var(--bg); }
body { background: var(--bg); color: var(--ink); font-family: var(--font-sans);
       -webkit-font-smoothing: antialiased; margin: 0; font-size: 14.5px; line-height: 1.55; }
h1, h2, h3 { letter-spacing: -0.035em; font-weight: 600; text-wrap: balance; }
.mono, .sp-zn, .suma { font-family: var(--font-mono); font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
a { color: var(--ink); text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 3px; }
a:hover { color: var(--ink-2); text-decoration-color: var(--ink-3); }
::selection { background: rgba(51, 51, 46, .10); }

/* Stavy konania — hierarchia plochou, nie farbou */
.stav { display: inline-flex; align-items: center; gap: 7px; font-size: 12px;
        font-weight: 500; border-radius: var(--r-pill); padding: 5px 11px; white-space: nowrap; line-height: 1.2; }
.stav__bod { width: 6px; height: 6px; border-radius: 50%; flex: none; }
.stav--reakcia { background: var(--ink); color: var(--on-ink); }
.stav--reakcia .stav__bod { background: var(--on-ink); }
.stav--lehota { background: var(--fill-warm); color: #3A362E; }
.stav--lehota .stav__bod { background: var(--ink); }
.stav--rozhoduje { background: var(--fill-soft); color: #7A756B; }
.stav--rozhoduje .stav__bod { background: var(--dot-quiet); }
.stav--hotovo { background: var(--surface); color: var(--ink-2);
                border: 1px solid var(--line-strong); padding: 4px 11px; }
.stav--hotovo .stav__bod { background: var(--dot-quiet); }