/* ══════════════════════════════════════════════════════════════
   FINA — Jahresmatrix
   Die große Tabelle der Jahresansicht mit festgepinnter linker
   Spaltengruppe und zwei Zellen je Monat (Betrag + Haken).
   ══════════════════════════════════════════════════════════════ */

/* ── Die Matrix ist eine eigene Fläche ────────────────────────
   Sie rollt in **beiden** Richtungen selbst und ist so hoch wie der
   Platz unter der Knopfleiste (sizeMatrix() in js/app.js setzt die
   Höhe). Das ist der ganze Grund, warum Kopf- und Blockzeilen mit
   `position:sticky` stehenbleiben können: sticky richtet sich immer
   am nächsten Rollrahmen aus, und der ist jetzt dieser hier.

   Vorher rollte die Seite senkrecht und die Zeilen wurden per
   JavaScript nachgeschoben — das lief dem Scrollen immer ein Bild
   hinterher, die Kopfzeile schwamm sichtbar. Sticky rechnet der
   Browser selbst; da ruckelt nichts, weil nichts gerechnet wird. */
/* **Gerollt wird in beiden Richtungen vom Browser selbst.** Das ist
   der Unterschied zwischen weich und ruckelig: jede eigene Rechnung
   im Rad-Ereignis verliert den Schwung, den der Browser dem Rollen
   mitgibt. Der waagerechte Balken wird deshalb nicht abgeschaltet,
   sondern **abgeschnitten** — die Fläche ist um seine Höhe höher
   als der Rahmen `.yearpane`, der sie zeigt (sizeMatrix in
   js/app.js). Unten bleibt damit nur die Tabelle; gerollt wird
   waagerecht an der Leiste darüber. */
.yearpane{overflow:hidden}
.yearscroll{overflow:auto}

/* Die Knopfleiste über der Tabelle; ihr top setzt syncStickyTops(),
   weil die Kopfzeile je nach Ansicht unterschiedlich hoch ist. In
   der Jahresansicht rollt die Seite nicht mehr — die Leiste steht
   dort ohnehin fest —, das Maß bleibt aber richtig. */
/* `gap:0` gegen die 9 px, die .sechead zwischen seine Kinder legt:
   die Leiste hat nur zwei, die Filterzeile und den Rollbalken, und
   deren Abstand steht am Balken selbst (css/layout.css). Sonst
   käme er zu den 10 px dazu — und zwar nur, wenn es den Balken
   überhaupt gibt, der Abstand spränge also mit der Fensterbreite. */
.yearbar{position:sticky;top:0;z-index:30;background:var(--paper);
  margin:0 0 0;padding:0 0 10px;gap:0;box-shadow:0 8px 10px -10px rgba(0,0,0,.4)}
.matrix{border-collapse:separate;border-spacing:0;table-layout:fixed;font-variant-numeric:tabular-nums;margin:0;
  width:calc(394px + var(--labw,250px) + 12 * (var(--monw,100px) + 46px))}

/* ── Spaltenbreiten ───────────────────────────────────────────
   Die festen Spalten links ergeben zusammen mit der Gesamtspalte
   die 394px der Tabellenbreite: 30+30+30+38+38+38+50+140.

   Stift, Beleglink und Notizlampe stehen in drei gleich breiten
   Spalten — nur so sind die Abstände zwischen den drei Symbolen
   untereinander gleich. Der Abstand von der Lampe zur Beschriftung
   ergibt sich aus dem Innenabstand von td.lab (8px) und entspricht
   damit dem Abstand der Symbole zueinander. */
.matrix col.c-ed{width:30px}.matrix col.c-ln{width:30px}.matrix col.c-nt{width:30px}.matrix col.c-lab{width:var(--labw,250px)}
.matrix col.c-b{width:38px}.matrix col.c-z{width:38px}.matrix col.c-f{width:38px}.matrix col.c-e{width:50px}
.matrix col.c-m{width:var(--monw,100px)}.matrix col.c-mk{width:46px}.matrix col.c-t{width:140px}

