:root{
  --navy:#1f3864; --accent:#2e74b5; --ink:#26272b; --muted:#6b7280;
  --line:#d9dee6; --bg:#f4f6f9; --ok:#1f7a4d; --no:#a83232; --card:#fff;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:16px;line-height:1.55}
.wrap{max-width:900px;margin:0 auto;padding:0 16px}
.topbar{background:var(--navy);color:#fff;padding:12px 0;margin-bottom:20px}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.brand{color:#fff;font-weight:700;text-decoration:none;font-size:17px}
.topbar nav{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.topbar a{color:#dbe6f5;text-decoration:none;font-size:14px}
.topbar a:hover{text-decoration:underline}
.who{color:#aebfd8;font-size:13px}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:18px;margin-bottom:16px}
.card.narrow{max-width:480px}
h1{font-size:24px;margin:0 0 8px;color:var(--navy)}
h2{font-size:18px;margin:0 0 10px;color:var(--accent)}
p{margin:0 0 10px}
.eyebrow{text-transform:uppercase;letter-spacing:.08em;font-size:11px;color:var(--muted);margin-bottom:2px}
.muted{color:var(--muted)}
.small{font-size:13px}
.hint{font-size:13px;color:var(--muted);margin-top:10px}
.bignum{font-size:44px;font-weight:700;color:var(--navy);margin:6px 0}
label{display:block;font-size:13px;color:var(--muted);margin:12px 0 4px}
input[type=text],input[type=password],select{width:100%;padding:10px;border:1px solid var(--line);
  border-radius:6px;font-size:15px;background:#fff;color:var(--ink)}
button.primary,.btnlink{display:inline-block;margin-top:14px;background:var(--accent);color:#fff;border:0;
  border-radius:6px;padding:10px 18px;font-size:15px;cursor:pointer;text-decoration:none}
button.primary:hover,.btnlink:hover{background:#255f97}
.linkbtn{background:none;border:0;color:#dbe6f5;font-size:14px;cursor:pointer;padding:0}
table .linkbtn{color:var(--accent)}
form.inline{display:inline}
.alert{padding:10px 12px;border-radius:6px;font-size:14px;border:1px solid var(--line)}
.alert.error,.alert.no{background:#fdeceb;border-color:#f0c2bd;color:var(--no)}
.alert.ok{background:#e9f6ee;border-color:#bde0ca;color:var(--ok)}
.alert.info{background:#eaf2fb;border-color:#c3d8ef;color:var(--navy)}
table{width:100%;border-collapse:collapse;margin-top:8px}
th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
th{background:#eef3f9;color:var(--navy);font-size:13px}
td{font-size:14px}
.tag{font-size:12px;padding:2px 8px;border-radius:99px;background:#eee;color:#555}
.tag.ok{background:#e9f6ee;color:var(--ok)}
.tag.no{background:#fdeceb;color:var(--no)}
.ladder{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.rung{flex:1 1 140px;border:1px solid var(--line);border-radius:8px;padding:10px;background:#fbfcfe}
.rung .num{display:inline-block;width:24px;height:24px;line-height:24px;text-align:center;border-radius:50%;
  background:#e5e9f0;color:#5b6b85;font-size:13px;font-weight:700;margin-right:8px}
.rung .nm{font-size:13px}
.rung.done{background:#e9f6ee;border-color:#bde0ca}
.rung.done .num{background:var(--ok);color:#fff}
.rung.current{background:#eaf2fb;border-color:var(--accent)}
.rung.current .num{background:var(--accent);color:#fff}
.soal .qno{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.qtext{font-weight:600;margin-bottom:10px}
.opt{display:flex;gap:10px;align-items:flex-start;margin:0 0 8px;padding:10px;border:1px solid var(--line);
  border-radius:6px;font-size:15px;color:var(--ink);cursor:pointer}
.opt:hover{background:#f7fafd}
.rinci{border-left:4px solid var(--line);padding:10px 0 10px 12px;margin-bottom:14px}
.rinci.benar{border-color:var(--ok)}
.rinci.salah{border-color:var(--no)}
.opts{margin:0;padding-left:18px;font-size:14px}
.opts .kunci{color:var(--ok);font-weight:600}
.opts .pilihan{color:var(--no)}
.pembahasan{font-size:13px;color:var(--muted);margin-top:8px;font-style:italic}
.foot{color:var(--muted);font-size:12px;padding:20px 16px 40px;text-align:center}