:root{--cream:#fff3ea;--cream-deep:#f7e0d0;--blush:#f7c5d1;--rose:#e56b7d;--kitsune-red:#c23b3b;--ink:#4a2c32;--ink-soft:#7a555c;--paper:#fffaf3;--gold:#e8c56b;--white:#fffdf9;--shadow:0 18px 40px #4a2c3224;--sans:"Nunito", system-ui, sans-serif;--script:"Caveat", "Segoe Script", cursive;font-family:var(--sans);color:var(--ink);background:var(--cream);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}*,:before,:after{box-sizing:border-box}html,body,#root{min-height:100dvh;margin:0}body{background:radial-gradient(1200px 700px at 50% -10%, #ffe7f0 0%, transparent 55%), radial-gradient(900px 500px at 100% 100%, #ffd9c8 0%, transparent 50%), var(--cream);min-height:100dvh}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}button:disabled{cursor:default}img{max-width:100%}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.stage{min-height:100dvh;padding:max(1.25rem, env(safe-area-inset-top)) 1.15rem max(1.5rem, env(safe-area-inset-bottom));flex-direction:column;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.stage--card{justify-content:flex-start;overflow-y:auto}.backdrop{pointer-events:none;z-index:0;position:fixed;inset:0;overflow:hidden}.blob{filter:blur(8px);border-radius:50%;position:absolute}.blob--rose{background:#ffd6e08c;width:240px;height:240px;top:-80px;left:-60px}.blob--peach{background:#ffd6c480;width:200px;height:200px;bottom:6%;right:-50px}.blob--gold{background:#e8c56b3d;width:160px;height:160px;bottom:-60px;left:12%}.mote{color:var(--rose);opacity:0;will-change:transform, opacity;position:absolute;top:0}.scene-shell{z-index:1;flex-direction:column;flex:1;width:100%;display:flex;position:relative}.scene{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.85rem;width:100%;display:flex;position:relative}.scene-card{justify-content:flex-start;gap:1.35rem;padding-top:.5rem}.scene-envelope{padding-top:3rem}.scene-finale{gap:1.1rem}.eyebrow{letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin:0;font-size:.82rem;font-weight:800}.title{font-family:var(--script);text-align:center;max-width:100%;margin:0;padding-inline:.35rem;font-size:clamp(2.1rem,9vw,3.2rem);font-weight:700;line-height:1.05}.title-name{color:var(--kitsune-red);display:block;position:relative;overflow:hidden}.title-shimmer{pointer-events:none;mix-blend-mode:overlay;background:linear-gradient(100deg,#0000 20%,#fff4c8e6 48%,#fffffff2 52%,#0000 80%);position:absolute;inset:0}.letter-reveal{display:inline-block}.letter-reveal-char{white-space:pre;transform-origin:bottom;display:inline-block}.prompt{text-align:center;max-width:22rem;color:var(--ink);margin:0;font-size:clamp(1.05rem,4.3vw,1.3rem);font-weight:800}.btn{background:var(--kitsune-red);min-height:48px;color:var(--white);border:0;border-radius:999px;padding:.8rem 1.6rem;font-size:1rem;font-weight:800;box-shadow:0 10px 20px #c23b3b40}.btn--ghost{color:var(--kitsune-red);background:#ffffffbf;border:2px solid #c23b3b40;box-shadow:0 8px 18px #4a2c321f}.scene-card .btn{bottom:max(.75rem, env(safe-area-inset-bottom));z-index:2;position:sticky}.cake-hit:focus-visible,.envelope-hit:focus-visible,.kitsune-hit:focus-visible,.intro-skip-hit:focus-visible,.btn:focus-visible{outline:3px solid var(--rose);outline-offset:4px;border-radius:16px}.progress-dots-slot{z-index:2;padding-top:.9rem;position:relative}.progress-dots{align-items:center;gap:.5rem;display:flex}.progress-dot{background:var(--ink-soft);border-radius:999px;width:8px;height:8px;display:block}.progress-dot.is-active{background:var(--kitsune-red)}.scene-intro{gap:.4rem}.intro-skip-hit{background:0 0;border:0;flex-direction:column;align-items:center;gap:1rem;width:100%;padding:2rem 1rem;display:flex}.intro-lines{flex-direction:column;gap:.15rem;display:flex}.intro-line{font-family:var(--script);color:var(--ink);text-align:center;margin:0;font-size:clamp(1.8rem,7.5vw,2.6rem);line-height:1.15}.intro-spark{color:var(--gold);font-size:1.9rem;line-height:1}.intro-hint{letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin:0;font-size:.78rem;font-weight:800}.cake-stage,.squish-stage{place-items:center;width:min(88vw,340px);display:grid;position:relative}.cake-halo{aspect-ratio:1;pointer-events:none;border:2px solid #e8c56bbf;border-radius:50%;width:78%;position:absolute;box-shadow:0 0 40px #e8c56b73}.cake-cta{place-items:center;min-height:64px;display:grid}.cake-hit,.envelope-hit,.kitsune-hit{background:0 0;border:0;place-items:center;width:100%;padding:0;display:grid}.cake-svg{filter:drop-shadow(0 14px 18px #4a2c322e);width:100%;height:auto;overflow:visible}.flame{transform-origin:bottom;transform-box:fill-box;animation:.32s ease-in-out infinite alternate flicker;animation-delay:var(--flicker-delay,0s)}.flame-wrap{transform-origin:bottom;transform-box:fill-box}.puff path{fill:none;stroke:#ffffffd9;stroke-width:4px;stroke-linecap:round}.smoke{transform-box:fill-box;transform-origin:bottom}.smoke ellipse{fill:#aa969647}.hearts-burst{pointer-events:none;z-index:3;height:1px;position:absolute;inset:10% 0 auto}.heart-particle{--drift:0px;--rise:-68vh;color:var(--rose);filter:drop-shadow(0 4px 6px #c23b3b33);animation-name:heart-float;animation-timing-function:ease-out;animation-fill-mode:forwards;position:absolute;bottom:0}.heart-particle--spark{color:var(--gold)}.celebration{pointer-events:none;z-index:6;position:fixed;inset:0;overflow:hidden}.celebration:before{content:"";background:radial-gradient(circle at 50% 42%,#fff4c880,#0000 58%);animation:1.1s ease-out both celebrate-glow;position:absolute;inset:0}.party-balloon{--sway:16px;animation-name:balloon-rise;animation-timing-function:ease-in-out;animation-fill-mode:forwards;position:absolute}.celebration--loop .party-balloon,.celebration--loop .firework-flash,.celebration--loop .firework-ring,.celebration--loop .firework-spark{animation-iteration-count:infinite}.balloon-svg{filter:drop-shadow(0 8px 10px #4a2c3229);width:100%;height:auto;display:block}.firework{--burst-color:#e8c56b;width:8px;height:8px;margin:-4px 0 0 -4px;position:absolute}.firework-flash{background:radial-gradient(circle, #fff 0%, var(--burst-color) 42%, transparent 72%);animation:.4s ease-out both firework-flash;animation-delay:inherit;border-radius:50%;position:absolute;inset:-14px}.firework-ring{border:2px solid var(--burst-color);width:14px;height:14px;animation:.75s ease-out both firework-ring;animation-delay:inherit;border-radius:50%;margin:-7px 0 0 -7px;position:absolute;top:50%;left:50%}.firework-spark{--angle:0deg;background:var(--burst-color);width:7px;height:7px;box-shadow:0 0 10px var(--burst-color);animation:.95s ease-out both firework-spark;animation-delay:inherit;border-radius:999px;margin:-3.5px 0 0 -3.5px;position:absolute;top:50%;left:50%}.envelope-hit{width:min(86vw,330px)}.envelope-float{width:100%}.envelope{aspect-ratio:1.45;perspective:1100px;width:100%;transform-style:preserve-3d;filter:drop-shadow(var(--shadow));position:relative}.envelope-back,.envelope-body,.envelope-flap,.envelope-letter{position:absolute}.envelope-back{background:#efc3ab;border-radius:10px;inset:0}.envelope-letter{background:var(--paper);z-index:1;border-radius:4px;flex-direction:column;gap:10px;height:72%;padding:22px 16px;display:flex;top:16%;left:8%;right:8%}.envelope-letter span{background:#ead8cc;border-radius:99px;height:6px;display:block}.envelope-letter span:first-child{width:62%}.envelope-letter span:nth-child(2){width:84%}.envelope-body{clip-path:polygon(0 30%,50% 70%,100% 30%,100% 100%,0 100%);z-index:2;background:linear-gradient(#f8d9c6,#efc4ab);border-radius:0 0 10px 10px;inset:0}.envelope-to{font-family:var(--script);text-align:center;color:var(--ink);margin:0;font-size:clamp(1.7rem,7vw,2.2rem);position:absolute;bottom:14%;left:0;right:0}.envelope-flap{clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top;background:linear-gradient(#fbe6d6,#f0c8b0);height:54%;top:0;left:0;right:0}.envelope-seal{z-index:5;background:radial-gradient(circle at 35% 30%, #ef7d86, var(--kitsune-red));color:#fff6ea;border-radius:50%;place-items:center;width:46px;height:46px;margin:-23px 0 0 -23px;font-size:1.2rem;display:grid;position:absolute;top:46%;left:50%;box-shadow:0 6px 12px #c23b3b47}.envelope-friend{z-index:6;pointer-events:none;width:44%;position:absolute;top:-34%;right:2%}.letter{background:repeating-linear-gradient(transparent 0 27px, #e56b7d29 27px 28px), var(--paper);width:min(92vw,420px);box-shadow:var(--shadow);border:1px solid #c23b3b14;border-radius:10px;padding:1.6rem 1.25rem 2rem}.letter-title{font-family:var(--script);text-align:center;margin:0 0 .4rem;font-size:clamp(2rem,8vw,2.7rem);line-height:1.1}.letter-body{font-family:var(--script);color:var(--ink);margin:0 0 1.05rem;font-size:clamp(1.35rem,4.8vw,1.75rem);line-height:1.55}.polaroid{cursor:grab;background:#fff;width:min(70%,230px);margin:.35rem auto 1.3rem;padding:10px 10px 28px;position:relative;box-shadow:0 10px 24px #4a2c3224}.polaroid img{aspect-ratio:1;object-fit:cover;pointer-events:none;-webkit-user-drag:none;-webkit-user-select:none;user-select:none;background:#f4ddd6;width:100%;display:block}.polaroid-placeholder{aspect-ratio:1;width:100%;color:var(--rose);text-align:center;background:repeating-linear-gradient(45deg,#f8e3dc 0 10px,#f4ddd6 10px 20px);place-items:center;gap:.4rem;padding:.5rem;display:grid}.polaroid-placeholder span{font-size:2rem}.polaroid-placeholder small{color:var(--ink-soft);font-size:.6rem;font-weight:700;line-height:1.3}.polaroid-caption{font-family:var(--script);color:var(--ink-soft);text-align:center;font-size:1.1rem;position:absolute;bottom:4px;left:0;right:0}.kitsune,.kitsune--sm{width:100%}.kitsune--lg{width:min(78vw,300px)}.kitsune-hit{width:min(82vw,320px)}.kitsune svg{filter:drop-shadow(0 10px 12px #4a2c321f);width:100%;height:auto;overflow:visible}.kitsune-shadow{fill:#4a2c3224}.kitsune-blush{fill:#f4a3b3;opacity:.85}.kitsune-squish{transform-origin:45% 90%;transform-box:fill-box;animation:2.5s ease-in-out infinite idle-squish}.kitsune.is-squishing .kitsune-squish{animation:.62s cubic-bezier(.34,1.45,.64,1) tap-squish}.kitsune-tail{transform-origin:170px 150px;animation:2.8s ease-in-out infinite tail-wag}.kitsune-footer{flex-direction:column;align-items:center;gap:.7rem;min-height:90px;display:flex}.squish-counter{letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin:0;font-size:.8rem;font-weight:800}.finale-notes{place-items:center;width:min(92vw,26rem);min-height:5.5rem;display:grid}.finale-note{font-family:var(--script);text-align:center;color:var(--ink);margin:0;font-size:clamp(1.3rem,5.4vw,1.8rem);line-height:1.4}.finale-note-dots{gap:.4rem;display:flex}.finale-note-dot{background:var(--kitsune-red);border-radius:999px;width:6px;height:6px;display:block}@keyframes flicker{0%{transform:scale(1)rotate(-4deg)}to{transform:scale(.88,1.12)rotate(5deg)}}@keyframes heart-float{0%{opacity:1;transform:translate(0)scale(1)rotate(0)}to{opacity:0;transform:translate(var(--drift), var(--rise)) scale(.45) rotate(24deg)}}@keyframes celebrate-glow{0%{opacity:.9}to{opacity:0}}@keyframes balloon-rise{0%{opacity:0;transform:translateY(12vh)rotate(-10deg)}8%{opacity:1}28%{transform:translate(calc(var(--sway) * .55), -18vh) rotate(7deg)}52%{transform:translate(calc(var(--sway) * -.25), -48vh) rotate(-5deg)}76%{transform:translate(calc(var(--sway) * .7), -82vh) rotate(8deg)}to{transform:translate(var(--sway), -118vh) rotate(-4deg);opacity:.55}}@keyframes firework-flash{0%{opacity:1;transform:scale(.2)}to{opacity:0;transform:scale(2.6)}}@keyframes firework-ring{0%{opacity:1;transform:scale(.3)}to{opacity:0;transform:scale(9)}}@keyframes firework-spark{0%{opacity:1;transform:rotate(var(--angle)) translateY(0) scale(1)}72%{opacity:1}to{opacity:0;transform:rotate(var(--angle)) translateY(-92px) scale(.12)}}@keyframes idle-squish{0%,to{transform:scale(1)}50%{transform:scale(1.06,.94)}}@keyframes tap-squish{0%{transform:scale(1)}32%{transform:scale(1.28,.7)}58%{transform:scale(.86,1.2)}78%{transform:scale(1.08,.94)}to{transform:scale(1)}}@keyframes tail-wag{0%,to{transform:rotate(-4deg)}50%{transform:rotate(7deg)}}@media (width>=720px){.blob--rose{width:340px;height:340px}.blob--peach{width:280px;height:280px}.blob--gold{width:220px;height:220px}}