/* RadarČeska · Mobile Viewport Guard v1.1
   Stable iOS geometry without touching MapLibre during finger gestures. */
@media (max-width:700px){
  html,body{
    width:100%!important;height:100%!important;min-height:0!important;
    overflow:hidden!important;overscroll-behavior:none!important;background:#f6faf9!important;
  }
  #app.app-shell{
    /* Keep the original relative MapLibre containing block. v1.0 used fixed+contain,
       which could interfere with Safari/MapLibre touch interaction. */
    position:relative!important;inset:auto!important;width:100vw!important;
    height:var(--rc-mobile-vh,100dvh)!important;
    min-height:var(--rc-mobile-vh,100dvh)!important;
    max-height:var(--rc-mobile-vh,100dvh)!important;
    margin:0!important;overflow:hidden!important;background:#f6faf9!important;
    contain:none!important;
  }
  #app.app-shell > #map.map,#app.app-shell > .map{
    position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
    min-height:0!important;max-height:none!important;touch-action:none;
  }
  #app.app-shell .mobile-nav,
  #app.app-shell .mobile-weather-nav,
  #app.app-shell .mobile-traffic-nav,
  #app.app-shell .mobile-train-nav{
    position:absolute!important;left:0!important;right:0!important;bottom:0!important;
    width:100%!important;max-width:none!important;margin-left:0!important;margin-right:0!important;
  }
  #app.app-shell.shared-timeline-active .timeline-shell.timeline-pro{
    position:absolute!important;left:8px!important;right:8px!important;
    bottom:calc(62px + env(safe-area-inset-bottom))!important;width:auto!important;max-width:none!important;margin:0!important;
  }
  /* New GPU clouds provide the meteorological veil themselves. Generic vignette must stay neutral. */
  #app.app-shell.cloud-engine-prod-active .map-vignette{
    background:linear-gradient(180deg,rgba(248,251,251,.05) 0%,rgba(248,251,251,0) 24%,rgba(248,251,251,0) 82%,rgba(248,251,251,.025) 100%)!important;
  }
  #app.app-shell.cloud-engine-prod-active .cloud-engine-prod-controls{max-width:calc(100vw - 16px)!important}
}
@supports not (height:100dvh){
  @media (max-width:700px){
    #app.app-shell{height:var(--rc-mobile-vh,100vh)!important;min-height:var(--rc-mobile-vh,100vh)!important;max-height:var(--rc-mobile-vh,100vh)!important}
  }
}
