@font-face {
  font-family: "Lato";
  src: url("../fonts/LatoLatin-Light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("../fonts/LatoLatin-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("../fonts/LatoLatin-Italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("../fonts/LatoLatin-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("../fonts/LatoLatin-Semibold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("../fonts/LatoLatin-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --sd-orange: #ff8128;
  --sd-orange-hover: #f27318;
  --sd-orange-active: #e5680f;
  --sd-orange-ink: #b45309;
  --sd-orange-tint: #fff1e2;
  --sd-orange-line: #fbd9bb;
  --sd-on-orange: #1f2229;

  --sd-slate: #2b2e39;
  --sd-ink: #23262e;
  --sd-text: #3a3d45;
  --sd-muted: #646b78;

  --sd-bg: #f5f6f8;
  --sd-surface: #ffffff;
  --sd-surface-hover: #f6f7f9;
  --sd-surface-sunken: #f1f2f5;
  --sd-self-surface: #fff7ef;
  --sd-line: #e6e8ec;
  --sd-line-soft: #eef0f3;
  --sd-line-strong: #d5d9e0;
  --sd-field-border: #8d939e;
  --sd-track: #eceef2;
  --sd-done: #aab0ba;

  --sd-success-ink: #17663d;
  --sd-success-bg: #e7f4ec;
  --sd-success-line: #c4e5d1;
  --sd-warning-ink: #8a5a00;
  --sd-warning-bg: #fdf3d8;
  --sd-danger-ink: #b42318;
  --sd-danger-bg: #fdecea;
  --sd-danger-line: #f5c4be;
  --sd-danger-fill: #d4442e;
  --sd-neutral-bg: #eef0f3;

  --sd-font: "Lato", "Helvetica Neue", Arial, sans-serif;
  --sd-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --sd-fs-xs: 13px;
  --sd-fs-label: 13.5px;
  --sd-fs-sm: 14px;
  --sd-fs-meta: 15px;
  --sd-fs-base: 16px;
  --sd-fs-md: 17px;
  --sd-fs-lg: 19px;
  --sd-fs-2xl: 32px;
  --sd-fs-kpi: 36px;

  --sd-space-1: 4px;
  --sd-space-2: 8px;
  --sd-space-3: 12px;
  --sd-space-4: 16px;
  --sd-space-5: 20px;
  --sd-space-6: 24px;
  --sd-space-7: 28px;
  --sd-space-8: 32px;
  --sd-space-10: 40px;
  --sd-space-16: 64px;

  --sd-radius-xs: 4px;
  --sd-radius-sm: 6px;
  --sd-radius-md: 8px;
  --sd-radius-lg: 12px;
  --sd-radius-xl: 16px;
  --sd-radius-control: 6px;
  --sd-radius-pill: 999px;

  --sd-shadow-float: 0 12px 32px rgba(23, 26, 33, 0.10);

  --sd-container: 1248px;
  --sd-narrow: 720px;
  --sd-gutter: 32px;
  --sd-header-h: 84px;
  --sd-row-x: 24px;
  --sd-focus: #b45309;
}