html { scroll-behavior: smooth; }
h2[id], article[id] { scroll-margin-top: 32px; }
.content { width: calc(100% - 48px); max-width: 1040px; padding-inline: 0; }
.hero { max-width: 1120px; padding: 56px 24px 40px; }
.abstract > p { max-width: 1000px; margin-inline: auto; text-align: left; }
.tldr > .summary-card { max-width: 920px; margin-inline: auto; }
.research-promise { max-width: 920px; margin: 0 auto 20px; font-weight: 800; letter-spacing: -.045em; line-height: 1.25; }
.summary-label { padding: 0; margin: 0 0 10px; border: 0; background: none; color: #706c65; font-size: 12px; font-weight: 650; letter-spacing: .06em; }
.tldr-summary + .tldr-summary { margin-top: 8px; }
.section-band { background: #fafaf9; padding-block: 64px; }
.section-band-light { background: #fff; }
.section-band.opening-band { padding-block: 0; }
.method-band, .results-band { padding-block: 40px; }
.section-band > .content { padding-block: 0; }
.opening-band > .tldr { padding-bottom: 30px; }
.introduction > .video-player, .method > figure { max-width: 1000px; margin-inline: auto; }
.introduction > .video-player { margin-top: 24px; }
.introduction > .paper-teaser { max-width: 1000px; margin: 28px auto 0; }
.paper-teaser > a { display: block; }
.results-section > #benchmark-results, .results-section > .charts-row { max-width: 960px; margin-inline: auto; }
.results-intro { max-width: 780px; margin-inline: auto; }
.tldr-summary, .abstract p, .method > p, .results-intro { font-size: 17px; line-height: 1.65; }
.method > h2 { margin-bottom: 16px; }
.method > p { max-width: 1000px; margin: 16px auto 0; }
.metric-cards { max-width: 920px; margin-inline: auto; }
.metric-cards { margin-bottom: 20px; }
.metric-card { padding: 16px 20px; }
.metric-card h3 { margin-bottom: 8px; }
.metric-card p { margin-top: 8px; }
.results-section > h2 { margin-bottom: 18px; }
.results-intro { margin-bottom: 18px; }
.metric-card p { font-size: 13px; }
.metric-card h3 { font-size: 14px; }
.table-scroll { max-width: 960px; margin-inline: auto; }
.results-table { font-size: 14px; }
.results-table thead th { font-size: 12px; }
.results-table th, .results-table td { padding: 11px 10px; }
.charts-row { gap: 24px; margin-top: 22px; }
.chart-description { min-height: 0; }
.chart-legend { min-height: 0; margin-block: 10px 4px; }
.result-caption { margin-top: 10px; }
.chart-description, .result-caption { font-size: 13px; }
.chart-legend { font-size: 12px; }
#scaling-panel .chart-legend { flex-wrap: nowrap; gap: 6px; font-size: 11px; }
#scaling-panel .chart-legend span { gap: 2px; white-space: nowrap; }
.experiment-chart { max-width: 420px; }
.trajectory-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding-inline: 12px; }
.trajectory-name { font-size: 13px; }
.trajectory-meta { font-size: 11px; }
@media (max-width: 1000px) {
  .trajectory-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); padding-inline: 8px; }
  #scaling-panel .chart-legend { flex-wrap: wrap; }
}
@media (max-width: 760px) {
  .content { width: calc(100% - 40px); }
  .section-band { padding-block: 40px; }
  .hero { padding: 36px 20px 32px; }
  .hero br { display: none; }
  .tldr-summary, .abstract p, .method > p, .results-intro { font-size: 16px; }
  .metric-cards, .charts-row { grid-template-columns: 1fr; }
  .metric-card { padding: 16px 18px; }
  .chart-panel { padding: 20px 16px; }
  .chart-description { min-height: 0; }
  .chart-legend { min-height: 0; margin-bottom: 12px; }
  .trajectory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding-inline: 2px; }
  .results-table { min-width: 800px; }
  .results-table th:first-child { position: sticky; left: 0; z-index: 1; background: #fff; box-shadow: 1px 0 #e7edf2; }
  .results-table thead th:first-child { background: #f7f9fc; }
  .table-scroll { position: relative; }
}
@media (max-width: 360px) {
  .trajectory-grid { grid-template-columns: 1fr; padding-inline: 0; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

.simulation-expand { display: block; margin: 24px auto 0; padding: 10px 24px; border: 1px solid #d9dedf; border-radius: 8px; background: #fff; color: #52616b; font: inherit; cursor: pointer; }
.simulation-expand:hover { background: #f1f3f4; }
.simulation-expand:focus-visible { outline: 2px solid #2878b5; outline-offset: 3px; }
.opening-band > .pipeline-section { padding-block: 12px 44px; }
.pipeline-section > h2 { margin-bottom: 10px; }
.pipeline-summary { margin-bottom: 10px; font-size: 16px; line-height: 1.55; }
.triplet-grid, .triplet-column-labels { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.triplet-panel { position: relative; min-width: 0; }
.triplet-video { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; border: 1px solid #dfe6e2; border-radius: 14px; background: #fff; }
.triplet-panel figcaption { margin-top: 8px; color: #52646d; font-size: 15px; font-weight: 600; line-height: 1.3; text-align: center; }
.triplet-panel:not(:last-child)::after { position: absolute; top: 46%; right: -22px; content: '→'; color: #658d9f; font-size: 19px; }
.pipeline-triplet { --triplet-gap: 24px; --triplet-arrow-width: 44px; }
.pipeline-triplet .triplet-grid { gap: var(--triplet-gap); }
.pipeline-triplet .triplet-panel::after { content: none; }
.pipeline-triplet .triplet-video { width: 94.4%; margin-inline: auto; }
.pipeline-triplet .triplet-panel figcaption { position: relative; margin: 0 0 14px; font-size: clamp(12px, 2.2vw, 20px); font-weight: 700; white-space: nowrap; }
.pipeline-triplet .triplet-panel:not(:last-child) figcaption::after { position: absolute; top: 50%; right: calc(var(--triplet-gap) / -2); transform: translate(50%, -50%); content: ''; width: var(--triplet-arrow-width); height: 10px; background: #658d9f; clip-path: polygon(0 40%, calc(100% - 7px) 40%, calc(100% - 7px) 0, 100% 50%, calc(100% - 7px) 100%, calc(100% - 7px) 60%, 0 60%); }
.motion-triplet + .motion-triplet { margin-top: 24px; }
.triplet-heading { margin-bottom: 9px; }
.triplet-heading h3 { margin: 0; font-size: 17px; font-weight: 600; line-height: 1.3; }
.realworld-summary { margin: -8px 0 16px; color: #657780; font-size: 14px; line-height: 1.5; }
#realworld-list[data-expanded="false"] > :nth-child(n+4) { display: none; }
.triplet-column-labels { margin-bottom: 14px; color: #52646d; font-size: 15px; font-weight: 600; line-height: 1.3; text-align: center; }
.realworld-section { --triplet-gap: 20px; max-width: 800px; }
.realworld-section .triplet-grid, .realworld-section .triplet-column-labels { gap: var(--triplet-gap); }
.realworld-section .motion-triplet { padding-bottom: 26px; }
.realworld-section .motion-triplet + .motion-triplet { margin-top: 0; }
.realworld-section .triplet-heading { margin-bottom: 8px; }
.realworld-section .triplet-heading h3 { font-size: 16px; }
.realworld-section .triplet-column-labels { margin-bottom: 12px; font-size: 14px; }
.realworld-section .triplet-video { border-radius: 12px; }
.realworld-section .triplet-panel:not(:last-child)::after { top: 50%; right: calc(var(--triplet-gap) / -2); transform: translate(50%, -50%); font-size: 16px; }
#expand-realworld { margin-top: 0; }
@media (max-width: 760px) {
  .opening-band > .pipeline-section { padding-block: 8px 32px; }
  .pipeline-summary { font-size: 14px; }
  .pipeline-triplet { --triplet-gap: 12px; --triplet-arrow-width: 20px; }
  .pipeline-triplet .triplet-panel figcaption { margin-bottom: 9px; }
  .triplet-grid, .triplet-column-labels { gap: 12px; }
  .triplet-panel:not(:last-child)::after { right: -12px; font-size: 12px; }
  .triplet-video { border-radius: 9px; }
  .triplet-panel figcaption, .triplet-column-labels { font-size: 12px; }
  .triplet-heading h3 { font-size: 15px; }
  .motion-triplet + .motion-triplet { margin-top: 18px; }
  .realworld-section { --triplet-gap: 12px; }
  .realworld-section .motion-triplet { padding-bottom: 20px; }
  .realworld-section .triplet-heading h3 { font-size: 15px; }
  .realworld-section .triplet-column-labels { font-size: 12px; }
  .realworld-section .triplet-video { border-radius: 9px; }
  .realworld-section .triplet-panel:not(:last-child)::after { font-size: 12px; }
}
.trajectory-grid[data-expanded="false"] > :nth-child(n+13) { display: none; }
@media (max-width: 1000px) {
  .trajectory-grid[data-expanded="false"] > :nth-child(n+10) { display: none; }
}
@media (max-width: 760px) {
  .trajectory-grid[data-expanded="false"] > :nth-child(n+7) { display: none; }
}
@media (max-width: 360px) {
  .trajectory-grid[data-expanded="false"] > :nth-child(n+4) { display: none; }
}
@media (max-width: 420px) {
  .pipeline-triplet { --triplet-arrow-width: 12px; }
  .pipeline-triplet .triplet-panel figcaption { display: flex; align-items: center; justify-content: center; min-height: 2.6em; white-space: normal; }
}