:root{
  /* ==================================================================
     Designsystem "ImmoBricks" v1.1 — Tannengrün + Bronze, Space Grotesk/Inter.
     Signature-Element „Brick" (2:1, Radius 2px). Neutrale Kalkflächen tragen den
     Inhalt, Grün ist bedeutungstragend (Aktion/positiv), Bronze sparsamer Zweitakzent.
     Die bekannten semantischen Namen (--bg/--surface/--ink/--accent/--radius …) bleiben
     erhalten und sind auf ImmoBricks-Werte umgemappt → bestehende Regeln brechen nicht.
     ================================================================== */
  /* --- ImmoBricks-Skalen (rohe Marken-Töne) --- */
  --forest-900:#14261F;  /* Sidebar / Dark */
  --forest-800:#183A2C;  /* Feature-Karten */
  --green-700:#1C5A40;   /* Primär-Button */
  --green-600:#2A7A57;   /* Akzent / Avatar */
  --green-500:#2C7A55;   /* positive Werte */
  --bronze-500:#CBA76A;  /* Zweitakzent */
  --bronze-600:#B98A46;  /* Workspace-Avatar */
  --bronze-100:#EADFC7;  /* Füllung auf Grün */
  --bronze-ink:#18211D;  /* fixer (nicht Dark-Mode-invertierter) Text auf Bronze-Flächen – Kontrast bleibt in beiden Themes gleich gut */
  --slate-700:#4A554E; --slate-600:#5A655E; --slate-400:#8A968E; --slate-300:#A7B0AA;
  --canvas:#EEF0ED;      /* Seitenhintergrund */
  --surface-2:#F4F6F3;   /* ruhige Zweitfläche (Sub-Panels, Tabellenkopf-Tint) */
  --field-line:#E0E4DF;  /* Formular-Rahmen */
  --anl-stack-1:#E1E6DF; /* Wohnanlage-Stapel: 1. Ebene dahinter */
  --anl-stack-2:#C9D0C5; /* Wohnanlage-Stapel: 2. Ebene, dunkler */

  /* --- Semantische Aliase (bestehende Namen, ImmoBricks-Werte) --- */
  --bg:#EEF0ED;          /* Canvas – ruhiger Seitenhintergrund */
  --surface:#FFFFFF;     /* Karten – reinweiß */
  --ink:#18211D;         /* Tiefes Tannen-Ink (Überschriften/Text) */
  --ink-soft:#5A655E;    /* gedämpfter Slate (Fließtext/Meta) */
  --ink-faint:#8A938C;   /* dritte, blasseste Stufe (Zeitstempel, Hilfstexte) — wurde in der
                            Kundenakte 15× benutzt, war aber nirgends definiert: die Regeln
                            waren dadurch ungültig und erbten eine zufällige Farbe. */
  --line:#E4E8E3;        /* Rahmen/Trenner */
  /* Panels separat themebar: Default = wie Seite. Für dunkle Themes mit HELLEN
     Panels einfach diese 5 überschreiben – Panel-Inhalt folgt automatisch. */
  --panel-bg:var(--surface);
  --panel-bg-soft:var(--bg);
  --panel-ink:var(--ink);
  --panel-ink-soft:var(--ink-soft);
  --panel-line:var(--line);
  --accent:#1C5A40;      /* Tannengrün – primäre Aktion */
  --accent-dark:#164A34; /* Hover/aktiv */
  --accent-soft:#E4EFE7; /* helle Grünfüllung (Chips/Hint) */
  --accent-ink:#FFFFFF;  /* Text auf Grün-Flächen (Buttons) */
  --gold:#CBA76A;        /* Bronze */
  --green:#2C7A55;       /* positive Werte / Success */
  --green-soft:#E4EFE7;
  --red:#C2483A;         /* Danger */
  --info:#3F6B8A;
  --hint-bg:#EEF2EC;     /* Hinweis-Boxen (ruhige Grün-Kalk-Fläche) */
  --verdict-bg:#14261F;  /* Fazit-Fläche – Forest 900 */
  --verdict-ink:#FFFFFF;
  --verdict-ink-soft:#B7C3BB;   /* gedämpftes Hell auf Dunkelgrün */
  --verdict-line:rgba(255,255,255,.14);

  /* --- Radius-Skala (wächst mit der Fläche) --- */
  --r-xs:5px; --r-sm:8px; --r-md:10px; --r-lg:14px; --r-xl:16px; --r-pill:99px;
  --brick-radius:2px;    /* Signature-Element „Brick" */
  --radius:14px;         /* Default (lg) – ersetzt altes 18px */

  /* --- Elevation: sehr flach, Tiefe über Rahmen+Fläche --- */
  --shadow-raised:0 1px 2px rgba(20,38,31,.05), 0 1px 3px rgba(20,38,31,.05);
  --shadow-overlay:0 8px 24px -6px rgba(20,38,31,.12);
  --shadow-modal:0 20px 48px -12px rgba(20,38,31,.22);
  --shadow:var(--shadow-overlay);
  --shadow-sm:var(--shadow-raised);

  /* --- Motion (funktional, kurz; respektiert reduced-motion) --- */
  /* --dur-fast/--dur-base/--dur-enter/--ease-out: siehe Motion-:root weiter unten (globaler Override) */
  --dur-drawer:300ms;
  --stagger:60ms;
  --ease-in:cubic-bezier(.4,0,.9,.4);

  /* --- Schriften: Space Grotesk (Display/Headings/Zahlen), Inter (Body/UI) --- */
  --font-head:'Space Grotesk','Inter',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
  --font-num:'Space Grotesk','Inter',system-ui,sans-serif; /* Zahlen: tnum-fähig */
}
*{box-sizing:border-box;margin:0;padding:0}
/* Panel-Kontext: Karten biegen die Kontext-Variablen auf die Panel-Werte um, damit
   aller Inhalt (Text, gedämpfter Text, Inputs, Rahmen, verschachtelte Flächen) der
   Panel-Farbgebung folgt – ermöglicht z. B. dunklen Seitenhintergrund + helle Panels. */
.wiz-body,.calc-card,.modal-card,.lead-card,.eval-card,.eval-empty,
.kpi-group,.chart-card,.table-card,.etf-card,.investor-card,
.cashflow-card,.details-card,.feature-card,.plan{
  --surface:var(--panel-bg);
  --bg:var(--panel-bg-soft);
  --ink:var(--panel-ink);
  --ink-soft:var(--panel-ink-soft);
  --ink-faint:var(--panel-ink-soft);
  --line:var(--panel-line);
  background:var(--panel-bg);
  color:var(--ink);
}
html{scroll-behavior:smooth}
body{
  font-family:var(--font-body);
  background:var(--bg);color:var(--ink);
  line-height:1.55;-webkit-font-smoothing:antialiased;
}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}
.hidden{display:none!important}
em{font-style:normal;color:var(--accent)}
h1,h2,h3{font-family:var(--font-head);font-weight:600;line-height:1.12;color:var(--ink)}
a{color:var(--accent-dark)}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.4em;
  font:inherit;font-weight:700;border:none;border-radius:13px;
  padding:.8em 1.6em;cursor:pointer;transition:.18s;text-decoration:none;
}
.btn-lg{padding:1em 2.1em;font-size:1.05rem}
.btn-primary{background:var(--accent);color:var(--accent-ink);box-shadow:0 8px 20px rgba(28,90,64,.3)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(28,90,64,.38)}
.btn-ghost{background:transparent;color:var(--ink-soft);border:1.5px solid var(--line)}
.btn-ghost:hover:not(:disabled){border-color:var(--accent);color:var(--accent-dark)}
.btn-nudge{border-color:var(--accent);color:var(--accent-dark);font-weight:600}
.btn-bronze{background:var(--bronze-500);color:var(--bronze-ink);box-shadow:0 6px 16px rgba(185,138,70,.28)}
.btn-bronze:hover:not(:disabled){background:var(--bronze-600);box-shadow:0 10px 22px rgba(185,138,70,.35)}
.btn:disabled{opacity:.5;cursor:not-allowed}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(253,250,241,.88);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{font-family:var(--font-body);font-weight:700;font-size:1.12rem;letter-spacing:-.01em;color:var(--ink);text-decoration:none;display:inline-flex;align-items:center}
.brand-accent{color:inherit}
.brand-icon{width:1.55em;height:1.55em;flex:none;margin-right:.45em;border-radius:.34em}
.nav-link{font-weight:600;text-decoration:none;font-size:.95rem}

/* Hero */
.hero{text-align:center;padding:72px 24px 40px}
.badge{display:inline-block;background:var(--green-soft);color:var(--green);font-weight:600;font-size:.85rem;padding:.45em 1em;border-radius:999px;margin-bottom:26px}
.hero-title{font-size:clamp(2.3rem,5.5vw,4rem);letter-spacing:-.02em;margin-bottom:20px}
.hero-sub{max-width:620px;margin:0 auto 32px;font-size:1.15rem;color:var(--ink-soft)}
.trust-row{list-style:none;display:flex;flex-wrap:wrap;gap:10px 22px;justify-content:center;margin-top:30px;color:var(--ink-soft);font-size:.92rem}

/* Features */
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:30px 24px 20px}
.feature-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow-sm)}
.fc-icon{font-size:1.8rem;margin-bottom:12px}
.feature-card h3{font-size:1.2rem;margin-bottom:8px}
.feature-card p{color:var(--ink-soft);font-size:.96rem}

/* Plans */
.plans{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;padding:36px 24px 80px}
.plan{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:32px;box-shadow:var(--shadow-sm);position:relative}
.plan-pro{background:linear-gradient(160deg,var(--surface),var(--hint-bg));border-color:var(--accent-soft)}
.pro-tag{position:absolute;top:22px;right:22px;background:var(--gold);color:#fff;font-size:.78rem;font-weight:600;padding:.3em .8em;border-radius:999px}
.plan h3{font-size:1.5rem}
.plan-price{font-size:1.05rem;color:var(--accent-dark);font-weight:600;margin:.2em 0 18px}
.plan ul{list-style:none;margin-bottom:24px}
.plan li{padding:7px 0;border-bottom:1px solid var(--line);color:var(--ink-soft)}

/* Wizard */
.wizard{min-height:100vh;padding:48px 0 90px}
.wiz-head{margin-bottom:30px}
.wiz-progress{height:8px;background:var(--line);border-radius:999px;overflow:hidden}
.wiz-progress-bar{height:100%;width:0;background:linear-gradient(90deg,var(--gold),var(--accent));transition:width .4s}
.wiz-step-label{margin-top:10px;font-size:.88rem;color:var(--ink-soft);font-weight:500}
.wiz-body{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:40px;box-shadow:var(--shadow);min-height:340px}
.wiz-title{font-size:1.7rem;margin-bottom:8px}
.wiz-title:focus{outline:none}
.wiz-intro{color:var(--ink-soft);margin-bottom:28px;max-width:640px}
.wiz-nav{display:flex;justify-content:space-between;margin-top:26px}

/* Fields */
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.field{display:flex;flex-direction:column;gap:7px}
.field.full{grid-column:1/-1}
.field>span{font-weight:600;font-size:.95rem}
.field input,.field select{
  font:inherit;padding:.75em .9em;border:1.5px solid var(--line);border-radius:12px;
  background:var(--bg);color:var(--ink);transition:.15s;width:100%;
}
.field input:focus,.field select:focus{outline:none;border-color:var(--accent);background:var(--surface)}
/* Aus dem Objekt vorbelegte Felder im Wizard sanft hervorheben (Markierung klärt sich beim Bearbeiten) */
.prefill-badge{display:inline-block;margin-left:8px;font-size:.62rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--green);background:var(--green-soft);border:1px solid var(--green);border-radius:999px;padding:.15em .55em;vertical-align:middle;white-space:nowrap}
.pf-field:not(.checkbox-field) input,.pf-field:not(.checkbox-field) select{background:var(--green-soft);border-color:var(--green)}
.pf-field:not(.checkbox-field) input:focus,.pf-field:not(.checkbox-field) select:focus{background:var(--surface)}
.input-suffix{position:relative}
.input-suffix input{padding-right:2.6em}
.input-suffix .suffix{position:absolute;right:.9em;top:50%;transform:translateY(-50%);color:var(--ink-soft);font-size:.9rem;pointer-events:none}
.field-hint{font-size:.85rem;color:var(--ink-soft);background:var(--hint-bg);border-left:3px solid var(--gold);border-radius:8px;padding:9px 12px;margin-top:2px}
/* ===== Miet-Aufschlüsselung (Makler-/Pro-Modus) ===== */
.mietsplit{grid-column:1/-1;display:block;--ms-amt:150px;--ms-del:42px}
.ms-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.ms-head-title{font-size:.8rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--accent-dark)}
.ms-head-sub{font-size:.82rem;color:var(--ink-soft)}
.ms-colhead{display:grid;grid-template-columns:1fr var(--ms-amt) var(--ms-del);gap:12px;margin-top:14px;padding:0 4px}
.ms-colhead span{font-size:.78rem;font-weight:600;color:var(--ink-soft)}
.ms-colhead span:nth-child(2){text-align:right;padding-right:8px}
.ms-rows{display:flex;flex-direction:column;gap:9px;margin-top:7px}
#mietPosList{display:flex;flex-direction:column;gap:9px}
.ms-row{display:grid;grid-template-columns:1fr var(--ms-amt) var(--ms-del);gap:12px;align-items:center;animation:msRowIn .26s ease both}
@keyframes msRowIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.ms-row{animation:none}}
/* Name-Feld mit Icon links */
.ms-name{position:relative;display:flex;align-items:center;height:50px}
.ms-ico{position:absolute;left:14px;display:flex;color:var(--ink-soft);pointer-events:none}
.mietsplit .ms-namein{width:100%;height:50px;font:inherit;font-weight:600;color:var(--ink);background:var(--surface);border:1.5px solid var(--line);border-radius:12px;padding:0 14px 0 46px}
.mietsplit .ms-namein:focus{outline:none;border-color:var(--accent);background:var(--surface)}
/* Basis-Zeile „Miete Wohnung" als ruhige Pille */
.ms-base .ms-name{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:0 15px;gap:11px}
.ms-base .ms-ico{position:static;width:30px;height:30px;flex:none;border-radius:9px;background:var(--accent-soft);color:var(--accent-dark);display:flex;align-items:center;justify-content:center}
.ms-base-label{font-size:1rem;font-weight:600;color:var(--ink)}
/* Basiszeile bekommt eine eigene Spalte für den Einheiten-Umschalter — Betrag und Schloss bleiben
   dadurch bündig mit den Positionszeilen darunter. */
.ms-row.ms-base{grid-template-columns:1fr auto var(--ms-amt) var(--ms-del)}
.ms-unit{height:50px;align-self:center}
.ms-unit .ufl-seg{padding:0 .75em;font-size:.8rem}
@media(max-width:700px){ .ms-unit .ufl-seg{padding:0 .5em;font-size:.74rem} }
.ms-lock{width:var(--ms-del);height:40px;display:flex;align-items:center;justify-content:center;color:var(--line)}
/* Betrag rechtsbündig + € */
.mietsplit .ms-amount input{height:50px;text-align:right;font:inherit;font-weight:600;color:var(--ink);background:var(--surface);border:1.5px solid var(--line);border-radius:12px;padding:0 32px 0 14px;width:100%;font-variant-numeric:tabular-nums}
.mietsplit .ms-amount input:focus{outline:none;border-color:var(--accent);background:var(--surface)}
.ms-amount .suffix{color:var(--ink-soft)}
/* Einheit „€/m²" braucht mehr Raum als „€" — sonst laeuft die Zahl darunter. */
.mietsplit .ms-amount.is-qm input{padding-right:52px}
/* Entfernen-Button */
.ms-del{width:var(--ms-del);height:42px;display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid var(--line);border-radius:10px;color:var(--ink-soft);cursor:pointer;transition:.15s}
.ms-del:hover{background:rgba(201,84,60,.12);border-color:var(--red);color:var(--red)}
.ms-del:active{transform:scale(.9)}
/* Hinzufügen-Chips */
.ms-add{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:14px}
.ms-add-label{font-size:.85rem;color:var(--ink-soft);margin-right:2px}
.ms-chip{display:inline-flex;align-items:center;gap:7px;font:inherit;font-size:.88rem;font-weight:600;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:8px 14px;cursor:pointer;transition:.15s}
.ms-chip:hover{background:var(--accent-soft);border-color:var(--accent)}
.ms-chip:active{transform:scale(.94)}
.ms-chip-ic{display:flex;color:var(--accent-dark)}
.ms-chip-plus{font-size:1rem;line-height:1;color:var(--accent-dark);font-weight:700}
/* Summe */
.ms-total{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:22px;padding:15px 20px;background:var(--hint-bg);border:1px solid var(--accent-soft);border-radius:14px}
.ms-total-l{font-size:1rem;font-weight:600;color:var(--accent-dark)}
.ms-count{font-size:.82rem;font-weight:400;color:var(--ink-soft);margin-left:4px}
.ms-total-v{font-size:1.4rem;font-weight:700;color:var(--accent-dark);font-variant-numeric:tabular-nums}
.ms-total-v span{font-size:.95rem;font-weight:500;color:var(--ink-soft)}
@media(max-width:560px){.mietsplit{--ms-amt:110px;--ms-del:38px}.ms-total-v{font-size:1.15rem}}
.link-btn{background:none;border:none;color:var(--accent-dark);font:inherit;font-weight:600;cursor:pointer;text-decoration:underline;padding:0;font-size:.88rem;align-self:flex-start}
/* Gesperrte (automatisch berechnete) Felder klar als nicht editierbar kennzeichnen */
.readonly input{background-image:linear-gradient(0deg,rgba(120,110,90,.12),rgba(120,110,90,.12));color:var(--ink-soft);cursor:not-allowed;border-style:dashed}
.readonly .suffix{opacity:.55}
.readonly>span em{color:var(--ink-soft)}
.field.disabled{opacity:.5}
.field.disabled input{cursor:not-allowed}
.checkbox-field{flex-direction:row;flex-wrap:wrap;align-items:center;gap:12px;background:var(--accent-soft);padding:14px 16px;border-radius:12px;cursor:pointer}
.checkbox-field input{width:20px;height:20px;accent-color:var(--accent);flex-shrink:0;margin:0}
.checkbox-field>span{font-weight:600}
.checkbox-field .field-hint{flex-basis:100%}

