/* ============================================================
   ssr-konsole.css — HAUSSCHALE der SSR Projekt-Konsole.
   hausschale-quelle

   1:1 herausgeloest aus der Hillebrand-Konsole (index.html, Stand
   2026-08-13, Zeilen 12-898). NICHTS neu erfunden: dieselben Token,
   dieselbe Schale (rail + topbar + content), dieselben Bauteile
   (card, kpis, profi, badge, tl, donut, bar, tbl, dropup, credits).
   Wer eine neue SSR-Konsole braucht, laedt DIESE Datei — er baut
   keine zweite Schale daneben.
   ============================================================ */
:root{
  --lime:#CFDD28;--lime-strong:#BCCB1C;--on-lime:#26282C;
  --bg:#0D0E0F;--surface:#17181B;--surface-2:#1E1F23;--surface-3:#232428;
  --ink:#F1F1EE;--ink-soft:#ABADB3;--ink-faint:#9598A0;
  --line:#282A2E;--line-strong:#3A3C41;
  --accent-ink:#CFDD28;
  --rail:#111214;--rail-ink:#F4F4F1;--rail-ink-soft:#a8aaa7;--rail-panel:#242629;
  --rail-line:rgba(255,255,255,.09);--rail-active:rgba(207,221,40,.16);
  --good:#31B87E;--good-bg:rgba(49,184,126,.14);
  --warn:#D6A04A;--warn-bg:rgba(214,160,74,.15);
  --bad:#E4694E;--bad-bg:rgba(228,105,78,.14);
  --info:#5C93D6;--info-bg:rgba(92,147,214,.15);
  --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 30px rgba(0,0,0,.35);
  --r:14px;--r-sm:10px;--r-lg:20px;--railw:280px;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,system-ui,sans-serif;
  --disp:'Inter Tight','Inter',system-ui,sans-serif;
}
:root[data-theme="light"]{
  --bg:#F1F2EC;--surface:#FFFFFF;--surface-2:#F7F8F1;--surface-3:#ECEEE4;
  --ink:#191B1D;--ink-soft:#494C52;--ink-faint:#6B6E76;
  --line:#E3E5DC;--line-strong:#CFD1C7;
  --accent-ink:#5C6A00;
  --good:#1F9D67;--good-bg:rgba(31,157,103,.12);
  --warn:#B27A24;--warn-bg:rgba(178,122,36,.14);
  --bad:#C9482E;--bad-bg:rgba(201,72,46,.12);
  --info:#3A6FB0;--info-bg:rgba(58,111,176,.12);
  --shadow:0 1px 2px rgba(20,22,18,.05),0 8px 26px rgba(20,22,18,.07);
  --rail:#FFFFFF;--rail-ink:#191B1D;--rail-ink-soft:#5B5E66;--rail-panel:#ECEEE4;
  --rail-line:rgba(20,22,18,.09);--rail-active:rgba(207,221,40,.30);
}
*{margin:0;padding:0;box-sizing:border-box}
/* Scroll-Design: Balken nie sichtbar, Scrollen bleibt aktiv (Kunden- + Admin-Ansichten) */
*{scrollbar-width:none;-ms-overflow-style:none}
*::-webkit-scrollbar{width:0;height:0;display:none}
html,body{scrollbar-width:none;-ms-overflow-style:none}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:14.5px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.num{font-variant-numeric:tabular-nums}
svg.i{width:17px;height:17px;flex:0 0 auto;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;display:block}

.app{display:grid;grid-template-columns:var(--railw) 1fr;min-height:100vh}
/* Navigation eingefahren (Klick auf Logo) */
.app.railmin{grid-template-columns:70px 1fr}
.app.railmin .rail{padding:22px 10px;align-items:center}
.app.railmin .logo{padding:2px 0 16px;justify-content:center}
.app.railmin .logo-img{height:24px}
.app.railmin .logo-cap,.app.railmin .rail-label,.app.railmin .nav-item .lbl,.app.railmin .nav-item .nav-cnt,.app.railmin .nav-dot,.app.railmin .rail-foot>div:not(.avatar):not(.dropup),.app.railmin .rf-caret{display:none}
.app.railmin .nav-item{justify-content:center;padding:.6rem;width:44px}
.app.railmin .rail-foot{justify-content:center;padding-left:0}
.app.railmin .dropup{left:12px}
.rail{background:var(--rail);padding:22px 14px;display:flex;flex-direction:column;gap:2px;position:sticky;top:0;height:100vh;overflow-y:auto;transition:padding .18s}
.logo{cursor:pointer}
.logo:hover{opacity:.85}
.main{min-width:0}
.topbar{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--bg) 85%,transparent);backdrop-filter:blur(10px)}
.topbar-inner{max-width:1260px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 32px}
.content{max-width:1260px;margin:0 auto;padding:34px 32px 80px}

.logo{display:flex;align-items:center;gap:11px;padding:2px 10px 16px}
.logo-mark{font-family:var(--disp);font-weight:900;font-size:20px;letter-spacing:-.5px;background:var(--lime);color:var(--on-lime);border-radius:8px;padding:3px 8px}
.logo-name{font-family:var(--disp);font-weight:800;font-size:16.5px;letter-spacing:-.3px;color:var(--rail-ink)}
.logo-sub{font-size:11px;color:var(--rail-ink-soft);margin-top:1px}
/* Navigation — 1:1 an SSR Zahlungs-Cockpit angeglichen (Schrift/Button/Hover/Farbe/Größe) */
.rail-label{font-size:.65rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--rail-ink-soft);padding:.42rem .6rem;margin-top:.5rem}
.nav-item{display:flex;align-items:center;gap:.75rem;padding:.58rem .72rem;border-radius:11px;color:var(--rail-ink-soft);font-weight:600;font-size:.87rem;cursor:pointer;white-space:nowrap;position:relative;transition:background .18s,color .18s}
.nav-item svg.i{width:19px;height:19px;stroke-width:1.9}
.nav-item:hover{color:var(--rail-ink);background:var(--rail-panel)}
.nav-item.active{background:var(--rail-panel);color:var(--rail-ink)}
.nav-item.active svg.i{stroke:var(--lime)}
.nav-item .lbl{overflow:hidden;text-overflow:ellipsis}
.nav-dot{margin-left:auto;width:8px;height:8px;border-radius:99px;flex:0 0 auto}
.nav-cnt{margin-left:auto;font-size:10.5px;font-weight:700;background:var(--rail-panel);color:var(--rail-ink-soft);border-radius:99px;padding:1px 8px;flex:0 0 auto}
.rail-foot{margin-top:auto;padding-top:30px;margin-top:auto;display:flex;gap:10px;align-items:center;padding-left:10px}
.avatar{width:32px;height:32px;border-radius:8px;background:var(--surface-3);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;color:var(--rail-ink)}
.rail-foot b{display:block;font-size:13px;color:var(--rail-ink);font-weight:600}
.rail-foot span{font-size:11.5px;color:var(--rail-ink-soft)}

.tb-title{font-family:var(--disp);font-weight:800;font-size:16.5px;letter-spacing:-.2px}
.tb-sub{font-size:12.5px;color:var(--ink-faint)}
.tb-right{display:flex;gap:8px;align-items:center}
.pill{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line-strong);background:var(--surface);border-radius:99px;padding:7px 14px;font-size:12.5px;font-weight:600;color:var(--ink-soft);white-space:nowrap}
.seg-ctrl{display:inline-flex;border:1px solid var(--line-strong);background:var(--surface);border-radius:99px;padding:2px;gap:2px}
.seg-ctrl button{border:none;background:transparent;color:var(--ink-faint);font-family:var(--sans);font-size:12px;font-weight:700;padding:5px 11px;border-radius:99px;cursor:pointer}
.seg-ctrl button.on{background:var(--lime);color:var(--on-lime)}
/* Einzeilig auch bei 360 px (R12): die Gruppe bricht, die Schaltflaeche nie.
   Fokusring messbar (R68): 2 px, Akzentfarbe, mit Abstand zum Grund. */
.seg-ctrl{flex-wrap:wrap}
.seg-ctrl button{white-space:nowrap}
.seg-ctrl button:focus-visible{outline:2px solid var(--accent-ink);outline-offset:2px}
.seg-ctrl button.on:focus-visible,:root[data-theme="light"] .seg-ctrl button.on:focus-visible{outline-color:var(--on-lime)}

.statusline{display:flex;align-items:center;gap:9px;font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:14px}
.dot{width:9px;height:9px;border-radius:99px;background:var(--good);box-shadow:0 0 0 4px var(--good-bg);flex:0 0 auto}
.dot.warn{background:var(--warn);box-shadow:0 0 0 4px var(--warn-bg)}
.dot.bad{background:var(--bad);box-shadow:0 0 0 4px var(--bad-bg)}
h1.hero{font-family:var(--disp);font-weight:900;font-size:clamp(30px,3.4vw,42px);letter-spacing:-.03em;line-height:1.03;margin-bottom:10px}
.lede{color:var(--ink-soft);font-size:15px}
.lede b{color:var(--ink);font-weight:600}
.backlink{display:inline-flex;align-items:center;gap:7px;color:var(--ink-faint);font-size:13px;font-weight:600;margin-bottom:16px;cursor:pointer}
.backlink:hover{color:var(--ink)}
.tagrow{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.tag{font-size:12px;font-weight:600;border:1px solid var(--line-strong);border-radius:99px;padding:5px 12px;color:var(--ink-soft);background:var(--surface);white-space:nowrap}
.tag.lime{background:var(--lime);border-color:var(--lime);color:var(--on-lime);font-weight:700}

.grid-kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:14px;margin:26px 0}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:17px 19px;box-shadow:var(--shadow)}
.kpi-head{display:flex;align-items:center;gap:10px;color:var(--ink-soft);font-size:12.5px;font-weight:600;white-space:nowrap}
.kpi-ico{width:29px;height:29px;border-radius:9px;background:var(--surface-3);display:flex;align-items:center;justify-content:center;color:var(--ink-soft)}
.kpi-val{font-family:var(--disp);font-weight:800;font-size:29px;letter-spacing:-.02em;margin:9px 0 7px;white-space:nowrap}
.kpi-val small{font-size:15px;color:var(--ink-faint);font-weight:700}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;border-radius:99px;padding:3.5px 10px;white-space:nowrap}
.chip.good{background:var(--good-bg);color:var(--good)}
.chip.warn{background:var(--warn-bg);color:var(--warn)}
.chip.bad{background:var(--bad-bg);color:var(--bad)}
.chip.info{background:var(--info-bg);color:var(--info)}
.chip.lime{background:var(--lime);color:var(--on-lime)}
.chip.mut{background:var(--surface-3);color:var(--ink-soft)}

/* Provenance-Badge (PROFI) */
.prov{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;border-radius:99px;padding:2px 7px}
.prov::before{content:"";width:5px;height:5px;border-radius:99px;background:currentColor}
.prov.gemessen{background:var(--good-bg);color:var(--good)}
.prov.berechnet{background:var(--info-bg);color:var(--info)}
.prov.annahme{background:var(--warn-bg);color:var(--warn)}
.prov.ziel{background:var(--surface-3);color:var(--ink-faint)}
.prov.referenz{background:var(--surface-3);color:var(--ink-faint)}
/* KONTRAST-NACHZUG 2026-08-17 (R5, P0). Am gerenderten Stand gemessen, nicht geschaetzt:
   die Herkunftsmarke traegt im HELLEN Thema 10 px fett und kam damit auf 2,84:1
   (gemessen), 4,13:1 (berechnet) und 4,34:1 (Zielwert/Referenz) — verlangt sind 4,5:1.
   Nur die Marke wird nachgezogen, nicht die globalen Zustandsfarben: eine Aenderung an
   --good/--info/--warn haette Kacheln, Punkte und Chips im ganzen Haus mitverschoben. */
:root[data-theme="light"] .prov.gemessen{color:#16764B}
:root[data-theme="light"] .prov.berechnet{color:#2A578C}
:root[data-theme="light"] .prov.annahme{color:#7A4F0D}
:root[data-theme="light"] .prov.ziel,
:root[data-theme="light"] .prov.referenz{color:#4E5158}
/* Dieselbe Messung im DUNKLEN Thema: die Marke „berechnet" lag bei 4,16:1. */
:root[data-theme="dark"] .prov.berechnet{color:#8FB8EA}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .prov.berechnet{color:#8FB8EA}}
/* Zaehlerpille der Gruppenkoepfe: 11 px fett auf getoenter Flaeche, gemessen 4,35:1. */
:root[data-theme="light"] .dg-count{color:#4E5158}

/* FOKUS-INDIKATOR (R68). Ohne eigene Angabe verlassen sich alle Bedienstationen auf
   den Standardring der Anzeigemaschine — dessen Staerke und Farbe sind nicht
   berechenbar und damit nicht belegbar. Hier steht ein eigener, messbarer Ring. */
:where(a,button,[tabindex],input,select,textarea,summary):focus-visible{
  outline:2px solid var(--accent-ink);outline-offset:2px;border-radius:6px}
:root[data-theme="light"] :where(a,button,[tabindex],input,select,textarea,summary):focus-visible{
  outline-color:#3A4A00}
/* Auf einer Lime-Flaeche ist ein Lime-Ring unsichtbar — gemessen 1,00:1 am
   Beauftragen-/PDF-Knopf. Dort traegt der dunkle Gegenton. */
.btn-cta:focus-visible,.btn-lime:focus-visible,.cc-btn:focus-visible,.tu-buy:focus-visible{
  outline-color:var(--on-lime)}

/* ============================================================
   ZUSAETZE 2026-08-17 — Bauformen, die es in der Schale noch nicht gab.
   Additiv: keine bestehende Regel wird veraendert.
   ============================================================ */
/* Zweizeilige Dokumentzeile: Name oben, Beschreibung darunter. Die einzeilige
   .dname schneidet mit Auslassungspunkten ab — fuer eine Akte mit Beschreibung
   klebten Name und Beschreibung dadurch aneinander. */
.docrow.zwei{align-items:flex-start}
.docrow.zwei .dname{white-space:normal;overflow:visible;text-overflow:clip;
  display:flex;flex-direction:column;gap:2px;color:var(--ink);font-weight:700}
.docrow.zwei .dname .tl-sub{font-weight:500}
.docrow.zwei .dsz{padding-top:2px}

/* Grosses Bildraster fuer Objektfotos. Das Planraster (212 px) ist fuer
   Grundrisskacheln gemacht; Objektansichten wirken darin briefmarkengross. */
.plan-grid.gross{grid-template-columns:repeat(auto-fill,minmax(min(30rem,100%),1fr));gap:18px}
.plan-grid.gross .plan-img{aspect-ratio:16/10}
.plan-grid.gross .plan{cursor:default}
.plan-grid.gross .plan:hover{border-color:var(--line);transform:none;box-shadow:none}
.plan-img img{background:var(--surface-3)}

/* ============================================================
   RASTER- UND ABSTANDSSYSTEM (2026-08-17)
   Gemessen, nicht vermutet: die Karten der Konsole trugen margin 0. Zwischen
   zwei aufeinanderfolgenden Karten standen damit 0 px — der Abstand entstand
   nur zufaellig ueber die Abschnittsbeschriftung darueber. Ab hier gibt es
   EINE Abstandsskala und EIN Seitenraster; jeder Block bezieht seinen Abstand
   daraus statt ihn selbst zu setzen.
   ============================================================ */
:root{
  --sp-1:.25rem; --sp-2:.5rem;  --sp-3:.75rem; --sp-4:1rem;
  --sp-5:1.5rem; --sp-6:2rem;   --sp-7:2.75rem; --sp-8:3.5rem;
  --rinne:1.25rem;      /* Rinne zwischen Rasterspalten */
  --rhythmus:var(--sp-6); /* senkrechter Abstand zwischen Bloecken */
  --spalten:12;
}
@media(min-width:64rem){:root{--rinne:1.5rem;--rhythmus:var(--sp-7)}}

/* Der senkrechte Rhythmus steht am DATEIENDE — eine aeltere Regel mit
   #view-Spezifitaet setzt sonst wieder ihren eigenen Abstand. */

/* Seitenraster: zwoelf Spuren, eine Rinne. minmax(0,1fr) statt 1fr, damit ein
   breites Kind (Tabelle, Diagramm) seine Spur nicht sprengt; jedes Rasterfeld
   zusaetzlich min-width:0 — beides schon einmal teuer gelernt. */
.raster{display:grid;grid-template-columns:repeat(var(--spalten),minmax(0,1fr));gap:var(--rinne)}
.raster > *{min-width:0}
.sp-3,.sp-4,.sp-6,.sp-8,.sp-9,.sp-12{grid-column:span var(--spalten)}
@media(min-width:48rem){
  .sp-6{grid-column:span 6}
  .sp-4{grid-column:span 6}
  .sp-3{grid-column:span 6}
}
@media(min-width:64rem){
  .sp-3{grid-column:span 3}
  .sp-4{grid-column:span 4}
  .sp-6{grid-column:span 6}
  .sp-8{grid-column:span 8}
  .sp-9{grid-column:span 9}
}


/* ---- Formularreihe (Objekt anlegen) ---- */
.feldreihe{display:flex;flex-direction:column;gap:var(--sp-3)}
.feld{display:flex;flex-direction:column;gap:var(--sp-1)}
.feld > span{font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-faint)}
.feld .inp{width:100%}

/* ---- Meldung: Ursache und naechster Schritt, nie ein nackter Code ---- */
.meldung{position:fixed;inset-block-end:1.25rem;inset-inline:auto 1.25rem;max-width:min(30rem,calc(100vw - 2.5rem));
  z-index:120;background:var(--surface-2);border:1px solid var(--line-strong);border-inline-start:3px solid var(--line-strong);
  border-radius:var(--r-sm);padding:var(--sp-3) var(--sp-4);font-size:13.5px;color:var(--ink);
  box-shadow:var(--shadow)}
.meldung.gut{border-inline-start-color:var(--good)}
.meldung.warn{border-inline-start-color:var(--warn)}
.meldung.info{border-inline-start-color:var(--info)}
@media(prefers-reduced-motion:no-preference){
  .meldung{animation:meldung-ein .22s ease-out}
  @keyframes meldung-ein{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
}

/* ---- Vergleichsbalken mit Skala (Kennzahl gegen Kennzahl) ---- */
.vgl{display:grid;grid-template-columns:minmax(8rem,13rem) 1fr minmax(6.5rem,auto);
     gap:var(--sp-4);align-items:center}
.vgl + .vgl{margin-block-start:var(--sp-3)}
.vgl-name{font-weight:700;font-size:14px;min-width:0}
.vgl-name span{display:block;font-size:12.5px;color:var(--ink-faint);font-weight:500}
.vgl-spur{position:relative;height:2.5rem;background:var(--surface-3);border-radius:9px;overflow:hidden}
.vgl-fuell{position:absolute;inset-block:0;inset-inline-start:0;border-radius:9px;
           transition:width .55s cubic-bezier(.4,0,.2,1)}
.vgl-leer{display:flex;align-items:center;height:2.5rem;padding-inline:var(--sp-3);
          border:1px dashed var(--line-strong);border-radius:9px;
          font-size:12.5px;color:var(--ink-faint)}
.vgl-wert{font-family:var(--disp);font-weight:900;font-size:1.05rem;
          font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}
.vgl-wert small{display:block;font-family:var(--sans);font-weight:600;font-size:11.5px;
                color:var(--ink-faint);letter-spacing:0}
.vgl-skala{display:flex;justify-content:space-between;font-size:11.5px;color:var(--ink-faint);
           margin-block-start:var(--sp-3);border-block-start:1px solid var(--line);padding-block-start:var(--sp-2)}

/* ---- Deckungsbalken: sitzt IN der Tabellenzelle der Hausschale ---- */
.deck-spur{position:relative;height:1.75rem;min-width:7rem;background:var(--surface-3);
           border-radius:6px;overflow:hidden}
.deck-teil{position:absolute;inset-block:0;transition:width .55s cubic-bezier(.4,0,.2,1)}
.deck-kd{background:var(--ink-faint)}
.deck-rest{background:var(--lime)}
.deck-fehl{background:var(--bad)}
.unitwrap td .tl-sub{margin-top:1px}
.wneg{color:var(--bad)}
.wpos{color:var(--good)}

/* Vier gleichartige Bausteine gehoeren in zwei Reihen zu zwei — bei drei Spalten
   bliebe eine Schlussreihe mit einem einzelnen Element stehen (R77). Und die
   Mindestspur wird gedeckelt, sonst ist sie bei 360 px breiter als ihr Kasten. */
.baustein-grid{grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr))}
.baustein-grid.zweier{grid-template-columns:1fr}
.baustein-grid.dreier{grid-template-columns:1fr}
@media(min-width:64rem){
  .baustein-grid.zweier{grid-template-columns:1fr 1fr}
  .baustein-grid.dreier{grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* Das Symbolfeld dient auch als Kopfmarke einer Antragskarte. */
.pcard-top .bs-ic{flex:0 0 auto;width:40px;height:40px;border-radius:11px;background:var(--rail-active);
  color:var(--accent-ink);display:flex;align-items:center;justify-content:center}

/* Die Merkmalzeile darf umbrechen statt aus ihrer Zeile zu laufen. */
.summe-zeile > *{min-width:0}
.summe-zeile .tagrow{flex-wrap:wrap}
.tag{white-space:normal}

/* Die Erlaeuterung unter einer Kennzahl wurde einzeilig abgeschnitten
   ("54 Wohneinheiten in 4 Vorha…"). Die Beschriftung OBEN bleibt einzeilig,
   die Erlaeuterung UNTEN darf umbrechen — sonst geht genau die Angabe verloren,
   die den Wert einordnet. */
.profi .pl.lang{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.35}

/* ---- Inhaltsverzeichnis: nummerierte Sprossen (.rung der Hausschale) ---- */
.rungliste{display:flex;flex-direction:column;gap:var(--sp-2)}
.rungliste .rung{text-decoration:none;transition:border-color .15s,background .15s}
.rungliste .rung:hover{border-color:var(--accent-ink);background:var(--surface-3)}
.rung-txt{min-width:0;flex:1}
.rung-txt b{display:block;font-size:14px;line-height:1.25}
.rungliste .golink{flex:0 0 auto}

/* ---- Volumenkachel: Wert, Anteilsbalken, Kennzahlen ---- */
.vol-wert{font-family:var(--disp);font-weight:900;font-size:1.75rem;letter-spacing:-.02em;line-height:1.1}
.vol-spur{height:.5rem;border-radius:99px;background:var(--surface-3);overflow:hidden}
.vol-fuell{height:100%;border-radius:99px;transition:width .6s cubic-bezier(.4,0,.2,1)}
.vol-anteil{font-size:12.5px;color:var(--ink-faint)}
.summe-zeile{display:flex;flex-wrap:wrap;gap:var(--sp-5);align-items:center;justify-content:space-between}
.summe-wert{font-family:var(--disp);font-weight:900;font-size:2rem;letter-spacing:-.025em;
            color:var(--accent-ink);line-height:1.1;margin-block:var(--sp-1)}
.summe-zeile .tagrow{margin-top:0}

/* Die Volumenkachel ist ein Verweis — sie darf nicht wie Fliesstext aussehen. */
a.pcard{text-decoration:none;color:inherit}
a.pcard:hover{border-color:var(--accent-ink)}

/* Bildablage je Objekt: eigene Aufnahme statt Uebergabe-Platzhalter. */
.bildkarte{display:flex;flex-direction:column;gap:0}
.bild-akt{display:flex;align-items:center;gap:8px;padding:10px 12px;border-top:1px solid var(--line);flex-wrap:wrap}
.bild-akt .bild-hinweis{font-size:12.5px;color:var(--ink-faint);margin-right:auto}
.bild-btn{appearance:none;border:1px solid var(--line-strong);background:var(--surface-2);color:var(--ink);
  font:inherit;font-weight:700;font-size:13px;border-radius:var(--r-sm);padding:8px 12px;cursor:pointer;
  min-height:40px;display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.bild-btn:hover{border-color:var(--accent-ink)}
.bild-btn.weg{color:var(--bad)}
.bildkarte.drag{border-color:var(--lime)}

.section-label{display:flex;align-items:baseline;gap:10px;font-size:11.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-faint);margin:34px 0 14px}
.section-label .sl-hint{letter-spacing:0;text-transform:none;font-weight:500;color:var(--ink-faint);font-size:11.5px}
.grid-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:16px}
.pcard{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:22px;box-shadow:var(--shadow);cursor:pointer;transition:border-color .15s,transform .15s;display:flex;flex-direction:column;gap:14px}
.pcard:hover{border-color:var(--line-strong);transform:translateY(-2px)}
.pcard-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.pcard h3{font-family:var(--disp);font-weight:800;font-size:18.5px;letter-spacing:-.02em;line-height:1.15}
.pcard .addr{color:var(--ink-faint);font-size:12.5px;margin-top:3px}
.pcard-kpis{display:grid;grid-template-columns:1fr 1fr;gap:11px 16px;border-top:1px solid var(--line);padding-top:14px}
.pk .l{font-size:11.5px;color:var(--ink-faint);white-space:nowrap}
.pk .v{font-weight:700;font-size:15px;white-space:nowrap}
.pcard-foot{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:13px}
.golink{display:inline-flex;align-items:center;gap:6px;color:var(--accent-ink);font-weight:700;font-size:13px;white-space:nowrap}

.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow);overflow:hidden}
.card-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:17px 22px;border-bottom:1px solid var(--line)}
.card-head h3{font-family:var(--disp);font-weight:800;font-size:16px;letter-spacing:-.01em}
.card-head .hint{font-size:12px;color:var(--ink-faint);white-space:nowrap}
.card-body{padding:6px 22px 18px}
table{width:100%;border-collapse:collapse}
th{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);text-align:left;padding:12px 8px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
th.r,td.r{text-align:right}
td{padding:11px 8px;border-bottom:1px solid var(--line);font-size:13.5px;vertical-align:middle}
tr:last-child td{border-bottom:none}
tr.clickable{cursor:pointer}
tr.clickable:hover td{background:color-mix(in srgb,var(--ink) 3%,transparent)}
td .sub{display:block;font-size:11.5px;color:var(--ink-faint);margin-top:2px}
tr.sumrow td{font-weight:800;font-size:14.5px;border-top:1px solid var(--line-strong);background:var(--surface-2)}
tr.detail-row td{background:var(--surface-2);padding:0;border-bottom:1px solid var(--line)}
.detail-inner{padding:14px 18px;display:grid;gap:8px}
.detail-inner .drow{display:flex;justify-content:space-between;gap:16px;font-size:13px;color:var(--ink-soft);border-bottom:1px dashed var(--line);padding-bottom:7px}
.detail-inner .drow:last-child{border-bottom:none}
.detail-inner .note{font-size:12px;color:var(--ink-faint);padding-top:4px}

.two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:stretch;margin-top:16px}
@media(max-width:1000px){.two-col{grid-template-columns:1fr}.app{grid-template-columns:1fr}.content{padding:24px 18px 70px}}
.finding{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);align-items:flex-start}
.finding:last-child{border-bottom:none}
.fico{flex:0 0 auto;width:8px;height:8px;border-radius:99px;margin-top:7px}
.finding p{font-size:13.5px;color:var(--ink-soft)}
.finding p b{color:var(--ink)}
.finding .amt{margin-left:auto;flex:0 0 auto;font-weight:800;font-size:13.5px;white-space:nowrap}

.brow{display:grid;grid-template-columns:170px 1fr 120px;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.brow:last-child{border-bottom:none}
.brow .bl{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brow .bl span{display:block;font-size:11px;color:var(--ink-faint);font-weight:500}
.brow .bv{text-align:right;font-weight:700;font-size:13.5px;white-space:nowrap}
.track{display:flex;height:10px;border-radius:99px;overflow:hidden;background:var(--surface-3)}
.seg{height:100%}
.legend{display:flex;gap:16px;flex-wrap:wrap;padding:12px 0 2px}
.legend .li{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--ink-soft);white-space:nowrap}
.legend .sw{width:10px;height:10px;border-radius:3px}

.floorgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin:14px 0 4px}
.floor{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface-2);padding:12px 14px}
.floor b{font-size:12.5px;display:block}
.floor .fv{font-family:var(--disp);font-weight:800;font-size:19px;margin-top:4px}
.floor span{font-size:11px;color:var(--ink-faint)}
.floor .fprov{margin-top:6px}

