:root {
  /* Fonts */
  --font-display: "Epilogue", "Epilogue-fallback", var(--font-ui);
  --font-ui:
    "Inter", "Inter-fallback", system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", Oxygen, Cantarell, sans-serif;
  --font-code:
    "JetBrains Mono", "JetBrains-fallback", "Consolas", "Monaco", "Andale Mono",
    "Ubuntu Mono", monospace;

  /* Text styles */
  --text-display-size: clamp(30px, 10vw, 75px);
  --text-display-height: 0.95;
  --text-display: 700 var(--text-display-size)/var(--text-display-height) var(
    --font-display
  );
  --text-display-spacing: -0.045em;
  --text-heading-size: clamp(20px, 8vw, 50px);
  --text-heading: 700 var(--text-heading-size)/1.1 var(--font-display);
  --text-heading-spacing: -0.03em;
  --text-title-size: clamp(20px, 6vw, 30px);
  --text-title: 600 var(--text-title-size)/1.2 var(--font-display);
  --text-title-spacing: -0.03em;
  --text-body-size: clamp(16px, 4vw, 20px);
  --text-body: var(--text-body-size)/1.65 var(--font-ui);
  --text-body-bold: 600 var(--text-body-size)/1.6 var(--font-ui);
  --text-body-spacing: -0.015em;
  --text-caption: 15px/1.6 var(--font-ui);
  --text-caption-bold: 600 15px/1.6 var(--font-ui);
  --text-caption-mini: 13px/1.6 var(--font-ui);
  --text-caption-mini-bold: 600 13px/1.6 var(--font-ui);
  --text-code: 16px/1.6 var(--font-code);

  /* Colors */
  /* Tokens */
  --color-orange-400: hsl(25deg, 50%, 40%);
  --color-orange-500: hsl(25deg, 50%, 50%);
  --color-orange-600: hsl(25deg, 70%, 60%);
  --color-white: hsl(280deg, 10%, 100%);
  --color-white-alpha: hsla(280deg, 10%, 100%, 0.9);
  --color-black-970: hsl(280deg, 10%, 97%);
  --color-black-930: hsl(280deg, 10%, 93%);
  --color-black-860: hsl(280deg, 10%, 86%);
  --color-black-800: hsl(280deg, 10%, 80%);
  --color-black-650: hsl(280deg, 10%, 65%);
  --color-black-350: hsl(280deg, 10%, 35%);
  --color-black-240: hsl(280deg, 10%, 24%);
  --color-black-180: hsl(280deg, 10%, 18%);
  --color-black-140: hsl(280deg, 10%, 14%);
  --color-black-100: hsl(280deg, 10%, 10%);
  --color-black-100-alpha: hsla(280deg, 10%, 10%, 0.9);
  --color-yellow-800: hsl(50deg, 80%, 80%);
  --color-yellow-750: hsl(50deg, 80%, 75%);
  --color-yellow-200: hsl(50deg, 80%, 20%);
  --color-brown-600: hsl(50deg, 10%, 60%);
  --color-brown-160: hsl(50deg, 10%, 16%);
  --color-brown-200: hsl(50deg, 10%, 20%);

  /* Borders */
  --border-radius-small: 5px;
  --border-radius: 10px;

  /* Animation */
  --animation-duration: 0.2s;

  /* Spaces */
  --margin: max(25px, 5vw);
  --max-width: 1200px;
  --column-gap-0: 10px;
  --column-gap-1: 25px;
  --column-gap-2: 50px;
  --column-gap-3: 100px;
  --row-gap-0: 25px;
  --row-gap-1: clamp(20px, 5vh, 50px);
  --row-gap-2: clamp(40px, 10vh, 100px);
  --row-gap-3: clamp(60px, 15vh, 150px);
  --row-gap-4: clamp(80px, 20vh, 200px);
}

:root.no-motion {
  --animation-duration: 0s;
}

@media (prefers-reduced-motion) {
  :root {
    --animation-duration: 0s;
  }
}

/* Theme light mode */

:root[data-theme="light"] {
  color-scheme: light;
  --color-primary: var(--color-orange-500);
  --color-primary-1: var(--color-orange-400);
  --color-foreground: var(--color-black-100);
  --color-foreground-1: var(--color-black-240);
  --color-background: var(--color-white);
  --color-background-a: var(--color-white-alpha);
  --color-background-1: var(--color-black-970);
  --color-background-2: var(--color-black-930);
  --color-background-3: var(--color-black-860);
}

/* Theme dark mode */

:root[data-theme="dark"] {
  color-scheme: dark;
  --color-primary: var(--color-orange-600);
  --color-primary-1: var(--color-orange-400);
  --color-foreground: var(--color-white);
  --color-foreground-1: var(--color-black-800);
  --color-background: var(--color-black-100);
  --color-background-a: var(--color-black-100-alpha);
  --color-background-1: var(--color-black-140);
  --color-background-2: var(--color-black-180);
  --color-background-3: var(--color-black-240);

}

html {
  scroll-padding-top: 120px;
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-ui);
  color: var(--color-foreground);
  background-color: var(--color-background);
  margin: 0;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  display: grid;
  min-height: 100vh;
  min-width: 320px;
  grid-template-rows: auto 1fr auto;
}

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

