feat: make frontend fully responsive with mobile-first layout

Add mobile-responsive design with full feature parity:
- Bottom sheet (vaul) with 3 snap points for map+list coexistence
- Swipeable property cards with horizontal scroll-snap
- Hamburger menu with health, tasks, user info
- Full-screen map with repositioned legend (top-left on mobile)
- Filter FAB opening Sheet drawer
- TaskProgressDrawer from bottom on mobile
- All changes gated behind useIsMobile() hook (768px breakpoint)
- Desktop layout completely untouched

New components: MobileBottomSheet, SwipeableCardRow,
PropertyCardCompact, MobileMenu

Also fixes: idempotent longitude migration, React hooks order

frontend/src/assets/Map.css

@@ -69,12 +69,23 @@
 /* Mobile adjustments */
 @media (max-width: 768px) {
     #legend {
-        width: 75px;
-        padding: 8px;
-        min-height: 250px;
+        width: 70px;
+        padding: 6px;
+        min-height: 200px;
+        top: 10px;
+        right: auto;
+        left: 10px;
+        font-size: 10px;
     }
 
     .mapboxgl-popup-content {
         max-width: 90vw !important;
     }
+
+    .mapboxgl-popup-close-button {
+        font-size: 24px;
+        padding: 6px 10px;
+        min-width: 44px;
+        min-height: 44px;
+    }
 }