Refactor robotic arm simulation components

- Updated MachineInstances to utilize the machine store for rendering multiple MachineInstance components.
- Enhanced Machine component to include machine state management and logging.
- Refactored RoboticArmAnimator for improved path handling and animation logic.
- Modified RoboticArmInstance to streamline state management and integrate with the updated animator.
- Improved IKInstance to support armBot state and interaction.
- Adjusted RoboticArm to dynamically load armBots based on selected products and events.
- Cleaned up unused code and improved overall readability and maintainability.

app/src/styles/components/simulation/analysis.scss

@@ -51,7 +51,8 @@
 
         .sub-header {
           font-size: var(--font-size-tiny);
-          color: var(--text-button-color);
+          color: var(--text-color);
+          opacity: 0.8;
         }
       }
 
@@ -233,6 +234,7 @@
               width: 100%;
               gap: 6px;
               padding-top: 3px;
+
               .shift-wrapper {
                 display: flex;
                 align-items: center;
@@ -276,6 +278,11 @@
     }
   }
 
+  .roiSummary-container {
+    max-height: 60vh;
+    overflow-y: auto;
+  }
+
   .roiSummary-wrapper {
     max-width: 470px;
     background-color: var(--background-color);
@@ -376,8 +383,8 @@
           gap: 6px;
 
           .metric-item {
-            border-radius: #{$border-radius-large};
-            background-color: var(--background-color);
+            border-radius: #{$border-radius-small};
+            background: var(--background-color);
             border: 1px solid var(--border-color);
           }
         }
@@ -385,7 +392,7 @@
     }
 
     .cost-breakdown {
-      background-color: var(--background-color);
+      background: var(--background-color);
       border: 1px solid var(--border-color);
       border-radius: #{$border-radius-extra-large};
       padding: 16px;