.affordability-summary {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: var(--s3);
 margin: var(--s5) 0;
}
.affordability-stat {
 min-width: 0;
 display: flex;
 flex-direction: column;
 gap: var(--s1);
 padding: var(--s4);
 border: 1px solid var(--rule);
 border-radius: var(--radius);
 background: var(--card);
 box-shadow: var(--shadow);
}
.affordability-stat span { color: var(--ink-2); font-size: .875rem; }
.affordability-stat strong { color: var(--money); font-size: clamp(1.35rem, 4vw, 1.9rem); line-height: 1.15; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.affordability-controls {
 display: grid;
 grid-template-columns: minmax(0, 1fr) minmax(12rem, .5fr);
 align-items: end;
 gap: var(--s3);
 margin: var(--s4) 0 var(--s2);
}
.affordability-controls label { display: grid; gap: var(--s1); font-weight: 600; }
.affordability-controls input, .affordability-controls select {
 width: 100%; min-width: 0; min-height: 48px; padding: var(--s2) var(--s3);
 border: 1px solid var(--field); border-radius: var(--radius-sm); background: var(--card);
 color: var(--ink); font: inherit;
}
.affordability-controls input:focus-visible, .affordability-controls select:focus-visible { outline: 3px solid var(--link); outline-offset: 2px; }
.affordability-count { grid-column: 1 / -1; margin: 0; color: var(--ink-2); font-size: .875rem; }
.affordability-table-wrap {
 max-width: 100%; overflow: auto; margin: var(--s3) 0 var(--s4);
 border: 1px solid var(--rule); border-radius: var(--radius-sm); background: var(--card);
}
.affordability-table { min-width: 68rem; margin: 0; }
.affordability-table.affordability-compact-table { min-width: 39rem; }
.affordability-table th { vertical-align: bottom; white-space: nowrap; }
.affordability-table td { vertical-align: middle; }
.affordability-table td.num, .affordability-table th.num { white-space: nowrap; }
.affordability-sort {
 min-height: var(--tap); padding: 0; border: 0; background: transparent; color: var(--ink);
 font: inherit; font-weight: 700; text-align: inherit; cursor: pointer;
}
.affordability-sort::after { content: "↕"; display: inline-block; margin-left: .35rem; color: var(--muted); font-size: .85em; }
.affordability-table th[aria-sort="ascending"] .affordability-sort::after { content: "↑"; color: var(--link); }
.affordability-table th[aria-sort="descending"] .affordability-sort::after { content: "↓"; color: var(--link); }
.affordability-highlight {
 margin: var(--s4) 0;
 padding: var(--s4);
 border: 1px solid #d7e8dc;
 border-radius: var(--radius-sm);
 background: var(--money-wash);
}
.affordability-highlight > :last-child { margin-bottom: 0; }
.affordability-subnav { display: flex; flex-wrap: wrap; gap: var(--s2) var(--s4); margin: var(--s4) 0; }
.affordability-sources { margin: var(--s4) 0; }
.affordability-sources li { overflow-wrap: anywhere; }
.affordability-unavailable { color: var(--ink-2); }
.affordability-chart-note { color: var(--ink-2); font-size: .9rem; }

@media (max-width: 42rem) {
 .affordability-summary { grid-template-columns: 1fr; gap: var(--s2); }
 .affordability-stat { padding: var(--s3); }
 .affordability-controls { grid-template-columns: 1fr; }
 .affordability-count { grid-column: 1; }
}