/*
 * Unified TRAILAB stylesheet.
 *
 * Each profile preserves the source order and responsive cascade of the
 * route-specific stylesheet(s) it replaces. The profile selector prevents
 * the content, research and publication systems from styling one another.
 */

@font-face {
  font-family: "Analogist";
  src: url("assets/analogist/Analogist.otf") format("opentype");
  font-display: swap;
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: "Creato Display";
  src: url("assets/creato_display/CreatoDisplay-Regular.otf") format("opentype");
  font-display: swap;
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: "Creato Display";
  src: url("assets/creato_display/CreatoDisplay-Medium.otf") format("opentype");
  font-display: swap;
  font-style: normal;
  font-weight: 500;
}

@font-face {
  font-family: "Creato Display";
  src: url("assets/creato_display/CreatoDisplay-Bold.otf") format("opentype");
  font-display: swap;
  font-style: normal;
  font-weight: 700;
}


/* Content profile: former root, historical editorial, then English overlay. */


html[data-style-system="content"]:root {
  color-scheme: light;
  --font-serif: "Analogist", Georgia, "Times New Roman", serif;
  --font-sans: "Creato Display", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: ui-monospace, "SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --title-size: clamp(2.15rem, 6.2vw, 4rem);
  --title2-size: clamp(1.6rem, 4vw, 4rem);
  --subtitle-size: clamp(1.6rem, 3vw, 2.4rem);
  --body-size: 1rem;
  --body-large-size: 1.15rem;
  --body-small-size: 0.9rem;
  --accent-size: 0.76rem;
  --display-size: clamp(2.8rem, 5.6vw, 6.5rem);
  --body-weight: 400;
  --accent-weight: 700;
  --bg: #f7f4ed;
  --bg-strong: #fffdf8;
  --bg-alt: #ebe7dd;
  --ink: #171713;
  --ink-soft: #3a3730;
  --muted: #70695f;
  --line: #d2c8b9;
  --line-strong: #a99f90;
  --blue: #006cae;
  --blue-soft: rgba(0, 108, 174, 0.13);
  --gold: #af7d2a;
  --gold-soft: rgba(175, 125, 42, 0.16);
  --red: #a54a44;
  --red-soft: rgba(165, 74, 68, 0.15);
  --focus: #005fcc;
  --shadow: 0 26px 70px rgba(38, 33, 24, 0.12);
  --shadow-soft: 0 12px 34px rgba(38, 33, 24, 0.08);
  --radius: 8px;
  --header-h: 72px;
  --page-x: clamp(18px, 4vw, 58px);
  --section-y: clamp(62px, 9vw, 128px);
  --max: 1180px;
  --measure: 760px;
}

html[data-style-system="content"], html[data-style-system="content"] * {
  box-sizing: border-box;
}

html[data-style-system="content"] {
  min-width: 320px;
  background: var(--bg);
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-h) + 18px);
  overflow-x: hidden;
  overflow-x: clip;
  overscroll-behavior-x: none;
}

html[data-style-system="content"] body {
  min-width: 320px;
  margin: 0;
  padding-top: var(--header-h);
  overflow-x: hidden;
  overflow-x: clip;
  overscroll-behavior-x: none;
  background:
    linear-gradient(180deg, rgba(255, 253, 248, 0.72), rgba(247, 244, 237, 0) 520px),
    var(--bg);
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: var(--body-size);
  font-weight: var(--body-weight);
  line-height: 1.55;
  text-rendering: geometricPrecision;
}

html[data-style-system="content"].nav-open,
html[data-style-system="content"] body.nav-open {
  overflow: hidden;
  overscroll-behavior: none;
}

html[data-style-system="content"] img,
html[data-style-system="content"] svg {
  display: block;
  max-width: 100%;
}

html[data-style-system="content"] a {
  color: inherit;
  text-decoration-color: rgba(0, 108, 174, 0.4);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

html[data-style-system="content"] button,
html[data-style-system="content"] input,
html[data-style-system="content"] select {
  font: inherit;
}

html[data-style-system="content"] button,
html[data-style-system="content"] a {
  -webkit-tap-highlight-color: transparent;
}

html[data-style-system="content"] :focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 4px;
}

html[data-style-system="content"]::selection,
html[data-style-system="content"] ::selection {
  background: var(--ink);
  color: var(--bg-strong);
}

html[data-style-system="content"] .visually-hidden,
html[data-style-system="content"] .skip-link:not(:focus) {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

html[data-style-system="content"] .skip-link:focus {
  position: fixed;
  top: 14px;
  left: 14px;
  z-index: 400;
  padding: 12px 16px;
  border-radius: var(--radius);
  background: var(--ink);
  color: var(--bg-strong);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .reading-progress {
  position: fixed;
  inset: 0 0 auto;
  z-index: 300;
  height: 3px;
  background: transparent;
}

html[data-style-system="content"] .reading-progress span {
  display: block;
  width: 0;
  height: 100%;
  background: linear-gradient(90deg, var(--blue), var(--gold), var(--red));
  /* Keep the gradient mapped to the full bar while this element reveals it. */
  background-size: 100vw 100%;
  background-repeat: no-repeat;
  transform-origin: left center;
}

html[data-style-system="content"] .site-header {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 220;
  min-height: var(--header-h);
  border-bottom: 1px solid rgba(210, 200, 185, 0.72);
  background: rgba(247, 244, 237, 0.9);
  backdrop-filter: blur(18px);
  transition: background-color 180ms ease, box-shadow 180ms ease;
}

html[data-style-system="content"] .site-header.is-scrolled {
  background: rgba(255, 253, 248, 0.96);
  box-shadow: 0 10px 26px rgba(38, 33, 24, 0.07);
}

html[data-style-system="content"] .header-inner {
  display: grid;
  grid-template-columns: minmax(160px, auto) minmax(0, 1fr) auto auto auto;
  align-items: center;
  gap: 14px;
  width: min(100%, calc(var(--max) + (var(--page-x) * 2)));
  min-height: var(--header-h);
  margin: 0 auto;
  padding: 10px var(--page-x);
}

html[data-style-system="content"] .brand-link {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  min-height: 44px;
  gap: 12px;
  color: var(--ink);
  text-decoration: none;
}

html[data-style-system="content"] .brand-wordmark {
  width: clamp(118px, 10vw, 152px);
  flex: 0 0 auto;
}

html[data-style-system="content"] .brand-link span {
  max-width: 170px;
  color: var(--muted);
  font-size: var(--body-small-size);
  line-height: 1.12;
}

html[data-style-system="content"] .site-nav ul,
html[data-style-system="content"] .mobile-panel ul {
  display: flex;
  justify-content: flex-end;
  gap: 2px;
  padding: 0;
  margin: 0;
  list-style: none;
}

html[data-style-system="content"] .site-nav a,
html[data-style-system="content"] .mobile-panel a:not(.button),
html[data-style-system="content"] .language-option,
html[data-style-system="content"] .header-cta {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 8px 10px;
  border-radius: var(--radius);
  color: var(--muted);
  font-size: var(--body-small-size);
  font-weight: var(--accent-weight);
  line-height: 1.12;
  text-decoration: none;
}

html[data-style-system="content"] .site-nav a:hover,
html[data-style-system="content"] .site-nav a[aria-current="page"],
html[data-style-system="content"] .mobile-panel a:hover,
html[data-style-system="content"] .mobile-panel a[aria-current="page"],
html[data-style-system="content"] .language-option:hover,
html[data-style-system="content"] .language-option.is-active {
  background: rgba(0, 108, 174, 0.08);
  color: var(--ink);
}

html[data-style-system="content"] .language-control {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding: 3px;
  border: 1px solid rgba(210, 200, 185, 0.82);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.72);
}

html[data-style-system="content"] .language-control::after {
  content: none;
}

html[data-style-system="content"] .language-option {
  min-width: 44px;
  min-height: 44px;
  padding: 6px 8px;
  font-size: var(--accent-size);
}

html[data-style-system="content"] .language-select {
  min-width: 92px;
  min-height: 44px;
  padding: 8px 28px 8px 10px;
  border: 0;
  border-radius: var(--radius);
  outline: 0;
  appearance: none;
  background: transparent;
  color: var(--ink);
  cursor: pointer;
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .language-select:hover {
  background: rgba(0, 108, 174, 0.08);
}

html[data-style-system="content"] .language-option span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

html[data-style-system="content"] .language-control > .language-option {
  display: none;
}

html[data-style-system="content"] .language-trigger {
  display: inline-flex;
  align-items: center;
  min-width: 52px;
  min-height: 44px;
  padding: 6px 8px;
  border: 0;
  border-radius: var(--radius);
  background: transparent;
  color: var(--ink);
  cursor: pointer;
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  line-height: 1.12;
  list-style: none;
}

html[data-style-system="content"] .language-trigger::-webkit-details-marker {
  display: none;
}

html[data-style-system="content"] .language-trigger::after {
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  margin-left: 7px;
  border-right: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  content: "";
  transform: translateY(-2px) rotate(45deg);
  transition: transform 160ms ease;
}

html[data-style-system="content"] .language-control[open] .language-trigger::after {
  transform: translateY(2px) rotate(225deg);
}

html[data-style-system="content"] .language-menu {
  position: absolute;
  top: calc(100% - 2px);
  left: 0;
  z-index: 260;
  display: none;
  width: max-content;
  min-width: 0;
  padding: 4px 4px 4px 0;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--bg-strong);
  box-shadow: var(--shadow-soft);
}

html[data-style-system="content"] .language-control[open] .language-menu {
  display: grid;
  gap: 2px;
}

html[data-style-system="content"] .language-menu-option {
  justify-content: flex-start;
  width: auto;
  min-width: max-content;
  padding-left: 8px;
  overflow: visible;
  text-align: left;
  white-space: nowrap;
  font-family: inherit;
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  line-height: 1.12;
}

html[data-style-system="content"] .header-cta {
  border: 1px solid rgba(23, 23, 19, 0.18);
  background: var(--ink);
  color: var(--bg-strong);
}

html[data-style-system="content"] .nav-toggle {
  display: none;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--ink);
  cursor: pointer;
}

html[data-style-system="content"] .nav-toggle span[aria-hidden="true"],
html[data-style-system="content"] .nav-toggle span[aria-hidden="true"]::before,
html[data-style-system="content"] .nav-toggle span[aria-hidden="true"]::after {
  display: block;
  width: 18px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
  content: "";
}

html[data-style-system="content"] .nav-toggle span[aria-hidden="true"] {
  position: relative;
}

html[data-style-system="content"] .nav-toggle span[aria-hidden="true"]::before,
html[data-style-system="content"] .nav-toggle span[aria-hidden="true"]::after {
  position: absolute;
  left: 0;
}

html[data-style-system="content"] .nav-toggle span[aria-hidden="true"]::before {
  top: -6px;
}

html[data-style-system="content"] .nav-toggle span[aria-hidden="true"]::after {
  top: 6px;
}

html[data-style-system="content"] .mobile-panel[hidden] {
  display: none;
}

html[data-style-system="content"] .mobile-panel {
  display: grid;
  position: fixed;
  top: calc(var(--header-h) + 10px);
  right: var(--page-x);
  left: var(--page-x);
  z-index: 240;
  gap: 12px;
  width: auto;
  max-height: calc(100svh - var(--header-h) - 18px);
  max-width: 490px;
  margin: 0 0 0 auto;
  overflow: auto;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--bg-strong);
  box-shadow: var(--shadow);
  opacity: 0;
  pointer-events: none;
  transform: translateY(-12px);
  transition: opacity 240ms ease, transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
}

html[data-style-system="content"] .mobile-panel.is-open {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

/* Safari treats a backdrop-filtered header as the containing block for its
   fixed descendants. Removing that filter only while the menu is open keeps
   the panel attached to the viewport instead of clipping it to the header. */
html[data-style-system="content"] body.nav-open .site-header,
html[data-style-system="content"] .site-header.is-nav-open {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  backdrop-filter: none;
}

html[data-style-system="content"] body::before {
  position: fixed;
  inset: var(--header-h) 0 0;
  z-index: 210;
  background: rgba(247, 244, 237, 0.94);
  content: "";
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  backdrop-filter: blur(0);
  -webkit-backdrop-filter: blur(0);
  transition: opacity 260ms ease, visibility 0s linear 260ms, backdrop-filter 260ms ease, -webkit-backdrop-filter 260ms ease;
}

html[data-style-system="content"] body.nav-open::before {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  transition-delay: 0s;
}

html[data-style-system="content"] .mobile-panel ul,
html[data-style-system="content"] .mobile-language {
  display: grid;
  gap: 4px;
}

html[data-style-system="content"] .mobile-panel nav,
html[data-style-system="content"] .mobile-panel ul,
html[data-style-system="content"] .mobile-panel .nav-item {
  width: 100%;
}

html[data-style-system="content"] .mobile-panel ul {
  justify-content: stretch;
}

html[data-style-system="content"] .mobile-panel a:not(.button) {
  justify-content: flex-start;
  width: 100%;
  font-size: var(--body-size);
}

html[data-style-system="content"] .mobile-panel > .button-primary {
  display: none;
}

html[data-style-system="content"] .mobile-language {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

html[data-style-system="content"] .mobile-panel > .mobile-language {
  margin-top: 8px;
  padding-top: 12px;
  border-top: 1px solid transparent;
  border-image: linear-gradient(90deg, transparent, var(--line-dark) 20%, var(--line-dark) 80%, transparent) 1;
}

/* On phone-sized viewports the menu is the page, rather than a floating card
   over a dimmed page. Tablet-sized layouts keep the contained panel above. */
@media (max-width: 640px) {
  html[data-style-system="content"] .mobile-panel {
    top: var(--header-h);
    right: 0;
    bottom: 0;
    left: 0;
    max-width: none;
    max-height: none;
    margin: 0;
    padding: 24px var(--page-x) calc(24px + env(safe-area-inset-bottom));
    border: 0;
    border-top: 1px solid var(--line);
    border-radius: 0;
    box-shadow: none;
  }

  html[data-style-system="content"] body::before {
    display: none;
  }
}

html[data-style-system="content"] .hero {
  position: relative;
  display: grid;
  min-height: min(760px, calc(100svh - var(--header-h) - 28px));
  overflow: hidden;
  padding: clamp(54px, 8vw, 110px) var(--page-x) clamp(44px, 7vw, 96px);
  isolation: isolate;
}

html[data-style-system="content"] .stream-background {
  position: absolute;
  inset: auto -10vw -18%;
  z-index: -1;
  height: min(48vw, 490px);
  opacity: 0.44;
  transform: translateY(18%);
  mask-image: linear-gradient(180deg, transparent 0, #000 28%);
}

html[data-style-system="content"] .hero-content {
  align-self: center;
  width: min(100%, 1360px);
  margin: 0 auto;
}

html[data-style-system="content"] .hero-wordmark {
  width: clamp(132px, 13vw, 186px);
  margin-bottom: 22px;
}

html[data-style-system="content"] .hero-label,
html[data-style-system="content"] .eyebrow,
html[data-style-system="content"] .chapter-kicker,
html[data-style-system="content"] .footer-heading {
  margin: 0;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  letter-spacing: 0;
  line-height: 1.25;
  text-transform: uppercase;
}

html[data-style-system="content"] .hero h1 {
  max-width: 1360px;
  margin: 14px 0 0;
  font-size: var(--display-size);
  font-weight: var(--accent-weight);
  letter-spacing: 0;
  line-height: 0.96;
}

html[data-style-system="content"] .hero h1 span {
  display: block;
}

html[data-style-system="content"] .hero h1 span + span {
  color: var(--ink-soft);
}

html[data-style-system="content"] .hero-copy {
  max-width: 800px;
  margin: 28px 0 0;
  color: rgba(23, 23, 19, 0.82);
  font-size: var(--body-large-size);
  line-height: 1.55;
}

html[data-style-system="content"] .hero-term {
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] a.hero-term {
  border-bottom: 1px solid currentColor;
  text-decoration: none;
  text-underline-offset: 0.16em;
  transition: color 160ms ease, border-color 160ms ease;
}

html[data-style-system="content"] a.hero-term:hover,
html[data-style-system="content"] a.hero-term:focus-visible {
  border-bottom-color: transparent;
}

html[data-style-system="content"] .hero-term-tech {
  color: var(--blue);
}

html[data-style-system="content"] .hero-term-legal {
  color: var(--gold);
}

html[data-style-system="content"] .hero-term-philosophy {
  color: var(--red);
}

html[data-style-system="content"] .hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-top: 30px;
}

html[data-style-system="content"] .button,
html[data-style-system="content"] .text-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  border-radius: var(--radius);
  font-weight: var(--accent-weight);
  line-height: 1.12;
}

html[data-style-system="content"] .button {
  padding: 12px 16px;
  border: 1px solid transparent;
  text-align: center;
  text-decoration: none;
  transition: transform 160ms ease, border-color 160ms ease, background-color 160ms ease;
}

html[data-style-system="content"] .button:active {
  transform: translateY(1px);
}

html[data-style-system="content"] .button-primary {
  background: var(--ink);
  color: var(--bg-strong);
}

html[data-style-system="content"] .button-secondary {
  border-color: rgba(0, 108, 174, 0.35);
  background: rgba(0, 108, 174, 0.08);
  color: var(--blue);
}

html[data-style-system="content"] .text-link {
  color: var(--blue);
  text-underline-offset: 0.22em;
  min-height: 44px;
}

html[data-style-system="content"] .stream-svg {
  width: 100%;
  height: 100%;
}

html[data-style-system="content"] .stream-line {
  fill: none;
  stroke-linecap: round;
  stroke-width: 7;
  opacity: 0.88;
  stroke-dasharray: 1;
  stroke-dashoffset: 0;
  vector-effect: non-scaling-stroke;
}

html[data-style-system="content"] .stream-background .stream-line {
  stroke-width: 6;
  opacity: 0.64;
}

html[data-style-system="content"] .stream-blue {
  stroke: var(--blue);
}

html[data-style-system="content"] .stream-gold {
  stroke: var(--gold);
}

html[data-style-system="content"] .stream-red {
  stroke: var(--red);
}

html[data-style-system="content"] .stream-mini {
  height: 150px;
}

html[data-style-system="content"] .journey-section {
  position: relative;
  padding: var(--section-y) var(--page-x);
  background: linear-gradient(180deg, rgba(235, 231, 221, 0.8), rgba(247, 244, 237, 0));
  overflow: clip;
}

html[data-style-system="content"] .journey-shell {
  position: relative;
  isolation: isolate;
  background: linear-gradient(180deg, rgba(235, 231, 221, 0.8), rgba(247, 244, 237, 0));
}

html[data-style-system="content"] .journey-shell .journey-section {
  z-index: 1;
  overflow: visible;
  background: transparent;
}

html[data-style-system="content"] .journey-stream-field {
  position: absolute;
  top: var(--journey-stream-flow-top, 0px);
  left: 0;
  z-index: 0;
  width: 100%;
  height: calc(100svh - var(--header-h));
  margin-bottom: 0;
  pointer-events: none;
  overflow: visible;
  mask-image: linear-gradient(90deg, #000 0, #000 88%, transparent 100%);
}

html[data-style-system="content"] .journey-stream-field.is-fixed {
  position: fixed;
  top: var(--journey-stream-top, var(--header-h));
  right: auto;
  bottom: auto;
  left: var(--journey-stream-left, 0px);
  width: var(--journey-stream-width, 100vw);
  height: var(--journey-stream-height, calc(100svh - var(--header-h)));
  margin-bottom: 0;
}

html[data-style-system="content"] .journey-stream-svg {
  width: 100%;
  height: 100%;
  opacity: 0.78;
  overflow: visible;
}

@media (max-width: 920px) {
  html[data-style-system="content"] .journey-stream-field.is-flow-released {
    position: sticky;
    top: var(--journey-stream-top, var(--header-h));
    left: 0;
    width: 100%;
    height: var(--journey-stream-height, calc(100svh - var(--header-h)));
    margin-bottom: calc(-1 * var(--journey-stream-height, calc(100svh - var(--header-h))));
  }
}

html[data-style-system="content"] .journey-path {
  fill: none;
  stroke-linecap: round;
  stroke-width: 11;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  filter: drop-shadow(0 14px 20px rgba(38, 33, 24, 0.15));
  vector-effect: non-scaling-stroke;
}

html[data-style-system="content"] .journey-blue {
  stroke: var(--blue);
}

html[data-style-system="content"] .journey-gold {
  stroke: var(--gold);
}

html[data-style-system="content"] .journey-red {
  stroke: var(--red);
}

html[data-style-system="content"] .journey-sparks {
  fill: var(--ink);
  opacity: 0.16;
}

html[data-style-system="content"] .journey-layout {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(26px, 4vw, 56px);
  width: min(100%, calc(var(--max) + 250px));
  margin: 0 auto;
}

html[data-style-system="content"] .journey-spine {
  position: sticky;
  top: calc(var(--header-h) + 8px);
  z-index: 10;
  padding: 10px;
  border: 1px solid rgba(210, 200, 185, 0.85);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.985);
  backdrop-filter: blur(12px);
  box-shadow: var(--shadow-soft);
}

html[data-style-system="content"] .journey-spine > p {
  margin: 0 0 10px;
  color: var(--muted);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  text-transform: uppercase;
}

html[data-style-system="content"] .journey-spine ol {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 6px;
  padding: 0;
  margin: 0;
  list-style: none;
}

html[data-style-system="content"] .journey-spine ol > li {
  position: relative;
  min-height: 40px;
  padding: 8px;
  /* border: 1px solid var(--line);
  border-radius: var(--radius); */
  color: var(--muted);
  font-size: var(--body-small-size);
  font-weight: var(--accent-weight);
  line-height: 1.12;
  transition: color 180ms ease, background-color 180ms ease, border-color 180ms ease;
}

html[data-style-system="content"] .journey-spine ol > li strong,
html[data-style-system="content"] .journey-spine ol > li span {
  display: block;
}

html[data-style-system="content"] .journey-spine ol > li strong {
  margin-bottom: 4px;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  letter-spacing: 0;
}

html[data-style-system="content"] .journey-spine ol > li span {
  color: inherit;
}

html[data-style-system="content"] .journey-spine ol > li.is-active,
html[data-style-system="content"] .journey-spine ol > li.is-complete {
  border-radius: 5px;
  border-color: rgba(0, 108, 174, 0.32);
  background: rgba(0, 108, 174, 0.08);
  color: var(--ink);
}

html[data-style-system="content"] .journey-spine ol > li[data-tone="blue-gold"].is-active,
html[data-style-system="content"] .journey-spine ol > li[data-tone="blue-gold"].is-complete {
  border-color: rgba(175, 125, 42, 0.34);
  background: linear-gradient(135deg, rgba(0, 108, 174, 0.08), rgba(175, 125, 42, 0.1));
}

html[data-style-system="content"] .journey-spine ol > li[data-tone="blend"].is-active,
html[data-style-system="content"] .journey-spine ol > li[data-tone="blend"].is-complete {
  border-color: rgba(164, 70, 70, 0.28);
  background: linear-gradient(135deg, rgba(0, 108, 174, 0.07), rgba(175, 125, 42, 0.08), rgba(164, 70, 70, 0.08));
}

html[data-style-system="content"] .stream-legend {
  display: none;
  gap: 8px;
  padding: 14px 0 0;
  margin: 14px 0 0;
  border-top: 1px solid var(--line);
  list-style: none;
}

html[data-style-system="content"] .stream-legend li {
  display: flex;
  min-height: auto;
  align-items: center;
  gap: 8px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: var(--body-small-size);
  font-weight: var(--body-weight);
  line-height: 1.18;
}

html[data-style-system="content"] .legend-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  aspect-ratio: 1;
}

html[data-style-system="content"] .tone-blue {
  background: var(--blue);
}

html[data-style-system="content"] .tone-gold {
  background: var(--gold);
}

html[data-style-system="content"] .tone-red {
  background: var(--red);
}

html[data-style-system="content"] .chapter-stack {
  display: grid;
  gap: 28px;
}

html[data-style-system="content"] .story-chapter {
  display: grid;
  gap: 35px;
  align-items: start;
  min-height: min(760px, calc(100svh - var(--header-h) - 44px));
  padding: clamp(26px, 5vw, 58px);
  border: 1px solid rgba(210, 200, 185, 0.86);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.72);
  box-shadow: 0 10px 34px rgba(38, 33, 24, 0.055);
}

html[data-style-system="content"] .story-chapter.is-active {
  border-color: rgba(0, 108, 174, 0.28);
  background: rgba(255, 253, 248, 0.93);
}

html[data-style-system="content"] .chapter-question {
  max-width: 760px;
  margin: 14px 0 0;
  color: var(--blue);
  font-size: var(--subtitle-size);
  font-weight: var(--accent-weight);
  line-height: 1.08;
}

html[data-style-system="content"] .chapter-discipline {
  display: inline-flex;
  max-width: 100%;
  margin: 12px 0 0;
  padding: 7px 10px;
  border: 1px solid rgba(45, 117, 102, 0.24);
  border-radius: 999px;
  background: rgba(45, 117, 102, 0.08);
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  line-height: 1.16;
  text-transform: uppercase;
}

html[data-style-system="content"] .story-chapter h3 {
  max-width: 820px;
  margin: 18px 0 0;
  font-size: var(--title-size);
  line-height: 0.98;
}

html[data-style-system="content"] .chapter-copy p:not(.chapter-kicker):not(.chapter-question):not(.chapter-insight) {
  max-width: var(--measure);
  margin: 20px 0 0;
  color: rgba(23, 23, 19, 0.78);
  font-size: var(--body-size);
}

html[data-style-system="content"] .chapter-insight {
  max-width: 760px;
  margin: 22px 0 0;
  padding: 16px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  font-size: var(--body-large-size);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .chapter-visual {
  min-height: 230px;
}

html[data-style-system="content"] .scientific-visual {
  position: relative;
  min-height: 360px;
  overflow: hidden;
  border: 1px solid rgba(210, 200, 185, 0.82);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 18% 18%, rgba(0, 108, 174, 0.16), transparent 26%),
    radial-gradient(circle at 82% 12%, rgba(175, 125, 42, 0.15), transparent 25%),
    radial-gradient(circle at 72% 86%, rgba(165, 74, 68, 0.14), transparent 28%),
    rgba(255, 253, 248, 0.84);
  box-shadow: 0 18px 42px rgba(38, 33, 24, 0.075);
}

html[data-style-system="content"] .scientific-visual::before {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image:
    linear-gradient(rgba(23, 23, 19, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(23, 23, 19, 0.045) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: radial-gradient(circle at 50% 50%, #000 0, transparent 72%);
  content: "";
}

html[data-style-system="content"] .scientific-visual > * {
  position: relative;
  z-index: 1;
}

html[data-style-system="content"] .visual-topline {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(210, 200, 185, 0.75);
  color: var(--muted);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  line-height: 1.2;
  text-transform: uppercase;
}

html[data-style-system="content"] .visual-topline strong {
  color: var(--blue);
}

html[data-style-system="content"] .visual-card {
  min-width: 0;
  padding: 12px;
  /* border: 1px solid rgba(23, 23, 19, 0.13);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.82);
  box-shadow: 0 10px 24px rgba(38, 33, 24, 0.065); */
}

html[data-style-system="content"] .visual-card span {
  display: inline-flex;
  margin-bottom: 8px;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .visual-card h4 {
  margin: 0;
  color: var(--ink);
  font-size: var(--body-size);
  line-height: 1.06;
}

html[data-style-system="content"] .visual-card p {
  margin: 8px 0 0;
  color: rgba(23, 23, 19, 0.66);
  font-size: var(--body-small-size);
  line-height: 1.34;
}

html[data-style-system="content"] .uncertainty-plot {
  padding: 16px 16px 6px;
}

html[data-style-system="content"] .uncertainty-plot svg {
  width: 100%;
  height: auto;
}

html[data-style-system="content"] .domain-window {
  fill: rgba(0, 108, 174, 0.08);
  stroke: rgba(0, 108, 174, 0.35);
  stroke-dasharray: 6 7;
}

html[data-style-system="content"] .aleatoric-band {
  fill: rgba(165, 74, 68, 0.2);
}

html[data-style-system="content"] .epistemic-band,
html[data-style-system="content"] .prediction-curve {
  fill: none;
  stroke-linecap: round;
}

html[data-style-system="content"] .epistemic-band {
  stroke: rgba(175, 125, 42, 0.82);
  stroke-width: 16;
}

html[data-style-system="content"] .prediction-curve {
  stroke: var(--ink);
  stroke-width: 4;
}

html[data-style-system="content"] .domain-boundary {
  stroke: var(--blue);
  stroke-width: 2;
  stroke-dasharray: 5 6;
}

html[data-style-system="content"] .sample-points circle {
  fill: var(--bg-strong);
  stroke: var(--ink);
  stroke-width: 2;
}

html[data-style-system="content"] .uncertainty-plot text {
  fill: var(--muted);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  text-transform: uppercase;
}

html[data-style-system="content"] .uncertainty-triad {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  padding: 10px 14px 14px;
}

html[data-style-system="content"] .uncertainty-triad .visual-card-1 span {
  color: var(--gold);
}

html[data-style-system="content"] .uncertainty-triad .visual-card-2 span {
  color: var(--red);
}

html[data-style-system="content"] .uncertainty-lenses {
  display: grid;
  gap: 12px;
  padding: 18px;
}

html[data-style-system="content"] .uncertainty-lens {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 12px 16px;
  align-items: center;
  padding: 14px;
  /* border: 1px solid rgba(23, 23, 19, 0.14);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.88);
  box-shadow: 0 10px 24px rgba(38, 33, 24, 0.06); */
}

html[data-style-system="content"] .uncertainty-lens h4,
html[data-style-system="content"] .uncertainty-lens p,
html[data-style-system="content"] .uncertainty-lens strong {
  min-width: 0;
}

html[data-style-system="content"] .uncertainty-lens h4 {
  margin: 0;
  font-size: var(--body-size);
  line-height: 1.08;
}

html[data-style-system="content"] .uncertainty-lens p {
  margin: 6px 0 0;
  color: rgba(23, 23, 19, 0.68);
  font-size: var(--body-small-size);
  line-height: 1.34;
}

html[data-style-system="content"] .uncertainty-lens strong {
  grid-column: 2;
  display: inline-flex;
  width: fit-content;
  /* margin-top: 2px; */
  padding: 7px 9px;
  border-radius: 999px;
  background: rgba(0, 108, 174, 0.1);
  color: var(--blue);
  font-size: var(--accent-size);
}

html[data-style-system="content"] .uncertainty-mini {
  position: relative;
  grid-row: span 3;
  width: 104px;
  height: 92px;
  overflow: hidden;
  border: 1px solid rgba(210, 200, 185, 0.85);
  border-radius: var(--radius);
  background:
    linear-gradient(rgba(23, 23, 19, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(23, 23, 19, 0.05) 1px, transparent 1px),
    rgba(247, 244, 237, 0.8);
  background-size: 22px 22px;
}

html[data-style-system="content"] .domain-mini span {
  position: absolute;
  inset: 12px 34px 12px 10px;
  border: 1px dashed rgba(0, 108, 174, 0.6);
  border-radius: 6px;
  background: rgba(0, 108, 174, 0.08);
}

html[data-style-system="content"] .domain-mini i {
  position: absolute;
  right: 15px;
  bottom: 28px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--red);
  box-shadow: 0 0 0 7px rgba(165, 74, 68, 0.16);
}

html[data-style-system="content"] .domain-mini b {
  position: absolute;
  top: 10px;
  right: 31px;
  bottom: 10px;
  width: 2px;
  background: rgba(23, 23, 19, 0.24);
}

html[data-style-system="content"] .epistemic-mini span {
  position: absolute;
  left: 12px;
  right: 12px;
  height: 3px;
  border-radius: 999px;
}

html[data-style-system="content"] .epistemic-mini span:nth-child(1) {
  top: 30px;
  background: var(--blue);
  transform: rotate(-11deg);
}

html[data-style-system="content"] .epistemic-mini span:nth-child(2) {
  top: 44px;
  background: var(--gold);
  transform: rotate(7deg);
}

html[data-style-system="content"] .epistemic-mini span:nth-child(3) {
  top: 58px;
  background: var(--red);
  transform: rotate(-4deg);
}

html[data-style-system="content"] .epistemic-mini b {
  position: absolute;
  right: 16px;
  top: 26px;
  bottom: 24px;
  width: 28px;
  border: 1px dashed rgba(23, 23, 19, 0.28);
  border-radius: 50%;
}

html[data-style-system="content"] .aleatoric-mini span {
  position: absolute;
  bottom: 18px;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  opacity: 0.78;
}

html[data-style-system="content"] .aleatoric-mini span:nth-child(1) {
  left: 16px;
  background: rgba(0, 108, 174, 0.28);
}

html[data-style-system="content"] .aleatoric-mini span:nth-child(2) {
  left: 32px;
  background: rgba(175, 125, 42, 0.32);
}

html[data-style-system="content"] .aleatoric-mini span:nth-child(3) {
  left: 48px;
  background: rgba(165, 74, 68, 0.3);
}

html[data-style-system="content"] .aleatoric-mini b {
  position: absolute;
  top: 16px;
  left: 21px;
  right: 21px;
  height: 2px;
  border-radius: 999px;
  background: var(--ink);
  box-shadow: 0 10px 0 rgba(23, 23, 19, 0.65);
}

html[data-style-system="content"] .decision-visual {
  display: grid;
  align-content: center;
  gap: 20px;
  padding: 20px;
}

html[data-style-system="content"] .decision-flow {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: 10px;
}

html[data-style-system="content"] .decision-flow i {
  display: none;
}

html[data-style-system="content"] .decision-node {
  min-height: 150px;
  padding: 14px;
  border: 1px solid rgba(23, 23, 19, 0.14);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.84);
}

html[data-style-system="content"] .decision-node span {
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .decision-node h4 {
  margin: 18px 0 0;
  font-size: var(--body-size);
  line-height: 1.05;
}

html[data-style-system="content"] .decision-node p {
  margin: 9px 0 0;
  color: rgba(23, 23, 19, 0.68);
  font-size: var(--body-small-size);
  line-height: 1.34;
}

html[data-style-system="content"] .decision-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

html[data-style-system="content"] .decision-actions span {
  min-width: 0;
  padding: 9px 8px;
  border: 1px solid rgba(23, 23, 19, 0.12);
  border-radius: 999px;
  background: rgba(23, 23, 19, 0.92);
  color: var(--bg-strong);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  text-align: center;
}

html[data-style-system="content"] .uncertainty-visual {
  padding: 8px 0 0 0;
}

html[data-style-system="content"] .domain-visual {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  align-content: center;
  padding: 8px 0 22px 0;
}

html[data-style-system="content"] .domain-core {
  display: grid;
  place-items: center;
  justify-self: center;
  width: min(100%, 280px);
  min-height: 126px;
  padding: 20px;
  border-radius: 50%;
  background: var(--ink);
  color: var(--bg-strong);
  text-align: center;
  box-shadow: 0 18px 38px rgba(23, 23, 19, 0.18);
}

html[data-style-system="content"] .domain-core span {
  color: rgba(255, 253, 248, 0.68);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  text-transform: uppercase;
}

html[data-style-system="content"] .domain-core strong {
  max-width: 230px;
  font-size: var(--body-large-size);
  line-height: 1.08;
}

html[data-style-system="content"] .domain-ring {
  position: absolute;
  inset: 16px;
}

html[data-style-system="content"] .domain-ring span {
  position: absolute;
  display: inline-flex;
  max-width: 150px;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  padding: 8px 11px;
  border: 1px solid rgba(23, 23, 19, 0.14);
  border-radius: 999px;
  background: rgba(255, 253, 248, 0.88);
  color: var(--ink);
  font-size: var(--body-small-size);
  font-weight: var(--accent-weight);
  text-align: center;
  box-shadow: 0 10px 22px rgba(38, 33, 24, 0.07);
}

html[data-style-system="content"] .domain-ring span:nth-child(1) { top: 5%; left: 10%; }
html[data-style-system="content"] .domain-ring span:nth-child(2) { top: 5%; right: 8%; }
html[data-style-system="content"] .domain-ring span:nth-child(3) { top: 34%; left: 1%; }
html[data-style-system="content"] .domain-ring span:nth-child(4) { top: 34%; right: 1%; }
html[data-style-system="content"] .domain-ring span:nth-child(5) { bottom: 17%; left: 8%; }
html[data-style-system="content"] .domain-ring span:nth-child(6) { bottom: 17%; right: 6%; }
html[data-style-system="content"] .domain-ring span:nth-child(7) { bottom: 2%; left: 32%; }
html[data-style-system="content"] .domain-ring span:nth-child(8) { bottom: 2%; right: 30%; }

html[data-style-system="content"] .domain-matrix {
  display: grid;
  gap: 8px;
  padding: 0 22px 0 22px;
}

html[data-style-system="content"] .domain-matrix article {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 4px 10px;
  align-items: start;
  padding: 7.5px;
  /* border: 1px solid rgba(23, 23, 19, 0.13);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.86);
  box-shadow: 0 8px 18px rgba(38, 33, 24, 0.055); */
}

html[data-style-system="content"] .domain-matrix span {
  grid-row: span 2;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .domain-matrix h4 {
  margin: 0;
  font-size: var(--body-size);
  line-height: 1.08;
}

html[data-style-system="content"] .domain-matrix p {
  margin: 0;
  color: rgba(23, 23, 19, 0.65);
  font-size: var(--body-small-size);
  line-height: 1.28;
}

html[data-style-system="content"] .causality-visual {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  padding: 18px;
}

html[data-style-system="content"] .causal-orbit {
  position: relative;
  min-height: 230px;
  border: 1px dashed rgba(23, 23, 19, 0.18);
  border-radius: 50%;
}

html[data-style-system="content"] .causal-core,
html[data-style-system="content"] .causal-node {
  position: absolute;
  display: grid;
  place-items: center;
  border-radius: 50%;
  text-align: center;
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .causal-core {
  inset: 50% auto auto 50%;
  width: 136px;
  height: 136px;
  background: var(--ink);
  color: var(--bg-strong);
  transform: translate(-50%, -50%);
}

html[data-style-system="content"] .causal-node {
  width: 70px;
  height: 70px;
  border: 1px solid rgba(23, 23, 19, 0.18);
  background: rgba(255, 253, 248, 0.9);
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
}

html[data-style-system="content"] .causal-node.one { top: 8%; left: 14%; }
html[data-style-system="content"] .causal-node.two { top: 12%; right: 8%; }
html[data-style-system="content"] .causal-node.three { right: 12%; bottom: 10%; }

html[data-style-system="content"] .causal-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: center;
  gap: 10px;
}

html[data-style-system="content"] .governance-visual {
  display: grid;
  align-items: center;
  padding: 18px;
}

html[data-style-system="content"] .trust-bridge {
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  gap: 12px;
}

html[data-style-system="content"] .trust-bridge > div:last-child {
  display: grid;
  gap: 10px;
}

html[data-style-system="content"] .bridge-line {
  display: block;
  width: 5px;
  height: 32px;
  justify-self: center;
  border-radius: 999px;
  background: linear-gradient(var(--blue), var(--gold), var(--red));
  box-shadow: 0 0 0 7px rgba(255, 253, 248, 0.68);
}

html[data-style-system="content"] .concept-visual {
  display: grid;
  place-items: center;
  padding: 24px;
}

html[data-style-system="content"] .concept-core {
  display: grid;
  place-items: center;
  width: min(72%, 270px);
  min-height: 130px;
  border-radius: 50%;
  background: var(--ink);
  color: var(--bg-strong);
  font-size: var(--subtitle-size);
  font-weight: var(--accent-weight);
  text-align: center;
}

html[data-style-system="content"] .concept-cloud {
  position: absolute;
  inset: 18px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: space-between;
  gap: 12px;
}

html[data-style-system="content"] .concept-cloud span {
  position: relative;
  display: inline-flex;
  max-width: 180px;
  min-height: 38px;
  margin: 0;
  align-items: center;
  justify-content: center;
  padding: 9px 11px;
  border: 1px solid rgba(23, 23, 19, 0.14);
  border-radius: 999px;
  background: rgba(255, 253, 248, 0.88);
  font-size: var(--body-small-size);
  font-weight: var(--accent-weight);
  text-align: center;
  box-shadow: 0 10px 22px rgba(38, 33, 24, 0.07);
}

html[data-style-system="content"] .concept-cloud span:nth-child(even) {
  justify-self: end;
}

html[data-style-system="content"] .concept-cloud span:nth-child(3),
html[data-style-system="content"] .concept-cloud span:nth-child(4) {
  align-self: end;
}

html[data-style-system="content"] .visual-orbit {
  position: relative;
  min-height: 260px;
  border: 1px solid rgba(210, 200, 185, 0.75);
  border-radius: var(--radius);
  background:
    linear-gradient(120deg, var(--blue-soft), transparent 38%),
    linear-gradient(220deg, var(--gold-soft), transparent 48%),
    linear-gradient(340deg, var(--red-soft), transparent 52%),
    rgba(247, 244, 237, 0.7);
  overflow: hidden;
}

html[data-style-system="content"] .visual-orbit::before,
html[data-style-system="content"] .visual-orbit::after {
  position: absolute;
  inset: 18% 12%;
  border: 1px solid rgba(23, 23, 19, 0.15);
  border-radius: 50%;
  content: "";
  transform: rotate(12deg);
}

html[data-style-system="content"] .visual-orbit::after {
  inset: 30% 18%;
  transform: rotate(-18deg);
}

html[data-style-system="content"] .visual-orbit span {
  position: relative;
  z-index: 1;
  display: inline-flex;
  max-width: min(210px, 72%);
  margin: 12px;
  padding: 9px 11px;
  border: 1px solid rgba(23, 23, 19, 0.16);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.82);
  color: var(--ink);
  font-size: var(--body-small-size);
  font-weight: var(--accent-weight);
  box-shadow: 0 8px 20px rgba(38, 33, 24, 0.07);
}

html[data-style-system="content"] .visual-0 span:nth-child(2n),
html[data-style-system="content"] .visual-2 span:nth-child(2n) {
  transform: translateX(34px);
}

html[data-style-system="content"] .visual-1 span:nth-child(3n),
html[data-style-system="content"] .visual-3 span:nth-child(3n) {
  transform: translateX(70px);
}

html[data-style-system="content"] .band,
html[data-style-system="content"] .page-hero,
html[data-style-system="content"] .final-cta {
  padding: var(--section-y) var(--page-x);
}

html[data-style-system="content"] .band-alt {
  background: rgba(235, 231, 221, 0.6);
}

html[data-style-system="content"] .section-shell {
  width: min(100%, var(--max));
  margin: 0 auto;
}

html[data-style-system="content"] h1,
html[data-style-system="content"] h2,
html[data-style-system="content"] h3,
html[data-style-system="content"] h4,
html[data-style-system="content"] p {
  overflow-wrap: anywhere;
}

html[data-style-system="content"] h1,
html[data-style-system="content"] h2,
html[data-style-system="content"] h3,
html[data-style-system="content"] h4 {
  margin: 0;
  font-weight: var(--accent-weight);
  line-height: 1;
  font-family: var(--font-serif);
}

html[data-style-system="content"] .page-hero {
  background: var(--bg);
}

html[data-style-system="content"] .page-hero h1,
html[data-style-system="content"] .band h2,
html[data-style-system="content"] .final-cta h2 {
  max-width: 980px;
  margin-top: 16px;
  font-size: var(--title-size);
  letter-spacing: 0;
}

html[data-style-system="content"] .page-lead,
html[data-style-system="content"] .section-lead,
html[data-style-system="content"] .final-cta p {
  max-width: var(--measure);
  margin: 22px 0 0;
  color: rgba(23, 23, 19, 0.8);
  font-size: var(--body-large-size);
  line-height: 1.55;
}

html[data-style-system="content"] .impact-band {
  background:
    linear-gradient(110deg, rgba(0, 108, 174, 0.12), transparent 34%),
    linear-gradient(250deg, rgba(165, 74, 68, 0.12), transparent 42%),
    rgba(255, 253, 248, 0.58);
}

html[data-style-system="content"] .impact-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(360px, 0.85fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: center;
}

html[data-style-system="content"] .impact-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 30px;
}

html[data-style-system="content"] .impact-card {
  min-width: 0;
  padding: 18px;
  border: 1px solid rgba(210, 200, 185, 0.86);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.84);
  box-shadow: 0 14px 32px rgba(38, 33, 24, 0.07);
}

html[data-style-system="content"] .impact-card span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 34px;
  margin-bottom: 16px;
  border-radius: 50%;
  background: var(--ink);
  color: var(--bg-strong);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .impact-card h3 {
  margin: 0;
  font-size: var(--body-large-size);
  line-height: 1.06;
}

html[data-style-system="content"] .impact-card p {
  margin: 12px 0 0;
  color: rgba(23, 23, 19, 0.72);
}

html[data-style-system="content"] .impact-cycle-map {
  position: relative;
  min-height: auto;
  overflow: visible;
  padding: 22px;
  border: 1px solid rgba(210, 200, 185, 0.9);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 50% 48%, rgba(0, 108, 174, 0.1), transparent 30%),
    linear-gradient(180deg, rgba(255, 253, 248, 0.94), rgba(247, 244, 237, 0.82));
  box-shadow: var(--shadow-soft);
}

html[data-style-system="content"] .impact-cycle-map > p {
  position: relative;
  z-index: 3;
  margin: 0;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  text-transform: uppercase;
}

html[data-style-system="content"] .cycle-methods {
  display: grid;
  gap: 6px;
  margin-top: 18px;
  padding: 18px;
  border-radius: var(--radius);
  background: var(--ink);
  color: var(--bg-strong);
  text-align: center;
  box-shadow: 0 18px 32px rgba(23, 23, 19, 0.16);
}

html[data-style-system="content"] .cycle-methods strong,
html[data-style-system="content"] .cycle-methods span {
  display: block;
}

html[data-style-system="content"] .cycle-methods strong {
  font-size: var(--subtitle-size);
  line-height: 1.12;
}

html[data-style-system="content"] .cycle-methods span {
  color: rgba(255, 253, 248, 0.72);
  font-size: var(--body-small-size);
  font-weight: var(--accent-weight);
  line-height: 1.25;
}

html[data-style-system="content"] .cycle-lanes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 14px;
}

html[data-style-system="content"] .cycle-lane {
  padding: 14px;
  border: 1px solid rgba(23, 23, 19, 0.14);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.9);
  box-shadow: 0 10px 24px rgba(38, 33, 24, 0.07);
}

html[data-style-system="content"] .cycle-lane > p {
  margin: 0 0 12px;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  line-height: 1.15;
  text-transform: uppercase;
}

html[data-style-system="content"] .cycle-lane-red > p {
  color: var(--red);
}

html[data-style-system="content"] .cycle-lane ol {
  display: grid;
  gap: 14px;
  padding: 0;
  margin: 0;
  list-style: none;
}

html[data-style-system="content"] .cycle-lane li {
  position: relative;
  padding: 12px;
  border: 1px solid rgba(210, 200, 185, 0.8);
  border-radius: var(--radius);
  background: rgba(247, 244, 237, 0.72);
}

html[data-style-system="content"] .cycle-lane li + li::before {
  position: absolute;
  top: -14px;
  left: 50%;
  color: var(--blue);
  font-weight: var(--accent-weight);
  content: "↓";
  transform: translateX(-50%);
}

html[data-style-system="content"] .cycle-lane-red li + li::before {
  color: var(--red);
}

html[data-style-system="content"] .cycle-lane strong,
html[data-style-system="content"] .cycle-lane span {
  display: block;
}

html[data-style-system="content"] .cycle-lane strong {
  font-size: var(--body-size);
  line-height: 1.05;
}

html[data-style-system="content"] .cycle-lane span {
  margin-top: 6px;
  color: rgba(23, 23, 19, 0.68);
  font-size: var(--body-small-size);
  line-height: 1.3;
}

html[data-style-system="content"] .cycle-lane em {
  display: block;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
  color: var(--blue);
  font-size: var(--body-small-size);
  font-style: normal;
  font-weight: var(--accent-weight);
  line-height: 1.28;
}

html[data-style-system="content"] .regulation-track {
  grid-column: 1 / -1;
  padding: 20px;
  border: 1px solid rgba(210, 200, 185, 0.86);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.78);
  box-shadow: 0 12px 28px rgba(38, 33, 24, 0.06);
}

html[data-style-system="content"] .regulation-track ul {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding: 0;
  margin: 16px 0 0;
  list-style: none;
}

html[data-style-system="content"] .regulation-track li {
  padding: 14px;
  border: 1px solid rgba(210, 200, 185, 0.8);
  border-radius: var(--radius);
  background: rgba(247, 244, 237, 0.72);
}

html[data-style-system="content"] .regulation-track strong,
html[data-style-system="content"] .regulation-track span {
  display: block;
}

html[data-style-system="content"] .regulation-track span {
  margin-top: 7px;
  color: rgba(23, 23, 19, 0.7);
  font-size: var(--body-small-size);
  line-height: 1.38;
}

html[data-style-system="content"] .evolution-map {
  position: sticky;
  top: calc(var(--header-h) + 22px);
  min-height: 540px;
  overflow: hidden;
  padding: 22px;
  border: 1px solid rgba(210, 200, 185, 0.9);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(255, 253, 248, 0.92), rgba(247, 244, 237, 0.84)),
    radial-gradient(circle at 10% 20%, rgba(0, 108, 174, 0.15), transparent 30%),
    radial-gradient(circle at 90% 72%, rgba(165, 74, 68, 0.16), transparent 34%);
  box-shadow: var(--shadow-soft);
}

html[data-style-system="content"] .evolution-map > p {
  position: relative;
  z-index: 2;
  margin: 0;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  text-transform: uppercase;
}

html[data-style-system="content"] .evolution-track {
  position: relative;
  z-index: 2;
  display: grid;
  gap: 18px;
  margin-top: 20px;
}

html[data-style-system="content"] .evolution-node {
  width: min(84%, 360px);
  padding: 16px;
  border: 1px solid rgba(23, 23, 19, 0.14);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.9);
  box-shadow: 0 12px 28px rgba(38, 33, 24, 0.08);
}

html[data-style-system="content"] .evolution-node-1 {
  justify-self: center;
}

html[data-style-system="content"] .evolution-node-2 {
  justify-self: end;
}

html[data-style-system="content"] .evolution-node-3 {
  width: min(96%, 430px);
  justify-self: center;
  border-color: rgba(23, 23, 19, 0.28);
  background: var(--ink);
  color: var(--bg-strong);
}

html[data-style-system="content"] .evolution-node span {
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .evolution-node-3 span {
  color: #86cfff;
}

html[data-style-system="content"] .evolution-node h3 {
  margin: 8px 0 0;
  font-size: var(--body-large-size);
  line-height: 1.04;
}

html[data-style-system="content"] .evolution-node p {
  margin: 8px 0 0;
  color: rgba(23, 23, 19, 0.72);
  font-size: var(--body-small-size);
}

html[data-style-system="content"] .evolution-node-3 p {
  color: rgba(255, 253, 248, 0.76);
}

html[data-style-system="content"] .evolution-lines {
  position: absolute;
  inset: 72px 12px 12px;
  z-index: 1;
  width: calc(100% - 24px);
  height: calc(100% - 84px);
  opacity: 0.72;
}

html[data-style-system="content"] .evolution-lines path {
  fill: none;
  stroke-linecap: round;
  stroke-width: 10;
  filter: drop-shadow(0 12px 16px rgba(38, 33, 24, 0.12));
  vector-effect: non-scaling-stroke;
}

html[data-style-system="content"] .evolution-blue {
  stroke: var(--blue);
}

html[data-style-system="content"] .evolution-gold {
  stroke: var(--gold);
}

html[data-style-system="content"] .evolution-red {
  stroke: var(--red);
}

html[data-style-system="content"] .citation-strip {
  margin-top: 0;
  /* border-top: 1px solid var(--line); */
}

html[data-style-system="content"] .citation-strip summary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  text-transform: uppercase;
  cursor: pointer;
  list-style: none;
}

.citation-strip summary::marker,
.citation-strip summary::-webkit-details-marker {
  display: none;
  content: "";
}

.citation-strip summary::before {
  flex: 0 0 auto;
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 6px solid currentColor;
  content: "";
  transition: transform 160ms ease;
}

.citation-strip[open] summary::before {
  transform: rotate(90deg);
}

html[data-style-system="content"] .citation-strip summary span {
  display: inline-grid;
  min-width: 22px;
  height: 22px;
  place-items: center;
  border: 0.3px solid var(--ink);
  border-radius: 2px;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: 400;
}

html[data-style-system="content"] .citation-strip ul {
  display: grid;
  gap: 0;
  padding: 0;
  margin: 10px 0 0;
  list-style: none;
}

html[data-style-system="content"] .citation-strip li {
  padding: 16px 0;
  border: 0;
  border-top: 1px solid transparent;
  border-image: linear-gradient(90deg, transparent, var(--line-strong) 20%, var(--line-strong) 80%, transparent) 1;
  border-radius: 0;
  background: transparent;
}

html[data-style-system="content"] .citation-strip li:first-child {
  border-top: 0;
  border-image: none;
}

html[data-style-system="content"] .citation-strip strong,
html[data-style-system="content"] .citation-strip em {
  display: block;
}

html[data-style-system="content"] .citation-strip strong .citation-title {
  display: inline;
  margin-top: 0;
  font-weight: var(--body-weight);
}

html[data-style-system="content"] .citation-strip strong {
  font-size: var(--body-small-size);
  line-height: 1.16;
}

html[data-style-system="content"] .citation-strip em {
  margin-top: 4px;
  color: var(--blue);
  font-size: var(--accent-size);
  font-style: normal;
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .citation-strip p {
  margin: 6px 0 0 !important;
  color: rgba(23, 23, 19, 0.68) !important;
  font-size: var(--body-small-size) !important;
  line-height: 1.34 !important;
}

html[data-style-system="content"] .citation-strip a {
  margin-top: 6px;
  color: var(--blue);
  font-size: var(--body-small-size);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .citation-strip a.citation-title {
  margin-top: 0;
  font-weight: var(--body-weight);
}

html[data-style-system="content"] .project-engine {
  display: grid;
  grid-template-columns: minmax(0, 0.65fr) minmax(360px, 1fr);
  gap: clamp(24px, 5vw, 64px);
  align-items: start;
}

html[data-style-system="content"] .project-steps {
  position: relative;
  display: grid;
  gap: 10px;
  padding: 0;
  margin: 0;
  list-style: none;
}

html[data-style-system="content"] .project-steps::before {
  position: absolute;
  top: 26px;
  bottom: 26px;
  left: 55px;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(var(--blue), var(--gold), var(--red));
  content: "";
}

html[data-style-system="content"] .project-steps li {
  position: relative;
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  min-height: 74px;
  padding: 14px;
  border: 1px solid rgba(210, 200, 185, 0.86);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.82);
  box-shadow: 0 10px 24px rgba(38, 33, 24, 0.06);
}

html[data-style-system="content"] .project-steps span {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  border-radius: var(--radius);
  background: var(--ink);
  color: var(--bg-strong);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .project-steps p {
  margin: 0;
  color: rgba(23, 23, 19, 0.74);
}

html[data-style-system="content"] .statute-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 34px;
}

html[data-style-system="content"] .research-area-card {
  display: flex;
  flex-direction: column;
}

html[data-style-system="content"] .research-area-card .citation-strip {
  margin-top: auto;
}

html[data-style-system="content"] .card-grid,
html[data-style-system="content"] .path-grid,
html[data-style-system="content"] .role-tier-grid,
html[data-style-system="content"] .comparison-grid,
html[data-style-system="content"] .method-map,
html[data-style-system="content"] .evidence-list {
  display: grid;
  gap: 14px;
  margin-top: 34px;
}

html[data-style-system="content"] .card-grid.two,
html[data-style-system="content"] .comparison-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

html[data-style-system="content"] .card-grid.three,
html[data-style-system="content"] .path-grid,
html[data-style-system="content"] .role-tier-grid,
html[data-style-system="content"] .method-map {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

html[data-style-system="content"] .card-grid.four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

html[data-style-system="content"] .info-card,
html[data-style-system="content"] .path-card,
html[data-style-system="content"] .evidence-item,
html[data-style-system="content"] .contact-panel,
html[data-style-system="content"] .empty-state,
html[data-style-system="content"] .convergence-card {
  border: 1px solid rgba(210, 200, 185, 0.86);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.78);
  box-shadow: 0 10px 26px rgba(38, 33, 24, 0.055);
}

html[data-style-system="content"] .info-card,
html[data-style-system="content"] .path-card,
html[data-style-system="content"] .evidence-item,
html[data-style-system="content"] .comparison-card,
html[data-style-system="content"] .contact-panel,
html[data-style-system="content"] .empty-state {
  padding: 20px;
}

html[data-style-system="content"] .info-card h3,
html[data-style-system="content"] .path-card h3,
html[data-style-system="content"] .evidence-item h3,
html[data-style-system="content"] .comparison-card h2 {
  font-size: var(--body-large-size);
  line-height: 1.08;
}

html[data-style-system="content"] .info-card p,
html[data-style-system="content"] .path-card p,
html[data-style-system="content"] .evidence-item p,
html[data-style-system="content"] .comparison-card p {
  margin: 12px 0 0;
  color: rgba(23, 23, 19, 0.74);
}

html[data-style-system="content"] .comparison-card p {
  text-align: justify;
}

html[data-style-system="content"] .path-card {
  display: grid;
  align-content: start;
  gap: 12px;
}

html[data-style-system="content"] .path-card a,
html[data-style-system="content"] .evidence-item a,
html[data-style-system="content"] .evidence-item > span {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  align-self: end;
  color: var(--blue);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .proof-layout,
html[data-style-system="content"] .split {
  display: grid;
  gap: 34px;
  grid-template-columns: minmax(0, 0.8fr) minmax(320px, 1fr);
  align-items: start;
}

html[data-style-system="content"] .convergence-card {
  display: grid;
  gap: 18px;
  padding: 24px;
  overflow: hidden;
}

html[data-style-system="content"] .convergence-card img {
  width: 180px;
  filter: grayscale(1) contrast(1.35);
}

html[data-style-system="content"] .community-preview {
  display: grid;
  gap: 12px;
  padding: 20px;
  border: 1px solid rgba(210, 200, 185, 0.88);
  border-radius: var(--radius);
  background:
    linear-gradient(135deg, rgba(0, 108, 174, 0.08), transparent 38%),
    linear-gradient(225deg, rgba(175, 125, 42, 0.1), transparent 46%),
    rgba(255, 253, 248, 0.86);
  box-shadow: var(--shadow-soft);
}

html[data-style-system="content"] .community-preview-core {
  display: grid;
  gap: 8px;
  padding: 18px;
  border-radius: var(--radius);
  background: var(--ink);
  color: var(--bg-strong);
}

html[data-style-system="content"] .community-preview-core span,
html[data-style-system="content"] .community-preview li span {
  display: inline-grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 50%;
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .community-preview-core span {
  background: rgba(255, 253, 248, 0.14);
}

html[data-style-system="content"] .community-preview-core strong {
  font-size: var(--subtitle-size);
  line-height: 1.06;
}

html[data-style-system="content"] .community-preview-core p {
  margin: 0;
  color: rgba(255, 253, 248, 0.7);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .community-preview ol {
  display: grid;
  gap: 10px;
  padding: 0;
  margin: 0;
  list-style: none;
}

html[data-style-system="content"] .community-preview li {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 4px 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(23, 23, 19, 0.12);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.9);
}

html[data-style-system="content"] .community-preview li span {
  grid-row: span 2;
  background: var(--blue);
  color: var(--bg-strong);
}

html[data-style-system="content"] .community-preview li:nth-child(2) span {
  background: var(--gold);
}

html[data-style-system="content"] .community-preview li:nth-child(3) span {
  background: var(--red);
}

html[data-style-system="content"] .community-preview li strong,
html[data-style-system="content"] .community-preview li p {
  margin: 0;
}

html[data-style-system="content"] .community-preview li p {
  color: rgba(23, 23, 19, 0.66);
  font-size: var(--body-small-size);
}

html[data-style-system="content"] .community-preview > a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  color: var(--blue);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .role-tier-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 0;
}

html[data-style-system="content"] .role-orbits {
  position: relative;
  display: grid;
  grid-template-columns: minmax(330px, 0.9fr) minmax(0, 1fr);
  gap: clamp(22px, 4vw, 48px);
  align-items: center;
  min-height: 620px;
  overflow: hidden;
  padding: 100px 0;
  /* border: 1px solid rgba(210, 200, 185, 0.9);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 18% 16%, rgba(0, 108, 174, 0.12), transparent 32%),
    radial-gradient(circle at 86% 86%, rgba(175, 125, 42, 0.14), transparent 34%),
    rgba(255, 253, 248, 0.76);
  box-shadow: var(--shadow-soft); */
}

html[data-style-system="content"] .orbit-map {
  position: relative;
  display: grid;
  width: min(100%, 520px);
  min-height: 0;
  aspect-ratio: 1 / 1;
  justify-self: center;
  place-items: center;
}

html[data-style-system="content"] .orbit-ring,
html[data-style-system="content"] .orbit-core {
  position: absolute;
  border-radius: 50%;
}

html[data-style-system="content"] .orbit-ring {
  border: 2px solid rgba(23, 23, 19, 0.12);
}

html[data-style-system="content"] .orbit-ring span {
  position: absolute;
  right: 5%;
  bottom: 11%;
  max-width: 150px;
  padding: 8px 10px;
  /* border: 1px solid rgba(23, 23, 19, 0.12); */
  border-radius: 999px;
  background: rgba(255, 253, 248, 0.5);
  color: var(--ink);
  font-size: var(--body-small-size);
  font-weight: var(--accent-weight);
  line-height: 1.05;
  text-align: center;
  box-shadow: 0 5px 10px rgba(38, 33, 24, 0.08);
}

html[data-style-system="content"] .orbit-ring-3 {
  width: 100%;
  height: 100%;
  border-color: rgba(165, 74, 68, 0.3);
}

html[data-style-system="content"] .orbit-ring-2 {
  width: 78%;
  height: 78%;
  border-color: rgba(175, 125, 42, 0.3);
}

html[data-style-system="content"] .orbit-ring-1 {
  width: 56%;
  height: 56%;
  border-color: rgba(0, 108, 174, 0.3);
}

html[data-style-system="content"] .orbit-core {
  display: grid;
  width: clamp(116px, 34%, 174px);
  height: clamp(116px, 34%, 174px);
  min-width: 0;
  min-height: 0;
  place-items: center;
  padding: 22px;
  background: var(--ink);
  color: var(--bg-strong);
  text-align: center;
  box-shadow: 0 22px 42px rgba(23, 23, 19, 0.22);
}

html[data-style-system="content"] .orbit-core strong,
html[data-style-system="content"] .orbit-core small {
  display: block;
}

html[data-style-system="content"] .orbit-core strong {
  font-size: var(--subtitle-size);
  line-height: 0.96;
}

html[data-style-system="content"] .orbit-core small {
  max-width: 120px;
  color: rgba(255, 253, 248, 0.72);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  line-height: 1.15;
}

html[data-style-system="content"] .orbit-legend {
  display: grid;
  gap: 12px;
}

html[data-style-system="content"] .role-orbit {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 16px;
  /* border: 1px solid rgba(23, 23, 19, 0.15);
  border-radius: var(--radius); */
  /* background: rgba(255, 253, 248, 0.9); */
  /* box-shadow: 0 12px 26px rgba(38, 33, 24, 0.08); */
}

html[data-style-system="content"] .role-orbit span {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  /* border-radius: 50%; */
  /* background: var(--blue); */
  /* color: var(--bg-strong); */
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .role-orbit strong,
html[data-style-system="content"] .role-orbit small {
  display: block;
}

html[data-style-system="content"] .role-orbit strong {
  color: var(--ink);
  font-size: var(--body-large-size);
  line-height: 1.02;
}

html[data-style-system="content"] .role-orbit small {
  margin-top: 4px;
  color: var(--blue);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  text-transform: uppercase;
}

html[data-style-system="content"] .role-orbit p {
  margin: 10px 0 0;
  color: rgba(23, 23, 19, 0.7);
  font-size: var(--body-small-size);
  line-height: 1.38;
}

html[data-style-system="content"] .role-orbit-1 span {
  color: var(--blue);
}

html[data-style-system="content"] .role-orbit-2 span {
  color: var(--gold);
}

html[data-style-system="content"] .role-orbit-3 span {
  color: var(--red);
}

html[data-style-system="content"] .portrait-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 28px;
}

html[data-style-system="content"] .portrait-card {
  display: grid;
  grid-template-columns: minmax(124px, 0.44fr) minmax(0, 1fr);
  gap: 18px;
  min-height: 270px;
  padding: 16px;
  border: 1px solid rgba(210, 200, 185, 0.86);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.86);
  box-shadow: 0 12px 30px rgba(38, 33, 24, 0.07);
}

html[data-style-system="content"] .portrait-image {
  position: relative;
  display: flex;
  min-height: 236px;
  align-items: flex-end;
  justify-content: center;
  overflow: hidden;
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 48% 26%, rgba(255, 253, 248, 0.92) 0 12%, transparent 13%),
    radial-gradient(ellipse at 50% 80%, rgba(255, 253, 248, 0.86) 0 26%, transparent 27%),
    linear-gradient(145deg, rgba(0, 108, 174, 0.9), rgba(6, 22, 45, 0.96));
  filter: grayscale(0.16);
}

html[data-style-system="content"] .portrait-image::before,
html[data-style-system="content"] .portrait-image::after {
  position: absolute;
  content: "";
}

html[data-style-system="content"] .portrait-image::before {
  inset: 18% 27% 28%;
  border: 1px solid rgba(255, 253, 248, 0.42);
  border-radius: 999px 999px 26px 26px;
  background: linear-gradient(180deg, rgba(255, 253, 248, 0.22), rgba(255, 253, 248, 0.08));
}

html[data-style-system="content"] .portrait-image::after {
  inset: 0;
  background: repeating-linear-gradient(90deg, rgba(255, 253, 248, 0.08) 0 1px, transparent 1px 18px);
  mix-blend-mode: screen;
}

html[data-style-system="content"] .portrait-image span {
  position: relative;
  z-index: 2;
  margin: 0 10px 10px;
  padding: 7px 9px;
  border-radius: 999px;
  background: rgba(255, 253, 248, 0.9);
  color: var(--blue-strong);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  text-align: center;
}

html[data-style-system="content"] .portrait-copy h3 {
  margin: 4px 0 12px;
  font-size: var(--subtitle-size);
  line-height: 1.02;
}

html[data-style-system="content"] .portrait-role {
  margin: 0;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  text-transform: uppercase;
}

html[data-style-system="content"] .portrait-copy dl {
  display: grid;
  gap: 8px;
  margin: 0;
}

html[data-style-system="content"] .portrait-copy dt {
  color: var(--muted);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  text-transform: uppercase;
}

html[data-style-system="content"] .portrait-copy dd {
  margin: 2px 0 0;
  color: rgba(23, 23, 19, 0.76);
}

html[data-style-system="content"] .expertise-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  padding: 0;
  margin: 14px 0;
  list-style: none;
}

html[data-style-system="content"] .expertise-tags li {
  padding: 6px 8px;
  border: 1px solid rgba(0, 108, 174, 0.18);
  border-radius: 999px;
  background: rgba(0, 108, 174, 0.07);
  color: var(--blue-strong);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .portrait-copy p:last-child,
html[data-style-system="content"] .profile-note {
  color: rgba(23, 23, 19, 0.7);
}

html[data-style-system="content"] .profile-note {
  max-width: var(--measure);
  margin: 22px 0 0;
  font-size: var(--body-small-size);
}

/* .comparison-card {
  border-top: 4px solid var(--blue);
}

.comparison-card + .comparison-card {
  border-top-color: var(--red);
} */

html[data-style-system="content"] .legal-shell {
  max-width: 920px;
}

html[data-style-system="content"] .legal-document {
  padding: clamp(22px, 4vw, 44px);
  border: 1px solid rgba(210, 200, 185, 0.88);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.9);
  box-shadow: var(--shadow-soft);
}

html[data-style-system="content"] .legal-updated {
  margin: 0 0 24px;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  text-transform: uppercase;
}

html[data-style-system="content"] .legal-section {
  padding: 24px 0;
  border-top: 1px solid transparent;
  border-image: linear-gradient(90deg, transparent, var(--line-dark) 20%, var(--line-dark) 80%, transparent) 1;
}

html[data-style-system="content"] .legal-section:first-of-type {
  padding-top: 0;
  border-top: 0;
}

html[data-style-system="content"] .legal-section h2 {
  max-width: 920px;
  margin: 0 0 12px;
  font-size: var(--subtitle-size);
  line-height: 1.08;
}

html[data-style-system="content"] .legal-section p {
  max-width: 920px;
  margin: 10px 0 0;
  color: rgba(23, 23, 19, 0.74);
}

html[data-style-system="content"] .large-question,
html[data-style-system="content"] .demo-prompt {
  color: var(--blue) !important;
  font-size: var(--body-large-size);
  /* font-weight: var(--accent-weight); */
  line-height: 1.16;
}

html[data-style-system="content"] .raio-diagram {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 20px;
  /* border: 1px solid var(--line);
  border-radius: var(--radius);
  background:
    linear-gradient(135deg, var(--blue-soft), transparent 38%),
    linear-gradient(225deg, var(--red-soft), transparent 52%),
    rgba(255, 253, 248, 0.78); */
}

html[data-style-system="content"] .raio-diagram span {
  display: flex;
  min-height: 54px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(23, 23, 19, 0.14);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.78);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .demo-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 28px;
}

html[data-style-system="content"] .demo-tab {
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--bg-strong);
  color: var(--muted);
  font-weight: var(--accent-weight);
  cursor: pointer;
}

html[data-style-system="content"] .demo-tab.is-active {
  border-color: rgba(0, 108, 174, 0.45);
  background: rgba(0, 108, 174, 0.08);
  color: var(--ink);
}

html[data-style-system="content"] .demo-panel {
  margin-top: 18px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.8);
}

html[data-style-system="content"] .demo-panel[hidden] {
  display: none;
}

html[data-style-system="content"] .chatbot-shell {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

html[data-style-system="content"] .chat-column {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(210, 200, 185, 0.86);
  border-radius: var(--radius);
  background: rgba(247, 244, 237, 0.72);
}

html[data-style-system="content"] .chat-column.reflective {
  background:
    linear-gradient(135deg, rgba(0, 108, 174, 0.08), transparent 48%),
    rgba(255, 253, 248, 0.86);
}

html[data-style-system="content"] .chat-column-label {
  margin: 0;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  text-transform: uppercase;
}

html[data-style-system="content"] .chat-message {
  display: grid;
  gap: 6px;
  padding: 14px;
  border-radius: var(--radius);
  background: var(--bg-strong);
  box-shadow: 0 8px 18px rgba(38, 33, 24, 0.05);
}

html[data-style-system="content"] .chat-message.user {
  margin-right: 36px;
  border: 1px solid rgba(0, 108, 174, 0.18);
}

html[data-style-system="content"] .chat-message.assistant {
  margin-left: 36px;
  border: 1px solid rgba(23, 23, 19, 0.12);
}

html[data-style-system="content"] .chat-message.assistant.reflective {
  border-color: rgba(0, 108, 174, 0.28);
  background: rgba(0, 108, 174, 0.08);
}

html[data-style-system="content"] .chat-message span {
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  text-transform: uppercase;
}

html[data-style-system="content"] .chat-message p {
  margin: 0;
  color: rgba(23, 23, 19, 0.76);
}

html[data-style-system="content"] .demo-compare {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 18px;
}

html[data-style-system="content"] .demo-compare article {
  padding: 18px;
  border: 1px solid rgba(210, 200, 185, 0.86);
  border-radius: var(--radius);
  background: var(--bg-strong);
}

html[data-style-system="content"] .reference-drawer {
  margin-top: 26px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--bg-strong);
}

html[data-style-system="content"] .reference-drawer summary {
  cursor: pointer;
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .reference-drawer li + li {
  margin-top: 6px;
}

html[data-style-system="content"] .reference-drawer ul {
  padding: 0;
  list-style: none;
}

html[data-style-system="content"] .reference-drawer li {
  padding: 12px 0;
  border-top: 1px solid rgba(210, 200, 185, 0.74);
}

html[data-style-system="content"] .reference-drawer li:first-child {
  border-top: 0;
}

html[data-style-system="content"] .reference-drawer li strong,
html[data-style-system="content"] .reference-drawer li span {
  display: block;
}

html[data-style-system="content"] .reference-drawer li span {
  margin-top: 4px;
  color: var(--blue);
  font-size: var(--body-small-size);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .reference-drawer li p {
  margin: 6px 0 0;
  color: rgba(23, 23, 19, 0.68);
  font-size: var(--body-small-size);
}

html[data-style-system="content"] .narrative-timeline {
  position: relative;
  display: grid;
  gap: 12px;
  padding: 0;
  margin: 34px 0 0;
  list-style: none;
}

html[data-style-system="content"] .narrative-timeline::before {
  position: absolute;
  top: 24px;
  bottom: 24px;
  left: 92px;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(var(--blue), var(--gold), var(--red));
  content: "";
}

html[data-style-system="content"] .narrative-timeline li {
  position: relative;
  display: grid;
  grid-template-columns: 156px minmax(0, 1fr);
  gap: 10px 20px;
  padding: 18px;
  border: 1px solid rgba(210, 200, 185, 0.86);
  border-radius: var(--radius);
  background: rgba(255, 253, 248, 0.84);
  box-shadow: 0 12px 28px rgba(38, 33, 24, 0.06);
}

html[data-style-system="content"] .narrative-timeline li span {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  border-radius: var(--radius);
  background: var(--ink);
  color: var(--bg-strong);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .narrative-timeline h3 {
  margin: 0;
  font-size: var(--subtitle-size);
  line-height: 1.05;
}

html[data-style-system="content"] .narrative-timeline p {
  grid-column: 2;
  margin: 0;
  color: rgba(23, 23, 19, 0.74);
}

html[data-style-system="content"] .contact-panel {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  margin-top: 30px;
}

html[data-style-system="content"] .contact-panel span {
  color: var(--muted);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .empty-state {
  margin-top: 24px;
  border-style: dashed;
}

html[data-style-system="content"] .empty-state p {
  max-width: 820px;
  margin: 0;
  color: var(--muted);
}

html[data-style-system="content"] .final-cta {
  background:
    linear-gradient(90deg, rgba(0, 108, 174, 0.12), transparent 42%),
    linear-gradient(270deg, rgba(165, 74, 68, 0.12), transparent 46%),
    #151511;
  color: var(--bg-strong);
}

html[data-style-system="content"] .final-cta p {
  color: rgba(255, 253, 248, 0.78);
}

html[data-style-system="content"] .final-cta .button-secondary {
  color: var(--bg-strong);
  border-color: rgba(255, 253, 248, 0.36);
  background: rgba(255, 253, 248, 0.08);
}

html[data-style-system="content"] .site-footer {
  padding: 54px var(--page-x);
  background: #151511;
  color: rgba(255, 253, 248, 0.78);
}

html[data-style-system="content"] .footer-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 0.5fr) minmax(150px, 0.42fr) minmax(220px, 0.7fr);
  gap: 28px;
  width: min(100%, var(--max));
  margin: 0 auto;
}

html[data-style-system="content"] .footer-logo {
  width: 142px;
  margin-bottom: 14px;
  filter: invert(1) grayscale(1) brightness(2.2);
}

html[data-style-system="content"] .site-footer p {
  max-width: 560px;
  margin: 0 0 8px;
}

html[data-style-system="content"] .site-footer nav,
html[data-style-system="content"] .footer-languages {
  display: grid;
  gap: 8px;
}

html[data-style-system="content"] .site-footer a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: rgba(255, 253, 248, 0.9);
}

html[data-style-system="content"] .footer-heading {
  margin-top: 12px !important;
  color: var(--bg-strong);
}

html[data-style-system="content"] .footer-bottom {
  grid-column: 1 / -1;
  padding-top: 22px;
  border-top: 1px solid rgba(255, 253, 248, 0.18);
  color: rgba(255, 253, 248, 0.62);
  font-size: var(--body-small-size);
}

html[data-style-system="content"] .root-choice {
  display: grid;
  place-items: center;
  min-height: 100svh;
  padding: 30px var(--page-x);
  text-align: center;
}

html[data-style-system="content"] .root-choice img {
  width: 180px;
}

html[data-style-system="content"] .root-choice h1 {
  margin-top: 28px;
  font-size: var(--title-size);
}

html[data-style-system="content"] .root-choice p {
  max-width: 580px;
  margin: 18px 0 0;
  color: var(--muted);
  font-size: var(--body-large-size);
}

html[data-style-system="content"] .root-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 26px;
}

@media (min-width: 1250px) {
  html[data-style-system="content"] .journey-layout {
    grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);
    align-items: start;
  }

  html[data-style-system="content"] .journey-spine {
    padding: 18px;
  }

  html[data-style-system="content"] .journey-spine ol {
    grid-template-columns: 1fr;
  }

  html[data-style-system="content"] .journey-spine ol > li {
    min-height: 84px;
    padding: 12px 12px 12px 18px;
  }

  html[data-style-system="content"] .journey-spine ol > li::before {
    position: absolute;
    top: 14px;
    bottom: -14px;
    left: 7px;
    width: 2px;
    background: var(--line);
    content: "";
  }

  html[data-style-system="content"] .journey-spine ol > li:last-child::before {
    display: none;
  }

  html[data-style-system="content"] .stream-legend {
    display: grid;
  }

  html[data-style-system="content"] .story-chapter {
    grid-template-columns: minmax(0, 1fr) minmax(350px, 0.68fr);
  }
}

@media (max-width: 1180px) {
  html[data-style-system="content"] .header-inner {
    grid-template-columns: minmax(150px, auto) minmax(0, 1fr) auto auto;
  }

  html[data-style-system="content"] .site-nav,
  html[data-style-system="content"] .header-cta {
    display: none;
  }

  html[data-style-system="content"] .nav-toggle {
    display: grid;
    justify-self: end;
  }
}

@media (max-width: 1119px) {
  html[data-style-system="content"] .journey-spine {
    position: relative;
    top: auto;
  }
}

@media (max-width: 1250px) and (min-width: 921px) {
  html[data-style-system="content"] .header-inner {
    gap: 8px;
  }

  html[data-style-system="content"] .brand-link span {
    display: none;
  }

  html[data-style-system="content"] .site-nav a {
    padding-inline: 7px;
    font-size: var(--body-small-size);
  }
}

@media (max-width: 920px) {
  html[data-style-system="content"]:root {
    --header-h: 66px;
  }

  html[data-style-system="content"] .brand-link span {
    display: none;
  }

  html[data-style-system="content"] .card-grid.two,
  html[data-style-system="content"] .card-grid.three,
  html[data-style-system="content"] .card-grid.four,
  html[data-style-system="content"] .path-grid,
  html[data-style-system="content"] .role-tier-grid,
  html[data-style-system="content"] .comparison-grid,
  html[data-style-system="content"] .method-map,
  html[data-style-system="content"] .impact-layout,
  html[data-style-system="content"] .impact-grid,
  html[data-style-system="content"] .project-engine,
  html[data-style-system="content"] .statute-grid,
  html[data-style-system="content"] .regulation-track ul,
  html[data-style-system="content"] .chatbot-shell,
  html[data-style-system="content"] .domain-visual,
  html[data-style-system="content"] .proof-layout,
  html[data-style-system="content"] .split,
  html[data-style-system="content"] .demo-compare,
  html[data-style-system="content"] .footer-inner {
    grid-template-columns: 1fr;
  }

  html[data-style-system="content"] .story-chapter {
    min-height: auto;
  }

  /* .chapter-visual {
    min-height: 210px;
  } */

  /* .scientific-visual {
    min-height: 320px;
  } */

  html[data-style-system="content"] .evolution-map {
    position: relative;
    top: auto;
    min-height: auto;
  }

  html[data-style-system="content"] .impact-cycle-map {
    min-height: auto;
  }

  html[data-style-system="content"] .domain-core {
    width: min(100%, 280px);
    justify-self: center;
  }

  html[data-style-system="content"] .uncertainty-lens {
    grid-template-columns: 96px minmax(0, 1fr);
  }

  html[data-style-system="content"] .evolution-node,
  html[data-style-system="content"] .evolution-node-3 {
    width: 100%;
    justify-self: stretch;
  }

  html[data-style-system="content"] .project-steps::before {
    left: 26px;
  }

  html[data-style-system="content"] .project-steps li {
    grid-template-columns: 58px minmax(0, 1fr);
  }

  html[data-style-system="content"] .project-steps span {
    min-width: 54px;
    padding-inline: 8px;
    font-size: var(--accent-size);
  }

  html[data-style-system="content"] .role-orbits {
    grid-template-columns: 1fr;
    gap: 12px;
    min-height: auto;
    overflow: visible;
    padding: 18px;
  }

  html[data-style-system="content"] .orbit-map {
    min-height: 0;
  }

  html[data-style-system="content"] .portrait-grid {
    grid-template-columns: 1fr;
  }

  html[data-style-system="content"] .portrait-card {
    grid-template-columns: minmax(116px, 0.34fr) minmax(0, 1fr);
  }

  html[data-style-system="content"] .uncertainty-triad,
  html[data-style-system="content"] .decision-actions,
  html[data-style-system="content"] .decision-flow,
  html[data-style-system="content"] .causality-visual,
  html[data-style-system="content"] .trust-bridge {
    grid-template-columns: 1fr;
  }

  html[data-style-system="content"] .decision-flow i,
  html[data-style-system="content"] .bridge-line {
    width: 2px;
    height: 28px;
    justify-self: center;
    background: linear-gradient(var(--blue), var(--gold), var(--red));
  }

  html[data-style-system="content"] .decision-node {
    min-height: auto;
  }

  html[data-style-system="content"] .causal-orbit {
    min-height: 230px;
  }

  html[data-style-system="content"] .narrative-timeline::before {
    left: 25px;
  }

  html[data-style-system="content"] .narrative-timeline li {
    grid-template-columns: 60px minmax(0, 1fr);
  }

  html[data-style-system="content"] .narrative-timeline li span {
    min-width: 56px;
    padding-inline: 8px;
    font-size: var(--accent-size);
    text-align: center;
  }

  html[data-style-system="content"] .narrative-timeline p {
    grid-column: 2;
  }
}

@media (max-width: 560px) {
  html[data-style-system="content"] .header-inner {
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 6px;
    padding-inline: 12px;
  }

  html[data-style-system="content"] .brand-wordmark {
    width: 104px;
  }

  html[data-style-system="content"] .language-control {
    padding: 2px;
  }

  html[data-style-system="content"] .language-select {
    min-width: 62px;
    min-height: 40px;
    padding: 6px 22px 6px 7px;
  }
}

@media (max-width: 640px) {
  html[data-style-system="content"]:root {
    --display-size: clamp(2.2rem, 11.5vw, 3.2rem);
  }

  html[data-style-system="content"] .hero {
    min-height: auto;
    padding-top: 34px;
    padding-bottom: 20px;
  }

  html[data-style-system="content"] .hero h1 {
    font-size: var(--display-size);
  }

  html[data-style-system="content"] .hero-copy {
    margin-top: 20px;
    font-size: var(--body-size);
    line-height: 1.45;
  }

  html[data-style-system="content"] .hero-actions {
    gap: 8px;
    margin-top: 20px;
  }

  html[data-style-system="content"] .hero-actions,
  html[data-style-system="content"] .contact-panel {
    align-items: stretch;
  }

  html[data-style-system="content"] .button {
    width: 100%;
  }

  html[data-style-system="content"] .journey-spine {
    max-width: 100%;
    overflow-x: visible;
  }

  html[data-style-system="content"] .journey-spine ol {
    min-width: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-style-system="content"] .journey-spine ol > li {
    min-height: 44px;
  }

  html[data-style-system="content"] .journey-stream-field {
    opacity: 0.58;
  }

  html[data-style-system="content"] .story-chapter,
  html[data-style-system="content"] .info-card,
  html[data-style-system="content"] .path-card,
  html[data-style-system="content"] .evidence-item,
  html[data-style-system="content"] .impact-card,
  html[data-style-system="content"] .comparison-card,
  html[data-style-system="content"] .contact-panel,
  html[data-style-system="content"] .empty-state {
    padding: 16px;
  }

  html[data-style-system="content"] .visual-orbit span {
    max-width: 82%;
  }

  html[data-style-system="content"] .visual-topline,
  html[data-style-system="content"] .uncertainty-triad {
    grid-template-columns: 1fr;
  }

  html[data-style-system="content"] .visual-topline {
    display: grid;
    text-align: center;
  }

  html[data-style-system="content"] .impact-cycle-map {
    display: grid;
    min-height: auto;
    gap: 12px;
  }

  html[data-style-system="content"] .cycle-lanes {
    grid-template-columns: 1fr;
  }

  html[data-style-system="content"] .regulation-track,
  html[data-style-system="content"] .impact-card {
    padding: 16px;
  }

  html[data-style-system="content"] .uncertainty-lens {
    grid-template-columns: 1fr;
  }

  html[data-style-system="content"] .uncertainty-mini {
    grid-row: auto;
    width: 100%;
  }

  html[data-style-system="content"] .domain-core {
    width: min(88%, 270px);
    min-height: 118px;
  }

  html[data-style-system="content"] .domain-matrix article {
    grid-template-columns: 28px minmax(0, 1fr);
  }

  html[data-style-system="content"] .domain-ring {
    position: relative;
    inset: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 18px;
  }

  html[data-style-system="content"] .domain-ring span {
    position: static;
    max-width: none;
  }

  html[data-style-system="content"] .concept-cloud {
    position: relative;
    inset: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 16px;
  }

  html[data-style-system="content"] .mobile-language {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-style-system="content"] .chat-column,
  html[data-style-system="content"] .chat-message.user,
  html[data-style-system="content"] .chat-message.assistant {
    margin-inline: 0;
  }

  html[data-style-system="content"] .orbit-map {
    min-height: 0;
  }

  html[data-style-system="content"] .orbit-ring span {
    right: 50%;
    bottom: 4%;
    transform: translateX(50%);
  }

  html[data-style-system="content"] .orbit-core {
    padding: 16px;
  }

  html[data-style-system="content"] .portrait-card {
    grid-template-columns: 1fr;
  }

  html[data-style-system="content"] .portrait-image {
    min-height: 210px;
  }

  html[data-style-system="content"] .legal-document {
    padding: 18px;
  }

  html[data-style-system="content"] .narrative-timeline li {
    grid-template-columns: 1fr;
  }

  html[data-style-system="content"] .narrative-timeline::before {
    display: none;
  }

  html[data-style-system="content"] .narrative-timeline p {
    grid-column: auto;
  }
}

@media (max-width: 380px) {
  html[data-style-system="content"]:root {
    --page-x: 14px;
  }

  html[data-style-system="content"] .brand-wordmark {
    width: 106px;
  }

  html[data-style-system="content"] .page-hero h1,
  html[data-style-system="content"] .band h2,
  html[data-style-system="content"] .final-cta h2 {
    font-size: var(--title-size);
  }

  html[data-style-system="content"] .story-chapter h3 {
    font-size: var(--title-size);
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-style-system="content"] {
    scroll-behavior: auto;
  }

  html[data-style-system="content"], html[data-style-system="content"] *,
  html[data-style-system="content"]::before, html[data-style-system="content"] *::before,
  html[data-style-system="content"]::after, html[data-style-system="content"] *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.001ms !important;
  }
}



html[data-style-system="content"]:root {
  color-scheme: light;
  --font-serif: "Analogist", Georgia, "Times New Roman", serif;
  --font-sans: "Creato Display", Inter, ui-sans-serif, system-ui, sans-serif;
  --font-mono: ui-monospace, "SFMono-Regular", Menlo, Monaco, Consolas, monospace;
  --bg: #fbfaf6;
  --bg-soft: #f1eee7;
  --ink: #000016;
  --muted: #706c64;
  --line-dark: #c8c3ba;
  --line: #d8d3ca;
  --blue: #174ea6;
  --gold: #ae7c19;
  --red: #a94842;
  --teal: #1d716e;
  --max: 1240px;
  --copy: 720px;
  --title-size: clamp(2.15rem, 6.2vw, 4rem);
  --subtitle-size: clamp(1.6rem, 3vw, 2.4rem);
  --body-size: 1rem;
  --body-large-size: 1.15rem;
  --body-small-size: 0.9rem;
  --accent-size: 0.76rem;
  --accent-color: var(--blue);
  --accent-weight: 700;
  --page-x: clamp(20px, 5vw, 86px);
  --header-h: 70px;
  --intro-copy-offset: 33px;
  --need-question-gap: clamp(30px, 2vw, 60px);
  --need-question-height: clamp(60px, 25svh, 620px);
  --ease: cubic-bezier(0.22, 0.7, 0.2, 1);
}

html[data-style-system="content"], html[data-style-system="content"] * { box-sizing: border-box; }

html[data-style-system="content"] { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 20px); }

html[data-style-system="content"] body {
  min-width: 320px;
  margin: 0;
  overflow-x: hidden;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: var(--body-size);
  line-height: 1.55;
  text-rendering: geometricPrecision;
}

html[data-style-system="content"] body.modal-open,
html[data-style-system="content"] body.nav-open { overflow: hidden; }

html[data-style-system="content"] img, html[data-style-system="content"] svg { display: block; max-width: 100%; }

html[data-style-system="content"] a { color: inherit; text-decoration-color: rgba(23, 78, 166, 0.48); text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
html[data-style-system="content"] a:hover { text-decoration-color: currentColor; }

html[data-style-system="content"] button, html[data-style-system="content"] input, html[data-style-system="content"] textarea { font: inherit; }
html[data-style-system="content"] button, html[data-style-system="content"] a { -webkit-tap-highlight-color: transparent; }

html[data-style-system="content"] :focus-visible { outline: 3px solid #005fcc; outline-offset: 4px; }
html[data-style-system="content"]::selection,
html[data-style-system="content"] ::selection { background: var(--ink); color: var(--bg); }

html[data-style-system="content"] .visually-hidden,
html[data-style-system="content"] .skip-link:not(:focus) {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

html[data-style-system="content"] .skip-link:focus {
  position: fixed;
  top: 14px;
  left: 14px;
  z-index: 300;
  padding: 12px 16px;
  background: var(--ink);
  color: var(--bg);
  font-weight: 700;
}

html[data-style-system="content"] .site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  min-height: var(--header-h);
  border-bottom: 1px solid rgba(216, 211, 202, 0.58);
  background: rgba(251, 250, 246, 0.94);
  backdrop-filter: blur(15px);
  transition: box-shadow 180ms ease, background-color 180ms ease;
}

html[data-style-system="content"] .site-header.is-scrolled { background: rgba(251, 250, 246, 0.98); box-shadow: 0 8px 28px rgba(0, 0, 22, 0.06); }

html[data-style-system="content"] .header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  width: min(100%, calc(var(--max) + (var(--page-x) * 2)));
  min-height: var(--header-h);
  margin: 0 auto;
  padding: 10px var(--page-x);
}

html[data-style-system="content"] .brand-link { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; color: var(--ink); text-decoration: none; }
html[data-style-system="content"] .brand-icon { width: 30px; height: 30px; }
html[data-style-system="content"] .brand-wordmark { width: 130px; }

html[data-style-system="content"] .site-nav { min-width: 0; }
html[data-style-system="content"] .nav-list { display: flex; align-items: center; gap: clamp(4px, 1.4vw, 20px); padding: 0; margin: 0; list-style: none; }
html[data-style-system="content"] .nav-item { position: relative; }
html[data-style-system="content"] .nav-list a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 8px; color: rgba(0, 0, 22, 0.68); font-family: var(--font-serif); font-size: var(--body-size); text-decoration: none; }
html[data-style-system="content"] .nav-list a:hover, html[data-style-system="content"] .nav-list a.is-active, html[data-style-system="content"] .nav-list a[aria-current="page"] { color: var(--blue); }
html[data-style-system="content"] .nav-dropdown { position: absolute; top: calc(100% - 2px); left: 0; display: none; min-width: 220px; padding: 8px; border: 1px solid var(--line); background: var(--bg); box-shadow: 0 18px 40px rgba(0, 0, 22, 0.1); }
html[data-style-system="content"] .nav-item:hover .nav-dropdown, html[data-style-system="content"] .nav-item:focus-within .nav-dropdown { display: block; }
html[data-style-system="content"] .nav-dropdown a { width: 100%; min-height: 40px; padding: 9px 10px; }

html[data-style-system="content"] .nav-toggle { display: none; place-items: center; flex: 0 0 auto; width: 44px; height: 44px; border: 1px solid var(--line); background: transparent; color: var(--ink); cursor: pointer; }
html[data-style-system="content"] .nav-toggle-lines, html[data-style-system="content"] .nav-toggle-lines::before, html[data-style-system="content"] .nav-toggle-lines::after { display: block; width: 19px; height: 2px; background: currentColor; content: ""; }
html[data-style-system="content"] .nav-toggle-lines { position: relative; }
html[data-style-system="content"] .nav-toggle-lines::before, html[data-style-system="content"] .nav-toggle-lines::after { position: absolute; left: 0; }
html[data-style-system="content"] .nav-toggle-lines::before { top: -6px; }
html[data-style-system="content"] .nav-toggle-lines::after { top: 6px; }

html[data-style-system="content"] .section-frame { width: min(100%, var(--max)); margin: 0 auto; }
html[data-style-system="content"] .narrow-frame { width: min(100%, 920px); }
html[data-style-system="content"] .eyebrow { margin: 0 0 16px; color: var(--accent-color); font-family: var(--font-mono); font-size: var(--accent-size); font-weight: var(--accent-weight); letter-spacing: 0.04em; line-height: 1.2; text-transform: uppercase; }
html[data-style-system="content"] h1, html[data-style-system="content"] h2, html[data-style-system="content"] h3, html[data-style-system="content"] p { margin-top: 0; }
html[data-style-system="content"] h1, html[data-style-system="content"] h2 { font-family: var(--font-serif); font-weight: 400; letter-spacing: -0.025em; line-height: 0.98; }
html[data-style-system="content"] h1 { max-width: 1000px; margin-bottom: 28px; font-size: var(--title-size); }
html[data-style-system="content"] h2 { max-width: 960px; margin-bottom: 24px; font-size: var(--title-size); }
html[data-style-system="content"] h3 { margin-bottom: 10px; font-family: var(--font-serif); font-size: var(--subtitle-size); font-weight: 400; line-height: 1.05; }
html[data-style-system="content"] .lead { max-width: var(--copy); margin-bottom: 0; color: rgba(0, 0, 22, 0.76); font-size: var(--body-large-size); line-height: 1.42; }
html[data-style-system="content"] .two-column-intro .lead + .lead { margin-top: 24px; }
html[data-style-system="content"] .section-copy { max-width: var(--copy); color: rgba(0, 0, 22, 0.72); font-size: var(--body-size); text-align: justify; }
html[data-style-system="content"] .two-column-intro > .section-copy, html[data-style-system="content"] .definition-grid > .section-copy { padding-top: var(--intro-copy-offset); }
html[data-style-system="content"] .section-copy p:last-child { margin-bottom: 0; }
html[data-style-system="content"] .section-cta-line, html[data-style-system="content"] .evidence-line, html[data-style-system="content"] .contact-band, html[data-style-system="content"] .next-link { border-top: 1px solid var(--line); }
html[data-style-system="content"] .text-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 24px; color: var(--blue); font-size: var(--body-size); font-weight: 700; text-decoration: none; }
html[data-style-system="content"] .text-link span { font-size: 1.2em; }

/* Homepage hero */
html[data-style-system="content"] .home-hero { min-height: calc(100svh - var(--header-h)); padding: clamp(38px, 6vh, 84px) var(--page-x) clamp(54px, 8vh, 100px); background: var(--bg); }
html[data-style-system="content"] .hero-inner { display: grid; grid-template-columns: minmax(240px, 0.72fr) minmax(0, 1.28fr); align-items: center; gap: clamp(36px, 7vw, 120px); width: min(100%, var(--max)); min-height: calc(100svh - var(--header-h) - 120px); margin: 0 auto; }
html[data-style-system="content"] .hero-deck { max-width: 420px; margin: 0; color: var(--muted); font-size: var(--body-size); }
html[data-style-system="content"] .conversation { display: grid; gap: 20px; padding: clamp(20px, 3vw, 38px); border: 1px solid rgba(216, 211, 202, 0.9); background: rgba(255, 255, 255, 0.42); box-shadow: 0 22px 68px rgba(0, 0, 22, 0.09); }
html[data-style-system="content"] .message { display: flex; align-items: flex-start; gap: 14px; }
html[data-style-system="content"] .message-avatar { display: grid; place-items: center; flex: 0 0 auto; width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 50%; color: var(--muted); font-size: var(--body-small-size); }
html[data-style-system="content"] .message-avatar-ai img { filter: invert(1) grayscale(1) contrast(1.4); }
html[data-style-system="content"] .message-content { min-width: 0; max-width: 680px; }
html[data-style-system="content"] .message-content p { margin-bottom: 16px; }
html[data-style-system="content"] .message-user .message-content { padding-top: 5px; font-size: var(--body-large-size); font-weight: 500; }
html[data-style-system="content"] .message-name { margin-bottom: 13px !important; color: var(--accent-color); font-family: var(--font-mono); font-size: var(--accent-size); font-weight: var(--accent-weight); text-transform: uppercase; }
html[data-style-system="content"] .ai-response { color: rgba(0, 0, 22, 0.78); }
html[data-style-system="content"] .ai-response-text a { color: var(--blue); font-weight: 700; }
html[data-style-system="content"].has-js .type-unit { opacity: 0; transition: opacity 90ms linear; }
html[data-style-system="content"].has-js .type-unit.is-visible { opacity: 1; }
html[data-style-system="content"] .typing-cursor { display: inline-block; width: 0.55em; height: 1.05em; margin-right: 0.1em; vertical-align: -0.16em; background: var(--blue); animation: blink 800ms steps(1) infinite; }
@keyframes blink { 50% { opacity: 0; } }
html[data-style-system="content"] .composer-trigger { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; padding: 10px 10px 10px 16px; border-top: 1px solid var(--line); color: var(--muted); text-decoration: none; }
html[data-style-system="content"] .composer-body { display: grid; gap: 3px; min-width: 0; }
html[data-style-system="content"] .composer-placeholder { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html[data-style-system="content"] .composer-status { color: var(--accent-color); font-family: var(--font-mono); font-size: var(--accent-size); font-weight: var(--accent-weight); text-transform: uppercase; }
html[data-style-system="content"] .send-icon { display: grid; place-items: center; flex: 0 0 auto; width: 42px; height: 42px; background: var(--ink); color: var(--bg); }
html[data-style-system="content"] .send-icon svg { width: 20px; height: 20px; fill: currentColor; }

/* Homepage sections */
html[data-style-system="content"] .home-section {
  padding: clamp(90px, 12vw, 190px) var(--page-x);
}
html[data-style-system="content"] .section-need {
  background: var(--bg-soft);
}
html[data-style-system="content"] .section-solution {
  padding-block: clamp(64px, 8vw, 120px);
  background: var(--bg);
}
html[data-style-system="content"] .section-offer {
  background: var(--bg-soft);
}
html[data-style-system="content"] .two-column-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.92fr);
  gap: clamp(34px, 8vw, 150px); }
html[data-style-system="content"] .two-column-intro h2 {
  max-width: 650px;
}
html[data-style-system="content"] .need-question-stage {
  margin-top: var(--need-question-gap);
  padding: var(--need-question-gap) 0;
}
html[data-style-system="content"] .need-question-grid {
  --question-column-gap: clamp(18px, 3vw, 56px);
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 0.67fr) minmax(280px, 1.33fr);
  align-items: center;
  gap: var(--question-column-gap);
  width: 100%;
  min-height: var(--need-question-height);
  overflow: hidden;
}
html[data-style-system="content"] .sequence-statement {
  position: absolute;
  top: 50%;
  left: calc(50% - (var(--question-layout, 0) * 50%));
  display: grid; gap: 14px;
  width: calc(100% - (var(--question-layout, 0) * 55%));
  max-width: 680px;
  color: var(--muted);
  font-size: var(--body-size);
  text-align: center;
  transform: translate(calc(-50% + (var(--question-layout, 0) * 50%)), -50%);
  transition: left 120ms linear, width 120ms linear, transform 120ms linear;
}
html[data-style-system="content"] .sequence-statement strong {
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: clamp(2.25rem, 1vw, 4rem);
  font-weight: 400;
  line-height: 0.98;
  transition: color 120ms linear;
}
html[data-style-system="content"] .open-list {
  padding: 0;
  margin: 0;
  list-style: none;
}
html[data-style-system="content"] .need-question-stage .open-list {
  grid-column: 2;
  grid-row: 1;
  counter-reset: sequence;
}
html[data-style-system="content"] .need-question-stage .open-list li {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 12px;
  padding: 15px 0;
  font-family: var(--font-sans);
  font-size: clamp(1.75rem, 1vw, 4rem);
  font-weight: 400;
}
html[data-style-system="content"].has-js .need-question-stage .open-list li {
  opacity: var(--item-progress, 0);
  transform: translateX(calc((1 - var(--item-progress, 0)) * 30%));
  transition: opacity 120ms linear, transform 120ms linear;
}
html[data-style-system="content"].has-js .need-question-grid.is-question-split .sequence-statement {
  text-align: left;
}
html[data-style-system="content"] .need-question-stage .open-list li::before {
  color: var(--accent-color);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  counter-increment: sequence;
  content: "0" counter(sequence);
}
html[data-style-system="content"] .need-approaches {
  padding-top: var(--need-question-gap);
}
html[data-style-system="content"] .need-approaches > .lead {
  max-width: 950px;
  margin-right: auto;
  margin-bottom: clamp(60px, 3vw, 90px);
  margin-left: auto;
  text-align: center;
  border-top: 1px solid;
  border-image: linear-gradient(90deg, transparent, var(--line-dark) 20%, var(--line-dark) 80%, transparent) 1;
  /* border-image: linear-gradient(90deg, transparent, color-mix(in srgb, var(--line-dark) 45%, transparent) 3%, color-mix(in srgb, var(--line-dark) 45%, transparent) 97%, transparent) 1;  */
  padding-top: clamp(45px, 3vw, 90px);
}
html[data-style-system="content"] .approach-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(34px, 8vw, 150px);
}
/* .approach-column {
  padding-top: 24px;
} */
html[data-style-system="content"] .approach-column h3 {
  max-width: 600px;
  margin-bottom: 28px;
  font-size: clamp(2.15rem, 4.6vw, 4rem);
}
html[data-style-system="content"] .approach-column h3 a {
  text-decoration: none;
}
html[data-style-system="content"] .approach-question {
  max-width: 560px;
  margin-bottom: 20px;
  font-family: var(--font-sans);
  font-size: clamp(1.75rem, 1vw, 2.65rem);
  line-height: 1.03;
}
html[data-style-system="content"] .approach-column .lead {
  max-width: 480px;
}
html[data-style-system="content"] .solution-heading {
  text-align: center;
}
html[data-style-system="content"] .solution-heading h2, html[data-style-system="content"] .solution-heading .lead {
  margin-right: auto;
  margin-left: auto;
}
html[data-style-system="content"] .solution-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: clamp(46px, 8vw, 130px);
  margin-top: 94px;
}
html[data-style-system="content"] .section-solution .solution-grid {
  row-gap: clamp(28px, 4vw, 64px);
  margin-top: clamp(42px, 5vw, 72px);
}
html[data-style-system="content"] .solution-statement {
  align-self: center;
  max-width: 470px;
  color: var(--muted);
  font-size: var(--body-large-size);
  line-height: 1.25;
  text-align: justify;
}
html[data-style-system="content"] .home-ecosystem-visual {
  display: grid;
  place-items: center;
  position: static !important;
  top: auto !important;
  align-self: center;
  width: 100%;
  min-height: 0;
}
html[data-style-system="content"] .home-ecosystem-visual .ecosystem-wheel {
  position: relative;
  width: min(100%, 490px);
}
html[data-style-system="content"] .home-ecosystem-visual .wheel-label {
  position: absolute;
  color: var(--ink);
  cursor: default;
  font-size: clamp(0.82rem, 1.45vw, 1.3rem);
  gap: 0.3em;
  opacity: 1;
  pointer-events: none;
  transition: none !important;
  will-change: auto !important;
}
html[data-style-system="content"] .home-ecosystem-visual .wheel-label-icon,
html[data-style-system="content"] .home-ecosystem-visual .wheel-label-icon * {
  color: var(--ink);
  fill: var(--ink);
}
html[data-style-system="content"] .home-ecosystem-visual .wheel-label-icon {
  width: 1.8em;
  height: 1.8em;
}
html[data-style-system="content"] .home-pillars {
  display: grid;
  grid-column: 1 / -1;
  gap: clamp(24px, 4vw, 54px);
  padding-top: clamp(20px, 3vw, 42px);
  border-top: 1px solid transparent;
  border-image: linear-gradient(90deg, transparent 10%, var(--line-dark) 30%, var(--line-dark) 70%, transparent 90%) 1;
}
html[data-style-system="content"] .home-pillars .interdiscipline-intro {
  width: 100%;
  margin: 0;
  text-align: left;
}
html[data-style-system="content"] .home-pillars .interdiscipline-intro p:last-child {
  max-width: 970px;
  color: var(--muted);
  font-size: var(--body-large-size);
  line-height: 1.25;
  text-align: justify;
}
html[data-style-system="content"] .home-pillars .discipline-grid {
  width: 100%;
}
html[data-style-system="content"] .home-pillars .discipline-roles {
  gap: 4px;
}
html[data-style-system="content"] .home-pillars .discipline-role {
  min-height: 0;
  padding: 10px 14px;
}
html[data-style-system="content"] .home-pillars .discipline-role::before {
  display: none;
}
html[data-style-system="content"] .home-pillars .discipline-role h3::before {
  content: "•";
  display: inline-block;
  margin-right: 0.55em;
  color: var(--discipline-accent);
}
html[data-style-system="content"] .index {
  display: block;
  margin-bottom: 14px;
  color: var(--accent-color); font-family: var(--font-mono); font-size: var(--accent-size); font-weight: var(--accent-weight);
}
html[data-style-system="content"] .ecosystem-note {
  grid-column: 1 / -1;
  max-width: 820px;
  padding-top: 18px;
  margin: 0;
  border-top: 1px solid var(--line);
  color: var(--teal);
  font-size: var(--body-large-size);
}
html[data-style-system="content"] .offer-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
  gap: clamp(40px, 9vw, 150px);
  margin-top: 94px;
}
html[data-style-system="content"] .offer-list {
  border-top: 1px solid var(--ink);
}
html[data-style-system="content"] .offer-list div {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 18px;
  align-items: center;
  min-height: 68px;
  border-bottom: 1px solid var(--line);
}
html[data-style-system="content"] .offer-list span {
  color: var(--accent-color);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
}
html[data-style-system="content"] .offer-list p {
  margin: 0;
  font-size: var(--body-large-size);
  font-weight: 500;
}
html[data-style-system="content"] .offer-principles {
  align-self: center;
  padding-left: 30px;
  border-left: 1px solid var(--line);
  color: rgba(0, 0, 22, 0.72);
}
html[data-style-system="content"] .quote {
  margin-bottom: 24px;
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: clamp(1.8rem, 3vw, 3.25rem);
  line-height: 1;
}
html[data-style-system="content"] .evidence-line {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 36px;
  padding-top: 28px;
  margin-top: 96px;
}
html[data-style-system="content"] .evidence-line > div {
  max-width: 760px;
}
html[data-style-system="content"] .evidence-line .eyebrow {
  margin-bottom: 10px;
}
html[data-style-system="content"] .evidence-line p:last-child {
  margin: 0;
  font-size: var(--body-large-size);
}
html[data-style-system="content"] .contact-band {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 38px;
  padding-top: 56px;
  margin-top: 92px;
}
html[data-style-system="content"] .contact-band h2 {
  margin-bottom: 14px;
}
html[data-style-system="content"] .contact-band p:not(.eyebrow) {
  max-width: 580px;
  margin-bottom: 0;
  color: var(--muted);
  font-size: var(--body-large-size);
}
html[data-style-system="content"] .cta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
html[data-style-system="content"] .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 16px;
  border: 1px solid transparent;
  font-weight: 700;
  line-height: 1.15;
  text-align: center;
  text-decoration: none;
  transition: transform 160ms ease, background-color 160ms ease, border-color 160ms ease;
}
html[data-style-system="content"] .button:hover {
  transform: translateY(-2px);
}
html[data-style-system="content"] .button-primary {
  background: var(--ink);
  color: var(--bg);
}
html[data-style-system="content"] .button-outline {
  border-color: var(--ink);
  background: transparent;
  color: var(--ink);
}
html[data-style-system="content"] .button-outline:hover {
  background: rgba(0, 0, 22, 0.06);
}
html[data-style-system="content"] .button-text {
  color: var(--blue);
}

/* Detail pages */
html[data-style-system="content"] .detail-hero { padding: clamp(110px, 16vw, 250px) var(--page-x) clamp(100px, 12vw, 180px); background: var(--bg); }
html[data-style-system="content"] .detail-hero-inner { text-align: center; }
html[data-style-system="content"] .detail-hero h1 { max-width: 1120px; margin-right: auto; margin-left: auto; }
html[data-style-system="content"] .detail-hero .lead { max-width: 850px; margin-right: auto; margin-left: auto; }
html[data-style-system="content"] .editorial-section { padding: clamp(100px, 13vw, 190px) var(--page-x); }
html[data-style-system="content"] .tinted-section { background: var(--bg-soft); }
html[data-style-system="content"] .definition-grid { display: grid; grid-template-columns: minmax(260px, 0.75fr) minmax(0, 1fr); gap: clamp(40px, 9vw, 150px); }
html[data-style-system="content"] .definition-grid .section-copy { font-size: var(--body-size); }
html[data-style-system="content"] .numbered-columns { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; padding-top: 32px; margin-top: 90px; border-top: 1px solid var(--line); }
html[data-style-system="content"] .numbered-columns article { padding-right: 28px; border-right: 1px solid var(--line); }
html[data-style-system="content"] .numbered-columns article:last-child { border-right: 0; }
html[data-style-system="content"] .numbered-columns p { color: var(--muted); }
html[data-style-system="content"] .reflection-quote { max-width: 920px; padding: 38px 0; margin-top: 86px; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
html[data-style-system="content"] .reflection-quote p { margin: 0; font-family: var(--font-serif); font-size: clamp(2rem, 4vw, 4rem); line-height: 0.98; }
html[data-style-system="content"] .contrast-lines { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; padding-top: 40px; margin-top: 80px; border-top: 1px solid var(--line); }
html[data-style-system="content"] .contrast-lines div { padding-right: 16px; border-right: 1px solid var(--line); }
html[data-style-system="content"] .contrast-lines div:last-child { border-right: 0; }
html[data-style-system="content"] .contrast-lines span, html[data-style-system="content"] .large-list span { color: var(--accent-color); font-family: var(--font-mono); font-size: var(--accent-size); font-weight: var(--accent-weight); text-transform: uppercase; }
html[data-style-system="content"] .contrast-lines p { margin: 12px 0 0; font-family: var(--font-serif); font-size: 1.65rem; line-height: 1; }
html[data-style-system="content"] .large-list { max-width: 900px; margin-top: 78px; }
html[data-style-system="content"] .large-list div { display: grid; grid-template-columns: minmax(140px, 0.38fr) 1fr; gap: 26px; padding: 20px 0; border-top: 1px solid var(--line); }
html[data-style-system="content"] .large-list p { margin: 0; font-size: var(--body-large-size); }
html[data-style-system="content"] .detail-next {
  padding: 0 var(--page-x);
  background: var(--bg);
}
html[data-style-system="content"] .next-link {
  display: grid;
  grid-template-columns: 0.1fr 0.3fr 0.3fr;
  align-items: center;
  gap: 22px;
  padding: 34px 0 54px;
}
html[data-style-system="content"] .next-link .eyebrow {
  margin: 0;
  text-align: left;
}
html[data-style-system="content"] .next-link a {
  /* display: flex;  */
  /* justify-content: space-between;  */
  gap: 0px;
  color: var(--blue);
  font-family: var(--font-serif);
  font-size: var(--subtitle-size);
  line-height: 0.95;
  text-decoration: none;
  text-align: left;
}
html[data-style-system="content"] .next-link p {
  margin: 0;
  color: var(--muted);
  font-size: var(--body-large-size);
}

/* Methodology and ecosystem stages */
html[data-style-system="content"] .methodology-stage, html[data-style-system="content"] .ecosystem-stage { display: grid; grid-template-columns: minmax(300px, 0.7fr) minmax(420px, 1.3fr); gap: clamp(40px, 8vw, 140px); align-items: start; margin-top: 90px; }
html[data-style-system="content"] .stage-copy { display: grid; gap: 0; }
html[data-style-system="content"] .stage-panel { position: relative; padding: 28px 0 30px 30px; border-top: 1px solid var(--line); opacity: 0.4; transition: opacity 300ms ease, transform 300ms ease; }
html[data-style-system="content"] .stage-panel:last-child { border-bottom: 1px solid var(--line); }
html[data-style-system="content"] .stage-panel::before { position: absolute; top: 0; bottom: 0; left: 0; width: 2px; background: var(--blue); content: ""; transform: scaleY(0); transform-origin: top; transition: transform 300ms ease; }
html[data-style-system="content"] .stage-panel.is-active { opacity: 1; transform: translateX(8px); }
html[data-style-system="content"] .stage-panel.is-active::before { transform: scaleY(1); }
html[data-style-system="content"] .stage-panel p { max-width: 430px; margin: 0; color: var(--muted); }
html[data-style-system="content"] .stage-panel[data-stage-node] { cursor: pointer; }
html[data-style-system="content"] .stage-panel[data-stage-node]:focus-visible { outline-offset: 7px; }
html[data-style-system="content"] .stage-panel .reveal { max-height: 0; font-family: var(--font-mono); font-size: var(--body-small-size); margin-top: 0; overflow: hidden; opacity: 0; pointer-events: none; transform: translateY(-8px); transition: max-height 420ms var(--ease), margin-top 420ms var(--ease), opacity 220ms ease, transform 420ms var(--ease); }
html[data-style-system="content"] .stage-panel.is-active .reveal { max-height: 20rem; margin-top: 18px; opacity: 1; pointer-events: auto; transform: translateY(0); }
html[data-style-system="content"] .method-visual, html[data-style-system="content"] .ecosystem-visual { position: sticky; top: calc(var(--header-h) + 48px); width: 100%; min-width: 0; min-height: min(62vw, 720px); }
html[data-style-system="content"] .method-visual {
  width: min(100%, 720px);
  height: auto;
  min-height: 0;
  aspect-ratio: 1;
  margin-inline: auto;
  overflow: visible;
  container-type: inline-size;
  --method-orbit-diameter: 39%;
}
html[data-style-system="content"] .method-lines { position: absolute; inset: 4%; width: 92%; height: 92%; overflow: visible; }
html[data-style-system="content"] .method-lines path { fill: none; stroke: rgba(0, 0, 22, 0.45); stroke-width: 0.7; vector-effect: non-scaling-stroke; }
html[data-style-system="content"] .method-core { position: absolute; top: 50%; left: 50%; display: grid; place-items: center; width: 25%; height: 25%; min-width: 0; min-height: 0; aspect-ratio: 1; padding: 24px; border: 1px solid var(--ink); border-radius: 50%; background: var(--ink); color: var(--bg); font-family: var(--font-serif); font-size: clamp(0.8rem, 1.4vw, 1.3rem); line-height: 0.95; text-align: center; transform: translate(-50%, -50%); }
html[data-style-system="content"] .method-core::before { position: absolute; inset: 9px; border: 1px solid var(--bg); border-radius: 50%; content: ""; }
html[data-style-system="content"] .method-core img { position: relative; z-index: 1; width: 47%; margin-bottom: 8px; filter: invert(1) grayscale(1) contrast(1.5); }
html[data-style-system="content"] .method-node {
  position: absolute;
  z-index: 2;
  display: grid;
  place-items: center;
  width: clamp(74px, 23%, 154px);
  height: clamp(74px, 23%, 154px);
  min-height: 0;
  aspect-ratio: 1;
  padding: clamp(8px, 0.75vw, 16px);
  padding: clamp(8px, 1.5cqw, 16px);
  border: 1px solid var(--ink);
  border-radius: 50%;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: clamp(0.8rem, 1.6vw, 1.45rem);
  font-size: clamp(0.8rem, 3.2cqw, 1.45rem);
  line-height: 1.05;
  text-align: center;
  text-wrap: balance;
  overflow-wrap: anywhere;
  cursor: pointer;
  transition: none;
}
/* The orbit diameter matches the 19.5% polar radius used by subnodes. */
html[data-style-system="content"] .method-node::before {
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--method-orbit-diameter);
  aspect-ratio: 1;
  border: 1px dashed rgba(0, 0, 22, 0.4);
  border-radius: 50%; content: "";
  pointer-events: none;
  transform: translate(-50%, -50%) scale(var(--method-ring-scale, 1));
  transition: transform 320ms var(--ease);
}
html[data-style-system="content"] .method-node.is-active::before { --method-ring-scale: 1; }
html[data-style-system="content"] .method-node.is-active { background: var(--ink); color: var(--bg); transform: translate(-50%, -50%) scale(1.06); transform-origin: center; }
@media (hover: hover) {
  html[data-style-system="content"] .method-node:hover:not(.is-active) { transform: translate(-50%, -50%) scale(1.03); }
}
html[data-style-system="content"] .method-node {
  transform: translate(-50%, -50%);
}
html[data-style-system="content"] .node-explainability {
  top: 39%;
  left: 83%;
}
html[data-style-system="content"] .node-uncertainty {
  top: 15%;
  left: 50%;
}
html[data-style-system="content"] .node-causality {
  top: 39%;
  left: 17%;
}
html[data-style-system="content"] .node-regulatory {
  top: 78.4%;
  left: 29.5%;
}
html[data-style-system="content"] .node-ethical {
  top: 78.4%;
  left: 70.5%;
}
html[data-style-system="content"] .method-subnode {
  position: absolute;
  z-index: 3;
  display: grid;
  place-items: center;
  width: clamp(72px, 13%, 136px);
  height: clamp(72px, 13%, 136px);
  min-height: 0;
  aspect-ratio: 1;
  visibility: hidden;
  padding: clamp(5px, 0.5vw, 12px);
  padding: clamp(5px, 1cqw, 12px);
  border: 1px solid transparent;
  border-radius: 50%;
  background: transparent;
  color: transparent;
  opacity: 0;
  pointer-events: none;
  font-family: var(--font-serif);
  font-size: clamp(0.42rem, 0.925vw, 0.95rem);
  /* font-size: clamp(0.62rem, 2.1cqw, 0.95rem);  */
  line-height: 1.05;
  text-align: center;
  text-wrap: balance;
  overflow-wrap: anywhere;
  cursor: pointer;
  transform: translate(-50%, -50%);
  transition: none;
  --parent-x: 50%;
  --parent-y: 50%;
  --angle: 0deg;
  --radius: 19%;
  left: calc(var(--parent-x) + var(--radius) * cos(var(--angle)));
  top: calc(var(--parent-y) + var(--radius) * sin(var(--angle)));
}
html[data-style-system="content"] .method-subnode::before { position: absolute;  color: transparent; background: transparent; content: ""; }
html[data-style-system="content"] .method-subnode.is-visible { visibility: visible; border-color: var(--ink); background: var(--bg); color: var(--ink); opacity: 1; pointer-events: auto; transform: translate(-50%, -50%) scale(1.06); }
html[data-style-system="content"] .methodology-section .method-subnode { transition: opacity 220ms ease, transform 320ms var(--ease), visibility 0s linear 320ms; }
html[data-style-system="content"] .methodology-section .method-subnode.is-visible { transition-delay: 0s; }

/* Publication subnodes appear only while a paper detail is open. */
html[data-style-system="content"] .publication-map-stage { align-items: start; }
html[data-style-system="content"] .publication-map-stage .method-subnode { visibility: hidden; border-color: transparent; background: transparent; color: transparent; opacity: 0; pointer-events: none; transition: opacity 320ms ease, transform 320ms var(--ease), visibility 0s linear 320ms; }
html[data-style-system="content"] .publication-map-stage.is-publication-detail-open .method-subnode { visibility: visible; border-color: var(--ink); background-color: var(--bg); color: var(--ink); opacity: 1; pointer-events: none; transition-delay: 0s; }
html[data-style-system="content"] .publication-map-stage.is-publication-detail-open .method-subnode.is-visible { transform: translate(-50%, -50%) scale(1.06); }
html[data-style-system="content"] .publication-map-stage .method-subnode.is-publication-related { background: var(--blue); border-color: var(--blue); color: var(--bg); transform: translate(-50%, -50%) scale(1.08); }
html[data-style-system="content"] .publication-map-stage .method-node.is-publication-related { border-color: var(--blue); box-shadow: 0 0 0 5px color-mix(in srgb, var(--blue) 16%, transparent); }
html[data-style-system="content"] .publication-map-stage .method-node.is-publication-related::before { --method-ring-scale: 1; }
html[data-style-system="content"] .publication-map-stage .method-node.is-map-selected { background: var(--ink); color: var(--bg); transform: translate(-50%, -50%) scale(1.06); }
html[data-style-system="content"] .publication-map-stage .method-node.is-map-selected::before { --method-ring-scale: 1; }
html[data-style-system="content"] .publication-map-stage.is-publication-detail-open .method-node::before { --method-ring-scale: 1; }
html[data-style-system="content"] .publication-map-stage .method-subnode.is-publication-dimmed,
html[data-style-system="content"] .publication-map-stage .method-node.is-publication-dimmed { opacity: 0.22; }
html[data-style-system="content"] .publication-map-stage .method-subnode { z-index: 4; }
html[data-style-system="content"] .publication-map-stage .method-node.is-publication-dimmed {
  opacity: 1;
  background-color: var(--bg);
  color: color-mix(in srgb, var(--ink) 24%, var(--bg));
  border-color: color-mix(in srgb, var(--ink) 24%, var(--bg));
}
html[data-style-system="content"] .publication-map-stage .method-subnode.is-publication-dimmed {
  opacity: 1;
  color: color-mix(in srgb, var(--ink) 24%, var(--bg));
  border-color: color-mix(in srgb, var(--ink) 24%, var(--bg));
}

html[data-style-system="content"] .publication-browser {
  width: 100%;
  overflow: hidden;
  /* border-top: 1px solid var(--line);  */
  /* border-bottom: 1px solid var(--line);  */
  background: var(--bg);
}
html[data-style-system="content"] .publication-browser-track {
  display: flex;
  width: 200%;
  align-items: stretch;
  transition: transform 500ms var(--ease);
}
html[data-style-system="content"] .publication-browser.is-detail-open .publication-browser-track {
  transform: translateX(-50%);
}
html[data-style-system="content"] .publication-list-view, html[data-style-system="content"] .publication-detail-view {
  flex: 0 0 50%;
  min-width: 0;
  max-height: min(70vh, 720px);
  overflow-y: auto;
  padding: 18px 24px 24px 0;
  scrollbar-color: var(--line-dark) transparent;
}
html[data-style-system="content"] .publication-detail-view {
  padding: 28px 26px 34px;
}
html[data-style-system="content"] .publication-map-stage .publication-list-view,
html[data-style-system="content"] .publication-map-stage .publication-detail-view {
  max-height: none;
  overflow: visible;
}
html[data-style-system="content"] .publication-browser.is-detail-open .publication-list-view {
  height: 0;
  min-height: 0;
  max-height: 0;
  padding-top: 0;
  padding-bottom: 0;
  overflow: hidden;
}
/* .publication-list-heading { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 16px; margin: 0; padding: 0 0 12px; color: var(--ink); font-family: var(--font-mono); font-size: var(--accent-size); font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; } */
/* .publication-list-heading span { color: var(--muted); font-weight: 400; letter-spacing: 0; text-transform: none; } */
html[data-style-system="content"] .publication-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
html[data-style-system="content"] .publication-item {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 13px 0 13px 16px;
  border-top: 1px solid transparent;
  border-image: linear-gradient(90deg, transparent, var(--line) 25%, var(--line) 75%, transparent) 1;
  transition: opacity 200ms ease, background 200ms ease;
}
html[data-style-system="content"] .publication-item::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 2px;
  background: var(--blue);
  content: "";
  opacity: 0;
  transition: opacity 200ms ease;
}
html[data-style-system="content"] .publication-item.is-related { background: color-mix(in srgb, var(--blue) 7%, transparent); }
html[data-style-system="content"] .publication-item.is-related::before { opacity: 1; }
html[data-style-system="content"] .publication-item.is-dimmed { opacity: 0.28; }
html[data-style-system="content"] .publication-title {
  display: block;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: var(--body-large-size);
  line-height: 1.08;
  text-align: left;
  cursor: pointer;
}
html[data-style-system="content"] .publication-title:hover, html[data-style-system="content"] .publication-title:focus-visible {
  color: var(--blue);
}
html[data-style-system="content"] .publication-year { padding-top: 2px; color: var(--muted); font-family: var(--font-mono); font-size: var(--body-small-size); white-space: nowrap; }
html[data-style-system="content"] .publication-back { display: inline-flex; gap: 8px; align-items: center; margin: 0 0 30px; padding: 0; border: 0; background: transparent; color: var(--blue); font-family: var(--font-mono); font-size: var(--body-small-size); cursor: pointer; }
html[data-style-system="content"] .publication-detail-view h2 {
  margin: 0 0 18px;
  font-family: var(--font-sans);
  font-size: var(--subtitle-size);
  line-height: 0.98;
}
html[data-style-system="content"] .publication-detail-meta { margin: 0 0 26px; color: var(--muted); font-family: var(--font-mono); font-size: var(--body-small-size); }
html[data-style-system="content"] .publication-detail-label { margin: 18px 0 3px; color: var(--blue); font-family: var(--font-mono); font-size: var(--accent-size); font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
html[data-style-system="content"] .publication-detail-url {
  color: var(--blue);
  font-weight: 700;
  overflow-wrap: anywhere;
}
html[data-style-system="content"] .publication-detail-url.is-placeholder {
  color: var(--muted);
  text-decoration: none;
}
html[data-style-system="content"] .publication-data-note { margin-top: 32px !important; padding-top: 16px; border-top: 1px solid var(--line); color: var(--muted); font-family: var(--font-mono); font-size: var(--body-small-size); }
/* Subnodes use polar coordinates around their parent node.
   CSS angles start at the right and increase clockwise. */
html[data-style-system="content"] .subnode-calibration {
  --parent-x: 17%;
  --parent-y: 39%;
  --angle: 165deg;
}
html[data-style-system="content"] .subnode-anomalies {
  --parent-x: 17%;
  --parent-y: 39%;
  --angle: 90deg;
}
html[data-style-system="content"] .subnode-epistemic {
  --parent-x: 17%;
  --parent-y: 39%;
  --angle: 240deg;
}
html[data-style-system="content"] .subnode-abstention {
  --parent-x: 17%;
  --parent-y: 39%;
  --angle: 315deg;
}

html[data-style-system="content"] .subnode-counterfactuals {
  --parent-x: 50%;
  --parent-y: 15%;
  --angle: 270deg;
}
html[data-style-system="content"] .subnode-attribution {
  --parent-x: 50%;
  --parent-y: 15%;
  --angle: 195deg;
}
html[data-style-system="content"] .subnode-causal-effect {
  --parent-x: 50%;
  --parent-y: 15%;
  --angle: 345deg;
}

html[data-style-system="content"] .subnode-rights {
  --parent-x: 29.5%;
  --parent-y: 78.4%;
  --angle: 50deg;
}
html[data-style-system="content"] .subnode-risk {
  --parent-x: 29.5%;
  --parent-y: 78.4%;
  --angle: 200deg;
}
html[data-style-system="content"] .subnode-accountability {
  --parent-x: 29.5%;
  --parent-y: 78.4%;
  --angle: 125deg;
}

html[data-style-system="content"] .subnode-agency {
  --parent-x: 70.5%;
  --parent-y: 78.4%;
  --angle: 340deg;
}
html[data-style-system="content"] .subnode-dignity {
  --parent-x: 70.5%;
  --parent-y: 78.4%;
  --angle: 55deg;
}
html[data-style-system="content"] .subnode-vulnerability {
  --parent-x: 70.5%;
  --parent-y: 78.4%;
  --angle: 130deg;
}

html[data-style-system="content"] .subnode-mechanistic {
  --parent-x: 83%;
  --parent-y: 39%;
  --angle: 300deg;
}
html[data-style-system="content"] .subnode-faithfulness {
  --parent-x: 83%;
  --parent-y: 39%;
  --angle: 15deg;
}
html[data-style-system="content"] .subnode-stability {
  --parent-x: 83%;
  --parent-y: 39%;
  --angle: 225deg;
}
html[data-style-system="content"] .subnode-alignment {
  --parent-x: 83%;
  --parent-y: 39%;
  --angle: 90deg;
}
html[data-style-system="content"] .method-footnote, html[data-style-system="content"] .cycle-line {
  max-width: 820px;
  padding: 28px 0 0;
  /* margin-top: 80px;  */
  /* border-top: 1px solid var(--line);  */
  color: var(--teal);
  font-size: var(--body-large-size);
}
html[data-style-system="content"] .method-footnote p, html[data-style-system="content"] .cycle-line p {
  margin: 0;
}
html[data-style-system="content"] .interdiscipline-story {
  position: relative;
  background: var(--bg);
}
html[data-style-system="content"] .interdiscipline-sticky {
  display: flex; flex-direction: column;
  justify-content: center;
  min-height: 100vh;
  overflow: hidden;
  padding: calc(var(--header-h) + 38px) var(--page-x) 48px;
  gap: clamp(20px, 4vh, 44px);
}
html[data-style-system="content"] .interdiscipline-intro {
  width: min(1180px, 86vw);
  margin: 0 auto;
  text-align: center;
}
html[data-style-system="content"] .interdiscipline-intro p {
  margin: 0;
}
html[data-style-system="content"] .interdiscipline-intro p:last-child {
  font-family: var(--font-sans);
  font-size: clamp(1.2rem, 1.95vw, 2.55rem);
  line-height: 1.4;
}
html[data-style-system="content"] .section-kicker {
  margin-bottom: 18px !important;
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: clamp(3.5rem, 4.45vw, 4.5rem);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 0.98;
}
html[data-style-system="content"] .discipline-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: min(1480px, 100%);
  min-height: clamp(340px, 47vh, 540px);
  margin: 0 auto;
}
html[data-style-system="content"] .discipline-column {
  --discipline-accent: var(--accent-color);
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: clamp(340px, 47vh, 540px);
  padding: 0 clamp(18px, 2.45vw, 42px);
  gap: clamp(10px, 1.45vh, 18px);
}
html[data-style-system="content"] .discipline-column + .discipline-column::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 1px;
  /* background: linear-gradient(to bottom, transparent, color-mix(in srgb, var(--line-dark) 45%, transparent) 12%, color-mix(in srgb, var(--line-dark) 45%, transparent) 88%, transparent);  */
  content: "";
}
html[data-style-system="content"] .discipline-index {
  margin: 0;
  color: var(--discipline-accent);
  font-family: var(--font-mono);
  font-size: clamp(0.66rem, 0.72vw, 0.82rem);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
}
html[data-style-system="content"] .discipline-heading {
  display: grid; gap: 6px;
}
html[data-style-system="content"] .discipline-column h2, html[data-style-system="content"] .discipline-column h3, html[data-style-system="content"] .discipline-summary, html[data-style-system="content"] .discipline-role p {
  margin: 0;
}
html[data-style-system="content"] .discipline-column h2 {
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: var(--subtitle-size);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
}
html[data-style-system="content"] .discipline-summary {
  height: clamp(82px, 8.4vh, 104px);
  color: color-mix(in srgb, var(--ink) 78%, transparent);
  font-family: var(--font-sans);
  font-size: clamp(0.96rem, 1.14vw, 1.24rem);
  line-height: 1.34;
}
html[data-style-system="content"] .discipline-roles {
  display: grid;
  gap: 10px;
  margin-top: 0;
}
html[data-style-system="content"] .discipline-role {
  min-height: clamp(74px, 8.4vh, 104px);
  padding: clamp(11px, 1.4vh, 16px) clamp(12px, 1.35vw, 18px);
  border: 1px solid transparent;
  /* border-left-color: var(--discipline-accent);  */
  border-radius: 0px;
  /* background: transparent;  */
  position: relative;
}
html[data-style-system="content"] .discipline-role::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 1px;
  background: linear-gradient(to bottom, transparent, var(--discipline-accent) 12%, var(--discipline-accent) 88%, transparent);

}
html[data-style-system="content"] .discipline-role h3 {
  color: var(--discipline-accent);
  font-family: var(--font-sans);
  font-size: var(--body-small-size);
  font-weight: 700;
  line-height: 1.12;
}
html[data-style-system="content"] .discipline-role p {
  margin-top: 6px;
  color: color-mix(in srgb, var(--ink) 66%, transparent);
  font-family: var(--font-sans);
  font-size: var(--body-small-size);
  line-height: 1.32;
}
html[data-style-system="content"] .ecosystem-stage { grid-template-columns: minmax(300px, 0.8fr) minmax(420px, 1.2fr); }
html[data-style-system="content"] .ecosystem-visual { display: grid; place-items: center; min-height: min(55vw, 650px); }
html[data-style-system="content"] .ecosystem-wheel { position: relative; width: min(100%, 590px); aspect-ratio: 1; }
html[data-style-system="content"] .wheel-rings { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; overflow: visible; }
html[data-style-system="content"] .outer-fill { fill: rgba(216, 211, 202, 0.48); fill: color-mix(in srgb, var(--line) 48%, transparent); }
html[data-style-system="content"] .wheel-logo { position: absolute; top: 50%; left: 50%; z-index: 2; width: 21%; aspect-ratio: 1; transform: translate(-50%, -50%); }
html[data-style-system="content"] .wheel-logo img { width: 100%; height: 100%; filter: grayscale(0.5) contrast(2) brightness(0.8); object-fit: contain; }
html[data-style-system="content"] .wheel-label { position: absolute; top: var(--label-y, 50%); left: var(--label-x, 50%); z-index: 3; display: inline-flex; flex-direction: column; align-items: center; gap: 0.42em; width: max-content; max-width: 11ch; padding: 0; border: 0; background: transparent; color: rgba(0, 0, 22, 0.34); color: color-mix(in srgb, var(--ink) 34%, transparent); cursor: pointer; font-family: var(--font-serif); font-size: clamp(1rem, 1.8vw, 1.7rem); font-weight: 400; line-height: 1.08; text-align: center; opacity: var(--label-opacity, 0.54); transform: translate(-50%, -50%); transition: color 200ms ease, opacity 200ms ease; will-change: left, top, opacity, color; }
html[data-style-system="content"] .wheel-label-icon { width: 2.15em; height: 2.15em; fill: currentColor; overflow: visible; }
html[data-style-system="content"] .wheel-label-icon * { fill: currentColor; }
html[data-style-system="content"] .wheel-label.is-active { color: var(--ink); }
@media (hover: hover) { html[data-style-system="content"] .wheel-label:hover { color: var(--ink); opacity: 1; } }
html[data-style-system="content"] .cycle-line { margin-top: 70px; font-family: var(--font-serif); font-size: clamp(1.5rem, 2.4vw, 2.6rem); line-height: 1.05; }

/* Footer and modal */
html[data-style-system="content"] .site-footer { padding: 72px var(--page-x) 34px; background: var(--ink); color: rgba(251, 250, 246, 0.75); }
html[data-style-system="content"] .footer-inner { display: grid; grid-template-columns: 1.2fr 0.7fr 0.9fr; gap: 48px; width: min(100%, var(--max)); margin: 0 auto; }
html[data-style-system="content"] .footer-logo { width: 150px; margin-bottom: 18px; filter: invert(1) grayscale(1) brightness(2); }
html[data-style-system="content"] .site-footer p { max-width: 420px; margin-bottom: 8px; }
html[data-style-system="content"] .site-footer nav { display: grid; align-content: start; gap: 7px; }
html[data-style-system="content"] .site-footer a { color: rgba(251, 250, 246, 0.92); }
html[data-style-system="content"] .site-footer nav a { min-height: 30px; text-decoration: none; }
html[data-style-system="content"] .footer-heading { margin-top: 4px; color: var(--bg); font-family: var(--font-mono); font-size: var(--accent-size); font-weight: var(--accent-weight); text-transform: uppercase; }
html[data-style-system="content"] .footer-bottom { grid-column: 1 / -1; padding-top: 24px; margin-top: 10px !important; border-top: 1px solid rgba(251, 250, 246, 0.2); font-size: var(--body-small-size); }
html[data-style-system="content"] .modal[hidden] { display: none; }
html[data-style-system="content"] .modal { position: fixed; inset: 0; z-index: 250; display: grid; place-items: center; padding: 18px; }
html[data-style-system="content"] .modal-backdrop { position: absolute; inset: 0; background: rgba(0, 0, 22, 0.58); }
html[data-style-system="content"] .modal-panel { position: relative; width: min(100%, 700px); max-height: min(760px, 100%); overflow: auto; padding: clamp(26px, 5vw, 52px); background: var(--bg); box-shadow: 0 30px 90px rgba(0, 0, 0, 0.3); }
html[data-style-system="content"] .modal-panel h2 { padding-right: 34px; }
html[data-style-system="content"] .modal-panel p:not(.eyebrow) { color: rgba(0, 0, 22, 0.76); }
html[data-style-system="content"] .modal-close { position: absolute; top: 14px; right: 14px; display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid var(--line); background: transparent; color: var(--ink); cursor: pointer; }
html[data-style-system="content"] .modal-close span { font-size: 1.7rem; line-height: 1; }
html[data-style-system="content"] .modal-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }

html[data-style-system="content"].has-js [data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity 700ms var(--ease), transform 700ms var(--ease); }
html[data-style-system="content"].has-js [data-reveal].is-revealed { opacity: 1; transform: none; }

@media (max-width: 920px) {
  html[data-style-system="content"]:root { --header-h: 62px; }
  html[data-style-system="content"] .nav-toggle { display: grid; }
  html[data-style-system="content"] .site-nav { position: absolute; top: 100%; right: var(--page-x); left: var(--page-x); display: none; padding: 8px; border: 1px solid var(--line); background: var(--bg); box-shadow: 0 18px 40px rgba(0, 0, 22, 0.1); }
  html[data-style-system="content"] .site-nav.is-open { display: block; }
  html[data-style-system="content"] .nav-list { display: grid; gap: 2px; }
  html[data-style-system="content"] .nav-list a { width: 100%; padding: 12px; }
  html[data-style-system="content"] .nav-dropdown { position: static; min-width: 0; padding: 0 0 4px 12px; border: 0; box-shadow: none; }
  html[data-style-system="content"] .hero-inner, html[data-style-system="content"] .two-column-intro, html[data-style-system="content"] .definition-grid, html[data-style-system="content"] .methodology-stage, html[data-style-system="content"] .ecosystem-stage, html[data-style-system="content"] .offer-layout { grid-template-columns: 1fr; }
  html[data-style-system="content"] .hero-inner { gap: 46px; }
  html[data-style-system="content"] .hero-intro h1 { max-width: 740px; }
  html[data-style-system="content"] .hero-deck { max-width: 600px; }
  html[data-style-system="content"] .question-stage { margin-top: var(--need-question-gap); }
  html[data-style-system="content"] .need-question-grid { grid-template-columns: 1fr; gap: 36px; }
  html[data-style-system="content"] .sequence-statement { position: static; grid-column: 1; width: 100%; max-width: 680px; text-align: center; transform: none; }
  html[data-style-system="content"] .need-question-stage .open-list { grid-column: 1; grid-row: auto; }
  html[data-style-system="content"] .approach-grid { gap: 54px; }
  html[data-style-system="content"] .solution-heading { text-align: left; }
  html[data-style-system="content"] .solution-heading h2, html[data-style-system="content"] .solution-heading .lead { margin-left: 0; }
  html[data-style-system="content"] .solution-grid { grid-template-columns: 1fr; margin-top: 60px; }
  html[data-style-system="content"] .solution-statement { max-width: 650px; }
  html[data-style-system="content"] .ecosystem-note { grid-column: auto; }
  html[data-style-system="content"] .offer-layout { margin-top: 58px; }
  html[data-style-system="content"] .offer-principles { padding: 30px 0 0; border-top: 1px solid var(--line); border-left: 0; }
  html[data-style-system="content"] .method-visual, html[data-style-system="content"] .ecosystem-visual { position: relative; top: auto; width: min(100%, 660px); margin: 20px auto 0; }
  html[data-style-system="content"] .stage-copy { order: 2; }
  html[data-style-system="content"] .method-visual, html[data-style-system="content"] .ecosystem-visual { order: 1; }
  html[data-style-system="content"] .interdiscipline-sticky { justify-content: flex-start; padding-top: calc(var(--header-h) + 32px); gap: 22px; }
  html[data-style-system="content"] .interdiscipline-intro { width: min(100%, 720px); }
  html[data-style-system="content"] .discipline-grid { grid-template-columns: 1fr; width: min(100%, 680px); min-height: min(58vh, 540px); }
  html[data-style-system="content"] .discipline-column { min-height: min(58vh, 540px); padding: 0; gap: 12px; }
  html[data-style-system="content"] .discipline-summary { height: auto; }
  html[data-style-system="content"] .discipline-column + .discipline-column::before { display: none; }
  html[data-style-system="content"] .discipline-roles { gap: 8px; }
  html[data-style-system="content"] .discipline-role { min-height: auto; padding: 11px 12px; }
  html[data-style-system="content"] .numbered-columns { grid-template-columns: 1fr; gap: 0; }
  html[data-style-system="content"] .numbered-columns article { padding: 25px 0; border-right: 0; border-top: 1px solid var(--line); }
  html[data-style-system="content"] .contrast-lines { grid-template-columns: repeat(2, 1fr); }
  html[data-style-system="content"] .contrast-lines div:nth-child(2) { border-right: 0; }
  html[data-style-system="content"] .next-link { grid-template-columns: 1fr; gap: 12px; }
  html[data-style-system="content"] .next-link p { max-width: 500px; }
  html[data-style-system="content"] .contact-band, html[data-style-system="content"] .evidence-line { align-items: flex-start; flex-direction: column; }
  html[data-style-system="content"] .footer-inner { grid-template-columns: 1fr 1fr; }
  html[data-style-system="content"] .two-column-intro > .section-copy, html[data-style-system="content"] .definition-grid > .section-copy { padding-top: 0; }
}

@media (max-width: 560px) {
  html[data-style-system="content"] .home-hero { padding-top: 44px; }
  html[data-style-system="content"] .conversation { padding: 18px; }
  html[data-style-system="content"] .message { gap: 10px; }
  html[data-style-system="content"] .message-avatar { width: 28px; height: 28px; }
  html[data-style-system="content"] .message-user .message-content { font-size: var(--body-large-size); }
  html[data-style-system="content"] .composer-placeholder { font-size: var(--body-small-size); }
  html[data-style-system="content"] .approach-grid { grid-template-columns: 1fr; }
  html[data-style-system="content"] .approach-column h3 { font-size: 3rem; }
  html[data-style-system="content"] .offer-list div { grid-template-columns: 32px 1fr; gap: 8px; }
  html[data-style-system="content"] .offer-list p { font-size: var(--body-size); }
  html[data-style-system="content"] .contrast-lines { grid-template-columns: 1fr; }
  html[data-style-system="content"] .contrast-lines div, html[data-style-system="content"] .contrast-lines div:nth-child(2) { padding: 17px 0; border-right: 0; border-bottom: 1px solid var(--line); }
  html[data-style-system="content"] .large-list div { grid-template-columns: 1fr; gap: 8px; }
  html[data-style-system="content"] .method-visual { width: calc(100vw - 30px); margin-left: 50%; transform: translateX(-50%); }
  html[data-style-system="content"] .methodology-section .method-node { width: clamp(74px, 21%, 154px); font-size: clamp(0.76rem, 3.2cqw, 1.2rem); }
  html[data-style-system="content"] .method-core { width: 27%; height: 27%; padding: 10px; font-size: 0.75rem; }
  html[data-style-system="content"] .methodology-section .method-subnode {
    width: clamp(72px, 18%, 136px);
    font-size: clamp(0.58rem, 2.1cqw, 0.84rem);
  }
  html[data-style-system="content"] .publication-map-stage .method-subnode {
    width: clamp(72px, 18%, 136px);
    height: clamp(72px, 18%, 136px);
    font-size: clamp(0.58rem, 2.1cqw, 0.84rem);
     padding: clamp(5px, 1cqw, 12px);
    }
  html[data-style-system="content"] .publication-list-view, html[data-style-system="content"] .publication-detail-view {
    max-height: 68vh;
    padding-right: 14px;
  }
  html[data-style-system="content"] .publication-detail-view {
    padding: 24px 14px 28px 0;
  }
  html[data-style-system="content"] .publication-item {
    grid-template-columns: 1fr auto;
    gap: 8px;
    padding-left: 12px;
  }
  html[data-style-system="content"] .publication-title {
    font-size: 1.06rem;
  }
  html[data-style-system="content"] .publication-list-heading { display: block; }
  html[data-style-system="content"] .publication-list-heading span { display: block; margin-top: 5px; }
  html[data-style-system="content"] .ecosystem-visual { width: calc(100vw - 30px); margin-left: 50%; transform: translateX(-50%); }
  html[data-style-system="content"] .wheel-label { font-size: 1.15rem; }
  html[data-style-system="content"] .footer-inner { grid-template-columns: 1fr; gap: 30px; }
  html[data-style-system="content"] .footer-bottom { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
  html[data-style-system="content"] { scroll-behavior: auto; }
  html[data-style-system="content"], html[data-style-system="content"] *, html[data-style-system="content"]::before, html[data-style-system="content"] *::before, html[data-style-system="content"]::after, html[data-style-system="content"] *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: 0.01ms !important; }
  html[data-style-system="content"].has-js [data-reveal] { opacity: 1; transform: none; }
  html[data-style-system="content"].has-js .type-unit { opacity: 1; }
  html[data-style-system="content"].has-js .need-question-stage .open-list li { opacity: 1; transform: none; }
}

/*
 * English visual layer
 *
 * The English content pages use the current content components, while the
 * research and publications pages use the editorial system in public/old.
 * Load both systems here and make the current components inherit the older
 * typography, spacing, colour and chrome. The other locales keep using the
 * shared production stylesheet.
 */
html[data-style-system="content"]:root {
  --bg-strong: var(--bg);
  --bg-alt: var(--bg-soft);
  --ink-soft: var(--ink);
  --line-strong: var(--line-dark);
  --focus: #005fcc;
  --display-size: var(--title-size);
  --body-weight: 400;
  --section-y: clamp(100px, 13vw, 190px);
  --measure: var(--copy);
  --radius: 0;
  --shadow: 0 22px 68px rgba(0, 0, 22, 0.09);
  --shadow-soft: 0 12px 34px rgba(0, 0, 22, 0.06);
}

/* Keep the current English pages aligned with the fixed shared header. The
   imported editorial layer otherwise restores its sticky header rule. */
html[data-style-system="content"] .site-header {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  min-height: var(--header-h);
}

html[data-style-system="content"] .our-story-page {
  --radius: 5px;
}

html[data-style-system="content"] .our-story-page .journey-spine,
html[data-style-system="content"] .our-story-page .story-chapter,
html[data-style-system="content"] .our-story-page .chapter-insight,
html[data-style-system="content"] .our-story-page .scientific-visual,
html[data-style-system="content"] .our-story-page .visual-card,
html[data-style-system="content"] .our-story-page .uncertainty-lens,
html[data-style-system="content"] .our-story-page .decision-node,
html[data-style-system="content"] .our-story-page .domain-matrix article {
  border-radius: 5px;
}

html[data-style-system="content"] .our-story-page .chapter-body {
  text-align: justify;
}

/* Let each chapter end after its own content instead of inheriting the
   viewport-sized minimum from the shared chapter component. */
html[data-style-system="content"] .our-story-page .story-chapter {
  min-height: 0;
  align-content: start;
}

html[data-style-system="content"] .our-story-page .visual-topline {
  justify-content: center;
  text-align: center;
}

html[data-style-system="content"] .our-story-page .institution-visual .visual-topline {
  border-bottom: 1px solid transparent;
}

html[data-style-system="content"] .our-story-page .ethics-visual {
  display: grid;
  align-content: start;
  gap: 0;
  padding-bottom: 18px;
}

html[data-style-system="content"] .our-story-page .ethics-path {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  min-height: 132px;
  padding: 22px 22px 18px;
}

html[data-style-system="content"] .our-story-page .ethics-path::before {
  position: absolute;
  top: 30px;
  right: 18%;
  left: 18%;
  z-index: 0;
  height: 1.5px;
  background: linear-gradient(90deg, var(--blue), var(--gold), var(--red));
  content: "";
}

html[data-style-system="content"] .our-story-page .ethics-step {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: 5px;
  min-width: 0;
  text-align: center;
}

html[data-style-system="content"] .our-story-page .ethics-step::before {
  width: 13px;
  height: 13px;
  margin-bottom: 4px;
  border: 3px solid var(--bg-strong);
  border-radius: 50%;
  background: var(--blue);
  box-shadow: 0 0 0 1px var(--blue);
  content: "";
}

html[data-style-system="content"] .our-story-page .ethics-step-1::before {
  background: var(--gold);
  box-shadow: 0 0 0 1px var(--gold);
}

html[data-style-system="content"] .our-story-page .ethics-step-2::before {
  background: var(--red);
  box-shadow: 0 0 0 1px var(--red);
}

html[data-style-system="content"] .our-story-page .ethics-step span,
html[data-style-system="content"] .our-story-page .ethics-step small {
  color: var(--muted);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  line-height: 1.2;
}

html[data-style-system="content"] .our-story-page .ethics-step span {
  color: var(--blue);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .our-story-page .ethics-step-1 span {
  color: var(--gold);
}

html[data-style-system="content"] .our-story-page .ethics-step-2 span {
  color: var(--red);
}

html[data-style-system="content"] .our-story-page .ethics-step strong {
  font-family: var(--font-serif);
  font-size: var(--body-large-size);
  font-weight: 400;
  line-height: 1.05;
}

html[data-style-system="content"] .our-story-page .ethics-principles {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  padding: 14px 22px 16px;
}

html[data-style-system="content"] .our-story-page .ethics-principle {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 4px 10px;
  align-items: start;
  min-width: 0;
  padding: 7.5px;
}

html[data-style-system="content"] .our-story-page .ethics-principle span {
  grid-row: span 2;
  display: block;
  min-height: 0;
  margin: 0;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .our-story-page .ethics-principle h4 {
  margin: 0;
  font-size: var(--body-size);
  line-height: 1.08;
}

html[data-style-system="content"] .our-story-page .ethics-principle p {
  margin: 0;
  color: rgba(23, 23, 19, 0.65);
  font-size: var(--body-small-size);
  line-height: 1.28;
}

html[data-style-system="content"] .our-story-page .ethics-outcome {
  background: transparent;
}

html[data-style-system="content"] .our-story-page .reflective-visual {
  display: grid;
  align-content: start;
  gap: 0;
  padding-bottom: 18px;
}

html[data-style-system="content"] .our-story-page .reflective-field {
  position: relative;
  min-height: 420px;
  margin: 10px 15px 10px;
  overflow: visible;
}

html[data-style-system="content"] .our-story-page .reflective-streams {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}

html[data-style-system="content"] .our-story-page .reflective-stream {
  fill: none;
  stroke-linecap: round;
  stroke-width: 1.1;
  opacity: 0.5;
  vector-effect: non-scaling-stroke;
}

html[data-style-system="content"] .our-story-page .reflective-stream-blue { stroke: var(--blue); }
html[data-style-system="content"] .our-story-page .reflective-stream-gold { stroke: var(--gold); }
html[data-style-system="content"] .our-story-page .reflective-stream-red { stroke: var(--red); }

html[data-style-system="content"] .our-story-page .reflective-pole,
html[data-style-system="content"] .our-story-page .reflective-pulse {
  position: absolute;
  z-index: 2;
}

html[data-style-system="content"] .our-story-page .reflective-pole {
  display: grid;
  width: 100%;
  gap: 6px;
  color: var(--ink);
}

html[data-style-system="content"] .our-story-page .reflective-question {
  top: 6%;
  left: 4%;
  text-align: left;
}

html[data-style-system="content"] .our-story-page .reflective-commitment {
  right: 4%;
  bottom: 6%;
  text-align: right;
}

html[data-style-system="content"] .our-story-page .reflective-pole span,
html[data-style-system="content"] .our-story-page .reflective-pulse span {
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  line-height: 1.15;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

html[data-style-system="content"] .our-story-page .reflective-pole span {
  color: var(--blue);
  font-size: clamp(0.56rem, 1.4vw, var(--accent-size));
  letter-spacing: -0.03em;
}

html[data-style-system="content"] .our-story-page .reflective-commitment span { color: var(--red); }

html[data-style-system="content"] .our-story-page .reflective-pole strong {
  font-family: var(--font-serif);
  font-size: var(--body-large-size);
  font-weight: 400;
  line-height: 1.06;
}

html[data-style-system="content"] .our-story-page .reflective-pulse {
  display: grid;
  width: min(60%, 168px);
  min-width: 0;
  gap: 4px;
  text-align: left;
}

html[data-style-system="content"] .our-story-page .reflective-pulse span {
  color: var(--blue);
}

html[data-style-system="content"] .our-story-page .reflective-pulse strong {
  font-family: var(--font-serif);
  font-size: var(--body-size);
  font-weight: 400;
  line-height: 1.05;
}

html[data-style-system="content"] .our-story-page .reflective-pulse small {
  color: rgba(23, 23, 19, 0.66);
  font-family: var(--font-sans);
  font-size: 0.8rem;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

html[data-style-system="content"] .our-story-page .reflective-pulse-0 { top: 16%; left: 38%; }
html[data-style-system="content"] .our-story-page .reflective-pulse-1 { top: 34%; left: 12%; }
html[data-style-system="content"] .our-story-page .reflective-pulse-2 { top: 52%; left: 38%; }
html[data-style-system="content"] .our-story-page .reflective-pulse-3 { top: 70%; left: 12%; }

html[data-style-system="content"] .our-story-page .reflective-pulse-1 span { color: var(--gold); }
html[data-style-system="content"] .our-story-page .reflective-pulse-2 span { color: var(--red); }

html[data-style-system="content"] .our-story-page .uncertainty-visual .uncertainty-lens {
  grid-template-columns: 112px minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
}

html[data-style-system="content"] .our-story-page .uncertainty-visual .uncertainty-mini {
  grid-column: 1;
  grid-row: 2;
  width: 104px;
}

html[data-style-system="content"] .our-story-page .uncertainty-visual .uncertainty-lens h4 {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
  justify-self: start;
}

html[data-style-system="content"] .our-story-page .uncertainty-visual .uncertainty-lens strong {
  grid-column: 2;
  grid-row: 1;
  align-self: center;
  justify-self: end;
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  text-align: right;
}

html[data-style-system="content"] .our-story-page .uncertainty-visual .uncertainty-lens p {
  grid-column: 2;
  grid-row: 2;
}

/* Chapter 7 uses the same five-method map as the research page, with every
   discipline visible so the visual reads as an institutional model rather
   than an interactive stage selector. */
html[data-style-system="content"] .our-story-page .institution-chapter-visual {
  min-height: 0;
  align-self: start;
}

html[data-style-system="content"] .our-story-page .institution-visual {
  display: grid;
  place-items: center;
  padding: clamp(14px, 3vw, 28px);
}

html[data-style-system="content"] .our-story-page .institution-method-visual {
  position: relative;
  top: auto;
  width: min(100%, 720px);
  min-height: 0;
  aspect-ratio: 1;
  margin-inline: auto;
  overflow: visible;
  container-type: inline-size;
  margin-top: 20px;
}

html[data-style-system="content"] .our-story-page .institution-method-visual .method-lines {
  inset: 4%;
  width: 92%;
  height: 92%;
}

html[data-style-system="content"] .our-story-page .institution-method-visual .method-lines path {
  stroke: rgba(0, 0, 22, 0.42);
  stroke-width: 0.7;
}

html[data-style-system="content"] .our-story-page .institution-method-visual .method-core {
  width: 20%;
  height: 20%;
  aspect-ratio: auto;
  padding: 12px;
  border: 1px solid var(--ink);
  background: var(--ink);
}

html[data-style-system="content"] .our-story-page .institution-method-visual .method-core::before {
  display: none;
}

html[data-style-system="content"] .our-story-page .institution-method-visual .method-core img {
  width: 90%;
  margin: 0;
}

html[data-style-system="content"] .our-story-page .institution-method-visual .method-node {
  cursor: default;
  border-color: var(--blue);
  background: var(--bg);
  color: var(--blue);
  font-size: clamp(0.7rem, 2.4cqw, 1.1rem);
  line-height: 1;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}

html[data-style-system="content"] .our-story-page .institution-method-visual .method-node::before {
  display: none;
}

html[data-style-system="content"] .our-story-page .institution-method-visual .node-regulatory {
  border-color: var(--red);
  color: var(--red);
}

html[data-style-system="content"] .our-story-page .institution-method-visual .node-ethical {
  border-color: var(--gold);
  color: var(--gold);
}

html[data-style-system="content"] .our-story-page .institution-method-visual .method-node:hover {
  transform: translate(-50%, -50%);
}

@media (max-width: 560px) {
  html[data-style-system="content"] .our-story-page .institution-method-visual {
    width: min(100%, 720px);
    margin-inline: auto;
    transform: none;
  }

  html[data-style-system="content"] .our-story-page .institution-method-visual .method-core {
    padding: 6px;
  }
}

html[data-style-system="content"],
html[data-style-system="content"] body {
  background: var(--bg);
}

html[data-style-system="content"] body {
  color: var(--ink);
}

html[data-style-system="content"] a {
  text-decoration-color: rgba(23, 78, 166, 0.48);
}

html[data-style-system="content"] h1,
html[data-style-system="content"] h2,
html[data-style-system="content"] h3,
html[data-style-system="content"] h4,
html[data-style-system="content"] .page-hero h1,
html[data-style-system="content"] .band h2,
html[data-style-system="content"] .final-cta h2,
html[data-style-system="content"] .story-chapter h3,
html[data-style-system="content"] .comparison-card h2,
html[data-style-system="content"] .info-card h3,
html[data-style-system="content"] .path-card h3,
html[data-style-system="content"] .evidence-item h3,
html[data-style-system="content"] .portrait-card h3,
html[data-style-system="content"] .legal-section h2 {
  font-family: var(--font-serif);
  font-weight: 400;
  letter-spacing: -0.025em;
  line-height: 0.98;
}

html[data-style-system="content"] h1,
html[data-style-system="content"] h2,
html[data-style-system="content"] h3,
html[data-style-system="content"] h4,
html[data-style-system="content"] p {
  overflow-wrap: normal;
}

/* Shared header */
html[data-style-system="content"] .header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(4px, 1.4vw, 20px);
}

html[data-style-system="content"] .brand-link {
  gap: 10px;
}

html[data-style-system="content"] .brand-link::before {
  display: block;
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  background: url("assets/trailab-icon.png") center / contain no-repeat;
  content: "";
}

html[data-style-system="content"] .brand-link span {
  display: none;
}

html[data-style-system="content"] .brand-wordmark {
  width: 130px;
}

html[data-style-system="content"] .site-nav {
  min-width: 0;
  margin-left: auto;
}

html[data-style-system="content"] .site-nav ul {
  display: flex;
  align-items: center;
  gap: clamp(4px, 1.4vw, 20px);
  padding: 0;
  margin: 0;
  list-style: none;
}

html[data-style-system="content"] .site-nav a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 8px;
  border-radius: 0;
  color: rgba(0, 0, 22, 0.68);
  font-family: var(--font-serif);
  font-size: var(--body-size);
  font-weight: 400;
  line-height: 1.2;
}

html[data-style-system="content"] .site-nav a:hover,
html[data-style-system="content"] .site-nav a[aria-current="page"] {
  background: transparent;
  color: var(--blue);
}

html[data-style-system="content"] .language-control {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  padding: 0;
  border: 0;
  background: transparent;
}

html[data-style-system="content"] .language-control::after {
  content: none;
}

html[data-style-system="content"] .language-control > .language-option {
  display: none;
}

html[data-style-system="content"] .language-trigger {
  display: inline-flex;
  align-items: center;
  min-width: 52px;
  width: max-content;
  min-height: 44px;
  padding: 8px 12px 8px 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--blue);
  cursor: pointer;
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: 700;
  line-height: 1.2;
  list-style: none;
}

html[data-style-system="content"] .language-trigger::-webkit-details-marker {
  display: none;
}

html[data-style-system="content"] .language-trigger::after {
  flex: 0 0 auto;
  width: 5.5px;
  height: 5.5px;
  margin-left: 6px;
  border-right: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  content: "";
  transform: translateY(-1px) rotate(45deg);
  transition: transform 160ms ease;
}

html[data-style-system="content"] .language-control[open] .language-trigger::after {
  transform: translateY(2px) rotate(225deg);
}

html[data-style-system="content"] .language-trigger:hover,
html[data-style-system="content"] .language-trigger:focus-visible {
  background: transparent;
  color: var(--blue);
}

html[data-style-system="content"] .language-menu {
  position: absolute;
  top: calc(100% - 2px);
  left: -18px;
  z-index: 260;
  display: none;
  width: max-content;
  min-width: 0;
  padding: 8px;
  border: 0;
  border-radius: 0;
  background: var(--bg);
  box-shadow: 0 18px 40px rgba(0, 0, 22, 0.1);
}

html[data-style-system="content"] .language-control[open] .language-menu {
  display: grid;
  gap: 2px;
}

html[data-style-system="content"] .language-menu-option {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: auto;
  min-width: max-content;
  min-height: 40px;
  padding: 8px 10px;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: 700;
  line-height: 1.2;
  text-align: left;
  overflow: visible;
  white-space: nowrap;
  text-decoration: none;
}

html[data-style-system="content"] .language-menu-option:hover,
html[data-style-system="content"] .language-menu-option:focus-visible,
html[data-style-system="content"] .language-menu-option[aria-current="true"] {
  background: var(--bg-soft);
  color: var(--blue);
}

html[data-style-system="content"] .header-cta {
  display: none;
}

html[data-style-system="content"] .nav-toggle {
  display: none;
  place-items: center;
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--ink);
  cursor: pointer;
}

html[data-style-system="content"] .nav-toggle span[aria-hidden="true"],
html[data-style-system="content"] .nav-toggle span[aria-hidden="true"]::before,
html[data-style-system="content"] .nav-toggle span[aria-hidden="true"]::after {
  display: block;
  width: 19px;
  height: 2px;
  border-radius: 0;
  background: currentColor;
  content: "";
}

html[data-style-system="content"] .nav-toggle span[aria-hidden="true"] {
  position: relative;
}

html[data-style-system="content"] .nav-toggle span[aria-hidden="true"]::before,
html[data-style-system="content"] .nav-toggle span[aria-hidden="true"]::after {
  position: absolute;
  left: 0;
}

html[data-style-system="content"] .nav-toggle span[aria-hidden="true"]::before { top: -6px; }
html[data-style-system="content"] .nav-toggle span[aria-hidden="true"]::after { top: 6px; }

html[data-style-system="content"] .mobile-panel[hidden] {
  display: none;
}

html[data-style-system="content"] .mobile-panel {
  display: grid;
  position: fixed;
  top: calc(var(--header-h) + 2px);
  right: var(--page-x);
  left: var(--page-x);
  z-index: 240;
  gap: 8px;
  max-height: calc(100svh - var(--header-h) - 18px);
  overflow: auto;
  padding: 8px;
  border: 1px solid var(--line);
  background: var(--bg);
  box-shadow: 0 18px 40px rgba(0, 0, 22, 0.1);
}

@media (max-width: 640px) {
  html[data-style-system="content"] .mobile-panel {
    top: var(--header-h);
    right: 0;
    bottom: 0;
    left: 0;
    max-width: none;
    max-height: none;
    margin: 0;
    padding: 24px var(--page-x) calc(24px + env(safe-area-inset-bottom));
    border: 0;
    border-top: 1px solid var(--line);
    box-shadow: none;
  }
}

html[data-style-system="content"] .mobile-panel ul,
html[data-style-system="content"] .mobile-language {
  display: grid;
  gap: 2px;
  padding: 0;
  margin: 0;
  list-style: none;
}

html[data-style-system="content"] .mobile-panel a:not(.button) {
  width: 100%;
  min-height: 44px;
  padding: 12px;
  border-radius: 0;
  color: rgba(0, 0, 22, 0.72);
  font-family: var(--font-serif);
  font-size: var(--body-size);
  font-weight: 400;
}

/* Keep the mobile language grid consistent with the standalone language menu. */
html[data-style-system="content"] .mobile-panel .mobile-language a.language-option {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  min-height: 40px;
  padding: 8px 10px;
  overflow: visible;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: 700;
  line-height: 1.2;
  text-align: left;
  text-decoration: none;
  white-space: nowrap;
}

/* Use the available panel width instead of forcing a three-column language grid. */
html[data-style-system="content"] .mobile-panel .mobile-language {
  grid-template-columns: repeat(auto-fit, minmax(56px, 1fr));
}

@media (max-width: 920px) {
  html[data-style-system="content"] .mobile-panel {
    grid-template-rows: minmax(0, 1fr) auto;
  }

  html[data-style-system="content"] .mobile-panel > nav {
    align-self: start;
  }

  html[data-style-system="content"] .mobile-panel > .mobile-language {
    align-self: end;
    align-content: start;
  }
}

@media (min-width: 641px) and (max-width: 920px) {
  html[data-style-system="content"] .mobile-panel {
    padding: 8px;
  }
}

@media (max-width: 920px) {
  html[data-style-system="content"] .mobile-panel > .mobile-language {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
    column-gap: 22px;
    row-gap: 2px;
  }

  html[data-style-system="content"] .mobile-panel .mobile-language a.language-option {
    position: relative;
    justify-content: flex-start;
    flex: 0 0 auto;
    width: auto;
    min-width: 0;
    min-height: 44px;
    padding: 12px 12px;
  }

  html[data-style-system="content"] .mobile-panel .mobile-language a.language-option.is-active,
  html[data-style-system="content"] .mobile-panel .mobile-language a.language-option[aria-current="true"] {
    color: var(--blue);
  }

  html[data-style-system="content"] .mobile-panel .mobile-language a.language-option:not(:last-child)::after {
    position: absolute;
    top: 50%;
    right: -11px;
    color: currentColor;
    content: "·";
    font-weight: 400;
    pointer-events: none;
    transform: translate(-50%, -50%);
  }
}

html[data-style-system="content"] .mobile-panel a:not(.button):hover,
html[data-style-system="content"] .mobile-panel a[aria-current="page"] {
  background: transparent;
  color: var(--blue);
}

/* Match the research/publications transition: the desktop nav remains visible
   until the viewport reaches the shared 920px mobile breakpoint. */
@media (min-width: 921px) and (max-width: 1180px) {
  html[data-style-system="content"] .site-nav {
    display: block;
  }

  html[data-style-system="content"] .nav-toggle {
    display: none;
  }
}

@media (max-width: 920px) {
  html[data-style-system="content"] .site-nav {
    display: none;
  }

  html[data-style-system="content"] .nav-toggle {
    display: grid;
  }
}

@media (max-width: 920px) {
  html[data-style-system="content"] .language-control {
    display: none;
  }
}

@media (min-width: 921px) {
  html[data-style-system="content"] .header-inner {
    padding-right: 0;
  }
}

/* Keep the current English header in the viewport while the responsive menu
   is open, even when Safari changes the document's scroll container. */
html[data-style-system="content"] body.nav-open .site-header,
html[data-style-system="content"] .site-header.is-nav-open {
  position: fixed;
  inset: 0 0 auto;
  z-index: 220;
}

/* Shared page rhythm */
html[data-style-system="content"] .section-shell {
  width: min(100%, var(--max));
  margin: 0 auto;
}

html[data-style-system="content"] .band,
html[data-style-system="content"] .page-hero,
html[data-style-system="content"] .final-cta {
  padding: var(--section-y) var(--page-x);
}

html[data-style-system="content"] .page-hero {
  background: var(--bg);
}

html[data-style-system="content"] .page-hero .section-shell {
  max-width: 1120px;
  text-align: center;
}

html[data-style-system="content"] .page-hero h1,
html[data-style-system="content"] .band h2,
html[data-style-system="content"] .final-cta h2 {
  max-width: 1000px;
  margin: 16px auto 28px;
  font-size: var(--title-size);
}

html[data-style-system="content"] .page-lead,
html[data-style-system="content"] .section-lead,
html[data-style-system="content"] .final-cta p {
  max-width: var(--copy);
  margin: 0 auto;
  color: rgba(0, 0, 22, 0.76);
  font-size: var(--body-large-size);
  line-height: 1.42;
}

html[data-style-system="content"] .band-alt {
  background: var(--bg);
}

html[data-style-system="content"] .band > .section-shell > .eyebrow,
html[data-style-system="content"] .band > .section-shell > h2,
html[data-style-system="content"] .band > .section-shell > .hero-actions {
  max-width: 960px;
}

html[data-style-system="content"] .band > .section-shell > .eyebrow {
  margin-right: auto;
  margin-left: auto;
}

html[data-style-system="content"] .band > .section-shell > h2 {
  margin-right: auto;
  margin-left: auto;
}

html[data-style-system="content"] .band > .section-shell > .hero-actions {
  margin-right: auto;
  margin-left: auto;
}

html[data-style-system="content"] .eyebrow,
html[data-style-system="content"] .hero-label,
html[data-style-system="content"] .chapter-kicker,
html[data-style-system="content"] .footer-heading {
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  letter-spacing: 0.04em;
  line-height: 1.2;
  text-transform: uppercase;
}

html[data-style-system="content"] .button {
  position: relative;
  min-height: 54px;
  padding: 15px 44px 14px 18px;
  /* border: 1px solid var(--ink); */
  border-radius: 2px;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.035em;
  line-height: 1.25;
  text-transform: uppercase;
  transition: transform 180ms ease, border-color 180ms ease,
    background-color 180ms ease, color 180ms ease, box-shadow 180ms ease;
}

html[data-style-system="content"] .button::after {
  position: absolute;
  top: 50%;
  right: 16px;
  color: currentColor;
  content: "↗";
  font-family: var(--font-sans);
  font-size: 1rem;
  line-height: 1;
  transform: translateY(-50%);
  transition: transform 180ms ease;
}

html[data-style-system="content"] .button-primary {
  border-color: var(--blue);
  background: var(--bg);
  color: var(--blue);
  box-shadow: 4px 4px 0 rgba(0, 108, 174, 0.22);
}

html[data-style-system="content"] .button-secondary {
  border-color: var(--red);
  background: var(--bg);
  color: var(--red);
  box-shadow: 4px 4px 0 rgba(165, 74, 68, 0.14);
}

html[data-style-system="content"] .button:hover,
html[data-style-system="content"] .button:focus-visible {
  transform: translate(-2px, -2px);
}

html[data-style-system="content"] .button:hover::after,
html[data-style-system="content"] .button:focus-visible::after {
  transform: translate(2px, -50%);
}

html[data-style-system="content"] .button-primary:hover,
html[data-style-system="content"] .button-primary:focus-visible {
  /* background: var(--blue-soft); */
  color: var(--blue);
  box-shadow: 6px 6px 0 rgba(0, 108, 174, 0.22);
}

html[data-style-system="content"] .button-secondary:hover,
html[data-style-system="content"] .button-secondary:focus-visible {
  /* background: var(--red-soft); */
  color: var(--red);
  box-shadow: 6px 6px 0 rgba(165, 74, 68, 0.2);
}

html[data-style-system="content"] .button-tertiary:hover,
html[data-style-system="content"] .button-tertiary:focus-visible {
  color: var(--blue);
}

html[data-style-system="content"] .button:active {
  transform: translate(1px, 1px);
  box-shadow: 2px 2px 0 currentColor;
}

/* Keep action groups consistent wherever they appear. */
html[data-style-system="content"] .hero-actions {
  gap: 14px;
  align-items: stretch;
}

/* Editorial cards and lists */
html[data-style-system="content"] .card-grid,
html[data-style-system="content"] .path-grid,
html[data-style-system="content"] .role-tier-grid,
html[data-style-system="content"] .comparison-grid,
html[data-style-system="content"] .method-map,
html[data-style-system="content"] .evidence-list,
html[data-style-system="content"] .statute-grid {
  display: grid;
  gap: clamp(24px, 4vw, 54px);
  margin-top: 56px;
}

html[data-style-system="content"] .card-grid.two,
html[data-style-system="content"] .comparison-grid,
html[data-style-system="content"] .split,
html[data-style-system="content"] .proof-layout {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

html[data-style-system="content"] .split .button-tertiary {
  padding-left: 0;
  margin-top: 20px;
  color: var(--blue);
}

html[data-style-system="content"] .card-grid.three,
html[data-style-system="content"] .path-grid,
html[data-style-system="content"] .role-tier-grid,
html[data-style-system="content"] .method-map,
html[data-style-system="content"] .statute-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

html[data-style-system="content"] .card-grid.four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

html[data-style-system="content"] .info-card,
html[data-style-system="content"] .path-card,
html[data-style-system="content"] .evidence-item,
html[data-style-system="content"] .contact-panel,
html[data-style-system="content"] .empty-state,
html[data-style-system="content"] .impact-card,
html[data-style-system="content"] .regulation-track,
html[data-style-system="content"] .cycle-lane,
html[data-style-system="content"] .legal-document,
html[data-style-system="content"] .portrait-card,
html[data-style-system="content"] .community-preview,
html[data-style-system="content"] .convergence-card {
  border: 0;
  border-top: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

html[data-style-system="content"] .info-card,
html[data-style-system="content"] .path-card,
html[data-style-system="content"] .evidence-item,
html[data-style-system="content"] .comparison-card,
html[data-style-system="content"] .impact-card,
html[data-style-system="content"] .cycle-lane,
html[data-style-system="content"] .contact-panel,
html[data-style-system="content"] .portrait-card {
  padding: 24px 16px 8px 0;
}

html[data-style-system="content"] .info-card h3,
html[data-style-system="content"] .path-card h3,
html[data-style-system="content"] .evidence-item h3,
html[data-style-system="content"] .comparison-card h2,
html[data-style-system="content"] .impact-card h3,
html[data-style-system="content"] .portrait-card h3 {
  margin: 0 0 14px;
  font-size: var(--subtitle-size);
}

html[data-style-system="content"] .info-card p,
html[data-style-system="content"] .path-card p,
html[data-style-system="content"] .evidence-item p,
html[data-style-system="content"] .comparison-card p,
html[data-style-system="content"] .impact-card p,
html[data-style-system="content"] .portrait-card p {
  margin: 0;
  color: rgba(0, 0, 22, 0.72);
}

/* .comparison-card {
  border-top-color: var(--ink);
} */

html[data-style-system="content"] .comparison-card .large-question {
  margin-bottom: 20px;
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: clamp(1.5rem, 2vw, 2.4rem);
  line-height: 1.03;
}

html[data-style-system="content"] .info-card a,
html[data-style-system="content"] .path-card a,
html[data-style-system="content"] .evidence-item a,
html[data-style-system="content"] .contact-panel a {
  color: var(--blue);
  font-weight: 700;
}

html[data-style-system="content"] .project-engine {
  display: grid;
  grid-template-columns: minmax(0, 0.72fr) minmax(280px, 1.28fr);
  gap: clamp(36px, 7vw, 120px);
  align-items: start;
}

html[data-style-system="content"] .project-engine-copy {
  padding-top: 0;
}

html[data-style-system="content"] .project-engine-copy h2 {
  margin: 16px 0 24px;
  text-align: left;
}

html[data-style-system="content"] .project-engine-copy .lead {
  margin: 0;
  text-align: left;
}

html[data-style-system="content"] .project-steps {
  display: grid;
  gap: 0;
  padding: 0;
  margin: 0;
  border-top: 1px solid var(--ink);
  list-style: none;
}

html[data-style-system="content"] .project-steps::before {
  display: none;
}

html[data-style-system="content"] .project-steps li {
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
  min-height: 68px;
  padding: 16px 0;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

html[data-style-system="content"] .project-steps span {
  display: block;
  min-height: 0;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

html[data-style-system="content"] .project-steps p {
  margin: 0;
  color: rgba(0, 0, 22, 0.72);
}

html[data-style-system="content"] .contact-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-top: 56px;
}

html[data-style-system="content"] .contact-panel span {
  color: var(--muted);
}

html[data-style-system="content"] .narrative-timeline {
  display: grid;
  gap: 0;
  padding: 0;
  margin: 56px 0 0;
  border-top: 1px solid var(--ink);
  list-style: none;
}

html[data-style-system="content"] .narrative-timeline::before {
  display: none;
}

html[data-style-system="content"] .narrative-timeline li {
  display: grid;
  grid-template-columns: 100px minmax(180px, 0.7fr) minmax(0, 1fr);
  gap: 24px;
  align-items: start;
  padding: 22px 0;
  border-bottom: 1px solid var(--line);
}

html[data-style-system="content"] .narrative-timeline li span {
  display: block;
  min-width: 0;
  padding: 0;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .narrative-timeline li h3 {
  margin: 0;
  font-size: var(--subtitle-size);
}

html[data-style-system="content"] .narrative-timeline li p {
  margin: 0;
  color: rgba(0, 0, 22, 0.72);
}

/* Home page: retain the diagrams, remove the newer rounded-card treatment. */
html[data-style-system="content"] .hero {
  min-height: calc(80svh - var(--header-h));
  /* Let the decorative stream finish its curves instead of clipping at the hero edge. */
  overflow: visible;
  padding: clamp(64px, 9vh, 120px) var(--page-x) clamp(70px, 10vh, 130px);
  background: var(--bg);
}

html[data-style-system="content"] .hero-content {
  width: min(100%, var(--max));
}

html[data-style-system="content"] .hero-wordmark {
  width: 130px;
  margin-bottom: 22px;
}

html[data-style-system="content"] .hero h1 {
  max-width: 1120px;
  margin: 14px 0 0;
  font-size: clamp(2.7rem, 6.2vw, 5rem);
  font-weight: 400;
  letter-spacing: -0.025em;
  line-height: 0.98;
}

html[data-style-system="content"] .hero h1 span + span {
  color: var(--ink);
}

html[data-style-system="content"] .hero-copy {
  max-width: 760px;
  margin: 28px 0 0;
  color: rgba(0, 0, 22, 0.76);
  font-size: var(--body-large-size);
  line-height: 1.42;
}

html[data-style-system="content"] .hero-actions {
  margin-top: 30px;
}

/* Our story: add a quiet editorial trace without changing the shared hero rhythm. */
html[data-style-system="content"] .story-intro {
  position: relative;
  overflow: hidden;
  background: var(--bg);
}

html[data-style-system="content"] .story-intro .section-frame {
  position: relative;
  z-index: 1;
}

html[data-style-system="content"] .story-intro h1 {
  max-width: 1000px;
}

html[data-style-system="content"] .story-intro .lead {
  max-width: 820px;
}

html[data-style-system="content"] .story-intro-trace {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  padding: 24px 0 0;
  margin: 54px 0 0;
  border-top: 1px solid var(--ink);
  list-style: none;
}

html[data-style-system="content"] .story-intro-trace li {
  min-width: 0;
  padding-right: 18px;
  border-right: 1px solid var(--line);
}

html[data-style-system="content"] .story-intro-trace li:last-child {
  padding-right: 0;
  border-right: 0;
}

html[data-style-system="content"] .story-intro-trace span,
html[data-style-system="content"] .story-intro-trace small {
  display: block;
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  line-height: 1.2;
}

html[data-style-system="content"] .story-intro-trace span {
  margin-bottom: 14px;
  color: var(--blue);
}

html[data-style-system="content"] .story-intro-trace strong {
  display: block;
  margin-bottom: 5px;
  font-family: var(--font-serif);
  font-size: clamp(1.35rem, 2vw, 1.8rem);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1;
}

html[data-style-system="content"] .story-intro-trace small {
  color: rgba(0, 0, 22, 0.62);
  font-size: 0.66rem;
  letter-spacing: 0.02em;
}

@media (max-width: 920px) {
  html[data-style-system="content"] .story-intro-trace {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-style-system="content"] .story-intro-trace li:nth-child(2) {
    padding-right: 0;
    border-right: 0;
  }

  html[data-style-system="content"] .story-intro-trace li:nth-child(-n + 2) {
    padding-bottom: 20px;
    border-bottom: 1px solid var(--line);
  }

  html[data-style-system="content"] .story-intro-trace li:nth-child(n + 3) {
    padding-top: 2px;
  }
}

@media (max-width: 560px) {
  html[data-style-system="content"] .story-intro-trace {
    grid-template-columns: 1fr;
    gap: 0;
  }

  html[data-style-system="content"] .story-intro-trace li,
  html[data-style-system="content"] .story-intro-trace li:nth-child(2) {
    padding: 16px 0;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  html[data-style-system="content"] .story-intro-trace li:first-child {
    padding-top: 0;
  }

  html[data-style-system="content"] .story-intro-trace li:last-child {
    border-bottom: 0;
  }
}

html[data-style-system="content"] .journey-section {
  padding: clamp(90px, 12vw, 190px) var(--page-x);
  background: var(--bg-soft);
}

html[data-style-system="content"] .journey-shell {
  background: var(--bg-soft);
}

html[data-style-system="content"] .journey-shell .journey-section {
  background: transparent;
}

html[data-style-system="content"] .journey-stream-field {
  opacity: 0.32;
}

@media (min-width: 1250px) {
  html[data-style-system="content"] .our-story-page .journey-layout {
    grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);
    align-items: start;
  }

  html[data-style-system="content"] .our-story-page .journey-spine {
    position: sticky;
    top: calc(var(--header-h) + 8px);
    grid-column: 1;
    grid-row: 1;
    padding: 18px;
    z-index: 2;
  }

  html[data-style-system="content"] .our-story-page .journey-spine.is-fixed {
    position: fixed;
    top: calc(var(--header-h) + 8px);
    left: var(--journey-spine-left);
    width: var(--journey-spine-width);
    max-height: calc(100svh - var(--header-h) - 16px);
    overflow-y: auto;
  }

  html[data-style-system="content"] .our-story-page .journey-spine.is-released {
    position: absolute;
    top: var(--journey-spine-release-top);
    left: var(--journey-spine-release-left);
    width: var(--journey-spine-width);
    z-index: 2;
  }

  html[data-style-system="content"] .our-story-page .journey-spine ol {
    grid-template-columns: 1fr;
  }

  html[data-style-system="content"] .our-story-page .journey-spine ol > li {
    min-height: 84px;
    padding: 12px 12px 12px 18px;
  }

  html[data-style-system="content"] .our-story-page .chapter-stack {
    grid-column: 2;
    grid-row: 1;
  }

  html[data-style-system="content"] .our-story-page .stream-legend {
    display: grid;
  }
}

@media (max-width: 1249px) {
  html[data-style-system="content"] .our-story-page .journey-spine {
    display: none;
  }
}

/* Keep the chapter copy and its visual parallel on tablet. The visual only
   moves below the chapter copy at the mobile breakpoint. */
@media (min-width: 821px) and (max-width: 1249px) {
  html[data-style-system="content"] .our-story-page .story-chapter {
    grid-template-columns: minmax(0, 1fr) minmax(350px, 0.68fr);
  }
}

@media (max-width: 820px) {
  html[data-style-system="content"] .our-story-page .story-chapter {
    grid-template-columns: 1fr;
  }
}

/* Keep the story stages on one continuous spine. The gradient changes at the
   stage boundaries: blue, blue, blue-to-gold, then blue-to-gold-to-red. */
html[data-style-system="content"] .our-story-page .journey-stages {
  position: relative;
}

html[data-style-system="content"] .our-story-page .journey-spine ol {
  position: relative;
  z-index: 1;
  grid-template-columns: 1fr;
}

html[data-style-system="content"] .our-story-page .journey-spine ol > li {
  padding-left: 34px;
}

html[data-style-system="content"] .our-story-page .journey-spine ol > li::before {
  display: none;
}

html[data-style-system="content"] .our-story-page .journey-progress {
  --journey-gradient: linear-gradient(
    to bottom,
    var(--blue) 0 40%,
    var(--blue) 40%,
    var(--gold) 60%,
    /* var(--blue) 60%, */
    /* var(--gold) 80%, */
    var(--red) 100%
  );
  position: absolute;
  top: 18px;
  bottom: 18px;
  left: 14px;
  z-index: 0;
  width: 2px;
  pointer-events: none;
}

html[data-style-system="content"] .our-story-page .journey-progress-track,
html[data-style-system="content"] .our-story-page .journey-progress-fill {
  position: absolute;
  inset: 0;
  display: block;
  border-radius: 999px;
}

html[data-style-system="content"] .our-story-page .journey-progress-track {
  background: var(--line-dark);
  opacity: 0.2;
}

html[data-style-system="content"] .our-story-page .journey-progress-fill {
  height: 100%;
  background: var(--journey-gradient);
  clip-path: inset(0 0 calc(100% - var(--journey-progress, 0%)) 0);
  transition: clip-path 180ms ease;
}

html[data-style-system="content"] .our-story-page .journey-progress-dot {
  position: absolute;
  bottom: -6px;
  left: 50%;
  display: block;
  width: 11px;
  height: 11px;
  border: 2px solid var(--bg-soft);
  border-radius: 50%;
  background: var(--red);
  box-shadow: 0 0 0 1px rgba(164, 70, 70, 0.28);
  transform: translateX(-50%);
}

html[data-style-system="content"] .story-chapter,
html[data-style-system="content"] .impact-cycle-map,
html[data-style-system="content"] .evolution-map,
html[data-style-system="content"] .community-preview,
html[data-style-system="content"] .convergence-card {
  border: 1px solid var(--line);
  border-radius: 0;
  background: rgba(255, 255, 255, 0.32);
  box-shadow: none;
}

html[data-style-system="content"] .story-chapter {
  padding: clamp(28px, 5vw, 58px);
}

html[data-style-system="content"] .story-chapter h3 {
  font-size: var(--title2-size);
}

html[data-style-system="content"] .story-chapter .button-tertiary {
  margin-top: 10px;
  padding: 15px 44px 14px 0px;
  font-family: var(--font-sans);
  font-size: var(--body-small-size);
  font-weight: 500;
  text-transform: none;
  text-align: left;
}

html[data-style-system="content"] .chapter-question {
  font-family: var(--font-sans);
  font-size: var(--body-large-size);
  line-height: 1.2;
  font-weight: 400;
}

html[data-style-system="content"] .visual-card,
html[data-style-system="content"] .uncertainty-lens,
html[data-style-system="content"] .decision-node,
html[data-style-system="content"] .domain-matrix article,
html[data-style-system="content"] .cycle-lane li,
html[data-style-system="content"] .regulation-track li {
  border-radius: 0;
  box-shadow: none;
}

html[data-style-system="content"] .decision-node,
html[data-style-system="content"] .cycle-lane li,
html[data-style-system="content"] .regulation-track li {
  border-color: var(--line);
  background: rgba(255, 255, 255, 0.32);
}

html[data-style-system="content"] .impact-band {
  background: var(--bg);
}

html[data-style-system="content"] .impact-layout {
  align-items: start;
}

html[data-style-system="content"] .impact-cycle-map,
html[data-style-system="content"] .evolution-map {
  padding: 24px;
}

html[data-style-system="content"] .cycle-methods,
html[data-style-system="content"] .evolution-node-3,
html[data-style-system="content"] .community-preview-core {
  border-radius: 0;
}

/* Interactive reflective-AI components */
html[data-style-system="content"] .citation-strip {
  margin-top: 25px;
  /* border-top: 1px solid var(--line); */
}

html[data-style-system="content"] .citation-strip summary {
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  text-transform: uppercase;
  font-weight: 700;
}

html[data-style-system="content"] .citation-strip summary span {
  border-radius: 0;
  background: var(--ink);
  color: var(--bg);
}

html[data-style-system="content"] .citation-strip li {
  border-radius: 0;
  border-color: var(--line);
  background: transparent;
}

html[data-style-system="content"] .citation-strip strong {
  font-weight: var(--body-weight);
}

html[data-style-system="content"] .citation-strip em {
  font-weight: var(--body-weight);
}

html[data-style-system="content"] .citation-strip strong .citation-title {
  display: inline;
  margin-top: 0;
  font-weight: var(--body-weight);
}

html[data-style-system="content"] .citation-strip summary span {
  background: var(--bg);
  /* border-color: var(--ink); */
  border: 0.3px solid var(--ink);
  color: var(--ink);
  font-weight: 400;
  border-radius: 2px;
}

html[data-style-system="content"] .citation-strip ul {
  gap: 0;
}

html[data-style-system="content"] .citation-strip li {
  padding: 16px 0;
  border: 0;
  border-top: 1px solid transparent;
  border-image: linear-gradient(90deg, transparent, var(--line-dark) 20%, var(--line-dark) 80%, transparent) 1;
  background: transparent;
}

html[data-style-system="content"] .citation-strip li:first-child {
  border-top: 0;
  border-image: none;
}

html[data-style-system="content"] .demo-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  margin-top: 34px;
  border-bottom: 1px solid var(--line);
}

html[data-style-system="content"] .demo-tab {
  min-height: 44px;
  padding: 10px 14px;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  text-transform: uppercase;
}

html[data-style-system="content"] .demo-tab.is-active {
  border-bottom-color: var(--blue);
  background: transparent;
  color: var(--blue);
}

html[data-style-system="content"] .demo-panels {
  margin-top: 34px;
}

html[data-style-system="content"] .chatbot-shell {
  gap: 28px;
}

html[data-style-system="content"] .chat-column {
  padding: 0;
  border: 0;
  border-top: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

html[data-style-system="content"] .chat-column-label {
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  text-transform: uppercase;
}

html[data-style-system="content"] .chat-message {
  border-radius: 0;
  box-shadow: none;
}

/* People, legal and evidence pages */
html[data-style-system="content"] body[data-page="people"] .page-intro {
  padding-bottom: clamp(32px, 5vw, 72px);
}

html[data-style-system="content"] body[data-page="people"] .role-orbits {
  min-height: 0;
}

html[data-style-system="content"] .statute-grid {
  margin-top: 56px;
}

html[data-style-system="content"] .evidence-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

html[data-style-system="content"] .evidence-item {
  display: grid;
  align-content: start;
  gap: 12px;
}

html[data-style-system="content"] .evidence-item .eyebrow {
  margin: 0;
}

html[data-style-system="content"] .evidence-item h3 {
  margin: 0;
  font-size: var(--subtitle-size);
}

html[data-style-system="content"] .role-orbits,
html[data-style-system="content"] .portrait-card,
html[data-style-system="content"] .profile-note {
  border-radius: 0;
  box-shadow: none;
}

/* .role-orbits {
  border: 1px solid var(--line);
  background: transparent;
} */

html[data-style-system="content"] .portrait-grid {
  gap: 0;
}

html[data-style-system="content"] .portrait-card {
  padding-left: 0;
}

html[data-style-system="content"] .legal-shell {
  max-width: 920px;
}

html[data-style-system="content"] .legal-document {
  padding: 0;
  background: transparent;
}

html[data-style-system="content"] .legal-updated {
  color: var(--muted);
  font-family: var(--font-mono);
  font-size: var(--body-small-size);
}

html[data-style-system="content"] .legal-section {
  padding: 34px 0;
  border-top: 1px solid transparent;
  border-image: linear-gradient(90deg, transparent, var(--line-dark) 20%, var(--line-dark) 80%, transparent) 1;
}

html[data-style-system="content"] .legal-section h2 {
  margin: 0 0 18px;
  font-size: var(--subtitle-size);
}

html[data-style-system="content"] .legal-section p {
  max-width: 920px;
  color: rgba(0, 0, 22, 0.72);
}

html[data-style-system="content"] .final-cta {
  border-top: 1px solid var(--line);
  background: var(--bg);
}

html[data-style-system="content"] .final-cta .button {
  margin-top: 28px;
}

/* Footer */
html[data-style-system="content"] .site-footer {
  padding: 72px var(--page-x) 34px;
  background: var(--ink);
  color: rgba(251, 250, 246, 0.75);
}

html[data-style-system="content"] .footer-inner {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr 0.8fr;
  gap: 36px;
  width: min(100%, var(--max));
  margin: 0 auto;
}

html[data-style-system="content"] .footer-logo {
  width: 150px;
  margin-bottom: 18px;
  filter: invert(1) grayscale(1) brightness(2);
}

html[data-style-system="content"] .site-footer p {
  max-width: 420px;
  margin-bottom: 8px;
}

html[data-style-system="content"] .site-footer nav {
  display: grid;
  align-content: start;
  gap: 7px;
}

html[data-style-system="content"] .site-footer a {
  color: rgba(251, 250, 246, 0.92);
}

html[data-style-system="content"] .site-footer nav a {
  min-height: 30px;
  text-decoration: none;
}

html[data-style-system="content"] .footer-heading {
  margin-top: 4px;
  color: var(--bg);
}

html[data-style-system="content"] .footer-languages {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

html[data-style-system="content"] .footer-languages a {
  font-family: var(--font-mono);
  font-size: var(--accent-size);
}

html[data-style-system="content"] .footer-bottom {
  grid-column: 1 / -1;
  padding-top: 24px;
  margin-top: 10px !important;
  border-top: 1px solid rgba(251, 250, 246, 0.2);
  font-size: var(--body-small-size);
}

@media (max-width: 920px) {
  html[data-style-system="content"]:root {
    --header-h: 62px;
  }

  html[data-style-system="content"] .site-nav {
    display: none;
  }

  html[data-style-system="content"] .nav-toggle {
    display: grid;
  }

  html[data-style-system="content"] .site-nav {
    margin-left: 0;
  }

  html[data-style-system="content"] .header-inner {
    min-height: var(--header-h);
  }

  html[data-style-system="content"] .project-engine,
  html[data-style-system="content"] .card-grid.two,
  html[data-style-system="content"] .card-grid.three,
  html[data-style-system="content"] .card-grid.four,
  html[data-style-system="content"] .path-grid,
  html[data-style-system="content"] .role-tier-grid,
  html[data-style-system="content"] .comparison-grid,
  html[data-style-system="content"] .method-map,
  html[data-style-system="content"] .statute-grid,
  html[data-style-system="content"] .split,
  html[data-style-system="content"] .proof-layout,
  html[data-style-system="content"] .evidence-list,
  html[data-style-system="content"] .footer-inner {
    grid-template-columns: 1fr;
  }

  html[data-style-system="content"] .narrative-timeline li {
    grid-template-columns: 86px minmax(0, 1fr);
  }

  html[data-style-system="content"] .narrative-timeline li p {
    grid-column: 2;
  }

  html[data-style-system="content"] .footer-inner {
    gap: 30px;
  }

}

@media (min-width: 661px) and (max-width: 920px) {
  html[data-style-system="content"] body[data-page="collaborate"] .path-grid,
  html[data-style-system="content"] body[data-page="projects"] .path-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-style-system="content"] .footer-inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-style-system="content"] .footer-inner > :first-child {
    grid-column: 1;
    grid-row: 1 / span 2;
  }

  html[data-style-system="content"] .footer-meta {
    grid-column: 2;
    grid-row: 1;
  }

  html[data-style-system="content"] .footer-contact {
    grid-column: 2;
    grid-row: 2;
  }

  html[data-style-system="content"] .footer-meta,
  html[data-style-system="content"] .footer-contact {
    text-align: right;
  }

  html[data-style-system="content"] .footer-meta nav {
    justify-items: end;
  }

  html[data-style-system="content"] .footer-languages {
    justify-content: flex-end;
  }

  html[data-style-system="content"] .footer-bottom {
    grid-column: 1 / -1;
    grid-row: 3;
  }
}

@media (max-width: 560px) {
  html[data-style-system="content"] .brand-link::before {
    width: 28px;
    height: 28px;
  }

  html[data-style-system="content"] .brand-wordmark {
    width: 118px;
  }

  html[data-style-system="content"] .page-hero h1,
  html[data-style-system="content"] .band h2,
  html[data-style-system="content"] .final-cta h2 {
    font-size: var(--title-size);
  }

  html[data-style-system="content"] .project-steps li {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  html[data-style-system="content"] .narrative-timeline li {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  html[data-style-system="content"] .narrative-timeline li p {
    grid-column: auto;
  }

  html[data-style-system="content"] .contact-panel {
    align-items: flex-start;
    flex-direction: column;
  }

  html[data-style-system="content"] .contact-panel .button {
    width: 100%;
  }
}

/*
 * Distinctive page treatments
 *
 * These rules are deliberately scoped to the six content pages that need
 * more visual character. They reuse the existing copy and components while
 * borrowing the homepage's layered fields, colour streams and staged cards.
 */
html[data-style-system="content"] body[data-page="collaborate"] .detail-page,
html[data-style-system="content"] body[data-page="governance"] .detail-page,
html[data-style-system="content"] body[data-page="projects"] .detail-page,
html[data-style-system="content"] body[data-page="reflective"] .detail-page,
html[data-style-system="content"] body[data-page="futures"] .detail-page,
html[data-style-system="content"] body[data-page="why"] .detail-page {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

html[data-style-system="content"] body[data-page="collaborate"] .page-intro,
html[data-style-system="content"] body[data-page="governance"] .page-intro,
html[data-style-system="content"] body[data-page="projects"] .page-intro,
html[data-style-system="content"] body[data-page="reflective"] .page-intro,
html[data-style-system="content"] body[data-page="futures"] .page-intro,
html[data-style-system="content"] body[data-page="why"] .page-intro {
  position: relative;
  overflow: hidden;
  background: var(--bg);
}

html[data-style-system="content"] body[data-page="collaborate"] .page-intro .section-frame,
html[data-style-system="content"] body[data-page="governance"] .page-intro .section-frame,
html[data-style-system="content"] body[data-page="projects"] .page-intro .section-frame,
html[data-style-system="content"] body[data-page="reflective"] .page-intro .section-frame,
html[data-style-system="content"] body[data-page="futures"] .page-intro .section-frame,
html[data-style-system="content"] body[data-page="why"] .page-intro .section-frame {
  position: relative;
  z-index: 1;
}

html[data-style-system="content"] body[data-page="collaborate"] .page-intro h1,
html[data-style-system="content"] body[data-page="projects"] .page-intro h1 {
  max-width: 1040px;
}

html[data-style-system="content"] body[data-page="governance"] .page-intro,
html[data-style-system="content"] body[data-page="futures"] .page-intro {
  background: var(--bg);
}

html[data-style-system="content"] body[data-page="reflective"] .page-intro,
html[data-style-system="content"] body[data-page="why"] .page-intro {
  background: var(--bg);
}

html[data-style-system="content"] body[data-page="collaborate"] .editorial-section:nth-of-type(2),
html[data-style-system="content"] body[data-page="projects"] .editorial-section:nth-of-type(2) {
  background:
    linear-gradient(180deg, var(--bg), rgba(241, 238, 231, 0.58)),
    var(--bg);
}

html[data-style-system="content"] body[data-page="reflective"] .editorial-section .section-frame .lead {
  text-align: justify;
}

/* Shared framed cards for the process, evidence and comparison pages. */
html[data-style-system="content"] body[data-page="collaborate"] .project-engine,
html[data-style-system="content"] body[data-page="projects"] .project-engine {
  position: relative;
  overflow: hidden;
  padding: clamp(28px, 5vw, 58px);
  border: 1px solid rgba(216, 211, 202, 0.96);
  border-radius: 10px;
  background:
    linear-gradient(135deg, rgba(23, 78, 166, 0.08), transparent 42%),
    rgba(255, 255, 255, 0.42);
  box-shadow: 0 22px 68px rgba(0, 0, 22, 0.08);
}

html[data-style-system="content"] body[data-page="collaborate"] .project-engine::before,
html[data-style-system="content"] body[data-page="projects"] .project-engine::before {
  position: absolute;
  right: -12%;
  bottom: -42%;
  width: 70%;
  aspect-ratio: 1;
  border: 1px solid rgba(29, 113, 110, 0.22);
  border-radius: 50%;
  content: "";
  pointer-events: none;
}

html[data-style-system="content"] body[data-page="collaborate"] .project-engine-copy,
html[data-style-system="content"] body[data-page="projects"] .project-engine-copy,
html[data-style-system="content"] body[data-page="collaborate"] .project-steps,
html[data-style-system="content"] body[data-page="projects"] .project-steps {
  position: relative;
  z-index: 1;
}

html[data-style-system="content"] body[data-page="collaborate"] .project-engine-copy h2,
html[data-style-system="content"] body[data-page="projects"] .project-engine-copy h2 {
  font-size: clamp(2.4rem, 5vw, 4.5rem);
}

html[data-style-system="content"] body[data-page="collaborate"] .project-steps,
html[data-style-system="content"] body[data-page="projects"] .project-steps {
  gap: 10px;
  padding: 0;
  border-top: 0;
}

html[data-style-system="content"] body[data-page="collaborate"] .project-steps li,
html[data-style-system="content"] body[data-page="projects"] .project-steps li {
  min-height: 0;
  padding: 16px;
  border: 1px solid rgba(216, 211, 202, 0.92);
  border-radius: 8px;
  background: rgba(251, 250, 246, 0.82);
  box-shadow: 0 10px 28px rgba(0, 0, 22, 0.05);
}

html[data-style-system="content"] body[data-page="collaborate"] .project-steps li:nth-child(2),
html[data-style-system="content"] body[data-page="projects"] .project-steps li:nth-child(2) {
  transform: translateX(18px);
}

html[data-style-system="content"] body[data-page="collaborate"] .project-steps li:nth-child(4),
html[data-style-system="content"] body[data-page="projects"] .project-steps li:nth-child(4) {
  transform: translateX(10px);
}

html[data-style-system="content"] body[data-page="collaborate"] .project-steps span,
html[data-style-system="content"] body[data-page="projects"] .project-steps span {
  width: fit-content;
  padding: 5px 8px;
  border-radius: 999px;
  background: var(--ink);
  color: var(--bg);
  letter-spacing: 0.05em;
}

html[data-style-system="content"] body[data-page="collaborate"] .card-grid .info-card,
html[data-style-system="content"] body[data-page="projects"] .evidence-list .evidence-item {
  padding: 22px;
  border: 1px solid rgba(216, 211, 202, 0.94);
  border-top: 3px solid var(--blue);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.5);
  box-shadow: 0 14px 34px rgba(0, 0, 22, 0.06);
}

html[data-style-system="content"] body[data-page="collaborate"] .card-grid .info-card:nth-child(3n + 2),
html[data-style-system="content"] body[data-page="projects"] .evidence-list .evidence-item:nth-child(3n + 2) {
  border-top-color: var(--gold);
}

html[data-style-system="content"] body[data-page="collaborate"] .card-grid .info-card:nth-child(3n),
html[data-style-system="content"] body[data-page="projects"] .evidence-list .evidence-item:nth-child(3n) {
  border-top-color: var(--red);
}

/* Governance: a field of principles rather than a flat card grid. */
html[data-style-system="content"] body[data-page="governance"] .statute-grid,
html[data-style-system="content"] body[data-page="governance"] .card-grid {
  gap: 16px;
  margin-top: 46px;
}

html[data-style-system="content"] body[data-page="governance"] .statute-grid .info-card,
html[data-style-system="content"] body[data-page="governance"] .card-grid .info-card {
  position: relative;
  min-height: 188px;
  padding: 28px 22px 22px;
  overflow: hidden;
  border: 1px solid rgba(216, 211, 202, 0.92);
  border-top: 3px solid var(--gold);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.48);
  box-shadow: 0 14px 32px rgba(0, 0, 22, 0.055);
}

html[data-style-system="content"] body[data-page="governance"] .statute-grid .info-card::after,
html[data-style-system="content"] body[data-page="governance"] .card-grid .info-card::after {
  position: absolute;
  right: -30px;
  bottom: -56px;
  width: 120px;
  height: 120px;
  border: 1px solid rgba(174, 124, 25, 0.2);
  border-radius: 50%;
  content: "";
}

html[data-style-system="content"] body[data-page="governance"] .statute-grid .info-card:nth-child(3n + 2),
html[data-style-system="content"] body[data-page="governance"] .card-grid .info-card:nth-child(3n + 2) {
  border-top-color: var(--blue);
}

html[data-style-system="content"] body[data-page="governance"] .statute-grid .info-card:nth-child(3n),
html[data-style-system="content"] body[data-page="governance"] .card-grid .info-card:nth-child(3n) {
  border-top-color: var(--red);
}

html[data-style-system="content"] body[data-page="governance"] .statute-grid .info-card h3,
html[data-style-system="content"] body[data-page="governance"] .card-grid .info-card h3 {
  position: relative;
  z-index: 1;
  font-size: clamp(1.7rem, 2.5vw, 2.5rem);
}

html[data-style-system="content"] body[data-page="governance"] .statute-grid .info-card p,
html[data-style-system="content"] body[data-page="governance"] .card-grid .info-card p {
  position: relative;
  z-index: 1;
}

/* Reflective AI: make the comparison and simulated interaction feel like a
   visual argument, while keeping every existing word and control. */
html[data-style-system="content"] body[data-page="reflective"] .comparison-grid {
  gap: 18px;
  margin-top: 54px;
}

html[data-style-system="content"] body[data-page="reflective"] .comparison-card {
  position: relative;
  min-height: 300px;
  padding: clamp(26px, 4vw, 44px);
  overflow: hidden;
  /* border: 1px solid rgba(216, 211, 202, 0.96);
  border-top: 5px solid var(--blue);
  border-radius: 10px;
  background:
    radial-gradient(circle at 92% 16%, rgba(23, 78, 166, 0.15), transparent 12rem),
    rgba(255, 255, 255, 0.52);
  box-shadow: 0 22px 58px rgba(0, 0, 22, 0.08); */
}
/*
body[data-page="reflective"] .comparison-card + .comparison-card {
  border-top-color: var(--red);
  background:
    radial-gradient(circle at 92% 16%, rgba(169, 72, 66, 0.15), transparent 12rem),
    rgba(255, 255, 255, 0.52);
} */

/* body[data-page="reflective"] .comparison-card::after {
  position: absolute;
  right: -42px;
  bottom: -52px;
  width: 150px;
  height: 150px;
  border: 1px solid currentColor;
  border-radius: 50%;
  color: rgba(23, 78, 166, 0.18);
  content: "";
}

body[data-page="reflective"] .comparison-card + .comparison-card::after {
  color: rgba(169, 72, 66, 0.18);
} */

html[data-style-system="content"] body[data-page="reflective"] .comparison-card h2,
html[data-style-system="content"] body[data-page="reflective"] .comparison-card p {
  position: relative;
  z-index: 1;
}

html[data-style-system="content"] body[data-page="reflective"] .comparison-card h2 {
  font-size: var(--title-size);
}

html[data-style-system="content"] body[data-page="reflective"] .reflective-principles {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  padding: 0;
  padding-left: 42.5px;
  margin: 56px 0 0;
  list-style: none;
}

html[data-style-system="content"] body[data-page="reflective"] .reflective-principles li {
  display: grid;
  grid-template-columns: 15px minmax(180px, 0.25fr) minmax(0, 1fr);
  gap: clamp(16px, 2.5vw, 28px);
  align-items: start;
  min-width: 0;
  padding: 15px 0;
}

html[data-style-system="content"] body[data-page="reflective"] .reflective-principles li > span {
  display: block;
  min-width: 0;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  letter-spacing: 0.04em;
}

html[data-style-system="content"] body[data-page="reflective"] .reflective-principles h3,
html[data-style-system="content"] body[data-page="reflective"] .reflective-principles p {
  min-width: 0;
  margin: 0;
}

html[data-style-system="content"] body[data-page="reflective"] .reflective-principles h3 {
  font-size: clamp(1.4rem, 1vw, 2.4rem);
  font-family: var(--font-sans);
}

html[data-style-system="content"] body[data-page="reflective"] .reflective-principles p {
  color: rgba(23, 23, 19, 0.74);
}

html[data-style-system="content"] body[data-page="reflective"] .raio-diagram {
  --raio-blue: rgba(0, 108, 174, 0.72);
  --raio-gold: rgba(175, 125, 42, 0.78);
  --raio-red: rgba(165, 74, 68, 0.76);
  display: block;
  position: relative;
  min-height: clamp(500px, 42vw, 580px);
  padding: 12px 0;
  isolation: isolate;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-diagram::before,
html[data-style-system="content"] body[data-page="reflective"] .raio-diagram::after {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 0;
  border-radius: 50%;
  content: "";
  transform: translate(-50%, -50%);
}

html[data-style-system="content"] body[data-page="reflective"] .raio-diagram::before {
  width: min(82%, 438px);
  aspect-ratio: 1;
  /* border: 1px solid rgba(23, 23, 19, 0.12); */
  background:
    radial-gradient(circle at center, rgba(0, 108, 174, 0.09), transparent 31%),
    conic-gradient(from -30deg, rgba(0, 108, 174, 0.055), transparent 12%, rgba(175, 125, 42, 0.06) 31%, transparent 45%, rgba(165, 74, 68, 0.055) 65%, transparent 80%, rgba(0, 108, 174, 0.055));
}

html[data-style-system="content"] body[data-page="reflective"] .raio-diagram::after {
  width: min(64%, 340px);
  aspect-ratio: 1;
  /* border: 1px dashed rgba(23, 23, 19, 0.12); */
}

html[data-style-system="content"] body[data-page="reflective"] .raio-connection-map {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  width: min(88%, 470px);
  height: auto;
  overflow: visible;
  aspect-ratio: 1 / 1;
  transform: translate(-50%, -50%);
}

html[data-style-system="content"] body[data-page="reflective"] .raio-spoke {
  fill: none;
  stroke: rgba(23, 23, 19, 0.2);
  stroke-dasharray: 1.4 3.2;
  stroke-width: 0.6;
  vector-effect: non-scaling-stroke;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-loop {
  fill: none;
  stroke-linecap: round;
  stroke-width: 1.6px;
  vector-effect: non-scaling-stroke;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-orbit {
  fill: none;
  stroke: rgba(23, 23, 19, 0.14);
  vector-effect: non-scaling-stroke;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-orbit-outer {
  stroke-dasharray: 1.2 4.2;
  stroke-width: 0.8;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-orbit-inner {
  stroke-width: 0.55;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-waypoint {
  stroke: var(--bg-soft);
  stroke-width: 0.9;
  vector-effect: non-scaling-stroke;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-loop-1,
html[data-style-system="content"] body[data-page="reflective"] .raio-loop-4,
html[data-style-system="content"] body[data-page="reflective"] .raio-waypoint-1,
html[data-style-system="content"] body[data-page="reflective"] .raio-waypoint-4 {
  stroke: var(--raio-blue);
  fill: var(--raio-blue);
}

html[data-style-system="content"] body[data-page="reflective"] .raio-loop-2,
html[data-style-system="content"] body[data-page="reflective"] .raio-loop-5,
html[data-style-system="content"] body[data-page="reflective"] .raio-waypoint-2,
html[data-style-system="content"] body[data-page="reflective"] .raio-waypoint-5 {
  stroke: var(--raio-gold);
  fill: var(--raio-gold);
}

html[data-style-system="content"] body[data-page="reflective"] .raio-loop-3,
html[data-style-system="content"] body[data-page="reflective"] .raio-loop-6,
html[data-style-system="content"] body[data-page="reflective"] .raio-waypoint-3,
html[data-style-system="content"] body[data-page="reflective"] .raio-waypoint-6 {
  stroke: var(--raio-red);
  fill: var(--raio-red);
}

html[data-style-system="content"] body[data-page="reflective"] .raio-core {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 3;
  display: grid;
  place-items: center;
  width: clamp(120px, 10vw, 174px);
  height: clamp(120px, 10vw, 174px);
  aspect-ratio: 1 / 1;
  box-sizing: border-box;
  min-height: 0;
  padding: 20px;
  border: 1px solid var(--ink);
  border-radius: 50%;
  background: var(--ink);
  color: var(--bg);
  text-align: center;
  transform: translate(-50%, -50%);
  /* box-shadow: 0 0 0 8px var(--bg-soft), 0 0 0 9px rgba(23, 23, 19, 0.18); */
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node > span {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  letter-spacing: 0.04em;
  line-height: 1;
  text-transform: uppercase;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node > span::after {
  width: 24px;
  height: 1px;
  background: currentColor;
  content: "";
}

html[data-style-system="content"] body[data-page="reflective"] .raio-core strong {
  position: relative;
  font-family: var(--font-serif);
  font-size: clamp(1.55rem, 2.4vw, 2.15rem);
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node {
  --raio-accent: var(--blue);
  position: absolute;
  z-index: 3;
  display: grid;
  width: min(29%, 178px);
  gap: 6px;
  min-width: 0;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node > strong {
  font-family: var(--font-serif);
  font-size: clamp(1.2rem, 1.8vw, 1.6rem);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 0.98;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node small {
  max-width: 25ch;
  color: rgba(23, 23, 19, 0.68);
  font-family: var(--font-sans);
  font-size: var(--body-small-size);
  line-height: 1.3;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node-1 {
  top: 10%;
  left: 50%;
  text-align: center;
  transform: translateX(-50%);
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node-2 {
  --raio-accent: var(--gold);
  top: 21%;
  right: 1%;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node-3 {
  --raio-accent: var(--red);
  right: 1%;
  bottom: 21%;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node-4 {
  bottom: 10%;
  left: 50%;
  text-align: center;
  transform: translateX(-50%);
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node-5 {
  --raio-accent: var(--gold);
  bottom: 21%;
  left: 1%;
  text-align: right;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node-6 {
  --raio-accent: var(--red);
  top: 21%;
  left: 1%;
  text-align: right;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node > span {
  color: var(--raio-accent);
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node-1 > span,
html[data-style-system="content"] body[data-page="reflective"] .raio-node-4 > span {
  justify-content: center;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node-5 > span,
html[data-style-system="content"] body[data-page="reflective"] .raio-node-6 > span {
  justify-content: end;
}

html[data-style-system="content"] body[data-page="reflective"] .demo-panels {
  padding: 22px;
  border: 1px solid rgba(216, 211, 202, 0.96);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.38);
  box-shadow: 0 18px 48px rgba(0, 0, 22, 0.07);
}

html[data-style-system="content"] body[data-page="reflective"] .chat-column {
  padding: 18px;
  border: 1px solid rgba(216, 211, 202, 0.9);
  border-top: 3px solid var(--blue);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.56);
}

html[data-style-system="content"] body[data-page="reflective"] .chat-column.reflective {
  border-top-color: var(--red);
}

/* Reflective Futures: turn the four existing cards into a visual field. */
html[data-style-system="content"] .reflective-futures {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 10% 18%, rgba(23, 78, 166, 0.13), transparent 22rem),
    radial-gradient(circle at 90% 82%, rgba(169, 72, 66, 0.12), transparent 24rem),
    var(--bg-soft);
}

html[data-style-system="content"] .reflective-futures::before {
  position: absolute;
  top: 18%;
  right: 6%;
  width: 40%;
  height: 60%;
  border: 1px solid rgba(174, 124, 25, 0.2);
  border-radius: 50%;
  content: "";
  transform: rotate(22deg);
}

html[data-style-system="content"] .reflective-futures .section-frame {
  position: relative;
  z-index: 1;
}

html[data-style-system="content"] .reflective-futures .card-grid {
  gap: 18px;
  margin-top: 0;
}

html[data-style-system="content"] .reflective-futures .info-card {
  min-height: 250px;
  padding: 28px;
  border: 1px solid rgba(216, 211, 202, 0.95);
  border-top: 5px solid var(--blue);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.54);
  box-shadow: 0 18px 44px rgba(0, 0, 22, 0.07);
}

html[data-style-system="content"] .reflective-futures .info-card:nth-child(2) {
  border-top-color: var(--gold);
  transform: translateY(28px);
}

html[data-style-system="content"] .reflective-futures .info-card:nth-child(3) {
  border-top-color: var(--red);
  transform: translateY(-12px);
}

html[data-style-system="content"] .reflective-futures .info-card:nth-child(4) {
  border-top-color: var(--teal);
  transform: translateY(18px);
}

html[data-style-system="content"] .reflective-futures .info-card h3 {
  font-size: clamp(2rem, 3vw, 3rem);
}

/* Why TRAILAB: make the existing history read as a connected journey. */
html[data-style-system="content"] body[data-page="why"] .narrative-timeline-band {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(241, 238, 231, 0.96), rgba(241, 238, 231, 0.72)),
    var(--bg-soft);
}

html[data-style-system="content"] body[data-page="why"] .narrative-timeline {
  position: relative;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  padding: 32px 0 0;
  margin-top: 38px;
  border-top: 0;
}

html[data-style-system="content"] body[data-page="why"] .narrative-timeline::before {
  position: absolute;
  top: 16px;
  right: 9%;
  left: 9%;
  height: 2px;
  background: linear-gradient(90deg, var(--blue), var(--gold), var(--red));
  content: "";
}

html[data-style-system="content"] body[data-page="why"] .narrative-timeline li {
  position: relative;
  display: block;
  min-height: 260px;
  padding: 28px 22px 22px;
  border: 1px solid rgba(216, 211, 202, 0.96);
  border-top: 4px solid var(--blue);
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.54);
  box-shadow: 0 16px 38px rgba(0, 0, 22, 0.06);
}

html[data-style-system="content"] body[data-page="why"] .narrative-timeline li::before {
  position: absolute;
  top: -41px;
  left: 22px;
  width: 16px;
  height: 16px;
  border: 4px solid var(--bg-soft);
  border-radius: 50%;
  background: var(--blue);
  content: "";
}

html[data-style-system="content"] body[data-page="why"] .narrative-timeline li:nth-child(3n + 2) {
  border-top-color: var(--gold);
  transform: translateY(34px);
}

html[data-style-system="content"] body[data-page="why"] .narrative-timeline li:nth-child(3n + 2)::before {
  background: var(--gold);
}

html[data-style-system="content"] body[data-page="why"] .narrative-timeline li:nth-child(3n) {
  border-top-color: var(--red);
}

html[data-style-system="content"] body[data-page="why"] .narrative-timeline li:nth-child(3n)::before {
  background: var(--red);
}

html[data-style-system="content"] body[data-page="why"] .narrative-timeline li span {
  margin-bottom: 18px;
}

html[data-style-system="content"] body[data-page="why"] .narrative-timeline li h3 {
  margin-bottom: 16px;
  font-size: clamp(1.8rem, 2.6vw, 2.8rem);
}

html[data-style-system="content"] body[data-page="why"] .card-grid .info-card {
  padding: 24px;
  border: 1px solid rgba(216, 211, 202, 0.94);
  border-top: 3px solid var(--blue);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.48);
  box-shadow: 0 14px 34px rgba(0, 0, 22, 0.06);
}

html[data-style-system="content"] body[data-page="why"] .card-grid .info-card:nth-child(2n) {
  border-top-color: var(--gold);
}

html[data-style-system="content"] body[data-page="why"] .card-grid .info-card:nth-child(3n) {
  border-top-color: var(--red);
}

@media (max-width: 920px) {
  html[data-style-system="content"] body[data-page="collaborate"] .project-steps li:nth-child(2),
  html[data-style-system="content"] body[data-page="collaborate"] .project-steps li:nth-child(4),
  html[data-style-system="content"] body[data-page="projects"] .project-steps li:nth-child(2),
  html[data-style-system="content"] body[data-page="projects"] .project-steps li:nth-child(4),
  html[data-style-system="content"] body[data-page="futures"] .info-card:nth-child(2),
  html[data-style-system="content"] body[data-page="futures"] .info-card:nth-child(3),
  html[data-style-system="content"] body[data-page="futures"] .info-card:nth-child(4),
  html[data-style-system="content"] body[data-page="why"] .narrative-timeline li:nth-child(3n + 2) {
    transform: none;
  }

  html[data-style-system="content"] body[data-page="why"] .narrative-timeline {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-style-system="content"] body[data-page="why"] .narrative-timeline::before {
    right: 12%;
    left: 12%;
  }
}

@media (max-width: 560px) {
  html[data-style-system="content"] body[data-page="collaborate"] .project-engine,
  html[data-style-system="content"] body[data-page="projects"] .project-engine {
    padding: 20px;
  }

  html[data-style-system="content"] body[data-page="reflective"] .comparison-card,
  html[data-style-system="content"] body[data-page="reflective"] .demo-panels,
  html[data-style-system="content"] body[data-page="reflective"] .raio-diagram,
  html[data-style-system="content"] body[data-page="futures"] .info-card {
    border-radius: 7px;
  }

  html[data-style-system="content"] body[data-page="why"] .narrative-timeline {
    grid-template-columns: 1fr;
    padding-top: 0;
  }

  html[data-style-system="content"] body[data-page="why"] .narrative-timeline::before,
  html[data-style-system="content"] body[data-page="why"] .narrative-timeline li::before {
    display: none;
  }

  html[data-style-system="content"] body[data-page="why"] .narrative-timeline li {
    min-height: 0;
  }
}

@media (max-width: 560px) {
  html[data-style-system="content"] body[data-page="reflective"] .reflective-principles li {
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 8px 16px;
  }

  html[data-style-system="content"] body[data-page="reflective"] .reflective-principles h3,
  html[data-style-system="content"] body[data-page="reflective"] .reflective-principles p {
    grid-column: 2;
  }
}

@media (max-width: 640px) {
  html[data-style-system="content"] body[data-page="reflective"] .raio-diagram {
    display: grid;
    gap: 0;
    min-height: 0;
    padding: 10px 0 0;
  }

  html[data-style-system="content"] body[data-page="reflective"] .raio-diagram::before,
  html[data-style-system="content"] body[data-page="reflective"] .raio-diagram::after {
    display: none;
  }

  html[data-style-system="content"] body[data-page="reflective"] .raio-connection-map {
    display: none;
  }

  html[data-style-system="content"] body[data-page="reflective"] .raio-core,
  html[data-style-system="content"] body[data-page="reflective"] .raio-node {
    position: static;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    min-width: 0;
    transform: none;
    text-align: left;
  }

  html[data-style-system="content"] body[data-page="reflective"] .raio-node {
    grid-template-columns: 32px minmax(0, 1fr);
    position: relative;
    gap: 4px 14px;
    padding: 0 0 20px;
  }

  html[data-style-system="content"] body[data-page="reflective"] .raio-node:not(.raio-node-6)::after {
    position: absolute;
    top: 32px;
    bottom: 0;
    left: 15px;
    width: 1px;
    background: linear-gradient(var(--raio-accent), rgba(23, 23, 19, 0.12));
    content: "";
  }

  html[data-style-system="content"] body[data-page="reflective"] .raio-node > span {
    grid-row: span 2;
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border: 1px solid currentColor;
    border-radius: 50%;
    background: var(--bg-soft);
    font-size: 0.68rem;
    justify-content: center;
  }

  html[data-style-system="content"] body[data-page="reflective"] .raio-node > span::after {
    display: none;
  }

  html[data-style-system="content"] body[data-page="reflective"] .raio-node small {
    grid-column: 2;
  }
}

/* Primary navigation hierarchy */
html[data-style-system="content"] .site-nav > ul > .nav-item,
html[data-style-system="content"] .mobile-panel .nav-item {
  position: relative;
}

html[data-style-system="content"] .site-nav .has-dropdown > a::after,
html[data-style-system="content"] .mobile-panel .has-dropdown > a::after {
  width: 6px;
  height: 6px;
  margin-left: 8px;
  border-right: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  content: "";
  transform: translateY(-2px) rotate(45deg);
  transition: transform 160ms ease;
}

html[data-style-system="content"] .site-nav .has-dropdown:hover > a::after,
html[data-style-system="content"] .site-nav .has-dropdown:focus-within > a::after {
  transform: translateY(2px) rotate(225deg);
}

html[data-style-system="content"] .site-nav .nav-dropdown {
  position: absolute;
  top: calc(100% - 1px);
  left: 0;
  z-index: 250;
  display: none;
  min-width: 220px;
  padding: 8px;
  border: 1px solid var(--line);
  background: var(--bg);
  box-shadow: 0 18px 40px rgba(0, 0, 22, 0.1);
}

html[data-style-system="content"] .site-nav .has-dropdown:hover > .nav-dropdown,
html[data-style-system="content"] .site-nav .has-dropdown:focus-within > .nav-dropdown {
  display: grid;
  gap: 2px;
}

html[data-style-system="content"] .site-nav .nav-dropdown a {
  width: 100%;
  min-height: 40px;
  padding: 9px 10px;
  text-decoration: none;
}

html[data-style-system="content"] .mobile-panel .nav-dropdown {
  position: static;
  display: grid;
  min-width: 0;
  gap: 2px;
  padding: 0 0 4px 12px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

html[data-style-system="content"] .mobile-panel .nav-dropdown a {
  min-height: 38px;
  padding: 9px 12px;
  color: rgba(0, 0, 22, 0.62);
  font-size: var(--body-size);
}

/* Keep the mobile navigation's expanded groups as grids in every state.
   The imported desktop rule switches hovered groups to block layout, which
   removes the row gap and makes the menu jump. */
@media (max-width: 920px) {
  html[data-style-system="content"] .mobile-panel .has-dropdown > a::after {
    display: none;
  }

  html[data-style-system="content"] .mobile-panel .nav-item:hover > .nav-dropdown,
  html[data-style-system="content"] .mobile-panel .nav-item:focus-within > .nav-dropdown {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 2px;
    padding: 0 0 4px 12px;
  }
}

/* New English landing page */
html[data-style-system="content"] .home-hero {
  position: relative;
  min-height: min(720px, calc(100svh - var(--header-h)));
  overflow: hidden;
  padding: clamp(92px, 13vw, 180px) var(--page-x) clamp(90px, 12vw, 150px);
  background: var(--bg);
}

html[data-style-system="content"] .home-hero::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: var(--line);
  content: "";
}

html[data-style-system="content"] .home-hero-stream {
  position: absolute;
  inset: 0;
  opacity: 0.42;
  pointer-events: none;
}

html[data-style-system="content"] .home-hero-stream svg {
  width: 100%;
  height: 100%;
}

html[data-style-system="content"] .home-stream {
  fill: none;
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
}

html[data-style-system="content"] .home-stream-blue { stroke: var(--blue); }
html[data-style-system="content"] .home-stream-gold { stroke: var(--gold); }
html[data-style-system="content"] .home-stream-red { stroke: var(--red); }

html[data-style-system="content"] .home-hero-inner {
  position: relative;
  z-index: 1;
}

html[data-style-system="content"] .home-hero h1 {
  max-width: 920px;
  margin: 0 0 30px;
  font-size: clamp(3.1rem, 8vw, 7.2rem);
}

html[data-style-system="content"] .home-hero-copy {
  max-width: 720px;
  margin: 0;
  color: rgba(0, 0, 22, 0.76);
  font-size: clamp(1.08rem, 1.8vw, 1.36rem);
  line-height: 1.45;
}

html[data-style-system="content"] .home-hero .hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

html[data-style-system="content"] .home-section-heading {
  max-width: 820px;
  margin-bottom: 46px;
}

html[data-style-system="content"] .home-section-heading h2 {
  margin-bottom: 22px;
}

html[data-style-system="content"] .home-section-heading .section-lead {
  margin-right: 0;
  margin-left: 0;
}

html[data-style-system="content"] .home-orientation {
  padding-bottom: clamp(72px, 8vw, 112px);
}

html[data-style-system="content"] .home-link-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  border: 1px solid var(--line);
  background: var(--line);
}

html[data-style-system="content"] .home-link-card {
  display: flex;
  min-height: 260px;
  flex-direction: column;
  align-items: flex-start;
  padding: 26px 24px 24px;
  background: var(--bg);
  color: var(--ink);
  text-decoration: none;
  transition: background-color 180ms ease, transform 180ms ease;
}

html[data-style-system="content"] .home-link-card:hover,
html[data-style-system="content"] .home-link-card:focus-visible {
  background: var(--bg-strong);
  box-shadow: inset 0 1px 0 var(--line);
  transform: translateY(-4px);
}

html[data-style-system="content"] .home-card-index {
  margin-bottom: 44px;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .home-link-card h3 {
  margin-bottom: 12px;
  font-size: clamp(1.7rem, 2.4vw, 2.45rem);
}

html[data-style-system="content"] .home-link-card p {
  margin-bottom: 22px;
  color: rgba(0, 0, 22, 0.7);
  font-size: var(--body-small-size);
}

html[data-style-system="content"] .home-link-card .text-link,
html[data-style-system="content"] .home-visual-card .text-link {
  margin-top: auto;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  text-decoration: none;
  text-transform: uppercase;
}

html[data-style-system="content"] .home-evidence .home-section-heading {
  margin-bottom: 36px;
}

html[data-style-system="content"] .home-evidence {
  padding-top: clamp(72px, 8vw, 112px);
}

html[data-style-system="content"] .home-evidence-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

html[data-style-system="content"] .home-visual-card {
  display: flex;
  min-height: 470px;
  flex-direction: column;
  padding: clamp(24px, 4vw, 42px);
  /* border: 1px solid var(--line);
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.38); */
}

/* .home-visual-card:nth-child(1) { border-top: 4px solid var(--blue); }
.home-visual-card:nth-child(2) { border-top: 4px solid var(--gold); } */

html[data-style-system="content"] .home-visual-card-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

html[data-style-system="content"] .home-visual-card-heading .eyebrow {
  margin-bottom: 14px;
}

html[data-style-system="content"] .home-visual-card h3 {
  max-width: 420px;
  margin-bottom: 18px;
  font-size: clamp(1.9rem, 3vw, 3rem);
}

html[data-style-system="content"] .home-visual-copy {
  max-width: 540px;
  margin-bottom: 30px;
  color: rgba(0, 0, 22, 0.72);
}

html[data-style-system="content"] .publication-bars {
  display: flex;
  align-items: stretch;
  gap: clamp(4px, 1vw, 12px);
  height: 190px;
  margin: auto 0 28px;
  padding: 25px 0 0;
}

html[data-style-system="content"] .publication-bar {
  position: relative;
  display: flex;
  min-width: 0;
  flex: 1 1 0;
  align-items: flex-end;
  justify-content: center;
}

html[data-style-system="content"] .publication-bar::before {
  position: absolute;
  right: 0;
  bottom: 26px;
  left: 0;
  height: var(--bar-height);
  min-height: 8px;
  background: linear-gradient(180deg, var(--blue), rgba(0, 108, 174, 0.44));
  content: "";
}

html[data-style-system="content"] .publication-bar i,
html[data-style-system="content"] .publication-bar b {
  position: absolute;
  z-index: 1;
  font-family: var(--font-mono);
  font-size: 0.62rem;
  font-style: normal;
  line-height: 1;
}

html[data-style-system="content"] .publication-bar i {
  bottom: 0;
  color: var(--muted);
  transform: rotate(-45deg) translate(-4px, 2px);
  transform-origin: left center;
}

html[data-style-system="content"] .publication-bar b {
  bottom: calc(var(--bar-height) + 32px);
  color: var(--ink);
}

html[data-style-system="content"] .home-project-path {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
  padding: 0;
  margin: auto 0 42px;
  list-style: none;
}

html[data-style-system="content"] .home-project-path li {
  position: relative;
  min-height: 118px;
  padding: 16px 8px 0 0;
  border-top: 1px solid var(--gold);
}

html[data-style-system="content"] .home-project-path li:not(:last-child)::after {
  position: absolute;
  top: -4px;
  right: 10px;
  width: 7px;
  height: 7px;
  border-top: 1px solid var(--gold);
  border-right: 1px solid var(--gold);
  content: "";
  transform: rotate(45deg);
}

html[data-style-system="content"] .home-project-path li span {
  display: block;
  margin-bottom: 20px;
  color: var(--gold);
  font-family: var(--font-mono);
  font-size: 0.68rem;
}

html[data-style-system="content"] .home-project-path li strong {
  display: block;
  font-family: var(--font-serif);
  font-size: clamp(1.1rem, 1.8vw, 1.5rem);
  font-weight: 400;
}

html[data-style-system="content"] .home-collaborate {
  background: var(--ink);
  color: var(--bg);
}

html[data-style-system="content"] .home-collaborate .eyebrow,
html[data-style-system="content"] .home-collaborate p {
  color: rgba(251, 250, 246, 0.72);
}

html[data-style-system="content"] .home-collaborate h2 {
  max-width: 850px;
  margin-left: 0;
  color: var(--bg);
}

html[data-style-system="content"] .home-collaborate > .section-shell > p:not(.eyebrow) {
  max-width: 680px;
  margin-right: auto;
  margin-left: 0;
}

html[data-style-system="content"] .home-collaborate .button-primary {
  background: var(--bg);
  color: var(--ink);
}

html[data-style-system="content"] .home-collaborate .button-secondary {
  border-color: rgba(251, 250, 246, 0.36);
  background: rgba(251, 250, 246, 0.08);
  color: var(--bg);
}

html[data-style-system="content"] body[data-page="home"] .home-collaborate .home-email-button:hover,
html[data-style-system="content"] body[data-page="home"] .home-collaborate .home-email-button:focus-visible {
  box-shadow: 6px 6px 0 rgba(0, 108, 174, 0.22);
}

@media (max-width: 920px) {
  html[data-style-system="content"] .site-nav .nav-dropdown {
    position: static;
    min-width: 0;
    border: 0;
    box-shadow: none;
  }

  html[data-style-system="content"] .home-link-grid,
  html[data-style-system="content"] .home-evidence-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 561px) and (max-width: 1200px) {
  html[data-style-system="content"] .home-project-path li strong {
    white-space: nowrap;
    transform: translateX(10px) rotate(45deg) translateY(-10px);
    transform-origin: left top;
  }
}

@media (max-width: 560px) {
  html[data-style-system="content"] .home-hero {
    min-height: 0;
  }

  html[data-style-system="content"] .home-hero h1 {
    font-size: clamp(2.7rem, 14vw, 4.2rem);
  }

  html[data-style-system="content"] .home-link-grid,
  html[data-style-system="content"] .home-evidence-grid {
    grid-template-columns: 1fr;
  }

  html[data-style-system="content"] .home-link-card {
    min-height: 0;
  }

  html[data-style-system="content"] .home-card-index {
    margin-bottom: 28px;
  }

  html[data-style-system="content"] .home-visual-card {
    min-height: 0;
  }

  html[data-style-system="content"] .home-project-path {
    grid-template-columns: 1fr;
    gap: 0;
  }

  html[data-style-system="content"] .home-project-path li {
    min-height: 0;
    padding: 14px 0 14px 42px;
    border-top: 0;
    border-left: 1px solid var(--gold);
  }

  html[data-style-system="content"] .home-project-path li:not(:last-child)::after {
    top: auto;
    right: auto;
    bottom: -4px;
    left: -4px;
    transform: rotate(135deg);
  }

  html[data-style-system="content"] .home-project-path li span {
    position: absolute;
    top: 14px;
    left: 12px;
    margin: 0;
  }
}


/* Projects: a single research-to-practice narrative. */
html[data-style-system="content"] body[data-page="projects"] .projects-intro {
  background: var(--bg);
}

/* Keep every live content hero free of decorative background gradients. */
html[data-style-system="content"] .hero,
html[data-style-system="content"] .page-intro {
  background: var(--bg);
}

html[data-style-system="content"] .project-section-intro {
  margin-bottom: clamp(46px, 7vw, 82px);
}

html[data-style-system="content"] .project-section-intro h2 {
  max-width: 850px;
}


html[data-style-system="content"] .project-collaboration {
  position: relative;
  overflow: hidden;
}

html[data-style-system="content"] .project-collaboration::before {
  position: absolute;
  top: 0;
  right: -10%;
  width: min(44vw, 640px);
  aspect-ratio: 1;
  border: 1px solid rgba(174, 124, 25, 0.15);
  border-radius: 50%;
  content: "";
}

html[data-style-system="content"] .project-research-band {
  padding: clamp(100px, 13vw, 190px) var(--page-x);
  background: var(--bg-soft);
  color: var(--ink);
}

html[data-style-system="content"] .project-research-band::before {
  display: none;
}

html[data-style-system="content"] .project-research-layout {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(290px, 1.1fr);
  gap: clamp(46px, 9vw, 150px);
  align-items: start;
}

html[data-style-system="content"] .project-research-copy .eyebrow {
  color: var(--blue);
}

html[data-style-system="content"] .project-research-copy h2 {
  margin-bottom: 25px;
  color: var(--ink);
}

html[data-style-system="content"] .project-research-copy > p:not(.eyebrow) {
  max-width: 590px;
  margin-bottom: 32px;
  color: rgba(0, 0, 22, 0.72);
  font-size: var(--body-large-size);
}

html[data-style-system="content"] .project-research-copy .hero-actions {
  display: flex;
  flex-wrap: wrap;
}

html[data-style-system="content"] .project-research-copy .button-primary {
  background: var(--bg);
  color: var(--blue);
}

html[data-style-system="content"] .project-research-links a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px 20px;
  padding: 23px 0;
  border-bottom: 1px solid transparent;
  border-image: linear-gradient(90deg, transparent, var(--line-dark) 20%, var(--line-dark) 80%, transparent) 1;
  color: var(--ink);
  text-decoration: none;
}

html[data-style-system="content"] .project-research-links a:last-child {
  border-bottom: 0px solid transparent;
}

html[data-style-system="content"] .project-research-links a::after {
  grid-column: 2;
  grid-row: 1 / span 3;
  align-self: center;
  color: var(--blue);
  content: "↗";
  font-size: 1.2rem;
}

html[data-style-system="content"] .project-research-links span {
  grid-column: 1;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

html[data-style-system="content"] .project-research-links strong {
  grid-column: 1;
  max-width: 520px;
  font-family: var(--font-serif);
  font-size: clamp(1.28rem, 2vw, 1.8rem);
  font-weight: 400;
  line-height: 1.1;
}

html[data-style-system="content"] .project-research-links p {
  grid-column: 1;
  max-width: 520px;
  margin: 0;
  color: rgba(0, 0, 22, 0.68);
  font-size: var(--body-small-size);
  line-height: 1.35;
}

html[data-style-system="content"] .project-research-links a:hover strong,
html[data-style-system="content"] .project-research-links a:focus-visible strong {
  color: var(--blue);
}

@media (max-width: 920px) {
  html[data-style-system="content"] .project-research-layout {
    grid-template-columns: 1fr;
    gap: 58px;
  }
}

@media (max-width: 560px) {
  html[data-style-system="content"] .project-section-intro {
    margin-bottom: 42px;
  }

  html[data-style-system="content"] .project-research-copy .hero-actions,
  html[data-style-system="content"] .project-research-copy .button {
    width: 100%;
  }
}

/* Projects: pillar and collaborator views. */
html[data-style-system="content"] .project-pillar-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: min(1480px, 100%);
  margin: 0 auto;
}

html[data-style-system="content"] .project-pillar {
  --project-pillar-accent: var(--blue);
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 0 clamp(18px, 2.45vw, 42px);
  gap: clamp(10px, 1.45vh, 18px);
}

html[data-style-system="content"] body[data-page="projects"] .project-pillar:nth-child(2) {
  --project-pillar-accent: var(--gold);
}

html[data-style-system="content"] body[data-page="projects"] .project-pillar:nth-child(3) {
  --project-pillar-accent: var(--red);
}

html[data-style-system="content"] .project-pillar + .project-pillar::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 1px;
  background: linear-gradient(to bottom, transparent, rgba(216, 211, 202, 0.85) 10%, rgba(216, 211, 202, 0.85) 90%, transparent);
  content: "";
}

html[data-style-system="content"] .project-pillar-index {
  margin: 0;
  color: var(--project-pillar-accent);
  font-family: var(--font-mono);
  font-size: clamp(0.66rem, 0.72vw, 0.82rem);
  font-weight: var(--accent-weight);
  letter-spacing: 0;
  line-height: 1.2;
}

html[data-style-system="content"] .project-pillar h3 {
  margin: 0;
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: var(--subtitle-size);
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
}

html[data-style-system="content"] .project-pillar-summary {
  min-height: clamp(82px, 8.4vh, 104px);
  margin: 0;
  color: rgba(0, 0, 22, 0.78);
  font-size: clamp(0.96rem, 1.14vw, 1.24rem);
  line-height: 1.34;
}

html[data-style-system="content"] .project-pillar-contributions {
  display: grid;
  gap: 10px;
}

html[data-style-system="content"] .project-pillar-contributions > div {
  position: relative;
  min-height: clamp(74px, 8.4vh, 104px);
  padding: clamp(11px, 1.4vh, 16px) clamp(12px, 1.35vw, 18px);
}

html[data-style-system="content"] .project-pillar-contributions > div::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 1px;
  background: linear-gradient(to bottom, transparent, var(--project-pillar-accent) 12%, var(--project-pillar-accent) 88%, transparent);
  content: "";
}

html[data-style-system="content"] .project-pillar-contributions h4 {
  margin: 0;
  color: var(--project-pillar-accent);
  font-family: var(--font-sans);
  font-size: var(--body-small-size);
  font-weight: 700;
  line-height: 1.12;
}

html[data-style-system="content"] .project-pillar-contributions p {
  margin: 6px 0 0;
  color: rgba(0, 0, 22, 0.66);
  font-size: var(--body-small-size);
  line-height: 1.32;
}

html[data-style-system="content"] .project-pillars-outcome {
  grid-column: 1 / -1;
  max-width: 860px;
  padding-top: clamp(36px, 5vw, 62px);
  margin: clamp(36px, 5vw, 62px) auto 0;
  border-top: 1px solid var(--line);
  color: rgba(0, 0, 22, 0.78);
  font-family: var(--font-serif);
  font-size: clamp(1.45rem, 2.35vw, 2.05rem);
  line-height: 1.14;
  text-align: center;
}

html[data-style-system="content"] .project-collaboration::before {
  display: none;
}

html[data-style-system="content"] .project-path-grid {
  margin-top: 0;
  margin-bottom: 0;
}

html[data-style-system="content"] .project-path-grid .path-card {
  min-height: 235px;
}

@media (max-width: 860px) {
  html[data-style-system="content"] .project-pillar-grid {
    grid-template-columns: 1fr;
    gap: 44px;
    max-width: 680px;
  }

  html[data-style-system="content"] .project-pillar {
    min-height: 0;
    padding: 0;
  }

  html[data-style-system="content"] .project-pillar + .project-pillar::before {
    top: -22px;
    right: 0;
    bottom: auto;
    left: 0;
    width: auto;
    height: 1px;
    background: var(--line);
  }

  html[data-style-system="content"] .project-pillar-summary,
  html[data-style-system="content"] .project-pillar-contributions > div {
    min-height: 0;
  }

  html[data-style-system="content"] .project-pillars-outcome {
    margin-top: 4px;
  }
}

@media (max-width: 560px) {
  html[data-style-system="content"] .project-path-grid .path-card {
    min-height: 0;
  }
}

/* Compact contribution lines with numbered eyebrows and pillar dividers. */
html[data-style-system="content"] .project-pillar + .project-pillar::before {
  top: 0;
  right: auto;
  bottom: 0;
  left: 0;
  display: block;
  width: 1px;
  height: auto;
  background: linear-gradient(to bottom, transparent, rgba(216, 211, 202, 0.85) 10%, rgba(216, 211, 202, 0.85) 90%, transparent);
}

html[data-style-system="content"] .project-pillar-contributions {
  gap: clamp(18px, 2vw, 30px);
}

html[data-style-system="content"] .project-pillar-contributions > div {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  column-gap: 6px;
  align-items: baseline;
  min-height: 0;
  padding: 0;
}

html[data-style-system="content"] .project-pillar-contributions > div::before {
  display: none;
}

html[data-style-system="content"] .project-contribution-index {
  grid-column: 1;
  align-self: baseline;
  margin: 0;
  color: var(--project-pillar-accent);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  letter-spacing: 0.04em;
  line-height: 1.2;
}

html[data-style-system="content"] .project-contribution-copy {
  grid-column: 2;
  align-self: baseline;
  min-width: 0;
}

html[data-style-system="content"] .project-contribution-copy h4,
html[data-style-system="content"] .project-contribution-copy p {
  display: inline;
}

html[data-style-system="content"] .project-contribution-copy h4 {
  margin: 0;
}

html[data-style-system="content"] .project-contribution-copy h4::after {
  content: ": ";
}

html[data-style-system="content"] .project-contribution-copy p {
  margin: 0;
}

@media (max-width: 860px) {
  html[data-style-system="content"] .project-pillar + .project-pillar::before {
    display: none;
  }
}

/* RAIO is an editorial compass: one continuous reflective thread, with the
   six conditions treated as annotations rather than a dense system diagram. */
html[data-style-system="content"] body[data-page="reflective"] .raio-diagram {
  container-type: inline-size;
  width: min(100%, 620px);
  aspect-ratio: 1 / 1;
  min-height: 0;
  margin-inline: auto;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-diagram::before,
html[data-style-system="content"] body[data-page="reflective"] .raio-diagram::after {
  display: none;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-connection-map {
  width: min(78%, 420px);
}

html[data-style-system="content"] body[data-page="reflective"] .raio-thread-base,
html[data-style-system="content"] body[data-page="reflective"] .raio-thread {
  fill: none;
  vector-effect: non-scaling-stroke;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-thread-base {
  stroke: rgba(23, 23, 19, 0.18);
  stroke-width: 0.55;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-thread {
  stroke: var(--ink);
  stroke-dasharray: 1 3;
  stroke-linecap: round;
  stroke-width: 1.25;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-station {
  stroke: var(--bg-soft);
  stroke-width: 1.2;
  vector-effect: non-scaling-stroke;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-station-1,
html[data-style-system="content"] body[data-page="reflective"] .raio-station-4 {
  fill: var(--blue);
}

html[data-style-system="content"] body[data-page="reflective"] .raio-station-2,
html[data-style-system="content"] body[data-page="reflective"] .raio-station-5 {
  fill: var(--gold);
}

html[data-style-system="content"] body[data-page="reflective"] .raio-station-3,
html[data-style-system="content"] body[data-page="reflective"] .raio-station-6 {
  fill: var(--red);
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node {
  width: min(28%, 170px);
  gap: clamp(3px, 0.8cqw, 5px);
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node > strong {
  font-size: clamp(1.05rem, 3.5cqw, 1.55rem);
  line-height: 1;
  text-wrap: balance;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node > span::after {
  display: none;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node small {
  font-size: clamp(0.75rem, 2.15cqw, var(--body-small-size));
  line-height: 1.28;
  text-wrap: balance;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node-1 {
  top: 10%;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node-2 {
  top: 24%;
  right: 2%;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node-3 {
  right: 2%;
  bottom: 24%;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node-4 {
  bottom: 10%;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node-5 {
  bottom: 24%;
  left: 2%;
}

html[data-style-system="content"] body[data-page="reflective"] .raio-node-6 {
  top: 24%;
  left: 2%;
}

@media (max-width: 640px) {
  html[data-style-system="content"] body[data-page="reflective"] .raio-diagram {
    display: none;
  }
}

/* Research and publications share exact rules; profile deltas stay in source order. */


html[data-style-system="research"]:root {
  color-scheme: light;
  --font-serif: "Analogist", Georgia, "Times New Roman", serif;
  --font-sans: "Creato Display", Inter, ui-sans-serif, system-ui, sans-serif;
  --font-mono: ui-monospace, "SFMono-Regular", Menlo, Monaco, Consolas, monospace;
  --bg: #fbfaf6;
  --bg-soft: #f1eee7;
  --ink: #000016;
  --muted: #706c64;
  --line-dark: #c8c3ba;
  --line: #d8d3ca;
  --blue: #174ea6;
  --blue-soft: rgba(0, 108, 174, 0.13);
  --gold: #ae7c19;
  --red: #a94842;
  --red-soft: rgba(165, 74, 68, 0.15);
  --teal: #1d716e;
  --max: 1240px;
  --copy: 720px;
  --title-size: clamp(2.15rem, 6.2vw, 4rem);
  --subtitle-size: clamp(1.6rem, 3vw, 2.4rem);
  --body-size: 1rem;
  --body-large-size: 1.15rem;
  --body-small-size: 0.9rem;
  --accent-size: 0.76rem;
  --accent-color: var(--blue);
  --accent-weight: 700;
  --page-x: clamp(20px, 5vw, 86px);
  --header-h: 70px;
  --intro-copy-offset: 33px;
  --need-question-gap: clamp(30px, 2vw, 60px);
  --need-question-height: clamp(60px, 25svh, 620px);
  --ease: cubic-bezier(0.22, 0.7, 0.2, 1);
}

html[data-style-system="publications"]:root {
  color-scheme: light;
  --font-serif: "Analogist", Georgia, "Times New Roman", serif;
  --font-sans: "Creato Display", Inter, ui-sans-serif, system-ui, sans-serif;
  --font-mono: ui-monospace, "SFMono-Regular", Menlo, Monaco, Consolas, monospace;
  --bg: #fbfaf6;
  --bg-soft: #f1eee7;
  --ink: #000016;
  --muted: #706c64;
  --line-dark: #c8c3ba;
  --line: #d8d3ca;
  --blue: #174ea6;
  --gold: #ae7c19;
  --red: #a94842;
  --teal: #1d716e;
  --max: 1240px;
  --copy: 720px;
  --title-size: clamp(2.15rem, 6.2vw, 4rem);
  --subtitle-size: clamp(1.6rem, 3vw, 2.4rem);
  --body-size: 1rem;
  --body-large-size: 1.15rem;
  --body-small-size: 0.9rem;
  --accent-size: 0.76rem;
  --accent-color: var(--blue);
  --accent-weight: 700;
  --page-x: clamp(20px, 5vw, 86px);
  --header-h: 70px;
  --intro-copy-offset: 33px;
  --need-question-gap: clamp(30px, 2vw, 60px);
  --need-question-height: clamp(60px, 25svh, 620px);
  --ease: cubic-bezier(0.22, 0.7, 0.2, 1);
}

html[data-style-system="research"], html[data-style-system="research"] *, html[data-style-system="publications"], html[data-style-system="publications"] * { box-sizing: border-box; }

html[data-style-system="research"], html[data-style-system="publications"] {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-h) + 20px);
  overflow-x: hidden;
  overflow-x: clip;
  overscroll-behavior-x: none;
}

html[data-style-system="research"] body, html[data-style-system="publications"] body {
  min-width: 320px;
  margin: 0;
  overflow-x: hidden;
  overflow-x: clip;
  overscroll-behavior-x: none;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: var(--body-size);
  line-height: 1.55;
  text-rendering: geometricPrecision;
}

html[data-style-system="research"].nav-open, html[data-style-system="publications"].nav-open,
html[data-style-system="research"] body.modal-open, html[data-style-system="publications"] body.modal-open,
html[data-style-system="research"] body.nav-open, html[data-style-system="publications"] body.nav-open {
  overflow: hidden;
  overscroll-behavior: none;
}

html[data-style-system="research"] img, html[data-style-system="publications"] img, html[data-style-system="research"] svg, html[data-style-system="publications"] svg { display: block; max-width: 100%; }

html[data-style-system="research"] a, html[data-style-system="publications"] a { color: inherit; text-decoration-color: rgba(23, 78, 166, 0.48); text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
html[data-style-system="research"] a:hover, html[data-style-system="publications"] a:hover { text-decoration-color: currentColor; }

html[data-style-system="research"] button, html[data-style-system="publications"] button, html[data-style-system="research"] input, html[data-style-system="publications"] input, html[data-style-system="research"] textarea, html[data-style-system="publications"] textarea { font: inherit; }
html[data-style-system="research"] button, html[data-style-system="publications"] button, html[data-style-system="research"] a, html[data-style-system="publications"] a { -webkit-tap-highlight-color: transparent; }

html[data-style-system="research"] :focus-visible, html[data-style-system="publications"] :focus-visible { outline: 3px solid #005fcc; outline-offset: 4px; }
html[data-style-system="research"]::selection, html[data-style-system="research"] ::selection, html[data-style-system="publications"]::selection, html[data-style-system="publications"] ::selection { background: var(--ink); color: var(--bg); }

html[data-style-system="research"] .visually-hidden, html[data-style-system="publications"] .visually-hidden,
html[data-style-system="research"] .skip-link:not(:focus), html[data-style-system="publications"] .skip-link:not(:focus) {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

html[data-style-system="research"] .skip-link:focus, html[data-style-system="publications"] .skip-link:focus {
  position: fixed;
  top: 14px;
  left: 14px;
  z-index: 300;
  padding: 12px 16px;
  background: var(--ink);
  color: var(--bg);
  font-weight: 700;
}

html[data-style-system="research"] .reading-progress, html[data-style-system="publications"] .reading-progress {
  position: fixed;
  inset: 0 0 auto;
  z-index: 300;
  height: 3px;
  background: transparent;
}

html[data-style-system="research"] .reading-progress span, html[data-style-system="publications"] .reading-progress span {
  display: block;
  width: 0;
  height: 100%;
  background: linear-gradient(90deg, var(--blue), var(--gold), var(--red));
  /* Keep the gradient mapped to the full bar while this element reveals it. */
  background-size: 100vw 100%;
  background-repeat: no-repeat;
  transform-origin: left center;
}

html[data-style-system="research"] .site-header, html[data-style-system="publications"] .site-header {
  position: sticky;
  top: 0;
  z-index: 220;
  min-height: var(--header-h);
  border-bottom: 1px solid rgba(216, 211, 202, 0.58);
  background: rgba(251, 250, 246, 0.94);
  backdrop-filter: blur(15px);
  transition: box-shadow 180ms ease, background-color 180ms ease;
}

html[data-style-system="research"] .site-header.is-scrolled, html[data-style-system="publications"] .site-header.is-scrolled { background: rgba(251, 250, 246, 0.98); box-shadow: 0 8px 28px rgba(0, 0, 22, 0.06); }

html[data-style-system="research"] .header-inner, html[data-style-system="publications"] .header-inner {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: clamp(4px, 1.4vw, 20px);
  width: min(100%, calc(var(--max) + (var(--page-x) * 2)));
  min-height: var(--header-h);
  margin: 0 auto;
  padding: 10px var(--page-x);
}

html[data-style-system="research"] .brand-link, html[data-style-system="publications"] .brand-link { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; color: var(--ink); text-decoration: none; }
html[data-style-system="research"] .brand-icon, html[data-style-system="publications"] .brand-icon { width: 30px; height: 30px; }
html[data-style-system="research"] .brand-wordmark, html[data-style-system="publications"] .brand-wordmark { width: 130px; }

html[data-style-system="research"] .site-nav, html[data-style-system="publications"] .site-nav { min-width: 0; margin-left: auto; }
html[data-style-system="research"] .nav-list, html[data-style-system="publications"] .nav-list { display: flex; align-items: center; gap: clamp(4px, 1.4vw, 20px); padding: 0; margin: 0; list-style: none; }
html[data-style-system="research"] .nav-item, html[data-style-system="publications"] .nav-item { position: relative; }
html[data-style-system="research"] .nav-list a, html[data-style-system="publications"] .nav-list a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 8px; color: rgba(0, 0, 22, 0.68); font-family: var(--font-serif); font-size: var(--body-size); text-decoration: none; }
html[data-style-system="research"] .nav-list a:hover, html[data-style-system="publications"] .nav-list a:hover, html[data-style-system="research"] .nav-list a.is-active, html[data-style-system="publications"] .nav-list a.is-active, html[data-style-system="research"] .nav-list a[aria-current="page"], html[data-style-system="publications"] .nav-list a[aria-current="page"] { color: var(--blue); }
html[data-style-system="research"] .nav-item.has-dropdown > a::after, html[data-style-system="publications"] .nav-item.has-dropdown > a::after { width: 6px; height: 6px; margin-left: 8px; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; content: ""; transform: translateY(-2px) rotate(45deg); transition: transform 160ms ease; }
html[data-style-system="research"] .nav-item.has-dropdown:hover > a::after, html[data-style-system="publications"] .nav-item.has-dropdown:hover > a::after, html[data-style-system="research"] .nav-item.has-dropdown:focus-within > a::after, html[data-style-system="publications"] .nav-item.has-dropdown:focus-within > a::after { transform: translateY(2px) rotate(225deg); }
html[data-style-system="research"] .nav-dropdown, html[data-style-system="publications"] .nav-dropdown { position: absolute; top: calc(100% - 2px); left: 0; display: none; min-width: 220px; padding: 8px; border: 1px solid var(--line); background: var(--bg); box-shadow: 0 18px 40px rgba(0, 0, 22, 0.1); }
html[data-style-system="research"] .nav-item:hover .nav-dropdown, html[data-style-system="publications"] .nav-item:hover .nav-dropdown, html[data-style-system="research"] .nav-item:focus-within .nav-dropdown, html[data-style-system="publications"] .nav-item:focus-within .nav-dropdown { display: block; }
html[data-style-system="research"] .nav-dropdown a, html[data-style-system="publications"] .nav-dropdown a { width: 100%; min-height: 40px; padding: 9px 10px; }

html[data-style-system="research"] .language-control, html[data-style-system="publications"] .language-control { position: relative; display: inline-flex; align-items: center; flex: 0 0 auto; padding: 0; border: 0; background: transparent; }
html[data-style-system="research"] .language-trigger, html[data-style-system="publications"] .language-trigger { display: inline-flex; align-items: center; width: max-content; min-width: 52px; min-height: 44px; padding: 8px 12px 8px 0; border: 0; outline: 0; background: transparent; color: var(--blue); cursor: pointer; font-family: var(--font-mono); font-size: var(--accent-size); font-weight: 700; line-height: 1.2; list-style: none; }
html[data-style-system="research"] .language-trigger::-webkit-details-marker, html[data-style-system="publications"] .language-trigger::-webkit-details-marker { display: none; }
html[data-style-system="research"] .language-trigger::after, html[data-style-system="publications"] .language-trigger::after { flex: 0 0 auto; width: 5.5px; height: 5.5px; margin-left: 6px; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; content: ""; transform: translateY(-1px) rotate(45deg); transition: transform 160ms ease; }
html[data-style-system="research"] .language-control[open] .language-trigger::after, html[data-style-system="publications"] .language-control[open] .language-trigger::after { transform: translateY(2px) rotate(225deg); }
html[data-style-system="research"] .language-trigger:hover, html[data-style-system="publications"] .language-trigger:hover, html[data-style-system="research"] .language-trigger:focus-visible, html[data-style-system="publications"] .language-trigger:focus-visible { background: transparent; color: var(--blue); }
html[data-style-system="research"] .language-menu, html[data-style-system="publications"] .language-menu { position: absolute; top: calc(100% - 2px); left: -18px; z-index: 260; display: none; width: max-content; min-width: 0; padding: 8px; background: var(--bg); box-shadow: 0 18px 40px rgba(0, 0, 22, 0.1); }
html[data-style-system="research"] .language-control[open] .language-menu, html[data-style-system="publications"] .language-control[open] .language-menu { display: grid; gap: 2px; }
html[data-style-system="research"] .language-menu-option, html[data-style-system="publications"] .language-menu-option { display: flex; align-items: center; justify-content: flex-start; width: auto; min-width: max-content; min-height: 40px; padding: 8px 10px; overflow: visible; background: var(--bg); color: var(--ink); font-family: var(--font-mono); font-size: var(--accent-size); font-weight: 700; line-height: 1.2; text-align: left; text-decoration: none; white-space: nowrap; }
html[data-style-system="research"] .language-menu-option:hover, html[data-style-system="publications"] .language-menu-option:hover, html[data-style-system="research"] .language-menu-option:focus-visible, html[data-style-system="publications"] .language-menu-option:focus-visible, html[data-style-system="research"] .language-menu-option[aria-current="true"], html[data-style-system="publications"] .language-menu-option[aria-current="true"] { background: var(--bg-soft); color: var(--blue); }

html[data-style-system="research"] .mobile-language, html[data-style-system="publications"] .mobile-language { display: none; }

html[data-style-system="research"] .nav-toggle, html[data-style-system="publications"] .nav-toggle { display: none; place-items: center; flex: 0 0 auto; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; color: var(--ink); cursor: pointer; }
html[data-style-system="research"] .nav-toggle-lines, html[data-style-system="publications"] .nav-toggle-lines, html[data-style-system="research"] .nav-toggle-lines::before, html[data-style-system="publications"] .nav-toggle-lines::before, html[data-style-system="research"] .nav-toggle-lines::after, html[data-style-system="publications"] .nav-toggle-lines::after { display: block; width: 19px; height: 2px; background: currentColor; content: ""; }
html[data-style-system="research"] .nav-toggle-lines, html[data-style-system="publications"] .nav-toggle-lines { position: relative; }
html[data-style-system="research"] .nav-toggle-lines::before, html[data-style-system="publications"] .nav-toggle-lines::before, html[data-style-system="research"] .nav-toggle-lines::after, html[data-style-system="publications"] .nav-toggle-lines::after { position: absolute; left: 0; }
html[data-style-system="research"] .nav-toggle-lines::before, html[data-style-system="publications"] .nav-toggle-lines::before { top: -6px; }
html[data-style-system="research"] .nav-toggle-lines::after, html[data-style-system="publications"] .nav-toggle-lines::after { top: 6px; }

/* Keep the fixed menu attached to the viewport in Safari while the sticky
   header is using a backdrop filter. */
html[data-style-system="research"] body.nav-open .site-header, html[data-style-system="publications"] body.nav-open .site-header {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  backdrop-filter: none;
}

html[data-style-system="research"] body::before, html[data-style-system="publications"] body::before {
  position: fixed;
  inset: var(--header-h) 0 0;
  z-index: 210;
  background: rgba(251, 250, 246, 0.94);
  content: "";
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  backdrop-filter: blur(0);
  -webkit-backdrop-filter: blur(0);
  transition: opacity 260ms ease, visibility 0s linear 260ms, backdrop-filter 260ms ease, -webkit-backdrop-filter 260ms ease;
}

html[data-style-system="research"] body.nav-open::before, html[data-style-system="publications"] body.nav-open::before {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  transition-delay: 0s;
}

html[data-style-system="research"] .section-frame, html[data-style-system="publications"] .section-frame { width: min(100%, var(--max)); margin: 0 auto; }
html[data-style-system="research"] .narrow-frame, html[data-style-system="publications"] .narrow-frame { width: min(100%, 920px); }
html[data-style-system="research"] .eyebrow, html[data-style-system="publications"] .eyebrow { margin: 0 0 16px; color: var(--accent-color); font-family: var(--font-mono); font-size: var(--accent-size); font-weight: var(--accent-weight); letter-spacing: 0.04em; line-height: 1.2; text-transform: uppercase; }
html[data-style-system="research"] h1, html[data-style-system="publications"] h1, html[data-style-system="research"] h2, html[data-style-system="publications"] h2, html[data-style-system="research"] h3, html[data-style-system="publications"] h3, html[data-style-system="research"] p, html[data-style-system="publications"] p { margin-top: 0; }
html[data-style-system="research"] h1, html[data-style-system="publications"] h1, html[data-style-system="research"] h2, html[data-style-system="publications"] h2 { font-family: var(--font-serif); font-weight: 400; letter-spacing: -0.025em; line-height: 0.98; }
html[data-style-system="research"] h1, html[data-style-system="publications"] h1 { max-width: 1000px; margin-bottom: 28px; font-size: var(--title-size); }
html[data-style-system="research"] h2, html[data-style-system="publications"] h2 { max-width: 960px; margin-bottom: 24px; font-size: var(--title-size); }
html[data-style-system="research"] h3, html[data-style-system="publications"] h3 { margin-bottom: 10px; font-family: var(--font-serif); font-size: var(--subtitle-size); font-weight: 400; line-height: 1.05; }
html[data-style-system="research"] .lead, html[data-style-system="publications"] .lead { max-width: var(--copy); margin-bottom: 0; color: rgba(0, 0, 22, 0.76); font-size: var(--body-large-size); line-height: 1.42; }
html[data-style-system="research"] .two-column-intro .lead + .lead, html[data-style-system="publications"] .two-column-intro .lead + .lead { margin-top: 24px; }
html[data-style-system="research"] .section-copy, html[data-style-system="publications"] .section-copy { max-width: var(--copy); color: rgba(0, 0, 22, 0.72); font-size: var(--body-size); text-align: justify; }
html[data-style-system="research"] .two-column-intro > .section-copy, html[data-style-system="publications"] .two-column-intro > .section-copy, html[data-style-system="research"] .definition-grid > .section-copy, html[data-style-system="publications"] .definition-grid > .section-copy { padding-top: var(--intro-copy-offset); }
html[data-style-system="research"] .section-copy p:last-child, html[data-style-system="publications"] .section-copy p:last-child { margin-bottom: 0; }
html[data-style-system="research"] .section-cta-line, html[data-style-system="publications"] .section-cta-line, html[data-style-system="research"] .evidence-line, html[data-style-system="publications"] .evidence-line, html[data-style-system="research"] .contact-band, html[data-style-system="publications"] .contact-band, html[data-style-system="research"] .next-link, html[data-style-system="publications"] .next-link { border-top: 1px solid var(--line); }
html[data-style-system="research"] .text-link, html[data-style-system="publications"] .text-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 24px; color: var(--blue); font-size: var(--body-size); font-weight: 700; text-decoration: none; }
html[data-style-system="research"] .text-link span, html[data-style-system="publications"] .text-link span { font-size: 1.2em; }

/* Homepage hero */
html[data-style-system="research"] .home-hero, html[data-style-system="publications"] .home-hero { min-height: calc(100svh - var(--header-h)); padding: clamp(38px, 6vh, 84px) var(--page-x) clamp(54px, 8vh, 100px); background: var(--bg); }
html[data-style-system="research"] .hero-inner, html[data-style-system="publications"] .hero-inner { display: grid; grid-template-columns: minmax(240px, 0.72fr) minmax(0, 1.28fr); align-items: center; gap: clamp(36px, 7vw, 120px); width: min(100%, var(--max)); min-height: calc(100svh - var(--header-h) - 120px); margin: 0 auto; }
html[data-style-system="research"] .hero-deck, html[data-style-system="publications"] .hero-deck { max-width: 420px; margin: 0; color: var(--muted); font-size: var(--body-size); }
html[data-style-system="research"] .conversation, html[data-style-system="publications"] .conversation { display: grid; gap: 20px; padding: clamp(20px, 3vw, 38px); border: 1px solid rgba(216, 211, 202, 0.9); background: rgba(255, 255, 255, 0.42); box-shadow: 0 22px 68px rgba(0, 0, 22, 0.09); }
html[data-style-system="research"] .message, html[data-style-system="publications"] .message { display: flex; align-items: flex-start; gap: 14px; }
html[data-style-system="research"] .message-avatar, html[data-style-system="publications"] .message-avatar { display: grid; place-items: center; flex: 0 0 auto; width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 50%; color: var(--muted); font-size: var(--body-small-size); }
html[data-style-system="research"] .message-avatar-ai img, html[data-style-system="publications"] .message-avatar-ai img { filter: invert(1) grayscale(1) contrast(1.4); }
html[data-style-system="research"] .message-content, html[data-style-system="publications"] .message-content { min-width: 0; max-width: 680px; }
html[data-style-system="research"] .message-content p, html[data-style-system="publications"] .message-content p { margin-bottom: 16px; }
html[data-style-system="research"] .message-user .message-content, html[data-style-system="publications"] .message-user .message-content { padding-top: 5px; font-size: var(--body-large-size); font-weight: 500; }
html[data-style-system="research"] .message-name, html[data-style-system="publications"] .message-name { margin-bottom: 13px !important; color: var(--accent-color); font-family: var(--font-mono); font-size: var(--accent-size); font-weight: var(--accent-weight); text-transform: uppercase; }
html[data-style-system="research"] .ai-response, html[data-style-system="publications"] .ai-response { color: rgba(0, 0, 22, 0.78); }
html[data-style-system="research"] .ai-response-text a, html[data-style-system="publications"] .ai-response-text a { color: var(--blue); font-weight: 700; }
html[data-style-system="research"].has-js .type-unit, html[data-style-system="publications"].has-js .type-unit { opacity: 0; transition: opacity 90ms linear; }
html[data-style-system="research"].has-js .type-unit.is-visible, html[data-style-system="publications"].has-js .type-unit.is-visible { opacity: 1; }
html[data-style-system="research"] .typing-cursor, html[data-style-system="publications"] .typing-cursor { display: inline-block; width: 0.55em; height: 1.05em; margin-right: 0.1em; vertical-align: -0.16em; background: var(--blue); animation: blink 800ms steps(1) infinite; }
html[data-style-system="research"] .composer-trigger, html[data-style-system="publications"] .composer-trigger { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; padding: 10px 10px 10px 16px; border-top: 1px solid var(--line); color: var(--muted); text-decoration: none; }
html[data-style-system="research"] .composer-body, html[data-style-system="publications"] .composer-body { display: grid; gap: 3px; min-width: 0; }
html[data-style-system="research"] .composer-placeholder, html[data-style-system="publications"] .composer-placeholder { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html[data-style-system="research"] .composer-status, html[data-style-system="publications"] .composer-status { color: var(--accent-color); font-family: var(--font-mono); font-size: var(--accent-size); font-weight: var(--accent-weight); text-transform: uppercase; }
html[data-style-system="research"] .send-icon, html[data-style-system="publications"] .send-icon { display: grid; place-items: center; flex: 0 0 auto; width: 42px; height: 42px; background: var(--ink); color: var(--bg); }
html[data-style-system="research"] .send-icon svg, html[data-style-system="publications"] .send-icon svg { width: 20px; height: 20px; fill: currentColor; }

/* Homepage sections */
html[data-style-system="research"] .home-section, html[data-style-system="publications"] .home-section {
  padding: clamp(90px, 12vw, 190px) var(--page-x);
}
html[data-style-system="research"] .section-need, html[data-style-system="publications"] .section-need {
  background: var(--bg-soft);
}
html[data-style-system="research"] .section-solution, html[data-style-system="publications"] .section-solution {
  padding-block: clamp(64px, 8vw, 120px);
  background: var(--bg);
}
html[data-style-system="research"] .section-offer, html[data-style-system="publications"] .section-offer {
  background: var(--bg-soft);
}
html[data-style-system="research"] .two-column-intro, html[data-style-system="publications"] .two-column-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.92fr);
  gap: clamp(34px, 8vw, 150px); }
html[data-style-system="research"] .two-column-intro h2, html[data-style-system="publications"] .two-column-intro h2 {
  max-width: 650px;
}
html[data-style-system="research"] .need-question-stage, html[data-style-system="publications"] .need-question-stage {
  margin-top: var(--need-question-gap);
  padding: var(--need-question-gap) 0;
}
html[data-style-system="research"] .need-question-grid, html[data-style-system="publications"] .need-question-grid {
  --question-column-gap: clamp(18px, 3vw, 56px);
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 0.67fr) minmax(280px, 1.33fr);
  align-items: center;
  gap: var(--question-column-gap);
  width: 100%;
  min-height: var(--need-question-height);
  overflow: hidden;
}
html[data-style-system="research"] .sequence-statement, html[data-style-system="publications"] .sequence-statement {
  position: absolute;
  top: 50%;
  left: calc(50% - (var(--question-layout, 0) * 50%));
  display: grid; gap: 14px;
  width: calc(100% - (var(--question-layout, 0) * 55%));
  max-width: 680px;
  color: var(--muted);
  font-size: var(--body-size);
  text-align: center;
  transform: translate(calc(-50% + (var(--question-layout, 0) * 50%)), -50%);
  transition: left 120ms linear, width 120ms linear, transform 120ms linear;
}
html[data-style-system="research"] .sequence-statement strong, html[data-style-system="publications"] .sequence-statement strong {
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: clamp(2.25rem, 1vw, 4rem);
  font-weight: 400;
  line-height: 0.98;
  transition: color 120ms linear;
}
html[data-style-system="research"] .open-list, html[data-style-system="publications"] .open-list {
  padding: 0;
  margin: 0;
  list-style: none;
}
html[data-style-system="research"] .need-question-stage .open-list, html[data-style-system="publications"] .need-question-stage .open-list {
  grid-column: 2;
  grid-row: 1;
  counter-reset: sequence;
}
html[data-style-system="research"] .need-question-stage .open-list li, html[data-style-system="publications"] .need-question-stage .open-list li {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 12px;
  padding: 15px 0;
  font-family: var(--font-sans);
  font-size: clamp(1.75rem, 1vw, 4rem);
  font-weight: 400;
}
html[data-style-system="research"].has-js .need-question-stage .open-list li, html[data-style-system="publications"].has-js .need-question-stage .open-list li {
  opacity: var(--item-progress, 0);
  transform: translateX(calc((1 - var(--item-progress, 0)) * 30%));
  transition: opacity 120ms linear, transform 120ms linear;
}
html[data-style-system="research"].has-js .need-question-grid.is-question-split .sequence-statement, html[data-style-system="publications"].has-js .need-question-grid.is-question-split .sequence-statement {
  text-align: left;
}
html[data-style-system="research"] .need-question-stage .open-list li::before, html[data-style-system="publications"] .need-question-stage .open-list li::before {
  color: var(--accent-color);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  counter-increment: sequence;
  content: "0" counter(sequence);
}
html[data-style-system="research"] .need-approaches, html[data-style-system="publications"] .need-approaches {
  padding-top: var(--need-question-gap);
}
html[data-style-system="research"] .need-approaches > .lead, html[data-style-system="publications"] .need-approaches > .lead {
  max-width: 950px;
  margin-right: auto;
  margin-bottom: clamp(60px, 3vw, 90px);
  margin-left: auto;
  text-align: center;
  border-top: 1px solid;
  border-image: linear-gradient(90deg, transparent, var(--line-dark) 20%, var(--line-dark) 80%, transparent) 1;
  /* border-image: linear-gradient(90deg, transparent, color-mix(in srgb, var(--line-dark) 45%, transparent) 3%, color-mix(in srgb, var(--line-dark) 45%, transparent) 97%, transparent) 1;  */
  padding-top: clamp(45px, 3vw, 90px);
}
html[data-style-system="research"] .approach-grid, html[data-style-system="publications"] .approach-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(34px, 8vw, 150px);
}
/* .approach-column {
  padding-top: 24px;
} */
html[data-style-system="research"] .approach-column h3, html[data-style-system="publications"] .approach-column h3 {
  max-width: 600px;
  margin-bottom: 28px;
  font-size: clamp(2.15rem, 4.6vw, 4rem);
}
html[data-style-system="research"] .approach-column h3 a, html[data-style-system="publications"] .approach-column h3 a {
  text-decoration: none;
}
html[data-style-system="research"] .approach-question, html[data-style-system="publications"] .approach-question {
  max-width: 560px;
  margin-bottom: 20px;
  font-family: var(--font-sans);
  font-size: clamp(1.75rem, 1vw, 2.65rem);
  line-height: 1.03;
}
html[data-style-system="research"] .approach-column .lead, html[data-style-system="publications"] .approach-column .lead {
  max-width: 480px;
}
html[data-style-system="research"] .solution-heading, html[data-style-system="publications"] .solution-heading {
  text-align: center;
}
html[data-style-system="research"] .solution-heading h2, html[data-style-system="publications"] .solution-heading h2, html[data-style-system="research"] .solution-heading .lead, html[data-style-system="publications"] .solution-heading .lead {
  margin-right: auto;
  margin-left: auto;
}
html[data-style-system="research"] .solution-grid, html[data-style-system="publications"] .solution-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: clamp(46px, 8vw, 130px);
  margin-top: 94px;
}
html[data-style-system="research"] .section-solution .solution-grid, html[data-style-system="publications"] .section-solution .solution-grid {
  row-gap: clamp(28px, 4vw, 64px);
  margin-top: clamp(42px, 5vw, 72px);
}
html[data-style-system="research"] .solution-statement, html[data-style-system="publications"] .solution-statement {
  align-self: center;
  max-width: 470px;
  color: var(--muted);
  font-size: var(--body-large-size);
  line-height: 1.25;
  text-align: justify;
}
html[data-style-system="research"] .home-ecosystem-visual, html[data-style-system="publications"] .home-ecosystem-visual {
  display: grid;
  place-items: center;
  position: static !important;
  top: auto !important;
  align-self: center;
  width: 100%;
  min-height: 0;
}
html[data-style-system="research"] .home-ecosystem-visual .ecosystem-wheel, html[data-style-system="publications"] .home-ecosystem-visual .ecosystem-wheel {
  position: relative;
  width: min(100%, 490px);
}
html[data-style-system="research"] .home-ecosystem-visual .wheel-label, html[data-style-system="publications"] .home-ecosystem-visual .wheel-label {
  position: absolute;
  color: var(--ink);
  cursor: default;
  font-size: clamp(0.82rem, 1.45vw, 1.3rem);
  gap: 0.3em;
  opacity: 1;
  pointer-events: none;
  transition: none !important;
  will-change: auto !important;
}
html[data-style-system="research"] .home-ecosystem-visual .wheel-label-icon, html[data-style-system="publications"] .home-ecosystem-visual .wheel-label-icon,
html[data-style-system="research"] .home-ecosystem-visual .wheel-label-icon *, html[data-style-system="publications"] .home-ecosystem-visual .wheel-label-icon * {
  color: var(--ink);
  fill: var(--ink);
}
html[data-style-system="research"] .home-ecosystem-visual .wheel-label-icon, html[data-style-system="publications"] .home-ecosystem-visual .wheel-label-icon {
  width: 1.8em;
  height: 1.8em;
}
html[data-style-system="research"] .home-pillars, html[data-style-system="publications"] .home-pillars {
  display: grid;
  grid-column: 1 / -1;
  gap: clamp(24px, 4vw, 54px);
  padding-top: clamp(20px, 3vw, 42px);
  border-top: 1px solid transparent;
  border-image: linear-gradient(90deg, transparent 10%, var(--line-dark) 30%, var(--line-dark) 70%, transparent 90%) 1;
}
html[data-style-system="research"] .home-pillars .interdiscipline-intro, html[data-style-system="publications"] .home-pillars .interdiscipline-intro {
  width: 100%;
  margin: 0;
  text-align: left;
}
html[data-style-system="research"] .home-pillars .interdiscipline-intro p:last-child, html[data-style-system="publications"] .home-pillars .interdiscipline-intro p:last-child {
  max-width: 970px;
  color: var(--muted);
  font-size: var(--body-large-size);
  line-height: 1.25;
  text-align: justify;
}
html[data-style-system="research"] .home-pillars .discipline-grid, html[data-style-system="publications"] .home-pillars .discipline-grid {
  width: 100%;
}
html[data-style-system="research"] .home-pillars .discipline-roles, html[data-style-system="publications"] .home-pillars .discipline-roles {
  gap: 4px;
}
html[data-style-system="research"] .home-pillars .discipline-role, html[data-style-system="publications"] .home-pillars .discipline-role {
  min-height: 0;
  padding: 10px 14px;
}
html[data-style-system="research"] .home-pillars .discipline-role::before, html[data-style-system="publications"] .home-pillars .discipline-role::before {
  display: none;
}
html[data-style-system="research"] .home-pillars .discipline-role h3::before, html[data-style-system="publications"] .home-pillars .discipline-role h3::before {
  content: "•";
  display: inline-block;
  margin-right: 0.55em;
  color: var(--discipline-accent);
}
html[data-style-system="research"] .index, html[data-style-system="publications"] .index {
  display: block;
  margin-bottom: 14px;
  color: var(--accent-color); font-family: var(--font-mono); font-size: var(--accent-size); font-weight: var(--accent-weight);
}
html[data-style-system="research"] .ecosystem-note, html[data-style-system="publications"] .ecosystem-note {
  grid-column: 1 / -1;
  max-width: 820px;
  padding-top: 18px;
  margin: 0;
  border-top: 1px solid var(--line);
  color: var(--teal);
  font-size: var(--body-large-size);
}
html[data-style-system="research"] .offer-layout, html[data-style-system="publications"] .offer-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
  gap: clamp(40px, 9vw, 150px);
  margin-top: 94px;
}
html[data-style-system="research"] .offer-list, html[data-style-system="publications"] .offer-list {
  border-top: 1px solid var(--ink);
}
html[data-style-system="research"] .offer-list div, html[data-style-system="publications"] .offer-list div {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 18px;
  align-items: center;
  min-height: 68px;
  border-bottom: 1px solid var(--line);
}
html[data-style-system="research"] .offer-list span, html[data-style-system="publications"] .offer-list span {
  color: var(--accent-color);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
}
html[data-style-system="research"] .offer-list p, html[data-style-system="publications"] .offer-list p {
  margin: 0;
  font-size: var(--body-large-size);
  font-weight: 500;
}
html[data-style-system="research"] .offer-principles, html[data-style-system="publications"] .offer-principles {
  align-self: center;
  padding-left: 30px;
  border-left: 1px solid var(--line);
  color: rgba(0, 0, 22, 0.72);
}
html[data-style-system="research"] .quote, html[data-style-system="publications"] .quote {
  margin-bottom: 24px;
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: clamp(1.8rem, 3vw, 3.25rem);
  line-height: 1;
}
html[data-style-system="research"] .evidence-line, html[data-style-system="publications"] .evidence-line {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 36px;
  padding-top: 28px;
  margin-top: 96px;
}
html[data-style-system="research"] .evidence-line > div, html[data-style-system="publications"] .evidence-line > div {
  max-width: 760px;
}
html[data-style-system="research"] .evidence-line .eyebrow, html[data-style-system="publications"] .evidence-line .eyebrow {
  margin-bottom: 10px;
}
html[data-style-system="research"] .evidence-line p:last-child, html[data-style-system="publications"] .evidence-line p:last-child {
  margin: 0;
  font-size: var(--body-large-size);
}
html[data-style-system="research"] .contact-band, html[data-style-system="publications"] .contact-band {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 38px;
  padding-top: 56px;
  margin-top: 92px;
}
html[data-style-system="research"] .contact-band h2, html[data-style-system="publications"] .contact-band h2 {
  margin-bottom: 14px;
}
html[data-style-system="research"] .contact-band p:not(.eyebrow), html[data-style-system="publications"] .contact-band p:not(.eyebrow) {
  max-width: 580px;
  margin-bottom: 0;
  color: var(--muted);
  font-size: var(--body-large-size);
}
html[data-style-system="research"] .cta-row, html[data-style-system="publications"] .cta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
html[data-style-system="research"] .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  min-height: 54px;
  padding: 10px 44px 10px 18px;
  border: 1px solid transparent;
  border-radius: 2px;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.035em;
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
  transition: transform 180ms ease, border-color 180ms ease,
    background-color 180ms ease, color 180ms ease, box-shadow 180ms ease;
}

html[data-style-system="research"] .button::after {
  position: absolute;
  top: 50%;
  right: 16px;
  color: currentColor;
  content: "↗";
  font-family: var(--font-sans);
  font-size: 1rem;
  line-height: 1;
  transform: translateY(-50%);
  transition: transform 180ms ease;
}

html[data-style-system="research"] .button-primary {
  border-color: var(--blue);
  background: var(--bg);
  color: var(--blue);
  box-shadow: 4px 4px 0 rgba(0, 108, 174, 0.22);
}

html[data-style-system="research"] .button-outline {
  border-color: var(--ink);
  background: transparent;
  color: var(--ink);
}

html[data-style-system="research"] .button-outline:hover {
  background: rgba(0, 0, 22, 0.06);
}

html[data-style-system="research"] .button-text {
  color: var(--blue);
}

html[data-style-system="research"] .button-secondary {
  border-color: var(--red);
  background: var(--bg);
  color: var(--red);
  box-shadow: 4px 4px 0 rgba(0, 108, 174, 0.14);
}

html[data-style-system="research"] .button-tertiary {
  padding: 15px 44px 14px 0px;
  text-align: left;
  color: var(--blue);
}

html[data-style-system="research"] .button:hover,
html[data-style-system="research"] .button:focus-visible {
  transform: translate(-2px, -2px);
}

html[data-style-system="research"] .button:hover::after,
html[data-style-system="research"] .button:focus-visible::after {
  transform: translate(2px, -50%);
}

html[data-style-system="research"] .button-primary:hover,
html[data-style-system="research"] .button-primary:focus-visible {
  background: var(--blue-soft);
  color: var(--blue);
  box-shadow: 6px 6px 0 rgba(0, 108, 174, 0.22);
}

html[data-style-system="research"] .button-secondary:hover,
html[data-style-system="research"] .button-secondary:focus-visible {
  background: var(--red-soft);
  color: var(--red);
  box-shadow: 6px 6px 0 rgba(165, 74, 68, 0.2);
}

html[data-style-system="research"] .button-tertiary:hover,
html[data-style-system="research"] .button-tertiary:focus-visible {
  color: var(--blue);
}

html[data-style-system="research"] .button:active {
  transform: translate(1px, 1px);
  box-shadow: 2px 2px 0 currentColor;
}

html[data-style-system="research"] .stage-panel .reveal.button {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  font-weight: 400;
}
html[data-style-system="publications"] .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 16px;
  border: 1px solid transparent;
  font-weight: 700;
  line-height: 1.15;
  text-align: center;
  text-decoration: none;
  transition: transform 160ms ease, background-color 160ms ease, border-color 160ms ease;
}
html[data-style-system="publications"] .button:hover {
  transform: translateY(-2px);
}
html[data-style-system="publications"] .button-primary {
  background: var(--ink);
  color: var(--bg);
}
html[data-style-system="publications"] .button-outline {
  border-color: var(--ink);
  background: transparent;
  color: var(--ink);
}
html[data-style-system="publications"] .button-outline:hover {
  background: rgba(0, 0, 22, 0.06);
}
html[data-style-system="publications"] .button-text {
  color: var(--blue);
}

/* Detail pages */
html[data-style-system="research"] .detail-hero, html[data-style-system="publications"] .detail-hero { padding: clamp(110px, 16vw, 250px) var(--page-x) clamp(100px, 12vw, 180px); background: var(--bg); }
html[data-style-system="research"] .detail-hero-inner, html[data-style-system="publications"] .detail-hero-inner { text-align: center; }
html[data-style-system="research"] .detail-hero h1, html[data-style-system="publications"] .detail-hero h1 { max-width: 1120px; margin-right: auto; margin-left: auto; }
html[data-style-system="research"] .detail-hero .lead, html[data-style-system="publications"] .detail-hero .lead { max-width: 850px; margin-right: auto; margin-left: auto; }
html[data-style-system="research"] .editorial-section, html[data-style-system="publications"] .editorial-section { padding: clamp(100px, 13vw, 190px) var(--page-x); }
html[data-style-system="research"] .tinted-section, html[data-style-system="publications"] .tinted-section { background: var(--bg-soft); }
html[data-style-system="research"] .definition-grid, html[data-style-system="publications"] .definition-grid { display: grid; grid-template-columns: minmax(260px, 0.75fr) minmax(0, 1fr); gap: clamp(40px, 9vw, 150px); }
html[data-style-system="research"] .definition-grid .section-copy, html[data-style-system="publications"] .definition-grid .section-copy { font-size: var(--body-size); }
html[data-style-system="research"] .numbered-columns, html[data-style-system="publications"] .numbered-columns { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; padding-top: 32px; margin-top: 90px; border-top: 1px solid var(--line); }
html[data-style-system="research"] .numbered-columns article, html[data-style-system="publications"] .numbered-columns article { padding-right: 28px; border-right: 1px solid var(--line); }
html[data-style-system="research"] .numbered-columns article:last-child, html[data-style-system="publications"] .numbered-columns article:last-child { border-right: 0; }
html[data-style-system="research"] .numbered-columns p, html[data-style-system="publications"] .numbered-columns p { color: var(--muted); }
html[data-style-system="research"] .reflection-quote, html[data-style-system="publications"] .reflection-quote { max-width: 920px; padding: 38px 0; margin-top: 86px; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
html[data-style-system="research"] .reflection-quote p, html[data-style-system="publications"] .reflection-quote p { margin: 0; font-family: var(--font-serif); font-size: clamp(2rem, 4vw, 4rem); line-height: 0.98; }
html[data-style-system="research"] .contrast-lines, html[data-style-system="publications"] .contrast-lines { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; padding-top: 40px; margin-top: 80px; border-top: 1px solid var(--line); }
html[data-style-system="research"] .contrast-lines div, html[data-style-system="publications"] .contrast-lines div { padding-right: 16px; border-right: 1px solid var(--line); }
html[data-style-system="research"] .contrast-lines div:last-child, html[data-style-system="publications"] .contrast-lines div:last-child { border-right: 0; }
html[data-style-system="research"] .contrast-lines span, html[data-style-system="publications"] .contrast-lines span, html[data-style-system="research"] .large-list span, html[data-style-system="publications"] .large-list span { color: var(--accent-color); font-family: var(--font-mono); font-size: var(--accent-size); font-weight: var(--accent-weight); text-transform: uppercase; }
html[data-style-system="research"] .contrast-lines p, html[data-style-system="publications"] .contrast-lines p { margin: 12px 0 0; font-family: var(--font-serif); font-size: 1.65rem; line-height: 1; }
html[data-style-system="research"] .large-list, html[data-style-system="publications"] .large-list { max-width: 900px; margin-top: 78px; }
html[data-style-system="research"] .large-list div, html[data-style-system="publications"] .large-list div { display: grid; grid-template-columns: minmax(140px, 0.38fr) 1fr; gap: 26px; padding: 20px 0; border-top: 1px solid var(--line); }
html[data-style-system="research"] .large-list p, html[data-style-system="publications"] .large-list p { margin: 0; font-size: var(--body-large-size); }
html[data-style-system="research"] .detail-next, html[data-style-system="publications"] .detail-next {
  padding: 0 var(--page-x);
  background: var(--bg);
}
html[data-style-system="research"] .next-link, html[data-style-system="publications"] .next-link {
  display: grid;
  grid-template-columns: 0.1fr 0.3fr 0.3fr;
  align-items: center;
  gap: 22px;
  padding: 34px 0 54px;
}
html[data-style-system="research"] .next-link .eyebrow, html[data-style-system="publications"] .next-link .eyebrow {
  margin: 0;
  text-align: left;
}
html[data-style-system="research"] .next-link a, html[data-style-system="publications"] .next-link a {
  /* display: flex;  */
  /* justify-content: space-between;  */
  gap: 0px;
  color: var(--blue);
  font-family: var(--font-serif);
  font-size: var(--subtitle-size);
  line-height: 0.95;
  text-decoration: none;
  text-align: left;
}
html[data-style-system="research"] .next-link p, html[data-style-system="publications"] .next-link p {
  margin: 0;
  color: var(--muted);
  font-size: var(--body-large-size);
}

/* Methodology and ecosystem stages */
html[data-style-system="research"] .methodology-stage, html[data-style-system="publications"] .methodology-stage, html[data-style-system="research"] .ecosystem-stage, html[data-style-system="publications"] .ecosystem-stage { display: grid; grid-template-columns: minmax(300px, 0.7fr) minmax(420px, 1.3fr); gap: clamp(40px, 8vw, 140px); align-items: start; margin-top: 90px; }
html[data-style-system="research"] .stage-copy, html[data-style-system="publications"] .stage-copy { display: grid; gap: 0; }
html[data-style-system="research"] .stage-panel { --stage-accent: var(--blue); position: relative; padding: 28px 0 30px 30px; border-top: 1px solid var(--line); opacity: 0.4; transition: opacity 300ms ease, transform 300ms ease; }
html[data-style-system="research"] .stage-panel[data-stage-panel="regulatory"] { --stage-accent: var(--gold); }
html[data-style-system="research"] .stage-panel[data-stage-panel="ethical"] { --stage-accent: var(--red); }
html[data-style-system="publications"] .stage-panel { position: relative; padding: 28px 0 30px 30px; border-top: 1px solid var(--line); opacity: 0.4; transition: opacity 300ms ease, transform 300ms ease; }
html[data-style-system="research"] .stage-panel:last-child, html[data-style-system="publications"] .stage-panel:last-child { border-bottom: 1px solid var(--line); }
html[data-style-system="research"] .stage-panel::before { position: absolute; top: 0; bottom: 0; left: 0; width: 2px; background: var(--stage-accent); content: ""; transform: scaleY(0); transform-origin: top; transition: transform 300ms ease; }
html[data-style-system="publications"] .stage-panel::before { position: absolute; top: 0; bottom: 0; left: 0; width: 2px; background: var(--blue); content: ""; transform: scaleY(0); transform-origin: top; transition: transform 300ms ease; }
html[data-style-system="research"] .stage-panel.is-active, html[data-style-system="publications"] .stage-panel.is-active { opacity: 1; transform: translateX(8px); }
html[data-style-system="research"] .stage-panel.is-active::before, html[data-style-system="publications"] .stage-panel.is-active::before { transform: scaleY(1); }
html[data-style-system="research"] .stage-panel .index { color: var(--stage-accent); }
html[data-style-system="research"] .stage-panel p, html[data-style-system="publications"] .stage-panel p { max-width: 430px; margin: 0; color: var(--muted); }
html[data-style-system="research"] .stage-panel[data-stage-node], html[data-style-system="publications"] .stage-panel[data-stage-node] { cursor: pointer; }
html[data-style-system="research"] .stage-panel[data-stage-node]:focus-visible, html[data-style-system="publications"] .stage-panel[data-stage-node]:focus-visible { outline-offset: 7px; }
html[data-style-system="research"] .stage-panel .reveal, html[data-style-system="publications"] .stage-panel .reveal { max-height: 0; font-family: var(--font-mono); font-size: var(--body-small-size); margin-top: 0; overflow: hidden; opacity: 0; pointer-events: none; transform: translateY(-8px); transition: max-height 420ms var(--ease), margin-top 420ms var(--ease), opacity 220ms ease, transform 420ms var(--ease); }
html[data-style-system="research"] .stage-panel.is-active .reveal, html[data-style-system="publications"] .stage-panel.is-active .reveal { max-height: 20rem; margin-top: 18px; opacity: 1; pointer-events: auto; transform: translateY(0); }
html[data-style-system="research"] .stage-panel .reveal.button {
  min-height: 0;
  padding: 0 44px 0 18px;
  border-width: 0;
}
html[data-style-system="research"] .stage-panel .reveal.button.button-tertiary {
  padding-left: 0;
  color: var(--stage-accent);
}
html[data-style-system="research"] .stage-panel.is-active .reveal.button {
  min-height: 54px;
  padding: 10px 44px 10px 18px;
  border-width: 1px;
}
html[data-style-system="research"] .stage-panel.is-active .reveal.button.button-tertiary {
  padding-left: 0;
  border-width: 1px;
}
html[data-style-system="research"] .stage-panel .reveal.button:hover,
html[data-style-system="research"] .stage-panel .reveal.button:focus-visible {
  transform: translate(-2px, -2px);
}
html[data-style-system="research"] .method-visual, html[data-style-system="publications"] .method-visual, html[data-style-system="research"] .ecosystem-visual, html[data-style-system="publications"] .ecosystem-visual { position: sticky; top: calc(var(--header-h) + 48px); width: 100%; min-width: 0; min-height: min(62vw, 720px); }
html[data-style-system="research"] .method-visual, html[data-style-system="publications"] .method-visual {
  width: min(100%, 720px);
  height: auto;
  min-height: 0;
  aspect-ratio: 1;
  margin-inline: auto;
  overflow: visible;
  container-type: inline-size;
  --method-orbit-diameter: 39%;
  --method-node-size: clamp(74px, 23cqw, 154px);
}
html[data-style-system="research"] .method-lines, html[data-style-system="publications"] .method-lines { position: absolute; inset: 4%; width: 92%; height: 92%; overflow: visible; }
html[data-style-system="research"] .method-lines path, html[data-style-system="publications"] .method-lines path { fill: none; stroke: rgba(0, 0, 22, 0.45); stroke-width: 0.7; vector-effect: non-scaling-stroke; }
html[data-style-system="research"] .method-core, html[data-style-system="publications"] .method-core { position: absolute; top: 50%; left: 50%; display: grid; place-items: center; width: 25cqw; height: 25cqw; min-width: 0; min-height: 0; aspect-ratio: 1; padding: 24px; border: 1px solid var(--ink); border-radius: 50%; background: var(--ink); color: var(--bg); font-family: var(--font-serif); font-size: clamp(0.8rem, 1.4vw, 1.3rem); line-height: 0.95; text-align: center; transform: translate(-50%, -50%); }
html[data-style-system="research"] .method-core::before, html[data-style-system="publications"] .method-core::before { position: absolute; inset: 9px; border: 1px solid var(--bg); border-radius: 50%; content: ""; }
html[data-style-system="research"] .method-core img, html[data-style-system="publications"] .method-core img { position: relative; z-index: 1; width: 47%; margin-bottom: 8px; filter: invert(1) grayscale(1) contrast(1.5); }
html[data-style-system="research"] .method-node, html[data-style-system="publications"] .method-node {
  position: absolute;
  z-index: 2;
  display: grid;
  place-items: center;
  width: var(--method-node-size);
  height: var(--method-node-size);
  min-height: 0;
  aspect-ratio: 1;
  padding: clamp(8px, 0.75vw, 16px);
  padding: clamp(8px, 1.5cqw, 16px);
  border: 1px solid var(--ink);
  border-radius: 50%;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: clamp(0.8rem, 1.6vw, 1.45rem);
  font-size: clamp(0.8rem, 3.2cqw, 1.45rem);
  line-height: 1.05;
  text-align: center;
  text-wrap: balance;
  overflow-wrap: anywhere;
  cursor: pointer;
  transition: none;
}
/* The orbit diameter matches the 19.5% polar radius used by subnodes. */
html[data-style-system="research"] .method-node::before, html[data-style-system="publications"] .method-node::before {
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--method-orbit-diameter);
  aspect-ratio: 1;
  border: 1px dashed rgba(0, 0, 22, 0.4);
  border-radius: 50%; content: "";
  pointer-events: none;
  transform: translate(-50%, -50%) scale(var(--method-ring-scale, 1));
  transition: transform 320ms var(--ease);
}
html[data-style-system="research"] .method-node.is-active::before, html[data-style-system="publications"] .method-node.is-active::before { --method-ring-scale: 1; }
html[data-style-system="research"] .method-node.is-active, html[data-style-system="publications"] .method-node.is-active { background: var(--ink); color: var(--bg); transform: translate(-50%, -50%) scale(1.06); transform-origin: center; }
@media (hover: hover) {
  html[data-style-system="research"] .method-node:hover:not(.is-active), html[data-style-system="publications"] .method-node:hover:not(.is-active) { transform: translate(-50%, -50%) scale(1.03); }}
html[data-style-system="research"] .method-node, html[data-style-system="publications"] .method-node {
  transform: translate(-50%, -50%);
}
html[data-style-system="research"] .node-explainability, html[data-style-system="publications"] .node-explainability {
  top: 39%;
  left: 83%;
}
html[data-style-system="research"] .node-uncertainty, html[data-style-system="publications"] .node-uncertainty {
  top: 15%;
  left: 50%;
}
html[data-style-system="research"] .node-causality, html[data-style-system="publications"] .node-causality {
  top: 39%;
  left: 17%;
}
html[data-style-system="research"] .node-regulatory, html[data-style-system="publications"] .node-regulatory {
  top: 78.4%;
  left: 29.5%;
}
html[data-style-system="research"] .node-ethical, html[data-style-system="publications"] .node-ethical {
  top: 78.4%;
  left: 70.5%;
}
html[data-style-system="research"] .method-subnode, html[data-style-system="publications"] .method-subnode {
  position: absolute;
  z-index: 3;
  display: grid;
  place-items: center;
  /* Keep the subnode-to-node ratio constant across desktop widths. */
  width: calc(var(--method-node-size) * 13 / 23);
  height: calc(var(--method-node-size) * 13 / 23);
  min-height: 0;
  aspect-ratio: 1;
  visibility: hidden;
  padding: clamp(5px, 0.5vw, 12px);
  padding: clamp(5px, 1cqw, 12px);
  border: 1px solid transparent;
  border-radius: 50%;
  background: transparent;
  color: transparent;
  opacity: 0;
  pointer-events: none;
  font-family: var(--font-serif);
  font-size: clamp(0.42rem, 0.925vw, 0.95rem);
  /* font-size: clamp(0.62rem, 2.1cqw, 0.95rem);  */
  line-height: 1.05;
  text-align: center;
  text-wrap: balance;
  overflow-wrap: anywhere;
  cursor: pointer;
  transform: translate(-50%, -50%);
  transition: none;
  --parent-x: 50%;
  --parent-y: 50%;
  --angle: 0deg;
  --radius: 19%;
  left: calc(var(--parent-x) + var(--radius) * cos(var(--angle)));
  top: calc(var(--parent-y) + var(--radius) * sin(var(--angle)));
}
html[data-style-system="research"] .method-subnode::before, html[data-style-system="publications"] .method-subnode::before { position: absolute;  color: transparent; background: transparent; content: ""; }
html[data-style-system="research"] .method-subnode.is-visible, html[data-style-system="publications"] .method-subnode.is-visible { visibility: visible; border-color: var(--ink); background: var(--bg); color: var(--ink); opacity: 1; pointer-events: auto; transform: translate(-50%, -50%) scale(1.06); }
html[data-style-system="research"] .methodology-section .method-subnode, html[data-style-system="publications"] .methodology-section .method-subnode { transition: opacity 220ms ease, transform 320ms var(--ease), visibility 0s linear 320ms; }
html[data-style-system="research"] .methodology-section .method-subnode.is-visible, html[data-style-system="publications"] .methodology-section .method-subnode.is-visible { transition-delay: 0s; }

/* The mobile header uses the 921px breakpoint. Keep the diagram's subnodes
   completely out of the mobile interaction model at the same widths. */
@media (max-width: 920px) {
  html[data-style-system="research"] .methodology-section .method-subnode, html[data-style-system="publications"] .methodology-section .method-subnode,
  html[data-style-system="research"] .publication-map-stage .method-subnode, html[data-style-system="publications"] .publication-map-stage .method-subnode {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }}

/* Publication subnodes appear only while a paper detail is open. */
html[data-style-system="research"] .publication-map-stage { align-items: start; }

/* Publication subnodes appear only while a paper detail is open. */
html[data-style-system="publications"] .publication-map-stage { --publication-filter-color: var(--blue); align-items: start; }
html[data-style-system="publications"] .publication-map-stage.is-publication-filter-gold { --publication-filter-color: var(--gold); }
html[data-style-system="publications"] .publication-map-stage.is-publication-filter-red { --publication-filter-color: var(--red); }
html[data-style-system="research"] .publication-map-stage .method-subnode, html[data-style-system="publications"] .publication-map-stage .method-subnode { visibility: hidden; border-color: transparent; background: transparent; color: transparent; opacity: 0; pointer-events: none; transition: opacity 320ms ease, transform 320ms var(--ease), visibility 0s linear 320ms; }
html[data-style-system="research"] .publication-map-stage.is-publication-detail-open .method-subnode, html[data-style-system="publications"] .publication-map-stage.is-publication-detail-open .method-subnode { visibility: visible; border-color: var(--ink); background-color: var(--bg); color: var(--ink); opacity: 1; pointer-events: none; transition-delay: 0s; }
html[data-style-system="research"] .publication-map-stage.is-publication-detail-open .method-subnode.is-visible, html[data-style-system="publications"] .publication-map-stage.is-publication-detail-open .method-subnode.is-visible { transform: translate(-50%, -50%) scale(1.06); }
html[data-style-system="research"] .publication-map-stage .method-subnode.is-publication-related { background: var(--blue); border-color: var(--blue); color: var(--bg); transform: translate(-50%, -50%) scale(1.08); }
html[data-style-system="research"] .publication-map-stage .method-node.is-publication-related { border-color: var(--blue); box-shadow: 0 0 0 5px color-mix(in srgb, var(--blue) 16%, transparent); }
html[data-style-system="publications"] .publication-map-stage .method-subnode.is-publication-related { --publication-related-color: var(--blue); background: var(--publication-related-color); border-color: var(--publication-related-color); color: var(--bg); transform: translate(-50%, -50%) scale(1.08); }
html[data-style-system="publications"] .publication-map-stage .method-node.is-publication-related { --publication-related-color: var(--blue); border-color: var(--publication-related-color); box-shadow: 0 0 0 5px color-mix(in srgb, var(--publication-related-color) 16%, transparent); }
html[data-style-system="publications"] .publication-map-stage .method-subnode.is-publication-related-gold,
html[data-style-system="publications"] .publication-map-stage .method-node.is-publication-related-gold { --publication-related-color: var(--gold); }
html[data-style-system="publications"] .publication-map-stage .method-subnode.is-publication-related-red,
html[data-style-system="publications"] .publication-map-stage .method-node.is-publication-related-red { --publication-related-color: var(--red); }
html[data-style-system="research"] .publication-map-stage .method-node.is-publication-related::before, html[data-style-system="publications"] .publication-map-stage .method-node.is-publication-related::before { --method-ring-scale: 1; }
html[data-style-system="research"] .publication-map-stage .method-node.is-map-selected, html[data-style-system="publications"] .publication-map-stage .method-node.is-map-selected { background: var(--ink); color: var(--bg); transform: translate(-50%, -50%) scale(1.06); }
html[data-style-system="research"] .publication-map-stage .method-node.is-map-selected::before, html[data-style-system="publications"] .publication-map-stage .method-node.is-map-selected::before { --method-ring-scale: 1; }
html[data-style-system="research"] .publication-map-stage.is-publication-detail-open .method-node::before, html[data-style-system="publications"] .publication-map-stage.is-publication-detail-open .method-node::before { --method-ring-scale: 1; }
html[data-style-system="research"] .publication-map-stage .method-subnode.is-publication-dimmed, html[data-style-system="publications"] .publication-map-stage .method-subnode.is-publication-dimmed,
html[data-style-system="research"] .publication-map-stage .method-node.is-publication-dimmed, html[data-style-system="publications"] .publication-map-stage .method-node.is-publication-dimmed { opacity: 0.22; }
html[data-style-system="research"] .publication-map-stage .method-subnode, html[data-style-system="publications"] .publication-map-stage .method-subnode { z-index: 4; }
html[data-style-system="research"] .publication-map-stage .method-node.is-publication-dimmed, html[data-style-system="publications"] .publication-map-stage .method-node.is-publication-dimmed {
  opacity: 1;
  background-color: var(--bg);
  color: color-mix(in srgb, var(--ink) 24%, var(--bg));
  border-color: color-mix(in srgb, var(--ink) 24%, var(--bg));
}
html[data-style-system="research"] .publication-map-stage .method-subnode.is-publication-dimmed, html[data-style-system="publications"] .publication-map-stage .method-subnode.is-publication-dimmed {
  opacity: 1;
  color: color-mix(in srgb, var(--ink) 24%, var(--bg));
  border-color: color-mix(in srgb, var(--ink) 24%, var(--bg));
}

html[data-style-system="research"] .publication-browser, html[data-style-system="publications"] .publication-browser {
  width: 100%;
  overflow: hidden;
  /* border-top: 1px solid var(--line);  */
  /* border-bottom: 1px solid var(--line);  */
  background: var(--bg);
}
html[data-style-system="research"] .publication-browser-track, html[data-style-system="publications"] .publication-browser-track {
  display: flex;
  width: 200%;
  align-items: stretch;
  transition: transform 500ms var(--ease);
}
html[data-style-system="research"] .publication-browser.is-detail-open .publication-browser-track, html[data-style-system="publications"] .publication-browser.is-detail-open .publication-browser-track {
  transform: translateX(-50%);
}
html[data-style-system="research"] .publication-list-view, html[data-style-system="publications"] .publication-list-view, html[data-style-system="research"] .publication-detail-view, html[data-style-system="publications"] .publication-detail-view {
  flex: 0 0 50%;
  min-width: 0;
  max-height: min(70vh, 720px);
  overflow-y: auto;
  padding: 18px 24px 24px 0;
  scrollbar-color: var(--line-dark) transparent;
}
html[data-style-system="research"] .publication-detail-view, html[data-style-system="publications"] .publication-detail-view {
  padding: 28px 26px 34px;
}
html[data-style-system="research"] .publication-map-stage .publication-list-view, html[data-style-system="publications"] .publication-map-stage .publication-list-view,
html[data-style-system="research"] .publication-map-stage .publication-detail-view, html[data-style-system="publications"] .publication-map-stage .publication-detail-view {
  max-height: none;
  overflow: visible;
}
html[data-style-system="research"] .publication-browser.is-detail-open .publication-list-view, html[data-style-system="publications"] .publication-browser.is-detail-open .publication-list-view {
  height: 0;
  min-height: 0;
  max-height: 0;
  padding-top: 0;
  padding-bottom: 0;
  overflow: hidden;
}
/* .publication-list-heading { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 16px; margin: 0; padding: 0 0 12px; color: var(--ink); font-family: var(--font-mono); font-size: var(--accent-size); font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; } */
/* .publication-list-heading span { color: var(--muted); font-weight: 400; letter-spacing: 0; text-transform: none; } */
html[data-style-system="research"] .publication-list, html[data-style-system="publications"] .publication-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
html[data-style-system="research"] .publication-item, html[data-style-system="publications"] .publication-item {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 13px 0 13px 16px;
  border-top: 1px solid transparent;
  border-image: linear-gradient(90deg, transparent, var(--line) 25%, var(--line) 75%, transparent) 1;
  transition: opacity 200ms ease, background 200ms ease;
}
html[data-style-system="research"] .publication-item::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 2px;
  background: var(--blue);
  content: "";
  opacity: 0;
  transition: opacity 200ms ease;
}
html[data-style-system="research"] .publication-item.is-related { background: color-mix(in srgb, var(--blue) 7%, transparent); }
html[data-style-system="publications"] .publication-item::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 2px;
  background: var(--publication-filter-color);
  content: "";
  opacity: 0;
  transition: opacity 200ms ease;
}
html[data-style-system="publications"] .publication-item.is-related { background: color-mix(in srgb, var(--publication-filter-color) 7%, transparent); }
html[data-style-system="research"] .publication-item.is-related::before, html[data-style-system="publications"] .publication-item.is-related::before { opacity: 1; }
html[data-style-system="research"] .publication-item.is-dimmed, html[data-style-system="publications"] .publication-item.is-dimmed { opacity: 0.28; }
html[data-style-system="research"] .publication-title, html[data-style-system="publications"] .publication-title {
  display: block;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: var(--body-large-size);
  line-height: 1.08;
  text-align: left;
  cursor: pointer;
}
html[data-style-system="research"] .publication-title:hover, html[data-style-system="publications"] .publication-title:hover, html[data-style-system="research"] .publication-title:focus-visible, html[data-style-system="publications"] .publication-title:focus-visible {
  color: var(--blue);
}
html[data-style-system="research"] .publication-year, html[data-style-system="publications"] .publication-year { padding-top: 2px; color: var(--muted); font-family: var(--font-mono); font-size: var(--body-small-size); white-space: nowrap; }
html[data-style-system="research"] .publication-back, html[data-style-system="publications"] .publication-back { display: inline-flex; gap: 8px; align-items: center; margin: 0 0 30px; padding: 0; border: 0; background: transparent; color: var(--blue); font-family: var(--font-mono); font-size: var(--body-small-size); cursor: pointer; }
html[data-style-system="research"] .publication-detail-view h2, html[data-style-system="publications"] .publication-detail-view h2 {
  margin: 0 0 18px;
  font-family: var(--font-sans);
  font-size: var(--subtitle-size);
  line-height: 0.98;
}
html[data-style-system="research"] .publication-detail-meta, html[data-style-system="publications"] .publication-detail-meta { margin: 0 0 26px; color: var(--muted); font-family: var(--font-mono); font-size: var(--body-small-size); }
html[data-style-system="publications"] .publication-detail-authors { margin: 14px 0 14px; color: var(--ink); font-family: var(--font-sans); font-size: var(--body-size); line-height: 1.35; }
html[data-style-system="research"] .publication-detail-label, html[data-style-system="publications"] .publication-detail-label { margin: 18px 0 3px; color: var(--blue); font-family: var(--font-mono); font-size: var(--accent-size); font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
html[data-style-system="research"] .publication-detail-url, html[data-style-system="publications"] .publication-detail-url {
  color: var(--blue);
  font-weight: 700;
  overflow-wrap: anywhere;
}
html[data-style-system="research"] .publication-detail-url.is-placeholder, html[data-style-system="publications"] .publication-detail-url.is-placeholder {
  color: var(--muted);
  text-decoration: none;
}
html[data-style-system="research"] .publication-data-note, html[data-style-system="publications"] .publication-data-note { margin-top: 32px !important; padding-top: 16px; border-top: 1px solid var(--line); color: var(--muted); font-family: var(--font-mono); font-size: var(--body-small-size); }
/* Subnodes use polar coordinates around their parent node.
   CSS angles start at the right and increase clockwise. */
html[data-style-system="research"] .subnode-causal-effect, html[data-style-system="publications"] .subnode-causal-effect {
  --parent-x: 17%;
  --parent-y: 39%;
  --angle: 273deg;
}
html[data-style-system="research"] .subnode-shap, html[data-style-system="publications"] .subnode-shap {
  --parent-x: 17%;
  --parent-y: 39%;
  --angle: 123deg;
}
html[data-style-system="research"] .subnode-counterfactuals, html[data-style-system="publications"] .subnode-counterfactuals {
  --parent-x: 17%;
  --parent-y: 39%;
  --angle: 198deg;
}

html[data-style-system="research"] .subnode-epistemic, html[data-style-system="publications"] .subnode-epistemic {
  --parent-x: 50%;
  --parent-y: 15%;
  --angle: 270deg;
}
html[data-style-system="research"] .subnode-domain, html[data-style-system="publications"] .subnode-domain {
  --parent-x: 50%;
  --parent-y: 15%;
  --angle: 195deg;
}
html[data-style-system="research"] .subnode-aleatoric, html[data-style-system="publications"] .subnode-aleatoric {
  --parent-x: 50%;
  --parent-y: 15%;
  --angle: 345deg;
}

html[data-style-system="research"] .subnode-rights, html[data-style-system="publications"] .subnode-rights {
  --parent-x: 29.5%;
  --parent-y: 78.4%;
  --angle: 88.5deg;
}
html[data-style-system="research"] .subnode-risk, html[data-style-system="publications"] .subnode-risk {
  --parent-x: 29.5%;
  --parent-y: 78.4%;
  --angle: 163.5deg;
}
html[data-style-system="research"] .subnode-standards, html[data-style-system="publications"] .subnode-standards {
  --parent-x: 29.5%;
  --parent-y: 78.4%;
  --angle: 13.5deg;
}
html[data-style-system="research"] .subnode-accountability, html[data-style-system="publications"] .subnode-accountability {
  --parent-x: 29.5%;
  --parent-y: 78.4%;
  --angle: 238.5deg;
}

html[data-style-system="research"] .subnode-agency, html[data-style-system="publications"] .subnode-agency {
  --parent-x: 70.5%;
  --parent-y: 78.4%;
  --angle: 340deg;
}
html[data-style-system="research"] .subnode-dignity, html[data-style-system="publications"] .subnode-dignity {
  --parent-x: 70.5%;
  --parent-y: 78.4%;
  --angle: 55deg;
}
html[data-style-system="research"] .subnode-vulnerability, html[data-style-system="publications"] .subnode-vulnerability {
  --parent-x: 70.5%;
  --parent-y: 78.4%;
  --angle: 130deg;
}

html[data-style-system="research"] .subnode-mechanistic, html[data-style-system="publications"] .subnode-mechanistic {
  --parent-x: 83%;
  --parent-y: 39%;
  --angle: 342deg;
}
html[data-style-system="research"] .subnode-faithfulness-stability, html[data-style-system="publications"] .subnode-faithfulness-stability {
  --parent-x: 83%;
  --parent-y: 39%;
  --angle: 57deg;
}
html[data-style-system="research"] .subnode-context-awareness, html[data-style-system="publications"] .subnode-context-awareness {
  --parent-x: 83%;
  --parent-y: 39%;
  --angle: 267deg;
}

html[data-style-system="research"] .method-footnote, html[data-style-system="publications"] .method-footnote, html[data-style-system="research"] .cycle-line, html[data-style-system="publications"] .cycle-line {
  max-width: 820px;
  padding: 28px 0 0;
  /* margin-top: 80px;  */
  /* border-top: 1px solid var(--line);  */
  color: var(--teal);
  font-size: var(--body-large-size);
}
html[data-style-system="research"] .method-footnote p, html[data-style-system="publications"] .method-footnote p, html[data-style-system="research"] .cycle-line p, html[data-style-system="publications"] .cycle-line p {
  margin: 0;
}
html[data-style-system="research"] .interdiscipline-story, html[data-style-system="publications"] .interdiscipline-story {
  position: relative;
  background: var(--bg);
}
html[data-style-system="research"] .interdiscipline-sticky, html[data-style-system="publications"] .interdiscipline-sticky {
  display: flex; flex-direction: column;
  justify-content: center;
  min-height: 100vh;
  overflow: hidden;
  padding: calc(var(--header-h) + 38px) var(--page-x) 48px;
  gap: clamp(20px, 4vh, 44px);
}
html[data-style-system="research"] .interdiscipline-intro, html[data-style-system="publications"] .interdiscipline-intro {
  width: min(1180px, 86vw);
  margin: 0 auto;
  text-align: center;
}
html[data-style-system="research"] .interdiscipline-intro p, html[data-style-system="publications"] .interdiscipline-intro p {
  margin: 0;
}
html[data-style-system="research"] .interdiscipline-intro p:last-child, html[data-style-system="publications"] .interdiscipline-intro p:last-child {
  font-family: var(--font-sans);
  font-size: clamp(1.2rem, 1.95vw, 2.55rem);
  line-height: 1.4;
}
html[data-style-system="research"] .section-kicker, html[data-style-system="publications"] .section-kicker {
  margin-bottom: 18px !important;
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: clamp(3.5rem, 4.45vw, 4.5rem);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 0.98;
}
html[data-style-system="research"] .discipline-grid, html[data-style-system="publications"] .discipline-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: min(1480px, 100%);
  min-height: clamp(340px, 47vh, 540px);
  margin: 0 auto;
}
html[data-style-system="research"] .discipline-column, html[data-style-system="publications"] .discipline-column {
  --discipline-accent: var(--accent-color);
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: clamp(340px, 47vh, 540px);
  padding: 0 clamp(18px, 2.45vw, 42px);
  gap: clamp(10px, 1.45vh, 18px);
}
html[data-style-system="research"] .discipline-column[data-pillar="legal"] { --discipline-accent: var(--gold); }
html[data-style-system="research"] .discipline-column[data-pillar="ethical"] { --discipline-accent: var(--red); }
html[data-style-system="research"] .discipline-column + .discipline-column::before, html[data-style-system="publications"] .discipline-column + .discipline-column::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 1px;
  /* background: linear-gradient(to bottom, transparent, color-mix(in srgb, var(--line-dark) 45%, transparent) 12%, color-mix(in srgb, var(--line-dark) 45%, transparent) 88%, transparent);  */
  content: "";
}
html[data-style-system="research"] .discipline-index, html[data-style-system="publications"] .discipline-index {
  margin: 0;
  color: var(--discipline-accent);
  font-family: var(--font-mono);
  font-size: clamp(0.66rem, 0.72vw, 0.82rem);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
}
html[data-style-system="research"] .discipline-heading, html[data-style-system="publications"] .discipline-heading {
  display: grid; gap: 6px;
}
html[data-style-system="research"] .discipline-column h2, html[data-style-system="publications"] .discipline-column h2, html[data-style-system="research"] .discipline-column h3, html[data-style-system="publications"] .discipline-column h3, html[data-style-system="research"] .discipline-summary, html[data-style-system="publications"] .discipline-summary, html[data-style-system="research"] .discipline-role p, html[data-style-system="publications"] .discipline-role p {
  margin: 0;
}
html[data-style-system="research"] .discipline-column h2, html[data-style-system="publications"] .discipline-column h2 {
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: var(--subtitle-size);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
}
html[data-style-system="research"] .discipline-summary, html[data-style-system="publications"] .discipline-summary {
  height: clamp(82px, 8.4vh, 104px);
  color: color-mix(in srgb, var(--ink) 78%, transparent);
  font-family: var(--font-sans);
  font-size: clamp(0.96rem, 1.14vw, 1.24rem);
  line-height: 1.34;
}
html[data-style-system="research"] .discipline-roles, html[data-style-system="publications"] .discipline-roles {
  display: grid;
  gap: 10px;
  margin-top: 0;
}
html[data-style-system="research"] .discipline-role, html[data-style-system="publications"] .discipline-role {
  min-height: clamp(74px, 8.4vh, 104px);
  padding: clamp(11px, 1.4vh, 16px) clamp(12px, 1.35vw, 18px);
  border: 1px solid transparent;
  /* border-left-color: var(--discipline-accent);  */
  border-radius: 0px;
  /* background: transparent;  */
  position: relative;
}
html[data-style-system="research"] .discipline-role::before, html[data-style-system="publications"] .discipline-role::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 1px;
  background: linear-gradient(to bottom, transparent, var(--discipline-accent) 12%, var(--discipline-accent) 88%, transparent);

}
html[data-style-system="research"] .discipline-role h3, html[data-style-system="publications"] .discipline-role h3 {
  color: var(--discipline-accent);
  font-family: var(--font-sans);
  font-size: var(--body-small-size);
  font-weight: 700;
  line-height: 1.12;
}
html[data-style-system="research"] .discipline-role p, html[data-style-system="publications"] .discipline-role p {
  margin-top: 6px;
  color: color-mix(in srgb, var(--ink) 66%, transparent);
  font-family: var(--font-sans);
  font-size: var(--body-small-size);
  line-height: 1.32;
}
html[data-style-system="research"] .ecosystem-stage, html[data-style-system="publications"] .ecosystem-stage { grid-template-columns: minmax(300px, 0.8fr) minmax(420px, 1.2fr); }
html[data-style-system="research"] .ecosystem-visual, html[data-style-system="publications"] .ecosystem-visual { display: grid; place-items: center; min-height: min(55vw, 650px); }
html[data-style-system="research"] .ecosystem-wheel, html[data-style-system="publications"] .ecosystem-wheel { position: relative; width: min(100%, 590px); aspect-ratio: 1; }
html[data-style-system="research"] .wheel-rings, html[data-style-system="publications"] .wheel-rings { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; overflow: visible; }
html[data-style-system="research"] .outer-fill, html[data-style-system="publications"] .outer-fill { fill: rgba(216, 211, 202, 0.48); fill: color-mix(in srgb, var(--line) 48%, transparent); }
html[data-style-system="research"] .wheel-logo, html[data-style-system="publications"] .wheel-logo { position: absolute; top: 50%; left: 50%; z-index: 2; width: 21%; aspect-ratio: 1; transform: translate(-50%, -50%); }
html[data-style-system="research"] .wheel-logo img, html[data-style-system="publications"] .wheel-logo img { width: 100%; height: 100%; filter: grayscale(0.5) contrast(2) brightness(0.8); object-fit: contain; }
html[data-style-system="research"] .wheel-label, html[data-style-system="publications"] .wheel-label { position: absolute; top: var(--label-y, 50%); left: var(--label-x, 50%); z-index: 3; display: inline-flex; flex-direction: column; align-items: center; gap: 0.42em; width: max-content; max-width: 11ch; padding: 0; border: 0; background: transparent; color: rgba(0, 0, 22, 0.34); color: color-mix(in srgb, var(--ink) 34%, transparent); cursor: pointer; font-family: var(--font-serif); font-size: clamp(1rem, 1.8vw, 1.7rem); font-weight: 400; line-height: 1.08; text-align: center; opacity: var(--label-opacity, 0.54); transform: translate(-50%, -50%); transition: color 200ms ease, opacity 200ms ease; will-change: left, top, opacity, color; }
html[data-style-system="research"] .wheel-label-icon, html[data-style-system="publications"] .wheel-label-icon { width: 2.15em; height: 2.15em; fill: currentColor; overflow: visible; }
html[data-style-system="research"] .wheel-label-icon *, html[data-style-system="publications"] .wheel-label-icon * { fill: currentColor; }
html[data-style-system="research"] .wheel-label.is-active, html[data-style-system="publications"] .wheel-label.is-active { color: var(--ink); }
@media (hover: hover) { html[data-style-system="research"] .wheel-label:hover, html[data-style-system="publications"] .wheel-label:hover { color: var(--ink); opacity: 1; }}
html[data-style-system="research"] .cycle-line, html[data-style-system="publications"] .cycle-line { margin-top: 70px; font-family: var(--font-serif); font-size: clamp(1.5rem, 2.4vw, 2.6rem); line-height: 1.05; }

/* Footer and modal */
html[data-style-system="research"] .site-footer, html[data-style-system="publications"] .site-footer { padding: 72px var(--page-x) 34px; background: var(--ink); color: rgba(251, 250, 246, 0.75); }
html[data-style-system="research"] .footer-inner, html[data-style-system="publications"] .footer-inner { display: grid; grid-template-columns: 1.2fr 0.7fr 0.9fr; gap: 48px; width: min(100%, var(--max)); margin: 0 auto; }
html[data-style-system="research"] .footer-logo, html[data-style-system="publications"] .footer-logo { width: 150px; margin-bottom: 18px; filter: invert(1) grayscale(1) brightness(2); }
html[data-style-system="research"] .site-footer p, html[data-style-system="publications"] .site-footer p { max-width: 420px; margin-bottom: 8px; }
html[data-style-system="research"] .site-footer nav, html[data-style-system="publications"] .site-footer nav { display: grid; align-content: start; gap: 7px; }
html[data-style-system="research"] .site-footer a, html[data-style-system="publications"] .site-footer a { color: rgba(251, 250, 246, 0.92); }
html[data-style-system="research"] .site-footer nav a, html[data-style-system="publications"] .site-footer nav a { min-height: 30px; text-decoration: none; }
html[data-style-system="research"] .footer-heading, html[data-style-system="publications"] .footer-heading { margin-top: 4px; color: var(--bg); font-family: var(--font-mono); font-size: var(--accent-size); font-weight: var(--accent-weight); text-transform: uppercase; }
html[data-style-system="research"] .footer-bottom, html[data-style-system="publications"] .footer-bottom { grid-column: 1 / -1; padding-top: 24px; margin-top: 10px !important; border-top: 1px solid rgba(251, 250, 246, 0.2); font-size: var(--body-small-size); }
html[data-style-system="research"] .modal[hidden], html[data-style-system="publications"] .modal[hidden] { display: none; }
html[data-style-system="research"] .modal, html[data-style-system="publications"] .modal { position: fixed; inset: 0; z-index: 250; display: grid; place-items: center; padding: 18px; }
html[data-style-system="research"] .modal-backdrop, html[data-style-system="publications"] .modal-backdrop { position: absolute; inset: 0; background: rgba(0, 0, 22, 0.58); }
html[data-style-system="research"] .modal-panel, html[data-style-system="publications"] .modal-panel { position: relative; width: min(100%, 700px); max-height: min(760px, 100%); overflow: auto; padding: clamp(26px, 5vw, 52px); background: var(--bg); box-shadow: 0 30px 90px rgba(0, 0, 0, 0.3); }
html[data-style-system="research"] .modal-panel h2, html[data-style-system="publications"] .modal-panel h2 { padding-right: 34px; }
html[data-style-system="research"] .modal-panel p:not(.eyebrow), html[data-style-system="publications"] .modal-panel p:not(.eyebrow) { color: rgba(0, 0, 22, 0.76); }
html[data-style-system="research"] .modal-close, html[data-style-system="publications"] .modal-close { position: absolute; top: 14px; right: 14px; display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid var(--line); background: transparent; color: var(--ink); cursor: pointer; }
html[data-style-system="research"] .modal-close span, html[data-style-system="publications"] .modal-close span { font-size: 1.7rem; line-height: 1; }
html[data-style-system="research"] .modal-actions, html[data-style-system="publications"] .modal-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }

html[data-style-system="research"].has-js [data-reveal], html[data-style-system="publications"].has-js [data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity 700ms var(--ease), transform 700ms var(--ease); }
html[data-style-system="research"].has-js [data-reveal].is-revealed, html[data-style-system="publications"].has-js [data-reveal].is-revealed { opacity: 1; transform: none; }

@media (max-width: 920px) {
  html[data-style-system="research"]:root, html[data-style-system="publications"]:root { --header-h: 62px; }
  html[data-style-system="research"] .nav-toggle, html[data-style-system="publications"] .nav-toggle { display: grid; margin-left: auto; }
  html[data-style-system="research"] .site-nav, html[data-style-system="publications"] .site-nav { position: fixed; top: calc(var(--header-h) + 2px); right: var(--page-x); left: var(--page-x); z-index: 240; display: block; width: auto; max-width: 490px; max-height: calc(100svh - var(--header-h) - 18px); margin: 0 0 0 auto; overflow: auto; padding: 8px; border: 1px solid var(--line); background: var(--bg); box-shadow: 0 18px 40px rgba(0, 0, 22, 0.1); opacity: 0; pointer-events: none; transform: translateY(-12px); visibility: hidden; transition: opacity 240ms ease, transform 260ms cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear 260ms; }
  html[data-style-system="research"] .site-nav.is-open, html[data-style-system="publications"] .site-nav.is-open { opacity: 1; pointer-events: auto; transform: translateY(0); visibility: visible; transition-delay: 0s; }
  html[data-style-system="research"] .site-nav, html[data-style-system="publications"] .site-nav { display: grid; grid-template-rows: minmax(0, 1fr) auto; }
  html[data-style-system="research"] .nav-list, html[data-style-system="publications"] .nav-list { display: grid; justify-content: stretch; gap: 2px; width: 100%; }
  html[data-style-system="research"] .site-nav > .nav-list, html[data-style-system="publications"] .site-nav > .nav-list { align-self: start; }
  html[data-style-system="research"] .nav-list > .nav-item, html[data-style-system="publications"] .nav-list > .nav-item { width: 100%; }
  html[data-style-system="research"] .nav-list > .nav-item > a, html[data-style-system="publications"] .nav-list > .nav-item > a { width: 100%; min-height: 44px; padding: 12px; color: rgba(0, 0, 22, 0.72); font-weight: 400; line-height: 1.12; }
  html[data-style-system="research"] .nav-item.has-dropdown > a::after, html[data-style-system="publications"] .nav-item.has-dropdown > a::after { display: none; }
  html[data-style-system="research"] .nav-dropdown, html[data-style-system="publications"] .nav-dropdown,
  html[data-style-system="research"] .nav-list .nav-item:hover > .nav-dropdown, html[data-style-system="publications"] .nav-list .nav-item:hover > .nav-dropdown,
  html[data-style-system="research"] .nav-list .nav-item:focus-within > .nav-dropdown, html[data-style-system="publications"] .nav-list .nav-item:focus-within > .nav-dropdown { position: static; display: grid; grid-template-columns: minmax(0, 1fr); min-width: 0; gap: 2px; padding: 0 0 4px 12px; border: 0; box-shadow: none; }
  html[data-style-system="research"] .nav-list .nav-dropdown a, html[data-style-system="publications"] .nav-list .nav-dropdown a { width: 100%; min-height: 38px; padding: 9px 12px; color: rgba(0, 0, 22, 0.62); font-size: var(--body-size); font-weight: 400; line-height: 1.12; }
  html[data-style-system="research"] .language-control, html[data-style-system="publications"] .language-control { display: none; }
  html[data-style-system="research"] .site-nav .mobile-language, html[data-style-system="publications"] .site-nav .mobile-language { display: flex; align-self: end; flex-wrap: wrap; justify-content: flex-start; column-gap: 22px; row-gap: 2px; align-content: start; margin-top: 8px; padding-top: 12px; border-top: 1px solid transparent; border-image: linear-gradient(90deg, transparent, var(--line-dark) 20%, var(--line-dark) 80%, transparent) 1; }
  html[data-style-system="research"] .site-nav .mobile-language .language-option, html[data-style-system="publications"] .site-nav .mobile-language .language-option { position: relative; display: inline-flex; align-items: center; justify-content: flex-start; flex: 0 0 auto; width: auto; min-width: 0; min-height: 44px; padding: 12px; color: var(--ink); font-family: var(--font-mono); font-size: var(--accent-size); font-weight: 700; line-height: 1.2; text-decoration: none; white-space: nowrap; }
  html[data-style-system="research"] .site-nav .mobile-language .language-option span, html[data-style-system="publications"] .site-nav .mobile-language .language-option span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  html[data-style-system="research"] .site-nav .mobile-language .language-option:hover, html[data-style-system="publications"] .site-nav .mobile-language .language-option:hover, html[data-style-system="research"] .site-nav .mobile-language .language-option:focus-visible, html[data-style-system="publications"] .site-nav .mobile-language .language-option:focus-visible, html[data-style-system="research"] .site-nav .mobile-language .language-option.is-active, html[data-style-system="publications"] .site-nav .mobile-language .language-option.is-active, html[data-style-system="research"] .site-nav .mobile-language .language-option[aria-current="true"], html[data-style-system="publications"] .site-nav .mobile-language .language-option[aria-current="true"] { background: transparent; color: var(--blue); }
  html[data-style-system="research"] .site-nav .mobile-language .language-option:not(:last-child)::after, html[data-style-system="publications"] .site-nav .mobile-language .language-option:not(:last-child)::after { position: absolute; top: 50%; right: -11px; color: currentColor; content: "·"; font-weight: 400; pointer-events: none; transform: translate(-50%, -50%); }
  html[data-style-system="research"] .hero-inner, html[data-style-system="publications"] .hero-inner, html[data-style-system="research"] .two-column-intro, html[data-style-system="publications"] .two-column-intro, html[data-style-system="research"] .definition-grid, html[data-style-system="publications"] .definition-grid, html[data-style-system="research"] .methodology-stage, html[data-style-system="publications"] .methodology-stage, html[data-style-system="research"] .ecosystem-stage, html[data-style-system="publications"] .ecosystem-stage, html[data-style-system="research"] .offer-layout, html[data-style-system="publications"] .offer-layout { grid-template-columns: 1fr; }
  html[data-style-system="research"] .hero-inner, html[data-style-system="publications"] .hero-inner { gap: 46px; }
  html[data-style-system="research"] .hero-intro h1, html[data-style-system="publications"] .hero-intro h1 { max-width: 740px; }
  html[data-style-system="research"] .hero-deck, html[data-style-system="publications"] .hero-deck { max-width: 600px; }
  html[data-style-system="research"] .question-stage, html[data-style-system="publications"] .question-stage { margin-top: var(--need-question-gap); }
  html[data-style-system="research"] .need-question-grid, html[data-style-system="publications"] .need-question-grid { grid-template-columns: 1fr; gap: 36px; }
  html[data-style-system="research"] .sequence-statement, html[data-style-system="publications"] .sequence-statement { position: static; grid-column: 1; width: 100%; max-width: 680px; text-align: center; transform: none; }
  html[data-style-system="research"] .need-question-stage .open-list, html[data-style-system="publications"] .need-question-stage .open-list { grid-column: 1; grid-row: auto; }
  html[data-style-system="research"] .approach-grid, html[data-style-system="publications"] .approach-grid { gap: 54px; }
  html[data-style-system="research"] .solution-heading, html[data-style-system="publications"] .solution-heading { text-align: left; }
  html[data-style-system="research"] .solution-heading h2, html[data-style-system="publications"] .solution-heading h2, html[data-style-system="research"] .solution-heading .lead, html[data-style-system="publications"] .solution-heading .lead { margin-left: 0; }
  html[data-style-system="research"] .solution-grid, html[data-style-system="publications"] .solution-grid { grid-template-columns: 1fr; margin-top: 60px; }
  html[data-style-system="research"] .solution-statement, html[data-style-system="publications"] .solution-statement { max-width: 650px; }
  html[data-style-system="research"] .ecosystem-note, html[data-style-system="publications"] .ecosystem-note { grid-column: auto; }
  html[data-style-system="research"] .offer-layout, html[data-style-system="publications"] .offer-layout { margin-top: 58px; }
  html[data-style-system="research"] .offer-principles, html[data-style-system="publications"] .offer-principles { padding: 30px 0 0; border-top: 1px solid var(--line); border-left: 0; }
  html[data-style-system="research"] .method-visual, html[data-style-system="publications"] .method-visual, html[data-style-system="research"] .ecosystem-visual, html[data-style-system="publications"] .ecosystem-visual { position: relative; top: auto; width: min(100%, 660px); margin: 20px auto 0; }
  html[data-style-system="research"] .stage-copy, html[data-style-system="publications"] .stage-copy { order: 2; }
  html[data-style-system="research"] .method-visual, html[data-style-system="publications"] .method-visual, html[data-style-system="research"] .ecosystem-visual, html[data-style-system="publications"] .ecosystem-visual { order: 1; }
  html[data-style-system="research"] .interdiscipline-sticky, html[data-style-system="publications"] .interdiscipline-sticky { justify-content: flex-start; padding-top: calc(var(--header-h) + 32px); gap: 22px; }
  html[data-style-system="research"] .interdiscipline-intro, html[data-style-system="publications"] .interdiscipline-intro { width: min(100%, 720px); }
  html[data-style-system="research"] .discipline-grid, html[data-style-system="publications"] .discipline-grid { grid-template-columns: 1fr; width: min(100%, 680px); min-height: min(58vh, 540px); }
  html[data-style-system="research"] .discipline-column, html[data-style-system="publications"] .discipline-column { min-height: min(58vh, 540px); padding: 0; gap: 12px; }
  html[data-style-system="research"] .discipline-summary, html[data-style-system="publications"] .discipline-summary { height: auto; }
  html[data-style-system="research"] .discipline-column + .discipline-column::before, html[data-style-system="publications"] .discipline-column + .discipline-column::before { display: none; }
  html[data-style-system="research"] .discipline-roles, html[data-style-system="publications"] .discipline-roles { gap: 8px; }
  html[data-style-system="research"] .discipline-role, html[data-style-system="publications"] .discipline-role { min-height: auto; padding: 11px 12px; }
  html[data-style-system="research"] .numbered-columns, html[data-style-system="publications"] .numbered-columns { grid-template-columns: 1fr; gap: 0; }
  html[data-style-system="research"] .numbered-columns article, html[data-style-system="publications"] .numbered-columns article { padding: 25px 0; border-right: 0; border-top: 1px solid var(--line); }
  html[data-style-system="research"] .contrast-lines, html[data-style-system="publications"] .contrast-lines { grid-template-columns: repeat(2, 1fr); }
  html[data-style-system="research"] .contrast-lines div:nth-child(2), html[data-style-system="publications"] .contrast-lines div:nth-child(2) { border-right: 0; }
  html[data-style-system="research"] .next-link, html[data-style-system="publications"] .next-link { grid-template-columns: 1fr; gap: 12px; }
  html[data-style-system="research"] .next-link p, html[data-style-system="publications"] .next-link p { max-width: 500px; }
  html[data-style-system="research"] .contact-band, html[data-style-system="publications"] .contact-band, html[data-style-system="research"] .evidence-line, html[data-style-system="publications"] .evidence-line { align-items: flex-start; flex-direction: column; }
  html[data-style-system="research"] .footer-inner, html[data-style-system="publications"] .footer-inner { grid-template-columns: 1fr 1fr; }
  html[data-style-system="research"] .two-column-intro > .section-copy, html[data-style-system="publications"] .two-column-intro > .section-copy, html[data-style-system="research"] .definition-grid > .section-copy, html[data-style-system="publications"] .definition-grid > .section-copy { padding-top: 0; }}

@media (min-width: 661px) and (max-width: 920px) {
  html[data-style-system="research"] .footer-inner > :first-child, html[data-style-system="publications"] .footer-inner > :first-child {
    grid-column: 1;
    grid-row: 1 / span 2;
  }

  html[data-style-system="research"] .footer-meta, html[data-style-system="publications"] .footer-meta {
    grid-column: 2;
    grid-row: 1;
  }

  html[data-style-system="research"] .footer-contact, html[data-style-system="publications"] .footer-contact {
    grid-column: 2;
    grid-row: 2;
  }

  html[data-style-system="research"] .footer-meta, html[data-style-system="publications"] .footer-meta,
  html[data-style-system="research"] .footer-contact, html[data-style-system="publications"] .footer-contact {
    text-align: right;
  }

  html[data-style-system="research"] .footer-meta nav, html[data-style-system="publications"] .footer-meta nav {
    justify-items: end;
  }

  html[data-style-system="research"] .footer-languages, html[data-style-system="publications"] .footer-languages {
    justify-content: flex-end;
  }

  html[data-style-system="research"] .footer-bottom, html[data-style-system="publications"] .footer-bottom {
    grid-column: 1 / -1;
    grid-row: 3;
  }}

@media (max-width: 640px) {
  html[data-style-system="research"] .site-nav, html[data-style-system="publications"] .site-nav {
    position: fixed;
    top: var(--header-h);
    right: 0;
    bottom: 0;
    left: 0;
    max-height: none;
    max-width: none;
    margin: 0;
    padding: 24px var(--page-x) calc(24px + env(safe-area-inset-bottom));
    border: 0;
    border-top: 1px solid var(--line);
    box-shadow: none;
  }

  html[data-style-system="research"] body::before, html[data-style-system="publications"] body::before { display: none; }}

@media (max-width: 560px) {
  html[data-style-system="research"] .header-inner, html[data-style-system="publications"] .header-inner { gap: 8px; }
  html[data-style-system="research"] .brand-wordmark, html[data-style-system="publications"] .brand-wordmark { width: 104px; }
  html[data-style-system="research"] .language-trigger, html[data-style-system="publications"] .language-trigger { width: max-content; min-width: 52px; min-height: 40px; padding: 6px 12px 6px 0; }
  html[data-style-system="research"] .home-hero, html[data-style-system="publications"] .home-hero { padding-top: 44px; }
  html[data-style-system="research"] .conversation, html[data-style-system="publications"] .conversation { padding: 18px; }
  html[data-style-system="research"] .message, html[data-style-system="publications"] .message { gap: 10px; }
  html[data-style-system="research"] .message-avatar, html[data-style-system="publications"] .message-avatar { width: 28px; height: 28px; }
  html[data-style-system="research"] .message-user .message-content, html[data-style-system="publications"] .message-user .message-content { font-size: var(--body-large-size); }
  html[data-style-system="research"] .composer-placeholder, html[data-style-system="publications"] .composer-placeholder { font-size: var(--body-small-size); }
  html[data-style-system="research"] .approach-grid, html[data-style-system="publications"] .approach-grid { grid-template-columns: 1fr; }
  html[data-style-system="research"] .approach-column h3, html[data-style-system="publications"] .approach-column h3 { font-size: 3rem; }
  html[data-style-system="research"] .offer-list div, html[data-style-system="publications"] .offer-list div { grid-template-columns: 32px 1fr; gap: 8px; }
  html[data-style-system="research"] .offer-list p, html[data-style-system="publications"] .offer-list p { font-size: var(--body-size); }
  html[data-style-system="research"] .contrast-lines, html[data-style-system="publications"] .contrast-lines { grid-template-columns: 1fr; }
  html[data-style-system="research"] .contrast-lines div, html[data-style-system="publications"] .contrast-lines div, html[data-style-system="research"] .contrast-lines div:nth-child(2), html[data-style-system="publications"] .contrast-lines div:nth-child(2) { padding: 17px 0; border-right: 0; border-bottom: 1px solid var(--line); }
  html[data-style-system="research"] .large-list div, html[data-style-system="publications"] .large-list div { grid-template-columns: 1fr; gap: 8px; }
  html[data-style-system="research"] .method-visual, html[data-style-system="publications"] .method-visual { width: 100%; margin-left: 0; transform: none; }
  html[data-style-system="research"] .methodology-section .method-node, html[data-style-system="publications"] .methodology-section .method-node { width: clamp(74px, 21cqw, 154px); height: clamp(74px, 21cqw, 154px); font-size: clamp(0.76rem, 3.2cqw, 1.2rem); }
  html[data-style-system="research"] .method-core, html[data-style-system="publications"] .method-core { width: 27cqw; height: 27cqw; padding: 10px; font-size: 0.75rem; }
  html[data-style-system="research"] .methodology-section .method-subnode, html[data-style-system="publications"] .methodology-section .method-subnode {
    width: clamp(72px, 18cqw, 136px);
    height: clamp(72px, 18cqw, 136px);
    font-size: clamp(0.58rem, 2.1cqw, 0.84rem);
  }
  html[data-style-system="research"] .publication-map-stage .method-subnode, html[data-style-system="publications"] .publication-map-stage .method-subnode {
    width: clamp(72px, 18cqw, 136px);
    height: clamp(72px, 18cqw, 136px);
    font-size: clamp(0.58rem, 2.1cqw, 0.84rem);
     padding: clamp(5px, 1cqw, 12px);
    }
  html[data-style-system="research"] .publication-list-view, html[data-style-system="publications"] .publication-list-view, html[data-style-system="research"] .publication-detail-view, html[data-style-system="publications"] .publication-detail-view {
    max-height: 68vh;
    padding-right: 14px;
  }
  html[data-style-system="research"] .publication-detail-view, html[data-style-system="publications"] .publication-detail-view {
    padding: 24px 14px 28px 0;
  }
  html[data-style-system="research"] .publication-item, html[data-style-system="publications"] .publication-item {
    grid-template-columns: 1fr auto;
    gap: 8px;
    padding-left: 12px;
  }
  html[data-style-system="research"] .publication-title, html[data-style-system="publications"] .publication-title {
    font-size: 1.06rem;
  }
  html[data-style-system="research"] .publication-list-heading, html[data-style-system="publications"] .publication-list-heading { display: block; }
  html[data-style-system="research"] .publication-list-heading span, html[data-style-system="publications"] .publication-list-heading span { display: block; margin-top: 5px; }
  html[data-style-system="research"] .ecosystem-visual, html[data-style-system="publications"] .ecosystem-visual { width: 100%; margin-left: 0; transform: none; }
  html[data-style-system="research"] .wheel-label, html[data-style-system="publications"] .wheel-label { font-size: 1.15rem; }
  html[data-style-system="research"] .footer-inner, html[data-style-system="publications"] .footer-inner { grid-template-columns: 1fr; gap: 30px; }
  html[data-style-system="research"] .footer-bottom, html[data-style-system="publications"] .footer-bottom { grid-column: auto; }}

@media (prefers-reduced-motion: reduce) {
  html[data-style-system="research"], html[data-style-system="publications"] { scroll-behavior: auto; }
  html[data-style-system="research"], html[data-style-system="research"] *, html[data-style-system="publications"], html[data-style-system="publications"] *, html[data-style-system="research"]::before, html[data-style-system="research"] *::before, html[data-style-system="publications"]::before, html[data-style-system="publications"] *::before, html[data-style-system="research"]::after, html[data-style-system="research"] *::after, html[data-style-system="publications"]::after, html[data-style-system="publications"] *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: 0.01ms !important; }
  html[data-style-system="research"].has-js [data-reveal], html[data-style-system="publications"].has-js [data-reveal] { opacity: 1; transform: none; }
  html[data-style-system="research"].has-js .type-unit, html[data-style-system="publications"].has-js .type-unit { opacity: 1; }
  html[data-style-system="research"].has-js .need-question-stage .open-list li, html[data-style-system="publications"].has-js .need-question-stage .open-list li { opacity: 1; transform: none; }}

/* Shared English footer used by the other pages. */
html[data-style-system="research"] .footer-inner, html[data-style-system="publications"] .footer-inner {
  grid-template-columns: 1.2fr 0.8fr 0.8fr;
  gap: 36px;
}

html[data-style-system="research"] .footer-languages, html[data-style-system="publications"] .footer-languages {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

html[data-style-system="research"] .footer-languages a, html[data-style-system="publications"] .footer-languages a {
  font-family: var(--font-mono);
  font-size: var(--accent-size);
}

/* Gender Equality Plan */
html[data-style-system="content"] .gender-plan-document .document-note {
  margin: 0 0 24px;
  padding: 16px 18px;
  border-left: 4px solid var(--blue);
  background: rgba(0, 108, 174, 0.07);
  color: var(--ink);
  font-size: var(--body-small-size);
  line-height: 1.5;
}

html[data-style-system="content"] .gender-plan-document .document-note strong {
  color: var(--blue);
}

html[data-style-system="content"] .gender-plan-document .plan-chapter {
  margin: 40px 0 14px;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

html[data-style-system="content"] .gender-plan-document .legal-section h3 {
  max-width: 920px;
  margin: 20px 40px 20px;
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  font-family: var(--font-mono);
  color: var(--ink-soft);
  line-height: 1.08;
  text-transform: uppercase;
}

html[data-style-system="content"] .gender-plan-document ol {
  max-width: 920px;
  padding-left: 2rem;
  margin: 14px 0 0;
  color: rgba(0, 0, 22, 0.72);
}

html[data-style-system="content"] .gender-plan-document li {
  padding-left: 0.35rem;
  margin: 8px 0;
}

html[data-style-system="content"] .gender-plan-document li::marker {
  color: var(--ink-soft);
  font-family: var(--font-mono);
  font-size: 0.82em;
  font-weight: var(--accent-weight);
}

html[data-style-system="content"] .gender-plan-document .action-plan-wrap {
  max-width: 100%;
  margin-top: 24px;
  overflow-x: auto;
  border-top: 1px solid var(--line-dark);
}

html[data-style-system="content"] .gender-plan-document .action-plan-table {
  width: 100%;
  min-width: 820px;
  border-collapse: collapse;
  color: rgba(0, 0, 22, 0.72);
  font-size: var(--body-small-size);
  line-height: 1.42;
}

html[data-style-system="content"] .gender-plan-document .action-plan-table th,
html[data-style-system="content"] .gender-plan-document .action-plan-table td {
  padding: 14px 12px;
  vertical-align: top;
  border-bottom: 1px solid var(--line);
  text-align: left;
}

html[data-style-system="content"] .gender-plan-document .action-plan-table thead th {
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: var(--accent-size);
  font-weight: var(--accent-weight);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

html[data-style-system="content"] .gender-plan-document .action-plan-table tbody th {
  min-width: 154px;
  color: var(--ink);
  font-weight: 500;
}

html[data-style-system="content"] .gender-plan-document .action-plan-table tbody tr:last-child th,
html[data-style-system="content"] .gender-plan-document .action-plan-table tbody tr:last-child td {
  border-bottom: 0;
}

@media (max-width: 920px) {
  html[data-style-system="research"] .footer-inner, html[data-style-system="publications"] .footer-inner {
    grid-template-columns: 1fr 1fr;
    gap: 30px;
  }}

@media (max-width: 660px) {
  html[data-style-system="research"] .footer-inner, html[data-style-system="publications"] .footer-inner {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  html[data-style-system="research"] .footer-bottom, html[data-style-system="publications"] .footer-bottom {
    grid-column: auto;
  }}