/* Charis AI - proportional desktop scaling
   =======================================================================
   The design is authored for a 1512px-wide viewport (MacBook Pro 14"). At
   that width and above this file does nothing at all: --z is 1, the unit
   aliases below are exactly 1vw / 1vh / 1svh / 1dvh, and every page renders
   byte-identically to how it always has.

   Between 1280px and 1512px the page is laid out at exactly 1512px and then
   scaled down to fit with `zoom`. Placements, alignments, gaps and type all
   keep the same proportion to one another - the whole design simply gets
   smaller. Without this, the vw-based display type shrank with the window
   while the fixed-px mono labels, header height and gaps stayed put, so the
   proportions drifted the narrower the screen got.

   Why the unit aliases are needed
   -------------------------------
   `zoom` on the root scales the layout box, so a width:100% block still
   fills the screen exactly. But vw/vh keep resolving against the *real*
   viewport rather than the scaled layout box, which would leave the display
   type a factor of --z too small - i.e. everything smaller except the big
   type, which is the same drift in reverse. Dividing them by --z restores
   them to the layout box's own coordinate space. Verified at a real 1400px:
   calc(19.5 * var(--vw)) renders at 273.00px, exactly 19.5% of 1512 scaled,
   and calc(100 * var(--vh)) fills the viewport at 900px where a plain 100vh
   would have come up 67px short.

   Below 1280px the scale is dropped and the existing fluid and mobile rules
   take over at full size. Scaling further would push the 11px mono labels
   below 9px, which is past comfortable reading.

   Above 1512px nothing is scaled up: the layout keeps stretching fluidly the
   way it does today, which is what "bigger desktops look as they do now"
   means. Changing that is a one-line edit to the media query's upper bound.  */

:root {
  --z: 1;
  --vw: calc(1vw / var(--z));
  --vh: calc(1vh / var(--z));
  --svh: calc(1svh / var(--z));
  --dvh: calc(1dvh / var(--z));
}

/* Firefox before 126 has no `zoom`. There the aliases would size everything
   up with nothing scaling it back down, so the whole mode is gated on
   support and those browsers simply keep today's behaviour. */
@supports (zoom: 1) {
  @media (min-width: 1280px) and (max-width: 1511.98px) {
    :root { --z: calc(100vw / 1512px); }
    html { zoom: var(--z); }
  }
}