:root { --bg:#12141a; --fg:#e8eaed; --muted:#9aa3b2; --line:#3c4450; --accent:#2b5aa0; --warn:#c9a227; --err:#c44c4c; }
* { box-sizing:border-box; }
body { margin:0; font-family:system-ui,sans-serif; background:var(--bg); color:var(--fg); }
header { display:flex; flex-wrap:wrap; gap:1rem; align-items:center; padding:.75rem 1rem; border-bottom:1px solid var(--line); }
nav { display:flex; flex-wrap:wrap; gap:.75rem; }
nav a { color:var(--fg); }
main { padding:1rem; max-width:1100px; }
a { color:#8ab4ff; }
label { display:block; margin:.6rem 0; }
input, select, button { font:inherit; }
input, select { background:#1e222b; color:var(--fg); border:1px solid var(--line); padding:.35rem .5rem; }
button { background:var(--accent); color:#fff; border:0; padding:.4rem .7rem; }
button:focus, input:focus, select:focus, a:focus { outline:2px solid #8ab4ff; outline-offset:2px; }
table { width:100%; border-collapse:collapse; font-size:.92rem; }
th, td { text-align:left; border-bottom:1px solid var(--line); padding:.4rem .35rem; vertical-align:top; }
.table-wrap { overflow:auto; }
.muted { color:var(--muted); }
.warn { color:var(--warn); }
.error { color:var(--err); }
.tag { display:inline-block; border:1px solid var(--line); padding:.05rem .35rem; margin-right:.25rem; }
@media (max-width:640px) {
  table { font-size:.85rem; }
  header { flex-direction:column; align-items:flex-start; }
}