feat(phase-b): ship analytics dashboard, alerts, scanner PWA, dedup, audit view

Phase B (Insights & Alerts) PR4-11 in one drop. Builds on the schema +
service skeletons committed in PRs 1-3.

PR4  Analytics dashboard — 4 chart types (funnel/timeline/breakdown/source),
     date-range picker (today/7d/30d/90d), CSV+PNG export per card.
PR5  Alert rail UI + /alerts page — topbar bell w/ live count, dashboard
     right-rail, three-tab page (active/dismissed/resolved), socket-driven
     invalidation. Bell lazy-loads list on popover open to keep cold pages
     fast in non-dashboard routes.
PR6  EOI queue tab on documents hub — filters to in-flight EOIs, count
     surfaces in tab label.
PR7  Interests-by-berth tab on berth detail — replaces the stub.
PR8  Expense duplicate detection — BullMQ job runs scan on create, yellow
     banner on detail w/ Merge / Not-a-duplicate, transactional merge
     consolidates receipts and archives the source.
PR9  Receipt scanner PWA + multi-provider AI — port-scoped /scan route in
     its own (scanner) group with no dashboard chrome, dynamic per-port
     manifest, OpenAI + Claude provider abstraction, admin OCR settings
     page (port-level + super-admin global default w/ opt-in fallback),
     test-connection endpoint, manual-entry fallback when no key is
     configured. Verify form always shown before save — no ghost rows.
PR10 Audit log read view — swap to tsvector full-text search on the
     existing GIN index, cursor pagination, filters for entity/action/user
     /date range, batched actor-email resolution.
PR11 Real-API tests — opt-in receipt-ocr.spec (admin save+test, optional
     real-receipt parse via REALAPI_RECEIPT_FIXTURE) and alert-engine
     socket-fanout spec gated behind RUN_ALERT_ENGINE_REALAPI. Both skip
     cleanly without their gate envs so CI stays green.

Test totals: vitest 690 -> 713, smoke 130 -> 138, realapi +2 opt-in.

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

src/components/dashboard/occupancy-timeline-chart.tsx

@@ -0,0 +1,98 @@
+'use client';
+
+import {
+  Area,
+  AreaChart,
+  CartesianGrid,
+  ResponsiveContainer,
+  Tooltip,
+  XAxis,
+  YAxis,
+} from 'recharts';
+
+import { CardSkeleton } from '@/components/shared/loading-skeleton';
+import { EmptyState } from '@/components/shared/empty-state';
+import { ChartCard } from './chart-card';
+import { useOccupancy } from './use-analytics';
+import type { DateRange } from '@/lib/services/analytics.service';
+
+interface Props {
+  range: DateRange;
+}
+
+function shortDate(iso: string) {
+  const d = new Date(`${iso}T00:00:00`);
+  return d.toLocaleDateString(undefined, { month: 'short', day: 'numeric' });
+}
+
+export function OccupancyTimelineChart({ range }: Props) {
+  const { data, isLoading } = useOccupancy(range);
+  const points = data?.points ?? [];
+  const noBerths = points.length > 0 && points[0]?.total === 0;
+
+  function toCsv(): string | null {
+    if (!points.length) return null;
+    const header = 'date,occupied,total,occupancy_pct';
+    const rows = points.map((p) => `${p.date},${p.occupied},${p.total},${p.occupancyPct}`);
+    return [header, ...rows].join('\n');
+  }
+
+  return (
+    <ChartCard
+      title="Occupancy Timeline"
+      description="Daily berth occupancy across the range"
+      exportFilename={`occupancy-timeline-${range}`}
+      toCsv={toCsv}
+    >
+      {isLoading ? (
+        <CardSkeleton />
+      ) : noBerths ? (
+        <EmptyState title="No berths configured" description="Add berths to see occupancy." />
+      ) : (
+        <ResponsiveContainer width="100%" height={260}>
+          <AreaChart
+            data={points.map((p) => ({ ...p, label: shortDate(p.date) }))}
+            margin={{ top: 8, right: 8, left: -16, bottom: 8 }}
+          >
+            <defs>
+              <linearGradient id="occupancyGradient" x1="0" y1="0" x2="0" y2="1">
+                <stop offset="0%" stopColor="hsl(var(--chart-2))" stopOpacity={0.4} />
+                <stop offset="100%" stopColor="hsl(var(--chart-2))" stopOpacity={0} />
+              </linearGradient>
+            </defs>
+            <CartesianGrid strokeDasharray="3 3" className="stroke-border" />
+            <XAxis
+              dataKey="label"
+              tick={{ fontSize: 11, fill: 'hsl(var(--muted-foreground))' }}
+              minTickGap={20}
+            />
+            <YAxis
+              tick={{ fontSize: 11, fill: 'hsl(var(--muted-foreground))' }}
+              domain={[0, 100]}
+              tickFormatter={(v: number) => `${v}%`}
+            />
+            <Tooltip
+              contentStyle={{
+                background: 'hsl(var(--popover))',
+                border: '1px solid hsl(var(--border))',
+                borderRadius: '6px',
+                fontSize: 12,
+              }}
+              formatter={(value, _name, item) => {
+                const p = item?.payload as { occupied?: number; total?: number } | undefined;
+                return [`${value}% (${p?.occupied ?? 0}/${p?.total ?? 0})`, 'Occupancy'];
+              }}
+            />
+            <Area
+              type="monotone"
+              dataKey="occupancyPct"
+              stroke="hsl(var(--chart-2))"
+              strokeWidth={2}
+              fill="url(#occupancyGradient)"
+            />
+          </AreaChart>
+        </ResponsiveContainer>
+      )}
+    </ChartCard>
+  );
+}