/* Remove costly glass effects only while the map is actively moving. */
html body .app-shell .map-stage.map-focus .map-navigation-gadget,
html body .app-shell .map-stage.map-focus .map-depth-switch {
  contain: layout paint style !important;
  transform: translateZ(0) !important;
}

html body .app-shell .map-stage.map-focus.map-interacting .map-navigation-gadget,
html body .app-shell .map-stage.map-focus.map-zooming .map-navigation-gadget,
html body .app-shell .map-stage.map-focus.map-interacting .map-depth-switch,
html body .app-shell .map-stage.map-focus.map-zooming .map-depth-switch,
html body .app-shell .map-stage.map-focus.map-interacting .map-empty-state,
html body .app-shell .map-stage.map-focus.map-zooming .map-empty-state {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: inset 0 0 0 1px rgba(213, 248, 240, 0.22) !important;
  transition: none !important;
}

html body .app-shell .map-stage.map-focus.map-interacting .map-navigation-gadget,
html body .app-shell .map-stage.map-focus.map-zooming .map-navigation-gadget,
html body .app-shell .map-stage.map-focus.map-interacting .map-depth-switch,
html body .app-shell .map-stage.map-focus.map-zooming .map-depth-switch {
  background-color: rgba(5, 46, 59, 0.94) !important;
}

@media (prefers-reduced-motion: reduce) {
  html body .app-shell .map-stage.map-focus .map-navigation-gadget,
  html body .app-shell .map-stage.map-focus .map-depth-switch,
  html body .app-shell .map-stage.map-focus .map-empty-state {
    transition: none !important;
  }
}
