:root { --bg:#f7f7fb; --card:#fff; --text:#111; --muted:#6b7280; --border:#e5e7eb; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial; background: var(--bg); color: var(--text); }
.topbar { display:flex; align-items:center; justify-content:space-between; padding:12px 16px; background:var(--card); border-bottom:1px solid var(--border); position:sticky; top:0; }
nav a, nav button { margin-left: 10px; }
.wrap { max-width: 720px; margin: 32px auto; padding: 0 16px; }
h1,h2 { margin: 0 0 12px; }
.card { background: var(--card); border:1px solid var(--border); border-radius: 14px; padding: 16px; box-shadow: 0 2px 8px rgba(0,0,0,.04); }
form.card { display:flex; flex-direction:column; gap: 12px; }
label { display:flex; flex-direction:column; gap:6px; font-size:14px; }
input { padding: 10px 12px; border:1px solid var(--border); border-radius: 10px; font-size:16px; }
button { padding: 10px 14px; border-radius: 10px; border:1px solid var(--border); background:#111; color:#fff; font-weight:600; cursor:pointer; }
button.secondary { background:#fff; color:#111; }
.muted { color: var(--muted); }
.error { color:#b91c1c; }