/* Neuro-Tide Visual Identity & Map Composition Pass
   This layer is intentionally separate from the legacy/base stylesheet. */

:where(h1, h2, h3, .site-brand, .brand-copy h1, .map-toolbar h2) {
  font-family: "Segoe UI Variable Display", "Aptos Display", "Segoe UI", system-ui, sans-serif;
  letter-spacing: 0;
}

body {
  background: var(--surface-0);
  color: var(--text-primary);
}

:where(a, button, input, select, summary):focus-visible {
  outline-color: var(--focus-ring);
  box-shadow: 0 0 0 5px rgba(21, 245, 186, 0.13);
}

.site-header {
  min-height: 66px;
  padding-block: 9px;
  border-bottom-color: rgba(71, 167, 255, 0.2);
  background:
    linear-gradient(90deg, rgba(21, 245, 186, 0.075), transparent 28%, rgba(183, 148, 244, 0.065)),
    rgba(4, 9, 18, 0.92);
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.2);
  backdrop-filter: blur(14px) saturate(1.12);
}

.site-header::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 1px;
  background: var(--brand-spectrum);
  opacity: 0.38;
  pointer-events: none;
}

.site-brand-logo {
  filter: drop-shadow(0 0 12px rgba(71, 167, 255, 0.22));
}

.site-nav a,
.nav-link-button {
  position: relative;
}

.site-nav a::after,
.nav-link-button::after {
  content: "";
  position: absolute;
  right: 2px;
  bottom: 1px;
  left: 2px;
  height: 2px;
  background: var(--accent-cyan);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 150ms ease;
}

.site-nav a:hover::after,
.site-nav a:focus-visible::after,
.nav-link-button:hover::after,
.nav-link-button:focus-visible::after {
  transform: scaleX(1);
}

.primary-cta {
  border-color: #24b8d2;
  background: #087fa8;
  color: #f8ffff;
  box-shadow: 0 10px 26px rgba(0, 126, 168, 0.24);
}

.primary-cta:hover,
.primary-cta:focus-visible {
  border-color: #7be8ef;
  background: #0a91b8;
}

.landing-v2 {
  isolation: isolate;
  overflow: clip;
  background:
    linear-gradient(125deg, rgba(21, 245, 186, 0.045), transparent 24%),
    linear-gradient(235deg, rgba(183, 148, 244, 0.055), transparent 28%),
    linear-gradient(180deg, #050713 0%, #060a14 44%, #050713 100%);
}

.landing-v2::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  display: block;
  background:
    linear-gradient(rgba(125, 198, 224, 0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(125, 198, 224, 0.022) 1px, transparent 1px),
    linear-gradient(112deg, transparent 0 46%, rgba(71, 167, 255, 0.035) 46.2% 46.35%, transparent 46.55% 100%);
  background-size: 72px 72px, 72px 72px, auto;
  mask-image: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, 0.65) 58%, transparent 96%);
  pointer-events: none;
}

.landing-hero-v2 {
  min-height: min(650px, calc(100svh - 94px));
  border-bottom-color: rgba(71, 167, 255, 0.2);
  background: #040912;
}

.landing-hero-media {
  object-position: 68% center;
  opacity: 0.96;
  filter: saturate(1.18) contrast(1.07) brightness(1.02);
  transform: scale(1.015);
}

.landing-hero-scrim {
  background:
    linear-gradient(90deg, rgba(3, 7, 15, 0.98) 0%, rgba(3, 8, 17, 0.93) 34%, rgba(3, 8, 17, 0.62) 53%, rgba(3, 8, 17, 0.18) 76%, rgba(3, 8, 17, 0.28) 100%),
    linear-gradient(180deg, rgba(2, 6, 13, 0.52), transparent 22%, transparent 72%, rgba(2, 6, 13, 0.72));
}

.landing-hero-v2::after {
  content: "";
  position: absolute;
  top: 4%;
  bottom: 4%;
  left: 52%;
  width: 20%;
  background: linear-gradient(112deg, transparent 0 43%, rgba(111, 239, 255, 0.28) 49%, transparent 55% 100%);
  opacity: 0.26;
  transform: translateX(-18%);
  animation: heroSignal 11s ease-in-out infinite;
  pointer-events: none;
}

