/* MOD-207-174-43: only the simple diagram consumes the existing card's space. */
.hp20742-home .hp20743-network {
  --flow-heading-gap: 24px;
  --flow-legend-gap: 20px;
  gap: 0;
  justify-content: flex-start;
}
.hp20742-home .hp20743-network > .hp207-scroll {
  display: flex;
  flex: 1 1 292px;
  min-height: 280px;
  margin-block: var(--flow-heading-gap) var(--flow-legend-gap);
}
.hp20742-home .hp20743-network .hp207-diagram {
  flex: 1 0 auto;
  width: 100%;
  height: auto;
  min-height: 280px;
}
.hp20742-home .hp20743-network .hp207-svg { height: 100%; }
.hp20742-home .hp20743-network .hp207-node { padding: 4px; gap: 3px; }
.hp20742-home .hp20743-network .hp207-node strong,
.hp20742-home .hp20743-network .hp207-node small { white-space: normal; overflow-wrap: anywhere; }
.hp20742-home .hp20743-network .hp207-zone h3 { position: absolute; margin: 0; line-height: 18px; }
.hp20742-home .hp20743-network .hp207-backup-group h4 { position: absolute; inset-inline: 0; margin: 0; line-height: 18px; }
/* The existing selection area keeps the maximum real text height at every
   width/font size. Only its contents/paint change; no fixed pixel spacer. */
.hp20742-home .hp20743-network .hp207-selection { margin-top: 10px; background: transparent; }
.hp20742-home .hp20743-network .hp207-selection[data-selected] { background: #edf5ff; }
.hp20742-home .hp20743-network [data-simple-description] { display: grid; }
.hp20742-home .hp20743-network [data-description-for] { grid-area: 1 / 1; visibility: hidden; }
.hp20742-home .hp20743-network [data-description-for][aria-hidden="false"] { visibility: visible; }
.hp20742-home .hp20743-network .hp207-selection:not([data-selected]) [data-simple-detail] { visibility: hidden; }
.hp20742-home .hp20743-network .hp207-scroll-hint { margin-top: 10px; }

/* Use the shared row budget before first paint. Intrinsic description growth
   must not feed back into the diagram's margins on shorter screens. */
@media (min-width: 1200px) and (min-height: 700px) {
  .hp20742-home .hp20743-network {
    --flow-heading-gap: clamp(10px, calc(10px + (var(--hp42-row) - 411px) * .10), 30px);
    --flow-legend-gap: clamp(10px, calc(10px + (var(--hp42-row) - 411px) * .08), 26px);
  }
}