/* Chapter I: a native-scroll archival prologue. All content is visible without JS. */
.chapter-intro {
  --chapter-black: #151515;
  position: relative;
  isolation: isolate;
  margin-inline: calc(-1 * var(--chapter-pad));
  background: var(--chapter-black);
  color: #f3f0e9;
  overflow: clip;
}
.chapter-intro a { color: inherit; text-underline-offset: .2em; }
.chapter-intro .sr-only { position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap; }
.chapter-intro__date {
  position: relative;
  min-height: calc(100svh - var(--nav-height));
  display: grid;
  place-items: center;
  padding: 80px 7vw;
  text-align: center;
}
.chapter-intro__date > p {
  font: 400 clamp(16px, 1.55vw, 26px)/1.5 var(--sans);
  text-transform: uppercase;
  letter-spacing: .28em;
  margin: -4vh 0 0;
}
.chapter-intro__age { display:block;font:400 11px/1.5 var(--sans);letter-spacing:.2em;margin-top:20px;color:#aaa79f; }
.chapter-intro__scroll { position:absolute;bottom:7vh;left:50%;transform:translateX(-50%);font:10px/1.4 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#aaa79f; }
.chapter-intro__scroll i { display:block;height:48px;width:1px;background:linear-gradient(#aaa79f,transparent);margin:20px auto 0; }
.chapter-intro__context { position:relative;isolation:isolate; }
.chapter-intro__backdrop {
  position:sticky;top:var(--nav-height);height:calc(100svh - var(--nav-height));
  margin-bottom:calc(-100svh + var(--nav-height));overflow:hidden;pointer-events:none;z-index:-1;
}
.chapter-intro__backdrop::after { content:'';position:absolute;inset:0;background:linear-gradient(90deg,#15151505 15%,#1515155c 47%,#151515 85%),linear-gradient(#151515 0%,transparent 25%,transparent 65%,#151515 100%); }
.chapter-intro__background-image {
  position:absolute;left:0;top:-80px;width:66%;height:calc(100% + 160px);object-fit:cover;object-position:50% 58%;
  opacity:.36;filter:grayscale(1);max-width:none!important;
}
.chapter-intro__context-content { position:relative;padding:12vw 0 10vw;min-height:102vw; }
body.story-edition .chapter-intro__lead {
  width:70.8vw;max-width:calc(100% - 14.4vw);margin:0 0 9vw 7.2vw;
  font:400 4.11vw/1.045 var(--sans);letter-spacing:-.01vw;text-indent:13.3vw;text-wrap:pretty;
}
.chapter-intro__copy { width:27.15vw;margin-left:20.7vw; }
body.story-edition .chapter-intro__copy p { font:400 1.6vw/1.34 var(--sans);margin:0 0 1.7em;letter-spacing:-.016em;color:#e7e4dd;text-wrap:pretty; }
body.story-edition .chapter-intro__photo { position:absolute;top:44vw;left:57vw;width:32vw;max-width:none;margin:0; }
body.story-edition .chapter-intro__photo img { display:block;width:100%;height:auto;object-fit:contain;filter:none; }
.chapter-intro__photo .archive-image { background:transparent; }
body.story-edition .chapter-intro__photo figcaption { color:#e0ded7;font:400 12px/1.5 var(--sans);margin:14px 0 8px; }
body.story-edition .chapter-intro__photo .archive-credit { color:#aaa79f;font:400 10px/1.5 var(--sans);margin:8px 0; }
.chapter-intro__photo .archive-credit a { text-decoration-color:#78766f; }
.chapter-intro__image-note { width:28vw;margin:8vw 0 0 7.2vw;color:#aaa79f;font:11px/1.5 var(--sans); }
.chapter-intro__sources { margin:0 7.2vw;border-top:1px solid #45433e;border-bottom:1px solid #45433e;padding:20px 0; }
.chapter-intro__sources summary { cursor:pointer;font:12px/1.5 var(--sans);letter-spacing:.05em;color:#c5c1b7; }
.chapter-intro__sources > p { max-width:65ch;font:14px/1.65 var(--sans);color:#c5c1b7; }
.chapter-intro__source-grid { display:grid;grid-template-columns:1fr 1fr;gap:6vw;margin:35px 0;max-width:850px; }
.chapter-intro__source-grid figure { margin:0;max-width:340px; }
.chapter-intro__source-grid img { display:block;width:100%;height:auto;max-height:500px;object-fit:contain; }
.chapter-intro__source-grid figcaption { color:#c5c1b7;font:12px/1.6 var(--sans);margin-top:14px; }
.chapter-intro__title-block { position:relative;padding:9vw 7.2vw 11vw; }
.chapter-intro__kicker { font:11px/1.4 var(--sans);text-transform:uppercase;letter-spacing:.15em;color:#bbb7ad;margin:0; }
.chapter-intro__years { position:relative;height:57vw;margin-top:2vw;pointer-events:none; }
.chapter-intro__year { position:absolute;top:0;left:-1vw;font:200 32vw/.9 'Helvetica Neue',Arial,sans-serif;letter-spacing:-.085em; }
.chapter-intro__year:nth-child(2) { top:25vw;left:19vw; }
.chapter-intro__year > span { display:block;color:#a58f61;background:linear-gradient(170deg,#c7b487 0%,#9c875e 32%,#3c362c 65%,#151515 92%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent; }
body.story-edition .chapter-intro__heading {
  position:relative;z-index:1;margin:-8vw 0 0;font:300 8.5vw/.93 'Overture Serif',Georgia,'Songti TC',serif;
  letter-spacing:-.045em;text-transform:uppercase;color:#f4f1eb;
}
.chapter-intro__line { display:block;position:relative; }
.chapter-intro__line + .chapter-intro__line { margin-top:1.4vw; }
.chapter-intro__line:nth-child(2) { margin-left:14.4vw; }
.chapter-intro__line > span { display:block; }
.chapter-intro.is-animated .chapter-intro__line > span { opacity:.12;translate:0 50px;transition:opacity 1s ease,translate 1s cubic-bezier(.2,.65,.3,1); }
.chapter-intro.is-animated.is-title-visible .chapter-intro__line > span { opacity:1;translate:0 0; }
.chapter-intro.is-animated .chapter-intro__line:nth-child(2) > span { transition-delay:.1s; }
.chapter-intro.is-animated .chapter-intro__line:nth-child(3) > span { transition-delay:.2s; }
html[lang="zh-Hant"] .chapter-intro__lead { line-height:1.3;letter-spacing:.01em; }
html[lang="zh-Hant"] .chapter-intro__copy p { line-height:1.65;letter-spacing:.02em; }
html[lang="zh-Hant"] .chapter-intro__heading { font-family:'Songti TC','STSong','PMingLiU',serif;font-weight:300;line-height:1.12;letter-spacing:.06em; }
/* Continue directly into the real family photograph before the 1949 story. */
#chapter-1 > .chapter-body > .timeline-age-note { margin-top:40px; }
html.chapter-one-context-active .top,html.chapter-one-context-active .rail { background:#151515;color:#e8e3d7;border-color:#393732; }
html.chapter-one-context-active .rail a,html.chapter-one-context-active .rail button,html.chapter-one-context-active .top button,html.chapter-one-context-active .top a,html.chapter-one-context-active .top summary { color:#e8e3d7; }
html.chapter-one-context-active .picker-book { filter:invert(1); }
html.chapter-one-context-active .seal { background:#151515; }
@media(min-width:1440px) { body.story-edition .chapter-intro__copy p { font-size:1.4vw;line-height:1.32; } }
@media(min-width:700px) and (max-width:991px) { body.story-edition .chapter-intro__copy p { font-size:16px;line-height:1.375; }.chapter-intro__copy{width:32vw;margin-left:16.7vw}.chapter-intro__context-content{min-height:125vw}.chapter-intro__image-note{margin-top:10vw} }
@media(max-width:699px) {
 .chapter-intro__date { padding-inline:6.5vw;min-height:calc(100svh - var(--nav-height)); }
 .chapter-intro__date > p { font-size:14px;letter-spacing:.17em; }
 .chapter-intro__backdrop { display:none; }
 .chapter-intro__context-content { padding:13vw 6.5vw 12vw;min-height:0; }
 body.story-edition .chapter-intro__lead { width:auto;max-width:none;margin:0 0 14vw;font-size:7.4vw;line-height:1.12;text-indent:0;letter-spacing:-.01em; }
 .chapter-intro__copy { width:85%;margin-left:0; }
 body.story-edition .chapter-intro__copy p { font-size:clamp(16px,4.55vw,24px);line-height:1.38;margin-bottom:1.6em; }
 body.story-edition .chapter-intro__photo { position:relative;top:auto;left:auto;width:100%;margin:16vw 0 0; }
 body.story-edition .chapter-intro__photo figcaption { font-size:13px; }
 body.story-edition .chapter-intro__photo .archive-credit { font-size:11px; }
 .chapter-intro__image-note { display:none; }
 .chapter-intro__sources { margin:0 6.5vw;padding:17px 0; }
 .chapter-intro__source-grid { gap:24px;grid-template-columns:1fr; }
 .chapter-intro__title-block { padding:16vw 6.5vw 22vw; }
 .chapter-intro__kicker { font-size:9px;letter-spacing:.04em; }
 .chapter-intro__years { height:99vw;margin-top:10vw; }
 .chapter-intro__year { font-size:47vw;top:0;left:-2vw; }
 .chapter-intro__year:nth-child(2) { top:42vw;left:6vw; }
 body.story-edition .chapter-intro__heading { font-size:10.8vw;line-height:1.02;margin-top:-8vw; }
 .chapter-intro__line:nth-child(2) { margin-left:8.5vw; }
 .chapter-intro__line + .chapter-intro__line { margin-top:2vw; }
 html[lang="zh-Hant"] .chapter-intro__lead { font-size:7.1vw;line-height:1.45; }
 html[lang="zh-Hant"] .chapter-intro__copy p { font-size:clamp(16px,4.55vw,24px);line-height:1.75; }
}
html[data-motion="off"] .chapter-intro__backdrop { position:absolute;top:0;margin:0;height:100%; }
html[data-motion="off"] .chapter-intro__line > span { opacity:1;translate:none;transition:none; }
@media(prefers-reduced-motion:reduce) { .chapter-intro * { transition:none!important;animation:none!important; }.chapter-intro__backdrop{position:absolute;top:0;margin:0;height:100%}.chapter-intro__line > span{opacity:1!important;translate:none!important} }
@media print {
 .chapter-intro { margin:0!important;background:white;color:black;overflow:visible; }
 .chapter-intro__date { min-height:0;padding:10mm 0; }
 .chapter-intro__date > p,.chapter-intro__age { color:black; }
 .chapter-intro__scroll,.chapter-intro__backdrop,.chapter-intro__years,.chapter-intro__image-note { display:none; }
 .chapter-intro__context-content { min-height:0;padding:0; }
 body.story-edition .chapter-intro__lead { font-size:20pt;line-height:1.3;width:auto;max-width:none;text-indent:0;margin:10mm 0; }
 .chapter-intro__copy { width:auto;margin:0; }
 body.story-edition .chapter-intro__copy p { color:black;font:11pt/1.5 serif; }
 body.story-edition .chapter-intro__photo { position:static;width:90mm;margin:10mm 0;transform:none!important;break-inside:avoid; }
 body.story-edition .chapter-intro__photo figcaption,body.story-edition .chapter-intro__photo .archive-credit { color:black; }
 .chapter-intro__title-block { padding:10mm 0; }
 .chapter-intro__kicker { color:black; }
 body.story-edition .chapter-intro__heading { font-size:32pt;color:black;margin:8mm 0; }
 .chapter-intro__line { transform:none!important; }
 .chapter-intro__line > span { opacity:1!important;translate:none!important; }
}

/* The existing root scroll-padding is 100px; land this full-screen scene below the actual rail header. */
#chapter-1 { scroll-margin-top:calc(var(--nav-height) - 100px); }
.chapter-intro__source-grid .chapter-intro__road { grid-column:1 / -1;max-width:550px; }
.chapter-intro__title-block { background:var(--chapter-black); }
.chapter-intro__sources { padding-block:8px; }
.chapter-intro__sources summary { min-height:44px;padding-block:12px; }
/* The sound button already reports autoplay status; keep the live status available
   to assistive technology without covering the chapter's opening composition. */
html.chapter-one-context-active .audio-status {
  position:fixed!important;width:1px!important;height:1px!important;padding:0!important;
  margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;
  clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important;
}
