/* ═══════════════════════════════════════════════════════════════════════
   layout-varianten.css · v1635 — fünf Raumordnungen, eine App

   Diese Datei ORDNET DEN RAUM. Sie färbt ihn nicht: der helle Grund kommt
   von `body.dp-chrome-hell` (103 geprüfte Regeln), das `layout-varianten.js`
   beim Umschalten mitsetzt. Eine zweite Hellfassung danebenzustellen hiesse,
   jede künftige Änderung an zwei Stellen zu pflegen.

   ── WAS JEDES LAYOUT GEMEINSAM TUT ───────────────────────────────────
   1. `.sc-main` (der grosse Investor Deal Score) verschwindet, und
      `#hdr-score-mini` tritt an seine Stelle. DEN GIBT ES SCHON - er ist
      heute nur leer. Marcel: „brauchen wir nicht gross oben … wäre aber
      gut, wenn man ihn noch irgendwo stehen hätte."
   2. Die fünf `.sc-pill` werden zu einer Zeile von 40 px statt eines
      Blocks von 141.
   3. Die Reiterzeile verliert ihre Fülle und trägt den aktiven Reiter
      über eine Goldkante - ein Millimeter Gold wirkt teurer als eine
      goldene Kachel.

   ── DIE SPEZIFITÄTSFRAGE ─────────────────────────────────────────────
   `style.css` hat 36.929 Zeilen und 4.198 `!important`. Gegen die kommt
   man nicht mit Token an - deshalb trägt hier jede Regel den Anker
   `html[data-dp-layout]` (ein Attribut am Wurzelelement, 0-1-0) UND wo
   nötig `!important`. Beides ist hier kein Faulheitszeichen, sondern die
   einzige Art, eine 36.000-Zeilen-Datei punktuell zu überstimmen, ohne
   sie anzufassen.

   ── DIE SCHIENE ──────────────────────────────────────────────────────
   Bei `links`/`rechts` steht sie `position:fixed` - `.main-col` hat über
   sechzig Kinder, ein `display:grid` darauf würde jedes sichtbare davon
   einsortieren. Aus dem Fluss genommen kollidiert sie mit keinem.
   Bei `leiste`/`fuss` bleibt sie im Fluss und wird über `order` gesetzt.
   ═══════════════════════════════════════════════════════════════════════ */

