html {
	--typo-Default-font-size: var(--typo-size-base);
	--typo-Default-line-height: 1.6;

	--typo-weight-strong: 600;

	--typo-headline-font-family: var(--typo-font-primary);

	/* Headline styles - Shorthand */
	--typo-headline-4xl: 600 var(--typo-size-4xl) / 1.3 var(--typo-font-primary);
	--typo-headline-3xl: 700 var(--typo-size-3xl) / 1.3 var(--typo-font-primary);
	--typo-headline-2xl: 700 var(--typo-size-2xl) / 1.3 var(--typo-font-primary);
	--typo-headline-xl: 700 var(--typo-size-xl) / 1.3 var(--typo-font-primary);
	--typo-headline-l: 700 var(--typo-size-l) / 1.3 var(--typo-font-primary);
	--typo-headline-m: 700 var(--typo-size-m) / 1.3 var(--typo-font-primary);
	--typo-headline-base: 700 var(--typo-size-base) / 1.3 var(--typo-font-primary);
	--typo-headline-s: 600 var(--typo-size-m) / 1.3 var(--typo-font-primary);
	--typo-headline-xs: 600 var(--typo-size-base) / 1.3 var(--typo-font-primary);
	--typo-headline-2xs: 700 var(--typo-size-xs) / 1.3 var(--typo-font-primary);

	/* Text styles using the sans-serif font face */
	--typo-text-base-primary: 400 var(--typo-size-base) /
		var(--typo-body-content-line-height) var(--typo-font-primary);
	--typo-text-s-primary: 400 var(--typo-size-s) /
		var(--typo-body-interactive-line-height) var(--typo-font-primary);

	/* uses the serif font face */
	--typo-text-l: 400 var(--typo-size-l) / var(--typo-body-content-line-height)
		var(--typo-font-secondary);
	--typo-text-m: 400 var(--typo-size-m) / var(--typo-body-content-line-height)
		var(--typo-font-secondary);
	--typo-text-base: 400 var(--typo-size-base) /
		var(--typo-body-content-line-height) var(--typo-font-secondary);
	--typo-text-s: 400 var(--typo-size-s) / var(--typo-body-content-line-height)
		var(--typo-font-secondary);

	--typo-text-5xl: 500 var(--typo-size-5xl) /
		var(--typo-body-content-line-height) var(--typo-font-secondary);

	--typo-text-l-primary: 400 var(--typo-size-l) / 1.3 var(--typo-font-primary);

	--typo-primary-s: 400 var(--typo-size-s) / 1.2 var(--typo-font-primary);
	--typo-primary-xs: 400 var(--typo-size-xs) / 1.2 var(--typo-font-primary);
	--typo-primary-2xs: 400 var(--typo-size-2xs) / 1.2 var(--typo-font-primary);

	/* Interactive */
	--typo-interactive-base: 600 var(--typo-size-base) / 1.2
		var(--typo-font-primary);
	--typo-interactive-s: 600 var(--typo-size-s) / 1.2 var(--typo-font-primary);
	--typo-interactive-xs: 600 var(--typo-size-xs) / 1.2 var(--typo-font-primary);

	/* Compact styles */
	--typo-compact-m: 400 var(--typo-size-m) / 1.6 var(--typo-font-primary);
	--typo-compact-base: 400 var(--typo-size-base) / 1.3 var(--typo-font-primary);
	--typo-compact-s: 400 var(--typo-size-s) / 1.3 var(--typo-font-primary);
	--typo-compact-xs: 400 var(--typo-size-xs) / 1.3 var(--typo-font-primary);

	/* Body styles - using serif font */
	--typo-body-base: 400 var(--typo-size-base) / 1.6 var(--typo-font-secondary);
}
