:root{--bg:#f6f7f9;--card:#fff;--ink:#1d2330;--mut:#667085;--line:#e4e7ec;--acc:#1f6feb;--ok:#12805c;--bad:#c4320a;--warn:#b54708}
*{box-sizing:border-box}
body{margin:0;font:14px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--ink)}
header{background:#111827;color:#fff;padding:0 16px;display:flex;gap:18px;align-items:center;flex-wrap:wrap}
header .brand{font-weight:700;padding:12px 0;margin-right:12px}
header a{color:#cbd5e1;text-decoration:none;padding:12px 4px;border-bottom:2px solid transparent}
header a.on,header a:hover{color:#fff;border-bottom-color:#60a5fa}
header form{margin-left:auto}
header button{background:none;border:1px solid #475569;color:#cbd5e1;border-radius:6px;padding:4px 10px;cursor:pointer}
main{max-width:1280px;margin:0 auto;padding:20px 16px 60px}
h1{font-size:22px;margin:0 0 16px} h2{font-size:16px;margin:24px 0 10px}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:16px;margin-bottom:16px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.stat{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.stat .v{font-size:22px;font-weight:700;font-variant-numeric:tabular-nums}
.stat .l{color:var(--mut);font-size:12px}
.tw{overflow-x:auto}
table{border-collapse:collapse;width:100%;background:var(--card);font-variant-numeric:tabular-nums}
th,td{padding:7px 9px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;white-space:nowrap}
th{font-size:12px;color:var(--mut);font-weight:600;background:#fafbfc;position:sticky;top:0}
td.num,th.num{text-align:right}
td.wrap{white-space:normal;max-width:520px}
tr:hover td{background:#f9fafb}
.mut{color:var(--mut)} .ok{color:var(--ok)} .bad{color:var(--bad)} .warn{color:var(--warn)}
.pill{display:inline-block;padding:1px 8px;border-radius:99px;font-size:12px;background:#eef2ff;color:#3538cd}
.pill.ok{background:#ecfdf3;color:var(--ok)} .pill.bad{background:#fef3f2;color:var(--bad)} .pill.run{background:#eff8ff;color:#175cd3}
.pill.mut{background:#f2f4f7;color:var(--mut)}
form.filters{display:flex;flex-wrap:wrap;gap:10px;align-items:end;margin-bottom:14px}
form.filters label{display:flex;flex-direction:column;font-size:12px;color:var(--mut);gap:3px}
input,select{font:inherit;padding:6px 8px;border:1px solid var(--line);border-radius:6px;background:#fff}
input[type=number]{width:90px}
.btn{display:inline-block;background:var(--acc);color:#fff;border:0;border-radius:6px;padding:7px 14px;font:inherit;cursor:pointer;text-decoration:none}
.btn.sec{background:#fff;color:var(--ink);border:1px solid var(--line)}
.login{max-width:360px;margin:12vh auto}
.login input{width:100%;margin:4px 0 12px}
.alert{background:#fef3f2;border:1px solid #fecdca;color:var(--bad);padding:10px 12px;border-radius:8px;margin-bottom:12px}
.note{background:#fffaeb;border:1px solid #fedf89;color:#7a2e0e;padding:10px 12px;border-radius:8px;margin-bottom:12px}
.bar{height:6px;background:#e5e7eb;border-radius:3px;overflow:hidden;min-width:80px}.bar>i{display:block;height:100%;background:var(--acc)}
.pager{display:flex;gap:8px;align-items:center;margin-top:10px}
small{color:var(--mut)}
pre{white-space:pre-wrap;font-size:12px;margin:0;max-height:180px;overflow:auto}
