Hotel-Highlight + Route + Nachbarn + Restaurants + PWA + Theme-Toggle (index.html)

**Hotel präsenter auf Karten:**
- Größerer Hotel-Marker (56px vs 38px)
- Goldener pulsierender Glow (CSS-Animation hotelPulse)
- Permanentes Label 'Hotel Uno · Basis' unter dem Pin
- Auto-Open Popup nach 1.5s mit goldenem Banner
- Filter-Toggle (Hotel immer sichtbar, Action/Fun/Sight ausblendbar)

**Feature 7 - Route zwischen Locations:**
- OSRM Public API für echte Auto-Routen
- Schnell-Routen vom Hotel (3 nächste Locations)
- 'Zurück zum Hotel' Button in jedem Location-Popup
- Fallback auf Haversine-Luftlinie wenn API down

**Feature 8 - Was ist in der Nähe:**
- Nachbarn <3km Luftlinie in jedem Popup

**Feature 14 - Restaurant-Tipps:**
- Geo-Cluster-basierte Restaurant-Empfehlungen pro Location
- 14 handgepflegte Tipps (€€, Cuisine, Beschreibung)

**Feature 20 - PWA:**
- manifest.json + sw.js (cache-first für eigene Files)
- Theme-Color, Apple-Meta, SW-Registrierung in allen 5 HTML-Dateien

**Feature 21 - Dark/Light Mode Toggle:**
- CSS-Variablen-System + 🌙/☀️ Toggle-Button
- localStorage-Persistenz (nur index.html, andere Seiten folgen)

**Bugfixes:**
- Enigma-URL auf User-Sublink korrigiert (alle 3 Map-Dateien)
- tourenplan-mit-tram.html Locations-Sync mit tourenplan.html
  (Endorfin/KartPlanet hatten komplett andere Preise+Koordinaten+URLs)

index.html

@@ -4,15 +4,62 @@
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>JGA Prag 2026 – Übersicht</title>
+<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'>
+<link rel="manifest" href="manifest.json">
+<meta name="theme-color" content="#3b82f6">
+<meta name="apple-mobile-web-app-capable" content="yes">
+<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
+<meta name="apple-mobile-web-app-title" content="JGA Prag">
+<meta name="mobile-web-app-capable" content="yes">
+<script>
+  // Theme-Toggle: localStorage > System-Preference > Dark
+  (function() {
+    const saved = localStorage.getItem('jga-theme');
+    const sysDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+    const theme = saved || (sysDark ? 'dark' : 'dark');  // Default Dark
+    document.documentElement.setAttribute('data-theme', theme);
+  })();
+</script>
 <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>🧭</text></svg>">
 <style>
