:root { --bg:#f6f7fb; --fg:#1b2033; --card:#fff; --accent:#21337b; --ok:#1a7f4b; --bad:#b3261e; --muted:#66708a; }
@media (prefers-color-scheme: dark) { :root { --bg:#141824; --fg:#e8ebf5; --card:#1d2233; --accent:#8aa2ff; --muted:#9aa3bd; } }
body { margin:0; font:16px/1.6 system-ui,sans-serif; background:var(--bg); color:var(--fg); }
main { max-width:720px; margin:0 auto; padding:16px; }
h1 { font-size:2rem; line-height:1.2; margin:24px 0 8px; }
h2 { font-size:1.25rem; margin:0 0 8px; }
.card { background:var(--card); border-radius:12px; padding:20px; margin:16px 0; box-shadow:0 1px 4px #0002; }
a { color:var(--accent); }
.btn { display:inline-block; font:inherit; border:0; border-radius:8px; padding:12px 20px; background:var(--accent); color:#fff; text-decoration:none; cursor:pointer; }
@media (prefers-color-scheme: dark) { .btn { color:#141824; } }
.btn:disabled { opacity:.5; cursor:default; }
.muted { color:var(--muted); font-size:.9rem; }
.row { display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; }
.warn { border-left:4px solid var(--bad); padding-left:12px; }
input[type=email] { flex:1; min-width:200px; box-sizing:border-box; font:inherit; padding:10px; border-radius:8px; border:1px solid var(--muted); background:var(--bg); color:var(--fg); }
.hidden { display:none; }
footer { margin:32px 0 16px; text-align:center; }
ol, ul { padding-left:1.2rem; }
li { margin-bottom:8px; }