:root { color-scheme: dark; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; overflow-x: hidden; color: white; background: linear-gradient(145deg,#ff5f8f,#9c3fba 55%,#532a9a); }
body::before { content:""; position:fixed; inset:0; opacity:.18; background-image:radial-gradient(circle at 20% 20%,#fff 0 2px,transparent 3px),radial-gradient(circle at 80% 35%,#fff 0 3px,transparent 4px),radial-gradient(circle at 35% 82%,#fff 0 2px,transparent 3px); background-size:140px 160px; }
main { position:relative; z-index:2; min-height:100svh; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:22px; padding:calc(28px + env(safe-area-inset-top)) 22px calc(30px + env(safe-area-inset-bottom)); text-align:center; }
.eyebrow { margin:0; font-size:15px; font-weight:750; letter-spacing:.16em; text-transform:uppercase; opacity:.86; }
.heart { width:132px; height:132px; display:grid; place-items:center; border-radius:50%; font-size:82px; color:#fff; background:rgba(255,255,255,.17); box-shadow:0 18px 50px rgba(70,0,70,.24); animation:pulse 2s ease-in-out infinite; }
.card { width:min(100%,520px); padding:26px 24px; border:1px solid rgba(255,255,255,.24); border-radius:30px; background:rgba(255,255,255,.16); box-shadow:0 24px 70px rgba(45,0,45,.25); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
#counter { margin:0 0 14px; font-size:12px; font-weight:750; letter-spacing:.14em; text-transform:uppercase; opacity:.72; }
h1 { margin:0; font-size:clamp(25px,7vw,36px); line-height:1.28; letter-spacing:-.02em; }
.signature { margin:18px 0 0; font-size:17px; font-weight:650; opacity:.8; }
button { border:0; border-radius:999px; padding:15px 23px; font:700 16px/1 -apple-system,BlinkMacSystemFont,sans-serif; color:#d63384; background:white; box-shadow:0 10px 28px rgba(60,0,50,.2); }
button:active { transform:scale(.96); }
details { width:min(100%,520px); padding:13px 18px; border-radius:18px; background:rgba(255,255,255,.12); font-size:14px; line-height:1.45; }
summary { font-weight:700; cursor:pointer; }
details p { margin:12px 0 2px; opacity:.9; }
#fireworks { position:fixed; z-index:1; inset:0; width:100%; height:100%; pointer-events:none; }
@keyframes pulse { 0%,100%{transform:scale(.96)} 50%{transform:scale(1.05)} }
@media (display-mode:standalone) { details { display:none; } }