:root{--paper: #efe8d8;--paper-deep: #e6dcc6;--ink: #2b2723;--ink-soft: #6f675c;--ink-faint: #a69d8e;--cinnabar: #a8382b;--serif-zh: "Songti SC", "Noto Serif SC", "Source Han Serif SC", "STSong", serif;--serif-en: "EB Garamond", "Cormorant Garamond", "Iowan Old Style", "Palatino", Georgia, serif;--sheet-ratio: 1.68;--u: min(1vw, 100vh * var(--sheet-ratio) / 100)}*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden}body{color:var(--ink);font-family:var(--serif-en);background-color:var(--paper);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='320' height='320'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9 .35' numOctaves='3' seed='7'/%3E%3CfeColorMatrix values='0 0 0 0 .32 0 0 0 0 .27 0 0 0 0 .2 0 0 0 .55 -.2'/%3E%3C/filter%3E%3Crect width='320' height='320' filter='url(%23f)' opacity='.5'/%3E%3C/svg%3E"),radial-gradient(120% 90% at 30% 20%,transparent 40%,var(--paper-deep) 130%)}p,h1{margin:0;font-weight:400}.world{position:fixed;inset:0}.gallery{position:absolute;inset:0;display:grid;place-items:center}.sheet{position:relative;width:calc(var(--u) * 100);aspect-ratio:var(--sheet-ratio)}.mark-head{position:absolute;left:0;right:0;top:6.5%;display:flex;justify-content:center;align-items:baseline;gap:calc(var(--u) * 1.1);transition:opacity .7s ease}.mark-zh{font-family:var(--serif-zh);font-size:calc(var(--u) * 1.75);font-weight:400;letter-spacing:.4em}.mark-en{font-size:calc(var(--u) * .95);font-style:italic;letter-spacing:.04em;color:var(--ink-soft)}.opening{position:absolute;padding:0;border:0;background:none;font:inherit;color:inherit;transform:rotate(var(--rotate, 0deg));outline:none;opacity:0;transition:opacity .9s ease;-webkit-tap-highlight-color:transparent}.opening--live{cursor:pointer;z-index:2}.opening-ink{position:absolute;inset:0;overflow:hidden;-webkit-mask:var(--brush) center / 100% 100% no-repeat;mask:var(--brush) center / 100% 100% no-repeat}.opening-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;opacity:.86;transition:opacity .6s ease,transform 1.2s cubic-bezier(.2,.6,.2,1)}.opening--live .opening-image{inset:auto;object-fit:fill;max-width:none;opacity:.94}.is-ready .opening{opacity:1;transition-delay:calc(var(--i) * .16s + .15s)}.is-ready .opening-ink{animation:lay-y 1.5s cubic-bezier(.3,.1,.2,1) both;animation-delay:calc(var(--i) * .16s + .15s)}@keyframes lay-y{0%{-webkit-mask-size:100% 0%;mask-size:100% 0%;-webkit-mask-position:center top;mask-position:center top}to{-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-position:center top;mask-position:center top}}.opening:hover .opening-image,.opening:focus-visible .opening-image{opacity:1}.opening--live:hover .opening-image,.opening--live:focus-visible .opening-image{transform:scale(1.025)}.opening-name{position:absolute;left:50%;top:calc(100% + var(--u) * 1.1);width:max-content;max-width:calc(var(--u) * 17);display:grid;justify-items:center;gap:calc(var(--u) * .3);text-align:center;transform:translate(-50%,calc(var(--u) * .5)) rotate(calc(var(--rotate, 0deg) * -1));opacity:0;pointer-events:none;transition:opacity .5s ease,transform .7s cubic-bezier(.2,.6,.2,1)}.opening-name-zh{font-family:var(--serif-zh);font-size:calc(var(--u) * 1.15);letter-spacing:.3em;margin-right:-.3em}.opening-name-by{font-family:var(--serif-zh);font-size:calc(var(--u) * .72);letter-spacing:.22em;margin-right:-.22em;color:var(--ink-soft)}.opening-name-en{font-size:calc(var(--u) * .8);font-style:italic;color:var(--ink-faint)}.opening:hover .opening-name,.opening.is-hover .opening-name,.opening:focus-visible .opening-name{opacity:1;transform:translate(-50%) rotate(calc(var(--rotate, 0deg) * -1))}.opening--live .opening-name-zh:before{content:"";display:inline-block;width:calc(var(--u) * .42);height:calc(var(--u) * .42);margin-right:calc(var(--u) * .6);vertical-align:.18em;background:var(--cinnabar)}.credits{position:absolute;left:0;right:0;bottom:2.2%;display:grid;gap:calc(var(--u) * .25);text-align:center;font-size:calc(var(--u) * .66);letter-spacing:.04em;color:var(--ink-faint);opacity:.8;transition:opacity .7s ease}.credits-rights{color:var(--ink-soft)}.opening--locked{cursor:default}.opening--locked .opening-image{opacity:.78}.opening--locked:hover .opening-image,.opening--locked:focus-visible .opening-image{opacity:.78;transform:none}.opening--locked .opening-name{display:none}.opening-lock{position:absolute;left:50%;top:50%;width:calc(var(--u) * 2.8);height:calc(var(--u) * 2.8);transform:translate(-50%,-50%);color:#e2dcceeb;filter:drop-shadow(0 1px 2px rgba(20,14,8,.35));pointer-events:none}.opening-lock svg{display:block;width:100%;height:100%}.is-entering .opening:not(.is-travelling),.is-inside .opening:not(.is-travelling),.is-entering .mark-head,.is-inside .mark-head,.is-entering .credits,.is-inside .credits,.is-entering .opening-name,.is-inside .opening-name{opacity:0;transition-delay:0s;pointer-events:none}.opening.is-travelling{position:fixed;z-index:5;transform:none;transition:none;cursor:default;pointer-events:none}.opening.is-travelling .opening-ink{animation:none}.opening.is-travelling .opening-image{opacity:1;transform:none;transition:opacity .5s ease}.is-inside .gallery{visibility:hidden}.is-leaving .gallery{visibility:visible}.is-leaving .explore{pointer-events:none}.is-leaving .leave,.is-leaving .inside-note{opacity:0!important;transition:opacity .4s ease}.explore{position:absolute;inset:0;overflow:hidden;visibility:hidden;touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none}.is-on .explore{visibility:visible}.explore.is-dragging{cursor:grabbing}.explore-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.explore-marks{position:absolute;inset:0;pointer-events:none}.mark{position:absolute;left:0;top:0;width:0;height:0;padding:0;border:0;background:none;font:inherit;color:inherit;cursor:pointer;pointer-events:auto;opacity:0;transition:opacity 1.2s ease;transition-delay:calc(var(--i) * .12s);outline:none}.is-awake .mark{opacity:1}.mark-dot{position:absolute;left:-5px;top:-5px;width:10px;height:10px;border-radius:50%;background:var(--cinnabar);box-shadow:0 0 0 3px #efe8d88c}.mark-dot:after{content:"";position:absolute;inset:-9px;border-radius:50%;border:1px solid rgba(168,56,43,.55);animation:breathe 4.2s ease-in-out infinite;animation-delay:calc(var(--i) * .7s)}@keyframes breathe{0%,to{transform:scale(.7);opacity:0}40%{opacity:1}70%{transform:scale(1.25);opacity:0}}.mark-label{position:absolute;left:16px;top:-.7em;padding:3px 9px;white-space:nowrap;background:#efe8d8e6;font-size:12.5px;letter-spacing:.06em;color:var(--ink);opacity:0;transform:translate(-4px);transition:opacity .35s ease,transform .35s ease;pointer-events:none}.mark:hover .mark-label,.mark:focus-visible .mark-label{opacity:1;transform:none}.mark.is-open,.is-looking .mark:not(.is-open){opacity:0;pointer-events:none}.story{position:absolute;top:50%;width:min(360px,calc(100vw - 48px));padding:26px 28px 20px;background:var(--paper);color:var(--ink);box-shadow:0 18px 50px #140e0847;transform:translateY(-50%) translateY(10px);opacity:0;visibility:hidden;transition:opacity .7s ease,transform .7s cubic-bezier(.2,.6,.2,1),visibility 0s linear .7s;cursor:auto}.story[data-side=right]{right:clamp(20px,5vw,80px)}.story[data-side=left]{left:clamp(20px,5vw,80px)}.story.is-shown{opacity:1;visibility:visible;transform:translateY(-50%);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.6,.2,1),visibility 0s}.story-close{position:absolute;right:10px;top:8px;width:30px;height:30px;border:0;background:none;font:22px/1 var(--serif-en);color:var(--ink-faint);cursor:pointer}.story-close:hover{color:var(--ink)}.story-eyebrow{font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--cinnabar)}.story-title{margin:6px 0 12px;font-size:23px;line-height:1.2;font-weight:400}.story-body p{margin:0 0 9px;font-size:15px;line-height:1.5;color:var(--ink-soft)}.story-foot{display:flex;justify-content:space-between;align-items:baseline;margin-top:14px;padding-top:10px;border-top:1px solid rgba(43,39,35,.12);font-size:12.5px;color:var(--ink-faint)}.story-next{padding:0;border:0;background:none;font:inherit;font-style:italic;color:var(--ink);cursor:pointer}.story-next:hover{color:var(--cinnabar)}.progress{position:absolute;left:50%;bottom:clamp(8px,1.3vw,16px);display:flex;gap:14px;transform:translate(-50%);opacity:0;transition:opacity 1s ease 1s}.is-awake .progress{opacity:1}.progress-dot{position:relative;width:22px;height:22px;padding:0;border:0;background:none;cursor:pointer;outline:none}.progress-dot:after{content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;border-radius:50%;border:1px solid var(--ink-faint);background:#efe8d8b3;transform:translate(-50%,-50%);transition:background .4s ease,border-color .4s ease,transform .3s ease}.progress-dot:hover:after,.progress-dot:focus-visible:after{transform:translate(-50%,-50%) scale(1.35);border-color:var(--ink)}.progress-dot.is-open:after{transform:translate(-50%,-50%) scale(1.35);background:var(--cinnabar);border-color:var(--cinnabar)}.progress-thumb{position:absolute;left:50%;bottom:calc(100% + 10px);width:168px;padding:5px 5px 7px;background:var(--paper);box-shadow:0 10px 30px #140e084d;transform:translate(-50%,6px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s ease,transform .3s ease,visibility 0s linear .3s}.progress-thumb img{display:block;width:100%;aspect-ratio:4 / 3;object-fit:cover}.progress-thumb span{display:block;margin-top:5px;font-size:11.5px;line-height:1.3;letter-spacing:.02em;text-align:center;color:var(--ink)}.progress-dot:hover .progress-thumb,.progress-dot.is-hover .progress-thumb,.progress-dot:focus-visible .progress-thumb{opacity:1;visibility:visible;transform:translate(-50%);transition:opacity .3s ease,transform .3s ease,visibility 0s}.explore-hint{position:absolute;right:clamp(18px,2.4vw,40px);bottom:clamp(16px,2.4vw,32px);display:grid;justify-items:end;gap:2px;font-size:12.5px;font-style:italic;letter-spacing:.03em;color:var(--ink-soft);opacity:0;pointer-events:none}.is-awake .explore-hint{animation:note 9s ease .6s both}.is-looking .explore-hint{opacity:0!important;animation:none}.leave{position:absolute;left:clamp(18px,2.4vw,40px);top:clamp(16px,2.4vw,36px);z-index:6;display:flex;align-items:baseline;gap:9px;padding:7px 12px 7px 10px;border:0;border-radius:2px;background:#efe8d8d9;font:inherit;color:var(--ink);cursor:pointer;opacity:0;visibility:hidden;transition:opacity .8s ease,visibility 0s linear .8s}.leave-en{font-size:13.5px;letter-spacing:.08em}.leave-zh{font-family:var(--serif-zh);font-size:12px;letter-spacing:.25em;color:var(--ink-soft)}.leave:before{content:"";width:6px;height:6px;margin-right:2px;align-self:center;background:var(--cinnabar)}.is-inside .leave{opacity:.8;visibility:visible;transition:opacity 1.2s ease 1.6s,visibility 0s}.is-inside .leave:hover,.is-inside .leave:focus-visible{opacity:1;outline:none;transition-delay:0s}.inside-note{position:absolute;left:clamp(18px,2.4vw,40px);bottom:clamp(16px,2.4vw,32px);z-index:6;padding:5px 11px;background:#efe8d8d9;font-size:12.5px;letter-spacing:.03em;color:var(--ink-soft);opacity:0;pointer-events:none}.inside-note i{color:var(--ink)}.sound-toggle{position:absolute;right:clamp(18px,2.4vw,40px);top:clamp(16px,2.4vw,36px);z-index:6;width:34px;height:34px;padding:0;border:0;border-radius:2px;background:#efe8d8d9;color:var(--ink);cursor:pointer;opacity:0;visibility:hidden;transition:opacity .8s ease,visibility 0s linear .8s}.sound-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}.sound-toggle .sound-body{fill:currentColor;stroke:none}.sound-toggle .sound-slash{display:none;stroke:var(--cinnabar)}.sound-toggle .sound-wave{transition:opacity .3s ease}.sound-toggle.is-muted .sound-wave{opacity:0}.sound-toggle.is-muted .sound-slash{display:block}.is-awake .sound-toggle{opacity:.55;visibility:visible;transition:opacity 1.2s ease 1.6s,visibility 0s}.is-awake .sound-toggle:hover,.is-awake .sound-toggle:focus-visible{opacity:1;outline:none;transition-delay:0s}.is-inside .inside-note{animation:note 9s ease 1.4s both}@keyframes note{0%,to{opacity:0}12%,72%{opacity:.9}}.is-still .opening-ink{animation:none!important}.is-still .opening{transition:none!important}@media(prefers-reduced-motion:reduce){.is-ready .opening-ink{animation:none}}.about-open{position:absolute;left:clamp(18px,2.4vw,40px);top:clamp(16px,2.4vw,36px);z-index:6;display:flex;align-items:baseline;gap:9px;padding:7px 12px 7px 10px;border:0;border-radius:2px;background:#efe8d8d9;font:inherit;font-size:13.5px;letter-spacing:.08em;color:var(--ink);cursor:pointer;opacity:0;visibility:hidden;transition:opacity .8s ease,visibility 0s linear .8s}.about-open:before{content:"";width:6px;height:6px;margin-right:2px;align-self:center;background:var(--cinnabar)}.is-ready .about-open,.is-ready .sound-toggle--gallery{opacity:.8;visibility:visible;transition:opacity 1.2s ease .6s,visibility 0s}.is-ready .sound-toggle--gallery{opacity:.55}.is-ready .about-open:hover,.is-ready .about-open:focus-visible,.is-ready .sound-toggle--gallery:hover,.is-ready .sound-toggle--gallery:focus-visible{opacity:1;outline:none;transition-delay:0s}.is-entering .about-open,.is-inside .about-open,.is-entering .sound-toggle--gallery,.is-inside .sound-toggle--gallery{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .5s ease,visibility 0s linear .5s}.about{position:absolute;inset:0;z-index:8;display:grid;place-items:center;padding:clamp(14px,3vh,32px) 16px}.about[hidden]{display:none}.about-veil{position:absolute;inset:0;background:#e6dcc68c;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);opacity:0;transition:opacity .6s ease}.about.is-open .about-veil{opacity:1}.scroll{--rod: 14px;position:relative;width:min(540px,92vw);max-height:calc(100vh - (2*clamp(14px,3vh,32px)));display:flex;flex-direction:column;align-items:center;margin:0;opacity:0;transform:translateY(-10px);transition:opacity .5s ease,transform .6s ease}.about.is-open .scroll{opacity:1;transform:none}.scroll-rod{position:relative;z-index:2;width:calc(100% + 28px);height:var(--rod);border-radius:999px;background:linear-gradient(#5a4a3e,#2d241f 55%,#4a3b31);box-shadow:0 1px 3px #2b272359;flex:none}.scroll-rod:before,.scroll-rod:after{content:"";position:absolute;top:-1px;width:18px;height:calc(var(--rod) + 2px);border-radius:999px;background:linear-gradient(#f3ecdc,#cdbf9f)}.scroll-rod:before{left:-2px}.scroll-rod:after{right:-2px}.scroll-body{display:grid;grid-template-rows:0fr;width:100%;min-height:0;transition:grid-template-rows 1.1s cubic-bezier(.3,.7,.2,1)}.about.is-open .scroll-body{grid-template-rows:1fr}.scroll-paper{min-height:0;overflow:auto;overscroll-behavior:contain;padding:34px 44px 30px;border-left:12px solid #cdbf9f;border-right:12px solid #cdbf9f;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='320' height='320'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9 .35' numOctaves='3' seed='3'/%3E%3CfeColorMatrix values='0 0 0 0 .32 0 0 0 0 .27 0 0 0 0 .2 0 0 0 .5 -.2'/%3E%3C/filter%3E%3Crect width='320' height='320' filter='url(%23f)' opacity='.4'/%3E%3C/svg%3E"),#f4eee0;box-shadow:inset 0 0 40px #a69d8e2e;scrollbar-width:thin;scrollbar-color:var(--ink-faint) transparent}.scroll-paper>*{opacity:0;transition:opacity .6s ease .1s}.about.is-open .scroll-paper>*{opacity:1;transition-delay:.5s}.about-close{position:absolute;right:18px;top:18px;z-index:3;width:30px;height:30px;padding:0;border:0;background:none;font:inherit;font-size:24px;line-height:1;color:var(--ink-faint);cursor:pointer}.about-close:hover,.about-close:focus-visible{color:var(--ink);outline:none}.scroll-head{text-align:center;margin-bottom:26px}.scroll-title{margin:0;font-size:26px;font-weight:400;letter-spacing:.12em}.scroll-section+.scroll-section{margin-top:22px;padding-top:20px;border-top:1px solid rgba(166,157,142,.35)}.scroll-section h3{margin:0 0 10px;font-size:13px;font-weight:400;font-style:italic;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}.scroll-section p,.scroll-list li{margin:0 0 10px;font-size:14.5px;line-height:1.6;color:var(--ink)}.scroll-list{margin:0;padding-left:1.1em}.scroll-list li::marker{color:var(--cinnabar)}@media(max-width:600px){.scroll-paper{padding:28px 22px 24px;border-width:8px}.about-close{right:10px;top:10px}}@media(prefers-reduced-motion:reduce){.scroll-body{transition-duration:.3s}.scroll{transition-duration:.2s}}