@media (max-width: 1023px), (orientation: landscape) and (max-height: 620px) {
  .rulesLayer,
  .verifierLayer,
  .walletLayer,
  .accountLayer {
    align-items: flex-end;
    justify-content: stretch;
    padding: 0;
    place-items: end stretch;
  }

  .rulesBox,
  .verifierBox,
  .walletVault,
  .accountCard {
    width: 100%;
    max-width: none;
    max-height: 78vh;
    max-height: 78dvh;
    margin: 0;
    padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px));
    overflow-y: auto;
    border-width: 1px 0 0;
    border-radius: 18px 18px 0 0;
    box-shadow: 0 -18px 48px rgba(2, 6, 10, .6);
    overscroll-behavior: contain;
  }

  .rulesBox::before,
  .verifierBox::before,
  .walletVault::before,
  .accountCard::before {
    display: block;
    width: 38px;
    height: 4px;
    margin: 0 auto 12px;
    content: "";
    border-radius: 999px;
    background: rgba(240, 230, 205, .28);
  }

  .tutorialLayer.show {
    display: flex;
    align-items: flex-end;
  }

  .tutorialBox {
    position: fixed !important;
    top: auto !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    max-width: none;
    max-height: 62vh;
    max-height: 62dvh;
    padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px));
    overflow-y: auto;
    border-width: 1px 0 0;
    border-radius: 18px 18px 0 0;
    overscroll-behavior: contain;
  }
}

@media (orientation: landscape) and (max-height: 500px) {
  .rulesBox,
  .verifierBox,
  .walletVault,
  .accountCard {
    max-height: 82vh;
    max-height: 82dvh;
    padding-top: 14px;
    padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  }

  .tutorialBox {
    max-height: 54vh;
    max-height: 54dvh;
    padding-top: 12px;
  }

  .rulesBox::before,
  .verifierBox::before,
  .walletVault::before,
  .accountCard::before { margin-bottom: 8px; }
}

@media (min-width: 1024px) and (min-height: 621px) {
  .rulesBox,
  .verifierBox,
  .walletVault,
  .accountCard {
    overflow-y: auto;
    overscroll-behavior: contain;
  }
}