:root{--bg:#FFF8F3;--ink:#1F1B24;--pink:#FF3B6B;--leaf:#3DBE7A;--card:#fff;--mut:#8a7f86}
.theater{--bg:#1d0f1f;--ink:#f7e9f0;--card:#2a1830;--mut:#b49aae}
body{margin:0;font-family:Fredoka,sans-serif;background:var(--bg);color:var(--ink);transition:background .3s}
.app-bg{background:radial-gradient(circle at 10% 0%,rgba(255,59,107,.14),transparent 40%),radial-gradient(circle at 90% 30%,rgba(61,190,122,.12),transparent 40%),var(--bg);min-height:100vh}
.mono{font-family:'DM Mono',monospace}
.card{background:var(--card);border-radius:1.25rem;box-shadow:0 6px 20px rgba(31,27,36,.08);transition:transform .25s,box-shadow .25s}
.card:hover{transform:translateY(-5px) rotate(-.6deg);box-shadow:0 14px 30px rgba(255,59,107,.18)}
.btn{transition:transform .12s}.btn:active{transform:scale(.92)}
.pink{background:var(--pink);color:#fff}
.mut{color:var(--mut)}
.inp{background:var(--card);border:2px solid rgba(128,128,128,.2);border-radius:14px;padding:.6rem .9rem;color:var(--ink);outline:none;width:100%}
.inp:focus{border-color:var(--pink)}
.shimmer{background:linear-gradient(90deg,rgba(128,128,128,.12),rgba(128,128,128,.25),rgba(128,128,128,.12));background-size:200% 100%;animation:sh 1.2s infinite;border-radius:1.25rem}
@keyframes sh{to{background-position:-200% 0}}
.rise{animation:rise .5s both}@keyframes rise{from{opacity:0;transform:translateY(16px)}}
.pop{animation:pop .4s}@keyframes pop{50%{transform:scale(1.4)}}
.fall{position:fixed;top:-40px;font-size:28px;animation:fall linear forwards;pointer-events:none;z-index:99}
@keyframes fall{to{transform:translateY(110vh) rotate(540deg)}}
.bob{animation:bob 2s ease-in-out infinite}@keyframes bob{50%{transform:translateY(-6px)}}
.spin{animation:spn .6s}@keyframes spn{to{transform:rotate(720deg)}}