/* The palette, the two schemes, and the page's own frame.

   Every colour in this UI is a token defined here and nowhere else. A rule that
   reaches for a literal colour is a rule that will be wrong in one of the two
   schemes, and the dark one is not a theme anybody opts into — it is what the
   reader's system already said. */

:root {
  --bg: #ffffff; --fg: #1b1f24; --muted: #6a737d; --line: #e1e4e8;
  --panel: #f6f8fa; --accent: #0b62a4; --ins: #116329; --ins-bg: #dafbe1;
  --del: #82071e; --del-bg: #ffebe9; --orphan: #b35900; --hl-bg: #fff3bf;
  /* A row of the file tree under the pointer, and the row that is open. Two
     lifts of the sidebar rather than two colours: which file you are reading
     is said by the accent on the name, and the fill is only there to make the
     row a row. */
  --row-hover: #ebeef2; --row-open: #dde3ea;
  /* the highlight of the comment currently being read, a deeper shade of the
     same colour rather than a different one — same span, more of it */
  --hl-active-bg: #ffd43b;
  /* the one callout kind no other token already means (`> [!IMPORTANT]`) */
  --important: #8250df;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0d1117; --fg: #e6edf3; --muted: #8b949e; --line: #30363d;
    --panel: #161b22; --accent: #58a6ff; --ins: #3fb950; --ins-bg: #12261e;
    --del: #f85149; --del-bg: #2d1214; --orphan: #d29922; --hl-bg: #3b3117;
    --row-hover: #1d232b; --row-open: #262d38;
    --hl-active-bg: #6e5410;
    --important: #a371f7;
  }
}
/* Paper is white whatever the screen says. A PDF of the dark scheme is a page
   of solid ink, and nobody exporting a document means that. */
@media print {
  :root {
    --bg: #ffffff; --fg: #1b1f24; --muted: #6a737d; --line: #e1e4e8;
    --panel: #f6f8fa; --accent: #0b62a4; --ins: #116329; --ins-bg: #dafbe1;
    --del: #82071e; --del-bg: #ffebe9; --orphan: #b35900; --hl-bg: #fff3bf;
    --row-hover: #ebeef2; --row-open: #dde3ea; --hl-active-bg: #ffd43b;
    --important: #8250df;
  }
}
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--bg); color: var(--fg);
  font: 15px/1.6 system-ui, -apple-system, "Segoe UI", sans-serif;
  display: grid; grid-template-columns: 250px 1fr; height: 100vh;
}
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }