/* Wspólne szaty graficzne v2. Szatę wybiera atrybut <html data-szata="...">.
   Koncepcje używają WYŁĄCZNIE tych tokenów do kolorów, cieni i fontów, żeby szata zmieniała się bez zmian w HTML.
   Fonty ładuje każdy plik HTML z Google Fonts: Fraunces, Manrope, IBM Plex Mono, Bricolage Grotesque. */

:root, [data-szata="szklo"]{
  --bg:#eef1f4;            /* jasne, chłodne tło */
  --bg-pole-1:#d9e8f5;     /* miękkie plamy koloru pod szkłem (bez flar/bokehu) */
  --bg-pole-2:#f6e3d6;
  --bg-pole-3:#e2f0e4;
  --panel:rgba(255,255,255,.52);
  --panel-krawedz:rgba(255,255,255,.85);
  --panel-blur:22px;
  --ink:#16181b; --muted:#5c636b; --line:rgba(22,24,27,.12);
  --akcent:#3d6b8f;        /* drugi kolor (nie czerwony) */
  --tryb:#b9c6d2; --tryb-cien:#93a3b2;
  --rec:#e3342f;
  --cien:0 20px 50px -20px rgba(40,60,80,.28);
  --radius:22px;
  --f-display:"Fraunces",Georgia,serif; --f-body:"Manrope",system-ui,sans-serif; --f-mono:"IBM Plex Mono",monospace;
}
[data-szata="pastel"]{
  --bg:#fbf1e6;            /* ciepła brzoskwinia */
  --bg-pole-1:#d6ecfa;     /* błękit nieba (Mika) */
  --bg-pole-2:#dff1d8;     /* mięta / trawa */
  --bg-pole-3:#ebe3f7;     /* lawenda */
  --panel:#fffaf4;
  --panel-krawedz:#efe2d2;
  --panel-blur:0px;
  --ink:#2b241e; --muted:#7a6c60; --line:rgba(43,36,30,.12);
  --akcent:#f2a65a;        /* ciepły pomarańcz */
  --kraft:#d8b78b; --kraft-ciemny:#b8946a;
  --tryb:#d8b78b; --tryb-cien:#b8946a;
  --rec:#e3342f;
  --cien:0 14px 0 -6px rgba(184,148,106,.35), 0 24px 40px -18px rgba(120,80,40,.25);
  --radius:28px;
  --f-display:"Bricolage Grotesque","Manrope",sans-serif; --f-body:"Manrope",system-ui,sans-serif; --f-mono:"IBM Plex Mono",monospace;
}
[data-szata="grafit"]{
  --bg:#18191c;
  --bg-pole-1:#202226; --bg-pole-2:#1d1e21; --bg-pole-3:#232428;
  --panel:#222428;
  --panel-krawedz:#2f3237;
  --panel-blur:0px;
  --ink:#efebe5; --muted:#9b978f; --line:rgba(239,235,229,.12);
  --akcent:#c9c3b8;
  --tryb:#3a3d43; --tryb-cien:#2a2c30;
  --rec:#ff3b30;
  --cien:0 30px 60px -30px rgba(0,0,0,.7);
  --radius:14px;
  --f-display:"Fraunces",Georgia,serif; --f-body:"Manrope",system-ui,sans-serif; --f-mono:"IBM Plex Mono",monospace;
}
/* B: dwie palety kartonu */
[data-szata="kraft"]{
  --bg:#f3e7d6; --bg-pole-1:#e9d6bb; --bg-pole-2:#f7d9c4; --bg-pole-3:#dfe9d3;
  --panel:#fbf5ec; --panel-krawedz:#e3cfb2; --panel-blur:0px;
  --ink:#2e261e; --muted:#7d6b58; --line:rgba(46,38,30,.14);
  --akcent:#e9965a; --kraft:#c9a16f; --kraft-ciemny:#a57f52;
  --tryb:#c9a16f; --tryb-cien:#a57f52; --rec:#e3342f;
  --cien:0 12px 0 -6px rgba(165,127,82,.4), 0 26px 40px -20px rgba(100,70,40,.3);
  --radius:20px;
  --f-display:"Bricolage Grotesque","Manrope",sans-serif; --f-body:"Manrope",system-ui,sans-serif; --f-mono:"IBM Plex Mono",monospace;
}
[data-szata="chlodny"]{
  --bg:#eef3f6; --bg-pole-1:#d7e9f6; --bg-pole-2:#e3eedf; --bg-pole-3:#e7e3f4;
  --panel:#fbfdfe; --panel-krawedz:#d5e0e8; --panel-blur:0px;
  --ink:#1d2329; --muted:#66727d; --line:rgba(29,35,41,.12);
  --akcent:#7fb3d9; --kraft:#c8d5df; --kraft-ciemny:#a3b4c2;
  --tryb:#c8d5df; --tryb-cien:#a3b4c2; --rec:#e3342f;
  --cien:0 12px 0 -6px rgba(163,180,194,.45), 0 26px 40px -20px rgba(50,70,90,.25);
  --radius:20px;
  --f-display:"Bricolage Grotesque","Manrope",sans-serif; --f-body:"Manrope",system-ui,sans-serif; --f-mono:"IBM Plex Mono",monospace;
}

