/*
 * Yu Lab inner pages
 * Extends the homepage visual system without changing routes or content structure.
 */

body[data-inner-hero] {
  --inner-bg: rgb(var(--ground-rgb));
  --inner-raised: rgb(var(--ground-4-rgb));
  --inner-soft: color-mix(in srgb, rgb(var(--ground-rgb)) 88%, rgb(var(--ink-rgb)));
  --inner-text: rgb(var(--ink-rgb));
  --inner-muted: rgba(var(--ink-rgb),.66);
  --inner-faint: rgba(var(--ink-rgb),.46);
  --inner-line: rgba(var(--ink-rgb),.14);
  --inner-line-strong: rgba(var(--ink-rgb),.25);
  --inner-red: #94070A;
  --inner-red-hot: #94070A;
  --inner-display: "Avenir Next", "Helvetica Neue", Arial, sans-serif;
  --serif: var(--inner-display);
  --pku-red-fill: var(--inner-red);
  --signal-red: var(--inner-red-hot);
  --carbon-black: var(--inner-bg);
  --warm-black: var(--inner-raised);
  --warm-black-2: var(--inner-soft);
  --warm-ivory: var(--inner-text);
  --paper-white: var(--inner-bg);
  --ink: var(--inner-text);
  --ink-soft: var(--inner-muted);
  --mineral-grey: var(--inner-faint);
  --border-grey: var(--inner-line);
  --line: var(--inner-line);
  --line-dark: var(--inner-line);
  --sec-y: clamp(72px, 8vw, 132px);
  background: var(--inner-bg);
  color: var(--inner-text);
  font-family: var(--inner-display);
}

body[data-inner-hero] .h1,
body[data-inner-hero] .h2,
body[data-inner-hero] .h3,
body[data-inner-hero] .h4,
body[data-inner-hero] .display {
  color: var(--inner-text);
  font-family: var(--inner-display);
  font-weight: 570;
  letter-spacing: -.045em;
}

body[data-inner-hero] .lede,
body[data-inner-hero] .body-txt,
body[data-inner-hero] .small,
body[data-inner-hero] .tiny {
  color: var(--inner-muted);
}

body[data-inner-hero] .lede {
  max-width: 58ch;
}

body[data-inner-hero] .sec {
  background: var(--inner-bg) !important;
  border-top: 1px solid var(--inner-line);
}

body[data-inner-hero] .sec:nth-of-type(even) {
  background: var(--inner-raised) !important;
}

/* Navigation stays in one dark material across every page. */
body[data-inner-hero] .nav,
body[data-inner-hero] .nav.solid,
body[data-inner-hero] .nav.forced {
  background: rgba(26,18,20,.96);
  border-bottom-color: rgba(242,239,232,.14);
  color: #F2EFE8;
}

body[data-inner-hero] .nav-item.active > a,
body[data-inner-hero] .nav-item.active > button,
body[data-inner-hero] .nav-item > a:hover,
body[data-inner-hero] .nav-item > button:hover {
  color: var(--inner-red-hot);
  background: rgba(148, 21, 26, .14);
}

body[data-inner-hero] .mega,
body[data-inner-hero] .drawer {
  color: var(--inner-text);
  background: rgba(var(--ground-4-rgb),.98);
  border-color: var(--inner-line);
  box-shadow: 0 28px 90px rgba(var(--shadow-rgb),calc(.5 * var(--shadow-k)));
}

body[data-inner-hero] .mega-col a .sub,
body[data-inner-hero] .drawer-sub a {
  color: var(--inner-muted);
}

body[data-inner-hero] .mega-foot,
body[data-inner-hero] .drawer-item {
  border-color: var(--inner-line);
}

/* Shared media hero. Image choice follows the information category. */
body[data-inner-hero] .phero {
  min-height: min(72dvh, 760px);
  padding: calc(var(--nav-h) + clamp(48px, 6vw, 90px)) 0 clamp(58px, 7vw, 96px);
  display: flex;
  align-items: flex-end;
  isolation: isolate;
  background: var(--inner-bg);
}

body[data-inner-hero] .phero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background-image: var(--inner-hero-image);
  background-position: center;
  background-size: cover;
  opacity: .8;
  transform: scale(1.015);
  animation: inner-hero-enter 1.4s cubic-bezier(.16, 1, .3, 1) both;
}

body[data-inner-hero] .phero::after {
  z-index: -1;
  /* The left is unchanged: the headline sits there and needs a clean field, and
     96% cover is what gives it a contrast of 14.7. The right is where this was
     too heavy — the photograph peaked at 56% visible around the three-quarter
     mark and was then covered back up to 42% at the outer edge, so it was never
     fully itself anywhere and read as fog rather than as a picture. The clear
     window opens further and the far edge stops closing again. */
  background:
    linear-gradient(90deg, rgba(var(--ground-rgb),.98) 0%, rgba(var(--ground-rgb),.84) 40%, rgba(var(--ground-rgb),.16) 78%, rgba(var(--ground-rgb),.34) 100%),
    linear-gradient(0deg, rgba(var(--ground-rgb),.88) 0%, transparent 48%, rgba(var(--ground-rgb),.5) 100%);
}

body[data-inner-hero="research"] {
  --inner-hero-image: url("../media/generated/microbial-community-darkfield-v4.jpg");
}

body[data-inner-hero="platform"] {
  --inner-hero-image: url("../media/generated/microbex-infrastructure-v2.jpg");
}

body[data-inner-hero="people"] {
  --inner-hero-image: url("../media/generated/field-collaboration-v1.jpg");
}

body[data-inner-hero="join"] {
  --inner-hero-image: url("../media/generated/join-202608.jpg");
}

body[data-inner-hero="discovery"] {
  --inner-hero-image: url("../media/generated/hero-dna-luminous-continuous-v5.jpg");
}

body[data-inner-hero="methods"] {
  --inner-hero-image: url("../media/generated/microbial-dark-matter-genome-v3.jpg");
}

body[data-page="news"][data-inner-hero="discovery"] {
  --inner-hero-image: url("../media/generated/microbial-dark-matter-genome-v3.jpg");
}

body[data-page="publications"][data-inner-hero="discovery"] {
  --inner-hero-image: url("../media/generated/publication-manganese-redox-v4.jpg");
}

body[data-page="research"][data-inner-hero="discovery"] {
  --inner-hero-image: url("../media/generated/hero-dna-luminous-continuous-v5.jpg");
}

body[data-inner-hero] .phero-in {
  width: 100%;
}

body[data-inner-hero] .phero .h1 {
  max-width: 12ch;
  font-size: clamp(2.6rem, 5.2vw, 5.8rem);
  line-height: 1.05;
  font-weight: 520;
  letter-spacing: -.065em;
  text-wrap: balance;
  margin-bottom: 24px;
}

body[data-inner-hero] .phero .lede {
  max-width: 52ch;
  font-size: clamp(1rem, 1.25vw, 1.2rem);
  line-height: 1.58;
  color: rgba(var(--ink-rgb),.72);
}

body[data-inner-hero] .phero .sub {
  color: rgba(var(--ink-rgb),.54);
}

body[data-inner-hero] .phero .num:not(.sec-head .num) {
  color: var(--inner-red-hot) !important;
}

body[data-inner-hero] .crumb {
  color: rgba(var(--ink-rgb),.48);
}

body[data-inner-hero] .crumb a:hover {
  color: var(--inner-red-hot);
}

@keyframes inner-hero-enter {
  from { opacity: 0; transform: scale(1.06); }
  to { opacity: .8; transform: scale(1.015); }
}

/* Editorial section rhythm. */
body[data-inner-hero] .sec-head {
  grid-template-columns: minmax(0, .44fr) minmax(0, .56fr);
  margin-bottom: clamp(40px, 5vw, 74px);
}

body[data-inner-hero] .sec-head .num,
body[data-inner-hero] .eyebrow,
body[data-inner-hero] .tier-head .tn,
body[data-inner-hero] .cell .cn,
body[data-inner-hero] .pd-block .lbl {
  color: var(--inner-red-hot);
}

body[data-inner-hero] .sec-head .h1 {
  font-size: clamp(2.4rem, 4.7vw, 5.2rem);
  line-height: .96;
}

body[data-inner-hero] .fjudge,
body[data-inner-hero] .pcard1 .claim,
body[data-inner-hero] .fp h3,
body[data-inner-hero] .fp .q {
  font-family: var(--inner-display) !important;
}

body[data-inner-hero] .fjudge {
  color: var(--inner-text);
  font-weight: 480;
}

body[data-inner-hero] .bullets {
  gap: 0;
}

body[data-inner-hero] .bullets li {
  color: var(--inner-muted);
  padding: 14px 0 14px 22px;
  border-bottom: 1px solid var(--inner-line);
}

body[data-inner-hero] .bullets li::before {
  width: 8px;
  height: 1px;
  top: 26px;
  border-radius: 0;
  background: var(--inner-red-hot);
}

/* Content surfaces use lines and depth, not floating white cards. */
body[data-inner-hero] .grid2,
body[data-inner-hero] .grid3,
body[data-inner-hero] .grid4,
body[data-inner-hero] .t2,
body[data-inner-hero] .member-grid,
body[data-inner-hero] .roles,
body[data-inner-hero] .tax,
body[data-inner-hero] .funnel,
body[data-inner-hero] .deltas,
body[data-inner-hero] .resz,
body[data-inner-hero] .newsgrid {
  background: var(--inner-line);
  border-color: var(--inner-line);
  border-radius: 2px;
}

body[data-inner-hero] .grid4,
body[data-inner-hero] .roles,
body[data-inner-hero] .member-grid,
body[data-inner-hero] .t2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body[data-inner-hero] .cell,
body[data-inner-hero] .pcard2,
body[data-inner-hero] .prow,
body[data-inner-hero] .taxcol,
body[data-inner-hero] .fstage,
body[data-inner-hero] .delta,
body[data-inner-hero] .rz,
body[data-inner-hero] .mcard,
body[data-inner-hero] .rcard,
body[data-inner-hero] .ncard {
  color: var(--inner-text);
  background: var(--inner-raised);
}

body[data-inner-hero] .cell p,
body[data-inner-hero] .pcard2 p,
body[data-inner-hero] .prow .cl,
body[data-inner-hero] .taxcol li,
body[data-inner-hero] .fstage p,
body[data-inner-hero] .rz .concl,
body[data-inner-hero] .mcard p,
body[data-inner-hero] .rcard p,
body[data-inner-hero] .ncard p {
  color: var(--inner-muted);
}

body[data-inner-hero] .cell,
body[data-inner-hero] .pcard2,
body[data-inner-hero] .prow,
body[data-inner-hero] .mcard,
body[data-inner-hero] .rcard,
body[data-inner-hero] .ncard {
  transition: transform .45s var(--ease-out), background .45s var(--ease-out), border-color .45s var(--ease-out);
}

body[data-inner-hero] a.cell:hover,
body[data-inner-hero] .pcard2:hover,
body[data-inner-hero] .prow:hover,
body[data-inner-hero] .mcard:hover,
body[data-inner-hero] .rcard:hover,
body[data-inner-hero] .ncard:hover {
  color: var(--inner-text);
  background: rgb(var(--ground-4-rgb));
  transform: translateY(-2px);
}

body[data-inner-hero] .chip {
  color: var(--inner-muted);
  background: transparent;
  border-color: var(--inner-line);
  border-radius: 2px;
}

body[data-inner-hero] a.chip:hover {
  color: var(--inner-text);
  border-color: var(--inner-red-hot);
  background: rgba(148, 21, 26, .14);
}

body[data-inner-hero] .btn {
  border-radius: var(--r-sm);
}

body[data-inner-hero] .btn-line,
body[data-inner-hero] .btn-ghost {
  color: var(--inner-text);
  border-color: var(--inner-line-strong);
}

body[data-inner-hero] .btn-line:hover,
body[data-inner-hero] .btn-ghost:hover {
  color: var(--inner-text);
  border-color: var(--inner-red-hot);
  background: rgba(148, 21, 26, .18);
}

body[data-inner-hero] .btn-primary {
  background: var(--inner-red);
}

body[data-inner-hero] .arrow-link {
  color: var(--inner-red-hot);
}

body[data-inner-hero] .badge {
  border-radius: 2px;
}

body[data-inner-hero] .note {
  border-color: var(--inner-line);
  color: var(--inner-faint);
}

/* Research imagery. */
body[data-inner-hero] .focus-row {
  grid-template-columns: minmax(0, .58fr) minmax(280px, .42fr);
  border-color: var(--inner-line);
}

body[data-inner-hero] .focus-row:last-child {
  border-bottom-color: var(--inner-line);
}

body[data-inner-hero] .focus-media {
  border-radius: 2px;
  background: var(--inner-raised);
}

body[data-inner-hero] .focus-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.75) contrast(1.08);
  transition: transform .8s var(--ease-out), filter .8s var(--ease-out);
}

/* `transform` on these images now belongs to the scroll-linked drift in
   system.css, which reads on touch too. Hover keeps the tonal lift. */
body[data-inner-hero] .focus-row:hover .focus-media img {
  filter: saturate(.98) contrast(1.02) brightness(1.04);
}

/* Platform overview gains one dominant product card. */
body[data-inner-hero] .pillrow {
  color: var(--inner-text);
  background: var(--inner-raised);
  border-color: var(--inner-line);
  border-radius: 2px;
}

body[data-inner-hero] .pillrow b,
body[data-inner-hero] .flow span,
body[data-inner-hero] .srcs b {
  color: var(--inner-text);
  background: rgba(var(--ink-rgb),.055);
  border-color: var(--inner-line);
  border-radius: 2px;
}

body[data-inner-hero] .pillrow b.hot {
  background: var(--inner-red);
}

body[data-inner-hero] .filterbar button,
body[data-inner-hero] .tabs button {
  color: var(--inner-muted);
  background: transparent;
  border-color: var(--inner-line);
}

body[data-inner-hero] .filterbar button:hover,
body[data-inner-hero] .tabs button:hover {
  color: var(--inner-text);
  border-color: var(--inner-red-hot);
}

body[data-inner-hero] .filterbar button.on,
body[data-inner-hero] .tabs button.on {
  color: var(--inner-text);
  background: var(--inner-red);
  border-color: var(--inner-red);
}

body[data-inner-hero] .t1 {
  grid-template-columns: minmax(0, 1.28fr) minmax(300px, .72fr);
  gap: 16px;
}

body[data-inner-hero] .pcard1:first-child {
  grid-row: span 2;
}

body[data-inner-hero] .pcard1 {
  color: var(--inner-text);
  background: var(--inner-raised);
  border-color: var(--inner-line);
  border-radius: 2px;
}

body[data-inner-hero] .pcard1:hover {
  box-shadow: 0 24px 70px rgba(var(--shadow-rgb),calc(.34 * var(--shadow-k)));
}

body[data-inner-hero] .pcard1 .media {
  overflow: hidden;
}

body[data-inner-hero] .pcard1 .media img {
  filter: saturate(.82) contrast(1.05);
  transition: transform .8s var(--ease-out), filter .8s var(--ease-out);
}

body[data-inner-hero] .pcard1:hover .media img {
  transform: scale(1.03);
  filter: saturate(1) contrast(1);
}

body[data-inner-hero] .t3,
body[data-inner-hero] .prow,
body[data-inner-hero] .pd-side {
  border-color: var(--inner-line);
}

body[data-inner-hero] .pd-side {
  background: var(--inner-line);
  border-radius: 2px;
}

body[data-inner-hero] .pd-side .sblock,
body[data-inner-hero] .out,
body[data-inner-hero] .fmstep {
  color: var(--inner-text);
  background: var(--inner-raised);
  border-color: var(--inner-line);
}

body[data-inner-hero] .pd-side .muted,
body[data-inner-hero] .fmstep span {
  color: var(--inner-muted);
}

body[data-inner-hero] .pd-block {
  padding-bottom: clamp(28px, 3.6vw, 48px);
  border-bottom: 1px solid var(--inner-line);
}

body[data-inner-hero] .aa .tr,
body[data-inner-hero] .bbar .btr,
body[data-inner-hero] .cov .ctr,
body[data-inner-hero] .mkt-bar,
body[data-inner-hero] .taxcol .diff {
  background: rgba(var(--ink-rgb),.1);
}

body[data-inner-hero] .pmedia,
body[data-inner-hero] .codeblk {
  border-color: var(--inner-line);
  border-radius: 2px;
}

/* Public platform framework: broad research logic, published evidence, no implementation detail. */
body[data-inner-hero] .public-framework,
body[data-inner-hero] .public-capabilities,
body[data-inner-hero] .research-evidence,
body[data-inner-hero] .public-results {
  scroll-margin-top: calc(var(--nav-h) + 24px);
}

body[data-inner-hero] .public-framework-copy {
  max-width: 900px;
  margin-bottom: clamp(36px, 5vw, 72px);
}

body[data-inner-hero] .framework-kicker,
body[data-inner-hero] .public-section-title > span,
body[data-inner-hero] .public-disclosure > span {
  display: block;
  margin-bottom: 18px;
  color: var(--inner-red-hot);
  font: 600 10px/1.2 var(--mono);
  letter-spacing: .15em;
  text-transform: uppercase;
}

body[data-inner-hero] .public-framework h2,
body[data-inner-hero] .public-section-title h2 {
  max-width: 16ch;
  margin: 0;
  color: var(--inner-text);
  font-size: clamp(2.6rem, 5.8vw, 6.2rem);
  font-weight: 520;
  letter-spacing: -.06em;
  line-height: .94;
}

body[data-inner-hero] .public-framework-copy > p {
  max-width: 58ch;
  margin: 26px 0 0;
  color: var(--inner-muted);
  font-size: 1rem;
  line-height: 1.65;
}

body[data-inner-hero] .framework-visual {
  /* Matched to the homepage panel, which is the one that works. The difference
     was never that a panel existed — it is that this one had no head to it and
     a red glow five times too strong (.22 against the homepage's .043), so it
     read as a tinted rectangle wrapped around the diagram rather than as a
     card the diagram lives in. Radius, hairline, inset lip and shadow are the
     homepage's values. */
  border: 1px solid rgba(var(--ink-rgb),.10);
  border-radius: 18px;
  overflow: hidden;
  background: none;
  /* The drop shadow belongs on this element, not the one inside it: overflow is
     hidden here, so an outer shadow declared on the child is clipped away and
     never paints. Only the inset lip stays inside. */
  box-shadow: 0 24px 64px -30px rgba(var(--shadow-rgb),calc(.22 * var(--shadow-k)));
}

body[data-inner-hero] .mx-platform {
  --mx-spot-x: 50%;
  --mx-spot-y: 30%;
  position: relative;
  isolation: isolate;
  /* 38 left the outermost cards 40px from a panel edge 1137px wide — tight
     enough that the diagram read as pressed against it. The note below the
     stage already contributes its own 65px, so the top gets a little more than
     the bottom: the two ends then look equal rather than measure equal. */
  /* The homepage's 38.4px, expressed as the clamp it comes from. */
  padding: clamp(24px, 3vw, 38.4px);
  overflow: hidden;
  /* The panel's surface lives here. The red glow is the homepage's .043, not
     the .22 this page used to carry — at five times the strength it stopped
     being atmosphere and became a pink field with the element's own edges. */
  background:
    radial-gradient(circle at 12% 0%, rgba(148,21,26,.043), transparent 34%),
    linear-gradient(180deg, rgb(var(--ground-3-rgb)) 0%, rgb(var(--ground-2-rgb)) 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
}

body[data-inner-hero] .mx-platform::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(var(--ink-rgb),.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(var(--ink-rgb),.025) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, rgba(var(--shadow-rgb),calc(.9 * var(--shadow-k))), transparent 95%);
}

body[data-inner-hero] .mx-platform::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .9;
  background: radial-gradient(
    420px circle at var(--mx-spot-x) var(--mx-spot-y),
    rgba(199, 59, 63, .13),
    transparent 62%
  );
}

body[data-inner-hero] .mx-stage {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 90px minmax(0, 1fr) 150px;
  gap: clamp(20px, 2.7vw, 40px);
  min-height: 584px;
}

body[data-inner-hero] .mx-layer-rail {
  position: relative;
  display: grid;
  grid-template-rows: repeat(5, 70px);
  align-content: space-between;
  padding: 20px 0 5px;
}

body[data-inner-hero] .mx-layer-rail::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 100%;
  width: clamp(20px, 2.7vw, 40px);
  opacity: .62;
  pointer-events: none;
  background:
    repeating-linear-gradient(90deg, rgba(214, 73, 77, .78) 0 3px, transparent 3px 7px) 0 9.4% / 100% 1px no-repeat,
    repeating-linear-gradient(90deg, rgba(214, 73, 77, .78) 0 3px, transparent 3px 7px) 0 29.6% / 100% 1px no-repeat,
    repeating-linear-gradient(90deg, rgba(214, 73, 77, .78) 0 3px, transparent 3px 7px) 0 48.5% / 100% 1px no-repeat,
    repeating-linear-gradient(90deg, rgba(214, 73, 77, .78) 0 3px, transparent 3px 7px) 0 71.4% / 100% 1px no-repeat,
    repeating-linear-gradient(90deg, rgba(214, 73, 77, .78) 0 3px, transparent 3px 7px) 0 93.2% / 100% 1px no-repeat;
}

body[data-inner-hero] .mx-layer-rail > div,
body[data-inner-hero] .mx-node-grid article,
body[data-inner-hero] .mx-foundation-node,
body[data-inner-hero] .mx-virtual {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(199, 59, 63, .32);
  background:
    linear-gradient(160deg, rgba(83, 30, 34, .62), rgba(14, 11, 12, .56)),
    rgba(var(--ground-4-rgb),.58);
  -webkit-backdrop-filter: blur(16px) saturate(1.3);
  backdrop-filter: blur(16px) saturate(1.3);
  box-shadow:
    inset 0 1px 0 rgba(var(--ink-rgb),.09),
    0 10px 30px rgba(var(--shadow-rgb),calc(.42 * var(--shadow-k)));
  transition:
    transform .4s cubic-bezier(.2, .7, .3, 1),
    box-shadow .4s ease,
    filter .4s ease,
    border-color .35s ease;
}

body[data-inner-hero] .mx-layer-rail > div::after,
body[data-inner-hero] .mx-node-grid article::after,
body[data-inner-hero] .mx-foundation-node::after,
body[data-inner-hero] .mx-virtual::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  width: 45%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(var(--ink-rgb),.11), transparent);
  transform: translateX(-165%) skewX(-18deg);
}

body[data-inner-hero] .mx-platform.is-live .mx-layer-rail > div::after,
body[data-inner-hero] .mx-platform.is-live .mx-node-grid article::after,
body[data-inner-hero] .mx-platform.is-live .mx-foundation-node::after,
body[data-inner-hero] .mx-platform.is-live .mx-virtual::after {
  animation: mx-sheen 6s ease-in-out infinite;
  animation-delay: var(--mx-sheen-delay, 0s);
}

body[data-inner-hero] .mx-layer-rail > div:hover,
body[data-inner-hero] .mx-node-grid article:hover,
body[data-inner-hero] .mx-foundation-node:hover,
body[data-inner-hero] .mx-virtual:hover {
  z-index: 30;
  filter: brightness(1.14);
  border-color: rgba(225, 87, 91, .72);
  transform: translateY(-5px) scale(1.02);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .14),
    0 16px 38px rgba(var(--shadow-rgb),calc(.56 * var(--shadow-k))),
    0 0 30px rgba(199, 59, 63, .27);
}

body[data-inner-hero] .mx-layer-rail > div {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  text-align: center;
}

body[data-inner-hero] .mx-rail-symbol {
  display: grid;
  width: 24px;
  height: 24px;
  margin-bottom: 5px;
  place-items: center;
  border: 1px solid rgba(220, 86, 89, .58);
  border-radius: 50%;
  color:var(--accent-red);
  background: rgba(148, 21, 26, .15);
  font: 700 8px/1 var(--mono);
  box-shadow: 0 0 14px rgba(199, 59, 63, .15);
}

body[data-inner-hero] .mx-layer-rail b,
body[data-inner-hero] .mx-layer-rail small {
  display: block;
}

body[data-inner-hero] .mx-layer-rail b {
  color: rgba(var(--ink-rgb),.9);
  font-size: 12.5px;
  font-weight: 590;
  line-height: 1.15;
}

