:root{--ink:#70431f;--muted:#aa8769;--cream:#fffaf4;--line:#eadac9;--orange:#f5b553;--peach:#ffe0bd;--yellow:#ffe690;--mint:#75d4b2;--blue:#b9e0f6;--pink:#f9c1d7}*{box-sizing:border-box}body{margin:0;background:#fff7ee;color:var(--ink);font-family:"Baloo 2","Noto Sans SC",sans-serif;font-weight:700}.app-shell{min-height:100vh;display:grid;grid-template-columns:285px 1fr;background:radial-gradient(circle at 95% 0,#fff 0,transparent 26%),#fff8ef}.sidebar{padding:22px 14px;background:#fff0dc;border-right:3px solid #f4dfc7;display:flex;flex-direction:column;gap:11px}.brand{text-align:center;padding:0 0 13px}.brand h1{font-size:25px;margin:6px 0 0}.brand p,.tiny{margin:0;color:var(--muted);font-size:14px}.sun-face{margin:auto;width:48px;height:48px;border:3px solid #e9a453;border-radius:50%;display:grid;place-items:center;color:#88562b;font-size:20px;box-shadow:0 2px 0 #d58b3b}.sidebar nav{display:grid;gap:10px}.nav-item{width:100%;border:0;border-radius:17px;padding:14px 18px;background:#fff;color:var(--ink);font:inherit;font-size:19px;text-align:left;cursor:pointer;box-shadow:0 2px 0 #f3e4d5;transition:.18s}.nav-item:hover{transform:translateX(3px)}.nav-item.active{background:#ffd8b3;outline:3px solid #dc9550}.nav-icon{display:inline-grid;place-items:center;width:31px;height:31px;border-radius:9px;margin-right:13px;background:var(--yellow);font-size:18px}.stars-box{background:#ffe997;border-radius:15px;padding:13px 15px;font-size:18px;display:flex;justify-content:space-between}.side-actions{display:flex;gap:9px}.side-actions button,.parent{border:2px solid #7dcfb0;background:#dcf5e9;border-radius:12px;color:#426f60;padding:8px 4px;font:inherit;font-size:15px;flex:1}.side-actions button+button{border-color:#eab6cf;background:#ffe4f1;color:#955276}.parent{width:100%;border-color:#9fc8e0;background:#dff1fc;color:#476a84}.tiny{text-align:center;margin-top:auto;font-size:12px}main{padding:22px 30px 42px;max-width:1280px;width:100%;margin:auto}header{height:72px;background:#fff;border-radius:0 0 22px 22px;display:flex;align-items:center;justify-content:space-between;padding:0 28px;box-shadow:0 6px 18px #e5cfae38}header h2{font-size:30px;margin:0}.score{border:2px solid #e7ba47;background:#ffeb9d;border-radius:28px;padding:8px 21px;font-size:20px}.hero,.learning-panel{background:#fff;border-radius:28px;margin-top:22px;padding:38px;box-shadow:0 8px 22px #e5cfae30}.hero{text-align:center;min-height:600px}.hero h3{font-size:38px;margin:15px 0 0}.hero p{color:var(--muted);font-size:20px;margin:0}.animal-parade{font-size:58px;letter-spacing:12px;margin:25px auto}.lesson-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:800px;margin:15px auto}.lesson-card{min-height:160px;border:3px solid var(--line);border-radius:23px;background:#fffdf9;color:var(--ink);font:inherit;font-size:25px;cursor:pointer;transition:.2s;box-shadow:0 3px 0 #f1e8dd}.lesson-card:hover{transform:translateY(-5px);border-color:#e9b579}.lesson-icon{margin:auto auto 8px;display:grid;place-items:center;width:54px;height:54px;border-radius:14px;background:var(--yellow);font-size:29px}.lesson-card:nth-child(2) .lesson-icon{background:var(--blue)}.lesson-card:nth-child(3) .lesson-icon,.lesson-card:nth-child(6) .lesson-icon{background:#bcebd9}.lesson-card:nth-child(4) .lesson-icon{background:#ffd5e5}.tabs{display:flex;flex-wrap:wrap;gap:12px;margin:8px 0 20px}.tab{background:#fff;border:2px solid var(--line);border-radius:13px;padding:8px 19px;color:var(--ink);font:inherit;font-size:17px;cursor:pointer}.tab.active{background:#ffdab3;border-color:#dd9954;box-shadow:inset 0 0 0 1px #eca55d}.hint{color:#d68b44;font-size:18px;margin-bottom:17px}.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:17px}.study-card{min-height:190px;border:3px solid var(--line);border-radius:23px;background:#fffdfb;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:.18s}.study-card:hover{transform:translateY(-4px);border-color:#e5aa68}.study-card .emoji{font-size:48px}.study-card .big-character{font-size:60px;line-height:1}.study-card b{font-size:27px;margin-top:8px}.study-card small{font-size:15px;color:var(--muted)}.stroke-btn{margin-top:9px;border:2px solid #a5c1c4;background:#eaf5f4;border-radius:9px;color:#5c7779;padding:3px 13px;font:inherit;cursor:pointer}.poem{max-width:640px;margin:auto;text-align:center;background:#fff9ea;border:3px dashed #edc984;border-radius:25px;padding:32px;font-size:23px;line-height:2}.poem h3{font-size:30px;margin:0 0 10px}.math-problem{text-align:center;max-width:650px;margin:30px auto;font-size:50px}.answer-row{display:flex;justify-content:center;gap:12px}.answer-row input{width:105px;border:3px solid var(--line);border-radius:13px;font:inherit;font-size:24px;text-align:center;color:var(--ink)}.answer-row button,.primary-btn{border:0;border-radius:13px;background:#5dceb0;color:white;padding:10px 23px;font:inherit;font-size:18px;cursor:pointer;box-shadow:0 3px 0 #38a084}.modal-backdrop{display:none;position:fixed;inset:0;background:#6b442a75;align-items:center;justify-content:center;padding:20px}.modal-backdrop.show{display:flex}.modal{position:relative;width:min(560px,100%);background:#fffaf4;border-radius:28px;padding:42px;text-align:center;box-shadow:0 14px 45px #3d210a66}.modal-x{position:absolute;right:17px;top:12px;border:0;background:none;color:var(--ink);font-size:33px;cursor:pointer}.modal h3{font-size:29px;margin:0}.modal .demo-char{font-size:130px;line-height:1.3;color:#7c431a}.modal p{color:var(--muted);font-size:17px}.modal-actions{display:flex;gap:14px;justify-content:center;margin-top:20px}.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,80px);background:#70431f;color:#fff;padding:11px 20px;border-radius:24px;opacity:0;transition:.25s;z-index:4}.toast.show{transform:translate(-50%,0);opacity:1}@media(max-width:760px){.app-shell{grid-template-columns:1fr}.sidebar{padding:12px;display:block}.brand{display:none}.sidebar nav{grid-template-columns:repeat(3,1fr);gap:7px}.nav-item{font-size:14px;padding:8px}.nav-icon{display:none}.stars-box,.side-actions,.parent,.tiny{display:none}main{padding:0 12px 22px}.hero,.learning-panel{padding:22px 16px}.hero h3{font-size:27px}.animal-parade{font-size:38px;letter-spacing:3px}.lesson-grid{grid-template-columns:repeat(2,1fr)}.lesson-card{min-height:115px;font-size:19px}.card-grid{grid-template-columns:repeat(2,1fr)}.study-card{min-height:150px}.math-problem{font-size:38px}}
