:root { --bg:#0b0f14; --card:#121a23; --text:#e8eef6; --muted:#98a7b8; --accent:#4ea1ff; }
*{ box-sizing:border-box; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial; }
body{ margin:0; background:var(--bg); color:var(--text); }
.topbar{ display:flex; justify-content:space-between; align-items:center; padding:14px 18px; background:#0f1620; border-bottom:1px solid #1f2a36; position:sticky; top:0;}
.brand{ font-weight:700; }
.nav{ display:flex; gap:10px; align-items:center; }
.user{ color:var(--muted); font-size:14px; }
.container{ padding:18px; max-width:900px; margin:0 auto; }
.container.small{ max-width:420px; }
.card{ background:var(--card); border:1px solid #1f2a36; border-radius:14px; padding:16px; box-shadow:0 10px 30px rgba(0,0,0,.25); }
h1{ margin:0 0 12px; font-size:22px; }
h2{ margin:18px 0 10px; font-size:18px; }
h3{ margin:14px 0 8px; font-size:16px; color:var(--muted); }
label{ display:block; margin:10px 0 6px; color:var(--muted); font-size:14px; }
input, select{ width:100%; padding:10px 12px; border-radius:10px; border:1px solid #263547; background:#0f1620; color:var(--text); }
.btn{ display:inline-block; padding:10px 14px; border-radius:10px; border:1px solid #2a3a4d; background:#0f1620; color:var(--text); text-decoration:none; cursor:pointer; }
.btn.primary{ background:var(--accent); border-color:transparent; color:#08121f; font-weight:700; }
.hint{ color:var(--muted); font-size:14px; }
.hidden{ display:none; }
.check{ display:flex; gap:10px; align-items:center; margin-top:12px; }
.check input{ width:auto; }
.messages{ margin-bottom:12px; }
.msg{ padding:10px 12px; border-radius:10px; margin:6px 0; background:#0f1620; border:1px solid #263547; }
.msg.success{ border-color:#2d7b46; }
.msg.error{ border-color:#a33; }
.tbl{ width:100%; border-collapse:collapse; margin-top:10px; }
.tbl th, .tbl td{ border-bottom:1px solid #1f2a36; padding:8px 6px; text-align:left; font-size:14px; }
hr{ border:0; border-top:1px solid #1f2a36; margin:16px 0; }