Cleanup after initial plan

packages/web/src/components/__tests__/ThemeProvider.test.tsx

@@ -78,7 +78,7 @@ describe('ThemeProvider', () => {
 
     expect(screen.getByTestId('accent').textContent).toBe('cobalt');
     expect(localStorage.getItem('mt-accent')).toBe('cobalt');
-    expect(document.documentElement.style.getPropertyValue('--brand')).toBe('#2e5aa8');
+    expect(document.documentElement.style.getPropertyValue('--brand')).toBe('#3b82f6');
   });
 
   it('toggleTheme flips light to dark', () => {

packages/web/src/components/__tests__/ui.test.tsx

@@ -5,6 +5,7 @@ import { IconButton } from '../ui/IconButton';
 import { Ring } from '../ui/Ring';
 import { SparkBars } from '../ui/SparkBars';
 import { SupplyBar } from '../ui/SupplyBar';
+import { Card, CardHeader, CardBody } from '../ui/Card';
 
 describe('Avatar', () => {
   it('renders initial from name', () => {
@@ -82,3 +83,36 @@ describe('SupplyBar', () => {
     expect(screen.getByText('10')).toBeInTheDocument();
   });
 });
+
+describe('Card', () => {
+  it('renders children and applies custom styles', () => {
+    render(
+      <Card className="custom-card" style={{ margin: '20px' }}>
+        <div>Card Content</div>
+      </Card>
+    );
+    expect(screen.getByText('Card Content')).toBeInTheDocument();
+  });
+
+  it('renders header with title, subtitle and action', () => {
+    render(
+      <CardHeader 
+        title="My Card" 
+        subtitle="My Subtitle" 
+        action={<button>Click Me</button>} 
+      />
+    );
+    expect(screen.getByText('My Card')).toBeInTheDocument();
+    expect(screen.getByText('My Subtitle')).toBeInTheDocument();
+    expect(screen.getByRole('button', { name: 'Click Me' })).toBeInTheDocument();
+  });
+
+  it('renders body with children', () => {
+    render(
+      <CardBody>
+        <div>Body Content</div>
+      </CardBody>
+    );
+    expect(screen.getByText('Body Content')).toBeInTheDocument();
+  });
+});