feat(cli-stream): add search functionality and improve validation in CLI Stream Viewer

ccw/src/templates/dashboard-css/33-cli-stream-viewer.css

@@ -234,19 +234,25 @@
   color: hsl(var(--muted-foreground));
   cursor: pointer;
   white-space: nowrap;
-  transition: all 0.15s;
+  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
 }
 
 .cli-stream-tab:hover {
   background: hsl(var(--hover));
   color: hsl(var(--foreground));
+  transform: translateY(-1px);
 }
 
 .cli-stream-tab.active {
   background: hsl(var(--card));
   border-color: hsl(var(--primary));
   color: hsl(var(--foreground));
-  box-shadow: 0 1px 3px rgb(0 0 0 / 0.1);
+  box-shadow: 0 2px 8px rgb(0 0 0 / 0.15);
+  transform: translateY(-1px);
+}
+
+.cli-stream-tab.active .cli-stream-tab-tool {
+  color: hsl(var(--primary));
 }
 
 .cli-stream-tab-status {
@@ -379,7 +385,13 @@
   white-space: pre-wrap;
   word-break: break-all;
   margin: 0;
-  padding: 0;
+  padding: 2px 0;
+  border-radius: 2px;
+  transition: background-color 0.15s;
+}
+
+.cli-stream-line:hover {
+  background: hsl(0 0% 100% / 0.03);
 }
 
 .cli-stream-line.stdout {
@@ -388,17 +400,33 @@
 
 .cli-stream-line.stderr {
   color: hsl(8 75% 65%);
+  background: hsl(8 75% 65% / 0.05);
 }
 
 .cli-stream-line.system {
   color: hsl(210 80% 65%);
   font-style: italic;
+  padding-left: 8px;
+  border-left: 2px solid hsl(210 80% 65% / 0.5);
 }
 
 .cli-stream-line.info {
   color: hsl(200 80% 70%);
 }
 
+/* JSON/Code syntax coloring in output */
+.cli-stream-line .json-key {
+  color: hsl(200 80% 70%);
+}
+
+.cli-stream-line .json-string {
+  color: hsl(100 50% 60%);
+}
+
+.cli-stream-line .json-number {
+  color: hsl(40 80% 65%);
+}
+
 /* Search highlight */
 .cli-stream-highlight {
   background: hsl(50 100% 50% / 0.4);

ccw/src/templates/dashboard-js/components/cli-stream-viewer.js

@@ -17,10 +17,23 @@ function initCliStreamViewer() {
   // Initialize keyboard shortcuts
   document.addEventListener('keydown', function(e) {
     if (e.key === 'Escape' && isCliStreamViewerOpen) {
-      toggleCliStreamViewer();
+      if (searchFilter) {
+        clearSearch();
+      } else {
+        toggleCliStreamViewer();
+      }
+    }
+    // Ctrl+F to focus search when viewer is open
+    if ((e.ctrlKey || e.metaKey) && e.key === 'f' && isCliStreamViewerOpen) {
+      e.preventDefault();
+      const searchInput = document.getElementById('cliStreamSearchInput');
+      if (searchInput) {
+        searchInput.focus();
+        searchInput.select();
+      }
     }
   });
-  
+
   // Initialize scroll detection for auto-scroll
   const content = document.getElementById('cliStreamContent');
   if (content) {
@@ -491,7 +504,9 @@ function _streamT(key) {
     'cliStream.autoScroll': 'Auto-scroll',
     'cliStream.close': 'Close',
     'cliStream.cannotCloseRunning': 'Cannot close running execution',
-    'cliStream.lines': 'lines'
+    'cliStream.lines': 'lines',
+    'cliStream.searchPlaceholder': 'Search output...',
+    'cliStream.filterResults': 'results'
   };
   return fallbacks[key] || key;
 }

ccw/src/templates/dashboard-js/i18n.js

@@ -55,6 +55,8 @@ const i18n = {
     'cliStream.close': 'Close',
     'cliStream.cannotCloseRunning': 'Cannot close running execution',
     'cliStream.lines': 'lines',
+    'cliStream.searchPlaceholder': 'Search output...',
+    'cliStream.filterResults': 'results',
 
     // Sidebar - Project section
     'nav.project': 'Project',
@@ -1975,6 +1977,8 @@ const i18n = {
     'cliStream.close': '关闭',
     'cliStream.cannotCloseRunning': '无法关闭运行中的执行',
     'cliStream.lines': '行',
+    'cliStream.searchPlaceholder': '搜索输出...',
+    'cliStream.filterResults': '条结果',
 
     // Sidebar - Project section
     'nav.project': '项目',

ccw/src/templates/dashboard.html

@@ -618,6 +618,16 @@
         <span data-i18n="cliStream.title">CLI Stream</span>
         <span class="cli-stream-count-badge" id="cliStreamCountBadge">0</span>
       </div>
+      <div class="cli-stream-search">
+        <i data-lucide="search" class="cli-stream-search-icon"></i>
+        <input type="text"
+               id="cliStreamSearchInput"
+               class="cli-stream-search-input"
+               placeholder="Search output..."
+               oninput="handleSearchInput(event)"
+               data-i18n-placeholder="cliStream.searchPlaceholder">
+        <button class="cli-stream-search-clear" onclick="clearSearch()" title="Clear search">&times;</button>
+      </div>
       <div class="cli-stream-actions">
         <button class="cli-stream-action-btn" onclick="clearCompletedStreams()" data-i18n="cliStream.clearCompleted">
           <i data-lucide="trash-2"></i>