@font-face{font-family:Inter;src:url("/media/fonts/Inter.var.woff2") format("woff2 supports variations"),url("/media/fonts/Inter.var.woff2") format("woff2-variations");font-weight:1 999;font-stretch:75% 100%;font-style:oblique 0deg 20deg;font-display:swap}:root{--font-fallback:BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-sans;--font-body:Inter,var(--font-fallback);--font-code:Consolas,"Courier New",monospace;--type-body-l:400 1rem/1.1876 var(--font-body);--type-emphasis-m:600 0.8125rem/1.23 var(--font-body);--font-heading:var(--font-body);--type-label-s:600 0.625rem/1.2 var(--font-heading);--type-code-regular:400 0.875rem/1.5 var(--font-code);--elem-radius:0.25rem;--button-height:2rem;--button-radius:var(--elem-radius)}.theme-light,:root{--text-primary:#15141a;--text-secondary:#5b5b66;--text-inactive:#5b5b66a6;--text-link:#1870f0;--background-primary:#ffffff;--background-secondary:#f9f9fb;--background-tertiary:#fbfbfe;--background-mark-yellow:rgba(232, 140, 102, 0.4);--background-mark-green:rgba(107, 184, 106, 0.4);--border-primary:#cfcfd8;--border-secondary:#e0e0e6;--button-primary-default:#15141a;--button-primary-hover:#3a3944;--button-primary-active:#5b5b66;--button-primary-inactive:#15141a;--button-secondary-default:#fbfbfe;--button-secondary-hover:#e0e0e6;--button-secondary-active:#e0e0e6;--button-secondary-inactive:#f9f9fb;--button-secondary-border-focus:#1870f0;--button-secondary-border-red:#f16b8c;--button-secondary-border-red-focus:#faced9;--icon-primary:#5b5b66;--icon-secondary:#afafba;--icon-information:#1870f0;--icon-warning:#d84000;--icon-critical:#ba0633;--icon-success:#066d05;--accent-primary:#1870f0;--accent-primary-engage:rgba(24, 112, 240, 0.1);--accent-secondary:#1870f0;--accent-tertiary:rgba(24, 112, 240, 0.1);--shadow-01:0px 1px 2px rgba(43, 42, 51, 0.05);--shadow-02:0px 1px 6px rgba(43, 42, 51, 0.1);--focus-01:0px 0px 0px 3px rgba(0, 144, 237, 0.4);--field-focus-border:#1870f0;--code-token-tag:#135ac0;--code-token-punctuation:#5b5b66;--code-token-attribute-name:#ba0633;--code-token-attribute-value:#066d05;--code-token-comment:#5b5b66;--code-token-default:#15141a;--code-token-selector:#8033c6;--code-background-inline:#f0f0f4;--code-background-block:rgba(240, 240, 244, 0.5)}.category-html{--accent-primary:#e80840}.category-css{--accent-primary:#1870f0}.category-js{--accent-primary:#d84000}.category-http{--accent-primary:#088806}.category-apis{--accent-primary:#a040f8}.theme-dark{--text-primary:#fbfbfe;--text-secondary:#cfcfd8;--text-inactive:#cfcfd8a6;--text-link:#74a9f6;--background-primary:#15141a;--background-secondary:#23222b;--background-tertiary:#2b2a33;--background-mark-yellow:rgba(232, 140, 102, 0.4);--border-primary:#52525e;--border-secondary:#3a3944;--button-primary-default:#fbfbfe;--button-primary-hover:#cfcfd8;--button-primary-active:#9f9fad;--button-primary-inactive:#fbfbfe;--button-secondary-default:#2b2a33;--button-secondary-hover:#52525e;--button-secondary-active:#5b5b66;--button-secondary-inactive:#2b2a33;--icon-primary:#fbfbfe;--icon-secondary:#afafba;--icon-information:#468df3;--icon-warning:#e06633;--icon-critical:#ed3966;--icon-success:#39a038;--accent-primary:#468df3;--accent-primary-engage:rgba(70, 141, 243, 0.1);--accent-secondary:#468df3;--shadow-01:0px 1px 2px rgba(251, 251, 254, 0.2);--shadow-02:0px 1px 6px rgba(251, 251, 254, 0.2);--focus-01:0px 0px 0px 3px rgba(251, 251, 254, 0.5);--field-focus-border:#fbfbfe;--code-token-tag:#74a9f6;--code-token-punctuation:#8f8f9d;--code-token-attribute-name:#ed3966;--code-token-attribute-value:#39a038;--code-token-comment:#8f8f9d;--code-token-default:#fbfbfe;--code-token-selector:#b366f9;--code-background-inline:#3a3944;--code-background-block:rgba(58, 57, 68, 0.5)}@media (prefers-color-scheme:dark){:root{--text-primary:#fbfbfe;--text-secondary:#cfcfd8;--text-inactive:#cfcfd8a6;--text-link:#74a9f6;--background-primary:#15141a;--background-secondary:#23222b;--background-tertiary:#2b2a33;--background-mark-yellow:rgba(232, 140, 102, 0.4);--border-primary:#52525e;--border-secondary:#3a3944;--button-primary-default:#fbfbfe;--button-primary-hover:#cfcfd8;--button-primary-active:#9f9fad;--button-primary-inactive:#fbfbfe;--button-secondary-default:#2b2a33;--button-secondary-hover:#52525e;--button-secondary-active:#5b5b66;--button-secondary-inactive:#2b2a33;--icon-primary:#fbfbfe;--icon-secondary:#afafba;--icon-information:#468df3;--icon-warning:#e06633;--icon-critical:#ed3966;--icon-success:#39a038;--accent-primary:#468df3;--accent-primary-engage:rgba(70, 141, 243, 0.1);--accent-secondary:#468df3;--shadow-01:0px 1px 2px rgba(251, 251, 254, 0.2);--shadow-02:0px 1px 6px rgba(251, 251, 254, 0.2);--focus-01:0px 0px 0px 3px rgba(251, 251, 254, 0.5);--field-focus-border:#fbfbfe;--code-token-tag:#74a9f6;--code-token-punctuation:#8f8f9d;--code-token-attribute-name:#ed3966;--code-token-attribute-value:#39a038;--code-token-comment:#8f8f9d;--code-token-default:#fbfbfe;--code-token-selector:#b366f9;--code-background-inline:#3a3944;--code-background-block:rgba(58, 57, 68, 0.5)}.category-html{--accent-primary:#ed3966}.category-css{--accent-primary:#468df3}.category-js{--accent-primary:#e06633}.category-http{--accent-primary:#39a038}.category-apis{--accent-primary:#b366f9}}.theme-light.category-html{--accent-primary:#e80840}.theme-light.category-css{--accent-primary:#1870f0}.theme-light.category-js{--accent-primary:#d84000}.theme-light.category-http{--accent-primary:#088806}.theme-light.category-apis{--accent-primary:#a040f8}.theme-dark.category-html{--accent-primary:#ed3966}.theme-dark.category-css{--accent-primary:#468df3}.theme-dark.category-js{--accent-primary:#e06633}.theme-dark.category-http{--accent-primary:#39a038}.theme-dark.category-apis{--accent-primary:#b366f9}*{box-sizing:border-box}body{color:var(--text-primary);background-color:var(--background-primary);margin:0;padding:0;height:100%;font:var(--type-body-l)}.output-header{margin:0;padding:.5rem 1rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;border-bottom:1px solid var(--border-primary)}.output-header.no-border{border-bottom:0 none}.output-header.full-border{border:1px solid var(--border-primary);border-width:1px 1px 0 1px}.output-heading{margin:0;font:var(--type-body-l)}.reset{background-color:transparent;color:var(--text-primary);font:var(--type-label-s);margin:0;padding:.7em .9em;height:var(--button-height);text-transform:uppercase;letter-spacing:1.5px;border:none;max-width:100px;cursor:pointer;border-radius:var(--button-radius)}.reset:hover{background-color:var(--button-secondary-hover)}.CodeMirror{border:1px solid var(--border-primary);height:280px;background:var(--background-primary)}.CodeMirror-gutters{background:var(--background-secondary);border-right:1px solid var(--border-primary)}.CodeMirror-cursor{border-left:1px solid #fff;border-right:1px solid #000}.user-message{display:none;position:absolute;top:30px;left:50%;background-color:var(--text-secondary);color:var(--background-primary);padding:.5rem;border-radius:var(--elem-radius);font-size:14px;opacity:1;transition:opacity .5s;z-index:4}.fade-in{animation:fadein .5s}.fade-out{animation:fadeout .5s}.hide{opacity:0}.hidden{display:none}.show{display:block}.visually-hidden{position:absolute!important;height:1px;width:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);padding:0;border:0}@media screen and (min-width:47.9375em){header h4{font-size:1.1rem}}@media screen and (min-width:63.9375em){header h4{font-size:1.4rem}}@keyframes fadein{from{opacity:0}to{opacity:1}}@keyframes fadeout{from{opacity:1}to{opacity:0}}pre[class*=language-]{background-image:none;margin:0;border:0;box-shadow:none;overflow:auto}pre[class*=language-]>code{background:0 0;border:none;box-shadow:none}pre[class*=language-]:after,pre[class*=language-]:before{width:0}:not(pre)>code[class*=language-],pre[class*=language-]{background-color:transparent}code[class*=language-]{max-height:240px;overflow:auto}.line-numbers .line-numbers-rows{background-color:#f5f9fa;border-right:0}.line-numbers-rows>span:before{color:#333}.token.block-comment,.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#58636d}.token.attr-name,.token.builtin,.token.char,.token.function,.token.inserted,.token.selector,.token.string{color:#2545a7}.example-choice-list{padding:0}.editor-wrapper{display:flex;flex-direction:column}@media screen and (min-width:590px){.editor-wrapper{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0}}.example-choice-list.large.live,.example-choice-list.live{padding:1rem;text-align:right;overflow:auto;border-bottom:1px solid var(--border-primary)}@media screen and (min-width:590px){.example-choice-list.large.live,.example-choice-list.live{padding:1rem 2rem 1rem 1rem;border:0 none;border-right:1px solid var(--border-primary)}}.example-choice-list.live{height:324px;max-height:324px}.example-choice-list,.example-choice-list.large{float:none;width:auto}.output{height:300px;overflow:hidden;position:relative;background-color:var(--background-primary);overflow:hidden;padding:1em}.output section{height:100%;text-align:center}.live .example-choice{position:relative;z-index:1;display:block;padding:0 1rem;margin:.2em 0;width:100%;border:1px solid var(--border-primary);border-radius:var(--elem-radius);cursor:pointer;transition:background-color .2s ease-out,border .2s ease-out}.live .example-choice{background-color:var(--background-secondary)}.live .example-choice code{padding:10px 0}.example-choice-list .example-choice:first-child{margin-top:0}.example-choice:hover{border-color:#666;border-left-color:#666}.example-choice:hover .copy{display:block}.live .example-choice .example-choice-button,.live .example-choice:before{transform:translateY(-50%);position:absolute;top:50%;opacity:0;transition:all .2s ease-out;transform:translateY(-50%);border-left:4px solid var(--field-focus-border);border-top:4px solid transparent;border-bottom:4px solid transparent}.live .example-choice:before{content:"";opacity:0;transition:all .2s ease-out;transform:translateY(-50%);position:absolute;top:50%;right:-10px;z-index:1}.live .example-choice .example-choice-button{background-color:transparent;border-left-color:#666;outline-offset:2px;border-right:0;padding:0;right:-1.5em}.live .example-choice .example-choice-button:focus{opacity:1}@media screen and (min-width:590px){.example-choice.selected:before{opacity:1;right:-1rem}}.example-choice.selected{border-color:var(--field-focus-border);box-shadow:var(--focus-01);transition:height .5s;cursor:text}.example-choice.invalid:before{right:-1.8em;background:transparent url("../media/warning.svg") 0 0 no-repeat;background-size:20px;border:none;width:20px;height:20px}.example-choice.invalid{border-color:#ffb800;border-left-color:#ffb800}.example-choice>code{display:inline-block;width:90%}.copy{position:absolute;top:2px;right:2px;background:var(--background-tertiary) 50% 50% no-repeat;border-radius:var(--elem-radius);padding:6px 12px;border:1px solid var(--border-primary);width:30px;height:30px;vertical-align:middle;cursor:pointer;display:none}.copy:after{-webkit-mask-image:url("../media/clippy.svg");-webkit-mask-size:contain;-webkit-mask-position:center;mask-image:url("../media/clippy.svg");mask-size:contain;mask-position:center;position:absolute;width:16px;height:16px;top:6px;left:6px;background-color:var(--icon-primary);content:""}.copy:hover{background-color:var(--button-secondary-hover)}.transition-all{transition:all .3s ease-in}[contenteditable]:focus{outline:0 solid transparent}.example-choice.selected:focus{outline:0 solid transparent}.small-desktop-and-below .example-choice-list,.small-desktop-and-below .example-choice-list.large.live,.small-desktop-and-below .example-choice-list.live,.small-desktop-and-below .output{float:none;padding:0;width:100%;height:auto}.small-desktop-and-below .example-choice-list.live{max-height:225px;overflow:auto}.small-desktop-and-below .output,.small-desktop-and-below .output.large{position:relative;height:225px}.small-desktop-and-below .example-choice-list{padding-right:.7em;margin-bottom:1em}.small-desktop-and-below .example-choice:before{content:none}.small-desktop-and-below .live .example-choice{min-height:40px}.small-desktop-and-below .copy{display:none}@supports (display:flex){.example-choice-list.live{display:flex;flex-direction:column}.live .example-choice{display:flex;align-items:center;flex-grow:1}.live .example-choice pre{flex-grow:1}.output section{display:flex;align-items:center;justify-content:center}.output section.flex-column{flex-direction:column;align-items:initial}.output section.display-block{display:block}.output section img{flex-grow:0}.output section.hidden{display:none}}