.demo-logo{position:absolute;left:50%;transform:translateX(-50%);font-size:var(--text-md);font-weight:var(--weight-bold);white-space:nowrap}.demo-nav-icon:before{content:none}.demo-nav-icon .untitled-icon{width:var(--space-6);height:var(--space-6)}.demo-art{display:grid;place-items:center;width:100%;height:100%;min-height:var(--space-20);background:var(--surface-subtle);color:var(--text-muted);font-size:var(--text-xs)}.demo-banner-art{position:absolute;inset:0;display:grid;place-items:center;background:var(--surface-subtle);color:var(--text-muted);font-size:var(--text-sm)}.demo-banner-copy{position:relative;z-index:1}.demo-section{margin-top:var(--section-gap)}.demo-search{margin-bottom:var(--space-4)}.demo-empty{padding:var(--space-8) 0;color:var(--text-muted);text-align:center}.demo-swatches,.demo-controls{display:flex;flex-wrap:wrap;gap:var(--space-3)}.demo-swatch{display:block;width:var(--space-16);height:var(--space-16);border:1px solid var(--border);border-radius:var(--radius-md);margin-bottom:var(--space-2)}.demo-swatch--canvas{background:var(--app-canvas)}.demo-swatch--surface{background:var(--surface)}.demo-swatch--primary{background:var(--primary)}.demo-swatch--text{background:var(--text)}.demo-dialog[hidden]{display:none}.demo-dialog{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:var(--space-4)}.demo-backdrop{position:absolute;inset:0;border:0;background:var(--overlay-scrim)}.demo-dialog__panel{position:relative;width:min(100%,var(--phone-width));padding:var(--space-6);border-radius:var(--radius-xl);background:var(--surface);box-shadow:var(--shadow-sm)}.demo-dialog__header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4)}.demo-dialog__header h2{margin:0}.demo-dialog__panel p{color:var(--text-subtle)}.demo-bag-count{font-size:var(--text-xs)}

.demo-dialog{position:fixed;inset:0;margin:auto;display:block;width:min(calc(100% - var(--space-8)),var(--phone-width));padding:0;border:0;border-radius:var(--radius-xl);background:transparent;overflow:visible}.demo-dialog:not([open]){display:none}.demo-dialog::backdrop{background:var(--overlay-scrim)}.demo-dialog__panel{width:100%}[data-search][hidden]{display:none!important}
