feat(design): neues Theme Rainy mit Nieselregen und Wetterleuchten

Schieferblau in hell und dunkel. Ein paar Tropfen fallen per Canvas
ueber den Bildschirm und zerspritzen am unteren Rand; die Wolken der
oberen Leiste leuchten alle 7-18 s auf (Maske = Wolken-SVG). Bei
prefers-reduced-motion bleibt es still.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

docs/05-frontend.md

@@ -138,7 +138,7 @@ Die Darstellung hat **zwei unabhängige Achsen**, beide als Klasse am `<html>`:
 
 | Achse | Klasse | Werte |
 | --- | --- | --- |
-| Farbwelt | `theme-perinco`, `theme-pixel`, `theme-outdoor`, `theme-cyberpunk` | perinco ist der Standard |
+| Farbwelt | `theme-perinco`, `theme-pixel`, `theme-outdoor`, `theme-cyberpunk`, `theme-rainy` | perinco ist der Standard |
 | Modus | `dark` bzw. keine | hell, dunkel, oder der Systemeinstellung folgen |
 
 `src/index.css` tauscht darin nur Variablenwerte: `canvas`, `surface`, `ink-*`,
@@ -173,7 +173,7 @@ er liest den Benutzer.
 
 Alle Themes außer perinco legen eine Grafik hinter die obere Leiste und die
 Seitenleiste: 8-bit-Himmel und Steinmauer, blauer Himmel und Wiese,
-Neonröhren und regnerische Gasse. Die Dateien liegen als **SVG** in
+Neonröhren und regnerische Gasse, Regenwolken und nasse Hügel. Die Dateien liegen als **SVG** in
 `public/themes/` und sind von Hand gezeichnet - stilisierte Grafik statt Foto,
 damit sie in jeder Auflösung scharf bleibt und wenige Kilobyte wiegt.
 
@@ -212,6 +212,32 @@ Das ist kein Umweg, sondern erledigt zwei Dinge zugleich:
 > nur Licht - über Dunkel leuchtet das Neon, über Weiss bleiben blasse farbige
 > Linien. Wer eine Grafik ergänzt: **keine deckenden Flächen**, nur Motiv.
 
+### Rainy: das Theme mit Wetter
+
+Rainy ist das einzige Theme mit Bewegung. Farben und Grafiken funktionieren wie
+bei den anderen; dazu kommt `src/components/RainyWeather.tsx`, das der
+`ThemeProvider` nur bei aktivem Rainy einhängt - auch auf der Anmeldeseite, und
+beim Wechsel auf ein anderes Theme verschwindet es samt Animationsschleife.
+
+| Effekt | Umsetzung |
+| --- | --- |
+| **Nieselregen** | Ein `<canvas>` über dem ganzen Fenster. Alle 220–650 ms startet ein Tropfen (höchstens 14 gleichzeitig), fällt leicht schräg und zerspritzt am unteren Fensterrand in 3–6 Spritzer mit Schwerkraft plus einen kleinen Ring. Farbe aus `--rain-color` |
+| **Wetterleuchten** | Ein Element, das beim Blitz exakt über `.app-header` gelegt und per Web Animations API kurz eingeblendet wird (flackernd, 0,9 s, alle 7–18 s). Das Licht ist ein Schein um eine zufällige Stelle in der Mitte der Leiste |
+
+Der Trick beim Blitz ist die **Maske**: `.rainy-flash` benutzt
+`rainy-header.svg` - dieselbe Datei wie das Hintergrundbild, gleich skaliert -
+als `mask-image`. Das Licht erscheint dadurch nur auf den Wolken selbst. Die
+Grafik darf deshalb **nur Wolken** enthalten, keinen Himmel: sonst leuchtet die
+ganze Leiste. Im Dunkelmodus hellt der Blitz per `mix-blend-mode: screen` auf,
+im hellen Modus deckt er normal mit warmem Weiss (`--flash-blend`,
+`--flash-color`) - `screen` macht aus hellem Grau nur etwas helleres Grau.
+
+Beide Ebenen haben `pointer-events: none` und `z-[90]`, liegen also unter den
+Dialogen (`z-[100]`). Bei `prefers-reduced-motion: reduce` startet weder Regen
+noch Blitz. Die Canvas-Schleife läuft über `requestAnimationFrame` und ruht
+damit in Hintergrund-Tabs; der Zeitschritt ist auf 50 ms begrenzt, damit nach
+der Rückkehr nichts nachgeholt wird.
+
 ### Was ein neues Theme können muss
 
 Die Rollen der Skalen sind über die ganze App gleich; ein Theme, das sie