/* A focused Pass flow: the offer and its action never fall below the screen. */
#study:has(.pass-shell) {
  min-height: 100dvh;
  height: 100dvh;
}
#study:has(.pass-shell) > #study-root {
  height: 100%;
  min-height: 0;
  padding: 0;
}
#study .pass-shell {
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  padding: max(4px, env(safe-area-inset-top)) clamp(16px, 3vw, 32px) 0;
}
#study .pass-shell .purchase-header {
  position: static;
  margin: 0;
  padding: 8px 0;
}
#study .pass-content {
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
}
#study .pass-shell .pass-stage {
  width: 100%;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  scrollbar-width: thin;
  padding: clamp(12px, 3dvh, 24px) 8px 12px;
  align-content: start;
  align-content: safe center;
}
#study .pass-shell h1 {
  font-size: clamp(1.65rem, 3.6vw, 2.5rem);
  margin: 8px 0 12px;
  line-height: 1.15;
  text-wrap: balance;
}
#study .pass-shell .pass-stage > p {
  margin: 8px auto;
  line-height: 1.45;
}
#study .pass-shell .purchase-eyebrow {
  font-size: .75rem;
}
#study .pass-shell .mito-introduction {
  margin: 18px auto 4px;
}
#study .pass-shell .mito-speech {
  padding: 12px 18px;
  margin-bottom: -10px;
  font-size: 1rem;
  border-radius: 20px;
}
#study .pass-shell .paywall-mito {
  width: clamp(124px, 22dvh, 196px);
  height: clamp(124px, 22dvh, 196px);
}
#study .pass-shell .pass-anchor {
  font-size: .875rem;
}
#study .pass-shell .pass-footer {
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
  padding: 4px 0 max(8px, env(safe-area-inset-bottom));
  gap: 4px;
  background: var(--app-bg);
  border-top: 1px solid var(--app-separator);
}
#study .pass-shell .pass-footer > .button {
  min-height: 48px;
  padding: 10px 20px;
}
#study .pass-footer-meta {
  min-height: 48px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0 16px;
  width: 100%;
  font-size: .8125rem;
}
#study .pass-footer-meta > p {
  margin: 0;
  color: var(--app-secondary);
  font-size: inherit;
}
#study .pass-footer-links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}
#study .pass-footer-links > * {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0;
  font-size: inherit;
}
#study .pass-shell .pass-demo {
  padding: 16px 20px;
  margin: 16px auto 10px;
}
#study .pass-shell .pass-demo-heading .paywall-mito {
  width: 44px;
  height: 44px;
}
#study .pass-shell .pass-demo h2 {
  font-size: 1.25rem;
  margin: 8px 0;
}
#study .pass-shell .pass-demo p {
  margin: 8px 0;
  line-height: 1.45;
}
#study .pass-shell .pass-demo .option {
  min-height: 48px;
  padding: 10px 14px;
}
#study .pass-shell .pass-demo-answer {
  padding-top: 12px;
  margin-top: 12px;
}
#study .pass-shell .pass-demo-caption {
  font-size: .8125rem;
}
#study .pass-shell .pass-benefits {
  margin: 16px auto;
  font-size: .9375rem;
  line-height: 1.4;
}
#study .pass-shell .pass-benefits li {
  gap: 12px;
  margin: 12px 0;
}
#study .pass-shell .pass-benefits p {
  margin-top: 2px;
}
#study .pass-shell .benefit-check {
  width: 32px;
  height: 32px;
}
#study .pass-shell .pass-price {
  padding: 16px 20px;
}
#study .pass-shell .pass-price h2 {
  font-size: 1.15rem;
  margin: 0 0 4px;
}
#study .pass-shell .pass-price p {
  margin: 8px 0 0;
  font-size: .875rem;
  line-height: 1.4;
}
#study .pass-shell .pass-total {
  font-size: 1.8rem;
}
#study .pass-shell .purchase-status {
  font-size: .875rem;
}
@media (max-width: 480px) {
  #study .pass-shell .pass-stage {
    padding: 10px 0;
  }
  #study .pass-shell h1 {
    font-size: 1.75rem;
  }
  #study .pass-shell .pass-stage > p:not(.purchase-eyebrow) {
    font-size: .9375rem;
  }
  #study .pass-footer-meta {
    gap: 0 10px;
    font-size: .8125rem;
  }
  #study .pass-footer-links {
    gap: 8px;
  }
}
/* On short windows and enlarged text only the content scrolls; actions stay put. */
@media (max-height: 620px) {
  #study .pass-shell .pass-stage {
    align-content: start;
  }
  #study .pass-shell .mito-introduction {
    margin-top: 10px;
  }
  #study .pass-shell .paywall-mito {
    width: 116px;
    height: 116px;
  }
}