html[data-dp-layout]{
  --dpl-schiene-b: 208px;
  --dpl-papier:#FDFCFA;
  --dpl-flaeche:#FFFFFF;
  --dpl-grau:#F4F2ED;
  --dpl-linie:#E6E1D6;
  --dpl-linie-stark:#CEC6B6;
  --dpl-tinte:#1A1A18;
  --dpl-leise:#6B645A;
  --dpl-sehr-leise:#9A9287;
  --dpl-gold: var(--wl-c9a84c, #C9A84C);
  --dpl-gold-lo: var(--wl-b8932f, #b8932f);
}

/* ═══ 1 · GEMEINSAM: der Kopf wird schmal ═══════════════════════════ */

/* Der grosse Score geht - der kleine kommt. */
html[data-dp-layout] .hdr-v61-row2 .sc-main{ display:none !important; }
html[data-dp-layout] .hdr-v61-row2{
  height:auto !important; min-height:0 !important; padding:6px 16px !important;
  border-bottom:1px solid var(--dpl-linie) !important;
}
html[data-dp-layout] .hdr-v61-row2 .scores{
  display:flex !important; gap:0 !important; height:auto !important;
  min-height:0 !important; padding:0 !important; border:1px solid var(--dpl-linie) !important;
  border-radius:2px !important; background:var(--dpl-flaeche) !important; overflow:hidden;
}
/* Die Kachel wird zur ZEILE. Gemessen war sie 93 px hoch, weil vier
   Blöcke untereinander stehen: Beschriftung 15, Wert 33, Zusatz 15,
   Balken 4. Beschriftung und Wert rücken nebeneinander, der Zusatz
   ("4 / 4 KPIs") entfällt - er wiederholt, was die Vollständigkeits-
   anzeige im Kopf schon sagt -, und der Balken legt sich als 2-px-Linie
   an den unteren Rand. */
html[data-dp-layout] .hdr-v61-row2 .sc-pill{
  flex:1 1 0 !important; min-width:0 !important; height:auto !important;
  min-height:0 !important; margin:0 !important; position:relative !important;
  display:grid !important; grid-template-columns:auto 1fr !important;
  align-items:baseline !important; gap:0 8px !important;
  padding:6px 12px 8px !important;
  border:0 !important; border-right:1px solid var(--dpl-linie) !important;
  border-radius:0 !important; background:transparent !important; box-shadow:none !important;
}
html[data-dp-layout] .hdr-v61-row2 .sc-pill:last-child{ border-right:0 !important; }
html[data-dp-layout] .hdr-v61-row2 .sc-pill-l{
  font-size:9px !important; letter-spacing:.1em !important; margin:0 !important;
  color:var(--dpl-sehr-leise) !important;
}
html[data-dp-layout] .hdr-v61-row2 .sc-pill-v{
  font-size:15px !important; line-height:1.15 !important; margin:0 !important;
  text-align:right !important;
}
html[data-dp-layout] .hdr-v61-row2 .sc-pill-sub{ display:none !important; }
html[data-dp-layout] .hdr-v61-row2 .sc-bar{
  position:absolute !important; left:12px; right:12px; bottom:3px;
  height:2px !important; margin:0 !important; grid-column:1 / -1;
}

/* Der kleine Score im Kopf - er ist da, er war nur leer. */
html[data-dp-layout] #hdr-score-mini{
  display:inline-flex !important; align-items:center; gap:6px;
  padding:3px 10px !important; margin-left:10px;
  border:1px solid var(--dpl-linie-stark) !important; border-radius:2px !important;
  background:var(--dpl-flaeche) !important; cursor:pointer; white-space:nowrap;
  font-family:'JetBrains Mono', ui-monospace, monospace; font-size:11px; font-weight:700;
  color:var(--dpl-tinte) !important;
}
html[data-dp-layout] #hdr-score-mini::before{
  content:'SCORE'; font-size:8.5px; letter-spacing:.11em; font-weight:500;
  color:var(--dpl-sehr-leise);
}

/* Die Reiter: Haarlinie statt Fläche, Gold nur als Kante. */
html[data-dp-layout] nav.tabs{
  background:var(--dpl-flaeche) !important;
  border-bottom:1px solid var(--dpl-linie) !important;
  box-shadow:none !important;
}
html[data-dp-layout] nav.tabs .tab{
  background:transparent !important; border:0 !important; border-radius:0 !important;
  box-shadow:none !important; color:var(--dpl-leise) !important;
  border-bottom:2px solid transparent !important;
}
html[data-dp-layout] nav.tabs .tab.active{
  color:var(--dpl-tinte) !important; font-weight:600 !important;
  border-bottom-color:var(--dpl-gold) !important; background:transparent !important;
}

/* ═══ 2 · DIE SCHIENE ═══════════════════════════════════════════════ */
html[data-dp-layout] .dpl-schiene{
  background:var(--dpl-grau);
  border-right:1px solid var(--dpl-linie);
  display:flex; flex-direction:column; min-width:0;
  font-family:'Inter', system-ui, sans-serif;
}
html[data-dp-layout] .dpl-schiene[data-stellung="links"],
html[data-dp-layout] .dpl-schiene[data-stellung="rechts"]{
  position:fixed; top:0; bottom:0; width:var(--dpl-schiene-b);
  z-index:60; overflow:auto;
}
html[data-dp-layout] .dpl-schiene[data-stellung="links"]{ left:0; }
html[data-dp-layout] .dpl-schiene[data-stellung="rechts"]{ right:0; left:auto;
  border-right:0; border-left:1px solid var(--dpl-linie); }

