/* Global readability pass: preserve layout/colors while increasing secondary UI type. */
body { font-size: 15px; }
.eyebrow { font-size: 12px; }
.topbar nav a { font-size: 14px; }
.topbar-status { font-size: 13px; }
.intro p, .page-intro p { font-size: 17px; }
.intro-metrics span { font-size: 12px; }

.preset { font-size: 13px; }
.input-field > span { font-size: 13px; }
.input-field i { font-size: 11px; }
.input-field select { font-size: 12px; }
.input-field input {
  font-family: var(--sans);
  font-size: 14px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}
.suffix-input > span,
.mode-block > span,
.mode-button,
.advanced summary,
.toggle-row,
.estimate-label { font-size: 13px; }
.estimate-amount {
  font-family: var(--sans);
  font-size: 31px;
  letter-spacing: -1px;
  font-variant-numeric: tabular-nums;
}
.estimate-model { font-size: 14px; }
.estimate-meta span { font-size: 12px; }
.estimate-meta strong {
  font-family: var(--sans);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}
.share-button { font-size: 13px; }

.catalog-count span { font-size: 13px; }
.search-box input { font-size: 15px; }
.sort-select { font-size: 14px; }
.filter-label { font-size: 11px; }
.filter-pill, .capability-chip, .scope-chip { font-size: 13px; }
.filter-pill span, .capability-chip span, .scope-chip span { font-size: 11px; }
.scope-note { font-size: 13px; }
.table-caption { font-size: 13px; }
.data-table th { font-size: 11.5px; }
.data-table td { font-size: 14px; }
.model-link { font-size: 14px; }
.table-model small { font-size: 12px; }
.quiet-link, .endpoint-link { font-size: 13px; }
.source-cell a { font-size: 12px; }
.source-badge { font-size: 11px; }
.is-incompatible .monthly-value { font-size: 12px; }
.market-footnote { font-size: 13px; }
.text-button { font-size: 13px; }
.comparison-heading h3 { font-size: 16px; }
.comparison-heading p,
.comparison-heading > span { font-size: 13px; }
.compare-card-head strong { font-size: 13px; }
.compare-provider,
.compare-savings { font-size: 11px; }

.source-strip strong { font-size: 14px; }
.source-strip span { font-size: 12px; }
.source-strip a { font-size: 14px; }
.footer-brand p { font-size: 14px; }
.footer-brand > span { font-size: 12px; }
.footer-grid strong { font-size: 14px; }
.footer-grid a:not(.brand) { font-size: 13px; }
.footer-bottom { font-size: 12px; }

.page-stat > span { font-size: 13px; }
.detail-toolbar p { font-size: 14px; }
.source-link, .primary-link, .back-links a { font-size: 14px; }
.information-card p { font-size: 15px; }
.rate-card span { font-size: 13px; }
.rate-card small { font-size: 12px; }
.detail-chip { font-size: 12px; }
.example-line { font-size: 14px; }
.provider-card h2 { font-size: 17px; }
.provider-card > p { font-size: 14px; }
.provider-card-meta { font-size: 12px; }
.provider-card-meta strong { font-size: 11px; }
.notice span { font-size: 14px; }
.prose-card p { font-size: 15px; }
.formula { font-size: 13px; }
.reading-sidebar > div { font-size: 13px; }
.reading-sidebar a { font-size: 12px; }

.stage2-meta-card span,
.stage2-meta-card small { font-size: 12px; }
.stage2-subsection > strong { font-size: 14px; }
.stage2-facts span { font-size: 12px; }
.stage2-facts strong { font-size: 14px; }
.stage2-route-table code { font-size: 12px; }
.stage2-link-list a { font-size: 13px; }

/* Desktop-first polish for the developer-heavy audience: use the monitor space, not tiny type. */
@media (min-width: 1221px) {
  .shell { width: min(1560px, calc(100% - 64px)); }
  .workbench {
    grid-template-columns: 350px minmax(0, 1fr);
    gap: 20px;
  }
  .calculator-panel,
  .market-panel { padding: 22px; }
  .panel-heading h2,
  .market-heading h2 { font-size: 21px; }
  .preset { min-height: 36px; }
  .input-field input { height: 42px; font-size: 15px; }
  .mode-button { height: 38px; }
  .share-button { height: 40px; }
  .search-box,
  .sort-select { height: 44px; }

  .source-strip .shell {
    min-height: 78px;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) auto;
    gap: 28px;
    padding-block: 16px;
  }
  .source-strip a { white-space: nowrap; }

  .footer { margin-top: 24px; }
  .footer-grid {
    gap: 44px;
    padding: 30px 0 22px;
  }
  .footer-bottom { min-height: 44px; }
}

@media (min-width: 1400px) {
  .intro h1, .page-intro h1 { max-width: 900px; font-size: 56px; }
  .price-table { min-width: 1040px; }
  .price-table th,
  .price-table td { padding-inline: 8px; }
  .price-table .table-model { min-width: 235px; }
  .price-table .model-link { max-width: 245px; }
  .price-table .table-model small { max-width: 250px; }
}

@media (max-width: 900px) {
  .topbar nav a { font-size: 12px; }
}

@media (max-width: 620px) {
  body { font-size: 15px; }
  .topbar nav a,
  .topbar nav a:nth-child(3),
  .topbar nav a:nth-child(4),
  .topbar nav a:nth-child(5),
  .topbar nav a:nth-child(6) { font-size: 10.5px; }
  .intro p, .page-intro p { font-size: 15px; }
  .intro-metrics span { font-size: 10px; }

  .input-field input,
  .search-box input,
  .sort-select { font-size: 16px; }
  .input-field > span,
  .suffix-input > span,
  .mode-block > span,
  .mode-button,
  .advanced summary,
  .toggle-row,
  .estimate-label { font-size: 13px; }
  .preset { font-size: 13px; }
  .estimate-amount { font-size: 29px; }
  .estimate-meta strong { font-size: 13px; }

  .filter-label { font-size: 12px; }
  .filter-pill, .capability-chip, .scope-chip { font-size: 14px; }
  .filter-pill span, .capability-chip span, .scope-chip span { font-size: 12px; }
  .scope-note { font-size: 14px; line-height: 1.5; }
  .table-caption { font-size: 14px; }
  .price-table th, .secondary-table th { font-size: 11px; }
  .price-table td, .secondary-table td { font-size: 13px; }
  .model-link { font-size: 14px; }
  .table-model small { font-size: 11.5px; }
  .source-cell a { font-size: 12px; }
  .source-badge { font-size: 11px; }

  .source-strip strong { font-size: 15px; }
  .source-strip span,
  .source-strip a { font-size: 14px; }
  .footer-brand p { font-size: 15px; }
  .footer-brand > span { font-size: 13px; }
  .footer-grid strong { font-size: 15px; }
  .footer-grid a:not(.brand) { font-size: 14px; }
  .footer-bottom { font-size: 13px; line-height: 1.45; }

  .detail-toolbar p,
  .source-link,
  .primary-link,
  .back-links a,
  .notice span { font-size: 14px; }
  .information-card p,
  .prose-card p { font-size: 15px; }
  .provider-card > p { font-size: 14px; }
  .reading-sidebar > div { font-size: 14px; }
}
