/* Main-page narrative: the decoder and risk comparison share one figure. */
.holon-applications-page:has(.interpretability-unified:target) .holon-section {
  /* Resolve preceding section heights before a direct or in-page anchor jump. */
  content-visibility: visible;
}

.interpretability-unified .interpretability-evidence {
  margin-top: clamp(28px, 4vw, 52px);
  padding: 0;
  border: 0;
  background: transparent;
}

.interpretability-unified .holotype-risk-header {
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: center;
}

.interpretability-unified .holotype-risk-header h3 {
  max-width: 540px;
  margin-top: 12px;
  font-size: clamp(28px, 2.8vw, 40px);
  line-height: 1.12;
}

.interpretability-evidence-copy > p {
  max-width: 600px;
  margin: 16px 0 0;
  color: var(--fg-soft);
  font-size: 15px;
  line-height: 1.65;
}

.interpretability-unified .interpretability-decoder {
  height: 210px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  grid-template-columns: minmax(0, 1fr) 64px minmax(0, 1fr);
  gap: 8px;
}

.interpretability-unified .decoder-space { padding: 16px; }
.interpretability-unified .decoder-space > strong { font-size: clamp(20px, 2vw, 28px); }
.interpretability-unified .decoder-programs { gap: 9px; margin-top: 16px; }
.interpretability-unified .decoder-programs div { gap: 5px; }
.interpretability-unified .decoder-programs small { font-size: 7px; }
.interpretability-unified .latent-field { inset: 76px 16px 16px; }

.interpretability-unified .holotype-risk-layout {
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  margin-top: 32px;
}

.interpretability-unified .holotype-program-panel,
.interpretability-unified .holotype-composition-panel { padding: clamp(20px, 2.2vw, 32px); }

.interpretability-unified .holotype-panel-heading { min-height: 100px; align-content: start; }
.interpretability-unified .holotype-panel-heading > span { font-size: 9px; }
.interpretability-unified .holotype-panel-heading > strong { font-size: clamp(22px, 1.9vw, 28px); }
.interpretability-unified .holotype-panel-heading > small { font-size: 8px; line-height: 1.5; }

.interpretability-unified .holotype-program-item {
  grid-template-columns: 6px minmax(0, .85fr) minmax(0, 1.15fr);
  column-gap: 12px;
  padding: 12px 0;
}

.interpretability-unified .holotype-program-swatch { width: 6px; grid-row: 1 / 3; }
.interpretability-unified .holotype-program-copy { grid-column: 2; grid-row: 1 / 3; }
.interpretability-unified .holotype-program-copy small { font-size: 10px; line-height: 1.45; }
.interpretability-unified .holotype-program-holotypes { grid-column: 3; grid-row: 1; }
.interpretability-unified .holotype-program-evidence { grid-column: 3; grid-row: 2; margin: 6px 0 0; padding: 0; }
.interpretability-unified .holotype-program-holotypes span,
.interpretability-unified .holotype-program-evidence span { font-size: 8px; }
.interpretability-unified .holotype-program-holotypes b,
.interpretability-unified .holotype-program-evidence b { font-size: 9px; overflow: visible; overflow-wrap: anywhere; }
.interpretability-unified .holotype-risk-path span { font-size: 8px; }
.interpretability-unified .holotype-risk-figure figcaption { font-size: 10px; line-height: 1.6; }

@media (max-width: 1100px) {
  .interpretability-unified .holotype-risk-layout { grid-template-columns: 1fr; }
  .interpretability-unified .holotype-panel-heading { min-height: 0; }
}

@media (max-width: 900px) {
  .interpretability-unified .holotype-risk-header { grid-template-columns: 1fr; gap: 24px; }
  .interpretability-unified .holotype-risk-header h3 { max-width: 660px; }
  .interpretability-unified .interpretability-decoder { width: min(100%, 620px); }
}

@media (max-width: 520px) {
  .interpretability-unified .interpretability-decoder {
    height: 192px;
    grid-template-columns: minmax(0, 1fr) 46px minmax(0, 1fr);
    gap: 5px;
  }
  .interpretability-unified .decoder-space { min-height: 0; padding: 12px; }
  .interpretability-unified .decoder-space > span { font-size: 7px; }
  .interpretability-unified .decoder-space > strong { font-size: 20px; line-height: 1.08; }
  .interpretability-unified .decoder-bridge { height: auto; flex-direction: column; }
  .interpretability-unified .decoder-bridge i { width: 1px; height: auto; }
  .interpretability-unified .decoder-bridge b { font-size: 7px; letter-spacing: 0; }
  .interpretability-unified .decoder-programs { gap: 7px; margin-top: 12px; }
  .interpretability-unified .decoder-programs small { font-size: 6px; letter-spacing: 0; }
  .interpretability-unified .latent-field { inset: 94px 10px 12px; }
  .interpretability-unified .holotype-risk-layout { margin-top: 24px; }
  .interpretability-unified .holotype-program-panel,
  .interpretability-unified .holotype-composition-panel { padding: 18px; }
  .interpretability-unified .holotype-program-item { grid-template-columns: 6px minmax(0, 1fr); row-gap: 6px; }
  .interpretability-unified .holotype-program-swatch { grid-row: 1 / 4; }
  .interpretability-unified .holotype-program-copy { grid-row: 1; }
  .interpretability-unified .holotype-program-holotypes { grid-column: 2; grid-row: 2; }
  .interpretability-unified .holotype-program-evidence { grid-column: 2; grid-row: 3; margin: 0; }
}