Fix overlay z-ordering so risk dots render above alert clusters

MarkerClusterGroup ignores pane options on child markers. Instead,
create overlayPane at z-index 650 (above default markerPane at 600)
so VIEWS risk dots and other overlays are always clickable.

Author: novatechflow

src/components/GlobeView.tsx

@@ -530,11 +530,10 @@ export function GlobeView({
       { maxZoom: 18, subdomains: "abcd", noWrap: true },
     ).addTo(map);
 
-    // Custom panes: alerts underneath, overlays on top (clickable risk dots)
-    const alertPane = map.createPane("alertPane");
-    alertPane.style.zIndex = "450";
+    // Custom panes: overlays on top so risk dots are clickable above alert clusters.
+    // Leaflet default markerPane is z-index 600; we push overlays above it.
     const overlayPane = map.createPane("overlayPane");
-    overlayPane.style.zIndex = "500";
+    overlayPane.style.zIndex = "650";
 
     L.control.zoom({ position: "bottomright" }).addTo(map);
 
@@ -612,7 +611,7 @@ export function GlobeView({
       const selected = alert.alert_id === selectedId;
       const text = textHex();
       const marker = L.circleMarker([alert.lat, alert.lng], {
-        pane: "alertPane",
+
         radius: selected ? (isNowAndHistoryMode ? 9 : 10) : (isNowAndHistoryMode ? 5 : 6),
         fillColor: severityHex(alert.severity),
         color: selected ? `${text}${isNowAndHistoryMode ? "AA" : "CC"}` : `${text}${isNowAndHistoryMode ? "4D" : "66"}`,
@@ -638,7 +637,7 @@ export function GlobeView({
       const selected = alert.alert_id === selectedId;
       const text = textHex();
       const marker = L.circleMarker([alert.lat, alert.lng], {
-        pane: "alertPane",
+
         radius: selected ? 11 : 7,
         fillColor: severityHex(alert.severity),
         color: selected ? text : `${text}59`,