:root { --bg:#f6f7f9; --fg:#1d2430; --muted:#5b6575; --accent:#1f6feb; --card:#fff; --line:#dde2ea; --err:#b42318; }
@media (prefers-color-scheme: dark) {
  :root { --bg:#12161c; --fg:#e6e9ee; --muted:#9aa4b2; --accent:#5b9dff; --card:#1b2129; --line:#2c3440; --err:#ff8a7a; }
}
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:16px/1.55 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
.wrap { max-width: 960px; margin: 0 auto; padding: 0 16px; }
a { color: var(--accent); }
.top { background: var(--card); border-bottom: 1px solid var(--line); }
.top .wrap { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; padding-top:12px; padding-bottom:12px; }
.brand { font-weight:700; color:var(--fg); text-decoration:none; }
nav a { margin-left:16px; text-decoration:none; }
nav a:first-child { margin-left:0; }
.hero { padding: 40px 0 24px; }
.hero h1 { font-size: clamp(1.5rem, 4vw, 2.2rem); margin: 0 0 12px; }
.cards { display:grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap:16px; padding-bottom:32px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:16px 20px; }
.card h2 { font-size:1.1rem; margin:0 0 8px; }
.btn { display:inline-block; background:var(--accent); color:#fff; border:0; border-radius:8px; padding:10px 18px; font-size:1rem; cursor:pointer; text-decoration:none; }
.form { max-width: 520px; display:flex; flex-direction:column; gap:6px; padding-bottom:32px; }
.form label { display:flex; flex-direction:column; gap:4px; margin-top:10px; font-weight:600; }
.form input, .form select, .form textarea { font:inherit; padding:9px 10px; border:1px solid var(--line); border-radius:8px; background:var(--card); color:var(--fg); }
.form small { color:var(--muted); }
.form .check { flex-direction:row; align-items:flex-start; gap:10px; font-weight:400; }
.form .check input { margin-top:4px; }
.form .btn { margin-top:16px; align-self:flex-start; }
.err { color: var(--err); font-size: .95rem; }
.hp { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.steps li { margin-bottom: 8px; }
.note { color: var(--muted); }
.foot { color: var(--muted); padding: 24px 16px; font-size: .9rem; }
