/* ═══════════════════════════════════════════════════════════════════════════
   MOTYW — jedyne miejsce z kolorami. `styl.css` używa wyłącznie tych tokenów
   i nie zawiera ani jednej wartości szesnastkowej (pilnuje tego test).

   WARIANT: BORDO I PIASEK. Marcin wybrał go 9 wrz z dwóch przedstawionych;
   drugi („papier i atrament", cynober na papierze czerpanym) wypadł i został
   usunięty razem z asercjami, które dotyczyły wyłącznie jego. Historia jest
   w gicie — trzymanie w pliku palety, której nikt nie wybrał, kosztuje przy
   każdej kolejnej zmianie i nic nie daje.

   Świat wariantu: nocna jazda, tylne światło, kurz na piaskowym poboczu.

   ⚠️ CIEMNY JEST DOMYŚLNY I NIE ZALEŻY OD USTAWIENIA TELEFONU.
   Nie ma tu `@media (prefers-color-scheme)` i to jest decyzja, nie przeoczenie:
   aplikacja ma wyglądać tak samo za każdym otwarciem, a nie zmieniać się dlatego,
   że iOS przełączył się na jasny o wschodzie słońca. Tryb jasny ZOSTAJE, ale jako
   świadomie włączany (`data-motyw="jasny"` w index.html), nie jako automat.

   Dlaczego w ogóle zostaje, skoro nie ma przełącznika w interfejsie: pierwotny
   brief wymagał czytelności W SŁOŃCU, a ciemny ekran w pełnym słońcu jest tym
   wariantem słabszym — Marcin jeździ. To jest awaryjne wyjście na jeden atrybut,
   utrzymywane przez test kontrastu razem z ciemnym. Koszt: dwadzieścia linii
   i dwie pozycje w teście.

   ⚠️ DWIE ROLE KOLORU, KTÓRE ŁATWO POMYLIĆ — i które raz pomyliliśmy
   ─────────────────────────────────────────────────────────────────
   MARKA (`--akcent`, `--akcent-plyta`) mówi „to jest ta aplikacja i to jest
   klikalne": wstęga, miernik, aktywna zakładka, linia wykresu, przyciski.
   ZNACZENIE (`--ok`, `--uwaga`, `--neutralny`, `--nota`) mówi, JAK JEST.

   Pierwsza wersja malowała znaczenie barwą marki i wychodziły z tego zdania bez
   sensu: „brak czerwonych flag" na czerwono, dzień zaliczony w kolorze marki.
   Od tej pory: zaliczone jest ZIELONE, czerwień robi WYŁĄCZNIE za problem,
   a marka nie wypowiada się o tym, czy jest dobrze.

   ⚠️ CZEGO TU NIE MA I DLACZEGO
   · Mięty i zieleni klinicznej — „kojarzy mi się ze szpitalem" (Marcin). Zieleń
     jest MCHOWA (odcień ~110°, nasycenie ~0,2): ma czytać się jak stempel w karcie
     brevetu, nie jak dioda w aparaturze medycznej. Zero neonu, zero cyjanu.
   · Grafitu z bursztynem — TO JEST ZAJĘTE. `system.marcinwaclawik.pl`, drugi
     produkt tego samego autora, ma tło #12161B i akcent #F0A62F. Dwa produkty
     w jednej rodzinie barw wyglądałyby jak jeden produkt.

   NAZWY SĄ ROLAMI, NIE BARWAMI — rola przeżywa zmianę palety, nazwa barwy nie.

   KONTRASTY SĄ ZMIERZONE, nie ocenione na oko — liczy je `app/testy/motyw.test.js`
   WPROST z tego pliku. Progi: tekst 4,5:1, obiekty i kontury stanu 3:1.

   ⚠️ ŻADEN STAN NIE MOŻE ZALEŻEĆ OD SAMEJ BARWY. Karta dziennika rozróżnia doby
   kształtem, werdykt i składniki punktów mają własną ikonę i słowo. Kolor
   POTWIERDZA znaczenie, nie jest jego jedynym nośnikiem.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── CIEMNY — domyślny ─────────────────────────────────────────────────────── */
