:root { --bg:#0f1115; --panel:#171a21; --line:#262b35; --fg:#d6dae0; --muted:#8b94a3; --accent:#2b5797; --ok:#3fa66a; --bad:#e06b6b; }
* { box-sizing: border-box; }
body { margin:0; font:15px/1.55 -apple-system,"Segoe UI",Roboto,Arial,sans-serif; background:var(--bg); color:var(--fg); }
.topbar { display:flex; align-items:center; justify-content:space-between; padding:12px 22px; background:var(--panel); border-bottom:1px solid var(--line); }
.brand { font-weight:700; font-size:17px; }
.tag { font-size:12px; font-weight:500; color:var(--muted); border:1px solid var(--line); border-radius:10px; padding:1px 8px; margin-left:8px; }
.topbar a, .who { color:var(--fg); text-decoration:none; margin-left:12px; }
.inline { display:inline; }
button.link { background:none; border:none; color:#9ab; cursor:pointer; font:inherit; }
.container { max-width:760px; margin:32px auto; padding:0 18px; }
.card { background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:22px 24px; }
.card.narrow { max-width:380px; margin:0 auto; }
h1 { margin:0 0 12px; font-size:24px; }
h1 small { font-size:13px; color:var(--muted); font-weight:500; vertical-align:middle; border:1px solid var(--line); border-radius:8px; padding:2px 7px; margin-left:6px; }
.muted { color:var(--muted); font-size:13px; }
.status { list-style:none; padding:0; margin:14px 0; }
.status li { padding:6px 0; border-bottom:1px solid var(--line); }
.pill { font-size:12px; border-radius:10px; padding:1px 9px; margin:0 6px; }
.pill.ok { background:rgba(63,166,106,.15); color:var(--ok); border:1px solid var(--ok); }
.pill.bad { background:rgba(224,107,107,.12); color:var(--bad); border:1px solid var(--bad); }
code { background:#0f1115; border:1px solid var(--line); border-radius:5px; padding:1px 6px; font-size:13px; }
.btn { display:inline-block; background:var(--accent); color:#fff; padding:9px 16px; border:none; border-radius:8px; text-decoration:none; cursor:pointer; font:inherit; }
.btn.ghost { background:transparent; border:1px solid var(--line); color:var(--fg); }
.stack { display:flex; flex-direction:column; gap:12px; margin-top:8px; }
.stack label { display:flex; flex-direction:column; gap:4px; font-size:13px; color:var(--muted); }
.stack input { padding:9px 11px; background:#0f1115; border:1px solid var(--line); border-radius:8px; color:var(--fg); font:inherit; }
.alert { background:rgba(224,107,107,.12); border:1px solid var(--bad); color:#f2b8b8; padding:9px 12px; border-radius:8px; margin-bottom:12px; font-size:14px; }
.foot { text-align:center; color:var(--muted); font-size:12px; padding:24px; }
