feat: Phase 2 - LLM Integration for Canvas

- Add canvas.ts MCP tool with validate_canvas_intent, execute_canvas_intent, interpret_canvas_intent
- Add useCanvasChat.ts bridge hook connecting canvas to chat system
- Update context_builder.py with canvas tool instructions
- Add ExecuteDialog for study name input
- Add ChatPanel for canvas-integrated Claude responses
- Connect AtomizerCanvas to Claude via useCanvasChat

Canvas workflow now:
1. Build graph visually
2. Click Validate/Analyze/Execute
3. Claude processes intent via MCP tools
4. Response shown in integrated chat panel

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

atomizer-dashboard/frontend/src/components/canvas/panels/ExecuteDialog.tsx

@@ -0,0 +1,131 @@
+/**
+ * Execute Dialog - Prompts for study name before executing canvas intent
+ */
+
+import { useState } from 'react';
+
+interface ExecuteDialogProps {
+  isOpen: boolean;
+  onClose: () => void;
+  onExecute: (studyName: string, autoRun: boolean) => void;
+  isExecuting: boolean;
+}
+
+export function ExecuteDialog({
+  isOpen,
+  onClose,
+  onExecute,
+  isExecuting,
+}: ExecuteDialogProps) {
+  const [studyName, setStudyName] = useState('');
+  const [autoRun, setAutoRun] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+
+  if (!isOpen) return null;
+
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
+
+    // Validate study name
+    const trimmed = studyName.trim();
+    if (!trimmed) {
+      setError('Study name is required');
+      return;
+    }
+
+    // Check for valid snake_case
+    if (!/^[a-z][a-z0-9_]*$/.test(trimmed)) {
+      setError('Study name must be snake_case (lowercase letters, numbers, underscores)');
+      return;
+    }
+
+    setError(null);
+    onExecute(trimmed, autoRun);
+  };
+
+  const handleClose = () => {
+    setStudyName('');
+    setAutoRun(false);
+    setError(null);
+    onClose();
+  };
+
+  return (
+    <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
+      <div className="bg-white rounded-lg shadow-xl w-full max-w-md p-6">
+        <h2 className="text-xl font-semibold text-gray-800 mb-4">
+          Execute with Claude
+        </h2>
+
+        <form onSubmit={handleSubmit}>
+          <div className="mb-4">
+            <label
+              htmlFor="study-name"
+              className="block text-sm font-medium text-gray-600 mb-1"
+            >
+              Study Name
+            </label>
+            <input
+              id="study-name"
+              type="text"
+              value={studyName}
+              onChange={(e) => setStudyName(e.target.value.toLowerCase().replace(/\s+/g, '_'))}
+              placeholder="my_optimization_study"
+              className="w-full px-3 py-2 border rounded-lg font-mono focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
+              disabled={isExecuting}
+              autoFocus
+            />
+            {error && (
+              <p className="mt-1 text-sm text-red-600">{error}</p>
+            )}
+            <p className="mt-1 text-xs text-gray-500">
+              Use snake_case (e.g., bracket_mass_v1, mirror_wfe_optimization)
+            </p>
+          </div>
+
+          <div className="mb-6">
+            <label className="flex items-center gap-2">
+              <input
+                type="checkbox"
+                checked={autoRun}
+                onChange={(e) => setAutoRun(e.target.checked)}
+                disabled={isExecuting}
+                className="w-4 h-4"
+              />
+              <span className="text-sm text-gray-700">
+                Start optimization immediately after creation
+              </span>
+            </label>
+          </div>
+
+          <div className="flex gap-3 justify-end">
+            <button
+              type="button"
+              onClick={handleClose}
+              disabled={isExecuting}
+              className="px-4 py-2 text-gray-600 hover:text-gray-800 disabled:opacity-50"
+            >
+              Cancel
+            </button>
+            <button
+              type="submit"
+              disabled={isExecuting}
+              className="px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:opacity-50 disabled:cursor-not-allowed flex items-center gap-2"
+            >
+              {isExecuting ? (
+                <>
+                  <span className="animate-spin">⏳</span>
+                  Executing...
+                </>
+              ) : (
+                <>
+                  Send to Claude
+                </>
+              )}
+            </button>
+          </div>
+        </form>
+      </div>
+    </div>
+  );
+}