:root,
html[data-motyw="ciemny"] {
  color-scheme: dark;          /* pola formularzy i paski przewijania też mają być ciemne */

  --tlo:          #1B1113;
  --karta:        #251719;
  --tekst:        #F3EDE6;     /* piaskowy, nie biały */
  --tekst-2:      #AC9A92;

  /* MARKA — tożsamość i interakcja, NIGDY werdykt.
     Role rozchodzą się w ciemnym trybie: znak i tekst muszą być jasne (4,5:1
     na karcie), a duża plama — ciemniejsza, bo to NA NIEJ stoi tekst. Jedna barwa
     nie spełnia obu warunków naraz; próba kończy się albo nieczytelnym napisem,
     albo cukierkową wstęgą. */
  --akcent:       #E4667C;
  --akcent-plyta: #BE3A52;
  --akcent-2:     #EE8093;
  --na-akcencie:  #FFF0F2;

  /* ZNACZENIE — niezależne od marki */
  --ok:           #8FBE86;     /* mech 110° — zaliczone, w paśmie, podłoga dobita */
  --ok-plyta:     #649150;
  --na-ok:        #12180F;
  --uwaga:        #F27052;     /* cegła 11° — WYŁĄCZNIE realny problem;
                                  21° od marki (350°) i 21° od noty (32°) */
  --neutralny:    #886A70;     /* bez werdyktu: brak danych, jeszcze nie, poza pasmem */
  --nota:         #D9A05E;     /* adnotacja: zamrożenie serii, dostęp z terminala */

  --drugi:        #C08A5E;     /* piaskowy brąz — drugie konto */
  --linia:        #3E272B;     /* hairline ozdobny */
  --linia-2:      #2E1D21;     /* siatka wykresu */
  --pasmo:        rgba(143, 190, 134, .14);   /* pasmo docelowe wagi = cel, więc zieleń */
  --cien:         0 1px 2px rgba(0, 0, 0, .5);
  /* Podgląd zdjęcia posiłku (8 paź): kurtyna i jej przycisk zamykania. Świadomie
     NIE `--tlo`: patrzymy na zdjęcie jedzenia i nic obok nie ma prawa zmieniać
     wrażenia koloru ani wielkości porcji. W obu trybach ta sama, prawie czarna
     plama — rola „zasłoń wszystko" nie zależy od wariantu. */
  --kurtyna:      rgba(0, 0, 0, .88);
  --kurtyna-plyta: rgba(0, 0, 0, .5);
  --na-kurtynie:  #FFFFFF;
}

/* ── JASNY — wyjście awaryjne na pełne słońce, włączane ŚWIADOMIE ──────────── */
html[data-motyw="jasny"] {
  color-scheme: light;

  --tlo:          #F4EDE6;     /* piasek */
  --karta:        #FFFFFF;
  --tekst:        #241417;
  --tekst-2:      #6B5A55;

  --akcent:       #A3213E;
  --akcent-plyta: #A3213E;
  --akcent-2:     #8A1932;
  --na-akcencie:  #FFFFFF;

  --ok:           #3D6B3A;     /* mech 116° */
  --ok-plyta:     #3D6B3A;
  --na-ok:        #FFFFFF;
  --uwaga:        #A83214;     /* cegła 12° — 25° od bordowej marki, 24° od sepii */
  --neutralny:    #93857D;
  --nota:         #7D5518;

  --drugi:        #8A5A2E;
  --linia:        #E0D2C6;
  --linia-2:      #F0E7DE;
  --pasmo:        rgba(61, 107, 58, .12);
  --cien:         0 1px 2px rgba(36, 20, 23, .07), 0 8px 24px -16px rgba(36, 20, 23, .32);
  --kurtyna:      rgba(0, 0, 0, .88);
  --kurtyna-plyta: rgba(0, 0, 0, .5);
  --na-kurtynie:  #FFFFFF;
}