/* Editorial surfaces, scoped below the unchanged video cover and navigation. */
main {
  --blue: #2563eb;
  --copy: #172437;
  --copy-soft: #526176;
  --line: #dfe6ef;
}
main.page-container { width: 100%; max-width: none; padding: 0 !important; }
main > section {
  display: grid;
  grid-template-columns: minmax(0, 1fr) min(88%, 62.5rem) minmax(0, 1fr);
  row-gap: 0;
  padding-block: clamp(3.2rem, 6vw, 5rem);
  background: #fff;
}
main > section > * { grid-column: 2; min-width: 0; }
main > section + section { margin-top: 0 !important; border: 0; padding-block: clamp(3.2rem, 6vw, 5rem); }
#method, #applications { background: #f3f6fa; }
main section > div:first-child > h2, main section > h2 {
  font-size: clamp(1.65rem, 3.2vw, 2.15rem) !important;
  font-weight: 600;
  letter-spacing: -.04em;
}
main .section-intro { max-width: 72ch; }
main .section-intro.prose-intro { text-align: left !important; max-width: 72ch; }
#abstract > div:nth-child(2) > div { max-width: 76ch; padding: .5rem 0 0; }
#abstract p { line-height: 1.85; }
#abstract strong { color: #1d55b5; }
.subsection-heading { margin-bottom: .7rem; }
.section-index { background: #e7effc; border: 0; color: #245aba; }
.method-block, .experiment-block { margin-top: 3rem; }
.process-strip { background: transparent; border: 0; padding: .8rem 0; gap: 1.5rem; }
.process-strip li { border-left: 2px solid #bad0f0; padding-left: 1rem; }
.architecture-notes > article { border: 1px solid #dce5f0; border-radius: 1rem; background: #fff !important; padding: 1.4rem 1.15rem !important; box-shadow: 0 .25rem 1rem rgba(25,45,75,.045); }
.architecture-notes > article:hover { transform: none; border-color: #c5d6ef; box-shadow: 0 .25rem 1rem rgba(25,45,75,.045); }
#action-injection > figure { border: 0; padding: 1.1rem; box-shadow: 0 .7rem 2.2rem #1b355e0a !important; }
.method-efficiency { border: 1px solid #dce6f2; background: #e9f0f9; padding: 1.6rem; }
.render-pipeline { gap: .7rem; background: transparent; padding: .7rem; }
.render-pipeline > article { border-radius: .65rem; background: #f8fafc !important; }
#rendering > div:nth-child(2) { box-shadow: 0 .6rem 1.8rem #1b355e08 !important; border: 0; }
.ablation-summary article { background: transparent; border: 0; border-top: 1px solid var(--line); border-radius: 0; padding-inline: .7rem; }
.benchmark-highlights { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-top: 1.4rem; }
.benchmark-highlight { padding: 1.25rem; border-radius: .8rem; background: #f1f6fe; }
.benchmark-highlight h4 { color: #334969; font-weight: 600; }
.benchmark-highlight strong { display: block; margin: .55rem 0; color: #245aba; font: 500 clamp(1.5rem, 3vw, 2rem) "Space Grotesk", sans-serif; letter-spacing: -.04em; }
.benchmark-highlight strong small { font: 500 .729167rem Inter, sans-serif; letter-spacing: 0; }
.benchmark-highlight p { color: #526176; font-size: .729167rem; line-height: 1.55; }
.benchmark-highlight .benchmark-baseline { margin-top: .45rem; font-size: .677083rem; }
.results-table-wrap { isolation: isolate; border-color: #e2e8f0; box-shadow: 0 .6rem 2rem #142f5205; }
.results-table th, .results-table td { border-bottom-color: #edf1f6; }
.results-table th[scope="row"], .results-table thead th:first-child { position: sticky; left: 0; z-index: 1; background: #fff; box-shadow: 1px 0 #e2e8f0; }
.results-table thead th:first-child { background: #f6f8fb; }
.results-table .ours-row, .results-table .ours-row th[scope="row"] { background: #e9f2ff; color: #174ea6; }
.results-table .ours-row th[scope="row"] { box-shadow: inset 3px 0 #2563eb, 1px 0 #d9e5f5; }
.application-tabs { gap: .3rem; padding: .3rem; border: 1px solid #dfe6ef; border-radius: .85rem; background: #e9eef5; }
.application-tabs .app-tab { border: 0; background: transparent; box-shadow: none; }
.application-tabs .app-tab[aria-selected="true"] { background: #fff; box-shadow: 0 .2rem .6rem #233f6210; }
.application-panel { background: #fff; border: 0; box-shadow: 0 .8rem 2.8rem #19365c0a; }
.application-copy { background: #fff; border-left-color: #edf1f6; }
#application-title { font-size: 1.2rem !important; }
.application-result { border-left: 3px solid #2563eb; border-radius: 0 .5rem .5rem 0; }

/* Dark theater; preserve the actual pixels of all scientific media. */
#ood-cases {
  --surface: #111e2e;
  --surface-raised: #182a3e;
  --copy: #f1f5fb;
  --copy-soft: #b8c7da;
  --copy-muted: #9aacc3;
  --line: #2a3b51;
  --line-strong: #435a76;
  --blue: #94bdff;
  --cyan: #68e1ce;
  color: var(--copy);
  background: #0b1420;
  color-scheme: dark;
}
#ood-cases > .ood-tabs { background: #101e2e; border-color: #2a3b51; padding: .4rem; margin-top: 1.8rem; }
#ood-cases .ood-tabs .tab { border-radius: .55rem; }
#ood-cases .ood-tabs .tab[aria-selected="true"] { background: #75e4d4 !important; color: #092c32 !important; }
#ood-cases .tab:not(.bg-ink):hover { background: #20354e; color: #fff; }
#ood-cases .bg-zinc-50, #ood-cases .bg-zinc-100 { background: #142338 !important; }
#ood-cases .bg-zinc-200 { background: #2a3b51 !important; }
#ood-cases .text-zinc-400 { color: #9aacc3 !important; }
#ood-cases .text-act { color: #f3b17c !important; }
#ood-cases .border-zinc-900 { border-color: #5d7799; }
#ood-cases button:not(.tab):not([aria-selected="true"]):hover { background: #20354e; }
#ood-cases [role="tablist"] button[aria-selected="true"]:not(.tab) { background: #294763; border-color: #587899; }
#ood-cases .reverse-stage [data-reverse-phase].is-idle { opacity: 1; }
#ood-cases .reverse-stage [data-reverse-phase].is-idle > p { opacity: .55; }
#ood-cases .reverse-stage [data-reverse-phase]:not(.is-idle) > p { text-decoration: underline; text-underline-offset: .35em; }
#ood-cases .overview-scroll { scrollbar-width: thin; }
#ood-cases .overview-scroll::-webkit-scrollbar { display: block; height: 5px; }
#ood-cases .overview-scroll::-webkit-scrollbar-thumb { background: #49607b; border-radius: 5px; }
#ood-cases .demo-context { font-size: .729167rem; line-height: 1.75; }
#ood-cases .panel > article { border: 1px solid #2a3b51; box-shadow: 0 1rem 3rem #0002 !important; }
#ood-cases .panel article article, #ood-cases video { box-shadow: none; }
#ood-cases .panel .paper-figure { background: #fff; border: 0; color-scheme: light; }
#ood-cases .paper-figure .paper-note { color: #526176; }
#ood-cases .overview-scroll { scrollbar-color: #49607b #111e2e; }
#ood-cases .panel .border-zinc-200 .border-zinc-200 { border-color: transparent !important; }
.future-directions article { background: transparent; border-radius: 0; border-top: 1px solid #dfe6ef; }
#contributors { background: #f6f8fb; }
#contributors > div { background: transparent !important; }
#bibtex { background: #111c2b !important; color: #d9e7f5; border: 0; }

/* Deliberate, quiet interaction feedback. */
.tab, .app-tab { transition: background-color .18s ease, color .18s ease, box-shadow .18s ease; }
.panel:not(.hidden) { animation: panel-enter .22s ease both; }
@keyframes panel-enter { from { opacity: .55; } to { opacity: 1; } }
@media (max-width: 900px) {
  #reverse-stage { min-width: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
  main > section { grid-template-columns: minmax(0, 1fr) 92% minmax(0, 1fr); padding-block: 3rem; }
  main > section + section { padding-block: 3rem; }
  .benchmark-highlights { gap: .6rem; }
  .benchmark-highlight { padding: .85rem; }
  .benchmark-highlight h4 { font-size: .729167rem !important; }
  .benchmark-highlight strong { font-size: 1.4rem; }
}
@media (max-width: 540px) {
  .benchmark-highlights { grid-template-columns: 1fr; }
  .benchmark-highlight { display: grid; grid-template-columns: 1fr auto; gap: .25rem .8rem; align-items: center; }
  .benchmark-highlight strong { grid-column: 2; grid-row: 1 / 3; margin: 0; }
  .benchmark-highlight .benchmark-baseline { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) {
  .panel:not(.hidden) { animation: none; }
  .tab, .app-tab { transition: none; }
}

/* Appearance rollouts share the OOD theater, with the original at the center. */
/* Keep the two object rollouts compact and centered. */
#object-gallery { width: min(100%, 900px); margin-inline: auto; }

#scene-gallery { width: min(100%, 840px, calc(120svh - 300px)); margin: 0 auto 2rem; background: var(--surface); border-radius: .75rem; overflow: hidden; }
.scene-gallery-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 10px 14px; border-bottom: 1px solid var(--line); }
#scene-gallery .scene-gallery-heading h3 { font-size: .875rem !important; margin: 0; text-align: left; }
.scene-gallery-heading > span { font-size: .729167rem; color: var(--copy-muted); }
.scene-reference { width: calc((100% - 40px) / 3); margin: 10px auto; padding: 0; }
.scene-video-card { margin: 0; min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: .65rem; background: var(--surface-raised); }
.scene-video-card figcaption { display: flex; justify-content: space-between; align-items: center; gap: .5rem; padding: 5px 8px; font-size: .729167rem; color: var(--copy); }
.scene-video-card figcaption span:last-child { color: var(--copy-muted); font-size: .625rem; }
.scene-video-card video { display: block; width: 100%; height: auto; aspect-ratio: 348 / 260; background: #000; }
.scene-examples-heading { margin: 0 12px; padding: 7px 0; border-top: 1px solid var(--line); color: var(--cyan); font-size: .729167rem; }
.scene-examples { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 0 12px 12px; }
@media (max-width: 700px) {
 #scene-gallery { width: 100%; }
 .scene-reference { width: min(55%, 260px); }
 .scene-examples { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; padding: 0 .6rem .6rem; }
 .scene-video-card figcaption { padding: .5rem; }
 .scene-examples .scene-video-card figcaption span:last-child { display: none; }
}

.scene-reference .scene-video-card video { aspect-ratio: 4 / 3; }

.scene-set-tabs { display: flex; gap: 6px; overflow-x: auto; padding: 8px 12px; border-bottom: 1px solid var(--line); }
.scene-set-tab { flex-shrink: 0; border: 1px solid transparent; border-radius: 999px; padding: 5px 12px; color: var(--copy-muted); font-size: .729167rem; }
#scene-gallery .scene-set-tab[aria-selected="true"] { background: #294763; color: var(--copy); border-color: #587899; }
.scene-set-tab:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
.scene-set-panel .scene-examples { padding-top: 2px; }

.data-column-chart { display: block; width: 100%; height: auto; overflow: visible; }
.data-column-chart text { fill: #697586; font: 13px Inter, system-ui, sans-serif; }
.data-column-chart .column-value { fill: #25354a; font-weight: 600; }
.data-column-chart .column-budget { fill: #34465f; font-weight: 500; }
.data-column-chart .column-legend text { fill: #526176; }

.data-column-bar { transform-box: fill-box; transform-origin: center bottom; animation: data-column-grow .7s ease-out both; }
@keyframes data-column-grow { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@media (prefers-reduced-motion: reduce) { .data-column-bar { animation: none; } }

@media (min-width: 1100px) {
 .render-pipeline { grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(88px, .38fr); }
}
.render-pipeline .gripper-legend { display: flex; flex-direction: column; justify-content: center; }
.render-pipeline .gripper-legend h4 { text-align: left; }
.render-pipeline .gripper-legend .h-3 { flex-shrink: 0; width: 1.3rem; }

.render-pipeline > .gripper-legend { padding: .65rem; }
.render-pipeline .gripper-legend > p { font-size: .7rem; line-height: 1.4; }
.render-pipeline .gripper-legend > div { margin-top: .7rem; }
.render-pipeline .gripper-legend > div > div { gap: .45rem; }
.render-pipeline .gripper-legend > div > div + div { margin-top: .55rem; }
.render-pipeline .gripper-legend .h-3 { width: .85rem; height: .4rem; }
.render-pipeline .gripper-legend .font-medium { font-size: .7rem; }

.render-pipeline > .gripper-legend { padding: .45rem; }
.render-pipeline .gripper-legend > div { margin-top: 0; }
.render-pipeline .gripper-legend > div > div { flex-direction: column; gap: .2rem; text-align: center; }
.render-pipeline .gripper-legend > div > div + div { margin-top: .65rem; }
.render-pipeline .gripper-legend .h-3 { width: 1.35rem; }

.render-pipeline .gripper-legend > .gripper-state-title { margin: 0 0 .6rem; text-align: center; font-weight: 500; }

#overview-second-row { grid-column: 1 / -1; }
#overview-second-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; }

#scene-gallery .scene-video-card figcaption { --scene-label-color: var(--cyan); }
#scene-gallery .scene-reference figcaption { --scene-label-color: var(--blue); }
#scene-gallery .scene-video-card figcaption span { color: var(--scene-label-color); }
#scene-gallery .scene-video-card figcaption span:first-child { display: inline-flex; align-items: center; gap: .4rem; }
#scene-gallery .scene-video-card figcaption span:first-child::before { content: ""; width: .3rem; height: .3rem; flex-shrink: 0; border-radius: 50%; background: var(--scene-label-color); }

#scene-gallery .scene-examples figcaption { background: rgba(104, 225, 206, .09); border-bottom: 1px solid rgba(104, 225, 206, .2); }

/* Six equally sized tiles, matching the viewpoint comparison layout. */
#scene-gallery { width: 100%; }
.scene-set-panel:not(.hidden) { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 12px; }
#scene-gallery .scene-reference, #scene-gallery .scene-examples { display: contents; }
#scene-gallery .scene-video-card { margin: 0; min-width: 0; }
#scene-gallery .scene-video-card video { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }