@font-face{font-family:PaperText;src:url('assets/fonts/body.woff?v=800f9ec353') format('woff');font-display:swap}@font-face{font-family:Handwritten;src:url('assets/fonts/heading.woff?v=dc004dab71') format('woff');font-display:swap}
:root{--paper:#f5ead4;--ink:#4c372b;--muted:#85694f;--red:#bf502e;--hand:Handwritten,'STKaiti','KaiTi',serif;--body:PaperText,'Songti SC',serif;color-scheme:light;color-scheme:only light}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:78px;background:#f5ead4}body{margin:0;color:var(--ink);font:18px/2 var(--body);background:#f5ead4;background-image:radial-gradient(ellipse at 12% 4%,#e6b77d13,transparent 40%),radial-gradient(ellipse at 91% 37%,#d8884b0c,transparent 35%);overflow-x:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none;padding:0}button:disabled{opacity:.3;cursor:default}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid var(--red);outline-offset:4px}img{display:block;max-width:100%}p,h1,h2,h3,figure{margin:0}h1,h2,h3{font:400 32px/1.5 var(--hand)}small{font-size:12px}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.paper-grain{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;pointer-events:none;opacity:.032;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.reader-header{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;padding:14px 24px;height:65px;background:linear-gradient(#f5ead4f5,#f5ead4d9,#f5ead400);pointer-events:none}.reader-header>*{pointer-events:auto}.reader-brand{display:flex;align-items:center;gap:10px;letter-spacing:2px}.reader-brand>span{font:27px var(--hand);display:flex;align-items:center;justify-content:center;width:32px;height:35px;border:1px solid var(--red);color:var(--red);transform:rotate(-5deg)}.reader-brand small{font-size:11px;letter-spacing:2px}.menu-button{display:flex;gap:12px;align-items:center;min-height:44px;font-size:12px;letter-spacing:2px}.menu-button i{width:22px;height:11px;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);transform:skewY(-8deg)}
.scroll-story{position:relative;max-width:1000px;margin:0 auto;padding-top:68px;overflow:hidden;isolation:isolate}.story-block{position:relative;padding:34px 45px 45px}.story-block:before{content:'';position:absolute;top:0;right:-10%;bottom:0;left:-10%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at var(--wash-x,25%) var(--wash-y,60%),#de9d5b0c,transparent 62%)}.block-content{position:relative;z-index:5}.story-block>.environment{pointer-events:none}.trail-thread{position:absolute;top:-2px;left:0;width:100%;height:calc(100% + 4px);overflow:visible;z-index:0;pointer-events:none}.trail-thread path{fill:none;stroke-linecap:round;vector-effect:non-scaling-stroke}.trail-wash{stroke:#c68b4a;stroke-width:20px;opacity:.075}.trail-pencil{stroke:#ac7950;stroke-width:1.2px;stroke-dasharray:7 9 3 11;opacity:.27}
.passage{position:relative;max-width:670px;margin:18px auto 26px;padding:6px 10px;text-align:center;background:radial-gradient(ellipse at center,#f5ead4eb 18%,#f5ead466 58%,transparent 78%);z-index:10;scroll-margin-top:85px}.story-line{display:block;font-size:21px;line-height:2.15;letter-spacing:.4px}.story-title{font-size:39px;margin:20px auto 8px;max-width:100%}.story-title:first-child{margin-top:0}.story-cite{display:block;font-size:11px;font-style:normal;color:var(--muted);margin-top:15px}.brush-mark{display:inline-flex;position:relative;align-items:center;justify-content:center;isolation:isolate;padding:7px 25px 10px;min-height:34px;line-height:1.55;color:#fff3de;font-family:var(--hand);font-weight:400;text-shadow:0 1px 1px #85321922}.brush-mark:before{content:'';position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;background:url('assets/v3-brush.webp') center/100% 300% no-repeat}.brush-mark>span{position:relative}.paint-layer{position:absolute;pointer-events:none}.paint-shift{width:100%;height:100%;will-change:transform}.paint-layer img{width:100%;height:100%;object-fit:contain}.ground-layer,.tree-layer{position:absolute;object-fit:contain;pointer-events:none;z-index:7}.scene{position:relative;width:100%;max-width:850px;height:430px;margin:0 auto;isolation:isolate;scroll-margin-top:80px}.scene--portrait{height:560px;max-width:720px}.scene--walking{height:400px}.scene--papers{height:285px;max-width:650px}.scene--bridge{height:450px}.scene--paired{height:650px}.scene--march{height:340px}.scene--reports{height:380px;max-width:740px}.scene--book{height:370px;max-width:620px}.scene--ximeng{height:325px}.scene--yanan{height:440px}.scene--letter{height:285px;max-width:620px}.scene--qingji{height:425px}.scene--battle{height:440px}.scene--guoxin,.scene--people{height:365px;max-width:720px}.scene--modern{height:420px}.scene--ending{height:450px}.scene-tag{position:absolute;top:0;left:0;right:0;text-align:center;z-index:10;font-size:19px}.scene-tag+.paint-layer{z-index:1}.scene-small-tag{position:absolute;z-index:9;font-size:16px}.paired-one{left:35%;top:16%}.paired-two{left:4%;top:84%}.paper-caption{position:absolute;left:28%;top:32%;width:42%;font:24px/1.6 var(--hand);text-align:center;transform:rotate(-5deg);color:#775238;z-index:4}.letter-object-label{position:absolute;left:29%;top:40%;width:48%;font:24px/1.6 var(--hand);text-align:center;transform:rotate(-5deg);color:#775238;z-index:4}.paper-object-label{position:absolute;left:12%;top:34%;font:37px/1.4 var(--hand);color:#a54229;transform:rotate(-6deg);z-index:6}.report-headline{position:absolute;z-index:8;text-align:center;pointer-events:none;color:#65442e}.report-headline small{display:block;font:11px/1.8 var(--body);margin-bottom:10px}.report-headline strong{font:400 28px/1.6 var(--hand);letter-spacing:2px}.headline-one{left:12%;top:24%;width:37%;transform:rotate(-5deg)}.headline-two{left:50%;top:47%;width:36%;transform:rotate(-5deg)}
.hotspot{position:absolute;z-index:20;width:49px;height:49px;transform:translate(-50%,-50%);border-radius:50%;touch-action:manipulation}.hotspot:before,.hotspot:after{content:'';position:absolute;border-radius:50%;pointer-events:none}.hotspot:before{top:9px;right:9px;bottom:9px;left:9px;border:1.4px solid #b85030;border-right-color:transparent;animation:ring-breath 3s ease-in-out infinite}.hotspot:after{top:4px;right:4px;bottom:4px;left:4px;border:1px solid #c4653b99;border-top-color:transparent;animation:ring-expand 3s ease-out infinite}.hotspot i{position:absolute;left:23px;top:23px;width:4px;height:4px;border-radius:50%;background:var(--red)}.hotspot>span{position:absolute;top:45px;left:50%;transform:translateX(-50%);font-size:10px;line-height:1.5;white-space:nowrap;color:#8a5d40;letter-spacing:.5px;padding:1px 4px;background:#f5ead4c9}.hotspot.is-explored:after{animation:none;opacity:.35}.hotspot.is-waiting{transform:translate(-50%,-35%)}
.opening{padding-top:8px;padding-bottom:12px}.opening .passage{margin-top:0}.scroll-invitation{text-align:center;margin:14px auto 0;color:var(--muted);font-size:11px;letter-spacing:1px}.scroll-invitation span{display:inline-block;color:var(--red);margin-left:6px}.walking-block{padding-top:0;padding-bottom:20px}.name-block{padding-top:0}.name-block #his-name{margin:30px auto 0}.name-block #his-name .story-title{font-size:48px;margin-top:10px}.honors-block .passage{margin:14px auto}.honors-art{position:relative;height:270px;max-width:670px;margin:0 auto 12px}.honors-block #honor-transition{margin-top:35px}.chapter-opening{padding-top:50px;padding-bottom:12px}.chapter-opening .story-title{margin-bottom:32px}.chapter-opening .passage:last-child{margin-bottom:0}.route-block{padding-top:0;padding-bottom:45px}.route-composition{position:relative;max-width:460px;height:550px;margin:0 auto;isolation:isolate}.route-drawing,.relay-drawing{position:absolute;top:0;left:0;width:100%;height:100%;z-index:3;overflow:visible}.route-drawing path,.relay-drawing path{fill:none;stroke:#bd5635;stroke-width:2.3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset 2s ease}.route-drawing.is-waiting path,.relay-drawing.is-waiting path{stroke-dashoffset:1}.route-pin{position:absolute;z-index:8;width:22px;height:22px;transform:translate(-50%,-50%)}.route-pin i{display:block;position:absolute;left:8px;top:8px;width:7px;height:7px;background:#b8492b;border-radius:50%;box-shadow:0 0 0 4px #f5ead4,0 0 0 5px #b8492b88}.route-pin .brush-mark{position:absolute;left:calc(11px + var(--label-x));top:calc(11px + var(--label-y));transform:translateX(-50%);font-size:17px;padding:2px 15px 4px;min-height:27px;white-space:nowrap}.figure-note{position:relative;z-index:10;text-align:center;max-width:85%;margin:15px auto 0;color:var(--muted);font-size:11px;line-height:1.8}.anchor-alias{position:absolute;top:0;left:0;scroll-margin-top:85px}.river-block{padding-bottom:12px}.river-block:after{content:'';position:absolute;right:0;bottom:-80px;width:70%;height:210px;background:url('assets/v3-river.webp') center/contain no-repeat;opacity:.34;transform:rotate(20deg);z-index:0;pointer-events:none}.field-block{padding-top:0}.field-block #geography{margin-top:0}.field-block #two-northwests{margin-top:10px}.truth-block{padding-top:15px}.truth-block .scene--reports{margin-top:-12px}.book-object{position:absolute;left:48%;top:14%;width:34%;height:72%;z-index:5;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#fff0d6;font-family:var(--hand);font-size:40px;line-height:1.55;background:#b75936;border-left:9px solid #914c31;border-top:1px solid #d49f6c;border-bottom:2px solid #8e4f32;box-shadow:7px 5px 0 #ead1a9,9px 6px 0 #aa7e51;transform:rotate(5deg);clip-path:polygon(0 1%,98% 0,100% 99%,2% 100%)}.book-object small{font-size:17px;margin-top:18px}.notebook-label{position:absolute;left:12%;top:42%;font:19px var(--hand);transform:rotate(-5deg);z-index:3}.book-block #reporting-method{margin-top:12px}.ximeng-block{padding-top:8px}.yanan-block .story-title{font-size:34px}.yanan-block .passage{margin-bottom:20px}.letter-block{padding-top:10px}.letter-block .passage{margin-bottom:27px}.modern-block .story-title{margin:23px auto}.modern-block #relay-transition{margin-bottom:35px}.relay-route-block{padding-top:15px}.relay-composition{position:relative;height:500px;max-width:460px;margin:20px auto 0;isolation:isolate}.relay-place{position:absolute;z-index:8;transform:translate(-15%,-50%);font-size:21px;white-space:nowrap}.schools-block{padding-top:10px}.universities{position:relative;margin:20px -25px 0}.schools-track{display:flex;gap:20px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scroll-padding-left:9%;padding:6px 9% 20px;-webkit-overflow-scrolling:touch;scrollbar-width:none}.schools-track::-webkit-scrollbar{display:none}.school-slide{position:relative;flex:0 0 86%;max-width:590px;text-align:center;padding:5px 20px 20px;border-bottom:1px solid #b784574d;background:linear-gradient(145deg,#fff8e666,#f5ead400 70%);scroll-snap-align:start}.school-landscape{position:relative;height:130px;max-width:390px;margin:0 auto 7px}.school-title{font-size:30px;max-width:100%;line-height:1.4}.school-title .brush-mark{padding:6px 23px 10px}.school-slide>p{font-size:19px;margin:18px 0 7px;line-height:1.8}.school-slide>small{display:block;font-size:12px;color:var(--muted);line-height:1.8;min-height:42px}.school-open{display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;color:#9a502f;min-height:44px;margin:12px auto 0}.school-open i{width:22px;height:22px;border:1px solid #b85d3899;border-right-color:transparent;border-radius:50%;animation:ring-breath 3s infinite}.schools-control{display:flex;align-items:center;justify-content:center;gap:24px;margin-top:5px}.schools-control>button{width:44px;height:44px;font-size:24px;color:#a64b2d}.school-dots{display:flex;gap:12px;align-items:center}.school-dot{width:8px;height:8px;border:1px solid #b28460;border-radius:50%;position:relative}.school-dot:after{content:'';position:absolute;top:-8px;right:-6px;bottom:-8px;left:-6px}.school-dot.is-active{background:#b95634;border-color:#b95634}.ending-block{padding-top:50px}.ending-block .story-title{margin-bottom:24px}.ending-block #spirit-words .story-line{font-family:var(--hand);font-size:30px;line-height:2}.ending-block #always-on-road{margin-top:12px}.ending-block #always-on-road .story-title{font-size:39px}.archive-block{padding-top:20px;padding-bottom:70px}.end-content{text-align:center}.end-content>.brush-mark{font-size:27px}.end-links{display:flex;flex-wrap:wrap;gap:14px 24px;justify-content:center;margin:25px auto 20px;font-size:13px}.end-links>*{min-height:40px;display:inline-flex;align-items:center;border-bottom:1px solid #b68a5f55}.end-content>p{font-size:11px;line-height:2;color:var(--muted)}
.reveal{transition:opacity .75s ease var(--delay,0s),translate .75s ease var(--delay,0s)}.reveal.is-waiting{opacity:0!important;translate:0 14px}.paint-layer.reveal{transition-duration:1s}.paint-layer.reveal.is-waiting{translate:0 22px}.reveal.has-entered{translate:0 0}.body-modal-lock{position:fixed;left:0;right:0;width:100%;overflow:hidden}.material-dialog:not([open]){display:none}.material-dialog[open]{z-index:120}.panel-fallback-open:after{content:'';position:fixed;top:0;right:0;bottom:0;left:0;background:#4b3a2a70;z-index:100}.panel-fallback-open .material-dialog[open]{position:fixed;top:4vh;left:0;right:0;margin:0 auto;z-index:120}
@keyframes ring-breath{0%,100%{opacity:.38}50%{opacity:.95}}@keyframes ring-expand{0%{opacity:.05;transform:scale(.85)}30%{opacity:.5}100%{opacity:0;transform:scale(1.3)}}
@media(min-width:1100px){body:before,body:after{content:'';position:fixed;top:0;bottom:0;width:1px;background:#c19a6c22;pointer-events:none}body:before{left:calc(50% - 501px)}body:after{right:calc(50% - 501px)}}
@media(max-width:680px){.reader-header{height:60px;padding:10px 17px}.reader-brand{gap:9px}.reader-brand>span{width:28px;height:31px;font-size:24px}.reader-brand small{font-size:10px}.menu-button{font-size:11px;gap:10px}.menu-button i{width:19px}.scroll-story{padding-top:60px}.story-block{padding:25px 16px 33px}.passage{max-width:100%;margin:14px auto 22px;padding:4px 5px}.story-line{font-size:18px;line-height:2.15;letter-spacing:0}.story-title{font-size:31px;margin:17px auto 6px}.story-title .brush-mark{padding:7px 22px 10px}.scene{height:320px}.scene--portrait{height:420px}.scene--walking{height:300px}.scene--papers{height:210px}.scene--bridge{height:330px}.scene--paired{height:490px}.scene--march{height:245px}.scene--reports{height:260px}.scene--book{height:270px}.scene--ximeng{height:240px}.scene--yanan{height:320px}.scene--letter{height:220px}.scene--qingji{height:300px}.scene--battle{height:320px}.scene--guoxin,.scene--people{height:275px}.scene--modern{height:300px}.scene--ending{height:330px}.opening{padding-top:0;padding-bottom:12px}.opening .passage{margin-top:0;margin-bottom:10px}.walking-block{padding-top:0;padding-bottom:12px}.name-block{padding-top:0}.name-block #his-name .story-title{font-size:44px}.honors-block .passage{margin:12px auto}.honors-art{height:205px}.honors-block #honor-transition{margin-top:25px}.chapter-opening{padding-top:40px;padding-bottom:6px}.chapter-opening .story-title{margin-bottom:24px}.chapter-opening .passage:last-child{margin-bottom:0}.route-block{padding-top:0;padding-bottom:28px}.route-composition{height:455px;max-width:360px}.route-pin .brush-mark{font-size:15px;padding:1px 12px 3px}.figure-note{font-size:10px;max-width:98%;margin-top:13px}.scene-small-tag{font-size:13px}.paired-one{left:34%;top:19%}.paired-two{left:0;top:83%}.scene-tag{font-size:16px}.paper-caption{font-size:18px}.letter-object-label{font-size:18px}.paper-object-label{font-size:27px}.report-headline small{font-size:8px;margin-bottom:5px}.report-headline strong{font-size:20px;line-height:1.6}.hotspot>span{font-size:9px}.book-object{font-size:29px;border-left-width:6px}.book-object small{font-size:14px;margin-top:12px}.notebook-label{font-size:15px}.field-block{padding-top:0}.field-block #two-northwests{margin-top:0}.truth-block .scene--reports{margin-top:4px}.yanan-block .story-title{font-size:27px}.modern-block #relay-transition{margin-bottom:28px}.relay-composition{height:440px;max-width:360px}.relay-place{font-size:19px}.universities{margin-right:-12px;margin-left:-12px}.schools-track{gap:14px;padding-left:8%;padding-right:8%;scroll-padding-left:8%}.school-slide{flex-basis:88%;padding:0 10px 16px}.school-landscape{height:110px}.school-title{font-size:25px}.school-slide>p{font-size:17px;margin-top:14px}.school-slide>small{font-size:11px}.school-open{font-size:11px}.ending-block{padding-top:37px}.ending-block #spirit-words .story-line{font-size:25px}.ending-block #always-on-road .story-title{font-size:35px}.archive-block{padding-top:15px;padding-bottom:48px}.end-links{font-size:12px;gap:8px 16px}.end-content>p{font-size:10px}.material-header{padding:17px 20px 14px!important}.material-header h2{font-size:28px!important}.material-content{padding:20px!important}.archive-grid{grid-template-columns:1fr!important}.material-dialog{max-height:90vh!important}.material-content{max-height:calc(90vh - 100px)!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal,.paint-shift,.route-drawing path,.relay-drawing path{transition:none!important;animation:none!important}.reveal.is-waiting{opacity:1!important;translate:0 0!important}.hotspot:before,.hotspot:after,.school-open i{animation:none!important}}

.reveal.is-settled{transition:none!important}

.material-dialog{width:760px;max-width:calc(100vw - 28px);max-height:92vh;border:1px solid #bd9d78;border-radius:2px;background:#fcf3e0;color:var(--ink);padding:0;box-shadow:0 15px 80px #4c35262e}.material-dialog::backdrop{background:#4b3a2a70;backdrop-filter:blur(3px)}.material-header{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:22px 30px 17px;border-bottom:1px solid #bf9e7640}.material-kicker{font-size:10px;color:var(--muted);letter-spacing:2px;margin-bottom:4px}.material-header h2{font-size:33px;color:var(--red);line-height:1.45}.material-close{width:44px;height:44px;flex-shrink:0;font-size:33px;font-family:var(--body);line-height:1}.material-content{padding:23px 30px 32px;overflow-y:auto;max-height:calc(92vh - 116px);overscroll-behavior-y:contain;touch-action:pan-y pinch-zoom;scrollbar-width:thin}.material-intro{font-size:16px;line-height:2;margin-bottom:22px}.source-figure{padding:0 0 24px;margin-bottom:25px;border-bottom:1px solid #bf9c7440}.source-type{display:block;font-size:10px;color:var(--muted);letter-spacing:1px;margin:8px 0 12px}.source-figure>img{max-width:100%;max-height:55vh;width:auto;object-fit:contain;margin:auto}.source-figure figcaption{margin-top:19px;line-height:2}.source-figure figcaption strong{display:block;font-size:15px;font-weight:400;margin-bottom:10px}.source-figure figcaption p{font-size:14px;line-height:2}.source-figure figcaption small{display:block;margin-top:14px;color:var(--muted);font-size:11px}.material-body{padding:0 0 20px;font-size:16px;line-height:2.1}.material-body p{margin:0 0 1em}.material-body blockquote{border-left:1px solid var(--red);padding-left:18px;margin:25px 0}.material-body cite{font-size:11px;font-style:normal;color:var(--muted)}.material-source{font-size:12px;line-height:2;color:var(--muted);padding:17px 0 0;border-top:1px solid #bf9c7440}.material-source strong{display:block;font-weight:400;font-size:10px;letter-spacing:2px;margin-bottom:8px}.school-report{margin-bottom:32px;padding-bottom:15px}.school-report .report-place{font-size:10px;letter-spacing:2px;color:var(--muted)}.school-report h3{font-size:28px;line-height:1.6;color:var(--red);margin:8px 0 15px}.school-report>p{font-size:16px;line-height:2;margin-bottom:18px}.school-report .source-figure{margin-top:20px}.source-link{display:inline-block;border-bottom:1px solid #be9d72;font-size:13px;padding:7px 0}.chapter-menu{display:grid;gap:15px}.chapter-menu button{display:flex;align-items:center;gap:14px;min-height:55px;text-align:left}.chapter-menu button>small{font-size:10px;color:var(--muted);width:23px}.chapter-menu .brush-mark{font-size:26px;min-width:190px}.menu-materials{display:flex;justify-content:space-between;gap:20px;margin-top:30px;border-top:1px solid #bf9c7440;padding-top:20px;font-size:12px;color:var(--muted)}.menu-materials button{min-height:44px}.archive-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px 22px}.archive-grid>button{display:grid;grid-template-columns:19px 60px 1fr;align-items:center;gap:10px;text-align:left;font-size:12px;min-height:86px;padding:10px 0;border-bottom:1px solid #bf9c7440}.archive-grid img{width:60px;height:60px;object-fit:contain}.archive-grid>button>span:first-child{font-size:10px;color:var(--muted)}.back-to-index{border-bottom:1px solid #bf9c7440;padding:12px 0;font-size:13px}.material-content>h3{font-size:26px;color:var(--red);margin:15px 0}.material-content>p,.material-content>ul{font-size:14px;line-height:2}.material-content>ul{padding-left:20px}.material-content a{border-bottom:1px solid #bf9c7450}
/* Full-width story art. These are transparent scenic and character layers,
   placed over the same paper; the document continues to scroll naturally. */
.scroll-story{max-width:900px;padding-top:46px}
.story-block{padding-top:16px;padding-bottom:22px}
.story-block:before{background:radial-gradient(ellipse at var(--wash-x,25%) var(--wash-y,60%),#d58b4810,transparent 66%)}
.trail-thread{display:none}
.scene{width:calc(100% + 90px);max-width:none;margin-left:-45px;margin-right:-45px;height:900px;overflow:visible}
.scene--portrait{height:940px}
.scene--walking{height:980px}
.scene--bridge{height:980px}
.scene--paired{height:1340px}
.scene--yanan{height:1040px}
.scene--qingji{height:900px}
.scene--battle{height:880px}
.scene--guoxin,.scene--people{height:820px}
.scene--modern{height:920px}
.scene--ending{height:900px}
.scene--march{height:780px}
.scene--reports{height:520px}
.scene--papers{height:440px}
.scene--book{height:640px}
.scene--ximeng{height:660px}
.scene--letter{height:440px}
.scenic-mass,.scenic-water{pointer-events:none;overflow:visible}
.scenic-mass .paint-shift,.scenic-water .paint-shift{width:100%;height:100%}
.scenic-mass img,.scenic-water img{width:100%;height:100%;max-width:none;object-fit:fill}
.scenic-mass img{filter:saturate(.94)}
.scenic-water img{filter:saturate(.9)}
.scene-caption{position:absolute;left:50%;width:84%;max-width:680px;transform:translateX(-50%);z-index:14;isolation:isolate;color:#493123;text-align:center;pointer-events:auto}
.scene-caption:before{content:'';position:absolute;top:-24px;right:-8%;bottom:-28px;left:-8%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 45% 48%,#f8eedbdc 17%,#f8eedbc7 42%,#f5ead452 65%,transparent 80%)}
.scene-caption>.passage,.scene-caption.passage{width:100%;max-width:none;margin:0;padding:3px 0;background:none}
.scene-caption .story-line{font-size:21px;line-height:2.05;letter-spacing:.4px;text-shadow:0 1px 3px #f8eedb99}
.scene-caption .story-title{margin-top:16px;margin-bottom:0}
.scene-caption .story-cite{margin-top:12px;font-size:11px;line-height:1.7}
.scene-caption .passage+.passage{margin-top:18px}
.scene-tag{top:2%;font-size:20px;z-index:15}
.scene-small-tag{z-index:15}
.scene .hotspot{z-index:22}
.hotspot>span{background:#f7edd9d9;color:#824b31;border-radius:50%;padding:2px 7px}
.passage{max-width:650px;margin-top:12px;margin-bottom:18px;padding-top:2px;padding-bottom:3px}
.story-block .scene+.passage{margin-top:4px}
.story-block .passage+.scene{margin-top:-5px}
.opening{padding-top:0;padding-bottom:0}
.opening .scene{margin-top:-10px}
.scroll-invitation{position:relative;z-index:20;margin:0 auto 4px;font-size:11px;letter-spacing:1px;color:#8a6248}
.walking-block,.river-block,.field-block{padding-top:0;padding-bottom:4px}
.river-block:after{content:none}
.name-block{padding-top:8px;padding-bottom:25px}
.honors-block{padding-top:18px;padding-bottom:24px}
.honors-art{height:350px;width:calc(100% + 70px);max-width:none;margin-left:-35px;margin-right:-35px}
.honors-block #honor-transition{margin-top:24px}
.chapter-opening{padding-top:33px;padding-bottom:8px}
.chapter-opening .story-title{margin-bottom:22px}
.route-block{padding-top:0;padding-bottom:20px}
.route-composition{max-width:500px;height:590px}
.truth-block{padding-top:5px;padding-bottom:15px}
.truth-block .scene--reports{margin-top:-18px}
.book-block,.ximeng-block,.letter-block,.yanan-block{padding-top:8px;padding-bottom:16px}
.yanan-block>.environment,.river-block>.environment,.field-block>.environment{pointer-events:none}
.modern-block{padding-top:16px;padding-bottom:8px}
.modern-block #relay-transition{margin-bottom:23px}
.relay-route-block{padding-top:15px;padding-bottom:20px}
.schools-block{padding-top:8px;padding-bottom:25px}
.ending-block{padding-top:24px;padding-bottom:12px}
.ending-block #always-on-road{margin-top:6px}
.archive-block{padding-top:22px;padding-bottom:60px}
.reader-header{max-width:900px;left:50%;right:auto;width:100%;transform:translateX(-50%);height:59px;padding:10px 22px;background:linear-gradient(#f5ead4ed,#f5ead4a8 68%,#f5ead400)}
@media(min-width:1100px){body:before,body:after{display:none}}
@media(max-width:680px){
  .scroll-story{padding-top:43px}
  .story-block{padding:12px 16px 20px}
  .scene{width:calc(100% + 32px);max-width:none;margin-left:-16px;margin-right:-16px;height:700px}
  .scene--portrait{height:760px}
  .scene--walking{height:780px}
  .scene--bridge{height:780px}
  .scene--paired{height:1100px}
  .scene--yanan{height:820px}
  .scene--qingji{height:700px}
  .scene--battle{height:680px}
  .scene--guoxin,.scene--people{height:640px}
  .scene--modern{height:720px}
  .scene--ending{height:700px}
  .scene--march{height:620px}
  .scene--reports{height:400px}
  .scene--papers{height:330px}
  .scene--book{height:500px}
  .scene--ximeng{height:520px}
  .scene--letter{height:330px}
  .scene-caption{width:84%;max-width:490px}
  .scene-caption:before{top:-21px;right:-8%;bottom:-24px;left:-8%}
  .scene-caption>.passage,.scene-caption.passage{padding:2px 0;margin:0}
  .scene-caption .story-line{font-size:18px;line-height:2.1;letter-spacing:0}
  .scene-caption .story-cite{font-size:10px;line-height:1.8}
  .scene-caption .passage+.passage{margin-top:14px}
  .scene-tag{font-size:17px}
  .scene-small-tag{font-size:14px}
  .passage{margin:10px auto 17px;padding:2px 5px}
  .story-line{font-size:18px;line-height:2.05}
  .opening{padding-top:0;padding-bottom:0}
  .opening .scene{margin-top:-6px}
  .walking-block,.river-block,.field-block{padding-top:0;padding-bottom:3px}
  .scroll-invitation{margin-top:0;margin-bottom:0;font-size:10px}
  .name-block{padding-top:5px;padding-bottom:18px}
  .honors-block{padding-top:14px;padding-bottom:20px}
  .honors-art{height:255px;width:calc(100% + 32px);margin-left:-16px;margin-right:-16px}
  .honors-block .passage{margin-top:10px;margin-bottom:12px}
  .honors-block #honor-transition{margin-top:20px}
  .chapter-opening{padding-top:29px;padding-bottom:4px}
  .chapter-opening .story-title{margin-bottom:20px}
  .route-block{padding-top:0;padding-bottom:18px}
  .route-composition{height:480px;max-width:375px}
  .truth-block{padding-top:4px;padding-bottom:12px}
  .truth-block .scene--reports{margin-top:-12px}
  .book-block,.ximeng-block,.letter-block,.yanan-block{padding-top:5px;padding-bottom:12px}
  .modern-block{padding-top:12px;padding-bottom:6px}
  .modern-block #relay-transition{margin-bottom:20px}
  .relay-route-block{padding-top:12px;padding-bottom:18px}
  .schools-block{padding-top:6px;padding-bottom:22px}
  .ending-block{padding-top:20px;padding-bottom:8px}
  .ending-block #always-on-road{margin-top:4px}
  .archive-block{padding-top:18px;padding-bottom:45px}
  .reader-header{left:0;right:0;transform:none;width:100%;height:54px;padding:8px 17px}
}
@media(prefers-reduced-motion:reduce){.scene-caption .reveal.is-waiting{opacity:1!important;translate:0 0!important}}

.scene--book .book-object{left:37%;top:2%;width:54%;height:50%;font-size:52px}
.scene--book .notebook-label{left:4%;top:23%;font-size:23px}
.scene--papers .paper-caption{left:16%;top:18%;width:65%;font-size:35px}
.scene--papers .scene-tag,.scene--bridge .scene-tag{top:0}
.scene--letter .letter-object-label{left:18%;top:16%;width:63%;font-size:32px}
.scene--paired .paired-one{left:45%;top:8%}
.scene--paired .paired-two{left:5%;top:91%}
.scene--people .paper-object-label{left:9%;top:18%;font-size:49px}
.scene--reports .report-headline strong{font-size:32px}
.scene--ending .scene-caption .story-line{font-family:var(--hand);font-size:33px;line-height:2.1}
.camera-shutter{position:fixed;top:0;right:0;bottom:0;left:0;z-index:98;pointer-events:none;background:#fff9e8;opacity:0}
.camera-shutter.is-active{animation:shutter-flash .25s ease-out}
@keyframes shutter-flash{0%{opacity:0}24%{opacity:.8}100%{opacity:0}}
@media(max-width:680px){
 .scene{height:var(--mobile-frame-height,700px)}
 .scene--reports{height:400px}
 .scene--book .book-object{font-size:39px;border-left-width:8px}
 .scene--book .notebook-label{font-size:18px}
 .scene--papers .paper-caption{font-size:26px}
 .scene--letter .letter-object-label{font-size:25px}
 .scene--people .paper-object-label{font-size:37px}
 .scene--reports .report-headline strong{font-size:25px}
 .scene--ending .scene-caption .story-line{font-size:26px}
 .scene--ending .scene-caption{width:92%}
}
@media(prefers-reduced-motion:reduce){.camera-shutter.is-active{animation:none}}
/* Feather each independent terrain layer into the following scene. */
.scenic-mass .paint-shift{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 7%,#000 92%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 7%,#000 92%,transparent 100%)}
.scenic-water .paint-shift{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 5%,#000 93%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 5%,#000 93%,transparent 100%)}
.scroll-invitation{width:fit-content;padding:3px 12px;color:#775039;background:radial-gradient(ellipse,#f5ead4ed 28%,transparent 76%)}

@media(min-width:681px){.scene--letter{height:850px}.scene--papers{height:680px}}
/* Short introduction: name first, then the portrait. */
.intro-departure{position:relative;min-height:285px;isolation:isolate}
.intro-words{position:relative;z-index:10;padding:18px 14px 4px}
.intro-words .passage{background:radial-gradient(ellipse,#f5ead4e6 20%,transparent 76%)}
.intro-words #departure{margin:0 auto 12px}
.intro-words #his-name{margin:0 auto}
.intro-words #his-name .story-title{font-size:43px;margin-top:6px}
.opening .scene--portrait{height:550px;margin-top:-6px}
.scene--papers .paper-caption{left:15%;top:18%;width:68%;font-size:29px;white-space:nowrap}
.scene--reports{height:540px}
.report-document{position:absolute;z-index:5;width:76%;height:46%;padding:10% 8% 5%;color:#4d382b;background:#fff5df;border:1px solid #bd977367;box-shadow:3px 6px 0 #c99d6c22;clip-path:polygon(1% 1%,98% 0,100% 98%,0 100%);font-family:var(--body)}
.report-document:before{content:'';position:absolute;top:4%;right:4%;bottom:5%;left:4%;border:1px solid #be99704d;pointer-events:none}
.report-document-one{left:-1%;top:4%;transform:rotate(-5deg)}
.report-document-two{right:-1%;top:47%;transform:rotate(4deg)}
.report-document>small{position:absolute;left:8%;right:8%;top:11%;font-size:13px;text-align:center;white-space:nowrap}
.report-document h3{position:relative;margin:3% auto 0;font:400 33px/1.55 var(--hand);text-align:center}
.report-document h3 span{display:block;white-space:nowrap;word-break:keep-all}
.report-document i{display:block;width:90%;height:23%;margin:9% auto 0;background:repeating-linear-gradient(to bottom,#a8895d44 0 1px,transparent 1px 6px);opacity:.5}
.scene--book .book-object{left:24%;top:4%;width:62%;height:53%;font-size:49px}
.scene--book .book-object>span{display:block;white-space:nowrap;line-height:1.65}
.scene--book .book-object small{font-size:22px;white-space:nowrap}
.letter-object{position:absolute;left:10%;top:3%;width:80%;height:34%;z-index:4;padding:9% 5%;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#fff6e4;border:1px solid #bb946766;box-shadow:4px 7px 0 #a77a4433;transform:rotate(-4deg);font-family:var(--hand);color:#58402d}
.letter-object span{font-size:35px;line-height:1.65;white-space:nowrap}
.letter-object small{font-size:28px;margin-top:16px}
.letter-object i{width:85%;height:25%;position:absolute;bottom:10%;left:8%;border-bottom:1px solid #b28b5755;border-top:1px solid #b28b5740}
.daily-object{position:absolute;left:7%;top:2%;width:86%;height:48%;z-index:5;border:1px solid #b7946f77;background:#fff6e3;box-shadow:5px 7px 0 #b28c5e22;transform:rotate(-5deg);padding:10% 7%;overflow:hidden}
.daily-object>span{display:block;font:400 53px/1.2 var(--hand);color:#734126;white-space:nowrap;padding-bottom:6%;border-bottom:2px solid #a88a6555}
.daily-object>div{margin-top:5%;height:60%;background:repeating-linear-gradient(to right,transparent 0 24%,#8e765433 24% 24.5%,transparent 24.5% 25%),repeating-linear-gradient(to bottom,#9c835344 0 1px,transparent 1px 7px)}
.spirit-continuation{height:90px;max-width:600px;margin:8px auto 0}
.spirit-continuation svg{width:100%;height:100%}
.spirit-continuation path{fill:none;stroke:#bc5d39;stroke-width:1.3;stroke-dasharray:6 8;opacity:.5}
.school-slide{padding-top:26px;background:radial-gradient(ellipse at 50% 20%,#fff5df8a,transparent 75%)}
.school-title{margin-top:0}
.material-header{align-items:flex-start}
.material-header h2{font-family:var(--hand);line-height:1.6;overflow-wrap:anywhere}
.source-figure{padding-bottom:20px;margin-bottom:22px}
.source-figure:only-child{margin:0;border:0;padding:0}
.source-figure figcaption{margin-top:14px}
.source-figure figcaption strong{font-size:15px;line-height:1.8;margin-bottom:5px}
.source-figure figcaption p{font-size:14px;line-height:1.9}
.source-figure figcaption small{margin-top:7px;font-size:12px}
.archive-grid{grid-template-columns:1fr 1fr;gap:0 24px}
.archive-grid>button{display:block;min-height:52px;padding:12px 3px;line-height:1.8;font-size:14px}
.chapter-menu button{justify-content:center}
@media(max-width:680px){
 .intro-departure{min-height:255px}
 .intro-words{padding:8px 6px 0}
 .intro-words #departure .story-line{font-size:18px;line-height:1.95}
 .intro-words #his-name .story-line{font-size:17px}
 .intro-words #his-name .story-title{font-size:39px;line-height:1.2}
 .opening .scene--portrait{height:450px}
 .scene--reports{height:480px}
 .report-document{width:79%;height:44%;padding:11% 7% 4%}
 .report-document>small{top:12%;font-size:10px}
 .report-document h3{font-size:24px;line-height:1.55;margin-top:5%}
 .report-document i{margin-top:10%}
 .scene--book .book-object{font-size:37px}
 .scene--book .book-object small{font-size:18px}
 .scene--papers .paper-caption{font-size:23px}
 .letter-object span{font-size:27px}
 .letter-object small{font-size:23px;margin-top:12px}
 .daily-object>span{font-size:39px}
 .ending-block{padding-top:12px}
 .ending-block #spirit-words{margin-bottom:4px}
}
@media(max-width:350px){.report-document h3{font-size:21px}.report-document>small{font-size:9px}.letter-object span{font-size:23px}.scene--papers .paper-caption{font-size:20px}}
.scene--reports{height:560px}
.report-document{height:41%}
.report-document-one{top:13%}
.report-document-two{top:56%}
.scene--book .scene-tag{display:none}
.intro-departure{background:radial-gradient(ellipse at 30% 65%,#d88e4a0d,transparent 65%)}
@media(max-width:680px){.scene--reports{height:500px}.report-document{height:41%}}
/* Finish the short verbal reveal before the portrait enters. */
#opening #departure .story-line{animation:opening-appear .5s ease both;animation-delay:var(--delay,0s)}
#opening #his-name .story-line{animation:opening-appear .5s ease .7s both}
#opening #his-name .story-title{animation:opening-appear .6s ease 1s both}
#fan-portrait .paint-layer{animation:opening-appear .8s ease 1.6s both}
#fan-portrait .hotspot{animation:opening-appear .5s ease 2.1s both}
@keyframes opening-appear{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){#opening #departure .story-line,#opening #his-name .story-line,#opening #his-name .story-title,#fan-portrait .paint-layer,#fan-portrait .hotspot{animation:none!important}}

/* A small Song-style narrator, placed in the quiet areas of each illustration. */
@font-face{font-family:StorySerif;src:url('assets/fonts/story-serif.woff2?v=c5aa2f16b2') format('woff2');font-weight:400 500;font-style:normal;font-display:swap}
@font-face{font-family:StorySerif;src:url('assets/fonts/story-serif-bold.woff2?v=61b8302fbe') format('woff2');font-weight:600 900;font-style:normal;font-display:swap}
:root{--body:StorySerif,'Noto Serif CJK SC','Source Han Serif SC','Songti SC','STSong','SimSun',serif;--ink:#3d3028;--muted:#7c6754}
body{font-family:var(--body);font-size:18px;font-weight:500;line-height:1.8;font-synthesis:weight}
.passage{max-width:640px;padding:3px 4px;margin:11px auto 18px;background:none}
.story-line,.scene-caption .story-line{font-family:var(--body);font-size:20px;font-weight:500;line-height:1.85;letter-spacing:0;text-shadow:none;overflow-wrap:break-word}
.story-line strong,.story-line em{font-family:var(--body);font-style:normal;font-weight:700;color:#a83f27;font-size:1.2em}
.story-title{font-size:35px;line-height:1.4;margin:14px auto 9px}
.story-title .brush-mark{padding:5px 23px 8px}
.brush-mark{font-weight:400;letter-spacing:.035em;text-shadow:none}
.scene-caption{width:82%;max-width:610px}
.scene-caption:before{top:-15px;right:-6%;bottom:-17px;left:-6%;background:radial-gradient(ellipse,#f6ecd8ed 16%,#f6ecd8a1 53%,transparent 79%)}
.scene-caption .passage+.passage{margin-top:14px}
.scene-caption.align-left{left:8%;right:auto;transform:none;text-align:left;width:72%}
.scene-caption.align-right{left:20%;right:auto;transform:none;text-align:left;width:72%}
.scene-caption.align-left .passage,.scene-caption.align-right .passage{text-align:inherit}
.passage.align-left{text-align:left;margin-left:4%;margin-right:12%}
.passage.align-right{text-align:left;margin-left:18%;margin-right:2%}
.scene-caption.narrow{width:58%}
.scene-caption .story-title{text-align:inherit;font-size:29px}
.scene-tag{font-size:19px;top:2%;line-height:1.3}
.scene-small-tag{font-size:16px}
.scene-tag .brush-mark,.scene-small-tag .brush-mark{padding:4px 19px 7px}
.story-cite,.scene-caption .story-cite{font-family:var(--body);font-size:12px;font-weight:500;line-height:1.65;letter-spacing:0}
.reader-brand small,.menu-button{font-family:var(--body);font-weight:500;letter-spacing:.12em}
.reader-header{height:53px}
.scroll-story{padding-top:45px}
.story-block{padding-top:10px;padding-bottom:16px}
.chapter-opening{padding-top:23px;padding-bottom:2px}
.chapter-opening .story-title{margin-bottom:16px}
.chapter-opening .passage:last-child{margin-bottom:6px}
.intro-departure{min-height:237px}
.intro-words{padding-top:9px}
.intro-words #departure .story-line{font-size:20px;line-height:1.85}
.intro-words #his-name .story-line{font-size:18px}
.intro-words #his-name .story-title{font-size:39px;margin-top:5px}
.book-block #reporting-method,.ximeng-block>.block-content>.passage,.yanan-block>.block-content>.passage{margin-top:4px;margin-bottom:14px}
.school-slide>p{font-size:18px;line-height:1.8}
.school-title{font-size:28px}
.school-slide>small{font-size:12px;line-height:1.7;min-height:0}
.school-open{font-size:12px}
.schools-control{margin-top:0;gap:19px}
.schools-block{padding-bottom:6px}
.ending-block{padding-top:12px}
.ending-block #always-on-road .story-title{font-size:34px}
.ending-block #always-on-road .story-line{font-size:20px}
.archive-block{padding-top:8px}

/* Documents stay as deliberately composed paper objects inside the story. */
.report-document{padding:10% 7% 4%;background:#fff3dc;border-color:#9a775847;box-shadow:5px 7px 0 #b3916530}
.report-document h3{font-family:var(--body);font-size:30px;font-weight:700;line-height:1.5}
.report-document>small{font-family:var(--body);font-size:12px;font-weight:500}
.report-document h3 span{white-space:nowrap}
.report-document i{opacity:.45}
.scene--book .book-object{font-size:43px;line-height:1.55}
.scene--book .book-object small{font-size:20px;margin-top:12px}
.paper-caption{font-family:var(--hand)}
#dispatch .paper-caption{font-size:40px;line-height:1.2;letter-spacing:.22em;white-space:nowrap}

/* The historical pair belongs to the period it documents, in a compact collage. */
.history-pair{position:absolute;inset:0;z-index:8;width:100%;height:100%;margin:0;padding:0;pointer-events:none}
.history-photo{position:absolute;left:10%;width:80%;margin:0;padding:9px 9px 11px;background:#fff6e3;box-shadow:2px 5px 0 #a5794f29;border:1px solid #b7977138;transform:rotate(-3deg);pointer-events:auto;display:flex;flex-direction:column;align-items:center}
.history-photo-talk{top:10%;height:31%}
.history-photo-work{top:70%;height:27%;left:17%;width:74%;transform:rotate(3deg)}
.history-photo img{width:100%;height:calc(100% - 44px);object-fit:contain}
.history-photo>span{display:block;flex:0 0 auto;font-family:var(--body);font-size:13px;font-weight:500;line-height:1.6;margin-top:7px;text-align:center}
.history-photo>small{display:block;flex:0 0 auto;font-family:var(--body);font-size:10px;line-height:1.7;color:#925535;text-align:center}
.history-photo .photo-note{font-size:11px;color:var(--muted);display:block}
.history-pair+.passage{margin-top:7px}
#news-building .scene-tag{font-size:20px}

/* A letter is an object to open, rather than an empty newspaper facsimile. */
.envelope-trigger{position:absolute;z-index:17;left:14%;top:5%;width:72%;height:34%;min-height:150px;max-height:260px;overflow:visible;isolation:isolate;transform:rotate(-4deg);filter:drop-shadow(4px 6px 2px #8f694733);border:0;outline-offset:7px}
.envelope-trigger:before{content:'';position:absolute;inset:0;background:#d9ba8d;border:1px solid #98724d70;z-index:0}
.envelope-preview{position:absolute;left:14%;top:0;width:72%;height:86%;padding:7px;background:#fff7e6;transform:translateY(-8%) rotate(3deg);box-shadow:0 -2px 1px #7c614017;z-index:1;overflow:hidden;transition:transform .45s ease}
.envelope-preview img{width:100%;height:100%;object-fit:cover;object-position:top center;filter:sepia(.12)}
.envelope-front{position:absolute;inset:0;z-index:4;background:linear-gradient(17deg,#e7cda7,#f5dfbc);border:1px solid #9f7d5766;clip-path:polygon(0 0,50% 57%,100% 0,100% 100%,0 100%)}
.envelope-front:before,.envelope-front:after{content:'';position:absolute;bottom:0;width:61%;height:100%;border-top:1px solid #a7805566;background:#ecd3ae}
.envelope-front:before{left:-5%;transform:skewY(32deg);transform-origin:0 100%}
.envelope-front:after{right:-5%;transform:skewY(-32deg);transform-origin:100% 100%}
.envelope-front>strong{position:absolute;z-index:8;left:8%;right:8%;top:54%;font:500 21px/1.5 var(--body);letter-spacing:.08em;text-align:center;color:#553b29;white-space:nowrap}
.envelope-front>small{position:absolute;z-index:8;left:8%;right:8%;top:77%;font:500 13px/1.5 var(--body);text-align:center;color:#7b5b3e;white-space:nowrap}
.envelope-flap{position:absolute;z-index:5;inset:0;background:linear-gradient(#f3ddba,#daba90);clip-path:polygon(0 0,100% 0,50% 60%);filter:drop-shadow(0 2px 0 #9b765a44);transform-origin:top center;transition:transform .45s ease}
.envelope-trigger .envelope-label{position:absolute;left:8%;right:8%;bottom:10%;z-index:8;display:block;text-align:center;font:500 19px/1.5 var(--body);letter-spacing:.05em;color:#5b412d}
.envelope-trigger .envelope-hint{position:absolute;bottom:-34px;left:0;right:0;font:500 12px/1.6 var(--body);letter-spacing:.1em;color:#8d5534;text-align:center;white-space:nowrap}
.envelope-trigger:hover .envelope-preview,.envelope-trigger:focus-visible .envelope-preview{transform:translateY(-15%) rotate(3deg)}

/* An illustrated speaker delivers the spirit quote through one speech bubble. */
.speaker-composition{position:relative;width:calc(100% + 40px);max-width:850px;height:570px;margin:0 -20px 0;isolation:isolate}
.speaker-art{position:absolute;z-index:5;left:-3%;bottom:0;width:56%;height:76%;pointer-events:none;object-fit:contain;object-position:left bottom}
.speaker-art img{width:100%;height:100%;object-fit:contain;object-position:left bottom}
.speech-bubble{position:absolute;z-index:10;right:4%;top:3%;width:70%;padding:25px 27px 23px;background:#fff7e8;border:2px solid #5b4533;border-radius:44% 46% 36% 30% / 17% 20% 16% 18%;box-shadow:4px 6px 0 #bc8b5133;text-align:left}
.speech-bubble:before{content:'';position:absolute;left:25%;bottom:-29px;width:31px;height:36px;background:#fff7e8;clip-path:polygon(0 0,100% 0,0 100%);filter:drop-shadow(1px 1px 0 #5b4533)}
.speech-bubble .passage,.speech-bubble #spirit-words{margin:0;padding:0;background:none;text-align:left}
.speech-bubble #spirit-words .story-line,.speech-bubble .story-line{font:600 24px/1.9 var(--body);letter-spacing:0}
.speech-bubble .story-cite{font-family:var(--body);font-size:12px;line-height:1.7;color:#7d5d45;margin-top:11px}
.speaker-name{position:absolute;z-index:11;left:5%;bottom:1%;width:49%;font-family:var(--body);text-align:center;font-size:15px;line-height:1.6;font-weight:600;color:#513b2c;background:radial-gradient(ellipse,#f5ead4f0 37%,transparent 80%)}
.speaker-name small{display:block;font-size:12px;font-weight:500}
.speaker-credit{position:absolute;z-index:11;left:5%;bottom:1%;width:49%;font-family:var(--body);text-align:center;font-size:15px;line-height:1.6;font-weight:600;color:#513b2c;background:radial-gradient(ellipse,#f5ead4f0 37%,transparent 80%)}
.speaker-credit>strong{font-weight:700}
.speaker-credit>span{display:block;font-size:12px;font-weight:500}
.speaker-composition+.passage{margin-top:4px}

@media(max-width:680px){
 body{font-size:17px;line-height:1.8}
 .reader-header{height:49px;padding-top:5px;padding-bottom:5px}
 .reader-brand small{font-size:10px;letter-spacing:.1em}
 .menu-button{font-size:11px;letter-spacing:.08em}
 .scroll-story{padding-top:43px}
 .story-block{padding-top:8px;padding-bottom:12px}
 .passage{margin:9px auto 15px;padding:2px 3px;max-width:100%}
 .story-line,.scene-caption .story-line{font-size:17px;line-height:1.85;letter-spacing:0;font-weight:500}
 .story-title{font-size:28px;line-height:1.4;margin:12px auto 7px}
 .story-title .brush-mark{padding:5px 19px 7px}
 .scene-tag{font-size:16px}
 .scene-small-tag{font-size:13px}
 .scene-tag .brush-mark,.scene-small-tag .brush-mark{padding:4px 15px 6px}
 .scene-caption{width:84%;max-width:none}
 .scene-caption.align-left{left:8%;width:76%;right:auto;transform:none}
 .scene-caption.align-right{left:17%;width:76%;right:auto;transform:none}
 .scene-caption.narrow{width:62%}
 .scene-caption .passage+.passage{margin-top:11px}
 .scene-caption .story-title{font-size:26px}
 .story-cite,.scene-caption .story-cite{font-size:10px;line-height:1.65}
 .intro-departure{min-height:218px}
 .intro-words{padding:8px 6px 0}
 .intro-words #departure .story-line{font-size:17px;line-height:1.85}
 .intro-words #his-name .story-line{font-size:16px}
 .intro-words #his-name .story-title{font-size:34px;margin-top:5px}
 .chapter-opening{padding-top:22px;padding-bottom:3px}
 .chapter-opening .story-title{margin-bottom:14px}
 .route-block{padding-top:0;padding-bottom:12px}
 .figure-note{font-size:10px;margin-top:9px}
 .hotspot>span{font-size:9px;letter-spacing:0}
 .report-document{padding:11% 7% 4%}
 .report-document h3{font-size:22px;font-weight:700;line-height:1.5}
 .report-document>small{font-size:9px}
 .scene--book .book-object{font-size:31px;border-left-width:6px}
 .scene--book .book-object small{font-size:16px;margin-top:10px}
 #dispatch .paper-caption{font-size:30px;letter-spacing:.18em}
 .school-title{font-size:24px}
 .school-slide>p{font-size:16px;line-height:1.8;margin-top:12px}
 .school-slide>small{font-size:11px}
 .school-open{font-size:11px;margin-top:9px}
 .school-slide{padding-top:16px;padding-bottom:10px}
 .school-dots{gap:10px}
 .schools-control{gap:18px}
 .ending-block #always-on-road .story-title{font-size:29px}
 .ending-block #always-on-road .story-line{font-size:18px}
 .history-photo{padding:6px 6px 8px}
 .history-photo img{height:calc(100% - 36px)}
 .history-photo>span{font-size:11px;line-height:1.6;margin-top:5px}
 .history-photo>small{font-size:9px;line-height:1.5}
 .history-photo .photo-note{font-size:9px}
 #news-building .scene-tag{font-size:17px}
 .envelope-trigger{left:12%;width:76%;min-height:135px;max-height:190px}
 .envelope-front>strong{font-size:17px}
 .envelope-front>small{font-size:11px}
 .envelope-trigger .envelope-label{font-size:16px;bottom:11%}
 .envelope-trigger .envelope-hint{font-size:11px;bottom:-30px}
 .speaker-composition{width:calc(100% + 32px);height:440px;margin-left:-16px;margin-right:-16px}
 .speaker-art{left:-6%;width:60%;height:72%}
 .speech-bubble{top:2%;right:4%;width:71%;padding:19px 18px 17px;border-width:1.5px}
 .speech-bubble #spirit-words .story-line,.speech-bubble .story-line{font-size:20px;line-height:1.8;font-weight:600}
 .speech-bubble .story-cite{font-size:10px;margin-top:9px}
 .speaker-name{left:0;width:52%;font-size:13px;bottom:0}
 .speaker-name small{font-size:10px}
 .speaker-credit{left:0;width:52%;font-size:13px;bottom:0}
 .speaker-credit>span{font-size:10px}
}
@media(max-width:350px){
 .story-line,.scene-caption .story-line{font-size:16px;line-height:1.85}
 .scene-caption.align-left,.scene-caption.align-right{width:81%}
 .scene-caption.narrow{width:68%}
 .story-title{font-size:26px}
 .intro-departure{min-height:210px}
 .intro-words #departure .story-line{font-size:16px}
 .intro-words #his-name .story-title{font-size:32px}
 .report-document h3{font-size:20px}
 .report-document>small{font-size:8px}
 .scene--book .book-object{font-size:28px}
 #dispatch .paper-caption{font-size:27px}
 .speech-bubble{width:73%;right:3%;padding:17px 15px}
 .speech-bubble #spirit-words .story-line,.speech-bubble .story-line{font-size:18px}
 .speaker-composition{height:410px}
 .school-title{font-size:22px}
 .school-slide>p{font-size:15px}
 .school-dots{gap:8px}
 .schools-control{gap:13px}
}
@media(prefers-reduced-motion:reduce){.envelope-preview,.envelope-flap{transition:none!important}}
/* Geometry that belongs to the revised storyboard. */
.mirror-left .paint-shift{transform:scaleX(-1)}
#field-notes .paired-one{left:3%;top:5%}
#field-notes .paired-two{left:5%;top:73%}
.scene--book .book-object{left:49%;top:4%;width:42%;height:48%;font-size:42px}
.scene--book .book-object small{font-size:18px}
#dispatch .newspaper-masthead{left:14%;top:13%;width:68%;font-size:43px;text-align:center;transform:rotate(-6deg)}
#readers-scene{height:640px}
.story-line.is-emphasis{font-size:1.25em;font-weight:700;color:#9c452b}
.newsroom-working{--delay:.45s}
#letter .envelope-trigger{top:6%;height:49%;min-height:0;max-height:none}
#letter .scene-tag{top:0}
#letter .envelope-trigger{top:15%;height:40%}
@media(max-width:680px){
 #readers-scene{height:var(--mobile-frame-height,370px)}
 .scene--book .book-object{font-size:30px}
 .scene--book .book-object small{font-size:15px}
 #dispatch .newspaper-masthead{font-size:35px}
 .story-line.is-emphasis{font-size:21px}
}
@media(max-width:350px){#dispatch .newspaper-masthead{font-size:31px}.story-line.is-emphasis{font-size:20px}}
/* Reader copy grows naturally on narrow phones, without overlapping the next scene. */
#readers-scene{height:auto;min-height:0;padding-top:min(62vw,460px);padding-bottom:18px}
#readers-scene>.paint-layer{top:0!important;height:min(62vw,460px)!important}
#readers-scene>.scene-caption{position:relative;top:auto!important;left:8%!important;width:84%!important;transform:none}
#readers-scene .passage{margin:0}
/* Bring the speaking figure close to the bubble rather than below an empty panel. */
.speaker-art{width:76%;height:82%;bottom:30px}
.speaker-credit{left:7%;bottom:-2px;width:86%;text-align:left;background:none}
.speaker-credit>span{font-size:12px}
@media(max-width:680px){.speaker-art{width:80%;height:82%;bottom:30px}.speaker-credit{left:7%;bottom:-2px;width:86%}.speaker-credit>span{font-size:11px}}

/* Scene-specific paper compositions, with enough space for the sourced narrative. */
.opening-ambience{position:absolute;inset:-45px -45px -10px;z-index:0;pointer-events:none;overflow:visible}
.opening-ambience .paint-layer{height:100%!important;top:0!important}
.opening-ambience img{object-fit:fill}
.intro-departure,.opening .scene{z-index:2}
.intro-words .passage{background:radial-gradient(ellipse,#f5ead4ed 12%,#f5ead4bd 50%,transparent 79%)}
.opening .scene--portrait{height:560px}
#fan-portrait>.paint-layer[data-stage="foreground"]{filter:drop-shadow(0 3px 1px #7f5c3522)}
.newspaper-print{position:absolute;left:9%;top:25%;width:83%;height:58%;z-index:6;transform:rotate(-7deg);pointer-events:none;overflow:hidden;clip-path:polygon(0 5%,96% 0,100% 92%,5% 100%);opacity:.5;mix-blend-mode:multiply;filter:sepia(.8) blur(.35px)}
.newspaper-print img{width:100%;height:100%;object-fit:cover;object-position:left 66%;opacity:.7}
.newspaper-print:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 32%,#f5ead441 48%,transparent 65%)}
#field-notes .paired-two{left:5%;top:74%}
#field-notes .scene-caption .story-line{line-height:1.8}
#field-notes .scene-caption:nth-last-of-type(2):before{opacity:.85}
.reading-block{padding-top:0;padding-bottom:4px}
.reading-block>.block-content>.passage{margin:8px auto 5px}
#readers-scene{height:min(61vw,470px);padding:0;margin-top:0}
#readers-scene>.paint-layer{top:0!important;height:100%!important}
.ejina-photo{position:absolute;left:34%;top:43%;width:61%;height:37%;z-index:10;display:flex;flex-direction:column;align-items:center;padding:10px 10px 12px;background:#fff3dc;border:1px solid #a8876055;box-shadow:4px 7px 0 #aa81512e;transform:rotate(4deg);font-family:var(--body)}
.ejina-photo img{width:100%;height:calc(100% - 48px);object-fit:contain;background:#e3d0aa66}
.ejina-photo>span{font-size:13px;line-height:1.7;margin-top:6px}
.ejina-photo>small{font-size:11px;line-height:1.6;color:#a24e2c}
#ximeng-scene:before{content:'西蒙 · 额济纳';position:absolute;left:20%;top:0;z-index:12;font:400 25px/1.4 var(--hand);color:#9c482d}
.speaker-composition{height:660px;margin-bottom:10px}
.speech-bubble{width:71%;right:4%;top:1%}
.speaker-art{width:84%;height:83%;bottom:38px;left:-5%;z-index:5}
.spirit-narration{position:absolute;right:3%;top:30%;width:44%;z-index:9}
.spirit-narration .passage{text-align:left;margin:0;padding:6px 4px;background:radial-gradient(ellipse,#f5ead4ed 15%,#f5ead4bf 55%,transparent 83%)}
.spirit-narration .story-line{font-size:20px;line-height:1.8}
.speaker-credit{left:3%;bottom:5%;width:67%;padding:9px 14px 11px;z-index:12;color:#3f2c1d;background:linear-gradient(90deg,#f9edd8f0,#fff3dfde 80%,#fff3df00);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);border-left:2px solid #b95b34;box-shadow:0 4px 12px #6d45251c;text-shadow:0 1px 2px #fff4df}
.speaker-credit strong{font-size:20px;letter-spacing:.08em}
.speaker-credit>span{font-size:13px;line-height:1.8;white-space:nowrap}
@media(max-width:680px){
 .opening-ambience{inset:-36px -16px -4px}
 .opening .scene--portrait{height:450px}
 .newspaper-print{left:10%;top:26%;width:82%;height:55%}
 #readers-scene{height:61vw;max-height:290px}
 #field-notes .scene-caption .story-line{font-size:17px}
 .ejina-photo{padding:7px 7px 9px}
 .ejina-photo>span{font-size:11px}
 .ejina-photo>small{font-size:9px}
 .ejina-photo img{height:calc(100% - 42px)}
 #ximeng-scene:before{font-size:21px}
 .speaker-composition{height:550px}
 .spirit-narration{top:30%;right:3%;width:44%}
 .spirit-narration .story-line{font-size:17px;line-height:1.8}
 .speaker-credit{left:3%;bottom:5%;width:75%;padding:8px 12px 10px}
 .speaker-credit strong{font-size:17px}
 .speaker-credit>span{font-size:11px}
}
@media(max-width:350px){
 #field-notes .scene-caption .story-line{font-size:16px}
 .speaker-composition{height:535px}
 .spirit-narration .story-line{font-size:16px}
 .speaker-credit{width:85%;bottom:4%}
 .speaker-credit strong{font-size:16px}
 .speaker-credit>span{font-size:11px}
}
#dispatch .newspaper-masthead{top:18%}
.spirit-narration{width:46.5%}
@media(max-width:680px){.spirit-narration{width:46.5%}}
.ejina-photo{height:auto;left:28%;width:68%}
.ejina-photo img{height:auto;max-height:none;object-fit:contain}

/* A route read through a real historical map and small illustrated field notes. */
.document-route-map{position:relative;max-width:820px;margin:3px auto 10px;padding:6px 0 0;isolation:isolate}
.map-anchor{position:absolute;top:45%;left:0;scroll-margin-top:65px}.map-anchor-north{top:77%}
.map-heading{text-align:center;position:relative;z-index:4;margin:4px auto 14px;color:#67442c}
.map-heading small{display:block;font:500 12px/1.6 var(--body);letter-spacing:.12em;color:#a05b36}
.map-heading h3{font:600 27px/1.45 var(--body);margin:3px auto 8px;letter-spacing:.025em}
.map-heading-rule{display:block;width:74px;margin:0 auto;height:1px;background:#ae784d;transform:rotate(-2deg);position:relative}
.map-heading-rule:after{content:'';position:absolute;left:32px;top:-2px;width:5px;height:5px;transform:rotate(45deg);background:#ae784d}
.historic-map-composition{display:grid;grid-template-columns:minmax(0,1fr) 180px;gap:25px;align-items:center;position:relative}
.historic-map-source{display:block;position:relative;width:100%;padding:11px 9px 13px;background:#fbf0d8;box-shadow:3px 7px 0 #aa805233;transform:rotate(-1deg);border:1px solid #b69a743d;isolation:isolate}
.historic-map-source:before{content:'';position:absolute;inset:5px;border:1px solid #b7956940;pointer-events:none;z-index:4}
.historic-map-source img{width:100%;height:auto;filter:sepia(.65) contrast(.83);mix-blend-mode:multiply}
.map-expand{display:flex;align-items:center;justify-content:center;gap:8px;font:600 14px/1.5 var(--body);color:#973f23;background:#fff1d6f5;position:absolute;bottom:30px;left:50%;transform:translateX(-50%);white-space:nowrap;border:1px solid #b66d3e99;border-radius:28px;padding:8px 16px;box-shadow:0 3px 0 #9a65372b}
.map-expand i{font:400 26px/1 Georgia,serif;display:block;animation:map-invite 2.8s ease-in-out infinite}
.historic-map-margin{display:flex;flex-direction:column;gap:34px;padding:8px 0;position:relative;color:#6a4c33}
.map-margin-note{padding:0 0 0 14px;border-left:1px solid #b67b4b55;position:relative}
.map-note-number{font:400 23px/1 var(--hand);color:#b55a35;display:block;margin-bottom:10px}
.map-margin-note strong{font:600 16px/1.6 var(--body);display:block}
.map-margin-note p{font:500 13px/1.85 var(--body);margin-top:5px;color:#82664e}
.map-line-legend{display:inline-block;vertical-align:middle;width:32px;height:1px;border-top:2px dashed #6d5b47;margin-right:6px}
.map-margin-tip{border:0;transform:rotate(-3deg);padding:0 0 0 8px}
.map-margin-tip>span{font:400 23px/1.5 var(--hand);color:#b65a35}
.journey-key{position:relative;margin:17px 5% 0;padding:11px 0 4px;border-top:1px solid #c09b7355;text-align:center}
.journey-key-title{font:500 11px/1.8 var(--body);letter-spacing:.08em;color:#8b6e51;margin-bottom:6px}
.journey-key>div{display:flex;flex-wrap:wrap;justify-content:center;gap:7px 18px}
.journey-key-place{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;font:500 14px/1.7 var(--body);color:#5e432f}
.journey-key-place i{display:block;width:5px;height:5px;border-radius:50%;background:#b35835;box-shadow:0 0 0 3px #d7ab7130}

.illustrated-relay-map{position:relative;max-width:730px;margin:10px auto 0;padding:0 0 14px;isolation:isolate}
.illustrated-relay-map>.map-heading{margin-bottom:2px}
.relay-map-thread{position:absolute;top:90px;left:0;width:100%;height:calc(100% - 112px);z-index:0;pointer-events:none}
.relay-map-thread path{fill:none;stroke-linecap:round;vector-effect:non-scaling-stroke}
.relay-route-soft{stroke:#bd7b4826;stroke-width:14}.relay-route-ink{stroke:#b95d38;stroke-width:1.8;stroke-dasharray:4 6;opacity:.65}
.relay-map-stop{position:relative;display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:160px;z-index:2;padding:7px 5%}
.relay-map-stop.is-reversed{flex-direction:row-reverse}
.relay-map-art{width:43%;position:relative;flex-shrink:0}
.relay-map-copy{width:49%;position:relative;z-index:3;padding:5px 0;background:radial-gradient(ellipse,#f5ead4ed 20%,#f5ead4b3 58%,transparent 79%)}
.relay-map-copy h3{font-size:23px;line-height:1.3;margin-bottom:8px}
.relay-map-copy .brush-mark{padding:3px 17px 6px;white-space:nowrap;min-height:0}
.relay-map-copy p{font:500 15px/1.8 var(--body);color:#5c422f}
.relay-stop-thread-dot{position:absolute;left:49%;top:49%;height:7px;width:7px;background:#b65a36;border-radius:50%;box-shadow:0 0 0 4px #f5ead4,0 0 0 5px #c27d4d88;z-index:1}
.relay-map-stop.is-reversed .relay-stop-thread-dot{left:44%}
.map-place-sketch{width:100%;height:auto;display:block;overflow:visible;filter:drop-shadow(0 2px 0 #a67a4e0d)}
.map-place-sketch .sketch-wash{fill:#d4aa6e27;stroke:none}.map-place-sketch .sketch-earth{fill:none;stroke:#9c7b5599;stroke-width:1.2;stroke-linecap:round}
.map-place-sketch .sketch-hill{fill:none;stroke:#a1855e;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
.map-place-sketch .sketch-house{fill:#f2dfbb;stroke:#9d7750;stroke-width:1.4;stroke-linejoin:round}
.map-place-sketch .sketch-roof{fill:#d4b28577;stroke:#896d4d;stroke-width:1.5;stroke-linejoin:round}
.map-place-sketch .sketch-line,.map-place-sketch .sketch-bridge{fill:none;stroke:#8e704c;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.map-place-sketch .sketch-river{fill:none;stroke:#bd9f6b;stroke-width:1.6;stroke-linecap:round}
.map-place-sketch .sketch-banner{fill:#be654447;stroke:#b35a3a;stroke-width:1.2}
.map-place-sketch .sketch-people{fill:#ac865c66;stroke:#886848;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.relay-map-note{text-align:center;font:500 11px/1.8 var(--body);color:#8d7156;margin:10px auto 0}
@keyframes map-invite{0%,100%{transform:scale(1)}50%{transform:scale(1.13)}}
@media(max-width:680px){
 .document-route-map{margin-top:0;padding-top:2px}
 .map-heading h3{font-size:23px}.map-heading small{font-size:11px}.map-heading{margin-bottom:11px}
 .historic-map-composition{display:block}
 .historic-map-source{padding:6px 5px 8px;transform:rotate(-.6deg);width:calc(100% + 10px);margin-left:-5px}
 .map-expand{bottom:22px;padding:7px 13px;font-size:12px;gap:5px}.map-expand i{font-size:23px}
 .historic-map-margin{display:grid;grid-template-columns:1fr 1fr;gap:15px 10px;padding:0;margin:19px 3% 0}
 .map-margin-note{padding-left:10px}.map-note-number{font-size:18px;margin-bottom:5px}.map-margin-note strong{font-size:13px}.map-margin-note p{font-size:11px;line-height:1.85}
 .map-margin-tip{display:none}.journey-key{margin-top:13px;padding-top:9px}.journey-key>div{gap:4px 14px}.journey-key-place{font-size:12px}.journey-key-title{font-size:10px}
 .illustrated-relay-map{margin:8px -7px 0}
 .illustrated-relay-map>.map-heading{margin-bottom:6px}
 .relay-map-stop{min-height:145px;gap:12px;padding:6px 3%}
 .relay-map-art{width:46%}.relay-map-copy{width:49%}.relay-map-copy h3{font-size:20px;margin-bottom:6px}.relay-map-copy .brush-mark{padding:3px 13px 5px}
 .relay-map-copy p{font-size:13px;line-height:1.8}.relay-map-thread{top:76px;height:calc(100% - 101px)}.relay-map-note{font-size:10px;margin-top:7px}
}
@media(max-width:350px){.relay-map-stop{min-height:139px;gap:8px}.relay-map-copy h3{font-size:19px}.relay-map-copy p{font-size:12px}.map-heading h3{font-size:21px}.historic-map-margin{gap:8px}.map-margin-note strong{font-size:12px}.map-margin-note p{font-size:10px}.journey-key>div{gap:3px 12px}}
@media(prefers-reduced-motion:reduce){.map-expand i{animation:none}}
.map-place-sketch .sketch-wash{fill:#d4aa6e55}
.map-place-sketch .sketch-hill{stroke:#917150;stroke-width:1.6}
.map-place-sketch .sketch-house{fill:#f0d5b0;stroke:#896649;stroke-width:1.7}
.relay-map-copy p{word-break:normal;overflow-wrap:normal}

/* Independent art layers move into the same continuous paper scroll. */
.reveal.motion-ready{--enter-x:0px;--enter-y:16px;transition:opacity .65s ease var(--motion-delay,0s),translate .85s cubic-bezier(.2,.72,.24,1) var(--motion-delay,0s)}
.reveal.motion-ready[data-motion-enter="left"]{--enter-x:-48px;--enter-y:0px}
.reveal.motion-ready[data-motion-enter="right"]{--enter-x:48px;--enter-y:0px}
.reveal.motion-ready[data-motion-enter="fade"]{--enter-x:0px;--enter-y:0px}
.reveal.motion-ready[data-motion-enter="up"]{--enter-x:0px;--enter-y:23px}
.reveal.motion-ready.is-waiting{opacity:0!important;translate:var(--enter-x) var(--enter-y)!important;transition-delay:0s!important;pointer-events:none}
.reveal.motion-ready.has-entered{translate:0 0}
.paint-layer.motion-ready{transition-duration:.8s,1.05s}
.scene-caption .story-line.motion-ready{transition-duration:.55s,.65s}
.route-drawing.motion-ready.is-waiting path,.relay-drawing.motion-ready.is-waiting path{stroke-dashoffset:1}
/* Replace the former one-time opening keyframes with the same replayable rules. */
#opening #departure .story-line:not(.tap-pop),#opening #his-name .story-line:not(.tap-pop),#opening #his-name .story-title:not(.tap-pop),#fan-portrait .paint-layer:not(.tap-pop),#fan-portrait .hotspot:not(.tap-pop){animation:none!important}

/* A clearly marked, thumb-sized source entrance over each relevant object. */
.scene .hotspot,.hotspot{width:68px;height:68px;min-width:68px;min-height:68px}
.hotspot:before{inset:10px;border:2px solid #b95732;border-right-color:#b9573233;box-shadow:0 0 0 5px #fff5df93;background:#fff5df29;animation:ring-breath 2.4s ease-in-out infinite}
.hotspot:after{inset:2px;border:1.5px solid #b95732b0;border-top-color:transparent;animation:ring-expand 2.4s ease-out infinite}
.hotspot i{left:50%;top:50%;width:25px;height:25px;transform:translate(-50%,-50%);border:1.4px solid #b95732;border-radius:50%;background:#fff5e5ed;box-shadow:0 1px 5px #a66a3a22}
.hotspot i:before{content:'＋';position:absolute;inset:0;display:grid;place-items:center;color:#a74729;font:600 22px/1 Arial,sans-serif}
.hotspot>span{top:61px;left:50%;padding:4px 9px;border:1px solid #c78d604f;border-radius:5px;background:#fff5e3f2;color:#854228;box-shadow:0 2px 6px #9962381c;font-size:11px;line-height:1.55;letter-spacing:0;white-space:nowrap}
.hotspot>span:before{content:'轻触查看 · ';font-weight:700}
.hotspot.is-explored:after{animation:ring-expand 2.4s ease-out infinite;opacity:1}
.tap-pop{animation:tap-pop .36s cubic-bezier(.2,.7,.3,1)!important}
@keyframes tap-pop{0%{scale:1}30%{scale:.94}66%{scale:1.08}100%{scale:1}}
@media(max-width:350px){.hotspot>span{font-size:10px;padding:3px 7px}.reveal.motion-ready[data-motion-enter="left"]{--enter-x:-34px}.reveal.motion-ready[data-motion-enter="right"]{--enter-x:34px}}
@media(prefers-reduced-motion:reduce){.reveal.motion-ready,.reveal.motion-ready.is-waiting{opacity:1!important;translate:0 0!important;transition:none!important;animation:none!important;pointer-events:auto}.hotspot:before,.hotspot:after,.tap-pop{animation:none!important}.paint-shift{translate:none!important}}
/* Short two-line labels stay inside the phone even near its outer edges. */
.hotspot>span{width:112px;max-width:36vw;white-space:normal;text-align:center;line-height:1.45}
.hotspot>span:before{content:'轻触查看';display:block;font-size:11px;line-height:1.5;margin-bottom:1px}
@media(max-width:350px){.hotspot>span{width:100px;font-size:10px}.hotspot>span:before{font-size:11px}}

/* The native dialog keeps keyboard/focus behavior; the visual construction is
   a photographic print on a charcoal scrim, with one image per album page. */
.material-dialog.is-photo-album{position:fixed;inset:0;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh!important;margin:0;border:0;border-radius:0;padding:6dvh 30px 70px;background:transparent;box-shadow:none;color:#543d2b;overflow:visible;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}
.material-dialog.is-photo-album::backdrop{background:rgba(20,21,20,.83);backdrop-filter:blur(1px)}
.material-dialog.is-photo-album .material-header{position:relative;flex-shrink:0;justify-content:center;width:min(560px,88vw);padding:0!important;border:0;background:none;text-align:center}
.material-dialog.is-photo-album .material-header>div{max-width:100%;padding:10px 25px 12px;background:#eee0c6;box-shadow:5px 5px 0 #8d795e44;clip-path:polygon(1% 5%,7% 8%,12% 2%,24% 6%,35% 1%,43% 5%,55% 1%,65% 5%,75% 2%,85% 5%,98% 0,100% 90%,92% 96%,84% 93%,72% 99%,63% 95%,54% 100%,43% 94%,32% 98%,23% 94%,11% 99%,1% 94%,2% 72%,0 42%)}
.material-dialog.is-photo-album .material-kicker{display:none}
.material-dialog.is-photo-album .material-header h2{font:700 23px/1.5 var(--body)!important;color:#735131;letter-spacing:.8px}
.material-dialog.is-photo-album .material-close{position:fixed;bottom:max(16px,env(safe-area-inset-bottom));left:calc(50% - 22px);width:44px;height:44px;border:1.5px solid #f3ead8;border-radius:50%;color:#fff8e8;font:300 30px/38px sans-serif;background:#24252444;z-index:5}
.material-dialog.is-photo-album .material-content{position:relative;flex:0 1 auto;max-width:100%;width:min(650px,90vw);max-height:calc(84dvh - 115px)!important;padding:0!important;overflow:visible;overscroll-behavior:contain}
.archive-album{position:relative;width:100%;isolation:isolate;touch-action:pan-y pinch-zoom}
.album-layout{position:relative;z-index:2;padding:0 15px}
.album-stage{filter:drop-shadow(0 12px 23px #0005)}
.album-photo-card{position:relative;margin:0;padding:16px 16px 13px;background:#f7ecd7;clip-path:polygon(1% 0,3% 1%,5% 0,8% 1%,10% 0,13% 1%,15% 0,18% 1%,20% 0,24% 1%,28% 0,31% 1%,35% 0,39% 1%,43% 0,47% 1%,51% 0,55% 1%,59% 0,63% 1%,67% 0,71% 1%,75% 0,79% 1%,83% 0,87% 1%,91% 0,95% 1%,99% 0,100% 6%,99% 12%,100% 18%,99% 24%,100% 30%,99% 36%,100% 42%,99% 48%,100% 54%,99% 60%,100% 66%,99% 72%,100% 78%,99% 84%,100% 90%,99% 99%,95% 100%,91% 99%,87% 100%,83% 99%,79% 100%,75% 99%,71% 100%,67% 99%,63% 100%,59% 99%,55% 100%,51% 99%,47% 100%,43% 99%,39% 100%,35% 99%,31% 100%,27% 99%,23% 100%,19% 99%,15% 100%,11% 99%,7% 100%,3% 99%,0 100%,1% 94%,0 88%,1% 82%,0 76%,1% 70%,0 64%,1% 58%,0 52%,1% 46%,0 40%,1% 34%,0 28%,1% 22%,0 16%,1% 10%)}
.album-image-mat{display:flex;align-items:center;justify-content:center;min-height:170px;max-height:50dvh;background:#e8ddc8;overflow:hidden}
.album-photo{display:block;width:100%;height:auto;max-height:50dvh;object-fit:contain;background:#e8ddc8}
.album-image-error{font:15px/1.8 var(--body);padding:30px;text-align:center}
.album-caption{max-height:17dvh;overflow-y:auto;padding:10px 2px 0;text-align:left;scrollbar-width:thin;font:15px/1.65 var(--body);color:#6d432e}
.album-caption strong{display:block;font-size:16px;line-height:1.6;font-weight:700}
.album-caption p{font-size:14px;line-height:1.7;margin-top:4px}
.album-caption small{display:block;color:#927a5d;font-size:11px;line-height:1.6;margin-top:6px}
.album-caption .album-report-summary{color:#5d4938;font-size:14px}
.album-caption .album-report-link{display:inline-block;color:#9a492d;border-bottom:1px solid #bd8e61;font-size:12px;line-height:1.7;margin-top:7px}
.album-arrow{position:absolute;top:calc(50% - 25px);width:48px;height:48px;z-index:4;display:flex;align-items:center;justify-content:center;background:#e4aa4b;color:#fff8e8;border:1px solid #f7df9c;border-radius:50%;font:300 43px/.8 Georgia,serif;box-shadow:0 3px 10px #0003}
.album-arrow-prev{left:-10px;padding-bottom:6px}.album-arrow-next{right:-10px;padding-bottom:6px}
.album-arrow:disabled{opacity:.28}
.album-footer{display:flex;align-items:center;justify-content:center;gap:13px;min-height:28px;margin-top:15px;color:#eee6d6}
.album-count{font:11px/1.5 sans-serif;letter-spacing:1px}
.album-dots{display:flex;justify-content:center;gap:11px;align-items:center}
.album-dot{position:relative;width:7px;height:7px;border:1px solid #f6e9cf;border-radius:50%;background:transparent}
.album-dot:after{content:'';position:absolute;inset:-8px}
.album-dot.is-active{background:#d16d3f;border-color:#d16d3f}
.album-letter-envelope{position:absolute;z-index:0;left:15%;top:40%;width:70%;height:38%;min-height:160px;pointer-events:none}
.album-letter-envelope i{position:absolute;inset:0;display:block}
.album-envelope-back{background:#ba8551;box-shadow:0 8px 24px #0005}
.album-envelope-flap{background:#d8b783;clip-path:polygon(0 0,100% 0,50% 72%);transform-origin:50% 0}
.album-envelope-front{background:#d8b784;clip-path:polygon(0 0,50% 52%,100% 0,100% 100%,0 100%)}
.album-letter-opening .album-photo-card{animation:letter-slip-out 1.4s cubic-bezier(.18,.62,.27,1) both}
.album-letter-opening .album-letter-envelope{animation:letter-envelope-away 1.4s ease both}
.album-letter-opening .album-envelope-flap{animation:letter-flap-open 1.4s ease both}
@keyframes letter-slip-out{0%{transform:translateY(20dvh) scale(.56);opacity:0}20%{transform:translateY(17dvh) scale(.56);opacity:1}76%{transform:translateY(-10px) scale(1);opacity:1}100%{transform:none;opacity:1}}
@keyframes letter-flap-open{0%{transform:rotateX(0)}25%,100%{transform:rotateX(165deg)}}
@keyframes letter-envelope-away{0%,30%{opacity:1;transform:translateY(8dvh)}70%{opacity:.7;transform:translateY(15dvh)}100%{opacity:0;transform:translateY(22dvh)}}
@media(max-width:680px){.material-dialog.is-photo-album{padding:5dvh 12px 68px;gap:18px}.material-dialog.is-photo-album .material-header{width:87vw}.material-dialog.is-photo-album .material-header>div{padding:8px 18px 10px}.material-dialog.is-photo-album .material-header h2{font-size:19px!important;letter-spacing:.3px}.material-dialog.is-photo-album .material-content{width:96vw;max-height:calc(86dvh - 100px)!important}.album-layout{padding:0 17px}.album-photo-card{padding:12px 12px 12px}.album-image-mat{min-height:135px;max-height:47dvh}.album-photo{max-height:47dvh}.album-caption{font-size:13px;max-height:18dvh;padding-top:8px}.album-caption strong{font-size:14px}.album-caption p,.album-caption .album-report-summary{font-size:12.5px;line-height:1.7}.album-caption small{font-size:10px;margin-top:5px}.album-arrow{width:38px;height:38px;font-size:36px;top:calc(50% - 19px)}.album-arrow-prev{left:0}.album-arrow-next{right:0}.album-footer{margin-top:12px}.album-letter-envelope{left:18%;width:64%}}
@media(prefers-reduced-motion:reduce){.album-letter-opening .album-photo-card,.album-letter-opening .album-letter-envelope,.album-letter-opening .album-envelope-flap{animation:none!important}.album-letter-envelope{display:none}}
.album-zoom-control{display:block;margin:9px auto 0;padding:5px 14px;background:#ead4ad;border:1px solid #b7835455;border-radius:20px;color:#8e472b;font:600 12px/1.6 var(--body)}
.album-image-mat.is-zoomed{display:block;overflow:auto;height:46dvh;max-height:46dvh;touch-action:pan-x pan-y pinch-zoom;overscroll-behavior:contain}
.album-image-mat.is-zoomed .album-photo{width:220%;max-width:none;height:auto;max-height:none;object-fit:contain}

/* Smaller Song-style narration leaves the painted scene in charge. */
body{font-size:17px;line-height:1.85}
.story-line,.scene-caption .story-line{font-size:18px;line-height:1.9;font-weight:500;letter-spacing:0;text-shadow:0 1px 2px #fff8e66b}
.passage{margin-top:10px;margin-bottom:15px}
.story-title{font-size:31px;line-height:1.45;text-wrap:balance;max-width:680px}
.story-title .brush-mark{max-width:100%;padding:5px 18px 8px;line-height:1.45;min-width:0}
.story-title .brush-mark>span{max-width:100%;text-wrap:balance}
.scene-caption .story-title{font-size:28px}
.scene-caption:before{inset:-14px -6% -17px;background:radial-gradient(ellipse,rgba(255,252,245,.83) 12%,rgba(255,251,241,.55) 48%,rgba(255,249,235,.18) 68%,transparent 83%);filter:blur(5px)}
.scene-caption .passage{background:none}
.fog-copy{position:relative;isolation:isolate}
.fog-copy:before{content:'';position:absolute;inset:-12px -7%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse,rgba(255,252,245,.84),rgba(255,250,239,.52) 53%,transparent 82%);filter:blur(6px)}
.scene-small-tag{font-size:15px}
.school-slide>p{font-size:16px;line-height:1.9}
.school-title{font-size:26px}

/* A compact paper label floats over the lower coat; it is not a wide card. */
.speaker-credit{display:block;left:4%;bottom:5%;width:max-content;max-width:70%;padding:5px 9px 6px;border:0;border-left:1.5px solid #b75b35;border-radius:2px 5px 3px 2px;background:linear-gradient(100deg,#fff5e5f0,#f8ead6e8);box-shadow:1px 2px 0 #8e603327,0 2px 7px #62452c14;backdrop-filter:none;-webkit-backdrop-filter:none;transform:rotate(-.6deg);text-align:left;text-shadow:0 1px 1px #fff5e8}
.speaker-credit strong{display:block;font:600 16px/1.35 var(--body);letter-spacing:.04em}
.speaker-credit>span{display:block;font:500 11px/1.6 var(--body);white-space:normal;letter-spacing:0;margin-top:2px}
.spirit-narration .story-line{font-size:18px;line-height:1.9}
.speech-bubble #spirit-words .story-line,.speech-bubble .story-line{font-size:22px;line-height:1.8}

/* Slower independent scenery and people, without changing their scroll positions. */
.reveal.motion-ready{transition-duration:.9s,1.12s}
.paint-layer.motion-ready{transition-duration:1.15s,1.45s}
.scene-caption .story-line.motion-ready{transition-duration:.78s,.95s}
.hotspot.motion-ready{transition-duration:.8s,1.05s}
.tap-pop{animation-duration:.42s!important}

/* The source print settles gently above a gradually darkening background. */
.material-dialog.is-photo-album[open]::backdrop{animation:album-scrim-in .58s ease both}
.material-dialog.is-photo-album[open] .material-header>div{animation:album-heading-in .58s ease .08s both}
.material-dialog.is-photo-album[open] .album-first-page{animation:album-paper-arrive .78s cubic-bezier(.2,.72,.24,1) .1s both}
.material-dialog.is-photo-album .album-page-change{animation:album-page-arrive .46s ease both}
.material-dialog.is-photo-album .album-photo{opacity:0;transition:opacity .44s ease}
.material-dialog.is-photo-album .album-photo.is-loaded{opacity:1}
.material-dialog.is-photo-album .album-footer,.material-dialog.is-photo-album .material-close{animation:album-tools-in .48s ease .32s both}
.material-dialog.album-letter-opening .album-photo-card{animation:letter-slip-out 2s cubic-bezier(.18,.62,.27,1) .08s both!important}
.material-dialog.album-letter-opening .album-letter-envelope,.material-dialog.album-letter-opening .album-envelope-flap{animation-duration:2s;animation-delay:.08s}
@keyframes album-scrim-in{from{background:rgba(20,21,20,0);backdrop-filter:blur(0)}to{background:rgba(20,21,20,.83);backdrop-filter:blur(1px)}}
@keyframes album-heading-in{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}
@keyframes album-paper-arrive{from{opacity:0;translate:0 22px;scale:.965}to{opacity:1;translate:0 0;scale:1}}
@keyframes album-page-arrive{from{opacity:0;translate:var(--album-page-x,16px) 0}to{opacity:1;translate:0 0}}
@keyframes album-tools-in{from{opacity:0}to{opacity:1}}

@media(max-width:680px){
 body{font-size:15.5px}
 .story-line,.scene-caption .story-line,#field-notes .scene-caption .story-line{font-size:15.5px;line-height:1.9}
 .intro-words #departure .story-line,.intro-words #his-name .story-line{font-size:15.5px}
 .story-title{font-size:25.5px;line-height:1.45;max-width:100%}
 .story-title .brush-mark{padding:5px 14px 7px}
 .scene-caption .story-title{font-size:25px}
 .scene-tag{font-size:15px}
 .scene-small-tag{font-size:12px}
 .school-title{font-size:22px}
 .school-slide>p{font-size:15px;line-height:1.9}
 .story-line.is-emphasis{font-size:19px}
 .speaker-credit{left:4%;bottom:5%;width:max-content;max-width:70%;padding:5px 8px 6px}
 .speaker-credit strong{font-size:14px}
 .speaker-credit>span{font-size:10px;line-height:1.6}
 .spirit-narration .story-line{font-size:15.5px;line-height:1.9}
 .speech-bubble #spirit-words .story-line,.speech-bubble .story-line{font-size:18px;line-height:1.8}
 .ending-block #always-on-road .story-line{font-size:16px}
 .ending-block #always-on-road .story-title{font-size:27px}
 .hotspot>span{font-size:10px}
 .hotspot>span:before{font-size:10.5px}
 .material-dialog.is-photo-album .material-header h2{font-size:18px!important}
}
@media(max-width:350px){
 body,.story-line,.scene-caption .story-line,#field-notes .scene-caption .story-line{font-size:15px}
 .intro-words #departure .story-line,.intro-words #his-name .story-line{font-size:15px}
 .story-title{font-size:24px}
 .scene-caption .story-title{font-size:23px}
 .spirit-narration .story-line{font-size:15px}
 .speaker-credit{max-width:70%;padding:5px 8px 6px}
 .speaker-credit>span{font-size:10px}
 .speech-bubble #spirit-words .story-line,.speech-bubble .story-line{font-size:17px}
}
@media(prefers-reduced-motion:reduce){
 .reveal.motion-ready,.paint-layer.motion-ready,.scene-caption .story-line.motion-ready{transition:none!important;animation:none!important}
 .material-dialog.is-photo-album[open]::backdrop,.material-dialog.is-photo-album[open] .material-header>div,.material-dialog.is-photo-album .album-photo-card,.material-dialog.is-photo-album .album-footer,.material-dialog.is-photo-album .material-close,.material-dialog.album-letter-opening .album-photo-card,.material-dialog.album-letter-opening .album-letter-envelope,.material-dialog.album-letter-opening .album-envelope-flap{animation:none!important}
 .material-dialog.is-photo-album .album-photo{transition:none}
}

.opening-stage{position:relative;width:calc(100% + 60px);margin:0 -30px;min-height:620px;isolation:isolate}
.opening-stage .intro-words{width:85%;max-width:620px;margin:0 auto;padding-top:30px}
.opening-stage .intro-words .passage{background:radial-gradient(ellipse,#fff9edca 15%,#fff7e785 52%,transparent 85%)}
.opening-stage .intro-words .story-line{font-size:18px;line-height:1.95}
.opening-stage .opening-ambience{inset:0 -20px 0;z-index:-1}
.opening-stage .opening-ambience .paint-layer{height:100%!important}
.news-heading{padding-top:30px;padding-bottom:0}
#field-notes .paired-two{top:70%}
#field-notes .scene-caption .story-line{font-size:18px}
#readers-scene{margin-top:0}
#spirit-introduction .story-line{font-size:14px}
.speaker-composition{height:730px}
.spirit-narration{width:49%;right:3%;top:28%}
.spirit-narration .story-line{display:inline}
.spirit-narration .passage{text-wrap:balance}
.official-relay-map{position:relative;max-width:850px;margin:10px auto 20px;padding:0;isolation:isolate}
.official-map-art{display:block;position:relative;width:100%;padding:14px 0 55px;min-height:0}
.official-map-art img{width:100%;height:auto;filter:saturate(.82) sepia(.12);mix-blend-mode:multiply}
.official-map-art .map-expand{bottom:0;max-width:90%}
.official-route-key{display:flex;justify-content:center;flex-wrap:wrap;gap:7px 10px;margin:21px auto 7px;max-width:95%;font:500 13px/1.8 var(--body);color:#825336}
.official-route-key>span{display:inline-flex;align-items:center;gap:9px}
.official-route-key>span:not(:last-child):after{content:'→';color:#ba6843;font-size:12px}
.official-map-source{text-align:center;font:500 11px/1.8 var(--body);color:#9b7f63;margin-top:9px}
.story-title .brush-mark>span{max-width:16em}
@media(max-width:680px){
 .opening-stage{width:calc(100% + 32px);margin:0 -16px;min-height:510px}
 .opening-stage .intro-words{width:87%;padding-top:22px}
 .opening-stage .intro-words .story-line{font-size:15.5px;line-height:1.95}
 .opening-stage .opening-ambience{inset:0 -8px 0}
 #field-notes .scene-caption .story-line{font-size:15.5px}
 .story-title .brush-mark>span{max-width:13em}
 #spirit-introduction .story-line{font-size:12.5px}
 .speaker-composition{height:640px}
 .spirit-narration{width:49%;right:3%;top:28%}
 .official-map-art{width:calc(100% + 20px);margin-left:-10px;padding-bottom:54px}
 .official-route-key{font-size:12px;gap:5px 8px}
 .official-map-source{font-size:10px}
}
@media(max-width:350px){
 .opening-stage{min-height:540px}
 .opening-stage .intro-words .story-line,#field-notes .scene-caption .story-line{font-size:15px}
 .speaker-composition{height:650px}
 .spirit-narration{width:49%;right:3%;top:27%}
 #spirit-introduction .story-line{font-size:12px}
 .official-route-key{font-size:11px}
}

/* The red stroke grows with its wording, rather than fitting the words to a stamp. */
.brush-mark{max-width:100%;min-width:0;padding:.35em 1.45em .48em;line-height:1.5;vertical-align:middle}
.brush-mark:before{inset:-2px -4px;background-size:108% 300%;background-position:50% 51%;filter:saturate(.88) brightness(.89)}
.brush-mark:after{content:'';position:absolute;inset:4% 1.5% 6%;z-index:-2;pointer-events:none;background:#b43e24;clip-path:polygon(3% 8%,9% 4%,19% 7%,31% 3%,47% 6%,63% 2%,77% 6%,91% 3%,97% 12%,95% 26%,99% 41%,96% 58%,98% 77%,93% 91%,80% 94%,66% 91%,52% 97%,38% 93%,23% 96%,9% 92%,2% 83%,4% 67%,1% 49%,4% 31%)}
.brush-mark>span{display:block;max-width:100%;color:#fff6e4;text-shadow:0 1px 1px #762b2355}
.story-title{max-width:100%;font-size:30px;line-height:1.5;margin:10px auto 9px;overflow:visible}
.story-title .brush-mark{display:inline-block;max-width:100%;padding:.45em 1.45em .58em;line-height:1.5;letter-spacing:.025em}
.story-title .brush-mark>span{max-width:100%;text-wrap:balance;overflow-wrap:normal;word-break:normal}
.scene-tag .brush-mark,.scene-small-tag .brush-mark{padding:.32em 1.5em .46em}
.school-title .brush-mark{max-width:100%;padding:.38em 1.45em .52em}

/* Fibres, shallow folds and faint engraved curls remain on the paper layer. */
body{background-image:linear-gradient(92deg,transparent 0 27%,#9c713809 28%,#fffaf034 28.5%,transparent 30% 74%,#9c713806 75%,#fffaf02b 76%,transparent 79%),repeating-linear-gradient(178deg,transparent 0 692px,#835c3009 698px,#fffaf044 704px,transparent 716px 1370px),radial-gradient(ellipse at 12% 4%,#e6b77d16,transparent 40%),radial-gradient(ellipse at 91% 37%,#d8884b10,transparent 35%);background-size:100% 100%,100% 1370px,100% 100%,100% 100%}
.paper-grain{opacity:.055}
.scroll-story:before{content:'';position:absolute;inset:0;z-index:-2;pointer-events:none;opacity:.28;background-repeat:repeat;background-size:720px 1260px;background-image:url("data:image/svg+xml,%3Csvg width='720' height='1260' viewBox='0 0 720 1260' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23a77b48' stroke-width='.8' opacity='.22'%3E%3Cpath d='M-30 252q68-59 106-8t69-3q-33 12-32-10t29-10q25 11 2 30m-151 9q47-29 80-3t72-9M654 787q-64-57-101-11t-68-2q33 15 34-7t-28-14q-25 7-5 29m157 14q-54-32-87-7t-69-8'/%3E%3C/g%3E%3Cg fill='none' stroke='%237d5b34' stroke-width='.6' opacity='.24'%3E%3Cpath d='m90 84 7-2m126 63 6 3m-41 211 4-7m168-92 9 1m-34 241 3-8m119-366 5 6m71 92 9-2m-20 181 5 3m-396 163 9 2m74 116 3-7m111-69 5 2m220 106 7-4m-172 80 4 7m-301-18 8 1m436 163 6-7m-351 20 4 6m203 53 8-2m-121 119 5 3m228-55 4-8m-421 201 8-3m159-21 5 7m83-106 7 1m153 151 4-6'/%3E%3C/g%3E%3C/svg%3E")}

/* Editorial emphasis lives in the text layer and keeps the sentence intact. */
.story-line .story-emphasis{font-family:var(--body);font-weight:700;font-size:1.1em;line-height:inherit;color:#77432a;letter-spacing:.015em;text-shadow:0 1px 0 #fff6e7a6;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.story-line.is-emphasis{font-family:var(--body);font-weight:700;font-size:21px;color:#77432a;line-height:1.9}

/* Give adjacent scenes a shared reading rhythm, without screen-sized pauses. */
.story-block{padding-top:7px;padding-bottom:11px}
.block-content>.passage{margin-top:7px;margin-bottom:12px}
.block-content>.passage+.passage{margin-top:10px}
.chapter-opening{padding-top:24px;padding-bottom:9px}
.chapter-opening .story-title{margin-bottom:12px}
.modern-block #relay-transition{margin-bottom:15px}
.relay-route-block{padding-top:9px}
.scene-caption .passage{margin:0}

@media(max-width:680px){
 .story-title,.scene-caption .story-title{font-size:24px;line-height:1.5}
 .story-title .brush-mark{max-width:100%;padding:.43em 1.3em .57em}
 .story-title .brush-mark>span{max-width:100%}
 .scene-tag .brush-mark,.scene-small-tag .brush-mark{padding:.3em 1.35em .45em}
 .school-title .brush-mark{padding:.4em 1.25em .55em}
 .story-block{padding-top:6px;padding-bottom:9px}
 .chapter-opening{padding-top:21px;padding-bottom:6px}
 .block-content>.passage{margin-top:6px;margin-bottom:11px}
 .block-content>.passage+.passage{margin-top:9px}
 .story-line .story-emphasis{font-size:16.8px}
 .story-line.is-emphasis{font-size:17px}
 .modern-block #relay-transition{margin-bottom:13px}
}
@media(max-width:350px){
 .story-title,.scene-caption .story-title{font-size:22.5px}
 .story-title .brush-mark{padding:.43em 1.1em .57em}
 .story-line .story-emphasis{font-size:16.2px}
 .story-line.is-emphasis{font-size:16.5px}
}

/* The text belongs to the painted object; its height follows the words. */
.scroll-story:after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:url('assets/scroll-paper-texture.webp') center top/750px 1125px repeat;opacity:.20;mix-blend-mode:multiply}
.story-emphasis.is-date,.day-copy .story-emphasis{white-space:nowrap}
.story-line{text-wrap:balance}
.opening-stage{min-height:600px}
.opening-stage .intro-words{width:88%;padding-top:24px;position:relative;z-index:8}
#opening-memory{max-width:90%;margin:0 auto 26px}
#opening-identity{width:57%;margin:0 auto 0 0;text-align:left}
#opening-identity .story-line{display:inline;line-height:2}
.prologue-person{z-index:6}
.prologue-person img{object-position:center top;object-fit:cover}
.soft-edge img,img.soft-edge{mask-image:linear-gradient(to bottom,#000 0%,#000 81%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 81%,transparent 100%)}
.scenic-mass img,.scenic-water img{mask-image:linear-gradient(to bottom,transparent 0%,#000 7%,#000 86%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 7%,#000 86%,transparent 100%)}
.integrated-book.scene,.integrated-letter.scene,.integrated-qingji.scene,.integrated-news.scene{height:auto;overflow:visible;margin-top:0;margin-bottom:0;max-width:900px}
.integrated-art{position:relative;width:100%;isolation:isolate}
.integrated-copy{position:relative;width:82%;margin:-20px auto 0;z-index:20;text-align:left}
.integrated-copy .passage{margin:0;padding:0;text-align:inherit}
.integrated-copy .story-line{display:inline}
.integrated-copy .story-line+.story-line:before{content:''}
.book-stage{height:460px}
.integrated-book .book-object{left:49%;top:1%;width:40%;height:65%;font-size:40px}
.integrated-book .book-object small{font-size:19px}
.integrated-book .integrated-copy{margin-top:-10px}
.practice-note{max-width:760px;margin:16px auto 4px;padding:12px 10px}
.practice-note .passage{margin:0}
.practice-note:after{content:'';position:absolute;z-index:-2;left:-7%;right:-7%;bottom:-20px;height:145px;opacity:.24;background:url('assets/v3-mountains.webp') center bottom/100% 100% no-repeat;mask-image:linear-gradient(transparent,#000 45%,transparent)}
.integrated-heading{position:relative;font:400 24px/1.45 var(--hand);text-align:center;margin:4px auto 16px;z-index:15}
.letter-block>.block-content>.passage{max-width:650px;margin:0 auto 4px}
.letter-stage{height:290px}
.integrated-letter .envelope-trigger{top:12%;left:23%;width:55%;height:68%;min-height:0;max-height:none}
.integrated-letter .integrated-copy{margin-top:12px}
.integrated-letter .story-emphasis{font-size:1.04em}
.qingji-stage{height:390px}
.integrated-qingji .scene-tag{top:0}
.integrated-qingji .paint-layer{mask-image:linear-gradient(#000 83%,transparent)}
.integrated-qingji .integrated-copy{margin-top:-12px}
.reporters-day-composition{position:relative;min-height:330px;margin:10px -12px 0;isolation:isolate;display:flex;align-items:center;justify-content:flex-end}
.day-art{position:absolute;left:-7%;bottom:0;width:70%;height:100%;object-fit:contain;object-position:left bottom;z-index:1}
.day-copy{position:relative;width:47%;margin:0 2% 15px 0;padding:8px 3px;z-index:5}
.day-copy .passage{text-align:left;margin:0}
.day-copy .story-line{display:inline}
.day-copy .story-emphasis{font-size:1.25em!important;line-height:1.8;color:#704127}
.news-stage{height:430px}
.integrated-news .integrated-heading{margin:4px auto 12px}
.integrated-news .integrated-copy{margin-top:0}
.people-block #news-career-summary{margin-top:20px}
.speaker-composition{height:450px;margin-top:4px;margin-bottom:0}
.speaker-art{left:-5%;top:0;bottom:auto;width:80%;height:100%;object-fit:contain;object-position:left top}
.speaker-art{mask-image:linear-gradient(#000 80%,transparent 100%);-webkit-mask-image:linear-gradient(#000 80%,transparent 100%)}
.speaker-intro{position:absolute;right:4%;top:1%;width:55%;z-index:10}
.speaker-intro .passage{margin:0;text-align:left;padding:0}
.speaker-intro .story-line{font-size:13px;line-height:1.75;display:inline}
.speech-bubble{right:3%;top:22%;width:60%;padding:18px 20px 17px;box-shadow:3px 4px 0 #bc8b5129}
.speech-bubble:before{left:9%;bottom:-24px;height:30px;width:23px}
.speech-bubble .story-emphasis{font-size:inherit;color:#503321}
.speech-bubble #spirit-words .story-line{font-size:21px;line-height:1.9}
.speaker-credit{left:5%;bottom:8%;max-width:66%}
.speaker-composition:not(.is-speaking) .speaker-intro,.speaker-composition:not(.is-speaking) .speech-bubble{opacity:0!important;translate:0 14px!important;pointer-events:none}
.speaker-intro,.speech-bubble{transition:opacity .8s ease,translate .95s ease}
.speaker-composition.is-speaking .speaker-intro,.speaker-composition.is-speaking .speech-bubble{translate:0 0}
.spirit-reflection{margin:0 auto 20px;max-width:670px}
.spirit-reflection .passage{text-align:left;margin:0 5%;padding:0}
.spirit-reflection .story-line{display:inline}
.closing-ensemble{position:relative;margin:18px -25px 8px;text-align:center;isolation:isolate}
.closing-ensemble>img{display:block;width:108%;max-width:none;margin-left:-4%;height:auto;max-height:600px;object-fit:contain;object-position:bottom}
.closing-line{font:400 38px/1.6 var(--hand);color:#74432c;margin:-10px 0 0;position:relative;z-index:5}
.closing-planning{font:500 13px/1.8 var(--body);letter-spacing:.25em;color:#9b7755;margin:5px 0 20px}
@media(max-width:680px){
 .opening-stage{min-height:570px}
 .opening-stage .intro-words{padding-top:20px;width:88%}
 #opening-memory{margin-bottom:24px;max-width:100%}
 #opening-memory .story-line{font-size:15px;line-height:1.95}
 #opening-identity{width:59%}
 #opening-identity .story-line{font-size:15px;line-height:2}
 .prologue-person{top:20%!important;height:76%!important;left:55%!important;width:49%!important}
 .opening-stage>.hotspot{top:79%!important;left:76%!important}
 .integrated-copy{width:84%}
 .book-stage{height:320px}
 .integrated-book .book-object{font-size:29px;left:50%;width:40%;height:64%}
 .integrated-book .book-object small{font-size:14px;margin-top:8px}
 .integrated-book .integrated-copy{margin-top:-5px}
 .practice-note{margin-top:12px;padding:9px 4px}
 .integrated-heading{font-size:20px;margin-bottom:12px}
 .letter-stage{height:200px}
 .integrated-letter .envelope-trigger{left:17%;width:66%;height:65%;top:14%;min-height:0}
 .integrated-letter .integrated-copy{margin-top:6px}
 .qingji-stage{height:285px}
 .integrated-qingji .integrated-copy{margin-top:-9px}
 .reporters-day-composition{min-height:245px;margin-top:5px}
 .day-copy{width:47%;margin-right:1%;margin-bottom:4px}
 .day-copy .story-line{font-size:14px;line-height:1.95}
 .day-art{width:76%;left:-9%}
 .news-stage{height:315px}
 .people-block #news-career-summary{margin-top:16px}
 .speaker-composition{height:355px;margin-top:4px}
 .speaker-art{width:81%;height:100%;top:0;left:-7%;bottom:auto}
 .speaker-intro{top:1%;right:4%;width:55%}
 .speaker-intro .story-line,#spirit-introduction .story-line{font-size:11.5px;line-height:1.75}
 .speech-bubble{width:60%;right:3%;top:22%;padding:14px 13px 13px}
 .speech-bubble #spirit-words .story-line{font-size:17px;line-height:1.9}
 .speaker-credit{left:5%;bottom:8%;padding:5px 7px}
 .speaker-credit strong{font-size:13px}
 .speaker-credit>span{font-size:9px}
 .spirit-reflection{margin-top:1px;margin-bottom:15px}
 .spirit-reflection .passage{margin:0 3%}
 .closing-ensemble{margin:14px -16px 6px}
 .closing-line{font-size:29px;margin-top:-4px}
 .closing-planning{font-size:11px;margin-bottom:16px}
 #yanan{height:465px}
 #yanan .scene-caption{top:72%!important}
 #yanan .paint-layer{height:72%!important;mask-image:linear-gradient(#000 85%,transparent)}
 .letter-block{padding-top:0}
}
@media(max-width:350px){
 .opening-stage{min-height:575px}
 #opening-identity .story-line{font-size:14.5px}
 .book-stage{height:270px}
 .integrated-book .book-object{font-size:25px}
 .letter-stage{height:180px}
 .qingji-stage{height:250px}
 .news-stage{height:275px}
 .speaker-composition{height:330px}
 .speech-bubble #spirit-words .story-line{font-size:15.5px}
 .speaker-intro .story-line,#spirit-introduction .story-line{font-size:10.5px}
 #yanan{height:480px}
 .closing-line{font-size:26px}
}
@media(prefers-reduced-motion:reduce){.speaker-composition .speaker-intro,.speaker-composition .speech-bubble{opacity:1!important;translate:none!important;transition:none}}

/* Each university is one scene-shaped entry into its documentary photographs. */
.illustrated-universities{margin-top:8px}
.illustrated-universities .schools-track{gap:22px;padding-top:6px;padding-bottom:8px;align-items:flex-start}
.illustrated-universities .school-scene{padding:0 0 8px;border:0;background:none;flex-basis:90%;overflow:visible}
.illustrated-universities .school-title{position:relative;z-index:3;margin:0 auto -5px;font-size:25px;line-height:1.4}
.illustrated-universities .school-title .brush-mark{padding:7px 27px 9px}
.illustrated-universities .school-illustration{position:relative;isolation:isolate;display:block;width:100%;height:370px;padding:0;margin:0 auto;overflow:visible;border:0;border-radius:0;background:none;color:#653f28;text-align:left;font-family:var(--body)}
.school-illustration>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;z-index:0;-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 7%,#000 88%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0%,#000 7%,#000 88%,transparent 100%)}
.school-illustration:after{content:'';position:absolute;left:4%;right:4%;bottom:0;height:42%;z-index:1;background:radial-gradient(ellipse at 50% 72%,#fffaf0ed 2%,#fff8e6b8 36%,#fff8e621 70%,transparent 84%);pointer-events:none}
.school-scene-label{position:absolute;z-index:2;left:7%;right:7%;bottom:21%;text-align:center;font-size:18px;font-weight:600;line-height:1.6;letter-spacing:.03em;text-shadow:0 1px 4px #fff8e8,0 0 12px #fff8e8}
.school-tap{position:absolute;z-index:3;bottom:4%;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;width:max-content;max-width:95%;padding:6px 13px 6px 8px;border:1px solid #b76b3955;border-radius:24px;background:#fff7e9e8;box-shadow:2px 3px 0 #ab805726;font-size:12px;font-weight:600;line-height:1.5;white-space:nowrap}
.school-tap>b{display:grid;place-items:center;flex:none;width:28px;height:28px;border:1px solid #ac5834;border-radius:50%;background:#b46137;color:#fff8e8;font:500 24px/1 var(--body)}
.illustrated-universities .school-scene-place{min-height:0;margin:2px 0 0;color:#8a7158;font-size:11px;line-height:1.7}
.illustrated-universities .schools-control{margin-top:5px}
.illustrated-universities .figure-note{margin-top:4px}
.material-dialog.is-school-album .album-caption{max-height:25dvh}
.material-dialog.is-school-album .album-image-mat,.material-dialog.is-school-album .album-photo{max-height:43dvh}
.material-dialog.is-school-album .album-caption .album-report-summary{font-size:14px;line-height:1.85;color:#59422e;margin-top:7px}
@media(max-width:680px){
 .illustrated-universities{margin-left:-16px;margin-right:-16px}
 .illustrated-universities .schools-track{gap:15px;padding-left:5%;padding-right:5%;scroll-padding-left:5%}
 .illustrated-universities .school-scene{flex-basis:93%;padding-bottom:5px}
 .illustrated-universities .school-title{font-size:21px;margin-bottom:-7px}
 .illustrated-universities .school-title .brush-mark{padding:7px 23px 9px}
 .illustrated-universities .school-illustration{height:300px}
 .school-scene-label{bottom:22%;font-size:16px}
 .school-tap{bottom:4%;font-size:11px;padding:5px 11px 5px 7px;gap:6px}
 .school-tap>b{width:26px;height:26px;font-size:22px}
 .illustrated-universities .school-scene-place{font-size:10px}
 .material-dialog.is-school-album .album-caption{max-height:28dvh}
 .material-dialog.is-school-album .album-image-mat,.material-dialog.is-school-album .album-photo{max-height:36dvh}
 .material-dialog.is-school-album .album-caption .album-report-summary{font-size:12.5px;line-height:1.8}
}
@media(max-width:350px){
 .illustrated-universities .school-title{font-size:20px}
 .illustrated-universities .school-illustration{height:267px}
 .school-scene-label{font-size:15px}
 .school-tap{font-size:10.5px}
}

/* Shared section rhythm, with no reserved header or footer space. */
:root{--section-space:16px;--reading-space:16px}
.scroll-story{padding-top:0;padding-bottom:12px}
.story-block,.chapter-opening,.news-heading,.ending-block{padding-top:calc(var(--section-space)/2);padding-bottom:calc(var(--section-space)/2)}
.opening{padding-top:0}
.block-content>:first-child{margin-top:0}
.block-content>:last-child{margin-bottom:0}
.block-content>.passage{margin-top:0;margin-bottom:var(--reading-space)}
.block-content>.passage+.passage{margin-top:var(--reading-space)}
.block-content>.scene+.passage,.block-content>.scene+.scene{margin-top:12px}
.story-block,.scene,.passage,.anchor-alias,.map-anchor{scroll-margin-top:16px}
.closing-ensemble .closing-planning{margin-bottom:0}

/* The documentary photo follows the words in normal document flow. */
#ximeng-scene.integrated-ejina{height:auto;min-height:0;padding:8px 0 12px;margin-top:0;overflow:visible;isolation:isolate}
#ximeng-scene.integrated-ejina:before{content:none}
.ejina-environment{position:absolute;inset:0;z-index:0;pointer-events:none}
.ejina-heading{position:relative;z-index:12;font:400 26px/1.5 var(--hand);color:#925037;text-align:center;margin:0 8% 16px}
.integrated-ejina .integrated-copy{margin:0 auto;text-align:left;z-index:12}
.integrated-ejina .ejina-photo{position:relative;left:auto;top:auto;width:68%;height:auto;min-height:0;margin:16px 7% 4px auto;transform:rotate(2deg);padding:9px 9px 11px;z-index:10}
.integrated-ejina .ejina-photo img{height:auto;max-height:none;display:block;object-fit:contain}
.integrated-ejina .ejina-photo>span{margin-top:7px}
@media(max-width:680px){
 .story-block,.chapter-opening,.news-heading,.ending-block{padding-top:8px;padding-bottom:8px}
 .opening{padding-top:0}
 .ejina-heading{font-size:21px;margin-bottom:16px}
 .integrated-ejina .ejina-photo{width:70%;margin-right:7%;padding:7px 7px 9px}
}
@media(max-width:350px){.ejina-heading{font-size:20px}.integrated-ejina .ejina-photo{width:72%;margin-right:6%}}

/* Worn paper, fibres and shallow printing impressions live behind the story. */
html,body{background-color:#f1e3c7}
body{color:#3f2d22;font-size:17px;line-height:1.98;background-image:linear-gradient(91deg,#8d602712 0,transparent 7% 47%,#fff9ec30 48%,#8c62230b 49%,transparent 51% 93%,#8d602714 100%),repeating-linear-gradient(178deg,transparent 0 653px,#8b623b0a 662px,#fff9ed5c 668px,transparent 685px 1320px)}
.paper-grain{opacity:.074;mix-blend-mode:multiply}
.scroll-story:after{background-image:url('assets/scroll-paper-texture.webp');background-position:center top;background-size:900px 1350px;background-repeat:repeat;opacity:.72;filter:contrast(1.18) saturate(.62);mix-blend-mode:multiply}
.scroll-story:before{opacity:.58;background-size:900px 1440px;background-repeat:repeat;background-image:url("data:image/svg+xml,%3Csvg width='900' height='1440' viewBox='0 0 900 1440' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%238b6742' opacity='.23'%3E%3Cpath stroke-width='1.1' d='M19 0v1440M25 0v1440M875 0v1440M881 0v1440'/%3E%3Cpath stroke-width='.8' d='M0 174h78M0 179h60M0 228h52M0 237h74M0 245h61M0 253h45M0 261h66M0 269h48M0 277h59M0 285h70M0 293h45M0 301h65M0 309h51M0 317h71M0 325h49M0 333h63M0 341h42M0 349h68M0 357h55M0 365h74M0 373h48M0 381h65M0 389h51M0 397h73M0 405h62M0 413h46M0 421h67M0 429h53M0 437h71M0 445h47M0 453h64M0 461h55M0 469h72M0 477h44M0 485h61M0 493h50M0 501h69M0 509h58M0 517h45M0 525h72M0 533h55M0 541h65M0 549h47M0 557h69M0 565h53M0 573h74M0 581h47M0 589h63M0 597h54M0 605h71M0 613h48M0 621h67M0 629h56M0 637h73M0 645h51M0 653h64M0 661h47M0 669h70M0 677h55M0 685h61M0 693h45M0 701h68M0 709h53M0 717h74M0 725h46M0 733h64M0 741h55M0 749h70M0 757h49M0 765h65M0 773h51M0 781h72M0 789h58M0 797h43M0 805h65M0 813h50M0 821h74M0 829h55M0 837h63M0 845h48M0 853h70M0 861h56M0 869h64M0 877h43M0 885h73M0 893h55M0 901h68M0 909h48M0 917h63M0 925h51M0 933h71M0 941h56M0 949h46M0 957h65M0 965h52M0 973h72M0 981h47M0 989h61M0 997h55M0 1005h70M0 1013h48M0 1021h64M0 1029h53M0 1037h73M0 1045h56M0 1053h45M0 1061h67M0 1069h51M0 1077h74M0 1085h58M0 1093h46M0 1101h65M0 1109h52M0 1117h70M0 1125h49M0 1133h63M0 1141h55M0 1149h73M0 1157h47M0 1165h65M0 1173h52M0 1181h70M0 1189h58M0 1197h45M0 1205h65M0 1213h51M0 1221h73M0 1229h56M0 1237h46M0 1245h67M0 1253h53M0 1261h71M0 1269h48M0 1277h64M0 1285h55M0 1293h72'/%3E%3C/g%3E%3Cg fill='none' stroke='%238b6742' stroke-width='.8' opacity='.16' transform='translate(900 1440) rotate(180)'%3E%3Cpath d='M0 225h75M0 230h64M0 260h56M0 268h69M0 276h48M0 284h66M0 292h54M0 300h72M0 308h47M0 316h62M0 324h54M0 332h73M0 340h49M0 348h64M0 356h56M0 364h70M0 372h48M0 380h65M0 388h52M0 396h73M0 404h56M0 412h45M0 420h67M0 428h53M0 436h71M0 444h49M0 452h64M0 460h55M0 468h72M0 476h46M0 484h64M0 492h53M0 500h70M0 508h48M0 516h62M0 524h56M0 532h73M0 540h45M0 548h65M0 556h54M0 564h71M0 572h47M0 580h63M0 588h55M0 596h74M0 604h48M0 612h64M0 620h52M0 628h70M0 636h55M0 644h46M0 652h66M0 660h53M0 668h72M0 676h49M0 684h64M0 692h55M0 700h71M0 708h48M0 716h63M0 724h54M0 732h73M0 740h46M0 748h65M0 756h53M0 764h70M0 772h49M0 780h64M0 788h55M0 796h72M0 804h47M0 812h63M0 820h54M0 828h73M0 836h48M0 844h65M0 852h52M0 860h71M0 868h55M0 876h46M0 884h67M0 892h53M0 900h72M0 908h48M0 916h64M0 924h55M0 932h71M0 940h47M0 948h65M0 956h54M0 964h73M0 972h48M0 980h63M0 988h55M0 996h70M0 1004h49M0 1012h65M0 1020h53M0 1028h72M0 1036h47M0 1044h63M0 1052h55M0 1060h71M0 1068h48M0 1076h64M0 1084h52M0 1092h73M0 1100h55M0 1108h46M0 1116h67M0 1124h53M0 1132h72M0 1140h48M0 1148h64M0 1156h55M0 1164h71M0 1172h47M0 1180h63M0 1188h54M0 1196h73M0 1204h48M0 1212h65M0 1220h53M0 1228h70M0 1236h49M0 1244h64M0 1252h55M0 1260h72'/%3E%3C/g%3E%3C/svg%3E");mask-image:linear-gradient(90deg,#000 0,transparent 13% 87%,#000 100%);-webkit-mask-image:linear-gradient(90deg,#000 0,transparent 13% 87%,#000 100%)}

/* A single legible paragraph replaces the former line-by-line hard breaks. */
.scroll-story .passage.prose{font-family:var(--body);font-size:17px;line-height:1.98;color:#3f2d22;text-align:left}
.passage.prose .story-paragraph{margin:0;font:inherit;line-height:1.98;text-align:left;text-indent:2em;word-break:normal;overflow-wrap:normal;text-wrap:wrap;line-break:strict;letter-spacing:0;color:inherit;text-shadow:none}
.story-paragraph .story-emphasis,.story-line .story-emphasis{font-family:var(--body);font-size:1.07em;font-weight:700;line-height:inherit;letter-spacing:0;color:#70442e;text-shadow:none}
.scroll-story .story-line{font-size:17px;line-height:1.98;color:#3f2d22}
.scene-caption .passage.prose .story-paragraph{line-height:1.98}
.scene-caption:before{background:radial-gradient(ellipse,rgba(255,252,244,.94) 14%,rgba(255,249,236,.8) 51%,rgba(255,249,235,.33) 70%,transparent 85%);filter:blur(7px)}
.fog-copy:before{background:radial-gradient(ellipse,rgba(255,252,244,.96) 15%,rgba(255,249,236,.83) 55%,rgba(255,249,235,.3) 73%,transparent 87%);filter:blur(7px)}

/* Repeated spacing gives each illustrated section a calm, readable boundary. */
:root{--section-space:32px;--reading-space:24px}
.scroll-story .story-block,.scroll-story .chapter-opening,.scroll-story .news-heading,.scroll-story .ending-block{padding-top:16px;padding-bottom:16px}
.scroll-story .opening{padding-top:0}
.scroll-story .block-content>.passage{margin-top:0;margin-bottom:24px}
.scroll-story .block-content>.passage+.passage{margin-top:24px}
.scroll-story .block-content>.scene+.passage,.scroll-story .block-content>.scene+.scene{margin-top:24px}
.scroll-story .block-content>:first-child{margin-top:0}
.scroll-story .block-content>:last-child{margin-bottom:0}
.scroll-story .story-title{margin:22px auto;font-size:29px;line-height:1.5}
.scroll-story .integrated-heading{margin-top:22px;margin-bottom:22px}
.scroll-story .scene-tag{line-height:1.5}
.scroll-story .integrated-copy{margin-top:22px}
.scroll-story .integrated-copy .passage{margin:0}
.scroll-story .practice-note{margin-top:24px;margin-bottom:0}

@media(max-width:680px){
 body,.scroll-story .passage.prose,.scroll-story .story-line,.scroll-story .scene-caption .story-line{font-size:14.5px;line-height:1.98}
 .scroll-story .story-title{font-size:23px}
 .scroll-story .integrated-heading{font-size:19px}
 .scroll-story:after{background-size:675px 1012.5px;opacity:.76}
 .scroll-story:before{background-size:675px 1080px;opacity:.52}
 .scroll-story .story-block,.scroll-story .chapter-opening,.scroll-story .news-heading,.scroll-story .ending-block{padding-top:16px;padding-bottom:16px}
 .scroll-story .opening{padding-top:0}
 .scroll-story .block-content>.passage{margin-bottom:22px}
 .scroll-story .block-content>.passage+.passage{margin-top:22px}
 .scroll-story .block-content>.scene+.passage,.scroll-story .block-content>.scene+.scene{margin-top:22px}
 .scroll-story .story-title{margin-top:22px;margin-bottom:22px}
 .scroll-story .integrated-copy{margin-top:22px}
 .scroll-story .integrated-copy .passage{margin:0}
}
@media(max-width:350px){
 body,.scroll-story .passage.prose,.scroll-story .story-line,.scroll-story .scene-caption .story-line{font-size:14px;line-height:1.98}
 .scroll-story .story-title{font-size:21.5px}
 .scroll-story .integrated-heading{font-size:18px}
}

/* Dedicated reading areas stay clear of figures and landscape edges. */
.scroll-story .scene-caption .prose{width:100%}
.scroll-story .integrated-copy{position:relative;z-index:20;color:#3f2d22}
.scroll-story .integrated-copy .prose+.prose{margin-top:24px}
.scroll-story .integrated-copy:before{content:'';position:absolute;inset:-15px -5%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse,#fff9eced 30%,#fff9ecc4 62%,transparent 90%);filter:blur(7px)}
.scroll-story .scene-caption:before{inset:-16px -6%;opacity:1}
.scroll-story .opening-stage #opening-identity{margin-top:0;width:57%}
.scroll-story .opening-stage #opening-identity .story-paragraph{text-indent:0;font-size:inherit;line-height:2}
.scroll-story .opening-stage #opening-memory .story-line{font-size:inherit}

/* The date reads as part of one sentence, beside a smaller painting. */
.reporters-day-composition{display:grid;grid-template-columns:34% minmax(0,1fr);align-items:center;column-gap:22px;min-height:0;margin:24px 0 0;padding:10px 0}
.reporters-day-composition .day-art{position:relative;inset:auto;width:100%;height:auto;max-height:none;object-fit:contain;object-position:center}
.reporters-day-composition .day-copy{position:relative;width:auto;max-width:none;min-width:0;margin:0;padding:0}
.scroll-story .day-copy .passage{width:100%;margin:0}
.scroll-story .day-copy .story-paragraph{font-size:inherit;line-height:1.98;text-indent:2em;text-wrap:wrap;word-break:normal}
.scroll-story .day-copy .story-emphasis{font-size:1.07em!important;white-space:nowrap}
.scroll-story .day-copy .story-emphasis.is-date{white-space:nowrap}

/* The orchard is the scene; its narrative follows on clean paper. */
#modern-reporting.integrated-modern{height:auto;min-height:0;margin-top:24px;margin-bottom:0;overflow:visible}
.modern-stage{position:relative;height:430px;isolation:isolate}
.modern-stage .scene-tag{top:0}
.scroll-story .modern-copy{width:84%;margin:24px auto 0;padding:0;background:#fbf1df99;border-radius:50%/12%}
.scroll-story .modern-copy .prose+.prose{margin-top:24px}
.modern-copy:before{inset:-16px -5%;background:radial-gradient(ellipse,#fff9ee 25%,#fff9eedb 67%,transparent 92%);filter:blur(8px)}
.scroll-story .modern-block #relay-transition{margin-bottom:24px}

/* A true button-shaped cue belongs to the envelope, with room below it. */
.letter-stage{display:flex;justify-content:center;align-items:flex-start;height:auto;padding:24px 0 14px}
#letter.integrated-letter .envelope-trigger{position:relative;left:auto;top:auto;width:56%;height:210px;max-height:none;min-height:0;margin:0 auto 54px}
.envelope-front>strong{top:53%;font-size:21px;font-weight:500}
.envelope-trigger .envelope-hint{display:flex;align-items:center;justify-content:center;gap:8px;left:50%;right:auto;bottom:-54px;width:max-content;min-height:38px;padding:7px 18px;transform:translateX(-50%) rotate(4deg);border:1px solid #a2774d99;border-radius:24px;background:linear-gradient(#fff9eb,#f5e7cc);box-shadow:0 3px 0 #946c3a2b;color:#75472d;font:600 13px/1.4 var(--body);letter-spacing:.02em;white-space:nowrap}
.envelope-hint>i{display:grid;place-items:center;width:22px;height:22px;border:1px solid #ab7c56;border-radius:50%;font:500 17px/1 var(--body);font-style:normal}
#letter.integrated-letter .envelope-trigger:focus-visible{outline:2px solid #9d5937;outline-offset:8px}
.scroll-story .integrated-letter .integrated-copy{margin-top:16px}
.scroll-story .letter-block>.block-content>.passage{margin-bottom:24px}

/* An editorial byline replaces the rectangular name tag. */
.speaker-composition{margin-top:20px;margin-bottom:24px}
.speaker-composition .speech-bubble{top:13%}
.speaker-composition .speaker-credit{left:auto;right:4%;bottom:8%;width:49%;max-width:none;margin:0;padding:13px 0 0;border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;transform:none;text-align:center;color:#493224;isolation:isolate;text-shadow:none}
.speaker-credit:before{content:'';position:absolute;left:calc(50% - 15px);top:0;width:30px;height:1px;background:#9c7050}
.speaker-credit:after{content:'';position:absolute;inset:-8px -15px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse,#fff7e5eb 20%,#fff7e5bf 55%,transparent 85%);filter:blur(6px)}
.speaker-composition .speaker-credit strong{font:400 23px/1.5 var(--hand);letter-spacing:.08em;color:#62422e}
.speaker-composition .speaker-credit>span{font:500 11px/1.8 var(--body);letter-spacing:0;white-space:normal;margin-top:3px}
.scroll-story .spirit-reflection{margin:0 auto 26px}
.scroll-story .spirit-reflection .passage{margin:0 3%;text-align:left}
.scroll-story #spirit-past,.scroll-story #spirit-today,.scroll-story #always-on-road{max-width:640px;margin:24px auto}
.scroll-story .closing-ensemble{margin-top:28px}

@media(max-width:680px){
 .scroll-story .opening-stage #opening-identity{width:57%;font-size:14.5px}
 .reporters-day-composition{grid-template-columns:33% minmax(0,1fr);column-gap:17px;margin-top:24px;padding:6px 0}
 .modern-stage{height:320px}
 .scroll-story .modern-copy{width:84%;margin-top:24px}
 #letter.integrated-letter .envelope-trigger{width:69%;height:150px;margin-bottom:54px}
 .envelope-front>strong{font-size:17px}
 .envelope-trigger .envelope-hint{font-size:12px;padding:7px 15px}
 .letter-stage{padding-top:20px;padding-bottom:12px}
 .speaker-composition{margin-top:22px;margin-bottom:24px}
 .speaker-composition .speaker-credit{right:4%;width:48%;bottom:8%;padding-top:11px}
 .speaker-composition .speaker-credit strong{font-size:20px}
 .speaker-composition .speaker-credit>span{font-size:9.5px;line-height:1.8}
 .scroll-story .speech-bubble #spirit-words .story-line{font-size:16px;line-height:1.9}
 .scroll-story .integrated-copy .prose+.prose{margin-top:24px}
}
@media(max-width:350px){
 .scroll-story .opening-stage #opening-identity{font-size:14px}
 .reporters-day-composition{grid-template-columns:31% minmax(0,1fr);column-gap:15px}
 .modern-stage{height:280px}
 #letter.integrated-letter .envelope-trigger{height:132px;width:71%}
 .speaker-composition .speaker-credit strong{font-size:19px}
 .speaker-composition .speaker-credit>span{font-size:9px}
 .scroll-story .speech-bubble #spirit-words .story-line{font-size:15px}
}

/* The map itself is the source entrance; no separate controls or key below it. */
.official-relay-map{margin:20px auto;padding:0}
.official-map-art{display:block;width:100%;margin:0;padding:0;min-height:0;cursor:zoom-in}
.official-map-art img{display:block;width:100%;height:auto}
.document-route-map{margin:0 auto 20px;padding-top:0}
.historic-map-source{padding:6px;box-shadow:2px 3px 0 #aa80521f;cursor:zoom-in}
.historic-map-source img{display:block;width:100%;height:auto}
.map-zoom-cue{position:absolute;right:11px;top:11px;display:block;width:31px;height:31px;border:1px solid #a67a514d;border-radius:50%;background:#fff7e9c9;box-shadow:0 1px 4px #71513912;pointer-events:none}
.map-zoom-cue:before{content:'';position:absolute;left:8px;top:7px;width:10px;height:10px;border:1.5px solid #886447;border-radius:50%}
.map-zoom-cue:after{content:'';position:absolute;left:18px;top:18px;width:7px;height:1.5px;background:#886447;transform:rotate(45deg);transform-origin:left center}
.historic-map-source:focus-visible,.official-map-art:focus-visible{outline:2px solid #9a5b35;outline-offset:5px}
@media(max-width:680px){
 .official-map-art{width:100%;margin-left:0;padding:0}
 .historic-map-source{width:100%;margin-left:0;padding:5px}
 .official-relay-map,.document-route-map{margin-bottom:20px}
 .map-zoom-cue{width:29px;height:29px;top:8px;right:8px}
}

/* An illustrated cover precedes the continuously scrolling paper story. */
body.intro-active{overflow:hidden;overscroll-behavior:none}
body.intro-active>.reader-header{visibility:hidden}
.story-intro{position:fixed;inset:0;z-index:200;width:100%;height:100vh;height:100dvh;background:#f5ead4;color:#5d3926;overflow:hidden;isolation:isolate;perspective:1500px;transition:background .8s ease}
.story-intro[hidden]{display:none!important}
.story-intro:before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 17% 36%,#e3a35d1c,transparent 66%),radial-gradient(ellipse at 85% 72%,#d2793b16,transparent 60%);pointer-events:none}
.intro-loader{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;padding:32px;text-align:center;opacity:1;transition:opacity .55s ease,translate .65s ease;z-index:4;background:#f5ead4}
.intro-load-seal{display:grid;place-items:center;width:40px;height:45px;margin-bottom:23px;border:1px solid #b65431;transform:rotate(-5deg);font:400 34px/1 var(--hand);color:#b65431}
.intro-load-title{font:500 18px/1.8 var(--body);letter-spacing:.09em;margin-bottom:24px}
.intro-load-track{position:relative;width:min(245px,70vw);height:9px;border:1px solid #b88b5f88;border-radius:20px;background:#e9d3ac77;box-shadow:inset 0 1px 2px #946a3c18;overflow:visible}
.intro-load-fill{display:block;width:0%;height:100%;border-radius:20px;background:linear-gradient(90deg,#d88b4b,#bd4e2c);box-shadow:0 0 5px #b65f3233}
.intro-load-track i{position:absolute;left:0%;top:50%;width:15px;height:15px;border:1px solid #ab633b;border-radius:50%;background:#f6e8cd;transform:translate(-50%,-50%);box-shadow:0 0 0 4px #edcea34f}
.intro-load-track i:after{content:'';position:absolute;inset:4px;background:#bd5531;border-radius:50%}
.intro-load-percent{margin-top:18px;font:500 12px/1.5 var(--body);color:#a16542;letter-spacing:.08em}
.intro-load-note{font:500 11px/1.8 var(--body);color:#a18a6b;margin-top:31px;letter-spacing:.05em}
.intro-book{position:absolute;inset:0;max-width:720px;height:100%;margin:0 auto;perspective:1500px;transform-style:preserve-3d;opacity:0;visibility:hidden}
.intro-cover,.intro-underpage{position:absolute;inset:0;background:#f5ead4;overflow:hidden;border-left:1px solid #b48c5c44;box-shadow:inset 8px 0 12px #8b633b15;transform-origin:left center;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform-style:preserve-3d}
.intro-underpage{inset:3px 0 1px 4px;background:linear-gradient(90deg,#ead9bb,#fbf1de 7%,#f8eedb);box-shadow:inset 12px 0 18px #8c5f2e18}
.intro-cover{z-index:2;will-change:transform,opacity;transition:transform 1.45s cubic-bezier(.45,.08,.21,1),box-shadow 1.45s ease}
.intro-cover-grain{position:absolute;inset:0;z-index:9;pointer-events:none;opacity:.035;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.intro-art{position:absolute;pointer-events:none;user-select:none;opacity:0;transition:opacity 1.1s ease,transform 1.4s cubic-bezier(.2,.65,.24,1);will-change:opacity,transform}
.intro-land{inset:0;z-index:0;width:100%;height:100%;object-fit:fill;transform:scale(1.045);filter:saturate(.95)}
.intro-cover-paper{z-index:2;left:49%;top:43%;width:64%;height:38%;transform:translateX(48px) rotate(12deg);filter:drop-shadow(2px 4px 0 #b5895633)}
.intro-cover-paper>img{width:100%;height:100%;object-fit:contain}
.intro-cover-paper>span{position:absolute;top:22%;left:12%;width:75%;text-align:center;font:400 30px/1.3 var(--hand);letter-spacing:.18em;color:#85543a;transform:rotate(-6deg)}
.intro-cover-paper>i{position:absolute;left:16%;top:40%;width:70%;height:29%;opacity:.2;transform:rotate(-5deg);background:repeating-linear-gradient(90deg,#754c2b 0 1px,transparent 1px 5px);mask-image:linear-gradient(transparent,#000 12%,#000 88%,transparent);-webkit-mask-image:linear-gradient(transparent,#000 12%,#000 88%,transparent)}
.intro-portrait{z-index:4;left:0%;top:35%;width:82%;height:58%;object-fit:contain;object-position:center bottom;transform:translateX(-34px)}
.intro-kit{z-index:5;left:54%;bottom:5%;width:53%;height:23%;object-fit:contain;object-position:center bottom;transform:translate(28px,16px)}
.intro-cover-heading{position:absolute;z-index:6;left:6%;right:6%;top:6%;text-align:center;opacity:0;transform:translateY(13px);transition:opacity 1.1s ease,transform 1.1s ease;isolation:isolate}
.intro-cover-heading:before{content:'';position:absolute;inset:-20px -20px -16px;z-index:-1;background:radial-gradient(ellipse,#f5ead4e8 28%,#f5ead4b3 53%,transparent 77%);pointer-events:none}
.intro-cover-eyebrow{font:500 12px/1.6 var(--body);letter-spacing:.2em;color:#94613c;margin-bottom:13px}
.intro-cover-heading h1{font:400 clamp(36px,5.5vw,52px)/1.2 var(--hand);color:#bd4e2c;letter-spacing:.06em;text-shadow:0 1px 1px #fff4e5}
.intro-cover-heading h1 span{display:block;white-space:nowrap}
.intro-cover-heading h1 span+span{margin-top:4px}
.intro-cover-subtitle{margin-top:14px;font:500 14px/1.8 var(--body);color:#71503a;letter-spacing:.03em}
.intro-enter{position:absolute;z-index:11;left:50%;bottom:max(3.5%,env(safe-area-inset-bottom));transform:translate(-50%,15px);display:flex;align-items:center;justify-content:center;gap:17px;min-height:46px;min-width:164px;padding:8px 24px 10px;border:1px solid #b6683f80;border-radius:50% 46% 47% 43% / 19% 22% 20% 24%;background:#fff2deda;box-shadow:0 4px 0 #a8774930;color:#a34c2b;font:500 15px/1.6 var(--body);letter-spacing:.1em;opacity:0;visibility:hidden;transition:opacity .8s ease,transform .9s ease,background .25s ease;touch-action:manipulation}
.intro-enter i{font:400 24px/1 Georgia,serif;display:block;animation:intro-enter-nudge 3s ease-in-out infinite}
.intro-enter:hover{background:#fff8e9}
.intro-enter:focus-visible{outline:2px solid #b65431;outline-offset:5px}
.intro-page-curl{position:absolute;right:-1px;bottom:-1px;width:62px;height:62px;background:linear-gradient(135deg,transparent 49%,#ebd5af 50%,#fbf1dd 68%,#9f794b44 70%,transparent 72%);z-index:10;pointer-events:none;opacity:.65}
.intro-turn-shadow{position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(90deg,transparent,#6b442333);opacity:0;transform-origin:left center}
.story-intro.is-ready .intro-loader{opacity:0;translate:0 -10px;pointer-events:none}
.story-intro.is-ready .intro-book{opacity:1;visibility:visible}
.story-intro.is-ready .intro-land{opacity:1;transform:scale(1);transition-delay:.12s}
.story-intro.is-ready .intro-cover-paper{opacity:.94;transform:translateX(0) rotate(12deg);transition-delay:.58s}
.story-intro.is-ready .intro-portrait{opacity:1;transform:translateX(0);transition-delay:1.02s}
.story-intro.is-ready .intro-kit{opacity:1;transform:translate(0,0);transition-delay:1.38s}
.story-intro.is-ready .intro-cover-heading{opacity:1;transform:translateY(0);transition-delay:1.65s}
.story-intro.is-ready.can-open .intro-enter{opacity:1;visibility:visible;transform:translate(-50%,0)}
.story-intro.is-opening{background:transparent;pointer-events:none}
.story-intro.is-opening .intro-cover{transform:rotateY(-109deg);box-shadow:25px 0 44px #59341738}
.story-intro.is-opening .intro-underpage{opacity:0;transition:opacity 1.3s ease .1s}
.story-intro.is-opening .intro-turn-shadow{animation:intro-page-shadow 1.45s ease both}
.story-intro.is-opening .intro-enter{opacity:0;transition-delay:0s;transition-duration:.25s}
.story-intro.is-opening .intro-art,.story-intro.is-opening .intro-cover-heading{transition-delay:0s}
.story-intro.is-finished{opacity:0;transition:opacity .25s ease}
@keyframes intro-enter-nudge{0%,75%,100%{transform:translate(0,0)}85%{transform:translate(3px,-2px)}}
@keyframes intro-page-shadow{0%{opacity:0;transform:scaleX(.05)}35%{opacity:.6;transform:scaleX(.52)}75%{opacity:.18;transform:scaleX(1)}100%{opacity:0}}
@media(min-width:721px){.intro-book{box-shadow:-15px 0 45px #6a47221a,15px 0 45px #6a47221a}.intro-cover-heading{top:5%}.intro-portrait{left:4%;width:77%}.intro-cover-paper{left:53%;width:53%}.intro-kit{left:59%;width:42%}.intro-enter{bottom:4%}}
@media(max-width:350px){.intro-cover-heading{left:4%;right:4%;top:6%}.intro-cover-heading h1{font-size:36px}.intro-cover-eyebrow{font-size:10px;margin-bottom:11px}.intro-cover-subtitle{font-size:12px;margin-top:12px}.intro-cover-paper>span{font-size:24px}.intro-portrait{left:-4%;width:88%}.intro-enter{font-size:14px;min-width:150px;min-height:44px}.intro-load-title{font-size:16px}}
@media(max-height:690px){.intro-cover-heading{top:4%}.intro-cover-heading h1{font-size:36px}.intro-cover-eyebrow{font-size:10px;margin-bottom:8px}.intro-cover-subtitle{font-size:12px;line-height:1.55;margin-top:10px}.intro-portrait{top:32%;height:61%;width:77%}.intro-cover-paper{top:44%;height:35%}.intro-kit{bottom:5%;height:23%}.intro-enter{bottom:3%;min-height:42px;font-size:13px;padding-top:6px;padding-bottom:7px}}
@media(prefers-reduced-motion:reduce){.story-intro,.intro-loader,.intro-cover,.intro-art,.intro-cover-heading,.intro-enter,.intro-underpage{transition:none!important;animation:none!important}.intro-enter i,.intro-turn-shadow{animation:none!important}.story-intro.is-opening{opacity:0}.story-intro.is-opening .intro-cover{transform:none}}

/* Tangible wrinkled paper replaces the faint wash of the earlier scroll. */
.scroll-story:after{background-image:url('assets/wrinkled-paper-v2.webp');background-size:600px 800px;opacity:.88;filter:contrast(1.14) saturate(.72);mix-blend-mode:multiply}
.scroll-story:before{opacity:.30}
.section-cloud{position:absolute;top:-24px;width:90%;height:200px;z-index:1;pointer-events:none;opacity:.48;mix-blend-mode:multiply}
.section-cloud img{display:block;width:100%;height:100%;object-fit:contain}
.section-cloud.cloud-left{left:-28%}
.section-cloud.cloud-right{right:-28%;transform:scaleX(-1)}
.scroll-story .opening-stage #opening-identity .story-paragraph{text-indent:2em}
.scroll-story .dispatch-reading{position:relative;max-width:680px;width:88%;margin:24px auto 0;padding:8px 5px;z-index:20;background:radial-gradient(ellipse,#fff9eeed 30%,#fff9eec9 70%,transparent 94%)}
.scroll-story .dispatch-reading .passage{margin:0}
.speaker-composition .speaker-credit:before{content:none;display:none}
.speaker-composition .speaker-credit{padding-top:0}
.speaker-composition .speech-bubble{display:flex;align-items:center;justify-content:center;min-height:142px;text-align:center}
.speech-bubble .passage,.speech-bubble #spirit-words{width:100%;text-align:center;margin:0;padding:0}
.speech-bubble #spirit-words .story-line{text-align:center}
@media(max-width:680px){
 .scroll-story:after{background-size:450px 600px;opacity:.90}
 .section-cloud{height:150px;top:-16px;width:100%;opacity:.42}
 .scroll-story .dispatch-reading{width:88%;margin-top:24px;padding:8px 3px}
 .speaker-composition .speech-bubble{min-height:114px}
}
@media(max-width:350px){
 .scroll-story .speech-bubble #spirit-words .story-line{font-size:14px;line-height:1.9}
 .speaker-composition .speech-bubble{min-height:112px}
}

/* A vertical ink title sits inside a painted route, rather than above a portrait card. */
.story-intro{background:#efdfbf}
.story-intro .cover-poster-meta{left:auto;right:18%;top:4%}
.intro-cover{background:#efdfbf}
.cover-route-art.intro-land{inset:0;width:100%;height:100%;object-fit:cover;object-position:25% center;filter:saturate(.84) contrast(.98);transform:scale(1.045)}
.intro-cover-grain{background-image:url('assets/wrinkled-paper-v2.webp');background-size:100% 100%;opacity:.3;mix-blend-mode:multiply}
.intro-loader{background:#f1e5ce url('assets/wrinkled-paper-v2.webp') center/cover}
.cover-poster-meta{position:absolute;z-index:12;top:5%;left:7%;display:flex;align-items:center;gap:12px;color:#785536;opacity:0;translate:0 8px;transition:opacity 1s ease,translate 1.1s ease}
.cover-poster-meta>span{font:500 11px/1.8 var(--body);letter-spacing:.22em}
.cover-poster-meta>i{display:grid;place-items:center;width:27px;height:30px;border:1px solid #a3432d;transform:rotate(-4deg);font:400 23px/1 var(--hand);color:#a3432d;font-style:normal}
.intro-cover-heading{left:auto;right:5.8%;top:14%;width:47%;text-align:right;transform:translateY(20px)}
.intro-cover-heading:before{inset:-25px -8px -23px -17px;background:radial-gradient(ellipse at 70% 40%,#f6ead159 30%,#f6ead124 64%,transparent 86%)}
.intro-cover-heading h1{display:flex;flex-direction:row-reverse;align-items:flex-start;justify-content:center;column-gap:12px;margin:0;font:400 clamp(46px,14.8vw,72px)/1 var(--hand);letter-spacing:0;color:#9b2d20;text-shadow:0 1px 0 #fff7e88c,1px 2px 0 #8f321a0a}
.intro-cover-heading h1 span{white-space:normal;margin:0}
.intro-cover-heading h1 .cover-title-column{display:flex;flex:0 0 auto;flex-direction:column;align-items:center;gap:1px;line-height:1}
.intro-cover-heading h1 .title-secondary{margin-top:68px}
.intro-cover-heading h1 .cover-title-char{display:block;line-height:1.02;height:1.04em;min-width:1em;font-size:1em;margin:0;position:relative}
.intro-cover-heading h1 .key-char{font-size:1.13em;height:1.03em}
.title-primary .cover-title-char:nth-child(1){transform:rotate(-4deg) translateX(1px)}
.title-primary .cover-title-char:nth-child(2){transform:rotate(3deg) translateX(-3px)}
.title-primary .cover-title-char:nth-child(3){transform:rotate(-2deg) translateX(3px)}
.title-primary .cover-title-char:nth-child(4){transform:rotate(2deg) translateX(-1px)}
.title-primary .cover-title-char:nth-child(5){transform:rotate(-3deg) translateX(2px)}
.title-secondary .cover-title-char:nth-child(1){transform:rotate(3deg) translateX(-2px)}
.title-secondary .cover-title-char:nth-child(2){transform:rotate(-3deg) translateX(2px)}
.title-secondary .cover-title-char:nth-child(3){transform:rotate(2deg) translateX(-3px)}
.title-secondary .cover-title-char:nth-child(4){transform:rotate(-2deg) translateX(2px)}
.title-secondary .cover-title-char:nth-child(5){transform:rotate(3deg) translateX(-1px)}
.intro-cover-subtitle{font:500 12px/1.9 var(--body);letter-spacing:.04em;color:#6e4934;margin:22px -1px 0 -25%;text-align:right;text-shadow:0 1px 2px #fff6e7}
.cover-cloud-layer{z-index:3;left:-23%;bottom:12%;width:112%;height:25%;object-fit:contain;object-position:center;mix-blend-mode:multiply;transform:translateX(-20px);filter:sepia(.25);opacity:0}
.intro-enter{bottom:max(5.3%,env(safe-area-inset-bottom));min-width:184px;min-height:48px;padding:8px 27px 10px;background:#9f3324;color:#fff1d6;border:0;border-radius:0;clip-path:polygon(3% 8%,15% 4%,29% 8%,47% 3%,63% 7%,82% 2%,97% 10%,95% 31%,99% 53%,96% 76%,98% 91%,79% 96%,58% 92%,38% 98%,19% 93%,2% 96%,4% 71%,1% 46%);box-shadow:0 4px 0 #79452c30;font:400 21px/1.5 var(--hand);letter-spacing:.08em}
.intro-enter:hover{background:#8e2b20}
.story-intro .intro-enter{width:max-content;gap:12px;padding-left:24px;padding-right:24px}
.intro-enter>span{white-space:nowrap}
.intro-enter i{font-size:23px;color:#ffe5b9}
.story-intro.is-ready .cover-poster-meta{opacity:1;translate:0 0;transition-delay:.55s}
.story-intro.is-ready .cover-cloud-layer{opacity:.43;transform:translateX(0);transition-delay:.8s;animation:cover-cloud-drift 18s ease-in-out 2s infinite alternate}
.story-intro.is-ready .intro-cover-heading{transition-delay:1.05s}
.story-intro.is-opening .cover-poster-meta{transition-delay:0s}
@keyframes cover-cloud-drift{from{translate:-8px 0}to{translate:10px -4px}}
@media(min-width:721px){
 .intro-cover-heading{right:8%;top:13%;width:42%}
 .intro-cover-heading h1{font-size:72px;column-gap:18px}
 .intro-cover-heading h1 .title-secondary{margin-top:83px}
 .intro-cover-subtitle{font-size:15px;margin-top:26px}
 .cover-poster-meta{top:5%;left:8%}
 .cover-poster-meta>span{font-size:13px}
 .intro-enter{bottom:5.5%;font-size:24px;min-height:52px;min-width:204px}
}
@media(max-width:350px){
 .intro-cover-heading{left:auto;right:5%;top:14%;width:48%}
 .intro-cover-heading h1{font-size:46px;column-gap:9px}
 .intro-cover-heading h1 .title-secondary{margin-top:58px}
 .intro-cover-subtitle{font-size:10.5px;line-height:1.9;margin-top:20px;margin-left:-28%}
 .cover-poster-meta{left:6%;top:5%;gap:10px}
 .cover-poster-meta>span{font-size:9.5px}
 .cover-poster-meta>i{width:24px;height:27px;font-size:21px}
 .intro-enter{bottom:5%;font-size:19px;min-height:45px;min-width:170px}
}
@media(max-height:690px){
 .intro-cover-heading{left:auto;right:5.5%;top:12%;width:47%}
 .intro-cover-heading h1{font-size:clamp(39px,12.6vw,52px);column-gap:9px}
 .intro-cover-heading h1 .title-secondary{margin-top:47px}
 .intro-cover-subtitle{font-size:10.5px;line-height:1.7;margin-top:16px}
 .cover-poster-meta{top:4%;left:6%}
 .cover-poster-meta>span{font-size:9.5px}
 .intro-enter{bottom:4.5%;min-height:43px;font-size:18px;min-width:165px}
}
@media(prefers-reduced-motion:reduce){
 .cover-poster-meta,.cover-cloud-layer{transition:none!important;animation:none!important}
}

/* Broad, dry-brush title artwork keeps the full heading in the text layer. */
.story-intro .intro-cover-heading{left:auto;right:1%;top:12%;width:58%;height:48%;text-align:center}
.story-intro .intro-cover-heading h1{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;padding:0;margin:0}
.cover-title-ink{display:block;width:100%;height:100%;max-width:none;object-fit:fill;pointer-events:none;filter:saturate(.92) brightness(.9)}
.intro-cover-heading:before{inset:-12px -4px;background:radial-gradient(ellipse,#f6ead12b 20%,transparent 80%)}
@media(min-width:721px){.story-intro .intro-cover-heading{right:3%;top:12%;width:55%;height:53%}}
@media(max-width:350px){.story-intro .intro-cover-heading{right:1%;top:12%;width:58%;height:52%}}
@media(max-height:690px){.story-intro .intro-cover-heading{right:1%;top:12%;width:58%;height:52%}}

/* One small record stays above the cover and the continuous story. */
.story-music{position:fixed;right:max(15px,env(safe-area-inset-right));top:max(14px,env(safe-area-inset-top));z-index:260;pointer-events:none}
.music-toggle{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:48px;min-height:61px;padding:3px 3px 1px;border:0;background:transparent;color:#795032;pointer-events:auto;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.music-disc{position:relative;display:grid;place-items:center;width:36px;height:36px;border:1px solid #9364449e;border-radius:50%;background:radial-gradient(circle,#ead9ba 0 10%,#855b3c 11% 14%,#f4e7cc 15% 33%,#795338 34% 36%,#f6ead1 37% 59%,#a0795570 60% 63%,#f4e6ca 64%);box-shadow:0 2px 5px #62412224;animation:music-record-spin 7s linear infinite;animation-play-state:paused}
.music-disc b{font:600 19px/1 Georgia,'Times New Roman',serif;color:#724727;transform:rotate(-14deg);text-shadow:0 1px #fff7e6}
.music-disc i{position:absolute;right:-1px;top:1px;width:10px;height:3px;border-radius:2px;background:#9b6947;transform:rotate(43deg);transform-origin:right center}
.music-state{display:block;white-space:nowrap;font:500 9px/1.5 var(--body);letter-spacing:.02em;padding:0 4px;color:#795032;background:#fff6e7c9;border-radius:7px;text-shadow:0 1px #fff7ec}
.music-toggle.is-playing .music-disc{animation-play-state:running}
.music-toggle.is-paused .music-disc:after{content:'';position:absolute;width:39px;height:1.5px;background:#9c4c34;transform:rotate(-42deg);box-shadow:0 1px 0 #fff0da}
.music-toggle.is-pending .music-disc{opacity:.85}
.music-toggle:focus-visible{outline:2px solid #a5633b;outline-offset:3px;border-radius:24px}
.music-toggle:active{transform:scale(.94)}
@keyframes music-record-spin{to{transform:rotate(360deg)}}
@media(max-width:350px){.story-music{right:10px;top:max(10px,env(safe-area-inset-top))}.music-toggle{width:44px;min-height:57px}.music-disc{width:33px;height:33px}.music-state{font-size:8.5px}}
@media(prefers-reduced-motion:reduce){.music-disc{animation:none!important}.music-toggle:active{transform:none}}