feat(shell): Routen, Kopfzeile, Hell/Dunkel, Spenden-Banner

- Router: Routen home, gestalten, cards, community/<id>, reset; Umleitung
  /?karte=<id> nach /gestalten?karte=<id>; Titel je Route (titleFor);
  Hash-Ziele (/#community) scrollen den Anker ins Bild, nur-Hash-Wechsel
  bauen die Seite nicht neu auf.
- Kopfzeile: Navigation, Suche (Enter -> /?q=...#community), Spenden-Knopf,
  Hell/Dunkel-Schalter, Menue unter 900 px, Konto als Avatar-Kreis mit Menue.
- Theme: data-theme auf <html> (Skript im <head> gegen Aufblitzen), helle
  Tokens, danger-/warn-/ok-text-Tokens statt fester Farben.
- Spenden-Banner (schliessbar); ohne DONATE_URL bleiben Banner und Knopf weg.
- User.labels und isAdmin; Platzhalter fuer Startseite und Detailseite.

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

web/src/styles.css

@@ -1,4 +1,5 @@
-:root {
+:root,
+:root[data-theme='dark'] {
   --bg: #0F1828;
   --panel: #162133;
   --panel-2: #1B2738;
@@ -10,12 +11,43 @@
   --muted: #9DB0C8;
   --primary: #2A4566;
   --primary-hover: #34557C;
+  --on-primary: #E8EEF7;
   --danger: #E5484D;
+  --danger-text: #ff9a9d;
+  --warn-text: #f2c66d;
+  --ok-text: #8fd9a8;
+  --backdrop: rgb(6 11 20 / 0.72);
+  --shadow-lg: 0 24px 80px rgb(0 0 0 / 0.55);
+  --shadow-card: 0 10px 34px rgb(0 0 0 / 0.45);
   --radius: 14px;
 
   color-scheme: dark;
 }
 
+/* Hell: nur die Oberfläche; die Kartenfarben (Vorschau, PNG) hängen nicht vom Theme ab. */
+:root[data-theme='light'] {
+  --bg: #F4F6FB;
+  --panel: #FFFFFF;
+  --panel-2: #EEF1F7;
+  --line: #D9DFEA;
+  --line-strong: #B8C2D3;
+  --sel-bg: #E3ECFB;
+  --sel-line: #3A6FD8;
+  --text: #0F1828;
+  --muted: #5B6B82;
+  --primary: #2A4566;
+  --primary-hover: #34557C;
+  --on-primary: #FFFFFF;
+  --danger-text: #B42318;
+  --warn-text: #8A5A00;
+  --ok-text: #1B6B3A;
+  --backdrop: rgb(15 24 40 / 0.5);
+  --shadow-lg: 0 24px 80px rgb(15 24 40 / 0.28);
+  --shadow-card: 0 10px 34px rgb(15 24 40 / 0.22);
+
+  color-scheme: light;
+}
+
 *,
 *::before,
 *::after {
@@ -47,63 +79,6 @@ a {
   outline-offset: 2px;
 }
 
-#app-header {
-  display: flex;
-  align-items: center;
-  gap: 24px;
-  padding: 14px 20px;
-  background: var(--panel);
-  border-bottom: 1px solid var(--line);
-}
-
-.brand {
-  display: inline-flex;
-  align-items: center;
-  gap: 10px;
-  color: var(--text);
-  font-size: 1.35rem;
-  font-weight: 800;
-  letter-spacing: 0.01em;
-  text-decoration: none;
-  white-space: nowrap;
-}
-
-.brand img {
-  display: block;
-  flex: none;
-  width: 28px;
-  height: 28px;
-}
-
-/* Schmale Bildschirme: Marke etwas kleiner, damit sie samt „Meine Karten“ in die erste Kopfzeile passt */
-@media (max-width: 599px) {
-  .brand {
-    gap: 8px;
-    font-size: 1.2rem;
-  }
-
-  .brand img {
-    width: 24px;
-    height: 24px;
-  }
-}
-
-.app-nav a {
-  color: var(--muted);
-  font-weight: 600;
-  text-decoration: none;
-}
-
-.app-nav a:hover {
-  color: var(--text);
-}
-
-#account-slot {
-  display: flex;
-  align-items: center;
-  margin-left: auto;
-}
-
 #app-root {
   flex: 1;
   width: 100%;