:root{--ink:#263052;--purple:#7457e8;--blue:#38a9e7;--coral:#ff6f61;--yellow:#ffd659;--paper:#fffdf8}
*{box-sizing:border-box}body{margin:0;font-family:"Segoe UI",Arial,sans-serif;color:var(--ink);background:linear-gradient(#9bdcff 0 45%,#dff7ff 70%,#f7fbda);min-height:100vh;overflow-x:hidden}body:after{content:"";position:fixed;left:0;right:0;bottom:0;height:18vh;background:#83d67c;border-radius:50% 50% 0 0/25% 25% 0 0;z-index:-1}.cloud{position:fixed;background:#fff;border-radius:50px;width:140px;height:42px;opacity:.75;z-index:-1}.cloud:before,.cloud:after{content:"";position:absolute;background:#fff;border-radius:50%}.cloud:before{width:58px;height:58px;left:22px;bottom:0}.cloud:after{width:74px;height:74px;right:16px;bottom:0}.c1{top:10%;left:4%}.c2{top:22%;right:4%;transform:scale(.75)}button,input,select,textarea{font:inherit}button{cursor:pointer;color:inherit}#app{max-width:900px;margin:auto;padding:18px 22px 50px}header{display:flex;align-items:center;gap:14px;margin-bottom:24px}.brand{border:0;background:transparent;font-size:25px;font-weight:900;letter-spacing:-1px}.score{margin-left:auto;background:#fff;border:3px solid #ffe184;border-radius:25px;padding:8px 17px;font-size:20px;font-weight:900;box-shadow:0 4px 0 #e8bd45}.icon-btn,.back,.lesson-picker{border:0;background:#fff;border-radius:15px;padding:10px 15px;font-weight:700;box-shadow:0 4px 0 #c9d9e0}.screen{display:none}.screen.active{display:block;animation:pop .3s ease}@keyframes pop{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.hero-card,.progress-card,.practice-card,.parent-card{background:rgba(255,255,255,.94);border-radius:26px;box-shadow:0 8px 0 rgba(56,73,115,.16);border:3px solid #fff}.hero-card{padding:24px 28px;display:flex;align-items:center;gap:20px}.mascot{font-size:82px;filter:drop-shadow(0 5px 0 #ffd659)}h1{margin:2px 0 8px;font-size:clamp(27px,5vw,44px);line-height:1.05}.eyebrow{margin:0;color:var(--purple);font-weight:900;letter-spacing:2px}.progress-card{margin:18px 0;padding:16px 22px}.row{display:flex;justify-content:space-between}.bar{height:14px;background:#e8edf4;border-radius:20px;margin-top:10px;overflow:hidden}.bar div{height:100%;width:0;background:linear-gradient(90deg,#ffd659,#ff9f43);border-radius:20px;transition:.4s}.activity-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.activity{border:0;color:white;border-radius:24px;min-height:190px;padding:18px;box-shadow:0 7px 0 rgba(30,40,80,.22);display:flex;flex-direction:column;align-items:center;justify-content:center;transition:.15s}.activity:hover{transform:translateY(-3px)}.activity:active{transform:translateY(4px);box-shadow:0 3px 0 rgba(30,40,80,.22)}.activity span{font-size:50px}.activity b{font-size:21px;margin:7px}.activity small{font-size:14px}.purple{background:var(--purple)}.blue{background:var(--blue)}.coral{background:var(--coral)}.lesson-picker{display:block;margin:23px auto}.practice-top{display:flex;align-items:center;gap:20px;margin-bottom:18px}.practice-top h2{margin:0}.practice-card{padding:30px;min-height:400px;text-align:center}.big-word{font-size:clamp(36px,8vw,66px);margin:20px 0;color:var(--purple)}.meaning{font-size:23px;max-width:600px;margin:18px auto;line-height:1.5}.speak{border:0;border-radius:50%;width:78px;height:78px;font-size:35px;background:#ffe383;box-shadow:0 6px 0 #eabb41}.primary,.next,.choice{border:0;border-radius:17px;padding:13px 22px;font-weight:800}.primary,.next{background:var(--purple);color:#fff;box-shadow:0 5px 0 #4f38b5}.next{margin-top:25px}.spell-input{display:block;margin:25px auto;width:min(390px,90%);font-size:30px;text-align:center;border:4px solid #b5c9ee;border-radius:17px;padding:12px;letter-spacing:3px}.choices{display:grid;gap:13px;max-width:600px;margin:25px auto}.choice{background:#f0edff;border:3px solid #d8d0ff;font-size:18px}.choice:hover{background:#ded7ff}.good{color:#26915b;font-weight:900;font-size:24px}.oops{color:#df4c4c;font-weight:900;font-size:21px}.lesson-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:15px}.lesson{background:#fff;border:3px solid #fff;border-radius:20px;padding:22px;box-shadow:0 6px 0 #cbd9dd;text-align:left}.lesson.selected{border-color:var(--yellow)}.lesson b{display:block;font-size:19px}.parent-card{text-align:left;padding:25px}.parent-card label{display:block;font-weight:800;margin:14px 0}.parent-card input,.parent-card select,.parent-card textarea{display:block;width:100%;margin-top:7px;border:2px solid #cdd7e7;border-radius:12px;padding:11px}.parent-card textarea{font-family:Consolas,monospace;line-height:1.5}.actions{display:flex;gap:12px;flex-wrap:wrap}.actions button{border:0;border-radius:12px;padding:11px 18px}.privacy{color:#60708b}#toast{position:fixed;left:50%;bottom:25px;transform:translateX(-50%) translateY(100px);background:#263052;color:white;padding:13px 22px;border-radius:30px;font-weight:800;transition:.3s;z-index:5}#toast.show{transform:translateX(-50%) translateY(0)}.stars-burst{font-size:70px;animation:pop .5s ease}
@media(max-width:650px){#app{padding:12px}.activity-grid{grid-template-columns:1fr}.activity{min-height:130px}.hero-card{padding:18px}.mascot{font-size:55px}.row{font-size:13px}.practice-card{padding:20px}}
.parent-btn{border:0;background:#fff;border-radius:15px;padding:10px 15px;font-weight:700;box-shadow:0 4px 0 #c9d9e0;white-space:nowrap}.add-words{display:flex;align-items:center;justify-content:center;gap:12px;width:min(460px,100%);margin:24px auto 0;border:3px dashed #7658de;background:#fff;border-radius:18px;padding:12px 18px;color:#5741ad}.add-words>span:first-child{font-size:27px}.add-words span:last-child{display:flex;flex-direction:column;text-align:left}.add-words small{font-weight:500;margin-top:2px}
@media(max-width:650px){.brand{font-size:21px}.parent-btn{font-size:0}.parent-btn:first-letter{font-size:20px}}
.streak{background:#fff3e1;border-radius:22px;padding:8px 12px;font-weight:900}.section-title{text-align:center;margin:25px 0 14px}.activity-grid{grid-template-columns:repeat(3,1fr)}.green{background:#42b883}.orange{background:#f39c3d}.pink{background:#df67a7}.quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}.quick-grid button{border:0;background:#fff;border-radius:16px;padding:14px;font-weight:800;box-shadow:0 4px 0 #c9d9e0}.center{text-align:center}.example{font-size:19px;color:#60708b;font-style:italic}.hint{font-weight:800;color:#7c65cf;min-height:24px}.scrambled{font-size:clamp(34px,7vw,58px);letter-spacing:7px;color:#e27642}.choice.correct{background:#bdf0cf}.choice.wrong{background:#ffd0ce}.shop-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px}.shop-item{background:#fff;border-radius:22px;padding:20px;text-align:center;box-shadow:0 6px 0 #cbd9dd;display:flex;flex-direction:column;gap:8px}.shop-item div{font-size:60px}.shop-item button{border:0;border-radius:12px;padding:9px;background:#7658de;color:#fff;font-weight:800}.shop-item button:disabled{background:#9aabc1}.report-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:18px}.report-cards div{background:#fff;border-radius:18px;padding:18px;text-align:center;box-shadow:0 5px 0 #cbd9dd}.report-cards b{display:block;font-size:28px;color:#7658de}.report-cards span{font-size:13px}.word-stat,.history-row{display:flex;justify-content:space-between;gap:12px;padding:11px 5px;border-bottom:1px solid #e5e8ef}.parent-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.import-row{display:flex;gap:10px;flex-wrap:wrap;margin:13px 0}.import-row button,.file-btn,.record-box button{border:0;border-radius:12px;padding:10px 14px;background:#eae6ff;font-weight:800;cursor:pointer}.file-btn input{display:none}.record-box{background:#f4f1ff;border-radius:16px;padding:15px;margin:15px 0}.record-box p{margin:6px 0}.record-box select{margin-right:10px;padding:8px;border-radius:9px}#photoPreview{display:flex;gap:12px;align-items:center}#photoPreview img{max-width:180px;max-height:130px;border-radius:12px}.privacy{font-size:13px}
@media(max-width:650px){.activity-grid{grid-template-columns:1fr}.quick-grid{grid-template-columns:1fr}.report-cards{grid-template-columns:repeat(2,1fr)}.parent-grid{grid-template-columns:1fr}.streak{display:none}.word-stat,.history-row{font-size:13px}.shop-grid{grid-template-columns:repeat(2,1fr)}}
.quick-grid{grid-template-columns:repeat(4,1fr)}.quick-grid .game-launch{color:#fff;background:linear-gradient(135deg,#ff7a59,#ec4c96);box-shadow:0 4px 0 #ad376d}
.shop-item{position:relative;border:3px solid transparent;padding-top:24px;overflow:hidden}.shop-item.equipped{border-color:#ffd659;background:#fffbea}.shop-item div{transition:.2s}.shop-item:hover div{transform:scale(1.12) rotate(-4deg)}.shop-tag{position:absolute;top:8px;right:8px;background:#eeeaff;color:#6248c1;border-radius:12px;padding:3px 8px;font-size:10px;font-weight:900;text-transform:uppercase}
.game-card{background:linear-gradient(160deg,#fff 55%,#f1edff);overflow:hidden}.game-hero{font-size:80px}.game-rules{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.game-rules span{background:#f0edff;border-radius:20px;padding:9px 13px;font-weight:800}.game-status{display:flex;justify-content:space-between;font-size:18px}.game-meter{height:12px;background:#e7eaf0;border-radius:20px;margin:12px 0 28px;overflow:hidden}.game-meter i{display:block;height:100%;background:linear-gradient(90deg,#ff7a59,#ec4c96);transition:.3s}.game-clue{max-width:650px;margin:25px auto;font-size:clamp(24px,5vw,38px);line-height:1.25}.game-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin:28px auto;max-width:700px}.game-choices button{border:3px solid #d8d0ff;border-radius:18px;background:#f0edff;padding:18px 10px;font-size:20px;font-weight:900}.game-choices button:hover{transform:translateY(-3px)}.game-choices button.correct{background:#bdf0cf;border-color:#63c98a}.game-choices button.wrong{background:#ffd0ce;border-color:#ef8580}.game-actions{justify-content:center}.game-actions button{font-weight:800}
@media(max-width:650px){.quick-grid{grid-template-columns:repeat(2,1fr)}.game-choices{grid-template-columns:1fr}}
.actions .danger{background:#ffe0de;color:#b83232;border:2px solid #f2a5a0;font-weight:800}.actions .danger:hover{background:#ffc9c5}
.word-image-box{background:#eef8ff;border-radius:16px;padding:15px;margin:15px 0}.word-image-box p{margin:6px 0}.word-image-box select,.word-image-box button{margin:8px 8px 8px 0;padding:9px;border:0;border-radius:10px}.word-image-box button{font-weight:800}.word-image-box .file-btn{display:inline-block;margin:8px 8px 8px 0}.word-image-box #imageStatus{font-weight:800;color:#26915b}.word-image-box #wordImagePreview img{display:block;max-width:180px;max-height:130px;object-fit:cover;border-radius:14px;margin-top:10px}.word-picture{display:block;width:min(280px,80%);height:180px;object-fit:cover;margin:12px auto;border-radius:20px;border:4px solid #fff;box-shadow:0 5px 0 #d7dfea}.word-picture.small{width:150px;height:105px}
.mascot-wrap{position:relative}.mascot-wrap #mascotBadge{position:absolute;right:-7px;bottom:3px;font-size:34px;filter:drop-shadow(0 2px 0 #fff)}body[data-theme="ocean"]{background:linear-gradient(#5bc8ed 0 45%,#b8f3ec 70%,#dfffd9)}body[data-theme="candy"]{background:linear-gradient(#ffb9df 0 45%,#d8c5ff 70%,#fff0ba)}body[data-theme="night"]{background:linear-gradient(#24245c 0 45%,#5656a0 70%,#b5a7db)}body[data-theme="sunset"]{background:linear-gradient(#ff8c70 0 40%,#ffc27b 68%,#fff0ae)}
.shop-tabs{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:18px 0 24px}.shop-tabs button{display:flex;align-items:center;gap:8px;border:3px solid #fff;background:#fff;border-radius:18px;padding:11px 16px;font-weight:900;box-shadow:0 4px 0 #cbd9dd}.shop-tabs button.active{border-color:#7658de;background:#eeeaff;color:#5a42b1}.shop-tabs small{display:inline-grid;place-items:center;min-width:23px;height:23px;padding:0 6px;border-radius:20px;background:#e3e8ef;color:#526079}.shop-tabs button.active small{background:#7658de;color:#fff}@media(max-width:650px){.shop-tabs{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}.shop-tabs button{justify-content:center;padding:10px 5px;font-size:12px}.shop-tabs small{display:none}}
.game-card{position:relative}.game-card.game-celebrate{animation:happyShake .55s ease}.game-praise{animation:praisePop .5s cubic-bezier(.2,1.6,.4,1);font-size:30px}.game-star-pop{position:absolute;z-index:4;font-size:30px;pointer-events:none;animation:starBurst .85s ease-out forwards}@keyframes happyShake{0%,100%{transform:none}20%{transform:translateX(-7px) rotate(-1deg)}40%{transform:translateX(7px) rotate(1deg)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}@keyframes praisePop{from{opacity:0;transform:scale(.45)}to{opacity:1;transform:scale(1)}}@keyframes starBurst{0%{opacity:0;transform:translate(0,0) scale(.3) rotate(0)}15%{opacity:1}100%{opacity:0;transform:translate(var(--x),var(--y)) scale(1.25) rotate(240deg)}}@media(prefers-reduced-motion:reduce){.game-card.game-celebrate,.game-praise,.game-star-pop{animation:none}}
.quick-grid .math-launch{grid-column:1/-1;color:#fff;background:linear-gradient(135deg,#24b7a6,#4b78e6);box-shadow:0 4px 0 #286e9c;font-size:18px}.math-hero{background:linear-gradient(135deg,#e2fff7,#e8eeff);border:3px solid #fff;border-radius:26px;padding:25px;text-align:center;box-shadow:0 7px 0 #c6d9df}.math-hero-icon{font-size:65px}.math-hero h2{font-size:clamp(27px,5vw,42px);margin:5px}.math-hero p{font-size:18px}.math-table-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:13px;margin-top:20px}.math-table-grid button{border:3px solid #fff;background:#fff;border-radius:20px;padding:17px 8px;box-shadow:0 5px 0 #c9d9e0}.math-table-grid button:hover{transform:translateY(-3px);border-color:#5fd5c5}.math-table-grid b{display:block;font-size:27px;color:#3d62bd}.math-table-grid small{display:block;margin-top:5px;color:#68758b}.math-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.math-toolbar button{border:0;border-radius:13px;background:#fff;padding:10px 15px;font-weight:800;box-shadow:0 4px 0 #c9d9e0}.math-toolbar .math-practice{background:#25aa8f;color:#fff;box-shadow:0 4px 0 #167461}.math-card{min-height:0}.math-fact{font-size:clamp(38px,9vw,72px);margin:14px 0;color:#354d91}.math-fact span{color:#ed6262}.math-picture{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;gap:7px;max-width:760px;margin:15px auto;max-height:310px;overflow:auto;padding:10px}.math-group{display:grid;grid-template-columns:repeat(5,10px);gap:4px;align-content:start;padding:8px;border:2px solid #8fd6cf;background:#e4fff9;border-radius:12px;min-height:32px}.math-group:nth-child(3n+2){background:#fff5d6;border-color:#f0c85c}.math-group:nth-child(3n){background:#f1e9ff;border-color:#b99be9}.math-group i{width:10px;height:10px;border-radius:50%;background:#397bd1}.math-explain{font-size:17px}.math-speak{width:58px;height:58px;font-size:25px}.math-nav{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:20px}.math-nav button,.math-answers button{border:0;border-radius:15px;padding:12px 18px;font-weight:900}.math-nav button{background:#e8eeff}.math-nav button:disabled{opacity:.4}.math-answers{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;max-width:650px;margin:22px auto}.math-answers button{background:#e8eeff;border:3px solid #b9c9f1;font-size:25px}.math-answers button.correct{background:#bdf0cf;border-color:#63c98a}.math-answers button.wrong{background:#ffd0ce;border-color:#ef8580}@media(max-width:650px){.math-table-grid{grid-template-columns:repeat(3,1fr)}.math-answers{grid-template-columns:repeat(2,1fr)}.math-toolbar{font-size:13px}.math-group{grid-template-columns:repeat(5,8px);gap:3px;padding:6px}.math-group i{width:8px;height:8px}.math-picture{max-height:260px}}
.math-levels{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:25px}.math-levels button{display:flex;flex-direction:column;align-items:center;gap:8px;border:3px solid #dbe4f6;background:#f8faff;border-radius:20px;padding:22px 12px;box-shadow:0 5px 0 #cbd9dd}.math-levels button:hover{border-color:#5fd5c5;transform:translateY(-3px)}.math-levels span{font-size:45px}.math-levels b{font-size:21px}.math-levels small{color:#64718b}.math-help{border:0;border-radius:15px;background:#fff0b8;padding:11px 18px;font-weight:900}.math-input-wrap{display:flex;justify-content:center;gap:12px;margin:28px auto}.math-input-wrap input{width:150px;border:4px solid #b9c9f1;border-radius:17px;padding:10px;text-align:center;font-size:34px;font-weight:900}.math-input-wrap button,.math-review button{border:0;border-radius:15px;padding:12px 20px;font-weight:900;background:#25aa8f;color:#fff}.math-review{background:#fff4cf;border-radius:18px;padding:18px;margin:18px auto;max-width:620px}.math-review p{font-size:19px}@media(max-width:650px){.math-levels{grid-template-columns:1fr}.math-levels button{padding:15px}.math-levels span{font-size:34px}}
.mixed-practice-launch{display:flex;align-items:center;justify-content:center;gap:14px;width:100%;margin:20px 0 4px;border:3px solid #fff;border-radius:22px;padding:17px;color:#fff;background:linear-gradient(135deg,#7658de,#24b7a6,#ff8c5a);box-shadow:0 6px 0 #6977a7}.mixed-practice-launch span{font-size:38px}.mixed-practice-launch b{font-size:22px}.mixed-practice-launch small{font-size:14px}.mixed-practice-launch:hover{transform:translateY(-3px)}.mixed-table-label{display:inline-block;margin:8px 0 0;padding:6px 14px;border-radius:20px;background:#e8eeff;color:#4b64a9;font-weight:900;letter-spacing:1px}@media(max-width:650px){.mixed-practice-launch{flex-wrap:wrap}.mixed-practice-launch small{width:100%}}