.chart-demo{gap:20px;display:grid}.chart-demo-card{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);min-width:0;overflow:hidden}.chart-demo-card>header{border-bottom:1px solid var(--sprout-line);padding:14px 20px}.chart-demo-card h3{font-size:13px;font-weight:550}.chart-demo-card header p{color:var(--sprout-muted);margin-top:2px;font-size:12px;line-height:1.6}.chart-demo-card-body{background:var(--sprout-canvas);min-width:0;color:var(--sprout-text);gap:20px;padding:20px;display:grid}.chart-demo-eyebrow{color:var(--sprout-muted);font-size:12px;font-weight:500;line-height:16px}.chart-demo-muted{color:var(--sprout-muted)}.chart-demo-toolbar{border-bottom:1px dashed var(--sprout-line);flex-wrap:wrap;align-items:center;gap:8px 12px;padding-bottom:16px;display:flex}.chart-demo-credits{gap:16px;min-width:0;display:grid}.chart-demo-credits-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;display:flex}.chart-demo-credits-title{gap:4px;min-width:0;display:grid}.chart-demo-credits-title h4{font-size:14px;font-weight:500;line-height:20px}.chart-demo-credits-title p{color:var(--sprout-muted);font-variant-numeric:tabular-nums;font-size:14px;line-height:20px}.chart-demo-credits-title strong{color:var(--sprout-text);font-weight:500}.chart-demo-credits-controls{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.chart-demo-table-wrap{min-width:0;overflow-x:auto}.chart-demo-table{border-collapse:collapse;width:100%;font-size:14px;line-height:20px}.chart-demo-table caption{caption-side:bottom;color:var(--sprout-muted);padding-top:12px;font-size:13px}.chart-demo-table th{border-bottom:1px solid var(--sprout-line);text-align:start;white-space:nowrap;height:36px;padding:0 8px;font-weight:500}.chart-demo-table td{border-bottom:1px solid var(--sprout-line);font-variant-numeric:tabular-nums;padding:8px}.chart-demo-group{overflow-wrap:anywhere;align-items:center;gap:8px;display:flex}.chart-demo-swatch{background:var(--chart-demo-swatch);border-radius:999px;flex-shrink:0;width:8px;height:8px}.chart-demo-canvas{grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr));gap:16px;min-width:0;display:grid}.chart-demo-canvas-item{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);min-width:0}.chart-demo-stack{gap:24px;min-width:0;display:grid}.chart-demo-block{gap:8px;min-width:0;display:grid}.chart-demo-indicators{grid-template-columns:repeat(auto-fill,minmax(min(100%,12rem),1fr));gap:16px;min-width:0;display:grid}.chart-demo-indicator{align-content:start;gap:8px;min-width:0;display:grid}.chart-demo-indicator code{color:var(--sprout-muted);justify-self:start;font-size:12px}.chart-demo-indicator .sprout-chart{aspect-ratio:auto;height:7.5rem}.chart-demo-formatted{flex:1;justify-content:space-between;gap:12px;display:flex}.chart-demo-formatted span{color:var(--sprout-muted)}.chart-demo-formatted strong{font-variant-numeric:tabular-nums;font-weight:500}.chart-demo-trend{aspect-ratio:auto;width:100%;height:16rem}.chart-demo-gallery{grid-template-columns:repeat(auto-fill,minmax(min(100%,22rem),1fr));gap:16px;display:grid}.chart-demo-tile{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);min-width:0;color:var(--sprout-text);align-content:start;gap:12px;padding:16px;display:grid}.chart-demo-tile[data-wide]{grid-column:1/-1}.chart-demo-tile h4{color:var(--sprout-muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;font-weight:500}.chart-demo-stats{grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));gap:12px;display:grid}.chart-demo-stat{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-control);gap:4px;padding:12px;display:grid}.chart-demo-stat-value{font-variant-numeric:tabular-nums;font-size:20px;font-weight:600}.chart-demo-stat-value span{color:var(--sprout-muted);font-size:12px;font-weight:500}.chart-demo-gauges{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.chart-demo-timeline-notice{color:var(--sprout-muted);font-size:13px;line-height:20px}.chart-demo-timeline-notice strong{color:var(--sprout-text);font-weight:500}.chart-demo-timeline-said{font-size:13px;line-height:20px}