body[data-inner-hero] .mx-layer-rail small {
  margin-top: 2px;
  color: var(--inner-faint);
  font: 500 8px/1 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

body[data-inner-hero] .mx-core {
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 584px;
  flex-direction: column;
  justify-content: space-between;
}

body[data-inner-hero] .mx-layer {
  position: relative;
  z-index: 2;
  padding: 0;
}

body[data-inner-hero] .mx-layer-application {
  height: 110px;
}

body[data-inner-hero] .mx-layer-function,
body[data-inner-hero] .mx-layer-data {
  height: 94px;
}

body[data-inner-hero] .mx-layer-foundation {
  height: 80px;
}

body[data-inner-hero] .mx-node-grid {
  position: relative;
  display: grid;
  height: 100%;
  gap: clamp(10px, 1.45vw, 20px);
}

body[data-inner-hero] .mx-node-grid-four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

body[data-inner-hero] .mx-node-grid-five {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

body[data-inner-hero] .mx-node-grid::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -42px;
  left: 0;
  z-index: -1;
  height: 43px;
  opacity: .56;
  pointer-events: none;
}

body[data-inner-hero] .mx-node-grid-four::after {
  background:
    repeating-linear-gradient(to bottom, rgba(199, 59, 63, .76) 0 3px, transparent 3px 7px) 12.5% 0 / 1px 100% no-repeat,
    repeating-linear-gradient(to bottom, rgba(199, 59, 63, .76) 0 3px, transparent 3px 7px) 37.5% 0 / 1px 100% no-repeat,
    repeating-linear-gradient(to bottom, rgba(199, 59, 63, .76) 0 3px, transparent 3px 7px) 62.5% 0 / 1px 100% no-repeat,
    repeating-linear-gradient(to bottom, rgba(199, 59, 63, .76) 0 3px, transparent 3px 7px) 87.5% 0 / 1px 100% no-repeat;
}

body[data-inner-hero] .mx-node-grid-five::after {
  background:
    repeating-linear-gradient(to bottom, rgba(199, 59, 63, .7) 0 3px, transparent 3px 7px) 10% 0 / 1px 100% no-repeat,
    repeating-linear-gradient(to bottom, rgba(199, 59, 63, .7) 0 3px, transparent 3px 7px) 30% 0 / 1px 100% no-repeat,
    repeating-linear-gradient(to bottom, rgba(199, 59, 63, .7) 0 3px, transparent 3px 7px) 50% 0 / 1px 100% no-repeat,
    repeating-linear-gradient(to bottom, rgba(199, 59, 63, .7) 0 3px, transparent 3px 7px) 70% 0 / 1px 100% no-repeat,
    repeating-linear-gradient(to bottom, rgba(199, 59, 63, .7) 0 3px, transparent 3px 7px) 90% 0 / 1px 100% no-repeat;
}

body[data-inner-hero] .mx-node-grid article {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 13px 9px;
  border-radius: 12px;
  text-align: center;
}

body[data-inner-hero] .mx-node-grid article::before {
  content: "";
  position: absolute;
  top: 0;
  right: 20%;
  left: 20%;
  height: 1.5px;
  opacity: .8;
  background: linear-gradient(90deg, transparent, #df6568, transparent);
}

body[data-inner-hero] .mx-layer-function .mx-node-grid article {
  background:
    linear-gradient(160deg, rgba(72, 26, 29, .6), rgba(11, 9, 10, .58)),
    rgba(var(--ground-4-rgb),.62);
}

body[data-inner-hero] .mx-layer-data .mx-node-grid article {
  background:
    linear-gradient(160deg, rgba(54, 22, 24, .64), rgba(var(--ground-rgb),.6)),
    rgba(var(--ground-3-rgb),.64);
}

body[data-inner-hero] .mx-node-grid b,
body[data-inner-hero] .mx-node-grid small {
  display: block;
}

body[data-inner-hero] .mx-node-symbol {
  display: grid;
  min-width: 30px;
  height: 26px;
  margin-bottom: 8px;
  padding-inline: 5px;
  place-items: center;
  border: 1px solid rgba(219, 92, 95, .42);
  border-radius: 8px;
  color:var(--accent-red);
  background: rgba(148, 21, 26, .13);
  font: 700 8px/1 var(--mono);
  letter-spacing: .03em;
  box-shadow: 0 0 14px rgba(199, 59, 63, .12);
}

body[data-inner-hero] .mx-node-grid b {
  color: var(--inner-text);
  font-size: max(12.5px, clamp(.68rem, .92vw, .82rem));
  font-weight: 620;
  line-height: 1.2;
}

body[data-inner-hero] .mx-node-grid small {
  margin-top: 5px;
  color: var(--inner-faint);
  font-size: max(12.5px, .6rem);
  line-height: 1.2;
}

body[data-inner-hero] .mx-orchestration {
  position: relative;
  z-index: 3;
  display: flex;
  width: 100%;
  height: 46px;
  align-items: center;
  justify-content: center;
  gap: clamp(18px, 3vw, 40px);
  overflow: hidden;
  border-top: 1px solid rgba(199, 59, 63, .36);
  border-bottom: 1px solid rgba(199, 59, 63, .36);
  border-radius: 8px;
  color: rgba(var(--ink-rgb),.84);
  background:
    linear-gradient(90deg, transparent, rgba(148, 21, 26, .11), transparent),
    rgba(var(--ground-rgb),.88);
  box-shadow: inset 0 0 30px rgba(54, 12, 15, .48);
}

body[data-inner-hero] .mx-orchestration span {
  color: rgba(216, 73, 77, .58);
  font: 700 11px/1 var(--mono);
  letter-spacing: .24em;
}

body[data-inner-hero] .mx-orchestration b {
  font: 580 11px/1 var(--mono);
  letter-spacing: .11em;
  text-transform: uppercase;
}

body[data-inner-hero] .mx-foundation-node {
  display: flex;
  height: 100%;
  align-items: center;
  justify-content: center;
  gap: 16px;
  border-color: rgba(216, 73, 77, .44);
  border-radius: 14px;
  background:
    linear-gradient(90deg, rgba(72, 16, 20, .72), rgba(25, 12, 14, .8), rgba(72, 16, 20, .72)),
    rgba(var(--ground-rgb),.76);
  box-shadow:
    inset 0 1px 0 rgba(var(--ink-rgb),.1),
    0 0 25px rgba(148, 21, 26, .14);
}

body[data-inner-hero] .mx-foundation-mark {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  color: #fff;
  border: 1px solid rgba(225, 104, 108, .78);
  border-radius: 14px;
  background: rgba(100, 17, 22, .7);
  font: 750 18px/1 var(--mono);
  text-shadow: 0 0 9px rgba(255, 255, 255, .5);
}

body[data-inner-hero] .mx-foundation-node b {
  color: var(--inner-text);
  font-size: clamp(.84rem, 1.2vw, 1rem);
  font-weight: 650;
  letter-spacing: .015em;
}

body[data-inner-hero] .mx-virtual {
  display: flex;
  min-height: 584px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-color: rgba(199, 59, 63, .38);
  border-radius: 20px;
  background:
    radial-gradient(circle at 50% 8%, rgba(199, 59, 63, .26), transparent 30%),
    linear-gradient(180deg, rgba(74, 23, 27, .62), rgba(10, 8, 9, .68) 48%, rgba(var(--ground-2-rgb),.8)),
    rgba(var(--ground-rgb),.72);
  box-shadow:
    inset 0 1px 0 rgba(var(--ink-rgb),.09),
    0 0 35px rgba(148, 21, 26, .18);
}

body[data-inner-hero] .mx-virtual-halo {
  position: relative;
  display: grid;
  width: 76px;
  height: 76px;
  margin-bottom: 26px;
  place-items: center;
  border: 1.5px solid rgba(225, 104, 108, .64);
  border-radius: 50%;
  background: rgba(12, 8, 9, .5);
  box-shadow:
    0 0 22px rgba(199, 59, 63, .4),
    inset 0 0 16px rgba(199, 59, 63, .28);
}

body[data-inner-hero] .mx-virtual-halo i {
  position: absolute;
  inset: -6px;
  border: 1px solid rgba(199, 59, 63, .4);
  border-radius: 50%;
}

body[data-inner-hero] .mx-virtual-halo i:nth-child(2) {
  inset: -11px;
  opacity: .55;
  animation-delay: 1.05s;
}

body[data-inner-hero] .mx-virtual-halo i:nth-child(3) {
  inset: -16px;
  opacity: .3;
  animation-delay: 2.1s;
}

body[data-inner-hero] .mx-virtual-halo > span {
  color: #f4d9d8;
  font: 750 15px/1 var(--mono);
  letter-spacing: -.04em;
  text-shadow: 0 0 12px rgba(225, 104, 108, .8);
}

body[data-inner-hero] .mx-virtual p,
body[data-inner-hero] .mx-virtual b,
body[data-inner-hero] .mx-virtual small {
  display: block;
  margin: 0;
  text-align: center;
}

body[data-inner-hero] .mx-virtual b {
  color: var(--inner-text);
  font-size: 1rem;
  font-weight: 680;
}

body[data-inner-hero] .mx-virtual small {
  margin-top: 6px;
  color: var(--inner-faint);
  font: 520 9px/1.2 var(--mono);
  letter-spacing: .09em;
  text-transform: uppercase;
}

body[data-inner-hero] .mx-virtual-route {
  display: flex;
  gap: 7px;
  margin-top: 56px;
}

body[data-inner-hero] .mx-virtual-route span {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: rgba(225, 104, 108, .72);
  box-shadow: 0 0 9px rgba(199, 59, 63, .8);
}

/* This is the panel's title bar now, not a footnote. It sits above the diagram
   with a rule under it, which is what gives the panel a head and stops it from
   reading as a frame drawn around the content. The homepage does the same and
   is the reason its version of this figure holds together. */
body[data-inner-hero] .mx-stage-note {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: clamp(24px, 3vw, 38px);
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(var(--ink-rgb),.1);
}

body[data-inner-hero] .mx-stage-note span {
  color: var(--inner-text);
  font-size: clamp(1.2rem, 2vw, 1.9rem);
  font-weight: 650;
  letter-spacing: -.035em;
}

body[data-inner-hero] .mx-stage-note b {
  font-weight: 650;
}

body[data-inner-hero] .mx-stage-note small {
  color: var(--inner-faint);
  font: 550 8px/1 var(--mono);
  letter-spacing: .11em;
  text-transform: uppercase;
}

body[data-inner-hero] .mx-platform.mx-motion-ready .mx-layer-rail > div,
body[data-inner-hero] .mx-platform.mx-motion-ready .mx-node-grid article,
body[data-inner-hero] .mx-platform.mx-motion-ready .mx-orchestration,
body[data-inner-hero] .mx-platform.mx-motion-ready .mx-foundation-node,
body[data-inner-hero] .mx-platform.mx-motion-ready .mx-virtual {
  opacity: 0;
  transform: translateY(18px) scale(.985);
}

body[data-inner-hero] .mx-platform.mx-motion-ready.is-live .mx-layer-rail > div,
body[data-inner-hero] .mx-platform.mx-motion-ready.is-live .mx-node-grid article,
body[data-inner-hero] .mx-platform.mx-motion-ready.is-live .mx-orchestration,
body[data-inner-hero] .mx-platform.mx-motion-ready.is-live .mx-foundation-node,
body[data-inner-hero] .mx-platform.mx-motion-ready.is-live .mx-virtual {
  opacity: 1;
  transform: none;
  transition:
    opacity .58s cubic-bezier(.2, .7, .3, 1) var(--mx-enter-delay, 0ms),
    transform .58s cubic-bezier(.2, .7, .3, 1) var(--mx-enter-delay, 0ms),
    box-shadow .4s ease,
    filter .4s ease,
    border-color .35s ease;
}

body[data-inner-hero] .framework-track {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--inner-line);
}

body[data-inner-hero] .framework-track article {
  min-height: 158px;
  padding: 26px 24px;
  border-left: 1px solid var(--inner-line);
}

body[data-inner-hero] .framework-track article:first-child {
  border-left: 0;
}

body[data-inner-hero] .framework-track b,
body[data-inner-hero] .framework-track span {
  display: block;
}

body[data-inner-hero] .framework-track b {
  margin-bottom: 42px;
  color: var(--inner-red-hot);
  font: 600 10px/1.2 var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
}

body[data-inner-hero] .framework-track span {
  max-width: 18ch;
  color: var(--inner-text);
  font-size: 1rem;
  line-height: 1.4;
}

body[data-inner-hero] .public-capabilities,
body[data-inner-hero] .research-evidence,
body[data-inner-hero] .public-results {
  margin-top: clamp(90px, 11vw, 168px);
  padding-top: clamp(72px, 8vw, 118px);
  border-top: 1px solid var(--inner-line);
}

body[data-inner-hero] .public-section-title {
  margin-bottom: clamp(38px, 5vw, 70px);
}

body[data-inner-hero] .public-section-title > p {
  max-width: 58ch;
  margin: 24px 0 0;
  color: var(--inner-muted);
  font-size: .9rem;
  line-height: 1.65;
}

body[data-inner-hero] .public-capability-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--inner-line-strong);
  border-bottom: 1px solid var(--inner-line-strong);
}

body[data-inner-hero] .public-capability-list article {
  min-height: 230px;
  padding: 28px 24px;
  border-left: 1px solid var(--inner-line);
}

body[data-inner-hero] .public-capability-list article:first-child {
  border-left: 0;
}

body[data-inner-hero] .public-capability-list h3 {
  max-width: 12ch;
  margin: 0 0 78px;
  color: var(--inner-text);
  font-size: clamp(1.2rem, 1.7vw, 1.7rem);
  font-weight: 560;
  letter-spacing: -.035em;
}

body[data-inner-hero] .public-capability-list p {
  max-width: 24ch;
  margin: 0;
  color: var(--inner-muted);
  font-size: .82rem;
  line-height: 1.55;
}

body[data-inner-hero] .evidence-native-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
  gap: 18px;
}

body[data-inner-hero] .evidence-benchmark,
body[data-inner-hero] .evidence-loop-grid {
  margin-top: 18px;
}

body[data-inner-hero] .evidence-loop-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, .92fr);
  gap: 18px;
}

body[data-inner-hero] .evidence-native {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--inner-line);
  border-top-color: rgba(176, 38, 45, .5);
  background:
    linear-gradient(145deg, rgba(var(--ink-rgb),.025), transparent 42%),
    var(--inner-raised);
}

body[data-inner-hero] .evidence-native-head {
  display: flex;
  justify-content: space-between;
  gap: 28px;
  align-items: start;
  min-height: 104px;
  padding: 22px 24px;
  border-bottom: 1px solid var(--inner-line);
}

body[data-inner-hero] .evidence-native-head span,
body[data-inner-hero] .evidence-native-head h3,
body[data-inner-hero] .evidence-native-head p {
  display: block;
  margin: 0;
}

body[data-inner-hero] .evidence-native-head span {
  margin-bottom: 9px;
  color: var(--inner-red-hot);
  font: 600 9px/1.2 var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
}

body[data-inner-hero] .evidence-native-head h3 {
  color: var(--inner-text);
  font-size: clamp(1.15rem, 1.8vw, 1.65rem);
  font-weight: 570;
  letter-spacing: -.035em;
  line-height: 1.12;
}

body[data-inner-hero] .evidence-native-head p {
  max-width: 24ch;
  color: var(--inner-muted);
  font-size: max(12.5px, .72rem);
  line-height: 1.5;
}

body[data-inner-hero] .trace-flow {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  min-height: 310px;
  align-items: center;
  padding: 28px 24px 16px;
}

body[data-inner-hero] .trace-step {
  position: relative;
  min-height: 184px;
  padding: 22px 16px;
  border: 1px solid var(--inner-line);
  background: rgba(var(--ink-rgb),.025);
}

body[data-inner-hero] .trace-step::after {
  content: "›";
  position: absolute;
  top: 50%;
  right: -11px;
  z-index: 2;
  width: 20px;
  height: 20px;
  color: var(--inner-red-hot);
  background: var(--inner-raised);
  font: 600 17px/18px var(--mono);
  text-align: center;
  transform: translateY(-50%);
}

body[data-inner-hero] .trace-step:last-child::after {
  display: none;
}

body[data-inner-hero] .trace-step-key {
  border-color: rgba(199, 59, 63, .52);
  background: rgba(148, 21, 26, .11);
}

body[data-inner-hero] .trace-step small,
body[data-inner-hero] .trace-step b,
body[data-inner-hero] .trace-step span {
  display: block;
}

body[data-inner-hero] .trace-step small {
  color: var(--inner-red-hot);
  font: 600 8px/1 var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
}

body[data-inner-hero] .trace-step b {
  margin-top: 38px;
  color: var(--inner-text);
  font-size: .9rem;
  font-weight: 590;
  line-height: 1.25;
}

body[data-inner-hero] .trace-step span {
  margin-top: 10px;
  color: var(--inner-muted);
  font-size: max(12.5px, .68rem);
  line-height: 1.45;
}

body[data-inner-hero] .trace-rail {
  display: grid;
  grid-template-columns: auto 1fr auto 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 0 24px 22px;
  color: var(--inner-faint);
  font: 600 8px/1 var(--mono);
  letter-spacing: .1em;
}

body[data-inner-hero] .trace-rail i {
  height: 1px;
  background: linear-gradient(90deg, var(--inner-red), rgba(var(--ink-rgb),.18));
}

body[data-inner-hero] .atlas-stage {
  min-height: 310px;
  padding: 18px 18px 8px;
}

body[data-inner-hero] #mx-atlas-canvas {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 920 / 440;
}

body[data-inner-hero] .atlas-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--inner-line);
}

body[data-inner-hero] .atlas-stats div {
  min-width: 0;
  padding: 18px 16px 20px;
  border-left: 1px solid var(--inner-line);
}

body[data-inner-hero] .atlas-stats div:first-child {
  border-left: 0;
}

body[data-inner-hero] .atlas-stats b,
body[data-inner-hero] .atlas-stats span {
  display: block;
}

body[data-inner-hero] .atlas-stats b {
  color: var(--inner-text);
  font: 600 clamp(.9rem, 1.4vw, 1.2rem)/1 var(--mono);
}

body[data-inner-hero] .atlas-stats span {
  margin-top: 7px;
  color: var(--inner-faint);
  font-size: max(12.5px, .62rem);
  line-height: 1.2;
}

body[data-inner-hero] .benchmark-head {
  align-items: center;
}

body[data-inner-hero] .benchmark-controls {
  display: flex;
  flex: 0 0 auto;
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--inner-line);
}

body[data-inner-hero] .benchmark-controls button {
  min-width: 66px;
  padding: 9px 11px;
  color: var(--inner-muted);
  border: 0;
  background: transparent;
  font: 600 9px/1 var(--mono);
  cursor: pointer;
}

body[data-inner-hero] .benchmark-controls button:hover,
body[data-inner-hero] .benchmark-controls button.is-active {
  color: var(--inner-text);
  background: var(--inner-red);
}

body[data-inner-hero] .benchmark-body {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  min-height: 520px;
}

body[data-inner-hero] .benchmark-summary {
  padding: 24px 20px;
  border-right: 1px solid var(--inner-line);
}

body[data-inner-hero] .benchmark-summary div {
  padding: 18px 0;
  border-bottom: 1px solid var(--inner-line);
}

body[data-inner-hero] .benchmark-summary b,
body[data-inner-hero] .benchmark-summary span {
  display: block;
}

body[data-inner-hero] .benchmark-summary b {
  color: var(--inner-text);
  font: 590 clamp(1.6rem, 2.7vw, 2.7rem)/1 var(--mono);
  letter-spacing: -.04em;
}

body[data-inner-hero] .benchmark-summary span {
  margin-top: 8px;
  color: var(--inner-faint);
  font-size: max(12.5px, .65rem);
  line-height: 1.3;
}

body[data-inner-hero] .benchmark-summary p {
  margin: 24px 0 0;
  color: var(--inner-muted);
  font-size: max(12.5px, .68rem);
  line-height: 1.55;
}

body[data-inner-hero] .benchmark-scroll {
  min-width: 0;
  overflow: auto;
  padding: 24px;
  scrollbar-color: var(--inner-red) var(--inner-soft);
  scrollbar-width: thin;
}

body[data-inner-hero] #mx-benchmark-grid {
  display: grid;
  min-width: 860px;
  gap: 3px;
  align-items: center;
}

body[data-inner-hero] .mx-bench-head,
body[data-inner-hero] .mx-bench-name,
body[data-inner-hero] .mx-bench-score {
  min-width: 0;
  font-family: var(--mono);
}

body[data-inner-hero] .mx-bench-head {
  padding-bottom: 8px;
  color: var(--inner-faint);
  font-size: 12.5px;
  text-align: center;
}

body[data-inner-hero] .mx-bench-name {
  overflow: hidden;
  padding-right: 12px;
  color: var(--inner-muted);
  font-size: 12.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body[data-inner-hero] .mx-bench-cell {
  aspect-ratio: 1.15;
  min-height: 14px;
  border: 1px solid rgba(var(--ink-rgb),.035);
}

body[data-inner-hero] .mx-bench-cell:hover {
  outline: 1px solid rgba(var(--ink-rgb),.72);
  outline-offset: 1px;
}

body[data-inner-hero] .benchmark-legend {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  padding: 12px 24px 18px;
  color: var(--inner-faint);
  border-top: 1px solid var(--inner-line);
  font: 500 8px/1 var(--mono);
  text-transform: uppercase;
}

body[data-inner-hero] .benchmark-legend i {
  width: 160px;
  height: 6px;
  background: linear-gradient(90deg, #1a1717, #5c2426, #c73b3f, #f0c5c3);
}

body[data-inner-hero] .loop-route {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  padding: 28px 24px 20px;
}

body[data-inner-hero] .loop-route > div {
  position: relative;
  min-height: 174px;
  padding: 22px 18px;
  border: 1px solid var(--inner-line);
}

body[data-inner-hero] .loop-route > div::after {
  content: "";
  position: absolute;
  top: 28px;
  right: -13px;
  z-index: 2;
  width: 14px;
  height: 1px;
  background: var(--inner-red-hot);
}

body[data-inner-hero] .loop-route > div:last-child::after {
  right: 50%;
  top: auto;
  bottom: -18px;
  width: 64%;
  transform: translateX(50%);
}

body[data-inner-hero] .loop-route small,
body[data-inner-hero] .loop-route b,
body[data-inner-hero] .loop-route span {
  display: block;
}

body[data-inner-hero] .loop-route small {
  color: var(--inner-red-hot);
  font: 600 8px/1 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}

body[data-inner-hero] .loop-route b {
  margin-top: 42px;
  color: var(--inner-text);
  font-size: .98rem;
  font-weight: 590;
}

body[data-inner-hero] .loop-route span {
  margin-top: 8px;
  color: var(--inner-muted);
  font-size: max(12.5px, .66rem);
  line-height: 1.4;
}

body[data-inner-hero] .loop-outcome {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--inner-line);
}

body[data-inner-hero] .loop-outcome span {
  padding: 18px 20px;
  color: var(--inner-faint);
  border-left: 1px solid var(--inner-line);
  font-size: max(12.5px, .68rem);
}

body[data-inner-hero] .loop-outcome span:first-child {
  border-left: 0;
}

body[data-inner-hero] .loop-outcome b {
  margin-right: 6px;
  color: var(--inner-text);
  font: 600 1rem/1 var(--mono);
}

body[data-inner-hero] .gate-cases {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  padding: 28px 24px 16px;
}

body[data-inner-hero] .gate-case {
  padding: 20px 18px;
  border: 1px solid var(--inner-line);
}

body[data-inner-hero] .gate-pass {
  border-color: rgba(199, 59, 63, .5);
  background: rgba(148, 21, 26, .09);
}

body[data-inner-hero] .gate-case small,
body[data-inner-hero] .gate-case span {
  display: block;
}

body[data-inner-hero] .gate-case small {
  margin-bottom: 26px;
  color: var(--inner-red-hot);
  font: 600 8px/1 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}

body[data-inner-hero] .gate-drop small {
  color: var(--inner-faint);
}

body[data-inner-hero] .gate-case span {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 8px;
  color: var(--inner-muted);
  font-size: max(12.5px, .66rem);
}

body[data-inner-hero] .gate-case b {
  color: var(--inner-text);
  font-family: var(--mono);
}

body[data-inner-hero] .gate-rule {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin: 0 24px;
  padding: 16px 0;
  border-top: 1px solid var(--inner-line);
  border-bottom: 1px solid var(--inner-line);
}

body[data-inner-hero] .gate-rule b {
  color: var(--inner-red-hot);
  font: 600 1rem/1 var(--mono);
}

body[data-inner-hero] .gate-rule span {
  color: var(--inner-muted);
  font-size: max(12.5px, .68rem);
  text-align: right;
}

body[data-inner-hero] .gate-result {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 18px;
  align-items: end;
  padding: 22px 24px 26px;
}

body[data-inner-hero] .gate-result b {
  color: var(--inner-text);
  font: 580 clamp(2.4rem, 4vw, 4.4rem)/.8 var(--mono);
  letter-spacing: -.06em;
}

body[data-inner-hero] .gate-result span {
  max-width: 24ch;
  color: var(--inner-muted);
  font-size: max(12.5px, .72rem);
  line-height: 1.4;
}

body[data-inner-hero] .public-result-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(340px, .88fr);
  gap: 18px;
}

