/* React Flow 11.11.4 base + default theme (dist/style.css), vendored locally
   so the Skill Builder never depends on a runtime CDN fetch. Source:
   https://unpkg.com/reactflow@11.11.4/dist/style.css — our token theming lives
   in styles/components/skill-builder.css and overrides the visual defaults. */
.react-flow { direction: ltr; }
.react-flow__container { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
.react-flow__pane { z-index: 1; cursor: grab; }
.react-flow__pane.selection { cursor: pointer; }
.react-flow__pane.dragging { cursor: grabbing; }
.react-flow__viewport { transform-origin: 0 0; z-index: 2; pointer-events: none; }
.react-flow__renderer { z-index: 4; }
.react-flow__selection { z-index: 6; }
.react-flow__nodesselection-rect:focus,
.react-flow__nodesselection-rect:focus-visible { outline: none; }
.react-flow .react-flow__edges { pointer-events: none; overflow: visible; }
.react-flow__edge-path,
.react-flow__connection-path { stroke: #b1b1b7; stroke-width: 1; fill: none; }
.react-flow__edge { pointer-events: visibleStroke; cursor: pointer; }
.react-flow__edge.animated path { stroke-dasharray: 5; animation: dashdraw 0.5s linear infinite; }
.react-flow__edge.animated path.react-flow__edge-interaction { stroke-dasharray: none; animation: none; }
.react-flow__edge.inactive { pointer-events: none; }
.react-flow__edge.selected,
.react-flow__edge:focus,
.react-flow__edge:focus-visible { outline: none; }
.react-flow__edge.selected .react-flow__edge-path,
.react-flow__edge:focus .react-flow__edge-path,
.react-flow__edge:focus-visible .react-flow__edge-path { stroke: #555; }
.react-flow__edge-textwrapper { pointer-events: all; }
.react-flow__edge-textbg { fill: white; }
.react-flow__edge .react-flow__edge-text { pointer-events: none; user-select: none; }
.react-flow__connection { pointer-events: none; }
.react-flow__connection .animated { stroke-dasharray: 5; animation: dashdraw 0.5s linear infinite; }
.react-flow__connectionline { z-index: 1001; }
.react-flow__nodes { pointer-events: none; transform-origin: 0 0; }
.react-flow__node { position: absolute; user-select: none; pointer-events: all; transform-origin: 0 0; box-sizing: border-box; cursor: grab; }
.react-flow__node.dragging { cursor: grabbing; }
.react-flow__nodesselection { z-index: 3; transform-origin: left top; pointer-events: none; }
.react-flow__nodesselection-rect { position: absolute; pointer-events: all; cursor: grab; }
.react-flow__handle { position: absolute; pointer-events: none; min-width: 5px; min-height: 5px; width: 6px; height: 6px; background: #1a192b; border: 1px solid white; border-radius: 100%; }
.react-flow__handle.connectionindicator { pointer-events: all; cursor: crosshair; }
.react-flow__handle-bottom { top: auto; left: 50%; bottom: -4px; transform: translate(-50%, 0); }
.react-flow__handle-top { left: 50%; top: -4px; transform: translate(-50%, 0); }
.react-flow__handle-left { top: 50%; left: -4px; transform: translate(0, -50%); }
.react-flow__handle-right { right: -4px; top: 50%; transform: translate(0, -50%); }
.react-flow__edgeupdater { cursor: move; pointer-events: all; }
.react-flow__panel { position: absolute; z-index: 5; margin: 15px; }
.react-flow__panel.top { top: 0; }
.react-flow__panel.bottom { bottom: 0; }
.react-flow__panel.left { left: 0; }
.react-flow__panel.right { right: 0; }
.react-flow__panel.center { left: 50%; transform: translateX(-50%); }
.react-flow__attribution { font-size: 10px; background: rgba(255, 255, 255, 0.5); padding: 2px 3px; margin: 0; }
.react-flow__attribution a { text-decoration: none; color: #999; }
@keyframes dashdraw { from { stroke-dashoffset: 10; } }
.react-flow__edgelabel-renderer { position: absolute; width: 100%; height: 100%; pointer-events: none; user-select: none; }
.react-flow__edge.updating .react-flow__edge-path { stroke: #777; }
.react-flow__edge-text { font-size: 10px; }
.react-flow__node.selectable:focus,
.react-flow__node.selectable:focus-visible { outline: none; }
.react-flow__node-default,
.react-flow__node-input,
.react-flow__node-output,
.react-flow__node-group { padding: 10px; border-radius: 3px; width: 150px; font-size: 12px; color: #222; text-align: center; border-width: 1px; border-style: solid; border-color: #1a192b; background-color: white; }
.react-flow__nodesselection-rect,
.react-flow__selection { background: rgba(0, 89, 220, 0.08); border: 1px dotted rgba(0, 89, 220, 0.8); }
.react-flow__controls { box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.08); }
.react-flow__controls-button { border: none; background: #fefefe; border-bottom: 1px solid #eee; box-sizing: content-box; display: flex; justify-content: center; align-items: center; width: 16px; height: 16px; cursor: pointer; user-select: none; padding: 5px; }
.react-flow__controls-button svg { width: 100%; max-width: 12px; max-height: 12px; }
.react-flow__minimap { background-color: #fff; }
.react-flow__minimap svg { display: block; }