/* ODRZUCONA (Adam, 29.10): szata „grafit” powyżej zostaje tylko dla zgodności. Nie używać w nowych plikach. */

/* OLIWKA: zielone drzwi w kamienicy. Szlachetna zieleń, drewno, mosiądz, jasne ciepłe tło. */
[data-szata="oliwka"]{
  --bg:#f4efe4;            /* ciepły tynk / kremowa ściana */
  --bg-pole-1:#e9e2d0; --bg-pole-2:#e3e6d3; --bg-pole-3:#efe5d6;
  --panel:#fbf8f1;
  --panel-krawedz:#ddd4bf;
  --panel-blur:0px;
  --ink:#23271d; --muted:#6c6a5a; --line:rgba(35,39,29,.14);
  --akcent:#55663a;        /* oliwkowe drzwi */
  --akcent-ciemny:#3d4a28;
  --mosiadz:#b59a5b; --drewno:#8a5c3c;
  --tryb:#b59a5b; --tryb-cien:#8f7740;   /* tryby jak mosiężne okucia */
  --rec:#e3342f;           /* tylko mały znak przy haśle */
  --cien:0 18px 40px -22px rgba(61,74,40,.35);
  --radius:6px;            /* kamienica: bardziej prostokątnie, listwy, frezy */
  --f-display:"Fraunces",Georgia,serif; --f-body:"Manrope",system-ui,sans-serif; --f-mono:"IBM Plex Mono",monospace;
}

/* FARBA: kolorowa mapa świata malowana na ścianie, rozbryzgi farby. Energia w tle, typografia czysta. */
[data-szata="farba"]{
  --bg:#fbfaf6;            /* biała ściana */
  --bg-pole-1:#fff3d6; --bg-pole-2:#e3f4f1; --bg-pole-3:#fde4dc;
  --panel:#ffffff;
  --panel-krawedz:#ecebe6;
  --panel-blur:0px;
  --ink:#151515; --muted:#5f5d58; --line:rgba(21,21,21,.12);
  --akcent:#1fa59a;
  --farba-1:#ff6a4d;       /* koral */
  --farba-2:#ffc531;       /* żółć */
  --farba-3:#1fa59a;       /* morski */
  --farba-4:#3f74d6;       /* błękit */
  --farba-5:#9ccf4a;       /* limonka */
  --tryb:#151515; --tryb-cien:#151515;   /* tryby jako czysty kontur */
  --rec:#e3342f;           /* tylko mały znak przy haśle */
  --cien:0 16px 36px -22px rgba(21,21,21,.25);
  --radius:16px;
  --f-display:"Bricolage Grotesque","Manrope",sans-serif; --f-body:"Manrope",system-ui,sans-serif; --f-mono:"IBM Plex Mono",monospace;
}