/* Selected motion studies: native scroll, separate transforms for each layer. */
.intro__lid{top:0;bottom:0;width:50%;height:100%;border:0;background:var(--paper-2);transition:transform 1.2s cubic-bezier(.76,0,.24,1)}
.intro__lid--top{left:0;right:auto;border-right:1px solid #ad5b4566}.intro__lid--bot{left:auto;right:0;border-left:1px solid #ad5b4566}
.intro__lid::after{content:"";position:absolute;inset:24px;border:1px solid #b74a3655;background:repeating-linear-gradient(90deg,transparent 0 80px,#b74a3612 81px 82px)}
.intro.done{background:transparent;opacity:1;transition:none}.intro.done .intro__lid--top{transform:translateX(-101%)}.intro.done .intro__lid--bot{transform:translateX(101%)}
.entrance-light{position:absolute;inset:-100%;background:linear-gradient(110deg,transparent 44%,#ffe9bb70 50%,transparent 56%);transform:translateX(-70%);pointer-events:none;z-index:4;opacity:0}.intro.done .entrance-light{animation:entrance-light 1.2s ease both}@keyframes entrance-light{0%{opacity:0}30%{opacity:1}100%{transform:translateX(70%);opacity:0}}
.title.word-anim{perspective:650px}.title .ch{transform-origin:center bottom}
.hero-spotlight{position:absolute;inset:0;pointer-events:none;z-index:0;background:repeating-linear-gradient(90deg,transparent 0 56px,#b74a3640 57px 58px),repeating-linear-gradient(0deg,transparent 0 56px,#b74a3640 57px 58px);mask-image:radial-gradient(circle 190px at var(--spot-x,75%) var(--spot-y,35%),#000,transparent);opacity:.65}
.hero-spotlight::after{content:"1999 / 城院之窗";position:absolute;right:9%;top:47%;font:italic 32px var(--serif);color:#8f6748}
.hero-cosmos{position:absolute;right:3%;top:53%;width:240px;height:180px;z-index:1;pointer-events:none}.hero-cosmos canvas{width:100%;height:100%;display:block}.hero-cosmos span{position:absolute;bottom:0;inset-inline:0;text-align:center;color:#78664f;font:9px var(--mono);letter-spacing:.18em}
.voice-wave{position:relative;width:min(460px,100%);height:55px;margin-top:24px;display:flex;align-items:center;gap:14px;color:#79654d}.voice-wave span{font:9px/1.5 var(--mono);letter-spacing:.08em;flex:0 0 64px}.voice-wave canvas{width:calc(100% - 78px);height:42px;display:block}
.trail-canvas{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:990}
.chapter-ghost{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}.chapter-ghost span{position:absolute;top:24px;left:0;white-space:nowrap;font:italic clamp(85px,15vw,220px)/1 var(--serif);letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1px #b74a3626}
.sec>.wrap,.elders-inner{position:relative;z-index:1}
.story-route{position:fixed;left:8px;top:25%;width:14px;height:50vh;z-index:150;pointer-events:none;opacity:0;transition:opacity .3s}.loaded .story-route{opacity:.6}.story-route svg{width:100%;height:100%;overflow:visible}.route-base{stroke:#9b806833;stroke-width:1;fill:none}.route-progress{stroke:var(--accent);stroke-width:2;fill:none;stroke-dasharray:1000;stroke-dashoffset:calc(1000 - var(--route-progress,0)*1000)}.story-route circle{fill:var(--paper);stroke:var(--accent);stroke-width:1}.mobile-route{display:none}
.gallery{perspective:1200px}.gph{translate:0 0;rotate:0deg;transition:translate .35s ease,rotate .35s ease,box-shadow .35s ease;border:6px solid #fff;border-bottom-width:28px;box-shadow:0 10px 25px #211b121a;background:#fff;isolation:isolate}
.gph .ph-cap{transform:none;opacity:1;bottom:8px;left:12px;color:#fff;mix-blend-mode:normal;text-shadow:0 1px 5px #000;letter-spacing:.08em;font-size:10px}.gph .ph-idx{z-index:4}.photo-open{position:absolute;inset:0;z-index:5;background:transparent;border:0;color:#fff;cursor:zoom-in}.photo-open span{position:absolute;right:10px;bottom:10px;font-size:10px;background:#211e1ac9;padding:7px 9px}.photo-open:focus-visible{outline:3px solid var(--accent);outline-offset:-5px}
@media(hover:hover) and (pointer:fine){.gph:hover{translate:0 -10px;rotate:-1.3deg;box-shadow:0 25px 40px #211b1233;z-index:6}}
.photo-dialog{width:min(1060px,calc(100vw - 24px));max-height:calc(100dvh - 24px);margin:auto;padding:48px 20px 20px;background:#201e1b;color:var(--paper);border:1px solid #b99c6366;overflow:auto}.photo-dialog::backdrop{background:#12110fe8;backdrop-filter:blur(10px)}.photo-dialog img{display:block;width:100%;height:min(66vh,660px);object-fit:contain}.photo-dialog .photo-close{position:absolute;right:10px;top:7px;background:none;border:0;color:var(--paper);font-size:27px;width:38px;height:38px}.photo-controls{display:flex;align-items:center;gap:18px;justify-content:space-between;margin-top:16px}.photo-controls p{font-size:12px;line-height:1.6;text-align:center;margin:0}.photo-controls button{border:1px solid #bda98266;background:none;color:var(--paper);width:44px;height:44px;flex:0 0 44px;font-size:20px}.photo-controls button:focus-visible,.photo-close:focus-visible{outline:2px solid #d8b779;outline-offset:3px}
.photo-modal-open{overflow:hidden}.photo-modal-open .cursor,.photo-modal-open .cursor__dot{visibility:hidden}html.cursor-on .photo-dialog,html.cursor-on .photo-dialog button{cursor:auto}
.mcard.has-flip{padding:0;border:0;background:transparent;perspective:1000px;display:flex;flex-direction:column;overflow:visible}.flip-inner{display:grid;flex:1;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.2,.7,.2,1)}.has-flip.is-flipped .flip-inner{transform:rotateY(180deg)}.flip-front,.flip-back{grid-area:1/1;padding:28px;min-height:260px;border:1px solid var(--line);backface-visibility:hidden;background:var(--paper);display:flex;flex-direction:column;justify-content:center;position:relative}.flip-front .top{margin-bottom:26px}.flip-front .en-tag{position:static;margin-top:26px}.flip-front .flip-hint{font:italic 26px var(--serif);color:var(--accent);margin:0}.flip-back{transform:rotateY(180deg);background:#a64230;border-color:#a64230;color:var(--paper)}.flip-back .quote{color:var(--paper);font-size:16px;line-height:1.95;margin:12px 0}.flip-back .quote:before{color:#e7cba0}.flip-sign{font-size:12px;color:#f1d8ab}.flip-toggle{width:100%;padding:13px 18px;background:var(--ink);color:var(--paper);border:0;font-size:12px;letter-spacing:.06em;position:relative;z-index:1}.flip-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.elders-wrap{background:radial-gradient(ellipse at 80% 0,#64503330,transparent 65%),var(--ink)}.elder-card{position:relative;border-color:#cfaf7255}.elder-card::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:3;background:linear-gradient(110deg,transparent 20%,#e9c27728 45%,transparent 70%);background-size:260% 100%;background-position:160% 0;opacity:0}.elder-card.gold-lit::after{animation:elder-shine 1.9s ease both}.elder-card .body{background:radial-gradient(circle at var(--gold-x,80%) var(--gold-y,0%),#b7944940,transparent 70%)}.elder-card .name{color:#e3c28e}@keyframes elder-shine{15%{opacity:1}100%{background-position:-100% 0;opacity:0}}@media(hover:hover){.elder-card:hover::after{opacity:.6;background-position:50% 0;transition:background-position .7s,opacity .4s}}
#join{background:#211e1b;color:var(--paper);isolation:isolate;overflow:hidden}#join .title{color:var(--paper)}#join .title em,#join .sec-head .tag,#join .sec-head .num,#join .hi,#join .perks .n{color:#e1bb7c}#join .lede,#join .perks .t,#join .join-oneliner,#join .qr-label{color:var(--paper)}#join .perks li{border-color:#e2c49430}#join .perk-hi{background:#ddae5512}#join .qr-help,#join .qr-expiry{color:#d2c3a9}#join .qr-save{color:#edc98d}.join-halo{position:absolute;inset:0;background:radial-gradient(ellipse at 75% 90%,#9e6d304d,transparent 65%);pointer-events:none;opacity:0;transition:opacity 1.3s}.join-lit .join-halo{opacity:1}.final-invitation{font:400 clamp(26px,3.8vw,48px)/1.55 var(--han);max-width:900px;margin:0 0 52px}.final-invitation em{color:#e1bb7c;font-style:normal}.join-spark{position:fixed;left:50%;top:50%;color:#d6af64;pointer-events:none;z-index:1001;font-size:17px;animation:join-spark 1.15s ease-out both}@keyframes join-spark{to{transform:translate(var(--spark-x),var(--spark-y)) rotate(140deg);opacity:0}}
.motion-paused .voice-seal svg,.motion-paused .ribbon-track,.motion-paused .grid-hint span::before{animation-play-state:paused!important}
@media(max-width:1100px){.hero-cosmos{width:180px;height:160px;right:2%;top:59%}}
@media(max-width:760px){.hero-cosmos{position:relative;inset:auto;width:100%;height:140px;margin-top:18px}.hero-spotlight{mask-image:radial-gradient(circle 160px at var(--spot-x,70%) var(--spot-y,25%),#000,transparent);opacity:.38}.hero-spotlight::after{font-size:22px;right:18px;top:50%}.voice-wave{height:44px;margin-top:20px}.voice-wave canvas{height:34px}.story-route{display:none}.mobile-route{display:block;position:fixed;top:0;left:0;height:3px;width:100%;background:#d4b88844;z-index:999;pointer-events:none}.mobile-route::after{content:"";display:block;height:100%;background:var(--accent);transform-origin:left;transform:scaleX(var(--route-progress,0))}.chapter-ghost span{font-size:94px;top:24px}.gph{border-width:4px;border-bottom-width:23px}.photo-dialog{padding:44px 10px 14px}.photo-dialog img{height:min(58dvh,540px)}.photo-controls{gap:8px}.photo-controls p{font-size:11px}.flip-front,.flip-back{padding:24px;min-height:245px}.flip-back .quote{font-size:15px}.final-invitation{margin-bottom:34px}.intro__lid::after{inset:12px;background:repeating-linear-gradient(90deg,transparent 0 44px,#b74a3612 45px 46px)}}
@media(prefers-reduced-motion:reduce){.entrance-light,.trail-canvas,.join-spark,.chapter-ghost{display:none}.intro.done .intro__lid{transition:none}.flip-inner{transition:none}.join-halo{opacity:1}.hero-spotlight{display:none}.gold-lit::after{animation:none!important}.gph{transition:none}.voice-seal svg,.ribbon-track{animation:none!important}}
.gallery{overflow:clip;overflow-clip-margin:12px}
.intro.done .intro__enter{animation:none;opacity:0}
.mcard.has-flip{gap:0}.mcard .flip-front .en-tag{color:#716a60}.flip-back .quote::after{color:#e7cba0}
html.reduce .cursor,html.reduce .cursor__dot{display:none}html.reduce.cursor-on,html.reduce.cursor-on a,html.reduce.cursor-on button{cursor:auto}