:root {
  --diff-min-vw: calc(var(--min-vw) / var(--bp-vw));
  --min-font-size: calc(var(--bp-font-size) * var(--diff-min-vw));
  --diff-max-vw: calc(var(--max-vw) / var(--bp-vw));
  --max-font-size: calc(var(--bp-font-size) * var(--diff-max-vw));
  --diff-font-size: calc(var(--max-font-size) - var(--min-font-size));
  --diff-vw: calc(var(--max-vw) - var(--min-vw));
  --slope: calc(var(--diff-font-size) / var(--diff-vw));
  --max-font-size-px: calc(var(--max-font-size) * 1px);
  --min-font-size-px: calc(var(--min-font-size) * 1px);
  --min-vw-px: calc(var(--min-vw) * 1px);
  --fluid-font-size-px: calc(var(--slope) * (100vw - var(--min-vw-px)) + var(--min-font-size-px));
  --clamp-scaling-fs: clamp(var(--min-font-size-px), var(--fluid-font-size-px), var(--max-font-size-px));
}

html {
  font-size: var(--clamp-scaling-fs);
}

.component-root[class]:not(.disable-clamp-scaling) {
  font-size: 1rem;
}