/* ============================================================
   Frontier Coding Agents Use Metaprogramming
   Academic project page, after sim2reason.github.io and the
   LIMEN project page. Light + dark themes via CSS variables.
   ============================================================ */

/* ---------- Theme tokens ---------- */
:root,
[data-theme="light"] {
  --bg:                 #ffffff;
  --bg-soft:            #fafafa;
  --bg-card:            #fafbfc;
  --bg-tldr:            #fafbfc;
  --bg-bibtex:          #f6f6f9;
  --bg-footer:          #fafafa;
  --ink:                #2b2b2b;
  --ink-strong:         #1c1c1c;
  --ink-soft:           #4a4a4a;
  --ink-muted:          #6b6b6b;
  --ink-faint:          #888888;
  --border:             #eaeaea;
  --border-soft:        #e8e8ee;
  --rule:               #1c1c1c;
  --link:               #3273dc;
  --link-hover:         #1f56b0;
  --chart-text:         #555555;
  --chart-grid:         #e8e8ee;
  --code-bg:            #f6f6f9;
  --code-ink:           #2b2b2b;
  --shadow:             0 1px 2px rgba(0,0,0,0.04);
  --figure-bg:          #ffffff;
  --logo-filter:        none;
  --toggle-bg:          #ffffff;
  --toggle-border:      #e8e8ee;
}

[data-theme="dark"] {
  --bg:                 #0f1116;
  --bg-soft:            #161a22;
  --bg-card:            #161a22;
  --bg-tldr:            #161a22;
  --bg-bibtex:          #0a0d14;
  --bg-footer:          #0c0f15;
  --ink:                #d8dde6;
  --ink-strong:         #f0f2f5;
  --ink-soft:           #b0b8c8;
  --ink-muted:          #828a9c;
  --ink-faint:          #6c7383;
  --border:             #232834;
  --border-soft:        #232834;
  --rule:               #f0f2f5;
  --link:               #6ea8fe;
  --link-hover:         #93c5fd;
  --chart-text:         #b0b8c8;
  --chart-grid:         #232834;
  --code-bg:            #0a0d14;
  --code-ink:           #d8dde6;
  --shadow:             0 1px 2px rgba(0,0,0,0.3);
  --figure-bg:          #ffffff;
  --logo-filter:        invert(1) brightness(1.6);
  --toggle-bg:          #161a22;
  --toggle-border:      #232834;
}

/* ---------- Base ---------- */
html {
  scroll-behavior: smooth;
  overflow-x: hidden;
}

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  color: var(--ink);
  background-color: var(--bg);
  font-size: 17px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: background-color 0.25s ease, color 0.25s ease;
  overflow-x: hidden;
}

* { box-sizing: border-box; }

a {
  color: var(--link);
  text-decoration: none;
  transition: color 0.15s ease;
}

a:hover { color: var(--link-hover); text-decoration: underline; }

code, pre {
  font-family: 'JetBrains Mono', 'SF Mono', Menlo, Consolas, monospace;
  font-size: 0.88em;
}

/* ---------- Theme toggle ---------- */
.theme-toggle {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 100;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid var(--toggle-border);
  background: var(--toggle-bg);
  color: var(--ink-soft);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--shadow);
  transition: background 0.2s ease, transform 0.2s ease, color 0.2s ease;
}

.theme-toggle:hover {
  color: var(--ink-strong);
  transform: scale(1.05);
}

.theme-toggle .icon-dark { display: none; }
[data-theme="dark"] .theme-toggle .icon-light { display: none; }
[data-theme="dark"] .theme-toggle .icon-dark  { display: inline-flex; }

/* ---------- Hero ---------- */
.hero {
  background-color: var(--bg);
  padding: 1.4rem 0 0 0;
}

.hero-body { padding: 2.6rem 1.5rem 2rem 1.5rem; }

.publication-title {
  font-family: 'Inter', sans-serif;
  font-weight: 700 !important;
  letter-spacing: -0.02em;
  font-size: clamp(1.05rem, 2.6vw + 0.55rem, 2.15rem) !important;
  line-height: 1.22 !important;
  color: var(--ink-strong);
  margin-bottom: 1.4rem !important;
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  overflow-wrap: break-word;
}

