Paritaetsrunden 2 und 3, Designpruefung umgesetzt (2026.8.30.8)

Drei zusammenhaengende Runden, alle live bei 375x812 gegen audi_ha_test
geprueft und in beiden Codebasen angewandt.

Paritaetsrunde 2: der gemeinsame Rahmen war das eigentliche Problem -
Seitenrand, Kachelabstaende, Kopfleiste, Tableiste und vier Bausteine des
Design-Systems trugen noch den Stand vor der iOS-Entscheidung. Dazu sieben
Bildschirme neu aufgebaut. Zwei Panel-Fehler dabei mitbehoben: teaser()
zeigte unter "Letzte Fahrt" den aeltesten Datensatz, und "Daten bearbeiten"
war ein toter Knopf.

Paritaetsrunde 3: das Panel hat nie Audi Type gerendert. @font-face in einem
Shadow Root wird ignoriert - Schriftschnitte registriert der Browser pro
Dokument, nie pro Shadow Tree. Die drei Schnitte liegen jetzt in
audi-dashboard-schriften.css und werden ins Dokument gehaengt. Damit erledigt
sich eine ganze Reihe von "die Schrift sieht anders aus"-Eindruecken: die
beiden Anwendungen zeigten tatsaechlich verschiedene Schriften.
Ausserdem "Daten bearbeiten" im Panel gebaut und portiert, das Zeilenmenue
entfernt und die letzten neun Bildschirme angeglichen.

Designpruefung: die fuenf Punkte der Reihenfolge. Beim vierten hat das Messen
den Befund veraendert - gezaehlt waren die deklarierten Groessen, wirksam war
laengst eine saubere Sieben-Schritt-Skala mit 27 Ausreissern; die sind jetzt
auf den naechsten Schritt gezogen, keiner verschiebt sich um mehr als 1px.

