/* Page Style */

html {
  background: #fff;
  color: #222;
}

body {
  font-family: "SF Pro Text", Verdana, "DejaVu Sans", sans-serif;
  font-style: normal;
  line-height: 1.382em;
  margin: 0 auto auto;
  max-width: 60em;
  padding: 1em;
  text-rendering: optimizelegibility;
}

h1 {
  font-family: Helvetica, Arial, "DejaVu Sans Condensed", Verdana, sans-serif;
  font-size: 3em;
  font-weight: 600;
  line-height: 114.6%;
  margin: 1.146em 0;
}

h2 {
  font-family: Helvetica, Arial, "DejaVu Sans Condensed", Verdana, sans-serif;
  font-size: 2.618em;
  font-weight: 600;
  line-height: 114.6%;
  margin: 1.146em 0;
}

h3 {
  font-family: Helvetica, Arial, "DejaVu Sans Condensed", Verdana, sans-serif;
  font-size: 1.854em;
  font-weight: 600;
  line-height: 114.6%;
  margin: 1.146em 0;
}

h4 {
  font-family: Helvetica, Arial, "DejaVu Sans Condensed", Verdana, sans-serif;
  font-size: 1.618em;
  font-weight: 600;
  line-height: 114.6%;
  margin: 1.146em 0;
}

h5 {
  font-family: Helvetica, Arial, "DejaVu Sans Condensed", Verdana, sans-serif;
  font-size: 1.146em;
  font-weight: 600;
  line-height: 114.6%;
  margin: 1.146em 0;
}

h6 {
  font-family: Helvetica, Arial, "DejaVu Sans Condensed", Verdana, sans-serif;
  font-size: 1em;
  font-weight: 600;
  line-height: 114.6%;
  margin: 1.146em 0;
}

a {
  color: #546e00;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

table {
  border-collapse: collapse;
  margin: 0.618em;
  empty-cells: hide;
}

th {
  background-color: #f8f8f8;
  font-weight: bold;
  text-align: left;
  vertical-align: text-top;
}

td,
th {
  border: 1px solid #ddd;
  padding: 0.236em 0.618em;
}

img {
  border: none;
  max-width: 100%;
}

div.figures {
  text-align: center;
  margin: 1em auto;
}

figcaption {
  text-align: center;
  margin-top: 0.5ex;
}

figure {
  margin: 0.708em;
  display: inline-block;
}

figure.img {
  display: block;
}

img.figure {
  display: block;
  margin: 0;
}

blockquote {
  color: #333;
  margin: 0;
  padding: 0 4.236em;
}

p {
  margin: 1em 0 0.708em;
}

p.caption {
  font-size: small;
  margin-top: 0;
}

ul,
ol {
  margin: 0;
  padding: 0 0 0 2.618em;
}

strong {
  font-weight: bold;
}

pre {
  overflow: auto;
  padding: 0.271em;
  margin: 0.618em;
}

hr {
  border: 0;
  height: 0;
  border-top: 1px dashed #ddd;
}

nav {
  border-bottom: 1px solid #ddd;
  font-size: small;
  margin: 0 0 1em;
  padding: 0;
}

nav > ul {
  margin: 0 0 0.618em;
  padding: 0;
}

nav > ul > li {
  display: inline;
  margin: 0 0.618em 0 0;
}

footer {
  font-size: small;
  color: #aaa;
  margin: 2.618em 0 0;
  padding: 0.271em;
  width: 100%;
}

#logo {
  vertical-align: middle;
}

header a#page-title {
  color: #222;
}

.postmeta {
  color: #444;
  font-size: x-small;
}

.articlelink {
  margin-bottom: 1em;
}

.postlist > li {
  margin-bottom: 0.5em;
}

.highlight {
  font-family: monospace;
  border: solid 1px #ddd;
  border-radius: 6px;
}

article {
  margin: 0 0 2.618em;
}

article h2,
.articletitle {
  margin-bottom: 0;
  padding-bottom: 0;
}

.articleheader {
  margin-bottom: 2.618em;
}

/* Pygments Style */

