:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;min-width:320px;min-height:100vh;width:100vw;height:100vh;overflow:hidden;position:fixed;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}#root{width:100%;height:100%}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.hud{position:fixed;top:0;left:0;right:0;height:52px;background:#1e1e23d9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:1000;display:flex;align-items:center;padding:0 16px;border-bottom:1px solid rgba(255,255,255,.08)}.hud-content{width:100%;max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:8px}.hud-primary-stats{display:flex;align-items:center;gap:16px}.hud-stat{display:flex;align-items:center;gap:6px;color:#ffffffe6;font-weight:600;font-size:15px;padding:6px 10px;border-radius:8px;transition:background-color .2s ease}.hud-stat-interactive{cursor:default}.hud-stat-interactive:hover{background-color:#ffffff14}.hud-icon{font-size:18px;line-height:1}.hud-value{font-size:15px;font-weight:700;font-variant-numeric:tabular-nums}.hud-label-desktop{font-size:13px;font-weight:500;opacity:.7;display:none}.hud-stat-level{gap:8px}.hud-level-badge{display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:linear-gradient(135deg,#6366f1,#8b5cf6);border-radius:6px;font-size:14px;font-weight:700;color:#fff;box-shadow:0 2px 4px #6366f14d}.hud-xp-mini{width:48px;height:6px;background:#ffffff26;border-radius:3px;overflow:hidden}.hud-xp-mini-fill{height:100%;background:linear-gradient(90deg,#6366f1,#a855f7);border-radius:3px;transition:width .3s ease}.hud-stat-streak .hud-value{color:#fb923c}.hud-more-button{display:flex;align-items:center;gap:4px;padding:6px 12px;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#ffffffb3;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease}.hud-more-button:hover{background:#ffffff1a;color:#ffffffe6}.hud-more-icon{font-size:14px}.hud-more-label{display:none}.hud-right{margin-left:auto;display:flex;align-items:center;gap:4px}.hud-user-button{color:#fffc!important;padding:8px!important;transition:all .2s ease!important}.hud-user-button:hover{color:#fff!important;background-color:#ffffff1a!important}.hud-settings-button{color:#ffffffb3!important;padding:8px!important;transition:all .2s ease!important}.hud-settings-button:hover{color:#fff!important;background-color:#ffffff1a!important;transform:rotate(45deg)}.hud-popover{background:#1e1e23f2!important;backdrop-filter:blur(16px)!important;-webkit-backdrop-filter:blur(16px)!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:12px!important;box-shadow:0 8px 32px #0006!important;margin-top:8px!important}.hud-popover-content{padding:16px 20px;min-width:220px}.hud-popover-title{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#ffffff80;margin-bottom:12px}.hud-popover-stat{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.06)}.hud-popover-stat:last-of-type{border-bottom:none}.hud-popover-icon{font-size:18px;width:24px;text-align:center}.hud-popover-label{flex:1;color:#fffc;font-size:14px}.hud-popover-value{font-weight:700;color:#fff;font-size:15px;font-variant-numeric:tabular-nums}.hud-popover-xp{margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.1)}.hud-popover-xp-bar{height:8px;background:#ffffff1a;border-radius:4px;overflow:hidden}.hud-popover-xp-fill{height:100%;background:linear-gradient(90deg,#6366f1,#a855f7);border-radius:4px;transition:width .3s ease}.hud-popover-xp-label{margin-top:6px;font-size:12px;color:#ffffff80;text-align:center}@media (max-width: 360px){.hud{height:48px;padding:0 8px}.hud-primary-stats{gap:8px}.hud-stat{padding:4px 6px;gap:4px}.hud-icon{font-size:16px}.hud-value{font-size:14px}.hud-level-badge{width:24px;height:24px;font-size:12px}.hud-xp-mini{width:36px;height:5px}.hud-more-button{padding:4px 8px}.hud-more-icon{font-size:14px}}@media (min-width: 361px) and (max-width: 480px){.hud{height:50px;padding:0 12px}.hud-primary-stats{gap:10px}.hud-xp-mini{width:40px}}@media (min-width: 481px) and (max-width: 768px){.hud-more-label{display:inline}.hud-xp-mini{width:56px}}@media (min-width: 769px){.hud{height:56px;padding:0 24px}.hud-primary-stats{gap:20px}.hud-label-desktop,.hud-more-label{display:inline}.hud-xp-mini{width:64px;height:7px}.hud-level-badge{width:32px;height:32px;font-size:15px}}@media (min-width: 1024px){.hud-content{gap:16px}.hud-stat{padding:8px 14px}.hud-xp-mini{width:80px}}.village{position:fixed;inset:52px 0 0;background:linear-gradient(135deg,#6b8e23,#7a9e32);overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px}.village-container{position:relative;width:100%;max-width:1200px;aspect-ratio:16 / 10;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0 auto}.village-map{position:relative;width:90%;max-width:1000px;aspect-ratio:16 / 10;z-index:1}.village-grid{display:none}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@media (max-width: 768px){.village{top:52px;padding:16px}.village-container{aspect-ratio:4 / 5}.village-map{width:95%;aspect-ratio:4 / 5}}@media (max-width: 480px){.village{top:50px;padding:0;justify-content:flex-start;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}.village-container{aspect-ratio:unset;width:100%;height:auto;min-height:100%;padding:12px 12px 24px}.village-map{display:none}.village-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;width:100%;padding:4px}.village-grid-item{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#ffffff26;border-radius:16px;padding:16px 8px;cursor:pointer;transition:all .2s ease;border:2px solid rgba(255,255,255,.1);min-height:140px;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.village-grid-item:hover,.village-grid-item:active{background:#ffffff40;border-color:#ffffff4d;transform:scale(1.02)}.village-grid-item:active{transform:scale(.98)}.village-grid-item img{width:80px;height:80px;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2))}.village-grid-item-name{margin-top:8px;font-size:14px;font-weight:600;color:#fff;text-align:center;text-shadow:1px 1px 2px rgba(0,0,0,.5);line-height:1.2}.village-grid-item--featured{grid-column:span 2;padding:20px 16px;min-height:120px;flex-direction:row;gap:16px;justify-content:flex-start;background:#fff3}.village-grid-item--featured img{width:90px;height:90px}.village-grid-item--featured .village-grid-item-name{font-size:16px;text-align:left}}@media (max-width: 360px){.village{top:48px}.village-container{padding:8px}.village-grid{gap:8px}.village-grid-item{padding:12px 6px;min-height:120px;border-radius:12px}.village-grid-item img{width:64px;height:64px}.village-grid-item-name{font-size:12px;margin-top:6px}.village-grid-item--featured{padding:14px 12px;min-height:100px}.village-grid-item--featured img{width:70px;height:70px}.village-grid-item--featured .village-grid-item-name{font-size:14px}}.lazy-load-image-background.opacity{opacity:0}.lazy-load-image-background.opacity.lazy-load-image-loaded{opacity:1;transition:opacity .3s}.building{cursor:pointer;transition:all .3s ease;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:10}.building:hover{transform:translate(-50%,-50%) translateY(-10px) scale(1.05)!important;filter:brightness(1.1) drop-shadow(0 12px 30px rgba(0,0,0,.4))}.building:active{transform:translate(-50%,-50%) translateY(-5px) scale(1.02)!important}.building-image{width:100%;height:100%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 4px 8px rgba(0,0,0,.2))}.building .lazy-load-image-background{width:100%;height:100%;display:block}.building .lazy-load-image-background.opacity img{object-fit:contain}.building-name{font-size:clamp(12px,1.6vw,20px);font-weight:700;color:#fff;text-align:center;padding:0 10px;text-shadow:2px 2px 4px rgba(0,0,0,.8);position:absolute;bottom:-25px;left:50%;transform:translate(-50%);white-space:nowrap}.back-button{padding:8px 16px;background:#ffffffe6;border:2px solid #000;border-radius:8px;font-size:16px;font-weight:700;cursor:pointer;transition:all .2s ease;color:#000}.back-button:hover{background:#ff0;transform:scale(1.05)}.back-button-header{padding:10px 20px;background:#666;color:#fff;border:none;border-radius:8px;font-size:16px}.back-button-header:hover{background:#555;transform:none}.back-button-header:active{transform:none}.floating-particles{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}.floating-particle{position:absolute;bottom:-20px;border-radius:50%;opacity:0;animation:float-up linear infinite}@keyframes float-up{0%{opacity:0;transform:translateY(0) translate(0) scale(.5)}10%{opacity:.7}90%{opacity:.7}to{opacity:0;transform:translateY(-100vh) translate(30px) scale(1)}}@media (prefers-reduced-motion: reduce){.floating-particle{animation:none;opacity:.3;bottom:auto;top:50%}}.exercise-selector{min-height:100vh;padding:20px;display:flex;justify-content:center;align-items:center;position:relative;overflow:hidden}.exercise-selector-pattern{position:absolute;inset:0;pointer-events:none;z-index:1;opacity:.03;background-image:radial-gradient(circle at 25% 25%,#000 1px,transparent 1px),radial-gradient(circle at 75% 75%,#000 1px,transparent 1px);background-size:30px 30px}.exercise-selector-container{max-width:900px;width:100%;position:relative;z-index:2}.exercise-selector-header{margin-bottom:30px}.exercise-selector-title{text-align:center;font-size:2.5rem;color:#333;margin:20px 0;text-shadow:2px 2px 4px rgba(0,0,0,.1)}.exercise-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;padding:20px 0}@keyframes card-slide-in{0%{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.exercise-card{background:#fff;border:3px solid #4caf50;border-radius:15px;padding:25px 20px 20px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 6px #0000001a;text-align:center;position:relative;overflow:hidden;opacity:0;animation:card-slide-in .4s ease forwards}.exercise-card:hover{transform:translateY(-5px);box-shadow:0 8px 16px #00000026;border-color:#45a049;background:linear-gradient(to bottom,#fff,#f8fff8)}.exercise-card:active{transform:translateY(-2px)}.exercise-card-icon{font-size:2.5rem;margin-bottom:12px;line-height:1;transition:transform .3s ease}.exercise-card:hover .exercise-card-icon{transform:scale(1.15)}.exercise-name{font-size:1.4rem;color:#2c3e50;margin:0 0 10px;font-weight:700}.exercise-description{font-size:.95rem;color:#666;margin:0;line-height:1.4}.exercise-card-bonus{margin-top:12px;padding-top:12px;border-top:1px solid #e0e0e0}.exercise-exploration-bonus{display:inline-block;font-size:.85rem;color:#ff9800;font-weight:600;background:linear-gradient(135deg,#fff8e1,#ffecb3);padding:4px 12px;border-radius:20px;border:1px solid #ffcc80;animation:pulse-glow 2s ease-in-out infinite}@keyframes pulse-glow{0%,to{box-shadow:0 0 5px #ff98004d}50%{box-shadow:0 0 15px #ff980080}}.exercise-card-locked{cursor:not-allowed;background:#f5f5f5;border-color:#ccc;opacity:.7}.exercise-card-locked:hover{transform:none;box-shadow:0 4px 6px #0000001a;background:#f5f5f5;border-color:#ccc}.exercise-card-lock{position:absolute;top:10px;right:10px;font-size:1.2rem}.exercise-card-icon-locked{filter:grayscale(100%);opacity:.5}.exercise-card-locked .exercise-name{color:#888}.exercise-card-locked .exercise-description{color:#999;font-style:italic}.no-exercises{text-align:center;padding:40px;color:#666;font-size:1.2rem}@media (max-width: 768px){.exercise-selector{padding:15px}.exercise-selector-title{font-size:1.8rem}.exercise-grid{grid-template-columns:1fr;gap:15px}.exercise-card{padding:20px 15px 15px}.exercise-card-icon{font-size:2rem}.exercise-name{font-size:1.2rem}.exercise-description{font-size:.9rem}}@media (prefers-reduced-motion: reduce){.exercise-card{animation:none;opacity:1}.exercise-card:hover,.exercise-card:hover .exercise-card-icon{transform:none}}:root{--exercise-bg: #87ceeb;--exercise-accent: #ffff00;--exercise-animation-duration: .3s}.multiple-choice-exercise{display:flex;flex-direction:column;align-items:center;gap:2rem;width:100%;max-width:900px;padding:1rem;animation:slideInUp .4s cubic-bezier(.16,1,.3,1)}.multiple-choice-exercise[data-speed-test=true]{gap:1rem}.mce-question-container{background:#fffffff2;border:4px solid #000;border-radius:20px;padding:2.5rem 3rem;box-shadow:0 8px 24px #00000026;min-width:300px;text-align:center;transform-origin:center;animation:bounceIn .6s cubic-bezier(.68,-.55,.265,1.55)}.mce-question{font-size:4rem;font-weight:700;color:#000;font-family:Arial,sans-serif;letter-spacing:-.02em}.mce-options{display:flex;gap:1.5rem;justify-content:center;flex-wrap:wrap;width:100%}.mce-option-button{position:relative;min-width:140px;height:90px;background:#fff;border:3px solid #000;font-size:2.5rem;font-weight:700;cursor:pointer;transition:all var(--exercise-animation-duration) cubic-bezier(.4,0,.2,1);box-shadow:0 4px 12px #0000001a;display:flex;align-items:center;justify-content:center;gap:.5rem;overflow:hidden}.mce-option-button:before{content:"";position:absolute;inset:0;background:var(--exercise-accent);opacity:0;transition:opacity var(--exercise-animation-duration) ease;z-index:0}.option-number,.option-value{position:relative;z-index:1;color:#000}.option-number{font-size:.875rem;color:#333;background:#00000026;padding:.25rem .5rem;border-radius:4px;position:absolute;top:.5rem;left:.5rem}.button-style-default{border-radius:12px}.button-style-rounded{border-radius:20px}.button-style-pills{border-radius:50px}.button-style-cards{border-radius:16px;box-shadow:0 6px 20px #0000001f}.animation-normal:hover:not(:disabled){transform:translateY(-6px) scale(1.05);box-shadow:0 8px 24px #0003}.animation-normal:hover:not(:disabled):before{opacity:1}.animation-normal:active:not(:disabled){transform:translateY(-2px) scale(1.02)}.animation-subtle:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 16px #00000026}.animation-subtle:hover:not(:disabled):before{opacity:.5}.animation-energetic:hover:not(:disabled){transform:translateY(-8px) scale(1.08) rotate(-2deg);box-shadow:0 12px 32px #00000040}.animation-energetic:hover:not(:disabled):before{opacity:1}.animation-energetic{animation:pulse 2s infinite}.animation-none{transition:none}.answer-correct{background:linear-gradient(135deg,#0f0,#0c0)!important;border-color:#080;animation:successPop .5s cubic-bezier(.68,-.55,.265,1.55);box-shadow:0 0 30px #00ff0080;transform:scale(1.1);color:#000!important}.answer-wrong{background:linear-gradient(135deg,#f44,#c00)!important;border-color:#800;animation:errorShake .5s cubic-bezier(.36,.07,.19,.97);box-shadow:0 0 30px #ff000080;color:#fff!important}.mce-option-button:disabled{cursor:not-allowed;opacity:.6}.mce-feedback{font-size:2rem;font-weight:700;text-align:center;padding:1.5rem 2rem;border-radius:16px;min-height:80px;display:flex;flex-direction:column;gap:.5rem;justify-content:center;animation:feedbackSlide .4s cubic-bezier(.16,1,.3,1);text-shadow:2px 2px 6px rgba(0,0,0,.2);max-width:600px}.mce-feedback-correct{color:#0f0;text-shadow:0 0 20px rgba(0,255,0,.6),2px 2px 6px rgba(0,0,0,.3)}.mce-feedback-wrong{color:#f33;text-shadow:0 0 20px rgba(255,51,51,.6),2px 2px 6px rgba(0,0,0,.3)}.mce-feedback-complete{color:gold;font-size:1.75rem;background:#000c;border-radius:16px;padding:2rem;animation:celebrationBounce .8s cubic-bezier(.68,-.55,.265,1.55)}.mce-response-time{background:#fffffff2;border:2px solid #000;border-radius:12px;padding:1rem 1.5rem;box-shadow:0 4px 12px #0000001a;animation:slideInDown .3s ease}.response-time-current{font-size:1.25rem;font-weight:600;color:#000;margin-bottom:.5rem}.response-time-stats{font-size:.875rem;color:#666}.mce-keyboard-hint{font-size:.875rem;color:#00000080;text-align:center;padding:.5rem}@keyframes slideInUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}@keyframes bounceIn{0%{opacity:0;transform:scale(.3)}50%{opacity:1;transform:scale(1.05)}70%{transform:scale(.9)}to{transform:scale(1)}}@keyframes successPop{0%{transform:scale(1)}30%{transform:scale(1.2)}50%{transform:scale(1.1) rotate(5deg)}70%{transform:scale(1.15) rotate(-5deg)}to{transform:scale(1.1) rotate(0)}}@keyframes errorShake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-10px)}20%,40%,60%,80%{transform:translate(10px)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes feedbackSlide{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes celebrationBounce{0%{opacity:0;transform:scale(.5) rotate(-10deg)}50%{opacity:1;transform:scale(1.1) rotate(5deg)}70%{transform:scale(.95) rotate(-3deg)}to{transform:scale(1) rotate(0)}}@keyframes slideInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.answer-correct:after{content:"";position:absolute;top:50%;left:50%;width:100%;height:100%;background:radial-gradient(circle,rgba(0,255,0,.4),transparent);transform:translate(-50%,-50%);animation:glowPulse 1s ease-out;pointer-events:none}@keyframes glowPulse{0%{transform:translate(-50%,-50%) scale(.8);opacity:1}to{transform:translate(-50%,-50%) scale(2);opacity:0}}.mce-option-button:active:not(:disabled):after{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#ffffff80;transform:translate(-50%,-50%);animation:ripple .6s ease-out}@keyframes ripple{to{width:300px;height:300px;opacity:0}}@media (max-width: 768px){.mce-question{font-size:3rem}.mce-option-button{min-width:110px;height:75px;font-size:2rem}.mce-feedback{font-size:1.5rem;padding:1rem 1.5rem}.mce-options{gap:1rem}}@media (max-width: 480px){.mce-question{font-size:2.5rem}.mce-option-button{min-width:90px;height:65px;font-size:1.75rem}.mce-question-container{padding:1.5rem 2rem}}@media (prefers-reduced-motion: reduce){.multiple-choice-exercise,.mce-question-container,.mce-option-button,.mce-feedback,.mce-response-time{animation:none}.mce-option-button{transition:background-color .1s,border-color .1s}.animation-energetic,.animation-normal,.animation-subtle{animation:none}}.mce-option-button:focus-visible{outline:3px solid var(--exercise-accent);outline-offset:3px}.completion-modal-overlay{position:fixed;inset:0;background:#000000b3;display:flex;justify-content:center;align-items:center;z-index:10000;animation:fadeIn .3s ease;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.completion-modal{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:24px;padding:0;max-width:90%;width:500px;box-shadow:0 20px 60px #0006;animation:modalBounceIn .5s cubic-bezier(.68,-.55,.265,1.55);overflow:hidden}.completion-modal-header{background:#ffffff1a;padding:1.5rem 2rem;border-bottom:2px solid rgba(255,255,255,.2)}.completion-modal-title{font-size:2rem;font-weight:700;color:#fff;margin:0;text-align:center;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.completion-modal-content{padding:2rem;color:#fff;font-size:1.25rem;line-height:1.6;text-align:center}.completion-modal-line{margin:.5rem 0;text-shadow:1px 1px 2px rgba(0,0,0,.3)}.completion-modal-line:empty{height:.5rem}.completion-modal-actions{padding:1.5rem 2rem 2rem;display:flex;justify-content:center}.completion-modal-button{background:#fff;color:#667eea;border:none;border-radius:12px;padding:1rem 3rem;font-size:1.25rem;font-weight:700;cursor:pointer;box-shadow:0 4px 12px #0003;transition:all .3s cubic-bezier(.4,0,.2,1);min-width:120px}.completion-modal-button:hover{transform:translateY(-3px);box-shadow:0 8px 20px #0000004d;background:#f0f0f0}.completion-modal-button:active{transform:translateY(-1px);box-shadow:0 4px 12px #0003}.completion-modal-button:focus-visible{outline:3px solid #ffffff;outline-offset:3px}@keyframes modalBounceIn{0%{opacity:0;transform:scale(.3) translateY(-50px)}50%{opacity:1;transform:scale(1.05) translateY(0)}70%{transform:scale(.95)}to{transform:scale(1)}}@media (max-width: 768px){.completion-modal{width:90%;max-width:none}.completion-modal-title{font-size:1.5rem}.completion-modal-content{font-size:1.125rem;padding:1.5rem}.completion-modal-button{padding:.875rem 2.5rem;font-size:1.125rem}}@media (prefers-reduced-motion: reduce){.completion-modal-overlay,.completion-modal{animation:none}.completion-modal-button:hover,.completion-modal-button:active{transform:none}}.math-activity{position:fixed;inset:60px 0 0;display:flex;justify-content:center;align-items:center;transition:background-color .3s ease}.math-container{width:100%;max-width:800px;display:flex;flex-direction:column;align-items:center;gap:32px;padding:20px}.math-header{width:100%;display:flex;justify-content:space-between;align-items:center}.math-title{font-size:36px;color:#000;text-align:center;flex:1;margin:0;text-shadow:2px 2px 4px rgba(255,255,255,.5)}.math-question{background:#fffffff2;border:4px solid #000;border-radius:16px;padding:40px;box-shadow:0 4px 12px #0003}.equation{font-size:64px;font-weight:700;color:#000;text-align:center;font-family:Arial,sans-serif}.math-answers{display:flex;gap:24px;justify-content:center;flex-wrap:wrap}.answer-button{min-width:120px;height:80px;background:#fff;border:3px solid #000;border-radius:12px;font-size:40px;font-weight:700;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 8px #0000001a}.answer-button:hover{background:#ff0;transform:translateY(-4px);box-shadow:0 6px 16px #0003}.answer-button:active{transform:translateY(-2px)}.math-feedback{font-size:32px;font-weight:700;text-align:center;padding:16px 32px;border-radius:12px;min-height:60px;display:flex;flex-direction:column;gap:8px;justify-content:center;animation:fadeIn .3s ease;text-shadow:2px 2px 4px rgba(0,0,0,.1)}.math-feedback.correct{color:#0f0;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.math-feedback.wrong{color:red;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.math-feedback.complete{color:gold;font-size:28px;background:#000000b3;border-radius:12px;padding:24px}.math-score{font-size:28px;font-weight:700;color:#000;background:#ffffffe6;padding:12px 24px;border-radius:12px;border:2px solid #000;box-shadow:0 2px 8px #0000001a}@media (max-width: 768px){.math-title{font-size:28px}.equation{font-size:48px}.answer-button{min-width:100px;height:70px;font-size:32px}.math-feedback{font-size:24px}.math-score{font-size:22px}}.reading-activity{position:fixed;inset:60px 0 0;display:flex;justify-content:center;align-items:center;transition:background-color .3s ease}.reading-container{width:100%;max-width:800px;display:flex;flex-direction:column;align-items:center;gap:24px;padding:20px}.reading-header{width:100%;display:flex;justify-content:space-between;align-items:center}.reading-title{font-size:32px;color:#000;text-align:center;flex:1;margin:0;text-shadow:2px 2px 4px rgba(255,255,255,.5)}.letter-display{background:#fffffff2;border:4px solid #000;border-radius:20px;padding:40px 60px;box-shadow:0 4px 12px #0003;min-width:200px;text-align:center}.letter-large{font-size:150px;font-weight:700;color:#000;line-height:1;animation:letterPulse 2s infinite}.phonetic-hint{font-size:20px;color:#666;font-style:italic;margin-top:12px}.hear-again-button{padding:12px 24px;background:#ffffffe6;border:3px solid #000;border-radius:12px;font-size:20px;font-weight:700;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 8px #0000001a}.hear-again-button:hover{background:#ff0;transform:scale(1.05);box-shadow:0 4px 12px #0003}.hear-again-button:active{transform:scale(1.02)}.letter-answers{display:flex;gap:20px;justify-content:center;flex-wrap:wrap}.letter-button{min-width:140px;height:80px;background:#fff;border:3px solid #000;border-radius:12px;font-size:48px;font-weight:700;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 8px #0000001a}.letter-button:hover{background:#ff0;transform:translateY(-4px);box-shadow:0 6px 16px #0003}.letter-button:active{transform:translateY(-2px)}.reading-feedback{font-size:32px;font-weight:700;text-align:center;padding:16px 32px;border-radius:12px;min-height:60px;display:flex;flex-direction:column;gap:8px;justify-content:center;animation:fadeIn .3s ease}.reading-feedback.correct{color:#0f0;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.reading-feedback.wrong{color:red;text-shadow:2px 2px 4px rgba(0,0,0,.3);animation:shake .3s ease}.reading-feedback.complete{color:gold;font-size:28px;background:#000000b3;border-radius:12px;padding:24px}.reading-score{font-size:24px;font-weight:700;color:#000;background:#ffffffe6;padding:12px 24px;border-radius:12px;border:2px solid #000;box-shadow:0 2px 8px #0000001a}@keyframes letterPulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes fadeIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-10px)}75%{transform:translate(10px)}}@media (max-width: 768px){.reading-title{font-size:24px}.letter-large{font-size:120px}.letter-button{min-width:100px;height:70px;font-size:40px}.reading-feedback{font-size:24px}}.building-upgrade-container{position:fixed;inset:60px 0 0;background:linear-gradient(to bottom,#87ceeb,#e0f6ff 50%,#90ee90 50%,#76c776);overflow-y:auto}.building-upgrade-header{display:flex;justify-content:space-between;align-items:center;padding:20px 40px;background:#ffffffe6;border-bottom:2px solid #ddd;box-shadow:0 2px 10px #0000001a}.building-upgrade-header h1{margin:0;font-size:28px;color:#333}.header-resources{display:flex;gap:20px;font-size:18px;font-weight:700}.resource-display{display:flex;align-items:center;gap:5px;padding:8px 16px;background:#fffc;border-radius:20px;border:2px solid #ddd}.coin-icon{font-size:20px}.building-upgrade-content{padding:40px;max-width:1200px;margin:0 auto}.building-list h2{text-align:center;font-size:32px;margin-bottom:30px;color:#333;text-shadow:2px 2px 4px rgba(255,255,255,.8)}.building-grid{display:flex;flex-direction:row;justify-content:center;gap:20px;margin-bottom:40px;padding:10px 0;flex-wrap:nowrap}.building-card{background:#fff;border-radius:15px;padding:20px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 6px #0000001a;border:3px solid transparent;flex:1 1 0;min-width:180px;max-width:280px}.building-card:hover{transform:translateY(-5px);box-shadow:0 8px 15px #0003;border-color:#4caf50}.building-icon{position:relative;width:100%;height:150px;display:flex;align-items:center;justify-content:center;margin-bottom:15px;background:linear-gradient(to bottom,#87ceeb,#90ee90);border-radius:10px}.building-icon img{max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(2px 2px 4px rgba(0,0,0,.3))}.building-level-badge{position:absolute;top:10px;right:10px;background:#4caf50;color:#fff;padding:5px 12px;border-radius:15px;font-weight:700;font-size:14px;box-shadow:0 2px 4px #0003}.building-info h3{margin:0 0 5px;font-size:22px;color:#333}.building-level-name{margin:0 0 10px;font-size:14px;color:#4caf50;font-weight:700}.building-description{margin:0 0 15px;color:#666;font-size:14px;line-height:1.4}.upgrade-preview{padding:8px;background:#fff3cd;border-radius:5px;font-size:14px;font-weight:700;color:#856404;text-align:center}.max-level{padding:8px;background:#d4edda;border-radius:5px;font-size:14px;font-weight:700;color:#155724;text-align:center}.building-detail{background:#fff;border-radius:20px;padding:30px;box-shadow:0 8px 20px #00000026}.building-detail .back-button{margin-bottom:20px}.detail-content{max-width:800px;margin:0 auto}.detail-header{display:flex;align-items:center;gap:20px;margin-bottom:20px;padding-bottom:20px;border-bottom:2px solid #eee}.detail-icon{width:120px;height:120px;object-fit:contain;filter:drop-shadow(2px 2px 4px rgba(0,0,0,.3))}.detail-header h2{margin:0;font-size:32px;color:#333}.detail-level{margin:5px 0 0;font-size:18px;color:#4caf50;font-weight:700}.detail-description{font-size:16px;color:#666;line-height:1.6;margin-bottom:30px}.level-progression{margin-bottom:30px}.level-progression h3{margin:0 0 15px;font-size:20px;color:#333}.level-track{display:flex;justify-content:space-between;align-items:center;position:relative;padding:0 10px}.level-track:before{content:"";position:absolute;top:50%;left:10%;right:10%;height:4px;background:#ddd;z-index:0}.level-node{width:50px;height:50px;border-radius:50%;background:#fff;border:4px solid #ddd;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:18px;color:#999;z-index:1;position:relative}.level-node.completed{background:#4caf50;border-color:#4caf50;color:#fff}.level-node.next{border-color:orange;color:orange;animation:pulse 2s infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.upgrade-section{background:#f8f9fa;border-radius:15px;padding:25px;border:2px solid #e0e0e0}.upgrade-section h3{margin:0 0 20px;font-size:22px;color:#333}.upgrade-info{display:flex;flex-direction:column;gap:15px;margin-bottom:25px}.upgrade-stat{display:flex;justify-content:space-between;padding:12px 15px;background:#fff;border-radius:8px;font-size:16px}.stat-label{font-weight:700;color:#666}.stat-value{color:#333;font-weight:700}.upgrade-button{width:100%;padding:15px;background:#4caf50;color:#fff;border:none;border-radius:10px;font-size:18px;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 6px #4caf504d}.upgrade-button:hover:not(.disabled){background:#45a049;transform:translateY(-2px);box-shadow:0 6px 10px #4caf5066}.upgrade-button.disabled{background:#ccc;cursor:not-allowed;box-shadow:none}.max-level-message{text-align:center;padding:30px;background:linear-gradient(135deg,#d4edda,#c3e6cb);border-radius:15px;border:2px solid #28a745}.max-level-message h3{margin:0 0 10px;font-size:24px;color:#155724}.max-level-message p{margin:0;font-size:16px;color:#155724}@media (max-width: 768px){.building-upgrade-header{flex-direction:column;gap:15px;padding:15px 20px}.building-upgrade-content{padding:20px}.building-grid{gap:10px}.building-card{flex:1 1 0;min-width:150px;max-width:none;padding:15px}.building-icon{height:100px}.building-info h3{font-size:16px}.building-description{font-size:12px}.detail-header{flex-direction:column;text-align:center}.level-track{flex-wrap:wrap;gap:10px}.level-node{width:40px;height:40px;font-size:16px}}@media (max-width: 480px){.building-grid{gap:8px}.building-card{min-width:120px;padding:10px}.building-icon{height:80px}.building-info h3{font-size:14px}.building-level-name{font-size:12px}.building-description{font-size:11px}.building-level-badge{font-size:12px;padding:3px 8px}}.shop-view{width:100%;height:100vh;padding-top:60px;background:linear-gradient(135deg,#667eea,#764ba2);overflow-y:auto}.shop-header{display:flex;justify-content:space-between;align-items:center;padding:20px 3%;background:#0000004d;color:#fff}.shop-header h1{margin:0;font-size:clamp(20px,3vw,32px)}.shop-back-btn{padding:10px 20px;font-size:16px;font-weight:700;background:#4ecdc4;color:#000;border:3px solid black;border-radius:8px;cursor:pointer;transition:all .2s}.shop-back-btn:hover{background:#95e1d3;transform:scale(1.05)}.shop-stats{display:flex;gap:20px}.shop-stat{font-size:20px;font-weight:700;background:#fff3;padding:8px 16px;border-radius:20px}.shop-tabs{display:flex;gap:1%;padding:20px 3%;background:#0003;flex-wrap:wrap}.shop-tab{padding:12px 24px;font-size:16px;font-weight:700;background:#ffffff4d;color:#fff;border:2px solid transparent;border-radius:8px;cursor:pointer;transition:all .2s}.shop-tab:hover{background:#fff6}.shop-tab.active{background:#fff;color:#667eea;border-color:#667eea}.shop-feedback{margin:10px 3%;padding:15px;border-radius:8px;font-weight:700;text-align:center;animation:slideIn .3s ease}.shop-feedback.success{background:#2ecc71;color:#fff}.shop-feedback.error{background:#e74c3c;color:#fff}@keyframes slideIn{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}.shop-content{padding:30px 3%;min-height:400px}.shop-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:2%}.shop-item{background:#fff;border:3px solid black;border-radius:12px;padding:20px;text-align:center;transition:all .3s}.shop-item:hover{transform:translateY(-5px);box-shadow:5px 5px #0000004d}.shop-item.purchased{opacity:.7;background:#ecf0f1}.shop-item-icon{font-size:60px;margin-bottom:10px}.shop-item-name{margin:10px 0 5px;font-size:18px;color:#2c3e50}.shop-item-description{font-size:14px;color:#7f8c8d;margin-bottom:15px;min-height:40px}.shop-item-footer{margin-top:10px}.shop-buy-btn{padding:10px 20px;font-size:16px;font-weight:700;background:#f39c12;color:#fff;border:3px solid black;border-radius:8px;cursor:pointer;transition:all .2s}.shop-buy-btn:hover:not(:disabled){background:#f1c40f;transform:scale(1.05)}.shop-buy-btn:disabled{background:#bdc3c7;cursor:not-allowed;opacity:.6}.shop-owned{color:#27ae60;font-weight:700;font-size:16px}.shop-empty{text-align:center;padding:60px 20px;color:#fff;font-size:18px}.achievements-container{display:flex;flex-direction:column;gap:30px}.achievement-category{background:#ffffff1a;border-radius:12px;padding:2.5%}.category-title{color:#fff;font-size:clamp(20px,2.5vw,32px);margin-bottom:20px;text-transform:capitalize;border-bottom:3px solid rgba(255,255,255,.3);padding-bottom:10px}.achievement-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:2%}.achievement-item{background:#fff;border:3px solid black;border-radius:12px;padding:20px;text-align:center;transition:all .3s;min-height:200px;display:flex;flex-direction:column;justify-content:space-between}.achievement-item:hover{transform:translateY(-3px);box-shadow:5px 5px #0000004d}.achievement-item.locked{opacity:.6;filter:grayscale(50%)}.achievement-item.unlocked{box-shadow:0 0 20px #ffd70080;border-color:#f1c40f;background:linear-gradient(135deg,#fffaf0,#fff9e6)}.achievement-icon{font-size:60px;margin-bottom:12px}.achievement-name{margin:10px 0 8px;font-size:18px;font-weight:700;color:#2c3e50}.achievement-description{font-size:14px;color:#7f8c8d;margin-bottom:12px;min-height:40px;line-height:1.4}.achievement-progress{font-size:14px;font-weight:700}.achievement-complete{color:#27ae60}.achievement-progress-text{color:#3498db}.shop-footer{padding:20px 3%;text-align:center;background:#0000004d;color:#fff;font-size:clamp(14px,1.5vw,18px);font-weight:700}@media (max-width: 600px){.shop-content{padding:20px 2%}.shop-header,.shop-tabs,.shop-feedback,.shop-footer{padding-left:2%;padding-right:2%}.achievement-item,.shop-item{padding:12px}.achievement-icon,.shop-item-icon{font-size:45px}}.streak-popup-overlay{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:2000;animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.streak-popup{background:#fff;border-radius:20px;padding:40px;max-width:500px;width:90%;text-align:center;box-shadow:0 10px 40px #0000004d;animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translateY(50px);opacity:0}to{transform:translateY(0);opacity:1}}.streak-popup.celebration{background:linear-gradient(135deg,gold,#ffed4e);border:6px solid #ff6b00}.streak-popup-emoji{font-size:64px;margin-bottom:20px;animation:bounce .6s ease-out}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}.streak-popup-title{font-size:36px;font-weight:700;color:#000;margin:0 0 20px;text-shadow:2px 2px 4px rgba(0,0,0,.2)}.streak-popup-message{font-size:20px;color:#333;margin:0 0 30px;line-height:1.5}.streak-rewards{background:#ffffff80;border-radius:12px;padding:20px;margin:20px 0}.reward-item{display:flex;align-items:center;justify-content:center;margin:10px 0;font-size:18px;font-weight:700;color:#000}.reward-icon{font-size:28px;margin-right:10px}.reward-text{color:#000}.streak-popup-button{background:#ff6b00;color:#fff;border:none;border-radius:12px;padding:15px 40px;font-size:20px;font-weight:700;cursor:pointer;transition:all .2s;box-shadow:0 4px 8px #0003}.streak-popup-button:hover{background:#ff8c00;transform:translateY(-2px);box-shadow:0 6px 12px #0000004d}.streak-popup-button:active{transform:translateY(0);box-shadow:0 2px 4px #0003}.streak-popup.welcome-back{background:linear-gradient(135deg,#4ecdc4,#95e1d3);border:4px solid #38a89d}.streak-popup.welcome-back .streak-popup-title{font-size:32px}.streak-popup.welcome-back .streak-popup-button{background:#38a89d}.streak-popup.welcome-back .streak-popup-button:hover{background:#2d8b80}.settings-modal{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.settings-header{display:flex;justify-content:space-between;align-items:center;padding:24px;border-bottom:2px solid rgba(255,255,255,.2)}.settings-close-button{color:#fff!important}.settings-close-button:hover{background-color:#ffffff1a!important}.settings-content{padding:24px!important}.settings-section{margin-bottom:24px}.settings-section:last-child{margin-bottom:0}.settings-label{color:#fff!important;font-weight:700!important;font-size:1.1rem!important;margin-bottom:12px!important}.settings-section .MuiFormControlLabel-root{color:#fff;margin:8px 0}.settings-section .MuiRadio-root{color:#ffffffb3}.settings-section .MuiRadio-root.Mui-checked{color:#fff}.settings-section .MuiFormControlLabel-root:hover{background-color:#ffffff0d;border-radius:4px}.village-placeholder{position:fixed;inset:60px 0 0;background:linear-gradient(135deg,#4a9d4a,#5aad5a);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:32px;padding:20px}.village-placeholder h1{font-size:48px;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.3);margin:0}.village-placeholder p{font-size:24px;color:#fff;text-shadow:1px 1px 2px rgba(0,0,0,.3);margin:0}.building-button{min-width:200px;padding:20px 40px;font-size:32px;background:#fff;border:4px solid #000;border-radius:16px;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 12px #0003;font-weight:700}.building-button:hover{background:#ff0;transform:translateY(-4px) scale(1.05);box-shadow:0 8px 20px #0000004d}.building-button:active{transform:translateY(-2px) scale(1.02)}.coming-soon{position:fixed;inset:60px 0 0;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:32px;padding:20px}.coming-soon h1{font-size:56px;color:#fff;text-shadow:3px 3px 6px rgba(0,0,0,.4);margin:0}.coming-soon p{font-size:28px;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.4);margin:0}.back-button{padding:16px 32px;background:#fffffff2;border:3px solid #000;border-radius:12px;font-size:20px;font-weight:700;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 12px #0000004d}.back-button:hover{background:#ff0;transform:scale(1.05);box-shadow:0 6px 16px #0006}.back-button:active{transform:scale(1.02)}