fix: "davon ... fest gebunden" war irrefuehrend – und nicht nachpruefbar

Der Hinweis stand unter der Zeile und begann mit "davon". Die naechste Zahl
darueber ist der Ist-Betrag, also las es sich als "von den 17.66 sind 113.72
gebunden" – und wo die Vertraege mehr kosten als geplant, ergab es vollends
keinen Sinn. Die Rechnung stimmte; der Satz war falsch.

Jetzt steht schlicht da, was es ist: "4 Vertraege kosten CHF 113.72 im Monat".
Kein "davon", kein Bezug auf eine Zahl, zu der es keinen gibt. Kostet mehr als
geplant, sagt die Zeile das ausdruecklich, statt es der Rechnung zu ueberlassen.

Vor allem aber laesst sich die Summe jetzt AUFKLAPPEN: darunter steht jeder
einzelne Vertrag mit seinem Monatswert, und bei laengerem Intervall auch der
urspruengliche Betrag ("CHF 190.00 jaehrlich · 16.84 EUR"). Eine Summe, die man
nicht nachrechnen kann, muss man glauben – und wenn sie einem krumm vorkommt,
hilft nur Nachsehen.

Die Liste kommt aus derselben Quelle wie die Summe (monatlich_base_cents vom
Server). Stimmten die beiden nicht ueberein, waere das ein echter Fehler – und
man saehe ihn sofort.

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

web/src/finance.css

@@ -1892,3 +1892,35 @@ tr.row-dup {
   color: var(--accent, var(--fg));
   background: var(--accent-soft, transparent);
 }
+
+/* Die Aufschlüsselung unter einer Budget-Zeile. Aufklappbar, weil eine Summe,
+   die man nicht nachrechnen kann, geglaubt werden muss. */
+.budget-rechnung-kopf {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  width: 100%;
+  padding: 0;
+  border: 0;
+  background: none;
+  color: inherit;
+  font: inherit;
+  text-align: left;
+  cursor: pointer;
+}
+.budget-rechnung-kopf .icon { color: var(--muted); flex: none; }
+.budget-rechnung-kopf:hover .muted { color: var(--fg); }
+.budget-rechnung-kopf .warn { margin-left: auto; white-space: nowrap; }
+
+.budget-vertragsliste {
+  list-style: none;
+  margin: 2px 0 6px;
+  padding: 0 0 0 17px;
+}
+.budget-vertragsliste li {
+  display: flex;
+  gap: var(--sp-2);
+  padding: 1px 0;
+}
+.budget-vertragsliste li > :first-child { flex: 1; min-width: 0; }
+.budget-vertrag-betrag { white-space: nowrap; font-variant-numeric: tabular-nums; }