/* Keep the WebGL map stable while zooming; mood lives in map data, not canvas filters. */
html body .app-shell .map-stage.map-focus .maplibregl-canvas-container,
html body .app-shell .map-stage.map-focus .maplibregl-canvas {
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
  transition: none !important;
  image-rendering: auto !important;
}

html body .app-shell .map-stage.map-focus.map-zooming .maplibregl-canvas-container,
html body .app-shell .map-stage.map-focus.map-zooming .maplibregl-canvas,
html body .app-shell .map-stage.map-focus.map-interacting .maplibregl-canvas-container,
html body .app-shell .map-stage.map-focus.map-interacting .maplibregl-canvas {
  opacity: 1 !important;
  filter: none !important;
  transition: none !important;
}

html body .app-shell .map-stage.map-focus.map-zooming .map-life-layer,
html body .app-shell .map-stage.map-focus.map-zooming .memory-constellation-label,
html body .app-shell .map-stage.map-focus.map-zooming .memory-chapter-trail-label,
html body .app-shell .map-stage.map-focus.map-zooming .hidden-discovery-badge,
html body .app-shell .map-stage.map-focus.map-zooming .journey-stop-label {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 80ms linear !important;
}

html body .app-shell .map-stage.map-focus.map-zooming .maplibregl-marker,
html body .app-shell .map-stage.map-focus.map-interacting .maplibregl-marker {
  transition: none !important;
}

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

@media (max-width: 720px) {
  html body .app-shell .map-stage.map-focus .maplibregl-canvas {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body .app-shell .map-stage.map-focus .maplibregl-canvas-container,
  html body .app-shell .map-stage.map-focus .maplibregl-canvas {
    transition: none !important;
  }
}