/* Safe-area and dynamic viewport support for Safari and iPad home-screen mode. */
.app-shell {
  min-height: 100dvh;
}

.sidebar {
  height: 100dvh;
  padding-top: max(26px, env(safe-area-inset-top));
  padding-right: max(18px, env(safe-area-inset-right));
  padding-bottom: max(26px, env(safe-area-inset-bottom));
  padding-left: max(18px, env(safe-area-inset-left));
}

main {
  padding-right: max(34px, env(safe-area-inset-right));
  padding-bottom: max(40px, env(safe-area-inset-bottom));
}

.topbar {
  height: calc(104px + env(safe-area-inset-top));
  padding-top: env(safe-area-inset-top);
}

body.app-locked {
  height: 100dvh;
}

@media (max-width: 820px) {
  main {
    padding-right: max(18px, env(safe-area-inset-right));
    padding-bottom: max(30px, env(safe-area-inset-bottom));
    padding-left: max(18px, env(safe-area-inset-left));
  }

  .topbar {
    height: calc(85px + env(safe-area-inset-top));
  }
}