@import "https://fonts.googleapis.com/css2?family=Fredoka:wght@300..700&display=swap";
:root,[data-theme=forest][data-mode=light]{--font-family:"Fredoka", "Segoe UI", Roboto, sans-serif;--bg-gradient:linear-gradient(135deg, #eaf9e7 0%, #f9fbe7 100%);--text-color:#2c4a24;--text-muted:#628359;--primary-color:#55a630;--primary-hover:#3f7d20;--accent-color:#ffcd3c;--accent-hover:#e6b41d;--card-bg:#ffffffe6;--card-border:#d4edda;--incorrect-color:#ff6b6b;--incorrect-bg:#ffe3e3;--correct-color:#51cf66;--correct-bg:#d3f9d8;--shadow:0 8px 16px #2c4a2414;--balloon-left:#4dabf7;--balloon-right:#ff922b}[data-theme=forest][data-mode=dark]{--bg-gradient:linear-gradient(135deg, #132a13 0%, #1e351e 100%);--text-color:#eaf9e7;--text-muted:#a3c9a8;--primary-color:#74c69d;--primary-hover:#95d5b2;--accent-color:#ffcd3c;--accent-hover:#ffd966;--card-bg:#1a2e1ad9;--card-border:#2d5a27;--incorrect-color:#ff8787;--incorrect-bg:#ff6b6b26;--correct-color:#69db7c;--correct-bg:#51cf6626;--shadow:0 8px 24px #0000004d;--balloon-left:#339af0;--balloon-right:#f76707}[data-theme=sea][data-mode=light]{--bg-gradient:linear-gradient(135deg, #e0f2fe 0%, #f0fdf4 100%);--text-color:#0c4a6e;--text-muted:#475569;--primary-color:#0284c7;--primary-hover:#0369a1;--accent-color:#f43f5e;--accent-hover:#e11d48;--card-bg:#ffffffe6;--card-border:#bae6fd;--incorrect-color:#e11d48;--incorrect-bg:#ffe4e6;--correct-color:#10b981;--correct-bg:#d1fae5;--shadow:0 8px 16px #0c4a6e14;--balloon-left:#f59f00;--balloon-right:#845ef7}[data-theme=sea][data-mode=dark]{--bg-gradient:linear-gradient(135deg, #0f172a 0%, #0c4a6e 100%);--text-color:#e0f2fe;--text-muted:#7dd3fc;--primary-color:#38bdf8;--primary-hover:#7dd3fc;--accent-color:#fb7185;--accent-hover:#fda4af;--card-bg:#0f172ad9;--card-border:#0369a1;--incorrect-color:#f43f5e;--incorrect-bg:#f43f5e26;--correct-color:#34d399;--correct-bg:#34d39926;--shadow:0 8px 24px #0006;--balloon-left:#fcc419;--balloon-right:#7048e8}[data-theme=space][data-mode=light]{--bg-gradient:linear-gradient(135deg, #faf5ff 0%, #fdf2f8 100%);--text-color:#581c87;--text-muted:#701a75;--primary-color:#9333ea;--primary-hover:#7e22ce;--accent-color:#ec4899;--accent-hover:#db2777;--card-bg:#ffffffe6;--card-border:#f3e8ff;--incorrect-color:#ef4444;--incorrect-bg:#fee2e2;--correct-color:#06b6d4;--correct-bg:#cffafe;--shadow:0 8px 16px #581c8714;--balloon-left:#4c6ef5;--balloon-right:#ae3ec9}[data-theme=space][data-mode=dark]{--bg-gradient:linear-gradient(135deg, #090514 0%, #1e1136 100%);--text-color:#f3e8ff;--text-muted:#c084fc;--primary-color:#a855f7;--primary-hover:#c084fc;--accent-color:#f472b6;--accent-hover:#fbcfe8;--card-bg:#160c2bd9;--card-border:#4c1d95;--incorrect-color:#f87171;--incorrect-bg:#f8717126;--correct-color:#22d3ee;--correct-bg:#22d3ee26;--shadow:0 8px 24px #00000080;--balloon-left:#3b5bdb;--balloon-right:#9c36b5}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;font-family:var(--font-family);color:var(--text-color);background:var(--bg-gradient);-webkit-tap-highlight-color:transparent;transition:background .3s,color .3s;overflow-x:hidden}body{min-height:100vh;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}button,select,input{font-family:var(--font-family)}.playful-btn{background-color:var(--primary-color);color:#fff;cursor:pointer;box-shadow:0 6px 0 var(--primary-hover), 0 8px 15px #00000026;border:none;border-radius:24px;padding:12px 28px;font-size:18px;font-weight:700;transition:all .15s;transform:translateY(0)}.playful-btn:hover{box-shadow:0 4px 0 var(--primary-hover), 0 6px 10px #00000026;transform:translateY(2px)}.playful-btn:active{box-shadow:0 0 0 var(--primary-hover), 0 3px 5px #0000001a;transform:translateY(6px)}.playful-btn-secondary{background-color:var(--accent-color);color:#333;box-shadow:0 6px 0 var(--accent-hover), 0 8px 15px #0000001a}.playful-btn-secondary:hover{box-shadow:0 4px 0 var(--accent-hover), 0 6px 10px #0000001a}.playful-btn-secondary:active{box-shadow:0 0 0 var(--accent-hover), 0 3px 5px #0000000d}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--primary-color);background-clip:padding-box;border:2px solid #0000;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--primary-hover)}