a:hover {
    text-decoration: none;
  }

pre, code {
  font: var(--text-code);
  letter-spacing: 0;
  margin: 0;
  font-variant-ligatures: none;
}

pre {
  overflow-x: auto;
}

:is(h2, h3, h4) code {
  font-size: 0.8em;
}

table {
  width: 100%;
}

th {
  text-align: left;
  padding: 5px 10px;
  background: var(--color-background-2);
  font: var(--text-caption-bold);
}

td {
  padding: 5px 10px;
  border-bottom: solid 1px var(--color-background-2);
}

td code {
    white-space: nowrap;
  }

:not(:defined) {
  visibility: hidden;
}

.button {
  background: var(--background, none);
  color: var(--color, currentColor);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border: 0;
  gap: 0.6em;
  min-height: 2em;
  padding: 0 0.6em;
  font: var(--text-caption-bold);
  border-radius: var(--border-radius-small);
  cursor: pointer;
  transition-property: background-color, color;
  transition-duration: var(--animation-duration);
  box-sizing: border-box;
  vertical-align: middle;
  flex: 0 0 auto;
  text-decoration: none;
}

.button::-moz-focus-inner {
    border: 0;
  }

.button.is-small {
    font: var(--text-caption-mini-bold);
    text-transform: uppercase;
  }

.button.is-big {
    height: 3em;
    padding: 0 1em;
  }

.button.is-codesandbox {
    --color: var(--color-white);
    --color-hover: var(--color-white);
    --background: var(--color-black-100);
    --background-hover: var(--color-black-240);
    border: solid 1px #fff2;
    display: flex;
    padding: 1em 0.6em;
  }

.button.is-codesandbox svg {
      fill: currentColor;
      width: 18px;
      height: 18px;
    }

.button.is-primary {
    --color: var(--color-background-1);
    --color-hover: var(--color-background-1);
    --background: var(--color-primary);
    --background-hover: var(--color-primary-1);
  }

.button.is-secondary {
    --color: var(--color-foreground-1);
    --color-hover: var(--color-foreground-1);
    --color-active: var(--color-background);
    --background: var(--color-background-1);
    --background-hover: var(--color-background-2);
    --background-active: var(--color-primary);
  }

.button.is-secondary.is-active {
      color: var(--color-active);
      background: var(--background-active);
    }

.button input {
    accent-color: var(--accent);
  }

.button:hover {
    color: var(--color-hover, currentColor);
    background: var(--background-hover, none);
  }

.button:disabled {
    cursor: default;
    background: none;
    opacity: 0.1;
  }

.button.has-icon {
    padding: 0;
    width: 40px;
    height: 40px;
  }

.button.has-icon svg {
      width: 30px;
      height: 30px;
      fill: currentColor;
    }

.button.has-icon path {
      fill: currentColor;
    }

.button-theme {
  background: none;
  color: currentColor;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border: solid 1px var(--color-background-3);
  padding: 0 0.6em;
  font: var(--text-callout);
  border-radius: var(--border-radius-small);
  cursor: pointer;
  vertical-align: middle;
}

.button-theme:hover {
    background: var(--color-background-2);
  }

[data-theme="light"] .button-theme .is-light,
[data-theme="dark"] .button-theme .is-dark {
  display: block;
}

[data-theme="light"] .button-theme .is-dark,
[data-theme="dark"] .button-theme .is-light {
  display: none;
}

.selector {
  display: block;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  box-sizing: border-box;
  height: 2em;
  border: solid 2px var(--color-background-2);
  background: none;
  color: var(--color-foreground-1);
  background-color: var(--color-background);
  /* Chevron gray-light */
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg width="44px" height="44px" viewBox="0 0 44 44" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M22,23.5857864 L27.2928932,18.2928932 C27.6834175,17.9023689 28.3165825,17.9023689 28.7071068,18.2928932 C29.0976311,18.6834175 29.0976311,19.3165825 28.7071068,19.7071068 L22.7071068,25.7071068 C22.3165825,26.0976311 21.6834175,26.0976311 21.2928932,25.7071068 L15.2928932,19.7071068 C14.9023689,19.3165825 14.9023689,18.6834175 15.2928932,18.2928932 C15.6834175,17.9023689 16.3165825,17.9023689 16.7071068,18.2928932 L22,23.5857864 Z" fill="%23BBC2CE"></path></svg>');
  background-repeat: no-repeat;
  background-position: right center;
  border-radius: var(--border-radius-small);
  font: var(--text-caption-bold);
  padding: 0 40px 0 1em;
  transition-property: background-color, color, box-shadow, border-color;
  transition-duration: var(--animation-duration);
  outline: 0;
  white-space: nowrap;
  text-decoration: none;
  cursor: initial;
  max-width: 100%;
}

.selector:hover {
    background-color: var(--color-background-1);
    border-color: var(--color-background-2);
  }

.tag {
  --color: var(--color-foreground-1);
  --background: var(--color-background-1);

  background: var(--background);
  color: var(--color);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border: 0;
  height: 2em;
  padding: 0 0.6em;
  font: var(--text-caption-mini-bold);
  letter-spacing: 0;
  border-radius: var(--border-radius-small);
  box-sizing: border-box;
  vertical-align: middle;
  flex: 0 0 auto;
  border: solid 1px var(--color-background-2);
}

