/* Each screen exposes only the next meaningful task; no sticky navigation. */
main.shell { max-width: 820px; }
.intro-screen { display: block; min-height: auto; padding: 48px 0 40px; }
.intro-copy { max-width: 610px; margin-inline: auto; }
.intro-copy h1 { font-size: clamp(2rem, 5vw, 3.2rem); line-height: 1.3; }
.intro-lead { font-size: 1.125rem; }
.intro-copy .notice-card { margin-block: 24px; }
.intro-copy .notice-card strong { font-size: 1rem; }
.intro-copy .notice-card p { font-size: .875rem; }
.intro-copy .primary-button { width: 100%; }
.intro-caption { font-size: .875rem; text-align: center; }
.experience-screen { padding-top: 24px; }
.experience-heading { margin-bottom: 16px; }
.experience-heading h1 { font-size: clamp(1.5rem, 4vw, 2rem); line-height: 1.4; }
.experience-heading .eyebrow { font-size: .875rem; }
.trust-strip { padding: 10px 14px; margin-bottom: 18px; font-size: .875rem; }
.trust-strip strong { font-size: .875rem; }
.mission-header { display: none; }
.mission-card { padding: 20px; }
.stepper { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 0; }
.mission-meta { margin-bottom: 12px; }
.mission-body { padding: 0; margin-top: 20px; }
.mission-body h3 { font-size: clamp(1.3rem, 3vw, 1.65rem); }
#missionHint { display: none; }
.choice-grid { grid-template-columns: 1fr; gap: 12px; }
.choice { grid-template-columns: 72px minmax(0, 1fr) 22px; min-height: 94px; padding: 14px; }
.choice-copy strong { font-size: 1.125rem; }
.choice-copy small { font-size: .875rem; }
.choice-visual { width: 72px; height: 72px; flex: 0 0 72px; }
.choice-visual img { width: 100%; height: 100%; object-fit: cover; }
.mission-actions { padding: 18px 0; margin: 0; }
.mission-actions > div { flex: 1; }
#missionReset { display: none; }
#missionNext { min-height: 52px; margin-left: auto; min-width: 160px; }
#missionStatus { font-size: .875rem; }
#matchSection { margin-top: 0; }
#confirmHeading .lock-chip { display: none; }
#confirmHeading h2 { font-size: 1.3rem; }
#confirmHeading p { font-size: 1rem; }
#quoteCard .quote-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 12px; font-size: .875rem; }
#quoteCard .quote-product-copy > small { display: block; margin-top: 6px; font-size: .875rem; color: #3a6b5c; }
#quoteCard .quote-media { width: 92px; height: 92px; flex: 0 0 92px; }
#quoteCard .quote-media > span { display: none; }
#quoteCard .quote-product h3 { font-size: 1.3rem; }
#quoteCard .quote-product p { font-size: 1rem; }
#quoteCard .quote-numbers { display: grid; grid-template-columns: 1fr; gap: 12px; margin-top: 20px; }
#quoteCard .quote-numbers > div { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 12px 14px; }
#quoteCard .quote-numbers > div:nth-child(1), #quoteCard .quote-numbers > div:nth-child(3) { display: none; }
#quoteCard .quote-numbers > div > span { font-size: 1rem; }
#quoteCard .quote-numbers > div > strong { font-size: 1.3rem; white-space: nowrap; }
#quoteCard .quote-numbers .quote-result { grid-column: auto; }
.cost-details { margin-top: 18px; border-top: 1px solid #dce6e2; }
.cost-details summary { padding: 14px 0; color: #275b49; font-size: 1rem; font-weight: 750; cursor: pointer; }
.cost-details dl { margin: 0 0 12px; }
.cost-details dl > div { display: flex; justify-content: space-between; gap: 16px; padding: 8px 0; font-size: 1rem; }
.cost-details dd { margin: 0; font-weight: 750; white-space: nowrap; }
.flow-actions { display: flex; align-items: center; gap: 14px; margin-top: 20px; }
.flow-actions .primary-button { flex: 1; min-width: 0; min-height: 54px; font-size: 1rem; }
.flow-actions .quiet-button { min-height: 52px; flex: 0 0 auto; font-size: 1rem; }
body[data-view="journey"] #matchSection { padding: 0; border: 0; background: transparent; box-shadow: none; }
body[data-view="journey"] #matchProgress { padding: 0; margin: 0; border: 0; background: transparent; }
body[data-view="journey"] #matchStepList, body[data-view="journey"] #matchMessage, body[data-view="journey"] .scene-disclaimer { display: none; }
body[data-view="journey"] .journey-finance { display: none; }
body[data-view="result"] #matchSection { display: flex; flex-direction: column; }
body[data-view="result"] #matchResult { order: 0; margin-top: 0; }
body[data-view="result"] #walletStrip { order: 1; margin-top: 20px; }
body[data-view="result"] #resultActions { order: 2; }
#virtualBalance, #virtualProfit { font-size: 1.4rem; }
.page-disclaimer { font-size: .875rem; line-height: 1.6; margin: 18px 0; }
body[data-view="journey"] .page-disclaimer { display: none; }
@media(max-width: 650px) {
  .intro-screen { padding-top: 28px; }
  .intro-copy h1 { font-size: 2rem; }
  .intro-copy .notice-card { padding: 16px; }
  .intro-copy .notice-icon { display: none; }
  .experience-screen { padding-top: 18px; }
  .mission-card { padding: 16px; }
  .mission-body { padding: 0; }
  .choice { grid-template-columns: 56px minmax(0, 1fr) 22px; padding: 12px; }
  .choice-visual { width: 56px; height: 56px; }
  .choice-copy em { display: none; }
  .mission-actions { padding: 14px 0; }
  #missionNext { min-width: 130px; }
  #matchSection { padding: 18px; }
  #quoteCard { padding: 16px; }
  #quoteCard .quote-numbers > div { padding: 10px; }
  #quoteCard .quote-numbers > div > span { font-size: .875rem; }
  #quoteCard .quote-numbers > div > strong { font-size: 1.15rem; }
  #quoteCard .quote-media { width: 80px; height: 80px; flex-basis: 80px; }
  .flow-actions { gap: 10px; }
  #resultActions { flex-direction: column-reverse; align-items: stretch; }
  #walletStrip { grid-template-columns: 1fr; gap: 10px; }
  #walletStrip > div { padding: 12px 14px; }
  #walletStrip > div:not(.practice-wallet) { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
  #walletStrip span { font-size: .875rem; }
  #walletStrip strong { font-size: 1.15rem; }
  .journey-heading { min-height: 130px; }
  .journey-stage { min-height: 250px; }
}

/* Explicit dimensions prevent aspect-ratio/min-height from widening the mobile stage. */
#matchProgress, .journey, #journeyStage { width: 100%; max-width: 100%; min-width: 0; }
#journeyStage { aspect-ratio: auto; height: clamp(250px, 46vw, 430px); min-height: 0; }
.journey-market-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 0 24px 14px; }
.journey-market-row .journey-hub { position: static; min-width: 0; width: 100%; transform: none !important; }
.journey-market-row .journey-hub small,
.journey-market-row .journey-hub strong,
.journey-market-row .journey-hub > span { overflow-wrap: anywhere; white-space: normal; }
.journey-market-row .journey-hub > span { display: none; max-height: none; overflow: visible; }
.journey[data-phase="compare"] .journey-market-row .journey-hub > span { display: block; max-height: none; }
.journey .journey-stage-caption { position: static; display: flex; flex-wrap: wrap; padding: 12px 24px; background: #091827; }
#journeyProduct { width: min(28%, 170px); }
.journey-controls { padding-bottom: max(20px, env(safe-area-inset-bottom, 0px)); }
@media(max-width: 650px) {
  .journey-market-row { gap: 8px; padding: 0 14px 12px; }
  .journey-market-row .journey-hub { padding: 8px 10px; }
  .journey .journey-stage-caption { padding: 10px 14px; }
  #journeyProduct { width: min(36%, 140px); }
  #journeyPlane { width: 36%; }
}