:root{font-family:Helvetica Neue,Arial,sans-serif;color:#eee8e0;background:#080808;font-synthesis:none;font-weight:300;-webkit-font-smoothing:antialiased;color-scheme:dark;--paper:#eee8e0;--muted:#a89b8e;--serif:"Songti SC","STSong","Noto Serif SC",serif}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:1px solid #b4a294;outline-offset:7px}button:disabled{cursor:default}svg{fill:none;stroke:currentColor;stroke-width:1;stroke-linecap:round;stroke-linejoin:round}.app{position:fixed;top:0;right:0;bottom:0;left:0;background:#080808;isolation:isolate}.stage{position:absolute;top:0;right:0;bottom:0;left:0}.page{position:relative;width:100%;height:100dvh;overflow:hidden}.film{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100dvh;object-fit:cover;background:#080808;opacity:0;transition:opacity .8s;pointer-events:none}.phase-film .film{opacity:1}.phase-film .stage,.phase-black .stage{pointer-events:none}.page-header{position:absolute;z-index:3;top:max(30px,env(safe-area-inset-top));left:28px;right:28px;display:flex;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:.23em;color:#b8a89b;line-height:1.5}.page-header span:last-child{letter-spacing:.15em}.grain{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;pointer-events:none;opacity:.065;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='.87' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.6' d='M0 0h160v160H0z'/%3E%3C/svg%3E");mix-blend-mode:soft-light}.landing{display:grid;place-items:center;background:#080808;opacity:1;visibility:visible;transition:opacity .8s,visibility .8s}.phase-film .landing{opacity:0;visibility:hidden;pointer-events:none}.portrait-wash{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none}.portrait-wash img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;object-position:62% 50%;opacity:.21;filter:saturate(.55);transform:scale(1.025)}.portrait-wash:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,#08080888,#08080819 35%,#08080800 56%,#080808bb),linear-gradient(90deg,#080808a0,transparent 65%)}.landing-center{position:relative;z-index:3;text-align:center;margin-top:-2vh;width:100%;padding:0 28px}.eyebrow{font-size:10px;letter-spacing:.45em;padding-left:.45em;margin:0 0 18px;font-weight:300}.day{font-family:Georgia,Times New Roman,serif;font-weight:400;font-size:clamp(130px,36vw,180px);letter-spacing:-.08em;line-height:.95;margin:0;padding-right:.08em;color:#f0ebe3}.dedication{display:flex;align-items:center;justify-content:center;gap:14px;margin:33px 0 0;font-size:8px;letter-spacing:.2em;color:#b5a79a;min-height:24px}.recipient{font-family:var(--serif);font-size:17px;letter-spacing:.2em;color:var(--paper)}.entry{position:relative;margin-top:62px;min-height:67px}.text-button{border:0;border-radius:0;background:none;padding:12px 0;font-size:10px;letter-spacing:.23em;min-height:44px}.enter{display:inline-flex;align-items:center;justify-content:center;gap:25px;min-width:148px;border-bottom:1px solid #e7d1b73d;padding:16px 5px;color:#d5c6b6;transition:color .3s,border-color .3s}.enter svg{width:22px;height:22px;transition:transform .3s}.enter:hover{color:#fff5e8;border-color:#e7d1b790}.enter:hover svg{transform:translate(4px)}.enter:disabled{color:#8e8074;border-color:#8e80742e}.preparing-line{height:1px;background:#282322;width:148px;margin:0 auto}.preparing-line span{display:block;width:100%;height:100%;background:#aa9381;transform-origin:left;transition:transform .5s}.load-message{font-size:11px;letter-spacing:0;color:#b3a091;line-height:1.8}.landing-footer{position:absolute;z-index:3;bottom:max(29px,calc(env(safe-area-inset-bottom) + 18px));left:28px;right:28px;text-align:center}.landing-footer p{font-family:var(--serif);font-size:12px;letter-spacing:.17em;color:#c2b3a5;margin:0 0 16px}.landing-footer>span{display:inline-flex;align-items:center;gap:8px;font-size:9px;letter-spacing:.12em;color:#978779}.landing-footer svg{width:14px;height:14px}.ending{background:#080808;text-align:center}.rose-wash{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.rose-wash img{width:100%;height:100%;object-fit:cover;opacity:.12;filter:saturate(.55)}.rose-wash:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,#08080866,#080808b8 55%,#080808f5)}.ending-scroll{position:relative;z-index:3;display:flex;align-items:center;justify-content:center;overflow-x:hidden;overflow-y:auto;height:100%;overscroll-behavior:contain;scrollbar-width:none}.ending-scroll::-webkit-scrollbar{display:none}.ending-content{padding:105px 30px max(65px,calc(env(safe-area-inset-bottom) + 35px));width:100%;max-width:460px}.ending-eyebrow{color:#a4907f;font-size:8px;letter-spacing:.3em;margin:0 0 47px}.ending-name{font-family:var(--serif);font-size:16px;letter-spacing:.24em;padding-left:.24em;margin:0 0 18px;color:#c0aa98}.ending h2{font-family:var(--serif);font-size:34px;font-weight:400;letter-spacing:.11em;padding-left:.11em;margin:0;line-height:1.6}.date{font-size:9px;color:#a38d7b;letter-spacing:.24em;margin:23px 0 0}.keep{margin-top:54px;font-family:var(--serif);letter-spacing:.15em;font-size:12px;color:#d0bcaa}.keep span{display:block;margin:13px 0 0;font-family:Arial;font-size:18px;color:#a58a73;transition:transform .4s}.keep .arrow-up{transform:rotate(180deg)}.replay{display:flex;align-items:center;justify-content:center;gap:9px;margin:40px auto 0;font-family:var(--serif);font-size:11px;color:#a18b77;letter-spacing:.12em}.replay svg{width:16px;height:16px}.replay:hover,.song-play:hover{color:#e5d3c1}.letter-open .ending-scroll{align-items:flex-start}.letter-open .ending-content{padding-top:115px}.private-letter{max-width:320px;margin:39px auto 0;text-align:left;font-family:var(--serif);font-size:14px;line-height:1.95;color:#cec1b4}.private-letter p{margin:0 0 23px}.private-letter .letter-name{font-size:13px;color:#b39b86;margin-bottom:26px}.private-letter .letter-signature{font-size:11px;color:#9e8876;text-align:right;margin:33px 0 0;letter-spacing:.08em}.song{border-top:1px solid #ad8b692a;margin-top:44px;padding-top:30px}.private-letter .song-eyebrow{font-size:10px;color:#9e8876;letter-spacing:.16em;margin:0 0 9px}.song h3{font-size:17px;letter-spacing:.08em;font-weight:400;color:#d7c6b7;margin:0 0 21px}.lyrics{font-size:12px;line-height:2;color:#bba794}.lyrics p{margin:0 0 7px}.song-play{display:flex;align-items:center;gap:10px;font-family:var(--serif);color:#c4aa91;letter-spacing:.08em;margin-top:17px;font-size:11px}.song-symbol{width:27px;height:27px;border:1px solid #ad8b6945;border-radius:50%;display:grid;place-items:center;font-family:Arial;font-size:11px;padding-left:1px}.song audio{display:none}.resume{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:5;padding:25px;background:#080808d9;white-space:nowrap;color:#e1cebd;letter-spacing:.09em}.portrait-guard{position:fixed;top:0;right:0;bottom:0;left:0;background:#080808;z-index:20;display:grid;place-items:center;font-family:var(--serif);font-size:14px;letter-spacing:.14em}.buffer-line{position:fixed;bottom:max(16px,env(safe-area-inset-bottom));left:45%;width:10%;height:1px;background:#b8a391;animation:pulse 1.4s ease-in-out infinite}@keyframes pulse{50%{opacity:.2}}@media(min-width:900px){.film{object-fit:contain}.page-header{top:40px;left:48px;right:48px;font-size:9px}.portrait-wash{left:34%}.portrait-wash img{opacity:.3;object-position:55% 40%}.portrait-wash:after{background:linear-gradient(90deg,#080808,transparent 55%),linear-gradient(180deg,#080808aa,transparent 35%,#080808c9)}.landing-center{width:58%;justify-self:start;margin-top:-1vh}.day{font-size:216px}.eyebrow{font-size:11px;margin-bottom:24px}.dedication{margin-top:36px}.entry{margin-top:64px}.landing-footer{left:0;right:42%;bottom:37px}.rose-wash{left:50%;opacity:.7}.rose-wash:after{background:linear-gradient(90deg,#080808,transparent),linear-gradient(180deg,#08080866,#080808c0)}.ending h2{font-size:39px}.ending-content{max-width:490px}.ending-eyebrow{font-size:8px}.private-letter{font-size:15px}}@media(max-height:680px)and (orientation:portrait){.page-header{top:max(22px,env(safe-area-inset-top))}.day{font-size:126px}.entry{margin-top:37px}.landing-footer p{margin-bottom:9px}.ending-content{padding-top:85px;padding-bottom:42px}.ending-eyebrow{margin-bottom:28px}.keep{margin-top:34px}.replay{margin-top:22px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}@media(min-aspect-ratio:3/4){.film{object-fit:contain}}