.navbar-container {
  background-color: var(--color-background-a);
  position: sticky;
  top: 0;
  padding: 0 var(--margin);
  z-index: 10;
  border-bottom: solid 1px var(--color-background-2);
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
}

.navbar {
  max-width: var(--max-width);
  margin: auto;
  display: flex;
  justify-content: space-between;
  height: 90px;
  -moz-column-gap: var(--column-gap-1);
       column-gap: var(--column-gap-1);
}

.navbar-logo {
  display: flex;
  align-self: center;
  align-items: center;
  color: var(--color-foreground);
  -moz-column-gap: 10px;
       column-gap: 10px;
  text-decoration: none;
  font: var(--text-body-bold);
  letter-spacing: var(--text-title-spacing);
}

.navbar-logo svg {
    margin-bottom: 0px;
  }

@media (max-width: 820px) {

.navbar-logo span {
      display: none;
  }
    }

.navbar-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  font: var(--text-caption-bold);
  letter-spacing: var(--text-caption-spacing);
  overflow-x: auto;
  flex: 1 1 auto;
  width: 0;
  scrollbar-width: thin;
  scrollbar-color: var(--color-background-3) var(--color-background);
  will-change: scroll-position;
}

.navbar-menu li {
    display: flex;
  }

:is(.navbar-menu li):first-child {
      margin-left: auto;
    }

.navbar-menu a {
    color: var(--color-foreground);
    text-decoration: none;
    display: flex;
    align-items: center;
    padding: 0 1em;
    white-space: nowrap;
  }

:is(.navbar-menu a):hover {
      background-image: linear-gradient(
        var(--color-foreground),
        var(--color-foreground)
      );
      background-repeat: no-repeat;
      background-size: calc(100% - 2em) 1px;
      background-position: center bottom;
    }

.is-selected:is(.navbar-menu a) {
      color: var(--color-foreground-1);
      background: var(--color-background-1);
    }

.navbar-search {
  align-self: center;
  padding: 0;
  margin: 0;
  min-width: 173px;
  min-height: 36px;
}

@media (max-width: 768px) {
  .navbar-search {
    min-width: auto;
    min-height: auto;
  }

}

.footer-container {
  background: var(--color-background-1);
}

.footer {
  font: var(--text-caption);
  color: var(--color-foreground-1);
  max-width: var(--max-width);
  margin: auto;
  text-align: center;
  padding: 0 var(--margin);
}

.footer-copyright {
  margin: 0;
  padding: var(--row-gap-0) 0;
}

.footer-copyright a {
    color: currentColor;
  }

.footer-links {
  margin: 0;
  list-style: none;
  padding: 10px 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  border-bottom: solid 1px var(--color-background-3);
}

.footer-links svg {
    display: block;
    width: 20px;
    height: 20px;
    fill: currentColor;
  }

.footer-links a {
    text-decoration: none;
    font: var(--text-caption-bold);
    display: flex;
    align-items: center;
    -moz-column-gap: 10px;
         column-gap: 10px;
    padding: 10px;
    border-radius: var(--border-radius-small);
    color: currentColor;
    white-space: nowrap;
  }

:is(.footer-links a):hover {
      color: var(--color-foreground);
      background: var(--color-background-2);
    }

/*!
  GitHub theme for Highlight.js

  Based on the "github" and "github-dark" themes for Highlight.js
  - https://github.com/highlightjs/highlight.js/blob/main/src/styles/github.css
  - https://github.com/highlightjs/highlight.js/blob/main/src/styles/github-dark.css
  
  Modified by Lume authors & contributors
*/

:root[data-theme="light"] {
  --color-1: #d73a49;
  --color-2: #6f42c1;
  --color-3: #005cc5;
  --color-4: #032f62;
  --color-5: #e36209;
  --color-6: #6a737d;
  --color-7: #22863a;
  --color-8: #24292e;
  --color-9: #005cc5;
  --color-10: #735c0f;
  --color-11: #22863a;
  --color-12: #f0fff4;
  --color-13: #b31d28;
  --color-14: #ffeef0;
}

:root[data-theme="dark"] {
  --color-1: #ff7b72;
  --color-2: #d2a8ff;
  --color-3: #79c0ff;
  --color-4: #a5d6ff;
  --color-5: #ffa657;
  --color-6: #8b949e;
  --color-7: #7ee787;
  --color-8: #c9d1d9;
  --color-9: #5b97f1;
  --color-10: #f2cc60;
  --color-11: #aff5b4;
  --color-12: #033a16;
  --color-13: #ffdcd7;
  --color-14: #67060c;
}

.hljs {
  display: block;
  color: var(--color-black);
  background: var(--color-background-1);
  border-radius: var(--border-radius);
  border: solid 1px var(--color-background-2);
  overflow-x: auto;
  padding: 1em !important;
}

.hljs-doctag,
.hljs-keyword,
.hljs-meta .hljs-keyword,
.hljs-template-tag,
.hljs-template-variable,
.hljs-type,
.hljs-variable.language_ {
  color: var(--color-1);
}

