feat(design): Wellen in der Seitenleiste von Aura rollen

Die festen Huegel weichen drei Wellenkacheln (aura-wave-back/mid/front).
Jede ist genau eine Sinusperiode breit, wiederholt sich waagerecht und
wandert in 40 s um ihre eigene Kachelbreite - nahtlos und in beiden
Modi. Unterschiedliche Kachelbreiten ergeben unterschiedliche
Geschwindigkeiten. Loest aura-hills ab; bei prefers-reduced-motion
stehen die Wellen still.

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

public/themes/aura-sidebar.svg

@@ -1,8 +1,8 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 260 900" width="260" height="900" preserveAspectRatio="xMidYMax slice">
   <!--
-    Aura, Seitenleiste: sanfte Huegel in Pastell, von unten hereinwachsend.
-    Eine Datei fuer beide Modi - der Schleier des Mond-Modus toent sie zur
-    Nacht ab (index.css).
+    Aura, Seitenleiste: nur der warme Dunst ueber dem unteren Rand. Die Wellen
+    darueber liegen in eigenen Dateien (aura-wave-*.svg), weil sie sich
+    bewegen und dafuer einzeln verschoben werden muessen.
   -->
   <defs>
     <linearGradient id="dunst" x1="0" y1="0" x2="0" y2="1">
@@ -14,7 +14,4 @@
     </filter>
   </defs>
   <rect y="520" width="260" height="380" fill="url(#dunst)" filter="url(#weich)" />
-  <path d="M0 730 C 60 690 120 700 170 720 C 210 736 240 716 260 706 L260 900 L0 900 Z" fill="#c7b8e8" opacity="0.5" />
-  <path d="M0 780 C 50 760 110 772 160 764 C 200 758 236 770 260 762 L260 900 L0 900 Z" fill="#f2b98a" opacity="0.55" />
-  <path d="M0 830 C 70 812 130 826 190 818 C 220 814 244 820 260 816 L260 900 L0 900 Z" fill="#9fcfa8" opacity="0.55" />
 </svg>

public/themes/aura-wave-back.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 235" width="400" height="235" preserveAspectRatio="none">
+  <!--
+    Aura, Seitenleiste: eine Wellenlage. Genau eine Sinusperiode ueber die
+    Breite der Kachel - deshalb passt sie waagerecht nahtlos an sich selbst,
+    und index.css kann sie endlos durchschieben, ohne dass es ruckt.
+
+    Drei solche Kacheln liegen uebereinander (aura-wave-back.svg ist eine davon); jede ist
+    anders breit und wandert deshalb bei gleicher Dauer unterschiedlich
+    schnell - das gibt Tiefe.
+  -->
+  <path d="M0 40.0 L10 41.4 L20 42.8 L30 44.1 L40 45.3 L50 46.4 L60 47.3 L70 48.0 L80 48.6 L90 48.9 L100 49.0 L110 48.9 L120 48.6 L130 48.0 L140 47.3 L150 46.4 L160 45.3 L170 44.1 L180 42.8 L190 41.4 L200 40.0 L210 38.6 L220 37.2 L230 35.9 L240 34.7 L250 33.6 L260 32.7 L270 32.0 L280 31.4 L290 31.1 L300 31.0 L310 31.1 L320 31.4 L330 32.0 L340 32.7 L350 33.6 L360 34.7 L370 35.9 L380 37.2 L390 38.6 L400 40.0 L400 235 L0 235 Z" fill="#c7b8e8" opacity="0.55" />
+</svg>

public/themes/aura-wave-front.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 260 165" width="260" height="165" preserveAspectRatio="none">
+  <!--
+    Aura, Seitenleiste: eine Wellenlage. Genau eine Sinusperiode ueber die
+    Breite der Kachel - deshalb passt sie waagerecht nahtlos an sich selbst,
+    und index.css kann sie endlos durchschieben, ohne dass es ruckt.
+
+    Drei solche Kacheln liegen uebereinander (aura-wave-front.svg ist eine davon); jede ist
+    anders breit und wandert deshalb bei gleicher Dauer unterschiedlich
+    schnell - das gibt Tiefe.
+  -->
+  <path d="M0 55.7 L10 53.3 L20 50.6 L30 47.5 L40 44.4 L50 41.3 L60 38.6 L70 36.2 L80 34.5 L90 33.4 L100 33.0 L110 33.4 L120 34.5 L130 36.3 L140 38.7 L150 41.4 L160 44.5 L170 47.6 L180 50.7 L190 53.4 L200 55.8 L210 57.5 L220 58.6 L230 59.0 L240 58.6 L250 57.5 L260 55.7 L260 165 L0 165 Z" fill="#9fcfa8" opacity="0.6" />
+</svg>

public/themes/aura-wave-mid.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 200" width="320" height="200" preserveAspectRatio="none">
+  <!--
+    Aura, Seitenleiste: eine Wellenlage. Genau eine Sinusperiode ueber die
+    Breite der Kachel - deshalb passt sie waagerecht nahtlos an sich selbst,
+    und index.css kann sie endlos durchschieben, ohne dass es ruckt.
+
+    Drei solche Kacheln liegen uebereinander (aura-wave-mid.svg ist eine davon); jede ist
+    anders breit und wandert deshalb bei gleicher Dauer unterschiedlich
+    schnell - das gibt Tiefe.
+  -->
+  <path d="M0 55.8 L10 56.6 L20 57.0 L30 56.9 L40 56.5 L50 55.6 L60 54.4 L70 52.8 L80 51.0 L90 49.0 L100 46.9 L110 44.7 L120 42.6 L130 40.6 L140 38.9 L150 37.4 L160 36.2 L170 35.4 L180 35.0 L190 35.1 L200 35.5 L210 36.4 L220 37.6 L230 39.2 L240 41.0 L250 43.0 L260 45.1 L270 47.3 L280 49.4 L290 51.4 L300 53.1 L310 54.6 L320 55.8 L320 200 L0 200 Z" fill="#f2b98a" opacity="0.5" />
+</svg>