feat(readability): add scalable text and responsive high-contrast layouts (U13)

src/Duempelkas.App/Components/Dialogs/EditCarryoverDialog.razor

@@ -1,5 +1,5 @@
 @inject ToastService Toasts
-<ModalDialog @ref="modal" Title="Bestandskorrektur" OnCancel="OnCancel" Dirty="@(amount != CurrentAmount)" Busy="saving">
+<ModalDialog @ref="modal" Title="Bestandskorrektur" OnCancel="OnCancel" Dirty="@(amountText != CurrentAmount.ToString("0.00", System.Globalization.CultureInfo.GetCultureInfo("de-DE")))" Busy="saving">
     <h5>Bestandskorrektur – @AccountName</h5>
     <p>@(Year.HasValue ? $"Übertrag zum 01.01.{Year}" : "Gemeinsamer Anfangsbestand – alle Jahre")</p>
     <p>Anfangsbestand + Einnahmen − Ausgaben = Kontostand</p>

src/Duempelkas.App/Components/Layout/MainLayout.razor

@@ -1,12 +1,20 @@
 @inherits LayoutComponentBase
+@inject IJSRuntime JS
 
 <ToastHost />
 
-<div class="d-flex flex-column vh-100">
+<div class="app-shell">
     <nav class="app-navbar d-flex justify-content-between align-items-center">
         <a class="navbar-brand" href="">
             <strong>Dümpelkas</strong> <small class="text-muted">Kassenbuch</small>
         </a>
+        <div class="reading-controls">
+            <label for="text-scale">Textgröße</label>
+            <select id="text-scale" @bind="fontScale" @bind:after="ApplyTextScale">
+                <option value="100">Normal</option><option value="125">Groß (125 %)</option>
+                <option value="150">Sehr groß (150 %)</option><option value="200">200 %</option>
+            </select>
+        </div>
     </nav>
 
     <main class="flex-grow-1 overflow-auto p-3">

src/Duempelkas.App/Components/Layout/MainLayout.razor.cs

@@ -1,9 +1,21 @@
+using Microsoft.JSInterop;
 using System.Reflection;
 
 namespace Duempelkas.App.Components.Layout;
 
 public partial class MainLayout
 {
+    private int fontScale = 100;
+    protected override async Task OnAfterRenderAsync(bool firstRender)
+    {
+        if (firstRender)
+        {
+            var value = await JS.InvokeAsync<int>("duempelkasReading.get");
+            fontScale = value is 125 or 150 or 200 ? value : 100;
+            StateHasChanged();
+        }
+    }
+    private async Task ApplyTextScale() => await JS.InvokeVoidAsync("duempelkasReading.set", fontScale);
     #region Fields
 
     private bool showAboutDialog;

src/Duempelkas.App/Pages/Accounts/AccountDetail.razor

@@ -21,7 +21,7 @@
     {
         <div class="d-flex align-items-center gap-2">
             <div class="d-flex align-items-center flex-grow-1" style="min-width: 0;">
-                <h1 class="mb-0 mt-0" style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
+                <h1 class="mb-0 mt-0 page-heading">
                     @account.Name
                     <button class="btn-edit-pen" @onclick="() => showEditName = true" title="Name bearbeiten"><i class="bi bi-pencil"></i></button>
                 </h1>

src/Duempelkas.App/Pages/Dashboard.razor

@@ -15,7 +15,7 @@
 
     <div class="d-flex justify-content-between align-items-center">
         <div class="d-flex align-items-center flex-grow-1" style="min-width: 0;">
-            <h1 class="mb-0 mt-0" style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
+            <h1 class="mb-0 mt-0 page-heading">
                 @DisplayClubName
                 <button class="btn-edit-pen" @onclick="() => showEditClubName = true" title="Vereinsname bearbeiten">
                     <i class="bi bi-pencil"></i>