feat(mobile): declutter mobile driving interface, make map 100% immersive, compact HUD capsule and slide-up controls drawer

js/radar.js

@@ -206,7 +206,16 @@
     adminPlacedCount: document.getElementById('admin-placed-count'),
     adminPlacedCamsList: document.getElementById('admin-placed-cams-list'),
     btnAdminClearAllPlaced: document.getElementById('btn-admin-clear-all-placed'),
-    btnAdminManagePins: document.getElementById('btn-admin-manage-pins')
+    btnAdminManagePins: document.getElementById('btn-admin-manage-pins'),
+
+    // Mobile Driving Controls & Drawer
+    driverHud: document.getElementById('driver-hud'),
+    btnToggleTools: document.getElementById('btn-toggle-tools'),
+    btnToggleHudDetails: document.getElementById('btn-toggle-hud-details'),
+    hudDetailsArrow: document.getElementById('hud-details-arrow'),
+    mapTopControls: document.getElementById('map-top-controls'),
+    btnCloseTools: document.getElementById('btn-close-tools'),
+    toolsOverlay: document.getElementById('tools-overlay')
   };
 
   // --- INITIALIZATION ---
@@ -1887,6 +1896,53 @@
       });
     }
 
+    // Mobile Driving Controls Drawer
+    function openToolsDrawer() {
+      if (el.mapTopControls) el.mapTopControls.classList.add('open-drawer');
+      if (el.toolsOverlay) el.toolsOverlay.classList.add('visible');
+    }
+
+    function closeToolsDrawer() {
+      if (el.mapTopControls) el.mapTopControls.classList.remove('open-drawer');
+      if (el.toolsOverlay) el.toolsOverlay.classList.remove('visible');
+    }
+
+    if (el.btnToggleTools) {
+      el.btnToggleTools.addEventListener('click', (e) => {
+        e.stopPropagation();
+        if (el.mapTopControls && el.mapTopControls.classList.contains('open-drawer')) {
+          closeToolsDrawer();
+        } else {
+          openToolsDrawer();
+        }
+      });
+    }
+
+    if (el.btnCloseTools) el.btnCloseTools.addEventListener('click', closeToolsDrawer);
+    if (el.toolsOverlay) el.toolsOverlay.addEventListener('click', closeToolsDrawer);
+
+    // Auto-close tools drawer on mobile when clicking any action button
+    if (el.mapTopControls) {
+      el.mapTopControls.querySelectorAll('.btn-hud-action').forEach(btn => {
+        btn.addEventListener('click', () => {
+          if (window.innerWidth <= 768) {
+            closeToolsDrawer();
+          }
+        });
+      });
+    }
+
+    // Toggle HUD Expanded Details on Mobile
+    if (el.btnToggleHudDetails) {
+      el.btnToggleHudDetails.addEventListener('click', (e) => {
+        e.stopPropagation();
+        if (el.driverHud) {
+          const isExpanded = el.driverHud.classList.toggle('is-expanded');
+          if (el.hudDetailsArrow) el.hudDetailsArrow.textContent = isExpanded ? '▲' : '🔍';
+        }
+      });
+    }
+
     // Sync radar when reports updated
     window.addEventListener('flock_reports_updated', () => {
       loadAllCameraData();