.container{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden}.floating-heart{position:absolute;animation:floatHeart linear infinite;pointer-events:none;z-index:0;filter:drop-shadow(0 0 10px rgba(255,77,109,.3))}@keyframes floatHeart{0%{transform:translateY(100vh) rotate(0) scale(0);opacity:0}10%{opacity:1;transform:translateY(80vh) rotate(20deg) scale(1)}90%{opacity:1}to{transform:translateY(-20vh) rotate(-20deg) scale(.8);opacity:0}}.sparkle{position:fixed;pointer-events:none;border-radius:50%;background:radial-gradient(circle,#ffd700 0%,#ff69b4 50%,transparent 70%);animation:sparkleAnim .6s ease-out forwards;z-index:100}@keyframes sparkleAnim{0%{transform:scale(1);opacity:1}to{transform:scale(0);opacity:0}}.content{position:relative;z-index:10;display:flex;flex-direction:column;align-items:center}.envelope{position:relative;background:linear-gradient(145deg,#fff9fb,#ffe6eb);border-radius:20px;padding:60px 50px 50px;box-shadow:0 20px 60px #c7158533,0 0 0 1px #ffffff80 inset,0 0 100px #ff69b41a;animation:envelopeFloat 3s ease-in-out infinite;max-width:90vw}.envelope:before{content:"";position:absolute;top:-30px;left:50%;transform:translate(-50%);width:60px;height:60px;background:linear-gradient(135deg,#ff6b95,#ff8fa3);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 5px 20px #ff6b9566}.envelope:after{content:"💌";position:absolute;top:-20px;left:50%;transform:translate(-50%);font-size:40px;animation:bounce 1s ease-in-out infinite}@keyframes envelopeFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes bounce{0%,to{transform:translate(-50%) translateY(0)}50%{transform:translate(-50%) translateY(-5px)}}.letter{text-align:center}.letter-decoration{font-size:24px;margin-bottom:20px;animation:sparkleText 2s ease-in-out infinite}@keyframes sparkleText{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.1)}}.title{font-family:Playfair Display,serif;color:var(--pink-accent);margin-bottom:40px;line-height:1.4}.name{font-size:clamp(2rem,8vw,3.5rem);font-weight:600;background:linear-gradient(135deg,#c9184a,#ff4d6d,#ff8fa3);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:shimmer 3s ease-in-out infinite;display:inline-block}@keyframes shimmer{0%,to{filter:brightness(1)}50%{filter:brightness(1.2)}}.question{font-size:clamp(1.2rem,4vw,1.8rem);font-weight:400;font-style:italic;color:var(--pink-deeper);display:block;margin-top:10px;animation:fadeInUp .5s ease-out}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.buttons-container{display:flex;gap:20px;justify-content:center;flex-wrap:wrap}.btn{font-family:Quicksand,sans-serif;font-size:1.3rem;font-weight:600;padding:15px 40px;border:none;border-radius:50px;cursor:pointer;transition:all .3s cubic-bezier(.68,-.55,.265,1.55);position:relative;overflow:hidden}.btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(120deg,transparent,rgba(255,255,255,.4),transparent);transition:.5s}.btn:hover:before{left:100%}.btn-yes{background:linear-gradient(135deg,#ff4d6d,#c9184a);color:#fff;box-shadow:0 8px 25px #c9184a66,0 0 #ff4d6d66;animation:yesButtonPulse 2s ease-in-out infinite}@keyframes yesButtonPulse{0%,to{box-shadow:0 8px 25px #c9184a66,0 0 #ff4d6d66}50%{box-shadow:0 8px 35px #c9184a99,0 0 0 15px #ff4d6d00}}.btn-yes:hover{transform:scale(1.1);box-shadow:0 12px 35px #c9184a80}.btn-yes:active{transform:scale(.95)}.btn-no{background:linear-gradient(135deg,#ffb3c1,#ff8fa3);color:#fff;box-shadow:0 5px 15px #ff8fa34d;z-index:20}.btn-no:hover{background:linear-gradient(135deg,#ff8fa3,#ff4d6d)}.corner-decoration{position:absolute;font-size:40px;opacity:.6;animation:cornerPulse 3s ease-in-out infinite;z-index:1}.top-left{top:20px;left:20px;animation-delay:0s}.top-right{top:20px;right:20px;animation-delay:.5s}.bottom-left{bottom:20px;left:20px;animation-delay:1s}.bottom-right{bottom:20px;right:20px;animation-delay:1.5s}@keyframes cornerPulse{0%,to{transform:scale(1) rotate(0);opacity:.6}50%{transform:scale(1.2) rotate(10deg);opacity:1}}.celebration-container{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#fff0f3,#ffccd5,#ff8fa3 60%,#ff4d6d);background-size:400% 400%;animation:celebrationGradient 5s ease infinite;overflow:hidden}@keyframes celebrationGradient{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.celebration-content{position:relative;z-index:10;text-align:center}.big-heart{font-size:120px;animation:bigHeartBeat .8s ease-in-out infinite;filter:drop-shadow(0 0 30px rgba(255,77,109,.5))}@keyframes bigHeartBeat{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.celebration-title{font-family:Playfair Display,serif;font-size:clamp(4rem,15vw,8rem);color:#fff;text-shadow:0 4px 20px rgba(201,24,74,.4),0 0 60px rgba(255,255,255,.3);margin:20px 0;animation:celebrationTitle .5s ease-out}@keyframes celebrationTitle{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.celebration-text{font-family:Playfair Display,serif;font-size:clamp(1.5rem,5vw,2.5rem);color:#fff;margin:10px 0;animation:fadeInUp .8s ease-out .3s both}.celebration-subtext{font-family:Quicksand,sans-serif;font-size:clamp(1rem,3vw,1.5rem);color:#ffffffe6;margin-top:20px;animation:fadeInUp .8s ease-out .6s both}.celebration-heart{animation:celebrationFloat linear infinite!important}@keyframes celebrationFloat{0%{transform:translateY(100vh) rotate(0) scale(1)}to{transform:translateY(-100vh) rotate(360deg) scale(1.5)}}.heart-burst{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}.burst-heart{position:absolute;font-size:30px;animation:burstOut 2s ease-out infinite;animation-delay:var(--delay)}@keyframes burstOut{0%{transform:translate(0) scale(0);opacity:1}to{transform:translate(calc(cos(var(--angle))*200px),calc(sin(var(--angle))*200px)) scale(1);opacity:0}}.confetti-container{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden;z-index:100}.confetti{position:absolute;width:10px;height:20px;top:-20px;animation:confettiFall linear infinite;animation-duration:3s}@keyframes confettiFall{0%{top:-20px;transform:translate(0) rotate(0);opacity:1}to{top:100vh;transform:translate(100px) rotate(720deg);opacity:.7}}@media (max-width: 600px){.envelope{padding:50px 30px 40px;margin:20px}.btn{padding:12px 30px;font-size:1.1rem}.corner-decoration{font-size:25px}}:root{--pink-lightest: #fff5f8;--pink-light: #ffccd5;--pink-medium: #ffb3c1;--pink-dark: #ff8fa3;--pink-deeper: #e75480;--pink-accent: #c9184a;--red-heart: #ff4d6d;--gold-shimmer: #ffd700;--white-cream: #fffaf0}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;width:100%;overflow:hidden}body{font-family:Quicksand,sans-serif;background:linear-gradient(135deg,var(--pink-lightest) 0%,var(--pink-light) 25%,var(--pink-medium) 50%,var(--pink-light) 75%,var(--pink-lightest) 100%);background-size:400% 400%;animation:gradientShift 15s ease infinite;cursor:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 100 100"><text y="80" font-size="80">💕</text></svg>') 16 16,auto}@keyframes gradientShift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}