/* Interactive globe rendering — shared by the Explore page and the Customize
   editor (so the globe can be themed in the editor like any map). The country
   fills/borders come from the engine theme (.mmap .state); the ocean follows the
   theme's --sea so it's fully customizable. */
.globe{touch-action:none;cursor:grab}
.globe:active{cursor:grabbing}
.globe .state{cursor:pointer;transition:fill .12s ease,stroke .12s ease}
/* hover: the country lights up + glows */
.globe .state:hover{fill:var(--land-hover);stroke:var(--district-hi);stroke-width:1.4;
  filter:drop-shadow(0 0 6px var(--accent)) drop-shadow(0 0 3px var(--accent))}
/* the themed atmosphere glow ring (filter-free radial gradient → no white fringe);
   .g-glow stops follow the theme's line colour, so it's blue on blueprint, etc. */
.globe-glow{pointer-events:none}
.g-glow{stop-color:var(--stroke)}
.globe-ocean{fill:var(--sea);stroke:none}
.globe-grat{fill:none;stroke:var(--accent);stroke-width:.6;opacity:.16;
  stroke-linecap:round;pointer-events:none}
.globe-shade{pointer-events:none}
/* the limb overlay: just a soft dark vignette (gradient fill) for sphere depth — no
   stroke, so the only edge treatment is the themed glow above */
.globe-limb{pointer-events:none}
/* the sphere's highlight glow follows the theme accent (green theme → green glow) */
.g-hi{stop-color:var(--accent)}
/* keep the host's grid faint so the sphere reads */
.globe-host{--grid:rgba(120,180,255,.06)}