:root { color-scheme: dark; --bg:#0f1115; --card:#181b22; --fg:#e8e8ea; --mute:#8b8f98; --ok:#4ade80; --bad:#f87171; --warn:#fbbf24; --acc:#3b82f6; }
* { box-sizing: border-box; }
body { margin:0; padding:16px; background:var(--bg); color:var(--fg); font:14px/1.45 system-ui, sans-serif; }
button { padding:5px 10px; border-radius:6px; border:0; background:var(--acc); color:#fff; font:inherit; cursor:pointer; }
button:disabled { opacity:.4; cursor:default; }
button.alt { background:#2a2f3a; }
input, textarea { padding:5px 8px; border-radius:6px; border:1px solid #333; background:#0b0d11; color:var(--fg); font:inherit; }
.mute { color:var(--mute); } .ok { color:var(--ok); } .bad { color:var(--bad); } .warn { color:var(--warn); }
.row { display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.card { display:inline-flex; align-items:center; justify-content:center; width:34px; height:44px; border-radius:6px; background:#222733; font-size:20px; margin:2px; }
.card.pass { outline:2px solid var(--warn); }