/* Mini-Rechner Grenzsteuer */
.sanpro{margin-top:8px;display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.subcalc{grid-column:1/-1;background:var(--bg);border:1px dashed var(--line);border-radius:12px;padding:18px;margin-top:6px}
.subcalc .field-grid{gap:14px}
.subcalc-result{margin-top:12px;font-weight:600;color:var(--green)}

/* Calculating */
.calculating{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.calc-card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);padding:48px;max-width:520px;width:100%;text-align:center}
.calc-card h2{font-size:1.6rem;margin-bottom:26px}
.calc-bar{height:10px;background:var(--line);border-radius:999px;overflow:hidden;margin-bottom:26px}
.calc-bar-fill{height:100%;width:0;background:linear-gradient(90deg,var(--gold),var(--accent));transition:width .25s linear}
.calc-steps{list-style:none;text-align:left;display:flex;flex-direction:column;gap:12px}
.calc-steps li{display:flex;align-items:center;gap:12px;color:var(--ink-soft);opacity:.4;transition:.3s}
.calc-steps li.active{opacity:1;color:var(--ink)}
.calc-steps li .tick{width:22px;height:22px;border-radius:50%;border:2px solid var(--line);display:inline-flex;align-items:center;justify-content:center;font-size:.8rem;flex-shrink:0}
.calc-steps li.active .tick{background:var(--green);border-color:var(--green);color:#fff}

/* Gate */
.gate{min-height:100vh;padding:60px 0}
.gate-wrap{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.gate-preview{position:relative;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);max-height:560px}
.pdf-mock{background:#fff;padding:36px;font-size:.8rem}
.pdf-fade{position:absolute;left:0;right:0;bottom:0;height:55%;background:linear-gradient(180deg,transparent,rgba(255,255,255,.97))}
.gate-form h2{font-size:1.9rem;margin-bottom:12px}
.gate-form p{color:var(--ink-soft);margin-bottom:24px}
.checkbox{display:flex;gap:12px;align-items:flex-start;font-size:.9rem;color:var(--ink-soft);margin:18px 0}
.checkbox input{margin-top:3px;width:18px;height:18px;accent-color:var(--accent);flex-shrink:0}
.gate-hint{font-size:.82rem;color:var(--ink-soft);margin-top:12px}

/* PDF mock content */
.pdf-mock h4{font-family:var(--font-head);font-size:1.3rem;margin-bottom:4px}
.pdf-mock .pdf-row{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid #EFE6D2}
.pdf-mock .pdf-kpi{display:flex;justify-content:space-between;background:var(--accent-soft);padding:10px 12px;border-radius:8px;margin:4px 0;font-weight:600}

/* §7b-Check */
.afa-check{border-radius:12px;padding:14px 16px;font-size:.92rem;line-height:1.5;margin-top:6px}
.afa-check:empty{display:none}
.afa-check strong{display:block;margin-bottom:3px;font-size:.98rem}
.afa-check.pos{background:var(--green-soft);color:#34603C;border:1px solid #C2DCC6}
.afa-check.neg{background:#FBE8E3;color:#9c4530;border:1px solid #eccabf}
.afa-check.info{background:var(--hint-bg);color:var(--ink-soft);border:1px solid var(--line);border-left:3px solid var(--gold)}
/* Plausibilitätshinweis zur BGF – hängt im §7b-Kasten, deshalb kein eigener Rahmen, nur eine Trennlinie. */
.afa-warn{display:block;margin-top:9px;padding-top:8px;border-top:1px solid rgba(0,0,0,.13);font-size:.88rem}
[data-theme="dark"] .afa-warn{border-top-color:rgba(255,255,255,.16)}
/* Tilgung/Wunschrate-Umschalter */
.rate-toggle-wrap{display:flex;flex-direction:column;gap:8px}
.rate-toggle-label{font-weight:600;font-size:.92rem}
.rate-toggle{align-self:flex-start}
.rate-toggle .seg{padding:.5em 1.2em}
/* Objektart-Auswahl als illustrierte Kacheln */
.tiles-label{font-weight:600;font-size:.95rem;display:block;margin-bottom:10px}
.objektart-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.objektart-tiles[data-cols="2"]{grid-template-columns:repeat(2,1fr)}
.ot-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:7px;
  background:var(--surface);border:2px solid var(--line);border-radius:18px;padding:16px 14px 15px;
  cursor:pointer;position:relative;font:inherit;color:inherit;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease,background .18s ease}
.ot-card:hover{border-color:var(--gold);transform:translateY(-3px);box-shadow:var(--shadow)}
.ot-card.active{border-color:var(--accent);background:var(--accent-soft);box-shadow:var(--shadow)}
.ot-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ot-card.active::after{content:"";position:absolute;top:10px;right:10px;width:20px;height:20px;border-radius:50%;
  background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat}
.ot-ill{display:block;width:100%;line-height:0}
.ot-ill svg{width:118px;max-width:100%;height:auto}
.ot-text{display:flex;flex-direction:column;gap:3px}
.ot-name{font-family:var(--font-head);font-weight:700;font-size:1.05rem;color:var(--ink);line-height:1.2}
.ot-desc{font-size:.8rem;color:var(--ink-soft);line-height:1.35}
@media(max-width:560px){
  .objektart-tiles,.objektart-tiles[data-cols="2"]{grid-template-columns:1fr;gap:10px}
  .ot-card{flex-direction:row;align-items:center;text-align:left;gap:14px;padding:12px 14px;border-radius:14px}
  .ot-ill{width:auto;flex:none}
  .ot-ill svg{width:72px}
  .ot-name{font-size:1rem}
}
.rate-info{border-radius:12px;padding:13px 16px;font-size:.9rem;line-height:1.5;margin-top:10px;background:var(--bg);border:1px solid var(--line);color:var(--ink-soft)}
.rate-info:empty{display:none}
.rate-info b{color:var(--ink)}
.rate-info.pos{background:var(--green-soft);border-color:#C2DCC6;color:#34603C}
.rate-info.pos b{color:#29512F}
.rate-info.neg{background:#FBE8E3;border-color:#eccabf;color:#9c4530}
.rate-info.neg b{color:#7d3322}
/* Pflichtfeld / Fehler */
.field.required>span::after{content:" *";color:var(--accent)}
.field input.invalid{border-color:var(--red);background:#FBE8E3}
.wiz-error{color:var(--red);font-weight:600;font-size:.9rem;margin-top:16px}
/* Modal */
.modal{position:fixed;inset:0;z-index:200;background:rgba(58,50,43,.45);display:flex;align-items:center;justify-content:center;padding:24px}
.modal-card{position:relative;background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);max-width:480px;width:100%;padding:32px}
.modal-card h3{font-size:1.4rem;margin-bottom:12px;padding-right:28px}
.modal-card>div p{color:var(--ink-soft);margin-bottom:14px}
.pauschal-list{list-style:none;margin-bottom:6px}
.pauschal-list li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}
.pauschal-list li b{color:var(--ink)}
.modal-buttons{display:flex;gap:10px;justify-content:flex-end;margin-top:22px;flex-wrap:wrap}
.modal-close{position:absolute;top:14px;right:16px;background:none;border:none;font-size:1.6rem;line-height:1;color:var(--ink-soft);cursor:pointer;padding:4px 8px;border-radius:8px}
.modal-close:hover{color:var(--accent-dark);background:var(--accent-soft)}

/* Header-Auth */
.nav-right{display:flex;align-items:center;gap:18px}
.nav-cta{padding:.55em 1.3em;font-size:.92rem}
.brand{cursor:pointer}
.nav-auth .nav-link{background:none;border:none;font:inherit;font-weight:600;color:var(--accent-dark);cursor:pointer}
.nav-profile{display:inline-flex;align-items:center;gap:8px;background:var(--accent-soft)!important;color:var(--accent-dark)!important;padding:.45em .9em!important;border-radius:999px}
.nav-profile:hover{background:#F4E3BD!important}
.nav-avatar{font-size:.95rem}
.nav-email{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.88rem}
.btn-icon{font-size:.95em}
.btn-danger{background:var(--red);color:#fff}
.btn-danger:hover{background:#a8482f;transform:translateY(-1px)}

/* Auth-Modal */
.auth-card{position:relative;max-width:430px}
.auth-tabs{display:flex;gap:6px;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:4px;margin-bottom:18px}
.auth-tab{flex:1;border:none;background:none;font:inherit;font-weight:600;color:var(--ink-soft);padding:.55em 1em;border-radius:999px;cursor:pointer;transition:.15s}
.auth-tab.active{background:var(--accent);color:#fff}
.auth-lead{color:var(--ink-soft);font-size:.92rem;margin-bottom:16px}
#authForm{display:flex;flex-direction:column;gap:14px}
#authForm .btn{margin-top:4px}
.auth-error{color:var(--red);font-weight:600;font-size:.9rem}
.auth-demo{margin-top:18px;font-size:.8rem;line-height:1.5;color:var(--ink-soft);background:var(--bg);border:1px dashed var(--line);border-radius:12px;padding:12px 14px}

/* Toast */
.toast{position:fixed;left:50%;bottom:32px;transform:translateX(-50%) translateY(20px);z-index:300;background:var(--ink);color:#fff;font-weight:600;font-size:.95rem;padding:14px 22px;border-radius:999px;box-shadow:var(--shadow);opacity:0;transition:opacity .3s,transform .3s;max-width:90vw}
.toast.visible{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.pos{background:var(--green)}
.toast.neg{background:var(--red)}

/* Profil */
.profile{padding:40px 0 80px}
.profile-email{color:var(--ink-soft);font-size:.95rem;margin-top:4px}
.eval-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:18px;margin-bottom:34px}
.eval-empty{color:var(--ink-soft);background:var(--surface);border:1px dashed var(--line);border-radius:var(--radius);padding:26px;grid-column:1/-1}
.eval-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:hidden;display:flex;flex-direction:column;transition:.15s}
.eval-card:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.eval-main{padding:20px 22px;cursor:pointer;flex:1}
.eval-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:14px}
.eval-head h3{font-size:1.2rem;line-height:1.3}
.eval-date{font-size:.8rem;color:var(--ink-soft);white-space:nowrap}
.eval-kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px}
.eval-kpi{display:flex;flex-direction:column}
.ek-val{font-family:var(--font-body);font-size:1.15rem;font-weight:600;color:var(--accent-dark)}
.ek-lbl{font-size:.78rem;color:var(--ink-soft)}
.eval-open-hint{display:inline-block;margin-top:14px;font-size:.85rem;font-weight:600;color:var(--accent-dark)}
.eval-actions{display:flex;gap:16px;padding:12px 22px;border-top:1px solid var(--line);background:var(--bg)}
.link-btn.danger{color:var(--red)}
.account-card .account-body{padding:4px 28px 28px}
.account-body h4{font-size:1.05rem;margin-bottom:14px}
.account-form{display:flex;flex-direction:column;gap:12px;max-width:420px}
.account-form .btn{align-self:flex-start;margin-top:4px}
.account-sep{border:none;border-top:1px solid var(--line);margin:26px 0 20px}
.account-warn{color:var(--ink-soft);font-size:.9rem;margin-bottom:14px;max-width:520px}

/* Lead-Gate (Blur-Overlay auf der Ergebnisseite) */
#gatedWrap{position:relative}
/* Gate: oben scharf lesbar, weicher Übergang in die Unschärfe, darunter das Formular.
   Die Unschärfe liegt als eigene backdrop-filter-Ebene über dem (scharfen) Inhalt und
   wird per Masken-Verlauf von oben (transparent = scharf) nach unten (deckend = unscharf) eingeblendet. */
#gatedZone.locked{pointer-events:none;user-select:none;max-height:900px;overflow:hidden}
.gate-blur{position:absolute;inset:0;pointer-events:none;z-index:1;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,transparent 230px,#000 360px);
          mask-image:linear-gradient(to bottom,transparent 0,transparent 230px,#000 360px)}
.gate-blur.hidden{display:none}
.lead-overlay{position:absolute;inset:0;z-index:2;display:flex;align-items:flex-start;justify-content:center;padding:300px 16px 36px;
  background:linear-gradient(to bottom,transparent 0,transparent 240px,rgba(253,250,241,.5) 360px,var(--bg) 500px)}
@media (max-width:560px){
  .gate-blur{-webkit-mask-image:linear-gradient(to bottom,transparent 0,transparent 150px,#000 260px);mask-image:linear-gradient(to bottom,transparent 0,transparent 150px,#000 260px)}
  .lead-overlay{padding-top:210px;background:linear-gradient(to bottom,transparent 0,transparent 160px,rgba(253,250,241,.5) 270px,var(--bg) 400px)}
}
.lead-overlay.hidden{display:none}
.lead-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);max-width:480px;width:100%;padding:30px;position:sticky;top:32px}
.lead-card h3{font-size:1.5rem;margin-bottom:4px}
.lead-sub{color:var(--ink-soft);margin-bottom:16px}
.lead-benefits{list-style:none;margin:0 0 20px;display:flex;flex-direction:column;gap:11px}
.lead-benefits li{display:flex;gap:10px;align-items:flex-start;font-size:.93rem;line-height:1.45}
.lead-benefits li span{flex-shrink:0}
#leadForm{display:flex;flex-direction:column;gap:13px}
.lead-hint{font-size:.85rem;color:var(--ink-soft);text-align:center;margin-top:2px}
.lead-hint .link-btn{font-size:.85rem}

/* Szenario-Banner */
.scenario-banner{display:flex;align-items:center;flex-wrap:wrap;gap:10px 20px;
  background:linear-gradient(160deg,var(--surface),var(--hint-bg));border:1px solid var(--accent-soft);
  border-radius:var(--radius);padding:13px 20px;box-shadow:var(--shadow-sm);margin-bottom:24px}
.scenario-banner-label{flex:1 1 200px;min-width:0}
.scenario-banner-label strong{display:block;font-family:var(--font-head);font-size:1.05rem}
.scenario-banner-label span{font-size:.84rem;color:var(--ink-soft)}
/* Regler in der Mitte, eingestellter Wert rechts davon — beides in derselben Zeile wie der Titel.
   order dreht die Markup-Reihenfolge (Wert steht dort vor dem Regler, damit ihn das Ziehen ohne
   Neuaufbau erreichen kann). */
.wg-wrap{order:2;flex:0 1 260px;min-width:170px}
.wg-val{order:3;display:flex;align-items:baseline;gap:5px;white-space:nowrap;min-width:104px;justify-content:flex-end}
.wg-val b{font-family:var(--font-num,var(--font-body));font-size:1.25rem;font-weight:700;color:var(--ink);
  font-variant-numeric:tabular-nums;line-height:1.1}
.wg-val span{font-size:.78rem;color:var(--ink-soft)}
.wg-range{-webkit-appearance:none;appearance:none;width:100%;height:7px;border-radius:999px;outline:none;margin:0;
  background:linear-gradient(to right,var(--accent) var(--wg-pct,40%),color-mix(in srgb,var(--accent) 16%,var(--surface)) var(--wg-pct,40%));
  border:1px solid color-mix(in srgb,var(--accent) 24%,transparent);cursor:pointer}
.wg-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;
  background:var(--surface);border:4px solid var(--accent);box-shadow:0 1px 4px rgba(20,38,31,.22);cursor:grab}
.wg-range::-webkit-slider-thumb:active{cursor:grabbing}
.wg-range::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--surface);
  border:4px solid var(--accent);box-shadow:0 1px 4px rgba(20,38,31,.22);cursor:grab}
.wg-range:focus-visible{outline:2px solid var(--accent-dark);outline-offset:4px}
/* Raster der ganzen Prozent unter dem Regler; die äußeren Marken rücken um den Reglerknopf ein. */
.wg-ticks{display:flex;justify-content:space-between;margin:4px 8px 0}
.wg-tick{display:flex;flex-direction:column;align-items:center;gap:2px}
.wg-tick i{width:1px;height:4px;background:color-mix(in srgb,var(--ink-soft) 40%,transparent)}
.wg-tick b{font-size:.68rem;font-weight:600;color:var(--ink-soft);font-variant-numeric:tabular-nums}
@media(max-width:640px){
  .scenario-banner{padding:13px 16px}
  .wg-wrap{order:3;flex:1 1 100%}
  .wg-val{order:2;min-width:0}
}
/* Kundenseitige Miet-Anpassung (view/clientarea) – optisch an .scenario-banner angelehnt */
.rent-controls{background:linear-gradient(160deg,var(--surface),var(--hint-bg));border:1px solid var(--accent-soft);border-radius:var(--radius);padding:18px 24px;box-shadow:var(--shadow-sm);margin-bottom:24px}
.rc-head strong{display:block;font-family:var(--font-head);font-size:1.15rem}
.rc-head span{font-size:.88rem;color:var(--ink-soft)}
.rc-fields{display:grid;grid-template-columns:1fr 1fr;gap:18px 28px;margin-top:16px}
@media(max-width:640px){.rc-fields{grid-template-columns:1fr}}
.rc-field{display:flex;flex-direction:column;gap:8px}
.rc-field-lbl{font-size:.9rem;font-weight:600;color:var(--ink);display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.rc-field-lbl b{font-family:var(--font-num,var(--font-body));color:var(--accent-dark);font-variant-numeric:tabular-nums}
.rc-inrow{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.rc-inwrap{position:relative;display:inline-flex;align-items:center}
.rc-inwrap input{width:110px;font:inherit;font-weight:600;padding:.55em 2.6em .55em .7em;border:1.5px solid var(--field-line,var(--line));border-radius:10px;background:var(--surface);color:var(--ink);text-align:right}
.rc-inwrap input:focus{outline:none;border-color:var(--accent)}
.rc-inwrap .rc-unit{position:absolute;right:.7em;font-size:.85rem;color:var(--ink-soft);pointer-events:none}
.rc-derived{font-size:.95rem;color:var(--ink-soft)}
.rc-derived b{font-family:var(--font-num,var(--font-body));color:var(--ink);font-weight:700;font-variant-numeric:tabular-nums}
.rc-range{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:999px;background:var(--accent-soft);outline:none;margin:6px 0}
.rc-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;background:var(--accent);border:3px solid var(--surface);box-shadow:var(--shadow-sm);cursor:pointer}
.rc-range::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--accent);border:3px solid var(--surface);box-shadow:var(--shadow-sm);cursor:pointer}
.rc-scale{display:flex;justify-content:space-between;font-size:.75rem;color:var(--ink-soft)}
/* Results */
.results{padding:50px 0 90px}
.results-head{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;margin-bottom:28px}
.results-head h2{font-size:2rem}
.results-actions{display:flex;gap:10px}
#kpiSections{column-count:2;column-gap:20px;margin-bottom:6px}
.kpi-group{break-inside:avoid;display:inline-block;width:100%;margin:0 0 20px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px;box-shadow:var(--shadow-sm)}
.kpi-rows{display:flex;flex-direction:column}
.kpi-row:last-child{border-bottom:none;padding-bottom:0}
.kpi-row-label{font-size:.9rem;color:var(--ink-soft);line-height:1.45}
.kpi-row-val{font-family:var(--font-body);font-size:1.2rem;font-weight:600;white-space:nowrap}
.kpi-row.pos .kpi-row-val{color:var(--green)}
.kpi-row.neg .kpi-row-val{color:var(--red)}
.kpi-row.neg-muted .kpi-row-val{color:var(--ink-soft)}   /* Bestand: Verlust neutral (grau) statt alarmierend rot */
/* Bestand: eine Spalte → Reihenfolge Rendite → Finanzierung → Steuer greift 1:1 (Steuer zuletzt) */
#kpiSections.kpi-single{column-count:1}
/* ===== Objekt- & Finanzierungs-Übersicht (Eckdaten unter dem Fazit) ===== */
/* Zwei Karten */
.ovw-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:0 0 34px;align-items:start}
.ovw-card{background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);padding:22px 24px}
.ovw-card-head{display:flex;align-items:center;gap:11px;padding-bottom:15px;margin-bottom:6px;border-bottom:1px solid var(--line)}
.ovw-card-ic{width:34px;height:34px;flex:none;border-radius:10px;background:var(--accent-soft);color:var(--accent-dark);display:flex;align-items:center;justify-content:center}
.ovw-card-title{font-family:var(--font-head);font-size:1.15rem;font-weight:600;color:var(--ink);margin:0}
.ovw-rows{margin:0;padding:0}
.ovw-row{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--line)}
.ovw-rows .ovw-row:last-child{border-bottom:none}
.ovw-row dt{margin:0;font-size:.9rem;color:var(--ink-soft);line-height:1.4}
.ovw-row dd{margin:0;font-size:.95rem;font-weight:600;color:var(--ink);white-space:nowrap;text-align:right;font-variant-numeric:tabular-nums}
.ovw-row-plain{border-bottom:1px solid var(--line)}
.ovw-row-last{border-bottom:none;padding-bottom:0}
.ovw-per{font-size:.78rem;font-weight:500;color:var(--ink-soft)}
/* Summen-Bänder */
.ovw-band{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:10px;padding:12px 16px;background:var(--bg);border:1px solid var(--line);border-radius:11px}
.ovw-band>span{font-size:.9rem;font-weight:700;color:var(--ink)}
.ovw-band>b{font-family:var(--font-num);font-size:1.1rem;font-weight:700;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums}
.ovw-band-accent{background:var(--accent-soft);border-color:rgba(28,90,64,.32)}
.ovw-band-accent>span,.ovw-band-accent>b{color:var(--accent-dark)}
/* Flächen-Kacheln */
.ovw-areas{display:flex;gap:10px;margin-top:14px}
.ovw-area{flex:1;background:var(--bg);border:1px solid var(--line);border-radius:11px;padding:11px 14px}
.ovw-area-l{font-size:.78rem;color:var(--ink-soft)}
.ovw-area-v{font-family:var(--font-num);font-size:1.05rem;font-weight:700;color:var(--ink);margin-top:3px;font-variant-numeric:tabular-nums}
/* Untergruppen (Mieteinnahmen / Konditionen) */
.ovw-subhead{font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft);margin:18px 0 8px}
.ovw-extras{border-left:2px solid var(--line);margin-left:3px;padding-left:14px}
.ovw-extra{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 0}
.ovw-extra-l{display:flex;align-items:center;gap:9px;font-size:.9rem;color:var(--ink-soft)}
.ovw-extra-ic{width:24px;height:24px;flex:none;border-radius:7px;background:var(--accent-soft);color:var(--accent-dark);display:flex;align-items:center;justify-content:center}
.ovw-extra-v{font-size:.9rem;font-weight:600;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums}
/* Darlehen-Box mit Aufteilungs-Balken */
.ovw-loan{margin-top:14px;padding:16px 18px;background:var(--bg);border:1px solid var(--line);border-radius:13px}
.ovw-loan-top{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.ovw-loan-top>span{font-size:.9rem;font-weight:700;color:var(--ink)}
.ovw-loan-top>b{font-family:var(--font-num);font-size:1.25rem;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.ovw-bar{display:flex;height:11px;border-radius:99px;overflow:hidden;margin-top:13px;background:var(--line)}
.ovw-bar-a{background:var(--accent-dark)}
.ovw-bar-b{background:var(--accent)}
.ovw-legend{display:flex;gap:18px;margin-top:12px}
.ovw-leg{flex:1;min-width:0}
.ovw-dot{display:inline-block;width:9px;height:9px;border-radius:3px;vertical-align:middle;margin-right:7px}
.ovw-dot-a{background:var(--accent-dark)}
.ovw-dot-b{background:var(--accent)}
.ovw-leg-l{font-size:.82rem;color:var(--ink-soft)}
.ovw-leg-v{font-size:.92rem;font-weight:700;color:var(--ink);margin-top:4px;font-variant-numeric:tabular-nums}
.ovw-leg-pct{font-size:.78rem;font-weight:500;color:var(--ink-soft)}
/* Konditionen-Vergleich */
.ovw-cond{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.ovw-cond-1{grid-template-columns:1fr}
.ovw-cond-col{background:var(--surface);padding:13px 15px}
.ovw-cond-h{font-size:.78rem;font-weight:700;margin-bottom:8px}
.ovw-cond-h-a{color:var(--accent-dark)}
.ovw-cond-h-b{color:var(--ink-soft)}
.ovw-cond-r{display:flex;justify-content:space-between;gap:10px;margin-top:6px}
.ovw-cond-r span{font-size:.85rem;color:var(--ink-soft)}
.ovw-cond-r b{font-size:.9rem;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.ovw-cond-note{font-size:.74rem;color:var(--accent-dark);margin-top:7px;font-weight:600}
.ovw-note{font-size:.8rem;color:var(--ink-soft);margin-top:10px;line-height:1.4}
/* Monatliche Rate – Hervorhebung */
.ovw-rate{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:16px;padding:14px 18px;background:var(--accent-soft);border:1px solid rgba(28,90,64,.32);border-radius:13px}
.ovw-rate-l{font-size:.92rem;font-weight:700;color:var(--accent-dark)}
.ovw-rate-s{font-size:.78rem;color:var(--ink-soft);margin-top:2px}
.ovw-rate-v{font-family:var(--font-num);font-weight:700;font-size:1.5rem;color:var(--accent-dark);white-space:nowrap;font-variant-numeric:tabular-nums}
.ovw-rate-v .ovw-per{font-size:.8rem;color:var(--accent-dark);opacity:.8}
/* Zwei-Phasen-Rate (tilgungsfreie KfW-Jahre): niedrige Rate jetzt, höhere danach */
.ovw-rate-2{flex-direction:column;align-items:stretch;gap:0}
.ovw-rate-phase{display:flex;align-items:center;justify-content:space-between;gap:16px}
.ovw-rate-phase-next{margin-top:10px;padding-top:10px;border-top:1px solid rgba(28,90,64,.28)}
.ovw-rate-v-next{font-size:1.2rem;opacity:.9}
@media(max-width:680px){
  .ovw-grid{grid-template-columns:1fr;gap:16px}
  .ovw-card{padding:20px 18px}
}
.kpi-badge{display:inline-block;font-size:.64rem;font-weight:700;letter-spacing:.02em;text-transform:uppercase;padding:.2em .6em;border-radius:999px;margin-left:8px;vertical-align:middle}
.kpi-badge.pos{background:var(--green);color:#fff}
.kpi-badge.neg{background:var(--red);color:#fff}
.kpi-badge.neg-muted{background:var(--ink-soft);color:#fff}   /* Bestand: „Verlust"-Badge neutral (grau) */
/* Hinweis-Karten */
#resultHints{display:flex;flex-direction:column;gap:12px;margin-bottom:30px}
.hint-card{display:flex;gap:14px;align-items:flex-start;border-radius:14px;padding:16px 18px;border:1px solid var(--line)}
.hint-card .hint-icon{font-size:1.1rem;width:30px;height:30px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;font-weight:700}
.hint-card strong{display:block;margin-bottom:3px}
.hint-card p{font-size:.92rem;color:var(--ink-soft);line-height:1.55}
.hint-card.pos{background:var(--green-soft);border-color:#C2DCC6}
.hint-card.pos .hint-icon{background:var(--green);color:#fff}
.hint-card.neg{background:#FBE8E3;border-color:#eccabf}
.hint-card.neg .hint-icon{background:var(--red);color:#fff}
.hint-card.info{background:var(--hint-bg);border-color:var(--line)}
.hint-card.info .hint-icon{background:var(--gold);color:#fff}
.chart-card,.table-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow-sm);margin-bottom:24px}
.chart-card h3,.table-card h3{font-size:1.3rem;margin-bottom:18px}
.chart-head{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:18px}
.chart-head h3{margin:0}
.segmented{display:inline-flex;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:4px;gap:2px}
.segmented .seg{display:flex;flex-direction:column;align-items:center;border:none;background:none;font:inherit;font-weight:600;color:var(--ink-soft);padding:.45em 1.1em;border-radius:999px;cursor:pointer;transition:.15s;line-height:1.1}
.segmented .seg small{font-weight:500;font-size:.7rem;opacity:.8}
.segmented .seg.active{background:var(--accent);color:#fff}
/* ETF */
.etf-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow-sm);margin-bottom:24px}
.etf-head{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:14px;margin-bottom:6px}
.etf-head h3{font-size:1.3rem;margin:0}
.etf-rate{display:flex;flex-direction:column;gap:6px;font-size:.85rem;font-weight:600;color:var(--ink-soft)}
.etf-rate .input-suffix input{width:120px;padding:.5em .9em;border:1.5px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);font:inherit}
.etf-desc{color:var(--ink-soft);margin-bottom:18px;font-size:.95rem}
.etf-compare{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.etf-card .etf-card{padding:0}
.etf-compare .etf-card{background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:18px;box-shadow:none;margin:0}
.etf-year{font-weight:600;margin-bottom:10px}
.etf-line{display:flex;justify-content:space-between;gap:12px;padding:5px 0;color:var(--ink-soft);font-size:.95rem}
.etf-line b{color:var(--ink);white-space:nowrap}
.etf-diff{margin-top:10px;font-weight:600;font-size:.95rem}
.etf-diff.pos{color:var(--green)}
.etf-diff.neg{color:var(--red)}
.liability{background:var(--hint-bg);border:1px solid var(--line);border-radius:14px;padding:18px 20px;font-size:.85rem;color:var(--ink-soft);line-height:1.6}
.liability strong{color:var(--ink)}

/* Section titles */
.section-title{font-size:1.5rem;margin:38px 0 6px}
.section-intro{color:var(--ink-soft);margin-bottom:18px;font-size:.95rem}

/* Verdict-Hero */
.verdict-card{background:var(--verdict-bg);background:linear-gradient(150deg,var(--verdict-bg),color-mix(in srgb,var(--verdict-bg) 80%,#fff));color:var(--verdict-ink);border-radius:var(--radius);padding:30px 32px;box-shadow:var(--shadow);margin-bottom:10px}
.verdict-lead{font-size:1.15rem;line-height:1.5;margin-bottom:22px;color:var(--verdict-ink-soft)}
.verdict-lead strong{color:var(--verdict-ink)}
/* Fazit-Texte kommen aus der geteilten Quelle (calc.js) und nutzen <b> zur Hervorhebung. */
.verdict-card b{color:var(--verdict-ink);font-weight:600}
.verdict-nums{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:18px}
.vn{display:flex;flex-direction:column;gap:4px;border-left:2px solid var(--verdict-line);padding-left:16px}
.vn-val{font-family:var(--font-body);font-size:1.7rem;font-weight:600}
.vn-lbl{font-size:.82rem;color:var(--verdict-ink-soft)}
.verdict-note{margin-top:20px;padding-top:16px;border-top:1px solid var(--verdict-line);font-size:.9rem;line-height:1.55;color:var(--verdict-ink-soft)}
.verdict-note strong{color:var(--verdict-ink)}
.verdict-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:20px}
.verdict-head-lbl{font-size:.9rem;font-weight:600;color:var(--verdict-ink-soft)}
.verdict-card .segmented{background:rgba(255,255,255,.08);border-color:var(--verdict-line)}
.verdict-card .segmented .seg{color:var(--verdict-ink-soft)}
.verdict-card .segmented .seg.active{background:var(--verdict-ink);color:var(--verdict-bg)}
.verdict-cashflow{margin-top:18px;font-size:.95rem;line-height:1.55;color:var(--verdict-ink-soft)}
.verdict-cashflow strong{color:var(--verdict-ink)}

/* Investor overview */
.investor-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.investor-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;min-width:0}
.ic-label{font-weight:600;margin:4px 0 8px}
.ic-desc{font-size:.85rem;color:var(--ink-soft);line-height:1.5}
.tip.tip-warn{background:var(--gold);color:#fff;font-style:normal;font-size:.78rem}
.ic-val .tip-warn{vertical-align:middle;margin-left:4px}
.ic-val{font-family:var(--font-body);font-size:1.7rem;font-weight:600;color:var(--accent-dark);font-variant-numeric:tabular-nums lining-nums}

/* ── Ergebnis-Phase-1: Verdict-Banner, Bewertungs-Skalen, Chart-Tooltip ── */
.verdict-banner{display:flex;align-items:flex-start;gap:13px;margin-bottom:20px;padding-bottom:18px;border-bottom:1px solid var(--verdict-line)}
.verdict-banner .vb-icon{flex:none;width:42px;height:42px;border-radius:13px;display:flex;align-items:center;justify-content:center;font-size:1.35rem;font-weight:800;line-height:1;margin-top:2px}
.verdict-banner .vb-icon svg{width:23px;height:23px}
.verdict-banner .vb-txt{display:flex;flex-direction:column;gap:4px}
.verdict-banner .vb-title{font-family:var(--font-head);font-weight:700;font-size:1.3rem;color:var(--verdict-ink);line-height:1.2}
.verdict-banner .vb-sub{font-size:.92rem;font-weight:400;color:var(--verdict-ink-soft);line-height:1.5}
.ic-cap{display:flex;flex-direction:column;gap:3px;margin-top:8px;font-size:.74rem;color:var(--ink-soft);line-height:1.35}
.ic-rate{font-weight:800;text-transform:uppercase;letter-spacing:.04em;font-size:.74rem}
.investor-card.r-pos .ic-rate{color:var(--green)}
.investor-card.r-ok .ic-rate{color:var(--accent-dark)}
.investor-card.r-warn .ic-rate{color:var(--red)}
.verdict-banner.v-pos .vb-icon{background:rgba(62,142,90,.24);color:#88D6A6}
.verdict-banner.v-ok .vb-icon{background:rgba(28,90,64,.24);color:#F2C075}
.verdict-banner.v-low .vb-icon{background:rgba(216,140,70,.26);color:#EDA25A}
.verdict-banner.v-warn .vb-icon{background:rgba(201,84,60,.28);color:#E98368}
.ic-scale{margin:12px 0}
.ic-track{position:relative;height:7px;border-radius:999px;background:var(--bg)}
.ic-fill{position:absolute;left:0;top:0;bottom:0;border-radius:999px;background:var(--accent)}
.ic-tick{position:absolute;top:-3px;width:2px;height:13px;background:var(--ink-soft);opacity:.4;border-radius:1px}
.investor-card.r-pos .ic-fill{background:var(--green)}
.investor-card.r-ok .ic-fill{background:var(--gold)}
.investor-card.r-warn .ic-fill{background:var(--red)}
.investor-card.r-pos .ic-val{color:var(--green)}
.investor-card.r-warn .ic-val{color:var(--red)}
.chart-card,.cashflow-card{position:relative}
.chart-cross{stroke:var(--ink-soft);stroke-width:1;stroke-dasharray:3 3;opacity:.55;pointer-events:none}
.chart-dot{fill:var(--accent);stroke:var(--surface);stroke-width:2;pointer-events:none}
.chart-tip{position:absolute;z-index:6;pointer-events:none;background:var(--surface);border:1px solid var(--line);border-radius:11px;box-shadow:var(--shadow);padding:9px 11px;font-size:.8rem;min-width:132px}
.chart-tip .ct-year{font-weight:700;color:var(--ink);margin-bottom:5px}
.chart-tip .ct-row{display:flex;align-items:center;gap:8px;color:var(--ink-soft);line-height:1.55}
.chart-tip .ct-row b{margin-left:auto;color:var(--ink);font-variant-numeric:tabular-nums lining-nums}
.chart-tip .ct-dot{width:9px;height:9px;border-radius:3px;flex:none}

/* ── Simulation Bauphase ── */
#bauphaseChart svg{width:100%;height:auto;display:block}
.bp-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:24px;align-items:start;margin-bottom:24px}
.bp-table-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:6px 22px;box-shadow:var(--shadow-sm);min-width:0;overflow-x:auto}
.bp-table{width:100%;border-collapse:collapse;font-size:.92rem}
.bp-table th{text-align:left;font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft);padding:16px 8px 11px;border-bottom:1px solid var(--line)}
.bp-table td{padding:14px 8px;border-bottom:1px solid var(--line);color:var(--ink)}
.bp-table tbody tr:last-child td{border-bottom:none}
.bp-table .bp-num{text-align:right;font-family:var(--font-num);font-variant-numeric:tabular-nums lining-nums;white-space:nowrap}
.bp-table th.bp-num{text-align:right}
.bp-pct{color:var(--accent-dark);font-weight:600}
.bp-table tr.bp-ek td{color:var(--ink-soft)}
.bp-costs{display:flex;flex-direction:column;min-width:0}
.bp-costs-title{font-size:.74rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--accent-dark);margin:2px 0 12px;font-family:var(--font-body)}
.bp-cost-row{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding:9px 2px;font-size:.95rem;color:var(--ink-soft)}
.bp-cost-row b{font-family:var(--font-num);font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums lining-nums;white-space:nowrap}
.bp-cost-sub{border-top:1px solid var(--line);margin-top:2px;padding-top:11px}
.bp-cost-vor{border-top:1px solid var(--line);margin-top:2px;padding-top:11px}
.bp-cost-vor>span{font-weight:700;color:var(--ink)}
.bp-cost-vor b{font-weight:700;color:var(--ink)}
.bp-vor{font-weight:400;color:var(--ink-soft)}
.bp-cost-tax{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:12px;padding:11px 16px;background:var(--green-soft);border-radius:11px;font-size:.95rem}
.bp-cost-tax>span{font-weight:700;color:#34603C}
.bp-cost-tax>span::before{content:"→";margin-right:8px}
.bp-cost-tax b{font-family:var(--font-num);font-weight:700;color:#34603C;font-variant-numeric:tabular-nums lining-nums;white-space:nowrap}
.bp-cost-final{margin-top:12px;padding:16px 18px;background:var(--accent-soft);border:1px solid rgba(28,90,64,.32);border-radius:13px}
.bp-cost-final-h{display:flex;align-items:center;gap:6px;font-size:.74rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--accent-dark)}
.bp-cost-final-v{font-family:var(--font-num);font-size:2rem;font-weight:700;color:var(--accent-dark);font-variant-numeric:tabular-nums lining-nums;margin:5px 0 8px}
.bp-cost-final-note{margin:0;font-size:.86rem;line-height:1.55;color:var(--ink-soft)}
.bp-cost-final-note b{color:var(--ink);font-variant-numeric:tabular-nums lining-nums}
.bp-cost-note{margin:12px 0 0;font-size:.86rem;line-height:1.55;color:var(--ink-soft)}
.bp-cost-note b{color:var(--ink);font-variant-numeric:tabular-nums lining-nums}
@media(max-width:720px){.bp-grid{grid-template-columns:1fr}}
/* Mobile: ETF-Jahreskarten stapeln; Segmented-Controls (Szenario/Verkauf) auf Breite verteilen statt überlaufen */
@media(max-width:560px){
  .etf-compare{grid-template-columns:1fr}
  .segmented{display:flex;width:100%}
  .segmented .seg{flex:1 1 0;min-width:0;padding-left:.4em;padding-right:.4em}
  /* Tooltip-Blase im Ruhezustand aus dem Layout nehmen, sonst erzeugt sie am rechten Rand
     eine 42px-Querscroll-Geisterspur (opacity:0 belegt weiterhin Platz). Beim Antippen sichtbar. */
  .tip::after{display:none}
  .tip:hover::after,.tip:focus::after{display:block}
}

/* ── Ergebnis-Phase-2: Legende-Toggle, Verdict-Fade, Sticky-Leiste ── */
.chart-legend .cl-item{display:inline-flex;align-items:center;background:none;border:none;font:inherit;color:var(--ink-soft);cursor:pointer;padding:3px 7px;border-radius:7px;transition:.12s}
.chart-legend .cl-item:hover{color:var(--ink);background:var(--bg)}
.chart-legend .cl-item.off{opacity:.45;text-decoration:line-through}
/* Fazit-/Kennzahl-Karten bewusst OHNE Erscheinen-Effekt beim Szenario-/Horizont-Wechsel –
   sie bleiben stehen und aktualisieren nur ihren Inhalt. */
/* ── Ergebnis-Phase-3: Gruppen-Icons, Zeilen-Hover, Detail-Fade, Reveal ── */
.kpi-group-title{font-size:1.02rem;color:var(--ink);font-weight:600;margin-bottom:6px;padding-bottom:10px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:9px}
.kpi-group-ic{flex:none;width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;background:var(--accent-soft);color:var(--accent-dark)}
.kpi-group-ic svg{width:18px;height:18px}
.kpi-row{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:10px 0;border-bottom:1px solid var(--line);border-radius:8px;transition:background .12s;padding-left:8px;padding-right:8px;margin-left:-8px;margin-right:-8px}
.kpi-row:hover{background:var(--bg)}
#yearTable td{font-variant-numeric:tabular-nums lining-nums}
.details-card[open] > *:not(summary){animation:detailIn .3s ease-out}
@keyframes detailIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.reveal{opacity:0;transform:translateY(16px);transition:opacity .6s cubic-bezier(.2,.7,.2,1),transform .6s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.details-card[open] > *:not(summary){animation:none}}

/* Tooltip */
.tip{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background:var(--line);color:var(--ink-soft);font-size:.7rem;font-weight:700;font-style:italic;cursor:help;position:relative;vertical-align:middle}
.tip::after{content:attr(data-tip);position:absolute;bottom:130%;left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;font-size:.78rem;font-weight:400;font-style:normal;text-transform:none;letter-spacing:normal;line-height:1.45;width:240px;max-width:60vw;padding:10px 12px;border-radius:10px;opacity:0;pointer-events:none;transition:.15s;z-index:30;box-shadow:var(--shadow)}
.tip:hover::after,.tip:focus::after{opacity:1}

/* Cashflow breakdown */
.cashflow-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow-sm);margin-bottom:24px}
.cf-head{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:18px}
.cf-intro{color:var(--ink-soft);font-size:.95rem;max-width:520px}
.cf-buffer-chart{margin-top:14px}
.cf-buffer-chart svg{width:100%;height:auto;display:block}
.cf-buffer-legend{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:12px;font-size:.82rem;color:var(--ink-soft)}
.cf-buffer-legend .dot{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:6px;vertical-align:middle}
.cf-buffer-legend .vmark{display:inline-block;width:3px;height:13px;margin-right:6px;vertical-align:-2px;border-radius:1px}
.cf-buffer-explain{margin-top:14px;font-size:.92rem;line-height:1.6;color:var(--ink-soft)}
.cf-buffer-explain strong{color:var(--ink)}
.cf-year select{font:inherit;padding:.4em .7em;border:1.5px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink)}
.cf-row{display:flex;align-items:center;gap:14px;margin-top:8px}
.cf-rowlabel{width:120px;flex-shrink:0;font-size:.9rem;color:var(--ink-soft);display:flex;flex-direction:column}
.cf-rowlabel b{color:var(--ink);font-size:1.05rem}
.cf-bar{flex:1;display:flex;height:30px;border-radius:8px;overflow:hidden;background:var(--bg)}
.cf-seg{height:100%}
.cf-legend{display:flex;flex-wrap:wrap;gap:6px 18px;margin:6px 0 4px 134px;font-size:.82rem;color:var(--ink-soft)}
.cf-legend .dot{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:middle}
.cf-net{margin-top:16px;padding:12px 16px;border-radius:12px;font-size:1.05rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px}
.cf-net.pos{background:var(--green-soft);color:#34603C}
.cf-net.neg{background:#FBE8E3;color:var(--red)}
.cf-net-monthly{font-size:.9rem;opacity:.8;white-space:nowrap}
.cf-note{font-size:.83rem;color:var(--ink-soft);margin-top:12px}

/* Details (collapsible) */
.details-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);margin-bottom:24px;padding:0}
.details-card summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:22px 28px;font-family:var(--font-head);font-size:1.3rem;font-weight:600}
.details-card summary::-webkit-details-marker{display:none}
.details-card .chev{transition:.2s;color:var(--ink-soft)}
.details-card[open] .chev{transform:rotate(180deg)}
.details-card .table-scroll{padding:0 28px 24px}
.details-card.table-card h3{display:none}
.annahmen-intro{padding:0 28px;color:var(--ink-soft);margin:-6px 0 14px}
#annahmenForm{padding:0 28px}
#btnRecalc{margin:4px 28px 26px}
.annahmen-group{margin-bottom:18px}
.annahmen-group h4{font-size:1rem;color:var(--ink-soft);margin-bottom:10px;padding-bottom:5px;border-bottom:1px solid var(--line)}
.annahmen-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.afield{display:flex;flex-direction:column;gap:5px;font-size:.88rem}
.afield>span{font-weight:600}
.afield input,.afield select{font:inherit;padding:.55em .7em;border:1.5px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);width:100%}
.afield.acheck{flex-direction:row;align-items:center;gap:8px}
/* Feld mit Einheiten-Umschalter: Eingabe links, zwei Segmente rechts (gesamt / je m²). */
.ufl{display:flex;align-items:center;gap:8px}
.ufl .input-suffix{flex:1 1 auto;min-width:0}
.ufl-seg-wrap{display:inline-flex;flex:none;border:1.5px solid var(--line);border-radius:10px;overflow:hidden;background:var(--bg)}
.ufl-seg{font:inherit;font-size:.78rem;font-weight:600;padding:.5em .7em;border:0;background:none;color:var(--ink-soft);cursor:pointer;white-space:nowrap}
.ufl-seg+.ufl-seg{border-left:1.5px solid var(--line)}
.ufl-seg:hover:not(:disabled){color:var(--ink)}
.ufl-seg.on{background:var(--accent);color:#fff}
.ufl-seg:disabled{opacity:.4;cursor:not-allowed}
.afield.acheck input{width:18px;height:18px;accent-color:var(--accent)}

@media(max-width:760px){
  .investor-grid{grid-template-columns:1fr 1fr}
  .verdict-nums{grid-template-columns:1fr}
  .annahmen-grid{grid-template-columns:1fr 1fr}
  .cf-rowlabel{width:90px}
  .cf-legend{margin-left:104px}
}
#chart svg{width:100%;height:auto;display:block}
.chart-legend{display:flex;gap:22px;flex-wrap:wrap;margin-top:14px;font-size:.9rem;color:var(--ink-soft)}
.chart-legend .dot{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:6px;vertical-align:middle}
.table-scroll{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:.85rem;white-space:nowrap}
th,td{padding:9px 12px;text-align:right;border-bottom:1px solid var(--line)}
th:first-child,td:first-child{text-align:left;position:sticky;left:0;background:var(--surface)}
thead th{font-weight:600;color:var(--ink-soft);border-bottom:2px solid var(--line)}
tbody tr:hover td{background:var(--bg)}
/* Jahresentwicklung: auf dem Desktop passen alle 11 Spalten ohne seitliches Scrollen in die Breite –
   Kopfzeilen dürfen umbrechen (sonst erzwingen lange Labels breite Spalten), Zahlen bleiben einzeilig
   (keine Kürzung). Auf Tablet/Handy ist die Tabelle bewusst breiter als der Schirm und scrollt
   (overflow-x) statt unleserlich klein zu schrumpfen. */
#yearTable{width:100%;font-size:.8rem}
#yearTable th,#yearTable td{padding:8px 6px}
#yearTable thead th{white-space:normal;overflow-wrap:break-word;hyphens:auto;line-height:1.2;vertical-align:bottom}
.disclaimer{font-size:.82rem;color:var(--ink-soft);margin-top:8px}

/* Footer */
.site-footer{border-top:1px solid var(--line);padding:24px 0;background:var(--surface)}
.site-footer .wrap{display:flex;justify-content:space-between;color:var(--ink-soft);font-size:.9rem}
.footer-links{display:flex;gap:18px}

@media(max-width:760px){
  .features,.plans,.gate-wrap,.field-grid{grid-template-columns:1fr}
  #kpiSections{column-count:1}
  .wiz-body{padding:26px}
  .hero{padding:48px 20px 30px}
  .nav{height:56px}
  .brand{font-size:1rem}
  .nav-link{font-size:.85rem}
  .results-head h2{font-size:1.6rem}
}

/* Print */
@media print{
  body{background:#fff}
  .site-header,.site-footer,.results-actions,.disclaimer,#btnRestart{display:none!important}
  .chart-card,.table-card,.kpi{box-shadow:none;break-inside:avoid}
}

/* ===== Geteilte Backend-Komponenten (dedup aus partner.php/admin.php, 06/2026) ===== */
.view-tabs{display:flex;gap:0;border-bottom:1px solid var(--line);margin-bottom:22px;width:100%}
.view-tab{position:relative;border:none;background:none;font:inherit;font-weight:600;font-size:.95rem;color:var(--ink-soft);padding:.6em .2em;margin-right:24px;cursor:pointer;white-space:nowrap;transition:color .15s}
.view-tab:last-child{margin-right:0}
.view-tab:hover{color:var(--ink)}
.view-tab.active{color:var(--ink)}
.view-tab.active::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2.5px;background:var(--accent);border-radius:3px 3px 0 0}
.view-tab:focus-visible{outline:2px solid var(--accent-dark);outline-offset:2px;border-radius:6px}
.page-head-main{min-width:0;flex:1 1 320px}
.page-title{font-family:var(--font-head);font-size:clamp(1.45rem,2vw,1.8rem);font-weight:700;line-height:1.12;color:var(--ink);margin:0}
.page-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;flex:0 0 auto}
.lead-table-wrap{overflow-x:auto;margin-top:18px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm)}
.lead-table{width:100%;border-collapse:collapse;font-size:.86rem}
.lead-table th,.lead-table td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
.lead-table .num{text-align:right;font-variant-numeric:tabular-nums}
.muted{color:var(--ink-soft);font-size:.85rem}
.src-pill{font-size:.7rem;font-weight:700;padding:.15em .55em;border-radius:999px;background:var(--accent-soft);color:var(--accent-dark)}
.an-controls{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin:4px 0 22px}
.an-controls select{font:inherit;padding:.45em .7em;border:1.5px solid var(--line);border-radius:8px;background:var(--bg)}
.an-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin-bottom:24px}
.an-kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:16px 18px}
.an-kpi .l{font-size:.8rem;color:var(--ink-soft);margin-top:4px}
.an-kpi .s{font-size:.72rem;color:var(--ink-soft);margin-top:2px;opacity:.85}
.an-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:18px 20px;margin-bottom:22px}
.an-card h2{font-size:1.05rem;margin:0 0 14px}
.an-grid2{display:grid;grid-template-columns:2fr 1fr;gap:22px}
.an-line{width:100%;height:auto;display:block}
.an-line text{font-size:10px;fill:var(--ink-soft)}
.an-funnel-row{display:grid;grid-template-columns:170px 1fr 96px;align-items:center;gap:12px;margin:7px 0;font-size:.85rem}
.an-bar-track{background:var(--bg);border-radius:6px;height:22px;overflow:hidden;border:1px solid var(--line)}
.an-bar-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-dark));border-radius:6px 0 0 6px}
.an-funnel-row .cnt{text-align:right;font-variant-numeric:tabular-nums;color:var(--ink-soft)}
.an-funnel-row .cnt b{color:var(--ink)}
.an-dev{display:flex;flex-direction:column;gap:10px}
.an-dev-row{font-size:.85rem}
.an-dev-row .top{display:flex;justify-content:space-between;margin-bottom:3px}
.an-empty{color:var(--ink-soft);padding:20px 0}
.phase-badge{display:inline-block;font-size:.72rem;font-weight:700;padding:.18em .6em;border-radius:999px;background:var(--accent-soft);color:var(--accent-dark);white-space:nowrap}
.phase-badge[data-kind="won"]{background:var(--green-soft);color:var(--green)}
.phase-badge[data-kind="lost"]{background:#f7e3dc;color:var(--red)}
.crm-task.done .tt{text-decoration:line-through;color:var(--ink-soft)}
.crm-task .due{font-size:.76rem;color:var(--ink-soft);margin-left:auto}
.crm-task .due.overdue{color:var(--red);font-weight:700}

/* =========================================================================
   MOTION SYSTEM — global, einheitliche Mikro-Interaktionen & Animationen
   Tokens → Keyframes → Basis-Feedback → Utilities (.om-*) + Bindung an
   bestehende Komponenten → Modals/Drawer → reduced-motion.
   Farben ausschliesslich aus der Palette (var(--accent) / color-mix).
   Stabilitaetsregel: persistente Inhalte bekommen Entrance NUR per transform
   (nie opacity:0) -> bleiben sichtbar, selbst wenn eine Animation haengt.
   ========================================================================= */
:root{
  --dur-press:120ms; --dur-fast:160ms; --dur-base:220ms; --dur-enter:420ms; --dur-overlay:240ms; --dur-theme:600ms;
  --ease-out:cubic-bezier(.22,1,.36,1);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
  --ease-inout:cubic-bezier(.65,0,.35,1);
  --om-stagger:45ms;
  --om-lift-shadow:0 10px 24px rgba(42,37,32,.10);
  --om-accent-glow:color-mix(in srgb,var(--accent) 32%,transparent);
  --surface-row-hover:var(--bg);
}
/* ---- Keyframes ---- */
@keyframes om-rise{from{transform:translateY(12px)}to{transform:none}}
@keyframes om-scale-in{from{transform:translateY(9px)}to{transform:none}}
@keyframes om-pop{0%{transform:scale(.6)}60%{transform:scale(1.15)}100%{transform:scale(1)}}
@keyframes om-overlay-in{from{opacity:0}to{opacity:1}}
@keyframes om-modal-in{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
@keyframes om-drawer-right{from{transform:translateX(100%)}to{transform:none}}
@keyframes om-drawer-left{from{transform:translateX(-100%)}to{transform:none}}
@keyframes om-drawer-bottom{from{transform:translateY(100%)}to{transform:none}}

/* ---- Basis: jede klickbare Flaeche bekommt Press-Feedback ----
   Vereinheitlichte Transition (inkl. transform) nur fuer Button-/Klick-Familien,
   damit bestehende Hover-Effekte (Farbe/Border/Shadow) erhalten bleiben. */
button,[role="button"],.lead-iconbtn,.lead-addbtn,.link-btn,.btn-icon{
  transition:background-color var(--dur-fast) var(--ease-out),
             color var(--dur-fast) var(--ease-out),
             border-color var(--dur-fast) var(--ease-out),
             box-shadow var(--dur-base) var(--ease-out),
             transform var(--dur-press) var(--ease-spring);
}
button:not(:disabled):active,[role="button"]:not([aria-disabled="true"]):active,
.lead-iconbtn:active,.lead-addbtn:active,.link-btn:active{transform:scale(.96)}
button:disabled{transform:none!important;cursor:not-allowed}

/* 1) BUTTONS — Primary-Lift existiert bereits (.btn-primary:hover); nur Press ergaenzen */
.btn-primary:active{transform:translateY(0) scale(.96)}
.btn-secondary:hover{box-shadow:0 4px 12px rgba(42,37,32,.06)}
.btn-icon:hover{transform:scale(1.06)} .btn-icon:active{transform:scale(.88)}

/* 2) CARDS — Lift fuer statische Karten (Kanban-.crm-card hat bereits eigenen Lift) */
.pk-card,.an-kpi,.dash-kpi{transition:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out)}
.pk-card:hover,.an-kpi:hover,.dash-kpi:hover{transform:translateY(-3px);box-shadow:var(--om-lift-shadow)}

/* 3) FILTER-CHIPS / SEGMENTE — Press + leichter Lift (Hover-Border existiert) */
.qpill:hover{transform:translateY(-1px)}
.qpill:active,.src-pill:active{transform:scale(.93)}

/* 4) INPUTS — weichen Fokus-Ring ergaenzen (Akzent-Border existiert bereits) */
.field input:focus,.field select:focus,.field textarea:focus{box-shadow:0 0 0 3px var(--om-accent-glow)}

/* ---- ENTRANCE: gestaffelte Listen/Grids (transform-only, immer sichtbar) ----
   .om-enter an den Container; Kinder steigen versetzt auf (Stagger per nth-child,
   kein Inline-Index noetig). Ueber den Index hinaus ohne Verzoegerung. */
.om-enter>*{animation:om-rise var(--dur-enter) var(--ease-out) both}
.om-enter>*:nth-child(1){animation-delay:calc(var(--om-stagger)*0)}
.om-enter>*:nth-child(2){animation-delay:calc(var(--om-stagger)*1)}
.om-enter>*:nth-child(3){animation-delay:calc(var(--om-stagger)*2)}
.om-enter>*:nth-child(4){animation-delay:calc(var(--om-stagger)*3)}
.om-enter>*:nth-child(5){animation-delay:calc(var(--om-stagger)*4)}
.om-enter>*:nth-child(6){animation-delay:calc(var(--om-stagger)*5)}
.om-enter>*:nth-child(7){animation-delay:calc(var(--om-stagger)*6)}
.om-enter>*:nth-child(8){animation-delay:calc(var(--om-stagger)*7)}
.om-enter>*:nth-child(n+9){animation-delay:calc(var(--om-stagger)*8)}
/* Ansichts-/Panelwechsel */
.om-view-enter{animation:om-scale-in var(--dur-enter) var(--ease-out) both}

/* =========================================================================
   MODALS · DIALOGE · DRAWER — Ein-Animation an bestehende Klassen gebunden.
   .hidden{display:none} -> Animation startet beim Einblenden automatisch.
   ========================================================================= */
.modal:not(.hidden){animation:om-overlay-in var(--dur-overlay) var(--ease-out)}
.modal:not(.hidden) .modal-card{animation:om-modal-in var(--dur-overlay) var(--ease-out);transform-origin:center}
/* Schliess-Animation: modalClose() setzt .is-closing, blendet nach ~260ms aus (crm-core.js) */
.modal.is-closing{animation:om-overlay-in var(--dur-overlay) var(--ease-out) reverse forwards}
.modal.is-closing .modal-card{animation:om-modal-in var(--dur-overlay) var(--ease-out) reverse forwards}

/* =========================================================================
   REDUCED MOTION — Barrierefreiheit: alle Bewegungen praktisch aus
   ========================================================================= */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms!important;animation-delay:0ms!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important;
  }
}

/* =========================================================================
   DARK MODE — Header-Toggle (Sonne/Mond) + warme „Goldene Stunde"-Dunkelpalette.
   Aktiv nur bei <html data-theme="dark"> (vom Header-Toggle gesetzt, vor dem Paint).
   Prinzip: zentrale Paletten-Variablen umdefinieren (die meisten Komponenten nutzen
   var(--bg/--surface/--ink/--line) und kippen automatisch) + gezielte Overrides der
   wenigen hartkodierten Hellflächen. Keine neuen Markenfarben — Honig bleibt der Akzent.
   ========================================================================= */
/* Toggle-Button */
.p-topbar-actions{display:inline-flex;align-items:center;gap:10px}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;border:1.5px solid var(--line);background:var(--surface);color:var(--ink-soft);cursor:pointer;padding:0;flex:none;
  transition:color var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out),box-shadow var(--dur-base) var(--ease-out),transform var(--dur-press) var(--ease-spring)}
