:root {
  --text-color: #333333;
  --bg-color: #ffffff;
  --link-color: #0056b3;
  --link-hover-color: #003d82;
  --border-color: #e5e5e5;
  --code-bg: #f5f5f5;
  --code-color: #333;
  --gutter-color: #888;
  --muted-color: #666;
  --rule-color: #d0d0d0;
  --row-alt-bg: #fafafa;
  --font-body: 'Noto Sans', sans-serif;
  --font-code: 'Fira Code', monospace;
  --max-width: 800px;
}

/*
 * Dark theme. Applied either when the OS asks for it and the reader has not
 * chosen otherwise, or when they explicitly picked dark via the toggle.
 */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme=light]) {
    --text-color: #e4e4e7;
    --bg-color: #16181c;
    --link-color: #7cb3ff;
    --link-hover-color: #a5c9ff;
    --border-color: #2e3138;
    --code-bg: #1e2127;
    --code-color: #e4e4e7;
    --gutter-color: #6b7280;
    --muted-color: #9ca3af;
    --rule-color: #3a3f47;
    --row-alt-bg: #1c1f24;
  }
}
:root[data-theme=dark] {
  --text-color: #e4e4e7;
  --bg-color: #16181c;
  --link-color: #7cb3ff;
  --link-hover-color: #a5c9ff;
  --border-color: #2e3138;
  --code-bg: #1e2127;
  --code-color: #e4e4e7;
  --gutter-color: #6b7280;
  --muted-color: #9ca3af;
  --rule-color: #3a3f47;
  --row-alt-bg: #1c1f24;
}

body {
  font-family: var(--font-body);
  color: var(--text-color);
  background-color: var(--bg-color);
  line-height: 1.6;
  margin: 0;
  padding: 0;
}

.container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 20px;
}

a {
  color: var(--link-color);
  text-decoration: none;
}

a:hover {
  color: var(--link-hover-color);
  text-decoration: underline;
}

/* Header */
.site-header {
  border-bottom: 1px solid var(--border-color);
  padding: 20px 0;
  margin-bottom: 40px;
}

.site-header .container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.site-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text-color);
}

.site-title:hover {
  text-decoration: none;
  color: var(--link-color);
}

.site-nav a {
  margin-left: 20px;
  color: var(--text-color);
}

.site-nav a:hover {
  color: var(--link-color);
}

/* Theme toggle */
.theme-toggle {
  margin-left: 20px;
  padding: 4px;
  border: none;
  background: none;
  color: var(--text-color);
  cursor: pointer;
  line-height: 0;
  border-radius: 5px;
  vertical-align: middle;
}

.theme-toggle:hover {
  color: var(--link-color);
  background-color: var(--code-bg);
}

.theme-toggle:focus-visible {
  outline: 2px solid var(--link-color);
  outline-offset: 2px;
}

/* Show the icon for the theme the click would switch *to*. */
.theme-toggle .icon-moon {
  display: block;
}

.theme-toggle .icon-sun {
  display: none;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme=light]) .theme-toggle .icon-moon {
    display: none;
  }
  :root:not([data-theme=light]) .theme-toggle .icon-sun {
    display: block;
  }
}
:root[data-theme=dark] .theme-toggle .icon-moon {
  display: none;
}
:root[data-theme=dark] .theme-toggle .icon-sun {
  display: block;
}

:root[data-theme=light] .theme-toggle .icon-moon {
  display: block;
}
:root[data-theme=light] .theme-toggle .icon-sun {
  display: none;
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
  margin-top: 1.5em;
  margin-bottom: 0.5em;
  font-weight: 700;
}

p {
  margin-bottom: 1.2em;
}

/* Code & Syntax Highlighting */
code, pre {
  font-family: var(--font-code);
  font-size: 0.9em;
}

p code, li code {
  background-color: var(--code-bg);
  padding: 0.2em 0.4em;
  border-radius: 3px;
}

.highlighter-rouge, figure.highlight {
  background-color: var(--code-bg);
  border-radius: 5px;
  padding: 10px;
  overflow-x: auto;
  margin-bottom: 1.5em;
}

.highlighter-rouge pre {
  margin: 0;
}

/* Rouge Line Numbers */
.rouge-table {
  border-collapse: collapse;
  width: 100%;
}

.rouge-table td {
  padding: 0;
  border: none;
}

.rouge-table td.rouge-gutter.gl {
  width: 3em;
  padding-right: 1em;
  text-align: right;
  color: var(--gutter-color);
  user-select: none;
}

/* Footer */
.site-footer {
  border-top: 1px solid var(--border-color);
  padding: 40px 0;
  margin-top: 60px;
  text-align: center;
  color: var(--muted-color);
  font-size: 0.9em;
}

/* Pagination */
.pagination {
  margin-top: 40px;
  display: flex;
  justify-content: space-between;
}

