:root {
  --base100: #111;
  --base20: #f2f2f2;
  --base80: #707070;
  --cape-cod: #414141;
  --gunsmoke: #858584;
  --wild-sand: #f2f4f7;
  --alto: #d9d9d9;
  --call-to-action: #fa64ff;
  --storm-gray: #667085;
  --white-pointer: #fff7ff;
  --font-size-30px: 30px;
  --masala: #3c3c3b;
  --stack: #8c8c8c;
  --white-2: #ffffff4c;
  --font-size-60px: 60px;
  --alabaster: #f9fafb;
  --backgroundsecondary: #3b3b3b;
  --black: #000;
  --blue-chalk: #fee5ff;
  --fiord: #475467;
  --firefly: #182230;
  --gallery: #eaecf0;
  --mirage: #101828;
  --mischka: #d0d5dd;
  --oxford-blue: #344054;
  --pink-flamingo: #fa66ff;
  --pink-flamingo-2: #fa64ff;
  --razzle-dazzle-rose: #f833ff;
  --shocking-pink: #fc99ff;
  --violet-eggplant: #940099;
  --white: #fff;
  --font-size-18px: 18px;
  --font-size-24px: 24px;
  --font-size-l: 20px;
  --font-size-m: 16px;
  --font-size-s: 14px;
  --font-size-xl: 30px;
  --font-size-xs: 12px;
  --font-size-xxl: 36px;
  --font-size-xxxl: 60px;
  --font-family-inter: Inter, Helvetica;
  --font-family-roobert-light: Roobert-Light, Helvetica;
  --font-family-roobert-medium: Roobert-Medium, Helvetica;
  --font-family-roobert-regular: Roobert-Regular, Helvetica;
  --font-family-roobert-semibold: Roobert-SemiBold, Helvetica;

  --baseblack: #000000;
  --basewhite: #ffffff;
  --fiord: #475467;
  --fiord-2: #475466;
  --firefly: #182230;
  --gray900: #0f1728;
  --masala: #3c3c3b;
  --mischka: #d0d5dd;
  --pink-flamingo: #fa66ff;
  --razzle-dazzle-rose: #f833ff;
}
.text-mdmedium {
  font-family: var(--font-family-roobert-medium);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0;
}
.text-smregular {
  font-family: var(--font-family-roobert-regular);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0;
}
.display-xlsemibold {
  font-family: var(--font-family-roobert-semibold);
  font-size: var(--font-size-60px);
  font-style: normal;
  font-weight: 600;
  letter-spacing: -1.2px;
}
.text-lgmedium {
  font-family: var(--font-family-roobert-medium);
  font-size: var(--font-size-18px);
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0;
}
.text-mdregular {
  font-family: var(--font-family-roobert-regular);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0;
}
.text-mdsemibold {
  font-family: var(--font-family-roobert-semibold);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0;
}
.text-xlmedium {
  font-family: var(--font-family-roobert-medium);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0;
}
.display-smmedium {
  font-family: var(--font-family-roobert-medium);
  font-size: var(--font-size-xl);
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0;
}
.text-mdlight {
  font-family: var(--font-family-roobert-light);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 300;
  letter-spacing: 0;
}
.text-smmedium {
  font-family: var(--font-family-roobert-medium);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0;
}
.text-xslight {
  font-family: var(--font-family-roobert-light);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 300;
  letter-spacing: 0;
}
.display-mdmedium {
  font-family: var(--font-family-roobert-medium);
  font-size: var(--font-size-xxl);
  font-style: normal;
  font-weight: 500;
  letter-spacing: -0.72px;
}
.display-xsmedium {
  font-family: var(--font-family-roobert-medium);
  font-size: var(--font-size-24px);
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0;
}
.inter-semi-bold-white-16px {
  color: var(--white);
  font-family: var(--font-family-inter);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 600;
}
.inter-semi-bold-pink-flamingo-16px {
  color: var(--call-to-action);
  font-family: var(--font-family-inter);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 600;
}
.roobert-regular-normal-pink-flamingo-20px {
  color: var(--call-to-action);
  font-family: var(--font-family-roobert-regular);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 400;
}
.roobert-light-fiord-18px {
  color: var(--fiord);
  font-family: var(--font-family-roobert-light);
  font-size: var(--font-size-18px);
  font-style: normal;
  font-weight: 300;
}
.text-smlight {
  font-family: var(--font-family-roobert-light);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 300;
  letter-spacing: 0;
}
.text-xlsemibold {
  font-family: var(--font-family-roobert-semibold);
  font-size: var(--font-size-xl);
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0;
}
.roobert-semi-bold-white-14px {
  color: var(--white);
  font-family: var(--font-family-roobert-semibold);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 600;
}
.roobert-light-fiord-12px {
  color: var(--fiord);
  font-family: var(--font-family-roobert-light);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 300;
}
.roobert-regular-normal-dove-gray-11px {
  color: var(--base80);
  font-family: var(--font-family-roobert-regular);
  font-size: 11px;
  font-style: normal;
  font-weight: 400;
}
.roobert-medium-licorice-17-1px {
  color: var(--base100);
  font-family: var(--font-family-roobert-medium);
  font-size: 17.1px;
  font-style: normal;
  font-weight: 500;
}
.roobert-medium-white-13-7px {
  color: var(--white);
  font-family: var(--font-family-roobert-medium);
  font-size: 13.7px;
  font-style: normal;
  font-weight: 500;
}
.roobert-regular-normal-fiord-11px {
  color: var(--fiord);
  font-family: var(--font-family-roobert-regular);
  font-size: 11px;
  font-style: normal;
  font-weight: 400;
}
.display-smsemibold {
  font-family: var(--font-family-roobert-semibold);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0;
}
.text-lgsemibold {
  font-family: var(--font-family-roobert-semibold);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0;
}
.display-mdsemibold {
  font-family: var(--font-family-roobert-semibold);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 600;
  letter-spacing: -0.72px;
}
.display-mdregular {
  font-family: var(--font-family-roobert-regular);
  font-size: var(--font-size-xxl);
  font-style: normal;
  font-weight: 400;
  letter-spacing: -0.72px;
}
.text-lgregular {
  font-family: var(--font-family-roobert-regular);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0;
}
.roobert-medium-white-14px {
  color: var(--white);
  font-family: var(--font-family-roobert-medium);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 500;
}
.roobert-regular-normal-oxford-blue-14px {
  color: var(--oxford-blue);
  font-family: var(--font-family-roobert-regular);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 400;
}
.roobert-regular-normal-violet-eggplant-14px {
  color: var(--violet-eggplant);
  font-family: var(--font-family-roobert-regular);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 400;
}
.roobert-medium-mirage-14px {
  color: var(--mirage);
  font-family: var(--font-family-roobert-medium);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 500;
}
.roobert-regular-normal-mirage-16px {
  color: var(--mirage);
  font-family: var(--font-family-roobert-regular);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}