.hljs-title,
.hljs-title.class_,
.hljs-title.class_.inherited__,
.hljs-title.function_ {
  color: var(--color-2);
}

.hljs-attr,
.hljs-attribute,
.hljs-literal,
.hljs-meta,
.hljs-number,
.hljs-operator,
.hljs-selector-attr,
.hljs-selector-class,
.hljs-selector-id,
.hljs-variable {
  color: var(--color-3);
}

.hljs-meta .hljs-string, .hljs-regexp, .hljs-string {
  color: var(--color-4);
}

.hljs-built_in, .hljs-symbol {
  color: var(--color-5);
}

.hljs-code, .hljs-comment, .hljs-formula {
  color: var(--color-6);
}

.hljs-name, .hljs-quote, .hljs-selector-pseudo, .hljs-selector-tag {
  color: var(--color-7);
}

.hljs-subst {
  color: var(--color-8);
}

.hljs-section {
  color: var(--color-9);
  font-weight: 600;
}

.hljs-bullet {
  color: var(--color-10);
}

.hljs-emphasis {
  color: var(--color-8);
  font-style: italic;
}

.hljs-strong {
  color: var(--color-8);
  font-weight: 600;
}

.hljs-addition {
  color: var(--color-11);
  background-color: var(--color-12);
}

.hljs-deletion {
  color: var(--color-13);
  background-color: var(--color-14);
}

lume-code {
  display: block;
}

lume-code .hljs {
    border-radius: 0 0 var(--border-radius) var(--border-radius) !important;
    border-top: 0 !important;
  }

lume-code .lume-code-menu {
    position: relative;
    display: flex;
    list-style: none;
    padding: 0 1em 0 88px;
    margin: 0;
    background: var(--color-background-2);
    border-radius: var(--border-radius) var(--border-radius) 0 0;
    overflow-x: auto;
    -moz-column-gap: 1px;
         column-gap: 1px;
  }

:is(lume-code .lume-code-menu) li {
      margin: 0;
      white-space: nowrap;
    }

lume-code .lume-code-menu::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 88px;
    height: 100%;
    background-image: url('data:image/svg+xml;charset=UTF-8,<svg width="54" height="14" viewBox="0 0 54 14" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="7" cy="7" r="7" fill="%23FF5533"/><circle cx="27" cy="7" r="7" fill="%23E6CF5C"/><circle cx="47" cy="7" r="7" fill="%237ACC52"/></svg>');
    background-repeat: no-repeat;
    background-position: 16px 14px;
  }

.lume-code-tab {
  --background: var(--color-background-2);
  --background-hover: var(--color-background-3);

  display: block;
  border: none;
  border-radius: 0;
  padding: 10px 1em;
  font: var(--text-caption);
  cursor: pointer;
  transition-property: background-color, color;
  transition-duration: var(--animation-duration);
  background: var(--color-background-2);
  color: var(--color-foreground-1);
}

.lume-code-tab:hover {
    background: var(--color-background-1);
    color: var(--color-foreground);
  }

.lume-code-tab.is-active {
    background: var(--color-background-1);
    color: var(--color-foreground);
    font: var(--text-caption-bold);
  }

.terminal {
  display: flex;
}

.terminal pre {
    width: -moz-fit-content;
    width: fit-content;
    background: var(--color-black-140);
    color: var(--color-black-860);
    padding: 15px 60px 15px 20px;
    border-radius: var(--border-radius-small) 0 0 var(--border-radius-small);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1);
    position: relative;
    overflow: hidden;
  }

:is(.terminal pre)::after {
      content: "";
      display: block;
      position: absolute;
      top: 0;
      right: 0;
      height: 100%;
      width: 100px;
      background: linear-gradient(
        to right,
        transparent,
        var(--color-black-140) 50%
      );
    }

:is(.terminal pre) code {
      scrollbar-width: none;
      display: block;
      overflow-x: auto;
    }

:is(.terminal pre)::-webkit-scrollbar {
      display: none;
    }

:is(.terminal pre):last-child {
      border-radius: var(--border-radius-small);
    }

.terminal-copy {
  display: block;
  position: absolute;
  right: 12px;
  top: 12px;
  z-index: 2;
}

.terminal-copy button {
    padding: 4px;
    border-radius: var(--border-radius-small);
    border: none;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1);
    background: var(--color-black-140);
    color: var(--color-black-860);
    cursor: pointer;
  }

:is(.terminal-copy button):hover {
      background: var(--color-black-240);
    }

.terminal-copy .tooltip {
    position: absolute;
    height: 32px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    top: 0;
    right: calc(100% + 0.5em);
    color: var(--color-black-140);
    background: var(--color-black-860);
    padding: 0.5em;
    border-radius: var(--border-radius-small);
    animation: showcopy 2s;
  }

.terminal-copy svg {
    display: block;
    fill: currentColor;
  }

.terminal-cta {
  border-radius: 0 var(--border-radius-small) var(--border-radius-small) 0;
  background: var(--color-primary);
  color: white;
  padding: 0 15px;
  font: var(--text-body-bold);
  letter-spacing: var(--text-body-spacing);
  text-decoration: none;
  display: flex;
  align-items: center;
  transition: background var(--animation-duration);
}

