diff --git a/src/components/Edges/CustomEdge.tsx b/src/components/Edges/CustomEdge.tsx
index 2946dcc..18e83c9 100644
--- a/src/components/Edges/CustomEdge.tsx
+++ b/src/components/Edges/CustomEdge.tsx
@@ -237,7 +237,6 @@ const CustomEdge = ({
           strokeWidth,
           strokeDasharray,
           opacity: edgeOpacity,
-          transition: 'stroke-width 150ms ease-in-out',
         }}
         markerEnd={markerEnd}
         markerStart={markerStart}
diff --git a/src/components/Nodes/Shapes/CircleShape.tsx b/src/components/Nodes/Shapes/CircleShape.tsx
index 39360c4..515c827 100644
--- a/src/components/Nodes/Shapes/CircleShape.tsx
+++ b/src/components/Nodes/Shapes/CircleShape.tsx
@@ -21,20 +21,18 @@ const CircleShape = ({
   color,
   borderColor,
   textColor,
-  selected = false,
   isHighlighted = false,
   children,
   className = '',
 }: CircleShapeProps) => {
-  const shadowStyle = selected
-    ? `0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1), 0 0 0 3px ${color}40`
-    : isHighlighted
-      ? `0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1), 0 0 0 3px ${color}80, 0 0 12px ${color}60`
-      : '0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)';
+  // Simplified shadow for performance - single shadow instead of multiple layers
+  const shadowStyle = isHighlighted
+    ? `0 0 0 2px ${color}80` // Simple outline for highlight
+    : '0 2px 4px rgb(0 0 0 / 0.1)'; // Single lightweight shadow
 
   return (
     <div
-      className={`px-4 py-3 rounded-full min-w-[120px] flex items-center justify-center transition-shadow duration-200 ${className}`}
+      className={`px-4 py-3 rounded-full min-w-[120px] flex items-center justify-center ${className}`}
       style={{
         backgroundColor: color,
         borderWidth: '3px',
diff --git a/src/components/Nodes/Shapes/EllipseShape.tsx b/src/components/Nodes/Shapes/EllipseShape.tsx
index 04c9994..2fe2a47 100644
--- a/src/components/Nodes/Shapes/EllipseShape.tsx
+++ b/src/components/Nodes/Shapes/EllipseShape.tsx
@@ -21,20 +21,18 @@ const EllipseShape = ({
   color,
   borderColor,
   textColor,
-  selected = false,
   isHighlighted = false,
   children,
   className = '',
 }: EllipseShapeProps) => {
-  const shadowStyle = selected
-    ? `0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1), 0 0 0 3px ${color}40`
-    : isHighlighted
-      ? `0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1), 0 0 0 3px ${color}80, 0 0 12px ${color}60`
-      : '0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)';
+  // Simplified shadow for performance - single shadow instead of multiple layers
+  const shadowStyle = isHighlighted
+    ? `0 0 0 2px ${color}80` // Simple outline for highlight
+    : '0 2px 4px rgb(0 0 0 / 0.1)'; // Single lightweight shadow
 
   return (
     <div
-      className={`px-6 py-3 min-w-[140px] min-h-[80px] flex items-center justify-center transition-shadow duration-200 ${className}`}
+      className={`px-6 py-3 min-w-[140px] min-h-[80px] flex items-center justify-center ${className}`}
       style={{
         backgroundColor: color,
         borderWidth: '3px',
diff --git a/src/components/Nodes/Shapes/PillShape.tsx b/src/components/Nodes/Shapes/PillShape.tsx
index 060bda4..6781e38 100644
--- a/src/components/Nodes/Shapes/PillShape.tsx
+++ b/src/components/Nodes/Shapes/PillShape.tsx
@@ -21,20 +21,18 @@ const PillShape = ({
   color,
   borderColor,
   textColor,
-  selected = false,
   isHighlighted = false,
   children,
   className = '',
 }: PillShapeProps) => {
-  const shadowStyle = selected
-    ? `0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1), 0 0 0 3px ${color}40`
-    : isHighlighted
-      ? `0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1), 0 0 0 3px ${color}80, 0 0 12px ${color}60`
-      : '0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)';
+  // Simplified shadow for performance - single shadow instead of multiple layers
+  const shadowStyle = isHighlighted
+    ? `0 0 0 2px ${color}80` // Simple outline for highlight
+    : '0 2px 4px rgb(0 0 0 / 0.1)'; // Single lightweight shadow
 
   return (
     <div
-      className={`px-6 py-3 min-w-[120px] flex items-center justify-center transition-shadow duration-200 ${className}`}
+      className={`px-6 py-3 min-w-[120px] flex items-center justify-center ${className}`}
       style={{
         backgroundColor: color,
         borderWidth: '3px',
diff --git a/src/components/Nodes/Shapes/RectangleShape.tsx b/src/components/Nodes/Shapes/RectangleShape.tsx
index dd27338..1ab7541 100644
--- a/src/components/Nodes/Shapes/RectangleShape.tsx
+++ b/src/components/Nodes/Shapes/RectangleShape.tsx
@@ -20,21 +20,18 @@ const RectangleShape = ({
   color,
   borderColor,
   textColor,
-  selected = false,
   isHighlighted = false,
   children,
   className = '',
 }: RectangleShapeProps) => {
-  // Build shadow style
-  const shadowStyle = selected
-    ? `0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1), 0 0 0 3px ${color}40`
-    : isHighlighted
-      ? `0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1), 0 0 0 3px ${color}80, 0 0 12px ${color}60`
-      : '0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)';
+  // Simplified shadow for performance - single shadow instead of multiple layers
+  const shadowStyle = isHighlighted
+    ? `0 0 0 2px ${color}80` // Simple outline for highlight
+    : '0 2px 4px rgb(0 0 0 / 0.1)'; // Single lightweight shadow
 
   return (
     <div
-      className={`px-4 py-3 rounded-lg min-w-[120px] transition-shadow duration-200 ${className}`}
+      className={`px-4 py-3 rounded-lg min-w-[120px] ${className}`}
       style={{
         backgroundColor: color,
         borderWidth: '3px',
diff --git a/src/components/Nodes/Shapes/RoundedRectangleShape.tsx b/src/components/Nodes/Shapes/RoundedRectangleShape.tsx
index fcf211b..5b92c33 100644
--- a/src/components/Nodes/Shapes/RoundedRectangleShape.tsx
+++ b/src/components/Nodes/Shapes/RoundedRectangleShape.tsx
@@ -22,20 +22,18 @@ const RoundedRectangleShape = ({
   color,
   borderColor,
   textColor,
-  selected = false,
   isHighlighted = false,
   children,
   className = '',
 }: RoundedRectangleShapeProps) => {
-  const shadowStyle = selected
-    ? `0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1), 0 0 0 3px ${color}40`
-    : isHighlighted
-      ? `0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1), 0 0 0 3px ${color}80, 0 0 12px ${color}60`
-      : '0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)';
+  // Simplified shadow for performance - single shadow instead of multiple layers
+  const shadowStyle = isHighlighted
+    ? `0 0 0 2px ${color}80` // Simple outline for highlight
+    : '0 2px 4px rgb(0 0 0 / 0.1)'; // Single lightweight shadow
 
   return (
     <div
-      className={`px-4 py-3 min-w-[120px] transition-shadow duration-200 ${className}`}
+      className={`px-4 py-3 min-w-[120px] ${className}`}
       style={{
         backgroundColor: color,
         borderWidth: '3px',