.ContentCodeBlock__inner{margin-left:auto;margin-right:auto;max-width:var(--article-width-sm)}.ContentCodeBlock__inner--wide{max-width:var(--article-width-lg)}.LayoutGuides__main .ContentCodeBlock__inner{margin-left:0;max-width:none}.StyleCodeBlock pre[class*=language-]{border-radius:12px;padding-bottom:56px;padding-right:24px;padding-top:32px}.StyleCodeBlock pre[class*=language-].line-numbers{padding-left:66px}@media (min-width:800px){.StyleCodeBlock pre[class*=language-]{padding-bottom:56px;padding-right:48px;padding-top:48px}.StyleCodeBlock pre[class*=language-].line-numbers{padding-left:100px}}.StyleCodeBlock .line-numbers .line-numbers-rows{border-right:1px dashed #dbdcdc;left:auto;margin-right:12px;right:100%;width:auto}@media (min-width:800px){.StyleCodeBlock .line-numbers .line-numbers-rows{margin-right:16px}}.StyleCodeBlock .line-numbers .line-numbers-rows>span:before{padding-right:12px}@media (min-width:800px){.StyleCodeBlock .line-numbers .line-numbers-rows>span:before{padding-right:16px}}.StyleCodeBlock pre{max-height:600px;overflow:scroll}.StyleCodeBlock code[class*=language-],.StyleCodeBlock pre[class*=language-]{display:block;font-family:Roboto Mono,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;font-size:14px;line-height:1.5;margin:0;text-shadow:none}.StyleCodeBlock div.code-toolbar>.toolbar{height:0;opacity:1;position:static}.StyleCodeBlock div.code-toolbar>.toolbar .copy-to-clipboard-button span{--tw-text-opacity:1;color:#fff;color:rgba(255,255,255,var(--tw-text-opacity));opacity:0}.StyleCodeBlock div.code-toolbar>.toolbar:hover .copy-to-clipboard-button span{opacity:1}.StyleCodeBlock div.code-toolbar>.toolbar .toolbar-item>*{background-color:transparent;box-shadow:none;font-family:Roboto Mono,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;font-size:12px;line-height:1.33;padding:0;position:absolute;right:0}.StyleCodeBlock div.code-toolbar>.toolbar .toolbar-item>span{padding:16px;pointer-events:none;top:0}.StyleCodeBlock div.code-toolbar>.toolbar .toolbar-item>button{align-items:center;bottom:0;display:flex;padding:16px;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.StyleCodeBlock div.code-toolbar>.toolbar .toolbar-item>button,.StyleCodeBlock div.code-toolbar>.toolbar .toolbar-item>button:after{transition-duration:.25s}.StyleCodeBlock div.code-toolbar>.toolbar .toolbar-item>button:after{--tw-bg-opacity:1;align-items:center;background-color:#101111;background-color:rgba(16,17,17,var(--tw-bg-opacity));border-radius:4px;content:url(/imgs/copy-to-clipboard.svg);display:flex;height:32px;justify-content:center;margin-left:12px;transition-property:color,background-color,border-color,fill,stroke,-webkit-text-decoration-color;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,-webkit-text-decoration-color;transition-timing-function:cubic-bezier(.4,0,.2,1);width:32px}.StyleCodeBlock .language-css .token.string,.StyleCodeBlock .style .token.string,.StyleCodeBlock .token.entity,.StyleCodeBlock .token.operator,.StyleCodeBlock .token.url{background:none}.StyleCodeBlock .token.bold,.StyleCodeBlock .token.important{font-weight:700}.StyleCodeBlock .token.italic{font-style:italic}.StyleCodeBlock .token.entity{cursor:help}.StyleCodeBlock .line-highlight{margin-top:32px}.StyleCodeBlock .line-highlight:before{display:none}@media (min-width:800px){.StyleCodeBlock .line-highlight{margin-top:48px}}