:root{--c-pink: #f06da5;--c-pink-deep: #d64f87;--c-pink-light: #f6b6d0;--c-purple: #7560db;--c-purple-deep: #5643b9;--c-purple-light: #b8acef;--c-yellow: #f2cd58;--c-yellow-deep: #d8ac24;--c-mint: #4fcd9a;--c-mint-deep: #2fad82;--c-mint-light: #a8e6ca;--c-sky: #57b8ef;--c-sky-deep: #2b93d6;--c-sky-light: #b7dcf5;--c-coral: #f18d66;--c-coral-deep: #d86d46;--c-cream: #fff9f2;--c-white: #ffffff;--c-text: #463b60;--c-text-light: #7f7591;--glass-bg: rgba(255, 255, 255, .16);--glass-bg-strong: rgba(255, 255, 255, .24);--glass-border: rgba(255, 255, 255, .3);--glass-shadow: 0 10px 30px rgba(73, 54, 150, .2);--card-shadow: 0 8px 26px rgba(73, 54, 150, .16);--card-shadow-hover: 0 14px 38px rgba(73, 54, 150, .28);--btn-shadow: 0 8px 22px rgba(240, 109, 165, .32);--btn-shadow-hover: 0 12px 28px rgba(240, 109, 165, .46);--radius-xl: 32px;--radius-lg: 28px;--radius-md: 18px;--radius-sm: 12px;--radius-xs: 8px;--ease-bounce: cubic-bezier(.34, 1.56, .64, 1);--ease-smooth: cubic-bezier(.4, 0, .2, 1)}*{margin:0;padding:0;box-sizing:border-box}html,body{min-height:100%}body{font-family:"Baloo Bhaijaan 2",sans-serif;color:var(--c-text);position:relative;min-height:100dvh;background:radial-gradient(120% 80% at 22% 12%,rgba(255,255,255,.18) 0%,transparent 42%),radial-gradient(100% 90% at 85% 100%,rgba(241,141,102,.26) 0%,transparent 55%),linear-gradient(160deg,#5f52d6,#7d68e1 34%,#ee79ab,#f1b26e);background-attachment:fixed;overflow:hidden;-webkit-overflow-scrolling:touch}.bg-layer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;overflow:hidden}.bg-blob{position:absolute;border-radius:50%;filter:blur(78px);opacity:.36;animation:blobFloat 20s ease-in-out infinite}.bg-blob:nth-child(1){width:460px;height:460px;background:var(--c-purple);top:-120px;right:-120px}.bg-blob:nth-child(2){width:400px;height:400px;background:var(--c-pink);bottom:-100px;left:-100px;animation-delay:-5s}.bg-blob:nth-child(3){width:340px;height:340px;background:var(--c-sky);top:40%;left:60%;animation-delay:-10s}.bg-blob:nth-child(4){width:280px;height:280px;background:var(--c-yellow);top:18%;left:8%;animation-delay:-15s}.bg-layer:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(130% 130% at 50% 40%,transparent 55%,rgba(58,30,110,.28) 100%);pointer-events:none}@keyframes blobFloat{0%,to{transform:translate(0) scale(1)}33%{transform:translate(30px,-40px) scale(1.1)}66%{transform:translate(-20px,30px) scale(.95)}}.bg-pattern{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1;opacity:.06;background-image:radial-gradient(circle at 20% 30%,white 2px,transparent 2px),radial-gradient(circle at 70% 60%,white 2px,transparent 2px),radial-gradient(circle at 40% 80%,white 1.5px,transparent 1.5px),radial-gradient(circle at 85% 20%,white 1.5px,transparent 1.5px),radial-gradient(circle at 55% 45%,white 1px,transparent 1px);background-size:200px 200px,250px 250px,180px 180px,220px 220px,150px 150px;pointer-events:none}#particleCanvas{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2;pointer-events:none}#confettiCanvas{position:fixed;top:0;right:0;bottom:0;left:0;z-index:99;pointer-events:none}.app{position:relative;z-index:10;width:100%;max-width:1220px;margin:0 auto;padding:28px 32px;display:flex;flex-direction:column;align-items:center;height:100dvh;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.app-header{text-align:center;margin-bottom:16px;animation:slideDown .8s var(--ease-bounce);width:100%}@keyframes slideDown{0%{transform:translateY(-40px);opacity:0}to{transform:translateY(0);opacity:1}}.title-row{display:flex;align-items:center;justify-content:center;gap:12px}.title-icon{width:48px;height:48px;animation:gentleFloat 3s ease-in-out infinite}.title-icon:nth-child(3){animation-delay:-1.5s}@keyframes gentleFloat{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-8px) rotate(5deg)}}.app-title{font-family:Lalezar,cursive;font-size:2.8rem;color:var(--c-white);text-shadow:0 4px 20px rgba(0,0,0,.2);letter-spacing:1px}.app-subtitle{font-size:1.05rem;color:#ffffffe6;font-weight:500;margin-top:2px;text-shadow:0 2px 10px rgba(0,0,0,.15)}.glass-panel{background:var(--glass-bg);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1.5px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--glass-shadow);width:100%;padding:20px;animation:panelPop .7s var(--ease-bounce) .1s both}@keyframes panelPop{0%{transform:scale(.9) translateY(20px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}.stats-bar{display:flex;justify-content:space-between;gap:10px;margin-bottom:16px}.stat-pill{flex:1;background:#ffffff1f;border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-md);padding:10px 8px;text-align:center;transition:transform .3s}.stat-pill:hover{transform:translateY(-2px)}.stat-label{font-size:.78rem;color:#fffc;font-weight:600;display:block;margin-bottom:2px}.stat-value{font-size:1.4rem;color:var(--c-white);font-weight:800;display:block;text-shadow:0 2px 8px rgba(0,0,0,.15)}.stat-value.pulse{animation:statPulse .4s ease}@keyframes statPulse{0%,to{transform:scale(1)}50%{transform:scale(1.3);color:var(--c-yellow)}}.btn{font-family:"Baloo Bhaijaan 2",sans-serif;font-size:1.15rem;font-weight:700;padding:12px 32px;border:none;border-radius:50px;cursor:pointer;transition:all .3s var(--ease-bounce);color:#fff;display:flex;align-items:center;justify-content:center;gap:8px;position:relative;overflow:hidden}.btn-primary{background:linear-gradient(135deg,var(--c-pink),var(--c-coral));box-shadow:var(--btn-shadow)}.btn-primary:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s}.btn-primary:hover:before{left:100%}.btn-primary:hover{transform:translateY(-3px) scale(1.04);box-shadow:var(--btn-shadow-hover)}.btn-primary:active{transform:translateY(0) scale(.97)}.btn-secondary{background:#ffffff26;border:2px solid rgba(255,255,255,.3);font-size:1rem;padding:10px 24px}.btn-secondary:hover{background:#ffffff40;transform:translateY(-2px)}.btn svg{width:22px;height:22px}.btn-row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.difficulty{display:flex;gap:8px;justify-content:center;margin-bottom:16px}.diff-btn{font-family:"Baloo Bhaijaan 2",sans-serif;font-size:.95rem;font-weight:700;padding:8px 18px;border:2px solid rgba(255,255,255,.3);border-radius:30px;cursor:pointer;background:#ffffff1a;color:#ffffffe6;transition:all .3s var(--ease-bounce);display:flex;align-items:center;gap:6px}.diff-btn:hover{background:#fff3;transform:translateY(-2px)}.diff-btn.active{background:linear-gradient(135deg,var(--c-pink),var(--c-coral));border-color:#fff9;color:#fff;box-shadow:0 6px 16px #f06da547}.diff-btn svg{width:18px;height:18px}.win-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;background:#49369694;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);opacity:0;pointer-events:none;transition:opacity .5s}.win-overlay.show{opacity:1;pointer-events:all}.win-card{background:linear-gradient(145deg,#fff9f2,#fff0e8);border-radius:32px;padding:40px 35px;text-align:center;box-shadow:0 22px 56px #3a2a6c3d;max-width:420px;width:90%;transform:scale(.7);transition:transform .6s var(--ease-bounce);border:3px solid white}.win-overlay.show .win-card{transform:scale(1)}.win-trophy{width:80px;height:80px;margin:0 auto 12px;animation:trophyBounce 1s var(--ease-bounce);filter:drop-shadow(0 6px 12px rgba(216,172,36,.36))}@keyframes trophyBounce{0%{transform:scale(0) rotate(-30deg)}60%{transform:scale(1.2) rotate(10deg)}to{transform:scale(1) rotate(0)}}.win-title{font-family:Lalezar,cursive;font-size:2.5rem;color:var(--c-pink-deep);margin-bottom:6px}.win-subtitle{font-size:1.3rem;color:var(--c-purple);font-weight:700;margin-bottom:16px}.win-stars{display:flex;justify-content:center;gap:8px;margin-bottom:16px}.win-star{width:40px;height:40px;opacity:0;transform:scale(0);animation:starPop .5s var(--ease-bounce) forwards}.win-star:nth-child(1){animation-delay:.3s}.win-star:nth-child(2){animation-delay:.5s}.win-star:nth-child(3){animation-delay:.7s}@keyframes starPop{to{opacity:1;transform:scale(1)}}.win-stats{font-size:1.1rem;color:var(--c-text-light);margin-bottom:24px;line-height:1.8}.win-stats strong{color:var(--c-pink-deep);font-size:1.3rem}.mute-toggle{position:fixed;top:20px;left:20px;z-index:50;width:44px;height:44px;border-radius:50%;background:var(--glass-bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1.5px solid var(--glass-border);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s}.mute-toggle:hover{transform:scale(1.1)}.mute-toggle svg{width:22px;height:22px}.back-btn{position:fixed;top:20px;right:20px;z-index:50;height:44px;padding:0 20px;border-radius:30px;background:var(--glass-bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1.5px solid var(--glass-border);cursor:pointer;display:flex;align-items:center;gap:6px;color:#fff;font-family:"Baloo Bhaijaan 2",sans-serif;font-weight:700;font-size:.95rem;transition:all .3s var(--ease-bounce)}.back-btn:hover{transform:translateY(-2px) scale(1.03);background:var(--glass-bg-strong)}.back-btn svg{width:20px;height:20px}@media(max-width:520px){.app-title{font-size:2.2rem}.title-icon{width:38px;height:38px}.app-subtitle{font-size:.9rem}.glass-panel{padding:16px}.stat-value{font-size:1.2rem}.stat-label{font-size:.7rem}.diff-btn{font-size:.85rem;padding:7px 14px}.win-title{font-size:2rem}.win-card{padding:30px 25px}}@media(max-height:700px){.app{min-height:100dvh}.app-header{margin-bottom:10px}.app-title{font-size:2.2rem}.glass-panel{padding:14px}.stats-bar{margin-bottom:10px}}.hub-screen{width:100%;max-width:1220px;display:flex;flex-direction:column;gap:24px;animation:fadeInUp .6s var(--ease-bounce)}.hub-categories{display:flex;flex-direction:column;gap:28px;width:100%}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.hub-header{display:flex;align-items:center;justify-content:space-between;gap:16px}.hub-profile{display:flex;align-items:center;gap:14px}.hub-avatar{width:64px;height:64px;border-radius:50%;background:var(--glass-bg-strong);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:2px solid var(--glass-border);padding:6px;display:flex;align-items:center;justify-content:center;animation:gentleFloat 3s ease-in-out infinite}.hub-avatar svg{width:100%;height:100%;filter:drop-shadow(0 3px 5px rgba(0,0,0,.22))}.hub-greeting h1{font-family:Lalezar,cursive;font-size:1.8rem;color:var(--c-white);text-shadow:0 3px 15px rgba(0,0,0,.2);line-height:1.2}.hub-greeting p{font-size:.95rem;color:#ffffffd9;font-weight:500}.hub-stats{display:flex;align-items:center;gap:12px}.hub-stat{display:flex;align-items:center;gap:6px;background:var(--glass-bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1.5px solid var(--glass-border);border-radius:30px;padding:6px 14px;color:var(--c-white);font-weight:800;font-size:1.1rem}.hub-stat-icon{width:22px;height:22px;display:flex}.hub-stat-icon svg{width:100%;height:100%}.hub-settings-btn{width:44px;height:44px;border-radius:50%;background:var(--glass-bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1.5px solid var(--glass-border);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--c-white);transition:all .3s var(--ease-bounce)}.hub-settings-btn:hover{transform:rotate(45deg) scale(1.1)}.hub-settings-btn svg{width:22px;height:22px}.game-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:18px}.game-card{flex:1 1 220px;max-width:262px;background:linear-gradient(180deg,#ffffff38,#ffffff14),var(--glass-bg);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1.5px solid var(--glass-border);border-radius:var(--radius-lg);padding:26px 18px 22px;text-align:center;cursor:pointer;transition:all .4s var(--ease-bounce);position:relative;overflow:hidden;box-shadow:var(--card-shadow),inset 0 1px #ffffff59}.game-card:before{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:var(--card-color, var(--c-pink));border-radius:var(--radius-lg) var(--radius-lg) 0 0;box-shadow:0 0 16px var(--card-color, var(--c-pink))}.game-card:after{content:"";position:absolute;bottom:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,var(--card-color, var(--c-pink)) 0%,transparent 50%);opacity:0;transition:opacity .4s}.game-card:hover{transform:translateY(-8px) scale(1.03);box-shadow:var(--card-shadow-hover);border-color:var(--card-color, var(--c-pink))}.game-card:hover:after{opacity:.08}.game-card-icon{width:92px;height:92px;margin:0 auto 14px;padding:16px;border-radius:26px;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 35%,color-mix(in srgb,var(--card-color, var(--c-pink)) 40%,transparent),transparent 70%),#ffffff29;border:1px solid rgba(255,255,255,.35);box-shadow:inset 0 1px #ffffff80,0 8px 22px #00000024;transition:transform .4s var(--ease-bounce),box-shadow .4s var(--ease-bounce)}.game-card:hover .game-card-icon{transform:scale(1.12) rotate(-4deg);box-shadow:inset 0 1px #ffffff80,0 10px 28px #0003}.game-card-icon svg{width:100%;height:100%;filter:drop-shadow(0 3px 5px rgba(0,0,0,.22))}.game-card-icon .twe{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 6px rgba(0,0,0,.28))}.twe{display:inline-block;vertical-align:middle;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.game-card-title{font-family:Lalezar,cursive;font-size:1.4rem;color:var(--c-white);text-shadow:0 2px 10px rgba(0,0,0,.15);margin-bottom:8px}.game-card-stars{display:flex;justify-content:center;gap:4px;margin-bottom:10px}.hub-star{width:20px;height:20px;opacity:.25;transition:opacity .3s}.hub-star.earned{opacity:1}.hub-star svg{width:100%;height:100%}.game-card-play{font-size:.9rem;font-weight:700;color:var(--card-color, var(--c-pink));background:#ffffffe6;border-radius:20px;padding:6px 16px;display:inline-block;transition:all .3s}.game-card:hover .game-card-play{background:var(--card-color, var(--c-pink));color:#fff;transform:scale(1.05)}.hub-footer{text-align:center;color:#ffffffb3;font-size:.85rem;padding:8px}.game-screen{width:100%;max-width:780px;display:flex;flex-direction:column;gap:14px;animation:fadeInUp .5s var(--ease-bounce)}.game-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.game-header .back-btn,.game-header .mute-toggle{position:static}.game-header .back-btn{padding:0 16px}.game-title{font-family:Lalezar,cursive;font-size:1.8rem;color:var(--c-white);text-shadow:0 3px 15px rgba(0,0,0,.2)}.game-instruction{text-align:center;font-size:1rem;color:#ffffffd9;font-weight:600;margin-bottom:2px;text-shadow:0 2px 8px rgba(0,0,0,.15);animation:fadeInUp .6s var(--ease-bounce)}.game-board{display:grid;gap:10px;perspective:1000px;width:100%;margin:0 auto}.card{aspect-ratio:1;cursor:pointer;perspective:800px;transition:transform .5s var(--ease-smooth)}.card-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .5s var(--ease-smooth)}.card.flipped .card-inner{transform:rotateY(180deg)}.card-face{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}.card-back{background:linear-gradient(135deg,var(--c-purple),var(--c-pink));border:2px solid rgba(255,255,255,.3);box-shadow:var(--card-shadow)}.card-back svg{width:100%;height:100%}.card-front{background:linear-gradient(135deg,#fff9f2,#fff0e8);border:2px solid rgba(255,255,255,.6);transform:rotateY(180deg);box-shadow:var(--card-shadow)}.card-front svg{width:75%;height:75%}.card-front .twe{width:68%;height:68%;object-fit:contain;filter:drop-shadow(0 3px 5px rgba(0,0,0,.2))}.card.matched .card-front{border-color:var(--c-mint);box-shadow:0 0 20px #4ed5a080;animation:matchedPulse .6s ease}@keyframes matchedPulse{0%{transform:rotateY(180deg) scale(1)}50%{transform:rotateY(180deg) scale(1.1)}to{transform:rotateY(180deg) scale(1)}}.card.matched{pointer-events:none}.math-area{display:flex;flex-direction:column;gap:16px}.math-question-card{text-align:center;padding:30px 24px}.math-expression{font-family:Lalezar,cursive;font-size:3rem;color:var(--c-white);text-shadow:0 4px 20px rgba(0,0,0,.2);margin-bottom:24px;letter-spacing:4px}.math-choices{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.math-choice{font-family:Lalezar,cursive;font-size:1.8rem;padding:16px;border-radius:var(--radius-md);border:2px solid rgba(255,255,255,.3);background:#ffffff26;color:var(--c-white);cursor:pointer;transition:all .3s var(--ease-bounce);text-shadow:0 2px 10px rgba(0,0,0,.15)}.math-choice:hover{transform:translateY(-3px) scale(1.03);background:#ffffff40;border-color:#ffffff80}.math-choice.correct{background:linear-gradient(135deg,var(--c-mint),var(--c-mint-deep));border-color:var(--c-mint);color:#fff;animation:correctPulse .5s ease}.math-choice.wrong{background:linear-gradient(135deg,#ff5a5a,#e63c3c);border-color:#ff5a5a;color:#fff;animation:wrongShake .4s ease}@keyframes correctPulse{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}@keyframes wrongShake{0%,to{transform:translate(0)}25%{transform:translate(-8px)}75%{transform:translate(8px)}}.math-feedback{text-align:center;min-height:30px;font-size:1.2rem;font-weight:700}.color-area{display:flex;flex-direction:column;gap:20px;align-items:center}.color-prompt{text-align:center;padding:24px;width:100%}.color-instruction{font-size:1.1rem;color:#ffffffd9;font-weight:600;margin-bottom:6px}.color-target-name{font-family:Lalezar,cursive;font-size:2.5rem;color:var(--c-white);text-shadow:0 3px 15px rgba(0,0,0,.2)}.color-grid{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;padding:10px}.color-circle{width:80px;height:80px;border-radius:50%;border:4px solid rgba(255,255,255,.4);cursor:pointer;transition:all .3s var(--ease-bounce);box-shadow:0 6px 20px #0003}.color-circle:hover{transform:translateY(-5px) scale(1.1);border-color:#ffffffb3}.color-circle.correct{border-color:var(--c-mint);animation:correctPulse .5s ease,correctRing .6s ease;box-shadow:0 0 30px #4ed5a099}.color-circle.wrong{border-color:#ff5a5a;animation:wrongShake .4s ease;opacity:.5}@keyframes correctRing{0%{box-shadow:0 0 #4ed5a099}to{box-shadow:0 0 0 20px #4ed5a000}}.color-feedback{text-align:center;min-height:30px;font-size:1.2rem;font-weight:700}.letters-area{display:flex;flex-direction:column;gap:20px;align-items:center}.letter-display{text-align:center;padding:30px;width:100%}.letter-big{font-family:Lalezar,cursive;font-size:6rem;color:var(--c-white);text-shadow:0 6px 30px rgba(0,0,0,.25);line-height:1;margin-bottom:10px;animation:gentleFloat 2s ease-in-out infinite}.letter-instruction{font-size:1.1rem;color:#ffffffd9;font-weight:600}.letter-choices{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;width:100%}.letter-choice{font-family:"Baloo Bhaijaan 2",sans-serif;font-size:1.3rem;font-weight:700;padding:14px;border-radius:var(--radius-md);border:2px solid rgba(255,255,255,.3);background:#ffffff26;color:var(--c-white);cursor:pointer;transition:all .3s var(--ease-bounce);text-shadow:0 2px 10px rgba(0,0,0,.15)}.letter-choice:hover{transform:translateY(-3px) scale(1.03);background:#ffffff40}.letter-choice.correct{background:linear-gradient(135deg,var(--c-mint),var(--c-mint-deep));border-color:var(--c-mint);animation:correctPulse .5s ease}.letter-choice.wrong{background:linear-gradient(135deg,#ff5a5a,#e63c3c);border-color:#ff5a5a;animation:wrongShake .4s ease}.letter-feedback{text-align:center;min-height:30px;font-size:1.2rem;font-weight:700}.shapes-area{display:flex;flex-direction:column;gap:20px;align-items:center}.shape-display{text-align:center;padding:24px;width:100%}.shape-big{width:120px;height:120px;margin:0 auto 10px;animation:gentleFloat 2s ease-in-out infinite}.shape-big svg{width:100%;height:100%;filter:drop-shadow(0 4px 8px rgba(0,0,0,.22))}.shape-instruction{font-size:1.1rem;color:#ffffffd9;font-weight:600}.shape-choices{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;width:100%}.shape-choice{font-family:"Baloo Bhaijaan 2",sans-serif;font-size:1.3rem;font-weight:700;padding:14px;border-radius:var(--radius-md);border:2px solid rgba(255,255,255,.3);background:#ffffff26;color:var(--c-white);cursor:pointer;transition:all .3s var(--ease-bounce);text-shadow:0 2px 10px rgba(0,0,0,.15)}.shape-choice:hover{transform:translateY(-3px) scale(1.03);background:#ffffff40}.shape-choice.correct{background:linear-gradient(135deg,var(--c-mint),var(--c-mint-deep));border-color:var(--c-mint);animation:correctPulse .5s ease}.shape-choice.wrong{background:linear-gradient(135deg,#ff5a5a,#e63c3c);border-color:#ff5a5a;animation:wrongShake .4s ease}.shape-feedback{text-align:center;min-height:30px;font-size:1.2rem;font-weight:700}.french-area{display:flex;flex-direction:column;align-items:center;gap:20px;padding:10px 0}.french-question-card{width:100%;max-width:520px;padding:32px 24px;border-radius:var(--radius-lg);text-align:center;display:flex;flex-direction:column;align-items:center;gap:20px}.french-number-display{font-family:Lalezar,cursive;font-size:5rem;font-weight:700;color:var(--c-purple);line-height:1;text-shadow:0 4px 12px rgba(124,92,232,.3)}.french-color-circle{width:100px;height:100px;border-radius:50%;box-shadow:0 8px 24px #0003,inset 0 -8px 16px #00000026;border:3px solid rgba(255,255,255,.4)}.french-animal-display{width:120px;height:120px;display:flex;align-items:center;justify-content:center}.french-animal-display svg{width:100%;height:100%;filter:drop-shadow(0 4px 8px rgba(0,0,0,.22))}.french-animal-display .twe{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 5px 10px rgba(0,0,0,.25))}.french-prompt{font-size:1.15rem;color:#ffffffe6;font-weight:500}.french-choices{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;width:100%}.french-choice{font-family:"Baloo Bhaijaan 2",sans-serif;font-size:1.25rem;font-weight:600;padding:14px 28px;border-radius:var(--radius-md);border:2.5px solid rgba(124,92,232,.3);background:#ffffff26;color:var(--c-white);cursor:pointer;transition:all .25s var(--ease-smooth);min-width:120px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.french-choice:hover{background:#7c5ce826;border-color:var(--c-purple);transform:translateY(-2px);box-shadow:0 6px 16px #7c5ce840}.french-choice:active{transform:translateY(0) scale(.97)}.french-choice.fb-correct{background:#4ed5a04d;border-color:var(--c-mint);color:var(--c-mint);box-shadow:0 0 20px #4ed5a066}.french-choice.fb-wrong{background:#ff5a5a40;border-color:#ff5a5a;color:#ff7a7a;animation:shake .4s ease}.french-feedback{min-height:28px;font-size:1.15rem;font-weight:700}.fb-correct-text{color:var(--c-mint)}.fb-wrong-text{color:#ff7a7a}.hub-category{width:100%;margin-bottom:8px}.hub-category-title{font-family:Lalezar,cursive;font-size:1.5rem;color:var(--c-white);text-shadow:0 2px 12px rgba(0,0,0,.22);margin:0 0 14px;padding:0 4px;display:flex;align-items:center;gap:10px}.hub-category-title:before{content:"";width:5px;height:26px;border-radius:3px;background:var(--c-yellow);box-shadow:0 0 12px #ffd84db3}.hub-category.fr .hub-category-title:before{background:var(--c-pink)}.hub-category.fr .hub-category-title{direction:ltr;text-align:left}.fish-sea{position:relative;width:100%;aspect-ratio:4 / 3;max-height:50vh;border-radius:var(--radius-lg);overflow:hidden;border:2px solid rgba(255,255,255,.3);box-shadow:var(--card-shadow);background:#1560a0}.fish-sea canvas{display:block;width:100%;height:100%;cursor:crosshair}.combo-pop{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);font-family:Lalezar,cursive;font-size:2rem;color:var(--c-yellow);text-shadow:0 0 20px rgba(255,216,77,.8),0 4px 10px rgba(0,0,0,.4);pointer-events:none;transition:transform .3s var(--ease-bounce);white-space:nowrap}.combo-pop.show{transform:translate(-50%,-50%) scale(1);animation:comboPopAnim 1s ease forwards}@keyframes comboPopAnim{0%{transform:translate(-50%,-50%) scale(.3);opacity:1}30%{transform:translate(-50%,-50%) scale(1.3);opacity:1}to{transform:translate(-50%,-60%) scale(1);opacity:0}}.fb-correct{color:var(--c-mint-light);text-shadow:0 2px 10px rgba(0,0,0,.2);animation:fbPop .4s var(--ease-bounce)}.fb-wrong{color:#ffb3b3;text-shadow:0 2px 10px rgba(0,0,0,.2);animation:fbPop .4s var(--ease-bounce)}@keyframes fbPop{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.settings-screen{width:100%;max-width:640px;display:flex;flex-direction:column;gap:16px;animation:fadeInUp .5s var(--ease-bounce)}.settings-content{padding:28px 24px}.settings-section{margin-bottom:24px}.settings-section:last-child{margin-bottom:0}.settings-label{display:block;font-size:1.1rem;font-weight:700;color:var(--c-white);margin-bottom:10px;text-shadow:0 2px 10px rgba(0,0,0,.15)}.settings-input{width:100%;font-family:"Baloo Bhaijaan 2",sans-serif;font-size:1.3rem;font-weight:600;padding:14px 20px;border-radius:var(--radius-md);border:2px solid rgba(255,255,255,.3);background:#ffffff26;color:var(--c-white);text-align:center;transition:all .3s;text-shadow:0 2px 10px rgba(0,0,0,.15)}.settings-input::placeholder{color:#ffffff80}.settings-input:focus{border-color:var(--c-pink-light);background:#ffffff40;transform:scale(1.02)}.settings-input:focus-visible{outline:3px solid rgba(255,255,255,.9);outline-offset:3px}.avatar-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:12px}.avatar-option{aspect-ratio:1;border-radius:50%;background:#ffffff1f;border:2.5px solid rgba(255,255,255,.25);padding:8px;cursor:pointer;transition:all .3s var(--ease-bounce);display:flex;align-items:center;justify-content:center}.avatar-option svg{width:100%;height:100%}.avatar-option:hover{transform:scale(1.1);background:#fff3}.avatar-option.selected{border-color:var(--c-yellow);background:#ffd84d33;box-shadow:0 0 20px #ffd84d66;transform:scale(1.1)}.win-stars .win-star.earned svg path{fill:var(--c-yellow);stroke:var(--c-yellow-deep)}.win-stars .win-star:not(.earned) svg path{fill:#e0d0e8;stroke:#c0b0c8}.win-stats{display:flex;justify-content:space-around;gap:12px;margin-bottom:24px;flex-wrap:wrap}.win-stat{display:flex;flex-direction:column;align-items:center;gap:4px}.win-stat-label{font-size:.85rem;color:var(--c-text-light);font-weight:600}.win-stat-value{font-family:Lalezar,cursive;font-size:1.5rem;color:var(--c-pink-deep);font-weight:700}.win-buttons{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.app::-webkit-scrollbar{width:6px}.app::-webkit-scrollbar-track{background:transparent}.app::-webkit-scrollbar-thumb{background:#fff3;border-radius:10px}@media(max-width:520px){.hub-greeting h1{font-size:1.4rem}.hub-greeting p{font-size:.8rem}.hub-avatar{width:52px;height:52px}.hub-stat{font-size:.95rem;padding:5px 10px}.game-grid{gap:12px}.game-card{flex:1 1 140px;max-width:47%;padding:18px 10px 14px}.game-card-icon{width:66px;height:66px;padding:12px;border-radius:20px;margin-bottom:10px}.game-card-title{font-size:1.1rem}.game-title{font-size:1.4rem}.math-expression{font-size:2.2rem}.math-choice{font-size:1.4rem;padding:12px}.color-circle{width:64px;height:64px}.letter-big{font-size:4.5rem}.shape-big{width:100px;height:100px}.letter-choice,.shape-choice{font-size:1.1rem;padding:12px}.fish-sea{aspect-ratio:3/2}.combo-pop{font-size:1.5rem}.settings-input{font-size:1.1rem}.avatar-grid{grid-template-columns:repeat(auto-fill,minmax(60px,1fr));gap:8px}}@media(max-height:700px){.hub-screen{gap:12px}.game-grid{gap:10px}.game-card{padding:16px 12px 12px}.game-card-icon{width:68px;height:68px;padding:12px;margin-bottom:8px}.math-question-card{padding:20px 16px}.math-expression{font-size:2.2rem;margin-bottom:16px}.letter-big{font-size:4.5rem}.letter-display,.shape-display{padding:18px}}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-6px)}80%{transform:translate(6px)}}.simon-stage{display:flex;flex-direction:column;align-items:center;gap:22px}.simon-board{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;width:min(360px,78vw);aspect-ratio:1}.simon-pad{border:none;border-radius:26px;cursor:pointer;background:var(--pad);opacity:.5;box-shadow:inset 0 -7px #0000002e,0 8px 22px #0003;transition:opacity .15s ease,transform .15s var(--ease-bounce),box-shadow .15s ease}.simon-pad:active{transform:scale(.97)}.simon-pad.lit{opacity:1;box-shadow:inset 0 -7px #0000001a,0 0 34px 8px #ffffffa6;transform:scale(1.04)}.simon-board.shake{animation:shake .5s ease}.simon-status{font-family:"Baloo Bhaijaan 2",sans-serif;font-size:1.2rem;font-weight:700;color:var(--c-white);min-height:28px;text-shadow:0 2px 10px rgba(0,0,0,.22)}.simon-start{min-width:170px}.clock-area{display:flex;justify-content:center}.clock-card{display:flex;flex-direction:column;align-items:center;gap:18px;padding:28px;max-width:520px;width:100%}.clock-wrap{width:min(240px,58vw)}.clock-face{width:100%;height:auto;filter:drop-shadow(0 8px 22px rgba(0,0,0,.22))}.clock-num{font-family:"Baloo Bhaijaan 2",sans-serif;font-size:16px;font-weight:800;fill:#4a3a6b}.clock-prompt{font-size:1.2rem;font-weight:700;color:var(--c-white)}.clock-choices{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}.clock-choice{font-family:Lalezar,cursive;font-size:1.6rem;padding:10px 26px;border-radius:var(--radius-md);border:2.5px solid rgba(155,109,255,.35);background:#ffffff26;color:var(--c-white);cursor:pointer;transition:all .25s var(--ease-smooth);min-width:100px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.clock-choice:hover{background:#9b6dff2e;border-color:var(--c-purple);transform:translateY(-2px);box-shadow:0 6px 16px #7c5ce840}.clock-choice:active{transform:translateY(0) scale(.97)}.clock-choice.fb-correct{background:#4ed5a04d;border-color:var(--c-mint);color:var(--c-mint);box-shadow:0 0 20px #4ed5a066}.clock-choice.fb-wrong{background:#ff5a5a40;border-color:#ff5a5a;color:#ff7a7a;animation:shake .4s ease}.clock-feedback{min-height:28px;font-size:1.15rem;font-weight:700}.spell-area{display:flex;justify-content:center}.spell-card{display:flex;flex-direction:column;align-items:center;gap:18px;padding:28px;max-width:560px;width:100%}.spell-picture{width:110px;height:110px}.spell-picture .twe{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 5px 10px rgba(0,0,0,.25))}.spell-slots{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.spell-slots.shake{animation:shake .5s ease}.spell-slot{width:46px;height:58px;border-radius:12px;border:2px dashed rgba(255,255,255,.4);background:#ffffff1a;display:flex;align-items:center;justify-content:center;font-family:Lalezar,cursive;font-size:1.9rem;color:var(--c-white);text-transform:uppercase}.spell-slot.filled{border-style:solid;border-color:var(--c-mint);background:#4ed5a026}.spell-slot.ok{border-color:var(--c-mint);background:#4ed5a04d;box-shadow:0 0 14px #4ed5a066}.spell-slot.bad{border-color:#ff5a5a;background:#ff5a5a33;color:#ff7a7a}.spell-tiles{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.spell-tile{width:52px;height:60px;border-radius:14px;border:none;background:linear-gradient(135deg,#fff,#ffe9dd);color:#4a3a6b;font-family:Lalezar,cursive;font-size:2rem;text-transform:uppercase;cursor:pointer;box-shadow:inset 0 -4px #00000014,0 6px 14px #00000029;transition:transform .15s var(--ease-bounce),opacity .2s ease}.spell-tile:hover{transform:translateY(-3px)}.spell-tile:active{transform:scale(.95)}.spell-tile.used{opacity:0;pointer-events:none;transform:scale(.5)}.spell-clear{min-width:130px}.spell-feedback{min-height:28px;font-size:1.15rem;font-weight:700}.odd-area{display:flex;justify-content:center}.odd-card{display:flex;flex-direction:column;align-items:center;gap:20px;padding:28px;max-width:620px;width:100%}.odd-prompt{font-size:1.25rem;font-weight:700;color:var(--c-white)}.odd-grid{display:grid;gap:16px;width:100%}.odd-item{aspect-ratio:1;border-radius:22px;border:3px solid rgba(255,255,255,.25);background:#ffffff24;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:14px;transition:all .2s var(--ease-bounce);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.odd-item .twe{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(0,0,0,.22))}.odd-item:hover{transform:translateY(-4px) scale(1.05);border-color:#fff9;box-shadow:0 10px 24px #0003}.odd-item.correct{border-color:var(--c-mint);background:#4ed5a040;box-shadow:0 0 24px #4ed5a080}.odd-item.wrong{border-color:#ff5a5a;background:#ff5a5a38;animation:shake .4s ease}.odd-feedback{min-height:28px;font-size:1.15rem;font-weight:700}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:3;pointer-events:none;opacity:.045;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}@keyframes cardRise{0%{opacity:0;transform:translateY(26px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.game-card{animation:cardRise .5s var(--ease-bounce) backwards}.game-grid .game-card:nth-child(1){animation-delay:.04s}.game-grid .game-card:nth-child(2){animation-delay:.08s}.game-grid .game-card:nth-child(3){animation-delay:.12s}.game-grid .game-card:nth-child(4){animation-delay:.16s}.game-grid .game-card:nth-child(5){animation-delay:.2s}.game-grid .game-card:nth-child(6){animation-delay:.24s}.game-grid .game-card:nth-child(7){animation-delay:.28s}.game-grid .game-card:nth-child(8){animation-delay:.32s}.game-grid .game-card:nth-child(9){animation-delay:.36s}.game-grid .game-card:nth-child(n+10){animation-delay:.4s}.game-card-icon{position:relative;overflow:hidden}.game-card-icon:after{content:"";position:absolute;top:-60%;left:-60%;width:60%;height:220%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);transform:rotate(22deg);opacity:0;transition:none}.game-card:hover .game-card-icon:after{animation:iconSheen .8s var(--ease-smooth)}@keyframes iconSheen{0%{left:-60%;opacity:0}30%{opacity:.9}to{left:130%;opacity:0}}.glass-panel{position:relative;overflow:hidden}.glass-panel:before{content:"";position:absolute;top:0;left:0;right:0;height:42%;background:linear-gradient(180deg,rgba(255,255,255,.14),transparent);pointer-events:none}.game-card:focus-visible,.btn:focus-visible,.diff-btn:focus-visible,.back-btn:focus-visible,.mute-toggle:focus-visible,.math-choice:focus-visible,.clock-choice:focus-visible,.odd-item:focus-visible,.pattern-choice:focus-visible,.count-choice:focus-visible,.spell-tile:focus-visible,.puzzle-tile:focus-visible{outline:3px solid rgba(255,255,255,.85);outline-offset:3px}@media(prefers-reduced-motion:reduce){.game-card,.bg-blob,.hub-avatar,.title-icon{animation:none!important}*{scroll-behavior:auto}}.puzzle-area{display:flex;justify-content:center}.puzzle-card{display:flex;justify-content:center;padding:24px;max-width:460px;width:100%}.puzzle-grid{display:grid;gap:10px;width:min(360px,76vw);aspect-ratio:1}.puzzle-tile{border:none;border-radius:16px;font-family:Lalezar,cursive;font-size:clamp(1.4rem,6vw,2.4rem);color:#fff;cursor:pointer;background:linear-gradient(145deg,var(--c-sky),var(--c-purple));box-shadow:inset 0 -5px #0000002e,0 6px 14px #0000002e;display:flex;align-items:center;justify-content:center;transition:transform .12s var(--ease-bounce),box-shadow .2s ease;text-shadow:0 2px 6px rgba(0,0,0,.25)}.puzzle-tile:hover{transform:scale(1.04);box-shadow:inset 0 -5px #00000024,0 8px 20px #0000003d}.puzzle-tile:active{transform:scale(.96)}.puzzle-tile.blank{background:#ffffff0f;box-shadow:inset 0 0 0 2px #ffffff24;cursor:default}.pattern-area{display:flex;justify-content:center}.pattern-card{display:flex;flex-direction:column;align-items:center;gap:18px;padding:28px;max-width:640px;width:100%}.pattern-seq{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.pattern-cell{width:clamp(46px,12vw,64px);height:clamp(46px,12vw,64px);border-radius:16px;background:#ffffff1f;border:1.5px solid rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;padding:8px}.pattern-cell .twe{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 3px 5px rgba(0,0,0,.22))}.pattern-cell.pattern-q{font-family:Lalezar,cursive;font-size:2rem;color:var(--c-white);background:#ffffff0f;border-style:dashed}.pattern-sub{font-size:1.05rem;font-weight:700;color:#ffffffe6}.pattern-choices{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}.pattern-choice{width:clamp(58px,15vw,76px);height:clamp(58px,15vw,76px);border-radius:18px;border:3px solid rgba(255,255,255,.25);background:#ffffff24;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:12px;transition:all .2s var(--ease-bounce);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.pattern-choice .twe{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 3px 6px rgba(0,0,0,.22))}.pattern-choice:hover{transform:translateY(-4px) scale(1.05);border-color:#fff9;box-shadow:0 10px 22px #0003}.pattern-choice.correct{border-color:var(--c-mint);background:#4ed5a040;box-shadow:0 0 22px #4ed5a080}.pattern-choice.wrong{border-color:#ff5a5a;background:#ff5a5a38;animation:shake .4s ease}.pattern-feedback{min-height:26px;font-size:1.1rem;font-weight:700}.count-area{display:flex;justify-content:center}.count-card{display:flex;flex-direction:column;align-items:center;gap:18px;padding:28px;max-width:620px;width:100%}.count-objects{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;min-height:70px;padding:10px;border-radius:var(--radius-md);background:#ffffff14;border:1.5px solid rgba(255,255,255,.18);width:100%}.count-obj{width:clamp(34px,8vw,46px);height:clamp(34px,8vw,46px);display:inline-flex}.count-obj .twe{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 3px 5px rgba(0,0,0,.2));animation:popIn .3s var(--ease-bounce) backwards}@keyframes popIn{0%{transform:scale(0)}to{transform:scale(1)}}.count-prompt{font-size:1.2rem;font-weight:700;color:var(--c-white);direction:ltr}.count-choices{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}.count-choice{font-family:"Baloo Bhaijaan 2",sans-serif;font-weight:800;font-size:1.3rem;padding:12px 26px;border-radius:var(--radius-md);border:2.5px solid rgba(53,201,201,.4);background:#ffffff26;color:var(--c-white);cursor:pointer;transition:all .25s var(--ease-smooth);min-width:110px;direction:ltr;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.count-choice:hover{background:#35c9c933;border-color:#35c9c9;transform:translateY(-2px);box-shadow:0 6px 16px #35c9c94d}.count-choice:active{transform:translateY(0) scale(.97)}.count-choice.correct{background:#4ed5a04d;border-color:var(--c-mint);box-shadow:0 0 20px #4ed5a073}.count-choice.wrong{background:#ff5a5a40;border-color:#ff5a5a;color:#ff7a7a;animation:shake .4s ease}.count-feedback{min-height:26px;font-size:1.1rem;font-weight:700;direction:ltr}.hub-hero{display:flex;flex-direction:column;gap:18px;padding:22px 24px;background:linear-gradient(135deg,#ffffff42,#ffffff14),var(--glass-bg)}.hub-hero-top{display:flex;align-items:center;justify-content:space-between;gap:16px}.hub-hero .hub-avatar{width:74px;height:74px}.hub-hero .hub-profile{gap:16px}.hub-hello{display:block;font-size:.9rem;font-weight:700;color:#fffc;letter-spacing:.3px}.hub-hero .hub-greeting h1{font-size:2rem;margin:1px 0 3px}.hub-hero .hub-greeting p{font-size:.92rem}.hub-progress{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding-top:16px;border-top:1.5px solid rgba(255,255,255,.18)}.hub-level-badge{flex:0 0 auto;width:66px;height:66px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(145deg,var(--c-purple),var(--c-pink));box-shadow:0 8px 22px #7c5ce880,inset 0 1px #fff6;border:2px solid rgba(255,255,255,.4);color:#fff;text-align:center}.hub-level-num{font-family:Lalezar,cursive;font-size:1.7rem;line-height:1}.hub-level-word{font-size:.6rem;font-weight:700;opacity:.9;margin-top:1px}.hub-progress-main{flex:1 1 200px;min-width:170px}.hub-progress-meta{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px;color:#fff}.hub-rank{font-weight:800;font-size:1rem;text-shadow:0 1px 6px rgba(0,0,0,.2)}.hub-progress-count{display:inline-flex;align-items:center;gap:3px;font-weight:800;font-size:.95rem}.hub-progress-count small{opacity:.7;font-weight:700}.hub-progress-star{width:16px;height:16px;display:inline-flex;margin-inline-start:2px}.hub-progress-star svg{width:100%;height:100%}.hub-progress-track{height:14px;border-radius:30px;background:#fff3;box-shadow:inset 0 2px 5px #0003;overflow:hidden;position:relative}.hub-progress-fill{height:100%;border-radius:30px;background:linear-gradient(90deg,var(--c-yellow),var(--c-mint));box-shadow:0 0 14px #ffd84d99;transition:width .9s var(--ease-bounce);position:relative;min-width:14px}.hub-progress-fill:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);transform:translate(-100%);animation:barShimmer 2.6s ease-in-out infinite}@keyframes barShimmer{0%{transform:translate(-100%)}60%,to{transform:translate(100%)}}.hub-metrics{display:flex;gap:10px;flex:0 0 auto}.hub-metric{display:flex;align-items:center;gap:9px;background:var(--glass-bg);border:1.5px solid var(--glass-border);border-radius:30px;padding:7px 15px 7px 12px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.hub-metric-icon{width:26px;height:26px;display:flex;flex:0 0 auto}.hub-metric-icon svg{width:100%;height:100%}.hub-metric-text{display:flex;flex-direction:column;line-height:1.05;color:#fff}.hub-metric-text b{font-size:1.15rem;font-weight:800}.hub-metric-text small{font-size:.68rem;opacity:.82;font-weight:600}.hub-category-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.hub-category-head .hub-category-title{margin-bottom:0}.hub-category.fr .hub-category-head{direction:ltr}.hub-count-badge{flex:0 0 auto;font-size:.8rem;font-weight:700;color:#fff;background:#ffffff29;border:1.5px solid var(--glass-border);border-radius:20px;padding:4px 13px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.game-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));justify-content:initial}.game-card{flex:initial;max-width:none}@media(max-width:720px){.app{padding:16px 14px calc(16px + env(safe-area-inset-bottom))}.hub-screen{gap:18px}.game-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.game-card{max-width:none}}@media(max-width:560px){.hub-hero{padding:18px 16px;gap:14px}.hub-hero-top{gap:12px}.hub-hero .hub-avatar{width:60px;height:60px}.hub-hero .hub-greeting h1{font-size:1.55rem}.hub-hello{font-size:.8rem}.hub-hero .hub-greeting p{font-size:.82rem}.hub-progress{gap:12px;padding-top:14px}.hub-level-badge{width:56px;height:56px}.hub-level-num{font-size:1.4rem}.hub-metrics{width:100%}.hub-metric{flex:1 1 0;justify-content:center}.game-grid{grid-template-columns:repeat(2,1fr);gap:11px}.game-card{padding:18px 10px 15px;max-width:none}.game-card-icon{width:62px;height:62px;padding:11px;border-radius:20px;margin-bottom:9px}.game-card-title{font-size:1.05rem}.game-card-play{font-size:.82rem;padding:5px 12px}.hub-category-title{font-size:1.25rem}.hub-count-badge{font-size:.72rem;padding:3px 10px}.diff-btn{min-height:44px}.back-btn,.mute-toggle,.hub-settings-btn{min-width:44px;min-height:44px}.math-choice,.count-choice,.pattern-choice,.odd-item,.clock-choice{min-height:48px}}@media(max-width:360px){.game-grid{gap:9px}.game-card-icon{width:56px;height:56px}.game-card-title{font-size:.98rem}.hub-hero .hub-greeting h1{font-size:1.35rem}}.pin-screen{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:100;padding:20px}.pin-glass{text-align:center;max-width:360px;width:100%;padding:40px 32px 36px;display:flex;flex-direction:column;align-items:center;gap:16px}.pin-icon{width:56px;height:56px;display:flex;align-items:center;justify-content:center;background:#ffffff1f;border-radius:50%;color:var(--c-purple-light)}.pin-icon svg{width:28px;height:28px}.pin-title{font-family:var(--font-display);font-size:1.6rem;color:var(--c-cream);margin:0}.pin-subtitle{font-size:.88rem;color:var(--c-text-light);margin:0}.pin-circles{display:flex;gap:18px;justify-content:center;margin:8px 0}.pin-circle{width:28px;height:28px;border-radius:50%;border:3px solid rgba(255,255,255,.35);background:transparent;transition:all .2s ease}.pin-circle.active{border-color:var(--c-purple-light);box-shadow:0 0 12px #7c5ce866}.pin-circle.filled{background:var(--c-purple);border-color:var(--c-purple);transform:scale(1.1)}.pin-circle.error{border-color:var(--c-pink)!important;background:var(--c-pink)!important;animation:pin-shake .4s ease}@keyframes pin-shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-5px)}80%{transform:translate(5px)}}.pin-error{color:var(--c-pink-light);font-size:.82rem;margin:0;animation:pin-fade-in .3s ease}@keyframes pin-fade-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.pin-hidden-input{position:absolute;opacity:0;width:0;height:0;border:none;padding:0;pointer-events:none}.pin-skip-btn{background:none;border:none;color:var(--c-text-light);font-family:var(--font-body);font-size:.85rem;cursor:pointer;padding:8px 16px;margin-top:4px;border-radius:8px;transition:background .2s,color .2s}.pin-skip-btn:hover{background:#ffffff14;color:var(--c-cream)}@media(max-width:560px){.pin-glass{padding:32px 24px 28px}.pin-title{font-size:1.4rem}.pin-circles{gap:14px}.pin-circle{width:24px;height:24px}.settings-pin-row{flex-direction:column}}@media(max-width:768px){body{background-attachment:scroll}.bg-blob{filter:blur(40px);opacity:.22}.bg-blob:nth-child(1){width:280px;height:280px}.bg-blob:nth-child(2){width:240px;height:240px}.bg-blob:nth-child(3){width:200px;height:200px}.bg-blob:nth-child(4){display:none}.bg-pattern{display:none}.glass-panel,.game-card,.hub-avatar,.back-btn,.mute-toggle,.hub-settings-btn,.hub-stat,.diff-btn{backdrop-filter:blur(8px) saturate(140%);-webkit-backdrop-filter:blur(8px) saturate(140%)}.game-card{box-shadow:0 4px 14px #4936961f}.game-card:hover{box-shadow:0 8px 20px #4936962e}.game-card:hover{transform:translateY(-4px)}.game-card:hover .game-card-icon{transform:scale(1.05)}.game-card-icon{width:72px;height:72px;padding:12px}.bg-blob{animation-duration:30s}.hub-avatar,.title-icon,.letter-big,.shape-big{animation:none}.app{padding:16px 14px}.glass-panel{padding:14px}.game-title{font-size:1.4rem}.hub-greeting h1{font-size:1.5rem}.win-overlay{backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}}
