/* Farben – ein Design, zwei Helligkeiten. Umgeschaltet über <html data-thema="hell|dunkel">.
   Alles Gestalterische steht in basis.css und nutzt nur diese Variablen. */

html[data-thema="hell"] {            /* Zeche bei Tag */
  color-scheme: light;
  --grund: #f3f5f1;
  --grund-2: #e9eee8;
  --flaeche: #fbfcfa;
  --tinte: #17201b;
  --leise: #55635a;
  --linie: #d7dfd9;
  --linie-stark: #b3c2b8;
  --akzent: #9fd1b2;                 /* Pastellgrün, etwas kräftiger damit es auf Hell trägt */
  --akzent-hover: #8cc6a2;
  --akzent-tinte: #10271a;
  --akzent-text: #2c6b47;
  --akzent-weich: #dcefe2;
  --weich-2: #f1e6d6;                /* Pastell-Sand */
  --weich-3: #dfe8f0;                /* Pastell-Taubenblau */
  --gruen-signal: #4f9d70;
  --gruen-schein: #d6ecdd;
  --info: #b58a52;
  --info-schein: #f3e5d1;
  --fokus: #2c6b47;
  --kopf-grund: rgba(243, 245, 241, .85);
  --held-rgb: 243, 245, 241;         /* Verlauf über dem Startbild */
  --status-glas: rgba(251, 252, 250, .92);
  --hinweis-grund: #e8cfa6;
  --hinweis-tinte: #1e1a12;
  --chat-grund: #17201b;
  --chat-tinte: #eef3ef;
  --marke-filter: none;
  --perdu-grund: #17201b;
  --perdu-tinte: #e3efe7;
  --perdu-akzent: #a9d8bb;
  --bild-filter: saturate(.8);
  --schatten: 0 18px 40px -18px rgba(30, 60, 42, .28);
}

html[data-thema="dunkel"] {          /* Zeche bei Nacht */
  color-scheme: dark;
  --grund: #151a17;
  --grund-2: #1b211d;
  --flaeche: #212924;
  --tinte: #eef3ef;
  --leise: #a4b2a9;
  --linie: #2c3630;
  --linie-stark: #44534a;
  --akzent: #a9d8bb;
  --akzent-hover: #c0e5ce;
  --akzent-tinte: #132018;
  --akzent-text: #a9d8bb;
  --akzent-weich: #2a3d31;
  --weich-2: #3b3429;
  --weich-3: #283541;
  --gruen-signal: #8fd3ad;
  --gruen-schein: rgba(143, 211, 173, .18);
  --info: #e8cfa6;
  --info-schein: rgba(232, 207, 166, .16);
  --fokus: #e8cfa6;
  --kopf-grund: rgba(21, 26, 23, .82);
  --held-rgb: 21, 26, 23;
  --status-glas: rgba(33, 41, 36, .92);
  --hinweis-grund: #e8cfa6;
  --hinweis-tinte: #1e1a12;
  --chat-grund: #a9d8bb;
  --chat-tinte: #132018;
  --marke-filter: invert(1);
  --perdu-grund: #a9d8bb;
  --perdu-tinte: #132018;
  --perdu-akzent: #132018;
  --bild-filter: saturate(.75);
  --schatten: 0 18px 40px -16px rgba(0, 0, 0, .6);
}
