.bar-chart{
  background:transparent;
  padding:0 var(--md-spacing-24);
  display:flex;
  flex-direction:column;
  gap:var(--md-spacing-16);
  text-align:left;
  min-height:0;
}
.chart-title{ font-family:var(--font-display); font-weight:var(--font-weight-light); font-size:var(--md-typography-font-size-500); line-height:28px; color:var(--md-neutral-foreground-1-rest); width:100%; outline:none; margin-bottom:16px; }
.bar-chart-body{ flex:1; min-height:0; display:flex; flex-direction:column; gap:4px; }
.bar-chart-plot-row{ flex:1; min-height:0; display:flex; align-items:stretch; gap:var(--md-spacing-16); }
.bar-chart-plot{
  position:relative;
  flex:1; min-width:0;
  display:flex; align-items:flex-end; justify-content:space-around;
  gap:8px;
  padding:var(--plot-pad-top, 0px) 12px 0;
  box-sizing:border-box;
}
.bar-chart-grid{ position:absolute; inset:var(--plot-pad-top, 0px) 0 0 0; pointer-events:none; }
.bar-chart-grid-line{ position:absolute; left:0; right:0; height:1px; background:var(--md-neutral-stroke-1-rest); transform:translateY(-50%); }
.bar-chart-average-line{ position:absolute; left:0; right:0; height:0; border-top:2px dashed var(--ui-accent); z-index:2; pointer-events:none; }
.bar-chart-bar-col{ position:relative; z-index:1; flex:1; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; }
.bar-fill{ width:100%; max-width:var(--bar-max-width, 96px); border-radius:var(--md-radius-40) var(--md-radius-40) 0 0; min-height:2px; }
.stacked-bar-col{ min-height:2px; }
.bar-data-label{ font-family:var(--font-sans); font-weight:var(--font-weight-semibold); font-size:var(--md-typography-font-size-300); color:var(--md-neutral-foreground-2-rest); margin-bottom:4px; }
.bar-chart-y-labels{ position:relative; flex-shrink:0; width:44px; margin-top:var(--plot-pad-top, 0px); }
.bar-y-label{ position:absolute; left:0; right:0; transform:translateY(-50%); font-family:var(--font-sans); font-weight:var(--font-weight-light); font-size:var(--md-typography-font-size-400); line-height:24px; color:var(--md-neutral-foreground-3-rest); text-align:right; }
.bar-chart-x-row{ display:flex; align-items:flex-start; gap:var(--md-spacing-16); }
.bar-chart-x-labels{ flex:1; min-width:0; display:flex; justify-content:space-around; gap:8px; padding:4px 12px 0; box-sizing:border-box; }
.bar-x-label{ flex:1; width:100%; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:var(--font-sans); font-weight:var(--font-weight-light); font-size:var(--md-typography-font-size-400); line-height:24px; color:var(--md-neutral-foreground-3-rest); text-align:center; }
.bar-chart-x-axis-spacer{ flex-shrink:0; width:44px; }
.bar-chart-h-plot{ position:relative; flex:1; min-height:0; display:flex; }
.bar-chart-h-grid{ position:absolute; top:0; bottom:0; pointer-events:none; }
.bar-chart-h-grid-line{ position:absolute; top:0; bottom:0; width:1px; background:var(--md-neutral-stroke-1-rest); transform:translateX(-50%); }
.bar-chart-average-line-v{ position:absolute; top:0; bottom:0; width:0; border-left:2px dashed var(--ui-accent); z-index:2; pointer-events:none; }
.bar-chart-h-rows{ flex:1; min-width:0; display:flex; flex-direction:column; gap:10px; position:relative; z-index:1; }
.bar-chart-h-row{ display:flex; align-items:center; gap:10px; flex:1; min-height:0; }
.bar-chart-h-row-reverse{ flex-direction:row-reverse; }
.bar-h-label{ flex-shrink:0; width:88px; font-family:var(--font-sans); font-size:var(--md-typography-font-size-400); color:var(--md-neutral-foreground-3-rest); text-align:right; }
.bar-chart-h-row-reverse .bar-h-label{ text-align:left; }
.bar-chart-h-track{ flex:1; min-width:0; height:100%; max-height:84px; min-height:14px; border-radius:var(--md-radius-40); overflow:hidden; }
.bar-h-fill{ height:100%; min-width:2px; border-radius:0 var(--md-radius-40) var(--md-radius-40) 0; }
.bar-h-value{ flex-shrink:0; width:44px; font-family:var(--font-sans); font-weight:var(--font-weight-semibold); font-size:var(--md-typography-font-size-300); color:var(--md-neutral-foreground-2-rest); }
.bar-chart-h-scale{ display:flex; justify-content:space-between; font-family:var(--font-sans); font-size:var(--md-typography-font-size-400); color:var(--md-neutral-foreground-3-rest); margin-top:4px; }
.grouped-bar-group{ position:relative; z-index:1; flex:1; min-width:0; height:100%; display:flex; align-items:flex-end; gap:8px; padding:0 12px; box-sizing:border-box; }
.grouped-bar-group .bar-chart-bar-col{ flex:1; }
.grouped-bar-h-tracks{ flex:1; min-width:0; min-height:0; align-self:stretch; display:flex; flex-direction:column; gap:4px; }
.grouped-bar-h-item{ flex:1; min-height:0; display:flex; align-items:center; gap:6px; }
.grouped-bar-h-track{ flex:1; min-width:0; height:100%; min-height:8px; background:var(--md-neutral-background-2-rest); border-radius:var(--md-radius-40); overflow:hidden; }
.stacked-bar-col{ position:relative; z-index:1; width:100%; max-width:96px; display:flex; flex-direction:column; gap:2px; background:var(--md-neutral-background-1-rest); border-radius:var(--md-radius-40) var(--md-radius-40) 0 0; overflow:hidden; }
.stacked-bar-seg{ width:100%; }
.stacked-bar-h-track{ flex:none; height:100%; min-width:2px; display:flex; gap:2px; background:var(--md-neutral-background-1-rest); border-radius:0 var(--md-radius-40) var(--md-radius-40) 0; overflow:hidden; }
.stacked-bar-h-seg{ height:100%; }
.line-chart-svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.line-chart-points{ position:absolute; inset:0; pointer-events:none; }
.line-chart-point{ position:absolute; width:8px; height:8px; border-radius:50%; transform:translate(-50%,-50%); box-shadow:0 0 0 2px var(--md-color-grey-white); }
.line-chart-value{ position:absolute; transform:translate(-50%,-130%); font-family:var(--font-sans); font-weight:var(--font-weight-semibold); font-size:var(--md-typography-font-size-200); color:var(--md-neutral-foreground-2-rest); white-space:nowrap; }
.line-chart-hits{ position:absolute; inset:0; }
.line-chart-hit{ position:absolute; width:20px; height:20px; border-radius:50%; transform:translate(-50%,-50%); cursor:default; }
.line-chart-hit::after{
  content:""; position:absolute; inset:0; margin:auto; width:8px; height:8px; border-radius:50%;
  background:var(--dot-color, currentColor); border:2px solid var(--md-color-grey-white); box-shadow:var(--shadow-xs);
  opacity:0; transform:scale(.4); transition:opacity .12s ease, transform .12s ease;
}
.line-chart-hit:hover::after{ opacity:1; transform:scale(1); }
.chart-legend{ display:flex; align-items:center; flex-shrink:0; }
.legend-row{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.legend-item{ display:flex; align-items:center; gap:4px; flex-shrink:0; }
.legend-swatch{ flex-shrink:0; width:18px; height:18px; border-radius:4px; }
.legend-label{ font-family:var(--font-sans); font-weight:var(--font-weight-light); font-size:var(--md-typography-font-size-400); line-height:24px; color:var(--md-neutral-foreground-3-rest); }
.legend-icon{ flex-shrink:0; width:18px; height:18px; display:flex; align-items:center; justify-content:center; font-size:15px; }
.legend-icon-today{ font-size:var(--md-typography-font-size-500); }
.legend-icon-range{
  width:18px; height:8px; border-radius:2px; border-top:3px solid; opacity:.85;
  background-image:repeating-linear-gradient(45deg, currentColor 0, currentColor 1.5px, transparent 1.5px, transparent 4px);
}
.legend-icon-shape{ width:10px; height:10px; background:currentColor; }
.legend-icon-shape-circle{ border-radius:50%; }
.legend-icon-shape-diamond{ transform:rotate(45deg); }
.legend-icon-shape-hexagon{ clip-path:polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%); }
.legend-icon-shape-triangle{ clip-path:polygon(50% 0%, 0% 100%, 100% 100%); }
.legend-icon-shape-octagon{ clip-path:polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%); }
.legend-icon-line{ width:18px; height:0; border-top:2px dashed; }
.data-matrix{ background:transparent; padding:0 var(--md-spacing-24); display:flex; flex-direction:column; gap:var(--md-spacing-16); text-align:left; min-height:0; }
.matrix-body{ flex:1; min-height:0; display:flex; flex-direction:column; gap:8px; }
.matrix-grid{ display:grid; gap:8px; flex:1; min-height:0; }
.matrix-axis-y-title{
  writing-mode:vertical-rl; transform:rotate(180deg); font-family:var(--font-display);
  font-weight:var(--font-weight-black); font-size:var(--md-typography-font-size-400); color:var(--md-neutral-foreground-1-rest); display:flex; align-items:center; justify-content:center;
}
.matrix-axis-x-title{ font-family:var(--font-display); font-weight:var(--font-weight-black); font-size:var(--md-typography-font-size-400); color:var(--md-neutral-foreground-1-rest); text-align:center; padding-left:80px; }
.matrix-row-label{ display:flex; align-items:center; justify-content:flex-end; padding-right:12px; font-family:var(--font-sans); font-weight:var(--font-weight-extralight); font-size:var(--md-typography-font-size-400); color:var(--md-neutral-foreground-3-rest); text-align:right; }
.matrix-axis-x-label{ display:flex; align-items:center; justify-content:center; padding-top:4px; font-family:var(--font-sans); font-weight:var(--font-weight-extralight); font-size:var(--md-typography-font-size-400); color:var(--md-neutral-foreground-3-rest); text-align:center; }
.matrix-cell{
  position:relative; border-radius:12px; display:flex; align-items:center; justify-content:center;
  cursor:pointer; min-width:0; min-height:0;
}
.matrix-cell-value{ font-family:var(--font-display); font-weight:var(--font-weight-black); font-size:var(--md-typography-font-size-500); color:var(--md-neutral-foreground-1-rest); }
.matrix-cell-on-color .matrix-cell-value{ color:var(--md-neutral-foreground-on-color-rest); }
.matrix-cell-legend{
  position:absolute; top:0; right:0; background:var(--md-neutral-background-1-rest); padding:8px;
  border-radius:0 12px 0 6px; display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 4px rgba(112,144,176,.15), 0 0 1px rgba(112,144,176,.2);
}
.matrix-cell-legend i{ font-size:var(--md-typography-font-size-500); }
.matrix-legend-rows{ display:flex; flex-direction:column; gap:8px; }
.matrix-legend-row{ display:flex; align-items:center; gap:8px; }
.matrix-legend-label-input{ flex:1; min-width:0; }
.matrix-legend-map-grid{ display:grid; gap:4px; }
.matrix-legend-map-cell{
  aspect-ratio:1; border:1px solid var(--ui-border); border-radius:6px; background:var(--md-color-grey-white);
  display:flex; align-items:center; justify-content:center; cursor:pointer; color:var(--ui-muted); font-size:var(--md-typography-font-size-200);
}
.matrix-legend-map-cell:hover{ border-color:var(--ui-accent); }
.donut-chart{ background:transparent; padding:0 var(--md-spacing-24); display:flex; flex-direction:column; gap:var(--md-spacing-16); text-align:left; min-height:0; }
.donut-body{ flex:1; min-height:0; display:flex; flex-direction:column; align-items:center; gap:16px; }
.donut-simple-chart{ position:relative; display:flex; align-items:center; justify-content:center; flex:1; min-height:0; width:100%; container-type:size; }
.donut-ring{ position:relative; width:min(85cqw, 85cqh); height:min(85cqw, 85cqh); border-radius:50%; flex-shrink:0; }
.donut-ring-bare-wrap{ position:relative; flex:1; min-width:0; height:100%; display:flex; align-items:center; justify-content:center; container-type:size; }
.donut-ring-bare{ width:min(85cqw, 85cqh); height:min(85cqw, 85cqh); }
@property --donut-p{ syntax:'<percentage>'; inherits:true; initial-value:100%; }
.donut-ring, .donut-ring-bare{
  -webkit-mask-image:conic-gradient(from -90deg, var(--md-color-grey-black) 0% var(--donut-p), transparent var(--donut-p) 100%);
  mask-image:conic-gradient(from -90deg, var(--md-color-grey-black) 0% var(--donut-p), transparent var(--donut-p) 100%);
}
.donut-ring.donut-fill-in, .donut-ring-bare.donut-fill-in{ animation:donut-fill-sweep .9s cubic-bezier(0.2,0.7,0.3,1) forwards; }
@keyframes donut-fill-sweep{ from{ --donut-p:0%; } to{ --donut-p:100%; } }
.donut-hole{ position:absolute; inset:15%; border-radius:50%; background:var(--md-neutral-background-1-rest); }
.donut-center{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; text-align:center; }
.donut-metric{ font-family:var(--font-display); font-weight:var(--font-weight-black); font-size:48px; line-height:1; color:var(--md-neutral-foreground-3-rest); outline:none; }
.donut-caption{ font-family:var(--font-sans); font-weight:var(--font-weight-light); font-size:var(--md-typography-font-size-500); color:var(--md-neutral-foreground-3-rest); outline:none; }
.donut-extended-row{ display:flex; align-items:center; justify-content:space-between; gap:16px; width:100%; flex:1; min-height:0; }
.donut-extended-left{ display:flex; flex-direction:column; align-items:flex-start; gap:8px; min-width:0; }
.donut-metric-row{ display:flex; align-items:flex-end; gap:12px; }
.donut-metric-big{ font-family:var(--font-display); font-weight:var(--font-weight-black); font-size:48px; line-height:1; color:var(--md-neutral-foreground-1-rest); outline:none; }
.donut-metric-suffix{ font-family:var(--font-sans); font-weight:var(--font-weight-extralight); font-size:var(--md-typography-font-size-600); color:var(--md-neutral-foreground-3-rest); outline:none; }
.donut-progress-list{ display:flex; flex-direction:column; gap:12px; width:100%; }
.donut-progress-labels{ display:flex; justify-content:space-between; font-family:var(--font-sans); font-weight:var(--font-weight-extralight); font-size:var(--md-typography-font-size-400); color:var(--md-neutral-foreground-3-rest); }
.donut-progress-track{ height:8px; border-radius:100px; background:var(--md-neutral-stroke-1-rest); overflow:hidden; }
.donut-progress-fill{ height:100%; border-radius:100px; }
.donut-thumb-ring{ position:relative; width:28px; height:28px; border-radius:50%; }
.donut-thumb-hole{ position:absolute; inset:28%; border-radius:50%; background:var(--slide-surface); }
.prop-tabs-wrap{ margin-bottom:16px; }
.prop-panel-warning{
  background:var(--md-status-warning-background-1-rest); color:var(--md-status-warning-foreground-1-rest);
  border:1px solid var(--md-status-warning-stroke-color); border-radius:8px; padding:8px 12px;
  font-size:var(--md-typography-font-size-200); line-height:1.4; margin:-4px 0 4px;
}
.mini-segment-accent .cols-group-thumb{ background:var(--ui-accent); }
.mini-segment-accent button.active{ color:var(--md-color-grey-white); }
.prop-toggle-row-muted-label{ color:var(--ui-muted); }
.prop-data-actions{ display:flex; flex-direction:column; gap:8px; }
.prop-data-actions .btn{ width:100%; box-sizing:border-box; justify-content:center; display:flex; }
.chart-palette-grid{ display:grid; grid-template-columns:repeat(4, 1fr); gap:8px; }
.chart-palette-swatch{
  display:flex; gap:2px; padding:8px; border:1px solid var(--ui-border); border-radius:8px;
  background:var(--md-color-grey-white); cursor:pointer;
}
.chart-palette-swatch span{ flex:1; border-radius:3px; }
.chart-palette-swatch-flat span{ height:16px; }
.chart-palette-swatch-ramp span{ height:16px; }
.chart-palette-swatch.active{ border-color:var(--ui-accent); box-shadow:0 0 0 1px var(--ui-accent); }
.chart-palette-swatch:disabled{ opacity:.4; cursor:not-allowed; }
.chart-palette-swatch-blocks{ display:flex; height:16px; flex:1; overflow:hidden; border-radius:3px; }
.chart-palette-swatch-blocks i{ flex:1; display:block; }

