feat: add TCO display component (refs #15)

- Create TCODisplay component showing lifetime cost and cost per distance
- Display cost breakdown (purchase, insurance, registration, fuel, maintenance)
- Integrate into VehicleDetailPage right-justified next to vehicle details
- Responsive layout: stacks vertically on mobile, side-by-side on desktop
- Only shows when tcoEnabled is true

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

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

frontend/src/features/vehicles/pages/VehicleDetailPage.tsx

@@ -15,6 +15,7 @@ import { vehiclesApi } from '../api/vehicles.api';
 import { Card } from '../../../shared-minimal/components/Card';
 import { VehicleForm } from '../components/VehicleForm';
 import { VehicleImage } from '../components/VehicleImage';
+import { TCODisplay } from '../components/TCODisplay';
 import { useFuelLogs } from '../../fuel-logs/hooks/useFuelLogs';
 import { FuelLogResponse, UpdateFuelLogRequest } from '../../fuel-logs/types/fuel-logs.types';
 import { FuelLogEditDialog } from '../../fuel-logs/components/FuelLogEditDialog';
@@ -300,8 +301,8 @@ export const VehicleDetailPage: React.FC = () => {
       </Box>
 
       <Card>
-        <Box sx={{ display: 'flex', gap: 3, mb: 3 }}>
-          <Box sx={{ width: 200, flexShrink: 0 }}>
+        <Box sx={{ display: 'flex', gap: 3, mb: 3, flexWrap: { xs: 'wrap', md: 'nowrap' } }}>
+          <Box sx={{ width: { xs: '100%', sm: 200 }, flexShrink: 0 }}>
             <VehicleImage vehicle={vehicle} height={150} />
           </Box>
           <Box sx={{ flex: 1 }}>
@@ -318,6 +319,14 @@ export const VehicleDetailPage: React.FC = () => {
               </Typography>
             )}
           </Box>
+          {/* TCO Display - right-justified */}
+          <Box sx={{
+            width: { xs: '100%', md: 'auto' },
+            minWidth: { md: 200 },
+            mt: { xs: 2, md: 0 }
+          }}>
+            <TCODisplay vehicleId={vehicle.id} tcoEnabled={vehicle.tcoEnabled} />
+          </Box>
         </Box>
 
         <form className="space-y-4">