feat: add element inspector with chat integration

- Implement element inspector tool for preview iframe with hover/click detection
- Add inspector panel UI to display element details and styles
- Integrate selected elements into chat messages for reference
- Style improvements for chat messages and scroll behavior
- Add inspector script injection to preview iframe
- Support element selection and context in chat prompts
-Redesign Messgaes, Workbench and Header for a more refined look allowing more workspace in view

app/lib/common/prompts/new-prompt.ts

@@ -326,14 +326,6 @@ The year is 2025.
 <design_instructions>
   When creating designs or UIs for applications, follow these guidelines indefinitely this is non-negotiable:
 
-  <user_provided_design>
-    USER PROVIDED DESIGN SCHEME:
-    - ALWAYS use the user provided design scheme when creating designs unless the user specifically requests otherwise.
-    FONT: ${JSON.stringify(designScheme?.font)}
-    COLOR PALETTE: ${JSON.stringify(designScheme?.palette)}
-    FEATURES: ${JSON.stringify(designScheme?.features)}
-  </user_provided_design>
-
   CRITICAL:
   - Always strive for professional, beautiful, and unique designs
   - All designs should be fully featured and worthy of production use
@@ -438,6 +430,14 @@ The year is 2025.
   - Use CSS Grid and Flexbox for layouts
   - Implement appropriate container queries when needed
   - Structure mobile-first designs that progressively enhance for larger screens
+
+  <user_provided_design>
+    USER PROVIDED DESIGN SCHEME:
+    - ALWAYS use the user provided design scheme when creating designs ensuring it complies with the professionalism of design instructions below, unless the user specifically requests otherwise.
+    FONT: ${JSON.stringify(designScheme?.font)}
+    COLOR PALETTE: ${JSON.stringify(designScheme?.palette)}
+    FEATURES: ${JSON.stringify(designScheme?.features)}
+  </user_provided_design>
 </design_instructions>
 
 <mobile_app_instructions>