/* PROFI-KPI-Kachel mit Provenienz */
.profi{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface-2);padding:13px 15px;display:flex;flex-direction:column;gap:6px}
.profi .pl{font-size:11.5px;color:var(--ink-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.profi .pv{font-family:var(--disp);font-weight:800;font-size:20px;letter-spacing:-.02em;white-space:nowrap}
.profi .pv small{font-size:12px;color:var(--ink-faint);font-weight:700}

.filterbar{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px 0 4px;flex-wrap:wrap}
.inp{background:var(--surface-2);border:1px solid var(--line-strong);border-radius:var(--r-sm);color:var(--ink);font-family:var(--sans);font-size:13px;padding:9px 13px;outline:none}
.inp:focus{border-color:var(--lime)}
.filterbar .cnt{font-size:12px;color:var(--ink-faint);white-space:nowrap}
.chipfilter{display:flex;gap:7px;flex-wrap:wrap}
.chipfilter button{border:1px solid var(--line-strong);background:var(--surface);color:var(--ink-soft);font-family:var(--sans);font-size:12px;font-weight:600;padding:6px 12px;border-radius:99px;cursor:pointer;white-space:nowrap}
.chipfilter button.on{background:var(--lime);border-color:var(--lime);color:var(--on-lime);font-weight:700}
.unitwrap{max-height:430px;overflow-y:auto;border:1px solid var(--line);border-radius:var(--r-sm);margin-top:8px}
.unitwrap table{font-size:13px}
.unitwrap th{position:sticky;top:0;background:var(--surface-2);z-index:2}
.unitwrap td{padding:9px 10px}
.unitwrap tr:hover td{background:color-mix(in srgb,var(--ink) 3%,transparent)}

/* Dokumente / Datenraum */
.docgroup{border-bottom:1px solid var(--line)}
.docgroup:last-child{border-bottom:none}
.docgroup-head{display:flex;align-items:center;gap:11px;padding:15px 0;cursor:pointer;user-select:none}
.docgroup-head:hover .dg-name{color:var(--ink)}
.dg-name{font-weight:700;font-size:14px;color:var(--ink)}
.dg-count{font-size:11px;font-weight:700;background:var(--surface-3);color:var(--ink-faint);border-radius:99px;padding:2px 9px}
.dg-sz{font-size:11px;color:var(--ink-faint);margin-left:2px}
.dg-caret{margin-left:auto;color:var(--ink-faint);transition:transform .15s}
.docgroup.open .dg-caret{transform:rotate(90deg)}
.doclist{display:none;padding:0 0 10px}
.docgroup.open .doclist{display:block}
.docrow{display:flex;align-items:center;gap:11px;padding:8px 10px;border-radius:var(--r-sm)}
.docrow:hover{background:color-mix(in srgb,var(--ink) 4%,transparent)}
.docrow .dname{flex:1;min-width:0;font-size:13px;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.docrow .dsz{flex:0 0 auto;font-size:11px;color:var(--ink-faint);font-variant-numeric:tabular-nums;min-width:62px;text-align:right}
.ftype{flex:0 0 auto;font-size:9.5px;font-weight:800;letter-spacing:.05em;border-radius:5px;padding:2.5px 6px;background:var(--surface-3);color:var(--ink-faint)}
.ftype.pdf{background:var(--bad-bg);color:var(--bad)}
.ftype.dwg{background:var(--info-bg);color:var(--info)}
.ftype.docx,.ftype.doc{background:var(--good-bg);color:var(--good)}
.doclink{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;font-size:12px;font-weight:700;color:var(--accent-ink);white-space:nowrap;cursor:pointer}
.doclink:hover{opacity:.8}
.docmore{font-size:12px;color:var(--ink-faint);padding:8px 10px}

/* Dropzone */
.dropzone{border:1.5px dashed var(--line-strong);border-radius:var(--r-lg);background:var(--surface-2);padding:26px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s;margin-bottom:6px}
.dropzone:hover,.dropzone.drag{border-color:var(--lime);background:color-mix(in srgb,var(--lime) 8%,var(--surface-2))}
.dropzone .dz-ico{width:44px;height:44px;border-radius:12px;background:var(--surface-3);display:inline-flex;align-items:center;justify-content:center;color:var(--ink-soft);margin-bottom:10px}
.dropzone b{font-family:var(--disp);font-size:15px;display:block}
.dropzone p{font-size:12.5px;color:var(--ink-faint);margin-top:4px}
.uplist{margin-top:12px;display:flex;flex-direction:column;gap:7px}
.uprow{display:flex;align-items:center;gap:10px;padding:9px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);font-size:13px}
.uprow .upok{margin-left:auto;color:var(--good);font-weight:700;font-size:12px}

/* Ladder / Vergabemodell */
.lad{display:flex;flex-direction:column;gap:8px}
.rung{display:flex;align-items:center;gap:14px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface-2)}
.rung.on{border-color:var(--lime);background:color-mix(in srgb,var(--lime) 9%,var(--surface-2))}
.rung .rn{flex:0 0 auto;width:40px;height:40px;border-radius:10px;background:var(--surface-3);display:flex;align-items:center;justify-content:center;font-family:var(--disp);font-weight:800;font-size:15px;color:var(--ink-soft)}
.rung.on .rn{background:var(--lime);color:var(--on-lime)}
.rung .rb{flex:1;min-width:0}
.rung .rb b{font-size:14px;display:block}
.rung .rb p{font-size:12px;color:var(--ink-faint);margin-top:2px}
.rung .rs{flex:0 0 auto}

.mcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}
.mcard{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface-2);padding:15px 16px}
.mcard .mc-code{font-family:var(--disp);font-weight:800;font-size:12px;color:var(--accent-ink);letter-spacing:.04em}
.mcard b{font-size:14.5px;display:block;margin:5px 0 4px}
.mcard p{font-size:12.5px;color:var(--ink-faint)}
.mcard.blue{border-left:3px solid var(--info)}
.mcard.amber{border-left:3px solid var(--warn)}
.mcard.teal{border-left:3px solid var(--good)}
.mcard.lime{border-left:3px solid var(--lime)}
.mcard.red{border-left:3px solid var(--bad)}
.ul{margin:10px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px}
.ul li{position:relative;padding-left:20px;font-size:13.5px;color:var(--ink-soft)}
.ul li::before{content:"";position:absolute;left:2px;top:8px;width:7px;height:7px;border-radius:2px;background:var(--lime)}
.notebox{margin-top:14px;padding:13px 16px;border-radius:var(--r-sm);background:var(--surface-2);border:1px solid var(--line);font-size:13px;color:var(--ink-soft);line-height:1.6}
.notebox b{color:var(--ink)}
.foot-note{margin-top:30px;font-size:12px;color:var(--ink-faint);border-top:1px solid var(--line);padding-top:16px;line-height:1.7}

/* Logo-Bild */
.logo-img{height:30px;width:auto;display:block}
.logo-cap{font-family:var(--disp);font-weight:800;font-size:12px;letter-spacing:.02em;color:var(--rail-ink);margin-top:7px;padding-left:2px}
.logo-cap span{display:block;font-family:var(--sans);font-weight:500;font-size:10.5px;color:var(--rail-ink-soft);letter-spacing:0}

/* Topbar: Callfluence-Header */
.tb-icon{width:36px;height:36px;border-radius:99px;border:1px solid var(--line-strong);background:var(--surface);display:flex;align-items:center;justify-content:center;color:var(--ink-soft);cursor:pointer;position:relative}
.tb-icon:hover{color:var(--ink);border-color:var(--ink-faint)}
.tb-icon .badge{position:absolute;top:-3px;right:-3px;font-size:8.5px;font-weight:800;background:var(--lime);color:var(--on-lime);border-radius:99px;padding:1px 4px;letter-spacing:.02em}
.btn-ask{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line-strong);background:var(--surface);border-radius:99px;padding:8px 14px;font-size:12.5px;font-weight:700;color:var(--ink-soft);cursor:pointer}
.btn-ask:hover{color:var(--ink);border-color:var(--ink-faint)}
.btn-cta{display:inline-flex;align-items:center;gap:7px;border:none;background:var(--lime);color:var(--on-lime);border-radius:99px;padding:9px 17px;font-size:12.5px;font-weight:800;cursor:pointer;white-space:nowrap;box-shadow:0 2px 10px rgba(207,221,40,.25)}
.btn-cta:hover{background:var(--lime-strong)}
.langmenu{position:absolute;top:44px;right:0;background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r-sm);box-shadow:var(--shadow);padding:5px;display:none;z-index:40;min-width:120px}
.langmenu.open{display:block}
.langmenu button{display:flex;width:100%;align-items:center;gap:8px;border:none;background:transparent;color:var(--ink-soft);font-family:var(--sans);font-size:13px;font-weight:600;padding:8px 11px;border-radius:8px;cursor:pointer;text-align:left}
.langmenu button:hover{background:var(--surface-2);color:var(--ink)}
.langmenu button.on{color:var(--accent-ink)}
/* Sprache mit Flagge (Muster aus der CallFluence-Konsole, Toene aus DIESEM
   Blatt — fremde Token-Namen werden nicht uebernommen, sie heissen dort
   anderes). Flagge als Inline-Sprite, nie als Emoji. */
.flg{width:21px;height:14px;border-radius:3px;flex:none;display:block;box-shadow:0 0 0 1px var(--line-strong)}
.tb-flag{overflow:visible}
.langmenu{min-width:186px}
.langmenu button .lm-ck{margin-left:auto;display:flex;color:var(--accent-ink);opacity:0}
.langmenu button .lm-ck svg{width:15px;height:15px}
.langmenu button.on .lm-ck{opacity:1}
/* Guthaben als Aufklapp-Menue (gleiche Bauform wie die Sprache: Auslöser,
   Menue darunter, Esc und Klick daneben schliessen). */
.tb-tok{position:relative}
.tok-menu{position:absolute;top:44px;right:0;min-width:268px;background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r);box-shadow:var(--shadow);padding:14px;display:none;z-index:41;text-align:left}
.tok-menu.open{display:block}
.tok-bal{font-family:var(--disp);font-weight:800;font-size:26px;letter-spacing:-.02em;color:var(--ink);line-height:1.1}
.tok-bal b{font-variant-numeric:tabular-nums}
.tok-bal span{font-size:14px;color:var(--ink-soft);font-weight:600;font-family:var(--sans)}
.tok-sub{font-size:13px;color:var(--ink-soft);margin-top:4px}
.tok-bar{height:7px;border-radius:6px;background:var(--surface-3);overflow:hidden;margin:12px 0 4px}
.tok-bar i{display:block;height:100%;background:var(--lime);transition:width .25s}
.tok-sep{height:1px;background:var(--line);margin:12px 0}
.tok-list{display:grid;gap:7px;margin-bottom:10px}
.tok-list .tk-z{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--ink-soft)}
.tok-list .tk-z b{color:var(--ink);font-variant-numeric:tabular-nums;font-weight:700}
.tok-act{display:flex;align-items:center;gap:9px;width:100%;padding:10px 11px;border:0;border-radius:9px;background:var(--surface-2);color:var(--ink);font-family:var(--sans);font-size:13.5px;font-weight:600;margin-top:7px;cursor:pointer;text-align:left}
.tok-act:hover{background:var(--surface-3)}
.tok-act svg{width:16px;height:16px;color:var(--accent-ink)}
.tok-log{margin-top:10px;max-height:190px;overflow-y:auto;display:grid;gap:6px}
.tok-log .tl-z{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;color:var(--ink-soft);border-bottom:1px solid var(--line);padding-bottom:5px}
.tok-log .tl-z b{color:var(--ink);font-variant-numeric:tabular-nums}
.tok-log .tl-leer{font-size:13px;color:var(--ink-soft)}
/* ---------- Mobile-Header-Bausteine (Desktop: versteckt) ---------- */
.tb-burger{display:none;width:38px;height:38px;flex:0 0 auto;border:1px solid var(--line-strong);background:var(--surface);border-radius:11px;color:var(--ink-soft);align-items:center;justify-content:center;cursor:pointer;padding:0}
.tb-burger:hover{color:var(--ink);border-color:var(--ink-faint)}
.tb-burger svg{width:20px;height:20px}
.tb-head{min-width:0;flex:1 1 auto}
.nav-back{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:65;display:none}
.ask-fab{display:none;position:fixed;right:16px;bottom:16px;width:56px;height:56px;border-radius:50%;border:none;background:var(--lime);color:var(--on-lime);box-shadow:0 8px 24px rgba(0,0,0,.28),0 2px 6px rgba(207,221,40,.4);z-index:55;align-items:center;justify-content:center;cursor:pointer;transition:transform .12s}
.ask-fab svg{width:24px;height:24px}
.ask-fab:active{transform:scale(.94)}
.rail-ctl{display:none}
.rail-lang{display:flex;gap:4px;background:var(--rail-panel);border-radius:9px;padding:3px}
.rail-lang button{display:flex;align-items:center;gap:6px;border:none;background:transparent;color:var(--rail-ink-soft);font-family:var(--sans);font-weight:700;font-size:12px;padding:5px 12px;border-radius:7px;cursor:pointer}
.rail-lang button.on{background:var(--rail);color:var(--rail-ink)}
.rail-theme{margin-left:auto;width:36px;height:36px;border-radius:9px;border:1px solid var(--rail-line);background:transparent;color:var(--rail-ink-soft);display:flex;align-items:center;justify-content:center;cursor:pointer}
.rail-theme:hover{color:var(--rail-ink)}
.rail-theme svg{width:18px;height:18px}

/* Drop-up (Account-/Ökosystem-Menü, Callfluence-Stil) */
.rail-foot{cursor:pointer;position:relative}
.rail-foot .rf-caret{margin-left:auto;color:var(--rail-ink-soft)}
.dropup{position:fixed;bottom:74px;left:14px;right:auto;width:calc(var(--railw) - 28px);max-width:calc(100vw - 28px);background:var(--rail);border:1px solid var(--rail-line);border-radius:var(--r);box-shadow:0 -10px 44px rgba(0,0,0,.6);padding:10px;display:none;z-index:50;max-height:74vh;overflow-y:auto}
.dropup.open{display:block}
.dropup-h{font-size:.65rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--rail-ink-soft);padding:11px 10px 5px}
.dropup-item{display:flex;align-items:center;gap:9px;padding:.5rem .6rem;border-radius:9px;font-size:.82rem;font-weight:600;color:var(--rail-ink-soft)}
.dropup-item.act{cursor:pointer}
.dropup-item.act:hover{background:var(--rail-panel);color:var(--rail-ink)}
.dropup-item.lock{color:var(--rail-ink-soft);opacity:.6}
.dropup-item .lk{margin-left:auto;color:var(--rail-ink-soft)}
.dropup-item .sw{width:34px;height:19px;border-radius:99px;background:var(--rail-panel);position:relative;flex:0 0 auto;transition:background .15s}
.dropup-item .sw::after{content:"";position:absolute;top:2px;left:2px;width:15px;height:15px;border-radius:99px;background:var(--rail-ink-soft);transition:transform .15s}
.dropup-item.sw-on .sw{background:var(--lime)}
.dropup-item.sw-on .sw::after{background:var(--on-lime);transform:translateX(15px)}

/* Ask-AI Drawer */
.ai-back{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:60;display:none}
.ai-back.open{display:block}
.ai-drawer{position:fixed;top:0;right:0;bottom:0;width:min(440px,94vw);background:var(--bg);border-left:1px solid var(--line-strong);z-index:61;transform:translateX(100%);transition:transform .2s;display:flex;flex-direction:column}
.ai-drawer.open{transform:none}
.ai-head{display:flex;align-items:center;gap:10px;padding:16px 20px;border-bottom:1px solid var(--line)}
.ai-head b{font-family:var(--disp);font-size:15px}
.ai-head .ai-x{margin-left:auto;cursor:pointer;color:var(--ink-faint)}
.ai-body{flex:1;overflow-y:auto;padding:16px 20px;display:flex;flex-direction:column;gap:12px}
.ai-msg{max-width:90%;padding:11px 14px;border-radius:14px;font-size:13.5px;line-height:1.55}
.ai-msg.u{align-self:flex-end;background:var(--lime);color:var(--on-lime);font-weight:600}
.ai-msg.a{align-self:flex-start;background:var(--surface-2);border:1px solid var(--line);color:var(--ink-soft)}
.ai-msg.a b{color:var(--ink)}
.ai-sugg{display:flex;flex-wrap:wrap;gap:7px}
.ai-sugg button{border:1px solid var(--line-strong);background:var(--surface);color:var(--ink-soft);font-family:var(--sans);font-size:12px;padding:6px 11px;border-radius:99px;cursor:pointer}
.ai-sugg button:hover{border-color:var(--lime);color:var(--ink)}
.ai-foot{padding:14px 20px;border-top:1px solid var(--line);display:flex;gap:9px}
.ai-foot input{flex:1;background:var(--surface-2);border:1px solid var(--line-strong);border-radius:99px;color:var(--ink);font-family:var(--sans);font-size:13px;padding:10px 15px;outline:none}
.ai-foot input:focus{border-color:var(--lime)}
.ai-foot button{border:none;background:var(--lime);color:var(--on-lime);border-radius:99px;padding:0 16px;font-weight:800;cursor:pointer}
.ai-note{font-size:10.5px;color:var(--ink-faint);padding:0 20px 12px;text-align:center}

