/* TOKENY ASTROKALENDARZ PRO 2027 — jedno źródło dla system.html i index.html.
   Nie wpisuj kolorów na sztywno w komponentach: przy poprzedniej zmianie palety
   zieleń i pomarańcz przeżyły usunięcie akcentów właśnie dlatego, że były hexami.
   Wygenerowane z systemu projektowego v2. */
:root{
  /* PALETA — sześć wartości Kasi (11.09) plus biel i dwa jej rozcieńczenia */
  --biel:#FFFFFF;              /* papier z pliku do druku — zmierzony, nie dobrany */
  --biel-ciepla:#FAF7F5;       /* złoty 7 % na bieli — karty, pola */
  --piasek:#F5EFEA;            /* złoty 14 % na bieli — sekcje naprzemienne */
  --zloty:#BA8D6A;             /* SYGNATURA — złocenie z okładki. Jedyny akcent, jaki wolno na tekst (linki) */
  --zloto-mocne:#AA7550;       /* hover złotego — biel na nim daje 3,91:1 zamiast 2,96:1 */
  --zloto-ciemne:#876853;      /* TYLKO TŁA I WYPEŁNIENIA — nigdy tekst */
  --zloto-palone:#845D42;      /* TYLKO TŁA — cieplejsza para dla złota mocnego */
  --zloto-glebokie:#6D5341;    /* TYLKO TŁA I WYPEŁNIENIA — nigdy tekst */
  --okladka-zlota:#C9A96B;     /* KOLOR PRODUKTU, nie marki — okładka Cº1 Classic GOLD; tylko rysunki i tła okładki */
  --grafit-60:#3F3D3C;         /* tekst drugorzędny — Kasia 23.09: „kolor treści daj ciemniejszy, teraz jest szarawy”; kontrast 10,3:1 */
  --grafit-40:#5C5A59;         /* metadane, podpisy — przyciemnione razem z tekstem, hierarchia zostaje; kontrast 6,86:1 */
  --braz:#33231E;              /* ciemna powierzchnia markowa */
  --grafit:#161312;            /* tekst podstawowy */
  --czern:#000000;             /* najgłębsza — stopka, koszyk */
  /* STANY — trzy kolory, do przetestowania (Kasia 11.09) */
  --zielen:#7ACC46;            /* potwierdzenie. 1,99:1 na bieli → tylko wypełnienie i tinty */
  --zielen-ciemna:#528231;     /* ta sama zieleń, czytelna na bieli (4,57:1) — obrysy, kropki */
  --czerwien:#D64343;          /* błąd i końcówka nakładu */
  --blad:var(--czerwien);      /* jedna czerwień w całym systemie */
  --tlo-ok:#EFF9E9;            /* zieleń rozbielona — tło komunikatu potwierdzenia */
  --tlo-blad:#FAE8E8;          /* czerwień rozbielona — tło komunikatu błędu */
  /* ROLE TEKSTU */
  /* TEKST ZAWSZE Z RODZINY GRAFITU — brązy schodzą wyłącznie na tła (decyzja Kasi 11.09) */
  --tx:var(--grafit); --tx-60:var(--grafit-60); --tx-40:var(--grafit-40);
  --tx-inv:var(--biel); --tx-inv-70:#C2BDBC;
  /* ZAOKRĄGLENIA */
  --r-male:6px; --r-srednie:14px; --r-duze:24px; --r-xl:40px;
  /* CIENIE */
  --c-karta:0 1px 2px rgba(20,19,16,.04),0 8px 24px rgba(20,19,16,.05);
  --c-uniesiona:0 2px 4px rgba(20,19,16,.05),0 16px 40px rgba(20,19,16,.08);
  /* RUCH */
  --t-szybko:220ms; --t-spokojnie:420ms;
  /* RUCH v3 (propozycja 12.09, HOMEPAGE_V3_FULLWIDTH §6): cztery tempa, dwie krzywe — wejścia --e-wej, reszta --e-std */
  --t-mikro:180ms; --t-std:360ms; --t-edytorial:900ms; --t-edytorial-dlugie:1200ms;
  /* SZEROKOŚCI v3 (§3): cztery zamiast jednej */
  --margines:clamp(20px,5vw,96px); --rynna:clamp(16px,2vw,32px);
  --szer-oversize:min(1720px,calc(100% - 2 * var(--margines)));
  --szer-tresc:min(1360px,calc(100% - 2 * var(--margines)));
  --szer-tekst:min(760px,calc(100% - 2 * var(--margines)));
  --e-std:cubic-bezier(.25,0,0,1); --e-wej:cubic-bezier(.16,1,.3,1);
  /* KROJE */
  --display:'europa','Instrument Sans',system-ui,sans-serif; --ui:'europa','Instrument Sans',system-ui,sans-serif;
  /* DOSTROJENIE OPTYCZNE — kroje o różnej wysokości x-height nie są równe przy tym samym px */
  /* --ui-px trzymamy jako liczbę: z długości nie da się zrobić bezwymiarowego mnożnika,
     a bez mnożnika suwak ruszałby samym akapitem, nie przyciskami i cenami */
  --ui-px:18; --ui-size:calc(var(--ui-px) * 1px); --ui-k:calc(var(--ui-px) / 16);
  --ui-track:0.004em; --display-track:0.004em; --ui-alt:"ss01" 1;
  /* SKALA KARTY — mała 0,8 i drobna 0,64 karty standardowej z siatek M°/C° (runda 5) */
  --szer-karta-mala:clamp(224px,13.5vw,368px);    /* podłoga 224 px = „DODAJ DO KOSZYKA” w jednym wierszu */
  --szer-karta-drobna:clamp(176px,10.8vw,296px);  /* podłoga 176 px = przycisk 44 px i nazwa w 2 wierszach */
}
/* telefon: standard ma 350 px przy 390, więc mała to 0,8 × 350 */
@media(max-width:860px){:root{--szer-karta-mala:min(280px,72vw);--szer-karta-drobna:min(208px,56vw)}}
