From 440ff22bda091e9474618e8674177aaf69b7dbd5 Mon Sep 17 00:00:00 2001
From: Tobi G <tobias.gsa@t-online.de>
Date: Thu, 13 Aug 2026 20:52:07 +0200
Subject: [PATCH] EU-Data-Act-Reste bereinigt, Slider-Bug behoben, zwei
 Design-Audit-Runden umgesetzt

Entfernt die letzten Verweise auf die abgeloeste TommiG1/HA_VAG-EU-Data-Act-
Integration (Versionstile, Testumgebungs-Fixture) und ersetzt sie durch die
FMM003-Werte. Behebt eine CSS-Spezifitaetskollision, durch die alle iOS-
Toggle-Switches viel zu breit gerendert wurden. Dokumentiert und behebt sieben
Layout-Befunde aus zwei Design-Audit-Runden (Zahnrad-Ueberlauf auf breiten
Bildschirmen, zu kleine Ringe als mobiler Einstellungen-Zugang, zu breite
Popups, Kopfzeilen-Versatz, ueberlappende Kachel-Pfeile, fehlender
Editierbarkeits-Hinweis bei Auswahlfeldern, Haekchen-artige Auf/Zu-Pfeile) -
siehe DESIGN_AUDIT_2026-08-13.md fuer Root-Cause und Beleg je Befund.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 AGENTS.md                                     |  75 ++++++-
 DESIGN_AUDIT_2026-08-13.md                    | 191 ++++++++++++++++++
 homeassistant/www/audi-dashboard-app.js       |   4 +-
 homeassistant/www/audi-dashboard-ios.css      |  41 +++-
 homeassistant/www/audi-dashboard-version.json |   2 +-
 homeassistant/www/audi-dashboard.css          |  21 +-
 testumgebung/README.md                        |  35 ++--
 testumgebung/konfiguration.yaml               |  26 +--
 8 files changed, 353 insertions(+), 42 deletions(-)
 create mode 100644 DESIGN_AUDIT_2026-08-13.md

diff --git a/AGENTS.md b/AGENTS.md
index 870b02f..5e98cbb 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -1,7 +1,10 @@
 # AGENTS.md — Project state, review findings, open items, and working rules
 
 **Last updated: 2026-08-13** (merged the `umsetzung-datametric360` branch — companion app phases
-1–10 done, see `UMSETZUNGSPLAN.md`). This file is the entry point for every new agent
+1–10 done, see `UMSETZUNGSPLAN.md`; later the same day: cleaned up remaining EU Data Act residue,
+fixed oversized toggle switches, and fixed a desktop-layout audit (settings button / rings logo /
+popups overflowing past the capped content column) — see `DESIGN_AUDIT_2026-08-13.md` and section
+C). This file is the entry point for every new agent
 session: what this repo is, what is finished, what is missing, and how to work here. Detail lives in
 the linked documents — this file points, it does not duplicate.
 
@@ -528,6 +531,76 @@ wraps the web app for iPhone; a PWA home-screen install is the accepted intermed
       Abbrechen/Speichern and the "Einrichten"/"Setup"/"Fertig" buttons in Einstellungen render with
       the corrected fills at both mobile and desktop widths, switches render green, no console
       errors.
+- [x] Clean up remaining "EU Data Act" residue from the FMM003 pivot (2026-08-13) — the
+      Einstellungen "Version" tile in `audi-dashboard-app.js` hardcoded `Fahrzeugdaten: EU Data
+      Act / Abruf alle 15 Minuten` and `Position: iPhone / Companion App`, both stale: vehicle data
+      and position now come exclusively from the FMM003 (`ZUENDUNG_SENSOR`, `BATTERIE_SENSOR`,
+      `STANDORT_TRACKER` in `einstellungen.py`), not the abandoned HACS integration or the iPhone.
+      Both rows now read `FMM003`. Also fixed `testumgebung/konfiguration.yaml` +
+      `testumgebung/README.md`: the `input_text.test_wlan` / `iPhone WiFi Connection` template
+      sensor simulated WLAN-based trip detection, fully removed 2026-08-12 (`fahrzeug.wlan_ssid` no
+      longer exists anywhere) — its "Fahrt auslösen" example was non-functional. Replaced with
+      `input_boolean.test_zuendung` driving a `binary_sensor.testzone_fmm003_engine_ignition_or_acc_status`
+      template sensor matching the real `ZUENDUNG_SENSOR` entity ID, so trip detection stays
+      testable. The remaining KM/Tank/Range/door/window/lock template sensors correctly still
+      describe the abandoned `TommiG1/HA_VAG-EU-Data-Act` integration (per `einstellungen.py`) and
+      were left in place — those fields are blank by default but stay manually mappable via the
+      Setup menu, so the fixtures remain useful for testing that path; comments updated to make
+      this distinction explicit.
+- [x] Fix oversized toggle switches ("Slider") across the app (2026-08-13) — `.feld label` in
+      `audi-dashboard.css` (`flex: 1 1 auto`, meant to let the *text* label grow so the control
+      lands at the row's right edge) unintentionally also matched `<label class="switch">`, since
+      the toggle switch is itself implemented as a `<label>` — its own `.switch { flex-shrink: 0;
+      width: 46px }` rule lost because `.feld label` has equal-or-higher specificity and comes
+      later in the file. Every switch inside a `.feld` (Einstellungen, Tanken, Reifen, ...)
+      stretched to fill the row (~260-300px measured live, instead of 46-51px). Fixed by excluding
+      switches from the selector: `.feld label:not(.switch)`. Verified live in `audi_ha_test` at
+      mobile (375px) and desktop widths — switches render at the correct ~51px iOS size, no
+      console errors.
+- [x] Fix desktop (≥860px container) layout audit findings (2026-08-13, see
+      `DESIGN_AUDIT_2026-08-13.md` for full detail) — user-reported: (1) the settings gear button
+      sat far past the right edge of the visible content column on wide screens because `.topbar`
+      (grid-column:2, same track as `main#view`) had no `max-width:860px` while `main#view` did —
+      the track itself is `minmax(0,1fr)` and stretches to the full remaining window width, so
+      `.head{flex:1}` pushed `.profilbtn` to the track's far edge, ~450px past where `main#view`
+      visually ends. Fixed by giving `.topbar`/`.phone:has(.back.on) .topbar`/`.ptr` the same
+      `max-width:860px`. (2) In phone width the Audi rings (`#marke`/`.rings`) are, per existing
+      code comment, the *only* access to Einstellungen (the gear icon is hidden there) but were
+      42×24px — well under the 44px minimum touch target every sibling icon-button uses. Bumped to
+      58×32px. (3) Found while verifying (1): `.setup-popup`, `.sdpopup`, `.sheet`, and
+      `.standortmenu` are all `position:absolute` with `left`/`right` relative to the *full*
+      `.phone` box (sidebar included), not the content column, and had no desktop max-width either
+      — `.setup-popup` measured 1644px wide on a 1920px window (10px margins only). Fixed with
+      `max-width:560px` (`.setup-popup`/`.sdpopup`/`.sheet`) or `640px` (`.standortmenu`) plus
+      `margin-left/right:auto` in the same container query — deliberately not
+      `transform:translateX(-50%)`, which would fight these elements' own transform-based entry
+      animations. Centering is relative to the full `.phone` width (sidebar included), not the
+      860px content column exactly — a ~138px rightward offset from true content-center remains at
+      1920px; fixing that precisely would require moving these overlays into grid-column 2 in the
+      markup, deferred as a larger structural change. All three verified live in `audi_ha_test` at
+      375px and 1920px, no console errors.
+- [x] Fix 4 more user-reported design findings (2026-08-13, same session, see
+      `DESIGN_AUDIT_2026-08-13.md` "Runde 2" for full detail with before/after measurements):
+      (1) page title sat ~30px right of the content tiles below it on wide screens — `.back`
+      reserves 44px+gap in `.topbar` even when inactive (`opacity:0`, not `display:none`), fixed
+      with `.back:not(.on){width:0;...}` in the desktop container query, root pages only (detail
+      pages with `.back.on` unaffected, verified back-navigation still works). (2) the chevron on
+      the 5 `.go`-tiles (Fahrzeug/Service/Versicherung/Reifen/Schutzbrief on Mein Audi/Versicherung)
+      was vertically centered on the *entire* multi-row tile (`top:50%` in the iOS overlay) instead
+      of next to the title, overlapping wrapped row text — removed the override, falls back to the
+      base `top:var(--sp-5)` next-to-title position. (3) the Ölwechsel-Intervall `<select>` values
+      ("10.000 km"/"1 Jahr") looked like inert text — iOS overlay strips border/background from
+      `.feld select` and colors it the same grey as any other secondary text; added
+      `.feld select{color:var(--ios-tint)}` so picker fields read as editable the way iOS
+      conventionally signals it (accent color), free-text `.feld input`s deliberately left alone.
+      (4) the expand/collapse `.mark` chevron on group headers (Fahrten "2026"/"August") looked
+      like a checkmark — it uses the classic "2 borders + rotate(45deg)" CSS chevron technique,
+      which requires a square box; `.mark` was 6×10px (non-square, sized for the unrelated SVG-path
+      `.chev`/`.go` icons), made it 8×8px. Two more reported findings ("grey box around all menu
+      icons", "red partial frame on Fahrten/Tanken rows") were investigated (computed-style
+      diffing across all 5 tabs in both themes, a temporary 2.5x `transform:scale()` zoom on the
+      live swipe-row DOM) but could not be reproduced — documented in the audit file as open,
+      pending a screenshot from the real device.
 - [ ] Fix remaining documentation drift (statistics claim, README gaps, obsolete TODO comment) —
       text-only changes; INSTALL.md's WLAN/TommiG1 drift and stale variable names were fixed
       2026-08-12 (see section B); `DESIGN_REVIEW_2026-08-13.md` and `REVIEW_main_2026-08-13.md`
diff --git a/DESIGN_AUDIT_2026-08-13.md b/DESIGN_AUDIT_2026-08-13.md
new file mode 100644
index 0000000..513cd3e
--- /dev/null
+++ b/DESIGN_AUDIT_2026-08-13.md
@@ -0,0 +1,191 @@
+# Design Audit — 2026-08-13 (Grossbildschirm-Layout)
+
+Auslöser: zwei konkrete User-Reports ("Einstellungen-Knopf sitzt am Bildschirmrand, obwohl
+die App-Spalte schon vorher endet" und "die Ringe als Einstellungen-Knopf sind zu klein").
+Beide sind bestätigt, behoben und live im `audi_ha_test`-Container verifiziert (Desktop
+1920px + Mobil 375px, Chrome-Konsole fehlerfrei bis auf die vorbestehenden, unbezogenen
+Service-Worker-/Platzhalterbild-404-Meldungen). Im Zuge der Fehlersuche wurde ein dritter,
+verwandter Fehler im selben Muster gefunden und mitbehoben.
+
+Geprüft wurden Übersicht, Mein Audi, Fahrten, Statistik, Tanken und Einstellungen (inkl.
+Setup-Popup) bei 375px und 1920px. Die drei unten dokumentierten Befunde sind die einzigen
+gefundenen Abweichungen; der Rest folgt konsistent den bestehenden Tokens (`--r-tile`,
+Farbrollen aus dem iOS-Overlay, `.aktion`/`.switch`-Semantik).
+
+## Befund 1 — Zahnrad/Kopfzeile sass bei breiten Fenstern am Fensterrand statt am Inhaltsrand
+
+**Root Cause:** `.topbar` (enthält den Einstellungen-Knopf `.profilbtn`) liegt im
+Grossbildschirm-Raster (`@container (min-width:860px)` in `audi-dashboard-ios.css`) in
+Spalte 2 (`grid-column:2`), derselben Spalte wie `main#view`. `main#view` hat dort ein
+`max-width:860px`, `.topbar` hatte keins - die Spalte selbst ist aber `minmax(0,1fr)`, füllt
+also die volle restliche Fensterbreite. `.head{flex:1}` in der Kopfzeile hat den Rest der
+Zeile aufgefüllt und `.profilbtn` bis an den rechten Rand der vollen Spalte geschoben, weit
+hinter das Ende des sichtbaren Inhalts.
+
+**Beleg (1920px Fenster):** `main#view` endete bei `x=1380`, `.topbar` ging bis `x=1920`,
+`.profilbtn` sass bei `x=1832-1876` - eine Lücke von über 450px zwischen Inhaltsende und
+Knopf.
+
+**Fix:** `.topbar`, `.phone:has(.back.on) .topbar` und `.ptr` bekommen im
+860px-Container-Query dasselbe `max-width:860px` wie `main#view`. Nach dem Fix enden
+`.topbar` und `main#view` an derselben Kante (`x=1380`), der Knopf sitzt bei `x=1292-1336`,
+sichtbar über dem Inhalt.
+
+**Datei:** `homeassistant/www/audi-dashboard-ios.css`
+
+## Befund 2 — Audi-Ringe als einziger Einstellungen-Zugang in Telefonbreite zu klein
+
+**Root Cause:** In Telefonbreite blendet die iOS-Auflage das Zahnrad-Icon (`.profilbtn`) aus
+- die Audi-Ringe (`#marke`/`.rings`) sind dort laut eigenem Code-Kommentar "der einzige
+Zugang zu den Einstellungen" und seit einer früheren Session bewusst ein echter,
+tastaturbedienbarer Knopf. Die Knopfgrösse war mit 42×24px aber deutlich kleiner als jeder
+andere Symbol-Knopf in derselben Kopfzeile (`.themebtn`/`.profilbtn`/`.back` sind alle
+44×44px) und lag unter der üblichen 44px-Mindestgrösse für Tippflächen.
+
+**Fix:** `.rings` von 42×24px auf 58×32px vergrössert (Seitenverhältnis beibehalten,
+`.rings svg{width:58px}`). Funktion (Klick navigiert zu Einstellungen) unverändert getestet.
+
+**Datei:** `homeassistant/www/audi-dashboard.css`
+
+## Befund 3 — Popups/Sheets auf breiten Bildschirmen fast bildschirmbreit (gleiches Muster wie Befund 1)
+
+Beim Nachprüfen von Befund 1 fiel derselbe Fehler bei vier weiteren Elementen auf: sie sind
+`position:absolute` mit `left`/`right` relativ zu `.phone` (der vollen Rasterbreite,
+Seitenspalte inklusive) statt zur schmaleren Inhaltsspalte, ohne eigenes `max-width` für
+grosse Bildschirme:
+
+- `.setup-popup` (Sensor-Zuordnung) - **bestätigt live:** 1644px breit bei 1920px Fenster
+  (nur 10px Rand auf jeder Seite), praktisch bildschirmfüllend statt eines ruhigen Dialogs.
+- `.sdpopup` (SmartDeal-Aktivierung)
+- `.sheet` (Action-Sheet, ersetzt confirm()/alert() beim Löschen)
+- `.standortmenu` (Standort-Bottom-Sheet auf der Kartenansicht)
+
+**Fix:** Im selben 860px-Container-Query `max-width:560px` (Popups/Sheet) bzw. `max-width:
+640px` (Standortmenü, mehr Inhalt) plus `margin-left/right:auto` ergänzt - zentriert die
+Elemente innerhalb ihres bestehenden `left`/`right`-Abstands, ohne die
+Transform-basierte Einblend-Animation dieser Elemente anzufassen (eine
+`transform:translateX(-50%)`-Zentrierung hätte mit der `sheet-rein`-Keyframe-Animation
+kollidiert, die am Ende selbst `transform:none` setzt). `border-radius` bleibt jeweils
+unverändert (`.standortmenu` behält oben abgerundete/unten eckige Kanten, passend zur
+weiterhin am unteren Fensterrand andockenden Bauweise).
+
+**Beleg nach Fix (Setup-Popup, 1920px Fenster):** 560px breit, zentriert bei `x=808-1368`.
+
+**Datei:** `homeassistant/www/audi-dashboard-ios.css`
+
+## Nicht verändert (bewusst ausserhalb dieses Audits)
+
+- `.bildmenu` (Kontextmenü bei Fahrzeugbildern) ist bereits `min-width:160px` und wächst
+  nicht mit der Fensterbreite - kein Fehler.
+- Zentrierung der Popups erfolgt relativ zur vollen `.phone`-Breite (Seitenspalte
+  inklusive), nicht exakt zur Mitte der 860px-Inhaltsspalte - bei 1920px ein Versatz von
+  ca. 138px nach rechts gegenüber echter Inhaltsmitte. Sichtbar besser als der vorige
+  Zustand (praktisch volle Fensterbreite), aber für pixelgenaue Zentrierung müssten die
+  Popups im Markup in die Grid-Spalte 2 verschoben werden statt als Geschwister von
+  `main#view` direkt in `.phone` zu liegen - eine grössere strukturelle Änderung, hier
+  bewusst zurückgestellt.
+
+## Runde 2 — sechs weitere User-Findings
+
+Vier bestätigt, ursächlich geklärt und behoben; zwei trotz gezielter Suche (Computed-Style-
+Vergleich, 2.5x-Zoom per temporärem `transform:scale()` auf das Live-DOM, Tag- und
+Nacht-Theme) nicht reproduzierbar - siehe unten.
+
+### Befund 4 — Kopfzeile (Übersicht/Fahrten/...) auf breiten Bildschirmen 30px zu weit rechts
+
+**Root Cause:** `.back` (Zurück-Pfeil) ist auch inaktiv (`opacity:0`, kein `.on`) weiterhin
+ein 44px breites Flex-Element in `.topbar` plus `gap`. Auf Wurzelseiten ohne Zurück-Pfeil
+(Übersicht, Fahrten, ...) schiebt dieser unsichtbare Platzhalter `.head`/`.title` sichtbar
+weiter nach rechts als `main#view` darunter beginnt.
+
+**Beleg:** `.title` links bei `x=594`, die erste Kachel in `main#view` links bei `x=564` -
+30px Versatz.
+
+**Fix:** `.back:not(.on){width:0;min-width:0;margin:0;overflow:hidden}` im
+860px-Container-Query. Nur für Wurzelseiten relevant; auf Detailseiten (`.back.on`, z. B.
+Einzelfahrt) bleibt der Knopf unverändert 44px breit und funktionsfähig - live getestet
+(Klick navigiert zurück zur Liste).
+
+**Beleg nach Fix:** Versatz auf 4px reduziert (der verbleibende `gap` zum nächsten
+Flex-Element, nicht mehr wahrnehmbar).
+
+**Datei:** `homeassistant/www/audi-dashboard-ios.css`
+
+### Befund 5 — Graue Pfeile auf "Mein Audi" (Fahrzeug/Service/Versicherung/Reifen) überlappen Text
+
+**Root Cause:** `.tilebtn .go{top:50%;margin-top:-5px}` zentriert den Kachel-Chevron
+vertikal auf die **gesamte** Kachelhöhe. Diese fünf Kacheln sind aber keine Einzeiler,
+sondern `<span class="label">Titel</span>` + Chevron + eine ganze `dl.rows`-Liste darunter -
+die 50%-Mitte der gesamten Kachel liegt damit mitten in der Zeilenliste statt neben dem
+Titel, und überlappt besonders bei mehrzeilig umgebrochenen Werten (z. B. "2.9 TFSI quattro
+· 331 kW · 450 PS") sichtbar den Text.
+
+**Fix:** `top:50%;margin-top:-5px` aus der iOS-Auflage entfernt - fällt zurück auf
+`top:var(--sp-5)` aus der Basis, die den Chevron wieder neben den Titel oben in der Kachel
+setzt (dafür existiert dort bereits extra Padding: `.tile:has(> .go) > .label:first-child
+{padding-right:44px}`).
+
+**Betroffen:** alle 5 `.go`-Kacheln (Fahrzeug, Service, Versicherung/Steuer, Reifen,
+Schutzbrief Mobilität) - identisches Markup-Muster überall.
+
+**Datei:** `homeassistant/www/audi-dashboard-ios.css`
+
+### Befund 6 — "10.000 km" / "1 Jahr" (Ölwechsel-Intervall) sehen nicht editierbar aus
+
+**Root Cause:** Beide Werte sind echte `<select>`-Dropdowns, aber die iOS-Auflage entfernt
+Rahmen und Fläche komplett (`background:transparent;border:0`) und färbt den Wert in
+`--fg2` - demselben gedämpften Grau wie jeder andere Fliesstext. Kombiniert mit
+`appearance:none` (entfernt zusätzlich den nativen Auswahlpfeil des Browsers, base-CSS) gibt
+es keinerlei visuellen Hinweis, dass hier eine Auswahl möglich ist.
+
+**Fix:** `.feld select{color:var(--ios-tint)}` ergänzt - der Wert erscheint jetzt in der
+Marken-Akzentfarbe (Rot), dem iOS-üblichen Signal "hier gibt es eine Auswahl" bei
+Picker-artigen Feldern (anders als bei freien Texteingaben, die bewusst unverändert bleiben).
+
+**Datei:** `homeassistant/www/audi-dashboard-ios.css`
+
+### Befund 7 — Auf/Zu-Pfeile bei Gruppenkopfzeilen (z. B. "2026", "August" in Fahrten) sehen wie Häkchen aus
+
+**Root Cause:** `.mark` baut den Chevron aus der klassischen "zwei Kanten + 45°-Drehung"-
+CSS-Technik (`border-right`+`border-bottom`, `transform:rotate(-45deg/45deg)`). Diese
+Technik braucht zwingend ein **Quadrat** für eine saubere Pfeilform - `.mark` war aber
+6×10px (für die SVG-Chevrons `.chev`/`.go` gedacht, die eine eigene, absichtlich
+nicht-quadratische Pfad-Form nutzen). Die ungleich langen Kantenabschnitte (10px vs. 6px)
+ergeben verdreht eine Form, die eher wie ein Häkchen als ein Pfeil aussieht - besonders im
+per Default aufgeklappten Zustand (`rotate(45deg)`), in dem "2026"/"August" standardmässig
+starten.
+
+**Fix:** `.mark` auf 8×8px quadratisch gesetzt.
+
+**Datei:** `homeassistant/www/audi-dashboard.css`
+
+### Nicht reproduziert — Befund A: "Alle Menü-Icons haben eine graue Box"
+
+Programmatisch geprüft (`.tab`, `.tabpille`, `.tab svg`: `background`, `border`,
+`box-shadow`, `outline` für alle 5 Tabs sowohl im Seitenmenü (Desktop) als auch in der
+Tableiste unten (375px)): nur der **aktive** Tab hat eine (sehr dezente, 7% Deckkraft)
+graue Füllung - `.tab.on .tabpille{background:var(--tile-2)}`/`.tab.on{background:
+var(--ios-fill)}`, exakt wie beabsichtigt. Die vier inaktiven Tabs sind computed
+`rgba(0,0,0,0)` (vollständig transparent) auf allen geprüften Ebenen. Falls auf dem
+tatsächlichen Gerät etwas anderes zu sehen ist (z. B. alle 5 Icons mit sichtbarer Box),
+bräuchte es einen Screenshot vom echten Gerät/Browser, um die Abweichung von diesem
+Testcontainer einzugrenzen.
+
+### Nicht reproduziert — Befund B: "Roter Teilrahmen rechts an jeder Zeile" (Fahrten/Tanken)
+
+Geprüft: `.swipe-content{background:var(--tile-deckend)}` (deckend, #171B21 Nacht /
+#FFFFFF Tag) deckt den dahinterliegenden roten Löschen-Button (`.swipe-delete`,
+`rgb(255,69,58)`) vollständig ab - beide Boxen exakt deckungsgleich (`x`/`width`/`right`
+identisch bis auf Subpixel), kein CSS-seitiger Spalt gefunden. Bei 2.5x-Zoom (temporärer
+`transform:scale()` auf das Live-DOM, nicht deploybar, nur zur Inspektion) war am rechten
+Rand in Tag- und Nacht-Theme kein Rot sichtbar. Möglich, dass dies nur unter bestimmten
+Bedingungen auftritt (Swipe-Geste mitten in der Transition, ein bestimmter Zoom-/DPI-Stand
+auf dem echten Gerät) - ein Screenshot oder eine genauere Beschreibung, wann genau es
+auftritt (beim Laden, nach einer Wischgeste, permanent?), würde helfen.
+
+## Deployment
+
+Alle sieben Fixes deployed und verifiziert im `audi_ha_test`-Docker-Container
+(`audi-dashboard-version.json` → `1786744000`), nach `homeassistant/installationspaket/`
+synchronisiert. Konsole fehlerfrei bis auf die vorbestehenden, unbezogenen
+Service-Worker-/Platzhalterbild-404-Meldungen.
diff --git a/homeassistant/www/audi-dashboard-app.js b/homeassistant/www/audi-dashboard-app.js
index 42056dc..a8d762c 100644
--- a/homeassistant/www/audi-dashboard-app.js
+++ b/homeassistant/www/audi-dashboard-app.js
@@ -1925,8 +1925,8 @@ function vEinst() {
   <div class="tile"><span class="label">Version</span>
     <dl class="rows">
       <div class="row"><dt>Dashboard</dt><dd>${esc(CONFIG.version)}</dd></div>
-      <div class="row"><dt>Fahrzeugdaten</dt><dd>EU Data Act<small>Abruf alle 15 Minuten</small></dd></div>
-      <div class="row" style="border-bottom:0"><dt>Position</dt><dd>iPhone<small>Companion App</small></dd></div>
+      <div class="row"><dt>Fahrzeugdaten</dt><dd>FMM003<small>Zündung · Batterie</small></dd></div>
+      <div class="row" style="border-bottom:0"><dt>Position</dt><dd>FMM003<small>GPS-Tracker</small></dd></div>
     </dl>
     ${(() => {
       const s = UPDATE_STATUS;
diff --git a/homeassistant/www/audi-dashboard-ios.css b/homeassistant/www/audi-dashboard-ios.css
index 889e708..6cc6e32 100644
--- a/homeassistant/www/audi-dashboard-ios.css
+++ b/homeassistant/www/audi-dashboard-ios.css
@@ -91,7 +91,14 @@ main#view{--seitenrand:16px;padding:0 var(--seitenrand) 30px;scroll-behavior:smo
 .tile{padding:16px 18px;margin-bottom:14px;border-radius:var(--r-tile)}
 .tile.flat{padding:0}
 .tilebtn:hover{background:var(--tile-2)}
-.tilebtn .go{top:50%;margin-top:-5px;right:18px;stroke:var(--ios-grau);stroke-width:1.6}
+/* top/margin-top NICHT von der Basis uebernehmen: alle .go-Kacheln
+   (Fahrzeug/Service/Versicherung/Reifen/Schutzbrief) sind mehrzeilige
+   Kacheln mit .label oben plus einer ganzen dl.rows-Liste darunter - eine
+   vertikale 50%-Zentrierung landet dann mitten in der Zeilenliste statt
+   neben dem Titel und ueberlappt umgebrochenen Zeilentext (Design-Audit
+   2026-08-13). Bleibt bei top:var(--sp-5) aus der Basis, nur rechter
+   Abstand/Farbe werden fuer die iOS-Optik angepasst. */
+.tilebtn .go{right:18px;stroke:var(--ios-grau);stroke-width:1.6}
 .label{font-size:13px;letter-spacing:.01em;text-transform:none;color:var(--fg3)}
 .row{min-height:44px;padding:11px 0;border-bottom:1px solid var(--ios-sep)}
 .row dt{font-size:16px;color:var(--fg)}
@@ -131,6 +138,12 @@ main#view{--seitenrand:16px;padding:0 var(--seitenrand) 30px;scroll-behavior:smo
 .feld label{font-size:16px;color:var(--fg)}
 .feld input,.feld select{background:transparent;border:0;border-radius:8px;font-size:16px;
   padding:8px 4px;color:var(--fg2)}
+/* Design-Audit 2026-08-13: ein <select> (z.B. Oelwechsel-Intervall "10.000 km"/
+   "1 Jahr") sah wie reiner, nicht editierbarer Text aus, seit hier Rahmen/
+   Flaeche entfernt wurden - anders als bei freien Texteingaben zeigt iOS bei
+   Picker-Feldern wie diesem ueblicherweise die Akzentfarbe statt Fliesstext-
+   Grau als Hinweis "hier gibt es eine Auswahl". */
+.feld select{color:var(--ios-tint)}
 .feld input:focus,.feld select:focus{background:var(--ios-fill);color:var(--fg)}
 .mitEinheit input{background:var(--ios-fill);padding:8px 10px}
 .notiz{background:var(--ios-fill);border:0;border-radius:12px;font-size:16px}
@@ -207,12 +220,22 @@ main#view{--seitenrand:16px;padding:0 var(--seitenrand) 30px;scroll-behavior:smo
   :host > div{height:calc(100dvh - 24px)}
   .phone{display:grid;grid-template-columns:264px minmax(0,1fr);
     grid-template-rows:auto auto minmax(0,1fr)}
-  .topbar{grid-column:2;grid-row:1;padding:38px 44px 8px}
-  .phone:has(.back.on) .topbar{grid-column:2;grid-row:1;padding:34px 44px 8px;justify-content:flex-start}
+  /* max-width:860px muss zu main#view passen, sonst treibt der Flex-Inhalt
+     (.head{flex:1} schiebt .profilbtn nach rechts) das Zahnrad bis an den
+     Rand der vollen Grid-Spalte statt an den Rand der Inhaltsspalte darunter -
+     auf breiten Bildschirmen klaffte da eine sichtbare Luecke. */
+  .topbar{grid-column:2;grid-row:1;padding:38px 44px 8px;max-width:860px}
+  .phone:has(.back.on) .topbar{grid-column:2;grid-row:1;padding:34px 44px 8px;justify-content:flex-start;max-width:860px}
+  /* Design-Audit 2026-08-13: .back ist auch inaktiv (opacity:0) noch ein
+     44px breites Flex-Element plus Gap - auf Wurzelseiten ohne Zurueck-Pfeil
+     schob das die Kopfzeile (.head/.title) sichtbar weiter nach rechts als
+     main#view darunter beginnt. Auf Detailseiten (.back.on) bleibt der Platz
+     bewusst reserviert, das ist dort ein echter, bedienbarer Knopf. */
+  .back:not(.on){width:0;min-width:0;margin:0;overflow:hidden}
   .phone:has(.back.on) .head{align-items:flex-start}
   .phone:has(.back.on) .title{font-size:26px;text-align:left}
   .title{font-size:34px}
-  .ptr{grid-column:2;grid-row:2}
+  .ptr{grid-column:2;grid-row:2;max-width:860px}
   main#view{--seitenrand:44px;grid-column:2;grid-row:3;padding:8px var(--seitenrand) 48px;max-width:860px}
 
   .tabbar{grid-column:1;grid-row:1 / 4;display:flex;flex-direction:column;gap:4px;
@@ -247,6 +270,16 @@ main#view{--seitenrand:16px;padding:0 var(--seitenrand) 30px;scroll-behavior:smo
   .carfix.klein,.bildbox.carfix.klein{height:220px}
   .bildgrid{grid-template-columns:repeat(4,1fr)}
   .quad{gap:14px}
+
+  /* Design-Audit 2026-08-13: .setup-popup/.sdpopup/.sheet/.standortmenu sind
+     position:absolute relativ zu .phone (der vollen Rasterbreite, nicht nur
+     der Inhaltsspalte) mit left/right auf einen festen Abstand - auf breiten
+     Bildschirmen ergab das einen fast bildschirmbreiten Dialog statt einer
+     ruhigen Karte. max-width + margin:auto zentriert sie innerhalb des
+     bestehenden left/right-Abstands, ohne die transform-basierte
+     Einblend-Animation dieser Elemente zu beruehren. */
+  .setup-popup,.sdpopup,.sheet{max-width:560px;margin-left:auto;margin-right:auto}
+  .standortmenu{max-width:640px;margin-left:auto;margin-right:auto}
 }
 
 /* Fahrzeugbild randlos wie in einer Fahrzeug-App: der Platzhalter bleibt
diff --git a/homeassistant/www/audi-dashboard-version.json b/homeassistant/www/audi-dashboard-version.json
index f3e30eb..5514bea 100644
--- a/homeassistant/www/audi-dashboard-version.json
+++ b/homeassistant/www/audi-dashboard-version.json
@@ -1 +1 @@
-{"version": 1786730400}
+{"version": 1786744000}
diff --git a/homeassistant/www/audi-dashboard.css b/homeassistant/www/audi-dashboard.css
index 69b052d..9557bec 100644
--- a/homeassistant/www/audi-dashboard.css
+++ b/homeassistant/www/audi-dashboard.css
@@ -173,8 +173,13 @@
    bedienbar. Auf grossen Bildschirmen gibt es damit zwei Wege in die
    Einstellungen (Ringe und Zahnrad) - unschaedlich, und der Zugang haengt
    nicht mehr davon ab, ob audi-dashboard-ios.css geladen wurde. */
-.rings { width: 42px; height: 24px; color: var(--fg); }
-.rings svg { width: 42px; height: auto; }
+/* Design-Audit 2026-08-13: in Telefonbreite ist dies der einzige Zugang zu
+   den Einstellungen (siehe Kommentar oben), war mit 42px aber deutlich
+   kleiner als jeder andere Symbol-Knopf in der Kopfzeile (.themebtn/
+   .profilbtn/.back sind alle 44px) und lag damit unter der ueblichen
+   44px-Mindestgroesse fuer Tippflaechen. */
+.rings { width: 58px; height: 32px; color: var(--fg); }
+.rings svg { width: 58px; height: auto; }
 
 /* Der Markenklon in der Seitenleiste wird vom Skript unbedingt in die
    Menueleiste gehaengt; sichtbar macht ihn erst die iOS-Auflage ab 860px.
@@ -490,7 +495,10 @@ button.tile, .tilebtn { transition: background .15s, transform .1s; }
   min-height: 56px;
   border-bottom: 1px solid var(--line);
 }
-.feld label { font-size: 14px; color: var(--fg2); flex: 1 1 auto; min-width: 0; line-height: 1.35; }
+/* :not(.switch): der Schalter (Tanken/Einstellungen etc.) ist selbst ein
+   <label class="switch">, kein Textlabel - ohne den Ausschluss erbte er
+   dieselbe flex:1 1 auto-Regel und zog sich über die ganze Zeilenbreite. */
+.feld label:not(.switch) { font-size: 14px; color: var(--fg2); flex: 1 1 auto; min-width: 0; line-height: 1.35; }
 /* Eingaben nie breiter als die Kachel: die im Markup gesetzten festen
    Breiten (width:132px) bleiben Obergrenze, schrumpfen aber mit. */
 .feld input, .feld select, .notiz {
@@ -619,7 +627,12 @@ button.tile, .tilebtn { transition: background .15s, transform .1s; }
 .acc-h { transition: background .15s; }
 .acc-h:active { background: var(--tile-2); }
 .mark {
-  width: 6px; height: 10px;
+  /* Design-Audit 2026-08-13: die Border-Ecken-Technik (zwei Kanten +
+     45deg-Drehung) braucht ein Quadrat, um einen sauberen Chevron zu
+     ergeben - bei 6x10px (nicht quadratisch, wie fuer die SVG-Chevrons
+     .chev/.go gedacht) sind die beiden Kantenlaengen ungleich lang und das
+     Ergebnis sah eher wie ein Haekchen als ein Pfeil aus. */
+  width: 8px; height: 8px;
   border-right: 1.4px solid var(--fg3);
   border-bottom: 1.4px solid var(--fg3);
   transform: rotate(-45deg);
diff --git a/testumgebung/README.md b/testumgebung/README.md
index 6543dd8..5b32af9 100644
--- a/testumgebung/README.md
+++ b/testumgebung/README.md
@@ -29,33 +29,34 @@ authentifizierten Tests.
 
 ## Was nachgebildet wird
 
-`konfiguration.yaml` bildet die Entitäten der HACS-Integration
-`TommiG1/HA_VAG-EU-Data-Act` als Template-Sensoren nach, damit das Backend echte
-Werte sieht. Steuerbar zur Laufzeit über Helfer — damit lassen sich die
-`@state_trigger`-Abläufe wirklich auslösen:
+`konfiguration.yaml` bildet zwei Datenquellen als Template-Sensoren nach, damit
+das Backend echte Werte sieht. Steuerbar zur Laufzeit über Helfer — damit
+lassen sich die `@state_trigger`-Abläufe wirklich auslösen:
 
 | Helfer | Steuert | Wofür |
 |---|---|---|
-| `input_number.test_kilometerstand` | `sensor.audi_rs_4_avant_mileage` | Reifenzähler, Fahrtabschluss-Screening |
-| `input_number.test_tankfuellstand` | `sensor.audi_rs_4_avant_fuel_level` | automatische Tankerkennung |
-| `input_number.test_reichweite` | `sensor.audi_rs_4_avant_range_primary` | Übersichtsanzeige |
-| `input_text.test_wlan` | `sensor.iphone_wifi_connection` | Fahrterkennung (Start/Ende) |
-| `input_boolean.test_tuer_vl` | Tür vorne links | „sicher abgestellt" |
-| `input_boolean.test_fenster_vl` | Fenster vorne links | „sicher abgestellt" |
-| `input_boolean.test_entriegelt` | Türschloss vorne links | „sicher abgestellt" |
+| `input_boolean.test_zuendung` | `binary_sensor.testzone_fmm003_engine_ignition_or_acc_status` | Fahrterkennung (Start/Ende, `einstellungen.ZUENDUNG_SENSOR`) |
+| `input_number.test_kilometerstand` | `sensor.audi_rs_4_avant_mileage` | Reifenzähler, Fahrtabschluss-Screening (nur bei manueller Zuordnung über das Setup-Menü, `KM_SENSOR` ist per Default leer) |
+| `input_number.test_tankfuellstand` | `sensor.audi_rs_4_avant_fuel_level` | automatische Tankerkennung (nur bei manueller Zuordnung, `TANK_SENSOR` ist per Default leer) |
+| `input_number.test_reichweite` | `sensor.audi_rs_4_avant_range_primary` | Übersichtsanzeige (nur bei manueller Zuordnung, `RANGE_SENSOR` ist per Default leer) |
+| `input_boolean.test_tuer_vl` | Tür vorne links | „sicher abgestellt" (nur bei manueller Zuordnung) |
+| `input_boolean.test_fenster_vl` | Fenster vorne links | „sicher abgestellt" (nur bei manueller Zuordnung) |
+| `input_boolean.test_entriegelt` | Türschloss vorne links | „sicher abgestellt" (nur bei manueller Zuordnung) |
 
-Beispiel — Fahrt auslösen (WLAN des Fahrzeugs verbinden, dann trennen):
+Die Kilometerstand-/Tankfüllstand-/Reichweite- und Tür-/Fenster-/Schloss-Sensoren
+bilden die Entitäten der abgelösten HACS-Integration `TommiG1/HA_VAG-EU-Data-Act`
+nach (siehe `einstellungen.py`) — für den Standardbetrieb ohne Bedeutung, aber
+weiterhin nützlich, um die manuelle Zuordnung über das Setup-Menü zu testen.
+
+Beispiel — Fahrt auslösen (Zündung/ACC an, dann aus):
 
 ```bash
 T=$(grep VITE_TEST_TOKEN ../companion-app/.env.local | cut -d= -f2)
 curl -X POST -H "Authorization: Bearer $T" -H "Content-Type: application/json" \
-  -d '{"entity_id":"input_text.test_wlan","value":"Audi_MMI"}' \
-  http://localhost:18123/api/services/input_text/set_value
+  -d '{"entity_id":"input_boolean.test_zuendung"}' \
+  http://localhost:18123/api/services/input_boolean/turn_on
 ```
 
-Der WLAN-Name muss zu `fahrzeug.wlan_ssid` in
-`audi_dashboard/fahrzeugprofil.json` passen.
-
 ## Aufräumen
 
 ```bash
diff --git a/testumgebung/konfiguration.yaml b/testumgebung/konfiguration.yaml
index 0f7ac8c..1fb523f 100644
--- a/testumgebung/konfiguration.yaml
+++ b/testumgebung/konfiguration.yaml
@@ -1,8 +1,11 @@
 # Wegwerf-Testinstanz fuer DataMetric360.
-# Bildet die Entitaeten der HACS-Integration TommiG1/HA_VAG-EU-Data-Act nach,
-# damit das pyscript-Backend echte Werte sieht. Ueber die input_*-Helfer sind
-# die Werte zur Laufzeit aenderbar (Fahrterkennung, Reifenzaehler, Tankerkennung
-# haengen an @state_trigger).
+# Bildet zwei Datenquellen nach: den FMM003-Zuendungssensor (Fahrterkennung,
+# aktiv per Standard in einstellungen.py) sowie die Entitaeten der
+# abgeloesten HACS-Integration TommiG1/HA_VAG-EU-Data-Act (Kilometerstand,
+# Tankfuellstand, Tueren/Fenster/Schloesser - in einstellungen.py per Default
+# leer, aber ueber das Setup-Menue weiterhin manuell zuordenbar). Ueber die
+# input_*-Helfer sind die Werte zur Laufzeit aenderbar (Fahrterkennung,
+# Reifenzaehler, Tankerkennung haengen an @state_trigger).
 
 default_config:
 
@@ -51,13 +54,9 @@ input_number:
     initial: 385
     mode: box
 
-input_text:
-  test_wlan:
-    name: Test WLAN
-    initial: Zuhause
-    max: 60
-
 input_boolean:
+  test_zuendung:
+    name: Test Zuendung/ACC
   test_tuer_vl:
     name: Test Tuer vorne links
   test_fenster_vl:
@@ -66,10 +65,11 @@ input_boolean:
     name: Test entriegelt
 
 template:
+  - binary_sensor:
+      - name: "Testzone FMM003 Engine Ignition Or Acc Status"
+        unique_id: test_fmm003_zuendung
+        state: "{{ is_state('input_boolean.test_zuendung', 'on') }}"
   - sensor:
-      - name: "iPhone WiFi Connection"
-        unique_id: test_iphone_wifi
-        state: "{{ states('input_text.test_wlan') }}"
       - name: "Audi RS 4 Avant Mileage"
         unique_id: test_audi_mileage
         state: "{{ states('input_number.test_kilometerstand') | int(0) }}"