*{box-sizing:border-box}body{margin:0;font-family:Inter,Arial,sans-serif;background:#f5f8ff;color:#17213b;line-height:1.6}.topbar{position:sticky;top:0;z-index:10;background:#fff;border-bottom:1px solid #e2e8f5;padding:13px max(16px,4vw);display:flex;align-items:center;justify-content:space-between}.brand{font-weight:900;font-size:1.45rem;color:#263b9f}.brand span{color:#ff7a00}.topbar nav{display:flex;gap:20px}.topbar a{color:#263b9f;text-decoration:none;font-weight:800;font-size:.9rem}.hero{max-width:1100px;margin:auto;padding:38px 18px 25px;display:flex;gap:28px;align-items:center}.hero h1{font-size:clamp(2rem,5vw,3.4rem);line-height:1.08;margin:5px 0 12px}.eyebrow{font-size:.78rem;font-weight:900;color:#ff6f00;letter-spacing:.08em}.lead{font-size:1.08rem;color:#52617d}.hero-art{min-width:175px;height:175px;border-radius:38px;background:linear-gradient(135deg,#dff4ff,#f4e9ff);position:relative;display:grid;place-items:center;box-shadow:0 15px 40px #263b9f18}.cube{font-size:3rem;font-weight:900;transform:rotate(-6deg)}.number{position:absolute;right:18px;bottom:16px;font-size:1.5rem;font-weight:900}.spark{position:absolute;top:18px;left:18px;color:#ff8b00;font-size:2rem}.panel{max-width:1100px;margin:16px auto;padding:22px;background:#fff;border:1px solid #e3e9f5;border-radius:22px;box-shadow:0 10px 30px #233d8d0b}.controls h2{margin-top:0}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.grid label{font-weight:800;display:flex;flex-direction:column;gap:6px}.grid input,.grid select{font:inherit;padding:12px;border:1px solid #cbd5e8;border-radius:12px;background:#fff}.grid small{font-weight:500;color:#69758b}.button-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;align-items:center}button{border:0;border-radius:12px;padding:12px 16px;font-weight:900;cursor:pointer;background:#edf1f8;color:#1b2b55}button.primary{background:#ff7a00;color:#fff;box-shadow:0 7px 18px #ff7a0030}.sound{font-weight:800}.tip{background:#f3f7ff;border-radius:12px;padding:10px 12px;margin-bottom:0}.status{display:flex;gap:20px;align-items:center;flex-wrap:wrap}.status button{margin-left:auto}.progress-wrap{max-width:1100px;margin:15px auto;text-align:center;font-size:.85rem;font-weight:800}.progress{height:14px;background:#dfe6f3;border-radius:99px;overflow:hidden}.progress span{display:block;height:100%;width:0;background:#ff7a00;transition:width .3s}.questions{max-width:1100px;margin:auto;display:grid;gap:14px}.qcard{background:#fff;border:1px solid #e0e7f3;border-radius:18px;padding:18px;box-shadow:0 8px 25px #263b9f0a;transition:.25s}.qcard.correct{border-color:#26a269;background:#f1fff7;animation:pop .35s}.qcard.wrong{border-color:#df3e55;background:#fff4f5;animation:shake .35s}.qtop{display:flex;gap:12px}.qnum{font-weight:900;color:#ff7a00;min-width:32px}.question{font-size:1.12rem;font-weight:800;flex:1}.answer-row{display:flex;gap:10px;margin-top:14px}.answer{width:100%;padding:13px;border:2px solid #d2daea;border-radius:12px;font-size:1rem}.answer.correct{border-color:#24a86b;background:#e9fff3;color:#08743f}.answer.wrong{border-color:#df3e55;background:#fff0f2;color:#b51f38}.feedback{font-weight:900;margin-top:8px}.feedback.ok{color:#168754}.feedback.no{color:#c62c45}.show{margin-top:8px;background:#edf4ff}.result{text-align:center;background:linear-gradient(135deg,#fff8e9,#eef7ff)}.result h2{font-size:2rem}.formula-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.formula-grid div{background:#f5f8ff;border-left:4px solid #ff7a00;padding:12px;border-radius:10px}.learn h3{color:#263b9f;margin-bottom:5px}.learn p{margin-top:5px}footer{text-align:center;padding:30px;color:#68748c}@keyframes pop{50%{transform:scale(1.015)}}@keyframes shake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}@media(max-width:800px){.hero{flex-direction:column;text-align:center}.hero-art{min-width:140px;width:140px;height:140px}.grid{grid-template-columns:1fr 1fr}.formula-grid{grid-template-columns:1fr 1fr}.topbar nav{gap:10px}}@media(max-width:520px){.topbar{padding:11px 12px}.brand{font-size:1.15rem}.topbar a{font-size:.76rem}.hero{padding:25px 12px 10px}.grid,.formula-grid{grid-template-columns:1fr}.panel{margin:12px 10px;padding:16px;border-radius:16px}.questions{margin:0 10px}.answer-row{flex-direction:column}.answer-row button{width:100%}.status button{margin-left:0;width:100%}.question{font-size:1rem}}\n