/* ── Die Stapelfolge der Matrix ───────────────────────────────
   Drei Sorten Zellen liegen beim Scrollen übereinander, und alle
   drei sind positioniert — bei gleichem z-index entschiede sonst
   die Reihenfolge im Dokument, und die späteren Zeilen gewännen
   gegen die Kopfzeile. Deshalb eine Leiter, von unten nach oben:

     0  gewöhnliche Zellen
     1  die festgepinnten Spalten links (innerhalb ihrer Zeile)
     2  Blockzeile Einnahmen
     3  Blockzeile Flexible Payments
     4  Blockzeile Regelmäßige Kosten
     5  Gesamtzeile (balpin)
     6  Spaltenköpfe, Monatszellen
     7  Spaltenköpfe, Spalten links

   Die Spaltenköpfe stehen ganz oben, weil alles andere unter sie
   geschoben wird.

   **Die drei Blockzeilen steigen in der Reihenfolge der Blöcke**,
   und das ist keine Kosmetik, sondern die Ablösung: alle drei
   kleben an derselben Höhe, und wer weiter unten steht, deckt den
   darüber zu. Sichtbar ist damit immer die Zeile des Blocks, in dem
   man gerade liest. Ein „Hinausschieben" wäre das Naheliegende, es
   geht aber nicht: `position:sticky` an einer Tabellenzeile wird
   vom `tbody` **nicht** begrenzt (der umgebende Block einer Zeile
   ist die Tabelle), und ohne diese Grenze klebt jede Blockzeile bis
   zum Tabellenende. Deshalb decken sie sich zu — dafür müssen ihre
   Hintergründe deckend bleiben. */

/* ── Zellen ───────────────────────────────────────────────── */
.matrix th,.matrix td{padding:5px 8px;border-bottom:1px solid rgba(0,0,0,.10);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.matrix thead th{font-family:var(--font-data);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);
  text-align:right;font-weight:500;background:#fff;border-bottom:1px solid var(--rule);
  position:sticky;top:0;z-index:6}
.matrix thead th.ed,.matrix thead th.ln,.matrix thead th.lab{text-align:left}
.matrix thead th.code{text-align:center}
.matrix td.num{text-align:right;font-family:var(--font-data)}
.matrix td.mk{text-align:center;padding:5px 2px;font-size:11px;font-weight:700;border-bottom:1px solid rgba(0,0,0,.10);vertical-align:middle}
.matrix td.code{font-family:var(--font-data);font-size:11px;color:var(--ink-2);text-align:center;padding:6px 2px}

/* ── Festgepinnte Spalten links ───────────────────────────────
   Dieselbe Mechanik, andere Achse: die Zellen kleben am linken Rand
   des Rollrahmens. Eine Zelle darf in beiden Richtungen kleben —
   die Kopfzellen tun genau das (oben `top:0`, hier `left`). */
.matrix thead th.ed{left:0;position:sticky;z-index:7}
.matrix thead th.ln{left:30px;position:sticky;z-index:7}
.matrix thead th.nt{left:60px;position:sticky;z-index:7}
.matrix thead th.lab{left:90px;position:sticky;z-index:7}
.matrix thead th.cB{left:calc(90px + var(--labw,250px));position:sticky;z-index:7}
.matrix thead th.cZ{left:calc(128px + var(--labw,250px));position:sticky;z-index:7}
.matrix thead th.cF{left:calc(166px + var(--labw,250px));position:sticky;z-index:7}
.matrix thead th.cE{left:calc(204px + var(--labw,250px));position:sticky;z-index:7;border-right:2px solid var(--rule-strong)}
.matrix td.ed,.matrix td.ln,.matrix td.nt,.matrix td.lab,.matrix td.cB,.matrix td.cZ,.matrix td.cF,.matrix td.cE{position:sticky;background:var(--paper-2);z-index:1}
.matrix td.ed{left:0;padding:4px 0;text-align:center}
.matrix td.ln{left:30px;padding:4px 0;text-align:center}
.matrix td.nt{left:60px;padding:4px 0;text-align:center}
.matrix td.lab{left:90px;text-align:left;white-space:normal}
.matrix td.cB{left:calc(90px + var(--labw,250px))}
.matrix td.cZ{left:calc(128px + var(--labw,250px))}
.matrix td.cF{left:calc(166px + var(--labw,250px))}
.matrix td.cE{left:calc(204px + var(--labw,250px));font-size:10.5px;border-right:2px solid var(--rule-strong)}

