:root {
  --udewy-accent: #2aa8c9;
}

.udewy-light {
  --bg: #eef7fa;
  --fg: #16323a;
  --sidebar-bg: #ffffff;
  --sidebar-fg: #2f4d56;
  --sidebar-non-existant: #5b737b;
  --sidebar-active: #157a94;
  --sidebar-spacer: #d4e6ec;
  --scrollbar: #6a838c;
  --icons: #5b737b;
  --icons-hover: #16323a;
  --links: #157a94;
  --link-hover: #2aa8c9;
  --inline-code-color: #157a94;
  --theme-popup-bg: #ffffff;
  --theme-popup-border: #b7d4de;
  --theme-hover: #e4f3f7;
  --quote-bg: #e4f3f7;
  --quote-border: #b7d4de;
  --warning-border: #b9504e;
  --table-border-color: #d4e6ec;
  --table-header-bg: #cceaf2;
  --table-alternate-bg: #f5fbfd;
  --searchbar-border-color: #b7d4de;
  --searchbar-bg: #ffffff;
  --searchbar-fg: #16323a;
  --searchbar-shadow-color: #d4e6ec;
  --searchresults-header-fg: #5b737b;
  --searchresults-border-color: #b7d4de;
  --searchresults-li-bg: #e4f3f7;
  --search-mark-bg: #cceaf2;
  --color-scheme: light;
  --footnote-highlight: #2aa8c9;
  --overlay-bg: rgba(22, 50, 58, 0.12);
  --copy-button-filter: invert(36%) sepia(18%) saturate(514%) hue-rotate(157deg) brightness(90%) contrast(86%);
  --copy-button-filter-hover: invert(27%) sepia(42%) saturate(646%) hue-rotate(162deg) brightness(92%) contrast(92%);
  --udewy-accent: #2aa8c9;
}

.udewy-dark {
  --bg: #0c1c22;
  --fg: #e6f3f6;
  --sidebar-bg: #143039;
  --sidebar-fg: #c5d8de;
  --sidebar-non-existant: #8ea4ab;
  --sidebar-active: #7ee0f0;
  --sidebar-spacer: #27454e;
  --scrollbar: #6e858c;
  --icons: #8ea4ab;
  --icons-hover: #e6f3f6;
  --links: #8ee6f4;
  --link-hover: #7ee0f0;
  --inline-code-color: #8ee6f4;
  --theme-popup-bg: #143039;
  --theme-popup-border: #3a5b66;
  --theme-hover: #1a3d47;
  --quote-bg: #12323a;
  --quote-border: #3a5b66;
  --warning-border: #b9504e;
  --table-border-color: #27454e;
  --table-header-bg: #1a3d47;
  --table-alternate-bg: #102830;
  --searchbar-border-color: #3a5b66;
  --searchbar-bg: #12323a;
  --searchbar-fg: #e6f3f6;
  --searchbar-shadow-color: #0c1c22;
  --searchresults-header-fg: #8ea4ab;
  --searchresults-border-color: #3a5b66;
  --searchresults-li-bg: #1a3d47;
  --search-mark-bg: #2a6270;
  --color-scheme: dark;
  --footnote-highlight: #7ee0f0;
  --overlay-bg: rgba(4, 12, 16, 0.5);
  --copy-button-filter: invert(78%) sepia(12%) saturate(489%) hue-rotate(157deg) brightness(96%) contrast(88%);
  --copy-button-filter-hover: invert(84%) sepia(22%) saturate(548%) hue-rotate(152deg) brightness(103%) contrast(92%);
  --udewy-accent: #7ee0f0;
}

.udewy-toolbar-link {
  position: relative;
  z-index: 10;
  display: inline-flex;
  align-items: center;
  height: var(--menu-bar-height);
  padding: 0 10px;
  color: var(--icons) !important;
  font-family: system-ui, sans-serif;
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0.01em;
  line-height: 1;
  text-decoration: none;
  transition: color 0.2s ease;
}

.udewy-toolbar-link:hover,
.udewy-toolbar-link:focus-visible {
  color: var(--icons-hover) !important;
}

.udewy-home-link {
  margin-left: 5px;
  padding-left: 14px;
  border-left: 1px solid var(--table-border-color);
}

.udewy-peer-link {
  margin-right: 7px;
  padding-right: 14px;
  border-right: 1px solid var(--table-border-color);
}

code {
  font-variant-ligatures: none;
}
.u-declaration, .u-meta, .u-numeric_prefix { color: #8ec8ff; }
.u-keyword { color: #d4a8e8; }
.u-function { color: #f0c978; }
.u-type { color: #7ee0c0; }
.u-string { color: #7ee0f0; }
.u-number { color: #c4b4ee; }
.u-comment { color: #7e969e; font-style: italic; }
.u-punctuation { color: #9bb8c0; }
.u-brace { color: #f0c978; }
.u-identifier { color: #d5e6eb; }
.u-operator { color: #c5d4d8; }

.udewy-light pre > code.hljs {
  background: #12262c;
  color: #d5e6eb;
}

.udewy-light :not(pre) > .hljs {
  background: #cceaf2;
}

.udewy-dark pre > code.hljs {
  background: #071216;
  color: #d5e8ed;
}

.udewy-dark :not(pre) > .hljs {
  background: #1a3d47;
}

.udewy-light .content a,
.udewy-dark .content a {
  text-decoration: underline;
  text-decoration-thickness: 0.07em;
  text-underline-offset: 0.18em;
}

.udewy-light .content a:hover,
.udewy-light .content a:visited:hover,
.udewy-dark .content a:hover,
.udewy-dark .content a:visited:hover {
  color: var(--link-hover);
}

.udewy-light .content a:hover > .hljs,
.udewy-dark .content a:hover > .hljs {
  color: var(--link-hover);
}

.udewy-light .content a.header,
.udewy-dark .content a.header {
  color: var(--fg);
  text-decoration: none;
}

blockquote:first-of-type {
  border-radius: 0.25rem;
}

@media (max-width: 620px) {
  .udewy-peer-link { display: none; }
}