:root {
  --Impl-Text-size-5xs: var(--Size-200-12);
  --Impl-Text-size-4xs: var(--Size-250-14);
  --Impl-Text-size-3xs: var(--Size-300-16);
  --Impl-Text-size-2xs: var(--Size-300-16);
  --Impl-Text-size-xs: var(--Size-350-18);
  --Impl-Text-size-sm: var(--Size-400-20);
  --Impl-Text-size-md: var(--Size-400-20);
  --Impl-Text-size-lg: var(--Size-500-24);
  --Impl-Text-size-xl: var(--Size-500-24);
  --Impl-Text-size-2xl: 30px;
  --Impl-Text-size-4xl: var(--Size-800-36);
}

@media screen and (min-width: 768px) {
  /* Tablet */
  :root {
    --Impl-Text-size-xs: 19px;
    --Impl-Text-size-sm: 22px;
    --Impl-Text-size-lg: var(--Size-550-26);
    --Impl-Text-size-xl: 29px;
    --Impl-Text-size-2xl: 34px;
    --Impl-Text-size-4xl: 44px;
  }
}

@media screen and (min-width: 1367px) {
  /* Desktop */
  :root {
    --Impl-Text-size-2xs: var(--Size-350-18);
    --Impl-Text-size-xs: var(--Size-400-20);
    --Impl-Text-size-sm: var(--Size-500-24);
    --Impl-Text-size-lg: var(--Size-600-28);
    --Impl-Text-size-xl: var(--Size-700-32);
    --Impl-Text-size-2xl: var(--Size-800-36);
    --Impl-Text-size-4xl: var(--Size-1100-48);
  }
}