/* Modul-Katalog A–J */
.modgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:13px}
.modtile{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);padding:17px 18px;display:flex;flex-direction:column;gap:8px;position:relative;min-height:130px}
.modtile.act{cursor:pointer;transition:border-color .15s,transform .15s}
.modtile.act:hover{border-color:var(--lime);transform:translateY(-2px)}
.modtile.locked{opacity:.6}
.modtile .m-let{position:absolute;top:14px;right:16px;font-family:var(--disp);font-weight:900;font-size:26px;color:var(--surface-3)}
.modtile.act .m-let{color:color-mix(in srgb,var(--lime) 45%,var(--surface-3))}
.modtile .m-t{font-family:var(--disp);font-weight:800;font-size:15px;padding-right:30px}
.modtile .m-d{font-size:12px;color:var(--ink-faint);flex:1}
.modtile .m-s{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700}
.modtile.act .m-s{color:var(--good)}
.modtile.locked .m-s{color:var(--ink-faint)}

/* LV-Explorer */
.lv-gewerk{border:1px solid var(--line);border-radius:var(--r);margin-bottom:12px;overflow:hidden}
.lv-gh{display:flex;align-items:center;gap:12px;padding:14px 18px;background:var(--surface-2);cursor:pointer}
.lv-gh b{font-family:var(--disp);font-size:14.5px}
.lv-gh .lv-sub{font-size:11.5px;color:var(--ink-faint)}
.lv-gh .lv-sum{margin-left:auto;font-family:var(--disp);font-weight:800;font-size:15px;white-space:nowrap}
.lv-gh .lv-c{color:var(--ink-faint);transition:transform .15s}
.lv-gewerk.open .lv-gh .lv-c{transform:rotate(90deg)}
.lv-tbl{display:none;overflow-x:auto}
.lv-gewerk.open .lv-tbl{display:block}
.lv-tbl table{min-width:640px}
.lv-tbl td,.lv-tbl th{padding:9px 12px;font-size:12.5px}
.lv-tbl .pos{font-variant-numeric:tabular-nums;color:var(--ink-faint);white-space:nowrap}
.lv-tbl .bz b{font-weight:600;color:var(--ink)}
.lv-tbl .bz span{display:block;font-size:11px;color:var(--ink-faint);margin-top:2px}
.lv-tbl .sa{display:inline-block;font-size:9.5px;font-weight:800;background:var(--surface-3);color:var(--ink-faint);border-radius:5px;padding:1.5px 6px;margin-top:3px}
.lv-toolbar{display:inline-flex;border:1px solid var(--line-strong);border-radius:99px;padding:2px;gap:2px;margin-bottom:14px}
.lv-toolbar button{border:none;background:transparent;color:var(--ink-faint);font-family:var(--sans);font-size:12px;font-weight:700;padding:6px 14px;border-radius:99px;cursor:pointer}
.lv-toolbar button.on{background:var(--lime);color:var(--on-lime)}

/* Phasen / Fahrplan */
.phaserow{display:grid;grid-template-columns:64px 1fr;gap:14px;align-items:start;padding:14px 0;border-bottom:1px solid var(--line);position:relative}
.phaserow:last-child{border-bottom:none}
.phaserow .pnum{font-family:var(--disp);font-weight:900;font-size:13px;color:var(--on-lime);background:var(--lime);border-radius:10px;width:56px;height:34px;display:flex;align-items:center;justify-content:center}
.phaserow.mut .pnum{background:var(--surface-3);color:var(--ink-faint)}
.phaserow .pt{font-family:var(--disp);font-weight:800;font-size:14.5px}
.phaserow .pd{font-size:12.5px;color:var(--ink-faint);margin-top:2px}
.phaserow .pgoal{font-size:12px;color:var(--accent-ink);font-weight:600;margin-top:4px}

