/* Self-hosted IBM Plex fonts and the shared eight-level typography scale. */
@font-face{
  font-family:"IBM Plex Sans";
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url("fonts/ibm-plex-sans-latin-400-700-v1.woff2") format("woff2");
}
@font-face{
  font-family:"IBM Plex Serif";
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("fonts/ibm-plex-serif-latin-400-v1.woff2") format("woff2");
}
@font-face{
  font-family:"IBM Plex Serif";
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url("fonts/ibm-plex-serif-latin-500-v1.woff2") format("woff2");
}
@font-face{
  font-family:"IBM Plex Serif";
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("fonts/ibm-plex-serif-latin-600-v1.woff2") format("woff2");
}
@font-face{
  font-family:"IBM Plex Mono";
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url("fonts/ibm-plex-mono-latin-500-v1.woff2") format("woff2");
}
@font-face{
  font-family:"IBM Plex Mono";
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("fonts/ibm-plex-mono-latin-600-v1.woff2") format("woff2");
}

:root{
  --bg:#ffffff;
  --mist:#f1f6f4;
  --mist-2:#e7f0ed;
  --teal:#216b46;
  --teal-d:#154d31;
  --ink:#13211d;
  --ink-2:#27332e;
  --slate:#566660;
  --slate-2:#7d8b85;
  --line:#dde7e3;
  --serif:"IBM Plex Serif",Georgia,serif;
  --sans:"IBM Plex Sans",system-ui,sans-serif;
  --mono:"IBM Plex Mono",monospace;
  --fs-xs:11px;
  --fs-sm:13px;
  --fs-ui:14.5px;
  --fs-body:16px;
  --fs-lead:18px;
  --fs-heading-sm:20px;
  --fs-heading-md:24px;
  --fs-heading-lg:clamp(30px,3.2vw,40px);
}

[data-theme="dark"]{
  --bg:#0e1614;
  --mist:#121f1b;
  --mist-2:#1b2a25;
  --teal:#5cba8b;
  --teal-d:#49a276;
  --ink:#eaf3f0;
  --ink-2:#d3e0db;
  --slate:#9fb0aa;
  --slate-2:#7e8d87;
  --line:#22302b;
}