:root{font-family:ui-rounded,Avenir Next,Avenir,Segoe UI,system-ui,sans-serif;color:#563f4a;background:#fff9f1;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html{min-width:320px;min-height:100%}body{min-width:320px;min-height:100vh;margin:0}button{font:inherit}.page-shell{position:relative;isolation:isolate;display:grid;min-height:100vh;min-height:100svh;place-items:center;overflow:hidden;padding:clamp(1rem,4vw,3rem);background:radial-gradient(circle at 12% 18%,rgb(244 222 232 / 75%) 0 7rem,transparent 7.1rem),radial-gradient(circle at 88% 78%,rgb(225 216 242 / 70%) 0 8rem,transparent 8.1rem),linear-gradient(145deg,#fffaf3,#fff5f1 52%,#faf5ff)}.page-shell:before,.page-shell:after{position:absolute;z-index:-1;width:min(36vw,28rem);aspect-ratio:1;border:1px solid rgb(171 130 150 / 12%);border-radius:50%;content:""}.page-shell:before{top:-18vw;right:-9vw;box-shadow:0 0 0 2.5rem #ffffff2e}.page-shell:after{bottom:-21vw;left:-8vw;box-shadow:0 0 0 3.5rem #fff3}.background-glow{position:absolute;z-index:-1;border-radius:50%;filter:blur(3px);opacity:.55;animation:drift 10s ease-in-out infinite alternate}.background-glow--peach{top:14%;left:7%;width:8rem;height:8rem;background:#ffd9c7}.background-glow--lavender{right:9%;bottom:12%;width:10rem;height:10rem;background:#ded2ef;animation-delay:-3s}.card{position:relative;display:flex;width:min(100%,47rem);min-height:min(46rem,calc(100svh - 2rem));align-items:center;flex-direction:column;justify-content:center;padding:clamp(2rem,6vw,4.75rem) clamp(1rem,6vw,4rem) clamp(1.75rem,5vw,3.25rem);overflow:hidden;border:1px solid rgb(120 83 102 / 12%);border-radius:clamp(2rem,5vw,3.5rem);background:#fffdf9c7;box-shadow:0 2rem 5rem #7d596c21,inset 0 1px #ffffffe5;text-align:center;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);animation:card-arrival .8s cubic-bezier(.22,1,.36,1) both}.eyebrow{margin:0 0 .55rem;color:#896678;font-size:clamp(.8rem,2vw,.95rem);font-weight:700;letter-spacing:.14em;text-transform:uppercase}h1{max-width:35rem;margin:0 0 1rem;color:#5b3d4d;font-family:Iowan Old Style,Palatino Linotype,Georgia,serif;font-size:clamp(2rem,6vw,3.45rem);line-height:1.08;text-wrap:balance}.heart-stage{position:relative;display:grid;width:clamp(17.5rem,54vw,23rem);aspect-ratio:1.05;margin:clamp(1.2rem,4vh,2.4rem) 0 clamp(1rem,3vh,1.75rem);place-items:center;animation:breathe 4.5s ease-in-out infinite}.heart-shape,.heart-shadow{position:absolute;top:18%;left:50%;width:58%;aspect-ratio:1;border-radius:1.6rem 0;transform:translate(-50%) rotate(45deg)}.heart-shape{background:linear-gradient(145deg,#f5c7ce,#eab7c5 55%,#dca6ba);box-shadow:inset 1rem 1rem 2.2rem #ffffff47,inset -.75rem -.75rem 1.8rem #9d5d7b1f}.heart-shape:before,.heart-shape:after,.heart-shadow:before,.heart-shadow:after{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;content:""}.heart-shape:before{left:-50%;background:linear-gradient(205deg,#f8d0d4,#edbdc8)}.heart-shape:after{top:-50%;background:linear-gradient(125deg,#f7ced3,#e9b5c4)}.heart-shadow{top:21%;background:#935d7529;filter:blur(1.2rem);transform:translate(-50%) rotate(45deg) scale(1.03)}.heart-shadow:before,.heart-shadow:after{background:inherit}.heart-shadow:before{left:-50%}.heart-shadow:after{top:-50%}.heart-message{position:relative;z-index:1;width:67%;margin:-35% 0 0;color:#583748;font-family:Iowan Old Style,Palatino Linotype,Georgia,serif;font-size:clamp(1.25rem,4.2vw,1.75rem);font-weight:600;line-height:1.3;text-wrap:balance;animation:message-arrival .5s ease-out both}.message-button{display:inline-flex;min-height:3.75rem;align-items:center;justify-content:center;gap:.7rem;padding:.9rem 1.6rem;border:2px solid transparent;border-radius:999px;color:#fff;background:#785669;box-shadow:0 .65rem 1.5rem #67475833;cursor:pointer;font-size:clamp(1rem,3vw,1.15rem);font-weight:700;transition:transform .18s ease,background-color .18s ease,box-shadow .18s ease}.message-button:hover{background:#674658;box-shadow:0 .8rem 1.7rem #67475840;transform:translateY(-2px)}.message-button:active{transform:translateY(1px)}.message-button:focus-visible{outline:4px solid #be93ab;outline-offset:4px}.message-button span{color:#ffe9c9;font-size:1.15em}.signature{margin:1.2rem 0 0;color:#896b7a;font-size:.95rem;font-weight:600}.decoration{position:absolute;color:#ad8095;font-family:Georgia,serif;line-height:1;opacity:.72;pointer-events:none;animation:twinkle 3s ease-in-out infinite}.decoration--star-one{top:9%;left:9%;color:#d69b6f;font-size:1.6rem}.decoration--flower-one{top:20%;right:8%;color:#ab91c4;font-size:2rem;animation-delay:-1s}.decoration--flower-two{bottom:12%;left:9%;color:#d294a7;font-size:1.8rem;animation-delay:-2s}.decoration--star-two{right:13%;bottom:24%;color:#d5a36f;font-size:1.65rem;animation-delay:-.5s}.decoration--leaf{top:35%;left:6%;color:#8ea28c;font-size:2rem;transform:rotate(-28deg);animation-delay:-1.5s}@keyframes card-arrival{0%{opacity:0;transform:translateY(1.5rem) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes message-arrival{0%{opacity:0;transform:translateY(.6rem)}to{opacity:1;transform:translateY(0)}}@keyframes breathe{0%,to{transform:scale(1)}50%{transform:scale(1.025)}}@keyframes twinkle{0%,to{opacity:.45;transform:scale(.9)}50%{opacity:.85;transform:scale(1.08)}}@keyframes drift{0%{transform:translateZ(0)}to{transform:translate3d(1rem,-.75rem,0)}}@media(max-width:520px){.page-shell{padding:.65rem}.card{min-height:calc(100svh - 1.3rem);border-radius:1.8rem;padding-inline:.5rem}.eyebrow{max-width:16rem}.heart-stage{margin-block:.8rem .65rem}.decoration--leaf,.decoration--flower-one{display:none}}@media(max-height:720px)and (min-width:521px){.card{min-height:calc(100svh - 2rem);padding-block:1.5rem}.heart-stage{width:min(43vh,20rem);margin-block:.7rem}h1{font-size:clamp(1.8rem,5vh,2.8rem)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
