hylo-playground{margin-block:1rem;display:block}hylo-playground [data-part=source] .expressive-code{margin:0}hylo-playground:not([data-ready]) .pg-toolbar{display:none}.pg-editor{border:1px solid var(--sl-color-gray-5);border-radius:.5rem;min-height:3rem;overflow:hidden}.pg-toolbar{font-size:var(--sl-text-sm,.875rem);flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:.5rem;display:flex}.pg-button,.pg-select{border:1px solid var(--sl-color-gray-5);background:var(--sl-color-gray-6);height:2rem;color:var(--sl-color-white);font:inherit;font-size:var(--sl-text-sm,.875rem);white-space:nowrap;cursor:pointer;border-radius:.5rem;align-items:center;gap:.4rem;padding:0 .8rem;font-weight:500;line-height:1;transition:background-color .15s,border-color .15s,color .15s;display:inline-flex}.pg-button[hidden]{display:none}.pg-button:hover,.pg-select:hover{background:var(--sl-color-gray-5);border-color:var(--sl-color-gray-4)}.pg-button:active{transform:translateY(1px)}.pg-select{appearance:none;background-image:linear-gradient(45deg,#0000 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,#0000 50%);background-position:right .95rem center,right .65rem center;background-repeat:no-repeat;background-size:.3rem .3rem;padding-right:1.9rem}.pg-button:focus-visible,.pg-select:focus-visible,.pg-link:focus-visible,.pg-tabs [role=tab]:focus-visible,.pg-diagnostics button:focus-visible{outline:2px solid var(--sl-color-accent);outline-offset:2px}.pg-primary{background:var(--sl-color-green-low);border-color:var(--sl-color-green);color:var(--sl-color-green-high);font-weight:600}.pg-primary:hover{background:var(--sl-color-green-low);border-color:var(--sl-color-green-high);color:var(--sl-color-green-accent-invert)}.pg-icon-button{justify-content:center;width:2rem;padding:0;position:relative}.pg-icon-button[data-modified]:after{content:"";background:var(--sl-color-green);border-radius:50%;width:.4rem;height:.4rem;position:absolute;top:.2rem;right:.2rem}.pg-icon{flex:none;width:1rem;height:1rem}.pg-busy-icon,.pg-done-icon,.pg-button[aria-busy] .pg-idle-icon,.pg-button[data-done] .pg-idle-icon{display:none}.pg-button[aria-busy] .pg-busy-icon,.pg-button[data-done] .pg-done-icon{display:block}.pg-button[aria-busy]{cursor:progress}.pg-busy-icon{animation:.8s linear infinite pg-spin}@keyframes pg-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.pg-busy-icon{animation:none}}.pg-button[data-done]{border-color:var(--sl-color-green);color:var(--sl-color-green-high)}.pg-kbd{font-family:var(--__sl-font-mono,monospace);background:color-mix(in srgb, currentColor 15%, transparent);border-radius:.25rem;padding:.1rem .3rem;font-size:.7rem;font-weight:500}.pg-checkbox{font-size:var(--sl-text-sm,.875rem);color:var(--sl-color-gray-2);cursor:pointer;user-select:none;align-items:center;gap:.4rem;display:inline-flex}.pg-checkbox input{appearance:none;border:1.5px solid var(--sl-color-gray-3);cursor:pointer;background:0 0;border-radius:.25rem;place-content:center;width:1rem;height:1rem;margin:0;display:grid}.pg-checkbox input:checked{border-color:var(--sl-color-green)}.pg-checkbox input:checked:after{content:"";border:solid var(--sl-color-green-high);border-width:0 2px 2px 0;width:.3rem;height:.55rem;margin-top:-.1rem;transform:rotate(45deg)}.pg-checkbox input:focus-visible{outline:2px solid var(--sl-color-green);outline-offset:2px}.pg-link{color:var(--sl-color-gray-2);align-items:center;gap:.3rem;margin-left:auto;text-decoration:none;display:inline-flex}.pg-link:hover{color:var(--sl-color-white);text-decoration:underline}.pg-output{border:1px solid var(--sl-color-gray-5);border-radius:.5rem;margin-top:.5rem;overflow:hidden}.pg-tabs{border-bottom:1px solid var(--sl-color-gray-5);background:var(--sl-color-gray-6);flex-wrap:wrap;gap:.25rem;padding:.25rem .5rem 0;display:flex}.pg-tabs [role=tab]{font:inherit;font-size:var(--sl-text-xs,.8rem);color:var(--sl-color-gray-3);cursor:pointer;background:0 0;border:0;border-bottom:2px solid #0000;padding:.35rem .6rem}.pg-tabs [role=tab][aria-selected=true]{color:var(--sl-color-white);border-bottom-color:var(--sl-color-accent)}.pg-view{max-height:28rem;padding:.75rem 1rem;overflow:auto}.pg-view progress{width:min(20rem,100%);accent-color:var(--sl-color-accent)}.pg-headline{margin:0 0 .25rem;font-weight:600}.pg-ok{color:var(--sl-color-green-high)}.pg-bad{color:var(--sl-color-red-high)}.pg-warn{color:var(--sl-color-orange-high)}.pg-note{color:var(--sl-color-gray-3);margin:0}.pg-label{font-size:var(--sl-text-xs,.8rem);text-transform:uppercase;letter-spacing:.04em;color:var(--sl-color-gray-3);margin:.75rem 0 .25rem}.pg-pre,.pg-code pre{font-family:var(--__sl-font-mono,ui-monospace, monospace);font-size:var(--sl-text-code,.875rem);white-space:pre;tab-size:4;margin:0;line-height:1.6;overflow:visible;background:0 0!important}.pg-code span{color:var(--shiki-dark)}:root[data-theme=light] .pg-code span{color:var(--shiki-light)}.pg-diagnostics{flex-direction:column;gap:.5rem;margin:.5rem 0 0;padding:0;list-style:none;display:flex}.pg-diagnostics li{margin:0}.pg-diagnostics button{width:100%;font:inherit;text-align:left;border:0;border-left:3px solid var(--sl-color-gray-4);color:inherit;cursor:pointer;background:0 0;padding:0 0 0 .75rem;display:block;overflow-x:auto}.pg-diagnostics button:disabled{cursor:default}.pg-diagnostics li[data-level=error] button{border-left-color:var(--sl-color-red-high)}.pg-diagnostics li[data-level=warning] button{border-left-color:var(--sl-color-orange-high)}