:root{--label-fg-alpha:60%;color-scheme:light dark;--teal-color:#31afd0;--selection-background:light-dark(#1f8fff1a,#51b1f157);--selection-color:light-dark(#222,#fff);--nav-height:40px;--bar-height:39px;--accordion-solid:light-dark(color-mix(in srgb, var(--bg), var(--fg) 2.5%),color-mix(in srgb, var(--bg), var(--fg) 6%));--hover-color:light-dark(#00000012,#ffffff1f);--accordion-color:light-dark(rgb(from currentColor r g b / 2.5%),rgb(from currentColor r g b / 6%));--viewport-padding-inline:20px;--panel-border-radius:0px;--bg:light-dark(#fff,#181818);--fg:light-dark(#222,#ccc);--error-background:light-dark(#ff000012,#ff464633);--error-foreground:light-dark(#5c0b0b,#ffd4d4);--error-badge:#e5484d;--error-badge-x:light-dark(#fff,#000);--panel-border-color:color-mix(in srgb, var(--bg), gray 30%);--panel-border-color-hover:light-dark(#000000b3,#ffffffb3);--panel-border:1px solid var(--panel-border-color);--button-color:light-dark(rgb(from currentColor r g b / 5%),rgb(from currentColor r g b / 12%));--tooltip-color:light-dark(#eee,#e5e5e5);--ui-label-weight:400;--scrollbar-thumb-color:light-dark(#8080803b,#80808087);--scrollbar-thumb-color-hover:light-dark(#8080806e,#808080ba);--draggable-pane-divisor-color-hover:light-dark(color-mix(in srgb, var(--bg), gray 44%),color-mix(in srgb, var(--bg), gray 77%))}:root[data-theme=light]{color-scheme:light}:root[data-theme=dark]{color-scheme:dark}::selection{background-color:var(--selection-background);color:var(--selection-color)}@property --c1{syntax:"<color>";inherits:false;initial-value:#0000}@property --c2{syntax:"<color>";inherits:false;initial-value:#0000}body{color:var(--fg);max-width:inherit;background:var(--bg);flex-direction:column;height:100dvh;margin:0;padding:0;display:flex}body,#editor,#sidebar{transition:background-color .2s,color .2s,border-color .2s}#aoc_container{flex-shrink:0;order:-2;margin:20px 30px}#aoc-token-help{margin-top:1em;& a{color:color-mix(in srgb, currentcolor, transparent 25%);text-decoration:underline;text-decoration-color:color-mix(in srgb, currentcolor, transparent 50%);text-underline-offset:2px}& a svg{vertical-align:middle;margin-left:.25em}& a:hover{color:color-mix(in srgb, currentcolor, transparent 10%);text-decoration-color:currentColor}}#dom-divider{cursor:row-resize;touch-action:none;z-index:2;flex:0 0 0;height:0;display:none;position:relative;&:focus-visible{outline:none}&:after{content:"";height:7px;position:absolute;top:-3px;left:0;right:0}}#dom-divider-line{--c1:var(--scrollbar-thumb-color);--c2:var(--scrollbar-thumb-color);background-image:linear-gradient(to right, var(--c1) 0%, var(--c2) 30% 70%, var(--c1) 100%);height:1px;transition:--c1 .2s,--c2 .2s,height .2s;position:absolute;bottom:-1px;left:0;right:0}#dom-divider:hover #dom-divider-line,#dom-divider.dom-resizing #dom-divider-line,#dom-divider:focus-visible #dom-divider-line{--c2:var(--draggable-pane-divisor-color-hover);height:3px}@media screen and (width>=768px){#dom-frame:has(#app:not(:empty))+#dom-divider{display:none}#main>:is(#editor,#sidebar){border-top:none}#dom-frame:has(#app:not(:empty))+#dom-divider+#main>:is(#editor,#sidebar){border-top:var(--panel-border)}}#dom-frame{--dom-bar-size:20px;--dom-handle-color:color-mix(in srgb, var(--fg) 40%, transparent);--dom-border-color:var(--panel-border-color);--dom-border:1px solid var(--dom-border-color);background:var(--hover-color);flex-shrink:0;justify-content:center;align-items:center;display:flex;&:has(#app:empty){display:none}}html.dom-example #dom-frame{min-height:0;transition:min-height .25s ease-out;&:has(#app:empty){min-height:var(--dom-min-height,200px);display:flex}}#dom-frame #app>*{animation:.2s ease-out dom-fade-in}@keyframes dom-fade-in{0%{opacity:0}}#dom-device{box-sizing:border-box;grid-template-columns:var(--dom-bar-size) minmax(0, 1fr) var(--dom-bar-size);grid-template-rows:var(--dom-bar-size) minmax(0, 1fr) var(--dom-bar-size);width:100%;max-width:100%;height:100%;max-height:100%;display:grid}#dom-frame:has([data-drag]:hover){--dom-border-color:color-mix(in srgb, var(--panel-border-color), var(--panel-border-color-hover));& .dom-bar-top{color:var(--fg)}}.dom-bar{box-sizing:border-box;background:var(--accordion-solid);color:var(--dom-handle-color);touch-action:none;user-select:none;place-items:center;transition:color .15s,border-color .15s;display:grid;&[data-drag]:hover{color:var(--fg)}& svg{shape-rendering:crispedges;display:block}}.dom-bar-top{border-bottom:var(--dom-border);color:color-mix(in srgb, var(--fg) var(--label-fg-alpha), transparent);font-variant-numeric:tabular-nums;font-size:12px}.dom-bar-left,.dom-bar-right{cursor:ew-resize}.dom-bar-left{border-right:var(--dom-border)}.dom-bar-right{border-left:var(--dom-border)}.dom-bar-bottom{border-top:var(--dom-border);cursor:ns-resize;& svg{rotate:90deg}}.dom-corner-left{cursor:nesw-resize;& svg{rotate:-45deg}}.dom-corner-right{cursor:nwse-resize;& svg{rotate:45deg}}#dom-canvas{flex-direction:column;min-width:0;min-height:0;display:flex}#dom-frame #app{box-sizing:border-box;background:var(--bg);flex:auto;min-height:0;overflow:auto}#app .vega-embed{box-sizing:border-box;width:calc(100% - 10px);margin:10px 10px 0 0;display:block}#app :is(h1,h2,h3,h4,h5,h6){color:inherit}#app button,#app input:not([type=range],[type=checkbox],[type=radio]){color:var(--fg);background:#8080802e;border:1px solid #8080804d;&:hover{background:#80808040;border-color:#80808070}}#app input:not([type=range],[type=checkbox],[type=radio]){border-radius:0}#app :is(button,input,select,textarea):focus:not(:focus-visible){box-shadow:none;outline:none}#app :is(button,input,select):active{transform:none}#app input[type=range]::-webkit-slider-thumb:active{transform:none}#app input[type=range]::-moz-range-thumb:active{transform:none}#app input[type=range]{appearance:none;height:3px;box-shadow:none;background:#80808080;border:none;border-radius:2px;outline:none;margin-bottom:20px;padding:0;&:focus{box-shadow:none;outline:none}&:active{background:light-dark(#555,silver)}&::-webkit-slider-runnable-track{background:0 0;height:3px}&::-moz-range-track{background:0 0;height:3px}&::-webkit-slider-thumb{appearance:none;background:gray;border:none;border-radius:50%;width:14px;height:14px;margin-top:-5.5px}&::-moz-range-thumb{background:gray;border:none;border-radius:50%;width:14px;height:14px}}#app{background:var(--bg);flex-shrink:0;margin:0;padding:20px 30px;& table{margin-bottom:0}&:empty{padding:0}}#theme-toggle{align-items:center;gap:8px;display:flex}#theme-toggle-icon{color:light-dark(color-mix(in srgb, var(--fg), transparent 25%),color-mix(in srgb, var(--fg), transparent 15%));background:0 0;width:15px;height:15px;margin:0;padding:0;line-height:0;display:inline-flex;&:focus{box-shadow:none;outline:none}}#gh-stars{--gh-height:22px;--gh-radius:3px;--gh-border-color:color-mix(in srgb, currentcolor, transparent 75%);--gh-bg:light-dark(color-mix(in srgb, var(--bg), var(--fg) 5%),color-mix(in srgb, var(--bg), var(--fg) 12%));transform-origin:0;color:inherit;align-items:center;font-size:12px;font-weight:600;line-height:1;text-decoration:none;transition:opacity .25s;display:inline-flex;transform:scale(1.05);&:hover{opacity:.6}& svg{flex-shrink:0;display:block}}.gh-label,.gh-tag{box-sizing:border-box;height:var(--gh-height);border:1px solid var(--gh-border-color);border-radius:var(--gh-radius);align-items:center;display:inline-flex}.gh-label{gap:4px;padding:0 7px 0 5px}.gh-tag{margin-left:7px;padding:0 7px;position:relative;&[hidden]{display:none}&:before{content:"";box-sizing:border-box;background:var(--gh-bg);border-bottom:1px solid var(--gh-border-color);border-left:1px solid var(--gh-border-color);width:6px;height:6px;position:absolute;top:50%;left:-3.5px;transform:translateY(-50%)rotate(45deg)}}#controls{height:var(--nav-height);border:1px solid silver;justify-content:flex-start;align-items:center;gap:16px;padding-inline:50% 0;display:flex}#main{--pane-min-width:300px;flex-direction:column;max-height:90dvh;padding-inline:0;display:flex;position:relative;@media screen and (width>=768px){grid-template-columns:clamp(var(--pane-min-width), var(--pane-split,50%), calc(100% - var(--pane-min-width))) minmax(0, 1fr);flex:1;min-height:0;max-height:none;display:grid;overflow:auto}&.pane-resizing,&.pane-resizing *{cursor:col-resize;user-select:none}&.dom-resizing,&.dom-resizing *{cursor:row-resize;user-select:none}}#editor{box-sizing:border-box;border:var(--panel-border);border-radius:var(--panel-border-radius);background:var(--bg);width:100%;min-width:0;max-height:90dvh;border-inline:none;flex-direction:column;padding-inline-start:var(--viewport-padding-inline);display:flex;overflow:auto;@media screen and (width>=768px){border-bottom:none;width:auto;max-width:none;min-height:0;max-height:none;&>.cm-editor{flex:1;min-height:0}}}#sidebar button,#aoc_output_container button,#aoc_form_container>button,#aoc_form_container>#aoc_token{font-weight:var(--ui-label-weight);color:var(--fg);background:var(--button-color);border:1px solid light-dark(rgb(from currentColor r g b / 20%),rgb(from currentColor r g b / 40%));border-radius:.3em;height:fit-content;margin:0;padding:.25em .85em .35em;&:hover,&:active{border-color:rgb(from currentColor r g b / 40%);transform:none}&:focus{box-shadow:none}}#aoc_form_container>#aoc_token{background:0 0}#aoc_help_container{display:none}#aoc_output_container{border:1px solid var(--panel-border-color);border-radius:7px;flex-shrink:0;order:-1;gap:0;max-height:30dvh;margin:0 30px 20px;overflow:auto}body:has(#aoc_container):after{content:"";border-bottom:var(--panel-border);flex-shrink:0;order:-1}#sidebar-controls{margin:-10px calc(-1 * var(--sidebar-padding-end)) 0 calc(-1 * var(--sidebar-inset-start));box-sizing:border-box;height:var(--bar-height);padding:0 var(--viewport-padding-inline) 0 calc(var(--sidebar-padding-end) + 5px);background:var(--button-color);border-bottom:1px solid var(--panel-border-color)}#editor-controls{margin:0 0 32px calc(-1 * var(--viewport-padding-inline));box-sizing:border-box;height:var(--bar-height);padding:0 var(--viewport-padding-inline);background:var(--button-color);border-bottom:1px solid var(--panel-border-color);flex:none;justify-content:flex-start;align-items:center;display:flex;& .control-group{flex-wrap:wrap;align-items:center;gap:12px;min-width:0;max-width:100%;min-height:1.9em;display:flex}}#sidebar{box-sizing:border-box;--draggable-divider-width:10px;--sidebar-padding-end:10px;--sidebar-inset-start:calc(var(--viewport-padding-inline) + (var(--draggable-divider-width) / 2));border:var(--panel-border);border-inline:none;border-radius:var(--panel-border-radius);width:100%;min-width:0;padding:10px var(--sidebar-padding-end) 0px calc(var(--viewport-padding-inline) + (var(--draggable-divider-width) / 2));border-bottom:none;flex-direction:column;gap:0;margin-top:10px;display:flex;position:relative;overflow:hidden;@media screen and (width>=768px){width:auto;max-height:none;margin-top:0;margin-left:0}& #draggable-divider{width:var(--draggable-divider-width);cursor:col-resize;touch-action:none;z-index:1;height:100%;display:none;position:absolute;top:0;left:0;@media screen and (width>=768px){display:block}&:focus-visible{outline:none}&>#draggable-divider-line{--c1:var(--panel-border-color);--c2:var(--panel-border-color);background-image:linear-gradient(var(--c1) 0%,var(--c2) 30% 70%,var(--c1) 100%);width:1px;height:100%;transition:--c1 .2s,--c2 .2s,width .2s;position:absolute;top:0;left:0}&:hover:not(.pane-resizing),&.pane-resizing.pointer-over,&:focus-visible:not(.pointer-focused){&>#draggable-divider-line{--c2:var(--draggable-pane-divisor-color-hover);width:3px}}}& #sidebar-controls{flex-wrap:wrap;justify-content:space-between;align-items:center;width:auto;display:flex;& #meta-controls{margin-left:auto}& label{margin:0}& .control-group{flex-wrap:wrap;align-items:center;gap:12px;min-width:0;max-width:100%;min-height:1.9em;display:flex}}& #sidebar-sections{--sidebar-control-size:13px;--sidebar-control-gap:5px;outline-offset:6px;margin:0 calc(-1 * var(--sidebar-padding-end)) 0 calc(-1 * var(--sidebar-inset-start));flex-direction:column;display:flex;overflow:hidden;& .sidebar-section{outline-offset:2px;flex-direction:column;display:flex;overflow:hidden;&[hidden]{display:none}&:not([hidden])+.sidebar-section{border-top:1px solid var(--panel-border-color)}&#repl-mode-section,&#dom-section{flex-shrink:0}}& .section-header{appearance:none;align-items:center;gap:var(--sidebar-control-gap);box-sizing:border-box;width:100%;padding:3.5px var(--sidebar-padding-end) 3.5px calc(var(--sidebar-padding-end) + 5px);color:color-mix(in srgb, var(--fg) var(--label-fg-alpha), transparent);background:var(--accordion-color);box-shadow:none;font-family:inherit;font-size:inherit;font-weight:var(--ui-label-weight);line-height:inherit;text-align:start;cursor:pointer;border:0;border-radius:0;margin:0;display:flex;&:focus-visible,&:has(:focus-visible){outline-offset:-2px;outline:2px solid}& input{width:var(--sidebar-control-size);height:var(--sidebar-control-size);accent-color:var(--fg);margin:0 0 0 3px;&:active{transform:none}&:focus,&:focus-visible{--focus:transparent;outline:none}}}& .section-icon{flex:0 0 var(--sidebar-control-size);width:var(--sidebar-control-size);height:var(--sidebar-control-size);place-items:center;display:grid;scale:1.65;& svg{width:100%;height:100%;transition:transform .1s;transform:rotate(0)}}& #compiled-code-toggle,& #dom-toggle[aria-expanded=true],& .section-header:has(input:checked){border-bottom:1px solid var(--panel-border-color)}& .section-header[aria-expanded=true] .section-icon svg,& .section-header:has(input:checked) .section-icon svg{transform:rotate(90deg)}}& #repl-mode-section:not(:has(#replCheckBox:checked)) :is(#result,#repl-instructions),& #repl-mode-section:has(#replCheckBox:checked) #tip-repl-mode,& #dom-toggle[aria-expanded=false]+#dom-section-body{display:none}& #dom-section-body:has(>#dom-frame[style*=height]){max-height:none}& #dom-section-body{max-height:40dvh;overflow:auto;& #app{padding:12px var(--sidebar-padding-end) 12px var(--sidebar-inset-start);&:empty{padding:0}}}& #repl-instructions{margin:12px var(--sidebar-padding-end) 0 var(--sidebar-inset-start);color:color-mix(in srgb, var(--fg) var(--label-fg-alpha), transparent);flex-direction:column;display:flex}& #result{margin:12px var(--sidebar-padding-end) 17px var(--sidebar-inset-start);color:var(--fg);background:var(--bg);border:var(--panel-border);border-radius:2px;min-height:20px;max-height:40dvh;padding:0;overflow:auto;#sidebar:has(#replCheckBox:checked) &{padding:10px}& li{font-size:16px!important}}& #compiled-code{margin:12px var(--sidebar-padding-end) 0 var(--sidebar-inset-start);flex-direction:column;padding-inline-start:3px;display:flex;overflow:hidden}& #compiled-code-toggle[aria-expanded=false]+#compiled-code-body #compiled-code{display:none}& #compiled-code-body{flex-direction:column;min-height:0;display:flex}& #error-slot{align-items:flex-start;gap:var(--sidebar-control-gap);padding:8px var(--sidebar-padding-end) 8px calc(var(--sidebar-padding-end) + 5px);border-top:1px solid var(--panel-border-color);background:var(--error-background);color:var(--error-foreground);flex:none;max-height:40dvh;display:flex;overflow:auto;&[hidden]{display:none}}& #compiled-code-toggle[aria-expanded=false]+#compiled-code-body #error-slot{border-top:none}& .error-badge-box{flex:0 0 var(--sidebar-control-size);place-items:center;height:1lh;display:grid;translate:-2px}& .error-badge{& circle{fill:var(--error-badge)}& path{stroke:var(--error-badge-x)}}& #error-message{white-space:pre-wrap;overflow-wrap:anywhere;min-width:0}& .ͼ1.cm-focused{outline-width:0}& .ͼ2 .cm-line{opacity:.83;font-size:13px}& .ͼ2 .cm-gutters{background-color:#0000;&.cm-gutters-before{border-right-width:0}}}@media screen and (width<768px){body{height:auto;min-height:100dvh}#footer{z-index:2;margin-top:auto;position:sticky;bottom:0}}#footer{background:var(--button-color);border-top:1px solid var(--panel-border-color);box-sizing:border-box;height:40px;padding-inline:var(--viewport-padding-inline);flex-direction:row;flex:0 0 40px;justify-content:space-between;align-items:center;gap:12px;display:flex}#footer-left,#footer-right{align-items:center;gap:10px;display:flex}#editor-controls label{font-weight:var(--ui-label-weight);color:color-mix(in srgb, var(--fg) var(--label-fg-alpha), transparent);margin:0 -6px 0 0}#example-select{width:auto;color:var(--fg);border:1px solid var(--panel-border-color);box-sizing:border-box;padding-block:0;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M0 0h10L5 6z' fill='%23161f27'/%3E%3C/svg%3E");background-position:calc(100% - 8.8px);background-size:8.4px;background-color:var(--accordion-solid);border-radius:0;height:30px;margin:0;padding-left:13px;padding-right:30px}:root[data-theme=dark] #example-select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M0 0h10L5 6z' fill='white'/%3E%3C/svg%3E")}#footer-right{gap:24px}#footer-logo{width:33px;height:33px;margin-right:10px}#footer-title{margin-right:24px;font-size:16px;font-weight:600;display:none}#footer button,#sidebar-controls button,#editor-controls button{box-shadow:none;color:var(--fg);font-weight:var(--ui-label-weight);cursor:pointer;background:0 0;border:none;border-radius:999px;margin:0 -9px 0 -6px;padding:4px 9px 4px 6px;&:active,&:focus{box-shadow:none;background:0 0;transform:none}&:hover{background:var(--hover-color);box-shadow:none;transform:none}}#footer .icon-button,#sidebar-controls .icon-button,#editor-controls .icon-button{margin:0;padding:4px}.layout-icon{--layout-icon-w:1.5px;--layout-icon-line:var(--layout-icon-w) solid currentColor;color:color-mix(in srgb, var(--fg) 40%, transparent);box-sizing:border-box;aspect-ratio:1.25;border:var(--layout-icon-line);border-radius:2px;grid-template-rows:50% 50%;grid-template-columns:50% 50%;height:18px;display:grid;overflow:hidden;& i{min-width:0;min-height:0}& .cell-dom{background:color-mix(in srgb, currentColor 17%, transparent);border-bottom:var(--layout-icon-line);background-clip:padding-box;grid-area:dom}& .cell-code{border-right:var(--layout-icon-line);grid-area:code}& .cell-a{grid-area:a}}.layout-icon.fullscreen-icon{padding:var(--layout-icon-w);display:block;& i{background-color:color-mix(in srgb, currentColor 17%, transparent);border-radius:1px;width:100%;height:100%;display:block}}#fullscreen-button[aria-pressed=true] .fullscreen-icon i{background-color:currentColor}body.dom-fullscreen #sidebar #dom-section #dom-section-body{display:block}body.dom-fullscreen #dom-frame{z-index:50;background:linear-gradient(var(--hover-color), var(--hover-color)), var(--bg);position:fixed;top:0;left:0;right:0}.layout-icon-top{grid-template-areas:"dom dom""code a"}.layout-icon-side{grid-template-areas:"code dom""code a"}#view-controls button[aria-pressed=true] .layout-icon .cell-dom{background-color:currentColor}#view-controls button.icon-button:hover{background:0 0}#view-controls button:hover .layout-icon{color:color-mix(in srgb, var(--fg) 55%, transparent)}#view-controls{align-items:center;gap:6px;margin-left:10px;display:flex}#sidebar-controls button{align-items:center;gap:5px;display:inline-flex}#sidebar #sidebar-controls .control-group{gap:24px}#footer #theme-toggle{color:color-mix(in srgb, var(--fg) var(--label-fg-alpha), transparent);gap:5px}#footer #theme-toggle-icon{color:inherit}#editor-controls #example-trigger{display:none}@media screen and (width>=768px){#example-select{display:none}#editor-controls #example-trigger{anchor-name:--example-trigger;border:1px solid var(--panel-border-color);height:30px;font:inherit;color:var(--fg);text-align:left;background-color:var(--accordion-solid);background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M0 0h10L5 6z' fill='%23161f27'/%3E%3C/svg%3E");background-position:calc(100% - 8.8px);background-repeat:no-repeat;background-size:8.4px;border-radius:0;margin:0;padding:0 30px 0 13px;font-weight:400;display:block}:root[data-theme=dark] #editor-controls #example-trigger{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M0 0h10L5 6z' fill='white'/%3E%3C/svg%3E")}}#example-menu{position-anchor:--example-trigger;position-area:bottom span-right;position-try-fallbacks:flip-inline;box-sizing:border-box;border:1px solid var(--panel-border-color);background:var(--bg);max-width:calc(100dvw - 20px);color:var(--fg);border-radius:5px;margin:4px 0 0;padding:36px 90px 26.4px 33px;font-size:1rem;inset:auto;box-shadow:0 2px 20px light-dark(#00000029,#00000080);&:popover-open{grid-template-columns:auto auto;align-items:start;gap:60px 90px;display:grid}& #example-menu-aoc{grid-area:2/1}& h3{color:var(--fg);align-items:center;gap:6px;margin:0 0 8px;font-size:1rem;font-weight:600;display:flex}& ul{margin:0;padding:0;list-style:none}& #example-menu-dom ul{columns:2;column-gap:24px}& li{break-inside:avoid;padding-block:2px}}#editor-controls #example-menu button{width:auto;font:inherit;text-align:left;white-space:nowrap;color:color-mix(in srgb, var(--fg) var(--label-fg-alpha), transparent);background:0 0;border-radius:999px;outline:none;margin:0 -12px;padding:3px 12px;font-weight:400;display:block;&:hover,&:focus-visible,&[aria-current=true]{color:var(--fg);background:var(--hover-color)}&:focus-visible{text-underline-offset:2px;text-decoration:underline}}#example-select option,#example-select optgroup{color:var(--fg);background:var(--bg)}#settings-button[hidden]{display:none}#settings-button{align-items:center;gap:5px;display:inline-flex}#settings-button svg{width:16.335px;height:16.335px}@media screen and (width>=768px){#sidebar{min-height:0}#sidebar-controls,#compiled-code-toggle{flex-shrink:0}#sidebar-sections,#compiled-code-section,#compiled-code-body,#compiled-code,#compiled-code>.cm-editor{flex:1;min-height:0}#compiled-code-body{container-type:size}#error-slot{max-height:50cqh}}.cm-editor{overflow:hidden}.cm-scroller,#dom-frame #app{scrollbar-color:auto;scrollbar-width:auto;&::-webkit-scrollbar{width:18px;height:18px}&::-webkit-scrollbar-track{background:0 0}&::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb-color);background-clip:padding-box;border:4px solid #0000;border-radius:12px;min-width:56px;min-height:56px}&::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-color-hover);background-clip:padding-box}&::-webkit-scrollbar-corner{background:0 0}}@supports not selector(::-webkit-scrollbar){.cm-scroller,#dom-frame #app{scrollbar-color:var(--scrollbar-thumb-color) transparent}}[role=tooltip][popover]{position-area:bottom;position-try-fallbacks:flip-block;background:color-mix(in srgb, var(--bg), gray 10%);color:var(--fg);white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .12s, translate .12s, display .12s allow-discrete, overlay .12s allow-discrete;border:0;border-radius:5px;margin:16px 0 0;padding:6px 12px;font:1em/1.5 system-ui,sans-serif;inset:auto;translate:0 -4px;box-shadow:0 0 0 .5px light-dark(#0000001f,#ffffff59),0 2px 20px light-dark(#00000029,#ffffff59)}[role=tooltip]:popover-open{opacity:1;translate:0}@starting-style{[role=tooltip]:popover-open{opacity:0;translate:0 -4px}}