:root { --fg:#111; --bg:#fff; --mute:#666; --line:#e5e5e5; --accent:#0a58ca; --ok:#1a7f37; --err:#b42318; --warn:#9a6700; --soft:#f6f6f6; }
@media (prefers-color-scheme: dark) { :root { --fg:#eee; --bg:#111; --mute:#9a9a9a; --line:#2a2a2a; --accent:#6ea8fe; --ok:#3fb950; --err:#ff7b72; --warn:#d29922; --soft:#1a1a1a; } }
* { box-sizing: border-box; }
body { margin:0; font: 16px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; color:var(--fg); background:var(--bg); }
a { color:var(--accent); text-decoration:none; } a:hover { text-decoration:underline; }
code, pre { font: 13px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
code { background:var(--soft); padding:1px 4px; border-radius:3px; word-break: break-all; }
pre { background:var(--soft); padding:12px; border-radius:6px; overflow:auto; white-space:pre-wrap; word-break:break-word; }
header { border-bottom:1px solid var(--line); }
.wrap { max-width: 1040px; margin: 0 auto; padding: 0 20px; }
nav { display:flex; align-items:center; gap:18px; height:56px; flex-wrap:wrap; }
nav .brand { font-weight:700; margin-right:auto; color:var(--fg); }
.badge { display:inline-block; font-size:12px; padding:2px 8px; border-radius:999px; border:1px solid var(--line); color:var(--mute); vertical-align:middle; }
.badge.testnet { border-color:var(--warn); color:var(--warn); }
.badge.mainnet { border-color:var(--ok); color:var(--ok); }
.banner { background:#fff3cd; color:#5c4400; padding:10px 20px; border-bottom:1px solid #ffe69c; }
main { padding: 28px 0 60px; }
h1 { font-size: 28px; margin: 0 0 8px; } h2 { font-size: 20px; margin: 32px 0 10px; } h3 { font-size:16px; margin:20px 0 6px; }
.sub { color:var(--mute); margin:0 0 20px; }
.grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap:16px; }
.card { border:1px solid var(--line); border-radius:8px; padding:14px 16px; }
.card h3 { margin:0 0 6px; }
.k { color:var(--mute); font-size:13px; }
table { width:100%; border-collapse:collapse; font-size:14px; } th, td { text-align:left; padding:8px 6px; border-bottom:1px solid var(--line); vertical-align:top; } th { color:var(--mute); font-weight:600; }
.pill { display:inline-block; font-size:12px; padding:1px 8px; border-radius:999px; background:var(--soft); color:var(--mute); }
.pill.open { color:var(--ok); } .pill.closed, .pill.decided { color:var(--mute); } .pill.passed { color:var(--ok); } .pill.failed, .pill.no_quorum { color:var(--err); }
.bar { height:8px; background:var(--soft); border-radius:4px; overflow:hidden; display:flex; } .bar .for { background:var(--ok); } .bar .against { background:var(--err); }
form.block label { display:block; margin:12px 0 4px; font-weight:600; font-size:14px; }
input[type=text], textarea, select { width:100%; padding:8px 10px; border:1px solid var(--line); border-radius:6px; background:var(--bg); color:var(--fg); font:inherit; }
textarea { min-height: 120px; }
button { font:inherit; padding:8px 14px; border-radius:6px; border:1px solid var(--accent); background:var(--accent); color:#fff; cursor:pointer; }
button.ghost { background:transparent; color:var(--accent); }
button:disabled { opacity:.5; cursor:default; }
.msg { margin-top:10px; padding:8px 10px; border-radius:6px; font-size:14px; } .msg.ok { background:#e6f4ea; color:var(--ok); } .msg.err { background:#fdecea; color:var(--err); }
details { margin:8px 0; } summary { cursor:pointer; color:var(--accent); }
.mute { color:var(--mute); }
.right { text-align:right; }
footer { border-top:1px solid var(--line); color:var(--mute); font-size:13px; padding:18px 0; }
.keybox { border:1px dashed var(--line); border-radius:8px; padding:12px 14px; margin: 0 0 20px; font-size:14px; }
.row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.small { font-size:13px; }
.num { font-variant-numeric: tabular-nums; }