:root { --ink:#0d1117; --orange:#e8642c; --bg:#f4f5f7; --card:#fff; --line:#e3e6ea; --fg:#161a20; --fg2:#4b5563;
  --fg3:#8a93a0; --err:#c0392b; --err-soft:#fbe9e7; --ok:#1f8a4c; --ok-soft:#e6f4ec; --info-soft:#e8f3fa; }
@media (prefers-color-scheme: dark) {
  :root { --bg:#0d1117; --card:#161b22; --line:#2b323c; --fg:#e8eaed; --fg2:#b2bac4; --fg3:#7d8794;
    --err-soft:#3a1d1a; --ok-soft:#14301f; --info-soft:#14283a; }
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body { min-height: 100vh; display: flex; flex-direction: column; background: var(--bg); color: var(--fg);
  font: 15px/1.5 'Segoe UI Variable Text', 'Segoe UI', system-ui, -apple-system, sans-serif; }
a { color: inherit; }
header, footer { padding: 18px 24px; display: flex; align-items: center; gap: 10px; }
header .brand { display: flex; align-items: center; gap: 10px; font-weight: 700; text-decoration: none; letter-spacing: -.01em; }
header .brand span { color: var(--orange); font-weight: 500; }
header svg { width: 26px; height: 26px; }
main { flex: 1; display: flex; align-items: flex-start; justify-content: center; padding: 6vh 16px 40px; }
.card { width: 100%; max-width: 420px; background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 28px; }
h1 { margin: 0 0 6px; font-size: 24px; letter-spacing: -.02em; }
p { margin: 0 0 14px; color: var(--fg2); }
label { display: block; font-size: 13px; font-weight: 600; margin: 14px 0 5px; }
input[type=email], input[type=text] { width: 100%; height: 42px; padding: 0 12px; border: 1px solid var(--line); border-radius: 6px;
  background: var(--card); color: var(--fg); font: inherit; }
select { width: 100%; height: 42px; padding: 0 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--card);
  color: var(--fg); font: inherit; }
.row { display: flex; gap: 10px; }
.row > * { flex: 1; min-width: 0; }
.row.phone > input:first-child { flex: 0 0 76px; }
.opt { font-weight: 400; color: var(--fg3); }
label.check { display: flex; gap: 9px; align-items: flex-start; font-weight: 400; color: var(--fg2); margin-top: 16px; }
label.check input { margin-top: 4px; accent-color: var(--orange); }
input.code { font: 600 22px Consolas, monospace; letter-spacing: .3em; text-align: center; }
input:focus, select:focus { outline: 2px solid var(--orange); outline-offset: 1px; }
button, a.button { display: block; width: 100%; height: 42px; margin-top: 16px; border: 0; border-radius: 6px; background: var(--ink);
  color: #fff; font: 600 15px/42px 'Segoe UI Variable Text', 'Segoe UI', system-ui, -apple-system, sans-serif; text-align: center; text-decoration: none; cursor: pointer; }
@media (prefers-color-scheme: dark) { button, a.button { background: var(--orange); } }
input.code-out { font: 13px Consolas, monospace; margin-top: 8px; }
button.link { display: inline; width: auto; height: auto; margin: 0; padding: 0; line-height: inherit; background: none; color: var(--fg2); text-decoration: underline; font-weight: 500; }
.cf-turnstile { margin-top: 14px; min-height: 65px; }
.msg { padding: 10px 12px; border-radius: 6px; margin: 0 0 14px; font-size: 14px; }
.msg.err { background: var(--err-soft); color: var(--err); }
.msg.ok { background: var(--ok-soft); color: var(--ok); }
.msg.info { background: var(--info-soft); color: var(--fg); }
.small { font-size: 13px; color: var(--fg3); margin-top: 14px; }
.chip { display: inline-block; padding: 1px 9px; border-radius: 10px; font-size: 13px; font-weight: 600; }
.chip.ok { background: var(--ok-soft); color: var(--ok); }
.chip.wait { background: var(--info-soft); color: var(--fg2); }
footer { justify-content: center; font-size: 13px; color: var(--fg3); }