feat: Zu welchem Budget-Monat eine Buchung gehoert

Bisher entschied allein das Datum. Bei einem Budget-Monat, der nicht am
Ersten beginnt, faellt das auf: Die Zahlung geht am 24. ab und gehoert
doch zum naechsten Monat, die Rechnung wird verspaetet beglichen und
gehoert zum letzten.

Neu traegt jede Buchung einen Budget-Monat. Leer heisst weiterhin "aus dem
Datum" - der Normalfall, und er bleibt es. Wird einer von Hand gesetzt,
zaehlt die Buchung nur noch dort und in ihrem eigenen Monat NICHT mehr,
sonst stuende sie zweimal da.

Das Aendern liegt bewusst hinter einem Klick und hinter Pfeilen statt
hinter einer Auswahlliste: Es ist der Ausnahmefall, nicht der Normalfall,
und soll sich auch so anfuehlen. Waehlt man genau den Monat, der ohnehin
gilt, bleibt die Buchung automatisch - verschiebt sich das Datum spaeter,
wandert sie mit. In der Liste zeigt eine Marke den Monat, aber nur, wenn
jemand eingegriffen hat.

Der Server nimmt drei Monate in jede Richtung an. Ein Vertipper wie
2019-03 wird abgelehnt: Er liesse die Buchung aus jeder Auswertung
verschwinden, ohne dass irgendwo etwas fehlt.

Geprueft im Browser gegen eine Wegwerf-Datenbank mit Stichtag 25: Die
Karte summiert 25.08.-24.09., eine verschobene Buchung verlaesst diesen
Zeitraum und kehrt beim Zuruecknehmen zurueck.

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

web/src/finance.css

@@ -1487,3 +1487,39 @@ tr.row-dup {
 .dash-zeitraum {
   margin-bottom: var(--sp-2);
 }
+
+/* ---------- Budgetzeitraum einer Buchung ----------
+   Normalerweise entscheidet das Datum, und dann steht hier nur, was gilt. Das
+   Ändern liegt hinter einem Klick und hinter Pfeilen statt hinter einer
+   Auswahlliste: Es ist der Ausnahmefall und soll sich auch so anfühlen. */
+.budgetzeitraum {
+  margin-bottom: var(--sp-4);
+}
+.budgetzeitraum-kopf {
+  display: flex;
+  align-items: center;
+  gap: var(--sp-2);
+  min-height: 32px;
+}
+.budgetzeitraum-wahl {
+  margin-top: var(--sp-2);
+  padding: var(--sp-3);
+  border: 1px dashed var(--border-strong);
+  border-radius: var(--radius-sm);
+}
+.budgetzeitraum-wahl p {
+  margin: 0 0 var(--sp-3);
+}
+.budgetzeitraum-schritte {
+  display: flex;
+  align-items: center;
+  gap: var(--sp-2);
+  flex-wrap: wrap;
+}
+/* Feste Breite: Sonst springen die Pfeile, sobald „Mai" auf „September" folgt. */
+.budgetzeitraum-monat {
+  min-width: 9.5em;
+  text-align: center;
+  font-weight: 580;
+  color: var(--text);
+}