@mdn/fred 1.6.2 → 1.8.0

package/out/static/client/{styles-content-section.d18f07ab3d79a1d2.css → styles-content-section.6dc04fb9b3f3d595.css}

@@ -1,2 +1,2 @@
-.code-example{--border:1px solid var(--color-border-primary);border:var(--border);border-radius:.25rem;overflow:hidden}.code-example .example-header{align-items:center;border-bottom:var(--border);display:flex;line-height:var(--font-line-ui);min-height:3.1rem;padding:.5rem 1rem}:is(.code-example .example-header) .language-name{text-transform:uppercase}.code-example pre{background-color:var(--color-background-secondary);display:flex;margin:0;white-space:pre-wrap}:is(.code-example pre) code{background-color:initial;flex-grow:1;flex-shrink:1;font-family:var(--font-family-code);overflow:auto;padding:1rem}.hidden:is(.code-example pre),[class*=interactive-example]:is(.code-example pre){display:none}:is(.example-good:is(.code-example pre),.example-bad:is(.code-example pre)):after{content:"";display:inline-block;flex-shrink:0;height:1.24rem;margin:1.255rem 1rem;-webkit-mask-size:cover;mask-size:cover;width:1.24rem}.example-good:is(.code-example pre){background-color:var(--color-background-green)}.example-good:is(.code-example pre):after{background-color:var(--color-text-green);-webkit-mask-image:url(/static/client/circle-check.205f48f66c3c9d17.svg);mask-image:url(/static/client/circle-check.205f48f66c3c9d17.svg)}.example-bad:is(.code-example pre){background-color:var(--color-background-red)}.example-bad:is(.code-example pre):after{background-color:var(--color-text-red);-webkit-mask-image:url(/static/client/circle-x.4b1c3fa0511867e7.svg);mask-image:url(/static/client/circle-x.4b1c3fa0511867e7.svg)}.code-example:has(.hidden,[class*=interactive-example]){display:none}.code-example iframe,.code-example mdn-play-runner{border:none;box-sizing:initial;display:block;padding:1rem}.prev-next{border-width:1px;border-bottom:1px solid var(--color-border-primary);border-left:0 solid var(--color-border-primary);border-right:0 solid var(--color-border-primary);border-top:1px solid var(--color-border-primary);display:flex;flex-wrap:nowrap;gap:1rem;justify-content:space-between;list-style:none;margin:0;padding:.5rem;width:100%}.prev-next a{color:var(--color-link-normal)!important;text-wrap:balance}:is(.prev-next a):visited{color:var(--color-link-visited)!important}@media (width <= 426px){.prev-next{display:grid;grid-template-areas:"title title" "prev next"}.prev-next li.menu{grid-area:title;justify-self:center}.prev-next li.prev{grid-area:prev;justify-self:start}.prev-next li.next{grid-area:next;justify-self:end}}.prev-next .next a,.prev-next .prev a{align-items:center;display:flex;gap:.25rem}.prev-next li{background:none;display:flex;flex-wrap:nowrap;place-items:center}:is(.prev-next li) .button{background-color:inherit;border:inherit;color:inherit}:is(:is(.prev-next li) .button):hover{-webkit-text-decoration:underline;text-decoration:underline}.next:is(.prev-next li) a:after,.prev:is(.prev-next li) a:before{background-color:currentcolor;content:"";display:inline-block;height:1em;-webkit-mask-size:cover;mask-size:cover;vertical-align:middle;width:1em}.prev:is(.prev-next li){margin-right:auto}.prev:is(.prev-next li) a:before{-webkit-mask-image:url(/static/client/arrow-left.29a44bc5a550fe38.svg);mask-image:url(/static/client/arrow-left.29a44bc5a550fe38.svg)}.prev:is(.prev-next li)~.menu:is(.prev-next li){margin-left:auto;margin-right:auto;text-align:center}.next:is(.prev-next li){margin-left:auto}.next:is(.prev-next li) a:after{-webkit-mask-image:url(/static/client/arrow-right.648145f00e77b7f0.svg);mask-image:url(/static/client/arrow-right.648145f00e77b7f0.svg)}.callout,.notecard{background-color:var(--color-background-secondary);border-inline-start:2px solid var(--accent-color,var(--color-text-secondary));border-radius:.25em;color:var(--color-text-primary);margin-block:1em;padding-block:1px;padding-inline:1em;padding-inline-start:3em;position:relative}.experimental:is(.notecard,.callout),.note:is(.notecard,.callout),.secure:is(.notecard,.callout){background-color:var(--color-background-blue);--accent-color:var(--color-text-blue)}.deprecated:is(.notecard,.callout),.nonstandard:is(.notecard,.callout),.warning:is(.notecard,.callout){background-color:var(--color-background-red);--accent-color:var(--color-text-red)}.tip:is(.notecard,.callout){background-color:var(--color-background-green);--accent-color:var(--color-text-green)}:is(.deprecated:is(.notecard,.callout),.experimental:is(.notecard,.callout),.nonstandard:is(.notecard,.callout),.note:is(.notecard,.callout),.secure:is(.notecard,.callout),.tip:is(.notecard,.callout),.warning:is(.notecard,.callout),.worker:is(.notecard,.callout)):before{background-color:var(--accent-color,var(--color-text-secondary));content:"";display:block;height:1em;left:1em;-webkit-mask-size:cover;mask-size:cover;position:absolute;top:1.45em;width:1em}.deprecated:is(.notecard,.callout):before{-webkit-mask-image:url(/static/client/trash-2.73b28bc66fb8543c.svg);mask-image:url(/static/client/trash-2.73b28bc66fb8543c.svg)}.experimental:is(.notecard,.callout):before{-webkit-mask-image:url(/static/client/flask-conical.c16b3d71f14f31d1.svg);mask-image:url(/static/client/flask-conical.c16b3d71f14f31d1.svg)}.nonstandard:is(.notecard,.callout):before{-webkit-mask-image:url(/static/client/triangle-alert.cff4c57ccef57da3.svg);mask-image:url(/static/client/triangle-alert.cff4c57ccef57da3.svg)}.note:is(.notecard,.callout):before{-webkit-mask-image:url(/static/client/info.d40b80f84482feba.svg);mask-image:url(/static/client/info.d40b80f84482feba.svg)}.secure:is(.notecard,.callout):before{-webkit-mask-image:url(/static/client/lock.4befe79c52ccec2a.svg);mask-image:url(/static/client/lock.4befe79c52ccec2a.svg)}.tip:is(.notecard,.callout):before{-webkit-mask-image:url(/static/client/lightbulb.f54f9e803373ffd2.svg);mask-image:url(/static/client/lightbulb.f54f9e803373ffd2.svg)}.warning:is(.notecard,.callout):before{-webkit-mask-image:url(/static/client/triangle-alert.cff4c57ccef57da3.svg);mask-image:url(/static/client/triangle-alert.cff4c57ccef57da3.svg)}.worker:is(.notecard,.callout):before{-webkit-mask-image:url(/static/client/cog.f23af856fab34421.svg);mask-image:url(/static/client/cog.f23af856fab34421.svg)}:is(.code-example,.css-formal-syntax) .token.cdata,:is(.code-example,.css-formal-syntax) .token.comment,:is(.code-example,.css-formal-syntax) .token.doctype,:is(.code-example,.css-formal-syntax) .token.prolog{--csstools-light-dark-toggle-360cf513-0:var(--csstools-color-scheme--light) #b3b3b3;color:var(--csstools-light-dark-toggle-360cf513-0,#51565d);color:light-dark(#51565d,#b3b3b3)}:is(.code-example,.css-formal-syntax) .token.punctuation{--csstools-light-dark-toggle-360cf513-1:var(--csstools-color-scheme--light) #b3b3b3;color:var(--csstools-light-dark-toggle-360cf513-1,#51565d);color:light-dark(#51565d,#b3b3b3)}:is(.code-example,.css-formal-syntax) .token.attr-name,:is(.code-example,.css-formal-syntax) .token.builtin,:is(.code-example,.css-formal-syntax) .token.class-name,:is(.code-example,.css-formal-syntax) .token.function,:is(.code-example,.css-formal-syntax) .token.inserted,:is(.code-example,.css-formal-syntax) .token.property,:is(.code-example,.css-formal-syntax) .token.selector{--csstools-light-dark-toggle-360cf513-2:var(--csstools-color-scheme--light) #ff97a0;color:var(--csstools-light-dark-toggle-360cf513-2,#d30038);color:light-dark(#d30038,#ff97a0)}:is(.code-example,.css-formal-syntax) .token.atrule,:is(.code-example,.css-formal-syntax) .token.attr-value{--csstools-light-dark-toggle-360cf513-3:var(--csstools-color-scheme--light) #00d061;color:var(--csstools-light-dark-toggle-360cf513-3,#007936);color:light-dark(#007936,#00d061)}:is(.code-example,.css-formal-syntax) .token.keyword{--csstools-light-dark-toggle-360cf513-4:var(--csstools-color-scheme--light) #c1cff1;color:var(--csstools-light-dark-toggle-360cf513-4,#0069c2);color:light-dark(#0069c2,#c1cff1)}:is(.code-example,.css-formal-syntax) .token.boolean,:is(.code-example,.css-formal-syntax) .token.char,:is(.code-example,.css-formal-syntax) .token.constant,:is(.code-example,.css-formal-syntax) .token.deleted,:is(.code-example,.css-formal-syntax) .token.number,:is(.code-example,.css-formal-syntax) .token.string,:is(.code-example,.css-formal-syntax) .token.symbol,:is(.code-example,.css-formal-syntax) .token.tag{--csstools-light-dark-toggle-360cf513-5:var(--csstools-color-scheme--light) #00d061;color:var(--csstools-light-dark-toggle-360cf513-5,#007936);color:light-dark(#007936,#00d061)}:is(.code-example,.css-formal-syntax) .token.builtin,:is(.code-example,.css-formal-syntax) .token.inserted,:is(.code-example,.css-formal-syntax) .token.selector,:is(.code-example,.css-formal-syntax) .token.template-string>.token.string{--csstools-light-dark-toggle-360cf513-6:var(--csstools-color-scheme--light) #bea5ff;color:var(--csstools-light-dark-toggle-360cf513-6,#872bff);color:light-dark(#872bff,#bea5ff)}:is(.code-example,.css-formal-syntax) .token.bold,:is(.code-example,.css-formal-syntax) .token.important{font-weight:700}:is(.code-example,.css-formal-syntax) .token.italic{font-style:italic}:is(.code-example,.css-formal-syntax) .token.entity{cursor:help}.content-section{line-height:var(--font-line-content)}.content-section :target{scroll-margin-top:var(--sticky-header-height)}.content-section h1,.content-section h2,.content-section h3,.content-section h4,.content-section h5,.content-section h6{font-weight:var(--font-weight-normal);margin:1rem 0 0}.content-section h1{font-size:var(--font-size-largest);margin-top:0}.content-section h2{font-size:var(--font-size-larger)}.content-section h3{font-size:var(--font-size-large)}.content-section h4{font-size:var(--font-size-normal);letter-spacing:.05em;text-transform:uppercase}.content-section h5,.content-section h6{font-size:var(--font-size-normal);font-weight:var(--font-weight-bold)}:is(.content-section a):visited{color:var(--color-link-visited)}:is(.content-section a):not([href^="#"]){-webkit-text-decoration:underline;text-decoration:underline}:is(.content-section a):not([href^="#"]):hover,[href^="#"]:is(.content-section a){-webkit-text-decoration:none;text-decoration:none}[href^="#"]:is(.content-section a):hover{-webkit-text-decoration:underline;text-decoration:underline}.content-section blockquote{border-inline-start:.25rem solid var(--color-border-primary);color:var(--color-text-secondary);margin-inline:0}:is(.content-section blockquote)>p{padding:1rem 2rem}.content-section code,.content-section pre{background-color:var(--color-background-secondary);font-family:var(--font-family-code)}.content-section pre{white-space:pre-wrap}.content-section pre:not(.code-example pre){border:1px solid var(--color-border-primary);border-radius:.25rem;overflow:auto;padding:1rem}.css-formal-syntax:is(.content-section pre:not(.code-example pre)){border-bottom-left-radius:0;border-bottom-right-radius:0;margin-bottom:0;text-wrap:wrap}.css-formal-syntax:is(.content-section pre:not(.code-example pre))~footer{border:1px solid var(--color-border-primary);border-bottom-left-radius:.25rem;border-bottom-right-radius:.25rem;border-top:0;margin-bottom:1rem;padding:.5rem 1rem}.content-section code{border-radius:.25em;padding:.125em .25em}.content-section img{background-color:var(--color-background-secondary);border:1px solid var(--color-border-primary);border-radius:.25rem;display:block;margin:2rem auto}.content-section table{border-collapse:collapse;width:100%}:is(.content-section table) tr{background-color:var(--color-background-primary)}:is(.content-section table) thead tr,:is(.content-section table) tr:nth-of-type(2n){background-color:var(--color-background-page)}:is(.content-section table) td,:is(.content-section table) th{border:1px solid var(--color-border-primary);padding:.5rem .75rem}:is(.content-section table) th{font-weight:var(--font-weight-normal);text-align:left}.properties:is(.content-section table) td,.properties:is(.content-section table) th{border-width:1px 0}.properties:is(.content-section table) th{background-color:initial;font-weight:var(--font-weight-bold)}.content-section .code-example,.content-section mdn-code-example,.content-section mdn-live-sample-result{margin:1rem 0}:is(.content-section .code-example,.content-section mdn-code-example,.content-section mdn-live-sample-result)+:is(.content-section .code-example,.content-section mdn-code-example,.content-section mdn-live-sample-result){margin-top:1.5rem}.content-section interactive-example{display:block;height:375px;margin:1rem 0}[name^="JavaScript Demo:" i]:is(.content-section interactive-example){height:444px}[height=shorter]:is(.content-section interactive-example){height:364px}[height=taller]:is(.content-section interactive-example){height:654px}[height=tabbed-shorter]:is(.content-section interactive-example){height:351px;margin-top:1.5rem}[height=tabbed-standard]:is(.content-section interactive-example){height:421px}[height=tabbed-taller]:is(.content-section interactive-example){height:631px}@media (width <= 992px){.content-section interactive-example{height:675px}[name^="JavaScript Demo:" i]:is(.content-section interactive-example){height:513px}[height=shorter]:is(.content-section interactive-example){height:433px}[height=taller]:is(.content-section interactive-example){height:725px}[height=tabbed-shorter]:is(.content-section interactive-example){height:487px}[height=tabbed-standard]:is(.content-section interactive-example){height:548px}[height=tabbed-taller]:is(.content-section interactive-example){height:774px}}:is(.content-section dl) dl{border-left:1px solid var(--color-border-primary);padding-left:1rem}:is(.content-section dl) dd{margin-left:1rem}:is(:is(.content-section dl) dd) p:first-child{margin-top:.5rem}:is(.content-section dl) ul{margin:1rem 0 2rem}:is(.content-section dl) dt a[href^="#"]{color:inherit}:is(:is(.content-section dl) dt a[href^="#"]):hover:before{color:var(--color-text-secondary);content:"#";font-size:var(--font-size-small);margin-left:-.9em;margin-top:.3em;position:absolute}:is(.content-section ul.specifications-list) li:has(details){list-style:none;margin-left:-1.25rem}:is(.content-section ul.specifications-list) details{width:100%}[open]:is(:is(.content-section ul.specifications-list) details)>summary{margin-bottom:.5rem}:is([open]:is(:is(.content-section ul.specifications-list) details)>summary):before{transform:rotate(90deg)}:is(:is(.content-section ul.specifications-list) details) summary{align-items:center;cursor:pointer;display:flex}:is(:is(:is(.content-section ul.specifications-list) details) summary):before{background-color:currentcolor;content:"";display:inline-block;flex-shrink:0;height:1rem;margin:.125rem;-webkit-mask-image:url(/static/client/chevron-right.a81fc439dd5e4839.svg);mask-image:url(/static/client/chevron-right.a81fc439dd5e4839.svg);-webkit-mask-size:cover;mask-size:cover;width:1rem}:is(:is(:is(.content-section ul.specifications-list) details) summary):hover{background-color:var(--color-background-secondary)}:is(:is(:is(.content-section ul.specifications-list) details) summary):hover:has(a:hover){background-color:unset}.content-section.article-footer{margin:2rem 0}
-/*# sourceMappingURL=styles-content-section.d18f07ab3d79a1d2.css.map*/
+.code-example{--border:1px solid var(--color-border-primary);border:var(--border);border-radius:.25rem;overflow:hidden}.code-example .example-header{align-items:center;border-bottom:var(--border);display:flex;line-height:var(--font-line-ui);min-height:3.1rem;padding:.5rem 1rem}:is(.code-example .example-header) .language-name{text-transform:uppercase}.code-example pre{background-color:var(--color-background-secondary);display:flex;margin:0;white-space:pre-wrap}:is(.code-example pre) code{background-color:initial;flex-grow:1;flex-shrink:1;font-family:var(--font-family-code);overflow:auto;padding:1rem}.hidden:is(.code-example pre),[class*=interactive-example]:is(.code-example pre){display:none}:is(.example-good:is(.code-example pre),.example-bad:is(.code-example pre)):after{content:"";display:inline-block;flex-shrink:0;height:1.24rem;margin:1.255rem 1rem;-webkit-mask-size:cover;mask-size:cover;width:1.24rem}.example-good:is(.code-example pre){background-color:var(--color-background-green)}.example-good:is(.code-example pre):after{background-color:var(--color-text-green);-webkit-mask-image:url(/static/client/circle-check.205f48f66c3c9d17.svg);mask-image:url(/static/client/circle-check.205f48f66c3c9d17.svg)}.example-bad:is(.code-example pre){background-color:var(--color-background-red)}.example-bad:is(.code-example pre):after{background-color:var(--color-text-red);-webkit-mask-image:url(/static/client/circle-x.4b1c3fa0511867e7.svg);mask-image:url(/static/client/circle-x.4b1c3fa0511867e7.svg)}.code-example:has(.hidden,[class*=interactive-example]){display:none}.code-example iframe,.code-example mdn-play-runner{border:none;box-sizing:initial;display:block;padding:1rem}.prev-next{border-width:1px;border-bottom:1px solid var(--color-border-primary);border-left:0 solid var(--color-border-primary);border-right:0 solid var(--color-border-primary);border-top:1px solid var(--color-border-primary);display:flex;flex-wrap:nowrap;gap:1rem;justify-content:space-between;list-style:none;margin:0;padding:.5rem;width:100%}.prev-next a{color:var(--color-link-normal)!important;text-wrap:balance}:is(.prev-next a):visited{color:var(--color-link-visited)!important}@media (width <= 426px){.prev-next{display:grid;grid-template-areas:"title title" "prev next"}.prev-next li.menu{grid-area:title;justify-self:center}.prev-next li.prev{grid-area:prev;justify-self:start}.prev-next li.next{grid-area:next;justify-self:end}}.prev-next .next a,.prev-next .prev a{align-items:center;display:flex;gap:.25rem}.prev-next li{background:none;display:flex;flex-wrap:nowrap;place-items:center}:is(.prev-next li) .button{background-color:inherit;border:inherit;color:inherit}:is(:is(.prev-next li) .button):hover{-webkit-text-decoration:underline;text-decoration:underline}.next:is(.prev-next li) a:after,.prev:is(.prev-next li) a:before{background-color:currentcolor;content:"";display:inline-block;height:1em;-webkit-mask-size:cover;mask-size:cover;vertical-align:middle;width:1em}.prev:is(.prev-next li){margin-right:auto}.prev:is(.prev-next li) a:before{-webkit-mask-image:url(/static/client/arrow-left.29a44bc5a550fe38.svg);mask-image:url(/static/client/arrow-left.29a44bc5a550fe38.svg)}.prev:is(.prev-next li)~.menu:is(.prev-next li){margin-left:auto;margin-right:auto;text-align:center}.next:is(.prev-next li){margin-left:auto}.next:is(.prev-next li) a:after{-webkit-mask-image:url(/static/client/arrow-right.648145f00e77b7f0.svg);mask-image:url(/static/client/arrow-right.648145f00e77b7f0.svg)}.callout,.notecard{background-color:var(--color-background-secondary);border-inline-start:2px solid var(--accent-color,var(--color-text-secondary));border-radius:.25em;color:var(--color-text-primary);margin-block:1em;padding-block:1px;padding-inline:1em;padding-inline-start:3em;position:relative}.experimental:is(.notecard,.callout),.note:is(.notecard,.callout),.secure:is(.notecard,.callout){background-color:var(--color-background-blue);--accent-color:var(--color-text-blue)}.deprecated:is(.notecard,.callout),.nonstandard:is(.notecard,.callout),.warning:is(.notecard,.callout){background-color:var(--color-background-red);--accent-color:var(--color-text-red)}.tip:is(.notecard,.callout){background-color:var(--color-background-green);--accent-color:var(--color-text-green)}:is(.deprecated:is(.notecard,.callout),.experimental:is(.notecard,.callout),.nonstandard:is(.notecard,.callout),.note:is(.notecard,.callout),.secure:is(.notecard,.callout),.tip:is(.notecard,.callout),.warning:is(.notecard,.callout),.worker:is(.notecard,.callout)):before{background-color:var(--accent-color,var(--color-text-secondary));content:"";display:block;height:1em;left:1em;-webkit-mask-size:cover;mask-size:cover;position:absolute;top:1.45em;width:1em}.deprecated:is(.notecard,.callout):before{-webkit-mask-image:url(/static/client/trash-2.73b28bc66fb8543c.svg);mask-image:url(/static/client/trash-2.73b28bc66fb8543c.svg)}.experimental:is(.notecard,.callout):before{-webkit-mask-image:url(/static/client/flask-conical.c16b3d71f14f31d1.svg);mask-image:url(/static/client/flask-conical.c16b3d71f14f31d1.svg)}.nonstandard:is(.notecard,.callout):before{-webkit-mask-image:url(/static/client/triangle-alert.cff4c57ccef57da3.svg);mask-image:url(/static/client/triangle-alert.cff4c57ccef57da3.svg)}.note:is(.notecard,.callout):before{-webkit-mask-image:url(/static/client/info.d40b80f84482feba.svg);mask-image:url(/static/client/info.d40b80f84482feba.svg)}.secure:is(.notecard,.callout):before{-webkit-mask-image:url(/static/client/lock.4befe79c52ccec2a.svg);mask-image:url(/static/client/lock.4befe79c52ccec2a.svg)}.tip:is(.notecard,.callout):before{-webkit-mask-image:url(/static/client/lightbulb.f54f9e803373ffd2.svg);mask-image:url(/static/client/lightbulb.f54f9e803373ffd2.svg)}.warning:is(.notecard,.callout):before{-webkit-mask-image:url(/static/client/triangle-alert.cff4c57ccef57da3.svg);mask-image:url(/static/client/triangle-alert.cff4c57ccef57da3.svg)}.worker:is(.notecard,.callout):before{-webkit-mask-image:url(/static/client/cog.f23af856fab34421.svg);mask-image:url(/static/client/cog.f23af856fab34421.svg)}:is(.code-example,.css-formal-syntax) .token.cdata,:is(.code-example,.css-formal-syntax) .token.comment,:is(.code-example,.css-formal-syntax) .token.doctype,:is(.code-example,.css-formal-syntax) .token.prolog{--csstools-light-dark-toggle-360cf513-0:var(--csstools-color-scheme--light) #b3b3b3;color:var(--csstools-light-dark-toggle-360cf513-0,#51565d);color:light-dark(#51565d,#b3b3b3)}:is(.code-example,.css-formal-syntax) .token.punctuation{--csstools-light-dark-toggle-360cf513-1:var(--csstools-color-scheme--light) #b3b3b3;color:var(--csstools-light-dark-toggle-360cf513-1,#51565d);color:light-dark(#51565d,#b3b3b3)}:is(.code-example,.css-formal-syntax) .token.attr-name,:is(.code-example,.css-formal-syntax) .token.builtin,:is(.code-example,.css-formal-syntax) .token.class-name,:is(.code-example,.css-formal-syntax) .token.function,:is(.code-example,.css-formal-syntax) .token.inserted,:is(.code-example,.css-formal-syntax) .token.property,:is(.code-example,.css-formal-syntax) .token.selector{--csstools-light-dark-toggle-360cf513-2:var(--csstools-color-scheme--light) #ff97a0;color:var(--csstools-light-dark-toggle-360cf513-2,#d30038);color:light-dark(#d30038,#ff97a0)}:is(.code-example,.css-formal-syntax) .token.atrule,:is(.code-example,.css-formal-syntax) .token.attr-value{--csstools-light-dark-toggle-360cf513-3:var(--csstools-color-scheme--light) #00d061;color:var(--csstools-light-dark-toggle-360cf513-3,#007936);color:light-dark(#007936,#00d061)}:is(.code-example,.css-formal-syntax) .token.keyword{--csstools-light-dark-toggle-360cf513-4:var(--csstools-color-scheme--light) #c1cff1;color:var(--csstools-light-dark-toggle-360cf513-4,#0069c2);color:light-dark(#0069c2,#c1cff1)}:is(.code-example,.css-formal-syntax) .token.boolean,:is(.code-example,.css-formal-syntax) .token.char,:is(.code-example,.css-formal-syntax) .token.constant,:is(.code-example,.css-formal-syntax) .token.deleted,:is(.code-example,.css-formal-syntax) .token.number,:is(.code-example,.css-formal-syntax) .token.string,:is(.code-example,.css-formal-syntax) .token.symbol,:is(.code-example,.css-formal-syntax) .token.tag{--csstools-light-dark-toggle-360cf513-5:var(--csstools-color-scheme--light) #00d061;color:var(--csstools-light-dark-toggle-360cf513-5,#007936);color:light-dark(#007936,#00d061)}:is(.code-example,.css-formal-syntax) .token.builtin,:is(.code-example,.css-formal-syntax) .token.inserted,:is(.code-example,.css-formal-syntax) .token.selector,:is(.code-example,.css-formal-syntax) .token.template-string>.token.string{--csstools-light-dark-toggle-360cf513-6:var(--csstools-color-scheme--light) #bea5ff;color:var(--csstools-light-dark-toggle-360cf513-6,#872bff);color:light-dark(#872bff,#bea5ff)}:is(.code-example,.css-formal-syntax) .token.bold,:is(.code-example,.css-formal-syntax) .token.important{font-weight:700}:is(.code-example,.css-formal-syntax) .token.italic{font-style:italic}:is(.code-example,.css-formal-syntax) .token.entity{cursor:help}.content-section{line-height:var(--font-line-content)}.content-section :target{scroll-margin-top:var(--sticky-header-height)}.content-section h1,.content-section h2,.content-section h3,.content-section h4,.content-section h5,.content-section h6{font-weight:var(--font-weight-normal);margin:1rem 0 0}.content-section h1{font-size:var(--font-size-largest);margin-top:0}.content-section h2{font-size:var(--font-size-larger)}.content-section h3{font-size:var(--font-size-large)}.content-section h4{font-size:var(--font-size-normal);letter-spacing:.05em;text-transform:uppercase}.content-section h5,.content-section h6{font-size:var(--font-size-normal);font-weight:var(--font-weight-bold)}:is(.content-section a):visited{color:var(--color-link-visited)}:is(.content-section a):not([href^="#"]){-webkit-text-decoration:underline;text-decoration:underline}:is(.content-section a):not([href^="#"]):hover,[href^="#"]:is(.content-section a){-webkit-text-decoration:none;text-decoration:none}[href^="#"]:is(.content-section a):hover{-webkit-text-decoration:underline;text-decoration:underline}.content-section blockquote{border-inline-start:.25rem solid var(--color-border-primary);color:var(--color-text-secondary);margin-inline:0}:is(.content-section blockquote)>p{padding:1rem 2rem}.content-section code,.content-section pre{background-color:var(--color-background-secondary);font-family:var(--font-family-code)}.content-section pre{white-space:pre-wrap}.content-section pre:not(.code-example pre){border:1px solid var(--color-border-primary);border-radius:.25rem;overflow:auto;padding:1rem}.css-formal-syntax:is(.content-section pre:not(.code-example pre)){border-bottom-left-radius:0;border-bottom-right-radius:0;margin-bottom:0;text-wrap:wrap}.css-formal-syntax:is(.content-section pre:not(.code-example pre))~footer{border:1px solid var(--color-border-primary);border-bottom-left-radius:.25rem;border-bottom-right-radius:.25rem;border-top:0;margin-bottom:1rem;padding:.5rem 1rem}.content-section code{border-radius:var(--radius-normal);padding:.125em .25em}.content-section kbd{background-color:var(--color-background-primary);border:solid var(--color-border-primary);border-radius:var(--radius-normal);border-width:1px 1px 2px;color:var(--color-text-secondary);font-family:var(--font-family-code);padding:.0625em .125em}.content-section img{background-color:var(--color-white);border:1px solid var(--color-border-primary);border-radius:.25rem;display:block;margin:2rem auto}.content-section table{border-collapse:collapse;width:100%}:is(.content-section table) tr{background-color:var(--color-background-primary)}:is(.content-section table) thead tr,:is(.content-section table) tr:nth-of-type(2n){background-color:var(--color-background-page)}:is(.content-section table) td,:is(.content-section table) th{border:1px solid var(--color-border-primary);padding:.5rem .75rem}:is(.content-section table) th{font-weight:var(--font-weight-normal);text-align:left}.properties:is(.content-section table) td,.properties:is(.content-section table) th{border-width:1px 0}.properties:is(.content-section table) th{background-color:initial;font-weight:var(--font-weight-bold)}.content-section .code-example,.content-section mdn-code-example,.content-section mdn-live-sample-result{margin:1rem 0}:is(.content-section .code-example,.content-section mdn-code-example,.content-section mdn-live-sample-result)+:is(.content-section .code-example,.content-section mdn-code-example,.content-section mdn-live-sample-result){margin-top:1.5rem}.content-section interactive-example{display:block;height:375px;margin:1rem 0}[name^="JavaScript Demo:" i]:is(.content-section interactive-example){height:444px}[height=shorter]:is(.content-section interactive-example){height:364px}[height=taller]:is(.content-section interactive-example){height:654px}[height=tabbed-shorter]:is(.content-section interactive-example){height:351px;margin-top:1.5rem}[height=tabbed-standard]:is(.content-section interactive-example){height:421px}[height=tabbed-taller]:is(.content-section interactive-example){height:631px}@media (width <= 992px){.content-section interactive-example{height:675px}[name^="JavaScript Demo:" i]:is(.content-section interactive-example){height:513px}[height=shorter]:is(.content-section interactive-example){height:433px}[height=taller]:is(.content-section interactive-example){height:725px}[height=tabbed-shorter]:is(.content-section interactive-example){height:487px}[height=tabbed-standard]:is(.content-section interactive-example){height:548px}[height=tabbed-taller]:is(.content-section interactive-example){height:774px}}:is(.content-section dl) dl{border-left:1px solid var(--color-border-primary);padding-left:1rem}:is(.content-section dl) dd{margin-left:1rem}:is(:is(.content-section dl) dd) p:first-child{margin-top:.5rem}:is(.content-section dl) ul{margin:1rem 0 2rem}:is(.content-section dl) dt a[href^="#"]{color:inherit}:is(:is(.content-section dl) dt a[href^="#"]):hover:before{color:var(--color-text-secondary);content:"#";font-size:var(--font-size-small);margin-left:-.9em;margin-top:.3em;position:absolute}:is(.content-section ul.specifications-list) li:has(details){list-style:none;margin-left:-1.25rem}:is(.content-section ul.specifications-list) details{width:100%}[open]:is(:is(.content-section ul.specifications-list) details)>summary{margin-bottom:.5rem}:is([open]:is(:is(.content-section ul.specifications-list) details)>summary):before{transform:rotate(90deg)}:is(:is(.content-section ul.specifications-list) details) summary{align-items:center;cursor:pointer;display:flex}:is(:is(:is(.content-section ul.specifications-list) details) summary):before{background-color:currentcolor;content:"";display:inline-block;flex-shrink:0;height:1rem;margin:.125rem;-webkit-mask-image:url(/static/client/chevron-right.a81fc439dd5e4839.svg);mask-image:url(/static/client/chevron-right.a81fc439dd5e4839.svg);-webkit-mask-size:cover;mask-size:cover;width:1rem}:is(:is(:is(.content-section ul.specifications-list) details) summary):hover{background-color:var(--color-background-secondary)}:is(:is(:is(.content-section ul.specifications-list) details) summary):hover:has(a:hover){background-color:unset}.content-section.article-footer{margin:2rem 0}
+/*# sourceMappingURL=styles-content-section.6dc04fb9b3f3d595.css.map*/

package/out/static/client/{styles-content-section.d18f07ab3d79a1d2.css.map → styles-content-section.6dc04fb9b3f3d595.css.map}

@@ -1 +1 @@
-{"version":3,"file":"styles-content-section.d18f07ab3d79a1d2.css","sources":["webpack://@mdn/fred/./components/code-example/common.css","webpack://@mdn/fred/./components/prev-next/index.css","webpack://@mdn/fred/./components/notecard/index.css","webpack://@mdn/fred/./components/code-example/prism.css","webpack://@mdn/fred/./components/content-section/server.css"],"sourcesContent":[".code-example {\n  --border: 1px solid var(--color-border-primary);\n  overflow: hidden;\n  border: var(--border);\n  border-radius: 0.25rem;\n}.code-example .example-header {\n    display: flex;\n\n    align-items: center;\n\n    min-height: 3.1rem;\n\n    padding: 0.5rem 1rem;\n\n    line-height: var(--font-line-ui);\n\n    border-bottom: var(--border);\n  }:is(.code-example .example-header) .language-name {\n      text-transform: uppercase;\n    }.code-example pre {\n    display: flex;\n\n    margin: 0;\n\n    white-space: pre-wrap;\n\n    background-color: var(--color-background-secondary);\n  }:is(.code-example pre) code {\n      flex-grow: 1;\n      flex-shrink: 1;\n\n      padding: 1rem;\n\n      overflow: auto;\n\n      font-family: var(--font-family-code);\n\n      background-color: transparent;\n    }.hidden:is(.code-example pre),[class*=\"interactive-example\"]:is(.code-example pre) {\n      display: none;\n    }:is(.example-good:is(.code-example pre),.example-bad:is(.code-example pre))::after {\n        display: inline-block;\n\n        flex-shrink: 0;\n\n        width: 1.24rem;\n        height: 1.24rem;\n\n        margin: 1.255rem 1rem;\n\n        content: \"\";\n\n        -webkit-mask-size: cover;\n\n                mask-size: cover;\n      }.example-good:is(.code-example pre) {\n      background-color: var(--color-background-green);\n    }.example-good:is(.code-example pre)::after {\n        background-color: var(--color-text-green);\n        -webkit-mask-image: url(\"../icon/circle-check.svg\");\n                mask-image: url(\"../icon/circle-check.svg\");\n      }.example-bad:is(.code-example pre) {\n      background-color: var(--color-background-red);\n    }.example-bad:is(.code-example pre)::after {\n        background-color: var(--color-text-red);\n        -webkit-mask-image: url(\"../icon/circle-x.svg\");\n                mask-image: url(\"../icon/circle-x.svg\");\n      }.code-example:has(.hidden,[class*=\"interactive-example\"]) {\n    /* TODO: we might want to fix this in rari */\n    display: none;\n  }.code-example iframe,.code-example mdn-play-runner {\n    box-sizing: content-box;\n    display: block;\n\n    padding: 1rem;\n\n    border: none;\n  }\n","/* Tutorial nav. */\n.prev-next {\n  display: flex;\n\n  flex-wrap: nowrap;\n\n  gap: 1rem;\n  justify-content: space-between;\n\n  width: 100%;\n\n  padding: 0.5rem;\n  margin: 0;\n\n  list-style: none;\n\n  border: 1px solid var(--color-border-primary);\n  border-width: 1px 0;\n}\n.prev-next a {\n    color: var(--color-link-normal) !important;\n    text-wrap: balance;\n  }\n:is(.prev-next a):visited {\n      color: var(--color-link-visited) !important;\n    }\n@media (width <= 426px) {\n.prev-next {\n    display: grid;\n    grid-template-areas:\n      \"title title\"\n      \"prev next\";\n}\n\n    .prev-next li.menu {\n      grid-area: title;\n      justify-self: center;\n    }\n\n    .prev-next li.prev {\n      grid-area: prev;\n      justify-self: start;\n    }\n\n    .prev-next li.next {\n      grid-area: next;\n      justify-self: end;\n    }\n  }\n.prev-next .prev a,.prev-next .next a {\n    display: flex;\n    gap: 0.25rem;\n    align-items: center;\n  }\n.prev-next li {\n    display: flex;\n\n    flex-wrap: nowrap;\n\n    place-items: center;\n\n    background: none;\n  }\n:is(.prev-next li) .button {\n      color: inherit;\n      background-color: inherit;\n      border: inherit;\n    }\n:is(:is(.prev-next li) .button):hover {\n        -webkit-text-decoration: underline;\n        text-decoration: underline;\n      }\n.prev:is(.prev-next li) a::before,.next:is(.prev-next li) a::after {\n      display: inline-block;\n\n      width: 1em;\n      height: 1em;\n\n      vertical-align: middle;\n\n      content: \"\";\n\n      background-color: currentcolor;\n\n      -webkit-mask-size: cover;\n\n              mask-size: cover;\n    }\n.prev:is(.prev-next li) {\n      margin-right: auto;\n    }\n.prev:is(.prev-next li) a::before {\n        -webkit-mask-image: url(\"../icon/arrow-left.svg\");\n                mask-image: url(\"../icon/arrow-left.svg\");\n      }\n.prev:is(.prev-next li) ~ .menu:is(.prev-next li) {\n      margin-right: auto;\n      margin-left: auto;\n      text-align: center;\n    }\n.next:is(.prev-next li) {\n      margin-left: auto;\n    }\n.next:is(.prev-next li) a::after {\n        -webkit-mask-image: url(\"../icon/arrow-right.svg\");\n                mask-image: url(\"../icon/arrow-right.svg\");\n      }\n",".notecard,\n.callout {\n  position: relative;\n\n  padding-block: 1px;\n  padding-inline: 1em;\n  padding-inline-start: 3em;\n  margin-block: 1em;\n\n  color: var(--color-text-primary);\n\n  background-color: var(--color-background-secondary);\n  border-inline-start: 2px solid\n    var(--accent-color, var(--color-text-secondary));\n  border-radius: 0.25em;\n}.note:is(.notecard,.callout),.secure:is(.notecard,.callout),.experimental:is(.notecard,.callout) {\n    background-color: var(--color-background-blue);\n    --accent-color: var(--color-text-blue);\n  }.warning:is(.notecard,.callout),.deprecated:is(.notecard,.callout),.nonstandard:is(.notecard,.callout) {\n    background-color: var(--color-background-red);\n    --accent-color: var(--color-text-red);\n  }.tip:is(.notecard,.callout) {\n    background-color: var(--color-background-green);\n    --accent-color: var(--color-text-green);\n  }:is(.deprecated:is(.notecard,.callout),.experimental:is(.notecard,.callout),.nonstandard:is(.notecard,.callout),.note:is(.notecard,.callout),.secure:is(.notecard,.callout),.tip:is(.notecard,.callout),.warning:is(.notecard,.callout),.worker:is(.notecard,.callout))::before {\n      position: absolute;\n      top: 1.45em;\n      left: 1em;\n\n      display: block;\n\n      width: 1em;\n      height: 1em;\n\n      content: \"\";\n\n      background-color: var(--accent-color, var(--color-text-secondary));\n\n      -webkit-mask-size: cover;\n\n              mask-size: cover;\n    }.deprecated:is(.notecard,.callout)::before {\n    /* e.g. Window: blur() method */\n    -webkit-mask-image: url(\"../icon/trash-2.svg\");\n            mask-image: url(\"../icon/trash-2.svg\");\n  }.experimental:is(.notecard,.callout)::before {\n    /* e.g. Barcode Detection API */\n    -webkit-mask-image: url(\"../icon/flask-conical.svg\");\n            mask-image: url(\"../icon/flask-conical.svg\");\n  }.nonstandard:is(.notecard,.callout)::before {\n    /* e.g. Document: caretRangeFromPoint() method */\n    -webkit-mask-image: url(\"../icon/triangle-alert.svg\");\n            mask-image: url(\"../icon/triangle-alert.svg\");\n  }.note:is(.notecard,.callout)::before {\n    /* e.g. Barcode Detection API */\n    -webkit-mask-image: url(\"../icon/info.svg\");\n            mask-image: url(\"../icon/info.svg\");\n  }.secure:is(.notecard,.callout)::before {\n    /* e.g. Barcode Detection API */\n    -webkit-mask-image: url(\"../icon/lock.svg\");\n            mask-image: url(\"../icon/lock.svg\");\n  }.tip:is(.notecard,.callout)::before {\n    /* (Not used in content yet) */\n    -webkit-mask-image: url(\"../icon/lightbulb.svg\");\n            mask-image: url(\"../icon/lightbulb.svg\");\n  }.warning:is(.notecard,.callout)::before {\n    /* e.g. Navigator: scheduling property */\n    -webkit-mask-image: url(\"../icon/triangle-alert.svg\");\n            mask-image: url(\"../icon/triangle-alert.svg\");\n  }.worker:is(.notecard,.callout)::before {\n    /* e.g. Worker: Worker() constructor (needs rari change) */\n    -webkit-mask-image: url(\"../icon/cog.svg\");\n            mask-image: url(\"../icon/cog.svg\");\n  }\n","\n  :is(.code-example,.css-formal-syntax) .token.comment,:is(.code-example,.css-formal-syntax) .token.prolog,:is(.code-example,.css-formal-syntax) .token.doctype,:is(.code-example,.css-formal-syntax) .token.cdata {\n    --csstools-light-dark-toggle-360cf513-0: var(--csstools-color-scheme--light) #b3b3b3;\n    color: var(--csstools-light-dark-toggle-360cf513-0, #51565d);\n    color: light-dark(#51565d, #b3b3b3);\n  }:is(.code-example,.css-formal-syntax) .token.punctuation {\n    --csstools-light-dark-toggle-360cf513-1: var(--csstools-color-scheme--light) #b3b3b3;\n    color: var(--csstools-light-dark-toggle-360cf513-1, #51565d);\n    color: light-dark(#51565d, #b3b3b3);\n  }:is(.code-example,.css-formal-syntax) .token.attr-name,:is(.code-example,.css-formal-syntax) .token.builtin,:is(.code-example,.css-formal-syntax) .token.inserted,:is(.code-example,.css-formal-syntax) .token.selector,:is(.code-example,.css-formal-syntax) .token.property,:is(.code-example,.css-formal-syntax) .token.class-name,:is(.code-example,.css-formal-syntax) .token.function {\n    --csstools-light-dark-toggle-360cf513-2: var(--csstools-color-scheme--light) #ff97a0;\n    color: var(--csstools-light-dark-toggle-360cf513-2, #d30038);\n    color: light-dark(#d30038, #ff97a0);\n  }:is(.code-example,.css-formal-syntax) .token.atrule,:is(.code-example,.css-formal-syntax) .token.attr-value {\n    --csstools-light-dark-toggle-360cf513-3: var(--csstools-color-scheme--light) #00d061;\n    color: var(--csstools-light-dark-toggle-360cf513-3, #007936);\n    color: light-dark(#007936, #00d061);\n  }:is(.code-example,.css-formal-syntax) .token.keyword {\n    --csstools-light-dark-toggle-360cf513-4: var(--csstools-color-scheme--light) #c1cff1;\n    color: var(--csstools-light-dark-toggle-360cf513-4, #0069c2);\n    color: light-dark(#0069c2, #c1cff1);\n  }:is(.code-example,.css-formal-syntax) .token.tag,:is(.code-example,.css-formal-syntax) .token.char,:is(.code-example,.css-formal-syntax) .token.string,:is(.code-example,.css-formal-syntax) .token.boolean,:is(.code-example,.css-formal-syntax) .token.number,:is(.code-example,.css-formal-syntax) .token.constant,:is(.code-example,.css-formal-syntax) .token.symbol,:is(.code-example,.css-formal-syntax) .token.deleted {\n    --csstools-light-dark-toggle-360cf513-5: var(--csstools-color-scheme--light) #00d061;\n    color: var(--csstools-light-dark-toggle-360cf513-5, #007936);\n    color: light-dark(#007936, #00d061);\n  }:is(.code-example,.css-formal-syntax) .token.selector,:is(.code-example,.css-formal-syntax) .token.builtin,:is(.code-example,.css-formal-syntax) .token.template-string > .token.string,:is(.code-example,.css-formal-syntax) .token.inserted {\n    --csstools-light-dark-toggle-360cf513-6: var(--csstools-color-scheme--light) #bea5ff;\n    color: var(--csstools-light-dark-toggle-360cf513-6, #872bff);\n    color: light-dark(#872bff, #bea5ff);\n  }:is(.code-example,.css-formal-syntax) .token.important,:is(.code-example,.css-formal-syntax) .token.bold {\n    font-weight: bold;\n  }:is(.code-example,.css-formal-syntax) .token.italic {\n    font-style: italic;\n  }:is(.code-example,.css-formal-syntax) .token.entity {\n    cursor: help;\n  }\n","@import url(\"../code-example/common.css\");\n@import url(\"../prev-next/index.css\");\n@import url(\"../notecard/index.css\");\n@import url(\"../code-example/prism.css\");\n\n.content-section {\n  line-height: var(--font-line-content);\n}\n\n.content-section :target {\n    scroll-margin-top: var(--sticky-header-height);\n  }\n\n.content-section h1,.content-section h2,.content-section h3,.content-section h4,.content-section h5,.content-section h6 {\n    margin: 1rem 0 0;\n    font-weight: var(--font-weight-normal);\n  }\n\n.content-section h1 {\n    margin-top: 0;\n    font-size: var(--font-size-largest);\n  }\n\n.content-section h2 {\n    font-size: var(--font-size-larger);\n  }\n\n.content-section h3 {\n    font-size: var(--font-size-large);\n  }\n\n.content-section h4 {\n    font-size: var(--font-size-normal);\n    text-transform: uppercase;\n    letter-spacing: 0.05em;\n  }\n\n.content-section h5,.content-section h6 {\n    font-size: var(--font-size-normal);\n    font-weight: var(--font-weight-bold);\n  }\n\n:is(.content-section a):visited {\n      color: var(--color-link-visited);\n    }\n\n/* Regular links */\n\n:is(.content-section a):not([href^=\"#\"]) {\n      -webkit-text-decoration: underline;\n      text-decoration: underline;\n    }\n\n:is(.content-section a):not([href^=\"#\"]):hover {\n        -webkit-text-decoration: none;\n        text-decoration: none;\n      }\n\n/* Anchor links */\n\n[href^=\"#\"]:is(.content-section a) {\n      -webkit-text-decoration: none;\n      text-decoration: none;\n    }\n\n[href^=\"#\"]:is(.content-section a):hover {\n        -webkit-text-decoration: underline;\n        text-decoration: underline;\n      }\n\n.content-section blockquote {\n    margin-inline: 0;\n    color: var(--color-text-secondary);\n    border-inline-start: 0.25rem solid var(--color-border-primary);\n  }\n\n:is(.content-section blockquote)  > p {\n      padding: 1rem 2rem;\n    }\n\n.content-section pre,.content-section code {\n    font-family: var(--font-family-code);\n    background-color: var(--color-background-secondary);\n  }\n\n.content-section pre {\n    white-space: pre-wrap;\n  }\n\n.content-section pre:not(.code-example pre) {\n    padding: 1rem;\n\n    overflow: auto;\n\n    border: 1px solid var(--color-border-primary);\n    border-radius: 0.25rem;\n  }\n\n.css-formal-syntax:is(.content-section pre:not(.code-example pre)) {\n      margin-bottom: 0;\n\n      text-wrap: wrap;\n\n      border-bottom-right-radius: 0;\n      border-bottom-left-radius: 0;\n    }\n\n.css-formal-syntax:is(.content-section pre:not(.code-example pre))  ~ footer {\n        padding: 0.5rem 1rem;\n        margin-bottom: 1rem;\n\n        border: 1px solid var(--color-border-primary);\n        border-top: 0;\n        border-bottom-right-radius: 0.25rem;\n        border-bottom-left-radius: 0.25rem;\n      }\n\n.content-section code {\n    padding: 0.125em 0.25em;\n    border-radius: 0.25em;\n  }\n\n.content-section img {\n    display: block;\n\n    margin: 2rem auto;\n\n    background-color: var(--color-background-secondary);\n    border: 1px solid var(--color-border-primary);\n    border-radius: 0.25rem;\n  }\n\n.content-section table {\n    width: 100%;\n    border-collapse: collapse;\n  }\n\n:is(.content-section table) tr {\n      background-color: var(--color-background-primary);\n    }\n\n:is(.content-section table) thead tr,:is(.content-section table) tr:nth-of-type(2n) {\n      background-color: var(--color-background-page);\n    }\n\n:is(.content-section table) th,:is(.content-section table) td {\n      padding: 0.5rem 0.75rem;\n      border: 1px solid var(--color-border-primary);\n    }\n\n:is(.content-section table) th {\n      font-weight: var(--font-weight-normal);\n      text-align: left;\n    }\n\n.properties:is(.content-section table) th,.properties:is(.content-section table) td {\n        border-width: 1px 0;\n      }\n\n.properties:is(.content-section table) th {\n        font-weight: var(--font-weight-bold);\n        background-color: transparent;\n      }\n\n.content-section .code-example,.content-section mdn-code-example,.content-section mdn-live-sample-result {\n    margin: 1rem 0;\n  }\n\n:is(.content-section .code-example,.content-section mdn-code-example,.content-section mdn-live-sample-result) + :is(.content-section .code-example,.content-section mdn-code-example,.content-section mdn-live-sample-result) {\n      margin-top: 1.5rem;\n    }\n\n.content-section interactive-example {\n    display: block;\n    height: 375px;\n    margin: 1rem 0;\n  }\n\n[name^=\"JavaScript Demo:\" i]:is(.content-section interactive-example) {\n      height: 444px;\n    }\n\n[height=\"shorter\"]:is(.content-section interactive-example) {\n      height: 364px;\n    }\n\n[height=\"taller\"]:is(.content-section interactive-example) {\n      height: 654px;\n    }\n\n[height=\"tabbed-shorter\"]:is(.content-section interactive-example) {\n      height: 351px;\n      margin-top: 1.5rem;\n    }\n\n[height=\"tabbed-standard\"]:is(.content-section interactive-example) {\n      height: 421px;\n    }\n\n[height=\"tabbed-taller\"]:is(.content-section interactive-example) {\n      height: 631px;\n    }\n\n@media (width <= 992px) {\n\n.content-section interactive-example {\n      height: 675px;\n  }\n\n      [name^=\"JavaScript Demo:\" i]:is(.content-section interactive-example) {\n        height: 513px;\n      }\n\n      [height=\"shorter\"]:is(.content-section interactive-example) {\n        height: 433px;\n      }\n\n      [height=\"taller\"]:is(.content-section interactive-example) {\n        height: 725px;\n      }\n\n      [height=\"tabbed-shorter\"]:is(.content-section interactive-example) {\n        height: 487px;\n      }\n\n      [height=\"tabbed-standard\"]:is(.content-section interactive-example) {\n        height: 548px;\n      }\n\n      [height=\"tabbed-taller\"]:is(.content-section interactive-example) {\n        height: 774px;\n      }\n    }\n\n/* Definition list */\n\n:is(.content-section dl) dl {\n      padding-left: 1rem;\n      border-left: 1px solid var(--color-border-primary);\n    }\n\n:is(.content-section dl) dd {\n      margin-left: 1rem;\n\n      /* Move description closer to term. */\n    }\n\n:is(:is(.content-section dl) dd) p:first-child {\n        margin-top: 0.5rem;\n      }\n\n:is(.content-section dl) ul {\n      margin: 1rem 0 2rem;\n    }\n\n:is(.content-section dl) dt a[href^=\"#\"] {\n      color: inherit;\n    }\n\n:is(:is(.content-section dl) dt a[href^=\"#\"]):hover::before {\n        position: absolute;\n\n        margin-top: 0.3em;\n        margin-left: -0.9em;\n\n        font-size: var(--font-size-small);\n\n        color: var(--color-text-secondary);\n\n        content: \"#\";\n      }\n\n:is(.content-section ul.specifications-list) li:has(details) {\n      margin-left: -1.25rem;\n      list-style: none;\n    }\n\n:is(.content-section ul.specifications-list) details {\n      width: 100%;\n    }\n\n[open]:is(:is(.content-section ul.specifications-list) details)  > summary {\n          margin-bottom: 0.5rem;\n        }\n\n:is([open]:is(:is(.content-section ul.specifications-list) details) > summary)::before {\n            transform: rotate(90deg);\n          }\n\n:is(:is(.content-section ul.specifications-list) details) summary {\n        display: flex;\n        align-items: center;\n        cursor: pointer;\n      }\n\n:is(:is(:is(.content-section ul.specifications-list) details) summary)::before {\n          display: inline-block;\n\n          flex-shrink: 0;\n\n          width: 1rem;\n          height: 1rem;\n\n          margin: 0.125rem;\n\n          content: \"\";\n\n          background-color: currentcolor;\n\n          -webkit-mask-image: url(\"../icon/chevron-right.svg\");\n\n                  mask-image: url(\"../icon/chevron-right.svg\");\n          -webkit-mask-size: cover;\n                  mask-size: cover;\n        }\n\n:is(:is(:is(.content-section ul.specifications-list) details) summary):hover {\n          background-color: var(--color-background-secondary);\n        }\n\n:is(:is(:is(.content-section ul.specifications-list) details) summary):hover:has(a:hover) {\n            /* Don't highlight, as link click doesn't toggle. */\n            background-color: unset;\n          }\n\n/* Article footer */\n\n.content-section.article-footer {\n    margin: 2rem 0;\n  }\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"styles-content-section.6dc04fb9b3f3d595.css","sources":["webpack://@mdn/fred/./components/code-example/common.css","webpack://@mdn/fred/./components/prev-next/index.css","webpack://@mdn/fred/./components/notecard/index.css","webpack://@mdn/fred/./components/code-example/prism.css","webpack://@mdn/fred/./components/content-section/server.css"],"sourcesContent":[".code-example {\n  --border: 1px solid var(--color-border-primary);\n  overflow: hidden;\n  border: var(--border);\n  border-radius: 0.25rem;\n}.code-example .example-header {\n    display: flex;\n\n    align-items: center;\n\n    min-height: 3.1rem;\n\n    padding: 0.5rem 1rem;\n\n    line-height: var(--font-line-ui);\n\n    border-bottom: var(--border);\n  }:is(.code-example .example-header) .language-name {\n      text-transform: uppercase;\n    }.code-example pre {\n    display: flex;\n\n    margin: 0;\n\n    white-space: pre-wrap;\n\n    background-color: var(--color-background-secondary);\n  }:is(.code-example pre) code {\n      flex-grow: 1;\n      flex-shrink: 1;\n\n      padding: 1rem;\n\n      overflow: auto;\n\n      font-family: var(--font-family-code);\n\n      background-color: transparent;\n    }.hidden:is(.code-example pre),[class*=\"interactive-example\"]:is(.code-example pre) {\n      display: none;\n    }:is(.example-good:is(.code-example pre),.example-bad:is(.code-example pre))::after {\n        display: inline-block;\n\n        flex-shrink: 0;\n\n        width: 1.24rem;\n        height: 1.24rem;\n\n        margin: 1.255rem 1rem;\n\n        content: \"\";\n\n        -webkit-mask-size: cover;\n\n                mask-size: cover;\n      }.example-good:is(.code-example pre) {\n      background-color: var(--color-background-green);\n    }.example-good:is(.code-example pre)::after {\n        background-color: var(--color-text-green);\n        -webkit-mask-image: url(\"../icon/circle-check.svg\");\n                mask-image: url(\"../icon/circle-check.svg\");\n      }.example-bad:is(.code-example pre) {\n      background-color: var(--color-background-red);\n    }.example-bad:is(.code-example pre)::after {\n        background-color: var(--color-text-red);\n        -webkit-mask-image: url(\"../icon/circle-x.svg\");\n                mask-image: url(\"../icon/circle-x.svg\");\n      }.code-example:has(.hidden,[class*=\"interactive-example\"]) {\n    /* TODO: we might want to fix this in rari */\n    display: none;\n  }.code-example iframe,.code-example mdn-play-runner {\n    box-sizing: content-box;\n    display: block;\n\n    padding: 1rem;\n\n    border: none;\n  }\n","/* Tutorial nav. */\n.prev-next {\n  display: flex;\n\n  flex-wrap: nowrap;\n\n  gap: 1rem;\n  justify-content: space-between;\n\n  width: 100%;\n\n  padding: 0.5rem;\n  margin: 0;\n\n  list-style: none;\n\n  border: 1px solid var(--color-border-primary);\n  border-width: 1px 0;\n}\n.prev-next a {\n    color: var(--color-link-normal) !important;\n    text-wrap: balance;\n  }\n:is(.prev-next a):visited {\n      color: var(--color-link-visited) !important;\n    }\n@media (width <= 426px) {\n.prev-next {\n    display: grid;\n    grid-template-areas:\n      \"title title\"\n      \"prev next\";\n}\n\n    .prev-next li.menu {\n      grid-area: title;\n      justify-self: center;\n    }\n\n    .prev-next li.prev {\n      grid-area: prev;\n      justify-self: start;\n    }\n\n    .prev-next li.next {\n      grid-area: next;\n      justify-self: end;\n    }\n  }\n.prev-next .prev a,.prev-next .next a {\n    display: flex;\n    gap: 0.25rem;\n    align-items: center;\n  }\n.prev-next li {\n    display: flex;\n\n    flex-wrap: nowrap;\n\n    place-items: center;\n\n    background: none;\n  }\n:is(.prev-next li) .button {\n      color: inherit;\n      background-color: inherit;\n      border: inherit;\n    }\n:is(:is(.prev-next li) .button):hover {\n        -webkit-text-decoration: underline;\n        text-decoration: underline;\n      }\n.prev:is(.prev-next li) a::before,.next:is(.prev-next li) a::after {\n      display: inline-block;\n\n      width: 1em;\n      height: 1em;\n\n      vertical-align: middle;\n\n      content: \"\";\n\n      background-color: currentcolor;\n\n      -webkit-mask-size: cover;\n\n              mask-size: cover;\n    }\n.prev:is(.prev-next li) {\n      margin-right: auto;\n    }\n.prev:is(.prev-next li) a::before {\n        -webkit-mask-image: url(\"../icon/arrow-left.svg\");\n                mask-image: url(\"../icon/arrow-left.svg\");\n      }\n.prev:is(.prev-next li) ~ .menu:is(.prev-next li) {\n      margin-right: auto;\n      margin-left: auto;\n      text-align: center;\n    }\n.next:is(.prev-next li) {\n      margin-left: auto;\n    }\n.next:is(.prev-next li) a::after {\n        -webkit-mask-image: url(\"../icon/arrow-right.svg\");\n                mask-image: url(\"../icon/arrow-right.svg\");\n      }\n",".notecard,\n.callout {\n  position: relative;\n\n  padding-block: 1px;\n  padding-inline: 1em;\n  padding-inline-start: 3em;\n  margin-block: 1em;\n\n  color: var(--color-text-primary);\n\n  background-color: var(--color-background-secondary);\n  border-inline-start: 2px solid\n    var(--accent-color, var(--color-text-secondary));\n  border-radius: 0.25em;\n}.note:is(.notecard,.callout),.secure:is(.notecard,.callout),.experimental:is(.notecard,.callout) {\n    background-color: var(--color-background-blue);\n    --accent-color: var(--color-text-blue);\n  }.warning:is(.notecard,.callout),.deprecated:is(.notecard,.callout),.nonstandard:is(.notecard,.callout) {\n    background-color: var(--color-background-red);\n    --accent-color: var(--color-text-red);\n  }.tip:is(.notecard,.callout) {\n    background-color: var(--color-background-green);\n    --accent-color: var(--color-text-green);\n  }:is(.deprecated:is(.notecard,.callout),.experimental:is(.notecard,.callout),.nonstandard:is(.notecard,.callout),.note:is(.notecard,.callout),.secure:is(.notecard,.callout),.tip:is(.notecard,.callout),.warning:is(.notecard,.callout),.worker:is(.notecard,.callout))::before {\n      position: absolute;\n      top: 1.45em;\n      left: 1em;\n\n      display: block;\n\n      width: 1em;\n      height: 1em;\n\n      content: \"\";\n\n      background-color: var(--accent-color, var(--color-text-secondary));\n\n      -webkit-mask-size: cover;\n\n              mask-size: cover;\n    }.deprecated:is(.notecard,.callout)::before {\n    /* e.g. Window: blur() method */\n    -webkit-mask-image: url(\"../icon/trash-2.svg\");\n            mask-image: url(\"../icon/trash-2.svg\");\n  }.experimental:is(.notecard,.callout)::before {\n    /* e.g. Barcode Detection API */\n    -webkit-mask-image: url(\"../icon/flask-conical.svg\");\n            mask-image: url(\"../icon/flask-conical.svg\");\n  }.nonstandard:is(.notecard,.callout)::before {\n    /* e.g. Document: caretRangeFromPoint() method */\n    -webkit-mask-image: url(\"../icon/triangle-alert.svg\");\n            mask-image: url(\"../icon/triangle-alert.svg\");\n  }.note:is(.notecard,.callout)::before {\n    /* e.g. Barcode Detection API */\n    -webkit-mask-image: url(\"../icon/info.svg\");\n            mask-image: url(\"../icon/info.svg\");\n  }.secure:is(.notecard,.callout)::before {\n    /* e.g. Barcode Detection API */\n    -webkit-mask-image: url(\"../icon/lock.svg\");\n            mask-image: url(\"../icon/lock.svg\");\n  }.tip:is(.notecard,.callout)::before {\n    /* (Not used in content yet) */\n    -webkit-mask-image: url(\"../icon/lightbulb.svg\");\n            mask-image: url(\"../icon/lightbulb.svg\");\n  }.warning:is(.notecard,.callout)::before {\n    /* e.g. Navigator: scheduling property */\n    -webkit-mask-image: url(\"../icon/triangle-alert.svg\");\n            mask-image: url(\"../icon/triangle-alert.svg\");\n  }.worker:is(.notecard,.callout)::before {\n    /* e.g. Worker: Worker() constructor (needs rari change) */\n    -webkit-mask-image: url(\"../icon/cog.svg\");\n            mask-image: url(\"../icon/cog.svg\");\n  }\n","\n  :is(.code-example,.css-formal-syntax) .token.comment,:is(.code-example,.css-formal-syntax) .token.prolog,:is(.code-example,.css-formal-syntax) .token.doctype,:is(.code-example,.css-formal-syntax) .token.cdata {\n    --csstools-light-dark-toggle-360cf513-0: var(--csstools-color-scheme--light) #b3b3b3;\n    color: var(--csstools-light-dark-toggle-360cf513-0, #51565d);\n    color: light-dark(#51565d, #b3b3b3);\n  }:is(.code-example,.css-formal-syntax) .token.punctuation {\n    --csstools-light-dark-toggle-360cf513-1: var(--csstools-color-scheme--light) #b3b3b3;\n    color: var(--csstools-light-dark-toggle-360cf513-1, #51565d);\n    color: light-dark(#51565d, #b3b3b3);\n  }:is(.code-example,.css-formal-syntax) .token.attr-name,:is(.code-example,.css-formal-syntax) .token.builtin,:is(.code-example,.css-formal-syntax) .token.inserted,:is(.code-example,.css-formal-syntax) .token.selector,:is(.code-example,.css-formal-syntax) .token.property,:is(.code-example,.css-formal-syntax) .token.class-name,:is(.code-example,.css-formal-syntax) .token.function {\n    --csstools-light-dark-toggle-360cf513-2: var(--csstools-color-scheme--light) #ff97a0;\n    color: var(--csstools-light-dark-toggle-360cf513-2, #d30038);\n    color: light-dark(#d30038, #ff97a0);\n  }:is(.code-example,.css-formal-syntax) .token.atrule,:is(.code-example,.css-formal-syntax) .token.attr-value {\n    --csstools-light-dark-toggle-360cf513-3: var(--csstools-color-scheme--light) #00d061;\n    color: var(--csstools-light-dark-toggle-360cf513-3, #007936);\n    color: light-dark(#007936, #00d061);\n  }:is(.code-example,.css-formal-syntax) .token.keyword {\n    --csstools-light-dark-toggle-360cf513-4: var(--csstools-color-scheme--light) #c1cff1;\n    color: var(--csstools-light-dark-toggle-360cf513-4, #0069c2);\n    color: light-dark(#0069c2, #c1cff1);\n  }:is(.code-example,.css-formal-syntax) .token.tag,:is(.code-example,.css-formal-syntax) .token.char,:is(.code-example,.css-formal-syntax) .token.string,:is(.code-example,.css-formal-syntax) .token.boolean,:is(.code-example,.css-formal-syntax) .token.number,:is(.code-example,.css-formal-syntax) .token.constant,:is(.code-example,.css-formal-syntax) .token.symbol,:is(.code-example,.css-formal-syntax) .token.deleted {\n    --csstools-light-dark-toggle-360cf513-5: var(--csstools-color-scheme--light) #00d061;\n    color: var(--csstools-light-dark-toggle-360cf513-5, #007936);\n    color: light-dark(#007936, #00d061);\n  }:is(.code-example,.css-formal-syntax) .token.selector,:is(.code-example,.css-formal-syntax) .token.builtin,:is(.code-example,.css-formal-syntax) .token.template-string > .token.string,:is(.code-example,.css-formal-syntax) .token.inserted {\n    --csstools-light-dark-toggle-360cf513-6: var(--csstools-color-scheme--light) #bea5ff;\n    color: var(--csstools-light-dark-toggle-360cf513-6, #872bff);\n    color: light-dark(#872bff, #bea5ff);\n  }:is(.code-example,.css-formal-syntax) .token.important,:is(.code-example,.css-formal-syntax) .token.bold {\n    font-weight: bold;\n  }:is(.code-example,.css-formal-syntax) .token.italic {\n    font-style: italic;\n  }:is(.code-example,.css-formal-syntax) .token.entity {\n    cursor: help;\n  }\n","@import url(\"../code-example/common.css\");\n@import url(\"../prev-next/index.css\");\n@import url(\"../notecard/index.css\");\n@import url(\"../code-example/prism.css\");\n\n.content-section {\n  line-height: var(--font-line-content);\n}\n\n.content-section :target {\n    scroll-margin-top: var(--sticky-header-height);\n  }\n\n.content-section h1,.content-section h2,.content-section h3,.content-section h4,.content-section h5,.content-section h6 {\n    margin: 1rem 0 0;\n    font-weight: var(--font-weight-normal);\n  }\n\n.content-section h1 {\n    margin-top: 0;\n    font-size: var(--font-size-largest);\n  }\n\n.content-section h2 {\n    font-size: var(--font-size-larger);\n  }\n\n.content-section h3 {\n    font-size: var(--font-size-large);\n  }\n\n.content-section h4 {\n    font-size: var(--font-size-normal);\n    text-transform: uppercase;\n    letter-spacing: 0.05em;\n  }\n\n.content-section h5,.content-section h6 {\n    font-size: var(--font-size-normal);\n    font-weight: var(--font-weight-bold);\n  }\n\n:is(.content-section a):visited {\n      color: var(--color-link-visited);\n    }\n\n/* Regular links */\n\n:is(.content-section a):not([href^=\"#\"]) {\n      -webkit-text-decoration: underline;\n      text-decoration: underline;\n    }\n\n:is(.content-section a):not([href^=\"#\"]):hover {\n        -webkit-text-decoration: none;\n        text-decoration: none;\n      }\n\n/* Anchor links */\n\n[href^=\"#\"]:is(.content-section a) {\n      -webkit-text-decoration: none;\n      text-decoration: none;\n    }\n\n[href^=\"#\"]:is(.content-section a):hover {\n        -webkit-text-decoration: underline;\n        text-decoration: underline;\n      }\n\n.content-section blockquote {\n    margin-inline: 0;\n    color: var(--color-text-secondary);\n    border-inline-start: 0.25rem solid var(--color-border-primary);\n  }\n\n:is(.content-section blockquote)  > p {\n      padding: 1rem 2rem;\n    }\n\n.content-section pre,.content-section code {\n    font-family: var(--font-family-code);\n    background-color: var(--color-background-secondary);\n  }\n\n.content-section pre {\n    white-space: pre-wrap;\n  }\n\n.content-section pre:not(.code-example pre) {\n    padding: 1rem;\n\n    overflow: auto;\n\n    border: 1px solid var(--color-border-primary);\n    border-radius: 0.25rem;\n  }\n\n.css-formal-syntax:is(.content-section pre:not(.code-example pre)) {\n      margin-bottom: 0;\n\n      text-wrap: wrap;\n\n      border-bottom-right-radius: 0;\n      border-bottom-left-radius: 0;\n    }\n\n.css-formal-syntax:is(.content-section pre:not(.code-example pre))  ~ footer {\n        padding: 0.5rem 1rem;\n        margin-bottom: 1rem;\n\n        border: 1px solid var(--color-border-primary);\n        border-top: 0;\n        border-bottom-right-radius: 0.25rem;\n        border-bottom-left-radius: 0.25rem;\n      }\n\n.content-section code {\n    padding: 0.125em 0.25em;\n    border-radius: var(--radius-normal);\n  }\n\n.content-section kbd {\n    padding: 0.0625em 0.125em;\n\n    font-family: var(--font-family-code);\n\n    color: var(--color-text-secondary);\n\n    background-color: var(--color-background-primary);\n    border: 1px solid var(--color-border-primary);\n    border-bottom-width: 2px;\n    border-radius: var(--radius-normal);\n  }\n\n.content-section img {\n    display: block;\n\n    margin: 2rem auto;\n\n    background-color: var(--color-white);\n    border: 1px solid var(--color-border-primary);\n    border-radius: 0.25rem;\n  }\n\n.content-section table {\n    width: 100%;\n    border-collapse: collapse;\n  }\n\n:is(.content-section table) tr {\n      background-color: var(--color-background-primary);\n    }\n\n:is(.content-section table) thead tr,:is(.content-section table) tr:nth-of-type(2n) {\n      background-color: var(--color-background-page);\n    }\n\n:is(.content-section table) th,:is(.content-section table) td {\n      padding: 0.5rem 0.75rem;\n      border: 1px solid var(--color-border-primary);\n    }\n\n:is(.content-section table) th {\n      font-weight: var(--font-weight-normal);\n      text-align: left;\n    }\n\n.properties:is(.content-section table) th,.properties:is(.content-section table) td {\n        border-width: 1px 0;\n      }\n\n.properties:is(.content-section table) th {\n        font-weight: var(--font-weight-bold);\n        background-color: transparent;\n      }\n\n.content-section .code-example,.content-section mdn-code-example,.content-section mdn-live-sample-result {\n    margin: 1rem 0;\n  }\n\n:is(.content-section .code-example,.content-section mdn-code-example,.content-section mdn-live-sample-result) + :is(.content-section .code-example,.content-section mdn-code-example,.content-section mdn-live-sample-result) {\n      margin-top: 1.5rem;\n    }\n\n.content-section interactive-example {\n    display: block;\n    height: 375px;\n    margin: 1rem 0;\n  }\n\n[name^=\"JavaScript Demo:\" i]:is(.content-section interactive-example) {\n      height: 444px;\n    }\n\n[height=\"shorter\"]:is(.content-section interactive-example) {\n      height: 364px;\n    }\n\n[height=\"taller\"]:is(.content-section interactive-example) {\n      height: 654px;\n    }\n\n[height=\"tabbed-shorter\"]:is(.content-section interactive-example) {\n      height: 351px;\n      margin-top: 1.5rem;\n    }\n\n[height=\"tabbed-standard\"]:is(.content-section interactive-example) {\n      height: 421px;\n    }\n\n[height=\"tabbed-taller\"]:is(.content-section interactive-example) {\n      height: 631px;\n    }\n\n@media (width <= 992px) {\n\n.content-section interactive-example {\n      height: 675px;\n  }\n\n      [name^=\"JavaScript Demo:\" i]:is(.content-section interactive-example) {\n        height: 513px;\n      }\n\n      [height=\"shorter\"]:is(.content-section interactive-example) {\n        height: 433px;\n      }\n\n      [height=\"taller\"]:is(.content-section interactive-example) {\n        height: 725px;\n      }\n\n      [height=\"tabbed-shorter\"]:is(.content-section interactive-example) {\n        height: 487px;\n      }\n\n      [height=\"tabbed-standard\"]:is(.content-section interactive-example) {\n        height: 548px;\n      }\n\n      [height=\"tabbed-taller\"]:is(.content-section interactive-example) {\n        height: 774px;\n      }\n    }\n\n/* Definition list */\n\n:is(.content-section dl) dl {\n      padding-left: 1rem;\n      border-left: 1px solid var(--color-border-primary);\n    }\n\n:is(.content-section dl) dd {\n      margin-left: 1rem;\n\n      /* Move description closer to term. */\n    }\n\n:is(:is(.content-section dl) dd) p:first-child {\n        margin-top: 0.5rem;\n      }\n\n:is(.content-section dl) ul {\n      margin: 1rem 0 2rem;\n    }\n\n:is(.content-section dl) dt a[href^=\"#\"] {\n      color: inherit;\n    }\n\n:is(:is(.content-section dl) dt a[href^=\"#\"]):hover::before {\n        position: absolute;\n\n        margin-top: 0.3em;\n        margin-left: -0.9em;\n\n        font-size: var(--font-size-small);\n\n        color: var(--color-text-secondary);\n\n        content: \"#\";\n      }\n\n:is(.content-section ul.specifications-list) li:has(details) {\n      margin-left: -1.25rem;\n      list-style: none;\n    }\n\n:is(.content-section ul.specifications-list) details {\n      width: 100%;\n    }\n\n[open]:is(:is(.content-section ul.specifications-list) details)  > summary {\n          margin-bottom: 0.5rem;\n        }\n\n:is([open]:is(:is(.content-section ul.specifications-list) details) > summary)::before {\n            transform: rotate(90deg);\n          }\n\n:is(:is(.content-section ul.specifications-list) details) summary {\n        display: flex;\n        align-items: center;\n        cursor: pointer;\n      }\n\n:is(:is(:is(.content-section ul.specifications-list) details) summary)::before {\n          display: inline-block;\n\n          flex-shrink: 0;\n\n          width: 1rem;\n          height: 1rem;\n\n          margin: 0.125rem;\n\n          content: \"\";\n\n          background-color: currentcolor;\n\n          -webkit-mask-image: url(\"../icon/chevron-right.svg\");\n\n                  mask-image: url(\"../icon/chevron-right.svg\");\n          -webkit-mask-size: cover;\n                  mask-size: cover;\n        }\n\n:is(:is(:is(.content-section ul.specifications-list) details) summary):hover {\n          background-color: var(--color-background-secondary);\n        }\n\n:is(:is(:is(.content-section ul.specifications-list) details) summary):hover:has(a:hover) {\n            /* Don't highlight, as link click doesn't toggle. */\n            background-color: unset;\n          }\n\n/* Article footer */\n\n.content-section.article-footer {\n    margin: 2rem 0;\n  }\n"],"names":[],"mappings":"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"}

package/out/static/client/styles-curriculum-landing.cbaf6ff367369a26.css.map

@@ -1 +1 @@
-{"version":3,"file":"styles-curriculum-landing.cbaf6ff367369a26.css","sources":["webpack://@mdn/fred/./components/curriculum/module.css","webpack://@mdn/fred/./components/curriculum/partner-banner.css","webpack://@mdn/fred/./components/curriculum-landing/server.css"],"sourcesContent":["\n    :is(.curriculum-content-container.curriculum-module .curriculum-content)  > header {\n      display: grid;\n\n      grid-template-areas:\n        \". group\"\n        \"icon heading\"\n        \"icon category\";\n\n      column-gap: 1.5rem;\n      justify-content: flex-start;\n    }:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) .topic-icon {\n        --background-primary: var(--curriculum-bg-color-topic);\n        grid-area: icon;\n\n        align-self: flex-start;\n\n        width: 4rem;\n        height: 4rem;\n      }:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) .topic-icon)  + h1 {\n          grid-area: heading;\n          margin-bottom: 0;\n        }:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) p.module-topic {\n        grid-area: category;\n\n        margin: 0;\n        margin-top: 0.5rem;\n\n        font-size: var(--font-size-normal);\n\n        color: var(--curriculum-color-topic);\n      }:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) p.module-topic)::before {\n          content: \"Category: \";\n        }:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) p.module-group {\n        grid-area: group;\n\n        align-self: center;\n\n        width: fit-content;\n        height: max-content;\n\n        padding: 0.125rem 0.5rem;\n        margin: 0;\n        margin-bottom: 0.25rem;\n\n        font-size: var(--font-size-normal);\n\n        color: var(--curriculum-module-label-color);\n\n        background-color: var(--curriculum-module-label-bg-color);\n        border-radius: var(--elem-radius);\n      }:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources {\n      margin-top: 2rem;\n      margin-bottom: 0.5rem;\n    }:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources)  + ul {\n        padding-left: 2rem;\n      }:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources) + ul)  > li {\n          list-style-image: var(--curriculum-module-mdn-resource);\n        }.curriculum-external-li:is(:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources) + ul) > li) {\n            list-style-image: url(\"./assets/curriculum-ext-resource.svg\");\n          }:is(:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources) + ul) > li) em {\n            display: inline-block;\n\n            padding: 0 0.4em;\n\n            font-size: 0.5rem;\n            font-weight: bold;\n\n            line-height: var(--font-line-content);\n            vertical-align: super;\n\n            color: var(--color-text-primary);\n\n            text-transform: uppercase;\n\n            background: var(--curriculum-bg-color);\n            border-radius: 1em;\n            text-rendering: optimizelegibility;\n          }\n","\n  .curriculum-partner-banner-container .partner-banner {\n    display: grid;\n\n    grid-template-areas: \"h2\" \"image\" \"p\" \"a\";\n\n    margin: 1rem auto;\n\n    background-color: var(--curriculum-bg-color-partner);\n    background-image: var(--curriculum-bg-image-partner);\n    background-repeat: no-repeat;\n    border: 1px solid var(--curriculum-border-color);\n    box-shadow: var(--curriculum-shadow);\n  }@media screen and (769px < width) {.curriculum-partner-banner-container .partner-banner {\n      grid-template-areas: \"copy image\";\n      grid-template-columns: 2fr minmax(24rem, 1fr);\n  }\n    }:is(.curriculum-partner-banner-container .partner-banner)  > mdn-themed-image {\n      grid-area: image;\n\n      align-self: end;\n      justify-self: center;\n\n      width: 90%;\n      max-width: max-content;\n      height: max-content;\n    }@media screen and (769px < width) {:is(.curriculum-partner-banner-container .partner-banner)  > mdn-themed-image {\n        justify-self: end;\n        width: 100%;\n    }\n      }:is(.curriculum-partner-banner-container .partner-banner)  > section {\n      display: contents;\n      grid-area: copy;\n      padding: 2rem 4rem;\n    }@media screen and (769px < width) {:is(.curriculum-partner-banner-container .partner-banner)  > section {\n        display: block;\n    }\n      }:is(:is(.curriculum-partner-banner-container .partner-banner) > section)  > h2 {\n        grid-area: h2;\n        margin: 1rem 0 2rem;\n        text-align: center;\n      }@media screen and (769px < width) {:is(:is(.curriculum-partner-banner-container .partner-banner) > section)  > h2 {\n          margin: 0 0 1rem;\n          text-align: left;\n      }\n        }:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2)  > a {\n          display: inline-block;\n          min-width: max-content;\n          color: var(--curriculum-category-color);\n        }:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):visited:not([href^=\"#\"]) {\n            color: var(--curriculum-category-color);\n          }:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a)::before {\n            position: absolute;\n            content: url(\"./assets/curriculum-partner-underline-small.svg\");\n            transform: translate3d(-0.1em, 0.4em, 0);\n          }@media screen and (769px < width) {:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a)::before {\n              content: url(\"./assets/curriculum-partner-underline-large.svg\");\n          }\n            }:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):focus,:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):visited,:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):hover {\n            -webkit-text-decoration: none;\n            text-decoration: none;\n          }:is(:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):focus,:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):visited,:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):hover)::before {\n              content: none;\n            }:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a)::after {\n            width: 0.625em;\n            height: 0.625em;\n            background-color: var(--curriculum-category-color);\n          }:is(:is(.curriculum-partner-banner-container .partner-banner) > section)  > p {\n        grid-area: p;\n        margin: 1.5rem 1rem;\n      }@media screen and (769px < width) {:is(:is(.curriculum-partner-banner-container .partner-banner) > section)  > p {\n          margin: 1rem 0 1.5rem;\n      }\n        }:is(:is(.curriculum-partner-banner-container .partner-banner) > section)  > a {\n        grid-area: a;\n        margin: 1rem;\n        color: var(--color-text-primary);\n      }@media screen and (769px < width) {:is(:is(.curriculum-partner-banner-container .partner-banner) > section)  > a {\n          margin: 1rem 0 0;\n      }\n        }\n","@import url(\"../curriculum/shared.css\");\n@import url(\"../curriculum/module.css\");\n@import url(\"../curriculum/module-list.css\");\n@import url(\"../curriculum/partner-banner.css\");\n@import url(\"../button/server.css\");\n\n.curriculum-content-container.curriculum-landing {\n  width: 100%;\n  max-width: 100%;\n\n  padding: 0;\n  margin: 0;\n\n  background-color: var(--color-background-page);\n}\n\n:is(.curriculum-content-container.curriculum-landing article)  > header,:is(.curriculum-content-container.curriculum-landing article)  > section {\n      width: 100%;\n      max-width: min(var(--max-width), 74rem);\n\n      padding-right: var(--gutter);\n      padding-left: var(--gutter);\n      margin: 0 auto 3rem;\n    }\n\n.curriculum-content-container.curriculum-landing .curriculum-content {\n    padding-top: 0;\n\n    /* number of columns in module list depending on screen width */\n  }\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n      grid-template-columns: 1fr 1fr 1fr 1fr;\n    }\n\n@media (width <= 426px) {\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n        grid-template-columns: 1fr;\n    }\n      }\n\n@media (426px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n        grid-template-columns: 1fr 1fr;\n    }\n      }\n\n@media (992px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n        grid-template-columns: 1fr 1fr 1fr;\n    }\n      }\n\n@media (1200px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n        grid-template-columns: 1fr 1fr 1fr 1fr;\n    }\n      }\n\n.curriculum-content-container.curriculum-landing header.landing-header {\n    display: grid;\n    grid-template-areas: \"copy\" \"svg\";\n  }\n\n@media (769px < width) {\n\n.curriculum-content-container.curriculum-landing header.landing-header {\n      grid-template-areas: \"copy svg\";\n      grid-template-columns: 30rem auto;\n  }\n    }\n\n:is(.curriculum-content-container.curriculum-landing header.landing-header)  > svg {\n      z-index: 1;\n\n      grid-area: svg;\n\n      align-self: end;\n      justify-self: end;\n\n      width: 100%;\n      max-width: 28rem;\n\n      margin-bottom: 3rem;\n    }\n\n@media (769px < width) {\n\n:is(.curriculum-content-container.curriculum-landing header.landing-header)  > svg {\n        margin-bottom: 0;\n    }\n      }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > svg) #icons-bg {\n        fill: var(--curriculum-bg-color-landing-top-icon);\n      }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > svg) .laptop {\n        fill: var(--curriculum-color-landing-laptop);\n      }\n\n:is(.curriculum-content-container.curriculum-landing header.landing-header)  > section {\n      grid-area: copy;\n\n      max-width: 30rem;\n\n      padding-right: 1rem;\n      margin-top: 3rem;\n      margin-right: auto;\n    }\n\n@media (769px < width) {\n\n:is(.curriculum-content-container.curriculum-landing header.landing-header)  > section {\n        margin-bottom: 4rem;\n    }\n      }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) h1 {\n        margin-bottom: 0.5rem;\n        font-size: var(--font-size-larger);\n        color: var(--curriculum-color-topic);\n      }\n\n@media (769px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) h1 {\n          font-size: var(--font-size-largest);\n      }\n        }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) h2 {\n        margin-top: 0.5rem;\n        margin-bottom: 1.5rem;\n        font-size: var(--font-size-large);\n      }\n\n@media (769px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) h2 {\n          margin-bottom: 2rem;\n          font-size: var(--font-size-larger);\n      }\n        }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) p {\n        color: var(--color-text-secondary);\n      }\n\n.curriculum-content-container.curriculum-landing .landing-about-container {\n    max-width: 100%;\n\n    margin: 0;\n    margin-top: -6rem;\n\n    background-color: var(--curriculum-bg-large-color);\n  }\n\n:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about {\n      display: grid;\n\n      grid-template-areas:\n        \"li\"\n        \"h2\"\n        \"p1\"\n        \"p2\"\n        \"p3\"\n        \"p4\"\n        \"scrim\";\n      grid-template-columns: 1fr;\n\n      max-width: min(var(--max-width), 74rem);\n\n      margin: 0 auto 3rem;\n    }\n\n@media (992px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about {\n        grid-template-areas:\n          \"li li    li \"\n          \"h2 .     scrim\"\n          \"p1 .     scrim\"\n          \"p2 .     scrim\"\n          \"p3 arrow scrim\"\n          \"p4 arrow scrim\";\n        grid-template-columns: 1fr 7rem 24rem;\n        column-gap: 1rem;\n    }\n      }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) h2 {\n        grid-area: h2;\n        margin: 1rem 0;\n      }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about)  > div.about-content {\n        display: contents;\n      }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul {\n          display: grid;\n\n          grid-area: li;\n          grid-template-columns: auto auto auto;\n\n          align-items: start;\n          justify-content: center;\n\n          width: 100%;\n          min-height: 5rem;\n\n          padding: 1rem;\n          margin: auto;\n\n          color: var(--color-text-secondary);\n\n          background-color: var(--curriculum-bg-color-landing-about-ul);\n          border-radius: var(--elem-radius);\n          box-shadow: var(--curriculum-shadow-landing-about-ul);\n\n          transform: translateY(-1rem);\n        }\n\n@media (426px < width) {\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul {\n            gap: 1rem;\n            align-items: center;\n        }\n          }\n\n@media (769px < width) {\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul {\n            justify-content: start;\n        }\n          }\n\n@media (992px < width) {\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul {\n            justify-content: center;\n        }\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul)  > li {\n            margin: 0 0.5rem;\n            text-align: center;\n          }\n\n@media (426px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul)  > li {\n              width: max-content;\n              margin: 0 1rem;\n          }\n            }\n\n@media (769px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul)  > li {\n              display: inline-flex;\n              gap: 1rem;\n              align-items: center;\n          }\n            }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li)::before {\n              display: block;\n\n              width: 3rem;\n              height: 3rem;\n\n              margin: 0 auto;\n            }\n\n@media (769px < width) {\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li)::before {\n                display: initial;\n                margin: 0;\n            }\n              }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li):nth-child(1)::before {\n              content: var(--curriculum-landing-about-beginner);\n            }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li):nth-child(2)::before {\n              content: var(--curriculum-landing-about-pace);\n            }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li):nth-child(3)::before {\n              content: var(--curriculum-landing-about-free);\n            }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p {\n          display: grid;\n\n          grid-template-columns: auto auto;\n\n          align-items: center;\n          justify-content: start;\n\n          margin: 1rem 0;\n\n          color: var(--color-text-secondary);\n        }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p)::before {\n            display: block;\n\n            align-self: start;\n\n            width: 4rem;\n            height: 4rem;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(2) {\n            grid-area: p1;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(2)::before {\n              content: var(--curriculum-landing-about-bullet);\n            }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(3) {\n            grid-area: p2;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(3)::before {\n              content: var(--curriculum-landing-about-bullet);\n            }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(4) {\n            grid-area: p3;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(4)::before {\n              content: var(--curriculum-landing-about-bullet);\n            }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(5) {\n            grid-area: p4;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(5) a {\n              margin-left: 4rem;\n              font-weight: var(--font-weight-bold);\n              -webkit-text-decoration: underline;\n              text-decoration: underline;\n            }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(5) a):hover,:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(5) a):active {\n                -webkit-text-decoration: none;\n                text-decoration: none;\n              }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about)  > div.arrow {\n        grid-area: arrow;\n\n        background-image: var(--curriculum-landing-arrow);\n        background-repeat: no-repeat;\n        background-position: center;\n      }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper {\n        display: flex;\n\n        flex-direction: column;\n\n        grid-area: scrim;\n\n        justify-content: center;\n        justify-self: center;\n\n        max-width: 24rem;\n\n        margin-top: 1rem;\n      }\n\n@media (992px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper {\n          justify-self: end;\n          margin-top: 0;\n      }\n        }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper) .scrim-border {\n          width: 100%;\n          height: 16rem;\n\n          background-image: var(--curriculum-scrim-bg);\n          background-repeat: no-repeat;\n          background-position: bottom right;\n        }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper) mdn-scrim-inline {\n          display: block;\n\n          width: 22rem;\n          max-width: calc(100vw - var(--gutter) * 2);\n          height: 14.25rem;\n\n          background: #000000;\n        }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper) p {\n          padding: 1rem 0;\n          margin: 0;\n        }\n\n.curriculum-content-container.curriculum-landing .landing-stairway {\n    max-width: 100%;\n    margin: 0;\n    background-color: var(--color-background-secondary);\n  }\n\n:is(.curriculum-content-container.curriculum-landing .landing-stairway)  > div {\n      display: grid;\n\n      grid-template-areas: \"a\" \"b\";\n      grid-template-rows: auto auto;\n      grid-template-columns: auto;\n\n      justify-content: center;\n\n      width: 100%;\n      max-width: min(var(--max-width), 74rem);\n\n      padding: 2rem;\n      padding-right: var(--gutter);\n      padding-left: var(--gutter);\n      margin: 0 auto 3rem;\n\n      color: var(--color-text-secondary);\n    }\n\n@media (769px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .landing-stairway)  > div {\n        grid-template-columns: min(100%, 34rem);\n    }\n      }\n\n@media (992px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .landing-stairway)  > div {\n        grid-template-areas: \"a b\";\n        grid-template-columns: 1fr 1.4fr;\n    }\n      }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) svg {\n        width: 100%;\n      }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div)  > #stairway1-container {\n        --fs: clamp(1rem, calc(3 * calc(100vw / 100)), 1.75rem);\n        position: relative;\n\n        grid-area: a;\n\n        width: 100%;\n\n        margin: 0;\n\n        transform: translateX(2vw);\n      }\n\n@media (992px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div)  > #stairway1-container {\n          --fs: clamp(1rem, calc(2 * calc(100vw / 100)), 1.75rem);\n      }\n        }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway1-container) #stairway1 {\n          position: absolute;\n          top: 18%;\n          left: 32%;\n\n          font-size: var(--fs);\n        }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway1-container) #stairway1)  > span {\n            display: block;\n\n            width: max-content;\n\n            line-height: calc(1.25 * var(--fs));\n\n            text-wrap: nowrap;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway1-container) #stairway1) .color {\n            color: var(--curriculum-color);\n          }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div)  > #stairway2-container {\n        --fs: clamp(0.75rem, calc(1.25 * calc(100vw / 100)), 1rem);\n        position: relative;\n        grid-area: b;\n        transform: translateX(-5vw);\n      }\n\n@media (769px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div)  > #stairway2-container {\n          --fs: clamp(0.75rem, calc(100vw / 100), 0.825rem);\n      }\n        }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2 {\n          position: absolute;\n          top: 0;\n          left: 0;\n\n          width: calc(100% + 5vw);\n          height: 100%;\n\n          margin: 0;\n\n          font-size: var(--fs);\n        }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2)  > span {\n            position: absolute;\n\n            display: block;\n\n            max-width: 10rem;\n\n            line-height: calc(1.25 * var(--fs));\n\n            text-wrap: wrap;\n          }\n\n@media (769px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2)  > span {\n              max-width: initial;\n              text-wrap: nowrap;\n          }\n            }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-1 {\n            top: 36%;\n            left: 47%;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-2 {\n            top: 52%;\n            left: 33%;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-3 {\n            top: 71%;\n            left: 23%;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-4 {\n            top: 86%;\n            left: 8%;\n          }\n\n@media (769px < width) {\n            :is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-1 {\n              top: 53%;\n              left: 35%;\n            }\n\n            :is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-2 {\n              top: 65%;\n              left: 27%;\n            }\n\n            :is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-3 {\n              top: 77%;\n              left: 13%;\n            }\n\n            :is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-4 {\n              top: 90%;\n              left: 0%;\n            }\n          }\n\n#stairway2large:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) > svg) {\n            display: none;\n            grid-area: b;\n          }\n\n@media (769px < width) {\n\n#stairway2large:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) > svg) {\n              display: initial;\n          }\n            }\n\n#stairway2small:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) > svg) {\n            grid-area: b;\n            max-width: 100%;\n          }\n\n@media (769px < width) {\n\n#stairway2small:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) > svg) {\n              display: none;\n          }\n            }\n\n.curriculum-content-container.curriculum-landing #dont_know_where_toget_started {\n    width: fit-content;\n\n    margin: 1rem auto 5rem;\n\n    line-height: 3rem;\n\n    text-align: center;\n  }\n\n:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started)::after {\n      position: absolute;\n\n      width: 6em;\n\n      content: url(\"../curriculum/assets/curriculum-started-underline.svg\");\n\n      transform: translate3d(-6em, 1.25rem, 0);\n    }\n\n:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div)  > ul {\n        display: grid;\n\n        grid-template-areas: \"beginner\" \"advanced\" \"employ\" \"educator\";\n\n        gap: 1rem;\n\n        max-width: 52rem;\n\n        margin: 0 auto;\n\n        overflow: clip;\n\n        scroll-snap-type: inline mandatory;\n      }\n\n@media (769px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div)  > ul {\n          grid-template-areas:\n            \"beginner advanced\"\n            \"employ educator\";\n          grid-template-columns: auto auto;\n          gap: 5rem 4rem;\n      }\n        }\n\n@media (992px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div)  > ul {\n          gap: 5rem 8rem;\n      }\n        }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul)  > li {\n          display: grid;\n\n          grid-template-areas:\n            \"i h\"\n            \"p p\"\n            \"c c\";\n          grid-template-rows: 4rem minmax(2rem, max-content) max-content;\n          grid-template-columns: 3rem 1fr;\n\n          gap: 1rem;\n          align-items: center;\n\n          height: max-content;\n\n          padding: 1rem 0.5rem;\n\n          color: var(--color-text-secondary);\n\n          scroll-snap-align: center;\n\n          background-color: var(--curriculum-bg-large-color);\n          border-radius: var(--elem-radius);\n        }\n\n@media (769px < width) {\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul)  > li {\n            grid-template-areas:\n              \"i h\"\n              \"i p\"\n              \"i c\";\n            grid-template-rows: 4rem auto max-content;\n            grid-template-columns: auto auto;\n\n            gap: 1rem 2rem;\n            align-items: start;\n\n            width: initial;\n            height: initial;\n\n            padding: 0;\n\n            background-color: initial;\n        }\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li)::before {\n            display: inline-block;\n\n            align-self: start;\n\n            width: 3rem;\n            height: 3rem;\n          }\n\n@media (769px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li)::before {\n              grid-area: i;\n              width: 5rem;\n              height: 5rem;\n          }\n            }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li):nth-child(1)::before {\n            content: var(--curriculum-landing-started-beginner);\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li):nth-child(2)::before {\n            content: var(--curriculum-landing-started-advanced);\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li):nth-child(3)::before {\n            content: var(--curriculum-landing-started-employment);\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li):nth-child(4)::before {\n            content: var(--curriculum-landing-started-educator);\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) h3 {\n            grid-area: h;\n\n            margin-top: 0;\n\n            font-weight: var(--font-weight-bold);\n\n            line-height: var(--font-line-normal);\n\n            color: var(--color-text-primary);\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) p:nth-child(2) {\n            grid-area: p;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) p:nth-child(3) {\n            grid-area: c;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) em {\n            grid-area: p;\n            align-self: start;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a {\n            --csstools-light-dark-toggle-35d37db9-0: var(--csstools-color-scheme--light) #ffffff;\n            --button-bg--default: var(--csstools-light-dark-toggle-35d37db9-0, #1b1b1b);\n            --csstools-light-dark-toggle-35d37db9-1: var(--csstools-color-scheme--light) #cdcdcd;\n            --button-bg-hover--default: var(--csstools-light-dark-toggle-35d37db9-1, #696969);\n            --csstools-light-dark-toggle-35d37db9-2: var(--csstools-color-scheme--light) #9e9e9e;\n            --button-bg-active--default: var(--csstools-light-dark-toggle-35d37db9-2, #9e9e9e);\n            --csstools-light-dark-toggle-35d37db9-3: var(--csstools-color-scheme--light) #ffffff;\n            --button-border-color--default: var(--csstools-light-dark-toggle-35d37db9-3, #1d1d1d);\n            --button-color--default: var(--color-background-primary);\n\n            --button-bg: var(--button-bg--default);\n            --button-bg-hover: var(--button-bg-hover--default);\n            --button-bg-active: var(--button-bg-active--default);\n            --button-border-color: var(--button-border-color--default);\n            --button-height: 2rem;\n            --button-color: var(--button-color--default);\n            --button-radius: var(--elem-radius, 0.25rem);\n            position: relative;\n\n            display: flex;\n\n            grid-area: c;\n\n            gap: 0.25rem;\n            align-items: center;\n            justify-content: center;\n            justify-self: center;\n\n            width: fit-content;\n            min-height: var(--button-height);\n\n            padding: 0.5rem;\n            padding-right: var(--button-padding);\n            padding-left: var(--button-padding);\n\n            font-size: var(--font-size-small);\n            font-weight: var(--font-weight-bold);\n\n            color: var(--button-color);\n\n            text-align: center;\n\n            -webkit-text-decoration: none;\n\n            -webkit-text-decoration: none;\n\n            text-decoration: none;\n\n            cursor: pointer;\n\n            background-color: var(--button-bg);\n            border: 1px solid var(--button-border-color);\n            border-radius: var(--button-radius);\n          }\n\n@supports (color: light-dark(red, red)){\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a {\n            --button-bg--default: light-dark(#1b1b1b, #ffffff);\n            --button-bg-hover--default: light-dark(#696969, #cdcdcd);\n            --button-bg-active--default: light-dark(#9e9e9e, #9e9e9e);\n            --button-border-color--default: light-dark(#1d1d1d, #ffffff);\n          }\n}\n\n@supports not (color: light-dark(tan, tan)){\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a) *{\n            --csstools-light-dark-toggle-35d37db9-0: var(--csstools-color-scheme--light) #ffffff;\n            --button-bg--default: var(--csstools-light-dark-toggle-35d37db9-0, #1b1b1b);\n            --csstools-light-dark-toggle-35d37db9-1: var(--csstools-color-scheme--light) #cdcdcd;\n            --button-bg-hover--default: var(--csstools-light-dark-toggle-35d37db9-1, #696969);\n            --csstools-light-dark-toggle-35d37db9-2: var(--csstools-color-scheme--light) #9e9e9e;\n            --button-bg-active--default: var(--csstools-light-dark-toggle-35d37db9-2, #9e9e9e);\n            --csstools-light-dark-toggle-35d37db9-3: var(--csstools-color-scheme--light) #ffffff;\n            --button-border-color--default: var(--csstools-light-dark-toggle-35d37db9-3, #1d1d1d);\n  }\n}\n\n@media (769px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a {\n              justify-self: start;\n          }\n            }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a):hover {\n              background-color: var(--button-bg-hover, var(--button-bg));\n            }\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"styles-curriculum-landing.cbaf6ff367369a26.css","sources":["webpack://@mdn/fred/./components/curriculum/module.css","webpack://@mdn/fred/./components/curriculum/partner-banner.css","webpack://@mdn/fred/./components/curriculum-landing/server.css"],"sourcesContent":["\n    :is(.curriculum-content-container.curriculum-module .curriculum-content)  > header {\n      display: grid;\n\n      grid-template-areas:\n        \". group\"\n        \"icon heading\"\n        \"icon category\";\n\n      column-gap: 1.5rem;\n      justify-content: flex-start;\n    }:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) .topic-icon {\n        --background-primary: var(--curriculum-bg-color-topic);\n        grid-area: icon;\n\n        align-self: flex-start;\n\n        width: 4rem;\n        height: 4rem;\n      }:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) .topic-icon)  + h1 {\n          grid-area: heading;\n          margin-bottom: 0;\n        }:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) p.module-topic {\n        grid-area: category;\n\n        margin: 0;\n        margin-top: 0.5rem;\n\n        font-size: var(--font-size-normal);\n\n        color: var(--curriculum-color-topic);\n      }:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) p.module-topic)::before {\n          content: \"Category: \";\n        }:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) > header) p.module-group {\n        grid-area: group;\n\n        align-self: center;\n\n        width: fit-content;\n        height: max-content;\n\n        padding: 0.125rem 0.5rem;\n        margin: 0;\n        margin-bottom: 0.25rem;\n\n        font-size: var(--font-size-normal);\n\n        color: var(--curriculum-module-label-color);\n\n        background-color: var(--curriculum-module-label-bg-color);\n        border-radius: var(--elem-radius);\n      }:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources {\n      margin-top: 2rem;\n      margin-bottom: 0.5rem;\n    }:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources)  + ul {\n        padding-left: 2rem;\n      }:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources) + ul)  > li {\n          list-style-image: var(--curriculum-module-mdn-resource);\n        }.curriculum-external-li:is(:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources) + ul) > li) {\n            list-style-image: url(\"./assets/curriculum-ext-resource.svg\");\n          }:is(:is(:is(:is(.curriculum-content-container.curriculum-module .curriculum-content) p.curriculum-resources) + ul) > li) em {\n            display: inline-block;\n\n            padding: 0 0.4em;\n\n            font-size: 0.5rem;\n            font-weight: bold;\n\n            line-height: var(--font-line-content);\n            vertical-align: super;\n\n            color: var(--color-text-primary);\n\n            text-transform: uppercase;\n\n            background: var(--curriculum-bg-color);\n            border-radius: 1em;\n\n            text-rendering: optimizelegibility;\n          }\n","\n  .curriculum-partner-banner-container .partner-banner {\n    display: grid;\n\n    grid-template-areas: \"h2\" \"image\" \"p\" \"a\";\n\n    margin: 1rem auto;\n\n    background-color: var(--curriculum-bg-color-partner);\n    background-image: var(--curriculum-bg-image-partner);\n    background-repeat: no-repeat;\n    border: 1px solid var(--curriculum-border-color);\n    box-shadow: var(--curriculum-shadow);\n  }@media screen and (769px < width) {.curriculum-partner-banner-container .partner-banner {\n      grid-template-areas: \"copy image\";\n      grid-template-columns: 2fr minmax(24rem, 1fr);\n  }\n    }:is(.curriculum-partner-banner-container .partner-banner)  > mdn-themed-image {\n      grid-area: image;\n\n      align-self: end;\n      justify-self: center;\n\n      width: 90%;\n      max-width: max-content;\n      height: max-content;\n    }@media screen and (769px < width) {:is(.curriculum-partner-banner-container .partner-banner)  > mdn-themed-image {\n        justify-self: end;\n        width: 100%;\n    }\n      }:is(.curriculum-partner-banner-container .partner-banner)  > section {\n      display: contents;\n      grid-area: copy;\n      padding: 2rem 4rem;\n    }@media screen and (769px < width) {:is(.curriculum-partner-banner-container .partner-banner)  > section {\n        display: block;\n    }\n      }:is(:is(.curriculum-partner-banner-container .partner-banner) > section)  > h2 {\n        grid-area: h2;\n        margin: 1rem 0 2rem;\n        text-align: center;\n      }@media screen and (769px < width) {:is(:is(.curriculum-partner-banner-container .partner-banner) > section)  > h2 {\n          margin: 0 0 1rem;\n          text-align: left;\n      }\n        }:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2)  > a {\n          display: inline-block;\n          min-width: max-content;\n          color: var(--curriculum-category-color);\n        }:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):visited:not([href^=\"#\"]) {\n            color: var(--curriculum-category-color);\n          }:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a)::before {\n            position: absolute;\n            content: url(\"./assets/curriculum-partner-underline-small.svg\");\n            transform: translate3d(-0.1em, 0.4em, 0);\n          }@media screen and (769px < width) {:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a)::before {\n              content: url(\"./assets/curriculum-partner-underline-large.svg\");\n          }\n            }:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):focus,:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):visited,:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):hover {\n            -webkit-text-decoration: none;\n            text-decoration: none;\n          }:is(:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):focus,:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):visited,:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a):hover)::before {\n              content: none;\n            }:is(:is(:is(:is(.curriculum-partner-banner-container .partner-banner) > section) > h2) > a)::after {\n            width: 0.625em;\n            height: 0.625em;\n            background-color: var(--curriculum-category-color);\n          }:is(:is(.curriculum-partner-banner-container .partner-banner) > section)  > p {\n        grid-area: p;\n        margin: 1.5rem 1rem;\n      }@media screen and (769px < width) {:is(:is(.curriculum-partner-banner-container .partner-banner) > section)  > p {\n          margin: 1rem 0 1.5rem;\n      }\n        }:is(:is(.curriculum-partner-banner-container .partner-banner) > section)  > a {\n        grid-area: a;\n        margin: 1rem;\n        color: var(--color-text-primary);\n      }@media screen and (769px < width) {:is(:is(.curriculum-partner-banner-container .partner-banner) > section)  > a {\n          margin: 1rem 0 0;\n      }\n        }\n","@import url(\"../curriculum/shared.css\");\n@import url(\"../curriculum/module.css\");\n@import url(\"../curriculum/module-list.css\");\n@import url(\"../curriculum/partner-banner.css\");\n@import url(\"../button/server.css\");\n\n.curriculum-content-container.curriculum-landing {\n  width: 100%;\n  max-width: 100%;\n\n  padding: 0;\n  margin: 0;\n\n  background-color: var(--color-background-page);\n}\n\n:is(.curriculum-content-container.curriculum-landing article)  > header,:is(.curriculum-content-container.curriculum-landing article)  > section {\n      width: 100%;\n      max-width: min(var(--max-width), 74rem);\n\n      padding-right: var(--gutter);\n      padding-left: var(--gutter);\n      margin: 0 auto 3rem;\n    }\n\n.curriculum-content-container.curriculum-landing .curriculum-content {\n    padding-top: 0;\n\n    /* number of columns in module list depending on screen width */\n  }\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n      grid-template-columns: 1fr 1fr 1fr 1fr;\n    }\n\n@media (width <= 426px) {\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n        grid-template-columns: 1fr;\n    }\n      }\n\n@media (426px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n        grid-template-columns: 1fr 1fr;\n    }\n      }\n\n@media (992px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n        grid-template-columns: 1fr 1fr 1fr;\n    }\n      }\n\n@media (1200px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .curriculum-content) ol.modules-list {\n        grid-template-columns: 1fr 1fr 1fr 1fr;\n    }\n      }\n\n.curriculum-content-container.curriculum-landing header.landing-header {\n    display: grid;\n    grid-template-areas: \"copy\" \"svg\";\n  }\n\n@media (769px < width) {\n\n.curriculum-content-container.curriculum-landing header.landing-header {\n      grid-template-areas: \"copy svg\";\n      grid-template-columns: 30rem auto;\n  }\n    }\n\n:is(.curriculum-content-container.curriculum-landing header.landing-header)  > svg {\n      z-index: 1;\n\n      grid-area: svg;\n\n      align-self: end;\n      justify-self: end;\n\n      width: 100%;\n      max-width: 28rem;\n\n      margin-bottom: 3rem;\n    }\n\n@media (769px < width) {\n\n:is(.curriculum-content-container.curriculum-landing header.landing-header)  > svg {\n        margin-bottom: 0;\n    }\n      }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > svg) #icons-bg {\n        fill: var(--curriculum-bg-color-landing-top-icon);\n      }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > svg) .laptop {\n        fill: var(--curriculum-color-landing-laptop);\n      }\n\n:is(.curriculum-content-container.curriculum-landing header.landing-header)  > section {\n      grid-area: copy;\n\n      max-width: 30rem;\n\n      padding-right: 1rem;\n      margin-top: 3rem;\n      margin-right: auto;\n    }\n\n@media (769px < width) {\n\n:is(.curriculum-content-container.curriculum-landing header.landing-header)  > section {\n        margin-bottom: 4rem;\n    }\n      }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) h1 {\n        margin-bottom: 0.5rem;\n        font-size: var(--font-size-larger);\n        color: var(--curriculum-color-topic);\n      }\n\n@media (769px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) h1 {\n          font-size: var(--font-size-largest);\n      }\n        }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) h2 {\n        margin-top: 0.5rem;\n        margin-bottom: 1.5rem;\n        font-size: var(--font-size-large);\n      }\n\n@media (769px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) h2 {\n          margin-bottom: 2rem;\n          font-size: var(--font-size-larger);\n      }\n        }\n\n:is(:is(.curriculum-content-container.curriculum-landing header.landing-header) > section) p {\n        color: var(--color-text-secondary);\n      }\n\n.curriculum-content-container.curriculum-landing .landing-about-container {\n    max-width: 100%;\n\n    margin: 0;\n    margin-top: -6rem;\n\n    background-color: var(--curriculum-bg-large-color);\n  }\n\n:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about {\n      display: grid;\n\n      grid-template-areas:\n        \"li\"\n        \"h2\"\n        \"p1\"\n        \"p2\"\n        \"p3\"\n        \"p4\"\n        \"scrim\";\n      grid-template-columns: 1fr;\n\n      max-width: min(var(--max-width), 74rem);\n\n      margin: 0 auto 3rem;\n    }\n\n@media (992px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about {\n        grid-template-areas:\n          \"li li    li \"\n          \"h2 .     scrim\"\n          \"p1 .     scrim\"\n          \"p2 .     scrim\"\n          \"p3 arrow scrim\"\n          \"p4 arrow scrim\";\n        grid-template-columns: 1fr 7rem 24rem;\n        column-gap: 1rem;\n    }\n      }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) h2 {\n        grid-area: h2;\n        margin: 1rem 0;\n      }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about)  > div.about-content {\n        display: contents;\n      }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul {\n          display: grid;\n\n          grid-area: li;\n          grid-template-columns: auto auto auto;\n\n          align-items: start;\n          justify-content: center;\n\n          width: 100%;\n          min-height: 5rem;\n\n          padding: 1rem;\n          margin: auto;\n\n          color: var(--color-text-secondary);\n\n          background-color: var(--curriculum-bg-color-landing-about-ul);\n          border-radius: var(--elem-radius);\n          box-shadow: var(--curriculum-shadow-landing-about-ul);\n\n          transform: translateY(-1rem);\n        }\n\n@media (426px < width) {\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul {\n            gap: 1rem;\n            align-items: center;\n        }\n          }\n\n@media (769px < width) {\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul {\n            justify-content: start;\n        }\n          }\n\n@media (992px < width) {\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul {\n            justify-content: center;\n        }\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul)  > li {\n            margin: 0 0.5rem;\n            text-align: center;\n          }\n\n@media (426px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul)  > li {\n              width: max-content;\n              margin: 0 1rem;\n          }\n            }\n\n@media (769px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul)  > li {\n              display: inline-flex;\n              gap: 1rem;\n              align-items: center;\n          }\n            }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li)::before {\n              display: block;\n\n              width: 3rem;\n              height: 3rem;\n\n              margin: 0 auto;\n            }\n\n@media (769px < width) {\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li)::before {\n                display: initial;\n                margin: 0;\n            }\n              }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li):nth-child(1)::before {\n              content: var(--curriculum-landing-about-beginner);\n            }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li):nth-child(2)::before {\n              content: var(--curriculum-landing-about-pace);\n            }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) ul) > li):nth-child(3)::before {\n              content: var(--curriculum-landing-about-free);\n            }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p {\n          display: grid;\n\n          grid-template-columns: auto auto;\n\n          align-items: center;\n          justify-content: start;\n\n          margin: 1rem 0;\n\n          color: var(--color-text-secondary);\n        }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p)::before {\n            display: block;\n\n            align-self: start;\n\n            width: 4rem;\n            height: 4rem;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(2) {\n            grid-area: p1;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(2)::before {\n              content: var(--curriculum-landing-about-bullet);\n            }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(3) {\n            grid-area: p2;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(3)::before {\n              content: var(--curriculum-landing-about-bullet);\n            }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(4) {\n            grid-area: p3;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(4)::before {\n              content: var(--curriculum-landing-about-bullet);\n            }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(5) {\n            grid-area: p4;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(5) a {\n              margin-left: 4rem;\n              font-weight: var(--font-weight-bold);\n              -webkit-text-decoration: underline;\n              text-decoration: underline;\n            }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(5) a):hover,:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) > div.about-content) p):nth-child(5) a):active {\n                -webkit-text-decoration: none;\n                text-decoration: none;\n              }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about)  > div.arrow {\n        grid-area: arrow;\n\n        background-image: var(--curriculum-landing-arrow);\n        background-repeat: no-repeat;\n        background-position: center;\n      }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper {\n        display: flex;\n\n        flex-direction: column;\n\n        grid-area: scrim;\n\n        justify-content: center;\n        justify-self: center;\n\n        max-width: 24rem;\n\n        margin-top: 1rem;\n      }\n\n@media (992px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper {\n          justify-self: end;\n          margin-top: 0;\n      }\n        }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper) .scrim-border {\n          width: 100%;\n          height: 16rem;\n\n          background-image: var(--curriculum-scrim-bg);\n          background-repeat: no-repeat;\n          background-position: bottom right;\n        }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper) mdn-scrim-inline {\n          display: block;\n\n          width: 22rem;\n          max-width: calc(100vw - var(--gutter) * 2);\n          height: 14.25rem;\n\n          background: #000000;\n        }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-about-container) .landing-about) .scrim-wrapper) p {\n          padding: 1rem 0;\n          margin: 0;\n        }\n\n.curriculum-content-container.curriculum-landing .landing-stairway {\n    max-width: 100%;\n    margin: 0;\n    background-color: var(--color-background-secondary);\n  }\n\n:is(.curriculum-content-container.curriculum-landing .landing-stairway)  > div {\n      display: grid;\n\n      grid-template-areas: \"a\" \"b\";\n      grid-template-rows: auto auto;\n      grid-template-columns: auto;\n\n      justify-content: center;\n\n      width: 100%;\n      max-width: min(var(--max-width), 74rem);\n\n      padding: 2rem;\n      padding-right: var(--gutter);\n      padding-left: var(--gutter);\n      margin: 0 auto 3rem;\n\n      color: var(--color-text-secondary);\n    }\n\n@media (769px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .landing-stairway)  > div {\n        grid-template-columns: min(100%, 34rem);\n    }\n      }\n\n@media (992px < width) {\n\n:is(.curriculum-content-container.curriculum-landing .landing-stairway)  > div {\n        grid-template-areas: \"a b\";\n        grid-template-columns: 1fr 1.4fr;\n    }\n      }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) svg {\n        width: 100%;\n      }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div)  > #stairway1-container {\n        --fs: clamp(1rem, calc(3 * calc(100vw / 100)), 1.75rem);\n        position: relative;\n\n        grid-area: a;\n\n        width: 100%;\n\n        margin: 0;\n\n        transform: translateX(2vw);\n      }\n\n@media (992px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div)  > #stairway1-container {\n          --fs: clamp(1rem, calc(2 * calc(100vw / 100)), 1.75rem);\n      }\n        }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway1-container) #stairway1 {\n          position: absolute;\n          top: 18%;\n          left: 32%;\n\n          font-size: var(--fs);\n        }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway1-container) #stairway1)  > span {\n            display: block;\n\n            width: max-content;\n\n            line-height: calc(1.25 * var(--fs));\n\n            text-wrap: nowrap;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway1-container) #stairway1) .color {\n            color: var(--curriculum-color);\n          }\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div)  > #stairway2-container {\n        --fs: clamp(0.75rem, calc(1.25 * calc(100vw / 100)), 1rem);\n        position: relative;\n        grid-area: b;\n        transform: translateX(-5vw);\n      }\n\n@media (769px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div)  > #stairway2-container {\n          --fs: clamp(0.75rem, calc(100vw / 100), 0.825rem);\n      }\n        }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2 {\n          position: absolute;\n          top: 0;\n          left: 0;\n\n          width: calc(100% + 5vw);\n          height: 100%;\n\n          margin: 0;\n\n          font-size: var(--fs);\n        }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2)  > span {\n            position: absolute;\n\n            display: block;\n\n            max-width: 10rem;\n\n            line-height: calc(1.25 * var(--fs));\n\n            text-wrap: wrap;\n          }\n\n@media (769px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2)  > span {\n              max-width: initial;\n              text-wrap: nowrap;\n          }\n            }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-1 {\n            top: 36%;\n            left: 47%;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-2 {\n            top: 52%;\n            left: 33%;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-3 {\n            top: 71%;\n            left: 23%;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-4 {\n            top: 86%;\n            left: 8%;\n          }\n\n@media (769px < width) {\n            :is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-1 {\n              top: 53%;\n              left: 35%;\n            }\n\n            :is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-2 {\n              top: 65%;\n              left: 27%;\n            }\n\n            :is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-3 {\n              top: 77%;\n              left: 13%;\n            }\n\n            :is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) #stairway2) #stair-4 {\n              top: 90%;\n              left: 0%;\n            }\n          }\n\n#stairway2large:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) > svg) {\n            display: none;\n            grid-area: b;\n          }\n\n@media (769px < width) {\n\n#stairway2large:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) > svg) {\n              display: initial;\n          }\n            }\n\n#stairway2small:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) > svg) {\n            grid-area: b;\n            max-width: 100%;\n          }\n\n@media (769px < width) {\n\n#stairway2small:is(:is(:is(:is(.curriculum-content-container.curriculum-landing .landing-stairway) > div) > #stairway2-container) > svg) {\n              display: none;\n          }\n            }\n\n.curriculum-content-container.curriculum-landing #dont_know_where_toget_started {\n    width: fit-content;\n\n    margin: 1rem auto 5rem;\n\n    line-height: 3rem;\n\n    text-align: center;\n  }\n\n:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started)::after {\n      position: absolute;\n\n      width: 6em;\n\n      content: url(\"../curriculum/assets/curriculum-started-underline.svg\");\n\n      transform: translate3d(-6em, 1.25rem, 0);\n    }\n\n:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div)  > ul {\n        display: grid;\n\n        grid-template-areas: \"beginner\" \"advanced\" \"employ\" \"educator\";\n\n        gap: 1rem;\n\n        max-width: 52rem;\n\n        margin: 0 auto;\n\n        overflow: clip;\n\n        scroll-snap-type: inline mandatory;\n      }\n\n@media (769px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div)  > ul {\n          grid-template-areas:\n            \"beginner advanced\"\n            \"employ educator\";\n          grid-template-columns: auto auto;\n          gap: 5rem 4rem;\n      }\n        }\n\n@media (992px < width) {\n\n:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div)  > ul {\n          gap: 5rem 8rem;\n      }\n        }\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul)  > li {\n          display: grid;\n\n          grid-template-areas:\n            \"i h\"\n            \"p p\"\n            \"c c\";\n          grid-template-rows: 4rem minmax(2rem, max-content) max-content;\n          grid-template-columns: 3rem 1fr;\n\n          gap: 1rem;\n          align-items: center;\n\n          height: max-content;\n\n          padding: 1rem 0.5rem;\n\n          color: var(--color-text-secondary);\n\n          scroll-snap-align: center;\n\n          background-color: var(--curriculum-bg-large-color);\n          border-radius: var(--elem-radius);\n        }\n\n@media (769px < width) {\n\n:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul)  > li {\n            grid-template-areas:\n              \"i h\"\n              \"i p\"\n              \"i c\";\n            grid-template-rows: 4rem auto max-content;\n            grid-template-columns: auto auto;\n\n            gap: 1rem 2rem;\n            align-items: start;\n\n            width: initial;\n            height: initial;\n\n            padding: 0;\n\n            background-color: initial;\n        }\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li)::before {\n            display: inline-block;\n\n            align-self: start;\n\n            width: 3rem;\n            height: 3rem;\n          }\n\n@media (769px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li)::before {\n              grid-area: i;\n              width: 5rem;\n              height: 5rem;\n          }\n            }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li):nth-child(1)::before {\n            content: var(--curriculum-landing-started-beginner);\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li):nth-child(2)::before {\n            content: var(--curriculum-landing-started-advanced);\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li):nth-child(3)::before {\n            content: var(--curriculum-landing-started-employment);\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li):nth-child(4)::before {\n            content: var(--curriculum-landing-started-educator);\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) h3 {\n            grid-area: h;\n\n            margin-top: 0;\n\n            font-weight: var(--font-weight-bold);\n\n            line-height: var(--font-line-normal);\n\n            color: var(--color-text-primary);\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) p:nth-child(2) {\n            grid-area: p;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) p:nth-child(3) {\n            grid-area: c;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) em {\n            grid-area: p;\n            align-self: start;\n          }\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a {\n            --csstools-light-dark-toggle-35d37db9-0: var(--csstools-color-scheme--light) #ffffff;\n            --button-bg--default: var(--csstools-light-dark-toggle-35d37db9-0, #1b1b1b);\n            --csstools-light-dark-toggle-35d37db9-1: var(--csstools-color-scheme--light) #cdcdcd;\n            --button-bg-hover--default: var(--csstools-light-dark-toggle-35d37db9-1, #696969);\n            --csstools-light-dark-toggle-35d37db9-2: var(--csstools-color-scheme--light) #9e9e9e;\n            --button-bg-active--default: var(--csstools-light-dark-toggle-35d37db9-2, #9e9e9e);\n            --csstools-light-dark-toggle-35d37db9-3: var(--csstools-color-scheme--light) #ffffff;\n            --button-border-color--default: var(--csstools-light-dark-toggle-35d37db9-3, #1d1d1d);\n            --button-color--default: var(--color-background-primary);\n\n            --button-bg: var(--button-bg--default);\n            --button-bg-hover: var(--button-bg-hover--default);\n            --button-bg-active: var(--button-bg-active--default);\n            --button-border-color: var(--button-border-color--default);\n            --button-height: 2rem;\n            --button-color: var(--button-color--default);\n            --button-radius: var(--elem-radius, 0.25rem);\n            position: relative;\n\n            display: flex;\n\n            grid-area: c;\n\n            gap: 0.25rem;\n            align-items: center;\n            justify-content: center;\n            justify-self: center;\n\n            width: fit-content;\n            min-height: var(--button-height);\n\n            padding: 0.5rem;\n            padding-right: var(--button-padding);\n            padding-left: var(--button-padding);\n\n            font-size: var(--font-size-small);\n            font-weight: var(--font-weight-bold);\n\n            color: var(--button-color);\n\n            text-align: center;\n\n            -webkit-text-decoration: none;\n\n            -webkit-text-decoration: none;\n\n            text-decoration: none;\n\n            cursor: pointer;\n\n            background-color: var(--button-bg);\n            border: 1px solid var(--button-border-color);\n            border-radius: var(--button-radius);\n          }\n\n@supports (color: light-dark(red, red)){\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a {\n            --button-bg--default: light-dark(#1b1b1b, #ffffff);\n            --button-bg-hover--default: light-dark(#696969, #cdcdcd);\n            --button-bg-active--default: light-dark(#9e9e9e, #9e9e9e);\n            --button-border-color--default: light-dark(#1d1d1d, #ffffff);\n          }\n}\n\n@supports not (color: light-dark(tan, tan)){\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a) *{\n            --csstools-light-dark-toggle-35d37db9-0: var(--csstools-color-scheme--light) #ffffff;\n            --button-bg--default: var(--csstools-light-dark-toggle-35d37db9-0, #1b1b1b);\n            --csstools-light-dark-toggle-35d37db9-1: var(--csstools-color-scheme--light) #cdcdcd;\n            --button-bg-hover--default: var(--csstools-light-dark-toggle-35d37db9-1, #696969);\n            --csstools-light-dark-toggle-35d37db9-2: var(--csstools-color-scheme--light) #9e9e9e;\n            --button-bg-active--default: var(--csstools-light-dark-toggle-35d37db9-2, #9e9e9e);\n            --csstools-light-dark-toggle-35d37db9-3: var(--csstools-color-scheme--light) #ffffff;\n            --button-border-color--default: var(--csstools-light-dark-toggle-35d37db9-3, #1d1d1d);\n  }\n}\n\n@media (769px < width) {\n\n:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a {\n              justify-self: start;\n          }\n            }\n\n:is(:is(:is(:is(:is(.curriculum-content-container.curriculum-landing #dont_know_where_toget_started) ~ div) > ul) > li) a):hover {\n              background-color: var(--button-bg-hover, var(--button-bg));\n            }\n"],"names":[],"mappings":"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"}

package/out/static/client/styles-curriculum-module.c7ec78d3e724cf64.css.map

@@ -1 +1 @@
-{"version":3,"file":"styles-curriculum-module.c7ec78d3e724cf64.css","sources":["webpack://@mdn/fred/./components/curriculum-module/server.css"],"sourcesContent":["@import url(\"../curriculum/shared.css\");\n@import url(\"../curriculum/sidebar.css\");\n@import url(\"../curriculum/layout.css\");\n\n.curriculum-content-container.curriculum-module .curriculum-layout__header {\n    display: grid;\n\n    grid-template-areas:\n      \". group\"\n      \"icon heading\"\n      \"icon category\";\n\n    column-gap: 1.5rem;\n    justify-content: flex-start;\n\n    padding-bottom: 0;\n  }\n\n:is(.curriculum-content-container.curriculum-module .curriculum-layout__header) .topic-icon {\n      --background-primary: var(--curriculum-bg-color-topic);\n      grid-area: icon;\n\n      align-self: flex-start;\n\n      width: 4rem;\n      height: 4rem;\n    }\n\n:is(.curriculum-content-container.curriculum-module .curriculum-layout__header) h1 {\n      grid-area: heading;\n      margin: 0;\n      font-size: var(--font-size-largest);\n    }\n\n:is(:is(.curriculum-content-container.curriculum-module .curriculum-layout__header) svg.topic-icon) circle {\n        fill: var(--background-primary);\n      }\n\n:is(:is(.curriculum-content-container.curriculum-module .curriculum-layout__header) svg.topic-icon) path {\n        fill: var(--curriculum-color-topic);\n      }\n\n:is(.curriculum-content-container.curriculum-module .curriculum-layout__header) p.module-topic {\n      grid-area: category;\n\n      margin: 0;\n      margin-top: 0.5rem;\n\n      font-size: var(--font-size-normal);\n\n      color: var(--curriculum-color-topic);\n    }\n\n:is(:is(.curriculum-content-container.curriculum-module .curriculum-layout__header) p.module-topic)::before {\n        content: \"Category: \";\n      }\n\n:is(.curriculum-content-container.curriculum-module .curriculum-layout__header) p.module-group {\n      grid-area: group;\n\n      align-self: center;\n\n      width: fit-content;\n      height: max-content;\n\n      padding: 0.125rem 0.5rem;\n      margin: 0;\n      margin-bottom: 0.25rem;\n\n      font-size: var(--font-size-normal);\n\n      color: var(--curriculum-module-label-color);\n\n      background-color: var(--curriculum-module-label-bg-color);\n      border-radius: 0.25rem;\n    }\n\n.curriculum-module p.curriculum-resources {\n    margin-top: 2rem;\n    margin-bottom: 0.5rem;\n  }\n\n:is(.curriculum-module p.curriculum-resources)  + ul {\n      padding-left: 2rem;\n    }\n\n:is(:is(.curriculum-module p.curriculum-resources) + ul)  > li {\n        list-style-image: var(--curriculum-module-mdn-resource);\n      }\n\n.curriculum-external-li:is(:is(:is(.curriculum-module p.curriculum-resources) + ul) > li) {\n          list-style-image: url(\"../curriculum/assets/curriculum-ext-resource.svg\");\n        }\n\n:is(:is(:is(.curriculum-module p.curriculum-resources) + ul) > li) em {\n          display: inline-block;\n\n          padding: 0 0.4em;\n\n          font-size: 0.5rem;\n          font-weight: bold;\n\n          line-height: var(--font-line-content);\n          vertical-align: super;\n\n          color: var(--color-text-primary);\n\n          text-transform: uppercase;\n\n          background: var(--curriculum-bg-color);\n          border-radius: 1em;\n          text-rendering: optimizelegibility;\n        }\n"],"names":[],"mappings":"AAIA,2EAQI,iBAAkB,CAPlB,YAAa,CAEb,4DAGiB,CAGjB,0BAA2B,CAE3B,gBACF,CAEF,4FACM,qDAAsD,CAGtD,qBAAsB,CAFtB,cAAe,CAKf,WAAY,CADZ,UAEF,CAEJ,mFAGM,kCAAmC,CAFnC,iBAAkB,CAClB,QAEF,CAEJ,2GACQ,8BACF,CAEN,yGACQ,kCACF,CAEN,+FAQM,mCAAoC,CAFpC,iCAAkC,CALlC,kBAAmB,CAGnB,gBAKF,CAEJ,2GACQ,oBACF,CAEN,+FAGM,iBAAkB,CAalB,wDAAyD,CACzD,oBAAsB,CAHtB,0CAA2C,CAF3C,iCAAkC,CAXlC,eAAgB,CAKhB,kBAAmB,CAInB,iBAAsB,CAFtB,qBAAwB,CAHxB,iBAaF,CAEJ,0CAEI,mBAAqB,CADrB,eAEF,CAEF,kDACM,iBACF,CAEJ,0DACQ,sDACF,CAEN,sFACU,iFACF,CAER,kEAeU,qCAAsC,CACtC,iBAAkB,CALlB,+BAAgC,CAVhC,oBAAqB,CAIrB,eAAiB,CACjB,eAAiB,CAEjB,oCAAqC,CALrC,cAAgB,CAchB,iCAAkC,CAJlC,wBAAyB,CAJzB,oBASF"}
+{"version":3,"file":"styles-curriculum-module.c7ec78d3e724cf64.css","sources":["webpack://@mdn/fred/./components/curriculum-module/server.css"],"sourcesContent":["@import url(\"../curriculum/shared.css\");\n@import url(\"../curriculum/sidebar.css\");\n@import url(\"../curriculum/layout.css\");\n\n.curriculum-content-container.curriculum-module .curriculum-layout__header {\n    display: grid;\n\n    grid-template-areas:\n      \". group\"\n      \"icon heading\"\n      \"icon category\";\n\n    column-gap: 1.5rem;\n    justify-content: flex-start;\n\n    padding-bottom: 0;\n  }\n\n:is(.curriculum-content-container.curriculum-module .curriculum-layout__header) .topic-icon {\n      --background-primary: var(--curriculum-bg-color-topic);\n      grid-area: icon;\n\n      align-self: flex-start;\n\n      width: 4rem;\n      height: 4rem;\n    }\n\n:is(.curriculum-content-container.curriculum-module .curriculum-layout__header) h1 {\n      grid-area: heading;\n      margin: 0;\n      font-size: var(--font-size-largest);\n    }\n\n:is(:is(.curriculum-content-container.curriculum-module .curriculum-layout__header) svg.topic-icon) circle {\n        fill: var(--background-primary);\n      }\n\n:is(:is(.curriculum-content-container.curriculum-module .curriculum-layout__header) svg.topic-icon) path {\n        fill: var(--curriculum-color-topic);\n      }\n\n:is(.curriculum-content-container.curriculum-module .curriculum-layout__header) p.module-topic {\n      grid-area: category;\n\n      margin: 0;\n      margin-top: 0.5rem;\n\n      font-size: var(--font-size-normal);\n\n      color: var(--curriculum-color-topic);\n    }\n\n:is(:is(.curriculum-content-container.curriculum-module .curriculum-layout__header) p.module-topic)::before {\n        content: \"Category: \";\n      }\n\n:is(.curriculum-content-container.curriculum-module .curriculum-layout__header) p.module-group {\n      grid-area: group;\n\n      align-self: center;\n\n      width: fit-content;\n      height: max-content;\n\n      padding: 0.125rem 0.5rem;\n      margin: 0;\n      margin-bottom: 0.25rem;\n\n      font-size: var(--font-size-normal);\n\n      color: var(--curriculum-module-label-color);\n\n      background-color: var(--curriculum-module-label-bg-color);\n      border-radius: 0.25rem;\n    }\n\n.curriculum-module p.curriculum-resources {\n    margin-top: 2rem;\n    margin-bottom: 0.5rem;\n  }\n\n:is(.curriculum-module p.curriculum-resources)  + ul {\n      padding-left: 2rem;\n    }\n\n:is(:is(.curriculum-module p.curriculum-resources) + ul)  > li {\n        list-style-image: var(--curriculum-module-mdn-resource);\n      }\n\n.curriculum-external-li:is(:is(:is(.curriculum-module p.curriculum-resources) + ul) > li) {\n          list-style-image: url(\"../curriculum/assets/curriculum-ext-resource.svg\");\n        }\n\n:is(:is(:is(.curriculum-module p.curriculum-resources) + ul) > li) em {\n          display: inline-block;\n\n          padding: 0 0.4em;\n\n          font-size: 0.5rem;\n          font-weight: bold;\n\n          line-height: var(--font-line-content);\n          vertical-align: super;\n\n          color: var(--color-text-primary);\n\n          text-transform: uppercase;\n\n          background: var(--curriculum-bg-color);\n          border-radius: 1em;\n\n          text-rendering: optimizelegibility;\n        }\n"],"names":[],"mappings":"AAIA,2EAQI,iBAAkB,CAPlB,YAAa,CAEb,4DAGiB,CAGjB,0BAA2B,CAE3B,gBACF,CAEF,4FACM,qDAAsD,CAGtD,qBAAsB,CAFtB,cAAe,CAKf,WAAY,CADZ,UAEF,CAEJ,mFAGM,kCAAmC,CAFnC,iBAAkB,CAClB,QAEF,CAEJ,2GACQ,8BACF,CAEN,yGACQ,kCACF,CAEN,+FAQM,mCAAoC,CAFpC,iCAAkC,CALlC,kBAAmB,CAGnB,gBAKF,CAEJ,2GACQ,oBACF,CAEN,+FAGM,iBAAkB,CAalB,wDAAyD,CACzD,oBAAsB,CAHtB,0CAA2C,CAF3C,iCAAkC,CAXlC,eAAgB,CAKhB,kBAAmB,CAInB,iBAAsB,CAFtB,qBAAwB,CAHxB,iBAaF,CAEJ,0CAEI,mBAAqB,CADrB,eAEF,CAEF,kDACM,iBACF,CAEJ,0DACQ,sDACF,CAEN,sFACU,iFACF,CAER,kEAeU,qCAAsC,CACtC,iBAAkB,CALlB,+BAAgC,CAVhC,oBAAqB,CAIrB,eAAiB,CACjB,eAAiB,CAEjB,oCAAqC,CALrC,cAAgB,CAehB,iCAAkC,CALlC,wBAAyB,CAJzB,oBAUF"}

package/out/static/client/{styles-global.fb7afecd89ca2dff.js → styles-global.01d60465c4584631.js}

@@ -1 +1 @@
-export const __webpack_id__="4016";export const __webpack_ids__=["4016"];export const __webpack_modules__={21440:function(){},2283:function(){},99537:function(){},41100:function(){},89564:function(){},1314:function(){},53645:function(){},63874:function(){},94420:function(){},28614:function(){},12206:function(){},13141:function(){},26896:function(){},90998:function(){},27313:function(){},14132:function(){},14281:function(){},69767:function(){},41645:function(){},52213:function(){},10717:function(){}};import n from"./styles.5ce0bc180316e680.js";var o=function(o){return n(n.s=o)};import*as t from"./styles-global.fb7afecd89ca2dff.js";n.C(t),o(21440),o(99537),o(2283),o(41100),o(89564),o(1314),o(53645),o(63874),o(94420),o(28614),o(12206),o(13141),o(26896),o(90998),o(27313),o(14132),o(14281),o(69767),o(41645),o(52213),o(10717);
+export const __webpack_id__="4016";export const __webpack_ids__=["4016"];export const __webpack_modules__={21440:function(){},2283:function(){},99537:function(){},41100:function(){},89564:function(){},1314:function(){},53645:function(){},63874:function(){},94420:function(){},28614:function(){},12206:function(){},13141:function(){},26896:function(){},90998:function(){},27313:function(){},14132:function(){},14281:function(){},69767:function(){},41645:function(){},52213:function(){},10717:function(){}};import n from"./styles.5ce0bc180316e680.js";var o=function(o){return n(n.s=o)};import*as t from"./styles-global.01d60465c4584631.js";n.C(t),o(21440),o(99537),o(2283),o(89564),o(41100),o(1314),o(53645),o(63874),o(94420),o(28614),o(12206),o(13141),o(26896),o(90998),o(27313),o(14132),o(14281),o(69767),o(41645),o(52213),o(10717);

package/out/static/client/styles-global.4031cdde644ed6ce.css

@@ -0,0 +1,2 @@
+.badge.inline.optional,.badge.inline.readonly,.badge.inline.secure{border:1px solid var(--color-border-primary);border-radius:1em;color:var(--color-text-secondary);font-size:var(--font-size-small);padding:.25em .5em;vertical-align:text-top;white-space:nowrap}mdn-code-example{display:block}mdn-button{display:inline-flex;vertical-align:middle}:root{--csstools-light-dark-toggle-baa18a82-0:var(--csstools-color-scheme--light) var(--color-gray-40);--color-border-primary:var(--csstools-light-dark-toggle-baa18a82-0,var(--color-gray-60));--csstools-light-dark-toggle-baa18a82-1:var(--csstools-color-scheme--light) var(--color-gray-60);--color-border-secondary:var(--csstools-light-dark-toggle-baa18a82-1,var(--color-gray-40));--csstools-light-dark-toggle-baa18a82-2:var(--csstools-color-scheme--light) var(--color-blue-80);--color-border-active:var(--csstools-light-dark-toggle-baa18a82-2,var(--color-blue-50))}@supports (color:light-dark(red,red)){:root{--color-border-primary:light-dark(var(--color-gray-60),var(--color-gray-40));--color-border-secondary:light-dark(var(--color-gray-40),var(--color-gray-60));--color-border-active:light-dark(var(--color-blue-50),var(--color-blue-80))}}@supports not (color:light-dark(tan,tan)){:root *{--csstools-light-dark-toggle-baa18a82-0:var(--csstools-color-scheme--light) var(--color-gray-40);--color-border-primary:var(--csstools-light-dark-toggle-baa18a82-0,var(--color-gray-60));--csstools-light-dark-toggle-baa18a82-1:var(--csstools-color-scheme--light) var(--color-gray-60);--color-border-secondary:var(--csstools-light-dark-toggle-baa18a82-1,var(--color-gray-40));--csstools-light-dark-toggle-baa18a82-2:var(--csstools-color-scheme--light) var(--color-blue-80);--color-border-active:var(--csstools-light-dark-toggle-baa18a82-2,var(--color-blue-50))}}:root{--csstools-light-dark-toggle-29c9dff5-0:var(--csstools-color-scheme--light) var(--color-gray-05);--color-background-page:var(--csstools-light-dark-toggle-29c9dff5-0,var(--color-white));--csstools-light-dark-toggle-29c9dff5-1:var(--csstools-color-scheme--light) var(--color-gray-10);--color-background-primary:var(--csstools-light-dark-toggle-29c9dff5-1,var(--color-gray-90));--csstools-light-dark-toggle-29c9dff5-2:var(--csstools-color-scheme--light) var(--color-gray-20);--color-background-secondary:var(--csstools-light-dark-toggle-29c9dff5-2,var(--color-gray-80))}@supports (color:light-dark(red,red)){:root{--color-background-page:light-dark(var(--color-white),var(--color-gray-05));--color-background-primary:light-dark(var(--color-gray-90),var(--color-gray-10));--color-background-secondary:light-dark(var(--color-gray-80),var(--color-gray-20))}}@supports not (color:light-dark(tan,tan)){:root *{--csstools-light-dark-toggle-29c9dff5-0:var(--csstools-color-scheme--light) var(--color-gray-05);--color-background-page:var(--csstools-light-dark-toggle-29c9dff5-0,var(--color-white));--csstools-light-dark-toggle-29c9dff5-1:var(--csstools-color-scheme--light) var(--color-gray-10);--color-background-primary:var(--csstools-light-dark-toggle-29c9dff5-1,var(--color-gray-90));--csstools-light-dark-toggle-29c9dff5-2:var(--csstools-color-scheme--light) var(--color-gray-20);--color-background-secondary:var(--csstools-light-dark-toggle-29c9dff5-2,var(--color-gray-80))}}:root{--csstools-light-dark-toggle-29c9dff5-3:var(--csstools-color-scheme--light) var(--color-red-10);--color-background-red:var(--csstools-light-dark-toggle-29c9dff5-3,var(--color-red-90));--csstools-light-dark-toggle-29c9dff5-4:var(--csstools-color-scheme--light) var(--color-orange-10);--color-background-orange:var(--csstools-light-dark-toggle-29c9dff5-4,var(--color-orange-90));--csstools-light-dark-toggle-29c9dff5-5:var(--csstools-color-scheme--light) var(--color-yellow-10);--color-background-yellow:var(--csstools-light-dark-toggle-29c9dff5-5,var(--color-yellow-90));--csstools-light-dark-toggle-29c9dff5-6:var(--csstools-color-scheme--light) var(--color-green-10);--color-background-green:var(--csstools-light-dark-toggle-29c9dff5-6,var(--color-green-90));--csstools-light-dark-toggle-29c9dff5-7:var(--csstools-color-scheme--light) var(--color-blue-10);--color-background-blue:var(--csstools-light-dark-toggle-29c9dff5-7,var(--color-blue-90));--csstools-light-dark-toggle-29c9dff5-8:var(--csstools-color-scheme--light) var(--color-purple-10);--color-background-purple:var(--csstools-light-dark-toggle-29c9dff5-8,var(--color-purple-90))}@supports (color:light-dark(red,red)){:root{--color-background-red:light-dark(var(--color-red-90),var(--color-red-10));--color-background-orange:light-dark(var(--color-orange-90),var(--color-orange-10));--color-background-yellow:light-dark(var(--color-yellow-90),var(--color-yellow-10));--color-background-green:light-dark(var(--color-green-90),var(--color-green-10));--color-background-blue:light-dark(var(--color-blue-90),var(--color-blue-10));--color-background-purple:light-dark(var(--color-purple-90),var(--color-purple-10))}}@supports not (color:light-dark(tan,tan)){:root *{--csstools-light-dark-toggle-29c9dff5-3:var(--csstools-color-scheme--light) var(--color-red-10);--color-background-red:var(--csstools-light-dark-toggle-29c9dff5-3,var(--color-red-90));--csstools-light-dark-toggle-29c9dff5-4:var(--csstools-color-scheme--light) var(--color-orange-10);--color-background-orange:var(--csstools-light-dark-toggle-29c9dff5-4,var(--color-orange-90));--csstools-light-dark-toggle-29c9dff5-5:var(--csstools-color-scheme--light) var(--color-yellow-10);--color-background-yellow:var(--csstools-light-dark-toggle-29c9dff5-5,var(--color-yellow-90));--csstools-light-dark-toggle-29c9dff5-6:var(--csstools-color-scheme--light) var(--color-green-10);--color-background-green:var(--csstools-light-dark-toggle-29c9dff5-6,var(--color-green-90));--csstools-light-dark-toggle-29c9dff5-7:var(--csstools-color-scheme--light) var(--color-blue-10);--color-background-blue:var(--csstools-light-dark-toggle-29c9dff5-7,var(--color-blue-90));--csstools-light-dark-toggle-29c9dff5-8:var(--csstools-color-scheme--light) var(--color-purple-10);--color-background-purple:var(--csstools-light-dark-toggle-29c9dff5-8,var(--color-purple-90))}}:root{--csstools-light-dark-toggle-e9dfdd1f-0:var(--csstools-color-scheme--light) var(--color-white);--color-text-primary:var(--csstools-light-dark-toggle-e9dfdd1f-0,var(--color-black));--csstools-light-dark-toggle-e9dfdd1f-1:var(--csstools-color-scheme--light) var(--color-gray-60);--color-text-secondary:var(--csstools-light-dark-toggle-e9dfdd1f-1,var(--color-gray-40))}@supports (color:light-dark(red,red)){:root{--color-text-primary:light-dark(var(--color-black),var(--color-white));--color-text-secondary:light-dark(var(--color-gray-40),var(--color-gray-60))}}@supports not (color:light-dark(tan,tan)){:root *{--csstools-light-dark-toggle-e9dfdd1f-0:var(--csstools-color-scheme--light) var(--color-white);--color-text-primary:var(--csstools-light-dark-toggle-e9dfdd1f-0,var(--color-black));--csstools-light-dark-toggle-e9dfdd1f-1:var(--csstools-color-scheme--light) var(--color-gray-60);--color-text-secondary:var(--csstools-light-dark-toggle-e9dfdd1f-1,var(--color-gray-40))}}:root{--csstools-light-dark-toggle-e9dfdd1f-2:var(--csstools-color-scheme--light) var(--color-red-80);--color-text-red:var(--csstools-light-dark-toggle-e9dfdd1f-2,var(--color-red-20));--csstools-light-dark-toggle-e9dfdd1f-3:var(--csstools-color-scheme--light) var(--color-orange-80);--color-text-orange:var(--csstools-light-dark-toggle-e9dfdd1f-3,var(--color-orange-20));--csstools-light-dark-toggle-e9dfdd1f-4:var(--csstools-color-scheme--light) var(--color-yellow-80);--color-text-yellow:var(--csstools-light-dark-toggle-e9dfdd1f-4,var(--color-yellow-20));--csstools-light-dark-toggle-e9dfdd1f-5:var(--csstools-color-scheme--light) var(--color-green-80);--color-text-green:var(--csstools-light-dark-toggle-e9dfdd1f-5,var(--color-green-20));--csstools-light-dark-toggle-e9dfdd1f-6:var(--csstools-color-scheme--light) var(--color-blue-80);--color-text-blue:var(--csstools-light-dark-toggle-e9dfdd1f-6,var(--color-blue-20));--csstools-light-dark-toggle-e9dfdd1f-7:var(--csstools-color-scheme--light) var(--color-purple-80);--color-text-purple:var(--csstools-light-dark-toggle-e9dfdd1f-7,var(--color-purple-20))}@supports (color:light-dark(red,red)){:root{--color-text-red:light-dark(var(--color-red-20),var(--color-red-80));--color-text-orange:light-dark(var(--color-orange-20),var(--color-orange-80));--color-text-yellow:light-dark(var(--color-yellow-20),var(--color-yellow-80));--color-text-green:light-dark(var(--color-green-20),var(--color-green-80));--color-text-blue:light-dark(var(--color-blue-20),var(--color-blue-80));--color-text-purple:light-dark(var(--color-purple-20),var(--color-purple-80))}}@supports not (color:light-dark(tan,tan)){:root *{--csstools-light-dark-toggle-e9dfdd1f-2:var(--csstools-color-scheme--light) var(--color-red-80);--color-text-red:var(--csstools-light-dark-toggle-e9dfdd1f-2,var(--color-red-20));--csstools-light-dark-toggle-e9dfdd1f-3:var(--csstools-color-scheme--light) var(--color-orange-80);--color-text-orange:var(--csstools-light-dark-toggle-e9dfdd1f-3,var(--color-orange-20));--csstools-light-dark-toggle-e9dfdd1f-4:var(--csstools-color-scheme--light) var(--color-yellow-80);--color-text-yellow:var(--csstools-light-dark-toggle-e9dfdd1f-4,var(--color-yellow-20));--csstools-light-dark-toggle-e9dfdd1f-5:var(--csstools-color-scheme--light) var(--color-green-80);--color-text-green:var(--csstools-light-dark-toggle-e9dfdd1f-5,var(--color-green-20));--csstools-light-dark-toggle-e9dfdd1f-6:var(--csstools-color-scheme--light) var(--color-blue-80);--color-text-blue:var(--csstools-light-dark-toggle-e9dfdd1f-6,var(--color-blue-20));--csstools-light-dark-toggle-e9dfdd1f-7:var(--csstools-color-scheme--light) var(--color-purple-80);--color-text-purple:var(--csstools-light-dark-toggle-e9dfdd1f-7,var(--color-purple-20))}}:root{--csstools-light-dark-toggle-e40c6b49-0:var(--csstools-color-scheme--light) var(--color-blue-80);--color-link-normal:var(--csstools-light-dark-toggle-e40c6b49-0,var(--color-blue-20));--csstools-light-dark-toggle-e40c6b49-1:var(--csstools-color-scheme--light) var(--color-purple-80);--color-link-visited:var(--csstools-light-dark-toggle-e40c6b49-1,var(--color-purple-20))}@supports (color:light-dark(red,red)){:root{--color-link-normal:light-dark(var(--color-blue-20),var(--color-blue-80));--color-link-visited:light-dark(var(--color-purple-20),var(--color-purple-80))}}@supports not (color:light-dark(tan,tan)){:root *{--csstools-light-dark-toggle-e40c6b49-0:var(--csstools-color-scheme--light) var(--color-blue-80);--color-link-normal:var(--csstools-light-dark-toggle-e40c6b49-0,var(--color-blue-20));--csstools-light-dark-toggle-e40c6b49-1:var(--csstools-color-scheme--light) var(--color-purple-80);--color-link-visited:var(--csstools-light-dark-toggle-e40c6b49-1,var(--color-purple-20))}}:root{--color-scrollbar-track:#0000;--csstools-light-dark-toggle-a81cd71e-0:var(--csstools-color-scheme--light) var(--color-white-alpha-25);--color-scrollbar-thumb:var(--csstools-light-dark-toggle-a81cd71e-0,var(--color-black-alpha-25))}@supports (color:light-dark(red,red)){:root{--color-scrollbar-thumb:light-dark(var(--color-black-alpha-25),var(--color-white-alpha-25))}}@supports not (color:light-dark(tan,tan)){:root *{--csstools-light-dark-toggle-a81cd71e-0:var(--csstools-color-scheme--light) var(--color-white-alpha-25);--color-scrollbar-thumb:var(--csstools-light-dark-toggle-a81cd71e-0,var(--color-black-alpha-25))}}:root{--color-area-background:var(--color-background-blue);--color-area-highlight-border:var(--color-blue-50);--color-area-link:var(--color-link-normal)}:root[data-current-area=learn]{--color-area-background:var(--color-background-orange);--color-area-highlight-border:var(--color-orange-50);--csstools-light-dark-toggle-9cb2d9c1-0:var(--csstools-color-scheme--light) var(--color-orange-80);--color-area-link:var(--csstools-light-dark-toggle-9cb2d9c1-0,var(--color-orange-20))}@supports (color:light-dark(red,red)){:root[data-current-area=learn]{--color-area-link:light-dark(var(--color-orange-20),var(--color-orange-80))}}@supports not (color:light-dark(tan,tan)){[data-current-area=learn]:root *{--csstools-light-dark-toggle-9cb2d9c1-0:var(--csstools-color-scheme--light) var(--color-orange-80);--color-area-link:var(--csstools-light-dark-toggle-9cb2d9c1-0,var(--color-orange-20))}}:root{--color-white:#fff;--color-white-alpha-25:#ffffff40;--color-white-alpha-75:#ffffffbf;--color-black:#000;--color-black-alpha-25:#00000040;--color-black-alpha-75:#000000bf;--color-gray-90:#f7f7f8;--color-gray-80:#edeef0;--color-gray-60:#c3c7cb;--color-gray-40:#51565d;--color-gray-20:#2d3034;--color-gray-10:#212426;--color-gray-05:#18191b;--color-red-90:#ffe6ea;--color-red-80:#fc7d92;--color-red-50:#d31232;--color-red-20:#b7102c;--color-red-10:#4b0b16;--color-orange-90:#fef3eb;--color-orange-80:#febe8f;--color-orange-50:#e2782c;--color-orange-20:#c2570a;--color-orange-10:#3f220d;--color-yellow-90:#fef0c3;--color-yellow-80:#fae49e;--color-yellow-50:#e6b30a;--color-yellow-20:#97770c;--color-yellow-10:#574405;--color-green-90:#eaf6ef;--color-green-80:#70eba3;--color-green-50:#089141;--color-green-20:#065b29;--color-green-10:#0c311c;--color-blue-90:#ecf4fe;--color-blue-80:#a4cefe;--color-blue-50:#0a5dbd;--color-blue-20:#044c9f;--color-blue-10:#072446;--color-purple-90:#f7f0ff;--color-purple-80:#d8b8ff;--color-purple-50:#863ae4;--color-purple-20:#5f1fad;--color-purple-10:#260e43}html[data-theme=light]{--csstools-color-scheme--light:initial;color-scheme:light}html[data-theme=dark]{--csstools-color-scheme--light: ;color-scheme:dark}mdn-dropdown{display:contents}mdn-dropdown:not([loaded],:focus-within) [slot=dropdown]{display:none}.external:after{background-color:currentcolor;content:"\200b" " (external)";content:"\200b"/" (external)";display:inline-block;height:1em;margin-left:.25em;-webkit-mask-image:url(/static/client/external-link.4f3a2dc8e402cae5.svg);mask-image:url(/static/client/external-link.4f3a2dc8e402cae5.svg);-webkit-mask-size:cover;mask-size:cover;vertical-align:text-top;width:1em}@font-feature-values "Inter"{@styleset{disambiguation:2}}@font-face{font-display:swap;font-family:Inter;font-feature-settings:"calt" 0;font-style:normal;font-weight:100 900;src:url(/static/client/inter-latin.9a3b1bc220d426ef.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-display:swap;font-family:Inter;font-feature-settings:"calt" 0;font-style:italic;font-weight:100 900;src:url(/static/client/inter-italic-latin.fd2627ec16333c05.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-display:swap;font-family:Inter;font-feature-settings:"calt" 0;font-style:normal;font-weight:100 900;src:url(/static/client/inter-latin-extended.02dc98170ff37b88.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}@font-face{font-display:swap;font-family:Inter;font-feature-settings:"calt" 0;font-style:italic;font-weight:100 900;src:url(/static/client/inter-italic-latin-extended.0a7409875db33654.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}@font-face{font-display:swap;font-family:Inter;font-feature-settings:"calt" 0;font-style:normal;font-weight:100 900;src:url(/static/client/inter-cyrillic.eecfbd79d522303a.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}@font-face{font-display:swap;font-family:Inter;font-feature-settings:"calt" 0;font-style:italic;font-weight:100 900;src:url(/static/client/inter-italic-cyrillic.d153dcd2916c4842.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}@font-face{font-display:swap;font-family:JetBrains Mono;font-style:normal;font-weight:100 800;size-adjust:95%;src:url(/static/client/jetbrains-mono-latin.119994ed445212c7.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-display:swap;font-family:JetBrains Mono;font-style:italic;font-weight:100 800;size-adjust:95%;src:url(/static/client/jetbrains-mono-italic-latin.55b330522e5e3ed9.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-display:swap;font-family:JetBrains Mono;font-style:normal;font-weight:100 800;size-adjust:95%;src:url(/static/client/jetbrains-mono-latin-extended.01c891f9c832ce28.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}@font-face{font-display:swap;font-family:JetBrains Mono;font-style:italic;font-weight:100 800;size-adjust:95%;src:url(/static/client/jetbrains-mono-italic-latin-extended.c25d5e1f309ed948.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}@font-face{font-display:swap;font-family:JetBrains Mono;font-style:normal;font-weight:100 800;size-adjust:95%;src:url(/static/client/jetbrains-mono-cyrillic.577e793cdf179ae1.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}@font-face{font-display:swap;font-family:JetBrains Mono;font-style:italic;font-weight:100 800;size-adjust:95%;src:url(/static/client/jetbrains-mono-italic-cyrillic.8d00711fdb1702e0.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}:root{--font-family-text:"Inter",sans-serif;--font-family-code:"JetBrains Mono",monospace;--font-line-content:1.75;--font-line-normal:1.5;--font-line-ui:1;--font-size-largest:2.5rem;--font-size-larger:2rem;--font-size-large:1.5rem;--font-size-normal:1rem;--font-size-small:0.8rem;--font-weight-normal:400;--font-weight-bold:600}*,:after,:before{box-sizing:border-box}button,input,select,textarea{font:inherit}button{color:inherit;cursor:pointer}img{height:auto;max-width:100%}a{color:var(--color-link-normal)}[hidden]{display:none!important}html{color:var(--color-text-primary);font-family:var(--font-family-text);font-feature-settings:"calt" 0;font-size:var(--font-size-normal);font-variant-alternates:styleset(disambiguation);line-height:var(--font-line-normal);overflow-wrap:break-word;--csstools-color-scheme--light:initial;background-color:var(--color-background-page);color-scheme:light dark;scroll-behavior:smooth}@media (prefers-color-scheme:dark){html{--csstools-color-scheme--light: }}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}.icon.icon-deprecated,.icon.icon-experimental,.icon.icon-nonstandard{background-color:var(--color-text-secondary);display:inline-block;flex-shrink:0;height:1em;-webkit-mask-size:cover;mask-size:cover;vertical-align:middle;width:1em}.icon.icon-deprecated{-webkit-mask-image:url(/static/client/trash-2.73b28bc66fb8543c.svg);mask-image:url(/static/client/trash-2.73b28bc66fb8543c.svg)}.icon.icon-experimental{-webkit-mask-image:url(/static/client/flask-conical.c16b3d71f14f31d1.svg);mask-image:url(/static/client/flask-conical.c16b3d71f14f31d1.svg)}.icon.icon-nonstandard{-webkit-mask-image:url(/static/client/triangle-alert.cff4c57ccef57da3.svg);mask-image:url(/static/client/triangle-alert.cff4c57ccef57da3.svg)}:root{--layout-side-padding-min:1rem;--layout-side-padding:max(var(--layout-side-padding-min),calc(50vw - 720px + 1rem));--layout-full-width:calc(100vw - var(--layout-side-padding)*2);--layout-sidebar-min:14rem;--layout-sidebar-gap:2rem;--layout-content-min:31rem;--layout-content-max:48rem;--layout-2-sidebars:[full-start left-sidebar-start] minmax(var(--layout-sidebar-min),1fr) [left-sidebar-end] var(--layout-sidebar-gap) [content-start] minmax(0,var(--layout-content-max)) [content-end] var(--layout-sidebar-gap) [right-sidebar-start] minmax(var(--layout-sidebar-min),1fr) [full-end right-sidebar-end];--layout-1-sidebar-left:[full-start sidebar-start left-sidebar-start] minmax(var(--layout-sidebar-min),1fr) [sidebar-end left-sidebar-end] var(--layout-sidebar-gap) [content-start] minmax(0,var(--layout-content-max)) [full-end content-end] minmax(0,1fr);--layout-1-sidebar-right:minmax(0,1fr) [full-start content-start] minmax(0,var(--layout-content-max)) [content-end] var(--layout-sidebar-gap) [sidebar-start right-sidebar-start] minmax(var(--layout-sidebar-min),1fr) [full-end sidebar-end right-sidebar-end];--layout-no-sidebar:[full-start] 1fr [content-start] minmax(0,var(--layout-content-max)) [content-end] 1fr [full-end];--layout-no-sidebar-extended:[extended-full-start] var(--layout-side-padding) [full-start] 1fr [content-start] minmax(0,var(--layout-content-max)) [content-end] 1fr [full-end] var(--layout-side-padding) [extended-full-end]}mdn-live-sample-result{display:block}html a.only-in-en-us:after{content:"(en-US)";display:inline-block;font-size:.7rem;margin-left:.5ch;vertical-align:super}html[lang=de] a.only-in-en-us:after{content:"(engl.)"}html[lang=es] a.only-in-en-us:after{content:"(inglés)"}html[lang=fr] a.only-in-en-us:after{content:"(angl.)"}html[lang=ja] a.only-in-en-us:after{content:"(英語)"}html[lang=ko] a.only-in-en-us:after{content:"(영어)"}html[lang=ru] a.only-in-en-us:after{content:"(англ.)"}html[lang=pt-BR] a.only-in-en-us:after{content:"(inglês)"}html[lang=zh-CN] a.only-in-en-us:after{content:"（英语）";margin-left:unset;vertical-align:initial}html[lang=zh-TW] a.only-in-en-us:after{content:"（英語）";margin-left:unset;vertical-align:initial}.page-not-created{color:var(--color-text-red);text-decoration:underline!important;-webkit-text-decoration:underline wavy!important;text-decoration:underline wavy!important}@media print{*{-webkit-print-color-adjust:exact;print-color-adjust:exact}:root{--csstools-color-scheme--light:initial;color-scheme:light;--layout-2-sidebars:minmax(0,1fr)!important;--layout-1-sidebar-left:minmax(0,1fr)!important;--layout-no-sidebar:minmax(0,1fr)!important}body{font-size:9pt;line-height:1.5;margin:0;padding:0}.page-layout{display:block!important;grid-template-rows:none!important;height:auto!important;min-height:auto!important}.page-layout__header{position:static!important;top:auto!important;z-index:auto!important}:root{--sticky-header-height:0!important}.article-footer,.content-section.article-footer,.footer__links,.footer__mozilla,.footer__socials,.navigation__button,.navigation__menu,.page-layout__banner,.reference-layout__sidebar,.reference-layout__toc,mdn-collection-save-button,mdn-color-theme,mdn-placement-bottom,mdn-search-button,mdn-toggle-sidebar,mdn-user-menu{display:none!important}.reference-layout{grid-template-areas:"header" "body"!important;grid-template-columns:auto!important;grid-template-rows:auto!important}a{-webkit-text-decoration:none!important;text-decoration:none!important}details.baseline-indicator>:not(summary),details.baseline-indicator[open]>:not(summary){display:none!important}details.baseline-indicator>summary::marker{display:none!important}.code-example,.default-example,.example-container,.interactive,[class*=example]{break-inside:avoid!important;display:block!important;float:none!important;height:auto!important;margin-bottom:1rem!important;overflow:visible!important;page-break-inside:avoid!important;position:static!important;width:100%!important}.footer__mdn{row-gap:0!important}interactive-example,section{clear:both!important;display:block!important;position:static!important}interactive-example{break-inside:avoid!important;page-break-inside:avoid!important}[style*="position: absolute"],[style*="position: fixed"]{position:static!important}}:root{--radius-normal:0.25rem;--radius-full:9999px}@font-face{font-display:block;font-family:BarlowCondensed-SemiBold;font-weight:var(--font-weight-bold);src:local("BarlowCondensed-SemiBold"),url(/static/client/BarlowCondensed-SemiBold.199288b668a15dc1.woff2) format("woff2")}.table-container{margin:0;overflow-x:auto}:root{--top-banner-height:3.375rem;--sticky-header-height:calc(var(--navigation-height) + var(--breadcrumbs-bar-height));--z-index-sticky-header:100;--z-index-sidebar-mobile:90}.visually-hidden{border:0!important;clip-path:inset(50%)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}
+/*# sourceMappingURL=styles-global.4031cdde644ed6ce.css.map*/