cytoscape.js: How to prevent adjacent taxi edges from overlapping - cytoscape.js

Question

I'm attempting to use a Dagre layout and taxi edges in cytoscape.js to show how nodes connect to other nodes. However, in some cases, due to how the corners of the edges can overlap, it appears that a node has multiple parents, where it actually has only one.
I've tried changing some of the taxi style settings for the edges, but since those are applied to all edges, I still experience the same issue (just in a different spot). Is there a configuration setting I'm missing that will prevent these unrelated edges from overlapping? Barring that, is there a way to change, say, the taxi-turn setting for only some edges? (To make it more complex, this will need to work with arbitrary nodes/edges provided by a user, so I'm unable to handle specific, one-off issues.)
I've reproduced the issue here: https://stackblitz.com/edit/react-rj7ln4?file=index.js
Specifically, the edges in question are from the last two nodes in the first column.
Styles, including configuration for taxi settings
const styles = [
// disable the visible selector when clicking to pan
{
selector: "core",
style: {
"active-bg-opacity": 0
}
},
// basic styling for nodes
{
selector: "node",
style: {
"background-clip": "none",
shape: "rectangle",
"background-opacity": 0,
"font-family": "serif"
}
},
// disable overlay when clicking on nodes or edges
{
selector: "node, edge",
style: {
"overlay-opacity": 0.1
}
},
// basic styles for edges
{
selector: "edge, edge:selected",
style: {
"line-color": "rgb(143,156,173)",
"curve-style": "taxi",
"edge-distances": "node-position",
"taxi-direction": "horizontal",
"taxi-turn": "75%",
"taxi-turn-min-distance": "30px",
"target-endpoint": "outside-to-node",
"target-arrow-shape": "triangle",
"target-arrow-color": "rgb(143,156,173)",
"target-distance-from-node": 15
}
},
// hide the boundary around compound nodes
{
selector: "node:parent",
style: {
opacity: 0.91
}
}
];
Array of nodes and edges used to reproduce
const elements = [
{
data: {
id: "A",
title: "A"
}
},
{
data: {
id: "B",
title: "B"
}
},
{
data: {
id: "C",
title: "C"
}
},
{
data: {
id: "D",
title: "D"
}
},
{
data: {
id: "E",
title: "E"
}
},
{
data: {
id: "F",
title: "F"
}
},
{
data: {
id: "AD",
source: "A",
target: "D"
}
},
{
data: {
id: "BD",
source: "B",
target: "D"
}
},
{
data: {
id: "CE",
source: "C",
target: "E"
}
},
{
data: {
id: "DF",
source: "D",
target: "F"
}
},
{
data: {
id: "EF",
source: "E",
target: "F"
}
}
];
Cytoscape.js version: 3.10.0
Browsers & versions: Firefox 70.0.1 / Chrome 78.0.3904.97 on macOS 10.14.6