@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@500;600&family=Lora:wght@400;500&family=Manrope:wght@400;500;600;700&display=swap');
:root{color-scheme:light;--paper:#f7f8fc;--ink:#29334b;--blue:#6476c5;--blue-dark:#5264b2;--pink:#f1c4cc;--berry:#aa5068;--sans:'Manrope',Arial,sans-serif;--serif:'Lora',Georgia,serif;--hand:'Caveat',cursive}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}button{font:600 17px/1.3 var(--sans);border:0;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:3px solid var(--berry);outline-offset:7px}button:disabled{cursor:default}button:not(:disabled):active{scale:.95}[hidden]{display:none!important}.svg-defs{position:absolute;width:0;height:0}#app{min-height:100svh;overflow:hidden}.play{position:relative;min-height:100svh;padding:28px}.stage-heading{text-align:center;position:absolute;top:clamp(30px,7vh,64px);left:24px;right:24px;z-index:2;pointer-events:none}.stage-heading h1{font:400 clamp(26px,3.3vw,42px)/1.2 var(--serif);margin:0 0 12px}.stage-heading p{font-size:15px;margin:0;color:#6d7489}.board{position:absolute;inset:170px 8vw 90px;display:grid;align-items:center;justify-items:center;gap:22px;grid-template-columns:repeat(var(--cols,4),minmax(0,1fr));grid-template-rows:repeat(var(--rows,3),minmax(72px,1fr));max-width:1120px;margin:auto}.stage-0 .board{inset:0;display:flex;align-items:center;justify-content:center}.stage-1 .board{display:block;inset:0;max-width:none}.stage-1 .game-button{position:absolute;left:72%;top:30%}.game-button{position:relative;min-width:150px;min-height:56px;padding:16px 25px;color:white;background:var(--blue);border-radius:12px;box-shadow:0 5px 0 #4f60a5,0 12px 24px #46558c0c;transition:background .18s,scale .18s,box-shadow .18s,opacity .2s;animation:appear .4s both;animation-delay:var(--delay,0ms);transform:translate(var(--dx,0px),var(--dy,0px)) rotate(var(--tilt,0deg))}.game-button:hover{background:var(--blue-dark);box-shadow:0 6px 0 #4f60a5,0 15px 28px #46558c14;scale:1.04}.game-button.gone{opacity:0;scale:.5;pointer-events:none;animation:none}.shape-circle{border-radius:50%;width:142px;height:142px;min-width:0;padding:24px;line-height:1.55;box-shadow:0 5px 0 #4f60a5}.shape-pill{border-radius:100px;padding:20px 34px}.color-pink{background:#edc4ce;color:#693e50;box-shadow:0 5px 0 #d3a4b3}.color-pink:hover{background:#e7b4c3;box-shadow:0 6px 0 #d3a4b3}.shape-heart{background:transparent!important;box-shadow:none!important;padding:0;width:116px;height:116px;min-width:0;display:grid;place-items:center;color:#824356}.shape-heart svg{position:absolute;inset:0;width:100%;height:100%;fill:#efbdc9;stroke:#dca3b3;stroke-width:1.2;overflow:visible}.shape-heart span{position:relative;font-size:15px;padding-bottom:12px}.shape-heart:hover svg{fill:#e9adbd}.stage-6 .board,.stage-7 .board{display:flex;inset:160px 24px 80px;flex-direction:column;justify-content:center;gap:28px}.stage-6 .shape-heart{width:230px;height:230px}.stage-6 .shape-heart span{font-size:24px;max-width:150px;line-height:1.4;transform:translateY(-8px)}.counter{position:absolute;bottom:35px;left:24px;right:24px;text-align:center;color:#8c91a2;font-size:13px;letter-spacing:.02em}.gift{width:150px;height:120px;position:relative;animation:gift-breathe 2s ease-in-out infinite}.gift-box{position:absolute;inset:34px 9px 0;background:#ced6f2;border-radius:3px 3px 12px 12px;border-bottom:6px solid #b8c3e6}.gift-lid{position:absolute;top:25px;left:0;right:0;height:28px;border-radius:5px;background:#bcc8ec}.gift-ribbon{position:absolute;top:25px;bottom:0;left:64px;width:22px;background:#edbcc9}.gift-bow{position:absolute;top:0;left:41px;width:40px;height:32px;border:8px solid #df9daf;border-radius:70% 70% 0 70%;transform:rotate(16deg)}.gift-bow::after{content:'';position:absolute;left:25px;top:-8px;width:26px;height:17px;border:8px solid #df9daf;border-radius:70% 70% 70% 0;transform:rotate(-30deg)}.primary{padding:17px 30px;background:var(--blue);color:white;border-radius:12px;transition:background .2s,scale .2s;min-height:56px}.primary:hover{background:var(--blue-dark)}.gift-cta{box-shadow:0 5px 0 #4f60a5}.greeting{position:relative;min-height:100svh;padding:28px 24px 22px;text-align:center;animation:reveal .7s ease both;display:flex;flex-direction:column;align-items:center;justify-content:center}.greeting-heart{width:47px;height:47px;fill:none;stroke:#e79ba9;stroke-width:3.7;stroke-linecap:round;stroke-linejoin:round;transform:rotate(-10deg);margin-bottom:9px}.greeting h1{font:400 clamp(40px,5.1vw,70px)/1.08 var(--serif);letter-spacing:-.045em;margin:0;outline:none}.greeting h1 span{font-size:.86em}.greeting-intro{margin:15px 0 2px;font-size:clamp(15px,1.6vw,21px);line-height:1.5}.mice{width:clamp(290px,35vw,455px);height:auto;max-width:86vw;display:block;margin:0 auto -14px;mix-blend-mode:multiply}.love{font:500 clamp(66px,7.6vw,103px)/1 var(--hand);color:var(--berry);margin:0 0 15px}.wish{font-size:clamp(15px,1.5vw,20px);line-height:1.6;margin:0 0 25px;max-width:650px}.greeting-actions{display:flex;align-items:center;gap:26px}.text-button{padding:17px 5px;background:none;color:#4a588f;font-size:16px}.text-button:hover{text-decoration:underline;text-underline-offset:5px}.hug-message{font:500 24px/1.4 var(--hand);color:var(--berry);min-height:34px;margin:10px 0 0}.side-heart{position:absolute;width:32px;height:32px;fill:none;stroke:#e7a0b0;stroke-width:3;pointer-events:none}.left-heart{left:8%;top:36%;transform:rotate(-20deg)}.right-heart{right:8%;top:58%;transform:rotate(13deg)}.particles{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:9}.particle{position:absolute;left:var(--x);top:var(--y);font:500 var(--size,22px)/1 var(--hand);color:var(--color,#bf718a);white-space:nowrap;animation:float-away var(--duration,1.3s) ease-out both;transform:translate(-50%,-50%)}.particle svg{width:var(--size,22px);height:var(--size,22px);fill:currentColor;stroke:none}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.noscript{position:fixed;bottom:50px;width:100%;text-align:center;font-size:16px}@keyframes appear{from{opacity:0;scale:.75}to{opacity:1;scale:1}}@keyframes reveal{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}@keyframes float-away{to{translate:var(--travel-x,0px) var(--travel-y,-100px);rotate:var(--spin,15deg);opacity:0}}@keyframes gift-breathe{50%{transform:translateY(-7px) rotate(-3deg)}}
@media(min-height:950px){.greeting{gap:3px}.mice{width:490px}.greeting-heart{margin-bottom:17px}.wish{margin-bottom:30px}}
@media(max-width:650px){.play{padding:16px}.stage-heading{top:45px;left:20px;right:20px}.stage-heading h1{font-size:29px}.stage-heading p{font-size:14px;line-height:1.6;max-width:290px;margin:auto}.board{inset:160px 18px 65px;gap:16px 10px;grid-template-columns:repeat(var(--mobile-cols,2),minmax(0,1fr));grid-template-rows:repeat(var(--mobile-rows,3),minmax(66px,1fr))}.game-button{min-width:122px;max-width:calc(100% - 6px);padding:15px 14px;font-size:15px;transform:translate(0,var(--mobile-dy,0px)) rotate(var(--tilt,0deg))}.stage-0 .game-button{min-width:164px;font-size:17px;padding:19px 23px}.stage-1 .game-button{left:calc(100% - 166px);top:25%;max-width:none}.shape-circle{width:133px;height:133px;min-width:0;padding:22px}.shape-pill{padding:18px 16px}.shape-heart{min-width:0;width:100px;height:100px;max-width:none}.shape-heart span{font-size:14px}.stage-5 .board{inset:150px 16px 45px;gap:4px 0}.stage-5 .shape-heart{width:76px;height:76px}.stage-5 .shape-heart span{font-size:12px;padding-bottom:8px}.stage-5 .stage-heading h1{font-size:25px}.counter{bottom:15px}.greeting{padding:30px 19px 18px;justify-content:center}.greeting-heart{width:37px;height:37px;margin-bottom:16px}.greeting h1{font-size:40px;line-height:1.13}.greeting h1 span{font-size:1em}.greeting-intro{font-size:15px;max-width:265px;margin:16px 0 9px}.mice{width:320px;max-width:95vw;margin-bottom:0}.love{font-size:73px;margin:0 0 14px}.wish{font-size:15px;max-width:285px;margin-bottom:22px}.greeting-actions{gap:20px}.primary{font-size:15px;padding:16px 20px}.text-button{font-size:14px}.hug-message{font-size:23px;margin-top:13px}.side-heart{width:23px;height:23px}.left-heart{left:5%;top:31%}.right-heart{right:4%;top:59%}}
@media(max-height:690px) and (min-width:651px){.greeting{padding:16px}.greeting-heart{width:30px;height:30px;margin-bottom:5px}.greeting h1{font-size:46px}.greeting-intro{font-size:16px;margin:8px 0 0}.mice{width:300px;margin-bottom:-12px}.love{font-size:72px;margin-bottom:8px}.wish{font-size:15px;margin-bottom:15px}.primary{min-height:46px;padding:12px 24px}.hug-message{margin:4px 0 0;font-size:21px;min-height:28px}}
.game-button{translate:var(--run-x,0px) var(--run-y,0px);transition:background .18s,scale .18s,box-shadow .18s,opacity .2s,translate .22s cubic-bezier(.16,1,.3,1)}
.shape-heart:focus-visible{outline:none}.shape-heart:focus-visible svg{stroke:var(--berry);stroke-width:2}
.stage-6 .board{inset:24px;min-height:0}.stage-6 .shape-heart{width:250px;height:250px}.stage-6 .shape-heart span{font:600 38px/1.06 'Caveat',var(--serif);max-width:180px;text-wrap:balance;transform:translateY(-10px);padding-bottom:12px;color:#743447}
.mouse-photo{width:clamp(280px,30vw,410px);max-width:86vw;margin:21px auto 12px}.mouse-photo .mice{width:100%;height:auto;max-width:none;margin:0;border-radius:14px;mix-blend-mode:normal}.mouse-photo figcaption{font:500 26px/1.3 var(--hand);color:var(--berry);margin:8px 0 0}.greeting:has(.mouse-photo) .love{font-size:clamp(66px,7vw,95px);margin-bottom:25px}
@media(max-width:650px){.mouse-photo{width:290px;max-width:86vw;margin:20px auto 9px}.mouse-photo figcaption{font-size:25px;margin-top:7px}.greeting:has(.mouse-photo) .love{font-size:70px}}
@media(max-height:740px) and (min-width:651px){.mouse-photo{width:270px;margin:12px auto 5px}.mouse-photo figcaption{font-size:23px;margin-top:4px}.greeting:has(.mouse-photo) .love{font-size:70px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.particle{display:none}}
.heart-snake{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3}
.stage-5,.stage-5 .game-button{cursor:none;touch-action:none}
.stage-5 .game-button{animation:none;transition:opacity .16s,scale .16s}
.stage-5 .game-button:hover{scale:1}
.stage-5 .game-button.gone{scale:.3}
.stage-heading h1{text-wrap:balance;white-space:pre-line}
.stage-heading p{white-space:pre-line;line-height:1.55;text-wrap:balance}
.game-button,.primary,.text-button,.bonus-button{text-align:center;text-wrap:balance}
.greeting h1{letter-spacing:-.035em;text-wrap:balance}
.mouse-photo figcaption{white-space:pre-line;text-wrap:balance}
.greeting-actions{justify-content:center;flex-wrap:wrap;column-gap:26px;row-gap:4px}
@media(min-width:651px) and (min-height:741px) and (max-height:940px){.mouse-photo{width:clamp(280px,30vw,350px)}}
