Constrain edge midpoint drag to edge normal direction

Instead of applying raw 2D delta, project cursor movement onto the
outward normal of each edge so the edge can only be pushed/pulled
perpendicular to itself. Prevents shearing when dragging a side handle.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

public/views/grid-setup.mjs

@@ -183,8 +183,18 @@ export class Grid_Setup {
 				this.#corners[i] = { x: this.#corners[i].x + dx, y: this.#corners[i].y + dy };
 			} else {
 				const [a, b] = Grid_Setup.#MIDPOINT_EDGES[this.#drag_idx - 4];
-				this.#corners[a] = { x: this.#corners[a].x + dx, y: this.#corners[a].y + dy };
+				// Project delta onto the edge's outward normal so the edge can
-				this.#corners[b] = { x: this.#corners[b].x + dx, y: this.#corners[b].y + dy };
+				// only be pushed/pulled perpendicular to itself — never sheared.
+				const ex = this.#corners[b].x - this.#corners[a].x;
+				const ey = this.#corners[b].y - this.#corners[a].y;
+				const len = Math.sqrt(ex*ex + ey*ey);
+				if (len > 0) {
+					const nx = -ey / len;
+					const ny =  ex / len;
+					const proj = dx * nx + dy * ny;
+					this.#corners[a] = { x: this.#corners[a].x + nx * proj, y: this.#corners[a].y + ny * proj };
+					this.#corners[b] = { x: this.#corners[b].x + nx * proj, y: this.#corners[b].y + ny * proj };
+				}
 			}
 			this.#drag_prev_img = img_pos;
 			this.#draw();