pragma-branch, pragma-expression-builder {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  background: var(--c-surface-bg);
}
pragma-branch > svg, pragma-expression-builder > svg {
  width: 100%;
  height: 100%;
  will-change: transform;
}
pragma-branch .node rect, pragma-expression-builder .node rect {
  height: 2rem;
  rx: 0.1875rem;
  ry: 0.1875rem;
  fill: var(--c-node-fill);
  stroke: var(--c-node-border);
}
pragma-branch .node text, pragma-expression-builder .node text {
  fill: var(--c-text);
  cursor: pointer;
  text-anchor: start;
}
pragma-branch .node .tree-button, pragma-expression-builder .node .tree-button {
  cursor: pointer;
  pointer-events: bounding-box;
  fill: var(--c-node-icon);
}
pragma-branch .node[aria-expanded=false]:hover > rect, pragma-branch .node[aria-expanded=false].selected:hover > rect, pragma-branch .node:hover > rect, pragma-branch .sub-node:hover > rect, pragma-branch .sub-node.selected:hover > rect, pragma-expression-builder .node[aria-expanded=false]:hover > rect, pragma-expression-builder .node[aria-expanded=false].selected:hover > rect, pragma-expression-builder .node:hover > rect, pragma-expression-builder .sub-node:hover > rect, pragma-expression-builder .sub-node.selected:hover > rect {
  fill: var(--c-hover);
}
pragma-branch .node[aria-expanded=false]:hover > text, pragma-branch .node[aria-expanded=false]:hover > svg, pragma-branch .node[aria-expanded=false].selected:hover > text, pragma-branch .node[aria-expanded=false].selected:hover > svg, pragma-branch .node:hover > text, pragma-branch .node:hover > svg, pragma-branch .sub-node:hover > text, pragma-branch .sub-node:hover > svg, pragma-branch .sub-node.selected:hover > text, pragma-branch .sub-node.selected:hover > svg, pragma-expression-builder .node[aria-expanded=false]:hover > text, pragma-expression-builder .node[aria-expanded=false]:hover > svg, pragma-expression-builder .node[aria-expanded=false].selected:hover > text, pragma-expression-builder .node[aria-expanded=false].selected:hover > svg, pragma-expression-builder .node:hover > text, pragma-expression-builder .node:hover > svg, pragma-expression-builder .sub-node:hover > text, pragma-expression-builder .sub-node:hover > svg, pragma-expression-builder .sub-node.selected:hover > text, pragma-expression-builder .sub-node.selected:hover > svg {
  fill: var(--c-text);
}
pragma-branch .node[aria-expanded=false]:hover > .node-separator, pragma-branch .node[aria-expanded=false].selected:hover > .node-separator, pragma-branch .node:hover > .node-separator, pragma-branch .sub-node:hover > .node-separator, pragma-branch .sub-node.selected:hover > .node-separator, pragma-expression-builder .node[aria-expanded=false]:hover > .node-separator, pragma-expression-builder .node[aria-expanded=false].selected:hover > .node-separator, pragma-expression-builder .node:hover > .node-separator, pragma-expression-builder .sub-node:hover > .node-separator, pragma-expression-builder .sub-node.selected:hover > .node-separator {
  stroke: var(--c-text);
  stroke-width: 1;
}
pragma-branch .link, pragma-expression-builder .link {
  fill: none;
  stroke: var(--c-node-line);
  stroke-width: 0.125rem;
}
pragma-branch .highlighted, pragma-expression-builder .highlighted {
  stroke: var(--c-focus);
  stroke-width: 0.25rem;
}
pragma-branch .focus rect, pragma-expression-builder .focus rect {
  fill: var(--c-node-active);
}