@import url('https://fonts.googleapis.com/css2?family=Google+Sans+Flex:GRAD,ROND,opsz,slnt,wdth,wght@0..100,0..100,6..144,-10..0,25..151,1..1000&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Google+Sans+Flex:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');

/* typography-tokens.css
 * Auto-generated — do not edit by hand.
 * Apply [data-platform="Desktop"] etc to your root element.
 */

[data-platform="Desktop"] {
  /* Faces */
  --Font-Family-Display: var(--Set-Font-Family-Display, var(--Platform-Font-Families-Decorative, var(--Set-Font-Family-Decorative)));
  --Font-Family-Header: var(--Platform-Font-Families-Header, var(--Set-Font-Family-Header));
  --Font-Family-Eyebrow: var(--Set-Font-Family-Eyebrow, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);
  --Font-Family-Body: var(--Platform-Font-Families-Body, var(--Set-Font-Family-Body));

  /* Face weights */
  --Font-Weight-Display: 400;
  --Font-Weight-Header: 300;
  --Font-Weight-Eyebrow: 400;
  --Font-Weight-Body: 400;

  /* Variable-font axes */
  --Font-Roundness-Header: 8;
  --Font-Slant-Header: 0;
  --Font-Grade-Header: 0;
  --Font-Optical-Size-Header: 72;
  --Font-Width-Header: 100;
  --Font-Variation-Header: "ROND" var(--Font-Roundness-Header), "slnt" var(--Font-Slant-Header), "GRAD" var(--Font-Grade-Header), "opsz" var(--Font-Optical-Size-Header), "wdth" var(--Font-Width-Header);

  /* Display — Large and Medium belong in Header or Hero areas. Small is the one sized to sit inside a component — a card title, a stat, a pull quote. */
  --Display-Large-Font-Family:   var(--Font-Family-Display);
  --Display-Large-Font-Size:     72px;
  --Display-Large-Font-Weight:   var(--Font-Weight-Display);
  --Display-Large-Line-Height:   88px;
  --Display-Large-Letter-Spacing: 0em;
  --Display-Large-Text-Transform: none;
  --Display-Medium-Font-Family:   var(--Font-Family-Display);
  --Display-Medium-Font-Size:     60px;
  --Display-Medium-Font-Weight:   var(--Font-Weight-Display);
  --Display-Medium-Line-Height:   76px;
  --Display-Medium-Letter-Spacing: 0em;
  --Display-Medium-Text-Transform: none;
  --Display-Small-Font-Family:   var(--Font-Family-Display);
  --Display-Small-Font-Size:     48px;
  --Display-Small-Font-Weight:   var(--Font-Weight-Display);
  --Display-Small-Line-Height:   60px;
  --Display-Small-Letter-Spacing: 0em;
  --Display-Small-Text-Transform: none;

  /* Header */
  --H1-Font-Family:   var(--Font-Family-Header);
  --H1-Font-Size:     48px;
  --H1-Font-Weight:   var(--Font-Weight-Header);
  --H1-Line-Height:   56px;
  --H1-Letter-Spacing: -0.01em;
  --H1-Text-Transform: none;
  --H2-Font-Family:   var(--Font-Family-Header);
  --H2-Font-Size:     40px;
  --H2-Font-Weight:   var(--Font-Weight-Header);
  --H2-Line-Height:   48px;
  --H2-Letter-Spacing: -0.01em;
  --H2-Text-Transform: none;
  --H3-Font-Family:   var(--Font-Family-Header);
  --H3-Font-Size:     32px;
  --H3-Font-Weight:   var(--Font-Weight-Header);
  --H3-Line-Height:   40px;
  --H3-Letter-Spacing: -0.01em;
  --H3-Text-Transform: none;
  --H4-Font-Family:   var(--Font-Family-Header);
  --H4-Font-Size:     24px;
  --H4-Font-Weight:   var(--Font-Weight-Header);
  --H4-Line-Height:   32px;
  --H4-Letter-Spacing: -0.01em;
  --H4-Text-Transform: none;
  --H5-Font-Family:   var(--Font-Family-Header);
  --H5-Font-Size:     20px;
  --H5-Font-Weight:   var(--Font-Weight-Header);
  --H5-Line-Height:   28px;
  --H5-Letter-Spacing: -0.01em;
  --H5-Text-Transform: none;
  --H6-Font-Family:   var(--Font-Family-Header);
  --H6-Font-Size:     18px;
  --H6-Font-Weight:   var(--Font-Weight-Header);
  --H6-Line-Height:   24px;
  --H6-Letter-Spacing: -0.01em;
  --H6-Text-Transform: none;

  /* Subtitle */
  --Subtitle-Small-Font-Family:   var(--Font-Family-Body);
  --Subtitle-Small-Font-Size:     14px;
  --Subtitle-Small-Font-Weight:   700;
  --Subtitle-Small-Line-Height:   21px;
  --Subtitle-Small-Letter-Spacing: 0em;
  --Subtitle-Small-Text-Transform: none;
  --Subtitle-Medium-Font-Family:   var(--Font-Family-Body);
  --Subtitle-Medium-Font-Size:     16px;
  --Subtitle-Medium-Font-Weight:   700;
  --Subtitle-Medium-Line-Height:   24px;
  --Subtitle-Medium-Letter-Spacing: 0em;
  --Subtitle-Medium-Text-Transform: none;
  --Subtitle-Large-Font-Family:   var(--Font-Family-Body);
  --Subtitle-Large-Font-Size:     18px;
  --Subtitle-Large-Font-Weight:   700;
  --Subtitle-Large-Line-Height:   27px;
  --Subtitle-Large-Letter-Spacing: 0em;
  --Subtitle-Large-Text-Transform: none;

  /* Body */
  --Body-Small-Font-Family:   var(--Font-Family-Body);
  --Body-Small-Font-Size:     14px;
  --Body-Small-Font-Weight:   var(--Font-Weight-Body);
  --Body-Small-Line-Height:   21px;
  --Body-Small-Letter-Spacing: 0em;
  --Body-Small-Text-Transform: none;
  --Body-Small-Semibold-Font-Weight: 600;
  --Body-Medium-Font-Family:   var(--Font-Family-Body);
  --Body-Medium-Font-Size:     16px;
  --Body-Medium-Font-Weight:   var(--Font-Weight-Body);
  --Body-Medium-Line-Height:   24px;
  --Body-Medium-Letter-Spacing: 0em;
  --Body-Medium-Text-Transform: none;
  --Body-Medium-Semibold-Font-Weight: 600;
  --Body-Large-Font-Family:   var(--Font-Family-Body);
  --Body-Large-Font-Size:     18px;
  --Body-Large-Font-Weight:   var(--Font-Weight-Body);
  --Body-Large-Line-Height:   27px;
  --Body-Large-Letter-Spacing: 0em;
  --Body-Large-Text-Transform: none;
  --Body-Large-Semibold-Font-Weight: 600;

  /* Caption */
  --Caption-Font-Family:   var(--Font-Family-Body);
  --Caption-Font-Size:     14px;
  --Caption-Font-Weight:   500;
  --Caption-Line-Height:   21px;
  --Caption-Letter-Spacing: 0.0071em;
  --Caption-Text-Transform: none;
  --Caption-Bold-Font-Weight: 700;
  --Caption-Paragraph-Spacing: 28px;

  /* Label */
  --Label-ExtraSmall-Font-Family:   var(--Font-Family-Body);
  --Label-ExtraSmall-Font-Size:     11px;
  --Label-ExtraSmall-Font-Weight:   600;
  --Label-ExtraSmall-Line-Height:   16.5px;
  --Label-ExtraSmall-Letter-Spacing: 0.0455em;
  --Label-ExtraSmall-Text-Transform: none;
  --Label-Small-Font-Family:   var(--Font-Family-Body);
  --Label-Small-Font-Size:     12.5px;
  --Label-Small-Font-Weight:   600;
  --Label-Small-Line-Height:   18.75px;
  --Label-Small-Letter-Spacing: 0.02em;
  --Label-Small-Text-Transform: none;
  --Label-Medium-Font-Family:   var(--Font-Family-Body);
  --Label-Medium-Font-Size:     16px;
  --Label-Medium-Font-Weight:   600;
  --Label-Medium-Line-Height:   24px;
  --Label-Medium-Letter-Spacing: 0em;
  --Label-Medium-Text-Transform: none;
  --Label-Medium-All-Caps-Font-Family:   var(--Font-Family-Body);
  --Label-Medium-All-Caps-Font-Size:     16px;
  --Label-Medium-All-Caps-Font-Weight:   600;
  --Label-Medium-All-Caps-Line-Height:   24px;
  --Label-Medium-All-Caps-Letter-Spacing: 0em;
  --Label-Medium-All-Caps-Text-Transform: uppercase;
  --Label-Large-Font-Family:   var(--Font-Family-Body);
  --Label-Large-Font-Size:     18px;
  --Label-Large-Font-Weight:   600;
  --Label-Large-Line-Height:   27px;
  --Label-Large-Letter-Spacing: 0em;
  --Label-Large-Text-Transform: none;

  /* Legal */
  --Legal-Font-Family:   var(--Font-Family-Body);
  --Legal-Font-Size:     10px;
  --Legal-Font-Weight:   400;
  --Legal-Line-Height:   15px;
  --Legal-Letter-Spacing: 0em;
  --Legal-Text-Transform: none;
  --Legal-Semibold-Font-Weight: 600;
  --Legal-Paragraph-Spacing: 20px;

  /* Eyebrow — Eyebrow label — uppercase and tracked. Sits above a heading. */
  --Eyebrow-Small-Font-Size:     12px;
  --Eyebrow-Small-Font-Weight:   600;
  --Eyebrow-Small-Line-Height:   18px;
  --Eyebrow-Small-Letter-Spacing: 0.06em;
  --Eyebrow-Small-Text-Transform: uppercase;
  --Overline-Small-Font-Size: var(--Eyebrow-Small-Font-Size);
  --Overline-Small-Font-Weight: var(--Eyebrow-Small-Font-Weight);
  --Overline-Small-Line-Height: var(--Eyebrow-Small-Line-Height);
  --Overline-Small-Letter-Spacing: var(--Eyebrow-Small-Letter-Spacing);
  --Overline-Small-Text-Transform: var(--Eyebrow-Small-Text-Transform);
  --Eyebrow-Medium-Font-Size:     13px;
  --Eyebrow-Medium-Font-Weight:   600;
  --Eyebrow-Medium-Line-Height:   19.5px;
  --Eyebrow-Medium-Letter-Spacing: 0.05em;
  --Eyebrow-Medium-Text-Transform: uppercase;
  --Overline-Medium-Font-Size: var(--Eyebrow-Medium-Font-Size);
  --Overline-Medium-Font-Weight: var(--Eyebrow-Medium-Font-Weight);
  --Overline-Medium-Line-Height: var(--Eyebrow-Medium-Line-Height);
  --Overline-Medium-Letter-Spacing: var(--Eyebrow-Medium-Letter-Spacing);
  --Overline-Medium-Text-Transform: var(--Eyebrow-Medium-Text-Transform);
  --Eyebrow-Large-Font-Size:     15px;
  --Eyebrow-Large-Font-Weight:   600;
  --Eyebrow-Large-Line-Height:   22.5px;
  --Eyebrow-Large-Letter-Spacing: 0.04em;
  --Eyebrow-Large-Text-Transform: uppercase;
  --Overline-Large-Font-Size: var(--Eyebrow-Large-Font-Size);
  --Overline-Large-Font-Weight: var(--Eyebrow-Large-Font-Weight);
  --Overline-Large-Line-Height: var(--Eyebrow-Large-Line-Height);
  --Overline-Large-Letter-Spacing: var(--Eyebrow-Large-Letter-Spacing);
  --Overline-Large-Text-Transform: var(--Eyebrow-Large-Text-Transform);

  /* Number */
  --Number-Small-Font-Family:   var(--Font-Family-Body);
  --Number-Small-Font-Size:     16px;
  --Number-Small-Font-Weight:   700;
  --Number-Small-Line-Height:   16px;
  --Number-Small-Letter-Spacing: 0em;
  --Number-Small-Text-Transform: none;
  --Number-Medium-Font-Family:   var(--Font-Family-Body);
  --Number-Medium-Font-Size:     28px;
  --Number-Medium-Font-Weight:   700;
  --Number-Medium-Line-Height:   28px;
  --Number-Medium-Letter-Spacing: 0em;
  --Number-Medium-Text-Transform: none;
  --Number-Large-Font-Family:   var(--Font-Family-Body);
  --Number-Large-Font-Size:     36px;
  --Number-Large-Font-Weight:   700;
  --Number-Large-Line-Height:   36px;
  --Number-Large-Letter-Spacing: 0em;
  --Number-Large-Text-Transform: none;

  /* Button */
  --Button-ExtraSmall-Font-Family:   var(--Font-Family-Body);
  --Button-ExtraSmall-Font-Size:     11px;
  --Button-ExtraSmall-Font-Weight:   600;
  --Button-ExtraSmall-Line-Height:   11px;
  --Button-ExtraSmall-Letter-Spacing: 0em;
  --Button-ExtraSmall-Text-Transform: none;
  --Button-Small-Font-Family:   var(--Font-Family-Body);
  --Button-Small-Font-Size:     14px;
  --Button-Small-Font-Weight:   600;
  --Button-Small-Line-Height:   14px;
  --Button-Small-Letter-Spacing: 0em;
  --Button-Small-Text-Transform: none;
  --Button-Standard-Font-Family:   var(--Font-Family-Body);
  --Button-Standard-Font-Size:     16px;
  --Button-Standard-Font-Weight:   600;
  --Button-Standard-Line-Height:   16px;
  --Button-Standard-Letter-Spacing: 0em;
  --Button-Standard-Text-Transform: none;
  --Button-Large-Font-Family:   var(--Font-Family-Body);
  --Button-Large-Font-Size:     24px;
  --Button-Large-Font-Weight:   600;
  --Button-Large-Line-Height:   24px;
  --Button-Large-Letter-Spacing: 0em;
  --Button-Large-Text-Transform: none;
}

