/* A plain .txt file: the reader's own monospace, one column, one accent.
   No web fonts, no images. */
:root { --ink: #222; --paper: #fff; --dim: #777; --link: #1f6f43; }
@media (prefers-color-scheme: dark) {
  :root { --ink: #ddd; --paper: #181818; --dim: #888; --link: #7fd49c; }
}
body {
  margin: 0 auto;
  padding: 1.5rem 1rem 2.5rem;
  max-width: 64ch;
  background: var(--paper);
  color: var(--ink);
  font: 15px/1.5 ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
}
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }
.dim { color: var(--dim); }

h1, h2 {
  font-size: 1em;
  font-weight: bold;
  white-space: pre;
  line-height: 1.2;
  margin: 2em 0 0.8em;
}
h1 { margin-top: 0; }
h1 span, h2 span { font-weight: normal; color: var(--dim); }
p { margin: 0 0 1em; }
.pre { white-space: pre-wrap; }
.nav { margin-bottom: 2em; }

/* Homepage photo: floats right so the header and bio wrap around it. */
.portrait { float: right; width: 20ch; margin: 0.2em 0 1em 3ch; }
.portrait img { display: block; width: 100%; height: auto; }
.portrait figcaption { color: var(--dim); font-size: 0.85em; margin-top: 0.4em; }
.portrait ~ h2 { clear: both; }
@media (max-width: 30rem) {
  .portrait { width: 13ch; margin-left: 2ch; }
}

.items { list-style: none; padding: 0; margin: 0 0 1em; }
.items li { position: relative; padding-left: 2ch; margin-bottom: 1em; }
.items li::before { content: "*"; position: absolute; left: 0; }

.prose h2, .prose h3 { white-space: normal; }
.prose h2::before { content: "## "; color: var(--dim); }
.prose h3::before { content: "### "; color: var(--dim); }
.prose blockquote { margin: 0 0 1em; color: var(--dim); }
.prose blockquote p::before { content: "> "; }
.prose code { font-family: inherit; }
.prose code::before, .prose code::after { content: "`"; color: var(--dim); }
.prose ul { padding-left: 2ch; list-style: "- "; }

footer { margin-top: 3rem; color: var(--dim); }