/* ── Ampel der Spalte „Ende" ──────────────────────────────────
   Nur die Zelle, nicht die Zeile. Gerechnet wird vom laufenden
   Monat aus (endClass in js/format.js): dieser Monat · bis zwei ·
   drei bis sechs · mehr. Ohne Ende oder bereits ausgelaufen
   bleibt die Zelle wie die übrige Spalte. */
.matrix td.cE.e-now{background:var(--end-now)}
.matrix td.cE.e-soon{background:var(--end-soon)}
.matrix td.cE.e-mid{background:var(--end-mid)}
.matrix td.cE.e-far{background:var(--end-far)}
.endkey{display:inline-block;margin-left:7px;padding:1px 6px;border:1px solid var(--rule);border-radius:2px;color:var(--ink)}
.endkey.e-now{background:var(--end-now)}.endkey.e-soon{background:var(--end-soon)}
.endkey.e-mid{background:var(--end-mid)}.endkey.e-far{background:var(--end-far)}

/* ── Schaltflächen in der Matrix ──────────────────────────── */
.matrix .mhead{background:none;border:0;color:inherit;font:inherit;padding:0;cursor:pointer;text-transform:inherit;letter-spacing:inherit}
.matrix .mhead:hover{text-decoration:underline}
.matrix .mhead.done{text-decoration:line-through;text-decoration-thickness:1.5px;color:var(--ok)}
/* Der laufende Monat als rote Pille im Kopf — dieselbe Marke wie
   in der Monatsleiste der Kopfzeile (.mtab.current .mp). */
.matrix .mhead.now{background:var(--seal);color:#fff;border-radius:8px;
  padding:1px 6px;font-weight:600;text-decoration:none}
.matrix .mhead.now:hover{text-decoration:none}
.matrix .codehead{background:none;border:0;color:inherit;font:inherit;padding:0;cursor:pointer}
.matrix .codehead:hover{color:var(--ink);text-decoration:underline}

/* Der Pfeil, der einen Block zuklappt. Er steht in der Stiftspalte
   der Blockzeile — dasselbe Zeichen wie in der Monatsansicht, nur
   in der Größe der Matrix. Die Zeilenhöhe hält die Blockzeile so
   flach wie ohne ihn; die Farbe kommt aus dem Block (weiter unten,
   neben den Kanten). */
.matrix .foldarrow{background:none;border:0;padding:0;cursor:pointer;
  display:block;width:100%;font-size:10px;line-height:1;letter-spacing:0;color:inherit}

/* ── Zeilentypen ──────────────────────────────────────────────
   Drei Stufen, damit man ohne Suchen sieht, worin man liest:
   die Kopfzeile eines Blocks (.sec) am kräftigsten, die Kategorie
   darunter (.grp) eine Stufe heller, die Posten am hellsten. Die
   3-px-Kante links tragen **nur die Kategoriezeilen** (siehe
   unten) — an jeder Zeile war sie ein durchgehender Farbbalken. */
/* Die Blockzeile nach 4a: Blockstufe -3 als Grund, unten eine
   Linie in der Kantenfarbe statt der schwarzen Einfassung. */
/* Das senkrechte Polster (8 px) hebt die Blockzeile auf die Höhe
   des Kartenkopfs der Monatsansicht (~32 px): dieselbe Überschrift
   in zwei Ansichten soll auch dieselbe Zeile sein. Wer hier dreht,
   misst gegen .sechead der Monatsansicht nach. */
.matrix tr.sec td{font-weight:600;font-family:var(--font-data);font-size:10.5px;
  letter-spacing:.08em;text-transform:uppercase;border-top:0;border-bottom:1px solid var(--rule);
  padding-top:8px;padding-bottom:8px}
.matrix tr.grp td{font-weight:600;font-family:var(--font-data);font-size:10px;
  letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid var(--edge-out)}