[data-platform="IOS-Mobile"] {

  /* Display */
  --Font-Family-Display: var(--Set-Font-Family-Display, var(--Platform-Font-Families-Decorative, var(--Set-Font-Family-Decorative)));
  --Display-Small-Font-Size:     28px;
  --Display-Small-Font-Weight:   600;
  --Display-Small-Line-Height:   28px;
  --Display-Small-Letter-Spacing: 0px;
  --Font-Family-Display: var(--Set-Font-Family-Display, var(--Platform-Font-Families-Decorative, var(--Set-Font-Family-Decorative)));
  --Display-Large-Font-Size:     28px;
  --Display-Large-Font-Weight:   600;
  --Display-Large-Line-Height:   28px;
  --Display-Large-Letter-Spacing: 0px;

  /* Headers */
  --Font-Family-Body: var(--Platform-Font-Families-Decorative);
  --H1-Font-Size:     28px;
  --H1-Font-Weight:   600;
  --H1-Line-Height:   28px;
  --H1-Letter-Spacing: 0px;
  --Font-Family-Body: var(--Platform-Font-Families-Decorative);
  --H2-Font-Size:     26px;
  --H2-Font-Weight:   600;
  --H2-Line-Height:   26px;
  --H2-Letter-Spacing: 0px;
  --Font-Family-Body: var(--Platform-Font-Families-Decorative);
  --H3-Font-Size:     24px;
  --H3-Font-Weight:   600;
  --H3-Line-Height:   24px;
  --H3-Letter-Spacing: 0px;
  --Font-Family-Body: var(--Platform-Font-Families-Decorative);
  --H4-Font-Size:     20px;
  --H4-Font-Weight:   600;
  --H4-Line-Height:   20px;
  --H4-Letter-Spacing: 0px;
  --Font-Family-Body: var(--Platform-Font-Families-Decorative);
  --H5-Font-Size:     18px;
  --H5-Font-Weight:   600;
  --H5-Line-Height:   18px;
  --H5-Letter-Spacing: 0px;
  --Font-Family-Body: var(--Platform-Font-Families-Decorative);
  --H6-Font-Size:     16px;
  --H6-Font-Weight:   600;
  --H6-Line-Height:   16px;
  --H6-Letter-Spacing: 0px;

  /* Subtitle */
  --Font-Family-Subtitle: var(--Platform-Font-Families-Body);
  --Subtitle-Small-Font-Size:     16px;
  --Subtitle-Small-Font-Weight:   700;
  --Subtitle-Small-Line-Height:   24px;
  --Subtitle-Small-Letter-Spacing: 0px;
  --Font-Family-Subtitle: var(--Platform-Font-Families-Body);
  --Subtitle-Large-Font-Size:     16px;
  --Subtitle-Large-Font-Weight:   700;
  --Subtitle-Large-Line-Height:   24px;
  --Subtitle-Large-Letter-Spacing: 0px;

  /* Body */
  --Font-Family-Body: var(--Platform-Font-Families-Body);
  --Body-Small-Font-Size:     14px;
  --Body-Small-Font-Weight:   500;
  --Body-Small-Line-Height:   21px;
  --Body-Small-Letter-Spacing: 0px;
  --Body-Small-Semibold-Font-Weight: 600;
  --Body-Small-Bold-Font-Weight: 700;
  --Font-Family-Body: var(--Platform-Font-Families-Body);
  --Body-Medium-Font-Size:     16px;
  --Body-Medium-Font-Weight:   600;
  --Body-Medium-Line-Height:   24px;
  --Body-Medium-Letter-Spacing: 0px;
  --Body-Medium-Semibold-Font-Weight: 600;
  --Body-Medium-Bold-Font-Weight: 700;
  --Font-Family-Body: var(--Platform-Font-Families-Body);
  --Body-Large-Font-Size:     18px;
  --Body-Large-Font-Weight:   600;
  --Body-Large-Line-Height:   27px;
  --Body-Large-Letter-Spacing: 0px;
  --Body-Large-Semibold-Font-Weight: 600;
  --Body-Large-Bold-Font-Weight: 700;

  /* Caption */
  --Font-Family-Body: var(--Platform-Font-Families-Body);
  --Caption-Font-Size:     14px;
  --Caption-Font-Weight:   500;
  --Caption-Line-Height:   21px;
  --Caption-Letter-Spacing: 0px;
  --Caption-Bold-Font-Weight: 700;

  /* Label */
  --Font-Family-Label: var(--Platform-Font-Families-Body);
  --Label-ExtraSmall-Font-Size:     11px;
  --Label-ExtraSmall-Font-Weight:   600;
  --Label-ExtraSmall-Line-Height:   16.5px;
  --Label-ExtraSmall-Letter-Spacing: 0px;
  --Font-Family-Label: var(--Platform-Font-Families-Body);
  --Label-Small-Font-Size:     12.5px;
  --Label-Small-Font-Weight:   600;
  --Label-Small-Line-Height:   18.75px;
  --Label-Small-Letter-Spacing: 0px;
  --Font-Family-Label: var(--Platform-Font-Families-Body);
  --Label-Medium-Font-Size:     16px;
  --Label-Medium-Font-Weight:   600;
  --Label-Medium-Line-Height:   24px;
  --Label-Medium-Letter-Spacing: 0px;
  --Font-Family-Label: var(--Platform-Font-Families-Body);
  --Label-Large-Font-Size:     18px;
  --Label-Large-Font-Weight:   600;
  --Label-Large-Line-Height:   27px;
  --Label-Large-Letter-Spacing: 0px;

  /* Legal */
  --Font-Family-Body: var(--Platform-Font-Families-Body);
  --Legal-Font-Size:     10px;
  --Legal-Font-Weight:   400;
  --Legal-Line-Height:   15px;
  --Legal-Letter-Spacing: 0px;
  --Legal-Semibold-Font-Weight: 600;

  /* Overline */
  --Font-Family-Overline: var(--Platform-Font-Families-Body);
  --Overline-Small-Font-Size:     14px;
  --Overline-Small-Font-Weight:   500;
  --Overline-Small-Line-Height:   21px;
  --Overline-Small-Letter-Spacing: 0px;
  --Font-Family-Overline: var(--Platform-Font-Families-Body);
  --Overline-Medium-Font-Size:     16px;
  --Overline-Medium-Font-Weight:   600;
  --Overline-Medium-Line-Height:   24px;
  --Overline-Medium-Letter-Spacing: 0px;
  --Font-Family-Overline: var(--Platform-Font-Families-Body);
  --Overline-Large-Font-Size:     18px;
  --Overline-Large-Font-Weight:   600;
  --Overline-Large-Line-Height:   27px;
  --Overline-Large-Letter-Spacing: 0px;

  /* Number */
  --Font-Family-Number: var(--Platform-Font-Families-Body);
  --Number-Small-Font-Size:     16px;
  --Number-Small-Font-Weight:   700;
  --Number-Small-Line-Height:   16px;
  --Number-Small-Letter-Spacing: 0px;
  --Font-Family-Number: var(--Platform-Font-Families-Body);
  --Number-Medium-Font-Size:     28px;
  --Number-Medium-Font-Weight:   700;
  --Number-Medium-Line-Height:   28px;
  --Number-Medium-Letter-Spacing: 0px;
  --Font-Family-Number: var(--Platform-Font-Families-Body);
  --Number-Large-Font-Size:     18px;
  --Number-Large-Font-Weight:   700;
  --Number-Large-Line-Height:   27px;
  --Number-Large-Letter-Spacing: 0px;

  /* Button */
  --Font-Family-Button: var(--Platform-Font-Families-Body);
  --Button-ExtraSmall-Font-Size:     11px;
  --Button-ExtraSmall-Font-Weight:   600;
  --Button-ExtraSmall-Line-Height:   11px;
  --Button-ExtraSmall-Letter-Spacing: 0px;
  --Font-Family-Button: var(--Platform-Font-Families-Body);
  --Button-Small-Font-Size:     14px;
  --Button-Small-Font-Weight:   600;
  --Button-Small-Line-Height:   14px;
  --Button-Small-Letter-Spacing: 0px;
  --Font-Family-Button: var(--Platform-Font-Families-Body);
  --Button-Standard-Font-Size:     16px;
  --Button-Standard-Font-Weight:   600;
  --Button-Standard-Line-Height:   16px;
  --Button-Standard-Letter-Spacing: 0px;

}

