[hidden] { display: none !important; }
:root {
  --bg: #f5f7fb;
  --surface: #ffffff;
  --surface-2: #edf1f8;
  --text: #172033;
  --muted: #667085;
  --line: #d9e0eb;
  --dark: #081321;
  --dark-2: #0d1a2d;
  --dark-3: #13243b;
  --dark-text: #eef4ff;
  --dark-muted: #a9b7cc;
  --clip: #2d9cff;
  --dino: #f4a340;
  --fusion: #7557f6;
  --real: #20ad82;
  --fake: #e85d6a;
  --shadow-sm: 0 8px 24px rgba(25, 39, 63, .08);
  --shadow-md: 0 20px 60px rgba(20, 34, 58, .13);
  --radius-sm: 12px;
  --radius: 18px;
  --radius-lg: 28px;
  --container: 1200px;
  --header-h: 72px;
  --ease: cubic-bezier(.2,.7,.2,1);
}

[data-theme="dark"] {
  --bg: #07111e;
  --surface: #0d1a2a;
  --surface-2: #112136;
  --text: #edf4ff;
  --muted: #a7b4c8;
  --line: #233650;
  --shadow-sm: 0 8px 24px rgba(0,0,0,.22);
  --shadow-md: 0 20px 60px rgba(0,0,0,.34);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--text);
  background: var(--bg);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body.lock-scroll { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { color: inherit; }
img { display: block; max-width: 100%; }
svg { display: block; }
::selection { background: rgba(117,87,246,.24); }

.skip-link {
  position: fixed;
  left: 16px;
  top: -80px;
  z-index: 9999;
  padding: 10px 16px;
  border-radius: 10px;
  color: #fff;
  background: var(--fusion);
  transition: top .2s ease;
}
.skip-link:focus { top: 16px; }

.container { width: min(calc(100% - 40px), var(--container)); margin-inline: auto; }
.section { position: relative; padding: 112px 0; overflow: clip; }
.section-light { background: var(--surface); }
.section-tint { background: var(--bg); }
.section-dark { color: var(--dark-text); background: var(--dark); }

.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 1000;
  height: var(--header-h);
  border-bottom: 1px solid rgba(255,255,255,.08);
  background: rgba(8,19,33,.72);
  backdrop-filter: blur(18px) saturate(150%);
  transition: background .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.site-header.scrolled { background: rgba(8,19,33,.92); box-shadow: 0 10px 30px rgba(0,0,0,.16); }
.nav-shell {
  width: min(calc(100% - 32px), 1320px);
  height: 100%;
  margin-inline: auto;
  display: flex;
  align-items: center;
  gap: 28px;
}
.brand { display: inline-flex; align-items: center; gap: 10px; color: #fff; font-weight: 800; letter-spacing: -.02em; white-space: nowrap; }
.brand-mark { position: relative; width: 30px; height: 30px; display: inline-block; }
.brand-stroke { position: absolute; width: 17px; height: 17px; border: 3px solid; border-radius: 50%; top: 6px; }
.brand-stroke.clip { left: 0; border-color: var(--clip); }
.brand-stroke.dino { right: 0; border-color: var(--dino); }
.brand-core { position: absolute; width: 8px; height: 8px; background: var(--fusion); border-radius: 50%; left: 11px; top: 11px; box-shadow: 0 0 16px rgba(117,87,246,.85); }
.primary-nav { margin-left: auto; display: flex; align-items: center; gap: 6px; }
.primary-nav a { position: relative; color: #b8c5d9; font-size: .9rem; font-weight: 650; padding: 9px 10px; border-radius: 999px; transition: color .2s ease, background .2s ease; }
.primary-nav a:hover, .primary-nav a.active { color: #fff; background: rgba(255,255,255,.08); }
.theme-toggle, .nav-toggle {
  border: 0;
  background: rgba(255,255,255,.08);
  color: #fff;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  cursor: pointer;
}
.theme-toggle svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.theme-toggle .moon { display: none; }
[data-theme="dark"] .theme-toggle .sun { display: none; }
[data-theme="dark"] .theme-toggle .moon { display: block; }
.nav-toggle { display: none; margin-left: auto; gap: 4px; padding: 10px; }
.nav-toggle span { width: 19px; height: 2px; background: #fff; border-radius: 2px; transition: transform .2s ease, opacity .2s ease; }

.hero {
  min-height: 100vh;
  padding: 150px 0 72px;
  isolation: isolate;
  background:
    radial-gradient(circle at 72% 24%, rgba(117,87,246,.19), transparent 28%),
    radial-gradient(circle at 15% 30%, rgba(45,156,255,.11), transparent 30%),
    linear-gradient(135deg, #07111e 0%, #081321 58%, #0d1729 100%);
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  opacity: .18;
  background-image:
    linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(to bottom, #000 0%, transparent 72%);
}
.hero-orb { position: absolute; border-radius: 50%; filter: blur(2px); opacity: .35; pointer-events: none; z-index: -1; }
.orb-one { width: 420px; height: 420px; right: -160px; top: 80px; background: radial-gradient(circle, rgba(117,87,246,.48), transparent 70%); }
.orb-two { width: 340px; height: 340px; left: -150px; bottom: 100px; background: radial-gradient(circle, rgba(45,156,255,.3), transparent 70%); }
.hero-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 68px; align-items: center; }
.hero-copy { max-width: 760px; }
.eyebrow-row { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 24px; }
.conference-badge, .page-badge {
  display: inline-flex;
  align-items: center;
  min-height: 31px;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 750;
  letter-spacing: .035em;
  text-transform: uppercase;
}
.conference-badge { background: linear-gradient(135deg, rgba(117,87,246,.25), rgba(45,156,255,.18)); border: 1px solid rgba(147,130,255,.36); color: #dcd5ff; }
.page-badge { border: 1px solid rgba(255,255,255,.14); color: #b9c6d8; }
.hero h1 {
  margin: 0;
  max-width: 820px;
  font-family: "Space Grotesk", Inter, ui-sans-serif, sans-serif;
  font-size: clamp(3rem, 5.8vw, 5.7rem);
  line-height: .98;
  letter-spacing: -.065em;
  text-wrap: balance;
}
.text-clip { color: var(--clip); text-shadow: 0 0 40px rgba(45,156,255,.28); }
.text-dino { color: var(--dino); text-shadow: 0 0 40px rgba(244,163,64,.25); }
.hero-lead { margin: 28px 0 24px; max-width: 700px; color: #bcc9dc; font-size: clamp(1.04rem, 1.5vw, 1.22rem); line-height: 1.72; }
.authors { display: flex; flex-wrap: wrap; gap: 5px 20px; color: #f7f9ff; font-weight: 640; }
.authors span { white-space: nowrap; }
.authors sup, .affiliations sup { color: #9ea9ff; font-size: .7em; }
.affiliations { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 8px; color: #94a5bc; font-size: .86rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.button {
  min-height: 45px;
  padding: 10px 17px;
  border: 1px solid transparent;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: .9rem;
  font-weight: 760;
  cursor: pointer;
  transition: transform .2s var(--ease), border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.button:hover { transform: translateY(-2px); }
.button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.button-primary { color: #fff; background: linear-gradient(135deg, #7557f6, #5e47d8); box-shadow: 0 12px 32px rgba(117,87,246,.28); }
.button-primary:hover { box-shadow: 0 16px 40px rgba(117,87,246,.38); }
.button-secondary { color: #e7edf8; background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.14); }
.button-secondary:hover { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.24); }
.button.compact { min-height: 40px; padding: 8px 15px; }

.hero-visual { min-width: 0; }
.fusion-card {
  position: relative;
  padding: 22px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 28px;
  background: linear-gradient(150deg, rgba(255,255,255,.08), rgba(255,255,255,.025));
  box-shadow: 0 30px 90px rgba(0,0,0,.35);
  backdrop-filter: blur(20px);
  overflow: hidden;
}
.fusion-card::before { content: ""; position: absolute; width: 220px; height: 220px; right: -80px; bottom: -80px; border-radius: 50%; background: radial-gradient(circle, rgba(117,87,246,.28), transparent 70%); }
.fusion-topline { display: flex; justify-content: space-between; gap: 18px; margin-bottom: 16px; color: #9eabc0; font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; }
.live-dot { position: relative; padding-left: 12px; }
.live-dot::before { content: ""; position: absolute; left: 0; top: .5em; width: 6px; height: 6px; border-radius: 50%; background: var(--real); box-shadow: 0 0 0 6px rgba(32,173,130,.1); }
.branch-card {
  position: relative;
  min-height: 90px;
  display: grid;
  grid-template-columns: 48px 1fr auto;
  align-items: center;
  gap: 14px;
  padding: 14px;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 17px;
  background: rgba(3,10,20,.42);
  overflow: hidden;
}
.branch-card + .fusion-path + .branch-card { margin-top: 0; }
.branch-card strong { display: block; font-size: 1.02rem; }
.branch-card span { display: block; color: #9fadc2; font-size: .8rem; }
.branch-icon { width: 42px; height: 42px; border-radius: 13px; display: grid; place-items: center; font-weight: 900; font-size: 1.1rem; }
.clip-card .branch-icon { color: #bfe2ff; background: rgba(45,156,255,.18); border: 1px solid rgba(45,156,255,.35); }
.dino-card .branch-icon { color: #ffe0ba; background: rgba(244,163,64,.16); border: 1px solid rgba(244,163,64,.34); }
.signal { display: flex; align-items: flex-end; gap: 4px; height: 30px; }
.signal i { width: 5px; border-radius: 4px; animation: signal 1.8s ease-in-out infinite alternate; }
.signal i:nth-child(1) { height: 35%; animation-delay: -.8s; }
.signal i:nth-child(2) { height: 75%; animation-delay: -.5s; }
.signal i:nth-child(3) { height: 48%; animation-delay: -.2s; }
.signal i:nth-child(4) { height: 90%; }
.signal-clip i { background: var(--clip); box-shadow: 0 0 10px rgba(45,156,255,.45); }
.signal-dino i { background: var(--dino); box-shadow: 0 0 10px rgba(244,163,64,.4); }
@keyframes signal { to { transform: scaleY(.55); opacity: .55; } }
.fusion-path { position: relative; height: 112px; margin: -10px 0; }
.fusion-path svg { width: 100%; height: 100%; overflow: visible; }
.fusion-path path { fill: none; stroke-width: 4; stroke-linecap: round; stroke-dasharray: 9 8; animation: dash 3.2s linear infinite; }
.path-clip { stroke: url(#clipPath); }
.path-dino { stroke: url(#dinoPath); }
.path-out { stroke: #9e8cff; }
.fusion-node { fill: rgba(117,87,246,.28); stroke: #9c89ff; stroke-width: 2; filter: drop-shadow(0 0 12px rgba(117,87,246,.72)); }
@keyframes dash { to { stroke-dashoffset: -68; } }
.fusion-label { position: absolute; left: 72%; top: 50%; transform: translate(-50%,-50%); font-size: .75rem; font-weight: 900; color: #fff; }
.prediction-pill { position: absolute; right: -5px; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; align-items: center; gap: 0; color: #fff; font-size: .72rem; line-height: 1.1; }
.prediction-pill b:first-child { color: #54d8b0; }
.prediction-pill b:last-child { color: #ff8290; }
.prediction-pill span { color: #8fa0b7; }
.fusion-caption { position: relative; display: grid; gap: 8px; margin-top: 18px; color: #9daabd; font-size: .78rem; }
.fusion-caption span { display: flex; align-items: center; gap: 8px; }
.dot { width: 8px; height: 8px; border-radius: 50%; }
.clip-dot { background: var(--clip); }
.dino-dot { background: var(--dino); }
.fusion-dot { background: var(--fusion); }
.metrics-grid { margin-top: 68px; display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid rgba(255,255,255,.1); border-radius: 22px; background: rgba(255,255,255,.045); overflow: hidden; }
.metrics-grid article { padding: 24px 28px; border-right: 1px solid rgba(255,255,255,.1); }
.metrics-grid article:last-child { border-right: 0; }
.metrics-grid strong { display: block; font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: clamp(1.65rem, 3vw, 2.45rem); line-height: 1.1; letter-spacing: -.045em; }
.metrics-grid span { display: block; margin-top: 6px; color: #9dacbf; font-size: .83rem; }

.kicker { margin: 0 0 10px; color: var(--fusion); font-size: .76rem; font-weight: 850; text-transform: uppercase; letter-spacing: .14em; }
.section-dark .kicker { color: #a996ff; }
h2, h3 { font-family: "Space Grotesk", Inter, ui-sans-serif, sans-serif; }
h2 { margin: 0; font-size: clamp(2.3rem, 4vw, 4.1rem); line-height: 1.06; letter-spacing: -.052em; text-wrap: balance; }
h3 { margin: 0; font-size: clamp(1.15rem, 2vw, 1.55rem); line-height: 1.23; letter-spacing: -.03em; }
.split-heading { display: grid; grid-template-columns: minmax(0, .95fr) minmax(320px, .65fr); gap: 80px; align-items: end; margin-bottom: 56px; }
.section-intro { margin: 0; color: var(--muted); font-size: 1.05rem; }
.section-dark .section-intro { color: var(--dark-muted); }
.centered-heading { max-width: 820px; margin-bottom: 56px; text-align: center; }
.centered-heading .kicker { text-align: center; }
.centered-heading p:last-child { max-width: 700px; margin: 18px auto 0; color: var(--muted); font-size: 1.05rem; }

.abstract-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 24px; align-items: stretch; }
.prose-card, .idea-stack article {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.prose-card { padding: clamp(26px, 4vw, 44px); }
.prose-card h3 { margin-bottom: 20px; }
.prose-card p { margin: 0; color: var(--muted); }
.prose-card p + p { margin-top: 15px; }
.idea-stack { display: grid; gap: 14px; }
.idea-stack article { padding: 22px; display: grid; grid-template-columns: 48px 1fr; gap: 16px; align-items: start; }
.idea-number { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; color: #fff; background: linear-gradient(135deg, var(--fusion), #947fff); font-family: ui-monospace, monospace; font-size: .78rem; font-weight: 850; box-shadow: 0 10px 24px rgba(117,87,246,.2); }
.idea-stack h3 { font-size: 1.08rem; }
.idea-stack p { margin: 5px 0 0; color: var(--muted); font-size: .92rem; }

.motivation-layout { display: grid; grid-template-columns: .78fr 1.22fr; gap: 42px; align-items: center; }
.motivation-tabs { display: inline-flex; gap: 5px; padding: 5px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); box-shadow: var(--shadow-sm); }
.tab-button, .result-tab, .visual-tab {
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  padding: 9px 15px;
  font-size: .84rem;
  font-weight: 760;
  cursor: pointer;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}
.tab-button:hover, .result-tab:hover, .visual-tab:hover { color: var(--text); }
.tab-button.active, .result-tab.active, .visual-tab.active { color: #fff; background: var(--fusion); box-shadow: 0 8px 18px rgba(117,87,246,.24); }
.case-text { display: none; padding-top: 28px; }
.case-text.active { display: block; animation: fadeUp .35s var(--ease); }
.case-label { color: var(--fusion); font-size: .77rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.case-text h3 { margin-top: 10px; font-size: clamp(1.5rem, 2.7vw, 2.2rem); }
.case-text p { margin: 14px 0 0; color: var(--muted); }
.legend-inline { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 28px; color: var(--muted); font-size: .84rem; }
.legend-inline span { display: flex; align-items: center; gap: 8px; }
.legend-border { width: 14px; height: 14px; border: 2px solid; border-radius: 3px; }
.legend-border.correct { border-color: var(--real); }
.legend-border.incorrect { border-color: var(--fake); }
.case-figure { position: relative; min-width: 0; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-md); }
.case-columns { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-bottom: 10px; text-align: center; color: var(--muted); font-size: .78rem; font-weight: 750; }
.case-image { display: none; width: 100%; border-radius: 12px; }
.case-image.active { display: block; animation: fadeIn .35s ease; }
.figure-expand { position: absolute; right: 34px; bottom: 34px; border: 1px solid rgba(255,255,255,.72); border-radius: 999px; padding: 8px 12px; color: #fff; background: rgba(8,19,33,.76); backdrop-filter: blur(8px); cursor: pointer; font-size: .78rem; font-weight: 700; }
.insight-banner { margin-top: 42px; padding: 24px 28px; border-radius: 20px; display: grid; grid-template-columns: auto 1fr; gap: 22px; align-items: center; color: #fff; background: linear-gradient(120deg, #6a4cef, #7d63f7 55%, #508fef); box-shadow: 0 20px 45px rgba(117,87,246,.22); }
.insight-banner strong { text-transform: uppercase; letter-spacing: .08em; font-size: .74rem; }
.insight-banner p { margin: 0; font-size: 1.01rem; }

.method-section { background: linear-gradient(180deg, #081321 0%, #0a1626 100%); }
.method-steps { display: grid; gap: 18px; }
.method-step {
  min-height: 245px;
  display: grid;
  grid-template-columns: 70px 1.02fr .98fr;
  gap: 24px;
  align-items: center;
  padding: 30px;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.025));
  overflow: hidden;
}
.step-index { align-self: start; color: rgba(255,255,255,.28); font-family: ui-monospace, monospace; font-size: 2rem; font-weight: 800; }
.step-tag { display: inline-block; margin-bottom: 8px; color: #9c88ff; font-size: .75rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.step-copy p { margin: 12px 0 0; color: #9eadc2; }
.formula { width: fit-content; margin-top: 16px; padding: 8px 13px; border: 1px solid rgba(169,150,255,.24); border-radius: 10px; color: #dcd4ff; background: rgba(117,87,246,.12); font-family: "IBM Plex Mono", ui-monospace, monospace; }
.layer-visual { display: grid; gap: 18px; padding: 22px; border-radius: 18px; background: rgba(1,8,17,.42); }
.layer-branch { display: grid; grid-template-columns: 52px repeat(6, 1fr); gap: 8px; align-items: center; }
.layer-branch strong { font-size: .76rem; color: #c8d3e2; }
.layer-branch span { height: 54px; border-radius: 8px; transform-origin: center; animation: layerPulse 2.8s ease-in-out infinite alternate; }
.layer-branch span:nth-child(3) { animation-delay: -.5s; }
.layer-branch span:nth-child(4) { animation-delay: -1s; }
.layer-branch span:nth-child(5) { animation-delay: -1.5s; }
.layer-branch span:nth-child(6) { animation-delay: -2s; }
.layer-branch span:nth-child(7) { animation-delay: -2.5s; }
.clip-layers span { border: 1px solid rgba(45,156,255,.26); background: linear-gradient(180deg, rgba(45,156,255,.25), rgba(45,156,255,.06)); }
.dino-layers span { border: 1px solid rgba(244,163,64,.24); background: linear-gradient(180deg, rgba(244,163,64,.22), rgba(244,163,64,.05)); }
@keyframes layerPulse { to { transform: translateY(-5px); filter: brightness(1.35); } }
.routing-visual { display: grid; grid-template-columns: 1fr auto auto auto; gap: 12px; align-items: center; padding: 24px; border-radius: 18px; background: rgba(1,8,17,.42); }
.route-bars { height: 160px; display: flex; align-items: flex-end; gap: 9px; padding: 12px; border: 1px solid rgba(45,156,255,.16); border-radius: 14px; }
.route-bars i { width: 18px; height: var(--v); border-radius: 8px 8px 3px 3px; background: linear-gradient(180deg, #59b3ff, rgba(45,156,255,.18)); animation: routeShift 4s ease-in-out infinite alternate; }
.route-bars i:nth-child(2) { animation-delay: -.8s; }.route-bars i:nth-child(3) { animation-delay: -1.6s; }.route-bars i:nth-child(4) { animation-delay: -2.4s; }.route-bars i:nth-child(5) { animation-delay: -3.2s; }
@keyframes routeShift { to { transform: scaleY(.72); filter: hue-rotate(12deg); } }
.gate-node, .expert-node, .route-output { display: grid; place-items: center; text-align: center; border-radius: 13px; font-size: .75rem; font-weight: 760; }
.gate-node { width: 60px; height: 82px; border: 1px solid rgba(117,87,246,.4); background: rgba(117,87,246,.18); }
.expert-node { width: 78px; height: 82px; border: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.06); }
.route-output { width: 52px; height: 52px; color: #d4eaff; border: 1px solid rgba(45,156,255,.38); background: rgba(45,156,255,.18); font-family: ui-monospace, monospace; font-size: 1.05rem; }
.uncertainty-demo { padding: 22px; border-radius: 18px; background: rgba(1,8,17,.42); }
.demo-switch { display: flex; gap: 5px; padding: 4px; margin-bottom: 22px; border-radius: 10px; background: rgba(255,255,255,.055); }
.demo-switch button { flex: 1; border: 0; border-radius: 8px; padding: 7px 8px; color: #9eadc2; background: transparent; font-size: .72rem; font-weight: 700; cursor: pointer; }
.demo-switch button.active { color: #fff; background: rgba(117,87,246,.36); }
.reliability-row { display: grid; grid-template-columns: 115px 1fr 52px; gap: 12px; align-items: center; margin-top: 14px; color: #b8c5d6; font-size: .78rem; }
.reliability-row > div { height: 10px; border-radius: 999px; background: rgba(255,255,255,.08); overflow: hidden; }
.reliability-row i { display: block; height: 100%; width: var(--rel, 72%); border-radius: inherit; transition: width .55s var(--ease); }
.clip-reliability i { background: linear-gradient(90deg, #187ccd, var(--clip)); box-shadow: 0 0 16px rgba(45,156,255,.35); }
.dino-reliability i { background: linear-gradient(90deg, #bd6d14, var(--dino)); box-shadow: 0 0 16px rgba(244,163,64,.3); }
.reliability-row strong { color: #dbe4f2; font-size: .72rem; }
.uncertainty-demo small { display: block; margin-top: 16px; color: #788aa3; }
.full-figure-card { margin-top: 28px; padding: 24px; border: 1px solid rgba(255,255,255,.11); border-radius: 24px; background: rgba(255,255,255,.045); }
.figure-card-heading { display: flex; justify-content: space-between; gap: 22px; align-items: center; margin-bottom: 18px; }
.figure-card-heading span { color: #9b8aff; font-size: .74rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.figure-card-heading h3 { margin-top: 4px; }
.full-figure-card img { width: 100%; border-radius: 15px; background: #fff; }

.benchmark-stats { display: grid; grid-template-columns: repeat(4,1fr); margin-bottom: 22px; border: 1px solid var(--line); border-radius: 20px; overflow: hidden; background: var(--surface); box-shadow: var(--shadow-sm); }
.benchmark-stats article { padding: 22px; border-right: 1px solid var(--line); }
.benchmark-stats article:last-child { border-right: 0; }
.benchmark-stats strong { display: block; font-family: ui-monospace, monospace; font-size: clamp(1.35rem, 2.4vw, 2rem); letter-spacing: -.04em; }
.benchmark-stats span { color: var(--muted); font-size: .82rem; }
.split-panel { display: grid; grid-template-columns: .72fr 1.28fr; gap: 30px; align-items: center; padding: 28px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm); }
.panel-number { display: block; margin-bottom: 8px; color: var(--fusion); font-family: ui-monospace, monospace; font-size: .84rem; font-weight: 850; }
.panel-copy p { color: var(--muted); }
.taxonomy-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; margin-top: 22px; }
.taxonomy-grid span { padding: 11px 12px; border: 1px solid var(--line); border-radius: 12px; color: var(--muted); background: var(--bg); font-size: .78rem; }
.taxonomy-grid b { display: inline-grid; place-items: center; width: 34px; height: 27px; margin-right: 7px; border-radius: 8px; color: #fff; background: var(--fusion); font-size: .7rem; }
.panel-figure, .pipeline-figure { position: relative; }
.panel-figure img, .pipeline-figure img { width: 100%; border-radius: 14px; }
.panel-figure button, .pipeline-figure button { position: absolute; right: 12px; bottom: 12px; border: 1px solid rgba(255,255,255,.6); border-radius: 999px; padding: 7px 11px; color: #fff; background: rgba(8,19,33,.72); cursor: pointer; font-size: .75rem; }
.generator-section { margin-top: 22px; padding: 30px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm); }
.generator-heading { display: flex; justify-content: space-between; gap: 24px; align-items: end; }
.generator-heading p { max-width: 420px; margin: 0; color: var(--muted); }
.generator-grid { height: 260px; display: grid; grid-template-columns: repeat(8,1fr); gap: 10px; align-items: end; margin-top: 28px; padding: 18px 18px 0; border-radius: 18px; background: linear-gradient(180deg, var(--bg), transparent); }
.generator-grid article { height: 100%; position: relative; display: flex; flex-direction: column; justify-content: end; align-items: center; text-align: center; }
.generator-grid i { order: -1; width: min(52px, 72%); height: var(--height); min-height: 28px; border-radius: 12px 12px 4px 4px; background: linear-gradient(180deg, rgba(117,87,246,.88), rgba(117,87,246,.17)); box-shadow: inset 0 1px rgba(255,255,255,.24); transition: transform .2s ease, filter .2s ease; }
.generator-grid article:hover i { transform: translateY(-5px); filter: brightness(1.12); }
.generator-grid strong { margin-top: 8px; font-family: ui-monospace, monospace; font-size: .82rem; }
.generator-grid span { min-height: 38px; margin-top: 3px; color: var(--muted); font-size: .67rem; line-height: 1.25; }
.pipeline-card { display: grid; grid-template-columns: .78fr 1.22fr; gap: 30px; align-items: center; margin-top: 22px; padding: 30px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm); }
.pipeline-copy ol { list-style: none; padding: 0; margin: 22px 0; display: grid; gap: 15px; }
.pipeline-copy li { display: grid; gap: 3px; padding-left: 17px; border-left: 3px solid var(--fusion); }
.pipeline-copy li b { font-size: .9rem; }
.pipeline-copy li span { color: var(--muted); font-size: .8rem; }
.pipeline-flow { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: var(--muted); font-family: ui-monospace, monospace; font-size: .67rem; }
.pipeline-flow span { padding: 6px 8px; border: 1px solid var(--line); border-radius: 8px; }
.pipeline-flow i { width: 13px; height: 1px; background: var(--fusion); }

.result-shell { border: 1px solid var(--line); border-radius: 28px; padding: 10px; background: var(--surface); box-shadow: var(--shadow-md); }
.result-tabs { display: flex; gap: 5px; padding: 4px; border-bottom: 1px solid var(--line); }
.result-panel { display: none; grid-template-columns: .54fr 1.1fr .58fr; gap: 12px; padding: 12px 2px 2px; }
.result-panel.active { display: grid; animation: fadeUp .35s var(--ease); }
.result-summary, .chart-card, .ranking-card, .shot-cards article { border: 1px solid var(--line); border-radius: 18px; background: var(--bg); }
.result-summary { padding: 25px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.score-label { color: var(--muted); font-size: .74rem; font-weight: 750; text-transform: uppercase; letter-spacing: .08em; }
.result-summary > strong { margin-top: 7px; font-family: ui-monospace, monospace; font-size: clamp(2.7rem, 5vw, 4.9rem); line-height: 1; letter-spacing: -.07em; }
.result-summary p { margin: 14px 0 0; color: var(--muted); font-size: .86rem; }
.accent-summary { color: #fff; border-color: transparent; background: linear-gradient(145deg, #6850e7, #7557f6 55%, #4b8eea); box-shadow: 0 18px 40px rgba(117,87,246,.25); }
.accent-summary .score-label, .accent-summary p { color: rgba(255,255,255,.78); }
.gain-pill { margin-top: 10px; padding: 5px 9px; border-radius: 999px; color: inherit; background: rgba(255,255,255,.13); font-size: .72rem; font-weight: 800; }
.chart-card, .ranking-card { padding: 20px; min-width: 0; }
.chart-heading, .ranking-heading { display: flex; justify-content: space-between; align-items: start; gap: 16px; }
.chart-heading span, .ranking-heading span { color: var(--muted); font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.chart-heading h3, .ranking-heading h3 { margin-top: 3px; font-size: 1.08rem; }
.chart-filter { border: 1px solid var(--line); border-radius: 999px; padding: 7px 10px; color: var(--muted); background: var(--surface); cursor: pointer; font-size: .67rem; font-weight: 750; }
.chart-filter.active { color: #fff; border-color: var(--fusion); background: var(--fusion); }
.chart-legend { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 13px; }
.chart-legend span { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: .68rem; }
.chart-legend i { width: 8px; height: 8px; border-radius: 50%; background: var(--c); }
.radar-chart { min-height: 330px; display: grid; place-items: center; overflow: hidden; }
.radar-chart svg { width: min(100%, 420px); height: auto; overflow: visible; }
.radar-grid { fill: none; stroke: var(--line); stroke-width: 1; }
.radar-axis { stroke: var(--line); stroke-width: 1; }
.radar-label { fill: var(--muted); font-size: 10px; font-weight: 650; }
.radar-shape { fill-opacity: .08; stroke-width: 2.2; stroke-linejoin: round; }
.radar-dot { stroke: var(--surface); stroke-width: 1.2; }
.ranking-list { display: grid; gap: 10px; margin-top: 19px; }
.rank-row { display: grid; grid-template-columns: 20px 1fr auto; gap: 8px; align-items: center; }
.rank-row > span:first-child { color: var(--muted); font-family: ui-monospace, monospace; font-size: .65rem; }
.rank-name { min-width: 0; }
.rank-name strong { display: block; font-size: .76rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rank-bar { height: 5px; margin-top: 4px; border-radius: 999px; background: var(--line); overflow: hidden; }
.rank-bar i { display: block; height: 100%; width: var(--w); border-radius: inherit; background: var(--c); }
.rank-score { font-family: ui-monospace, monospace; font-size: .74rem; font-weight: 800; }
.generator-result { grid-template-columns: .52fr 1.48fr; }
.generator-result .shot-cards { grid-column: 1 / -1; }
.wide-chart { min-height: 390px; }
.line-chart { min-height: 300px; display: grid; place-items: center; }
.line-chart svg { width: 100%; height: auto; min-height: 280px; overflow: visible; }
.line-grid { stroke: var(--line); stroke-width: 1; }
.line-axis-label { fill: var(--muted); font-size: 10px; }
.line-path { fill: none; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.line-point { stroke: var(--surface); stroke-width: 2; }
.shot-cards { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.shot-cards article { padding: 16px 18px; }
.shot-cards span { display: block; color: var(--muted); font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 750; }
.shot-cards strong { display: block; margin-top: 5px; font-family: ui-monospace, monospace; font-size: 1.5rem; }
.shot-cards small { color: var(--muted); }
.shot-cards .featured { color: #fff; border-color: transparent; background: linear-gradient(145deg, #6b50ec, #8b71ff); }
.shot-cards .featured span, .shot-cards .featured small { color: rgba(255,255,255,.76); }
.table-toggle-wrap { margin-top: 22px; }
.text-button { display: inline-flex; gap: 10px; align-items: center; border: 0; padding: 0; color: var(--fusion); background: transparent; cursor: pointer; font-weight: 780; }
.text-button span { width: 22px; height: 22px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; }
.exact-tables { margin-top: 20px; display: grid; gap: 20px; }
.table-scroll { overflow-x: auto; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: var(--shadow-sm); }
table { width: 100%; min-width: 820px; border-collapse: collapse; font-size: .78rem; }
caption { padding: 18px 20px 12px; text-align: left; font-family: "Space Grotesk", sans-serif; font-size: 1rem; font-weight: 800; }
th, td { padding: 10px 12px; border-top: 1px solid var(--line); text-align: right; white-space: nowrap; }
th:first-child, td:first-child { text-align: left; }
th { color: var(--muted); background: var(--bg); }
tr.ours { color: var(--fusion); font-weight: 850; background: rgba(117,87,246,.05); }

.ablation-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 18px; }
.ablation-card { padding: 26px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm); }
.ablation-head { display: grid; grid-template-columns: 44px 1fr; gap: 14px; }
.ablation-head > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; color: var(--fusion); background: rgba(117,87,246,.1); font-family: ui-monospace, monospace; font-size: .75rem; font-weight: 850; }
.ablation-head h3 { font-size: 1.1rem; }
.ablation-head p { margin: 5px 0 0; color: var(--muted); font-size: .82rem; }
.mini-bars { display: grid; gap: 9px; margin-top: 24px; }
.mini-row { display: grid; grid-template-columns: 100px 1fr 48px; gap: 10px; align-items: center; color: var(--muted); font-size: .72rem; }
.mini-row label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mini-track { height: 8px; border-radius: 999px; background: var(--bg); overflow: hidden; }
.mini-track i { display: block; height: 100%; width: var(--w); border-radius: inherit; background: var(--c); }
.mini-row strong { color: var(--text); font-family: ui-monospace, monospace; font-size: .72rem; text-align: right; }
.takeaway { display: block; margin-top: 19px; padding-top: 15px; border-top: 1px solid var(--line); color: var(--fusion); font-size: .8rem; }

.visual-shell { border: 1px solid rgba(255,255,255,.11); border-radius: 28px; background: rgba(255,255,255,.04); overflow: hidden; }
.visual-tabs { display: flex; gap: 5px; padding: 12px; border-bottom: 1px solid rgba(255,255,255,.1); overflow-x: auto; }
.visual-tab { color: #9dabc0; white-space: nowrap; }
.visual-tab:hover { color: #fff; }
.visual-panel { display: none; grid-template-columns: .42fr 1.58fr; gap: 30px; align-items: center; padding: 30px; }
.visual-panel.active { display: grid; animation: fadeUp .35s var(--ease); }
.visual-copy span { color: #a390ff; font-size: .74rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.visual-copy h3 { margin-top: 8px; font-size: clamp(1.5rem, 2.6vw, 2.25rem); }
.visual-copy p { margin: 15px 0 0; color: var(--dark-muted); }
.visual-image { position: relative; width: 100%; border: 0; padding: 0; border-radius: 16px; background: #fff; overflow: hidden; cursor: zoom-in; }
.visual-image::after { content: "Open full figure"; position: absolute; right: 12px; bottom: 12px; padding: 7px 10px; border-radius: 999px; color: #fff; background: rgba(8,19,33,.75); font-size: .72rem; font-weight: 700; opacity: 0; transform: translateY(5px); transition: opacity .2s ease, transform .2s ease; }
.visual-image:hover::after { opacity: 1; transform: translateY(0); }
.visual-image img { width: 100%; }
.visual-image.square { max-height: 670px; }
.visual-image.square img { max-height: 670px; object-fit: contain; }

.efficiency-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.efficiency-card { padding: 28px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm); }
.efficiency-card > span { color: var(--muted); font-size: .76rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.efficiency-card > strong { display: block; margin-top: 12px; font-family: ui-monospace, monospace; font-size: clamp(2.25rem, 4vw, 3.6rem); line-height: 1; letter-spacing: -.06em; }
.efficiency-card p { min-height: 82px; color: var(--muted); font-size: .86rem; }
.train-card > strong { color: var(--fusion); }
.efficiency-meter { height: 9px; border-radius: 999px; background: var(--bg); overflow: hidden; }
.efficiency-meter i { display: block; width: var(--meter); height: 100%; border-radius: inherit; background: linear-gradient(90deg, #5c3be4, #8e77ff); }
.efficiency-meter.warning i { background: linear-gradient(90deg, #df8a2f, #efb059); }
.note-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--fake); font-weight: 900; }

.resources-section { background: linear-gradient(155deg, #07111e, #0c1728 60%, #111b32); }
.resource-grid { display: grid; grid-template-columns: .86fr 1.14fr; gap: 44px; align-items: start; }
.resource-copy > p:last-of-type { max-width: 560px; color: var(--dark-muted); }
.resource-actions { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; margin-top: 28px; }
.resource-actions a { padding: 16px 17px; border: 1px solid rgba(255,255,255,.1); border-radius: 14px; background: rgba(255,255,255,.045); transition: transform .2s var(--ease), border-color .2s ease, background .2s ease; }
.resource-actions a:hover { transform: translateY(-3px); border-color: rgba(157,137,255,.5); background: rgba(117,87,246,.12); }
.resource-actions span { display: block; color: #93a2b8; font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; }
.resource-actions b { display: block; margin-top: 3px; color: #fff; font-size: .86rem; }
.citation-card { padding: 24px; border: 1px solid rgba(255,255,255,.11); border-radius: 22px; background: rgba(255,255,255,.055); box-shadow: 0 28px 80px rgba(0,0,0,.24); }
.citation-head { display: flex; justify-content: space-between; align-items: center; gap: 18px; }
.citation-head span { color: #9c8aff; font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.citation-head h3 { margin-top: 3px; }
.copy-button { border: 1px solid rgba(255,255,255,.15); border-radius: 999px; padding: 8px 12px; color: #fff; background: rgba(255,255,255,.06); cursor: pointer; font-size: .75rem; font-weight: 750; }
.citation-card pre { margin: 18px 0 0; padding: 18px; border-radius: 14px; color: #d8e1ef; background: rgba(2,8,16,.64); overflow-x: auto; font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .72rem; line-height: 1.65; white-space: pre-wrap; }
.copy-status { min-height: 20px; margin: 9px 0 0; color: #7de3c4; font-size: .72rem; }
.site-footer { padding: 24px 0; color: #97a6bb; background: #050c15; border-top: 1px solid rgba(255,255,255,.07); }
.footer-row { display: grid; grid-template-columns: 1fr auto auto; gap: 26px; align-items: center; }
.footer-row div { display: flex; align-items: baseline; gap: 12px; }
.footer-row strong { color: #fff; }
.footer-row span, .footer-row p, .footer-row a { font-size: .75rem; }
.footer-row p { margin: 0; }
.footer-row a { color: #d5dcff; }

.lightbox { width: min(96vw, 1450px); max-height: 94vh; padding: 0; border: 0; border-radius: 20px; background: #07111e; box-shadow: 0 40px 120px rgba(0,0,0,.62); overflow: auto; }
.lightbox::backdrop { background: rgba(2,7,14,.84); backdrop-filter: blur(8px); }
.lightbox-close { position: sticky; float: right; top: 12px; right: 12px; z-index: 2; width: 42px; height: 42px; margin: 12px; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; color: #fff; background: rgba(8,19,33,.82); cursor: pointer; font-size: 1.5rem; }
.lightbox figure { margin: 0; padding: 18px 22px 22px; }
.lightbox img { width: 100%; border-radius: 12px; background: #fff; }
.lightbox figcaption { padding: 14px 4px 0; color: #b2bfd1; font-size: .86rem; }

.reveal { opacity: 1; transform: none; }
.js .reveal { opacity: 0; transform: translateY(22px); transition: opacity .72s var(--ease), transform .72s var(--ease); }
.js .reveal.visible { opacity: 1; transform: none; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes fadeUp { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

@media (max-width: 1120px) {
  .primary-nav { position: fixed; left: 16px; right: 16px; top: calc(var(--header-h) + 8px); display: none; flex-direction: column; align-items: stretch; gap: 3px; padding: 12px; border: 1px solid rgba(255,255,255,.1); border-radius: 18px; background: rgba(8,19,33,.96); box-shadow: 0 24px 60px rgba(0,0,0,.3); }
  .primary-nav.open { display: flex; }
  .primary-nav a { padding: 11px 13px; }
  .nav-toggle { display: grid; }
  .theme-toggle { margin-left: 0; }
  .hero-grid { grid-template-columns: 1fr; }
  .hero-copy { max-width: 880px; }
  .hero-visual { max-width: 700px; width: 100%; margin-inline: auto; }
  .result-panel { grid-template-columns: .55fr 1.45fr; }
  .result-panel .ranking-card { grid-column: 1 / -1; }
  .ranking-list { grid-template-columns: repeat(2,1fr); }
  .generator-result { grid-template-columns: .55fr 1.45fr; }
}

@media (max-width: 900px) {
  .section { padding: 88px 0; }
  .split-heading { grid-template-columns: 1fr; gap: 22px; align-items: start; }
  .abstract-grid, .motivation-layout, .split-panel, .pipeline-card, .resource-grid { grid-template-columns: 1fr; }
  .motivation-copy { order: 2; }
  .case-figure { order: 1; }
  .method-step { grid-template-columns: 54px 1fr; }
  .method-step > :last-child { grid-column: 2; }
  .benchmark-stats, .metrics-grid { grid-template-columns: repeat(2,1fr); }
  .metrics-grid article:nth-child(2), .benchmark-stats article:nth-child(2) { border-right: 0; }
  .metrics-grid article:nth-child(-n+2), .benchmark-stats article:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.1); }
  .benchmark-stats article:nth-child(-n+2) { border-bottom-color: var(--line); }
  .generator-grid { grid-template-columns: repeat(4,1fr); height: auto; align-items: stretch; }
  .generator-grid article { height: 190px; }
  .result-panel, .generator-result { grid-template-columns: 1fr; }
  .result-panel .ranking-card, .generator-result .shot-cards { grid-column: auto; }
  .ablation-grid, .efficiency-grid { grid-template-columns: 1fr; }
  .visual-panel { grid-template-columns: 1fr; }
  .resource-actions { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
  :root { --header-h: 64px; }
  .container { width: min(calc(100% - 24px), var(--container)); }
  .section { padding: 72px 0; }
  .hero { padding: 118px 0 54px; }
  .hero h1 { font-size: clamp(2.55rem, 13vw, 4rem); }
  .hero-lead { font-size: .98rem; }
  .authors { gap: 4px 12px; font-size: .84rem; }
  .affiliations { display: grid; gap: 2px; }
  .hero-actions .button { flex: 1 1 calc(50% - 10px); }
  .fusion-card { padding: 14px; border-radius: 22px; }
  .branch-card { grid-template-columns: 42px 1fr; }
  .branch-card .signal { display: none; }
  .prediction-pill { right: 0; }
  .metrics-grid, .benchmark-stats { grid-template-columns: 1fr 1fr; }
  .metrics-grid article, .benchmark-stats article { padding: 17px; }
  .metrics-grid strong { font-size: 1.6rem; }
  .centered-heading { margin-bottom: 38px; }
  h2 { font-size: clamp(2rem, 11vw, 3.2rem); }
  .prose-card { padding: 24px; }
  .idea-stack article { grid-template-columns: 40px 1fr; padding: 18px; }
  .case-figure { padding: 12px; }
  .case-columns { font-size: .58rem; }
  .figure-expand { right: 20px; bottom: 20px; }
  .insight-banner { grid-template-columns: 1fr; gap: 7px; padding: 20px; }
  .method-step { grid-template-columns: 1fr; padding: 22px; }
  .method-step > :last-child { grid-column: auto; }
  .step-index { font-size: 1.2rem; }
  .layer-branch { grid-template-columns: 44px repeat(6,1fr); gap: 4px; }
  .layer-branch span { height: 42px; }
  .routing-visual { grid-template-columns: 1fr; }
  .route-bars { height: 110px; }
  .gate-node, .expert-node, .route-output { width: 100%; height: 44px; }
  .reliability-row { grid-template-columns: 94px 1fr; }
  .reliability-row strong { display: none; }
  .figure-card-heading { align-items: flex-start; flex-direction: column; }
  .split-panel, .generator-section, .pipeline-card { padding: 20px; }
  .taxonomy-grid { grid-template-columns: 1fr; }
  .generator-heading { flex-direction: column; align-items: flex-start; }
  .generator-grid { grid-template-columns: repeat(2,1fr); padding: 12px; }
  .generator-grid article { height: 170px; }
  .pipeline-flow i { display: none; }
  .result-shell { padding: 6px; border-radius: 22px; }
  .result-tabs { overflow-x: auto; }
  .result-tab { white-space: nowrap; }
  .result-panel { padding: 8px 0 0; }
  .chart-card, .ranking-card, .result-summary { padding: 18px; }
  .radar-chart { min-height: 280px; }
  .ranking-list { grid-template-columns: 1fr; }
  .shot-cards { grid-template-columns: repeat(2,1fr); }
  .ablation-card { padding: 20px; }
  .mini-row { grid-template-columns: 82px 1fr 44px; }
  .visual-tabs { padding: 8px; }
  .visual-panel { padding: 20px; }
  .efficiency-card p { min-height: 0; }
  .resource-actions { grid-template-columns: 1fr; }
  .citation-card { padding: 18px; }
  .citation-card pre { font-size: .64rem; }
  .footer-row { grid-template-columns: 1fr; gap: 8px; }
  .footer-row div { flex-direction: column; gap: 0; }
}

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

/* Verified submission-stage release adjustments */
.paper-title { display: grid; gap: 14px; }
.paper-title .title-line-primary {
  display: block;
  font-size: clamp(3rem, 5.1vw, 5.2rem);
  line-height: .98;
  letter-spacing: -.06em;
}
.paper-title .title-line-secondary {
  display: block;
  max-width: 760px;
  color: #eef4ff;
  font-size: clamp(1.65rem, 2.35vw, 2.45rem);
  line-height: 1.16;
  letter-spacing: -.035em;
}
.release-stage-note {
  max-width: 700px;
  margin: 15px 0 0;
  color: #8293aa;
  font-size: .78rem;
  line-height: 1.55;
}
.concept-note {
  grid-column: 1 / -1;
  color: #8496af;
  font-size: .72rem;
  line-height: 1.45;
}
.release-card {
  padding: 28px;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 22px;
  background: rgba(255,255,255,.055);
  box-shadow: 0 28px 80px rgba(0,0,0,.24);
}
.release-card-label {
  display: block;
  color: #9ba9be;
  font-size: .72rem;
  font-weight: 750;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.release-card h3 { margin: 8px 0 10px; color: #fff; font-size: 1.5rem; line-height: 1.25; }
.release-card p { margin: 0; color: #aebbd0; }
.release-card strong { display: block; margin-bottom: 5px; color: #fff; }
.release-card-rule { height: 1px; margin: 22px 0; background: rgba(255,255,255,.11); }

@media (max-width: 760px) {
  .paper-title .title-line-primary { font-size: clamp(2.65rem, 13vw, 4.1rem); }
  .paper-title .title-line-secondary { font-size: clamp(1.35rem, 6.5vw, 1.9rem); }
  .release-card { padding: 22px; }
}

/* ========================================================================
   Soft academic palette and layout refinement
   Purpose: replace abrupt black/white alternation with a continuous,
   low-saturation blue–lavender–apricot visual system.
   ======================================================================== */
:root {
  --bg: #f4f7fb;
  --surface: #fffdfb;
  --surface-2: #edf3f9;
  --text: #24344d;
  --muted: #68788f;
  --line: #d9e3ee;
  --dark: #eaf1f8;
  --dark-2: #e4ecf6;
  --dark-3: #dce7f2;
  --dark-text: #24344d;
  --dark-muted: #68788f;
  --clip: #3b82c4;
  --dino: #e59a55;
  --fusion: #7669bd;
  --real: #2f9d82;
  --fake: #d86d78;
  --shadow-sm: 0 10px 28px rgba(54, 76, 107, .07);
  --shadow-md: 0 24px 66px rgba(62, 82, 113, .11);
}

html[data-theme="dark"] {
  --bg: #f4f7fb;
  --surface: #fffdfb;
  --surface-2: #edf3f9;
  --text: #24344d;
  --muted: #68788f;
  --line: #d9e3ee;
  --shadow-sm: 0 10px 28px rgba(54, 76, 107, .07);
  --shadow-md: 0 24px 66px rgba(62, 82, 113, .11);
}

body {
  background:
    radial-gradient(circle at 8% 4%, rgba(59,130,196,.08), transparent 25rem),
    radial-gradient(circle at 94% 18%, rgba(229,154,85,.07), transparent 24rem),
    var(--bg);
}

.section { padding: 104px 0; }
.section-light { background: rgba(255,253,251,.86); }
.section-tint { background: #f1f4fa; }
.section-dark { color: var(--text); background: #eaf1f8; }
.section-dark .kicker { color: var(--fusion); }
.section-dark .section-intro { color: var(--muted); }

.site-header {
  border-bottom: 1px solid rgba(103, 126, 154, .16);
  background: rgba(250,252,255,.84);
  box-shadow: 0 4px 18px rgba(53,75,105,.04);
}
.site-header.scrolled {
  background: rgba(250,252,255,.96);
  box-shadow: 0 12px 32px rgba(53,75,105,.08);
}
.brand { color: #2d405e; }
.primary-nav a { color: #65748a; }
.primary-nav a:hover,
.primary-nav a.active { color: #2d405e; background: rgba(118,105,189,.10); }
.nav-toggle { background: rgba(118,105,189,.10); color: #465a75; }
.nav-toggle span { background: #465a75; }

.hero {
  min-height: auto;
  padding: 132px 0 72px;
  color: var(--text);
  background:
    radial-gradient(circle at 82% 18%, rgba(118,105,189,.18), transparent 28rem),
    radial-gradient(circle at 16% 30%, rgba(59,130,196,.13), transparent 26rem),
    radial-gradient(circle at 75% 88%, rgba(229,154,85,.12), transparent 26rem),
    linear-gradient(135deg, #f7fbff 0%, #f6f3fb 52%, #fff8f0 100%);
}
.hero::before {
  opacity: .48;
  background-image:
    linear-gradient(rgba(92,119,151,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(92,119,151,.07) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: linear-gradient(to bottom, #000 0%, transparent 80%);
}
.orb-one { background: radial-gradient(circle, rgba(118,105,189,.22), transparent 70%); }
.orb-two { background: radial-gradient(circle, rgba(59,130,196,.17), transparent 70%); }
.hero-grid { grid-template-columns: minmax(0,1.08fr) minmax(370px,.92fr); gap: 52px; }
.hero-copy { max-width: 730px; }
.conference-badge {
  color: #6258a4;
  border-color: rgba(118,105,189,.28);
  background: rgba(118,105,189,.10);
}
.page-badge { color: #6b7c92; border-color: #d5e0eb; background: rgba(255,255,255,.68); }
.paper-title .title-line-primary {
  color: #263a56;
  font-size: clamp(3rem, 4.55vw, 4.65rem);
  line-height: 1.00;
}
.paper-title .title-line-secondary {
  max-width: 700px;
  color: #52657f;
  font-size: clamp(1.45rem, 2.05vw, 2.12rem);
  line-height: 1.20;
  letter-spacing: -.03em;
}
.text-clip { color: var(--clip); text-shadow: none; }
.text-dino { color: var(--dino); text-shadow: none; }
.hero-lead { color: #60718a; max-width: 660px; }
.authors { color: #30445f; }
.authors sup, .affiliations sup { color: var(--fusion); }
.affiliations { color: #6d7d92; }
.release-stage-note { color: #8290a3; }
.button-primary {
  background: linear-gradient(135deg, #7669bd, #6b60ae);
  box-shadow: 0 12px 28px rgba(118,105,189,.20);
}
.button-primary:hover { box-shadow: 0 16px 34px rgba(118,105,189,.27); }
.button-secondary {
  color: #40536d;
  background: rgba(255,255,255,.72);
  border-color: #d2deea;
}
.button-secondary:hover { background: #fff; border-color: #bfcddd; }

.fusion-card {
  padding: 24px;
  border-color: rgba(118,105,189,.18);
  background: rgba(255,255,255,.68);
  box-shadow: 0 26px 70px rgba(70,88,119,.14);
}
.fusion-card::before { background: radial-gradient(circle, rgba(118,105,189,.16), transparent 70%); }
.fusion-topline { color: #718198; }
.branch-card {
  border-color: #dae5ef;
  background: rgba(250,252,255,.88);
  box-shadow: inset 0 1px rgba(255,255,255,.8);
}
.branch-card strong { color: #2e425e; }
.branch-card span { color: #718198; }
.fusion-caption { color: #6f7f94; }
.fusion-label { color: #fff; }
.prediction-pill { color: #41546f; }
.prediction-pill span { color: #8b98aa; }

.metrics-grid {
  gap: 14px;
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: visible;
}
.metrics-grid article {
  padding: 22px 24px;
  border: 1px solid rgba(133,153,178,.20) !important;
  border-radius: 18px;
  background: rgba(255,255,255,.68);
  box-shadow: 0 10px 28px rgba(61,82,111,.06);
}
.metrics-grid strong { color: #314966; }
.metrics-grid span { color: #738399; }

#abstract { background: #fffdfb; }
#motivation { background: linear-gradient(180deg, #f2f4fa, #f6f4fb); }
.prose-card,
.idea-stack article,
.case-figure,
.generator-section,
.pipeline-card,
.split-panel,
.result-shell,
.ablation-card,
.efficiency-card {
  border-color: #dce5ef;
  background: rgba(255,255,255,.84);
}
.idea-number { background: linear-gradient(135deg, #7a6fc2, #9387cf); box-shadow: 0 10px 22px rgba(118,105,189,.16); }
.tab-button.active,
.result-tab.active,
.visual-tab.active {
  background: #7669bd;
  box-shadow: 0 8px 18px rgba(118,105,189,.18);
}
.insight-banner {
  color: #31435f;
  border: 1px solid rgba(118,105,189,.18);
  background: linear-gradient(110deg, #ebe7fa, #e8f1fb 62%, #fff2e5);
  box-shadow: 0 18px 42px rgba(68,89,119,.08);
}
.insight-banner strong { color: #665ba8; }

.method-section {
  color: var(--text);
  background:
    radial-gradient(circle at 12% 10%, rgba(59,130,196,.09), transparent 25rem),
    radial-gradient(circle at 90% 20%, rgba(118,105,189,.10), transparent 28rem),
    linear-gradient(180deg, #eaf1f8 0%, #eef3f9 100%);
}
.method-step {
  border-color: #d3dfeb;
  background: rgba(255,255,255,.72);
  box-shadow: 0 14px 38px rgba(58,81,111,.06);
}
.method-step:nth-child(1) { border-left: 4px solid rgba(59,130,196,.72); }
.method-step:nth-child(2) { border-left: 4px solid rgba(118,105,189,.72); }
.method-step:nth-child(3) { border-left: 4px solid rgba(229,154,85,.78); }
.step-index { color: rgba(65,87,116,.28); }
.step-tag { color: #7165b5; }
.step-copy p { color: #66778e; }
.formula { color: #655aa9; border-color: rgba(118,105,189,.22); background: rgba(118,105,189,.09); }
.layer-visual,
.routing-visual,
.uncertainty-demo {
  border: 1px solid #dce5ef;
  background: #f7f9fc;
}
.layer-branch strong { color: #5b6e86; }
.expert-node { border-color: #d4dfe9; background: #fff; color: #53677f; }
.gate-node { color: #665ba8; border-color: rgba(118,105,189,.28); background: rgba(118,105,189,.11); }
.route-output { color: #356a97; }
.demo-switch { background: #e9eef5; }
.demo-switch button { color: #697a91; }
.demo-switch button.active { color: #fff; background: #7669bd; }
.reliability-row { color: #65768d; }
.reliability-row > div { background: #dfe7f0; }
.uncertainty-demo small,
.concept-note { color: #7d8ca0; }
.full-figure-card {
  border-color: #d5e0eb;
  background: rgba(255,255,255,.70);
  box-shadow: 0 16px 42px rgba(61,83,112,.07);
}

#benchmark { background: #fffaf5; }
.taxonomy-grid span { background: #f7f3ee; }
.taxonomy-grid b { background: #7b70be; }
.generator-grid { background: linear-gradient(180deg, #f4eff9, transparent); }
.generator-grid i { background: linear-gradient(180deg, rgba(118,105,189,.78), rgba(118,105,189,.18)); }

.results-section { background: #f3f7fb; }
.result-summary,
.chart-card,
.ranking-card,
.shot-cards article { background: rgba(255,255,255,.78); }
.accent-summary {
  color: #324761;
  border: 1px solid rgba(118,105,189,.20);
  background: linear-gradient(145deg, #ece8fa, #e8f1fb 58%, #fff1e3);
  box-shadow: 0 18px 40px rgba(69,91,120,.08);
}
.gain-pill { background: rgba(118,105,189,.10); }
.shot-cards .featured {
  color: #354963;
  border: 1px solid rgba(118,105,189,.20);
  background: linear-gradient(145deg, #eee9fb, #e7f0fa);
}

#ablation { background: #fffdfb; }
.ablation-head > span { color: #695eab; background: rgba(118,105,189,.10); }
tr.ours { color: #665aa9; background: rgba(118,105,189,.05); }

.visualizations-section {
  color: var(--text);
  background:
    radial-gradient(circle at 12% 15%, rgba(59,130,196,.08), transparent 25rem),
    linear-gradient(180deg, #edf3f8, #f2f5f9);
}
.visual-shell {
  border-color: #d5e0eb;
  background: rgba(255,255,255,.70);
  box-shadow: 0 20px 54px rgba(61,82,111,.07);
}
.visual-tabs { border-bottom-color: #dce5ef; }
.visual-panel p,
.visual-copy p { color: #68798f; }
.visual-image { border: 1px solid #dce5ef; }

#efficiency { background: #fff9f4; }

.resources-section {
  color: var(--text);
  background:
    radial-gradient(circle at 85% 15%, rgba(118,105,189,.11), transparent 25rem),
    linear-gradient(155deg, #edf3f8, #f1f0f8 60%, #fff4e9);
}
.resource-actions a,
.citation-card,
.release-card {
  border-color: #d5e0eb;
  background: rgba(255,255,255,.72);
  box-shadow: 0 16px 40px rgba(62,83,112,.07);
}
.resource-actions a:hover { border-color: rgba(118,105,189,.38); background: #fff; }
.resource-actions span,
.release-card-label { color: #7b899d; }
.resource-actions b,
.citation-head h3,
.release-card h3,
.release-card strong { color: #30445f; }
.release-card p { color: #6d7d92; }
.release-card-rule { background: #dde5ee; }
.citation-head span { color: #6d62ae; }
.copy-button { color: #5f54a2; border-color: #d2ddea; background: #f7f5fc; }
.citation-card pre { color: #425671; background: #f3f6fa; border: 1px solid #dce5ef; }
.copy-status { color: #2f8f77; }

.site-footer {
  color: #c8d4df;
  background: #425f7b;
  border-top: 1px solid rgba(255,255,255,.12);
}
.footer-row strong { color: #fff; }
.footer-row a { color: #f1e9ff; }

.lightbox { background: #e9eef5; box-shadow: 0 36px 100px rgba(40,57,80,.36); }
.lightbox::backdrop { background: rgba(35,50,70,.62); }
.lightbox figcaption { color: #53677f; }

@media (max-width: 1120px) {
  .primary-nav {
    border-color: #d6e0eb;
    background: rgba(250,252,255,.98);
    box-shadow: 0 24px 60px rgba(52,72,101,.14);
  }
  .primary-nav a { color: #617289; }
}

@media (max-width: 900px) {
  .section { padding: 84px 0; }
  .hero-grid { gap: 38px; }
  .metrics-grid article:nth-child(-n+2) { border-bottom: 1px solid rgba(133,153,178,.20) !important; }
}

@media (max-width: 640px) {
  .hero { padding-top: 108px; }
  .paper-title .title-line-primary { font-size: clamp(2.55rem, 12vw, 3.7rem); }
  .paper-title .title-line-secondary { font-size: clamp(1.25rem, 6vw, 1.7rem); }
  .metrics-grid { gap: 10px; }
  .metrics-grid article { padding: 16px; }
}

/* ========================================================================
   Final hero refinement — complete-title hierarchy, balanced authors/actions,
   and a clearer sample-adaptive CLIP–DINO fusion illustration.
   ======================================================================== */
.hero {
  padding: 124px 0 70px;
  background:
    radial-gradient(circle at 15% 20%, rgba(59,130,196,.11), transparent 25rem),
    radial-gradient(circle at 86% 22%, rgba(118,105,189,.14), transparent 27rem),
    linear-gradient(135deg, #f8fbff 0%, #f6f4fb 57%, #fffaf5 100%);
}
.hero-grid {
  grid-template-columns: minmax(0,1.06fr) minmax(430px,.94fr);
  gap: 58px;
  align-items: start;
}
.hero-copy { max-width: 760px; }
.eyebrow-row { margin-bottom: 20px; }
.paper-title { gap: 10px; }
.paper-title .title-line-primary {
  max-width: 760px;
  font-size: clamp(2.85rem, 4.15vw, 4.2rem);
  line-height: 1.01;
  letter-spacing: -.052em;
}
.paper-title .title-line-secondary {
  max-width: 760px;
  font-size: clamp(1.75rem, 2.35vw, 2.45rem);
  line-height: 1.16;
  letter-spacing: -.037em;
  color: #4c607b;
}
.hero-lead {
  max-width: 720px;
  margin: 24px 0 22px;
  font-size: clamp(1rem,1.25vw,1.14rem);
  line-height: 1.66;
}
.authors {
  display: grid;
  gap: 6px;
  font-size: .96rem;
}
.author-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0 8px;
}
.author-separator,
.affiliation-separator {
  color: #9aa8ba;
  font-weight: 400;
}
.affiliations {
  align-items: center;
  gap: 0 8px;
  margin-top: 10px;
}
.hero-actions {
  flex-wrap: nowrap;
  gap: 9px;
  margin-top: 27px;
}
.hero-actions .button {
  min-height: 44px;
  padding: 10px 16px;
  white-space: nowrap;
  font-size: .89rem;
}
.hero-actions .button svg { width: 17px; height: 17px; }
.hero-visual {
  min-width: 0;
  margin-top: 46px;
}
.refined-fusion-card {
  width: 100%;
  max-width: 590px;
  margin-left: auto;
  padding: 26px;
  border-radius: 28px;
}
.refined-fusion-diagram {
  position: relative;
  display: grid;
  grid-template-columns: minmax(220px,1fr) 142px 108px;
  grid-template-rows: repeat(2, 104px);
  gap: 16px 14px;
  align-items: center;
  margin-top: 4px;
}
.refined-branch {
  position: relative;
  z-index: 2;
  min-width: 0;
  height: 100%;
  padding: 16px;
}
.refined-branch.clip-card { grid-column: 1; grid-row: 1; }
.refined-branch.dino-card { grid-column: 1; grid-row: 2; }
.refined-branch .branch-copy { min-width: 0; }
.refined-branch .branch-copy span { line-height: 1.35; }
.refined-connectors {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}
.refined-path,
.refined-output-path {
  fill: none;
  stroke-width: 3.5;
  stroke-linecap: round;
  stroke-dasharray: 8 8;
  animation: dash 3.2s linear infinite;
}
.refined-path.clip-path { stroke: url(#refClipPath); }
.refined-path.dino-path { stroke: url(#refDinoPath); }
.refined-output-path { stroke: #887bca; }
.refined-fusion-center {
  position: relative;
  z-index: 3;
  grid-column: 2;
  grid-row: 1 / span 2;
  display: grid;
  place-items: center;
}
.refined-fusion-node {
  display: grid;
  place-items: center;
  width: 122px;
  min-height: 122px;
  padding: 18px 12px;
  text-align: center;
  border: 1px solid rgba(118,105,189,.35);
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(145deg,#8879d6,#6e61b7);
  box-shadow: 0 16px 36px rgba(118,105,189,.27), inset 0 1px rgba(255,255,255,.3);
}
.refined-fusion-node span {
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: .74rem;
  font-weight: 800;
  letter-spacing: .08em;
}
.refined-fusion-node strong {
  max-width: 96px;
  margin-top: 4px;
  font-size: .76rem;
  line-height: 1.22;
}
.refined-prediction-card {
  position: relative;
  z-index: 3;
  grid-column: 3;
  grid-row: 1 / span 2;
  display: grid;
  justify-items: center;
  gap: 10px;
  padding: 18px 10px;
  border: 1px solid #d8e2ed;
  border-radius: 18px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 12px 26px rgba(61,82,111,.07);
}
.refined-prediction-card > span {
  color: #718198;
  font-size: .69rem;
  line-height: 1.3;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: .07em;
  font-weight: 750;
}
.prediction-values {
  display: grid;
  gap: 2px;
  justify-items: center;
  font-size: .9rem;
}
.prediction-values i {
  color: #93a0b1;
  font-style: normal;
  font-size: .66rem;
}
.prediction-real { color: var(--real); }
.prediction-fake { color: var(--fake); }
.refined-caption {
  grid-template-columns: repeat(3,max-content);
  justify-content: center;
  gap: 8px 18px;
  margin-top: 20px;
  font-size: .75rem;
}
.metrics-grid { margin-top: 50px; }

@media (max-width: 1180px) {
  .hero-grid { grid-template-columns: minmax(0,1fr) minmax(390px,.88fr); gap: 38px; }
  .hero-actions { flex-wrap: wrap; }
  .refined-fusion-diagram { grid-template-columns: minmax(200px,1fr) 128px 98px; gap: 14px 10px; }
  .refined-fusion-node { width: 110px; min-height: 110px; }
}

@media (max-width: 900px) {
  .hero-grid { grid-template-columns: 1fr; }
  .hero-copy { max-width: none; }
  .hero-visual { margin-top: 4px; }
  .refined-fusion-card { max-width: 690px; margin: 0 auto; }
  .hero-actions { justify-content: flex-start; }
}

@media (max-width: 640px) {
  .hero { padding-top: 104px; }
  .paper-title .title-line-primary { font-size: clamp(2.35rem,11.5vw,3.2rem); }
  .paper-title .title-line-secondary { font-size: clamp(1.38rem,6.6vw,1.85rem); }
  .author-row { gap: 2px 7px; }
  .author-separator { display: none; }
  .affiliations { display: grid; gap: 4px; }
  .affiliation-separator { display: none; }
  .hero-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .hero-actions .button { justify-content: center; }
  .hero-actions .button:first-child { grid-column: 1 / -1; }
  .refined-fusion-card { padding: 20px; border-radius: 22px; }
  .fusion-topline { align-items: flex-start; }
  .refined-fusion-diagram {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto auto;
    gap: 12px;
  }
  .refined-branch.clip-card,
  .refined-branch.dino-card,
  .refined-fusion-center,
  .refined-prediction-card { grid-column: 1; grid-row: auto; }
  .refined-connectors { display: none; }
  .refined-fusion-node {
    width: 100%;
    min-height: auto;
    border-radius: 16px;
    padding: 14px 18px;
  }
  .refined-fusion-node strong { max-width: none; }
  .refined-prediction-card { grid-template-columns: auto auto; justify-content: center; align-items: center; }
  .prediction-values { display: flex; align-items: center; gap: 7px; }
  .refined-caption { grid-template-columns: 1fr; justify-content: start; }
}

/* Final polish after visual QA */
.refined-fusion-diagram {
  grid-template-rows: repeat(2, 116px);
}
.refined-branch {
  grid-template-columns: 42px minmax(0,1fr);
  gap: 12px;
}
.refined-branch .signal { display: none; }
.refined-branch .branch-copy span {
  font-size: .74rem;
  line-height: 1.28;
}

@media (max-width: 640px) {
  .author-separator { display: inline; }
}

/* ===== Final scan-hero + concise method refinement ===== */
.hero {
  min-height: auto;
  padding: 132px 0 64px;
  color: #20334c;
  background:
    radial-gradient(circle at 80% 18%, rgba(118,105,189,.17), transparent 29rem),
    radial-gradient(circle at 11% 24%, rgba(59,130,196,.13), transparent 28rem),
    linear-gradient(135deg, #eef5fb 0%, #f5f2fa 58%, #fff8f0 100%);
}
.hero::before { opacity: .34; background-image: linear-gradient(rgba(92,119,153,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(92,119,153,.07) 1px, transparent 1px); }
.hero-grid { grid-template-columns: minmax(0,1.02fr) minmax(470px,.98fr); gap: 62px; }
.hero h1 { color: #20344e; font-size: clamp(2.75rem,5vw,5rem); }
.hero-lead { max-width: 650px; color: #64768f; }
.authors { color: #293f5c; }
.affiliations { color: #71829a; }
.conference-badge { color: #655aa9; border-color: rgba(118,105,189,.24); background: rgba(118,105,189,.10); }
.button-secondary { color: #3d526d; border-color: #d7e1eb; background: rgba(255,255,255,.64); }
.button-secondary:hover { background: #fff; border-color: #b9c9d9; }
.metrics-grid { border-color: #d5e0eb; background: rgba(255,255,255,.58); box-shadow: 0 18px 42px rgba(59,81,110,.07); }
.metrics-grid article { border-right-color: #dbe5ef; }
.metrics-grid strong { color: #354a65; }
.metrics-grid span { color: #718198; }

.scan-hero { min-width: 0; }
.scan-card { padding: 16px; border: 1px solid rgba(116,137,164,.24); border-radius: 28px; background: rgba(255,255,255,.66); box-shadow: 0 28px 70px rgba(56,78,108,.14); backdrop-filter: blur(14px); }
.scan-card-head,.scan-card-foot { display:flex; align-items:center; justify-content:space-between; gap:12px; color:#718198; font-size:.68rem; font-weight:750; letter-spacing:.055em; text-transform:uppercase; }
.scan-card-head { padding: 2px 4px 12px; }
.scan-card-foot { padding: 12px 4px 2px; text-transform:none; letter-spacing:0; font-weight:650; }
.scan-status { display:inline-flex; align-items:center; gap:7px; }
.scan-status i { width:7px; height:7px; border-radius:50%; background:#20ad82; box-shadow:0 0 0 5px rgba(32,173,130,.10); }
.scan-face-frame { position:relative; aspect-ratio:1/1; overflow:hidden; border-radius:22px; background:#dfe8f0; }
.scan-face-frame > img { width:100%; height:100%; object-fit:cover; display:block; transform:scale(1.01); }
.scan-face-frame::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(25,55,88,.13),transparent 26%,transparent 74%,rgba(25,55,88,.13)); pointer-events:none; }
.scan-grid { position:absolute; inset:0; opacity:.32; background-image:radial-gradient(circle,rgba(255,255,255,.85) 1px,transparent 1.4px); background-size:18px 18px; mask-image:radial-gradient(ellipse at center,#000 0 58%,transparent 82%); }
.scan-line { position:absolute; left:0; right:0; top:2%; height:2px; z-index:5; background:linear-gradient(90deg,transparent,#7d75ef 15%,#d9eaff 50%,#7d75ef 85%,transparent); box-shadow:0 0 18px rgba(117,87,246,.9); animation:face-scan 3.2s cubic-bezier(.45,0,.55,1) infinite; }
.scan-line::after { content:""; position:absolute; left:0; right:0; top:-15px; height:30px; background:linear-gradient(to bottom,transparent,rgba(117,87,246,.10),transparent); }
@keyframes face-scan { 0%{top:2%;opacity:0} 8%{opacity:1} 92%{opacity:1} 100%{top:98%;opacity:0} }
.scan-corner { position:absolute; width:28px; height:28px; z-index:6; border-color:rgba(255,255,255,.88); border-style:solid; filter:drop-shadow(0 2px 5px rgba(23,47,83,.2)); }
.corner-tl{left:15px;top:15px;border-width:2px 0 0 2px}.corner-tr{right:15px;top:15px;border-width:2px 2px 0 0}.corner-bl{left:15px;bottom:15px;border-width:0 0 2px 2px}.corner-br{right:15px;bottom:15px;border-width:0 2px 2px 0}
.scan-chip,.scan-result { position:absolute; z-index:7; display:grid; gap:2px; padding:10px 12px; border:1px solid rgba(255,255,255,.62); border-radius:14px; background:rgba(248,251,255,.82); box-shadow:0 12px 30px rgba(37,58,87,.13); backdrop-filter:blur(11px); }
.scan-chip span,.scan-result span { font-size:.64rem; font-weight:850; text-transform:uppercase; letter-spacing:.07em; }
.scan-chip strong { color:#2b405c; font-family:"IBM Plex Mono",monospace; font-size:1.15rem; }
.scan-chip small,.scan-result small { color:#72839a; font-size:.61rem; }
.scan-chip-clip { left:16px; top:18%; border-color:rgba(59,130,196,.25); }.scan-chip-clip span{color:#3b82c4}
.scan-chip-dino { left:16px; bottom:18%; border-color:rgba(229,154,85,.28); }.scan-chip-dino span{color:#d98638}
.scan-result { right:16px; top:50%; transform:translateY(-50%); border-color:rgba(118,105,189,.30); background:rgba(246,243,255,.88); }
.scan-result span{color:#7669bd}.scan-result strong{color:#6657c9;font-size:1.38rem}.scan-result sub{font-size:.7em}

.method-section { padding-top: 92px; padding-bottom: 96px; }
.compact-method-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.compact-method-card { position:relative; min-height:360px; padding:26px; overflow:hidden; border:1px solid #d6e1ec; border-radius:24px; background:rgba(255,255,255,.74); box-shadow:0 16px 42px rgba(61,83,112,.07); }
.compact-method-card::before { content:""; position:absolute; inset:0 auto 0 0; width:4px; background:var(--accent); }
.method-blue{--accent:#5b9ed8}.method-purple{--accent:#8374cf}.method-orange{--accent:#e8a15d}
.compact-step { position:absolute; top:17px; right:20px; color:rgba(74,96,124,.13); font-family:"IBM Plex Mono",monospace; font-size:3.1rem; font-weight:800; }
.compact-method-copy { position:relative; z-index:1; }
.compact-method-copy small { color:var(--accent); font-size:.67rem; font-weight:850; letter-spacing:.09em; text-transform:uppercase; }
.compact-method-copy h3 { max-width:270px; margin:14px 0 10px; color:#263c58; font-size:1.43rem; }
.compact-method-copy p { margin:0; color:#687a91; font-size:.86rem; line-height:1.62; }
.compact-layers { position:absolute; left:26px; right:26px; bottom:28px; display:grid; grid-template-columns:43px repeat(5,1fr); gap:8px; align-items:center; }
.compact-layers b { color:#66788f; font-size:.68rem; }.compact-layers i { height:34px; border-radius:9px; background:linear-gradient(180deg,rgba(59,130,196,.25),rgba(59,130,196,.65)); }.compact-layers b:nth-of-type(2)~i{background:linear-gradient(180deg,rgba(229,154,85,.25),rgba(229,154,85,.68))}
.compact-route { position:absolute; left:26px; right:26px; bottom:28px; display:grid; grid-template-columns:1fr 58px 88px; gap:10px; align-items:center; }
.route-mini-bars { height:86px; display:flex; align-items:end; gap:7px; padding:12px; border:1px solid #dce5ef; border-radius:14px; background:#f7f9fc; }.route-mini-bars i{flex:1;border-radius:6px 6px 2px 2px;background:linear-gradient(180deg,#6da9e0,#b8d4ef)}.route-mini-bars i:nth-child(1){height:55%}.route-mini-bars i:nth-child(2){height:34%}.route-mini-bars i:nth-child(3){height:86%}.route-mini-bars i:nth-child(4){height:64%}
.compact-route em,.compact-route strong { display:grid; place-items:center; min-height:60px; border-radius:13px; font-size:.7rem; font-style:normal; text-align:center; }.compact-route em{color:#665aa9;background:rgba(118,105,189,.11);border:1px solid rgba(118,105,189,.24)}.compact-route strong{color:#53677f;background:#fff;border:1px solid #d6e0ea}
.compact-fusion { position:absolute; left:26px; right:26px; bottom:28px; display:grid; gap:12px; }.compact-fusion>div{display:grid;grid-template-columns:45px 1fr;gap:10px;align-items:center;color:#64768e;font-size:.7rem}.compact-fusion i{display:block;height:10px;border-radius:99px}.clip-bar{width:78%;background:linear-gradient(90deg,#3b82c4,#8cc2ec)}.dino-bar{width:52%;background:linear-gradient(90deg,#d98638,#f0bd87)}.compact-fusion b{justify-self:end;padding:10px 16px;border-radius:12px;color:#fff;background:linear-gradient(135deg,#7669bd,#8d7ee0);font-size:.75rem}
.compact-full-figure { margin-top:24px; }

@media (max-width: 980px){ .hero-grid{grid-template-columns:1fr;gap:42px}.scan-card{max-width:650px;margin:auto}.compact-method-grid{grid-template-columns:1fr}.compact-method-card{min-height:320px} }
@media (max-width: 640px){ .hero{padding-top:108px}.scan-chip{padding:8px 9px}.scan-chip strong{font-size:.93rem}.scan-result{right:10px}.scan-chip-clip,.scan-chip-dino{left:10px}.metrics-grid{grid-template-columns:repeat(2,1fr)}.metrics-grid article:nth-child(2){border-right:0}.metrics-grid article:nth-child(-n+2){border-bottom:1px solid #dbe5ef}.compact-method-card{padding:22px}.compact-layers,.compact-route,.compact-fusion{left:22px;right:22px}.compact-layers{grid-template-columns:38px repeat(5,1fr)} }
@media (prefers-reduced-motion:reduce){ .scan-line{animation:none;top:48%} }


/* ===== Visual refinement v2: clean published-face scanner + image-led page ===== */
.scan-card { max-width: 610px; margin-inline: auto; }
.scan-face-frame { aspect-ratio: 1.02 / 1; background: linear-gradient(145deg,#dfeaf5,#f1e8f2); }
.scan-face-frame > img { object-position: 50% 33%; filter: saturate(.95) contrast(1.035); transform: scale(1.035); }
.scan-face-frame::before { content:""; position:absolute; inset:0; z-index:2; background:linear-gradient(180deg,rgba(19,43,70,.06),transparent 32%,transparent 72%,rgba(19,43,70,.11)); pointer-events:none; }
.scan-grid { z-index:3; opacity:.29; background-size:17px 17px; mask-image:radial-gradient(ellipse 48% 66% at 50% 49%,#000 0 65%,transparent 91%); }
.face-scan-oval { position:absolute; z-index:4; left:22%; right:22%; top:10%; bottom:8%; border:1px solid rgba(224,237,255,.62); border-radius:48% 48% 45% 45% / 40% 40% 58% 58%; box-shadow:0 0 0 1px rgba(117,87,246,.10), inset 0 0 55px rgba(95,135,188,.08); pointer-events:none; }
.face-scan-points { position:absolute; inset:0; z-index:4; pointer-events:none; }
.face-scan-points i { position:absolute; width:6px; height:6px; border:1px solid rgba(245,250,255,.94); border-radius:50%; background:rgba(117,87,246,.58); box-shadow:0 0 10px rgba(117,87,246,.6); }
.face-scan-points .point-1{left:35%;top:35%}.face-scan-points .point-2{left:64%;top:35%}.face-scan-points .point-3{left:49%;top:45%}.face-scan-points .point-4{left:40%;top:58%}.face-scan-points .point-5{left:59%;top:58%}.face-scan-points .point-6{left:31%;top:48%}.face-scan-points .point-7{left:68%;top:48%}.face-scan-points .point-8{left:42%;top:69%}.face-scan-points .point-9{left:57%;top:69%}.face-scan-points .point-10{left:49%;top:77%}
.scan-line { z-index:8; height:2px; background:linear-gradient(90deg,transparent 2%,#49bce7 16%,#e5f7ff 50%,#8879f1 84%,transparent 98%); box-shadow:0 0 18px rgba(91,174,231,.75),0 0 34px rgba(117,87,246,.35); }
.scan-line::after { top:-20px; height:40px; background:linear-gradient(to bottom,transparent,rgba(96,188,233,.13),rgba(117,87,246,.07),transparent); }
.scan-chip,.scan-result { z-index:9; min-width:118px; padding:11px 13px; border-color:rgba(255,255,255,.72); background:rgba(250,252,255,.82); box-shadow:0 16px 34px rgba(30,52,82,.15); }
.scan-chip-clip { left:18px; top:15%; }.scan-chip-dino { left:18px; bottom:15%; }
.scan-result { right:18px; top:50%; min-width:128px; }
.scan-result strong { font-size:1.55rem; }
.scan-card-head { color:#64758c; }
.scan-card-foot { color:#6f8097; }

/* Image-led overview: two figures replace duplicated prose. */
.paper-figures { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:28px; }
.paper-figure-card { min-width:0; padding:20px; border:1px solid #d7e2ed; border-radius:24px; background:rgba(255,255,255,.78); box-shadow:0 18px 48px rgba(53,76,105,.08); }
.paper-figure-head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:14px; }
.paper-figure-head span { color:#7969c8; font-size:.68rem; font-weight:850; letter-spacing:.09em; text-transform:uppercase; }
.paper-figure-head h3 { margin:5px 0 0; color:#293e5a; font-size:1.18rem; }
.paper-figure-card > img { display:block; width:100%; height:270px; object-fit:contain; border-radius:15px; background:#fff; }
.benchmark-overview-compact { display:block; padding:24px; }
.benchmark-overview-compact .panel-copy { max-width:none; }
.benchmark-overview-compact .taxonomy-grid { max-width:760px; }

/* Reduce text density and improve rhythm. */
.section { padding-top:88px; padding-bottom:88px; }
.centered-heading { max-width:780px; }
.centered-heading > p:last-child,.section-intro { max-width:680px; }
.compact-method-card { min-height:330px; }
.compact-method-copy p { max-width:285px; line-height:1.52; }
.visual-copy p { max-width:620px; line-height:1.55; }
.pipeline-copy ol li span { line-height:1.45; }

@media (max-width:980px){
  .paper-figures{grid-template-columns:1fr}.paper-figure-card>img{height:auto;max-height:420px}
}
@media (max-width:640px){
  .scan-face-frame{aspect-ratio:.95/1}.scan-chip,.scan-result{min-width:102px;padding:8px 9px}.scan-chip strong{font-size:.9rem}.scan-result strong{font-size:1.15rem}.scan-chip small,.scan-result small{font-size:.52rem}.face-scan-points i{width:4px;height:4px}.paper-figure-head{align-items:flex-start;flex-direction:column}.paper-figure-card{padding:15px}.section{padding-top:72px;padding-bottom:72px}
}

/* ===== Final Figure 1 scan hero ===== */
.figure-scan-hero {
  position: relative;
  min-height: 570px;
  display: grid;
  place-items: center;
  overflow: visible;
}
.figure-orbit {
  position: absolute;
  pointer-events: none;
  border: 1px solid rgba(52, 126, 229, .14);
  border-radius: 50%;
}
.figure-orbit-one { width: 600px; height: 430px; transform: rotate(-18deg); }
.figure-orbit-two { width: 665px; height: 525px; border-color: rgba(242, 143, 94, .12); transform: rotate(28deg); }
.figure-scan-card {
  position: relative;
  z-index: 2;
  width: min(100%, 620px);
  padding: 14px;
  border: 1px solid rgba(255,255,255,.92);
  border-radius: 30px;
  background: rgba(255,255,255,.79);
  box-shadow: 0 30px 86px rgba(45, 67, 100, .15);
  backdrop-filter: blur(16px);
  transform: rotate(1.15deg);
  transition: transform .25s ease, box-shadow .25s ease;
}
.figure-scan-card:hover { transform: rotate(.35deg) translateY(-3px); box-shadow: 0 34px 96px rgba(45,67,100,.18); }
.figure-scan-head,
.figure-scan-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 5px 9px 12px;
  color: #78889f;
  font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: .66rem;
  font-weight: 650;
  letter-spacing: .035em;
}
.figure-scan-foot { padding: 12px 9px 4px; }
.figure-scan-frame {
  position: relative;
  min-height: 390px;
  overflow: hidden;
  border-radius: 22px;
  background: linear-gradient(145deg, #f9fbff, #fff);
}
.figure-scan-frame img {
  display: block;
  width: 100%;
  height: 390px;
  object-fit: contain;
  object-position: center;
  background: #fff;
  filter: saturate(.98) contrast(1.01);
}
.figure-scan-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(28,59,92,.04), transparent 18%, transparent 82%, rgba(28,59,92,.04));
}
.figure-scan-line {
  position: absolute;
  z-index: 6;
  left: 0;
  right: 0;
  top: 2%;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(64,202,221,.85) 18%, #e8fbff 50%, rgba(104,112,241,.88) 82%, transparent);
  box-shadow: 0 0 18px rgba(63,198,220,.75), 0 0 36px rgba(104,112,241,.28);
  animation: figure1-scan 4.6s cubic-bezier(.45,0,.55,1) infinite;
}
.figure-scan-line::after {
  content: "";
  position: absolute;
  left: 0; right: 0; top: -23px;
  height: 46px;
  background: linear-gradient(to bottom, transparent, rgba(75,202,223,.11), rgba(110,104,239,.055), transparent);
}
.figure-output-pill {
  position: absolute;
  z-index: 7;
  left: 16px;
  bottom: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  border: 1px solid rgba(76,213,186,.28);
  border-radius: 12px;
  color: #e8f8f5;
  background: rgba(24,53,75,.91);
  box-shadow: 0 11px 28px rgba(24,53,75,.18);
  backdrop-filter: blur(9px);
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: .66rem;
}
.figure-output-pill i { width: 7px; height: 7px; border-radius: 50%; background: #36c69c; box-shadow: 0 0 10px rgba(54,198,156,.6); }
.figure-output-pill span { font-weight: 750; }
.figure-output-pill strong { font-weight: 700; }
.figure-paper-check { color: #2db98f; }
.figure-floating-metric {
  position: absolute;
  z-index: 4;
  display: grid;
  min-width: 132px;
  gap: 4px;
  padding: 15px 16px;
  border: 1px solid rgba(255,255,255,.92);
  border-radius: 19px;
  background: rgba(255,255,255,.9);
  box-shadow: 0 20px 46px rgba(42,63,92,.14);
  backdrop-filter: blur(14px);
}
.figure-floating-metric span {
  color: #74849b;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: .61rem;
  font-weight: 650;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.figure-floating-metric strong {
  font-family: "Space Grotesk", Inter, sans-serif;
  font-size: 2rem;
  line-height: 1;
  letter-spacing: -.055em;
}
.figure-floating-metric small { color: #65768d; font-size: .66rem; }
.figure-metric-clip { left: -18px; top: 88px; }
.figure-metric-clip strong { color: #3278f2; }
.figure-metric-dino { right: -26px; top: 190px; }
.figure-metric-dino strong { color: #7264ea; }
.figure-metric-ucf { right: -5px; bottom: 24px; }
.figure-metric-ucf strong { color: #ef6f5d; }
@keyframes figure1-scan {
  0% { transform: translateY(-30px); opacity: 0; }
  10% { opacity: 1; }
  50% { transform: translateY(370px); opacity: 1; }
  64% { opacity: 0; }
  100% { transform: translateY(-30px); opacity: 0; }
}

/* High-resolution paper figures */
.paper-figure-card img,
.pipeline-figure img,
.visual-image img,
.case-figure img { image-rendering: auto; }
.paper-figure-card img { width: 100%; max-height: 460px; object-fit: contain; }
.pipeline-figure img { width: 100%; max-height: 560px; object-fit: contain; background: #fff; }
.visual-image img { width: 100%; max-height: 760px; object-fit: contain; background: #fff; }

@media (max-width: 1100px) {
  .figure-scan-hero { min-height: 535px; }
  .figure-scan-card { width: min(100%, 650px); }
  .figure-metric-clip { left: 1%; }
  .figure-metric-dino { right: 1%; }
  .figure-metric-ucf { right: 5%; }
}
@media (max-width: 700px) {
  .figure-scan-hero { min-height: 430px; overflow: hidden; }
  .figure-orbit-one { width: 390px; height: 300px; }
  .figure-orbit-two { width: 440px; height: 360px; }
  .figure-scan-card { width: calc(100% - 12px); padding: 9px; border-radius: 22px; transform: none; }
  .figure-scan-head, .figure-scan-foot { font-size: .52rem; padding-left: 5px; padding-right: 5px; }
  .figure-scan-frame { min-height: 280px; border-radius: 15px; }
  .figure-scan-frame img { height: 280px; }
  .figure-floating-metric { min-width: 100px; padding: 9px 10px; border-radius: 14px; }
  .figure-floating-metric span { font-size: .49rem; }
  .figure-floating-metric strong { font-size: 1.25rem; }
  .figure-floating-metric small { font-size: .52rem; }
  .figure-metric-clip { left: -2px; top: 67px; }
  .figure-metric-dino { right: -2px; top: 147px; }
  .figure-metric-ucf { right: 8px; bottom: 3px; }
  .figure-output-pill { left: 9px; bottom: 8px; padding: 7px 9px; font-size: .52rem; }
  @keyframes figure1-scan {
    0% { transform: translateY(-24px); opacity: 0; }
    10% { opacity: 1; }
    50% { transform: translateY(265px); opacity: 1; }
    64% { opacity: 0; }
    100% { transform: translateY(-24px); opacity: 0; }
  }
}
@media (prefers-reduced-motion: reduce) {
  .figure-scan-line { animation: none; top: 49%; }
  .figure-scan-card { transition: none; }
}

/* ===== Layout refinement: unobstructed Figure 1 scan + clearer ablations ===== */
@media (min-width: 1101px) {
  .hero-grid {
    grid-template-columns: minmax(0, .9fr) minmax(620px, 1.1fr);
    gap: 42px;
  }
}
.figure-scan-hero {
  min-height: 565px;
  overflow: visible;
}
.figure-scan-card {
  width: min(100%, 720px);
  padding: 15px;
  border-radius: 30px;
  transform: none;
}
.figure-scan-card:hover {
  transform: translateY(-3px);
}
.figure-scan-layout {
  display: grid;
  grid-template-columns: 128px minmax(0, 1fr) 128px;
  gap: 14px;
  align-items: center;
}
.figure-scan-center {
  min-width: 0;
}
.figure-scan-frame {
  min-height: 0;
  aspect-ratio: 547.421 / 488.7244;
  padding: 9px;
  border: 1px solid rgba(206, 218, 232, .78);
  border-radius: 19px;
  background: #fff;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.8), 0 12px 30px rgba(45,67,100,.07);
}
.figure-scan-frame img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  background: #fff;
  filter: none;
}
.figure-scan-frame::after {
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(44,76,111,.025), transparent 18%, transparent 82%, rgba(44,76,111,.025));
}
.figure-scan-line {
  left: 9px;
  right: 9px;
  top: 0;
  animation: figure1-scan-refined 4.8s cubic-bezier(.45,0,.55,1) infinite;
}
@keyframes figure1-scan-refined {
  0% { top: 2%; opacity: 0; }
  9% { opacity: 1; }
  54% { top: 94%; opacity: 1; }
  67% { opacity: 0; }
  100% { top: 2%; opacity: 0; }
}
.figure-metric-rail {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 18px;
  min-width: 0;
}
.figure-floating-metric {
  position: relative;
  inset: auto;
  min-width: 0;
  width: 100%;
  padding: 15px 13px;
  border-radius: 17px;
  box-shadow: 0 15px 38px rgba(42,63,92,.11);
}
.figure-metric-rail-left .figure-floating-metric::after,
.figure-metric-rail-right .figure-floating-metric::before {
  content: "";
  position: absolute;
  top: 50%;
  width: 14px;
  border-top: 1px dashed rgba(112, 126, 151, .42);
}
.figure-metric-rail-left .figure-floating-metric::after { right: -14px; }
.figure-metric-rail-right .figure-floating-metric::before { left: -14px; }
.figure-floating-metric strong {
  font-size: 1.72rem;
}
.figure-metric-clip strong { color: #3278f2; }
.figure-metric-dino strong { color: #e38c42; }
.figure-metric-ucf strong { color: #7557f6; }
.figure-output-pill {
  position: static;
  width: fit-content;
  max-width: 100%;
  margin: 11px auto 0;
  padding: 9px 13px;
  color: #e8f8f5;
  border-color: rgba(76,213,186,.24);
  background: rgba(25, 54, 76, .93);
}
.figure-output-pill strong {
  white-space: normal;
}
.figure-scan-head,
.figure-scan-foot {
  padding-left: 5px;
  padding-right: 5px;
}
.figure-scan-foot {
  padding-top: 12px;
}

#ablation {
  background:
    radial-gradient(circle at 8% 8%, rgba(67,145,214,.07), transparent 22rem),
    radial-gradient(circle at 92% 92%, rgba(229,154,85,.065), transparent 24rem),
    #fffdfb;
}
.ablation-heading {
  max-width: 760px;
}
.ablation-heading h2 {
  font-size: clamp(2.45rem, 4.4vw, 4.35rem);
  letter-spacing: -.045em;
}
.ablation-heading > p:last-child {
  max-width: 690px;
  margin-inline: auto;
}
.refined-ablation-grid {
  gap: 20px;
}
.ablation-card {
  position: relative;
  overflow: hidden;
  padding: 24px;
  border-radius: 24px;
  background: rgba(255,255,255,.9);
  box-shadow: 0 18px 48px rgba(54,74,101,.075);
}
.ablation-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: var(--ablation-accent, #7557f6);
}
.ablation-encoders { --ablation-accent: linear-gradient(90deg,#4a9ce4,#7557f6); }
.ablation-lea { --ablation-accent: linear-gradient(90deg,#7557f6,#9a80dc); }
.ablation-uaf { --ablation-accent: linear-gradient(90deg,#e69a55,#7557f6); }
.ablation-lora { --ablation-accent: linear-gradient(90deg,#9b7abc,#c27c98); }
.ablation-head {
  grid-template-columns: 42px 1fr;
  align-items: start;
}
.ablation-head > span {
  width: 40px;
  height: 40px;
  border-radius: 13px;
}
.ablation-head h3 {
  font-size: 1.14rem;
}
.ablation-head p {
  max-width: 520px;
  font-size: .78rem;
  line-height: 1.5;
}
.mini-bars {
  gap: 10px;
  margin-top: 21px;
}
.mini-row {
  grid-template-columns: 104px 1fr 51px;
  gap: 11px;
}
.mini-track {
  height: 9px;
  background: #f0f4f8;
}
.ablation-finding {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 18px;
  padding: 13px 15px;
  border: 1px solid rgba(117,87,246,.12);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(117,87,246,.055), rgba(67,145,214,.035));
}
.ablation-finding span {
  color: #728198;
  font-size: .68rem;
  font-weight: 750;
  letter-spacing: .035em;
  text-transform: uppercase;
}
.ablation-finding strong {
  color: #6758c9;
  font-size: .8rem;
  text-align: right;
}

@media (max-width: 1100px) {
  .figure-scan-card { width: min(100%, 760px); }
}
@media (max-width: 760px) {
  .figure-scan-hero { min-height: auto; overflow: visible; }
  .figure-scan-card { width: 100%; padding: 10px; border-radius: 23px; }
  .figure-scan-layout {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .figure-scan-center {
    grid-column: 1 / -1;
    grid-row: 1;
  }
  .figure-metric-rail { display: contents; }
  .figure-metric-clip { grid-column: 1; grid-row: 2; }
  .figure-metric-dino { grid-column: 2; grid-row: 2; }
  .figure-metric-ucf { grid-column: 1 / -1; grid-row: 3; }
  .figure-metric-rail-left .figure-floating-metric::after,
  .figure-metric-rail-right .figure-floating-metric::before { display: none; }
  .figure-floating-metric { padding: 10px 11px; }
  .figure-floating-metric strong { font-size: 1.3rem; }
  .figure-scan-frame { padding: 5px; border-radius: 14px; }
  .figure-output-pill { font-size: .56rem; }
  .figure-scan-head, .figure-scan-foot { font-size: .5rem; }
  .ablation-finding { align-items: flex-start; flex-direction: column; }
  .ablation-finding strong { text-align: left; }
}
@media (prefers-reduced-motion: reduce) {
  .figure-scan-line { animation: none; top: 50%; }
}

/* Figure 1 stage: keep the full figure unobstructed, with metrics outside the image area. */
@media (min-width: 761px) {
  .figure-scan-card {
    width: min(100%, 660px);
    overflow: visible;
  }
  .figure-scan-layout {
    position: relative;
    display: block;
    padding: 0 22px;
  }
  .figure-scan-center {
    position: relative;
    z-index: 2;
  }
  .figure-scan-frame {
    width: 100%;
    padding: 13px;
  }
  .figure-metric-rail {
    position: absolute;
    z-index: 5;
    display: flex;
    width: 120px;
    pointer-events: none;
  }
  .figure-metric-rail-left {
    left: -54px;
    top: 74px;
  }
  .figure-metric-rail-right {
    right: -56px;
    top: 118px;
    gap: 138px;
  }
  .figure-floating-metric {
    width: 120px;
    min-width: 120px;
    padding: 14px 13px;
  }
  .figure-metric-rail-left .figure-floating-metric::after {
    width: 25px;
    right: -25px;
  }
  .figure-metric-rail-right .figure-floating-metric::before {
    width: 25px;
    left: -25px;
  }
  .figure-output-pill {
    margin-top: 12px;
  }
}
@media (min-width: 1101px) {
  .figure-scan-card { width: min(100%, 700px); }
  .figure-scan-layout { padding-left: 38px; padding-right: 38px; }
  .figure-metric-rail-left { left: -50px; }
  .figure-metric-rail-right { right: -52px; }
}


/* ========================================================================
   FINAL STABLE HERO LAYOUT
   One consolidated desktop/tablet/mobile implementation.
   ======================================================================== */
html, body { overflow-x: clip; }

.figure-scan-line {
  animation: figure1-scan-bidirectional 3.1s ease-in-out infinite alternate;
}

@keyframes figure1-scan-bidirectional {
  0% { top: 6%; opacity: .25; }
  8% { opacity: 1; }
  100% { top: 90%; opacity: 1; }
}

@media (min-width: 1321px) {
  .hero {
    padding-top: 86px;
    padding-bottom: 34px;
  }

  .hero .container.hero-grid {
    width: min(calc(100% - 64px), 1640px);
    grid-template-columns: minmax(0, 780px) minmax(0, 1fr);
    column-gap: clamp(52px, 3.8vw, 72px);
    align-items: center;
  }

  .hero-copy {
    max-width: 780px;
    padding: 0;
  }

  .eyebrow-row { margin-bottom: 18px; }

  .paper-title {
    max-width: 780px;
  }

  .paper-title .title-line-primary {
    max-width: 760px;
    font-size: clamp(4.1rem, 5.1vw, 5.65rem);
    line-height: .98;
  }

  .paper-title .primary-row {
    display: block;
  }

  .paper-title .primary-row + .primary-row {
    margin-top: 5px;
  }

  .paper-title .title-line-secondary {
    display: block;
    max-width: 760px;
    margin-top: 26px;
    font-size: clamp(2rem, 2.35vw, 2.55rem);
    line-height: 1.13;
  }

  .hero-lead {
    max-width: 730px;
    margin-top: 24px;
    margin-bottom: 18px;
    line-height: 1.6;
  }

  .authors {
    max-width: 780px;
    margin-top: 0;
    font-size: .92rem;
  }

  .authors .author-row {
    display: flex;
    flex-wrap: nowrap;
    align-items: baseline;
    gap: 0 7px;
    white-space: nowrap;
  }

  .affiliations {
    max-width: 780px;
    margin-top: 9px;
  }

  .hero-actions {
    margin-top: 24px;
  }

  .figure-scan-hero {
    min-width: 0;
    min-height: 520px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    overflow: visible;
    transform: none;
    padding: 0;
  }

  .figure-scan-card {
    width: min(100%, 720px);
    max-width: 720px;
    padding: 14px;
    border-radius: 30px;
    overflow: visible;
    transform: rotate(1deg);
    transform-origin: 52% 50%;
    box-shadow: 0 30px 86px rgba(45,67,100,.15);
  }

  .figure-scan-card:hover {
    transform: rotate(.8deg) translateY(-2px);
  }

  .figure-scan-head,
  .figure-scan-layout,
  .figure-scan-foot {
    transform: none;
  }

  .figure-scan-head {
    padding: 6px 8px 11px;
    font-size: .68rem;
    color: #6b7b92;
    font-weight: 700;
    letter-spacing: .02em;
  }

  .figure-scan-layout {
    position: relative;
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr) 92px;
    gap: 12px;
    align-items: center;
    padding: 0;
  }

  .figure-scan-center {
    min-width: 0;
    position: relative;
    z-index: 2;
  }

  .figure-metric-rail {
    position: static;
    z-index: 3;
    width: 92px;
    min-width: 92px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    pointer-events: none;
  }

  .figure-metric-rail-left {
    justify-content: center;
  }

  .figure-metric-rail-right {
    align-self: stretch;
    justify-content: space-around;
    gap: 18px;
  }

  .figure-floating-metric {
    position: relative;
    inset: auto;
    width: 92px;
    min-width: 92px;
    padding: 12px 9px;
    border-radius: 17px;
    box-shadow: 0 15px 38px rgba(42,63,92,.11);
  }

  .figure-floating-metric span {
    font-size: .5rem;
    font-weight: 700;
    letter-spacing: .035em;
    color: #687991;
  }

  .figure-floating-metric strong {
    font-size: 1.42rem;
  }

  .figure-floating-metric small {
    font-size: .55rem;
    color: #63738b;
  }

  .figure-metric-rail-left .figure-floating-metric::after,
  .figure-metric-rail-right .figure-floating-metric::before {
    width: 12px;
    border-top: 1px dashed rgba(112,126,151,.42);
  }

  .figure-metric-rail-left .figure-floating-metric::after { right: -12px; }
  .figure-metric-rail-right .figure-floating-metric::before { left: -12px; }

  .figure-scan-frame {
    width: 100%;
    min-height: 0;
    aspect-ratio: 547.421 / 488.7244;
    padding: 5px;
    overflow: hidden;
    border-radius: 20px;
    background: #fff;
  }

  .figure-scan-frame img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    transform: none;
    filter: none;
    image-rendering: auto;
  }

  .figure-scan-line {
    left: 5px;
    right: 5px;
  }

  .figure-output-pill {
    position: static;
    width: fit-content;
    max-width: 92%;
    margin: 11px auto 0;
    padding: 9px 13px;
    font-size: .58rem;
  }

  .figure-scan-foot {
    padding: 11px 8px 4px;
    font-size: .57rem;
    color: #708098;
    font-weight: 650;
  }

  .metrics-grid {
    margin-top: 42px;
  }
}

@media (min-width: 1101px) and (max-width: 1320px) {
  .hero {
    padding-top: 88px;
    padding-bottom: 34px;
  }

  .hero .container.hero-grid {
    width: min(calc(100% - 48px), 1260px);
    grid-template-columns: minmax(0, 640px) minmax(0, 1fr);
    column-gap: 34px;
    align-items: center;
  }

  .hero-copy { max-width: 640px; }
  .paper-title { max-width: 640px; }
  .paper-title .title-line-primary { font-size: clamp(3.35rem, 5vw, 4.35rem); }
  .paper-title .primary-row { display: block; }
  .paper-title .primary-row + .primary-row { margin-top: 4px; }
  .paper-title .title-line-secondary { margin-top: 20px; font-size: clamp(1.7rem, 2.45vw, 2.05rem); line-height: 1.16; }
  .hero-lead { max-width: 610px; margin-top: 20px; margin-bottom: 15px; }
  .authors .author-row { display: flex; flex-wrap: wrap; gap: 4px 7px; }
  .affiliations { margin-top: 8px; }
  .hero-actions { margin-top: 20px; }

  .figure-scan-hero {
    min-width: 0;
    min-height: 470px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    overflow: visible;
    transform: none;
    padding: 0;
  }

  .figure-scan-card {
    width: min(100%, 570px);
    max-width: 570px;
    padding: 12px;
    border-radius: 27px;
    overflow: visible;
    transform: rotate(.9deg);
  }

  .figure-scan-card:hover { transform: rotate(.7deg) translateY(-2px); }
  .figure-scan-head, .figure-scan-layout, .figure-scan-foot { transform: none; }
  .figure-scan-head { padding: 5px 7px 9px; font-size: .61rem; font-weight: 700; }
  .figure-scan-layout { display: grid; grid-template-columns: 78px minmax(0,1fr) 78px; gap: 9px; align-items: center; padding: 0; }
  .figure-metric-rail { position: static; width: 78px; min-width: 78px; display:flex; flex-direction:column; pointer-events:none; }
  .figure-metric-rail-left { justify-content:center; }
  .figure-metric-rail-right { align-self:stretch; justify-content:space-around; gap:12px; }
  .figure-floating-metric { position:relative; inset:auto; width:78px; min-width:78px; padding:10px 7px; border-radius:15px; }
  .figure-floating-metric span { font-size:.44rem; }
  .figure-floating-metric strong { font-size:1.22rem; }
  .figure-floating-metric small { font-size:.49rem; }
  .figure-metric-rail-left .figure-floating-metric::after,
  .figure-metric-rail-right .figure-floating-metric::before { width:9px; }
  .figure-metric-rail-left .figure-floating-metric::after { right:-9px; }
  .figure-metric-rail-right .figure-floating-metric::before { left:-9px; }
  .figure-scan-frame { aspect-ratio:547.421/488.7244; padding:4px; overflow:hidden; border-radius:17px; }
  .figure-scan-frame img { width:100%; height:100%; object-fit:contain; transform:none; filter:none; }
  .figure-output-pill { position:static; max-width:92%; margin:9px auto 0; padding:8px 10px; font-size:.52rem; }
  .figure-scan-foot { padding:9px 7px 3px; font-size:.51rem; }
  .metrics-grid { margin-top:30px; }
}

@media (min-width: 761px) and (max-width: 1100px) {
  .hero .container.hero-grid {
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .hero-copy { max-width: 820px; }
  .figure-scan-hero { max-width: 760px; width: 100%; min-height: auto; margin-inline: auto; transform: none; }
  .figure-scan-card { width: 100%; transform: rotate(.7deg); }
  .figure-scan-head, .figure-scan-layout, .figure-scan-foot { transform: none; }
  .figure-scan-layout { display:grid; grid-template-columns:90px minmax(0,1fr) 90px; gap:12px; padding:0; align-items:center; }
  .figure-metric-rail { position:static; width:90px; min-width:90px; display:flex; flex-direction:column; }
  .figure-metric-rail-left { justify-content:center; }
  .figure-metric-rail-right { align-self:stretch; justify-content:space-around; }
  .figure-floating-metric { position:relative; inset:auto; width:90px; min-width:90px; }
  .figure-scan-frame img { transform:none; }
}

@media (max-width: 760px) {
  .hero { padding-top: 106px; }
  .figure-scan-card { transform: none; }
  .figure-scan-head, .figure-scan-layout, .figure-scan-foot { transform: none; }
  .figure-scan-frame img { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .figure-scan-line { animation: none; top: 50%; }
}



/* ========================================================================
   FINAL NAVIGATION ALIGNMENT
   Align the UCF-Net brand with the hero and section content boundary.
   ======================================================================== */
@media (min-width: 1321px) {
  .nav-shell {
    width: min(calc(100% - 64px), 1640px);
  }
}

@media (min-width: 1121px) and (max-width: 1320px) {
  .nav-shell {
    width: min(calc(100% - 48px), 1260px);
  }
}

@media (max-width: 1120px) {
  .nav-shell {
    width: min(calc(100% - 32px), 100%);
  }
}


/* Compact efficiency note retained under Ablation after removing the standalone section. */
.ablation-efficiency-note {
  margin-top: 28px;
  padding: 16px 20px;
  display: flex;
  align-items: center;
  gap: 10px;
  border-left: 3px solid #6f5de7;
  border-radius: 0 16px 16px 0;
  background: rgba(255,255,255,.72);
  box-shadow: 0 12px 30px rgba(49,68,94,.06);
  color: #5f718a;
  font-size: .92rem;
  line-height: 1.55;
}
.ablation-efficiency-note strong { color: #2f4664; white-space: nowrap; }
@media (max-width: 760px) {
  .ablation-efficiency-note { align-items: flex-start; flex-direction: column; gap: 4px; }
  .ablation-efficiency-note strong { white-space: normal; }
}