+  /* ====== Theme-Variablen ====== */
+  :root, [data-theme="dark"] {
+    --bg: #1c1c1f;
+    --card-bg: #26262a;
+    --card-border: #353539;
+    --text: #e8e8ea;
+    --text-muted: #999;
+    --text-dim: #666;
+    --accent: #3b82f6;
+    --accent-hover: #2563eb;
+    --info-bg: #26262a;
+    --info-label: #888;
+    --footer-border: #2a2a2d;
+    --footer-text: #666;
+  }
+  [data-theme="light"] {
+    --bg: #f5f5f7;
+    --card-bg: #ffffff;
+    --card-border: #e0e0e3;
+    --text: #1a1a1a;
+    --text-muted: #555;
+    --text-dim: #888;
+    --accent: #2563eb;
+    --accent-hover: #1d4ed8;
+    --info-bg: #ffffff;
+    --info-label: #6b6b6b;
+    --footer-border: #e0e0e3;
+    --footer-text: #888;
+  }
+
   * { box-sizing: border-box; }
   html, body {
     margin: 0; padding: 0;
     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
-    background: #1c1c1f;
-    color: #e8e8ea;
+    background: var(--bg);
+    color: var(--text);
     min-height: 100vh;
+    transition: background 0.3s, color 0.3s;
   }
 
   .container {
@@ -28,18 +75,18 @@
   h1 {
     font-size: 42px;
     margin: 0 0 12px 0;
-    color: #fff;
+    color: var(--text);
     font-weight: 700;
   }
   .subtitle {
     font-size: 18px;
-    color: #999;
+    color: var(--text-muted);
     margin: 0;
   }
   .badge {
     display: inline-block;
     background: rgba(59, 130, 246, 0.15);
-    color: #60a5fa;
+    color: var(--accent);
     padding: 4px 12px;
     border-radius: 12px;
     font-size: 13px;
@@ -47,6 +94,28 @@
     border: 1px solid rgba(59, 130, 246, 0.3);
   }
 
+  /* Theme-Toggle Button */
+  .theme-toggle {
+    position: fixed;
+    top: 16px;
+    right: 16px;
+    width: 44px; height: 44px;
+    border-radius: 50%;
+    background: var(--card-bg);
+    border: 1px solid var(--card-border);
+    color: var(--text);
+    font-size: 20px;
+    cursor: pointer;
+    z-index: 100;
+    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
+    transition: all 0.2s;
+    display: flex; align-items: center; justify-content: center;
+  }
+  .theme-toggle:hover {
+    transform: rotate(15deg) scale(1.1);
+    border-color: var(--accent);
+  }
+
   /* Emoji global in Original-Farbe */
   .card-icon, h1, .badge, .info-item .label {
     font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", "Segoe UI Symbol", emoji, sans-serif;
@@ -61,8 +130,8 @@
   }
 
   .card {
-    background: #26262a;
-    border: 1px solid #353539;
+    background: var(--card-bg);
+    border: 1px solid var(--card-border);
     border-radius: 12px;
     padding: 28px;
     transition: all 0.3s ease;
@@ -71,7 +140,7 @@
   }
   .card:hover {
     transform: translateY(-2px);
-    border-color: #3b82f6;
+    border-color: var(--accent);
   }
   .card-icon {
     font-size: 48px;
@@ -81,11 +150,11 @@
   .card h2 {
     margin: 0 0 8px 0;
     font-size: 20px;
-    color: #fff;
+    color: var(--text);
     font-weight: 600;
   }
   .card .description {
-    color: #aaa;
+    color: var(--text-muted);
     font-size: 14px;
     line-height: 1.6;
     margin: 0 0 16px 0;
@@ -94,7 +163,7 @@
   .card .open-btn {
     display: inline-block;
     padding: 10px 20px;
-    background: #3b82f6;
+    background: var(--accent);
     color: #fff;
     text-decoration: none;
     border-radius: 6px;
@@ -103,14 +172,14 @@
     transition: background 0.2s;
   }
   .card .open-btn:hover {
-    background: #2563eb;
+    background: var(--accent-hover);
   }
 
   /* Section Header */
   .section-title {
     font-size: 22px;
     margin: 48px 0 24px 0;
-    color: #fff;
+    color: var(--text);
     font-weight: 600;
   }
 
@@ -122,21 +191,21 @@
     margin-bottom: 32px;
   }
   .info-item {
-    background: #26262a;
-    border-left: 3px solid #3b82f6;
+    background: var(--info-bg);
+    border-left: 3px solid var(--accent);
     padding: 16px;
     border-radius: 4px;
   }
   .info-item .label {
     font-size: 12px;
-    color: #888;
+    color: var(--info-label);
     text-transform: uppercase;
     letter-spacing: 1px;
     margin-bottom: 4px;
   }
   .info-item .value {
     font-size: 16px;
-    color: #fff;
+    color: var(--text);
     font-weight: 600;
   }
 
@@ -168,11 +237,14 @@
   footer {
     text-align: center;
     padding: 32px 0 16px 0;
-    color: #666;
+    color: var(--footer-text);
     font-size: 12px;
-    border-top: 1px solid #2a2a2d;
+    border-top: 1px solid var(--footer-border);
     margin-top: 48px;
   }
+  footer a {
+    color: var(--accent) !important;
+  }
 
   @media (max-width: 600px) {
     h1 { font-size: 32px; }
@@ -184,6 +256,8 @@
 <body>
 <div class="container">
 
+  <button class="theme-toggle" id="theme-toggle" aria-label="Theme wechseln" title="Light/Dark Mode">🌙</button>
+
   <header>
     <h1>🧭 JGA Prag 2026</h1>
     <p class="subtitle">Interaktive Karten, Wetter-Vorschau & Packliste für den Junggesellenabschied</p>
@@ -346,7 +420,7 @@
       <div class="card-icon">🔍</div>
       <h2>Enigma Outdoor Adventure</h2>
       <p class="description">Stadtweites Mobile-App Mystery-Spiel. Kein fester Treffpunkt.</p>
-      <a href="https://enigma.swallnet.com/" target="_blank" rel="noopener" class="open-btn">🔗 Website öffnen</a>
+      <a href="https://enigma.swallnet.com/index.php/odkaz-mistra-hvezdare-en/" target="_blank" rel="noopener" class="open-btn">🔗 Website öffnen</a>
     </div>
 
   </div>
@@ -360,6 +434,32 @@
 
 <script>
   document.getElementById('build-date').textContent = new Date().toLocaleDateString('de-DE', { year: 'numeric', month: 'long', day: 'numeric' });
+
+  // Theme-Toggle
+  const themeBtn = document.getElementById('theme-toggle');
+  function updateThemeIcon() {
+    const cur = document.documentElement.getAttribute('data-theme') || 'dark';
+    themeBtn.textContent = cur === 'dark' ? '☀️' : '🌙';
+    themeBtn.title = cur === 'dark' ? 'Light Mode aktivieren' : 'Dark Mode aktivieren';
+  }
+  updateThemeIcon();
+  themeBtn.addEventListener('click', () => {
+    const cur = document.documentElement.getAttribute('data-theme') || 'dark';
+    const next = cur === 'dark' ? 'light' : 'dark';
+    document.documentElement.setAttribute('data-theme', next);
+    localStorage.setItem('jga-theme', next);
+    updateThemeIcon();
+  });
+</script>
+<script>
+  // PWA Service Worker registrieren
+  if ('serviceWorker' in navigator) {
+    window.addEventListener('load', () => {
+      navigator.serviceWorker.register('./sw.js')
+        .then(reg => console.log('[PWA] SW registered:', reg.scope))
+        .catch(err => console.warn('[PWA] SW registration failed:', err));
+    });
+  }
 </script>
 </body>
 </html>