.theme-toggle:hover{color:var(--accent-dark);border-color:var(--accent);box-shadow:var(--shadow-sm)}
.theme-toggle:active{transform:scale(.9)}
.theme-toggle:focus-visible{outline:2px solid var(--accent-dark);outline-offset:2px}
.theme-toggle svg{display:block}
.theme-toggle .ic-sun{display:none}                       /* Hell: Mond zeigt „zu Dark wechseln" */
[data-theme="dark"] .theme-toggle .ic-moon{display:none}  /* Dunkel: Sonne zeigt „zu Bright wechseln" */
[data-theme="dark"] .theme-toggle .ic-sun{display:block}
/* Partner-Logo im Dark Mode: schwarz/weiss + invertiert (dunkle Logos werden auf Dunkel sichtbar) */
[data-theme="dark"] .brand-partner-logo{filter:grayscale(1) invert(1) brightness(1.1) contrast(.95)}

/* Sanfter Cross-Fade beim Theme-Wechsel — nur waehrend des Umschaltens aktiv (JS setzt
   .theme-anim kurz auf <html>), danach entfernt. So keine dauerhafte Transition auf allem.
   prefers-reduced-motion (oben) reduziert die Dauer ohnehin auf ~0. */
html.theme-anim, html.theme-anim *, html.theme-anim *::before, html.theme-anim *::after{
  transition:background-color var(--dur-theme) var(--ease-out),
             color var(--dur-theme) var(--ease-out),
             border-color var(--dur-theme) var(--ease-out),
             fill var(--dur-theme) var(--ease-out),
             stroke var(--dur-theme) var(--ease-out),
             filter var(--dur-theme) var(--ease-out) !important;
}

/* Dunkelpalette — ImmoBricks, exakt aus der Dashboard-Mockup-Vorlage entnommen:
   neutrales Anthrazit mit Grün-Hauch (NICHT satt-grün), Bronze als Zweitakzent. */
[data-theme="dark"]{
  --bg:#121513;            /* Canvas – neutrales Dunkel mit Grün-Hauch (Vorlage) */
  --surface:#1E2220;       /* Karten/Panels (Vorlage) */
  --surface-2:#191D1B;     /* ruhige Zweitfläche */
  --anl-stack-1:#171B18;   /* Wohnanlage-Stapel: 1. Ebene dahinter */
  --anl-stack-2:#0C0F0D;   /* Wohnanlage-Stapel: 2. Ebene, dunkler */
  --canvas:#121513;
  --ink:#ECEEED;           /* helles, kühles Weiß (Vorlage) */
  --ink-soft:#9FB0A6;      /* gedämpfter Slate-Grün (Vorlage) */
  --ink-faint:#78877E;     /* blasseste Stufe (Zeitstempel, Hilfstexte) */
  --line:#292E2B;          /* Rahmen/Trenner (Vorlage) */
  --field-line:#353A37;    /* stärkerer Rahmen (Vorlage) */
  --accent:#2A7A57;        /* Grün-Button (weißer Text) */
  --accent-dark:#5AAE86;   /* helles Grün: Link-/Hover-Text + positive Werte (Vorlage) */
  --accent-soft:#17281E;   /* dunkelgrünes Soft (Badge-/Chip-Hintergrund) */
  --accent-ink:#FFFFFF;    /* Text auf Grün-Buttons bleibt weiß */
  --hint-bg:#191D1B;       /* Hinweis-Boxen: ruhiges Dunkel */
  --gold:#CBA76A;          /* Bronze (Vorlage, unverändert) */
  --green:#5AAE86;         /* positive Werte / Success (Vorlage) */
  --green-soft:#17281E;
  --red:#E88A72;           /* Danger, für Dunkel aufgehellt */
  --verdict-bg:#0E100F;    /* Fazit: tiefstes Dunkel */
  --verdict-ink-soft:#9FB0A6;
  --verdict-line:rgba(255,255,255,.12);
  --shadow-overlay:0 12px 32px -6px rgba(0,0,0,.55);
  --shadow-modal:0 24px 56px -12px rgba(0,0,0,.6);
  --shadow-raised:0 1px 2px rgba(0,0,0,.4);
  --shadow:var(--shadow-overlay);
  --shadow-sm:var(--shadow-raised);
  --om-lift-shadow:0 10px 26px rgba(0,0,0,.5);
  --surface-row-hover:#292E2B;
  color-scheme:dark;
}
/* Gezielte Overrides der hartkodierten Hellflaechen (Partner-Tool) */
[data-theme="dark"] .dash-hot{background:rgba(42,122,87,.20);color:var(--accent-dark)}
[data-theme="dark"] .dash-bar,[data-theme="dark"] .dash-pill-n{background:var(--line)}
[data-theme="dark"] .seg{background:#16241D}
[data-theme="dark"] .task-chip.over,[data-theme="dark"] .task-row .tbadge.over,
[data-theme="dark"] .sub-badge.expired,[data-theme="dark"] .phase-badge[data-kind="lost"]{background:rgba(226,145,111,.20);color:var(--red)}
[data-theme="dark"] .crm-card .chip.warn{background:rgba(213,178,122,.16);border-color:rgba(213,178,122,.42);color:var(--gold)}
[data-theme="dark"] .nav-profile:hover{background:var(--line)!important}
/* Einstellungen-Seitennav: aktiver Eintrag braucht im Dark Mode hellen Text (sonst dunkel auf dunkel) */
[data-theme="dark"] .acc-nav-item.active{color:var(--accent-dark);border-color:var(--accent)}
/* Quick-Filter-Pillen (Kunden/Vorgänge/Leads): aktive Pille hat im Dark Mode dunkles --accent-ink auf
   dunklem --accent-soft → unlesbar. Hellen Honig-Text erzwingen (Label + Zähler einheitlich). */
[data-theme="dark"] .qpill.active{color:var(--accent-dark)}
/* „i"-Tooltip: Basis nutzt background:var(--ink);color:#fff. Im Dark Mode ist --ink hell → weiß-auf-hell
   unlesbar. Textfarbe auf --bg (dunkel) drehen → dunkler Text auf heller Sprechblase. „i"-Badge mit Akzent. */
[data-theme="dark"] .tip::after{color:var(--bg)}
[data-theme="dark"] .tip{background:var(--line);color:var(--accent-dark)}
/* Miet-Aufschlüsselung: Summenzeile nutzt helles --hint-bg → im Dark Mode honig-getönte dunkle Fläche. */
[data-theme="dark"] .ms-total{background:rgba(90,185,131,.12);border-color:rgba(90,185,131,.30)}
/* Error-/Negativ-Flaechen (Auswertung/Eval-Komponenten) */
[data-theme="dark"] .afa-check.neg,[data-theme="dark"] .rate-info.neg,
[data-theme="dark"] .hint-card.neg,[data-theme="dark"] .cf-net.neg{background:rgba(226,145,111,.15);border-color:rgba(226,145,111,.4);color:var(--red)}
/* Positiv-/Grünflächen: hartkodiertes #34603C auf dunklem --green-soft → dunkel-auf-dunkel (z. B. der
   jährliche Cashflow-Überschuss). Heller Grünton var(--green) auf transluzentem Grün. */
[data-theme="dark"] .afa-check.pos,[data-theme="dark"] .rate-info.pos,
[data-theme="dark"] .hint-card.pos,[data-theme="dark"] .cf-net.pos{background:rgba(95,181,127,.15);border-color:rgba(95,181,127,.4);color:var(--green)}
[data-theme="dark"] .field input.invalid{background:rgba(226,145,111,.13)}
/* Bauphase: grüne Steuervorteil-Band im Dark Mode (heller Grünton statt #34603C auf dunklem Grün) */
[data-theme="dark"] .bp-cost-tax{background:rgba(95,181,127,.16)}
[data-theme="dark"] .bp-cost-tax>span,[data-theme="dark"] .bp-cost-tax b{color:var(--green)}

/* ===================== Objekte (Katalog, Formular, Detail) ===================== */
.modal-card.obj-modal{max-width:760px}
.modal-card.mail-modal{max-width:680px}
/* Karten-Grid */
.obj-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;margin-top:16px}
.obj-card{display:flex;flex-direction:column;text-align:left;padding:0;background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden;cursor:pointer;box-shadow:var(--shadow-sm);transition:transform .14s ease,box-shadow .14s ease}
.obj-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(20,38,31,.14)}
.obj-card-media{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:16/10;background:var(--bg);overflow:hidden}
.obj-card-media img{width:100%;height:100%;object-fit:cover;display:block}
.obj-card-media-empty{color:var(--accent);background:linear-gradient(150deg,var(--accent-soft),var(--surface))}
/* Wohnanlage: "Stapel"-Optik (zwei versetzte, nach hinten dunkler werdende Karten) macht auf den ersten Blick
   klar, dass viele Einheiten dahinterstecken. Reiner box-shadow-Stack (keine ::before/::after-Ebenen) – vermeidet
   Compositing-Artefakte, die die Pseudo-Element+Transform-Variante bei manchen Renderern/Zoomstufen zeigte. */
