feat(cli): add settings file support for builtin Claude

- Enhance CLI status rendering to display settings file information for builtin Claude.
- Introduce settings file input in CLI manager for configuring the path to settings.json.
- Update Claude CLI tool interface to include settingsFile property.
- Implement settings file resolution and validation in CLI executor.
- Create a new collaborative planning workflow command with detailed documentation.
- Add test scripts for debugging tool configuration and command building.

ccw/src/templates/dashboard-js/components/cli-status.js

@@ -525,6 +525,33 @@ function renderCliStatus() {
     const enabledCliSettings = isClaude ? cliSettingsEndpoints.filter(ep => ep.enabled) : [];
     const hasCliSettings = enabledCliSettings.length > 0;
 
+    // Build Settings File info for builtin Claude
+    let settingsFileInfo = '';
+    if (isClaude && config.type === 'builtin' && config.settingsFile) {
+      const settingsFile = config.settingsFile;
+      // Simple path resolution attempt for display (no actual filesystem access)
+      const resolvedPath = settingsFile.startsWith('~')
+        ? settingsFile.replace('~', (typeof os !== 'undefined' && os.homedir) ? os.homedir() : '~')
+        : settingsFile;
+
+      settingsFileInfo = `
+        <div class="cli-settings-info mt-2 p-2 rounded bg-muted/50 text-xs">
+          <div class="flex items-center gap-1 text-muted-foreground mb-1">
+            <i data-lucide="file-key" class="w-3 h-3"></i>
+            <span>Settings File:</span>
+          </div>
+          <div class="text-foreground font-mono text-[10px] break-all" title="${resolvedPath}">
+            ${settingsFile}
+          </div>
+          ${settingsFile !== resolvedPath ? `
+            <div class="text-muted-foreground mt-1 font-mono text-[10px] break-all">
+              → ${resolvedPath}
+            </div>
+          ` : ''}
+        </div>
+      `;
+    }
+
     // Build CLI Settings badge for Claude
     let cliSettingsBadge = '';
     if (isClaude && hasCliSettings) {
@@ -588,6 +615,7 @@ function renderCliStatus() {
             }
           </div>
         </div>
+        ${settingsFileInfo}
         ${cliSettingsInfo}
         <div class="cli-tool-actions mt-3 flex gap-2">
           ${isAvailable ? (isEnabled

ccw/src/templates/dashboard-js/views/cli-manager.js

@@ -562,6 +562,27 @@ function buildToolConfigModalContent(tool, config, models, status) {
     '</div>'
     ) : '') +
 
+    // Claude Settings File Section (only for builtin claude type)
+    (tool === 'claude' && config.type === 'builtin' ? (
+    '<div class="tool-config-section">' +
+      '<h4><i data-lucide="file-key" class="w-3.5 h-3.5"></i> Settings File <span class="text-muted">(optional)</span></h4>' +
+      '<div class="env-file-input-group">' +
+        '<div class="env-file-input-row">' +
+          '<input type="text" id="claudeSettingsFileInput" class="tool-config-input" ' +
+            'placeholder="~/path/to/settings.json or D:\\path\\to\\settings.json" ' +
+            'value="' + (config.settingsFile ? escapeHtml(config.settingsFile) : '') + '" />' +
+          '<button type="button" class="btn-sm btn-outline" id="claudeSettingsFileBrowseBtn">' +
+            '<i data-lucide="folder-open" class="w-3.5 h-3.5"></i> Browse' +
+          '</button>' +
+        '</div>' +
+        '<p class="env-file-hint">' +
+          '<i data-lucide="info" class="w-3 h-3"></i> ' +
+          'Path to Claude CLI settings.json file (supports ~, absolute, and Windows paths)' +
+        '</p>' +
+      '</div>' +
+    '</div>'
+    ) : '') +
+
     // Footer
     '<div class="tool-config-footer">' +
       '<button class="btn btn-outline" onclick="closeModal()">' + t('common.cancel') + '</button>' +
@@ -1124,6 +1145,10 @@ function initToolConfigModalEvents(tool, currentConfig, models) {
       var envFileInput = document.getElementById('envFileInput');
       var envFile = envFileInput ? envFileInput.value.trim() : '';
 
+      // Get settingsFile value (only for builtin claude)
+      var claudeSettingsFileInput = document.getElementById('claudeSettingsFileInput');
+      var settingsFile = claudeSettingsFileInput ? claudeSettingsFileInput.value.trim() : '';
+
       try {
         var updateData = {
           primaryModel: primaryModel,
@@ -1137,6 +1162,11 @@ function initToolConfigModalEvents(tool, currentConfig, models) {
           updateData.envFile = envFile || null;
         }
 
+        // Only include settingsFile for builtin claude tool
+        if (tool === 'claude' && config.type === 'builtin') {
+          updateData.settingsFile = settingsFile || null;
+        }
+
         await updateCliToolConfig(tool, updateData);
         // Reload config to reflect changes
         await loadCliToolConfig();
@@ -1164,6 +1194,20 @@ function initToolConfigModalEvents(tool, currentConfig, models) {
     };
   }
 
+  // Claude Settings File browse button (only for builtin claude)
+  var claudeSettingsFileBrowseBtn = document.getElementById('claudeSettingsFileBrowseBtn');
+  if (claudeSettingsFileBrowseBtn) {
+    claudeSettingsFileBrowseBtn.onclick = function() {
+      showFileBrowserModal(function(selectedPath) {
+        var claudeSettingsFileInput = document.getElementById('claudeSettingsFileInput');
+        if (claudeSettingsFileInput && selectedPath) {
+          claudeSettingsFileInput.value = selectedPath;
+          claudeSettingsFileInput.focus();
+        }
+      });
+    };
+  }
+
   // Initialize lucide icons in modal
   if (window.lucide) lucide.createIcons();
 }