/* Scoped viewport fixes. No navigation, data, or financial behavior changes. */
.fs-sheet > .fs-sheet-panel,
.mine-language-sheet {
  max-height: calc(100vh - 16px);
  max-height: calc(100dvh - 16px);
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.fs-sheet > .fs-sheet-panel > .fs-sheet-title {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #292929;
}

/* Mine uses the same 430px shell as the other primary routes. */
.mine.page[data-v-621ef1a8] + div > .van-tabbar[data-v-910b862e] {
  left: 50% !important;
  right: auto !important;
  width: min(100vw, 430px) !important;
  max-width: 430px !important;
  transform: translateX(-50%) !important;
}

/* Keep translated labels inside the existing 48px controls. */
html.benefits-four-options .container.page[data-v-26bfb8d0] .bottom-bar .left .text,
html.benefits-four-options .container.page[data-v-26bfb8d0] .bottom-bar .bar > .right {
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  line-height: 16px !important;
  text-overflow: clip !important;
  text-align: center !important;
}

/* A landscape phone cannot fit the header, choices and action bar at once.
   Let this page scroll instead of shrinking the choice area underneath the bar. */
@media (max-height: 500px) {
  html.benefits-four-options.heart-lottery-active #mobile-shell {
    width: 100% !important;
  }
  html.benefits-four-options.heart-lottery-active .van-tabbar {
    z-index: 3 !important;
  }
  html.benefits-four-options.heart-lottery-active .container.page[data-v-26bfb8d0] {
    position: relative !important;
    top: auto !important;
    height: auto !important;
    min-height: calc(100vh - var(--mmyh-benefits-nav-height));
    min-height: calc(100dvh - var(--mmyh-benefits-nav-height));
    padding-bottom: calc(var(--mmyh-benefits-nav-height) + env(safe-area-inset-bottom, 0px));
    overflow: visible !important;
  }

  html.benefits-four-options.heart-lottery-active .container.page[data-v-26bfb8d0] > .wrapper[data-v-26bfb8d0] {
    flex: 0 0 auto !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  html.benefits-four-options.heart-lottery-active .container.page[data-v-26bfb8d0] > .wrapper > .options-bar,
  html.benefits-four-options.heart-lottery-active .container.page[data-v-26bfb8d0] > .wrapper > .options-bar > .game {
    flex: 0 0 auto !important;
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }
}