/**
 * Desktop-large viewport scaling (> 1440px).
 *
 * From 1441px to 1920px (included) the layout scales diagonally via root
 * font-size up to a max content width of 1760px. Above 1920px the scale is
 * capped: content stays at 1760px wide and only lateral margins grow.
 *
 * JS (viewport-scale.js) applies the same scale factor; the rules below are
 * a fallback when JS is unavailable.
 */

:root {
  --layout-scale: 1;
  --layout-desktop-reference-width: 1440;
  --layout-desktop-reference-height: 900;
  --layout-desktop-viewport-max-width: 1920;
  --layout-content-max-width: 1760;
  --layout-desktop-max-scale: calc(
    var(--layout-content-max-width) / var(--layout-desktop-reference-width)
  );
}

/* stylelint-disable number-max-precision -- hypot(1440, 900) / 16 */
@media (width > 1440px) and (width <= 1920px) {
  html {
    font-size: min(
      calc(sqrt(100vw * 100vw + 100dvh * 100dvh) / 106.13211440951087),
      calc(1760px / 90)
    );
  }
}
/* stylelint-enable number-max-precision */

@media (width > 1920px) {
  html {
    font-size: calc(1760px / 90);
  }
}