/* Reading rhythm shared by the mobile funnel and the six personal letters. */
@media screen {
  .sales-section { --sales-photo-gutter:26px }
  .report-paper { --report-photo-gutter:19px }
  html { -webkit-text-size-adjust:100%; text-size-adjust:100% }
  h1,h2,h3,.letter-quote,.report-takeaway { text-wrap:balance }
  .header-library { font-size:12px }
  .arrival-title>p:last-child { font-size:14px; line-height:1.9 }
  .arrival-fine,.arrival-seal { font-size:12px }
  .arrival-invitation { font-size:16px; line-height:1.9 }
  .entry-guide h2 { font-size:18px }
  .entry-guide p,.entry-message>div { font-size:15px; line-height:1.9 }
  .entry-guide li>span,.eyebrow,.sales-eyebrow { font-size:12px }
  .footer-links,.footer-links button,.footer-inner>p,.footer-brand span { font-size:12px; line-height:1.85 }
  .mobile-home-cta small,.purchase-bar small { font-size:12px; line-height:1.6 }
  .mobile-home-cta>div>span { font-size:13px }
  .mobile-home-cta>.button,.purchase-bar>.button { font-size:14px; min-height:50px }

  /* Keep form text readable without reducing the native 16px inputs. */
  .flow-kicker,.flow-step-number,.flow-field>label:not(.flow-check),.flow-field legend,
  .flow-date-part>label,.flow-time-grid label,.flow-help,.flow-optional,.flow-footnote,
  .flow-privacy,.flow-summary dt,.flow-summary small,.flow-summary button { font-size:12px }
  .flow-description { font-size:14px; line-height:1.9; max-width:100% }
  .flow-check,.flow-summary dd { font-size:14px; line-height:1.85 }
  .flow-summary>div { flex-wrap:wrap }
  .flow-summary dd { min-width:100px }
  .flow-segments span { font-size:14px }
  .loading-view>p { font-size:14px }
  .loading-steps { font-size:12px; gap:14px; flex-wrap:wrap }

  /* The free letter and purchase detail use the same comfortable body size. */
  .result-complete,.profile-line,.profile-line button,.keyword,.letter-header small,
  .free-reading-label,.free-chart>summary,.sales-small,.sales-payment-caption,
  .sales-lock-top,.sales-lock-number,.sales-lock-caption,.sales-personal-label,
  .sales-chapter-top>p,.sales-card-label,.sales-value-number,
  .sales-offer-price>span,.sales-offer-price>small { font-size:12px }
  .profile-line { flex-wrap:wrap; gap:4px 9px }
  .letter-header strong { font-size:14px }
  .result-subtitle,.preview-point p { font-size:14px; line-height:1.9 }
  .preview-point h3 { font-size:13px }
  .letter-paragraphs p { font-size:16px; line-height:1.95 }
  .sales-section>p:not(.sales-eyebrow):not(.sales-small),
  .sales-lead,.sales-chapter-card>p,.sales-questions li,
  .sales-proof-card>p:last-child,.sales-checklist li,.sales-offer-list li,
  .sales-value-grid p,.sales-practice>p:last-child,.sales-steps p,
  .sales-faq summary,.sales-faq details>p { font-size:15px; line-height:1.95 }
  .sales-lead { font-size:15px!important; line-height:1.95!important }
  .sales-steps h3 { font-size:16px }
  .sales-button { font-size:14px; align-items:center }
  .sales-button>span:last-child { font-size:15px }
  .sales-chapter-card { padding-inline:20px }
  .sales-chapter-card h3,.sales-lock-card h3 { font-size:20px; line-height:1.7 }
  .sales-questions { padding-left:0 }
  .sales-photo { margin:30px calc(-1 * var(--sales-photo-gutter)); overflow:hidden; border-radius:0; border:0; background:transparent }
  .sales-photo img { width:100%; height:auto; aspect-ratio:3/2; object-fit:cover }
  .sales-photo figcaption { padding:8px var(--sales-photo-gutter) 0; font:13px/1.9 var(--serif); color:var(--muted); background:transparent; text-align:center }
  .sales-portrait { height:auto; aspect-ratio:3/2; margin-top:0 }
  .sales-portrait img { object-position:center; filter:none }
  .sales-portrait:after { background:none }
  .sales-final-copy { font-size:16px!important; line-height:2!important }

  /* One reading column: 16px body on every phone, with room for Korean words. */
  .report-view { padding:18px 14px 45px }
  .report-paper { padding:27px 18px; border-radius:9px }
  .report-reading-meta { font-size:12px; line-height:1.8; gap:12px; align-items:flex-start }
  .report-reading-meta>span:last-child { white-space:nowrap; flex-shrink:0 }
  .report-topbar>.back-link,.report-actions .button { font-size:12px }
  .report-nav button { font-size:13px; padding:10px 13px }
  .report-letterhead { margin-bottom:29px; gap:10px }
  .report-letterhead>p { font-size:14px; line-height:1.85 }
  .report-letterhead small { font-size:12px; line-height:1.8; letter-spacing:0 }
  .report-paper .eyebrow { font-size:12px; letter-spacing:.1em; margin-bottom:12px }
  .report-paper h1 { font-size:29px; line-height:1.6; letter-spacing:-.035em }
  .report-chapter-subtitle { font-size:16px; line-height:1.9; margin-bottom:24px }
  .report-letter-intro p { font-size:16px; line-height:1.95; margin-bottom:20px }
  .report-letter-intro .report-addressee { font-size:18px }
  .report-takeaway { font-size:18px; line-height:1.9; padding-left:15px }
  .report-section-index>summary { font-size:13px; gap:8px; padding:15px 13px }
  .report-section-index>summary>span { font-size:12px; margin-left:0 }
  .report-section-index button { font-size:14px; line-height:1.85 }
  .report-section-index button>span,.report-calculation { font-size:12px }
  .report-section { margin-bottom:45px; scroll-margin-top:148px }
  .report-section-number { font-size:12px; margin-bottom:10px }
  .report-section h2 { font-size:22px; line-height:1.65; letter-spacing:-.025em; margin-bottom:20px }
  .report-section h2 .report-heading-context { display:block; font:14px/1.85 var(--sans); color:var(--muted); letter-spacing:0; margin-bottom:8px }
  .report-heading-divider { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap }
  .report-section p { font-size:16px; line-height:1.95; letter-spacing:-.005em; word-break:keep-all; overflow-wrap:anywhere }
  .report-section p+p { margin-top:22px }
  .report-basis { margin-top:22px; padding:12px 13px }
  .report-basis summary { font-size:12px; line-height:1.85 }
  .report-basis p { font-size:13px; line-height:1.9; margin-top:14px!important }
  .report-advice { padding:22px 17px }
  .report-advice h2 { font-size:20px }
  .report-advice li { font-size:15px; line-height:1.9 }
  .report-advice li:before,.report-pager small { font-size:12px }
  .report-pager button { font-size:14px; line-height:1.85 }
  .report-quote { font-size:19px; line-height:1.95; text-wrap:balance }
  .report-scene { margin:0 calc(-1 * var(--report-photo-gutter)) 28px; border:0; border-radius:0; overflow:hidden; background:transparent }
  .report-scene img { width:100%; height:auto; aspect-ratio:3/2; object-fit:cover }
  .report-scene figcaption { padding:8px 18px 0; font:13px/1.9 var(--serif); color:var(--muted); background:transparent; text-align:center }
  .sales-photo img,.sales-portrait img,.report-scene img {
    -webkit-mask-image:linear-gradient(to bottom,transparent,#000 16%,#000 73%,transparent);
    mask-image:linear-gradient(to bottom,transparent,#000 16%,#000 73%,transparent);
  }
  .chart-sub,.pillar-label,.pillar-reading,.pillar-god,.chart-policy,.chart-policy summary,
  .element-item,.element-item small,.luck-caption,.annual-tile small,.annual-tile p { font-size:12px }
  .pillar { padding-inline:2px }
  .pillar-hanja { font-size:26px }
  .element-bars { gap:7px }
  .element-item small { white-space:normal }
  .luck-table { font-size:13px }
  .luck-table th { font-size:12px }
  .luck-table th,.luck-table td { padding:12px 4px }
  .modal-body,.empty-library p { font-size:15px; line-height:1.95 }
  .modal-product p,.checkout-row,.checkout-notice,.input-note { font-size:13px }
  .modal-inner { padding:24px }
  .close-button { min-width:44px; min-height:44px }
}

@media screen and (max-width:370px) {
  .sales-section { --sales-photo-gutter:20px }
  .header-inner { gap:10px; padding-inline:16px }
  .header-library { font-size:11px }
  .arrival { min-height:735px }
  .arrival h1 { font-size:31px }
  .arrival-title { padding-top:25px }
  .arrival-title>p:last-child { font-size:14px }
  .arrival-art { top:165px; bottom:125px }
  .arrival-invitation { font-size:15px }
  .arrival-fine { font-size:11px }
  .arrival-seal { font-size:11px }
  .flow-shell { padding-inline:20px }
  .flow-question { font-size:27px }
  .flow-summary dt { min-width:49px }
  .flow-summary>div { gap:6px }
  .flow-summary button { margin-left:auto }
  .preview-letter { padding:22px 18px }
  .sales-heading { font-size:25px; line-height:1.7 }
  .sales-section { padding-inline:20px }
  .sales-chapter-card,.sales-lock-card { padding-inline:17px }
  .sales-chapter-card h3,.sales-lock-card h3 { font-size:19px }
  .sales-offer .sales-heading,.sales-final .sales-heading { font-size:25px }
  .sales-portrait { margin-inline:-20px; margin-top:0; height:auto }
  .purchase-bar,.mobile-home-cta { padding-inline:14px; gap:10px }
  .purchase-bar small,.mobile-home-cta small { font-size:11px }
  .purchase-bar>.button { font-size:13px; padding-inline:12px; gap:8px }
  .report-paper h1 { font-size:27px }
  .report-section h2 { font-size:21px }
  .report-actions .button { font-size:11px; padding-inline:3px }
  .report-letterhead { align-items:flex-start }
  .report-letterhead>p { font-size:13px }
  .report-letterhead small { font-size:12px }
  .report-section-index>summary { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:5px 10px }
  .report-section-index>summary>span { grid-column:1; grid-row:2 }
  .report-section-index>summary:after { grid-column:2; grid-row:1/3; align-self:center }
  .report-pager { gap:13px }
  .report-pager button { font-size:13px }
  .report-advice { padding-inline:14px }
  .luck-table { font-size:12px }
  .luck-table th { font-size:11px }
  .modal-inner { padding:21px }
}

@media screen and (min-width:560px) {
  .report-view { padding-inline:24px }
  .report-paper { --report-photo-gutter:29px; padding:34px 28px }
  .report-section p,.report-letter-intro p { font-size:17px; line-height:1.95 }
  .report-section h2 { font-size:24px }
}

@media screen and (min-width:780px) {
  .sales-section { --sales-photo-gutter:34px }
}

@media print { .report-scene { display:none } }