Share one modal shell and inline confirm across the app

Modal owns the overlay, header, close button and footer for the balance,
planned-day and QR modals, and closes on Escape (held off while the QR
fetch runs). InlineConfirm replaces the hand-built delete and
remove-member confirmations.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

frontend/src/pages/Settings.tsx

@@ -24,6 +24,7 @@ import { CalendarExceptions } from '@/components/calendar/CalendarExceptions'
 import { BalanceFlow } from '@/components/balance/BalanceFlow'
 import { PartnerInvitePanel } from '@/components/settings/PartnerInvitePanel'
 import { Alert } from '@/components/common/Alert'
+import { InlineConfirm } from '@/components/common/InlineConfirm'
 import { orderSelfFirst } from '@/utils/members'
 import type { VacationDays } from '@/types'
 import './settings.css'
@@ -780,25 +781,19 @@ export function Settings(): ReactNode {
                         </button>
                         {!isSelf &&
                           (isConfirmingRemove ? (
-                            <span className="settings-panel__remove-confirm">
-                              {t('settings.removeConfirmPrompt', { name: member.name })}
-                              <button
-                                onClick={() => handleConfirmRemove(member.uuid)}
-                                className="btn btn--danger btn--sm"
-                                disabled={isSavingFamily}
-                                data-testid={`remove-confirm-${member.uuid}`}
-                              >
-                                {t('settings.removeConfirmButton')}
-                              </button>
-                              <button
-                                onClick={handleCancelRemove}
-                                className="btn btn--secondary btn--sm"
-                                disabled={isSavingFamily}
-                                data-testid={`remove-cancel-${member.uuid}`}
-                              >
-                                {t('settings.cancelButton')}
-                              </button>
-                            </span>
+                            <InlineConfirm
+                              className="settings-panel__remove-confirm"
+                              prompt={t('settings.removeConfirmPrompt', { name: member.name })}
+                              confirmLabel={t('settings.removeConfirmButton')}
+                              cancelLabel={t('settings.cancelButton')}
+                              onConfirm={() => handleConfirmRemove(member.uuid)}
+                              onCancel={handleCancelRemove}
+                              isBusy={isSavingFamily}
+                              confirmTestId={`remove-confirm-${member.uuid}`}
+                              cancelTestId={`remove-cancel-${member.uuid}`}
+                              confirmFirst
+                              small
+                            />
                           ) : (
                             <button
                               onClick={() => handleRequestRemove(member.uuid)}