:root { --bg:#0d1117; --card:#161b22; --border:#30363d; --fg:#e6edf3; --muted:#8b949e; --acc:#58a6ff; --danger:#f85149; --ok:#3fb950; --warn:#d29922; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:14px/1.5 system-ui, -apple-system, Segoe UI, sans-serif; }
a { color:var(--acc); text-decoration:none; }
a:hover { text-decoration:underline; }
code, pre { font-family: ui-monospace, Menlo, monospace; background:#0b0f14; padding:2px 6px; border-radius:4px; border:1px solid var(--border); }
pre { padding:12px; overflow:auto; white-space: pre-wrap; word-break: break-all; }
.wrap { max-width: 1100px; margin: 0 auto; padding: 20px; }
.nav { background: #010409; border-bottom: 1px solid var(--border); }
.navrow { display:flex; align-items:center; gap:16px; padding: 12px 20px; }
.brand { font-weight: 700; color: var(--fg); font-size: 16px; }
.spacer { flex: 1; }
.muted { color: var(--muted); }
.small { font-size: 12px; }
.card { background: var(--card); border:1px solid var(--border); border-radius:8px; padding:16px; margin: 12px 0; }
.card summary { cursor:pointer; padding:6px 0; }
.card h3 { margin-top: 0; }
.cols { display:grid; grid-template-columns: 1fr 1fr; gap:16px; }
@media (max-width: 700px) { .cols { grid-template-columns: 1fr; } }
.grid2 { display:grid; grid-template-columns: 1fr 1fr; gap:12px; }
.grid2 label { display:flex; flex-direction:column; gap:4px; font-size:12px; color: var(--muted); }
.grid2 .full { grid-column: 1 / -1; }
input, select, button { background:#0b0f14; color:var(--fg); border:1px solid var(--border); border-radius:6px; padding:8px 10px; font-size: 14px; font-family: inherit; }
button { background: var(--acc); border:0; color: #0d1117; font-weight:600; cursor:pointer; padding:10px 16px; }
button:hover { filter: brightness(1.1); }
button.danger { background: var(--danger); }
button.small { padding: 4px 10px; font-size: 12px; }
.table { width:100%; border-collapse: collapse; margin-top: 12px; background: var(--card); border-radius: 8px; overflow:hidden; }
.table th, .table td { padding: 10px 12px; text-align:left; border-bottom: 1px solid var(--border); font-size: 13px; }
.table th { background:#0b0f14; font-weight:600; color: var(--muted); text-transform: uppercase; font-size: 11px; }
.table tr.revoked { opacity: 0.4; text-decoration: line-through; }
.pill { display:inline-block; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 600; background: #21262d; }
.pill-undetected { background: #033a16; color: var(--ok); }
.pill-detected { background: #490202; color: var(--danger); }
.pill-partially-detected { background: #3d2d05; color: var(--warn); }
.err { background:#490202; color:var(--danger); padding: 8px 12px; border-radius:6px; margin-bottom: 12px; }
.ok  { background:#033a16; color:var(--ok);    padding: 8px 12px; border-radius:6px; margin-bottom: 12px; }
.center { display:flex; align-items:center; justify-content:center; min-height:100vh; }
.center .card { min-width: 340px; max-width: 400px; }
.center label { display:flex; flex-direction:column; gap:4px; margin-bottom: 12px; }
.center h1 { font-size:18px; margin-top:0; }
