:root { --bg:#f6f7f9; --card:#fff; --ink:#16191d; --muted:#5b6570; --line:#dde1e6;
        --ok:#1a7f37; --bad:#b42318; --wait:#8a6100; --accent:#1f4fd8; }
@media (prefers-color-scheme: dark) {
  :root { --bg:#14171a; --card:#1c2024; --ink:#e8eaed; --muted:#9aa4ae; --line:#2c3238;
          --ok:#4ac26b; --bad:#f97066; --wait:#e0a72b; --accent:#7f9cf5; }
}
* { box-sizing:border-box; }
body { margin:0; padding:24px 16px; background:var(--bg); color:var(--ink);
       font:16px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; }
.card { max-width:560px; margin:0 auto; background:var(--card); border:1px solid var(--line);
        border-radius:14px; padding:24px; }
.card.wide { max-width:860px; }
h1 { font-size:1.35rem; margin:0 0 4px; }
h2 { font-size:1rem; margin:28px 0 10px; padding-top:16px; border-top:1px solid var(--line); }
.sub { color:var(--muted); font-size:.92rem; }
.sub a { color:var(--accent); }
.who { margin:14px 0; font-size:.95rem; }
.btn { display:inline-block; margin-top:12px; padding:11px 18px; font-size:.95rem; font-weight:600;
       border:0; border-radius:9px; background:var(--accent); color:#fff; cursor:pointer;
       text-decoration:none; }
.btn.secondary { background:transparent; color:var(--accent); border:1px solid var(--line); }
.btn.ok  { background:var(--ok); }
.btn.bad { background:var(--bad); }
.btn.sm  { padding:7px 12px; font-size:.85rem; margin:0 0 0 6px; }
input { padding:10px 12px; font-size:.95rem; border:1px solid var(--line); border-radius:9px;
        background:var(--bg); color:var(--ink); }
.row { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.row input { flex:1 1 200px; }
.note { font-size:.85rem; color:var(--muted); margin-top:10px; }
.dev { border:1px solid var(--line); border-radius:10px; padding:14px; margin-bottom:10px; }
.dev .top { display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; align-items:baseline; }
.dev .name { font-weight:600; }
.dev dl { display:grid; grid-template-columns:auto 1fr; gap:2px 12px; font-size:.85rem; margin:10px 0 0; }
.dev dt { color:var(--muted); } .dev dd { margin:0; font-variant-numeric:tabular-nums; word-break:break-all; }
.badge { display:inline-block; padding:2px 8px; border-radius:20px; font-size:.75rem; font-weight:600;
         background:var(--line); color:var(--muted); }
.badge.pending  { background:color-mix(in srgb, var(--wait) 18%, transparent); color:var(--wait); }
.badge.approved { background:color-mix(in srgb, var(--ok) 18%, transparent);   color:var(--ok); }
.badge.revoked, .badge.rejected, .badge.expired {
                  background:color-mix(in srgb, var(--bad) 18%, transparent);  color:var(--bad); }
