@font-face{font-family:Neue Haas Grotesk Display Pro;src:url(/fonts/neue-haas-grotesk-display/HaasGrotDisp-15XXThin.woff2)format("woff2");font-weight:100;font-style:normal;font-display:swap}@font-face{font-family:Neue Haas Grotesk Display Pro;src:url(/fonts/neue-haas-grotesk-display/HaasGrotDisp-16XXThinItalic.woff2)format("woff2");font-weight:100;font-style:italic;font-display:swap}@font-face{font-family:Neue Haas Grotesk Display Pro;src:url(/fonts/neue-haas-grotesk-display/HaasGrotDisp-25XThin.woff2)format("woff2");font-weight:200;font-style:normal;font-display:swap}@font-face{font-family:Neue Haas Grotesk Display Pro;src:url(/fonts/neue-haas-grotesk-display/HaasGrotDisp-26XThinItalic.woff2)format("woff2");font-weight:200;font-style:italic;font-display:swap}@font-face{font-family:Neue Haas Grotesk Display Pro;src:url(/fonts/neue-haas-grotesk-display/HaasGrotDisp-35Thin.woff2)format("woff2");font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:Neue Haas Grotesk Display Pro;src:url(/fonts/neue-haas-grotesk-display/HaasGrotDisp-36ThinItalic.woff2)format("woff2");font-weight:300;font-style:italic;font-display:swap}@font-face{font-family:Neue Haas Grotesk Display Pro;src:url(/fonts/neue-haas-grotesk-display/HaasGrotDisp-45Light.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Neue Haas Grotesk Display Pro;src:url(/fonts/neue-haas-grotesk-display/HaasGrotDisp-46LightItalic.woff2)format("woff2");font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:Neue Haas Grotesk Display Pro;src:url(/fonts/neue-haas-grotesk-display/HaasGrotDisp-55Roman.woff2)format("woff2");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:Neue Haas Grotesk Display Pro;src:url(/fonts/neue-haas-grotesk-display/HaasGrotDisp-56Italic.woff2)format("woff2");font-weight:500;font-style:italic;font-display:swap}@font-face{font-family:Neue Haas Grotesk Display Pro;src:url(/fonts/neue-haas-grotesk-display/HaasGrotDisp-65Medium.woff2)format("woff2");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:Neue Haas Grotesk Display Pro;src:url(/fonts/neue-haas-grotesk-display/HaasGrotDisp-66MediumItalic.woff2)format("woff2");font-weight:600;font-style:italic;font-display:swap}@font-face{font-family:Neue Haas Grotesk Display Pro;src:url(/fonts/neue-haas-grotesk-display/HaasGrotDisp-75Bold.woff2)format("woff2");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Neue Haas Grotesk Display Pro;src:url(/fonts/neue-haas-grotesk-display/HaasGrotDisp-76BoldItalic.woff2)format("woff2");font-weight:700;font-style:italic;font-display:swap}@font-face{font-family:Neue Haas Grotesk Display Pro;src:url(/fonts/neue-haas-grotesk-display/HaasGrotDisp-95Black.woff2)format("woff2");font-weight:900;font-style:normal;font-display:swap}@font-face{font-family:Neue Haas Grotesk Display Pro;src:url(/fonts/neue-haas-grotesk-display/HaasGrotDisp-96BlackItalic.woff2)format("woff2");font-weight:900;font-style:italic;font-display:swap}:root{--color-midnight:#020a3d;--color-midnight-100:#020a3d;--color-midnight-90:#020a3de6;--color-midnight-80:#020a3dcc;--color-midnight-70:#020a3db3;--color-midnight-60:#020a3d99;--color-midnight-50:#020a3d80;--color-midnight-40:#020a3d66;--color-midnight-30:#020a3d4d;--color-midnight-20:#020a3d33;--color-midnight-10:#020a3d1a;--color-midnight-5:#020a3d0d;--color-midnight-0:#020a3d00;--color-electric-blue:#0114c3;--color-electric-blue-100:#0114c3;--color-electric-blue-90:#0114c3e6;--color-electric-blue-80:#0114c3cc;--color-electric-blue-70:#0114c3b3;--color-electric-blue-60:#0114c399;--color-electric-blue-50:#0114c380;--color-electric-blue-40:#0114c366;--color-electric-blue-30:#0114c34d;--color-electric-blue-20:#0114c333;--color-electric-blue-10:#0114c31a;--color-electric-blue-5:#0114c30d;--color-electric-blue-0:#0114c300;--color-plasma-pink:#ff42e6;--color-plasma-pink-100:#ff42e6;--color-plasma-pink-90:#ff42e6e6;--color-plasma-pink-80:#ff42e6cc;--color-plasma-pink-70:#ff42e6b3;--color-plasma-pink-60:#ff42e699;--color-plasma-pink-50:#ff42e680;--color-plasma-pink-40:#ff42e666;--color-plasma-pink-30:#ff42e64d;--color-plasma-pink-20:#ff42e633;--color-plasma-pink-10:#ff42e61a;--color-plasma-pink-5:#ff42e60d;--color-plasma-pink-0:#ff42e600;--color-pink-haze:#fff4fd;--color-pink-haze-100:#fff4fd;--color-pink-haze-90:#fff4fde6;--color-pink-haze-80:#fff4fdcc;--color-pink-haze-70:#fff4fdb3;--color-pink-haze-60:#fff4fd99;--color-pink-haze-50:#fff4fd80;--color-pink-haze-40:#fff4fd66;--color-pink-haze-30:#fff4fd4d;--color-pink-haze-20:#fff4fd33;--color-pink-haze-10:#fff4fd1a;--color-pink-haze-5:#fff4fd0d;--color-pink-haze-0:#fff4fd00;--color-graphite:#686a6e;--color-graphite-100:#686a6e;--color-graphite-90:#686a6ee6;--color-graphite-80:#686a6ecc;--color-graphite-70:#686a6eb3;--color-graphite-60:#686a6e99;--color-graphite-50:#686a6e80;--color-graphite-40:#686a6e66;--color-graphite-30:#686a6e4d;--color-graphite-20:#686a6e33;--color-graphite-10:#686a6e1a;--color-graphite-5:#686a6e0d;--color-graphite-0:#686a6e00;--color-black:#000;--color-white:#fff;--font-family-heading:"Neue Haas Grotesk Display Pro", system-ui, sans-serif;--font-family-body:"Neue Haas Grotesk Display Pro", system-ui, sans-serif;--font-family-mono:"Atkinson Hyperlegible Mono", ui-monospace, monospace;--font-weight-xxthin:100;--font-weight-xthin:200;--font-weight-thin:300;--font-weight-light:400;--font-weight-regular:500;--font-weight-medium:600;--font-weight-semi:600;--font-weight-bold:700;--font-weight-heavy:900;--font-weight-black:900;--text-big-l-family:var(--font-family-heading);--text-big-l-size:300px;--text-big-l-line-height:.9;--text-big-l-letter-spacing:-3px;--text-big-l-weight:500;--text-display-l-family:var(--font-family-heading);--text-display-l-size:170px;--text-display-l-line-height:.9;--text-display-l-letter-spacing:-3px;--text-display-l-weight:500;--text-display-s-family:var(--font-family-heading);--text-display-s-size:120px;--text-display-s-line-height:.9;--text-display-s-letter-spacing:-3px;--text-display-s-weight:500;--text-headline-l-family:var(--font-family-heading);--text-headline-l-size:90px;--text-headline-l-line-height:1;--text-headline-l-letter-spacing:-2px;--text-headline-l-weight:500;--text-headline-s-family:var(--font-family-heading);--text-headline-s-size:70px;--text-headline-s-line-height:1;--text-headline-s-letter-spacing:-1px;--text-headline-s-weight:500;--text-title-l-family:var(--font-family-heading);--text-title-l-size:52px;--text-title-l-line-height:1.3;--text-title-l-letter-spacing:0px;--text-title-l-weight:500;--text-title-s-family:var(--font-family-heading);--text-title-s-size:32px;--text-title-s-line-height:1.4;--text-title-s-letter-spacing:0px;--text-title-s-weight:500;--text-body-l-family:var(--font-family-body);--text-body-l-size:24px;--text-body-l-line-height:1.4;--text-body-l-letter-spacing:.75px;--text-body-l-weight:500;--text-body-s-family:var(--font-family-body);--text-body-s-size:16px;--text-body-s-line-height:1.4;--text-body-s-letter-spacing:.75px;--text-body-s-weight:500;--text-caption-l-family:var(--font-family-mono);--text-caption-l-size:14px;--text-caption-l-line-height:1.4;--text-caption-l-letter-spacing:0px;--text-caption-l-weight:400;--text-caption-s-family:var(--font-family-mono);--text-caption-s-size:10px;--text-caption-s-line-height:1.5;--text-caption-s-letter-spacing:0px;--text-caption-s-weight:400;--space-xxs:2px;--space-xs:4px;--space-s:8px;--space-sm:16px;--space-m:24px;--space-l:32px;--space-xl:40px;--space-xxl:48px;--space-huge:56px;--space-uber:64px;--space-col:155px;--space-colx2:310px;--radius-xs:4px;--radius-s:8px;--radius-m:16px;--radius-l:24px;--radius-round:9999px;--shadow-app-dropdown:0px 0px 0px .877px #0000000a, 0px .877px .877px -.438px #2a33450a, 0px 2.63px 2.63px -1.315px #2a33460a, 0px 5.261px 5.261px -2.63px #2a33460a, 0px 10.521px 10.521px -5.261px #0e3f7e0a, 0px 21.043px 21.043px -10.521px #0003}.text-big-l{font-family:var(--text-big-l-family);font-size:var(--text-big-l-size);line-height:var(--text-big-l-line-height);letter-spacing:var(--text-big-l-letter-spacing);font-weight:var(--text-big-l-weight)}.text-display-l{font-family:var(--text-display-l-family);font-size:var(--text-display-l-size);line-height:var(--text-display-l-line-height);letter-spacing:var(--text-display-l-letter-spacing);font-weight:var(--text-display-l-weight)}.text-display-s{font-family:var(--text-display-s-family);font-size:var(--text-display-s-size);line-height:var(--text-display-s-line-height);letter-spacing:var(--text-display-s-letter-spacing);font-weight:var(--text-display-s-weight)}.text-headline-l{font-family:var(--text-headline-l-family);font-size:var(--text-headline-l-size);line-height:var(--text-headline-l-line-height);letter-spacing:var(--text-headline-l-letter-spacing);font-weight:var(--text-headline-l-weight)}.text-headline-s{font-family:var(--text-headline-s-family);font-size:var(--text-headline-s-size);line-height:var(--text-headline-s-line-height);letter-spacing:var(--text-headline-s-letter-spacing);font-weight:var(--text-headline-s-weight)}.text-title-l{font-family:var(--text-title-l-family);font-size:var(--text-title-l-size);line-height:var(--text-title-l-line-height);letter-spacing:var(--text-title-l-letter-spacing);font-weight:var(--text-title-l-weight)}.text-title-s{font-family:var(--text-title-s-family);font-size:var(--text-title-s-size);line-height:var(--text-title-s-line-height);letter-spacing:var(--text-title-s-letter-spacing);font-weight:var(--text-title-s-weight)}.text-body-l{font-family:var(--text-body-l-family);font-size:var(--text-body-l-size);line-height:var(--text-body-l-line-height);letter-spacing:var(--text-body-l-letter-spacing);font-weight:var(--text-body-l-weight)}.text-body-s{font-family:var(--text-body-s-family);font-size:var(--text-body-s-size);line-height:var(--text-body-s-line-height);letter-spacing:var(--text-body-s-letter-spacing);font-weight:var(--text-body-s-weight)}.text-caption-l{font-family:var(--text-caption-l-family);font-size:var(--text-caption-l-size);line-height:var(--text-caption-l-line-height);letter-spacing:var(--text-caption-l-letter-spacing);font-weight:var(--text-caption-l-weight);text-transform:uppercase}.text-caption-s{font-family:var(--text-caption-s-family);font-size:var(--text-caption-s-size);line-height:var(--text-caption-s-line-height);letter-spacing:var(--text-caption-s-letter-spacing);font-weight:var(--text-caption-s-weight);text-transform:uppercase}:root{--doc-ink:#1a1a1a;--doc-muted:#5c5c5c;--doc-subtle:#8a8a8a;--doc-rule:#e3e3e3;--doc-fill:#f5f5f5;--doc-family-rule:var(--color-midnight-20)}*,:before,:after{box-sizing:border-box}body{background:var(--color-white);color:var(--doc-ink);font-family:var(--font-family-body);-webkit-font-smoothing:antialiased;margin:0}p,h1,h2{margin:0}.foundations{max-width:1200px;padding:var(--space-uber);margin-inline:auto}.foundations__header{margin-bottom:var(--space-uber)}.foundations__title{font-family:var(--text-display-s-family);font-size:var(--text-display-s-size);line-height:var(--text-display-s-line-height);letter-spacing:var(--text-display-s-letter-spacing);font-weight:var(--text-display-s-weight);color:var(--color-black)}.foundations__body,.section{flex-direction:column;gap:36px;display:flex}.section--spacing,.section--elevation{gap:28px}.section--icons{margin-top:var(--space-uber);gap:var(--space-uber)}.head-row{padding-bottom:var(--space-sm);border-bottom:1px solid var(--doc-rule)}.head-row--flush{padding-bottom:0}.head-row__title{font-family:var(--text-title-l-family);font-size:var(--text-title-l-size);line-height:var(--text-title-l-line-height);letter-spacing:var(--text-title-l-letter-spacing);font-weight:var(--text-title-l-weight);color:var(--doc-ink)}.group{flex-direction:column;gap:14px;display:flex}.group--ramps{gap:28px}.group--families,.group--weights{gap:20px}.group__label{font-family:var(--text-caption-l-family);font-size:var(--text-caption-l-size);line-height:var(--text-caption-l-line-height);font-weight:var(--text-caption-l-weight);text-transform:uppercase;color:var(--doc-ink)}.ramp{align-items:flex-start;display:flex;overflow-x:auto}.ramp__primary,.ramp__sub{background:var(--color-white);flex:none;height:285px;position:relative}.ramp__primary{border-radius:var(--radius-l) 0 0 var(--radius-l);width:219px;padding:12px 18px 0}.ramp__sub{width:72px;padding-top:12px}.ramp__sub:last-child{border-radius:0 var(--radius-l) var(--radius-l) 0}.ramp__chip{border-radius:12px;height:195px}.ramp__chip--primary{width:195px;margin-left:-6px}.ramp__chip--sub{width:60px}.ramp__name,.ramp__step{font-family:var(--text-caption-l-family);font-size:var(--text-caption-l-size);line-height:var(--text-caption-l-line-height);font-weight:var(--text-caption-l-weight);text-transform:uppercase;color:var(--color-black)}.ramp__name{margin-top:18px}.ramp__step{text-align:center;opacity:.6;width:60px;margin-top:18px}.ramp__step--primary{text-align:right;width:auto;margin:0;position:absolute;top:225px;right:18px}.ramp__hex{font-family:var(--text-caption-s-family);font-size:var(--text-caption-s-size);line-height:var(--text-caption-s-line-height);font-weight:var(--text-caption-s-weight);text-transform:uppercase;color:var(--color-black);opacity:.6;margin-top:4px}.families{gap:0 var(--space-m);grid-template-columns:repeat(3,1fr);display:grid}.family-card{border-top:2px solid var(--doc-family-rule);flex-direction:column;align-items:flex-start;gap:12px;padding-top:14px;display:flex}.family-card__sample{font-family:var(--font-family-heading);font-size:var(--text-title-l-size);line-height:var(--text-title-l-line-height);font-weight:var(--font-weight-regular)}.family-card--mono .family-card__sample{font-family:var(--font-family-mono);font-weight:400;line-height:1}.family-card__name{font-family:var(--text-body-l-family);font-size:var(--text-body-l-size);line-height:var(--text-body-l-line-height);letter-spacing:var(--text-body-l-letter-spacing);font-weight:var(--text-body-l-weight)}.family-card__token{font-family:var(--text-caption-l-family);font-size:var(--text-caption-l-size);line-height:var(--text-caption-l-line-height);font-weight:var(--text-caption-l-weight);text-transform:uppercase;color:var(--doc-muted)}.scale{flex-direction:column;gap:14px;display:flex}.scale-row{align-items:flex-start;gap:var(--space-l);border-bottom:1px solid var(--doc-rule);padding:14px 0 13px;display:flex;overflow:hidden}.scale-row__label{gap:var(--space-xxs);flex-direction:column;flex:0 0 200px;display:flex}.scale-row__token,.weight-card__token,.spacing-row__token,.shadow-row__token,.radius-card__token{font-family:var(--text-body-s-family);font-size:var(--text-body-s-size);line-height:var(--text-body-s-line-height);letter-spacing:var(--text-body-s-letter-spacing);font-weight:var(--text-body-s-weight);color:var(--doc-ink);white-space:nowrap}.scale-row__specs,.weight-card__style,.spacing-row__value,.shadow-row__summary,.radius-card__value{font-family:var(--text-caption-s-family);font-size:var(--text-caption-s-size);line-height:var(--text-caption-s-line-height);font-weight:var(--text-caption-s-weight);text-transform:uppercase;color:var(--doc-subtle)}.scale-row__sample{color:var(--doc-ink);white-space:nowrap}.weights{gap:var(--space-m);grid-template-columns:repeat(4,250px);display:grid}.weight-card{align-items:flex-start;gap:var(--space-s);background:var(--doc-fill);flex-direction:column;padding:20px;display:flex}.weight-card__sample{font-family:var(--font-family-heading);font-size:var(--text-title-s-size);line-height:1.2}.spacing{flex-direction:column;gap:28px;display:flex}.spacing-row{align-items:center;gap:var(--space-m);border-bottom:1px solid var(--doc-rule);padding:10px 0 9px;display:flex}.spacing-row__token{flex:0 0 120px}.spacing-row__value{color:var(--doc-muted);flex:0 0 60px}.spacing-row__track{background:var(--doc-fill);flex:0 320px;height:14px;display:flex;overflow:hidden}.spacing-row__bar{width:calc(var(--bar) * 32 / 31);background:var(--doc-ink);flex:none;height:100%}.shadow-row{align-items:flex-start;gap:var(--space-l);display:flex}.shadow-row__stage{min-height:260px;padding:var(--space-xxl);background-image:radial-gradient(circle, var(--color-black) 1px, transparent 1.5px);background-position:8px 8px;background-size:16px 16px;flex:0 0 420px;justify-content:center;align-items:center;display:flex}.shadow-card{width:320px;padding:var(--space-m);background:var(--color-white);border-radius:var(--radius-xs);box-shadow:var(--shadow-app-dropdown);font-family:var(--font-family-body);font-size:var(--text-body-s-size);line-height:var(--text-body-s-line-height);flex-direction:column;gap:6px;display:flex}.shadow-card__title{font-weight:var(--font-weight-bold);color:var(--doc-ink)}.shadow-card__desc{font-weight:var(--font-weight-regular);letter-spacing:var(--text-body-s-letter-spacing);color:var(--doc-subtle);text-wrap:balance}.shadow-row__info{gap:var(--space-s);flex-direction:column;max-width:300px;display:flex}.shadow-row__summary{color:var(--doc-muted)}.radii{gap:0 var(--space-m);flex-wrap:wrap;display:flex}.radius-card{flex-direction:column;align-items:flex-start;gap:10px;width:250px;display:flex}.radius-card__rect{background:var(--doc-fill);border:1px solid var(--doc-rule);width:250px;height:104px}.pixel-icons{flex-wrap:wrap;align-items:center;gap:68px;padding:21px;display:flex}.pixel-icons__icon{flex:none;display:block}.pixel-icons__icon--bleed{margin:-1px}@media (width<=1100px){.foundations{padding:var(--space-l) var(--space-sm)}.foundations__title{font-size:min(var(--text-display-s-size), 16vw)}.families,.weights{row-gap:var(--space-m);grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}.shadow-row{flex-direction:column}.shadow-row__stage{flex-basis:auto;width:100%}.scale-row{gap:var(--space-s);flex-direction:column}.scale-row__label{flex-basis:auto}.scale-row__sample.text-big-l,.scale-row__sample.text-display-l{font-size:min(var(--text-display-l-size), 30vw)}.spacing-row__token{flex-basis:88px}}
