Sprint D: Karten-Familie auf UI.map.create+svgMarker konsolidiert, SW by-v1107

Neue zentrale Helper (in Sprint B vorbereitet) jetzt von 5 Seiten genutzt:

walks.js (1 Karten-Init):
- L.map+L.tileLayer → await UI.map.create('walks-map', {...})
- _initMap zu async, Aufrufer in _switchView und _loadData angepasst
- Mini-Karte im Walk-Formular (Modal) bleibt unverändert
  (braucht eigene dragging/scrollWheelZoom-Options)
- view-toggle nicht migriert (responsive CSS-Konflikt mit Desktop)

poison.js (1 Karten-Init):
- L.map+L.tileLayer → await UI.map.create('poison-map', {...})
- _initMap zu async, manueller UI.loadLeaflet entfernt
- DangerCircle + User-Marker unverändert

events.js (1 Karten-Init + Diamant-Marker):
- await UI.map.create('ev-map', {...})
- Rotierter Diamant: L.divIcon+L.marker → UI.map.svgMarker
  (HTML 1:1 erhalten)

lost.js (1 Karten-Init + Puls-Marker):
- Eigene async _loadLeaflet() Funktion komplett entfernt — UI.map.create
  übernimmt das jetzt zentral
- await UI.map.create('lost-map', {...})
- Puls-Animation 🐕: L.divIcon+L.marker → UI.map.svgMarker
- _initMap zu async

routes.js (6 von 7 Karten-Inits):
- _suggestMap, _recMap, _searchMap, _navMap, trimMap, _buildDetailMap
  alle auf UI.map.create umgestellt + zu async
- _buildMiniMap (Route-Card-Preview) bleibt unverändert
  (braucht 6 spezifische Interaction-Disable Options)
- View-Toggle auf neue .map-list-toggle Klasse umgestellt
  (Border-Inline-Styles raus)

NEUE CSS-KLASSE in components.css:
- .map-list-toggle (vereinheitlichter Karten/Listen-Umschalter)
- Verwendet von routes.js; walks/events können später folgen

Tests 19/19 grün. GPS-Tracking-Logik (Polylines, Recording, Trim)
komplett unangetastet. Marker-Cluster-Logik unverändert.

backend/static/js/pages/poison.js

@@ -94,8 +94,7 @@ window.Page_poison = (() => {
     document.getElementById('poison-btn-erstehilfe')
       ?.addEventListener('click', () => App.navigate('erste-hilfe', true, { tab: 'lebensgefahr' }));
 
-    await UI.loadLeaflet();
-    _initMap();
+    await _initMap();
     // Leaflet muss nach CSS-Load die Container-Größe neu berechnen
     setTimeout(() => _map?.invalidateSize(), 100);
     await _locateAndLoad();
@@ -104,17 +103,16 @@ window.Page_poison = (() => {
   // ----------------------------------------------------------
   // KARTE INITIALISIEREN
   // ----------------------------------------------------------
-  function _initMap() {
+  async function _initMap() {
     const mapEl = document.getElementById('poison-map');
-    if (!mapEl || !window.L || _map) return;
-
-    _map = L.map('poison-map', { zoomControl: true, attributionControl: false })
-            .setView([51.1657, 10.4515], 6); // Deutschland-Mitte
-
-    L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
-      maxZoom: 19,
-    }).addTo(_map);
+    if (!mapEl || _map) return;
 
+    _map = await UI.map.create('poison-map', {
+      center: [51.1657, 10.4515], // Deutschland-Mitte
+      zoom: 6,
+      zoomControl: true,
+      attributionControl: false,
+    });
   }
 
   // ----------------------------------------------------------