:root{--pink:#ff6b9d;--pink2:#ff8fb8;--soft:#ffe3ee;--cream:#fff8f0;--text:#5a2b41;--shadow:0 12px 40px rgba(255,107,157,.25)}
*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%}
body{font-family:'Quicksand',system-ui,sans-serif;color:var(--text);background:linear-gradient(135deg,#ffe0ec,#fff1f6 45%,#ffe9d9);background-attachment:fixed;overflow-x:hidden}
.wrap{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:16px;position:relative;z-index:2}
.card{display:none;width:100%;max-width:460px;background:rgba(255,255,255,.88);backdrop-filter:blur(6px);border-radius:28px;padding:30px 22px;text-align:center;box-shadow:var(--shadow);border:2px solid #fff}
.card.active{display:block;animation:pop .5s ease}
@keyframes pop{from{opacity:0;transform:translateY(16px) scale(.96)}to{opacity:1;transform:none}}
h1{font-family:'Dancing Script',cursive;font-size:clamp(2.4rem,9vw,3.4rem);color:var(--pink);line-height:1.1;margin-bottom:10px}
h2{font-family:'Dancing Script',cursive;font-size:clamp(1.8rem,7vw,2.3rem);color:var(--pink);margin-bottom:16px;line-height:1.2}
.lead{font-size:1.15rem;font-weight:600;margin:10px 0 22px}
.big-emoji{font-size:3.4rem;margin-bottom:6px}
.bounce{animation:bounce 1.6s infinite}
@keyframes bounce{50%{transform:translateY(-10px)}}
.btn{border:none;cursor:pointer;font:700 1.1rem 'Quicksand',sans-serif;padding:14px 28px;border-radius:999px;transition:transform .15s,box-shadow .15s;touch-action:manipulation}
.btn.yes{background:linear-gradient(135deg,var(--pink),var(--pink2));color:#fff;box-shadow:0 6px 18px rgba(255,107,157,.45);margin-top:8px}
.btn.yes:hover{transform:translateY(-2px) scale(1.04)}
.btn.yes:disabled{opacity:.6;cursor:not-allowed}
.btn.no{background:#fff;color:#999;border:2px solid #eee;transition:left .25s,top .25s,transform .15s}
.btn-row{display:flex;gap:16px;justify-content:center;align-items:center;min-height:70px;flex-wrap:wrap}
.hint{min-height:1.4em;margin-top:14px;font-weight:600;color:var(--pink)}
input[type=text],input[type=date],input[type=time]{width:100%;font:600 1.05rem 'Quicksand',sans-serif;padding:14px 16px;border-radius:16px;border:2px solid var(--soft);background:var(--cream);color:var(--text);margin:6px 0;outline:none;text-align:center}
input:focus{border-color:var(--pink)}
.hidden{display:none!important}
.error{color:#d6336c;font-weight:700;min-height:1.3em;margin:6px 0}
.picked{font-weight:700;color:var(--pink);margin-top:6px}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:8px 0}
.opt{border:2px solid var(--soft);background:var(--cream);border-radius:18px;padding:14px 8px;font:700 1rem 'Quicksand',sans-serif;color:var(--text);cursor:pointer;transition:.15s;touch-action:manipulation}
.opt .em{display:block;font-size:1.9rem;margin-bottom:4px}
.opt:hover{transform:translateY(-2px);border-color:var(--pink2)}
.opt.sel{background:linear-gradient(135deg,var(--pink),var(--pink2));color:#fff;border-color:var(--pink);transform:scale(1.03);box-shadow:0 6px 16px rgba(255,107,157,.4)}
.summary{list-style:none;margin:16px 0;text-align:left;background:var(--cream);border-radius:18px;padding:6px 14px}
.summary li{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px dashed #ffc9dc}
.summary li:last-child{border:none}
.summary b{text-align:right;color:var(--pink);word-break:break-word}
.saved{font-weight:700;color:#2f9e63}
.final-title{font-size:clamp(2rem,8vw,2.8rem)}
.overlay{position:fixed;inset:0;background:rgba(255,240,246,.85);z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:700;gap:12px}
.spinner{width:52px;height:52px;border-radius:50%;border:6px solid var(--soft);border-top-color:var(--pink);animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.yay-text{font-family:'Dancing Script',cursive;font-size:3.2rem;color:var(--pink);animation:pop .5s}
#confetti{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:60}
.hearts{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:1}
.heart{position:absolute;bottom:-40px;animation:floatUp linear infinite;opacity:.6}
@keyframes floatUp{to{transform:translateY(-115vh) rotate(25deg);opacity:0}}
@media(min-width:700px){.card{padding:40px 36px}.grid.choices{grid-template-columns:repeat(3,1fr)}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important}}