/* Type roles. Sizes/line-heights/tracking come from the Typescale variable collection
   (unitless floats in fig-tokens.css), multiplied to px here. */
:root {
  --type-display-large: var(--font-weight-regular) calc(var(--display-large-size) * 1px)/calc(var(--display-large-line-height) * 1px) var(--font-brand);
  --type-display-medium: var(--font-weight-regular) calc(var(--display-medium-size) * 1px)/calc(var(--display-medium-line-height) * 1px) var(--font-brand);
  --type-display-small: var(--font-weight-regular) calc(var(--display-small-size) * 1px)/calc(var(--display-small-line-height) * 1px) var(--font-brand);
}

.m3-display-large{font:var(--type-display-large);letter-spacing:calc(var(--display-large-tracking) * 1px);color:var(--text-heading)}
.m3-display-medium{font:var(--type-display-medium);letter-spacing:calc(var(--display-medium-tracking) * 1px);color:var(--text-heading)}
.m3-display-small{font:var(--type-display-small);letter-spacing:calc(var(--display-small-tracking) * 1px);color:var(--text-heading)}

.m3-headline-large{font:var(--font-weight-regular) calc(var(--headline-large-size) * 1px)/calc(var(--headline-large-line-height) * 1px) var(--font-brand);letter-spacing:calc(var(--headline-large-tracking) * 1px);color:var(--text-heading)}
.m3-headline-medium{font:var(--font-weight-regular) calc(var(--headline-medium-size) * 1px)/calc(var(--headline-medium-line-height) * 1px) var(--font-brand);letter-spacing:calc(var(--headline-medium-tracking) * 1px);color:var(--text-heading)}
.m3-headline-small{font:var(--font-weight-regular) calc(var(--headline-small-size) * 1px)/calc(var(--headline-small-line-height) * 1px) var(--font-brand);letter-spacing:calc(var(--headline-small-tracking) * 1px);color:var(--text-heading)}

.m3-title-large{font:var(--font-weight-regular) calc(var(--title-large-size) * 1px)/calc(var(--title-large-line-height) * 1px) var(--font-brand);letter-spacing:calc(var(--title-large-tracking) * 1px);color:var(--text-heading)}
.m3-title-medium{font:var(--font-weight-medium) calc(var(--title-medium-size) * 1px)/calc(var(--title-medium-line-height) * 1px) var(--font-plain);letter-spacing:calc(var(--title-medium-tracking) * 1px);color:var(--text-heading)}
.m3-title-small{font:var(--font-weight-medium) calc(var(--title-small-size) * 1px)/calc(var(--title-small-line-height) * 1px) var(--font-plain);letter-spacing:calc(var(--title-small-tracking) * 1px);color:var(--text-heading)}

.m3-body-large{font:var(--font-weight-regular) calc(var(--body-large-size) * 1px)/calc(var(--body-large-line-height) * 1px) var(--font-plain);letter-spacing:calc(var(--body-large-tracking) * 1px);color:var(--text-body)}
.m3-body-medium{font:var(--font-weight-regular) calc(var(--body-medium-size) * 1px)/calc(var(--body-medium-line-height) * 1px) var(--font-plain);letter-spacing:calc(var(--body-medium-tracking) * 1px);color:var(--text-body)}
.m3-body-small{font:var(--font-weight-regular) calc(var(--body-small-size) * 1px)/calc(var(--body-small-line-height) * 1px) var(--font-plain);letter-spacing:calc(var(--body-small-tracking) * 1px);color:var(--text-muted)}

.m3-label-large{font:var(--font-weight-medium) calc(var(--label-large-size) * 1px)/calc(var(--label-large-line-height) * 1px) var(--font-plain);letter-spacing:calc(var(--label-large-tracking) * 1px)}
.m3-label-medium{font:var(--font-weight-medium) calc(var(--label-medium-size) * 1px)/calc(var(--label-medium-line-height) * 1px) var(--font-plain);letter-spacing:calc(var(--label-medium-tracking) * 1px)}
.m3-label-small{font:var(--font-weight-medium) calc(var(--label-small-size) * 1px)/calc(var(--label-small-line-height) * 1px) var(--font-plain);letter-spacing:calc(var(--label-small-tracking) * 1px)}

/* Mono — the file specifies one mono role: Roboto Mono 14/20, +0.25 tracking */
.m3-mono-medium{font:400 14px/20px var(--font-mono);letter-spacing:.25px;color:var(--text-body)}
