@font-face {
  font-family: Inter;
  src: url("/assets/InterVariable-884c49a1.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  /* Colours: neutrals, then hue families ordered by shade. */
  --transparent: transparent;
  --white: #fff;
  --black-alpha-14: rgb(0 0 0 / 14%);
  --black-alpha-45: rgb(0 0 0 / 45%);
  --slate-alpha-12: rgb(26 38 51 / 12%);
  --slate-50: #f4f6f8;
  --slate-200: #cad6df;
  --slate-400: #a1a5ab;
  --slate-500: #65777c;
  --slate-600: #5e7075;
  --slate-700: #30434d;
  --slate-800: #293a40;
  --blue-50: #edf4f7;
  --blue-100: #d9e9ef;
  --blue-200: #cbdfe7;
  --blue-700: #23647a;
  --blue-800: #1d5366;
  --blue-900: #174352;
  --green-50: #edf5ee;
  --green-700: #39743c;
  --orange-50: #fff4e5;
  --orange-700: #a86613;
  --orange-800: #87500e;
  --purple-700: #8f5ab5;
  --red-50: #fbefed;
  --red-700: #9c4233;
  --teal-700: #16857a;

  /* Spacing */
  --space-0-25: 1px;
  --space-0-5: 2px;
  --space-0-75: 3px;
  --space-1: 4px;
  --space-1-5: 6px;
  --space-2: 8px;
  --space-2-5: 10px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-10: 40px;

  /* Dimensions */
  --size-18: 18px;
  --size-24: 24px;
  --size-26: 26px;
  --size-32: 32px;
  --size-36: 36px;
  --size-38: 38px;
  --size-40: 40px;
  --size-44: 44px;
  --size-48: 48px;
  --size-50: 50px;
  --size-56: 56px;
  --size-60: 60px;
  --size-64: 64px;
  --size-67: 67px;
  --size-71: 71px;
  --size-72: 72px;
  --size-100: 100px;
  --size-102: 102px;
  --size-104: 104px;
  --size-120: 120px;
  --size-140: 140px;
  --size-148: 148px;
  --size-164: 164px;
  --size-178: 178px;
  --size-188: 188px;
  --size-240: 240px;
  --size-260: 260px;
  --size-276: 276px;
  --size-300: 300px;
  --size-310: 310px;
  --size-316: 316px;
  --size-320: 320px;
  --size-350: 350px;
  --size-380: 380px;
  --size-392: 392px;
  --size-400: 400px;
  --size-480: 480px;
  --size-560: 560px;
  --size-600: 600px;
  --size-760: 760px;
  --size-936: 936px;
  --size-950: 950px;
  --size-960: 960px;
  --size-1040: 1040px;
  --size-1060: 1060px;
  --size-24dvh: 24dvh;
  --size-60dvh: 60dvh;

  /* Typography: family, sizes, line heights, then weights. */
  --font-sans: Inter, system-ui, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Consolas, monospace;
  --font-11: 11px;
  --font-12: 12px;
  --font-13: 13px;
  --font-14: 14px;
  --font-16: 16px;
  --font-18: 18px;
  --font-24: 24px;
  --font-30: 30px;
  --line-14: 14px;
  --line-15: 15px;
  --line-16: 16px;
  --line-17: 17px;
  --line-18: 18px;
  --line-19: 19px;
  --line-20: 20px;
  --line-21: 21px;
  --line-24: 24px;
  --line-27: 27px;
  --line-30: 30px;
  --line-36: 36px;
  --line-42: 42px;
  --weight-400: 400;
  --weight-500: 500;
  --weight-600: 600;

  /* Font presets: family, size, line height, weight. Only combinations in use. */
  --font-sans-11-14-regular: var(--weight-400) var(--font-11) / var(--line-14) var(--font-sans);
  --font-sans-11-15-regular: var(--weight-400) var(--font-11) / var(--line-15) var(--font-sans);
  --font-sans-11-16-medium: var(--weight-500) var(--font-11) / var(--line-16) var(--font-sans);
  --font-sans-11-17-regular: var(--weight-400) var(--font-11) / var(--line-17) var(--font-sans);
  --font-sans-11-17-medium: var(--weight-500) var(--font-11) / var(--line-17) var(--font-sans);
  --font-sans-12-18-regular: var(--weight-400) var(--font-12) / var(--line-18) var(--font-sans);
  --font-sans-12-18-medium: var(--weight-500) var(--font-12) / var(--line-18) var(--font-sans);
  --font-sans-12-18-semibold: var(--weight-600) var(--font-12) / var(--line-18) var(--font-sans);
  --font-sans-13-16-regular: var(--weight-400) var(--font-13) / var(--line-16) var(--font-sans);
  --font-sans-13-20-regular: var(--weight-400) var(--font-13) / var(--line-20) var(--font-sans);
  --font-sans-13-20-semibold: var(--weight-600) var(--font-13) / var(--line-20) var(--font-sans);
  --font-sans-14-20-regular: var(--weight-400) var(--font-14) / var(--line-20) var(--font-sans);
  --font-sans-14-20-medium: var(--weight-500) var(--font-14) / var(--line-20) var(--font-sans);
  --font-sans-14-20-semibold: var(--weight-600) var(--font-14) / var(--line-20) var(--font-sans);
  --font-sans-14-21-regular: var(--weight-400) var(--font-14) / var(--line-21) var(--font-sans);
  --font-sans-16-24-regular: var(--weight-400) var(--font-16) / var(--line-24) var(--font-sans);
  --font-sans-16-24-semibold: var(--weight-600) var(--font-16) / var(--line-24) var(--font-sans);
  --font-sans-18-27-semibold: var(--weight-600) var(--font-18) / var(--line-27) var(--font-sans);
  --font-sans-24-30-semibold: var(--weight-600) var(--font-24) / var(--line-30) var(--font-sans);
  --font-sans-24-36-semibold: var(--weight-600) var(--font-24) / var(--line-36) var(--font-sans);
  --font-sans-30-42-semibold: var(--weight-600) var(--font-30) / var(--line-42) var(--font-sans);
  --font-mono-12-19-regular: var(--weight-400) var(--font-12) / var(--line-19) var(--font-mono);

  /* Radii */
  --radius-2: 2px;
  --radius-6: 6px;
  --radius-8: 8px;
  --radius-10: 10px;
  --radius-12: 12px;
  --radius-14: 14px;
  --radius-16: 16px;
  --radius-full: 50%;

  /* Borders */
  --border-1: 1px;
  --border-2: 2px;

  /* Motion */
  --duration-200: 200ms;
  --duration-800: 800ms;
  --ease-out: cubic-bezier(0.2, 0, 0, 1);

  /* Opacity */
  --opacity-0: 0;
  --opacity-40: 0.4;
  --opacity-50: 0.5;
  --opacity-100: 1;

  /* Stacking */
  --layer-notifications: 1000;

  /* Transforms */
  --rotate-half: 180deg;
  --rotate-full: 360deg;
}