*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0f0f12;--surface: #1a1a22;--text: #f5f5f7;--text-muted: #9a9aa8;--happy: #ffd166;--happy-glow: rgba(255, 209, 102, .35);--sad: #7eb8da;--sad-glow: rgba(126, 184, 218, .35);--sappy: #ff8fab;--sappy-glow: rgba(255, 143, 171, .35);--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif}html,body{height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;touch-action:manipulation;-webkit-user-select:none;user-select:none}#app{height:100%;position:relative}.home{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100%;padding:calc(1.5rem + var(--safe-top)) 1.25rem calc(1.5rem + var(--safe-bottom));gap:2.5rem;transition:opacity .25s ease,transform .25s ease}.home.is-hidden{opacity:0;pointer-events:none;transform:scale(.98)}.header{text-align:center}.title{font-size:clamp(2rem,8vw,2.75rem);font-weight:700;letter-spacing:-.03em}.subtitle{margin-top:.5rem;font-size:1rem;color:var(--text-muted)}.button-grid{display:flex;flex-direction:column;gap:1rem;width:100%;max-width:22rem}.mood-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;width:100%;min-height:6.5rem;padding:1.25rem 1rem;border:none;border-radius:1.25rem;background:var(--surface);color:var(--text);cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .15s ease;-webkit-user-select:none}.mood-btn:active{transform:scale(.96)}.mood-btn--happy:active,.mood-btn--happy:focus-visible{box-shadow:0 0 0 3px var(--happy-glow),0 8px 32px var(--happy-glow)}.mood-btn--sad:active,.mood-btn--sad:focus-visible{box-shadow:0 0 0 3px var(--sad-glow),0 8px 32px var(--sad-glow)}.mood-btn--sappy:active,.mood-btn--sappy:focus-visible{box-shadow:0 0 0 3px var(--sappy-glow),0 8px 32px var(--sappy-glow)}.mood-btn__emoji{font-size:2rem;line-height:1}.mood-btn__label{font-size:1.5rem;font-weight:700;letter-spacing:-.02em}.mood-btn__hint{font-size:.75rem;color:var(--text-muted);text-align:center;line-height:1.3}.mood-btn--happy .mood-btn__label{color:var(--happy)}.mood-btn--sad .mood-btn__label{color:var(--sad)}.mood-btn--sappy .mood-btn__label{color:var(--sappy)}.moment-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;background:var(--bg);opacity:0;pointer-events:none;transition:opacity .2s ease}.moment-overlay.is-active{opacity:1;pointer-events:auto}.moment-stage{position:relative;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden}.moment-big-text{font-size:clamp(2.5rem,12vw,5rem);font-weight:800;letter-spacing:-.04em;color:var(--happy);text-align:center;padding:0 1rem}.moment-quote{font-size:clamp(1.5rem,6vw,2.5rem);font-weight:600;text-align:center;padding:0 1.5rem;line-height:1.3;color:var(--happy)}.moment-caption{margin-top:1.5rem;font-size:1.25rem;font-weight:600;color:var(--text-muted);text-align:center}.sappy-caption{color:var(--sappy)}.moment-emoji{font-size:clamp(5rem,25vw,10rem)}@keyframes pop-in{0%{transform:scale(.3);opacity:0}60%{transform:scale(1.08);opacity:1}to{transform:scale(1);opacity:1}}@keyframes slide-up{0%{transform:translateY(40px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes bounce{0%,to{transform:translateY(0) scale(1)}40%{transform:translateY(-20px) scale(1.1)}60%{transform:translateY(-8px) scale(1.05)}}@keyframes shake{0%,to{transform:translate(0) rotate(0)}20%{transform:translate(-12px) rotate(-8deg)}40%{transform:translate(12px) rotate(8deg)}60%{transform:translate(-8px) rotate(-5deg)}80%{transform:translate(8px) rotate(5deg)}}@keyframes boing-face{0%{transform:scaleY(.4) scaleX(1.3)}30%{transform:scaleY(1.3) scaleX(.8)}50%{transform:scaleY(.85) scaleX(1.1)}70%{transform:scaleY(1.1) scaleX(.95)}to{transform:scaleY(1) scaleX(1)}}@keyframes wag{0%,to{transform:rotate(-25deg)}50%{transform:rotate(25deg)}}@keyframes spin-yarn{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pie-splat{0%{transform:translateY(-120vh) rotate(0);opacity:1}70%{transform:translateY(0) rotate(180deg);opacity:1}to{transform:translateY(0) rotate(200deg) scale(1.2);opacity:1}}@keyframes rainbow-shift{0%{background-position:0% 50%}to{background-position:200% 50%}}@keyframes float-up{0%{transform:translateY(20vh) scale(.5);opacity:0}20%{opacity:1}to{transform:translateY(-30vh) scale(1.2);opacity:0}}@keyframes star-orbit{0%{transform:rotate(0) translate(30vw) rotate(0) scale(.5);opacity:0}20%{opacity:1}to{transform:rotate(360deg) translate(30vw) rotate(-360deg) scale(1);opacity:0}}.pop-in{animation:pop-in .5s cubic-bezier(.34,1.56,.64,1) both}.slide-up{animation:slide-up .5s ease both}.bounce{animation:bounce 1s ease infinite}.shake{animation:shake .4s ease infinite}.boing-face{animation:boing-face .6s ease both}.wag{animation:wag .3s ease infinite}.spin-yarn{animation:spin-yarn 1.5s linear infinite}.moment-happy{background:radial-gradient(ellipse at center,#2a2218 0%,var(--bg) 70%)}.moment-rainbow{background:linear-gradient(135deg,#ff6b6b,#ffd166,#06d6a0,#118ab2,#ef476f,#ffd166);background-size:300% 300%;animation:rainbow-shift 2s ease infinite}.moment-comedy{background:radial-gradient(ellipse at center,#1a2030 0%,var(--bg) 70%)}.moment-frettc{background:radial-gradient(ellipse at center,#1f2a1a 0%,var(--bg) 70%)}.moment-sappy{background:radial-gradient(ellipse at center,#2a1a22 0%,var(--bg) 70%)}.moment-stars{background:var(--bg)}.moment-pie{background:radial-gradient(ellipse at center,#2a2020 0%,var(--bg) 70%)}.comedy-cloud{font-size:clamp(5rem,30vw,12rem)}.silly-face,.frettc{font-size:clamp(5rem,25vw,10rem)}.frettc-text{margin-top:1rem;font-size:clamp(2rem,10vw,4rem);font-weight:900;color:var(--sad);letter-spacing:.05em}.rubber-duck{font-size:clamp(5rem,25vw,10rem)}.bounce-duck{animation:bounce .5s ease infinite}.pie-face{font-size:clamp(5rem,25vw,10rem);z-index:1}.flying-pie{position:absolute;font-size:5rem;animation:pie-splat .8s cubic-bezier(.34,1.2,.64,1) both}.confetti-canvas{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.floating-star{position:absolute;font-size:2rem;color:var(--happy);animation:star-orbit 1.8s ease-in-out both;animation-delay:calc(var(--i) * .1s)}.floating-heart{position:absolute;font-size:clamp(1.5rem,8vw,3rem);animation:float-up 1.8s ease both;animation-delay:calc(var(--i) * .15s);left:calc(10% + var(--i) * 8%)}.css-kitten{width:8rem;height:7rem;position:relative}.css-kitten:before{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:5rem;height:4rem;background:#c9a87c;border-radius:50% 50% 45% 45%}.css-kitten:after{content:"";position:absolute;top:.5rem;left:50%;transform:translate(-50%);width:4rem;height:3.5rem;background:#c9a87c;border-radius:50%;box-shadow:-1.8rem -.5rem 0 -.8rem #c9a87c,1.8rem -.5rem 0 -.8rem #c9a87c}.css-yarn{width:2.5rem;height:2.5rem;border-radius:50%;background:conic-gradient(#ff8fab,#ffd166,#a8dadc,#ff8fab);margin-top:1rem}.css-puppy{width:7rem;height:6rem;position:relative}.css-puppy:before{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:5rem;height:3.5rem;background:#d4a574;border-radius:50% 50% 40% 40%}.css-puppy:after{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:3.5rem;height:3rem;background:#d4a574;border-radius:50%;box-shadow:-2rem .5rem 0 -.5rem #b8895a,2rem .5rem 0 -.5rem #b8895a}.puppy-tail{position:absolute;right:-.5rem;bottom:1.5rem;width:.6rem;height:2rem;background:#b8895a;border-radius:50%;transform-origin:bottom center}.css-sleepy-cat{width:7rem;height:5rem;background:#a0a0b0;border-radius:50% 50% 40% 40%;position:relative}.css-sleepy-cat:before{content:"";position:absolute;top:-2rem;left:50%;transform:translate(-50%);width:3.5rem;height:3rem;background:#a0a0b0;border-radius:50%;box-shadow:-1.5rem -.8rem 0 -.5rem #a0a0b0,1.5rem -.8rem 0 -.5rem #a0a0b0}.sleepy-zzz{margin-top:1rem;font-size:1.5rem;color:var(--text-muted);letter-spacing:.3em;animation:bounce 1.5s ease infinite}.boop-nose{font-size:clamp(5rem,25vw,10rem)}.moment-media{max-width:100%;max-height:100%;object-fit:contain}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}