:root { --bg:#0f1115; --card:#171a21; --line:#262b36; --text:#e6e8ee; --muted:#8b93a7;
        --accent:#4c8dff; --ok:#2fbf71; --warn:#e0a33e; --bad:#e05561; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--text);
       font: 15px/1.6 -apple-system,"PingFang SC","Microsoft YaHei",sans-serif; }
header { border-bottom:1px solid var(--line); padding:14px 24px; display:flex;
         align-items:center; gap:16px; }
header h1 { font-size:17px; margin:0; font-weight:600; }
header nav { margin-left:auto; display:flex; align-items:center; gap:12px; }
main { max-width:960px; margin:0 auto; padding:24px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:10px;
        padding:18px 20px; margin-bottom:18px; }
.card.narrow { max-width:380px; margin:60px auto; }
.card h2 { margin:0 0 14px; font-size:15px; font-weight:600; }
label { display:block; font-size:13px; color:var(--muted); margin-bottom:5px; }
input[type=text], input[type=email], input[type=password] {
  width:100%; padding:9px 11px; border-radius:7px; border:1px solid var(--line);
  background:#0d1015; color:var(--text); font-size:14px; margin-bottom:14px; }
button { background:var(--accent); color:#fff; border:0; border-radius:7px;
         padding:9px 18px; font-size:14px; cursor:pointer; }
button.ghost { background:transparent; border:1px solid var(--line); color:var(--muted); }
button.danger { background:transparent; border:1px solid var(--bad); color:var(--bad); }
table { width:100%; border-collapse:collapse; font-size:14px; }
th, td { text-align:left; padding:9px 8px; border-bottom:1px solid var(--line); }
th { color:var(--muted); font-weight:500; font-size:13px; }
code { background:#0d1015; padding:2px 6px; border-radius:4px; font-size:13px;
       font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }
.tag { display:inline-block; padding:2px 9px; border-radius:99px; font-size:12px; }
.tag-ok { background:rgba(47,191,113,.15); color:var(--ok); }
.tag-warn { background:rgba(224,163,62,.15); color:var(--warn); }
.tag-bad { background:rgba(224,85,97,.15); color:var(--bad); }
.tag-mute { background:#232833; color:var(--muted); }
.notice { background:rgba(76,141,255,.12); border:1px solid rgba(76,141,255,.35);
          padding:10px 14px; border-radius:8px; margin-bottom:18px; font-size:14px; }
.error { background:rgba(224,85,97,.12); border:1px solid rgba(224,85,97,.35);
         padding:10px 14px; border-radius:8px; margin-bottom:18px; font-size:14px; }
.muted { color:var(--muted); font-size:13px; }
.row { display:flex; gap:14px; }
.row > div { flex:1; }