:root { color-scheme: light; --ink:#172033; --muted:#697386; --line:#dfe4ec; --panel:#fff; --bg:#f5f7fa; --brand:#3659d9; --good:#19734a; --warn:#95610a; --bad:#a73636; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font:15px/1.5 Inter, ui-sans-serif, system-ui, -apple-system, sans-serif; }
a { color:var(--brand); text-decoration:none; } a:hover { text-decoration:underline; }
.topbar { min-height:64px; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:0 5vw; color:#fff; background:#151c2e; }
.brand { color:#fff; font-size:18px; font-weight:750; } .brand span { color:#9eb2ff; font-weight:500; }
.topbar nav { display:flex; align-items:center; gap:22px; } .topbar nav a,.link-button { color:#dce4ff; }
.topbar form { margin:0; }.link-button { border:0; padding:0; background:none; font:inherit; cursor:pointer; }
.shell { width:min(1180px,92vw); margin:38px auto 70px; }
.page-heading,.panel-heading,.secret-row,.actions,.pagination { display:flex; align-items:center; justify-content:space-between; gap:16px; }
h1,h2,p { margin-top:0; } h1 { margin-bottom:4px; font-size:30px; } h2 { margin-bottom:16px; font-size:18px; }
.eyebrow { margin-bottom:4px; color:var(--brand); font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.muted,.fine-print,small { color:var(--muted); }.fine-print { margin-top:24px; font-size:12px; }.block { display:block; }.mono,code { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; }
.metric-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:28px 0; }.metric-grid.small { grid-template-columns:repeat(5,1fr); }
.metric,.panel,.secret-panel { border:1px solid var(--line); border-radius:12px; background:var(--panel); box-shadow:0 2px 7px rgba(23,32,51,.04); }
.metric { padding:20px; border-top:3px solid #99a4b8; }.metric.good { border-top-color:var(--good); }.metric.warn { border-top-color:var(--warn); }.metric.bad { border-top-color:var(--bad); }
.metric span,.metric small { display:block; }.metric strong { display:block; margin:5px 0; font-size:28px; }.metric .date-value { font-size:14px; }
.panel { margin-top:20px; overflow:hidden; }.panel.compact { padding:22px; overflow:visible; }.panel-heading { padding:18px 22px 0; }
.two-column { display:grid; grid-template-columns:minmax(0,2.2fr) minmax(260px,1fr); gap:20px; align-items:start; }
.table-wrap { overflow-x:auto; } table { width:100%; border-collapse:collapse; } th,td { padding:14px 18px; border-top:1px solid var(--line); text-align:left; vertical-align:middle; } th { color:var(--muted); font-size:12px; letter-spacing:.04em; text-transform:uppercase; }
.badge { display:inline-block; padding:3px 8px; border-radius:999px; color:#43506a; background:#eef1f6; font-size:11px; font-weight:800; }.badge.active,.badge.match { color:var(--good); background:#e5f5ed; }.badge.disabled,.badge.revoked,.badge.no-match { color:var(--bad); background:#fbeaea; }.badge.review { color:var(--warn); background:#fff4d8; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:8px 14px; border:1px solid var(--line); border-radius:8px; color:var(--ink); background:#fff; font:inherit; font-weight:650; cursor:pointer; }.button:hover { text-decoration:none; border-color:#afb9ca; }.button.primary { color:#fff; border-color:var(--brand); background:var(--brand); }.button.danger { color:var(--bad); }
.stack { display:grid; gap:10px; } label { font-weight:650; } input,select { width:100%; min-height:42px; padding:9px 11px; border:1px solid #bdc5d2; border-radius:8px; background:#fff; color:var(--ink); font:inherit; } input:focus,select:focus { outline:3px solid #dce4ff; border-color:var(--brand); }
.search { display:flex; gap:8px; }.search input { width:220px; }.pagination { padding:16px 20px; border-top:1px solid var(--line); }.actions { justify-content:flex-start; margin:20px 0; }.breadcrumbs { display:flex; gap:9px; margin-bottom:18px; color:var(--muted); }
.secret-panel { margin:22px 0; padding:20px; border-color:#d4a72c; background:#fff9e7; }.secret-row code { flex:1; overflow-wrap:anywhere; padding:12px; border-radius:7px; background:#fff; }
dl { display:grid; grid-template-columns:auto 1fr; gap:10px 18px; } dt { color:var(--muted); } dd { margin:0; }.empty { padding:30px; color:var(--muted); text-align:center; }
.alert { padding:12px; border-radius:8px; }.alert.error { color:var(--bad); background:#fbeaea; }.login-page { min-height:100vh; display:grid; place-items:center; padding:24px; background:linear-gradient(135deg,#edf1ff,#f8fafc); }.login-card { width:min(430px,100%); padding:34px; border:1px solid var(--line); border-radius:15px; background:#fff; box-shadow:0 18px 45px rgba(23,32,51,.12); }.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
@media (max-width:800px) { .metric-grid,.metric-grid.small { grid-template-columns:repeat(2,1fr); }.two-column { grid-template-columns:1fr; }.topbar { align-items:flex-start; padding-top:15px; padding-bottom:15px; }.topbar nav { gap:12px; flex-wrap:wrap; }.page-heading { align-items:flex-start; }.search { width:100%; }.panel-heading { align-items:flex-start; flex-direction:column; }.search input { width:100%; } }
@media (max-width:500px) { .metric-grid,.metric-grid.small { grid-template-columns:1fr; }.topbar { display:block; }.topbar nav { margin-top:10px; }.shell { margin-top:24px; }.page-heading { display:block; }.page-heading>.button { margin-top:14px; } }
.portal-context { display:flex; justify-content:flex-end; align-items:center; gap:10px; margin-bottom:20px; }.filter-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:12px; align-items:end; }.prose { max-width:900px; }.prose pre { overflow-x:auto; padding:16px; border-radius:8px; background:#151c2e; color:#ecf1ff; }.signal-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:8px; margin-top:12px; }.signal-grid code { padding:8px; background:#f3f5f8; }
.inline-form { display:flex; align-items:center; gap:7px; }.inline-form select { width:auto; min-width:120px; }