
.node path { stroke: #333; fill: none; stroke-width: 1px; }
.node line { stroke: #333; fill: none; stroke-width: 1px; }

.node-control-dependency { stroke-dasharray: 4, 1; } 

.node-item path { stroke-width: 0; stroke: #000; fill: #fff; }
.node-item text { font-family: 'Open Sans', --apple-system, "Helvetica Neue", Helvetica, Arial, sans-serf; font-size: 10px; font-weight: 600;  text-rendering: geometricPrecision; }

.node-item-operator path { fill: #000; }
.node-item-operator text { fill: #fff; }
.node-item-operator:hover { cursor: hand; }
.node-item-operator:hover path { fill: #fff; }
.node-item-operator:hover text { fill: #000; }

.node-item-operator-constant path { fill: #eee; }
.node-item-operator-constant text { fill: #000; }
.node-item-operator-constant:hover path { fill: #fff; }

.node-item-operator-control path { fill: #eee; }
.node-item-operator-control text { fill: #000; }
.node-item-operator-control:hover path { fill: #fff; }

.node-item-operator-layer path { fill: #358; }
.node-item-operator-wrapper path { fill: #eee; }
.node-item-operator-wrapper text { fill: #000; }
.node-item-operator-activation path { fill: #4B1B16; }
.node-item-operator-pool path { fill: #353; }
.node-item-operator-normalization path { fill: #354; }
.node-item-operator-dropout path { fill: #454770; }
.node-item-operator-shape path { fill: #6C4F47; }
.node-item-operator-tensor path { fill: #59423B; }
.node-item-operator-transform path { fill: #354; }
.node-item-operator-data path { fill: #555; }

.node-item-input path { fill: #fff; }
.node-item-input:hover { cursor: hand; }
.node-item-input:hover path { fill: #fff; }

.node-item-constant path { fill: #eee; }
.node-item-constant:hover { cursor: hand; }
.node-item-constant:hover path { fill: #fff; }

.node-item-undefined path { fill: #f00; }
.node-item-undefined:hover { cursor: hand; }
.node-item-undefined:hover path { fill: #fff; }

.node-attribute:hover { cursor: hand; }
.node-attribute text { font-family: 'Open Sans', --apple-system, "Helvetica Neue", Helvetica, Arial, sans-serf; font-size: 7px; font-weight: normal; text-rendering: geometricPrecision; }
.node-attribute path { fill: #fff; stroke-width: 0; stroke: #000; }
.node-attribute:hover path { fill: #f6f6f6; }

.graph-item-input path { fill: #eee; }
.graph-item-input:hover { cursor: hand; }
.graph-item-input:hover path { fill: #fff; }

.graph-item-output path { fill: #eee; }
.graph-item-output:hover { cursor: hand; }
.graph-item-output:hover path { fill: #fff; }

.edge-label text { font-family: 'Open Sans', --apple-system, "Helvetica Neue", Helvetica, Arial, sans-serf; font-size: 10px; }
.edge-path { stroke: #000; stroke-width: 1px; fill: none; }

.cluster rect { stroke: #000; fill: #000; fill-opacity: 0.02; stroke-opacity: 0.06; stroke-width: 1px; }

.select .node.border { stroke: #333; stroke-width: 2px; stroke-dasharray: 6px 3px; stroke-dashoffset: 0; animation: pulse 4s infinite linear; }
.select.edge-path { stroke: #333; stroke-width: 2px; stroke-dasharray: 6px 3px; stroke-dashoffset: 0; animation: pulse 4s infinite linear; }

@keyframes pulse { from { stroke-dashoffset: 100px; } to { stroke-dashoffset: 0; } }
