:root {
  color-scheme: light;
  --page-bg: #ffffff;
  --text: #24292e;
  --muted: #6a737d;
  --link: #0366d6;
  --border: #eaecef;
  --quote-border: #dfe2e5;
  --inline-code-bg: rgba(27, 31, 35, 0.05);
  --code-bg: #f6f8fa;
  --table-alt-bg: #f6f8fa;
  --button-shadow: rgba(27, 31, 35, 0.12);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --page-bg: #0d1117;
  --text: #c9d1d9;
  --muted: #8b949e;
  --link: #58a6ff;
  --border: #30363d;
  --quote-border: #3b434b;
  --inline-code-bg: rgba(110, 118, 129, 0.25);
  --code-bg: #161b22;
  --table-alt-bg: #161b22;
  --button-shadow: rgba(1, 4, 9, 0.35);
}

body {
  color: var(--text);
  background: var(--page-bg);
  transition: background-color 180ms ease, color 180ms ease;
}

.markdown-body {
  color: var(--text);
}

.markdown-body a {
  color: var(--link);
}

.markdown-body h1,
.markdown-body h2 {
  border-bottom-color: var(--border);
}

.markdown-body h1 .octicon-link,
.markdown-body h2 .octicon-link,
.markdown-body h3 .octicon-link,
.markdown-body h4 .octicon-link,
.markdown-body h5 .octicon-link,
.markdown-body h6 .octicon-link {
  color: var(--text);
}

.markdown-body h6,
.markdown-body blockquote {
  color: var(--muted);
}

.markdown-body blockquote {
  border-left-color: var(--quote-border);
}

.markdown-body hr {
  background-color: var(--border);
}

.markdown-body code,
.markdown-body tt {
  background-color: var(--inline-code-bg);
}

.markdown-body pre,
.markdown-body .highlight pre {
  background-color: var(--code-bg);
}

.markdown-body table th,
.markdown-body table td {
  border-color: var(--border);
}

.markdown-body table tr {
  background-color: var(--page-bg);
  border-top-color: var(--border);
}

.markdown-body table tr:nth-child(2n) {
  background-color: var(--table-alt-bg);
}

.markdown-body img {
  background-color: var(--page-bg);
}

html[data-theme="dark"] .highlight {
  background-color: var(--code-bg);
}

html[data-theme="dark"] .highlight,
html[data-theme="dark"] .highlight .w {
  color: var(--text);
}

html[data-theme="dark"] .highlight .c,
html[data-theme="dark"] .highlight .cd,
html[data-theme="dark"] .highlight .cm,
html[data-theme="dark"] .highlight .c1,
html[data-theme="dark"] .highlight .cs,
html[data-theme="dark"] .highlight .cp,
html[data-theme="dark"] .highlight .gh,
html[data-theme="dark"] .highlight .go {
  color: #8b949e;
}

html[data-theme="dark"] .highlight .k,
html[data-theme="dark"] .highlight .kv,
html[data-theme="dark"] .highlight .kc,
html[data-theme="dark"] .highlight .kd,
html[data-theme="dark"] .highlight .kn,
html[data-theme="dark"] .highlight .kp,
html[data-theme="dark"] .highlight .kr,
html[data-theme="dark"] .highlight .o,
html[data-theme="dark"] .highlight .ow {
  color: #ff7b72;
}

html[data-theme="dark"] .highlight .s,
html[data-theme="dark"] .highlight .sb,
html[data-theme="dark"] .highlight .sc,
html[data-theme="dark"] .highlight .sd,
html[data-theme="dark"] .highlight .s1,
html[data-theme="dark"] .highlight .s2,
html[data-theme="dark"] .highlight .se,
html[data-theme="dark"] .highlight .sh,
html[data-theme="dark"] .highlight .si,
html[data-theme="dark"] .highlight .sx {
  color: #a5d6ff;
}

html[data-theme="dark"] .highlight .m,
html[data-theme="dark"] .highlight .mb,
html[data-theme="dark"] .highlight .mf,
html[data-theme="dark"] .highlight .mh,
html[data-theme="dark"] .highlight .mi,
html[data-theme="dark"] .highlight .il,
html[data-theme="dark"] .highlight .mo,
html[data-theme="dark"] .highlight .mx {
  color: #79c0ff;
}

html[data-theme="dark"] .highlight .na,
html[data-theme="dark"] .highlight .nb,
html[data-theme="dark"] .highlight .nc,
html[data-theme="dark"] .highlight .nf,
html[data-theme="dark"] .highlight .nl,
html[data-theme="dark"] .highlight .nn,
html[data-theme="dark"] .highlight .no,
html[data-theme="dark"] .highlight .nt,
html[data-theme="dark"] .highlight .nv,
html[data-theme="dark"] .highlight .vc,
html[data-theme="dark"] .highlight .vg,
html[data-theme="dark"] .highlight .vi {
  color: #d2a8ff;
}

html[data-theme="dark"] .highlight .kt,
html[data-theme="dark"] .highlight .nd,
html[data-theme="dark"] .highlight .ne {
  color: #ffa657;
}

html[data-theme="dark"] .highlight .gd,
html[data-theme="dark"] .highlight .err {
  color: #ffdcd7;
  background-color: #67060c;
}

html[data-theme="dark"] .highlight .gi {
  color: #aff5b4;
  background-color: #033a16;
}

.theme-toggle {
  position: fixed;
  top: 16px;
  right: 16px;
  z-index: 20;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  color: var(--text);
  background: var(--page-bg);
  border: 1px solid var(--border);
  border-radius: 999px;
  box-shadow: 0 6px 18px var(--button-shadow);
}

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

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

.theme-toggle-icon {
  display: block;
  font-size: 18px;
  line-height: 1;
}

@media (max-width: 544px) {
  .theme-toggle {
    top: 12px;
    right: 12px;
  }
}