[data-platform="IOS-Tablet"] {

  /* Display */
  --Font-Family-Display: var(--Set-Font-Family-Display, var(--Platform-Font-Families-Decorative, var(--Set-Font-Family-Decorative)));
  --Display-Small-Font-Size:     28px;
  --Display-Small-Font-Weight:   600;
  --Display-Small-Line-Height:   28px;
  --Display-Small-Letter-Spacing: 0px;
  --Font-Family-Display: var(--Set-Font-Family-Display, var(--Platform-Font-Families-Decorative, var(--Set-Font-Family-Decorative)));
  --Display-Large-Font-Size:     28px;
  --Display-Large-Font-Weight:   600;
  --Display-Large-Line-Height:   28px;
  --Display-Large-Letter-Spacing: 0px;

  /* Headers */
  --Font-Family-Body: var(--Platform-Font-Families-Decorative);
  --H1-Font-Size:     28px;
  --H1-Font-Weight:   600;
  --H1-Line-Height:   28px;
  --H1-Letter-Spacing: 0px;
  --Font-Family-Body: var(--Platform-Font-Families-Decorative);
  --H2-Font-Size:     26px;
  --H2-Font-Weight:   600;
  --H2-Line-Height:   26px;
  --H2-Letter-Spacing: 0px;
  --Font-Family-Body: var(--Platform-Font-Families-Decorative);
  --H3-Font-Size:     24px;
  --H3-Font-Weight:   600;
  --H3-Line-Height:   24px;
  --H3-Letter-Spacing: 0px;
  --Font-Family-Body: var(--Platform-Font-Families-Decorative);
  --H4-Font-Size:     20px;
  --H4-Font-Weight:   600;
  --H4-Line-Height:   20px;
  --H4-Letter-Spacing: 0px;
  --Font-Family-Body: var(--Platform-Font-Families-Decorative);
  --H5-Font-Size:     18px;
  --H5-Font-Weight:   600;
  --H5-Line-Height:   18px;
  --H5-Letter-Spacing: 0px;
  --Font-Family-Body: var(--Platform-Font-Families-Decorative);
  --H6-Font-Size:     16px;
  --H6-Font-Weight:   600;
  --H6-Line-Height:   16px;
  --H6-Letter-Spacing: 0px;

  /* Subtitle */
  --Font-Family-Subtitle: var(--Platform-Font-Families-Body);
  --Subtitle-Small-Font-Size:     16px;
  --Subtitle-Small-Font-Weight:   700;
  --Subtitle-Small-Line-Height:   24px;
  --Subtitle-Small-Letter-Spacing: 0px;
  --Font-Family-Subtitle: var(--Platform-Font-Families-Body);
  --Subtitle-Large-Font-Size:     18px;
  --Subtitle-Large-Font-Weight:   700;
  --Subtitle-Large-Line-Height:   32px;
  --Subtitle-Large-Letter-Spacing: 0px;

  /* Body */
  --Font-Family-Body: var(--Platform-Font-Families-Body);
  --Body-Small-Font-Size:     14px;
  --Body-Small-Font-Weight:   500;
  --Body-Small-Line-Height:   21px;
  --Body-Small-Letter-Spacing: 0px;
  --Body-Small-Semibold-Font-Weight: 600;
  --Body-Small-Bold-Font-Weight: 700;
  --Font-Family-Body: var(--Platform-Font-Families-Body);
  --Body-Medium-Font-Size:     16px;
  --Body-Medium-Font-Weight:   500;
  --Body-Medium-Line-Height:   24px;
  --Body-Medium-Letter-Spacing: 0px;
  --Body-Medium-Semibold-Font-Weight: 600;
  --Body-Medium-Bold-Font-Weight: 700;
  --Font-Family-Body: var(--Platform-Font-Families-Body);
  --Body-Large-Font-Size:     18px;
  --Body-Large-Font-Weight:   600;
  --Body-Large-Line-Height:   27px;
  --Body-Large-Letter-Spacing: 0px;
  --Body-Large-Semibold-Font-Weight: 600;
  --Body-Large-Bold-Font-Weight: 700;

  /* Caption */
  --Font-Family-Body: var(--Platform-Font-Families-Body);
  --Caption-Font-Size:     14px;
  --Caption-Font-Weight:   500;
  --Caption-Line-Height:   21px;
  --Caption-Letter-Spacing: 0px;
  --Caption-Bold-Font-Weight: 700;

  /* Label */
  --Font-Family-Label: var(--Platform-Font-Families-Body);
  --Label-ExtraSmall-Font-Size:     11px;
  --Label-ExtraSmall-Font-Weight:   600;
  --Label-ExtraSmall-Line-Height:   16.5px;
  --Label-ExtraSmall-Letter-Spacing: 0px;
  --Font-Family-Label: var(--Platform-Font-Families-Body);
  --Label-Small-Font-Size:     12.5px;
  --Label-Small-Font-Weight:   600;
  --Label-Small-Line-Height:   18.75px;
  --Label-Small-Letter-Spacing: 0px;
  --Font-Family-Label: var(--Platform-Font-Families-Body);
  --Label-Medium-Font-Size:     16px;
  --Label-Medium-Font-Weight:   600;
  --Label-Medium-Line-Height:   24px;
  --Label-Medium-Letter-Spacing: 0px;
  --Font-Family-Label: var(--Platform-Font-Families-Body);
  --Label-Large-Font-Size:     18px;
  --Label-Large-Font-Weight:   600;
  --Label-Large-Line-Height:   27px;
  --Label-Large-Letter-Spacing: 0px;

  /* Legal */
  --Font-Family-Body: var(--Platform-Font-Families-Body);
  --Legal-Font-Size:     10px;
  --Legal-Font-Weight:   400;
  --Legal-Line-Height:   15px;
  --Legal-Letter-Spacing: 0px;
  --Legal-Semibold-Font-Weight: 600;

  /* Overline */
  --Font-Family-Overline: var(--Platform-Font-Families-Body);
  --Overline-Small-Font-Size:     14px;
  --Overline-Small-Font-Weight:   500;
  --Overline-Small-Line-Height:   21px;
  --Overline-Small-Letter-Spacing: 0px;
  --Font-Family-Overline: var(--Platform-Font-Families-Body);
  --Overline-Medium-Font-Size:     16px;
  --Overline-Medium-Font-Weight:   600;
  --Overline-Medium-Line-Height:   24px;
  --Overline-Medium-Letter-Spacing: 0px;
  --Font-Family-Overline: var(--Platform-Font-Families-Body);
  --Overline-Large-Font-Size:     18px;
  --Overline-Large-Font-Weight:   600;
  --Overline-Large-Line-Height:   27px;
  --Overline-Large-Letter-Spacing: 0px;

  /* Number */
  --Font-Family-Number: var(--Platform-Font-Families-Body);
  --Number-Small-Font-Size:     16px;
  --Number-Small-Font-Weight:   700;
  --Number-Small-Line-Height:   16px;
  --Number-Small-Letter-Spacing: 0px;
  --Font-Family-Number: var(--Platform-Font-Families-Body);
  --Number-Medium-Font-Size:     28px;
  --Number-Medium-Font-Weight:   700;
  --Number-Medium-Line-Height:   16px;
  --Number-Medium-Letter-Spacing: 0px;
  --Font-Family-Number: var(--Platform-Font-Families-Body);
  --Number-Large-Font-Size:     36px;
  --Number-Large-Font-Weight:   700;
  --Number-Large-Line-Height:   36px;
  --Number-Large-Letter-Spacing: 0px;

  /* Button */
  --Font-Family-Button: var(--Platform-Font-Families-Body);
  --Button-ExtraSmall-Font-Size:     11px;
  --Button-ExtraSmall-Font-Weight:   600;
  --Button-ExtraSmall-Line-Height:   28px;
  --Button-ExtraSmall-Letter-Spacing: 0px;
  --Font-Family-Button: var(--Platform-Font-Families-Body);
  --Button-Small-Font-Size:     14px;
  --Button-Small-Font-Weight:   600;
  --Button-Small-Line-Height:   16px;
  --Button-Small-Letter-Spacing: 0px;
  --Font-Family-Button: var(--Platform-Font-Families-Body);
  --Button-Standard-Font-Size:     16px;
  --Button-Standard-Font-Weight:   600;
  --Button-Standard-Line-Height:   16px;
  --Button-Standard-Letter-Spacing: 0px;

}

