:root { color-scheme: light; --ink:#17211d; --muted:#5f6f67; --paper:#f4f6f2; --card:#fff; --line:#d8e0da; --green:#0f6b46; --amber:#9a6200; --red:#a72b2b; --navy:#183a4a; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font:15px/1.5 ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
.shell { width:min(1480px,calc(100% - 40px)); margin:0 auto; padding:30px 0 60px; }
.topbar { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; margin-bottom:20px; }
h1,h2,h3,p { margin-top:0; }
h1 { font-size:30px; letter-spacing:-.03em; margin-bottom:6px; }
h2 { font-size:19px; }
.eyebrow,.label { color:var(--navy); font-weight:800; letter-spacing:.12em; font-size:12px; margin-bottom:6px; }
.muted { color:var(--muted); }
.send-lock { display:flex; justify-content:space-between; gap:18px; background:#251d1d; color:#fff; padding:15px 18px; border-radius:8px; margin-bottom:18px; }
.notice { background:#e8f0eb; border-left:4px solid var(--green); padding:12px 15px; margin:14px 0; }
.danger { border-color:var(--red); background:#faeaea; color:#7c2020; }
.status-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:18px 0; }
.status-card,.panel,.login-card { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:20px; box-shadow:0 1px 2px rgba(20,40,30,.04); }
.status-card h2 { font-size:30px; margin-bottom:2px; }
.danger-card { border-top:5px solid var(--red); }
.warn-card { border-top:5px solid var(--amber); }
.ok-card { border-top:5px solid var(--green); }
.panel { margin:14px 0; overflow:auto; }
.two-columns { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
table { width:100%; border-collapse:collapse; font-size:13px; }
th,td { text-align:left; border-bottom:1px solid var(--line); padding:9px 8px; vertical-align:top; }
th { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.06em; }
.pill { display:inline-block; border-radius:999px; padding:2px 8px; background:#e7ece9; font-weight:700; }
.pill.available,.pill.valid,.pill.configured { background:#dff2e8; color:var(--green); }
.pill.stale,.pill.unknown,.pill.rejected { background:#fff0cc; color:#7d5200; }
.pill.invalid,.pill.missing,.pill.unavailable,.pill.blocked { background:#f8dddd; color:var(--red); }
form { display:grid; gap:10px; margin:14px 0; }
label { display:grid; gap:5px; font-weight:650; }
input { width:100%; border:1px solid #b8c4bc; border-radius:6px; padding:10px 11px; background:#fff; color:var(--ink); }
button,.button-link { width:max-content; border:0; border-radius:6px; padding:10px 14px; background:var(--navy); color:#fff; font-weight:750; cursor:pointer; text-decoration:none; }
button.secondary { background:#dfe7e2; color:var(--ink); }
button.danger-action { background:var(--red); }
button:disabled { opacity:.45; cursor:not-allowed; }
.metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.metrics div { background:#f3f6f4; padding:8px; border-radius:6px; overflow-wrap:anywhere; }
.metrics dt { color:var(--muted); font-size:11px; }
.metrics dd { margin:2px 0 0; font-weight:750; }
.result { background:#f3f6f4; padding:12px; border-radius:7px; overflow-wrap:anywhere; }
code { font:12px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace; overflow-wrap:anywhere; }
.fingerprints { padding-left:20px; }
.login-card { width:min(460px,100%); margin:10vh auto 0; }
@media (max-width:900px) { .status-grid,.two-columns { grid-template-columns:1fr; } .send-lock,.topbar { flex-direction:column; } .metrics { grid-template-columns:1fr 1fr; } }