body[data-inner-hero] .public-result {
  display: grid;
  grid-template-rows: minmax(330px, 1fr) auto;
  color: var(--inner-text);
  border: 1px solid var(--inner-line);
  background: var(--inner-raised);
  transition: transform .4s var(--ease-out), border-color .4s var(--ease-out);
}

body[data-inner-hero] .public-result:hover {
  color: var(--inner-text);
  border-color: var(--inner-line-strong);
  transform: translateY(-3px);
}

body[data-inner-hero] .public-result-media {
  display: block;
  min-height: 330px;
  overflow: hidden;
}

body[data-inner-hero] .public-result-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.72) contrast(1.06);
  transition: transform .8s var(--ease-out), filter .6s var(--ease-out);
}

body[data-inner-hero] .public-result:hover img {
  transform: scale(1.02);
  filter: saturate(.9) contrast(1.03);
}

body[data-inner-hero] .public-result-copy {
  display: block;
  padding: clamp(24px, 3vw, 38px);
}

body[data-inner-hero] .public-result-copy small {
  display: block;
  margin-bottom: 16px;
  color: var(--inner-red-hot);
  font: 600 10px/1.2 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}

body[data-inner-hero] .public-result-copy h3 {
  margin: 0;
  color: var(--inner-text);
  font-size: clamp(1.4rem, 2.35vw, 2.65rem);
  font-weight: 540;
  letter-spacing: -.045em;
  line-height: 1.05;
}

body[data-inner-hero] .public-result-copy p {
  display: -webkit-box;
  max-width: 58ch;
  margin: 20px 0 0;
  overflow: hidden;
  color: var(--inner-muted);
  font-size: .82rem;
  line-height: 1.6;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

body[data-inner-hero] .public-result-copy em,
body[data-inner-hero] .public-results-link {
  display: block;
  margin-top: 25px;
  color: var(--inner-red-hot);
  font: 600 10px/1.2 var(--mono);
  letter-spacing: .07em;
  font-style: normal;
  text-transform: uppercase;
}

body[data-inner-hero] .public-results-link {
  width: fit-content;
  margin-top: 30px;
}

body[data-inner-hero] .public-profile-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 18px;
}

body[data-inner-hero] .public-profile-media img {
  filter: saturate(.68) contrast(1.08);
}

body[data-inner-hero] .public-family,
body[data-inner-hero] .public-result-pending,
body[data-inner-hero] .public-disclosure {
  padding: clamp(26px, 3.5vw, 46px);
  border: 1px solid var(--inner-line);
  background: var(--inner-raised);
}

body[data-inner-hero] .public-family > span,
body[data-inner-hero] .public-family > b {
  display: block;
}

body[data-inner-hero] .public-family > span {
  color: var(--inner-text);
  font-size: clamp(1.55rem, 3vw, 3rem);
  font-weight: 540;
  letter-spacing: -.05em;
}

body[data-inner-hero] .public-family > b {
  margin-top: 8px;
  color: var(--inner-red-hot);
  font-weight: 500;
}

body[data-inner-hero] .public-family p,
body[data-inner-hero] .public-result-pending p,
body[data-inner-hero] .public-disclosure p {
  max-width: 58ch;
  margin: 20px 0 0;
  color: var(--inner-muted);
  line-height: 1.6;
}

body[data-inner-hero] .public-result-pending h3,
body[data-inner-hero] .public-disclosure h3 {
  max-width: 20ch;
  margin: 0;
  color: var(--inner-text);
  font-size: clamp(1.45rem, 2.6vw, 2.8rem);
  font-weight: 530;
  letter-spacing: -.045em;
  line-height: 1.06;
}

body[data-inner-hero] .public-disclosure {
  margin-top: clamp(34px, 5vw, 72px);
  border-left: 2px solid var(--inner-red);
}

body[data-inner-hero] .public-profile-action {
  margin-top: 24px;
}
/* Publications and news remain scannable on dark. */
body[data-inner-hero] .featpub,
body[data-inner-hero] .publist,
body[data-inner-hero] .pub,
body[data-inner-hero] .newslist,
body[data-inner-hero] .nrow {
  border-color: var(--inner-line);
}

body[data-inner-hero] .fp {
  color: var(--inner-text);
  background: var(--inner-raised);
}

body[data-inner-hero] .fp:hover {
  background: rgb(var(--ground-4-rgb));
}

body[data-inner-hero] .fp p,
body[data-inner-hero] .fp .authors,
body[data-inner-hero] .nrow p,
body[data-inner-hero] .pub .a,
body[data-inner-hero] .pub .j,
body[data-inner-hero] .pub .c {
  color: var(--inner-muted);
}

body[data-inner-hero] .pub:hover,
body[data-inner-hero] .nrow:hover {
  background: var(--inner-raised);
}

body[data-inner-hero] .pub .a u {
  color: var(--inner-text);
}

body[data-inner-hero] .pub .rel a {
  color: var(--inner-muted);
  background: rgba(var(--ink-rgb),.06);
}

body[data-inner-hero] .pub .rel a:hover {
  color: var(--inner-text);
  background: var(--inner-red);
}

body[data-inner-hero] .newsgrid {
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
}

body[data-inner-hero] .newsgrid .ncard:first-child {
  grid-row: span 2;
  min-height: 100%;
}

/* People use the verified portrait; unverified member images are never invented. */
body[data-inner-hero] .portrait {
  border-radius: 2px;
  border: 1px solid var(--inner-line);
  background: var(--inner-raised);
}

/* The verified PI portrait is 3:4. Keep that ratio so the image fills its
   frame without cropping or side bands, then stretch the copy to the same
   top and bottom edges. */
body[data-page="people"]:not(.profile-page) .pi-grid {
  grid-template-columns: clamp(140px, 10vw, 200px) minmax(0, 1fr);
  align-items: stretch;
}

body[data-page="people"]:not(.profile-page) .pi-grid > .portrait {
  width: 100%;
  aspect-ratio: 3 / 4;
  min-height: 0;
  margin-top: 0;
}

body[data-page="people"]:not(.profile-page) .pi-grid > .portrait > img {
  object-fit: cover;
  object-position: center;
}

body[data-page="people"]:not(.profile-page) .pi-grid > :last-child {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

body[data-page="people"]:not(.profile-page) .pi-grid > :last-child > p:last-child {
  margin-top: auto !important;
}

@media (max-width: 900px) {
  body[data-page="people"]:not(.profile-page) .pi-grid {
    grid-template-columns: 1fr;
  }

  body[data-page="people"]:not(.profile-page) .pi-grid > .portrait {
    aspect-ratio: 3 / 4;
    margin-top: 0;
  }

  body[data-page="people"]:not(.profile-page) .pi-grid > :last-child {
    display: block;
  }

  body[data-page="people"]:not(.profile-page) .pi-grid > :last-child > p:last-child {
    margin-top: 20px !important;
  }
}

body[data-inner-hero] .portrait > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 24%;
}

body[data-inner-hero] .portrait-quiet {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(135deg, transparent 48%, rgba(199, 59, 63, .22) 49%, transparent 50%),
    radial-gradient(circle at 72% 28%, rgba(148, 21, 26, .28), transparent 28%),
    rgb(var(--ground-4-rgb));
}

body[data-inner-hero] .portrait .cap {
  font-family: var(--mono);
  background: linear-gradient(0deg, rgba(var(--ground-rgb),.86), transparent);
}

body[data-inner-hero] .mcard {
  min-height: 154px;
  justify-content: flex-start;
  border: 1px solid var(--inner-line);
}

body[data-inner-hero] .member-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  border: 0;
  background: transparent;
}

@media (max-width: 1180px) {
  body[data-inner-hero] .member-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  body[data-inner-hero] .member-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  body[data-inner-hero] .member-grid {
    grid-template-columns: 1fr;
  }
}

body[data-inner-hero] .mcard .b {
  min-height: 142px;
  flex: 1 1 auto;
  justify-content: flex-start;
  padding: 22px 24px 24px;
}

body[data-inner-hero] .mcard h5 {
  font-size: clamp(.98rem, 1.3vw, 1.15rem);
  letter-spacing: -.025em;
}

body[data-inner-hero] .mcard .r {
  color: var(--inner-red-hot);
}

body[data-inner-hero] .mcard .mphoto {
  display: grid;
  width: clamp(68px, 7vw, 92px);
  height: clamp(68px, 7vw, 92px);
  aspect-ratio: 1;
  place-items: center;
  margin: 24px auto 0;
  border-radius: 50%;
  overflow: hidden;
}

body[data-inner-hero] .mcard .mphoto-placeholder {
  background: var(--inner-raised);
  border: 1px solid var(--inner-line);
}

body[data-inner-hero] .mphoto-placeholder-label {
  display: none;
}

body[data-inner-hero] .mcard .mphoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 28%;
}

body[data-inner-hero] .mcard .mphoto-placeholder img {
  width: 72%;
  height: 72%;
  object-fit: contain;
  object-position: center;
}

body[data-inner-hero] .rows,
body[data-inner-hero] .rows a,
body[data-inner-hero] .rows div,
body[data-inner-hero] .tl::before {
  border-color: var(--inner-line);
}

body[data-inner-hero] .tl li::before {
  background: var(--inner-bg);
  border-color: var(--inner-faint);
}

body[data-inner-hero] .empty {
  color: var(--inner-text);
  border-color: var(--inner-line);
  border-radius: 2px;
  background:
    linear-gradient(90deg, rgba(var(--ground-rgb),.9), rgba(var(--ground-rgb),.7)),
    url("../media/generated/lab-collaboration-daylight-v3.jpg") center / cover no-repeat;
  text-align: left;
}

body[data-inner-hero] .empty p {
  color: var(--inner-muted);
  margin-left: 0;
}

body[data-inner-hero].profile-page > .sec {
  padding-top: calc(var(--nav-h) + clamp(48px, 7vw, 112px)) !important;
  background: var(--inner-bg) !important;
}

body[data-inner-hero] .methods-handoff {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(28px, 5vw, 72px);
  margin-top: clamp(72px, 10vw, 150px);
  padding-top: clamp(28px, 4vw, 52px);
  border-top: 1px solid var(--inner-line);
}

body[data-inner-hero] .methods-handoff p {
  max-width: 54ch;
  color: var(--inner-muted);
  line-height: 1.7;
}

body[data-inner-hero] .methods-handoff p span {
  display: block;
  margin-bottom: 10px;
  color: var(--inner-red-hot);
  font: 600 10px/1.2 var(--mono);
  letter-spacing: .15em;
  text-transform: uppercase;
}

body[data-inner-hero] .methods-handoff > div {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

@media (max-width: 780px) {
  body[data-inner-hero] .methods-handoff {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* Projects and joining. */
body[data-inner-hero] .proj-lead {
  color: var(--inner-text);
  background: var(--inner-raised);
  border-color: var(--inner-line);
  border-radius: 2px;
}

body[data-inner-hero] .mrows,
body[data-inner-hero] .mrow {
  border-color: var(--inner-line);
}

body[data-inner-hero] .acc {
  border-color: var(--surface-line);
  border-radius: var(--r-sm);
  background: var(--surface-fill);
}

body[data-inner-hero] .accbody-in {
  color: var(--inner-muted);
}

body[data-inner-hero] footer {
  background: var(--inner-bg);
}

@media (max-width: 1000px) {
  body[data-inner-hero] .t1 {
    grid-template-columns: 1fr;
  }

  body[data-inner-hero] .pcard1:first-child {
    grid-row: auto;
  }
}

@media (max-width: 900px) {
  body[data-inner-hero] .phero {
    min-height: min(68dvh, 640px);
  }

  body[data-inner-hero] .phero::after {
    background:
      linear-gradient(90deg, rgba(var(--ground-rgb),.96), rgba(var(--ground-rgb),.55)),
      linear-gradient(0deg, rgba(var(--ground-rgb),.9), transparent 55%);
  }

  body[data-inner-hero] .sec-head,
  body[data-inner-hero] .focus-row {
    grid-template-columns: 1fr;
  }

  body[data-inner-hero] .newsgrid {
    grid-template-columns: 1fr;
  }

  body[data-inner-hero] .newsgrid .ncard:first-child {
    grid-row: auto;
  }

  body[data-inner-hero] .framework-track,
  body[data-inner-hero] .public-capability-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body[data-inner-hero] .framework-track article:nth-child(3),
  body[data-inner-hero] .public-capability-list article:nth-child(3) {
    border-left: 0;
  }

  body[data-inner-hero] .framework-track article:nth-child(n+3),
  body[data-inner-hero] .public-capability-list article:nth-child(n+3) {
    border-top: 1px solid var(--inner-line);
  }

  body[data-inner-hero] .public-result-grid {
    grid-template-columns: 1fr;
  }

  body[data-inner-hero] .evidence-native-grid,
  body[data-inner-hero] .evidence-loop-grid {
    grid-template-columns: 1fr;
  }

  body[data-inner-hero] .mx-layer {
    grid-template-columns: 110px minmax(0, 1fr);
  }

  body[data-inner-hero] .mx-node-grid-five {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  body[data-inner-hero] .mx-orchestration {
    margin-left: 128px;
  }

  body[data-inner-hero] .benchmark-body {
    grid-template-columns: 1fr;
  }

  body[data-inner-hero] .benchmark-summary {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-right: 0;
    border-bottom: 1px solid var(--inner-line);
  }

  body[data-inner-hero] .benchmark-summary div {
    padding: 10px 16px 18px;
    border-bottom: 0;
    border-left: 1px solid var(--inner-line);
  }

  body[data-inner-hero] .benchmark-summary div:first-child {
    border-left: 0;
  }

  body[data-inner-hero] .benchmark-summary p {
    grid-column: 1 / -1;
    margin: 14px 16px 0;
  }

  body[data-inner-hero] .focus-media {
    aspect-ratio: 16 / 9;
  }
}

@media (max-width: 620px) {
  body[data-inner-hero] {
    --gut: 18px;
    --sec-y: 64px;
  }

  body[data-inner-hero] .phero {
    min-height: 570px;
    padding-bottom: 52px;
  }

  body[data-inner-hero] .phero::before {
    background-position: 62% center;
  }

  body[data-inner-hero] .phero .h1 {
    max-width: 10ch;
    font-size: clamp(2.3rem, 10.5vw, 3.6rem);
    line-height: 1.05;
  }

  body[data-inner-hero] .phero .lede {
    font-size: .98rem;
  }

  body[data-inner-hero] .sec-head .h1 {
    font-size: clamp(2.15rem, 11vw, 3.2rem);
  }

  body[data-inner-hero] .pillrow {
    align-items: flex-start;
  }

  body[data-inner-hero] .pillrow .lbl {
    width: 100%;
  }

  body[data-inner-hero] .filterbar {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 8px;
    scrollbar-width: none;
  }

  body[data-inner-hero] .filterbar::-webkit-scrollbar {
    display: none;
  }

  body[data-inner-hero] .filterbar button {
    flex: 0 0 auto;
  }

  body[data-inner-hero] .framework-track,
  body[data-inner-hero] .public-capability-list {
    grid-template-columns: 1fr;
  }

  body[data-inner-hero] .framework-track article,
  body[data-inner-hero] .framework-track article:nth-child(3),
  body[data-inner-hero] .public-capability-list article,
  body[data-inner-hero] .public-capability-list article:nth-child(3) {
    min-height: 156px;
    border-top: 1px solid var(--inner-line);
    border-left: 0;
  }

  body[data-inner-hero] .framework-track article:first-child,
  body[data-inner-hero] .public-capability-list article:first-child {
    border-top: 0;
  }

  body[data-inner-hero] .framework-track b,
  body[data-inner-hero] .public-capability-list h3 {
    margin-bottom: 34px;
  }

  body[data-inner-hero] .mx-platform {
    padding: 16px;
  }

  body[data-inner-hero] .mx-platform-head {
    align-items: flex-start;
    min-height: 74px;
  }

  body[data-inner-hero] .mx-platform-head > div,
  body[data-inner-hero] .mx-virtual {
    gap: 9px;
  }

  body[data-inner-hero] .mx-platform-head small {
    max-width: 14ch;
    line-height: 1.35;
  }

  body[data-inner-hero] .mx-mark {
    width: 36px;
    height: 36px;
  }

  body[data-inner-hero] .mx-orbit {
    width: 36px;
    height: 36px;
  }

  body[data-inner-hero] .mx-orbit::after {
    top: 3px;
    left: 15px;
    transform-origin: 3px 15px;
  }

  body[data-inner-hero] .mx-layer {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 12px 0;
  }

  body[data-inner-hero] .mx-layer-label {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    min-height: 42px;
  }

  body[data-inner-hero] .mx-layer-label small {
    margin-top: 0;
  }

  body[data-inner-hero] .mx-node-grid-four,
  body[data-inner-hero] .mx-node-grid-five {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body[data-inner-hero] .mx-node-grid article {
    min-height: 82px;
    padding: 17px 14px;
  }

  body[data-inner-hero] .mx-orchestration {
    margin-left: 0;
    gap: 10px;
    text-align: center;
  }

  body[data-inner-hero] .mx-foundation-node {
    justify-content: flex-start;
    padding: 0 14px;
  }

  body[data-inner-hero] .public-result {
    grid-template-rows: 260px auto;
  }

  body[data-inner-hero] .public-result-media {
    min-height: 260px;
  }

  body[data-inner-hero] .evidence-native-head {
    flex-direction: column;
    gap: 12px;
    min-height: 0;
    padding: 20px 18px;
  }

  body[data-inner-hero] .evidence-native-head p {
    max-width: 34ch;
  }

  body[data-inner-hero] .benchmark-head {
    align-items: flex-start;
  }

  body[data-inner-hero] .trace-flow {
    grid-template-columns: 1fr;
    gap: 8px;
    min-height: 0;
    padding: 20px 18px 12px;
  }

  body[data-inner-hero] .trace-step {
    min-height: 128px;
  }

  body[data-inner-hero] .trace-step::after {
    content: "⌄";
    top: auto;
    right: 50%;
    bottom: -12px;
    transform: translateX(50%);
  }

  body[data-inner-hero] .trace-step b {
    margin-top: 24px;
  }

  body[data-inner-hero] .trace-rail {
    padding: 6px 18px 20px;
  }

  body[data-inner-hero] .atlas-stage {
    min-height: 0;
    padding: 12px 10px 4px;
  }

  body[data-inner-hero] .atlas-stats {
    grid-template-columns: repeat(2, 1fr);
  }

  body[data-inner-hero] .atlas-stats div:nth-child(3) {
    border-left: 0;
  }

  body[data-inner-hero] .atlas-stats div:nth-child(n+3) {
    border-top: 1px solid var(--inner-line);
  }

  body[data-inner-hero] .benchmark-summary {
    padding: 18px 10px;
  }

  body[data-inner-hero] .benchmark-summary b {
    font-size: 1.35rem;
  }

  body[data-inner-hero] .benchmark-scroll {
    padding: 18px 12px;
  }

  body[data-inner-hero] .benchmark-legend {
    justify-content: flex-start;
    padding-inline: 18px;
  }

  body[data-inner-hero] .benchmark-legend i {
    width: 100px;
  }

  body[data-inner-hero] .loop-route {
    grid-template-columns: 1fr;
    padding: 20px 18px 14px;
  }

  body[data-inner-hero] .loop-route > div {
    min-height: 132px;
  }

  body[data-inner-hero] .loop-route > div::after,
  body[data-inner-hero] .loop-route > div:last-child::after {
    top: auto;
    right: 50%;
    bottom: -7px;
    width: 1px;
    height: 8px;
    transform: none;
  }

  body[data-inner-hero] .loop-route b {
    margin-top: 26px;
  }

  body[data-inner-hero] .gate-cases {
    grid-template-columns: 1fr;
    padding: 20px 18px 14px;
  }

  body[data-inner-hero] .gate-rule {
    flex-direction: column;
    gap: 8px;
    margin-inline: 18px;
  }

  body[data-inner-hero] .gate-rule span {
    text-align: left;
  }

  body[data-inner-hero] .gate-result {
    padding-inline: 18px;
  }

  body[data-inner-hero] .grid4,
  body[data-inner-hero] .roles,
  body[data-inner-hero] .member-grid,
  body[data-inner-hero] .t2 {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) and (min-width: 621px) {
  body[data-inner-hero] .mx-stage {
    grid-template-columns: 72px minmax(0, 1fr) 118px;
    gap: 16px;
    min-height: 520px;
  }

  body[data-inner-hero] .mx-layer-rail {
    grid-template-rows: repeat(5, 64px);
    padding-block: 10px 2px;
  }

  body[data-inner-hero] .mx-core,
  body[data-inner-hero] .mx-virtual {
    min-height: 520px;
  }

  body[data-inner-hero] .mx-layer-application {
    height: 100px;
  }

  body[data-inner-hero] .mx-layer-function,
  body[data-inner-hero] .mx-layer-data {
    height: 86px;
  }

  body[data-inner-hero] .mx-layer-foundation {
    height: 74px;
  }

  body[data-inner-hero] .mx-node-grid-five {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  body[data-inner-hero] .mx-node-grid {
    gap: 8px;
  }

  body[data-inner-hero] .mx-node-grid article {
    min-height: 0;
    padding-inline: 5px;
  }

  body[data-inner-hero] .mx-node-symbol {
    min-width: 26px;
    height: 23px;
    margin-bottom: 6px;
  }

  body[data-inner-hero] .mx-node-grid b {
    font-size: max(12.5px, .61rem);
  }

  body[data-inner-hero] .mx-node-grid small {
    font-size: max(12.5px, .52rem);
  }

  body[data-inner-hero] .mx-orchestration {
    margin-left: 0;
  }

  body[data-inner-hero] .mx-virtual-halo {
    width: 64px;
    height: 64px;
  }
}

@media (max-width: 620px) {
  body[data-inner-hero] .framework-visual {
    border-radius: 18px;
  }

  body[data-inner-hero] .mx-stage {
    grid-template-columns: 1fr;
    gap: 18px;
    min-height: 0;
  }

  body[data-inner-hero] .mx-layer-rail {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    grid-template-rows: 58px;
    gap: 6px;
    padding: 0;
  }

  body[data-inner-hero] .mx-layer-rail > div {
    min-width: 0;
    padding: 5px 2px;
  }

  body[data-inner-hero] .mx-layer-rail > div::before {
    display: none;
  }

  body[data-inner-hero] .mx-layer-rail::before {
    display: none;
  }

  body[data-inner-hero] .mx-rail-symbol {
    width: 19px;
    height: 19px;
    margin-bottom: 3px;
  }

  body[data-inner-hero] .mx-layer-rail b {
    max-width: 100%;
    overflow: hidden;
    font-size: 12.5px;
    text-overflow: ellipsis;
  }

  body[data-inner-hero] .mx-layer-rail small {
    font-size: 12.5px;
  }

  body[data-inner-hero] .mx-core {
    min-height: 0;
    gap: 14px;
  }

  body[data-inner-hero] .mx-layer,
  body[data-inner-hero] .mx-layer-application,
  body[data-inner-hero] .mx-layer-function,
  body[data-inner-hero] .mx-layer-data,
  body[data-inner-hero] .mx-layer-foundation {
    height: auto;
    padding: 0;
  }

  body[data-inner-hero] .mx-node-grid-four,
  body[data-inner-hero] .mx-node-grid-five {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body[data-inner-hero] .mx-node-grid {
    gap: 8px;
  }

  body[data-inner-hero] .mx-node-grid::after {
    display: none;
  }

  body[data-inner-hero] .mx-node-grid article {
    min-height: 94px;
    padding: 13px 8px;
  }

  body[data-inner-hero] .mx-orchestration {
    height: 48px;
    margin: 0;
    gap: 9px;
  }

  body[data-inner-hero] .mx-orchestration span {
    font-size: 12.5px;
  }

  body[data-inner-hero] .mx-orchestration b {
    font-size: 12.5px;
    letter-spacing: .07em;
  }

  body[data-inner-hero] .mx-foundation-node {
    min-height: 78px;
    justify-content: center;
    padding: 0 12px;
  }

  body[data-inner-hero] .mx-foundation-mark {
    width: 36px;
    height: 36px;
  }

  body[data-inner-hero] .mx-virtual {
    min-height: 250px;
  }

  body[data-inner-hero] .mx-virtual-route {
    margin-top: 34px;
  }

  body[data-inner-hero] .mx-stage-note {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body[data-inner-hero] .phero::before {
    animation: none;
  }

  body[data-inner-hero] .focus-media img,
  body[data-inner-hero] .pcard1 .media img,
  body[data-inner-hero] .public-result-media img,
  body[data-inner-hero] .mx-layer-rail > div,
  body[data-inner-hero] .mx-node-grid article,
  body[data-inner-hero] .mx-orchestration,
  body[data-inner-hero] .mx-foundation-node,
  body[data-inner-hero] .mx-virtual {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
    transition: none !important;
  }

  body[data-inner-hero] .mx-layer-rail > div::after,
  body[data-inner-hero] .mx-node-grid article::after,
  body[data-inner-hero] .mx-foundation-node::after,
  body[data-inner-hero] .mx-virtual::after,
  body[data-inner-hero] .mx-virtual-halo i {
    animation: none !important;
  }
}

@media (prefers-reduced-motion: no-preference) {
  body[data-inner-hero] .mx-platform.is-live .mx-node-symbol,
  body[data-inner-hero] .mx-platform.is-live .mx-rail-symbol {
    animation: mx-icon-breathe 2.6s ease-in-out infinite;
    animation-delay: var(--mx-sheen-delay, 0s);
  }

  body[data-inner-hero] .mx-platform.is-live .mx-virtual-halo i {
    animation: mx-ring-pulse 3.2s ease-out infinite;
  }

  body[data-inner-hero] .mx-platform.is-live .mx-foundation-mark {
    animation: mx-x-pulse 2.4s ease-in-out infinite;
  }

  body[data-inner-hero] .mx-platform.is-live .mx-orchestration span {
    animation: mx-bar-pulse 2.4s ease-in-out infinite alternate;
  }

  body[data-inner-hero] .mx-platform.is-live .mx-virtual-route span {
    animation: mx-route-pulse 1.8s ease-in-out infinite;
  }

  body[data-inner-hero] .mx-platform.is-live .mx-virtual-route span:nth-child(2) {
    animation-delay: .28s;
  }

  body[data-inner-hero] .mx-platform.is-live .mx-virtual-route span:nth-child(3) {
    animation-delay: .56s;
  }
}

body[data-inner-hero] .mx-platform.mx-motion-ready.is-live .mx-layer-rail > div:hover,
body[data-inner-hero] .mx-platform.mx-motion-ready.is-live .mx-node-grid article:hover,
body[data-inner-hero] .mx-platform.mx-motion-ready.is-live .mx-foundation-node:hover,
body[data-inner-hero] .mx-platform.mx-motion-ready.is-live .mx-virtual:hover {
  transform: translateY(-5px) scale(1.02);
}

@keyframes mx-sheen {
  0% { transform: translateX(-165%) skewX(-18deg); }
  55%, 100% { transform: translateX(185%) skewX(-18deg); }
}

@keyframes mx-icon-breathe {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.12); }
}

@keyframes mx-ring-pulse {
  0% { transform: scale(.82); opacity: .6; }
  100% { transform: scale(1.55); opacity: 0; }
}

@keyframes mx-x-pulse {
  0%, 100% { box-shadow: 0 0 8px rgba(199, 59, 63, .42); }
  50% { box-shadow: 0 0 22px rgba(225, 104, 108, .82); }
}

@keyframes mx-bar-pulse {
  from { opacity: .28; }
  to { opacity: .92; }
}

@keyframes mx-route-pulse {
  0%, 100% { opacity: .25; transform: scale(.8); }
  50% { opacity: 1; transform: scale(1.25); }
}

/* Research evidence: source-faithful, code-native manuscript figures */
body[data-inner-hero] .research-evidence .evidence-native {
  position: relative;
  margin-top: 18px;
  overflow: hidden;
  border: 1px solid rgba(var(--ink-rgb),.14);
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(176, 38, 45, .075), transparent 28%),
    rgb(var(--ground-3-rgb));
  box-shadow: 0 24px 70px rgba(var(--shadow-rgb),calc(.23 * var(--shadow-k)));
}

body[data-inner-hero] .research-evidence .evidence-native:first-of-type {
  margin-top: 0;
}

body[data-inner-hero] .research-evidence .evidence-native-head {
  min-height: 118px;
  padding: 27px 30px 25px;
  border-bottom: 1px solid rgba(var(--ink-rgb),.11);
  background: rgba(var(--ink-rgb),.012);
}

body[data-inner-hero] .research-evidence .evidence-native-head h3 {
  max-width: 27ch;
  font-size: clamp(1.28rem, 2vw, 1.9rem);
  line-height: 1.06;
}

body[data-inner-hero] .research-evidence .evidence-native-head p {
  max-width: 30ch;
  padding-top: 2px;
  font-size: max(12.5px, .73rem);
}

body[data-inner-hero] .evidence-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid rgba(var(--ink-rgb),.11);
}

body[data-inner-hero] .evidence-tabs button {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: center;
  min-height: 74px;
  padding: 17px 22px;
  color: var(--inner-muted);
  border: 0;
  border-left: 1px solid rgba(var(--ink-rgb),.08);
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition: color .25s ease, background-color .25s ease;
}

body[data-inner-hero] .evidence-tabs button:first-child {
  border-left: 0;
}

body[data-inner-hero] .evidence-tabs button::after {
  content: "";
  position: absolute;
  right: 18px;
  bottom: -1px;
  left: 18px;
  height: 2px;
  background: var(--inner-red-hot);
  opacity: 0;
  transform: scaleX(.25);
  transition: opacity .25s ease, transform .35s var(--ease-out);
}

body[data-inner-hero] .evidence-tabs button:hover,
body[data-inner-hero] .evidence-tabs button.is-active {
  color: var(--inner-text);
  background: rgba(176, 38, 45, .08);
}

body[data-inner-hero] .evidence-tabs button.is-active::after {
  opacity: 1;
  transform: scaleX(1);
}

body[data-inner-hero] .evidence-tabs small {
  color: var(--inner-red-hot);
  font: 600 9px/1 var(--mono);
  letter-spacing: .08em;
}

body[data-inner-hero] .evidence-tabs b {
  font-size: max(12.5px, .75rem);
  font-weight: 570;
  letter-spacing: -.01em;
}

body[data-inner-hero] .evidence-pipe {
  display: grid;
  grid-template-columns: minmax(190px, .72fr) 26px minmax(360px, 1.45fr) 26px minmax(190px, .72fr);
  align-items: stretch;
  padding: 30px;
}

body[data-inner-hero] .evidence-band {
  min-width: 0;
  min-height: 270px;
  padding: 20px;
  border: 1px solid rgba(var(--ink-rgb),.12);
  background: rgba(var(--ink-rgb),.018);
}

body[data-inner-hero] .evidence-band-run {
  border-color: rgba(199, 59, 63, .34);
  background: rgba(176, 38, 45, .055);
}

body[data-inner-hero] .evidence-band > header {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(var(--ink-rgb),.1);
}

body[data-inner-hero] .evidence-band > header span {
  color: var(--inner-red-hot);
  font: 650 9px/1 var(--mono);
  letter-spacing: .13em;
}

body[data-inner-hero] .evidence-band > header b {
  color: var(--inner-faint);
  font-size: max(12.5px, .62rem);
  font-weight: 520;
  text-align: right;
}

body[data-inner-hero] .evidence-join {
  position: relative;
}

body[data-inner-hero] .evidence-join::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 5px;
  left: 5px;
  height: 1px;
  background: linear-gradient(90deg, rgba(199, 59, 63, .25), var(--inner-red-hot));
}

body[data-inner-hero] .evidence-join::after {
  content: "";
  position: absolute;
  top: calc(50% - 3px);
  right: 3px;
  width: 6px;
  height: 6px;
  border-top: 1px solid var(--inner-red-hot);
  border-right: 1px solid var(--inner-red-hot);
  transform: rotate(45deg);
}

body[data-inner-hero] #mx-evidence-input,
body[data-inner-hero] #mx-evidence-output {
  padding-top: 26px;
}

body[data-inner-hero] #mx-evidence-input > strong,
body[data-inner-hero] #mx-evidence-output > strong {
  display: block;
  color: var(--inner-text);
  font-size: .88rem;
  font-weight: 570;
  line-height: 1.4;
}

body[data-inner-hero] .evidence-meta {
  margin-top: 25px;
}

body[data-inner-hero] .evidence-meta span {
  display: block;
  padding: 9px 0;
  color: var(--inner-muted);
  border-top: 1px solid rgba(var(--ink-rgb),.07);
  font-size: max(12.5px, .64rem);
  line-height: 1.35;
}

body[data-inner-hero] #mx-evidence-steps {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding-top: 15px;
}

body[data-inner-hero] .evidence-agent-step {
  display: grid;
  grid-template-columns: 25px 1fr;
  gap: 10px;
  min-height: 80px;
  padding: 13px;
  border: 1px solid rgba(var(--ink-rgb),.09);
  background: rgba(var(--shadow-rgb),calc(.16 * var(--shadow-k)));
}

body[data-inner-hero] .evidence-agent-step > span {
  color: var(--inner-red-hot);
  font: 600 8px/1.3 var(--mono);
}

body[data-inner-hero] .evidence-agent-step p,
body[data-inner-hero] .evidence-agent-step b,
body[data-inner-hero] .evidence-agent-step small {
  display: block;
  margin: 0;
}

body[data-inner-hero] .evidence-agent-step b {
  color: var(--inner-text);
  font-size: max(12.5px, .69rem);
  font-weight: 570;
  line-height: 1.25;
}

body[data-inner-hero] .evidence-agent-step small {
  margin-top: 8px;
  color: var(--inner-faint);
  font-size: max(12.5px, .59rem);
  line-height: 1.38;
}

body[data-inner-hero] #mx-evidence-output > p {
  margin: 13px 0 0;
  color: var(--inner-muted);
  font-size: max(12.5px, .65rem);
  line-height: 1.48;
}

