fix(audit-wave-9): adopt StatusPill for berth + user status badges

- Extend StatusPill with berth (available/under_offer/sold) and user
  (enabled/disabled) variants so every "this thing is in state X" pill
  shares one primitive and palette.
- Swap berth-card, berth-detail-header, berth-columns from ad-hoc
  bg-green-100 / bg-yellow-100 / bg-red-100 Tailwind tuples to
  <StatusPill status="...">.
- Swap UserList Active/Disabled <Badge> and user-card Inactive pill to
  StatusPill; Super-Admin chip kept as a domain-specific accent (violet).

Closes ui/ux M1+M2.

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

src/components/berths/berth-columns.tsx

@@ -12,6 +12,7 @@ import {
   DropdownMenuTrigger,
 } from '@/components/ui/dropdown-menu';
 import { TagBadge } from '@/components/shared/tag-badge';
+import { StatusPill, type StatusPillStatus } from '@/components/ui/status-pill';
 import { formatCurrency } from '@/lib/utils/currency';
 import { mooringLetterDot } from './mooring-letter-tone';
 import { stageBadgeClass, stageLabel } from '@/lib/constants';
@@ -112,25 +113,23 @@ export const BERTH_DEFAULT_HIDDEN: string[] = [
   'pricingValidUntil',
 ];
 
+const BERTH_STATUS_PILL: Record<string, StatusPillStatus> = {
+  available: 'available',
+  under_offer: 'under_offer',
+  sold: 'sold',
+};
+
+const BERTH_STATUS_LABELS: Record<string, string> = {
+  available: 'Available',
+  under_offer: 'Under Offer',
+  sold: 'Sold',
+};
+
 function StatusBadge({ status }: { status: string }) {
-  const variants: Record<string, string> = {
-    available: 'bg-green-100 text-green-800 border-green-200',
-    under_offer: 'bg-yellow-100 text-yellow-800 border-yellow-200',
-    sold: 'bg-red-100 text-red-800 border-red-200',
-  };
-
-  const labels: Record<string, string> = {
-    available: 'Available',
-    under_offer: 'Under Offer',
-    sold: 'Sold',
-  };
-
   return (
-    <span
-      className={`inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-medium ${variants[status] ?? 'bg-muted text-muted-foreground'}`}
-    >
-      {labels[status] ?? status}
-    </span>
+    <StatusPill status={BERTH_STATUS_PILL[status] ?? 'pending'}>
+      {BERTH_STATUS_LABELS[status] ?? status}
+    </StatusPill>
   );
 }