:root{--ink:#10264d;--muted:#67809f;--line:#dbe7f4;--card:#fff;--purple:#6c5ce7;--blue:#1f86ff;--pink:#ff4f8b;--orange:#ff7a35;--green:#23b26d;--yellow:#ffd74d;--shadow:0 22px 60px rgba(28,61,104,.14)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-rounded,"Nunito",system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);background:linear-gradient(180deg,#f4f8ff,#fbfdff 55%,#f2fbf6);min-height:100vh}.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(16px,4vw,56px);position:sticky;top:0;z-index:30;background:#fffffff0;border-bottom:1px solid var(--line);backdrop-filter:blur(10px)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}.brand-mark{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--purple),var(--blue));font-weight:950;box-shadow:0 10px 24px #5c69e833}.brand b{font-size:19px}.brand small{display:block;font-size:10px;letter-spacing:.09em;color:#7690ad;margin-top:2px}.top-actions{display:flex;align-items:center;gap:9px}.pill,.icon-btn,.cta,.back-btn,.text-btn{border:0;font:inherit;cursor:pointer}.pill{padding:11px 14px;border-radius:13px;background:#edf4ff;color:#294f7d;font-weight:850}.pill.ghost{background:#f7f9fd;border:1px solid var(--line);text-decoration:none}.icon-btn{width:44px;height:44px;border-radius:14px;background:#fff;border:1px solid var(--line);font-size:20px}.xp-pill{padding:11px 14px;border-radius:14px;background:#fff7d8;border:1px solid #ffe58a;font-weight:900;color:#735b0b}.app-shell{max-width:1320px;margin:0 auto;padding:32px 24px 70px}.view{display:none}.view.active{display:block}.hero-card{display:grid;grid-template-columns:1.08fr .92fr;border-radius:32px;overflow:hidden;background:linear-gradient(135deg,#fff6d4 0%,#fff 43%,#e8f8ff 100%);border:1px solid #e5eaf2;min-height:420px;box-shadow:var(--shadow)}.hero-copy{padding:44px 46px;display:flex;flex-direction:column;justify-content:center;position:relative;z-index:2}.eyebrow{display:inline-block;color:#7656d6;font-weight:950;letter-spacing:.12em;font-size:11px}.hero-copy h1{font-size:clamp(44px,5.6vw,72px);line-height:.92;letter-spacing:-.05em;margin:13px 0 18px}.hero-copy h1 span{background:linear-gradient(90deg,#ff6536,#ff3e88,#6c5ce7);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-copy p{font-size:17px;line-height:1.6;color:#58708d;max-width:640px;margin:0}.hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:25px}.cta{padding:14px 18px;border-radius:15px;background:linear-gradient(135deg,#ff6d32,#ff3f8b);color:#fff;font-weight:950;box-shadow:0 12px 25px #ff4f7840}.mini-stats{display:flex;gap:18px;flex-wrap:wrap;margin-top:22px;color:#5d7592;font-size:13px}.hero-world{position:relative;min-height:420px;overflow:hidden;background:linear-gradient(180deg,#aee8ff 0 56%,#85d874 56% 100%)}.hero-world:before{content:"";position:absolute;left:-5%;right:-5%;bottom:22%;height:84px;background:#f9d65e;transform:rotate(-3deg);border-top:8px solid #fff;border-bottom:8px solid #fff}.shop{position:absolute;font-size:105px;left:13%;bottom:31%;filter:drop-shadow(0 14px 8px #0002)}.go-kart{position:absolute;font-size:72px;left:20%;bottom:11%;animation:kart 4.7s ease-in-out infinite}.finish-flag{position:absolute;font-size:70px;right:9%;bottom:16%}.toy{position:absolute;font-size:52px;animation:float 3.4s ease-in-out infinite}.t1{left:7%;top:13%}.t2{right:26%;top:12%;animation-delay:.6s}.t3{right:7%;top:38%;animation-delay:1.2s}.float-card{position:absolute;background:#fffdf5;border:1px solid #fff;padding:10px 13px;border-radius:13px;font-weight:900;box-shadow:0 10px 24px #29486622;font-size:12px}.fc1{right:11%;top:10%;transform:rotate(4deg)}.fc2{left:41%;top:30%;transform:rotate(-4deg)}.sky-dot{position:absolute;width:22px;height:22px;border-radius:50%;background:#fff8;box-shadow:36px 8px 0 #fff6,72px -5px 0 #fff5}.d1{left:25%;top:10%}.d2{right:20%;top:53%;transform:scale(.6)}@keyframes float{50%{transform:translateY(-12px) rotate(5deg)}}@keyframes kart{50%{transform:translateX(55px) rotate(-2deg)}}.section-head{display:flex;justify-content:space-between;align-items:end;gap:14px;margin:38px 0 18px}.section-head h2{font-size:30px;margin:5px 0 0}.text-btn{background:none;color:#6a78a2;font-weight:800}.episode-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}.episode-card{position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:24px;padding:22px;min-height:235px;box-shadow:0 13px 34px rgba(28,61,104,.08);display:flex;flex-direction:column;transition:.2s transform,.2s box-shadow}.episode-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(28,61,104,.14)}.episode-card:after{content:"";position:absolute;width:120px;height:120px;border-radius:50%;right:-38px;top:-38px;background:var(--accent,#eee);opacity:.11}.ep-top{display:flex;justify-content:space-between;align-items:center}.ep-icon{font-size:39px}.ep-no{font-size:11px;font-weight:950;color:#6c7f9b;background:#f3f7fb;padding:6px 9px;border-radius:999px}.episode-card h3{font-size:21px;margin:13px 0 6px}.ep-sub{color:#7188a5;font-size:13px;min-height:36px}.ep-target{font-size:12px;line-height:1.45;color:#48637f;background:#f6f9fd;border-radius:12px;padding:10px;margin-top:10px}.ep-bottom{margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding-top:16px}.stars{letter-spacing:2px}.play-mini{border:0;padding:10px 13px;border-radius:12px;background:linear-gradient(135deg,#635bff,#2e82ff);color:#fff;font-weight:900;cursor:pointer}.teacher-love{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;margin-top:22px;background:linear-gradient(135deg,#f2f7ff,#fff);border:1px solid var(--line);border-radius:22px;padding:20px}.teacher-icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;font-size:28px;background:#fff;box-shadow:0 8px 20px #18416d18}.teacher-love h3{margin:0 0 5px}.teacher-love p{margin:0;color:#667f9c;line-height:1.5}.game-layout{display:grid;grid-template-columns:270px 1fr;gap:18px;min-height:calc(100vh - 142px)}.game-sidebar{background:#fff;border:1px solid var(--line);border-radius:24px;padding:18px;box-shadow:0 12px 32px #173d6910;align-self:start;position:sticky;top:96px}.back-btn{background:#eef4fb;color:#365675;border-radius:12px;padding:10px 12px;font-weight:850}.mission-title{font-size:24px;margin:18px 0 3px}.mission-sub{color:#748ba6;font-size:13px}.progress-wrap{height:10px;border-radius:99px;background:#edf2f8;overflow:hidden;margin:17px 0}.progress-bar{height:100%;width:0;background:linear-gradient(90deg,#ff7a35,#ff4f88,#6c5ce7);transition:.35s width}.side-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.side-stats span{background:#f7f9fc;border-radius:12px;padding:10px 5px;text-align:center;font-size:13px}.learning-target{margin-top:14px;border-radius:15px;padding:13px;background:#fff8df;color:#6d5a1c;font-size:12px;line-height:1.5}.race-mini{margin-top:15px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:7px}.race-mini[hidden]{display:none}.race-line{height:5px;background:repeating-linear-gradient(90deg,#b6c6d6 0 12px,#eaf0f5 12px 24px);border-radius:9px}.game-stage{min-width:0}.game-hud{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.stage-chip{display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:12px;font-weight:900}.audio-btn{border:1px solid var(--line);background:#fff;padding:9px 12px;border-radius:12px;font-weight:850;color:#365a7e;cursor:pointer}.game-canvas{min-height:540px;border-radius:28px;background:linear-gradient(180deg,#ffffff,#f7fbff);border:1px solid var(--line);box-shadow:var(--shadow);padding:28px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.game-canvas:before{content:"";position:absolute;width:240px;height:240px;border-radius:50%;background:#fff6c7;right:-100px;top:-100px;opacity:.65}.prompt-card{width:min(850px,100%);text-align:center;position:relative;z-index:2}.prompt-card h2{font-size:clamp(28px,4vw,42px);margin:10px 0}.subprompt{color:#657f9d;line-height:1.5;margin-bottom:18px}.visual{min-height:150px;display:flex;align-items:center;justify-content:center;gap:18px;margin:8px auto 18px}.toy-big{font-size:96px;filter:drop-shadow(0 12px 10px #0002);animation:popin .4s ease}.answer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;max-width:760px;margin:18px auto 0}.answer-btn{border:2px solid #e4ebf4;background:#fff;border-radius:17px;padding:15px;min-height:64px;font:inherit;font-weight:850;color:#234663;cursor:pointer;box-shadow:0 8px 18px #1f3e5c0b;transition:.18s}.answer-btn:hover{transform:translateY(-2px);border-color:#90b9ef}.answer-btn.correct{background:#eafaf0;border-color:#4ad083;color:#147a45}.answer-btn.wrong{background:#fff0f2;border-color:#ff7b91;color:#b9314a}.toy-shelf{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:18px}.toy-btn{border:2px solid #e4ebf4;background:#fff;border-radius:18px;min-height:112px;padding:8px;cursor:pointer;font:inherit;font-weight:850;color:#34516e;position:relative}.toy-btn b{display:block;font-size:43px;margin-bottom:4px}.toy-btn.correct{outline:4px solid #4bd38c;background:#edfff4}.toy-btn.wrong{outline:4px solid #ff8295;background:#fff2f4}.character-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.char{border:2px solid #e3eaf3;background:#fff;border-radius:20px;padding:12px;cursor:pointer}.char .face{font-size:55px}.char small{display:block;color:#758ca6;margin-top:5px}.char.correct{border-color:#41c97d;background:#effcf4}.char.wrong{border-color:#fb7185;background:#fff1f3}.garage{display:flex;align-items:end;justify-content:center;gap:22px;min-height:180px}.vehicle{display:flex;flex-direction:column;align-items:center;gap:5px}.vehicle .obj{font-size:75px;transform:scale(var(--scale,1));transform-origin:bottom}.vehicle small{color:#7287a1;font-weight:800}.word-chip{display:inline-block;padding:9px 12px;border-radius:999px;background:#fff0f6;color:#a92963;font-weight:950;margin:5px}.phonics-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.phonics-btn{border:2px solid #e2eaf4;background:#fff;border-radius:18px;padding:15px;font:inherit;font-weight:950;font-size:24px;color:#284967;cursor:pointer}.phonics-btn.correct{background:#edfff4;border-color:#44cc7f}.phonics-btn.wrong{background:#fff1f3;border-color:#ff7c91}.shape-board{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;align-items:center;margin:20px 0}.shape-btn{width:130px;height:120px;border:2px solid #e3ebf4;background:#fff;border-radius:18px;display:grid;place-items:center;cursor:pointer;position:relative}.shape-btn span{position:absolute;bottom:7px;font-size:11px;font-weight:850;color:#6b829d}.shape{width:65px;height:65px;background:linear-gradient(135deg,#ff8b38,#ff4e8f)}.shape.triangle{clip-path:polygon(50% 0,100% 100%,0 100%)}.shape.square{border-radius:5px}.shape.circle{border-radius:50%;background:linear-gradient(135deg,#55b7ff,#6c5ce7)}.shape.rectangle{width:88px;height:54px;background:linear-gradient(135deg,#42d392,#1ca7a8)}.shape.parallelogram{width:82px;height:55px;clip-path:polygon(20% 0,100% 0,80% 100%,0 100%);background:linear-gradient(135deg,#ffd34f,#ff8a36)}.shape-btn.correct{outline:4px solid #40c97c}.shape-btn.wrong{outline:4px solid #ff7b90}.race-scene{width:100%;padding:20px 8px}.track{height:155px;border-radius:28px;background:#3d4a5a;position:relative;overflow:hidden;border:8px solid #dce3e8}.track:before{content:"";position:absolute;left:0;right:0;top:50%;height:8px;background:repeating-linear-gradient(90deg,#fff 0 22px,transparent 22px 44px)}.player-car,.rival-car{position:absolute;font-size:55px;left:3%;transition:.55s left}.player-car{top:12px}.rival-car{bottom:9px}.flag{position:absolute;right:2%;top:42px;font-size:56px}.feedback{min-height:76px;padding-top:10px}.feedback-box{max-width:850px;margin:0 auto;border-radius:16px;padding:13px 16px;display:flex;gap:9px;align-items:flex-start;line-height:1.45}.feedback-box.good{background:#eafaf0;color:#167448}.feedback-box.bad{background:#fff0f2;color:#a8374d}.celebrate{text-align:center;position:relative;z-index:2}.celebrate .big{font-size:88px}.celebrate h2{font-size:42px;margin:7px}.result-stars{font-size:34px;letter-spacing:5px}.celebrate p{color:#637b98}.teacher-panel{background:#fff;border:1px solid var(--line);border-radius:28px;padding:28px;box-shadow:var(--shadow)}.report-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.report-card{background:#f7faff;border-radius:18px;padding:17px;border:1px solid #e5edf6}.report-card span{font-size:12px;color:#748ba5}.report-card b{display:block;font-size:26px;margin-top:6px}.report-table{margin-top:20px;border:1px solid var(--line);border-radius:18px;overflow:hidden}.report-row{display:grid;grid-template-columns:2.3fr .7fr .7fr .9fr;gap:10px;align-items:center;padding:14px 16px;border-top:1px solid #e8eef5}.report-row.head{border-top:0;background:#f2f6fb;font-size:12px;font-weight:950;color:#627994}.teacher-note{margin-top:18px;padding:17px;border-radius:17px;background:#fff8df;color:#6f5b1b}.teacher-note h3{margin:0 0 5px}.teacher-note p{margin:0;line-height:1.55}.modal{position:fixed;inset:0;background:#10264d99;z-index:100;display:grid;place-items:center;padding:20px}.modal[hidden]{display:none}.modal-card{width:min(860px,100%);max-height:88vh;overflow:auto;background:#fff;border-radius:25px;padding:26px;position:relative;box-shadow:0 28px 90px #0004}.modal-close{position:absolute;right:14px;top:14px;border:0;background:#eef3f8;border-radius:50%;width:36px;height:36px;font-size:20px;cursor:pointer}.learn-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.learn-card{border:1px solid var(--line);border-radius:16px;padding:14px;background:#f9fbfe;text-align:center}.learn-card button{border:0;background:#fff;border-radius:10px;padding:7px 10px;cursor:pointer}.learn-card .emo{font-size:35px}.confetti-piece{position:fixed;top:-20px;width:11px;height:18px;z-index:200;animation:fall 2.4s linear forwards}@keyframes fall{to{transform:translateY(110vh) rotate(660deg)}}@keyframes popin{from{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}@media(max-width:1000px){.episode-grid{grid-template-columns:repeat(2,1fr)}.hero-card{grid-template-columns:1fr}.hero-world{min-height:300px}.game-layout{grid-template-columns:1fr}.game-sidebar{position:static;display:grid;grid-template-columns:auto 1fr;gap:9px}.learning-target,.race-mini{grid-column:1/-1}.side-stats{grid-column:1/-1}.progress-wrap{grid-column:1/-1;margin:7px 0}.report-cards{grid-template-columns:repeat(2,1fr)}}@media(max-width:680px){.topbar{height:auto;padding:10px 13px;align-items:flex-start}.brand b{font-size:15px}.brand-mark{width:40px;height:40px}.top-actions{gap:5px}.xp-pill{display:none}.pill{padding:9px 10px;font-size:12px}.app-shell{padding:18px 12px 50px}.hero-copy{padding:28px 22px}.hero-copy h1{font-size:46px}.hero-world{min-height:260px}.episode-grid{grid-template-columns:1fr}.teacher-love{grid-template-columns:auto 1fr}.teacher-love .pill{grid-column:1/-1}.game-canvas{min-height:500px;padding:16px}.answer-grid{grid-template-columns:1fr}.toy-shelf{grid-template-columns:repeat(2,1fr)}.character-grid{grid-template-columns:repeat(2,1fr)}.phonics-tiles{grid-template-columns:repeat(2,1fr)}.report-cards{grid-template-columns:1fr 1fr}.report-row{grid-template-columns:1.6fr .55fr .6fr}.report-row span:last-child{display:none}.learn-grid{grid-template-columns:repeat(2,1fr)}}