Zuletzt: die Standortvorschau zeichnete die falsche Nadel (das Panel wechselt
den Icon-Satz ab 34px, die App nahm immer den grossen), und der Kopfabstand
der App ist auf den sicheren Bereich reduziert - die 56px des Panels liegen
dort unter der Kopfleiste von Home Assistant, in der nativen Huelle steht
darueber nichts.

Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
2026-08-30 18:31:46 +02:00
co-authored by Claude Opus 5
parent 25c0d073c4
commit 4a58021670
64 changed files with 4129 additions and 1431 deletions
+195 -2
View File
@@ -1,6 +1,12 @@
# AGENTS.md — Project state, review findings, open items, and working rules
**Last updated: 2026-08-30** (a full 11-chapter panel↔companion-app visual/functional parity audit,
**Last updated: 2026-08-30** (design-audit follow-through - the five priority items applied to
both codebases, plus the location preview's wrong pin; manifest `2026.8.30.8`, see section AN.
Before that: third parity round — the panel had never actually rendered Audi
Type (@font-face inside a shadow root is ignored), "Daten bearbeiten" now works in both, and the
last nine screens are aligned; manifest `2026.8.30.5`, see section AM. Before that: second parity round — the shared chrome turned out to be the real
problem, plus seven screens rebuilt and two panel-side defects fixed; manifest `2026.8.30.3`, see
section AL. Before that: a full 11-chapter panel↔companion-app visual/functional parity audit,
one continuous session — see "Chapter 1" through "Chapter 11 (Abschluss)" further down for the
complete record; companion-app manifest bumped to `2026.8.30.2`, OTA bundle rebuilt and redeployed;
2026-08-29: iOS signing prepared end to end — device build verified, signature
@@ -5624,7 +5630,194 @@ Rebuilt to match each field's real shape and the panel's own grouping: `entweder
Verified: `npm run typecheck` clean, `npm test` 147/147. Live-verified through the dev proxy against `audi_ha_test`'s real profile data — confirmed **zero** `[object Object]` anywhere on the rendered page (checked via `document.body.innerText.includes('[object Object]')`, not just eyeballing) and real, correctly formatted insurance terms showing throughout ("Weiterkommen: Bahn 1. Klasse bis 1 200 km…", "Am Schadenort: Pannenhilfe vor Ort bis 100 €…").
**Not yet done in this chapter** (context budget — flagged, not silently skipped): `vVers()`'s top-level structure (separate Notruf/Jahresbeitrag-with-breakdown-bar/Vertrag tiles with edit gears) vs. companion's single combined summary tile + `NaviKachel` grid was not rebuilt to match 1:1, unlike the `MeinAudi.tsx` rebuild in Chapter 2 — `Beitrag()`/`Vertrag()`/`Notruf()`/`Steuer()` sub-screens were not individually re-verified against their panel counterparts (`vBeitrag()`/`vVertragBearbeiten()`/`vNotrufBearbeiten()`/`vSteuer()`) this round. Worth a dedicated pass later.
**Not yet done in this chapter** (context budget — flagged, not silently skipped): `vVers()`'s top-level structure (separate Notruf/Jahresbeitrag-with-breakdown-bar/Vertrag tiles with edit gears) vs. companion's single combined summary tile + `NaviKachel` grid was not rebuilt to match 1:1, unlike the `MeinAudi.tsx` rebuild in Chapter 2 — `Beitrag()`/`Vertrag()`/`Notruf()`/`Steuer()` sub-screens were not individually re-verified against their panel counterparts (`vBeitrag()`/`vVertragBearbeiten()`/`vNotrufBearbeiten()`/`vSteuer()`) this round. Worth a dedicated pass later. **Done 2026-08-30 in section AL below.**
## AL. Second parity round: the *global* chrome was the real problem, plus seven screens rebuilt (2026.8.30.3)
Owner, after the first audit shipped: **"Die HA App in der Smartphone Ansicht ist die Vorgabe. Die iOS App soll identisch zu dieser Ansicht sein... Alle Abweichungen der iOS App zur HA App sind in der iOS App anzuwenden. Fehlende Features sind einzubauen. Copy exactly."** Two explicit decisions taken during the round (`AskUserQuestion`): **(1)** where the panel is demonstrably wrong, fix the *panel* rather than copy the defect; **(2)** where companion-app has *more* than the panel, remove it.
**Method note that changed the findings, worth keeping:** `innerText` on a freshly-rendered panel view is read *too early* — placeholder markup for a missing photo only appears once the `<img>` `onerror` fires. Two screens (Sicherheit, Reifen) looked like they had extra content in companion-app until the panel was re-dumped with a ~900 ms delay, at which point both matched exactly. **Always wait after navigating the panel before comparing text.**
### The biggest find: the app-wide chrome, not any single screen
Every screen was wrong at once because the shared frame was. All measured live, panel vs. companion-app, at 375×812:
| | Panel | companion-app (before) |
|---|---|---|
| Content side padding | 16px (`main#view{--seitenrand:16px}`) | 22px (`--sp-5`) — every tile 20px narrower |
| Tile padding | `16px 18px` | `22px` |
| Tile-to-tile gap | 14px | **24px** (flex `gap` *plus* the tile's own margin) |
| Scrollbar | hidden | 8px wide, stealing content width on every screen |
| `--line` (day mode) | `rgba(60,60,67,.16)` | `.13` — every separator too faint |
| Missing-value dash | `` (en dash, 30×) | `—` (em dash, 56×) |
Header: the panel's `.eyebrow` is `display:none` on phone width — companion-app printed a fixed **"DataMetric360"** above every single screen title, an element the panel does not have at all. The panel also **hides the rings on sub-pages** (back arrow instead) and renders sub-page titles at **17px centered** (iOS navigation-bar style) against 22px left-aligned here; it has no border under the header; and **nine route titles** were plain drift (`Fahrzeugdaten``Identität und Technik`, `Batterie``Batteriespannung`, `Versicherung & Steuer``Versicherung/Steuer`, `Beitrag``Beitrag anpassen`, `Notruf``Rufnummern`, `Werkstatt``Autohaus`, `Wartungsplan``Eintrag`, `Fahrt``Einzelfahrt`, `Tankvorgang``Einzelbeleg`).
Tab bar: labels were **9px UPPERCASE with .08em tracking** (the pre-2026-08-13 style again), icons 21px instead of 26px, no 63×39 icon pill, no translucent blur, no 26px home-indicator padding.
`@audi-dash/ui` carried three more app-wide instances of the same pre-iOS styling, each fixed against live-measured panel values: **`ActionButton`** (11px uppercase outline with a red hover → 16px normal text on a filled 14px-radius surface, plus a new `primary` variant for `.aktion.primaer`), **`Pill`** (10px uppercase outline → 12px normal on `--ios-fill`), and **`Accordion`** (chevron on the *wrong side* — right instead of left —, 6×10 instead of square 8×8 so it read as a tick rather than an arrow, and it turned **red** when expanded, the same "red as a navigation state" violation fixed twice before elsewhere). Also `Fig`'s unit lost its `max(11px, …)` floor, so the 20px odometer figure rendered its "km" at **6.4px**; `ProgressBar` was 4px on `--line` instead of 6px on `--ios-fill`; `StatusRow` had no padding/min-height and a 14px title instead of 16px; `ImagePlaceholder` was a dashed outline with a 10.5px tracked caption instead of the panel's filled `--ios-fill` box with a 13px caption; and `Tile`'s content span lacked `min-width:0`, so the Fahrgestellnummer pushed its row out of the tile.
### Features that were missing entirely
- **Pull-to-refresh** (`.ptr` + the gesture) and the **"vor 3 Std." data-age line** in the header — companion-app had neither, and instead a "Jetzt beim Fahrzeug nachfragen" button the panel does not have. Built in `Shell.tsx` (`useZiehenAktualisieren`, `standAlter()` in `format.ts`), the button removed.
- **Full-bleed vehicle image** with the fade-out gradient, the **ground shadow** (`strasse`/`winter`) and its **"Boden" switch** (`useBoden` in `theme.ts`), and the **winter side-view swap** (`bildInfo()` in `bilder.ts`). The image labels also differed ("Auto von der Seite" vs. the panel's "Auto Seite").
- **`Termin vereinbaren`**, the full **Autohaus** tile (address, phone, e-mail, maps links) and the **Wartungsplan list** with "Eintrag hinzufügen" on the Service screen — companion-app had two `NaviKachel`s instead, and the `sbuch` route was a whole list screen where the panel's is a **single-entry editor**. Route and screen rebuilt accordingly.
- The **Statistik tiles are collapsible in the panel** (`statTile()``.tile-h`/`.tile-b`) with a right-aligned secondary value in the head; companion-app rendered everything permanently expanded, without the head value and without the `quad()` sub-headings. Rebuilt, and `schnittFahrtVerbrauch()` (the missing "Näherung je Fahrt, je Zeitraum" row) added to `statistik.ts`.
- **Batterie**: the panel's chart has grid lines, Y-axis labels, an area fill, a date-range line, and pinch-zoom/pan with a reset button — none of it existed here; and the whole **"Bewertung" tile** (SOC with colour dot and label, SOH trend with its verdict text) was missing, replaced by four plain value rows.
- **`Vertragsdetails` rendered twelve em-dashes.** `versicherung.leistungen` is `{gruppe, posten[]}[]`, not `{bez, wert}[]` — the same mis-typed-data-shape defect as the `Schutzbrief()` `[object Object]` bug from chapter 4, one level up. Also on the Versicherung group: the whole `vVers()` structure (Notruf tile with *both* numbers as dial buttons, Jahresbeitrag with its 46px figure, per-part breakdown and segmented bar, Vertrag with Selbstbeteiligung rows and the SF "zuvor" line) was rebuilt; `Beitrag` gained "Gültig ab" and both SF fields; `Vertrag` gained the "Schadenfreiheitsklasse · zuvor" tile; `Notruf` was relabelled Inland/Ausland; `Steuer` got the Zeitraum dropdown, "Nächste Fälligkeit" and the Lastschrift switch.
- **`Fahrzeugdaten` hid over 3 000 characters of data sheet inside collapsed accordions** — the panel shows every technical group and every equipment group as its own flat tile. Rebuilt; the head tile also had the wrong name ("Identität" vs "Fahrzeug") and the wrong field set.
- **Fahrten/Tanken list rows** used a different anatomy (km/litres first, everything else in one long footer line, plus Arbeitsweg/offen/unvollständig pills the panel has no equivalent for). Rebuilt on a new shared `Blattzeile` (`.leaf` in the panel), the count header and top "eintragen" button removed (the panel puts the count in the year row and the form *below* the list), month labels shortened to the month name, and **`nachJahrUndMonat()` was sorting months and rows descending** where the panel keeps the backend's ascending order — both lists were reversed and opened the wrong month by default.
### Panel-side changes (both decided with the owner, not taken unilaterally)
1. **`teaser()` showed the OLDEST trip and fill, not the newest** — `TRIPS[0]`/`FILLS[0]` on backend lists that arrive ascending, under headings that read "Letzte Fahrt"/"Letzter Tankvorgang". Found only because companion-app sorted correctly and the two disagreed. Fixed in the panel (sort by timestamp, take the newest); companion-app already behaved correctly and was left alone.
2. **`vIdent()`'s "Daten bearbeiten" button is dead** — no `data-go`, no handler, does nothing when tapped. Deliberately **not** copied into companion-app; reported instead, since a dead control is not a feature worth reproducing.
### Deliberately not removed, despite decision (2) — needs an owner call
`Zeilenmenue`'s always-visible "···" button on trip/fill rows has no panel counterpart (the panel is swipe-only), but it exists to close a recorded accessibility finding (`AUDIT_2026-08-10.md` §4.1: swipe-only deletion is unreachable with VoiceOver or switch control). Removing it would re-open that defect, so it stays until the owner decides between "remove for exact parity" and "port it into the panel instead".
### Still open after this round
Einstellungen (section names, order and content differ substantially in both directions), MeinAudi, Standort, Schutzbrief, FahrtDetail, TankDetail, Werkstatt, BatterieListe, and the receipt-upload buttons the panel offers inside the *new*-fill form (`Beleg hochladen` / `Ohne Beleg speichern`) — companion-app only offers receipt upload on an existing fill's detail page.
Verified: `npm run typecheck` clean and `npm test` 147/147 after every step, `npm run build` clean, `design-system` rebuilt after each of its CSS changes, `node --check` on the panel bundle, and **live side-by-side at a real 375×812 viewport for every screen touched** — Übersicht, Statistik, Service, Versicherung and Vertragsdetails now produce **byte-identical `innerText`** to the panel, and Übersicht additionally matches element for element (tile heights 130/89/106/169/190, gaps 0/20/22/22/14). Manifest bumped to `2026.8.30.3`, `npm run ota` rebuilt (`bundle.zip` 253,799 bytes, sha256 `8d22031998d6cd18b4d2b3072f16ea87bd3600a107cc6a3c831ba20d3fd8c7ef`), integration redeployed to `audi_ha_test` (`docker cp …/. `, trailing dot per section AK) and confirmed via a clean single-warning setup log.
**Dev-proxy note:** `vite.config.ts`'s dev proxy now also forwards `/local` and `/audi_dashboard_static` to `:18123`. Without it the dev server answered image requests itself, so every optical comparison saw placeholders instead of the real photos and the Shell logo. `server.*` still never applies to `vite build`.
---
## AM. Third parity round: the panel had never rendered Audi Type, plus the last nine screens (2026.8.30.5)
Owner's three instructions after round two: **(1)** accessibility is not needed in either app — remove the "···" row menu; **(2)** "Daten bearbeiten" is required, so make it work *in the panel* first and then port it; **(3)** carry on with the open list.
### The find of the round: the panel was showing Helvetica, not Audi Type
Chasing a single wrapped list row ("Fahrt ohne Ortsangabe" broke onto two lines in the app, one in the panel) turned into the largest defect found so far. Same declared CSS on both sides, same 16px/400, and — verified by hash — **byte-identical woff2 files**. Yet the same string measured **173px in the app and 165.4px in the panel**.
165.4px is exactly Helvetica. Probing inside the panel's shadow root settled it: `"Audi Type"`, `"Times New Roman"`, `serif` and a deliberately invented family name all measured **145.7px** — the panel resolved every one of them to the same fallback, i.e. **"Audi Type" was not available to the panel at all**, and its text had always come out in Helvetica (the second entry of its own font stack). `document.fonts` listed no Audi face either.
Cause: the panel appends *both* stylesheets to its shadow root, and the @font-face rules sat at the top of `audi-dashboard.css`. **@font-face inside a shadow root is ignored — font faces are registered per document, never per shadow tree.** The mirror image of this project's own Leaflet bug (that stylesheet was in `document.head` and never reached the shadow root); same root cause, opposite direction. Fixed by splitting the three faces into `audi-dashboard-schriften.css` and linking *that one file* into `document.head` (`schriftenLaden()`); it contains nothing but @font-face, so the rest of the Home Assistant interface is untouched. Verified live afterwards: the panel now reports both Audi faces as loaded and measures the reference string at 173px — identical to the app.
This also retires a long tail of "the fonts look slightly different" impressions: until now the two apps genuinely rendered different typefaces.
### "Daten bearbeiten" (panel first, then ported)
The button in `vIdent()` had no `data-go` and no handler — dead. Now implemented in the panel (`vIdentBearbeiten()`, `identBearbeitenOffen`, reset in `go()`/`zurueck()`): every value of the technical data sheet becomes an input, every equipment entry an editable row, both with "×" and "+ Position hinzufügen", saved through `profilSpeichern()` per field — the same idiom as the Selbstbeteiligung editor. Deliberately **not** included: Modell, Kennzeichen, Ausführung, Erstzulassung and FIN, which "Fahrzeug einrichten" in Einstellungen already owns; two editors for one field drift apart. Verified live in the container (add → 8 rows → delete → 7 rows, persisted). Then ported to `Fahrzeugdaten.tsx` with the app's own draft-plus-"Fertig" idiom (≈50 fields would otherwise mean ≈50 whole-profile writes).
### Row menu removed
`Zeilenmenue` is now just the swipe row, as in the panel. `SymbolMehr` and the `.dm-zeile*` classes went with it (orphans of this change). `SwipeRow`'s delete button also still carried the pre-iOS styling (11px uppercase, tracked) and lacked the panel's `visibility:hidden`-until-swiped trick — both fixed. Rows now use the full width, exactly like the panel.
### The remaining nine screens
- **Einstellungen** rebuilt to `vEinst()`'s sections, order and wording: "Fahrzeug einrichten" is collapsible again and carries the identity fields plus the history import; "Darstellung" gained the missing **"Fahrbahn unter dem Fahrzeug"** switch (the setting existed since round two, the control did not); "Bild der Übersicht" shows the chosen view large with **tap-to-upload/replace/delete** — the app previously could not change photos at all and pointed at Home Assistant, although `bild_hochladen`/`bild_loeschen` have existed all along (new `api.bildHochladen`/`api.bildLoeschen` and a shared `BildMitMenue`). "Tankrabatt"→"Kraftstoff-Rabatt", "Sicherung"→"Backup" with the panel's texts and button labels, "Vergangene Daten" folded into "Fahrzeug einrichten", Fahrzeugprofil moved above Backup. Removed: "Nacht beginnt/endet", the two count rows under "Zugang", and several explanation paragraphs the panel does not have.
- **Mein Audi**: the Service tile shows **all three terms** again (the deliberate Chapter-2 simplification is gone), image captions use the panel's labels ("Auto Seite"), and the Batteriespannung row lost its chevron (the panel marks it only by cursor).
- **FahrtDetail** and **TankDetail** rebuilt to `vTrip()`/`vFill()`: map first, then the flat 52px figure tile, then one value-row tile in the panel's order with "Werte bearbeiten"/"Beleg ersetzen" inside it and the destructive action last. Both had their own header row, their own ordering and labels, and extra pills the panel does not carry.
- **New-fill form** gained the panel's three buttons (**"Beleg hochladen"**, "Speichern", "Ohne Beleg speichern"). A receipt upload *without* `tank_id` only parses and publishes the fields (`belege.py`), which the form now waits for and pre-fills — the app previously could only attach a receipt to an already-existing fill.
- **Einzelbeleg map**: the record has no station coordinates and the backend never fills them; the panel geocodes the receipt address through Nominatim with a localStorage cache. Ported as `daten/geokodierung.ts` plus `TankstellenKarte`.
- **Schutzbrief**: the per-row note belongs under the *label*, not under the value (`dt` = bez + small zusatz, `dd` = grenze) — it was the other way round; explanation paragraphs aligned.
- **Werkstatt** tile renamed to "Angaben zum Autohaus"; **Messwertliste** timestamps use "·" instead of a comma (new `datumUndZeit()`); **Standort** already matched exactly.
- New `.dm-erklaerung` class for the panel's 12.5px explanation paragraphs. This finally resolves the `.dm-fussnote` ambiguity flagged twice: rather than change a class used 35 times across 13 files, the panel-shaped role got its own class.
### Deliberately kept, with reasons
- **"Zugang" → "Verbindung trennen"** and the **App-Update (OTA)** tile have no panel counterpart *because they cannot*: the panel runs inside Home Assistant and knows neither a server address nor a bundle. Same category as the onboarding screen and `LiveFahrt`.
- **`Tankvolumen` and `Zusatz`** are in the data model but editable nowhere in the panel, so their editors were removed here per the owner's rule. They are now only changeable in the profile file — say the word and they get an editor in the panel instead.
Verified: `npm run typecheck` clean and `npm test` 147/147 after every step, `npm run build` clean, `node --check` on the panel bundle, live comparison at 375×812 for every screen touched. Manifest `2026.8.30.5`, `npm run ota` rebuilt (`bundle.zip` 255,695 bytes, sha256 `43fdc62a88cc212d98a808239c650e1d6a3cb33c243a576ef36014c0b8948943`), integration redeployed to `audi_ha_test`, clean restart with no traceback, and the font fix confirmed live in the panel.
**Tooling note worth keeping:** do not use `perl -pi -e 's|...|...|'` on these files. A pattern containing an escaped `|` terminated early, the substitution then matched every line, and `MeinAudi.tsx` came back with the replacement prepended to all 250 lines. It was fully reversible (the injection is deterministic), but the safe path is a small Node script that reads the file, checks the anchor exists, replaces once, and preserves CRLF — the source files are CRLF and a naive newline pattern will silently not match.
---
## AN. Design audit follow-through: the five priority items, and what measuring first changed (2026.8.30.6/.7)
Working through the priority list of the design audit published at
https://claude.ai/code/artifact/cb5bcae6-5ca5-43c1-a575-cdff96eb2a54. Every item was applied to
**both** codebases (parity rule) and verified live at 375x812 against `audi_ha_test`.
**1. Statistik tiles had no expand affordance** - the five collapsible tiles looked like fixed
readouts. The rotating chevron the accordion rows already use now sits in the tile head
(`.stat-kopfzeile` + `.mark` in the panel, `dm-statkopf__kopfzeile` + `ads-mark` in the app).
**2. Lists ran newest-last inside a newest-first frame.** Years descended while months and rows
ascended, so the newest trip sat at the bottom, off screen. Panel got `neuesteZuerst()` for
`vTrips()`/`vFuel()`; the app's `nachJahrUndMonat()` went fully descending. `teaser()` in the panel
was picking `TRIPS[0]`/`FILLS[0]` - the *oldest* record - under headings reading "Letzte Fahrt";
it now sorts by timestamp.
**3. `--fg3` on light ground was 2.92:1** against the page and 3.26:1 against a tile - too little
for a glance in sunlight. Darkened to `#6B6B70` (4.75:1 / 5.30:1) in `audi-dashboard-ios.css` and
`design-system`'s day theme; the night value stays `#8E8E93` (already 5.86:1). Verified live in
both: day `#6B6B70`, night unchanged.
**4. The type scale - and here measuring first changed the fix entirely.** The audit counted
*declared* sizes and found fourteen distinct values below 18px, which reads as a badly fragmented
scale. Measuring the **effective** `font-size` of every text element across eleven panel views told
a different story: a clean seven-step backbone (11 / 12.5 / 13 / 14 / 15 / 16 / 17) already carried
**96%** of 621 elements, with 27 stragglers sitting one notch beside a real step. Most of the
declared values never reached the screen at all, because the always-loaded iOS overlay overrides
them - the same trap recorded twice before in this file.
So the fix is narrow, not a restructure: snap the stragglers onto the nearest step
(11.5 -> 12.5, 12 -> 12.5, 13.5 -> 13, 14.5 -> 14, 16.5 -> 16), applied as one mechanical
substitution across panel CSS, panel inline styles, companion-app CSS and `design-system` at once,
so the two sides cannot drift apart on it. Nothing moves more than 1px. Also fixed: `<small>` in the
accordion head had no rule of its own and inherited the UA's `smaller` (0.833x) - 10.4px, below the
11px floor this project took from Apple's guidance; it now has an explicit 11px.
Deliberately untouched: `font-size: max(11px, .32em)` on the unit beside the large figures. Its 12.8
and 14.72px readings are that rule scaling with a 40px and a 46px figure, which is the point of it.
Re-measured afterwards across the same eleven views: **11 / 12.5 / 13 / 14 / 15 / 16 / 17**, nothing
else, plus the two intentional relative values. Fourteen values down to seven.
**5. The Ubersicht carried its two heaviest tiles in front of its lightest.** Without a stored photo
the placeholder still occupied 120px directly above the range - the most important number on the
page - and "Zuletzt", two short and frequently read lines, sat below a 190px map and therefore below
the fold on a phone. Placeholder narrowed to 72px (kept, not removed: it is the only sign that this
image slot exists), and "Zuletzt" moved in front of the location card in both codebases.
**Found while verifying, fixed too:** the app drew the Ubersicht service chevron as the text
character "" at 15px, where the panel draws `.go`, a 6x10 SVG polyline at stroke-width 1.4 -
visibly a different shape and weight from every other chevron in the app. Now the same SVG.
**Also fixed, from the owner's report "ubersicht/karte: hier stimmt ios noch nicht zum panel":** the
location preview drew the wrong pin. `fahrzeugMarkerSVG()` in the panel switches icon sets by size -
at or above 34px the 48-grid drawing, below it the 24-grid one, which is drawn for small sizes. The
app always used the 48-grid one, so the 32px preview showed a drawing meant to be seen at 38px+. The
app now mirrors the same switch, and the preview's map background is pinned to Leaflet's own #ddd,
which is what the panel actually shows (its own `var(--tile)` declaration loses to
`.leaflet-container`). Verified byte-identical afterwards: same marker markup (1087 characters, same
hash), same `translate3d(172px, 95px, 0)`, same drop-shadow, same colour.
Verified: `node --check` on the panel bundle, `design-system` rebuilt, companion-app `tsc --noEmit`
clean and 147/147 green after every step, `npm run build` clean. Live at 375x812 the Ubersicht of
both now yields the same text and the same size distribution (11x1, 12.5x3, 12.8x1, 13x8, 15x3,
16x3) and the same tile order. Manifest `2026.8.30.6`, then `2026.8.30.7` once the chevron fix
changed the app after the first bundle - two different bundles must never share one version number.
`npm run ota` rebuilt (`bundle.zip` 256.124 bytes, sha256
`556b8e7b43277366921e927ce56f8f748e0b7e5efaf021040fcfd99f0027e8c2`), redeployed to `audi_ha_test`,
clean restart.
**Header padding: the one place where copying the panel's number was wrong (2026.8.30.8).** The
owner asked why the iOS app shows a large gap above the headline. Measured: 105px, made of a 49px
"Diese App ist älter als der Server" band - the message itself, not a layout fault - and 56px of
header padding. That 56px is a faithful copy of the panel (`.topbar{padding:56px 20px 4px 16px}` in
the iOS overlay, confirmed live). It is also the one case found so far where copying the panel
exactly produces a *different* result: in the panel those 56px sit below Home Assistant's own header
bar, while the native shell has nothing above them but the status bar. Same number, different
picture. On the owner's instruction the added padding is gone; `.dm-kopf`/`.dm-kopf--unterseite` now
carry `env(safe-area-inset-top, 0px)` alone, so the status bar stays clear on the device while the
headline starts at the top everywhere without an inset. Deliberate, disclosed divergence from the
panel - do not "fix" it back by matching the number again.
**Committed and pushed** at the end of this session, after rebasing onto `25c0d07` (an `.ipa` refresh
pushed from elsewhere, no overlap).
---