.matrix tr.spacer td{height:10px;background:var(--paper);border-bottom:0;padding:0}
.matrix tr.r-in td{background:var(--bg-in);border-bottom-color:var(--bg-in-2)}
.matrix tr.r-flex td{background:var(--bg-flex);border-bottom-color:var(--bg-flex-2)}
.matrix tr.r-out td{background:var(--bg-out);border-bottom-color:var(--bg-out-2)}
.matrix tr.r-bal td{background:var(--bg-bal);border-bottom-color:var(--bg-bal-2)}
.matrix tr.grp.r-out td{background:var(--bg-out-2);border-bottom-color:var(--bg-out-3)}
/* Seit es mehrere Einnahme-Kategorien geben kann, gliedert
   dieselbe Zeile auch den Einnahmenblock — in dessen Farbe. */
.matrix tr.grp.r-in td{background:var(--bg-in-2);border-bottom-color:var(--bg-in-3)}
.matrix tr.sec.r-in td{background:var(--bg-in-3);border-bottom-color:var(--edge-in)}
.matrix tr.sec.r-flex td{background:var(--bg-flex-3);border-bottom-color:var(--edge-flex)}
.matrix tr.sec.r-out td{background:var(--bg-out-3);border-bottom-color:var(--edge-out)}
.matrix tr.sec.r-bal td{background:var(--bg-bal-3);border-bottom-color:var(--edge-bal)}
/* **Die 3-px-Kante tragen nur die Kategoriezeilen** (22.8.26).
   Der Mock 4a gab sie jeder Zeile mit — an zweihundert Positionen
   wurde daraus links ein durchgehender Farbbalken, der mehr Lärm
   als Orientierung war. Was für eine Zeile spricht, sagen Grund-
   stufe und Blockzeile; die Kategorie behält die Kante als das,
   was sie gliedert — wie tr.group in der Monatsansicht (dort 5 px,
   css/ledger.css). Am ersten, festgepinnten Feld, damit sie beim
   seitlichen Rollen stehen bleibt. */
.matrix tr.grp.r-out td.ed{box-shadow:inset 3px 0 0 var(--edge-out)}
.matrix tr.grp.r-in td.ed{box-shadow:inset 3px 0 0 var(--edge-in)}
/* Der Klapp-Pfeil trägt die Kantenfarbe seines Blocks — wie in der
   Monatsansicht der Pfeil im Kopf seiner Karte. */
.matrix tr.sec.r-in .foldarrow{color:var(--edge-in)}
.matrix tr.sec.r-flex .foldarrow{color:var(--edge-flex)}
.matrix tr.sec.r-out .foldarrow{color:var(--edge-out)}
.matrix tr.sec .foldarrow:hover{color:var(--ink)}

/* Abbezahlt: nichts steht mehr aus (yearSettled in js/calc.js).
   Die ganze Zeile tritt grau zurück und überschreibt dabei die
   Blockfarbe — deshalb steht die Regel hinter allen anderen. */
.matrix tr.settled td{background:var(--settled)}
/* Der Name bleibt schwarz: grau ist der Hintergrund, nicht die
   Position. Die Notiz darunter ebenso — sie trägt seit 22.8.26
   dasselbe Bild wie die Monatsnotiz (Strich davor, .itemnote in
   css/tokens.css), und das soll auf einer abgeschlossenen Zeile
   nicht anders aussehen als auf jeder anderen. */
.matrix tr.settled td.lab{color:var(--ink)}

/* ── Die Gesamtzeile bleibt stehen ────────────────────────────
   Sie fasst alles zusammen, was darunter steht — beim Scrollen
   durch hundert Posten soll sie nicht verschwinden. Sie steht im
   **Kopf** der Tabelle (matrixHead in js/views/jahr.js) und klebt
   unter den Spaltennamen: `--headH` ist deren Höhe, gemessen einmal
   je Zeichnung in sizeMatrix() (js/app.js). Die links
   festgepinnten Zellen kleben zusätzlich nach links. */
.matrix tr.balpin{position:sticky;top:var(--headH,0px);z-index:5}
.matrix tr.balpin td{border-bottom:1px solid var(--edge-bal)}

/* ── Die Blockzeilen bleiben stehen ───────────────────────────
   Einnahmen, Flexible Payments, Regelmäßige Kosten: dasselbe eine
   Stufe tiefer — sie kleben unter der Gesamtzeile (--headH plus
   --pinH). Dass jede Zeile nur bis zum Ende **ihres** Blocks klebt,
   macht der eigene `tbody` je Block (siehe viewJahr).

   **Geklebt wird an der Zeile, nicht an ihren Zellen** — sonst
   entstünde je Zelle ein eigener Klebepunkt und die Zeile risse
   beim seitlichen Rollen auseinander. Welche der drei Zeilen man
   sieht, entscheidet die Stapelfolge oben: sie kleben alle an
   derselben Höhe, und der spätere Block deckt den früheren zu. */
.matrix tr.secpin{position:sticky;top:calc(var(--headH,0px) + var(--pinH,0px))}
.matrix tr.secpin.r-in{z-index:2}
.matrix tr.secpin.r-flex{z-index:3}
.matrix tr.secpin.r-out{z-index:4}

/* ── Trennlinien ──────────────────────────────────────────────
   Feine Spaltentrenner in rgba(0,0,0,.08), durchgehend über alle
   Zeilen (4a); die Gesamtspalte behält eine etwas kräftigere
   Fassung, aber keine schwarze mehr. */
.matrix td.mk,.matrix th.mkh{border-right:1px solid rgba(0,0,0,.08)}
.matrix td.tot,.matrix th.toth{border-left:1px solid var(--rule-strong);border-right:0}

/* Laufender Monat: je eine rote Linie links und rechts.
   Beide werden als inset-Schatten gezeichnet, damit sie identisch
   rendern. Die graue Trennlinie des Monats davor wird entfernt
   (.cm-pre) — sonst stünde links grau+rot nebeneinander und die
   linke Markierung sähe dicker aus als die rechte. */
.matrix th.cm-l,.matrix td.cm-l{box-shadow:inset 1px 0 0 var(--seal)}
.matrix th.cm-r,.matrix td.cm-r{border-right:0;box-shadow:inset -1px 0 0 var(--seal)}
.matrix td.mk.cm-pre,.matrix th.mkh.cm-pre{border-right:0}
.matrix thead th.cm-l{color:var(--seal);font-weight:700}

/* ── Beträge ──────────────────────────────────────────────────
   Kategorien- und Summenzeilen bleiben schwarz; nur die einzelnen
   Positionen (.itemrow) werden nach Vorzeichen eingefärbt — dazu
   zählen auch die Kakeibo-Zeilen. Gelb steht dabei über der
   Vorzeichenfarbe, gilt aber nur für Monate, die geschätzt und
   noch offen sind (estAt in js/views/jahr.js). */
.matrix td.num.pos,.matrix td.num.neg{color:var(--ink)}
.matrix tr.itemrow td.num.pos{color:var(--ok)}
.matrix tr.itemrow td.num.neg{color:var(--seal)}
.matrix td.num.est{color:var(--amber)!important;font-weight:400}
.matrix tr:not(.itemrow) td.num.est{color:var(--ink)!important}
/* Die Saldokorrektur wird wie eine Kategorie gesetzt, ihr
   Vorzeichen bleibt aber farbig — ob nach oben oder nach unten
   korrigiert wird, ist die eigentliche Aussage der Zeile.
   **Nicht aber „Saldo je Monat"**: die Zeile trägt seit dem
   Mac-Redesign dieselbe r-bal-Klasse (sie ist die Blockzeile der
   blauen Karte) und bliebe sonst doch farbig. */
.matrix tr.r-bal:not(.balpin) td.num.pos{color:var(--ok)}
.matrix tr.r-bal:not(.balpin) td.num.neg{color:var(--seal)}
/* „Saldo je Monat" (.balpin) bleibt dagegen in Tinte: die Zeile
   ist seit dem Mac-Redesign die Blockzeile der blauen Saldo-Karte
   (4a), und Blockzeilen tragen keine Vorzeichenfarbe. Ob ein Monat
   ins Plus oder ins Minus läuft, sagt das Minus vor der Zahl. */

