/* Responsive charts retain the website's white background and reading scale. */
.market-chart {
  margin: 22px 0 0;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: #fff;
  min-width: 0;
  font-size: var(--type-body);
  line-height: 1.75;
}
.market-chart + .market-chart { margin-top: 24px; }
.market-chart-heading { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px 20px; align-items: start; }
.market-chart-heading h4 { margin: 0; font-size: var(--type-subsection); line-height: 1.6; }
.market-chart-switch { display: flex; flex-wrap: wrap; gap: 4px; padding: 3px; border: 1px solid var(--line); border-radius: 4px; }
.market-chart-switch button { padding: 6px 13px; min-height: 38px; border-radius: 2px; background: #fff; color: var(--text); font: inherit; font-size: var(--type-small); cursor: pointer; }
.market-chart-switch button[aria-pressed="true"] { background: var(--green); color: #fff; }
.market-chart button:focus-visible, .market-chart summary:focus-visible { outline: 3px solid #a97825; outline-offset: 3px; }
.market-chart-legend { display: flex; flex-wrap: wrap; gap: 8px 20px; align-items: center; margin: 17px 0 20px; color: #52675a; font-size: var(--type-small); }
.market-chart-legend > span { display: inline-flex; align-items: center; gap: 7px; }
.market-chart-legend > span:first-child { margin-right: auto; }
.market-chart-legend i, .market-share-values i { display: inline-block; width: 14px; height: 14px; flex: 0 0 14px; border-radius: 2px; }
.market-legend-estimate, .market-bar-estimate { background: var(--green); }
.market-legend-forecast, .market-bar-forecast { background: repeating-linear-gradient(135deg, #98bea6, #98bea6 5px, #d4e6d9 5px, #d4e6d9 9px); border: 1px solid #669278; }
.market-legend-other { background: #dce9e1; border: 1px solid #b3c8bb; }
.market-bar-axis { padding: 0 105px 0 115px; margin-bottom: 13px; }
.market-bar-axis > div { display: flex; justify-content: space-between; color: #6a7c70; font-size: .8125rem; font-variant-numeric: tabular-nums; }
.market-bar-axis span { width: 0; display: flex; justify-content: center; }
.market-bar-axis span:first-child { justify-content: start; }
.market-bar-axis span:last-child { justify-content: end; }
.market-bar-group { padding: 16px 0; border-top: 1px solid #e5ece7; }
.market-bar-group h5 { font-weight: 650; font-size: var(--type-body); color: var(--ink); margin-bottom: 12px; line-height: 1.7; }
.market-bar-row { display: grid; grid-template-columns: 105px minmax(0, 1fr) 95px; column-gap: 10px; align-items: center; min-height: 32px; margin-top: 7px; }
.market-bar-period { color: #52675a; font-size: var(--type-small); line-height: 1.5; }
.market-bar-track { height: 22px; position: relative; background: repeating-linear-gradient(to right, #e4ece6 0, #e4ece6 1px, transparent 1px, transparent 25%), #f5f8f6; border-left: 1px solid #a6b9ac; }
.market-bar-fill { display: block; height: 100%; border-radius: 0 2px 2px 0; }
.market-bar-value { text-align: right; font-size: 1.0625rem; font-weight: 650; font-variant-numeric: tabular-nums; color: var(--ink); }
.market-insights .market-chart-note { margin-top: 14px; font-size: var(--type-small); line-height: 1.85; color: #52675a; text-align: left; }
.market-chart-table { margin-top: 18px; border-top: 1px solid var(--line); padding-top: 12px; font-size: var(--type-small); }
.market-chart-table summary { color: var(--green); cursor: pointer; width: fit-content; padding: 4px 0; min-height: 30px; list-style: revert; }
.market-table-scroll { overflow-x: auto; margin-top: 12px; }
.market-chart table { width: 100%; border-collapse: collapse; line-height: 1.7; }
.market-chart caption { text-align: left; color: #52675a; margin-bottom: 9px; }
.market-chart th, .market-chart td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.market-chart th:first-child { text-align: left; white-space: normal; min-width: 125px; }
.market-chart thead th { background: #f4f8f5; font-weight: 600; }
.market-chart tbody th { font-weight: 500; }
.market-chart-sources { display: flex; flex-wrap: wrap; gap: 7px 15px; align-items: baseline; margin-top: 16px; font-size: var(--type-small); color: #52675a; }
.market-chart-sources .source-link { margin-top: 0; }
.market-line-plot { position: relative; height: 215px; margin: 48px 4px 0 36px; color: var(--green); }
.market-line-plot > svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.market-line-grid { position: absolute; width: 100%; height: 0; border-top: 1px solid #e3ebe5; }
.market-line-grid > span { position: absolute; right: calc(100% + 10px); transform: translateY(-50%); color: #6a7c70; font-size: .8125rem; }
.market-line-point { position: absolute; z-index: 1; left: var(--point-x); top: var(--point-y); width: 44px; height: 44px; transform: translate(-50%, -50%); border-radius: 50%; color: var(--green); background: transparent; cursor: pointer; }
.market-line-point > i { position: absolute; top: 50%; left: 50%; width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 3px solid var(--green); transform: translate(-50%, -50%); }
.market-line-point[aria-pressed="true"] > i { background: var(--green); box-shadow: 0 0 0 4px #dcebe1; }
.market-line-point > span { position: absolute; bottom: 35px; left: 50%; transform: translateX(-50%); white-space: nowrap; color: var(--ink); background: #fff; font-weight: 650; font-size: .9375rem; line-height: 1.5; padding: 1px 3px; font-variant-numeric: tabular-nums; }
.market-line-years { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 12px 4px 0 36px; color: #52675a; font-size: .875rem; text-align: center; }
.market-point-summary { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; margin-top: 22px; padding-top: 15px; border-top: 1px solid var(--line); color: #52675a; font-size: var(--type-small); }
.market-point-summary strong { font-size: 1.25rem; color: var(--green); font-variant-numeric: tabular-nums; }
.market-latest-quarter { margin-top: 20px; padding: 17px 18px; background: #f4f8f5; border-left: 3px solid var(--green); }
.market-latest-quarter > div { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 15px; }
.market-latest-quarter > div > span { font-size: var(--type-small); color: var(--ink); }
.market-latest-quarter strong { color: var(--green); font-size: 1.375rem; font-variant-numeric: tabular-nums; }
.market-latest-quarter small { color: #52675a; font-size: var(--type-small); }
.market-latest-quarter > p { margin-top: 8px; color: #52675a; font-size: var(--type-small); line-height: 1.85; }
.market-donut-layout { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 26px; align-items: center; margin-top: 20px; }
.market-donut { position: relative; width: 230px; max-width: 100%; color: var(--green); }
.market-donut svg { width: 100%; height: auto; display: block; }
.market-donut > div { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1.6; }
.market-donut strong { color: var(--green); font-size: 1.75rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.market-donut > div > span { font-size: var(--type-small); color: #52675a; }
.market-share-values { margin: 0; }
.market-share-values > div { display: flex; justify-content: space-between; gap: 15px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.market-share-values dt { display: flex; align-items: center; gap: 9px; color: var(--ink); font-size: var(--type-small); }
.market-share-values dd { margin: 0; font-size: 1.25rem; color: var(--green); font-weight: 650; font-variant-numeric: tabular-nums; }
@media (max-width: 680px) {
  .market-chart { padding: 18px 15px; }
  .market-chart-heading { gap: 14px; }
  .market-chart-switch { width: fit-content; }
  .market-chart-switch button { padding-inline: 11px; min-height: 40px; }
  .market-chart-legend { gap: 8px 13px; }
  .market-chart-legend > span:first-child { flex-basis: 100%; }
  .market-bar-row { grid-template-columns: 78px minmax(0, 1fr) 54px; gap: 8px; }
  .market-bar-period { font-size: .8125rem; }
  .market-bar-value { font-size: .9375rem; }
  .market-bar-axis { padding: 0 62px 0 86px; }
  .market-bar-axis > div { font-size: .6875rem; }
  .market-bar-axis span:nth-child(2), .market-bar-axis span:nth-child(4) { visibility: hidden; }
  .market-line-plot { height: 190px; margin-left: 29px; }
  .market-line-years { margin-left: 29px; font-size: .8125rem; }
  .market-line-point > span { font-size: .8125rem; padding-inline: 0; }
  .market-donut-layout { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .market-donut { justify-self: center; width: 220px; }
  .market-share-values > div { padding-block: 12px; }
}
