diff --git a/frontend/src/lib/components/canvas/Canvas.svelte b/frontend/src/lib/components/canvas/Canvas.svelte
index 867bbe7..808a2c2 100644
--- a/frontend/src/lib/components/canvas/Canvas.svelte
+++ b/frontend/src/lib/components/canvas/Canvas.svelte
@@ -63,6 +63,8 @@
 	let isLassoing = $state(false);
 	let spaceHeld = $state(false);
 	let dragTargetId: string | null = null;
+	let topZCounter = $state(1);
+	let zOrderMap = $state(new Map<string, number>());
 	let dragStartWorld = { x: 0, y: 0 };
 	let dragObjectStart = { x: 0, y: 0 };
 	let dragGroupStarts = new Map<string, { x: number; y: number }>();
@@ -212,6 +214,13 @@
 				}
 				onSelectionChange?.([...selectedIds]);
 
+				// Bring to front
+				topZCounter++;
+				zOrderMap = new Map(zOrderMap);
+				for (const sid of selectedIds) {
+					zOrderMap.set(sid, topZCounter);
+				}
+
 				// Record start positions for all selected objects (group drag)
 				dragGroupStarts = new Map();
 				for (const sid of selectedIds) {
@@ -506,7 +515,7 @@
 				style:top="{obj.y}px"
 				style:width="{obj.width}px"
 				style:height="{obj.height}px"
-				style:z-index={selectedIds.has(obj.id) ? 10 : 1}
+				style:z-index={zOrderMap.get(obj.id) ?? 1}
 			>
 				{@render renderObject(obj)}
 			</div>