:root{--pink:#ff5c8a;--pink-deep:#e23b6d;--pink-soft:#ffd7e4;--cream:#fff7f9;--ink:#43222e;--ink-soft:#9c6d7c;--shadow:0 22px 60px -18px #e23b6d73;--radius:28px;--ease-out:cubic-bezier(.22, 1, .36, 1);--ease-back:cubic-bezier(.34, 1.56, .64, 1)}*{box-sizing:border-box;margin:0;padding:0}[hidden]{display:none!important}html,body{height:100%}body{min-height:100dvh;color:var(--ink);background:radial-gradient(120% 120% at 20% 10%,#fff0f5 0%,#0000 55%),radial-gradient(120% 120% at 85% 90%,#ffe3ec 0%,#0000 55%),linear-gradient(160deg,#ffeaf1 0%,#ffdbe8 45%,#ffd0e2 100%);place-items:center;padding:clamp(1rem,4vw,2.5rem);font-family:Comic Relief,system-ui,sans-serif;display:grid;overflow:hidden}.stage{place-items:center;width:100%;display:grid;position:relative}.card{text-align:center;background:var(--cream);border-radius:var(--radius);width:min(92vw,380px);box-shadow:var(--shadow);animation:float 6s var(--ease-out) infinite;padding:clamp(1.4rem,5vw,2.2rem);position:relative}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.media{aspect-ratio:4/3;background:var(--pink-soft);border-radius:20px;width:100%;margin:0 auto 1.25rem;position:relative;overflow:hidden;box-shadow:inset 0 0 0 4px #fff,0 8px 24px -12px #e23b6d80}.cat{object-fit:cover;opacity:0;width:100%;height:100%;transition:opacity .5s var(--ease-out), transform .6s var(--ease-out);position:absolute;inset:0;transform:scale(1.04)}.cat.is-visible{opacity:1;transform:scale(1)}.question{color:var(--pink-deep);text-wrap:balance;font-size:clamp(1.5rem,6vw,2rem);font-weight:700;line-height:1.15}.subtitle{color:var(--ink-soft);margin-top:.5rem;font-size:.95rem}.btn-group{justify-content:center;align-items:center;gap:1rem;min-height:58px;margin-top:1.5rem;display:flex;position:relative}.btn{color:#fff;cursor:pointer;transition:transform .28s var(--ease-back), box-shadow .28s var(--ease-out), background .28s var(--ease-out);-webkit-tap-highlight-color:transparent;border:none;border-radius:999px;padding:.7em 1.6em;font-family:inherit;font-size:1.15rem;font-weight:700}.btn:focus-visible{outline:3px solid var(--ink);outline-offset:3px}.btn--yes{background:linear-gradient(135deg, var(--pink) 0%, var(--pink-deep) 100%);transform:scale(var(--grow,1));box-shadow:0 10px 22px -8px #e23b6db3}.btn--yes:hover{box-shadow:0 14px 26px -8px #e23b6dd9}.btn--yes:active{transform:scale(calc(var(--grow,1) * .94))}.btn--no{color:var(--pink-deep);box-shadow:inset 0 0 0 2px var(--pink-soft);scale:var(--shrink,1);transition:translate .28s var(--ease-back), scale .28s var(--ease-out), box-shadow .28s var(--ease-out);will-change:translate, scale;background:#fff}.again{color:var(--ink-soft);border:none;border-bottom:2px dotted var(--pink-soft);cursor:pointer;transition:color .25s var(--ease-out);background:0 0;margin-top:1.1rem;font-family:inherit;font-size:.95rem;display:inline-block}.again:hover{color:var(--pink-deep)}.sound-toggle{cursor:pointer;width:44px;height:44px;transition:transform .2s var(--ease-back);background:#ffffffbf;border:none;border-radius:50%;place-items:center;font-size:1.1rem;display:grid;position:fixed;top:1rem;right:1rem;box-shadow:0 6px 16px -8px #e23b6d99}.sound-toggle:hover{transform:scale(1.08)}.sound-toggle:focus-visible{outline:3px solid var(--pink-deep);outline-offset:2px}.sound-toggle[aria-pressed=false]{opacity:.55}.hearts{pointer-events:none;z-index:50;position:fixed;inset:0;overflow:hidden}.heart{will-change:transform, opacity;font-size:1.5rem;position:absolute}.card.is-won .media{box-shadow:inset 0 0 0 4px #fff,0 12px 30px -10px #e23b6db3}@media (prefers-reduced-motion:reduce){.card{animation:none}.cat,.btn,.sound-toggle,.again{transition-duration:.001ms}}