.obj-card-anlage{overflow:visible;box-shadow:4px 4px 0 0 var(--anl-stack-1),8px 8px 0 0 var(--anl-stack-2),var(--shadow-sm)}
.obj-card-anlage:hover{box-shadow:4px 4px 0 0 var(--anl-stack-1),8px 8px 0 0 var(--anl-stack-2),0 14px 30px rgba(20,38,31,.14)}
.obj-card-anlage .obj-card-media{border-radius:16px 16px 0 0}
.obj-badge{position:absolute;top:10px;left:10px;font-size:.68rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:#fff;background:rgba(20,38,31,.72);padding:.24em .6em;border-radius:999px;backdrop-filter:blur(2px)}
/* Objekt-Status (nur maklerseitig): Im Gespräch / Reserviert / Verkauft */
.obj-status{display:inline-flex;align-items:center;font-size:.66rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:#fff;padding:.24em .62em;border-radius:999px;white-space:nowrap}
.obj-status.os-talk{background:#3F6B8A}
.obj-status.os-reserved{background:#B0894A}
.obj-status.os-sold{background:#2A7A57}
.obj-status-media{position:absolute;top:10px;right:10px;box-shadow:0 2px 8px rgba(0,0,0,.28)}
.obj-status-inline{margin-left:8px;vertical-align:middle}
.obj-ov-status{margin-top:16px}
.obj-status-seg{display:inline-flex;border:1.5px solid var(--line);border-radius:10px;overflow:hidden;margin-top:8px}
.obj-status-segbtn{font:inherit;font-weight:600;font-size:.88rem;padding:.5em 1.05em;border:none;border-right:1.5px solid var(--line);background:var(--surface);color:var(--ink-soft);cursor:pointer;transition:.14s}
.obj-status-segbtn:last-child{border-right:none}
.obj-status-segbtn:hover{background:var(--accent-soft)}
.obj-status-segbtn.on{background:var(--accent);color:#fff}
.obj-status-segbtn:focus-visible{outline:2px solid var(--accent-dark);outline-offset:-2px}
.obj-status-hint{font-size:.8rem;margin-top:8px;line-height:1.5}
.obj-res-list{display:flex;flex-direction:column;gap:8px}
.obj-res-opt{display:flex;align-items:flex-start;gap:11px;padding:11px 13px;border:1.5px solid var(--line);border-radius:12px;cursor:pointer;transition:.14s}
.obj-res-opt:hover{border-color:var(--accent)}
.obj-res-opt input{margin-top:3px;flex:none}
.obj-res-txt{display:flex;flex-direction:column;line-height:1.35;min-width:0}
.obj-res-sub{font-size:.8rem;color:var(--ink-soft)}
.obj-card-body{display:flex;flex-direction:column;gap:3px;padding:13px 15px 15px}
.obj-card-title{font-family:var(--font-head);font-size:1.08rem;font-weight:600;color:var(--ink);line-height:1.25}
.obj-card-addr{font-size:.85rem;color:var(--ink-soft)}
.obj-card-facts{font-family:var(--font-num);font-size:.9rem;font-weight:600;color:var(--accent-dark);font-variant-numeric:tabular-nums;margin-top:4px}
.obj-card-chips{font-size:.8rem;color:var(--ink-soft);margin-top:2px;letter-spacing:.02em}

/* ===== Wohnanlagen ===== */
.obj-badge-anlage{background:var(--gold)!important;color:var(--bronze-ink)!important;left:auto;right:10px}
.obj-status.os-free{background:var(--accent)}
/* WE-Pille: fixe dunkle Schrift auf Weiß (in beiden Themes lesbar – --ink kippt im Dark Mode auf hell). */
.obj-we-pill{position:absolute;bottom:10px;right:10px;background:#fff;color:#18211D;font-family:var(--font-num);font-weight:700;font-size:.78rem;padding:.3em .65em;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,.28);font-variant-numeric:tabular-nums}
.obj-anl-bar{display:flex;height:8px;border-radius:99px;overflow:hidden;background:var(--line);margin-top:11px}
.obj-anl-bar>span{height:100%}
.obj-anl-legend{display:flex;flex-wrap:wrap;gap:12px;margin-top:9px;font-size:.78rem;color:var(--ink-soft)}
.obj-anl-legend span{display:inline-flex;align-items:center;gap:6px}
.obj-anl-legend b{color:var(--ink);font-weight:700}
.obj-anl-dot{width:8px;height:8px;border-radius:99px;display:inline-block;flex:none}

/* ===== Objekt-Browser (visueller Picker-Dialog) ===== */
.opick-bar{position:sticky;top:-20px;z-index:3;background:var(--surface);margin:-20px -26px 14px;padding:18px 26px 12px;border-bottom:1px solid var(--line);display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.opick-search{flex:1 1 240px;position:relative;display:flex;align-items:center;min-width:0}
.opick-search>svg{position:absolute;left:12px;color:var(--ink-soft);pointer-events:none}
.opick-search input{width:100%;padding:.62em .8em .62em 38px;border:1.5px solid var(--field-line);border-radius:10px;background:var(--bg);font:inherit;color:var(--ink)}
.opick-search input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.opick-seg{display:inline-flex;background:var(--bg);border:1.5px solid var(--line);border-radius:10px;padding:3px;gap:2px}
.opick-seg button{border:none;background:none;font:inherit;font-weight:600;font-size:.84rem;color:var(--ink-soft);padding:.45em .8em;border-radius:7px;cursor:pointer;white-space:nowrap;transition:.14s}
.opick-seg button.on{background:var(--surface);color:var(--accent-dark);box-shadow:var(--shadow-sm)}
.opick-seg button:focus-visible{outline:2px solid var(--accent-dark);outline-offset:1px}
.opick-body{min-height:220px}
.opick-loading,.opick-empty{padding:44px 10px;text-align:center;color:var(--ink-soft)}
.opick-empty p{margin-bottom:14px}
.opick-group{margin-bottom:22px}
.opick-group:last-child{margin-bottom:2px}
.opick-ghead{display:flex;align-items:center;gap:8px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-soft);margin-bottom:10px}
.opick-count{background:var(--bg);border:1px solid var(--line);border-radius:99px;padding:.12em .62em;font-size:.72rem;font-variant-numeric:tabular-nums;letter-spacing:0;color:var(--ink-soft)}
.opick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.opick-card{display:flex;align-items:center;gap:11px;text-align:left;padding:9px 11px;background:var(--surface);border:1.5px solid var(--line);border-radius:12px;cursor:pointer;transition:border-color .13s,box-shadow .13s,transform .13s;width:100%}
.opick-card:hover{border-color:var(--accent);box-shadow:0 6px 16px rgba(20,38,31,.12);transform:translateY(-1px)}
.opick-card:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.opick-card.is-current{border-color:var(--gold);background:var(--surface-2)}
.opick-thumb{width:46px;height:46px;border-radius:9px;overflow:hidden;flex:none;background:var(--bg);display:flex;align-items:center;justify-content:center;color:var(--accent-dark)}
.opick-thumb img{width:100%;height:100%;object-fit:cover}
.opick-info{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1 1 0}
.opick-t{font-weight:600;color:var(--ink);font-size:.92rem;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.opick-sub{font-size:.78rem;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.opick-facts{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:.78rem;color:var(--accent-dark);font-weight:600;font-variant-numeric:tabular-nums;margin-top:1px}
.opick-cur{display:inline-block;font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--bronze-ink);background:var(--gold);border-radius:99px;padding:.12em .5em;vertical-align:middle}
.opick-st{font-size:.6rem!important;padding:.2em .5em!important}
/* Wohnanlage-Gruppe */
.opick-anl{background:var(--surface-2);border:1px solid var(--line);border-radius:14px;padding:14px}
.opick-anl-head{text-transform:none;letter-spacing:0;font-size:.9rem;color:var(--ink);margin-bottom:12px}
.opick-anl-thumb{width:34px;height:34px;border-radius:8px;overflow:hidden;flex:none;background:var(--bg);display:flex;align-items:center;justify-content:center;color:var(--accent-dark)}
.opick-anl-thumb img{width:100%;height:100%;object-fit:cover}
.opick-anl-title{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.opick-anl-title b{font-weight:700}
.opick-anl-title span{font-size:.78rem;color:var(--ink-soft);font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.opick-anl-badge{position:static!important;top:auto!important;left:auto!important;right:auto!important;font-size:.58rem;flex:none}
.opick-anl-head .opick-count{margin-left:auto}
/* Objekt-Matching im Picker (Konzept 26.07.2026): Treffer-Gruppe oben, Begründung an jeder Karte.
   Nur sichtbar, wenn der Picker aus einem Vorgang mit ausreichendem Suchprofil geöffnet wurde. */
.opick-mgroup{background:var(--accent-soft);border:1px solid var(--line);border-radius:14px;padding:14px}
.opick-mhead{text-transform:none;letter-spacing:0;font-size:.9rem;color:var(--accent-dark);font-weight:700}
.opick-mhead .opick-count{margin-left:auto;background:var(--surface)}
.opick-mseg button.on{background:var(--accent);color:var(--accent-ink)}
.opick-mlabel{font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  color:var(--accent-dark);background:var(--accent-soft);border-radius:99px;padding:.2em .55em;letter-spacing:.03em}
.opick-mlabel.top{color:var(--accent-ink);background:var(--accent)}
.opick-mchip{font-size:.68rem;font-weight:600;border-radius:99px;padding:.12em .5em;letter-spacing:0;
  background:var(--bg);color:var(--ink-soft);white-space:nowrap}
.opick-mchip.ok{background:var(--green-soft);color:var(--green)}
.opick-mchip.mid{background:rgba(214,158,46,.14);color:var(--accent-dark)}
.opick-mchip.no{background:var(--red-soft,rgba(194,72,58,.12));color:var(--red)}
.opick-mcount{font-size:.68rem;font-weight:700;letter-spacing:0;color:var(--accent-dark);
  background:var(--accent-soft);border-radius:99px;padding:.14em .62em;flex:none}
.opick-anl-head .opick-mcount + .opick-count{margin-left:8px}
.opick-anl-head .opick-mcount{margin-left:auto}
.opick-card.opick-unit{background:var(--surface)}
.opick-ulabel{width:42px;height:42px;border-radius:9px;flex:none;display:flex;align-items:center;justify-content:center;background:var(--accent-soft);color:var(--accent-dark);font-weight:700;font-size:.82rem;font-variant-numeric:tabular-nums}
.opick-ugrid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
@media(max-width:560px){
  .opick-bar{flex-direction:column;align-items:stretch}
  .opick-search{flex:0 0 auto;width:100%}
  .opick-seg{width:100%}
  .opick-seg button{flex:1}
  .opick-grid,.opick-ugrid{grid-template-columns:1fr}
}
/* Objekt-Feld im Vorgangs-Formular: gewähltes Objekt bzw. „auswählen"-Button */
.pf-obj-choose{display:flex;align-items:center;gap:9px;width:100%;padding:.7em .9em;border:1.5px dashed var(--field-line);border-radius:10px;background:var(--bg);color:var(--ink-soft);font:inherit;font-weight:600;cursor:pointer;transition:.14s}
.pf-obj-choose:hover{border-color:var(--accent);color:var(--accent-dark);background:var(--accent-soft)}
.pf-obj-choose:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.pf-obj-chosen{display:flex;align-items:center;gap:10px;padding:.6em .8em;border:1.5px solid var(--accent);border-radius:10px;background:var(--accent-soft)}
.pf-obj-ico{flex:none;display:flex;color:var(--accent-dark)}
.pf-obj-name{flex:1 1 0;min-width:0;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-obj-chosen .link-btn{flex:none}
.pf-obj-x{flex:none;width:26px;height:26px;border:none;border-radius:7px;background:transparent;color:var(--ink-soft);font-size:1.2rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.pf-obj-x:hover{background:var(--surface);color:var(--red)}
/* Personen-Werte-Sync-Dialog (Auswertungen aktualisieren) */
.sc-list{display:flex;flex-direction:column;gap:8px}
.sc-row{display:flex;gap:11px;align-items:flex-start;padding:11px 12px;border:1.5px solid var(--line);border-radius:11px;background:var(--surface);cursor:pointer;transition:border-color .13s,background .13s}
.sc-row:hover{border-color:var(--accent)}
.sc-row:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.sc-row input{margin-top:2px;flex:none;width:18px;height:18px;accent-color:var(--accent);cursor:pointer}
.sc-main{display:flex;flex-direction:column;gap:3px;min-width:0}
.sc-title{font-weight:600;color:var(--ink);display:flex;align-items:center;gap:8px}
.sc-sub{font-size:.82rem;color:var(--ink-soft)}
.sc-badge{font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);background:var(--bg);border:1px solid var(--line);border-radius:99px;padding:.12em .5em}
.sc-deltas{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:2px}
.sc-delta{font-size:.82rem;color:var(--ink-soft);font-variant-numeric:tabular-nums}
.sc-delta b{color:var(--accent-dark);font-variant-numeric:tabular-nums}
.sc-nochange{font-style:italic;opacity:.7}
.sc-closed{opacity:.72}

/* Filter-Segmente (Alle/Einzelobjekte/Wohnanlagen) */
.obj-filter-seg{display:inline-flex;background:var(--surface);border:1.5px solid var(--line);border-radius:12px;padding:3px;gap:2px}
.obj-filter-seg button{border:none;background:none;font:inherit;font-weight:600;font-size:.88rem;color:var(--ink-soft);padding:.5em 1em;border-radius:8px;cursor:pointer;transition:.14s;white-space:nowrap}
.obj-filter-seg button.on{background:var(--accent-soft);color:var(--accent-dark)}
.obj-filter-seg button:focus-visible{outline:2px solid var(--accent-dark);outline-offset:1px}
/* Auswahl-Dialog Einzelobjekt / Wohnanlage */
.obj-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.obj-choice{position:relative;text-align:left;display:flex;flex-direction:column;gap:9px;border:1.5px solid var(--line);border-radius:14px;padding:18px;background:var(--surface-2);cursor:pointer;transition:.14s}
.obj-choice:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.obj-choice-ico{width:42px;height:42px;border-radius:10px;display:flex;align-items:center;justify-content:center}
.obj-choice.single .obj-choice-ico{background:var(--accent-soft);color:var(--accent-dark)}
.obj-choice.anlage .obj-choice-ico{background:var(--bronze-soft,#F6EEDD);color:var(--bronze-600)}
.obj-choice-h{font-family:var(--font-head);font-weight:700;font-size:1.02rem;color:var(--ink)}
.obj-choice-p{font-size:.86rem;color:var(--ink-soft);line-height:1.45}
/* Geerbte Bilder in der Objektansicht */
.obj-ov-cell.obj-ov-inh{position:relative}
.obj-inh-tag{position:absolute;top:6px;left:6px;font-size:.58rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;background:var(--gold);color:var(--bronze-ink);padding:.18em .5em;border-radius:5px}
.obj-inh-dot{display:inline-block;width:8px;height:8px;border-radius:2px;background:var(--gold);vertical-align:middle}
/* Assistent: Schritte */
.anl-steps{display:inline-flex;align-items:center;gap:10px;margin-top:9px;font-size:.8rem;font-weight:600}
.anl-step{display:inline-flex;align-items:center;gap:7px;color:var(--ink-faint,var(--ink-soft))}
.anl-step .n{width:22px;height:22px;border-radius:99px;background:var(--line);color:var(--ink-soft);display:flex;align-items:center;justify-content:center;font-size:.78rem;font-weight:700}
.anl-step.on{color:var(--ink)}
.anl-step.on .n{background:var(--accent);color:#fff}
.anl-step.done .n{background:var(--accent-soft);color:var(--accent-dark)}
.anl-step-line{width:40px;height:1.5px;background:var(--line)}
/* Assistent: Methoden-Umschalter */
.anl-method{display:inline-flex;background:var(--surface-2);border:1.5px solid var(--line);border-radius:10px;padding:3px;margin-bottom:14px}
.anl-method button{border:none;background:none;font:inherit;font-weight:600;font-size:.88rem;color:var(--ink-soft);padding:.5em 1em;border-radius:7px;cursor:pointer}
.anl-method button.on{background:var(--surface);color:var(--accent-dark);box-shadow:var(--shadow-sm)}
/* Assistent: Serien-Generator */
.anl-genbar{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:13px 14px;margin-bottom:12px}
.anl-g{display:flex;flex-direction:column;gap:5px}
.anl-g span{font-size:.66rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);font-weight:700}
.anl-g input{background:var(--surface);border:1.5px solid var(--field-line);border-radius:8px;padding:.5em .55em;width:74px;text-align:center;font:inherit;font-variant-numeric:tabular-nums}
.anl-g input.pref{width:50px;text-transform:uppercase}
.anl-g input#anlRentRate{width:120px}
.anl-gdiv{width:1px;align-self:stretch;background:var(--line);margin:2px 0}
.anl-genbar .btn{margin-left:auto}
.anl-excel{background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:13px 14px;margin-bottom:12px}
.anl-excel p{font-size:.82rem;margin-bottom:8px}
/* Excel-Vorlage: drei Schritte, darunter die beiden Wege (herunterladen / hochladen). */
.anl-steps3{margin:0 0 12px;padding-left:20px;font-size:.84rem;color:var(--ink-soft);line-height:1.55}
.anl-steps3 li{margin-bottom:5px}
.anl-steps3 b{color:var(--ink)}
.anl-excel-acts{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.anl-excel-acts .btn{text-decoration:none}
.anl-excel-note{font-size:.78rem;color:var(--ink-faint);margin:10px 0 0!important;line-height:1.5}
/* Der Hinweis ist Fließtext, kein Flex-Container: als Flex wurde jedes <b> zu einer eigenen Spalte
   und der Satz zerfiel in drei Blöcke nebeneinander. */
.anl-hint{font-size:.82rem;color:var(--ink-soft);background:var(--accent-soft);border-radius:8px;padding:10px 12px;margin-bottom:12px;line-height:1.55}
.anl-hint b{color:var(--ink)}
/* Assistent: Einheiten-Raster */
.anl-grid-wrap{border:1px solid var(--line);border-radius:10px;overflow:hidden}
.anl-grid-scroll{overflow-x:auto;max-height:320px;overflow-y:auto}
.anl-grid-scroll.anl-grid-scroll-tall{max-height:none}
.anl-gtable{width:100%;border-collapse:collapse;min-width:640px}
.anl-gtable thead th{position:sticky;top:0;background:var(--surface-2);z-index:1;text-align:left;font-size:.66rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);padding:9px 10px;border-bottom:1px solid var(--line);font-weight:700}
.anl-gtable thead th.num{text-align:right}
.anl-gtable td{border-bottom:1px solid var(--line);border-right:1px solid var(--line);padding:0}
.anl-gtable td:last-child{border-right:none}
.anl-gtable td.rn{color:var(--ink-soft);font-size:.76rem;padding:0 10px;text-align:right;width:34px;border-right:1px solid var(--line)}
.anl-gtable input,.anl-gtable select{width:calc(100% - 8px);display:block;border:1px solid var(--field-line);background:var(--bg);border-radius:5px;margin:4px;padding:7px 8px;font:inherit;font-size:.88rem;box-sizing:border-box;color:var(--ink)}
.anl-gtable select{cursor:pointer;appearance:auto}
.anl-gtable input:hover,.anl-gtable select:hover{border-color:var(--ink-soft)}
.anl-gtable input:focus,.anl-gtable select:focus{background:var(--surface);outline:none;border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}
.anl-gtable input.nin{text-align:right;font-variant-numeric:tabular-nums}
.anl-gtable tbody tr:hover{background:var(--bg)}
/* Breites Einheiten-Grid: alle Felder + Foto-/Grundriss-Zellen je Zeile, horizontal scrollbar.
   Bezeichnungsspalte bleibt beim Scrollen links stehen (sticky) zur Orientierung. */
.anl-gtable-wide{min-width:1560px}
.anl-gtable-wide thead th{white-space:nowrap}
.anl-gtable-wide td.num,.anl-gtable-wide th.num{min-width:90px}
.anl-gtable-wide input.nin{min-width:72px}
.anl-gtable-wide td.rn,.anl-gtable-wide th.rn{position:sticky;left:0;z-index:2;background:var(--surface)}
.anl-gtable-wide thead th.rn{z-index:4;background:var(--surface-2)}
.anl-gtable-wide td.c-lbl,.anl-gtable-wide th.c-lbl{position:sticky;left:34px;z-index:2;background:var(--surface);min-width:150px;box-shadow:1px 0 0 var(--line)}
.anl-gtable-wide thead th.c-lbl{z-index:4;background:var(--surface-2)}
.anl-gtable-wide tbody tr:hover td.rn,.anl-gtable-wide tbody tr:hover td.c-lbl{background:var(--bg)}
.anl-gtable .c-img{min-width:128px;padding:3px 4px;vertical-align:middle}
.anl-gtable td.c-del{width:42px;text-align:center}
.anl-imgcell{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.anl-imgt{position:relative;width:34px;height:34px;border-radius:5px;overflow:hidden;flex:none;border:1px solid var(--line)}
.anl-imgt img{width:100%;height:100%;object-fit:cover;display:block}
.anl-imgx{position:absolute;top:0;right:0;width:15px;height:15px;line-height:13px;text-align:center;border:none;border-radius:0 0 0 5px;background:rgba(20,38,31,.72);color:#fff;font-size:.68rem;cursor:pointer;padding:0}
.anl-imgadd{width:34px;height:34px;border:1.5px dashed var(--field-line);border-radius:5px;background:var(--bg);color:var(--ink-soft);font-size:1.15rem;line-height:1;cursor:pointer;flex:none}
.anl-imgadd:hover{border-color:var(--accent);color:var(--accent-dark)}
/* Hinweis „geerbte Felder" in der Einheit-Einzelform */
.cf-inherit-note{margin:12px 0 2px;background:var(--surface-2);border-left:3px solid var(--accent);border-radius:0 8px 8px 0;padding:9px 12px;font-size:.85rem;line-height:1.45}
.anl-empty{padding:30px 18px;text-align:center;color:var(--ink-soft);font-size:.9rem}
.anl-del{background:none;border:none;color:var(--ink-soft);width:28px;height:28px;border-radius:6px;cursor:pointer;font-size:1rem}
.anl-del:hover{color:var(--red);background:rgba(194,72,58,.1)}
.anl-addrow{width:100%;background:none;border:none;border-top:1px dashed var(--field-line);color:var(--ink-soft);padding:11px 18px;font:inherit;font-size:.86rem;font-weight:600;text-align:left;cursor:pointer}
.anl-addrow:hover{background:var(--bg);color:var(--accent-dark)}
.anl-summary{display:flex;flex-wrap:wrap;gap:24px;align-items:center;margin-top:14px;padding:12px 16px;background:var(--accent-soft);border-radius:10px}
.anl-sum{font-size:.78rem;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.03em;font-weight:600}
.anl-sum b{font-family:var(--font-num);font-weight:700;font-size:1.1rem;color:var(--accent-dark);text-transform:none;letter-spacing:0;font-variant-numeric:tabular-nums;margin-right:5px}
/* Objektseite (Wohnanlage · Einheit · Einzelobjekt): gemeinsamer Kopf + Reiterleiste. Die Reiter
   nutzen die Optik der Kundenakte (.ak-tabs); der Inhalt liegt in eigenen Karten, damit Tabellen,
   Exposé-Editor und Bildraster ihre gewohnten Flächen behalten und nichts doppelt gerahmt wirkt. */
.obj-tabs{margin-top:18px}
.obj-tabbody{padding-top:18px}
/* Einheit einer Wohnanlage: links die Geschwister, rechts die Seite. Die Leiste bleibt beim
   Scrollen stehen und scrollt bei vielen Einheiten in sich selbst. */
.obj-with-rail{display:grid;grid-template-columns:236px minmax(0,1fr);gap:22px;align-items:start}
.obj-rail-main{min-width:0}
.unit-rail{position:sticky;top:14px;display:flex;flex-direction:column;gap:8px;max-height:calc(100vh - 40px);
  background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px 10px 10px}
.unit-rail-head{display:flex;flex-direction:column;gap:2px;padding:0 4px}
.uri-anlage{background:none;border:0;padding:0;font:inherit;font-weight:700;font-size:.92rem;color:var(--ink);
  text-align:left;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.uri-anlage:hover{color:var(--accent-dark)}
.uri-anlage:focus-visible{outline:2px solid var(--accent-dark);outline-offset:2px;border-radius:6px}
.uri-kicker{font-size:.7rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft)}
.unit-rail-suche{width:100%;font:inherit;font-size:.85rem;padding:6px 9px;border:1px solid var(--line);
  border-radius:9px;background:var(--bg);color:var(--ink)}
.unit-rail-list{display:flex;flex-direction:column;gap:2px;overflow:auto;margin:0 -4px;padding:0 4px}
.unit-rail-item{display:flex;flex-direction:column;gap:1px;align-items:stretch;width:100%;text-align:left;font:inherit;
  background:none;border:0;border-radius:9px;padding:7px 9px;cursor:pointer;color:var(--ink)}
.unit-rail-item:hover{background:var(--bg)}
.unit-rail-item:focus-visible{outline:2px solid var(--accent-dark);outline-offset:-2px}
/* Fläche statt Akzentkante – eine farbige Kante an der abgerundeten Zeile bricht die Form. */
.unit-rail-item.on{background:var(--accent-soft);color:var(--accent-dark)}
.uri-line{display:flex;align-items:center;gap:7px;min-width:0}
.uri-title{font-weight:600;font-size:.88rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.uri-sub{font-size:.74rem;color:var(--ink-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.unit-rail-item.on .uri-sub{color:var(--accent-dark);opacity:.75}
/* Status ausgeschrieben statt Farbpunkt: getönte Fläche, damit vier Zeilen nebeneinander nicht
   schreien – die Farbe bleibt dieselbe wie beim großen Abzeichen auf der Objektseite. */
.uri-pill{flex:none;margin-left:auto;font-size:.62rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;
  padding:.2em .5em;border-radius:6px;white-space:nowrap}
.uri-pill.os-talk{color:#31536B;background:color-mix(in srgb,#3F6B8A 16%,var(--surface))}
.uri-pill.os-reserved{color:#7E6127;background:color-mix(in srgb,#B0894A 20%,var(--surface))}
.uri-pill.os-sold{color:#226245;background:color-mix(in srgb,#2A7A57 16%,var(--surface))}
.uri-pill.os-off{color:var(--ink-soft);background:var(--bg)}
[data-theme="dark"] .uri-pill.os-talk{color:#9BC0D8}
[data-theme="dark"] .uri-pill.os-reserved{color:#DCBE85}
[data-theme="dark"] .uri-pill.os-sold{color:#7FC5A3}
.unit-rail-leer{font-size:.82rem;margin:6px 4px}
/* Schmal: die Leiste legt sich als waagerechte Streifen über den Inhalt, statt die Seite zu quetschen. */
@media(max-width:1000px){
  .obj-with-rail{grid-template-columns:minmax(0,1fr)}
  .unit-rail{position:static;max-height:none;flex-direction:row;align-items:center;gap:10px;overflow:auto}
  .unit-rail-head{flex:none}
  .unit-rail-list{flex-direction:row;overflow:visible;margin:0}
  .unit-rail-item{width:auto;white-space:nowrap}
  .unit-rail-suche{display:none}
}
.obj-tabcard{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px 20px}
.obj-tabcard > :last-child{margin-bottom:0}
.obj-tabcard .obj-ov-gallery:first-child{margin-top:0}
.obj-tabbody > .anl-kpis{margin-top:0}
.obj-tabcard .obj-ov-projects{margin:0}
/* Exposé als Reiter: der Editor bringt seine eigene Kopfzeile mit – im Reiter ohne Zurück-Knopf
   und ohne zweite Überschrift, die Seite nennt das Objekt bereits. */
.xp-top-tab{margin:0 0 14px}
/* ===================== Objektseite: Reiter-Inhalte ===================== */
/* Leiste im Reiter selbst: links, was der Reiter zeigt, rechts SEINE Aktionen. Die globalen
   Aktionen (Archivieren, Löschen …) stehen unverändert oben im Seitenkopf. */
.tab-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.tab-bar-txt{font-size:.84rem;color:var(--ink-soft)}
.tab-bar-acts{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
/* Inline-Bearbeitung: Zelle = Label + Feld, das Feld trägt erst im Fokus einen sichtbaren Rahmen. */
.ed-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.ed-title{font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--accent-dark)}
.ed-stand{font-size:.78rem;color:var(--ink-faint)}
.ed-stand.ok{color:var(--green)}
.ed-stand.neg{color:var(--red)}
.ed-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;align-items:start}
.ed-cell{display:flex;flex-direction:column;gap:3px;border:1px solid var(--line);border-radius:10px;padding:8px 11px 9px;background:var(--bg);min-width:0}
.ed-cell:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--om-accent-glow)}
.ed-weit{grid-column:1/-1}
.ed-lbl{font-size:.72rem;text-transform:uppercase;letter-spacing:.03em;color:var(--ink-soft);font-weight:600}
.ed-lbl i{font-style:normal;text-transform:none;letter-spacing:0;color:var(--ink-faint)}
.ed-erbe{font-size:.6rem;font-weight:800;letter-spacing:.06em;background:var(--surface-2);color:var(--bronze-600);border-radius:var(--r-pill);padding:.1em .45em;vertical-align:1px}
.ed-cell input,.ed-cell select,.ed-cell textarea{border:none;background:none;outline:none;padding:0;font:inherit;font-family:var(--font-num);font-size:1rem;font-weight:600;color:var(--accent-dark);width:100%;min-width:0;font-variant-numeric:tabular-nums}
.ed-cell textarea{font-family:inherit;font-weight:400;font-size:.92rem;line-height:1.55;color:var(--ink-soft);resize:vertical}
.ed-cell select{cursor:pointer}
.ed-cell input::placeholder,.ed-cell textarea::placeholder{color:var(--ink-faint);font-weight:400}
.ed-ro{background:var(--surface-2);border-style:dashed}
.ed-ro b{font-family:var(--font-num);font-size:1rem;font-weight:600;color:var(--ink-soft);word-break:break-word}
.ed-ro.ed-weit b{font-family:inherit;font-weight:400;font-size:.92rem;line-height:1.55;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.ed-fuss{font-size:.78rem;color:var(--ink-faint);margin:12px 0 0;line-height:1.5}
/* Bilderbereich: Fotos und Grundrisse in EINER Karte, gleiche Kachelgröße. */
.med-lbl{font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--accent-dark);margin:16px 0 8px}
.med-lbl:first-of-type{margin-top:4px}
.med-lbl i{font-style:normal;font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink-faint)}
.med-erbe{margin-bottom:4px}
.med-erbe-tag{font-size:.6rem;font-weight:800;letter-spacing:.06em;background:var(--surface-2);color:var(--bronze-600);border-radius:var(--r-pill);padding:.1em .45em}
.obj-tabcard .obj-thumb,.obj-tabcard .obj-add{width:132px;height:99px}
.obj-thumb-ro{cursor:default}
.obj-thumb-tag{position:absolute;left:5px;bottom:5px;font-size:.58rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;background:rgba(20,38,31,.72);color:#fff;border-radius:var(--r-pill);padding:.15em .5em}
#medPhotos .obj-thumb:first-child::after{content:"Titelbild";position:absolute;left:5px;top:5px;font-size:.58rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;background:var(--accent);color:var(--accent-ink);border-radius:var(--r-pill);padding:.15em .5em}
/* ===================== Wohnanlage: Cockpit ===================== */
.ck-cols{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:18px;align-items:start}
.ck-cols-solo{grid-template-columns:minmax(0,1fr)}
.ck-main{display:flex;flex-direction:column;gap:16px;min-width:0}
.ck-side{display:flex;flex-direction:column;gap:16px;min-width:0}
/* Die Freigaben-Karte bringt aus der Objektliste einen eigenen Abstand mit — in der Spalte sorgt
   der schon für den Abstand, sonst startet die rechte Spalte 18px tiefer als die linke. */
.ck-side>#gwOwnerExtra{display:contents}
.ck-side .gw-shares-card{margin-top:0}
.ck-card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px 18px}
.ck-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.ck-title{font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--accent-dark)}
.ck-zahl{font-family:var(--font-num);font-weight:700;font-size:.86rem;color:var(--ink-faint);font-variant-numeric:tabular-nums}
.ck-zahl-warn{color:var(--bronze-600)}
.ck-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px}
.ck-kpi{padding:2px 16px 2px 0;border-right:1px solid var(--line)}
.ck-kpi:last-child{border-right:none}
.ck-kpi span{display:block;font-size:.7rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);font-weight:700}
.ck-kpi b{font-family:var(--font-num);font-weight:700;font-size:clamp(1.1rem,1.55vw,1.5rem);white-space:nowrap;color:var(--ink);font-variant-numeric:tabular-nums;display:block;margin-top:4px}
.ck-kpi b.pos{color:var(--green)}
.ck-kpi b i{font-style:normal;font-size:.86rem;font-weight:600;color:var(--ink-faint)}
.ck-bar{margin-top:16px}
.ck-bar .obj-anl-bar{height:9px}
.ck-link{appearance:none;border:none;background:none;color:var(--accent-dark);font:inherit;font-weight:600;font-size:.84rem;cursor:pointer;padding:0;margin-top:14px}
.ck-link:hover{text-decoration:underline}
.ck-leer{font-size:.86rem;color:var(--ink-faint);margin:0;line-height:1.55}
.ck-vg{display:flex;flex-direction:column;gap:6px}
.ck-vg-row{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"main stage" "sub stage";gap:2px 12px;align-items:center;width:100%;text-align:left;appearance:none;border:1px solid var(--line);background:var(--bg);border-radius:11px;padding:10px 13px;font:inherit;cursor:pointer;transition:border-color var(--dur-fast) var(--ease-out),background-color var(--dur-fast) var(--ease-out)}
.ck-vg-row:hover{border-color:var(--accent);background:var(--accent-soft)}
.ck-vg-main{grid-area:main;font-size:.9rem;color:var(--ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ck-vg-main span{color:var(--ink-soft)}
.ck-vg-sub{grid-area:sub;font-size:.76rem;color:var(--ink-faint)}
.ck-vg-stage{grid-area:stage;font-size:.7rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--ink-soft);border:1px solid var(--line);border-radius:var(--r-pill);padding:.2em .7em;white-space:nowrap;background:var(--surface)}
.ck-vg-stage.won{color:var(--green);border-color:var(--green)}
.ck-vg-stage.lost{color:var(--ink-faint)}
.ck-todo{border-color:var(--gold)}
.ck-anf{display:flex;flex-direction:column;gap:8px}
.ck-anf-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;font-size:.88rem;color:var(--ink-soft)}
.ck-anf-row b{color:var(--ink)}
@media(max-width:620px){.ck-anf-row{grid-template-columns:minmax(0,1fr)}.ck-anf-row button{justify-self:start}}
.ck-anf-unit{font-family:var(--font-num);font-weight:700;color:var(--accent-dark)}
@media(max-width:1080px){.ck-cols{grid-template-columns:minmax(0,1fr)}}
@media(max-width:640px){.ck-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 2px}.ck-kpi:nth-child(2n){border-right:none}}
/* Anlage-Detailseite */
.anl-back{display:inline-flex;align-items:center;gap:6px;background:none;border:none;color:var(--ink-soft);font:inherit;font-weight:600;font-size:.9rem;cursor:pointer;padding:0;margin-bottom:16px}
.anl-back:hover{color:var(--accent-dark)}
.anl-title-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
/* Die Badges sind auf den Objektkarten absolut positioniert – in der Titelzeile laufen sie mit. */
.anl-title-row .obj-badge{position:static;right:auto;top:auto;left:auto}
.anl-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin:20px 0 22px}
.anl-kpi{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:15px 17px}
.anl-kpi .l{font-size:.7rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);font-weight:700}
.anl-kpi .n{font-family:var(--font-num);font-weight:700;font-size:1.5rem;margin-top:5px;font-variant-numeric:tabular-nums;color:var(--ink)}
.anl-kpi .n.pos{color:var(--green)}
.anl-table-card{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.anl-table-scroll{overflow-x:auto}
.anl-utable{width:100%;border-collapse:collapse;min-width:720px}
.anl-utable th{text-align:left;font-size:.68rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);padding:12px 16px;background:var(--surface-2);border-bottom:1px solid var(--line);font-weight:700}
.anl-utable th.num,.anl-utable td.num{text-align:right;font-variant-numeric:tabular-nums}
.anl-utable td{padding:11px 16px;border-bottom:1px solid var(--line);font-size:.92rem}
.anl-utable tbody tr:last-child td{border-bottom:none}
.anl-urow{cursor:pointer;transition:background .1s}
.anl-urow:hover{background:var(--bg)}
.anl-utable .u-lbl{font-family:var(--font-head);font-weight:700}
.anl-open{color:var(--accent-dark);font-weight:600;font-size:.86rem}
.anl-edit-hint{font-size:.84rem;color:var(--ink-soft);padding:12px 16px;background:var(--accent-soft);border-bottom:1px solid var(--line);line-height:1.5}
/* Grundstück-Toggle */
.obj-toggle{display:inline-flex;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:3px;gap:2px}
.obj-toggle button{flex:1;border:none;background:none;font:inherit;font-size:.82rem;font-weight:600;color:var(--ink-soft);padding:.42em .8em;border-radius:999px;cursor:pointer;transition:.15s;white-space:nowrap}
.obj-toggle button.on{background:var(--accent);color:#fff}
/* Restnutzungsdauer-Gutachten-Abfrage im Vorgang (Ergänzen-/Bulk-Dialog) */
.rnd-ask{margin-top:8px}
.rnd-ask-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.rnd-ask-q{font-size:.86rem;font-weight:600;color:var(--ink)}
.rnd-ask .rnd-toggle{flex:0 0 auto}
.rnd-ask .rnd-input{width:110px;padding:.5em .7em;border:1px solid var(--line);border-radius:10px;font:inherit;background:var(--bg)}
.rnd-ask-note{font-size:.78rem;margin-top:4px}
/* Upload-Zone */
.obj-upzone{margin-top:4px}
.obj-thumbs{display:flex;flex-wrap:wrap;gap:10px}
.obj-thumb{position:relative;width:92px;height:92px;border-radius:12px;overflow:hidden;border:1px solid var(--line);cursor:grab;background:var(--bg)}
.obj-thumb img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.obj-thumb.dragging{opacity:.4}
.obj-thumb-x{position:absolute;top:4px;right:4px;width:22px;height:22px;border:none;border-radius:50%;background:rgba(20,38,31,.72);color:#fff;font-size:1rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.obj-thumb-x:hover{background:var(--red)}
.obj-add{width:92px;height:92px;border:1.5px dashed var(--line);border-radius:12px;background:var(--bg);color:var(--accent-dark);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:.74rem;font-weight:600;cursor:pointer;transition:.15s}
.obj-add:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}
.obj-upzone-hint{font-size:.78rem;color:var(--ink-soft);margin-top:8px}
.obj-upzone.obj-upzone-drag{outline:2px dashed var(--accent);outline-offset:6px;border-radius:14px}
.obj-upzone.obj-upzone-drag .obj-add{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}
/* Detail-Galerie */
.obj-ov-gallery{margin:4px 0 14px}
.obj-ov-gallery-lbl{font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--accent-dark);margin-bottom:8px}
.obj-ov-grid{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(132px,1fr))}
.obj-ov-cell{aspect-ratio:4/3;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:var(--bg)}
.obj-ov-cell img{width:100%;height:100%;object-fit:cover;display:block}
.obj-ov-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:4px 0 12px}
.obj-ov-fact{border:1px solid var(--line);border-radius:10px;padding:9px 12px;background:var(--bg)}
.obj-ov-fact span{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.03em;color:var(--ink-soft);margin-bottom:2px}
.obj-ov-fact b{font-family:var(--font-num);font-size:1rem;color:var(--accent-dark);font-variant-numeric:tabular-nums}
.obj-ov-desc{font-size:.92rem;line-height:1.6;color:var(--ink-soft);margin:0 0 14px}
/* Vorgangs-Picker */
.obj-pp-list{margin-top:12px;display:flex;flex-direction:column;gap:6px;max-height:340px;overflow:auto}
.obj-pp-item{text-align:left;width:100%;border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:11px 14px;cursor:pointer;font-size:.95rem;color:var(--ink);transition:.13s}
.obj-pp-item:hover{border-color:var(--accent);background:var(--accent-soft)}
.obj-pp-item b{font-weight:600}
.obj-pp-sub{display:block;font-size:.82rem;color:var(--ink-soft);margin-top:2px}
@media(max-width:560px){
  .obj-grid{grid-template-columns:1fr 1fr;gap:12px}
  .obj-thumb,.obj-add{width:78px;height:78px}
}

/* ==================================================================
   ImmoBricks-Fundament: „Brick"-Signature, Loader, Läuferverband, Motion.
   Der 2:1-Stein (Radius 2px) ersetzt runde Punkte, Prozent-Pillen und Spinner.
   ================================================================== */
/* Brick als Marker (Badges/Chips/Legenden): skaliert mit font-size, nimmt currentColor */
.brick{display:inline-block;width:.9em;height:.45em;border-radius:var(--brick-radius);background:currentColor;vertical-align:middle;flex:none}
.brick-row{display:inline-flex;gap:3px;align-items:center}

/* Brick-Loader: drei pulsierende Steine statt Spinner */
.brick-loader{display:inline-flex;gap:4px;align-items:flex-end}
.brick-loader i{width:14px;height:7px;border-radius:var(--brick-radius);background:var(--green-600);animation:brickPulse 1s var(--ease-out) infinite}
.brick-loader i:nth-child(2){animation-delay:.13s}
.brick-loader i:nth-child(3){animation-delay:.26s}
@keyframes brickPulse{0%,100%{opacity:.28;transform:translateY(0)}42%{opacity:1;transform:translateY(-4px)}}

/* Läuferverband für dunkle Hero-/Leerflächen (auf Forest 900, ≤10% Deckkraft) */
.brick-pattern{background-color:var(--forest-900);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='60' fill='none' stroke='%23ffffff' stroke-opacity='0.07'%3E%3Cpath d='M0 .5H120M0 30.5H120M0 59.5H120'/%3E%3Cpath d='M.5 0V30M60.5 0V30M119.5 0V30'/%3E%3Cpath d='M30.5 30V60M90.5 30V60'/%3E%3C/svg%3E")}

/* „Aufbau": Elemente erscheinen wie gesetzte Steine – von unten, 60 ms versetzt */
@keyframes ibAufbau{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
.ib-aufbau>*{animation:ibAufbau var(--dur-enter) var(--ease-out) both}
.ib-aufbau>*:nth-child(1){animation-delay:0ms}
.ib-aufbau>*:nth-child(2){animation-delay:60ms}
.ib-aufbau>*:nth-child(3){animation-delay:120ms}
.ib-aufbau>*:nth-child(4){animation-delay:180ms}
.ib-aufbau>*:nth-child(5){animation-delay:240ms}
.ib-aufbau>*:nth-child(6){animation-delay:300ms}
.ib-aufbau>*:nth-child(7){animation-delay:360ms}
.ib-aufbau>*:nth-child(n+8){animation-delay:420ms}
@media(prefers-reduced-motion:reduce){
  .brick-loader i{animation:none;opacity:.7}
  .ib-aufbau>*{animation:none}
}

/* ============================ Exposé-Editor (crm-expose.js, Präfix .xp-) ============================ */
.xp-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
/* Ghost-Buttons im Editor-Kopf liegen auf der grauen Seitenfläche → weiß, sonst zu wenig Kontrast */
.xp-top .btn-ghost{background:var(--surface)}
.xp-titlewrap{flex:1 1 260px;min-width:200px}
.xp-title{font-family:var(--font-head);font-size:1.25rem;margin:0;letter-spacing:-.02em}
.xp-sub{font-size:.82rem;color:var(--ink-soft)}
.xp-autonote{color:var(--green-600);font-weight:600}
.xp-badge{flex:none;font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:4px 11px;border-radius:999px}
.xp-badge.draft{background:var(--accent-soft);color:var(--accent-dark);border:1px solid var(--accent-soft)}
.xp-badge.live{background:rgba(44,122,85,.14);color:var(--green-600);border:1px solid rgba(44,122,85,.3)}
.xp-savedwrap{flex:none}
.xp-savednote{font-size:.78rem;color:var(--slate-400)}
.xp-savednote.busy{color:var(--accent-dark)}
.xp-layout{display:grid;grid-template-columns:212px minmax(0,1fr);gap:20px;align-items:start}
.xp-nav{position:sticky;top:14px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px 10px}
.xp-meter{padding:2px 8px 10px}
.xp-meter span{font-size:.75rem;color:var(--ink-soft)}
.xp-bar{height:6px;border-radius:99px;background:var(--surface-2);overflow:hidden;margin-top:5px}
.xp-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--green-700),var(--bronze-500));border-radius:99px;transition:width .35s ease}
.xp-sec{display:flex;align-items:center;gap:8px;width:100%;text-align:left;background:none;border:none;border-radius:9px;padding:8px 10px;font:inherit;font-size:.88rem;color:var(--ink-soft);cursor:pointer}
.xp-sec:hover{background:var(--surface-2);color:var(--ink)}
.xp-sec.on{background:var(--accent-soft);color:var(--accent-dark);font-weight:600}
.xp-dot{margin-left:auto;width:17px;height:17px;border-radius:50%;border:1.5px dashed var(--field-line);font-size:.62rem;display:flex;align-items:center;justify-content:center;color:transparent;flex:none}
.xp-dot.done{border:none;background:var(--green-600);color:#fff}
/* Handlungsbedarf am Erbe-Tab: Wohnanlage hat noch kein Exposé — Vererbung läuft ins Leere */
.xp-warn{margin-left:auto;width:17px;height:17px;border-radius:50%;background:var(--gold);color:#fff;font-size:.72rem;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none}
.xp-navnote{font-size:.72rem;color:var(--slate-400);margin:10px 8px 4px;line-height:1.45}
.xp-card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px 20px}
.xp-cardhead{font-size:.72rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--accent-dark);margin-bottom:14px}
.xp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px 14px}
.xp-field{display:flex;flex-direction:column;gap:4px;min-width:0}
.xp-field.sm{max-width:190px}
.xp-field.xp-wide{grid-column:1/-1}
.xp-lbl{display:flex;align-items:center;gap:6px;font-size:.74rem;font-weight:600;color:var(--ink-soft)}
.xp-field input,.xp-field select{width:100%;background:var(--surface-2);border:1px solid var(--field-line);border-radius:9px;padding:8px 10px;font:inherit;font-size:.9rem;color:var(--ink)}
.xp-field input:focus,.xp-field select:focus,.xp-ta:focus{outline:2px solid var(--green-700);outline-offset:-1px}
.xp-inwrap{position:relative;display:block}
.xp-inwrap .xp-eur{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-style:normal;font-size:.82rem;color:var(--slate-400);pointer-events:none}
.xp-inwrap input{padding-right:26px}
/* Quellen-Markierung: Autofill (grün) / geerbt von der Anlage (bronze) */
.xp-src{flex:none;font-size:.6rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:1.5px 7px;border-radius:999px}
.xp-src.auto{background:rgba(44,122,85,.13);color:var(--green-600)}
.xp-src.inh{background:rgba(203,167,106,.2);color:var(--bronze-600)}
input.xp-inhval,select.xp-inhval{border-color:rgba(203,167,106,.55);background:rgba(203,167,106,.07)}
.xp-chip.xp-inhval{border-color:rgba(203,167,106,.55)}
.xp-reset{flex:none;border:none;background:none;color:var(--bronze-600);cursor:pointer;font-size:.85rem;padding:0 2px;line-height:1}
.xp-reset:hover{color:var(--accent-dark)}
/* Checkboxen als Merkmal-Pillen */
/* Ankreuzfeld im Exposé-Editor. align-self:end, weil die Nachbarzellen des Rasters Label UND
   Eingabe tragen: ohne das streckt sich der Kasten über die volle Zeilenhöhe (60 statt 37 px) und
   steht als überdimensionierte graue Fläche neben einem normalen Feld. So sitzt er auf derselben
   Grundlinie wie die Auswahlfelder daneben. */
.xp-check{display:inline-flex;align-self:end;align-items:center;gap:8px;background:var(--surface-2);border:1.5px solid var(--field-line);border-radius:10px;padding:8px 12px;font-size:.86rem;color:var(--ink-soft);cursor:pointer;user-select:none}
.xp-check input{accent-color:var(--green-700);margin:0}
.xp-check.on{border-color:var(--green-700);color:var(--ink);background:rgba(44,122,85,.07)}
/* Chips (Mehrfachauswahl) */
.xp-chips{display:flex;gap:7px;flex-wrap:wrap}
.xp-chip{border:1.5px solid var(--field-line);background:var(--surface);color:var(--ink-soft);border-radius:999px;padding:6px 13px;font:inherit;font-size:.83rem;cursor:pointer;transition:background .12s,border-color .12s,color .12s}
.xp-chip:hover{border-color:var(--green-600);color:var(--ink)}
.xp-chip.on{background:var(--green-700);border-color:var(--green-700);color:#fff}
/* Texte */
.xp-txtblock{border-top:1px solid var(--line);padding:14px 0 4px;margin-top:6px}
.xp-txtblock:first-child{border-top:none;margin-top:0;padding-top:0}
.xp-txthead{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.xp-txthead b{font-size:.92rem}
.xp-freigabe{background:var(--surface-2);border:1px solid var(--field-line);border-radius:8px;padding:5px 8px;font:inherit;font-size:.76rem;color:var(--ink-soft)}
.xp-count{margin-left:auto;font-size:.72rem;color:var(--slate-400);font-variant-numeric:tabular-nums}
.xp-ta{width:100%;background:var(--surface-2);border:1px solid var(--field-line);border-radius:10px;padding:10px 12px;font:inherit;font-size:.9rem;color:var(--ink);resize:vertical;min-height:96px;box-sizing:border-box}
.xp-foot{margin-top:10px;font-size:.78rem}
@media(max-width:860px){
  .xp-layout{grid-template-columns:1fr}
  .xp-nav{position:static;display:flex;flex-wrap:wrap;gap:4px;padding:10px}
  .xp-meter{width:100%;padding-bottom:8px}
  .xp-sec{width:auto;padding:7px 11px}
  .xp-dot{display:none}
  .xp-navnote{display:none}
}

/* Exposé: kuratierte Mehrfachauswahl mit „Weitere …" + Stellplatz-Zeilen (Juli 2026) */
.xp-chips .xp-chip.more{display:none}
.xp-chips.open .xp-chip.more{display:inline-flex}
.xp-chips .xp-chip.more.on{display:inline-flex}   /* gewählte Werte der Vollliste bleiben immer sichtbar */
.xp-morebtn{border:none;background:none;color:var(--accent-dark);font:inherit;font-size:.8rem;font-weight:600;cursor:pointer;padding:6px 4px;text-decoration:underline;text-underline-offset:3px}
.xp-morebtn:hover{color:var(--green-700)}
.xp-splist{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.xp-sprow{display:flex;align-items:center;gap:8px}
.xp-sprow .xp-spart{background:var(--surface-2);border:1px solid var(--field-line);border-radius:9px;padding:8px 10px;font:inherit;font-size:.9rem;color:var(--ink);min-width:190px}
.xp-spx{color:var(--slate-400);font-size:.85rem}
.xp-sprow .xp-spanz{width:56px;background:var(--surface-2);border:1px solid var(--field-line);border-radius:9px;padding:8px 10px;font:inherit;font-size:.9rem;color:var(--ink);text-align:center}
.xp-spdel{border:none;background:none;color:var(--slate-400);font-size:1.05rem;cursor:pointer;padding:2px 6px;line-height:1;border-radius:7px}
.xp-spdel:hover{color:var(--red);background:var(--surface-2)}
.xp-spadd{margin-top:2px}

/* Exposé: „Aus der Wohnanlage"-Zusammenfassung an der Einheit + geerbte Text-Vorschau */
.xp-erbe{display:flex;flex-direction:column;gap:0;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.xp-erberow{display:grid;grid-template-columns:150px 1fr;gap:12px;padding:10px 14px;border-top:1px solid var(--line);background:var(--surface-2)}
.xp-erberow:first-child{border-top:none}
.xp-erberow span{font-size:.76rem;font-weight:600;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.03em;padding-top:1px}
.xp-erberow b{font-size:.9rem;font-weight:500;color:var(--ink)}
@media(max-width:640px){.xp-erberow{grid-template-columns:1fr;gap:2px}}
.xp-basetxt{margin:8px 0 0;font-size:.78rem;color:var(--bronze-600)}
.xp-basetxt span{display:block;margin-top:4px;color:var(--ink-soft);font-style:italic;background:var(--surface-2);border-radius:8px;padding:8px 10px}

/* Schlanke Button-Generation (Flavio-Vorgabe 20.07.2026): Standard für neue Bedienflächen.
   Kompakt, klarer Kontrast, keine Schatten/Sprünge — die fetten Alt-.btn nicht mehr verwenden. */
.btn.btn-slim{padding:.5em 1.05em;font-size:.88rem;font-weight:600;border-radius:10px;box-shadow:none}
.btn.btn-slim.btn-primary:hover{transform:none;box-shadow:none;background:var(--accent-dark)}
.btn.btn-slim.btn-ghost{border:1px solid var(--line);color:var(--ink)}
.btn.btn-slim.btn-ghost:hover:not(:disabled){border-color:var(--accent);color:var(--accent-dark);background:var(--surface-2)}
/* Exposé: geerbte Texte (read-only) im Texte-Abschnitt der Einheit */
.xp-rotext{border:1px solid var(--line);border-radius:12px;background:var(--surface-2);padding:12px 16px;margin-bottom:12px}
.xp-rotext .xp-txthead{margin-bottom:6px}
.xp-rotext p{margin:0;font-size:.86rem;color:var(--ink-soft);line-height:1.6;white-space:pre-line}

/* ============ Exposé-Ansicht (gemeinsamer Renderer expose-view.js, Präfix .xv-) ============
   Genutzt vom Kundenbereich (kunde.php) UND der öffentlichen Landingpage (expose.php). */
.xv-addr{color:var(--ink-soft);margin-bottom:4px}
.xv-subline{color:var(--accent-dark);font-size:.85rem;font-weight:600;margin-bottom:14px}
.xv-dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:0 44px}
.xv-dl>div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:8px 0;border-bottom:1px solid var(--line);font-size:.92rem}
.xv-dl span{color:var(--ink-soft)}
.xv-dl b{color:var(--ink);font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
.xv-text{color:var(--ink-soft);line-height:1.7;white-space:pre-line;margin:0 0 6px}
.xv-eskala{display:flex;gap:2px;max-width:420px;margin:2px 0 14px}
.xv-eskala i{flex:1;height:20px;font-style:normal;font-size:.62rem;font-weight:800;color:#fff;display:flex;align-items:center;justify-content:center;opacity:.32;border-radius:3px}
.xv-eskala i.on{opacity:1;outline:2.5px solid var(--ink);transform:scale(1.12)}

/* Exposé: Tonalitäts-Segment der KI-Textgenerierung */
.xp-tone{display:inline-flex;background:var(--surface-2);border:1px solid var(--field-line);border-radius:9px;padding:2px;gap:2px}
.xp-tone button{border:none;background:transparent;border-radius:7px;padding:4px 10px;font:inherit;font-size:.76rem;font-weight:600;color:var(--ink-soft);cursor:pointer}
.xp-tone button.on{background:var(--surface);color:var(--ink);box-shadow:0 1px 4px rgba(20,38,31,.15)}
.xp-genbtn{white-space:nowrap}

/* ImmoScout24: Portal-Panel im Exposé-Editor + Integrationen-Karte (Einstellungen) */
.xp-portal-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.xp-portal-head b{font-size:1.02rem}
.xp-portal-env{font-size:.64rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;background:var(--surface-2);border:1px solid var(--line);border-radius:999px;padding:.3em .7em;color:var(--ink-soft)}
.xp-portal-pill{font-size:.64rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;border-radius:999px;padding:.3em .8em}
.xp-portal-pill.live{background:var(--green-600);color:#fff}
.xp-portal-pill.off{background:var(--surface-2);border:1px solid var(--line);color:var(--ink-soft)}
.xp-portal-pill.err{background:var(--red);color:#fff}
.xp-portal-pill.warte{background:var(--gold);color:#fff}
.xp-portal-stale{border-left:3px solid var(--gold);background:var(--hint-bg,var(--surface-2));border-radius:0 8px 8px 0;padding:8px 12px;margin:10px 0;font-size:.84rem}
.xp-portal-errbox{border-left:3px solid var(--red);background:var(--surface-2);border-radius:0 8px 8px 0;padding:8px 12px;margin:10px 0;font-size:.84rem;color:var(--red)}
.xp-portal-checks{margin:10px 0 14px}
/* Vollständigkeits-Liste im Portal-Panel. Hieß bis 27.07. ebenfalls .xp-check und überschrieb damit
   das Exposé-Ankreuzfeld (Zeile ~1438): gleiche Spezifität, spätere Regel gewinnt — das Feld verlor
   Zentrierung und Innenabstand und stand als leerer grauer Kasten da. Eigener Name, eigene Komponente. */
.xp-portal-check{display:flex;gap:9px;align-items:baseline;padding:4px 0;font-size:.86rem}
.xp-portal-check i{font-style:normal;flex:none;width:17px;height:17px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:.62rem;font-weight:800}
.xp-portal-check.ok i{background:var(--green-600);color:#fff}
.xp-portal-check.miss i{background:var(--red);color:#fff}
.xp-portal-check.miss{color:var(--red)}
.xp-portal-check.soft{color:var(--ink-soft)}
.xp-portal-check.soft i{background:var(--surface-2);border:1px solid var(--line);color:var(--ink-soft)}
.xp-portal-actions{display:flex;gap:10px;flex-wrap:wrap}
.acc-int-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.acc-int-head b{font-size:1rem}
.acc-int-env{font-size:.64rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;background:var(--surface-2);border:1px solid var(--line);border-radius:999px;padding:.3em .7em;color:var(--ink-soft)}
.acc-int-env.prod{background:var(--green-600);border-color:var(--green-600);color:#fff}
.acc-int-ok{font-size:.64rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;background:var(--green-600);color:#fff;border-radius:999px;padding:.3em .8em}
.acc-int-ok.err{background:var(--red)}
.acc-int-rows{margin-top:12px}
.acc-int-rows>div{display:flex;justify-content:space-between;gap:14px;padding:7px 0;border-top:1px solid var(--line);font-size:.9rem}
.acc-int-rows span{color:var(--ink-soft)}

/* Mail-Bereich (P2): Ordner-Tabs, Liste + Lesebereich, Match-Chips */
.mail-empty{max-width:520px;padding:30px 0}
.mail-empty h2{margin:0 0 8px}
.mail-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.mail-tabs{display:inline-flex;background:var(--surface-2);border:1px solid var(--line);border-radius:11px;padding:3px;gap:3px}
.mail-tab{border:none;background:transparent;border-radius:8px;padding:.45em 1em;font:inherit;font-size:.86rem;font-weight:600;color:var(--ink-soft);cursor:pointer}
.mail-tab.on{background:var(--surface);color:var(--ink);box-shadow:0 1px 4px rgba(20,38,31,.14)}
.mail-acc{font-size:.82rem;max-width:280px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-layout{display:grid;grid-template-columns:minmax(260px,380px) minmax(0,1fr);gap:16px;align-items:start}
@media(max-width:900px){.mail-layout{grid-template-columns:1fr}}
.mail-list{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;max-height:calc(100vh - 210px);overflow-y:auto}
.mail-row{display:flex;flex-direction:column;gap:3px;width:100%;text-align:left;background:var(--surface);border:none;border-top:1px solid var(--line);padding:12px 14px;font:inherit;cursor:pointer}
.mail-list .mail-row:first-child{border-top:none}
.mail-row:hover{background:var(--surface-2)}
.mail-row.on{background:var(--accent-soft,var(--surface-2));box-shadow:inset 3px 0 0 var(--accent)}
.mail-row-top{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.mail-row-who{font-size:.88rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-row-date{font-size:.72rem;color:var(--ink-soft);flex:none;font-variant-numeric:tabular-nums}
.mail-row-subj{font-size:.86rem;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-row-snip{font-size:.78rem;color:var(--ink-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-row-chips{margin-top:4px}
.mail-row-from{display:flex;align-items:center;gap:7px;min-width:0;overflow:hidden}
/* Ungelesene Posteingangs-Mail: fette Kopfzeile + Akzent-Punkt, bis sie geöffnet wird */
.mail-row-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);flex:none}
.mail-row-unread .mail-row-who{font-weight:700;color:var(--ink)}
.mail-row-unread .mail-row-subj{font-weight:600;color:var(--ink)}
.mail-chip{display:inline-block;font-size:.64rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;border-radius:999px;padding:.28em .7em;border:1px solid var(--line);background:var(--surface-2);color:var(--ink-soft)}
.mail-chip.is24{background:var(--bronze-100,#EADFC7);border-color:var(--bronze-500);color:var(--bronze-600)}
.mail-chip.cust{background:var(--accent-soft,#E7EFEA);border-color:var(--accent);color:var(--accent-dark)}
.mail-chip.lead{background:var(--surface-2);border-color:var(--gold);color:var(--bronze-600)}
.mail-chip.as-btn{cursor:pointer;font:inherit;font-size:.64rem;font-weight:800}
.mail-reader{background:var(--surface);border:1px solid var(--line);border-radius:14px;min-height:320px;padding:18px 20px}
.mail-reader-hint{padding:40px 0;text-align:center}
.mail-msg-subj{font-family:var(--font-head);font-size:1.15rem;font-weight:700;margin-bottom:6px}
.mail-msg-meta{display:flex;flex-direction:column;gap:2px;font-size:.82rem;color:var(--ink-soft);margin-bottom:10px}
.mail-msg-chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.mail-msg-actions{display:flex;gap:8px;flex-wrap:wrap;padding-bottom:12px;border-bottom:1px solid var(--line);margin-bottom:14px}
.mail-body-text{white-space:pre-wrap;line-height:1.65;font-size:.94rem;overflow-wrap:anywhere}
.mail-body-html{line-height:1.6;font-size:.94rem;overflow-x:auto}
.mail-body-html img{max-width:100%}
/* Mail-Compose: Rich-Text-Editor + Toolbar + Kunden-Typeahead + Zitat */
.mail-compose{width:100%;box-sizing:border-box}
.mail-compose input,.mail-compose .mail-editor{max-width:100%;box-sizing:border-box}
.mail-editor img{max-width:100%;height:auto}
.mail-editor table{max-width:100%}
.mail-toolbar{flex-wrap:wrap}
.mail-atts{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.mail-att-chip{display:inline-flex;align-items:center;gap:6px;background:var(--surface-2);border:1px solid var(--line);border-radius:8px;padding:5px 8px 5px 10px;font-size:.8rem;max-width:100%}
.mail-att-chip .mail-att-sz{color:var(--ink-soft);font-size:.72rem}
.mail-att-chip button{border:none;background:transparent;color:var(--ink-soft);cursor:pointer;font-size:.9rem;line-height:1;padding:0 2px}
.mail-att-chip button:hover{color:var(--red)}
.mail-att-chip.ro{cursor:default}
/* Anhangsliste im Reader (gesendet/empfangen): Namen + Größe unter der Nachricht */
.mail-att-list{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.mail-att-lbl{font-size:.78rem;font-weight:600;color:var(--ink-soft);margin-bottom:8px}

/* „N neue – jetzt laden"-Pille (Live-Aktualisierung) oben in Leads/Kunden/Mail/Vorgängen */
.live-fresh{display:inline-flex;align-items:center;gap:9px;margin:0 0 14px;padding:7px 8px 7px 14px;border:1px solid var(--accent);background:var(--accent-soft);color:var(--accent);border-radius:999px;font:inherit;font-size:.85rem;font-weight:600;cursor:pointer;transition:background .12s,color .12s;animation:live-fresh-in .25s ease-out}
.live-fresh:hover{background:var(--accent);color:#fff}
.live-fresh-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);flex:none;animation:live-pulse 1.6s ease-in-out infinite}
.live-fresh:hover .live-fresh-dot{background:#fff}
.live-fresh-cta{padding:2px 9px;border-radius:999px;background:var(--accent);color:#fff;font-size:.78rem}
.live-fresh:hover .live-fresh-cta{background:rgba(255,255,255,.22)}
@keyframes live-fresh-in{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}
@keyframes live-pulse{0%,100%{opacity:1}50%{opacity:.35}}
@media(prefers-reduced-motion:reduce){.live-fresh,.live-fresh-dot{animation:none}}
.mail-toolbar{display:flex;gap:4px;align-items:center;margin:12px 0 0;padding:6px;background:var(--surface-2);border:1px solid var(--line);border-bottom:none;border-radius:10px 10px 0 0}
.mail-toolbar button{border:none;background:transparent;border-radius:7px;min-width:32px;padding:5px 9px;font:inherit;font-size:.82rem;color:var(--ink);cursor:pointer}
.mail-toolbar button:hover{background:var(--surface)}
.mail-tb-sep{width:1px;height:18px;background:var(--line);margin:0 4px}
.mail-editor{border:1.5px solid var(--line);border-radius:0 0 10px 10px;background:var(--surface);padding:14px 16px;min-height:240px;max-height:46vh;overflow-y:auto;font-size:.94rem;line-height:1.6}
.mail-editor:focus{outline:none;border-color:var(--accent)}
.mail-editor.sig{border-radius:0 0 10px 10px;min-height:110px;max-height:260px}
.mail-editor a{color:var(--accent-dark)}
.mail-quote{margin:14px 0 0;padding:10px 14px;border-left:3px solid var(--line);color:var(--ink-soft);font-size:.9em}
.mail-quote-head{color:var(--ink-soft);font-size:.85em;margin:0 0 6px}
.mail-to-wrap{position:relative}
.mail-to-sug{position:absolute;top:100%;left:0;right:0;z-index:40;background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 30px rgba(20,38,31,.16);overflow:hidden;margin-top:4px}
.mail-to-sug button{display:flex;flex-direction:column;gap:1px;width:100%;text-align:left;background:var(--surface);border:none;border-top:1px solid var(--line);padding:9px 12px;font:inherit;cursor:pointer}
.mail-to-sug button:first-child{border-top:none}
.mail-to-sug button:hover{background:var(--surface-2)}
.mail-to-sug button b{font-size:.88rem}
.mail-to-sug button span{font-size:.76rem;color:var(--ink-soft)}
.acc-mail-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.acc-mail-grid .sm{min-width:0}
@media(max-width:640px){.acc-mail-grid{grid-template-columns:1fr}}

/* Bronze = Akzentfarbe aller Exposé-Einstiege (Flavio-Vorgabe 21.07.2026) */
.btn.btn-slim.btn-bronze:hover:not(:disabled){box-shadow:none;transform:none}

/* ============ Exposé-Redesign (21.07.2026): Galerie wie Kalkulator + Sidebar + vollbreite Sektionen ============ */
.xv-hero{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px;align-items:start;margin:14px 0 6px}
.xv-hero-nogal{grid-template-columns:1fr}
.xv-hero-nogal .xv-aside{max-width:520px}
.xv-hero-noaside{grid-template-columns:1fr}
@media(max-width:860px){.xv-hero{grid-template-columns:1fr}}
/* Galerie (Muster Kalkulator: 1=Hero, 2=Split, 3+=Leitbild+Thumbs) */
.xv-gal{border-radius:16px;overflow:hidden}
.xv-gimg{position:relative;background:var(--surface-2);cursor:zoom-in;overflow:hidden}
/* Bilder absolut füllend: intrinsische Fotohöhen dürfen die Grid-Zeilen nie strecken
   (sonst hängen die Thumbnails unter dem Leitbild heraus) */
.xv-gimg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.xv-gimg:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
.xv-gimg-plan img{object-fit:contain;background:var(--surface)}
.xv-plan-tag{position:absolute;top:8px;left:8px;z-index:1;font-size:.62rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;background:rgba(20,38,31,.72);color:#fff;padding:.3em .7em;border-radius:999px}
.xv-g1 .xv-gimg{aspect-ratio:16/9}
.xv-g2{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.xv-g2 .xv-gimg{aspect-ratio:4/3}
.xv-glead{display:grid;grid-template-columns:2fr 1fr;gap:6px}
.xv-glead-main{aspect-ratio:4/3}
.xv-glead-rest{display:grid;grid-template-columns:1fr;grid-auto-rows:1fr;gap:6px;position:relative}
.xv-glead-rest .xv-gimg{min-height:0}
.xv-glead-rest:has(> :nth-child(3)){grid-template-columns:1fr 1fr}
/* Ungerade Thumb-Zahl (3 Zellen): erste Zelle über beide Spalten — sonst bleibt ein leeres Loch */
.xv-glead-rest:has(> :nth-child(3):last-child) > :first-child{grid-column:1/-1}
.xv-gmore-host{position:relative}
.xv-gmore{position:absolute;right:8px;bottom:8px;background:rgba(20,38,31,.78);color:#fff;font-size:.8rem;font-weight:700;padding:.3em .75em;border-radius:999px;pointer-events:none}
@media(max-width:640px){.xv-glead{grid-template-columns:1fr}.xv-glead-rest{grid-template-columns:1fr 1fr!important}.xv-glead-main{aspect-ratio:16/10}.xv-glead-rest .xv-gimg{aspect-ratio:4/3}}
/* Sidebar: Ansprechpartner-Karte (dunkel) + Eckdaten */
.xv-aside{display:flex;flex-direction:column;gap:14px}
/* Berater-Karte im PARTNER-BRANDING: bedient sich aus „Fazit-Hintergrund" (--verdict-*)
   und „Akzent" (--accent/--accent-ink/--accent-dark) des Instanz-Themes — bewusst NICHT
   aus der Hinweisfarbe (--gold). Eyebrow/Avatar hellen den Akzent auf der Dunkelfläche
   per color-mix auf, damit auch dunkle Akzentfarben lesbar bleiben. */
.xv-bcard{background:var(--verdict-bg);border-radius:16px;padding:20px;color:var(--verdict-ink-soft)}
.xv-bcard-eyebrow{font-size:.68rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:color-mix(in srgb,var(--accent) 55%,var(--verdict-ink));margin-bottom:12px}
.xv-bcard-row{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.xv-bavatar{flex:none;width:44px;height:44px;border-radius:50%;background:color-mix(in srgb,var(--accent) 22%,transparent);border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);color:color-mix(in srgb,var(--accent) 55%,var(--verdict-ink));display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.95rem;letter-spacing:.02em}
.xv-bcard-who{display:flex;flex-direction:column;min-width:0}
.xv-bcard-who b{color:var(--verdict-ink);font-size:1.02rem}
.xv-bcard-who span{color:var(--verdict-ink-soft);font-size:.82rem}
.xv-bbtn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;box-sizing:border-box;border-radius:11px;padding:11px 14px;font-weight:700;font-size:.92rem;text-decoration:none;margin-bottom:9px;transition:background .15s}
.xv-bbtn-gold{background:var(--accent);color:var(--accent-ink)}
.xv-bbtn-gold:hover{background:var(--accent-dark)}
.xv-bbtn-line{border:1px solid color-mix(in srgb,var(--verdict-ink) 28%,transparent);color:var(--verdict-ink);font-variant-numeric:tabular-nums}
.xv-bbtn-line:hover{background:color-mix(in srgb,var(--verdict-ink) 8%,transparent)}
.xv-bbtn:focus-visible{outline:2px solid var(--verdict-ink);outline-offset:2px}
.xv-bcard-note{font-size:.76rem;color:var(--verdict-ink-soft);text-align:center;margin-top:2px}
/* Eckdaten: vollbreite Leiste unter dem Hero */
.xv-eckw{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:16px 22px 14px;margin-top:14px}
.xv-eck-eyebrow{font-size:.68rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.xv-eckw-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px 26px}
.xv-eckw-cell{min-width:0}
.xv-eckw-cell span{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);margin-bottom:2px}
/* kein nowrap: lange Werte (z. B. mehrere Stellplatzarten) brechen um statt aus der Karte zu ragen */
.xv-eckw-cell b{font-size:1.02rem;color:var(--ink);font-weight:700;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.xv-eckw-big b{color:var(--accent-dark);font-size:1.15rem;font-weight:800}
/* Sektionen: große Überschriften, volle Breite */
.xv-sec{margin-top:34px}
.xv-h{font-family:var(--font-head);font-size:1.35rem;font-weight:700;color:var(--ink);margin:0 0 12px;letter-spacing:-.015em}
/* Miete: Kostenaufstellung mit hervorgehobener Warmmiete-Summe */
.xv-mcard{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px 22px 14px;max-width:480px}
.xv-mrow{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:9px 0;border-bottom:1px solid var(--line);font-size:.95rem}
.xv-mrow span{color:var(--ink-soft)}
.xv-mrow b{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
.xv-msum{border-bottom:none;border-top:2px solid var(--ink);margin-top:2px;padding-top:11px}
.xv-msum span{color:var(--ink);font-weight:700}
.xv-msum b{font-size:1.15rem;font-weight:800;color:var(--accent-dark)}
.xv-mrow:last-of-type{border-bottom:none}
.xv-mnote{font-size:.74rem;color:var(--ink-soft);margin-top:8px}
/* Energie-Karte mit großer Skala */
.xv-ecard{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px 22px}
.xv-esk{display:flex;gap:4px;margin-bottom:14px;max-width:440px}
.xv-esk i{flex:1 1 0;min-width:0;height:26px;border-radius:7px;font-style:normal;display:flex;align-items:center;justify-content:center;opacity:.55}
.xv-esk i span{color:#fff;font-weight:700;font-size:.7rem}
.xv-esk i.on{background:var(--surface)!important;border:2px solid var(--ink);opacity:1;transform:scale(1.18)}
.xv-esk i.on span{color:var(--ink);font-weight:800}
@media(max-width:640px){.xv-esk{max-width:100%}.xv-esk i{height:24px;border-radius:6px}}
/* Lightbox (identisch zur Kalkulator-Optik) */
.xv-lb{position:fixed;inset:0;z-index:2000;display:none;align-items:center;justify-content:center;background:rgba(26,22,18,.93);padding:24px}
.xv-lb.open{display:flex}
.xv-lb-fig{margin:0;display:flex;flex-direction:column;align-items:center;gap:12px}
.xv-lb-fig img{max-width:92vw;max-height:72vh;object-fit:contain;border-radius:10px;background:#fff;box-shadow:0 12px 48px rgba(0,0,0,.45)}
.xv-lb-cap{color:#fff;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;font-weight:700;opacity:.9}
.xv-lb-cap:empty{display:none}
.xv-lb-btn{background:rgba(255,255,255,.14);color:#fff;border:none;border-radius:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;transition:background .15s}
.xv-lb-btn:hover{background:rgba(255,255,255,.3)}
.xv-lb-btn:focus-visible{outline:2px solid #fff;outline-offset:2px}
.xv-lb-close{position:absolute;top:14px;right:14px;width:48px;height:48px;font-size:1.15rem;border-radius:999px;z-index:3}
/* Bedienleiste UNTER dem Bild: eigene, nie überlagerte Fläche — Buttons treffen immer (Mobil-Fix) */
.xv-lb-bar{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:14px;background:rgba(0,0,0,.45);border-radius:999px;padding:8px 12px;z-index:3}
.xv-lb-bar .xv-lb-btn{width:72px;height:48px;font-size:1.7rem}
.xv-lb-count{color:#fff;font-size:.9rem;font-variant-numeric:tabular-nums;min-width:56px;text-align:center;opacity:.9}


/* ================= Mail-Client (Redesign 22.07.2026, Referenz Mail (Redesign).dc.html) =================
   Eine Karte (Radius 16px oben), drei intern scrollende Spalten; Seite scrollt nie.
   Space Grotesk für Titel/Zahlen (tnum), Inter für UI-Text. Alle Farben als Token →
   Dark Mode über [data-theme="dark"]-Overrides; Mobil (<640px) eine Spalte mit Zurück-Pfeil. */
/* Token auf .mlc UND .mlc-modal (das Modal hängt via document.body außerhalb von .mlc) */
.mlc, .mlc-modal{
  --mc-card:#fff;         --mc-line:#E4E8E3;      --mc-line2:#EEF0ED;     --mc-ink:#14261F;
  --mc-text:#2A322D;      --mc-mut:#4A554E;       --mc-soft:#8A968E;      --mc-soft2:#6E7B74;
  --mc-bgsoft:#FAFBFA;    --mc-hover:#F1F3F0;     --mc-sel:#F1F4F0;       --mc-chipbg:#E7EAE6;
  --mc-btn:var(--accent);  --mc-btnfg:var(--accent-ink,#fff);        --mc-obd:#CBD3CC;       --mc-openbd:#E0E4DF;
  --mc-gold:#9A6E28;      --mc-goldbg:#F4EEE1;    --mc-goldbd:#E3D5B8;    --mc-bronze:#B0894A;
  --mc-lead:#2E6B47;      --mc-leadbd:#BFD4C6;    --mc-red:#C2483A;       --mc-quotebd:#D2D7D0;
  --mc-editor:#18211D;
}
.mlc{display:flex;flex-direction:column;height:calc(100vh - 92px);min-height:480px;font-family:'Inter',system-ui,sans-serif;color:var(--mc-editor)}
[data-theme="dark"] .mlc, [data-theme="dark"] .mlc-modal{
  --mc-card:#1E2220;      --mc-line:#292E2B;      --mc-line2:#242927;     --mc-ink:#ECEEED;
  --mc-text:#D7DCD9;      --mc-mut:#B8C2BC;       --mc-soft:#8A968E;      --mc-soft2:#9FB0A6;
  --mc-bgsoft:#191D1B;    --mc-hover:#242927;     --mc-sel:#17281E;       --mc-chipbg:#292E2B;
  --mc-btn:var(--accent);  --mc-btnfg:var(--accent-ink,#fff);        --mc-obd:#3A403C;       --mc-openbd:#353A37;
  --mc-gold:#CBA76A;      --mc-goldbg:#26211A;    --mc-goldbd:#3E362A;    --mc-bronze:#CBA76A;
  --mc-lead:#5AAE86;      --mc-leadbd:#2E5A44;    --mc-red:#E88A72;       --mc-quotebd:#3A403C;
  --mc-editor:#ECEEED
}
.mlc .mlc-mono{font-family:'Space Grotesk',system-ui,sans-serif;font-feature-settings:'tnum' 1}
.mlc-spacer{flex:1}
.mlc button{font-family:inherit;cursor:pointer}

/* Kopf (liegt auf dem App-Canvas → Theme-Variablen der Shell) */
.mlc-head{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding-bottom:18px}
.mlc-title{font-family:'Space Grotesk',system-ui,sans-serif;font-size:23px;font-weight:600;letter-spacing:-0.01em;margin:0;color:var(--ink)}
.mlc-sub{font-size:13px;color:var(--ink-soft);margin-top:2px}
.mlc-search{display:flex;align-items:center;gap:9px;background:var(--mc-card);border:1px solid var(--mc-line);border-radius:10px;padding:0 13px;height:40px;width:min(320px,100%)}
.mlc-search input{flex:1;border:none;outline:none;background:transparent;font-size:13.5px;color:var(--mc-editor);min-width:0;font-family:inherit}
.mlc-btn-outline{display:flex;align-items:center;gap:8px;height:40px;padding:0 16px;background:var(--mc-card);border:1px solid var(--mc-obd);border-radius:10px;font-size:13.5px;font-weight:600;color:var(--mc-ink);transition:border-color .15s}
.mlc-btn-outline:hover{border-color:var(--mc-ink)}
.mlc-btn-dark{display:flex;align-items:center;gap:8px;height:40px;padding:0 18px;background:var(--mc-btn);border:none;border-radius:10px;font-size:13.5px;font-weight:600;color:var(--mc-btnfg);transition:filter .15s}
.mlc-btn-dark:hover{filter:brightness(1.25)}
.mlc-btn-dark.sm,.mlc-btn-outline.sm{height:38px;padding:0 15px;font-size:13px}
.mlc-btn-accent{display:flex;align-items:center;gap:8px;padding:9px 18px;background:var(--mc-bronze);border:none;border-radius:9px;font-size:13px;font-weight:600;color:#fff;transition:filter .15s}
.mlc-btn-accent:hover{filter:brightness(1.07)}
[data-theme="dark"] .mlc-btn-accent{color:#14261F}

/* Karte + Spalten */
.mlc-card{flex:1;min-height:0;display:grid;grid-template-columns:196px 350px minmax(420px,1fr);background:var(--mc-card);border:1px solid var(--mc-line);border-radius:16px 16px 0 0;box-shadow:0 1px 2px rgba(20,38,31,0.04);overflow:hidden}
.mlc-rail{border-right:1px solid var(--mc-line2);padding:14px 10px;display:flex;flex-direction:column;gap:1px;background:var(--mc-bgsoft);overflow-y:auto}
.mlc-folder{display:flex;align-items:center;gap:10px;width:100%;padding:9px 11px;border:none;border-radius:9px;background:transparent;color:var(--mc-mut);font-size:13.5px;font-weight:500;text-align:left;transition:background .12s}
.mlc-folder:hover{background:var(--mc-hover)}
.mlc-folder.on{background:var(--mc-btn);color:var(--mc-btnfg);font-weight:600}
.mlc-folder.on:hover{background:var(--mc-btn)}
.mlc-fico{width:17px;height:17px;flex:none;display:flex;align-items:center;justify-content:center}
.mlc-flabel{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mlc-fbadge{font-size:11.5px;font-weight:700;color:#14261F;background:#CBA76A;padding:1px 8px;border-radius:99px;flex:none}
.mlc-railsep{height:1px;background:var(--mc-line);margin:12px 6px;flex:none}
.mlc-railtk{font-size:11px;font-weight:600;letter-spacing:0.09em;text-transform:uppercase;color:var(--mc-soft);padding:0 11px 8px;flex:none}
.mlc-source{display:flex;align-items:center;gap:10px;width:100%;padding:8px 11px;border:none;border-radius:9px;background:transparent;color:var(--mc-mut);font-size:13px;text-align:left;transition:background .12s}
.mlc-source:hover{background:var(--mc-hover)}
.mlc-source.on{background:var(--mc-chipbg)}
.mlc-sdot{width:8px;height:8px;flex:none;border-radius:2px}
.mlc-scount{flex:none!important;font-size:11.5px;color:var(--mc-soft)}

/* Liste */
.mlc-listcol{border-right:1px solid var(--mc-line2);display:flex;flex-direction:column;min-height:0;min-width:0}
.mlc-listhead{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--mc-line2);flex:none}
.mlc-chip{font-size:12px;font-weight:600;color:var(--mc-mut);background:var(--mc-card);border:1px solid var(--mc-obd);border-radius:99px;padding:5px 12px;transition:border-color .12s}
.mlc-chip:hover{border-color:var(--mc-ink)}
.mlc-chip.on{color:var(--mc-btnfg);background:var(--mc-btn);border-color:var(--mc-btn)}
.mlc-viewtoggle{width:30px;height:28px;display:flex;align-items:center;justify-content:center;background:var(--mc-card);border:1px solid var(--mc-obd);border-radius:8px;color:var(--mc-mut);transition:border-color .12s,color .12s;flex:none}
.mlc-viewtoggle:hover{border-color:var(--mc-ink);color:var(--mc-ink)}
.mlc-count{font-size:12px;color:var(--mc-soft)}
.mlc-list{flex:1;overflow-y:auto;min-height:0}
.mlc-newbanner{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:10px 16px;background:var(--mc-goldbg);border:none;border-bottom:1px solid var(--mc-goldbd);font-size:12.5px;font-weight:600;color:var(--mc-gold);transition:filter .12s}
.mlc-newbanner:hover{filter:brightness(0.97)}
.mlc-thread{position:relative;padding:13px 16px 13px 20px;border-bottom:1px solid var(--mc-line2);cursor:pointer;background:var(--mc-card);transition:background .12s}
.mlc-thread:hover{background:var(--mc-bgsoft)}
.mlc-thread.sel{background:var(--mc-sel)}
.mlc-thread.sel::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--mc-btn)}
.mlc-t-top{display:flex;align-items:center;gap:9px;min-width:0}
.mlc-t-dot{width:8px;height:8px;flex:none;border-radius:99px;background:transparent}
.mlc-thread.unread .mlc-t-dot{background:var(--mc-bronze)}
.mlc-t-sender{flex:1;min-width:0;font-size:13.5px;font-weight:500;color:var(--mc-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mlc-thread.unread .mlc-t-sender{font-weight:700}
.mlc-t-count{font-size:11px;font-weight:600;color:var(--mc-soft2);background:var(--mc-chipbg);padding:1px 7px;border-radius:99px;flex:none}
.mlc-t-time{font-size:12px;color:var(--mc-soft);flex:none}
.mlc-t-subj{font-size:13px;font-weight:450;color:var(--mc-text);margin:5px 0 3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mlc-thread.unread .mlc-t-subj{font-weight:600}
.mlc-t-bottom{display:flex;align-items:center;gap:8px;min-width:0}
.mlc-t-preview{flex:1;min-width:0;font-size:12.5px;color:var(--mc-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mlc-pill-lead{flex:none;font-size:10.5px;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;color:var(--mc-lead);border:1px solid var(--mc-leadbd);border-radius:99px;padding:2px 8px}
.mlc-pill-src{flex:none;font-size:10.5px;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;color:var(--mc-gold);border:1px solid var(--mc-goldbd);border-radius:99px;padding:2px 8px}
.mlc-listempty{padding:48px 24px;text-align:center;color:var(--mc-soft);font-size:13.5px}

/* Lesebereich */
.mlc-read{display:flex;flex-direction:column;min-height:0;min-width:0}
.mlc-nothread{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;color:var(--mc-soft);font-size:14px}
.mlc-thead{display:flex;align-items:flex-start;gap:14px;padding:18px 24px 14px;border-bottom:1px solid var(--mc-line2);flex:none}
.mlc-back{display:none;width:38px;height:38px;flex:none;align-items:center;justify-content:center;background:var(--mc-card);border:1px solid var(--mc-line);border-radius:10px;color:var(--mc-mut)}
.mlc-thead-main{flex:1;min-width:0}
.mlc-tsubj{font-family:'Space Grotesk',system-ui,sans-serif;font-size:19px;font-weight:600;letter-spacing:-0.01em;color:var(--mc-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mlc-tmeta{display:flex;align-items:center;gap:10px;margin-top:6px;flex-wrap:wrap}
.mlc-tmeta .mlc-mono{font-size:12.5px;color:var(--mc-soft2)}
.mlc-leadlink{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--mc-lead);background:var(--mc-card);border:1px solid var(--mc-leadbd);border-radius:99px;padding:3px 11px;white-space:nowrap;transition:border-color .12s}
.mlc-leadlink:hover{border-color:var(--mc-lead)}
.mlc-adopt{font-size:12px;font-weight:600;color:var(--mc-ink);background:var(--mc-card);border:1px solid var(--mc-obd);border-radius:99px;padding:3px 11px;transition:border-color .12s}
.mlc-adopt:hover{border-color:var(--mc-ink)}
.mlc-thead-actions{display:flex;gap:8px;flex:none}
.mlc-icon-del{width:38px;height:38px;display:flex;align-items:center;justify-content:center;background:var(--mc-card);border:1px solid var(--mc-line);border-radius:10px;color:var(--mc-mut);transition:border-color .12s,color .12s}
.mlc-icon-del:hover{border-color:var(--mc-red);color:var(--mc-red)}
.mlc-msgs{flex:1;overflow-y:auto;padding:18px 24px 24px;display:flex;flex-direction:column;gap:12px;min-height:0}
.mlc-msg{flex:none;border:1px solid var(--mc-line2);border-radius:14px;background:var(--mc-card);overflow:hidden}
.mlc-msg.open{border-color:var(--mc-openbd)}
.mlc-msg.own{background:var(--mc-bgsoft)}
.mlc-msg-head{display:flex;align-items:center;gap:12px;padding:13px 18px;cursor:pointer}
.mlc-av{width:34px;height:34px;flex:none;border-radius:99px;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center}
.mlc-msg-who{flex:1;min-width:0}
.mlc-msg-namerow{display:flex;align-items:baseline;gap:8px;min-width:0}
.mlc-msg-name{font-size:13.5px;font-weight:600;color:var(--mc-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:none;max-width:60%}
.mlc-msg-addr{font-size:12px;color:var(--mc-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.mlc-msg-meta{font-size:12px;color:var(--mc-soft);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mlc-msg-time{font-size:12px;color:var(--mc-soft);flex:none}
.mlc-chev{flex:none;transition:transform .15s}
.mlc-msg.open .mlc-chev{transform:rotate(180deg)}
.mlc-msg-body{padding:2px 18px 18px 64px;min-width:0}
.mlc-msg-text{font-size:14px;line-height:1.65;color:var(--mc-text);overflow-wrap:anywhere}
.mlc-msg-text img{max-width:100%;height:auto}
.mlc-msg-text table{max-width:100%}
.mlc-quotechip{display:inline-flex;align-items:center;gap:7px;margin-top:12px;background:var(--mc-hover);border:none;border-radius:99px;color:var(--mc-soft2);font-size:11.5px;font-weight:600;padding:5px 12px;transition:background .12s}
.mlc-quotechip:hover{background:var(--mc-chipbg)}
.mlc-quote{margin-top:12px;padding:12px 16px;border:1px dashed var(--mc-quotebd);border-radius:10px;font-size:13px;line-height:1.6;color:var(--mc-soft2)}
.mlc-atts{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.mlc-att{display:inline-flex;align-items:center;gap:9px;border:1px solid var(--mc-line);border-radius:10px;padding:8px 13px;background:var(--mc-card);transition:border-color .12s;text-decoration:none}
.mlc-att:hover{border-color:var(--mc-ink)}
.mlc-att-n{font-size:12.5px;font-weight:600;color:var(--mc-ink)}
.mlc-att-s{font-size:11px;color:var(--mc-soft)}

/* Antwort-Editor (untere Leiste erscheint NUR geöffnet; Buttons sitzen im Thread-Kopf) */
.mlc-replybar{border-top:1px solid var(--mc-line2);padding:14px 24px 18px;background:var(--mc-bgsoft);flex:none}
.mlc-replybar.hidden{display:none}
.mlc-replybox{border:1px solid var(--mc-obd);border-radius:14px;background:var(--mc-card);overflow:hidden}
.mlc-reply-head{display:flex;align-items:center;gap:8px;padding:10px 16px;border-bottom:1px solid var(--mc-line2);font-size:12.5px;color:var(--mc-soft2)}
.mlc-reply-head b{font-weight:600;color:var(--mc-ink)}
.mlc-reply-head button{background:none;border:none;color:var(--mc-soft);font-size:16px;line-height:1;padding:2px 4px}
.mlc-reply-head button:hover{color:var(--mc-ink)}
.mlc-fmtbar{display:flex;align-items:center;gap:2px;padding:6px 12px;border-bottom:1px solid var(--mc-line2)}
.mlc-fmtbar button{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:none;border:none;border-radius:7px;color:var(--mc-mut);transition:background .12s}
.mlc-fmtbar button:hover{background:var(--mc-hover)}
.mlc-fmtsep{width:1px;height:16px;background:var(--mc-line);margin:0 6px}
.mlc-editor{min-height:96px;max-height:38vh;overflow-y:auto;padding:14px 16px;font-size:14px;line-height:1.6;color:var(--mc-editor);outline:none}
.mlc-editor.tall{min-height:180px}
.mlc-editor:empty::before{content:"Ihre Antwort …";color:var(--mc-soft)}
.mlc-editor.tall:empty::before{content:"Nachricht …"}
.mlc-reply-foot{display:flex;align-items:center;gap:10px;padding:10px 14px;border-top:1px solid var(--mc-line2);flex-wrap:wrap}
.mlc-attbtn{width:34px;height:34px;display:flex;align-items:center;justify-content:center;background:var(--mc-hover);border:none;border-radius:9px;color:var(--mc-mut);transition:background .12s}
.mlc-attbtn:hover{background:var(--mc-chipbg)}
.mlc-sighint{font-size:12px;color:var(--mc-soft)}
.mlc-attchips{display:inline-flex;gap:6px;flex-wrap:wrap;min-width:0}
.mlc-attchip{display:inline-flex;align-items:center;gap:6px;background:var(--mc-hover);border-radius:8px;padding:4px 9px;font-size:12px;color:var(--mc-ink)}
.mlc-attchip .mlc-mono{font-size:11px;color:var(--mc-soft)}
.mlc-attchip button{border:none;background:none;color:var(--mc-soft);padding:0 2px;font-size:13px}
.mlc-attchip button:hover{color:var(--mc-red)}

/* Compose-Modal */
.mlc-overlay{position:fixed;inset:0;background:rgba(20,38,31,0.4);z-index:40;animation:mlcFade .15s ease}
[data-theme="dark"] .mlc-overlay{background:rgba(0,0,0,0.55)}
.mlc-modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(640px,calc(100vw - 40px));max-height:calc(100vh - 48px);display:flex;flex-direction:column;background:var(--mc-card,#fff);border-radius:18px;box-shadow:0 24px 64px rgba(20,38,31,0.28);z-index:41;animation:mlcModIn .18s ease;overflow:hidden;font-family:'Inter',system-ui,sans-serif}
.mlc-modal-head{display:flex;align-items:center;gap:12px;padding:16px 22px;background:#14261F;color:#fff;flex:none}
.mlc-modal-head span{font-family:'Space Grotesk',system-ui,sans-serif;font-size:15.5px;font-weight:600}
.mlc-modal-head button{background:rgba(255,255,255,0.1);border:none;border-radius:8px;color:#E4EBE6;width:28px;height:28px;font-size:15px;line-height:1}
.mlc-modal-head button:hover{background:rgba(255,255,255,0.2)}
.mlc-modal-body{padding:6px 22px 0;overflow-y:auto;min-height:0}
.mlc-field{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--mc-line2,#EEF0ED);padding:11px 0;position:relative}
.mlc-field>span{font-size:12.5px;color:var(--mc-soft,#8A968E);width:56px;flex:none}
.mlc-field input{flex:1;border:none;outline:none;font-size:13.5px;font-family:inherit;min-width:0;background:transparent;color:var(--mc-editor,#18211D)}
.mlc-field input#mlcCmpSubj{font-weight:600}
.mlc-modal .mlc-fmtbar{padding:8px 0}
.mlc-modal .mlc-editor{padding:14px 0}
.mlc-modal-foot{display:flex;align-items:center;gap:10px;padding:12px 22px 18px;flex:none;flex-wrap:wrap}
.mlc-modal-foot .mlc-btn-accent{padding:10px 20px;border-radius:10px;font-size:13.5px}
.mlc-modal-foot .mlc-attbtn{width:38px;height:38px;border-radius:10px}
.mlc-draftbtn{padding:10px 16px;background:none;border:none;font-size:13px;font-weight:600;color:var(--mc-soft2,#6E7B74)}
.mlc-draftbtn:hover{color:var(--mc-ink,#14261F)}
.mlc-sug{position:absolute;top:100%;left:56px;right:0;z-index:50;background:var(--mc-card,#fff);border:1px solid var(--mc-line,#E4E8E3);border-radius:10px;box-shadow:0 10px 30px rgba(20,38,31,.16);overflow:hidden;margin-top:2px}
.mlc-sug button{display:flex;flex-direction:column;gap:1px;width:100%;text-align:left;background:transparent;border:none;border-top:1px solid var(--mc-line2,#EEF0ED);padding:9px 12px;font-family:inherit;color:inherit}
.mlc-sug button:first-child{border-top:none}
.mlc-sug button:hover{background:var(--mc-bgsoft,#FAFBFA)}
.mlc-sug button b{font-size:13px}
.mlc-sug button span{font-size:12px;color:var(--mc-soft,#8A968E)}
/* Modal liegt außerhalb von .mlc → Token dort separat setzen */
[data-theme="dark"] .mlc-modal{--mc-card:#1E2220;--mc-line:#292E2B;--mc-line2:#242927;--mc-ink:#ECEEED;--mc-mut:#B8C2BC;--mc-soft:#8A968E;--mc-soft2:#9FB0A6;--mc-bgsoft:#191D1B;--mc-hover:#242927;--mc-chipbg:#292E2B;--mc-editor:#ECEEED;--mc-red:#E88A72;--mc-bronze:#CBA76A}
.mlc-modal .mlc-fmtbar{border-bottom:1px solid var(--mc-line2,#EEF0ED)}
@keyframes mlcFade{from{opacity:0}to{opacity:1}}
@keyframes mlcModIn{from{transform:translate(-50%,-46%);opacity:0}to{transform:translate(-50%,-50%);opacity:1}}

/* Responsiv: <1280 Rail nur Icons (56px) · <900 Liste schmaler · <640 EINE Spalte (Liste ODER Lesebereich) */
@media(max-width:1279px){
  .mlc-card{grid-template-columns:56px 310px minmax(360px,1fr)}
  .mlc-rail{padding:14px 8px}
  .mlc-rail .mlc-flabel,.mlc-rail .mlc-fbadge,.mlc-rail .mlc-scount,.mlc-railtk{display:none}
  /* Quellen (reine Farbpunkte ohne Label) + Trennlinie ergeben in der Icon-Rail keinen Sinn → ausblenden */
  .mlc-source,.mlc-railsep{display:none}
  .mlc-folder{justify-content:center}
}
@media(max-width:899px){
  .mlc-card{grid-template-columns:56px minmax(240px,300px) minmax(320px,1fr)}
}
@media(max-width:639px){
  .mlc{height:auto;min-height:calc(100vh - 92px)}
  .mlc-card{display:flex;flex-direction:column;min-height:60vh}
  /* Rail wird zur horizontalen Icon-Leiste über der Liste */
  .mlc-rail{flex-direction:row;align-items:center;gap:4px;padding:8px 10px;border-right:none;border-bottom:1px solid var(--mc-line2);overflow-y:visible;overflow-x:auto}
  .mlc-folder,.mlc-source{width:auto;flex:none;padding:8px 10px}
  .mlc-railsep{width:1px;height:20px;margin:0 6px;flex:none}
  .mlc-listcol{border-right:none;flex:1;min-height:0}
  .mlc-read{flex:1;min-height:0}
  /* Eine Spalte: ohne Auswahl nur die Liste, mit Auswahl nur der Lesebereich (+ Zurück-Pfeil) */
  .mlc-card:not(.has-thread) .mlc-read{display:none}
  .mlc-card.has-thread .mlc-rail,.mlc-card.has-thread .mlc-listcol{display:none}
  .mlc-back{display:flex}
  /* Kopf-Buttons nur als Icons */
  .mlc-thead{padding:14px 16px 12px}
  .mlc-thead-actions .mlc-btn-dark.sm,.mlc-thead-actions .mlc-btn-outline.sm{width:38px;padding:0;justify-content:center}
  .mlc-thead-actions .mlc-btnlbl{display:none}
  .mlc-msgs{padding:14px 16px 18px}
  .mlc-msg-body{padding-left:18px}
  .mlc-replybar{padding:12px 16px 14px}
}
/* =========================================================================
   KUNDENAKTE — Vollseiten-Kundenprofil (crm-customers.js → #kundeDetailView)
   Pixelnah nach Vorlage „Kundenprofil Standalone": kompakter Kopf (Avatar 52,
   Name 23px inline), Text-Toolbar (38px, Primaer = Tannengruen var(--accent)), Tabs
   13.5px mit Bronze-Zähler, Chips 12px, Suche rechts, Karten 1px-Rahmen.
   Dark Mode über var(); Mobil <640 = gestapelte Variante mit Icon-Buttons.
   ========================================================================= */
#viewKunden.kunde-open > *:not(#kundeDetailView){display:none!important}
/* Die Akte nutzt die Bildschirmbreite wie die Objektseite — Reiter, Tabellen und vor allem die
   Dokumentenmappe (Liste + Vorschau) gewinnen dabei spürbar. Was GELESEN wird, bekommt trotzdem
   seine Spaltenbreite: eine Zeitleiste über 1600 px wäre zwar breit, aber schlecht lesbar. */
#kundeDetailView{max-width:none}
.ak-timeline,.ak-composer{max-width:1200px}
/* Kopf: ‹ Kunden · Avatar · Name+Badge / Subline */
.ak-top{display:flex;align-items:center;gap:16px;margin:2px 0 16px}
.ak-back{padding:.42em .75em;flex:none}
.ak-avatar{width:52px;height:52px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-family:'Space Grotesk',system-ui,sans-serif;font-weight:600;font-size:1.2rem;flex:none}
.ak-id{min-width:0}
.ak-headline{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ak-name{font-family:'Space Grotesk',system-ui,sans-serif;font-weight:600;font-size:1.44rem;letter-spacing:-.015em;margin:0;color:var(--ink);line-height:1.25}
.ak-subline{color:var(--ink-soft);font-size:.88rem;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Toolbar: Text-Buttons (Vorlage), Primär = dunkelgrün */
.ak-toolbar{display:flex;align-items:center;gap:9px;margin-bottom:16px;flex-wrap:wrap}
.btn-akx{height:38px;display:inline-flex;align-items:center;gap:7px;padding:0 15px;border-radius:10px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);font:600 .88rem/1 Inter,system-ui,sans-serif;cursor:pointer;
  transition:color var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out),background-color var(--dur-fast) var(--ease-out),box-shadow var(--dur-base) var(--ease-out),transform var(--dur-press) var(--ease-spring)}
.btn-akx:hover{border-color:var(--accent);color:var(--accent-dark);box-shadow:var(--shadow-sm)}
.btn-akx:active{transform:scale(.96)}
/* [hidden] muss auch hier greifen: display:inline-flex oben schlägt sonst die Browser-Regel
   [hidden]{display:none} — der Knopf blieb sichtbar, obwohl das JS ihn ausgeblendet hatte. */
.btn-akx[hidden]{display:none}
.btn-akx.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn-akx.primary:hover{background:var(--accent-dark);border-color:var(--accent-dark);color:#fff}
.btn-ak{width:38px;height:38px;border-radius:10px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink-soft);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0;
  transition:color var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out),box-shadow var(--dur-base) var(--ease-out),transform var(--dur-press) var(--ease-spring)}
.btn-ak:hover{color:var(--accent-dark);border-color:var(--accent);box-shadow:var(--shadow-sm)}
.btn-ak:active{transform:scale(.9)}
.ak-tb-sep{width:1px;height:24px;background:var(--line);margin:0 3px}
/* Aktenreiter (wie Vorlage): aktiver Tab = weisser Reiter mit Rahmen oben/seitlich,
   Radius 11px oben, OHNE Unterkante — verschmilzt mit dem hellen Bogen darunter. */
.ak-tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:0;overflow-x:auto;scrollbar-width:none}
.ak-tabs::-webkit-scrollbar{display:none}
.ak-tab{appearance:none;background:none;border:1px solid transparent;border-bottom:none;border-radius:11px 11px 0 0;margin-bottom:-1px;position:relative;padding:10px 18px;font:600 .85rem/1.2 Inter,system-ui,sans-serif;color:var(--ink-soft);cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:6px;transition:color var(--dur-fast) var(--ease-out),background-color var(--dur-fast) var(--ease-out)}
/* Reiter-Icon (Ankündigungen): folgt der Textfarbe, im aktiven Reiter also automatisch kräftiger. */
.ak-tab-ico{flex:none;opacity:.85}
.ak-tab.on .ak-tab-ico{opacity:1}
.ak-tab:hover{color:var(--ink)}
.ak-tab.on{background:var(--surface);border-color:var(--line);color:var(--ink)}
.ak-tabn{font-size:.78rem;color:var(--ink-faint);font-weight:600;font-variant-numeric:tabular-nums}
.ak-tab.on .ak-tabn{color:var(--bronze-600)}
/* Reiter „Beratungsstand": hebt sich von den eigenen Daten ab, weil er keine enthält — hier wird
   live beim Partner gelesen. Der Punkt pulst ruhig; bei prefers-reduced-motion steht er still. */
@keyframes akLivePulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.7)}}
.ak-tab.is-live{color:var(--accent-dark)}
.ak-tab.is-live:hover{color:var(--accent-dark)}
.ak-tab.is-live.on{background:var(--accent-soft,var(--surface));border-color:var(--accent)}
.ak-tablive{display:inline-flex;align-items:center;gap:5px;font-size:.6rem;font-weight:800;letter-spacing:.09em;
  text-transform:uppercase;color:var(--accent-dark);border:1px solid var(--accent);border-radius:var(--r-pill);padding:.15em .5em}
.ak-tablive::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent);animation:akLivePulse 2.4s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.ak-tablive::before{animation:none}}
/* Der helle Bogen: Tab-Inhalt liegt auf einer Surface-Flaeche (Akten-Anmutung) */
.ak-body{background:var(--surface);border:1px solid var(--line);border-top:none;border-radius:0 0 13px 13px;box-shadow:0 1px 2px rgba(20,38,31,.04);padding:18px 24px 26px}
/* Filter-Chips (12px) + Suche rechts (280px) */
.ak-filters{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin-bottom:14px}
.ak-chip{appearance:none;border:1px solid var(--line);background:var(--surface);color:var(--ink-soft);border-radius:99px;padding:5px 13px;font:600 .75rem/1.4 Inter,system-ui,sans-serif;cursor:pointer;
  transition:background-color var(--dur-fast) var(--ease-out),color var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out),transform var(--dur-press) var(--ease-spring)}
.ak-chip:hover{border-color:var(--accent);color:var(--accent-dark)}
.ak-chip:active{transform:scale(.94)}
.ak-chip.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.ak-search{margin-left:auto;width:280px;min-width:170px;display:flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:0 11px;color:var(--ink-faint)}
.ak-search input{flex:1;min-width:0;border:none;background:none;outline:none;font:inherit;font-size:.8rem;color:var(--ink);padding:8px 0}
.ak-search:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--om-accent-glow)}
/* Notiz-Composer */
.ak-composer{display:flex;align-items:flex-start;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:9px 11px;margin-bottom:20px}
.ak-composer-av{width:32px;height:32px;border-radius:50%;background:var(--bronze-500);color:var(--bronze-ink);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.76rem;flex:none}
.ak-composer textarea{flex:1;border:none;background:none;outline:none;resize:none;font:inherit;font-size:.88rem;color:var(--ink);padding:7px 0;min-height:20px;line-height:1.5}
.ak-composer-clip{appearance:none;border:none;background:none;color:var(--ink-soft);cursor:pointer;padding:8px;border-radius:9px;flex:none;align-self:center;display:inline-flex}
.ak-composer-clip svg{width:20px;height:20px}
.ak-composer-clip:hover{color:var(--accent);background:var(--accent-soft)}
.ak-composer .btn{align-self:center}
/* Anhang am Notiz-Composer: gestagte Datei + Fortschritt */
.ak-composer-wrap{margin-bottom:20px}
.ak-composer-wrap .ak-composer{margin-bottom:0}
.ak-attstage{display:flex;flex-direction:column;gap:7px;padding:8px 12px 0 54px}
.ak-fchip{display:inline-flex;align-items:center;gap:7px;max-width:100%;border:1px solid var(--line);background:var(--bg);border-radius:9px;padding:6px 10px;font-size:.82rem;color:var(--ink);text-decoration:none}
.ak-fchip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.ak-fchip i{font-style:normal;color:var(--ink-faint);flex:none}
.ak-fchip:hover{border-color:var(--accent)}
.ak-fchip button{appearance:none;border:none;background:none;color:var(--ink-faint);cursor:pointer;font-size:1rem;padding:0 2px;flex:none}
.ak-fchip button:hover{color:var(--red)}
.ak-prog{height:5px;border-radius:99px;background:var(--line);overflow:hidden}
.ak-prog i{display:block;height:100%;width:0;background:var(--accent);border-radius:99px;transition:width var(--dur-fast) var(--ease-out)}
.ak-note-files{display:flex;flex-wrap:wrap;gap:7px;padding:0 14px 10px}
.ak-more{display:flex;justify-content:center;padding:10px 0 4px}
/* Timeline */
.ak-daygroup{font-size:.72rem;font-weight:700;letter-spacing:.08em;color:var(--ink-faint);text-transform:uppercase;margin:22px 0 12px}
.ak-daygroup:first-child{margin-top:0}
.ak-entry{display:grid;grid-template-columns:36px 1fr;gap:14px;position:relative;padding-bottom:14px}
.ak-entry::before{content:"";position:absolute;left:17px;top:36px;bottom:-2px;width:1.5px;background:var(--line)}
.ak-entry:last-child::before{display:none}
.ak-ico{width:35px;height:35px;border-radius:50%;border:1.5px solid var(--line);background:var(--surface);color:var(--ink-soft);display:flex;align-items:center;justify-content:center;flex:none;z-index:1}
.ak-mail>.ak-ico{border-color:var(--accent);color:var(--accent)}
.ak-note>.ak-ico{border-color:var(--bronze-500);color:var(--bronze-600)}
/* Mail-/Notiz-Karten: 1px-Rahmen wie Vorlage */
.ak-card{background:var(--surface);border:1px solid var(--line);border-radius:13px;overflow:hidden}
.ak-mhead{width:100%;display:flex;align-items:center;gap:9px;flex-wrap:wrap;padding:11px 14px;background:none;border:none;font:inherit;text-align:left;cursor:pointer}
.ak-mhead:hover{background:var(--bg)}
.ak-mfrom{font-weight:700;color:var(--ink);font-size:.88rem;flex:none}
.ak-msubj{flex:1;min-width:0;color:var(--ink-soft);font-size:.86rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ak-mbadge{font-size:.62rem;font-weight:700;letter-spacing:.05em;padding:3px 8px;border-radius:6px;flex:none}
.ak-mbadge.in{background:var(--accent-soft);color:var(--accent-dark)}
.ak-mbadge.out{background:#EADFC7;color:#8A6417}
[data-theme="dark"] .ak-mbadge.out{background:rgba(203,167,106,.18);color:var(--bronze-500)}
.ak-matt{display:inline-flex;align-items:center;gap:2px;font-size:.76rem;color:var(--ink-faint);font-weight:600;flex:none}
.ak-time{font-size:.78rem;color:var(--ink-faint);font-variant-numeric:tabular-nums;white-space:nowrap;flex:none}
.ak-mbody{padding:0 14px 13px;border-top:1px solid var(--line)}
.ak-mtext{font-size:.9rem;line-height:1.65;color:var(--ink);padding:12px 0;word-break:break-word}
.ak-mtext img{max-width:100%;height:auto}
/* Antwort-Editor: FMT-Leiste + Rich-Text + Senden · Mail-Client rechts */
.ak-reply{border-top:1px solid var(--line);padding-top:10px}
.ak-fmtbar{display:flex;gap:2px;margin-bottom:7px}
.ak-fmtbar button{appearance:none;border:none;background:none;width:28px;height:26px;border-radius:7px;color:var(--ink-soft);font-size:.82rem;cursor:pointer}
.ak-fmtbar button:hover{background:var(--bg);color:var(--ink)}
.ak-reply-ed{min-height:44px;border:1px solid var(--line);border-radius:10px;background:var(--bg);font-size:.9rem;line-height:1.55;color:var(--ink);padding:9px 11px;outline:none}
.ak-reply-ed:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--om-accent-glow)}
.ak-reply-ed:empty::before{content:attr(data-ph);color:var(--ink-faint);pointer-events:none}
.ak-reply-act{display:flex;align-items:center;gap:14px;margin-top:9px}
.ak-reply-act .ak-openmail{margin-left:auto}
.ak-link{appearance:none;background:none;border:none;color:var(--accent-dark);font:600 .82rem Inter,system-ui,sans-serif;cursor:pointer;display:inline-flex;align-items:center;gap:4px;padding:0}
.ak-link:hover{text-decoration:underline}
/* Zeilen-Einträge */
.ak-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-top:7px;min-height:35px}
.ak-line-t{font-size:.88rem;color:var(--ink);font-weight:500}
.ak-line-sub{font-size:.8rem;color:var(--ink-faint)}
.ak-line .ak-time{margin-left:auto}
.ak-due{font-size:.68rem;font-weight:700;letter-spacing:.04em;background:var(--accent-soft);color:var(--accent-dark);padding:2px 8px;border-radius:6px}
.ak-task .ak-task-btn{margin-left:auto}
.ak-task-btn{appearance:none;border:1.5px solid var(--line);background:var(--surface);color:var(--ink-soft);border-radius:9px;padding:6px 14px;font:600 .8rem Inter,system-ui,sans-serif;cursor:pointer;transition:all var(--dur-fast) var(--ease-out)}
.ak-task-btn:hover{border-color:var(--accent);color:var(--accent-dark)}
.ak-task.done .ak-line-t{color:var(--ink-faint);text-decoration:line-through}
.ak-task.done>.ak-ico{border-color:var(--accent);background:var(--accent);color:#fff}
.ak-notecard{max-width:820px}
.ak-note-body{padding:11px 14px;font-size:.9rem;line-height:1.6;color:var(--ink);word-break:break-word}
.ak-note-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 14px 10px;font-size:.78rem;color:var(--ink-faint)}
.ak-dl{color:var(--accent-dark);font-weight:600;text-decoration:none;font-size:.88rem}
.ak-dl:hover{text-decoration:underline}
.ak-empty{color:var(--ink-faint);font-size:.9rem;padding:26px 4px;text-align:center}
/* Dateien-Tab: Anhang-Chips im Notiz-Composer (die Mappe selbst steht weiter unten) */
.ak-dropzone{border:1.5px dashed var(--line);border-radius:13px;padding:24px;text-align:center;color:var(--ink-soft);font-size:.9rem;margin-bottom:16px;transition:border-color var(--dur-fast) var(--ease-out),background-color var(--dur-fast) var(--ease-out)}
.ak-dropzone.over{border-color:var(--accent);background:var(--accent-soft)}
.ak-fsub{font-size:.78rem;color:var(--ink-faint)}

/* --- Dokumentenmappe: links die Blätter, rechts das aufgeschlagene Dokument ---------------
   Feste Höhe statt mitwachsend: Die Vorschau braucht eine Fläche, die man ohne Scrollen der
   Seite lesen kann — und die Liste daneben soll dabei stehen bleiben, nicht mitwandern. */
.dok{display:grid;grid-template-columns:minmax(230px,300px) minmax(0,1fr);gap:16px;
  height:min(72vh,720px);min-height:420px}
.dok-side{position:relative;display:flex;flex-direction:column;min-height:0;
  background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.dok-bar{display:flex;align-items:center;gap:10px;padding:11px 12px;border-bottom:1px solid var(--line)}
.dok-count{margin-left:auto;font-size:.78rem;color:var(--ink-faint);white-space:nowrap}
.dok-items{flex:1;min-height:0;overflow:auto;padding:6px}
.dok-item{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border-radius:10px;
  cursor:pointer;border:1px solid transparent;background:transparent;text-align:left}
.dok-item:hover{background:var(--bg)}
.dok-item.on{background:var(--accent-soft);border-color:var(--accent)}
.dok-item:focus-visible{outline:2px solid var(--accent-dark);outline-offset:-2px}
.dok-ic{flex:none;color:var(--ink-faint);display:flex}
.dok-item.on .dok-ic{color:var(--accent-dark)}
.dok-txt{flex:1;min-width:0}
.dok-name{display:block;font-size:.86rem;font-weight:600;color:var(--ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dok-sub{display:block;font-size:.76rem;color:var(--ink-faint);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dok-ren{width:100%;font:inherit;font-size:.86rem;font-weight:600;padding:2px 6px;
  border:1px solid var(--accent);border-radius:7px;background:var(--surface);color:var(--ink)}
/* Zeilenaktionen bleiben unsichtbar, bis die Zeile gemeint ist — 20 Papierkörbe untereinander
   sind Lärm. Auf Touch (kein Hover) stehen sie dauerhaft, sonst wären sie unerreichbar. */
.dok-act{flex:none;display:flex;gap:2px;opacity:0;transition:opacity var(--dur-fast) var(--ease-out)}
.dok-item:hover .dok-act,.dok-item.on .dok-act,.dok-item:focus-within .dok-act{opacity:1}
@media (hover:none){.dok-act{opacity:1}}
.dok-act button{border:0;background:none;padding:5px;border-radius:8px;cursor:pointer;
  color:var(--ink-faint);display:flex}
.dok-act button:hover{background:var(--surface);color:var(--ink)}
.dok-act button:last-child:hover{color:var(--neg,#C0392B)}
.dok-src{flex:none;color:var(--ink-faint);display:flex;opacity:.65}
/* Freigabe an den Kunden: Der Schalter bleibt sichtbar, sobald er AN ist — eine Freigabe, die
   nur beim Daraufzeigen erscheint, wäre zu leicht zu übersehen. */
.dok-act button.is-on{opacity:1;color:var(--accent-dark);background:var(--accent-100,#E3EEE7)}
.dok-act button.is-on:hover{color:var(--accent-dark)}
.dok-item .dok-act:has(button.is-on){opacity:1}
.dok-frei{color:var(--accent-dark);font-weight:700}
/* Objekt-Dokumente: geerbte Dateien der Wohnanlage stehen unter einer eigenen Überschrift und
   tragen statt der Werkzeuge eine Marke — bearbeitet werden sie dort, wo sie hängen. */
.dok-gruppe{font-size:.66rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-faint);padding:14px 10px 6px;border-top:1px solid var(--line);margin-top:6px}
.dok-item .dok-src{font-size:.6rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  color:var(--bronze-600);background:var(--surface-2);border-radius:var(--r-pill);padding:.2em .5em;opacity:1}
.dok-item.on .dok-src{background:var(--surface)}
/* Empfänger-Sicht auf geteilte Objekte: reine Leseliste, jede Zeile öffnet die PDF-Vorschau. */
.gw-doks{margin-top:16px}
.dok-lbl{font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--accent-dark);margin-bottom:10px}
.dok-lbl span{color:var(--ink-faint);font-weight:600}
.dok-liste{display:flex;flex-direction:column;gap:6px}
.dok-zeile{display:flex;align-items:center;gap:10px;padding:9px 11px;border:1px solid var(--line);border-radius:11px;
  background:var(--bg);text-decoration:none;color:inherit;transition:border-color var(--dur-fast) var(--ease-out),background-color var(--dur-fast) var(--ease-out)}
.dok-zeile:hover{border-color:var(--accent);background:var(--accent-soft)}
.dok-zeile .dok-txt{flex:1;min-width:0}
.dok-oeffnen{flex:none;font-size:.78rem;font-weight:600;color:var(--accent-dark);white-space:nowrap}
.dok-leer{padding:22px 16px;text-align:center;color:var(--ink-faint);font-size:.84rem}
.dok-leer p{margin:0 0 6px}
.dok-leer b{color:var(--ink-soft)}
.dok-prog{height:3px;background:var(--line)}
.dok-prog i{display:block;height:100%;background:var(--accent);transition:width .15s linear}
.dok-over{position:absolute;inset:0;display:none;align-items:center;justify-content:center;
  background:var(--accent-soft);border:2px dashed var(--accent);border-radius:14px;
  color:var(--accent-dark);font-size:.86rem;font-weight:600;pointer-events:none}
.dok-side.over .dok-over{display:flex}
.dok-view{display:flex;flex-direction:column;min-width:0;min-height:0;
  background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.dok-head{display:flex;align-items:center;gap:12px;padding:10px 12px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.dok-head-t{flex:1;min-width:120px;font-weight:600;font-size:.92rem;color:var(--ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dok-head-a{display:flex;gap:8px;flex-wrap:wrap}
.dok-head-a .btn{white-space:nowrap;text-decoration:none}
/* Herunterladen erscheint NUR schmal: Auf dem Desktop hat der PDF-Betrachter die Schaltfläche
   selbst, dort wäre sie doppelt. Mobile Browser zeigen den Rahmen dagegen oft ohne Bedienleiste. */
.dok-dl-klein{display:none}
.dok-frame{flex:1;min-height:0;width:100%;border:0;background:var(--bg)}
.dok-nix{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:10px;color:var(--ink-faint);font-size:.88rem}
.dok-nix span{opacity:.5;transform:scale(2)}
@media (max-width:820px){
  /* Schmal: Liste oben, Dokument darunter — nebeneinander bliebe für beides zu wenig. */
  .dok{grid-template-columns:1fr;height:auto}
  .dok-items{max-height:240px}
  .dok-view{height:min(60vh,520px)}
  .dok-dl-klein{display:inline-flex}
}
/* Vorgänge-Tab */
.ak-vglist{display:flex;flex-direction:column;gap:9px}
.ak-vg{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;cursor:pointer;text-align:left;font:inherit;
  transition:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out),border-color var(--dur-fast) var(--ease-out)}
.ak-vg:hover{transform:translateY(-2px);box-shadow:var(--om-lift-shadow);border-color:var(--accent)}
.ak-vg-t{font-weight:600;color:var(--ink);font-size:.92rem}
.ak-vg-o{color:var(--ink-soft);font-size:.84rem}
/* Aktivitäten-Feed aus Bauträger-Sicht (Freigaben-Karte, Anlage + Einzelobjekt) */
.gw-owner-feed{display:flex;flex-direction:column;gap:2px;max-height:280px;overflow-y:auto}
.gw-owner-feed .gw-feed-item{padding:6px 2px}

/* Mobil: gestapelter Kopf + Icon-Toolbar (wie Mobil-Vorlage) */
@media(max-width:640px){
  .ak-top{flex-wrap:wrap;gap:14px}
  .ak-id{flex-basis:100%;min-width:0}
  .ak-name{font-size:1.5rem}
  .ak-subline{white-space:normal}
  .btn-akx .lbl{display:none}
  .btn-akx{width:44px;height:44px;padding:0;justify-content:center;border-radius:12px}
  .btn-ak{width:44px;height:44px;border-radius:12px}
  .ak-search{width:100%;margin-left:0}
  .ak-msubj{white-space:normal}
  .ak-body{padding:14px 12px 20px;border-radius:0 0 11px 11px}
}

/* ======================= Onboarding v3 (rollenbasierte „Erste Schritte") ======================= */
.ob3{background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm);overflow:hidden;max-width:1000px}
.ob3-hero{display:flex;align-items:center;gap:22px;padding:26px 28px 22px;background:linear-gradient(135deg,#F7F1E3,var(--surface) 62%);border-bottom:1px solid var(--line)}
.ob3-hero-tx{flex:1;min-width:0}
.ob3-eyebrow{font-size:.72rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--bronze-600);margin-bottom:7px}
.ob3-h{font-family:var(--font-head);font-size:1.62rem;font-weight:700;color:var(--ink);line-height:1.12;margin:0;text-wrap:balance}
.ob3-sub{font-size:.92rem;color:var(--ink-soft);margin:7px 0 0;max-width:520px;line-height:1.5}
.ob3-ring{position:relative;flex:none;width:72px;height:72px}
.ob3-ring-bg{fill:none;stroke:var(--line);stroke-width:5}
.ob3-ring-fg{fill:none;stroke:var(--accent);stroke-width:5;stroke-linecap:round;transition:stroke-dashoffset var(--dur-enter) var(--ease-out)}
.ob3-ring-tx{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.ob3-ring-tx b{font-family:var(--font-head);font-size:1.06rem;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.ob3-ring-tx i{font-style:normal;font-size:.72rem;color:var(--ink-soft);font-weight:600}
.ob3-steps{display:flex;flex-direction:column}
.ob3-step{display:flex;align-items:center;gap:16px;padding:16px 28px;border-top:1px solid var(--line);animation:om-rise var(--dur-enter) var(--ease-out) both;animation-delay:calc(var(--i,0)*var(--om-stagger))}
.ob3-step:first-child{border-top:none}
.ob3-check{width:26px;height:26px;flex:none;border-radius:50%;border:1.6px solid var(--line);display:flex;align-items:center;justify-content:center;color:#fff;transition:background var(--dur-base) var(--ease-out),border-color var(--dur-base) var(--ease-out)}
.ob3-check i{font-style:normal;font-size:.76rem;font-weight:700;color:var(--ink-soft);font-variant-numeric:tabular-nums}
.ob3-step.done .ob3-check{background:var(--accent);border-color:var(--accent)}
.ob3-ico{width:40px;height:40px;flex:none;border-radius:12px;display:flex;align-items:center;justify-content:center}
.ob3-tx{flex:1;min-width:0}
.ob3-t{font-weight:700;color:var(--ink);font-size:.96rem}
.ob3-d{font-size:.85rem;color:var(--ink-soft);margin-top:2px;line-height:1.45}
.ob3-step.done .ob3-t{color:var(--ink-soft);text-decoration:line-through;text-decoration-color:var(--slate-300);text-decoration-thickness:1px}
.ob3-btn{flex:none;background:var(--accent);color:#fff;border:none;border-radius:9px;padding:8px 15px;font-size:.86rem;font-weight:600;cursor:pointer;transition:background var(--dur-fast) var(--ease-out),transform var(--dur-press) var(--ease-out)}
.ob3-btn:hover{background:var(--green-600)}
.ob3-done-lbl{flex:none;font-size:.82rem;font-weight:600;color:var(--green-500)}
.ob3-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 28px;border-top:1px solid var(--line);background:var(--surface-2)}
.ob3-foot .link-btn{font-size:.84rem}
.ob3-demo{color:var(--bronze-600);font-weight:600}
.ob3-hide{color:var(--ink-soft)}
.ob3-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:20px 28px 24px}
.ob3-card{display:flex;flex-direction:column;align-items:flex-start;gap:8px;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px;cursor:pointer;transition:border-color var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out);animation:om-rise var(--dur-enter) var(--ease-out) both;animation-delay:calc(var(--i,0)*var(--om-stagger))}
.ob3-card:hover{border-color:var(--accent);box-shadow:var(--om-lift-shadow);transform:translateY(-2px)}
.ob3-card b{font-size:.94rem;color:var(--ink)}
.ob3-card span:last-child{font-size:.84rem;color:var(--ink-soft);line-height:1.45}
.ob3-card-ico{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center}
[data-theme="dark"] .ob3-hero{background:linear-gradient(135deg,#1c3327,var(--surface) 62%)}
@media(max-width:720px){
  .ob3-hero{flex-wrap:wrap;padding:20px 18px 16px}
  .ob3-step{flex-wrap:wrap;padding:14px 18px}
  .ob3-tx{flex:1 1 60%}
  .ob3-btn,.ob3-done-lbl{margin-left:42px}
  .ob3-foot{padding:12px 18px}
  .ob3-cards{grid-template-columns:1fr;padding:16px 18px 20px}
}

/* ---- Dashboard-Hinweise (Checkliste fortsetzen / Beispieldaten aktiv) ---- */
.dash-notes{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 16px}
.dash-note{display:inline-flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:7px 14px;font-size:.85rem;font-weight:600;color:var(--ink);cursor:pointer;transition:border-color var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out)}
.dash-note:hover{border-color:var(--accent);box-shadow:var(--shadow-sm)}
.dash-note.is-demo{cursor:default}
.dash-note.is-demo:hover{border-color:var(--line);box-shadow:none}
.dash-note .link-btn{font-size:.85rem;margin-left:2px}
.dash-note-dot{width:7px;height:7px;flex:none;border-radius:50%;background:var(--bronze-500)}

/* ---- Leerzustände (gemeinsame Komponente, R2) ---- */
.es{display:flex;flex-direction:column;align-items:center;text-align:center;padding:54px 24px 46px;border:1px dashed var(--field-line);border-radius:16px;background:var(--surface)}
.es-ico{width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:var(--surface-2);color:var(--accent);margin-bottom:14px}
.es-t{font-family:var(--font-head);font-size:1.14rem;font-weight:700;color:var(--ink);text-wrap:balance}
.es-d{font-size:.9rem;color:var(--ink-soft);line-height:1.55;max-width:480px;margin:7px 0 18px}
.es-act{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.es-foot{font-size:.8rem;color:var(--ink-soft);margin:14px 0 0}

/* ---- Feature-Spotlights: Punkt am Nav-Eintrag + einmaliger Hinweis (R3) ---- */
.ib-nav-item{position:relative}
/* ============================================================
   Feature-Ankündigung (Konzept 26.07.2026): Modal beim ersten Login nach dem Livegang.
   Bewusst NICHT das generische #modal — die Ankündigung hat eigene Kopfleiste, eine
   Vorschau aus App-Bausteinen und drei Aktionen mit unterschiedlicher Tragweite.
   ============================================================ */
.ann-ov{position:fixed;inset:0;z-index:1400;background:rgba(20,38,31,.55);display:flex;
  align-items:center;justify-content:center;padding:20px;overflow-y:auto}
.ann-card{width:min(440px,100%);background:var(--surface);border:1px solid var(--line);border-radius:16px;
  overflow:hidden;box-shadow:0 24px 60px rgba(20,38,31,.34);margin:auto;
  animation:om-modal-in var(--dur-overlay) var(--ease-out) both}
.ann-head{background:var(--forest-900);color:#fff;padding:13px 16px;display:flex;align-items:center;
  justify-content:space-between;gap:10px;font-family:var(--font-head);font-weight:600;font-size:.95rem}
.ann-head .bw{color:#fff}
.ann-x{background:none;border:none;color:rgba(255,255,255,.72);font-size:1.4rem;line-height:1;cursor:pointer;
  padding:0 2px;border-radius:6px}
.ann-x:hover{color:#fff}
.ann-vis{background:var(--accent-soft);padding:14px 16px;border-bottom:1px solid var(--line)}

/* Ankündigung mit Film: breitere Karte, damit die nachgebaute Oberfläche im Video lesbar bleibt.
   Der Film sitzt randlos oben — die eigene Leiste liegt darüber, nicht daneben. */
.ann-ov.has-video .ann-card{width:min(720px,100%)}
.ann-video{position:relative;background:var(--forest-900);aspect-ratio:16/9;overflow:hidden;
  border-bottom:1px solid var(--line)}
.ann-video video{display:block;width:100%;height:100%;object-fit:cover;background:var(--forest-900)}
/* Die Klickfläche liegt über dem Film, aber unter der Leiste: Klick hält an und setzt fort. */
.ann-vid-hit{position:absolute;inset:0;background:none;border:0;padding:0;cursor:pointer}
.ann-vid-hit:focus-visible{outline:2px solid var(--gold);outline-offset:-4px}
/* Die Leiste blendet sich weg, solange der Film läuft — die Einblendungen im Film sitzen unten,
   und eine dauerhafte Leiste läge genau darauf. Sie kommt bei Mauskontakt, Tastaturfokus und
   immer dann, wenn der Film steht. */
.ann-vid-bar{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;gap:10px;
  padding:10px 12px;background:linear-gradient(transparent,rgba(20,38,31,.62));
  opacity:0;transition:opacity .2s var(--ease-out)}
.ann-video:hover .ann-vid-bar,
.ann-video:focus-within .ann-vid-bar,
.ann-video.is-paused .ann-vid-bar{opacity:1}
@media(hover:none){.ann-vid-bar{opacity:1}}
.ann-vid-prog{flex:1 1 auto;height:3px;border-radius:99px;background:rgba(255,255,255,.28);overflow:hidden}
.ann-vid-prog i{display:block;height:100%;width:0;background:#fff;border-radius:99px}
.ann-vid-btn{flex:none;display:flex;align-items:center;justify-content:center;width:28px;height:28px;
  border-radius:8px;border:1px solid rgba(255,255,255,.22);background:rgba(20,38,31,.42);
  color:#fff;cursor:pointer;padding:0;transition:background .12s,border-color .12s}
.ann-vid-btn:hover{background:rgba(20,38,31,.68);border-color:rgba(255,255,255,.44)}
.ann-vid-btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
/* Ein Knopf für beide Zustände: sichtbar ist immer nur das Symbol der nächsten Handlung. */
#annVidPlay .ic-pause,#annVidPlay.is-playing .ic-play{display:none}
#annVidPlay.is-playing .ic-pause{display:block}
/* Vergrößert: eigene Fläche über der Karte statt Browser-Vollbild — funktioniert auch dort, wo
   Vollbild verwehrt wird, und behält die eigene Leiste. Der Film wandert hinein und wieder zurück. */
.ann-vid-zoom{position:fixed;inset:0;z-index:1500;background:rgba(20,38,31,.88);
  display:flex;align-items:center;justify-content:center;padding:32px}
.ann-vid-zoom .ann-video{width:min(1280px,100%);max-height:calc(100vh - 64px);aspect-ratio:16/9;
  border:0;border-radius:12px;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.ann-vid-zoom .ann-video video{object-fit:contain}
.ann-vid-zoom .ann-vid-bar{padding:14px 16px}
.ann-vid-zoom-x{position:absolute;top:18px;right:22px;width:38px;height:38px;border-radius:10px;
  border:1px solid rgba(255,255,255,.24);background:rgba(20,38,31,.5);color:#fff;font-size:1.5rem;
  line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.ann-vid-zoom-x:hover{background:rgba(20,38,31,.8);border-color:rgba(255,255,255,.5)}
.ann-vid-zoom-x:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
@media(max-width:700px){.ann-vid-zoom{padding:12px}.ann-vid-zoom-x{top:8px;right:10px}}
.ann-row{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--line);
  border-radius:10px;padding:9px 11px}
.ann-row + .ann-row{margin-top:7px}
.ann-thumb{width:34px;height:32px;border-radius:7px;background:var(--surface-2);border:1px solid var(--line);flex:none}
.ann-rb{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1 1 auto}
.ann-rt{font-size:.84rem;font-weight:650;line-height:1.2;color:var(--ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ann-rf{font-size:.74rem;color:var(--ink-soft);font-variant-numeric:tabular-nums}
.ann-rc{display:flex;gap:4px;flex-wrap:wrap;margin-top:2px}
.ann-lbl{flex:none;font-size:.64rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  color:var(--accent-ink);background:var(--accent);border-radius:99px;padding:.2em .6em}
.ann-body{padding:16px 18px}
.ann-body h3{font-family:var(--font-head);font-size:1.16rem;margin:0 0 7px;padding:0;border:none}
.ann-body p{font-size:.9rem;color:var(--ink-soft);margin:0 0 10px}
.ann-body ul{margin:0;padding-left:1.1em;font-size:.86rem;color:var(--ink-soft)}
.ann-body li{margin-bottom:4px}
.ann-body li::marker{color:var(--gold)}
.ann-foot{display:flex;align-items:center;gap:8px;padding:13px 18px;border-top:1px solid var(--line);
  background:var(--surface-2);flex-wrap:wrap}
.ann-spacer{flex:1 1 auto}
.ann-later{font-size:.82rem;color:var(--ink-faint)}

/* Geführte Tour: abgedunkelte Seite, hervorgehobenes Element, Sprechblase daneben.
   Die Dimm-Fläche fängt Klicks ab — die Tour zeigt, sie klickt nichts an. */
.tour-ov{position:fixed;inset:0;z-index:1450;pointer-events:none}
/* Nur zum Abfangen von Klicks — abgedunkelt wird über den Ring, damit das hervorgehobene
   Element als einziges hell bleibt (Aussparung statt Rahmen auf grauem Grund). */
.tour-dim{position:absolute;inset:0;background:transparent;pointer-events:auto}
.tour-ring{position:fixed;border:2px solid var(--gold);border-radius:11px;pointer-events:none;
  box-shadow:0 0 0 4px rgba(203,167,106,.3), 0 0 0 9999px rgba(20,38,31,.55);
  transition:opacity .14s var(--ease-out),top .18s var(--ease-out),left .18s var(--ease-out),
             width .18s var(--ease-out),height .18s var(--ease-out);opacity:0}
.tour-bub{position:fixed;background:var(--surface);border:1px solid var(--line);border-radius:12px;
  padding:13px 15px;box-shadow:0 18px 40px rgba(20,38,31,.32);pointer-events:auto;opacity:0;
  transition:opacity .14s var(--ease-out)}
.tour-step{font-size:.66rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--accent-dark)}
.tour-bub h5{font-family:var(--font-head);font-size:.98rem;margin:3px 0 5px;color:var(--ink)}
.tour-bub p{font-size:.84rem;color:var(--ink-soft);margin:0 0 11px;line-height:1.5}
.tour-act{display:flex;align-items:center;gap:8px}
@media(max-width:560px){
  .ann-foot{gap:6px}
  .ann-foot .btn{flex:1 1 auto;justify-content:center}
  .ann-spacer{flex-basis:100%;height:0}
  .tour-bub{left:12px!important;right:12px;width:auto!important}
}
/* Kurzes Aufleuchten, wenn eine Ankündigung gezielt hierher geführt hat */
.acc-card.is-spotlit{border-color:var(--gold);box-shadow:0 0 0 4px rgba(203,167,106,.28);
  transition:box-shadow .3s var(--ease-out),border-color .3s var(--ease-out)}
/* Tabellenzeile (Kundenliste): box-shadow greift an <tr> nicht zuverlässig — Fläche + Kante nutzen */
tr.is-spotlit>td{background:rgba(203,167,106,.16);transition:background .3s var(--ease-out)}
tr.is-spotlit>td:first-child{box-shadow:inset 3px 0 0 var(--gold)}
/* Bautenstandsplan-Editor (Einstellungen → Kalkulation) */
.bp-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:var(--bg)}
table.bp-cfg{border-collapse:collapse;width:100%;min-width:560px;font-size:.9rem}
table.bp-cfg th,table.bp-cfg td{padding:8px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
table.bp-cfg thead th{font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-soft);background:var(--surface-2);white-space:nowrap}
table.bp-cfg tbody tr:last-child td{border-bottom:none}
table.bp-cfg .bp-n{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
table.bp-cfg .bp-mon{color:var(--ink-soft);font-size:.84rem}
table.bp-cfg .bp-x{text-align:right;width:1%}
.bp-in{font:inherit;font-size:.9rem;color:var(--ink);background:var(--surface);
  border:1.5px solid var(--line);border-radius:8px;padding:.36em .55em;width:100%;min-width:0}
.bp-in:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.bp-num-in{width:72px;text-align:right;font-variant-numeric:tabular-nums;display:inline-block}
.bp-suf{color:var(--ink-soft);margin-left:4px;font-size:.86rem}
/* Sicherheitspuffer: eine Zeile unter dem Plan — Schalter, Wert, Erklärung. */
.bp-puffer{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.bp-puf-sw{display:inline-flex;align-items:center;gap:9px;font-weight:600;font-size:.92rem;cursor:pointer}
.bp-puf-val{display:inline-flex;align-items:center}
.bp-puf-val.is-off{opacity:.45}
.bp-puf-hint{flex:1 1 100%;margin:2px 0 0}
.bp-note{margin:12px 0 0;font-size:.86rem;font-weight:600}
.bp-note.ok{color:var(--green)}
.bp-note.bad{color:var(--red)}
@media(max-width:560px){ .bp-num-in{width:60px} }
/* Archiv „Neuerungen" (Einstellungen) */
.neu-list{display:flex;flex-direction:column;gap:16px}
.neu-item{border-left:3px solid var(--accent-soft);padding-left:15px}
.neu-date{font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-faint)}
.neu-fresh{color:var(--accent-dark);background:var(--accent-soft);border-radius:99px;padding:.1em .55em;letter-spacing:.03em}
.neu-t{font-family:var(--font-head);font-size:1.02rem;margin:3px 0 5px;padding:0;border:none}
.neu-x{font-size:.9rem;color:var(--ink-soft);margin:0 0 9px}
.neu-act{display:flex;gap:8px;flex-wrap:wrap}
@media (prefers-reduced-motion:reduce){.ob3-step,.ob3-card{animation:none}}

/* ---- Wortmarke im Fließtext: „immobricks" immer klein — immo dünn, bricks fett (erbt Farbe/Größe) ---- */
.bw{font-weight:300;letter-spacing:-.01em}
.bw b{font-weight:800}

/* ======================= Basis-Zugang (kostenloser Plan) ======================= */
/* Einladungs-Registrierung (Auth-Karte) */
.koopreg-hero{background:linear-gradient(135deg,#F7F1E3,var(--surface) 70%);border:1px solid var(--line);border-radius:14px;padding:18px 20px;margin-bottom:18px}
.koopreg-badge{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--bronze-600);margin-bottom:8px}
.koopreg-h{font-family:var(--font-head);font-size:1.28rem;font-weight:400;line-height:1.3;margin:0 0 8px;color:var(--ink);text-wrap:balance}
.koopreg-h b{font-weight:700}
.koopreg-sub{font-size:.9rem;color:var(--ink-soft);margin:0;line-height:1.55}
[data-theme="dark"] .koopreg-hero{background:linear-gradient(135deg,#1c3327,var(--surface) 70%)}

/* Nav-Schloss: gesperrtes Modul sichtbar, aber markiert */
.nav-lock{position:absolute;top:50%;right:12px;transform:translateY(-50%);color:var(--slate-400);display:flex;opacity:.8}
.ib-nav-item:hover .nav-lock{color:var(--bronze-500);opacity:1}

/* Upgrade-Panel */
.up-overlay{position:fixed;inset:0;z-index:1300;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(20,38,31,.45);animation:om-overlay-in var(--dur-overlay) var(--ease-out) both}
.up-card{width:min(560px,100%);background:var(--surface);border-radius:18px;overflow:hidden;box-shadow:0 24px 64px rgba(20,38,31,.35);animation:om-modal-in var(--dur-overlay) var(--ease-out) both}
.up-head{background:var(--forest-900);color:#fff;padding:22px 26px 20px}
.up-badge{display:inline-block;font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--bronze-500);margin-bottom:8px}
.up-head h3{font-family:var(--font-head);font-size:1.3rem;font-weight:700;margin:0 0 8px;line-height:1.25;color:#fff;text-wrap:balance}
.up-head p{margin:0;font-size:.9rem;line-height:1.55;color:rgba(255,255,255,.78)}
.up-body{padding:20px 26px 22px}
.up-cols{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:560px){.up-cols{grid-template-columns:1fr}}
.up-cols b{font-size:.85rem;color:var(--ink)}
.up-cols ul{margin:8px 0 0;padding:0;list-style:none}
.up-cols li{font-size:.85rem;color:var(--ink-soft);padding:3px 0 3px 22px;position:relative;line-height:1.4}
.up-cols li::before{content:"✓";position:absolute;left:0;color:var(--slate-400);font-weight:700}
.up-cols ul.plus li::before{content:"+";color:var(--bronze-600)}
.up-quota{display:flex;gap:18px;margin:16px 0 0;padding:10px 14px;background:var(--surface-2);border-radius:10px;font-size:.84rem;color:var(--ink-soft)}
.up-quota b{color:var(--ink);font-variant-numeric:tabular-nums}
.up-price{margin:16px 0 0;font-size:.84rem;color:var(--ink-soft)}
.up-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}
.ak-lock{margin-left:5px;color:var(--slate-400);flex:none}
.btn-akx:hover .ak-lock{color:var(--bronze-600)}

/* ---- Kundenbereich-Wahldialog: Icon-Kachel-Karten ---- */
.ca-choices{display:flex;flex-direction:column;gap:10px}
.ca-choice{display:flex;align-items:center;gap:13px;width:100%;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:13px;padding:13px 15px;cursor:pointer;transition:border-color var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out)}
.ca-choice:hover{border-color:var(--accent);box-shadow:var(--shadow-sm);transform:translateY(-1px)}
.ca-choice-ic{flex:none;width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center}
.ca-choice-tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.ca-choice-tx b{font-size:.98rem;color:var(--ink)}
.ca-choice-tx span{font-size:.85rem;color:var(--ink-soft);line-height:1.4}

/* ---- Kundenakte: „Vermittelt durch"-Badge (Vertriebspartner-Empfehlung) ---- */
.ak-referrer{display:inline-flex;align-items:center;font-size:.76rem;font-weight:600;padding:3px 10px;border-radius:999px;background:var(--bronze-soft,#F4EEE1);color:var(--bronze-dark,#8A6417);white-space:nowrap}
[data-theme="dark"] .ak-referrer{background:#2A2620;color:#D8B87E}
/* Vermittlung durch einen Kooperationspartner: grün statt bronze — ein echter Mandant, keine Namensliste. */
.ak-referrer.is-koop{background:var(--accent-soft);color:var(--accent)}
[data-theme="dark"] .ak-referrer.is-koop{background:#1B2E24;color:#7FC0A0}
/* Gegenrichtung: von hier an einen Bauträger vermittelt (neutral, kein Status — nur ein Fakt). */
.ak-referred-to{display:inline-flex;align-items:center;font-size:.76rem;font-weight:600;padding:3px 10px;border-radius:999px;background:var(--bg);color:var(--ink-soft);border:1px solid var(--line);white-space:nowrap}

/* Postfach verbinden: Abruf-Umfang (letzte 60 Tage / nur neue) */
.acc-mail-scope{margin-top:14px;display:flex;flex-direction:column;gap:8px}
.acc-mail-scope>.xp-lbl{font-size:.82rem;font-weight:600;color:var(--ink-soft)}
.scope-opt{display:flex;align-items:flex-start;gap:10px;padding:11px 13px;border:1px solid var(--line);border-radius:11px;cursor:pointer;transition:border-color var(--dur-fast) var(--ease-out),background var(--dur-fast) var(--ease-out)}
.scope-opt:hover{border-color:var(--accent)}
.scope-opt input{margin-top:3px;accent-color:var(--accent);flex:none}
.scope-opt span{display:flex;flex-direction:column;gap:2px}
.scope-opt b{font-size:.92rem;color:var(--ink)}
.scope-opt small{font-size:.8rem;color:var(--ink-soft);line-height:1.4}
.scope-opt:has(input:checked){border-color:var(--accent);background:var(--accent-soft,#E4F1EA)}
[data-theme="dark"] .scope-opt:has(input:checked){background:#182A22}

/* Mail-Liste: Hintergrund-Abruf-Banner */
.mlc-backfill{display:flex;align-items:center;gap:8px;padding:9px 13px;margin:0 0 2px;font-size:.83rem;color:var(--ink-soft);background:var(--accent-soft,#E4F1EA);border-bottom:1px solid var(--line)}
[data-theme="dark"] .mlc-backfill{background:#182A22}
.mlc-backfill b{color:var(--ink);font-variant-numeric:tabular-nums}
.mlc-bf-spin{display:inline-flex;animation:mlc-bf-rot 1.1s linear infinite;color:var(--accent)}
@keyframes mlc-bf-rot{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.mlc-bf-spin{animation:none}}

/* Mail-Kopf: Zustandshinweise zum automatischen Abruf */
.mlc-stale{color:var(--bronze-dark,#7A5A18);font-weight:600;cursor:help}
[data-theme="dark"] .mlc-stale{color:#D8B87E}
.mlc-syncerr{color:#C2483A}
[data-theme="dark"] .mlc-syncerr{color:#E4796A}

/* ===========================================================================
   Sichtbarkeit der Auswertungs-Elemente (Konzept 31.07.2026)

   Die Bedienung sitzt am Element, ist dauerhaft da und BESCHRIFTET. Ein reines Auge lässt offen,
   ob es den Zustand anzeigt oder die Aktion auslöst — „Ausblenden" / „Einblenden" nicht.
   Zurückhaltend über die Farbe, nicht über die Deckkraft: voll sichtbar, aber leise.

   Ausgeblendetes hinterlässt eine schmale Zeile (Abschnitte) bzw. einen Chip (Kennzahlen-
   Kacheln) — die Wirkung ist sofort sichtbar, ohne dass die Seite mit Geistern zusteht.
   Beim Kunden existiert nichts davon.

   Bewusst keine farbige Kante links: Fläche und Punkt statt Linie.
   =========================================================================== */
.sec-bar{display:none}
#results.sec-manage .res-sec{position:relative}
#results.sec-manage .sec-bar{display:block}

/* --- Sichtbarer Abschnitt: Schaltfläche oben rechts ------------------------ */
#results.sec-manage .sec-btn{position:absolute;top:0;right:0;z-index:4;
  display:inline-flex;align-items:center;gap:6px;
  padding:5px 12px;border-radius:999px;cursor:pointer;
  font:inherit;font-size:.78rem;font-weight:600;letter-spacing:.01em;
  background:var(--hint-bg);color:var(--ink-soft);border:1px solid transparent;
  transition:background .15s,color .15s,border-color .15s}
#results.sec-manage .sec-btn:hover{background:var(--surface);color:var(--accent-dark,var(--accent));border-color:var(--accent)}
#results.sec-manage .sec-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.sec-btn svg,.sec-restore svg,.sec-only svg{width:17px;height:12px;flex:none;fill:none;
  stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

/* --- Ausgeblendeter Abschnitt: schmale Zeile an seiner Stelle -------------- */
#results.sec-manage .res-sec-off > *:not(.sec-bar){display:none}
#results.sec-manage .res-sec-off{margin:12px 0}
.sec-restore,.sec-only{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:10px 14px;border-radius:12px;background:var(--hint-bg);
  border:1px dashed var(--line);color:var(--ink-soft);font-size:.86rem}
.sec-only{border-style:solid}
.sec-restore-t{flex:1 1 auto;min-width:0}
.sec-restore-t b{color:var(--ink);font-weight:600}
.sec-restore-b{font:inherit;font-size:.8rem;font-weight:600;cursor:pointer;
  border:1px solid var(--accent);background:var(--surface);color:var(--accent-dark,var(--accent));
  padding:5px 14px;border-radius:999px;transition:background .15s,color .15s}
.sec-restore-b:hover{background:var(--accent);color:#fff}
.sec-restore-b:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* Die eigene Zeile für Elemente, die es nur beim Kunden gibt: gleiche Sprache, ruhiger Rahmen. */
.sec-only .sec-btn{position:static}

/* --- Kennzahlen-Kacheln ---------------------------------------------------
   Jede Kachel braucht einen EIGENEN Bezugspunkt. Ohne position:relative ankerten alle vier
   absolut gesetzten Schaltflächen am gemeinsamen Rahmen, stapelten sich in derselben Ecke und
   sahen aus wie eine einzige — die vier Kennzahlen ließen sich dadurch nicht einzeln schalten.
   Die Karte ist ohnehin ein Flex-Container, deshalb wandert die Steuerung per order ans Ende:
   volle Breite, kein Überlappen mit dem großen Zahlenwert. */
#results.sec-manage .investor-card{position:relative}
#results.sec-manage .investor-card > .sec-bar{order:9;margin-top:12px}
#results.sec-manage .investor-card .sec-btn{position:static;width:100%;justify-content:center}

/* --- Ausgeblendete Kachel wird zum Chip ------------------------------------ */
.ic-chip{display:inline-flex;flex-direction:column;align-items:flex-start;justify-content:center;
  gap:3px;cursor:pointer;text-align:left;min-height:64px;
  padding:12px 16px;border-radius:14px;border:1px dashed var(--line);
  background:var(--hint-bg);color:var(--ink-soft);font:inherit;
  transition:border-color .15s,color .15s}
.ic-chip span{font-size:.86rem;font-weight:600;color:var(--ink-soft)}
.ic-chip em{font-style:normal;font-size:.78rem;font-weight:600;color:var(--accent-dark,var(--accent))}
.ic-chip:hover{border-color:var(--accent)}
.ic-chip:hover span{color:var(--ink)}
.ic-chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* --- Vorschlag: Sichtbarkeit auf alle Kalkulationen des Kunden übertragen ---------
   Klebt unten am Fenster, damit er auch nach dem Scrollen durch die lange Auswertung
   erreichbar bleibt. Bewusst ruhig gehalten — Karte in Oberflächenfarbe mit feinem
   Rahmen, keine Signalfarbe: Das ist ein Angebot, keine Warnung.

   sticky statt fixed, und das ist kein Geschmack: Die Ansichten des Partner-Bereichs
   tragen nach ihrer Einblend-Animation dauerhaft einen (identischen) transform. Ein
   Element mit transform wird für alles darin zum Bezugsrahmen — fixed hing damit nicht
   mehr am Fenster, sondern am 9000 px langen Container und landete weit unterhalb des
   Bildschirms. sticky hängt am Scrollbereich und ist gegen solche Vorfahren immun. */
.sec-sync{position:sticky;bottom:22px;z-index:150;
  display:flex;align-items:center;gap:14px;
  width:max-content;max-width:min(680px,calc(100vw - 28px));margin:20px auto 0;
  padding:11px 12px 11px 18px;border-radius:14px;
  background:var(--surface);border:1px solid var(--line);
  box-shadow:0 12px 34px rgba(20,38,31,.18);
  transform:translateY(14px);opacity:0;
  transition:opacity .22s ease,transform .22s ease}
.sec-sync.sec-sync-an{opacity:1;transform:translateY(0)}
.sec-sync-txt{margin:0;font-size:.88rem;line-height:1.35;color:var(--ink-soft)}
.sec-sync-txt strong{color:var(--ink);font-weight:600}
.sec-sync .btn.btn-slim{flex:none;white-space:nowrap}
.sec-sync-x{flex:none;width:30px;height:30px;border:0;border-radius:9px;background:none;
  color:var(--ink-soft);font-size:1.3rem;line-height:1;cursor:pointer}
.sec-sync-x:hover{background:var(--surface-2);color:var(--ink)}
.sec-sync-x:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (max-width:640px){
  .sec-sync{bottom:14px;width:auto;max-width:none;margin:16px 0 0;flex-wrap:wrap}
  .sec-sync-txt{flex:1 1 100%;order:1}
  .sec-sync .btn.btn-slim{flex:1 1 auto;order:2}
  .sec-sync-x{order:3}
}
@media (prefers-reduced-motion:reduce){.sec-sync{transition:none}}

/* --- Kopfzeile: die Ghost-Buttons stehen auf grauem Grund und brauchen Weiß -- */
.results-actions .btn-ghost{background:var(--surface)}

@media (prefers-reduced-motion: reduce){ #results.sec-manage .sec-btn,.ic-chip{transition:none} }
@media print{ .sec-bar,.ic-chip{display:none!important} }