/* Restyle here. Brand colours live in these two lines. */
:root { --brand: #0b3d91; --brand-text: #ffffff; --bg: #f5f6f8; --text: #1b1b1f; --muted: #5c5f66; --error: #b3261e; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: system-ui, -apple-system, "Segoe UI", sans-serif; }
.card { max-width: 560px; margin: 40px auto; padding: 24px 16px; background: #fff; border-radius: 12px; }
@media (min-width: 600px) { .card { padding: 32px; } }
h1 { margin-top: 0; font-size: 1.6rem; }
label { display: block; font-weight: 600; margin: 14px 0 4px; }
input, select, textarea { width: 100%; padding: 10px; font: inherit; border: 1px solid #c4c7cf; border-radius: 8px; }
textarea { min-height: 120px; resize: vertical; }
button { margin-top: 18px; width: 100%; padding: 12px; font: inherit; font-weight: 700; color: var(--brand-text); background: var(--brand); border: 0; border-radius: 8px; cursor: pointer; }
button:disabled { opacity: .6; cursor: wait; }
.req { color: var(--error); }
.error { color: var(--error); font-size: .9rem; margin: 4px 0 0; min-height: 1em; }
.notice { padding: 12px; border-radius: 8px; background: #fdecea; }
.notice.ok { background: #e6f4ea; }
#turnstile { margin-top: 16px; }
.hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }