feat(P4): Schriftgröße einstellbar (1.7.2)

Klein, Mittel oder Groß - Karte "Darstellung" auf der Seite Reinigung &
Wartung.

LVGL-Schriften sind fest einkompilierte Bilddaten und existieren nur in den
Größen, die im Projekt liegen (14/18/28/40/48). Stufenloses Skalieren gibt
es also nicht. Stattdessen drei Rollen - font_small(), font_text(),
font_title() -, die je nach Einstellung eine Stufe höher greifen; die 45
festen Schriftverweise in ui.cpp sind darauf umgestellt.

- Die großen Anzeigen (Temperatur 40/48, Uhr) bleiben fest: Sie sind auf die
  Bildschirmgröße abgestimmt.
- Die Grundschrift wird am Bildschirmobjekt gesetzt, damit alles ohne eigene
  Schrift sie erbt.
- Die Einstellung liegt lokal im P4 (NVS "anzeige"), nicht auf der S3.
- Nach der Auswahl folgt ein Neustart; der Frühstart-Zähler der
  Absturzsicherung wird vorher zurückgesetzt.

Offen: In der Stufe Groß brauchen die Karten mehr Platz - ob alle Seiten
dann noch vollständig auf den Bildschirm passen, zeigt erst das Gerät.

Beide Panel-Varianten mit arduino-cli gegengebaut.

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

P4_Display_Firmware/Changelog.txt

@@ -1,3 +1,47 @@
+Version 1.7.2:
+- Die Schriftgröße lässt sich jetzt einstellen: Klein, Mittel oder Groß, zu finden auf der
+  Seite Reinigung & Wartung in der neuen Karte „Darstellung".
+- LVGL-Schriften sind fest einkompilierte Bilddaten; es gibt sie nur in den Größen, die im
+  Projekt liegen (14, 18, 28, 40 und 48 Pixel). Stufenlos skalieren lässt sich also nichts.
+  Stattdessen gibt es drei Rollen - klein, normal, hervorgehoben -, die je nach Einstellung
+  eine Stufe höher greifen.
+- Die großen Anzeigen für Temperatur und Uhrzeit bleiben unverändert: Sie sind bereits auf
+  die Bildschirmgröße abgestimmt und sollen nicht mitwachsen.
+- Die Einstellung liegt lokal im Display, nicht auf der Hauptplatine - sie betrifft nur
+  dieses Gerät. Nach der Auswahl startet der P4 neu, weil die Schriften in bereits
+  angelegten Bedienelementen stecken und sich nicht nachträglich umhängen lassen.
+- Zu erwarten: In der Stufe Groß brauchen die Karten mehr Platz. Ob alle Seiten dann noch
+  vollständig auf den Bildschirm passen, zeigt erst das Gerät.
+
+Version 1.7.1:
+- Cold Extraction ist auf dem 7-Zoll-Panel dreispaltig: oben die drei Karten mit
+  Erklaerungstext (Modus, Vorbenetzung, Bezugsende), darunter die knappen (Grundeinstellung,
+  Hauptbezug, Pumpenschutz), der Speichern-Knopf frei unter allen sechs. Drei statt zwei
+  Spalten, weil die Erklaerungstexte keine volle Zeilenbreite brauchen und so am Ende keine
+  halbleere Reihe stehen bleibt.
+- Der Warnhinweis stand bisher als eigene Zeile am Seitenende, weit entfernt von dem
+  Schalter, auf den er sich bezieht. Er sitzt jetzt in der Modus-Karte.
+- Reinigung & Wartung ist zweispaltig und besteht aus vier Karten: Wartungszaehler,
+  Flush-Zeiten, Display-Helligkeit sowie Reinigung & Entkalkung. Bisher standen dort lose
+  Zeilen unter blossen Zwischenueberschriften, dazwischen freistehende Knoepfe.
+- Anders als bei Bruehen und Cold Extraction sitzt der Speichern-Knopf hier IN der Karte:
+  Jede Karte speichert etwas anderes, deshalb gehoert der Knopf zur Karte statt unter die
+  Seite.
+- Alle drei umgestellten Seiten passen jetzt vollstaendig auf den Bildschirm. Die JC-Panels
+  behalten ihr einspaltiges Layout.
+
+Version 1.7.0:
+- Brew-Control ist auf dem 7-Zoll-Panel zweispaltig: Pre-Infusion und Brew-by-Weight oben,
+  Brew-by-Time und Dampf-Timer darunter, der Speichern-Knopf frei unter allen Karten.
+  Damit passt die Seite vollstaendig auf den Bildschirm und muss nicht mehr gescrollt
+  werden - der teuerste Vorgang der Oberflaeche entfaellt dort ersatzlos.
+- Die Anordnung folgt der Bedeutung: links steht, was den Bezug startet, rechts, was ihn
+  beendet.
+- Der Speichern-Knopf sitzt bewusst nicht in einer der Karten. Er speichert die ganze Seite
+  und wuerde in einer einzelnen Karte so wirken, als gaelte er nur fuer diese.
+- Die JC-Panels bleiben einspaltig - dort ist der Platz knapp, nicht ueppig.
+- Cold Extraction und Reinigung/Wartung folgen als naechstes.
+
 Version 1.6.27:
 - Beim Waveshare-Panel rollen scrollbare Listen nach dem Loslassen nicht mehr aus, sondern
   folgen nur dem Finger. Ohne Doppelpufferung entsteht beim Scrollen jedes Bild komplett

P4_Display_Firmware/ui.cpp

@@ -20,6 +20,71 @@
 #include <Preferences.h>   // Dashboard-Design P4-lokal merken (NVS)
 #include <esp_heap_caps.h> // Verlaufs-Historie im PSRAM allozieren (interner RAM ist knapp)
 #include "ui.h"
+#include <Preferences.h>
+#include "esp_system.h"
+
+// ------------------------------------------------------------------------------------
+//  Schriftgroesse
+//
+//  LVGL-Schriften sind fest einkompilierte Bilddaten, es gibt sie also nur in den Groessen,
+//  die im Projekt liegen: 14, 18, 28, 40 und 48 Pixel. Stufenlos skalieren laesst sich
+//  nichts. Umschalten zwischen ihnen dagegen schon - deshalb drei Rollen statt fester
+//  Groessen, die je nach Einstellung eine Stufe hoeher greifen.
+//
+//  Die grossen Anzeigen (Temperatur, Uhr) bleiben unveraendert: Sie sind bereits auf die
+//  Bildschirmgroesse abgestimmt und sollen nicht mitwachsen.
+//
+//  Die Einstellung liegt lokal im P4, nicht auf der Hauptplatine - sie betrifft nur dieses
+//  Display. Sie wirkt beim naechsten Start: Die Schriften stecken in Hunderten bereits
+//  angelegter Bedienelemente, die sich nicht nachtraeglich umhaengen lassen, ohne die
+//  gesamte Oberflaeche neu aufzubauen.
+// ------------------------------------------------------------------------------------
+enum { FONT_KLEIN = 0, FONT_MITTEL = 1, FONT_GROSS = 2 };
+static uint8_t g_fontStep = FONT_KLEIN;
+
+static const lv_font_t* font_small() {
+    switch (g_fontStep) {
+        case FONT_GROSS:  return &lv_font_maven_pro_28;
+        case FONT_MITTEL: return &lv_font_maven_pro_18;
+        default:          return &lv_font_maven_pro_14;
+    }
+}
+static const lv_font_t* font_text() {
+    switch (g_fontStep) {
+        case FONT_GROSS:  return &lv_font_maven_pro_40;
+        case FONT_MITTEL: return &lv_font_maven_pro_28;
+        default:          return &lv_font_maven_pro_18;
+    }
+}
+static const lv_font_t* font_title() {
+    switch (g_fontStep) {
+        case FONT_GROSS:  return &lv_font_maven_pro_48;
+        case FONT_MITTEL: return &lv_font_maven_pro_40;
+        default:          return &lv_font_maven_pro_28;
+    }
+}
+
+static void font_step_load() {
+    Preferences p;
+    if (p.begin("anzeige", true)) {
+        g_fontStep = (uint8_t)p.getUChar("schrift", FONT_KLEIN);
+        p.end();
+    }
+    if (g_fontStep > FONT_GROSS) g_fontStep = FONT_KLEIN;
+}
+
+static void font_step_save_and_restart(uint8_t step) {
+    if (step > FONT_GROSS) return;
+    Preferences p;
+    if (p.begin("anzeige", false)) {
+        p.putUChar("schrift", step);
+        p.end();
+    }
+    // Der Zaehler der Absturzsicherung darf diesen gewollten Neustart nicht mitzaehlen.
+    { Preferences b; if (b.begin("bootguard", false)) { b.putUShort("early", 0); b.end(); } }
+    delay(120);
+    esp_restart();
+}
 #include "theme.h"
 #include "config.h"
 #include "display_hal.h"   // hal_backlight() - Helligkeit fuer den Aufweck-Dialog
