refactor(ui): migrate to shadcn/ui components and fix scroll issues

Migrate UI component library from custom implementations to shadcn/ui:
- Add shadcn/ui primitives (Button, Card, Dialog, Input, etc.)
- Replace custom styles with Tailwind CSS v4 theme configuration
- Remove custom-theme.css in favor of globals.css with @theme directive

Fix scroll overflow issues in multiple components:
- ProjectSelector: "New Project" button no longer overlays project list
- FolderBrowser: folder list now scrolls properly within modal
- AgentCard: log modal content stays within bounds
- ConversationHistory: conversation list scrolls correctly
- KanbanColumn: feature cards scroll within fixed height
- ScheduleModal: schedule form content scrolls properly

Key technical changes:
- Replace ScrollArea component with native overflow-y-auto divs
- Add min-h-0 to flex containers to allow proper shrinking
- Restructure dropdown layouts with flex-col for fixed footers

New files:
- ui/components.json (shadcn/ui configuration)
- ui/src/components/ui/* (20 UI primitive components)
- ui/src/lib/utils.ts (cn utility for class merging)
- ui/tsconfig.app.json (app-specific TypeScript config)

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

ui/src/components/ProgressDashboard.tsx

@@ -1,4 +1,6 @@
 import { Wifi, WifiOff } from 'lucide-react'
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
+import { Badge } from '@/components/ui/badge'
 
 interface ProgressDashboardProps {
   passing: number
@@ -14,66 +16,68 @@ export function ProgressDashboard({
   isConnected,
 }: ProgressDashboardProps) {
   return (
-    <div className="neo-card p-6">
-      <div className="flex items-center justify-between mb-4">
-        <h2 className="font-display text-xl font-bold uppercase">
+    <Card>
+      <CardHeader className="flex-row items-center justify-between space-y-0 pb-4">
+        <CardTitle className="text-xl uppercase tracking-wide">
           Progress
-        </h2>
-        <div className="flex items-center gap-2">
+        </CardTitle>
+        <Badge variant={isConnected ? 'default' : 'destructive'} className="gap-1">
           {isConnected ? (
             <>
-              <Wifi size={16} className="text-[var(--color-neo-done)]" />
-              <span className="text-sm text-[var(--color-neo-done)]">Live</span>
+              <Wifi size={14} />
+              Live
             </>
           ) : (
             <>
-              <WifiOff size={16} className="text-[var(--color-neo-danger)]" />
-              <span className="text-sm text-[var(--color-neo-danger)]">Offline</span>
+              <WifiOff size={14} />
+              Offline
             </>
           )}
-        </div>
-      </div>
+        </Badge>
+      </CardHeader>
 
-      {/* Large Percentage */}
-      <div className="text-center mb-6">
-        <span className="inline-flex items-baseline">
-          <span className="font-display text-6xl font-bold">
-            {percentage.toFixed(1)}
-          </span>
-          <span className="font-display text-3xl font-bold text-[var(--color-neo-text-secondary)]">
-            %
-          </span>
-        </span>
-      </div>
-
-      {/* Progress Bar */}
-      <div className="neo-progress mb-4">
-        <div
-          className="neo-progress-fill"
-          style={{ width: `${percentage}%` }}
-        />
-      </div>
-
-      {/* Stats */}
-      <div className="flex justify-center gap-8 text-center">
-        <div>
-          <span className="font-mono text-3xl font-bold text-[var(--color-neo-done)]">
-            {passing}
-          </span>
-          <span className="block text-sm text-[var(--color-neo-text-secondary)] uppercase">
-            Passing
+      <CardContent>
+        {/* Large Percentage */}
+        <div className="text-center mb-6">
+          <span className="inline-flex items-baseline">
+            <span className="text-6xl font-bold tabular-nums">
+              {percentage.toFixed(1)}
+            </span>
+            <span className="text-3xl font-semibold text-muted-foreground">
+              %
+            </span>
           </span>
         </div>
-        <div className="text-4xl text-[var(--color-neo-text-secondary)]">/</div>
-        <div>
-          <span className="font-mono text-3xl font-bold">
-            {total}
-          </span>
-          <span className="block text-sm text-[var(--color-neo-text-secondary)] uppercase">
-            Total
-          </span>
+
+        {/* Progress Bar */}
+        <div className="h-3 bg-muted rounded-full overflow-hidden mb-6">
+          <div
+            className="h-full bg-primary rounded-full transition-all duration-500 ease-out"
+            style={{ width: `${percentage}%` }}
+          />
         </div>
-      </div>
-    </div>
+
+        {/* Stats */}
+        <div className="flex justify-center gap-8 text-center">
+          <div>
+            <span className="font-mono text-3xl font-bold text-primary">
+              {passing}
+            </span>
+            <span className="block text-sm text-muted-foreground uppercase">
+              Passing
+            </span>
+          </div>
+          <div className="text-4xl text-muted-foreground">/</div>
+          <div>
+            <span className="font-mono text-3xl font-bold">
+              {total}
+            </span>
+            <span className="block text-sm text-muted-foreground uppercase">
+              Total
+            </span>
+          </div>
+        </div>
+      </CardContent>
+    </Card>
   )
 }