:root {

  --color-yellow: #F8FF13;
  --color-grey: #9E9E9E;
  --color-dark: #020307;
  --color-lightdark: #0C0C10;
  --color-white: #F0F0F0;
  --color-superlightwhite: rgba(240, 240, 240, 0.039);
  --color-icon-bg-wi: rgba(240, 240, 240, 0.122);
  --color-icon-bg-yl: rgba(248, 255, 19, 0.239);
  --color-lightwhite: rgba(240, 240, 240, 0.078);
  --color-red: #FF3131;
  --color-blue: #3164FF;
  --color-light-blue: #00A6D4;
  --color-green: #1DA724;
  --color-lightgreen: #5BA71D;
  --color-orange: #FF9B05;
  --color-mandaryn: #EC660F;

  --font-sans: 'Euclid Circular A', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;

  --shadow-active-shadow:
    0px 1px 3px 0px rgba(248, 255, 19, 0.2),
    0px 5px 5px 0px rgba(248, 255, 19, 0.17),
    0px 11px 7px 0px rgba(248, 255, 19, 0.1),
    0px 20px 8px 0px rgba(248, 255, 19, 0.03),
    0px 32px 9px 0px rgba(248, 255, 19, 0);
  --shadow-big-icon-grey:
    5.8px 5.8px 17.39px 0px rgba(115, 115, 115, 0.1),
    21.74px 24.64px 31.88px 0px rgba(115, 115, 115, 0.09),
    47.83px 53.62px 43.48px 0px rgba(115, 115, 115, 0.05),
    84.06px 95.65px 50.72px 0px rgba(115, 115, 115, 0.01),
    131.88px 150.72px 56.52px 0px rgba(115, 115, 115, 0);
  --shadow-big-icon-yellow:
    12px 12px 37px 0px rgba(248, 255, 19, 0.05),
    46px 49px 67px 0px rgba(248, 255, 19, 0.04),
    104px 110px 91px 0px rgba(248, 255, 19, 0.03),
    185px 196px 108px 0px rgba(248, 255, 19, 0.01),
    289px 306px 118px 0px rgba(248, 255, 19, 0);
}

.t-h1 {
  font: 600 40px/48px var(--font-sans);
  letter-spacing: -0.3px;
}
.t-h2 {
  font: 600 32px/40px var(--font-sans);
  letter-spacing: -0.3px;
}
.t-h3 {
  font: 600 28px/38px var(--font-sans);
  letter-spacing: -0.3px;
}
.t-h4 {
  font: 500 24px/32px var(--font-sans);
  letter-spacing: -0.3px;
}
.t-label-xl {
  font: 500 20px/28px var(--font-sans);
  letter-spacing: -0.5px;
}
.t-label-lg {
  font: 500 18px/28px var(--font-sans);
  letter-spacing: -0.01em;
}
.t-label-md {
  font: 500 16px/24px var(--font-sans);
  letter-spacing: -0.01em;
}
.t-label-sm {
  font: 500 14px/20px var(--font-sans);
  letter-spacing: -0.01em;
}
.t-label-xs {
  font: 500 12px/16px var(--font-sans);
  letter-spacing: -0.01em;
}
.t-body-xl {
  font: 400 20px/26px var(--font-sans);
  letter-spacing: -0.5px;
}
.t-body-lg {
  font: 400 18px/28px var(--font-sans);
  letter-spacing: -0.02em;
}
.t-body-md {
  font: 400 16px/24px var(--font-sans);
  letter-spacing: -0.02em;
}
.t-body-sm {
  font: 400 14px/20px var(--font-sans);
  letter-spacing: -0.01em;
}
.t-body-xs {
  font: 400 12px/16px var(--font-sans);
  letter-spacing: -0.04em;
}