.overview {
  --forest: #175648;
  --serif: "STIX Two Text", "Iowan Old Style", Georgia, serif;
  --paper-tint: color-mix(in srgb, var(--surface-2) 76%, var(--aqua) 6%);
}
[data-theme="dark"] .overview { --forest: #a1dabd; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .overview { --forest: #a1dabd; }
}
.overview h1, .overview h2, .overview h3 { margin: 0; color: var(--ink); }
.overview .intro-grid { display: grid; grid-template-columns: 1.03fr 1fr; gap: clamp(32px,6vw,88px); align-items: center; padding: clamp(45px,6.5vw,88px) 0 46px; }
.intro-text h1 { font: 500 clamp(54px,5.1vw,74px)/.99 var(--serif); letter-spacing: -.057em; text-wrap: initial; }
.intro-text p { color: var(--ink-2); font-size: clamp(16px,1.35vw,19px); line-height: 1.58; margin: 23px 0 0; max-width: 49ch; }
.intro-actions, .paper-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 17px 25px; margin-top: 25px; }
.gp-primary, .gp-link { display: inline-flex; align-items: center; gap: 12px; font-size: 14px; font-weight: 620; }
.gp-primary { padding: 12px 19px; border-radius: 6px; background: var(--forest); color: var(--surface); }
.gp-primary:hover { text-decoration: none; filter: brightness(1.13); }
.gp-primary span, .gp-link span { font-size: 17px; }
.gp-link { color: var(--forest); }
.provenance-figure { min-width: 0; margin: 0; background: #143d34; color: #f5f6ea; border-radius: 10px; padding: clamp(22px,2.45vw,35px); }
.provenance-figure figcaption { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; margin: 0 0 18px; }
.provenance-figure .plot-heading h2 { font: 500 clamp(23px,2vw,29px)/1.1 var(--serif); letter-spacing: -.034em; color: #fffdf2; }
.plot-heading p { margin: 7px 0 0; color: #d1dfd0; font-size: 13px; line-height: 1.5; max-width: 52ch; }
.plot-switch { display: inline-flex; padding: 2px; border: 1px solid #648278; border-radius: 4px; }
.plot-switch button { background: transparent; color: #e0e8dd; font: 550 11px/1.3 var(--font); border: 0; border-radius: 2px; padding: 4px 11px; cursor: pointer; }
.plot-switch button[aria-pressed="true"] { background: #d8e9be; color: #153b32; }
.plot-switch button:focus-visible { outline: 2px solid #ffdd79; outline-offset: 2px; }
.plot-grid { display: grid; grid-template-columns: 67px minmax(65px,1fr) 46px; column-gap: 9px; row-gap: 8px; align-items: center; font-variant-numeric: tabular-nums; }
.axis-label, .axis-end, .plot-bin, .plot-value, .plot-ticks, .plot-source { font: 11px/1.4 var(--mono); }
.axis-label, .axis-end, .plot-ticks { color: #b8cfc3; font-size: 10px; }
.axis-label { grid-column: span 2; }
.axis-end, .plot-value { text-align: right; }
.plot-bin { white-space: nowrap; }
.plot-bar { display: block; background: repeating-linear-gradient(to right, #628176 0px, #628176 1px, transparent 1px, transparent var(--plot-step)); height: 17px; border-right: 1px solid #628176; }
.plot-bar i { display: block; height: 100%; min-width: 1px; background: #9fbb9b; border-radius: 0 1.5px 1.5px 0; }
.plot-bar i.peak { background: #d4ec99; }
.plot-ticks { grid-column: 2; display: flex; justify-content: space-between; margin: 0 -3px; }
.plot-source { display: flex; justify-content: space-between; gap: 8px; padding-top: 12px; margin-top: 15px; border-top: 1px solid #527064; color: #c6d9ca; font-size: 10px; }
.provenance-figure a { color: #e5f2b2; }
.scope-strip { display: grid; grid-template-columns: repeat(4,1fr); padding: 21px 0; margin: 0; border-block: 1px solid var(--line-2); }
.scope-strip div { display: flex; flex-direction: column-reverse; align-items: flex-start; justify-content: center; gap: 2px; padding-left: clamp(15px,3vw,45px); border-left: 1px solid var(--line-2); }
.scope-strip div:first-child { border: 0; padding-left: 0; }
.scope-strip dt { color: var(--ink-2); font-size: 12px; }
.scope-strip dd { margin: 0; color: var(--ink); font: 500 clamp(27px,3vw,42px)/1.08 var(--serif); letter-spacing: -.04em; font-variant-numeric: lining-nums tabular-nums; }
.overview-section { margin-top: clamp(42px,5vw,68px); }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 21px; }
.section-heading h2 { font: 500 clamp(30px,3.2vw,45px)/1.12 var(--serif); letter-spacing: -.045em; }
.section-heading p, .task-note { color: var(--ink-2); font-size: 15px; max-width: 66ch; }
.section-heading p { margin: 8px 0 0; }
.cohort-control { display: grid; gap: 4px; flex: none; }
.cohort-control label { font-size: 12px; color: var(--ink-2); }
.cohort-control select { background: var(--surface); border: 1px solid var(--line-2); color: var(--ink); font: 500 14px var(--font); border-radius: 5px; padding: 9px 12px; cursor: pointer; }
.ranking-scroll { overflow-x: auto; }
.overview-ranks { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.overview-ranks th, .overview-ranks td { text-align: left; border-bottom: 1px solid var(--line); padding: 13px 14px; }
.overview-ranks thead { background: var(--surface-2); }
.overview-ranks th { font-size: 12px; font-weight: 570; color: var(--ink-2); }
.overview-ranks td { font-size: 14px; }
.overview-ranks .position, .overview-ranks .interval, .overview-ranks .num { font-family: var(--mono); }
.overview-ranks .position { color: var(--ink-2); font-size: 12px; }
.overview-ranks .model { color: var(--ink); font-weight: 610; }
.overview-ranks .num { font-size: 16px; color: var(--forest); font-weight: 600; }
.overview-ranks .interval { color: var(--ink-2); font-size: 12px; white-space: nowrap; }
.overview-ranks th:nth-last-child(-n+2), .overview-ranks td:nth-last-child(-n+2) { text-align: right; }
.overview-ranks tbody tr:hover { background: var(--surface-2); }
.rank-summary, .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; padding: 0; margin: -1px; clip-path: inset(50%); white-space: nowrap; }
.ranking-foot { display: flex; justify-content: space-between; align-items: start; gap: 24px; margin-top: 13px; }
.ranking-foot p { max-width: 73ch; color: var(--ink-2); font-size: 12.5px; margin: 0; }
.ranking-foot .gp-link, .section-heading .gp-link { flex: none; }
.track-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
.track-pair article { padding: 22px 24px; border-top: 2px solid var(--forest); background: var(--paper-tint); }
.track-label, .paper-label { color: var(--forest); font: 600 12px/1.4 var(--mono); }
.track-pair h3 { font: 500 26px/1.15 var(--serif); margin: 10px 0; }
.track-pair p { color: var(--ink-2); max-width: 51ch; margin: 0 0 17px; }
.task-note { max-width: 94ch; margin-top: 16px; font-size: 14px; }
.paper-section { display: grid; grid-template-columns: 1fr 3fr; gap: 30px; border-top: 1px solid var(--line-2); margin-top: 54px; padding-top: 31px; scroll-margin-top: 125px; }
.paper-label span { display: block; margin-top: 5px; font: 13px/1.5 var(--font); color: var(--ink-2); }
.paper-section h2 { font: 500 clamp(24px,2.5vw,37px)/1.15 var(--serif); letter-spacing: -.035em; }
.paper-section p { color: var(--ink-2); }
.citation { margin: 18px 0 0; }
.citation summary { cursor: pointer; color: var(--forest); font-weight: 580; font-size: 14px; }
@media (max-width: 860px) {
  .intro-text h1 { font-size: clamp(45px,6.6vw,60px); }
  .overview .intro-grid { gap: 23px; }
  .overview-ranks th, .overview-ranks td { padding-inline: 9px; }
}
@media (max-width: 700px) {
  .overview .intro-grid { grid-template-columns: 1fr; padding: 32px 0 26px; }
  .intro-text h1 { max-width: 15ch; font-size: clamp(45px,8vw,57px); }
  .intro-text p { margin-top: 14px; }
  .intro-actions { margin-top: 17px; }
  .scope-strip { grid-template-columns: repeat(2,1fr); gap: 14px 0; }
  .scope-strip div:nth-child(odd) { padding-left: 0; border-left: none; }
  .section-heading, .ranking-foot { flex-wrap: wrap; gap: 12px; }
  .track-pair, .paper-section { grid-template-columns: 1fr; gap: 15px; }
  .track-pair article { padding: 17px; }
  .paper-label span { display: inline; margin-left: 12px; }
  .overview-ranks th:nth-child(3), .overview-ranks td:nth-child(3) { display: none; }
  .overview-ranks td { font-size: 13px; }
  .overview-ranks th, .overview-ranks td { padding: 10px 5px; }
}
