:root { --paper: #fff; }
.katex { text-align: initial; text-align-last: auto; }
figure { margin: 1.7rem 0 1.9rem; }
.panels { display: grid; gap: 0.65rem; align-items: center; }
.panels-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.panels a { display: block; min-width: 0; }
figure img { display: block; width: 100%; height: auto; background: white; }
.panels:has(img[src^="assets/llm-vs-video.svg"]),
.panels:has(img[src^="assets/self-forcing.svg"]) {
  width: 90%;
  margin-inline: auto;
}
figcaption { margin-top: 0.65rem; font: 13px/1.65 "Source Sans 3", "PingFang SC", system-ui, sans-serif; color: var(--muted); }
@media (max-width: 700px) {
  .panels-3 { grid-template-columns: 1fr; gap: 1rem; }
  .panels-3 img { max-width: 420px; margin-inline: auto; }
}

.katex-display > .katex > .katex-html {
  width: max-content;
  min-width: 100%;
  box-sizing: border-box;
  padding-right: 3em;
}

.subtitle { color: var(--muted); font-size: 1.12em; margin-bottom: 1.6rem; }
.horizon { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem; padding: 1.7rem; background: #f4f7f4; border-block: 1px solid #d5e0d8; text-align: center; }
.horizon div { display: grid; gap: .25rem; }
.horizon div span { color: var(--muted); font: 14px/1.5 "Source Sans 3", sans-serif; }
.horizon strong { font-size: clamp(26px, 4vw, 42px); color: var(--accent); }
.horizon-arrow { color: var(--accent); font-size: 26px; }
.horizon figcaption { grid-column: 1 / -1; }
.lineage-wrap { overflow-x: auto; margin: 1.8rem 0; }
.lineage { width: 100%; border-collapse: collapse; font-size: .88em; }
.lineage th, .lineage td { text-align: left; padding: .7rem .8rem; border-bottom: 1px solid var(--line); }
.lineage th { background: #f4f7f4; }
.memory-flow { padding: 1rem 1.2rem; background: #f4f7f4; text-align: center; }
.memory-flow p { margin: 0; text-align: center; }
.memory-flow span { color: var(--accent); padding-inline: .2rem; }
.result-links { font-size: .85em; }
@media (max-width: 700px) { .horizon { padding: 1rem .5rem; gap: .5rem; } .lineage { min-width: 460px; } }

.method-table-wrap { overflow-x: auto; margin: 1.8rem 0 .5rem; }
.method-table { width: 100%; min-width: 760px; border-collapse: collapse; font: 14px/1.65 "Source Sans 3", "PingFang SC", sans-serif; }
.method-table th, .method-table td { padding: .8rem .65rem; text-align: left; vertical-align: top; border-bottom: 1px solid #dce2dc; }
.method-table thead { background: #f1f5f1; }
.method-table th:first-child { width: 20%; }
.method-table td:nth-child(2) { width: 11%; white-space: nowrap; color: var(--muted); }
.method-table .our-method { background: #edf5ef; }
.table-note { font: 13px/1.6 "Source Sans 3", "PingFang SC", sans-serif; color: var(--muted); }
.roadmap { padding: .5rem; border: 1px solid #e2e8e2; border-radius: 8px; }

.memory-flow { display: block; }
.memory-flow-diagram { display: grid; grid-template-columns: max-content 1.8em max-content 1.8em max-content 1.8em max-content; width: max-content; max-width: 100%; margin: 0 auto; align-items: center; font: 400 15px/1.5 "Source Sans 3", "PingFang SC", system-ui, sans-serif; }
.memory-flow-diagram b { font-weight: normal; text-align: center; white-space: nowrap; }
.memory-flow-diagram .flow-forward { padding: 0; text-align: center; color: var(--accent); }
.flow-return { grid-column: 3 / 8; position: relative; height: 17px; margin: 7px 2em 0 3.5em; border: 1.5px dashed #52745b; border-top: 0; }
.flow-return::before { content: ""; position: absolute; left: -5.5px; top: -1px; border-inline: 5px solid transparent; border-bottom: 9px solid #52745b; }
.memory-flow figcaption { contain: inline-size; min-width: 0; grid-column: 1 / -1; float: none; width: auto; max-width: none; margin: .65rem 0 0; text-align: center; font-size: inherit; transform: none; }
.memory-flow figcaption span { padding: 0; color: var(--muted); font: 13px/1.6 "Source Sans 3", "PingFang SC", system-ui, sans-serif; }
html[lang="en"] .flow-return { margin-right: 3.75em; }
@media (max-width: 520px) {
  .memory-flow { padding: .9rem .85rem; }
  .memory-flow-diagram { font-size: 13px; grid-template-columns: min-content 1em min-content 1em min-content 1em min-content; }
  .memory-flow-diagram b { white-space: normal; word-break: keep-all; }
  .memory-flow figcaption span { font-size: 12.5px; }
  .flow-return { margin-left: 2em; }
  html[lang="en"] .flow-return { margin-right: 2.5em; }
}

/* Size the tall heatmap independently of its asset filename. */
.ltx-heatmap .panels {
  width: min(100%, 480px);
  box-sizing: border-box;
  margin-inline: auto;
}
.roadmap { width: 85%; margin-inline: auto; }
@media (max-width: 640px) {
  .panels:has(img[src^="assets/llm-vs-video.svg"]),
  .panels:has(img[src^="assets/self-forcing.svg"]),
  .roadmap { width: 100%; }
}

.closing-quote {
  margin: 2rem 0 2.4rem;
  padding: 1.3rem 1.5rem 1.2rem;
  border-left: 2px solid #8b9b8d;
  border-radius: 0 8px 8px 0;
  background: #f7f8f5;
}
.closing-quote .quote-original {
  margin: 0 0 1rem;
  font: italic 400 clamp(1.0625rem, 2.1vw, 1.1875rem)/1.7 "Iowan Old Style", Palatino, Georgia, serif;
  text-align: left;
  text-align-last: auto;
  text-justify: auto;
  line-break: auto;
  word-break: normal;
  overflow-wrap: break-word;
  hyphens: none;
  -webkit-hyphens: none;
}
.closing-quote footer {
  font: 13px/1.75 "PingFang SC", system-ui, sans-serif;
  color: var(--muted);
}
.quote-translation { margin-top: .9rem; }
.quote-translation summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 1px solid #d6ded4;
  border-radius: 999px;
  background: #fff;
  color: #405b49;
  font: 500 13px/1.4 "PingFang SC", system-ui, sans-serif;
  cursor: pointer;
  list-style: none;
}
.quote-translation summary::-webkit-details-marker { display: none; }
.quote-translation summary::marker { content: ""; }
.quote-translation summary:hover { background: #edf2eb; border-color: #9fac9c; }
.quote-translation summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.translation-icon { font-size: 13px; }
.quote-translation[open] summary { background: #edf2eb; border-color: #9fac9c; }
.quote-translation-content {
  margin-top: .9rem;
  padding-top: .85rem;
  border-top: 1px solid #e1e7dc;
}
.quote-translation-content p {
  margin: 0;
  font: 400 15.5px/1.85 "Songti SC", STSong, serif;
  text-align: left;
  text-align-last: auto;
}
html[lang="en"] .quote-translation-content p {
  font-family: "Iowan Old Style", Palatino, Georgia, serif;
  font-size: 17px;
}
@media (max-width: 500px) {
  .closing-quote { padding: 1rem; }
  .quote-translation summary { width: 34px; height: 34px; }
}

.byline .equal-contribution { font-size: 0.85em; }