.publication-subtitle {
  font-family: 'Inter', sans-serif;
  font-size: 1.0rem;
  color: var(--ink-soft);
  margin: -0.4rem auto 1rem auto;
  max-width: 700px;
  line-height: 1.55;
}

.publication-authors {
  font-family: 'Inter', sans-serif;
  font-size: 1.08rem;
  line-height: 1.9;
  margin-top: 0.6rem;
  margin-bottom: 0.4rem;
  color: var(--ink);
}

.publication-authors a { color: var(--link); }

.publication-authors sup {
  color: var(--ink-faint);
  font-size: 0.7em;
  font-weight: 600;
  margin-right: 1px;
}

.affiliation-logos {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1.75rem;
  margin: 1.2rem auto 0.6rem;
  flex-wrap: wrap;
}

.aff-logo {
  display: block;
  width: auto;
  object-fit: contain;
  opacity: 0.95;
  filter: var(--logo-filter);
  transition: filter 0.25s ease;
}

.aff-logo-lossfunk { height: 72px; }

.affiliation-legend {
  font-family: 'Inter', sans-serif;
  margin-top: 0.4rem;
  font-size: 0.9rem;
  color: var(--ink-muted);
  line-height: 1.7;
}

.affiliation-legend sup {
  color: var(--ink-faint);
  margin-right: 1px;
}

.hero-buttons {
  margin-top: 1.4rem;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.hero .button {
  font-family: 'Inter', sans-serif;
  font-weight: 500;
}

.button.is-dark {
  background-color: var(--ink-strong);
  border-color: var(--ink-strong);
  color: #ffffff;
}

.button.is-dark:hover {
  background-color: var(--ink-soft);
  border-color: var(--ink-soft);
  color: #ffffff;
}

[data-theme="dark"] .button.is-dark {
  background-color: #2a3040;
  border-color: #2a3040;
  color: var(--ink-strong);
}

[data-theme="dark"] .button.is-dark:hover {
  background-color: #3a4254;
  border-color: #3a4254;
}

/* ---------- Section spacing ---------- */
.section {
  padding: 1.6rem 1.4rem;
}

.section + .section { padding-top: 0.8rem; }

.section-teaser {
  padding-top: 0;
  padding-bottom: 0.4rem;
}

.section-tldr {
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
}

.tldr-text {
  background: var(--bg-tldr);
  border: 1px solid var(--border-soft);
  border-left: 3px solid var(--link);
  border-radius: 6px;
  padding: 1.1rem 1.4rem 1.2rem 1.4rem;
  font-size: 1.0rem;
  line-height: 1.65;
  color: var(--ink);
  font-family: 'Inter', sans-serif;
}

.tldr-label {
  display: inline-block;
  font-family: 'Inter', sans-serif;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--link);
  margin-bottom: 0.5rem;
}

.tldr-text p { margin-bottom: 0; }
.tldr-text strong { color: var(--ink-strong); font-weight: 700; }

/* ---------- Headings ---------- */
h2.title.is-3 {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  color: var(--ink-strong);
  letter-spacing: -0.015em;
  margin-bottom: 0.9rem !important;
  margin-top: 0 !important;
  line-height: 1.25;
}

h3.title {
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  color: var(--ink-strong);
}

.content {
  font-size: 1.02rem;
  line-height: 1.7;
  color: var(--ink);
}

.content p { margin-bottom: 1.1rem; }

.content strong { color: var(--ink-strong); }

.content em { color: var(--ink-soft); }

/* ---------- Paper figures ---------- */
.paper-figure {
  margin: 1.2rem 0 1.4rem 0;
  text-align: center;
}

.paper-figure img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
  background: #ffffff;
  border-radius: 6px;
  border: 1px solid var(--border);
}

[data-theme="dark"] .paper-figure img {
  padding: 10px;
  background: #ffffff;
  border-color: #2a3040;
}

