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/groups/GroupCard.tsx

@@ -49,7 +49,7 @@ export function GroupCard({ groupName, processes }: GroupCardProps) {
   return (
     <Card className="overflow-hidden">
       <CardHeader className="pb-3">
-        <div className="flex items-center justify-between">
+        <div className="flex flex-col md:flex-row items-start md:items-center gap-3 md:justify-between">
           <div className="flex items-center gap-3 flex-1">
             <Button
               variant="ghost"
@@ -80,13 +80,13 @@ export function GroupCard({ groupName, processes }: GroupCardProps) {
             </div>
           </div>
 
-          <div className="flex gap-2">
+          <div className="flex flex-wrap gap-2 w-full md:w-auto">
             <Button
               variant="success"
               size="sm"
               onClick={handleStart}
               disabled={isLoading || stats.stopped === 0}
-              className="gap-2"
+              className="gap-2 flex-1 sm:flex-initial"
             >
               <Play className="h-4 w-4" />
               Start All
@@ -96,7 +96,7 @@ export function GroupCard({ groupName, processes }: GroupCardProps) {
               size="sm"
               onClick={handleStop}
               disabled={isLoading || stats.running === 0}
-              className="gap-2"
+              className="gap-2 flex-1 sm:flex-initial"
             >
               <Square className="h-4 w-4" />
               Stop All
@@ -106,7 +106,7 @@ export function GroupCard({ groupName, processes }: GroupCardProps) {
               size="sm"
               onClick={handleRestart}
               disabled={isLoading}
-              className="gap-2"
+              className="gap-2 flex-1 sm:flex-initial"
             >
               <RotateCw className={cn('h-4 w-4', isLoading && 'animate-spin')} />
               Restart All