:root { color-scheme: light dark; --fg: #1b1b1b; --bg: #fafafa; --muted: #6b6b6b; --line: #d4d4d4;
  --bad: #b3261e; --good: #1e6b34; --accent: #0b57d0; }
@media (prefers-color-scheme: dark) {
  :root { --fg: #e8e8e8; --bg: #161616; --muted: #9a9a9a; --line: #3a3a3a; --bad: #ff8a80; --good: #81c995; --accent: #8ab4f8; }
}
* { box-sizing: border-box; }
body { margin: 0; font: 15px/1.45 system-ui, sans-serif; color: var(--fg); background: var(--bg); }
nav { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; padding: 10px 16px; border-bottom: 1px solid var(--line); }
nav form.inline { margin-left: auto; }
main { padding: 16px; max-width: 1200px; }
a { color: var(--accent); }
h1 { font-size: 1.4em; } h2 { font-size: 1.15em; margin-top: 1.6em; }
table { border-collapse: collapse; margin: 8px 0; }
th, td { border: 1px solid var(--line); padding: 4px 8px; text-align: left; vertical-align: top; }
table.rows { display: block; overflow-x: auto; max-width: 100%; }
table.kv th { font-weight: 600; white-space: nowrap; }
.muted { color: var(--muted); }
.problem, .warning { color: var(--bad); }
.ok { color: var(--good); }
.note { color: var(--muted); font-size: 0.92em; }
form.write { border: 1px solid var(--line); padding: 10px 12px; margin: 8px 0; max-width: 640px; }
form.write.danger { border-color: var(--bad); }
form.search { display: inline-flex; flex-wrap: wrap; gap: 8px; align-items: end; margin: 0 16px 8px 0; }
label { display: block; margin: 6px 0; }
input, select, textarea, button { font: inherit; }
textarea { width: 100%; min-height: 3.5em; }
button, a.button { display: inline-block; padding: 6px 14px; border: 1px solid var(--accent); background: transparent;
  color: var(--accent); border-radius: 4px; cursor: pointer; text-decoration: none; }
form.danger button { border-color: var(--bad); color: var(--bad); }
img.qr { width: 240px; height: 240px; background: #fff; padding: 8px; }
details { margin: 4px 0; }
.entry { border-top: 1px solid var(--line); padding-top: 8px; }
.paging a { margin-right: 16px; }