/* ═══════════════════════════════════════════════════════════════════════════
   ui-varianten.css — v1082 · Backlog Punkt 2 (Darstellungs-Vorlagen)
   Vorlage: design/mockups/dp-darstellung-panel.html (abgenommen 2026-08-05)

   Diese Datei war seit 20260801 in index.html:29 verlinkt und existierte
   nicht — einer der beiden 404 aus dem Backlog. Der Kommentar dort sagt
   schon "nach style.css, damit html[data-ui-*] greift". Genau das ist sie.

   ─── BAUFORM (gemessen, nicht geraten) ────────────────────────────────────
   Im laufenden DOM bei 1920px gezaehlt: 65 Elemente mit DECKENDER
   Hintergrundfarbe. Der Grossteil davon sind Formularfelder und div.card,
   alle #FFFFFF — die folgen der Flaeche. Tragend ist wenig:

     #sidebar          rgb(0,0,0)        <- haengt an --dp-s0 / --dp-s1
     nav.tabs          rgb(10,8,5)       <- HART, kein Token
     .app-wrap .body   rgb(248,246,241)
     .main-col #s0     #FFFFFF
     .sb-card          haengt an --dp-obj-card / --dp-card

   Deshalb NICHT 6 x 65 Regeln, sondern EIN Satz Flaechenregeln, der Tokens
   liest, plus 6 x ~30 Token-Zeilen. Das ist die Architektur des Mockups.

   ─── DIE ZWEI FALLEN AUS CLAUDE.md ────────────────────────────────────────
   1) "Token-Ueberschreibungen reichen NICHT." Stimmt — aber nicht ueberall.
      Gemessen: aside.sidebar{background:var(--dp-s0)!important} (0,1,1) und
      .sb-card{background:var(--dp-obj-card,...)!important} lesen sehr wohl
      Tokens. Fuer die gilt der Token-Weg.
      nav.tabs dagegen gewinnt ueber
      header.hdr.has-v64-score + nav.tabs{background:rgb(10,8,5)!important}
      — (0,2,2), hart kodiert. Die wird hier EINZELN benannt.
   2) "Bei gleicher Spezifitaet gewinnt die spaetere Regel." Diese Datei
      laedt nach style.css, aber darauf wird sich NICHT verlassen: jeder
      Selektor traegt html[data-ui-theme="…"] und liegt damit ueber
      body.dp-chrome-hell (0,2,0) bzw. den v622-Bloecken.

   ─── ZWINGEND (Backlog) ───────────────────────────────────────────────────
   * "dealpilot" traegt KEIN Attribut. Ohne data-ui-theme greift hier keine
     einzige Regel -> wer nicht umschaltet, bekommt die App bitgenau wie
     heute. Das ist der Grund fuer das [data-ui-theme] an JEDEM Selektor.
   * Gold bleibt var(--gold), damit Whitelabel weiter mitfaerbt.
   * Statusfarben #3FA56C und #B8625C werden NIE angefasst.
   * Goldnahe Literale stehen als var(--wl-<hex>, #<hex>) — die Hexwerte
     dafuer stammen aus WL_TINTS (whitelabel-override.js:64). Neutrale
     Grautoene sind dort NICHT enthalten und bleiben roh.
   ═══════════════════════════════════════════════════════════════════════ */


/* ══════════════════════════════════════════════════════════════════════════
   1 · TOKEN-SAETZE — eine Vorlage = ein Block, sonst nichts
   ══════════════════════════════════════════════════════════════════════════
   "dealpilot" fehlt hier absichtlich. Kein Attribut, keine Regel, kein Diff.
   ------------------------------------------------------------------------ */

/* ── Kontor · Reinweiss, Haarlinien, kein Radius, kein Schatten ──
   Fuer den Bestandshalter mit vielen Objekten: maximale Ruhe, die Liste
   traegt sich selbst. Karten ohne Seitenrahmen, nur Trennlinien. */
html[data-ui-theme="kontor"] {
  --uv-chrome:      #FFFFFF;
  --uv-chrome-ink:  #141310;
  --uv-chrome-ink2: #4a4740;
  --uv-chrome-mut:  #918d84;
  --uv-chrome-line: #E7E4DD;
  --uv-pane:        #FFFFFF;
  --uv-surf:        #FFFFFF;
  --uv-surf2:       #FAF9F7;
  --uv-ink:         #141310;
  --uv-ink2:        #4a4740;
  --uv-mut:         #918d84;
  --uv-line:        #E7E4DD;
  --uv-line2:       #D9D5CC;
  --uv-r:           3px;
  --uv-rs:          3px;
  --uv-sh:          none;
  --uv-card:        #FFFFFF;
  --uv-card-line:   #E7E4DD;
  --uv-card-ink:    #141310;
  --uv-card-ink2:   #4a4740;
  --uv-card-mut:    #918d84;
  --uv-card-tile:   #FAF9F7;
  --uv-card-tl:     #E7E4DD;
  --uv-f-body:      'Inter', system-ui, sans-serif;
  --uv-f-disp:      'Space Grotesk', 'Inter', sans-serif;
  --uv-f-h1:        'Space Grotesk', 'Inter', sans-serif;
  --uv-logo-box:    #050505;
}

/* ── Panel · Kuehles Grau-Weiss, weiche Radien, feiner Schatten ──
   Der neutralste Untergrund. Kein Braun-, kein Cremestich, damit ein
   fremder Partnerakzent nicht gegen den Untergrund arbeitet. */
html[data-ui-theme="panel"] {
  --uv-chrome:      #FFFFFF;
  --uv-chrome-ink:  #151a20;
  --uv-chrome-ink2: #4a535e;
  --uv-chrome-mut:  #8a95a2;
  --uv-chrome-line: #E2E7ED;
  --uv-pane:        #F3F5F7;
  --uv-surf:        #FFFFFF;
  --uv-surf2:       #F8F9FB;
  --uv-ink:         #151a20;
  --uv-ink2:        #4a535e;
  --uv-mut:         #8a95a2;
  --uv-line:        #E2E7ED;
  --uv-line2:       #D3DAE2;
  --uv-r:           11px;
  --uv-rs:          7px;
  --uv-sh:          0 1px 2px rgba(21,26,32,.05), 0 4px 12px -8px rgba(21,26,32,.14);
  --uv-card:        #FFFFFF;
  --uv-card-line:   #E2E7ED;
  --uv-card-ink:    #151a20;
  --uv-card-ink2:   #4a535e;
  --uv-card-mut:    #8a95a2;
  --uv-card-tile:   #F8F9FB;
  --uv-card-tl:     #E2E7ED;
  --uv-f-body:      'Inter', system-ui, sans-serif;
  --uv-f-disp:      'Inter', system-ui, sans-serif;
  --uv-f-h1:        'Inter', system-ui, sans-serif;
  --uv-logo-box:    #050505;
}

/* ── Kanzlei · Hell mit Serife, viel Weissraum, Panels ohne Rahmen ──
   Fuer den Berater vor dem Mandanten. Die Flaechen setzen sich durch
   Helligkeit ab, nicht durch Linien — deshalb --uv-line sehr zurueckhaltend
   und die Panel-Rahmen weiter unten ganz aus. */
html[data-ui-theme="kanzlei"] {
  --uv-chrome:      #FBFAF7;
  --uv-chrome-ink:  #1c1a16;
  --uv-chrome-ink2: #55504a;
  --uv-chrome-mut:  #928d84;
  --uv-chrome-line: #E8E4DC;
  --uv-pane:        #F7F5F1;
  --uv-surf:        #FFFFFF;
  --uv-surf2:       #FBFAF7;
  --uv-ink:         #1c1a16;
  --uv-ink2:        #55504a;
  --uv-mut:         #928d84;
  --uv-line:        #EDE9E1;
  --uv-line2:       #E2DDD3;
  --uv-r:           8px;
  --uv-rs:          6px;
  --uv-sh:          none;
  --uv-card:        #FFFFFF;
  --uv-card-line:   #EDE9E1;
  --uv-card-ink:    #1c1a16;
  --uv-card-ink2:   #55504a;
  --uv-card-mut:    #928d84;
  --uv-card-tile:   #FBFAF7;
  --uv-card-tl:     #EDE9E1;
  --uv-f-body:      'Inter', system-ui, sans-serif;
  --uv-f-disp:      'Cormorant Garamond', Georgia, serif;
  --uv-f-h1:        'Cormorant Garamond', Georgia, serif;
  --uv-logo-box:    #050505;
}

/* ── Boarding · Creme, Markenstreifen, Ticket-Karten ──
   Markentreu, aber hell. Die Cremetoene stehen als var(--wl-…), damit ein
   Reseller-Akzent sie mitfaerbt — sie sind Teil der Marke, nicht neutral. */