.dpl-marke{ height:46px; flex:0 0 auto; display:flex; align-items:center;
  padding:0 14px; border-bottom:1px solid var(--dpl-linie);
  background:var(--dpl-flaeche); }
.dpl-wm{ font-family:'Space Grotesk', system-ui, sans-serif; font-weight:700;
  font-size:15px; letter-spacing:-.02em; color:var(--dpl-tinte); }
.dpl-wm i{ font-style:normal; color:var(--dpl-gold-lo); }

.dpl-portfolio{ display:flex; align-items:center; gap:9px; width:calc(100% - 16px);
  margin:10px 8px 4px; padding:7px 10px; border:1px solid var(--dpl-linie-stark);
  background:var(--dpl-flaeche); border-radius:2px; cursor:pointer;
  font-size:12.5px; color:var(--dpl-tinte); font-family:inherit; }
.dpl-portfolio:hover{ border-color:var(--dpl-gold-lo); }
.dpl-portfolio .dpl-i{ color:var(--dpl-gold-lo); }
.dpl-portfolio .dpl-n{ margin-left:auto; font-family:'JetBrains Mono', monospace;
  font-size:10.5px; color:var(--dpl-sehr-leise); }

.dpl-teil{ min-width:0; }
.dpl-teil-tabs{ padding:6px 8px; }
.dpl-teil-aktionen{ padding:4px 8px 8px; }
.dpl-teil-nutzer{ margin-top:auto; border-top:1px solid var(--dpl-linie);
  background:var(--dpl-flaeche); }

/* Die Reiter senkrecht - nur in der Schiene, nicht global. */
.dpl-teil-tabs nav.tabs{
  display:flex !important; flex-direction:column !important;
  background:transparent !important; border:0 !important; padding:0 !important;
  overflow:visible !important; height:auto !important;
}
.dpl-teil-tabs nav.tabs .tab{
  justify-content:flex-start !important; text-align:left !important;
  width:100% !important; padding:6px 10px !important; margin:0 0 1px !important;
  border-bottom:0 !important; border-left:2px solid transparent !important;
  border-radius:2px !important; font-size:12.5px !important;
}
.dpl-teil-tabs nav.tabs .tab.active{
  background:var(--dpl-flaeche) !important;
  border-left-color:var(--dpl-gold) !important;
  border-bottom-color:transparent !important;
}

/* Die Aktionen: in der Schiene immer offen - ein Menü, das man erst
   aufklappen muss, ist in einer 208-px-Spalte kein Gewinn. */
.dpl-teil-aktionen #sb-actions-accordion{
  display:block !important; height:auto !important; max-height:none !important;
  overflow:visible !important; opacity:1 !important; visibility:visible !important;
  padding:0 !important; margin:0 !important;
}
.dpl-teil-aktionen #sb-actions-trigger-btn{ display:none !important; }
.dpl-teil-nutzer #sb-user{ margin:0 !important; border:0 !important; }


/* GEMESSEN: der Aktionsblock hat einen INNEREN Behaelter
   (.sb-actions-accordion-inner). Die Zeilenregel am aeusseren Knoten
   bewirkte nichts - der innere blieb eine Spalte, und die Leiste war
   144 statt 48 px hoch. Eine Regel am Elternteil ordnet nicht, was im
   Kind steht. */
html[data-dp-layout] .dpl-schiene[data-stellung="leiste"] .sb-actions-accordion-inner,
html[data-dp-layout] .dpl-schiene[data-stellung="fuss"] .sb-actions-accordion-inner{
  display:flex !important; flex-direction:row !important; align-items:center;
  gap:6px !important; width:auto !important; height:auto !important;
  padding:0 !important; margin:0 !important; flex-wrap:nowrap;
}
html[data-dp-layout] .dpl-schiene[data-stellung="leiste"] .sb-actions-accordion-inner > *,
html[data-dp-layout] .dpl-schiene[data-stellung="fuss"] .sb-actions-accordion-inner > *{
  flex:0 0 auto !important; width:auto !important; margin:0 !important;
  white-space:nowrap;
}
/* In der senkrechten Schiene bleibt der innere Behaelter eine Spalte,
   nur ohne eigene Breite - 208 px sind knapp. */