body[data-inner-hero] .evidence-output-metrics {
  display: grid;
  gap: 7px;
  margin-top: 25px;
}

body[data-inner-hero] .evidence-output-metrics span {
  padding: 9px 10px;
  color: var(--inner-text);
  border-left: 2px solid var(--inner-red);
  background: rgba(176, 38, 45, .08);
  font: 550 9px/1.3 var(--mono);
}

body[data-inner-hero] .evidence-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid rgba(var(--ink-rgb),.11);
}

body[data-inner-hero] .evidence-facts > div {
  min-height: 110px;
  padding: 20px 22px;
  border-left: 1px solid rgba(var(--ink-rgb),.08);
}

body[data-inner-hero] .evidence-facts > div:first-child {
  border-left: 0;
}

body[data-inner-hero] .evidence-facts b,
body[data-inner-hero] .evidence-facts span {
  display: block;
}

body[data-inner-hero] .evidence-facts b {
  color: var(--inner-text);
  font-size: max(12.5px, .74rem);
  font-weight: 570;
}

body[data-inner-hero] .evidence-facts span {
  margin-top: 11px;
  color: var(--inner-faint);
  font-size: max(12.5px, .61rem);
  line-height: 1.42;
}

body[data-inner-hero] .research-evidence .benchmark-controls {
  border-radius: 7px;
  background: rgba(var(--shadow-rgb),calc(.2 * var(--shadow-k)));
}

body[data-inner-hero] .research-evidence .benchmark-controls button {
  border-radius: 4px;
}

body[data-inner-hero] .benchmark-layout {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  min-height: 590px;
}

body[data-inner-hero] .benchmark-board,
body[data-inner-hero] .benchmark-matrix {
  min-width: 0;
}

body[data-inner-hero] .benchmark-board {
  padding: 25px 22px 22px;
  border-right: 1px solid rgba(var(--ink-rgb),.11);
}

body[data-inner-hero] .benchmark-board > header,
body[data-inner-hero] .benchmark-matrix > header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
  min-height: 30px;
}

body[data-inner-hero] .benchmark-board h4,
body[data-inner-hero] .benchmark-matrix h4,
body[data-inner-hero] .benchmark-board header span,
body[data-inner-hero] .benchmark-matrix header span {
  margin: 0;
}

body[data-inner-hero] .benchmark-board h4,
body[data-inner-hero] .benchmark-matrix h4 {
  color: var(--inner-text);
  font-size: max(12.5px, .78rem);
  font-weight: 570;
}

body[data-inner-hero] .benchmark-board header span,
body[data-inner-hero] .benchmark-matrix header span {
  color: var(--inner-faint);
  font: 500 8px/1 var(--mono);
  text-transform: uppercase;
}

body[data-inner-hero] #mx-benchmark-board {
  margin-top: 12px;
}

body[data-inner-hero] .mx-board-row {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr) 42px;
  gap: 9px;
  align-items: center;
  min-height: 25px;
  border-top: 1px solid rgba(var(--ink-rgb),.055);
}

body[data-inner-hero] .mx-board-row > span {
  color: var(--inner-faint);
  font: 500 7px/1 var(--mono);
}

body[data-inner-hero] .mx-board-row p {
  position: relative;
  min-width: 0;
  margin: 0;
  padding: 6px 0;
}

body[data-inner-hero] .mx-board-row b {
  display: block;
  overflow: hidden;
  color: var(--inner-muted);
  font-size: max(12.5px, .56rem);
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body[data-inner-hero] .mx-board-row i {
  display: block;
  height: 1px;
  margin-top: 4px;
  background: rgba(199, 59, 63, .62);
}

body[data-inner-hero] .mx-board-row strong {
  color: var(--inner-muted);
  font: 550 8px/1 var(--mono);
  text-align: right;
}

body[data-inner-hero] .mx-board-row.is-top b,
body[data-inner-hero] .mx-board-row.is-top strong {
  color: var(--inner-text);
}

body[data-inner-hero] .mx-board-row.is-top i {
  height: 2px;
  background: var(--inner-red-hot);
}

body[data-inner-hero] .benchmark-board > p {
  margin: 17px 0 0;
  color: var(--inner-faint);
  font-size: max(12.5px, .58rem);
  line-height: 1.45;
}

body[data-inner-hero] .benchmark-board > p b {
  color: var(--inner-text);
  font-weight: 550;
}

body[data-inner-hero] .benchmark-matrix {
  padding: 25px 0 0;
}

body[data-inner-hero] .benchmark-matrix > header {
  padding: 0 24px;
}

body[data-inner-hero] .research-evidence .benchmark-scroll {
  max-width: 100%;
  height: 510px;
  margin-top: 12px;
  padding: 0 24px 12px;
}

body[data-inner-hero] .research-evidence #mx-benchmark-grid {
  min-width: 820px;
  gap: 3px;
}

body[data-inner-hero] .research-evidence .mx-bench-head {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 7px 1px 9px;
  background: rgb(var(--ground-3-rgb));
}

body[data-inner-hero] .research-evidence .mx-bench-name {
  position: sticky;
  left: 0;
  z-index: 1;
  padding: 5px 12px 5px 0;
  background: rgb(var(--ground-3-rgb));
}

body[data-inner-hero] .research-evidence .mx-bench-cell {
  min-height: 15px;
  border-radius: 2px;
}

body[data-inner-hero] .research-evidence .benchmark-legend {
  padding: 14px 24px 18px;
}

body[data-inner-hero] .evidence-method-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
}

body[data-inner-hero] .evidence-verification,
body[data-inner-hero] .evidence-method-steps {
  min-width: 0;
  padding: 28px 30px 30px;
}

body[data-inner-hero] .evidence-method-steps {
  border-left: 1px solid rgba(var(--ink-rgb),.11);
}

body[data-inner-hero] .evidence-verification > h4,
body[data-inner-hero] .evidence-method-steps > h4 {
  margin: 0 0 20px;
  color: var(--inner-text);
  font-size: max(12.5px, .78rem);
  font-weight: 570;
}

body[data-inner-hero] .verification-cases {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

body[data-inner-hero] .verification-case {
  min-height: 188px;
  padding: 17px;
  border: 1px solid rgba(var(--ink-rgb),.1);
  background: rgba(var(--ink-rgb),.014);
}

body[data-inner-hero] .verification-pass {
  border-color: rgba(199, 59, 63, .38);
  background: rgba(176, 38, 45, .065);
}

body[data-inner-hero] .verification-case > small {
  display: block;
  color: var(--inner-faint);
  font: 650 8px/1 var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
}

body[data-inner-hero] .verification-pass > small {
  color: var(--inner-red-hot);
}

body[data-inner-hero] .verification-case > div {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
  margin-top: 25px;
}

body[data-inner-hero] .verification-case span,
body[data-inner-hero] .verification-case span b {
  display: block;
}

body[data-inner-hero] .verification-case span {
  color: var(--inner-faint);
  font-size: max(12.5px, .56rem);
  line-height: 1.25;
}

body[data-inner-hero] .verification-case span b {
  margin-top: 7px;
  color: var(--inner-text);
  font: 600 1rem/1 var(--mono);
}

body[data-inner-hero] .verification-case > p {
  margin: 19px 0 0;
  color: var(--inner-muted);
  font-size: max(12.5px, .61rem);
  line-height: 1.42;
}

body[data-inner-hero] .retention-rule {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 22px;
  padding: 16px 0;
  border-top: 1px solid rgba(var(--ink-rgb),.1);
  border-bottom: 1px solid rgba(var(--ink-rgb),.1);
}

body[data-inner-hero] .retention-rule span {
  display: grid;
  grid-template-columns: 20px 1fr;
  gap: 9px;
  color: var(--inner-muted);
  font-size: max(12.5px, .61rem);
  line-height: 1.4;
}

body[data-inner-hero] .retention-rule i {
  color: var(--inner-red-hot);
  font: 600 8px/1.5 var(--mono);
}

body[data-inner-hero] .retention-bars {
  display: grid;
  grid-template-columns: repeat(18, 1fr);
  gap: 4px;
  align-items: end;
  height: 76px;
  padding-top: 19px;
}

body[data-inner-hero] .retention-bars i {
  height: 100%;
  border-top: 2px solid var(--inner-red-hot);
  background: linear-gradient(180deg, rgba(199, 59, 63, .42), rgba(199, 59, 63, .035));
}

body[data-inner-hero] .retention-bars i.is-low {
  height: 26%;
  border-color: rgba(var(--ink-rgb),.45);
  background: rgba(var(--ink-rgb),.08);
}

body[data-inner-hero] .retention-result {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 20px;
  align-items: end;
  margin-top: 18px;
}

body[data-inner-hero] .retention-result > b {
  color: var(--inner-text);
  font: 580 clamp(3rem, 5vw, 5.5rem)/.78 var(--mono);
  letter-spacing: -.075em;
}

body[data-inner-hero] .retention-result span,
body[data-inner-hero] .retention-result strong {
  display: block;
}

body[data-inner-hero] .retention-result span {
  max-width: 31ch;
  color: var(--inner-faint);
  font-size: max(12.5px, .61rem);
  line-height: 1.42;
}

body[data-inner-hero] .retention-result strong {
  margin-bottom: 7px;
  color: var(--inner-text);
  font-size: max(12.5px, .72rem);
  font-weight: 560;
}

body[data-inner-hero] .evidence-method-step {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 13px;
  min-height: 75px;
  padding: 15px 0;
  border-top: 1px solid rgba(var(--ink-rgb),.085);
}

body[data-inner-hero] .evidence-method-step:first-of-type {
  border-top: 0;
}

body[data-inner-hero] .evidence-method-step > span {
  color: var(--inner-faint);
  font: 600 8px/1.4 var(--mono);
}

body[data-inner-hero] .evidence-method-step p,
body[data-inner-hero] .evidence-method-step b,
body[data-inner-hero] .evidence-method-step small {
  display: block;
  margin: 0;
}

body[data-inner-hero] .evidence-method-step b {
  color: var(--inner-muted);
  font-size: max(12.5px, .69rem);
  font-weight: 560;
}

body[data-inner-hero] .evidence-method-step small {
  margin-top: 7px;
  color: var(--inner-faint);
  font-size: max(12.5px, .59rem);
  line-height: 1.42;
}

body[data-inner-hero] .evidence-method-step.is-key {
  margin-inline: -14px;
  padding-inline: 14px;
  border-color: rgba(199, 59, 63, .25);
  background: rgba(176, 38, 45, .07);
}

body[data-inner-hero] .evidence-method-step.is-key > span,
body[data-inner-hero] .evidence-method-step.is-key b {
  color: var(--inner-red-hot);
}

body[data-inner-hero] .evidence-method-config {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  border-top: 1px solid rgba(var(--ink-rgb),.11);
  background: rgba(var(--ink-rgb),.012);
}

body[data-inner-hero] .evidence-method-config span {
  min-height: 66px;
  padding: 16px 15px;
  color: var(--inner-faint);
  border-left: 1px solid rgba(var(--ink-rgb),.08);
  font: 500 7px/1.3 var(--mono);
  text-transform: uppercase;
}

body[data-inner-hero] .evidence-method-config span:first-child {
  border-left: 0;
}

body[data-inner-hero] .evidence-method-config b {
  display: block;
  margin-top: 7px;
  color: var(--inner-text);
  font-size: 12.5px;
  font-weight: 600;
  text-transform: none;
}

@media (max-width: 1040px) {
  body[data-inner-hero] .evidence-pipe {
    grid-template-columns: minmax(160px, .65fr) 22px minmax(310px, 1.35fr) 22px minmax(160px, .65fr);
    padding: 24px;
  }

  body[data-inner-hero] .benchmark-layout {
    grid-template-columns: 260px minmax(0, 1fr);
  }
}

@media (max-width: 900px) {
  body[data-inner-hero] .evidence-pipe {
    grid-template-columns: 1fr;
  }

  body[data-inner-hero] .evidence-band {
    min-height: 0;
  }

  body[data-inner-hero] .evidence-join {
    height: 24px;
  }

  body[data-inner-hero] .evidence-join::before {
    top: 4px;
    right: auto;
    bottom: 4px;
    left: 50%;
    width: 1px;
    height: auto;
    background: linear-gradient(180deg, rgba(199, 59, 63, .25), var(--inner-red-hot));
  }

  body[data-inner-hero] .evidence-join::after {
    top: auto;
    right: auto;
    bottom: 3px;
    left: calc(50% - 3px);
    transform: rotate(135deg);
  }

  body[data-inner-hero] .evidence-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body[data-inner-hero] .evidence-facts > div:nth-child(3) {
    border-left: 0;
  }

  body[data-inner-hero] .evidence-facts > div:nth-child(n+3) {
    border-top: 1px solid rgba(var(--ink-rgb),.08);
  }

  body[data-inner-hero] .benchmark-layout,
  body[data-inner-hero] .evidence-method-layout {
    grid-template-columns: 1fr;
  }

  body[data-inner-hero] .benchmark-board,
  body[data-inner-hero] .evidence-method-steps {
    border-right: 0;
    border-bottom: 1px solid rgba(var(--ink-rgb),.11);
  }

  body[data-inner-hero] .evidence-method-steps {
    border-left: 0;
  }

  body[data-inner-hero] #mx-benchmark-board {
    columns: 2;
    column-gap: 22px;
  }

  body[data-inner-hero] .mx-board-row {
    break-inside: avoid;
  }

  body[data-inner-hero] .evidence-method-config {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  body[data-inner-hero] .evidence-method-config span:nth-child(5) {
    border-left: 0;
  }

  body[data-inner-hero] .evidence-method-config span:nth-child(n+5) {
    border-top: 1px solid rgba(var(--ink-rgb),.08);
  }
}

@media (max-width: 620px) {
  body[data-inner-hero] .research-evidence .evidence-native {
    border-radius: 13px;
  }

  body[data-inner-hero] .research-evidence .evidence-native-head {
    padding: 21px 18px;
  }

  body[data-inner-hero] .evidence-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body[data-inner-hero] .evidence-tabs button {
    min-height: 66px;
    padding: 14px 15px;
  }

  body[data-inner-hero] .evidence-tabs button:nth-child(3) {
    border-left: 0;
  }

  body[data-inner-hero] .evidence-tabs button:nth-child(n+3) {
    border-top: 1px solid rgba(var(--ink-rgb),.08);
  }

  body[data-inner-hero] .evidence-pipe {
    padding: 18px;
  }

  body[data-inner-hero] .evidence-band {
    padding: 17px;
  }

  body[data-inner-hero] #mx-evidence-steps {
    grid-template-columns: 1fr;
  }

  body[data-inner-hero] .evidence-facts {
    grid-template-columns: 1fr;
  }

  body[data-inner-hero] .evidence-facts > div,
  body[data-inner-hero] .evidence-facts > div:nth-child(3) {
    min-height: 0;
    border-top: 1px solid rgba(var(--ink-rgb),.08);
    border-left: 0;
  }

  body[data-inner-hero] .evidence-facts > div:first-child {
    border-top: 0;
  }

  body[data-inner-hero] .benchmark-head {
    gap: 18px;
  }

  body[data-inner-hero] .benchmark-board {
    padding: 22px 18px;
  }

  body[data-inner-hero] #mx-benchmark-board {
    columns: 1;
  }

  body[data-inner-hero] .benchmark-matrix {
    padding-top: 22px;
  }

  body[data-inner-hero] .benchmark-matrix > header {
    padding-inline: 18px;
  }

  body[data-inner-hero] .research-evidence .benchmark-scroll {
    height: 495px;
    padding-inline: 18px;
  }

  body[data-inner-hero] .verification-cases,
  body[data-inner-hero] .retention-rule {
    grid-template-columns: 1fr;
  }

  body[data-inner-hero] .evidence-verification,
  body[data-inner-hero] .evidence-method-steps {
    padding: 23px 18px;
  }

  body[data-inner-hero] .retention-result {
    grid-template-columns: 1fr;
    gap: 15px;
  }

  body[data-inner-hero] .evidence-method-config {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body[data-inner-hero] .evidence-method-config span:nth-child(odd) {
    border-left: 0;
  }

  body[data-inner-hero] .evidence-method-config span:nth-child(n+3) {
    border-top: 1px solid rgba(var(--ink-rgb),.08);
  }
}

