feat(currency): centralise money formatting + curated currency picker

New `src/lib/utils/currency.ts` is the single source of truth for
display formatting (`formatCurrency`) and the supported-currency
catalog (`SUPPORTED_CURRENCIES`, 10 codes covering the marina market).

New shared components:
- `<CurrencyInput>` — number input with leading symbol prefix and
  decimal inputMode, raw number value out via onChange.
- `<CurrencySelect>` — Select dropdown over `SUPPORTED_CURRENCIES`
  with symbol + code + label per row, replaces the free-text 3-letter
  inputs that let reps type "EURO" or "$$$" into a 3-char ISO column.

Threaded through every money input + display:
- Forms: berth (price/currency), expense (amount/currency), invoice
  (currency Select + line-items unit-price + step-3 review totals).
- Reads: berth-card / berth-columns / invoice-card / expense-card /
  dashboard KPIs / dashboard revenue-forecast / portal-invoices page.
  Each had its own ad-hoc `Intl.NumberFormat` wrapper with slightly
  different fallbacks; collapsed onto the shared helper.

`InvoiceLineItems` gained a `currency` prop so the unit-price input
prefix and the subtotal use the parent invoice's currency rather than
hard-coded `en-US` formatting.

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

src/components/invoices/invoice-card.tsx

@@ -22,6 +22,7 @@ import {
 } from '@/components/ui/dropdown-menu';
 import { ListCard, ListCardAvatar, ListCardMeta } from '@/components/shared/list-card';
 import { cn } from '@/lib/utils';
+import { formatCurrency } from '@/lib/utils/currency';
 import type { InvoiceRow } from './invoice-columns';
 
 const STATUS_COLORS: Record<string, string> = {
@@ -48,13 +49,7 @@ const STATUS_ACCENT: Record<string, string> = {
   cancelled: 'bg-slate-200',
 };
 
-function formatAmount(total: string, currency: string): string {
-  try {
-    return new Intl.NumberFormat('en', { style: 'currency', currency }).format(Number(total));
-  } catch {
-    return `${currency} ${total}`;
-  }
-}
+const formatAmount = (total: string, currency: string) => formatCurrency(total, currency);
 
 interface InvoiceCardProps {
   invoice: InvoiceRow;

src/components/invoices/invoice-line-items.tsx

@@ -5,6 +5,8 @@ import { Plus, Trash2 } from 'lucide-react';
 
 import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
+import { CurrencyInput } from '@/components/shared/currency-input';
+import { formatCurrency } from '@/lib/utils/currency';
 
 interface LineItem {
   description: string;
@@ -14,10 +16,13 @@ interface LineItem {
 
 interface InvoiceLineItemsProps {
   name?: string;
+  /** Currency code from the parent invoice form (drives both the
+   *  unit-price input symbol and the subtotal formatting). */
+  currency?: string;
 }
 
-export function InvoiceLineItems({ name = 'lineItems' }: InvoiceLineItemsProps) {
-  const { register, watch } = useFormContext();
+export function InvoiceLineItems({ name = 'lineItems', currency = 'USD' }: InvoiceLineItemsProps) {
+  const { register, setValue, watch } = useFormContext();
   const { fields, append, remove } = useFieldArray({ name });
 
   const lineItems: LineItem[] = watch(name) ?? [];
@@ -66,22 +71,18 @@ export function InvoiceLineItems({ name = 'lineItems' }: InvoiceLineItemsProps)
               />
             </div>
             <div className="col-span-2">
-              <Input
-                {...register(`${name}.${index}.unitPrice`, { valueAsNumber: true })}
-                type="number"
-                min="0"
+              <CurrencyInput
+                value={lineItems[index]?.unitPrice ?? null}
+                currency={currency}
+                onChange={(v) =>
+                  setValue(`${name}.${index}.unitPrice`, v ?? 0, { shouldDirty: true })
+                }
                 step="any"
-                placeholder="0.00"
                 className="h-8 text-sm text-right"
               />
             </div>
             <div className="col-span-1 flex items-center justify-end h-8">
-              <span className="text-sm tabular-nums">
-                {lineTotal.toLocaleString('en-US', {
-                  minimumFractionDigits: 2,
-                  maximumFractionDigits: 2,
-                })}
-              </span>
+              <span className="text-sm tabular-nums">{formatCurrency(lineTotal, currency)}</span>
             </div>
             <div className="col-span-1 flex items-center justify-end h-8">
               <Button
@@ -120,13 +121,7 @@ export function InvoiceLineItems({ name = 'lineItems' }: InvoiceLineItemsProps)
         </Button>
         {fields.length > 0 && (
           <div className="text-sm font-medium">
-            Subtotal:{' '}
-            <span className="tabular-nums">
-              {subtotal.toLocaleString('en-US', {
-                minimumFractionDigits: 2,
-                maximumFractionDigits: 2,
-              })}
-            </span>
+            Subtotal: <span className="tabular-nums">{formatCurrency(subtotal, currency)}</span>
           </div>
         )}
       </div>