/* Original night footage keeps the waves and reflected light moving together. */
body{background:#07121c}.night-world{position:fixed;inset:0;overflow:hidden;background:#07121c;pointer-events:none;transition:opacity 1s;z-index:0}.river-view{position:absolute;inset:0}.skyline-pan{position:absolute;inset:0}.skyline-image{display:block;width:100%;height:100%;object-fit:cover;object-position:46% 100%;animation:natural-passage 75s linear both;filter:brightness(1.02) saturate(1.04)}.scene-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:46% 100%;animation:natural-passage 75s linear both;filter:brightness(1.02) saturate(1.04);opacity:0;transition:opacity .8s}.scene-video.is-ready{opacity:1}.night-shade{position:absolute;inset:0;background:linear-gradient(180deg,#020a1455 0%,transparent 28%,transparent 72%,#02091377 100%);transition:background 1.6s}.boat-foreground{position:absolute;bottom:-1%;right:-2%;width:104%;height:72%;object-fit:fill;filter:brightness(.91);transition:opacity 1s;pointer-events:none}.cover-scene,.letter-scene{background:transparent;position:relative;z-index:1}.cover-scene{min-height:100svh;color:#f8f3e9;display:flex;flex-direction:column}.cover-scene .site-header,.letter-scene .site-header{border-bottom-color:#e6d9b526;position:relative;z-index:3}.cover-scene .monogram,.letter-scene .monogram{color:#efe1c8}.cover-scene .site-header time,.cover-scene .header-sender,.letter-scene .site-header time,.letter-scene .header-sender{color:#e1ded3}.cover-layout{position:relative;display:block;flex:1;min-height:580px;width:100%;max-width:1300px;margin:0 auto;padding:0}.cover-type{position:absolute;left:0;right:0;top:5%;text-align:center;padding:0;z-index:1;transition:transform 2s cubic-bezier(.16,1,.3,1),opacity 1.2s;animation:night-title 2.5s both}.cover-type .eyebrow{margin:0 0 22px;color:#dfc8a5;font-size:12px;letter-spacing:.28em}.cover-type h1{font-size:clamp(65px,8.5vw,125px);font-weight:400;letter-spacing:-.05em;line-height:1.15;text-shadow:0 5px 40px #0005}.cover-type h1>span,.cover-type h1 em{display:inline;font-size:inherit;margin:0;font-weight:400;line-height:inherit}.cover-type h1>span{letter-spacing:-.065em}.ink-dot{color:#dec19c}.envelope-presentation{position:absolute;left:50%;top:50%;width:min(500px,62vw);margin:0;opacity:0;transform:translate(-50%,75%) rotate(-9deg) scale(.75);transition:opacity 1.5s,transform 2.5s cubic-bezier(.16,1,.3,1);pointer-events:none;perspective:1400px}.envelope-stage{width:100%;max-width:none;animation:none;transform:rotate(-4deg);transition:transform 1s cubic-bezier(.16,1,.3,1),opacity .8s}.envelope-art{filter:drop-shadow(0 28px 38px #0006)}.envelope-stage:has(.seal-button:hover){transform:translateY(-5px) rotate(-2deg)}.seal-button:focus-visible{outline:2px solid #fff0cd;outline-offset:9px}.open-label{padding:0;margin:-8px 0 0;color:#f2e8d8;font-size:14px;text-shadow:0 2px 14px #000;opacity:0;transition:opacity 1s 1.2s;letter-spacing:.14em}.letter-arrived .envelope-presentation{opacity:1;transform:translate(-50%,-35%) rotate(0) scale(1);pointer-events:auto}.letter-arrived .open-label{opacity:1}.cruise-toolbar{width:100%;max-width:1360px;position:relative;z-index:3;display:flex;align-items:center;justify-content:flex-end;gap:22px;margin:0 auto;padding:20px 0 32px;min-height:88px}.receive-letter{background:#06121b55;backdrop-filter:blur(10px);color:#eee6d7;border:1px solid #dfd0ab5c;border-radius:0;min-height:44px;padding:10px 18px;font:14px/1.5 var(--jp);letter-spacing:.06em;transition:background .3s,opacity .5s}.receive-letter:hover{background:#132433aa}.letter-arrived .receive-letter{visibility:hidden;pointer-events:none}.motion-button{width:44px;height:44px;border:1px solid #dfd0ab4a;border-radius:50%;display:grid;place-items:center;background:#07131c55;color:#dfd6c5;backdrop-filter:blur(10px);padding:12px}.motion-button svg{width:18px;height:18px}.play-icon{display:none}.motion-paused .pause-icon{display:none}.motion-paused .play-icon{display:block}.motion-paused .night-world *{animation-play-state:paused!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.is-opening .cover-type{opacity:0;transform:translateY(-25px)}.is-opening .cruise-toolbar{opacity:0;transition:opacity .5s}.is-opening .envelope-stage{transform:translateY(30px) rotateX(50deg) scale(1.12)!important}.letter-scene .letter-wrap{margin:45px auto 60px}.letter-scene .letter-paper{box-shadow:0 30px 110px #0007;background:#fffdf7}.letter-scene.is-visible .letter-paper{animation:night-letter-in 1.6s both cubic-bezier(.16,1,.3,1)}body[data-scene=letter] .night-world:after{content:'';position:absolute;inset:0;background:#030b1457;backdrop-filter:blur(3px)}body[data-scene=letter] .boat-foreground{opacity:.45}body[data-scene=gift] .night-world{opacity:0;visibility:hidden}.gift-scene{z-index:2}.night-world[data-hidden=true] *{animation-play-state:paused!important}


@keyframes natural-passage{from{object-position:46% 100%}to{object-position:53% 100%}}
@keyframes night-title{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes night-letter-in{from{opacity:0;transform:translateY(85px) rotateX(-10deg) scale(.94)}to{opacity:1;transform:none}}
@media(min-width:1500px){.cover-layout{min-height:650px}.envelope-presentation{width:660px}}
@media(max-width:900px){.cover-layout{min-height:560px}.cover-type h1{font-size:86px}.envelope-presentation{width:min(570px,82vw)}}
@media(max-width:650px){.river-view{top:9%;height:76%;bottom:auto;mask-image:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent);-webkit-mask-image:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent)}.cover-scene{padding-inline:24px}.cover-scene .site-header{height:82px}.cover-layout{display:block;padding:0;min-height:550px;flex:1}.cover-type{top:5%;padding:0;align-self:auto}.cover-type .eyebrow{font-size:12px;margin-bottom:18px;letter-spacing:.22em}.cover-type h1{font-size:clamp(57px,16vw,93px);line-height:1.18;white-space:nowrap}.cover-type h1>span,.cover-type h1 em{font-size:inherit;line-height:inherit;display:inline;margin:0}.envelope-presentation{width:calc(100% + 44px);max-width:510px;top:50%;margin:0}.envelope-stage{max-width:none}.letter-arrived .envelope-presentation{transform:translate(-50%,-34%) rotate(0) scale(1)}.open-label{padding:8px 0;margin:-1px 0 0;font-size:14px}.cruise-toolbar{gap:12px;padding:20px 0 26px;min-height:90px;flex-wrap:wrap}.receive-letter{padding:9px 12px;font-size:14px}.boat-foreground{width:175%;height:auto;right:-3%;bottom:-1px;object-fit:contain}.skyline-image{object-position:46% 100%}.letter-scene .letter-wrap{margin:27px auto 35px}.letter-scene .site-header{height:80px}.letter-paper{padding-inline:26px}.motion-button{flex-shrink:0}}
@media(max-width:360px){.cover-scene{padding-inline:18px}.cover-type h1{font-size:57px}.cruise-toolbar{gap:9px}.receive-letter{padding-inline:9px}.letter-paper{padding-inline:21px}}
@media(max-height:740px) and (max-width:650px){.cover-scene .site-header{height:68px}.cover-layout{min-height:440px}.cover-type{top:4%}.cover-type .eyebrow{margin-bottom:12px}.cover-type h1{font-size:60px}.envelope-presentation{max-width:365px;top:50%}.cruise-toolbar{padding-bottom:20px}.open-label{padding-top:1px}}
@media(prefers-reduced-motion:reduce){.night-world *{animation:none!important}.skyline-pan{transform:none}.envelope-presentation{transition:none!important}.boat-foreground{transform:none}.motion-button{display:none}.scene-video{display:none}}