html {
    font-family: 'Plus Jakarta Sans', 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  }

  :root {
    --pl-light-bg: #F3F3F3;
    --pl-light-surface: #FFFFFF;
    --pl-light-content: #104E71;
    --pl-light-sub-content: #437D9D;
    --pl-light-division: #DCDCDC;

    --pl-dark-bg: #131B21;
    --pl-dark-surface: #1B2934;
    --pl-dark-content: #FFFFFF;
    --pl-dark-sub-content: #DCDCDC;
    --pl-dark-division: #104E71;

    --pl-g-success-bg: #35C195;
    --pl-g-success-text: #FFFFFF;
    --pl-g-success-highlight: #A3D9D5;

    --pl-g-information-bg: #22A5CA;
    --pl-g-information-text: #FFFFFF;
    --pl-g-information-highlight: #44BBFF;

    --pl-g-error-bg: #E54A64;
    --pl-g-error-text: #FFFFFF;
    --pl-g-error-highlight: #FD7188;

    --pl-g-warning-bg: #E8AD34;
    --pl-g-warning-text: #1B2934;
    --pl-g-warning-highlight: #E7C69E;

    --pl-g-offer-bg: #7548F3;
    --pl-g-offer-text: #FFFFFF;
    --pl-g-offer-highlight: #CAB6FF;

    --pl-g-winner-bg: #FFD47B;
    --pl-g-winner-text: #FFFFFF;
    --pl-g-winner-highlight: #FFD47B;

    --pl-g-greenPayout-bg: #047870;
    --pl-g-greenPayout-text: #FFFFFF;
    --pl-g-greenPayout-highlight: #A3D9D5;

    --pl-g-bluePayout-bg: #22A5CA;
    --pl-g-bluePayout-text: #FFFFFF;
    --pl-g-bluePayout-highlight: #B6DCFF;

    --pl-g-goldPayout-bg: #C9812D;
    --pl-g-goldPayout-text: #FFFFFF;
    --pl-g-goldPayout-highlight: #E7C69E;

    --pl-g-purplePayout-bg: #7548F3;
    --pl-g-purplePayout-text: #FFFFFF;
    --pl-g-purplePayout-highlight: #CAB6FF;

    --pl-g-apple-bg: #000000;
    --pl-g-apple-text: #000000;
    --pl-g-apple-highlight: #000000;

    --pl-g-twitch-bg: #7548F3;
    --pl-g-twitch-text: #FFFFFF;
    --pl-g-twitch-highlight: #CAB6FF;

    --pl-g-bonusBets-bg: #9E7EEF;
    --pl-g-bonusBets-text: #FFFFFF;
    --pl-g-bonusBets-highlight: #9E7EEF;
  }

  @media (prefers-color-scheme: dark) {
    :root {
      --pl-bg: var(--pl-dark-bg);
      --pl-surface: var(--pl-dark-surface);
      --pl-content: var(--pl-dark-content);
      --pl-sub-content: var(--pl-dark-sub-content);
      --pl-division: var(--pl-dark-division);
    }
  }

  @media (prefers-color-scheme: light) {
    :root {
      --pl-bg: var(--pl-light-bg);
      --pl-surface: var(--pl-light-surface);
      --pl-content: var(--pl-light-content);
      --pl-sub-content: var(--pl-light-sub-content);
      --pl-division: var(--pl-light-division);
    }
  }

  html {
    background-color: var(--pl-bg);
  }

  
  .pl-font4XL {
    font-family: PlusJakartaSans-ExtraBold;
    font-weight: 400;
    font-size: 60px;
    line-height: 80px;
  }

  .pl-font3XL {
    font-family: PlusJakartaSans-ExtraBold;
    font-weight: 400;
    font-size: 48px;
    line-height: 60.48px;
  }

  .pl-font2XL {
    font-family: PlusJakartaSans-ExtraBold;
    font-weight: 400;
    font-size: 34px;
    line-height: 42.84px;
  }

  .pl-fontXL {
    font-family: PlusJakartaSans-Bold;
    font-weight: 400;
    font-size: 24px;
    line-height: 30.24px;
  }

  .pl-fontL {
    font-family: PlusJakartaSans-Bold;
    font-weight: 400;
    font-size: 18px;
    line-height: 22.68px;
  }

  .pl-fontM {
    font-family: PlusJakartaSans-Regular;
    font-weight: 400;
    font-size: 14px;
    line-height: 17.64px;
  }

  .pl-fontMContrast {
    font-family: PlusJakartaSans-SemiBold;
    font-weight: 400;
    font-size: 14px;
    line-height: 17.64px;
  }

  .pl-fontS {
    font-family: PlusJakartaSans-Regular;
    font-weight: 400;
    font-size: 13px;
    line-height: 20px;
  }

  .pl-fontSContrast {
    font-family: PlusJakartaSans-Medium;
    font-weight: 400;
    font-size: 13px;
    line-height: 20px;
  }

  .pl-fontXS {
    font-family: PlusJakartaSans-Regular;
    font-weight: 400;
    font-size: 11px;
    line-height: 13.86px;
  }

  .pl-fontXSContrast {
    font-family: PlusJakartaSans-SemiBold;
    font-weight: 400;
    font-size: 11px;
    line-height: 13.86px;
  }

  .pl-fontXXS {
    font-family: PlusJakartaSans-Regular;
    font-weight: 400;
    font-size: 10px;
    line-height: 12.6px;
  }

  .pl-fontXXSContrast {
    font-family: PlusJakartaSans-SemiBold;
    font-weight: 400;
    font-size: 10px;
    line-height: 12.6px;
  }

  .pl-fontXXXS {
    font-family: PlusJakartaSans-Regular;
    font-weight: 400;
    font-size: 8px;
    line-height: 11.5px;
  }

  .pl-fontXXXSContrast {
    font-family: PlusJakartaSans-SemiBold;
    font-weight: 400;
    font-size: 8px;
    line-height: 11.5px;
  }