/* The center gutter connects the actual extents of each changed block. */
#diff-output { --diff-gutter: 72px; }
#diff-output .diff-rows { position: relative; }
#diff-output .diff-connectors { display: none; pointer-events: none; }
#diff-output.diff-curved .diff-header,
#diff-output.diff-curved .diff-row {
  min-width: 772px;
  column-gap: var(--diff-gutter);
}
#diff-output.diff-curved .diff-rows { min-width: 772px; }
#diff-output.diff-curved .diff-cell + .diff-cell { border-left: 0; }
#diff-output.diff-curved .diff-header span + span { border-left: 0; }
#diff-output.diff-curved .diff-rows::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 50%;
  width: var(--diff-gutter);
  transform: translateX(-50%);
  background: #f1eee7;
  border-inline: 1px solid #dedbd2;
  box-sizing: border-box;
  pointer-events: none;
}
#diff-output.diff-curved .diff-connectors {
  display: block;
  position: absolute;
  top: 0;
  left: 50%;
  width: var(--diff-gutter);
  transform: translateX(-50%);
  overflow: hidden;
}
.diff-connector { fill: #e4def3; stroke: #a89ac9; stroke-width: 1; }
.diff-connector.added { fill: #e5f5e7; stroke: #87bb94; }
.diff-connector.removed { fill: #fae4df; stroke: #d7998d; }
.diff-connector.current { stroke: var(--tool-teal); stroke-width: 2; }
