/* --- google fonts (self-hosted) --- */
/* cyrillic-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v20--F63fjptAgt5VM-kVkqdyU8n1iIq129k.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v20--F63fjptAgt5VM-kVkqdyU8n1isq129k.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v20--F63fjptAgt5VM-kVkqdyU8n1iAq129k.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v20--F63fjptAgt5VM-kVkqdyU8n1iEq129k.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v20--F63fjptAgt5VM-kVkqdyU8n1i8q1w.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v20--F6qfjptAgt5VM-kVkqdyU8n3twJwl1FgtIU.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v20--F6qfjptAgt5VM-kVkqdyU8n3twJwlRFgtIU.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v20--F6qfjptAgt5VM-kVkqdyU8n3twJwl9FgtIU.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v20--F6qfjptAgt5VM-kVkqdyU8n3twJwl5FgtIU.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v20--F6qfjptAgt5VM-kVkqdyU8n3twJwlBFgg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v23-zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxTKYbABA.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v23-zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxaKYbABA.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v23-zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxdKYbABA.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v23-zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxRKYbABA.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v23-zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxQKYbABA.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v23-zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxeKYY.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v23-zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxTKYbABA.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v23-zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxaKYbABA.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v23-zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxdKYbABA.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v23-zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxRKYbABA.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v23-zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxQKYbABA.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v23-zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxeKYY.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v23-zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxTKYbABA.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v23-zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxaKYbABA.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v23-zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxdKYbABA.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v23-zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxRKYbABA.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v23-zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxQKYbABA.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v23-zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxeKYY.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v22-V8mDoQDjQSkFtoMM3T6r8E7mPb54C-s0.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v22-V8mDoQDjQSkFtoMM3T6r8E7mPb94C-s0.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v22-V8mDoQDjQSkFtoMM3T6r8E7mPbF4Cw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v22-V8mDoQDjQSkFtoMM3T6r8E7mPb54C-s0.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v22-V8mDoQDjQSkFtoMM3T6r8E7mPb94C-s0.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v22-V8mDoQDjQSkFtoMM3T6r8E7mPbF4Cw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v22-V8mDoQDjQSkFtoMM3T6r8E7mPb54C-s0.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v22-V8mDoQDjQSkFtoMM3T6r8E7mPb94C-s0.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/_ds/aelo-design-system-2dc399d6-20cc-43b7-95f5-fbaab126a3e9/fonts/v22-V8mDoQDjQSkFtoMM3T6r8E7mPbF4Cw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* --- end fonts --- */
/* tokens/colors.css */
/* ============================================================
   Aelo — Colors
   Warm neutral base + one terracotta accent. Terra is ~8% of any
   surface and always the primary action. Three muted hues (sage /
   gold / slate) carry status & charts in dashboards.
   ============================================================ */
:root {
  /* ---- Brand / accent ---- */
  --terra:        #D9663A; /* primary action, brand accent */
  --terra-deep:   #C04E26; /* hover / pressed */
  --terra-press:  #AC4520; /* deepest press */
  --peach:        #F0B49A; /* tint / soft fill */
  --peach-wash:   #F7DCCE; /* faintest terra wash */

  /* ---- Ink / neutrals (warm) ---- */
  --ink:          #1A1A18; /* graphite — primary text & dark surface */
  --ink-soft:     #6B6862; /* secondary text */
  --warm-gray:    #8A847B; /* muted text, mono labels */
  --disc-top:     #33332F; /* logo top disc */
  --disc-gray:    #C7C2BA; /* logo bottom disc */

  /* ---- Surfaces (warm) ---- */
  --bg:           #F5F3EF; /* warm white — page background */
  --card:         #FFFFFF; /* card / panel */
  --sand:         #ECE7E0; /* sunken / secondary surface */
  --cream:        #FBF8F3; /* cream — soft inset, text on dark */
  --line:         #E6E2DC; /* hairline border */
  --line-strong:  #D8D2CA; /* stronger divider */

  /* ---- Status / data ---- */
  --sage:         #3E7C74; /* success / published / live */
  --gold:         #E0A33E; /* warning / in-progress / draft */
  --slate:        #4A5B73; /* info / data series */

  /* ============================================================
     Semantic aliases — reference these in components, not raw hues.
     ============================================================ */
  --text-primary:   var(--ink);
  --text-secondary: var(--ink-soft);
  --text-muted:     var(--warm-gray);
  --text-accent:    var(--terra);
  --text-on-accent: #FFFFFF;
  --text-on-ink:    var(--cream);

  --surface-page:   var(--bg);
  --surface-card:   var(--card);
  --surface-sunken: var(--sand);
  --surface-inset:  var(--cream);
  --surface-ink:    var(--ink);

  --border:         var(--line);
  --border-strong:  var(--line-strong);
  --border-accent:  var(--terra);

  --accent:         var(--terra);
  --accent-hover:   var(--terra-deep);
  --accent-press:   var(--terra-press);
  --accent-tint:    var(--peach);
  --accent-wash:    var(--peach-wash);

  --success: var(--sage);
  --warning: var(--gold);
  --info:    var(--slate);

  /* focus ring */
  --ring: color-mix(in srgb, var(--terra) 45%, transparent);
}

