Fix: Dark-Mode CSS-Syntax korrigiert — html.dark + @media getrennt (SW by-v956)

Ungültige Syntax (@media..., html.dark kombiniert) aufgelöst.
Zwei separate valide Blöcke: html.dark{} für JS-Klasse, @media{} als Fallback.

backend/main.py

@@ -406,7 +406,7 @@ async def serve_media(path: str, request: _Request):
         raise _HE(404, "Nicht gefunden.")
     return _media_response(filepath)
 
-APP_VER = "955"  # muss mit APP_VER in app.js übereinstimmen
+APP_VER = "956"  # muss mit APP_VER in app.js übereinstimmen
 
 @app.get("/.well-known/assetlinks.json")
 async def assetlinks():

backend/static/js/app.js

@@ -3,7 +3,7 @@
    Router, State-Management, Navigation, Initialisierung.
    ============================================================ */
 
-const APP_VER     = '955'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
+const APP_VER     = '956'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
 const APP_VERSION = '1.5.1'; // ← semantische Version, wird bei make release gesetzt
 const IS_STAGING  = location.hostname === 'staging.banyaro.app';
 // Cache-Bust-Parameter nach Update-Reload sofort entfernen

backend/static/landing.html

@@ -605,7 +605,19 @@
     .fade-up.visible { opacity: 1; transform: none; }
 
     /* Dark Mode */
-    @media (prefers-color-scheme: dark), html.dark {
+    /* Dark-Mode via JS-Klasse (html.dark) — Fallback für macOS 26 / Brave */
+    html.dark {
+      --bg:            #141210;
+      --surface:       #1e1a16;
+      --text:          #ede8e2;
+      --text-secondary:#a89880;
+      --text-muted:    #6b5e50;
+      --border:        #2e2620;
+      --primary-light: #3a2510;
+      color-scheme:    dark;
+    }
+    /* Dark-Mode via Media Query (Standard-Browser-Fallback) */
+    @media (prefers-color-scheme: dark) {
       :root {
         --bg:            #141210;
         --surface:       #1e1a16;
@@ -616,37 +628,37 @@
         --primary-light: #3a2510;
         color-scheme:    dark;
       }
-      body    { background: #141210 !important; color: #ede8e2 !important; }
-      nav     { background: #1a1612 !important; border-color: #2e2620 !important; }
-      nav a   { color: #a89880 !important; }
-      nav .nav-brand { color: #C4843A !important; }
-      section { background: #141210 !important; }
-      section:nth-child(even) { background: #1a1612 !important; }
-      #fuer-beide  { background: #1a1612 !important; }
-      #funktionen  { background: #1a1612 !important; }
-      #welpen      { background: #1a1612 !important; }
-      #stimmen     { background: #141210 !important; }
-      #zuechter    { background: #1a1208 !important; }
-      #warum       { background: #141210 !important; }
-      #vergleich   { background: #1a1612 !important; }
-      #preise      { background: #141210 !important; }
-      #ueber       { background: #1a1612 !important; }
-      .outcome-card  { background: #1e1a16 !important; border-color: #2e2620 !important; }
-      .feature-card  { background: #1e1a16 !important; border-color: #2e2620 !important; }
-      .testimonial-card { background: #1e1a16 !important; border-color: #2e2620 !important; }
-      .pricing-card  { background: #1e1a16 !important; border-color: #2e2620 !important; }
-      .pricing-card.featured { border-color: #C4843A !important; }
-      .audience-card > div   { background: #1e1a16 !important; border-color: #2e2620 !important; }
-      .feature-group-label   { background: #3a2510 !important; color: #C4843A !important; }
-      h2, h3  { color: #ede8e2 !important; }
-      p       { color: #a89880; }
-      table   { background: #1e1a16 !important; }
-      th      { background: #C4843A !important; }
-      td      { border-color: #2e2620 !important; color: #ede8e2 !important; }
-      tr:nth-child(even) td { background: #141210 !important; }
-      footer  { background: #0d0b09 !important; }
-      .section-intro { color: #a89880 !important; }
     }
+    html.dark body    { background: #141210 !important; color: #ede8e2 !important; }
+    html.dark nav     { background: #1a1612 !important; border-color: #2e2620 !important; }
+    html.dark nav a   { color: #a89880 !important; }
+    html.dark nav .nav-brand { color: #C4843A !important; }
+    html.dark section { background: #141210 !important; }
+    html.dark section:nth-child(even) { background: #1a1612 !important; }
+    html.dark #fuer-beide { background: #1a1612 !important; }
+    html.dark #funktionen { background: #1a1612 !important; }
+    html.dark #welpen     { background: #1a1612 !important; }
+    html.dark #stimmen    { background: #141210 !important; }
+    html.dark #zuechter   { background: #1a1208 !important; }
+    html.dark #warum      { background: #141210 !important; }
+    html.dark #vergleich  { background: #1a1612 !important; }
+    html.dark #preise     { background: #141210 !important; }
+    html.dark #ueber      { background: #1a1612 !important; }
+    html.dark .outcome-card    { background: #1e1a16 !important; border-color: #2e2620 !important; }
+    html.dark .feature-card    { background: #1e1a16 !important; border-color: #2e2620 !important; }
+    html.dark .testimonial-card{ background: #1e1a16 !important; border-color: #2e2620 !important; }
+    html.dark .pricing-card    { background: #1e1a16 !important; border-color: #2e2620 !important; }
+    html.dark .pricing-card.featured { border-color: #C4843A !important; }
+    html.dark .audience-card > div { background: #1e1a16 !important; border-color: #2e2620 !important; }
+    html.dark .feature-group-label { background: #3a2510 !important; color: #C4843A !important; }
+    html.dark h2, html.dark h3 { color: #ede8e2 !important; }
+    html.dark p   { color: #a89880; }
+    html.dark table { background: #1e1a16 !important; }
+    html.dark th    { background: #C4843A !important; }
+    html.dark td    { border-color: #2e2620 !important; color: #ede8e2 !important; }
+    html.dark tr:nth-child(even) td { background: #141210 !important; }
+    html.dark footer { background: #0d0b09 !important; }
+    html.dark .section-intro { color: #a89880 !important; }
   </style>
 </head>
 <body>

backend/static/sw.js

@@ -3,7 +3,7 @@
    Offline-Cache + Push Notifications + Tile-Cache
    ============================================================ */
 
-const CACHE_VERSION = 'by-v955';
+const CACHE_VERSION = 'by-v956';
 const CACHE_STATIC  = `${CACHE_VERSION}-static`;
 const CACHE_TILES   = 'ban-yaro-tiles-v1';  // bleibt über SW-Updates erhalten
 const CACHE_API     = 'ban-yaro-api-v1';    // API-Response-Cache