:root{
  --ground:#F6F6F8; --surface:#fff; --ink:#15161A; --ink-2:#3D3F46;
  --muted:#6E7079; --rule:#DDDDE3; --red:#C31629; --red-deep:#8A0F1D;
  --ok:#1F6B45; --warn-bg:#FFF8E6; --warn-line:#D9A400;
}
*{box-sizing:border-box}
body{
  margin:0;background:var(--ground);color:var(--ink);
  font:15px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:520px;margin:0 auto;padding:48px 20px 64px}
.mast{margin-bottom:24px}
.eyebrow{font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--red);font-weight:600}
h1{font-size:24px;margin:8px 0 0;letter-spacing:-.02em}
h2{font-size:19px;margin:16px 0 8px}
.card{background:var(--surface);border:1px solid var(--rule);border-radius:14px;padding:24px}
.muted{color:var(--muted);font-size:14px}

.ledger{border:1px solid var(--rule);border-radius:10px;margin-bottom:20px}
.row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:13px 16px;border-bottom:1px solid #EFEFF2}
.row:last-child{border-bottom:0}
.row span{color:var(--muted);font-size:14px}
.row strong{font-variant-numeric:tabular-nums;font-weight:600}
.row.hero strong{font-size:24px;color:var(--red);font-weight:700}
.row.sub{background:#FAFAFB;border-radius:0 0 9px 9px}

.consent{font-size:13px;line-height:1.55;color:#6a5200;background:var(--warn-bg);
  border-left:2px solid var(--warn-line);border-radius:8px;padding:11px 13px;margin:0 0 20px}

.field{display:block;margin-bottom:14px}
.cap{display:block;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);font-weight:600;margin-bottom:6px}
.box{height:44px;border:1px solid var(--rule);border-radius:9px;background:#fff;padding:0 4px;display:flex;align-items:center}
.box.focus{border-color:var(--red);box-shadow:0 0 0 3px rgba(195,22,41,.12)}
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

.err{font-size:14px;color:var(--red);background:#FDEDEE;border-radius:8px;padding:9px 12px;margin:0 0 14px}
button{
  width:100%;padding:14px;border:0;border-radius:9px;background:var(--red);color:#fff;
  font:600 16px system-ui,sans-serif;cursor:pointer;
}
button:hover{background:var(--red-deep)}
button:disabled{opacity:.5;cursor:not-allowed}

.tick{width:46px;height:46px;border-radius:50%;background:#E8F5EE;color:var(--ok);
  display:grid;place-items:center;font-size:24px;margin:8px auto 0}
#done{text-align:center;padding:8px 0 12px}

.fine{font-size:12px;line-height:1.6;color:var(--muted);margin:16px 2px 0}

@media (prefers-color-scheme:dark){
  :root{--ground:#121216;--surface:#1A1B20;--ink:#ECECF0;--ink-2:#C2C3CC;
    --muted:#8C8E99;--rule:#31323A;--red:#EE4459;--red-deep:#FF6B7C;
    --warn-bg:#2A2410;--ok:#5FBF8E}
  .row.sub{background:#202127}
  .box{background:#232429}
  .consent{color:#E8D9A0}
  .err{background:#2C171B}
  .tick{background:#16281F}
}