/* ============================================================
   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:14px;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:.875rem;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:14px;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:14px;color:var(--rail-ink);font-weight:600}
.rail-foot span{font-size:14px;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:14px;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)}

.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:16px}
.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:14px;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:14px;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:14px;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:14px}
.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:14px;color:var(--ink-faint);white-space:nowrap}
.card-body{padding:6px 22px 18px}
table{width:100%;border-collapse:collapse}
th{font-size:14px;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:14px;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:14px;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:16px;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:14px}
.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:14px;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:14px;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:14px;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:14px;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:15px;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)}
.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:14px;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:15px;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:15px;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)}

/* ============================================================
   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)}

/* --- 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)}