:root{color-scheme:dark;--ink:#f5ece2;--muted:#cebeaf;--accent:#dfb89e;--p:0;--scene:1;--first:1;--second:0;--entry:0;--first-y:0px;--second-y:24px;--px:0px;--py:0px;--travel:0px;--cn:'RendezvousWenKai','KaiTi',sans-serif;--jp:'RendezvousKlee',sans-serif}
/* Hide browser chrome without disabling native scrolling or the story timeline. */
html,body{scrollbar-width:none;-ms-overflow-style:none}html::-webkit-scrollbar,body::-webkit-scrollbar{display:none;width:0;height:0}
*{box-sizing:border-box}html,body{margin:0;padding:0;width:100%;min-width:0;max-width:none;background:#29221f;color:var(--ink)}html{scroll-behavior:auto}body{font-family:var(--cn);-webkit-font-smoothing:antialiased;overflow-x:clip}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid #edceb2;outline-offset:6px}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.story{position:relative;width:100%;min-width:0;max-width:none;height:340svh}.stage{position:sticky;top:0;height:100svh;width:100%;min-width:0;overflow:hidden;isolation:isolate;background:#29221f}
.scenery{position:absolute;inset:0;overflow:hidden;z-index:-1}.picture-plane{position:absolute;inset:-3.5%;transform:translate3d(var(--px),calc(var(--py) + var(--travel)),0);transition:transform 1.1s cubic-bezier(.2,.65,.3,1)}.breathing{position:absolute;inset:0;transform-origin:58% 45%;animation:breathe 11s ease-in-out infinite alternate}.breathing img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:50% 47%;filter:saturate(.9) brightness(.97)}.scene-original{opacity:var(--scene)}.warmth,.window-light,.shade,.evening{position:absolute;inset:0;pointer-events:none}.warmth{background:linear-gradient(120deg,rgba(247,178,107,.15),transparent 66%);mix-blend-mode:screen;opacity:calc(1 - var(--p))}.window-light{inset:-20%;background:linear-gradient(112deg,transparent 35%,rgba(255,234,186,.19) 48%,transparent 62%);mix-blend-mode:screen;animation:window-drift 12s ease-in-out infinite alternate;opacity:calc(.95 - var(--p)*.5)}.shade{background:linear-gradient(90deg,rgba(25,20,19,.36),transparent 65%),linear-gradient(0deg,rgba(23,19,20,.88),rgba(28,23,24,.48) 22%,transparent 72%),linear-gradient(180deg,rgba(20,20,20,.35),transparent 22%)}.evening{background:linear-gradient(130deg,rgba(40,43,61,.28),rgba(36,27,40,.37));opacity:var(--p)}
.masthead{position:absolute;left:clamp(24px,4.5vw,120px);right:clamp(24px,4.5vw,120px);top:max(25px,env(safe-area-inset-top));display:flex;align-items:center;justify-content:space-between;gap:15px;z-index:5}.wordmark{display:flex;align-items:center;gap:13px;font-size:14px;letter-spacing:.18em;text-shadow:0 1px 12px #252323}.wordmark img{opacity:.85}.wordmark i{height:12px;width:1px;background:#e8dac555}.wordmark [lang=ja]{font-family:var(--jp);font-size:11px;letter-spacing:.08em;color:#e4d9cc}.motion-control{width:44px;height:44px;padding:11px;border:1px solid #efdfce55;background:#201a1a24;border-radius:50%;display:grid;place-items:center;transition:background .25s}.motion-control:hover{background:#241e1e66}.motion-control svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.1}.play-icon{display:none}[data-motion=off] .pause-icon{display:none}[data-motion=off] .play-icon{display:block}[data-motion=off] .breathing,[data-motion=off] .window-light{animation-play-state:paused}[data-motion=off] .picture-plane{transform:none;transition:none}
.invitation,.afterthought,.closing{position:absolute;left:clamp(26px,4.5vw,120px);right:26px;max-width:calc(100% - 52px);text-shadow:0 2px 22px #18101088}.invitation{bottom:18%;width:max-content;opacity:var(--first);transform:translateY(var(--first-y));pointer-events:none}.fine-line{display:flex;align-items:center;gap:10px;width:87px;margin-bottom:24px;opacity:.7}.fine-line span{width:34px;height:1px;background:var(--accent)}.fine-line i{width:4px;height:4px;transform:rotate(45deg);border:1px solid var(--accent)}h1{margin:0;font-weight:300;font-size:clamp(43px,4.7vw,112px);line-height:1.35;letter-spacing:.08em}.opening{display:block;font-size:.57em;letter-spacing:.13em;margin-bottom:13px;color:#eedcc8}.wish{display:block}.last-stop{letter-spacing:0;margin-left:-.08em}.invitation-jp{margin:20px 0 0 3px;font-family:var(--jp);font-size:clamp(14px,1.15vw,21px);letter-spacing:.12em;color:#e5d1be}
.afterthought{bottom:31%;width:max-content;opacity:var(--second);transform:translateY(var(--second-y));visibility:hidden;pointer-events:none}.afterthought h2{font-size:clamp(28px,2.7vw,62px);line-height:1.65;letter-spacing:.06em;font-weight:300;margin:0}.afterthought h2 span{display:block}.question-jp{font-family:var(--jp);font-size:clamp(13px,1.05vw,19px);line-height:1.9;letter-spacing:.055em;color:#e0cbb7;margin:18px 0 0 3px}.question-jp br{display:none}.closing{bottom:15%;width:max-content;display:flex;flex-direction:column;align-items:flex-start;opacity:var(--entry);transform:translateY(calc((1 - var(--entry))*18px));visibility:hidden;pointer-events:none}.show-second .afterthought{visibility:visible}.show-entry .closing{visibility:visible;pointer-events:auto}
.entry{display:inline-flex;align-items:center;gap:20px;min-height:50px;padding:8px 0;position:relative}.entry::after{content:'';position:absolute;left:0;right:0;bottom:1px;height:1px;background:linear-gradient(90deg,#edd0bb99,#edd0bb22);transform-origin:left;transition:transform .4s}.entry-label{font-size:20px;letter-spacing:.3em}.entry-jp{font:12px var(--jp);letter-spacing:.08em;color:var(--muted)}.entry-arrow{display:grid;place-items:center;margin-left:18px;width:48px;transition:transform .4s}.entry-arrow svg{width:48px;fill:none;stroke:var(--accent);stroke-width:1}.entry:hover .entry-arrow{transform:translateX(10px)}.entry:hover::after{transform:scaleX(.94)}.replay{font-size:12px;letter-spacing:.07em;color:#c3b5a7;display:inline-flex;align-items:center;gap:12px;border:0;background:none;padding:13px 4px 7px;margin:9px 0 0 -4px;min-height:40px}.replay:hover{color:#f1dfce}.replay span{font-family:Arial,sans-serif;font-size:16px}
.scroll-cue{position:absolute;bottom:6%;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;opacity:calc(1 - var(--p)*1.6);pointer-events:none}.scroll-cue span{height:36px;width:1px;background:linear-gradient(transparent,#f0d2bca6)}.scroll-cue svg{width:22px;height:27px;fill:none;stroke:#e9d0bc;stroke-width:1;animation:down 1.8s ease-in-out infinite}.colophon{position:absolute;bottom:max(25px,env(safe-area-inset-bottom));right:clamp(24px,4.5vw,120px);display:flex;align-items:center;gap:15px;color:#d1bfae;font-size:11px;letter-spacing:.08em}.colophon-rule{width:36px;height:1px;background:#d6bfad66}.credit [lang=en]{font-family:Arial,sans-serif;letter-spacing:.1em;margin-left:7px;font-size:11px}.reading-line{height:2px;position:absolute;bottom:0;left:0;right:0;background:#ffffff08}.reading-line i{display:block;width:100%;height:100%;background:#dbb29888;transform:scaleX(var(--p));transform-origin:left}
@keyframes breathe{from{transform:translate3d(-4px,-7px,0) scale(1.005)}to{transform:translate3d(5px,8px,0) scale(1.035)}}@keyframes window-drift{from{transform:translateX(-9%) rotate(-4deg)}to{transform:translateX(9%) rotate(3deg)}}@keyframes down{0%,100%{transform:translateY(-3px);opacity:.55}50%{transform:translateY(6px);opacity:1}}
@media(min-width:1800px){.masthead{top:35px}.fine-line{margin-bottom:32px}.colophon{bottom:32px}.entry{min-height:60px}.replay{margin-top:16px}.entry-label{font-size:25px}}
@media(max-width:900px){.masthead{left:25px;right:25px}.invitation,.afterthought,.closing{left:26px;right:26px}.breathing img{object-position:60% 48%}.invitation{bottom:20%}h1{font-size:clamp(43px,6.8vw,68px)}.afterthought{bottom:34%}.afterthought h2{font-size:clamp(27px,4vw,38px)}.question-jp{font-size:14px}.closing{bottom:16%}.wordmark{gap:10px}.colophon{right:25px}}
@media(max-width:520px){.story{height:340svh}.masthead{top:max(18px,env(safe-area-inset-top));left:20px;right:20px}.wordmark{font-size:13px;gap:9px}.wordmark [lang=ja]{font-size:10px}.motion-control{width:42px;height:42px}.picture-plane{inset:-2.8%}.breathing img{object-position:64% 46%}.shade{background:linear-gradient(0deg,#211c1ef2,rgba(27,23,24,.62) 28%,rgba(25,21,21,.12) 67%,rgba(25,21,21,.25)),linear-gradient(90deg,#241e1e44,transparent 85%)}.invitation,.afterthought,.closing{left:22px;right:22px;max-width:calc(100% - 44px)}.invitation{bottom:22%}.fine-line{margin-bottom:22px}h1{font-size:clamp(34px,8.2vw,44px);letter-spacing:.04em}.opening{font-size:.65em;margin-bottom:10px}.invitation-jp{font-size:13px;letter-spacing:.055em;margin-top:16px}.afterthought{bottom:34%}.afterthought h2{font-size:clamp(23px,6.4vw,30px);line-height:1.8;letter-spacing:.015em}.question-jp{font-size:12px;line-height:1.9;margin-top:18px;letter-spacing:.025em}.question-jp br{display:block}.closing{bottom:14%}.entry{gap:16px;min-height:46px}.entry-label{font-size:18px}.entry-jp{font-size:10px}.entry-arrow{margin-left:8px;width:42px}.entry-arrow svg{width:42px}.replay{font-size:11px}.colophon{right:21px;bottom:max(20px,env(safe-area-inset-bottom));font-size:10px}.colophon-rule{width:24px}.scroll-cue{bottom:9%}}
@media(max-width:359px){.invitation,.afterthought,.closing{left:18px;right:18px;max-width:calc(100% - 36px)}.wordmark img{width:21px}.wordmark{gap:7px}.masthead{left:18px;right:18px}.afterthought h2{font-size:22px}.entry{gap:12px}.fine-line{margin-bottom:16px}.replay{margin-top:3px}}
@media(orientation:landscape) and (max-height:550px){.masthead{top:12px}.wordmark{font-size:12px}.motion-control{width:36px;height:36px;padding:8px}.invitation{bottom:19%}h1{font-size:40px}.opening{font-size:.55em;margin-bottom:4px}.fine-line{margin-bottom:12px}.invitation-jp{font-size:12px;margin-top:9px}.afterthought{bottom:38%}.afterthought h2{font-size:25px;line-height:1.45}.question-jp{font-size:11px;margin-top:10px}.closing{bottom:9%}.entry{min-height:38px}.entry-label{font-size:16px}.replay{padding:5px 4px;margin-top:1px;min-height:28px}.colophon{bottom:15px}.scroll-cue{bottom:8%}.scroll-cue span{height:20px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.picture-plane,.breathing{transform:none!important}}
html:not(.js) .story{height:auto}html:not(.js) .stage{position:relative;height:auto;min-height:100svh;padding:150px 26px 100px}html:not(.js) .invitation,html:not(.js) .afterthought,html:not(.js) .closing{position:relative;inset:auto;max-width:100%;opacity:1;visibility:visible;transform:none;margin:40px 0;pointer-events:auto}html:not(.js) .scroll-cue{display:none}