/* Copper-Policy project page
   Layout: single column, print-friendly academic page.
   Rule of thumb: content first, chrome last. */

:root{
  color-scheme:light;
  --bg:#ffffff;
  --bg-soft:#f6f7f9;
  --ink:#0f1720;
  --body:#414d59;
  --muted:#78838f;
  --line:#e4e8ed;
  --line-strong:#c9d2da;
  --accent:#b4623c;
  --accent-soft:#fdf3ee;
  --accent-deep:#9a5030;   /* accent dark enough for text (AA at any size) */
  --brand:#123f3b;
  --brand-dark:#0c2e2b;
  --maxw:1120px;
  --narrow:680px;
  --radius:8px;
  /* Material elevation scale. Every level stacks the same three shadows: a tight,
     comparatively opaque key that cuts the edge, a mid penumbra, and a wide
     low-opacity ambient. Blur grows and opacity falls outward, which is what makes
     a shadow read as a raised surface rather than as a glow. Levels are assigned by
     how far the element sits above the page — images, then cards, then the headline
     strip. */
  --e1: 0 1px 2px -1px rgba(15,23,42,.16), 0 2px 4px 0 rgba(15,23,42,.09), 0 1px 8px 0 rgba(15,23,42,.06);
  --e2: 0 2px 4px -1px rgba(15,23,42,.18), 0 4px 8px 0 rgba(15,23,42,.10), 0 1px 12px 0 rgba(15,23,42,.07);
  --e3: 0 3px 5px -1px rgba(15,23,42,.22), 0 6px 10px 0 rgba(15,23,42,.13), 0 1px 18px 0 rgba(15,23,42,.10);
}

*{box-sizing:border-box}

html{
  scroll-behavior:smooth;
  scroll-padding-top:72px;
}

body{
  margin:0;
  background:var(--bg);
  color:var(--body);
  font-family:"Inter","Helvetica Neue",Arial,sans-serif;
  font-size:16px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0;color:var(--ink);line-height:1.25;font-weight:650;letter-spacing:-.015em}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
strong{color:var(--ink);font-weight:650}
em{font-style:italic}
sup{font-size:.68em;line-height:0}

.wrap{width:min(var(--maxw),calc(100% - 48px));margin-inline:auto}
.wrap--narrow{width:min(var(--narrow),calc(100% - 48px));margin-inline:auto}

/* ---------- top bar ---------- */

.topbar{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.88);
  backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid var(--line);
}
.topbar-inner{
  width:min(var(--maxw),calc(100% - 48px));
  margin-inline:auto;
  height:58px;
  display:flex;align-items:center;gap:24px;
}
.brand{
  display:flex;flex-direction:row;align-items:center;gap:9px;
  /* never compressed and never wrapped: as a plain inline <a> this used to
     shrink below its content width and drop the label under the mark */
  flex:0 0 auto;
  font-family:"Space Grotesk",sans-serif;
  font-weight:700;font-size:15px;letter-spacing:-.02em;
  color:var(--ink);white-space:nowrap;
}
.brand-logo{display:block;width:26px;height:26px;flex:0 0 26px;object-fit:contain;cursor:pointer}
.brand span{flex:0 0 auto}
.topnav{display:flex;gap:22px;margin-left:auto}
.topnav a{position:relative;font-size:13.5px;color:var(--muted);padding:4px 0;transition:color .2s}
.topnav a::after{
  content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;border-radius:2px;
  background:var(--accent);transform:scaleX(0);transform-origin:center;
  transition:transform .2s ease;
}
.topnav a:hover{color:var(--ink)}
.topnav a:hover::after{transform:scaleX(.35)}
.topnav a.is-current{color:var(--accent)}
.topnav a.is-current::after{transform:scaleX(1)}
.topbar .pdf-link{
  font-size:13px;font-weight:600;color:var(--brand);
  border:1px solid var(--line-strong);border-radius:999px;
  padding:6px 14px;white-space:nowrap;flex:0 0 auto;
}
.topbar .pdf-link:hover{border-color:var(--brand);background:var(--brand);color:#fff}

/* Dark mode lives in one override block at the foot of this file; the toggle
   only carries its own structural styles here. The moon shows in the light
   theme (the action is "go dark") and the sun in the dark theme. */
.theme-toggle{
  display:grid;place-items:center;flex:0 0 auto;
  width:34px;height:34px;
  border:1px solid var(--line-strong);border-radius:999px;
  background:#fff;color:var(--ink);cursor:pointer;
  transition:background .2s,border-color .2s,color .2s,transform .2s;
}
.theme-toggle svg{width:17px;height:17px;display:block}
/* the `.theme-toggle svg` rule above outranks a bare `.theme-toggle__sun`, so the
   hide rule has to match its specificity or the sun shows up next to the moon */
.theme-toggle .theme-toggle__sun{display:none}
.theme-toggle:hover{border-color:var(--brand);color:var(--brand);transform:translateY(-1px)}
.theme-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media (prefers-reduced-motion:reduce){.theme-toggle{transition:none}.theme-toggle:hover{transform:none}}

/* Resting transform-origin for the logos. The click animation overrides this per
   stage — impact stages anchor at `50% 100%` so the mark compresses onto its base,
   stage 4 anchors at the centre because it swells rather than gets struck — but
   keeping the centre here means the logos are not offset at rest, and it is the
   pivot any non-animated transform would use. */
.brand-logo,.wordmark-logo{transform-origin:50% 50%}

/* ---------- hero ---------- */

.hero{padding:64px 0 44px;text-align:center;border-bottom:1px solid var(--line)}
.venue{
  display:inline-block;
  font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--accent);
  background:var(--accent-soft);
  border:1px solid #f0dbd0;
  border-radius:999px;padding:4px 13px;margin-bottom:22px;
}
.wordmark{
  display:flex;align-items:center;justify-content:center;gap:.28em;
  flex-wrap:wrap;                 /* on a very narrow phone the mark drops above the word */
  font-family:"Space Grotesk",sans-serif;
  font-size:clamp(34px,5.4vw,52px);
  font-weight:700;letter-spacing:-.045em;
  margin-bottom:12px;
}
/* sized in em so it tracks the clamp() above without extra media queries. The PNG
   carries transparent padding top and bottom, so the visible mark is ~78% of the
   box — hence a shade over 1em rather than exactly matching the cap height. */
