:root{--ink:#f2eed8;--muted:#bdc9b5;--dark:#163f38;--gold:#e5c28c}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--dark);color:var(--ink);font-family:"Segoe UI","Microsoft JhengHei",sans-serif}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:7px}button{border:0;background:none}header{height:110px;position:fixed;z-index:30;top:0;left:0;width:100%;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;background:linear-gradient(#163f3855,transparent)}.brand{font-family:Georgia,serif;font-size:45px;letter-spacing:-3px}.brand span{display:inline-block;font:11px "Microsoft JhengHei",sans-serif;letter-spacing:4px;margin-left:23px;vertical-align:middle}nav{display:flex;align-items:center;gap:30px}header nav{font-size:12px;letter-spacing:1px}.nav-go{border-bottom:1px solid #bdc9b577;padding:10px 0}.skip{position:fixed;top:-100px;z-index:100;background:#fff;color:#123;padding:15px}.skip:focus{top:8px}#journey{position:relative;height:760vh}.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:#a9bc8b;isolation:isolate}.sky{position:absolute;inset:0;background:radial-gradient(ellipse at 69% 41%,#ffedbb 0,#ced7a2 25%,#658b6c 65%,#224f44 100%)}.sun{position:absolute;left:67%;top:30%;width:110px;height:110px;border-radius:50%;background:#ffedbb;box-shadow:0 0 70px #ffe4a885}.distant{position:absolute;width:50%;height:38%;left:44%;bottom:0;border-radius:70% 80% 0 0;background:#698967;box-shadow:-100px 30px 0 #819b71}#forest{position:absolute;inset:0;perspective:1000px}.paper{position:absolute;left:67%;top:49%;width:max(125vw,170vh);height:auto;max-width:none;transform-origin:50% 46%;will-change:transform;pointer-events:none}.deer{position:absolute;width:170px;left:65%;top:53%;filter:drop-shadow(0 10px 7px #14382b44);transition:opacity .2s}.butterfly{position:absolute;width:40px;left:61%;top:39%;animation:fly 8s ease-in-out infinite}.b2{left:78%;top:65%;width:27px;animation-delay:-4s}.vignette{position:absolute;inset:0;background:linear-gradient(90deg,#123e38 0%,#123e38ee 22%,#123e3855 43%,transparent 65%),linear-gradient(0deg,#143b39b3,transparent 25%);pointer-events:none}.intro-mark{position:fixed;z-index:5;right:5vw;top:143px;font-size:9px;letter-spacing:4px;writing-mode:vertical-rl;color:#eee9cf99}.chapters{position:absolute;top:0;width:100%;height:100%}.chapter{height:126.666vh;position:relative;pointer-events:none}.copy{position:sticky;top:26vh;margin-left:8vw;width:410px;padding:10px 0;pointer-events:auto;opacity:0;visibility:hidden;transform:translateY(20px)}.chapter:first-child .copy{opacity:1;visibility:visible}.chapter-label{font-size:10px;letter-spacing:3px;color:#d1cba3;margin:0 0 26px}h1{font-family:"Noto Serif TC","Songti TC","PMingLiU",Georgia,serif;font-size:clamp(44px,4.6vw,72px);font-weight:400;line-height:1.35;letter-spacing:3px;margin:0 0 20px}.english{font-family:Georgia,serif;font-style:italic;font-size:19px;color:#dfd9bb}.description{max-width:290px;font-size:13px;line-height:2.1;letter-spacing:1px;color:var(--muted);margin:20px 0 28px}.cta{display:inline-flex;align-items:center;gap:35px;border-bottom:1px solid #b9c7ac88;font-size:12px;letter-spacing:2px;padding:12px 0}.cta span{font-size:21px;transition:transform .2s}.cta:hover span{transform:translate(3px,3px)}.restart{display:block;font-size:11px;margin-top:15px;color:var(--muted)}.bottom-bar{position:fixed;bottom:30px;left:5vw;right:5vw;display:flex;justify-content:space-between;align-items:center;z-index:10;font-size:9px;letter-spacing:2px;color:#d2d9c2}.scroll-hint span{margin-left:15px;font-size:18px}.chapter-nav{position:fixed;right:4vw;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:11px;z-index:20}.chapter-nav a{min-width:44px;min-height:30px;display:flex;align-items:center;gap:10px;justify-content:end}.chapter-nav span{font-size:9px;opacity:0}.chapter-nav i{display:block;width:5px;height:5px;border:1px solid #ede8ca88;border-radius:50%}.chapter-nav a[aria-current="step"] i{background:#efddb1;box-shadow:0 0 0 5px #d3d9a522}.chapter-nav a[aria-current="step"] span{opacity:1}.progress{position:fixed;bottom:0;height:2px;width:100%;background:#ffffff10;z-index:30}.progress i{display:block;height:100%;width:100%;background:#d1c898;transform:scaleX(0);transform-origin:left}.motes{position:absolute;inset:0;pointer-events:none}.motes i{position:absolute;width:3px;height:3px;border-radius:50%;background:#f5e3a3;box-shadow:0 0 12px #f9e7ac;animation:drift 7s infinite alternate}.flora{position:absolute;left:55%;bottom:15%;display:flex;gap:30px;align-items:end}.flower{width:9px;height:62px;background:#315444;transform-origin:bottom;animation:sway 4s infinite alternate;border-radius:100%}.flower:before{content:'';display:block;width:17px;height:17px;background:#efc5a2;border-radius:50%;box-shadow:12px 0 #efc5a2,6px -9px #efc5a2,6px 9px #efc5a2;transform:translateX(-9px)}#reading{position:relative;background:#efeddf;color:#244d40;padding:100px 8vw 40px;z-index:25}.reading-head{display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #244d4033;padding-bottom:35px}.reading-head p{font-size:10px;letter-spacing:3px}.reading-head h2{font:32px Georgia,"PMingLiU",serif}.reading-head button{font-size:12px}.notes{display:grid;grid-template-columns:repeat(3,1fr);gap:55px;padding:60px 0}.notes article span{font-size:11px;letter-spacing:2px}.notes h3{font:25px "PMingLiU",serif}.notes p{font-size:13px;line-height:2;color:#557060}footer{border-top:1px solid #244d4033;padding-top:25px;display:flex;justify-content:space-between;font-size:11px}.toast{position:fixed;bottom:60px;left:50%;transform:translateX(-50%);z-index:60;background:#efe8cf;color:#214b3f;padding:16px 24px;border-radius:3px;display:none}.reading-mode #journey{display:none}.reading-mode #reading{padding-top:140px;min-height:100vh}.reading-mode header{background:#163f38}.quiet .butterfly,.quiet .flower,.quiet .motes i{animation:none}@keyframes fly{0%,100%{transform:translate(0,0) rotate(-9deg) scaleX(.8)}50%{transform:translate(45px,-35px) rotate(12deg) scaleX(1)}}@keyframes sway{to{transform:rotate(9deg)}}@keyframes drift{to{transform:translate(15px,-30px);opacity:.3}}@media(max-width:760px){header{height:85px;padding:0 6vw}.brand{font-size:37px}.brand span{font-size:9px;margin-left:12px;letter-spacing:2px}header nav{gap:16px;font-size:10px}.nav-go{display:none}.paper{left:52%;top:42%;width:max(170vw,138vh)}.sun{left:48%;top:23%;width:70px;height:70px}.vignette{background:linear-gradient(0deg,#123e38 0%,#123e38ee 17%,#123e3866 46%,transparent 75%)}.copy{top:51vh;margin-left:8vw;width:82vw}h1{font-size:39px;line-height:1.25;margin-bottom:10px;letter-spacing:2px}h1 br{display:block}.chapter-label{font-size:8px;margin:0 0 12px;letter-spacing:2px}.english{font-size:15px;margin:0 0 10px}.description{font-size:12px;line-height:1.8;max-width:310px;margin:12px 0}.cta{padding:8px 0;font-size:11px}.chapter-nav{right:3vw;top:31%;gap:2px}.intro-mark{display:none}.bottom-bar{bottom:20px;font-size:8px;letter-spacing:1px}.bottom-bar>span:last-child{display:none}.deer{width:110px;top:31%;left:49%}.b1{top:22%;left:42%;width:30px}.b2{top:38%;left:68%}.flora{left:45%;bottom:53%;transform:scale(.65)}.reading-head{display:block}.notes{grid-template-columns:1fr;gap:28px;padding:35px 0}footer{gap:20px;line-height:1.8}.reading-head h2{font-size:28px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before{animation:none!important;transition:none!important}}html:not(.enhanced) #journey{height:auto}html:not(.enhanced) .stage{position:relative}html:not(.enhanced) .chapters{position:relative}html:not(.enhanced) .chapter{height:auto;padding:40px 0}html:not(.enhanced) .copy{position:relative;top:auto;opacity:1;visibility:visible}html:not(.enhanced) .bottom-bar,html:not(.enhanced) .chapter-nav{display:none}

@media(max-width:760px){.paper{min-height:110svh}.copy{top:50vh}}

.butterfly{will-change:transform}.floating-leaf{position:absolute;left:80%;top:24%;width:24px;height:45px;border-radius:100% 0 100% 0;background:#8d9e70;transform-origin:bottom;animation:sway 5s ease-in-out infinite alternate}.quiet .floating-leaf{animation:none}

.butterfly{will-change:transform}.floating-leaf{position:absolute;left:80%;top:24%;width:24px;height:45px;border-radius:100% 0 100% 0;background:#8d9e70;transform-origin:bottom;animation:sway 5s ease-in-out infinite alternate}.quiet .floating-leaf{animation:none}

/* Art edition 2 — textured illustration on six genuine SVG apertures. */
:root{--dark:#142e25;--muted:#c5ccb5}body{background:#142e25}header{background:linear-gradient(#102a2166,transparent)}
.stage{background:#122b22}.sky{background:#233c2b url('assets/forest-master.webp') no-repeat center / cover}.sun,.distant,.deer,.floating-leaf{display:none}
.paper{width:max(104vw,150vh);height:auto;aspect-ratio:3/2;left:69%;top:46%;transform-origin:69.66% 46%;overflow:hidden;mask-image:var(--cut);mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-image:var(--cut);-webkit-mask-size:100% 100%;background:#172f25;backface-visibility:hidden}
.art{position:absolute;width:100%;height:100%;object-fit:cover;pointer-events:none}.art.centered{left:19.66%}.art.master{left:0}
.vignette{background:linear-gradient(90deg,#102d26c9 0%,#102d2688 24%,#102d2633 37%,transparent 53%),linear-gradient(0deg,#112b2788,transparent 17%)}
.copy{width:390px;margin-left:7vw}.description{color:#d0d4bd;text-shadow:0 1px 8px #102a22}.english{color:#dedcc0}.chapter-label{color:#d2c69e}
.butterfly{width:32px;filter:drop-shadow(0 2px 2px #142c2855);left:64%;top:44%}.b2{width:22px;left:76%;top:64%;animation-duration:11s}
.flora{opacity:0!important}.motes i{width:2px;height:2px}.bottom-bar{color:#e0dfc9}.chapter-nav a{filter:drop-shadow(0 1px 2px #102a22)}
@media(max-width:760px){.paper{min-height:0;width:max(120vw,112svh);left:54%;top:34%;transform-origin:69.66% 46%}.sky{background-position:68% 30%;background-size:auto 112svh}.vignette{background:linear-gradient(0deg,#112d26 0%,#112d26f5 22%,#112d26b3 39%,#112d2633 57%,transparent 72%)}.copy{width:84vw;top:51vh;margin-left:8vw}.b1{top:30%;left:49%}.b2{top:41%;left:73%}header{background:linear-gradient(#102a21aa,transparent)}.chapter-nav{top:28%}}

.copy{width:440px}.chapter:nth-child(4) h1{font-size:clamp(42px,3.6vw,56px)}
.sky{background:#193226;overflow:hidden}.core-plane{position:absolute;width:max(104vw,150vh);aspect-ratio:3/2;left:69%;top:46%;transform:translate(-69.66%,-46%);overflow:hidden;background:#172f25;will-change:opacity}.core-plane .art{width:100%;height:100%}
@media(max-width:760px){.copy{width:84vw}.chapter:nth-child(4) h1{font-size:36px}.core-plane{width:max(120vw,112svh);left:54%;top:34%}}
/* Keep the far clearing behind all six moving paper planes. */
.sky{z-index:0;isolation:isolate}#forest{z-index:1}.butterfly,.motes,.flora{z-index:3}.vignette{z-index:4;pointer-events:none;background:linear-gradient(90deg,#102d26f2 0%,#102d26eb 18%,#102d26b3 29%,#102d2666 39%,transparent 55%),linear-gradient(0deg,#112b2788,transparent 17%)}
.art.centered{mask-image:linear-gradient(90deg,transparent,black 17%);-webkit-mask-image:linear-gradient(90deg,transparent,black 17%)}
@media(max-width:760px){.vignette{background:linear-gradient(0deg,#112d26 0%,#112d26f5 22%,#112d26b3 39%,#112d2633 57%,transparent 72%)}}

.sprig{position:absolute;right:3%;bottom:5%;width:190px;z-index:3;transform-origin:50% 95%;animation:sprig-sway 8s ease-in-out infinite alternate;will-change:transform;pointer-events:none}
@keyframes sprig-sway{from{transform:rotate(-9deg)}to{transform:rotate(-5deg)}}.quiet .sprig{animation:none}
header button{min-height:44px}
@media(max-width:760px){.sprig{right:-3%;bottom:45%;width:105px;opacity:.7}}
