@font-face{font-family:Fraunces;src:url(fonts/display.woff2) format('woff2');font-weight:100 900;font-display:swap}@font-face{font-family:Newsreader;src:url(fonts/body.woff2) format('woff2');font-weight:200 800;font-display:swap}@font-face{font-family:Caveat;src:url(fonts/hand.woff2) format('woff2');font-weight:400 700;font-display:swap}
:root{--paper:#f6f2e9;--ink:#344740;--muted:#738077;--px:0;--py:0;--room-scale:1;--room-x:0px;--room-y:0px;--room-opacity:1;--land-scale:1;--land-y:0px;--front-scale:1;--front-y:0px;--front-opacity:1;--sunset:0;--paper:0;--opening:1;--caption:0;color-scheme:light}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Newsreader,Georgia,serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:2px solid #536d9a;outline-offset:7px}.skip-link{position:fixed;top:-80px;left:20px;z-index:100;background:var(--paper);padding:16px}.skip-link:focus{top:20px}.intro-header{position:absolute;top:0;left:0;width:100%;padding:32px 4%;display:flex;align-items:start;justify-content:space-between;z-index:20}.small-brand{font-family:Fraunces,serif;font-size:23px;letter-spacing:.18em}.small-brand span{display:block;letter-spacing:.02em;font-family:Newsreader,serif;font-style:italic;font-size:13px;margin-top:4px}.skip-intro{font-size:15px;padding-top:8px}.skip-intro span{margin-left:14px}.journey{height:620vh;position:relative}.stage{height:100svh;position:sticky;top:0;overflow:hidden;background:#e4d8c1;isolation:isolate}.world,.room-camera,.room,.landscape,.outdoor-front{position:absolute;inset:0}.depth{transform:translate3d(calc(var(--px) * var(--depth,0) * -1px),calc(var(--py) * var(--depth,0) * -.48px),0);will-change:transform}.landscape{inset:-4%;scale:var(--land-scale);translate:0 var(--land-y);transform-origin:56% 44%}.landscape img{width:100%;height:100%;object-fit:cover}.room-camera{transform:translate3d(var(--room-x),var(--room-y),0) scale(var(--room-scale));transform-origin:53% 30%;opacity:var(--room-opacity);will-change:transform,opacity}.room{inset:-3%}.room-art,.curtain{position:absolute;width:100%;height:100%;object-fit:fill}.curtain{transform-origin:50% 0;animation:curtain-breeze 7s ease-in-out infinite alternate}.curtain-left{clip-path:polygon(14% 0,24% 0,24% 18%,22% 48%,20% 64%,13% 64%);transform-origin:19% 0}.curtain-right{clip-path:polygon(82% 0,91% 0,91% 75%,83% 75%,82% 45%);animation-delay:-3s;transform-origin:87% 0}.monitor{position:absolute;left:2.6%;top:30%;height:41%;width:auto;filter:drop-shadow(2px 6px 3px #5a554431)}.monitor-light{position:absolute;width:3px;height:3px;border-radius:50%;background:#9be4b1;left:11%;top:36%;box-shadow:0 0 5px #b3f9c2;animation:pulse 1.3s ease-in-out infinite}.outdoor-front{transform:translateY(var(--front-y)) scale(var(--front-scale));opacity:var(--front-opacity);transform-origin:58% 65%;will-change:transform,opacity}.bench-position{position:absolute;left:52%;bottom:5%;width:34%;max-width:640px}.bench{width:100%;display:block;transform-origin:55% 85%;animation:companionship 8s ease-in-out infinite}.tree-position{position:absolute;left:-12%;bottom:-8%;width:83%;height:105%}.willow{width:100%;height:100%;object-fit:contain;object-position:left bottom;transform-origin:14% 94%;animation:tree-breeze 10s ease-in-out infinite alternate}.water-shimmer{position:absolute;left:0;right:0;top:56%;height:32%;opacity:.12;background:repeating-linear-gradient(176deg,transparent 0 12px,#ffe5be 13px 14px,transparent 15px 27px);mask-image:linear-gradient(transparent,#000,transparent);animation:water 14s ease-in-out infinite alternate}.sunset-wash{position:absolute;inset:0;background:radial-gradient(ellipse at 56% 44%,#ffe6c5 0%,#f4c3ba 36%,#b4accb 100%);opacity:var(--sunset)}.paper-wash{position:absolute;inset:0;background:var(--paper);opacity:var(--paper)}.grain{position:absolute;inset:0;opacity:.065;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' 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%3Cpath fill='%23665342' filter='url(%23n)' opacity='.6' d='M0 0h160v160H0z'/%3E%3C/svg%3E")}.opening-copy{position:absolute;left:50%;top:22%;width:80%;transform:translate(-50%,0);text-align:center;color:#fff9ed;opacity:var(--opening);text-shadow:0 2px 20px #604b3840;pointer-events:none}.eyebrow{font:500 11px/1.5 Fraunces,serif;letter-spacing:.22em}.opening-copy h1{font:400 clamp(80px,12vw,190px)/1 Fraunces,serif;letter-spacing:.1em;margin:15px 0 10px;padding-left:.1em}.opening-line{font-size:clamp(21px,2.5vw,35px);line-height:1.22;margin:0}.opening-line em{font-weight:300}.scroll-invitation{position:absolute;bottom:35px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:12px;color:white;text-shadow:0 1px 8px #4e4737;opacity:var(--opening);font:400 24px Caveat,cursive}.scroll-invitation i{height:38px;width:1px;background:#fff;transform-origin:top;animation:invitation 2.5s ease-in-out infinite}.scene-caption{position:absolute;left:8%;top:17%;opacity:var(--caption);color:#fff9ee;text-shadow:0 2px 24px #45433366}.caption-index{font:11px Fraunces,serif;letter-spacing:.18em}.scene-caption p{font-size:clamp(26px,3.8vw,56px);line-height:1.16;max-width:600px}.journey-progress{position:absolute;bottom:38px;right:4%;height:80px;width:1px;background:#fff5}.journey-progress span{display:block;background:#fff;width:100%;height:0}.scene-label{position:absolute;left:4%;bottom:42px;color:#fff;letter-spacing:.2em;font-size:9px;text-shadow:0 1px 5px #555;opacity:calc(1 - var(--paper))}.first-step{position:absolute;top:70vh}.leaves{position:absolute;inset:0;overflow:hidden}.leaf{position:absolute;top:8%;left:var(--left);width:9px;height:5px;border-radius:90% 0 90% 0;background:var(--leaf-color);animation:fall var(--duration) linear infinite;animation-delay:var(--delay);opacity:0}.dock{position:fixed;z-index:40;left:50%;top:20px;transform:translate(-50%,-140%);display:flex;align-items:center;gap:30px;background:#fffffba8;border:1px solid #ffffffc7;border-radius:50px;padding:10px 25px 10px 13px;box-shadow:0 8px 40px #455b5410,inset 0 1px 0 #fff8;backdrop-filter:blur(22px) saturate(1.25);-webkit-backdrop-filter:blur(22px) saturate(1.25);transition:transform .55s cubic-bezier(.16,1,.3,1),opacity .4s;opacity:0;white-space:nowrap;font-size:15px}.dock.visible{transform:translate(-50%,0);opacity:1}.dock-logo{width:87px;height:40px;overflow:hidden;position:relative}.dock-logo img{position:absolute;width:100%;height:auto;top:50%;transform:translateY(-50%) scale(1.1)}.dock-divider{height:25px;width:1px;background:#64706426}.dock-replay{border-left:1px solid #64706426;padding-left:25px;color:#697770}.dock a:hover{color:#5569a6}.dock-replay span{margin-left:10px}.content-section{padding:140px max(8%,24px) 100px;min-height:90vh;background:var(--paper);position:relative;scroll-margin-top:0}.content-section>.eyebrow{color:#748776}.content-section h2{font:350 clamp(42px,6.7vw,104px)/1.07 Fraunces,serif;letter-spacing:-.055em;margin:32px 0 70px}.content-section h2 em{color:#82927e;font-weight:300}.content-bottom{display:flex;align-items:center;justify-content:space-between;gap:30px;border-top:1px solid #34474025;padding-top:35px}.small-flower{font-size:80px;color:#a6ad91;font-weight:200}.content-bottom p{font-size:21px;line-height:1.45;margin:0}.content-bottom p span{color:var(--muted);font-style:italic;font-size:18px}.future-section{border-top:1px solid #34474016;margin:0 max(8%,24px);padding:80px 0 100px;position:relative}.future-section h2{font:300 clamp(40px,5vw,68px)/1.1 Fraunces,serif;letter-spacing:-.04em;margin:25px 0}.future-section>p{font-size:21px;max-width:390px;line-height:1.5;color:var(--muted)}.coming-label{display:inline-block;font-size:13px;color:#7c867b;border:1px solid #b2bcab;border-radius:30px;padding:8px 15px;margin:15px 0}.return-link{display:block;margin-top:50px;font-size:18px}.return-link span{margin-left:20px}footer{padding:25px 8%;border-top:1px solid #34474020;display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--muted)}footer>span:first-child{font-family:Fraunces;letter-spacing:.2em;font-size:18px}footer p{font-style:italic}.motion-toggle{position:fixed;z-index:45;bottom:23px;right:24px;display:flex;align-items:center;gap:8px;background:#f7f3e3c9;border:1px solid #fff8;border-radius:30px;padding:9px 14px;color:#455747;font-size:12px;cursor:pointer;backdrop-filter:blur(12px)}.motion-icon{font-size:14px}.paused *,.paused *::before,.paused *::after{animation-play-state:paused!important}
@keyframes curtain-breeze{from{transform:skewX(-.6deg) scaleX(.99)}to{transform:skewX(1.2deg) scaleX(1.025)}}@keyframes tree-breeze{from{transform:rotate(-.45deg) skewX(-.3deg)}to{transform:rotate(.6deg) skewX(.5deg)}}@keyframes companionship{0%,100%{transform:rotate(-.18deg)}50%{transform:rotate(.2deg) translateY(-1px)}}@keyframes pulse{50%{opacity:.3}}@keyframes water{to{transform:translateX(25px) scaleX(1.03);opacity:.2}}@keyframes invitation{0%,100%{transform:scaleY(.7);opacity:.4}50%{transform:scaleY(1);opacity:1}}@keyframes fall{0%{transform:translate(0,-5vh) rotate(0);opacity:0}8%{opacity:.8}70%{opacity:.7}90%{opacity:0}100%{transform:translate(130px,90vh) rotate(400deg);opacity:0}}
@media(max-width:650px){.intro-header{padding:24px}.skip-intro{font-size:13px}.small-brand{font-size:19px}.room{inset:-2% -33%}.room-camera{transform-origin:53% 30%}.monitor{left:8%;height:35%;top:38%}.opening-copy{top:24%}.opening-copy h1{font-size:100px}.opening-copy .eyebrow{font-size:8px;letter-spacing:.18em}.opening-line{font-size:27px}.bench-position{width:65%;left:33%;bottom:8%}.tree-position{width:150%;left:-40%;height:95%}.scene-caption{left:8%;top:17%;max-width:85%}.scene-caption p{font-size:33px}.dock{gap:16px;padding:8px 17px 8px 9px;width:calc(100% - 32px);justify-content:space-between;font-size:13px}.dock-logo{width:66px}.dock-replay{font-size:0;padding-left:0;border:0}.dock-replay span{font-size:19px;margin:0}.dock-divider{display:none}.content-section{padding-top:125px;min-height:auto}.content-section h2{margin-bottom:45px}.content-bottom{align-items:start}.small-flower{font-size:47px}.content-bottom p{font-size:17px}.content-bottom p span{font-size:15px}.motion-label{display:none}.motion-toggle{padding:10px 13px;right:17px;bottom:17px}footer{flex-wrap:wrap;gap:8px;padding-bottom:70px}footer p{width:100%;order:3}.journey{height:550vh}.scene-label{font-size:7px;left:24px}.scroll-invitation{font-size:23px}}
:root{--paper:#f6f2e9;--paper-opacity:0}.paper-wash{opacity:var(--paper-opacity)}.scene-label{opacity:calc(1 - var(--paper-opacity))}.monitor{left:69%;top:48%;height:49%}.monitor-light{display:none}
@media(max-width:650px){.monitor{left:46%;top:51%;height:39%}}
.cabinet-monitor{position:absolute;left:7%;top:40%;width:9%;height:14%;overflow:hidden;filter:drop-shadow(1px 3px 2px #5a554433)}.cabinet-monitor img{position:absolute;width:200%;height:auto;left:-61%;top:-17%}.intro-actions{display:flex;align-items:center;gap:22px}.language-toggle{position:relative;flex:0 0 44px;width:44px;height:36px;display:flex;align-items:center;justify-content:center;border:0;background:transparent;cursor:pointer;padding:0;transition:transform .25s cubic-bezier(.16,1,.3,1)}.language-toggle:active{transform:scale(.86)}.language-toggle span{position:absolute;font-size:15px;line-height:1;transition:filter .2s,opacity .2s}.flag-en{left:6px;top:4px;opacity:1}.flag-zh{right:6px;bottom:4px;opacity:.35;filter:grayscale(1)}html[lang=zh-CN] .flag-en{opacity:.35;filter:grayscale(1)}html[lang=zh-CN] .flag-zh{opacity:1;filter:none}html[lang=zh-CN] .opening-line{line-height:1.5}html[lang=zh-CN] .content-section h2{line-height:1.3;font-size:clamp(40px,6vw,90px)}html[lang=zh-CN] .scene-caption p{line-height:1.5}.opening-copy h1{font-size:clamp(72px,11vw,175px)}
@media(max-width:650px){.intro-actions{gap:8px}.skip-intro{padding:0}.skip-intro span{margin-left:3px}.cabinet-monitor{left:7%;top:40%;width:9%;height:14%}.opening-copy h1{font-size:clamp(64px,18vw,100px)}.dock{gap:10px}.dock .language-toggle{flex-basis:38px;width:38px}.dock-logo{width:57px}}
.cabinet-monitor{top:auto;bottom:46%;height:auto;aspect-ratio:1.4}.cabinet-monitor img{top:-20%}.scroll-invitation{width:max-content;max-width:90%;text-align:center}
@media(max-width:650px){.room{inset:-2% -60% -2% -6%}.cabinet-monitor{top:auto;bottom:46%;height:auto;aspect-ratio:1.4}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.journey{height:240vh}.depth{transform:none!important}.room-camera{transform:none!important}.outdoor-front{transform:none!important}.landscape{scale:1!important;translate:none!important}}
