/* ========================================================================= kuksem — design tokeny (zrcadlo) ZDROJ PRAVDY: design/design-system/tokeny.css — při změně tokenů synchronizovat (později lze automatizovat build-copy). Identifikátory česky bez diakritiky. ========================================================================= */ :root{ /* --- Barvy: značka --- */ --barva-magenta:#FF006E; /* primární akce */ --barva-modra:#3A86FF; /* sekundární */ --barva-zluta:#FFBE0B; /* akcent / zvýrazňovač */ --barva-inkoust:#10101a; /* text, rámečky, stíny */ --barva-papir:#FFF8F2; /* světlé pozadí */ --barva-bila:#ffffff; /* --- Barvy: sekce --- */ --sekce-omalovanky:#16C2A3; --sekce-vtipy:#FFB100; --sekce-pribehy:#9B5DE5; --sekce-povidky:#3A86FF; --sekce-chat:#0FB5C9; --sekce-sdileni:#FF006E; /* --- Neutrály (šedá škála) --- */ --seda-50:#f4f6fb; --seda-100:#e9edf5; --seda-200:#d8dfeb; --seda-300:#b9c2d6; --seda-400:#8a93a6; --seda-500:#5b667e; --seda-700:#2b3346; --seda-900:#161b27; /* --- Stavové barvy --- */ --stav-uspech:#16A34A; --stav-uspech-svetla:#e8f7ee; --stav-varovani:#F59E0B; --stav-varovani-svetla:#fdf4e3; --stav-chyba:#E11D48; --stav-chyba-svetla:#fdeaee; --stav-info:#3A86FF; --stav-info-svetla:#eaf2ff; /* --- Pozadí / text (light) --- */ --pozadi:var(--seda-50); --povrch:var(--barva-bila); --text:var(--barva-inkoust); --text-tlumeny:var(--seda-500); --linka:var(--seda-200); /* --- Písma --- */ --font-logo:'Luckiest Guy', system-ui, sans-serif; /* logo + plakátové nadpisy */ --font-nadpis:'Space Grotesk', system-ui, sans-serif; /* nadpisy / UI */ --font-text:'Nunito', system-ui, sans-serif; /* běžný text */ /* --- Typografická škála --- */ --txt-micro:11px; --txt-small:13px; --txt-base:16px; --txt-h3:20px; --txt-h2:28px; --txt-h1:40px; --txt-hero:56px; --vyska-radku:1.55; /* --- Spacing (4px krok) --- */ --me-1:4px; --me-2:8px; --me-3:12px; --me-4:16px; --me-5:24px; --me-6:32px; --me-7:48px; --me-8:64px; /* --- Rádiusy --- */ --r-s:8px; --r-m:12px; --r-l:18px; --r-xl:28px; --r-pill:999px; /* --- Stíny --- */ --stin-m:0 6px 20px rgba(20,30,60,.08); --stin-l:0 10px 34px rgba(20,30,60,.10); --stin-komiks:4px 4px 0 var(--barva-inkoust); /* tvrdý komiksový stín */ --stin-komiks-s:3px 3px 0 var(--barva-inkoust); /* --- Ostatní --- */ --obrys:3px solid var(--barva-inkoust); /* komiksový obrys */ --prechod:.2s ease; --z-hlavicka:100; --z-modal:1000; --z-toast:1100; } /* --- Tmavý režim (přepínač data-theme="tma" na ) --- */ [data-theme="tma"]{ --pozadi:#0e0e16; --povrch:#1b1b27; --text:#ece6f0; --text-tlumeny:#9b9bb0; --linka:#2a2a38; --papir-na-tmave:#15151f; }