:root{--paper:#f6f1e7;--ink:#2b2622;--ink-soft:#6d635b;--red:#d9483b;--pink:#f2cfc8}*{box-sizing:border-box}html,body{background:var(--paper);color:var(--ink);margin:0}body{-webkit-font-smoothing:antialiased;background-image:radial-gradient(#2b262209 1px,#0000 1px);background-size:4px 4px;min-height:100svh;font-family:Newsreader,Georgia,serif;font-size:19px;line-height:1.6}.hand{letter-spacing:.2px;font-family:Caveat,cursive;font-weight:700}main{z-index:1;max-width:440px;margin:0 auto;padding:64px 26px 140px;position:relative}.screen{display:none}.screen.is-active{animation:.6s both in;display:block}@keyframes in{0%{opacity:0;transform:translateY(10px)}}h1{align-items:center;gap:10px;margin:0 0 28px;font-size:54px;line-height:1;display:flex}h2{text-align:center;margin:8px 0 22px;font-size:40px;line-height:1.05}p{margin:0 0 18px}.small{color:var(--ink-soft);text-align:center;font-size:15px}.sign{margin-top:26px;font-size:30px}.reveal{opacity:0;animation:.8s forwards up;animation-delay:var(--d)}@keyframes up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.draw-heart{flex:none;width:44px;height:40px;transform:rotate(-8deg)}.draw-heart path{fill:#0000;stroke:var(--red);stroke-width:3px;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:190;stroke-dashoffset:190px;transform-origin:50%;animation:1.4s .3s forwards sketch,.6s 1.6s forwards fill,1.6s ease-in-out 2.4s infinite beat}@keyframes sketch{to{stroke-dashoffset:0}}@keyframes fill{to{fill:var(--pink)}}@keyframes beat{0%,to{transform:scale(1)}12%{transform:scale(1.12)}24%{transform:scale(1)}36%{transform:scale(1.08)}}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}.next{border:1.5px solid var(--ink);background:0 0;border-radius:999px;align-items:center;gap:8px;margin-top:18px;padding:12px 20px;font-size:17px;transition:transform .15s,background .2s;display:inline-flex}.next:active{transform:scale(.97)}.next:hover{background:#2b26220d}.next svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px;transition:transform .2s}.next:hover svg{transform:translate(3px)}.polaroid{background:#fffdf8;width:min(300px,84%);margin:6px auto 30px;padding:12px 12px 8px;animation:.9s cubic-bezier(.2,.9,.3,1.2) both settle;position:relative;transform:rotate(-2.5deg);box-shadow:0 1px 2px #00000014,0 10px 30px -12px #2b262259}@keyframes settle{0%{opacity:0;transform:rotate(-9deg)translateY(16px)scale(.96)}}.polaroid img{background:#e9e2d4;width:100%;height:auto;display:block}.polaroid figcaption{text-align:center;color:var(--ink-soft);padding:8px 0 2px;font-size:22px}.polaroid.no-gif img{display:none}.polaroid.no-gif:before{content:"";aspect-ratio:4/3;background:#e9e2d4;display:block}.tape{background:#f2cfc8bf;width:92px;height:26px;position:absolute;top:-12px;left:50%;transform:translate(-50%)rotate(3deg);box-shadow:0 1px 2px #0000000f}.choices{justify-content:center;gap:14px;margin-bottom:14px;display:flex}.choice{border:1.5px solid var(--ink);background:0 0;border-radius:999px;min-width:116px;padding:12px 22px;font-size:19px;transition:transform .15s,background .2s,color .2s}.choice.yes{background:var(--ink);color:var(--paper)}.choice:active{transform:scale(.96)}.choice:disabled{opacity:.6;cursor:default}#after,#after p{text-align:center}form{flex-direction:column;align-items:center;gap:8px;margin-top:26px;display:flex}textarea{width:100%;font:inherit;color:var(--ink);resize:vertical;background:#fffdf8;border:1.5px solid #2b262240;border-radius:12px;padding:12px 14px;font-size:17px}textarea:focus{border-color:var(--ink);outline:none}form .next{margin-top:4px}.player{z-index:5;left:50%;bottom:calc(18px + env(safe-area-inset-bottom));background:var(--ink);color:var(--paper);white-space:nowrap;border:0;border-radius:999px;align-items:center;gap:10px;padding:10px 18px 10px 12px;font-size:15px;display:flex;position:fixed;transform:translate(-50%);box-shadow:0 8px 24px -10px #2b262299}.player em{opacity:.6;font-style:italic}.play-icon{background:var(--red);border-radius:50%;place-items:center;width:26px;height:26px;display:grid}.play-icon svg{width:14px;height:14px;fill:var(--paper);margin-left:2px}.eq{justify-content:center;align-items:flex-end;gap:3px;width:26px;height:18px;display:none}.eq i{background:var(--red);border-radius:2px;width:3px;animation:.9s ease-in-out infinite eq}.eq i:nth-child(2){animation-delay:-.3s}.eq i:nth-child(3){animation-delay:-.6s}.eq i:nth-child(4){animation-delay:-.15s}@keyframes eq{0%,to{height:4px}50%{height:18px}}.player.playing .eq{display:flex}.player.playing .play-icon{display:none}.doodles{pointer-events:none;z-index:0;position:fixed;inset:0;overflow:hidden}.doodles span{width:var(--s);height:var(--s);opacity:0;animation:drift var(--dur) linear var(--delay) infinite;position:absolute;bottom:-40px}.doodles svg{fill:none;width:100%;height:100%;stroke:var(--red);stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round;opacity:.35}@keyframes drift{0%{transform:translateY(0) rotate(var(--rot));opacity:0}10%{opacity:1}90%{opacity:1}to{transform:translateY(-115svh) rotate(calc(var(--rot) * -1));opacity:0}}#sky{pointer-events:none;z-index:4;width:100%;height:100%;position:fixed;inset:0}@media (prefers-reduced-motion:reduce){.doodles{display:none}.reveal,.screen.is-active,.polaroid{opacity:1;animation:none}}
