:root { color-scheme: light; --page:#f9f9f7; --surface:#fcfcfb; --ink:#0b0b0b; --ink-2:#52514e;
  --muted:#898781; --line:#e1e0d9; --accent:#2a78d6; --accent-ink:#1c5cab; --good:#0ca30c; --warn:#c27c00; --bad:#d03b3b; }
* { box-sizing: border-box; }
body { margin:0; background:var(--page); color:var(--ink); font: 15px/1.55 system-ui, -apple-system, "Segoe UI", sans-serif; }
a { color: var(--accent); }
nav.top { background:var(--surface); border-bottom:1px solid var(--line); }
nav.top .in { max-width:1100px; margin:0 auto; padding:10px 16px; display:flex; flex-wrap:wrap; gap:6px 18px; align-items:center; }
nav.top .brand { font-weight:700; color:var(--ink); text-decoration:none; margin-right:auto; }
nav.top a { text-decoration:none; font-weight:600; }
nav.top form { display:inline; margin:0; }
nav.top .who { color:var(--muted); font-size:13px; }
button.link { background:none; border:none; color:var(--accent); font:inherit; font-weight:600; cursor:pointer; padding:0; }
main { max-width:1100px; margin:0 auto; padding:24px 16px 64px; }
h1 { font-size:28px; margin:4px 0 6px; } h2 { font-size:19px; margin:0 0 8px; }
p.sub { color:var(--ink-2); margin:0 0 20px; }
section, .panel { background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:18px 20px; margin-bottom:16px; }
.cards { display:grid; grid-template-columns: repeat(auto-fit, minmax(250px,1fr)); gap:14px; margin-bottom:16px; }
a.card { display:block; text-decoration:none; color:var(--ink); background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:16px 18px; }
a.card:hover { border-color:var(--accent); }
a.card h2 { color:var(--accent); font-size:17px; margin:0 0 4px; } a.card p { margin:0; color:var(--ink-2); }
label { display:block; font-weight:600; font-size:14px; margin:12px 0 4px; }
input[type=text], input[type=password], input[type=date], select, textarea {
  width:100%; font:inherit; padding:9px 11px; border:1px solid #c3c2b7; border-radius:8px; background:#fff; color:var(--ink); }
textarea { min-height:280px; font-family: ui-monospace, Consolas, monospace; font-size:13px; }
.row { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap:0 14px; }
.btn { display:inline-block; background:var(--accent); color:#fff; border:none; border-radius:8px; padding:10px 18px;
  font:inherit; font-weight:600; cursor:pointer; text-decoration:none; margin-top:14px; }
.btn:disabled { background:#c3c2b7; cursor:not-allowed; }
.btn.secondary { background:var(--surface); color:var(--accent); border:1px solid var(--accent); }
.btn.danger { background:var(--bad); }
.btn.small { padding:5px 10px; font-size:13px; margin-top:0; }
.flash { background:#eaf3fd; border:1px solid #b7d3f6; border-radius:8px; padding:10px 14px; margin-bottom:14px; }
.error { background:#fdecec; border:1px solid #f0b4b4; border-radius:8px; padding:10px 14px; margin-bottom:14px; }
.warn { background:#fff7e0; border:1px solid #f2d27a; border-radius:8px; padding:8px 12px; margin:6px 0; font-size:14px; }
.ok { color:var(--good); font-weight:700; } .bad { color:var(--bad); font-weight:700; }
.metrics { display:grid; grid-template-columns: repeat(auto-fit, minmax(140px,1fr)); gap:10px; margin-bottom:12px; }
.metric { border:1px solid var(--line); border-radius:10px; padding:10px 14px; background:#fff; }
.metric .v { font-size:26px; font-weight:600; } .metric .l { color:var(--ink-2); font-size:13px; }
.table-wrap { overflow-x:auto; }
table { border-collapse:collapse; width:100%; font-size:14px; }
th { text-align:left; color:var(--ink-2); font-weight:600; padding:6px 8px; border-bottom:1px solid var(--line); white-space:nowrap; }
td { padding:6px 8px; border-bottom:1px solid var(--line); vertical-align:top; }
td.num, th.num { text-align:right; font-variant-numeric: tabular-nums; }
details summary { cursor:pointer; font-weight:600; margin:8px 0; }
pre.log { background:#1a1a19; color:#e8e8e3; border-radius:8px; padding:12px; font-size:12.5px; overflow-x:auto; white-space:pre-wrap; }
.muted { color:var(--muted); font-size:13px; }
.inline { display:inline; }
.login { max-width:380px; margin:8vh auto 0; }
footer { color:var(--muted); font-size:12px; text-align:center; margin-top:24px; }
@media (max-width:600px) { h1 { font-size:23px; } section, .panel { padding:14px; } }