fix: resolve 7 critical UI issues - charts, layouts, and mobile responsiveness

This commit fixes all reported UI issues across the dashboard:

## Issue 1: Chart Colors and Tooltips ✅
- Create chartColors utility with static hex colors for Recharts compatibility
- Replace CSS variable colors (hsl(var(--))) with hex colors in all charts
- Add custom tooltip styling with dark background and white text for readability
- Fixes: ProcessStateChart, ProcessUptimeChart, GroupStatistics

## Issue 2: Process Card Heights ✅
- Add h-full and flex flex-col to ProcessCard component
- Add auto-rows-fr to process grid layout
- Ensures all cards have consistent heights regardless of content

## Issue 3: Batch Actions Button Labels ✅
- Simplify button labels from "Start Selected" to "Start"
- Remove "Stop Selected" to "Stop", "Restart Selected" to "Restart"
- Labels now always visible on all screen sizes

## Issue 4: Mobile Menu Background ✅
- Change mobile menu from semi-transparent (bg-background/95) to solid (bg-background)
- Removes backdrop blur for better visibility

## Issue 5: Group Header Button Overflow ✅
- Add flex-wrap to button container in GroupCard
- Stack buttons vertically on mobile (flex-col md:flex-row)
- Buttons take full width on mobile, auto width on desktop

## Issue 6: Logs Search Input Overflow ✅
- Change LogSearch from max-w-md to w-full sm:flex-1 sm:max-w-md
- Search input now full width on mobile, constrained on desktop

## Issue 7: Logs Action Button Overflow ✅
- Add flex-wrap to LogControls button container
- Buttons wrap to new row when space is limited

🤖 Generated with [Claude Code](https://claude.com/claude-code)

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

components/process/BatchActions.tsx

@@ -82,7 +82,7 @@ export function BatchActions({ selectedProcesses, processes, onClearSelection }:
               className="gap-2 flex-1 sm:flex-initial"
             >
               <Play className="h-4 w-4" />
-              <span className="hidden sm:inline">Start Selected</span>
+              <span>Start</span>
             </Button>
             <Button
               variant="destructive"
@@ -92,7 +92,7 @@ export function BatchActions({ selectedProcesses, processes, onClearSelection }:
               className="gap-2 flex-1 sm:flex-initial"
             >
               <Square className="h-4 w-4" />
-              <span className="hidden sm:inline">Stop Selected</span>
+              <span>Stop</span>
             </Button>
             <Button
               variant="outline"
@@ -102,7 +102,7 @@ export function BatchActions({ selectedProcesses, processes, onClearSelection }:
               className="gap-2 flex-1 sm:flex-initial"
             >
               <RotateCw className={cn('h-4 w-4', isLoading && 'animate-spin')} />
-              <span className="hidden sm:inline">Restart Selected</span>
+              <span>Restart</span>
             </Button>
           </div>
 

components/process/ProcessCard.tsx

@@ -42,7 +42,7 @@ export function ProcessCard({ process, isSelected = false, isFocused = false, on
   return (
     <Card
       className={cn(
-        'transition-all hover:shadow-lg animate-fade-in',
+        'transition-all hover:shadow-lg animate-fade-in h-full flex flex-col',
         onSelectionChange && 'cursor-pointer',
         isSelected && 'ring-2 ring-primary ring-offset-2',
         isFocused && 'ring-2 ring-accent ring-offset-2 shadow-xl'
@@ -82,7 +82,7 @@ export function ProcessCard({ process, isSelected = false, isFocused = false, on
         </div>
       </CardHeader>
 
-      <CardContent className="space-y-4">
+      <CardContent className="space-y-4 flex-1 flex flex-col justify-between">
         {/* Metrics */}
         <div className="grid grid-cols-2 gap-3 text-sm">
           <div>