/* tokens/typography.css */
/* ============================================================
   Aelo — Typography
   Space Grotesk = brand voice (display, headings, wordmark).
   IBM Plex Sans = body & interface.
   IBM Plex Mono = technical accent (labels, metrics, code).
   Serious engineering in a friendly shell.
   ============================================================ */
:root {
  /* ---- Families ---- */
  --font-display: 'Space Grotesk', system-ui, sans-serif;
  --font-sans:    'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  --font-mono:    'IBM Plex Mono', ui-monospace, 'SF Mono', monospace;

  /* ---- Weights ---- */
  --fw-regular:  400; /* @kind font */
  --fw-medium:   500; /* @kind font */
  --fw-semibold: 600; /* @kind font */
  --fw-bold:     700; /* @kind font */

  /* ---- Display scale (Space Grotesk) ---- */
  --display-xl: 64px;  /* hero wordmark / big numbers */
  --display-lg: 44px;  /* page display */
  --display-md: 34px;  /* section head */
  --display-sm: 29px;  /* H2 */
  --display-xs: 22px;  /* H3 / card title */

  /* ---- Text scale (Plex Sans) ---- */
  --text-lg:   20px;  /* lede */
  --text-md:   18px;  /* large body */
  --text-base: 16px;  /* body */
  --text-sm:   14px;  /* dense UI */
  --text-xs:   13px;  /* fine print */

  /* ---- Mono scale ---- */
  --mono-base: 14px;
  --mono-sm:   12px;
  --mono-xs:   11.5px; /* uppercase labels */

  /* ---- Line heights (unitless) ---- */
  --lh-tight: 1.08; /* @kind other */
  --lh-snug:  1.3;  /* @kind other */
  --lh-body:  1.6;  /* @kind other */

  /* ---- Tracking ---- */
  --tracking-display: -0.03em; /* wordmark, big display */
  --tracking-head:    -0.02em; /* headings */
  --tracking-normal:   0;
  --tracking-label:    0.06em; /* mono labels */
  --tracking-eyebrow:  0.16em; /* uppercase eyebrows */
}

/* tokens/spacing.css */
/* ============================================================
   Aelo — Spacing
   4px base rhythm. Generous section padding (warm, airy layouts).
   ============================================================ */
:root {
  --space-0:   0;
  --space-1:   4px;
  --space-2:   8px;
  --space-3:   12px;
  --space-4:   16px;
  --space-5:   20px;
  --space-6:   24px;
  --space-8:   32px;
  --space-10:  40px;
  --space-12:  48px;
  --space-16:  64px;
  --space-20:  80px;
  --space-22:  88px;  /* section vertical padding */

  /* container */
  --container:  1080px;
  --gutter:     32px;

  /* logo lockup gap (knob from refinement: tight 0.18em is brand default) */
  --lockup-gap: 0.18em;
}

/* tokens/effects.css */
/* ============================================================
   Aelo — Effects: radii, shadows, motion
   Soft corners (10–20px). Shadows are almost absent — warm hairline
   borders do the work. Motion is calm: short fades, no bounce.
   ============================================================ */
:root {
  /* ---- Corner radii ---- */
  --radius-xs:   6px;
  --radius-sm:   8px;
  --radius-md:   11px;  /* buttons, inputs */
  --radius-lg:   14px;  /* inner cards */
  --radius-xl:   20px;  /* panels */
  --radius-2xl:  24px;  /* app-icon tiles */
  --radius-pill: 999px;

  /* ---- Shadows (whisper-soft, warm-tinted) ---- */
  --shadow-none: none;
  --shadow-sm:   0 8px 18px rgba(26, 26, 24, 0.10);
  --shadow-md:   0 8px 20px rgba(26, 26, 24, 0.10);
  --shadow-lg:   0 10px 24px rgba(26, 26, 24, 0.12);
  --shadow-ring: 0 0 0 4px var(--ring);

  /* ---- Motion ---- */
  --ease-out:   cubic-bezier(0.22, 1, 0.36, 1); /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --dur-fast:   120ms; /* @kind other */
  --dur-base:   180ms; /* @kind other */
  --dur-slow:   280ms; /* @kind other */
}

/* styles.css */
/* ============================================================
   Aelo Design System — global entry point.
   Consumers link THIS file. Imports only; no rules live here.
   ============================================================ */
@import url("tokens/fonts.css");
@import url("tokens/colors.css");
@import url("tokens/typography.css");
@import url("tokens/spacing.css");
@import url("tokens/effects.css");
