.playground{gap:var(--ua-space-l);grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));align-items:start;margin-block-start:var(--ua-space-s);display:grid}.editor,.output{gap:var(--ua-space-xs);min-inline-size:0;display:grid}.editor label{color:var(--ua-color-muted-foreground)}#spec{box-sizing:border-box;resize:vertical;min-block-size:24em;inline-size:100%;padding:var(--ua-space-xs);font-size:var(--ua-font-size-sm);tab-size:2;color:inherit;background:var(--ua-surface-card);border:1px solid var(--ua-color-border);border-radius:var(--ua-radius-sm);line-height:1.5}#spec[aria-invalid=true]{border-color:var(--ua-color-destructive-text)}.output .frame{outline:1px dashed var(--ua-color-border);inline-size:100%}.output .meta{inline-size:auto;min-inline-size:0;margin:0}#expanded pre,#rows{max-block-size:24em;margin:var(--ua-space-2xs) 0;font-size:var(--ua-font-size-xs);line-height:1.4;overflow:auto}#rows{margin-block-end:0}#spec,#expanded pre,#rows{font-family:var(--ua-font-family-code)}#catalog{columns:2 14em;font-size:var(--ua-font-size-sm)}#catalog h3{font-size:var(--ua-font-size-xs);margin:var(--ua-space-xs) 0 var(--ua-space-3xs);font-weight:600}#catalog p{break-inside:avoid;margin:0}#catalog code{font-size:var(--ua-font-size-xs)}summary{cursor:pointer;color:var(--ua-color-muted-foreground)}