.c {
  color: #6c71c4;
  font-style: italic;
}

.err {
  border: 1px solid #dc322f;
}

.k {
  color: #888;
}

.o {
  color: #839496;
}

.cm {
  color: #6c71c4;
  font-style: italic;
}

.cp {
  color: #d33682;
}

.c1 {
  color: #6c71c4;
  font-style: italic;
}

.cs {
  color: #6c71c4;
  font-style: italic;
}

.gd {
  color: #a00000;
}

.ge {
  font-style: italic;
}

.gr {
  color: #dc322f;
}

.gh {
  color: #6c71c4;
  font-weight: bold;
}

.gi {
  color: #859900;
}

.go {
  color: #808080;
}

.gp {
  color: #268bd2;
  font-weight: bold;
}

.gs {
  font-weight: bold;
}

.gu {
  color: #800080;
  font-weight: bold;
}

.gt {
  color: #0040d0;
}

.kc {
  color: #586e75;
  font-weight: bold;
}

.kd {
  color: #586e75;
  font-weight: bold;
}

.kn {
  color: #586e75;
  font-weight: bold;
}

.kp {
  color: #586e75;
}

.kr {
  color: #586e75;
  font-weight: bold;
}

.kt {
  color: #546e00;
}

.m {
  color: #666;
}

.s {
  color: #cb4b16;
}

.na {
  color: #7d9029;
}

.nb {
  color: #008000;
}

.nc {
  color: #000;
}

.no {
  color: #880;
}

.nd {
  color: #a2f;
}

.ni {
  color: #999;
  font-weight: bold;
}

.ne {
  color: #d2413a;
  font-weight: bold;
}

.nf {
  color: #000;
}

.nl {
  color: #a0a000;
}

.nn {
  color: #555;
}

.nt {
  color: #232;
}

.nv {
  color: #222;
}

.ow {
  color: #a2f;
  font-weight: bold;
}

.w {
  color: #bbb;
}

.mf {
  color: #000;
}

.mh {
  color: #000;
}

.mi {
  color: #000;
}

.mo {
  color: #000;
}

.sb {
  color: #cb4b16;
}

.sc {
  color: #cb4b16;
}

.sd {
  color: #cb4b16;
  font-style: italic;
}

.s2 {
  color: #cb4b16;
}

.se {
  color: #b62;
  font-weight: bold;
}

.sh {
  color: #cb4b16;
}

.si {
  color: #b68;
  font-weight: bold;
}

.sx {
  color: #008000;
}

.sr {
  color: #b68;
}

.s1 {
  color: #cb4b16;
}

.ss {
  color: #00629d;
}

.bp {
  color: #008000;
}

.vc {
  color: #00629d;
}

.vg {
  color: #00629d;
}

.vi {
  color: #00629d;
}

.il {
  color: #666;
}

.p {
  color: #888;
}

/* Simple layout with no navigation on paper */
@media print {
  body {
    margin: 6em 4em;
    color: #000;
  }

  a {
    color: #000;
    text-decoration: none;
  }

  h1 a,
  h2 a,
  h3 a,
  h4 a,
  h5 a,
  h6 a {
    color: #000;
  }

  h1 a:link,
  h2 a:link,
  h3 a:link,
  h4 a:link,
  h5 a:link,
  h6 a:link {
    color: #000;
  }

  h1 a:visited,
  h2 a:visited,
  h3 a:visited,
  h4 a:visited,
  h5 a:visited,
  h6 a:visited {
    color: #000;
  }

  nav {
    display: none;
  }

  .articletitle {
    margin-top: 1.146em;
  }

  .highlight {
    background-color: transparent;
    border-radius: 0;
    border: 1px solid #ddd;
  }
}