.paper-figure figcaption {
  font-family: 'Inter', sans-serif;
  font-size: 0.92rem;
  line-height: 1.55;
  color: var(--ink-muted);
  margin-top: 0.9rem;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
  text-align: justify;
  text-align-last: left;
}

.paper-figure figcaption strong { color: var(--ink-strong); }

/* Chart card (for canvas-based charts) */
.chart-card {
  background: #ffffff;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  padding: 1.2rem 1rem 0.6rem 1rem;
  box-shadow: var(--shadow);
}

[data-theme="dark"] .chart-card {
  background: #ffffff;
}

/* ---------- Tables ---------- */
.table-wrap {
  margin: 1.4rem auto 1.6rem auto;
  text-align: left;
  max-width: 760px;
}

.table-scroll {
  overflow-x: auto;
  border-radius: 4px;
}

.table-caption {
  font-family: 'Inter', sans-serif;
  font-size: 0.92rem;
  color: var(--ink-muted);
  margin-bottom: 0.8rem;
  text-align: left;
  line-height: 1.5;
}

.table-caption strong { color: var(--ink-strong); }

.paper-table {
  width: 100%;
  border-collapse: collapse;
  font-family: 'Inter', sans-serif;
  font-size: 0.95rem;
  table-layout: auto;
}

.paper-table thead th {
  font-weight: 600;
  text-align: center;
  padding: 0.75rem 0.7rem;
  border-top: 2px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  background: transparent;
  color: var(--ink-strong);
  font-size: 0.88rem;
  letter-spacing: 0.01em;
  white-space: nowrap;
}

.paper-table thead th:first-child {
  text-align: left;
  padding-left: 0.4rem;
}

.paper-table thead th:last-child {
  padding-right: 0.4rem;
}

.paper-table tbody td {
  padding: 0.62rem 0.7rem;
  text-align: center;
  border-bottom: 1px solid var(--border);
  font-family: 'JetBrains Mono', 'SF Mono', monospace;
  font-feature-settings: "tnum" 1;
  color: var(--ink);
  vertical-align: middle;
  white-space: nowrap;
}

.paper-table tbody th[scope="row"],
.paper-table tbody td:first-child {
  text-align: left;
  font-family: 'Inter', sans-serif;
  font-weight: 500;
  color: var(--ink-strong);
  padding: 0.62rem 0.7rem 0.62rem 0.4rem;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}

.paper-table tbody tr:last-child th[scope="row"] {
  border-bottom: 2px solid var(--rule);
}

.paper-table tbody td:last-child {
  padding-right: 0.4rem;
  border-left: 1px solid var(--border);
  font-weight: 700;
}

.paper-table tbody tr:last-child td {
  border-bottom: 2px solid var(--rule);
}

.paper-table sub {
  font-size: 0.62em;
  color: var(--ink-faint);
  margin-left: 1px;
  vertical-align: sub;
  font-weight: 400;
}

.paper-table tbody tr:hover td { background: var(--bg-soft); }

[data-theme="dark"] .paper-table tbody tr:hover td { background: var(--bg-card); }

/* Heatmap cell tinting (light mode). Light cell = low value, dark = high. */
.heatmap-table tbody td[data-v] {
  position: relative;
  font-weight: 500;
}

