/* Agora 5 — Hell- und Dunkelmodus.
   Einbinden mit:  <link rel="stylesheet" href="/hell-dunkel.css">
                   <script src="/hell-dunkel.js"></script>
   Seiten benutzen die Variablen unten statt fester Farben. */

:root, [data-modus="dunkel"]{
  --grund:#0e1116; --feld:#161b22; --feld2:#1d232c; --linie:#242c36;
  --ink:#e8ecf1;        /* Fließtext  — Kontrast 14,4:1 auf --grund */
  --dim2:#b4bcc6;       /* Sekundärtext — 9,1:1 */
  --dim:#8d96a1;        /* Beschriftungen — 5,6:1 */
  --kachel:#c3cbd5;     /* Kacheltext — 8,3:1 auf --feld */
  --ak:#2f6f96; --ak2:#7fb6d6; --aufAk:#ffffff;
  --erde:#5d7a4f; --erdeInk:#9db98d; --erdeBg:#151b14; --erdeBg2:#1a2118;
  color-scheme:dark;
}
[data-modus="hell"]{
  --grund:#f7f5f1; --feld:#ffffff; --feld2:#eceae5; --linie:#dedad2;
  --ink:#1a1d21;        /* 15,8:1 */
  --dim2:#4a5058;       /* 8,2:1 */
  --dim:#6b7280;        /* 5,2:1 */
  --kachel:#2b3038;     /* 12,1:1 auf --feld */
  --ak:#1d5b80; --ak2:#175070; --aufAk:#ffffff;
  --erde:#4f6b42; --erdeInk:#3d5433; --erdeBg:#f0f3ec; --erdeBg2:#e6ebe0;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:auto}
body{margin:0;background:var(--grund);color:var(--ink);
  font:400 16px/1.68 -apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;transition:background .18s,color .18s}
a{color:var(--ak2)}

/* Zeilenfarben der zehn Gewalten, je Modus eigen */
:root, [data-modus="dunkel"]{
  --g1:#8E9BAE;
  --g2:#A8845C;
  --g3:#9B6B7D;
  --g4:#6D9A8F;
  --g5:#2980B9;
  --g6:#7A8B6B;
  --g7:#8C7BA6;
  --g8:#A67B5B;
  --g9:#6B8CA6;
  --g10:#8A8A9E;
}
[data-modus="hell"]{
  --g1:#48566b;
  --g2:#6b4f2c;
  --g3:#6a3f4f;
  --g4:#35604f;
  --g5:#1d5b80;
  --g6:#47583a;
  --g7:#574a6e;
  --g8:#6d4a2e;
  --g9:#3a5a72;
  --g10:#4d4d61;
}
.g1{--c:var(--g1)}
.g2{--c:var(--g2)}
.g3{--c:var(--g3)}
.g4{--c:var(--g4)}
.g5{--c:var(--g5)}
.g6{--c:var(--g6)}
.g7{--c:var(--g7)}
.g8{--c:var(--g8)}
.g9{--c:var(--g9)}
.g10{--c:var(--g10)}
.lese.f1{border-left-color:var(--g1)}
.lese.f2{border-left-color:var(--g2)}
.lese.f3{border-left-color:var(--g3)}
.lese.f4{border-left-color:var(--g4)}
.lese.f5{border-left-color:var(--g5)}
.lese.f6{border-left-color:var(--g6)}
.lese.f7{border-left-color:var(--g7)}
.lese.f8{border-left-color:var(--g8)}
.lese.f9{border-left-color:var(--g9)}
.lese.f10{border-left-color:var(--g10)}
.lese.f0{border-left-color:var(--erde)}