Fix supervisor payments mobile tabs, reconcile donor, report method buckets, and refund/donation accounting

- Supervisor Payments: mode tabs now wrap on mobile instead of overflowing off-screen.
- Reconciling a Yoco transaction as a donation now lets staff pick who it's from.
- Reports payment-method breakdown now buckets into Cash/Card/EFT/Other everywhere,
  folding Apple Pay, Google Pay, and Yoco-portal payments into Card.
- Refunds now net against their original method's bucket (Cashup/Finance/Profit reports,
  My Payments filtering/display) instead of vanishing or falling into "Other".
- Refund form's method dropdown mirrors the real payment methods and auto-fills from the
  payment being refunded, replacing an ambiguous generic "Refund" option.
- Fixed donation remaining/unallocated balance inflating instead of shrinking when a
  donation is refunded (assign-donation endpoint, cashup reports, donations reports,
  and the Assign Donation panel all summed refund legs with the wrong sign).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

backend/src/controllers/paymentController.js

@@ -365,8 +365,16 @@ const USER_FACING_METHODS = ['cash', 'card', 'eft', 'voucher'];
 const CARD_ALIASES = ['apple_pay', 'google_pay'];
 const KNOWN_METHODS = [...USER_FACING_METHODS, ...CARD_ALIASES];
 
-function normalizeUserMethod(method) {
+// Refund methods are recorded as "<method>-refund" (e.g. "card-refund") so a refund nets
+// against the same bucket its original payment counted under. Strip that suffix before
+// bucketing so a card refund still displays/filters as "card", not "other".
+function stripRefundSuffix(method) {
   const m = String(method || '').toLowerCase();
+  return m.endsWith('-refund') ? m.slice(0, -'-refund'.length) : m;
+}
+
+function normalizeUserMethod(method) {
+  const m = stripRefundSuffix(method);
   if (USER_FACING_METHODS.includes(m)) return m;
   if (CARD_ALIASES.includes(m)) return 'card';
   return 'other';
@@ -394,18 +402,21 @@ const getUserPayments = async (req, res) => {
     if (req.query.method) {
       const requested = String(req.query.method).toLowerCase();
       if (requested === 'card') {
-        // "Card" also covers card-network wallet types (apple_pay, google_pay) — same
-        // settlement as a card payment, no separate float to reconcile.
+        // "Card" also covers card-network wallet types (apple_pay, google_pay) and card
+        // refunds — same settlement as a card payment, no separate float to reconcile.
         where.AND = [{
-          OR: ['card', ...CARD_ALIASES].map(m => ({ method: { equals: m, mode: 'insensitive' } }))
+          OR: ['card', 'card-refund', ...CARD_ALIASES].map(m => ({ method: { equals: m, mode: 'insensitive' } }))
         }];
       } else if (requested === 'other') {
-        // "Other" covers every method that isn't one of the recognized buckets above.
+        // "Other" covers every method (and its refund variant) that isn't one of the
+        // recognized buckets above.
         where.NOT = {
-          OR: KNOWN_METHODS.map(m => ({ method: { equals: m, mode: 'insensitive' } }))
+          OR: KNOWN_METHODS.flatMap(m => [m, `${m}-refund`]).map(m => ({ method: { equals: m, mode: 'insensitive' } }))
         };
       } else if (USER_FACING_METHODS.includes(requested)) {
-        where.method = { equals: requested, mode: 'insensitive' };
+        where.AND = [{
+          OR: [requested, `${requested}-refund`].map(m => ({ method: { equals: m, mode: 'insensitive' } }))
+        }];
       }
     }
 
@@ -601,11 +612,14 @@ const assignDonationToRegistration = async (req, res) => {
 
     // Donations are never mutated once created — their remaining balance is the original
     // amount minus every leg (a Payment row with isDonation:false and originalPaymentId
-    // pointing back at this donation) already allocated from it.
+    // pointing back at this donation) already allocated from it. A refund of the donation
+    // itself also creates such a leg, with a negative amount — Math.abs() so a refund reduces
+    // the remaining balance (money that's left the building) instead of increasing it (which a
+    // raw signed sum would do, since subtracting a negative adds).
     const existingLegs = await prisma.payment.findMany({
       where: { originalPaymentId: payment.id, isDonation: false }
     });
-    const alreadyUsed = existingLegs.reduce((sum, leg) => sum + leg.amount, 0);
+    const alreadyUsed = existingLegs.reduce((sum, leg) => sum + Math.abs(leg.amount), 0);
     const remainingDonation = payment.amount - alreadyUsed;
 
     if (remainingDonation <= 0.000001) {