/* ── Haken, Fragezeichen, Notizlampe je Monatszelle ───────── */
.mk-ok{color:var(--ok)}
.mk-q{color:var(--amber)}
.mkcell{display:grid;grid-template-columns:13px 16px;gap:3px;align-items:center;justify-items:center;
  width:32px;margin:0 auto}
.mkcell .mksym{width:13px;text-align:center;line-height:1}

/* ── Breitenregler in der Kopfzeile der Jahresansicht ─────── */
.widthctl{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ink-2)}
.widthctl input[type=number]{width:74px;padding:4px 6px;cursor:default;caret-color:transparent}

/* ── Runde Ecken je Karte (Mock 4a) ───────────────────────────
   Jeder Block liest sich als Karte mit Radius 8: der Spaltenkopf,
   die blaue Saldo-Karte (Gesamtzeile + Saldokorrektur) und die
   drei Blöcke. Oben rundet die erste Zeile nach einer Leerzeile
   (bzw. die Gesamtzeile), unten die letzte Zeile ihres tbody.

   **Eine Ecke wird nicht einfach beschnitten.** Kopf-, Gesamt- und
   Blockzeilen kleben, und die Zeilen darunter ziehen beim Scrollen
   unter ihnen durch — durch eine nur beschnittene Ecke schienen
   sie neben der Rundung hindurch, und die Ecke sähe eckig aus.
   Deshalb trägt die Eckzelle selbst Papier (eckig und deckend, es
   füllt die Ecke) und ihre Farbe liegt als gerundetes ::before
   darüber; die 3-px-Kante wandert auf diese Schicht mit. Der
   Inhalt bleibt lesbar, weil Kinder mit z-index:-1 vor dem Inhalt
   der Zelle gezeichnet werden — die Zelle muss dafür nur selbst
   der Stapelrahmen sein (die linken kleben ohnehin, die rechten
   bekommen position:relative + z-index:0). */