/* Post list */
.post-list {
  list-style: none;
  padding: 0;
}

.post-list li {
  margin-bottom: 40px;
}

.post-meta {
  font-size: 0.9em;
  color: var(--muted-color);
  margin-bottom: 10px;
}

.read-more {
  display: inline-block;
  margin-top: 15px;
  font-weight: bold;
}

/* Images */
.post-content img {
  display: block;
  max-width: 100%;
  height: auto; /* keeps the aspect ratio while max-width shrinks it */
  margin: 1.5em auto;
  border-radius: 5px;
}

/* Tables (rouge uses tables for line numbers, hence the exclusion) */
.post-content table:not(.rouge-table) {
  display: block; /* so wide tables scroll instead of overflowing the page */
  max-width: 100%;
  overflow-x: auto;
  border-collapse: collapse;
  margin-bottom: 1.5em;
  font-size: 0.9em;
}
.post-content table:not(.rouge-table) th, .post-content table:not(.rouge-table) td {
  border: 1px solid var(--border-color);
  padding: 8px 12px;
  text-align: left;
  white-space: nowrap;
}
.post-content table:not(.rouge-table) th {
  background-color: var(--code-bg);
  border-bottom: 2px solid var(--rule-color);
}
.post-content table:not(.rouge-table) tbody tr:nth-child(even) {
  background-color: var(--row-alt-bg);
}

/* Footnotes */
sup {
  font-size: 0.75em;
  line-height: 0; /* keep markers from stretching the line */
}

.footnotes {
  font-size: 0.9em;
  color: var(--muted-color);
}

.footnotes ol {
  padding-left: 1.2em;
}

.footnotes li {
  margin-bottom: 0.5em;
}

.footnotes p {
  margin: 0;
}

.reversefootnote {
  margin-left: 0.4em;
}

