@import"https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap";:root{--bg-primary: #1a1a2e;--bg-secondary: #16213e;--accent-primary: #e94560;--accent-secondary: #0f3460;--text-primary: #ffffff;--text-secondary: #a0a0a0;--success: #4ade80;--error: #f87171;--star: #fbbf24;--tile-bg: #3b82f6;--tile-correct: #22c55e;--tile-wrong: #ef4444}*{box-sizing:border-box}html,body{margin:0;padding:0;min-height:100vh}body{font-family:"Press Start 2P",monospace;background-color:var(--bg-primary);color:var(--text-primary);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh}button{font-family:inherit}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.start-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:20px;gap:24px}.title-section{text-align:center;margin-bottom:20px}.cat-emoji{font-size:64px;display:block;margin-bottom:10px;animation:bounce 1s ease-in-out infinite}.title-section h1{font-size:2rem;color:var(--accent-primary);text-shadow:4px 4px 0 var(--accent-secondary);margin:0}.selection-section{width:100%;max-width:400px;text-align:center}.selection-section h2{font-size:.9rem;color:var(--text-secondary);margin-bottom:12px}.grade-buttons,.topic-buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.grade-btn,.topic-btn{background:var(--bg-secondary);border:3px solid var(--accent-secondary);color:var(--text-primary);padding:12px 20px;font-family:inherit;font-size:.8rem;cursor:pointer;transition:all .1s;box-shadow:4px 4px 0 var(--accent-secondary)}.grade-btn:hover:not(.disabled),.topic-btn:hover:not(.disabled){transform:translate(2px,2px);box-shadow:2px 2px 0 var(--accent-secondary)}.grade-btn.selected,.topic-btn.selected{background:var(--accent-primary);border-color:var(--accent-primary);transform:translate(4px,4px);box-shadow:none}.topic-btn{display:flex;flex-direction:column;align-items:center;min-width:80px}.topic-btn.disabled{opacity:.4;cursor:not-allowed}.topic-symbol{font-size:1.5rem;margin-bottom:4px}.topic-label{font-size:.6rem}.start-btn{background:var(--success);border:3px solid #16a34a;color:#000;padding:16px 48px;font-family:inherit;font-size:1rem;cursor:pointer;margin-top:20px;box-shadow:6px 6px #16a34a;transition:all .1s}.start-btn:hover{transform:translate(3px,3px);box-shadow:3px 3px #16a34a}.start-btn:active{transform:translate(6px,6px);box-shadow:none}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.timer{display:flex;align-items:center;gap:6px;font-size:.9rem;color:var(--text-primary)}.timer-icon{font-size:1rem}.timer.low{color:var(--error);animation:pulse .5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.game-header{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;background:var(--bg-secondary);border-bottom:3px solid var(--accent-secondary)}.header-right{display:flex;align-items:center;gap:16px}.header-btn{background:transparent;border:none;font-size:1.5rem;cursor:pointer;padding:4px;transition:transform .1s}.header-btn:hover{transform:scale(1.1)}.header-btn:active{transform:scale(.95)}.cat-mascot{position:relative;display:inline-flex;align-items:center;justify-content:center}.cat-sprite{font-size:48px;transition:transform .2s}.cat-mascot.idle .cat-sprite{animation:idle-bounce 2s ease-in-out infinite}.cat-mascot.happy .cat-sprite{animation:happy-jump .5s ease-out}.cat-mascot.encouraging .cat-sprite{animation:head-tilt .5s ease-out}.cat-mascot.excited .cat-sprite{animation:excited-wiggle .8s ease-out}.cat-mascot.celebrating .cat-sprite{animation:celebrate-dance 1.5s ease-in-out}.stars{position:absolute;top:-10px;right:-10px;font-size:24px;animation:star-sparkle .8s ease-out}.confetti{position:absolute;top:-15px;right:-15px;font-size:28px;animation:confetti-pop 1.5s ease-out}@keyframes idle-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes happy-jump{0%{transform:translateY(0) scale(1)}50%{transform:translateY(-20px) scale(1.1)}to{transform:translateY(0) scale(1)}}@keyframes head-tilt{0%,to{transform:rotate(0)}50%{transform:rotate(15deg)}}@keyframes excited-wiggle{0%,to{transform:rotate(0) scale(1)}25%{transform:rotate(-10deg) scale(1.1)}50%{transform:rotate(10deg) scale(1.15)}75%{transform:rotate(-5deg) scale(1.1)}}@keyframes celebrate-dance{0%,to{transform:translateY(0) rotate(0)}25%{transform:translateY(-15px) rotate(-10deg)}50%{transform:translateY(0) rotate(10deg)}75%{transform:translateY(-10px) rotate(-5deg)}}@keyframes star-sparkle{0%{transform:scale(0) rotate(0);opacity:0}50%{transform:scale(1.5) rotate(180deg);opacity:1}to{transform:scale(1) rotate(360deg);opacity:1}}@keyframes confetti-pop{0%{transform:scale(0);opacity:0}20%{transform:scale(1.3);opacity:1}to{transform:scale(1);opacity:1}}.prompt{text-align:center;padding:10px 20px}.prompt p{font-size:1.1rem;color:var(--text-primary);margin:0;text-shadow:2px 2px 0 var(--bg-secondary)}.tile{background:var(--tile-bg);border:3px solid #2563eb;color:var(--text-primary);font-family:inherit;font-size:1rem;padding:12px 8px;cursor:pointer;transition:transform .1s,background .1s;box-shadow:4px 4px #1d4ed8;min-height:60px;display:flex;align-items:center;justify-content:center}.tile:hover:not(:disabled){transform:scale(1.05);background:#60a5fa}.tile:active:not(:disabled){transform:scale(.95)}.tile.correct{animation:correct-pop .5s ease-out forwards}.tile.wrong{animation:wrong-wobble .5s ease-out}.tile.hidden{visibility:hidden;pointer-events:none}.tile:disabled{cursor:default}@keyframes correct-pop{0%{transform:scale(1);background:var(--tile-bg)}30%{transform:scale(1.2);background:var(--tile-correct);border-color:#16a34a}to{transform:scale(0);opacity:0}}@keyframes wrong-wobble{0%,to{transform:translate(0);background:var(--tile-bg)}10%{transform:translate(-8px);background:var(--tile-wrong);border-color:#dc2626}30%{transform:translate(8px);background:var(--tile-wrong)}50%{transform:translate(-8px)}70%{transform:translate(8px)}90%{transform:translate(-4px)}}.tile-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:10px;max-width:500px;margin:0 auto}@media(min-width:768px){.tile-grid{grid-template-columns:repeat(5,1fr);max-width:600px}}.stats-bar{display:flex;justify-content:center;gap:24px;padding:12px 20px;background:var(--bg-secondary);border-top:3px solid var(--accent-secondary)}.stat{display:flex;align-items:center;gap:6px;font-size:.85rem}.stat-label{color:var(--text-secondary)}.stat-value{color:var(--text-primary);font-weight:700}.stat.correct .stat-icon{color:var(--success)}.stat.wrong .stat-icon{color:var(--error)}.game-board{display:flex;flex-direction:column;min-height:calc(100vh - 60px)}.cat-prompt-section{display:flex;flex-direction:column;align-items:center;padding:16px;gap:8px}@media(min-width:768px){.cat-prompt-section{flex-direction:row;justify-content:center;gap:16px}}.round-complete-overlay{position:fixed;inset:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:100;animation:fade-in .3s ease-out}.round-complete-modal{background:var(--bg-primary);border:4px solid var(--accent-primary);padding:32px;max-width:380px;width:90%;text-align:center;box-shadow:8px 8px 0 var(--accent-secondary);animation:pop-in .4s ease-out}.round-complete-modal h2{color:var(--accent-primary);margin:0 0 16px;font-size:1.3rem}.celebration{margin:16px 0}.stars-display{margin:20px 0;display:flex;justify-content:center;gap:12px}.star{font-size:2.5rem;transition:transform .3s}.star.earned{animation:star-pop .5s ease-out backwards}.star.earned:nth-child(1){animation-delay:.1s}.star.earned:nth-child(2){animation-delay:.3s}.star.earned:nth-child(3){animation-delay:.5s}.star.empty{filter:grayscale(1);opacity:.3}.round-stats{margin:20px 0}.round-stats p{color:var(--text-primary);margin:8px 0;font-size:.9rem}.round-actions{display:flex;flex-direction:column;gap:12px;margin-top:24px}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes pop-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes star-pop{0%{transform:scale(0) rotate(-180deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.session-summary{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:20px;text-align:center}.session-summary h1{color:var(--accent-primary);font-size:1.8rem;margin-bottom:32px;text-shadow:4px 4px 0 var(--accent-secondary)}.summary-stats{background:var(--bg-secondary);border:3px solid var(--accent-secondary);padding:24px 32px;margin-bottom:24px;box-shadow:6px 6px 0 var(--accent-secondary)}.stat-item{display:flex;justify-content:space-between;gap:32px;padding:8px 0;border-bottom:1px solid var(--accent-secondary)}.stat-item:last-child{border-bottom:none}.stat-label{color:var(--text-secondary);font-size:.8rem}.stat-value{color:var(--text-primary);font-size:.9rem}.stat-value.correct{color:var(--success)}.stat-value.wrong{color:var(--error)}.stars-summary{margin-bottom:32px}.stars-summary h3{color:var(--text-primary);font-size:.9rem;margin-bottom:12px}.stars-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:300px}.round-stars{display:flex;gap:2px}.mini-star{font-size:1rem}.mini-star.empty{filter:grayscale(1);opacity:.3}.total-stars{color:var(--star);font-size:1rem;margin-top:12px}.summary-actions{display:flex;flex-direction:column;gap:12px;width:100%;max-width:250px}.action-btn{padding:14px 24px;font-family:inherit;font-size:.9rem;cursor:pointer;border:3px solid;transition:all .1s}.action-btn.primary{background:var(--success);border-color:#16a34a;color:#000;box-shadow:4px 4px #16a34a}.action-btn.secondary{background:var(--bg-secondary);border-color:var(--accent-secondary);color:var(--text-primary);box-shadow:4px 4px 0 var(--accent-secondary)}.action-btn:hover{transform:translate(2px,2px);box-shadow:2px 2px}.action-btn:active{transform:translate(4px,4px);box-shadow:none}.settings-overlay{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:100}.settings-modal{background:var(--bg-primary);border:4px solid var(--accent-secondary);padding:24px 32px;max-width:350px;width:90%;box-shadow:8px 8px 0 var(--accent-secondary)}.settings-modal h2{text-align:center;color:var(--text-primary);margin:0 0 24px;font-size:1.2rem}.setting-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.setting-label{color:var(--text-primary);font-size:.9rem}.toggle-buttons{display:flex;gap:8px}.toggle-buttons button{background:var(--bg-secondary);border:2px solid var(--accent-secondary);color:var(--text-secondary);padding:8px 16px;font-family:inherit;font-size:.7rem;cursor:pointer;transition:all .1s}.toggle-buttons button.active{background:var(--accent-primary);border-color:var(--accent-primary);color:var(--text-primary)}.toggle-buttons button:hover:not(.active){background:var(--accent-secondary)}.close-btn{display:block;width:100%;margin-top:24px;background:var(--accent-secondary);border:3px solid #0a2540;color:var(--text-primary);padding:12px;font-family:inherit;font-size:.85rem;cursor:pointer;box-shadow:4px 4px #0a2540;transition:all .1s}.close-btn:hover{transform:translate(2px,2px);box-shadow:2px 2px #0a2540}.close-btn:active{transform:translate(4px,4px);box-shadow:none}.app{min-height:100vh}