@keyframes heroSignal {
  0%, 100% { opacity: 0.12; transform: translateX(-18%); }
  48% { opacity: 0.32; transform: translateX(16%); }
}

.landing-hero-copy-v2 {
  width: min(100% - 48px, var(--content-max));
  padding-block: 38px 46px;
}

.landing-hero-copy-v2 > * { max-width: var(--reading-max); }

.hero-brand-lockup-v2 {
  margin-bottom: 18px;
}

.hero-brand-lockup-v2 img {
  filter: drop-shadow(0 0 16px rgba(71, 167, 255, 0.24));
}

.landing-hero-copy-v2 h1 {
  max-width: 760px;
  margin-block: 8px 18px;
  font-size: 4.45rem;
  line-height: 1.01;
  text-wrap: balance;
  text-shadow: 0 5px 30px rgba(0, 0, 0, 0.72);
}

.landing-hero-copy-v2 h1::after {
  content: "";
  display: block;
  width: 112px;
  height: 3px;
  margin-top: 20px;
  background: var(--brand-spectrum);
  box-shadow: var(--glow-blue-soft);
}

.landing-hero-copy-v2 .hero-lead {
  color: var(--text-primary);
  font-size: 1.24rem;
}

.landing-hero-copy-v2 .hero-subline {
  color: var(--text-secondary);
  font-size: 0.98rem;
}

.hero-boundary-v2 {
  max-width: 690px;
  border-left-color: var(--accent-amber);
  background: linear-gradient(90deg, rgba(255, 176, 32, 0.07), transparent 72%);
}

.product-stats-v2 {
  width: min(100% - 48px, var(--content-max));
  margin-top: -26px;
  border-color: var(--border-medium);
  border-radius: 6px;
  background: rgba(7, 17, 28, 0.94);
  box-shadow: var(--shadow-elevated);
}

.product-stats-v2::before {
  content: "";
  position: absolute;
  top: -1px;
  right: -1px;
  left: -1px;
  height: 2px;
  background: var(--brand-spectrum);
  opacity: 0.76;
}

.product-stats-v2 > span {
  min-height: 78px;
  position: relative;
}

.product-stats-v2 strong {
  color: var(--text-primary);
  font-family: "Segoe UI Variable Display", "Aptos Display", system-ui, sans-serif;
  font-size: 1.22rem;
}

.landing-v2 .landing-section {
  position: relative;
  width: min(100% - 48px, var(--content-max));
  padding-block: var(--section-space);
}

.landing-section-heading-v2 h2,
.landing-why-v2 h2,
.landing-final-v2 h2 {
  color: var(--text-primary);
  text-wrap: balance;
}

.section-kicker,
.hero-kicker {
  color: var(--accent-cyan);
  font-size: 0.72rem;
}

.landing-promise-v2::before,
.landing-modules-v2::before,
.landing-quality-v2::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 100vw;
  transform: translateX(-50%);
  pointer-events: none;
}

.landing-promise-v2::before {
  background: linear-gradient(100deg, rgba(21, 245, 186, 0.025), transparent 42%, rgba(71, 167, 255, 0.025));
}

.promise-rail-v2 {
  border-color: var(--border-medium);
  background: linear-gradient(90deg, rgba(7, 17, 28, 0.35), rgba(10, 21, 34, 0.68), rgba(7, 17, 28, 0.35));
}

.promise-rail-v2 article {
  border-right-color: var(--border-soft);
  transition: background 150ms ease;
}

.promise-rail-v2 article:hover {
  background: rgba(71, 167, 255, 0.045);
}

.landing-modules-v2 {
  border: 0;
}

.landing-modules-v2::before {
  border-block: 1px solid rgba(71, 167, 255, 0.12);
  background:
    linear-gradient(118deg, rgba(71, 167, 255, 0.055), transparent 34%),
    linear-gradient(242deg, rgba(183, 148, 244, 0.045), transparent 36%),
    #060c16;
}

