:root { --bg:#f4f2ee; --card:#fff; --text:#2b2b2b; --muted:#5f5f5f; --accent:#8b1a1a; --line:#ddd8cf; --ok:#e7f5ec; --bad:#fdecea; }
@media (prefers-color-scheme: dark) {
  :root { --bg:#1b1b1b; --card:#262626; --text:#ececec; --muted:#b3b3b3; --accent:#e06a6a; --line:#3a3a3a; --ok:#1f3a29; --bad:#4a2422; }
}
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--text); font:16px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; padding:16px; }
main { max-width:720px; margin:12px auto; background:var(--card); border:1px solid var(--line); border-radius:12px; padding:24px 28px; }
.logo { display:block; height:64px; width:auto; max-width:60%; margin:0 auto 14px; object-fit:contain; }
@media (prefers-color-scheme: dark) { .logo { background:#fff; border-radius:8px; padding:6px; } }
h1 { font-size:1.35rem; margin:0 0 6px; text-align:center; }
p { margin:0 0 12px; }
.lead { color:var(--muted); text-align:center; font-size:.95rem; }

/* Two columns on wide screens, one on phones. */
.grid { display:grid; grid-template-columns:1fr 1fr; gap:4px 20px; }
.grid .wide { grid-column:1 / -1; }
@media (max-width:640px) { .grid { grid-template-columns:1fr; } main { padding:20px 18px; } }

label { display:block; font-weight:600; margin:10px 0 4px; font-size:.95rem; }
input { width:100%; padding:9px 11px; font:inherit; color:inherit; background:transparent; border:1px solid var(--line); border-radius:8px; }
input:focus { outline:2px solid var(--accent); outline-offset:1px; }
small { color:var(--muted); font-weight:normal; display:block; margin-top:3px; font-size:.82rem; }
label small { display:inline; }
.money { display:flex; align-items:center; gap:6px; }
.money span { font-weight:600; }
.err { display:block; color:var(--accent); font-size:.88rem; margin-top:3px; }
.ok, .bad { padding:9px 12px; border-radius:8px; }
.ok { background:var(--ok); } .bad { background:var(--bad); }
.submit { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-top:18px; }
.submit button { flex:1 1 260px; }
button { width:100%; padding:12px; font:inherit; font-weight:600; color:#fff; background:var(--accent); border:0; border-radius:8px; cursor:pointer; }
.hp { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.foot { margin-top:18px; padding-top:12px; border-top:1px solid var(--line); color:var(--muted); font-size:.85rem; text-align:center; }
.foot a, main a { color:var(--accent); }
.sandbox { background:#f5c518; color:#000; text-align:center; font-weight:700; padding:4px; border-radius:6px; max-width:720px; margin:0 auto; font-size:.9rem; }