html[data-ui-theme="boarding"] {
  --uv-chrome:      var(--wl-faf5e8, #FAF5E8);
  --uv-chrome-ink:  #1e1a12;
  --uv-chrome-ink2: #554d3a;
  --uv-chrome-mut:  #8d8471;
  --uv-chrome-line: var(--wl-ece0c2, #ECE0C2);
  --uv-pane:        #FDFCFA;
  --uv-surf:        #FFFFFF;
  --uv-surf2:       var(--wl-faf5e8, #FAF5E8);
  --uv-ink:         #1e1a12;
  --uv-ink2:        #554d3a;
  --uv-mut:         #8d8471;
  --uv-line:        var(--wl-ece0c2, #ECE0C2);
  --uv-line2:       var(--wl-e8d9a8, #E8D9A8);
  --uv-r:           12px;
  --uv-rs:          8px;
  --uv-sh:          0 2px 10px -8px rgba(30,24,10,.34);
  --uv-card:        var(--wl-fbf6e9, #FBF6E9);
  --uv-card-line:   var(--wl-e8d9a8, #E8D9A8);
  --uv-card-ink:    #1e1a12;
  --uv-card-ink2:   #554d3a;
  --uv-card-mut:    #8d8471;
  --uv-card-tile:   #FFFFFF;
  --uv-card-tl:     var(--wl-ece0c2, #ECE0C2);
  --uv-f-body:      'Inter', system-ui, sans-serif;
  --uv-f-disp:      'Space Grotesk', 'Inter', sans-serif;
  --uv-f-h1:        'Space Grotesk', 'Inter', sans-serif;
  --uv-logo-box:    #050505;
}

/* ── Konsole · Dicht, Monospace, ohne Fotos ──
   Fuer 40+ Objekte. Bleibt bewusst dunkel: wer so arbeitet, sitzt lange
   davor. Kein Creme, kein Gold-Untergrund — nur Akzent auf Anthrazit. */
html[data-ui-theme="konsole"] {
  --uv-chrome:      #16181C;
  --uv-chrome-ink:  #E6E8EA;
  --uv-chrome-ink2: #A7ACB3;
  --uv-chrome-mut:  #6E747C;
  --uv-chrome-line: #262A30;
  --uv-pane:        #101215;
  --uv-surf:        #1A1D22;
  --uv-surf2:       #14171B;
  --uv-ink:         #E6E8EA;
  --uv-ink2:        #A7ACB3;
  --uv-mut:         #6E747C;
  --uv-line:        #262A30;
  --uv-line2:       #313640;
  --uv-r:           4px;
  --uv-rs:          3px;
  --uv-sh:          none;
  --uv-card:        #1A1D22;
  --uv-card-line:   #262A30;
  --uv-card-ink:    #E6E8EA;
  --uv-card-ink2:   #A7ACB3;
  --uv-card-mut:    #6E747C;
  --uv-card-tile:   #14171B;
  --uv-card-tl:     #262A30;
  --uv-f-body:      'JetBrains Mono', ui-monospace, monospace;
  --uv-f-disp:      'JetBrains Mono', ui-monospace, monospace;
  --uv-f-h1:        'JetBrains Mono', ui-monospace, monospace;
  --uv-logo-box:    transparent;
}


/* ══════════════════════════════════════════════════════════════════════════
   2 · DIE TOKENS, DIE DIE BESTEHENDE FASSUNG SCHON LIEST
   ══════════════════════════════════════════════════════════════════════════
   Gemessen: aside.sidebar und .sb-card lesen --dp-s0/--dp-s1 bzw.
   --dp-obj-card. Diese Bruecke spart rund 20 Einzelregeln — und sie ist
   praeziser, weil sie genau dort greift, wo die Fassung ohnehin nachsieht.
   ------------------------------------------------------------------------ */
html[data-ui-theme] body {
  /* v1102: die Seitenleiste liest --dp-s0/--dp-s1. Der Bereichsregler
     "Objektleiste" setzt --dp-side-bg — der bekommt hier den Vortritt,
     sonst waere er unter jeder Vorlage wirkungslos. */
  --dp-s0:       var(--dpuv-side-bg, var(--uv-chrome));
  --dp-s1:       var(--dpuv-side-bg, var(--uv-chrome));
  --dp-card:     var(--dpuv-kpi-card, var(--uv-card));
  /* --dp-obj-card NICHT hier: der Regler setzt genau diesen Namen inline
     am body, ein Eintrag hier waere ein Selbstbezug. Die Kartenregel liest
     ihn direkt (siehe .sb-card weiter unten). */
  --surface:     var(--uv-surf);
  --border:      var(--uv-line);
  --muted:       var(--uv-mut);
  /* v1099 · Die zwei TEXT-Tokens fehlten hier. Sichtbar wurde das erst,
     als v1099 den Arbeitsbereich der Vorlage folgen liess: vorher stand
     dunkler Text auf weissem #s0 und war lesbar, danach dunkel auf dunkel.

     GEMESSEN in "konsole", Kontrastlauf ueber #s0 mit Schwelle 3:
     13 Fundstellen, die schlimmste bei 1,08 — und die Mehrheit stand auf
     rgb(42,39,39). Das ist --ch #2A2727, also genau die Falle, die
     CLAUDE.md benennt: "--ch nie auf Obsidian".

       .sec-title   liest var(--ch)                   (0,1,0)
       .qz-card label liest var(--text, #1a1a1a)      (0,2,1)

     Beide lesen ihr Token — hier greift die Bruecke also nachweislich,
     anders als bei den Flaechen. Wo die Spezifitaet trotzdem nicht reicht,
     steht weiter unten eine eigene Regel. */
  --ch:          var(--uv-ink);
  --text:        var(--uv-ink);
}

/* ── v1096b · Der Markenton fuer helle Vorlagen, auf BEIDEN Bedienwegen ──
   GEMESSEN, und es war ein Loch in v1089/v1090/v1093 und im ersten Anlauf
   von v1096: die Marke kam nur durch, wenn sie ueber den Sweeper gesetzt
   wurde. Es gibt aber zwei Wege, den Akzent zu setzen:

     DealPilotWhitelabel.apply()   setzt --gold, --gold-2, --gold-d
                                   und die 25 --wl-<hex>            -> alles da
     _dpDispAccent() (settings.js:3109, das alte Panel) ruft nur
       DealPilotConfig.branding.setTheme({accent}) und setzt damit
       --gold, --gold-hi/-lo/-l/-2/-3/-bg                -> KEIN --gold-d,
                                                            KEIN --wl-*

   Nachgestellt mit violettem Akzent ueber den Regler und Vorlage "kontor":
   --gold stand auf #7C5CBF, --gold-d und --wl-9a7f33 waren nicht gesetzt,
   und JEDE Regel fiel auf ihr Literal #9a7f33 zurueck — Objektnummer,
   aktiver Reiter, Preis, Aktionen-Knopf und Fortschritt standen alle auf
   rgb(154,127,51), also Standard-Gold neben einem violetten Akzent.

   Deshalb haengt der Ton ab hier an --gold, das auf beiden Wegen steht,
   und wird nur dann selbst gerechnet, wenn das Spezialtoken fehlt.
   Ist es da (Whitelabel), gewinnt es unveraendert — v1089/v1090 sehen
   also bitgenau aus wie vorher.

   Die 76 % sind an #9a7f33 gemessen und nicht geschaetzt:
   color-mix(in srgb, #C9A84C 76%, #000) = rgb(153,128,58) gegen das
   bisherige Literal rgb(154,127,51).

   v1096b hatte hier ZWEI Toene, weil --gold-d und --wl-9a7f33 im Whitelabel
   verschiedene Werte tragen (unter Rot: #702936 gegen #451b23).

   v1097 legt sie zusammen, und zwar auf --gold-d. Zwei Gruende, beide
   gemessen:

   1) --gold-d traegt seit v1097 einen MINDESTKONTRAST (config.js), der
      Tint-Weg --wl-9a7f33 dagegen nicht: er verschiebt alle 66 Toene nur
      relativ in HSL. Mit Hellgelb #F0D000 als Akzent kam der Aktionen-Knopf
      darueber auf Kontrast 3,27, der Fortschritt auf 3,15 — unter der
      Hausschwelle 3,8, waehrend --gold-d 3,90 lieferte.
   2) Es waren zwei verschiedene Dunkeltoene fuer dieselbe Sache: "Marke auf
      hellem Grund". Der Knopf stand auf #451b23, der Preis daneben auf
      #702936.

   Was sich dadurch sichtbar aendert: die v1089/v1090-Stellen (Objektnummer
   im Kopf, Kerosin-Pille, Pfeil am Aktionen-Knopf) werden unter einer
   Vorlage eine Spur heller und stehen jetzt auf demselben Ton wie Preis und
   Nummernpille. Ausserhalb der Vorlagen ist nichts angefasst — dort greift
   keine dieser Regeln.

   Der Tint-Weg selbst bleibt unberuehrt: unter den 66 Toenen sind auch
   Flaechen (die Cremetoene), eine pauschale Kontrastregel waere dort
   falsch. Die vier Toene, die bei einem extrem hellen Akzent reissen,
   stehen als Restpunkt im BACKLOG. */
html[data-ui-theme] {
  --uv-marke-d:  var(--gold-d, color-mix(in srgb, var(--gold, #C9A84C) 76%, #000));
  /* v1164: --uv-marke-dd war bisher nur ein Alias auf --uv-marke-d — die
     Sollbruchstelle war vorgesehen, aber nie benutzt. Gemessen auf Staging
     mit einem Grund-Leser, der VERLAEUFE auswertet (ein Leser, der nur
     background-color kennt, meldet hier faelschlich Weiss):

       #hdr-obj-num, 10,5 px / 700  ->  kanzlei  3,88  auf #FBFAF7
                                        boarding 3,72  auf #FAF5E8

     Kleiner Text braucht 4,5. Der Punkt im Backlog nannte 2,98 / 2,88 —
     die Regel darunter (Abschnitt (b)) hat also schon gewirkt, sie war nur
     nicht weit genug. Jetzt der letzte Schritt.

     RELATIV zum Markenton abgedunkelt, nicht auf ein Literal gesetzt:
     ein Whitelabel-Rot bleibt Rot und wird nur dunkler. Ein festes Gold
     haette die Mandantenmarke an sechs Stellen ueberschrieben — und
     gold-audit.py haette es zu Recht angemahnt.

     Alle sechs Leser von --uv-marke-dd stehen auf HELLEM Grund unter
     kontor/panel/kanzlei/boarding (Objektnummer, Kerosin-Pille, zwei
     Teile des Aktionen-Knopfs, Reiter-Status). Keiner auf dunklem Grund
     — deshalb ist das Abdunkeln fuer alle richtig und nicht nur fuer den
     gemeldeten Fall. */
  --uv-marke-dd: color-mix(in srgb, var(--uv-marke-d) 82%, #000);
}


/* ══════════════════════════════════════════════════════════════════════════
   3 · FLAECHEN, DIE KEINE TOKENS LESEN — einzeln benannt
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Grundflaeche ── */
html[data-ui-theme] body,
html[data-ui-theme] body .app-wrap {
  background: var(--uv-pane) !important;
  color: var(--uv-ink) !important;
  font-family: var(--uv-f-body) !important;
}
html[data-ui-theme] body .main-col { background: var(--uv-pane) !important; }
html[data-ui-theme] body .body     { background: var(--uv-pane) !important; }

/* ── v1099 · Der Arbeitsbereich selbst ────────────────────────────────────
   MARCELS BEFUND vom 06.08. (design/mockups/Screenshot 2026-08-06 112337):
   in "konsole" bleibt ein Teil des Arbeitsbereichs weiss.

   GEMESSEN: #s0.sec ist 1280x2462 und steht auf rgb(255,255,255) — in
   ALLEN fuenf Vorlagen, nicht nur in der dunklen. body und .main-col
   folgen korrekt der Vorlage, .sec nicht.

   URSACHE ist ein ZWEITES Attribut aus einer aelteren Funktion:
     style.css:29762  html[data-bg="white"] .sec {background:#fff!important}
   Das ist der Hintergrund-Umschalter V257-06 (settings.js:2915,
   DealPilotBgMode) — und "white" ist dort der STANDARD. Es traf also
   jeden, nicht nur denjenigen, der einmal umgeschaltet hat.

   Warum body und .main-col trotzdem stimmten: dort steht der Gegner bei
   (0,1,2) und meine Regel ebenfalls — bei Gleichstand gewinnt die
   spaetere, und diese Datei laedt nach style.css. Bei .sec liegt der
   Gegner aber bei (0,2,1) und gewinnt damit. .sec fehlte in v1082
   schlicht in der Aufzaehlung — und genau davor warnt CLAUDE.md:
   farbtragende Flaechen muessen EINZELN benannt werden.

   Hier auf (0,2,2) gehoben, also ueber den Gegner — nicht ueber die
   Ladereihenfolge. Derselbe Fall wie v1091 (A) mit dem Hell-Skin: die
   Vorlage ist die spaetere und ausdrueckliche Wahl und gewinnt. Ohne
   Vorlage bleibt data-bg unangetastet wirksam. */
html[data-ui-theme] body .sec { background: var(--uv-pane) !important; }

/* ── Kopfleiste ──
   header.hdr ist gemessen TRANSPARENT (49px, has-v64-score) und sitzt auf
   .main-col. Sie bekommt hier trotzdem eine eigene Flaeche, damit die
   Vorlage die Kopfzeile vom Arbeitsbereich absetzen kann. */
html[data-ui-theme] body header.hdr {
  /* v1102: --dp-header-bg zuerst. Siehe Block "Bereichsfarben" am
     Dateiende — der Regler muss die Vorlage uebersteuern duerfen. */
  background: var(--dpuv-header-bg, var(--uv-chrome)) !important;
  color: var(--uv-chrome-ink) !important;
  border-bottom: 1px solid var(--uv-chrome-line) !important;
}
html[data-ui-theme] body header.hdr .hdr-v61-row1,
html[data-ui-theme] body header.hdr .hdr-v61-row2 { background: transparent !important; }
html[data-ui-theme] body header.hdr .hdr-obj-name,
html[data-ui-theme] body header.hdr b { color: var(--uv-chrome-ink) !important; }

/* ── Tab-Leiste ──
   Der harte Fall: header.hdr.has-v64-score + nav.tabs traegt rgb(10,8,5)
   mit !important, Spezifitaet (0,2,2). Deshalb hier mit demselben
   Nachbarschafts-Selektor PLUS html[data-ui-theme] davor. */
html[data-ui-theme] body nav.tabs,
html[data-ui-theme] body .main-col > nav.tabs,
html[data-ui-theme] body header.hdr.has-v64-score + nav.tabs,
html[data-ui-theme] body header.hdr.has-v64-score + nav.tabs.tabs {
  background: var(--dpuv-header-bg, var(--uv-chrome)) !important;   /* v1102 */
  border-bottom: 1px solid var(--uv-chrome-line) !important;
}
html[data-ui-theme] body nav.tabs .tab,
html[data-ui-theme] body header.hdr.has-v64-score + nav.tabs .tab {
  color: var(--uv-chrome-mut) !important;
  font-family: var(--uv-f-body) !important;
}
html[data-ui-theme] body nav.tabs .tab.active,
html[data-ui-theme] body header.hdr.has-v64-score + nav.tabs .tab.active {
  color: var(--gold) !important;
  background: transparent !important;
}

/* ── Seitenleiste ──
   Der Flaechenwert kommt ueber --dp-s0 aus Abschnitt 2. Hier nur, was
   die Fassung nicht ueber Tokens loest: Text, Linien, Suchfeld. */
html[data-ui-theme] body aside.sidebar#sidebar {
  border-right: 1px solid var(--uv-chrome-line) !important;
  color: var(--uv-chrome-ink) !important;
}
html[data-ui-theme] body aside.sidebar .sb-header,
html[data-ui-theme] body aside.sidebar .sb-section-title,
html[data-ui-theme] body aside.sidebar .sb-actions-trigger,
html[data-ui-theme] body aside.sidebar #sb-user {
  background: transparent !important;
  border-color: var(--uv-chrome-line) !important;
  color: var(--uv-chrome-ink) !important;
}
html[data-ui-theme] body aside.sidebar .sb-section-title { color: var(--uv-chrome-mut) !important; }
html[data-ui-theme] body #sb-search-input {
  background: var(--uv-surf2) !important;
  border: 1px solid var(--uv-chrome-line) !important;
  color: var(--uv-chrome-ink) !important;
}
html[data-ui-theme] body #sb-search-input::placeholder { color: var(--uv-chrome-mut) !important; }

/* ── Panels und Formularfelder ──
   Das ist die Sammelmenge der 65 gemessenen Flaechen: div.card und die
   Eingabefelder. Sie folgen der Flaeche, brauchen also nur EINE Regel. */
html[data-ui-theme] body .card,
html[data-ui-theme] body .qz-card {
  background: var(--uv-surf) !important;
  border: 1px solid var(--uv-line) !important;
  border-radius: var(--uv-r) !important;
  box-shadow: var(--uv-sh) !important;
  color: var(--uv-ink) !important;
}
html[data-ui-theme] body .body input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),
html[data-ui-theme] body .body select,
html[data-ui-theme] body .body textarea {
  background: var(--uv-surf2) !important;
  border: 1px solid var(--uv-line2) !important;
  border-radius: var(--uv-rs) !important;
  color: var(--uv-ink) !important;
}
html[data-ui-theme] body label,
html[data-ui-theme] body .hint { color: var(--uv-ink2) !important; }

/* Kanzlei: Panels setzen sich ueber Weissraum ab, nicht ueber Linien. */
html[data-ui-theme="kanzlei"] body .card { border-color: transparent !important; }

/* ── Objektkarte ──
   Flaeche kommt ueber --dp-obj-card aus Abschnitt 2. Die Struktur ist die
   in CLAUDE.md gemessene (storage.js:_renderRichCard ab Z.866) — hier wird
   nichts geraten, nur eingefaerbt. */
html[data-ui-theme] body aside.sidebar .sb-card {
  /* v1082d — HIER LAG EIN ECHTER FEHLER, und meine erste Messung war blind
     dafuer. Die Karte traegt ihre Farbe NICHT als background-color (die ist
     gemessen rgba(0,0,0,0), also transparent), sondern als
       background-image: linear-gradient(135deg, rgba(20,15,5,.6), rgba(0,0,0,.7))
     v1082 hat deshalb nur ueber --dp-obj-card gefaerbt — der Gradient lag
     darueber und blieb dunkel. Auf hellen Vorlagen stand die Karte damit
     weiter schwarz in einer hellen Leiste.
     Der Kontrastlauf hat es nicht gefunden, weil er backgroundColor liest:
     er sah die transparente Karte, stieg zur hellen Sidebar hoch und rechnete
     gegen Weiss, waehrend real ein dunkler Verlauf dazwischenlag.
     Ein background-image muss also ausdruecklich abgeraeumt werden. */
  background-image: none !important;
  background-color: var(--dpuv-obj-card, var(--uv-card)) !important;   /* v1102 */
  border: 1px solid var(--uv-card-line) !important;
  border-radius: var(--uv-r) !important;
  box-shadow: var(--uv-sh) !important;
}
html[data-ui-theme] body aside.sidebar .sb-card .sbc-address { color: var(--uv-card-ink) !important; }
html[data-ui-theme] body aside.sidebar .sb-card .sbc-halter,
html[data-ui-theme] body aside.sidebar .sb-card .sbc-score-label { color: var(--uv-card-mut) !important; }
html[data-ui-theme] body aside.sidebar .sb-card .sbc-kp { color: var(--uv-card-ink) !important; }
html[data-ui-theme] body aside.sidebar .sb-card .sbc-mini-grid,
html[data-ui-theme] body aside.sidebar .sb-card .sbcm {
  background: var(--uv-card-tile) !important;
  border-color: var(--uv-card-tl) !important;
}
html[data-ui-theme] body aside.sidebar .sb-card .sbc-seq {
  background: var(--uv-card-tile) !important;
  border-color: var(--uv-card-tl) !important;
  color: var(--uv-card-ink2) !important;
}

/* Kontor: Karten ohne Seitenrahmen, nur Trennlinie — die Liste wird ruhiger. */
html[data-ui-theme="kontor"] body aside.sidebar .sb-card {
  border-left: 0 !important;
  border-right: 0 !important;
  border-top: 0 !important;
  border-radius: 0 !important;
}
/* Boarding: Markenstreifen als Kartenkopf. align-self:stretch ist Pflicht —
   align-items:center liesse das leere ::before auf null Hoehe schrumpfen
   und der Verlauf waere unsichtbar (CLAUDE.md, teuer bezahlt). */
html[data-ui-theme="boarding"] body aside.sidebar .sb-card { overflow: hidden !important; }
html[data-ui-theme="boarding"] body aside.sidebar .sb-card::before {
  content: "";
  display: block;
  align-self: stretch;
  height: 4px;
  background: linear-gradient(110deg, var(--wl-e8cc7a, #E8CC7A), var(--gold) 55%, var(--wl-b8932f, #b8932f));
}
/* Konsole: ohne Fotos — der Platz gehoert den Zahlen. */
html[data-ui-theme="konsole"] body aside.sidebar .sb-card .sbc-thumb { display: none !important; }

/* ── Typografie ── */
html[data-ui-theme] body h1,
html[data-ui-theme] body .set-section-h2 { font-family: var(--uv-f-h1) !important; color: var(--uv-ink) !important; }
html[data-ui-theme] body .sbc-address    { font-family: var(--uv-f-disp) !important; }

/* ── Logo-Kasten ──
   v1079 zeichnet den Goldrahmen aus CSS und legt im Hellmodus einen
   schwarzen Kasten dahinter, damit die weisse Wortmarke lesbar bleibt.
   Dieselbe Ueberlegung gilt fuer jede helle Vorlage. "konsole" ist dunkel
   genug und setzt --uv-logo-box deshalb auf transparent. */
html[data-ui-theme] body:not(.dp-sidebar-collapsed) aside.sidebar#sidebar .app-logo-simple-wrap-sidebar {
  background: var(--uv-logo-box) !important;
  border-color: var(--wl-c9a84c, #C9A84C) !important;
}


/* ══════════════════════════════════════════════════════════════════════════
   4 · KARTENFLAECHE — Backlog Punkt 5
   ══════════════════════════════════════════════════════════════════════════
   "Passend" ist der Normalfall und steht oben. "Weiss" heisst: Karten
   bleiben weiss, auch wenn die Vorlage dunkel ist. Ueber html[…] gescopt
   statt auf Ladereihenfolge gebaut.
   ------------------------------------------------------------------------ */
html[data-ui-surface="light"] body aside.sidebar .sb-card {
  /* Kurzform setzt background-image mit auf none — hier absichtlich, siehe
     den Befund zum Karten-Verlauf weiter oben. */
  background: #FFFFFF !important;
  --uv-card-ink:  #1a1712;
  --uv-card-ink2: #4e4940;
  --uv-card-mut:  #8f897c;
  --uv-card-tile: #FAF8F3;
  --uv-card-tl:   #E9E4D9;
}
html[data-ui-surface="light"] body aside.sidebar .sb-card .sbc-address,
html[data-ui-surface="light"] body aside.sidebar .sb-card .sbc-kp { color: #1a1712 !important; }
html[data-ui-surface="light"] body aside.sidebar .sb-card .sbc-halter,
html[data-ui-surface="light"] body aside.sidebar .sb-card .sbc-score-label { color: #8f897c !important; }
html[data-ui-surface="light"] body aside.sidebar .sb-card .sbc-mini-grid,
html[data-ui-surface="light"] body aside.sidebar .sb-card .sbcm {
  background: #FAF8F3 !important;
  border-color: #E9E4D9 !important;
}

/* ── v1107 · Die Kachel-Texte fehlten in dieser Aufzaehlung ───────────────
   Der Block oben dreht Adresse, Preis, Halter und Stufen-Label auf dunkle
   Toene, weil die Karte weiss wird — die Texte IN den Kacheln blieben aber
   auf ihrer Fassung fuer dunklen Grund.

   GEMESSEN (Grundfassung + Kartenflaeche "weiss", Kontrastlauf ueber die
   ganze Karte, Schwelle 3):

     .sbcm-scale span   rgba(168,162,153,.65)   k = 1,00   7 Stellen
     .sbcm-label        rgba(255,255,255,.70)   k = 1,86   3 Stellen
     .sbc-date          rgba(168,162,153,.85)   k = 1,67
     .sbc-arrow         rgba(168,162,153,.45)   k = 1,46
     .sbcm-val (gruen)  rgb(105,194,145)        k = 2,03
     .sbcm-val (blau)   rgb(110,175,217)        k = 2,25

   Der Backlog nannte nur .sbcm-label mit 1,06 und nur die Kombination
   dealpilot/konsole. Gemessen sind es sechs Sachverhalte, und die sieben
   Skalen-Beschriftungen mit k=1,00 sind der schlimmste — die waren schlicht
   unsichtbar.

   STATUSFARBEN werden dabei NICHT tokenisiert und NICHT umgefaerbt: Gruen
   bleibt Gruen, Rot bleibt Rot. Getauscht wird nur die fuer dunklen Grund
   gebaute Fassung gegen eine fuer hellen — dasselbe Vorgehen wie in
   v1082 Abschnitt (c). Die drei Werte sind in OKLab abgesenkt, bis sie
   gegen die Kachelflaeche #FAF8F3 auf 3,2 kommen; Farbton und Saettigung
   bleiben damit erhalten. */
html[data-ui-surface="light"] body aside.sidebar .sb-card .sbc-date,
html[data-ui-surface="light"] body aside.sidebar .sb-card .sbc-arrow,
html[data-ui-surface="light"] body aside.sidebar .sb-card .sbcm-label,
html[data-ui-surface="light"] body aside.sidebar .sb-card .sbcm-toggle-ico,
html[data-ui-surface="light"] body aside.sidebar .sb-card .sbcm-scale span,
html[data-ui-surface="light"] body aside.sidebar .sb-card .sbcm-tick {
  color: #8f897c !important;
}
html[data-ui-surface="light"] body aside.sidebar .sb-card .sbcm-good .sbcm-val { color: #3b9667 !important; }
html[data-ui-surface="light"] body aside.sidebar .sb-card .sbcm-info .sbcm-val { color: #4f90b8 !important; }
html[data-ui-surface="light"] body aside.sidebar .sb-card .sbcm-bad  .sbcm-val { color: #ba726d !important; }

/* ── v1107b · dasselbe fuer JEDE Vorlage, nicht nur fuer "weiss" ─────────
   Die Gegenprobe hat den Punkt groesser gemacht, als er im Backlog stand:

     dealpilot (Grundfassung, dunkle Karte)  19 Fundstellen  <- Istzustand
     kontor  (helle Karte, OHNE "weiss")     14 Fundstellen  <- Fehler
     konsole (dunkle Karte)                   3 Fundstellen

   In "kontor" standen dieselben sieben Skalen-Beschriftungen bei k=1,00
   wie bei "weiss". Die Vorlage macht die Karte hell und setzt --uv-card-*,
   aber die Kachel-Texte lasen die Tokens nicht — sie behielten ihre
   Grundfassung, die fuer die dunkle Karte gebaut ist.

   Hier deshalb ueber --uv-card-mut statt ueber einen festen Wert: in den
   hellen Vorlagen ist der Ton dunkel, in "konsole" hell. Eine Regel, beide
   Richtungen. Die Grundfassung ohne Vorlage bleibt unberuehrt — dort ist
   die Karte dunkel und die Toene sind dafuer gebaut. */
html[data-ui-theme] body aside.sidebar .sb-card .sbc-date,
html[data-ui-theme] body aside.sidebar .sb-card .sbc-arrow,
html[data-ui-theme] body aside.sidebar .sb-card .sbcm-label,
html[data-ui-theme] body aside.sidebar .sb-card .sbcm-toggle-ico,
html[data-ui-theme] body aside.sidebar .sb-card .sbcm-scale span,
html[data-ui-theme] body aside.sidebar .sb-card .sbcm-tick {
  color: var(--uv-card-mut) !important;
}

/* Und die Marken-Elemente auf einer WEISSEN Karte in einer DUNKLEN Vorlage.
   GEMESSEN in konsole + weiss: .sbc-seq k=1,40 und .sbc-kp k=1,62 — die
   v1093/v1096-Regeln setzen dort --gold-2, den hellen Markenton, und der
   steht dann auf einer weissen Karte. Die Kartenflaeche ist die spaetere
   und ausdruecklichere Wahl, also gewinnt sie: dunkler Markenton. */
html[data-ui-theme="konsole"][data-ui-surface="light"] body aside.sidebar .sb-card .sbc-seq,
html[data-ui-theme="konsole"][data-ui-surface="light"] body aside.sidebar .sb-card .sbc-kp {
  color: var(--uv-marke-d) !important;
}

/* ── v1108 · Die Score-Zahl in der dunklen Vorlage ───────────────────────
   GEMESSEN auf der Objektkarte, Ziffer gegen Kartenflaeche:

     dealpilot  rgb(26,26,26)   k = 17,40   (dunkle Ziffer, helle Scheibe)
     kontor     rgb(20,19,16)   k = 18,58   folgt --uv-card-ink
     panel      rgb(21,26,32)   k = 17,49   folgt --uv-card-ink
     konsole    rgb(26,26,26)   k =  1,03   <- dunkle Ziffer auf dunkler Karte

   In den hellen Vorlagen zieht die Ziffer den Kartenton mit, in "konsole"
   blieb sie auf ihrem festen Dunkelwert stehen — dort ist die Karte aber
   selbst dunkel. Es ist derselbe Fall wie v1082e ("Wallet-Ringe standen
   leer"), nur in der dunklen Vorlage statt im Wallet-Modus. */
html[data-ui-theme="konsole"] body aside.sidebar .sb-card .sbc-mini-score-num {
  color: var(--uv-card-ink) !important;
}

/* v1108b · EIGENER FEHLER, zurueckgenommen: hier stand zusaetzlich
   .sbc-score-label auf var(--uv-card-ink2). Das hat es VERSCHLECHTERT —
   von k=2,03 auf 1,02. Grund: die Stufen-Pille traegt eine eigene Flaeche
   (gemessen rgba(63,165,108,.18), gemischt rgb(82,190,133) — helles
   Gruen), nicht die Kartenflaeche. Ein heller Kartenton gehoert dort
   nicht hin. Die Pille bleibt, wie sie war.

   Das Investor-Ribbon dagegen ist ein echter Fund: sein Grund ist GOLD
   (gemessen rgb(232,201,100)), und in "konsole" stand der Text darauf mit
   rgb(230,232,234) bei k=1,32. In den hellen Vorlagen ist er dunkel und
   kommt auf 11. Auf Gold gehoert ein dunkler Text, unabhaengig davon, wie
   hell die Vorlage sonst ist. */
html[data-ui-theme] body aside.sidebar .sb-card .sbc-investor-ribbon {
  color: #1a1407 !important;
}


/* ══════════════════════════════════════════════════════════════════════════
   5 · OBJEKTKARTEN-MODI — Backlog Punkt 4
   ══════════════════════════════════════════════════════════════════════════
   Ein Markup, drei Optiken, reines CSS. "standard" ist der Istzustand und
   traegt deshalb — wie "dealpilot" — KEIN Attribut.
   ------------------------------------------------------------------------ */

/* ── Kompakt · die meisten Objekte auf einen Blick ── */
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbc-thumb,
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbc-halter,
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbc-score-label { display: none !important; }
/* v1082k — hier lag der Rest: die Regel zielte auf .sbc-mini-grid, den
   BEHAELTER. Die Hoehe steckt aber in den KACHELN .sbcm (gemessen 67px von
   77px Behaelterhoehe). CLAUDE.md nennt beide getrennt; ich hatte das eine
   fuer das andere genommen. Ergebnis: "Kompakt" sparte 10px statt 40.
   Jetzt wird die Kachel selbst zur Zeile und die Verlaufsgrafik faellt weg —
   die gehoert zu "Standard", nicht zu "die meisten auf einen Blick". */
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbc-mini-grid {
  min-height: 0 !important;
  gap: 5px !important;
  padding: 5px 7px !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbcm {
  min-height: 0 !important;
  flex-direction: row !important;
  align-items: baseline !important;
  flex-wrap: nowrap !important;
  gap: 6px !important;
  padding: 4px 7px !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbcm-track,
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbcm-spark,
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbcm svg {
  display: none !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbcm-head {
  margin: 0 !important;
}

/* ── Wallet · Kopfzeile im Markenverlauf, Score-Ring links ──
   v1082g — NEU GEBAUT gegen die GEMESSENE Struktur. Der erste Anlauf war
   gegen die Mockup-Struktur gebaut und hat die halbe Karte zugedeckt.

   Was im Bild schiefging (Marcels Screenshot vom 05.08., inzwischen entfernt):
     * overflow:hidden auf der Karte schnitt das Investor-Ribbon ab — das
       sitzt gemessen bei top:-7px und ragt absichtlich hinaus.
     * Das ::before lag mit inset:0 ueber der GANZEN .sbc-top und deckte
       damit Foto, Preis und Kacheln zu.
     * Die Score-Zahl war nicht ueber der weissen Ringscheibe lesbar.

   GEMESSENE Struktur (345x211, display:flex) — sie weicht von der Vorlage
   ab, deshalb ist die Vorlage NICHT abschreibbar:
     .sb-card
       .sbc-investor-ribbon   absolut, top -7   <- ragt HINAUS
       .sbc-won-ribbon        absolut, top 1
       .sbc-score-overlay     absolut, top 14, left 259 (rechts)
       .sbc-top               relativ, 321x100
         .sbc-thumb           64x80
         .sbc-top-body        225 breit
           .sbc-top-line1  .sbc-address  .sbc-halter  .sbc-kp-row
       .sbc-mini-grid         321x75
   Im Mockup liegt .sbc-score-overlay INNERHALB .sbc-top — hier ist es ein
   direktes Kind der Karte. Genau daran waere ein Abschreiben gescheitert.

   Aufbau jetzt: .sbc-top wird ein Raster mit vier Zeilen. Das ::before
   belegt Zeile 1-2 UND die Inhalte liegen in denselben Zellen — Raster
   erlauben Ueberlappung, dafuer braucht es kein position:absolute.
   Der Ring wandert per left/right nach links auf das Band.
   ------------------------------------------------------------------ */
html[data-ui-cards="wallet"] body aside.sidebar .sb-card {
  /* KEIN overflow:hidden — das Investor-Ribbon sitzt bei top:-7px. */
  overflow: visible !important;
}
html[data-ui-cards="wallet"] body aside.sidebar .sb-card > .sbc-top {
  display: grid !important;
  /* v1173 — GEMESSEN: Spalte 1 war 64px breit, das Bild ist 64px breit und
     bekommt in Abschnitt (C) weiter unten zusaetzlich margin-left:10px —
     die Polsterung, die .sbc-top mit margin:-10px weggenommen hat. Das Bild
     ragte damit genau 10px in den Spaltenabstand hinein: gemessen Bildkante
     x88, Textkante x88, also NULL Abstand. Die Standardkarte haelt dort
     12px (Bild bis x98, Rumpf ab x110).
     Spalte 1 traegt die Polsterung jetzt selbst (10 + 64 = 74), dadurch
     wird der Spaltenabstand wieder sichtbar. */
  grid-template-columns: 74px minmax(0, 1fr) !important;
  grid-template-rows: auto auto auto auto !important;
  gap: 0 12px !important;
  padding: 0 !important;
  position: relative !important;
}
/* Das Band. align-self/justify-self:stretch sind PFLICHT — ein leeres
   ::before ohne Eigenhoehe schrumpft in einem Raster mit zentrierter
   Ausrichtung auf null, und der Verlauf waere unsichtbar (CLAUDE.md). */
html[data-ui-cards="wallet"] body aside.sidebar .sb-card > .sbc-top::before {
  content: "" !important;
  grid-row: 1 / 3 !important;
  grid-column: 1 / -1 !important;
  align-self: stretch !important;
  justify-self: stretch !important;
  background: linear-gradient(110deg, var(--wl-e8cc7a, #E8CC7A), var(--gold) 55%, var(--wl-b8932f, #b8932f)) !important;
  z-index: 0 !important;
  margin: 0 !important;
}
/* Der Rumpf loest sich auf, damit seine Kinder direkt im Raster liegen. */
html[data-ui-cards="wallet"] body aside.sidebar .sb-card > .sbc-top > .sbc-top-body {
  display: contents !important;
}
/* Zeile 1+2 = Band: Nummer/Datum oben, Adresse darunter. Sie standen frueher
   in Spalte 2 — damals sass der Score-Ring links auf dem Band (v1082j).
   v1173b: Sie spannen jetzt ueber BEIDE Spalten und halten ihren Einzug per
   padding-left selbst. Grund ist gemessen: mit Spalte 2 haengt ihre Breite an
   der Bildspalte, und der v1173-Zuwachs von 10px hat ihnen genau diese 10px
   weggenommen. Bei 390px (Messkabine, Schublade) riss die Adresse dadurch:
   scrollWidth 234 gegen clientWidth 232, also zwei Pixel Ellipse, wo vorher
   nichts fehlte. Mit 74px Einzug (10 Polsterung + 64 Bild) steht das Band
   pixelgleich wie vor v1173 und ist von der Bildspalte unabhaengig. */
html[data-ui-cards="wallet"] body aside.sidebar .sb-card .sbc-top-line1 {
  grid-row: 1 !important; grid-column: 1 / -1 !important;
  z-index: 2 !important; margin: 0 !important; padding: 8px 86px 0 74px !important;
}
html[data-ui-cards="wallet"] body aside.sidebar .sb-card .sbc-address {
  grid-row: 2 !important; grid-column: 1 / -1 !important;
  /* v1106: rechts 86px statt 9px — GEMESSEN lief die Adresse bis x=356
     und damit 67px weit unter den Score-Ring (x 277-344). Die Zeile
     DARUEBER (.sbc-top-line1) hielt mit padding-right:86px bereits genau
     diesen Abstand; nur die Adresse war ausgenommen. Es war also keine
     neue Entscheidung noetig, sondern eine Inkonsistenz in derselben
     Spalte. */
  z-index: 2 !important; margin: 0 !important; padding: 0 86px 8px 74px !important;
  color: #1a1407 !important;
}
/* Zeile 3+4 = Rumpf auf der Kartenflaeche: Foto links, Halter und Preis rechts. */
html[data-ui-cards="wallet"] body aside.sidebar .sb-card .sbc-thumb {
  grid-row: 3 / 5 !important; grid-column: 1 !important;
  z-index: 2 !important; margin: 9px 0 9px 9px !important;
  /* v1082h: ohne Deckel dehnte sich das Foto von 64 auf 130px und schob
     sich unter den Preis. Rasterzellen strecken ihren Inhalt per
     Voreinstellung (stretch) — hier ist eine feste Kachel gewollt. */
  width: 64px !important;
  height: 64px !important;
  align-self: start !important;
  justify-self: start !important;
}
html[data-ui-cards="wallet"] body aside.sidebar .sb-card .sbc-halter {
  grid-row: 3 !important; grid-column: 2 !important;
  z-index: 2 !important; margin: 9px 9px 0 0 !important; align-self: end !important;
}
html[data-ui-cards="wallet"] body aside.sidebar .sb-card .sbc-kp-row {
  grid-row: 4 !important; grid-column: 2 !important;
  /* v1173 — zwischen "privat" und dem Kaufpreis stand 1px: der Halter sitzt
     mit align-self:end am Ende von Zeile 3, der Preis mit align-self:start
     am Anfang von Zeile 4, und der Zeilenabstand des Rasters ist 0. Die
     Standardkarte haelt an derselben Stelle 4px. */
  z-index: 2 !important; margin: 5px 9px 9px 0 !important; align-self: start !important;
}
/* Der Ring wandert auf das Band nach links. Er ist ein direktes Kind der
   KARTE und absolut positioniert — deshalb hier ueber left/right, nicht
   ueber das Raster. */
html[data-ui-cards="wallet"] body aside.sidebar .sb-card > .sbc-score-overlay {
  /* v1082j: Ring links, Stufen-Pille RECHTS ans Bandende — so steht es
     auch im Mockup. Zuvor stand die Pille direkt neben dem Ring und
     ueberdeckte dort die Objektnummer (gemessen: Pille x 65-127,
     Nummer ab x 84). Das Overlay spannt deshalb ueber die volle
     Bandbreite und schiebt die beiden auseinander. */
  left: 9px !important;
  right: 9px !important;
  top: 8px !important;
  justify-content: space-between !important;
  z-index: 3 !important;
  display: flex !important;
  /* v1082i: align-items allein reichte nicht — das Overlay erbt anderswoher
     eine Spaltenrichtung, die Pille stand dadurch weiter UNTER dem Ring
     (gemessen: Ring bis y=58, Pille ab y=64). Richtung und Umbruch muessen
     ausdruecklich gesetzt werden. */
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 6px !important;
  width: auto !important;
  text-align: left !important;
}
html[data-ui-cards="wallet"] body aside.sidebar .sb-card .sbc-mini-score {
  background: #FFFFFF !important;
  border-radius: 50% !important;
  box-shadow: 0 2px 8px -3px rgba(0,0,0,.5) !important;
}
/* Die Zahl auf der weissen Scheibe — sie erbt sonst currentColor und ist im
   Dunkelmodus weiss. Haengt am KARTENMODUS, nicht an der Vorlage. */
html[data-ui-cards="wallet"] body aside.sidebar .sb-card .sbc-mini-score-num {
  color: #1e1a12 !important;
}
/* Die Stufen-Pille auf dunklem Grund, damit sie auf dem Gold nicht ausbleicht. */
html[data-ui-cards="wallet"] body aside.sidebar .sb-card .sbc-score-label {
  background: #141310 !important;
  padding: 3px 7px !important;
  border-radius: 5px !important;
  /* v1082h: .sbc-score-label ist display:block mit margin-top — dadurch
     rutschte die Pille UNTER den Ring und ueber das Foto, statt neben ihm
     auf dem Band zu stehen. */
  display: inline-block !important;
  margin: 0 !important;
  white-space: nowrap !important;
  align-self: center !important;
}
/* Nummer und Datum lagen mit ihrem Grauton fast unsichtbar auf dem Band. */
html[data-ui-cards="wallet"] body aside.sidebar .sb-card .sbc-date {
  color: #1a1407 !important; opacity: .8 !important;
}
html[data-ui-cards="wallet"] body aside.sidebar .sb-card .sbc-seq {
  background: rgba(255,255,255,.28) !important;
  border-color: transparent !important;
  color: #1a1407 !important;
}



/* ══════════════════════════════════════════════════════════════════════════
   6 · HANDY UND TABLET
   ══════════════════════════════════════════════════════════════════════════
   Die Vorlagen aendern Farbe und Form, nicht das Layout — die Arbeit aus
   v645/v648/v650/v652 bleibt unangetastet. Nur zwei Dinge muessen mit:
   der Drawer-Hintergrund und die Trefferflaeche der Vorlagenknoepfe.
   ------------------------------------------------------------------------ */
@media (max-width: 900px) {
  html[data-ui-theme] body #sb-backdrop { background: rgba(0,0,0,.5) !important; }
  html[data-ui-theme] body aside.sidebar#sidebar { box-shadow: 0 0 40px -8px rgba(0,0,0,.6) !important; }
}


/* ══════════════════════════════════════════════════════════════════════════
   7 · NACHBESSERUNG v1082b — heller Text auf hellem Grund
   ══════════════════════════════════════════════════════════════════════════
   GEMESSEN auf Staging, Kontrastlauf ueber alle Textknoten der Objektkarte
   (Vordergrund gegen die erste deckende Elternflaeche, WCAG-Relativluminanz):

     .sbc-mini-score-num   #FFFFFF auf #FFFFFF          Kontrast 1.00  UNSICHTBAR
     .sbcm-label           rgba(255,255,255,.7) auf #FAF9F7  1.05  UNSICHTBAR
     .sbcm-val             #69C291 auf #FAF9F7                2.05  zu schwach

   Ursache: die Kachel-Innereien der Objektkarte sind fuer DUNKLEN Grund
   gebaut — .sbcm-label steht fest auf Weiss, .sbcm-val erbt currentColor
   von .sbcm-good / .sbcm-bad / .sbcm-info, deren Toene aufgehellt sind.
   Abschnitt 3 hat die Kachel-FLAECHE aufgehellt, die Schrift darauf aber
   nicht — der klassische halbe Skin.

   WICHTIG zu den Statusfarben: sie werden hier NICHT tokenisiert und NICHT
   umgefaerbt. Gruen bleibt Gruen, Rot bleibt Rot, in jeder Marke gleich —
   es sind exakt die Kanonwerte #3FA56C und #B8625C aus CLAUDE.md. Getauscht
   wird nur die fuer hellen Untergrund vorgesehene Fassung gegen die fuer
   dunklen. "konsole" ist dunkel und deshalb ausgenommen.
   ------------------------------------------------------------------------ */
html[data-ui-theme="kontor"]   body aside.sidebar .sb-card .sbcm-label,
html[data-ui-theme="panel"]    body aside.sidebar .sb-card .sbcm-label,
html[data-ui-theme="kanzlei"]  body aside.sidebar .sb-card .sbcm-label,
html[data-ui-theme="boarding"] body aside.sidebar .sb-card .sbcm-label {
  color: var(--uv-card-mut) !important;
}
html[data-ui-theme="kontor"]   body aside.sidebar .sb-card .sbc-mini-score-num,
html[data-ui-theme="panel"]    body aside.sidebar .sb-card .sbc-mini-score-num,
html[data-ui-theme="kanzlei"]  body aside.sidebar .sb-card .sbc-mini-score-num,
html[data-ui-theme="boarding"] body aside.sidebar .sb-card .sbc-mini-score-num {
  color: var(--uv-card-ink) !important;
}
/* Statusfarben in der Fassung fuer hellen Grund — dieselben Farben, nur
   nicht die aufgehellte Variante. */
html[data-ui-theme="kontor"]   body aside.sidebar .sb-card .sbcm-good,
html[data-ui-theme="panel"]    body aside.sidebar .sb-card .sbcm-good,
html[data-ui-theme="kanzlei"]  body aside.sidebar .sb-card .sbcm-good,
html[data-ui-theme="boarding"] body aside.sidebar .sb-card .sbcm-good { color: #2E8455 !important; }
html[data-ui-theme="kontor"]   body aside.sidebar .sb-card .sbcm-bad,
html[data-ui-theme="panel"]    body aside.sidebar .sb-card .sbcm-bad,
html[data-ui-theme="kanzlei"]  body aside.sidebar .sb-card .sbcm-bad,
html[data-ui-theme="boarding"] body aside.sidebar .sb-card .sbcm-bad { color: #B8625C !important; }
html[data-ui-theme="kontor"]   body aside.sidebar .sb-card .sbcm-info,
html[data-ui-theme="panel"]    body aside.sidebar .sb-card .sbcm-info,
html[data-ui-theme="kanzlei"]  body aside.sidebar .sb-card .sbcm-info,
html[data-ui-theme="boarding"] body aside.sidebar .sb-card .sbcm-info { color: #2F6E9B !important; }
/* Der Score-Ring selbst: die Ringfarbe darf hell bleiben (sie liegt auf der
   Ringbahn, nicht auf der Kachel), die ZAHL darin nicht — die steht oben
   schon auf --uv-card-ink. */


/* ══════════════════════════════════════════════════════════════════════════
   8 · KOMPAKTER LOGO-KOPF — v1086
   ══════════════════════════════════════════════════════════════════════════
   Marcel, 2026-08-05: "die UI unter design/mockups UI-Ansicht soll im
   DealPilot genauso aussehen wenn man es umstellt. Auch das Logo darf klein
   werden."

   GEMESSEN, Ist gegen Soll:
     Ist (jede Vorlage):  .sb-header 379x125, Rahmen 323x83, Bild 287x53
     Soll (dp-mockup-alle-formate.html:138-145):
       .list-hd  padding 12px, border-bottom, flex  -> rund 60px
       .mk       36x36 Bildmarke
       .tx b     Wortmarke 15px
   Die Vorlage hat den Logo-Kopf bisher gar nicht angefasst — 125px in jeder
   Fassung. Das ist der auffaelligste Unterschied zum Bild.

   WAS HIER PASSIERT: Der Kopf wird flach und das Logo klein und linksbuendig,
   wie im Mockup. Der gezeichnete Goldrahmen aus v1079 faellt in den Vorlagen
   weg — er ist die Signatur der DealPilot-Fassung, und genau die soll eine
   Vorlage ja ablegen.

   WAS BEWUSST BLEIBT: "dealpilot" traegt kein Attribut, also greift hier
   nichts. Der Rahmen, die Wortmarke und die Groessenregler aus v1079/v1080
   bleiben dort unangetastet — so wie zugesagt.
   ------------------------------------------------------------------------ */
html[data-ui-theme] body:not(.dp-sidebar-collapsed) aside.sidebar#sidebar .sb-header {
  padding: 11px 13px !important;
  min-height: 0 !important;
  /* v1086b — ZUM ZWEITEN MAL derselbe Fehler, deshalb hier ausdruecklich:
     justify-content allein reichte nicht. Gemessen sass das Logo bei 119px
     statt 13 — exakt die Mitte von 353px Innenbreite bei 141px Logo. Ursache:
     die Flex-RICHTUNG war nicht gesetzt. Steht sie auf column, steuert
     justify-content die senkrechte und align-items die waagerechte Achse —
     das geerbte align-items:center hat also zentriert, waehrend mein
     justify-content:flex-start auf der anderen Achse ins Leere lief.
     Dieselbe Ursache wie bei der Wallet-Stufenpille (v1082i). Ab jetzt wird
     die Richtung mitgesetzt, wo Ausrichtung gesetzt wird. */
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  border-bottom: 1px solid var(--uv-chrome-line) !important;
}
html[data-ui-theme] body:not(.dp-sidebar-collapsed) aside.sidebar#sidebar .app-logo-simple-wrap-sidebar {
  /* Rahmen, Kasten und Radius aus v1079 zuruecknehmen — in der Vorlage
     traegt der Kopf keine Signatur mehr, nur noch die Marke. */
  /* v1101b · width war "auto". GEMESSEN: der Wrapper wurde damit exakt so
     breit wie das Bild (78 px in einem 349 px breiten Kopf) — und
     justify-content hatte keinen Platz zu verteilen. Die Ausrichtung
     setzte den richtigen Wert und bewegte trotzdem nichts. Mit voller
     Breite verteilt sie wieder; sichtbar wird nichts zusaetzlich, der
     Wrapper ist seit v1082 ohnehin transparent und rahmenlos. */
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  /* v1101: war hart flex-start und hat damit den Ausrichtungs-Regler
     stillgelegt — zum zweiten Mal derselbe Fehler nach v1080. Der Handler
     setzt --dp-logo-align auf left/center/right; die flex-taugliche
     Entsprechung liefert die Umhuellung in ui-varianten.js als
     --dp-logo-justify. Der Fallback haelt die v1082-Gestaltung, wenn nie
     etwas eingestellt wurde. */
  justify-content: var(--dp-logo-justify, flex-start) !important;
}
html[data-ui-theme] body:not(.dp-sidebar-collapsed) aside.sidebar#sidebar .app-logo-simple-sidebar {
  /* Hoehe fuehrt, Breite folgt — sonst zieht die Leistenbreite das Logo
     wieder auf, das war der v646-Befund.

     v1101 · KORREKTUR: hier stand "der Groessenregler bleibt wirksam:
     --dp-logo-w skaliert die Hoehe mit". Das war falsch. Der Regler setzt
     --dp-logo-w, eine BREITE in Prozent; gelesen wurde --dp-logo-scale,
     das niemand setzte. Gemessen: 60 % und 140 % ergaben unter einer
     Vorlage beide 130x24. Jetzt setzt die Umhuellung --dp-logo-scale als
     reine Zahl, und der Regler wirkt auf die Hoehe wie beschrieben. */
  height: calc(26px * var(--dp-logo-scale, 1)) !important;
  width: auto !important;
  max-width: min(200px, 100%) !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: left center !important;
}

/* Sehr flache Viewports: noch eine Stufe kleiner, damit der Kopf der Liste
   nicht den Platz nimmt (dieselbe Ueberlegung wie v1080). */
@media (max-width: 900px) and (max-height: 620px) {
  html[data-ui-theme] body:not(.dp-sidebar-collapsed) aside.sidebar#sidebar .sb-header {
    padding: 7px 12px !important;
  }
  html[data-ui-theme] body:not(.dp-sidebar-collapsed) aside.sidebar#sidebar .app-logo-simple-sidebar {
    height: calc(21px * var(--dp-logo-scale, 1)) !important;
  }
}

/* Der Hellmodus-Kasten aus v1079 legt in hellen Fassungen Schwarz hinter das
   Logo. Ohne Rahmen daneben saehe das aus wie ein vergessener Balken —
   deshalb hier ebenfalls zurueckgenommen. Die Wortmarke ist weiss, sie
   braucht auf hellem Grund einen dunklen Traeger: das uebernimmt in den
   hellen Vorlagen der Filter, nicht ein Kasten. */
html[data-ui-theme="kontor"]   body:not(.dp-sidebar-collapsed) aside.sidebar#sidebar .app-logo-simple-wrap-sidebar,
html[data-ui-theme="panel"]    body:not(.dp-sidebar-collapsed) aside.sidebar#sidebar .app-logo-simple-wrap-sidebar,
html[data-ui-theme="kanzlei"]  body:not(.dp-sidebar-collapsed) aside.sidebar#sidebar .app-logo-simple-wrap-sidebar,
html[data-ui-theme="boarding"] body:not(.dp-sidebar-collapsed) aside.sidebar#sidebar .app-logo-simple-wrap-sidebar {
  background: transparent !important;
}
/* Die Wortmarke traegt ihr "Deal" in Weiss. Auf hellem Grund waere die halbe
   Marke unsichtbar — invertiert bleibt sie lesbar und behaelt das Gold.
   Gemessen an der Datei: dealpilot-wortmarke.png, weisser Schriftzug plus
   goldenes "Pilot". invert(1) macht daraus dunkles "Deal" und blaues
   "Pilot" — deshalb zusaetzlich hue-rotate, das den Goldton zurueckdreht. */
html[data-ui-theme="kontor"]   body:not(.dp-sidebar-collapsed) aside.sidebar#sidebar .app-logo-simple-sidebar,
html[data-ui-theme="panel"]    body:not(.dp-sidebar-collapsed) aside.sidebar#sidebar .app-logo-simple-sidebar,
html[data-ui-theme="kanzlei"]  body:not(.dp-sidebar-collapsed) aside.sidebar#sidebar .app-logo-simple-sidebar,
html[data-ui-theme="boarding"] body:not(.dp-sidebar-collapsed) aside.sidebar#sidebar .app-logo-simple-sidebar {
  filter: invert(1) hue-rotate(180deg) !important;
}


/* ══════════════════════════════════════════════════════════════════════════
   9 · v1088 — heller Text auf hellem Grund in Leiste, Kopfzeile und Tabs
   ══════════════════════════════════════════════════════════════════════════
   Derselbe halbe Skin wie in der Objektkarte (v1082b), nur eine Etage
   hoeher. Kontrastlauf ueber #sidebar, header.hdr und nav.tabs:

     dealpilot / konsole (dunkel):  1-2 Fundstellen
     kontor / panel / kanzlei / boarding:  11-12

   Drei Klassen, alle mit derselben Ursache — die FLAECHE wurde aufgehellt,
   die Schrift darauf ist fuer dunklen Grund gebaut:

     #FFFFFF auf #FFFFFF          k=1.00   .sb-user-name .hdr-obj-name .sc-v
     rgb(232,201,100) auf Weiss   k=1.62   .hdr-obj-num .sc-tip
       (das aufgehellte Gold #E8C964)
     rgb(94,217,146) auf Weiss    k=1.78   .hdr-autosave-text .hdr-comp-text
       (aufgehelltes Gruen)                .sc-grade .sc-pill-v
                                           .tabs-status-text

   Statusfarben werden NICHT tokenisiert und NICHT umgefaerbt: Gruen bleibt
   Gruen. Getauscht wird nur die fuer hellen Untergrund vorgesehene Fassung
   gegen die fuer dunklen — genau wie in Abschnitt 7.
   "konsole" ist dunkel und deshalb ausgenommen.
   ------------------------------------------------------------------------ */

/* (a) Text, der schlicht weiss ist */
html[data-ui-theme="kontor"]   body #sidebar .sb-user-name,
html[data-ui-theme="panel"]    body #sidebar .sb-user-name,
html[data-ui-theme="kanzlei"]  body #sidebar .sb-user-name,
html[data-ui-theme="boarding"] body #sidebar .sb-user-name {
  color: var(--uv-chrome-ink) !important;
}
html[data-ui-theme="kontor"]   body header.hdr .hdr-obj-name,
html[data-ui-theme="panel"]    body header.hdr .hdr-obj-name,
html[data-ui-theme="kanzlei"]  body header.hdr .hdr-obj-name,
html[data-ui-theme="boarding"] body header.hdr .hdr-obj-name,
html[data-ui-theme="kontor"]   body header.hdr .sc-v,
html[data-ui-theme="panel"]    body header.hdr .sc-v,
html[data-ui-theme="kanzlei"]  body header.hdr .sc-v,
html[data-ui-theme="boarding"] body header.hdr .sc-v {
  color: var(--uv-chrome-ink) !important;
}

/* (b) Das aufgehellte Gold — auf Weiss praktisch unsichtbar. Der dunklere
   Ton steht in WL_TINTS und faerbt damit im Whitelabel korrekt mit. */
html[data-ui-theme="kontor"]   body header.hdr .hdr-obj-num,
html[data-ui-theme="panel"]    body header.hdr .hdr-obj-num,
html[data-ui-theme="kanzlei"]  body header.hdr .hdr-obj-num,
html[data-ui-theme="boarding"] body header.hdr .hdr-obj-num,
html[data-ui-theme="kontor"]   body header.hdr .sc-tip,
html[data-ui-theme="panel"]    body header.hdr .sc-tip,
html[data-ui-theme="kanzlei"]  body header.hdr .sc-tip,
html[data-ui-theme="boarding"] body header.hdr .sc-tip {
  color: var(--uv-marke-dd) !important;
}

/* (c) Das aufgehellte Gruen — Statusfarbe in der Fassung fuer hellen Grund */
html[data-ui-theme="kontor"]   body .hdr-autosave-text,
html[data-ui-theme="panel"]    body .hdr-autosave-text,
html[data-ui-theme="kanzlei"]  body .hdr-autosave-text,
html[data-ui-theme="boarding"] body .hdr-autosave-text,
html[data-ui-theme="kontor"]   body .hdr-comp-text,
html[data-ui-theme="panel"]    body .hdr-comp-text,
html[data-ui-theme="kanzlei"]  body .hdr-comp-text,
html[data-ui-theme="boarding"] body .hdr-comp-text,
html[data-ui-theme="kontor"]   body .tabs-status-text,
html[data-ui-theme="panel"]    body .tabs-status-text,
html[data-ui-theme="kanzlei"]  body .tabs-status-text,
html[data-ui-theme="boarding"] body .tabs-status-text,
html[data-ui-theme="kontor"]   body header.hdr .sc-grade,
html[data-ui-theme="panel"]    body header.hdr .sc-grade,
html[data-ui-theme="kanzlei"]  body header.hdr .sc-grade,
html[data-ui-theme="boarding"] body header.hdr .sc-grade,
html[data-ui-theme="kontor"]   body header.hdr .sc-pill-v,
html[data-ui-theme="panel"]    body header.hdr .sc-pill-v,
html[data-ui-theme="kanzlei"]  body header.hdr .sc-pill-v,
html[data-ui-theme="boarding"] body header.hdr .sc-pill-v {
  color: #2E8455 !important;
}
/* Rot-Stufen behalten ihre eigene Farbe — sie sind auf Weiss schon lesbar,
   werden hier aber der Vollstaendigkeit halber auf den Kanonwert gesetzt. */
html[data-ui-theme="kontor"]   body header.hdr .tier-red .sc-pill-v,
html[data-ui-theme="panel"]    body header.hdr .tier-red .sc-pill-v,
html[data-ui-theme="kanzlei"]  body header.hdr .tier-red .sc-pill-v,
html[data-ui-theme="boarding"] body header.hdr .tier-red .sc-pill-v {
  color: #B8625C !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v1089 — die beiden letzten weissen Kopfzeilen-Elemente

   BEFUND (statisch gemessen, nicht geraten). Meine v1088-Diagnose war am
   FALSCHEN GEGNER gemessen und wird hiermit zurueckgenommen: ich hatte
   .hdr-v61-row1 .hdr-obj-name (0,2,0) als konkurrierende Regel geprueft.
   Die Regel, die wirklich gewinnt, steht in style.css:24136/24145/24064
   und selektiert ueber die ID:

     header.hdr.has-v64-score #hdr-obj      -> (1,2,1)  color:var(--dp-ink-1)
     header.hdr.has-v64-score #hdr-obj-num  -> (1,2,1)  color:var(--gold-2,#E8C964)
     header.hdr.has-v64-score .hdr-sep      -> (0,3,1)  color:var(--dp-ink-1)

   index.html:807/813 traegt an denselben Elementen BEIDES:
     <span class="hdr-obj-num" id="hdr-obj-num">
     <div  class="hdr-obj-name" id="hdr-obj">

   Meine v1088-Selektoren waren rein klassenbasiert (0,3,3) und verlieren
   damit gegen jede ID — !important auf beiden Seiten, also entscheidet
   die Spezifitaet. Deshalb loeste --uv-chrome-ink am Element korrekt auf
   und blieb trotzdem wirkungslos: die Deklaration kam nie zum Zug.

   FIX: dieselben Farben ueber Selektoren mit ID, (1,2,3) schlaegt (1,2,1).
   "konsole" und "dealpilot" sind dunkel und bleiben ausgenommen.
   ═══════════════════════════════════════════════════════════════════════ */

/* (a) Objektname — weiss auf weiss, Kontrast 1,00 */
html[data-ui-theme="kontor"]   body header.hdr #hdr-obj,
html[data-ui-theme="panel"]    body header.hdr #hdr-obj,
html[data-ui-theme="kanzlei"]  body header.hdr #hdr-obj,
html[data-ui-theme="boarding"] body header.hdr #hdr-obj {
  color: var(--uv-chrome-ink) !important;
}

/* (b) Objektnummer — aufgehelltes Gold #E8C964, Kontrast 1,62.
   var(--wl-9a7f33) steht in WL_TINTS und faerbt im Whitelabel mit. */
html[data-ui-theme="kontor"]   body header.hdr #hdr-obj-num,
html[data-ui-theme="panel"]    body header.hdr #hdr-obj-num,
html[data-ui-theme="kanzlei"]  body header.hdr #hdr-obj-num,
html[data-ui-theme="boarding"] body header.hdr #hdr-obj-num {
  color: var(--uv-marke-dd) !important;
}

/* (c) Der Trenner zwischen beiden haengt an derselben Ursache
   (style.css:24065, var(--dp-ink-1)) und war in v1088 gar nicht erfasst. */
html[data-ui-theme="kontor"]   body header.hdr .hdr-sep,
html[data-ui-theme="panel"]    body header.hdr .hdr-sep,
html[data-ui-theme="kanzlei"]  body header.hdr .hdr-sep,
html[data-ui-theme="boarding"] body header.hdr .hdr-sep {
  color: var(--uv-chrome-ink2) !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v1090 — die letzten zwei Goldflaechen, im Prüf-Browser nachgemessen

   Kontrastlauf ueber #sidebar, header.hdr, nav.tabs bei 1920 (k < 2):

     dealpilot / konsole (Referenz, dunkel):  2 Fundstellen
     kontor / panel / kanzlei / boarding:     2 Fundstellen  <- mit v1089
                                              (vor v1089: 4)

   Beide Reste sind derselbe Fall wie die Objektnummer in v1089:
   aufgehelltes Gold #E8C964, gebaut fuer dunklen Grund.

     #hdr-credits-pill-label  k=1,49-1,62   erbt von .hdr-credits-pill
       Gegner: header.hdr.has-v64-score .hdr-credits-pill  (0,3,1) !
     .sb-actions-arrow        k=1,49-1,62   eigene Regel
       Gegner: aside.sidebar .sb-actions-trigger .sb-actions-arrow (0,3,1) !

   Beide Ziele tragen KEINE ID, hier reicht Klassen-Spezifitaet — anders
   als in v1089. Nachgeprueft statt angenommen: der Kaskaden-Walker liest
   alle Stylesheets rekursiv, matcht je Teilselektor und sortiert nach
   !important, dann Spezifitaet, dann Reihenfolge.
   ═══════════════════════════════════════════════════════════════════════ */

/* (a) Kerosin-Pille in der Kopfzeile — (0,3,3) schlaegt (0,3,1) */
html[data-ui-theme="kontor"]   body header.hdr .hdr-credits-pill,
html[data-ui-theme="panel"]    body header.hdr .hdr-credits-pill,
html[data-ui-theme="kanzlei"]  body header.hdr .hdr-credits-pill,
html[data-ui-theme="boarding"] body header.hdr .hdr-credits-pill {
  color: var(--uv-marke-dd) !important;
}

/* (b) Pfeil am Aktionen-Aufklapper — (0,4,4) schlaegt (0,3,1) */
html[data-ui-theme="kontor"]   body aside.sidebar .sb-actions-trigger .sb-actions-arrow,
html[data-ui-theme="panel"]    body aside.sidebar .sb-actions-trigger .sb-actions-arrow,
html[data-ui-theme="kanzlei"]  body aside.sidebar .sb-actions-trigger .sb-actions-arrow,
html[data-ui-theme="boarding"] body aside.sidebar .sb-actions-trigger .sb-actions-arrow {
  color: var(--uv-marke-dd) !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v1091 — vier Befunde aus den Screenshots vom 06.08., alle nachgemessen
   Zustand: Kontor + Objektkarten "Wallet" + Kartenflaeche "Weiss",
   Objekt geladen (header.hdr.has-v64-score), 1920 breit.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── (A) Der schwarze Kopf ueber dem Investor Deal Score ──────────────────
   URSACHE: v927-headerblack, style.css:35410-35416. Der ALTE helle Skin
   body.dp-chrome-hell setzt --dp-header-bg:#0a0a0a (style.css:35377) und
   faerbt damit Kopf, beide Reihen und #hdr-badges schwarz:

     body.dp-chrome-hell header.hdr.has-v64-score   (0,3,2) !
     body.dp-chrome-hell #hdr-badges                (1,1,1) !

   Meine Vorlagen-Regel html[data-ui-theme] body header.hdr steht bei
   (0,2,3) und verliert gegen beide. v1085 hat den Skin-Schalter an die
   Darstellung gekoppelt — seitdem trifft das jeden, der eine helle Vorlage
   waehlt. Gemessen mit gesetztem body.dp-chrome-hell: header.hdr,
   #hdr-badges und .hdr-v61-row2 stehen auf rgb(10,10,10), alles andere
   (Tabs, Leiste, Pillen, Karten) ist weiss — genau Marcels Bild.

   Die Vorlage ist die spaetere und ausdrueckliche Wahl, sie gewinnt. Der
   Hell-Skin OHNE Vorlage behaelt seinen schwarzen Kopf: alle Regeln hier
   haengen an html[data-ui-theme]. */
html[data-ui-theme] body.dp-chrome-hell header.hdr,
html[data-ui-theme] body.dp-chrome-hell header.hdr.has-v64-score,
html[data-ui-theme] body.dp-chrome-hell .hdr-v61-row1,
html[data-ui-theme] body.dp-chrome-hell .hdr-v61-row2,
html[data-ui-theme] body.dp-chrome-hell #hdr-badges {
  background: var(--uv-chrome) !important;
}
/* Der Hell-Skin setzt --dp-header-text auf Creme (#f3ead0) — auf dem jetzt
   hellen Kopf waere das wieder hell auf hell. */
html[data-ui-theme] body.dp-chrome-hell header.hdr {
  --dp-header-text: var(--uv-chrome-ink);
  color: var(--uv-chrome-ink) !important;
}
/* Logo-Kasten und Leisten-Kopf haengen an derselben Variablen
   (style.css:35331 / 35431) und wuerden sonst als schwarze Bloecke
   stehenbleiben. */
html[data-ui-theme] body.dp-chrome-hell .sb-header,
html[data-ui-theme] body.dp-chrome-hell .app-logo-simple-wrap {
  background: var(--uv-chrome) !important;
  border-color: var(--uv-chrome-line) !important;
}

/* ── (B) Objektkarten ohne Umrahmung ─────────────────────────────────────
   URSACHE: meine eigene v1082-Regel weiter oben ("Kontor: Karten ohne
   Seitenrahmen, nur Trennlinie — die Liste wird ruhiger"). Gemessen:
     dealpilot  border 2px, radius 11px, Schatten ja
     kontor     border 0px, radius  0px, Schatten nein
   Marcel will den Rahmen. Damit faellt die Gestaltungsentscheidung von
   v1082 — die Karte bekommt die Haarlinie und den Radius aus den Tokens
   (--uv-card-line #E7E4DD, --uv-r 3px), die die Basisregel ohnehin setzt. */
html[data-ui-theme="kontor"] body aside.sidebar .sb-card {
  border: 1px solid var(--uv-card-line) !important;
  border-radius: var(--uv-r) !important;
}

/* ── (C) Das Gold laeuft nicht bis zum Kartenrand ────────────────────────
   GEMESSEN im Wallet-Modus: .sb-card 345 px breit, .sbc-top 325 px und
   14 px unter der Kartenoberkante. Das Band ist das ::before von .sbc-top
   und damit ebenfalls 325 px — es fehlen links und rechts je 10 px und
   oben 14 px. Grund ist die Polsterung der Karte (padding 14px 10px 10px),
   in der .sbc-top sitzt.

   Das Band wird durch negative Aussenabstaende in genau dieser Groesse an
   die Kartenkante gezogen. KEIN overflow:hidden auf der Karte — das
   Investor-Ribbon sitzt bei top:-7px und wuerde abgeschnitten. Die Ecken
   bekommt deshalb das Band selbst. */
html[data-ui-cards="wallet"] body aside.sidebar .sb-card > .sbc-top {
  margin: -14px -10px 0 -10px !important;
}
html[data-ui-cards="wallet"] body aside.sidebar .sb-card > .sbc-top::before {
  border-radius: var(--uv-r, 11px) var(--uv-r, 11px) 0 0 !important;
}
/* Der Rumpf unter dem Band braucht die weggenommene Polsterung zurueck,
   sonst kleben Foto und Preis an der Kartenkante. */
html[data-ui-cards="wallet"] body aside.sidebar .sb-card .sbc-thumb {
  margin-left: 10px !important;
}
html[data-ui-cards="wallet"] body aside.sidebar .sb-card .sbc-kp-row {
  padding-right: 10px !important;
}

/* ── (D) Der Score-Ring sprang nach oben links ───────────────────────────
   GEMESSEN: .sbc-score-overlay ist ein direktes Kind der Karte und
   absolut positioniert.
     Standard  left auto / right 12px / top 12px  -> Ring x 284, RECHTS
     Wallet    left 9px  / right  9px / top  8px  -> Ring x  21, LINKS
   v1082j hatte ihn bewusst nach links auf das Band geschoben. Marcel will
   ihn dort, wo er vorher war. Damit wird v1082j zurueckgenommen: dieselbe
   Lage wie im Standard, der Ring liegt dann rechts auf dem Band. */
/* v1192: top 12 -> 34. Der Ring lag bei y14..54, die Aktionsknoepfe bei
   y8..34 — die obere Ringhaelfte (20 von 40 px) gehoerte dem Loeschknopf.
   Das ist der Befund aus Punkt 10 des Backlogs; `v1191` hat ihn halbiert
   (die Knoepfe stehen nicht mehr auf 44 px), die obere Haelfte blieb.
   Mit top:34 beginnt der Ring bei y36, direkt unter dem Band der
   Aktionen: 40 von 40 px frei, Ringmitte -> `sbc-mini-score-num`.
   Die Stufen-Pille wandert von y63..85 auf y85..107 und bleibt in der
   255-px-Karte.

   WARUM HIER NACH UNTEN UND IN "kompakt" NACH LINKS: nach links geht es
   hier nicht. Der Ring muesste auf right:68 und laege dann bei l203..243
   — das Datum in der Kopfzeile endet bei 214. Die Zeile hat
   flex-wrap:wrap, das Datum wuerde also umbrechen und die Karte hoeher
   machen. Nach unten ist in der 255-px-Karte Platz; in der 80-px-Karte
   von "kompakt" ist er nicht. */
html[data-ui-cards="wallet"] body aside.sidebar .sb-card > .sbc-score-overlay {
  left: auto !important;
  right: 12px !important;
  top: 34px !important;
  display: block !important;
  width: auto !important;
  text-align: center !important;
}
/* Die Stufen-Pille steht damit wieder UNTER dem Ring statt neben ihm.
   v1091b — GEMESSEN nach dem ersten Anlauf: mit display:inline-block (aus
   dem Wallet-Block von v1082h) flossen Ring und Pille in EINE Zeile,
   Ring x 226-276, Pille x 276-343. Im Standard ist die Pille display:block
   und stapelt sich dadurch unter den Ring. */
html[data-ui-cards="wallet"] body aside.sidebar .sb-card .sbc-score-label {
  display: block !important;
  margin: 4px auto 0 !important;
  width: -moz-fit-content !important;
  width: fit-content !important;
}
/* Nummer, Datum und Adresse muessen dem Ring rechts ausweichen — er steht
   jetzt dort, wo vorher die Pille stand. */
html[data-ui-cards="wallet"] body aside.sidebar .sb-card .sbc-address {
  padding: 0 86px 8px 0 !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v1092 — Kompakt wird eine schmale Zeile zum Aufklappen

   VORLAGE: Marcels zwei Bilder vom 06.08., aufgeklappt und zu (Dateien
   inzwischen entfernt, Befund im BACKLOG unter Fertig).
   Das ist die Karte aus dem Portfolio-Cockpit (js/dashboard.js:836,
   kanbanCardHtml). Uebernommen wird die Gestaltung, nicht der Code — die
   Leistenkarte hat eine andere Struktur (CLAUDE.md, storage.js:866).

   GEMESSEN (Abgleich Standard gegen Kompakt, 06.08.): Kompakt blendete
   gegenueber Standard GENAU DREI Dinge aus — .sbc-thumb, .sbc-halter und
   .sbc-score-label. Alles andere war identisch. Das war Marcels Frage
   "was fehlt uns gegenueber der Standardansicht": nur diese drei.
   Jetzt kommen Foto und Halter im aufgeklappten Rumpf zurueck, die Stufe
   steht wie in der Vorlage dauerhaft unter dem Ring.

   Das Umschalten macht js/karten-kompakt.js ueber die Klasse .uv-open.
   Ohne die Datei bleibt die Karte zu — sie ist dann wieder das, was
   "Kompakt" vorher war, nur ohne KPI-Kacheln.
   ═══════════════════════════════════════════════════════════════════════ */

/* Die Stufe gehoert jetzt DAZU — v1082 hatte sie ausgeblendet. */
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbc-score-label {
  display: inline-block !important;
}

/* ── Zugeklappt: nur Adresse, Nummer, Ring, Stufe, Chevron ── */
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card:not(.uv-open) .sbc-thumb,
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card:not(.uv-open) .sbc-halter,
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card:not(.uv-open) .sbc-kp-row,
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card:not(.uv-open) .sbc-mini-grid {
  display: none !important;
}
/* Aufgeklappt kommt alles zurueck — auch Foto und Halter, die im alten
   Kompakt dauerhaft weg waren. */
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card.uv-open .sbc-thumb {
  display: block !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card.uv-open .sbc-halter {
  display: block !important;
}

/* Die Karte wird flach: die Polsterung traegt sonst die halbe Hoehe. */
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card {
  padding: 8px 10px !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card.uv-open {
  padding: 8px 10px 10px !important;
}

/* ── Der Chevron ──
   Die Karte bringt bereits <span class="sbc-arrow">›</span> mit
   (storage.js:1044). Kein neues Element: der Renderer wuerde es beim
   naechsten Zeichnen wegwerfen. Das ">" wird per Drehung zum "v". */
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbc-arrow {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 22px !important;
  height: 22px !important;
  margin-left: auto !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  transform: rotate(90deg);
  transition: transform .18s ease, background-color .18s ease;
  color: var(--uv-card-mut, #8f897c) !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbc-arrow:hover,
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbc-arrow:focus-visible {
  background: color-mix(in srgb, var(--wl-c9a84c, #C9A84C) 14%, transparent) !important;
  color: var(--uv-card-ink, #1a1712) !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card.uv-open .sbc-arrow {
  transform: rotate(-90deg);
}

/* ── Kopfzeile der schmalen Karte ──
   Adresse fuehrt, Nummer und Datum darunter klein — wie in der Vorlage.
   Der Ring sitzt rechts, die Stufe darunter. */
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbc-address {
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  /* v1192: 84 -> 94. Der Ring steht ab jetzt bei right:68px, also ab
     Pixel 204 der Karte. Mit 84 endete der Adresstext bei 206 und lief
     unter den Ring; 94 laesst 8 px Luft. Gemessen mit einer bewusst zu
     langen Adresse (Friedrich-Wilhelm-Strasse 128a, 33602 Bielefeld-
     Mitte): der Randpunkt trifft danach .sbc-address, nicht mehr das
     Ring-SVG. Mehr als 94 kostet nur Text und bringt nichts. */
  padding-right: 94px !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbc-top-line1 {
  gap: 6px !important;
  padding-right: 84px !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card > .sbc-score-overlay {
  left: auto !important;
  right: 10px !important;
  top: 8px !important;
  display: block !important;
  width: auto !important;
  text-align: center !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbc-mini-score {
  width: 38px !important;
  height: 38px !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbc-score-label {
  display: block !important;
  margin: 3px auto 0 !important;
  width: -moz-fit-content !important;
  width: fit-content !important;
  font-size: 8.5px !important;
  padding: 2px 6px !important;
}

/* Der aufgeklappte Rumpf setzt sich als eigene Flaeche ab — in der Vorlage
   ist er dunkel. Hier folgt er der Vorlagenfarbe, damit Kontor nicht
   ploetzlich einen schwarzen Block in der weissen Leiste hat. */
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card.uv-open .sbc-mini-grid {
  margin-top: 8px !important;
  border-top: 1px solid var(--uv-card-tl, #E9E4D9) !important;
  padding-top: 8px !important;
}

/* v1092c — GEMESSEN im Bild: im aufgeklappten Rumpf brachen die KPI-Werte
   um ("+4.037 €" und "8,00 %" jeweils auf zwei Zeilen). Ursache ist die
   Zeilenform aus v1082k (.sbcm als row mit Label und Wert nebeneinander)
   bei drei Kacheln auf 325 px. Der Wert darf nicht umbrechen, das Label
   darf schrumpfen. */
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card.uv-open .sbc-mini-grid {
  gap: 4px !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbcm {
  min-width: 0 !important;
  overflow: hidden !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbcm-head,
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbcm-label {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbcm-val,
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbcm-v {
  flex: 0 0 auto !important;
  white-space: nowrap !important;
  font-size: 11.5px !important;
}

/* v1092d — MEINE v1092c-KORREKTUR WAR FALSCH und wird zurueckgenommen.
   nowrap auf dem Wert plus ellipsis auf dem Label hat den Umbruch zwar
   beseitigt, dafuer die Beschriftungen auf ein Zeichen zusammengedrueckt
   ("[", "C...") — gemessen 100 px Kachelbreite fuer Label, Wert und Skala
   in EINER Zeile. Das ist zu wenig.

   Richtig ist: die Zeilenform aus v1082k war eine Sparmassnahme fuer die
   DAUERHAFT sichtbare Kachelreihe. Seit v1092 stehen die Kacheln nur noch
   im aufgeklappten Rumpf — dort ist Platz fuer die normale, gestapelte
   Kachel wie im Standard. */
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card.uv-open .sbcm {
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 2px !important;
  padding: 6px 8px !important;
  overflow: visible !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card.uv-open .sbcm-head,
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card.uv-open .sbcm-label {
  flex: 0 0 auto !important;
  overflow: visible !important;
  text-overflow: clip !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card.uv-open .sbcm-track {
  display: block !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v1093 — die Vorlage darf die Marke nicht totsetzen

   GEMESSEN mit Partner-Konto und Marken-Akzent #7B2D3B (Kanzlei-Rot):

     ohne Vorlage   .sbc-seq -> rgb(134,62,75)   Marke kommt durch
     mit "kontor"   .sbc-seq -> rgb(78,73,64)    neutrales Grau

   Der Akzent steht korrekt in den Tokens (--gold und --wl-c9a84c waren
   beide #7B2D3B) — meine eigenen v1082-Regeln haben ihn danach mit
   neutralen --uv-*-Tokens ueberschrieben. Ueber #sidebar, header.hdr und
   nav.tabs verlieren so 33 Stellen die Markenfarbe, die groessten Gruppen
   sind die Tabs (8) und die Objektnummer (5).

   ZURUECKGENOMMEN: ich hatte zwischendurch var(--uv-marke-dd) aus
   v1089/v1090 als "fest verdrahtetes Dunkelgold" verdaechtigt. Falsch —
   das Token faerbt mit (unter Rot gemessen: #451b23). Das Literal ist nur
   der Rueckfallwert ohne Whitelabel.

   REGEL AB HIER: die Vorlage bestimmt Flaeche und Neutraltoene, die Marke
   bestimmt den Akzent. Wo ein Element vorher Gold trug, traegt es jetzt
   den Akzent — in der fuer den Untergrund passenden Helligkeit:
   --gold-d auf hellen Vorlagen, --gold-2 auf den dunklen.
   ═══════════════════════════════════════════════════════════════════════ */

/* Objektnummer auf der Karte — trug Gold, nicht Grau. */
html[data-ui-theme="kontor"]   body aside.sidebar .sb-card .sbc-seq,
html[data-ui-theme="panel"]    body aside.sidebar .sb-card .sbc-seq,
html[data-ui-theme="kanzlei"]  body aside.sidebar .sb-card .sbc-seq,
html[data-ui-theme="boarding"] body aside.sidebar .sb-card .sbc-seq {
  color: var(--uv-marke-d) !important;
}
html[data-ui-theme="konsole"] body aside.sidebar .sb-card .sbc-seq {
  color: var(--gold-2, #E8C964) !important;
}

/* Aktiver Tab — der Akzent ist das, was den aktiven Reiter ausmacht. */
html[data-ui-theme="kontor"]   body nav.tabs .tab.active,
html[data-ui-theme="panel"]    body nav.tabs .tab.active,
html[data-ui-theme="kanzlei"]  body nav.tabs .tab.active,
html[data-ui-theme="boarding"] body nav.tabs .tab.active,
html[data-ui-theme="kontor"]   body header.hdr.has-v64-score + nav.tabs .tab.active,
html[data-ui-theme="panel"]    body header.hdr.has-v64-score + nav.tabs .tab.active,
html[data-ui-theme="kanzlei"]  body header.hdr.has-v64-score + nav.tabs .tab.active,
html[data-ui-theme="boarding"] body header.hdr.has-v64-score + nav.tabs .tab.active {
  color: var(--uv-marke-d) !important;
  border-bottom-color: var(--gold, #C9A84C) !important;
}
html[data-ui-theme="konsole"] body nav.tabs .tab.active,
html[data-ui-theme="konsole"] body header.hdr.has-v64-score + nav.tabs .tab.active {
  color: var(--gold-2, #E8C964) !important;
  border-bottom-color: var(--gold, #C9A84C) !important;
}

/* Abschnittsueberschrift und Statuszeile trugen ebenfalls den Akzent. */
html[data-ui-theme="kontor"]   body aside.sidebar .sb-section-title,
html[data-ui-theme="panel"]    body aside.sidebar .sb-section-title,
html[data-ui-theme="kanzlei"]  body aside.sidebar .sb-section-title,
html[data-ui-theme="boarding"] body aside.sidebar .sb-section-title {
  color: var(--uv-marke-d) !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v1094 — die zugeklappte Kompakt-Zeile nach der Vorlage
   Marcels Bild der zugeklappten Zeile (inzwischen entfernt):
   Adresse fett zuerst, darunter klein
   "Ort · Nummer", rechts der Ring, ganz rechts der Chevron.
   Bisher stand die Nummernpille UEBER der Adresse — das ist die
   Reihenfolge aus dem Renderer (.sbc-top-line1 vor .sbc-address,
   storage.js:1038-1045). Umgestellt wird per order, nicht im Markup.
   ═══════════════════════════════════════════════════════════════════════ */
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card > .sbc-top > .sbc-top-body {
  display: flex !important;
  flex-direction: column !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbc-address {
  order: 1 !important;
  margin: 0 0 1px !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbc-top-line1 {
  order: 2 !important;
  font-size: 9.5px !important;
  opacity: .85 !important;
  flex-wrap: nowrap !important;
}
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbc-kp-row { order: 3 !important; }
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbc-halter  { order: 4 !important; }

/* Ring nach links ruecken, damit der Chevron rechts daneben Platz hat.

   v1192: 34 -> 68. Der Chevron war nicht das einzige, was dort Platz
   braucht — die AKTIONSKNOEPFE stehen bei right:6px und sind 56 px breit,
   sie belegen also die rechten 62 px. Mit right:34 lag der Ring bei
   204..242 gemessen von rechts: 36..74 — mitten im Aktionsband. Gemessen
   am 01.09. bei 390 px: die Ringmitte lieferte `sbc-btn`, wer den Score
   antippte, DUPLIZIERTE das Objekt. Auf dem Bild klebte das Kopiersymbol
   sichtbar auf dem Ring.
   Mit right:68 steht der Ring bei l204..242, das Band beginnt bei 248 —
   6 px Luft. Ringmitte -> `sbc-mini-score-num`, 38 von 38 px frei.
   Die Stufen-Pille haengt am selben Overlay und wandert mit (l208..237,
   y57..75) — sie bleibt in der 80-px-Karte.

   NICHT nach unten geschoben, obwohl das die Adresse nicht gekostet
   haette: gemessen mit top:34 steht der Ring zwar frei, aber die
   Stufen-Pille rutscht dann auf y79..101 und TRITT AUS DER KARTE HERAUS
   (Karte 80 px). Im Wallet-Modus ist die Karte 255 px hoch, dort ist
   genau dieser Weg richtig — deshalb loesen die beiden Modi es
   verschieden. */
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card > .sbc-score-overlay {
  right: 68px !important;
}
/* Der Chevron verlaesst die Textzeile und steht rechts aussen, senkrecht
   mittig — die Karte ist position:relative (das Score-Overlay haengt
   bereits daran). */
/* v1191: top 22 -> 26. Gemessen am 01.09. bei 390 px, Objekt "Am Markt 9":
   die Aktionsknoepfe stehen 8..34 px unter der Kartenoberkante, der Pfeil
   lag bei 32..54 — die obersten 2 px gingen an den Loeschknopf. Mit 26 px
   beginnt er bei 36 und ist auf voller Hoehe erreichbar (22 von 22 px,
   elementFromPoint jeden Pixel). Die Karte ist zugeklappt 82 px hoch, der
   Pfeil endet bei 58 — er bleibt drin. */
html[data-ui-cards="kompakt"] body aside.sidebar .sb-card .sbc-arrow {
  position: absolute !important;
  right: 6px !important;
  top: 26px !important;
  margin-left: 0 !important;
  z-index: 4 !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v1095 — Kartenmodus "Stapel" (Handy-Optik)

   VORLAGE: design/mockups/handy2.jpg — Auszug aus der Mobile-Fassung.
   Zugeklappt eine goldene Zeile: Score-Ring LINKS auf dem Verlauf,
   Adresse daneben, Stufen-Abzeichen rechts. Aufgeklappt Foto, Preis und
   die KPI-Kacheln.

   Aufgeklappt wird ueber dieselbe Mechanik wie "kompakt"
   (js/karten-kompakt.js, Klasse .uv-open) — andere Optik, gleiche
   Bedienung. In der Vorlage ist der Rumpf dunkel; hier folgt er der
   Vorlagenfarbe, damit Kontor keinen schwarzen Block bekommt. Die
   goldene Zeile bleibt in JEDER Vorlage gold — sie ist das Kennzeichen
   dieses Modus, hell wie dunkel.
   ═══════════════════════════════════════════════════════════════════════ */

/* Zugeklappt: nur die Zeile. */
html[data-ui-cards="stapel"] body aside.sidebar .sb-card:not(.uv-open) .sbc-thumb,
html[data-ui-cards="stapel"] body aside.sidebar .sb-card:not(.uv-open) .sbc-halter,
html[data-ui-cards="stapel"] body aside.sidebar .sb-card:not(.uv-open) .sbc-kp-row,
html[data-ui-cards="stapel"] body aside.sidebar .sb-card:not(.uv-open) .sbc-mini-grid {
  display: none !important;
}
html[data-ui-cards="stapel"] body aside.sidebar .sb-card.uv-open .sbc-thumb,
html[data-ui-cards="stapel"] body aside.sidebar .sb-card.uv-open .sbc-halter {
  display: block !important;
}

/* Die Karte selbst: flach, keine eigene Polsterung oben — die Zeile
   traegt den Verlauf bis an die Kante (derselbe Griff wie in v1091 C). */
html[data-ui-cards="stapel"] body aside.sidebar .sb-card {
  padding: 0 !important;
  overflow: visible !important;
}
html[data-ui-cards="stapel"] body aside.sidebar .sb-card > .sbc-top {
  display: grid !important;
  grid-template-columns: 56px minmax(0, 1fr) !important;
  grid-template-rows: auto auto auto !important;
  gap: 0 10px !important;
  padding: 0 !important;
  margin: 0 !important;
  position: relative !important;
}
/* Das Goldband unter Zeile 1. align-self/justify-self:stretch sind
   Pflicht — ein leeres ::before ohne Eigenhoehe schrumpft im Raster auf
   null und der Verlauf waere unsichtbar (CLAUDE.md). */
html[data-ui-cards="stapel"] body aside.sidebar .sb-card > .sbc-top::before {
  content: "" !important;
  grid-row: 1 !important;
  grid-column: 1 / -1 !important;
  align-self: stretch !important;
  justify-self: stretch !important;
  background: linear-gradient(110deg, var(--wl-e8cc7a, #E8CC7A), var(--gold) 55%, var(--wl-b8932f, #b8932f)) !important;
  border-radius: var(--uv-r, 11px) var(--uv-r, 11px) 0 0 !important;
  z-index: 0 !important;
}
html[data-ui-cards="stapel"] body aside.sidebar .sb-card:not(.uv-open) > .sbc-top::before {
  border-radius: var(--uv-r, 11px) !important;
}
html[data-ui-cards="stapel"] body aside.sidebar .sb-card > .sbc-top > .sbc-top-body {
  display: contents !important;
}

/* Adresse fuehrt, Nummer und Datum klein darunter — beide in Zeile 1,
   damit sie auf dem Band liegen. */
html[data-ui-cards="stapel"] body aside.sidebar .sb-card .sbc-address {
  grid-row: 1 !important; grid-column: 2 !important;
  z-index: 2 !important;
  margin: 0 !important;
  padding: 9px 74px 0 0 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #1a1407 !important;
}
html[data-ui-cards="stapel"] body aside.sidebar .sb-card .sbc-top-line1 {
  grid-row: 1 !important; grid-column: 2 !important;
  z-index: 2 !important;
  margin: 0 !important;
  padding: 30px 74px 9px 0 !important;
  font-size: 9.5px !important;
  align-self: end !important;
  flex-wrap: nowrap !important;
}
html[data-ui-cards="stapel"] body aside.sidebar .sb-card .sbc-seq {
  background: rgba(255,255,255,.30) !important;
  border-color: transparent !important;
  color: #1a1407 !important;
}
html[data-ui-cards="stapel"] body aside.sidebar .sb-card .sbc-date {
  color: #1a1407 !important; opacity: .78 !important;
}

/* Der Ring LINKS auf dem Band — das ist der Unterschied zu "kompakt". */
html[data-ui-cards="stapel"] body aside.sidebar .sb-card > .sbc-score-overlay {
  left: 8px !important;
  right: auto !important;
  top: 9px !important;
  display: block !important;
  width: auto !important;
  text-align: center !important;
  z-index: 3 !important;
}
html[data-ui-cards="stapel"] body aside.sidebar .sb-card .sbc-mini-score {
  width: 40px !important;
  height: 40px !important;
  background: #FFFFFF !important;
  border-radius: 50% !important;
  box-shadow: 0 2px 8px -3px rgba(0,0,0,.5) !important;
}
html[data-ui-cards="stapel"] body aside.sidebar .sb-card .sbc-mini-score-num {
  color: #1e1a12 !important;
}

/* Das Stufen-Abzeichen rechts auf dem Band (STARK / SOLIDE / SCHWACH). */
html[data-ui-cards="stapel"] body aside.sidebar .sb-card .sbc-score-label {
  display: inline-block !important;
  position: absolute !important;
  right: 30px !important;
  top: 18px !important;
  margin: 0 !important;
  z-index: 3 !important;
  background: #141310 !important;
  color: var(--wl-e8cc7a, #E8CC7A) !important;
  padding: 3px 7px !important;
  border-radius: 5px !important;
  font-size: 8.5px !important;
  white-space: nowrap !important;
}

/* Chevron rechts aussen — v1159: UNTEN, nicht auf der Bandmitte.
   ────────────────────────────────────────────────────────────────
   Marcels Befund: „Beim Hinueberfahren zum Pfeil landet man auf dem × zum
   Loeschen." Der schwerste der Kartenbefunde, weil er eine FALSCHE Aktion
   ausloest statt nur schlecht auszusehen.

   Gemessen am 13.08. mit getBoundingClientRect und elementFromPoint:
     .sbc-actions (Duplizieren + Loeschen)  absolute, top 6px, 48x22
     .sbc-arrow                             absolute, top 16px, 20x20
   Beide bei right:6px — Ueberlappung 12 px von 20 px Pfeilhoehe.
   Und der Klick: **die MITTE des Pfeils (349,203) traf `sbc-btn
   "Loeschen"`**, nicht den Pfeil. Erreichbar war er nur ueber sein unteres
   Drittel. Wer auf die Pfeilmitte zielt, loescht das Objekt.

   Die Pfeilspalte von oben nach unten (elementFromPoint alle 4 px):
     8–28 px   Loeschen-×      (reicht weiter als seine 22 px Hoehe)
     32–36 px  Pfeil           (nur ~8 px wirklich erreichbar)
     40–60 px  frei
   Marcels Satz „unten ist Platz, oben nicht" ist damit belegt.

   Deshalb `bottom` statt `top`. Neue Lage: 212–234 statt 193–213, also
   5 px Abstand zum ×, das bei 207 endet. Groesse 20 → 22 px, dieselbe wie
   der Kompakt-Pfeil (Z. 1388) — eine Groesse fuer denselben Pfeil.

   **44 px sind hier NICHT erreichbar, und das ist eine Absage mit Grund:**
   die Karte ist 63 px hoch und traegt oben die Aktionen. Ein 44-px-Pfeil
   reichte bis 194 und liege wieder unter dem ×. Der Punkt aus v650/v652
   bleibt damit offen — aber die falsche Aktion ist weg, und das war das
   Schwere daran. */
html[data-ui-cards="stapel"] body aside.sidebar .sb-card .sbc-arrow {
  position: absolute !important;
  right: 6px !important;
  top: auto !important;
  bottom: 4px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 22px !important; height: 22px !important;
  margin: 0 !important;
  cursor: pointer !important;
  color: #1a1407 !important;
  transform: rotate(90deg);
  transition: transform .18s ease;
  z-index: 4 !important;
}
html[data-ui-cards="stapel"] body aside.sidebar .sb-card.uv-open .sbc-arrow {
  transform: rotate(-90deg);
}

/* Aufgeklappter Rumpf: Foto, Preis, Kacheln — auf der Vorlagenflaeche. */
html[data-ui-cards="stapel"] body aside.sidebar .sb-card .sbc-thumb {
  grid-row: 2 !important; grid-column: 1 !important;
  margin: 9px 0 0 9px !important;
}
html[data-ui-cards="stapel"] body aside.sidebar .sb-card .sbc-kp-row {
  grid-row: 2 !important; grid-column: 2 !important;
  padding: 9px 9px 0 0 !important;
}
html[data-ui-cards="stapel"] body aside.sidebar .sb-card .sbc-halter {
  grid-row: 3 !important; grid-column: 2 !important;
  padding: 0 9px 0 0 !important;
}
html[data-ui-cards="stapel"] body aside.sidebar .sb-card.uv-open .sbc-mini-grid {
  margin: 9px !important;
}

/* v1095b — GEMESSEN: das Stufen-Abzeichen stand bei x0 statt rechts.
   Mein position:absolute bezog sich auf .sbc-score-overlay (selbst
   absolut, also positionierter Vorfahr) statt auf die Karte — bei
   left:8px und automatischer Breite schob right:30px es aus dem Bild.
   Richtig ist das Muster aus v1082j: das Overlay spannt ueber die
   Bandbreite und schiebt Ring und Abzeichen per space-between
   auseinander. Dann braucht das Abzeichen gar keine Positionierung. */
html[data-ui-cards="stapel"] body aside.sidebar .sb-card > .sbc-score-overlay {
  left: 8px !important;
  right: 30px !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: auto !important;
}
html[data-ui-cards="stapel"] body aside.sidebar .sb-card .sbc-score-label {
  position: static !important;
  right: auto !important;
  top: auto !important;
  align-self: center !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v1096 — der Rest der Fundstellen aus Punkt 1

   NEU GEMESSEN, weil das v1093-Audit ausdruecklich Fehltreffer hatte.
   Diesmal nicht per Regex ueber die Datei, sondern im laufenden DOM:
   Akzent gesetzt, Momentaufnahme OHNE Vorlage, dann je Vorlage erneut,
   und verglichen wird je Element und Eigenschaft.

   ZWEI MESSFEHLER, die ich dabei zuerst selbst gebaut habe:

   1) "neutral" als GRAU definiert (max-min <= 8). Damit meldete "panel"
      NULL Treffer — dessen Neutralton ist rgb(21,26,32), ein Blaustich
      mit Abstand 11, und "boarding" ist cremefarben. Richtig ist der
      Vergleich ueber den FARBTON: traegt die Farbe noch den Ton des
      Akzents (+-30 Grad) oder nicht.
   2) Mit rotem Akzent (#7B2D3B, der Wert aus v1093) ist die Marke nicht
      vom Status-Rot zu trennen — .sb-card.deal-lost rgba(200,66,61,.65)
      erschien als Markenverlust. Gemessen wird deshalb mit einem
      violetten Akzent (#7C5CBF): Gruen und Rot bleiben dann eindeutig
      Statusfarben. Gegenprobe mit Rot: identische Liste bis auf genau
      diesen einen Fehltreffer.

   Dazu zwei Filter, ohne die die Liste Phantome enthaelt:
     * Rahmenfarbe zaehlt nur bei border-width > 0 und style != none.
       Sonst meldet der Logo-Rahmen einen "Verlust", obwohl die Vorlage
       ihn per border:0 (Z.745) bewusst ganz abraeumt.
     * color zaehlt nur, wo das Element einen EIGENEN Textknoten hat oder
       ein SVG ist. Sonst zaehlt jede Vererbungsstufe als eigene Stelle —
       so kamen die "33".

   ERGEBNIS (Modus standard, ohne data-ui-surface, Objekt geladen,
   1535 breit): 13 Elemente, davon fuenf Sachverhalte echt:

     .sbc-kp             der PREIS auf der Karte      alle Vorlagen
     .sb-actions-trigger Aktionen-Knopf + Label       alle Vorlagen
     .sbc-seq            FLAECHE der Nummernpille     alle Vorlagen
     .sb-section-title   nur "konsole" (v1093 liess die dunkle aus)
     .tabs-status-text   in v1082 als Gruen fehleingestuft, siehe (E)

   NICHT geaendert, weil Flaeche und nicht Marke: die sieben Rahmen und
   Trennlinien (aside#sidebar, header.hdr, nav.tabs, #sb-user, .sb-card,
   .sbcm, Knopfrahmen). Sie trugen Gold bei 10-55 % Deckung, also einen
   Neutralton — und "die Vorlage bestimmt Flaeche und Neutraltoene".
   ═══════════════════════════════════════════════════════════════════════ */

/* ── (A) Der Preis auf der Objektkarte ────────────────────────────────────
   Gegner ist meine eigene Sammelregel aus Abschnitt 5 auf .sbc-kp.
   Die prominenteste Zahl der Karte stand ohne Vorlage im Akzent. */
html[data-ui-theme="kontor"]   body aside.sidebar .sb-card .sbc-kp,
html[data-ui-theme="panel"]    body aside.sidebar .sb-card .sbc-kp,
html[data-ui-theme="kanzlei"]  body aside.sidebar .sb-card .sbc-kp,
html[data-ui-theme="boarding"] body aside.sidebar .sb-card .sbc-kp {
  color: var(--uv-marke-d) !important;
}
html[data-ui-theme="konsole"] body aside.sidebar .sb-card .sbc-kp {
  color: var(--gold-2, #E8C964) !important;
}

/* ── (B) Aktionen-Knopf ───────────────────────────────────────────────────
   URSACHE ist Z.296-303: .sb-header, .sb-section-title, .sb-actions-trigger
   und #sb-user teilen sich dort eine Regel mit color:var(--uv-chrome-ink).
   Fuer die drei anderen ist das richtig, fuer den Knopf nicht — er ist ein
   Bedienelement im Akzent.

   Sichtbar falsch war es schon vorher: v1090 hat den PFEIL im selben Knopf
   auf var(--wl-9a7f33) gesetzt (Z.972-977), der Text daneben blieb grau.
   Gemessen: Pfeil #451b23, Label rgb(20,19,16) — ein Knopf, zwei Farben.
   Deshalb hier derselbe Ton wie beim Pfeil, nicht --gold-d.
   .sb-actions-l traegt keine eigene Regel und erbt vom Knopf; benannt wird
   es trotzdem, weil style.css es getrennt faerbt (0,2,1). */
html[data-ui-theme="kontor"]   body aside.sidebar .sb-actions-trigger,
html[data-ui-theme="panel"]    body aside.sidebar .sb-actions-trigger,
html[data-ui-theme="kanzlei"]  body aside.sidebar .sb-actions-trigger,
html[data-ui-theme="boarding"] body aside.sidebar .sb-actions-trigger,
html[data-ui-theme="kontor"]   body aside.sidebar .sb-actions-trigger .sb-actions-l,
html[data-ui-theme="panel"]    body aside.sidebar .sb-actions-trigger .sb-actions-l,
html[data-ui-theme="kanzlei"]  body aside.sidebar .sb-actions-trigger .sb-actions-l,
html[data-ui-theme="boarding"] body aside.sidebar .sb-actions-trigger .sb-actions-l {
  color: var(--uv-marke-dd) !important;
}
html[data-ui-theme="konsole"] body aside.sidebar .sb-actions-trigger,
html[data-ui-theme="konsole"] body aside.sidebar .sb-actions-trigger .sb-actions-l {
  color: var(--gold-2, #E8C964) !important;
}

/* ── (C) Flaeche der Nummernpille ─────────────────────────────────────────
   v1093 hat die SCHRIFT der Pille auf den Akzent gestellt, die Flaeche
   darunter blieb der Kachelton — dunkelgoldene Ziffern auf Cremeweiss.
   Gemessen war die Flaeche urspruenglich color-mix(var(--gold) 12%,
   transparent), also eine TOENUNG, kein Vollton. Genau das wird sie auch
   hier: 12 % Akzent auf dem Kachelton der Vorlage, statt reinem Gold auf
   Weiss. Damit bleibt die Vorlage Herr ueber die Helligkeit.

   ACHTUNG, Werkzeugbefund: der Kaskaden-Walker findet diese Stelle NICHT
   ueber background-color. CSSOM expandiert die Kurzschrift `background`
   in getPropertyValue() nicht — gesucht werden muss nach `background`.
   Deshalb hier ebenfalls die Kurzschrift, sonst gewinnt Z.~600 wieder. */
html[data-ui-theme] body aside.sidebar .sb-card .sbc-seq {
  background: color-mix(in srgb, var(--gold, #C9A84C) 12%, var(--uv-card-tile)) !important;
  border-color: color-mix(in srgb, var(--gold, #C9A84C) 26%, var(--uv-card-tile)) !important;
}

/* ── (D) Abschnittsueberschrift in der dunklen Vorlage ────────────────────
   v1093 hat .sb-section-title fuer die vier hellen Vorlagen gesetzt und
   "konsole" ausgelassen. Dort gewinnt weiter Z.304 (--uv-chrome-mut).
   Gemessen faerbt das auch die Lupe im Suchfeld mit: .sb-search-box > svg
   traegt keine eigene Farbe, sie erbt ueber .sb-section-title. Eine
   Ursache, vier Knoten (span "Portfolio", svg, circle, line). */
html[data-ui-theme="konsole"] body aside.sidebar .sb-section-title {
  color: var(--gold-2, #E8C964) !important;
}

/* ── (E) Der Fortschrittstext in der Tab-Leiste ───────────────────────────
   EIGENER FEHLER AUS v1082, ausdruecklich zurueckgenommen: .tabs-status-text
   steht dort in Gruppe (c) "aufgehelltes Gruen" (Z.865-868) und wird auf
   #2E8455 gesetzt. Gemessen ist der Normalzustand aber GOLD —
   style.css:25776 .tabs-status-text{color:var(--gold-2,#E8C964)}; gruen wird
   der Text erst im FERTIGEN Zustand ueber style.css:25784
   .tabs-status-done .tabs-status-text{color:var(--green-2,#5ed992)}.
   Ich hatte die Zustandsfarbe fuer die Grundfarbe gehalten. Folge: in allen
   vier hellen Vorlagen stand "0 / 6 · 0 %" in Gruen.

   Richtig gestellt: Grundzustand traegt den Akzent, Gruen bleibt dem
   Zustand `done` vorbehalten — und bleibt Statusfarbe, wird also nicht
   tokenisiert. Spezifitaet (0,3,2) schlaegt die v1082-Regel (0,2,2). */
html[data-ui-theme="kontor"]   body nav.tabs .tabs-status-text,
html[data-ui-theme="panel"]    body nav.tabs .tabs-status-text,
html[data-ui-theme="kanzlei"]  body nav.tabs .tabs-status-text,
html[data-ui-theme="boarding"] body nav.tabs .tabs-status-text {
  color: var(--uv-marke-dd) !important;
}
html[data-ui-theme="kontor"]   body nav.tabs .tabs-status-done .tabs-status-text,
html[data-ui-theme="panel"]    body nav.tabs .tabs-status-done .tabs-status-text,
html[data-ui-theme="kanzlei"]  body nav.tabs .tabs-status-done .tabs-status-text,
html[data-ui-theme="boarding"] body nav.tabs .tabs-status-done .tabs-status-text {
  color: #2E8455 !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v1098 — "Form": der Radius wird waehlbar

   Marcels Zusatz zum Backlog-Punkt ("vielleicht die Farbe auch einstellbar
   fuer die verschiedenen Bereiche, Farbe, Form"). Der Radius steckte
   bisher nur IN der Vorlage: --uv-r 3px in "kontor", 11px in "panel", 12px
   in "boarding".

   GEMESSEN, dass EINE Regel reicht: alle Radien in dieser Datei lesen
   --uv-r bzw. --uv-rs (Fundstellen 376, 385, 413, 1092, 1110, 1483, 1487).
   Es braucht also keine Regel je Flaeche, sondern nur die zwei Tokens.

   SPEZIFITAET, nicht Ladereihenfolge (CLAUDE.md): die Token-Saetze der
   Vorlagen stehen auf html[data-ui-theme="…"] = (0,1,1). Hier steht
   :root[data-ui-form="…"] = (0,2,0) und gewinnt damit unabhaengig davon,
   wer spaeter in der Datei steht.

   GRENZE, ehrlich benannt: das wirkt nur MIT einer Vorlage. Ohne
   data-ui-theme liest keine Regel dieser Datei --uv-r, die App nutzt dann
   ihre eigenen Radien aus style.css. Das ist genau die Zusicherung "wer
   nicht umschaltet, merkt nichts" — deshalb steht der Hinweis auch im
   Panel und nicht nur hier.
   ═══════════════════════════════════════════════════════════════════════ */
:root[data-ui-form="kantig"] {
  --uv-r:  0px;
  --uv-rs: 0px;
}
:root[data-ui-form="rund"] {
  --uv-r:  16px;
  --uv-rs: 11px;
}

/* ═══════════════════════════════════════════════════════════════════════
   v1099c — die letzten weissen Flaechen im Arbeitsbereich

   Nach v1099/v1099b stand der Kontrastlauf ueber #s0 in "konsole" bei 14
   Fundstellen — alle mit HELLEM Text rgb(230,232,234) auf einer weiss
   gebliebenen Flaeche. Der Text folgt seit v1099b der Vorlage, die Flaeche
   darunter nicht. Zwei Gruppen, beide gemessen:

   (a) ALLE Knoepfe im Arbeitsbereich. style.css:29839 (V258-02) setzt
       background:#ffffff!important und color:var(--ch)!important auf einer
       Kette mit sieben :not() — Spezifitaet (0,15,1). Genau der Fall, vor
       dem CLAUDE.md warnt: ":not(#id) erbt ID-Spezifitaet" gilt hier zwar
       nicht, aber die schiere Zahl der Teilselektoren macht die Regel
       praktisch unschlagbar. Deshalb wird die Kette hier UEBERNOMMEN und
       nur um das Vorlagen-Praefix erweitert: (0,17,3) schlaegt (0,15,1),
       und es ist bitgenau dieselbe Elementmenge — keine Regel trifft
       plötzlich mehr oder weniger Knoepfe als vorher.
       Die Farbe kommt aus --uv-surf, nicht aus --uv-card: ein Knopf ist
       eine Bedienflaeche, keine Karte.

   (b) Die Boarding-Leiste. .dp-pfbar .dp-pf-tile und .dp-pf-rz stehen bei
       (0,2,0), hier reicht das Hausmuster (0,2,2).
   ═══════════════════════════════════════════════════════════════════════ */

/* (a) Knoepfe — dieselbe Kette wie style.css:29839, plus Praefix */
html[data-ui-theme] body .sec button:not(.dp-tip):not(.tab):not(.sb-action-btn):not(.fb-modal-close):not(.modal-close):not(.btn-clean):not(.fab-btn),
html[data-ui-theme] body .sec .v235-next-btn,
html[data-ui-theme] body .sec .da-card-cta,
html[data-ui-theme] body .sec .da-bank-pdf-btn,
html[data-ui-theme] body .sec .btn-gold,
html[data-ui-theme] body .sec .btn-primary,
html[data-ui-theme] body .sec .ai-btn {
  background: var(--uv-surf) !important;
  color: var(--uv-ink) !important;
}

/* (b) Boarding-Leiste im Arbeitsbereich */
html[data-ui-theme] body .dp-pf-tile,
html[data-ui-theme] body .dp-pf-rz,
html[data-ui-theme] body .dp-pf-mtrigger {
  background: var(--uv-surf) !important;
  color: var(--uv-ink) !important;
  border-color: var(--uv-line) !important;
}

/* (c) Zwei Resttoene, die auf der dunklen Flaeche nicht mehr trugen.
   --uv-mut ist in "konsole" #6E747C und lag damit unter 3 gegen die
   Arbeitsflaeche #101215. Nur DORT angehoben — in den hellen Vorlagen
   steht derselbe Token auf hellem Grund und ist unauffaellig. */
html[data-ui-theme="konsole"] {
  --uv-mut: #9AA1AA;
}
/* Gegenprobe ueber alle sechs Fassungen hat noch eine gefunden: "panel"
   stand bei 10 Fundstellen unter 3, waehrend ohne Vorlage 5 und in den
   uebrigen hellen Vorlagen 4 stehen. Die sechs zusaetzlichen waren alle
   --uv-mut #8a95a2 mit k=2,78 — der kuehle Grauton ist auf der hellen
   Flaeche zu blass. Nur panel angefasst, die anderen liegen bereits auf
   Referenzniveau. */
html[data-ui-theme="panel"] {
  --uv-mut: #6B7683;
  /* v1108: --uv-card-mut war beim Abdunkeln in v1099d uebersehen worden.
     GEMESSEN auf der Objektkarte: 15 Fundstellen bei k=2,89 — knapp unter
     der Schwelle, aber durchgaengig. Derselbe Grund wie beim Geschwister-
     Token: der kuehle Grauton ist auf heller Flaeche zu blass. */
  --uv-card-mut: #6B7683;
}
/* Ein weisses Etikett auf hellem Grund — eigene Flaeche, eigener Ton. */
html[data-ui-theme] body .sec .ki-lage-tag {
  background: var(--uv-surf2) !important;
  color: var(--uv-ink) !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v1103 — der Hell-Skin ueberstimmt die Vorlage an drei Flaechen

   GEMESSEN in "kanzlei", einmal mit und einmal ohne body.dp-chrome-hell,
   sonst identischer Zustand:

     aside.sidebar   #FBFAF7 (Vorlage)  ->  #ffffff       Skin gewinnt
     .sb-footer      transparent        ->  #ffffff       Skin gewinnt
     nav.tabs        #FBFAF7 (Vorlage)  ->  rgb(10,10,10) SCHWARZ

   DAS TRIFFT JEDEN, der ueber das Panel wechselt: v1085 koppelt den
   Skin an die Vorlage, eine helle Vorlage setzt also dp-chrome-hell —
   und dann steht in kontor, panel, kanzlei und boarding eine SCHWARZE
   Tab-Leiste unter einer hellen Kopfzeile.

   Es ist derselbe Fall wie v1091 (A): dort habe ich Kopf und Badges vom
   Skin zurueckgeholt, die Leiste und die Tabs aber uebersehen. Die
   Gegner stehen bei (0,2,2) bzw. (0,4,3) mit !important, meine bisherigen
   Vorlagenregeln bei (0,1,2) bzw. (0,2,3) — sie verlieren.

   Wie in v1091: die Vorlage ist die spaetere und ausdrueckliche Wahl und
   gewinnt. Ohne Vorlage bleibt der Skin unangetastet.
   ═══════════════════════════════════════════════════════════════════════ */
html[data-ui-theme] body.dp-chrome-hell aside.sidebar#sidebar {
  background: var(--dpuv-side-bg, var(--uv-chrome)) !important;
}
html[data-ui-theme] body.dp-chrome-hell aside.sidebar#sidebar .sb-footer,
html[data-ui-theme] body.dp-chrome-hell aside.sidebar#sidebar #sb-user {
  background: transparent !important;
}
html[data-ui-theme] body.dp-chrome-hell nav.tabs,
html[data-ui-theme] body.dp-chrome-hell .main-col > nav.tabs,
html[data-ui-theme] body.dp-chrome-hell header.hdr.has-v64-score + nav.tabs,
html[data-ui-theme] body.dp-chrome-hell header.hdr.has-v64-score + nav.tabs.tabs {
  background: var(--dpuv-header-bg, var(--uv-chrome)) !important;
}
html[data-ui-theme] body.dp-chrome-hell header.hdr,
html[data-ui-theme] body.dp-chrome-hell header.hdr.has-v64-score {
  background: var(--dpuv-header-bg, var(--uv-chrome)) !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v1105 — Stapel-Feinschliff: der Rumpf bekommt Eigengewicht

   Marcels Wahl vom 06.08. aus zwei gezeigten Fassungen: "B — Abgesetzt".
   Die verworfene Fassung A (rahmenlose Kacheln, nur Trennstriche) ist
   entfernt, ebenso das Vergleichs-Attribut data-uv-stapel.

   BEFUND VORAB — eine Annahme des Backlog-Punktes ist widerlegt.
   Der Punkt sagte, im Mockup traegen "die KPI-Kacheln im Rumpf DUNKLE
   Flaechen, hier folgen sie der Vorlagenfarbe". Nachgesehen in
   design/mockups/dp-handy-mockup-v2.html: dort ist --k-tile PRO FASSUNG
   definiert —

     dunkel   --k-tile: rgba(255,255,255,.035)   (Aufhellung)
     kontor   --k-tile: #FAF9F7  auf --k-bg #FFFFFF
     panel    --k-tile: #F8F9FB

   Das Mockup macht es also genauso wie die App: die Kachel folgt der
   Vorlage. Der Eindruck "dunkle Kacheln" stammt aus dem JPG, das nur die
   dunkle Fassung zeigte. Gemessen in "panel": Kachel rgb(248,249,251) auf
   Karte rgb(255,255,255) — Abstand 6, exakt wie im Mockup.

   Der echte Punkt war ein anderer, und den loest dieses Paket: der goldene
   Kopf nimmt 159 von 257 px der aufgeklappten Karte ein, der Rumpf hatte
   dagegen kaum Eigengewicht. Jetzt ist das Raster ein eigener Block mit
   Rahmen, die Kacheln darin sind nochmal abgesetzt.

   Die Toene werden aus --uv-card-ink GEMISCHT, nicht gesetzt: damit
   funktioniert dasselbe Muster in beide Richtungen — auf hellen Vorlagen
   eine Spur dunkler, auf dunklen eine Spur heller, ohne je Vorlage eigene
   Werte zu pflegen. Das ist die Verallgemeinerung dessen, was das Mockup
   in seiner dunklen Fassung mit rgba(255,255,255,.035) tut.

   NICHT gebaut: "Im Rennen" und "Detail oeffnen →". Beide kommen im
   Mockup nicht vor (nachgesehen, kein Treffer) und muessten aus
   storage.js nachgeruestet werden. Eine Leistenkarte ist eine Uebersicht;
   der Weg ins Detail ist der Klick auf die Karte selbst.

   NACHGEMESSEN (konsole und kontor, zwei Karten aufgeklappt):
   Kartenhoehe 255 -> 267 px, Raster und Kacheln heben sich sichtbar vom
   Kartengrund ab, in beiden Helligkeiten.
   ═══════════════════════════════════════════════════════════════════════ */
html[data-ui-cards="stapel"] body aside.sidebar .sb-card.uv-open .sbc-mini-grid {
  margin: 10px !important;
  gap: 6px !important;
  padding: 8px !important;
  background: color-mix(in srgb, var(--uv-card-ink) 5%, var(--uv-card)) !important;
  border: 1px solid var(--uv-card-tl) !important;
  border-radius: var(--uv-rs, 7px) !important;
}
html[data-ui-cards="stapel"] body aside.sidebar .sb-card .sbcm {
  background: color-mix(in srgb, var(--uv-card-ink) 9%, var(--uv-card)) !important;
  border: 1px solid color-mix(in srgb, var(--uv-card-ink) 14%, var(--uv-card)) !important;
  border-radius: var(--uv-rs, 7px) !important;
}
/* Das Kachel-Label muss auf der ABGESETZTEN Flaeche noch tragen.
   GEMESSEN im direkten Vorher/Nachher: Fassung B brachte 6 neue
   Fundstellen unter k=3, ausnahmslos .sbcm-label — es steht auf
   --uv-card-mut (#918d84) und kam gegen die getoente Kachel nur auf 2,75.
   Der Ton wird deshalb aus denselben zwei Tokens gemischt wie die Kachel
   selbst; 62 % ergeben 4,31 und wirken in beide Helligkeiten, weil
   --uv-card-ink auf dunklen Vorlagen hell ist. */
html[data-ui-cards="stapel"] body aside.sidebar .sb-card .sbcm .sbcm-label {
  color: color-mix(in srgb, var(--uv-card-ink) 62%, var(--uv-card)) !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   v1113 · Gold auf Gold in der Score-Karte
   Backlog Punkt "Darstellung → Profil und Anzeige ist unvollstaendig",
   Bild design/mockups/Screenshot 2026-08-06 144507.png (rot umkringelt:
   die Zeile "INVESTOR SCORE" und die Zeile darunter).

   URSACHE, gemessen im Kaskaden-Walker: body.dp-chrome-hell macht
   #hdr-badges .sc-main zur Markenflaeche —
     background: linear-gradient(135deg,var(--gold-hi),var(--gold) 55%,…)
   bei Spezifitaet (1,2,1) mit !important. Seit v1085 haengt der Skin an
   der Vorlage, also trifft das JEDE helle Vorlage. Die Texte darauf sind
   aber die fuer dunklen Grund gebauten geblieben:

     #hdr-badges .sc-l   color:var(--gold)            k = 1,06  <- Gold auf Gold
     #hdr-badges .sc-sub rgba(168,162,153,.95)        k = 1,16
     .sc-grade           Statusgruen #2E8455          k = 1,97
     .sc-pill-l / -sub   Graustufen auf weisser Pille k = 2,40 / 2,16

   Gemessen ueber den echten Bedienweg in allen sechs Fassungen:
     ohne Vorlage 0 · kontor/panel/kanzlei/boarding je 13 · konsole 1.

   Die drei Toene auf der Markenflaeche kommen aus --uv-sc-*, die
   config.js in OKLab nachzieht (v1113, dritte Ableitung neben TR9/TR10).
   Der Rueckfall im var() ist der fuer Standard-Gold richtige Wert — ist
   das Token da, gewinnt es (Muster aus v1096b).

   Die beiden Pillen-Toene stehen auf WEISS, nicht auf der Marke, und
   brauchen deshalb keine Ableitung: #6f685d/#7d766a sind die Haus-Graus
   und liefern gemessen 5,51 und 4,50. Sie sind neutral, kein Gold —
   damit auch kein Fall fuer die Whitelabel-Pflicht.
   ═══════════════════════════════════════════════════════════════════════ */

/* (1,2,1) schlaegt #hdr-badges .sc-l (0,1,1) und die Vorlagen-Regel
   html[data-ui-theme="…"] body header.hdr .sc-grade (0,3,3, !important) —
   die ID zaehlt hoeher als drei Klassen. */
body.dp-chrome-hell #hdr-badges .sc-l {
  /* v1123: Nutzerebene davor, Ableitung bleibt der Rueckfall. */
  color: var(--dp-hero-text-sm, var(--uv-sc-ink, color-mix(in srgb, var(--gold) 26%, #0b0a06))) !important;
}
body.dp-chrome-hell #hdr-badges .sc-sub {
  color: var(--uv-sc-mut, color-mix(in srgb, var(--gold) 40%, #0b0a06)) !important;
}
body.dp-chrome-hell #hdr-badges .sc-grade {
  color: var(--uv-sc-ok, #17472c) !important;
}
/* NACHTRAG, ehrlich vermerkt: .sc-tip ("KI raet: Kauf erwaegen") stand in
   meinem ersten Lauf NICHT in der Liste — nicht weil es sauber war,
   sondern weil mein Grund-Parser color(srgb …) nicht lesen konnte, die
   Form in der Chrome color-mix() zurueckgibt. Ein uebersprungenes Element
   sah aus wie ein bestandenes. Mit erweitertem Parser gemessen: 1,77
   (#99803a auf Gold). Die Ausgangszahl war also 14, nicht 13.
   .sc-tip traegt die Akzentrolle wie .sc-l und bekommt denselben Ton. */
body.dp-chrome-hell #hdr-badges .sc-tip {
  color: var(--dp-hero-text-sm, var(--uv-sc-ink, color-mix(in srgb, var(--gold) 26%, #0b0a06))) !important;   /* v1123 */
}

/* .sc-v ist der Hauptwert der Karte ("Gute Bewertung"). Bei Standard-Gold
   trug er (der Hell-Skin setzt ihn dunkel), aber die Gegenprobe mit
   Partner-Rot #7B2D3B zeigte k = 2,28: dort ist die Markenflaeche DUNKEL,
   der Text blieb trotzdem dunkel. Deshalb auch hier ueber die Ableitung,
   mit neutralem Start (Weiss) und Schwelle 7 — der prominenteste Text der
   Karte soll nicht nur knapp bestehen. */
body.dp-chrome-hell #hdr-badges .sc-v {
  color: var(--dp-hero-text-sm, var(--uv-sc-txt, #1c1a17)) !important;   /* v1123 */
}

/* .sc-investor-badge — der Fall aus der GEGENRICHTUNG, in "konsole"
   gemessen: k = 1,93, heller Text rgb(230,232,234) auf goldener Pille.
   Gewinner war "#hdr-badges .sc-investor-badge{color:var(--ch)}" — also
   erneut --ch, die Falle aus CLAUDE.md und v1099b. Die Pille ist in JEDER
   Fassung golden, --ch schaltet aber mit der Vorlage mit: in konsole wird
   heller Text auf eine goldene Flaeche gesetzt.
   Deshalb hier OHNE Skin-Bedingung, fuer alle sechs Fassungen. Gemessen
   aendert das den funktionierenden Zustand praktisch nicht (ohne Vorlage
   6,24 -> 6,07), beseitigt aber die Vorlagenabhaengigkeit ganz. */
html body #hdr-badges .sc-investor-badge {
  color: var(--dp-hero-text-sm, var(--uv-sc-ink, color-mix(in srgb, var(--gold) 26%, #0b0a06))) !important;   /* v1123 */
}
/* ═══════════════════════════════════════════════════════════════════════
   v1123-kartentext · Der Nutzerregler kommt VOR die Ableitung, nicht
   statt ihr. Drei Ebenen, das Muster aus v1096b um eine erweitert:

     var(--dp-hero-text-*, var(--uv-sc-*, <Rueckfall fuer Standard-Gold>))
       1. Nutzerwert    gesetzt vom Regler (textfarben-karten.js)
       2. Ableitung     tonAufMarke() aus v1113
       3. Rueckfall     der fuer Standard-Gold richtige Wert

   -lg gilt fuer GROSSEN Text (>= 18,5 px fett bzw. >= 24 px, WCAG 1.4.3),
   -sm fuer normalen. Gemessen: .sc-v ist 16 px fett und damit NORMAL,
   die Score-Zahl 21 px fett und damit gross.

   NICHT dabei, und zwar mit Absicht (Marcels Entscheidung): .sc-sub
   (--uv-sc-mut) und .sc-grade (--uv-sc-ok). Nebentoene und Statusfarben
   bleiben abgeleitet — Statusfarben werden nie tokenisiert.

   GEMESSEN, und es hat meine erste Fassung korrigiert: die Score-ZAHL
   („83", 21 px fett) sitzt WEISS im Donut-Ring (.sc-donut > span, ohne
   Klasse) und damit gar nicht auf der Markenflaeche. Sie gehoert nicht zu
   diesem Regler. In der Score-Karte ist damit KEIN Text „gross" im Sinne
   der Norm — .sc-v ist 16 px fett, also normal. Der -lg-Ton wird dort
   folglich nie gebraucht; gebraucht wird er nur bei den KPI-Pillenwerten
   (22 px fett).

   Die Regeln der Score-Karte sind oben an Ort und Stelle um die
   Nutzerebene ergaenzt, statt hier ein zweites Mal zu stehen — zwei
   Regeln fuer dieselbe Sache waeren genau die Doppel-Wahrheit, die
   v1096b gekostet hat.
   ═══════════════════════════════════════════════════════════════════════ */

/* Die weissen KPI-Pillen — unabhaengig von der Marke. */
body.dp-chrome-hell #hdr-badges .sc-pill-l {
  color: #6f685d !important;
}
body.dp-chrome-hell #hdr-badges .sc-pill-sub {
  color: #7d766a !important;
}

/* v1123 · Die KPI-Pillen bekommen ihre Nutzerfarbe ueber ein KENNZEICHEN
   am body, nicht ueber einen var()-Rueckfall.
   Grund, gemessen: .sc-pill-v hat in diesem Block gar keine eigene Regel —
   seine Farbe kommt von woanders. Ein `var(--token, inherit)` haette den
   Wert ohne Nutzerfarbe VERAENDERT, also den Normalzustand angefasst, um
   einen Sonderfall zu bedienen. Mit dem Kennzeichen greift die Regel
   ueberhaupt erst, wenn eine Farbe gesetzt ist — ohne sie bleibt alles
   bitgenau wie vorher.
   -lg fuer den Wert (22 px fett = grosser Text, WCAG 3,0),
   -sm fuer Label und Unterzeile (10 px = normal, WCAG 4,5). */
body[data-dp-kpitext] #hdr-badges .sc-pill-l,
body[data-dp-kpitext] #hdr-badges .sc-pill-sub {
  color: var(--dp-kpi-text-sm) !important;
}
body[data-dp-kpitext] #hdr-badges .sc-pill-v {
  color: var(--dp-kpi-text-lg) !important;
}
/* v1123c · .sc-v ("Gute Bewertung") braucht dasselbe Kennzeichen.
   Gemessen: ohne Hell-Skin gilt nur `#hdr-badges .sc-v{color:var(--dp-ink-1)}`
   (1,1,0, ohne !important) — die Hell-Skin-Regel oben greift dort nicht.
   Ohne Nutzerfarbe bleibt es bei --dp-ink-1, die Regel existiert dann nicht. */
body[data-dp-herotext] #hdr-badges .sc-v {
  color: var(--dp-hero-text-sm) !important;
}

/* v1113e · Die GEGENRICHTUNG: Markenakzent auf dunklem Grund.
   In der Rot-Gegenprobe OHNE Hell-Skin gemessen (konsole und "ohne
   Vorlage"): .sc-l 1,93 / 2,28 · .sc-tip 2,86 · .sc-pill-v 2,86. Dort ist
   die Score-Karte nicht golden, die drei lesen aber var(--gold) direkt —
   ein dunkler Akzent auf dunklem Grund.

   --uv-sc-akz zieht den Akzent gegen den dunklen Grund nach (dieselbe
   Rechnung wie TR9). NACHGEMESSEN, dass die Hausmarke unberuehrt bleibt:
   Standard-Gold #C9A84C -> #c9a84c, Hellgelb #F0D000 -> #f0d000, beide
   bitgenau unveraendert. Nur Partner-Rot wandert (#7B2D3B -> #c36d78).

   Die Spezifitaet ist ABSICHTLICH niedriger als die der Hell-Skin-Regeln
   oben: (1,1,2) gegen (1,2,1). Ist die Karte golden, gewinnen die dunklen
   Toene; ist sie dunkel, greift diese Regel. */
html body #hdr-badges .sc-l,
html body #hdr-badges .sc-tip {
  /* v1123: Nutzerebene auch HIER davor. Gemessen — ohne das wirkte der
     Regler nur unter hellen Vorlagen, weil diese Regel (1,1,2) die
     Hell-Skin-Regel gar nicht braucht und immer greift. Ein Regler, der
     ohne Vorlage nichts tut, ist ein kaputter Regler. */
  color: var(--dp-hero-text-sm, var(--uv-sc-akz, var(--gold))) !important;
}

/* EIGENER FEHLER, ZURUECKGENOMMEN (v1113f):
   .sc-pill-v stand in der Regel oben mit drin. Falsch — ich hatte es nach
   der konsole-Messung als "auf dunklem Grund" eingeordnet. Unter den
   HELLEN Vorlagen sitzen die KPI-Pillen aber auf WEISS, nicht auf der
   Markenflaeche. Gemessen hat v1113e damit fuenf Stellen von "traegt" auf
   2,29 verschlechtert — ein Rueckschritt, den erst der Vorher/Nachher-Lauf
   in kontor gezeigt hat.
   Die Regel gilt deshalb nur ausserhalb des Hell-Skins. Kein :not() auf
   einer ID (CLAUDE.md), nur auf der Skin-Klasse. */
html body:not(.dp-chrome-hell) #hdr-badges .sc-pill-v {
  /* v1123: dito. Diese Regel steht bei (1,2,2) und schlug meine
     Kennzeichen-Regel (1,2,1) — gemessen, nicht vermutet. */
  color: var(--dp-kpi-text-lg, var(--uv-sc-akz, var(--gold))) !important;
}


/* ═══════════════════════════════════════════════════════════════════════
   v1114 · Der Partner-Regler "Header & Sidebar-Fläche" bewegt nichts.

   GEMESSEN (Partner-Konto, Whitelabel aktiv, Obsidian #2E4A7D gesetzt):
     --gold      #C9A84C -> #7B2D3B   der Akzent WIRKT
     --obsidian  (leer)  -> #2E4A7D   das Token STEHT
     header.hdr / aside.sidebar / nav.tabs   BITGENAU UNVERAENDERT

   URSACHE: "var(--obsidian)" kommt in der ganzen App in KEINER einzigen
   CSS-Regel vor (style.css 0 Treffer, ui-varianten.css 0 Treffer). Nur
   eigenstaendige Seiten mit eigenem :root benutzen den Namen —
   mobile-demo.html, pass.html, landing/api-docs.html. Der Sweeper setzt
   das Token seit jeher (whitelabel-override.js:517), gelesen hat es nie
   jemand. Der Regler heisst im Editor woertlich "Header & Sidebar-Fläche".

   Die Flaechen selbst lesen bereits Tokens — aside.sidebar var(--dp-s0),
   .main-col > header.hdr var(--dp-s1) —, nur nav.tabs traegt ein hartes
   rgb(10,8,5) bei (0,3,2). Deshalb hier chirurgisch die drei Flaechen
   statt --dp-s0/--dp-s1 global umzubiegen: die beiden haengen an ueber
   zwanzig weiteren Stellen.

   DIE FALLBACKS SIND DIE HEUTIGEN WERTE, gemessen abgelesen:
   Sidebar #000000, Tabs rgb(10,8,5), Header-Verlauf rgb(10,8,5)->#000.
   Ohne Whitelabel ist damit bitgenau nichts geaendert.

   GRENZE, ehrlich benannt: das wirkt nur OHNE Vorlage. Unter einer
   Vorlage sind diese Flaechen hell und --uv-chrome bestimmt sie — "die
   Vorlage bestimmt die Flaeche" (v1096). Ein dunkler Partner-Hintergrund
   unter einer hellen Vorlage waere ein Bruch, kein Branding. */
/* v1136g-hellskin · `body:not(.dp-chrome-hell)` ergaenzt. GEMESSEN im
   Browser, nicht vermutet: ohne Vorlage schlug die Regel hier den
   Hell-Skin. Der Vergleich Selektor gegen Selektor —

     body.dp-chrome-hell aside.sidebar          (0,2,2)  hell #EAE4D6
     html:not([data-ui-theme]) body aside.sidebar (0,2,3) Obsidian #000

   — eine TYPKOMPONENTE mehr auf der dunklen Seite, und `:not()` erbt die
   Spezifitaet seines Inhalts nicht (ein Attributselektor waere (0,1,0)
   gewesen). Ergebnis: wer "Hell" schaltete und KEINE Vorlage aktiv
   hatte, bekam eine schwarze Sidebar — der Schalter wirkte nicht, und
   das ist der eigentliche Grund fuer Marcels Beobachtung am
   Aktionen-Aufklapper (Backlog Punkt 1).

   Und "keine Vorlage" ist der Normalfall: die Standardvariante
   "dealpilot" traegt bewusst KEIN data-ui-theme (siehe Kopf dieser
   Datei). Der Hell-Skin war fuer Sidebar, Reiterband und Kopfzeile also
   praktisch wirkungslos, solange niemand eine helle Vorlage gewaehlt
   hatte.

   Der Zusatz aendert NUR den Fall "Hell-Skin aktiv". Ohne ihn bleibt
   alles bitgenau wie bisher — die Fallbacks sind unangetastet.

   NUR DIE SIDEBAR, bewusst: Ich hatte denselben Zusatz zuerst auch an
   Reiterband und Kopfzeile gesetzt und dann gemessen — mit Zusatz stand
   das Band bei rgb(10,10,10), ohne ihn bei rgb(10,8,5). Der Zusatz
   schaltete dort also nur die gewollte Regel ab, ohne die Flaeche
   aufzuhellen; eine andere Regel uebernahm mit einem praktisch gleichen
   Dunkelton. Wirkung ohne Zweck, also wieder heraus. Dass Kopfzeile und
   Reiterband im Hell-Skin dunkel bleiben, ist gewollt: der Skin heisst
   "Chrome hell" und meint Sidebar und Flaechen, nicht den Kopf. */
html:not([data-ui-theme]) body:not(.dp-chrome-hell) aside.sidebar,
html:not([data-ui-theme]) body:not(.dp-chrome-hell) #sidebar.sidebar {
  background: var(--obsidian, #000000) !important;
}
/* (0,3,3) gegen den Nachbarschafts-Selektor header.hdr.has-v64-score +
   nav.tabs (0,3,2) — eine Stelle mehr, sonst gewinnt das Literal. */
html:not([data-ui-theme]) body nav.tabs,
html:not([data-ui-theme]) body header.hdr.has-v64-score + nav.tabs,
html:not([data-ui-theme]) body header.hdr.has-v64-score + nav.tabs.tabs {
  background: var(--wl-obs-hi, #0a0805) !important;
}
html:not([data-ui-theme]) body .main-col > header.hdr {
  background: linear-gradient(var(--wl-obs-hi, #0a0805) 0%, var(--wl-obs-lo, #000000) 100%) !important;
}