.terminal-cta svg,.terminal-cta path {
    fill: currentColor;
  }

.terminal-cta:hover {
    background: var(--color-primary-1);
  }

@keyframes showcopy {
  0% {
    opacity: 0;
    transform: translate(50%);
  }
  20%, 80% {
    opacity: 1;
    transform: translate(0);
  }
  100% {
    opacity: 0;
    transform: translate(-50%);
  }
}

.toc {
  font: var(--text-caption);
  color: var(--color-foreground-1);
  margin: 0;
}

.toc ol,.toc ul {
    padding-left: 1.5em;
  }

.toc a {
    color: currentColor;
  }

.site {
  margin: 0;
  padding: 0;
}

.site-image {
  display: block;
}

.site-image img {
    --shadow-color: rgba(0, 0, 0, 0.05);
    display: block;
    max-width: 100%;
    height: auto;
    transition: transform var(--animation-duration);
    transform-origin: center bottom;
    border-radius: var(--border-radius);
    box-shadow:
      0 1px 2px var(--shadow-color),
      0 1px 4px var(--shadow-color),
      0 1px 8px var(--shadow-color);
  }

.site-image:hover {
    z-index: 1;
  }

.site-image:hover img {
      transform: scale(1.1);
    }

.site-description {
  font: var(--text-caption);
  color: var(--color-foreground-1);
}

.site-description p {
    margin: 0.3em 0;
  }

.site-image + .site-description {
  margin-top: 1em;
}

.site-name {
  font: var(--text-caption-bold);
  color: var(--color-foreground);
  text-decoration: none;
}

.site-name:hover {
    text-decoration: underline;
  }

/* Theme light mode */

:root[data-theme="light"] .site-image img {
  --shadow-color: rgba(0, 0, 0, 0.05);
}

/* Theme dark mode */

:root[data-theme="dark"] .site-image img {
  --shadow-color: rgba(0, 0, 0, 0.3);
}

/* Pagefind UI */

.pagefind-ui__results-area {
  margin-top: 0px !important;
}

.pagefind-ui__drawer {
  /* General styles */
  -webkit-backdrop-filter: blur(5px);
          backdrop-filter: blur(5px);
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
  padding: 16px;
  z-index: 1000;
  max-width: 600px;
  width: 90%;

  /* Centering and placement */
  position: fixed; /* Ensures it's tied to the viewport, not a parent */
  top: calc(100% + 16px); /* Positioned below the search box */
  left: 50%;
  transform: translateX(-50%);

  /* Scrolling and overflow */
  max-height: 80vh; /* Prevents it from exceeding the viewport height */
  overflow-y: auto; /* Enables scrolling for overflowing content */
  background-color: var(--color-background-a); /* Semi-transparent background */
}

/* Light theme specific adjustments */

:root[data-theme="light"] .pagefind-ui__drawer {
  background-color: rgba(255, 255, 255, 0.9); /* 10% transparent white */
  color: var(--color-foreground); /* Ensure text color matches theme */
}

/* Dark theme specific adjustments */

:root[data-theme="dark"] .pagefind-ui__drawer {
  background-color: rgba(0, 0, 0, 0.9); /* 10% transparent black */
  color: var(--color-foreground); /* Ensure text color matches theme */
  
}

:root[data-theme="dark"] .pagefind-ui__result-link {
  color: var(--color-foreground-1) !important; /* Ensure text color matches theme */
  
}

.markdown-alert {
  --color: currentColor;

  margin-block: 1.5rem;
  padding: 0.5rem 1rem;
  border-left: solid 4px var(--color);
  font: var(--text-caption);
  background-color: color-mix(in srgb, var(--color), transparent 95%);
}

.markdown-alert pre,.markdown-alert code {
    font-size: 14px;
  }

.markdown-alert-title {
  color: var(--color);
  font: var(--text-caption-bold);
  display: flex;
  align-items: center;
  -moz-column-gap: 0.5em;
       column-gap: 0.5em;
}

.markdown-alert-title::before {
    content: "";
    display: block;
    width: 24px;
    height: 24px;
    background: var(--img) no-repeat center center;
  }

.markdown-alert-important {
  --color: hsl(300, 100%, 30%);
  --img: url('data:image/svg+xml;charset-UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="hsl(300, 100%, 30%)" viewBox="0 0 256 256"><path d="M128,72a8,8,0,0,1,8,8v56a8,8,0,0,1-16,0V80A8,8,0,0,1,128,72ZM116,172a12,12,0,1,0,12-12A12,12,0,0,0,116,172Zm124-44a15.85,15.85,0,0,1-4.67,11.28l-96.05,96.06a16,16,0,0,1-22.56,0h0l-96-96.06a16,16,0,0,1,0-22.56l96.05-96.06a16,16,0,0,1,22.56,0l96.05,96.06A15.85,15.85,0,0,1,240,128Zm-16,0L128,32,32,128,128,224h0Z"></path></svg>');
}

.markdown-alert-note {
  --color: hsl(210, 100%, 40%);
  --img: url('data:image/svg+xml;charset-UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="hsl(210, 100%, 40%)" viewBox="0 0 256 256"><path d="M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216Zm16-40a8,8,0,0,1-8,8,16,16,0,0,1-16-16V128a8,8,0,0,1,0-16,16,16,0,0,1,16,16v40A8,8,0,0,1,144,176ZM112,84a12,12,0,1,1,12,12A12,12,0,0,1,112,84Z"></path></svg>');
}

