body{font-family:var(--cl-font-family);background:var(--cl-color-bg);color:var(--cl-color-text);margin:0}a{color:var(--cl-color-brand)}.home{max-width:40rem;padding:var(--cl-space-48) var(--cl-space-16);margin:0 auto}.home ul{padding-left:var(--cl-space-16)}.demo-header{justify-content:space-between;align-items:center;gap:var(--cl-space-16);padding:var(--cl-space-16) var(--cl-space-24);background:var(--cl-color-surface);border-bottom:var(--cl-border-width) solid var(--cl-color-border);flex-wrap:wrap;display:flex}.demo-brand,.demo-nav,.demo-actions{align-items:center;gap:var(--cl-space-16);display:flex}.demo-actions{gap:var(--cl-space-8)}.demo-brand-name{font-size:var(--cl-font-size-16);font-weight:var(--cl-font-weight-bold)}.demo-button{font:inherit;font-size:var(--cl-font-size-14);font-weight:var(--cl-font-weight-semibold);line-height:var(--cl-line-height-20);padding:var(--cl-space-4) var(--cl-space-16);border-radius:var(--cl-radius-md);border:var(--cl-border-width) solid transparent;cursor:pointer;transition:background-color var(--cl-duration-fast) var(--cl-easing-standard)}.demo-button:focus-visible{box-shadow:var(--cl-focus-ring);outline:none}.demo-button--secondary{color:var(--cl-color-brand);border-color:var(--cl-color-border-strong);background:0 0}.demo-button--flat{color:var(--cl-color-text-secondary);background:0 0}.demo-button--secondary:hover,.demo-button--flat:hover{background:var(--cl-color-surface-hover)}.demo-logo{width:var(--cl-space-32);height:var(--cl-space-32)}.demo-nav-link{color:var(--cl-color-text-secondary);font-weight:var(--cl-font-weight-semibold);text-decoration:none}.demo-nav-link[aria-current=page]{color:var(--cl-color-brand)}.demo-main{max-width:60rem;padding:var(--cl-space-32) var(--cl-space-16);margin:0 auto}.demo-title{font-size:var(--cl-font-size-24);line-height:var(--cl-line-height-32);margin:0 0 var(--cl-space-24)}.demo-card{padding:var(--cl-space-24);background:var(--cl-color-surface);border:var(--cl-border-width) solid var(--cl-color-border);border-radius:var(--cl-radius-lg);box-shadow:var(--cl-shadow-card)}.demo-card h2{margin:0 0 var(--cl-space-8);font-size:var(--cl-font-size-16)}.demo-card p{color:var(--cl-color-text-secondary);font-size:var(--cl-font-size-14);margin:0}.demo-grid{gap:var(--cl-space-16);grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));display:grid}.preview-backdrop{min-height:100vh;padding:var(--cl-space-32);background:var(--cl-color-bg)}.preview-fake-product{gap:var(--cl-space-16);max-width:60rem;margin:0 auto;display:grid}.preview-fake-bar,.preview-fake-line{border-radius:var(--cl-radius-md);background:var(--cl-color-surface-hover)}.preview-fake-bar{height:var(--cl-space-48)}.preview-fake-line{height:var(--cl-space-16)}.preview-fake-line--short{width:60%}