.comparison-intro { width: min(70rem, calc(100% - 4rem)); margin: auto; padding: 3.5rem 0 0; }
.comparison-intro > a { font-size: .85rem; }
.comparison-intro h1 { margin-top: 1.4rem; max-width: 18ch; }
.comparison-intro .summary { margin: 0; max-width: 65ch; }
.comparison-date { font-size: .8rem; color: var(--muted); margin-top: 1.4rem; }
.contents { display: flex; flex-wrap: wrap; gap: .65rem 1.6rem; border-block: 1px solid var(--grid); padding-block: 1.15rem; margin-top: 2.5rem; }
.contents a { font-size: .9rem; }
.comparison-page .section { padding-block: 3.75rem; }
.comparison-page .section-intro { max-width: 47rem; margin-bottom: 2rem; }
.table-scroll { overflow-x: auto; scrollbar-color: var(--line) var(--background); }
.comparison-table { width: 100%; border-collapse: collapse; text-align: left; font-size: .9rem; line-height: 1.5; }
.comparison-table caption { text-align: left; color: var(--muted); font-size: .8rem; padding-bottom: .75rem; }
.comparison-table th, .comparison-table td { padding: 1.1rem 1.2rem 1.1rem 0; border-bottom: 1px solid var(--grid); vertical-align: top; }
.comparison-table th:last-child, .comparison-table td:last-child { padding-right: 0; }
.comparison-table thead th { font-size: .78rem; font-weight: 500; color: var(--muted); border-bottom-color: var(--line); }
.comparison-table tbody th { font-weight: 500; min-width: 10rem; }
.comparison-table td { color: var(--muted); min-width: 9rem; }
.comparison-table td:last-child { min-width: 16rem; }
.table-detail { display: block; margin-top: .3rem; font-weight: 400; font-size: .76rem; color: var(--muted); }
.number, .compact-table td, .results-table td { font-variant-numeric: tabular-nums; }
.comparison-table .number { color: var(--foreground); }
.compact-table { margin-block: 1.2rem; }
.compact-table td, .compact-table th, .compact-table td:last-child { min-width: 5rem; }
.evidence-block { display: grid; grid-template-columns: 1fr 2fr; gap: 3rem; border-top: 1px solid var(--grid); padding: 2rem 0; }
.evidence-block > div:last-child { max-width: 70ch; }
.evidence-block p { font-size: .94rem; color: var(--muted); }
.evidence-block strong { font-weight: 500; color: var(--foreground); }
.evidence-block .evidence-origin { font-size: .8rem; }
.evidence-block .source-line { font-size: .8rem; margin-bottom: 0; }
.comparison-detail { border-top: 1px solid var(--grid); }
.comparison-detail summary { padding-right: 2rem; }
.detail-body { max-width: 72ch; padding-bottom: .75rem; }
.detail-body p { padding-bottom: 1rem; }
.accounting-list { margin: 0 0 2.5rem; }
.accounting-list > div { display: grid; grid-template-columns: 1fr 3fr; gap: 2rem; padding: 1.35rem 0; border-top: 1px solid var(--grid); }
.accounting-list dt { font-weight: 500; }
.accounting-list dd { color: var(--muted); margin: 0; font-size: .94rem; max-width: 72ch; }
.cost-example { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; padding: 2rem; background: var(--surface); border: 1px solid var(--grid); border-radius: .875rem; }
.cost-example p { color: var(--muted); font-size: .94rem; }
.calculator { display: flex; flex-direction: column; }
.calculator label { font-size: .85rem; margin-bottom: .4rem; }
.calculator input { width: 100%; font: inherit; font-variant-numeric: tabular-nums; padding: .6rem .8rem; background: var(--background); color: var(--foreground); border: 1px solid var(--line); border-radius: .375rem; margin-bottom: 1rem; caret-color: var(--primary); }
.calculator input:invalid { outline: 2px solid var(--line); }
.calculator #cost-note { font-size: .8rem; margin-top: 0; }
.calculator output { font-size: 1.4rem; color: var(--foreground); font-variant-numeric: tabular-nums; min-height: 2.4rem; }
.measurement-list { padding-left: 1.5rem; max-width: 75ch; }
.measurement-list li { padding-left: .3rem; margin-bottom: 1.25rem; color: var(--muted); }
.measurement-list strong { color: var(--foreground); font-weight: 500; }
.comparison-actions { justify-content: flex-start; margin-top: 2rem; }
.comparison-page #method > p { max-width: 72ch; }
.results-summary { color: var(--muted); font-size: .9rem; max-width: 75ch; }
.results-table td, .results-table td:last-child { min-width: 7rem; }
.results-links { display: flex; gap: 1.2rem; flex-wrap: wrap; font-size: .85rem; margin: 1.25rem 0; }
.results-notes { max-width: 78ch; color: var(--muted); font-size: .85rem; }
.results-notes li { margin-bottom: .65rem; }
@media (max-width: 800px) { .comparison-intro { width: calc(100% - 2.5rem); } .evidence-block { gap: 1.5rem; grid-template-columns: 1fr 2fr; } .cost-example { gap: 2rem; padding: 1.5rem; } }
@media (max-width: 560px) { .comparison-intro { padding-top: 2.5rem; } .comparison-page .section { padding-block: 3rem; } .comparison-intro .summary { font-size: 1rem; } .evidence-block, .accounting-list > div, .cost-example { grid-template-columns: 1fr; gap: .75rem; } .cost-example { gap: 1.5rem; } .evidence-block { padding-block: 1.5rem; } .evidence-block h3 { margin-bottom: .4rem; } .contents { gap: .8rem 1.25rem; } .comparison-table { font-size: .85rem; } }
/* Grid children must be allowed to shrink around scrollable data tables. */
.evidence-block > div, .cost-example > div { min-width: 0; }
.results-table + .results-summary, .table-scroll + .results-summary { margin-top: 1.25rem; }