[data-platform="Android"] {

  /* Display */
  --Font-Family-Display: var(--Set-Font-Family-Display, var(--Platform-Font-Families-Decorative, var(--Set-Font-Family-Decorative)));
  --Display-Small-Font-Size:     28px;
  --Display-Small-Font-Weight:   600;
  --Display-Small-Line-Height:   28px;
  --Display-Small-Letter-Spacing: 0px;
  --Font-Family-Display: var(--Set-Font-Family-Display, var(--Platform-Font-Families-Decorative, var(--Set-Font-Family-Decorative)));
  --Display-Large-Font-Size:     28px;
  --Display-Large-Font-Weight:   600;
  --Display-Large-Line-Height:   28px;
  --Display-Large-Letter-Spacing: 0px;

  /* Headers */
  --Font-Family-Body: var(--Platform-Font-Families-Decorative);
  --H1-Font-Size:     28px;
  --H1-Font-Weight:   600;
  --H1-Line-Height:   28px;
  --H1-Letter-Spacing: 0px;
  --Font-Family-Body: var(--Platform-Font-Families-Decorative);
  --H2-Font-Size:     26px;
  --H2-Font-Weight:   600;
  --H2-Line-Height:   26px;
  --H2-Letter-Spacing: 0px;
  --Font-Family-Body: var(--Platform-Font-Families-Decorative);
  --H3-Font-Size:     24px;
  --H3-Font-Weight:   600;
  --H3-Line-Height:   24px;
  --H3-Letter-Spacing: 0px;
  --Font-Family-Body: var(--Platform-Font-Families-Decorative);
  --H4-Font-Size:     20px;
  --H4-Font-Weight:   600;
  --H4-Line-Height:   20px;
  --H4-Letter-Spacing: 0px;
  --Font-Family-Body: var(--Platform-Font-Families-Decorative);
  --H5-Font-Size:     18px;
  --H5-Font-Weight:   600;
  --H5-Line-Height:   18px;
  --H5-Letter-Spacing: 0px;
  --Font-Family-Body: var(--Platform-Font-Families-Decorative);
  --H6-Font-Size:     16px;
  --H6-Font-Weight:   600;
  --H6-Line-Height:   16px;
  --H6-Letter-Spacing: 0px;

  /* Subtitle */
  --Font-Family-Subtitle: var(--Platform-Font-Families-Body);
  --Subtitle-Small-Font-Size:     16px;
  --Subtitle-Small-Font-Weight:   700;
  --Subtitle-Small-Line-Height:   24px;
  --Subtitle-Small-Letter-Spacing: 0px;
  --Font-Family-Subtitle: var(--Platform-Font-Families-Body);
  --Subtitle-Large-Font-Size:     18px;
  --Subtitle-Large-Font-Weight:   700;
  --Subtitle-Large-Line-Height:   32px;
  --Subtitle-Large-Letter-Spacing: 0px;

  /* Body */
  --Font-Family-Body: var(--Platform-Font-Families-Body);
  --Body-Small-Font-Size:     14px;
  --Body-Small-Font-Weight:   500;
  --Body-Small-Line-Height:   21px;
  --Body-Small-Letter-Spacing: 0px;
  --Body-Small-Semibold-Font-Weight: 600;
  --Body-Small-Bold-Font-Weight: 700;
  --Font-Family-Body: var(--Platform-Font-Families-Body);
  --Body-Medium-Font-Size:     16px;
  --Body-Medium-Font-Weight:   500;
  --Body-Medium-Line-Height:   24px;
  --Body-Medium-Letter-Spacing: 0px;
  --Body-Medium-Semibold-Font-Weight: 600;
  --Body-Medium-Bold-Font-Weight: 700;
  --Font-Family-Body: var(--Platform-Font-Families-Body);
  --Body-Large-Font-Size:     18px;
  --Body-Large-Font-Weight:   600;
  --Body-Large-Line-Height:   27px;
  --Body-Large-Letter-Spacing: 0px;
  --Body-Large-Semibold-Font-Weight: 600;
  --Body-Large-Bold-Font-Weight: 700;

  /* Caption */
  --Font-Family-Body: var(--Platform-Font-Families-Body);
  --Caption-Font-Size:     14px;
  --Caption-Font-Weight:   500;
  --Caption-Line-Height:   21px;
  --Caption-Letter-Spacing: 0px;
  --Caption-Bold-Font-Weight: 700;

  /* Label */
  --Font-Family-Label: var(--Platform-Font-Families-Body);
  --Label-ExtraSmall-Font-Size:     11px;
  --Label-ExtraSmall-Font-Weight:   600;
  --Label-ExtraSmall-Line-Height:   16.5px;
  --Label-ExtraSmall-Letter-Spacing: 0px;
  --Font-Family-Label: var(--Platform-Font-Families-Body);
  --Label-Small-Font-Size:     12.5px;
  --Label-Small-Font-Weight:   600;
  --Label-Small-Line-Height:   18.75px;
  --Label-Small-Letter-Spacing: 0px;
  --Font-Family-Label: var(--Platform-Font-Families-Body);
  --Label-Medium-Font-Size:     16px;
  --Label-Medium-Font-Weight:   600;
  --Label-Medium-Line-Height:   24px;
  --Label-Medium-Letter-Spacing: 0px;
  --Font-Family-Label: var(--Platform-Font-Families-Body);
  --Label-Large-Font-Size:     18px;
  --Label-Large-Font-Weight:   600;
  --Label-Large-Line-Height:   27px;
  --Label-Large-Letter-Spacing: 0px;

  /* Legal */
  --Font-Family-Body: var(--Platform-Font-Families-Body);
  --Legal-Font-Size:     10px;
  --Legal-Font-Weight:   400;
  --Legal-Line-Height:   15px;
  --Legal-Letter-Spacing: 0px;
  --Legal-Semibold-Font-Weight: 600;

  /* Overline */
  --Font-Family-Overline: var(--Platform-Font-Families-Body);
  --Overline-Small-Font-Size:     14px;
  --Overline-Small-Font-Weight:   500;
  --Overline-Small-Line-Height:   21px;
  --Overline-Small-Letter-Spacing: 0px;
  --Font-Family-Overline: var(--Platform-Font-Families-Body);
  --Overline-Medium-Font-Size:     16px;
  --Overline-Medium-Font-Weight:   600;
  --Overline-Medium-Line-Height:   24px;
  --Overline-Medium-Letter-Spacing: 0px;
  --Font-Family-Overline: var(--Platform-Font-Families-Body);
  --Overline-Large-Font-Size:     18px;
  --Overline-Large-Font-Weight:   600;
  --Overline-Large-Line-Height:   27px;
  --Overline-Large-Letter-Spacing: 0px;

  /* Number */
  --Font-Family-Number: var(--Platform-Font-Families-Body);
  --Number-Small-Font-Size:     16px;
  --Number-Small-Font-Weight:   700;
  --Number-Small-Line-Height:   16px;
  --Number-Small-Letter-Spacing: 0px;
  --Font-Family-Number: var(--Platform-Font-Families-Body);
  --Number-Medium-Font-Size:     28px;
  --Number-Medium-Font-Weight:   700;
  --Number-Medium-Line-Height:   16px;
  --Number-Medium-Letter-Spacing: 0px;
  --Font-Family-Number: var(--Platform-Font-Families-Body);
  --Number-Large-Font-Size:     36px;
  --Number-Large-Font-Weight:   700;
  --Number-Large-Line-Height:   36px;
  --Number-Large-Letter-Spacing: 0px;

  /* Button */
  --Font-Family-Button: var(--Platform-Font-Families-Body);
  --Button-ExtraSmall-Font-Size:     11px;
  --Button-ExtraSmall-Font-Weight:   600;
  --Button-ExtraSmall-Line-Height:   28px;
  --Button-ExtraSmall-Letter-Spacing: 0px;
  --Font-Family-Button: var(--Platform-Font-Families-Body);
  --Button-Small-Font-Size:     14px;
  --Button-Small-Font-Weight:   600;
  --Button-Small-Line-Height:   16px;
  --Button-Small-Letter-Spacing: 0px;
  --Font-Family-Button: var(--Platform-Font-Families-Body);
  --Button-Standard-Font-Size:     16px;
  --Button-Standard-Font-Weight:   600;
  --Button-Standard-Line-Height:   16px;
  --Button-Standard-Letter-Spacing: 0px;

}