/* Entscheidungsbilanz */
.balrow{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
.balrow:last-child{border-bottom:none}
.balrow .bkl{font-size:13.5px;color:var(--ink-soft);flex:1}
.balrow .bval{font-weight:700;font-size:13px}
.locked-page{text-align:center;padding:52px 24px;margin-top:6px;border:1.5px dashed var(--line-strong);border-radius:var(--r-lg);background:var(--surface-2)}
/* NOVA · Abgleich zur SSR-Software */
.abrow{display:grid;grid-template-columns:1fr 30px 1fr auto;gap:16px;align-items:center;padding:15px 0;border-bottom:1px solid var(--line)}
.abrow:last-child{border-bottom:none}
.abrow .src b,.abrow .dst b{font-size:13.5px;display:block}
.abrow .src span,.abrow .dst span{font-size:11.5px;color:var(--ink-faint)}
.abrow .arr{color:var(--ink-faint);display:flex;justify-content:center}
.abrow .dst b{color:var(--ink-soft)}
@media(max-width:640px){.abrow{grid-template-columns:1fr auto}.abrow .arr,.abrow .dst{display:none}}
.locked-page .lp-ico{width:52px;height:52px;border-radius:14px;background:var(--surface-3);display:inline-flex;align-items:center;justify-content:center;color:var(--ink-faint);margin-bottom:12px}
.locked-page b{font-family:var(--disp);font-size:18px;display:block}
.locked-page p{font-size:13px;color:var(--ink-faint);margin-top:6px;max-width:440px;margin-left:auto;margin-right:auto}
/* ---------- Rendite-Rechner (interaktive Kaltmiete) ---------- */
.rechner .rech-top{display:grid;grid-template-columns:1.05fr 1fr;gap:24px;align-items:start}
.rech-ctrl label{display:block;font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:13px}
.rech-inrow{display:flex;align-items:center;gap:14px}
.rech-inrow input[type=range]{flex:1;accent-color:var(--lime);height:4px;cursor:pointer}
.rech-numwrap{display:flex;align-items:center;gap:6px;flex:0 0 auto}
.rech-numwrap input{width:66px;background:var(--surface-2);border:1px solid var(--line-strong);border-radius:9px;color:var(--ink);font-family:var(--disp);font-weight:800;font-size:16px;padding:7px 9px;text-align:right}
.rech-numwrap input:focus{outline:none;border-color:var(--lime)}
.rech-numwrap span{font-size:11.5px;color:var(--ink-faint)}
.rech-scale{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font-size:11px;color:var(--ink-faint)}
.rech-def{cursor:pointer;color:var(--accent-ink);font-weight:700}
.rech-def:hover{text-decoration:underline}
.rech-basis{margin-top:12px;font-size:12px;color:var(--ink-soft)}
.rech-basis b{color:var(--ink);font-weight:700}
.rech-hint{margin-top:9px;font-size:12px;color:var(--ink-faint);line-height:1.5}
.rech-out{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.rech-tile{background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.rech-tile .pl{font-size:11.5px;color:var(--ink-faint)}
.rech-tile .pv{font-size:20px;font-weight:800;margin-top:3px}
.rech-tile.hl{border-color:var(--lime);background:color-mix(in srgb,var(--lime) 12%,var(--surface-2))}
@media(max-width:720px){.rechner .rech-top{grid-template-columns:1fr;gap:18px}}
/* System-Controls -> SSR-CI: Number-Spinner weg, Range-Slider voll gebrandet */
.rech-numwrap input[type=number],.rm-inw input[type=number]{-moz-appearance:textfield;appearance:textfield}
.rech-numwrap input[type=number]::-webkit-inner-spin-button,.rech-numwrap input[type=number]::-webkit-outer-spin-button,.rm-inw input[type=number]::-webkit-inner-spin-button,.rm-inw input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.rech-inrow input[type=range]{-webkit-appearance:none;appearance:none;flex:1;height:6px;border-radius:99px;background:var(--line-strong);cursor:pointer;outline:none}
.rech-inrow input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:19px;height:19px;border-radius:50%;background:var(--lime);border:3px solid var(--surface-2);box-shadow:0 1px 4px rgba(0,0,0,.35);cursor:pointer;margin-top:-1px}
.rech-inrow input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:99px}
.rech-inrow input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--lime);border:3px solid var(--surface-2);cursor:pointer}
.rech-inrow input[type=range]::-moz-range-track{height:6px;border-radius:99px;background:var(--line-strong)}
.rech-inrow input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px color-mix(in srgb,var(--lime) 45%,transparent)}
/* ---------- Pläne-Galerie + Lightbox ---------- */
.plan-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(212px,1fr));gap:14px}
.plan{cursor:pointer;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--surface);transition:border-color .15s,transform .15s,box-shadow .15s}
.plan:hover{border-color:var(--accent-ink);transform:translateY(-2px);box-shadow:var(--shadow)}
.plan-img{aspect-ratio:4/3;background:#fff;overflow:hidden}
.plan-img img{width:100%;height:100%;object-fit:cover;object-position:top center}
.plan figcaption{display:flex;align-items:center;gap:8px;padding:10px 12px}
.plan figcaption b{font-weight:700;font-size:12.5px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.plan-cat{color:var(--ink-faint);font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;flex:0 0 auto}
.plan-zoom{margin-left:auto;color:var(--ink-faint);flex:0 0 auto;display:flex}
.plan-zoom svg{width:15px;height:15px}
.lb{position:fixed;inset:0;background:rgba(8,9,7,.93);z-index:80;display:none;flex-direction:column}
.lb.open{display:flex}
.lb-bar{display:flex;align-items:center;gap:12px;padding:14px 18px;color:#fff;flex:0 0 auto}
.lb-cap{font-weight:700;font-size:13.5px}
.lb-x{margin-left:auto;cursor:pointer;color:#fff;display:flex}
.lb-x svg{width:24px;height:24px}
.lb-stage{flex:1 1 auto;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:8px;min-height:0;cursor:grab}
.lb-stage.grab{cursor:grabbing}
.lb-stage img{max-width:100%;max-height:100%;object-fit:contain;background:#fff;border-radius:6px;user-select:none;-webkit-user-drag:none;will-change:transform}
.lb-ctrl{display:flex;align-items:center;gap:10px;padding:12px 18px;color:rgba(255,255,255,.65);font-size:12px;flex:0 0 auto;flex-wrap:wrap}
.lb-ctrl button{min-width:40px;height:38px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;border-radius:9px;font-size:19px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center}
.lb-ctrl button.lb-reset{padding:0 14px;font-size:13px;font-weight:700}
.lb-ctrl button svg{width:18px;height:18px}
.lb-ctrl button:hover{background:rgba(255,255,255,.16)}
.lb-nav{position:fixed;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;border:none;background:rgba(255,255,255,.15);color:#fff;font-size:26px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.lb-prev{left:14px}.lb-next{right:14px}
.lb-nav:hover{background:rgba(255,255,255,.28)}
.lb-hint{color:rgba(255,255,255,.55);font-size:11.5px;margin-left:4px}
@media(max-width:600px){.lb-hint{display:none}}
@media(max-width:600px){.plan-grid{grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:10px}.lb-nav{width:40px;height:40px}.plan-cat{display:none}.plan figcaption b{white-space:normal}}
/* Projekt-Zeitachse */
.tl{position:relative;padding:22px 0 2px}
/* MOTION: die Punkte bauen sich beim Hineinscrollen auf, die Strahllinie
   waechst mit. Ohne Bewegung (Systemeinstellung) steht sofort alles da —
   die Reihenfolge ist Gestaltung, nie Voraussetzung fuer die Lesbarkeit. */
.tl-row{opacity:1;transform:none}
/* MOTION fuer Kennzahlen und Diagramme.
   GRUNDSATZ: der Ausgangszustand wird NUR vom Skript gesetzt. Ohne Skript,
   ohne Beobachter oder mit abgeschalteter Bewegung ist jede Kachel sofort da.
   Eine Seite, deren Inhalt an einer Animation haengt, ist bei jedem Aussetzer
   leer — und leer sieht aus wie kaputt. */
.mo{transition:opacity .5s var(--ease,ease),transform .5s var(--ease,ease)}
.mo-aus{opacity:0;transform:translateY(12px)}
.mo-an{opacity:1;transform:none}
.barfill{transition:width .8s cubic-bezier(.22,.61,.36,1)}
.donut circle{transition:stroke-dasharray .9s cubic-bezier(.22,.61,.36,1)}
@media(prefers-reduced-motion:reduce){
 .mo,.barfill,.donut circle{transition:none}
 .mo-aus{opacity:1;transform:none}
}
.tl.tl-motion .tl-row{opacity:0;transform:translateY(10px);transition:opacity .42s var(--ease,ease),transform .42s var(--ease,ease)}
.tl.tl-motion .tl-row.tl-an{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.tl.tl-motion .tl-row{opacity:1;transform:none;transition:none}}
.tl-row{display:grid;grid-template-columns:118px 30px 1fr;align-items:start}
.tl-date{font-size:12.5px;color:var(--ink-soft);text-align:right;padding:0 14px 0 0;white-space:nowrap;line-height:18px}
.tl-mark{position:relative;display:flex;justify-content:center}
.tl-mark::before{content:'';position:absolute;top:2px;bottom:-4px;left:50%;width:2px;transform:translateX(-50%);
 background:linear-gradient(to bottom,var(--c,var(--line-strong)) 0%,var(--line-strong) 62%,var(--line-strong) 100%)}
.tl.tl-motion .tl-mark::before{transform:translateX(-50%) scaleY(0);transform-origin:top;transition:transform .42s var(--ease,ease) .08s}
.tl.tl-motion .tl-row.tl-an .tl-mark::before{transform:translateX(-50%) scaleY(1)}
@media(prefers-reduced-motion:reduce){.tl.tl-motion .tl-mark::before{transform:translateX(-50%);transition:none}}
.tl-row:first-child .tl-mark::before{top:9px}
.tl-row:last-child .tl-mark::before{display:none}
.tl-dot{position:relative;z-index:1;width:14px;height:14px;border-radius:50%;background:var(--c);margin-top:2px;box-shadow:0 0 0 4px var(--surface)}
.tl-row.open .tl-dot{background:var(--surface);border:2px solid var(--c)}
/* Farbe des Punkts ueber ein Datenattribut statt Inline-Stil: unter einer CSP
   ohne unsafe-inline ist style="" tot, und die Zeile saehe still grau aus. */
.tl-row[data-farbe="good"]{--c:var(--good)}.tl-row[data-farbe="warn"]{--c:var(--warn)}
.tl-row[data-farbe="bad"]{--c:var(--bad)}.tl-row[data-farbe="info"]{--c:var(--info)}
.tl-row[data-farbe="mut"]{--c:var(--ink-faint)}
.tl-body{padding:0 0 20px 14px}
.tl-body b{display:block;font-size:14px;line-height:1.35}
.tl-row.open .tl-body b{color:var(--warn)}
.tl-sub{display:block;font-size:12.5px;color:var(--ink-soft);margin-top:2px}
@media(max-width:600px){.tl-row{grid-template-columns:84px 26px 1fr}.tl-date{font-size:11px;padding-right:9px}.tl-body b{font-size:13.5px}}
/* ---------- Geo-Wert-Cockpit ---------- */
.geo-wrap{display:grid;grid-template-columns:1.45fr 1fr}
.geo-map{height:480px;min-height:300px;background:var(--surface-2);z-index:0}
.geo-map.leaflet-container{font-family:var(--sans);background:var(--surface-2)}
.geo-side{padding:18px 20px;border-left:1px solid var(--line);min-width:0}
.geo-kpis{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.geo-src{margin-top:15px;font-size:11px;color:var(--ink-faint);line-height:1.5}
.leaflet-control-layers{background:var(--surface)!important;color:var(--ink);border:1px solid var(--line-strong)!important;border-radius:12px!important;box-shadow:var(--shadow)!important;padding:5px 3px!important;font-family:var(--sans);font-size:12.5px}
.leaflet-control-layers-toggle{background-color:var(--surface)!important;border:1px solid var(--line-strong)!important;border-radius:10px!important}
.leaflet-control-layers-list{padding:2px 7px}
.leaflet-control-layers label{display:flex;align-items:center;gap:8px;padding:5px 7px;border-radius:8px;color:var(--ink-soft);font-weight:600;cursor:pointer;margin:0}
.leaflet-control-layers label:hover{background:var(--surface-2);color:var(--ink)}
.leaflet-control-layers label span{display:flex;align-items:center;gap:8px}
.leaflet-control-layers input{accent-color:var(--lime);width:14px;height:14px;margin:0}
.leaflet-control-layers-separator{border-top:1px solid var(--line);margin:5px 5px}
.leaflet-bar{border:1px solid var(--line-strong)!important;border-radius:10px!important;overflow:hidden;box-shadow:var(--shadow)!important}
.leaflet-bar a{background:var(--surface);color:var(--ink-soft);border-bottom:1px solid var(--line)}
.leaflet-bar a:hover{background:var(--surface-2);color:var(--ink)}
.leaflet-control-attribution{background:color-mix(in srgb,var(--surface) 84%,transparent)!important;color:var(--ink-faint)!important;font-size:10px}
.leaflet-control-attribution a{color:var(--accent-ink)!important}
.leaflet-attribution-flag{display:none!important}
.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:var(--surface)!important;color:var(--ink)!important;box-shadow:var(--shadow)!important}
@media(max-width:820px){.geo-wrap{grid-template-columns:1fr}.geo-map{height:340px}.geo-side{border-left:none;border-top:1px solid var(--line)}}
@media(max-width:600px){.geo-kpis{grid-template-columns:1fr 1fr}}
/* ---------- Projekt-Erlebnis Showcase ---------- */
.show-stage{position:relative;aspect-ratio:16/9;border-radius:16px;border:1px solid var(--line);background:radial-gradient(120% 130% at 50% 0%,var(--surface-2),var(--surface-3));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:20px}
.show-stage .sicon{color:var(--ink-faint)}
.show-stage .sicon svg{width:60px;height:60px}
.show-stage b{font-family:var(--disp);font-size:19px;color:var(--ink)}
.show-stage>span:not(.show-badge):not(.sicon){font-size:12.5px;color:var(--ink-faint);max-width:420px}
.show-badge{position:absolute;top:14px;left:14px;font-size:10.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;background:var(--surface);border:1px solid var(--line-strong);color:var(--ink-soft);border-radius:99px;padding:5px 11px}
.cam-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:14px}
.cam{position:relative;aspect-ratio:16/9;border-radius:14px;border:1px solid var(--line);background:linear-gradient(135deg,#1c1e22,#101113);display:flex;align-items:center;justify-content:center;overflow:hidden}
.cam .cam-ic{color:rgba(255,255,255,.45);display:flex}
.cam .cam-lbl{position:absolute;bottom:9px;left:11px;font-size:11px;font-weight:700;color:rgba(255,255,255,.72)}
.cam .cam-live{position:absolute;top:9px;right:9px;font-size:9.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;background:rgba(255,255,255,.13);color:rgba(255,255,255,.65);border-radius:99px;padding:2px 8px}
.feat-list{display:grid;gap:11px;padding-top:18px}
.feat-list .fl{display:flex;gap:11px;align-items:flex-start;font-size:13.5px;color:var(--ink)}
.feat-list .fl .fi{flex:0 0 auto;width:22px;height:22px;border-radius:7px;background:var(--rail-active);color:var(--accent-ink);display:flex;align-items:center;justify-content:center;margin-top:1px}
.feat-list .fl .fi svg{width:14px;height:14px}
.erlebnis-intro{margin-bottom:26px}
.erlebnis-intro .lede{margin-top:12px;max-width:760px}
/* Leistungsbausteine */
.baustein-grid{display:grid;padding-top:6px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.baustein{display:flex;gap:14px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px}
.baustein .bs-ic{flex:0 0 auto;width:40px;height:40px;border-radius:11px;background:var(--rail-active);color:var(--accent-ink);display:flex;align-items:center;justify-content:center}
.baustein .bs-body{min-width:0}
.baustein .bs-body b{font-family:var(--disp);font-size:15.5px;display:block;margin-bottom:5px}
.baustein .bs-body p{font-size:13px;color:var(--ink-soft);line-height:1.5;margin-bottom:10px}
.nutzen-row{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:11px}
.nutzen{font-size:10.5px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;background:var(--surface-3);color:var(--ink-soft);border-radius:99px;padding:3px 9px}
.bs-cta{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:var(--accent-ink);cursor:pointer}
.bs-cta:hover{text-decoration:underline}
.bs-cta svg{width:13px;height:13px}
/* Kamera-Grid + Kacheln */
.cam-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:34px 0 14px;flex-wrap:wrap}
.cam-switch{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-faint)}
.cam-switch button{width:32px;height:30px;border:1px solid var(--line-strong);background:var(--surface);color:var(--ink-soft);border-radius:8px;font-weight:700;font-size:12.5px;cursor:pointer}
.cam-switch button.on{background:var(--lime);color:var(--on-lime);border-color:var(--lime)}
.cam-grid{display:grid;gap:14px}
.cam-grid.cols-1{grid-template-columns:1fr}.cam-grid.cols-2{grid-template-columns:repeat(2,1fr)}.cam-grid.cols-3{grid-template-columns:repeat(3,1fr)}.cam-grid.cols-4{grid-template-columns:repeat(4,1fr)}
.cam{position:relative;aspect-ratio:16/9;border-radius:14px;border:1px solid var(--line);overflow:hidden;cursor:pointer;background:#101113}
.cam img{width:100%;height:100%;object-fit:cover;transition:transform .2s}
.cam:hover img{transform:scale(1.05)}
.cam .cam-lbl{position:absolute;bottom:9px;left:11px;font-size:11px;font-weight:700;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.cam .cam-live{position:absolute;top:9px;left:9px;font-size:9.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;background:rgba(207,221,40,.92);color:#26282C;border-radius:99px;padding:2px 8px}
.cam .cam-full{position:absolute;top:8px;right:8px;color:#fff;opacity:.85;display:flex}
.cam .cam-full svg{width:17px;height:17px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}
@media(max-width:640px){.cam-grid.cols-3,.cam-grid.cols-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:420px){.cam-grid.cols-2,.cam-grid.cols-3,.cam-grid.cols-4{grid-template-columns:1fr}}
/* Kamera-Vollbild */
.camv{position:fixed;inset:0;background:#0a0b0c;z-index:82;display:none;flex-direction:column}
.camv.open{display:flex}
.camv-bar{display:flex;align-items:center;gap:12px;padding:14px 18px;color:#fff;flex:0 0 auto}
.camv-cap{font-weight:700;font-size:14px}
.camv-badge{font-size:10px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;background:rgba(255,255,255,.14);color:#fff;border-radius:99px;padding:3px 9px}
.camv-x{margin-left:auto;cursor:pointer;color:#fff;display:flex}.camv-x svg{width:24px;height:24px}
.camv-stage{flex:1 1 auto;overflow:hidden;display:flex;align-items:center;justify-content:center;min-height:0;cursor:grab;background:#000}
.camv-stage.grab{cursor:grabbing}
.camv-stage img{max-width:100%;max-height:100%;user-select:none;-webkit-user-drag:none;will-change:transform}
.camv-ctrl{display:flex;align-items:center;gap:10px;padding:12px 18px;color:rgba(255,255,255,.65);font-size:12px;flex:0 0 auto}
.camv-ctrl button{width:40px;height:38px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;border-radius:9px;font-size:19px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center}
.camv-ctrl button.camv-reset{width:auto;padding:0 14px;font-size:13px;font-weight:700}
.camv-ctrl button:hover{background:rgba(255,255,255,.16)}
.camv-hint{margin-left:6px}
@media(max-width:600px){.camv-hint{display:none}}
/* ==== Mobile Header + Off-Canvas Navigation (Override, muss zuletzt stehen) ==== */
@media(max-width:1000px){
 .app,.app.railmin{grid-template-columns:1fr}
 .content{padding:22px 16px 92px}
 .topbar-inner{padding:11px 14px;gap:10px}
 .tb-burger{display:flex}
 .tb-title{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .tb-sub{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 #globeBtn,#askBtn{display:none}
 .ask-fab{display:flex}
 .rail{display:flex;position:fixed;left:0;top:0;bottom:0;height:100dvh;width:min(310px,86vw);transform:translateX(-100%);transition:transform .24s ease;z-index:70;box-shadow:0 0 44px rgba(0,0,0,.5)}
 .rail.open{transform:none}
 .nav-back.open{display:block}
 .rail-ctl{display:flex;align-items:center;gap:8px;margin:2px 0 8px}
 /* Auf Mobil ist die Leiste eine Schublade mit min(310px,86vw) und demselben
    seitlichen Polster von 14px — das Drop-up fluchtet mit ihren Eintraegen
    statt ueber ihre Kante hinauszustehen. */
 .dropup{left:14px;width:calc(min(310px,86vw) - 28px)}
}
@media(max-width:600px){
 .card-head{flex-direction:column;align-items:flex-start;gap:3px;padding:15px 16px}
 .card-head .hint{white-space:normal}
 .card-head h3{font-size:15.5px;line-height:1.25}
 .card-body{padding-left:16px;padding-right:16px}
}
@media(max-width:520px){.topbar-inner{gap:8px}.btn-cta{padding:9px 13px}}
@media(max-width:360px){.cta-txt{display:none}.btn-cta{padding:9px 12px}}
/* Kennzahlen & Grafiken */
.ch-head{padding:16px 22px 0}
.ch-head h3{font-family:var(--disp);font-weight:800;font-size:15.5px;letter-spacing:-.01em;line-height:1.25;margin:0}
.ch-sub{margin:5px 0 0;font-size:12px;color:var(--ink-faint);line-height:1.4;max-width:62ch}
#view .two-col+.card{margin-top:16px}
#view .card+.section-label,#view .two-col+.section-label{margin-top:30px}
:root{--s-roerig:#3987e5;--s-wewelsburger:#eb6834;--s-silberbrink:#199e70}
:root[data-theme="light"]{--s-roerig:#2a78d6;--s-wewelsburger:#d95926;--s-silberbrink:#1baf7a}
.hbars{display:flex;flex-direction:column;gap:12px;padding:6px 0 2px}
.bar-row{display:grid;grid-template-columns:122px 1fr auto;align-items:center;gap:12px}
.barlbl{font-size:12.5px;color:var(--ink-soft);text-align:right;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bartrack{position:relative;height:22px;background:var(--surface-3);border-radius:6px;overflow:hidden}
.barfill{position:absolute;top:0;bottom:0;left:0;border-radius:6px;min-width:3px;transition:width .55s cubic-bezier(.4,0,.2,1)}
.bar-end{font-size:13px;font-weight:700;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums;min-width:98px;text-align:right}
.bar-pct{font-size:11px;font-weight:600;color:var(--ink-faint)}
.stack{display:flex;height:22px;border-radius:6px;overflow:hidden;gap:2px;background:var(--surface-3)}
.stk-seg{min-width:3px;transition:flex-grow .5s}
.gsub{margin-top:14px}.gsub:first-child{margin-top:0}
.gsub-h{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:var(--ink-soft);margin-bottom:8px}
.gsub-h .sw{width:10px;height:10px;border-radius:3px}
.donut-wrap{display:flex;align-items:center;gap:22px;flex-wrap:wrap;padding:6px 0}
.donut{width:148px;height:148px;flex:0 0 auto}
.donut-big{fill:var(--ink);font-size:21px;font-weight:800;text-anchor:middle;font-family:inherit}
.donut-small{fill:var(--ink-faint);font-size:9px;text-anchor:middle;letter-spacing:.09em;text-transform:uppercase}
.dlegs{display:flex;flex-direction:column;gap:9px;flex:1;min-width:190px}
.dleg{display:grid;grid-template-columns:14px 1fr auto;align-items:center;gap:9px}
.dleg .sw{width:12px;height:12px;border-radius:3px}
.dleg-l{font-size:13px;color:var(--ink-soft)}
.dleg-v{font-size:13px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
/* SSR-Dokument */
.doc-compare{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
.doc-side{min-width:0}
.doc-tag{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:9px}
.doc-frame{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.doc-frame img{width:100%;display:block}
.ssr-doc{border:1px solid var(--line-strong);border-radius:12px;background:var(--surface);overflow:hidden}
.ssr-doc-head{padding:16px 18px;border-bottom:2px solid var(--lime);display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.ssr-doc-head h4{font-size:15.5px;margin:0 0 3px}
.ssr-doc-head .sd-sub{font-size:11.5px;color:var(--ink-soft)}
.ssr-doc-head .sd-brand{font-size:11px;font-weight:800;letter-spacing:.14em;color:var(--lime);white-space:nowrap}
.ssr-doc table{width:100%;border-collapse:collapse;font-size:12px}
.ssr-doc th{text-align:left;padding:8px 18px;font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-faint);border-bottom:1px solid var(--line)}
.ssr-doc td{padding:6px 18px;border-bottom:1px solid var(--line)}
.ssr-doc .sd-group td{background:var(--surface-2);font-weight:700;color:var(--ink);font-size:11px;letter-spacing:.03em}
.ssr-doc .sd-sum td{font-weight:800;color:var(--lime);border-bottom:1px solid var(--line-strong)}
.ssr-doc .r{text-align:right;font-variant-numeric:tabular-nums}
.ssr-doc-foot{padding:11px 18px;font-size:10.5px;color:var(--ink-faint);display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.sd-actions{display:flex;gap:10px;margin:14px 0 2px;flex-wrap:wrap}
.btn-lime{display:inline-flex;align-items:center;gap:8px;border:none;background:var(--lime);color:var(--on-lime);font-family:var(--sans);font-size:13px;font-weight:800;padding:9px 16px;border-radius:10px;cursor:pointer}
.btn-ghost{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line-strong);background:var(--surface);color:var(--ink-soft);font-family:var(--sans);font-size:13px;font-weight:700;padding:9px 16px;border-radius:10px;cursor:pointer}
.btn-lime svg.i,.btn-ghost svg.i{width:15px;height:15px}
@media(max-width:860px){.doc-compare{grid-template-columns:1fr}}
@media(max-width:600px){.bar-row{grid-template-columns:84px 1fr auto;gap:9px}.bar-end{min-width:76px;font-size:12px}.donut-wrap{gap:14px}}
@media print{.rail,.topbar,.tabbar,#askFab,.fab,.backlink,.section-label,.footnote,.doc-orig,.sd-actions,.statusline,.lede,.hero{display:none!important}.doc-compare{display:block}.ssr-doc{border:none}.main,#view{margin:0!important;padding:0!important}}
/* SSR-Dokument-Varianten (paper-like, CI-fixiert) */
.doc-orig-full{display:flex;justify-content:flex-start}
.doc-orig-full .doc-frame{max-width:600px;width:100%}
.vpick{display:flex;flex-direction:column;gap:30px}
.vitem{display:flex;flex-direction:column;gap:12px}
.vlabel{display:flex;align-items:center;gap:11px}
.vlabel .vnum{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:var(--lime);color:var(--on-lime);font-size:12px;font-weight:800;flex:0 0 auto}
.vlabel .vname{font-size:14px;font-weight:800;color:var(--ink)}
.vlabel .vdesc{font-size:12.5px;color:var(--ink-faint)}
.vlabel .vbtn{margin-left:auto;padding:6px 13px;font-size:12px}
.vdoc{--dink:#1a1c1e;--dmut:#6b6e76;--dline:#e4e6dd;--dlime:#CFDD28;--dpaper:#fff;--dpaper2:#f6f7f0;
 background:var(--dpaper);color:var(--dink);border:1px solid var(--line-strong);border-radius:12px;overflow:hidden;font-size:12.5px;box-shadow:0 6px 26px rgba(0,0,0,.16)}
.vdoc table{width:100%;border-collapse:collapse}
.vdoc td,.vdoc th{padding:6px 22px}
.vdoc thead th{text-align:left;font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--dmut);border-bottom:1px solid var(--dline);padding-top:11px;padding-bottom:8px}
.vdoc thead th.r,.vdoc .r{text-align:right;font-variant-numeric:tabular-nums}
.vdoc tbody tr td{border-bottom:1px solid var(--dline)}
.vdoc .u-name{padding-left:34px;font-weight:600}
.vdoc .g-haus td{background:var(--dink);color:#fff;font-weight:800;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;padding:8px 22px}
.vdoc .g-geschoss td{background:var(--dpaper2);color:var(--dink);font-weight:700;font-size:11px;padding:6px 22px 6px 34px}
.vdoc .g-sum td{font-weight:800;color:var(--dink);border-top:2px solid var(--dlime);border-bottom:none;background:var(--dpaper)}
.vdoc .g-total td{background:var(--dlime);color:#26282c;font-weight:800;font-size:14px;padding:12px 22px}
.vdoc .vfoot{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:12px 22px;font-size:10px;color:var(--dmut);border-top:1px solid var(--dline);background:var(--dpaper2)}
/* V1 Geschäftsbrief */
.v1 .v1-head{display:flex;justify-content:space-between;align-items:flex-start;padding:24px 22px 15px;gap:16px}
.v1 .v1-logo{height:30px;width:auto}
.v1 .v1-sender{font-size:10.5px;color:var(--dmut);text-align:right;line-height:1.55}
.v1 .v1-sender b{color:var(--dink)}
.v1 .v1-rule{height:3px;background:var(--dlime);margin:0 22px}
.v1 .v1-title{padding:15px 22px 4px}
.v1 .v1-title h4{font-size:19px;margin:0;color:var(--dink);letter-spacing:-.01em}
.v1 .v1-meta{display:flex;gap:20px;flex-wrap:wrap;padding:4px 22px 15px;font-size:11px;color:var(--dmut)}
.v1 .v1-meta b{color:var(--dink)}
/* V2 Editorial */
.v2{display:flex}
.v2-band{width:46px;background:var(--dlime);flex:0 0 auto;display:flex;align-items:flex-end;justify-content:center;padding-bottom:22px}
.v2-band span{writing-mode:vertical-rl;transform:rotate(180deg);font-weight:900;letter-spacing:.32em;font-size:13px;color:#26282c}
.v2-main{flex:1;min-width:0}
.v2 .v2-h{padding:24px 24px 6px}
.v2 .v2-kick{font-size:10.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#8a9000}
.v2 .v2-h h4{font-size:25px;margin:7px 0 3px;color:var(--dink);line-height:1.08;letter-spacing:-.02em}
.v2 .v2-sub{font-size:12px;color:var(--dmut)}
.v2 .v2-kpis{display:flex;gap:10px;padding:12px 24px 16px;flex-wrap:wrap}
.v2 .v2-kpi{flex:1;min-width:118px;border:1px solid var(--dline);border-radius:9px;padding:11px 13px}
.v2 .v2-kpi .k{font-size:9.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--dmut)}
.v2 .v2-kpi .v{font-size:19px;font-weight:800;color:var(--dink);margin-top:2px}
.v2 .v2-main td,.v2 .v2-main th{padding-left:24px}
/* V3 Datenblatt */
.v3 .v3-head{padding:20px 22px 12px}
.v3 .v3-brand{display:flex;align-items:center;gap:11px}
.v3 .v3-brand img{height:22px;width:auto}
.v3 .v3-brand .v3-t{font-size:11px;font-weight:800;letter-spacing:.14em;color:var(--dmut)}
.v3 .v3-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--dline);border:1px solid var(--dline);border-radius:8px;overflow:hidden;margin-top:14px}
.v3 .v3-cell{background:var(--dpaper);padding:9px 13px}
.v3 .v3-cell .k{font-size:9px;text-transform:uppercase;letter-spacing:.05em;color:var(--dmut)}
.v3 .v3-cell .v{font-size:14px;font-weight:800;color:var(--dink);margin-top:1px}
.v3 tbody tr:nth-child(even) td{background:var(--dpaper2)}
.v3 td,.v3 th{padding-top:5px;padding-bottom:5px}
/* V4 Premium Dunkel */
.v4{--dink:#f1f1ee;--dmut:#a6a89f;--dline:#2c2e24;--dpaper:#15160f;--dpaper2:#1c1d15;border-color:#2c2e24}
.v4 .g-haus td{background:#23251a;color:var(--dlime)}
.v4 .g-geschoss td{background:var(--dpaper2);color:var(--dink)}
.v4 .g-sum td{background:var(--dpaper)}
.v4 .v4-head{display:flex;justify-content:space-between;align-items:flex-start;padding:26px 24px 18px;gap:16px}
.v4 .v4-head img{height:26px;width:auto}
.v4 .v4-head h4{font-size:20px;margin:0;color:#fff;letter-spacing:-.01em}
.v4 .v4-head .v4-sub{font-size:11.5px;color:var(--dmut);margin-top:3px}
.v4 .v4-big{text-align:right}
.v4 .v4-big .n{font-size:27px;font-weight:800;color:var(--dlime)}
.v4 .v4-big .l{font-size:9.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--dmut)}
/* V5 Prospekt */
.v5 .v5-hero{background:var(--dlime);padding:22px 24px}
.v5 .v5-hero .v5-brand{font-size:11px;font-weight:900;letter-spacing:.16em;color:#26282c}
.v5 .v5-hero h4{font-size:24px;margin:9px 0 3px;color:#1a1c1e;line-height:1.08;letter-spacing:-.02em}
.v5 .v5-hero .v5-sub{font-size:12px;color:#3c3f2c}
.v5 .v5-intro{padding:16px 24px 4px;font-size:12.5px;color:var(--dmut);line-height:1.55}
/* Accordion (Dropdown) + scrollbare Aufstellung */
.acc{border:1px solid var(--line);border-radius:12px;background:var(--surface);margin:16px 0;overflow:hidden}
.acc>summary{list-style:none;cursor:pointer;padding:15px 18px;display:flex;align-items:center;gap:10px;font-size:14px;font-weight:800;color:var(--ink);user-select:none}
.acc>summary::-webkit-details-marker{display:none}
.acc>summary::after{content:'';margin-left:auto;width:9px;height:9px;border-right:2px solid var(--ink-faint);border-bottom:2px solid var(--ink-faint);transform:rotate(45deg);transition:transform .2s;flex:0 0 auto}
.acc[open]>summary::after{transform:rotate(-135deg)}
.acc>summary .accsub{font-weight:600;font-size:12.5px;color:var(--ink-faint)}
.acc[open]>summary{border-bottom:1px solid var(--line)}
.acc-body{padding:16px 18px 18px}
.doc-scroll{max-height:520px;overflow-y:auto;border:1px solid var(--line);border-radius:10px;margin-top:10px}
.doc-scroll table{width:100%;border-collapse:collapse;font-size:12.5px}
.doc-scroll th{position:sticky;top:0;background:var(--surface-2);text-align:left;padding:9px 14px;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-faint);border-bottom:1px solid var(--line);z-index:1}
.doc-scroll td{padding:7px 14px;border-bottom:1px solid var(--line)}
.doc-scroll .r{text-align:right;font-variant-numeric:tabular-nums}
.doc-scroll tr:last-child td{border-bottom:none}
@media(max-width:600px){.vdoc td,.vdoc th{padding-left:12px;padding-right:12px}.vdoc .u-name{padding-left:20px}.vdoc .g-geschoss td{padding-left:20px}.v1 .v1-head,.v1 .v1-meta,.v1 .v1-title{padding-left:14px;padding-right:14px}.v2-band{width:34px}.vlabel .vdesc{display:none}}
@media print{body.printing .app>*{display:none!important}body.printing #view .vdoc:not(.print-active){display:none!important}body.printing #view>*:not(.vpick){display:none!important}body.printing .vpick>.vitem:not(:has(.print-active)){display:none!important}body.printing .vlabel{display:none!important}body.printing .vdoc.print-active{box-shadow:none;border:none;margin:0}body.printing #view,body.printing .main,body.printing .app{display:block!important;margin:0!important;padding:0!important;overflow:visible!important}}
/* ---------- Datenraum · Inline-Dokument-Vorschau (nativer Browser-PDF-Viewer, kein externes Tool) ---------- */
.dpv{position:fixed;inset:0;background:rgba(8,9,7,.94);z-index:82;display:none;flex-direction:column}
.dpv.open{display:flex}
.dpv-bar{display:flex;align-items:center;gap:12px;padding:12px 18px;color:#fff;flex:0 0 auto}
.dpv-cap{font-weight:700;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.dpv-act{margin-left:auto;display:flex;gap:12px;align-items:center;flex:0 0 auto}
.dpv-dl{color:#17181a;background:#CFDD28;border-radius:8px;padding:7px 13px;font-weight:700;font-size:12.5px;text-decoration:none;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.dpv-x{cursor:pointer;color:#fff;display:flex}
.dpv-stage{flex:1;min-height:0;background:#232420;margin:0 14px 14px;border-radius:10px;overflow:hidden}
.dpv-stage iframe{width:100%;height:100%;border:0;background:#fff;display:block}
.docrow .doclink.prev{margin-right:2px}
@media(max-width:600px){.dpv-cap{font-size:12px}.dpv-dl span{display:none}}
/* ---------- Rendite · manuelle Eigen-Annahme ---------- */
.rech-manual{margin-top:16px;border-top:1px dashed var(--line);padding-top:14px}
.rm-head{display:flex;align-items:center;gap:8px;font-weight:700;font-size:13px;flex-wrap:wrap}
.rm-head .rm-sub{font-weight:500;color:var(--ink-faint);font-size:12px}
.rm-badge{margin-left:auto;background:#CFDD28;color:#17181a;border-radius:999px;padding:3px 10px;font-size:11px;font-weight:700}
.rm-grid{display:flex;gap:14px;flex-wrap:wrap;align-items:flex-end;margin-top:10px}
.rm-grid label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:var(--ink-soft)}
.rm-inw{display:flex;align-items:center;gap:6px;background:var(--surface-2);border:1px solid var(--line);border-radius:8px;padding:2px 10px}
.rm-inw input{width:104px;border:0;background:transparent;color:var(--ink);font-size:14px;padding:7px 0;font-variant-numeric:tabular-nums}
.rm-inw input:focus{outline:none}
.rm-inw span{font-size:11.5px;color:var(--ink-faint);white-space:nowrap}
.rm-reset{background:transparent;border:1px solid var(--line);color:var(--ink-soft);border-radius:8px;padding:9px 12px;font-size:12px;cursor:pointer}
.rm-reset:hover{border-color:var(--ink-faint)}
/* ---------- Datenraum · Teilen & Rollen (Vorschau, Backend offen) ---------- */
.share-presets{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 4px}
.sp{border:1px solid var(--line);border-radius:999px;padding:6px 12px;font-size:12.5px;color:var(--ink-soft);background:var(--surface-2);display:inline-flex;gap:6px;align-items:center}
.share-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-top:14px}
.share-form label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:var(--ink-soft)}
.share-form input,.share-form select{background:var(--surface-2);border:1px solid var(--line);border-radius:8px;padding:9px 10px;color:var(--ink);font-size:13px}
.share-form input:disabled,.share-form select:disabled{opacity:.55;cursor:not-allowed}
.share-tblwrap{overflow-x:auto;margin-top:6px}
.share-tbl{width:100%;border-collapse:collapse;font-size:12.5px;min-width:520px}
.share-tbl th,.share-tbl td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
.share-tbl th{color:var(--ink-faint);font-size:10.5px;text-transform:uppercase;letter-spacing:.05em}
.share-tbl .rl{display:inline-block;background:var(--surface-2);border:1px solid var(--line);border-radius:6px;padding:2px 8px;font-size:11.5px}
/* ---------- 3D-Zwilling Upload-Slot ---------- */
.d3-up{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:14px}
.d3-btn{border:1px dashed var(--line);border-radius:10px;padding:12px 16px;color:var(--ink-soft);background:var(--surface-2);cursor:pointer;font-size:13px;display:inline-flex;gap:8px;align-items:center;font-weight:600}
.d3-btn:hover{border-color:var(--ink-faint);color:var(--ink)}
.d3-note{font-size:12px;color:var(--ink-faint)}
.show-stage.empty{opacity:.72}
/* ---------- NOVA · Sprache + Aktionsrahmen ---------- */
.nova-voice{margin-left:auto;background:transparent;border:1px solid var(--line);color:var(--ink-faint);border-radius:99px;width:36px;height:30px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.nova-voice.on{color:var(--on-lime);background:var(--lime);border-color:var(--lime)}
.ai-head .nova-voice+.ai-x{margin-left:10px}
.nova-mic{border:1px solid var(--line-strong);background:var(--surface-2);color:var(--ink-soft);border-radius:99px;width:44px;flex:0 0 auto;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0}
.nova-mic.rec{background:var(--lime);color:var(--on-lime);border-color:var(--lime);animation:novapulse 1.1s infinite}
@keyframes novapulse{0%,100%{opacity:1}50%{opacity:.5}}
.nova-kpis{display:flex;flex-wrap:wrap;gap:8px;padding:0 20px}
.nova-kpis:not(:empty){padding:12px 20px;border-bottom:1px solid var(--line)}
.nkpi{display:inline-flex;align-items:center;gap:7px;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:7px 10px;font-size:12px}
.nkpi b{font-variant-numeric:tabular-nums}
.nkpi .nklbl{color:var(--ink-soft)}
.nkpi .nkx{cursor:pointer;color:var(--ink-faint);font-weight:700;margin-left:1px}
/* ---------- Konto & Credits (Callfluence-Stil, SSR-CI) ---------- */
.credit-card{background:var(--rail-panel);border:1px solid var(--rail-line);border-radius:12px;padding:12px;margin:2px 4px 6px}
.cc-row{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.cc-lbl{font-size:.66rem;color:var(--rail-ink-soft);text-transform:uppercase;letter-spacing:.06em;font-weight:800}
.cc-bal{color:var(--rail-ink)}.cc-bal b{font-family:var(--disp);font-size:19px;font-weight:800}.cc-bal span{font-size:11px;color:var(--rail-ink-soft)}
.cc-sub{font-size:11px;color:var(--rail-ink-soft);margin-top:3px}
.cc-btn{margin-top:10px;width:100%;background:var(--lime);color:var(--on-lime);border:none;border-radius:9px;padding:9px;font-weight:800;font-size:12.5px;cursor:pointer}
.nova-cred{margin-left:auto;background:var(--surface-2);border:1px solid var(--line);border-radius:99px;padding:4px 10px;font-size:11.5px;color:var(--ink-soft);cursor:pointer;white-space:nowrap}
.nova-cred b{color:var(--ink);font-variant-numeric:tabular-nums}
.ai-head .nova-cred+.nova-voice{margin-left:8px}
.ai-head .nova-voice+.ai-x{margin-left:10px}
.topup{position:fixed;inset:0;background:rgba(8,9,7,.72);z-index:90;display:none;align-items:center;justify-content:center;padding:20px}
.topup.open{display:flex}
.topup-card{background:var(--surface);border:1px solid var(--line);border-radius:16px;max-width:450px;width:100%;padding:22px;box-shadow:0 24px 70px rgba(0,0,0,.5);max-height:90vh;overflow-y:auto}
.topup-card h3{font-family:var(--disp);font-size:19px;margin:0 0 4px}
.tu-sub{font-size:12.5px;color:var(--ink-faint);margin-bottom:16px}
.tu-pack{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--line);border-radius:11px;padding:12px 14px;margin-bottom:10px}
.tu-pack>div{min-width:0}
.tu-pack .tp-cr{font-family:var(--disp);font-weight:800;font-size:16px}
.tu-pack .tp-eur{font-size:12.5px;color:var(--ink-soft)}
.tu-pack .tp-bonus{font-size:11px;color:var(--accent-ink);font-weight:700}
.tu-buy{background:var(--lime);color:var(--on-lime);border:none;border-radius:8px;padding:9px 14px;font-weight:800;font-size:12px;cursor:pointer;white-space:nowrap;flex:0 0 auto}
.topup-foot{display:flex;justify-content:flex-end;margin-top:6px}
.tu-x{background:transparent;border:1px solid var(--line);border-radius:8px;padding:8px 14px;color:var(--ink-soft);cursor:pointer;font-size:12px}
.tu-note{font-size:11px;color:var(--ink-faint);margin-top:14px;line-height:1.5}
/* ---------- CAD-Vektorpläne (aus DWG konvertiert) ---------- */
.cad-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(212px,1fr));gap:10px}
.cad-card{display:flex;align-items:center;gap:11px;text-align:left;background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:12px 13px;cursor:pointer;color:var(--ink);font:inherit;transition:border-color .12s}
.cad-card:hover{border-color:var(--lime)}
.cad-ic{flex:0 0 auto;width:38px;height:38px;border-radius:9px;background:var(--surface-2);display:flex;align-items:center;justify-content:center;color:var(--accent-ink)}
@supports (background:color-mix(in srgb,red,blue)){.cad-ic{background:color-mix(in srgb,var(--lime) 16%,var(--surface-2))}}
.cad-meta{min-width:0;flex:1}.cad-meta b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cad-cat{font-size:11px;color:var(--ink-faint)}
.cad-open{margin-left:auto;color:var(--ink-faint);flex:0 0 auto}
/* Top-Header Guthaben-Chip (bei Ask AI) + NOVA-Sprech-Hinweis + Konto-Card an Nav-Breite */
.tb-cred{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line-strong);background:var(--surface);border-radius:99px;padding:8px 13px;font-size:12.5px;font-weight:700;color:var(--ink-soft);cursor:pointer;white-space:nowrap}
.tb-cred svg{width:15px;height:15px;color:var(--accent-ink)}
.tb-cred b{color:var(--ink);font-variant-numeric:tabular-nums}
.tb-cred .tb-cred-u{color:var(--ink-faint);font-weight:600}
@media(max-width:600px){.tb-cred .tb-cred-u{display:none}.tb-cred{padding:8px 11px}}
.nova-hint{min-height:0;font-size:11.5px;color:var(--ink-faint);padding:0 20px;text-align:center;transition:color .15s}
.nova-hint.on{color:var(--accent-ink);font-weight:600}
.nova-hint:empty{padding:0}
.credit-card{margin-left:0;margin-right:0}

/* ============================================================
   SENKRECHTER RHYTHMUS — bewusst als LETZTER Block der Datei.
   Gemessen, nicht vermutet: zwischen zwei Karten standen 0 px, und der Abstand
   wechselte je nachdem, ob zufaellig eine Abschnittsbeschriftung dazwischenstand
   (0 / 16 / 30 px im selben Bildlauf). Eine aeltere Einzelregel mit
   #view-Spezifitaet hat jede allgemeinere Angabe ueberschrieben — deshalb steht
   der Rhythmus hier, mit derselben Spezifitaet und nach ihr.
   EINE Regel setzt den Abstand: jeder Block bekommt ihn nach oben. Nur der
   Abstand UNTER einer Abschnittsbeschriftung ist enger, weil Beschriftung und
   zugehoeriger Block zusammengehoeren.
   ============================================================ */
#view.content > * + *{margin-block-start:var(--rhythmus)}
#view.content > .section-label{margin-block-end:0}
#view.content > .section-label + *{margin-block-start:var(--sp-4)}
#view .card + .section-label,
#view .two-col + .section-label{margin-top:var(--rhythmus)}
#view .card + .card{margin-block-start:var(--rhythmus)}

/* Innerhalb eines Rasterfeldes derselbe Rhythmus, nur eine Stufe enger — und
   die erste Beschriftung im Feld ohne Vorabstand, sonst steht die Rasterzeile
   schief. */
#view .raster > * > * + *{margin-block-start:var(--sp-4)}
#view .raster > * > .section-label:first-child{margin-block-start:0}

/* Innenabstaende der Karte an dieselbe Skala. Vorher je Aufrufstelle
   nachjustiert (14 px oben, 20 px unten, teils per Stilangabe im Markup). */
#view .card > .card-head{padding:var(--sp-5) var(--sp-5) 0}
#view .card > .card-body{padding:var(--sp-5)}
#view .card > .card-head + .card-body{padding-block-start:var(--sp-4)}

/* BUEHNE (2026-09-07): Ansichten, die ein Verteiler in einen Zwischenkasten
   zeichnet (SPA-Routen), haengen NICHT direkt unter #view — der Rhythmus oben
   greift dort nicht, die Bloecke kleben aneinander und am Rand. Derselbe
   Rhythmus, eine Ebene tiefer. Die Buehne ist Fokusziel fuer Vorleser, kein
   Bedienelement: kein Ring. */
#view .buehne > * + *{margin-block-start:var(--rhythmus)}
#view .buehne > .section-label{margin-block-end:0}
#view .buehne > .section-label + *{margin-block-start:var(--sp-4)}
#view .buehne > .card + .card{margin-block-start:var(--rhythmus)}
#view .buehne:focus,#view .buehne:focus-visible{outline:none}
/* Verzeichniszeilen: Textspalten duerfen umbrechen, Zahlenspalten nicht;
   eine ganze Zeile als Ziel. */
.share-tbl td.umbruch,.share-tbl th.umbruch{white-space:normal}
.share-tbl td .tb-sub{display:block}

/* ============================================================
   ZEITRAUM-WAEHLER (2026-09-07, Vorbild Shopify Analytics): Knopf, darunter
   ein Feld mit Vorgaben links und zwei Monatsblaettern rechts. Alle Farben
   aus Token, kein Inline-Stil. Prefix zr- (Zustandsname gehoert dem Bauteil).
   ============================================================ */
.kpi-val.leer{color:var(--ink-faint)}
.zr{position:relative;display:inline-block}
.zr-knopf{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line-strong);background:var(--surface);color:var(--ink);border-radius:var(--r-sm);padding:8px 14px;font-family:var(--sans);font-size:13.5px;font-weight:600;cursor:pointer;white-space:nowrap}
.zr-knopf:hover{border-color:var(--accent-ink)}
.zr-knopf .zr-ic{display:inline-flex;width:16px;height:16px;color:var(--ink-soft)}
.zr-knopf .zr-ic svg{width:16px;height:16px}
.zr-feld{position:absolute;z-index:40;top:calc(100% + 6px);left:0;display:grid;grid-template-columns:13rem 1fr;background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r);box-shadow:0 18px 44px rgba(0,0,0,.18);min-width:min(52rem,calc(100vw - 2rem));max-width:calc(100vw - 2rem)}
.zr-vorgaben{border-right:1px solid var(--line);padding:10px 8px;display:flex;flex-direction:column;gap:6px;max-height:34rem;overflow-y:auto}
.zr-gruppe{display:flex;flex-direction:column;gap:2px;padding-bottom:6px;border-bottom:1px solid var(--line)}
.zr-gruppe:last-child{border-bottom:none}
.zr-gruppe-kopf{font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-faint);padding:6px 10px 2px}
.zr-vorgabe{text-align:left;border:none;background:transparent;color:var(--ink);font-family:var(--sans);font-size:13.5px;padding:7px 10px;border-radius:8px;cursor:pointer;white-space:nowrap}
.zr-vorgabe:hover{background:var(--surface-2)}
.zr-vorgabe.on{background:var(--surface-3);font-weight:700}
.zr-kalender{padding:14px 16px 12px;display:flex;flex-direction:column;gap:12px;min-width:0}
.zr-eingaben{display:flex;align-items:end;gap:10px;flex-wrap:wrap}
.zr-eingabe{display:flex;flex-direction:column;gap:4px;font-size:11.5px;font-weight:700;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.05em;flex:1 1 9rem}
.zr-eingabe .inp{width:100%;font-family:var(--mono,var(--sans));font-variant-numeric:tabular-nums}
.zr-eingabe .inp[aria-invalid="true"]{border-color:var(--bad)}
.zr-pfeil{font-size:12.5px;color:var(--ink-faint);padding-bottom:10px}
.zr-blaetter{display:grid;grid-template-columns:auto 1fr 1fr auto;gap:8px;align-items:start}
.zr-nav{border:1px solid var(--line);background:var(--surface);color:var(--ink-soft);width:28px;height:28px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;margin-top:2px}
.zr-nav svg{width:14px;height:14px}
.zr-nav-l svg{transform:rotate(90deg)}
.zr-nav-r svg{transform:rotate(-90deg)}
.zr-nav:hover{border-color:var(--accent-ink);color:var(--ink)}
.zr-monat{min-width:0}
.zr-monat-kopf{text-align:center;font-weight:700;font-size:13.5px;padding:4px 0 8px}
.zr-woche{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px}
.zr-wt{text-align:center;font-size:11px;color:var(--ink-faint);font-weight:700;padding:2px 0 4px}
.zr-leer{min-height:32px}
.zr-tag{border:none;background:transparent;color:var(--ink);font-family:var(--sans);font-variant-numeric:tabular-nums;font-size:13px;min-height:32px;min-width:32px;border-radius:8px;cursor:pointer}
.zr-tag:hover{background:var(--surface-2)}
.zr-tag.zr-heute{box-shadow:inset 0 0 0 1px var(--line-strong)}
.zr-tag.zr-im{background:var(--surface-3);border-radius:0}
.zr-tag.zr-von,.zr-tag.zr-bis{background:var(--lime);color:var(--on-lime);font-weight:700;border-radius:8px}
.zr-tag.zr-von{border-radius:8px 0 0 8px}.zr-tag.zr-bis{border-radius:0 8px 8px 0}.zr-tag.zr-von.zr-bis{border-radius:8px}
.zr-tag.zr-zukunft{color:var(--ink-faint);cursor:not-allowed}
.zr-tag:focus-visible{outline:2px solid var(--accent-ink);outline-offset:-2px}
.zr-tag.zr-von:focus-visible,.zr-tag.zr-bis:focus-visible{outline-color:var(--on-lime)}
.zr-fuss{display:flex;justify-content:space-between;align-items:center;gap:10px;border-top:1px solid var(--line);padding-top:10px;flex-wrap:wrap}
.zr-hinweis{font-size:12.5px;color:var(--ink-soft)}
.zr-fuss-knoepfe{display:flex;gap:8px}
@media(max-width:52rem){
  .zr-feld{grid-template-columns:1fr;position:fixed;inset:auto 1rem 1rem 1rem;top:auto;max-height:calc(100dvh - 2rem);overflow:auto}
  .zr-vorgaben{border-right:none;border-bottom:1px solid var(--line);flex-direction:row;flex-wrap:wrap;max-height:none}
  .zr-gruppe{border-bottom:none;flex-direction:row;flex-wrap:wrap}
  .zr-gruppe-kopf{width:100%}
  .zr-blaetter{grid-template-columns:auto 1fr auto}
  .zr-blaetter .zr-monat + .zr-monat{display:none}
}

/* BREITE LEISTE (Opt-in .rail-weit am <aside> und .app): Bereiche und
   Kategorien sofort erkennbar — mehr Breite, groessere Beschriftung,
   deutlicher Abstand zwischen den Gruppen. */
.app.rail-weit{--railw:312px}
.rail.rail-weit{padding:24px 16px;gap:3px}
.rail.rail-weit .rail-label{font-size:.72rem;letter-spacing:.1em;margin-top:1.1rem;padding:.5rem .7rem .3rem;border-top:1px solid color-mix(in srgb,var(--rail-ink) 14%,transparent)}
.rail.rail-weit .rail-label:first-of-type{border-top:none;margin-top:.4rem}
.rail.rail-weit .nav-item{font-size:.93rem;padding:.66rem .8rem;gap:.85rem}
.rail.rail-weit .logo-cap{font-size:1rem}
.rail.rail-weit .logo-cap span{font-size:.75rem}
.share-tbl tr[data-ziel]{cursor:pointer}
.share-tbl tr[data-ziel]:hover td{background:var(--surface-2)}
.share-tbl td a.zeilenziel{color:inherit;text-decoration:none;font-weight:700;display:inline-block;min-height:24px;line-height:24px}
.share-tbl td a.zeilenziel:hover,.share-tbl td a.zeilenziel:focus-visible{text-decoration:underline}

/* ============================================================
   NACHZUG 2026-08-17 (zweiter Durchgang) — gemessen ueber ALLE 16 Kapitel.
   Der Pruefer lief bis dahin nur gegen die Einstiegsansicht; die uebrigen
   fuenfzehn waren UNGEMESSEN, nicht sauber. Beim Lauf ueber alle Adressen
   kamen 363 Kontrastbefunde, 72 Ueberlaeufe, 30 beschnittene Balken und 18
   Bedienstationen ohne Fokusring heraus. Hier stehen die Gegenmassnahmen.
   ============================================================ */

/* --- R5: die Zustandsfarben im HELLEN Thema trugen als 14-px-Fettschrift
   3,46:1 (gruen) beziehungsweise 4,1:1 (rot) — verlangt sind 4,5:1. Am
   gerenderten Stand nachgemessen, nicht geschaetzt. Die getoenten Flaechen
   (--*-bg) bleiben unveraendert, nur die Schriftfarben werden nachgezogen. */
:root[data-theme="light"]{
  --good:#146B45;
  --warn:#7A4F0D;
  --bad:#A63520;
  --info:#2A578C;
}

/* --- R78: die Karte schneidet ab (.card overflow:hidden), und .unitwrap rollte
   nur senkrecht. Eine Tabelle, die breiter ist als die Karte, verlor damit ihre
   rechten Spalten OHNE Rollweg — die Balken der Deckungszeile wurden um bis zu
   36 px abgeschnitten. Jetzt rollt der Tabellenrahmen auch waagerecht. */
.unitwrap{overflow-x:auto;overscroll-behavior-x:contain}
.unitwrap table{min-width:34rem}

/* --- R7: die Beiszeile im Kartenkopf stand auf nowrap und lief bei 768 px aus
   dem Kopf. Sie darf umbrechen; der Kopf stapelt dann. */
.card-head{flex-wrap:wrap}
.card-head .hint{white-space:normal;text-align:right}
@media(max-width:48rem){
  .card-head{flex-direction:column;align-items:flex-start;gap:var(--sp-1)}
  .card-head .hint{text-align:left}
}

/* --- R7: die Vergleichszeile hatte drei feste Spuren und passte bei 360 px
   nicht mehr in ihre Breite. Unter 48 rem stapelt sie. */
@media(max-width:48rem){
  .vgl{grid-template-columns:1fr;gap:var(--sp-2)}
  .vgl-wert{text-align:left}
}

/* --- R68: .inp setzte outline:none und markierte den Fokus nur ueber die
   Rahmenfarbe — das ist kein Indikator im Sinne der Regel und war auf drei
   Eingabefeldern gar nicht sichtbar. */
.inp:focus-visible{outline:2px solid var(--focus,var(--accent-ink));outline-offset:2px}
:root[data-theme="light"] .inp:focus-visible{outline-color:#3A4A00}

/* --- R12: das Einwurffeld trug die Rolle einer Schaltflaeche und wurde deshalb
   als mehrzeilige Schaltflaeche gemeldet. Es ist ein Bereich mit einer echten
   Schaltflaeche darin; die Rolle ist entfallen, die Schaltflaeche steht sichtbar. */
.dropzone .dz-btn{margin-top:var(--sp-3)}
/* Ablagefeld als <label> (Dateiauswahl ohne Skript): block, sonst inline. */
label.dropzone{display:block}
/* SYMMETRIE (Operator 2026-09-07, memory feedback_symmetrie_gemessen_nie_geglaubt):
   Karten nebeneinander gleich hoch; Abschnittsbeschriftung im Karteninneren mit
   Luft nach oben; Eingabefeld ohne Ring, leise Randverstaerkung bei Fokus. */
#view .two-col{align-items:stretch}
#view .two-col > .card{display:flex;flex-direction:column}
#view .two-col > .card > .card-body{flex:1 1 auto}
#view .two-col > .card + .card{margin-block-start:0}
#view .raster > .feld{align-self:end}
#view .card-body > .section-label{margin-block-start:var(--sp-5)}
#view .card-body > .section-label:first-child,#view .card-body > form > .section-label:first-child{margin-block-start:0}
#view .card-body > form > .section-label{margin-block-start:var(--sp-5)}
#view .card-body > form > .section-label + *{margin-block-start:var(--sp-3)}
#view .card-body > form > .raster + .section-label,#view .card-body > form > .uplist + .section-label{margin-block-start:var(--sp-6,2rem)}
.inp:focus,.inp:focus-visible{outline:none;border-color:var(--accent-ink);box-shadow:inset 0 0 0 1px var(--accent-ink)}
/* Belegzeile: Name darf umbrechen, Art als Chip-Gruppe, alles wickelt bei Enge. */
.uprow{flex-wrap:wrap}
.uprow > span:nth-child(2){flex:1 1 12rem;min-width:0;overflow-wrap:anywhere}
.uprow .chipfilter{flex-wrap:wrap;flex:1 1 100%}

/* --- R77: eine Kachelgruppe darf keine Schlussreihe mit einem einzelnen
   Element haben. Die Spaltenzahl kommt jetzt aus der Anzahl (siehe tiles() im
   Skript) statt aus auto-fit, das je Breite eine andere Restreihe erzeugt. */
.card-body{container-type:inline-size}
.kachelgruppe{display:grid;gap:var(--sp-3);grid-template-columns:1fr}
@container (min-width:26rem){.kachelgruppe{grid-template-columns:repeat(var(--k-klein,2),minmax(0,1fr))}}
@container (min-width:42rem){.kachelgruppe{grid-template-columns:repeat(var(--k-mittel,3),minmax(0,1fr))}}
@container (min-width:58rem){.kachelgruppe{grid-template-columns:repeat(var(--k-gross,3),minmax(0,1fr))}}
/* Ohne Behaelterabfragen im Browser: eine Spur, die nie zu schmal wird. */
@supports not (container-type:inline-size){
  .kachelgruppe{grid-template-columns:repeat(auto-fit,minmax(min(11rem,100%),1fr))}
}
.profi,.fprov{min-width:0}
.fprov{display:flex;flex-wrap:wrap}
.prov{max-width:100%}

/* Die leere Bildkachel stand auf dem weissen Grund von .plan-img (fuer Plaene
   richtig, fuer einen Platzhalter falsch): im dunklen Thema weiss auf weiss,
   gemessen 1,13:1. */
.plan-img.leer{background:var(--surface-2)}
.bild-leer{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:var(--sp-1);text-align:center;padding:var(--sp-4);color:var(--ink-soft)}
.bild-leer b{font-family:var(--disp);font-size:15px;color:var(--ink)}
.bild-leer p{font-size:13px;color:var(--ink-faint)}

/* Der Deckungsbalken braucht Platz. Auf schmalem Geraet faellt die Spalte weg —
   die Betraege bleiben, und die Tabelle passt ohne Ueberlauf in die Karte. */
@media(max-width:48rem){
  .deck-balken{display:none}
  .unitwrap table{min-width:0}
}

/* ============================================================
   NACHZUG — dritter Durchgang, wieder ueber alle 16 Kapitel gemessen.
   ============================================================ */

/* --- R7: die Bausteinspur stand ab Zeile 778 wieder auf festen 300 px und hat
   meine gedeckelte Fassung von weiter oben ueberschrieben. Reihenfolge zaehlt:
   die Deckelung gehoert ans Dateiende. Zusaetzlich min-width:0 auf Baustein und
   Textkoerper — ein Flex-Kind schrumpft sonst nicht unter seinen Inhalt und
   sprengt seine Spur, obwohl das Raster passt. */
.baustein-grid{grid-template-columns:repeat(auto-fill,minmax(min(18rem,100%),1fr))}
.baustein-grid.zweier{grid-template-columns:1fr}
.baustein-grid.dreier{grid-template-columns:1fr}
@container (min-width:38rem){
  .baustein-grid.zweier{grid-template-columns:repeat(2,minmax(0,1fr))}
  .baustein-grid.dreier{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@container (min-width:58rem){
  .baustein-grid.dreier{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@supports not (container-type:inline-size){
  .baustein-grid.zweier,.baustein-grid.dreier{
    grid-template-columns:repeat(auto-fill,minmax(min(18rem,100%),1fr))}
}
.baustein,.baustein .bs-body{min-width:0}
.baustein .bs-body p{overflow-wrap:break-word}

/* --- R5: die Dateiartmarke traegt 10 px fett und kam im hellen Thema auf
   4,35:1. Eigener Ton statt Aenderung an --ink-faint, das ueberall haengt. */
:root[data-theme="light"] .ftype{color:#4E5158}

/* --- R68: der Fokusring stand in :where() und hatte damit die Spezifitaet null
   — jede spaetere Regel gewann. 66 Bedienstationen fielen dadurch auf den
   Standardring der Anzeigemaschine zurueck, dessen Staerke nicht berechenbar
   ist. Jetzt als gewoehnliche Auswahlliste, am Dateiende. */
a:focus-visible,button:focus-visible,[tabindex]:focus-visible,
input:focus-visible,select:focus-visible,textarea:focus-visible,
summary:focus-visible,.nav-item:focus-visible,.rung:focus-visible,
.docrow:focus-visible,.pcard:focus-visible,.plan:focus-visible,
.bild-btn:focus-visible,.doclink:focus-visible{
  outline:2px solid var(--accent-ink);outline-offset:2px;border-radius:6px}
:root[data-theme="light"] a:focus-visible,
:root[data-theme="light"] button:focus-visible,
:root[data-theme="light"] [tabindex]:focus-visible,
:root[data-theme="light"] input:focus-visible,
:root[data-theme="light"] select:focus-visible,
:root[data-theme="light"] textarea:focus-visible,
:root[data-theme="light"] summary:focus-visible{outline-color:#3A4A00}
.btn-cta:focus-visible,.btn-lime:focus-visible,.cc-btn:focus-visible,
.tu-buy:focus-visible,.dz-btn:focus-visible{outline-color:var(--on-lime)}

/* --- R75/R7: "Zwischenfinanzierung" ist allein breiter als die Unterzeile der
   Zeitachse bei 360 px. Die Sprache steht am Wurzelelement, also kann die
   Silbentrennung greifen; als letzte Sicherung bricht ein ueberlanges Wort um,
   statt aus seinem Kasten zu laufen. */
.tl-body,.tl-sub{min-width:0;hyphens:auto;overflow-wrap:break-word}

/* --- R68, zweiter Anlauf. Der Pruefer meldete auf zehn von sechzehn Kapiteln
   UNBEKANNT: "Station verlaesst sich auf den Standardring". Ein Ring, der nur
   an :focus-visible haengt, ist fuer eine Messung nicht immer greifbar — je
   nachdem, wie der Fokus gesetzt wurde, greift der Zustand gar nicht. Deshalb
   das uebliche Zweischritt-Muster: der Ring haengt an :focus (immer berechenbar)
   und wird fuer reine Zeigerbedienung wieder abgeraeumt. Sichtbar bleibt er
   damit genau dort, wo er hingehoert — an der Tastatur. */
a:focus,button:focus,[tabindex]:focus,input:focus,select:focus,textarea:focus,summary:focus{
  outline:2px solid var(--accent-ink);outline-offset:2px;border-radius:6px}
a:focus:not(:focus-visible),button:focus:not(:focus-visible),
[tabindex]:focus:not(:focus-visible),input:focus:not(:focus-visible),
select:focus:not(:focus-visible),textarea:focus:not(:focus-visible),
summary:focus:not(:focus-visible){outline:none}
:root[data-theme="light"] a:focus,:root[data-theme="light"] button:focus,
:root[data-theme="light"] [tabindex]:focus,:root[data-theme="light"] input:focus,
:root[data-theme="light"] select:focus,:root[data-theme="light"] textarea:focus{outline-color:#3A4A00}
.btn-cta:focus,.btn-lime:focus,.cc-btn:focus,.tu-buy:focus,.dz-btn:focus{outline-color:var(--on-lime)}
/* Im Navigationsband liegt der Akzent auf dunklem Grund — dort traegt der
   helle Gegenton, sonst verschwindet der Ring im Thema Hell. */
.rail a:focus,.rail button:focus{outline-color:var(--rail-ink)}

/* --- Dateizeile: Bedienflaeche und Umbruch (2026-08-20) ---------------------
   Der Verweis in .docrow war 18 px hoch und damit unter der Mindestflaeche
   (WCAG 2.2 SC 2.5.8, harte Untergrenze 24 px). Das Polster vergroessert die
   Flaeche, nicht die Schrift; die Zeile ist ohnehin hoeher, deshalb verschiebt
   sich nichts. Auf schmalem Geraet passen Kennung, Name, Zustand, Groesse und
   Verweis nicht nebeneinander — sie umbrechen, statt aus dem Kasten zu laufen. */
.docrow .doclink { min-height:24px }
@media (max-width:640px){
  .docrow { flex-wrap:wrap;row-gap:4px }
  .docrow .dname { flex:1 1 100% }
}

/* ============================================================
   MARKE „mahnregister" — 2026-08-27, ADDITIV und optisch NEUTRAL.
   Greift ausschliesslich unter :root[data-marke="mahnregister"]; jede
   bestehende Konsole ohne dieses Attribut rendert unveraendert weiter.

   Zweck: das Zentrale Deutsche Mahnregister ist eine eigene Marke und darf
   nicht in SSR-Lime auftreten (memory/feedback_per_project_brand_domain.md).
   Es bekommt aber KEINE zweite Schale — es laedt DIESE Datei und benutzt
   dieselben Bauteile (app/rail/topbar/main/card/kpis/tbl/badge). Hier stehen
   nur neue WERTE fuer vorhandene Token-Namen, keine neuen Bauteile.

   Farbherkunft belegt, nicht erfunden:
     #002D42  brand-corpus/design-md/aurora-government-of-canada  --brand-01
     #12588F  abgeleitet aus gov-uk-design-system #1d70b8, abgedunkelt bis
              der Kontrast auf Weiss 4,5:1 sicher haelt (gemessen 7,45:1)
   Alle 20 Farbpaare dieses Blocks sind gegen WCAG AA gemessen, kein Paar
   unter 4,5:1 — Messskript scratchpad/kontrast.py, Ergebnis im Lauf-Logbuch.

   Behoerdlich heisst hier auch: der Radius geht auf Kante. Die Token-Namen
   bleiben, damit die Bauteile unveraendert greifen.
   ============================================================ */
/* Auf hellem Amtsblau ist ein blauer Fokusring unsichtbar — dort traegt der
   Gegenton, gleiche Mechanik wie beim Lime-Knopf der SSR-Konsole. */
:root[data-marke] .btn-cta:focus-visible{outline-color:var(--on-lime)}

/* Der verschwommene Vorbefund. Eigenes Bauteil, weil es die Schale bisher
   nicht kennt: der Buerger sieht, DASS ein Eintrag vorliegt, und kann ihn
   nicht lesen. Die Unschaerfe liegt auf einer eigenen Schicht, sonst
   verwischt der erklaerende Text mit. Die Attrappenzeilen sind
   aria-hidden, damit die Sprachausgabe den Befund nicht doch vorliest. */
.vorbefund{position:relative;border:1px solid var(--line-strong);border-radius:var(--r-sm);overflow:hidden}
.vorbefund .vb-daten{filter:blur(6px);user-select:none;pointer-events:none;padding:12px}
.vorbefund .vb-schleier{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:20px;
  background:color-mix(in srgb,var(--surface) 78%,transparent)}
.vorbefund .vb-schleier>div{max-width:44ch}
@media(prefers-reduced-motion:reduce){.vorbefund .vb-daten{filter:blur(6px)}}

/* Bauteile, die der Schale bisher fehlten — nur unter der Marke aktiv, damit
   keine bestehende Konsole ihr Verhalten aendert.
   .sprungmarke: Tastatur-Einstieg vor der Navigation. Sie muss die harte
   Trefferflaeche von 24 px auch dann halten, wenn sie unsichtbar geparkt ist
   (R28b misst den Kasten, nicht die Sichtbarkeit).
   .vb-zeile: die Attrappenzeilen des Vorbefunds. Als <table> gebaut zwangen
   sie bei 360 px ihre Spaltenbreite durch und sprengten den Kasten (R7). */
:root[data-marke] .sprungmarke{
  position:fixed;left:-100vw;top:0;z-index:60;
  display:inline-flex;align-items:center;min-height:44px;padding:10px 16px;
  background:var(--lime);color:var(--on-lime);font-weight:700;font-size:14px;
  text-decoration:none;border-radius:var(--r-sm)}
:root[data-marke] .sprungmarke:focus{left:8px;top:8px}

:root[data-marke] .vb-zeile{
  display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:space-between;
  padding:7px 0;border-bottom:1px solid var(--line);font-size:13px}
:root[data-marke] .vb-zeile:last-child{border-bottom:0}
:root[data-marke] .vb-zeile .num{font-variant-numeric:tabular-nums}

/* Der Kopf traegt bei 360 px Marke, Titel und zwei Bedienelemente. Ohne Umbruch
   schiebt er den Seitenkoerper auf 537 px — gemessen, nicht vermutet. */
:root[data-marke] .topbar-inner{flex-wrap:wrap;row-gap:10px}
:root[data-marke] .tb-title{white-space:normal}

/* Die Markenmarke im Kopf: quadratisch statt Pille, Kante statt Rundung.
   Die FARBEN bleiben die des Bauteils (--lime auf --on-lime). Ein eigener
   Farbwert hier hatte Schrift und Flaeche auf denselben Ton gelegt —
   gemessen 1,00:1. Geometrie darf die Marke aendern, das Farbpaar nicht. */
:root[data-marke] .logo-mark{
  display:inline-grid;place-items:center;flex:0 0 auto;
  width:40px;height:40px;border-radius:var(--r-sm);
  font-weight:800;font-size:13px;letter-spacing:.06em;padding:0}

/* Auf der Marken-Flaeche ist der Marken-Fokusring unsichtbar (1,00:1),
   genau wie am Lime-Knopf der SSR-Konsole. Dort traegt der Gegenton. */
:root[data-marke] .sprungmarke:focus-visible{
  outline:2px solid var(--on-lime);outline-offset:2px}

/* Die Marken-Gruppe im Kopf darf umbrechen statt zu schieben. */
:root[data-marke] .tb-marke{
  display:flex;align-items:center;gap:12px;min-width:0}

/* R28b-Nachbesserung 2026-08-27 am Bauteil selbst, nicht in einer Marke:
   .backlink war 20 px hoch und lag damit unter der harten Trefferflaeche von
   24 px. Der Befund gilt fuer JEDEN Verbraucher dieser Schale, nicht nur fuer
   das Mahnregister — deshalb steht die Korrektur hier global. Optische
   Auswirkung: der Rueckverweis wird vier Pixel hoeher, die Schrift bleibt. */
.backlink{min-height:24px;padding:2px 0}

/* R7-Nachbesserung 2026-08-27, global am Bauteil:
   .tb-sub ist fuer die Kopfzeile gebaut und dort einzeilig mit Auslassung.
   Steht dieselbe Klasse als Erlaeuterung IN einer .meldung oder einem
   .notebox, ist die Einzeiligkeit falsch — der Satz laeuft aus dem Kasten.
   Gemessen bei 360 und 768 px. Innerhalb dieser beiden Behaelter bricht sie
   jetzt um; in der Kopfzeile bleibt alles wie es war. */
.meldung .tb-sub,.notebox .tb-sub,.card-body>.tb-sub{
  white-space:normal;overflow:visible;text-overflow:clip;line-height:1.5}

/* Zwei Folgen daraus, dass diese Marke die Leiste AUCH im hellen Thema dunkel
   laesst. Die Schale war darauf nicht ausgelegt — beides gemessen, nicht vermutet.

   1) .avatar nimmt --surface-3 als Flaeche und --rail-ink als Schrift. Bei den
      Ursprungsmarken kippt die Leiste im hellen Thema auf weiss, also kippt
      --rail-ink auf dunkel und das Paar stimmt. Hier bleibt die Leiste dunkel:
      weisse Schrift auf heller Flaeche, gemessen 1,22:1. Die Flaeche muss also
      aus der LEISTE kommen, nicht aus dem Seitenkoerper.
   2) Der Fokusring nimmt --accent-ink. Auf dem Amtsblau der Leiste sind das
      1,24 bis 1,49:1 — unsichtbar. In der Leiste traegt der helle Leistenton. */
:root[data-marke] .avatar{background:var(--rail-panel);color:var(--rail-ink)}
:root[data-marke] .rail :where(a,button,[tabindex],input,select,summary):focus-visible{
  outline:2px solid var(--rail-ink);outline-offset:2px}

/* R77: vier Kennzahlen brechen bei 768 px auf 3+1 um — die Schlussreihe traegt
   dann ein einzelnes Element. Zwischen 600 und 1000 px stehen sie deshalb
   zweispaltig, damit die Gruppe symmetrisch bleibt. */
@media(min-width:600px) and (max-width:1000px){
  :root[data-marke] .grid-kpi{grid-template-columns:1fr 1fr}
}

/* .btn-ghost traegt --surface als Flaeche — im hellen Thema weiss. In der
   dunklen Leiste dieser Marke ergibt das einen weissen Knopf auf Amtsblau und
   einen weissen Fokusring auf weissem Knopf, gemessen 1,00:1. In der Leiste
   nimmt der Knopf deshalb die Leistentoene, wie .rail-theme es schon tut. */
:root[data-marke] .rail .btn-ghost{
  background:transparent;color:var(--rail-ink-soft);border-color:var(--rail-line)}
:root[data-marke] .rail .btn-ghost:hover{color:var(--rail-ink)}

/* Kode-Block als Bauteil — die Schale kannte ihn noch nicht. Ein Befehl oder
   eine Antwort ist breiter als ein Telefon; sie darf NICHT den Seitenkoerper
   verbreitern, sondern rollt in ihrem eigenen Kasten. Gemessen: 646 px Inhalt
   in 278 px Kasten, ohne diese Regel schob er die ganze Seite. */
pre{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-sm);
  color:var(--ink);padding:14px 16px;margin:0 0 14px;overflow-x:auto;max-width:100%;
  font:400 12.5px/1.65 var(--mono,ui-monospace),SFMono-Regular,Menlo,Consolas,monospace}
pre code{background:none;padding:0;font:inherit;white-space:pre}
pre b{color:var(--accent-ink);font-weight:400}
code{font:400 .92em var(--mono,ui-monospace),SFMono-Regular,Menlo,Consolas,monospace;
  background:var(--surface-3);border-radius:4px;padding:1px 5px;overflow-wrap:anywhere}

/* .card-head bricht unter 600 px ohnehin auf zwei Zeilen um; dort muss auch
   die Unterzeile umbrechen duerfen, sonst steht sie 2 px ueber der Kante.
   Die .hint hatte diese Regel bereits — .tb-sub fehlte sie. */
@media(max-width:600px){.card-head .tb-sub{white-space:normal;overflow:visible;text-overflow:clip}}

/* Lage-Klassen der Marke. Grund: der Vorfuehrstand liefert eine strenge
   Inhalts-Richtlinie mit style-src 'self' aus — ein style-Attribut im Markup
   wird dort verworfen, die Seite sieht anders aus als gebaut. Gemessen an
   allen sechs Seiten. Statt die Richtlinie aufzuweichen, stehen die wenigen
   Lagewerte hier als Klassen; Farbe ist keine dabei. */
:root[data-marke] .breite-eng{max-width:640px}
:root[data-marke] .breite-mittel{max-width:760px}
:root[data-marke] .lesebreite{max-width:64ch}
:root[data-marke] .oben-s{margin-top:14px}
:root[data-marke] .oben-m{margin-top:22px}
:root[data-marke] .unten-s{margin:0 0 10px}
:root[data-marke] .unten-m{margin:0 0 16px}
:root[data-marke] .links{align-self:flex-start}
:root[data-marke] .reihe{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
:root[data-marke] .reihe>.wachsend{flex:1 1 260px}
:root[data-marke] .kennung-feld{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
:root[data-marke] .blankliste{list-style:none;padding:0;margin:0 0 22px}
:root[data-marke] .gedreht{display:inline-flex;transform:rotate(180deg)}
/* Ladebalken des Geruests: drei feste Breiten statt gerechneter Attribute. */
:root[data-marke] .lad-l{width:38%}
:root[data-marke] .lad-m{width:24%}
:root[data-marke] .lad-s{width:18%}

/* .hinweis — der INLINE-Merkkasten. Fehlte der Schale: .meldung sieht wie ein
   Banner aus, ist aber ein fest positionierter Zuruf am Bildschirmrand
   (position:fixed, z-index 120). Wer sie in den Textfluss setzt, bekommt einen
   Kasten, der ueber dem Inhalt schwebt — im Augenschein am Portal gesehen.
   .hinweis traegt dieselbe Optik, bleibt aber im Fluss. */
.hinweis{background:var(--surface-2);border:1px solid var(--line);
  border-inline-start:3px solid var(--line-strong);border-radius:var(--r-sm);
  padding:13px 16px;margin:0 0 14px;font-size:13.5px;line-height:1.6;color:var(--ink);
  display:flex;flex-direction:column;gap:6px}
.hinweis>b{color:var(--ink)}
.hinweis.gut{border-inline-start-color:var(--good)}
.hinweis.warn{border-inline-start-color:var(--warn)}
.hinweis.info{border-inline-start-color:var(--info)}
.hinweis.bad{border-inline-start-color:var(--bad)}
.hinweis .tb-sub{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.5}

/* Kopfzeile einer Karte: Titel und Unterzeile sind zwei Zeilen, nicht ein
   aneinandergeklebter Satz. Im Augenschein stand "…eingetragen habenEin
   Eintrag ist kein Urteil" in einer Zeile ohne Trennung. */
.card-head .tb-sub{display:block}

/* Der Vorbefund braucht Platz fuer seinen Schleier: die Attrappenzeilen sind
   niedriger als der erklaerende Text mit Knopf darueber — im Augenschein war
   der Knopf unten abgeschnitten. */
:root[data-marke] .vorbefund{min-height:230px}
:root[data-marke] .vorbefund .vb-daten{min-height:230px}

/* .lede traegt keinen Abstand — als Beschriftung unter einer Zahl ist das
   richtig, als Absatz im Fliesstext klebten im Augenschein zwei Absaetze
   aneinander. Nur das Absatz-Element bekommt den Abstand, die Beschriftung
   bleibt unveraendert. */
p.lede{margin:0 0 12px}
p.lede:last-child{margin-bottom:0}

/* --- Zwei Bauteile, die eine Konsole ohne eigenes Stylesheet braucht ---
   Ohne sie greifen Ansichten zum style-Attribut, und das verwirft die
   Auslieferung wegen style-src 'self' still: die Seite sieht dann falsch
   aus und die Konsole meldet es nur einmal beim Zeichnen. */
.inp-weit{flex:1 1 16rem;min-width:12rem}
.rohantwort{margin:0;overflow-x:auto;white-space:pre;font-family:var(--mono);
  font-size:14px;line-height:1.55;color:var(--ink-soft)}

/* MARKE-ANFANG dzm-a — erzeugt aus marken/dzm-a.json durch werkzeug/marke.mjs.
   NICHT von Hand ändern: der nächste Lauf überschreibt diesen Block.
   Amtston Azzurro — designers.italia.it-Familie, einspaltiger Bürgereinstieg
   Beleg: brand-corpus/design-md/italia-design-system: --brand-01 #06c (272 Nennungen, Primär/Link), --brand-06 #17334f (35x, Ink), --brand-14 #0052a3 (14x, Link-Tinte), --brand-03 #008055, --brand-04 #cc334d, --brand-05 #995c00, --brand-13 #4b5a69, --radius-1 4px. Schrift Titillium Web (--font-3) gegengeprüft: amtlich festgelegte Schrift der italienischen Verwaltung, designers.italia.it/design-system/fondamenti/tipografia. Grundflächen und Neutralstufen sind im Korpus NICHT erhoben und hier eigene Festlegung für AA.
   Alle Farbpaare gegen WCAG AA gerechnet, sonst wäre nichts geschrieben worden. */
:root[data-marke="dzm-a"]{
  --lime:#7FB2E8;
  --lime-strong:#A6CBF1;
  --on-lime:#0A2440;
  --bg:#0D1B26;
  --surface:#132532;
  --surface-2:#172C3B;
  --surface-3:#1F3A4C;
  --ink:#EDF1F5;
  --ink-soft:#B3C2CF;
  --ink-faint:#9FB0BF;
  --line:#24404F;
  --line-strong:#5A7285;
  --accent-ink:#7FB2E8;
  --rail:#0A1620;
  --rail-ink:#EDF1F5;
  --rail-ink-soft:#AEC0CE;
  --rail-panel:#132532;
  --good:#5CC79A;
  --warn:#E8B95C;
  --bad:#F09AA6;
  --info:#7FB2E8;
  --good-bg:rgba(92,199,154,.14);
  --warn-bg:rgba(232,185,92,.14);
  --bad-bg:rgba(240,154,166,.14);
  --info-bg:rgba(127,178,232,.14);
  --r:4px;
  --r-sm:3px;
  --r-lg:6px;
  --sans:'Titillium Web', Arial, system-ui, sans-serif;
  --disp:'Titillium Web', Arial, system-ui, sans-serif;
  --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
  --shadow:none;
}
:root[data-marke="dzm-a"][data-theme="light"]{
  --lime:#0052a3;
  --lime-strong:#003d7a;
  --on-lime:#FFFFFF;
  --bg:#F7F8FA;
  --surface:#FFFFFF;
  --surface-2:#F1F4F7;
  --surface-3:#E4E9EF;
  --ink:#17334F;
  --ink-soft:#3D5064;
  --ink-faint:#4B5A69;
  --line:#D7DDE3;
  --line-strong:#7C8C9C;
  --accent-ink:#0052a3;
  --rail:#17334F;
  --rail-ink:#FFFFFF;
  --rail-ink-soft:#C5D0DA;
  --rail-panel:#22415F;
  --good:#006644;
  --warn:#7A4A00;
  --bad:#A8283C;
  --info:#0052a3;
  --good-bg:rgba(0,102,68,.10);
  --warn-bg:rgba(122,74,0,.12);
  --bad-bg:rgba(168,40,60,.10);
  --info-bg:rgba(0,82,163,.10);
  --r:4px;
  --r-sm:3px;
  --r-lg:6px;
  --sans:'Titillium Web', Arial, system-ui, sans-serif;
  --disp:'Titillium Web', Arial, system-ui, sans-serif;
  --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
  --shadow:none;
}
@media(prefers-color-scheme:light){
  :root[data-marke="dzm-a"]:not([data-theme="dark"]){
    --lime:#0052a3;
    --lime-strong:#003d7a;
    --on-lime:#FFFFFF;
    --bg:#F7F8FA;
    --surface:#FFFFFF;
    --surface-2:#F1F4F7;
    --surface-3:#E4E9EF;
    --ink:#17334F;
    --ink-soft:#3D5064;
    --ink-faint:#4B5A69;
    --line:#D7DDE3;
    --line-strong:#7C8C9C;
    --accent-ink:#0052a3;
    --rail:#17334F;
    --rail-ink:#FFFFFF;
    --rail-ink-soft:#C5D0DA;
    --rail-panel:#22415F;
    --good:#006644;
    --warn:#7A4A00;
    --bad:#A8283C;
    --info:#0052a3;
    --good-bg:rgba(0,102,68,.10);
    --warn-bg:rgba(122,74,0,.12);
    --bad-bg:rgba(168,40,60,.10);
    --info-bg:rgba(0,82,163,.10);
    --r:4px;
    --r-sm:3px;
    --r-lg:6px;
    --sans:'Titillium Web', Arial, system-ui, sans-serif;
    --disp:'Titillium Web', Arial, system-ui, sans-serif;
    --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
    --shadow:none;
  }
}

/* MARKE-ENDE dzm-a */

/* MARKE-ANFANG dzm-b — erzeugt aus marken/dzm-b.json durch werkzeug/marke.mjs.
   NICHT von Hand ändern: der nächste Lauf überschreibt diesen Block.
   Dichte Kanzlei — IBM-Carbon-Haltung, eckig, Monospace-Zahlen, für Vieltäter
   Beleg: brand-corpus/design-md/ibm-design-language: --brand-01 #0f62fe (275 Nennungen, Primär), --brand-02 #da1e28 (56x, Alarm), --brand-04 #f1c21b (22x, Warnung), --brand-07 #002d9c (12x), --brand-08 #198038 (12x), --font-3 ibm plex sans (122x), --font-4 ibm plex mono (115x). Die häufigeren --font-1/2 sind die CJK-Varianten der mehrsprachigen Seite und wurden verworfen. Radius im Korpus NICHT erhoben; 0px ist externes Wissen zu Carbon und hier als Entscheidung gesetzt. Neutralstufen sind nicht erhoben und eigene Festlegung für AA.
   Alle Farbpaare gegen WCAG AA gerechnet, sonst wäre nichts geschrieben worden. */
:root[data-marke="dzm-b"]{
  --lime:#4589FF;
  --lime-strong:#78A9FF;
  --on-lime:#001141;
  --bg:#161616;
  --surface:#262626;
  --surface-2:#262626;
  --surface-3:#393939;
  --ink:#F4F4F4;
  --ink-soft:#C6C6C6;
  --ink-faint:#A8A8A8;
  --line:#393939;
  --line-strong:#8D8D8D;
  --accent-ink:#78A9FF;
  --rail:#0B0B0B;
  --rail-ink:#F4F4F4;
  --rail-ink-soft:#C6C6C6;
  --rail-panel:#262626;
  --good:#42BE65;
  --warn:#F1C21B;
  --bad:#FF8389;
  --info:#78A9FF;
  --good-bg:rgba(66,190,101,.14);
  --warn-bg:rgba(241,194,27,.14);
  --bad-bg:rgba(255,131,137,.14);
  --info-bg:rgba(120,169,255,.14);
  --r:0px;
  --r-sm:0px;
  --r-lg:0px;
  --sans:'IBM Plex Sans', -apple-system, system-ui, sans-serif;
  --disp:'IBM Plex Sans', -apple-system, system-ui, sans-serif;
  --mono:'IBM Plex Mono', ui-monospace, Menlo, monospace;
  --shadow:none;
}
:root[data-marke="dzm-b"][data-theme="light"]{
  --lime:#0f62fe;
  --lime-strong:#0043ce;
  --on-lime:#FFFFFF;
  --bg:#F4F4F4;
  --surface:#FFFFFF;
  --surface-2:#F4F4F4;
  --surface-3:#E0E0E0;
  --ink:#161616;
  --ink-soft:#525252;
  --ink-faint:#5E5E5E;
  --line:#E0E0E0;
  --line-strong:#8D8D8D;
  --accent-ink:#0043ce;
  --rail:#161616;
  --rail-ink:#F4F4F4;
  --rail-ink-soft:#C6C6C6;
  --rail-panel:#262626;
  --good:#0E6027;
  --warn:#684E00;
  --bad:#A2191F;
  --info:#0043ce;
  --good-bg:rgba(14,96,39,.10);
  --warn-bg:rgba(104,78,0,.12);
  --bad-bg:rgba(162,25,31,.10);
  --info-bg:rgba(0,67,206,.10);
  --r:0px;
  --r-sm:0px;
  --r-lg:0px;
  --sans:'IBM Plex Sans', -apple-system, system-ui, sans-serif;
  --disp:'IBM Plex Sans', -apple-system, system-ui, sans-serif;
  --mono:'IBM Plex Mono', ui-monospace, Menlo, monospace;
  --shadow:none;
}
@media(prefers-color-scheme:light){
  :root[data-marke="dzm-b"]:not([data-theme="dark"]){
    --lime:#0f62fe;
    --lime-strong:#0043ce;
    --on-lime:#FFFFFF;
    --bg:#F4F4F4;
    --surface:#FFFFFF;
    --surface-2:#F4F4F4;
    --surface-3:#E0E0E0;
    --ink:#161616;
    --ink-soft:#525252;
    --ink-faint:#5E5E5E;
    --line:#E0E0E0;
    --line-strong:#8D8D8D;
    --accent-ink:#0043ce;
    --rail:#161616;
    --rail-ink:#F4F4F4;
    --rail-ink-soft:#C6C6C6;
    --rail-panel:#262626;
    --good:#0E6027;
    --warn:#684E00;
    --bad:#A2191F;
    --info:#0043ce;
    --good-bg:rgba(14,96,39,.10);
    --warn-bg:rgba(104,78,0,.12);
    --bad-bg:rgba(162,25,31,.10);
    --info-bg:rgba(0,67,206,.10);
    --r:0px;
    --r-sm:0px;
    --r-lg:0px;
    --sans:'IBM Plex Sans', -apple-system, system-ui, sans-serif;
    --disp:'IBM Plex Sans', -apple-system, system-ui, sans-serif;
    --mono:'IBM Plex Mono', ui-monospace, Menlo, monospace;
    --shadow:none;
  }
}

/* MARKE-ENDE dzm-b */

/* MARKE-ANFANG dzm-c — erzeugt aus marken/dzm-c.json durch werkzeug/marke.mjs.
   NICHT von Hand ändern: der nächste Lauf überschreibt diesen Block.
   Gerichtsakte Mono — Papierweiss, Formularlinien, alle Zahlen monospaced
   Beleg: brand-corpus/design-md/jetbrains-ring-ui: --brand-01 #2e55a3, --brand-04 #cc3645, --brand-05 #df9303, --brand-08 #1f7536, Radius 2px (gemessen). Werte mit unter 4 Nennungen wurden nicht verwendet. Schrift ergänzt aus italia-design-system: --font-4 roboto mono (9x), --font-5 arial (5x) — beide echte Korpuswerte aus einem zweiten Eintrag. Warn- und Alarmton sind gegenüber dem Korpuswert abgedunkelt, weil sie hier als TEXT auf heller Fläche stehen und sonst unter 4,5:1 fallen; die Herkunft bleibt derselbe Eintrag.
   Alle Farbpaare gegen WCAG AA gerechnet, sonst wäre nichts geschrieben worden. */
:root[data-marke="dzm-c"]{
  --lime:#8FAEE6;
  --lime-strong:#B0C7EE;
  --on-lime:#0D1526;
  --bg:#16181A;
  --surface:#1C1F21;
  --surface-2:#212527;
  --surface-3:#2A2E31;
  --ink:#F2F2F0;
  --ink-soft:#B9BCBE;
  --ink-faint:#A2A6A9;
  --line:#33383B;
  --line-strong:#767C80;
  --accent-ink:#8FAEE6;
  --rail:#0F1112;
  --rail-ink:#F2F2F0;
  --rail-ink-soft:#B9BCBE;
  --rail-panel:#1C1F21;
  --good:#6CC98A;
  --warn:#E0B25C;
  --bad:#EF8A94;
  --info:#8FAEE6;
  --good-bg:rgba(108,201,138,.14);
  --warn-bg:rgba(224,178,92,.14);
  --bad-bg:rgba(239,138,148,.14);
  --info-bg:rgba(143,174,230,.14);
  --r:2px;
  --r-sm:2px;
  --r-lg:2px;
  --sans:Arial, system-ui, -apple-system, sans-serif;
  --disp:Arial, system-ui, -apple-system, sans-serif;
  --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
  --shadow:none;
}
:root[data-marke="dzm-c"][data-theme="light"]{
  --lime:#2e55a3;
  --lime-strong:#22407c;
  --on-lime:#FFFFFF;
  --bg:#FFFFFF;
  --surface:#FFFFFF;
  --surface-2:#FAFAF8;
  --surface-3:#F0F0EC;
  --ink:#1A1A1A;
  --ink-soft:#444444;
  --ink-faint:#595959;
  --line:#BFBFBF;
  --line-strong:#767676;
  --accent-ink:#2e55a3;
  --rail:#1A1A1A;
  --rail-ink:#FFFFFF;
  --rail-ink-soft:#C9C9C9;
  --rail-panel:#2B2B2B;
  --good:#1f7536;
  --warn:#7A5000;
  --bad:#B02A38;
  --info:#2e55a3;
  --good-bg:rgba(31,117,54,.10);
  --warn-bg:rgba(122,80,0,.12);
  --bad-bg:rgba(176,42,56,.10);
  --info-bg:rgba(46,85,163,.10);
  --r:2px;
  --r-sm:2px;
  --r-lg:2px;
  --sans:Arial, system-ui, -apple-system, sans-serif;
  --disp:Arial, system-ui, -apple-system, sans-serif;
  --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
  --shadow:none;
}
@media(prefers-color-scheme:light){
  :root[data-marke="dzm-c"]:not([data-theme="dark"]){
    --lime:#2e55a3;
    --lime-strong:#22407c;
    --on-lime:#FFFFFF;
    --bg:#FFFFFF;
    --surface:#FFFFFF;
    --surface-2:#FAFAF8;
    --surface-3:#F0F0EC;
    --ink:#1A1A1A;
    --ink-soft:#444444;
    --ink-faint:#595959;
    --line:#BFBFBF;
    --line-strong:#767676;
    --accent-ink:#2e55a3;
    --rail:#1A1A1A;
    --rail-ink:#FFFFFF;
    --rail-ink-soft:#C9C9C9;
    --rail-panel:#2B2B2B;
    --good:#1f7536;
    --warn:#7A5000;
    --bad:#B02A38;
    --info:#2e55a3;
    --good-bg:rgba(31,117,54,.10);
    --warn-bg:rgba(122,80,0,.12);
    --bad-bg:rgba(176,42,56,.10);
    --info-bg:rgba(46,85,163,.10);
    --r:2px;
    --r-sm:2px;
    --r-lg:2px;
    --sans:Arial, system-ui, -apple-system, sans-serif;
    --disp:Arial, system-ui, -apple-system, sans-serif;
    --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
    --shadow:none;
  }
}

/* MARKE-ENDE dzm-c */

/* MARKE-ANFANG mahnregister — erzeugt aus marken/mahnregister.json durch werkzeug/marke.mjs.
   NICHT von Hand ändern: der nächste Lauf überschreibt diesen Block.
   Erstfassung — Amtsblau auf der Bank-Konsolen-Schale (Bestand, zum Vergleich)
   Beleg: aurora-government-of-canada #002d42 + gov-uk-design-system #1d70b8, abgedunkelt auf #12588F
   Alle Farbpaare gegen WCAG AA gerechnet, sonst wäre nichts geschrieben worden. */
:root[data-marke="mahnregister"]{
  --lime:#7FC4F0;
  --lime-strong:#A9D9F6;
  --on-lime:#00202E;
  --bg:#0A1217;
  --surface:#101B22;
  --surface-2:#16242C;
  --surface-3:#1D2E37;
  --ink:#EEF1F2;
  --ink-soft:#AAB6BB;
  --ink-faint:#93A4AD;
  --line:#22333B;
  --line-strong:#5C737F;
  --accent-ink:#7FC4F0;
  --rail:#002D42;
  --rail-ink:#EEF1F2;
  --rail-ink-soft:#B4C4CD;
  --rail-panel:#013A55;
  --good:#6FD39B;
  --warn:#F0D264;
  --bad:#F3A396;
  --info:#7FC4F0;
  --shadow:none;
  --r:2px;
  --r-sm:2px;
  --r-lg:2px;
}
:root[data-marke="mahnregister"][data-theme="light"]{
  --lime:#12588F;
  --lime-strong:#0E4571;
  --on-lime:#FFFFFF;
  --bg:#F1F3F4;
  --surface:#FFFFFF;
  --surface-2:#F7F9FA;
  --surface-3:#E4E9EC;
  --ink:#0B0C0C;
  --ink-soft:#4C5356;
  --ink-faint:#5C6468;
  --line:#D3D9DC;
  --line-strong:#8A9499;
  --accent-ink:#12588F;
  --rail:#002D42;
  --rail-ink:#FFFFFF;
  --rail-ink-soft:#C4D0D7;
  --rail-panel:#013A55;
  --good:#00552E;
  --warn:#4F4400;
  --bad:#8A2312;
  --info:#12588F;
  --shadow:none;
  --r:2px;
  --r-sm:2px;
  --r-lg:2px;
}
@media(prefers-color-scheme:light){
  :root[data-marke="mahnregister"]:not([data-theme="dark"]){
    --lime:#12588F;
    --lime-strong:#0E4571;
    --on-lime:#FFFFFF;
    --bg:#F1F3F4;
    --surface:#FFFFFF;
    --surface-2:#F7F9FA;
    --surface-3:#E4E9EC;
    --ink:#0B0C0C;
    --ink-soft:#4C5356;
    --ink-faint:#5C6468;
    --line:#D3D9DC;
    --line-strong:#8A9499;
    --accent-ink:#12588F;
    --rail:#002D42;
    --rail-ink:#FFFFFF;
    --rail-ink-soft:#C4D0D7;
    --rail-panel:#013A55;
    --good:#00552E;
    --warn:#4F4400;
    --bad:#8A2312;
    --info:#12588F;
    --shadow:none;
    --r:2px;
    --r-sm:2px;
    --r-lg:2px;
  }
}

/* MARKE-ENDE mahnregister */

/* Zahlen tragen die Schrift der Marke. Wo eine Marke keine Monoschrift
   nennt, bleibt es bei der Systemschrift mit Tabellenziffern — dann stehen
   die Stellen wenigstens untereinander. */
:root[data-marke] .num,
:root[data-marke] td.zahl,
:root[data-marke] .vb-zeile .num{
  font-family:var(--mono,inherit);font-variant-numeric:tabular-nums}
/* Die Kennzahl traegt haeufig einen WORTWERT ("verfuegbar", "Kostenlos").
   In Monoschrift gesetzt liest sich das wie ein Fehlercode — im Augenschein
   gesehen. Nur Zahlen bekommen die Monoschrift, Woerter behalten die
   Grundschrift; die Tabellenziffern gelten fuer beide. */
:root[data-marke] .kpi-val{font-variant-numeric:tabular-nums}
:root[data-marke] .kpi-val.zahl{font-family:var(--mono,inherit)}

/* MARKE-ANFANG dzm-aufsicht — erzeugt aus marken/dzm-aufsicht.json durch werkzeug/marke.mjs.
   NICHT von Hand ändern: der nächste Lauf überschreibt diesen Block.
   Aufsicht hell — BaFin-Palette, Indigo auf Papier statt auf Schwarz
   Beleg: Gemessen 2026-08-27 aus bafin.de (338.854 B CSS aus 8 Blättern): Tinte und Leiste #12102c (25 Nennungen), Primär #3b2e80 (5), Akzent #957fbb (9), Gold #b69b59 (4), Rot #ad2231 (3), Grün #005c45 (2), Grund #fafaff (55) und #f2f3f4 (30), #1a1a1a (178). Radius dort 0. Der Auftritt selbst fährt diese Palette auf dunklem Grund; der Auftrag lautete ausdrücklich hell — daher trägt das HELLE Thema #fafaff als Grund und #12102c als Leiste, das dunkle Thema bleibt die Originallage. SCHRIFT BafinTheSans (LucasFonts, lizenzpflichtig) — Ersatz Archivo, Grotesk mit gleicher Laufweite, Festlegung des Hauses. ink-soft, ink-faint, line-strong, warn und info sind eigene AA-Festlegungen; der Korpus belegt Grund, Primär, Akzent und die drei Zustandsfarben.
   Alle Farbpaare gegen WCAG AA gerechnet, sonst wäre nichts geschrieben worden. */
:root[data-marke="dzm-aufsicht"]{
  --lime:#957FBB;
  --lime-strong:#B3A2D2;
  --on-lime:#0F0A22;
  --bg:#0A0918;
  --surface:#12102C;
  --surface-2:#1A1740;
  --surface-3:#241F52;
  --ink:#F0EFF7;
  --ink-soft:#BFBBD6;
  --ink-faint:#A8A3C4;
  --line:#262252;
  --line-strong:#6A6494;
  --accent-ink:#957FBB;
  --rail:#08071A;
  --rail-ink:#F0EFF7;
  --rail-ink-soft:#B5AFD0;
  --rail-panel:#12102C;
  --good:#6FCBAE;
  --warn:#D8B96A;
  --bad:#F09AA6;
  --info:#9AA8E0;
  --good-bg:rgba(111,203,174,.14);
  --warn-bg:rgba(216,185,106,.14);
  --bad-bg:rgba(240,154,166,.14);
  --info-bg:rgba(154,168,224,.14);
  --r:0px;
  --r-sm:0px;
  --r-lg:0px;
  --sans:'Archivo', Calibri, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --disp:'Archivo', Calibri, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
  --shadow:none;
}
:root[data-marke="dzm-aufsicht"][data-theme="light"]{
  --lime:#3B2E80;
  --lime-strong:#2A1F63;
  --on-lime:#FFFFFF;
  --bg:#FAFAFF;
  --surface:#FFFFFF;
  --surface-2:#F2F3F4;
  --surface-3:#E7E6F0;
  --ink:#12102C;
  --ink-soft:#3E3A5C;
  --ink-faint:#5F5A7C;
  --line:#DDDCE8;
  --line-strong:#8B87A6;
  --accent-ink:#3B2E80;
  --rail:#12102C;
  --rail-ink:#FFFFFF;
  --rail-ink-soft:#B9B3D4;
  --rail-panel:#221E4A;
  --good:#005C45;
  --warn:#6E5410;
  --bad:#AD2231;
  --info:#2F4B7C;
  --good-bg:rgba(0,92,69,.10);
  --warn-bg:rgba(110,84,16,.12);
  --bad-bg:rgba(173,34,49,.10);
  --info-bg:rgba(47,75,124,.10);
  --r:0px;
  --r-sm:0px;
  --r-lg:0px;
  --sans:'Archivo', Calibri, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --disp:'Archivo', Calibri, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
  --shadow:none;
}
@media(prefers-color-scheme:light){
  :root[data-marke="dzm-aufsicht"]:not([data-theme="dark"]){
    --lime:#3B2E80;
    --lime-strong:#2A1F63;
    --on-lime:#FFFFFF;
    --bg:#FAFAFF;
    --surface:#FFFFFF;
    --surface-2:#F2F3F4;
    --surface-3:#E7E6F0;
    --ink:#12102C;
    --ink-soft:#3E3A5C;
    --ink-faint:#5F5A7C;
    --line:#DDDCE8;
    --line-strong:#8B87A6;
    --accent-ink:#3B2E80;
    --rail:#12102C;
    --rail-ink:#FFFFFF;
    --rail-ink-soft:#B9B3D4;
    --rail-panel:#221E4A;
    --good:#005C45;
    --warn:#6E5410;
    --bad:#AD2231;
    --info:#2F4B7C;
    --good-bg:rgba(0,92,69,.10);
    --warn-bg:rgba(110,84,16,.12);
    --bad-bg:rgba(173,34,49,.10);
    --info-bg:rgba(47,75,124,.10);
    --r:0px;
    --r-sm:0px;
    --r-lg:0px;
    --sans:'Archivo', Calibri, 'Helvetica Neue', Helvetica, Arial, sans-serif;
    --disp:'Archivo', Calibri, 'Helvetica Neue', Helvetica, Arial, sans-serif;
    --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
    --shadow:none;
  }
}

/* MARKE-ENDE dzm-aufsicht */

/* MARKE-ANFANG dzm-bund — erzeugt aus marken/dzm-bund.json durch werkzeug/marke.mjs.
   NICHT von Hand ändern: der nächste Lauf überschreibt diesen Block.
   Bundesblau — Bund-Standard aus bundesregierung.de, bafa.de und bundesfinanzministerium.de
   Beleg: Gemessen 2026-08-27 aus den ausgelieferten Stylesheets: bundesregierung.de --brand #0071ad (388 Nennungen), #004b76 (80), Tinte #111314 (564), Grün #00854a (269), Rot #c0003c (97), Neutral #9aa0a2 (194) / #4c4f50 (137) / #63686a (100) / #eeeff1 (57); bundesfinanzministerium.de #004f80 (82), #001826 (18); bafa.de #0778a5 (86). Radius dort 0 und 2px. SCHRIFT: die drei Auftritte fahren BundesSansWeb — lizenzpflichtige Hausschrift des Bundes, hier NICHT verwendbar. Ersatz Fira Sans (Spiekermann, FF-Meta-Linie, humanistische Grotesk derselben Bauart), ausdrückliche Festlegung des Hauses, keine Behauptung von BundesSans. line-strong, warn und die Neutralstufen sind eigene AA-Festlegungen: der Korpuswert #9aa0a2 hält auf Weiss nur 2.62:1.
   Alle Farbpaare gegen WCAG AA gerechnet, sonst wäre nichts geschrieben worden. */
:root[data-marke="dzm-bund"]{
  --lime:#6FB6DC;
  --lime-strong:#9CD0EA;
  --on-lime:#06202E;
  --bg:#0B1319;
  --surface:#111E26;
  --surface-2:#16262F;
  --surface-3:#1E323D;
  --ink:#ECF0F2;
  --ink-soft:#B0BEC5;
  --ink-faint:#9AABB4;
  --line:#21343E;
  --line-strong:#5E7681;
  --accent-ink:#6FB6DC;
  --rail:#06121A;
  --rail-ink:#ECF0F2;
  --rail-ink-soft:#AFC2CC;
  --rail-panel:#111E26;
  --good:#5FCB96;
  --warn:#EEC169;
  --bad:#F2A0A8;
  --info:#6FB6DC;
  --good-bg:rgba(95,203,150,.14);
  --warn-bg:rgba(238,193,105,.14);
  --bad-bg:rgba(242,160,168,.14);
  --info-bg:rgba(111,182,220,.14);
  --r:2px;
  --r-sm:2px;
  --r-lg:2px;
  --sans:'Fira Sans', Calibri, Verdana, Arial, sans-serif;
  --disp:'Fira Sans', Calibri, Verdana, Arial, sans-serif;
  --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
  --shadow:none;
}
:root[data-marke="dzm-bund"][data-theme="light"]{
  --lime:#004B76;
  --lime-strong:#00375B;
  --on-lime:#FFFFFF;
  --bg:#F2F4F6;
  --surface:#FFFFFF;
  --surface-2:#EEEFF1;
  --surface-3:#E1E5E8;
  --ink:#111314;
  --ink-soft:#4C4F50;
  --ink-faint:#63686A;
  --line:#D5DADD;
  --line-strong:#7E8587;
  --accent-ink:#004B76;
  --rail:#004B76;
  --rail-ink:#FFFFFF;
  --rail-ink-soft:#B8CBD9;
  --rail-panel:#01608F;
  --good:#00854A;
  --warn:#7A4E00;
  --bad:#C0003C;
  --info:#0071AD;
  --good-bg:rgba(0,133,74,.10);
  --warn-bg:rgba(122,78,0,.12);
  --bad-bg:rgba(192,0,60,.10);
  --info-bg:rgba(0,113,173,.10);
  --r:2px;
  --r-sm:2px;
  --r-lg:2px;
  --sans:'Fira Sans', Calibri, Verdana, Arial, sans-serif;
  --disp:'Fira Sans', Calibri, Verdana, Arial, sans-serif;
  --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
  --shadow:none;
}
@media(prefers-color-scheme:light){
  :root[data-marke="dzm-bund"]:not([data-theme="dark"]){
    --lime:#004B76;
    --lime-strong:#00375B;
    --on-lime:#FFFFFF;
    --bg:#F2F4F6;
    --surface:#FFFFFF;
    --surface-2:#EEEFF1;
    --surface-3:#E1E5E8;
    --ink:#111314;
    --ink-soft:#4C4F50;
    --ink-faint:#63686A;
    --line:#D5DADD;
    --line-strong:#7E8587;
    --accent-ink:#004B76;
    --rail:#004B76;
    --rail-ink:#FFFFFF;
    --rail-ink-soft:#B8CBD9;
    --rail-panel:#01608F;
    --good:#00854A;
    --warn:#7A4E00;
    --bad:#C0003C;
    --info:#0071AD;
    --good-bg:rgba(0,133,74,.10);
    --warn-bg:rgba(122,78,0,.12);
    --bad-bg:rgba(192,0,60,.10);
    --info-bg:rgba(0,113,173,.10);
    --r:2px;
    --r-sm:2px;
    --r-lg:2px;
    --sans:'Fira Sans', Calibri, Verdana, Arial, sans-serif;
    --disp:'Fira Sans', Calibri, Verdana, Arial, sans-serif;
    --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
    --shadow:none;
  }
}

/* MARKE-ENDE dzm-bund */

/* MARKE-ANFANG dzm-foerderbank — erzeugt aus marken/dzm-foerderbank.json durch werkzeug/marke.mjs.
   NICHT von Hand ändern: der nächste Lauf überschreibt diesen Block.
   Förderbank — NRW.BANK und KfW, Warmpapier statt Systemgrau
   Beleg: Gemessen 2026-08-27: nrwbank.de (743.357 B CSS aus 8 Blättern) #024da1 (324 Nennungen — der häufigste Einzelwert aller zehn gemessenen Auftritte), #009fe3 (52), #e6edf6 (52), #d8d8d8 (50), #4a4a4a (51); kfw.de (7.037.164 B CSS) #00446e (25), #1b618c (25), #005a8c (14), Warmpapier #f6f5ed (6) und #f3efeb (3), Rot #ca0036 (3), Grün #398357 (2), #00375b (2), Neutral #2d3134 / #41484c / #6d767d / #a1adb5. Radius gemessen 4px (kfw 92 Nennungen, nrwbank 40) und 8px (20) — als einzige der fünf Richtungen nicht kantig. SCHRIFT: nrwbank.de fährt Roboto (11 Nennungen) — frei verfügbar und hier UNVERAENDERT übernommen, keine Ersatzwahl nötig; kfw.de fährt das lizenzpflichtige KfW-Centro-Sans, das bleibt aussen vor. ink-faint (#6d767d hält auf Warmpapier nur 4.26:1) und line-strong (#a1adb5 nur 2.29:1 auf Weiss) sind auf AA nachgezogen; warn ist eigene Festlegung.
   Alle Farbpaare gegen WCAG AA gerechnet, sonst wäre nichts geschrieben worden. */
:root[data-marke="dzm-foerderbank"]{
  --lime:#6FAEE8;
  --lime-strong:#9CC8F0;
  --on-lime:#04203D;
  --bg:#0D1116;
  --surface:#141A21;
  --surface-2:#1A222B;
  --surface-3:#232D38;
  --ink:#ECEFF2;
  --ink-soft:#B4BEC8;
  --ink-faint:#9DA9B4;
  --line:#24303B;
  --line-strong:#5F6E7C;
  --accent-ink:#6FAEE8;
  --rail:#08121C;
  --rail-ink:#ECEFF2;
  --rail-ink-soft:#AFC0D0;
  --rail-panel:#141A21;
  --good:#5FC98F;
  --warn:#EBBF6B;
  --bad:#F5949E;
  --info:#6FAEE8;
  --good-bg:rgba(95,201,143,.14);
  --warn-bg:rgba(235,191,107,.14);
  --bad-bg:rgba(245,148,158,.14);
  --info-bg:rgba(111,174,232,.14);
  --r:4px;
  --r-sm:3px;
  --r-lg:8px;
  --sans:'Roboto', Arial, Helvetica, sans-serif;
  --disp:'Roboto', Arial, Helvetica, sans-serif;
  --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
  --shadow:none;
}
:root[data-marke="dzm-foerderbank"][data-theme="light"]{
  --lime:#024DA1;
  --lime-strong:#00375B;
  --on-lime:#FFFFFF;
  --bg:#F6F5ED;
  --surface:#FFFFFF;
  --surface-2:#F3EFEB;
  --surface-3:#E4E0D4;
  --ink:#2D3134;
  --ink-soft:#41484C;
  --ink-faint:#636C72;
  --line:#DCD8CC;
  --line-strong:#848D94;
  --accent-ink:#024DA1;
  --rail:#00375B;
  --rail-ink:#FFFFFF;
  --rail-ink-soft:#B9CBDA;
  --rail-panel:#024DA1;
  --good:#398357;
  --warn:#7A4A00;
  --bad:#CA0036;
  --info:#005A8C;
  --good-bg:rgba(57,131,87,.10);
  --warn-bg:rgba(122,74,0,.12);
  --bad-bg:rgba(202,0,54,.10);
  --info-bg:rgba(0,90,140,.10);
  --r:4px;
  --r-sm:3px;
  --r-lg:8px;
  --sans:'Roboto', Arial, Helvetica, sans-serif;
  --disp:'Roboto', Arial, Helvetica, sans-serif;
  --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
  --shadow:none;
}
@media(prefers-color-scheme:light){
  :root[data-marke="dzm-foerderbank"]:not([data-theme="dark"]){
    --lime:#024DA1;
    --lime-strong:#00375B;
    --on-lime:#FFFFFF;
    --bg:#F6F5ED;
    --surface:#FFFFFF;
    --surface-2:#F3EFEB;
    --surface-3:#E4E0D4;
    --ink:#2D3134;
    --ink-soft:#41484C;
    --ink-faint:#636C72;
    --line:#DCD8CC;
    --line-strong:#848D94;
    --accent-ink:#024DA1;
    --rail:#00375B;
    --rail-ink:#FFFFFF;
    --rail-ink-soft:#B9CBDA;
    --rail-panel:#024DA1;
    --good:#398357;
    --warn:#7A4A00;
    --bad:#CA0036;
    --info:#005A8C;
    --good-bg:rgba(57,131,87,.10);
    --warn-bg:rgba(122,74,0,.12);
    --bad-bg:rgba(202,0,54,.10);
    --info-bg:rgba(0,90,140,.10);
    --r:4px;
    --r-sm:3px;
    --r-lg:8px;
    --sans:'Roboto', Arial, Helvetica, sans-serif;
    --disp:'Roboto', Arial, Helvetica, sans-serif;
    --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
    --shadow:none;
  }
}

/* MARKE-ENDE dzm-foerderbank */

/* MARKE-ANFANG dzm-gericht — erzeugt aus marken/dzm-gericht.json durch werkzeug/marke.mjs.
   NICHT von Hand ändern: der nächste Lauf überschreibt diesen Block.
   Gerichtsrot — Bundesgerichtshof, Aktenfarbe Bordeaux
   Beleg: Gemessen 2026-08-27 aus bundesgerichtshof.de (153.721 B CSS aus 8 Blättern, Blätter erst über das base-href der Seite erreichbar): #7e0731 (43 Nennungen, Primär), #570422 (9), #b40a2f (6), #750b31 (5), Tinte #0a0a0a (8), Grund #f3f1f2 (3), #ebe9ea (17), Neutral #8a8a8a (5) / #c1bfc0 (4). Radius dort 0 und 2px. SCHRIFT bundessansweb — lizenzpflichtig, Ersatz Libre Franklin (Franklin-Gothic-Linie, Grundlage auch des US-Behörden-Systems). NACHTEIL AUSDRUECKLICH: Primärfarbe und Fehlerfarbe sind beide rot (#7e0731 gegen #b40a2f) — so fährt der BGH es selbst; die Zustände tragen im Register zusätzlich Text, nicht nur Farbe. ink-soft, ink-faint, warn, good und info sind eigene AA-Festlegungen, der Auftritt ist ausserhalb von Rot und Grau nicht belegt.
   Alle Farbpaare gegen WCAG AA gerechnet, sonst wäre nichts geschrieben worden. */
:root[data-marke="dzm-gericht"]{
  --lime:#DFA3B2;
  --lime-strong:#EFC5D0;
  --on-lime:#2A0512;
  --bg:#120B0E;
  --surface:#1B1216;
  --surface-2:#23181D;
  --surface-3:#2E2027;
  --ink:#F2EDEF;
  --ink-soft:#C4B6BB;
  --ink-faint:#AE9EA5;
  --line:#33242A;
  --line-strong:#7A656D;
  --accent-ink:#DFA3B2;
  --rail:#0C0609;
  --rail-ink:#F2EDEF;
  --rail-ink-soft:#C9B2BA;
  --rail-panel:#1B1216;
  --good:#6FCC9B;
  --warn:#E8BE6A;
  --bad:#F5938C;
  --info:#92B4D6;
  --good-bg:rgba(111,204,155,.14);
  --warn-bg:rgba(232,190,106,.14);
  --bad-bg:rgba(245,147,140,.14);
  --info-bg:rgba(146,180,214,.14);
  --r:0px;
  --r-sm:0px;
  --r-lg:0px;
  --sans:'Libre Franklin', 'Droid Sans', Arial, Helvetica, sans-serif;
  --disp:'Libre Franklin', 'Droid Sans', Arial, Helvetica, sans-serif;
  --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
  --shadow:none;
}
:root[data-marke="dzm-gericht"][data-theme="light"]{
  --lime:#7E0731;
  --lime-strong:#570422;
  --on-lime:#FFFFFF;
  --bg:#F3F1F2;
  --surface:#FFFFFF;
  --surface-2:#EBE9EA;
  --surface-3:#DFDCDD;
  --ink:#0A0A0A;
  --ink-soft:#4A4547;
  --ink-faint:#6B6567;
  --line:#DAD6D7;
  --line-strong:#8A8A8A;
  --accent-ink:#7E0731;
  --rail:#570422;
  --rail-ink:#FFFFFF;
  --rail-ink-soft:#D8BCC7;
  --rail-panel:#6E0A2C;
  --good:#14603C;
  --warn:#7A4A00;
  --bad:#B40A2F;
  --info:#34506B;
  --good-bg:rgba(20,96,60,.10);
  --warn-bg:rgba(122,74,0,.12);
  --bad-bg:rgba(180,10,47,.10);
  --info-bg:rgba(52,80,107,.10);
  --r:0px;
  --r-sm:0px;
  --r-lg:0px;
  --sans:'Libre Franklin', 'Droid Sans', Arial, Helvetica, sans-serif;
  --disp:'Libre Franklin', 'Droid Sans', Arial, Helvetica, sans-serif;
  --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
  --shadow:none;
}
@media(prefers-color-scheme:light){
  :root[data-marke="dzm-gericht"]:not([data-theme="dark"]){
    --lime:#7E0731;
    --lime-strong:#570422;
    --on-lime:#FFFFFF;
    --bg:#F3F1F2;
    --surface:#FFFFFF;
    --surface-2:#EBE9EA;
    --surface-3:#DFDCDD;
    --ink:#0A0A0A;
    --ink-soft:#4A4547;
    --ink-faint:#6B6567;
    --line:#DAD6D7;
    --line-strong:#8A8A8A;
    --accent-ink:#7E0731;
    --rail:#570422;
    --rail-ink:#FFFFFF;
    --rail-ink-soft:#D8BCC7;
    --rail-panel:#6E0A2C;
    --good:#14603C;
    --warn:#7A4A00;
    --bad:#B40A2F;
    --info:#34506B;
    --good-bg:rgba(20,96,60,.10);
    --warn-bg:rgba(122,74,0,.12);
    --bad-bg:rgba(180,10,47,.10);
    --info-bg:rgba(52,80,107,.10);
    --r:0px;
    --r-sm:0px;
    --r-lg:0px;
    --sans:'Libre Franklin', 'Droid Sans', Arial, Helvetica, sans-serif;
    --disp:'Libre Franklin', 'Droid Sans', Arial, Helvetica, sans-serif;
    --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
    --shadow:none;
  }
}

/* MARKE-ENDE dzm-gericht */

/* MARKE-ANFANG dzm-steuer — erzeugt aus marken/dzm-steuer.json durch werkzeug/marke.mjs.
   NICHT von Hand ändern: der nächste Lauf überschreibt diesen Block.
   Steuergrün — Bundeszentralamt für Steuern, serifengeführt
   Beleg: Gemessen 2026-08-27 aus bzst.de (407.784 B CSS aus 8 Blättern): #23614e (110 Nennungen, Primär), #74ccb1 (181, Mint), Tinte #081813 (91), Grund #f2f3f4 (114), #a7c0b8 (37), #4f8171 (15), Rot #d00000 (17). Radius dort 0 und 2px. SCHRIFT: bzst.de führt bundesserifweb (22 Nennungen) VOR bundessansweb (12) — als einziger der gemessenen Auftritte serifengeführt. Beide Bundesschriften sind lizenzpflichtig; Ersatz Source Serif 4 (Überschrift) und Source Sans 3 (Fliesstext), Festlegung des Hauses. ink-faint: Korpuswert #4f8171 hält auf dem Korpusgrund nur 4.46:1 und ist auf #457165 nachgezogen; line-strong und warn sind eigene AA-Festlegungen.
   Alle Farbpaare gegen WCAG AA gerechnet, sonst wäre nichts geschrieben worden. */
:root[data-marke="dzm-steuer"]{
  --lime:#74CCB1;
  --lime-strong:#9BE0CB;
  --on-lime:#06231B;
  --bg:#071310;
  --surface:#0D1E19;
  --surface-2:#123028;
  --surface-3:#17392F;
  --ink:#E9F2EE;
  --ink-soft:#AEC5BC;
  --ink-faint:#98B3A9;
  --line:#1C382F;
  --line-strong:#5A7A6E;
  --accent-ink:#74CCB1;
  --rail:#050F0C;
  --rail-ink:#E9F2EE;
  --rail-ink-soft:#A7C0B8;
  --rail-panel:#0D1E19;
  --good:#74CCB1;
  --warn:#E8BE6A;
  --bad:#F2A0A0;
  --info:#8FC6D6;
  --good-bg:rgba(116,204,177,.14);
  --warn-bg:rgba(232,190,106,.14);
  --bad-bg:rgba(242,160,160,.14);
  --info-bg:rgba(143,198,214,.14);
  --r:0px;
  --r-sm:0px;
  --r-lg:0px;
  --sans:'Source Sans 3', Calibri, 'Droid Sans', Arial, sans-serif;
  --disp:'Source Serif 4', Cambria, Georgia, 'Times New Roman', serif;
  --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
  --shadow:none;
}
:root[data-marke="dzm-steuer"][data-theme="light"]{
  --lime:#23614E;
  --lime-strong:#184636;
  --on-lime:#FFFFFF;
  --bg:#F2F3F4;
  --surface:#FFFFFF;
  --surface-2:#EAEEEC;
  --surface-3:#DCE5E1;
  --ink:#081813;
  --ink-soft:#405850;
  --ink-faint:#457165;
  --line:#D3DEDA;
  --line-strong:#78948B;
  --accent-ink:#23614E;
  --rail:#081813;
  --rail-ink:#FFFFFF;
  --rail-ink-soft:#A7C0B8;
  --rail-panel:#12332A;
  --good:#1F6B45;
  --warn:#7A4A00;
  --bad:#D00000;
  --info:#2E5A6B;
  --good-bg:rgba(31,107,69,.10);
  --warn-bg:rgba(122,74,0,.12);
  --bad-bg:rgba(208,0,0,.10);
  --info-bg:rgba(46,90,107,.10);
  --r:0px;
  --r-sm:0px;
  --r-lg:0px;
  --sans:'Source Sans 3', Calibri, 'Droid Sans', Arial, sans-serif;
  --disp:'Source Serif 4', Cambria, Georgia, 'Times New Roman', serif;
  --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
  --shadow:none;
}
@media(prefers-color-scheme:light){
  :root[data-marke="dzm-steuer"]:not([data-theme="dark"]){
    --lime:#23614E;
    --lime-strong:#184636;
    --on-lime:#FFFFFF;
    --bg:#F2F3F4;
    --surface:#FFFFFF;
    --surface-2:#EAEEEC;
    --surface-3:#DCE5E1;
    --ink:#081813;
    --ink-soft:#405850;
    --ink-faint:#457165;
    --line:#D3DEDA;
    --line-strong:#78948B;
    --accent-ink:#23614E;
    --rail:#081813;
    --rail-ink:#FFFFFF;
    --rail-ink-soft:#A7C0B8;
    --rail-panel:#12332A;
    --good:#1F6B45;
    --warn:#7A4A00;
    --bad:#D00000;
    --info:#2E5A6B;
    --good-bg:rgba(31,107,69,.10);
    --warn-bg:rgba(122,74,0,.12);
    --bad-bg:rgba(208,0,0,.10);
    --info-bg:rgba(46,90,107,.10);
    --r:0px;
    --r-sm:0px;
    --r-lg:0px;
    --sans:'Source Sans 3', Calibri, 'Droid Sans', Arial, sans-serif;
    --disp:'Source Serif 4', Cambria, Georgia, 'Times New Roman', serif;
    --mono:'Roboto Mono', ui-monospace, Menlo, monospace;
    --shadow:none;
  }
}

/* MARKE-ENDE dzm-steuer */

/* MARKE-ANFANG dzm-transparenz — erzeugt aus marken/dzm-transparenz.json durch werkzeug/marke.mjs.
   NICHT von Hand ändern: der nächste Lauf überschreibt diesen Block.
   Registerblau — Transparenzregister und Bundesanzeiger, Roboto, Flächen in Blauweiß
   Beleg: Gemessen 2026-09-07 aus transparenzregister.de (Angular Material, styles-UAN6BV2E.css 130.756 B, Roboto 27 Nennungen, Radius 3px) und den Bildschirmaufnahmen des Operators (inbox/ZDM Deisgn Funktion): Leiste und Primärknopf #395e9d, Seitengrund #f9f9ff, Tabellenfläche #eef0f8, Tinte #1d1b1e, Zustand grün #a6d3a5, Chip-Grau #494c51. bundesanzeiger.de (main.css 555.223 B): #006378 (112 Nennungen, Sekundärton), #ac1231 (68, Alarm), #1e252b (85, Tinte), #dddedf (88, Linie), #f4f4f4 (45, Grund), Radius 4px (54), Roboto Medium/Light. Roboto ist frei verfügbar und wird unverändert übernommen. Dunkles Thema, ink-faint, line-strong und warn sind eigene AA-Festlegungen; die Auftritte fahren nur hell.
   Alle Farbpaare gegen WCAG AA gerechnet, sonst wäre nichts geschrieben worden. */
:root[data-marke="dzm-transparenz"]{
  --lime:#9fb9ea;
  --lime-strong:#c3d4f3;
  --on-lime:#0e1f3d;
  --bg:#101418;
  --surface:#171c22;
  --surface-2:#1e252d;
  --surface-3:#273039;
  --ink:#eceff3;
  --ink-soft:#b6bcc5;
  --ink-faint:#97a0ab;
  --line:#2c3641;
  --line-strong:#5f6c7b;
  --accent-ink:#9fb9ea;
  --rail:#2b477a;
  --rail-ink:#ffffff;
  --rail-ink-soft:#dbe3f3;
  --rail-panel:#395e9d;
  --good:#8fd39a;
  --warn:#f0d264;
  --bad:#f3a396;
  --info:#9fb9ea;
  --shadow:0 1px 2px rgba(0,0,0,.06);
  --r:4px;
  --r-sm:4px;
  --r-lg:4px;
  --sans:Roboto, 'Segoe UI', Arial, sans-serif;
  --disp:Roboto, 'Segoe UI', Arial, sans-serif;
  --schrift-url:https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap;
}
:root[data-marke="dzm-transparenz"][data-theme="light"]{
  --lime:#395e9d;
  --lime-strong:#2b477a;
  --on-lime:#ffffff;
  --bg:#f9f9ff;
  --surface:#ffffff;
  --surface-2:#eef0f8;
  --surface-3:#e2e6f2;
  --ink:#1d1b1e;
  --ink-soft:#494c51;
  --ink-faint:#5c6168;
  --line:#dddedf;
  --line-strong:#8a8e93;
  --accent-ink:#2b477a;
  --rail:#395e9d;
  --rail-ink:#ffffff;
  --rail-ink-soft:#dbe3f3;
  --rail-panel:#2b477a;
  --good:#1f6b2c;
  --warn:#6b5300;
  --bad:#ac1231;
  --info:#2b477a;
  --shadow:0 1px 2px rgba(0,0,0,.06);
  --r:4px;
  --r-sm:4px;
  --r-lg:4px;
  --sans:Roboto, 'Segoe UI', Arial, sans-serif;
  --disp:Roboto, 'Segoe UI', Arial, sans-serif;
  --schrift-url:https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap;
}
@media(prefers-color-scheme:light){
  :root[data-marke="dzm-transparenz"]:not([data-theme="dark"]){
    --lime:#395e9d;
    --lime-strong:#2b477a;
    --on-lime:#ffffff;
    --bg:#f9f9ff;
    --surface:#ffffff;
    --surface-2:#eef0f8;
    --surface-3:#e2e6f2;
    --ink:#1d1b1e;
    --ink-soft:#494c51;
    --ink-faint:#5c6168;
    --line:#dddedf;
    --line-strong:#8a8e93;
    --accent-ink:#2b477a;
    --rail:#395e9d;
    --rail-ink:#ffffff;
    --rail-ink-soft:#dbe3f3;
    --rail-panel:#2b477a;
    --good:#1f6b2c;
    --warn:#6b5300;
    --bad:#ac1231;
    --info:#2b477a;
    --shadow:0 1px 2px rgba(0,0,0,.06);
    --r:4px;
    --r-sm:4px;
    --r-lg:4px;
    --sans:Roboto, 'Segoe UI', Arial, sans-serif;
    --disp:Roboto, 'Segoe UI', Arial, sans-serif;
    --schrift-url:https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap;
  }
}

/* MARKE-ENDE dzm-transparenz */