.dpl-teil-aktionen .sb-actions-accordion-inner{
  width:auto !important; padding:0 !important; margin:0 !important;
}
/* ═══ 3 · DIE OBJEKTSPALTE ALS SCHUBLADE ════════════════════════════
   GEMESSEN am 26.09.2026, und es war nicht das, was ich erwartet hatte:
   **`.app-wrap` ist ein GRID**, nicht flex - `grid-template-columns:
   380px 1118px`. Nimmt man die Objektspalte mit `position:fixed` aus dem
   Fluss, verschwindet sie NICHT aus dem Gitter-Raster: die Hauptspalte
   rutscht in die erste Spur und war 380 px breit statt 1499.

   > Eine Spur bleibt stehen, auch wenn ihr Kind sie verlässt. Das Raster
   > gehört dem Elternteil, nicht dem Kind.

   Deshalb wird hier ausdrücklich auf EINE Spur gestellt. */
html[data-dp-layout="v1"] .app-wrap,
html[data-dp-layout="v3"] .app-wrap,
html[data-dp-layout="v4"] .app-wrap{
  grid-template-columns:1fr !important;
}
html[data-dp-layout="v2"] .app-wrap{ grid-template-columns:264px 1fr !important; }
html[data-dp-layout="v5"] .app-wrap{ grid-template-columns:276px 1fr !important; }

html[data-dp-layout="v1"] #sidebar,
html[data-dp-layout="v3"] #sidebar,
html[data-dp-layout="v4"] #sidebar{
  position:fixed !important; top:0; bottom:0; left:0 !important; z-index:70;
  width:360px !important; max-width:88vw;
  /* Zweiter Messbefund: `translateX(-102%)` schiebt um die EIGENE
     Breite. Mit `left:208px` blieben 159 px sichtbar stehen - eine
     Schublade, die halb offen klemmt. Jetzt links bündig und ganz weg.

     > DAS `!important` HIER IST EIN DENKMAL AN EINE FALSCHE DIAGNOSE.
     > Ich hielt die Regel für überstimmt, weil `getComputedStyle` die
     > Einheitsmatrix zurückgab - auch bei INLINE gesetztem Wert. Der
     > Kaskaden-Walker fand aber keinen Überstimmer, und mit
     > `transition:none` sass der Wert sofort bei -367 px.
     >
     > **Der Tab lief im Hintergrund.** In einem versteckten Tab friert
     > Chrome jeden CSS-Übergang beim STARTWERT ein - die Messung zeigte
     > also nicht den Zielzustand, sondern den ersten Einzelbild eines
     > Übergangs, der nie weiterlief. `visibilityState` gehört vor jede
     > Messung an einer Animation.
     >
     > Das `!important` bleibt stehen, weil es nicht schadet und in
     > dieser Datei ohnehin die Hausordnung ist - aber es löst nicht das
     > Problem, für das ich es gesetzt habe. */
  transform:translateX(-102%) !important; transition:transform .18s ease;
  box-shadow:0 0 40px -12px rgba(0,0,0,.45);
}

html[data-dpl-portfolio="auf"] #sidebar{ transform:translateX(0) !important; }
html[data-dpl-portfolio="auf"]::after{
  content:''; position:fixed; inset:0; z-index:65; background:rgba(20,18,15,.34);
}

/* ═══ 4 · DIE FÜNF ══════════════════════════════════════════════════ */

/* ── v1 · AKTENMAPPE ─────────────────────────────────────────────────
   Schiene links: Reiter als Gliederung, darunter Aktionen, unten Nutzer.
   Die Objektspalte wird zur Schublade. */
