:root{color:#fff7fb;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:#170711;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{width:100%;min-width:320px;min-height:100%;margin:0}body{overflow:hidden}button{font:inherit}h1,p,figure{margin:0}.romance-frame{background:radial-gradient(circle at 18% 18%,#ffc69133,#0000 26rem),radial-gradient(circle at 82% 22%,#5bcec429,#0000 24rem),radial-gradient(circle at 50% 86%,#ff4a8b2e,#0000 28rem),linear-gradient(150deg,#170711 0%,#321128 44%,#0d1823 100%);place-items:center;min-height:100svh;padding:clamp(18px,4vw,48px);display:grid;position:relative;overflow:hidden}.romance-frame:before,.romance-frame:after{content:"";pointer-events:none;filter:blur(8px);opacity:.55;border-radius:999px;animation:12s ease-in-out infinite alternate auroraDrift;position:absolute;inset:auto}.romance-frame:before{background:radial-gradient(circle,#ffd58f33,#0000 62%);width:min(74vw,760px);height:min(74vw,760px);top:-24vw;left:-18vw}.romance-frame:after{background:radial-gradient(circle,#4edaca2e,#0000 64%);width:min(68vw,680px);height:min(68vw,680px);animation-delay:-4s;bottom:-22vw;right:-20vw}.night-sky{pointer-events:none;position:absolute;inset:0;overflow:hidden}.night-sky span{aspect-ratio:1;opacity:.24;width:clamp(3px,.55vw,7px);animation:5.4s ease-in-out infinite alternate starFloat;animation-delay:calc(var(--star) * -.21s);background:#ffe6a8;border-radius:999px;position:absolute;top:50%;left:50%;box-shadow:0 0 18px #ffda97b8}.night-sky span:first-child{top:12%;left:8%}.night-sky span:nth-child(2){top:28%;left:18%}.night-sky span:nth-child(3){top:9%;left:31%}.night-sky span:nth-child(4){top:18%;left:44%}.night-sky span:nth-child(5){top:11%;left:61%}.night-sky span:nth-child(6){top:24%;left:76%}.night-sky span:nth-child(7){top:14%;left:89%}.night-sky span:nth-child(8){top:48%;left:12%}.night-sky span:nth-child(9){top:62%;left:25%}.night-sky span:nth-child(10){top:42%;left:38%}.night-sky span:nth-child(11){top:56%;left:54%}.night-sky span:nth-child(12){top:44%;left:68%}.night-sky span:nth-child(13){top:58%;left:84%}.night-sky span:nth-child(14){top:38%;left:94%}.night-sky span:nth-child(15){top:76%;left:6%}.night-sky span:nth-child(16){top:86%;left:19%}.night-sky span:nth-child(17){top:78%;left:33%}.night-sky span:nth-child(18){top:90%;left:47%}.night-sky span:nth-child(19){top:74%;left:59%}.night-sky span:nth-child(20){top:84%;left:73%}.night-sky span:nth-child(21){top:78%;left:88%}.night-sky span:nth-child(22){top:8%;left:16%}.night-sky span:nth-child(23){top:36%;left:28%}.night-sky span:nth-child(24){top:68%;left:42%}.night-sky span:nth-child(25){top:31%;left:57%}.night-sky span:nth-child(26){top:67%;left:71%}.night-sky span:nth-child(27){top:7%;left:82%}.night-sky span:nth-child(28){top:88%;left:96%}.gift-scene{z-index:2;place-items:center;width:min(100%,980px);min-height:min(88svh,780px);display:grid;position:relative}.moment-stage{text-align:center;align-content:center;justify-items:center;gap:clamp(18px,3vw,30px);width:min(100%,820px);display:grid}.eyebrow{color:#ffe9bd;letter-spacing:0;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#230a1b9e;border:1px solid #ffe7bc52;border-radius:999px;justify-content:center;align-items:center;min-height:34px;padding:0 14px;font-size:clamp(.78rem,1.7vw,.9rem);font-weight:800;display:inline-flex}.locket-wrap{aspect-ratio:1;place-items:center;width:min(64vw,390px);display:grid;position:relative}.heart-locket{z-index:3;aspect-ratio:1;color:#fff6f8;cursor:pointer;filter:drop-shadow(0 28px 58px #ff3e7d57);background:0 0;border:0;border-radius:999px;place-items:center;width:48%;transition:transform .22s,filter .22s;display:grid;position:relative}.heart-locket:hover{filter:drop-shadow(0 34px 70px #ff649670);transform:translateY(-3px)scale(1.02)}.heart-locket:active{transform:scale(.96)}.heart-locket:focus-visible,.primary-action:focus-visible{outline-offset:5px;outline:3px solid #ffe09c}.heart-halo{border-radius:inherit;background:radial-gradient(circle,#ffdda647,#0000 58%),radial-gradient(circle,#ff4e874d,#0000 68%);animation:2.7s ease-in-out infinite heartPulse;position:absolute;inset:-32%}.heart-core{aspect-ratio:1;border-radius:inherit;background:radial-gradient(circle at 35% 28%,#ffffff80,#0000 20%),linear-gradient(145deg,#ff5d92,#a91755 58%,#4a102f);border:1px solid #ffead175;place-items:center;width:100%;display:grid;position:relative;box-shadow:inset 0 0 24px #ffffff2e,0 0 74px #ff48888a}.heart-core svg{width:48%;height:48%}.twenty-ring{border-radius:999px;animation:7s ease-in-out infinite ringBreathe;position:absolute;inset:4%}.twenty-ring span{--angle:calc(var(--light) * 18deg);aspect-ratio:1;width:clamp(8px,1.6vw,14px);transform:translate(-50%, -50%) rotate(var(--angle)) translateY(calc(-1 * min(28vw, 170px)));transform-origin:50%;opacity:0;animation:1.2s forwards lightWake,2.4s ease-in-out infinite alternate lightTwinkle;animation-delay:calc(var(--light) * 45ms), calc(var(--light) * -.13s);background:#ffe3a0;border-radius:999px;position:absolute;top:50%;left:50%;box-shadow:0 0 16px #ffdf9de6,0 0 34px #ff639761}.age-mark{z-index:4;color:#ffe7aa;letter-spacing:0;text-shadow:0 18px 42px #0000005c;font-size:clamp(3.4rem,12vw,7rem);font-weight:900;line-height:.9;position:absolute;bottom:8%;right:5%}.moment-photos .locket-wrap{width:min(72vw,430px);margin-bottom:clamp(44px,8vw,76px)}.featured-photo{--photo-frame-width:min(78vw, 410px);--photo-frame-half:min(39vw, 205px);z-index:4;left:calc(50% - var(--photo-frame-half));width:var(--photo-frame-width);aspect-ratio:1.18;pointer-events:none;background:linear-gradient(#fff9eff5,#ffe1ede6);border:1px solid #ffeed185;border-radius:22px;grid-template-rows:1fr auto;gap:10px;padding:clamp(8px,1.8vw,12px) clamp(8px,1.8vw,12px) clamp(11px,2vw,15px);animation:5.8s ease-in-out infinite alternate photoFloat;display:grid;position:absolute;bottom:-15%;box-shadow:0 22px 54px #00000057,0 0 34px #ff78a138}.featured-photo:before{content:"";background:radial-gradient(circle at 50% 35%,#fff7eceb,#0000 0 13%,#0000 14%),radial-gradient(circle at 50% 48%,#ff84aedb,#0000 0 22%,#0000 23%),linear-gradient(145deg,#301426,#8d204d 52%,#ffd1a4);border-radius:16px;position:absolute;inset:clamp(8px,1.8vw,12px) clamp(8px,1.8vw,12px) clamp(40px,7vw,48px);box-shadow:inset 0 0 0 1px #3d0f2524}.featured-photo img,.photo-fallback{grid-area:1/1}.featured-photo img{z-index:2;object-fit:cover;border-radius:16px;width:100%;height:100%;min-height:0;position:relative;box-shadow:inset 0 0 0 1px #3d0f2524}.photo-fallback{z-index:1;color:#fff7f0;text-shadow:0 14px 34px #2307168c;border-radius:16px;place-items:center;min-height:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(1.55rem,6vw,3rem);font-weight:700;line-height:1;display:grid;position:relative}.featured-photo figcaption{z-index:3;color:#3c1024;text-align:center;font-size:clamp(.8rem,1.7vw,.92rem);font-weight:900;line-height:1.05;position:relative}.love-orbit{pointer-events:none;display:grid;position:absolute;inset:-2%}.love-orbit span{color:#fff4d7;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#180712c7;border:1px solid #ffe5b847;border-radius:999px;max-width:13rem;padding:10px 14px;font-size:clamp(.82rem,1.7vw,.98rem);font-weight:780;line-height:1.2;position:absolute;box-shadow:0 18px 42px #0000003d}.love-orbit span:first-child{top:16%;left:0}.love-orbit span:nth-child(2){top:42%;right:-2%}.love-orbit span:nth-child(3){bottom:8%;left:18%}.copy{gap:clamp(10px,1.8vw,16px);width:min(100%,720px);display:grid}.copy h1{color:#fff8fb;letter-spacing:0;text-wrap:balance;font-size:clamp(2.35rem,6.6vw,5.35rem);font-weight:900;line-height:.98}.moment-letter .copy h1,.moment-twenty .copy h1,.moment-photos .copy h1{font-size:clamp(2.15rem,5.8vw,4.7rem)}.copy p{color:#f7dce8;text-wrap:pretty;width:min(100%,660px);margin:0 auto;font-size:clamp(1rem,2.15vw,1.26rem);font-weight:520;line-height:1.66}.moment-letter .copy p{color:#fff0f5;max-width:680px;font-size:clamp(1.04rem,2vw,1.2rem)}.primary-action{color:#260817;letter-spacing:0;cursor:pointer;background:linear-gradient(135deg,#ffe09a,#ff9fc4 52%,#f05f9c);border:1px solid #fff6e27a;border-radius:999px;justify-content:center;align-items:center;gap:10px;max-width:min(100%,360px);min-height:54px;padding:0 22px;font-weight:900;transition:transform .2s,box-shadow .2s,filter .2s;display:inline-flex;box-shadow:0 22px 58px #ff5e9747,inset 0 1px #ffffff80}.primary-action:hover{filter:brightness(1.04);transform:translateY(-3px);box-shadow:0 28px 66px #ff5e9761,inset 0 1px #ffffff94}.primary-action:active{transform:translateY(0)scale(.98)}@keyframes auroraDrift{0%{transform:translate(0,0)scale(1)}to{transform:translate(5vw,-2vw)scale(1.08)}}@keyframes starFloat{0%{opacity:.18;transform:translate(0,0)scale(.9)}to{opacity:.62;transform:translate(10px,-18px)scale(1.18)}}@keyframes heartPulse{0%,to{opacity:.72;transform:scale(.94)}50%{opacity:1;transform:scale(1.08)}}@keyframes ringBreathe{0%,to{transform:scale(.98)rotate(-3deg)}50%{transform:scale(1.02)rotate(3deg)}}@keyframes lightWake{0%{opacity:0}to{opacity:.92}}@keyframes lightTwinkle{0%{filter:brightness(.88);scale:.92}to{filter:brightness(1.2);scale:1.12}}@keyframes photoFloat{0%{translate:0}to{translate:0 -10px}}@media (width<=680px){.romance-frame{padding:18px}.gift-scene{min-height:92svh}.moment-stage{gap:18px}.locket-wrap{width:min(78vw,310px)}.copy h1{font-size:clamp(2rem,11.5vw,3.65rem);line-height:1.02}.moment-letter .copy h1,.moment-twenty .copy h1{font-size:clamp(1.9rem,10vw,3.25rem)}.copy p{font-size:clamp(.98rem,4vw,1.1rem);line-height:1.58}.age-mark{bottom:7%;right:2%}.moment-photos .locket-wrap{width:min(84vw,330px);margin-bottom:clamp(58px,18vw,82px)}.featured-photo{--photo-frame-width:min(82vw, 310px);--photo-frame-half:min(41vw, 155px);border-radius:18px;bottom:-21%}.featured-photo:before,.featured-photo img,.photo-fallback{border-radius:13px}.love-orbit span{max-width:10.5rem;padding:9px 12px}.love-orbit span:first-child{top:10%;left:-3%}.love-orbit span:nth-child(2){top:48%;right:-4%}.love-orbit span:nth-child(3){bottom:4%;left:12%}.primary-action{width:min(100%,310px);min-height:52px;padding:0 18px}}@media (height<=700px){.gift-scene{min-height:calc(100svh - 36px)}.locket-wrap{width:min(52vw,300px)}.copy h1{font-size:clamp(1.85rem,5.2vw,3.7rem)}.copy p{line-height:1.5}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}