:root{
  --accent1:#ff6b8a;
  --accent2:#ff4d6d;
  --card-bg: rgba(255,255,255,0.95);
  --text:#28303a;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{font-family:"Poppins",sans-serif;color:var(--text);background:linear-gradient(120deg,#fff7fb 0%,#fffaf6 40%,#fff6fb 100%);overflow:hidden;}
#hearts-layer{position:fixed;inset:0;pointer-events:none;z-index:0;}
.heart{position:absolute;animation:floatUp var(--dur) linear forwards;}
@keyframes floatUp{0%{transform:translateY(100vh) translateX(var(--x)) scale(var(--s));opacity:1}100%{transform:translateY(-10vh) translateX(calc(var(--x) + var(--drift))) scale(var(--s));opacity:0}}
.stage{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:28px;z-index:2;}
.card{width:min(820px,94vw);background:var(--card-bg);border-radius:20px;padding:clamp(20px,4.5vw,44px);box-shadow:0 18px 40px rgba(35,30,40,0.08);border:1px solid rgba(255,255,255,0.6);}
.headline{font-family:"Pacifico",cursive;color:#d33b63;font-size:clamp(26px,4.5vw,44px);text-align:center;margin:0 0 6px;}
.typed{font-size:clamp(15px,2.6vw,20px);text-align:center;color:#5b5b5b;min-height:54px;margin:6px 0 12px;}
.question{font-weight:600;font-size:clamp(20px,3.8vw,30px);text-align:center;margin:8px 0 18px;color:#333;}
.buttons-wrapper{position:relative;display:flex;justify-content:center;margin-top:6px;min-height:52px;}
.buttons{display:flex;gap:12px;justify-content:center;align-items:center;}
.prev-abs{position:absolute;left:0;top:50%;transform:translateY(-50%);}
.btn{border:0;cursor:pointer;padding:12px 20px;border-radius:12px;font-weight:600;font-size:16px;transition:transform .16s,box-shadow .18s,opacity .18s;}
.btn:active{transform:scale(.99);}
.btn-primary{background:linear-gradient(180deg,var(--accent1),var(--accent2));color:#fff;}
.btn-ghost{background:#fff;color:var(--accent2);border:1px solid rgba(255,100,130,0.12);}
.btn[disabled]{opacity:.45;pointer-events:none;}
.final{text-align:center;display:none;margin-top:10px;}
.final-head{font-family:"Pacifico",cursive;color:#bd2756;font-size:clamp(26px,5vw,50px);margin:6px 0;}
/* Intro */
.intro{position:fixed;inset:0;z-index:6;display:grid;place-items:center;background:rgba(255,246,248,0.9);backdrop-filter:blur(6px);}
.intro-content{display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px 22px;}
.intro-heart{font-size:clamp(44px,12vw,96px);}
.intro-typed-box{min-height:100px;display:flex;align-items:center;justify-content:center;text-align:center;}

@media (max-width: 600px) {
  .buttons-wrapper {
    flex-direction: column;
    align-items: center;
    gap: 8px;
  }

  .prev-abs {
    position: static;
    transform: none;
    order: 2;
    width: auto;
  }

  .buttons {
    order: 1;
  }
}