html[data-dp-layout="v1"] .app-wrap{ padding-left:var(--dpl-schiene-b) !important; }

/* ── v2 · KANZLEI ────────────────────────────────────────────────────
   Objektspalte bleibt stehen und wird dunkel; die Aktionen ziehen nach
   RECHTS, neben das Objekt, auf das sie sich beziehen. */
html[data-dp-layout="v2"] .app-wrap{ padding-right:var(--dpl-schiene-b) !important; }
html[data-dp-layout="v2"] #sidebar{ width:auto !important; }
html[data-dp-layout="v2"] .dpl-schiene[data-stellung="rechts"] .dpl-marke{ display:none; }

/* ── v3 · WERKBANK ───────────────────────────────────────────────────
   Keine Seitenspalte. Die Aktionsleiste kommt auf den Hauptbildschirm,
   direkt über den Inhalt, auf den sie sich bezieht. */
html[data-dp-layout="v3"] .main-col > *{ order:0; }
html[data-dp-layout="v3"] header.hdr{ order:-3; }
html[data-dp-layout="v3"] nav.tabs{ order:-2; }
html[data-dp-layout="v3"] .dpl-schiene[data-stellung="leiste"]{ order:-1; }
html[data-dp-layout] .dpl-schiene[data-stellung="leiste"]{
  flex:0 0 auto; flex-direction:row; align-items:center; gap:8px;
  padding:7px 16px; background:#FBF6E9;
  border-right:0; border-bottom:1px solid var(--dpl-linie-stark); overflow-x:auto;
}
html[data-dp-layout] .dpl-schiene[data-stellung="leiste"] .dpl-portfolio{ margin:0; width:auto; flex:0 0 auto; }
html[data-dp-layout] .dpl-schiene[data-stellung="leiste"] .dpl-teil{ padding:0; }
html[data-dp-layout] .dpl-schiene[data-stellung="leiste"] .dpl-teil-nutzer{ margin-left:auto; margin-top:0;
  border-top:0; background:transparent; }
html[data-dp-layout] .dpl-schiene[data-stellung="leiste"] #sb-actions-accordion{
  display:flex !important; flex-direction:row !important; gap:6px;
  height:auto !important; max-height:none !important; overflow:visible !important;
  opacity:1 !important; visibility:visible !important; white-space:nowrap;
}
html[data-dp-layout] .dpl-schiene[data-stellung="leiste"] #sb-actions-trigger-btn{ display:none !important; }

/* ── v4 · DOSSIER ────────────────────────────────────────────────────
   Die Anwendung sieht aus wie das Dokument, das am Ende herauskommt:
   mittige Blattspalte auf grauem Grund, Aktionen in der Fussleiste. */
html[data-dp-layout="v4"] .main-col{ background:#EDEAE3 !important; }
html[data-dp-layout="v4"] header.hdr,
html[data-dp-layout="v4"] nav.tabs,
html[data-dp-layout="v4"] .body{
  max-width:1080px; margin-left:auto !important; margin-right:auto !important;
  width:100% !important;
}
html[data-dp-layout="v4"] .body{
  background:var(--dpl-papier) !important;
  border-left:1px solid var(--dpl-linie); border-right:1px solid var(--dpl-linie);
}
html[data-dp-layout="v4"] header.hdr{
  background:var(--dpl-papier) !important;
  border-left:1px solid var(--dpl-linie); border-right:1px solid var(--dpl-linie);
}
html[data-dp-layout="v4"] .main-col > *{ order:0; }
html[data-dp-layout="v4"] header.hdr{ order:-3; }
html[data-dp-layout="v4"] nav.tabs{ order:-2; }
html[data-dp-layout="v4"] .dpl-schiene[data-stellung="fuss"]{ order:999; }
html[data-dp-layout] .dpl-schiene[data-stellung="fuss"]{
  position:sticky; bottom:0; z-index:40;
  flex:0 0 auto; flex-direction:row; align-items:center; gap:8px;
  padding:7px 20px; background:var(--dpl-flaeche);
  border-right:0; border-top:1px solid var(--dpl-linie-stark); overflow-x:auto;
}
html[data-dp-layout] .dpl-schiene[data-stellung="fuss"] .dpl-portfolio{ margin:0; width:auto; flex:0 0 auto; }
html[data-dp-layout] .dpl-schiene[data-stellung="fuss"] .dpl-teil{ padding:0; }
html[data-dp-layout] .dpl-schiene[data-stellung="fuss"] .dpl-teil-nutzer{ margin-left:auto; margin-top:0;
  border-top:0; background:transparent; }
html[data-dp-layout] .dpl-schiene[data-stellung="fuss"] #sb-actions-accordion{
  display:flex !important; flex-direction:row !important; gap:6px;
  height:auto !important; max-height:none !important; overflow:visible !important;
  opacity:1 !important; visibility:visible !important; white-space:nowrap;
}
html[data-dp-layout] .dpl-schiene[data-stellung="fuss"] #sb-actions-trigger-btn{ display:none !important; }