.markdown-alert-tip {
  --color: hsl(140, 100%, 25%);
  --img: url('data:image/svg+xml;charset-UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="hsl(140, 100%, 25%)" viewBox="0 0 256 256"><path d="M176,232a8,8,0,0,1-8,8H88a8,8,0,0,1,0-16h80A8,8,0,0,1,176,232Zm40-128a87.55,87.55,0,0,1-33.64,69.21A16.24,16.24,0,0,0,176,186v6a16,16,0,0,1-16,16H96a16,16,0,0,1-16-16v-6a16,16,0,0,0-6.23-12.66A87.59,87.59,0,0,1,40,104.49C39.74,56.83,78.26,17.14,125.88,16A88,88,0,0,1,216,104Zm-16,0a72,72,0,0,0-73.74-72c-39,.92-70.47,33.39-70.26,72.39a71.65,71.65,0,0,0,27.64,56.3A32,32,0,0,1,96,186v6h64v-6a32.15,32.15,0,0,1,12.47-25.35A71.65,71.65,0,0,0,200,104Zm-16.11-9.34a57.6,57.6,0,0,0-46.56-46.55,8,8,0,0,0-2.66,15.78c16.57,2.79,30.63,16.85,33.44,33.45A8,8,0,0,0,176,104a9,9,0,0,0,1.35-.11A8,8,0,0,0,183.89,94.66Z"></path></svg>');
}

.markdown-alert-warning {
  --color: hsl(50, 100%, 30%);
  --img: url('data:image/svg+xml;charset-UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="hsl(50, 100%, 30%)" viewBox="0 0 256 256"><path d="M236.8,188.09,149.35,36.22h0a24.76,24.76,0,0,0-42.7,0L19.2,188.09a23.51,23.51,0,0,0,0,23.72A24.35,24.35,0,0,0,40.55,224h174.9a24.35,24.35,0,0,0,21.33-12.19A23.51,23.51,0,0,0,236.8,188.09ZM222.93,203.8a8.5,8.5,0,0,1-7.48,4.2H40.55a8.5,8.5,0,0,1-7.48-4.2,7.59,7.59,0,0,1,0-7.72L120.52,44.21a8.75,8.75,0,0,1,15,0l87.45,151.87A7.59,7.59,0,0,1,222.93,203.8ZM120,144V104a8,8,0,0,1,16,0v40a8,8,0,0,1-16,0Zm20,36a12,12,0,1,1-12-12A12,12,0,0,1,140,180Z"></path></svg>');
}

.markdown-alert-caution {
  --color: hsl(0, 90%, 35%);
  --img: url('data:image/svg+xml;charset-UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="hsl(0, 90%, 35%)" viewBox="0 0 256 256"><path d="M120,136V80a8,8,0,0,1,16,0v56a8,8,0,0,1-16,0ZM232,91.55v72.9a15.86,15.86,0,0,1-4.69,11.31l-51.55,51.55A15.86,15.86,0,0,1,164.45,232H91.55a15.86,15.86,0,0,1-11.31-4.69L28.69,175.76A15.86,15.86,0,0,1,24,164.45V91.55a15.86,15.86,0,0,1,4.69-11.31L80.24,28.69A15.86,15.86,0,0,1,91.55,24h72.9a15.86,15.86,0,0,1,11.31,4.69l51.55,51.55A15.86,15.86,0,0,1,232,91.55Zm-16,0L164.45,40H91.55L40,91.55v72.9L91.55,216h72.9L216,164.45ZM128,160a12,12,0,1,0,12,12A12,12,0,0,0,128,160Z"></path></svg>');
}

[data-theme="dark"]:root .markdown-alert-important {
    --color: hsl(300, 60%, 60%);
    --img: url('data:image/svg+xml;charset-UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="hsl(300, 60%, 60%)" viewBox="0 0 256 256"><path d="M128,72a8,8,0,0,1,8,8v56a8,8,0,0,1-16,0V80A8,8,0,0,1,128,72ZM116,172a12,12,0,1,0,12-12A12,12,0,0,0,116,172Zm124-44a15.85,15.85,0,0,1-4.67,11.28l-96.05,96.06a16,16,0,0,1-22.56,0h0l-96-96.06a16,16,0,0,1,0-22.56l96.05-96.06a16,16,0,0,1,22.56,0l96.05,96.06A15.85,15.85,0,0,1,240,128Zm-16,0L128,32,32,128,128,224h0Z"></path></svg>');
  }

[data-theme="dark"]:root .markdown-alert-note {
    --color: hsl(210, 80%, 70%);
    --img: url('data:image/svg+xml;charset-UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="hsl(210, 80%, 70%)" viewBox="0 0 256 256"><path d="M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216Zm16-40a8,8,0,0,1-8,8,16,16,0,0,1-16-16V128a8,8,0,0,1,0-16,16,16,0,0,1,16,16v40A8,8,0,0,1,144,176ZM112,84a12,12,0,1,1,12,12A12,12,0,0,1,112,84Z"></path></svg>');
  }

