:root {
  color-scheme: light dark;
  --bg: #fff;
  --fg: #222;
  --link: #0366d6;
  --code-bg: #f4f4f4;
  --pre-bg: #f6f6f6;
  --border: #ddd;
  --border-soft: #eee;
  --surface: #f8f8f8;
  --quote-fg: #555;
  --edit-border: #bbb;
  --edit-border-hover: #888;
  --edit-border-focus: #4a90d9;
  --edit-focus-bg: #fff;
  --error: #c33;
  --flash: #ffe08a;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #1a1a1a;
    --fg: #ddd;
    --link: #58a6ff;
    --code-bg: #2a2a2a;
    --pre-bg: #242424;
    --border: #3a3a3a;
    --border-soft: #2a2a2a;
    --surface: #2a2a2a;
    --quote-fg: #aaa;
    --edit-border: #555;
    --edit-border-hover: #888;
    --edit-border-focus: #4a90d9;
    --edit-focus-bg: #2a2a2a;
    --error: #f66;
    --flash: #6b5418;
  }
}
body {
  font-family: system-ui, -apple-system, sans-serif;
  background: var(--bg);
  color: var(--fg);
}
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }
.source { text-align: right; font-size: 0.85em; margin: 0.5em 0 0; }