.wordmark-logo{width:1.05em;height:1.05em;flex:none;object-fit:contain;cursor:pointer}
.paper-title{
  font-size:clamp(18px,2.5vw,25px);
  font-weight:500;color:var(--ink);
  line-height:1.4;letter-spacing:-.02em;
  max-width:760px;margin:0 auto 26px;
}
.authors{font-size:15px;color:var(--ink);line-height:2;margin-bottom:6px}
.authors span{white-space:nowrap;display:inline-block;margin:0 7px}
.authors a{color:inherit;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.authors a:hover{color:var(--accent);border-bottom-color:var(--accent)}
.authors-break{display:block}
.affiliations{font-size:13.5px;color:var(--muted);line-height:1.9;margin-bottom:28px}
.affiliations span{display:inline-block;margin:0 8px;white-space:nowrap}
.affiliations a{color:inherit;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.affiliations a:hover{color:var(--accent);border-bottom-color:var(--accent)}
.info-tip{position:relative;outline:none}
.info-tip::after{
  content:attr(data-tooltip);position:absolute;z-index:100;left:50%;bottom:calc(100% + 8px);
  transform:translate(-50%,4px);padding:5px 9px;border-radius:5px;
  background:#17212b;color:#fff;font:500 12px/1.35 "Inter","Helvetica Neue",Arial,sans-serif;
  white-space:nowrap;opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .14s ease,transform .14s ease,visibility .14s;
}
.info-tip:hover::after,.info-tip:focus::after{
  opacity:1;visibility:visible;transform:translate(-50%,0);
}
.corresponding-marker{color:var(--accent);font-size:.8em;margin-left:2px}

/* The hero line. Was a left-aligned aside with the results list tacked on;
   now it is the paper's one-sentence claim, centred and in the brand colour. */
.punchline{
  max-width:860px;margin:0 auto 30px;
  padding:18px 26px;
  border:1px solid #f0dbd0;
  background:var(--accent-soft);
  border-radius:8px;
  font-family:"Space Grotesk",sans-serif;
  font-size:clamp(16px,2.1vw,21px);
  font-weight:700;letter-spacing:-.02em;line-height:1.45;
  color:var(--accent-deep);
  text-align:center;
  box-shadow:var(--e2);
}

.actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.btn{
  display:inline-flex;align-items:center;gap:8px;
  font:600 14px/1.4 "Inter",sans-serif;
  padding:10px 18px;border-radius:999px;
  border:1px solid var(--line-strong);
  color:var(--ink);background:#fff;
  transition:background .2s,border-color .2s,color .2s,box-shadow .2s,transform .2s;
  box-shadow:var(--e1);
}
.btn svg{width:17px;height:17px;flex:none}
.btn:hover{border-color:var(--brand);background:var(--brand);color:#fff;box-shadow:var(--e2);transform:translateY(-3px)}
.btn--arxiv{color:#a71919;background:#fff4f3;border-color:#e9c7c4}
.btn--arxiv:hover{color:#fff;background:#b31b1b;border-color:#b31b1b}
.btn--github{color:#24292f;background:#f4f5f6;border-color:#cfd4d9}
.btn--github:hover{color:#fff;background:#24292f;border-color:#24292f}
.btn--bibtex{color:#8a6100;background:#fffbea;border-color:#f0d98a}
.btn--bibtex:hover{color:#3d2c00;background:#f7d774;border-color:#e5bc3f}
.btn--pending{cursor:default}
.btn--copy{cursor:pointer}
.btn--copy-check{display:none}
.btn--copy.is-copied{
  border-color:#1c7a53;background:#1c7a53;color:#fff;
  box-shadow:0 4px 12px rgba(28,122,83,.2);
}
.btn--copy.is-copied .btn--copy-icon{display:none}
.btn--copy.is-copied .btn--copy-check{display:block}
.btn:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.btn--primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn--primary:hover{background:var(--brand-dark);border-color:var(--brand-dark);color:#fff}
@media (prefers-reduced-motion:reduce){.btn{transition:none}}
@media (prefers-reduced-motion:reduce){.topnav a,.topnav a::after{transition:none}}

/* ---------- sections ---------- */

.section{padding:64px 0;border-bottom:1px solid var(--line)}
.section--soft{background:var(--bg-soft)}
.section-head{max-width:700px;margin:0 auto 30px;text-align:center}
.section-head .kicker{
  display:block;
  font-family:"Space Grotesk",sans-serif;
  font-size:11.5px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--accent);
  margin-bottom:8px;
}
.section-head h2{font-size:clamp(23px,3vw,30px)}
.section-head p.lede{margin:10px auto 0;max-width:640px;font-size:15.5px;color:var(--body)}
.section-head--center{text-align:center;margin-inline:auto}
.section-head--center p.lede{margin-inline:auto}
#analysis .section-head{max-width:100%}
@media(min-width:900px){#analysis .section-head h2{white-space:nowrap}}

/* ---------- figures ---------- */

figure{margin:0}
.figure{margin-inline:auto;max-width:940px}
.figure--tight{max-width:860px}
.figure img{
  width:100%;border:1px solid var(--line);border-radius:var(--radius);
  background:#fff;box-shadow:var(--e1);
}
figcaption{
  font-size:12.5px;line-height:1.6;color:var(--muted);
  max-width:72ch;margin:12px auto 0;text-align:left;
}
figcaption b{color:var(--ink);font-weight:600}

/* Line-art figures (charts, architecture diagrams) are detected at runtime and
   tagged; they invert in dark mode. Photos keep their own colours. The
   transition is declared here so both the light→dark and dark→light flip ease. */
img[data-theme-invert="true"]{transition:filter .25s ease}
@media (prefers-reduced-motion:reduce){img[data-theme-invert="true"]{transition:none}}

/* Method variants share one PDF crop, so every diagram and mask stays aligned. */
.method-switcher__buttons{
  position:relative;left:50%;transform:translateX(-50%);
  display:flex;flex-wrap:nowrap;justify-content:safe center;gap:8px;
  width:100vw;max-width:100vw;overflow-x:auto;
  padding:0 20px 8px;margin:0 0 18px;
}
.method-switcher__button{
  font:600 12.5px/1.35 "Inter",sans-serif;color:var(--body);
  background:#fff;border:1px solid var(--line-strong);border-radius:999px;
  flex:none;white-space:nowrap;padding:8px 13px;cursor:pointer;
  transition:background .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.method-switcher__button:hover{color:var(--brand);border-color:var(--brand)}
.method-switcher__button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.method-switcher__button.is-active{
  color:#fff;background:var(--brand);border-color:var(--brand);
  box-shadow:0 2px 7px rgba(18,63,59,.17);
}
.method-switcher__button[data-method-variant="0"]{
  color:var(--accent-deep);background:var(--accent-soft);border-color:var(--accent);
}
.method-switcher__button[data-method-variant="0"].is-active{
  color:#fff;background:var(--accent);border-color:var(--accent);
  box-shadow:0 2px 7px rgba(180,98,60,.2);
}
.method-section .wrap{width:min(1120px,calc(100% - 48px))}
.method-switcher__content{
  --leader-width:0px;
  display:grid;grid-template-columns:var(--leader-width) 38px minmax(0,1fr);
  gap:0;align-items:center;
  transition:grid-template-columns .35s ease;
}
.method-switcher__content.is-dragging{transition:none}
.method-switcher__figure{grid-column:3;width:100%;max-width:1050px;min-width:0;margin-inline:auto}
.method-switcher__images{display:grid;aspect-ratio:1900/746}
.method-switcher__images img{
  grid-area:1/1;width:100%;height:100%;object-fit:contain;display:block;
  opacity:0;pointer-events:none;z-index:0;
  transition:opacity .35s ease;
}
.method-switcher__images img.is-outgoing{opacity:1;z-index:1}
.method-switcher__images img.is-active{opacity:1;z-index:2}
.method-switcher__caption{
  max-width:100%;margin:17px auto 0;font-size:12.5px;line-height:1.6;color:var(--muted);
  text-align:center;white-space:nowrap;
}
@media(max-width:850px){.method-switcher__caption{white-space:normal}}
.method-ablation__drawer{grid-column:1;grid-row:1;width:100%;min-width:0;overflow:hidden}
.method-ablation{
  width:450px;min-width:450px;padding:9px 10px 7px;border:1px solid var(--line);
  border-radius:var(--radius);background:#fff;box-shadow:var(--e1);
  display:flex;flex-direction:column;
}
.method-ablation__handle{
  grid-column:2;grid-row:1;justify-self:start;align-self:center;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;
  width:38px;min-height:150px;padding:11px 5px;
  border:1px solid var(--line-strong);border-radius:0 8px 8px 0;
  background:#fff;color:var(--brand);box-shadow:var(--e1);
  font:600 11px/1.15 "Inter",sans-serif;cursor:grab;touch-action:none;
  user-select:none;-webkit-user-select:none;
}
.method-ablation__handle *{cursor:inherit;user-select:none;-webkit-user-select:none}
.method-switcher__content.is-dragging .method-ablation__handle,
.method-switcher__content.is-dragging .method-ablation__handle *{cursor:grabbing}
.method-ablation__handle span:last-child{writing-mode:vertical-rl;white-space:nowrap}
.method-ablation__handle-icon{font-size:20px;line-height:1;transition:transform .25s ease}
.method-switcher__content.is-open .method-ablation__handle-icon{transform:rotate(180deg)}
.method-ablation__handle:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.method-ablation h3{font-size:13px;line-height:1.25;margin:0 0 5px 4px}
.method-ablation__scroll{width:100%;flex:1;min-height:0;overflow-x:auto;padding-inline:6px}
.method-ablation__table{
  width:100%;height:100%;border-collapse:separate;border-spacing:0 2px;
  table-layout:fixed;font-size:10.5px;font-variant-numeric:tabular-nums;
}
.method-ablation__table th:first-child{width:31%;text-align:left}
.method-ablation__table th:not(:first-child),.method-ablation__table td{text-align:center}
.method-ablation__table thead th{
  padding:0 4px 3px;color:var(--muted);font-size:9.5px;font-weight:600;
  line-height:1.25;white-space:nowrap;
}
.method-ablation__table tbody tr{
  height:var(--method-row-height,auto);transform:translateY(0);transition:transform .28s ease,filter .28s ease;
  cursor:pointer;
}
.method-ablation__table tbody tr:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.method-ablation__table tbody tr:not(.is-active):hover th,
.method-ablation__table tbody tr:not(.is-active):hover td{background:#edf1f3}
.method-ablation__table tbody th,.method-ablation__table tbody td{
  padding:3px 4px;background:#f7f8fa;border-top:1px solid transparent;
  border-bottom:1px solid transparent;line-height:1.18;vertical-align:middle;
}
.method-ablation__table tbody th{
  font-weight:600;color:var(--body);border-radius:5px 0 0 5px;
  border-left:1px solid transparent;
}
.method-ablation__table tbody th.ablation-label{font-size:10px;font-weight:500;color:var(--muted)}
.method-ablation__table tbody td{font-weight:600;color:var(--ink)}
.method-ablation__table tbody td b{font-weight:800}
.method-ablation__table tbody td u{text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:2px}
.method-ablation__table tbody td:last-child{border-radius:0 5px 5px 0;border-right:1px solid transparent}
.method-ablation__table tbody tr.is-active{
  transform:translateY(-3px);filter:drop-shadow(0 3px 5px rgba(15,23,42,.16));
}
.method-ablation__table tbody tr.is-active th,
.method-ablation__table tbody tr.is-active td{
  background:var(--accent-soft);border-top-color:#e8c5b4;border-bottom-color:#e8c5b4;
  color:var(--accent-deep);
}
.method-ablation__table tbody tr.is-active th{border-left-color:#e8c5b4}
.method-ablation__table tbody tr.is-active td:last-child{border-right-color:#e8c5b4}
@media (max-width:1150px){
  .method-switcher__content{display:flex;flex-direction:column;align-items:center}
  .method-switcher__figure{order:0;width:min(820px,calc(100% - 32px));margin-inline:auto}
  .method-ablation__handle{
    order:1;flex-direction:row;width:auto;min-height:0;margin-top:14px;padding:8px 14px;
    border-radius:999px;
  }
  .method-ablation__handle span:last-child{writing-mode:horizontal-tb}
  .method-ablation__drawer{
    order:2;width:min(100%,760px);max-height:var(--leader-width);transition:max-height .35s ease;
  }
  .method-switcher__content.is-open .method-ablation__drawer{margin-top:12px}
  .method-switcher__content.is-dragging .method-ablation__drawer{transition:none}
  .method-ablation{width:100%;min-width:0;height:auto!important}
  .method-ablation__table{height:auto;min-width:700px;border-spacing:0 5px;font-size:11px}
  .method-ablation__table th:first-child{width:38%}
  .method-ablation__table tbody tr{height:auto}
  .method-ablation__table tbody th,.method-ablation__table tbody td{padding:10px 5px;line-height:1.3}
  .method-ablation__table tbody th{white-space:nowrap}
}
@media (max-width:560px){
  .method-section .wrap{width:calc(100% - 32px)}
}
@media (prefers-reduced-motion:reduce){
  .method-switcher__button,.method-switcher__images img,.method-ablation__table tbody tr,
  .method-switcher__content,.method-ablation__drawer,.method-ablation__handle-icon{transition:none}
}

/* ---------- stat strip ---------- */

.stats{
  display:grid;grid-template-columns:repeat(6,1fr);
  gap:1px;background:var(--line);
  border:1px solid rgba(15,23,42,.10);
  border-radius:8px;
  overflow:hidden;margin-bottom:42px;
  /* highest level on the page: this is the headline number row */
  box-shadow:var(--e3);
}
/* Flat surface. Material does not gradient or bevel its cards — all the depth is
   in the shadow, so the fill stays a single value. */
.stat{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#fff;padding:20px 12px;text-align:center}
.stat .label{
  font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
  color:var(--muted);margin-bottom:8px;
}
.stat .value{
  font-family:"Space Grotesk",sans-serif;
  font-size:22px;font-weight:700;letter-spacing:-.03em;color:var(--ink);
  line-height:1.1;
}
.stat .value small{font-size:.55em;font-weight:600;color:var(--muted);margin-left:2px}
/* The pair inherits .stat .value's size so its digits land on the same line as
   every other card, and `small` picks up the same 0.55em percent sign. Six equal
   columns leave ~165 px of content, which two four-digit values plus their percent
   signs fill in ~153 px — see the 22px on .stat .value below. */
.stat .value--pair{display:flex;justify-content:center;gap:10px}
.stat .value--pair>span{display:flex;flex-direction:column;line-height:1.1}
.stat .value--pair b{font-weight:700}
.stat .value--pair i{
  font-style:normal;font-family:"Inter",sans-serif;
  font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);margin-top:4px;
}
.stat .note{font-size:12px;color:var(--muted);line-height:1.5;margin-top:6px}
.stat--accent .value{color:var(--accent)}
/* flat tint, same surface treatment — Material tints a surface rather than
   beveling it */
.stat--accent{background:var(--accent-soft)}

/* ---------- tables ---------- */

.table-block{margin-top:34px}
.table-block:first-child{margin-top:0}
.table-block h3{
  font-size:17px;font-weight:650;max-width:70ch;margin:0 auto 6px;text-align:center;
}
.table-block .table-note{
  font-size:13.5px;color:var(--muted);margin:0 auto 14px;max-width:70ch;text-align:center;
}
/* Booktabs-style tables. Sized to their content, not stretched to the column
   width — a table that fills the row leaves the eye to travel across empty
   space and separates headers from the values beneath them. */
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
table.data{
  border-collapse:collapse;
  width:auto;min-width:0;
  margin-inline:auto;          /* sit centred in the column, not jammed left */
  font-size:13px;font-variant-numeric:tabular-nums;
  background:transparent;
}
table.data th,table.data td{
  padding:8px 13px;text-align:center;white-space:nowrap;
  border:0;border-bottom:1px solid var(--line);
}
/* first column only, kept left-aligned: centring method names would make both
   edges of the label column ragged. Scoped to `thead tr:first-child`, not plain
   `th:first-child`, which would also hit the first cell of the second header row —
   where a rowspan heading occupies that slot — and left-align a sub-header. */
table.data thead tr:first-child th:first-child,
table.data tbody td:first-child{
  text-align:left;white-space:normal;min-width:190px;
  padding-left:0;
}
/* every other column keeps symmetric padding, so centred cells sit centred */
table.data thead th{
  font-size:11.5px;font-weight:600;color:var(--ink);
  letter-spacing:.02em;
  border-top:1.5px solid var(--line-strong);
  border-bottom:1px solid var(--line-strong);
  padding-top:9px;padding-bottom:9px;
}
/* a group heading spans its columns, so centre it over them */
table.data thead th[colspan]{text-align:center}
/* LIBERO-Plus splits into two kinds of stress test. Camera / Robot / Light /
   Noise are the closed-loop execution shifts the World representation is meant
   to absorb; Language / Background / Layout test broader scene generalisation.
   Marking the first four keeps that split readable without another rule. */
table.data thead th.hl{
  font-weight:700;text-decoration:underline;
  text-underline-offset:3px;text-decoration-thickness:1px;
}
/* second header row must not double the rule already under the first */
table.data thead tr + tr th{border-top:0}
/* Short rules keep benchmark groups and task columns visually separate. */
table.data thead tr:first-child th{position:relative;border-bottom:0}
table.data thead tr:first-child th::after{
  content:"";position:absolute;left:7px;right:7px;bottom:0;
  border-bottom:2px solid var(--line-strong);
}
table.data tbody tr:last-child td{border-bottom:1.5px solid var(--line-strong)}
table.data tr.ours td{background:var(--accent-soft)}
table.data tr.ours td:first-child{font-weight:650;color:var(--ink)}
table.data td.ablation-label{font-size:12px;font-weight:500;color:var(--muted)}
@media (hover:hover){
  table.data tbody tr:not(.group):hover td{background:#eef2f5;transition:background .12s ease}
  table.data tbody tr.ours:hover td{background:#f5e3da}
}
table.data td.best,table.data th.best{font-weight:700;color:var(--ink)}
table.data td.second{text-decoration:underline;text-underline-offset:3px}
table.data .ctr,table.data th.ctr{text-align:center}
table.data tr.group td{
  background:transparent;font-size:11.5px;font-weight:600;letter-spacing:.05em;
  text-transform:uppercase;color:var(--muted);
  text-align:left;padding:15px 0 6px;border-bottom:1px solid var(--line);
}
table.data tr.group:first-child td{padding-top:6px}
table.data .mark{color:var(--accent)}
table.data .dim{color:var(--muted)}

/* thirteen-column benchmark table: tighter so it still leaves air on both sides */
table.data--wide{font-size:12px}
table.data--wide th,table.data--wide td{padding:7px 9px}
table.data--wide thead tr:first-child th:first-child,
table.data--wide tbody td:first-child{min-width:132px}
table.data--wide thead th{padding-top:8px;padding-bottom:8px}

.fold{
  margin-top:22px;
  border:1px solid var(--line);border-radius:var(--radius);
  background:#fff;
  box-shadow:var(--e1);
}
.fold>summary{
  cursor:pointer;list-style:none;
  padding:13px 16px;font-size:13.5px;font-weight:600;color:var(--brand);
  display:flex;align-items:center;gap:8px;
}
.fold>summary::-webkit-details-marker{display:none}
.fold>summary::before{
  content:"＋";font-weight:400;color:var(--accent);font-size:15px;
}
.fold[open]>summary::before{content:"－"}
.fold[open]>summary{border-bottom:1px solid var(--line)}
.fold .fold-body{padding:16px}
.representation-detail{display:grid;grid-template-columns:minmax(300px,38%) minmax(0,1fr);gap:10px;align-items:start}
.representation-detail__figure{display:flex;align-items:center;justify-content:flex-end;min-width:0;margin:0}
.representation-detail__figure img{width:auto;height:100%;max-width:100%;object-fit:contain}
.representation-detail__table{width:100%}
.representation-detail__table table.data{font-size:11px}
.representation-detail__table table.data th,.representation-detail__table table.data td{padding:7px 6px}
.representation-detail__table table.data td.ablation-label{font-size:10.5px}
.representation-detail__table table.data thead tr:first-child th:first-child,
.representation-detail__table table.data tbody td:first-child{min-width:155px}
@media(max-width:850px){.representation-detail{grid-template-columns:1fr}.representation-detail__figure{width:min(370px,100%);margin-inline:auto;justify-content:center}.representation-detail__figure img{width:100%;height:auto}}
.analysis-findings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0 0 16px}
.analysis-findings p{margin:0;padding:13px 16px;border:1px solid var(--line);border-radius:6px;background:var(--bg-soft);font-size:13px;line-height:1.55}
.analysis-findings strong{display:block;margin-bottom:6px;color:var(--accent-deep);font-size:16px;line-height:1.35}
.analysis-temporal{max-width:920px;margin:28px auto 0;padding-inline:24px}
.analysis-temporal img{width:100%;height:auto}
@media(max-width:850px){.analysis-findings{grid-template-columns:1fr}}
@media(max-width:700px){.analysis-temporal{overflow-x:auto;padding-inline:8px}.analysis-temporal img{min-width:800px}}
.table-caption{
  font-size:12.5px;line-height:1.6;color:var(--muted);
  max-width:78ch;margin:10px auto 0;
}

/* ---------- feature / point list ---------- */

.points{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}
.point{
  display:grid;grid-template-columns:28px minmax(0,1fr);grid-template-rows:auto 1fr;column-gap:10px;
  border:1px solid var(--line);border-radius:var(--radius);
  padding:20px;background:#fff;
  box-shadow:var(--e1);
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,background-color .2s ease;
}
.point:hover{
  transform:translateY(-5px);
  border-color:var(--accent);
  background:var(--accent-soft);
  box-shadow:var(--e2);
}
.point .idx{
  grid-column:1;grid-row:1;
  font-family:"Space Grotesk",sans-serif;
  font-size:11.5px;font-weight:700;letter-spacing:.1em;color:var(--accent);
}
.point h3{grid-column:2;grid-row:1;font-size:16px;margin:0;letter-spacing:-.01em}
.point p{grid-column:2;grid-row:2;align-self:center;font-size:13.5px;line-height:1.65;color:var(--body);margin:0}
@media (prefers-reduced-motion:reduce){.point{transition:none}.point:hover{transform:none}}


/* ---------- tabbed media box ---------- */

.mediabox{
  border:1px solid var(--line);border-radius:var(--radius);background:#fff;
  overflow:hidden;max-width:880px;margin-inline:auto;
  box-shadow:var(--e2);
}
.mediabox--wide{max-width:980px}
.showcase{border-bottom:1px solid var(--line)}
.showcase .section{border-bottom:0}
.demo-section{padding-top:36px;padding-bottom:22px}
.demo-section .mediabox--wide{max-width:780px}
.demo-section .tabpanel video{display:block;width:100%;height:auto;max-height:570px;aspect-ratio:16/9;object-fit:contain;background:#111}
.demo-section .vp-overlay{display:none}
.demo-section .tabpanel .mediacap{margin:0;padding:10px 14px}
#real .vp-overlay{display:none}
#real .mediacap{text-align:center}
#overview{padding-top:18px;padding-bottom:8px}
#overview .figure--tight{max-width:1040px}
#main-result{padding-top:10px;padding-bottom:50px}
#main-result .wrap{max-width:1040px}
#main-result .stats{margin-bottom:0}
#abstract{padding-top:48px;padding-bottom:48px}
#abstract .section-head{max-width:64ch;margin-bottom:18px;text-align:left}
.key-idea__summary{max-width:64ch;margin:0 auto 1em;text-align:left;text-wrap:pretty}
.tablist{
  display:flex;overflow-x:auto;background:var(--bg-soft);
  border-bottom:1px solid var(--line);scrollbar-width:none;
}
.tablist::-webkit-scrollbar{display:none}
.tablist button{
  appearance:none;border:0;background:none;cursor:pointer;
  font:inherit;font-size:13.5px;font-weight:600;color:var(--muted);
  padding:11px 16px;white-space:nowrap;border-right:1px solid var(--line);
  box-shadow:inset 0 -2px 0 transparent;
}
.tablist button:last-child{border-right:0}
.tablist button:hover{color:var(--ink)}
.tablist button[aria-selected="true"]{
  background:#fff;color:var(--ink);box-shadow:inset 0 -2px 0 var(--accent);
}
.tablist button .pill{
  display:inline-block;margin-left:7px;font-size:11px;font-weight:700;
  color:var(--accent);background:var(--accent-soft);border-radius:999px;padding:1px 7px;
}
.tabpanel{display:none;padding:14px}
.tabpanel.is-active{display:block}
/* attention pairs stack one per row so each strip is rendered as large as possible */

/* ---------- custom video player ---------- */

.vp{
  position:relative;background:#0b0f12;
  border:1px solid var(--line);border-radius:6px;overflow:hidden;
}
.vp-stage{position:relative;display:block}
.vp-clip{position:relative}
.vp-clip + .vp-clip{border-top:3px solid #fff}
/* RoboTwin strips are 1920x720 against the real-robot 1920x540, so capping the
   player at 3/4 width lands both pairs on the same rendered height. */
.vp--rtw{max-width:75%;margin-inline:auto}
.vp video{display:block;width:100%;height:auto;background:#0b0f12;cursor:pointer}
.vp-tag{
  position:absolute;top:8px;left:8px;
  font-size:11px;font-weight:600;letter-spacing:.03em;
  color:#fff;background:rgba(10,15,20,.62);
  border:1px solid rgba(255,255,255,.18);border-radius:4px;
  padding:2px 7px;pointer-events:none;
}
.vp-tag.is-ours{color:#ffd9c6;border-color:rgba(180,98,60,.6);background:rgba(70,32,16,.72)}
.vp-overlay{
  position:absolute;inset:0;display:grid;place-items:center;
  border:0;background:rgba(8,12,16,.24);color:#fff;cursor:pointer;
  opacity:0;transition:opacity .18s ease;padding:0;
}
.vp-overlay svg{width:52px;height:52px;fill:#fff;filter:drop-shadow(0 2px 8px rgba(0,0,0,.45))}
/* shown only while paused — never on hover over a playing clip */
.vp.is-paused .vp-overlay{opacity:1}

.vp-bar{
  display:flex;align-items:center;gap:10px;
  padding:7px 10px;background:#fff;border-top:1px solid var(--line);
}
.vp-btn{
  appearance:none;border:0;background:none;padding:0;cursor:pointer;
  width:26px;height:26px;flex:none;display:grid;place-items:center;
  color:var(--ink);border-radius:4px;
}
.vp-btn:hover{background:var(--bg-soft)}
.vp-btn svg{width:17px;height:17px;fill:currentColor}
/* play/pause glyph swap — scoped to both the overlay and the bar button */
.vp-icon .i-play,
.vp-overlay .i-play{display:none}
.vp-icon .i-pause,
.vp-overlay .i-pause{display:block}
.vp-icon.is-paused .i-play,
.vp-overlay.is-paused .i-play{display:block}
.vp-icon.is-paused .i-pause,
.vp-overlay.is-paused .i-pause{display:none}

.vp-track{
  position:relative;flex:1;height:20px;
  display:flex;align-items:center;cursor:pointer;
  touch-action:none;outline-offset:3px;
}
.vp-track::before{
  content:"";position:absolute;left:0;right:0;height:4px;
  border-radius:2px;background:#dde2e7;
}
.vp-fill{
  position:absolute;left:0;height:4px;width:0;
  border-radius:2px;background:var(--accent);
}
.vp-knob{
  position:absolute;left:0;width:11px;height:11px;margin-left:-5.5px;
  border-radius:50%;background:var(--accent);
  box-shadow:0 0 0 3px rgba(180,98,60,.16);
}
.vp-track:hover .vp-knob,.vp-track:focus-visible .vp-knob{
  box-shadow:0 0 0 5px rgba(180,98,60,.2);
}
.vp-time{
  font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums;
  white-space:nowrap;flex:none;
}

/* ---------- playback speed ---------- */

.vp-speed{position:relative;flex:none;display:flex;align-items:center}
.vp-sr{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
.vp-speed select{
  appearance:none;-webkit-appearance:none;
  font-family:inherit;font-size:11.5px;font-weight:600;
  font-variant-numeric:tabular-nums;
  color:var(--body);background:transparent;
  border:1px solid var(--line-strong);border-radius:4px;
  padding:3px 19px 3px 7px;
  cursor:pointer;
}
.vp-speed::after{
  content:"";position:absolute;right:6px;top:50%;margin-top:-2px;
  border-left:3.5px solid transparent;border-right:3.5px solid transparent;
  border-top:4px solid var(--muted);
  pointer-events:none;
}
.vp-speed select:hover{border-color:var(--ink);color:var(--ink)}
.vp-speed select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* flag a non-default speed so a slowed-down clip is never a mystery */
.vp-speed select.is-modified{color:var(--accent);border-color:var(--accent)}

.mediacap{font-size:12.5px;line-height:1.55;color:var(--muted);margin-top:11px}
.mediacap--center{text-align:center}
#analysis .mediacap{text-align:center}

.mediabox .meta{
  display:flex;flex-wrap:wrap;gap:6px 20px;align-items:baseline;
  padding:11px 16px;border-top:1px solid var(--line);
  font-size:12.5px;color:var(--muted);
}
.mediabox .meta b{color:var(--ink);font-weight:600}

@media (max-width:700px){
  .vp-time{font-size:11px}
  .vp-bar{gap:7px;padding:7px 8px}
}

/* ---------- real robot ---------- */

.tasks{display:grid;grid-template-columns:1fr;gap:14px;margin-top:30px}
.task{
  display:grid;grid-template-columns:1fr 190px;gap:18px;align-items:center;
  border:1px solid var(--line);border-radius:var(--radius);
  background:#fff;padding:14px 18px 14px 14px;
  box-shadow:var(--e1);
}
.task img,
.task video{border:1px solid var(--line);border-radius:6px;width:100%;display:block;background:#0b0f12}.task .task-meta h3{font-size:16px;margin-bottom:4px}
.task .task-meta .tag{
  font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
  color:var(--accent);
}
.task .task-meta p{font-size:13.5px;color:var(--muted);margin:6px 0 0}
.task .score{
  font-family:"Space Grotesk",sans-serif;
  font-size:30px;font-weight:700;letter-spacing:-.03em;color:var(--ink);
  line-height:1;
}
.task .score small{display:block;font-size:11px;font-weight:600;letter-spacing:.08em;color:var(--muted);margin-top:5px;text-transform:uppercase}

/* ---------- bibtex ---------- */

.bibtex{
  position:relative;
  border:1px solid var(--line);border-radius:var(--radius);
  background:var(--bg-soft);
  box-shadow:var(--e1);
}
.bibtex-coming-soon{margin:0;padding:26px 22px;text-align:center;color:#8a6100;font-size:14.5px}
.bibtex-coming-soon strong{color:#8a6100;font-weight:650}
.bibtex--pending{border-color:#f0d98a;background:#fffbea}
.bibtex pre{
  margin:0;padding:20px 18px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:12.5px;line-height:1.65;color:var(--ink);
  overflow-x:auto;
}
.copy-btn{
  position:absolute;top:10px;right:10px;
  font-size:12px;font-weight:600;color:var(--body);
  border:1px solid var(--line-strong);border-radius:999px;
  background:#fff;padding:4px 12px;cursor:pointer;
}
.copy-btn:hover{color:var(--brand);border-color:var(--brand)}
.copy-btn.done{color:#1c7a53;border-color:#1c7a53}

/* ---------- footer ---------- */

.site-footer{
  padding:34px 0 46px;font-size:13px;color:var(--muted);
}
.site-footer .row{
  display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;
}
.site-footer a{color:var(--brand);font-weight:600}
.site-footer a:hover{text-decoration:underline}

/* ---------- responsive ---------- */

/* Six equal columns need ~165 px of content per card: two four-digit RoboTwin
   values at 22px want ~153 px, and the longest note wants ~150 px. Wider than
   ~1160 px that holds; below it the strip breaks into two rows of three instead
   of squeezing, so nothing wraps. */
@media (max-width:1160px){
  .stats{grid-template-columns:repeat(3,1fr)}
}

@media (max-width:900px){
  /* Six items no longer fit beside the wordmark; let the nav scroll sideways
     instead of disappearing. */
  .topnav{
    display:flex;flex-wrap:nowrap;gap:16px;margin-left:14px;
    flex:1 1 auto;min-width:0;overflow-x:auto;overscroll-behavior-x:contain;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;
  }
  .topnav::-webkit-scrollbar{display:none}
  .topnav a{flex:none;white-space:nowrap}
  .stats{grid-template-columns:repeat(2,1fr)}
  .points{grid-template-columns:1fr}
  .task{grid-template-columns:1fr}
  .task .score{margin-top:4px}
  .section{padding:48px 0}
  .hero{padding:44px 0 34px}
}

@media (max-width:560px){
  .wrap,.wrap--narrow,.topbar-inner{width:calc(100% - 32px)}
  .topbar-inner{gap:12px}
  .brand{font-size:14px}
  .brand-logo{width:22px;height:22px;flex-basis:22px}
  .topbar .pdf-link{padding:5px 10px;font-size:12px}
  body{font-size:15.5px}
  .punchline{padding:14px 18px;font-size:16px}
  .authors span{margin:0 5px}
  .affiliations span{margin:0 5px}
}

/* Two columns of stat cards need ~153 px for the RoboTwin pair; a 375 px phone
   leaves only ~147 px. Stack them instead of shrinking the numbers. */
@media (max-width:420px){
  .stats{grid-template-columns:1fr}
}

/* ---------- dark theme ----------
   One override block. Palette tokens flip here; the selectors below only exist
   because a handful of surfaces are painted with literal colours (white cards,
   button variants, table zebras) rather than tokens. Figure images keep their
   white plate on purpose — the SVGs and screenshots are drawn for a light page,
   and a printed-figure panel reads better than a re-coloured chart. */

html[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0f1216;
  --bg-soft:#161a20;
  --ink:#e9eef3;
  --body:#aeb8c4;
  --muted:#818c9b;
  --line:#242a33;
  --line-strong:#3a434f;
  --accent:#e0895d;
  --accent-soft:#2b1d15;
  --accent-deep:#f0aa84;
  --brand:#409e93;
  --brand-dark:#57b3a7;
  /* Shadows do more work on a dark page: the same geometry at higher opacity
     so a raised card still separates from a near-black surround. */
  --e1: 0 1px 2px -1px rgba(0,0,0,.7), 0 2px 4px 0 rgba(0,0,0,.5), 0 1px 8px 0 rgba(0,0,0,.4);
  --e2: 0 2px 4px -1px rgba(0,0,0,.75), 0 4px 8px 0 rgba(0,0,0,.55), 0 1px 12px 0 rgba(0,0,0,.45);
  --e3: 0 3px 5px -1px rgba(0,0,0,.8), 0 6px 10px 0 rgba(0,0,0,.6), 0 1px 18px 0 rgba(0,0,0,.5);
}

/* top bar / chrome */
html[data-theme="dark"] .topbar{background:rgba(15,18,22,.88)}
html[data-theme="dark"] .theme-toggle{background:#1b2027}
html[data-theme="dark"] .theme-toggle__moon{display:none}
html[data-theme="dark"] .theme-toggle__sun{display:block}

/* buttons */
html[data-theme="dark"] .btn{background:#1b2027}
html[data-theme="dark"] .btn:hover{color:#0d1116}
html[data-theme="dark"] .btn--primary,
html[data-theme="dark"] .btn--primary:hover{color:#0d1116}
html[data-theme="dark"] .btn--arxiv{color:#ff9a90;background:#2a1a18;border-color:#5a2f2b}
html[data-theme="dark"] .btn--github{color:#dfe4ea;background:#1c2229;border-color:#3a434f}
html[data-theme="dark"] .btn--bibtex{color:#e8c46a;background:#2a2313;border-color:#5a4a1f}
html[data-theme="dark"] .btn--arxiv:hover{color:#fff;background:#b31b1b;border-color:#b31b1b}
html[data-theme="dark"] .btn--github:hover{color:#fff;background:#2f363d;border-color:#2f363d}
html[data-theme="dark"] .btn--bibtex:hover{color:#3d2c00;background:#f7d774;border-color:#e5bc3f}
html[data-theme="dark"] .btn--copy.is-copied{color:#fff}

/* soft accent containers */
html[data-theme="dark"] .venue,
html[data-theme="dark"] .punchline{border-color:#3a271d}

/* cards, panels, tables */
html[data-theme="dark"] .stats{border-color:rgba(255,255,255,.08)}
html[data-theme="dark"] .stat{background:#12161b}
html[data-theme="dark"] .point{background:#12161b}
html[data-theme="dark"] .mediabox{background:#12161b}
html[data-theme="dark"] .fold{background:#12161b}
html[data-theme="dark"] .task{background:#12161b}
html[data-theme="dark"] .table-block .table-note{color:var(--muted)}
html[data-theme="dark"] table.data tbody tr:not(.group):hover td{background:#1c2229}
html[data-theme="dark"] table.data tbody tr.ours:hover td{background:#33231a}

/* tabs and media player */
html[data-theme="dark"] .tablist button[aria-selected="true"]{background:#12161b}
html[data-theme="dark"] .vp-bar{background:#12161b}
html[data-theme="dark"] .vp-track::before{background:#2a323c}

/* method switcher + ablation drawer */
html[data-theme="dark"] .method-switcher__button{background:#1b2027}
html[data-theme="dark"] .method-switcher__button.is-active{color:#0d1116;background:var(--brand);border-color:var(--brand)}
html[data-theme="dark"] .method-switcher__button[data-method-variant="0"].is-active{color:#0d1116;background:var(--accent);border-color:var(--accent)}
html[data-theme="dark"] .method-ablation{background:#12161b}
html[data-theme="dark"] .method-ablation__handle{background:#1b2027}
html[data-theme="dark"] .method-ablation__table tbody th,
html[data-theme="dark"] .method-ablation__table tbody td{background:#171c22}
html[data-theme="dark"] .method-ablation__table tbody tr:not(.is-active):hover th,
html[data-theme="dark"] .method-ablation__table tbody tr:not(.is-active):hover td{background:#1e242c}
html[data-theme="dark"] .method-ablation__table tbody tr.is-active th,
html[data-theme="dark"] .method-ablation__table tbody tr.is-active td{border-top-color:#5a3a28;border-bottom-color:#5a3a28}
html[data-theme="dark"] .method-ablation__table tbody tr.is-active th{border-left-color:#5a3a28}
html[data-theme="dark"] .method-ablation__table tbody tr.is-active td:last-child{border-right-color:#5a3a28}

/* bibtex */
html[data-theme="dark"] .copy-btn{background:#1b2027}
html[data-theme="dark"] .bibtex--pending{border-color:#5a4a1f;background:#2a2313}
html[data-theme="dark"] .bibtex-coming-soon,
html[data-theme="dark"] .bibtex-coming-soon strong{color:#e8c46a}

/* tooltips invert against the page, so they stay light-on-dark only in light mode */
html[data-theme="dark"] .info-tip::after{background:#2b333d;color:#f2f5f8}

/* Figures flagged as light line art are flipped. Inverting the lightness and
   rotating the hue back keeps the chart's own colour coding intact while the
   white plate turns near-black. The element's own background/border invert with
   it, so no separate plate override is needed. */
html[data-theme="dark"] img[data-theme-invert="true"]{filter:invert(1) hue-rotate(180deg)}

@media print{
  /* A dark screen should still print as a light page. Reset the tokens and
     neutralise the literal-colour surfaces the dark block introduced. */
  html[data-theme="dark"]{
    --bg:#fff;--bg-soft:#fff;--ink:#0f1720;--body:#414d59;--muted:#78838f;
    --line:#e4e8ed;--line-strong:#c9d2da;
    --e1:none;--e2:none;--e3:none;
  }
  html[data-theme="dark"] .topbar,
  html[data-theme="dark"] .btn,
  html[data-theme="dark"] .theme-toggle,
  html[data-theme="dark"] .stat,
  html[data-theme="dark"] .point,
  html[data-theme="dark"] .mediabox,
  html[data-theme="dark"] .fold,
  html[data-theme="dark"] .task,
  html[data-theme="dark"] .vp-bar,
  html[data-theme="dark"] .method-ablation,
  html[data-theme="dark"] .method-ablation__handle,
  html[data-theme="dark"] .method-switcher__button,
  html[data-theme="dark"] .copy-btn{background:#fff}
  html[data-theme="dark"] .tablist button[aria-selected="true"]{background:#fff}
  html[data-theme="dark"] .method-ablation__table tbody th,
  html[data-theme="dark"] .method-ablation__table tbody td{background:#fff}
  html[data-theme="dark"] .bibtex--pending{background:#fff;border-color:#f0d98a}
  html[data-theme="dark"] .bibtex-coming-soon,
  html[data-theme="dark"] .bibtex-coming-soon strong{color:#8a6100}
  .topbar,.copy-btn,.theme-toggle{display:none}
  .section{border-bottom:none;padding:24px 0}
  .section--soft{background:#fff}
  .fold{border:none}
  .fold>summary{display:none}
  .fold .fold-body{padding:0}
}