/* ---------------------------------------------------------------------------
   Face re-mapping
   Display renders in the Display face (it used to follow Header, which left the
   expressive face with nowhere to appear at size). Overline is the eyebrow spec
   now, on the Eyebrow face. The lib hard-codes both families, so they are
   corrected here rather than through a token.

   Both read the face token, which is what keeps decorative mode working:
   core.css re-points --Font-Family-Eyebrow at the Display face inside
   [data-decorative], on a higher-specificity selector.
--------------------------------------------------------------------------- */
.typography.typography-display-large,
.typography.typography-display-medium,
.typography.typography-display-small {
  font-family: var(--Font-Family-Display);
}

.typography.typography-overline,
.typography.typography-overline-small,
.typography.typography-overline-medium,
.typography.typography-overline-large {
  font-family: var(--Font-Family-Eyebrow);
}

/* ---------------------------------------------------------------------------
   Prose lists — opt in with .typography-list on the <ul> or <ol>.

   The marker takes --Eyebrow: the accent that is already ROTATED off the
   surface's palette (Primary->Secondary, Secondary->Tertiary, and so on), so a
   list picks up the same accent as the eyebrow above it instead of the page
   inventing one. The list TEXT is untouched and stays on --Text; only the
   bullet or number is accented.

   Opt-in, not a bare li::marker rule, for the same reason nothing else here
   styles bare elements: importing the CSS must not repaint lists in a
   consumer's app that never asked for it.

   ::marker only honours a short list of properties. color is one of them;
   background, padding and size are not, so a bullet that needs a custom size
   still needs the ::before technique.
--------------------------------------------------------------------------- */
.typography-list > li::marker {
  color: var(--Eyebrow);
}

/* ---------------------------------------------------------------------------
   Paragraph spacing — space only where one paragraph follows another, which is
   what the Figma token means.
--------------------------------------------------------------------------- */
.typography-caption + .typography-caption {
  margin-block-start: var(--Caption-Paragraph-Spacing);
}

.typography-legal + .typography-legal {
  margin-block-start: var(--Legal-Paragraph-Spacing);
}

/* ---------------------------------------------------------------------------
   Variable-font axes
   wght is deliberately absent — font-weight already carries it, and declaring
   it in both places lets the two disagree.
--------------------------------------------------------------------------- */
.typography-h1,
.typography-h2,
.typography-h3,
.typography-h4,
.typography-h5,
.typography-h6 {
  font-variation-settings: var(--Font-Variation-Header);
}