html {
  scroll-padding-bottom: calc(150px + env(safe-area-inset-bottom));
}

@media (max-width: 600px) {
  .app-main {
    padding-bottom: calc(180px + env(safe-area-inset-bottom));
  }

  .app-footer {
    margin-bottom: calc(140px + env(safe-area-inset-bottom));
  }
}