@import url('https://fonts.googleapis.com/css2?family=Gaegu:wght@400;700&family=Patrick+Hand&display=swap');

:root{--ink:#31365b;--paper:#fff9ed;--pink:#ff7f9f;--pink-soft:#ffd8dc;--peach:#ffc7b9;--yellow:#ffe6a6;--green:#cfe8b9;--blue:#b9ddee;--line:3px solid var(--ink)}
*{box-sizing:border-box}html{min-height:100%;background:var(--pink-soft)}body{margin:0;min-height:100svh;color:var(--ink);font-family:"Patrick Hand","Comic Sans MS",cursive;overflow-x:hidden;background:radial-gradient(circle at 11% 18%,rgba(255,255,255,.72) 0 2px,transparent 3px),radial-gradient(circle at 79% 31%,rgba(255,255,255,.55) 0 2px,transparent 3px),linear-gradient(180deg,#ffd3d6 0%,#ffc8c2 100%)}button{font:inherit}
.page-shell{min-height:100svh;display:grid;place-items:center;padding:clamp(24px,5vw,64px) 18px;position:relative;isolation:isolate}.page-shell::before,.page-shell::after{content:"";position:fixed;z-index:-2;width:280px;height:280px;border-radius:46% 54% 62% 38% / 51% 43% 57% 49%;border:3px dashed rgba(49,54,91,.16)}.page-shell::before{left:-120px;top:-90px;transform:rotate(20deg)}.page-shell::after{right:-130px;bottom:-120px;transform:rotate(-18deg)}
.sparkles .ambient-icon{position:fixed;z-index:-1;width:30px;height:30px;opacity:.72;overflow:visible;filter:drop-shadow(2px 2px 0 rgba(49,54,91,.12));animation:floaty 5s ease-in-out infinite}.sparkles .s1{left:7%;top:14%}.sparkles .s2{right:9%;top:12%;animation-delay:-1s}.sparkles .s3{left:12%;bottom:12%;animation-delay:-2s}.sparkles .s4{right:14%;bottom:20%;animation-delay:-.5s}.sparkles .s5{left:4%;top:51%;animation-delay:-3s}.sparkles .s6{right:4%;top:50%;animation-delay:-2.2s}.line{stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}@keyframes floaty{50%{transform:translateY(-9px) rotate(8deg)}}
.hero-card,.success-card{width:min(820px,100%);background:var(--paper);border:var(--line);border-radius:26px 22px 30px 20px;box-shadow:9px 10px 0 rgba(49,54,91,.16);position:relative}.hero-card{min-height:min(820px,calc(100svh - 48px));padding:clamp(30px,5vw,54px) clamp(22px,6vw,72px) 132px;display:grid;place-items:center;overflow:hidden}.hero-card::before{content:"";position:absolute;inset:12px;border:2px dashed rgba(49,54,91,.18);border-radius:20px 18px 24px 16px;pointer-events:none}.tape{position:absolute;top:-12px;width:100px;height:32px;background:rgba(255,230,166,.88);border:2px solid rgba(49,54,91,.32)}.tape-left{left:10%;transform:rotate(-5deg)}.tape-right{right:10%;transform:rotate(4deg)}
.mini-window{position:absolute;left:30px;top:32px;width:175px;border:2px solid var(--ink);border-radius:14px;overflow:hidden;transform:rotate(-3deg);background:#dbe8ff}.window-top{height:27px;display:flex;gap:5px;align-items:center;padding:0 9px;border-bottom:2px solid var(--ink);background:#c3d7f3}.dot{width:8px;height:8px;border-radius:50%;border:1.5px solid var(--ink);background:#fff9ed}.window-content{padding:13px 10px;display:flex;align-items:center;gap:8px;font-size:14px}.window-sticker{width:22px;height:22px;overflow:visible;filter:drop-shadow(1px 1px 0 rgba(49,54,91,.12))}
.content{text-align:center;width:100%;max-width:650px;position:relative;z-index:2}.eyebrow{display:inline-flex;gap:8px;align-items:center;border:2px solid var(--ink);background:#fff;padding:6px 13px;border-radius:999px;transform:rotate(-1deg);font-size:clamp(15px,2.2vw,18px)}.eyebrow-icon{width:20px;height:20px;overflow:visible;filter:drop-shadow(1px 1px 0 rgba(49,54,91,.12))}h1{margin:26px auto 14px;font-family:"Gaegu","Comic Sans MS",cursive;font-size:clamp(43px,8vw,82px);line-height:.9;letter-spacing:-1.5px;max-width:680px}.scribble{position:relative;color:#ef6d91;white-space:nowrap}.scribble::after{content:"";position:absolute;left:-5%;right:-5%;bottom:-5px;height:8px;border-bottom:3px solid #ef6d91;border-radius:50%;transform:rotate(-2deg)}.subtitle{margin:0 auto 22px;font-size:clamp(17px,2.5vw,22px);color:#626785}
.button-stage{width:min(650px,100%);height:clamp(300px,38vh,350px);margin:0 auto;position:relative;border:2px dashed rgba(49,54,91,.2);border-radius:24px 20px 27px 19px;background:rgba(255,216,220,.22);overflow:hidden}.choice{position:absolute;min-width:128px;min-height:58px;border:3px solid var(--ink);border-radius:16px 13px 17px 12px;color:var(--ink);box-shadow:4px 5px 0 var(--ink);cursor:pointer;font-size:23px;font-weight:700;transition:transform .12s ease,left .07s linear,top .07s linear,background .18s ease;user-select:none;touch-action:manipulation;display:flex;align-items:center;justify-content:center;gap:9px}.choice:focus-visible{outline:4px solid #6e92ff;outline-offset:5px}.choice:active{box-shadow:2px 2px 0 var(--ink);transform:translate(2px,3px)}.choice svg{width:24px;height:24px;overflow:visible;filter:drop-shadow(1px 1px 0 rgba(49,54,91,.12))}.yes{left:17%;top:calc(50% - 29px);background:#ff91ad}.yes:hover{transform:translateY(-3px) rotate(-1deg) scale(1.04);background:#ff7d9f}.no{left:62%;top:calc(50% - 29px);background:#fff3c6}.hint{min-height:24px;margin:14px 0 0;font-size:16px;color:#7f7590}
.corner-gif{position:absolute;z-index:1;object-fit:contain;pointer-events:none}.gif-left{width:154px;height:126px;left:22px;bottom:19px;transform:rotate(-3deg)}.gif-right{width:142px;height:126px;right:20px;bottom:17px;transform:rotate(3deg)}.bottom-doodles{position:absolute;inset:auto 0 14px;display:flex;justify-content:center;align-items:center;gap:18px;opacity:.96;pointer-events:none}.sticker{width:32px;height:32px;overflow:visible;filter:drop-shadow(2px 2px 0 rgba(49,54,91,.12))}.sticker:nth-child(2n){transform:rotate(8deg)}.sticker:nth-child(2n+1){transform:rotate(-7deg)}.sticker .line{stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.fill-pink{fill:#ff95af}.fill-yellow{fill:#ffd36e}.fill-blue{fill:#a9dbea}.fill-peach{fill:#ffc2ae}
.success-card{display:none;padding:clamp(34px,6vw,58px) 24px 44px;text-align:center;animation:pop .45s cubic-bezier(.2,.9,.3,1.2);overflow:hidden;isolation:isolate}.success-card.show{display:block}.success-card::before{content:"";position:absolute;inset:12px;border:2px dashed rgba(49,54,91,.18);border-radius:20px 18px 24px 16px;z-index:-1}.success-card::after{content:"";position:absolute;width:230px;height:230px;border-radius:50%;background:#ffdce4;left:50%;top:42%;transform:translate(-50%,-50%);z-index:-2;opacity:.75}.success-sprinkles{display:flex;justify-content:center;gap:22px;margin-bottom:4px}.success-icon{width:30px;height:30px;overflow:visible;filter:drop-shadow(2px 2px 0 rgba(49,54,91,.12))}.success-icon:nth-child(1){transform:rotate(-12deg)}.success-icon:nth-child(2){transform:translateY(-4px) rotate(9deg)}.success-icon:nth-child(3){transform:rotate(-5deg)}.love-note{width:min(220px,70%);margin:4px auto 10px;border:2px solid var(--ink);border-radius:14px 11px 15px 10px;background:#dce9ff;transform:rotate(-2deg);overflow:hidden;box-shadow:4px 5px 0 rgba(49,54,91,.14)}.note-top{height:24px;border-bottom:2px solid var(--ink);display:flex;align-items:center;gap:5px;padding:0 8px;background:#c7daf6}.note-top span{width:7px;height:7px;border-radius:50%;border:1.5px solid var(--ink);background:var(--paper)}.note-body{display:flex;align-items:center;justify-content:center;gap:10px;padding:10px 12px;font-size:18px}.note-body svg{width:27px;height:27px;fill:#ff8eaa;stroke:var(--ink);stroke-width:2}.big-heart{width:clamp(100px,18vw,150px);height:auto;fill:#ff7198;stroke:var(--ink);stroke-width:3;animation:heartbeat 1s infinite;filter:drop-shadow(5px 6px 0 rgba(49,54,91,.22));margin-top:3px}.success-card h2{font-family:"Gaegu",cursive;font-size:clamp(50px,9vw,84px);margin:12px 0 0;line-height:1}.success-card p{font-size:clamp(18px,3vw,24px);margin:4px 0 16px}.success-stickers{display:flex;justify-content:center;align-items:center;gap:12px;margin:6px auto 20px}.success-sticker{width:31px;height:31px;overflow:visible;filter:drop-shadow(2px 2px 0 rgba(49,54,91,.12))}.success-sticker:nth-child(1){transform:rotate(-10deg)}.success-sticker:nth-child(2){transform:rotate(8deg)}.success-sticker:nth-child(3){transform:rotate(-5deg)}.success-sticker:nth-child(4){transform:rotate(11deg)}.success-sticker .line,.success-icon .line{stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.again{border:2px solid var(--ink);background:#fff3c6;color:var(--ink);border-radius:999px;padding:10px 17px 10px 19px;font-size:18px;box-shadow:3px 4px 0 var(--ink);cursor:pointer;display:inline-flex;align-items:center;gap:8px}.again svg{width:19px;height:19px;fill:none;stroke:var(--ink);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.again:hover{transform:translateY(-2px) rotate(-1deg)}@keyframes pop{from{opacity:0;transform:scale(.9) rotate(-1deg)}to{opacity:1;transform:none}}@keyframes heartbeat{50%{transform:scale(1.08) rotate(2deg)}}
.confetti-layer{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:20}.confetti{position:absolute;top:-44px;width:18px;height:18px;background:var(--heart-color,#ff91ad);transform:rotate(-45deg);animation:fall var(--dur) linear forwards;filter:drop-shadow(1px 1px 0 rgba(49,54,91,.3))}.confetti::before,.confetti::after{content:"";position:absolute;width:18px;height:18px;background:inherit;border-radius:50%}.confetti::before{top:-9px;left:0}.confetti::after{left:9px;top:0}@keyframes fall{to{transform:translateY(110vh) rotate(calc(-45deg + var(--rot) + 520deg));opacity:.18}}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,130%);background:var(--ink);color:#fff9ed;padding:10px 16px;border-radius:999px;z-index:30;transition:.25s ease;box-shadow:3px 4px 0 rgba(255,255,255,.7);font-size:17px;white-space:nowrap}.toast.show{transform:translate(-50%,0)}
@media(max-width:640px){.page-shell{padding:14px;align-items:center}.hero-card{min-height:calc(100svh - 28px);padding:104px 14px 105px;border-radius:22px 18px 25px 17px}.mini-window{top:25px;left:24px;width:155px}.gif-left{left:4px;bottom:13px;width:104px;height:92px}.gif-right{right:2px;bottom:12px;width:100px;height:92px}.bottom-doodles{gap:9px;bottom:18px}.sticker{width:25px;height:25px}h1{margin-top:22px;font-size:clamp(44px,14vw,64px)}.subtitle{max-width:310px;margin-bottom:18px}.button-stage{height:clamp(300px,43svh,390px);border-radius:20px}.choice{min-width:114px;min-height:54px;font-size:21px}.yes{left:8%;top:calc(50% - 27px)}.no{left:58%;top:calc(50% - 27px)}.tape{width:72px;height:27px}.toast{bottom:16px;font-size:15px;max-width:calc(100vw - 24px);white-space:normal;text-align:center}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}.choice{transition:none}}