@font-face{font-family:'Editorial';src:local('Georgia')}*{box-sizing:border-box}html{font-size:16px}body{margin:0;color:#302820;background:#f3eee6;font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:wait;opacity:.55}button:focus-visible{outline:2px solid #a33143;outline-offset:5px}[hidden]{display:none!important}.topbar{height:88px;padding:0 4.2%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dcd5cb;position:relative;z-index:3}.wordmark{font-family:Georgia,serif;font-size:43px;letter-spacing:-3px;line-height:1}.wordmark>span{color:#ad3449}.gift-address{font-size:12px;letter-spacing:2.4px;color:#766a5c;position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap}.small-heart{color:#a83545;font-size:23px;vertical-align:middle;margin:0 16px}.header-actions{display:flex;gap:24px;align-items:center}.quiet-button{display:flex;align-items:center;gap:9px;background:none;border:0;font-size:13px;padding:10px 0}.quiet-button svg{width:19px;height:19px}.quiet-button[aria-pressed=false] .sound-waves{opacity:.3}.reset-button{font-size:21px}.reset-button span{font-size:13px}.experience{position:relative;min-height:760px;height:calc(100svh - 136px);overflow:hidden}.intro{position:absolute;top:38px;left:0;width:100%;z-index:2;text-align:center;pointer-events:none}.eyebrow{font-size:11px;letter-spacing:2.6px;font-weight:500;color:#8d514c}.intro h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(44px,4.5vw,69px);line-height:1.04;letter-spacing:-2.4px;margin:15px 0 16px}.intro h1 em{font-weight:400;color:#9d3244}.intro p{color:#887c6d;font-size:14px;line-height:1.65;margin:0}.scene-area{position:absolute;inset:205px 0 65px}.scene-area:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 55%,#fbf7ef 0%,#f3eee6 66%);pointer-events:none}#scene{position:absolute;inset:0;touch-action:pan-y}#scene canvas{width:100%;height:100%;display:block;touch-action:pan-y;outline:none}.side-note{position:absolute;top:32%;left:7%;pointer-events:none;z-index:1}.side-note>span,.edition>span{font-size:9px;letter-spacing:1.8px;color:#918574}.side-note p{font-family:Georgia,serif;font-size:23px;line-height:1.4;color:#766756;margin-top:15px}.side-note em{color:#a1454d}.note-line{height:1px;width:36px;background:#b2a491;margin-top:24px}.edition{position:absolute;right:7%;top:44%;pointer-events:none}.edition p{font-size:12px;line-height:1.8;color:#9b8d7b}.bottom-controls{position:absolute;bottom:16px;left:0;right:0;display:flex;flex-direction:column;align-items:center;z-index:3;pointer-events:none}.bottom-controls>*{pointer-events:auto}.primary-button{border:1px solid #943042;border-radius:999px;padding:18px 32px;min-width:222px;display:inline-flex;align-items:center;justify-content:center;gap:30px;background:#a33347;color:#fff8ed;font-size:15px;box-shadow:0 5px 15px #8e2e3914;transition:background .2s,transform .2s}.primary-button:hover{background:#852437;transform:translateY(-2px)}.primary-button span{font-size:21px}.interaction-tip{font-size:12px;color:#8e8171;margin:17px 0 0}.keepsake-controls{display:flex;padding:7px;background:#fbf8f0dd;backdrop-filter:blur(12px);border:1px solid #dfd7cb;border-radius:999px;box-shadow:0 6px 24px #45332108;gap:4px}.keepsake-button{display:flex;gap:10px;align-items:center;border:0;background:transparent;border-radius:999px;padding:13px 20px;font-size:13px;transition:background .2s}.keepsake-button:hover{background:#ece3d6}.keepsake-button svg{width:20px;height:20px;color:#9d3445}.seen-dot{color:#9e3545;font-size:11px}.object-hint{position:absolute;z-index:3;pointer-events:none;transform:translate(-50%,-140%);font-size:12px;background:#352821e8;color:#fff8ed;padding:8px 12px;border-radius:4px;white-space:nowrap}.loading{position:absolute;inset:0;display:flex;gap:14px;align-items:center;justify-content:center;flex-direction:column;color:#897b69;font-size:13px;background:#f3eee6;z-index:2}.loading-ring{width:26px;height:26px;border:1px solid #d9cabb;border-top-color:#a33143;border-radius:50%;animation:spin 1.1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.fallback{position:absolute;inset:15% 10%;text-align:center;padding:30px;background:#e9dccf;border:1px solid #d6c5b2;border-radius:18px}.fallback-invitation{font:48px/1.2 Georgia,serif}.fallback-invitation em{color:#a43346}.fallback p{color:#766656;font-size:14px}.is-open .intro{top:30px}.is-open .intro h1{font-size:48px;line-height:1.12;margin:14px 0}.is-open .scene-area{inset:190px 0 90px}.is-open .side-note{top:50%}.is-open .edition{top:60%}footer{height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 4.2%;border-top:1px solid #e0d9cd;font-size:9px;letter-spacing:1.7px;color:#a39787}footer span:nth-child(2){font:italic 13px Georgia,serif;letter-spacing:0;color:#8a7b69}
dialog{border:1px solid #ded3c5;padding:40px 45px 25px;width:min(570px,calc(100vw - 28px));max-height:90svh;overflow-y:auto;background:#fbf7ef;color:#362b23;box-shadow:0 22px 100px #3a25192b;border-radius:6px;scrollbar-width:thin;animation:unfold .55s cubic-bezier(.2,.8,.2,1)}dialog::backdrop{background:#44342966;backdrop-filter:blur(9px)}@keyframes unfold{from{opacity:0;transform:translateY(22px) rotateX(-8deg) scale(.96)}to{opacity:1;transform:none}}.dialog-close{position:absolute;right:13px;top:9px;background:none;border:0;font-size:29px;padding:5px 10px;color:#8e7e6b}.photo-view{text-align:center}.photo-view h2{font:34px/1.2 Georgia,serif;margin:17px 0 25px;letter-spacing:-1px}.photo-flip{position:relative;width:100%;aspect-ratio:1/.97;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.25,.75,.25,1)}.photo-flip.flipped{transform:rotateY(180deg)}.photo-front,.photo-back{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:#fffdf7;box-shadow:0 6px 18px #48362617;border:1px solid #eae2d6;padding:16px 16px 24px}.photo-front{transform:rotate(-2deg)}.photo-front img{width:100%;height:82%;object-fit:cover;display:block}.photo-front>span{display:block;margin:17px 0 0;font:italic 19px Georgia,serif;color:#786151}.photo-back{transform:rotateY(180deg);display:flex;flex-direction:column;justify-content:center;align-items:center;padding:30px}.photo-back p{font:23px/1.65 Georgia,serif;margin:26px 0}.handwritten{font:italic 20px Georgia,serif;color:#a33444}.photo-actions{display:flex;justify-content:space-between;margin-top:25px;gap:12px}.text-button{font-size:13px;background:none;border:0;padding:10px 0;color:#883b43}.photo-count{font-size:11px;letter-spacing:2px;color:#9d8a74;margin:15px 0 0}.return-button{display:block;margin:25px auto 0;padding:11px 6px;background:none;border:0;border-top:1px solid #e6ddce;width:100%;font-size:12px;color:#8b7560}.letter-view{padding:15px 0 5px}.letter-view h2,.song-view h2{font:45px/1.12 Georgia,serif;font-weight:400;letter-spacing:-1.7px;margin:22px 0}.letter-view h2 em,.song-view h2 em{color:#a23a49}.letter-rule{width:45px;height:1px;background:#b69376;margin:27px 0}.letter-view p{font:16px/1.9 Georgia,serif;color:#73604e;margin:20px 0}.signature{font:italic 19px/1.6 Georgia,serif;color:#a33244;margin:28px 0 0}.signature span{font-size:36px}.song-view{text-align:center;padding:28px 0 20px}.song-view>p{color:#887561;font-size:15px;line-height:1.5}.waveform{height:80px;display:flex;gap:5px;align-items:center;justify-content:center;margin:35px 0}.waveform i{width:5px;height:25%;border-radius:8px;background:#bda890}.waveform i:nth-child(3n){height:60%}.waveform i:nth-child(4n){height:90%}.waveform i:nth-child(2n){height:40%}.playing .waveform i{animation:wave 1.2s ease-in-out infinite alternate}.playing .waveform i:nth-child(2n){animation-delay:-.6s}.playing .waveform i:nth-child(3n){animation-delay:-.9s}@keyframes wave{to{transform:scaleY(.35);background:#a53646}}.song-view .song-credit{font-size:11px;margin:24px 0 0;color:#a6937c}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;clip:rect(0,0,0,0);overflow:hidden;white-space:nowrap}
@media(min-width:1500px){.scene-area{left:5%;right:5%}}@media(max-width:850px){.side-note,.edition{display:none}.topbar{padding:0 24px;height:75px}.wordmark{font-size:37px}.gift-address{font-size:9px;letter-spacing:1.3px}.small-heart{margin:0 7px}.header-actions{gap:13px}.reset-button span{display:none}.experience{height:calc(100svh - 119px);min-height:720px}.intro h1{font-size:57px}.scene-area{inset:220px -8% 80px}.intro{top:36px}footer{height:44px}footer span:last-child{display:none}.is-open .intro h1{font-size:43px}.is-open .scene-area{inset:150px -8% 92px}}
@media(max-width:540px){.topbar{height:68px;padding:0 22px}.wordmark{font-size:36px}.gift-address{left:auto;right:21px;top:91px;transform:none;font-size:8px;letter-spacing:1.2px;display:none}.quiet-button{font-size:11px}.quiet-button svg{width:17px}.experience{height:calc(100svh - 108px);min-height:675px}.intro{top:33px}.eyebrow{font-size:9px;letter-spacing:1.9px}.intro h1{font-size:49px;letter-spacing:-1.8px;margin:17px 0 15px}.intro p{font-size:13px}.scene-area{inset:230px -26% 78px}.bottom-controls{bottom:22px}.primary-button{padding:16px 27px;min-width:214px;font-size:14px}.interaction-tip{font-size:10px;margin-top:17px}.keepsake-controls{gap:0;padding:4px;max-width:94vw}.keepsake-button{padding:12px 11px;gap:6px;font-size:10px}.keepsake-button svg{width:17px;height:17px}.seen-dot{display:none}.is-open .intro{top:32px}.is-open .intro h1{font-size:37px;margin-top:15px}.is-open .intro p{font-size:12px}.is-open .scene-area{inset:160px -20% 90px}footer{height:40px;padding:0 20px;font-size:8px;letter-spacing:1.2px}footer span:nth-child(2){font-size:11px}dialog{padding:36px 25px 20px}.photo-view h2{font-size:30px}.photo-front{padding:12px}.photo-front>span{font-size:15px;margin:14px 0}.photo-back p{font-size:18px}.letter-view h2,.song-view h2{font-size:38px}.letter-view p{font-size:16px;line-height:1.75}}
.gift-address,.eyebrow,.side-note>span,.edition>span,footer,.interaction-tip,.photo-count,.song-view .song-credit{font-size:12px}.intro p{font-size:16px}.quiet-button,.keepsake-button,.text-button,.return-button{font-size:14px}.edition p{font-size:14px}.is-open .intro p{font-size:16px}
@media(max-width:540px){.intro p,.is-open .intro p{font-size:14px}.eyebrow{font-size:11px}.interaction-tip{font-size:11px}.keepsake-controls{width:94vw}.keepsake-button{flex:1;min-width:0;flex-direction:column;padding:10px 8px;font-size:13px;gap:6px}.keepsake-button svg{width:18px;height:18px}.is-open .scene-area{bottom:115px}.quiet-button{font-size:13px}.photo-actions .text-button{font-size:13px}footer{font-size:10px;letter-spacing:.7px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}