@font-face{
  font-family:'Quicksand';
  src:url('fonts/quicksand.woff2') format('woff2');
  font-weight:300 700;font-style:normal;font-display:swap;
}
:root{
  --slate:#4b6584;      /* wordmark slate — primary text */
  --ink:#2f4459;        /* headings */
  --teal:#0fb9b1;       /* brand teal — fills */
  --teal-ink:#0a7d76;   /* teal for text on light (AA) */
  --green:#37a06e;
  --coral:#cf5b3e;      /* semantic: warning / level 1 */
  --coral-ink:#c0442e;
  --amber:#e6a417;      /* semantic: partial / level 2 */
  --amber-ink:#a9760a;
  --bg:#eef3f7;         /* page */
  --card:#ffffff;
  --line:#dbe4ec;
  --mute:#5f7183;       /* muted text */
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Quicksand',"Segoe UI",-apple-system,Roboto,sans-serif;background:var(--bg);color:var(--slate);min-height:100vh;padding:28px 18px 60px;-webkit-font-smoothing:antialiased}
.wrap{max-width:640px;margin:0 auto}
.brand{display:flex;align-items:center;gap:12px;margin-bottom:22px}
.brand .logo{height:28px;width:auto;display:block}
.brand .sep{width:1px;height:22px;background:var(--line)}
.brand .tag{font-size:11px;color:var(--mute);letter-spacing:2px;text-transform:uppercase;font-weight:600}
h1{font-size:clamp(22px,5vw,30px);font-weight:700;line-height:1.15;color:var(--ink);letter-spacing:-.2px}
h1 span{color:var(--teal-ink)}
.sub{color:var(--mute);font-size:14px;margin:8px 0 22px;line-height:1.55}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:0 10px 30px rgba(31,57,84,.06)}
label{display:block;font-size:12.5px;color:var(--slate);font-weight:600;margin:14px 0 6px}
label:first-child{margin-top:0}
input,select{width:100%;padding:12px;border-radius:10px;border:1px solid var(--line);background:#fff;color:var(--ink);font-size:16px;font-family:inherit}
input:focus,select:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(15,185,177,.16)}
.consent{display:flex;gap:10px;align-items:flex-start;margin:16px 0;font-size:12px;color:var(--mute);line-height:1.55}
.consent input{width:auto;margin-top:2px;accent-color:var(--teal)}
.consent b{color:var(--slate)}
.btn{display:block;width:100%;padding:14px;border:none;border-radius:12px;background:var(--teal);color:#06312e;font-size:15px;font-weight:700;cursor:pointer;text-align:center;text-decoration:none;font-family:inherit;box-shadow:0 6px 16px rgba(15,185,177,.28)}
.btn:disabled{opacity:.5;box-shadow:none}
.btn.ghost{background:transparent;border:1.5px solid var(--teal);color:var(--teal-ink);box-shadow:none}
.err{color:var(--coral-ink);font-size:13px;margin-top:10px;display:none;font-weight:600}
.dim{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--teal-ink);font-weight:700;margin:20px 0 8px}
.q{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:9px;box-shadow:0 6px 18px rgba(31,57,84,.05)}
.q .txt{font-size:14px;margin-bottom:10px;line-height:1.45;color:var(--ink)}.q .txt b{color:var(--teal-ink)}
.opts{display:flex;gap:7px}
.opt{flex:1;text-align:center;padding:9px 4px;border-radius:9px;border:1px solid var(--line);background:#f4f8fb;cursor:pointer;font-size:12.5px;color:var(--slate);user-select:none;font-weight:600}
.opt.sel-2{background:var(--teal);border-color:var(--teal);color:#063f3b;font-weight:700}
.opt.sel-1{background:var(--amber);border-color:var(--amber);color:#4a3600;font-weight:700}
.opt.sel-0{background:var(--coral);border-color:var(--coral);color:#3d1207;font-weight:700}
.score{display:flex;align-items:baseline;gap:10px}.score .n{font-size:52px;font-weight:700;color:var(--teal-ink)}
.score .d{font-size:14px;color:var(--mute)}
.bar{height:9px;border-radius:6px;background:#e2e9f0;margin:14px 0 16px;overflow:hidden}
.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--coral),var(--amber),var(--teal))}
.lvl{font-size:19px;font-weight:700;margin-bottom:6px}
.rec{font-size:13.5px;line-height:1.65;color:var(--slate)}.rec b{color:var(--teal-ink)}
.menu a{display:flex;justify-content:space-between;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:11px;color:var(--ink);text-decoration:none;box-shadow:0 8px 22px rgba(31,57,84,.05);transition:border-color .15s,transform .15s}
.menu a:hover{border-color:var(--teal);transform:translateY(-1px)}
.menu a.ghost{box-shadow:none;background:transparent}
.menu .t{font-size:15.5px;font-weight:700}.menu .d{font-size:12px;color:var(--mute);margin-top:3px}
.menu .go{color:var(--teal-ink);font-size:20px}
.foot{margin-top:22px;font-size:11px;color:var(--mute);line-height:1.55}