/* ── v5 · COCKPIT HELL ───────────────────────────────────────────────
   Die heutige Struktur, nur entschlackt: Objektspalte von 380 auf 276,
   Kopf von 189 auf rund 95. Kein Umlernen. */
html[data-dp-layout="v5"] #sidebar{ width:auto !important; }
html[data-dp-layout="v5"] .sb-header{ padding:8px 12px !important; }
html[data-dp-layout="v5"] .sb-header .app-logo-simple-wrap{ max-height:40px !important; }

/* ═══ 5 · DER UMSCHALTER ════════════════════════════════════════════ */
.dpl-schalter{
  position:fixed; left:12px; bottom:12px; z-index:2147483000;
  display:flex; align-items:center; gap:4px; flex-wrap:wrap; max-width:min(96vw,760px);
  background:rgba(253,252,250,.97); border:1px solid #CEC6B6; border-radius:3px;
  padding:6px 8px; box-shadow:0 8px 26px -14px rgba(0,0,0,.6);
  font-family:'JetBrains Mono', ui-monospace, monospace;
}
.dpl-schalter-k{ font-size:9px; letter-spacing:.12em; text-transform:uppercase;
  color:#9A9287; padding-right:4px; }
.dpl-schalter button{
  font-family:inherit; font-size:10.5px; letter-spacing:.05em;
  padding:5px 9px; border:1px solid #CEC6B6; background:#fff; color:#6B645A;
  cursor:pointer; border-radius:2px; }
.dpl-schalter button:hover{ border-color:var(--wl-b8932f, #b8932f); color:#1A1A18; }
.dpl-schalter button[aria-pressed="true"]{ background:#141310; color:#F2EDE3;
  border-color:#141310; }
.dpl-schalter-zu{ margin-left:2px; }

@media (max-width:900px){
  html[data-dp-layout="v1"] .app-wrap{ padding-left:0 !important; }
  html[data-dp-layout="v2"] .app-wrap{ padding-right:0 !important; }
  .dpl-schiene[data-stellung="links"],
  .dpl-schiene[data-stellung="rechts"]{ position:static; width:auto; }
}

/* ═══ 6 · DIE FASSUNGSWAHL VOR DEM EXPORT (v1636) ═══════════════════
   Gehört inhaltlich zu js/pdf-wahl.js, steht aber hier, weil sie
   dieselbe helle Formensprache trägt und sonst eine dritte winzige
   CSS-Datei entstünde. */
.dpw-ov{ position:fixed; inset:0; z-index:2147482000; display:grid; place-items:center;
  background:rgba(18,16,14,.46); padding:20px; }
.dpw-kasten{ width:min(560px,100%); background:#FDFCFA; border:1px solid #CEC6B6;
  border-radius:3px; box-shadow:0 26px 70px -30px rgba(0,0,0,.7); padding:18px 20px 16px;
  font-family:'Inter', system-ui, sans-serif; color:#1A1A18; }
.dpw-kopf{ display:flex; align-items:center; justify-content:space-between; margin-bottom:4px; }
.dpw-kopf b{ font-family:'Space Grotesk', system-ui, sans-serif; font-size:17px; }
.dpw-zu{ border:0; background:transparent; font-size:20px; line-height:1; cursor:pointer;
  color:#9A9287; padding:2px 6px; }
.dpw-zu:hover{ color:#1A1A18; }
.dpw-vor{ margin:0 0 14px; font-size:13px; color:#6B645A; }
.dpw-liste{ display:grid; gap:8px; }
.dpw-k{ display:flex; align-items:center; gap:13px; width:100%; text-align:left;
  padding:11px 13px; border:1px solid #E6E1D6; background:#fff; border-radius:2px;
  cursor:pointer; font-family:inherit; }
.dpw-k:hover{ border-color:var(--wl-b8932f, #b8932f); }
.dpw-k.dpw-an{ border-color:var(--wl-c9a84c, #C9A84C); box-shadow:inset 3px 0 0 var(--wl-c9a84c, #C9A84C); }
.dpw-probe{ width:34px; height:44px; flex:0 0 auto; border:1px solid #CEC6B6; border-radius:1px; }
.dpw-probe-hell{ background:linear-gradient(#fff 0 38%, #F4F2ED 38% 100%);
  border-top:3px solid var(--wl-c9a84c, #C9A84C); }
.dpw-probe-dunkel{ background:linear-gradient(#0A0A09 0 38%, #fff 38% 100%);
  border-top:3px solid var(--wl-c9a84c, #C9A84C); }
.dpw-tx{ min-width:0; }
.dpw-tx b{ display:block; font-size:13.5px; font-weight:600; }
.dpw-u{ display:block; font-size:12px; color:#6B645A; margin-top:1px; }
.dpw-f{ display:block; font-family:'JetBrains Mono', ui-monospace, monospace;
  font-size:9px; letter-spacing:.09em; text-transform:uppercase; color:#9A9287; margin-top:4px; }
.dpw-merk{ display:flex; align-items:center; gap:7px; margin-top:14px; font-size:12.5px;
  color:#6B645A; cursor:pointer; }
.dpw-merk input{ width:14px; height:14px; }
.dpw-merk span{ color:#9A9287; }

/* Gruppenüberschriften ("PORTFOLIO", "WERKZEUGE") ordnen eine SPALTE.
   In einer waagerechten Leiste stehen sie zwischen den Knöpfen und
   machen sie 95 px hoch, ohne etwas zu ordnen. Statt ihrer ein
   Trennstrich - dieselbe Gliederung, ein Zehntel des Platzes. */
html[data-dp-layout] .dpl-schiene[data-stellung="leiste"] .sb-act-section-title,
html[data-dp-layout] .dpl-schiene[data-stellung="fuss"] .sb-act-section-title{
  width:1px !important; min-width:1px !important; height:20px !important;
  padding:0 !important; margin:0 4px !important; overflow:hidden !important;
  text-indent:-999px !important; background:#CEC6B6 !important;
  border:0 !important; border-radius:0 !important; align-self:center !important;
}
html[data-dp-layout] .dpl-schiene[data-stellung="leiste"] .sb-act-section-title:first-child,
html[data-dp-layout] .dpl-schiene[data-stellung="fuss"] .sb-act-section-title:first-child{
  display:none !important;
}
html[data-dp-layout] .dpl-schiene[data-stellung="leiste"] .sb-act-item,
html[data-dp-layout] .dpl-schiene[data-stellung="fuss"] .sb-act-item{
  padding:6px 10px !important; font-size:12px !important;
}

/* Das Mandantenlogo in der Schiene: proportional, nie verzerrt, und
   nie hoeher als die Markenleiste. */
html[data-dp-layout] .dpl-logo{
  max-width:100%; max-height:28px; width:auto; height:auto; display:block;
}

/* ═══ 7 · ERSTSTART (v1638) ═════════════════════════════════════════
   Obsidian und Gold, weil es der erste Eindruck ist - die Marke zeigt
   sich einmal ganz, bevor der Nutzer sie hell schaltet. */
.dpes-ov{ position:fixed; inset:0; z-index:2147482500; display:grid; place-items:center;
  background:rgba(8,7,6,.62); padding:20px; }
.dpes-k{ width:min(620px,100%); background:#0A0A09; color:#F2EDE3;
  border:1px solid #2A2622; border-radius:4px; padding:20px 24px 20px;
  box-shadow:0 30px 80px -34px rgba(0,0,0,.9);
  font-family:'Inter', system-ui, sans-serif; }
.dpes-kopf{ display:flex; align-items:center; justify-content:space-between; }
.dpes-marke{ display:flex; align-items:center; gap:10px; }
.dpes-wm{ font-family:'Space Grotesk', system-ui, sans-serif; font-weight:700;
  font-size:17px; letter-spacing:-.02em; }
.dpes-wm i{ font-style:normal; color:var(--wl-c9a84c, #C9A84C); }
.dpes-bp{ font-family:'JetBrains Mono', ui-monospace, monospace; font-size:8.5px;
  letter-spacing:.16em; text-transform:uppercase; color:#8C8479;
  border:1px solid #2A2622; padding:2px 7px; border-radius:1px; }
.dpes-x{ border:0; background:transparent; color:#8C8479; font-size:22px; line-height:1;
  cursor:pointer; padding:0 4px; }
.dpes-x:hover{ color:#F2EDE3; }
.dpes-k h2{ font-family:'Space Grotesk', system-ui, sans-serif; font-size:24px;
  margin:16px 0 6px; letter-spacing:-.02em; }
.dpes-vor{ margin:0 0 16px; font-size:14px; color:#BFB7A9; line-height:1.6; }
.dpes-vor b{ color:#F5EFE2; } .dpes-vor i{ font-style:italic; color:#F5EFE2; }
.dpes-liste{ border:1px solid #201D1A; border-radius:3px; overflow:hidden; }
.dpes-z{ display:flex; align-items:center; gap:12px; padding:9px 13px;
  border-bottom:1px solid #1A1815; background:#0E0D0B; }
.dpes-z:last-child{ border-bottom:0; }
.dpes-i{ width:20px; text-align:center; color:var(--wl-c9a84c, #C9A84C); font-size:12px; flex:0 0 auto; }
.dpes-t{ flex:1; min-width:0; line-height:1.3; }
.dpes-t b{ display:block; font-size:13px; font-weight:600; }
.dpes-t small{ display:block; font-size:11px; color:#8C8479; }
.dpes-v{ font-family:'JetBrains Mono', ui-monospace, monospace; font-size:14px;
  font-weight:700; color:#F5EFE2; font-variant-numeric:tabular-nums; flex:0 0 auto; }
.dpes-fuss{ margin:11px 0 0; font-size:12px; color:#8C8479; }
.dpes-knoepfe{ display:flex; gap:8px; margin-top:16px; flex-wrap:wrap; }
.dpes-b{ font-family:inherit; font-size:13px; padding:9px 15px; border-radius:2px;
  border:1px solid #2A2622; background:transparent; color:#E9E3D6; cursor:pointer; }
.dpes-b:hover{ border-color:var(--wl-b8932f, #b8932f); }
.dpes-haupt{ background:linear-gradient(110deg, var(--wl-e8cc7a, #E8CC7A),
  var(--wl-c9a84c, #C9A84C) 55%, var(--wl-b8932f, #b8932f));
  color:#141210; border-color:transparent; font-weight:600; }
.dpes-leise{ margin-left:auto; color:#8C8479; border-color:transparent; }