/* Seitenwechsel (28.10.2026): eine Fläche mit Wellenkante steigt über die Seite, drei Wasserlinien laufen ihr voraus wie im Ruf nach 05; ist alles
   bedeckt, steht kurz das Logo da; auf der neuen Seite läuft das Wasser nach unten ab. Die Fläche hat den Ton der Seite, eine Stufe heller als
   der Grund bei Nacht und eine Stufe dunkler bei Tag (Jonah: „nicht weiß, sondern in dem Design … wie gerade der Helligkeitsmodus“).
   Bewegt wird nur .ue-wasser per transform (quelle/uebergang.js); Kante und Linien zeichnet das Skript einmal je Wechsel. */
.uebergang { --ue-flaeche: #1a1613; --ue-linie: rgb(var(--vg-k) / .5); --ue-wort: rgb(var(--vg-k));
             position: fixed; inset: 0; z-index: 9999; pointer-events: none; visibility: hidden; overflow: hidden; contain: strict; }
html.hell .uebergang { --ue-flaeche: #f1e5d9; }
.ue-wasser { position: absolute; left: 0; top: 0; width: 100%; overflow: visible; transform: translate3d(0, var(--ue-h, 100vh), 0); will-change: transform; }
.ue-welle { display: block; height: var(--ue-band, 140px); overflow: visible; }   /* Breite und Versatz setzt das Skript (über den Rand hinaus fürs Mitziehen) */
.ue-welle-unten { margin-top: -1px; }
.ue-tief { height: var(--ue-h, 100vh); margin-top: -1px; background: var(--ue-flaeche); }
.ue-flaeche { fill: var(--ue-flaeche); }
.ue-linie { fill: none; stroke: var(--ue-linie); stroke-width: 1.4; stroke-linecap: round; transform-box: view-box; }
.ue-marke { position: absolute; left: 50%; top: 50%; width: clamp(150px, 15vw, 230px); transform: translate(-50%, -50%); opacity: 0; color: var(--ue-wort); }
.ue-marke svg { display: block; width: 100%; height: auto; overflow: visible; }
.uebergang.laeuft { visibility: visible; pointer-events: auto; }
/* Die neue Seite kommt bedeckt an (bis das Skript übernimmt); läuft es nicht, gibt der Notausgang die Seite nach 2,5 s frei */
html.wechsel .uebergang { visibility: visible; background: var(--ue-flaeche); animation: ue-notaus 0s 2.5s forwards; }
html.wechsel .ue-marke { opacity: 1; }
@keyframes ue-notaus { to { visibility: hidden; } }
@media (prefers-reduced-motion: reduce) { .uebergang { display: none; } }