.matrix thead tr:first-child{--cellbg:#fff}
.matrix tr.r-in{--cellbg:var(--bg-in)}
.matrix tr.r-flex{--cellbg:var(--bg-flex)}
.matrix tr.r-out{--cellbg:var(--bg-out)}
.matrix tr.r-bal{--cellbg:var(--bg-bal)}
.matrix tr.grp.r-in{--cellbg:var(--bg-in-2)}
.matrix tr.grp.r-out{--cellbg:var(--bg-out-2)}
.matrix tr.sec.r-in{--cellbg:var(--bg-in-3)}
.matrix tr.sec.r-flex{--cellbg:var(--bg-flex-3)}
.matrix tr.sec.r-out{--cellbg:var(--bg-out-3)}
.matrix tr.sec.r-bal{--cellbg:var(--bg-bal-3)}
.matrix tr.settled{--cellbg:var(--settled)}
/* Die Eckzellen bauen ihre Rundung aus **Hintergrund-Schichten**,
   nicht aus border-radius: unten die Blockfarbe (--cellbg),
   zuoberst je Ecke ein
   8×8-Stück, das außerhalb des Viertelkreises Papier malt — die
   Ecke ist damit „ausgestanzt". Ein Hintergrund hängt an der Zelle
   selbst und wandert mit ihr, ob sie klebt oder scrollt; er kennt
   keine Stapel- und Positionierungs-Sonderfälle von Tabellenzellen
   (ein ::before mit position:absolute in einem klebenden td ist
   genau so ein Sonderfall — Safari legt es an der falschen Fläche
   an). Die vier Eckstücke stehen als Variablen am .matrix; das
   Wort „3-px-Kante" weiter oben meint nur noch die
   Kategoriezeilen. */
.matrix{
  --cTL:radial-gradient(circle 8px at 100% 100%,rgba(0,0,0,0) 7.4px,var(--paper) 7.9px) top left/8px 8px no-repeat;
  --cTR:radial-gradient(circle 8px at 0 100%,rgba(0,0,0,0) 7.4px,var(--paper) 7.9px) top right/8px 8px no-repeat;
  --cBL:radial-gradient(circle 8px at 100% 0,rgba(0,0,0,0) 7.4px,var(--paper) 7.9px) bottom left/8px 8px no-repeat;
  --cBR:radial-gradient(circle 8px at 0 0,rgba(0,0,0,0) 7.4px,var(--paper) 7.9px) bottom right/8px 8px no-repeat}
/* Welche Zelle welche Ecke stanzt: nur die Variablen. Ein
   zugeklappter Block ist erste und letzte Zeile zugleich — dann
   treffen sich beide Regeln und alle vier Ecken runden. `cbot`
   trägt die Gesamtzeile, wenn keine Saldokorrektur unter ihr
   steht (viewJahr): die blaue Karte ist dann nur diese Zeile. */
.matrix thead tr:first-child th.ed{--eTL:var(--cTL);--eBL:var(--cBL);--cellbg:#fff}
.matrix thead tr:first-child th.toth{--eTR:var(--cTR);--eBR:var(--cBR);--cellbg:#fff}
.matrix tr.balpin td.ed{--eTL:var(--cTL)}
.matrix tr.balpin td.tot{--eTR:var(--cTR)}
.matrix tr.balpin.cbot td.ed{--eBL:var(--cBL)}
.matrix tr.balpin.cbot td.tot{--eBR:var(--cBR)}
.matrix tbody tr.spacer+tr td.ed{--eTL:var(--cTL)}
.matrix tbody tr.spacer+tr td.tot{--eTR:var(--cTR)}
.matrix tbody tr:last-child td.ed{--eBL:var(--cBL)}
.matrix tbody tr:last-child td.tot{--eBR:var(--cBR)}
/* Der Hintergrund-Stapel der Eckzellen: Eckstücke oben, zuunterst
   die Blockfarbe. box-shadow:none braucht !important: die
   Kantenregel der Kategoriezeilen (.matrix tr.grp.* td.ed) ist
   spezifischer als jede Eckzellen-Auswahl, und ein inset-Schatten
   läge über allen Hintergrundschichten — eine Kategoriezeile als
   letzte Zeile eines Blocks verliert ihre Kante deshalb an dieser
   einen Zelle, bevor sie quer durch die runde Ecke malte. */
.matrix tr.balpin td.ed,.matrix tbody tr.spacer+tr td.ed,
.matrix tbody tr:last-child td.ed{
  background:var(--eTL,none),var(--eBL,none),var(--cellbg,var(--paper-2));
  box-shadow:none!important}
.matrix thead tr:first-child th.ed{
  background:var(--eTL,none),var(--eBL,none),var(--cellbg,#fff)}
.matrix thead tr:first-child th.toth,.matrix tr.balpin td.tot,
.matrix tbody tr.spacer+tr td.tot,.matrix tbody tr:last-child td.tot{
  background:var(--eTR,none),var(--eBR,none),var(--cellbg,var(--paper-2))}

/* ── Unter der letzten Zeile einer Karte keine Trennlinie ─────
   Dieselbe Regel wie in den Karten der Monatsansicht
   (css/ledger.css): unter der letzten Zeile schließt die Karte
   selbst ab, ein Strich quer über ihren unteren Rand sähe aus, als
   käme noch etwas. Das trifft vor allem den **zugeklappten**
   Block: seine Blockzeile ist zugleich die letzte Zeile, und die
   Linie, die offen den Kopf von den Posten trennt, stünde
   zugeklappt unter nichts. `cbot` ist die Gesamtzeile ohne
   Saldokorrektur darunter — dieselbe Lage im Kopf der Tabelle. */
.matrix tbody tr:last-child td{border-bottom:0}
.matrix tr.balpin.cbot td{border-bottom:0}

/* ── Die Saldokorrektur-Zeile (Mock 4a) ───────────────────────
   Keine Blockzeile mehr (cls 'r-bal' ohne 'sec' in viewJahr):
   heller blauer Grund, gewöhnliche Schrift wie eine Position —
   die Blockzeile der blauen Karte ist „Saldo je Monat" darüber.
   Nur der Stift trägt das Blau der Karte. */
.matrix tbody tr.r-bal:not(.sec) .pencil{color:var(--ink-bal)}