.wrapper.svelte-1p4zz3u{position:relative;box-shadow:.1rem .1rem .2rem #00000028;border:1px solid var(--docs-border-color);border-radius:8px;background-color:var(--base00);padding:.5em;width:100%;min-height:252px;overflow:hidden}.wrapper.svelte-1p4zz3u:focus-within{border-color:var(--red);&.valid{border-color:var(--green)}}.ace.svelte-1p4zz3u{opacity:0;transition:opacity 50ms ease-in;width:100%;height:auto;min-height:208px;&.ready{opacity:1}}span.svelte-1p4zz3u{position:absolute;top:0;right:0;font-size:10px;font-family:monospace}.editor.svelte-980tol{position:relative}.reset-button.svelte-980tol{position:absolute;right:.5em;bottom:.5em;z-index:10;font-family:monospace}fieldset.svelte-qoe56r{display:flex;gap:1em;width:fit-content;font-family:var(--sl-font-sans);label:where(.svelte-qoe56r){display:inline-flex;flex-direction:row;gap:1em}}.demo-div.svelte-qoe56r{display:flex;flex-flow:column;justify-content:flex-start;align-items:flex-start;transition:all .2s ease-in-out;margin-inline:auto;background-color:#5f9ea0;padding:.5rem;height:150px;overflow:auto;font-family:monospace;text-wrap:nowrap;input:where(.svelte-qoe56r){max-width:50%}input:where(.svelte-qoe56r),select:where(.svelte-qoe56r){height:30px}&.red{background-color:pink;color:#000}&.blue{background-color:#add8e6;color:#000}&.radius{border-radius:16px;color:#000}}.horiz.svelte-qoe56r{li:where(.svelte-qoe56r){display:inline;margin-left:2ch;list-style-type:none}}input.svelte-n96c3o{margin-right:50px;border-radius:4px;width:1.5em;height:1.5em}label.svelte-n96c3o{transition:outline .2s linear;outline:0px solid transparent}input.svelte-n96c3o:focus{outline:1px solid var(--sl-color-accent);outline-offset:1px}label:has(input.opt-tgl-chk.focused){transition:outline .2s linear;outline:2px solid var(--sl-color-accent)}.global-options.svelte-102v9ps{--title-height: 3rem;display:flex;position:fixed;right:2rem;bottom:0;flex-direction:column;transform:translateY(calc(100% - var(--title-height)));opacity:.5;z-index:9999;transition-duration:.3s;transition-property:transform,opacity,border,border-color,box-shadow;transition-timing-function:ease;margin-inline:auto;box-shadow:.1rem .1rem .2rem #00000028;border:1px solid var(--sl-color-gray-4);border-bottom:none;border-top-right-radius:8px;border-top-left-radius:8px;background-color:var(--sl-color-gray-6);width:20rem;overflow:hidden;color:var(--sl-color-white);font-size:14px;.options-title:where(.svelte-102v9ps){font-size:16px}&:focus-within{box-shadow:.1rem .1rem .2rem var(--sl-color-accent),-.1rem -.1rem .2rem var(--sl-color-accent)}&.keep-open,&:hover,&:focus-within{transform:translateY(0);opacity:1;a:where(.svelte-102v9ps){opacity:1}}}@media screen and (min-width:800px){.global-options.svelte-102v9ps{width:18rem;font-size:12px;.options-title:where(.svelte-102v9ps){font-size:16px}}}.go-body label{display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:.5em 1em;width:100%;overflow:visible;font-size:inherit!important;text-wrap:nowrap}input[type=number].svelte-102v9ps,select.svelte-102v9ps{width:105px;height:1.5em;font-size:inherit!important;text-align:center}.options-title.svelte-102v9ps{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--sl-color-gray-4);padding-inline:.5rem;padding-block:.25rem;width:100%;height:var(--title-height);font-weight:700;font-size:28px;a:where(.svelte-102v9ps){opacity:0;transition:opacity,.5s}}.tool-buttons.svelte-102v9ps{display:flex;gap:.25rem}.go-body.svelte-102v9ps{display:flex;flex-flow:column nowrap;background:linear-gradient(to top,rgb(0 0 0 / .4),transparent 30%);background-attachment:local;height:320px;overflow-y:scroll;font-family:monospace}.go-body>:not(:last-child){border-bottom:1px solid var(--sl-color-gray-5)}.tool-button.svelte-102v9ps{all:unset;display:flex;justify-content:center;align-items:center;transition-duration:.3s;transition-property:color,background-color;transition-timing-function:ease-out;cursor:pointer;outline:1px solid var(--sl-color-gray-4);border-radius:9999px;width:24px;height:24px;&:hover{background-color:var(--sl-color-accent-high);color:var(--sl-color-gray-6)}&:focus{outline:1px solid var(--sl-color-accent-high)}}.pin-button.svelte-102v9ps{svg:where(.svelte-102v9ps){transform:rotate(60deg) translateY(-2px) scale(.8);transition:transform .3s ease-out}&.keep-open{svg:where(.svelte-102v9ps){transform:translate(0) rotate(0) scale(1)}}}