:root{--primary-color: #4A90E2;--secondary-color: #7ED321;--accent-color: #F5A623;--danger-color: #FF5252;--success-color: #4CAF50;--warning-color: #FF9800;--text-dark: #333333;--text-light: #666666;--background-light: #FAFAFA;--border-light: #E0E0E0;--shadow-light: rgba(0, 0, 0, .1);--border-radius: 12px;--transition: all .3s ease}*{box-sizing:border-box}body{margin:0;padding:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;color:var(--text-dark)}.screen{max-width:600px;margin:0 auto;padding:2rem;background:#fff;min-height:100vh;box-shadow:0 0 30px #0000001a;position:relative;display:flex;flex-direction:column;align-items:center;text-align:center}h1,h2,h3{font-family:Space Grotesk,sans-serif;margin-bottom:1rem}h2{color:var(--primary-color);font-size:2.5rem;margin-bottom:1.5rem;display:flex;align-items:center;justify-content:center;gap:.5rem}.hero-banner{width:100%;background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));border-radius:20px;padding:2rem;margin-bottom:2rem;color:#fff;box-shadow:0 8px 32px #0000001a}.hero-content h1{font-size:3rem;margin:0;font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.1)}.hero-slogan{font-size:1.2rem;margin:.5rem 0 0;opacity:.9}.menu-grid-container{width:100%;max-width:500px}.menu-buttons{display:grid;grid-template-columns:1fr;gap:1rem;width:100%}.menu-buttons button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:1.2rem 1.5rem;border-radius:var(--border-radius);font-size:1.1rem;font-weight:600;cursor:pointer;transition:var(--transition);display:flex;align-items:center;justify-content:flex-start;gap:1rem;box-shadow:0 4px 16px #0000001a;min-height:60px}.menu-buttons button span{font-size:1.5rem;flex-shrink:0}.menu-buttons button:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 8px 24px #0003}.menu-buttons button:disabled{background:linear-gradient(135deg,#ccc,#999);cursor:not-allowed;opacity:.6}.menu-buttons button:disabled:hover{transform:none;box-shadow:0 4px 16px #0000001a}.back-home-button{background:var(--secondary-color);color:#fff;border:none;padding:.8rem 1.2rem;border-radius:25px;font-weight:600;cursor:pointer;transition:var(--transition);box-shadow:0 4px 12px #0000001a}.back-home-button:hover{transform:translateY(-2px);box-shadow:0 6px 16px #00000026}.game-question-display{font-size:2.5rem;font-weight:700;margin:1.5rem 0;padding:1.5rem;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border-radius:var(--border-radius);border:2px solid var(--border-light);box-shadow:0 4px 16px #0000000d;display:flex;align-items:center;justify-content:center;gap:.5rem;flex-wrap:wrap}.red-number{color:#e74c3c;background:#e74c3c1a;padding:.2rem .5rem;border-radius:8px}.blue-number{color:#3498db;background:#3498db1a;padding:.2rem .5rem;border-radius:8px}.total-number{color:#27ae60;background:#27ae601a;padding:.2rem .5rem;border-radius:8px}.removing-number{color:#e67e22;background:#e67e221a;padding:.2rem .5rem;border-radius:8px}.result-number{color:#9b59b6;background:#9b59b61a;padding:.2rem .5rem;border-radius:8px}.dividend-number{color:#e74c3c;background:#e74c3c1a;padding:.2rem .5rem;border-radius:8px}.divisor-number{color:#3498db;background:#3498db1a;padding:.2rem .5rem;border-radius:8px}.quotient-number{color:#27ae60;background:#27ae601a;padding:.2rem .5rem;border-radius:8px}.answer-options{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;width:100%;max-width:400px;margin:1.5rem 0}.answer-option{background:#fff;border:3px solid var(--border-light);padding:1.2rem;border-radius:var(--border-radius);font-size:1.3rem;font-weight:600;cursor:pointer;transition:var(--transition);display:flex;align-items:center;justify-content:center;gap:.5rem;min-height:70px;position:relative;box-shadow:0 4px 12px #0000000d}.answer-option:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 8px 20px #0000001a;border-color:var(--primary-color)}.answer-option.correct{background:linear-gradient(135deg,var(--success-color),#66bb6a);color:#fff;border-color:var(--success-color);animation:correctPulse .6s ease-out}.answer-option.wrong{background:linear-gradient(135deg,var(--danger-color),#ef5350);color:#fff;border-color:var(--danger-color);animation:wrongShake .6s ease-out}.answer-option:disabled{cursor:not-allowed;opacity:.6}.option-letter{background:#fff3;padding:.3rem .6rem;border-radius:50%;font-size:.9rem;font-weight:700}.option-value{flex:1}.correct-mark,.wrong-mark{font-size:1.2rem;animation:markAppear .3s ease-out}.attempts-indicator{margin:1rem 0;text-align:center}.attempts-indicator p{margin:.5rem 0;font-weight:600;color:var(--text-light)}.attempts-dots{display:flex;justify-content:center;gap:.5rem}.attempt-dot{font-size:1.5rem;transition:var(--transition)}.attempt-dot.active{color:var(--success-color)}.attempt-dot.used{color:var(--border-light)}.celebration-popup{position:fixed;top:0;left:0;right:0;bottom:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:1000;animation:celebrationFadeIn .3s ease-out}.celebration-content{background:#fff;padding:3rem;border-radius:20px;text-align:center;position:relative;box-shadow:0 20px 60px #0000004d;max-width:90vw;max-height:90vh;overflow:hidden}.celebration-main{font-size:2.5rem;font-weight:700;color:var(--success-color);margin-bottom:1rem;animation:celebrationBounce .8s ease-out}.celebration-sub{font-size:1.3rem;color:var(--text-light);animation:celebrationSlideUp .8s ease-out .2s both}.celebration-stars{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none}.celebration-star{position:absolute;font-size:2rem;animation:starFloat 2s ease-in-out infinite}.celebration-confetti{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none}.confetti{position:absolute;font-size:1.5rem;animation:confettiFall 2s ease-out infinite}.visual-addition-container{width:100%;max-width:500px;margin:1rem 0;padding:1.5rem;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border-radius:var(--border-radius);box-shadow:0 4px 16px #0000000d}.animation-area{display:flex;align-items:center;justify-content:center;gap:1.5rem;flex-wrap:wrap;min-height:150px}.block-group{display:flex;flex-direction:column;align-items:center;gap:.8rem;transition:var(--transition)}.block-group.combining{transform:scale(.8);opacity:.7}.group-label{font-size:1.2rem;font-weight:700;padding:.4rem .8rem;border-radius:20px;color:#fff;min-width:40px;text-align:center}.red-label{background:#e74c3c}.blue-label{background:#3498db}.combined-label{background:#27ae60}.blocks-container{display:flex;flex-wrap:wrap;gap:.3rem;justify-content:center;max-width:120px}.visual-block{width:20px;height:20px;border-radius:4px;animation:blockAppear .5s ease-out both}.red-block{background:#e74c3c;box-shadow:0 2px 4px #e74c3c4d}.blue-block{background:#3498db;box-shadow:0 2px 4px #3498db4d}.plus-sign{font-size:2rem;font-weight:700;color:var(--text-dark);transition:var(--transition)}.plus-sign.fade-out{opacity:0;transform:scale(.5)}.combined-blocks-grid{display:grid;grid-template-columns:repeat(var(--grid-cols),1fr);gap:.3rem;justify-content:center;max-width:200px}.visual-subtraction-container{width:100%;max-width:500px;margin:1rem 0;padding:1.5rem;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border-radius:var(--border-radius);box-shadow:0 4px 16px #0000000d}.subtraction-animation-area{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.instruction-text{text-align:center;font-size:1.1rem;font-weight:600;color:var(--text-dark);min-height:2rem}.highlight-number{color:var(--primary-color);background:#4a90e21a;padding:.2rem .5rem;border-radius:6px;font-weight:700}.subtraction-blocks-grid{display:grid;grid-template-columns:repeat(var(--grid-cols),1fr);gap:.4rem;justify-content:center;max-width:300px}.subtraction-block{width:25px;height:25px;border-radius:6px;background:#3498db;box-shadow:0 2px 4px #3498db4d;transition:var(--transition);display:flex;align-items:center;justify-content:center;position:relative}.subtraction-block.initial{animation:blockAppear .5s ease-out both}.subtraction-block.removing{animation:blockRemove .8s ease-out both}.subtraction-block.removed{background:#e74c3c;opacity:.3;transform:scale(.8)}.subtraction-block.remaining{background:#27ae60;animation:blockHighlight .5s ease-out}.removal-mark{color:#fff;font-size:.8rem;font-weight:700}.count-display{display:flex;flex-direction:column;align-items:center;gap:.8rem;margin-top:1rem}.count-breakdown{display:flex;gap:1.5rem;flex-wrap:wrap;justify-content:center}.count-item{display:flex;flex-direction:column;align-items:center;gap:.3rem}.count-label{font-size:.9rem;color:var(--text-light);font-weight:500}.count-number{font-size:1.3rem;font-weight:700;padding:.3rem .6rem;border-radius:8px}.count-number.total{background:#3498db1a;color:#3498db}.count-number.removing{background:#e67e221a;color:#e67e22}.count-number.removed{background:#e74c3c1a;color:#e74c3c}.count-number.remaining{background:#27ae601a;color:#27ae60}.final-count{border:2px solid var(--primary-color);border-radius:8px;padding:.5rem}.visual-multiplication-container{width:100%;max-width:600px;margin:1rem 0;padding:1.5rem;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border-radius:var(--border-radius);box-shadow:0 4px 16px #0000000d}.multiplication-animation-area{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.multiplication-groups{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center}.multiplication-group{display:flex;flex-direction:column;align-items:center;gap:.8rem;padding:1rem;background:#fff;border-radius:var(--border-radius);box-shadow:0 2px 8px #0000000d;transition:var(--transition)}.multiplication-group.grouping{transform:scale(1.05);box-shadow:0 4px 16px #0000001a}.group-blocks{display:flex;flex-wrap:wrap;gap:.3rem;justify-content:center;max-width:80px}.multiplication-block{width:18px;height:18px;border-radius:4px;transition:var(--transition)}.multiplication-block.initial{animation:blockAppear .5s ease-out both}.multiplication-block.grouped{animation:blockGroup .8s ease-out both}.multiplication-block.combining{animation:blockCombine 1s ease-out both}.group-count{font-size:.9rem;color:var(--text-light);font-weight:500}.combining-display{display:flex;flex-direction:column;align-items:center;gap:1.5rem;width:100%}.combining-text{font-size:1.5rem;font-weight:700;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;justify-content:center}.combining-animation{width:100%;display:flex;justify-content:center}.combining-blocks{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center}.combining-group{display:flex;gap:.2rem;flex-wrap:wrap}.multiplication-block.moving{animation:blockMove 1.5s ease-out both}.final-result{display:flex;flex-direction:column;align-items:center;gap:1.5rem;width:100%}.final-blocks-grid{display:grid;grid-template-columns:repeat(var(--grid-cols),1fr);gap:.3rem;justify-content:center;max-width:300px}.combined-block{width:20px;height:20px;border-radius:4px;animation:blockAppear .5s ease-out both}.red-combined{background:#e74c3c;box-shadow:0 2px 4px #e74c3c4d}.blue-combined{background:#3498db;box-shadow:0 2px 4px #3498db4d}.count-breakdown{display:flex;gap:1.5rem;flex-wrap:wrap;justify-content:center;align-items:center}.count-number.groups{background:#e74c3c1a;color:#e74c3c}.count-number.per-group{background:#3498db1a;color:#3498db}.count-number.total-result{background:#27ae601a;color:#27ae60}.visual-division-container{width:100%;max-width:600px;margin:1rem 0;padding:1.5rem;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border-radius:var(--border-radius);box-shadow:0 4px 16px #0000000d}.division-animation-area{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.initial-blocks-section{display:flex;flex-direction:column;align-items:center;gap:1rem}.blocks-pool-label{font-size:1.1rem;font-weight:600;color:var(--text-dark)}.initial-blocks-grid{display:grid;grid-template-columns:repeat(var(--grid-cols),1fr);gap:.3rem;justify-content:center;max-width:300px}.division-block{width:20px;height:20px;border-radius:4px;background:#3498db;box-shadow:0 2px 4px #3498db4d;transition:var(--transition)}.initial-block{animation:blockAppear .5s ease-out both}.group-block{animation:blockDistribute .5s ease-out both}.division-groups{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center;width:100%}.division-group-box{background:#fff;border:2px dashed var(--border-light);border-radius:var(--border-radius);padding:1rem;min-width:100px;min-height:120px;display:flex;flex-direction:column;align-items:center;gap:.8rem;transition:var(--transition)}.division-group-box:hover{border-color:var(--primary-color);background:#4a90e20d}.group-blocks-container{display:flex;flex-wrap:wrap;gap:.3rem;justify-content:center;flex:1;align-items:flex-start;max-width:80px}.visual-sequence-container{width:100%;max-width:600px;margin:1rem 0;padding:1.5rem;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border-radius:var(--border-radius);box-shadow:0 4px 16px #0000000d}.sequence-animation-area{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.sequence-display{width:100%;display:flex;justify-content:center}.sequence-tiles{display:flex;gap:.8rem;flex-wrap:wrap;justify-content:center}.sequence-tile{width:60px;height:60px;border-radius:var(--border-radius);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;transition:var(--transition);opacity:0;transform:translateY(20px)}.sequence-tile.visible{opacity:1;transform:translateY(0)}.number-tile{background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:#fff;box-shadow:0 4px 12px #0000001a}.missing-tile{background:#fff;border:3px dashed var(--accent-color);color:var(--accent-color)}.missing-tile.correct-reveal{background:linear-gradient(135deg,var(--success-color),#66bb6a);color:#fff;border-color:var(--success-color);animation:correctReveal .8s ease-out}.tile-content{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.tile-number{font-size:1.5rem;font-weight:700}.tile-question{font-size:2rem;font-weight:700}.missing-indicator{position:absolute;bottom:-40px;display:flex;flex-direction:column;align-items:center;gap:.2rem}.missing-arrow{font-size:1.2rem;color:var(--accent-color);animation:bounce 1s infinite}.missing-text{font-size:.8rem;color:var(--accent-color);font-weight:700}.pattern-hint{background:#f5a6231a;border:1px solid var(--accent-color);border-radius:var(--border-radius);padding:1rem;text-align:center;max-width:400px}.pattern-hint p{margin:0;color:var(--text-dark);font-size:.9rem}.visual-odd-even-container{width:100%;max-width:600px;margin:1rem 0;padding:1.5rem;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border-radius:var(--border-radius);box-shadow:0 4px 16px #0000000d}.odd-even-animation-area{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.odd-even-options-wrapper{display:flex;gap:2rem;flex-wrap:wrap;justify-content:center;width:100%;opacity:0;transform:translateY(20px);transition:var(--transition)}.odd-even-options-wrapper.showing{opacity:1;transform:translateY(0)}.odd-even-number-option{background:#fff;border:3px solid var(--border-light);border-radius:var(--border-radius);padding:1.5rem;cursor:pointer;transition:var(--transition);display:flex;flex-direction:column;align-items:center;gap:1rem;min-width:150px;min-height:200px;position:relative;box-shadow:0 4px 16px #0000000d}.odd-even-number-option:hover:not(.disabled){transform:translateY(-5px);box-shadow:0 8px 24px #00000026;border-color:var(--primary-color)}.odd-even-number-option.wrong{background:linear-gradient(135deg,var(--danger-color),#ef5350);color:#fff;border-color:var(--danger-color);animation:wrongShake .6s ease-out}.odd-even-number-option.disabled{cursor:not-allowed;opacity:.6}.odd-even-number-display{font-size:3rem;font-weight:700;color:var(--primary-color);text-shadow:0 2px 4px rgba(0,0,0,.1)}.odd-even-number-option.wrong .odd-even-number-display{color:#fff}.odd-even-blocks-grid{display:grid;grid-template-columns:repeat(var(--grid-cols),1fr);gap:.4rem;justify-content:center;align-items:center;flex:1}.odd-even-block{width:20px;height:20px;border-radius:6px;animation:blockAppear .5s ease-out both;box-shadow:0 2px 4px #0003}.odd-even-block.option1{background:#e74c3c;box-shadow:0 2px 4px #e74c3c4d}.odd-even-block.option2{background:#3498db;box-shadow:0 2px 4px #3498db4d}.odd-block-leftover{border:2px solid #f39c12;background:#f39c12!important;animation:leftoverPulse 1s ease-in-out infinite}.odd-even-number-option .wrong-mark{position:absolute;top:10px;right:10px;font-size:1.5rem;animation:markAppear .3s ease-out}.odd-even-hint{background:#f5a6231a;border:1px solid var(--accent-color);border-radius:var(--border-radius);padding:1rem;text-align:center;max-width:500px}.odd-even-hint p{margin:0;color:var(--text-dark);font-size:.9rem;line-height:1.4}.visual-comparison-container{width:100%;max-width:700px;margin:1rem 0;padding:1.5rem;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border-radius:var(--border-radius);box-shadow:0 4px 16px #0000000d}.comparison-animation-area{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.comparison-statement{background:#fff;padding:1.5rem;border-radius:var(--border-radius);box-shadow:0 4px 12px #0000000d;text-align:center;opacity:0;transform:translateY(20px);transition:var(--transition)}.comparison-statement.showing{opacity:1;transform:translateY(0)}.comparison-expression{font-size:3rem;font-weight:700;display:flex;align-items:center;justify-content:center;gap:1rem;margin-bottom:.5rem;flex-wrap:wrap}.comparison-number{padding:.3rem .8rem;border-radius:12px;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.2)}.comparison-number.left{background:linear-gradient(135deg,#e74c3c,#c0392b)}.comparison-number.right{background:linear-gradient(135deg,#3498db,#2980b9)}.comparison-operator{font-size:4rem;color:var(--primary-color);font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.1)}.operator-explanation{font-size:1.1rem;color:var(--text-light);font-style:italic}.comparison-visual{display:flex;align-items:center;justify-content:center;gap:2rem;flex-wrap:wrap;opacity:0;transform:translateY(20px);transition:var(--transition)}.comparison-visual.showing{opacity:1;transform:translateY(0)}.number-visual-group{display:flex;flex-direction:column;align-items:center;gap:1rem;background:#fff;padding:1.5rem;border-radius:var(--border-radius);box-shadow:0 4px 12px #0000000d;min-width:150px}.number-label{font-size:2rem;font-weight:700;padding:.5rem 1rem;border-radius:12px;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.2)}.left-label{background:linear-gradient(135deg,#e74c3c,#c0392b)}.right-label{background:linear-gradient(135deg,#3498db,#2980b9)}.comparison-blocks-grid{display:grid;grid-template-columns:repeat(var(--grid-cols),1fr);gap:.4rem;justify-content:center;max-width:200px}.comparison-block{width:22px;height:22px;border-radius:6px;animation:blockAppear .5s ease-out both;box-shadow:0 2px 4px #0003}.comparison-block.left-number{background:#e74c3c;box-shadow:0 2px 4px #e74c3c4d}.comparison-block.right-number{background:#3498db;box-shadow:0 2px 4px #3498db4d}.comparison-operator-visual{display:flex;align-items:center;justify-content:center;background:#fff;padding:1rem;border-radius:50%;box-shadow:0 4px 12px #0000001a;min-width:80px;min-height:80px}.operator-symbol{font-size:3rem;color:var(--primary-color);font-weight:700}.comparison-options-wrapper{display:flex;gap:2rem;flex-wrap:wrap;justify-content:center;width:100%;opacity:0;transform:translateY(20px);transition:var(--transition)}.comparison-options-wrapper.showing{opacity:1;transform:translateY(0)}.comparison-answer-option{background:#fff;border:3px solid var(--border-light);border-radius:var(--border-radius);padding:2rem 1.5rem;cursor:pointer;transition:var(--transition);display:flex;flex-direction:column;align-items:center;gap:1rem;min-width:150px;min-height:120px;position:relative;box-shadow:0 4px 16px #0000000d}.comparison-answer-option:hover:not(.disabled){transform:translateY(-5px);box-shadow:0 8px 24px #00000026;border-color:var(--primary-color)}.comparison-answer-option.wrong{background:linear-gradient(135deg,var(--danger-color),#ef5350);color:#fff;border-color:var(--danger-color);animation:wrongShake .6s ease-out}.comparison-answer-option.disabled{cursor:not-allowed;opacity:.6}.answer-text{font-size:1.8rem;font-weight:700;color:var(--primary-color)}.comparison-answer-option.wrong .answer-text{color:#fff}.answer-icon{font-size:2.5rem;opacity:.7}.comparison-answer-option .wrong-mark{position:absolute;top:10px;right:10px;font-size:1.5rem;animation:markAppear .3s ease-out}.comparison-hint{background:#f5a6231a;border:1px solid var(--accent-color);border-radius:var(--border-radius);padding:1rem;text-align:center;max-width:600px}.comparison-hint p{margin:0;color:var(--text-dark);font-size:.9rem;line-height:1.4}.visual-place-value-container{width:100%;max-width:700px;margin:1rem 0;padding:1.5rem;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border-radius:var(--border-radius);box-shadow:0 4px 16px #0000000d}.place-value-animation-area{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.place-value-number-display{background:#fff;padding:2rem;border-radius:var(--border-radius);box-shadow:0 4px 12px #0000000d;opacity:0;transform:translateY(20px);transition:var(--transition)}.place-value-number-display.showing{opacity:1;transform:translateY(0)}.number-container{display:flex;gap:.2rem;justify-content:center;align-items:baseline;flex-wrap:wrap}.place-value-digit{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:.5rem .8rem;border-radius:var(--border-radius);transition:var(--transition);min-width:50px;min-height:60px;position:relative;box-shadow:0 4px 12px #0000000d}.place-value-digit.target-digit{animation:targetPulse 2s ease-in-out infinite;z-index:10}.digit-value{font-size:2.5rem;font-weight:700;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.2)}.place-value-digit.ten-thousands{background:linear-gradient(135deg,#9b59b6,#8e44ad)}.place-value-digit.thousands{background:linear-gradient(135deg,#e74c3c,#c0392b)}.place-value-digit.hundreds{background:linear-gradient(135deg,#f39c12,#e67e22)}.place-value-digit.tens{background:linear-gradient(135deg,#27ae60,#229954)}.place-value-digit.ones{background:linear-gradient(135deg,#3498db,#2980b9)}.place-value-options-wrapper{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;width:100%;max-width:400px;opacity:0;transform:translateY(20px);transition:var(--transition)}.place-value-options-wrapper.showing{opacity:1;transform:translateY(0)}.place-value-answer-option{background:#fff;border:3px solid var(--border-light);border-radius:var(--border-radius);padding:1.2rem;cursor:pointer;transition:var(--transition);display:flex;align-items:center;justify-content:center;gap:.5rem;min-height:70px;position:relative;box-shadow:0 4px 12px #0000000d;font-size:1.3rem;font-weight:600}.place-value-answer-option:hover:not(.disabled){transform:translateY(-3px);box-shadow:0 8px 20px #0000001a;border-color:var(--primary-color)}.place-value-answer-option.wrong{background:linear-gradient(135deg,var(--danger-color),#ef5350);color:#fff;border-color:var(--danger-color);animation:wrongShake .6s ease-out}.place-value-answer-option.disabled{cursor:not-allowed;opacity:.6}.place-value-answer-option .wrong-mark{position:absolute;top:10px;right:10px;font-size:1.2rem;animation:markAppear .3s ease-out}.place-value-hint{background:#f5a6231a;border:1px solid var(--accent-color);border-radius:var(--border-radius);padding:1rem;text-align:center;max-width:600px}.place-value-hint p{margin:0;color:var(--text-dark);font-size:.9rem;line-height:1.4}.visual-time-teller-container{width:100%;max-width:600px;margin:1rem 0;padding:1.5rem;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border-radius:var(--border-radius);box-shadow:0 4px 16px #0000000d}.time-teller-animation-area{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.clock-display{opacity:0;transform:translateY(20px);transition:var(--transition)}.clock-display.showing{opacity:1;transform:translateY(0)}.clock-face{position:relative;width:200px;height:200px;border:8px solid var(--primary-color);border-radius:50%;background:#fff;box-shadow:0 8px 24px #0000001a;margin:0 auto}.clock-markers{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.clock-number{position:absolute;font-size:1.2rem;font-weight:700;color:var(--text-dark);text-shadow:0 1px 2px rgba(0,0,0,.1)}.clock-hands{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%}.hand{position:absolute;background:var(--text-dark);transform-origin:bottom center;border-radius:2px;box-shadow:0 2px 4px #0003}.hour-hand{width:4px;height:50px;top:50px;left:calc(50% - 2px);background:var(--primary-color)}.minute-hand{width:3px;height:70px;top:30px;left:calc(50% - 1.5px);background:var(--danger-color)}.center-dot{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:12px;height:12px;background:var(--text-dark);border-radius:50%;z-index:10;box-shadow:0 2px 4px #0003}.time-teller-hint{background:#f5a6231a;border:1px solid var(--accent-color);border-radius:var(--border-radius);padding:1rem;text-align:center;max-width:500px}.time-teller-hint p{margin:0;color:var(--text-dark);font-size:.9rem;line-height:1.4}@keyframes blockAppear{0%{opacity:0;transform:scale(0) rotate(180deg)}to{opacity:1;transform:scale(1) rotate(0)}}@keyframes blockRemove{0%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.2) rotate(10deg)}to{opacity:.3;transform:scale(.8) rotate(-5deg)}}@keyframes blockHighlight{0%{transform:scale(1);box-shadow:0 2px 4px #27ae604d}50%{transform:scale(1.1);box-shadow:0 4px 16px #27ae6099}to{transform:scale(1);box-shadow:0 2px 4px #27ae604d}}@keyframes blockGroup{0%{opacity:0;transform:scale(.5) rotate(90deg)}to{opacity:1;transform:scale(1) rotate(0)}}@keyframes blockCombine{0%{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(.8) rotate(180deg)}to{opacity:1;transform:scale(1) rotate(360deg)}}@keyframes blockMove{0%{opacity:1;transform:translateY(0) scale(1)}50%{opacity:.7;transform:translateY(-20px) scale(.8)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes blockDistribute{0%{opacity:0;transform:scale(0) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes leftoverPulse{0%,to{transform:scale(1);box-shadow:0 2px 4px #f39c124d}50%{transform:scale(1.1);box-shadow:0 4px 12px #f39c1299}}@keyframes targetPulse{0%,to{box-shadow:0 4px 12px #0000000d,0 0 #4a90e2b3}50%{box-shadow:0 8px 24px #00000026,0 0 0 10px #4a90e200}}@keyframes correctPulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}@keyframes wrongShake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}@keyframes markAppear{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes celebrationFadeIn{0%{opacity:0}to{opacity:1}}@keyframes celebrationBounce{0%{opacity:0;transform:scale(.3) translateY(50px)}50%{opacity:1;transform:scale(1.1) translateY(-10px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes celebrationSlideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes starFloat{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-20px) rotate(180deg)}}@keyframes confettiFall{0%{opacity:1;transform:translateY(-100px) rotate(0)}to{opacity:0;transform:translateY(100px) rotate(360deg)}}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-10px)}60%{transform:translateY(-5px)}}@keyframes correctReveal{0%{transform:scale(1);box-shadow:0 4px 12px #0000001a}50%{transform:scale(1.1);box-shadow:0 8px 24px #4caf5066}to{transform:scale(1);box-shadow:0 4px 12px #0000001a}}@media (max-width: 768px){.screen{padding:1rem}h2{font-size:2rem}.hero-content h1{font-size:2.5rem}.game-question-display{font-size:2rem;padding:1rem}.answer-options{grid-template-columns:1fr;max-width:300px}.answer-option{font-size:1.1rem;padding:1rem}.visual-addition-container,.visual-subtraction-container,.visual-multiplication-container,.visual-division-container,.visual-sequence-container,.visual-odd-even-container,.visual-comparison-container,.visual-place-value-container,.visual-time-teller-container{padding:1rem}.animation-area{gap:1rem}.sequence-tiles{gap:.5rem}.sequence-tile{width:50px;height:50px}.tile-number{font-size:1.2rem}.tile-question{font-size:1.5rem}.multiplication-groups,.division-groups{gap:.5rem}.division-group-box{min-width:80px;min-height:100px;padding:.8rem}.odd-even-options-wrapper{gap:1rem}.odd-even-number-option{min-width:120px;min-height:180px;padding:1rem}.odd-even-number-display{font-size:2.5rem}.comparison-visual{gap:1rem}.comparison-expression{font-size:2.5rem;gap:.5rem}.comparison-operator{font-size:3rem}.comparison-options-wrapper{gap:1rem}.comparison-answer-option{min-width:120px;min-height:100px;padding:1.5rem 1rem}.answer-text{font-size:1.5rem}.answer-icon{font-size:2rem}.number-container{gap:.1rem}.place-value-digit{min-width:40px;min-height:50px;padding:.4rem .6rem}.digit-value{font-size:2rem}.place-value-options-wrapper{grid-template-columns:1fr;max-width:300px}.clock-face{width:180px;height:180px}.clock-number{font-size:1rem}.hour-hand{height:45px;top:45px}.minute-hand{height:63px;top:27px}}@media (max-width: 480px){.screen{padding:.5rem}.hero-content h1{font-size:2rem}.game-question-display{font-size:1.5rem;padding:.8rem}.celebration-content{padding:2rem}.celebration-main{font-size:2rem}.celebration-sub{font-size:1.1rem}.odd-even-options-wrapper{flex-direction:column;align-items:center}.odd-even-number-option{min-width:100px;min-height:160px}.odd-even-number-display{font-size:2rem}.comparison-visual{flex-direction:column;gap:1rem}.comparison-expression{font-size:2rem;flex-direction:column;gap:.5rem}.comparison-operator{font-size:2.5rem}.comparison-options-wrapper{flex-direction:column;align-items:center}.comparison-answer-option{min-width:100px;min-height:90px}.answer-text{font-size:1.3rem}.answer-icon{font-size:1.8rem}.number-container{gap:.1rem}.place-value-digit{min-width:35px;min-height:45px;padding:.3rem .5rem}.digit-value{font-size:1.8rem}.clock-face{width:160px;height:160px}.clock-number{font-size:.9rem}.hour-hand{height:40px;top:40px}.minute-hand{height:56px;top:24px}}:root{--primary-color: #4A90E2;--secondary-color: #7ED321;--accent-color: #F5A623;--text-dark: #333333;--text-light: #666666;--background-light: #FAFAFA;--border-light: #E0E0E0;--shadow-light: rgba(0, 0, 0, .1);--success-color: #4CAF50}.homepage-container{max-width:1200px;margin:0 auto;padding:2rem;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6;color:var(--text-dark);background-color:#fff;min-height:100vh;position:relative}.bolt-badge-container{position:absolute;top:15px;right:15px;z-index:100}.bolt-badge-link{display:inline-block;transition:transform .3s ease,opacity .3s ease;opacity:.7}.bolt-badge-link:hover{transform:scale(1.05);opacity:1}.bolt-badge-image{width:80px;height:auto;border-radius:6px;box-shadow:0 2px 8px #0000001a;transition:box-shadow .3s ease}.bolt-badge-link:hover .bolt-badge-image{box-shadow:0 4px 16px #0003}.hero-section{text-align:center;margin-bottom:4rem;padding:3rem 2rem;background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));border-radius:20px;color:#fff;box-shadow:0 8px 32px var(--shadow-light)}.hero-content h1{margin:0 0 1.5rem;font-family:Space Grotesk,sans-serif;text-shadow:0 2px 4px rgba(0,0,0,.1);line-height:1.3;display:flex;flex-direction:column;align-items:center;gap:.5rem}.title-main{font-size:3.5rem;font-weight:700;display:block}.title-subtitle{font-size:2rem;font-weight:400;opacity:.9;display:block}.hero-description{font-size:1.3rem;margin:0 0 2rem;opacity:.95;max-width:600px;margin-left:auto;margin-right:auto}.hero-buttons{display:flex;gap:1.5rem;justify-content:center;flex-wrap:wrap}.hero-button{padding:1rem 2rem;border-radius:50px;font-size:1.1rem;font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:.5rem;transition:transform .3s ease,box-shadow .3s ease;border:none;cursor:pointer}.hero-button.primary{background:#fff3;color:#fff;border:2px solid rgba(255,255,255,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.hero-button.secondary{background:#fff;color:var(--primary-color);border:2px solid white}.hero-button:hover{transform:translateY(-3px);box-shadow:0 8px 24px #0003}.why-section,.tech-section,.levels-section,.audience-section,.action-section,.developer-section,.roadmap-section{margin-bottom:3rem;padding:2.5rem;background:var(--background-light);border-radius:16px;border:1px solid var(--border-light);box-shadow:0 4px 16px var(--shadow-light)}.why-section h2,.tech-section h2,.levels-section h2,.audience-section h2,.action-section h2,.developer-section h2,.roadmap-section h2{color:var(--primary-color);font-size:2.2rem;margin-bottom:1.5rem;font-family:Space Grotesk,sans-serif;font-weight:600;border-bottom:3px solid var(--secondary-color);padding-bottom:.5rem}.why-section p,.tech-section p,.levels-section p,.audience-section p,.action-section p,.developer-section p,.roadmap-section p{font-size:1.1rem;margin-bottom:1rem;color:var(--text-light)}.tech-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem;margin:1.5rem 0}.tech-item{background:#fff;padding:1rem 1.5rem;border-radius:12px;font-weight:500;box-shadow:0 2px 8px #0000000d;border-left:4px solid var(--accent-color)}.tech-note{text-align:center;font-weight:600;color:var(--primary-color);background:#fff;padding:1rem;border-radius:12px;margin-top:1rem}.levels-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:1rem;margin:2rem 0}.level-item{background:#fff;padding:1.5rem;border-radius:12px;display:flex;align-items:center;gap:1rem;box-shadow:0 2px 8px #0000000d;border:1px solid var(--border-light);transition:transform .3s ease,box-shadow .3s ease}.level-item:hover{transform:translateY(-2px);box-shadow:0 4px 16px #0000001a}.level-item.completed{border-left:4px solid var(--success-color)}.level-number{font-weight:700;color:var(--text-light);min-width:20px}.level-icon{font-size:1.5rem;min-width:30px;text-align:center}.level-content{flex:1;color:var(--text-dark)}.level-status{font-size:1.2rem}.coming-soon{background:#fff;padding:1.5rem;border-radius:12px;margin-top:2rem;border:2px dashed var(--accent-color)}.coming-soon h3{margin:0 0 1rem;color:var(--accent-color);font-size:1.3rem}.future-levels{display:flex;flex-wrap:wrap;gap:.8rem}.future-levels span{background:#f5a6231a;color:var(--accent-color);padding:.5rem 1rem;border-radius:20px;font-size:.9rem;font-weight:500}.audience-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;margin:2rem 0}.audience-item{background:#fff;padding:1.5rem;border-radius:12px;display:flex;align-items:center;gap:1rem;box-shadow:0 2px 8px #0000000d;border-left:4px solid var(--secondary-color)}.audience-icon{font-size:2rem;min-width:40px}.audience-note{text-align:center;font-weight:600;color:var(--primary-color);background:#fff;padding:1rem;border-radius:12px;margin-top:1rem;font-size:1.2rem}.action-item{background:#fff;padding:2rem;border-radius:12px;margin-bottom:2rem;box-shadow:0 2px 8px #0000000d}.action-item h3{margin:0 0 1rem;color:var(--primary-color);font-size:1.4rem}.action-button{background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:#fff;border:none;padding:1rem 2rem;border-radius:25px;font-weight:600;font-size:1.1rem;cursor:pointer;transition:transform .3s ease,box-shadow .3s ease}.action-button:hover{transform:translateY(-2px);box-shadow:0 4px 16px #0003}.share-link{background:var(--background-light);padding:1rem;border-radius:8px;font-family:Courier New,monospace;font-weight:700;color:var(--primary-color);border:1px solid var(--border-light)}.contact-link{color:var(--primary-color);text-decoration:none;font-weight:600;border-bottom:2px solid transparent;transition:border-bottom-color .3s ease}.contact-link:hover{border-bottom-color:var(--primary-color)}.action-item ul{margin:1rem 0;padding-left:1.5rem}.action-item li{margin-bottom:.5rem;color:var(--text-light)}.developer-content{display:flex;gap:2rem;align-items:flex-start}.developer-text{flex:2}.developer-links{flex:1;display:flex;flex-direction:column;gap:1rem}.developer-details{background:#fff;padding:1rem;border-radius:8px;margin:1rem 0;border-left:4px solid var(--accent-color)}.dev-link{color:var(--primary-color);text-decoration:none;font-weight:500;padding:.8rem 1rem;background:#fff;border-radius:8px;border:1px solid var(--border-light);transition:transform .3s ease,box-shadow .3s ease}.dev-link:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.roadmap-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem;margin:2rem 0}.roadmap-item{background:#fff;padding:1rem 1.5rem;border-radius:12px;font-weight:500;box-shadow:0 2px 8px #0000000d;border-left:4px solid var(--accent-color)}.roadmap-note{text-align:center;font-weight:600;color:var(--primary-color);background:#fff;padding:1rem;border-radius:12px;margin-top:1rem}.homepage-footer{text-align:center;padding:2rem 0;margin-top:3rem;border-top:1px solid var(--border-light);color:var(--text-light);font-size:1rem}@media (max-width: 768px){.homepage-container{padding:1rem}.bolt-badge-container{top:10px;right:10px}.bolt-badge-image{width:60px}.title-main{font-size:2.5rem}.title-subtitle{font-size:1.5rem}.hero-description{font-size:1.1rem}.hero-buttons{flex-direction:column;align-items:center}.levels-grid,.audience-grid,.tech-list,.roadmap-grid{grid-template-columns:1fr}.developer-content{flex-direction:column}.developer-links{flex-direction:row;flex-wrap:wrap}.why-section,.tech-section,.levels-section,.audience-section,.action-section,.developer-section,.roadmap-section{padding:1.5rem}}@media (max-width: 480px){.bolt-badge-container{top:5px;right:5px}.bolt-badge-image{width:50px}.title-main{font-size:2rem}.title-subtitle{font-size:1.3rem}.hero-section{padding:2rem 1rem}.level-item{flex-direction:column;text-align:center;gap:.5rem}.audience-item{flex-direction:column;text-align:center}.developer-links{flex-direction:column}}