.roobert-regular-normal-fiord-16px {
  color: var(--fiord);
  font-family: var(--font-family-roobert-regular);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}
.roobert-medium-white-16px {
  color: var(--white);
  font-family: var(--font-family-roobert-medium);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 500;
}
.roobert-medium-fiord-16px {
  color: var(--fiord);
  font-family: var(--font-family-roobert-medium);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 500;
}
.inter-medium-pink-flamingo-14px {
  color: var(--pink-flamingo);
  font-family: var(--font-family-inter);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 500;
}
.roobert-semi-bold-razzle-dazzle-rose-48px {
  color: var(--razzle-dazzle-rose);
  font-family: var(--font-family-roobert-semibold);
  font-size: 48px;
  font-style: normal;
  font-weight: 600;
}
.text-xllight,
.text-lglight {
  font-family: var(--font-family-roobert-light);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 300;
  letter-spacing: 0;
}
.roobert-medium-mirage-22px {
  color: var(--mirage);
  font-family: var(--font-family-roobert-medium);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 500;
}
.roobert-medium-mirage-36px {
  color: var(--mirage);
  font-family: var(--font-family-roobert-medium);
  font-size: var(--font-size-xxl);
  font-style: normal;
  font-weight: 500;
}
.roobert-medium-mirage-30px {
  color: var(--mirage);
  font-family: var(--font-family-roobert-medium);
  font-size: var(--font-size-xl);
  font-style: normal;
  font-weight: 500;
}

.roobert-medium-mirage-36px {
  color: var(--mirage);
  font-family: var(--font-family-roobert-medium);
  font-size: var(--font-size-xxl);
  font-style: normal;
  font-weight: 500;
}

.roobert-semi-bold-mirage-36px {
  color: var(--mirage);
  font-family: var(--font-family-roobert-semibold);
  font-size: var(--font-size-xxl);
  font-style: normal;
  font-weight: 600;
}

.roobert-semi-bold-mirage-60px {
  color: var(--mirage);
  font-family: var(--font-family-roobert-semibold);
  font-size: var(--font-size-xxxl);
  font-style: normal;
  font-weight: 600;
}

.display-lgsemibold {
  font-family: var(--font-family-roobert-semibold);
  font-size: var(--font-size-xxxl);
  font-style: normal;
  font-weight: 600;
  letter-spacing: -0.96px;
}

.display-lgmedium {
  font-family: var(--font-family-roobert-medium);
  font-size: var(--font-size-xxxl);
  font-style: normal;
  font-weight: 500;
  letter-spacing: -0.96px;
}

.text-xlregular {
  font-family: var(--font-family-inter);
  font-size: var(--font-size-xl);
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0;
}

.roobert-semi-bold-mirage-20px {
  color: var(--mirage);
  font-family: var(--font-family-roobert-semibold);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 600;
}

.roobert-semi-bold-pink-flamingo-16px {
  color: var(--pink-flamingo);
  font-family: var(--font-family-roobert-semibold);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 600;
}

.roobert-semi-bold-razzle-dazzle-rose-60px {
  color: var(--razzle-dazzle-rose);
  font-family: var(--font-family-roobert-semibold);
  font-size: 60px;
  font-style: normal;
  font-weight: 600;
}

.roobert-regular-normal-fiord-20px {
  color: var(--fiord);
  font-family: var(--font-family-roobert-regular);
  font-size: var(--font-size-xl);
  font-style: normal;
  font-weight: 400;
}

.text-smsemibold {
  font-family: var(--font-family-inter);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0;
}

.display-xssemibold {
  font-family: var(--font-family-roobert-semibold);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0;
}

.text-xssemibold {
  font-family: var(--font-family-roobert-semibold);
  font-size: var(--font-size-xxs);
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0;
}