ol,
ul {
  list-style:none;
  padding:0
}
img,
picture {
  display:block;
  max-width:100%
}
@media(prefers-color-scheme:light) {
  :root:not(.light):not(.dark) {
    --community-bg-primary:#fcfcfc;
    --community-bg-secondary:#f2f2f5;
    --community-text-primary:#000;
    --community-text-primary-alt:#000;
    --community-text-secondary:#343434;
    --community-text-success:#007936;
    --community-header-text:#696969;
    --community-header-bg:url(/static/media/people.7dd08649277d15256031.svg);
    --community-header-stats-bg:#e1f5e5;
    --community-box-shadow:4px -2px 1rem 0 #b3b3b333,4px -4px 1rem 0 #b3b3b326;
    --community-circle-img-border:#fff;
    --community-quote-start:url(/static/media/quote-start.386186c8e2aa4e088787.svg);
    --community-quote-end:url(/static/media/quote-end.e272edabe225ab6209fa.svg);
    --community-video-bg:url(/static/media/video-bg.3c2a576a5326b7eaae5f.svg);
    --community-card-bg:#fff;
    --community-card-header-bg:#e1f5e5;
    --community-card-border:#e2e2e2;
    --community-table-border:#e2e2e2;
    --community-table-row:#f9f9fb;
    --community-label-bg:#dff7e3;
    --community-discord-bg:url(/static/media/discord.a6e45d5761f9acead7a4.svg);
    --community-calls-bg:url(/static/media/community-calls.8f38747495434e07bc78.svg)
  }
}
@media (prefers-color-scheme: light) {
  :root:not(.light):not(.dark) {
    --community-bg-primary: #fcfcfc;
    --community-bg-secondary: #f2f2f5;
    --community-text-primary: #000;
    --community-text-primary-alt: #000;
    --community-text-secondary: #343434;
    --community-text-success: #007936;
    --community-header-text: #696969;
    --community-header-bg: url(/static/media/people.7dd08649277d15256031.svg);
    --community-header-stats-bg: #e1f5e5;
    --community-box-shadow: 4px -2px 1rem 0 #b3b3b333,4px -4px 1rem 0 #b3b3b326;
    --community-circle-img-border: #fff;
    --community-quote-start: url(/static/media/quote-start.386186c8e2aa4e088787.svg);
    --community-quote-end: url(/static/media/quote-end.e272edabe225ab6209fa.svg);
    --community-video-bg: url(/static/media/video-bg.3c2a576a5326b7eaae5f.svg);
    --community-card-bg: #fff;
    --community-card-header-bg: #e1f5e5;
    --community-card-border: #e2e2e2;
    --community-table-border: #e2e2e2;
    --community-table-row: #f9f9fb;
    --community-label-bg: #dff7e3;
    --community-discord-bg: url(/static/media/discord.a6e45d5761f9acead7a4.svg);
    --community-calls-bg: url(/static/media/community-calls.8f38747495434e07bc78.svg);
  }
}
@media (prefers-color-scheme: light) {
  :root:not(.light):not(.dark) {
    --community-bg-primary: #fcfcfc;
    --community-bg-secondary: #f2f2f5;
    --community-text-primary: #000;
    --community-text-primary-alt: #000;
    --community-text-secondary: #343434;
    --community-text-success: #007936;
    --community-header-text: #696969;
    --community-header-bg: url(/static/media/people.7dd08649277d15256031.svg);
    --community-header-stats-bg: #e1f5e5;
    --community-box-shadow: 4px -2px 1rem 0 #b3b3b333,4px -4px 1rem 0 #b3b3b326;
    --community-circle-img-border: #fff;
    --community-quote-start: url(/static/media/quote-start.386186c8e2aa4e088787.svg);
    --community-quote-end: url(/static/media/quote-end.e272edabe225ab6209fa.svg);
    --community-video-bg: url(/static/media/video-bg.3c2a576a5326b7eaae5f.svg);
    --community-card-bg: #fff;
    --community-card-header-bg: #e1f5e5;
    --community-card-border: #e2e2e2;
    --community-table-border: #e2e2e2;
    --community-table-row: #f9f9fb;
    --community-label-bg: #dff7e3;
    --community-discord-bg: url(/static/media/discord.a6e45d5761f9acead7a4.svg);
    --community-calls-bg: url(/static/media/community-calls.8f38747495434e07bc78.svg);
  }
}
@media (prefers-color-scheme: light) and (min-width: 769px) {
  :root:not(.light):not(.dark) {
    --curriculum-landing-started-beginner: url(/static/media/curriculum-landing-started-beginner.98498a537d7bc0081455.svg#light);
    --curriculum-landing-started-advanced: url(/static/media/curriculum-landing-started-advanced.f1ff5aabbd25eb7c84b9.svg#light);
    --curriculum-landing-started-employment: url(/static/media/curriculum-landing-started-employment.6dfff83343aff136eed6.svg#light);
    --curriculum-landing-started-educator: url(/static/media/curriculum-landing-started-educator.2b1973dd359c46918e58.svg#light);
  }
}
@media (prefers-color-scheme: light) {
  :root:not(.light):not(.dark) {
    --text-primary: #1b1b1b;
    --text-secondary: #4e4e4e;
    --text-active: #858585;
    --text-inactive: #9e9e9ea6;
    --text-link: #0069c2;
    --text-visited: #551a8b;
    --text-invert: #fff;
    --text-muted: #6f6f6f;
    --background-primary: #fff;
    --background-secondary: #f9f9fb;
    --background-tertiary: #ebeaea;
    --background-toc-active: #ebeaea;
    --background-mark-yellow: #c7b70066;
    --background-mark-green: #00d06166;
    --background-information: #0085f21a;
    --background-warning: #ff2a511a;
    --background-critical: #d300381a;
    --background-success: #0079361a;
    --background-del: #d3003880;
    --background-ins: #00793680;
    --border-primary: #cdcdcd;
    --border-secondary: #cdcdcd;
    --button-primary-default: #1b1b1b;
    --button-primary-hover: #696969;
    --button-primary-active: #9e9e9e;
    --button-primary-inactive: #1b1b1b;
    --button-secondary-default: #fff;
    --button-secondary-hover: #cdcdcd;
    --button-secondary-active: #cdcdcd;
    --button-secondary-inactive: #f9f9fb;
    --button-secondary-border-focus: #0085f2;
    --button-secondary-border-red: #ff97a0;
    --button-secondary-border-red-focus: #ffd9dc;
    --icon-primary: #696969;
    --icon-secondary: #b3b3b3;
    --icon-information: #0085f2;
    --icon-warning: #ff2a51;
    --icon-critical: #d30038;
    --icon-success: #007936;
    --accent-primary: #0085f2;
    --accent-primary-engage: #0085f21a;
    --accent-secondary: #0085f2;
    --accent-tertiary: #0085f21a;
    --shadow-01: 0 1px 2px #2b2a330d;
    --shadow-02: 0 1px 6px #2b2a331a;
    --focus-01: 0 0 0 3px #0090ed66;
    --field-focus-border: #0085f2;
    --code-token-tag: #0069c2;
    --code-token-punctuation: #858585;
    --code-token-attribute-name: #d30038;
    --code-token-attribute-value: #007936;
    --code-token-comment: #858585;
    --code-token-default: #1b1b1b;
    --code-token-selector: #872bff;
    --code-background-inline: #f2f1f1;
    --code-background-block: #f2f1f1;
    --notecard-link-color: #343434;
    --scrollbar-bg: #0000;
    --scrollbar-color: #00000040;
    --category-color: #0085f2;
    --category-color-background: #0085f210;
    --code-color: #5e9eff;
    --mark-color: #dce2f2;
    --plus-accent-color: #d30038;
    --html-accent-color: #d30038;
    --css-accent-color: #0069c2;
    --js-accent-color: #afa100;
    --http-accent-color: #007936;
    --apis-accent-color: #872bff;
    --learn-accent-color: #d00058;
    --plus-code-color: #0069c2;
    --html-code-color: #9e0027;
    --css-code-color: #0069c2;
    --js-code-color: #746a00;
    --http-code-color: #007936;
    --apis-code-color: #872bff;
    --learn-code-color: #d00058;
    --plus-mark-color: #ffd9dc;
    --html-mark-color: #ffd9dc;
    --css-mark-color: #dce2f2;
    --js-mark-color: #f0e498;
    --http-mark-color: #a9f3ba;
    --apis-mark-color: #e6deff;
    --learn-mark-color: #ffd9df;
    --plus-accent-background-color: #ff2a5130;
    --html-accent-background-color: #ff2a5130;
    --css-accent-background-color: #0085f230;
    --js-accent-background-color: #93870030;
    --http-accent-background-color: #009a4630;
    --apis-accent-background-color: #9b65ff30;
    --learn-accent-background-color: #ff1f7230;
    --plus-accent-engage: #ff2a51b3;
    --html-accent-engage: #ff2a51b3;
    --css-accent-engage: #0085f2b3;
    --js-accent-engage: #938700b3;
    --http-accent-engage: #009a46b3;
    --apis-accent-engage: #9b65ffb3;
    --learn-accent-engage: #ff1f72b3;
    --modal-backdrop-color: #1b1b1b1a;
    --blend-color: #fff80;
    --text-primary-red: #d30038;
    --text-primary-green: #007936;
    --text-primary-blue: #0069c2;
    --text-primary-yellow: #746a00;
    --collections-link: #9e0027;
    --collections-header: #ffd9dc;
    --collections-mandala: #ff97a0;
    --collections-icon: #ff2a51;
    --updates-link: #0069c2;
    --updates-header: #f9f9fb;
    --updates-mandala: #8cb4ff;
    --updates-icon: #0085f2;
    --ai-help-link: #007936;
    --ai-help-header: #f9f9fb;
    --ai-help-mandala: #00d061;
    --ai-help-icon: #009a46;
    --ai-help-accent-background-color: #009a4610;
    --observatory-bg: #f2f2f5;
    --observatory-bg-code: #e1e1e1;
    --observatory-bg-secondary: #fff;
    --observatory-color: #000;
    --observatory-color-secondary: #696969;
    --observatory-inverse-color: #fff;
    --observatory-inverse-color-secondary: #b3b3b3;
    --observatory-accent: #5a23d7;
    --observatory-accent-light: #5a23d7aa;
    --observatory-border: #e4e4f6;
    --observatory-border-accent: #5a23d7;
    --observatory-pass-icon-bg: #e5fae6;
    --observatory-pass-icon-color: #007936;
    --observatory-fail-icon-bg: #fae5e5;
    --observatory-fail-icon-color: #d30038;
    --observatory-table-bg: #fff;
    --observatory-table-bg-alternate: #f9f9fb;
    --observatory-table-header-bg: #f9f9fb;
    --observatory-grade-a-bg: #d2fadd;
    --observatory-grade-a-border: #017a37;
    --observatory-grade-b-bg: #e8fad2;
    --observatory-grade-b-border: #547a01;
    --observatory-grade-c-bg: #faf8d2;
    --observatory-grade-c-border: #7a7001;
    --observatory-grade-d-bg: #fae8d2;
    --observatory-grade-d-border: #a65001;
    --observatory-grade-f-bg: #fad2d2;
    --observatory-grade-f-border: #a00;
    --observatory-arrow-down-color: #9e0027;
    --observatory-arrow-up-color: #007936;
    --form-limit-color: #696969;
    --form-limit-color-emphasis: #4e4e4e;
    --form-invalid-color: #d30038;
    --form-invalid-focus-color: #ff2a51;
    --form-invalid-focus-effect-color: #ff2a5133;
    --baseline-high-bg: #e6f4ea;
    --baseline-high-engine-bg: #ceead6;
    --baseline-high-img: url(/static/media/high.1cadd1dd8633aafe4118.svg);
    --baseline-high-check: #099949;
    --baseline-low-bg: #e8f0fe;
    --baseline-low-engine-bg: #d2e3fc;
    --baseline-low-check: #1a73e8;
    --baseline-low-img: url(/static/media/low.f0f04252a312a99f0354.svg);
    --baseline-low-pill-bg: #3367d6;
    --baseline-low-pill-color: #f1f3f4;
    --baseline-limited-bg: #f1f3f4;
    --baseline-limited-engine-bg: #e3e6e8;
    --baseline-limited-img: url(/static/media/limited.33014e3dcdb86f37e0c8.svg);
    --baseline-limited-check: #1e8e3e;
    --baseline-limited-cross: #ea8600;
    --curriculum-bg-color: #fcefe2;
    --curriculum-bg-color-note: #fcefe280;
    --curriculum-bg-large-color: #fcefe2;
    --curriculum-bg-color-topic-standards: #ff2a5130;
    --curriculum-bg-color-topic-styling: #0085f230;
    --curriculum-bg-color-topic-scripting: #93870030;
    --curriculum-bg-color-topic-tooling: #009a4630;
    --curriculum-bg-color-topic-practices: #9b65ff30;
    --curriculum-bg-color-landing: #fff;
    --curriculum-bg-color-landing-about-ul: #fff;
    --curriculum-bg-color-landing-top-icon: #fcefe2;
    --curriculum-bg-color-landing-stairway-floor: #fcefe2;
    --curriculum-category-color: #e3642a;
    --curriculum-color: #d47d55;
    --curriculum-module-label-color: #b34d1f;
    --curriculum-module-label-bg-color: #faf0e3;
    --curriculum-color-topic-standards: #d30038;
    --curriculum-color-topic-styling: #0069c2;
    --curriculum-color-topic-scripting: #746a00;
    --curriculum-color-topic-tooling: #007936;
    --curriculum-color-topic-practices: #872bff;
    --curriculum-color-landing-laptop: #e3642a;
    --curriculum-border-color: #f2f1f1;
    --curriculum-border-color-hover: var(--text-inactive);
    --curriculum-bg-color-list-item-body: #fff;
    --curriculum-color-list-item-icon-topic-standards: #d30038;
    --curriculum-color-list-item-icon-topic-styling: #0069c2;
    --curriculum-color-list-item-icon-topic-scripting: #746a00;
    --curriculum-color-list-item-icon-topic-tooling: #007936;
    --curriculum-color-list-item-icon-topic-practices: #872bff;
    --curriculum-bg-color-list-item-icon-topic-standards: #fff;
    --curriculum-bg-color-list-item-icon-topic-styling: #fff;
    --curriculum-bg-color-list-item-icon-topic-scripting: #fff;
    --curriculum-bg-color-list-item-icon-topic-tooling: #fff;
    --curriculum-bg-color-list-item-icon-topic-practices: #fff;
    --curriculum-bg-color-list-item-topic-standards: #ff2a5130;
    --curriculum-bg-color-list-item-topic-styling: #0085f230;
    --curriculum-bg-color-list-item-topic-scripting: #93870030;
    --curriculum-bg-color-list-item-topic-tooling: #009a4630;
    --curriculum-bg-color-list-item-topic-practices: #9b65ff30;
    --curriculum-bg-color-partner: #fff;
    --curriculum-shadow: 4px 4px 8px 0 #b3b3b32e,-4px 4px 8px 0 #b3b3b326;
    --curriculum-shadow-landing-about-ul: 0 4px 10px 0 #e3642a0f,0 -2px 4px 0 #b25c350f;
    --curriculum-landing-about-beginner: url(/static/media/curriculum-landing-about-beginner.7e0e795029ffef7171e9.svg#light);
    --curriculum-landing-about-pace: url(/static/media/curriculum-landing-about-pace.cba550dca84e77e508e3.svg#light);
    --curriculum-landing-about-free: url(/static/media/curriculum-landing-about-free.72e91e2f7d6cd807f99a.svg#light);
    --curriculum-landing-about-bullet: url(/static/media/curriculum-landing-about-bullet.6ddad7f362afafb9f1d2.svg#light);
    --curriculum-landing-started-beginner: url(/static/media/curriculum-landing-started-beginner.98498a537d7bc0081455.svg#small-light);
    --curriculum-landing-started-advanced: url(/static/media/curriculum-landing-started-advanced.f1ff5aabbd25eb7c84b9.svg#small-light);
    --curriculum-landing-started-employment: url(/static/media/curriculum-landing-started-employment.6dfff83343aff136eed6.svg#small-light);
    --curriculum-landing-started-educator: url(/static/media/curriculum-landing-started-educator.2b1973dd359c46918e58.svg#small-light);
    --curriculum-module-mdn-resource: url(/static/media/curriculum-mdn-resource.1cf9ad8f86adfca49b67.svg#light);
    --curriculum-bullet: url(/static/media/curriculum-bullet.417fa50fd3559a7556d8.svg#light);
    --curriculum-about-covered: url(/static/media/curriculum-about-covered.6570f5157d434ba42984.svg#light);
    --curriculum-about-detail: url(/static/media/curriculum-about-detail.b708e21902f138eba9bf.svg#light);
    --curriculum-about-educators: url(/static/media/curriculum-about-educators.b29c7d71b39c1b0a0afe.svg#light);
    --curriculum-about-not: url(/static/media/curriculum-about-not.2ee2d9f300a73d1ebd6e.svg#light);
    --curriculum-about-students: url(/static/media/curriculum-about-students.2cd6ad2fcf4a6207f793.svg#light);
    --curriculum-bg-image-partner: url(/static/media/curriculum-partner-bg.b22eb19c53210709769d.svg#light);
    --curriculum-scrim-bg: url(/static/media/curriculum-scrim-bg.31bd527e5f6181a86b6f.svg#light);
    --curriculum-landing-arrow: url(/static/media/curriculum-landing-arrow.583d54721a2c1d371598.svg#light);
    color-scheme: light;
  }
}
:root, body {
  --mdn-color-white: #fff;
  --mdn-color-black: #000;
  --mdn-color-ads: #00d0aa;
  --mdn-color-background-highlight: #f0e498;
  --mdn-color-dark-grey: #4e4e4e;
  --mdn-background-dark: #1b1b1b;
  --mdn-background-light: #fff;
  --mdn-background-light-grey: #e2e2e2;
  --color-announcement-banner-accent: #ff6d91;
}
@media (min-width: 769px) {
  :root {
    --type-heading-h1: 600 var(--type-heading-h1-font-size) /var(--heading-line-height) var(--font-heading);
    --type-heading-h2: 500 var(--type-heading-h2-font-size) /var(--heading-line-height) var(--font-heading);
    --type-heading-h3: 300 var(--type-heading-h3-font-size) /var(--heading-line-height) var(--font-heading);
    --type-heading-h4: 400 var(--type-heading-h4-font-size) /var(--heading-line-height) var(--font-heading);
  }
}
:root {
  --font-fallback: BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;
  --font-body: Inter,var(--font-fallback);
  --font-heading: Inter,var(--font-fallback);
  --font-code: Menlo,Consolas,Monaco,Liberation Mono,Lucida Console,monospace;
  --base-font-size: 100%;
  --base-line-height: 1.2;
  --intermediate-line-height: 1.5;
  --heading-line-height: var(--base-line-height);
  --heading-letter-spacing: -0.031rem;
  --font-content-line-height: 1.75;
  --font-body-strong-weight: 600;
  --type-heading-h1-font-size: 2.488rem;
  --type-heading-h2-font-size: 2.074rem;
  --type-heading-h3-font-size: 1.728rem;
  --type-heading-h4-font-size: 1.44rem;
  --type-heading-h5-font-size: 1.2rem;
  --type-base-font-size-rem: 1rem;
  --type-smaller-font-size: 0.833rem;
  --type-tiny-font-size: 0.694rem;
  --type-heading-h1-font-size-mobile: 1.802rem;
  --type-heading-h2-font-size-mobile: 1.602rem;
  --type-heading-h3-font-size-mobile: 1.424rem;
  --type-heading-h4-font-size-mobile: 1.266rem;
  --type-emphasis-m: var(--font-body-strong-weight) var(--type-smaller-font-size) /1.23 var(--font-body);
  --type-label-s: 600 var(--type-tiny-font-size) /1.2 var(--font-heading);
  --type-heading-h1: 600 var(--type-heading-h1-font-size-mobile) /var(--heading-line-height) var(--font-heading);
  --type-heading-h2: 500 var(--type-heading-h2-font-size-mobile) /var(--heading-line-height) var(--font-heading);
  --type-heading-h3: 300 var(--type-heading-h3-font-size-mobile) /var(--heading-line-height) var(--font-heading);
  --type-heading-h4: 400 var(--type-heading-h4-font-size-mobile) /var(--heading-line-height) var(--font-heading);
  --type-heading-h5: 400 var(--type-heading-h5-font-size) /var(--heading-line-height) var(--font-heading);
  --type-heading-h6: 400 var(--type-base-font-size-rem) /var(--heading-line-height) var(--font-heading);
  --type-article-p: 400 var(--type-base-font-size-rem) /var(--font-content-line-height) var(--font-body);
  --gutter: 1rem;
  --top-navigation-height: 4rem;
  --top-navigation-offset: -4rem;
  --top-banner-inner-height: 3.125rem;
  --top-banner-height: calc(var(--top-banner-inner-height) + 0.25rem);
  --top-banner-outer-height: calc(var(--top-banner-height) + 2px);
  --z-index-a11y: 10000;
  --z-index-modal-content: 801;
  --z-index-modal-overlay: 800;
  --z-index-main-header: 700;
  --z-index-sidebar-mobile: 600;
  --z-index-mid: 500;
  --z-index-nav-menu: 200;
  --z-index-search-results: 101;
  --z-index-low: 100;
  --z-index-search-results-home: 99;
  --z-index-back: -1;
  --elem-radius: 0.25rem;
  --focus-effect: 0 0 0 3px var(--accent-primary-engage);
  --form-elem-height: 2rem;
  --top-nav-height: 4rem;
  --article-actions-container-height: 2rem;
  --icon-size: 1rem;
  --sticky-header-without-actions-height: calc(var(--top-nav-height) + 1px);
  --sticky-header-with-actions-height: calc(var(--sticky-header-without-actions-height) + var(--article-actions-container-height) + 1px);
}
html {
  scroll-behavior: smooth;
}
*, ::after, ::before {
  box-sizing: border-box;
}


elemento {
}
:root, body {
  --mdn-color-white: #fff;
  --mdn-color-black: #000;
  --mdn-color-ads: #00d0aa;
  --mdn-color-background-highlight: #f0e498;
  --mdn-color-dark-grey: #4e4e4e;
  --mdn-background-dark: #1b1b1b;
  --mdn-background-light: #fff;
  --mdn-background-light-grey: #e2e2e2;
  --color-announcement-banner-accent: #ff6d91;
}
:root, body {
  --mdn-color-white: #fff;
  --mdn-color-black: #000;
  --mdn-color-ads: #00d0aa;
  --mdn-color-background-highlight: #f0e498;
  --mdn-color-dark-grey: #4e4e4e;
  --mdn-background-dark: #1b1b1b;
  --mdn-background-light: #fff;
  --mdn-background-light-grey: #e2e2e2;
  --color-announcement-banner-accent: #ff6d91;
}
body {
  accent-color: var(--accent-primary);
  background-color: var(--background-primary);
  color: var(--text-primary);
  scrollbar-color: var(--scrollbar-color) var(--scrollbar-bg);
}
body {
  font-family: var(--font-body);
  font-size: var(--base-font-size);
  line-height: var(--font-content-line-height);
  text-rendering: optimizeSpeed;
}
blockquote, body, dd, dl, figure, h1, h2, h3, h4, ol, p, ul {
  margin: 0;
}
*, ::after, ::before {
  box-sizing: border-box;
}
*, ::after, ::before {
  box-sizing: border-box;
}
@media (prefers-color-scheme: light) {
  :root:not(.light):not(.dark) {
    --text-primary: #1b1b1b;
    --text-secondary: #4e4e4e;
    --text-active: #858585;
    --text-inactive: #9e9e9ea6;
    --text-link: #0069c2;
    --text-visited: #551a8b;
    --text-invert: #fff;
    --text-muted: #6f6f6f;
    --background-primary: #fff;
    --background-secondary: #f9f9fb;
    --background-tertiary: #ebeaea;
    --background-toc-active: #ebeaea;
    --background-mark-yellow: #c7b70066;
    --background-mark-green: #00d06166;
    --background-information: #0085f21a;
    --background-warning: #ff2a511a;
    --background-critical: #d300381a;
    --background-success: #0079361a;
    --background-del: #d3003880;
    --background-ins: #00793680;
    --border-primary: #cdcdcd;
    --border-secondary: #cdcdcd;
    --button-primary-default: #1b1b1b;
    --button-primary-hover: #696969;
    --button-primary-active: #9e9e9e;
    --button-primary-inactive: #1b1b1b;
    --button-secondary-default: #fff;
    --button-secondary-hover: #cdcdcd;
    --button-secondary-active: #cdcdcd;
    --button-secondary-inactive: #f9f9fb;
    --button-secondary-border-focus: #0085f2;
    --button-secondary-border-red: #ff97a0;
    --button-secondary-border-red-focus: #ffd9dc;
    --icon-primary: #696969;
    --icon-secondary: #b3b3b3;
    --icon-information: #0085f2;
    --icon-warning: #ff2a51;
    --icon-critical: #d30038;
    --icon-success: #007936;
    --accent-primary: #0085f2;
    --accent-primary-engage: #0085f21a;
    --accent-secondary: #0085f2;
    --accent-tertiary: #0085f21a;
    --shadow-01: 0 1px 2px #2b2a330d;
    --shadow-02: 0 1px 6px #2b2a331a;
    --focus-01: 0 0 0 3px #0090ed66;
    --field-focus-border: #0085f2;
    --code-token-tag: #0069c2;
    --code-token-punctuation: #858585;
    --code-token-attribute-name: #d30038;
    --code-token-attribute-value: #007936;
    --code-token-comment: #858585;
    --code-token-default: #1b1b1b;
    --code-token-selector: #872bff;
    --code-background-inline: #f2f1f1;
    --code-background-block: #f2f1f1;
    --notecard-link-color: #343434;
    --scrollbar-bg: #0000;
    --scrollbar-color: #00000040;
    --category-color: #0085f2;
    --category-color-background: #0085f210;
    --code-color: #5e9eff;
    --mark-color: #dce2f2;
    --plus-accent-color: #d30038;
    --html-accent-color: #d30038;
    --css-accent-color: #0069c2;
    --js-accent-color: #afa100;
    --http-accent-color: #007936;
    --apis-accent-color: #872bff;
    --learn-accent-color: #d00058;
    --plus-code-color: #0069c2;
    --html-code-color: #9e0027;
    --css-code-color: #0069c2;
    --js-code-color: #746a00;
    --http-code-color: #007936;
    --apis-code-color: #872bff;
    --learn-code-color: #d00058;
    --plus-mark-color: #ffd9dc;
    --html-mark-color: #ffd9dc;
    --css-mark-color: #dce2f2;
    --js-mark-color: #f0e498;
    --http-mark-color: #a9f3ba;
    --apis-mark-color: #e6deff;
    --learn-mark-color: #ffd9df;
    --plus-accent-background-color: #ff2a5130;
    --html-accent-background-color: #ff2a5130;
    --css-accent-background-color: #0085f230;
    --js-accent-background-color: #93870030;
    --http-accent-background-color: #009a4630;
    --apis-accent-background-color: #9b65ff30;
    --learn-accent-background-color: #ff1f7230;
    --plus-accent-engage: #ff2a51b3;
    --html-accent-engage: #ff2a51b3;
    --css-accent-engage: #0085f2b3;
    --js-accent-engage: #938700b3;
    --http-accent-engage: #009a46b3;
    --apis-accent-engage: #9b65ffb3;
    --learn-accent-engage: #ff1f72b3;
    --modal-backdrop-color: #1b1b1b1a;
    --blend-color: #fff80;
    --text-primary-red: #d30038;
    --text-primary-green: #007936;
    --text-primary-blue: #0069c2;
    --text-primary-yellow: #746a00;
    --collections-link: #9e0027;
    --collections-header: #ffd9dc;
    --collections-mandala: #ff97a0;
    --collections-icon: #ff2a51;
    --updates-link: #0069c2;
    --updates-header: #f9f9fb;
    --updates-mandala: #8cb4ff;
    --updates-icon: #0085f2;
    --ai-help-link: #007936;
    --ai-help-header: #f9f9fb;
    --ai-help-mandala: #00d061;
    --ai-help-icon: #009a46;
    --ai-help-accent-background-color: #009a4610;
    --observatory-bg: #f2f2f5;
    --observatory-bg-code: #e1e1e1;
    --observatory-bg-secondary: #fff;
    --observatory-color: #000;
    --observatory-color-secondary: #696969;
    --observatory-inverse-color: #fff;
    --observatory-inverse-color-secondary: #b3b3b3;
    --observatory-accent: #5a23d7;
    --observatory-accent-light: #5a23d7aa;
    --observatory-border: #e4e4f6;
    --observatory-border-accent: #5a23d7;
    --observatory-pass-icon-bg: #e5fae6;
    --observatory-pass-icon-color: #007936;
    --observatory-fail-icon-bg: #fae5e5;
    --observatory-fail-icon-color: #d30038;
    --observatory-table-bg: #fff;
    --observatory-table-bg-alternate: #f9f9fb;
    --observatory-table-header-bg: #f9f9fb;
    --observatory-grade-a-bg: #d2fadd;
    --observatory-grade-a-border: #017a37;
    --observatory-grade-b-bg: #e8fad2;
    --observatory-grade-b-border: #547a01;
    --observatory-grade-c-bg: #faf8d2;
    --observatory-grade-c-border: #7a7001;
    --observatory-grade-d-bg: #fae8d2;
    --observatory-grade-d-border: #a65001;
    --observatory-grade-f-bg: #fad2d2;
    --observatory-grade-f-border: #a00;
    --observatory-arrow-down-color: #9e0027;
    --observatory-arrow-up-color: #007936;
    --form-limit-color: #696969;
    --form-limit-color-emphasis: #4e4e4e;
    --form-invalid-color: #d30038;
    --form-invalid-focus-color: #ff2a51;
    --form-invalid-focus-effect-color: #ff2a5133;
    --baseline-high-bg: #e6f4ea;
    --baseline-high-engine-bg: #ceead6;
    --baseline-high-img: url(/static/media/high.1cadd1dd8633aafe4118.svg);
    --baseline-high-check: #099949;
    --baseline-low-bg: #e8f0fe;
    --baseline-low-engine-bg: #d2e3fc;
    --baseline-low-check: #1a73e8;
    --baseline-low-img: url(/static/media/low.f0f04252a312a99f0354.svg);
    --baseline-low-pill-bg: #3367d6;
    --baseline-low-pill-color: #f1f3f4;
    --baseline-limited-bg: #f1f3f4;
    --baseline-limited-engine-bg: #e3e6e8;
    --baseline-limited-img: url(/static/media/limited.33014e3dcdb86f37e0c8.svg);
    --baseline-limited-check: #1e8e3e;
    --baseline-limited-cross: #ea8600;
    --curriculum-bg-color: #fcefe2;
    --curriculum-bg-color-note: #fcefe280;
    --curriculum-bg-large-color: #fcefe2;
    --curriculum-bg-color-topic-standards: #ff2a5130;
    --curriculum-bg-color-topic-styling: #0085f230;
    --curriculum-bg-color-topic-scripting: #93870030;
    --curriculum-bg-color-topic-tooling: #009a4630;
    --curriculum-bg-color-topic-practices: #9b65ff30;
    --curriculum-bg-color-landing: #fff;
    --curriculum-bg-color-landing-about-ul: #fff;
    --curriculum-bg-color-landing-top-icon: #fcefe2;
    --curriculum-bg-color-landing-stairway-floor: #fcefe2;
    --curriculum-category-color: #e3642a;
    --curriculum-color: #d47d55;
    --curriculum-module-label-color: #b34d1f;
    --curriculum-module-label-bg-color: #faf0e3;
    --curriculum-color-topic-standards: #d30038;
    --curriculum-color-topic-styling: #0069c2;
    --curriculum-color-topic-scripting: #746a00;
    --curriculum-color-topic-tooling: #007936;
    --curriculum-color-topic-practices: #872bff;
    --curriculum-color-landing-laptop: #e3642a;
    --curriculum-border-color: #f2f1f1;
    --curriculum-border-color-hover: var(--text-inactive);
    --curriculum-bg-color-list-item-body: #fff;
    --curriculum-color-list-item-icon-topic-standards: #d30038;
    --curriculum-color-list-item-icon-topic-styling: #0069c2;
    --curriculum-color-list-item-icon-topic-scripting: #746a00;
    --curriculum-color-list-item-icon-topic-tooling: #007936;
    --curriculum-color-list-item-icon-topic-practices: #872bff;
    --curriculum-bg-color-list-item-icon-topic-standards: #fff;
    --curriculum-bg-color-list-item-icon-topic-styling: #fff;
    --curriculum-bg-color-list-item-icon-topic-scripting: #fff;
    --curriculum-bg-color-list-item-icon-topic-tooling: #fff;
    --curriculum-bg-color-list-item-icon-topic-practices: #fff;
    --curriculum-bg-color-list-item-topic-standards: #ff2a5130;
    --curriculum-bg-color-list-item-topic-styling: #0085f230;
    --curriculum-bg-color-list-item-topic-scripting: #93870030;
    --curriculum-bg-color-list-item-topic-tooling: #009a4630;
    --curriculum-bg-color-list-item-topic-practices: #9b65ff30;
    --curriculum-bg-color-partner: #fff;
    --curriculum-shadow: 4px 4px 8px 0 #b3b3b32e,-4px 4px 8px 0 #b3b3b326;
    --curriculum-shadow-landing-about-ul: 0 4px 10px 0 #e3642a0f,0 -2px 4px 0 #b25c350f;
    --curriculum-landing-about-beginner: url(/static/media/curriculum-landing-about-beginner.7e0e795029ffef7171e9.svg#light);
    --curriculum-landing-about-pace: url(/static/media/curriculum-landing-about-pace.cba550dca84e77e508e3.svg#light);
    --curriculum-landing-about-free: url(/static/media/curriculum-landing-about-free.72e91e2f7d6cd807f99a.svg#light);
    --curriculum-landing-about-bullet: url(/static/media/curriculum-landing-about-bullet.6ddad7f362afafb9f1d2.svg#light);
    --curriculum-landing-started-beginner: url(/static/media/curriculum-landing-started-beginner.98498a537d7bc0081455.svg#small-light);
    --curriculum-landing-started-advanced: url(/static/media/curriculum-landing-started-advanced.f1ff5aabbd25eb7c84b9.svg#small-light);
    --curriculum-landing-started-employment: url(/static/media/curriculum-landing-started-employment.6dfff83343aff136eed6.svg#small-light);
    --curriculum-landing-started-educator: url(/static/media/curriculum-landing-started-educator.2b1973dd359c46918e58.svg#small-light);
    --curriculum-module-mdn-resource: url(/static/media/curriculum-mdn-resource.1cf9ad8f86adfca49b67.svg#light);
    --curriculum-bullet: url(/static/media/curriculum-bullet.417fa50fd3559a7556d8.svg#light);
    --curriculum-about-covered: url(/static/media/curriculum-about-covered.6570f5157d434ba42984.svg#light);
    --curriculum-about-detail: url(/static/media/curriculum-about-detail.b708e21902f138eba9bf.svg#light);
    --curriculum-about-educators: url(/static/media/curriculum-about-educators.b29c7d71b39c1b0a0afe.svg#light);
    --curriculum-about-not: url(/static/media/curriculum-about-not.2ee2d9f300a73d1ebd6e.svg#light);
    --curriculum-about-students: url(/static/media/curriculum-about-students.2cd6ad2fcf4a6207f793.svg#light);
    --curriculum-bg-image-partner: url(/static/media/curriculum-partner-bg.b22eb19c53210709769d.svg#light);
    --curriculum-scrim-bg: url(/static/media/curriculum-scrim-bg.31bd527e5f6181a86b6f.svg#light);
    --curriculum-landing-arrow: url(/static/media/curriculum-landing-arrow.583d54721a2c1d371598.svg#light);
    color-scheme: light;
  }
}
@media (prefers-color-scheme: light) and (min-width: 769px) {
  :root:not(.light):not(.dark) {
    --curriculum-landing-started-beginner: url(/static/media/curriculum-landing-started-beginner.98498a537d7bc0081455.svg#light);
    --curriculum-landing-started-advanced: url(/static/media/curriculum-landing-started-advanced.f1ff5aabbd25eb7c84b9.svg#light);
    --curriculum-landing-started-employment: url(/static/media/curriculum-landing-started-employment.6dfff83343aff136eed6.svg#light);
    --curriculum-landing-started-educator: url(/static/media/curriculum-landing-started-educator.2b1973dd359c46918e58.svg#light);
  }
}
@media (prefers-color-scheme: light) {
  :root:not(.light):not(.dark) {
    --community-bg-primary: #fcfcfc;
    --community-bg-secondary: #f2f2f5;
    --community-text-primary: #000;
    --community-text-primary-alt: #000;
    --community-text-secondary: #343434;
    --community-text-success: #007936;
    --community-header-text: #696969;
    --community-header-bg: url(/static/media/people.7dd08649277d15256031.svg);
    --community-header-stats-bg: #e1f5e5;
    --community-box-shadow: 4px -2px 1rem 0 #b3b3b333,4px -4px 1rem 0 #b3b3b326;
    --community-circle-img-border: #fff;
    --community-quote-start: url(/static/media/quote-start.386186c8e2aa4e088787.svg);
    --community-quote-end: url(/static/media/quote-end.e272edabe225ab6209fa.svg);
    --community-video-bg: url(/static/media/video-bg.3c2a576a5326b7eaae5f.svg);
    --community-card-bg: #fff;
    --community-card-header-bg: #e1f5e5;
    --community-card-border: #e2e2e2;
    --community-table-border: #e2e2e2;
    --community-table-row: #f9f9fb;
    --community-label-bg: #dff7e3;
    --community-discord-bg: url(/static/media/discord.a6e45d5761f9acead7a4.svg);
    --community-calls-bg: url(/static/media/community-calls.8f38747495434e07bc78.svg);
  }
}
@media (prefers-color-scheme: light) {
  :root:not(.light):not(.dark) {
    --community-bg-primary: #fcfcfc;
    --community-bg-secondary: #f2f2f5;
    --community-text-primary: #000;
    --community-text-primary-alt: #000;
    --community-text-secondary: #343434;
    --community-text-success: #007936;
    --community-header-text: #696969;
    --community-header-bg: url(/static/media/people.7dd08649277d15256031.svg);
    --community-header-stats-bg: #e1f5e5;
    --community-box-shadow: 4px -2px 1rem 0 #b3b3b333,4px -4px 1rem 0 #b3b3b326;
    --community-circle-img-border: #fff;
    --community-quote-start: url(/static/media/quote-start.386186c8e2aa4e088787.svg);
    --community-quote-end: url(/static/media/quote-end.e272edabe225ab6209fa.svg);
    --community-video-bg: url(/static/media/video-bg.3c2a576a5326b7eaae5f.svg);
    --community-card-bg: #fff;
    --community-card-header-bg: #e1f5e5;
    --community-card-border: #e2e2e2;
    --community-table-border: #e2e2e2;
    --community-table-row: #f9f9fb;
    --community-label-bg: #dff7e3;
    --community-discord-bg: url(/static/media/discord.a6e45d5761f9acead7a4.svg);
    --community-calls-bg: url(/static/media/community-calls.8f38747495434e07bc78.svg);
  }
}
@media (prefers-color-scheme: light) {
  :root:not(.light):not(.dark) {
    --community-bg-primary: #fcfcfc;
    --community-bg-secondary: #f2f2f5;
    --community-text-primary: #000;
    --community-text-primary-alt: #000;
    --community-text-secondary: #343434;
    --community-text-success: #007936;
    --community-header-text: #696969;
    --community-header-bg: url(/static/media/people.7dd08649277d15256031.svg);
    --community-header-stats-bg: #e1f5e5;
    --community-box-shadow: 4px -2px 1rem 0 #b3b3b333,4px -4px 1rem 0 #b3b3b326;
    --community-circle-img-border: #fff;
    --community-quote-start: url(/static/media/quote-start.386186c8e2aa4e088787.svg);
    --community-quote-end: url(/static/media/quote-end.e272edabe225ab6209fa.svg);
    --community-video-bg: url(/static/media/video-bg.3c2a576a5326b7eaae5f.svg);
    --community-card-bg: #fff;
    --community-card-header-bg: #e1f5e5;
    --community-card-border: #e2e2e2;
    --community-table-border: #e2e2e2;
    --community-table-row: #f9f9fb;
    --community-label-bg: #dff7e3;
    --community-discord-bg: url(/static/media/discord.a6e45d5761f9acead7a4.svg);
    --community-calls-bg: url(/static/media/community-calls.8f38747495434e07bc78.svg);
  }
}
@media (prefers-color-scheme: light) {
  :root:not(.light):not(.dark) {
    --community-bg-primary: #fcfcfc;
    --community-bg-secondary: #f2f2f5;
    --community-text-primary: #000;
    --community-text-primary-alt: #000;
    --community-text-secondary: #343434;
    --community-text-success: #007936;
    --community-header-text: #696969;
    --community-header-bg: url(/static/media/people.7dd08649277d15256031.svg);
    --community-header-stats-bg: #e1f5e5;
    --community-box-shadow: 4px -2px 1rem 0 #b3b3b333,4px -4px 1rem 0 #b3b3b326;
    --community-circle-img-border: #fff;
    --community-quote-start: url(/static/media/quote-start.386186c8e2aa4e088787.svg);
    --community-quote-end: url(/static/media/quote-end.e272edabe225ab6209fa.svg);
    --community-video-bg: url(/static/media/video-bg.3c2a576a5326b7eaae5f.svg);
    --community-card-bg: #fff;
    --community-card-header-bg: #e1f5e5;
    --community-card-border: #e2e2e2;
    --community-table-border: #e2e2e2;
    --community-table-row: #f9f9fb;
    --community-label-bg: #dff7e3;
    --community-discord-bg: url(/static/media/discord.a6e45d5761f9acead7a4.svg);
    --community-calls-bg: url(/static/media/community-calls.8f38747495434e07bc78.svg);
  }
}
@media (prefers-color-scheme: light) and (min-width: 769px) {
  :root:not(.light):not(.dark) {
    --curriculum-landing-started-beginner: url(/static/media/curriculum-landing-started-beginner.98498a537d7bc0081455.svg#light);
    --curriculum-landing-started-advanced: url(/static/media/curriculum-landing-started-advanced.f1ff5aabbd25eb7c84b9.svg#light);
    --curriculum-landing-started-employment: url(/static/media/curriculum-landing-started-employment.6dfff83343aff136eed6.svg#light);
    --curriculum-landing-started-educator: url(/static/media/curriculum-landing-started-educator.2b1973dd359c46918e58.svg#light);
  }
}
@media (prefers-color-scheme: light) {
  :root:not(.light):not(.dark) {
    --text-primary: #1b1b1b;
    --text-secondary: #4e4e4e;
    --text-active: #858585;
    --text-inactive: #9e9e9ea6;
    --text-link: #0069c2;
    --text-visited: #551a8b;
    --text-invert: #fff;
    --text-muted: #6f6f6f;
    --background-primary: #fff;
    --background-secondary: #f9f9fb;
    --background-tertiary: #ebeaea;
    --background-toc-active: #ebeaea;
    --background-mark-yellow: #c7b70066;
    --background-mark-green: #00d06166;
    --background-information: #0085f21a;
    --background-warning: #ff2a511a;
    --background-critical: #d300381a;
    --background-success: #0079361a;
    --background-del: #d3003880;
    --background-ins: #00793680;
    --border-primary: #cdcdcd;
    --border-secondary: #cdcdcd;
    --button-primary-default: #1b1b1b;
    --button-primary-hover: #696969;
    --button-primary-active: #9e9e9e;
    --button-primary-inactive: #1b1b1b;
    --button-secondary-default: #fff;
    --button-secondary-hover: #cdcdcd;
    --button-secondary-active: #cdcdcd;
    --button-secondary-inactive: #f9f9fb;
    --button-secondary-border-focus: #0085f2;
    --button-secondary-border-red: #ff97a0;
    --button-secondary-border-red-focus: #ffd9dc;
    --icon-primary: #696969;
    --icon-secondary: #b3b3b3;
    --icon-information: #0085f2;
    --icon-warning: #ff2a51;
    --icon-critical: #d30038;
    --icon-success: #007936;
    --accent-primary: #0085f2;
    --accent-primary-engage: #0085f21a;
    --accent-secondary: #0085f2;
    --accent-tertiary: #0085f21a;
    --shadow-01: 0 1px 2px #2b2a330d;
    --shadow-02: 0 1px 6px #2b2a331a;
    --focus-01: 0 0 0 3px #0090ed66;
    --field-focus-border: #0085f2;
    --code-token-tag: #0069c2;
    --code-token-punctuation: #858585;
    --code-token-attribute-name: #d30038;
    --code-token-attribute-value: #007936;
    --code-token-comment: #858585;
    --code-token-default: #1b1b1b;
    --code-token-selector: #872bff;
    --code-background-inline: #f2f1f1;
    --code-background-block: #f2f1f1;
    --notecard-link-color: #343434;
    --scrollbar-bg: #0000;
    --scrollbar-color: #00000040;
    --category-color: #0085f2;
    --category-color-background: #0085f210;
    --code-color: #5e9eff;
    --mark-color: #dce2f2;
    --plus-accent-color: #d30038;
    --html-accent-color: #d30038;
    --css-accent-color: #0069c2;
    --js-accent-color: #afa100;
    --http-accent-color: #007936;
    --apis-accent-color: #872bff;
    --learn-accent-color: #d00058;
    --plus-code-color: #0069c2;
    --html-code-color: #9e0027;
    --css-code-color: #0069c2;
    --js-code-color: #746a00;
    --http-code-color: #007936;
    --apis-code-color: #872bff;
    --learn-code-color: #d00058;
    --plus-mark-color: #ffd9dc;
    --html-mark-color: #ffd9dc;
    --css-mark-color: #dce2f2;
    --js-mark-color: #f0e498;
    --http-mark-color: #a9f3ba;
    --apis-mark-color: #e6deff;
    --learn-mark-color: #ffd9df;
    --plus-accent-background-color: #ff2a5130;
    --html-accent-background-color: #ff2a5130;
    --css-accent-background-color: #0085f230;
    --js-accent-background-color: #93870030;
    --http-accent-background-color: #009a4630;
    --apis-accent-background-color: #9b65ff30;
    --learn-accent-background-color: #ff1f7230;
    --plus-accent-engage: #ff2a51b3;
    --html-accent-engage: #ff2a51b3;
    --css-accent-engage: #0085f2b3;
    --js-accent-engage: #938700b3;
    --http-accent-engage: #009a46b3;
    --apis-accent-engage: #9b65ffb3;
    --learn-accent-engage: #ff1f72b3;
    --modal-backdrop-color: #1b1b1b1a;
    --blend-color: #fff80;
    --text-primary-red: #d30038;
    --text-primary-green: #007936;
    --text-primary-blue: #0069c2;
    --text-primary-yellow: #746a00;
    --collections-link: #9e0027;
    --collections-header: #ffd9dc;
    --collections-mandala: #ff97a0;
    --collections-icon: #ff2a51;
    --updates-link: #0069c2;
    --updates-header: #f9f9fb;
    --updates-mandala: #8cb4ff;
    --updates-icon: #0085f2;
    --ai-help-link: #007936;
    --ai-help-header: #f9f9fb;
    --ai-help-mandala: #00d061;
    --ai-help-icon: #009a46;
    --ai-help-accent-background-color: #009a4610;
    --observatory-bg: #f2f2f5;
    --observatory-bg-code: #e1e1e1;
    --observatory-bg-secondary: #fff;
    --observatory-color: #000;
    --observatory-color-secondary: #696969;
    --observatory-inverse-color: #fff;
    --observatory-inverse-color-secondary: #b3b3b3;
    --observatory-accent: #5a23d7;
    --observatory-accent-light: #5a23d7aa;
    --observatory-border: #e4e4f6;
    --observatory-border-accent: #5a23d7;
    --observatory-pass-icon-bg: #e5fae6;
    --observatory-pass-icon-color: #007936;
    --observatory-fail-icon-bg: #fae5e5;
    --observatory-fail-icon-color: #d30038;
    --observatory-table-bg: #fff;
    --observatory-table-bg-alternate: #f9f9fb;
    --observatory-table-header-bg: #f9f9fb;
    --observatory-grade-a-bg: #d2fadd;
    --observatory-grade-a-border: #017a37;
    --observatory-grade-b-bg: #e8fad2;
    --observatory-grade-b-border: #547a01;
    --observatory-grade-c-bg: #faf8d2;
    --observatory-grade-c-border: #7a7001;
    --observatory-grade-d-bg: #fae8d2;
    --observatory-grade-d-border: #a65001;
    --observatory-grade-f-bg: #fad2d2;
    --observatory-grade-f-border: #a00;
    --observatory-arrow-down-color: #9e0027;
    --observatory-arrow-up-color: #007936;
    --form-limit-color: #696969;
    --form-limit-color-emphasis: #4e4e4e;
    --form-invalid-color: #d30038;
    --form-invalid-focus-color: #ff2a51;
    --form-invalid-focus-effect-color: #ff2a5133;
    --baseline-high-bg: #e6f4ea;
    --baseline-high-engine-bg: #ceead6;
    --baseline-high-img: url(/static/media/high.1cadd1dd8633aafe4118.svg);
    --baseline-high-check: #099949;
    --baseline-low-bg: #e8f0fe;
    --baseline-low-engine-bg: #d2e3fc;
    --baseline-low-check: #1a73e8;
    --baseline-low-img: url(/static/media/low.f0f04252a312a99f0354.svg);
    --baseline-low-pill-bg: #3367d6;
    --baseline-low-pill-color: #f1f3f4;
    --baseline-limited-bg: #f1f3f4;
    --baseline-limited-engine-bg: #e3e6e8;
    --baseline-limited-img: url(/static/media/limited.33014e3dcdb86f37e0c8.svg);
    --baseline-limited-check: #1e8e3e;
    --baseline-limited-cross: #ea8600;
    --curriculum-bg-color: #fcefe2;
    --curriculum-bg-color-note: #fcefe280;
    --curriculum-bg-large-color: #fcefe2;
    --curriculum-bg-color-topic-standards: #ff2a5130;
    --curriculum-bg-color-topic-styling: #0085f230;
    --curriculum-bg-color-topic-scripting: #93870030;
    --curriculum-bg-color-topic-tooling: #009a4630;
    --curriculum-bg-color-topic-practices: #9b65ff30;
    --curriculum-bg-color-landing: #fff;
    --curriculum-bg-color-landing-about-ul: #fff;
    --curriculum-bg-color-landing-top-icon: #fcefe2;
    --curriculum-bg-color-landing-stairway-floor: #fcefe2;
    --curriculum-category-color: #e3642a;
    --curriculum-color: #d47d55;
    --curriculum-module-label-color: #b34d1f;
    --curriculum-module-label-bg-color: #faf0e3;
    --curriculum-color-topic-standards: #d30038;
    --curriculum-color-topic-styling: #0069c2;
    --curriculum-color-topic-scripting: #746a00;
    --curriculum-color-topic-tooling: #007936;
    --curriculum-color-topic-practices: #872bff;
    --curriculum-color-landing-laptop: #e3642a;
    --curriculum-border-color: #f2f1f1;
    --curriculum-border-color-hover: var(--text-inactive);
    --curriculum-bg-color-list-item-body: #fff;
    --curriculum-color-list-item-icon-topic-standards: #d30038;
    --curriculum-color-list-item-icon-topic-styling: #0069c2;
    --curriculum-color-list-item-icon-topic-scripting: #746a00;
    --curriculum-color-list-item-icon-topic-tooling: #007936;
    --curriculum-color-list-item-icon-topic-practices: #872bff;
    --curriculum-bg-color-list-item-icon-topic-standards: #fff;
    --curriculum-bg-color-list-item-icon-topic-styling: #fff;
    --curriculum-bg-color-list-item-icon-topic-scripting: #fff;
    --curriculum-bg-color-list-item-icon-topic-tooling: #fff;
    --curriculum-bg-color-list-item-icon-topic-practices: #fff;
    --curriculum-bg-color-list-item-topic-standards: #ff2a5130;
    --curriculum-bg-color-list-item-topic-styling: #0085f230;
    --curriculum-bg-color-list-item-topic-scripting: #93870030;
    --curriculum-bg-color-list-item-topic-tooling: #009a4630;
    --curriculum-bg-color-list-item-topic-practices: #9b65ff30;
    --curriculum-bg-color-partner: #fff;
    --curriculum-shadow: 4px 4px 8px 0 #b3b3b32e,-4px 4px 8px 0 #b3b3b326;
    --curriculum-shadow-landing-about-ul: 0 4px 10px 0 #e3642a0f,0 -2px 4px 0 #b25c350f;
    --curriculum-landing-about-beginner: url(/static/media/curriculum-landing-about-beginner.7e0e795029ffef7171e9.svg#light);
    --curriculum-landing-about-pace: url(/static/media/curriculum-landing-about-pace.cba550dca84e77e508e3.svg#light);
    --curriculum-landing-about-free: url(/static/media/curriculum-landing-about-free.72e91e2f7d6cd807f99a.svg#light);
    --curriculum-landing-about-bullet: url(/static/media/curriculum-landing-about-bullet.6ddad7f362afafb9f1d2.svg#light);
    --curriculum-landing-started-beginner: url(/static/media/curriculum-landing-started-beginner.98498a537d7bc0081455.svg#small-light);
    --curriculum-landing-started-advanced: url(/static/media/curriculum-landing-started-advanced.f1ff5aabbd25eb7c84b9.svg#small-light);
    --curriculum-landing-started-employment: url(/static/media/curriculum-landing-started-employment.6dfff83343aff136eed6.svg#small-light);
    --curriculum-landing-started-educator: url(/static/media/curriculum-landing-started-educator.2b1973dd359c46918e58.svg#small-light);
    --curriculum-module-mdn-resource: url(/static/media/curriculum-mdn-resource.1cf9ad8f86adfca49b67.svg#light);
    --curriculum-bullet: url(/static/media/curriculum-bullet.417fa50fd3559a7556d8.svg#light);
    --curriculum-about-covered: url(/static/media/curriculum-about-covered.6570f5157d434ba42984.svg#light);
    --curriculum-about-detail: url(/static/media/curriculum-about-detail.b708e21902f138eba9bf.svg#light);
    --curriculum-about-educators: url(/static/media/curriculum-about-educators.b29c7d71b39c1b0a0afe.svg#light);
    --curriculum-about-not: url(/static/media/curriculum-about-not.2ee2d9f300a73d1ebd6e.svg#light);
    --curriculum-about-students: url(/static/media/curriculum-about-students.2cd6ad2fcf4a6207f793.svg#light);
    --curriculum-bg-image-partner: url(/static/media/curriculum-partner-bg.b22eb19c53210709769d.svg#light);
    --curriculum-scrim-bg: url(/static/media/curriculum-scrim-bg.31bd527e5f6181a86b6f.svg#light);
    --curriculum-landing-arrow: url(/static/media/curriculum-landing-arrow.583d54721a2c1d371598.svg#light);
    color-scheme: light;
  }
}
:root {
  --font-fallback: BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;
  --font-body: Inter,var(--font-fallback);
  --font-heading: Inter,var(--font-fallback);
  --font-code: Menlo,Consolas,Monaco,Liberation Mono,Lucida Console,monospace;
  --base-font-size: 100%;
  --base-line-height: 1.2;
  --intermediate-line-height: 1.5;
  --heading-line-height: var(--base-line-height);
  --heading-letter-spacing: -0.031rem;
  --font-content-line-height: 1.75;
  --font-body-strong-weight: 600;
  --type-heading-h1-font-size: 2.488rem;
  --type-heading-h2-font-size: 2.074rem;
  --type-heading-h3-font-size: 1.728rem;
  --type-heading-h4-font-size: 1.44rem;
  --type-heading-h5-font-size: 1.2rem;
  --type-base-font-size-rem: 1rem;
  --type-smaller-font-size: 0.833rem;
  --type-tiny-font-size: 0.694rem;
  --type-heading-h1-font-size-mobile: 1.802rem;
  --type-heading-h2-font-size-mobile: 1.602rem;
  --type-heading-h3-font-size-mobile: 1.424rem;
  --type-heading-h4-font-size-mobile: 1.266rem;
  --type-emphasis-m: var(--font-body-strong-weight) var(--type-smaller-font-size) /1.23 var(--font-body);
  --type-label-s: 600 var(--type-tiny-font-size) /1.2 var(--font-heading);
  --type-heading-h1: 600 var(--type-heading-h1-font-size-mobile) /var(--heading-line-height) var(--font-heading);
  --type-heading-h2: 500 var(--type-heading-h2-font-size-mobile) /var(--heading-line-height) var(--font-heading);
  --type-heading-h3: 300 var(--type-heading-h3-font-size-mobile) /var(--heading-line-height) var(--font-heading);
  --type-heading-h4: 400 var(--type-heading-h4-font-size-mobile) /var(--heading-line-height) var(--font-heading);
  --type-heading-h5: 400 var(--type-heading-h5-font-size) /var(--heading-line-height) var(--font-heading);
  --type-heading-h6: 400 var(--type-base-font-size-rem) /var(--heading-line-height) var(--font-heading);
  --type-article-p: 400 var(--type-base-font-size-rem) /var(--font-content-line-height) var(--font-body);
  --gutter: 1rem;
  --top-navigation-height: 4rem;
  --top-navigation-offset: -4rem;
  --top-banner-inner-height: 3.125rem;
  --top-banner-height: calc(var(--top-banner-inner-height) + 0.25rem);
  --top-banner-outer-height: calc(var(--top-banner-height) + 2px);
  --z-index-a11y: 10000;
  --z-index-modal-content: 801;
  --z-index-modal-overlay: 800;
  --z-index-main-header: 700;
  --z-index-sidebar-mobile: 600;
  --z-index-mid: 500;
  --z-index-nav-menu: 200;
  --z-index-search-results: 101;
  --z-index-low: 100;
  --z-index-search-results-home: 99;
  --z-index-back: -1;
  --elem-radius: 0.25rem;
  --focus-effect: 0 0 0 3px var(--accent-primary-engage);
  --form-elem-height: 2rem;
  --top-nav-height: 4rem;
  --article-actions-container-height: 2rem;
  --icon-size: 1rem;
  --sticky-header-without-actions-height: calc(var(--top-nav-height) + 1px);
  --sticky-header-with-actions-height: calc(var(--sticky-header-without-actions-height) + var(--article-actions-container-height) + 1px);
}
@media (min-width: 769px) {
  :root {
    --type-heading-h1: 600 var(--type-heading-h1-font-size) /var(--heading-line-height) var(--font-heading);
    --type-heading-h2: 500 var(--type-heading-h2-font-size) /var(--heading-line-height) var(--font-heading);
    --type-heading-h3: 300 var(--type-heading-h3-font-size) /var(--heading-line-height) var(--font-heading);
    --type-heading-h4: 400 var(--type-heading-h4-font-size) /var(--heading-line-height) var(--font-heading);
  }
}
@media (min-width: 769px) {
  :root {
    --type-heading-h1: 600 var(--type-heading-h1-font-size) /var(--heading-line-height) var(--font-heading);
    --type-heading-h2: 500 var(--type-heading-h2-font-size) /var(--heading-line-height) var(--font-heading);
    --type-heading-h3: 300 var(--type-heading-h3-font-size) /var(--heading-line-height) var(--font-heading);
    --type-heading-h4: 400 var(--type-heading-h4-font-size) /var(--heading-line-height) var(--font-heading);
  }
}
:root {
  --font-fallback: BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;
  --font-body: Inter,var(--font-fallback);
  --font-heading: Inter,var(--font-fallback);
  --font-code: Menlo,Consolas,Monaco,Liberation Mono,Lucida Console,monospace;
  --base-font-size: 100%;
  --base-line-height: 1.2;
  --intermediate-line-height: 1.5;
  --heading-line-height: var(--base-line-height);
  --heading-letter-spacing: -0.031rem;
  --font-content-line-height: 1.75;
  --font-body-strong-weight: 600;
  --type-heading-h1-font-size: 2.488rem;
  --type-heading-h2-font-size: 2.074rem;
  --type-heading-h3-font-size: 1.728rem;
  --type-heading-h4-font-size: 1.44rem;
  --type-heading-h5-font-size: 1.2rem;
  --type-base-font-size-rem: 1rem;
  --type-smaller-font-size: 0.833rem;
  --type-tiny-font-size: 0.694rem;
  --type-heading-h1-font-size-mobile: 1.802rem;
  --type-heading-h2-font-size-mobile: 1.602rem;
  --type-heading-h3-font-size-mobile: 1.424rem;
  --type-heading-h4-font-size-mobile: 1.266rem;
  --type-emphasis-m: var(--font-body-strong-weight) var(--type-smaller-font-size) /1.23 var(--font-body);
  --type-label-s: 600 var(--type-tiny-font-size) /1.2 var(--font-heading);
  --type-heading-h1: 600 var(--type-heading-h1-font-size-mobile) /var(--heading-line-height) var(--font-heading);
  --type-heading-h2: 500 var(--type-heading-h2-font-size-mobile) /var(--heading-line-height) var(--font-heading);
  --type-heading-h3: 300 var(--type-heading-h3-font-size-mobile) /var(--heading-line-height) var(--font-heading);
  --type-heading-h4: 400 var(--type-heading-h4-font-size-mobile) /var(--heading-line-height) var(--font-heading);
  --type-heading-h5: 400 var(--type-heading-h5-font-size) /var(--heading-line-height) var(--font-heading);
  --type-heading-h6: 400 var(--type-base-font-size-rem) /var(--heading-line-height) var(--font-heading);
  --type-article-p: 400 var(--type-base-font-size-rem) /var(--font-content-line-height) var(--font-body);
  --gutter: 1rem;
  --top-navigation-height: 4rem;
  --top-navigation-offset: -4rem;
  --top-banner-inner-height: 3.125rem;
  --top-banner-height: calc(var(--top-banner-inner-height) + 0.25rem);
  --top-banner-outer-height: calc(var(--top-banner-height) + 2px);
  --z-index-a11y: 10000;
  --z-index-modal-content: 801;
  --z-index-modal-overlay: 800;
  --z-index-main-header: 700;
  --z-index-sidebar-mobile: 600;
  --z-index-mid: 500;
  --z-index-nav-menu: 200;
  --z-index-search-results: 101;
  --z-index-low: 100;
  --z-index-search-results-home: 99;
  --z-index-back: -1;
  --elem-radius: 0.25rem;
  --focus-effect: 0 0 0 3px var(--accent-primary-engage);
  --form-elem-height: 2rem;
  --top-nav-height: 4rem;
  --article-actions-container-height: 2rem;
  --icon-size: 1rem;
  --sticky-header-without-actions-height: calc(var(--top-nav-height) + 1px);
  --sticky-header-with-actions-height: calc(var(--sticky-header-without-actions-height) + var(--article-actions-container-height) + 1px);
}
.category-css {
  --background-toc-active:var(--css-accent-background-color);
  --category-color:var(--css-accent-color);
  --category-color-engage:var(--css-accent-engage);
  --category-color-background:var(--css-accent-background-color);
  --mark-color:var(--css-mark-color)
}
.sticky-header-container {
  position:sticky;
  top:0;
  z-index:var(--z-index-main-header)
}
.category-css {
  --background-toc-active:var(--css-accent-background-color);
  --category-color:var(--css-accent-color);
  --category-color-engage:var(--css-accent-engage);
  --category-color-background:var(--css-accent-background-color);
  --mark-color:var(--css-mark-color)
}
@media(min-width:769px) {
  .main-wrapper {
    display:grid;
    gap:3rem;
    grid-template-areas:"sidebar main toc";
    grid-template-columns:minmax(0,1fr) minmax(0,2.5fr) minmax(0,15rem);
    padding-left:1rem;
    padding-right:1rem
  }
  .main-wrapper .toc {
    --offset:var(--sticky-header-with-actions-height);
    display:block;
    grid-area:toc;
    height:fit-content;
    padding-bottom:0
  }
  .main-wrapper .in-nav-toc {
    display:none
  }
}
.container {
  margin-left:auto;
  margin-right:auto;
  max-width:var(--max-width);
  padding-left:var(--gutter);
  padding-right:var(--gutter);
  width:100%
}
.top-navigation {
  background-color:var(--background-primary);
  border-bottom:1px solid var(--border-primary);
  position:relative;
  width:100%
}
.top-navigation .container {
  align-items:center;
  background-color:var(--background-primary);
  display:flex;
  flex-flow:row wrap;
  gap:var(--gutter)
}
@media(min-width:769px) {
  .top-navigation .container {
    background-color:#0000
  }
}
.top-navigation-main {
  display:none;
  justify-content:space-between;
  padding:0;
  width:100%
}
@media(min-width:1px) {
  .top-navigation-main {
    align-items:center;
    display:flex;
    flex:1 1;
    flex-direction:row;
    gap:.5rem;
    left:inherit;
    padding:0;
    position:static;
    top:inherit;
    z-index:inherit
  }
  .show-nav .top-navigation-main {
    flex-direction:row
  }
  .top-navigation-main .main-nav {
    margin-right:auto;
    order:0;
    width:max-content
  }
  .top-navigation-main .header-search {
    order:1
  }
  .top-navigation-main .auth-container {
    order:2
  }
  .top-navigation-main .user-menu {
    order:3
  }
  .top-navigation-main .menu-toggle+.top-level-entry {
    display:inline-flex
  }
}
ul.main-menu {
  box-sizing:border-box;
  list-style:none;
  margin-top:1rem;
  padding:0;
  width:100%
}
@media(min-width:992px) {
  ul.main-menu.show {
    display:flex
  }
  ul.main-menu {
    align-items:center;
    display:flex;
    justify-content:space-around;
    margin:0 auto 0 0
  }
  ul.main-menu li:last-child {
    flex-basis:inherit
  }
  ul.main-menu .menu-toggle,
  ul.main-menu .submenu.show {
    display:none
  }
  ul.main-menu .top-level-entry-container {
    flex-shrink:0
  }
}
@media(min-width:769px) {
  ul.main-menu {
    gap:1rem
  }
}
h1,
h2,
h3 {
  letter-spacing:var(--heading-letter-spacing)
}
h1 {
  font:var(--type-heading-h1);
  margin-bottom:2rem;
  word-break:break-word
}
@media(min-width:769px) {
  h1 {
    font:var(--type-heading-h1)
  }
}
.sidebar-filter-container {
  background:linear-gradient(to bottom,var(--background-primary) 0 calc(100% - 2rem),#0000 100%);
  display:flex;
  flex-direction:column;
  font-size:var(--type-smaller-font-size);
  padding-bottom:2rem;
  padding-right:.5rem;
  padding-top:.5rem
}
.sidebar-filter-container .sidebar-filter {
  align-items:center;
  display:flex;
  margin-bottom:.5rem
}
.article-actions-container {
  align-items:center;
  background-color:var(--background-secondary);
  border-bottom:1px solid var(--border-primary);
  margin:0;
  min-height:var(--article-actions-container-height);
  padding:0;
  position:sticky;
  top:0;
  z-index:var(--z-index-low)
}
@media(min-width:769px) {
  .article-actions-container {
    position:static
  }
  .article-actions-container .bookmark-button-container {
    flex:0 0 40px
  }
}
.document-page .article-actions-container,
.document-page .document-toc-container,
.document-page .generic-loading,
.document-page .main-content,
.document-page .metadata,
.document-page .page-header,
.document-page .sidebar {
  display:flex
}
.article-actions-container .container {
  align-items:center;
  display:flex;
  gap:.5rem;
  justify-content:space-between
}
@media(min-width:769px) {
  .article-actions-container .container {
    padding-left:1rem;
    padding-right:1rem
  }
}
.article-actions {
  margin-left:auto
}
@media(min-width:769px) {
  .article-actions {
    display:block
  }
  .article-actions .article-actions-toggle {
    display:none
  }
}
button,
input,
select,
textarea {
  font:inherit
}
.button,
button {
  -webkit-appearance:none;
  appearance:none;
  background:none;
  border:none
}
.button {
  --button-bg:var(--button-primary-default);
  --button-bg-hover:var(--button-primary-hover);
  --button-bg-active:var(--button-primary-active);
  --button-border-color:var(--button-primary-default);
  --button-focus-effect:var(--focus-effect);
  --button-height:var(--form-elem-height,2rem);
  --button-color:var(--background-primary);
  --button-font:var(--type-emphasis-m);
  --button-padding:0.5rem;
  --button-radius:var(--elem-radius,0.25rem);
  border-radius:var(--button-radius);
  cursor:pointer;
  display:inline-block;
  padding:0;
  text-decoration:none
}
.button.action {
  --button-bg:#0000;
  --button-border-color:var(--button-bg);
  --button-color:var(--text-secondary);
  --button-font:var(--type-label-s);
  --button-bg-hover:var(--button-secondary-hover);
  --button-bg-active:var(--button-secondary-active)
}
.button.action.has-icon {
  --button-font:var(--type-emphasis-m);
  text-transform:none
}
.article-actions-entries {
  display:none;
  list-style:none;
  margin:0;
  padding:0
}
@media(min-width:769px) {
  .article-actions-entries {
    display:flex;
    gap:.5rem
  }
  .article-actions-entries .sidebar-toggle {
    display:none
  }
}
.article-actions-entry {
  align-items:center;
  display:flex;
  position:relative
}
.languages-switcher-menu>.button,
.theme-switcher-menu>.button {
  display:block
}
.button.small,
.button.small .button-wrap {
  --button-height:1.75rem;
  --button-padding:0.25rem
}
.button-wrap {
  align-items:center;
  background-color:var(--button-bg);
  border:1px solid var(--button-border-color);
  border-radius:var(--button-radius);
  color:var(--button-color);
  display:flex;
  font:var(--button-font);
  gap:.25rem;
  height:var(--button-height);
  justify-content:center;
  padding-left:var(--button-padding);
  padding-right:var(--button-padding);
  position:relative
}
.article-actions .button.action .button-wrap {
  text-transform:none
}
h2 {
  font:var(--type-heading-h2);
  margin:4rem 0 .5rem
}
@media(min-width:769px) {
  .sidebar-container {
    --offset:var(--sticky-header-with-actions-height);
    --max-height:calc(100vh - var(--offset));
    max-height:var(--max-height);
    position:sticky;
    top:var(--offset);
    z-index:var(--z-index-sidebar-mobile)
  }
}
@media(min-width:769px) {
  .sidebar-container {
    z-index:auto
  }
  .sidebar-container .sidebar {
    -webkit-mask-image:linear-gradient(180deg,#000 0 calc(100% - 3rem),#0000);
    mask-image:linear-gradient(180deg,#000 0 calc(100% - 3rem),#0000)
  }
}
@media(min-width:769px)and (not (min-height:44rem)) {
  .sidebar-container {
    overflow:auto
  }
}
@media(min-width:769px) {
  .sidebar-container {
    display:contents
  }
  .sidebar-container .sidebar {
    -webkit-mask-image:none;
    mask-image:none
  }
}
.sidebar-container .toc-container,
.sidebar-container.toc-container {
  display:flex;
  flex-direction:column;
  gap:0;
  height:700px;
  -webkit-mask-image:linear-gradient(180deg,#0000 0,#000 3rem calc(100% - 3rem),#0000);
  mask-image:linear-gradient(180deg,#0000 0,#000 3rem calc(100% - 3rem),#0000);
  overflow:auto;
  position:sticky;
  top:var(--offset)
}
.sidebar-container .toc-container .place,
.sidebar-container.toc-container .place {
  margin:1rem 0;
  padding-bottom:3rem
}


@media(min-width:769px) {
  .sidebar-container .toc-container,
  .sidebar-container.toc-container {
    display:flex;
    flex-direction:column;
    gap:0;
    height:calc(100vh - var(--offset));
    -webkit-mask-image:linear-gradient(180deg,#0000 0,#000 3rem calc(100% - 3rem),#0000);
    mask-image:linear-gradient(180deg,#0000 0,#000 3rem calc(100% - 3rem),#0000);
    overflow:auto;
    position:sticky;
    top:var(--offset)
  }
  .sidebar-container .toc-container .place,
  .sidebar-container.toc-container .place {
    margin:1rem 0;
    padding-bottom:3rem
  }
}
.document-toc-heading.document-toc-heading {
  font:var(--type-heading-h5);
  letter-spacing:1.5px;
  margin:0 0 1rem
}
main {
  display:flow-root;
  min-height:80vh
}
.document-page .main-content,
.document-page .sidebar {
  flex-direction:column;
  width:100%
}
.main-wrapper .main-content,
.main-wrapper .sidebar,
.main-wrapper .toc {
  padding-bottom:3rem;
  padding-top:3rem
}
@media(min-width:769px) {
  .main-wrapper {
    display:grid;
    gap:3rem;
    grid-template-areas:"sidebar main";
    grid-template-columns:minmax(0,1fr) minmax(0,2fr);
    padding-left:1.5rem;
    padding-right:3rem
  }
  .main-wrapper .main-content,
  .main-wrapper .sidebar,
  .main-wrapper .toc {
    padding-bottom:3rem;
    padding-top:3rem
  }
  .main-wrapper .sidebar {
    align-self:start;
    grid-area:sidebar;
    padding-top:unset
  }
  .main-wrapper .main-content {
    grid-area:main
  }
}
.page-footer {
  background-color:var(--background-secondary);
  padding:2rem 1rem;
  position:relative
}
.page-footer,
.page-footer a {
  color:var(--text-secondary)
}
.page-footer-grid {
  display:flex;
  flex-direction:column;
  gap:1.5rem;
  margin:0 auto;
  max-width:1440px
}
@media(min-width:426px) {
  .page-footer-grid {
    display:grid;
    gap:2.5rem;
    grid-template-areas:"logo  . " "nav1  nav2" "nav3  nav4" "moz   moz" "legal legal";
    grid-template-columns:1fr 1fr
  }
  .page-footer-logo-col {
    grid-area:logo
  }
  .page-footer-nav-col-1 {
    grid-area:nav1
  }
  .page-footer-nav-col-2 {
    grid-area:nav2
  }
  .page-footer-nav-col-3 {
    grid-area:nav3
  }
  .page-footer-nav-col-4 {
    grid-area:nav4
  }
  .page-footer-app-col {
    grid-area:app
  }
  .page-footer-moz {
    grid-area:moz
  }
  .page-footer-legal {
    grid-area:legal
  }
  .page-footer-app-list {
    flex-direction:row
  }
  .page-footer-app-dl img,
  .page-footer-app-dl svg {
    height:38px
  }
}
@media(min-width:769px) {
  .page-footer-grid {
    gap:1rem;
    grid-template-areas:"logo  nav1  nav2  nav3  nav4" "moz   moz   moz   moz   moz" "legal legal legal legal  . ";
    grid-template-columns:minmax(260px,2fr) repeat(4,minmax(0,1fr))
  }
  .page-footer-app-list {
    flex-direction:column
  }
  .page-footer-app-dl img,
  .page-footer-app-dl svg {
    height:auto
  }
}
@media(min-width:1441px) {
  .page-footer-grid {
    gap:2.5rem
  }
}
.page-footer-moz {
  align-items:center;
  border-top:1px solid var(--border-primary);
  display:flex;
  flex-flow:row wrap;
  gap:2rem;
  padding-top:1.5rem
}
.footer-moz-list {
  display:flex;
  flex-wrap:wrap;
  font-size:var(--type-tiny-font-size);
  gap:1rem
}
.footer-moz-link {
  text-decoration:underline
}
h3 {
  font:var(--type-heading-h3);
  margin:2rem 0 .5rem
}
h2~div~h3,
h2~h3 {
  margin-top:1rem
}
h4 {
  font:var(--type-heading-h4);
  letter-spacing:.5px;
  margin:2rem 0 1rem
}
aside {
  width: 300px;
}
@media(max-width:769px) {
  .sidebar-container {
    visibility:collapse;
  }
  .main-wrapper {
    display:flex;
    margin:0 auto;
  }
  aside {
    width: 0px;
  }
}
ins {
  background-color: #ccffcc;
}
del {
  background-color: #ffcccc;
}
.linkeable {
  cursor:pointer;
     color:blue;
     text-decoration:underline;
}














.timeline {
  -webkit-box-sizing:border-box;
  box-sizing:border-box;
  position:relative
}
.timeline *,
.timeline :after,
.timeline :before {
  -webkit-box-sizing:inherit;
  box-sizing:inherit
}
.timeline:not(.timeline--horizontal):before {
  background-color:#ddd;
  bottom:0;
  content:'';
  left:10px;
  margin-left:-2px;
  position:absolute;
  top:0;
  width:4px;
  z-index:1;
  margin-top: 40px;
  margin-bottom: 40px;
}
.timeline__wrap {
  overflow:hidden;
  position:relative;
  z-index:2;
}
.timeline__item {
  font-size:16px;
  font-size:1rem;
  padding:.625rem 2.5rem .625rem 0;
  position:relative;
  width:90%;
  z-index:2
}
.timeline__item--right {
  left:10px;
  padding:.625rem 0 .625rem 2.5rem
}
.timeline__item--right .timeline__content:before {
  border-bottom:10px solid transparent;
  border-right:12px solid #ccc;
  border-left:none;
  border-top:10px solid transparent;
  left:-12px
}
.timeline__item--right .timeline__content:after {
  border-bottom:9px solid transparent;
  border-right:11px solid #fff;
  border-left:none;
  border-top:9px solid transparent;
  left:-10px
}
.timeline__content {
  background-color:#fff;
  border:1px solid #ccc;
  border-radius:10px;
  color:#333;
  display:block;
  padding:1.25rem;
  position:relative
}
.timeline__content:after,
.timeline__content:before {
  content:'';
  height:0;
  position:absolute;
  -webkit-transform:translateY(-50%);
  -ms-transform:translateY(-50%);
  transform:translateY(-50%);
  top:50%;
  width:0
}
.timeline__content:before {
  border-bottom:10px solid transparent;
  border-left:12px solid #ccc;
  border-top:10px solid transparent;
  right:-12px;
  z-index:1
}
.timeline__content:after {
  border-bottom:9px solid transparent;
  border-left:11px solid #fff;
  border-top:9px solid transparent;
  right:-10px;
  z-index:2
}