.code-playground:where(.astro-3gsnvqqg){--code-playground-keyword: #8250df;--code-playground-comment: #6e7781;--code-playground-string: #0a3069;--code-playground-number: #0550ae;--code-playground-type: #953800;--code-playground-property: #116329;--code-playground-function: #cf222e;--code-playground-variable: var(--sl-color-text);--code-playground-operator: #57606a;margin:1rem 0 1.5rem;border:1px solid var(--sl-color-hairline);border-radius:10px;overflow:hidden;background:var(--sl-color-bg)}.code-playground-header:where(.astro-3gsnvqqg){display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:.5rem .9rem;border-bottom:1px solid var(--sl-color-hairline);background:var(--sl-color-bg-sidebar)}.code-playground-title:where(.astro-3gsnvqqg){font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--sl-color-text-accent)}.code-playground-hint:where(.astro-3gsnvqqg){font-size:.72rem;color:var(--sl-color-gray-3, #888)}.code-playground-editor-panel:where(.astro-3gsnvqqg){background:var(--sl-color-bg)}.code-playground-editor-host:where(.astro-3gsnvqqg){min-height:calc(var(--code-playground-rows) * 1.6em + 1.8rem)}.code-playground:where(.astro-3gsnvqqg).not-content .cm-line:where(.astro-3gsnvqqg),.code-playground:where(.astro-3gsnvqqg).not-content .cm-gutterElement:where(.astro-3gsnvqqg){margin-top:0!important}.code-playground-source:where(.astro-3gsnvqqg){display:none}.code-playground-toolbar:where(.astro-3gsnvqqg){display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.5rem .9rem;border-top:1px solid var(--sl-color-hairline);border-bottom:1px solid var(--sl-color-hairline);background:var(--sl-color-bg-sidebar)}.code-playground-actions:where(.astro-3gsnvqqg){display:flex;flex-wrap:wrap;gap:.5rem}.code-playground-run:where(.astro-3gsnvqqg),.code-playground-reset:where(.astro-3gsnvqqg),.code-playground-clear:where(.astro-3gsnvqqg){border-radius:6px;border:1px solid var(--sl-color-hairline);padding:.35rem .75rem;font-size:.82rem;cursor:pointer;background:var(--sl-color-bg);color:var(--sl-color-text)}.code-playground-run:where(.astro-3gsnvqqg){border-color:var(--sl-color-accent);color:var(--sl-color-accent-high)}.code-playground-run:where(.astro-3gsnvqqg):hover,.code-playground-reset:where(.astro-3gsnvqqg):hover,.code-playground-clear:where(.astro-3gsnvqqg):hover{background:var(--sl-color-bg);box-shadow:0 0 0 2px var(--sl-color-hairline)}.code-playground-status:where(.astro-3gsnvqqg){font-size:.74rem;color:var(--sl-color-text-accent);opacity:.8}.code-playground-output-panel:where(.astro-3gsnvqqg){padding:.9rem;background:var(--sl-color-bg)}.code-playground-output-label:where(.astro-3gsnvqqg){margin-bottom:.4rem;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--sl-color-text-accent)}.code-playground-output:where(.astro-3gsnvqqg){min-height:7rem;padding:.75rem .85rem;border-radius:8px;border:1px solid var(--sl-color-hairline);background:var(--sl-color-bg-sidebar);color:var(--sl-color-text);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.88rem;line-height:1.6;white-space:pre-wrap;word-break:break-word}.code-playground-output:where(.astro-3gsnvqqg).is-empty{color:var(--sl-color-gray-3, #888)}.code-playground-line:where(.astro-3gsnvqqg)+.code-playground-line:where(.astro-3gsnvqqg){margin-top:.2rem}.code-playground-line-warn:where(.astro-3gsnvqqg){color:#9a6700}.code-playground-line-error:where(.astro-3gsnvqqg){color:#b42318}[data-theme=dark] .code-playground:where(.astro-3gsnvqqg){--code-playground-keyword: #d2a8ff;--code-playground-comment: #8b949e;--code-playground-string: #a5d6ff;--code-playground-number: #79c0ff;--code-playground-type: #ffa657;--code-playground-property: #7ee787;--code-playground-function: #ff7b72;--code-playground-operator: #adbac7}[data-theme=dark] .code-playground-line-warn:where(.astro-3gsnvqqg){color:#f6c453}[data-theme=dark] .code-playground-line-error:where(.astro-3gsnvqqg){color:#ff8b8b}@media(max-width:50rem){.code-playground-header:where(.astro-3gsnvqqg),.code-playground-toolbar:where(.astro-3gsnvqqg){flex-direction:column;align-items:flex-start}}