.module-grid-v2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.module-card-v2 {
  min-height: 256px;
  grid-template-columns: minmax(210px, 0.9fr) minmax(250px, 1.1fr);
  border-color: color-mix(in srgb, var(--module-color), transparent 72%);
  border-radius: 7px;
  background:
    linear-gradient(140deg, color-mix(in srgb, var(--module-color) 5%, transparent), transparent 48%),
    rgba(7, 17, 28, 0.92);
  box-shadow: 0 16px 44px rgba(0, 0, 0, 0.2);
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.module-card-v2:hover,
.module-card-v2:focus-within {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--module-color), transparent 44%);
  box-shadow: 0 20px 52px rgba(0, 0, 0, 0.3), 0 0 26px color-mix(in srgb, var(--module-color), transparent 90%);
}

.module-card-v2.module-map {
  min-height: 330px;
  grid-column: 1 / -1;
  grid-template-columns: minmax(360px, 1.2fr) minmax(330px, 0.8fr);
}

.module-card-v2 > div:last-child {
  padding: 30px;
}

.module-card-v2 small {
  font-size: 0.66rem;
}

.module-card-v2 h3 {
  font-size: 1.35rem;
}

.module-card-v2 p {
  color: var(--text-secondary);
  font-size: 0.82rem;
}

