/* MD3 type scale. Source: references/typography-and-shape.md § Baseline Type Scale.
   Two typeface roles: brand (display + headline) and plain (title, body, label). */
:root{
  --md-ref-typeface-brand: 'Roboto Flex', 'Roboto', system-ui, sans-serif;
  --md-ref-typeface-plain: 'Roboto Flex', 'Roboto', system-ui, sans-serif;
  --md-sys-typescale-display-large-font: var(--md-ref-typeface-brand);
  --md-sys-typescale-display-large-weight: 400; /* @kind other */
  --md-sys-typescale-display-large-size: 3.5625rem;
  --md-sys-typescale-display-large-line-height: 4rem; /* @kind other */
  --md-sys-typescale-display-large-tracking: -0.015625rem; /* @kind other */
  --md-sys-typescale-display-large: 400 3.5625rem/4rem var(--md-ref-typeface-brand);
  --md-sys-typescale-display-medium-font: var(--md-ref-typeface-brand);
  --md-sys-typescale-display-medium-weight: 400; /* @kind other */
  --md-sys-typescale-display-medium-size: 2.8125rem;
  --md-sys-typescale-display-medium-line-height: 3.25rem; /* @kind other */
  --md-sys-typescale-display-medium-tracking: 0rem; /* @kind other */
  --md-sys-typescale-display-medium: 400 2.8125rem/3.25rem var(--md-ref-typeface-brand);
  --md-sys-typescale-display-small-font: var(--md-ref-typeface-brand);
  --md-sys-typescale-display-small-weight: 400; /* @kind other */
  --md-sys-typescale-display-small-size: 2.25rem;
  --md-sys-typescale-display-small-line-height: 2.75rem; /* @kind other */
  --md-sys-typescale-display-small-tracking: 0rem; /* @kind other */
  --md-sys-typescale-display-small: 400 2.25rem/2.75rem var(--md-ref-typeface-brand);
  --md-sys-typescale-headline-large-font: var(--md-ref-typeface-brand);
  --md-sys-typescale-headline-large-weight: 400; /* @kind other */
  --md-sys-typescale-headline-large-size: 2rem;
  --md-sys-typescale-headline-large-line-height: 2.5rem; /* @kind other */
  --md-sys-typescale-headline-large-tracking: 0rem; /* @kind other */
  --md-sys-typescale-headline-large: 400 2rem/2.5rem var(--md-ref-typeface-brand);
  --md-sys-typescale-headline-medium-font: var(--md-ref-typeface-brand);
  --md-sys-typescale-headline-medium-weight: 400; /* @kind other */
  --md-sys-typescale-headline-medium-size: 1.75rem;
  --md-sys-typescale-headline-medium-line-height: 2.25rem; /* @kind other */
  --md-sys-typescale-headline-medium-tracking: 0rem; /* @kind other */
  --md-sys-typescale-headline-medium: 400 1.75rem/2.25rem var(--md-ref-typeface-brand);
  --md-sys-typescale-headline-small-font: var(--md-ref-typeface-brand);
  --md-sys-typescale-headline-small-weight: 400; /* @kind other */
  --md-sys-typescale-headline-small-size: 1.5rem;
  --md-sys-typescale-headline-small-line-height: 2rem; /* @kind other */
  --md-sys-typescale-headline-small-tracking: 0rem; /* @kind other */
  --md-sys-typescale-headline-small: 400 1.5rem/2rem var(--md-ref-typeface-brand);
  --md-sys-typescale-title-large-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-title-large-weight: 400; /* @kind other */
  --md-sys-typescale-title-large-size: 1.375rem;
  --md-sys-typescale-title-large-line-height: 1.75rem; /* @kind other */
  --md-sys-typescale-title-large-tracking: 0rem; /* @kind other */
  --md-sys-typescale-title-large: 400 1.375rem/1.75rem var(--md-ref-typeface-plain);
  --md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-title-medium-weight: 500; /* @kind other */
  --md-sys-typescale-title-medium-size: 1rem;
  --md-sys-typescale-title-medium-line-height: 1.5rem; /* @kind other */
  --md-sys-typescale-title-medium-tracking: 0.009375rem; /* @kind other */
  --md-sys-typescale-title-medium: 500 1rem/1.5rem var(--md-ref-typeface-plain);
  --md-sys-typescale-title-small-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-title-small-weight: 500; /* @kind other */
  --md-sys-typescale-title-small-size: 0.875rem;
  --md-sys-typescale-title-small-line-height: 1.25rem; /* @kind other */
  --md-sys-typescale-title-small-tracking: 0.00625rem; /* @kind other */
  --md-sys-typescale-title-small: 500 0.875rem/1.25rem var(--md-ref-typeface-plain);
  --md-sys-typescale-body-large-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-body-large-weight: 400; /* @kind other */
  --md-sys-typescale-body-large-size: 1rem;
  --md-sys-typescale-body-large-line-height: 1.5rem; /* @kind other */
  --md-sys-typescale-body-large-tracking: 0.03125rem; /* @kind other */
  --md-sys-typescale-body-large: 400 1rem/1.5rem var(--md-ref-typeface-plain);
  --md-sys-typescale-body-medium-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-body-medium-weight: 400; /* @kind other */
  --md-sys-typescale-body-medium-size: 0.875rem;
  --md-sys-typescale-body-medium-line-height: 1.25rem; /* @kind other */
  --md-sys-typescale-body-medium-tracking: 0.015625rem; /* @kind other */
  --md-sys-typescale-body-medium: 400 0.875rem/1.25rem var(--md-ref-typeface-plain);
  --md-sys-typescale-body-small-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-body-small-weight: 400; /* @kind other */
  --md-sys-typescale-body-small-size: 0.75rem;
  --md-sys-typescale-body-small-line-height: 1rem; /* @kind other */
  --md-sys-typescale-body-small-tracking: 0.025rem; /* @kind other */
  --md-sys-typescale-body-small: 400 0.75rem/1rem var(--md-ref-typeface-plain);
  --md-sys-typescale-label-large-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-label-large-weight: 500; /* @kind other */
  --md-sys-typescale-label-large-size: 0.875rem;
  --md-sys-typescale-label-large-line-height: 1.25rem; /* @kind other */
  --md-sys-typescale-label-large-tracking: 0.00625rem; /* @kind other */
  --md-sys-typescale-label-large: 500 0.875rem/1.25rem var(--md-ref-typeface-plain);
  --md-sys-typescale-label-medium-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-label-medium-weight: 500; /* @kind other */
  --md-sys-typescale-label-medium-size: 0.75rem;
  --md-sys-typescale-label-medium-line-height: 1rem; /* @kind other */
  --md-sys-typescale-label-medium-tracking: 0.03125rem; /* @kind other */
  --md-sys-typescale-label-medium: 500 0.75rem/1rem var(--md-ref-typeface-plain);
  --md-sys-typescale-label-small-font: var(--md-ref-typeface-plain);
  --md-sys-typescale-label-small-weight: 500; /* @kind other */
  --md-sys-typescale-label-small-size: 0.6875rem;
  --md-sys-typescale-label-small-line-height: 1rem; /* @kind other */
  --md-sys-typescale-label-small-tracking: 0.03125rem; /* @kind other */
  --md-sys-typescale-label-small: 500 0.6875rem/1rem var(--md-ref-typeface-plain);

  /* Emphasized variants — same metrics, higher weight (Expressive update). */
  --md-sys-typescale-emphasized-display-large-weight: 500; /* @kind other */
  --md-sys-typescale-emphasized-display-large: 500 3.5625rem/4rem var(--md-ref-typeface-brand);
  --md-sys-typescale-emphasized-display-medium-weight: 500; /* @kind other */
  --md-sys-typescale-emphasized-display-medium: 500 2.8125rem/3.25rem var(--md-ref-typeface-brand);
  --md-sys-typescale-emphasized-display-small-weight: 500; /* @kind other */
  --md-sys-typescale-emphasized-display-small: 500 2.25rem/2.75rem var(--md-ref-typeface-brand);
  --md-sys-typescale-emphasized-headline-large-weight: 500; /* @kind other */
  --md-sys-typescale-emphasized-headline-large: 500 2rem/2.5rem var(--md-ref-typeface-brand);
  --md-sys-typescale-emphasized-headline-medium-weight: 500; /* @kind other */
  --md-sys-typescale-emphasized-headline-medium: 500 1.75rem/2.25rem var(--md-ref-typeface-brand);
  --md-sys-typescale-emphasized-headline-small-weight: 500; /* @kind other */
  --md-sys-typescale-emphasized-headline-small: 500 1.5rem/2rem var(--md-ref-typeface-brand);
  --md-sys-typescale-emphasized-title-large-weight: 500; /* @kind other */
  --md-sys-typescale-emphasized-title-large: 500 1.375rem/1.75rem var(--md-ref-typeface-plain);
  --md-sys-typescale-emphasized-title-medium-weight: 700; /* @kind other */
  --md-sys-typescale-emphasized-title-medium: 700 1rem/1.5rem var(--md-ref-typeface-plain);
  --md-sys-typescale-emphasized-title-small-weight: 700; /* @kind other */
  --md-sys-typescale-emphasized-title-small: 700 0.875rem/1.25rem var(--md-ref-typeface-plain);
  --md-sys-typescale-emphasized-body-large-weight: 500; /* @kind other */
  --md-sys-typescale-emphasized-body-large: 500 1rem/1.5rem var(--md-ref-typeface-plain);
  --md-sys-typescale-emphasized-body-medium-weight: 500; /* @kind other */
  --md-sys-typescale-emphasized-body-medium: 500 0.875rem/1.25rem var(--md-ref-typeface-plain);
  --md-sys-typescale-emphasized-body-small-weight: 500; /* @kind other */
  --md-sys-typescale-emphasized-body-small: 500 0.75rem/1rem var(--md-ref-typeface-plain);
  --md-sys-typescale-emphasized-label-large-weight: 700; /* @kind other */
  --md-sys-typescale-emphasized-label-large: 700 0.875rem/1.25rem var(--md-ref-typeface-plain);
  --md-sys-typescale-emphasized-label-medium-weight: 700; /* @kind other */
  --md-sys-typescale-emphasized-label-medium: 700 0.75rem/1rem var(--md-ref-typeface-plain);
  --md-sys-typescale-emphasized-label-small-weight: 700; /* @kind other */
  --md-sys-typescale-emphasized-label-small: 700 0.6875rem/1rem var(--md-ref-typeface-plain);
}