*{margin:0;padding:0;box-sizing:border-box}:root{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh}#root{width:100%;height:100%}.app{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:80px 20px 20px;background:linear-gradient(135deg,#667eea,#764ba2);position:relative}.tab-navigation{position:fixed;top:max(30px,env(safe-area-inset-top));left:50%;transform:translate(-50%);display:flex;align-items:center;gap:8px;z-index:1000;background:#fff;padding:8px;border-radius:15px;box-shadow:0 4px 15px #0003}.current-tab-btn{cursor:pointer}.tab-arrow-btn{width:42px;height:42px;border:none;border-radius:10px;background:#f0f0f0;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.tab-arrow-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0003}.tab-arrow-btn:active{transform:translateY(0)}.tab-arrow{display:inline-block;font-size:1.4em;font-weight:700;color:#333;line-height:1}.tab-list{display:flex;gap:8px;max-width:0;opacity:0;overflow:hidden;pointer-events:none;transform:translate(-8px);transition:max-width .25s ease,opacity .2s ease,transform .25s ease}.tab-list.open{max-width:320px;opacity:1;pointer-events:auto;transform:translate(0)}.tab-btn{width:50px;height:50px;font-size:1.8em;border:none;border-radius:12px;cursor:pointer;background:#f0f0f0;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.tab-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0003}.tab-btn:active{transform:translateY(0)}.tab-btn.active{transform:scale(1.1);background-color:#c9f9ba}.number-badge{color:red;font-weight:700;font-size:.8em;padding:2px 4px;display:inline-block}.digital-calculator-icon{width:22px;height:24px;border-radius:5px;background:#3a3f52;border:2px solid #2a2e3e;display:flex;flex-direction:column;align-items:center;padding:2px;box-sizing:border-box}.digital-display{width:100%;height:6px;border-radius:2px;background:#b8f5c8;margin-bottom:3px}.digital-keys{width:100%;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);gap:2px;flex:1}.digital-keys span{border-radius:2px;background:#d7dbe8}.squares-icon{display:grid;grid-template-columns:repeat(2,10px);grid-template-rows:repeat(2,10px);gap:2px}.square-icon{width:10px;height:10px;border-radius:2px}.square-red{background:linear-gradient(135deg,#ff5252,#d32f2f)}.square-yellow{background:#fce625}.square-green{background:linear-gradient(135deg,#66bb6a,#2e7d32)}.square-blue{background:linear-gradient(135deg,#00e5ff,#00b8d4)}.addition-practice-icon{display:flex;align-items:baseline;justify-content:center;gap:2px;font-weight:700;line-height:1}.addition-practice-plus{color:#ff5252;font-size:.85em}.addition-practice-q{color:#3949ab;font-size:.72em}.numbers-icon{display:flex;align-items:center;justify-content:center;font-weight:700}.number-1{color:#ff5252;font-size:.8em}.letter-a{color:#66bb6a;font-size:.8em}.practice-icon{font-weight:700;font-size:.9em;color:#ff5252}.falling-object{position:absolute;top:-10%;font-size:2.5em;pointer-events:none;z-index:0;animation-name:fall;animation-timing-function:linear;animation-iteration-count:infinite}.app-spring{background:linear-gradient(to bottom,#87ceeb,#98d8c8,#c3ffc3)}.app-spring .falling-object{opacity:.15}.app-summer{background:linear-gradient(to bottom,#4da2f8,#87ceeb 40%,#fff2a6)}.app-summer .falling-object{opacity:.2;font-size:3em}.app-autumn{background:linear-gradient(to bottom,peru,#deb887 30%,#dd8647)}.app-autumn .falling-object{opacity:.25}.app-winter{background:linear-gradient(to bottom,#7a8ba3,#e0e8f0 70%,#fff)}.app-winter .falling-object{opacity:.2}@keyframes fall{0%{transform:translateY(0)}to{transform:translateY(110vh)}}.number-reader.container{background:#fff;border-radius:20px;padding:30px;box-shadow:0 20px 60px #0000004d;max-width:400px;width:100%;margin:0 auto;position:relative;z-index:1}.number-reader h1{text-align:center;color:#333;margin-bottom:30px;font-size:2em}.number-reader .display-container{margin-bottom:25px}.number-reader .number-display{background:#c9f9ba;color:#333;padding:25px;border-radius:15px;font-size:2.5em;text-align:right;font-weight:700;margin-bottom:10px;min-height:80px;display:flex;align-items:center;justify-content:flex-end;word-wrap:break-word;overflow-wrap:break-word;cursor:pointer;transition:all .2s ease;-webkit-user-select:none;user-select:none;position:relative}.number-reader .text-toggle-icon{position:absolute;top:8px;left:12px;font-size:.5em;opacity:.5;font-weight:400;transition:opacity .2s ease}.number-reader .number-display:hover .text-toggle-icon{opacity:.8}.number-reader .number-display:hover{transform:scale(1.02);box-shadow:0 4px 12px #00000026}.number-reader .number-display:active{transform:scale(.98)}.number-reader .text-display{background:linear-gradient(135deg,#4facfe,#00f2fe);color:#fff;padding:15px;border-radius:10px;font-size:1.2em;text-align:center;font-style:italic;transition:all .3s ease;min-height:50px;display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-user-select:none;user-select:none;position:relative}.number-reader .text-display:hover{transform:scale(1.02);box-shadow:0 4px 12px #0003}.number-reader .text-display:active{transform:scale(.98)}.number-reader .text-display-content{flex:1}.number-reader .copy-icon{font-size:1.5em;opacity:.8;transition:opacity .2s ease}.number-reader .text-display:hover .copy-icon{opacity:1}.number-reader .hint-text{color:#999;font-size:.9em;text-align:center;padding:8px;margin-bottom:8px;font-style:italic;opacity:.7;max-height:50px;overflow:hidden;transition:all .5s ease-out}.number-reader .hint-text.collapsing{max-height:0;opacity:0;margin-bottom:0;padding-top:0;padding-bottom:0}.number-reader .number-pad{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.number-reader .number-btn,.number-reader .clear-btn,.number-reader .speaker-btn,.number-reader .language-btn,.number-reader .plus-one-btn,.number-reader .minus-one-btn,.number-reader .backspace-btn{padding:25px;font-size:1.5em;border:none;border-radius:12px;cursor:pointer;font-weight:700;transition:all .2s ease;box-shadow:0 4px 8px #0000001a;height:70px;display:flex;align-items:center;justify-content:center}.number-reader .number-btn:hover,.number-reader .clear-btn:hover,.number-reader .speaker-btn:hover,.number-reader .language-btn:hover,.number-reader .plus-one-btn:hover,.number-reader .minus-one-btn:hover,.number-reader .backspace-btn:hover{transform:translateY(-2px);box-shadow:0 6px 12px #0003}.number-reader .number-btn:active,.number-reader .clear-btn:active,.number-reader .speaker-btn:active,.number-reader .language-btn:active,.number-reader .plus-one-btn:active,.number-reader .minus-one-btn:active,.number-reader .backspace-btn:active{transform:translateY(0);box-shadow:0 2px 4px #0000001a}.number-reader .number-btn:nth-child(4){background:linear-gradient(135deg,#ff9800,#ffeb3b,#66bb6a,#2196f3,#ff69b4);color:#fff}.number-reader .number-btn:nth-child(5){background:linear-gradient(135deg,#ff69b4,#ff1493);color:#fff}.number-reader .number-btn:nth-child(6){background:linear-gradient(135deg,#9e9e9e,#616161);color:#fff}.number-reader .number-btn:nth-child(7){background:linear-gradient(135deg,#66bb6a,#2e7d32);color:#fff}.number-reader .number-btn:nth-child(8){background:linear-gradient(135deg,#00e5ff,#00b8d4);color:#fff}.number-reader .number-btn:nth-child(9){background:linear-gradient(135deg,#5c6bc0,#3949ab);color:#fff}.number-reader .number-btn:nth-child(10){background:linear-gradient(135deg,#ff5252,#d32f2f);color:#fff}.number-reader .number-btn:nth-child(11){background:linear-gradient(135deg,#ffeb3b,#f57f17);color:#fff}.number-reader .number-btn:nth-child(12){background:#fce625;color:#fff}.number-reader .number-btn:nth-child(14){color:#333}.number-reader .backspace-btn{background:linear-gradient(135deg,#ff6b6b,#ee5a6f);color:#fff}.number-reader .minus-one-btn{background:linear-gradient(135deg,#f96,#ff5e62);color:#fff}.number-reader .minus-one-btn:disabled{background:#e0e0e0;color:transparent;cursor:not-allowed;opacity:.5}.number-reader .plus-one-btn{background:linear-gradient(135deg,#56ab2f,#a8e063);color:#fff}.number-reader .clear-btn{color:red;font-size:1.2em}.number-reader .speaker-btn{color:#333;font-size:2em}.number-reader .copied-notification{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#000000d9;color:#fff;padding:8px 12px;border-radius:10px;font-size:1em;font-weight:500;box-shadow:0 4px 20px #0000004d;z-index:2000;animation:fadeInOut 2s ease;pointer-events:none}@keyframes fadeInOut{0%{opacity:0;transform:translate(-50%,-50%) scale(.8)}15%{opacity:1;transform:translate(-50%,-50%) scale(1)}85%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(.8)}}@media(max-width:480px){.number-reader .container{padding:20px}.number-reader h1{font-size:1.5em}.number-reader .number-display{font-size:2em;padding:20px}.number-reader .text-display{font-size:1em;padding:12px}.number-reader .number-btn,.number-reader .clear-btn,.number-reader .speaker-btn{padding:20px;font-size:1.3em}}@keyframes pulse10{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes fillPop10{0%{transform:scale(.8);opacity:.5}50%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}@keyframes confetti-fall{0%{transform:translateY(0) rotate(0);opacity:1}to{transform:translateY(100vh) rotate(720deg);opacity:0}}@keyframes celebrationPop10{0%{transform:scale(.5);opacity:0}50%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}.learning10{background:#fff;border-radius:20px;padding:30px;box-shadow:0 20px 60px #0000004d;max-width:400px;width:100%;margin:0 auto;position:relative;z-index:1}.learning10 .challenge-area{margin-bottom:25px}.learning10 .challenge-title{text-align:center;color:#333;margin-bottom:20px;font-size:1.5em}.learning10 .squares-container{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:25px;min-height:200px;align-content:start}.learning10 .square{aspect-ratio:1;border-radius:10px;transition:all .5s ease}.learning10 .square.glowing{background:linear-gradient(135deg,#ffb3d9,#ff79bc);box-shadow:0 0 10px #ff66b399;animation:pulse10 1.5s ease-in-out infinite}.learning10 .square.filled{animation:fillPop10 .4s ease}.learning10 .square.filled:nth-child(10){background:#fff!important;border:3px solid #ff5252}.learning10 .square.preview{opacity:.6}.learning10 .learning10-number-pad{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.learning10 .learning10-number-btn,.learning10 .learning10-helper-btn{padding:0;font-size:1.5em;border:none;border-radius:12px;cursor:pointer;font-weight:700;transition:all .2s ease;box-shadow:0 4px 8px #0000001a;background:#e0e0e0;color:#000;height:65px;display:flex;align-items:center;justify-content:center}.learning10 .learning10-helper-btn{font-size:1.8em;color:#666;padding:0}.learning10 .learning10-rainbow-btn.active{background:#c9f9ba;color:#fff}.learning10 .learning10-number-btn.revealed{color:#fff;transform:scale(1.05)}.learning10 .learning10-number-btn:hover:not(:disabled),.learning10 .learning10-helper-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 12px #0003}.learning10 .learning10-number-btn:active:not(:disabled),.learning10 .learning10-helper-btn:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 4px #0000001a}.learning10 .learning10-number-btn:disabled,.learning10 .learning10-helper-btn:disabled{cursor:not-allowed;opacity:.5}.learning10 .celebration{position:fixed;inset:0;pointer-events:none;z-index:2000;display:flex;align-items:center;justify-content:center}.learning10 .confetti-container{position:absolute;inset:0;overflow:hidden}.learning10 .confetti{position:absolute;width:10px;height:10px;top:-10px;animation:confetti-fall 3s linear}.learning10 .celebration-message{background:#000000d9;color:#fff;padding:20px 40px;border-radius:15px;font-size:1.5em;font-weight:700;box-shadow:0 8px 30px #0006;animation:celebrationPop10 .5s ease}@keyframes equationSlide{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes flyFromLeft{0%{transform:translate(0) scale(1);opacity:1}to{transform:translate(calc(40vw - 10%)) scale(.8);opacity:.5}}@keyframes flyFromRight{0%{transform:translate(0) scale(1);opacity:1}to{transform:translate(calc(-40vw + 10%)) scale(.8);opacity:.5}}@keyframes fall{0%{transform:translateY(0) rotateX(0);opacity:1}50%{transform:translateY(20px) rotateX(15deg);opacity:.7}to{transform:translateY(100vh) rotateX(45deg);opacity:0}}@keyframes fillPopAddition{0%{transform:scale(0);opacity:0}50%{transform:scale(1.2)}to{transform:scale(1);opacity:1}}@keyframes toastSlide{0%{transform:translateY(100px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes confettiFall{to{transform:translateY(100vh) rotate(360deg)}}@keyframes celebrationPopAddition{0%{transform:scale(0);opacity:0}50%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}@keyframes selectedDigitBlinkAddition{0%,to{border-color:#4caf50}50%{border-color:#fff}}.learning-addition{background:#fff;border-radius:20px;padding:20px;box-shadow:0 20px 60px #0000004d;max-width:450px;width:100%;margin:0 auto;position:relative;z-index:1;max-height:85vh;overflow-y:auto}.learning-addition .target-area{margin-bottom:20px}.learning-addition .challenge-title{text-align:center;color:#333;margin-bottom:15px;font-size:1.3em}.learning-addition .target-squares{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:15px;align-content:start}.learning-addition .target-square{width:35px;height:35px;border-radius:6px;background:linear-gradient(135deg,#ffb3d9,#ff79bc);box-shadow:0 2px 4px #0003}.learning-addition .target-square.target-ten{background:#fff!important;border:2px solid #ff5252;box-shadow:0 1px 3px #ff52524d}.learning-addition .equation-display{text-align:center;font-size:1.8em;font-weight:700;animation:equationSlide .5s ease-out}.learning-addition .equation-number{color:#333}.learning-addition .equation-operator{color:#666}.learning-addition .equation-question{color:#ff5252;font-size:1.1em}.learning-addition .digit-selector{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px;justify-content:center}.learning-addition .digit-container{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:5px;min-height:100px}.learning-addition .digit-label{font-size:.9em;font-weight:700;color:#666}.learning-addition .digit-display{display:grid;gap:3px;cursor:pointer;padding:7px;border-radius:7px;background:#f2f2f2;transition:all .3s ease;min-height:40px}.learning-addition .digit-display:hover{background:#e6e6e6;transform:scale(1.05)}.learning-addition .digit-display.selected{background:#dbefdc;border:2px solid #4caf50;animation:selectedDigitBlinkAddition .9s ease-in-out infinite}@media(prefers-reduced-motion:reduce){.learning-addition .digit-display.selected{animation:none}}.learning-addition .digit-square{width:20px;height:20px;border-radius:4px;box-shadow:0 1px 3px #0003}.learning-addition .digit-square.digit-10{background:#fff!important;border:2px solid #ff5252;box-shadow:0 1px 3px #ff52524d}.learning-addition .animation-area{position:fixed;inset:0;z-index:100;pointer-events:none;display:flex;align-items:center;justify-content:center}.learning-addition .flying-digit{position:absolute;animation-duration:1.5s;animation-timing-function:ease-in-out;animation-fill-mode:forwards}.learning-addition .flying-left{left:10%;animation-name:flyFromLeft}.learning-addition .flying-right{right:10%;animation-name:flyFromRight}.learning-addition .result-area{position:relative;margin-top:20px;border-radius:12px}.learning-addition .result-area.falling{animation:fall 1.5s ease-in forwards}.learning-addition .result-squares{position:absolute;width:100%;display:flex;flex-wrap:wrap;gap:6px;min-height:40px}.learning-addition .result-square{width:35px;height:35px;border-radius:6px;background:#e0e0e0;transition:all .4s ease}.learning-addition .result-square.filled{animation:fillPopAddition .4s ease}.learning-addition .result-square.result-ten{background:#fff!important;border:2px solid #ff5252;box-shadow:0 1px 3px #ff52524d}.learning-addition .error-toast{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:200}.learning-addition .error-toast-content{background:linear-gradient(135deg,#ff5252,#d32f2f);box-shadow:0 8px 30px #ff525280;color:#fff;font-size:1.2em;font-weight:700;animation:toastSlide .4s ease-out;padding:15px 30px;border-radius:12px}.learning-addition .error-icon{font-size:1.2em;margin-right:8px}.learning-addition .error-message{font-size:1em}.learning-addition .celebration{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:200;pointer-events:none}.learning-addition .confetti-container{position:absolute;inset:0;overflow:hidden}.learning-addition .confetti{position:absolute;width:10px;height:10px;top:-10px;animation:confettiFall 3s linear}.learning-addition .celebration-message{background:#fff;padding:30px 50px;border-radius:20px;font-size:1.5em;font-weight:700;color:#4caf50;box-shadow:0 10px 40px #0000004d;animation:celebrationPopAddition .5s ease}@keyframes digitHeartbeat{0%{transform:scale(1)}20%{transform:scale(1.25)}40%{transform:scale(.95)}60%{transform:scale(1.18)}80%{transform:scale(.98)}to{transform:scale(1)}}@keyframes digitJump{0%{transform:translateY(0)}20%{transform:translateY(-18px) scale(1.15)}40%{transform:translateY(-8px) scale(1.08)}60%{transform:translateY(-14px) scale(1.12)}80%{transform:translateY(-2px) scale(1.04)}to{transform:translateY(0)}}@keyframes digitRotate{0%{transform:rotate(0)}40%{transform:rotate(1turn) scale(1.1)}60%{transform:rotate(1turn) scale(1.1)}to{transform:rotate(0)}}@keyframes digitSwing{0%{transform:rotate(0)}20%{transform:rotate(-18deg) scale(1.08)}40%{transform:rotate(12deg) scale(1.08)}60%{transform:rotate(-8deg) scale(1.04)}80%{transform:rotate(6deg) scale(1.02)}to{transform:rotate(0)}}@keyframes digitSlideDown{0%{transform:translateY(0)}20%{transform:translateY(2em)}60%{transform:translateY(2em)}65%{transform:translateY(2em)}85%{transform:translateY(0)}to{transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleUp{0%{transform:scale(1);opacity:.5}to{transform:scale(1.5);opacity:1}}@keyframes moveLeft{0%{transform:scale(1.5) translate(0)}to{transform:scale(1.2) translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(50px)}to{opacity:1;transform:translate(0)}}@keyframes pulse{0%{transform:scale(1);box-shadow:0 2px 4px #0003}50%{transform:scale(1.3);box-shadow:0 0 25px gold}to{transform:scale(1.2);box-shadow:0 0 20px #ffd700cc}}@keyframes moveLeft{0%{transform:scale(1.5) translate(0)}to{transform:scale(1) translate(0)}}.learning-numbers{background:#fff;border-radius:20px;padding:30px;box-shadow:0 20px 60px #0000004d;max-width:400px;width:100%;margin:0 auto;position:relative;z-index:1;height:70vh;overflow-y:auto}.learning-numbers .digit-anim-heartbeat{animation:digitHeartbeat .7s cubic-bezier(.68,-.55,.27,1.55)}.learning-numbers .digit-anim-jump{animation:digitJump .7s cubic-bezier(.28,1.84,.42,.98)}.learning-numbers .digit-anim-rotate{animation:digitRotate .7s cubic-bezier(.68,-.55,.27,1.55)}.learning-numbers .digit-anim-swing{animation:digitSwing .7s cubic-bezier(.68,-.55,.27,1.55);transform-origin:bottom center}.learning-numbers .digit-anim-slide-down{animation:digitSlideDown 1.8s ease-in-out}.learning-numbers .hint-section-close{position:absolute;top:10px;right:10px;width:40px;height:40px;font-size:2em;border:none;border-radius:12px;background:#f0f0f0;cursor:pointer;transition:all .2s ease;z-index:20;display:flex;align-items:center;justify-content:center}.learning-numbers .hint-section-close:hover{transform:scale(1.1);background:#e0e0e0}.learning-numbers .hint-section-close:active{transform:scale(.95);background:#d0d0d0}.learning-numbers .hint-section-arrow{width:40px;height:40px;font-size:1.5em;border:none;border-radius:12px;background:#f0f0f0;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.learning-numbers .hint-section-arrow:hover{transform:scale(1.1);background:#e0e0e0}.learning-numbers .hint-section-arrow:active{transform:scale(.95);background:#d0d0d0}.learning-numbers .hint-button{position:absolute;top:10px;right:10px;width:50px;height:50px;font-size:1.5em;border:none;border-radius:50%;background:#f0f0f0;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,border .2s;perspective:400px;overflow:visible}.learning-numbers .hint-button:hover{transform:scale(1.1);background:#e0e0e0}.learning-numbers .hint-button:active{transform:scale(.95);background:#d0d0d0}.learning-numbers .hint-icon-inner{position:relative;width:32px;height:32px;display:flex;align-items:center;justify-content:center;transition:transform .25s;transform-style:preserve-3d}.learning-numbers .hint-flip .hint-icon-inner{transform:rotateY(180deg)}.learning-numbers .hint-icon-front{position:absolute;width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:1.6em;backface-visibility:hidden}.learning-numbers .digits-list{animation:fadeIn .3s ease}.learning-numbers .title{text-align:center;color:#333;margin-bottom:20px;font-size:1.5em}.learning-numbers .digit-selector{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px;justify-content:center}.learning-numbers .digit-container{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:5px;min-height:100px;cursor:pointer;transition:transform .2s ease}.learning-numbers .digit-container:hover{transform:scale(1.05)}.learning-numbers .digit-container:active{transform:scale(.98)}.learning-numbers .digit-label{font-size:1.1em;font-weight:700;color:#666}.learning-numbers .digit-display{display:grid;gap:4px;z-index:10;cursor:pointer;padding:5px;border-radius:5px;background:#f2f2f2;transition:all .3s ease}.learning-numbers .digit-display:hover{background:#e6e6e6;transform:scale(1.05)}.learning-numbers .digit-display.selected{background:#dbefdc;border:2px solid #4caf50}.learning-numbers .digit-square{width:22px;height:22px;border-radius:6px;box-shadow:0 2px 4px #0003;transition:all .3s ease}.learning-numbers .digit-square.counting-active{animation:pulse .4s ease-in-out;transform:scale(1.2);box-shadow:0 0 10px #ffd700cc}.learning-numbers .digit-square.counting-done{opacity:1}.learning-numbers .digit-square.counting-hidden{opacity:0;transform:scale(0)}.learning-numbers .digit-square.digit-10{background:#fff!important;box-shadow:0 1px 3px #ff52524d}.learning-numbers .digit-detail{animation:fadeIn .3s ease;position:relative;height:100%;display:flex;flex-direction:column}.learning-numbers .back-button{position:absolute;top:10px;left:10px;width:50px;height:50px;font-size:1.5em;border:none;border-radius:12px;background:#f0f0f0;cursor:pointer;transition:all .2s ease;z-index:10}.learning-numbers .back-button:hover{transform:scale(1.1);background:#e0e0e0}.learning-numbers .back-button:active{transform:scale(.95)}.learning-numbers .digit-detail-display{display:flex;align-items:center;justify-content:center;gap:30px;flex:1;padding:20px}.learning-numbers .digit-detail-display.center{justify-content:center}.learning-numbers .digit-detail-display.left{padding:20px 60px;gap:40px}.learning-numbers .digit-detail-container{cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:15px;transition:all .5s cubic-bezier(.68,-.55,.265,1.55)}.learning-numbers .digit-detail-display.center .digit-detail-container{transform:scale(1.5);animation:scaleUp .5s cubic-bezier(.68,-.55,.265,1.55)}.learning-numbers .digit-detail-display.left .digit-detail-container{transform:scale(1.2);animation:moveLeft .5s cubic-bezier(.68,-.55,.265,1.55)}.learning-numbers .digit-detail-label{font-size:3em;font-weight:700;color:#333}.learning-numbers .digit-detail-squares .digit-display{max-width:150px;gap:8px}.learning-numbers .digit-detail-display.counting .digit-detail-squares .digit-square{width:40px;height:40px;border-radius:10px}.learning-numbers .digit-names{display:flex;flex-direction:column;gap:20px;animation:slideInRight .5s ease;justify-content:center}.learning-numbers .digit-name{font-size:2.5em;font-weight:700;cursor:pointer;transition:all .2s ease;text-align:left;color:inherit}.learning-numbers .digit-name.en,.learning-numbers .digit-name.vi{color:#ff5252}.learning-numbers .digit-name:hover{transform:scale(1.05)}.learning-numbers .digit-name:active{transform:scale(.95)}@media(max-width:480px){.learning-numbers .learning-numbers{padding:20px 15px}.learning-numbers .digit-selector{gap:6px}.learning-numbers .digit-detail-display.left{flex-direction:row;gap:20px;padding:20px 10px}.learning-numbers .digit-detail-label{font-size:2.5em}.learning-numbers .digit-name{font-size:1.5em;padding:12px 20px}}.language-toggle-fixed{position:fixed;top:max(30px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));width:52px;height:52px;font-size:1.8em;border:none;border-radius:50%;cursor:pointer;background:#fff;box-shadow:0 4px 15px #0003;transition:all .2s ease;z-index:1000;display:flex;align-items:center;justify-content:center}.language-toggle-fixed:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0000004d}.language-toggle-fixed:active{transform:translateY(0);box-shadow:0 2px 8px #0003}@keyframes fillPopCombination{0%{transform:scale(0);opacity:0}50%{transform:scale(1.2)}to{transform:scale(1);opacity:1}}@keyframes selectedDigitBlink{0%,to{border-color:#fff}50%{border-color:#66bb6a}}@keyframes swapDigitLeft{0%{transform:translate(0)}50%{transform:translate(calc(100% + 22px))}to{transform:translate(0)}}@keyframes swapDigitRight{0%{transform:translate(0)}50%{transform:translate(calc(-100% - 22px))}to{transform:translate(0)}}.addition-practice{background:#fff;border-radius:20px;padding:20px;box-shadow:0 20px 60px #0000004d;max-width:450px;width:100%;margin:0 auto;position:relative;z-index:1;max-height:85vh;overflow-y:auto}.addition-practice .header-area{position:relative;margin-bottom:20px}.addition-practice .home-button{position:absolute;top:0;left:0;width:44px;height:44px;font-size:1.4em;border:none;border-radius:10px;background:#f0f0f0;cursor:pointer;transition:all .2s ease;z-index:2}.addition-practice .home-button:hover{transform:scale(1.08);background:#e0e0e0}.addition-practice .home-button:active{transform:scale(.95)}.addition-practice .home-button:focus{outline:3px solid #ffeb3b;outline-offset:2px}.addition-practice .home-button:focus:not(:focus-visible){outline:none}.addition-practice .title{text-align:center;color:#333;margin-bottom:15px;font-size:1.5em}.addition-practice .content-area{position:relative;min-height:450px}.addition-practice .equation-area{display:flex;flex:1;flex-direction:column;gap:12px;padding:8px 10px;border-radius:10px;background:#ffffffb3}.addition-practice .equation-operator{font-size:1.8em;font-weight:700;color:#3949ab}.addition-practice .equation-text-row{min-height:24px;display:flex;align-items:center;justify-content:center;font-size:1.5em;font-weight:700;color:#333}.addition-practice .combination-area{position:relative;padding:10px;background:#f8f8f8;border-radius:12px;min-height:100px;z-index:10;display:flex}.addition-practice .combination-area.equation-ready{cursor:pointer}.addition-practice .source-digits-area{display:flex;flex:1;align-items:center;justify-content:space-between;gap:12px;padding:15px 10px;background-color:#fff;border-radius:12px}.addition-practice .source-digit-block{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:68px;gap:6px}.addition-practice .source-digit-block.source-left.swapping{animation:swapDigitLeft .5s ease-in-out}.addition-practice .source-digit-block.source-right.swapping{animation:swapDigitRight .5s ease-in-out}.addition-practice .source-digit-value{font-size:1em;font-weight:700;color:#333;transition:opacity .25s ease;min-height:20px}.addition-practice .source-plus{font-size:1.5em;font-weight:700;color:#3949ab;line-height:1}.addition-practice .combination-columns-container{display:flex;gap:20px;padding:15px;justify-content:center;border-radius:10px;background-color:#fff}.addition-practice .combination-column{display:flex;flex-direction:column;align-items:center}.addition-practice .column-label{font-size:1.2em;font-weight:700;min-height:30px;color:#333;margin-bottom:10px}.addition-practice .combination-squares{display:flex;flex-direction:column;gap:6px}.addition-practice .combination-square{width:25px;height:25px;border-radius:6px;background:#e0e0e0;box-shadow:0 2px 4px #0003;transition:all .4s ease}.addition-practice .combination-square.total-color-transition{transition:background 1s ease,border-color 1s ease,box-shadow 1s ease,transform .4s ease,opacity .4s ease}.addition-practice .combination-square.filled{animation:fillPopCombination .4s ease}.addition-practice .combination-square.filled.combination-ten{background:#fff!important;border:2px solid #ff5252;box-shadow:0 1px 3px #ff52524d}.addition-practice .digit-selector{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px;justify-content:center}.addition-practice .digit-container{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:5px;min-height:100px}.addition-practice .digit-label{font-size:.9em;font-weight:700;color:#666}.addition-practice .digit-display{display:grid;gap:3px;cursor:pointer;padding:7px;border-radius:7px;background:#f2f2f2;transition:all .3s ease;min-height:40px}.addition-practice .digit-display:hover{background:#e6e6e6;transform:scale(1.05)}.addition-practice .digit-display.selected{background:#dbefdc;border:2px solid #4caf50;animation:selectedDigitBlink .9s ease-in-out infinite}@media(prefers-reduced-motion:reduce){.addition-practice .digit-display.selected{animation:none}}.addition-practice .digit-display.column-layout-display{display:flex;gap:6px;align-items:flex-start}.addition-practice .digit-column{display:flex;flex-direction:column;gap:3px}.addition-practice .digit-display.preview-display{background:transparent;padding:4px;cursor:default}.addition-practice .digit-display.preview-display:hover{transform:none;background:transparent}.addition-practice .digit-square{width:20px;height:20px;border-radius:4px;box-shadow:0 1px 3px #0003;transition:background .3s ease,opacity .3s ease,filter .3s ease,transform .3s ease}.addition-practice .digit-square.consumed-square{background:#b9f4f4!important;opacity:.45;filter:grayscale(50%);box-shadow:none}.addition-practice .digit-square.digit-10{background:#fff!important;border:2px solid #ff5252;box-shadow:0 1px 3px #ff52524d}.update-modal-overlay{position:fixed;inset:0;background-color:#000c;display:flex;justify-content:center;align-items:center;z-index:10000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.update-modal{background:linear-gradient(135deg,#4facfe 0% 100%);border-radius:24px;padding:40px 32px;max-width:400px;width:90%;box-shadow:0 20px 60px #0000004d;text-align:center;animation:slideUp .3s ease-out;color:#fff}@keyframes slideUp{0%{opacity:0;transform:translateY(50px)}to{opacity:1;transform:translateY(0)}}.update-modal-icon{font-size:64px;margin-bottom:20px}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.update-modal-title{font-size:28px;font-weight:700;margin:0 0 16px;color:#fff}.update-modal-message{font-size:16px;line-height:1.6;margin:0 0 24px;color:#fffffff2}.update-modal-versions{background:#ffffff26;border-radius:12px;padding:16px;margin-bottom:24px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.version-info{display:flex;justify-content:space-between;align-items:center;padding:8px 0}.version-info:not(:last-child){border-bottom:1px solid rgba(255,255,255,.2)}.version-label{font-size:14px;font-weight:600;color:#ffffffe6}.version-value{font-size:14px;font-weight:700;color:#fff;background:#fff3;padding:4px 12px;border-radius:8px}.update-modal-button{width:100%;padding:16px 32px;font-size:18px;font-weight:700;color:#fff;background:#ffffff40;border:2px solid rgba(255,255,255,.4);border-radius:12px;cursor:pointer;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.update-modal-button:hover{transform:translateY(-2px);background:#ffffff59;box-shadow:0 6px 20px #0003}.update-modal-button:active{transform:translateY(0)}
