:root{color-scheme:light dark}html,body{margin:0;padding:0;min-height:100%;background:var(--bg-app);color:var(--text-primary);font-family:var(--xw-font-sans, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);-webkit-font-smoothing:antialiased}.demo-header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;padding:.7rem clamp(1rem,3vw,2rem);background:color-mix(in srgb,var(--bg-card) 92%,transparent);border-bottom:1px solid var(--border-light);position:sticky;top:0;z-index:10;backdrop-filter:blur(10px)}.demo-back{justify-self:start}.demo-built{display:inline-flex;align-items:center;gap:.65rem;justify-self:center}.demo-logo{width:var(--xwui-size-lg, 40px);height:var(--xwui-size-lg, 40px);object-fit:contain;display:block}.demo-style-cycler{display:inline-flex;align-items:center;gap:.5rem;justify-self:end}.demo-style-name{min-width:11rem;text-align:center}.demo-body{max-width:1200px;margin:0 auto;padding:clamp(1.5rem,4vw,3rem) clamp(1rem,3vw,2rem) clamp(3rem,6vw,5rem);display:flex;flex-direction:column;gap:clamp(2rem,4vw,3rem)}.demo-section--hero{display:flex;flex-direction:column;gap:1rem}.demo-eyebrow{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--accent-primary)}.demo-title{font-size:clamp(2.25rem,4.5vw,3.75rem);line-height:1.05;font-weight:800;margin:0;letter-spacing:-.02em}.demo-title-emoji{font-style:normal;margin-right:.5rem}.demo-title-accent{background:linear-gradient(120deg,var(--accent-primary),var(--accent-info, var(--accent-primary)) 65%,var(--accent-primary));-webkit-background-clip:text;background-clip:text;color:transparent}.demo-lede{font-size:1.05rem;line-height:1.6;color:var(--text-secondary);max-width:60ch;margin:0}.demo-cta{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:.4rem}.demo-section{display:flex;flex-direction:column;gap:.85rem}.demo-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;flex-wrap:wrap}.demo-section-title{font-size:1.05rem;font-weight:700;color:var(--text-primary);letter-spacing:-.01em;margin:0}.demo-section-meta{font-size:.85rem;color:var(--text-tertiary)}.demo-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));grid-auto-flow:dense;grid-auto-rows:min-content;align-items:start;gap:.85rem}.demo-kpi{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius-lg, 14px);padding:1rem 1.1rem 1.1rem;display:flex;flex-direction:column;gap:.55rem;box-shadow:var(--shadow-sm, 0 1px 2px rgba(0,0,0,.06));min-width:0;align-self:start}.demo-kpi-label{font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;font-weight:700;color:var(--text-tertiary)}.demo-kpi-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.demo-kpi xwui-display-statistic{font-size:1.5rem}.demo-kpi xwui-display-sparkline{display:block;width:100%}.demo-charts{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));grid-auto-flow:dense;grid-auto-rows:min-content;align-items:start;gap:.85rem}.demo-chart{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius-lg, 14px);padding:1rem 1rem .75rem;display:flex;flex-direction:column;gap:.5rem;min-width:0}.demo-chart>xwui-chart-line,.demo-chart>xwui-chart-area,.demo-chart>xwui-chart-bar{display:block;min-height:200px}.demo-inputs{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));grid-auto-flow:dense;grid-auto-rows:min-content;align-items:start;gap:.85rem}.demo-input{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius-lg, 14px);padding:1rem 1.1rem;display:flex;flex-direction:column;gap:.6rem;min-width:0;align-self:start}.demo-input-bind{display:inline-flex;align-items:center;gap:.4rem;font-size:.8rem;color:var(--text-secondary)}.demo-input-bind strong{color:var(--text-primary)}.demo-scoped{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius-lg, 14px);padding:1rem 1.1rem 1.2rem;display:flex;flex-direction:column;gap:1rem}.demo-scoped-controls{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.demo-scoped-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));grid-auto-flow:dense;grid-auto-rows:min-content;align-items:start;gap:1rem}.demo-scoped-panel{border:1px solid var(--border-light);border-radius:var(--radius-lg, 14px);padding:1rem 1.1rem 1.2rem;display:flex;flex-direction:column;gap:.65rem;background:var(--bg-elevated, var(--bg-card))}.demo-scoped-panel-head{display:inline-flex;align-items:baseline;gap:.5rem;font-weight:700;color:var(--text-primary)}.demo-scoped-panel-meta{font-size:.75rem;color:var(--text-tertiary)}.demo-nav{display:flex;flex-direction:column;gap:.75rem}.demo-nav xwui-nav-tabs{display:block}.demo-feedback{display:grid;grid-template-columns:1fr;gap:.65rem}.demo-feedback xwui-feedback-alert,.demo-feedback xwui-feedback-banner{display:block}.demo-footer{text-align:center;font-size:.78rem;color:var(--text-tertiary);padding:1rem 0 1.5rem}@media(max-width:720px){.demo-header{grid-template-columns:1fr;text-align:center}.demo-back,.demo-built,.demo-style-cycler{justify-self:center}.demo-style-name{min-width:9rem}}