:root {
  --pg-ink: #172033;
  --pg-ink-soft: #5d687b;
  --pg-paper: #f9fbfd;
  --pg-surface: #ffffff;
  --pg-tint: #f0f4f8;
  --pg-night: #090d15;
  --pg-night-soft: #111824;
  --pg-line: rgba(23, 32, 51, 0.14);
  --pg-blue: #6faed8;
  --pg-blue-strong: #3f7fb8;
  --pg-gold: #efb65c;
  --pg-green: #65b998;
  --pg-subject: #e8735a;
  --pg-composition: #5b8fd6;
  --pg-integrity: #b78ac9;
  --pg-aesthetic: #63b28a;
  --pg-radius: 16px;
  --pg-content: 1180px;
  --pg-reading: 820px;
}

* { box-sizing: border-box; }

/* Match RL-AWB's project resource buttons, including mobile sizing. */
.pg-resource-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 18px; }
.pg-resource-links a { display: inline-flex; align-items: center; gap: 8px; min-height: 43px; padding: 0 17px; color: rgba(255,255,255,.88); font-size: 1.03rem; font-weight: 500; text-decoration: none; background: rgba(255,255,255,.055); border: 1px solid rgba(255,255,255,.14); border-radius: 999px; transition: color 160ms ease, background 160ms ease, border-color 160ms ease, transform 160ms ease; }
.pg-resource-links a:hover { color: #fff; background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.28); transform: translateY(-1px); }
@media (max-width: 720px) {
  .pg-resource-links { gap: 7px; margin-top: 20px; }
  .pg-resource-links a { min-height: 38px; padding: 0 12px; font-size: .93rem; }
}

.pg-authors { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 4px 9px; margin: 18px auto 0; color: #fff; font-size: 1.21rem; }
.pg-author { white-space: nowrap; }
.pg-author a { color: #fff; text-decoration-color: rgba(255,255,255,.34); text-underline-offset: 4px; }
.pg-authors__dot { color: rgba(255,255,255,.3); }
.pg-authors sup, .pg-affiliations sup, .pg-equal sup { position: relative; top: -.28em; margin-left: 2px; font-size: .64em; }
.pg-affiliations { display: flex; flex-wrap: wrap; justify-content: center; gap: 3px 19px; margin: 16px auto 0; color: rgba(255,255,255,.68); font-size: 1.05rem; }
.pg-equal { margin: 5px 0 0; color: rgba(255,255,255,.68); font-size: .97rem; }
@media (max-width: 720px) {
  .pg-authors { margin-top: 20px; font-size: 1.07rem; }
  .pg-affiliations { font-size: .95rem; }
}

.pg-expl-results { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 32px 0 20px; }
.pg-expl-results > div { padding: 16px 0; border-top: 2px solid var(--pg-line); }
.pg-expl-results > div:first-child { border-color: var(--pg-blue-strong); }
.pg-expl-results strong { display: block; font-size: clamp(1.9rem, 4vw, 3rem); line-height: 1.2; }
.pg-expl-results span, .pg-expl-results small { display: block; margin-top: 8px; }
.pg-expl-results small, .pg-expl-note { color: var(--pg-ink-soft); font-size: 1rem; }
.pg-expl-controls { display: flex; flex-wrap: wrap; gap: 10px; margin: 32px 0 24px; }
.pg-expl-controls button { padding: 10px 18px; border: 1px solid var(--pg-line); border-radius: 999px; background: var(--pg-surface); color: var(--pg-ink); cursor: pointer; }
.pg-expl-controls button:hover { border-color: var(--pg-blue-strong); }
.pg-expl-controls button[aria-pressed="true"] { background: var(--pg-ink); color: #f9fbfd; }
.pg-expl-images { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.pg-expl-images figure { margin: 0; }
.pg-expl-images img { width: 100%; height: auto; border-radius: var(--pg-radius); }
.pg-expl-images figcaption { margin: 12px 0 0; color: var(--pg-ink-soft); font-size: 1rem; }
.pg-expl-comparison { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin: 32px 0 24px; }
.pg-expl-comparison article { min-width: 0; border-top: 1px solid var(--pg-line); padding-top: 20px; }
.pg-expl-comparison h3 { font-size: 1.25rem; margin: 0 0 6px; }
.pg-expl-comparison header span { color: var(--pg-ink-soft); }
.pg-expl-comparison p { font-size: 1.0625rem; line-height: 1.65; margin-bottom: 0; }
[data-expl-panel][hidden] { display: none; }
@media (max-width: 767px) {
  .pg-expl-results { gap: 12px; }
  .pg-expl-results small { font-size: .875rem; }
  .pg-expl-images, .pg-expl-comparison { grid-template-columns: 1fr; }
  .pg-expl-controls button { padding: 9px 14px; }
}

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

body {
  margin: 0;
  color: var(--pg-ink);
  background: var(--pg-paper);
  font-family: "Google Sans", "Noto Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 17px;
  line-height: 1.62;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body, button, input { font: inherit; }
a { color: inherit; }
img, video { display: block; max-width: 100%; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible { outline: 2px solid var(--pg-gold); outline-offset: 3px; }

.pg-shell { width: min(calc(100% - 48px), var(--pg-content)); margin-inline: auto; }
.pg-skip { position: fixed; z-index: 100; top: 10px; left: 10px; padding: 8px 12px; color: #101723; background: #f9fbfd; border-radius: 8px; transform: translateY(-160%); transition: transform 160ms ease; }
.pg-skip:focus { transform: translateY(0); }

.pg-nav {
  position: sticky;
  z-index: 50;
  top: 0;
  color: rgba(255,255,255,.74);
  background: rgba(9,13,21,.9);
  border-bottom: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(18px) saturate(130%);
  -webkit-backdrop-filter: blur(18px) saturate(130%);
}
.pg-nav__inner { display: flex; align-items: center; justify-content: space-between; width: min(calc(100% - 40px), 1240px); min-height: 62px; margin-inline: auto; gap: 28px; }
.pg-nav a { text-decoration: none; }
.pg-nav__brand { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 10px; color: #f8fafc; font-weight: 600; letter-spacing: -.01em; }
.pg-nav__mark { display: grid; width: 30px; height: 30px; place-items: center; color: #f8fafc; font-size: .7rem; font-weight: 700; background: linear-gradient(135deg, #376fa7, #70b596); border: 1px solid rgba(255,255,255,.28); border-radius: 9px; }
.pg-nav__links { display: flex; align-items: center; gap: 25px; overflow-x: auto; font-size: .96rem; white-space: nowrap; scrollbar-width: none; }
.pg-nav__links::-webkit-scrollbar { display: none; }
.pg-nav__links a { transition: color 160ms ease; }
.pg-nav__links a:hover { color: #f8fafc; }

.pg-hero {
  position: relative;
  overflow: hidden;
  color: #f7f9fc;
  background:
    radial-gradient(circle at 78% 15%, rgba(101,185,152,.17), transparent 31%),
    radial-gradient(circle at 18% 20%, rgba(75,133,190,.21), transparent 34%),
    linear-gradient(180deg, #090d15 0%, #0d1420 100%);
}
.pg-hero::before { position: absolute; inset: 0; pointer-events: none; content: ""; opacity: .18; background-image: linear-gradient(rgba(255,255,255,.02) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.02) 1px, transparent 1px); background-size: 56px 56px; mask-image: linear-gradient(to bottom, #000, transparent 68%); }
.pg-hero__inner { position: relative; padding: 60px 0 66px; text-align: center; }
.pg-hero__eyebrow { display: inline-block; margin: 0 0 8px; color: var(--pg-gold); font-size: 1.12rem; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; }
.pg-hero h1 { margin: 0; font-size: clamp(2.8rem, 6vw, 5.3rem); font-weight: 600; line-height: 1; letter-spacing: -.06em; }
.pg-hero__title { max-width: 1000px; margin: 16px auto 0; color: rgba(255,255,255,.93); font-size: clamp(1.42rem, 2.5vw, 2.14rem); font-weight: 500; line-height: 1.24; letter-spacing: -.025em; text-wrap: balance; }
.pg-hero__dek { max-width: 760px; margin: 15px auto 0; color: rgba(255,255,255,.64); font-size: 1.05rem; line-height: 1.55; }
.pg-hero__videos { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 42px; text-align: left; }
.pg-hero-card { overflow: hidden; background: rgba(255,255,255,.055); border: 1px solid rgba(255,255,255,.14); border-radius: var(--pg-radius); box-shadow: 0 28px 62px rgba(0,0,0,.34); }
.pg-hero-card video { width: 100%; aspect-ratio: 16/9; object-fit: cover; background: #070a10; }
.pg-hero-card__body { padding: 19px 20px 21px; }
.pg-hero-card__heading { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.pg-hero-card h2 { margin: 0; color: #f8fafc; font-size: 1.19rem; font-weight: 600; }
.pg-camera-params { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 5px 12px; color: rgba(255,255,255,.7); font-size: .78rem; font-variant-numeric: tabular-nums; }
.pg-camera-params span { white-space: nowrap; }
.pg-camera-params b { margin-right: 3px; color: rgba(255,255,255,.42); font-size: .68rem; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; }
.pg-hero-card p { margin: 13px 0 0; color: rgba(255,255,255,.62); font-size: .95rem; line-height: 1.55; }

.pg-score-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.pg-score-row span { display: inline-flex; align-items: baseline; gap: 6px; min-width: 56px; padding: 5px 10px; color: rgba(255,255,255,.82); font-size: .89rem; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); border-radius: 999px; }
.pg-score-row b { font-size: .77rem; }
.pg-score-row span:nth-child(1) b { color: var(--pg-subject); }
.pg-score-row span:nth-child(2) b { color: var(--pg-composition); }
.pg-score-row span:nth-child(3) b { color: var(--pg-aesthetic); }
.pg-score-row span:nth-child(4) b { color: var(--pg-integrity); }
.pg-score-row--light span { color: var(--pg-ink); background: rgba(63,127,184,.07); border-color: rgba(63,127,184,.15); }

.pg-section { padding: 104px 0; scroll-margin-top: 62px; }
.pg-section--tinted { background: var(--pg-tint); }
.pg-section--dark { color: #f7f9fc; background: var(--pg-night-soft); }
.pg-kicker { margin: 0 0 10px; color: var(--pg-blue-strong); font-size: .9rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.pg-section--dark .pg-kicker { color: #87c2e7; }
.pg-section h2 { max-width: 900px; margin: 0; color: var(--pg-ink); font-size: clamp(2rem, 3.6vw, 3.1rem); font-weight: 600; line-height: 1.13; letter-spacing: -.042em; text-wrap: balance; }
.pg-section--dark h2 { color: #f8fafc; }
.pg-lede { max-width: var(--pg-reading); margin: 16px 0 0; color: var(--pg-ink-soft); font-size: 1.08rem; line-height: 1.65; }
.pg-section--dark .pg-lede { color: rgba(255,255,255,.62); }

.pg-paper-figure { overflow: hidden; margin: 42px 0 0; background: var(--pg-surface); border: 1px solid var(--pg-line); border-radius: var(--pg-radius); box-shadow: 0 18px 44px rgba(23,32,51,.08); }
.pg-paper-figure__viewport { padding: 16px; background: #fff; }
.pg-paper-figure__viewport > a { display: block; }
.pg-paper-figure img { display: block; width: 100%; height: auto; }
.pg-paper-figure figcaption { padding: 14px 18px 16px; color: var(--pg-ink-soft); font-size: .92rem; border-top: 1px solid var(--pg-line); }
.pg-paper-figure figcaption strong { color: var(--pg-ink); }
.pg-facts { display: grid; grid-template-columns: repeat(4,1fr); margin-top: 42px; padding: 28px 0; border-top: 1px solid var(--pg-line); border-bottom: 1px solid var(--pg-line); }
.pg-facts div { display: flex; flex-direction: column; gap: 2px; padding: 0 24px; }
.pg-facts div + div { border-left: 1px solid var(--pg-line); }
.pg-facts strong { color: var(--pg-blue-strong); font-size: clamp(2rem,4vw,3.4rem); line-height: 1; letter-spacing: -.05em; }
.pg-facts span { margin-top: 7px; color: var(--pg-ink); font-weight: 600; }
.pg-facts small { color: var(--pg-ink-soft); font-size: .83rem; line-height: 1.45; }

.pg-process { display: grid; grid-template-columns: repeat(4,1fr); gap: 0; margin: 44px 0 0; padding: 0; list-style: none; counter-reset: pgprocess; }
.pg-process li { position: relative; min-height: 230px; padding: 24px 24px 28px; background: var(--pg-surface); border-top: 3px solid var(--pg-blue-strong); border-bottom: 1px solid var(--pg-line); counter-increment: pgprocess; }
.pg-process li:first-child { border-left: 1px solid var(--pg-line); border-radius: var(--pg-radius) 0 0 var(--pg-radius); }
.pg-process li:last-child { border-right: 1px solid var(--pg-line); border-radius: 0 var(--pg-radius) var(--pg-radius) 0; }
.pg-process li + li { border-left: 1px solid var(--pg-line); }
.pg-process span { color: var(--pg-blue-strong); font-size: .82rem; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; }
.pg-process strong { display: block; margin-top: 34px; color: var(--pg-ink); font-size: 1.16rem; }
.pg-process p { margin: 8px 0 0; color: var(--pg-ink-soft); font-size: .93rem; line-height: 1.55; }
.pg-process li::before { position: absolute; top: 19px; right: 21px; content: counter(pgprocess, decimal-leading-zero); color: rgba(63,127,184,.25); font-size: 1.1rem; font-weight: 600; }
.pg-token-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 15px; margin-top: 22px; }
.pg-token { display: grid; grid-template-columns: 66px 1fr; align-items: center; gap: 18px; min-height: 150px; padding: 24px 26px; background: var(--pg-surface); border: 1px solid var(--pg-line); border-radius: var(--pg-radius); }
.pg-token > b { display: grid; width: 58px; height: 58px; place-items: center; color: #f8fafc; font-size: 1.6rem; background: var(--pg-blue-strong); border-radius: 14px; }
.pg-token--subject { background: rgba(232,115,90,.075); border-color: rgba(232,115,90,.25); }
.pg-token--composition { background: rgba(91,143,214,.075); border-color: rgba(91,143,214,.25); }
.pg-token--integrity { background: rgba(183,138,201,.075); border-color: rgba(183,138,201,.25); }
.pg-token--aesthetics { background: rgba(99,178,138,.075); border-color: rgba(99,178,138,.25); }
.pg-token--subject > b { background: var(--pg-subject); }
.pg-token--composition > b { background: var(--pg-composition); }
.pg-token--integrity > b { background: var(--pg-integrity); }
.pg-token--aesthetics > b { background: var(--pg-aesthetic); }
.pg-token h3 { margin: 0; color: var(--pg-ink); font-size: 1.16rem; }
.pg-token p { margin: 5px 0 0; color: var(--pg-ink-soft); font-size: .94rem; }

.pg-table-wrap { margin-top: 40px; overflow-x: auto; background: var(--pg-surface); border: 1px solid var(--pg-line); border-radius: var(--pg-radius); box-shadow: 0 16px 38px rgba(23,32,51,.07); }
.pg-results-table { width: 100%; min-width: 930px; border-collapse: collapse; font-size: .91rem; font-variant-numeric: tabular-nums; }
.pg-results-table th, .pg-results-table td { padding: 12px 13px; text-align: center; border-bottom: 1px solid rgba(23,32,51,.09); }
.pg-results-table th { color: var(--pg-ink); font-weight: 600; background: #edf2f7; }
.pg-results-table td:first-child, .pg-results-table th[rowspan]:first-child { position: sticky; left: 0; z-index: 1; text-align: left; background: var(--pg-surface); }
.pg-results-table caption { padding: 18px; text-align: left; font-weight: 600; }
.pg-results-table .pg-method-divider td { border-top: 2px solid var(--pg-line); }
.pg-results-table th:first-child { background: #edf2f7; }
.pg-results-table tbody tr:last-child td { border-bottom: 0; }
.pg-results-table .pg-ours td:first-child { color: var(--pg-blue-strong); font-weight: 700; }
.pg-best { background: #fdbfbf !important; }
.pg-second { background: #ffdfbf !important; }
.pg-third { background: #fef0c6 !important; }
.pg-table-note { max-width: 900px; margin: 15px 0 0; color: var(--pg-ink-soft); font-size: .92rem; }
.pg-gallery-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 54px; }
.pg-gallery-heading h3 { margin: 0; color: var(--pg-ink); font-size: 1.48rem; }
.pg-segmented { display: inline-flex; padding: 4px; background: rgba(23,32,51,.06); border: 1px solid rgba(23,32,51,.1); border-radius: 999px; }
.pg-segmented button { min-width: 78px; padding: 8px 14px; color: var(--pg-ink-soft); cursor: pointer; background: transparent; border: 0; border-radius: 999px; }
.pg-segmented button.is-active { color: var(--pg-ink); background: var(--pg-surface); box-shadow: 0 1px 5px rgba(23,32,51,.12); }
.pg-benchmark-key { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 16px; color: var(--pg-ink-soft); font-size: .88rem; }
.pg-benchmark-key span { display: inline-flex; align-items: center; gap: 7px; }
.pg-benchmark-key strong { color: var(--pg-ink); font-weight: 600; }
.pg-benchmark-key i { width: 25px; height: 4px; border-radius: 2px; }
.pg-benchmark-key__ours { background: #f1a300; }
.pg-benchmark-key__gt { background: #45d779; }
.pg-benchmark-gallery { columns: 4 220px; column-gap: 14px; margin-top: 20px; }
.pg-benchmark-gallery figure { display: inline-block; width: 100%; overflow: hidden; margin: 0 0 14px; break-inside: avoid; background: #e9edf2; border: 1px solid var(--pg-line); border-radius: var(--pg-radius); }
.pg-benchmark-gallery img { display: block; width: 100%; height: auto; background: #e9edf2; transition: opacity 140ms ease; }
.pg-benchmark-gallery img.is-switching { opacity: .25; }
.pg-benchmark-gallery figcaption { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 11px 10px; color: var(--pg-ink-soft); font-size: .8rem; background: var(--pg-surface); border-top: 1px solid var(--pg-line); }
.pg-benchmark-gallery figcaption strong { color: var(--pg-ink); font-size: .88rem; }

.pg-study-metrics { display: grid; grid-template-columns: repeat(4,1fr); margin-top: 42px; border-top: 1px solid rgba(255,255,255,.12); border-bottom: 1px solid rgba(255,255,255,.12); }
.pg-study-metrics div { padding: 28px 25px; }
.pg-study-metrics div + div { border-left: 1px solid rgba(255,255,255,.12); }
.pg-study-metrics strong { display: block; color: #f8fafc; font-size: clamp(2.1rem,4vw,3.4rem); line-height: 1; letter-spacing: -.05em; }
.pg-study-metrics span { display: block; margin-top: 8px; color: rgba(255,255,255,.58); font-size: .92rem; }
.pg-study-grid { display: grid; grid-template-columns: 1fr; gap: 22px; margin-top: 34px; }
.pg-study-table-wrap, .pg-histogram { overflow: hidden; margin: 0; background: rgba(255,255,255,.055); border: 1px solid rgba(255,255,255,.12); border-radius: var(--pg-radius); }
.pg-study-table { width: 100%; border-collapse: collapse; font-size: .91rem; font-variant-numeric: tabular-nums; }
.pg-study-table th, .pg-study-table td { padding: 13px 12px; text-align: center; border-bottom: 1px solid rgba(255,255,255,.1); }
.pg-study-table th:first-child, .pg-study-table td:first-child { text-align: left; }
.pg-study-table th { color: rgba(255,255,255,.62); font-weight: 500; }
.pg-study-table td { color: rgba(255,255,255,.85); }
.pg-study-table .pg-ours td { color: #f8fafc; font-weight: 600; background: rgba(101,185,152,.12); }
.pg-pairwise { display: grid; grid-template-columns: repeat(3,1fr); padding: 18px; gap: 10px; }
.pg-pairwise p { margin: 0; }
.pg-pairwise strong { display: block; color: var(--pg-gold); font-size: 1.04rem; }
.pg-pairwise span { display: block; margin-top: 3px; color: rgba(255,255,255,.48); font-size: .76rem; line-height: 1.35; }
.pg-histogram { background: #f7f9fc; }
.pg-histogram img { width: 100%; aspect-ratio: 1.875/1; object-fit: contain; }
.pg-histogram figcaption { padding: 13px 16px; color: #5d687b; font-size: .86rem; border-top: 1px solid rgba(23,32,51,.12); }

.pg-top-scenes { display: grid; gap: 42px; margin-top: 44px; }
.pg-scene-detail { overflow: hidden; background: var(--pg-surface); border: 1px solid var(--pg-line); border-radius: var(--pg-radius); box-shadow: 0 18px 48px rgba(23,32,51,.08); }
.pg-scene-detail__header { display: flex; align-items: flex-end; justify-content: space-between; gap: 22px; padding: 24px 26px; }
.pg-scene-detail__header span { color: var(--pg-blue-strong); font-size: .79rem; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; }
.pg-scene-detail__header h3 { margin: 2px 0 0; color: var(--pg-ink); font-size: clamp(1.5rem,3vw,2.25rem); line-height: 1.1; text-transform: capitalize; }
.pg-scene-detail__header > p { margin: 0; color: var(--pg-ink-soft); text-align: right; }
.pg-scene-detail__header > p strong { display: block; color: var(--pg-ink); font-size: 1.55rem; line-height: 1.1; }
.pg-scene-detail__header small { display: block; }
.pg-scene-detail > video { width: 100%; aspect-ratio: 16/9; object-fit: cover; background: #e7ecf2; border-top: 1px solid var(--pg-line); border-bottom: 1px solid var(--pg-line); }
.pg-crop-triptych { display: grid; grid-template-columns: repeat(3,1fr); gap: 13px; padding: 22px; }
.pg-crop-triptych figure { overflow: hidden; margin: 0; background: #edf1f5; border: 1px solid var(--pg-line); border-radius: var(--pg-radius); }
.pg-crop-triptych__ours { border: 2px solid var(--pg-green) !important; }
.pg-crop-triptych img { width: 100%; aspect-ratio: 3/2; object-fit: contain; background: #e7ecf2; }
.pg-crop-triptych figcaption { display: grid; grid-template-columns: 1fr auto; gap: 1px 10px; padding: 11px 12px 13px; color: var(--pg-ink-soft); font-size: .85rem; }
.pg-crop-triptych figcaption strong { color: var(--pg-ink); }
.pg-crop-triptych figcaption span { text-align: right; }
.pg-crop-triptych figcaption small { grid-column: 1/-1; color: #7a8495; }
.pg-explanation { margin: 0 22px 22px; padding: 20px 22px; background: #f1f5f8; border-left: 3px solid var(--pg-blue-strong); border-radius: 0 var(--pg-radius) var(--pg-radius) 0; }
.pg-explanation .pg-score-row { margin-top: 0; }
.pg-explanation p { margin: 13px 0 0; color: var(--pg-ink-soft); font-size: .95rem; line-height: 1.62; }
.pg-heatmaps { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; padding: 0 22px 24px; }
.pg-heatmaps figure { overflow: hidden; margin: 0; border: 1px solid var(--pg-line); border-radius: var(--pg-radius); }
.pg-heatmaps img { width: 100%; aspect-ratio: 3.89/1; object-fit: cover; object-position: top; }
.pg-heatmaps figcaption { padding: 8px 11px; color: var(--pg-ink-soft); font-size: .8rem; border-top: 1px solid var(--pg-line); }

.pg-browser-heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-top: 110px; }
.pg-search { display: grid; gap: 6px; width: min(330px,100%); color: var(--pg-ink-soft); font-size: .82rem; }
.pg-search input { width: 100%; padding: 11px 15px; color: var(--pg-ink); background: var(--pg-surface); border: 1px solid var(--pg-line); border-radius: 999px; }
.pg-filter-row { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 24px; }
.pg-filter-row button { min-height: 39px; padding: 0 15px; color: var(--pg-ink-soft); cursor: pointer; background: transparent; border: 1px solid var(--pg-line); border-radius: 999px; }
.pg-filter-row button:hover { color: var(--pg-ink); border-color: rgba(23,32,51,.3); }
.pg-filter-row button.is-active { color: #f8fafc; background: var(--pg-ink); border-color: var(--pg-ink); }
.pg-browser-status { margin: 12px 0 0; color: var(--pg-ink-soft); font-size: .86rem; }
.pg-scene-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; margin-top: 20px; }
.pg-scene-card { overflow: hidden; padding: 0; color: var(--pg-ink); text-align: left; cursor: pointer; background: var(--pg-surface); border: 1px solid var(--pg-line); border-radius: var(--pg-radius); transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease; }
.pg-scene-card:hover { border-color: rgba(63,127,184,.38); transform: translateY(-3px); box-shadow: 0 16px 34px rgba(23,32,51,.11); }
.pg-scene-card:active { transform: translateY(-1px) scale(.99); }
.pg-scene-card[hidden] { display: none; }
.pg-scene-card { content-visibility: auto; contain-intrinsic-size: auto 245px; }
.pg-scene-card img { width: 100%; aspect-ratio: 3/2; object-fit: cover; background: #e7ecf2; transition: transform 220ms cubic-bezier(.16,1,.3,1); }
.pg-scene-card:hover img { transform: scale(1.025); }
.pg-scene-card__body { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; padding: 12px 13px 14px; }
.pg-scene-card__body small { grid-column: 1/-1; color: var(--pg-blue-strong); font-size: .71rem; font-style: normal; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; }
.pg-scene-card__body strong { overflow: hidden; font-size: .93rem; font-weight: 600; text-overflow: ellipsis; text-transform: capitalize; white-space: nowrap; }
.pg-scene-card__body em { color: var(--pg-ink-soft); font-size: .78rem; font-style: normal; white-space: nowrap; }


.pg-scene-dialog { width: min(calc(100% - 28px),1100px); max-height: calc(100dvh - 28px); padding: 0; color: var(--pg-ink); background: var(--pg-surface); border: 1px solid rgba(255,255,255,.18); border-radius: var(--pg-radius); box-shadow: 0 36px 110px rgba(0,0,0,.48); }
.pg-scene-dialog::backdrop { background: rgba(5,8,13,.76); backdrop-filter: blur(8px); }
.pg-dialog-close { position: sticky; z-index: 2; top: 14px; float: right; margin: 14px 14px -52px 0; padding: 8px 14px; color: #f8fafc; cursor: pointer; background: rgba(9,13,21,.84); border: 1px solid rgba(255,255,255,.16); border-radius: 999px; }
.pg-dialog-content { padding: 28px; }
.pg-dialog-content header { padding-right: 70px; }
.pg-dialog-content header > span { color: var(--pg-blue-strong); font-size: .78rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.pg-dialog-content h2 { margin: 3px 0 0; font-size: clamp(1.7rem,4vw,2.6rem); line-height: 1.12; text-transform: capitalize; }
.pg-dialog-content header p { margin: 8px 0 0; color: var(--pg-ink-soft); }
.pg-dialog-crops { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 22px; }
.pg-dialog-crops figure, .pg-dialog-heatmaps figure { overflow: hidden; margin: 0; border: 1px solid var(--pg-line); border-radius: var(--pg-radius); }
.pg-dialog-crops img { width: 100%; aspect-ratio: 3/2; object-fit: contain; background: #e7ecf2; }
.pg-dialog-crops figcaption, .pg-dialog-heatmaps figcaption { padding: 8px 11px; color: var(--pg-ink-soft); font-size: .82rem; border-top: 1px solid var(--pg-line); }
.pg-dialog-content .pg-explanation { margin: 18px 0; }
.pg-dialog-heatmaps { display: grid; grid-template-columns: 1fr; gap: 12px; }
.pg-dialog-heatmaps img { width: 100%; }

.pg-footer { color: rgba(255,255,255,.56); background: var(--pg-night); border-top: 1px solid rgba(255,255,255,.08); }
.pg-footer .pg-shell { display: flex; justify-content: space-between; gap: 20px; padding: 26px 0; font-size: .9rem; }

@media (max-width: 960px) {
  .pg-nav__inner { align-items: stretch; flex-direction: column; gap: 0; padding: 10px 0 8px; }
  .pg-nav__brand { min-height: 36px; }
  .pg-nav__links { width: 100%; gap: 22px; padding: 7px 0 3px; }
  .pg-hero__videos, .pg-study-grid { grid-template-columns: 1fr; }
  .pg-facts, .pg-study-metrics { grid-template-columns: repeat(2,1fr); }
  .pg-facts div:nth-child(3), .pg-study-metrics div:nth-child(3) { border-left: 0; }
  .pg-facts div:nth-child(n+3) { padding-top: 22px; }
  .pg-process { grid-template-columns: repeat(2,1fr); gap: 12px; }
  .pg-process li, .pg-process li:first-child, .pg-process li:last-child { border: 1px solid var(--pg-line); border-top: 3px solid var(--pg-blue-strong); border-radius: var(--pg-radius); }
  .pg-benchmark-gallery { grid-template-columns: repeat(4,1fr); }
  .pg-scene-grid { grid-template-columns: repeat(3,1fr); }
}

@media (max-width: 720px) {
  .pg-shell { width: min(calc(100% - 30px), var(--pg-content)); }
  .pg-nav__inner { width: calc(100% - 30px); }
  .pg-nav__links { font-size: .88rem; }
  .pg-hero__inner { padding: 42px 0 48px; }
  .pg-hero__eyebrow { font-size: .9rem; }
  .pg-hero h1 { font-size: 2.65rem; }
  .pg-hero__title { font-size: 1.27rem; }
  .pg-hero__dek { font-size: .96rem; }
  .pg-hero__videos { gap: 15px; margin-top: 30px; }
  .pg-hero-card__body { padding: 16px; }
  .pg-paper-figure { margin-top: 30px; }
  .pg-paper-figure__viewport { padding: 9px; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: thin; touch-action: pan-x pan-y; -webkit-overflow-scrolling: touch; }
  .pg-paper-figure__viewport > a { width: max-content; }
  .pg-paper-figure__image { width: 980px !important; max-width: none; }
  .pg-paper-figure figcaption { padding: 12px 14px 14px; font-size: .86rem; }
  .pg-section { padding: 74px 0; }
  .pg-section h2 { font-size: 2.14rem; }
  .pg-lede { font-size: 1rem; }
  .pg-overview-media { grid-template-columns: 1fr; }
  .pg-overview-arrow { margin-inline: auto; transform: rotate(90deg); }
  .pg-facts div, .pg-study-metrics div { padding: 22px 16px; }
  .pg-facts div:nth-child(odd), .pg-study-metrics div:nth-child(odd) { border-left: 0; }
  .pg-facts div:nth-child(n+3), .pg-study-metrics div:nth-child(n+3) { border-top: 1px solid var(--pg-line); }
  .pg-study-metrics div:nth-child(n+3) { border-top-color: rgba(255,255,255,.12); }
  .pg-process, .pg-token-grid { grid-template-columns: 1fr; }
  .pg-process li { min-height: auto; }
  .pg-process strong { margin-top: 24px; }
  .pg-token { grid-template-columns: 52px 1fr; min-height: 130px; padding: 20px; }
  .pg-token > b { width: 50px; height: 50px; }
  .pg-gallery-heading { align-items: flex-start; flex-direction: column; }
  .pg-benchmark-gallery { columns: 2; column-gap: 10px; }
  .pg-benchmark-gallery figure { margin-bottom: 10px; }
  .pg-pairwise { grid-template-columns: 1fr; }
  .pg-scene-detail__header { align-items: flex-start; flex-direction: column; }
  .pg-scene-detail__header > p { text-align: left; }
  .pg-crop-triptych, .pg-dialog-crops { grid-template-columns: 1fr; }
  .pg-heatmaps { grid-template-columns: 1fr; }
  .pg-heatmaps img { aspect-ratio: auto; object-fit: contain; }
  .pg-browser-heading { align-items: flex-start; flex-direction: column; margin-top: 80px; }
  .pg-search { width: 100%; }
  .pg-filter-row { flex-wrap: nowrap; margin-right: -15px; padding-right: 15px; overflow-x: auto; scrollbar-width: none; }
  .pg-filter-row::-webkit-scrollbar { display: none; }
  .pg-filter-row button { flex: 0 0 auto; }
  .pg-scene-grid { grid-template-columns: repeat(2,1fr); gap: 12px; }
  .pg-scene-card__body { grid-template-columns: 1fr; }
  .pg-scene-card__body em { margin-top: 3px; }
  .pg-dialog-content { padding: 20px 14px; }
  .pg-footer .pg-shell { flex-direction: column; gap: 4px; }
}

@media (max-width: 420px) {
  .pg-hero-card__heading { align-items: flex-start; flex-direction: column; gap: 3px; }
  .pg-score-row { gap: 6px; }
  .pg-score-row span { min-width: 51px; padding: 4px 8px; }
  .pg-study-table-wrap { overflow-x: auto; }
  .pg-study-table { min-width: 510px; }
  .pg-scene-grid { grid-template-columns: 1fr 1fr; }
  .pg-scene-card__body { padding: 10px; }
  .pg-scene-card__body strong { font-size: .84rem; }
}

/* Match the equivalent reading roles in rlawb-showcase.css. */
.pg-section h2 { font-size: clamp(2.04rem, 3.55vw, 3.04rem); line-height: 1.14; }
.pg-lede, .pg-hero-card p, .pg-explanation p, .pg-expl-comparison p,
.pg-token p, .pg-process p { font-size: 1.11rem; line-height: 25px; }
.pg-paper-figure figcaption, .pg-expl-images figcaption,
.pg-crop-triptych figcaption, .pg-heatmaps figcaption,
.pg-dialog-crops figcaption, .pg-dialog-heatmaps figcaption,
.pg-expl-note, .pg-table-note { font-size: .97rem; line-height: 25px; }
.pg-expl-controls button, .pg-filter-row button, .pg-segmented button { font-size: .97rem; }
.pg-kicker { font-size: .91rem; }
.pg-nav__links { font-size: 1.01rem; }
.pg-results-table, .pg-study-table { font-size: .95rem; }
.pg-expl-results small, .pg-facts small, .pg-study-metrics span,
.pg-pairwise span { font-size: .97rem; line-height: 25px; }
.pg-hero__dek { font-size: 1.05rem; line-height: 25px; }
@media (max-width: 720px) {
  .pg-section h2 { font-size: 2.04rem; }
  .pg-lede, .pg-hero-card p, .pg-explanation p, .pg-expl-comparison p,
  .pg-token p, .pg-process p { font-size: 1.07rem; }
  .pg-nav__links { font-size: .87rem; }
  .pg-hero__dek { font-size: .99rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}