*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Tajawal,sans-serif}.page{background:linear-gradient(140deg,#fbd3e9 0%,#f7a8c4 25%,#c9a0dc 55%,#bb8fd0 100%);justify-content:center;align-items:center;min-height:100dvh;padding:40px 20px;display:flex;position:relative;overflow:hidden}.bubble{width:var(--bsize);height:var(--bsize);left:var(--bx);top:var(--by);opacity:var(--bopacity);pointer-events:none;animation:drift var(--bdur) var(--bdelay) ease-in-out infinite alternate;z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff59,#ffb4dc1f);border-radius:50%;position:fixed}@keyframes drift{0%{transform:translate(0)scale(1)}50%{transform:translate(25px,-30px)scale(1.08)}to{transform:translate(-20px,20px)scale(.95)}}.content{z-index:1;text-align:center;flex-direction:column;align-items:center;gap:8px;width:100%;max-width:400px;display:flex;position:relative}.avatar{object-fit:cover;border:4px solid #fffc;border-radius:50%;width:160px;height:160px;animation:.7s ease-out fadeUp,3s ease-in-out infinite glow;box-shadow:0 8px 40px #c83c7859}@keyframes fadeUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes glow{0%,to{box-shadow:0 8px 40px #c83c784d}50%{box-shadow:0 8px 55px #dc3c8c8c}}.question{color:#fff;text-shadow:0 2px 20px #781e504d;margin:20px 0 28px;font-family:Tajawal,sans-serif;font-size:30px;font-weight:800;line-height:1.6;animation:.9s ease-out fadeUp}.buttons{grid-template-columns:1fr 1fr;gap:18px;width:100%;max-width:300px;animation:1.1s ease-out fadeUp;display:grid}.btn{cursor:pointer;letter-spacing:.5px;border:none;border-radius:50px;padding:14px 44px;font-family:Tajawal,sans-serif;font-size:19px;font-weight:700;transition:all .3s}.btn-yes{color:#d6336c;background:#fff;box-shadow:0 4px 24px #0000001f}.btn-yes:hover{transform:scale(1.08);box-shadow:0 6px 32px #0000002e}.btn-yes:active{transform:scale(.97)}.btn-no{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff;z-index:9999;background:#ffffff59;box-shadow:0 2px 12px #00000014}.flower-img{width:240px;max-width:70vw;height:auto;box-shadow:none;object-fit:contain;opacity:0;border:none;border-radius:0;animation:1.2s ease-out forwards riseIn}@keyframes riseIn{0%{opacity:0;transform:translateY(80px)}to{opacity:1;transform:translateY(0)}}.success-title{color:#fff;text-shadow:0 2px 20px #781e5059;margin:20px 0 8px;font-family:Tajawal,sans-serif;font-size:34px;font-weight:800;line-height:1.5;animation:.6s ease-out popIn}.success-msg{color:#ffffffeb;text-shadow:0 1px 10px #781e5033;font-family:Tajawal,sans-serif;font-size:20px;font-weight:500;line-height:1.8;animation:1s ease-out fadeUp}@keyframes popIn{0%{opacity:0;transform:scale(.4)}70%{transform:scale(1.1)}to{opacity:1;transform:scale(1)}}.floating-heart{color:#ffffffb3;font-size:var(--size);left:var(--x);animation:floatUp var(--duration) var(--delay) ease-in infinite;z-index:0;pointer-events:none;position:fixed;bottom:-50px}@keyframes floatUp{0%{opacity:.7;transform:translateY(0)rotate(0)}to{opacity:0;transform:translateY(-110vh)rotate(360deg)}}@media (width<=480px){.page{padding:32px 16px}.avatar{width:130px;height:130px}.question{margin:16px 0 24px;font-size:26px}.btn{padding:12px 36px;font-size:17px}.flower-img{width:200px}.success-title{font-size:28px}.success-msg{font-size:18px}}
