:root{color:#fff8f1;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:#2a1325;font-family:Georgia,Times New Roman,serif}*{box-sizing:border-box}body{min-width:320px;margin:0}button{font:inherit}:root{--ink:#fff8f1;--muted:#e6cbd5;--rose:#f3a6b9;--blush:#ffc8d1;--berry-dark:#2a1325;--card:#5b223bb8;--line:#ffdce540}#root{min-height:100svh}.app-shell{background:radial-gradient(circle at 50% 20%, #642345 0, #3e1c35 38%, var(--berry-dark) 82%);place-items:center;min-height:100svh;padding:64px 24px 42px;display:grid;position:relative;overflow:hidden}.ambient-glow{opacity:.22;filter:blur(8px);pointer-events:none;border-radius:50%;width:280px;height:280px;position:absolute}.ambient-glow-one{background:var(--rose);top:-130px;left:-90px}.ambient-glow-two{background:#f9bd80;bottom:-140px;right:-110px}.stage-indicator{z-index:2;gap:8px;display:flex;position:absolute;top:27px;left:50%;transform:translate(-50%)}.stage-dot{border:1px solid var(--line);background:0 0;border-radius:50%;width:8px;height:8px;transition:all .2s}.stage-dot.active{border-color:var(--blush);background:var(--blush);border-radius:8px;width:24px}.stage{z-index:1;text-align:center;width:min(960px,100%);animation:.45s both arrive;position:relative}.eyebrow{color:var(--rose);letter-spacing:.16em;text-transform:uppercase;font:600 12px/1.4 Arial,sans-serif}h1{color:var(--ink);letter-spacing:-.04em;margin:12px 0;font-size:clamp(44px,8vw,88px);font-weight:400;line-height:.98}.stage-copy{max-width:560px;color:var(--muted);margin:0 auto 28px;font-size:18px;line-height:1.6}.heart-mark{color:var(--blush);text-shadow:0 0 30px #ffaec366;margin-bottom:16px;font-size:54px;line-height:1}.question-actions{justify-content:center;align-items:center;gap:14px;min-height:58px;margin-top:34px;display:flex}.button{cursor:pointer;letter-spacing:.01em;border:0;border-radius:999px;padding:14px 23px;font:700 14px/1 Arial,sans-serif;transition:transform .2s,box-shadow .2s,background .2s}.button:hover{transform:translateY(-2px)}.button:focus-visible{outline:3px solid var(--blush);outline-offset:4px}.button-primary{color:#46172e;background:var(--blush);box-shadow:0 10px 28px #ff9db830}.button-primary:hover{background:#ffe1e4;box-shadow:0 12px 32px #ff9db84d}.button-secondary{color:var(--ink);border:1px solid var(--line);background:0 0}.no-button{transition:transform .25s}.reveal-stage{flex-direction:column;align-items:center;gap:26px;display:flex}.photo-orbit{width:min(700px,90vw);height:min(570px,70vh);min-height:420px;position:relative}.reveal-message{z-index:1;background:#411630e0;border:1px solid #ffdae04d;border-radius:50%;width:min(380px,60vw);padding:54px 25px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 20px 50px #16040f47}.reveal-message h1{font-size:clamp(42px,7vw,74px)}.reveal-message p{color:var(--muted);margin:14px 0 0;font-size:17px;line-height:1.5}.orbit-photo,.moment-card img{object-fit:cover;border:7px solid #fff8f1f0;display:block;box-shadow:0 16px 32px #17051147}.orbit-photo{border-radius:16px;width:180px;height:220px;position:absolute}.orbit-photo-1{top:1%;left:7%;transform:rotate(-10deg)}.orbit-photo-2{top:2%;right:7%;transform:rotate(10deg)}.orbit-photo-3{bottom:1%;left:9%;transform:rotate(8deg)}.orbit-photo-4{bottom:1%;right:9%;transform:rotate(-8deg)}.letter-stage{flex-direction:column;align-items:center;display:flex}.letter-stage h1{font-size:clamp(42px,7vw,72px)}.letter-card{border:1px solid var(--line);background:var(--card);text-align:left;border-radius:22px;width:min(700px,100%);margin:26px 0 28px;padding:36px clamp(24px,6vw,68px);box-shadow:0 20px 60px #1705113b}.letter-card-top{color:var(--blush);text-align:center;margin-bottom:20px;font-size:26px}.letter-card p{color:#ffedf0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:19px;line-height:1.85}.letter-signoff{color:var(--rose);text-align:right;margin-top:26px;font-style:italic}.moments-stage{max-width:1080px}.moments-grid{grid-template-columns:repeat(6,1fr);gap:18px;max-width:960px;margin:34px auto 0;display:grid}.moment-card{grid-column:span 2;margin:0;transform:rotate(-2deg)}.moment-card:nth-child(2){transform:rotate(2deg)}.moment-card:nth-child(3){transform:rotate(-1deg)}.moment-card:nth-child(4){grid-column:2/span 2;transform:rotate(2deg)}.moment-card:nth-child(5){transform:rotate(-3deg)}.moment-card img{border-radius:14px;width:100%;height:210px}.moment-card figcaption{color:var(--muted);letter-spacing:.14em;text-transform:uppercase;margin-top:10px;font:600 11px/1 Arial,sans-serif}@keyframes arrive{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media (width<=650px){.app-shell{padding:62px 18px 34px}.question-actions{gap:10px}.button{padding:13px 16px}.photo-orbit{width:100%;height:540px;min-height:0}.reveal-message{width:275px;padding:42px 16px}.orbit-photo{width:122px;height:158px}.orbit-photo-1{left:0}.orbit-photo-2{right:0}.orbit-photo-3{left:0}.orbit-photo-4{right:0}.letter-card p{font-size:17px;line-height:1.7}.moments-grid{grid-template-columns:repeat(2,1fr);gap:14px}.moment-card,.moment-card:nth-child(4),.moment-card:nth-child(5){grid-column:auto}.moment-card img{height:180px}}.app-shell.stage-2{overflow:hidden auto}.app-shell.stage-3,.app-shell.stage-4{align-items:start;overflow:hidden auto}.button:active{transform:translateY(1px)scale(.98);box-shadow:0 5px 14px #ff9db829}.reveal-stage{isolation:isolate}.reveal-sparkles{z-index:-1;pointer-events:none;position:absolute;inset:0}.sparkle{color:var(--blush);opacity:.38;text-shadow:0 0 16px #ffb4c8e6;font:24px/1 Georgia,serif;animation:5s ease-in-out infinite sparkle-drift;position:absolute}.sparkle-1{animation-delay:-.8s;top:11%;left:22%}.sparkle-2{font-size:30px;animation-delay:-2.1s;top:25%;right:20%}.sparkle-3{animation-delay:-3.4s;top:45%;left:7%}.sparkle-4{font-size:32px;animation-delay:-1.6s;bottom:40%;right:8%}.sparkle-5{animation-delay:-4.1s;bottom:13%;left:28%}.sparkle-6{font-size:30px;animation-delay:-2.8s;bottom:9%;right:27%}.orbit-photo{will-change:transform;animation:6.5s ease-in-out infinite photo-float}.orbit-photo-1{animation-name:photo-float-1;animation-delay:-.9s}.orbit-photo-2{animation-name:photo-float-2;animation-duration:7.3s;animation-delay:-3.2s}.orbit-photo-3{animation-name:photo-float-3;animation-duration:6.9s;animation-delay:-4.8s}.orbit-photo-4{animation-name:photo-float-4;animation-duration:7.7s;animation-delay:-1.9s}.reveal-message{animation:.7s ease-out 80ms both reveal-message-in}.reveal-message h1{animation:.8s ease-out .16s both heading-in}.letter-eyebrow,.letter-heading,.letter-card,.letter-stage>.button{animation:.55s ease-out both letter-content-in}.letter-heading{animation-delay:70ms}.letter-card{animation-delay:.16s}.letter-stage>.button{animation-delay:.26s}.moment-card{will-change:transform;animation:7.4s ease-in-out infinite memory-float-1}.moment-card-2{animation-name:memory-float-2;animation-duration:8.2s;animation-delay:-.9s}.moment-card-3{animation-name:memory-float-3;animation-duration:7.8s;animation-delay:-2.2s}.moment-card-4{animation-name:memory-float-4;animation-duration:8.8s;animation-delay:-3.6s}.moment-card-5{animation-name:memory-float-5;animation-duration:7.1s;animation-delay:-1.7s}@keyframes sparkle-drift{0%,to{opacity:.22;transform:translateY(4px)scale(.9)}50%{opacity:.68;transform:translateY(-8px)scale(1.08)}}@keyframes photo-float{0%,to{transform:rotate(-10deg)translate(0,0)}50%{transform:rotate(-8deg)translateY(-8px)}}@keyframes photo-float-1{0%,to{transform:rotate(-10deg)translate(0,0)}50%{transform:rotate(-8deg)translateY(-8px)}}@keyframes photo-float-2{0%,to{transform:rotate(10deg)translate(0,0)}50%{transform:rotate(11deg)translateY(-7px)}}@keyframes photo-float-3{0%,to{transform:rotate(8deg)translate(0,0)}50%{transform:rotate(7deg)translateY(-8px)}}@keyframes photo-float-4{0%,to{transform:rotate(-8deg)translate(0,0)}50%{transform:rotate(-9deg)translateY(-6px)}}@keyframes reveal-message-in{0%{opacity:0;transform:translate(-50%,calc(12px - 50%))}to{opacity:1;transform:translate(-50%,-50%)}}@keyframes heading-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes letter-content-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes memory-float-1{0%,to{transform:rotate(-2deg)translate(0,0)}50%{transform:rotate(-1deg)translateY(-7px)}}@keyframes memory-float-2{0%,to{transform:rotate(2deg)translate(0,0)}50%{transform:rotate(3deg)translate(5px,-5px)}}@keyframes memory-float-3{0%,to{transform:rotate(-1deg)translate(0,0)}50%{transform:rotate(-2deg)translate(-4px,-8px)}}@keyframes memory-float-4{0%,to{transform:rotate(2deg)translate(0,0)}50%{transform:rotate(1deg)translate(3px,-6px)}}@keyframes memory-float-5{0%,to{transform:rotate(-3deg)translate(0,0)}50%{transform:rotate(-4deg)translate(-5px,-5px)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.heart-mark{transform-origin:50%;animation:3.2s ease-in-out infinite heart-glow}.celebration-sprinkles{z-index:20;pointer-events:none;position:fixed;inset:0;overflow:hidden}.sprinkle{top:-24px;left:var(--sprinkle-left);width:var(--sprinkle-size);height:calc(var(--sprinkle-size) * 1.8);background:var(--sprinkle-color);opacity:0;box-shadow:0 0 9px color-mix(in srgb, var(--sprinkle-color) 60%, transparent);animation:sprinkle-fall var(--sprinkle-duration) var(--sprinkle-delay) ease-in forwards;border-radius:999px;position:absolute}.letter-text-reveal{white-space:pre-wrap;position:relative}.letter-fallback{display:block}.letter-fallback.is-hidden{visibility:hidden}.letter-measure{visibility:hidden;pointer-events:none;white-space:pre-wrap;display:block;position:absolute;inset:0}.letter-lines{white-space:pre-wrap;display:block;position:absolute;inset:0}.letter-reveal-line{white-space:pre-wrap;animation:letter-line-in .42s var(--reveal-delay) ease-out both;display:block}@keyframes heart-glow{0%,to{text-shadow:0 0 22px #ffaec35c;transform:scale(1)}50%{text-shadow:0 0 34px #ffaec3b8,0 0 7px #ffe7ec73;transform:scale(1.055)}}@keyframes sprinkle-fall{0%{opacity:0;transform:translateY(-12px)rotate(0)}10%{opacity:.95}82%{opacity:.8}to{opacity:0;transform:translate3d(var(--sprinkle-drift), 110vh, 0) rotate(var(--sprinkle-rotation))}}@keyframes letter-line-in{0%{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.heart-mark{animation:none}.celebration-sprinkles{display:none}.letter-reveal-line{opacity:1;animation:none}}
