feat: every page follows the one-currency mode

Totals, info boxes, section headers, group subtotals, shares and the
per-currency charts on the dashboard, transactions, search, accounts,
merchants, statement, budgets, categories, tags, groups, piggy banks,
reports and the category, tag, budget and merchant pages sum into one
converted amount when the mode is on; charts split by currency merge
into one lane. Inputs, reconciliation and the Foreign column stay exact.

Money moved to or from a debt, loan or mortgage no longer counts as
income or spending in the transaction list boxes; it shows as From
debts and To debts. The running balance of an incoming foreign-currency
transfer shows in the account's currency.

src/lib/components/budgets/TopLine.svelte

@@ -1,14 +1,15 @@
 <script lang="ts">
   import Box from "#lib/components/Box.svelte";
-  import { formatMoney, percent } from "#lib/format.js";
-  import type { Top } from "./data.js";
+  import { percent } from "#lib/format.js";
+  import { mergeTops, type Top, topMoney } from "./data.js";
 
   const CENT = 0.005;
 
   let { tops, onsort }: { tops: Top[]; onsort: () => void } = $props();
 
+  const shown = $derived(mergeTops(tops));
   const free = $derived(
-    tops.some(
+    shown.some(
       (top) =>
         top.available !== null && Math.abs(top.available - top.budgeted) > CENT
     )
@@ -23,9 +24,6 @@
       "Without a budget",
     ].filter(Boolean) as string[]
   );
-
-  const money = (top: Top, amount: number) =>
-    formatMoney({ amount, decimals: 0, symbol: top.cur.symbol });
 </script>
 
 <Box body="px-3 py-3">
@@ -37,36 +35,39 @@
     {#each columns as label (label)}
       <span class="text-[12px] text-cladd-fg-soft max-sm:hidden">{label}</span>
     {/each}
-    {#each tops as top, i (top.cur.code)}
+    {#each shown as top, i (top.cur.code)}
       <span
         class="col-span-2 self-center font-semibold text-[13px] text-cladd-fg-soft sm:col-span-1 {i >
         0
           ? "max-sm:mt-1 max-sm:border-cladd-outline max-sm:border-t max-sm:pt-3"
           : ""}"
-        >{top.cur.code}</span
+        >{top.approx ? "≈" : ""}{top.cur.code}</span
       >
       {#if free}
         {@render stat(
           "Available",
-          top.available === null ? null : money(top, top.available)
+          top.available === null ? null : topMoney(top, top.available)
         )}
       {/if}
-      {@render stat("Budgeted", top.budgeted ? money(top, top.budgeted) : null)}
+      {@render stat(
+        "Budgeted",
+        top.budgeted ? topMoney(top, top.budgeted) : null
+      )}
       {#if free}
         {@const unallocated = (top.available ?? 0) - top.budgeted}
         {@render stat(
           "Left to budget",
-          top.available === null ? null : money(top, unallocated),
+          top.available === null ? null : topMoney(top, unallocated),
           unallocated < 0 ? "text-expense" : ""
         )}
       {/if}
       {@const left = top.budgeted - top.inBudgets}
       {@render stat(
         "Left in budgets",
-        top.budgeted ? money(top, left) : null,
+        top.budgeted ? topMoney(top, left) : null,
         left < 0 ? "text-expense" : ""
       )}
-      {@render stat("Spent", money(top, top.spent))}
+      {@render stat("Spent", topMoney(top, top.spent))}
       <div class="min-w-0">
         <span class="text-[12px] text-cladd-fg-soft sm:hidden"
           >Without a budget</span
@@ -80,7 +81,7 @@
           >
             <span
               class="num font-semibold text-[20px] text-brand tracking-[-0.02em] sm:text-[22px]"
-              >{money(top, top.outside)}</span
+              >{topMoney(top, top.outside)}</span
             >
             {#if top.spent > 0}
               <span class="num ml-1 text-[13px] text-cladd-fg-soft"