/* Generic page style */

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

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

h1 {
  font-size: 1.68em;
  font-weight: 500;
  font-family: Helvetica, Arial, "DejaVu Sans Condensed", Verdana, sans-serif;
  line-height: 2em;
  margin: 0 0 0.25em;
}

h2 {
  line-height: 1.68em;
  font-size: 1.41em;
  font-weight: 600;
  font-family: Helvetica, Arial, "DejaVu Sans Condensed", Verdana, sans-serif;
  margin: 1.25em 0 0.5em;
}

h3 {
  line-height: 1.41em;
  font-size: 1.18em;
  font-weight: 600;
  font-family: Helvetica, Arial, "DejaVu Sans Condensed", Verdana, sans-serif;
  margin: 1.25em 0 0.5em;
}

h4 {
  line-height: 1.18em;
  font-size: 1em;
  font-weight: 600;
  font-family: Helvetica, Arial, "DejaVu Sans Condensed", Verdana, sans-serif;
  margin: 1.25em 0 0.5em;
}

h5, h6 {
  font-size: 0.7em;
  font-weight: 600;
  font-family: Helvetica, Arial, "DejaVu Sans Condensed", Verdana, sans-serif;
  margin: 1.25em 0 0.5em;
}

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

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

a:hover {
  text-decoration: underline;
}

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

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

p {
  margin: 0.5em 0;
}

dt {
  font-weight: 600;
}

dd {
  margin-left: 2em;
}

caption {
  font-weight: 700;
}

/* LV2 site specific things */

.biglink {
  font-size: large;
  font-family: "SF Pro Text", Verdana, "DejaVu Sans", sans-serif;
}

.siglink {
  font-size: x-small;
  vertical-align: super;
}

img {
  border: none;
}

table {
  border-collapse: collapse;
  border-style: hidden;
  margin: 0.5em;
  border: 0;
}

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

td, th {
  border: 1px solid #DDD;
  padding: 0.25em 0.5em;
}

time, #sitename {
  color: #666;
  font-size: small;
  font-variant: small-caps;
}

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

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

div.article h2 {
  margin-bottom: 0;
}

.postmeta {
  font-size: small;
  font-style: italic;
  color: #666;
}

hr {
  height: 0;
  border: none;
  border-top: 1px solid #EEE;
  margin: 2em 0;
}

ul, ol {
  padding: 0.25em 0 0 3em;
}

strong {
  font-weight: bold;
}

tt, pre {
  font-family: "SF Mono", Menlo, Consolas, "DejaVu Sans Mono", monospace, fixed;
  line-height: 1.2em;
}

pre {
  font-size: 0.8em;
  overflow: auto;
  padding: 0.25em;
  margin: 0.5em;
  line-height: 1.5em;
}

nav {
  border-bottom: 1px solid #EEE;
  padding: 0.25em 0;
  margin-bottom: 1.5em;
}

nav a, nav a:link, nav a:visited {
  text-decoration: none;
}

nav ul {
  margin: 0;
  padding: 0;
  font-family: "SF Pro Text", Verdana, "DejaVu Sans", sans-serif;
}

nav li {
  display: inline;
  margin-right: 0.75em;
}

#logo {
  vertical-align: baseline;
}

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

#content {
  padding: 0;
}

.highlight {
  font-family: "SF Mono", Menlo, Consolas, "DejaVu Sans Mono", monospace, fixed;
  border: solid 1px #EEE;
  color: #444;
  border-radius: 6px;
}

/* Pygments Style */

.highlight .n {
  color: #222;
}

.highlight .c {
  color: #3F4D91;
  font-style: italic;
}

.highlight .err {
  border: 1px solid #DC322F;
}

.highlight .k {
  color: #586E75;
}

.highlight .o {
  color: #586E75;
}

.highlight .cm {
  color: #3F4D91;
  font-style: italic;
}

.highlight .cp {
  color: #586E75;
}

.highlight .cpf {
  color: #93115C;
}

.highlight .c1 {
  color: #3F4D91;
  font-style: italic;
}

.highlight .cs {
  color: #3F4D91;
  font-style: italic;
}

.highlight .gd {
  color: #990A1B;
}

.highlight .ge {
  font-style: italic;
}

.highlight .gr {
  color: #DC322F;
}

.highlight .gh {
  color: #3F4D91;
  font-weight: bold;
}

.highlight .gi {
  color: #859900;
}

.highlight .go {
  color: #666;
}

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

.highlight .gs {
  font-weight: bold;
}

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

.highlight .gt {
  color: #268BD2;
}

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

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

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

.highlight .kp {
  color: #586E75;
}

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

.highlight .kt {
  color: #586E75;
}

.highlight .m {
  color: #666;
}

.highlight .s {
  color: #93115C;
}

