/* Plain-text blog: one <pre> per page, monospace, ~100-column frame. */
html { -webkit-text-size-adjust: 100%; }
body { background: #fff; color: #000; margin: 0; }
pre {
  font-family: "DejaVu Sans Mono", "Courier New", monospace;
  font-size: 14px;
  line-height: 1.35;
  white-space: pre;
  max-width: 100ch;
  margin: 0 auto;
  padding: 1.2em 1em 2.4em;
  overflow-x: auto;
}
a { color: #00188f; }
a:visited { color: #551a8b; }
a:hover { background: #ffffcc; }

/* Narrow screens: shrink the type so the 100-column frame fits better.
   The art stays intact; overflow-x keeps anything wider scrollable. */
@media (max-width: 600px) {
  pre { font-size: 12px; padding: 1em 0.6em 2em; }
}
@media (max-width: 380px) {
  pre { font-size: 10.5px; }
}

/* Dark mode, automatic from the reader's OS setting. Pure CSS, no toggle. */
@media (prefers-color-scheme: dark) {
  body { background: #101316; color: #d3d7da; }
  a { color: #6ea8ff; }
  a:visited { color: #c2a3ff; }
  a:hover { background: #2a2a00; color: #ffffff; }
}