:root { --bg:#f6f5f2; --card:#fff; --ink:#1d1d1f; --muted:#6e6e73; --line:#e3e1dc; --gold:#b8891f; --red:#b42318; --green:#1a7f37; --amber:#9a6700; }
@media (prefers-color-scheme: dark) { :root { --bg:#141416; --card:#1e1e21; --ink:#f2f2f2; --muted:#9a9a9f; --line:#2c2c30; } }
* { box-sizing:border-box; }
body { margin:0; font:15px/1.45 -apple-system, "Segoe UI", system-ui, sans-serif; background:var(--bg); color:var(--ink); }
header { display:flex; justify-content:space-between; align-items:center; padding:14px 20px; border-bottom:1px solid var(--line); }
h1 { font-size:18px; margin:0; letter-spacing:.2px; }
h2, h3 { margin:0 0 10px; font-size:16px; }
main { max-width:1100px; margin:0 auto; padding:16px; }
.bar { display:flex; gap:10px; align-items:center; margin-bottom:12px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:14px 16px; margin-bottom:12px; }
.company .chead { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.name { font-size:17px; }
.url { color:var(--muted); font-size:13px; text-decoration:none; }
.state { font-size:13px; padding:3px 10px; border-radius:999px; border:1px solid var(--line); white-space:nowrap; }
.state.ok { color:var(--green); border-color:var(--green); }
.state.down { color:var(--red); border-color:var(--red); }
.state.sus { color:var(--amber); border-color:var(--amber); }
.grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(160px,1fr)); gap:10px; margin:12px 0; }
.k { display:block; font-size:12px; color:var(--muted); }
.v { font-size:15px; }
.packs, .licence, .actions { display:flex; flex-wrap:wrap; gap:10px 14px; align-items:center; margin:10px 0; }
.packs label { display:flex; gap:6px; align-items:center; }
label { display:block; margin:8px 0; }
input:not([type=checkbox]), select { font:inherit; padding:6px 8px; border:1px solid var(--line); border-radius:8px; background:var(--card); color:var(--ink); min-width:160px; }
button { font:inherit; padding:7px 12px; border-radius:8px; border:1px solid var(--line); background:var(--card); color:var(--ink); cursor:pointer; }
button:hover { border-color:var(--gold); }
button.danger { color:var(--red); }
.err { color:var(--red); margin:6px 0 0; min-height:1em; font-size:13px; }
.muted { color:var(--muted); font-size:13px; }
code { font-family:ui-monospace, Consolas, monospace; font-size:13px; }
.panel { border-top:1px solid var(--line); margin-top:10px; padding-top:10px; }
.code { font-family:ui-monospace, Consolas, monospace; font-size:28px; letter-spacing:3px; padding:10px 0; }
.row { display:flex; gap:10px; }
table.nodes { border-collapse:collapse; font-size:13px; margin-top:6px; }
table.nodes td { padding:2px 10px 2px 0; color:var(--muted); }
#who button { margin-left:10px; }