/* Rouge Pygments Minimal Style */
.c {
  color: #999988;
  font-style: italic;
} /* Comment */
.err {
  color: #a61717;
  background-color: #e3d2d2;
} /* Error */
.k {
  font-weight: bold;
} /* Keyword */
.o {
  font-weight: bold;
} /* Operator */
.cm {
  color: #999988;
  font-style: italic;
} /* Comment.Multiline */
.cp {
  color: #999999;
  font-weight: bold;
} /* Comment.Preproc */
.c1 {
  color: #999988;
  font-style: italic;
} /* Comment.Single */
.cs {
  color: #999999;
  font-weight: bold;
  font-style: italic;
} /* Comment.Special */
.gd {
  color: #000000;
  background-color: #ffdddd;
} /* Generic.Deleted */
.ge {
  font-style: italic;
} /* Generic.Emph */
.gr {
  color: #aa0000;
} /* Generic.Error */
.gh {
  color: #999999;
} /* Generic.Heading */
.gi {
  color: #000000;
  background-color: #ddffdd;
} /* Generic.Inserted */
.go {
  color: #888888;
} /* Generic.Output */
.gp {
  color: #555555;
} /* Generic.Prompt */
.gs {
  font-weight: bold;
} /* Generic.Strong */
.gu {
  color: #aaaaaa;
} /* Generic.Subheading */
.gt {
  color: #aa0000;
} /* Generic.Traceback */
.kc {
  font-weight: bold;
} /* Keyword.Constant */
.kd {
  font-weight: bold;
} /* Keyword.Declaration */
.kn {
  font-weight: bold;
} /* Keyword.Namespace */
.kp {
  font-weight: bold;
} /* Keyword.Pseudo */
.kr {
  font-weight: bold;
} /* Keyword.Reserved */
.kt {
  color: #445588;
  font-weight: bold;
} /* Keyword.Type */
.m {
  color: #009999;
} /* Literal.Number */
.s {
  color: #d14;
} /* Literal.String */
.na {
  color: #008080;
} /* Name.Attribute */
.nb {
  color: #0086B3;
} /* Name.Builtin */
.nc {
  color: #445588;
  font-weight: bold;
} /* Name.Class */
.no {
  color: #008080;
} /* Name.Constant */
.ni {
  color: #800080;
} /* Name.Entity */
.ne {
  color: #990000;
  font-weight: bold;
} /* Name.Exception */
.nf {
  color: #990000;
  font-weight: bold;
} /* Name.Function */
.nn {
  color: #555555;
} /* Name.Namespace */
.nt {
  color: #000080;
} /* Name.Tag */
.nv {
  color: #008080;
} /* Name.Variable */
.ow {
  font-weight: bold;
} /* Operator.Word */
.w {
  color: #bbbbbb;
} /* Text.Whitespace */
.mf {
  color: #009999;
} /* Literal.Number.Float */
.mh {
  color: #009999;
} /* Literal.Number.Hex */
.mi {
  color: #009999;
} /* Literal.Number.Integer */
.mo {
  color: #009999;
} /* Literal.Number.Oct */
.sb {
  color: #d14;
} /* Literal.String.Backtick */
.sc {
  color: #d14;
} /* Literal.String.Char */
.sd {
  color: #d14;
} /* Literal.String.Doc */
.s2 {
  color: #d14;
} /* Literal.String.Double */
.se {
  color: #d14;
} /* Literal.String.Escape */
.sh {
  color: #d14;
} /* Literal.String.Heredoc */
.si {
  color: #d14;
} /* Literal.String.Interpol */
.sx {
  color: #d14;
} /* Literal.String.Other */
.sr {
  color: #009926;
} /* Literal.String.Regex */
.s1 {
  color: #d14;
} /* Literal.String.Single */
.ss {
  color: #990073;
} /* Literal.String.Symbol */
.bp {
  color: #999999;
} /* Name.Builtin.Pseudo */
.vc {
  color: #008080;
} /* Name.Variable.Class */
.vg {
  color: #008080;
} /* Name.Variable.Global */
.vi {
  color: #008080;
} /* Name.Variable.Instance */
.il {
  color: #009999;
} /* Literal.Number.Integer.Long */
/*
 * Rouge in the dark. The light theme above is dark-on-light, so the deep
 * navies and reds turn illegible on a dark background; these lift them
 * without changing which token gets which hue.
 */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme=light]) .c, :root:not([data-theme=light]) .cm, :root:not([data-theme=light]) .c1 {
    color: #8b949e;
  }
  :root:not([data-theme=light]) {
    /* Comment */
  }
  :root:not([data-theme=light]) .cp, :root:not([data-theme=light]) .cs, :root:not([data-theme=light]) .bp, :root:not([data-theme=light]) .gh, :root:not([data-theme=light]) .gu {
    color: #8b949e;
  }
  :root:not([data-theme=light]) {
    /* Comment.Preproc etc */
  }
  :root:not([data-theme=light]) .err {
    color: #ffa198;
    background-color: #3a1d1d;
  }
  :root:not([data-theme=light]) {
    /* Error */
  }
  :root:not([data-theme=light]) .gd {
    color: #ffdcd7;
    background-color: #3a1d1d;
  }
  :root:not([data-theme=light]) {
    /* Generic.Deleted */
  }
  :root:not([data-theme=light]) .gi {
    color: #d3f5e0;
    background-color: #12261e;
  }
  :root:not([data-theme=light]) {
    /* Generic.Inserted */
  }
  :root:not([data-theme=light]) .gr, :root:not([data-theme=light]) .gt {
    color: #ffa198;
  }
  :root:not([data-theme=light]) {
    /* Generic.Error, Traceback */
  }
  :root:not([data-theme=light]) .go {
    color: #9ca3af;
  }
  :root:not([data-theme=light]) {
    /* Generic.Output */
  }
  :root:not([data-theme=light]) .gp, :root:not([data-theme=light]) .nn {
    color: #b0b6c0;
  }
  :root:not([data-theme=light]) {
    /* Generic.Prompt, Name.Namespace */
  }
  :root:not([data-theme=light]) .kt, :root:not([data-theme=light]) .nc, :root:not([data-theme=light]) .nt {
    color: #a5b4fc;
  }
  :root:not([data-theme=light]) {
    /* Keyword.Type, Name.Class, Name.Tag */
  }
  :root:not([data-theme=light]) .nb {
    color: #79c0ff;
  }
  :root:not([data-theme=light]) {
    /* Name.Builtin */
  }
  :root:not([data-theme=light]) .na, :root:not([data-theme=light]) .no, :root:not([data-theme=light]) .nv, :root:not([data-theme=light]) .vc, :root:not([data-theme=light]) .vg, :root:not([data-theme=light]) .vi {
    color: #7ee7c7;
  }
  :root:not([data-theme=light]) {
    /* Name.Attribute etc */
  }
  :root:not([data-theme=light]) .ne, :root:not([data-theme=light]) .nf {
    color: #ffa198;
  }
  :root:not([data-theme=light]) {
    /* Name.Exception, Name.Function */
  }
  :root:not([data-theme=light]) .ni {
    color: #d2a8ff;
  }
  :root:not([data-theme=light]) {
    /* Name.Entity */
  }
  :root:not([data-theme=light]) .m, :root:not([data-theme=light]) .mf, :root:not([data-theme=light]) .mh, :root:not([data-theme=light]) .mi, :root:not([data-theme=light]) .mo, :root:not([data-theme=light]) .il {
    color: #79c0ff;
  }
  :root:not([data-theme=light]) {
    /* Literal.Number */
  }
  :root:not([data-theme=light]) .s, :root:not([data-theme=light]) .sb, :root:not([data-theme=light]) .sc, :root:not([data-theme=light]) .sd, :root:not([data-theme=light]) .s2, :root:not([data-theme=light]) .se, :root:not([data-theme=light]) .sh, :root:not([data-theme=light]) .si, :root:not([data-theme=light]) .sx, :root:not([data-theme=light]) .s1 {
    color: #ff9492;
  }
  :root:not([data-theme=light]) {
    /* Strings */
  }
  :root:not([data-theme=light]) .sr {
    color: #7ee787;
  }
  :root:not([data-theme=light]) {
    /* Literal.String.Regex */
  }
  :root:not([data-theme=light]) .ss {
    color: #ff9bce;
  }
  :root:not([data-theme=light]) {
    /* Literal.String.Symbol */
  }
  :root:not([data-theme=light]) .w {
    color: #4a4f57;
  }
  :root:not([data-theme=light]) {
    /* Text.Whitespace */
  }
}
:root[data-theme=dark] .c, :root[data-theme=dark] .cm, :root[data-theme=dark] .c1 {
  color: #8b949e;
}
:root[data-theme=dark] {
  /* Comment */
}
:root[data-theme=dark] .cp, :root[data-theme=dark] .cs, :root[data-theme=dark] .bp, :root[data-theme=dark] .gh, :root[data-theme=dark] .gu {
  color: #8b949e;
}
:root[data-theme=dark] {
  /* Comment.Preproc etc */
}
:root[data-theme=dark] .err {
  color: #ffa198;
  background-color: #3a1d1d;
}
:root[data-theme=dark] {
  /* Error */
}
:root[data-theme=dark] .gd {
  color: #ffdcd7;
  background-color: #3a1d1d;
}
:root[data-theme=dark] {
  /* Generic.Deleted */
}
:root[data-theme=dark] .gi {
  color: #d3f5e0;
  background-color: #12261e;
}
:root[data-theme=dark] {
  /* Generic.Inserted */
}
:root[data-theme=dark] .gr, :root[data-theme=dark] .gt {
  color: #ffa198;
}
:root[data-theme=dark] {
  /* Generic.Error, Traceback */
}
:root[data-theme=dark] .go {
  color: #9ca3af;
}
:root[data-theme=dark] {
  /* Generic.Output */
}
:root[data-theme=dark] .gp, :root[data-theme=dark] .nn {
  color: #b0b6c0;
}
:root[data-theme=dark] {
  /* Generic.Prompt, Name.Namespace */
}
:root[data-theme=dark] .kt, :root[data-theme=dark] .nc, :root[data-theme=dark] .nt {
  color: #a5b4fc;
}
:root[data-theme=dark] {
  /* Keyword.Type, Name.Class, Name.Tag */
}
:root[data-theme=dark] .nb {
  color: #79c0ff;
}
:root[data-theme=dark] {
  /* Name.Builtin */
}
:root[data-theme=dark] .na, :root[data-theme=dark] .no, :root[data-theme=dark] .nv, :root[data-theme=dark] .vc, :root[data-theme=dark] .vg, :root[data-theme=dark] .vi {
  color: #7ee7c7;
}
:root[data-theme=dark] {
  /* Name.Attribute etc */
}
:root[data-theme=dark] .ne, :root[data-theme=dark] .nf {
  color: #ffa198;
}
:root[data-theme=dark] {
  /* Name.Exception, Name.Function */
}
:root[data-theme=dark] .ni {
  color: #d2a8ff;
}
:root[data-theme=dark] {
  /* Name.Entity */
}
:root[data-theme=dark] .m, :root[data-theme=dark] .mf, :root[data-theme=dark] .mh, :root[data-theme=dark] .mi, :root[data-theme=dark] .mo, :root[data-theme=dark] .il {
  color: #79c0ff;
}
:root[data-theme=dark] {
  /* Literal.Number */
}
:root[data-theme=dark] .s, :root[data-theme=dark] .sb, :root[data-theme=dark] .sc, :root[data-theme=dark] .sd, :root[data-theme=dark] .s2, :root[data-theme=dark] .se, :root[data-theme=dark] .sh, :root[data-theme=dark] .si, :root[data-theme=dark] .sx, :root[data-theme=dark] .s1 {
  color: #ff9492;
}
:root[data-theme=dark] {
  /* Strings */
}
:root[data-theme=dark] .sr {
  color: #7ee787;
}
:root[data-theme=dark] {
  /* Literal.String.Regex */
}
:root[data-theme=dark] .ss {
  color: #ff9bce;
}
:root[data-theme=dark] {
  /* Literal.String.Symbol */
}
:root[data-theme=dark] .w {
  color: #4a4f57;
}
:root[data-theme=dark] {
  /* Text.Whitespace */
}

/*# sourceMappingURL=style.css.map */