.table-hint { color: var(--muted); font-size: .8rem; margin-bottom: 1rem; }
@media (min-width: 801px) { .table-hint { display: none; } }

/* Route comparison: the archival reading surfaces above remain unchanged. */
.model-compare .comparison-intro h1 { margin-top: 0; }
.model-compare .benchmark-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; margin-bottom: 1.75rem; }
.model-compare .benchmark-heading h2 { max-width: 22ch; }
.model-compare .benchmark-heading p { max-width: 52ch; color: var(--muted); margin-bottom: 0; }
.model-compare select, .model-compare input { font: inherit; color: var(--foreground); background: var(--surface); border: 1px solid var(--line); border-radius: .5rem; min-height: 2.875rem; width: 100%; padding: .65rem .75rem; }
.model-compare select { padding-right: 1.75rem; }
.model-compare label { display: block; font-size: .85rem; font-weight: 500; margin-bottom: .5rem; }
.model-compare .metric-control { min-width: 15rem; flex-direction: column; }
.model-compare input { font-variant-numeric: tabular-nums; caret-color: var(--primary); }
.model-compare input::placeholder { color: var(--muted); opacity: 1; font-size: .85rem; }
.model-compare .benchmark-figure { margin: 0; }
.model-compare figcaption { color: var(--muted); font-size: .8rem; padding-block: .75rem; border-bottom: 1px solid var(--line); }
.model-compare .benchmark-row { display: grid; grid-template-columns: minmax(12rem, 1fr) minmax(6rem, 1.6fr) 7.5rem; align-items: center; gap: 2rem; padding-block: 1.5rem; border-bottom: 1px solid var(--grid); }
.model-compare .benchmark-name strong, .model-compare .benchmark-name span, .model-compare .benchmark-value span, .model-compare .unscored-route span { display: block; }
.model-compare .benchmark-name strong { font-size: .96rem; font-weight: 500; }
.model-compare .benchmark-name span, .model-compare .benchmark-value span, .model-compare .unscored-route span { color: var(--muted); font-size: .75rem; margin-top: .3rem; }
.model-compare .benchmark-bar { width: 100%; height: 1.25rem; stroke: none; }
.model-compare .bar-track { fill: var(--grid); }
.model-compare .bar-value { fill: var(--primary); }
.model-compare .benchmark-value { text-align: right; font-variant-numeric: tabular-nums; }
.model-compare .benchmark-value strong { font-size: 1.45rem; font-weight: 500; }
.model-compare .chart-scale { display: flex; justify-content: space-between; margin: .5rem 9.5rem 1.25rem calc((100% - 11.5rem) / 2.6 + 2rem); color: var(--muted); font-size: .7rem; font-variant-numeric: tabular-nums; }
.model-compare .unscored-route { display: grid; grid-template-columns: 1fr 2fr; gap: 2rem; padding-block: 1.25rem; border-block: 1px solid var(--grid); }
.model-compare .unscored-route strong { font-size: .94rem; font-weight: 500; }
.model-compare .unscored-route p { margin: 0; font-size: .85rem; color: var(--muted); max-width: 60ch; }
.model-compare .route-list { margin: 0; }
.model-compare .route-list > div { display: grid; grid-template-columns: 1fr 2fr; gap: 3rem; padding-block: 1.5rem; border-top: 1px solid var(--grid); }
.model-compare .route-list dt { font-size: 1.125rem; font-weight: 500; }
.model-compare .route-list dt span { display: block; color: var(--muted); font-size: .8rem; font-weight: 400; margin-top: .3rem; }
.model-compare .route-list dd { margin: 0; color: var(--muted); max-width: 64ch; font-size: .94rem; }
.model-compare .route-list dd a { display: block; margin-top: .65rem; width: fit-content; }
.model-compare .cost-planner { display: grid; grid-template-columns: 1fr .85fr; gap: 4rem; align-items: start; }
.model-compare .planner-inputs { min-width: 0; }
.model-compare .planner-inputs input { margin-bottom: .8rem; }
.model-compare .field-note { color: var(--muted); font-size: .8rem; line-height: 1.5; margin: .65rem 0 1.5rem; }
.model-compare fieldset { padding: 0; border: 0; margin: 0; min-width: 0; }
.model-compare legend { font-size: .85rem; font-weight: 500; padding: 0; margin-bottom: 1rem; }
.model-compare .volume-presets { display: flex; flex-wrap: wrap; gap: .5rem; }
.model-compare .volume-presets button { font: inherit; font-size: .85rem; color: var(--foreground); background: transparent; border: 1px solid var(--line); border-radius: .375rem; padding: .4rem .85rem; min-height: 2.75rem; cursor: pointer; }
.model-compare .volume-presets button:hover { background: var(--surface-hover); }
.model-compare .volume-presets button[aria-pressed="true"] { background: var(--primary-soft); border-color: var(--primary); }
.model-compare .planner-result { padding: 2rem; background: var(--surface); border-radius: .875rem; border: 1px solid var(--grid); min-width: 0; }
.model-compare #estimate-kind { font-size: .94rem; margin: 0 0 1rem; }
.model-compare #estimated-cost { display: block; font-family: "Instrument Serif", Georgia, serif; font-size: clamp(2rem, 3.7vw, 3rem); line-height: 1.15; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.model-compare #estimated-cost span { display: block; font: .9rem/1.5 "Nebula Sans", sans-serif; color: var(--muted); margin-top: .4rem; }
.model-compare #unit-cost { font-size: .94rem; font-variant-numeric: tabular-nums; margin-block: 1.5rem; }
.model-compare #cost-formula { padding-top: 1.25rem; border-top: 1px solid var(--grid); font-size: .8rem; color: var(--muted); overflow-wrap: anywhere; }
.model-compare #price-source { font-size: .8rem; }
.model-compare .source-list { margin-bottom: 2rem; }
.model-compare .source-list > a { display: block; padding-block: 1.15rem; border-top: 1px solid var(--grid); text-decoration: none; }
.model-compare .source-list strong { display: block; font-weight: 500; text-decoration: underline; text-underline-offset: .2em; }
.model-compare .source-list span { display: block; font-size: .85rem; color: var(--muted); margin-top: .35rem; }
.model-compare [hidden] { display: none !important; }
@media (max-width: 800px) {
  .model-compare .benchmark-heading { display: block; }
  .model-compare .metric-control { margin-top: 1.25rem; max-width: 22rem; }
  .model-compare .benchmark-row { grid-template-columns: minmax(0, 1fr) 7.5rem; gap: .8rem; }
  .model-compare .benchmark-name { grid-column: 1 / -1; }
  .model-compare .benchmark-bar { align-self: center; }
  .model-compare .chart-scale { margin: .5rem 8.3rem 1.25rem 0; }
  .model-compare .cost-planner { gap: 2rem; }
  .model-compare .planner-result { padding: 1.5rem; }
}
@media (max-width: 560px) {
  .model-compare .route-list > div, .model-compare .unscored-route, .model-compare .cost-planner { grid-template-columns: 1fr; gap: 1rem; }
  .model-compare .cost-planner { gap: 1.75rem; }
  .model-compare select, .model-compare input { font-size: 1rem; }
}
@media (forced-colors: active) {
  .model-compare .bar-track { fill: Canvas; stroke: CanvasText; stroke-width: .3; }
  .model-compare .bar-value { fill: Highlight; forced-color-adjust: none; }
}
