/* 独立中文排版层；不修改英文版的视觉与动效。 */
:root {
  --serif: 'Noto Serif SC', 'Songti SC', SimSun, serif;
  --sans: 'DM Sans', 'PingFang SC', 'Microsoft YaHei', 'Noto Sans CJK SC', sans-serif;
  --hand: 'Ma Shan Zheng', 'Kaiti SC', KaiTi, cursive;
}
body { line-height: 1.9; }
h1, h2, h3 { line-height: 1.4; font-weight: 400; }
h2 { font-size: clamp(31px, 3.25vw, 46px); letter-spacing: .01em; }
h2 em, h1 em { font-style: normal; }
p { line-break: strict; }
.wordmark { font-size: 24px; letter-spacing: .05em; gap: 5px; white-space: nowrap; }
.wordmark > span { font-family: 'Cormorant Garamond', Georgia, serif; font-style: italic; font-size: 25px; padding-inline: 4px; }
.wordmark .icon { margin: 0 0 12px 4px; }
.site-header nav a { font-size: 12px; }
.sound-toggle { font-size: 11px; }
.eyebrow { font-size: 11px; letter-spacing: 1.8px; font-weight: 500; }
.hero .eyebrow { font-size: 11px; letter-spacing: 2px; margin-bottom: 30px; }
.hero h1 { font-size: clamp(63px, 5.8vw, 84px); line-height: 1.28; letter-spacing: .01em; }
.hero h1 em { position: relative; white-space: nowrap; }
.hero-heart { position: absolute; width: 57px; height: 57px; margin-left: 9px; bottom: 19px; }
.hero-description { font-size: 14px; line-height: 2; margin-top: 21px; }
.hero-buttons { gap: 25px; margin-top: 25px; }
.hero-buttons .button, .hero-buttons .text-button { font-size: 12px; white-space: nowrap; }
.initial-avatar { font-size: 15px; width: 37px; height: 37px; }
.hero-signature > span:last-child { font-size: 10px; line-height: 1.9; }
.hero-photo figcaption { font-size: 21px; line-height: 1.4; padding-block: 13px 17px; }
.mini-photo figcaption { font-size: 18px; line-height: 1.4; padding-block: 10px 12px; }
.hero-note { font-size: 27px; line-height: 1.4; bottom: -18px; }
.art-flower { left: 171px; bottom: 19px; }
.orbit-stamp text { font-size: 9px; letter-spacing: 1.2px; }
.photo-coordinate { font-size: 9px; letter-spacing: 2px; }
.hero-side-note { font-size: 9px; letter-spacing: 2px; }
.scroll-cue { font-size: 10px; letter-spacing: 2px; }
.ribbon-track span { font: 22px/1.6 var(--hand); letter-spacing: 2px; }
.section-heading > p { font-size: 12px; line-height: 2; flex-shrink: 0; }
.chapter-tabs { padding-inline: 25px; }
.chapter-tabs button { padding-block: 25px; gap: 18px; }
.chapter-number { font-family: 'Cormorant Garamond', Georgia, serif; }
.chapter-tabs button small { font-size: 10px; letter-spacing: 1.5px; }
.chapter-tabs button strong { font-size: 19px; line-height: 1.6; }
.chapter-copy { padding: 35px 30px; }
.chapter-copy .eyebrow { font-size: 10px; margin-bottom: 16px; }
.chapter-copy h3 { font-size: 27px; line-height: 1.4; letter-spacing: 0; }
.chapter-copy p { font-size: 13px; line-height: 2; }
.chapter-footnote { font: 18px/1.8 var(--hand); margin-top: 22px; }
.chapter-image-note { font-size: 21px; line-height: 1.5; }
.story-quote p { font-size: 25px; line-height: 1.8; }
.story-quote > span { font-size: 20px; }
.heading-note { font-size: 24px; line-height: 1.5; }
.memory-caption { font-size: 23px; line-height: 1.6; margin: 16px 6px 7px; }
.memory-meta { font-size: 9px; letter-spacing: .7px; margin-left: 6px; }
.memory-open { font-size: 10px; }
.memory-bottom { font-size: 12px; }
.reasons-intro p { font-size: 13px; line-height: 2; }
.reason-card { min-height: 255px; }
.reason-number { font-family: 'Cormorant Garamond', Georgia, serif; }
.reason-card h3 { font-size: 21px; line-height: 1.65; letter-spacing: 0; margin-top: 24px; }
.reason-card p { font-size: 12px; line-height: 2; }
.reason-jar h3 { font-size: 25px; line-height: 1.5; }
.reason-jar p { font-size: 12px; }
.letter-copy h2 { font-size: clamp(31px, 3.05vw, 44px); line-height: 1.55; }
.letter-copy p { font-size: 13px; line-height: 2; }
.letter-small-note { font-size: 10px; }
.letter-peek > span:first-child { font-size: 30px; }
.letter-peek > span:last-child { font-size: 19px; line-height: 1.4; }
.wax-seal > span { position: static; font: 18px/1.3 var(--hand); white-space: nowrap; }
.envelope-label { font-size: 23px; }
.envelope-note { font-size: 23px; white-space: nowrap; }
.universe-heading h2 { font-size: clamp(31px, 3.3vw, 46px); line-height: 1.5; }
.universe-heading p { font-size: 12px; }
.constellation-star > span { font-size: 18px; line-height: 1.5; }
.star-message p { font: 24px/1.8 var(--hand); }
.star-message > span { font-size: 10px; letter-spacing: 1.5px; }
.finale-initials { font-size: 24px; }
.finale-content h2 { font-size: clamp(31px, 3.55vw, 49px); line-height: 1.5; }
.finale-content p { font-size: 13px; line-height: 2.2; }
.finale-note { font-size: 21px; }
.site-footer .wordmark { font-size: 22px; }
.site-footer > p { font-size: 11px; }
.site-footer > p span { font-size: 10px; }
.footer-controls, .footer-controls button { font-size: 10px; }
.letter-paper { padding: 58px 54px 42px; background-image: none; }
.letter-paper .eyebrow { font-size: 10px; letter-spacing: 1.2px; }
.letter-paper h2 { font-size: 35px; margin-bottom: 23px; }
.letter-paragraphs p { font: 22px/1.9 var(--hand); margin-bottom: 18px; }
.letter-closing span { font-size: 25px; display: inline-block; padding-right: 36px; }
.letter-paper-heart { right: 33px; bottom: 105px; width: 29px; height: 29px; }
.letter-paper .text-button { font-size: 12px; }
.memory-dialog-copy .eyebrow { font-size: 10px; }
.memory-dialog-copy h2 { font-size: 34px; letter-spacing: 0; line-height: 1.5; }
.memory-dialog-copy p { font-size: 13px; line-height: 2; }
.note-dialog .eyebrow { font-size: 10px; }
.note-dialog h2 { font-size: 25px; line-height: 1.5; letter-spacing: 0; }
.note-dialog > p { font: 28px/1.7 var(--hand); min-height: 120px; }
.note-signature { font-size: 21px; }
.note-dialog .button { font-size: 12px; }
.confession-dialog { padding-inline: 40px; }
.confession-dialog .eyebrow { font-size: 10px; }
.confession-dialog h2 { font-size: 34px; letter-spacing: 0; line-height: 1.6; }
.confession-dialog > p { font-size: 13px; line-height: 2; }
.confession-actions .text-button { font-size: 12px; }
.toast { font-size: 12px; }
@media (max-width: 1150px) {
  .hero h1 { font-size: 68px; }
  .hero-heart { width: 42px; height: 42px; bottom: 19px; }
  .hero-buttons { gap: 17px; }
  .hero-buttons .button, .hero-buttons .text-button { font-size: 11px; }
  .hero-photo figcaption { font-size: 18px; }
  .mini-photo figcaption { font-size: 16px; }
  .hero-note { font-size: 25px; }
  .art-flower { left: 142px; bottom: 10px; }
  .section-heading { gap: 30px; }
  .section-heading > p { font-size: 11px; }
  .chapter-tabs { padding-inline: 20px; }
  .chapter-tabs button { gap: 12px; }
  .chapter-tabs button strong { font-size: 17px; }
  .chapter-copy { padding-inline: 24px; }
  .chapter-copy h3 { font-size: 24px; }
  .chapter-copy p { font-size: 12px; }
  .memory-caption { font-size: 20px; }
  .memory-meta { font-size: 8px; }
  .reason-card h3 { font-size: 20px; }
  .envelope-label { font-size: 20px; }
  .envelope-note { font-size: 21px; }
}
@media (max-width: 900px) {
  .wordmark { font-size: 20px; }
  .site-header nav a { font-size: 11px; }
  .hero h1 { font-size: 56px; }
  .hero .eyebrow { font-size: 10px; letter-spacing: 1.5px; }
  .hero-heart { width: 35px; height: 35px; bottom: 16px; margin-left: 6px; }
  .hero-description { font-size: 13px; }
  .hero-signature > span:last-child { font-size: 9px; }
  .initial-avatar { width: 34px; height: 34px; flex-shrink: 0; }
  .hero-photo figcaption { font-size: 16px; }
  .mini-photo figcaption { font-size: 14px; }
  .hero-note { font-size: 24px; }
  .art-flower { left: 138px; bottom: 6px; }
  h2 { font-size: 34px; }
  .section-heading { align-items: flex-start; gap: 20px; }
  .section-heading > p { font-size: 10px; flex-shrink: 1; padding-top: 42px; }
  .chapter-tabs button strong { font-size: 17px; }
  .chapter-copy h3 { font-size: 25px; }
  .chapter-copy p { font-size: 12px; }
  .chapter-image-note { font-size: 19px; }
  .story-quote p { font-size: 23px; }
  .memory-caption { font-size: 18px; margin-left: 2px; }
  .memory-meta { font-size: 7px; letter-spacing: .3px; margin-left: 2px; }
  .reason-card { min-height: 270px; }
  .reason-card h3 { font-size: 18px; }
  .reason-card p { font-size: 11px; }
  .reason-jar h3 { font-size: 22px; }
  .letter-copy h2 { font-size: 31px; }
  .letter-copy p { font-size: 12px; }
  .letter-peek > span:first-child { font-size: 25px; }
  .letter-peek > span:last-child { font-size: 16px; }
  .envelope-label { font-size: 18px; }
  .envelope-note { font-size: 18px; }
  .universe-heading h2 { font-size: 36px; }
  .constellation-star > span { font-size: 16px; }
  .finale-content h2 { font-size: 37px; }
  .site-footer > p { font-size: 10px; }
  .site-footer > p span { font-size: 9px; }
}
@media (max-width: 680px) {
  .wordmark { font-size: 19px; gap: 3px; }
  .wordmark > span { font-size: 22px; padding-inline: 2px; }
  .wordmark .icon { width: 10px; height: 10px; margin-left: 0; }
  .header-actions { gap: 9px; }
  .sound-label { font-size: 10px; }
  .sound-toggle { gap: 6px; }
  .site-header nav a { font-size: 13px; }
  .hero { padding-top: 43px; }
  .hero .eyebrow { margin-bottom: 24px; font-size: 10px; }
  .hero h1 { font-size: clamp(48px, 13vw, 74px); line-height: 1.35; letter-spacing: .02em; }
  .hero-heart { width: 37px; height: 37px; bottom: 17px; margin-left: 4px; }
  .hero-description { font-size: 13px; margin-top: 23px; }
  .hero-buttons { gap: 16px; margin-top: 23px; }
  .hero-buttons .button { font-size: 11px; padding-inline: 14px; gap: 12px; }
  .hero-buttons .text-button { font-size: 11px; gap: 5px; }
  .hero-signature > span:last-child { font-size: 9px; }
  .hero-photo figcaption { font-size: 17px; }
  .mini-photo figcaption { font-size: 14px; }
  .hero-note { font-size: 26px; }
  .art-flower { left: 151px; bottom: 11px; }
  .scroll-cue { font-size: 9px; letter-spacing: 1px; }
  .ribbon-track span { font-size: 19px; }
  h2 { font-size: clamp(27px, 7.7vw, 36px); line-height: 1.5; letter-spacing: 0; }
  .eyebrow { font-size: 10px; letter-spacing: 1.2px; }
  .section-heading > p { padding-top: 0; font-size: 12px; }
  .chapter-tabs { padding-inline: 10px; gap: 0 6px; }
  .chapter-tabs button { gap: 8px; padding-inline: 3px; }
  .chapter-tabs button strong { font-size: 15px; line-height: 1.6; max-width: 130px; }
  .chapter-tabs button small { font-size: 9px; letter-spacing: 1px; }
  .chapter-number { font-size: 23px; margin-top: 4px; }
  .chapter-copy { padding: 25px; }
  .chapter-copy h3 { font-size: 25px; }
  .chapter-copy p { font-size: 13px; }
  .chapter-image-note { font-size: 21px; }
  .chapter-footnote { font-size: 19px; line-height: 1.7; }
  .story-quote p { font-size: 21px; line-height: 1.85; }
  .story-quote > span { font-size: 19px; }
  .memory-caption { font-size: 24px; margin: 15px 6px 6px; }
  .memory-meta { font-size: 9px; letter-spacing: .4px; margin-left: 7px; }
  .memory-bottom { font-size: 11px; }
  .reasons-intro p { font-size: 12px; }
  .reason-card { min-height: 255px; padding-inline: 13px; }
  .reason-card h3 { font-size: 18px; line-height: 1.65; }
  .reason-card p { font-size: 11px; line-height: 1.95; }
  .reason-jar h3 { font-size: 22px; }
  .reason-jar p { font-size: 11px; }
  .reason-jar .button { font-size: 12px; }
  .letter-copy h2 { font-size: clamp(27px, 7.7vw, 35px); line-height: 1.55; }
  .letter-copy p { font-size: 12px; }
  .letter-small-note { font-size: 10px; }
  .envelope-label { font-size: 19px; }
  .envelope-note { font-size: 19px; }
  .wax-seal > span { font-size: 16px; }
  .universe-heading h2 { font-size: clamp(27px, 7.5vw, 35px); line-height: 1.55; }
  .universe-heading p { font-size: 11px; line-height: 1.9; }
  .constellation-star > span { font-size: 15px; width: 68px; line-height: 1.5; }
  .star-message p { font-size: 21px; line-height: 1.7; }
  .star-message > span { font-size: 9px; line-height: 2; letter-spacing: 1px; }
  .finale-content h2 { font-size: clamp(27px, 7.5vw, 35px); line-height: 1.6; }
  .finale-content p { font-size: 12px; line-height: 2.2; }
  .finale-initials { font-size: 22px; }
  .finale-note { font-size: 19px; }
  .site-footer .wordmark { font-size: 19px; }
  .site-footer > p { font-size: 11px; }
  .site-footer > p span { font-size: 9px; }
  .footer-controls, .footer-controls button { font-size: 10px; }
  .letter-paper { padding: 53px 27px 32px; }
  .letter-paper .eyebrow { font-size: 9px; letter-spacing: .7px; }
  .letter-paper h2 { font-size: 30px; }
  .letter-paragraphs p { font-size: 21px; line-height: 1.9; }
  .letter-closing span { font-size: 22px; }
  .letter-paper-heart { right: 27px; bottom: 103px; width: 24px; height: 24px; }
  .memory-dialog-copy h2 { font-size: 27px; }
  .memory-dialog-copy .eyebrow { font-size: 9px; letter-spacing: .6px; }
  .memory-dialog-copy p { font-size: 12px; }
  .note-dialog h2 { font-size: 21px; }
  .note-dialog > p { font-size: 26px; line-height: 1.7; }
  .note-dialog .eyebrow { font-size: 9px; }
  .note-signature { font-size: 20px; }
  .confession-dialog { padding-inline: 25px; }
  .confession-dialog h2 { font-size: 28px; }
  .confession-dialog > p { font-size: 12px; }
  .toast { font-size: 11px; }
}
@media (max-width: 360px) {
  .wordmark { font-size: 17px; }
  .hero h1 { font-size: 45px; }
  .hero-heart { width: 32px; height: 32px; bottom: 15px; }
  .hero-buttons { gap: 11px; }
  .hero-buttons .button, .hero-buttons .text-button { font-size: 10px; }
  .hero-signature > span:last-child { font-size: 8px; }
  .reason-jar { padding-inline: 16px; }
  .reason-jar h3 { font-size: 21px; }
  .reason-jar p { font-size: 10px; }
  .envelope-note { font-size: 17px; }
  .envelope-label { font-size: 17px; }
  .constellation-star > span { width: 57px; font-size: 13px; }
}
@media print {
  .hero h1 { font-size: 50px; }
  .letter-paper { padding: 25px; }
}