@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("../fonts/manrope-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20CF;
}

@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("../fonts/manrope-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215;
}

@font-face {
  font-family: "DM Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/dm-mono-400-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20CF;
}

@font-face {
  font-family: "DM Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/dm-mono-400-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215;
}

@font-face {
  font-family: "DM Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/dm-mono-500-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20CF;
}

@font-face {
  font-family: "DM Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/dm-mono-500-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215;
}

:root {
  --font-sans: "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "DM Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --type-root: 100%;
  --type-label: .8rem;
  --type-button: .9rem;
  --type-help: .9rem;
  --type-status: .85rem;
  --type-body: .95rem;
  --type-body-large: 1.1rem;
  --type-card-title: 1.25rem;
  --type-dialog-title: 1.35rem;
  --type-subsection-title: clamp(1.45rem, 3vw, 2rem);
  --type-section-title: clamp(2.3rem, 4.6vw, 4rem);
  --type-page-title: clamp(2.5rem, 5.8vw, 4.8rem);
  --type-collection-title: clamp(2.7rem, 6vw, 4.8rem);
  --type-collection-title-compact: clamp(2.5rem, 13vw, 3.5rem);
  --type-home-title: clamp(3.2rem, 6.4vw, 6.1rem);
  --type-home-title-compact: clamp(3rem, 15vw, 4.7rem);
  --type-program-hero-title: clamp(2.5rem, 7vw, 5.5rem);
  --type-program-title: clamp(1.4rem, 3vw, 2.2rem);
  --type-score: clamp(2rem, 5vw, 3.5rem);
  --type-editor: 1.125rem;
  --type-icon: 1.1rem;
  --type-icon-large: 1.25rem;
  --type-arrow: 1.6rem;
  --type-watermark: 4.5rem;
  --type-code: .9rem;
  --type-footer: .8rem;
}

html {
  font-family: var(--font-sans);
  font-kerning: normal;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body,
button,
input,
select,
textarea {
  font-family: inherit;
}

code,
kbd,
pre,
samp {
  font-family: var(--font-mono);
}

/*
 * Final site-wide semantic type guard. typography.css is loaded after every
 * view stylesheet so page-specific layout cannot reintroduce undersized copy.
 */
body {
  font-size: var(--type-body);
  line-height: 1.6;
}

.site-nav-links a,
.site-nav-links button,
.button,
.notify-button,
.install-tab,
.step-navigation,
.editor-action-button,
.direction-option {
  font-size: var(--type-button);
}

.eyebrow,
.hero-tag,
.card-label,
.section-kicker,
.doc-label,
.picker-kicker,
.availability,
.workflow-number,
.setup-progress,
.guided-change-label,
.support-bubble {
  font-size: var(--type-label);
}

.hero-copy,
.intro,
.section-heading > p,
.hardware-hero > p:last-child {
  font-size: var(--type-body-large);
}

.program-card p,
.path-card p,
.workflow-card p,
.kit-description,
.kit-details,
.step p,
.step li,
.doc-card p,
.doc-card li,
.troubleshooting-questions details p,
.troubleshooting-questions details li,
details p,
details li,
.contact-dialog p,
.install-dialog p,
.control-item p,
.board-reference figcaption {
  font-size: var(--type-body);
}

.program-card h3,
.path-card h3,
.workflow-card h3,
.panel h3,
.doc-card h3,
main summary,
.install-dialog h3 {
  font-size: var(--type-card-title);
}

.help,
.field-help,
.notify-note,
.network-status,
.serial-status,
.send-progress li,
.firmware-picker-status,
.firmware-fallback,
.os-usb-status,
#status {
  font-size: var(--type-help);
}

.install-success-title {
  font-size: var(--type-body-large);
}

.install-success-label,
.install-success-session {
  font-size: var(--type-help);
}

label,
.hardware-configuration label,
.guide-sidebar .guide-section-link small,
.example-field > small {
  font-size: var(--type-label);
}

input,
select,
textarea,
.documentation-picker select,
.guide-sidebar .documentation-picker select,
.guide-sidebar .sidebar-submenu button,
.source-details summary,
.deployment-option strong,
.deployment-option span {
  font-size: var(--type-button);
}

pre,
code,
textarea,
.highlighted-code,
.line-numbers {
  font-size: var(--type-code);
}

footer {
  font-size: var(--type-footer);
}

@media (max-width: 650px) {
  .site-nav-links a,
  .site-nav-links button {
    font-size: var(--type-label);
  }
}
