Zuletzt-Kachel: Werte jetzt wirklich spaltenbündig

- .teaser-Klasse auf die Kachel gesetzt (teaser()).
- .teaser .leaf .v: min-width:72px (gleiche Spaltenbreite je Zeile).
- .teaser .leaf .k: flex:1 1 auto, damit unterschiedlich lange Labels nicht
  mehr über justify-content:space-between den ganzen Rest der Zeile
  verschieben - vorher blieben .v-Boxen zwar gleich breit, saßen aber an
  unterschiedlichen X-Positionen.

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

custom_components/audi_dashboard/frontend/audi-dashboard-app.js

@@ -1187,7 +1187,7 @@ function badge() {
 function teaser() {
   if (!TRIPS.length && !FILLS.length) return "";
   const t = TRIPS[0], f = FILLS[0];
-  return `<div class="tile"><span class="label">Zuletzt</span>
+  return `<div class="tile teaser"><span class="label">Zuletzt</span>
     ${t ? `<button class="leaf" style="padding-left:0" data-go="trip:${t.trip_id}">
       <span class="k">Letzte Fahrt<small>${esc(t.start_address || "")} → ${esc(t.end_address || "")}</small></span>
       <span class="v">${t.distance_km != null ? de(t.distance_km) + " km" : "offen"}<small>${t.status}</small></span>

custom_components/audi_dashboard/frontend/audi-dashboard.css

@@ -471,6 +471,22 @@ button.sicherheitszeile:active { background: var(--tile-2); }
 .leaf .k small { font-size: 12px; color: var(--fg3); }
 .leaf .v { font-size: 13px; color: var(--fg2); text-align: right; display: flex; flex-direction: column; gap: 3px; flex: 0 0 auto; }
 .leaf .v small { font-size: 12px; color: var(--fg3); }
+/* .teaser (die "Zuletzt"-Kachel auf der Übersicht, teaser()): genau zwei
+   Zeilen mit sehr unterschiedlich breiten Werten ("offen" vs. "51,59 l") -
+   .v ist sonst flex:0 0 auto und damit genau so breit wie sein eigener
+   Inhalt, wodurch die linke Kante des Wertes je Zeile unterschiedlich weit
+   rechts beginnt (rechte Kante bleibt an der Chevron-Spalte gleich, das
+   täuscht Ausrichtung nur vor). min-width sorgt für eine gemeinsame
+   Spaltenbreite, damit beide Werte auf derselben linken Kante beginnen.
+   Das allein reicht aber nicht: .leaf selbst verteilt seine drei Kinder
+   (.k/.v/Chevron) per justify-content:space-between, und .k hat kein
+   flex-grow - unterschiedlich lange Beschriftungen ("→" vs. "Hermann Mogler
+   Mineralölg. GmbH") verschieben dadurch die GESAMTE restliche Zeile
+   (.v + Chevron) um die Differenz, obwohl .v selbst jetzt gleich breit ist.
+   .k bekommt deshalb flex:1, damit es den verbleibenden Platz füllt und .v
+   dadurch wirklich immer am selben Abstand vom rechten Rand sitzt. */
+.teaser .leaf .k { flex: 1 1 auto; min-width: 0; }
+.teaser .leaf .v { min-width: 72px; }
 /* cursor/:active nur für echte .leaf-Buttons (data-go, navigieren bei Klick)
    - die Batterie-Messwertliste (vBatterieliste()) ist bewusst ein reines
      <div class="leaf">, keine Zeilennavigation, nur Wischen zum Löschen; sie

custom_components/audi_dashboard/manifest.json

@@ -1,7 +1,7 @@
 {
   "domain": "audi_dashboard",
   "name": "Audi Dashboard",
-  "version": "2026.8.28.12",
+  "version": "2026.8.28.14",
   "documentation": "https://gitea.nothaft.cloud/paul/audi-app/src/branch/main/README.md",
   "issue_tracker": "https://gitea.nothaft.cloud/paul/audi-app/issues",
   "codeowners": ["@paul"],