/* ============================================================
   TYPE
   ------------------------------------------------------------
   Google Sans Flex, variable, carrying the exact axes used in
   Figma: GRAD 0, ROND 0, wdth 100, wght 400–700.

   Tracking turned out to be PROPORTIONAL, not absolute. Every
   letter-spacing value in the designs (0.12 / 0.14 / 0.18 / 0.28 /
   0.42 / 0.52 / 1.0 / 1.3 / 1.32 / 1.68 / 1.8 / 2.1 px) resolves
   to one of four ems. That is the single biggest consolidation in
   the type system — see docs/00-audit.md §2.
   ============================================================ */

:root {
  /* Two hooks, one family today. Point --font-title elsewhere and
     every title and every caps line changes; --font-body carries
     the running text. That is the whole cost of a second typeface. */
  --font-sans: "Google Sans Flex", ui-sans-serif, system-ui, -apple-system,
               "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-title: var(--font-sans);
  --font-body:  var(--font-sans);

  /* Pin the variable axes once; every element inherits it. */
  --font-variation: "GRAD" 0, "ROND" 0, "wdth" 100;

  /* --- Weight --- */
  --weight-regular:  400;
  --weight-medium:   500;
  --weight-semibold: 600;




  /* --- TEXT STYLES --------------------------------------------
     The fourteen styles of Figma 66:1464. A style is size +
     leading + tracking, together and never re-assembled by hand.
     WEIGHT IS A SEPARATE AXIS: every style exists in Regular,
     Medium and SemiBold (the caps in Medium and SemiBold only), so
     it is chosen at the point of use, not baked in.

       titles  h1 30  h2 27  h3 24  h4 21   1.15  2 %
               h5 18  h6 16  h7 14          1.3   1 %
       body    l 16   m 14   s 12   xs 11   1.5   1 %
       caps    l 14   m 12   s 10           1.15  12 %          */

  --type-h1-size:    30px;
  --type-h1-leading: 1.15;
  --type-h1-track:   0.02em;

  --type-h2-size:    27px;
  --type-h2-leading: 1.15;
  --type-h2-track:   0.02em;

  --type-h3-size:    24px;
  --type-h3-leading: 1.15;
  --type-h3-track:   0.02em;

  --type-h4-size:    21px;
  --type-h4-leading: 1.15;
  --type-h4-track:   0.02em;

  --type-h5-size:    18px;
  --type-h5-leading: 1.3;
  --type-h5-track:   0.01em;

  --type-h6-size:    16px;
  --type-h6-leading: 1.3;
  --type-h6-track:   0.01em;

  --type-h7-size:    14px;
  --type-h7-leading: 1.3;
  --type-h7-track:   0.01em;

  --type-body-l-size:    16px;
  --type-body-l-leading: 1.5;
  --type-body-l-track:   0.01em;

  --type-body-m-size:    14px;
  --type-body-m-leading: 1.5;
  --type-body-m-track:   0.01em;

  --type-body-s-size:    12px;
  --type-body-s-leading: 1.5;
  --type-body-s-track:   0.01em;

  --type-body-xs-size:    11px;
  --type-body-xs-leading: 1.5;
  --type-body-xs-track:   0.01em;

  --type-caps-l-size:    14px;
  --type-caps-l-leading: 1.15;
  --type-caps-l-track:   0.12em;

  --type-caps-m-size:    12px;
  --type-caps-m-leading: 1.15;
  --type-caps-m-track:   0.12em;

  --type-caps-s-size:    10px;
  --type-caps-s-leading: 1.15;
  --type-caps-s-track:   0.12em;
}