/* Read results, then inspect evidence. One shared workspace, two levels of detail. */
:root {
  --outcome-safe: #2f6f5e;
  --outcome-death: #b4472c;
  --outcome-stranded: #ae7a16;
  --outcome-unavoidable: #8f8274;
  --chart-track: #f2e5cf;
  --chart-selected: #f7ebd6;
}
body[data-page='leaderboard'] main.container { padding-top: 32px; }
.benchmark-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin: 0 0 30px; }
.benchmark-heading h1 { font-size: var(--title-size); margin: 0 0 12px; }
.benchmark-heading p { font-size: 14px; color: var(--text-secondary); margin: 0; }
.benchmark-heading .benchmark-scope { font-size: 12px; line-height: 1.8; text-align: right; }
.benchmark-scope span { display: block; font-size: 12px; color: var(--text-muted); }
.leaderboard-workspace { padding: 26px 30px 16px; }
.explorer-intro { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 22px; }
.explorer-intro > p { font-weight: 500; font-size: 18px; margin: 0; }
.display-switch { display: flex; align-items: center; gap: 16px; }
.display-switch button { border: 0; border-bottom: 1px solid transparent; background: transparent; color: var(--text-secondary); padding: 6px 0; min-height: 44px; font: inherit; font-size: 12px; cursor: pointer; }
.display-switch [aria-pressed='true'] { color: var(--text-primary); border-bottom-color: currentColor; }
.explorer-search { grid-template-columns: minmax(160px,1fr) minmax(130px,170px) minmax(130px,170px) auto; gap: 16px; }
.explorer-search .field, .sort-field { flex: initial; }
.explorer-views { margin: 16px 0 10px; align-items: center; }
.explorer-views .sort-field { display: flex; flex-direction: row; align-items: center; gap: 10px; width: auto; white-space: nowrap; font-size: 12px; margin-left: auto; }
.sort-field select { width: 180px; height: 44px; }
.metric-views { background: transparent; padding: 0; gap: 6px; }
.metric-views button { border-radius: 6px; padding: 8px 16px; }
.metric-views [aria-pressed='true'] { background: var(--chart-selected); box-shadow: none; }
.leaderboard-workspace #result-count { margin: 8px 0 20px; }
.results-reading { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(290px,1fr); gap: 38px; align-items: start; }
.results-plot { min-width: 0; }
.plot-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 12px; }
.plot-heading h2 { font-size: 19px; font-weight: 500; margin: 0 0 5px; line-height: 1.35; }
.plot-heading p { font-size: 12px; color: var(--text-muted); margin: 0; }
.plot-instruction { max-width: 19ch; text-align: right; font-size: 12px; color: var(--text-muted); }
.chart-axis { display: flex; justify-content: space-between; padding: 0 45px 0 40px; font-size: 12px; color: var(--text-muted); margin-bottom: 4px; font-variant-numeric: tabular-nums; }
.result-chart { list-style: none; padding: 0; margin: 0; }
.chart-model { position: relative; display: grid; grid-template-columns: 24px minmax(0,1fr) auto 20px; align-items: center; gap: 4px 12px; width: 100%; padding: 14px 12px 13px 4px; min-height: 76px; border: 0; background: transparent; color: var(--text-primary); text-align: left; cursor: pointer; border-radius: 8px; font: inherit; }
.chart-rank { grid-row: 1 / 3; text-align: center; font-size: 12px; color: var(--text-muted); }
.chart-model-name { font-size: 13px; overflow-wrap: anywhere; }
.chart-model-name small { font-size: 12px; display: block; margin-top: 2px; color: var(--text-muted); }
.chart-model b { font-size: 16px; font-weight: 500; font-variant-numeric: tabular-nums; }
.chart-track { grid-column: 2 / 4; height: 7px; position: relative; background: var(--chart-track); border-radius: 2px; overflow: clip; }
.chart-fill { display: block; width: 100%; height: 100%; background: var(--accent); transform-origin: left; }
.reference-fill { background: var(--text-muted); }
.chart-open { grid-row: 1 / 3; grid-column: 4; opacity: 0; transform: translateX(-4px); transition: opacity 180ms, transform 240ms cubic-bezier(.2,0,0,1); }
.chart-open svg, .show-models svg, .inspector-link svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.4; flex: none; }
.chart-model.is-inspected { background: var(--chart-selected); }
.chart-model.is-inspected .chart-open { opacity: 1; transform: none; }
.show-models { display: flex; justify-content: space-between; align-items: center; width: 100%; font: inherit; font-size: 12px; min-height: 48px; margin-top: 8px; padding: 12px 12px 12px 40px; border: 0; background: transparent; cursor: pointer; color: var(--text-primary); }
.plot-note { font-size: 12px; color: var(--text-muted); line-height: 1.7; max-width: 68ch; margin: 12px 0 0; }
.result-inspector { padding: 22px 24px; background: var(--surface-2); border-radius: 12px; min-width: 0; }
.inspector-identity { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; font-size: 12px; color: var(--text-secondary); }
.inspector-identity .provider-chip { background: transparent; padding: 0; font-size: 12px; border: 0; }
.result-inspector h3 { font-size: 20px; font-weight: 500; margin: 14px 0 18px; overflow-wrap: anywhere; line-height: 1.4; }
.inspector-score { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; }
.inspector-score > b { font-size: 32px; font-weight: 500; font-variant-numeric: tabular-nums; letter-spacing: -.025em; }
.inspector-score > span { font-size: 12px; color: var(--text-secondary); line-height: 1.7; }
.inspector-score small { display: block; font-size: 12px; }
.people-strip { display: flex; gap: 2px; height: 12px; overflow: clip; border-radius: 3px; margin-bottom: 14px; }
.outcome-segment { flex-basis: 0; min-width: 0; }
.evacuated { background: var(--outcome-safe); }
.deaths { background: var(--outcome-death); }
.stranded { background: var(--outcome-stranded); }
.unavoidable { background: var(--outcome-unavoidable); }
.people-legend { display: grid; gap: 7px; margin: 0; font-size: 12px; }
.people-legend > div { display: flex; justify-content: space-between; gap: 12px; }
.people-legend dt { display: flex; align-items: center; gap: 8px; color: var(--text-secondary); }
.people-legend dt i { width: 6px; height: 6px; border-radius: 1px; }
.people-legend dd { font-variant-numeric: tabular-nums; margin: 0; }
.readout-note, .scenario-readout { font-size: 12px; color: var(--text-muted); line-height: 1.7; margin: 13px 0 0; }
.scenario-readout a { color: var(--text-secondary); text-decoration: underline; text-underline-offset: 3px; }
.inspector-link { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 44px; font-size: 12px; color: var(--text-primary); text-decoration: none; margin-top: 6px; }
.quick-compare { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--border); }
.quick-compare > label { display: block; font-size: 12px; color: var(--text-secondary); margin-bottom: 7px; }
.quick-compare select { width: 100%; font-size: 12px; min-height: 44px; background-color: var(--surface-1); }
.quick-comparison { margin-top: 17px; }
.quick-comparison > div { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 5px 12px; font-size: 12px; margin-bottom: 10px; }
.quick-comparison > div > span { overflow-wrap: anywhere; }
.quick-comparison b { font-weight: 500; font-variant-numeric: tabular-nums; }
.mini-score-track { grid-column: 1 / -1; height: 5px; background: var(--chart-track); overflow: clip; }
.mini-score-track > span { display: block; height: 100%; width: 100%; background: var(--accent); transform-origin: left; }
.quick-comparison > div:nth-child(2) .mini-score-track > span { background: var(--text-muted); }
.quick-comparison p { margin: 14px 0 2px; font-size: 12px; line-height: 1.7; color: var(--text-muted); }
.explorer-foot { margin-top: 24px; }
.explorer-foot > .snapshot-limit { max-width: 100ch; font-size: 12px; color: var(--text-secondary); line-height: 1.8; }
.result-inspector:focus-within { outline: none; }
.profile-readout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:50px; }
.profile-readout h2, .comparison-readout h2 { margin:0 0 10px; }
.readout-intro { font-size:12px; color:var(--text-secondary); line-height:1.7; margin:0 0 25px; max-width:60ch; }
.profile-readout .people-strip, .comparison-readout .people-strip { height:18px; margin-bottom:20px; }
.profile-readout .people-legend, .comparison-readout .people-legend { gap:13px; font-size:13px; }
.profile-key-facts { margin-block:24px; }
body[data-page='model'] main.container { padding-top:32px; }
.profile-head .score-hero { display:flex; flex-direction:column; align-items:flex-end; gap:7px; width:100%; }
.profile-head .score-hero strong { font-size:84px; }
.profile-head .breadcrumb { display:inline-flex; align-items:center; min-height:44px; margin:-12px 0 0; }
.profile-head .profile-meta { margin-top:12px; }
.profile-head .toolbar { margin-top:16px; }
.scenario-score-list { padding:0; margin:0; list-style:none; }
.scenario-score-list a { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px 16px; min-height:52px; padding-block:8px; font-size:12px; color:var(--text-primary); text-decoration:none; }
.scenario-score-list b { font-variant-numeric:tabular-nums; font-weight:500; }
.scenario-score-track { grid-column:1 / -1; display:block; height:5px; background:var(--chart-track); }
.scenario-score-track i { display:block; height:100%; width:100%; transform-origin:left; background:var(--accent); }
.comparison-people { display:grid; grid-template-columns:repeat(var(--comparison-count),minmax(0,1fr)); gap:30px; }
.comparison-people h3 { font-size:15px; font-weight:500; overflow-wrap:anywhere; margin:0 0 24px; }
body[data-page='compare'] main.container { padding-top:28px; }
body[data-page='compare'] .editorial-head { display:flex; flex-direction:row; justify-content:space-between; align-items:end; text-align:left; gap:24px; margin-bottom:16px; }
body[data-page='compare'] .editorial-head h1 { font-size:var(--title-size); line-height:1.1; max-width:none; margin:0; }
body[data-page='compare'] .editorial-head p { font-size:var(--lede-size); margin-top:12px; }
body[data-page='compare'] .editorial-aside { min-width:auto; }
.comparison-controls { padding:0; }
.comparison-selection { margin-bottom:8px; }
.comparison-selection h2 { margin:0; font-size:14px; }
.comparison-controls .compare-picker { grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto; }
.comparison-controls .field { font-size:12px; }
.comparison-controls .optional-models { grid-column:auto; }
.comparison-controls .optional-models[open] { grid-column:1 / -1; }
.comparison-controls .note { margin-block:8px 0; }
#comparison-content > .compare-grid { padding:12px 0 0; gap:26px; }
.compare-grid .compare-card { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:14px; padding:10px 0; }
.compare-card .compare-kind { margin-bottom:5px; font-size:12px; }
.compare-card h2 { font-size:16px; min-height:0; margin:0 0 5px; line-height:1.4; }
.compare-card .muted { font-size:12px; }
.compare-score { text-align:right; }
.compare-score .metric-value { font-size:30px; font-weight:500; line-height:1.2; font-family:var(--font-body); font-variant-numeric:tabular-nums; }
.compare-score .metric-note { display:block; font-size:12px; margin-top:5px; }
#comparison-content .evidence-workspace { margin-top:8px; }
#comparison-content .workspace-tabs { margin-bottom:12px; }
.comparison-readout .readout-intro { margin-bottom:16px; }
.comparison-people h3 { margin-bottom:12px; }
@media (hover:hover) and (pointer:fine) {
  .chart-model { transition: background-color 180ms; }
  .chart-model:hover { background: var(--chart-selected); }
  .chart-model:hover .chart-open { opacity: 1; transform: none; }
  .inspector-link:hover, .show-models:hover { text-decoration: underline; text-underline-offset: 4px; }
  .scenario-score-list a:hover > span:first-child { text-decoration:underline; text-underline-offset:4px; }
}
@media (max-width:1000px) {
  .results-reading { gap: 24px; grid-template-columns: minmax(0,1fr) minmax(260px,.8fr); }
  .result-inspector { padding: 20px; }
  .plot-instruction { display: none; }
  .benchmark-heading { display: block; }
  .benchmark-heading .benchmark-scope { text-align: left; margin-top: 16px; }
  .comparison-people { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .explorer-search { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
}
@media (max-width:700px) {
  body[data-page='leaderboard'] main.container { padding-top: 22px; }
  .benchmark-heading { margin-bottom: 22px; }
  .benchmark-heading > div > p { font-size: 13px; max-width: 33ch; }
  .benchmark-heading .benchmark-scope { font-size: 12px; margin-top: 14px; }
  .leaderboard-workspace { padding: 12px 0 20px; background: transparent; }
  .explorer-intro { margin-bottom: 15px; }
  .explorer-intro > p { font-size: 15px; }
  .display-switch { gap: 12px; }
  .display-switch button { font-size: 12px; }
  .explorer-search { display: block; }
  .explorer-search label { font-size: 12px; }
  .explorer-search .search-field input, .quick-compare select { font-size: 16px; }
  .explorer-views { margin: 0 0 4px; gap: 10px; }
  .display-switch { justify-content: flex-end; }
  .metric-views { gap: 0; justify-content: space-between; }
  .metric-views button { padding: 8px 10px; font-size: 12px; }
  .results-reading { display: block; }
  .plot-heading { margin-top: 22px; margin-bottom: 12px; flex-direction:column; align-items:start; gap:8px; }
  .plot-heading h2 { font-size: 18px; }
  .plot-instruction { display: block; font-size: 12px; max-width: none; text-align:left; }
  .chart-model { padding-right: 4px; min-height: 76px; column-gap: 8px; }
  .chart-model-name { font-size: 12px; }
  .chart-model b { font-size: 15px; }
  .result-inspector { margin: 8px 0 18px 0; padding: 22px 20px; }
  .plot-note { padding-inline: 4px; }
  .quick-compare { margin-top: 12px; padding-top: 12px; }
  .profile-readout { grid-template-columns:1fr; gap:34px; }
  .comparison-people { grid-template-columns:1fr; gap:30px; }
  body[data-page='compare'] .editorial-head { display:block; margin-bottom:24px; }
  body[data-page='compare'] .editorial-aside { display:none; }
  .comparison-controls .compare-picker { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .comparison-controls .optional-models { grid-column:1 / -1; }
  #comparison-content > .compare-grid { grid-template-columns:1fr; gap:0; }
  .compare-card h2 { font-size:14px; }
  .profile-head .score-hero { flex-direction:row; align-items:baseline; gap:12px; }
  .profile-key-facts { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; padding:18px 14px; }
  .profile-key-facts .metric-value { font-size:20px; }
  /* Phones: 12px minimum for notes, 16px selects so iOS does not zoom on focus. */
  .comparison-controls .field, .readout-note, .scenario-readout, .explorer-foot > .snapshot-limit, .quick-comparison p, .compare-card .compare-kind, .compare-card .muted, .compare-score .metric-note, .chart-model-name small { font-size:12px; }
  .comparison-controls select { font-size:16px; }
}
@media (prefers-reduced-motion:reduce) {
  .chart-open, .chart-model { transition: none; transform: none; }
}
/* Compare revision (30 October 2026): Sarvam-style surfaces. One white picker card, one card per model with its
   series dot (the same colours as the component bars), a quiet segmented control, and the evidence in hairline cards (disclosure cards: experience.css). Scoped to the Compare page. */
body[data-page='compare'] .editorial-aside .quiet-link { min-height:44px; margin:0; padding:0 18px; gap:8px; border:1px solid var(--border); border-radius:var(--radius-control); background:var(--surface-1); color:var(--text-primary); font-size:13px; }
body[data-page='compare'] .editorial-aside .quiet-link::after { content:''; width:16px; height:16px; background:currentColor; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat; transition:transform var(--duration-quick) var(--ease-out); }
body[data-page='compare'] .comparison-controls { padding:14px 20px 12px; background:var(--surface-1); border:1px solid var(--border); border-radius:20px; box-shadow:0 1px 2px #39291f0a; }
body[data-page='compare'] .comparison-controls .compare-picker { grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto; gap:16px; align-items:end; }
body[data-page='compare'] .comparison-controls .field { gap:8px; font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--text-muted); }
body[data-page='compare'] .comparison-controls select { min-height:44px; padding-inline:14px 36px; border-radius:12px; font-size:15px; font-weight:500; letter-spacing:normal; text-transform:none; color:var(--text-primary); }
body[data-page='compare'] .optional-models { margin:0; padding:0; border:0; }
body[data-page='compare'] .optional-models > summary { gap:8px; min-height:44px; padding:0 20px; font-size:13px; font-weight:500; color:var(--text-primary); }
body[data-page='compare'] .optional-models > summary::-webkit-details-marker { display:none; }
body[data-page='compare'] .optional-models > summary::before { content:'+'; font-size:17px; line-height:1; }
body[data-page='compare'] .optional-models[open] > summary::before { content:'−'; }
body[data-page='compare'] .comparison-controls > .note { margin:10px 0 0; padding:0; font-size:12px; color:var(--text-secondary); }
/* Open picker: four equal columns (two-up below 1280px, where long names would be cut). The optional pair sits in a nested grid with the same gap, so
   all four selects share one column width. The toggle hides once open; a slot is cleared by choosing "Choose a model". */
body[data-page='compare'] .compare-picker:has(.optional-models[open]) { grid-template-columns:repeat(4,minmax(0,1fr)); }
body[data-page='compare'] .comparison-controls .optional-models[open] { grid-column:3 / -1; }
body[data-page='compare'] .optional-models[open] > summary { display:none; }
body[data-page='compare'] .optional-model-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:0; padding:0; }
@media (max-width:1279px) {
  body[data-page='compare'] .compare-picker:has(.optional-models[open]) { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body[data-page='compare'] .comparison-controls .optional-models[open] { grid-column:1 / -1; }
}
/* Model cards (benchmark-site pattern). Narrow cards (three or four across): identity on top, one hairline, then the
   score row; row 1 takes the spare height, so hairlines and scores line up across cards when a long name wraps.
   Cards 400px and wider (two across): one compact row, identity left and score right. The card is its own size
   container, so its grid tracks stay fixed and the container queries only move the two children. */
body[data-page='compare'] #comparison-content > .compare-grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr)); gap:12px; padding:12px 0 0; }
body[data-page='compare'] .compare-grid .compare-card { --card-series:var(--accent); container-type:inline-size; display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-rows:1fr auto; align-items:stretch; gap:0 24px; padding:16px 20px; background:var(--surface-1); border:1px solid var(--border); border-radius:18px; box-shadow:0 1px 2px #39291f0a; }
body[data-page='compare'] .compare-card.series-card-1 { --card-series:var(--series-1); }
body[data-page='compare'] .compare-card.series-card-2 { --card-series:var(--series-3); }
body[data-page='compare'] .compare-card.series-card-3 { --card-series:var(--ref-bar); }
body[data-page='compare'] .compare-card > div:first-child { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:8px 12px; }
body[data-page='compare'] .compare-card .compare-kind { display:flex; align-items:center; gap:8px; min-width:0; margin:0; font-size:12px; font-weight:600; letter-spacing:.1em; line-height:1.3; text-transform:uppercase; color:var(--text-muted); }
body[data-page='compare'] .compare-card .compare-kind::before { content:''; flex:none; width:8px; height:8px; border-radius:50%; background:var(--card-series); }
body[data-page='compare'] .compare-card h2 { grid-column:1 / -1; margin:0; font-size:18px; font-weight:600; line-height:1.35; }
body[data-page='compare'] .compare-card .compare-rank { grid-row:1; grid-column:2; padding:3px 10px; border-radius:var(--radius-control); background:var(--surface-2); font-size:12px; line-height:1.4; white-space:nowrap; font-variant-numeric:tabular-nums; color:var(--text-secondary); }
body[data-page='compare'] .compare-score { grid-column:1 / -1; grid-row:2; display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:6px 16px; padding-top:14px; }
body[data-page='compare'] .compare-card > div:first-child { grid-column:1 / -1; grid-row:1; align-content:start; padding-bottom:14px; border-bottom:1px solid var(--grid); }
body[data-page='compare'] .compare-score .metric-value { font-size:28px; line-height:1; letter-spacing:-.01em; }
body[data-page='compare'] .compare-score .metric-note { display:flex; flex-direction:column; margin:0; font-size:12px; line-height:1.5; text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; color:var(--text-muted); }
@container (min-width:400px) {
  body[data-page='compare'] .compare-card > div:first-child { grid-column:1; grid-row:1 / -1; align-self:center; grid-template-columns:auto auto; justify-content:start; padding:0; border:0; }
  body[data-page='compare'] .compare-score { grid-column:2; grid-row:1 / -1; align-self:center; flex-direction:row-reverse; flex-wrap:nowrap; align-items:center; padding:0; }
}
/* Very narrow cards (four across on a laptop): rank under the name and the note under the score, so nothing wraps
   unevenly and the scores stay on one line across cards. */
@container (max-width:320px) {
  body[data-page='compare'] .compare-card > div:first-child { display:flex; flex-direction:column; align-items:flex-start; gap:8px; }
  body[data-page='compare'] .compare-score { flex-direction:column; align-items:flex-start; }
  body[data-page='compare'] .compare-score .metric-note { text-align:left; }
}
body[data-page='compare'] #comparison-content > .empty { margin-top:12px; border-radius:18px; }
body[data-page='compare'] #comparison-content .workspace-panel { padding-top:0; }
body[data-page='compare'] #comparison-content .workspace-tabs { margin:16px 0 10px; padding:4px; border:1px solid var(--border); }
body[data-page='compare'] .workspace-tabs [aria-selected='true'] { box-shadow:0 1px 2px #39291f14, 0 0 0 1px var(--border); }
body[data-page='compare'] .comparison-readout, body[data-page='compare'] .workspace-panel > section.panel { margin:0 0 12px; padding:28px; background:var(--surface-1); border:1px solid var(--border); border-radius:20px; box-shadow:0 1px 2px #39291f0a; }
body[data-page='compare'] .comparison-readout { padding:20px 24px; }
body[data-page='compare'] .comparison-readout h2 { margin:0 0 6px; font-size:20px; }
body[data-page='compare'] .comparison-readout .readout-intro { margin-bottom:12px; }
body[data-page='compare'] .comparison-people { gap:16px; }
body[data-page='compare'] .comparison-people > section { min-width:0; padding:12px 16px 14px; background:var(--surface-0); border:1px solid var(--grid); border-radius:14px; }
body[data-page='compare'] .comparison-people h3 { margin-bottom:10px; }
body[data-page='compare'] .readout-note { margin-bottom:0; }
@media (hover:hover) and (pointer:fine) {
  body[data-page='compare'] .editorial-aside .quiet-link:hover { text-decoration:none; background:var(--surface-2); }
  body[data-page='compare'] .editorial-aside .quiet-link:hover::after { transform:translateX(3px); }
  body[data-page='compare'] .optional-models > summary:hover { background:var(--accent-soft); }
}
@media (max-width:700px) {
  body[data-page='compare'] .comparison-controls { padding:16px; border-radius:18px; }
  body[data-page='compare'] .comparison-controls .compare-picker, body[data-page='compare'] .compare-picker:has(.optional-models[open]), body[data-page='compare'] .optional-model-fields { grid-template-columns:minmax(0,1fr); gap:14px; }
  body[data-page='compare'] .comparison-controls select { font-size:16px; }
  body[data-page='compare'] .optional-models > summary { display:flex; justify-content:center; }
  body[data-page='compare'] #comparison-content > .compare-grid { gap:12px; }
  /* Phones: one compact row per model — identity left, score right — so four models fit on about one screen. */
  body[data-page='compare'] #comparison-content > .compare-grid { gap:8px; }
  body[data-page='compare'] .compare-grid .compare-card { align-items:center; gap:0 12px; padding:14px 16px; border-radius:var(--radius-surface); }
  body[data-page='compare'] .compare-card > div:first-child { grid-column:1; grid-row:1 / -1; display:flex; flex-direction:column; align-items:flex-start; gap:6px; padding:0; border:0; }
  body[data-page='compare'] .compare-card h2 { font-size:16px; }
  body[data-page='compare'] .compare-card .compare-rank { padding:2px 8px; }
  body[data-page='compare'] .compare-score { grid-column:2; grid-row:1 / -1; flex-direction:column; align-items:flex-end; gap:4px; padding:0; }
  body[data-page='compare'] .compare-score .metric-value { font-size:24px; }
  body[data-page='compare'] .compare-score .metric-note { font-size:12px; line-height:1.4; text-align:right; }
  body[data-page='compare'] .comparison-readout, body[data-page='compare'] .workspace-panel > section.panel { padding:20px 18px; border-radius:18px; }
}
@media (prefers-reduced-motion:reduce) {
  body[data-page='compare'] .editorial-aside .quiet-link::after { transition:none; }
}
/* Compare keeps figures modest, even when only two models fill the row. */
body[data-page='compare'] .metrics .metric-value { font-size:20px; }
body[data-page='compare'] .compare-card h2 { font-size:16px; }

/* Private-set model details: setup and every published measure. */
.private-inspector .detail-group{margin:0;}
.private-inspector h4{margin:0 0 4px;font-size:13px;font-weight:600;letter-spacing:.01em;color:var(--text-primary);}
.private-inspector .detail-note{margin:0 0 6px;font-size:12px;line-height:1.5;color:var(--text-secondary);}
.private-inspector .inspector-facts{margin:8px 0 0;}
.private-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:28px 40px;margin-top:8px;}
.selected-evidence .result-inspector.private-inspector{grid-template-columns:minmax(0,1fr);}
.selected-evidence .result-inspector.private-inspector > *{grid-column:1;grid-row:auto;}
.selected-evidence .private-inspector .private-details{padding-top:24px;border-top:1px solid var(--border);}
/* Compare: the best value in each row is bold. */
.compare-table td{font-variant-numeric:tabular-nums;}
.compare-best{font-weight:700;color:var(--text-primary);}
.compare-legend{margin:18px 0 0;}
.private-inspector{scroll-margin-top:calc(var(--header-height,72px) + 16px);}
.selected-evidence .private-inspector .inspector-link{max-width:360px;}
.compare-table{table-layout:fixed;width:100%;}
.compare-table th:first-child,.compare-table td:first-child{width:34%;}
/* Phones: each measure becomes a short block of "model: value" lines, so nothing scrolls sideways. */
@media(max-width:700px){
  .compare-wrap{overflow:visible;}
  .compare-table,.compare-table tbody,.compare-table tr,.compare-table td{display:block;width:100%;min-width:0;}
  .compare-table thead,.compare-table thead tr,.compare-table thead th{position:absolute;display:block;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
  .compare-table tr{padding:12px 14px;border-bottom:1px solid var(--grid);}
  .compare-table tr:last-child{border-bottom:0;}
  .compare-table th:first-child,.compare-table td:first-child{width:100%;}
  .compare-table td{border:0;padding:3px 0;}
  .compare-table td:first-child{padding:0 0 6px;font-weight:500;color:var(--text-primary);}
  .compare-table td[data-label]{display:flex;justify-content:space-between;align-items:baseline;gap:16px;text-align:right;}
  .compare-table td[data-label]::before{content:attr(data-label);min-width:0;text-align:left;font-weight:400;color:var(--text-secondary);overflow-wrap:anywhere;}
}

/* Previous / next model: a full-size way to reach each model when phone chart columns are narrow. */
.private-profile { max-width: 760px; margin: 24px 0 64px; }
.private-profile .result-inspector h3 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
