/* EarthWatch map-marker design system v1.
   Loads last, so it wins the cascade outright (same additive-override
   strategy used for every shell stage so far) -- but for markers specifically
   the approach is cleaner than usual: the new markup (js/inline-2018.js)
   uses NEW class names (.ewMapMark*) that the seven legacy quake-styling
   files (ew762-standalone-symbols.css, ew7611/21/22/31/32, ew763-symbols-
   gdacs-filter.css) never reference, so there is no cascade fight to win --
   those old rules simply no longer match anything and go inert on their own.
   The outer .ew761-quake class is KEPT: inline-2018.js's markerSelector
   (~line 1048) uses it to find and highlight the selected marker on click.

   Quake uses a ring-count + colour tier system rather than a flat icon
   glyph (revised after review): ring count and colour escalate together,
   so severity is still readable colourblind or at small marker size.
   Colours reuse the app's existing feed-severity palette (medium/high/
   critical) plus the sidebar's own QUAKES identity colour for the
   "moderate" tier, so a quake's severity reads the same way on the map
   as it does in the feed panel. */

.ewMapMark{cursor:pointer;}
.ewMapMarkSvg,.ewMapMarkRingsSvg,.ewMapMarkBadgeSvg{width:100%;height:100%;display:block;overflow:visible;}

/* Quake ring/colour tiers */
.ewMapMarkRing{fill:none;stroke:currentColor;stroke-width:1.8;opacity:.92;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 1px #06111d) drop-shadow(0 0 3px currentColor);}
.ewMapMarkRingCore{fill:currentColor;stroke:#06111d;stroke-width:1.2;}
.ew761-quake.ewq-minor{color:#E8C93D;}
.ew761-quake.ewq-moderate{color:#E8A33D;}
.ew761-quake.ewq-strong{color:#E8703D;}
.ew761-quake.ewq-major{color:#E0435F;filter:drop-shadow(0 0 6px rgba(224,67,95,.85));}
.ew761-quake.ew-selected-hazard{filter:drop-shadow(0 0 9px #fff);}

/* Badge + glyph pattern (hazards with no natural numeric tier count, unlike
   quake's rings): solid circular badge in the hazard's sidebar colour, same
   glyph as that hazard's sidebar button, white with a dark outline halo so
   it stays legible against any badge hue. */
.ewMapMarkBadge{stroke:#06111d;stroke-width:1.5;}
.ewMapMarkHalo{stroke:#06111d;stroke-width:3.6;fill:none;}
.ewMapMarkGlyph{stroke:#fff;stroke-width:2;fill:none;}

/* Volcano: matches the sidebar VOLCANO button colour (--hz-volcano, #E0435F).
   Tiered by source authority + recency (no numeric scale exists for
   volcanoes) via size (set inline per marker) and glow here. */
.ewMapMarkBadgeVolcano{fill:#E0435F;}
/* ew7611-direct-symbol-style.css's .ew-native-marker.ew-volcano .ew-symbol-svg
   {width/height:82%} (no !important, but 3-class specificity) would otherwise
   shrink the new SVG inside its marker div; matched specificity + !important
   here to guarantee the full-bleed 100% this design expects. */
.ew-native-marker.ew-volcano .ewMapMarkBadgeSvg{width:100%!important;height:100%!important;margin:0!important;}
/* ewV7121.css sets .ew-native-marker.ew-volcano{width/height:18px!important}
   -- a stylesheet !important beats an inline style regardless of load order,
   so the tier sizes below need to be CSS too (not just the inline style set
   in inline-2018.js), at higher specificity (three classes vs. that rule's
   two) so they win outright rather than depending on source order. */
.ew-native-marker.ew-volcano.ewv-old{width:20px!important;height:20px!important;opacity:.75;}
.ew-native-marker.ew-volcano.ewv-default{width:24px!important;height:24px!important;}
.ew-native-marker.ew-volcano.ewv-recent{width:28px!important;height:28px!important;filter:drop-shadow(0 0 4px rgba(224,67,95,.75));}
.ew-native-marker.ew-volcano.ewv-gvp{width:32px!important;height:32px!important;filter:drop-shadow(0 0 7px rgba(224,67,95,.95));}
.ew-native-marker.ew-volcano.ew-selected-hazard{filter:drop-shadow(0 0 9px #fff)!important;}

/* Flood / generic-event EONET markers (js/inline-804.js's drawGlobalEvents,
   legacy DOM-overlay system, rebuilt every render() cycle -- not a MapLibre
   marker or canvas draw). Reuses the badge+glyph pattern; the new
   .evmarkNew marker class scopes this reset to ONLY this call site so the
   untouched wildfire/volcano/tsunami/ice/gdacs .evmark variants elsewhere
   in inline-2.css are unaffected. Colours match the sidebar FLOODS (#3D9BE8)
   and EVENTS (#7C93B0) identity colours. */
.evmark.evmarkNew{width:24px;height:24px;background:none;border:none;box-shadow:none;}
.evmark.evmarkNew .ewMapMarkBadge-flood{fill:#3D9BE8;}
.evmark.evmarkNew .ewMapMarkBadge-events{fill:#7C93B0;}

/* Native storm-motion badge and rotation markers (js/inline-2018.js,
   real maplibregl.Marker DOM elements -- see that file's comment for why
   these replaced the canvas-drawn versions). Badge fill/glow colour is
   set inline per-marker (ewWeatherColour has far too many distinct values
   to enumerate as CSS classes), so only layout lives here. */
.ew-native-marker.ew-storm,.ew-native-marker.ew-rotation{cursor:pointer;}
.ewMapMarkLabel{position:absolute;left:100%;top:50%;transform:translateY(-50%);margin-left:5px;font:800 9px Arial,Helvetica,sans-serif;white-space:nowrap;pointer-events:none;text-shadow:0 0 4px #06111d,0 0 4px #06111d;}