:root { --bar: #112e51; --ink: #212121; --muted: #5b616b; --link: #0071bc; --rule: #d6d7d9; --bg: #fff; --canvas: #f1f1f1; --warn: #fef6e5; --warnb: #b7791f; --sig: #b50909; }
@media (prefers-color-scheme: dark) { :root { --bar: #0a1b30; --ink: #e6e8eb; --muted: #a3aab3; --link: #6cb4ee; --rule: #2c343d; --bg: #121820; --canvas: #1b222b; --warn: #2b2416; --warnb: #e0a84a; --sig: #ff8a8a; } }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 15px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; }
.wrap { max-width: 1100px; margin: 0 auto; padding: 16px; }
nav.top { display: flex; gap: 12px; align-items: center; justify-content: space-between; border-bottom: 3px solid var(--bar); padding-bottom: 8px; margin-bottom: 16px; }
a { color: var(--link); }
h1 { font-size: 1.4rem; margin: 8px 0; } h2 { font-size: 1.1rem; margin: 20px 0 8px; border-bottom: 1px solid var(--rule); }
table { border-collapse: collapse; width: 100%; } th, td { border: 1px solid var(--rule); padding: 4px 8px; text-align: left; vertical-align: top; }
th { background: var(--canvas); } td.num { text-align: right; }
pre.data { white-space: pre-wrap; word-break: break-word; background: var(--canvas); border: 1px solid var(--rule); padding: 8px; max-height: 480px; overflow: auto; font-size: 13px; }
code.url { word-break: break-all; } .hash { font: 12px ui-monospace, monospace; color: var(--muted); word-break: break-all; }
.meta, .hint { color: var(--muted); } .warn { background: var(--warn); border-left: 4px solid var(--warnb); padding: 6px 10px; }
.badge { display: inline-block; border: 1px solid var(--rule); border-radius: 10px; padding: 0 8px; font-size: 12px; margin-right: 4px; }
.badge.sig, .signals strong { color: var(--sig); border-color: var(--sig); }
.signals code { font-size: 12px; } .reason { color: var(--sig); }
section.item { border: 1px solid var(--rule); padding: 8px 12px; margin: 8px 0; }
form.decide { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 8px; }
form.decide input[name=reden] { flex: 1; min-width: 220px; padding: 4px 6px; }
form.inline { display: inline; }
button { font: inherit; padding: 4px 12px; border: 1px solid var(--rule); background: var(--bg); color: var(--ink); cursor: pointer; border-radius: 3px; }
button.pri { background: var(--bar); color: #fff; border-color: var(--bar); }
label.confirm { color: var(--sig); }