*{box-sizing:border-box}:root{--blue:#2563eb;--ink:#172033;--muted:#66758a;--bg:#f4f7fb;--line:#dbe4ef;--good:#087a48;--bad:#c72f42;--purple:#7c3db4}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif}header{position:sticky;top:0;z-index:10;background:#fff;border-bottom:1px solid var(--line)}.nav{max-width:1180px;margin:auto;padding:12px 16px;display:flex;justify-content:space-between;align-items:center}.logo{font-size:22px;font-weight:950;color:var(--blue);text-decoration:none}.logo b{color:#111}.tag{font-size:9px;letter-spacing:1.4px;font-weight:900;color:#738196}
main{max-width:1180px;margin:auto;padding:0 12px 40px}.hero{text-align:center;padding:34px 8px 20px}.eyebrow{font-size:10px;font-weight:950;color:var(--blue);letter-spacing:2px}h1{font-size:clamp(31px,6vw,55px);line-height:1.05;margin:9px 0}.hero p{max-width:850px;margin:auto;color:var(--muted);font-size:14px;line-height:1.8}.kid-art{display:flex;justify-content:center;gap:12px;margin-top:15px;flex-wrap:wrap}.kid-art span{display:grid;place-items:center;width:48px;height:48px;background:#fff;border:2px solid #e2e9f3;border-radius:16px;font-size:26px;box-shadow:0 5px 15px rgba(30,50,80,.07);animation:bob 2.8s ease-in-out infinite}.kid-art span:nth-child(2n){animation-delay:.25s}@keyframes bob{50%{transform:translateY(-5px) rotate(2deg)}}
.card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;margin:10px 0;box-shadow:0 8px 28px rgba(20,40,80,.06)}.controls{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.field label{display:block;font-size:9px;font-weight:950;color:#65748a}select{width:100%;height:43px;margin-top:6px;border:1px solid #cbd7e6;border-radius:9px;background:#fff;padding:0 10px;font-weight:800}.actions{display:grid;grid-template-columns:1fr 1fr 1fr;gap:9px;margin-top:12px}button{cursor:pointer;font-weight:950;border-radius:9px;padding:12px;border:0}.primary{background:var(--blue);color:#fff}.dark{background:#27354a;color:#fff}.outline{background:#fff;color:#27354a;border:1px solid #ccd8e6}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.stat{text-align:center;border:1px solid var(--line);border-radius:12px;padding:10px}.stat small{display:block;font-size:8px;color:#7c8899;font-weight:900}.stat strong{display:block;margin-top:4px;color:var(--blue);font-size:18px}.progress-head{display:flex;justify-content:space-between;font-size:10px;font-weight:900;margin-bottom:8px}.track{height:13px;background:#e7edf5;border-radius:30px;overflow:hidden}.bar{height:100%;width:0;background:linear-gradient(90deg,var(--blue),#73a0ff);transition:.3s}
.sheet-head{display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--line);padding-bottom:13px}.sheet-head h2{margin:0;font-size:21px}.sheet-head small{color:var(--muted)}.pdf{background:var(--good);color:#fff}.notice{padding:12px 14px;margin:14px 0;background:#fff8df;border:1px solid #efd382;border-radius:10px;color:#765900;font-size:10px}.tip{padding:12px 14px;margin:10px 0;background:#edf4ff;border:1px solid #cfe0ff;border-radius:10px;color:#174caa;font-size:11px;line-height:1.6}
.graphics{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:14px 0}.graphics div{background:#f7faff;border:1px solid #dbe5f2;border-radius:13px;text-align:center;padding:13px 3px;font-size:24px}.graphics b{display:block;font-size:8px;margin-top:4px}
.question{padding:21px 2px;border-bottom:1px solid #e7ecf2}.qtop{display:flex;gap:11px}.num{min-width:32px;color:var(--blue);font-size:17px;font-weight:950}.prompt{font-size:18px;line-height:1.65;font-weight:850;width:100%}.mathline{display:flex;align-items:center;gap:13px;flex-wrap:wrap;margin-top:8px;background:#f7faff;border:1px solid #dbe5f2;border-radius:12px;padding:10px 13px;color:#174caa;font-weight:950;font-size:22px}.frac{display:inline-flex;flex-direction:column;vertical-align:middle;text-align:center;line-height:1.05;min-width:35px}.frac .top{border-bottom:2px solid currentColor;padding:0 5px 3px}.frac .bottom{padding:3px 5px 0}
.answer-row{display:flex;gap:8px;flex-wrap:wrap;margin:11px 0 0 43px}.answer{height:45px;min-width:190px;flex:1;border:2px solid #cbd6e4;border-radius:9px;padding:8px 12px;font-size:17px;font-weight:900;outline:none}.answer:focus{border-color:var(--blue)}.answer.good{background:#eaf8f0;border-color:var(--good);color:var(--good)}.answer.bad{background:#fff0f2;border-color:var(--bad);color:var(--bad)}.check{background:var(--blue);color:#fff}.feedback{margin:7px 0 0 43px;min-height:15px;font-size:10px;font-weight:900}.goodtext{color:var(--good)}.badtext{color:var(--bad)}.pop{animation:pop .45s}.shake{animation:shake .4s}@keyframes pop{50%{transform:scale(1.07)}}@keyframes shake{20%{transform:translateX(-7px)}40%{transform:translateX(7px)}60%{transform:translateX(-5px)}80%{transform:translateX(5px)}}
.finish{text-align:center;padding-top:18px}.finish button{background:var(--purple);color:#fff}.result{max-width:560px;margin:14px auto 0;text-align:center;padding:17px;background:#edf9f1;border:1px solid #bde2ce;border-radius:13px}.result b{display:block;font-size:34px;color:var(--good)}.hidden{display:none!important}.answerkey{display:grid;grid-template-columns:1fr 1fr;gap:8px}.answerkey div{padding:9px;background:#f8fafc;border:1px solid var(--line);border-radius:8px;font-size:9px}.answerkey span{display:block;color:var(--good);font-weight:900;margin-top:4px}.small-note,.seo p,.seo li{font-size:11px;line-height:1.9;color:var(--muted)}.seo h3{font-size:15px;margin-top:22px}footer{max-width:1180px;margin:auto;padding:10px 16px 40px;color:#7a8798;font-size:9px;display:flex;justify-content:space-between}
@media(max-width:900px){.controls{grid-template-columns:1fr 1fr}.graphics{grid-template-columns:repeat(3,1fr)}}@media(max-width:600px){.nav{padding:10px 12px}.logo{font-size:18px}.tag{font-size:6px}.hero{padding:27px 5px 18px}.hero p{font-size:12px}.card{padding:13px;margin:7px 0}.controls,.actions{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}.graphics{grid-template-columns:repeat(2,1fr)}.sheet-head{align-items:stretch;flex-direction:column}.pdf{width:100%}.prompt{font-size:16px}.mathline{font-size:19px}.answer-row,.feedback{margin-left:39px}.answer,.check{width:100%}.answerkey{grid-template-columns:1fr}footer{display:block;text-align:center}footer span{display:block;margin-top:6px}}