@font-face {
  font-family: "EBGaramond";
  src: url("fonts/ebgaramond.woff2");
  font-weight: normal;
  font-style: normal;
  font-display: optional;
  size-adjust: 116%;
}

@font-face {
  font-family: "EBGaramond";
  src: url("fonts/ebgaramond-bold.woff2");
  font-weight: bold;
  font-style: normal;
  font-display: optional;
  size-adjust: 116%;
}

@font-face {
  font-family: "EBGaramond";
  src: url("fonts/ebgaramond-italic.woff2");
  font-weight: normal;
  font-style: italic;
  font-display: optional;
  size-adjust: 116%;
}

@font-face {
  font-family: "EBGaramond";
  src: url("fonts/ebgaramond-bolditalic.woff2");
  font-weight: bold;
  font-style: italic;
  font-display: optional;
  size-adjust: 116%;
}

html {
  --scale: 1.25;
  --smallest: calc(1rem / var(--scale) / var(--scale) / var(--scale));
  --smaller: calc(1rem / var(--scale) / var(--scale));
  --small: calc(1rem / var(--scale));
  --normal: 1rem;
  --large: calc(1rem * var(--scale));
  --larger: calc(1rem * var(--scale) * var(--scale));
  --largest: calc(1rem * var(--scale) * var(--scale) * var(--scale));
  --whiteish: #f9f9f9;
  --blackish: #111;
  --text-color: var(--blackish);
  --background-color: var(--whiteish);
  --inverted-text-color: var(--whiteish);
  --inverted-background-color: var(--blackish);
  --link-color: #00d;
  --link-visited-color: #70c;
  --dim: #444;
  --dim-background: #eee;
  color: var(--text-color);
  background-color: var(--background-color);
  font-family: "EBGaramond", "Palatino Linotype", Palatino, Palladio, "URW Palladio L", "Book Antiqua", Baskerville, "Bookman Old Style", "Bitstream Charter", "Nimbus Roman No9 L", Garamond, "Apple Garamond", "ITC Garamond Narrow", "New Century Schoolbook", "Century Schoolbook", "Century Schoolbook L", Georgia, serif;
  line-height: 1.45;
  font-size: 1.3rem;
  min-height: 100vh;
  max-width: min(32rem, 100vw);
  margin: auto;
  padding-left: var(--small);
  padding-right: var(--small);
  font-variant-ligatures: common-ligatures;
  font-variant-numeric: oldstyle-nums;
  font-feature-settings: "swsh";
  overflow-wrap: break-word;
  text-rendering: optimizeLegibility;
}

tt, code, kbd, samp {
  font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

a {
  color: var(--link-color);
}

a:visited {
  color: var(--link-visited-color);
}

@media (prefers-color-scheme: dark) {
  html {
    color: #f0f0f0;
    background-color: #0a0a0a;
    --text-color: #eee;
    --background-color: #111;
    --inverted-text-color: #111;
    --inverted-background-color: #eee;
    --link-color: #39f;
    --link-visited-color: #a6d;
    --dim: #aaa;
    --dim-background: #444;
  }
}

body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
  margin: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: normal;
}

h1 {
  margin-top: var(--normal);
  font-size: var(--largest);
}

h2 {
  margin-top: var(--normal);
  font-size: var(--larger);
}

h3 {
  margin-top: var(--normal);
  font-size: var(--large);
}

h1 + p,
h2 + p,
h3 + p {
  margin-top: var(--smaller);
}

ul {
  list-style: square;
}

li::marker {
  color: var(--dim);
}

p.post-time {
  margin-top: 0;
}

p.post-time > time {
  color: var(--dim);
  font-size: var(--small);
}

p {
  margin-top: var(--small);
  hyphens: auto;
  text-align: justify;
}

pre {
  overflow: auto;
}

code {
}

/* Override Prism.js CSS */
figure,
code[class*="language-"],
pre[class*="language-"] {
  margin-top: var(--normal);
  margin-bottom: var(--normal);
}

code[class*="language-"],
pre[class*="language-"] {
  font-size: 0.9em;
  padding-top: var(--smaller);
  padding-bottom: var(--smaller);
}

figcaption + pre[class*="language-"],
figcaption + code[class*="language-"] {
  margin: 0;
  border-radius: 0 0 0.3em 0.3em;
}

figcaption {
  font-size: var(--small);
  padding-left: var(--smallest);
  color: var(--dim);
  border-radius: 0.3em 0.3em 0 0;
  background-color: var(--dim-background);
}

header {
  display: flex;
  flex-wrap: wrap;
  gap: 1em;
}

header > p {
  margin: 0;
}

header > nav > ul {
  display: flex;
  flex-wrap: wrap;
  gap: 1em;
  padding: 0;
  margin: 0;
}

header > nav > ul > li {
  list-style: none;
}

abbr {
  font-variant-caps: all-small-caps;
}

:not(pre) > code {
  border: 0.01em solid var(--dim);
  border-radius: 0.3em;
  padding: 0.15em;
  font-size: 0.74em;
}
