:root { --bg:#0f1b2d; --card:#17263d; --ink:#e8eef7; --muted:#8aa0bd; --accent:#3f9d6b; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif; background:var(--bg); color:var(--ink); }
.topbar { display:flex; align-items:center; justify-content:space-between; padding:14px 22px; background:var(--card); border-bottom:1px solid #22354f; }
.brand { font-weight:700; letter-spacing:.3px; }
nav a { color:var(--muted); margin-left:18px; text-decoration:none; }
nav a:hover { color:var(--ink); }
main { max-width:760px; margin:28px auto; padding:0 16px; display:grid; gap:18px; }
.card { background:var(--card); border:1px solid #22354f; border-radius:10px; padding:20px; }
h1 { margin-top:0; font-size:1.4rem; }
h2 { margin-top:0; font-size:1.15rem; }
.muted { color:var(--muted); }
label { display:block; margin:10px 0; font-size:.9rem; }
input { width:100%; padding:9px 11px; margin-top:4px; border-radius:7px; border:1px solid #2c4160; background:#0e1a2c; color:var(--ink); }
button { margin-top:10px; padding:9px 16px; border:0; border-radius:7px; background:var(--accent); color:#06120b; font-weight:600; cursor:pointer; }
ul { margin:0; padding-left:18px; }
footer { text-align:center; padding:22px; font-size:.85rem; }