:root {
  --gray-10: #fafafa;
  --gray-09: #eeeeee;
  --gray-08: #e2e2e3;
  --gray-07: #d4d4d5;
  --gray-06: #a3a4a5;
  --gray-05: #8a8b8c;
  --gray-04: #717273;
  --gray-03: #636565;
  --gray-02: #2e3031;
  --gray-01: #17191a;
  --green-10: #f4fbfb;
  --green-09: #d9f3f2;
  --green-08: #c1ebea;
  --green-07: #9fe0dd;
  --green-06: #1eb7b0;
  --green-05: #009c94;
  --green-04: #00807a;
  --green-03: #00716c;
  --green-02: #003734;
  --green-01: #001d1b;
  --blue-10: #f7fafc;
  --blue-09: #e5f0f4;
  --blue-08: #d3e6ed;
  --blue-07: #bed9e5;
  --blue-06: #70acc6;
  --blue-05: #4694b5;
  --blue-04: #1a7aa3;
  --blue-03: #006b99;
  --blue-02: #00344a;
  --blue-01: #001b27;
  --red-10: #fff9f6;
  --red-09: #feeae0;
  --red-08: #fddccb;
  --red-07: #fdcab1;
  --red-06: #f9844a;
  --red-05: #f75201;
  --red-04: #cc4300;
  --red-03: #b43b00;
  --red-02: #581d00;
  --red-01: #2f0f00;
  --purple-10: #faf9fd;
  --purple-09: #eeecf9;
  --purple-08: #e4e0f4;
  --purple-07: #d8d0ef;
  --purple-06: #ae9adb;
  --purple-05: #9b7bcf;
  --purple-04: #8661b4;
  --purple-03: #78549e;
  --purple-02: #3a284b;
  --purple-01: #1e1526;
  --slate-10: #f9fafb;
  --slate-09: #ebeef0;
  --slate-08: #dee3e7;
  --slate-07: #ced5db;
  --slate-06: #96a7b2;
  --slate-05: #788e9d;
  --slate-04: #5b7588;
  --slate-03: #4f6879;
  --slate-02: #26313a;
  --slate-01: #13191e;
  --yellow-10: #fef9ef;
  --yellow-09: #feeccb;
  --yellow-08: #fedfa7;
  --yellow-07: #fecd79;
  --yellow-06: #e69110;
  --yellow-05: #c47a0e;
  --yellow-04: #a3640b;
  --yellow-03: #90570a;
  --yellow-02: #462a03;
  --yellow-01: #241602;
  --border-radius-s: 2px;
  --border-radius: 4px;
  --border-radius-pill: 999px;
  --color-background-input: #f9fafb;
  --color-background-feedback-neutral: #e2e2e3;
  --color-background-feedback-neutral-weak: #ebeef0;
  --color-background-feedback-negative: #fddccb;
  --color-background-feedback-negative-weak: #feeae0;
  --color-background-feedback-highlight: #e4e0f4;
  --color-background-feedback-highlight-weak: #eeecf9;
  --color-background-feedback-positive: #c1ebea;
  --color-background-feedback-positive-weak: #d9f3f2;
  --color-background-feedback-info: #d3e6ed;
  --color-background-feedback-info-weak: #e5f0f4;
  --color-background-feedback-warning: #fedfa7;
  --color-background-feedback-warning-weak: #feeccb;
  --color-background-status-neutral: #ebeef0;
  --color-background-status-negative: #feeae0;
  --color-background-status-warning: #feeccb;
  --color-background-button-primary: #006b99;
  --color-background-input-checked: #006b99;
  --color-background-button-secondary: #ffffff;
  --color-background-button-negative: #cc4300;
  --color-background-button-plain: #ffffff;
  --color-border: #e2e2e3;
  --color-border-feedback-negative: #fddccb;
  --color-border-feedback-neutral: #dee3e7;
  --color-border-feedback-positive: #c1ebea;
  --color-border-feedback-info: #d3e6ed;
  --color-border-feedback-highlight: #e4e0f4;
  --color-border-feedback-warning: #fedfa7;
  --color-border-focus: #006b99;
  --color-border-input: #dee3e7;
  --color-border-input-strong: #96a7b2;
  --color-border-input-hover: #96a7b2;
  --color-border-button-negative-focus: #cc4300;
  --color-border-button-primary: #006b99;
  --color-border-button-secondary: #dee3e7;
  --color-border-button-negative: #cc4300;
  --color-border-error: #cc4300;
  --color-border-button-plain: #ffffff;
  --color-surface-raised: #fafafa;
  --color-surface: #ffffff;
  --color-surface-active: #f7fafc;
  --color-text: #17191a;
  --color-text-dark: #000000;
  --color-text-light: #2e3031;
  --color-text-lighter: #636565;
  --color-text-error: #cc4300;
  --color-text-feedback-neutral: #4f6879;
  --color-text-feedback-negative: #b43b00;
  --color-text-feedback-positive: #00716c;
  --color-text-feedback-info: #006b99;
  --color-text-feedback-warning: #90570a;
  --color-text-feedback-highlight: #78549e;
  --color-text-button: #00344a;
  --color-text-on-accent: #ffffff;
  --color-text-input-info: #4f6879;
  --color-text-placeholder: #5b7588;
  --font-size-md: 16px;
  --font-size: 14px;
  --font-size-xl: 20px;
  --font-size-l: 18px;
  --font-size-sm: 13px;
  --font-size-xs: 12px;
  --font-size-xxs: 10px;
  --font-weight: 400;
  --font-weight-bold: 600;
  --line-height-solid: 1;
  --line-height-xxs: 1.2;
  --line-height-xs: 1.25;
  --line-height-s: 1.3;
  --line-height-m: 1.4;
  --line-height-l: 1.5;
  --line-height-button: 20px;
  --line-height-form: 20px;
  --line-height-form-s: 16px;
  --line-height-tag: 16px;
  --line-height-button-tiny: 16px;
  --line-height-title: calc(24/20);
  --line-height-heading: calc(24/18);
  --size-icon-xxs: 10px;
  --size-icon-xs: 11px;
  --size-icon-s: 12px;
  --size-icon-m: 14px;
  --size-icon-l: 16px;
  --size-icon-xl: 20px;
  --space-xxs: 4px;
  --space-xs: 8px;
  --space-s: 12px;
  --space-m: 16px;
  --space-l: 24px;
  --space-xl: 32px;
  --space-xxl: 64px;
}