/* Dark theme */
@media (prefers-color-scheme: dark) {
  /* Page Style */

  html {
    background: #222;
    color: #ddd;
  }

  a {
    color: #b4c342;
  }

  th {
    background-color: #282828;
  }

  td,
  th {
    border: 1px solid #383838;
  }

  .postmeta {
    color: #aaa;
  }

  blockquote {
    color: #ddd;
  }

  hr {
    border-top-color: #444;
  }

  nav {
    border-bottom-color: #444;
  }

  footer {
    color: #aaa;
  }

  header a#page-title {
    color: #ddd;
  }

  .highlight {
    border: solid 1px #444;
  }

  /* Pygments Style */

  .n {
    color: #bbb;
  }

  .c {
    color: #6c71c4;
    font-style: italic;
  }

  .err {
    border: 1px solid #ff6e64;
  }

  .k {
    color: #93a1a1;
  }

  .o {
    color: #93a1a1;
  }

  .cm {
    color: #6c71c4;
    font-style: italic;
  }

  .cp {
    color: #93a1a1;
  }

  .cpf {
    color: #d33682;
  }

  .c1 {
    color: #6c71c4;
    font-style: italic;
  }

  .cs {
    color: #6c71c4;
    font-style: italic;
  }

  .gd {
    color: #dc322f;
  }

  .ge {
    font-style: italic;
  }

  .gr {
    color: #ff6e64;
  }

  .gh {
    color: #6c71c4;
    font-weight: bold;
  }

  .gi {
    color: #859900;
  }

  .go {
    color: #666;
  }

  .gp {
    color: #666;
    font-weight: bold;
  }

  .gs {
    font-weight: bold;
  }

  .gu {
    color: #bbb;
    font-weight: bold;
  }

  .gt {
    color: #69b7f0;
  }

  .kc {
    color: #93a1a1;
    font-weight: bold;
  }

  .kd {
    color: #93a1a1;
    font-weight: bold;
  }

  .kn {
    color: #93a1a1;
    font-weight: bold;
  }

  .kp {
    color: #93a1a1;
  }

  .kr {
    color: #93a1a1;
    font-weight: bold;
  }

  .kt {
    color: #93a1a1;
  }

  .m {
    color: #999;
  }

  .s {
    color: #d33682;
  }

  .na {
    color: #bbb;
  }

  .nb {
    color: #6c71c4;
  }

  .nc {
    color: #fff;
  }

  .no {
    color: #880;
  }

  .nd {
    color: #a2f;
  }

  .ni {
    color: #999;
    font-weight: bold;
  }

  .ne {
    color: #d2413a;
    font-weight: bold;
  }

  .nf {
    color: #fff;
  }

  .nl {
    color: #546e00;
  }

  .nn {
    color: #bbb;
  }

  .nt {
    color: #bbb;
  }

  .nv {
    color: #ddd;
  }

  .ow {
    color: #6c71c4;
  }

  .w {
    color: #bbb;
  }

  .mb {
    color: #d33682;
    font-weight: bold;
  }

  .mf {
    color: #d33682;
  }

  .mh {
    color: #d33682;
    font-weight: bold;
  }

  .mi {
    color: #d33682;
  }

  .mo {
    color: #d33682;
    font-weight: bold;
  }

  .sb {
    color: #d33682;
  }

  .sc {
    color: #d33682;
  }

  .sd {
    color: #6c71c4;
    font-style: italic;
  }

  .s2 {
    color: #d33682;
  }

  .se {
    color: #d33682;
    font-weight: bold;
  }

  .sh {
    color: #d33682;
  }

  .si {
    color: #d33682;
    font-weight: bold;
  }

  .sx {
    color: #d33682;
  }

  .sr {
    color: #d33682;
    font-weight: bold;
  }

  .s1 {
    color: #d33682;
  }

  .ss {
    color: #bbb;
    font-weight: bold;
  }

  .bp {
    color: #859900;
  }

  .vc {
    color: #268bd2;
  }

  .vg {
    color: #268bd2;
  }

  .vi {
    color: #268bd2;
  }

  .il {
    color: #fff;
  }

  .p {
    color: #bbb;
  }
}

/* Hard black for dark mode on mobile (since it's likely to be an OLED screen) */
@media only screen and (hover: none) and (pointer: coarse) and (prefers-color-scheme: dark) {
  html {
    background: #000;
    color: #ccc;
  }
}