[data-theme="dark"]:root .markdown-alert-tip {
    --color: hsl(140, 70%, 60%);
    --img: url('data:image/svg+xml;charset-UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="hsl(140, 70%, 60%)" viewBox="0 0 256 256"><path d="M176,232a8,8,0,0,1-8,8H88a8,8,0,0,1,0-16h80A8,8,0,0,1,176,232Zm40-128a87.55,87.55,0,0,1-33.64,69.21A16.24,16.24,0,0,0,176,186v6a16,16,0,0,1-16,16H96a16,16,0,0,1-16-16v-6a16,16,0,0,0-6.23-12.66A87.59,87.59,0,0,1,40,104.49C39.74,56.83,78.26,17.14,125.88,16A88,88,0,0,1,216,104Zm-16,0a72,72,0,0,0-73.74-72c-39,.92-70.47,33.39-70.26,72.39a71.65,71.65,0,0,0,27.64,56.3A32,32,0,0,1,96,186v6h64v-6a32.15,32.15,0,0,1,12.47-25.35A71.65,71.65,0,0,0,200,104Zm-16.11-9.34a57.6,57.6,0,0,0-46.56-46.55,8,8,0,0,0-2.66,15.78c16.57,2.79,30.63,16.85,33.44,33.45A8,8,0,0,0,176,104a9,9,0,0,0,1.35-.11A8,8,0,0,0,183.89,94.66Z"></path></svg>');
  }

[data-theme="dark"]:root .markdown-alert-warning {
    --color: hsl(50, 80%, 50%);
    --img: url('data:image/svg+xml;charset-UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="hsl(50, 80%, 50%)" viewBox="0 0 256 256"><path d="M236.8,188.09,149.35,36.22h0a24.76,24.76,0,0,0-42.7,0L19.2,188.09a23.51,23.51,0,0,0,0,23.72A24.35,24.35,0,0,0,40.55,224h174.9a24.35,24.35,0,0,0,21.33-12.19A23.51,23.51,0,0,0,236.8,188.09ZM222.93,203.8a8.5,8.5,0,0,1-7.48,4.2H40.55a8.5,8.5,0,0,1-7.48-4.2,7.59,7.59,0,0,1,0-7.72L120.52,44.21a8.75,8.75,0,0,1,15,0l87.45,151.87A7.59,7.59,0,0,1,222.93,203.8ZM120,144V104a8,8,0,0,1,16,0v40a8,8,0,0,1-16,0Zm20,36a12,12,0,1,1-12-12A12,12,0,0,1,140,180Z"></path></svg>');
  }

[data-theme="dark"]:root .markdown-alert-caution {
    --color: hsl(0, 100%, 70%);
    --img: url('data:image/svg+xml;charset-UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="hsl(0, 100%, 70%)" viewBox="0 0 256 256"><path d="M120,136V80a8,8,0,0,1,16,0v56a8,8,0,0,1-16,0ZM232,91.55v72.9a15.86,15.86,0,0,1-4.69,11.31l-51.55,51.55A15.86,15.86,0,0,1,164.45,232H91.55a15.86,15.86,0,0,1-11.31-4.69L28.69,175.76A15.86,15.86,0,0,1,24,164.45V91.55a15.86,15.86,0,0,1,4.69-11.31L80.24,28.69A15.86,15.86,0,0,1,91.55,24h72.9a15.86,15.86,0,0,1,11.31,4.69l51.55,51.55A15.86,15.86,0,0,1,232,91.55Zm-16,0L164.45,40H91.55L40,91.55v72.9L91.55,216h72.9L216,164.45ZM128,160a12,12,0,1,0,12,12A12,12,0,0,0,128,160Z"></path></svg>');
  }

.type {
  padding: 1em;
  background: var(--color-background-1);
  border: solid 1px var(--color-background-2);
  border-radius: var(--border-radius-small);
}

.type  > div {
    padding-left: 16px;
  }

.type  > div + div {
    border-top: solid 1px var(--color-background-2);
    padding-top: 0.75em;
    margin-top: 0.75em;
  }

.type .type-name {
    font: var(--text-caption-bold);
    color: var(--color-foreground);
    position: relative;
  }

:is(.type .type-name)::before {
      content: "";
      display: block;
      width: 10px;
      height: 10px;
      background-color: var(--color-primary);
      position: absolute;
      bottom: 6px;
      left: -18px;
      border-radius: 50%;
    }

:is(.type .type-name) strong {
      display: inline-block;
      margin-right: 0.5em;
    }

:is(.type .type-name) em {
      font: var(--text-caption-mini);
      color: var(--color-foreground-1);
      background: var(--color-background-3);
      display: inline-block;
      padding: 0 0.5em;
      border-radius: var(--border-radius-small);
    }

.type .type-details {
    font: var(--text-caption);
    margin-left: 0;
  }

:is(.type .type-details) p {
      margin: 0;
      font: var(--text-caption);
      color: var(--color-foreground-1);
    }

:is(.type .type-details) pre {
      display: inline-block;
      vertical-align: top;
      font-size: inherit;
      max-width: 100%;
      max-height: 200px;
    }

