/* Typography — Manrope. Rules from Design Manual 5.1 / 5.2.
   Headlines: Medium or Bold, tracking -30 (=-0.03em), leading x1.07, left aligned, sentence case.
   Copy: Regular, tracking 0, leading x1.4, left aligned.  Emphasis: Bold. */
:root{
--font-sans:"Manrope","Manrope Static",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
--font-display:var(--font-sans);
--font-body:var(--font-sans);
--font-mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,monospace;

--weight-light:300;
--weight-regular:400;
--weight-medium:500;
--weight-semibold:600;
--weight-bold:700;
--weight-extrabold:800;

--tracking-headline:-0.03em;
--tracking-display:-0.035em;
--tracking-body:0em;
--tracking-overline:0.08em;

--leading-headline:1.07;
--leading-body:1.4;
--leading-tight:1.2;

/* Type scale */
--text-display-1:88px;
--text-display-2:64px;
--text-h1:48px;
--text-h2:36px;
--text-h3:28px;
--text-h4:22px;
--text-h5:18px;
--text-body-lg:18px;
--text-body:16px;
--text-body-sm:14px;
--text-caption:12px;
--text-overline:11px;

/* Composed roles */
--type-display-1:var(--weight-bold) var(--text-display-1)/var(--leading-headline) var(--font-display);
--type-display-2:var(--weight-bold) var(--text-display-2)/var(--leading-headline) var(--font-display);
--type-h1:var(--weight-bold) var(--text-h1)/var(--leading-headline) var(--font-display);
--type-h2:var(--weight-medium) var(--text-h2)/var(--leading-headline) var(--font-display);
--type-h3:var(--weight-medium) var(--text-h3)/var(--leading-headline) var(--font-display);
--type-h4:var(--weight-semibold) var(--text-h4)/var(--leading-tight) var(--font-display);
--type-body-lg:var(--weight-regular) var(--text-body-lg)/var(--leading-body) var(--font-body);
--type-body:var(--weight-regular) var(--text-body)/var(--leading-body) var(--font-body);
--type-body-sm:var(--weight-regular) var(--text-body-sm)/var(--leading-body) var(--font-body);
--type-caption:var(--weight-medium) var(--text-caption)/var(--leading-body) var(--font-body);
--type-overline:var(--weight-bold) var(--text-overline)/var(--leading-body) var(--font-body);
--type-label:var(--weight-semibold) var(--text-body-sm)/var(--leading-tight) var(--font-body);
}