feat(pipeline): 9→7 stage refactor + v1.1 hardening wave

Replaces the legacy 9-stage pipeline with 7 canonical stages
(enquiry → qualified → eoi → reservation → deposit_paid → contract →
nurturing) plus three doc sub-status columns (eoi_doc_status,
reservation_doc_status, contract_doc_status) that track sent/signed
within a single stage instead of branching it.

Schema (migration 0062):
- interests gains assigned_to, deposit_expected_amount/currency,
  three doc-status columns, two documenso-id columns, and
  date_reservation_signed.
- New tables: qualification_criteria (per-port admin-configurable),
  interest_qualifications (per-interest state), payments (deposit /
  balance / refund records keyed to interest + client).
- Default qualification criteria seeded for every existing port.
- Dummy-data UPDATEs collapse Sent/Signed pairs and 'completed' into
  the new stage + doc-status + outcome shape.

Migration 0063 adds interest_contact_log.voice_transcript and
template_used columns for v1.1-A/B (quick-template buttons + voice
transcription via Web Speech API).

v1.1 phase work bundled here:
- A/B: Quick-template buttons (Call / Visit / Email) + mic toggle on
       the contact-log compose dialog (useVoiceTranscription hook).
- C:   berth-rules-engine wraps state writes in pg_advisory_xact_lock
       with an idempotent re-read; emits rule_evaluated audit traces.
- D:   Documenso webhook: reservation/contract sub-status stamping
       moved out of the PDF-download try-block so a download failure
       no longer swallows the stamp. New integration test coverage.
- E:   /admin/qualification-criteria CRUD page + admin component.
- F:   default_new_interest_owner exposed in System Settings.
- G:   recentActivityCount + active_engagement deal-pulse signal
       surfaced as a chip on interests + hot-deals card.
- H:   interest_assigned notification on assignedTo change (skips
       self-assign, uses a dedupe key).

Plus the supporting components: AssignedToChip, DealPulseChip,
PaymentsSection, QualificationChecklist, MultiEoiChip,
SkipAheadBanner, WonStatusPanel, InterestBerthStatusBanner,
SupplementalInfoRequestButton, UserPicker.

Tests: 1370/1370 vitest pass (added deal-health unit suite +
expanded constants/validators/pipeline-transitions coverage). tsc
clean, eslint clean.

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

src/components/berths/berth-list.tsx

@@ -35,6 +35,7 @@ export function BerthList() {
     setSort,
     filters,
     setFilter,
+    setAllFilters,
     clearFilters,
     setPage,
     setPageSize,
@@ -62,35 +63,37 @@ export function BerthList() {
         // No "New" button - berths are import-only
       />
 
-      <div className="flex items-center gap-2 flex-wrap">
-        <FilterBar
-          // Search is hoisted out of the popover into the inline input
-          // below — keeps the daily "find by mooring/area" lookup one
-          // tap away instead of buried behind the Filters dropdown.
-          filters={berthFilterDefinitions.filter((d) => d.key !== 'search')}
-          values={filters}
-          onChange={setFilter}
-          onClear={clearFilters}
-        />
-        <Input
-          type="search"
-          inputMode="search"
-          placeholder="Search mooring or area…"
-          aria-label="Search berths"
-          value={(filters.search as string | undefined) ?? ''}
-          onChange={(e) => setFilter('search', e.target.value || undefined)}
-          // flex-1 + min-w-0 lets the input expand to fill the row's
-          // remaining width on mobile (where space is at a premium).
-          // sm:max-w-xs caps it at 320px on desktop so it doesn't grow
-          // absurdly wide on a 2k monitor.
-          className="h-8 min-w-0 flex-1 sm:max-w-xs"
-        />
-        <div className="ml-auto flex items-center gap-2">
+      {/* Toolbar — two halves separated by `justify-between` so the
+          Columns + Saved-views actions stay pinned to the right edge of
+          the row at every width. The previous `ml-auto` trick didn't
+          survive flex-wrap on intermediate widths — the actions ended
+          up centered. */}
+      <div className="flex items-center gap-2 flex-wrap justify-between">
+        <div className="flex items-center gap-2 flex-wrap min-w-0 flex-1">
+          <FilterBar
+            // Search is hoisted out of the popover into the inline input
+            // below — keeps the daily "find by mooring/area" lookup one
+            // tap away instead of buried behind the Filters dropdown.
+            filters={berthFilterDefinitions.filter((d) => d.key !== 'search')}
+            values={filters}
+            onChange={setFilter}
+            onClear={clearFilters}
+          />
+          <Input
+            type="search"
+            inputMode="search"
+            placeholder="Search mooring or area…"
+            aria-label="Search berths"
+            value={(filters.search as string | undefined) ?? ''}
+            onChange={(e) => setFilter('search', e.target.value || undefined)}
+            className="h-8 min-w-0 flex-1 sm:max-w-xs"
+          />
+        </div>
+        <div className="flex items-center gap-2 ml-auto">
           <SavedViewsDropdown
             entityType="berths"
             onApplyView={(savedFilters, _savedSort) => {
-              clearFilters();
-              Object.entries(savedFilters).forEach(([key, value]) => setFilter(key, value));
+              setAllFilters(savedFilters);
             }}
           />
           <ColumnPicker columns={BERTH_COLUMN_OPTIONS} hidden={hidden} onChange={setHidden} />

src/components/berths/berth-tabs.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { useEffect, useState } from 'react';
-import { useMutation, useQueryClient } from '@tanstack/react-query';
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
 
 import { cn } from '@/lib/utils';
 
@@ -78,6 +78,36 @@ function SpecRow({ label, value }: { label: string; value: React.ReactNode }) {
   );
 }
 
+/**
+ * Tags Card for the berth overview. Wraps the InlineTagEditor in a Card so
+ * the section header uses CardTitle styling; mirrors the visibility rule
+ * the editor itself uses — hides entirely when the port has no tags
+ * defined AND this berth has none applied.
+ */
+function BerthTagsCard({ berth }: { berth: BerthData }) {
+  const { data: allTags } = useQuery<{ data: { id: string; name: string; color: string }[] }>({
+    queryKey: ['tags'],
+    queryFn: () => apiFetch('/api/v1/tags'),
+    staleTime: 60_000,
+  });
+  const portHasNoTags = allTags && allTags.data.length === 0;
+  if (portHasNoTags && berth.tags.length === 0) return null;
+  return (
+    <Card>
+      <CardHeader className="pb-3">
+        <CardTitle className="text-sm font-medium">Tags</CardTitle>
+      </CardHeader>
+      <CardContent className="pt-0">
+        <InlineTagEditor
+          endpoint={`/api/v1/berths/${berth.id}/tags`}
+          currentTags={berth.tags}
+          invalidateKey={['berths', berth.id]}
+        />
+      </CardContent>
+    </Card>
+  );
+}
+
 function useBerthPatch(berthId: string) {
   const qc = useQueryClient();
   return useMutation({
@@ -382,18 +412,7 @@ function OverviewTab({ berth }: { berth: BerthData }) {
             </CardContent>
           </Card>
 
-          <Card>
-            <CardHeader className="pb-3">
-              <CardTitle className="text-sm font-medium">Tags</CardTitle>
-            </CardHeader>
-            <CardContent className="pt-0">
-              <InlineTagEditor
-                endpoint={`/api/v1/berths/${berth.id}/tags`}
-                currentTags={berth.tags}
-                invalidateKey={['berths', berth.id]}
-              />
-            </CardContent>
-          </Card>
+          <BerthTagsCard berth={berth} />
         </div>
       </div>
     </div>