/* bucket by data-v range using attribute selectors */
.heatmap-table tbody td[data-v^="0"],
.heatmap-table tbody td[data-v="2.5"],
.heatmap-table tbody td[data-v="5"],
.heatmap-table tbody td[data-v="6.3"],
.heatmap-table tbody td[data-v="7.5"]  { background: #fdecea; color: #8a2f15; }
.heatmap-table tbody td[data-v="11.3"],
.heatmap-table tbody td[data-v="13.8"],
.heatmap-table tbody td[data-v="15"],
.heatmap-table tbody td[data-v="21.3"]  { background: #fdf2d9; color: #8a5a15; }
.heatmap-table tbody td[data-v="24.7"],
.heatmap-table tbody td[data-v="31.3"],
.heatmap-table tbody td[data-v="32.5"]  { background: #fff7d6; color: #6b5b1a; }
.heatmap-table tbody td[data-v="66.3"],
.heatmap-table tbody td[data-v="70"]    { background: #e8f3df; color: #2f5e1a; }
.heatmap-table tbody td[data-v="80"],
.heatmap-table tbody td[data-v="81.3"],
.heatmap-table tbody td[data-v="86.9"],
.heatmap-table tbody td[data-v="87.5"],
.heatmap-table tbody td[data-v="88.8"]  { background: #d4ead0; color: #1f4f15; }
.heatmap-table tbody td[data-v="98.8"],
.heatmap-table tbody td[data-v="99.7"],
.heatmap-table tbody td[data-v="100"]   { background: #b8dec0; color: #134e1a; }

/* Dark mode heatmap */
[data-theme="dark"] .heatmap-table tbody td[data-v^="0"],
[data-theme="dark"] .heatmap-table tbody td[data-v="2.5"],
[data-theme="dark"] .heatmap-table tbody td[data-v="5"],
[data-theme="dark"] .heatmap-table tbody td[data-v="6.3"],
[data-theme="dark"] .heatmap-table tbody td[data-v="7.5"]  { background: rgba(248, 113, 113, 0.18); color: #fca5a5; }
[data-theme="dark"] .heatmap-table tbody td[data-v="11.3"],
[data-theme="dark"] .heatmap-table tbody td[data-v="13.8"],
[data-theme="dark"] .heatmap-table tbody td[data-v="15"],
[data-theme="dark"] .heatmap-table tbody td[data-v="21.3"]  { background: rgba(251, 191, 36, 0.16); color: #fcd34d; }
[data-theme="dark"] .heatmap-table tbody td[data-v="24.7"],
[data-theme="dark"] .heatmap-table tbody td[data-v="31.3"],
[data-theme="dark"] .heatmap-table tbody td[data-v="32.5"]  { background: rgba(234, 179, 8, 0.14); color: #fde047; }
[data-theme="dark"] .heatmap-table tbody td[data-v="66.3"],
[data-theme="dark"] .heatmap-table tbody td[data-v="70"]    { background: rgba(74, 222, 128, 0.16); color: #86efac; }
[data-theme="dark"] .heatmap-table tbody td[data-v="80"],
[data-theme="dark"] .heatmap-table tbody td[data-v="81.3"],
[data-theme="dark"] .heatmap-table tbody td[data-v="86.9"],
[data-theme="dark"] .heatmap-table tbody td[data-v="87.5"],
[data-theme="dark"] .heatmap-table tbody td[data-v="88.8"]  { background: rgba(34, 197, 94, 0.20); color: #4ade80; }
[data-theme="dark"] .heatmap-table tbody td[data-v="98.8"],
[data-theme="dark"] .heatmap-table tbody td[data-v="99.7"],
[data-theme="dark"] .heatmap-table tbody td[data-v="100"]   { background: rgba(16, 185, 129, 0.28); color: #6ee7b7; }

/* Mean column emphasis */
.heatmap-table thead th.mean-col,
.heatmap-table tbody td.mean-col {
  border-left: 1px solid var(--rule);
  font-weight: 700;
}

.heatmap-table tbody tr:hover td { background: var(--bg-soft) !important; }
[data-theme="dark"] .heatmap-table tbody tr:hover td { background: var(--bg-card) !important; }

/* ---------- Video placeholder ---------- */
.video-placeholder {
  border: 1.5px dashed var(--border);
  background: var(--bg-card);
  border-radius: 10px;
  min-height: 280px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2.4rem 1.4rem;
  color: var(--ink-soft);
}

.placeholder-inner { max-width: 520px; text-align: center; }

.placeholder-icon {
  margin: 0 auto 0.8rem auto;
  opacity: 0.45;
  display: inline-block;
}

.placeholder-title {
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 1.04rem;
  color: var(--ink-strong);
  margin-bottom: 0.4rem;
}

.placeholder-sub {
  font-size: 0.94rem;
  color: var(--ink-muted);
  line-height: 1.55;
}

/* ---------- Contact ---------- */
.contact-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
  flex-wrap: wrap;
  margin-top: 1.4rem;
}

.button.is-dark.is-outlined {
  background-color: transparent;
  border-color: var(--ink-strong);
  color: var(--ink-strong);
}

.button.is-dark.is-outlined:hover {
  background-color: var(--ink-strong);
  color: var(--bg);
}

[data-theme="dark"] .button.is-dark.is-outlined {
  border-color: var(--ink);
  color: var(--ink);
}

[data-theme="dark"] .button.is-dark.is-outlined:hover {
  background-color: var(--ink);
  color: var(--bg);
}

/* ---------- BibTeX ---------- */
#BibTeX h2.title {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  color: var(--ink-strong);
  margin-bottom: 0.8rem !important;
}

#BibTeX pre {
  background: var(--bg-bibtex);
  border: 1px solid var(--border-soft);
  border-radius: 6px;
  padding: 1.2rem 1.4rem;
  overflow-x: auto;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.86rem;
  color: var(--code-ink);
  line-height: 1.55;
}

#BibTeX code {
  background: transparent;
  padding: 0;
  color: inherit;
  font-size: inherit;
}

/* ---------- Footer ---------- */
.footer {
  background-color: var(--bg-footer);
  border-top: 1px solid var(--border);
  padding: 2.6rem 1rem;
  font-family: 'Inter', sans-serif;
  font-size: 0.92rem;
  color: var(--ink-muted);
}

.footer p { margin: 0.4em 0; }

.footer a { color: var(--ink-soft); }

.footer a:hover { color: var(--ink-strong); }

.footer .icon-link {
  display: inline-block;
  color: var(--ink-soft);
  margin: 0 0.5rem;
  font-size: 1.2rem;
  transition: color 0.15s ease;
}

.footer .icon-link:hover { color: var(--ink-strong); }

.footer-icons { margin-bottom: 0.7rem; }

/* ---------- Bulma overrides for dark mode ---------- */
[data-theme="dark"] .hero,
[data-theme="dark"] .section,
[data-theme="dark"] .container { background-color: transparent; }

[data-theme="dark"] .hero,
[data-theme="dark"] body { background-color: var(--bg); }

/* ---------- Mobile polish ---------- */
@media (max-width: 768px) {
  body { font-size: 16px; }
  .section { padding: 2rem 1rem; }
  .hero-body { padding: 1.8rem 1rem 1.4rem 1rem; }
  .publication-title {
    line-height: 1.22 !important;
    margin-bottom: 1.1rem !important;
    padding: 0 0.4rem;
  }
  .publication-title br { display: none; }
  .publication-authors {
    font-size: 0.98rem;
    line-height: 1.85;
    padding: 0 0.4rem;
  }
  .aff-logo-lossfunk { height: 56px; }
  .affiliation-legend { font-size: 0.82rem; padding: 0 0.6rem; }
  .hero-buttons .button {
    font-size: 0.9rem;
    margin: 0.2rem 0.15rem;
  }
  h2.title.is-3 {
    font-size: 1.35rem !important;
    line-height: 1.3;
    margin-bottom: 1rem !important;
  }
  .content { font-size: 0.98rem; }
  .tldr-text {
    font-size: 0.96rem;
    padding: 1rem 1.1rem;
  }
  .paper-figure { margin: 1.2rem 0 1.6rem 0; }
  .paper-figure figcaption {
    font-size: 0.86rem;
    text-align: left;
  }
  .table-scroll { overflow-x: auto; }
  .paper-table { font-size: 0.78rem; min-width: 460px; }
  .paper-table thead th,
  .paper-table tbody td { padding: 0.4rem 0.3rem; }
  .paper-table sub { font-size: 0.6em; }
  #BibTeX pre {
    font-size: 0.74rem;
    padding: 0.9rem 1rem;
    line-height: 1.55;
  }
  .video-placeholder { min-height: 220px; padding: 1.6rem 1rem; }
  .placeholder-title { font-size: 0.98rem; }
  .placeholder-sub { font-size: 0.86rem; }
  .contact-actions { flex-direction: column; gap: 0.6rem; }
  .contact-actions .button { width: 100%; max-width: 320px; }
  .theme-toggle { top: 0.7rem; right: 0.7rem; width: 34px; height: 34px; }
  .theme-toggle svg { width: 15px; height: 15px; }
}

@media (max-width: 460px) {
  .hero-buttons .button { padding: 0.45rem 0.8rem; font-size: 0.85rem; }
  .button .icon { width: 0.9rem; height: 0.9rem; }
  .publication-authors { padding: 0 0.6rem; }
  .container.is-max-desktop,
  .container.is-max-widescreen { padding-left: 0.5rem; padding-right: 0.5rem; }
}

/* ---------- Misc ---------- */
img { max-width: 100%; }

.has-text-justified { text-align: left; }

/* ============================================================
   v62 · OFFICIAL RELEASE polish — more compact + readable.
   The page rendered too large; tighten widths, scale, rhythm
   so the whole layout reads at a comfortable "zoomed-out" size.
   ============================================================ */
@media (min-width: 769px) {
  body { font-size: 16px; line-height: 1.6; }

  /* narrower reading column so lines + figures aren't oversized */
  .container.is-max-desktop   { max-width: 880px; }
  .container.is-max-widescreen { max-width: 1040px; }

  /* tighter vertical rhythm = less scrolling, more on screen */
  .section   { padding-top: 2.7rem; padding-bottom: 2.7rem; }
  .hero-body { padding: 1.8rem 1.5rem 1.4rem 1.5rem; }

  /* cap every figure so detailed panels render at a sane size */
  .paper-figure img { max-width: 820px; }
  .section-teaser .paper-figure img { max-width: 1000px; } /* Fig 1 a touch wider */

  /* trim the hero so it doesn't dominate the fold */
  .publication-title.title.is-1 {
    font-size: clamp(1.0rem, 2.0vw + 0.5rem, 1.7rem) !important;
    line-height: 1.25 !important;
  }
  .aff-logo-lossfunk { height: 50px; }
}

/* ============================================================
   v67 · Section headings — CENTERED, moderately larger than body
   (clear hierarchy, not oversized), real space below.
   Body paragraphs read left-aligned (cleaner than justified).
   ============================================================ */
.section h2.title.is-3 {
  font-size: 1.7rem !important;
  font-weight: 700 !important;
  line-height: 1.22 !important;
  letter-spacing: -0.01em;
  text-align: center !important;
  margin: 0 auto 1.4rem auto !important;
  max-width: 820px;
}
.paper-figure figcaption { text-align: left; }
/* override Bulma's .has-text-justified !important so body reads cleanly left-aligned */
.content.has-text-justified, .has-text-justified, .section .content p { text-align: left !important; }
.section .content p { margin-bottom: 1.1rem; }
/* contact intro stays centered */
#contact .content p { text-align: center !important; }
@media (max-width: 768px) {
  .section h2.title.is-3 { font-size: 1.42rem !important; margin-bottom: 1.1rem !important; }
}

/* embedded release video */
.video-container {
  max-width: 860px;
  margin: 0 auto;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: var(--shadow);
  background: #000;
}
.video-caption {
  text-align: center;
  font-size: 0.9rem;
  color: var(--ink-muted);
  margin-top: 0.9rem;
}


/* ============================================================
   v68 - Figures: center on the page, never overflow the column.
   The old 820px cap was wider than the ~704px text column, so
   images spilled past the right edge. Break the figure out to a
   page-centered box capped at the viewport.
   ============================================================ */
.paper-figure {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: min(840px, 94vw);
  margin: 1.5rem 0 1.7rem 0;
}
.section-teaser .paper-figure { width: min(1040px, 96vw); }
.paper-figure img { max-width: 100% !important; height: auto; display: block; margin: 0 auto; }
.paper-figure figcaption { max-width: 100%; }
@media (max-width: 768px) {
  .paper-figure { width: 94vw; }
  .section-teaser .paper-figure { width: 96vw; }
}