/* myWerkzeug.de – Hell- und Dunkelmodus (gemeinsam für alle Seiten mit Umschalter).
   data-theme="light|dark" setzt das Inline-Skript im <head> vor dem ersten Zeichnen (siehe public/_auth/thema.php),
   data-thema-wahl="system|hell|dunkel" ist die Wahl des Besuchers (localStorage „mw-thema“).
   Ohne Skript gilt die Systemeinstellung (prefers-color-scheme).
   Fachgrafiken (Szenen, Aufgabenbilder, Helfer-Bilder) bleiben bewusst auf heller „Papier-Karte“. */

/* <NH_FARBEN> erzeugt mit php tools/thema_css.php – nicht von Hand ändern */
:root{
  --c-strom:#af3d36;
  --c-strom-papier:#af3d36;
  --c-spannung:#2855ad;
  --c-spannung-papier:#2855ad;
  --c-leistung:#6c489a;
  --c-leistung-papier:#6c489a;
  --c-widerstand:#447838;
  --c-widerstand-papier:#447838;
  --c-volumenstrom:#247885;
  --c-volumenstrom-papier:#247885;
  --c-druck:#a3621c;
  --c-druck-papier:#a3621c;
  --c-temperatur:#aa4673;
  --c-temperatur-papier:#aa4673;
  --c-neutral1:#364452;
  --c-neutral1-papier:#364452;
  --c-neutral2:#5e6a77;
  --c-neutral2-papier:#5e6a77;
  --c-neutral3:#6b7580;
  --c-neutral3-papier:#6b7580;
  --raised-2:#f9fafe;
  --neutral-soft:#eceff7;
  --ok-rand:#bfe3c9;
  --err-rand:#f5b3b7;
  --warn-rand:#f0d58a;
  --info-rand:#c9d3ff;
  --auf-c:#ffffff;
  --schatten-gross:0 20px 50px rgba(10,21,64,.25);
  --navy-rand:transparent;
  --papier-karte:#ffffff;
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --navy:#0f1836;
  --nv:#0f1836;
  --navy-2:#18244f;
  --navy2:#18244f;
  --blue:#8ea3ff;
  --blau:#8ea3ff;
  --tb:#8ea3ff;
  --az:#8ea3ff;
  --blau2:#a9b9ff;
  --tb2:#a9b9ff;
  --blue-hover:#a9b9ff;
  --blue-soft:#1c2754;
  --blau-hell:#1c2754;
  --auf-blau:#0a1540;
  --volt:#c4ff1a;
  --amber:#ffb21e;
  --akzent:#ffb21e;
  --ink:#e6eaf6;
  --text:#e6eaf6;
  --tx:#e6eaf6;
  --muted:#b3bcd6;
  --text2:#b3bcd6;
  --mut:#b3bcd6;
  --soft:#959fbe;
  --leise:#959fbe;
  --surface:#0b1020;
  --paper:#0b1020;
  --papier:#0b1020;
  --bg:#0b1020;
  --raised:#141b31;
  --flaeche:#141b31;
  --card:#141b31;
  --line:#273150;
  --linie:#273150;
  --ok:#9bd65a;
  --warn:#f0b44a;
  --err:#ff8f94;
  --c-strom:#ef7a72;
  --c-spannung:#7fa3ef;
  --c-leistung:#b394e0;
  --c-widerstand:#86c274;
  --c-volumenstrom:#5cc2d0;
  --c-druck:#e3a05a;
  --c-temperatur:#e889b3;
  --c-neutral1:#c3ccd6;
  --c-neutral2:#a7b1bd;
  --c-neutral3:#949eaa;
  --el:#8a9eff;
  --wg:#4fc7bb;
  --gr:#b09bff;
  --flaeche2:#1a2240;
  --raised-2:#19213c;
  --linie2:#3b466a;
  --line-2:#3b466a;
  --line-strong:#6a77a0;
  --neutral-soft:#222a45;
  --ok-hell:#18280f;
  --ok-soft:#18280f;
  --ok-bg:#12281b;
  --ok-rand:#2c5a35;
  --err-hell:#391820;
  --err-soft:#391820;
  --err-bg:#391820;
  --err-rand:#6e2a33;
  --warn-soft:#33260e;
  --warn-bg:#33260e;
  --warn-rand:#6a4f12;
  --info-rand:#34437e;
  --auf-c:#0b1020;
  --el-bg:#1b2550;
  --el-2:#2f3d7e;
  --wg-bg:#0f2e2c;
  --wg-2:#1f5650;
  --gr-bg:#261e4c;
  --gr-2:#42377d;
  --al:#aab3cf;
  --al-bg:#222a44;
  --karo:rgba(142,163,255,.055);
  --schatten:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.24);
  --schatten-gross:0 24px 60px rgba(0,0,0,.55);
  --fokus:0 0 0 2px #0b1020,0 0 0 4px var(--blau);
  --focus:0 0 0 2px #0b1020,0 0 0 4px #8ea3ff;
  --navy-rand:rgba(142,163,255,.16);
  --papier-karte:#f4f6fb;
}
:root[data-theme="dark"] .szene,:root[data-theme="dark"] .held-tafel,:root[data-theme="dark"] .pr-bild,:root[data-theme="dark"] .bild,:root[data-theme="dark"] .svgw,:root[data-theme="dark"] .vbild,:root[data-theme="dark"] .mailbild,:root[data-theme="dark"] .papier{
  color-scheme:light;color:#0a1540;
  --navy:#0a1540;
  --nv:#0a1540;
  --navy-2:#14215a;
  --navy2:#14215a;
  --blue:#1f3fe0;
  --blau:#1f3fe0;
  --tb:#1f3fe0;
  --az:#1f3fe0;
  --blau2:#1631c0;
  --tb2:#1631c0;
  --blue-hover:#1631c0;
  --blue-soft:#e6ebff;
  --blau-hell:#e6ebff;
  --auf-blau:#ffffff;
  --volt:#c4ff1a;
  --amber:#ffb21e;
  --akzent:#ffb21e;
  --ink:#0a1540;
  --text:#0a1540;
  --tx:#0a1540;
  --muted:#4f5a7d;
  --text2:#4f5a7d;
  --mut:#4f5a7d;
  --soft:#5d6788;
  --leise:#5d6788;
  --surface:#f3f5fa;
  --paper:#f3f5fa;
  --papier:#f3f5fa;
  --bg:#f3f5fa;
  --raised:#ffffff;
  --flaeche:#ffffff;
  --card:#ffffff;
  --line:#dbe1ee;
  --linie:#dbe1ee;
  --ok:#3f6a00;
  --warn:#8a5a00;
  --err:#b3202a;
  --c-strom:var(--c-strom-papier,#af3d36);
  --c-spannung:var(--c-spannung-papier,#2855ad);
  --c-leistung:var(--c-leistung-papier,#6c489a);
  --c-widerstand:var(--c-widerstand-papier,#447838);
  --c-volumenstrom:var(--c-volumenstrom-papier,#247885);
  --c-druck:var(--c-druck-papier,#a3621c);
  --c-temperatur:var(--c-temperatur-papier,#aa4673);
  --c-neutral1:var(--c-neutral1-papier,#364452);
  --c-neutral2:var(--c-neutral2-papier,#5e6a77);
  --c-neutral3:var(--c-neutral3-papier,#6b7580);
  --el:#2c47d8;
  --wg:#0c7c74;
  --gr:#6a48cf;
  --flaeche2:#f7f9fc;
  --raised-2:#f9fafe;
  --linie2:#c3cbe0;
  --line-2:#c3cbe0;
  --line-strong:#717c9a;
  --neutral-soft:#eceff7;
  --ok-hell:#f1ffd2;
  --ok-soft:#effdc2;
  --ok-bg:#e7f6ec;
  --ok-rand:#bfe3c9;
  --err-hell:#ffe6e7;
  --err-soft:#ffe4e5;
  --err-bg:#ffe4e5;
  --err-rand:#f5b3b7;
  --warn-soft:#fff1cc;
  --warn-bg:#fff1cc;
  --warn-rand:#f0d58a;
  --info-rand:#c9d3ff;
  --auf-c:#ffffff;
  --el-bg:#e8edff;
  --el-2:#c9d4ff;
  --wg-bg:#dcf3ef;
  --wg-2:#a9e0d7;
  --gr-bg:#eee9ff;
  --gr-2:#d4c8fb;
  --al:#4a5579;
  --al-bg:#eceff6;
  --karo:rgba(31,63,224,.06);
  --schatten:0 1px 2px rgba(10,21,64,.06),0 6px 20px rgba(10,21,64,.07);
  --schatten-gross:0 20px 50px rgba(10,21,64,.25);
  --fokus:0 0 0 2px #fff,0 0 0 4px var(--blau);
  --focus:0 0 0 2px #ffffff,0 0 0 4px #1f3fe0;
  --navy-rand:transparent;
}
@media (prefers-color-scheme:dark){
:root:not([data-theme="light"]){
  color-scheme:dark;
  --navy:#0f1836;
  --nv:#0f1836;
  --navy-2:#18244f;
  --navy2:#18244f;
  --blue:#8ea3ff;
  --blau:#8ea3ff;
  --tb:#8ea3ff;
  --az:#8ea3ff;
  --blau2:#a9b9ff;
  --tb2:#a9b9ff;
  --blue-hover:#a9b9ff;
  --blue-soft:#1c2754;
  --blau-hell:#1c2754;
  --auf-blau:#0a1540;
  --volt:#c4ff1a;
  --amber:#ffb21e;
  --akzent:#ffb21e;
  --ink:#e6eaf6;
  --text:#e6eaf6;
  --tx:#e6eaf6;
  --muted:#b3bcd6;
  --text2:#b3bcd6;
  --mut:#b3bcd6;
  --soft:#959fbe;
  --leise:#959fbe;
  --surface:#0b1020;
  --paper:#0b1020;
  --papier:#0b1020;
  --bg:#0b1020;
  --raised:#141b31;
  --flaeche:#141b31;
  --card:#141b31;
  --line:#273150;
  --linie:#273150;
  --ok:#9bd65a;
  --warn:#f0b44a;
  --err:#ff8f94;
  --c-strom:#ef7a72;
  --c-spannung:#7fa3ef;
  --c-leistung:#b394e0;
  --c-widerstand:#86c274;
  --c-volumenstrom:#5cc2d0;
  --c-druck:#e3a05a;
  --c-temperatur:#e889b3;
  --c-neutral1:#c3ccd6;
  --c-neutral2:#a7b1bd;
  --c-neutral3:#949eaa;
  --el:#8a9eff;
  --wg:#4fc7bb;
  --gr:#b09bff;
  --flaeche2:#1a2240;
  --raised-2:#19213c;
  --linie2:#3b466a;
  --line-2:#3b466a;
  --line-strong:#6a77a0;
  --neutral-soft:#222a45;
  --ok-hell:#18280f;
  --ok-soft:#18280f;
  --ok-bg:#12281b;
  --ok-rand:#2c5a35;
  --err-hell:#391820;
  --err-soft:#391820;
  --err-bg:#391820;
  --err-rand:#6e2a33;
  --warn-soft:#33260e;
  --warn-bg:#33260e;
  --warn-rand:#6a4f12;
  --info-rand:#34437e;
  --auf-c:#0b1020;
  --el-bg:#1b2550;
  --el-2:#2f3d7e;
  --wg-bg:#0f2e2c;
  --wg-2:#1f5650;
  --gr-bg:#261e4c;
  --gr-2:#42377d;
  --al:#aab3cf;
  --al-bg:#222a44;
  --karo:rgba(142,163,255,.055);
  --schatten:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.24);
  --schatten-gross:0 24px 60px rgba(0,0,0,.55);
  --fokus:0 0 0 2px #0b1020,0 0 0 4px var(--blau);
  --focus:0 0 0 2px #0b1020,0 0 0 4px #8ea3ff;
  --navy-rand:rgba(142,163,255,.16);
  --papier-karte:#f4f6fb;
}
:root:not([data-theme="light"]) .szene,:root:not([data-theme="light"]) .held-tafel,:root:not([data-theme="light"]) .pr-bild,:root:not([data-theme="light"]) .bild,:root:not([data-theme="light"]) .svgw,:root:not([data-theme="light"]) .vbild,:root:not([data-theme="light"]) .mailbild,:root:not([data-theme="light"]) .papier{
  color-scheme:light;color:#0a1540;
  --navy:#0a1540;
  --nv:#0a1540;
  --navy-2:#14215a;
  --navy2:#14215a;
  --blue:#1f3fe0;
  --blau:#1f3fe0;
  --tb:#1f3fe0;
  --az:#1f3fe0;
  --blau2:#1631c0;
  --tb2:#1631c0;
  --blue-hover:#1631c0;
  --blue-soft:#e6ebff;
  --blau-hell:#e6ebff;
  --auf-blau:#ffffff;
  --volt:#c4ff1a;
  --amber:#ffb21e;
  --akzent:#ffb21e;
  --ink:#0a1540;
  --text:#0a1540;
  --tx:#0a1540;
  --muted:#4f5a7d;
  --text2:#4f5a7d;
  --mut:#4f5a7d;
  --soft:#5d6788;
  --leise:#5d6788;
  --surface:#f3f5fa;
  --paper:#f3f5fa;
  --papier:#f3f5fa;
  --bg:#f3f5fa;
  --raised:#ffffff;
  --flaeche:#ffffff;
  --card:#ffffff;
  --line:#dbe1ee;
  --linie:#dbe1ee;
  --ok:#3f6a00;
  --warn:#8a5a00;
  --err:#b3202a;
  --c-strom:var(--c-strom-papier,#af3d36);
  --c-spannung:var(--c-spannung-papier,#2855ad);
  --c-leistung:var(--c-leistung-papier,#6c489a);
  --c-widerstand:var(--c-widerstand-papier,#447838);
  --c-volumenstrom:var(--c-volumenstrom-papier,#247885);
  --c-druck:var(--c-druck-papier,#a3621c);
  --c-temperatur:var(--c-temperatur-papier,#aa4673);
  --c-neutral1:var(--c-neutral1-papier,#364452);
  --c-neutral2:var(--c-neutral2-papier,#5e6a77);
  --c-neutral3:var(--c-neutral3-papier,#6b7580);
  --el:#2c47d8;
  --wg:#0c7c74;
  --gr:#6a48cf;
  --flaeche2:#f7f9fc;
  --raised-2:#f9fafe;
  --linie2:#c3cbe0;
  --line-2:#c3cbe0;
  --line-strong:#717c9a;
  --neutral-soft:#eceff7;
  --ok-hell:#f1ffd2;
  --ok-soft:#effdc2;
  --ok-bg:#e7f6ec;
  --ok-rand:#bfe3c9;
  --err-hell:#ffe6e7;
  --err-soft:#ffe4e5;
  --err-bg:#ffe4e5;
  --err-rand:#f5b3b7;
  --warn-soft:#fff1cc;
  --warn-bg:#fff1cc;
  --warn-rand:#f0d58a;
  --info-rand:#c9d3ff;
  --auf-c:#ffffff;
  --el-bg:#e8edff;
  --el-2:#c9d4ff;
  --wg-bg:#dcf3ef;
  --wg-2:#a9e0d7;
  --gr-bg:#eee9ff;
  --gr-2:#d4c8fb;
  --al:#4a5579;
  --al-bg:#eceff6;
  --karo:rgba(31,63,224,.06);
  --schatten:0 1px 2px rgba(10,21,64,.06),0 6px 20px rgba(10,21,64,.07);
  --schatten-gross:0 20px 50px rgba(10,21,64,.25);
  --fokus:0 0 0 2px #fff,0 0 0 4px var(--blau);
  --focus:0 0 0 2px #ffffff,0 0 0 4px #1f3fe0;
  --navy-rand:transparent;
}
}
@media print{
:root[data-theme="dark"],:root:not([data-theme="light"]){
  color-scheme:light;color:#0a1540;
  --navy:#0a1540;
  --nv:#0a1540;
  --navy-2:#14215a;
  --navy2:#14215a;
  --blue:#1f3fe0;
  --blau:#1f3fe0;
  --tb:#1f3fe0;
  --az:#1f3fe0;
  --blau2:#1631c0;
  --tb2:#1631c0;
  --blue-hover:#1631c0;
  --blue-soft:#e6ebff;
  --blau-hell:#e6ebff;
  --auf-blau:#ffffff;
  --volt:#c4ff1a;
  --amber:#ffb21e;
  --akzent:#ffb21e;
  --ink:#0a1540;
  --text:#0a1540;
  --tx:#0a1540;
  --muted:#4f5a7d;
  --text2:#4f5a7d;
  --mut:#4f5a7d;
  --soft:#5d6788;
  --leise:#5d6788;
  --surface:#f3f5fa;
  --paper:#f3f5fa;
  --papier:#f3f5fa;
  --bg:#f3f5fa;
  --raised:#ffffff;
  --flaeche:#ffffff;
  --card:#ffffff;
  --line:#dbe1ee;
  --linie:#dbe1ee;
  --ok:#3f6a00;
  --warn:#8a5a00;
  --err:#b3202a;
  --c-strom:var(--c-strom-papier,#af3d36);
  --c-spannung:var(--c-spannung-papier,#2855ad);
  --c-leistung:var(--c-leistung-papier,#6c489a);
  --c-widerstand:var(--c-widerstand-papier,#447838);
  --c-volumenstrom:var(--c-volumenstrom-papier,#247885);
  --c-druck:var(--c-druck-papier,#a3621c);
  --c-temperatur:var(--c-temperatur-papier,#aa4673);
  --c-neutral1:var(--c-neutral1-papier,#364452);
  --c-neutral2:var(--c-neutral2-papier,#5e6a77);
  --c-neutral3:var(--c-neutral3-papier,#6b7580);
  --el:#2c47d8;
  --wg:#0c7c74;
  --gr:#6a48cf;
  --flaeche2:#f7f9fc;
  --raised-2:#f9fafe;
  --linie2:#c3cbe0;
  --line-2:#c3cbe0;
  --line-strong:#717c9a;
  --neutral-soft:#eceff7;
  --ok-hell:#f1ffd2;
  --ok-soft:#effdc2;
  --ok-bg:#e7f6ec;
  --ok-rand:#bfe3c9;
  --err-hell:#ffe6e7;
  --err-soft:#ffe4e5;
  --err-bg:#ffe4e5;
  --err-rand:#f5b3b7;
  --warn-soft:#fff1cc;
  --warn-bg:#fff1cc;
  --warn-rand:#f0d58a;
  --info-rand:#c9d3ff;
  --auf-c:#ffffff;
  --el-bg:#e8edff;
  --el-2:#c9d4ff;
  --wg-bg:#dcf3ef;
  --wg-2:#a9e0d7;
  --gr-bg:#eee9ff;
  --gr-2:#d4c8fb;
  --al:#4a5579;
  --al-bg:#eceff6;
  --karo:rgba(31,63,224,.06);
  --schatten:0 1px 2px rgba(10,21,64,.06),0 6px 20px rgba(10,21,64,.07);
  --schatten-gross:0 20px 50px rgba(10,21,64,.25);
  --fokus:0 0 0 2px #fff,0 0 0 4px var(--blau);
  --focus:0 0 0 2px #ffffff,0 0 0 4px #1f3fe0;
  --navy-rand:transparent;
}
}
/* </NH_FARBEN> */

/* ---------- Umschalter (Sonne / Mond / System) ---------- */
:root{--th-bg:#ffffff;--th-tx:#0a1540;--th-leise:#5d6788;--th-rand:#dbe1ee;--th-hover:#eef1fb;--th-akt:#1f3fe0;--th-schatten:0 18px 48px rgba(10,21,64,.22),0 2px 6px rgba(10,21,64,.1)}
:root[data-theme="dark"]{--th-bg:#1a2240;--th-tx:#e6eaf6;--th-leise:#a3acc8;--th-rand:#2f3a5c;--th-hover:#253058;--th-akt:#a9b9ff;--th-schatten:0 18px 48px rgba(0,0,0,.55),0 2px 6px rgba(0,0,0,.35)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--th-bg:#1a2240;--th-tx:#e6eaf6;--th-leise:#a3acc8;--th-rand:#2f3a5c;--th-hover:#253058;--th-akt:#a9b9ff;--th-schatten:0 18px 48px rgba(0,0,0,.55),0 2px 6px rgba(0,0,0,.35)}}

button.thema-knopf{position:relative;display:inline-grid;place-items:center;flex:none;width:36px;height:36px;margin:0;padding:0;border:1px solid rgba(255,255,255,.18);border-radius:10px;background:rgba(255,255,255,.05);color:#e6eaff;cursor:pointer;font:inherit;line-height:1;-webkit-tap-highlight-color:transparent;transition:background-color .15s,border-color .15s,color .15s}
button.thema-knopf:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.32);color:#fff}
button.thema-knopf[aria-expanded="true"]{background:rgba(255,255,255,.14);border-color:rgba(196,255,26,.55);color:#fff}
button.thema-knopf:focus-visible{outline:2px solid #c4ff1a;outline-offset:2px;box-shadow:none}
button.thema-knopf svg{grid-area:1/1;width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
button.thema-knopf .th-i{opacity:0;transform:rotate(-70deg) scale(.4);transform-origin:12px 12px;transition:opacity .25s ease,transform .45s cubic-bezier(.2,.9,.25,1.25)}
:root[data-thema-wahl="hell"] button.thema-knopf .th-sonne,
:root[data-thema-wahl="dunkel"] button.thema-knopf .th-mond,
:root[data-thema-wahl="system"] button.thema-knopf .th-auto,
:root:not([data-thema-wahl]) button.thema-knopf .th-auto{opacity:1;transform:none}
button.thema-knopf .th-auto .th-voll{fill:currentColor;stroke:none}
/* Variante auf heller Fläche (Anmeldeseiten) */
button.thema-knopf.auf-flaeche{border-color:var(--line,#d8deec);background:var(--raised,#fff);color:var(--ink,#0a1540)}
button.thema-knopf.auf-flaeche:hover{border-color:var(--line-strong,#717c9a);background:var(--blue-soft,#e3e9ff);color:var(--ink,#0a1540)}
button.thema-knopf.auf-flaeche[aria-expanded="true"]{border-color:var(--blue,#1f3fe0);background:var(--blue-soft,#e3e9ff);color:var(--ink,#0a1540)}
button.thema-knopf.auf-flaeche:focus-visible{outline-color:var(--blue,#1f3fe0)}

.thema-menue{position:fixed;z-index:1000;min-width:228px;max-width:calc(100vw - 24px);margin:0;padding:6px;border:1px solid var(--th-rand);border-radius:14px;background:var(--th-bg);color:var(--th-tx);box-shadow:var(--th-schatten);font-size:14px;line-height:1.3;font-weight:500;transform-origin:top right;animation:thMenue .16s cubic-bezier(.2,.8,.2,1)}
.thema-menue[hidden]{display:none}
.thema-menue .th-kopf{margin:0;padding:7px 10px 6px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:650;color:var(--th-leise)}
.thema-menue [role="menuitemradio"]{display:flex;align-items:center;gap:11px;width:100%;margin:0;padding:9px 10px;border:0;border-radius:9px;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;box-shadow:none}
.thema-menue [role="menuitemradio"]:hover,.thema-menue [role="menuitemradio"]:focus-visible{background:var(--th-hover);outline:none;box-shadow:none}
.thema-menue [role="menuitemradio"]:focus-visible{box-shadow:inset 0 0 0 2px var(--th-akt)}
.thema-menue [role="menuitemradio"] svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.thema-menue [role="menuitemradio"] .th-voll{fill:currentColor;stroke:none}
.thema-menue .th-text{flex:1;min-width:0}
.thema-menue .th-text small{display:block;margin-top:1px;font-size:12px;font-weight:500;color:var(--th-leise)}
.thema-menue .th-haken{width:16px;height:16px;opacity:0;color:var(--th-akt)}
.thema-menue [aria-checked="true"]{color:var(--th-akt);font-weight:650}
.thema-menue [aria-checked="true"] .th-haken{opacity:1}
@keyframes thMenue{from{opacity:0;transform:translateY(-4px) scale(.97)}}

/* sanfter Wechsel (View Transitions, sonst sofort) */
::view-transition-old(root),::view-transition-new(root){animation-duration:.28s;animation-timing-function:ease}
@media (prefers-reduced-motion:reduce){
  button.thema-knopf .th-i,.thema-menue{transition:none;animation:none}
  ::view-transition-old(root),::view-transition-new(root){animation:none}
}
@media print{button.thema-knopf,.thema-menue{display:none!important}}