@layer components{.demo-asset-preview{min-height:var(--demo-asset-preview-size);padding:var(--spacing-lg);place-items:center;display:grid}.demo-asset-preview[data-surface=light]{background:var(--color-demo-asset-light)}.demo-asset-preview[data-surface=dark]{background:var(--color-demo-asset-dark)}.demo-asset-preview img{width:auto;max-width:100%;height:auto;max-height:6rem;margin:0;display:block}.demo-asset-preview .demo-media{box-shadow:none;background:0 0}.demo-asset .demo-title{font-size:.875rem;line-height:1.4}.demo-asset-footer{justify-content:space-between;align-items:center;gap:var(--spacing-sm);flex-wrap:wrap;display:flex}.demo-asset-format{border:1px solid var(--color-demo-line);border-radius:var(--radius-xs);min-height:1.5rem;color:var(--color-demo-muted);font:600 .6875rem/1.3 var(--font-family-mono);letter-spacing:.04em;align-items:center;padding:.125rem .45rem;display:inline-flex}.demo-asset-footer a{align-items:center;gap:var(--spacing-xs);border:1px solid color-mix(in oklab, var(--color-demo-blue) 30%, var(--color-demo-line));border-radius:var(--radius-sm);min-height:2.75rem;color:var(--color-demo-blue);padding:.5rem .75rem;font-size:.75rem;font-weight:600;text-decoration:none;display:inline-flex}.demo-asset-footer a:hover{border-color:var(--color-demo-blue);background:color-mix(in oklab, var(--color-demo-blue) 7%, var(--color-demo-surface))}.demo-asset-footer a:focus-visible{outline:2px solid var(--color-focus);outline-offset:3px}.demo-asset-footer a svg{flex:none}}@layer theme{:root,:host{--demo-asset-preview-size:11rem;--spacing-lg:1.5rem;--color-demo-asset-light:#fff;--color-demo-asset-dark:var(--color-gray-95);--color-gray-95:#131313;--spacing-sm:.75rem;--color-line-subtle:#0000000f;--radius-xs:.125rem;--color-text-muted:var(--color-neutral-60);--color-neutral-60:#585d6e;--color-gray-40:#8f8f8f;--font-family-mono:var(--font-mono,ui-monospace), SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--font-mono:"IBM Plex Mono";--spacing-xs:.5rem;--color-blue-60:#2248ff;--color-blue-40:#3989ff;--radius-sm:.25rem;--color-surface-raised:#fff;--color-gray-90:#1e1e1e;--color-yellow-60:#fab700;--color-amber-40:#ffba0b}@supports (color:lab(0% 0 0)){:root,:host{--color-demo-asset-light:lab(100% 0 0);--color-gray-95:lab(5.71933% 0 0);--color-line-subtle:lab(0% 0 0/.06);--color-neutral-60:lab(39.4847% 1.07358 -10.3917);--color-gray-40:lab(59.4% 0 0);--color-blue-60:lab(39.7317% 43.0116 -95.0928);--color-blue-40:lab(56.9889% 7.3145 -66.9423);--color-surface-raised:lab(100% 0 0);--color-gray-90:lab(11.26% .00000745058 -.00000298023);--color-yellow-60:lab(79.2125% 16.3088 80.9791);--color-amber-40:lab(80.3623% 17.3484 80.9779)}}.light{--color-demo-line:var(--color-line-subtle);--color-line-subtle:#0000000f;--color-demo-muted:var(--color-text-muted);--color-text-muted:var(--color-neutral-60);--color-demo-blue:var(--color-blue-60);--color-demo-surface:var(--color-surface-raised);--color-surface-raised:#fff;--color-focus:var(--color-yellow-60)}@supports (color:lab(0% 0 0)){.light{--color-line-subtle:lab(0% 0 0/.06);--color-surface-raised:lab(100% 0 0)}}.dark{--color-demo-line:var(--color-line-subtle);--color-line-subtle:#ffffff0f;--color-demo-muted:var(--color-text-muted);--color-text-muted:var(--color-gray-40);--color-demo-blue:var(--color-blue-40);--color-demo-surface:var(--color-surface-raised);--color-surface-raised:var(--color-gray-90);--color-focus:var(--color-amber-40)}@supports (color:lab(0% 0 0)){.dark{--color-line-subtle:lab(100% 0 0/.06)}}}