@media (display-mode: standalone) {
  html, body {
    background: #17324d;
    overscroll-behavior-y: none;
  }

  body {
    min-height: 100dvh;
  }

  .app {
    min-height: 100dvh;
  }
}

@supports (padding: max(0px)) {
  body {
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }
}

/* In standalone iOS mode, keep the navy chrome behind the status bar while
   dropping the actual app controls below the clock/signal/battery area. */
@media (display-mode: standalone) and (max-width: 760px) {
  .topbar {
    height: calc(46px + env(safe-area-inset-top)) !important;
    min-height: calc(46px + env(safe-area-inset-top)) !important;
    padding-top: env(safe-area-inset-top) !important;
    box-sizing: border-box !important;
  }
}