:root {
   --lightprimaryyellow-500: rgba(255, 200, 0, 1);
   --lightsurface-600: rgba(29, 29, 29, 1);
   --lightprimaryyellow-100: rgba(255, 244, 204, 1);
   --lightprimaryyellow-800: rgba(102, 80, 0, 1);
   --lightstateswarning-500: rgba(255, 207, 61, 1);
   --lightsurface-100: rgba(245, 245, 250, 1);
   --lightsurface-200: rgba(167, 167, 167, 1);
   --lightsurface-500: rgba(36, 36, 36, 1);
   --lightsurface-700: rgba(22, 22, 22, 1);
   --lightsurface-800: rgba(14, 14, 14, 1);
   --lightsurface-900: rgba(0, 0, 0, 1);
   --lightfonts-100: rgba(255, 255, 255, 1);
   --lightfonts-200: rgba(167, 167, 167, 1);
   --lightfonts-400: rgba(80, 80, 80, 1);
   --lightfonts-500: rgba(36, 36, 36, 1);
   --lightfonts-800: rgba(14, 14, 14, 1);
   --lightfonts-900: rgba(0, 0, 0, 1);
   --lightsecondarypink-500: rgba(235, 124, 155, 1);
   --lightwhitewhite: rgba(255, 255, 255, 1);
   --heading-h1-large-40-bold-font-family: "Kanit", Helvetica;
   --heading-h1-large-40-bold-font-weight: 700;
   --heading-h1-large-40-bold-font-size: 40px;
   --heading-h1-large-40-bold-letter-spacing: -0.30000001192092896px;
   --heading-h1-large-40-bold-line-height: 48px;
   --heading-h1-large-40-bold-font-style: normal;
   --heading-h2-large-32-bold-font-family: "Kanit", Helvetica;
   --heading-h2-large-32-bold-font-weight: 800;
   --heading-h2-large-32-bold-font-size: 32px;
   --heading-h2-large-32-bold-letter-spacing: -0.30000001192092896px;
   --heading-h2-large-32-bold-line-height: 40px;
   --heading-h2-large-32-bold-font-style: normal;
   --heading-h3-large-24-bold-font-family: "Kanit", Helvetica;
   --heading-h3-large-24-bold-font-weight: 700;
   --heading-h3-large-24-bold-font-size: 24px;
   --heading-h3-large-24-bold-letter-spacing: -0.30000001192092896px;
   --heading-h3-large-24-bold-line-height: 32px;
   --heading-h3-large-24-bold-font-style: normal;
   --heading-h4-large-20-bold-font-family: "Kanit", Helvetica;
   --heading-h4-large-20-bold-font-weight: 700;
   --heading-h4-large-20-bold-font-size: 20px;
   --heading-h4-large-20-bold-letter-spacing: -0.30000001192092896px;
   --heading-h4-large-20-bold-line-height: 28px;
   --heading-h4-large-20-bold-font-style: normal;
   --heading-h5-large-18-bold-font-family: "Kanit", Helvetica;
   --heading-h5-large-18-bold-font-weight: 700;
   --heading-h5-large-18-bold-font-size: 18px;
   --heading-h5-large-18-bold-letter-spacing: -0.30000001192092896px;
   --heading-h5-large-18-bold-line-height: 24px;
   --heading-h5-large-18-bold-font-style: normal;
   --body-large-16-regular-font-family: "Kanit", Helvetica;
   --body-large-16-regular-font-weight: 400;
   --body-large-16-regular-font-size: 16px;
   --body-large-16-regular-letter-spacing: 0px;
   --body-large-16-regular-line-height: 24px;
   --body-large-16-regular-font-style: normal;
   --body-large-16-medium-font-family: "Kanit", Helvetica;
   --body-large-16-medium-font-weight: 500;
   --body-large-16-medium-font-size: 16px;
   --body-large-16-medium-letter-spacing: 0px;
   --body-large-16-medium-line-height: 24px;
   --body-large-16-medium-font-style: normal;
   --body-large-16-semibold-font-family: "Kanit", Helvetica;
   --body-large-16-semibold-font-weight: 600;
   --body-large-16-semibold-font-size: 16px;
   --body-large-16-semibold-letter-spacing: 0px;
   --body-large-16-semibold-line-height: 24px;
   --body-large-16-semibold-font-style: normal;
   --body-caption-12-regular-font-family: "Kanit", Helvetica;
   --body-caption-12-regular-font-weight: 400;
   --body-caption-12-regular-font-size: 12px;
   --body-caption-12-regular-letter-spacing: 0px;
   --body-caption-12-regular-line-height: 16px;
   --body-caption-12-regular-font-style: normal;
   --body-caption-12-medium-font-family: "Kanit", Helvetica;
   --body-caption-12-medium-font-weight: 500;
   --body-caption-12-medium-font-size: 12px;
   --body-caption-12-medium-letter-spacing: 0px;
   --body-caption-12-medium-line-height: 16px;
   --body-caption-12-medium-font-style: normal;
   --heading-display-large-bold-font-family: "Kanit", Helvetica;
   --heading-display-large-bold-font-weight: 700;
   --heading-display-large-bold-font-size: 48px;
   --heading-display-large-bold-letter-spacing: -0.30000001192092896px;
   --heading-display-large-bold-line-height: 56px;
   --heading-display-large-bold-font-style: normal;
   --body-small-14-regular-font-family: "Kanit", Helvetica;
   --body-small-14-regular-font-weight: 400;
   --body-small-14-regular-font-size: 14px;
   --body-small-14-regular-letter-spacing: 0px;
   --body-small-14-regular-line-height: 24px;
   --body-small-14-regular-font-style: normal;

   --body-small-14-medium-font-family: "Kanit", Helvetica;
   --body-small-14-medium-font-weight: 500;
   --body-small-14-medium-font-size: 14px;
   --body-small-14-medium-letter-spacing: 0px;
   --body-small-14-medium-line-height: 24px;
   --body-small-14-medium-font-style: normal;

   --heading-h2-mobile-24-bold-font-family: "Kanit", Helvetica;
   --heading-h2-mobile-24-bold-font-weight: 700;
   --heading-h2-mobile-24-bold-font-size: 24px;
   --heading-h2-mobile-24-bold-letter-spacing: -0.30000001192092896px;
   --heading-h2-mobile-24-bold-line-height: 32px;
   --heading-h2-mobile-24-bold-font-style: normal;

   --heading-h3-mobile-20-bold-font-family: "Kanit", Helvetica;
   --heading-h3-mobile-20-bold-font-weight: 700;
   --heading-h3-mobile-20-bold-font-size: 20px;
   --heading-h3-mobile-20-bold-letter-spacing: -0.30000001192092896px;
   --heading-h3-mobile-20-bold-line-height: 28px;
   --heading-h3-mobile-20-bold-font-style: normal;

   --heading-h4-mobile-18-18-font-family: "Kanit", Helvetica;
   --heading-h4-mobile-18-18-font-weight: 600;
   --heading-h4-mobile-18-18-font-size: 18px;
   --heading-h4-mobile-18-18-letter-spacing: -0.30000001192092896px;
   --heading-h4-mobile-18-18-line-height: 24px;
   --heading-h4-mobile-18-18-font-style: normal;

   --shadow-1: 0px 8px 20px 0px rgba(142, 142, 142, 0.25);
}