@@ -426,7 +491,7 @@ static lv_obj_t* group_card(lv_obj_t* parent, const char* title, const char* sub
     lv_obj_t* t = lv_label_create(c);
     lv_label_set_text(t, title);
     lv_obj_set_style_text_color(t, COL_ACCENT, 0);
-    lv_obj_set_style_text_font(t, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(t, font_text(), 0);
     if (subtitle) {
         lv_obj_t* s = lv_label_create(c);
         lv_label_set_long_mode(s, LV_LABEL_LONG_WRAP);
@@ -459,6 +524,49 @@ static void add_save_button(lv_obj_t* parent, const char* txt, lv_event_cb_t cb)
 //
 // Nur fuer das Waveshare-Panel: Die JC-Panels haben das Tempoproblem nicht, ihr
 // Bediengefuehl soll unveraendert bleiben.
+
+
+
+// ------------------------------------------------------------------------------------
+//  Mehrspaltige Seiten fuer das grosse Panel
+//
+//  Die Seiten sind als einspaltige Stapel entstanden - entworfen fuer 800x480, wo eine
+//  Spalte alles ist, was hineinpasst. Auf 1280x720 bleibt daneben rund 40 % der Flaeche
+//  leer, waehrend unten Karten aus dem Bild fallen und gescrollt werden muss. Und Scrollen
+//  ist auf diesem Panel teuer: Ohne Doppelpufferung entsteht dabei jedes Bild komplett neu.
+//
+//  Deshalb hier ein Raster statt eines Stapels. Passt eine Seite vollstaendig auf den
+//  Bildschirm, entfaellt der teuerste Vorgang der Oberflaeche ersatzlos.
+//
+//  Die JC-Panels bleiben einspaltig: Dort ist der Platz knapp, nicht ueppig.
+// ------------------------------------------------------------------------------------
+#if JC_PANEL_TYPE == WS_PANEL_7H
+static const int32_t PAGE_COLS_2[]  = { LV_GRID_FR(1), LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST };
+// Zwei Kartenreihen, darunter eine Reihe fuer den Speichern-Knopf.
+static const int32_t PAGE_ROWS_2C[] = { LV_GRID_CONTENT, LV_GRID_CONTENT, LV_GRID_CONTENT,
+                                        LV_GRID_TEMPLATE_LAST };
+// Drei Spalten fuer Seiten mit sechs Karten: Die Erklaerungstexte brauchen keine volle
+// Zeilenbreite, und in drei Spalten bleibt am Ende keine halbleere Reihe stehen.
+static const int32_t PAGE_COLS_3[]  = { LV_GRID_FR(1), LV_GRID_FR(1), LV_GRID_FR(1),
+                                        LV_GRID_TEMPLATE_LAST };
+
+static void page_grid(lv_obj_t* p, const int32_t* cols, const int32_t* rows) {
+    lv_obj_set_layout(p, LV_LAYOUT_GRID);
+    lv_obj_set_grid_dsc_array(p, cols, rows);
+    lv_obj_set_style_pad_column(p, 12, 0);
+    lv_obj_set_style_pad_row(p, 12, 0);
+}
+
+// Karte in eine Rasterzelle setzen. Die Breite kommt ab jetzt aus der Spalte, deshalb muss
+// die Prozentbreite aus group_card() zurueckgenommen werden - sie bezoege sich sonst auf
+// die ganze Seite statt auf die Zelle.
+static void grid_at(lv_obj_t* c, uint8_t col, uint8_t row, uint8_t col_span = 1) {
+    lv_obj_set_width(c, LV_SIZE_CONTENT);
+    lv_obj_set_grid_cell(c, LV_GRID_ALIGN_STRETCH, col, col_span,
+                            LV_GRID_ALIGN_START, row, 1);
+}
+#endif
+
 static void scroll_ohne_nachlauf(lv_obj_t* o) {
 #if JC_PANEL_TYPE == WS_PANEL_7H
     lv_obj_clear_flag(o, LV_OBJ_FLAG_SCROLL_MOMENTUM);
@@ -710,7 +818,7 @@ static void tempCard(lv_obj_t* parent, const char* title, lv_color_t accent,
     lv_obj_t* t = lv_label_create(card);
     lv_label_set_text(t, title);
     lv_obj_set_style_text_color(t, accent, 0);
-    lv_obj_set_style_text_font(t, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(t, font_text(), 0);
     *big = lv_label_create(card);
     lv_label_set_text(*big, "--.-");
     lv_obj_set_style_text_color(*big, COL_TEXT, 0);
@@ -718,7 +826,7 @@ static void tempCard(lv_obj_t* parent, const char* title, lv_color_t accent,
     *setp = lv_label_create(card);
     lv_label_set_text(*setp, "Soll --.-");
     lv_obj_set_style_text_color(*setp, COL_TEXT_DIM, 0);
-    lv_obj_set_style_text_font(*setp, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(*setp, font_text(), 0);
     *bar = lv_bar_create(card);
     lv_obj_set_size(*bar, LV_PCT(92), 12);
     lv_obj_set_style_bg_color(*bar, lv_color_hex(0x3a3a3a), 0);   // sichtbarer Track (auch bei 0 %)
@@ -795,7 +903,7 @@ static void tempGauge(lv_obj_t* parent, const char* title, lv_color_t accent,
     lv_obj_t* t = lv_label_create(face);
     lv_label_set_text(t, title);
     lv_obj_set_style_text_color(t, accent, 0);
-    lv_obj_set_style_text_font(t, &lv_font_maven_pro_14, 0);
+    lv_obj_set_style_text_font(t, font_small(), 0);
     lv_obj_align(t, LV_ALIGN_CENTER, 0, -48);
     *big = lv_label_create(face);
     lv_label_set_text(*big, "--.-");
@@ -806,7 +914,7 @@ static void tempGauge(lv_obj_t* parent, const char* title, lv_color_t accent,
     *setp = lv_label_create(face);
     lv_label_set_text(*setp, "Soll --.-");
     lv_obj_set_style_text_color(*setp, COL_TEXT_DIM, 0);
-    lv_obj_set_style_text_font(*setp, &lv_font_maven_pro_14, 0);
+    lv_obj_set_style_text_font(*setp, font_small(), 0);
     lv_obj_align(*setp, LV_ALIGN_CENTER, 0, 62);
 }
 // Minimal-Design (TD_MINIMAL): komplett rahmenlos - nur grosser Ist-Wert in der
@@ -827,7 +935,7 @@ static void tempMinimal(lv_obj_t* parent, const char* title, lv_color_t accent,
     lv_obj_t* t = lv_label_create(holder);
     lv_label_set_text(t, title);
     lv_obj_set_style_text_color(t, accent, 0);
-    lv_obj_set_style_text_font(t, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(t, font_text(), 0);
     *big = lv_label_create(holder);
     lv_label_set_text(*big, "--.-");
     lv_obj_set_style_text_color(*big, COL_TEXT, 0);
@@ -845,7 +953,7 @@ static void tempMinimal(lv_obj_t* parent, const char* title, lv_color_t accent,
     *setp = lv_label_create(holder);
     lv_label_set_text(*setp, "Soll --.-");
     lv_obj_set_style_text_color(*setp, COL_TEXT_DIM, 0);
-    lv_obj_set_style_text_font(*setp, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(*setp, font_text(), 0);
 }
 // Soft-3D/Neumorph (TD_NEO): Flaeche fast im Hintergrundton, wirkt herausgedrueckt.
 // LVGL kann nur einen Schatten je Objekt, daher zwei verschachtelte Objekte:
@@ -889,7 +997,7 @@ static void tempNeo(lv_obj_t* parent, const char* title, lv_color_t accent,
     lv_obj_t* t = lv_label_create(inner);
     lv_label_set_text(t, title);
     lv_obj_set_style_text_color(t, accent, 0);
-    lv_obj_set_style_text_font(t, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(t, font_text(), 0);
     *big = lv_label_create(inner);
     lv_label_set_text(*big, "--.-");
     lv_obj_set_style_text_color(*big, COL_TEXT, 0);
@@ -897,7 +1005,7 @@ static void tempNeo(lv_obj_t* parent, const char* title, lv_color_t accent,
     *setp = lv_label_create(inner);
     lv_label_set_text(*setp, "Soll --.-");
     lv_obj_set_style_text_color(*setp, COL_TEXT_DIM, 0);
-    lv_obj_set_style_text_font(*setp, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(*setp, font_text(), 0);
     *bar = lv_bar_create(inner);                                   // "eingelassener" Balken: Track dunkler als Flaeche
     lv_obj_set_size(*bar, LV_PCT(78), 10);
     lv_obj_set_style_bg_color(*bar, lv_color_hex(0x0a0a0a), 0);
@@ -979,7 +1087,7 @@ static void tempThermo(lv_obj_t* parent, const char* title, lv_color_t accent,
     lv_obj_t* t = lv_label_create(col);
     lv_label_set_text(t, title);
     lv_obj_set_style_text_color(t, accent, 0);
-    lv_obj_set_style_text_font(t, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(t, font_text(), 0);
     *big = lv_label_create(col);
     lv_label_set_text(*big, "--.-");
     lv_obj_set_style_text_color(*big, COL_TEXT, 0);
@@ -987,7 +1095,7 @@ static void tempThermo(lv_obj_t* parent, const char* title, lv_color_t accent,
     *setp = lv_label_create(col);
     lv_label_set_text(*setp, "Soll --.-");
     lv_obj_set_style_text_color(*setp, COL_TEXT_DIM, 0);
-    lv_obj_set_style_text_font(*setp, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(*setp, font_text(), 0);
 }
 // Temperaturzeile gemaess aktivem Design (neu) befuellen - auch beim Umschalten zur Laufzeit
 static void build_temp_row_content() {
@@ -1039,7 +1147,7 @@ static lv_obj_t* infoCell(lv_obj_t* parent, const char* title, lv_obj_t** val, l
     *val = lv_label_create(card);
     lv_label_set_text(*val, "--");
     lv_obj_set_style_text_color(*val, COL_TEXT, 0);
-    lv_obj_set_style_text_font(*val, &lv_font_maven_pro_28, 0);
+    lv_obj_set_style_text_font(*val, font_title(), 0);
     lv_obj_set_style_text_align(*val, LV_TEXT_ALIGN_CENTER, 0);   // fuer mehrzeilige Werte
     return card;
 }
@@ -1247,7 +1355,7 @@ static lv_obj_t* build_temp_arc(lv_obj_t* parent, const char* title, lv_color_t
     lv_obj_t* t = lv_label_create(card);
     lv_label_set_text(t, title);
     lv_obj_set_style_text_color(t, accent, 0);
-    lv_obj_set_style_text_font(t, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(t, font_text(), 0);
 
     lv_obj_t* arc = lv_arc_create(card);
     lv_obj_set_size(arc, 180, 180);
@@ -1424,7 +1532,7 @@ static void build_light(lv_obj_t* p) {
     lv_obj_set_size(btnLight, 320, 150);
     lv_obj_add_event_cb(btnLight, light_cb, LV_EVENT_CLICKED, nullptr);
     lv_obj_t* l = lv_obj_get_child(btnLight, 0);
-    if (l) lv_obj_set_style_text_font(l, &lv_font_maven_pro_28, 0);
+    if (l) lv_obj_set_style_text_font(l, font_title(), 0);
 }
 
 // =====================================================================================
@@ -1490,13 +1598,13 @@ static void build_chart(lv_obj_t* p) {
         g_chartWinBtn[i] = th_button(btns, winNames[i], COL_CARD2, COL_TEXT);
         lv_obj_set_style_pad_hor(g_chartWinBtn[i], 10, 0);
         lv_obj_set_style_pad_ver(g_chartWinBtn[i], 5, 0);
-        lv_obj_set_style_text_font(lv_obj_get_child(g_chartWinBtn[i], 0), &lv_font_maven_pro_14, 0);
+        lv_obj_set_style_text_font(lv_obj_get_child(g_chartWinBtn[i], 0), font_small(), 0);
         lv_obj_add_event_cb(g_chartWinBtn[i], chart_win_btn_cb, LV_EVENT_CLICKED, (void*)(intptr_t)i);
     }
     g_chartDutyBtn = th_button(btns, "Leistung", COL_CARD2, COL_TEXT);
     lv_obj_set_style_pad_hor(g_chartDutyBtn, 10, 0);
     lv_obj_set_style_pad_ver(g_chartDutyBtn, 5, 0);
-    lv_obj_set_style_text_font(lv_obj_get_child(g_chartDutyBtn, 0), &lv_font_maven_pro_14, 0);
+    lv_obj_set_style_text_font(lv_obj_get_child(g_chartDutyBtn, 0), font_small(), 0);
     lv_obj_add_event_cb(g_chartDutyBtn, chart_duty_btn_cb, LV_EVENT_CLICKED, nullptr);
     chart_win_btns_refresh();
 
@@ -1528,7 +1636,7 @@ static void build_chart(lv_obj_t* p) {
     g_tuneCardTitle = lv_label_create(tcol);
     lv_label_set_text(g_tuneCardTitle, "PID-Tuning läuft...");
     lv_obj_set_style_text_color(g_tuneCardTitle, COL_WARN, 0);
-    lv_obj_set_style_text_font(g_tuneCardTitle, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(g_tuneCardTitle, font_text(), 0);
     g_tuneCardBody = lv_label_create(tcol);
     lv_label_set_text(g_tuneCardBody, "--");
     lv_obj_set_style_text_color(g_tuneCardBody, COL_TEXT, 0);
@@ -1585,7 +1693,7 @@ static void build_chart(lv_obj_t* p) {
     lv_obj_t* ax[3] = { g_axHi, g_axMid, g_axLo };
     for (int i = 0; i < 3; i++) {
         lv_obj_set_style_text_color(ax[i], COL_TEXT_DIM, 0);
-        lv_obj_set_style_text_font(ax[i], &lv_font_maven_pro_14, 0);
+        lv_obj_set_style_text_font(ax[i], font_small(), 0);
         lv_label_set_text(ax[i], "--");
     }
 
@@ -1777,7 +1885,7 @@ static lv_obj_t* sum_stat_col(lv_obj_t* parent, const char* caption, lv_obj_t**
     lv_obj_t* c = lv_label_create(col);
     lv_label_set_text(c, caption);
     lv_obj_set_style_text_color(c, COL_TEXT_DIM, 0);
-    lv_obj_set_style_text_font(c, &lv_font_maven_pro_14, 0);
+    lv_obj_set_style_text_font(c, font_small(), 0);
     lv_obj_clear_flag(c, LV_OBJ_FLAG_CLICKABLE);
     if (valOut) *valOut = v;
     return col;
@@ -1939,7 +2047,7 @@ static lv_obj_t* bz_stat_block(lv_obj_t* parent, const char* caption, lv_obj_t**
     lv_obj_t* c = lv_label_create(blk);
     lv_label_set_text(c, caption);
     lv_obj_set_style_text_color(c, COL_TEXT_MUT, 0);
-    lv_obj_set_style_text_font(c, &lv_font_maven_pro_14, 0);
+    lv_obj_set_style_text_font(c, font_small(), 0);
     lv_obj_t* v = lv_label_create(blk);
     lv_label_set_text(v, "--");
     lv_obj_set_style_text_color(v, col, 0);
@@ -1972,7 +2080,7 @@ static void build_brew_live_screen() {
     lv_obj_t* title = lv_label_create(top);
     lv_label_set_text(title, "Bezug läuft");
     lv_obj_set_style_text_color(title, COL_ACCENT, 0);
-    lv_obj_set_style_text_font(title, &lv_font_maven_pro_28, 0);
+    lv_obj_set_style_text_font(title, font_title(), 0);
     lv_obj_t* closeBtn = th_button(top, LV_SYMBOL_CLOSE, COL_CARD2, COL_TEXT);
     lv_obj_set_size(closeBtn, 56, 40);
     lv_obj_add_event_cb(closeBtn, brew_live_close_cb, LV_EVENT_CLICKED, nullptr);
@@ -1998,11 +2106,11 @@ static void build_brew_live_screen() {
     lv_obj_clear_flag(left, LV_OBJ_FLAG_SCROLLABLE);
     bz_stat_block(left, "ZEIT", &g_bzTimer, &lv_font_maven_pro_48, COL_ACCENT);
     g_bzWeightBlock = bz_stat_block(left, "GEWICHT", &g_bzWeight, &lv_font_maven_pro_48, COL_TEXT);
-    g_bzFlowBlock   = bz_stat_block(left, "FLOW", &g_bzFlow, &lv_font_maven_pro_28, COL_TEXT);
+    g_bzFlowBlock   = bz_stat_block(left, "FLOW", &g_bzFlow, font_title(), COL_TEXT);
     g_bzPhase = lv_label_create(left);
     lv_label_set_text(g_bzPhase, "");
     lv_obj_set_style_text_color(g_bzPhase, COL_ACCENT, 0);
-    lv_obj_set_style_text_font(g_bzPhase, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(g_bzPhase, font_text(), 0);
     lv_obj_add_flag(g_bzPhase, LV_OBJ_FLAG_HIDDEN);
 
     g_bzChartWrap = lv_obj_create(main);
@@ -2017,7 +2125,7 @@ static void build_brew_live_screen() {
     lv_obj_t* chartCap = lv_label_create(g_bzChartWrap);
     lv_label_set_text(chartCap, "Flow-Verlauf (letzte 30 s)");
     lv_obj_set_style_text_color(chartCap, COL_TEXT_MUT, 0);
-    lv_obj_set_style_text_font(chartCap, &lv_font_maven_pro_14, 0);
+    lv_obj_set_style_text_font(chartCap, font_small(), 0);
     g_bzChart = lv_chart_create(g_bzChartWrap);
     lv_obj_set_width(g_bzChart, LV_PCT(100));
     lv_obj_set_flex_grow(g_bzChart, 1);
@@ -2049,7 +2157,7 @@ static void build_brew_live_screen() {
     g_bzBarLbl = lv_label_create(g_bzBarRow);
     lv_label_set_text(g_bzBarLbl, "");
     lv_obj_set_style_text_color(g_bzBarLbl, COL_TEXT_DIM, 0);
-    lv_obj_set_style_text_font(g_bzBarLbl, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(g_bzBarLbl, font_text(), 0);
     g_bzBar = lv_bar_create(g_bzBarRow);
     lv_obj_set_size(g_bzBar, LV_PCT(100), 14);
     lv_bar_set_range(g_bzBar, 0, 100);
@@ -2102,7 +2210,23 @@ static void build_brew(lv_obj_t* p) {
     swSBT      = add_switch(cSBT, "Aktiv");
     taSbtSecs  = add_num(cSBT, "Zielzeit (s)");
 
+#if JC_PANEL_TYPE == WS_PANEL_7H
+    // Zwei Spalten: links, was den Bezug startet, rechts, was ihn beendet.
+    page_grid(p, PAGE_COLS_2, PAGE_ROWS_2C);
+    grid_at(cPI,  0, 0);
+    grid_at(cBBW, 1, 0);
+    grid_at(cBBT, 0, 1);
+    grid_at(cSBT, 1, 1);
+
+    // Speichern frei unter den Karten, nicht in einer davon: Der Knopf speichert die ganze
+    // Seite und wuerde in einer einzelnen Karte so wirken, als gaelte er nur fuer diese.
+    lv_obj_t* sb = th_accent_button(p, "Brühen speichern");
+    lv_obj_add_event_cb(sb, send_save_brew, LV_EVENT_CLICKED, nullptr);
+    lv_obj_set_width(sb, LV_SIZE_CONTENT);
+    lv_obj_set_grid_cell(sb, LV_GRID_ALIGN_END, 0, 2, LV_GRID_ALIGN_START, 2, 1);
+#else
     add_save_button(p, "Brühen speichern", send_save_brew);
+#endif
 }
 
 // =====================================================================================
@@ -2164,14 +2288,28 @@ static void build_coldex(lv_obj_t* p) {
     taCxPumpMaxRun = add_num(cPump, "Max. Laufzeit (s)");
     taCxPumpRest   = add_num(cPump, "Zwangspause (s)");
 
-    lblCxPageHint = lv_label_create(p);
+    // Der Warnhinweis stand frueher als eigene Zeile am Seitenende - weit entfernt von dem
+    // Schalter, auf den er sich bezieht. Er gehoert in die Modus-Karte.
+    lblCxPageHint = lv_label_create(cMode);
     lv_label_set_long_mode(lblCxPageHint, LV_LABEL_LONG_WRAP);
     lv_obj_set_width(lblCxPageHint, LV_PCT(100));
     lv_obj_set_style_text_color(lblCxPageHint, COL_WARN, 0);
     lv_label_set_text(lblCxPageHint, "");
     lv_obj_add_flag(lblCxPageHint, LV_OBJ_FLAG_HIDDEN);
 
+#if JC_PANEL_TYPE == WS_PANEL_7H
+    // Drei Spalten, oben die Karten mit Erklaerungstext, darunter die knappen.
+    page_grid(p, PAGE_COLS_3, PAGE_ROWS_2C);
+    grid_at(cMode, 0, 0);  grid_at(cPre,  1, 0);  grid_at(cEnd,  2, 0);
+    grid_at(cBase, 0, 1);  grid_at(cMain, 1, 1);  grid_at(cPump, 2, 1);
+
+    lv_obj_t* sbCx = th_accent_button(p, "Cold Extraction speichern");
+    lv_obj_add_event_cb(sbCx, send_save_coldex, LV_EVENT_CLICKED, nullptr);
+    lv_obj_set_width(sbCx, LV_SIZE_CONTENT);
+    lv_obj_set_grid_cell(sbCx, LV_GRID_ALIGN_END, 0, 3, LV_GRID_ALIGN_START, 2, 1);
+#else
     add_save_button(p, "Cold Extraction speichern", send_save_coldex);
+#endif
 }
 // Felder nur beim Oeffnen der Seite fuellen - laufende State-Pushes duerfen eine
 // begonnene Eingabe nicht ueberschreiben (gleiches Muster wie populate_brew).
@@ -2231,7 +2369,7 @@ static lv_obj_t* cln_stepper(lv_obj_t* parent, const char* label, lv_event_cb_t
     lv_obj_t* val = lv_label_create(grp);
     lv_label_set_text(val, "--");
     lv_obj_set_style_text_color(val, COL_TEXT, 0);
-    lv_obj_set_style_text_font(val, &lv_font_maven_pro_28, 0);
+    lv_obj_set_style_text_font(val, font_title(), 0);
     lv_obj_t* bp = th_button(grp, "+", COL_CARD2, COL_TEXT);
     lv_obj_set_size(bp, 64, 56);
     lv_obj_add_event_cb(bp, plus, LV_EVENT_CLICKED, nullptr);
@@ -2313,7 +2451,7 @@ static void build_cleaning_screen() {
     lv_obj_t* title = lv_label_create(hdr);
     lv_label_set_text(title, "Reinigungsassistent");
     lv_obj_set_style_text_color(title, COL_ACCENT, 0);
-    lv_obj_set_style_text_font(title, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(title, font_text(), 0);
 
     // --- Konfigurationsbereich (sichtbar, wenn inaktiv) ---
     g_clnCfg = lv_obj_create(g_clnScreen);
@@ -2358,7 +2496,7 @@ static void build_cleaning_screen() {
     lv_obj_set_width(g_clnProgLbl, LV_PCT(100));
     lv_label_set_text(g_clnProgLbl, "Reinigung läuft...");
     lv_obj_set_style_text_color(g_clnProgLbl, COL_TEXT, 0);
-    lv_obj_set_style_text_font(g_clnProgLbl, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(g_clnProgLbl, font_text(), 0);
 
     lv_obj_t* stopBtn = th_button(g_clnProgress, LV_SYMBOL_STOP "  Reinigung abbrechen", COL_DANGER, COL_TEXT);
     lv_obj_set_width(stopBtn, LV_PCT(100));
@@ -2402,7 +2540,66 @@ static void send_reset_maint(lv_event_t*) {
     g_client->sendCommand("saveService", "\"resetMaintenanceCounter\":true");
     showToast("Wartungszähler zurückgesetzt", false);
 }
+// Schriftgroesse waehlen. Speichert und startet neu - die Schriften stecken in bereits
+// angelegten Bedienelementen und lassen sich nicht nachtraeglich umhaengen.
+static void font_pick_cb(lv_event_t* e) {
+    font_step_save_and_restart((uint8_t)(intptr_t)lv_event_get_user_data(e));
+}
+
 static void build_service(lv_obj_t* p) {
+#if JC_PANEL_TYPE == WS_PANEL_7H
+    // Vier Karten in zwei Spalten. Frueher standen hier lose Zeilen unter blossen
+    // Zwischenueberschriften, dazwischen freistehende Knoepfe - schwer auseinanderzuhalten
+    // und laenger als der Bildschirm. Jede Funktion ist jetzt eine Karte, und der
+    // zugehoerige Speichern-Knopf sitzt darin: Anders als bei Bruehen und Cold Extraction
+    // speichert hier jede Karte etwas anderes, deshalb gehoert der Knopf zur Karte.
+    lv_obj_t* cMaint = group_card(p, "Wartungszähler");
+    lblMaintStatus = lv_label_create(cMaint);
+    lv_label_set_long_mode(lblMaintStatus, LV_LABEL_LONG_WRAP);
+    lv_obj_set_width(lblMaintStatus, LV_PCT(100));
+    lv_label_set_text(lblMaintStatus, "Bezüge seit Reset: --");
+    lv_obj_set_style_text_color(lblMaintStatus, COL_TEXT, 0);
+    taMaintInterval = add_num(cMaint, "Intervall (Bezüge)");
+    lv_obj_t* rowM = row(cMaint, nullptr);
+    lv_obj_t* rb = th_button(rowM, "Zähler zurücksetzen", COL_WARN, lv_color_hex(0x000000));
+    lv_obj_add_event_cb(rb, send_reset_maint, LV_EVENT_CLICKED, nullptr);
+    lv_obj_t* sbM = th_accent_button(rowM, "Speichern");
+    lv_obj_add_event_cb(sbM, send_save_maint, LV_EVENT_CLICKED, nullptr);
+
+    lv_obj_t* cFlush = group_card(p, "Flush-Zeiten", "Spüldauer für Wasser- und Dampfkreislauf");
+    taFlushDur      = add_num(cFlush, "Wasser-Flush (s)");
+    taSteamFlushDur = add_num(cFlush, "Dampf-Flush (s)");
+    add_save_button(cFlush, "Speichern", send_save_flush);
+
+    lv_obj_t* cLight = group_card(p, "Display-Helligkeit", "Gilt für dieses Touch-Display");
+    taBacklightActive  = add_num(cLight, "Aktiv (%)");
+    taBacklightStandby = add_num(cLight, "Standby-Uhr (%)");
+    add_save_button(cLight, "Speichern", send_save_display);
+
+    lv_obj_t* cCln = group_card(p, "Reinigung & Entkalkung",
+        "Der Assistent führt Schritt für Schritt durch den Vorgang");
+    swMaint2 = add_switch(cCln, "Wartungsmodus");
+    lv_obj_add_event_cb(swMaint2, maint_cb, LV_EVENT_VALUE_CHANGED, nullptr);
+    lv_obj_t* cb = th_accent_button(cCln, "Reinigungsassistent öffnen");
+    lv_obj_set_width(cb, LV_PCT(100));
+    lv_obj_add_event_cb(cb, cln_open, LV_EVENT_CLICKED, nullptr);
+
+
+    lv_obj_t* cFont = group_card(p, "Darstellung",
+        "Schriftgröße dieses Displays. Wirkt nach einem Neustart, der sofort erfolgt.");
+    lv_obj_t* rowF = row(cFont, nullptr);
+    static const char* FONT_NAMEN[3] = { "Klein", "Mittel", "Groß" };
+    for (uint8_t i = 0; i < 3; i++) {
+        lv_obj_t* fb = (i == g_fontStep) ? th_accent_button(rowF, FONT_NAMEN[i])
+                                         : th_button(rowF, FONT_NAMEN[i], COL_CARD2, COL_TEXT);
+        lv_obj_add_event_cb(fb, font_pick_cb, LV_EVENT_CLICKED, (void*)(intptr_t)i);
+    }
+
+    page_grid(p, PAGE_COLS_2, PAGE_ROWS_2C);
+    grid_at(cMaint, 0, 0);  grid_at(cFlush, 1, 0);
+    grid_at(cLight, 0, 1);  grid_at(cCln,   1, 1);
+    grid_at(cFont,  0, 2, 2);
+#else
     section_title(p, "Reinigung & Wartung");
 
     // Live-Status (Zaehler / Intervall / Faelligkeit) - aktualisiert ui_update
@@ -2417,37 +2614,32 @@ static void build_service(lv_obj_t* p) {
     lv_label_set_text(lblMaintStatus, "Bezüge seit Reset: --");
     lv_obj_set_style_text_color(lblMaintStatus, COL_TEXT, 0);
 
-    // Intervall einstellen + speichern
     taMaintInterval = add_num(p, "Intervall (Bezüge)");
     add_save_button(p, "Intervall speichern", send_save_maint);
 
-    // Zaehler zuruecksetzen
     lv_obj_t* rb = th_button(p, "Wartungszähler zurücksetzen", COL_WARN, lv_color_hex(0x000000));
     lv_obj_set_width(rb, LV_PCT(100));
     lv_obj_add_event_cb(rb, send_reset_maint, LV_EVENT_CLICKED, nullptr);
 
-    // Flush-Zeiten (Wasser- und Dampfkreislauf), 1..30 s - wie in der Web-UI der S3
     section_title(p, "Flush-Zeiten");
     taFlushDur      = add_num(p, "Wasser-Flush (s)");
     taSteamFlushDur = add_num(p, "Dampf-Flush (s)");
     add_save_button(p, "Flush-Zeiten speichern", send_save_flush);
 
-    // Display-Helligkeit dieses Touch-Displays (aktiv 5..100 %, Standby-Uhr 0..100 %)
     section_title(p, "Display-Helligkeit");
     taBacklightActive  = add_num(p, "Aktiv (%)");
     taBacklightStandby = add_num(p, "Standby-Uhr (%)");
     add_save_button(p, "Helligkeit speichern", send_save_display);
 
-    // Reinigungsassistent (eigener Sub-Screen mit Parametern + Live-Fortschritt)
     section_title(p, "Reinigungsassistent");
     lv_obj_t* cb = th_accent_button(p, "Reinigungsassistent öffnen");
     lv_obj_set_width(cb, LV_PCT(100));
     lv_obj_add_event_cb(cb, cln_open, LV_EVENT_CLICKED, nullptr);
 
-    // Wartungsmodus-Toggle (gleiche Aktion wie auf der Temperatur-Seite)
     section_title(p, "Wartungsmodus (Entkalkung)");
     swMaint2 = add_switch(p, "Wartungsmodus");
     lv_obj_add_event_cb(swMaint2, maint_cb, LV_EVENT_VALUE_CHANGED, nullptr);
+#endif
 }
 
 // =====================================================================================
@@ -2692,7 +2884,7 @@ static void prof_picker_open() {
     lv_obj_t* t = lv_label_create(hdr);
     lv_label_set_text(t, "Profil laden");
     lv_obj_set_style_text_color(t, COL_ACCENT, 0);
-    lv_obj_set_style_text_font(t, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(t, font_text(), 0);
     lv_obj_t* x = th_button(hdr, LV_SYMBOL_CLOSE, COL_CARD2, COL_TEXT);
     lv_obj_add_event_cb(x, prof_picker_close_cb, LV_EVENT_CLICKED, nullptr);
 
@@ -2772,7 +2964,7 @@ static void info_block(lv_obj_t* card, const char* title, lv_obj_t** valOut, con
     lv_obj_t* t = lv_label_create(card);
     lv_label_set_text(t, title);
     lv_obj_set_style_text_color(t, COL_ACCENT, 0);
-    lv_obj_set_style_text_font(t, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(t, font_text(), 0);
     lv_obj_t* v = lv_label_create(card);
     lv_obj_set_width(v, LV_PCT(100));
     lv_label_set_text(v, initial);
@@ -3176,8 +3368,12 @@ void ui_init(ProtocolClient* client) {
       prefs.end();
       if (g_tempDesign >= TD_DESIGN_COUNT) g_tempDesign = TD_GAUGE; }
 
+    font_step_load();          // gewaehlte Schriftgroesse, bevor irgendetwas angelegt wird
+
     lv_obj_t* scr = lv_screen_active();
     lv_obj_set_style_bg_color(scr, COL_BG, 0);
+    // Grundschrift am Bildschirm: Alles, was keine eigene Schrift setzt, erbt sie von hier.
+    lv_obj_set_style_text_font(scr, font_small(), 0);
     lv_obj_clear_flag(scr, LV_OBJ_FLAG_SCROLLABLE);
 
     // --- Kopfleiste ---
@@ -3207,7 +3403,7 @@ void ui_init(ProtocolClient* client) {
     lv_obj_set_style_text_color(g_hdrTitle, COL_TEXT, 0);
     lv_obj_set_style_pad_left(g_hdrTitle, 10, 0);
     lv_obj_set_flex_grow(g_hdrTitle, 1);
-    lv_obj_set_style_text_font(g_hdrTitle, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(g_hdrTitle, font_text(), 0);
 
     // Profil-Chip: zuletzt geladenes Profil ("*" = seitdem geaenderte Einstellungen).
     // Antippen oeffnet die Profil-Schnellwahl. Unsichtbar, solange die S3 kein Profil meldet.
@@ -3255,7 +3451,7 @@ void ui_init(ProtocolClient* client) {
     lv_label_set_text(g_clock, "");
     lv_obj_set_style_text_color(g_clock, COL_TEXT, 0);
     lv_obj_set_style_pad_right(g_clock, 10, 0);
-    lv_obj_set_style_text_font(g_clock, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(g_clock, font_text(), 0);
 
     g_wifiIcon = lv_label_create(header);
     lv_label_set_text(g_wifiIcon, LV_SYMBOL_WIFI);
@@ -3387,7 +3583,7 @@ void ui_init(ProtocolClient* client) {
     lv_obj_set_width(g_wakeMsg, LV_PCT(100));
     lv_obj_set_style_text_align(g_wakeMsg, LV_TEXT_ALIGN_CENTER, 0);
     lv_obj_set_style_text_color(g_wakeMsg, COL_TEXT, 0);
-    lv_obj_set_style_text_font(g_wakeMsg, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(g_wakeMsg, font_text(), 0);
     lv_label_set_text(g_wakeMsg, "Die Maschine befindet sich im Standby.\nAus dem Standby aufwecken?");
     lv_obj_t* wakeBtns = lv_obj_create(wakeCard);
     lv_obj_set_width(wakeBtns, LV_PCT(100));
@@ -3431,15 +3627,15 @@ void ui_init(ProtocolClient* client) {
     lv_obj_t* otaTitle = lv_label_create(g_otaScreen);
     lv_label_set_text(otaTitle, "Display-Firmware-Update");
     lv_obj_set_style_text_color(otaTitle, COL_ACCENT, 0);
-    lv_obj_set_style_text_font(otaTitle, &lv_font_maven_pro_28, 0);
+    lv_obj_set_style_text_font(otaTitle, font_title(), 0);
     g_otaStatus = lv_label_create(g_otaScreen);
     lv_label_set_text(g_otaStatus, "Bitte warten...");
     lv_obj_set_style_text_color(g_otaStatus, COL_TEXT, 0);
-    lv_obj_set_style_text_font(g_otaStatus, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(g_otaStatus, font_text(), 0);
     g_otaBytes = lv_label_create(g_otaScreen);
     lv_label_set_text(g_otaBytes, "");
     lv_obj_set_style_text_color(g_otaBytes, COL_TEXT_DIM, 0);
-    lv_obj_set_style_text_font(g_otaBytes, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(g_otaBytes, font_text(), 0);
     lv_obj_add_flag(g_otaScreen, LV_OBJ_FLAG_HIDDEN);
 
     // Shot-Zusammenfassung (zentrierte Karte mit grossen Werten, antippbar zum Schliessen)
@@ -3464,7 +3660,7 @@ void ui_init(ProtocolClient* client) {
     lv_obj_t* sumTitle = lv_label_create(g_shotSum);
     lv_label_set_text(sumTitle, "Bezug beendet");
     lv_obj_set_style_text_color(sumTitle, COL_ACCENT, 0);
-    lv_obj_set_style_text_font(sumTitle, &lv_font_maven_pro_28, 0);
+    lv_obj_set_style_text_font(sumTitle, font_title(), 0);
     lv_obj_t* sumRow = lv_obj_create(g_shotSum);
     lv_obj_set_size(sumRow, LV_PCT(100), LV_SIZE_CONTENT);
     lv_obj_set_style_bg_opa(sumRow, LV_OPA_TRANSP, 0);
@@ -3501,7 +3697,7 @@ void ui_init(ProtocolClient* client) {
     lv_obj_t* splashSub = lv_label_create(g_splash);
     lv_label_set_text(splashSub, "Siebträgersteuerung");
     lv_obj_set_style_text_color(splashSub, COL_TEXT_DIM, 0);
-    lv_obj_set_style_text_font(splashSub, &lv_font_maven_pro_18, 0);
+    lv_obj_set_style_text_font(splashSub, font_text(), 0);
     lv_obj_t* splashSpin = lv_spinner_create(g_splash);
     lv_spinner_set_anim_params(splashSpin, 1000, 60);
     lv_obj_set_size(splashSpin, 48, 48);
@@ -3511,7 +3707,7 @@ void ui_init(ProtocolClient* client) {
     lv_obj_t* splashVer = lv_label_create(g_splash);
     lv_label_set_text(splashVer, "Firmware " DISPLAY_FW_VERSION);
     lv_obj_set_style_text_color(splashVer, COL_TEXT_MUT, 0);
-    lv_obj_set_style_text_font(splashVer, &lv_font_maven_pro_14, 0);
+    lv_obj_set_style_text_font(splashVer, font_small(), 0);
     g_splashActive = true;
     ui_fade_in(g_splash, UI_FADE_MS);   // weiches Erscheinen beim Boot