/* Local SVG / CSS charts; scoped so existing patient and research charts are unaffected. */
.overview-chart-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  margin: 0;
}
.dashboard-overview-charts { margin-top: 20px; }
.overview-chart-grid > :only-child { grid-column: 1 / -1; }
.overview-chart-panel { min-width: 0; display: flex; flex-direction: column; }
.overview-chart-title { margin: 0; font-size: 16px; line-height: 1.5; color: var(--ink, #173b37); }
.overview-chart-note { margin: 6px 0 18px; color: var(--muted, #54736d); font-size: 12px; line-height: 1.65; }
.overview-chart {
  --overview-green: #3b9578;
  --overview-yellow: #c69a42;
  --overview-red: #cc7476;
  --overview-blue: #649aba;
  --overview-purple: #9683b5;
  --overview-muted: #92aaa0;
  --overview-track: rgba(72, 121, 99, .1);
  --overview-hover: rgba(53, 124, 95, .06);
  min-width: 0;
  color: var(--ink, #173b37);
  font-variant-numeric: tabular-nums;
}
html[data-theme="dark"] .overview-chart {
  --overview-green: #7bc5a5;
  --overview-yellow: #ddbd74;
  --overview-red: #e49896;
  --overview-blue: #8bb8d2;
  --overview-purple: #b4a0d0;
  --overview-muted: #78978a;
  --overview-track: rgba(173, 216, 195, .13);
  --overview-hover: rgba(174, 225, 197, .08);
}
.overview-chart-tone-green { --overview-tone: var(--overview-green); }
.overview-chart-tone-yellow { --overview-tone: var(--overview-yellow); }
.overview-chart-tone-red { --overview-tone: var(--overview-red); }
.overview-chart-tone-blue { --overview-tone: var(--overview-blue); }
.overview-chart-tone-purple { --overview-tone: var(--overview-purple); }
.overview-chart-tone-muted { --overview-tone: var(--overview-muted); }
.overview-chart-donut { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; }
.overview-chart-ring { position: relative; flex: 0 0 190px; width: 190px; height: 190px; margin: 0 auto; }
.overview-chart .overview-chart-svg { display: block; width: 190px; height: 190px; overflow: visible; fill: none; }
.overview-chart .overview-chart-track { fill: none; stroke: var(--overview-track); stroke-width: 22px; }
.overview-chart .overview-chart-segment { fill: none; stroke: var(--overview-tone); stroke-width: 22px; transition: stroke-width .15s ease, filter .15s ease; }
.overview-chart .overview-chart-segment:hover,
.overview-chart .overview-chart-segment:focus-visible { stroke-width: 27px; filter: brightness(1.1); outline: none; }
.overview-chart-center { position: absolute; inset: 43px 27px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; text-align: center; pointer-events: none; }
.overview-chart-center strong { display: block; margin: 0; max-width: 100%; color: var(--ink, #173b37); font-size: 28px; font-weight: 700; line-height: 1.1; letter-spacing: -.03em; overflow-wrap: anywhere; }
.overview-chart-center span { color: var(--muted, #54736d); font-size: 11px; line-height: 1.5; }
.overview-chart .overview-chart-legend,
.overview-chart .overview-chart-bar-list { padding: 0; margin: 0; list-style: none; min-width: 0; }
.overview-chart .overview-chart-legend { flex: 1 1 180px; }
.overview-chart-legend-row { display: grid; grid-template-columns: 9px minmax(0, 1fr) auto 45px; gap: 8px; align-items: center; min-height: 39px; padding: 6px; border-radius: 7px; font-size: 12px; line-height: 1.5; }
.overview-chart-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--overview-tone); }
.overview-chart-legend-label { overflow-wrap: anywhere; }
.overview-chart .overview-chart-legend-row strong,
.overview-chart .overview-chart-bar-label strong { display: inline-flex; align-items: baseline; gap: 4px; color: var(--ink, #173b37); font-size: 14px; font-weight: 650; margin: 0; line-height: 1.4; white-space: nowrap; }
.overview-chart .overview-chart-legend-row strong small,
.overview-chart .overview-chart-bar-label strong small { display: inline; margin: 0; color: var(--muted, #54736d); font-size: 11px; font-weight: 400; }
.overview-chart-percentage { color: var(--muted, #54736d); font-size: 11px; text-align: right; }
.overview-chart-legend-row:hover,
.overview-chart-legend-row:focus-visible,
.overview-chart-bar-row:hover,
.overview-chart-bar-row:focus-visible { background: var(--overview-hover); }
.overview-chart-legend-row:focus-visible,
.overview-chart-bar-row:focus-visible { outline: 2px solid var(--green, #176957); outline-offset: 2px; }
.overview-chart-axis { display: flex; justify-content: space-between; margin: 0 7px 5px; padding-bottom: 7px; border-bottom: 1px solid var(--line, #d7e4dc); color: var(--muted, #54736d); font-size: 11px; }
.overview-chart-bar-row { padding: 9px 7px; border-radius: 7px; }
.overview-chart-bar-label { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 8px; font-size: 12px; line-height: 1.5; }
.overview-chart-bar-label > span { min-width: 0; overflow-wrap: anywhere; }
.overview-chart-bar-track { height: 9px; border-radius: 3px; background: var(--overview-track); overflow: hidden; }
.overview-chart-bar-fill { display: block; height: 100%; border-radius: inherit; background: var(--overview-tone); }
.overview-chart-bar-row:is(:hover, :focus-visible) .overview-chart-bar-fill { filter: brightness(1.12); }
.overview-chart .overview-chart-empty { flex-basis: 100%; margin: 8px 0 0; padding: 8px 0; color: var(--muted, #54736d); text-align: center; font-size: 12px; line-height: 1.6; }
.overview-coverage-layout { display: grid; grid-template-columns: minmax(260px, .9fr) minmax(0, 1.3fr); gap: 20px; align-items: center; }
.overview-coverage-layout > .research-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0; min-width: 0; }
.overview-coverage-layout > .research-metrics > article { min-width: 0; }
@media (max-width: 1100px) { .overview-coverage-layout { grid-template-columns: 1fr; } }
@media (max-width: 1000px) {
  .overview-chart-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .overview-chart-donut { gap: 10px; }
  .overview-chart .overview-chart-legend { flex-basis: 100%; width: 100%; }
  .overview-chart-legend-row { grid-template-columns: 9px minmax(0, 1fr) auto 45px; }
}
@media (prefers-reduced-motion: reduce) { .overview-chart .overview-chart-segment { transition: none; } }