/* Research loop: connected Z-story, sticky phase navigation and active states */
body[data-inner-hero] .evidence-story-shell {
  position: relative;
}

body[data-inner-hero] .evidence-loop-note {
  max-width: 650px;
  margin-bottom: 28px;
}

body[data-inner-hero] .evidence-loop-note strong,
body[data-inner-hero] .evidence-loop-note p {
  display: block;
  margin: 0;
}

body[data-inner-hero] .evidence-loop-note strong {
  color: var(--inner-text);
  font-size: 1rem;
  font-weight: 580;
}

body[data-inner-hero] .evidence-loop-note p {
  max-width: 58ch;
  margin-top: 10px;
  color: var(--inner-muted);
  font-size: max(12.5px, .78rem);
  line-height: 1.55;
}

body[data-inner-hero] .evidence-story-nav {
  position: sticky;
  top: 69px;
  z-index: 5;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  overflow: hidden;
  margin-bottom: 42px;
  border: 1px solid rgba(var(--ink-rgb),.16);
  border-radius: 14px;
  background: rgba(var(--ground-rgb),.88);
  box-shadow:
    inset 0 1px 0 rgba(var(--ink-rgb),.04),
    0 18px 46px rgba(var(--shadow-rgb),calc(.32 * var(--shadow-k)));
  backdrop-filter: blur(18px) saturate(1.12);
}

body[data-inner-hero] .evidence-story-nav button {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 14px;
  min-height: 82px;
  padding: 17px 20px 15px;
  color: var(--inner-muted);
  border: 0;
  border-left: 1px solid rgba(var(--ink-rgb),.09);
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition:
    color .3s ease,
    background-color .3s ease,
    transform .25s var(--ease-out);
}

body[data-inner-hero] .evidence-story-nav button:first-child {
  border-left: 0;
}

body[data-inner-hero] .evidence-story-nav button::after {
  content: "";
  position: absolute;
  right: 20px;
  bottom: 0;
  left: 20px;
  height: 2px;
  background: var(--inner-red-hot);
  opacity: 0;
  transform: scaleX(.18);
  transform-origin: left center;
  transition: opacity .3s ease, transform .45s var(--ease-out);
}

body[data-inner-hero] .evidence-story-nav button:hover {
  color: var(--inner-text);
  background: rgba(var(--ink-rgb),.025);
}

body[data-inner-hero] .evidence-story-nav button:active {
  transform: translateY(1px);
}

body[data-inner-hero] .evidence-story-nav button.is-active {
  color: var(--inner-text);
  background:
    linear-gradient(100deg, rgba(176, 38, 45, .22), rgba(176, 38, 45, .035) 72%);
}

body[data-inner-hero] .evidence-story-nav button.is-active::after {
  opacity: 1;
  transform: scaleX(1);
}