.highlight .na {
  color: #444;
}

.highlight .nb {
  color: #3F4D91;
}

.highlight .nc {
  color: #000;
}

.highlight .no {
  color: #880;
}

.highlight .nd {
  color: #A2F;
}

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

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

.highlight .nf {
  color: #000;
}

.highlight .nl {
  color: #546E00;
}

.highlight .nn {
  color: #444;
}

.highlight .nt {
  color: #444;
}

.highlight .nv {
  color: #222;
}

.highlight .ow {
  color: #3F4D91;
}

.highlight .w {
  color: #BBB;
}

.highlight .mb {
  color: #93115C;
  font-weight: bold;
}

.highlight .mf {
  color: #93115C;
}

.highlight .mh {
  color: #93115C;
  font-weight: bold;
}

.highlight .mi {
  color: #93115C;
}

.highlight .mo {
  color: #93115C;
  font-weight: bold;
}

.highlight .sb {
  color: #93115C;
}

.highlight .sc {
  color: #93115C;
}

.highlight .sd {
  color: #3F4D91;
  font-style: italic;
}

.highlight .s2 {
  color: #93115C;
}

.highlight .se {
  color: #93115C;
  font-weight: bold;
}

.highlight .sh {
  color: #93115C;
}

.highlight .si {
  color: #93115C;
  font-weight: bold;
}

.highlight .sx {
  color: #93115C;
}

.highlight .sr {
  color: #93115C;
  font-weight: bold;
}

.highlight .s1 {
  color: #93115C;
}

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

.highlight .bp {
  color: #859900;
}

.highlight .vc {
  color: #00629D;
}

.highlight .vg {
  color: #00629D;
}

.highlight .vi {
  color: #00629D;
}

.highlight .il {
  color: #000;
}

.highlight .p {
  color: #444;
}

/* Dark theme */
@media (prefers-color-scheme: dark) {
  html {
    background: #222;
    color: #DDD;
  }

  a {
    color: #B4C342;
  }

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

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

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

  th {
    background-color: #282828;
  }

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

  time, #sitename {
    color: #AAA;
  }

  blockquote {
    color: #DDD;
  }

  .postmeta {
    color: #AAA;
  }

  hr {
    border-top: 1px solid #444;
  }

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

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

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

  /* Pygments Style */

  .highlight .n {
    color: #BBB;
  }

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

  .highlight .err {
    border: 1px solid #FF6E64;
  }

  .highlight .k {
    color: #93A1A1;
  }

  .highlight .o {
    color: #93A1A1;
  }

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

  .highlight .cp {
    color: #93A1A1;
  }

  .highlight .cpf {
    color: #D33682;
  }

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

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

  .highlight .gd {
    color: #DC322F;
  }

  .highlight .ge {
    font-style: italic;
  }

  .highlight .gr {
    color: #FF6E64;
  }

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

  .highlight .gi {
    color: #859900;
  }

  .highlight .go {
    color: #666;
  }

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

  .highlight .gs {
    font-weight: bold;
  }

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

  .highlight .gt {
    color: #69B7F0;
  }

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

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

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

  .highlight .kp {
    color: #93A1A1;
  }

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

  .highlight .kt {
    color: #93A1A1;
  }

  .highlight .m {
    color: #999;
  }

  .highlight .s {
    color: #D33682;
  }

  .highlight .na {
    color: #BBB;
  }

  .highlight .nb {
    color: #6C71C4;
  }

  .highlight .nc {
    color: #FFF;
  }

  .highlight .no {
    color: #880;
  }

  .highlight .nd {
    color: #A2F;
  }

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

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

  .highlight .nf {
    color: #FFF;
  }

  .highlight .nl {
    color: #546E00;
  }

  .highlight .nn {
    color: #BBB;
  }

  .highlight .nt {
    color: #BBB;
  }

  .highlight .nv {
    color: #DDD;
  }

  .highlight .ow {
    color: #6C71C4;
  }

  .highlight .w {
    color: #BBB;
  }

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

  .highlight .mf {
    color: #D33682;
  }

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

  .highlight .mi {
    color: #D33682;
  }

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

  .highlight .sb {
    color: #D33682;
  }

  .highlight .sc {
    color: #D33682;
  }

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

  .highlight .s2 {
    color: #D33682;
  }

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

  .highlight .sh {
    color: #D33682;
  }

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

  .highlight .sx {
    color: #D33682;
  }

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

  .highlight .s1 {
    color: #D33682;
  }

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

  .highlight .bp {
    color: #859900;
  }

  .highlight .vc {
    color: #268BD2;
  }

  .highlight .vg {
    color: #268BD2;
  }

  .highlight .vi {
    color: #268BD2;
  }

  .highlight .il {
    color: #FFF;
  }

  .highlight .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;
  }
}