/* Explore v667: contrast-safe memories that stay crisp without adding clutter. */
html body main.app-shell section.map-stage.map-focus .mymappi-pin-only .memory-pin-svg {
  filter:
    drop-shadow(0 2.8px 3px rgba(3, 37, 47, 0.28))
    drop-shadow(0 0 0.8px rgba(3, 37, 47, 0.3)) !important;
}

/* A dark outer keyline plus a fine ivory inner keyline separates every mood
   color from roads, parks, buildings, and water. */
html body main.app-shell section.map-stage.map-focus .mymappi-pin-only .memory-pin-body {
  stroke: #073b47 !important;
  stroke-width: 2.2px !important;
  stroke-linejoin: round !important;
  vector-effect: non-scaling-stroke !important;
}

html body main.app-shell section.map-stage.map-focus .mymappi-pin-only .memory-pin-rim {
  stroke: rgba(255, 253, 246, 0.96) !important;
  stroke-width: 0.82px !important;
  stroke-linejoin: round !important;
  vector-effect: non-scaling-stroke !important;
}

/* Preserve the elegant 30x45 visual while meeting a forgiving finger target. */
html body main.app-shell section.map-stage.map-focus .maplibregl-marker.mymappi-memory-pin-icon::before {
  position: absolute !important;
  z-index: 0 !important;
  right: auto !important;
  bottom: -1px !important;
  left: 50% !important;
  display: block !important;
  width: 44px !important;
  height: 48px !important;
  content: "" !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  pointer-events: auto !important;
  transform: translateX(-50%) !important;
}

html body main.app-shell section.map-stage.map-focus .maplibregl-marker.mymappi-memory-pin-icon:focus {
  outline: none !important;
}

html body main.app-shell section.map-stage.map-focus .maplibregl-marker.mymappi-memory-pin-icon:focus-visible::after {
  position: absolute !important;
  z-index: 2 !important;
  inset: -4px -6px -3px !important;
  display: block !important;
  content: "" !important;
  border: 2px solid #f4fff9 !important;
  border-radius: 50% 50% 45% 45% !important;
  background: transparent !important;
  box-shadow: 0 0 0 2px #0a5966 !important;
  pointer-events: none !important;
}

/* Grouped memories use a calm brand surface with the dominant feeling kept as
   the small center accent, so a white count is readable for every mood. */
html body main.app-shell section.map-stage.map-focus .memory-cluster-marker,
html body main.app-shell section.map-stage.map-focus .memory-cluster-marker.constellation-cluster {
  position: relative !important;
  border: 2px solid rgba(255, 253, 246, 0.97) !important;
  background:
    linear-gradient(145deg,
      color-mix(in srgb, #075666 72%, var(--marker-color, #18a978) 28%),
      color-mix(in srgb, #063d4b 78%, var(--marker-color, #18a978) 22%)) !important;
  box-shadow: 0 5px 13px rgba(3, 38, 48, 0.24) !important;
}

html body main.app-shell section.map-stage.map-focus .memory-cluster-marker::before {
  position: absolute !important;
  inset: -5px 0 !important;
  display: block !important;
  content: "" !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  pointer-events: auto !important;
}

html body main.app-shell section.map-stage.map-focus .memory-cluster-marker:focus-visible {
  outline: 3px solid #f4fff9 !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 5px #0a5966, 0 5px 13px rgba(3, 38, 48, 0.24) !important;
}

/* Ordinary pins stay calm. Only an opened, newly saved, or nearby-awake memory
   keeps the existing gentle presence animation. */
html body main.app-shell section.map-stage.map-focus
  .mymappi-pin-only:not(.is-reliving-memory):not(.is-living-awake):not(.is-new)
  .memory-pin-presence,
html body main.app-shell section.map-stage.map-focus
  .mymappi-pin-only:not(.is-reliving-memory):not(.is-living-awake):not(.is-new)
  .memory-pin-shine {
  animation: none !important;
}

html body main.app-shell section.map-stage.map-focus
  .mymappi-pin-only:not(.is-reliving-memory):not(.is-living-awake):not(.is-new)
  .memory-pin-presence-outer {
  opacity: 0.44 !important;
}

html body main.app-shell section.map-stage.map-focus.memory-pin-selected
  .mymappi-pin-only.is-reliving-memory .memory-pin-rim {
  stroke: #fffdf5 !important;
  stroke-width: 1.24px !important;
}

html body main.app-shell section.map-stage.map-focus.memory-pin-selected
  .mymappi-pin-only.is-reliving-memory .memory-pin-svg {
  filter:
    drop-shadow(0 3px 4px rgba(3, 37, 47, 0.3))
    drop-shadow(0 0 2px rgba(255, 253, 245, 0.92)) !important;
}

html body main.app-shell section.map-stage.map-focus.map-interacting .mymappi-pin-only .memory-pin-svg,
html body main.app-shell section.map-stage.map-focus.map-zooming .mymappi-pin-only .memory-pin-svg,
html body main.app-shell section.map-stage.map-focus.map-interacting .memory-cluster-marker,
html body main.app-shell section.map-stage.map-focus.map-zooming .memory-cluster-marker {
  filter: none !important;
  box-shadow: none !important;
}

@media (prefers-reduced-motion: reduce) {
  html body main.app-shell section.map-stage.map-focus .mymappi-pin-only .memory-pin-presence,
  html body main.app-shell section.map-stage.map-focus .mymappi-pin-only .memory-pin-shine,
  html body main.app-shell section.map-stage.map-focus .memory-cluster-marker {
    animation: none !important;
    transition: none !important;
  }
}