diff --git a/src/app/shared/nodes/resource-node/resource-node.css b/src/app/shared/nodes/resource-node/resource-node.css
index 8a938db..a6fd866 100644
--- a/src/app/shared/nodes/resource-node/resource-node.css
+++ b/src/app/shared/nodes/resource-node/resource-node.css
@@ -217,20 +217,28 @@
 }
 
 /*
- * The handle sits on the top edge, half outside: a resource usually lies under the steps that use
- * it, and its links rise to them rather than running along the chain.
+ * The handle is a bar along the whole top edge: a resource usually lies under the steps that use
+ * it, and its links rise to them from anywhere along it rather than from a point on a side.
  */
 .resource-card__link {
   position: absolute;
-  left: 50%;
-  top: -11px;
-  transform: translateX(-50%);
-  display: flex;
-  justify-content: center;
+  top: -5px;
+  left: 18px;
+  right: 18px;
+  height: 9px;
 }
 
 .resource-card__socket {
-  display: flex;
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+
+/* The socket sizes itself as a square; here it is stretched into the bar. */
+.resource-card__socket ::ng-deep > * {
+  width: 100% !important;
+  height: 9px !important;
+  border-radius: 999px !important;
 }
 
 .llm-spinner {
diff --git a/src/app/utilities/rete-editor.ts b/src/app/utilities/rete-editor.ts
index f4476f5..8508f03 100644
--- a/src/app/utilities/rete-editor.ts
+++ b/src/app/utilities/rete-editor.ts
@@ -10,6 +10,7 @@ import {
   Presets as ConnectionPresets
 } from "rete-connection-plugin";
 import { AngularPlugin, Presets, AngularArea2D } from "rete-angular-plugin/21";
+import { getDOMSocketPosition } from "rete-render-utils";
 import { HFNode, HFSchemes } from "@models/nodes";
 import {
   areFlowValueKindsCompatible,
@@ -123,6 +124,13 @@ export async function createEditor(
 
   render.addPreset(
     Presets.classic.setup({
+      // Rete pushes an output's anchor 12px past its socket, for a handle on a node's right side.
+      // A resource's handle is a bar along its top edge: its links start from the bar's middle.
+      socketPositionWatcher: getDOMSocketPosition<HFSchemes, any>({
+        offset: (position, _nodeId, side, key) => key === FLOW_RESOURCE_PORT_KEY
+          ? position
+          : { x: position.x + 12 * (side === 'input' ? -1 : 1), y: position.y }
+      }),
       customize: {
         node(context: any) {
           if (nodeView === "execution") return TaskStepNodeComponent;