/* mobile result readability polish 2026-09-22: keep the rich result, make the mobile reading path calmer and clearer. */
@media(max-width:600px){
  body.result-mode .wrap{
    max-width:none;
    padding:12px 8px 72px;
  }
  body.result-mode .resultShell{
    margin:12px auto 56px;
  }
  body.result-mode #result .resultHero,
  body.result-mode #result .resultPanel{
    margin:12px 0;
    padding:20px 12px;
    border-radius:18px;
    box-shadow:none;
  }
  body.result-mode #result .resultHero{
    padding:22px 12px 20px;
  }
  body.result-mode .resultHero .eyebrow,
  body.result-mode .sectionEyebrow{
    font-size:12px;
    line-height:1.45;
    letter-spacing:.055em;
  }
  body.result-mode .resultHero h1{
    margin:6px 0 12px;
    font-size:32px;
    line-height:1.24;
    letter-spacing:-.025em;
  }
  body.result-mode .resultPanel>h2,
  body.result-mode .typeSummaryTitle{
    margin:8px 0 10px;
    font-size:21px!important;
    line-height:1.45;
    letter-spacing:-.015em;
  }
  body.result-mode .coreInsight{
    margin:11px 0 17px;
    font-size:16px;
    line-height:1.78;
  }
  body.result-mode .resultSectionLead,
  body.result-mode .currentSummary{
    margin-top:5px;
    font-size:14px;
    line-height:1.78;
  }
  body.result-mode .priorityWrap{
    gap:6px;
    margin:10px 0 17px;
  }
  body.result-mode .priorityChip{
    padding:6px 9px;
    font-size:12px;
  }

  /* TOP3 summary: one idea per row, less card-within-card noise. */
  body.result-mode .top3SummaryPanel{
    background:#fff;
  }
  body.result-mode .top3Snapshot{
    gap:7px;
    margin:12px 0 16px;
  }
  body.result-mode .top3SnapshotItem{
    padding:11px 12px;
    border-radius:13px;
    box-shadow:none;
  }
  body.result-mode .top3SnapshotItem strong{
    font-size:17px;
    line-height:1.35;
  }
  body.result-mode .top3SnapshotItem p{
    font-size:13px;
    line-height:1.55;
  }
  body.result-mode .candidateUniverse,
  body.result-mode .top3SimilarityNote,
  body.result-mode .scoreTrustNote,
  body.result-mode .rankingBridge,
  body.result-mode .liveToFinalBridge{
    border-radius:12px;
    box-shadow:none;
  }

  /* Personal profile: retain information, flatten the visual nesting. */
  body.result-mode .typeResultBody{
    margin-top:12px;
  }
  body.result-mode .balanceProfile{
    margin-top:15px;
    padding:16px 10px 14px;
    border-radius:16px;
    box-shadow:none;
  }
  body.result-mode .balanceProfileHead{
    margin-bottom:14px;
  }
  body.result-mode .balanceProfileHead h3{
    font-size:18px;
    line-height:1.45;
  }
  body.result-mode .balanceRows{
    gap:15px;
  }
  body.result-mode .balanceMeta{
    gap:10px;
    margin-bottom:6px;
  }
  body.result-mode .balanceMeta strong{
    font-size:14px;
    line-height:1.45;
  }
  body.result-mode .balanceScore{
    font-size:14px;
  }
  body.result-mode .balanceScore b{
    font-size:18px;
  }
  body.result-mode .ahaCard{
    margin:16px 0 18px;
    padding:15px 14px;
    border-radius:15px;
  }
  body.result-mode .ahaCard p{
    font-size:15px;
    line-height:1.78;
  }
  body.result-mode .discoveryGrid{
    grid-template-columns:1fr;
    gap:8px;
  }
  body.result-mode .discoveryCard{
    padding:14px 14px;
    border-radius:13px;
    box-shadow:none;
  }
  body.result-mode .discoveryCard p{
    line-height:1.72;
  }

  /* Readability floor for secondary result information. */
  body.result-mode .balanceHint,
  body.result-mode .discoveryCard span,
  body.result-mode .resultReadingCard small,
  body.result-mode .top3CompareScore span,
  body.result-mode .top3CompareLine small,
  body.result-mode .localSourceDisclosure>summary,
  body.result-mode .localSourceLinks a,
  body.result-mode .localSourceAttribution,
  body.result-mode .diagnosisMethodStep p,
  body.result-mode .diagnosisMethodNote{
    font-size:12px;
    line-height:1.6;
  }
  body.result-mode .resultReadingCard span,
  body.result-mode .top3CompareLine p{
    font-size:13px;
    line-height:1.65;
  }
  body.result-mode .resultReadingCard b,
  body.result-mode .top3CompareOpen{
    font-size:13px;
  }
  body.result-mode .top3CompareOpen{
    min-height:46px;
  }
  body.result-mode .shareCardBrand{
    font-size:11px;
  }
  body.result-mode .shareCardWinner span,
  body.result-mode .shareCardPrivacy{
    font-size:12px;
  }
  body.result-mode .shareCardRank span{
    font-size:11px;
  }
  body.result-mode .shareCardRank strong{
    font-size:12px;
  }

  /* Current place: make the score a clear anchor, not another block of text. */
  body.result-mode .bigScore{
    margin-top:8px;
    font-size:40px;
    line-height:1;
  }
  body.result-mode .currentRankNote{
    padding:11px 12px;
    border-radius:11px;
  }
  body.result-mode .currentInlineAccordion>summary{
    min-height:48px;
    justify-content:space-between;
    padding:12px 2px 2px;
  }

  /* TOP3 detail rows: remove the five-column squeeze on 390px screens. */
  body.result-mode .top3UnifiedList{
    gap:9px;
    margin:14px 0 2px;
  }
  body.result-mode .top3CityDisclosure{
    border-radius:14px;
  }
  body.result-mode .top3CityDisclosure>summary{
    grid-template-columns:36px minmax(0,1fr) 28px;
    grid-template-rows:auto auto;
    gap:5px 9px;
    padding:14px 12px;
    min-height:74px;
  }
  body.result-mode .top3CityRank{
    grid-column:1;
    grid-row:1 / 3;
    align-self:start;
    padding-top:2px;
    font-size:13px;
  }
  body.result-mode .top3CityMain{
    grid-column:2;
    grid-row:1;
    gap:2px;
  }
  body.result-mode .top3CityName{
    font-size:18px;
    line-height:1.38;
  }
  body.result-mode .top3CityMain small{
    font-size:13px;
    line-height:1.5;
  }
  body.result-mode .top3CityScore{
    grid-column:2;
    grid-row:2;
    justify-self:start;
    font-size:13px;
    line-height:1.4;
  }
  body.result-mode .top3CityAction{
    display:none;
  }
  body.result-mode .top3CityDisclosure>summary:after{
    grid-column:3;
    grid-row:1 / 3;
    align-self:center;
    font-size:22px;
  }
  body.result-mode .top3CityBody{
    padding:7px 6px 16px;
  }
  body.result-mode .cityCharacter,
  body.result-mode .cityGap,
  body.result-mode .lifeScene,
  body.result-mode .moveDelta{
    padding:13px 13px;
    border-radius:13px;
  }
  body.result-mode .factGrid{
    grid-template-columns:1fr;
    gap:7px;
  }
  body.result-mode .miniFact{
    padding:10px 11px;
    border-radius:11px;
  }

  /* Lower sections should read as chapters rather than an endless stack of cards. */
  body.result-mode .resultReadingCard,
  body.result-mode .propertyBridge,
  body.result-mode .lifeFitSimulator,
  body.result-mode .resultEditActions,
  body.result-mode .pwaInstallCard{
    box-shadow:none;
  }
  body.result-mode .resultEditActions{
    margin:18px 0;
  }
  body.result-mode .resultEditButtons{
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
  }
  body.result-mode .resultEditButtons button{
    width:100%;
    min-height:48px;
  }

  /* Simulator: keep the data density, remove tiny text and undersized controls. */
  body.result-mode .lifeFitSimulator{
    padding:17px 13px 15px;
  }
  body.result-mode .lifeFitSimulatorHead h3{
    font-size:19px;
    line-height:1.45;
  }
  body.result-mode .lifeFitSimulatorBadge,
  body.result-mode .lifeFitWhatIfHead span{
    font-size:12px;
  }
  body.result-mode .lifeFitWhatIfChip{
    min-height:44px;
    padding:9px 11px;
    font-size:12px;
  }
  body.result-mode .lifeFitSimulatorTop20Row{
    min-height:48px;
    grid-template-columns:27px minmax(0,1fr) auto auto;
    gap:7px;
    padding:8px 2px;
  }
  body.result-mode .lifeFitSimulatorTop20City{
    font-size:14px;
  }
  body.result-mode .lifeFitSimulatorTop20Score{
    font-size:13px;
  }
  body.result-mode .lifeFitSimulatorTop20Move{
    font-size:11px;
  }
  body.result-mode .lifeFitSimulatorTop20Reason{
    margin-top:0;
    padding:2px 0 4px;
    font-size:12px;
    line-height:1.55;
  }
  body.result-mode .lifeFitSimulatorControl{
    padding:14px 2px 12px;
  }
  body.result-mode .lifeFitSimulatorControl input[type="range"]{
    min-height:36px;
  }
  body.result-mode .lifeFitSimulatorReset{
    min-height:44px;
    padding:9px 13px;
    font-size:13px;
  }
  body.result-mode .lifeFitSimulatorNote{
    font-size:13px;
    line-height:1.65;
  }

  /* Map: controls and notes remain comfortably readable on touch screens. */
  body.result-mode .lifeFitMapV1Body{
    padding:20px 0 8px;
  }
  body.result-mode .lifeFitMapV1Lead{
    margin-bottom:14px;
    font-size:14px;
    line-height:1.75;
  }
  body.result-mode .lifeFitMapV1Tools button{
    min-height:44px;
    padding:9px 12px;
    font-size:13px;
  }
  body.result-mode .lifeFitMapV1Canvas,
  body.result-mode .lifeFitMapV1Status{
    min-height:360px;
  }
  body.result-mode .lifeFitMapV1Selection{
    padding:14px 0;
  }
  body.result-mode .lifeFitMapV1MeaningSummary,
  body.result-mode .lifeFitMapV1Legend span,
  body.result-mode .lifeFitMapV1Meta{
    font-size:12px;
    line-height:1.65;
  }

  /* Dense daily-life metrics keep a two-column scan, but not tiny labels. */
  body.result-mode .dailyLifeSnapshotHead small,
  body.result-mode .dailyLifeSnapshotItem small,
  body.result-mode .dailyLifeSnapshotItem span,
  body.result-mode .dailyLifeSnapshotNote{
    font-size:12px;
    line-height:1.6;
  }

  /* Touch-target floor for result actions. */
  body.result-mode .feedbackButtons button,
  body.result-mode .restartBtn,
  body.result-mode .shareExampleCopy{
    min-height:44px;
  }
  body.result-mode .shareExampleCopy{
    min-width:44px;
    padding:8px 10px;
  }
  body.result-mode .restartLink{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:8px 10px;
  }

  /* Utility actions: no forced one-line headings or small close targets. */
  body.result-mode .feedbackPanel h2,
  body.result-mode .sharePanel h2{
    white-space:normal;
  }
  body.result-mode .pwaInstallButton{
    min-height:48px;
  }
  body.result-mode .pwaInstallDismiss{
    width:44px;
    height:44px;
    right:2px;
    top:1px;
  }
  body.result-mode .pwaInstallCopy{
    padding-right:34px;
  }
}

@media(max-width:360px){
  body.result-mode .wrap{
    padding-left:6px;
    padding-right:6px;
  }
  body.result-mode #result .resultHero,
  body.result-mode #result .resultPanel{
    padding-left:10px;
    padding-right:10px;
  }
  body.result-mode .top3CityDisclosure>summary{
    grid-template-columns:32px minmax(0,1fr) 26px;
    gap:5px 7px;
    padding-left:10px;
    padding-right:10px;
  }
  body.result-mode .top3CityName{
    font-size:17px;
  }
  body.result-mode .lifeFitSimulator{
    padding-left:11px;
    padding-right:11px;
  }
}
