fix: remove MapboxDraw during rectangle tap to fix mobile touch events

MapboxDraw's simple_select mode intercepts click/tap events, preventing
the two-tap rectangle from working on mobile. Now temporarily removes
Draw control during the tap phase, re-adds it after the rectangle is
built. Also adds a visual marker on first tap for feedback.

Generated with [Claude Code](https://claude.ai/code)
via [Happy](https://happy.engineering)

Co-Authored-By: Claude <noreply@anthropic.com>
Co-Authored-By: Happy <yesreply@happy.engineering>

frontend/js/map.js

@@ -165,10 +165,20 @@ function getAllCoords(geometry) {
  * First tap sets one corner, second tap sets the opposite corner.
  * Works on both touch (mobile) and click (desktop).
  */
+let _firstCornerMarker = null;
+
 export function activateDrawRect() {
   if (!_aoiMap) return;
-  if (_draw) _draw.deleteAll();
+  // Temporarily remove Draw so it doesn't intercept taps
+  if (_draw) {
+    _draw.deleteAll();
+    _aoiMap.removeControl(_draw);
+  }
   _rectFirstCorner = null;
+  if (_firstCornerMarker) {
+    _firstCornerMarker.remove();
+    _firstCornerMarker = null;
+  }
   _aoiMap.getCanvas().style.cursor = 'crosshair';
   // Remove previous listener if any, then add fresh
   _aoiMap.off('click', _onRectClick);
@@ -179,8 +189,13 @@ function _onRectClick(e) {
   const { lng, lat } = e.lngLat;
 
   if (!_rectFirstCorner) {
-    // First tap — store corner
+    // First tap — store corner and show marker
     _rectFirstCorner = [lng, lat];
+    const el = document.createElement('div');
+    el.style.cssText = 'width:12px;height:12px;border-radius:50%;background:#1A3A34;border:2px solid white;';
+    _firstCornerMarker = new maplibregl.Marker({ element: el })
+      .setLngLat([lng, lat])
+      .addTo(_aoiMap);
     return;
   }
 
@@ -192,6 +207,12 @@ function _onRectClick(e) {
   _aoiMap.getCanvas().style.cursor = '';
   _aoiMap.off('click', _onRectClick);
 
+  // Remove corner marker
+  if (_firstCornerMarker) {
+    _firstCornerMarker.remove();
+    _firstCornerMarker = null;
+  }
+
   const minLon = Math.min(lon1, lon2);
   const maxLon = Math.max(lon1, lon2);
   const minLat = Math.min(lat1, lat2);
@@ -213,7 +234,8 @@ function _onRectClick(e) {
   };
 
   if (_draw) {
-    _draw.deleteAll();
+    // Re-add Draw control, insert the rectangle, and trigger update
+    _aoiMap.addControl(_draw);
     _draw.add(feature);
     _onDrawUpdate();
   }