fix: Earthquake animation classList error - wait for DOM element

The error 'Cannot read properties of undefined (reading classList)' was
caused by trying to access circle._path before the marker was added to
the map and rendered in the DOM.

Fix:
- Add marker to map FIRST (circle.addTo(map))
- THEN wait 10ms for DOM element to be created
- Only then access circle._path.classList
- Added try/catch with console.warn for safety
- Remove duplicate circle.addTo(map) call

This ensures the SVG path element exists before we try to animate it.

src/plugins/layers/useEarthquakes.js

@@ -108,9 +108,15 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null }) {
         className: 'earthquake-marker'
       });
 
+      // Add to map first
+      circle.addTo(map);
+
       // Add pulsing animation for new earthquakes ONLY
       if (isNew) {
-        // Add animation class temporarily
+        // Wait for DOM element to be created, then add animation class
+        setTimeout(() => {
+          try {
+            if (circle._path) {
               circle._path.classList.add('earthquake-pulse-new');
               
               // Remove animation class after it completes (0.6s)
@@ -121,6 +127,11 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null }) {
                   }
                 } catch (e) {}
               }, 600);
+            }
+          } catch (e) {
+            console.warn('Could not animate earthquake marker:', e);
+          }
+        }, 10);
         
         // Create pulsing ring effect
         const pulseRing = L.circle([lat, lon], {
@@ -170,7 +181,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null }) {
         </div>
       `);
 
-      circle.addTo(map);
+      // Already added to map above (before animation)
       newMarkers.push(circle);
     });