/* Designove tokeny knihovny kreativ.
   Prevzato z handoffu Claude Designu, sekce "Designove tokeny".
   Brand tokeny Fanlu z output/ZADANI-UI.md sedi: ink, paper, google, meta, warn.
   Jediny zdroj barev a rozmeru. Nikde v sablonach nesmi byt barva natvrdo. */

:root {
  /* --- plochy --- */
  --ink: #0F1114;          /* inkoust, hlavni text */
  --platno: #F4F5F7;       /* platno obrazovky */
  --panel: #FBFBFC;        /* panel, karta, hlavicka */
  --plinta: #EDEEF1;       /* podklad pod obrazem ukazky */
  --bila: #FFFFFF;         /* vnitrek vstupnich poli */
  --svetly: #F7F8FA;       /* svetly text na tmavem podkladu */

  /* --- akcenty --- */
  --akcent: #FF6B3D;       /* fanl-warn, prilezitost a chyba */
  --zelena: #1FB06B;       /* fanl-google, v poradku a nahrano */
  --modra: #2B5BFF;        /* fanl-meta, odkaz a avatar */

  /* --- pruhledne odstiny inkoustu, cela skala z handoffu --- */
  --ink-86: rgba(15, 17, 20, .86);
  --ink-78: rgba(15, 17, 20, .78);
  --ink-72: rgba(15, 17, 20, .72);
  --ink-68: rgba(15, 17, 20, .68);
  --ink-66: rgba(15, 17, 20, .66);
  --ink-62: rgba(15, 17, 20, .62);
  --ink-60: rgba(15, 17, 20, .60);
  --ink-55: rgba(15, 17, 20, .55);
  --ink-50: rgba(15, 17, 20, .50);
  --ink-48: rgba(15, 17, 20, .48);
  --ink-45: rgba(15, 17, 20, .45);
  --ink-42: rgba(15, 17, 20, .42);
  --ink-40: rgba(15, 17, 20, .40);
  --ink-35: rgba(15, 17, 20, .35);
  --ink-30: rgba(15, 17, 20, .30);
  --ink-28: rgba(15, 17, 20, .28);
  --ink-25: rgba(15, 17, 20, .25);
  --ink-18: rgba(15, 17, 20, .18);
  --ink-14: rgba(15, 17, 20, .14);
  --ink-10: rgba(15, 17, 20, .10);
  --ink-05: rgba(15, 17, 20, .05);

  /* --- linky, tri sily --- */
  --linka-slaba: rgba(15, 17, 20, .08);
  --linka: rgba(15, 17, 20, .12);
  --linka-bezna: rgba(15, 17, 20, .14);
  --linka-silna: rgba(15, 17, 20, .20);
  --linka-ramecek: rgba(15, 17, 20, .16);
  --linka-pole: rgba(15, 17, 20, .22);
  --linka-box: rgba(15, 17, 20, .32);

  /* --- akcentove vyplne --- */
  --akcent-ram: rgba(255, 107, 61, .40);
  --akcent-ram-silny: rgba(255, 107, 61, .45);
  --akcent-vypln: rgba(255, 107, 61, .07);
  --akcent-vypln-silna: rgba(255, 107, 61, .12);
  --akcent-nadech: rgba(255, 107, 61, .10);
  --zelena-ram: rgba(31, 176, 107, .45);
  --zelena-vypln: rgba(31, 176, 107, .12);
  --modra-vypln: rgba(43, 91, 255, .06);

  /* --- typografie --- */
  --pismo: "Inter", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* --- rozmery --- */
  --hlavicka: 60px;
  --hlavicka-klient: 56px;
  --sloupec-filtru: 236px;
  --panel-400: 400px;
  --panel-420: 420px;
  --panel-452: 452px;
  --panel-520: 520px;
  --odsazeni: 32px;
  --odsazeni-siroke: 44px;

  /* --- jediny stin v cele aplikaci, patri modalum a telefonum --- */
  --stin-modal: 0 40px 90px -30px rgba(15, 17, 20, .5);
  --stin-naseptavac: 0 14px 30px -18px rgba(15, 17, 20, .4);
  --stin-obraz: 0 18px 40px -18px rgba(15, 17, 20, .45);

  /* --- prechody, presne podle handoffu --- */
  --prechod-radek: padding-left .16s ease;
  --prechod-ramecek: border-color .14s ease;
  --prechod-nadech: background .18s ease;
}

/* --- Jen svetly rezim ---
   Rozhodl Kuba 28. 8. 2026: tmavy rezim zatim vypnuty, plati svetly podle
   designu. Barvy zustavaji v tokenech, takze zapnout ho zpatky znamena
   pridat jeden blok s prepsanymi tokeny, ne prochazet sablony.
   Puvodni blok je v historii gitu.

   color-scheme: light rika prohlizeci, aby si sam neprebarvoval scrollbary
   a vstupni prvky, kdyz ma system nastavenou tmu. */
:root { color-scheme: light; }

/* Rohy jsou hranate, radius 0. Vyjimka jsou klavesove stitky a prepinace. */
* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--platno);
  color: var(--ink);
  font-family: var(--pismo);
  font-size: 13px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

/* Inter se nacita z Google Fonts, ale musi byt fallback, protoze aplikace
   ma fungovat i kdyz Google neodpovi. Proto font-display: swap a systemovy
   zasobnik v --pismo. */

a { color: inherit; text-decoration: none; }

button, input, select, textarea {
  font: inherit;
  color: inherit;
  border-radius: 0;
}

img { max-width: 100%; }

/* Komponenty maji display: flex, ktery by atribut hidden prebil.
   Bez tohohle pravidla by skryte prvky zustaly videt. */
[hidden] { display: none !important; }

/* Skryte, ale citelne pro odecitac obrazovky. */
.jen-pro-cteni {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* Ohnisko klavesnice musi byt videt, aby sla aplikace ovladat bez mysi. */
:focus-visible {
  outline: 2px solid var(--modra);
  outline-offset: 2px;
}