@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/inter-400.woff2") format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/inter-500.woff2") format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/inter-600.woff2") format("woff2");
}
@font-face {
  font-family: "Barlow Condensed";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/barlow-condensed-500.woff2") format("woff2");
}
@font-face {
  font-family: "Barlow Condensed";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/barlow-condensed-600.woff2") format("woff2");
}
@font-face {
  font-family: "Barlow Condensed";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/barlow-condensed-700.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/plex-mono-400.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/plex-mono-500.woff2") format("woff2");
}

:root {
  --lime: #acf303;
  --charcoal: #26282c;
  --charcoal-2: #33363b;
  --graphite: #5d5e62;
  --ink: #1d1f22;
  --muted: #5f6368;
  --line: #e3e4e6;
  --paper: #f3f4f2;
  --amber: #ffb020;
  --excellent: #1a9850;
  --good: #66bd63;
  --fair: #f2c94c;
  --poor: #ffb020;
  --bad: #e5484d;
  --stale: #8d9095;
  --sans: Inter, "Segoe UI", sans-serif;
  --display: "Barlow Condensed", Inter, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, monospace;
  --rail: 232px;
  --top: 56px;
  color-scheme: light;
}

* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.4;
}
button, input, select { font: inherit; color: inherit; }
button { cursor: pointer; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.mono { font-family: var(--mono); font-size: 12px; }
.muted { color: var(--muted); }