:root {
  --navy:#12297A; --blue:#1E4BC6; --lblue:#3B9EE8; --pale:#8FC4F5;
  --ink:#1F2937; --grey:#4A5568; --muted:#6B7280; --card:#F3F5FA; --line:#D5DAE3;
  --bg:#FDFDFE; --ok:#15803D; --bad:#B45309;
}
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:Arial, Helvetica, sans-serif; font-size:17px; line-height:1.4; }
header.top { background:var(--navy); color:#fff; padding:22px 16px 26px; }
header.top .kicker { font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--pale); font-weight:700; }
header.top h1 { font-size:24px; line-height:1.2; margin:8px 0 0; }
header.top p { margin:10px 0 0; color:#DCE6FA; font-size:15px; }
main { max-width:640px; margin:0 auto; padding:18px 16px 40px; }
.card { background:var(--card); border-radius:14px; padding:16px; margin:0 0 14px; }
.card .lab { font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--blue); font-weight:700; }
.card .q { font-weight:700; margin:8px 0 10px; }
.hint { background:var(--blue); color:#fff; border-radius:8px; padding:8px 12px; font-size:14px; margin:0 0 12px; }
.opts { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.opts.one { grid-template-columns:1fr; }
.opts label { display:flex; align-items:center; gap:8px; background:#fff; border:1.5px solid var(--line); border-radius:10px;
  padding:12px; cursor:pointer; font-size:16px; min-height:48px; }
.opts input { accent-color:var(--blue); width:18px; height:18px; margin:0; flex:none; }
.opts label:has(input:checked) { border-color:var(--blue); background:#E8EEFC; font-weight:700; }
textarea { width:100%; min-height:130px; font:inherit; padding:12px; border:1.5px solid var(--line); border-radius:12px; resize:vertical; background:#fff; }
textarea:focus { outline:none; border-color:var(--blue); }
button.main { width:100%; background:var(--blue); color:#fff; border:0; border-radius:12px; padding:16px; font-size:17px; font-weight:700; cursor:pointer; }
button.main:disabled { opacity:.5; }
.done { text-align:center; padding:40px 8px; }
.done .big { font-size:48px; color:var(--blue); font-weight:700; }
.muted { color:var(--muted); font-size:14px; }
.err { color:#B91C1C; font-size:14px; margin-top:8px; min-height:1em; }
a { color:var(--blue); }