:is(.type .type-details) code {
      font-size: inherit;
      margin: 0;
      padding: 0 0.3em !important;
      background: var(--color-background);
    }

.type .type {
    padding-left: 1.5em;
    padding-right: 0;
    border: none;
  }

.device {
  position: relative;
  overflow: hidden;
  box-shadow: 0 10px 25px -10px #0003;
  border-radius: var(--border-radius);
  border: solid 1px var(--color-background-2);
}

.device img {
    max-width: 100%;
    display: block;
  }

.device[data-device="desktop"] img {
      margin-top: 40px;
    }

.device[data-device="desktop"]::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 88px;
      height: 100%;
      background-image: url('data:image/svg+xml;charset=UTF-8,<svg width="54" height="14" viewBox="0 0 54 14" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="7" cy="7" r="7" fill="%23FF5533"/><circle cx="27" cy="7" r="7" fill="%23E6CF5C"/><circle cx="47" cy="7" r="7" fill="%237ACC52"/></svg>');
      background-repeat: no-repeat;
      background-position: 16px 14px;
    }

.device[data-device="desktop"]::after {
      content: "";
      position: absolute;
      top: 10px;
      left: 100px;
      right: 10px;
      height: 20px;
      background-color: var(--color-background-2);
      border-radius: var(--border-radius-small);
    }

.device[data-device="mobile"] {
    max-width: 320px;
  }

lume-shield {
  --color: var(--color-primary);
  display: inline-block;
  font: var(--text-caption-mini);
  border-radius: var(--border-radius-small);
  overflow: hidden;
  margin-right: 0.25em;
}

lume-shield span {
    padding: 0.25em 1em 0.25em 0.5em;
    background-color: var(--color);
  }

lume-shield a {
    text-decoration: none;
    display: inline-flex;
    align-items: baseline;
    -moz-column-gap: 0.5em;
         column-gap: 0.5em;
    background-color: var(--color-black-180);
    color: var(--color-white);
    padding-left: 1em;
  }

:is(lume-shield a):hover {
      background-color: var(--color-black-140);
    }

:is(lume-shield a):hover span {
        background-color: color-mix(in srgb, var(--color), black 10%);
      }

@font-face {
  font-family: 'Epilogue';
  font-style: italic;
  font-weight: 100 900;
  src: url('../fonts/epilogue-italic-100_900-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'Epilogue';
  font-style: italic;
  font-weight: 100 900;
  src: url('../fonts/epilogue-italic-100_900-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Epilogue';
  font-style: italic;
  font-weight: 100 900;
  src: url('../fonts/epilogue-italic-100_900-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Epilogue';
  font-style: normal;
  font-weight: 100 900;
  src: url('../fonts/epilogue-normal-100_900-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'Epilogue';
  font-style: normal;
  font-weight: 100 900;
  src: url('../fonts/epilogue-normal-100_900-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Epilogue';
  font-style: normal;
  font-weight: 100 900;
  src: url('../fonts/epilogue-normal-100_900-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100 900;
  src: url('../fonts/inter-italic-100_900-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100 900;
  src: url('../fonts/inter-italic-100_900-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100 900;
  src: url('../fonts/inter-italic-100_900-greek-ext.woff2') format('woff2');
  unicode-range: U+1F00-1FFF;
}

@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100 900;
  src: url('../fonts/inter-italic-100_900-greek.woff2') format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100 900;
  src: url('../fonts/inter-italic-100_900-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100 900;
  src: url('../fonts/inter-italic-100_900-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100 900;
  src: url('../fonts/inter-italic-100_900-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  src: url('../fonts/inter-normal-100_900-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  src: url('../fonts/inter-normal-100_900-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  src: url('../fonts/inter-normal-100_900-greek-ext.woff2') format('woff2');
  unicode-range: U+1F00-1FFF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  src: url('../fonts/inter-normal-100_900-greek.woff2') format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  src: url('../fonts/inter-normal-100_900-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  src: url('../fonts/inter-normal-100_900-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  src: url('../fonts/inter-normal-100_900-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: italic;
  font-weight: 100 800;
  src: url('../fonts/jetbrains_mono-italic-100_800-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: italic;
  font-weight: 100 800;
  src: url('../fonts/jetbrains_mono-italic-100_800-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: italic;
  font-weight: 100 800;
  src: url('../fonts/jetbrains_mono-italic-100_800-greek.woff2') format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: italic;
  font-weight: 100 800;
  src: url('../fonts/jetbrains_mono-italic-100_800-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: italic;
  font-weight: 100 800;
  src: url('../fonts/jetbrains_mono-italic-100_800-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: italic;
  font-weight: 100 800;
  src: url('../fonts/jetbrains_mono-italic-100_800-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 100 800;
  src: url('../fonts/jetbrains_mono-normal-100_800-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 100 800;
  src: url('../fonts/jetbrains_mono-normal-100_800-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 100 800;
  src: url('../fonts/jetbrains_mono-normal-100_800-greek.woff2') format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 100 800;
  src: url('../fonts/jetbrains_mono-normal-100_800-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 100 800;
  src: url('../fonts/jetbrains_mono-normal-100_800-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 100 800;
  src: url('../fonts/jetbrains_mono-normal-100_800-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}