:root{--ink:#183153;--line:#dbe6f4}*{box-sizing:border-box}body{margin:0;background:linear-gradient(180deg,#f1f7ff,#fffaf1 55%,#f7f3ff);font-family:system-ui,Arial,sans-serif;color:var(--ink);line-height:1.55}a{color:inherit}.topbar{background:#fff;box-shadow:0 3px 18px #23436a14;position:sticky;top:0;z-index:10}.nav{max-width:1180px;margin:auto;display:flex;align-items:center;gap:12px;padding:10px 16px}.logo{display:flex;align-items:center;gap:8px;text-decoration:none;font-weight:900;color:#2453ad}.logo-mark{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,#ffce54,#ff8a9c,#8d74ff);font-size:23px}.menu{font-size:.9rem;font-weight:800;margin-left:8px}.menu a{text-decoration:none}.menu span{color:#9daec4;padding:0 7px}.nav-right{margin-left:auto;font-size:.8rem;color:#5d7090;font-weight:700}main{max-width:1180px;margin:auto;padding:18px 15px 48px}.hero{overflow:hidden;border-radius:28px;padding:clamp(22px,5vw,52px);background:linear-gradient(120deg,#d9f5ff,#e9e1ff 54%,#fff0c9);box-shadow:0 12px 34px #425d8018}.hero-grid{display:grid;grid-template-columns:1.5fr .8fr;align-items:center;gap:18px}.eyebrow,.pill{display:inline-block;padding:6px 12px;background:#fff;border-radius:99px;font-size:.8rem;font-weight:900;color:#5a54bb}.hero h1{font-size:clamp(2rem,5vw,3.5rem);line-height:1.08;margin:15px 0;letter-spacing:-1px}.hero p{font-size:1.05rem;max-width:680px}.hero-art{font-size:clamp(4rem,9vw,7rem);text-align:center;animation:bob 3s ease-in-out infinite}@keyframes bob{50%{transform:translateY(-10px) rotate(3deg)}}@keyframes pop{0%{transform:scale(.96)}65%{transform:scale(1.03)}100%{transform:scale(1)}}@keyframes wiggle{30%{transform:translateX(-4px)}70%{transform:translateX(4px)}}.stats{display:flex;gap:9px;flex-wrap:wrap;margin-top:20px}.stat{background:#ffffffc9;border:1px solid white;border-radius:14px;padding:8px 12px;font-weight:800;font-size:.84rem}.panel{background:#fff;border:1px solid var(--line);border-radius:22px;padding:20px;margin-top:18px;box-shadow:0 7px 24px #294a7010}.panel h2{margin:0 0 8px;font-size:1.35rem}.panel-intro{margin:0 0 16px;color:#64748b}.controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.field label{display:block;font-size:.82rem;font-weight:850;margin-bottom:6px}.field select{width:100%;min-height:45px;border:1px solid #ccd9eb;border-radius:12px;padding:10px;background:#fff;color:var(--ink);font:inherit}.checks{display:flex;gap:14px;flex-wrap:wrap;margin-top:14px}.checks label{font-weight:700;font-size:.9rem}.buttons{display:flex;gap:9px;flex-wrap:wrap;margin-top:17px}.btn{border:0;border-radius:13px;padding:11px 16px;font-weight:900;font-size:.92rem;cursor:pointer;min-height:44px}.primary{background:linear-gradient(135deg,#3478f6,#7c5ce7);color:white}.secondary{background:#e9f1ff;color:#234f9b}.warm{background:#fff0c4;color:#6e4c00}.green{background:#dff8e9;color:#116c40}.redbtn{background:#ffe5eb;color:#a51e39}.notice{margin-top:12px;background:#f2f6ff;border-radius:12px;padding:10px 12px;font-weight:750;font-size:.9rem}.progress-wrap{margin-top:18px}.progress-meta{display:flex;justify-content:space-between;gap:10px;font-size:.86rem;font-weight:850;margin-bottom:7px}.progress{height:13px;background:#eaf0f8;border-radius:99px;overflow:hidden}.progress>div{height:100%;width:0;background:linear-gradient(90deg,#4dd6a3,#4b8bf5,#9b70ed);transition:width .25s}.test-head{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.timer{padding:8px 12px;background:#fff4c9;border-radius:12px;font-weight:900;align-self:start}.question-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin-top:14px}.qcard{background:white;border:1px solid #dbe5f3;border-radius:18px;padding:16px;overflow:hidden}.qcard.correct{border:2px solid #38b778;background:#f0fff7;animation:pop .28s}.qcard.wrong{border:2px solid #ed6b83;background:#fff3f5;animation:wiggle .28s}.qtop{display:flex;gap:10px;align-items:flex-start}.qemoji{font-size:1.9rem;min-width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:#f1f5ff}.qnumber{font-size:.75rem;font-weight:900;color:#7b8aa3}.qtext{font-weight:800;margin-top:2px;overflow-wrap:anywhere}.qtopic{font-size:.75rem;color:#6f7f97;margin-top:4px}.answer{width:100%;min-height:45px;margin-top:13px;border:2px solid #d6e0ef;border-radius:12px;padding:10px;font:inherit;font-weight:700}.answer.correct{background:#e3ffed;border-color:#20a65e;color:#086335}.answer.wrong{background:#fff0f2;border-color:#d83f5b;color:#a01b33}.qactions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.qactions .btn{padding:8px 11px;min-height:38px;font-size:.82rem}.feedback{font-size:.86rem;font-weight:800;margin-top:8px;min-height:1.3em;padding:0}.feedback.visible{padding:8px 10px;border-radius:10px;background:#edf5ff}.answer-reveal{display:none;margin-top:8px;padding:9px 11px;background:#fff5cb;border-radius:10px;font-size:.9rem;font-weight:800}.answer-reveal.show{display:block}.result{display:none;background:linear-gradient(120deg,#dcfff0,#e6eaff);border:2px solid #b4efd0;border-radius:18px;padding:18px;margin-top:15px}.result.show{display:block;animation:pop .35s}.result-score{font-size:2rem;font-weight:1000;color:#2357af}.empty{padding:26px;text-align:center;color:#65758e;background:#f8fbff;border-radius:16px;grid-column:1/-1}.guide h2{color:#3e50b5;background:linear-gradient(90deg,#e9eaff,#fff);border-left:5px solid #8065e8;padding:8px 12px;border-radius:8px;margin-top:24px}.guide p{margin:8px 0 14px;color:#34465f}.guide-note{background:#fff4c9;border-radius:14px;padding:12px;font-weight:700}.footer{text-align:center;padding:24px;color:#667892;font-size:.88rem}.hidden{display:none!important}@media(max-width:780px){.hero-grid{grid-template-columns:1fr}.hero-art{order:-1;text-align:left;font-size:4rem}.controls{grid-template-columns:repeat(2,minmax(0,1fr))}.question-list{grid-template-columns:1fr}.nav-right{display:none}.menu{font-size:.8rem;margin-left:auto}.panel{padding:15px}}@media(max-width:390px){.controls{grid-template-columns:1fr}.menu span{padding:0 3px}.menu{font-size:.68rem}.nav{gap:5px}.logo{font-size:.85rem}.logo-mark{width:34px;height:34px}.hero{padding:20px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}@media print{body{background:#fff}.topbar,.hero,.controls-panel,.buttons,.qactions,.answer-reveal,.guide,.footer,.progress-wrap,.result,.notice{display:none!important}main{padding:0}.panel{border:0;box-shadow:none}.question-list{display:block}.qcard{break-inside:avoid;margin-bottom:10px;border:1px solid #bbb}}