:root{--blue:#2A6F97;--light:#6EC1E4;--orange:#F7941D;--red:#F04444;--bg:#F4FAFD;--ink:#1F2E3B;--muted:#667789;--border:#D9E8F0;--good:#166534;--bad:#B42318}
*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;background:linear-gradient(180deg,#F8FDFF,var(--bg));color:var(--ink)}
main{max-width:1150px;margin:22px auto;padding:0 14px}
header{display:flex;justify-content:space-between;align-items:center;background:white;border:1px solid var(--border);border-radius:24px;padding:16px 20px;box-shadow:0 18px 38px #17304014;gap:16px}
.brand{font-size:clamp(2rem,4vw,3rem);font-weight:900;letter-spacing:-.03em}.brand span{color:var(--blue)}.brand b{color:var(--orange)}.brand strong{color:var(--red)}header p{margin:4px 0 0;color:var(--blue);font-weight:800}.pill{background:#EAF7FC;border:1px solid var(--border);color:var(--blue);font-weight:900;padding:10px 14px;border-radius:999px}
.hero{margin:20px 0;padding:26px;border-radius:28px;background:linear-gradient(135deg,var(--blue),var(--light));color:white;display:grid;grid-template-columns:1.4fr .4fr;gap:18px;align-items:center;box-shadow:0 18px 38px #17304017}.hero h1{font-size:clamp(2rem,4vw,3.4rem);line-height:1;margin:0 0 10px}.hero p{line-height:1.5}.eyebrow{text-transform:uppercase;letter-spacing:.08em;font-weight:900;font-size:.82rem}.note{background:#ffffff2c;border:1px solid #ffffff55;padding:12px;border-radius:14px;font-weight:700}.scorebox{justify-self:center;background:#ffffff30;border-radius:50%;width:160px;height:160px;display:grid;place-items:center;text-align:center}.scorebox span{font-size:3.4rem;font-weight:900}.scorebox small{font-weight:900;text-transform:uppercase}
.student,.controls{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}.student input{flex:1;min-width:200px}.student button,.controls button,.result button{border:0;border-radius:14px;padding:13px 16px;font-weight:900;cursor:pointer;background:#EAF7FC;color:var(--blue)}.controls button.primary{background:var(--orange);color:white}.controls button.danger{background:#FDEBEC;color:#C23636}
input{padding:13px;border:1px solid var(--border);border-radius:14px;font-size:1rem}
.question-list{display:grid;gap:14px}.qcard{background:white;border:1px solid var(--border);border-radius:20px;padding:18px;box-shadow:0 10px 26px #1730400d}.qtop{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:10px}.qnum{font-weight:900;color:var(--blue)}.cat{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:900}.qcard h3{margin:8px 0 14px;font-size:1.18rem}
.options{display:grid;gap:10px}.option{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--border);border-radius:14px;padding:12px;cursor:pointer;background:#FBFEFF}.option input{margin-top:2px}.letter{font-weight:900;color:var(--blue);min-width:22px}.option.selected{border-color:var(--blue);background:#F0FAFE}
.qcard.correct{border-color:#A7F3D0;background:#F6FEF9}.qcard.incorrect{border-color:#FECACA;background:#FFFBFA}.feedback{display:none;margin-top:12px;padding:12px;border-radius:14px;background:#F7FBFD;border:1px solid var(--border)}.feedback.show{display:block}.feedback b.good{color:var(--good)}.feedback b.bad{color:var(--bad)}
.result{background:white;border:1px solid var(--border);border-radius:22px;padding:20px;margin-bottom:16px;box-shadow:0 18px 38px #17304014}.result h2{margin:0;color:var(--blue)}.hidden{display:none!important}
@media(max-width:780px){header,.hero{grid-template-columns:1fr}.scorebox{justify-self:start}.student,.controls{display:grid}.student input,.student button,.controls button{width:100%}}
@media print{.student,.controls,.pill,#downloadCsvBtn,#printBtn{display:none!important}body{background:white}.qcard{break-inside:avoid;box-shadow:none}}