.module-visual-v2 {
  min-height: 100%;
  border-right-color: color-mix(in srgb, var(--module-color), transparent 72%);
  background:
    linear-gradient(rgba(125, 198, 224, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(125, 198, 224, 0.035) 1px, transparent 1px),
    linear-gradient(145deg, color-mix(in srgb, var(--module-color) 11%, #07111c), #06101a 72%);
  background-size: 24px 24px, 24px 24px, auto;
}

.preview-chrome {
  height: 28px;
  display: flex;
  align-items: center;
  gap: 5px;
  padding-inline: 10px;
  border-bottom: 1px solid color-mix(in srgb, var(--module-color), transparent 78%);
  background: rgba(3, 9, 17, 0.58);
}

.preview-chrome i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--module-color), #fff 12%);
  opacity: 0.68;
}

.preview-chrome i:nth-child(2) { opacity: 0.38; }
.preview-chrome i:nth-child(3) { width: 36px; margin-left: auto; border-radius: 2px; opacity: 0.18; }

.preview-map-field {
  position: absolute;
  inset: 42px 16px 16px;
  border: 1px solid color-mix(in srgb, var(--module-color), transparent 78%);
  background: rgba(3, 10, 19, 0.46);
}

.preview-node {
  position: absolute;
  z-index: 2;
  width: 13px;
  height: 13px;
  border: 2px solid color-mix(in srgb, var(--module-color), #fff 24%);
  border-radius: 50%;
  background: #07111c;
  box-shadow: 0 0 12px color-mix(in srgb, var(--module-color), transparent 48%);
}

.preview-node.n1 { left: 9%; top: 24%; }
.preview-node.n2 { left: 30%; top: 56%; }
.preview-node.n3 { left: 48%; top: 28%; width: 18px; height: 18px; }
.preview-node.n4 { left: 64%; top: 67%; border-radius: 3px; }
.preview-node.n5 { left: 74%; top: 38%; transform: rotate(45deg); border-radius: 2px; }

.preview-edge {
  position: absolute;
  z-index: 1;
  height: 1px;
  transform-origin: left center;
  background: color-mix(in srgb, var(--module-color), transparent 30%);
}

.preview-edge.e1 { left: 11%; top: 29%; width: 40%; transform: rotate(12deg); }
.preview-edge.e2 { left: 31%; top: 61%; width: 39%; transform: rotate(-38deg); }
.preview-edge.e3 { left: 50%; top: 35%; width: 28%; transform: rotate(27deg); }

.preview-detail-rail {
  position: absolute;
  top: 8px;
  right: 8px;
  bottom: 8px;
  width: 21%;
  display: grid;
  align-content: start;
  gap: 7px;
  padding: 9px 7px;
  border-left: 1px solid color-mix(in srgb, var(--module-color), transparent 72%);
  background: rgba(8, 18, 29, 0.84);
}

.preview-detail-rail i { height: 5px; background: color-mix(in srgb, var(--module-color), transparent 70%); }
.preview-detail-rail i:nth-child(1) { width: 68%; height: 8px; background: color-mix(in srgb, var(--module-color), transparent 44%); }
.preview-detail-rail i:nth-child(3) { width: 82%; }

.preview-search-line {
  height: 24px;
  margin: 16px 16px 11px;
  border: 1px solid color-mix(in srgb, var(--module-color), transparent 70%);
  border-radius: 4px;
  background: rgba(2, 8, 16, 0.54);
}

.preview-catalog-row {
  min-height: 38px;
  display: grid;
  grid-template-columns: 9px minmax(0, 1fr) 36px;
  align-items: center;
  gap: 8px;
  margin: 0 16px 7px;
  padding: 7px 8px;
  border-bottom: 1px solid color-mix(in srgb, var(--module-color), transparent 82%);
}

.preview-catalog-row i { width: 8px; height: 8px; border-radius: 50%; background: var(--module-color); }
.preview-catalog-row b { height: 6px; background: color-mix(in srgb, var(--module-color), transparent 68%); }
.preview-catalog-row span { height: 14px; border: 1px solid color-mix(in srgb, var(--module-color), transparent 58%); border-radius: 3px; }

.preview-stack-chip {
  position: absolute;
  left: 16px;
  width: 42%;
  height: 28px;
  display: grid;
  grid-template-columns: 8px 1fr;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  border: 1px solid color-mix(in srgb, var(--module-color), transparent 66%);
  border-radius: 4px;
  background: rgba(10, 20, 32, 0.72);
}

.preview-stack-chip.s1 { top: 48px; }
.preview-stack-chip.s2 { top: 84px; left: 23px; }
.preview-stack-chip.s3 { top: 120px; }
.preview-stack-chip i { width: 7px; height: 7px; border-radius: 50%; background: var(--module-color); }
.preview-stack-chip b { height: 5px; background: color-mix(in srgb, var(--module-color), transparent 64%); }

.preview-stack-overlap {
  position: absolute;
  top: 56px;
  right: 18px;
  width: 37%;
  height: 100px;
}

.preview-stack-overlap span {
  position: absolute;
  width: 64px;
  height: 64px;
  border: 1px solid var(--module-color);
  border-radius: 50%;
  background: color-mix(in srgb, var(--module-color), transparent 91%);
}

.preview-stack-overlap span:last-of-type { top: 28px; left: 26px; }
.preview-stack-overlap em { position: absolute; z-index: 2; top: 37px; left: 38px; color: var(--accent-amber); font-style: normal; font-weight: 900; }

.preview-axis-bars {
  height: 82px;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  align-items: end;
  gap: 8px;
  margin: 18px 18px 12px;
}

.preview-axis-bars i { height: 44%; border-radius: 2px 2px 0 0; background: color-mix(in srgb, var(--module-color), transparent 42%); }
.preview-axis-bars i:nth-child(2) { height: 76%; background: rgba(71, 167, 255, 0.66); }
.preview-axis-bars i:nth-child(3) { height: 58%; background: rgba(183, 148, 244, 0.66); }
.preview-axis-bars i:nth-child(4) { height: 84%; background: rgba(255, 176, 32, 0.62); }
.preview-axis-bars i:nth-child(5) { height: 64%; background: rgba(94, 224, 143, 0.64); }

.preview-timeline {
  position: relative;
  display: flex;
  justify-content: space-between;
  margin: 18px;
  border-top: 1px solid color-mix(in srgb, var(--module-color), transparent 50%);
}

.preview-timeline span { width: 9px; height: 9px; margin-top: -5px; border: 2px solid var(--module-color); border-radius: 50%; background: #07111c; }

.preview-safety-matrix {
  width: 92px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5px;
  margin: 26px 0 0 22px;
}

.preview-safety-matrix i { aspect-ratio: 1; border: 1px solid color-mix(in srgb, var(--module-color), transparent 60%); background: rgba(255, 176, 32, 0.05); }
.preview-safety-matrix i:nth-child(5),
.preview-safety-matrix i:nth-child(8) { background: rgba(255, 176, 32, 0.36); }
.preview-safety-marker { position: absolute; top: 52px; right: 25px; width: 42px; height: 42px; display: grid; place-items: center; border: 2px solid var(--module-color); border-radius: 50%; color: var(--module-color); font-weight: 900; }
.preview-evidence-lines { position: absolute; right: 20px; bottom: 28px; width: 48px; display: grid; gap: 5px; }
.preview-evidence-lines i { height: 4px; background: color-mix(in srgb, var(--module-color), transparent 62%); }
.preview-evidence-lines i:nth-child(2) { width: 72%; }

.preview-path-line {
  position: absolute;
  top: 98px;
  right: 24px;
  left: 24px;
  height: 2px;
  background: linear-gradient(90deg, var(--module-color), rgba(71, 167, 255, 0.72), rgba(183, 148, 244, 0.72));
}

.preview-path-steps {
  position: absolute;
  top: 91px;
  right: 22px;
  left: 22px;
  display: flex;
  justify-content: space-between;
}

.preview-path-steps span { width: 15px; height: 15px; border: 2px solid var(--module-color); border-radius: 50%; background: #07111c; box-shadow: 0 0 10px color-mix(in srgb, var(--module-color), transparent 58%); }
.preview-source-stamp { position: absolute; right: 20px; bottom: 20px; width: 76px; display: grid; gap: 5px; padding: 7px; border: 1px solid color-mix(in srgb, var(--module-color), transparent 60%); border-radius: 4px; }
.preview-source-stamp i, .preview-source-stamp b { height: 4px; background: color-mix(in srgb, var(--module-color), transparent 55%); }
.preview-source-stamp b { width: 66%; }

.landing-why-v2 {
  gap: 110px;
}

.landing-why-v2 ol {
  border: 0;
  border-left: 1px solid var(--border-medium);
  background: transparent;
}

.landing-why-v2 li {
  border-bottom: 1px solid var(--border-soft);
  background: transparent;
}

.landing-plans-v2 {
  border-top-color: var(--border-soft);
}

.plan-compare-v2 {
  gap: 0;
  border-block: 1px solid var(--border-soft);
}

.plan-card-v2 {
  border: 0;
  border-radius: 0;
  background: rgba(7, 17, 28, 0.54);
  box-shadow: none;
}

.plan-card-v2 + .plan-card-v2 {
  border-left: 1px solid var(--border-medium);
}

.plan-card-v2.pro,
.plan-card-v2.free {
  box-shadow: inset 0 3px var(--plan-accent, var(--accent-cyan));
}

.plan-card-v2.pro { --plan-accent: var(--accent-violet); }

.landing-quality-v2 {
  border: 0;
}

.landing-quality-v2::before {
  border-block: 1px solid rgba(255, 176, 32, 0.15);
  background: linear-gradient(105deg, rgba(255, 176, 32, 0.035), rgba(6, 12, 22, 0.82) 46%, rgba(71, 167, 255, 0.025));
}

.quality-grid-v2 {
  gap: 0;
  border-block: 1px solid rgba(255, 176, 32, 0.2);
  background: transparent;
}

.quality-grid-v2 article {
  border-right: 1px solid rgba(255, 176, 32, 0.14);
  background: transparent;
}

.quality-grid-v2 article:last-child { border-right: 0; }

.landing-final-v2 {
  position: relative;
  min-height: 390px;
  overflow: hidden;
  border-top-color: rgba(21, 245, 186, 0.18);
  background:
    linear-gradient(118deg, rgba(21, 245, 186, 0.08), transparent 34%),
    linear-gradient(242deg, rgba(183, 148, 244, 0.09), transparent 38%),
    #06101a;
}

.landing-final-v2::before {
  content: "";
  position: absolute;
  top: 0;
  right: 8%;
  left: 8%;
  height: 2px;
  background: var(--brand-spectrum);
  opacity: 0.66;
}

/* Map composition */
.left-rail,
.right-rail,
.map-stage {
  border-color: var(--border-soft);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent 140px),
    rgba(7, 17, 28, 0.94);
  box-shadow: 0 18px 54px rgba(0, 0, 0, 0.3);
  backdrop-filter: none;
}

.map-stage {
  border-color: rgba(71, 167, 255, 0.22);
  background: #06101a;
}

.map-stage:fullscreen,
.map-stage.fallback-fullscreen {
  background:
    linear-gradient(122deg, rgba(21, 245, 186, 0.035), transparent 34%),
    linear-gradient(238deg, rgba(183, 148, 244, 0.04), transparent 36%),
    #040912;
}

.map-toolbar {
  border-bottom-color: rgba(71, 167, 255, 0.18);
  background:
    linear-gradient(90deg, rgba(21, 245, 186, 0.07), transparent 38%, rgba(183, 148, 244, 0.055)),
    rgba(6, 15, 26, 0.94);
}

.map-toolbar h2 {
  font-size: 1.25rem;
}

.map-visibility-control:not([open]) .map-visibility-popover {
  display: none;
}

.map-shell {
  background:
    linear-gradient(rgba(125, 198, 224, 0.038) 1px, transparent 1px),
    linear-gradient(90deg, rgba(125, 198, 224, 0.034) 1px, transparent 1px),
    linear-gradient(130deg, rgba(21, 245, 186, 0.035), transparent 30%, rgba(71, 167, 255, 0.025) 62%, rgba(183, 148, 244, 0.035)),
    #050d18;
  background-size: 44px 44px, 44px 44px, auto, auto;
}

.domain-band {
  fill-opacity: 1;
  stroke: color-mix(in srgb, var(--domain-color), transparent 54%);
  stroke-width: 1.25;
}

.domain-band.active {
  fill-opacity: 1;
  stroke-width: 2;
  filter: none;
}

.domain-contour {
  fill: none;
  stroke: color-mix(in srgb, var(--domain-color), transparent 78%);
  stroke-width: 0.8;
  stroke-dasharray: 16 18;
  opacity: 0.72;
  pointer-events: none;
}

.domain-label {
  fill: rgba(238, 248, 255, 0.96);
  font-size: 16px;
  font-weight: 790;
  stroke-width: 5px;
}

.domain-sub {
  fill: rgba(171, 193, 207, 0.88);
  font-size: 10.8px;
}

.axis-rule {
  stroke: rgba(125, 198, 224, 0.12);
  stroke-dasharray: 2 16;
  opacity: 0.46;
}

.edge {
  stroke-width: 1.45;
  opacity: 0.2;
}

.edge.path-primary { stroke-width: 1.85; opacity: 0.3; }
.edge.path-secondary { stroke-width: 1.2; opacity: 0.18; }
.edge.path-indirect,
.edge.path-hypothesis { opacity: 0.11; }

#mapSvg[data-complexity-mode="overview"] .edge.focus-member {
  opacity: 0.72;
  stroke-width: 2.5;
}

.edge.highlight,
.edge.selected,
.edge:focus-visible {
  opacity: 0.96;
}

.node-core {
  fill: var(--node-fill);
  fill-opacity: 0.93;
  stroke: rgba(238, 248, 255, 0.82);
  stroke-width: 1.25;
}

.node-group.dim,
.node-group.domain-filtered { opacity: 0.48; }
.node-group.soft { opacity: 0.68; }

.node-family {
  transform: none;
  stroke-width: 1.8;
  fill-opacity: 0.84;
}

.node-complex {
  transform: none;
  stroke-width: 2;
  fill-opacity: 0.88;
}

.node-subunit {
  transform: none;
  stroke-width: 1.35;
  stroke-dasharray: 3 2;
  fill-opacity: 0.82;
}

.node-group.display-ion .node-core,
.node-group.display-small_molecule .node-core {
  stroke-width: 1.7;
}

.node-group.display-enzyme .node-core {
  stroke-dasharray: 3 1.5;
}

.node-group.display-transporter .node-core {
  stroke-width: 2;
}

.node-group.display-biological_process .node-core,
.node-group.display-pathway .node-core,
.node-group.display-safety_context .node-core {
  fill-opacity: 0.78;
}

.node-group.quick-selected .node-core,
.node-group:focus-visible .node-core {
  stroke: #fff;
  stroke-width: 2.8;
  filter: drop-shadow(0 0 10px var(--node-fill));
}

#mapSvg[data-complexity-mode="overview"] .node-group.focus-member:not(.dim) .node-core {
  filter: drop-shadow(0 0 7px color-mix(in srgb, var(--node-fill), transparent 18%));
}

.node-label {
  fill: rgba(238, 248, 255, 0.94);
  font-size: 11.2px;
  font-weight: 720;
}

.node-type {
  fill: rgba(171, 193, 207, 0.82);
}

.map-footer {
  border-top-color: rgba(71, 167, 255, 0.14);
  background: rgba(5, 13, 24, 0.94);
}

.stat-pill {
  border-radius: 5px;
  border-color: var(--border-soft);
  background: rgba(71, 167, 255, 0.045);
}

.right-rail {
  border-top-color: rgba(183, 148, 244, 0.28);
}

.detail-panel {
  border: 0;
  border-left: 2px solid var(--detail-axis-color, rgba(71, 167, 255, 0.32));
  border-radius: 0;
  background: transparent;
}

.detail-list li,
.micro-list li {
  border: 0;
  border-bottom: 1px solid var(--border-soft);
  border-radius: 0;
  background: transparent;
}

.safety-card,
.legend-card {
  border-color: var(--border-soft);
  background: rgba(255, 255, 255, 0.018);
}

.left-rail .control-section,
.active-layer-section {
  border-color: var(--border-soft);
  background: rgba(2, 9, 18, 0.34);
}

.chip,
.agent-chip,
.domain-row,
.influence-chip {
  background: rgba(8, 19, 31, 0.66);
}

.chip:hover,
.agent-chip:hover,
.domain-row:hover,
.influence-chip:hover {
  border-color: var(--border-medium);
  background: rgba(12, 28, 43, 0.78);
}

.map-empty {
  left: 50%;
  bottom: 50%;
  width: min(390px, calc(100% - 36px));
  padding: 18px;
  transform: translate(-50%, 50%);
  border-color: var(--border-medium);
  background: rgba(7, 17, 28, 0.92);
  text-align: center;
}

@media (max-width: 1380px) {
  .landing-hero-copy-v2 h1 { font-size: 3.7rem; }
  .module-card-v2 { grid-template-columns: 180px minmax(0, 1fr); }
  .module-card-v2.module-map { grid-template-columns: minmax(320px, 1.05fr) minmax(300px, 0.95fr); }
}

@media (max-width: 900px) {
  :root { --section-space: 78px; }
  .landing-hero-v2 { min-height: min(620px, calc(100svh - 90px)); }
  .landing-hero-media { object-position: 64% center; }
  .landing-hero-scrim {
    background:
      linear-gradient(90deg, rgba(3, 7, 15, 0.97), rgba(3, 8, 17, 0.82) 58%, rgba(3, 8, 17, 0.36)),
      linear-gradient(180deg, rgba(2, 6, 13, 0.5), transparent 30%, rgba(2, 6, 13, 0.74));
  }
  .landing-hero-copy-v2 h1 { font-size: 3.15rem; }
  .module-card-v2.module-map { grid-column: auto; }
  .module-grid-v2,
  .module-card-v2.module-map { grid-template-columns: minmax(0, 1fr); }
  .module-card-v2 { grid-template-columns: minmax(180px, 0.8fr) minmax(0, 1.2fr); }
  .module-visual-v2 { min-height: 220px; border-right: 0; border-bottom: 1px solid color-mix(in srgb, var(--module-color), transparent 72%); }
  .landing-why-v2 { gap: 44px; }
}

@media (max-width: 700px) {
  :root { --section-space: 68px; --map-safe-padding: 64px; }
  .site-header { min-height: 60px; }
  .landing-hero-v2 { min-height: min(680px, calc(100svh - 60px)); align-items: end; }
  .landing-hero-media { object-position: 68% center; opacity: 0.78; filter: saturate(1.25) contrast(1.06); }
  .landing-hero-scrim {
    background:
      linear-gradient(90deg, rgba(3, 7, 15, 0.9), rgba(3, 8, 17, 0.6) 68%, rgba(3, 8, 17, 0.32)),
      linear-gradient(180deg, rgba(2, 6, 13, 0.46) 0%, rgba(2, 6, 13, 0.3) 28%, rgba(2, 6, 13, 0.9) 76%, #03070f 100%);
  }
  .landing-hero-v2::after { display: none; }
  .landing-hero-copy-v2 { width: calc(100% - 24px); padding-block: 30px; }
  .landing-hero-copy-v2 h1 { font-size: 2.48rem; }
  .landing-hero-copy-v2 .hero-lead { font-size: 1.04rem; }
  .landing-hero-copy-v2 .hero-subline { font-size: 0.9rem; }
  .product-stats-v2 { width: calc(100% - 24px); margin-top: 0; }
  .product-stats-v2 > span { min-height: 62px; }
  .landing-v2 .landing-section { width: calc(100% - 24px); }
  .module-grid-v2,
  .module-card-v2,
  .module-card-v2.module-map { grid-template-columns: minmax(0, 1fr); }
  .module-visual-v2 { min-height: 210px; }
  .module-card-v2 > div:last-child { padding: 24px; }
  .plan-card-v2 + .plan-card-v2 { border-top: 1px solid var(--border-medium); border-left: 0; }
  .quality-grid-v2 article { border-right: 0; border-bottom: 1px solid rgba(255, 176, 32, 0.14); }
  .quality-grid-v2 article:last-child { border-bottom: 0; }
  #mapSvg[data-complexity-mode="overview"] .axis-header-overlay { display: none; }
}

@media (max-width: 860px) {
  .navigator-section .app-shell { padding: 0; }
  .map-stage {
    min-height: calc(100svh - 60px);
    margin: 0;
    border-radius: 0;
  }
  .map-toolbar { min-height: 132px; }
  .map-actions { flex-wrap: nowrap; }
  .map-actions .icon-button { width: 42px; height: 42px; }
  .complexity-control button,
  .map-visibility-control > summary { min-height: 42px; }
  #mapSvg { min-height: 620px; }
  .edge-legend { max-height: 118px; overflow: auto; }
  body.detail-drawer-open .right-rail {
    background: rgba(5, 13, 24, 0.985);
    box-shadow: -24px 0 64px rgba(0, 0, 0, 0.58);
  }
}

@media (max-width: 430px) {
  .landing-hero-v2 { min-height: 680px; }
  .landing-hero-copy-v2 h1 { font-size: 2.22rem; }
  .hero-brand-lockup-v2 { margin-bottom: 12px; }
  .hero-brand-lockup-v2 img { width: 52px; height: 52px; }
  .hero-boundary-v2 { padding-left: 12px; }
  .module-visual-v2 { min-height: 190px; }
  .map-toolbar { padding: 10px; }
  .map-title-group h2 { font-size: 1.05rem; }
  .map-actions { gap: 5px; }
}

@media (prefers-reduced-motion: reduce) {
  .landing-hero-v2::after { animation: none; opacity: 0.15; }
  .module-card-v2,
  .site-nav a::after,
  .nav-link-button::after { transition: none; }
  .module-card-v2:hover,
  .module-card-v2:focus-within { transform: none; }
  .edge.highlight,
  .node-ring.pulse { animation: none; }
}

@media (forced-colors: active) {
  .landing-hero-scrim { background: Canvas; opacity: 0.74; }
  .module-card-v2,
  .map-stage,
  .left-rail,
  .right-rail { border: 1px solid CanvasText; }
  .domain-band,
  .domain-contour,
  .node-core,
  .edge { forced-color-adjust: auto; }
}