body[data-inner-hero] .evidence-story-nav span {
  grid-row: 1 / 3;
  align-self: center;
  min-width: 54px;
  color: var(--inner-red-hot);
  font: 650 10px/1 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

body[data-inner-hero] .evidence-story-nav b,
body[data-inner-hero] .evidence-story-nav small {
  display: block;
  min-width: 0;
}

body[data-inner-hero] .evidence-story-nav b {
  overflow: hidden;
  color: inherit;
  font-size: max(12.5px, .75rem);
  font-weight: 580;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body[data-inner-hero] .evidence-story-nav small {
  margin-top: 6px;
  color: var(--inner-faint);
  font-size: max(12.5px, .58rem);
  line-height: 1.25;
}

body[data-inner-hero] .evidence-story {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-items: start;
}

body[data-inner-hero] .evidence-story .evidence-native {
  width: auto;
  margin-top: 0;
  scroll-margin-top: 145px;
  transition:
    opacity .6s cubic-bezier(.16, 1, .3, 1),
    transform .72s cubic-bezier(.16, 1, .3, 1),
    border-color .45s ease,
    box-shadow .45s ease;
}

body[data-inner-hero] .evidence-story .evidence-chain,
body[data-inner-hero] .evidence-story .evidence-method {
  grid-column: 1 / span 11;
}

body[data-inner-hero] .evidence-story .evidence-benchmark {
  grid-column: 2 / -1;
}

body[data-inner-hero] .evidence-story-shell.is-motion-ready .evidence-chain,
body[data-inner-hero] .evidence-story-shell.is-motion-ready .evidence-method {
  opacity: .32;
  transform: translate3d(-46px, 36px, 0) scale(.985);
}

body[data-inner-hero] .evidence-story-shell.is-motion-ready .evidence-benchmark {
  opacity: .32;
  transform: translate3d(46px, 36px, 0) scale(.985);
}

body[data-inner-hero] .evidence-story-shell.is-motion-ready .evidence-native.has-entered {
  opacity: .58;
  transform: none;
}

body[data-inner-hero] .evidence-story-shell.is-motion-ready .evidence-native.is-active,
body[data-inner-hero] .evidence-story .evidence-native:hover {
  opacity: 1;
  border-color: rgba(199, 59, 63, .34);
  box-shadow:
    inset 0 1px 0 rgba(var(--ink-rgb),.04),
    0 34px 90px rgba(var(--shadow-rgb),calc(.34 * var(--shadow-k)));
  transform: none;
}

body[data-inner-hero] .evidence-bridge {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 126px;
  color: rgba(var(--ink-rgb),.7);
  font-size: max(12.5px, .72rem);
  font-weight: 520;
  line-height: 1.4;
}

body[data-inner-hero] .evidence-bridge-right {
  grid-column: 9 / -1;
  justify-content: flex-end;
  padding-right: 12px;
  text-align: right;
}

body[data-inner-hero] .evidence-bridge-left {
  grid-column: 1 / span 4;
  padding-left: 12px;
}

body[data-inner-hero] .evidence-bridge span {
  position: relative;
  z-index: 1;
  max-width: 31ch;
  padding: 8px 12px;
  background: rgb(var(--ground-rgb));
}

body[data-inner-hero] .evidence-bridge i {
  position: absolute;
  top: 50%;
  width: 86%;
  height: 1px;
  background: linear-gradient(90deg, rgba(199, 59, 63, .1), rgba(199, 59, 63, .8));
  transform: rotate(8deg);
}

body[data-inner-hero] .evidence-bridge-right i {
  right: 3%;
}

body[data-inner-hero] .evidence-bridge-left i {
  left: 3%;
  background: linear-gradient(90deg, rgba(199, 59, 63, .8), rgba(199, 59, 63, .1));
  transform: rotate(-8deg);
}

body[data-inner-hero] .evidence-tabs-heading {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  align-items: center;
  min-height: 68px;
  padding: 14px 24px;
  border-bottom: 1px solid rgba(var(--ink-rgb),.1);
  background: rgba(var(--ink-rgb),.012);
}

body[data-inner-hero] .evidence-tabs-heading b,
body[data-inner-hero] .evidence-tabs-heading span {
  display: block;
}

body[data-inner-hero] .evidence-tabs-heading b {
  color: var(--inner-text);
  font-size: max(12.5px, .73rem);
  font-weight: 580;
}

body[data-inner-hero] .evidence-tabs-heading span {
  margin-top: 6px;
  color: var(--inner-faint);
  font-size: max(12.5px, .61rem);
}

body[data-inner-hero] .evidence-tabs-heading > strong {
  flex: 0 0 auto;
  padding: 7px 9px;
  color: var(--inner-red-hot);
  border: 1px solid rgba(199, 59, 63, .3);
  border-radius: 6px;
  font: 600 8px/1 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

body[data-inner-hero] .evidence-tabs button {
  min-height: 92px;
  padding: 18px 21px;
}

body[data-inner-hero] .evidence-tabs button > span {
  display: block;
  min-width: 0;
}

body[data-inner-hero] .evidence-tabs button b,
body[data-inner-hero] .evidence-tabs button em {
  display: block;
  min-width: 0;
}

body[data-inner-hero] .evidence-tabs button b {
  overflow: hidden;
  color: inherit;
  font-size: max(12.5px, .73rem);
  text-overflow: ellipsis;
  white-space: nowrap;
}

body[data-inner-hero] .evidence-tabs button em {
  margin-top: 8px;
  color: var(--inner-faint);
  font-size: max(12.5px, .57rem);
  font-style: normal;
  font-weight: 450;
  line-height: 1.25;
}

body[data-inner-hero] .evidence-tabs button.is-active {
  background:
    linear-gradient(110deg, rgba(176, 38, 45, .38), rgba(176, 38, 45, .1) 76%);
  box-shadow: inset 0 0 0 1px rgba(199, 59, 63, .25);
}

body[data-inner-hero] .evidence-tabs button.is-active small,
body[data-inner-hero] .evidence-tabs button.is-active b {
  color: #f5eded;
}

body[data-inner-hero] .evidence-tabs button.is-active em {
  color: rgba(245, 237, 237, .67);
}

body[data-inner-hero] .evidence-tabs button:focus-visible,
body[data-inner-hero] .evidence-story-nav button:focus-visible {
  z-index: 2;
  outline: 2px solid var(--inner-red-hot);
  outline-offset: -3px;
}

@media (prefers-reduced-motion: no-preference) {
  body[data-inner-hero] .evidence-pipe.is-switching .evidence-band {
    animation: evidence-tab-shift .46s cubic-bezier(.16, 1, .3, 1) both;
  }

  body[data-inner-hero] .evidence-pipe.is-switching .evidence-band-run {
    animation-delay: .045s;
  }

  body[data-inner-hero] .evidence-pipe.is-switching .evidence-band-output {
    animation-delay: .09s;
  }
}

@keyframes evidence-tab-shift {
  from {
    opacity: .3;
    transform: translate3d(0, 13px, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@media (max-width: 900px) {
  body[data-inner-hero] .evidence-story .evidence-chain,
  body[data-inner-hero] .evidence-story .evidence-benchmark,
  body[data-inner-hero] .evidence-story .evidence-method {
    grid-column: 1 / -1;
  }

  body[data-inner-hero] .evidence-story-shell.is-motion-ready .evidence-chain,
  body[data-inner-hero] .evidence-story-shell.is-motion-ready .evidence-benchmark,
  body[data-inner-hero] .evidence-story-shell.is-motion-ready .evidence-method {
    transform: translate3d(0, 30px, 0) scale(.99);
  }

  body[data-inner-hero] .evidence-story-shell.is-motion-ready .evidence-native.has-entered,
  body[data-inner-hero] .evidence-story-shell.is-motion-ready .evidence-native.is-active {
    transform: none;
  }

  body[data-inner-hero] .evidence-bridge-right,
  body[data-inner-hero] .evidence-bridge-left {
    grid-column: 1 / -1;
    justify-content: center;
    min-height: 104px;
    padding: 0;
    text-align: center;
  }

  body[data-inner-hero] .evidence-bridge i,
  body[data-inner-hero] .evidence-bridge-left i {
    top: 12px;
    bottom: 12px;
    left: 50%;
    width: 1px;
    height: auto;
    background: linear-gradient(180deg, rgba(199, 59, 63, .1), rgba(199, 59, 63, .75), rgba(199, 59, 63, .1));
    transform: none;
  }
}

@media (max-width: 720px) {
  body[data-inner-hero] .evidence-story-nav {
    position: relative;
    top: auto;
    grid-template-columns: 1fr;
    margin-bottom: 30px;
    backdrop-filter: none;
  }

  body[data-inner-hero] .evidence-story-nav button {
    min-height: 72px;
    border-top: 1px solid rgba(var(--ink-rgb),.09);
    border-left: 0;
  }

  body[data-inner-hero] .evidence-story-nav button:first-child {
    border-top: 0;
  }

  body[data-inner-hero] .evidence-story-nav button::after {
    top: 13px;
    right: auto;
    bottom: 13px;
    left: 0;
    width: 2px;
    height: auto;
    transform: scaleY(.18);
  }

  body[data-inner-hero] .evidence-story-nav button.is-active::after {
    transform: scaleY(1);
  }

  body[data-inner-hero] .evidence-tabs-heading {
    align-items: flex-start;
    min-height: 0;
    padding: 16px 18px;
  }

  body[data-inner-hero] .evidence-tabs-heading > strong {
    display: none;
  }

  body[data-inner-hero] .evidence-tabs button {
    min-height: 82px;
    padding: 15px;
  }

  body[data-inner-hero] .evidence-tabs button b {
    white-space: normal;
  }
}

@media (prefers-reduced-motion: reduce) {
  body[data-inner-hero] .evidence-story .evidence-native,
  body[data-inner-hero] .evidence-tabs button,
  body[data-inner-hero] .evidence-story-nav button {
    transition: none !important;
  }

  body[data-inner-hero] .evidence-story-shell .evidence-native {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* Research evidence: alternating editorial scrollytelling, no tabs */
body[data-inner-hero] .evidence-scroll-sequence {
  position: relative;
  margin-top: clamp(52px, 7vw, 96px);
}

body[data-inner-hero] .evidence-chapter {
  display: grid;
  grid-template-columns: minmax(280px, .72fr) minmax(0, 1.38fr);
  gap: clamp(44px, 6vw, 94px);
  align-items: start;
  min-height: 920px;
  padding: clamp(90px, 10vw, 150px) 0;
  border-top: 1px solid rgba(var(--ink-rgb),.12);
}

body[data-inner-hero] .evidence-chapter:first-child {
  border-top-color: rgba(199, 59, 63, .34);
}

body[data-inner-hero] .evidence-chapter-measure {
  grid-template-columns: minmax(0, 1.38fr) minmax(280px, .72fr);
}

body[data-inner-hero] .evidence-chapter-copy {
  position: sticky;
  top: 132px;
  align-self: start;
  padding-top: 16px;
}

body[data-inner-hero] .evidence-chapter-label {
  display: block;
  margin-bottom: 30px;
  color: var(--inner-red-hot);
  font-size: max(12.5px, .76rem);
  font-weight: 600;
}

body[data-inner-hero] .evidence-chapter-copy h3,
body[data-inner-hero] .evidence-chapter-copy > p,
body[data-inner-hero] .evidence-chapter-copy > small {
  display: block;
  margin: 0;
}

body[data-inner-hero] .evidence-chapter-copy h3 {
  max-width: 8.5ch;
  color: var(--inner-text);
  font-size: clamp(2.85rem, 4.8vw, 5.35rem);
  font-weight: 550;
  letter-spacing: -.067em;
  line-height: .94;
}

body[data-inner-hero] .evidence-chapter-copy > p {
  max-width: 34ch;
  margin-top: 30px;
  color: var(--inner-muted);
  font-size: clamp(.86rem, 1.1vw, 1rem);
  line-height: 1.65;
}

body[data-inner-hero] .evidence-chapter-metrics {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  margin-top: 46px;
  padding-top: 22px;
  border-top: 1px solid rgba(var(--ink-rgb),.14);
}

body[data-inner-hero] .evidence-chapter-metrics span,
body[data-inner-hero] .evidence-chapter-metrics b {
  display: block;
}

body[data-inner-hero] .evidence-chapter-metrics span {
  color: var(--inner-faint);
  font-size: max(12.5px, .63rem);
  line-height: 1.35;
}

body[data-inner-hero] .evidence-chapter-metrics b {
  margin-bottom: 10px;
  color: var(--inner-text);
  font: 580 clamp(1.45rem, 2.5vw, 2.7rem)/1 var(--mono);
  letter-spacing: -.05em;
}

body[data-inner-hero] .evidence-chapter-copy > small {
  max-width: 36ch;
  margin-top: 38px;
  padding-left: 16px;
  color: rgba(var(--ink-rgb),.64);
  border-left: 2px solid var(--inner-red);
  font-size: max(12.5px, .68rem);
  line-height: 1.5;
}

body[data-inner-hero] .evidence-visual {
  --evidence-x: 50%;
  --evidence-y: 38%;
  position: relative;
  min-width: 0;
  overflow: hidden;
  margin: 0;
  border: 1px solid rgba(var(--ink-rgb),.14);
  border-radius: 16px;
  background:
    radial-gradient(circle at var(--evidence-x) var(--evidence-y), rgba(176, 38, 45, .13), transparent 34%),
    linear-gradient(145deg, rgba(var(--ink-rgb),.025), transparent 30%),
    rgb(var(--ground-3-rgb));
  box-shadow:
    inset 0 1px 0 rgba(var(--ink-rgb),.035),
    0 28px 75px rgba(var(--shadow-rgb),calc(.26 * var(--shadow-k)));
  transition:
    border-color .45s ease,
    box-shadow .45s ease,
    transform .7s cubic-bezier(.16, 1, .3, 1),
    opacity .7s cubic-bezier(.16, 1, .3, 1);
}

body[data-inner-hero] .evidence-chapter.is-current .evidence-visual {
  border-color: rgba(199, 59, 63, .4);
  box-shadow:
    inset 0 1px 0 rgba(var(--ink-rgb),.045),
    0 36px 100px rgba(var(--shadow-rgb),calc(.36 * var(--shadow-k)));
}

body[data-inner-hero] .evidence-visual figcaption {
  display: block;
  min-height: 86px;
  padding: 22px 25px 20px;
  border-bottom: 1px solid rgba(var(--ink-rgb),.11);
  background: rgba(var(--ink-rgb),.012);
}

body[data-inner-hero] .evidence-visual figcaption span,
body[data-inner-hero] .evidence-visual figcaption strong {
  display: block;
}

body[data-inner-hero] .evidence-visual figcaption span {
  color: var(--inner-red-hot);
  font: 600 8px/1 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}

body[data-inner-hero] .evidence-visual figcaption strong {
  margin-top: 10px;
  color: var(--inner-text);
  font-size: .92rem;
  font-weight: 580;
}

body[data-inner-hero] .chain-scroll-figure {
  padding: 12px 24px;
}

body[data-inner-hero] .chain-figure-stage {
  position: relative;
  display: grid;
  grid-template-columns: minmax(150px, .75fr) minmax(250px, 1.5fr) minmax(150px, .8fr);
  gap: 18px;
  align-items: center;
  min-height: 124px;
  padding: 18px 0;
  border-top: 1px solid rgba(var(--ink-rgb),.085);
}

body[data-inner-hero] .chain-figure-stage:first-child {
  border-top: 0;
}

body[data-inner-hero] .chain-figure-stage::before {
  content: "";
  position: absolute;
  top: 26px;
  bottom: 26px;
  left: -24px;
  width: 2px;
  background: var(--inner-red);
  opacity: .2;
  transform: scaleY(.25);
  transform-origin: top center;
  transition: opacity .45s ease, transform .7s cubic-bezier(.16, 1, .3, 1);
}

body[data-inner-hero] .chain-figure-stage header b,
body[data-inner-hero] .chain-figure-stage header span,
body[data-inner-hero] .chain-figure-stage footer {
  display: block;
}

body[data-inner-hero] .chain-figure-stage header b {
  color: var(--inner-text);
  font-size: max(12.5px, .73rem);
  font-weight: 590;
}

body[data-inner-hero] .chain-figure-stage header span {
  margin-top: 8px;
  color: var(--inner-faint);
  font-size: max(12.5px, .58rem);
  line-height: 1.35;
}

body[data-inner-hero] .chain-figure-stage > div {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

body[data-inner-hero] .chain-figure-stage > div span {
  min-width: 0;
  padding: 9px 10px;
  color: var(--inner-muted);
  border: 1px solid rgba(var(--ink-rgb),.075);
  background: rgba(var(--ink-rgb),.012);
  font-size: max(12.5px, .57rem);
  line-height: 1.25;
}

body[data-inner-hero] .chain-figure-stage footer {
  padding: 12px;
  color: var(--inner-text);
  border-left: 2px solid rgba(199, 59, 63, .62);
  background: rgba(176, 38, 45, .07);
  font-size: max(12.5px, .61rem);
  line-height: 1.35;
}

body[data-inner-hero] .chain-source-line {
  display: grid;
  grid-template-columns: repeat(4, auto) 1fr;
  gap: 12px;
  align-items: center;
  min-height: 66px;
  padding: 14px 24px;
  border-top: 1px solid rgba(var(--ink-rgb),.11);
}

body[data-inner-hero] .chain-source-line span,
body[data-inner-hero] .chain-source-line b {
  font: 550 8px/1.2 var(--mono);
}

body[data-inner-hero] .chain-source-line span {
  color: var(--inner-faint);
}

body[data-inner-hero] .chain-source-line b {
  justify-self: end;
  color: var(--inner-red-hot);
}

body[data-inner-hero] .evidence-benchmark-visual .benchmark-layout {
  grid-template-columns: 210px minmax(0, 1fr);
  min-height: 600px;
}

body[data-inner-hero] .evidence-benchmark-visual .benchmark-board {
  padding: 22px 17px;
}

body[data-inner-hero] .evidence-benchmark-visual .benchmark-matrix {
  padding-top: 22px;
}

body[data-inner-hero] .evidence-benchmark-visual .benchmark-matrix > header {
  padding-inline: 18px;
}

body[data-inner-hero] .evidence-benchmark-visual .benchmark-scroll {
  height: 500px;
  padding: 0 18px 10px;
}

body[data-inner-hero] .evidence-benchmark-visual #mx-benchmark-grid {
  min-width: 730px;
  grid-template-columns: 185px repeat(18, minmax(20px, 1fr)) !important;
}

body[data-inner-hero] .evidence-benchmark-visual .benchmark-legend {
  padding: 12px 18px 16px;
}

body[data-inner-hero] .evidence-method-visual .evidence-method-layout {
  grid-template-columns: minmax(0, 1.15fr) minmax(240px, .75fr);
}

body[data-inner-hero] .evidence-method-visual .evidence-verification,
body[data-inner-hero] .evidence-method-visual .evidence-method-steps {
  padding: 23px 24px 25px;
}

body[data-inner-hero] .evidence-method-visual .verification-case {
  min-height: 170px;
}

body[data-inner-hero] .evidence-method-visual .evidence-method-config span {
  padding-inline: 10px;
}

body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .evidence-chapter-copy,
body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .evidence-visual {
  opacity: 0;
  will-change: transform, opacity;
}

body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .evidence-chapter-build .evidence-chapter-copy,
body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .evidence-chapter-learn .evidence-chapter-copy {
  transform: translate3d(-52px, 30px, 0);
}

body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .evidence-chapter-build .evidence-visual,
body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .evidence-chapter-learn .evidence-visual {
  transform: translate3d(58px, 34px, 0) scale(.985);
}

body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .evidence-chapter-measure .evidence-chapter-copy {
  transform: translate3d(52px, 30px, 0);
}

body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .evidence-chapter-measure .evidence-visual {
  transform: translate3d(-58px, 34px, 0) scale(.985);
}

body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .evidence-chapter.is-visible .evidence-chapter-copy,
body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .evidence-chapter.is-visible .evidence-visual {
  opacity: 1;
  transform: none;
  transition:
    opacity .75s cubic-bezier(.16, 1, .3, 1),
    transform .85s cubic-bezier(.16, 1, .3, 1);
}

body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .chain-figure-stage,
body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .mx-board-row,
body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .mx-bench-cell,
body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .verification-case,
body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .evidence-method-step {
  opacity: .12;
  transform: translate3d(0, 14px, 0);
}

body[data-inner-hero] .evidence-chapter.is-current .chain-figure-stage {
  opacity: 1;
  transform: none;
  transition:
    opacity .52s ease calc(var(--stage-index) * 100ms + 120ms),
    transform .65s cubic-bezier(.16, 1, .3, 1) calc(var(--stage-index) * 100ms + 120ms);
}

body[data-inner-hero] .evidence-chapter.is-current .chain-figure-stage::before {
  opacity: .9;
  transform: scaleY(1);
  transition-delay: calc(var(--stage-index) * 100ms + 220ms);
}

body[data-inner-hero] .evidence-chapter.is-current .mx-board-row {
  opacity: 1;
  transform: none;
  transition:
    opacity .42s ease calc(var(--row-index, 0) * 18ms + 100ms),
    transform .52s cubic-bezier(.16, 1, .3, 1) calc(var(--row-index, 0) * 18ms + 100ms);
}

body[data-inner-hero] .evidence-chapter.is-current .mx-bench-cell {
  opacity: 1;
  transform: none;
  transition:
    opacity .34s ease var(--cell-delay, 120ms),
    transform .44s cubic-bezier(.16, 1, .3, 1) var(--cell-delay, 120ms);
}

body[data-inner-hero] .evidence-chapter.is-current .verification-case,
body[data-inner-hero] .evidence-chapter.is-current .evidence-method-step {
  opacity: 1;
  transform: none;
  transition: opacity .52s ease, transform .62s cubic-bezier(.16, 1, .3, 1);
}

body[data-inner-hero] .evidence-chapter.is-current .verification-case:nth-child(2) {
  transition-delay: 90ms;
}

body[data-inner-hero] .evidence-chapter.is-current .evidence-method-step:nth-child(3) {
  transition-delay: 70ms;
}

body[data-inner-hero] .evidence-chapter.is-current .evidence-method-step:nth-child(4) {
  transition-delay: 140ms;
}

body[data-inner-hero] .evidence-chapter.is-current .evidence-method-step:nth-child(5) {
  transition-delay: 210ms;
}

body[data-inner-hero] .evidence-chapter.is-current .evidence-method-step:nth-child(6) {
  transition-delay: 280ms;
}

@media (max-width: 1100px) {
  body[data-inner-hero] .evidence-chapter,
  body[data-inner-hero] .evidence-chapter-measure {
    grid-template-columns: minmax(240px, .68fr) minmax(0, 1.32fr);
    gap: 42px;
  }

  body[data-inner-hero] .evidence-chapter-measure {
    grid-template-columns: minmax(0, 1.32fr) minmax(240px, .68fr);
  }

  body[data-inner-hero] .chain-figure-stage {
    grid-template-columns: 1fr;
    gap: 11px;
  }

  body[data-inner-hero] .chain-figure-stage > div {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  body[data-inner-hero] .evidence-chapter,
  body[data-inner-hero] .evidence-chapter-measure {
    grid-template-columns: 1fr;
    gap: 38px;
    min-height: 0;
    padding: 84px 0;
  }

  body[data-inner-hero] .evidence-chapter-copy {
    position: static;
    top: auto;
    order: 1;
    padding-top: 0;
  }

  body[data-inner-hero] .evidence-visual {
    order: 2;
  }

  body[data-inner-hero] .evidence-chapter-copy h3 {
    max-width: 10ch;
    font-size: clamp(2.65rem, 10vw, 4.7rem);
  }

  body[data-inner-hero] .evidence-chapter-copy > p {
    max-width: 44ch;
  }

  body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .evidence-chapter .evidence-chapter-copy,
  body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .evidence-chapter .evidence-visual {
    transform: translate3d(0, 28px, 0) scale(.99);
  }

  body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .evidence-chapter.is-visible .evidence-chapter-copy,
  body[data-inner-hero] .evidence-scroll-sequence.is-motion-ready .evidence-chapter.is-visible .evidence-visual {
    transform: none;
  }
}

@media (max-width: 620px) {
  body[data-inner-hero] .evidence-chapter {
    padding: 68px 0;
  }

  body[data-inner-hero] .evidence-chapter-label {
    margin-bottom: 22px;
  }

  body[data-inner-hero] .evidence-chapter-copy h3 {
    font-size: clamp(2.45rem, 12vw, 3.75rem);
  }

  body[data-inner-hero] .evidence-chapter-metrics {
    margin-top: 34px;
  }

  body[data-inner-hero] .evidence-visual {
    border-radius: 13px;
  }

  body[data-inner-hero] .chain-scroll-figure {
    padding: 6px 18px;
  }

  body[data-inner-hero] .chain-figure-stage {
    min-height: 0;
    padding: 19px 0;
  }

  body[data-inner-hero] .chain-figure-stage > div {
    grid-template-columns: 1fr 1fr;
  }

  body[data-inner-hero] .chain-figure-stage::before {
    left: -18px;
  }

  body[data-inner-hero] .chain-source-line {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    padding-inline: 18px;
  }

  body[data-inner-hero] .chain-source-line b {
    grid-column: 1 / -1;
    justify-self: start;
  }

  body[data-inner-hero] .evidence-benchmark-visual .benchmark-layout,
  body[data-inner-hero] .evidence-method-visual .evidence-method-layout {
    grid-template-columns: 1fr;
  }

  body[data-inner-hero] .evidence-benchmark-visual .benchmark-board,
  body[data-inner-hero] .evidence-method-visual .evidence-method-steps {
    border-right: 0;
    border-bottom: 1px solid rgba(var(--ink-rgb),.11);
  }

  body[data-inner-hero] .evidence-method-visual .evidence-method-steps {
    border-left: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  body[data-inner-hero] .evidence-scroll-sequence .evidence-chapter-copy,
  body[data-inner-hero] .evidence-scroll-sequence .evidence-visual,
  body[data-inner-hero] .evidence-scroll-sequence .chain-figure-stage,
  body[data-inner-hero] .evidence-scroll-sequence .mx-board-row,
  body[data-inner-hero] .evidence-scroll-sequence .mx-bench-cell,
  body[data-inner-hero] .evidence-scroll-sequence .verification-case,
  body[data-inner-hero] .evidence-scroll-sequence .evidence-method-step {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* Platform portfolio: real systems replace generic capability cards. */
body[data-inner-hero] .platform-portfolio {
  margin-top: clamp(90px, 11vw, 168px);
  padding-top: clamp(72px, 8vw, 118px);
  border-top: 1px solid var(--inner-line);
}

body[data-inner-hero] #framework,
body[data-inner-hero] #capabilities,
body[data-inner-hero] #microbecollect,
body[data-inner-hero] #microbehte,
body[data-inner-hero] #microbeatp,
body[data-inner-hero] #evidence,
body[data-inner-hero] #results {
  scroll-margin-top: calc(var(--nav-h) + 22px);
}

body[data-inner-hero] .platform-portfolio-list {
  position: relative;
  border-top: 1px solid rgba(199, 59, 63, .34);
}

body[data-inner-hero] .platform-entry {
  display: grid;
  grid-template-columns: minmax(270px, .64fr) minmax(0, 1.36fr);
  gap: clamp(38px, 5vw, 76px);
  align-items: center;
  min-height: 720px;
  padding: clamp(84px, 9vw, 136px) 0;
  border-bottom: 1px solid var(--inner-line);
  opacity: .32;
  transform: translate3d(0, 34px, 0) scale(.988);
  transition:
    opacity .72s cubic-bezier(.16, 1, .3, 1),
    transform .86s cubic-bezier(.16, 1, .3, 1);
}

body[data-inner-hero] .platform-entry-hte {
  grid-template-columns: minmax(0, 1.36fr) minmax(270px, .64fr);
}

body[data-inner-hero] .platform-entry.is-inview {
  opacity: 1;
  transform: none;
}

body[data-inner-hero] .platform-entry-copy {
  min-width: 0;
}

body[data-inner-hero] .platform-entry-kind {
  display: block;
  margin-bottom: 25px;
  color: var(--inner-red-hot);
  font: 600 .67rem/1.2 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

body[data-inner-hero] .platform-entry h3 {
  margin: 0;
  color: var(--inner-text);
  font-size: clamp(3rem, 5vw, 5.6rem);
  font-weight: 550;
  letter-spacing: -.07em;
  line-height: .92;
}

body[data-inner-hero] .platform-entry-lead {
  max-width: 35ch;
  margin: 30px 0 0;
  color: var(--inner-text);
  font-size: clamp(1.02rem, 1.35vw, 1.3rem);
  line-height: 1.52;
}

body[data-inner-hero] .platform-entry-note {
  max-width: 46ch;
  margin: 30px 0 0;
  padding-left: 16px;
  color: var(--inner-muted);
  border-left: 2px solid var(--inner-red);
  font-size: max(12.5px, .78rem);
  line-height: 1.6;
}

body[data-inner-hero] .platform-entry-link {
  margin-top: 26px;
}

body[data-inner-hero] .platform-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  margin: 44px 0 0;
  padding-top: 20px;
  border-top: 1px solid var(--inner-line);
}

body[data-inner-hero] .platform-metrics div,
body[data-inner-hero] .platform-metrics dt,
body[data-inner-hero] .platform-metrics dd {
  min-width: 0;
  margin: 0;
}

body[data-inner-hero] .platform-metrics dt {
  color: var(--inner-text);
  font: 560 clamp(1.28rem, 2.1vw, 2.3rem)/1 var(--mono);
  letter-spacing: -.05em;
}

body[data-inner-hero] .platform-metrics dd {
  max-width: 12ch;
  margin-top: 10px;
  color: var(--inner-faint);
  font-size: max(12.5px, .62rem);
  line-height: 1.35;
}

body[data-inner-hero] .platform-entry-media {
  --platform-x: 50%;
  --platform-y: 40%;
  position: relative;
  min-width: 0;
  overflow: hidden;
  margin: 0;
  border: 1px solid rgba(var(--ink-rgb),.14);
  border-radius: 16px;
  background: rgb(var(--ground-3-rgb));
  box-shadow:
    inset 0 1px 0 rgba(var(--ink-rgb),.04),
    0 30px 90px rgba(var(--shadow-rgb),calc(.34 * var(--shadow-k)));
  transition:
    border-color .45s ease,
    box-shadow .45s ease,
    transform .7s cubic-bezier(.16, 1, .3, 1);
}

body[data-inner-hero] .platform-entry-media::after {
  content: "";
  position: absolute;
  inset: 0 0 48px;
  pointer-events: none;
  background:
    radial-gradient(circle at var(--platform-x) var(--platform-y), rgba(199, 59, 63, .13), transparent 31%),
    linear-gradient(180deg, rgba(var(--ground-rgb),.02), transparent 68%, rgba(var(--ground-rgb),.2));
  opacity: .58;
  transition: opacity .45s ease;
}

body[data-inner-hero] .platform-entry.is-current .platform-entry-media {
  border-color: rgba(199, 59, 63, .46);
  box-shadow:
    inset 0 1px 0 rgba(var(--ink-rgb),.05),
    0 40px 110px rgba(var(--shadow-rgb),calc(.44 * var(--shadow-k)));
  transform: translate3d(0, -4px, 0);
}

body[data-inner-hero] .platform-entry-media video {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: rgb(var(--ground-2-rgb));
  filter: saturate(.84) contrast(1.04);
  transform: scale(1.002);
  transition:
    filter .65s ease,
    transform 1.1s cubic-bezier(.16, 1, .3, 1);
}

body[data-inner-hero] .platform-entry-collect .platform-entry-media video,
body[data-inner-hero] .platform-entry-hte .platform-entry-media video {
  object-fit: contain;
}

body[data-inner-hero] .platform-entry.is-current .platform-entry-media video {
  filter: saturate(.98) contrast(1.02);
  transform: scale(1.018);
}

body[data-inner-hero] .platform-entry-media figcaption {
  position: relative;
  z-index: 1;
  min-height: 48px;
  padding: 16px 20px;
  color: var(--inner-faint);
  border-top: 1px solid var(--inner-line);
  background: rgba(var(--ground-3-rgb),.96);
  font: 560 .61rem/1.2 var(--mono);
  letter-spacing: .06em;
  text-transform: uppercase;
}

body[data-inner-hero] .platform-function-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 42px 0 0;
  padding: 0;
  list-style: none;
}

body[data-inner-hero] .platform-function-list li {
  min-height: 104px;
  padding: 18px;
  border: 1px solid rgba(var(--ink-rgb),.1);
  background: rgba(var(--ink-rgb),.014);
}

body[data-inner-hero] .platform-function-list b,
body[data-inner-hero] .platform-function-list span {
  display: block;
}

body[data-inner-hero] .platform-function-list b {
  color: var(--inner-text);
  font-size: max(12.5px, .74rem);
  font-weight: 580;
}

body[data-inner-hero] .platform-function-list span {
  margin-top: 9px;
  color: var(--inner-faint);
  font-size: max(12.5px, .61rem);
  line-height: 1.42;
}

body[data-inner-hero] .platform-loop {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin: 42px 0 0;
  padding: 0;
  border-top: 1px solid var(--inner-line);
  list-style: none;
}

body[data-inner-hero] .platform-loop li {
  position: relative;
  min-width: 0;
  padding: 18px 8px 0 0;
  color: var(--inner-muted);
  font: 550 .62rem/1.35 var(--mono);
}

body[data-inner-hero] .platform-loop li::before {
  content: "";
  display: block;
  width: 7px;
  height: 7px;
  margin: -22px 0 17px;
  border: 1px solid var(--inner-red-hot);
  border-radius: 50%;
  background: var(--inner-bg);
  transition: background .35s ease, transform .35s ease;
}

body[data-inner-hero] .platform-entry.is-current .platform-loop li::before {
  background: var(--inner-red);
  transform: scale(1.15);
  transition-delay: calc(var(--loop-index, 0) * 80ms);
}

body[data-inner-hero] .platform-loop li:nth-child(1) { --loop-index: 0; }
body[data-inner-hero] .platform-loop li:nth-child(2) { --loop-index: 1; }
body[data-inner-hero] .platform-loop li:nth-child(3) { --loop-index: 2; }
body[data-inner-hero] .platform-loop li:nth-child(4) { --loop-index: 3; }
body[data-inner-hero] .platform-loop li:nth-child(5) { --loop-index: 4; }

/* Tools directory: one landing page, then one focused page per module. */
body[data-page="platforms"] .tools-directory-section,
body[data-page="tool"] .tool-detail-section {
  padding-top: clamp(86px, 10vw, 142px);
}

body[data-page="tool"] .tool-detail-grid {
  display: grid;
  grid-template-columns: minmax(170px, .26fr) minmax(0, 1fr);
  gap: clamp(38px, 7vw, 112px);
  align-items: start;
}

body[data-page="tool"] .tool-detail-rail {
  position: sticky;
  top: 116px;
}

body[data-page="platforms"] .tools-theme-list {
  display: grid;
  gap: clamp(54px, 7vw, 92px);
}

body[data-page="platforms"] .tool-theme-group {
  padding-top: clamp(20px, 2.4vw, 32px);
  border-top: 1px solid var(--inner-line);
}

body[data-page="platforms"] .tool-theme-header {
  display: grid;
  gap: 9px;
  margin-bottom: clamp(22px, 3vw, 36px);
}

body[data-page="platforms"] .tool-theme-title {
  margin: 0;
  color: var(--inner-text);
  font-size: clamp(1.55rem, 2.4vw, 2.4rem);
  font-weight: 570;
  letter-spacing: -.04em;
  line-height: 1.05;
}

body[data-page="platforms"] .tool-theme-note {
  max-width: 48ch;
  margin: 0;
  color: var(--inner-muted);
  font-size: .82rem;
  line-height: 1.6;
}

body[data-page="platforms"] .tool-theme-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(14px, 1.7vw, 24px);
}

body[data-page="platforms"] .tools-directory-intro {
  max-width: 680px;
  margin-bottom: clamp(42px, 6vw, 76px);
}

body[data-page="platforms"] .tools-directory-intro h1 {
  max-width: 12ch;
  margin: 12px 0 18px;
  color: var(--inner-text);
  font-size: clamp(2.7rem, 5.6vw, 5.6rem);
  font-weight: 540;
  letter-spacing: -.065em;
  line-height: .94;
}

body[data-page="platforms"] .tools-directory-intro p {
  max-width: 50ch;
  color: var(--inner-muted);
  font-size: .95rem;
  line-height: 1.65;
}

body[data-page="platforms"] .tool-card {
  position: relative;
  min-height: clamp(210px, 20vw, 286px);
  padding: clamp(26px, 3.2vw, 44px);
  border: 1px solid var(--inner-line);
  border-radius: 14px;
  background: rgba(var(--ink-rgb), .025);
  color: var(--inner-text);
  transition: border-color .25s ease, background .25s ease, transform .25s ease;
}

body[data-page="platforms"] .tool-card:hover,
body[data-page="platforms"] .tool-card:focus-visible {
  border-color: var(--inner-red-hot);
  background: rgba(var(--ink-rgb), .055);
  transform: translateY(-3px);
  outline: none;
}

body[data-page="platforms"] .tool-card h3 {
  margin: clamp(22px, 3vw, 38px) 0 12px;
  font-size: clamp(1.65rem, 2.7vw, 2.8rem);
  letter-spacing: -.04em;
}

body[data-page="platforms"] .tool-card p {
  max-width: 32ch;
  color: var(--inner-muted);
  font-size: 16.5px;
  line-height: 1.55;
}

body[data-page="platforms"] .tool-card i {
  position: absolute;
  right: clamp(26px, 3.2vw, 44px);
  bottom: clamp(24px, 3vw, 40px);
  color: var(--inner-red-hot);
  font-style: normal;
  font-size: 1.2rem;
}

body[data-page="platforms"] .tool-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  align-items: baseline;
}

body[data-page="platforms"] .tool-card-kind {
  color: var(--inner-red-hot);
  font: 600 14.5px/1.2 var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
}

body[data-page="tool"] .tool-card-kind {
  color: var(--inner-red-hot);
  font: 600 .66rem/1.2 var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
}

body[data-page="tool"] .back-link {
  display: inline-block;
  margin-bottom: 28px;
  color: var(--inner-muted);
  font-size: .8rem;
}

body[data-page="tool"] .back-link:hover { color: var(--inner-text); }

body[data-page="tool"] .tool-detail-nav {
  display: grid;
  gap: 26px;
  padding-left: 18px;
  border-left: 1px solid var(--inner-line);
}

body[data-page="tool"] .tool-detail-nav-group {
  display: grid;
  gap: 5px;
}

body[data-page="tool"] .tool-detail-nav-label {
  margin-bottom: 5px;
  color: var(--inner-red-hot);
  font: 600 .66rem/1.2 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}

body[data-page="tool"] .tool-detail-nav-link {
  color: var(--inner-muted);
  font-size: .88rem;
  line-height: 1.35;
}

body[data-page="tool"] .tool-detail-nav-link:hover,
body[data-page="tool"] .tool-detail-nav-link.is-current { color: var(--inner-text); }

body[data-page="tool"] .tool-detail-nav-link.is-current { font-weight: 650; }

body[data-page="tool"] .tool-detail-copy {
  max-width: none;
  padding-bottom: 80px;
}

body[data-page="tool"] .tool-detail-title {
  max-width: 11ch;
  margin: 18px 0 26px;
  color: var(--inner-text);
  font-size: clamp(3.2rem, 7vw, 7.4rem);
  font-weight: 540;
  letter-spacing: -.075em;
  line-height: .9;
}

body[data-page="tool"] .tool-detail-lede {
  max-width: 38ch;
  color: var(--inner-muted);
  font-size: clamp(1.15rem, 2vw, 1.55rem);
  line-height: 1.45;
}

body[data-page="tool"] .tool-detail-interactive {
  width: 100%;
  margin-top: 52px;
}

body[data-page="tool"] .tool-detail-interactive .evidence-scroll-sequence {
  margin-top: 0;
}

body[data-page="tool"] .tool-detail-figure {
  margin: 48px 0 0;
  padding: 10px;
  border: 1px solid var(--inner-line);
  border-radius: 16px;
  background: var(--inner-raised);
}

body[data-page="tool"] .tool-detail-figure img {
  width: 100%;
  border-radius: 10px;
  background: #070707;
}

body[data-page="tool"] .tool-detail-figure figcaption {
  padding: 12px 6px 2px;
  color: var(--inner-muted);
  font: 600 .66rem/1.4 var(--mono);
  letter-spacing: .06em;
  text-transform: uppercase;
}

body[data-page="tool"] .tool-detail-rule {
  width: 100%;
  margin: 54px 0 28px;
  border-top: 1px solid var(--inner-line);
}

body[data-page="tool"] .tool-detail-body {
  max-width: 48ch;
  color: var(--inner-muted);
  font-size: .95rem;
  line-height: 1.7;
}

body[data-page="tool"] .tool-detail-actions { margin-top: 32px; }

/* Research overview: questions live with directions, not in a duplicate card grid. */
body[data-page="research"] .research-focus-section [data-render="research-list"] {
  border-top: 1px solid rgba(199, 59, 63, .34);
}

body[data-page="research"] .research-overview-intro {
  max-width: 72ch;
  padding: clamp(34px, 4.5vw, 62px) 0 clamp(30px, 4vw, 52px);
  border-bottom: 1px solid var(--inner-line);
}

body[data-page="research"] .research-overview-intro h2 {
  margin: 0 0 clamp(12px, 1.2vw, 18px);
  color: var(--inner-red-hot);
  font: 600 clamp(.78rem, .95vw, 1rem)/1.2 var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
}

body[data-page="research"] .research-overview-intro p {
  max-width: 68ch;
  margin: 0;
  color: var(--inner-text);
  font-size: clamp(1.08rem, 1.55vw, 1.45rem);
  line-height: 1.65;
}

html[lang="zh"] body[data-page="research"] .research-overview-intro p {
  line-height: 1.85;
  letter-spacing: .01em;
}

/* The manganese direction uses the supplied mechanism-and-cover composite as
   one figure. The page remains white around it; the source artwork keeps its
   dark figure ground. */
body[data-inner-hero] .direction-mosaic {
  display: block;
  aspect-ratio: 2.37 / 1;
  align-self: start;
  min-width: 0;
  min-height: 0;
  margin: 0;
  overflow: hidden;
  background: var(--inner-raised);
  border-radius: var(--r-sm);
}

body[data-inner-hero] .direction-mosaic-panel {
  position: relative;
  overflow: hidden;
  height: 100%;
  aspect-ratio: auto;
  min-width: 0;
  min-height: 0;
  background: #14100F;
  border-radius: var(--r-sm);
  box-shadow:
    0 2px 4px rgba(20,16,15,.06),
    0 18px 44px -22px rgba(20,16,15,.34);
}

body[data-inner-hero] .direction-mosaic-model {
  width: 100%;
  height: 100%;
}

body[data-inner-hero] .direction-mosaic-panel img {
  position: absolute;
  inset: 0;
  display: block;
  filter: none;
  transition: transform .8s var(--ease-out);
}

body[data-inner-hero] .direction-mosaic-model img {
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

body[data-inner-hero] .direction-mosaic:hover .direction-mosaic-panel img {
  transform: scale(1.015);
}

/* Keep the Join Us group photo intact and anchor it to the right side. */
body[data-inner-hero="join"] .phero::before {
  background-position: right center;
  background-size: contain;
  background-repeat: no-repeat;
  transform: none;
  opacity: 1;
  -webkit-mask-image: linear-gradient(90deg, transparent 46%, rgba(0,0,0,.58) 56%, rgba(0,0,0,.9) 66%, #000 76%);
  mask-image: linear-gradient(90deg, transparent 46%, rgba(0,0,0,.58) 56%, rgba(0,0,0,.9) 66%, #000 76%);
}

body[data-inner-hero="join"] .phero::after {
  background:
    linear-gradient(90deg, rgba(var(--ground-rgb),.98) 0%, rgba(var(--ground-rgb),.86) 34%, rgba(var(--ground-rgb),.34) 58%, rgba(var(--ground-rgb),.06) 82%, rgba(var(--ground-rgb),.08) 100%),
    linear-gradient(0deg, rgba(var(--ground-rgb),.36) 0%, transparent 42%, rgba(var(--ground-rgb),.18) 100%);
}

body[data-page="research"] .research-overview-grid {
  display: grid;
  grid-template-columns: minmax(250px, .28fr) minmax(0, 1fr);
  gap: clamp(34px, 5.6vw, 88px);
  align-items: start;
}

body[data-page="research"] .research-direction-rail {
  position: sticky;
  top: 116px;
  padding-top: 42px;
}

body[data-page="research"] .research-direction-nav {
  display: grid;
  margin-top: 22px;
  border-left: 1px solid var(--inner-line);
}

body[data-page="research"] .research-direction-link {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 12px;
  align-items: baseline;
  width: 100%;
  padding: 15px 12px 15px 18px;
  border: 0;
  border-left: 2px solid transparent;
  background: transparent;
  color: var(--inner-muted);
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition: border-color .25s ease, color .25s ease, background .25s ease;
}

body[data-page="research"] .research-direction-link:hover,
body[data-page="research"] .research-direction-link:focus-visible {
  color: var(--inner-text);
  background: rgba(var(--ink-rgb), .035);
  outline: none;
}

body[data-page="research"] .research-direction-link[aria-selected="true"] {
  border-left-color: var(--inner-red-hot);
  color: var(--inner-text);
}

body[data-page="research"] .research-direction-index {
  color: var(--inner-red-hot);
  font: 600 .66rem/1.2 var(--mono);
  letter-spacing: .08em;
}

body[data-page="research"] .research-direction-name {
  font-size: .9rem;
  font-weight: 620;
  line-height: 1.3;
  white-space: nowrap;
}

body[data-page="research"] .research-direction-panels > [hidden] {
  display: none !important;
}

body[data-page="research"] .focus-row {
  grid-template-areas: "visual question";
  align-items: center;
  min-height: 580px;
  padding: clamp(58px, 7vw, 92px) 0;
}

body[data-page="research"] .focus-row:nth-child(even) {
  grid-template-areas: "question visual";
}

body[data-page="research"] .focus-row > div:first-child {
  grid-area: visual;
}

body[data-page="research"] .focus-row > div:last-child {
  grid-area: question;
}

body[data-page="research"] .focus-question-label {
  display: block;
  margin-bottom: 24px;
  color: var(--inner-red-hot);
  font: 600 .66rem/1.2 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

body[data-page="research"] .focus-question {
  max-width: 15ch;
  margin: 0 0 28px;
  color: var(--inner-text);
  font-size: clamp(1.65rem, 2.5vw, 2.85rem);
  font-weight: 540;
  letter-spacing: -.04em;
  line-height: 1.08;
}

body[data-page="research"] .focus-row .body-txt {
  max-width: 44ch;
  font-size: .9rem;
  line-height: 1.62;
}

body[data-page="research"] .focus-row .fjudge {
  max-width: 38ch;
  margin-top: 24px;
  padding-left: 16px;
  border-left: 2px solid var(--inner-red);
  font-size: .92rem;
}

body[data-page="research"] .research-focus-motion [data-research-focus] {
  opacity: .28;
  transform: translate3d(0, 32px, 0) scale(.99);
  transition:
    opacity .7s cubic-bezier(.16, 1, .3, 1),
    transform .85s cubic-bezier(.16, 1, .3, 1);
}

body[data-page="research"] .research-focus-motion [data-research-focus].is-inview {
  opacity: 1;
  transform: none;
}

body[data-page="research"] .research-focus-motion [data-research-focus]:not(.is-current) .focus-media img {
  filter: saturate(.55) contrast(1.1);
}

@media (max-width: 900px) {
  body[data-page="tool"] .tool-detail-grid {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  body[data-page="tool"] .tool-detail-rail {
    position: static;
  }

  body[data-page="tool"] .tool-detail-nav {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    padding: 18px 0 0;
    border-top: 1px solid var(--inner-line);
    border-left: 0;
  }

  body[data-page="research"] .research-overview-grid {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  body[data-page="research"] .research-direction-rail {
    position: static;
    padding-top: 0;
  }

  body[data-page="research"] .research-direction-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-top: 1px solid var(--inner-line);
    border-left: 0;
  }

  body[data-page="research"] .research-direction-link {
    grid-template-columns: 1fr;
    gap: 7px;
    padding: 15px 12px 15px 0;
    border-top: 2px solid transparent;
    border-left: 0;
  }

  body[data-page="research"] .research-direction-name {
    white-space: normal;
  }

  body[data-page="research"] .research-direction-link[aria-selected="true"] {
    border-top-color: var(--inner-red-hot);
  }

  body[data-inner-hero] .platform-entry,
  body[data-inner-hero] .platform-entry-hte {
    grid-template-columns: 1fr;
    gap: 42px;
    min-height: 0;
    padding: 86px 0;
  }

  body[data-inner-hero] .platform-entry-copy {
    order: 1;
  }

  body[data-inner-hero] .platform-entry-media {
    order: 2;
  }

  body[data-page="research"] .focus-row,
  body[data-page="research"] .focus-row:nth-child(even) {
    grid-template-areas:
      "visual"
      "question";
    min-height: 0;
  }
}

@media (max-width: 620px) {
  body[data-page="platforms"] .tool-theme-grid {
    grid-template-columns: 1fr;
  }

  body[data-page="tool"] .tool-detail-nav {
    grid-template-columns: 1fr;
  }

  body[data-page="research"] .research-direction-nav {
    grid-template-columns: 1fr;
  }

  body[data-page="research"] .research-direction-link {
    grid-template-columns: 30px minmax(0, 1fr);
    align-items: baseline;
    padding: 13px 10px 13px 0;
  }

  body[data-inner-hero] .platform-entry {
    gap: 34px;
    padding: 68px 0;
  }

  body[data-inner-hero] .platform-entry h3 {
    font-size: clamp(2.7rem, 13vw, 4.2rem);
  }

  body[data-inner-hero] .platform-metrics {
    gap: 12px;
  }

  body[data-inner-hero] .platform-metrics dt {
    font-size: clamp(1.14rem, 5vw, 1.55rem);
  }

  body[data-inner-hero] .platform-function-list {
    grid-template-columns: 1fr;
  }

  body[data-inner-hero] .platform-loop {
    grid-template-columns: 1fr;
    gap: 0;
    border-top: 0;
    border-left: 1px solid var(--inner-line);
  }

  body[data-inner-hero] .platform-loop li {
    padding: 0 0 22px 22px;
  }

  body[data-inner-hero] .platform-loop li::before {
    position: absolute;
    top: 3px;
    left: -4px;
    margin: 0;
  }

  body[data-inner-hero] .platform-entry-media {
    border-radius: 13px;
  }

  body[data-page="research"] .focus-row {
    min-height: 0;
    padding: 56px 0;
  }

  body[data-page="research"] .focus-question {
    font-size: clamp(1.45rem, 7vw, 2.25rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  body[data-inner-hero] .platform-entry,
  body[data-inner-hero] .platform-entry-media,
  body[data-inner-hero] .platform-entry-media video,
  body[data-page="research"] .research-focus-motion [data-research-focus] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* GitHub: the whole page is the statement plus one destination, and both
   live in the first screen. No section follows. */
body[data-page="github"] .github-cta {
  margin-top: clamp(26px, 3.2vw, 40px);
}

/* ============================================================
   RESEARCH DIRECTION · OPENING
   The big question is the page's thesis, so it is set at display
   size across the full measure rather than as body copy inside
   the reference column.
   ============================================================ */
body[data-page="research"] .dir-opening-sec{
  padding-bottom:0;
}
body[data-page="research"] .dir-detail-sec{
  padding-top:clamp(48px,5vw,84px);
}

.dir-label{
  display:block;
  margin-bottom:clamp(18px,2vw,26px);
  color:var(--signal-red);
  font-family:var(--mono);
  font-size:12.5px;
  font-weight:600;
  letter-spacing:.2em;
  text-transform:uppercase;
}

/* --- the question --- */
.dir-question{
  position:relative;
  padding-left:clamp(20px,2.4vw,34px);
}
/* a rule that draws down beside the question as it arrives */
.dir-question::before{
  content:"";
  position:absolute;
  left:0;top:4px;bottom:4px;
  width:2px;
  background:linear-gradient(180deg,var(--signal-red),rgba(199,59,63,0));
  transform:scaleY(0);
  transform-origin:0 0;
  transition:transform 1.1s var(--ease-out) .12s;
}
.motion-ready .dir-question.in::before{transform:scaleY(1)}

.dir-question-text{
  margin:0;
  /* The measure lives here, not on the wrapper: `em` resolves against the
     element's own size, and the wrapper is still at body size. `em` rather
     than `ch` because ch is the width of a Latin "0" — a ch measure
     collapses to three glyphs per line once the type is Chinese. */
  max-width:min(17em, 100%);
  font-family:var(--inner-display);
  font-size:clamp(2rem,3.9vw,3.7rem);
  font-weight:570;
  line-height:1.1;
  letter-spacing:-.038em;
  color:var(--inner-text);
  text-wrap:balance;
  /* wipes in from the left instead of only fading — reads as being written,
     and survives any line wrapping, which a per-line mask would not */
  clip-path:inset(0 100% 0 0);
  transition:clip-path 1.15s var(--ease-out) .1s;
}
.motion-ready .dir-question.in .dir-question-text{clip-path:inset(0 0 0 0)}

/* --- what is at stake: the site's head grid, so it lines up with
       every other section on the site --- */
.dir-stake{
  display:grid;
  grid-template-columns:minmax(0,.38fr) minmax(0,.62fr);
  gap:clamp(22px,5vw,76px);
  /* the label is one line against a paragraph of three or four, so top
     alignment left it stranded at the top of an otherwise empty column */
  align-items:center;
  margin-top:clamp(52px,6vw,96px);
  /* Symmetric, because the rule below this band is the next section's border
     and it sits flush against this box's bottom edge. With padding only on top,
     the copy had 45px above it and nothing below — centred within its own row
     but pushed to the floor of the band the reader actually sees. */
  padding-block:clamp(28px,3vw,44px);
  border-top:1px solid var(--inner-line);
}
.dir-stake .dir-label{margin-bottom:0}
.dir-stake-text{
  margin:0;
  max-width:min(56ch, 34em);
  color:var(--inner-muted);
  font-size:clamp(1rem,1.2vw,1.16rem);
  line-height:1.72;
}

@media(max-width:900px){
  .dir-question{max-width:none}
  .dir-stake{grid-template-columns:1fr;gap:16px}
}
@media(prefers-reduced-motion:reduce){
  .dir-question-text{clip-path:none!important;transition:none!important}
  .dir-question::before{transform:scaleY(1)!important;transition:none!important}
}

/* ============================================================
   SURFACES ON THE DARK PAGES
   inner-v2 loads after system.css and used to repaint every card
   with an opaque `--inner-raised`, which cancelled the shared
   glass. These re-point the same components at the surface tokens
   so one definition governs both grounds.
   ============================================================ */
body[data-inner-hero] .grid2,
body[data-inner-hero] .grid3,
body[data-inner-hero] .grid4,
body[data-inner-hero] .t2,
body[data-inner-hero] .tax,
body[data-inner-hero] .resz,
body[data-inner-hero] .member-grid,
body[data-inner-hero] .roles,
body[data-inner-hero] .newsgrid,
body[data-inner-hero] .featpub,
body[data-inner-hero] .loop-steps,
body[data-inner-hero] .pd-side {
  background: none;
  border: 0;
  border-radius: 0;
}

body[data-inner-hero] .cell,
body[data-inner-hero] .pcard2,
body[data-inner-hero] .prow,
body[data-inner-hero] .pd-side .sblock,
body[data-inner-hero] .out,
body[data-inner-hero] .fmstep,
body[data-inner-hero] .fp,
body[data-inner-hero] .loop-steps > * {
  color: var(--inner-text);
  background: var(--surface-fill);
  border: 1px solid var(--surface-line);
  border-radius: var(--r-sm);
}
body[data-inner-hero] .fp { border-radius: var(--r-md); }

body[data-inner-hero] a.cell:hover,
body[data-inner-hero] .pcard2:hover,
body[data-inner-hero] a.prow:hover,
body[data-inner-hero] .fp:hover {
  background: var(--surface-fill-hover);
  border-color: var(--surface-line-hover);
}

/* the outline button was a hard 1px box on black */
body[data-inner-hero] .btn-line {
  border-color: var(--surface-line);
  background: var(--surface-fill);
  color: var(--inner-text);
}
body[data-inner-hero] .btn-line:hover {
  border-color: var(--surface-line-hover);
  background: var(--surface-fill-hover);
  color: var(--inner-text);
}

/* ---- fewer rules ---------------------------------------------------------
   Every list item and every block carried its own hairline, so a page of
   four sections and a dozen bullets drew twenty lines. Bullets are separated
   by space and their marker; blocks keep one rule between them, not one
   under each. -------------------------------------------------------------- */
body[data-inner-hero] .bullets{gap:clamp(4px,.5vw,8px)}
body[data-inner-hero] .bullets li{
  padding:11px 0 11px 22px;
  border-bottom:0;
}
body[data-inner-hero] .bullets li::before{top:21px}

body[data-inner-hero] .pd-block{
  padding-bottom:clamp(18px,2.2vw,30px);
  border-bottom:0;
}
body[data-inner-hero] .pd-block + .pd-block{
  padding-top:clamp(18px,2.2vw,30px);
  border-top:1px solid color-mix(in srgb, var(--inner-line) 62%, transparent);
}
body.profile-page .pd-block .lbl{margin-bottom:8px}
body.profile-page .pd-block .body-txt{line-height:1.45}
html[lang="zh"] body.profile-page .pd-block .body-txt{line-height:1.55}

/* the last components still on the old 2–6px radii */
body[data-inner-hero] .chip,
body[data-inner-hero] .chip.inline{border-radius:var(--r-xs)}
body[data-inner-hero] .focus-media{border-radius:var(--r-md)}
body[data-inner-hero] .public-result-media,
body[data-inner-hero] .pcard1,
body[data-inner-hero] .pcard1 .media{border-radius:var(--r-md)}
body[data-inner-hero] .portrait,
body[data-inner-hero] .mphoto{border-radius:var(--r-md);overflow:hidden}

/* last of the square components */
body[data-inner-hero] .proj-lead{
  border-radius:var(--r-md);
  border:1px solid var(--surface-line);
  background:var(--surface-fill);
  overflow:hidden;
}
body[data-inner-hero] .badge,
body[data-inner-hero] .badge-role,
body[data-inner-hero] .badge-pending,
body[data-inner-hero] .vbadge{border-radius:var(--r-xs)}

/* Frameless glass on the dark pages too — these rules previously re-drew the
   1px border that the shared system has now dropped. */
body[data-inner-hero] .cell,
body[data-inner-hero] .pcard2,
body[data-inner-hero] .prow,
body[data-inner-hero] .pd-side .sblock,
body[data-inner-hero] .out,
body[data-inner-hero] .fmstep,
body[data-inner-hero] .fp,
body[data-inner-hero] .acc,
body[data-inner-hero] .proj-lead,
body[data-inner-hero] .btn-line,
body[data-inner-hero] .loop-steps > * {
  border: 0;
  background: var(--surface-fill);
  box-shadow: var(--surface-shadow);
  -webkit-backdrop-filter: blur(var(--surface-blur)) saturate(1.12);
  backdrop-filter: blur(var(--surface-blur)) saturate(1.12);
}
body[data-inner-hero] a.cell:hover,
body[data-inner-hero] .pcard2:hover,
body[data-inner-hero] a.prow:hover,
body[data-inner-hero] .fp:hover,
body[data-inner-hero] .btn-line:hover {
  background: var(--surface-fill-hover);
  box-shadow: var(--surface-shadow-hover);
}
body[data-inner-hero] .mega {
  background: color-mix(in srgb, var(--inner-raised) 88%, transparent);
}

/* the member card was the last drawn frame */
body[data-inner-hero] .mcard{
  border:0;
  border-radius:var(--r-sm);
  background:var(--surface-fill);
  box-shadow:var(--surface-shadow);
  -webkit-backdrop-filter:blur(var(--surface-blur)) saturate(1.12);
  backdrop-filter:blur(var(--surface-blur)) saturate(1.12);
  overflow:hidden;
}
body[data-inner-hero] .mcard:hover{
  background:var(--surface-fill-hover);
  box-shadow:var(--surface-shadow-hover);
}

/* ============================================================
   METHODS · THE EVIDENCE SEQUENCE
   These three chapters are one process — build evidence, measure
   performance, learn from verification — but they alternated
   left/right, so the eye zigzagged and they read as three
   unrelated slabs. They now run in one direction with a numbered
   thread down the side, which is what a sequence looks like.
   The 920px floor and the 150px inner padding also fought each
   other: cramped inside, sprawling between. Both are relaxed.
   ============================================================ */
body[data-inner-hero] .evidence-scroll-sequence{
  position:relative;
}
/* the thread the three steps hang from */
body[data-inner-hero] .evidence-scroll-sequence::before{
  content:"";
  position:absolute;
  left:0;
  top:clamp(70px,7vw,110px);
  bottom:clamp(70px,7vw,110px);
  width:1px;
  background:linear-gradient(180deg,
    rgba(199,59,63,.5),
    color-mix(in srgb, var(--inner-line) 70%, transparent) 22%,
    color-mix(in srgb, var(--inner-line) 70%, transparent) 78%,
    transparent);
}

body[data-inner-hero] .evidence-chapter,
body[data-inner-hero] .evidence-chapter-measure{
  /* one direction for all three */
  grid-template-columns:minmax(300px,.78fr) minmax(0,1.32fr);
  gap:clamp(40px,4.6vw,76px);
  min-height:0;
  padding:clamp(62px,6.4vw,96px) 0 clamp(62px,6.4vw,96px) clamp(30px,3.4vw,58px);
  border-top:1px solid color-mix(in srgb, var(--inner-line) 55%, transparent);
}
body[data-inner-hero] .evidence-chapter:first-child{
  border-top:0;
}

/* step number, sitting on the thread */
body[data-inner-hero] .evidence-chapter{counter-increment:evstep}
body[data-inner-hero] .evidence-scroll-sequence{counter-reset:evstep}
body[data-inner-hero] .evidence-chapter::before{
  content:counter(evstep,decimal-leading-zero);
  position:absolute;
  left:0;
  transform:translateX(-50%);
  margin-top:2px;
  padding:6px 0;
  width:30px;
  text-align:center;
  background:var(--inner-bg);
  font-family:var(--mono);
  font-size:12.5px;
  letter-spacing:.1em;
  color:color-mix(in srgb, var(--inner-red-hot) 70%, transparent);
  transition:color .5s var(--ease-out);
}
body[data-inner-hero] .evidence-chapter{position:relative}
body[data-inner-hero] .evidence-chapter.is-current::before{
  color:var(--inner-red-hot);
}

/* the figures were dense — give their internals room to breathe */
body[data-inner-hero] .evidence-visual{padding:clamp(20px,2.2vw,30px)}
body[data-inner-hero] .chain-scroll-figure{gap:clamp(12px,1.3vw,18px)}
body[data-inner-hero] .chain-figure-stage{padding:clamp(14px,1.5vw,20px)}
body[data-inner-hero] .evidence-method-layout{gap:clamp(20px,2.4vw,34px)}

@media(max-width:900px){
  body[data-inner-hero] .evidence-scroll-sequence::before{display:none}
  body[data-inner-hero] .evidence-chapter,
  body[data-inner-hero] .evidence-chapter-measure{
    grid-template-columns:1fr;
    padding-left:0;
  }
  body[data-inner-hero] .evidence-chapter::before{
    position:static;
    transform:none;
    display:block;
    width:auto;
    text-align:left;
    padding:0 0 10px;
    background:none;
  }
}

/* Chapter two is authored figure-first in the DOM (it used to be the reversed
   one), so the columns alone are not enough — the children need reordering
   for the sequence to run in a single direction. */
body[data-inner-hero] .evidence-chapter-measure .evidence-chapter-copy{order:1}
body[data-inner-hero] .evidence-chapter-measure .evidence-visual{order:2}
@media(max-width:900px){
  body[data-inner-hero] .evidence-chapter-measure .evidence-chapter-copy{order:1}
  body[data-inner-hero] .evidence-chapter-measure .evidence-visual{order:2}
}

/* Honours: same rhythm as the CV timeline it sits under, so the two read as
   one record rather than two unrelated lists. */
body[data-inner-hero] .honors{margin:0;padding:0;list-style:none}
body[data-inner-hero] .honors li{
  display:grid;
  grid-template-columns:88px minmax(0,1fr);
  gap:14px;
  align-items:baseline;
  padding:10px 0;
}
body[data-inner-hero] .honors li + li{
  border-top:1px solid color-mix(in srgb, var(--inner-line) 48%, transparent);
}
body[data-inner-hero] .honors .when{
  font-family:var(--mono);
  font-size:12.5px;
  letter-spacing:.06em;
  color:var(--signal-red);
}
body[data-inner-hero] .honors .what{font-size:14px;line-height:1.5}
/* the advisor line hangs under its timeline entry, quieter than the place */
body[data-inner-hero] .tl .advisor{
  display:block;
  margin-top:3px;
  font-family:var(--mono);
  font-size:12.5px;
  letter-spacing:.03em;
  color:var(--inner-muted);
  opacity:.82;
}
html[lang="zh"] body[data-inner-hero] .tl .advisor{font-family:var(--cjk);letter-spacing:.02em}

/* ==========================================================================
   MICROBEX ARCHITECTURE (PLATFORMS PAGE) — LIGHT THEME
   Same problem and same answer as the homepage copy of this diagram: it is
   authored as light emerging from black, so a mechanical inversion turns the
   maroon card fills into grey-brown on ivory. Rebuilt here as paper cards on a
   barely-tinted plate, with the red kept for the foundation bar and the layer
   marks. See the matching block in home-v2.css.
   ========================================================================== */
/* No panel here. There were three nested rectangles behind this diagram —
   .framework-visual, .mx-platform and this one — and this was the worst of
   them: a square-cornered white slab whose border ran 3px from the outermost
   card, inside a parent rounded at 26px. That hairline hugging the content is
   the edge that read as stuck to the diagram. The outer panel already provides
   the surface and gives the content 46px to breathe in; this only needs to
   carry the faint warmth at the top-left. */
:root[data-theme="light"] body[data-inner-hero] .mx-stage{
  border:0;
  background:none;
  box-shadow:none;
}
/* the homepage's stage carries nothing either — the panel outside it does */
body[data-inner-hero] .mx-stage{ border:0; background:none; box-shadow:none }
:root[data-theme="light"] body[data-inner-hero] .mx-node-grid article,
:root[data-theme="light"] body[data-inner-hero] .mx-layer-rail > div,
:root[data-theme="light"] body[data-inner-hero] .mx-orchestration{
  border:1px solid rgba(20,16,15,.09);
  background:#FFFFFF;
  box-shadow:0 1px 2px rgba(20,16,15,.04), 0 6px 16px -10px rgba(20,16,15,.18);
}
:root[data-theme="light"] body[data-inner-hero] .mx-node-grid article:hover{
  border-color:rgba(148,21,26,.34);
  box-shadow:0 2px 4px rgba(20,16,15,.05), 0 14px 30px -12px rgba(148,21,26,.26);
}
:root[data-theme="light"] body[data-inner-hero] .mx-virtual{
  border:1px solid rgba(148,21,26,.22);
  background:linear-gradient(180deg,#FFFFFF 0%,#F8F6F5 100%);
  box-shadow:0 1px 2px rgba(20,16,15,.04), 0 16px 40px -24px rgba(20,16,15,.22);
}
:root[data-theme="light"] body[data-inner-hero] .mx-foundation-node{
  border:1px solid rgba(148,21,26,.5);
  background:linear-gradient(100deg,#8E1418 0%,#A82128 62%,#8E1418 100%);
  box-shadow:0 14px 34px -18px rgba(148,21,26,.5);
  color:#F5F1EA;
}
:root[data-theme="light"] body[data-inner-hero] .mx-foundation-node b{color:#F5F1EA}
:root[data-theme="light"] body[data-inner-hero] .mx-rail-symbol,
:root[data-theme="light"] body[data-inner-hero] .mx-node-symbol{
  border-color:rgba(148,21,26,.3);
  background:rgba(148,21,26,.07);
  color:#94070A;
}

/* The sheen sweeping across every card is a dark-ground effect: a pale band
   travelling over black reads as light catching an edge. Over paper the same
   band is a grey smear crossing the type — it made the diagram look dirty.
   It stops on the light theme; the foundation bar keeps a faint white one
   because that bar is still a dark red plate. */
:root[data-theme="light"] body[data-inner-hero] .mx-layer-rail > div::after,
:root[data-theme="light"] body[data-inner-hero] .mx-node-grid article::after,
:root[data-theme="light"] body[data-inner-hero] .mx-virtual::after{
  display:none !important;
  animation:none !important;
}
:root[data-theme="light"] body[data-inner-hero] .mx-foundation-node::after{
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.13),transparent);
}

/* Five representative publications form one compact reading row. */
body[data-page="publications"] .featpub{
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:clamp(10px,1.25vw,18px);
  align-items:stretch;
}
body[data-page="publications"] .fp{
  display:flex;
  flex-direction:column;
  min-width:0;
  padding:clamp(18px,1.35vw,24px);
}
body[data-page="publications"] .fp-fig{
  order:-1;
  margin:calc(clamp(18px,1.35vw,24px) * -1) calc(clamp(18px,1.35vw,24px) * -1) clamp(17px,1.25vw,22px);
  color:var(--inner-muted);
}
body[data-page="publications"] .fp-fig-media{
  display:grid;
  place-items:center;
  height:clamp(160px,12vw,220px);
  overflow:hidden;
  padding:clamp(8px,.7vw,12px);
  border-radius:var(--r-md) var(--r-md) 0 0;
  background:#fff;
}
body[data-page="publications"] .fp-fig img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  transform:none !important;
}
body[data-page="publications"] .fp h3{
  margin-bottom:clamp(18px,1.7vw,28px);
  font-size:clamp(.98rem,1.08vw,1.22rem);
  line-height:1.18;
  letter-spacing:-.018em;
  text-align:left;
  text-wrap:balance;
  overflow-wrap:anywhere;
}
body[data-page="publications"] .fp .vbadge{
  display:block;
  height:auto;
  min-height:2.9em;
  margin-bottom:clamp(15px,1.25vw,22px);
  overflow:visible;
  font-size:12.5px;
  line-height:1.45;
  letter-spacing:.1em;
  overflow-wrap:anywhere;
}
body[data-page="publications"] .fp .authors{
  margin-top:auto;
  margin-bottom:0;
  padding-top:14px;
  border-top:1px solid var(--inner-line);
  font-size:12.5px;
  line-height:1.48;
  overflow-wrap:anywhere;
}
@media(min-width:1181px){
  body[data-page="publications"] .fp .authors{
    flex:0 0 72px;
    min-height:72px;
  }
}
body[data-page="publications"] .fp-note{
  display:block;
  height:1.35em;
  margin:0 0 16px;
  color:var(--signal-red);
  font-family:var(--mono);
  font-size:12.5px;
  font-weight:700;
  letter-spacing:.05em;
  line-height:1.35;
  text-transform:uppercase;
}
body[data-page="publications"] .fp-note.is-empty{
  visibility:hidden;
}
body[data-page="publications"] .featured-corresponding{
  display:inline-block;
  margin-left:14px;
  color:var(--inner-muted);
  font-family:var(--mono);
  font-size:12.5px;
  font-weight:500;
  letter-spacing:.03em;
  text-transform:none;
}
@media(max-width:1180px){
  body[data-page="publications"] .featpub{grid-template-columns:repeat(3,minmax(0,1fr))}
  body[data-page="publications"] .fp-fig-media{height:220px}
}
@media(max-width:760px){
  body[data-page="publications"] .featpub{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:520px){
  body[data-page="publications"] .featpub{grid-template-columns:1fr}
  body[data-page="publications"] .featured-corresponding{display:block;margin:8px 0 0}
}

/* Field Studies timeline */
html.field-route .phero{display:none}
body[data-page="research"]:not(.field-timeline-page) .dir-opening-sec{display:none}
body.field-timeline-page .dir-detail-sec{display:none}
body.field-timeline-page .dir-opening-sec{padding-top:clamp(56px,7vw,104px);padding-bottom:clamp(64px,8vw,124px)}
.field-timeline-title{
  margin:0 0 clamp(32px,4vw,58px);
  color:var(--inner-text);
  font-family:var(--inner-display);
  font-size:clamp(2rem,4vw,3.8rem);
  font-weight:570;
  letter-spacing:-.045em;
  line-height:1.02;
}
.fieldwork-timeline-columns{
  position:relative;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(40px,5vw,76px);
  align-items:start;
}
.fieldwork-timeline-columns::before{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:50%;
  width:1px;
  transform:translateX(-.5px);
  background:color-mix(in srgb, var(--inner-line) 72%, transparent);
}
.fieldwork-timeline-column{min-width:0}
.fieldwork-timeline-column + .fieldwork-timeline-column{
  padding-left:0;
  border-left:0;
}
.fieldwork-column-title{
  margin:0 0 clamp(24px,3vw,42px);
  color:var(--inner-text);
  font-family:var(--inner-display);
  font-size:clamp(1.55rem,2.5vw,2.45rem);
  font-weight:570;
  letter-spacing:-.04em;
  line-height:1.05;
}
.fieldwork-timeline-column .field-timeline-list::before{
  left:clamp(84px,9vw,120px);
}
.fieldwork-timeline-column .field-timeline-item{
  grid-template-columns:clamp(84px,9vw,120px) minmax(0,1fr);
  gap:clamp(18px,2.5vw,32px);
}
.fieldwork-timeline-column .field-timeline-card{
  grid-template-columns:minmax(0,1fr);
  min-height:0;
}
@media(max-width:980px){
  .fieldwork-timeline-columns{grid-template-columns:1fr;gap:56px}
  .fieldwork-timeline-columns::before{display:none}
  .fieldwork-timeline-column + .fieldwork-timeline-column{
    padding-top:56px;
    padding-left:0;
    border-top:1px solid color-mix(in srgb, var(--inner-line) 72%, transparent);
    border-left:0;
  }
}
.field-timeline-list{
  position:relative;
  margin:0;
  padding:0;
  list-style:none;
}
.field-timeline-list::before{
  content:"";
  position:absolute;
  top:10px;
  bottom:10px;
  left:clamp(106px,13vw,188px);
  width:1px;
  background:var(--inner-line-strong);
}
.field-timeline-item{
  position:relative;
  display:grid;
  grid-template-columns:clamp(106px,13vw,188px) minmax(0,1fr);
  gap:clamp(24px,4vw,64px);
  padding:0 0 clamp(30px,4vw,58px);
}
.field-timeline-item:last-child{padding-bottom:0}
.field-timeline-date{
  position:relative;
  z-index:1;
  align-self:start;
  padding-top:3px;
  padding-right:clamp(14px,2vw,28px);
  background:var(--inner-bg);
  color:var(--inner-red-hot);
  font-family:var(--mono);
    font-size:max(12.5px,clamp(10px,1vw,12px));
  font-weight:650;
  letter-spacing:.06em;
  line-height:1.4;
  text-align:right;
}
.field-timeline-date::after{
  content:"";
  position:absolute;
  top:7px;
  right:calc(clamp(-5px,-.35vw,-3px));
  width:7px;
  height:7px;
  border:2px solid var(--inner-red-hot);
  border-radius:50%;
  background:var(--inner-bg);
}
.field-timeline-card{
  display:grid;
  grid-template-columns:minmax(0,1fr) clamp(180px,22vw,300px);
  gap:clamp(20px,3vw,46px);
  align-items:stretch;
  min-height:170px;
}
.field-timeline-copy h3{
  margin:0 0 12px;
  color:var(--inner-text);
  font-family:var(--inner-display);
  font-size:clamp(1.18rem,1.8vw,1.72rem);
  font-weight:570;
  letter-spacing:-.035em;
  line-height:1.16;
}
.field-timeline-location{
  margin:0;
  color:var(--inner-muted);
  font-size:clamp(.95rem,1.2vw,1.1rem);
  line-height:1.6;
}
.field-timeline-placeholder{
  display:grid;
  aspect-ratio:16/10;
  min-height:150px;
  place-items:center;
  border:1px dashed var(--inner-line-strong);
  background:rgba(var(--ink-rgb),.035);
  color:var(--inner-faint);
  font-family:var(--mono);
  font-size:12.5px;
  letter-spacing:.12em;
  text-align:center;
  text-transform:uppercase;
}
.field-timeline-placeholder.has-image{
  width:min(100%,480px);
  overflow:hidden;
  border-style:solid;
  background:var(--inner-bg);
}
.fieldwork-timeline-field .field-timeline-placeholder,
.fieldwork-timeline-lab .field-timeline-placeholder{
  margin-top:18px;
}
.field-timeline-placeholder img{display:block;width:100%;height:100%;object-fit:cover}
.field-timeline-image-button{
  display:block;
  width:100%;
  height:100%;
  min-height:inherit;
  margin:0;
  padding:0;
  overflow:hidden;
  border:0;
  border-radius:0;
  background:transparent;
  color:inherit;
  cursor:zoom-in;
}
.field-timeline-image-button img{
  transition:transform .24s cubic-bezier(.16,1,.3,1),filter .24s ease;
}
.field-timeline-image-button:hover img{transform:scale(1.025);filter:brightness(.94)}
.field-timeline-image-button:active img{transform:scale(1.01)}
.field-timeline-image-button:focus-visible{
  outline:3px solid var(--inner-red-hot);
  outline-offset:-3px;
}
body.activity-lightbox-open{overflow:hidden}
.activity-lightbox[hidden]{display:none}
.activity-lightbox{
  position:fixed;
  inset:0;
  z-index:140;
  display:grid;
  padding:clamp(18px,3vw,48px);
  place-items:center;
  background:rgba(12,10,10,.92);
  opacity:0;
  cursor:zoom-out;
  transition:opacity .18s ease;
}
.activity-lightbox.is-open{opacity:1}
.activity-lightbox-stage{
  display:grid;
  width:100%;
  height:100%;
  place-items:center;
}
.activity-lightbox-image{
  display:block;
  max-width:min(94vw,1600px);
  max-height:calc(100dvh - clamp(36px,6vw,96px));
  object-fit:contain;
  box-shadow:0 24px 70px rgba(0,0,0,.32);
  cursor:default;
  opacity:0;
  transform:scale(.985);
  transition:opacity .18s ease,transform .18s cubic-bezier(.16,1,.3,1);
}
.activity-lightbox.is-open .activity-lightbox-image{opacity:1;transform:scale(1)}
.activity-lightbox-close{
  position:absolute;
  top:clamp(14px,2vw,28px);
  right:clamp(14px,2vw,28px);
  z-index:1;
  display:grid;
  width:44px;
  height:44px;
  padding:0;
  place-items:center;
  border:1px solid rgba(255,255,255,.42);
  border-radius:50%;
  background:rgba(20,18,18,.74);
  color:#f7f4f3;
  font:300 30px/1 var(--inner-display);
  cursor:pointer;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  transition:background-color .16s ease,transform .16s ease;
}
.activity-lightbox-close:hover{background:rgba(148,7,10,.9)}
.activity-lightbox-close:active{transform:scale(.96)}
.activity-lightbox-close:focus-visible{outline:3px solid #f7f4f3;outline-offset:3px}
@media(prefers-reduced-motion:reduce){
  .field-timeline-image-button img,
  .activity-lightbox,
  .activity-lightbox-image,
  .activity-lightbox-close{transition:none}
  .field-timeline-image-button:hover img{transform:none}
}
@media(max-width:720px){
  .field-timeline-list::before{left:92px}
  .field-timeline-item{grid-template-columns:92px minmax(0,1fr);gap:20px}
  .field-timeline-card{grid-template-columns:1fr;gap:18px}
  .field-timeline-placeholder{min-height:130px}
}
@media(max-width:500px){
  .field-timeline-list::before{left:0}
  .field-timeline-item{display:block;padding-left:20px;padding-bottom:34px}
  .field-timeline-date{display:inline-block;margin:0 0 14px;padding:0 12px 0 0;text-align:left}
  .field-timeline-date::after{top:4px;right:auto;left:-24px}
  .field-timeline-card{display:block;min-height:0}
  .field-timeline-placeholder{margin-top:20px}
}

/* Research direction pages use one restrained editorial hierarchy. The four
   routes share this structure; Field Studies keeps its separate timeline. */
html.research-direction-route .phero,
html.research-direction-route .dir-opening-sec{
  display:none!important;
}
html.research-direction-route .dir-detail-sec{
  padding-top:clamp(48px,5vw,78px);
  padding-bottom:clamp(72px,8vw,124px);
}
html.research-direction-route .pdetail{
  grid-template-columns:clamp(180px,16vw,230px) minmax(0,1fr);
  gap:clamp(38px,5vw,82px);
}
html.research-direction-route .pd-side{
  position:sticky;
  top:calc(var(--nav-h) + 30px);
  display:block;
  border:0;
  border-radius:0;
  background:none;
  overflow:visible;
}
html.research-direction-route .pd-side .sblock{
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}
html.research-direction-route .pd-side h6{
  margin:0 0 16px;
  padding-left:18px;
  color:var(--inner-muted);
  font-size: max(12.5px, .68rem);
  letter-spacing:.08em;
}
html.research-direction-route .pd-side a{
  display:block;
  margin-left:0;
  padding:11px 14px 11px 18px;
  border-left:2px solid transparent;
  color:var(--inner-muted);
  font-size:.86rem;
  font-weight:560;
  line-height:1.35;
}
html.research-direction-route .pd-side a:hover,
html.research-direction-route .pd-side a:focus-visible{
  color:var(--inner-text);
  outline:none;
}
html.research-direction-route .pd-side a.is-current{
  border-left-color:var(--inner-red-hot);
  color:var(--inner-text);
  font-weight:680;
}
.direction-compact{
  min-width:0;
}
.direction-summary{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(280px,.92fr);
  gap:clamp(34px,5vw,78px);
  align-items:end;
  padding-bottom:clamp(48px,5vw,76px);
  border-bottom:1px solid var(--inner-line);
}
.direction-summary-copy{
  min-width:0;
}
.direction-back{
  display:inline-block;
  margin-bottom:clamp(28px,3.5vw,54px);
  color:var(--inner-muted);
  font-size:.8rem;
  font-weight:620;
}
.direction-back:hover,
.direction-back:focus-visible{
  color:var(--inner-red-hot);
}
.direction-title{
  max-width:20ch;
  margin:0;
  color:var(--inner-text);
  font-family:var(--inner-display);
  font-size:clamp(2.5rem,3.8vw,3.8rem);
  font-weight:590;
  letter-spacing:-.055em;
  line-height:.96;
  text-wrap:balance;
}
.direction-summary-text{
  max-width:48ch;
  margin:clamp(22px,2.6vw,36px) 0 0;
  color:var(--inner-muted);
  font-size:clamp(.96rem,1.15vw,1.12rem);
  line-height:1.65;
}
.direction-summary-media{
  aspect-ratio:4/3;
  margin:0;
  overflow:hidden;
  border:1px solid var(--inner-line);
  border-radius:6px;
  background:var(--inner-raised);
}
.direction-summary-media img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.direction-essentials{
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(280px,.88fr);
  gap:clamp(42px,6vw,96px);
  padding:clamp(58px,6.5vw,96px) 0;
  border-bottom:1px solid var(--inner-line);
}
.direction-essentials h2,
.direction-publications h2{
  margin:0 0 18px;
  color:var(--inner-text);
  font-size:.92rem;
  font-weight:700;
  letter-spacing:-.01em;
}
.direction-core-question p{
  max-width:24ch;
  margin:0;
  color:var(--inner-text);
  font-family:var(--inner-display);
  font-size:clamp(1.55rem,2.45vw,2.65rem);
  font-weight:540;
  letter-spacing:-.035em;
  line-height:1.12;
}
.direction-methods ul{
  margin:0;
  padding:0;
  list-style:none;
}
.direction-methods li{
  padding:12px 0;
  border-top:1px solid var(--inner-line);
  color:var(--inner-muted);
  font-size:.9rem;
  line-height:1.52;
}
.direction-methods li:last-child{
  padding-bottom:0;
}
.direction-publications{
  padding-top:clamp(54px,6vw,88px);
}
.direction-publications > header{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:24px;
  margin-bottom:20px;
}
.direction-publications > header h2{
  margin-bottom:0;
}
.direction-publications > header a{
  flex:0 0 auto;
  color:var(--inner-red-hot);
  font-size:.82rem;
  font-weight:650;
}
.direction-publication-row{
  display:grid;
  grid-template-columns:minmax(110px,.22fr) minmax(0,1fr) 20px;
  gap:clamp(18px,3vw,44px);
  align-items:baseline;
  padding:clamp(19px,2.2vw,30px) 0;
  border-top:1px solid var(--inner-line);
  color:var(--inner-text);
}
.direction-publication-meta{
  color:var(--inner-red-hot);
  font-family:var(--mono);
  font-size: max(12.5px, .68rem);
  letter-spacing:.06em;
  line-height:1.5;
  text-transform:uppercase;
}
.direction-publication-title{
  max-width:54ch;
  font-size:clamp(1rem,1.35vw,1.3rem);
  font-weight:570;
  letter-spacing:-.02em;
  line-height:1.35;
}
.direction-publication-copy{
  display:grid;
  gap:9px;
  min-width:0;
}
.direction-publication-authors{
  max-width:76ch;
  color:var(--inner-muted);
  font-family:var(--mono);
  font-size:max(12.5px,clamp(.66rem,.76vw,.76rem));
  line-height:1.55;
  overflow-wrap:anywhere;
}
.direction-publication-action{
  color:var(--inner-muted);
  transition:color .2s ease,transform .2s ease;
}
.direction-publication-row:hover .direction-publication-action,
.direction-publication-row:focus-visible .direction-publication-action{
  color:var(--inner-red-hot);
  transform:translate(2px,-2px);
}
.direction-publication-row:focus-visible{
  outline:2px solid var(--inner-red-hot);
  outline-offset:4px;
}

/* Research overview type hierarchy: four readable levels instead of a dense
   mix of small labels and metadata. */
body[data-page="research"] .research-overview-intro{
  max-width:none;
  width:100%;
}
body[data-page="research"] .research-overview-intro p{
  max-width:none;
  width:100%;
  color:#94070A;
  font-size:clamp(1.15rem,1.8vw,1.75rem);
  font-weight:560;
  line-height:1.28;
}
html[lang="zh"] body[data-page="research"] .research-overview-intro p{
  line-height:1.5;
}
body[data-page="research"] .research-direction-index{
  font-size:13.5px;
}
body[data-page="research"] .research-direction-name{
  font-size:clamp(16px,1.15vw,18px);
  line-height:1.35;
}
body[data-page="research"] .direction-core-question p{
  font-size:clamp(28px,2.2vw,32px);
  line-height:1.18;
}
body[data-page="research"] .direction-essentials h2,
body[data-page="research"] .direction-publications h2{
  font-size:16px;
}
body[data-page="research"] .direction-methods li,
body[data-page="research"] .direction-publication-title{
  font-size:clamp(16px,1.15vw,17px);
}
body[data-page="research"] .research-inline-methods h2{
  font-size:15px;
}
body[data-page="research"] .research-inline-methods li{
  font-size:clamp(15.5px,1.08vw,17px);
  line-height:1.5;
}
body[data-page="research"] .direction-publication-meta,
body[data-page="research"] .direction-publication-authors{
  font-size:clamp(13.5px,.95vw,14px);
}
@media(max-width:980px){
  html.research-direction-route .pdetail{
    grid-template-columns:1fr;
    gap:42px;
  }
  html.research-direction-route .pd-side{
    position:static;
  }
  html.research-direction-route .pd-side .sblock{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-top:0;
    border-left:0;
  }
  html.research-direction-route .pd-side h6{
    grid-column:1/-1;
    padding:18px 0 0;
  }
  html.research-direction-route .pd-side a{
    margin-top:-1px;
    margin-left:0;
    padding:13px 10px 13px 0;
    border-top:2px solid transparent;
    border-left:0;
  }
  html.research-direction-route .pd-side a.is-current{
    border-top-color:var(--inner-red-hot);
  }
  .direction-summary{
    grid-template-columns:minmax(0,1fr) minmax(260px,.72fr);
  }
}
@media(max-width:760px){
  html.research-direction-route .dir-detail-sec{
    padding-top:32px;
  }
  html.research-direction-route .pd-side .sblock{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .direction-summary,
  .direction-essentials{
    grid-template-columns:1fr;
  }
  .direction-summary{
    gap:30px;
  }
  .direction-summary-media{
    aspect-ratio:16/10;
  }
  .direction-title{
    font-size:clamp(2.5rem,12vw,4.2rem);
  }
  .direction-core-question p{
    max-width:none;
  }
  .direction-publication-row{
    grid-template-columns:1fr 20px;
    gap:8px 18px;
  }
  .direction-publication-meta{
    grid-column:1/-1;
  }
}
@media(max-width:480px){
  .direction-publications > header{
    display:block;
  }
  .direction-publications > header a{
    display:inline-block;
    margin-top:8px;
  }
}

/* Research overview renders each direction in place. The tab rail is the
   navigation; no second route or duplicate methods/results sections needed. */
body[data-page="research"] .research-inline-direction{
  min-width:0;
  padding:clamp(42px,5vw,72px) 0 0;
}
body[data-page="research"] .research-inline-opening{
  display:grid;
  grid-template-columns:minmax(260px,.82fr) minmax(0,1.18fr);
  gap:clamp(38px,5vw,78px);
  align-items:center;
  padding-bottom:clamp(34px,4vw,54px);
  border-bottom:1px solid var(--inner-line);
}
body[data-page="research"] .research-inline-opening .focus-media{
  margin:0;
}
body[data-page="research"] .research-inline-copy{
  display:grid;
  align-content:center;
  gap:clamp(16px,2.2vw,28px);
  min-width:0;
}
body[data-page="research"] .research-inline-methods{
  padding:0;
  border-bottom:0;
}
body[data-page="research"] .research-inline-methods ul{
  display:grid;
  grid-template-columns:1fr;
  gap:0;
}
body[data-page="research"] .research-inline-methods li:first-child{
  border-top-color:var(--inner-line);
}
body[data-page="research"] .research-inline-publications{
  padding-top:clamp(52px,5.5vw,82px);
}

/* Person details: keep the profile blocks readable without reserving a large
   empty area below short education, research, or hobby entries. */
body.profile-page .pd-block{
  margin:0;
  padding:clamp(12px,1.35vw,20px) 0;
  border-bottom:0;
}
body.profile-page .profile-role{
  margin:clamp(6px,.6vw,10px) 0 clamp(20px,2vw,30px);
  color:var(--ink-soft);
  font-size:clamp(15px,1.15vw,17px);
  font-weight:600;
  line-height:1.58;
}
html[lang="zh"] body.profile-page .profile-role{
  line-height:1.68;
}
body.profile-page .pd-block:first-of-type{
  padding-top:0;
}
body.profile-page .pd-block + .pd-block{
  padding-top:clamp(12px,1.35vw,20px);
  border-top:1px solid color-mix(in srgb, var(--inner-line) 62%, transparent);
}
body.profile-page .pd-block:last-child{
  padding-bottom:0;
}
body.profile-page .pd-block .lbl{
  margin-bottom:clamp(6px,.75vw,10px);
  font-size:clamp(14px,1.1vw,16.5px);
  line-height:1.35;
  letter-spacing:.1em;
}
body.profile-page .pd-block .body-txt{
  max-width:65ch;
  font-size:clamp(15px,1.15vw,17px);
  line-height:1.42;
}
html[lang="zh"] body.profile-page .pd-block .body-txt{
  font-size:clamp(15px,1.2vw,17.5px);
  line-height:1.5;
  letter-spacing:.01em;
}
body.profile-page .pd-block .person-summary,
body.profile-page .pd-block .person-advising,
body.profile-page .person-affiliations{
  font-size:clamp(15px,1.15vw,17px);
  line-height:1.58;
}
body.profile-page .person-affiliations{
  margin:0;
  color:var(--ink-soft);
  font-weight:600;
}
html[lang="zh"] body.profile-page .pd-block .person-summary,
html[lang="zh"] body.profile-page .pd-block .person-advising,
html[lang="zh"] body.profile-page .person-affiliations{
  font-size:clamp(15px,1.2vw,17.5px);
  line-height:1.68;
}
body.profile-page .tl .when{
  font-size:clamp(12.5px,.82vw,14px);
  line-height:1.4;
}
body.profile-page .tl .what{
  display:block;
  color:var(--ink-soft);
  font-size:clamp(15.5px,1.25vw,18.5px);
  font-weight:600;
  line-height:1.45;
}
body.profile-page .tl .where{
  display:block;
  font-size:clamp(14px,1.05vw,16px);
  line-height:1.5;
}
body.profile-page .tl .advisor{
  font-size:clamp(13.5px,.95vw,15px);
  line-height:1.45;
}
body.profile-page .person-identity-panel{
  align-self:start;
  padding:clamp(22px,2.8vw,42px) 0 0;
  border-top:2px solid var(--inner-red-hot);
}
body.profile-page .person-identity-photo{
  width:100%;
  aspect-ratio:4/5;
  margin-inline:auto;
  overflow:hidden;
  border-radius:var(--r-sm);
  background:var(--inner-raised);
  box-shadow:0 14px 30px -20px rgba(var(--shadow-rgb),.42);
}
body.profile-page .person-identity-photo img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:50% 24%;
}
body.profile-page .person-identity-kicker{
  margin:clamp(22px,2.8vw,40px) 0 clamp(24px,3vw,44px);
  font-family:var(--mono);
  font-size:clamp(12.5px,.78rem + .12vw,14px);
  letter-spacing:.16em;
  color:var(--inner-faint);
}
body.profile-page .person-identity-panel .rows{
  margin-top:0;
}
body.profile-page .person-identity-panel .rows div{
  align-items:flex-start;
  gap:14px;
  padding:14px 0;
  font-size:clamp(14px,.82rem + .12vw,16px);
  line-height:1.5;
}
body.profile-page .person-identity-panel .rows div > span,
body.profile-page .person-identity-panel .rows div > span a{
  font-size:inherit;
}
body.profile-page .person-identity-panel .rows b{
  flex:0 0 76px;
  font-size:13.5px;
}
body.profile-page .person-identity-panel .rows span{
  min-width:0;
  overflow-wrap:anywhere;
}
body.profile-page .pi-grid{
  grid-template-columns:minmax(220px,.32fr) minmax(0,.68fr);
  align-items:start;
  gap:clamp(36px,5vw,92px);
}
body.profile-page .pi-grid > .person-identity-panel{
  align-self:start;
}
body.profile-page .pi-grid > .rv:last-child{
  min-width:0;
}
@media(max-width:820px){
  body.profile-page .person-identity-panel{
    padding-top:22px;
  }
  body[data-page="research"] .research-inline-opening{
    grid-template-columns:1fr;
    align-items:start;
  }
  body[data-page="research"] .research-inline-methods ul{
    grid-template-columns:1fr;
  }
}
@media(max-width:900px){
  body.profile-page .pi-grid{
    grid-template-columns:1fr;
    gap:clamp(34px,7vw,56px);
  }
  body.profile-page .pi-grid .rows{
    position:static;
  }
}