:root {
  --ground: #0A0A0A;
  --ink: #F2F2F2;
  --quiet: #8E8E8E;
  --line: #262626;
  --juice: #FF9500;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--ground);
  color: var(--ink);
  font: 16px/1.6 ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}
main { max-width: 36rem; margin: 0 auto; padding: 4rem 1rem 3rem; }
h1 { font-size: 2.5rem; line-height: 1; margin: 0 0 .5rem; letter-spacing: -.02em; }
h1::after { content: ""; display: inline-block; width: .3em; height: .3em; margin-left: .15em; border-radius: 50%; background: var(--juice); vertical-align: .55em; }
h2 { font-size: 1rem; margin: 2.5rem 0 .5rem; color: var(--quiet); font-weight: normal; }
h2::before { content: "# "; }
p, ol, ul { margin: 0 0 1rem; }
ol, ul { padding-left: 1.5rem; }
li { margin-bottom: .35rem; }
ul.no { list-style: none; padding-left: 0; }
ul.no li::before { content: "no "; color: var(--quiet); }
.tag { color: var(--quiet); margin-bottom: 2.5rem; }
a { color: var(--juice); text-underline-offset: 3px; }
footer { border-top: 1px solid var(--line); margin-top: 3rem; padding-top: 1rem; color: var(--quiet); font-size: .875rem; }

/* The legal pages: a date under the title, and smaller headings that still
   read like a README. */
.date { color: var(--quiet); font-size: .875rem; margin-bottom: 2.5rem; }
h3 { font-size: 1rem; margin: 1.5rem 0 .5rem; }
footer a { color: var(--quiet); margin-right: 1rem; }
