feat(11-02): add SiteTable, site list page, and site detail page

- SiteTable with sortable columns, search, delete confirmation, unassigned row
- Site list page at /tenants/{tenantId}/sites with create/edit dialogs
- Site detail page at /tenants/{tenantId}/sites/{siteId} with health stats
- Route tree regenerated for new site routes

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

frontend/src/routes/_authenticated/tenants/$tenantId/sites/$siteId.tsx

@@ -0,0 +1,125 @@
+import { createFileRoute, Link } from '@tanstack/react-router'
+import { useQuery } from '@tanstack/react-query'
+import { sitesApi } from '@/lib/api'
+import { MapPin, ArrowLeft } from 'lucide-react'
+import { Button } from '@/components/ui/button'
+import { cn } from '@/lib/utils'
+
+export const Route = createFileRoute('/_authenticated/tenants/$tenantId/sites/$siteId')({
+  component: SiteDetailPage,
+})
+
+function SiteDetailPage() {
+  const { tenantId, siteId } = Route.useParams()
+
+  const { data: site, isLoading } = useQuery({
+    queryKey: ['sites', tenantId, siteId],
+    queryFn: () => sitesApi.get(tenantId, siteId),
+  })
+
+  if (isLoading) {
+    return (
+      <div className="animate-pulse space-y-4">
+        <div className="h-6 w-48 bg-elevated rounded" />
+        <div className="h-4 w-64 bg-elevated rounded" />
+      </div>
+    )
+  }
+
+  if (!site) {
+    return <div className="text-text-muted">Site not found</div>
+  }
+
+  return (
+    <div className="space-y-6">
+      {/* Header with back link */}
+      <div className="flex items-center gap-3">
+        <Link to="/tenants/$tenantId/sites" params={{ tenantId }}>
+          <Button variant="ghost" size="sm">
+            <ArrowLeft className="h-4 w-4 mr-1" /> Sites
+          </Button>
+        </Link>
+      </div>
+
+      {/* Site info card */}
+      <div className="rounded-lg border border-border bg-surface p-6 space-y-4">
+        <div className="flex items-center gap-3">
+          <MapPin className="h-6 w-6 text-text-muted" />
+          <h1 className="text-xl font-semibold">{site.name}</h1>
+        </div>
+
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-4 text-sm">
+          {site.address && (
+            <div>
+              <span className="text-text-muted">Address:</span>
+              <span className="ml-2 text-text-primary">{site.address}</span>
+            </div>
+          )}
+          {site.latitude != null && site.longitude != null && (
+            <div>
+              <span className="text-text-muted">Coordinates:</span>
+              <span className="ml-2 text-text-primary">
+                {site.latitude}, {site.longitude}
+              </span>
+            </div>
+          )}
+          {site.elevation != null && (
+            <div>
+              <span className="text-text-muted">Elevation:</span>
+              <span className="ml-2 text-text-primary">{site.elevation} m</span>
+            </div>
+          )}
+          {site.notes && (
+            <div className="col-span-full">
+              <span className="text-text-muted">Notes:</span>
+              <p className="mt-1 text-text-secondary">{site.notes}</p>
+            </div>
+          )}
+        </div>
+      </div>
+
+      {/* Health stats summary */}
+      <div className="grid grid-cols-2 md:grid-cols-4 gap-4">
+        <div className="rounded-lg border border-border bg-surface p-4 text-center">
+          <p className="text-2xl font-semibold">{site.device_count}</p>
+          <p className="text-xs text-text-muted">Devices</p>
+        </div>
+        <div className="rounded-lg border border-border bg-surface p-4 text-center">
+          <p className="text-2xl font-semibold">{site.online_count}</p>
+          <p className="text-xs text-text-muted">Online</p>
+        </div>
+        <div className="rounded-lg border border-border bg-surface p-4 text-center">
+          <p
+            className={cn(
+              'text-2xl font-semibold',
+              site.online_percent >= 90
+                ? 'text-green-500'
+                : site.online_percent >= 50
+                  ? 'text-yellow-500'
+                  : 'text-red-500',
+            )}
+          >
+            {site.online_percent.toFixed(0)}%
+          </p>
+          <p className="text-xs text-text-muted">Online %</p>
+        </div>
+        <div className="rounded-lg border border-border bg-surface p-4 text-center">
+          <p className={cn('text-2xl font-semibold', site.alert_count > 0 && 'text-red-500')}>
+            {site.alert_count}
+          </p>
+          <p className="text-xs text-text-muted">Alerts</p>
+        </div>
+      </div>
+
+      {/* Placeholder for device list -- Phase 14 will add full site dashboard */}
+      <div className="rounded-lg border border-border bg-surface p-6">
+        <h2 className="text-sm font-semibold mb-2">Assigned Devices</h2>
+        <p className="text-sm text-text-muted">
+          {site.device_count > 0
+            ? `${site.device_count} device${site.device_count !== 1 ? 's' : ''} assigned to this site. Full device list coming in site dashboard.`
+            : 'No devices assigned to this site yet. Assign devices from the fleet page.'}
+        </p>
+      </div>
+    </div>
+  )
+}