/* ============================================================================
   KOVA Design System — dunkles Premium-Theme.
   Prinzipien: eine Typo (Manrope, lokal gebundelt), Tiefe über Layer + Schatten,
   Akzent als Verlauf (tiefes Indigo), Micro-Interactions überall, sichtbare
   Focus-Ringe (a11y), ruhige Flächen — Farbe nur wo sie Bedeutung trägt.
   ============================================================================ */

@font-face{font-family:"Manrope";font-style:normal;font-weight:200 800;font-display:swap;
  src:url("/fonts/manrope-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Manrope";font-style:normal;font-weight:200 800;font-display:swap;
  src:url("/fonts/manrope-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root {
  /* Marke: tiefes Indigo (eine disziplinierte Signaturfarbe) — ersetzt Violett→Pink.
     accent2 kollabiert bewusst auf accent: keine Zwei-Farb-Signatur mehr. */
  --bg:#0a0e1c; --panel:#141a30; --panel2:#0f1426; --line:rgba(150,160,205,.11); --line2:rgba(150,160,205,.2);
  --text:#eef1f9; --muted:#8891aa; --accent:#6366f1; --accent2:#6366f1; --ok:#2fbb7f; --warn:#e0a63a; --bad:#ef4a52;
  --grad:linear-gradient(135deg,#5b57f0 0%,#4338ca 100%);
  --grad-soft:linear-gradient(180deg,rgba(99,102,241,.13),rgba(99,102,241,0));
  --shadow:0 10px 30px -16px rgba(0,2,12,.66);
  --shadow-lg:0 30px 72px -30px rgba(0,2,12,.78);
  /* Glow neutralisiert: Tiefe über neutrale Schatten, kein farbiger Schimmer mehr. */
  --glow:0 10px 30px -14px rgba(0,2,12,.6);
  --ring:0 0 0 3px rgba(99,102,241,.4);
  --r-s:9px; --r-m:12px; --r-l:16px;
  /* Erweiterte Skala (additiv): Radien + 4px-Spacing + tabellarische Instrument-Ziffern */
  --r-xs:6px; --r-xl:22px; --r-full:999px;
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px; --s-7:48px; --s-8:64px;
  /* Dezente Weight-Disziplin: Marke 800→700, Überschriften 700→600 (ruhiger, editorialer) */
  --fw-brand:700; --fw-heading:600;
  /* Marken-Logo: 3-Knoten-Netzwerk (Gehirn/Graph-Identität) als Maske → ersetzt den ◆-Platzhalter,
     füllt mit var(--accent) via background-color, CSP-konform (kein externer Request). */
  --logo-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%23000' stroke-width='3.6' stroke-linecap='round'%3E%3Cline x1='32' y1='32' x2='32' y2='15'/%3E%3Cline x1='32' y1='32' x2='47' y2='41'/%3E%3Cline x1='32' y1='32' x2='17' y2='41'/%3E%3C/g%3E%3Ccircle cx='32' cy='32' r='7.5' fill='%23000'/%3E%3Ccircle cx='32' cy='15' r='4.5' fill='%23000'/%3E%3Ccircle cx='47' cy='41' r='4.5' fill='%23000'/%3E%3Ccircle cx='17' cy='41' r='4.5' fill='%23000'/%3E%3C/svg%3E");
  --mono:ui-monospace,SFMono-Regular,"SF Mono","Cascadia Code",Menlo,Consolas,monospace;
}

/* ---------------- Helles Theme (Umschalter im Sprach-Chip) ---------------- */
[data-theme="light"]{
  --bg:#f4f6fc; --panel:#ffffff; --panel2:#f1f4fb; --line:rgba(30,34,64,.11); --line2:rgba(30,34,64,.2);
  --text:#161a2e; --muted:#5c6684; --accent:#4f46e5; --accent2:#4f46e5;
  --grad:linear-gradient(135deg,#5b57f0 0%,#4338ca 100%);
  --grad-soft:linear-gradient(180deg,rgba(79,70,229,.10),rgba(79,70,229,0));
  --shadow:0 10px 30px -18px rgba(20,24,52,.2);
  --shadow-lg:0 30px 72px -34px rgba(20,24,52,.28);
  --glow:0 10px 28px -16px rgba(20,24,52,.2);
  --ring:0 0 0 3px rgba(99,102,241,.28);
}
[data-theme="light"] body{
  background-image:radial-gradient(1200px 600px at 50% -20%, rgba(99,102,241,.09) 0%, transparent 60%);
  background-size:auto}
[data-theme="light"] header,[data-theme="light"] .console-bar,[data-theme="light"] .tabbar{background:rgba(255,255,255,.75)}
[data-theme="light"] footer{background:rgba(255,255,255,.6)}
[data-theme="light"] .toast{background:rgba(255,255,255,.96)}
[data-theme="light"] .toast.err{background:rgba(254,238,238,.97)}
[data-theme="light"] .node-info{background:rgba(255,255,255,.95)}
[data-theme="light"] .swarm-legend{background:rgba(255,255,255,.85)}
[data-theme="light"] .swarm-panel{background:radial-gradient(700px 460px at 50% 42%,#e9edfb 0%,var(--panel) 70%)}
[data-theme="light"] .login-body::before{opacity:.7}
[data-theme="light"] .login-card{background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(255,255,255,.78))}
[data-theme="light"] .login-form input{background:#fff}
[data-theme="light"] .kpi .v{color:var(--text)}
[data-theme="light"] .stream .placeholder,[data-theme="light"] .feed .placeholder,[data-theme="light"] .audit .placeholder,[data-theme="light"] .mempty{background:rgba(28,37,74,.03)}
[data-theme="light"] .step{border-bottom-color:rgba(28,37,74,.09)}
[data-theme="light"] .frow{border-bottom-color:rgba(28,37,74,.08)}
[data-theme="light"] .arow{border-bottom-color:rgba(28,37,74,.08)}
[data-theme="light"] .arow:hover{background:rgba(28,37,74,.04)}
[data-theme="light"] .card td{border-bottom-color:rgba(28,37,74,.09)}
[data-theme="light"] .card tbody tr:hover td{background:rgba(28,37,74,.03)}
[data-theme="light"] ::-webkit-scrollbar-thumb{background:rgba(28,37,74,.25);border:2px solid transparent;background-clip:content-box}
[data-theme="light"] .photo .pdel{background:rgba(255,255,255,.88)}
[data-theme="light"] .acard-ic{background:rgba(28,37,74,.03)}
[data-theme="light"] .apv-ok{color:#fff}
[data-theme="light"] .rsvp.on{color:#fff}
[data-theme="light"] .tn.active,[data-theme="light"] .tab.active{color:var(--text);border-color:rgba(99,102,241,.45)}
[data-theme="light"] .hud-x b{color:var(--text)}
[data-theme="light"] ::selection{background:rgba(99,102,241,.28);color:#151d38}

*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{color:var(--text);background:var(--bg);
  background-image:radial-gradient(1200px 640px at 50% -18%, rgba(99,102,241,.10) 0%, transparent 62%);
  background-size:auto;
  font:14px/1.55 "Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  display:flex;flex-direction:column;height:100vh}
::selection{background:rgba(99,102,241,.45);color:#fff}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(148,163,216,.22);border-radius:999px;border:2px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:rgba(148,163,216,.4);border:2px solid transparent;background-clip:content-box}

/* Interaktion: einheitliche Übergänge + sichtbarer Fokus (Tastatur/a11y) */
button,select,input,textarea,a,.tab,.tn,.chip,.docitem,.ticket,.mrow,.acard,.kpi,.svc,.offer,.event,.intg{transition:border-color .16s ease,background .16s ease,color .16s ease,box-shadow .2s ease,transform .16s ease,opacity .16s ease}
button{font-family:inherit}
:focus{outline:none}
:focus-visible{outline:none;box-shadow:var(--ring)!important;border-radius:var(--r-s)}
button:not(:disabled):active{transform:translateY(1px)}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

header{display:flex;align-items:center;justify-content:space-between;padding:13px 22px;border-bottom:1px solid var(--line);
  background:rgba(8,12,25,.72);backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%);z-index:5}
.brand{font-weight:var(--fw-brand);font-size:18px;letter-spacing:-.02em;display:flex;align-items:baseline}
/* ◆-Platzhalter → maskiertes Netzwerk-Logo (Indigo). Der ◆-Text bleibt im DOM, wird aber transparent. */
.logo{display:inline-block;width:1em;height:1em;flex:0 0 auto;color:transparent;background-color:var(--accent);
  -webkit-mask:var(--logo-mask) center/contain no-repeat;mask:var(--logo-mask) center/contain no-repeat;vertical-align:-.12em;overflow:hidden}
.brand .logo{margin-right:8px;font-size:21px}
.brand .sub{font-weight:500;font-size:11px;color:var(--muted);margin-left:9px;letter-spacing:0}
.navlink{font-size:12px;color:var(--accent);text-decoration:none;margin-left:12px;border:1px solid var(--line);border-radius:999px;padding:4px 11px;background:rgba(99,102,241,.06);cursor:pointer}
.navlink:hover{border-color:var(--accent);background:rgba(99,102,241,.14)}
.status{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted)}
.badge{font-size:11px;font-weight:600;border:1px solid var(--line);border-radius:999px;padding:3px 11px;color:var(--muted);background:var(--panel2)}
.badge.live{color:var(--ok);border-color:rgba(34,197,94,.4);background:rgba(34,197,94,.08)}
.badge.off{color:var(--warn);border-color:rgba(245,158,11,.4);background:rgba(245,158,11,.07)}
.dot{width:9px;height:9px;border-radius:50%;display:inline-block;background:#64748b}
.dot.on{background:var(--ok);box-shadow:0 0 10px var(--ok)} .dot.off{background:var(--bad)}

main{flex:1;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:16px;padding:16px;min-height:0;width:100%;box-sizing:border-box}
main>*{min-width:0}
/* Unterseiten steuern ihr Layout selbst (grid2/mgrid) — das Cockpit-Grid gilt nur dort. */
main.portal2,main.admin-main,main.manage-main,main.owner-main,main.bsc-main{display:block}
.panel{background:linear-gradient(180deg,rgba(255,255,255,.028),rgba(255,255,255,0) 42%),var(--panel);
  border:1px solid var(--line);border-radius:var(--r-l);display:flex;flex-direction:column;min-height:0;overflow:hidden;box-shadow:var(--shadow)}
.panel-head{padding:13px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:10px}
.panel-head h2{margin:0;font-size:14px;font-weight:var(--fw-heading);letter-spacing:-.01em}.hint{color:var(--muted);font-weight:400;font-size:12px}

/* Runaway-Schutz: Der Canvas ist ABSOLUT in die .graph-panel eingespannt (inset:0). Damit
   leitet sich seine Layout-Höhe ausschließlich aus der Panel-Box ab und NIE aus seinem eigenen
   height-Attribut. Das Setzen von canvas.height in app.js kann die Panel-/Seiten-Höhe dadurch
   strukturell nicht mehr aufblähen — die alte Endlosschleife (dpr>1) ist ausgeschlossen.
   .graph-panel überschreibt hier flex-direction:column (aus .panel), damit der absolute Canvas
   den ganzen Innenraum unter dem panel-head füllt. */
.graph-panel{position:relative;display:block;overflow:hidden}
.graph-panel .panel-head{position:relative;z-index:2}
#graph{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:grab}
.legend{display:flex;flex-wrap:wrap;gap:8px}.legend .lg{font-size:11px;color:var(--muted);display:inline-flex;align-items:center;gap:4px}.legend .dot{width:9px;height:9px}
.node-info{position:absolute;left:16px;right:16px;bottom:16px;background:rgba(7,11,22,.9);border:1px solid var(--line2);border-radius:var(--r-m);
  padding:12px 14px;font-size:13px;white-space:pre-wrap;max-height:34%;overflow:auto;backdrop-filter:blur(10px);box-shadow:var(--shadow)}
.node-info b{color:var(--accent2)} .node-info u{color:var(--accent);text-decoration:none} .node-info .meta{color:var(--muted);font-size:12px;margin-bottom:6px}
.toast{position:absolute;left:16px;top:16px;background:rgba(12,16,32,.92);border:1px solid var(--accent);padding:9px 14px;border-radius:var(--r-m);font-size:13px;
  opacity:0;transform:translateY(-8px);transition:.3s cubic-bezier(.2,.9,.3,1.2);pointer-events:none;box-shadow:var(--glow);backdrop-filter:blur(8px);z-index:20}
.toast.show{opacity:1;transform:none}
.toast.err{background:rgba(40,12,18,.92);border-color:var(--bad);box-shadow:0 8px 28px -8px rgba(239,68,68,.4)}

.console-panel{min-height:0}
.kpis{display:flex;gap:10px;padding:8px 16px 0;flex-wrap:wrap}
.kpi{flex:1;min-width:96px;background:linear-gradient(180deg,rgba(255,255,255,.03),transparent 55%),var(--panel2);border:1px solid var(--line);border-radius:var(--r-m);padding:10px 12px}
.kpi:hover{border-color:var(--line2);transform:translateY(-1px)}
.kpi .v{font-family:var(--mono);font-size:17px;font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--text)}
.kpi .k{font-size:10.5px;font-weight:500;color:var(--muted);text-transform:uppercase;letter-spacing:.6px;margin-top:1px}
/* Autopilot-Status-Strip (read-only, Cockpit → Verwaltung) */
.autopilot-strip{display:flex;align-items:center;gap:10px;margin:10px 16px 0;padding:8px 12px;background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-m);text-decoration:none;color:var(--text);transition:border-color .15s}
.autopilot-strip:hover{border-color:var(--accent)}
.autopilot-strip .ap-ic{font-size:15px}
.autopilot-strip .ap-body{flex:1;font-size:12.5px}
.autopilot-strip .ap-body b{font-weight:600}
.autopilot-strip .ap-degree{color:var(--accent);font-weight:600;font-variant-numeric:tabular-nums;margin-left:4px}
.autopilot-strip.paused .ap-degree{color:var(--warn)}
.autopilot-strip .ap-meta{font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.autopilot-strip .ap-go{color:var(--muted);font-weight:700}
.approvals{padding:0 18px}.approvals:empty{padding:0}
.apv-head{font-size:12px;color:var(--warn);font-weight:700;margin:10px 0 6px;display:flex;align-items:center;gap:8px}
.apv-n{background:rgba(245,158,11,.16);border:1px solid rgba(245,158,11,.5);border-radius:999px;padding:0 8px;font-size:11px}
.apv{display:flex;align-items:center;gap:10px;background:var(--panel2);border:1px solid rgba(245,158,11,.35);border-radius:var(--r-m);padding:10px 13px;margin-bottom:6px;animation:fade .25s ease}
.apv-body{flex:1;min-width:0}.apv-body b{font-size:13px}
.apv-sum{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis}
.apv-btns{display:flex;gap:6px;flex-shrink:0}
.apv-ok{background:var(--ok);border:none;color:#04240f;border-radius:var(--r-s);padding:7px 12px;font-size:12px;font-weight:800;cursor:pointer}
.apv-ok:hover{box-shadow:0 6px 18px -6px rgba(34,197,94,.6)}
.apv-no{background:var(--panel);border:1px solid var(--line);color:var(--muted);border-radius:var(--r-s);padding:7px 11px;font-size:12px;cursor:pointer}
.apv-no:hover{border-color:var(--bad);color:#fca5a5}

.stream{flex:1;overflow:auto;padding:10px 18px}
.stream .placeholder{color:var(--muted);font-size:13px;padding:16px;border:1px dashed var(--line2);border-radius:var(--r-m);background:rgba(148,163,216,.03);line-height:1.6}
.step{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid rgba(148,163,216,.08);animation:fade .25s ease}
@keyframes fade{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.step .ic{width:22px;text-align:center;flex-shrink:0}.step .body{flex:1;font-size:13.5px}
.step .tag{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--muted)}
.step.thinking{color:var(--muted)} .step.thinking .body{font-style:italic}
.step.tool .tool-name{color:var(--accent2);font-weight:600;font-family:ui-monospace,Menlo,monospace}
.step.tool .body,.step.toolresult .body{font-family:ui-monospace,Menlo,monospace;font-size:12.5px}
.step.answer .body{color:var(--text)} .step.answer b{color:var(--accent2)}
.step.err .body{color:#fca5a5}

.examples{display:flex;gap:8px;flex-wrap:wrap;align-items:center;padding:9px 18px;border-top:1px solid var(--line)}
.examples-lbl{font-size:12px;color:var(--muted);margin-right:2px}
.chip{background:var(--panel2);border:1px solid var(--line);color:var(--text);border-radius:999px;padding:6px 13px;font-size:13px;cursor:pointer}
.chip:hover{border-color:var(--accent);background:rgba(99,102,241,.12);transform:translateY(-1px)}
.prompt-row{display:flex;gap:8px;padding:10px 18px 15px}
#cmd{flex:1;min-width:0;background:var(--panel2);border:1px solid var(--line);color:var(--text);border-radius:var(--r-m);padding:11px 13px;font-size:14px;font-family:inherit}
#cmd::placeholder{color:rgba(142,159,196,.7)}
#cmd:focus{outline:none;border-color:var(--accent);box-shadow:var(--ring)}
.prompt-row button{background:var(--panel2);border:1px solid var(--line);color:var(--text);border-radius:var(--r-m);padding:0 14px;font-size:16px;cursor:pointer}
.prompt-row button:hover{border-color:var(--accent)}
.prompt-row button.primary{background:var(--grad);border:none;font-weight:800;color:#fff}
.prompt-row button.primary:hover{box-shadow:var(--glow)}
#mic.listening{background:var(--accent2);border-color:var(--accent2);animation:pulse 1s infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(99,102,241,.5)}50%{box-shadow:0 0 0 9px rgba(99,102,241,0)}}

footer{padding:9px 22px;border-top:1px solid var(--line);color:var(--muted);font-size:11.5px;letter-spacing:.1px;background:rgba(8,12,25,.5)}footer b{color:var(--text)}
@media(max-width:900px){main{grid-template-columns:minmax(0,1fr)}.graph-panel{min-height:320px}}

/* ---------------- Gemeinsame Top-Navigation (alle Oberflächen) ---------------- */
.topnav{display:flex;gap:6px;align-items:center}
.tn{display:inline-flex;align-items:center;gap:6px;text-decoration:none;color:var(--muted);font-size:13px;font-weight:600;
  border:1px solid transparent;border-radius:999px;padding:6px 13px}
.tn:hover{color:var(--text);background:rgba(99,102,241,.10);border-color:var(--line)}
.tn.active{color:#fff;background:color-mix(in srgb, var(--accent) 20%, transparent);border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent),inset 0 1px 0 rgba(255,255,255,.08)}
.tn-ic{display:inline-flex;align-items:center}
/* Inline-SVG-Icons (Nav/Header, Lucide-Stil). Größe folgt der Schriftgröße des Containers. */
.ic{width:1.05em;height:1.05em;display:inline-block;vertical-align:-.15em;flex:0 0 auto}
.tn-ic .ic{width:15px;height:15px}
.bell .ic{width:17px;height:17px;vertical-align:-.2em}
.langsw .tb .ic{width:14px;height:14px;vertical-align:-.1em}
@media(max-width:820px){.tn-lb{display:none}.tn{padding:6px 9px}}
@media(max-width:1180px){
  header{flex-wrap:wrap;gap:8px}
  header .topnav{order:3;width:100%;max-width:100%;overflow-x:auto;padding-bottom:2px}
  header .status{margin-left:auto}
}
/* Responsive-Fix: der Bewohner-Portal-Header (body.portal) darf bei schmaler Breite (≤560/390px) nicht
   durch den Konto-Chip überlaufen — Header darf umbrechen, die schweren Chips (Name/Rolle, DE/EN, ⌘K) blenden aus. */
@media(max-width:560px){
  header{flex-wrap:wrap;gap:6px;padding-inline:12px}
  header .brand .sub{display:none}
  header .topnav{max-width:100%;overflow-x:auto}
  header .status{width:100%;max-width:100%;margin-left:0;flex-wrap:wrap;justify-content:flex-end}
  header .userchip{margin-left:0}
  header .userchip .uc-meta,header .userchip .langsw,header .userchip .cmdk-pill{display:none}
  main{padding:10px}
  .prompt-row{padding-inline:10px}
  body.portal header{flex-wrap:wrap;row-gap:6px}
  body.portal .who{flex:1 1 100%}
  body.portal .who .uc-meta,body.portal .who .langsw,body.portal .who .cmdk-pill{display:none}
}

/* ---------------- Agenten-Orchestrierung ---------------- */
.agents-main{flex:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,360px);gap:16px;padding:16px;min-height:0}
.swarm-panel{position:relative;background:radial-gradient(700px 460px at 50% 42%,#141d38 0%,var(--panel) 70%)}
#swarm{flex:1;width:100%;max-width:100%;height:100%;display:block}
.swarm-hud{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.hud-x{font-size:12px;color:var(--muted)}.hud-x b{color:var(--text);font-size:14px;font-variant-numeric:tabular-nums}
.hud-x .live-n{color:var(--accent2)}
.hud-state{border:1px solid var(--line);border-radius:999px;padding:3px 11px;color:var(--muted);font-weight:600}
.hud-state.run{color:var(--accent2);border-color:rgba(99,102,241,.4);background:rgba(99,102,241,.07)}
.swarm-legend{position:absolute;left:16px;bottom:16px;display:flex;flex-wrap:wrap;gap:10px;background:rgba(7,11,22,.7);
  border:1px solid var(--line);border-radius:var(--r-m);padding:8px 13px;backdrop-filter:blur(8px)}
.swarm-legend .lg{font-size:11px;color:var(--muted);display:inline-flex;align-items:center;gap:5px}
.swarm-legend .dot{width:9px;height:9px}
.hint-chip{margin:10px 18px 0;background:var(--grad-soft);border:1px solid rgba(99,102,241,.5);
  border-radius:var(--r-m);padding:9px 15px;font-size:12.5px;color:var(--text);text-align:center}

.side-panel{overflow:hidden}
.agent-cards{padding:10px 12px;display:flex;flex-direction:column;gap:7px;max-height:50%;overflow:auto}
.acard{display:flex;align-items:center;gap:10px;background:var(--panel2);border:1px solid var(--line);border-left:3px solid var(--c);
  border-radius:var(--r-m);padding:9px 11px}
.acard.on{background:rgba(99,102,241,.10);box-shadow:0 0 0 1px var(--c) inset,0 0 20px -6px var(--c)}
.acard-ic{width:34px;height:34px;flex-shrink:0;display:grid;place-items:center;border:1px solid;border-radius:10px;font-size:17px;background:rgba(255,255,255,.02)}
.acard-body{flex:1;min-width:0}
.acard-top{display:flex;align-items:baseline;gap:8px}.acard-top b{font-size:13.5px}
.acard-role{font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}
.acard-status{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acard.on .acard-status{color:var(--text)}
.acard-calls{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;min-width:20px;text-align:right}
.feed{flex:1;overflow:auto;padding:8px 12px;display:flex;flex-direction:column;gap:4px}
.feed .placeholder{color:var(--muted);font-size:13px;padding:14px;border:1px dashed var(--line2);border-radius:var(--r-m);background:rgba(148,163,216,.03)}
.frow{display:flex;align-items:center;gap:8px;padding:6px 4px;border-bottom:1px solid rgba(148,163,216,.07);font-size:12.5px;animation:fade .25s ease}
.fdot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.fic{flex-shrink:0}.ftx{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.ftx b{color:var(--text)}
.ftm{color:var(--muted);font-size:10.5px;flex-shrink:0;font-variant-numeric:tabular-nums}

.console-bar{border-top:1px solid var(--line);background:rgba(8,12,25,.72);backdrop-filter:blur(14px);padding:10px 16px}
.console-bar .examples{border:none;padding:0 0 8px}
.console-bar .prompt-row{padding:0}
.console-bar .prompt-row button.primary{padding:0 16px;font-weight:700}
@media(max-width:900px){.agents-main{grid-template-columns:1fr}.side-panel{min-height:280px}.swarm-panel{min-height:360px}}

/* ---------------- Nutzer-Chip (in jeder Kopfzeile) ---------------- */
.langsw{display:inline-flex;gap:2px;border:1px solid var(--line);border-radius:999px;padding:2px;margin-right:4px;background:var(--panel2)}
.langsw .lb{background:transparent;border:none;color:var(--muted);border-radius:999px;padding:3px 9px;font-size:11px;font-weight:800;cursor:pointer;letter-spacing:.4px}
.langsw .lb:hover{color:var(--text)}
.langsw .lb.on{background:var(--grad);color:#fff}
/* ⌘K-Palette-Pill im Header (dezent, wie die übrigen Controls) */
.cmdk-pill{display:inline-flex;align-items:center;background:var(--panel2);border:1px solid var(--line);color:var(--muted);border-radius:var(--r-s);padding:4px 9px;font-size:11px;font-weight:700;letter-spacing:.3px;cursor:pointer;margin-right:4px;font-family:inherit}
.cmdk-pill:hover{border-color:var(--accent);color:var(--text)}
.cmdk-pill:focus-visible{outline:none;box-shadow:var(--ring)}
.login-top{display:flex;align-items:center;justify-content:space-between}
.userchip{display:inline-flex;align-items:center;gap:9px;margin-left:6px;min-width:0;max-width:100%}
.uc-av{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:800;
  background:var(--grad);color:#fff;box-shadow:0 4px 14px -4px rgba(99,102,241,.6)}
.uc-meta{display:flex;flex-direction:column;line-height:1.15;min-width:0;max-width:132px}.uc-meta b{font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.uc-role{font-size:10.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.uc-out{background:var(--panel2);border:1px solid var(--line);color:var(--muted);border-radius:var(--r-s);padding:4px 9px;cursor:pointer;font-size:14px}
.uc-out:hover{border-color:var(--accent2);color:var(--text)}

/* Benachrichtigungs-Glocke (alle Flächen) */
.bell{position:relative;cursor:pointer;font-size:16px;line-height:1;padding:5px 7px;border-radius:var(--r-s);user-select:none;background:transparent;border:0;color:inherit;font-family:inherit}
.bell:hover{background:var(--panel2)}
.bell:focus-visible{outline:none;box-shadow:var(--ring)}
/* Dezenter Lade-Fehler-Hinweis (statt stumm leerer Panels) */
.loaderr{color:var(--muted);font-size:12px;padding:8px 2px;line-height:1.5}
.loaderr a{color:var(--accent);text-decoration:none;font-weight:600}
.loaderr a:hover{text-decoration:underline}
.bell-badge{position:absolute;top:-2px;right:-2px;min-width:16px;height:16px;border-radius:999px;background:var(--grad);
  color:#fff;font-size:9.5px;font-weight:800;display:grid;place-items:center;padding:0 4px;box-shadow:0 3px 10px -2px rgba(99,102,241,.7)}
.bell-badge[hidden]{display:none}
.bell-panel{position:absolute;right:0;top:calc(100% + 10px);width:330px;max-height:420px;overflow:auto;z-index:60;
  background:var(--panel);border:1px solid var(--line);border-radius:var(--r-l);box-shadow:0 22px 60px -18px rgba(0,0,0,.55);
  text-align:left;font-size:12.5px;cursor:default}
.bell-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--panel)}
.bell-item{display:flex;gap:9px;align-items:flex-start;padding:9px 12px;border-bottom:1px solid var(--line);color:var(--muted)}
.bell-item:last-child{border-bottom:none}
.bell-item.unread{color:var(--text);background:color-mix(in srgb, var(--accent) 7%, transparent)}
.bell-item b{font-weight:700}
.bell-ic{flex:0 0 auto}

/* ---------------- Login (erster Eindruck) ---------------- */
.login-body{display:grid;place-items:center;min-height:100vh;position:relative;overflow:hidden}
/* Ein ruhiger, statischer Indigo-Schimmer statt driftender Blur-Blobs (Premium-Politur). */
.login-body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(760px 460px at 50% -8%, color-mix(in srgb, var(--accent) 14%, transparent) 0%, transparent 62%)}
.login-wrap{width:100%;max-width:430px;padding:20px;position:relative;z-index:1}
.login-card{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,0) 38%),rgba(15,22,43,.82);
  border:1px solid var(--line2);border-radius:22px;padding:24px 22px;
  box-shadow:var(--shadow-lg),inset 0 1px 0 rgba(255,255,255,.06);backdrop-filter:blur(22px) saturate(140%)}
.login-brand{font-size:27px;font-weight:var(--fw-brand);letter-spacing:-.03em}
.login-brand .logo{margin-right:9px;font-size:26px}
.login-sub{color:var(--muted);font-size:12.5px;margin:6px 0 24px;line-height:1.55}
.login-form{display:flex;flex-direction:column;gap:13px}
.login-form label{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:600;color:var(--muted);letter-spacing:.2px}
.login-form input{background:rgba(7,11,22,.65);border:1px solid var(--line);color:var(--text);border-radius:var(--r-m);padding:12px 14px;font-size:14px;font-family:inherit}
.login-form input:focus{outline:none;border-color:var(--accent);box-shadow:var(--ring)}
.login-form .primary{margin-top:6px;background:var(--grad);border:none;color:#fff;border-radius:var(--r-m);padding:13px;font-weight:800;font-size:14px;letter-spacing:.2px;cursor:pointer}
.login-form .primary:hover{box-shadow:var(--glow);filter:brightness(1.06)}
.login-err{color:#fca5a5;font-size:12.5px;min-height:16px}
.login-note{font-size:11px;color:var(--muted);margin-top:14px;line-height:1.55}
/* Konto-Lebenszyklus (Baustein 2): Textlink „Passwort vergessen?" / „Zurück" + Passwort-Regel-Hinweis */
.login-link{background:none;border:none;color:var(--accent);font-size:12px;font-weight:600;cursor:pointer;padding:2px 0;align-self:flex-start;font-family:inherit}
.login-link:hover{text-decoration:underline;filter:brightness(1.12)}
.login-hint{font-size:11px;color:var(--muted);margin-top:-4px}

/* ---------------- Verwaltung (Stammdaten anlegen) ---------------- */
.manage-main{flex:1;padding:16px;overflow:auto;position:relative}
.mgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.card-wide{grid-column:1 / -1}
.frow2{display:flex;gap:8px}.frow2>*{flex:1;min-width:0}
.pform select{background:var(--panel2);border:1px solid var(--line);color:var(--text);border-radius:var(--r-s);padding:10px 12px;font-size:14px;font-family:inherit}
.pform select:focus{outline:none;border-color:var(--accent);box-shadow:var(--ring)}
.pform button.danger,button.danger{background:rgba(239,68,68,.14);border:1px solid rgba(239,68,68,.5);color:#fca5a5}
.pform button.danger:hover,button.danger:hover{background:rgba(239,68,68,.25);box-shadow:none}
.mlist{margin-top:12px;display:flex;flex-direction:column;gap:6px;max-height:240px;overflow:auto}
.mempty{color:var(--muted);font-size:12.5px;padding:14px;border:1px dashed var(--line2);border-radius:var(--r-m);background:rgba(148,163,216,.03);text-align:center}
.mrow{display:flex;align-items:center;gap:8px;background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-s);padding:9px 12px;font-size:13px}
.mrow:hover{border-color:var(--line2)}
.mrow b{font-size:13px}.mrow .muted{margin-left:auto;font-size:11.5px}
.tagpill{font-size:10px;font-weight:700;border-radius:999px;padding:2px 9px;text-transform:uppercase;letter-spacing:.4px}
.tagpill.free{color:var(--ok);border:1px solid rgba(34,197,94,.4);background:rgba(34,197,94,.07)}
.tagpill.occupied{color:var(--muted);border:1px solid var(--line)}
/* B3 Miet-Ökonomie: Live-Warmmiete im Formular + Kalt/NK/Warm-Split je Vertragszeile */
.econ-warm{display:flex;align-items:center;justify-content:space-between;gap:8px;background:var(--panel2);border:1px dashed var(--line);border-radius:var(--r-s);padding:8px 12px;font-size:12px;color:var(--muted)}
.econ-warm b{font-size:14px;color:var(--text)}
.econ-split{font-size:11.5px;line-height:1.5;margin-top:2px}
.econ-split b{color:var(--text)}
.ticketrow{align-items:flex-start}.tk-main{flex:1;min-width:0}
.tstates{display:flex;gap:5px;flex-shrink:0}
.tstate{background:var(--panel);border:1px solid var(--line);color:var(--muted);border-radius:8px;padding:4px 10px;font-size:11px;font-weight:600;cursor:pointer;text-transform:capitalize}
.tstate:hover{border-color:var(--accent);color:var(--text)}
.tstate.on{background:var(--grad-soft);border-color:var(--accent);color:var(--text)}
.factory-reset-card{margin-top:16px}
.op-status{font-size:12px;color:var(--muted);margin-bottom:8px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.chk{font-size:12.5px;color:var(--muted);display:flex;align-items:center;gap:6px}
.portal2 #toast,.manage-main #toast{position:fixed;top:auto;left:auto;right:22px;bottom:22px}
.tk{cursor:pointer}.tk:hover{border-color:rgba(99,102,241,.5);background:rgba(99,102,241,.05)}
@media(max-width:800px){.mgrid{grid-template-columns:1fr}}

/* ---------------- KOVA-Admin ---------------- */
.admin-main{flex:1;padding:16px;overflow:auto;width:100%;max-width:1480px;margin:0 auto}
.admin-main .kpis{padding:0 0 16px;flex-wrap:wrap}
.admin-main .kpi{min-width:104px}
.admin-main .card th,.admin-main .card td{text-align:left;white-space:nowrap}
.admin-main .card td{overflow:hidden;text-overflow:ellipsis;max-width:220px}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.card-head h3{margin:0}
.audit-tools{display:flex;align-items:center;gap:8px}
.audit-tools select{background:var(--panel2);border:1px solid var(--line);color:var(--text);border-radius:var(--r-s);padding:6px 10px;font-size:12.5px;font-family:inherit}
.audit-tools .auto{font-size:12px;color:var(--muted);display:inline-flex;align-items:center;gap:5px}
.mono{font-family:ui-monospace,Menlo,monospace;font-size:12px}.muted{color:var(--muted)}
.rolepill{font-size:11px;font-weight:600;border-radius:999px;padding:3px 10px;border:1px solid var(--line)}
.rolepill.r-admin{color:#a5b4fc;border-color:rgba(99,102,241,.5);background:rgba(99,102,241,.12)}
.rolepill.r-operator{color:#67e8f9;border-color:rgba(34,211,238,.4);background:rgba(34,211,238,.06)}
.rolepill.r-owner{color:#93c5fd;border-color:rgba(96,165,250,.4);background:rgba(96,165,250,.06)}
.rolepill.r-resident{color:#fda4af;border-color:rgba(251,113,133,.4);background:rgba(251,113,133,.07)}
/* Integration Hub */
.integrations{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.intg{background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-m);padding:13px 15px}
.intg:hover{border-color:var(--line2);transform:translateY(-1px)}
.intg.live{border-color:rgba(34,197,94,.4)}
.intg-top{display:flex;align-items:center;gap:8px}
.intg-top b{font-size:14px}
.intg-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.intg-dot.ok{background:var(--ok);box-shadow:0 0 8px var(--ok)}.intg-dot.bad{background:var(--bad)}
.intg-cat{font-size:10.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
.modepill{margin-left:auto;font-size:10px;font-weight:800;border-radius:999px;padding:2px 9px;letter-spacing:.5px}
.modepill.m-live{color:var(--ok);border:1px solid rgba(34,197,94,.5);background:rgba(34,197,94,.10)}
.modepill.m-na{color:var(--muted);border:1px solid var(--line);background:var(--surface-2)}
.intg-vendor{font-size:11.5px;color:var(--muted);margin:6px 0 8px}
.intg-caps{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:8px}
.cap{font-size:10.5px;color:var(--text);background:rgba(99,102,241,.12);border:1px solid var(--line);border-radius:999px;padding:2px 9px}
.intg-health{font-size:11px;color:var(--muted);line-height:1.5}
.intg-env{margin-top:4px}.intg-env code{background:var(--bg);border:1px solid var(--line);border-radius:5px;padding:1px 5px;font-size:10.5px;color:var(--accent)}
.intg-actions{margin-top:10px}
.test-btn{background:var(--panel);border:1px solid var(--line);color:var(--text);border-radius:var(--r-s);padding:6px 13px;font-size:12px;font-weight:600;cursor:pointer}
.test-btn:hover{border-color:var(--accent);background:rgba(99,102,241,.08)}
.intg-test{margin-top:8px}
.t-res{border-radius:var(--r-s);padding:8px 10px;font-size:11.5px;border:1px solid var(--line)}
.t-res b{font-size:12px}.t-res .t-msg{color:var(--muted);margin-top:3px;line-height:1.45}
.t-res.t-ok{border-color:rgba(34,197,94,.5);background:rgba(34,197,94,.08)}.t-res.t-ok b{color:var(--ok)}
.t-res.t-err{border-color:rgba(239,68,68,.5);background:rgba(239,68,68,.07)}.t-res.t-err b{color:#fca5a5}
.t-res.t-na{border-color:rgba(245,158,11,.4)}.t-res.t-na b{color:var(--warn)}
.t-res.t-run{color:var(--muted)}
.t-miss{margin-top:5px}.t-miss code{background:var(--bg);border:1px solid var(--line);border-radius:5px;padding:1px 5px;font-size:10.5px;color:var(--accent2)}
.t-sample{margin:6px 0 0;background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:6px 8px;font-size:10.5px;color:var(--muted);max-height:120px;overflow:auto;white-space:pre-wrap}
@media(max-width:900px){.integrations{grid-template-columns:1fr}}

.audit{display:flex;flex-direction:column;gap:2px;max-height:46vh;overflow:auto}
.audit .placeholder{color:var(--muted);font-size:13px;padding:14px;border:1px dashed var(--line2);border-radius:var(--r-m);background:rgba(148,163,216,.03)}
.arow{display:grid;grid-template-columns:24px 130px 150px 1fr 150px;gap:10px;align-items:center;padding:7px 6px;
  border-bottom:1px solid rgba(148,163,216,.07);font-size:12.5px}
.arow:hover{background:rgba(148,163,216,.04)}
.arow .a-ic{text-align:center}
.arow .a-actor{color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.arow .a-act{color:var(--accent2)}
.arow .a-detail{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.arow .a-time{color:var(--muted);text-align:right;font-variant-numeric:tabular-nums}
@media(max-width:800px){.arow{grid-template-columns:20px 1fr;gap:4px}.arow .a-act,.arow .a-time{display:none}}

/* ---------------- Mieterportal ---------------- */
.who{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);min-width:0;flex-shrink:1;justify-content:flex-end;flex-wrap:wrap;row-gap:4px}
.who select{background:var(--panel2);border:1px solid var(--line);color:var(--text);border-radius:var(--r-s);padding:7px 10px;font-size:14px;font-family:inherit}
.portal-main{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:16px;overflow:auto;align-content:start}
.card{background:linear-gradient(180deg,rgba(255,255,255,.028),rgba(255,255,255,0) 42%),var(--panel);
  border:1px solid var(--line);border-radius:var(--r-l);padding:16px 18px;margin-bottom:16px;box-shadow:var(--shadow)}
.card h3{margin:0 0 12px;font-size:14px;font-weight:var(--fw-heading);letter-spacing:-.01em}
.card table{width:100%;border-collapse:collapse}
.card td{padding:8px 0;font-size:13.5px;border-bottom:1px solid rgba(148,163,216,.08)}
.card tr:last-child td{border-bottom:none}
.card td:first-child{color:var(--muted);width:42%}
.card .foot{color:var(--muted);font-size:12px;margin-top:10px;line-height:1.55}
.pform{display:flex;flex-direction:column;gap:8px}
.pform input,.pform textarea{background:var(--panel2);border:1px solid var(--line);color:var(--text);border-radius:var(--r-s);padding:10px 12px;font-size:14px;font-family:inherit}
.pform input::placeholder,.pform textarea::placeholder{color:rgba(142,159,196,.65)}
.pform textarea{min-height:70px;resize:vertical}
.pform input:focus,.pform textarea:focus{outline:none;border-color:var(--accent);box-shadow:var(--ring)}
.pform button{background:var(--grad);border:none;color:#fff;border-radius:var(--r-s);padding:11px;font-weight:700;cursor:pointer;letter-spacing:.2px}
.pform button:hover{box-shadow:var(--glow);filter:brightness(1.05)}
.tickets{display:flex;flex-direction:column;gap:8px}
.ticket{display:flex;justify-content:space-between;align-items:center;background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-m);padding:10px 13px;cursor:pointer}
.ticket:hover{border-color:rgba(99,102,241,.5);background:rgba(99,102,241,.05)}
.ticket .meta{color:var(--muted);font-size:11px}
.pill{font-size:11px;font-weight:700;border-radius:999px;padding:3px 10px;text-transform:uppercase;letter-spacing:.4px}
.pill.offen{color:var(--warn);border:1px solid rgba(245,158,11,.4);background:rgba(245,158,11,.06)}
.pill.in_arbeit{color:#a5b4fc;border:1px solid rgba(99,102,241,.4);background:rgba(99,102,241,.08)}
.pill.erledigt{color:var(--ok);border:1px solid rgba(34,197,94,.4);background:rgba(34,197,94,.07)}
/* Aufenthalte (B1): Status-Pills, Zeitraum-Felder, Verfügbarkeits-Hinweis, Folio, Aktionen */
.pill.sy-gebucht{color:var(--warn);border:1px solid rgba(245,158,11,.4);background:rgba(245,158,11,.06)}
.pill.sy-eingecheckt{color:#7dd3fc;border:1px solid rgba(56,189,248,.4);background:rgba(56,189,248,.08)}
.pill.sy-ausgecheckt{color:var(--ok);border:1px solid rgba(34,197,94,.4);background:rgba(34,197,94,.07)}
.pill.sy-storniert{color:var(--muted);border:1px solid var(--line2);background:rgba(148,163,216,.05)}
.pill.sy-no_show{color:#fca5a5;border:1px solid rgba(239,68,68,.4);background:rgba(239,68,68,.07)}
.sy-datelbl{display:flex;flex-direction:column;gap:4px;font-size:11px;color:var(--muted);flex:1;min-width:0}
.sy-datelbl input{background:var(--panel2);border:1px solid var(--line);color:var(--text);border-radius:var(--r-s);padding:9px 12px;font-size:14px;font-family:inherit}
.sy-datelbl input:focus{outline:none;border-color:var(--accent);box-shadow:var(--ring)}
.sy-avail{font-size:12px;font-weight:600;min-height:16px}
.sy-avail.ok{color:var(--ok)} .sy-avail.busy{color:var(--warn)}
.sy-filters{display:flex;gap:4px;flex-wrap:wrap}
.sy-row .sy-ic{font-size:16px;flex-shrink:0}
.sy-row.sel{border-color:var(--accent);box-shadow:var(--ring)}
.sy-acts{display:flex;gap:4px;flex-wrap:wrap;flex-shrink:0}
.sy-acts .tstate.danger{background:rgba(239,68,68,.14);border-color:rgba(239,68,68,.5);color:#fca5a5}
.sy-folio{margin-top:12px;background:var(--panel2);border:1px solid var(--line2);border-radius:var(--r-m);padding:12px 14px}
.sy-fline{display:flex;justify-content:space-between;gap:12px;font-size:13px;padding:5px 0;border-bottom:1px solid var(--line)}
.sy-fline:last-child{border-bottom:none}
.sy-fline.muted{color:var(--muted);justify-content:flex-start}
.sy-fline.total{font-size:15px;padding-top:9px;margin-top:3px;border-top:1px solid var(--line2);border-bottom:none}
.sy-fline.total b{color:var(--accent2)}
@media(max-width:800px){.portal-main{grid-template-columns:1fr}}

/* ---------------- Mieter-Superapp (getabbt) ---------------- */
.tabbar{display:flex;gap:16px;overflow-x:auto;padding:8px 16px;border-bottom:1px solid var(--line);background:rgba(8,12,25,.6);backdrop-filter:blur(10px);flex-wrap:wrap;align-items:flex-start}
/* Tab-Cluster: kleines Label über der Tab-Gruppe (klare Hierarchie statt 18er-Wand) */
.tabgroup{display:flex;flex-direction:column;gap:5px}
.tabgroup-lbl{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;color:var(--muted);opacity:.6;padding-left:3px}
.tabgroup-tabs{display:flex;gap:6px;flex-wrap:wrap}
.tab{background:var(--panel2);border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:7px 14px;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
.tab:hover{color:var(--text);border-color:var(--accent);transform:translateY(-1px)}
.tab.active{background:color-mix(in srgb, var(--accent) 20%, transparent);border-color:var(--accent);color:#fff;box-shadow:inset 0 0 0 1px var(--accent),inset 0 1px 0 rgba(255,255,255,.08)}
.portal2{flex:1;overflow:auto;padding:16px;position:relative}
.pane{display:none;max-width:1020px;margin:0 auto}.pane.active{display:block;animation:fade .22s ease}
.hero h3{margin:0}.emerg-hero h3{color:#fca5a5}
.annlist{display:flex;flex-direction:column;gap:8px}
.ann{background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-m);padding:11px 13px}
.ann.pin{border-color:rgba(245,158,11,.45);background:linear-gradient(180deg,rgba(245,158,11,.05),transparent 60%),var(--panel2)}
.ann b{font-size:13.5px}.ann-b{font-size:13px;color:var(--text);margin:3px 0;line-height:1.55}.ann .meta{color:var(--muted);font-size:11px}

.paylist{display:flex;flex-direction:column;gap:6px}
.payrow{display:grid;grid-template-columns:1fr auto auto auto auto;gap:12px;align-items:center;background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-s);padding:10px 13px;font-size:13.5px}
.payrow:hover{border-color:var(--line2)}
.payrow .muted{font-size:12px}
.pay-letter{grid-column:1/-1;padding:7px 10px;border-left:3px solid var(--line);color:var(--muted);font-size:12.5px;font-style:italic;line-height:1.5}
.paybtn{background:var(--accent);border:none;color:#fff;border-radius:var(--r-s);padding:5px 12px;font-size:12px;cursor:not-allowed;opacity:.55}

.doclist{display:flex;flex-direction:column;gap:8px}
.docitem{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-m);padding:12px 14px;cursor:pointer;color:var(--text);font-family:inherit}
.docitem:hover{border-color:var(--accent);background:rgba(99,102,241,.06);transform:translateY(-1px)}
.docic{font-size:20px}.docitem b{display:block;font-size:14px}.docitem .muted{font-size:11.5px}
.docitem span:nth-child(2){flex:1}.docarrow{color:var(--muted)}
a.docitem{text-decoration:none}                                   /* PDF-Download als <a> — kein Link-Unterstrich */
.ho-pdf{text-decoration:none;display:inline-flex;align-items:center;gap:4px}  /* Protokoll-Download im Übergabe-Detail */
.docbody{white-space:pre-wrap;font-family:inherit;font-size:13.5px;line-height:1.65;color:var(--text);margin:0}

.thread{display:flex;flex-direction:column;gap:8px;max-height:320px;overflow:auto;padding:6px 0 12px}
.msg{max-width:78%;padding:10px 13px;border-radius:14px;font-size:13.5px;line-height:1.5;animation:fade .2s ease}
.msg .msg-b{white-space:pre-wrap}   /* mehrzeilige (KI-)Antworten mit Absätzen anzeigen */
/* KI-Antwortentwurf: opMsg ist eine Textarea (mehrzeilige Entwürfe behalten ihre Umbrüche), Look wie #cmd */
.prompt-row textarea#opMsg{flex:1;background:var(--panel2);border:1px solid var(--line);color:var(--text);border-radius:var(--r-m);padding:11px 13px;font-size:14px;font-family:inherit;resize:vertical;min-height:44px;line-height:1.4}
.prompt-row textarea#opMsg:focus{outline:none;border-color:var(--accent)}
.msg .meta{font-size:10.5px;color:var(--muted);margin-top:4px}
.msg.resident{align-self:flex-end;background:var(--grad-soft);border:1px solid rgba(99,102,241,.42);border-bottom-right-radius:5px}
.msg.operator{align-self:flex-start;background:var(--panel2);border:1px solid var(--line);border-bottom-left-radius:5px}

.events{display:flex;flex-direction:column;gap:10px}
.event{display:flex;gap:12px;align-items:center;background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-m);padding:12px 14px}
.event:hover{border-color:var(--line2)}
.ev-ic{font-size:27px;filter:drop-shadow(0 2px 8px rgba(0,0,0,.4))}.ev-body{flex:1;min-width:0}.ev-body b{font-size:14px}
.ev-desc{font-size:12.5px;color:var(--text);margin:2px 0}.ev-meta{font-size:11px;color:var(--muted)}
.rsvp{background:var(--panel);border:1px solid var(--line);color:var(--text);border-radius:var(--r-s);padding:8px 14px;font-size:13px;font-weight:600;cursor:pointer;flex-shrink:0}
.rsvp:hover{border-color:var(--accent);background:rgba(99,102,241,.08)}
.rsvp.on{background:var(--ok);border-color:var(--ok);color:#04240f;font-weight:800}

.services{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:6px}
.svc{display:flex;align-items:center;gap:8px;background:var(--panel2);border:1px solid var(--line);color:var(--text);border-radius:var(--r-m);padding:12px 16px;font-size:13.5px;font-weight:600;cursor:pointer;font-family:inherit}
.svc:hover{border-color:var(--accent);background:rgba(99,102,241,.10);transform:translateY(-1px)}.svc-ic{font-size:18px}
.offerings{display:flex;flex-direction:column;gap:8px}
.offer{display:flex;align-items:center;gap:12px;background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-m);padding:12px 14px}
.offer:hover{border-color:var(--line2)}
.offer-ic{font-size:24px}.offer-b{flex:1;min-width:0}.offer-b b{font-size:14px}
.offer-price{font-size:12.5px;font-weight:700;color:var(--accent);margin-top:2px}
.offer-btn{background:var(--grad);border:none;color:#fff;border-radius:var(--r-s);padding:8px 15px;font-size:13px;font-weight:700;cursor:pointer;flex-shrink:0}
.offer-btn:hover{box-shadow:var(--glow)}
.reqlist{display:flex;flex-direction:column;gap:6px}
.reqrow{display:flex;align-items:center;gap:10px;background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-s);padding:9px 12px;font-size:13px}
.reqrow .muted{flex:1;color:var(--muted)}
.pill.in_arbeit{color:#a5b4fc;border:1px solid rgba(99,102,241,.4)}

.emerglist{display:flex;flex-direction:column;gap:10px}
.emerg{background:linear-gradient(180deg,rgba(239,68,68,.05),transparent 55%),var(--panel2);border:1px solid rgba(239,68,68,.3);border-radius:var(--r-m);padding:13px 15px}
.emerg-h{display:flex;align-items:center;justify-content:space-between;gap:10px}.emerg-h b{font-size:14px}
.callbtn{background:rgba(239,68,68,.15);border:1px solid rgba(239,68,68,.5);color:#fca5a5;border-radius:999px;padding:6px 13px;font-size:13px;font-weight:700;text-decoration:none;white-space:nowrap}
.callbtn:hover{background:rgba(239,68,68,.28);box-shadow:0 6px 20px -8px rgba(239,68,68,.5)}
.emerg-b{font-size:13px;color:var(--text);margin-top:5px;line-height:1.6}

/* Rollen-Chat §7.3: tote Resident-Chat-CSS entfernt (.concierge-card/.cx-stream/.cx-step*/.cx-examples).
   Die deterministische Tipps-Fläche nutzt weiterhin .tips-chips (siehe unten) — kein Chat. */
.toggle{background:var(--panel2)!important}.toggle.on{background:var(--accent2)!important;border-color:var(--accent2)!important;color:#fff!important}

/* ---------------- Owner-Portal ---------------- */
.owner-main{flex:1;padding:16px;overflow:auto;width:100%;max-width:1480px;margin:0 auto}
.owner-main .kpis{padding:0 0 16px}
.grid2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.card th{text-align:left;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);padding:6px 0;border-bottom:1px solid var(--line)}
.card th:not(:first-child),.card td:not(:first-child){text-align:right}
.card tbody tr:hover td{background:rgba(148,163,216,.03)}
.regime{display:flex;flex-direction:column;gap:10px;margin:6px 0}
.rrow{display:grid;grid-template-columns:1fr 120px 70px;align-items:center;gap:10px;font-size:13px}
.rbar{background:var(--panel2);border-radius:999px;height:9px;overflow:hidden}
.rbar>div{height:100%;background:var(--grad);border-radius:999px}
.rval{text-align:right;color:var(--muted);font-variant-numeric:tabular-nums}
.report{font-size:14px;line-height:1.65}.report b{color:var(--accent2)}
@media(max-width:800px){.grid2{grid-template-columns:1fr}}
@media print{header,footer,#print{display:none}body{background:#fff;color:#000}.card{border-color:#ccc;box-shadow:none}}

/* ---------------- Event-Foto-Galerie (Portal + Verwaltung) ---------------- */
.photogrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;margin-top:6px}
.photo{position:relative;margin:0}
.photo img{width:100%;height:110px;object-fit:cover;border-radius:var(--r-m);border:1px solid var(--line);display:block;transition:transform .2s ease,box-shadow .2s ease}
.photo img:hover{transform:scale(1.03);box-shadow:var(--shadow)}
.photo figcaption{font-size:11px;color:var(--muted);margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.photo .pdel{position:absolute;top:5px;right:5px;background:rgba(7,11,22,.8);border:1px solid var(--line);color:#fca5a5;border-radius:7px;cursor:pointer;font-size:12px;padding:1px 6px;backdrop-filter:blur(4px)}
.photo .pdel:hover{border-color:var(--bad)}
.attendees{font-size:12px;color:var(--muted);margin-top:2px}

/* ---------------- Balanced Scorecard (Betreiber + Owner) ---------------- */
.bsc-main{flex:1;padding:16px;overflow:auto;width:100%;max-width:1480px;margin:0 auto}
.bsc-agents{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 10px}
.bsc-agent{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--muted);
  border:1px solid var(--line);border-radius:999px;padding:5px 12px;background:var(--panel2);transition:.25s}
.bsc-agent .ba-ic{font-size:14px}
.bsc-agent.on{color:var(--text);border-color:var(--c);box-shadow:0 0 0 1px var(--c) inset,0 0 16px -6px var(--c);transform:translateY(-1px)}
.bsc-status{font-size:12.5px;color:var(--muted);line-height:1.55}
.bsc-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.bsc-col h3{margin-bottom:12px}
.bsc-kpis{display:flex;flex-direction:column;gap:8px}

/* ---- Kopf-Aktionen: Ampel-An/Aus-Schalter (Founder §9) + Run ---- */
.bsc-head-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.bsc-ampel-toggle{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--muted);
  border:1px solid var(--line);border-radius:999px;padding:5px 12px;background:var(--panel2);cursor:pointer;transition:.2s}
.bsc-ampel-toggle:hover{border-color:var(--line2);color:var(--text)}
.bsc-ampel-toggle.on{color:var(--text);border-color:var(--line2)}
.bsc-ampel-dots{display:inline-flex;gap:3px}
.bsc-ampel-dots i{width:7px;height:7px;border-radius:50%;background:var(--line2);transition:.2s}
.bsc-ampel-toggle.on .d-ok{background:var(--ok)}
.bsc-ampel-toggle.on .d-warn{background:var(--warn)}
.bsc-ampel-toggle.on .d-bad{background:var(--bad)}
/* ---- Objekt-Umschalter: kompakter Select, in .bsc-head-actions eingereiht ---- */
.bsc-property{font-size:12px;font-weight:600;color:var(--text);border:1px solid var(--line);border-radius:999px;
  padding:5px 12px;background:var(--panel2);cursor:pointer;transition:.2s;max-width:220px}
.bsc-property:hover{border-color:var(--line2)}
.bsc-property:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.bsc-property[hidden]{display:none}

/* ---- kompakte KPI-Kachel (~56–60px): Label · 6px-Dot+Wert · Spark+Trend ---- */
.bkpi{background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-m);padding:8px 11px;animation:fade .3s ease;
  cursor:pointer;border-left:3px solid var(--line2)}
.bkpi:hover{border-color:var(--line2);transform:translateY(-1px)}
.bkpi:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.bkpi-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.bkpi-lbl{font-size:10.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.bkpi-agent{font-size:13px;flex-shrink:0}
.bkpi-mid{display:flex;align-items:baseline;gap:7px;margin:2px 0 1px}
.bkpi-val{font-size:15px;font-weight:var(--fw-brand);letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--text)}
/* Gradient-Großzahl NUR bei P1-KPIs (Founder-Entscheidung) — Rest bleibt ruhig. */
.bkpi.p1 .bkpi-val{font-family:var(--mono);font-size:17px;font-weight:600;color:var(--text)}
/* tenantWide-Badge kennzeichnet mandantenweite KPIs in der Objekt-Sicht. */
.bkpi-tenantwide{font-size:8.5px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);
  border:1px solid var(--line2);border-radius:4px;padding:1px 4px;align-self:center;white-space:nowrap}
.bkpi-foot{display:flex;align-items:center;gap:8px;font-size:10.5px;color:var(--muted);min-width:0}
.bkpi-spark{width:72px;height:20px;flex:0 0 auto}
.bkpi-tgt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-left:auto}
/* 6px-Ampel-Punkt je Status (nur Punkt; bad zusätzlich dezente Flächen-Tönung). */
.bkpi-dot{width:6px;height:6px;border-radius:50%;background:var(--line2);flex:0 0 auto}
.bkpi.ok .bkpi-dot{background:var(--ok)}
.bkpi.warn .bkpi-dot{background:var(--warn)}
.bkpi.bad .bkpi-dot{background:var(--bad);box-shadow:0 0 6px var(--bad)}
.bkpi.bad{background:color-mix(in srgb,var(--bad) 6%,var(--panel2))}
.bkpi.ok{border-left-color:var(--ok)}
.bkpi.warn{border-left-color:var(--warn)}
.bkpi.bad{border-left-color:var(--bad)}
.bkpi.info{border-left-color:var(--line2)}
/* Ampel-Aus: Punkte + Flächen-Tönung + farbige Kante ausblenden (Grid-Klasse). */
.no-ampel .bkpi{border-left-color:var(--line2)!important;background:var(--panel2)!important}
.no-ampel .bkpi-dot{display:none}
/* Trend-Chip: ▲/▼/→ + Delta, Farbe aus trend.good. */
.bkpi-trend{display:inline-flex;align-items:center;gap:2px;font-weight:700;font-variant-numeric:tabular-nums;
  white-space:nowrap;color:var(--muted)}
.bkpi-trend.good{color:var(--ok)}
.bkpi-trend.bad{color:var(--bad)}
.bkpi-trend.flat{color:var(--muted)}

/* ---- Segment-Modul-Sektionen (einklappbare Karten unter dem 4er-Grid) ---- */
.bsc-modules{display:flex;flex-direction:column;gap:14px;margin-top:16px}
.bmod{padding:0;overflow:hidden}
.bmod-head{display:flex;align-items:center;gap:10px;width:100%;padding:12px 15px;background:none;border:none;
  cursor:pointer;color:var(--text);font:inherit;text-align:left}
.bmod-head:hover{background:color-mix(in srgb,var(--accent) 5%,transparent)}
.bmod-badge{font-size:13px;font-weight:800;letter-spacing:.2px}
.bmod-count{font-size:11px;font-weight:700;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:1px 8px;
  font-variant-numeric:tabular-nums}
.bmod-chev{margin-left:auto;color:var(--muted);transition:transform .2s ease}
.bmod.collapsed .bmod-chev{transform:rotate(-90deg)}
.bmod-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:0 15px 14px}
.bmod.collapsed .bmod-kpis{display:none}

/* ---- Übersichts-Charts (3. Finale): 2 große Charts zwischen Leiste und Grid ---- */
.bsc-overview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:16px}
.bsc-ov-card h3{margin-bottom:10px}
.bsc-ov-canvas{position:relative;height:190px}
.bsc-ov-canvas canvas{width:100%;height:100%;display:block}
.bsc-ov-cap{font-size:11px;margin-top:6px}

@media(max-width:1150px){.bsc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.bmod-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.bsc-overview{grid-template-columns:1fr}}
@media(max-width:700px){.bsc-grid{grid-template-columns:1fr}.bmod-kpis{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.bkpi,.bsc-agent,.bmod-chev,.bkpi:hover{animation:none;transition:none;transform:none}}

/* Mein Tag: Missions-Karten (der KI-Betrieb arbeitet vor) */
.mission{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-s);
  margin-bottom:9px;background:color-mix(in srgb, var(--accent) 4%, transparent);transition:border-color .15s ease, transform .15s ease}
.mission:hover{border-color:var(--accent2);transform:translateX(2px)}
.mission .m-ic{font-size:20px;flex:0 0 auto}
.mission .m-body{flex:1;min-width:0;font-size:13px}
.mission-more{color:var(--muted);font-size:12px;padding:9px 4px 2px;text-align:center}
/* „alle anzeigen"-Umschalter für gedeckelte Listen (Pagination-Cap bei 300+ Zeilen) */
.listmore{display:block;width:100%;margin:6px 0 2px;padding:8px;background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-s);color:var(--accent);font-size:12px;font-weight:600;cursor:pointer;font-family:inherit}
.listmore:hover{border-color:var(--accent)}
/* A2 „Warum?"-Panel an Missions-Karten (erklärbare KI) */
.m-why{background:none;border:0;color:var(--accent);font-size:11.5px;font-weight:600;cursor:pointer;padding:4px 0 0;font-family:inherit}
.m-why:hover{text-decoration:underline}
.mwhy{margin-top:6px;padding:8px 10px;background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-s);display:flex;flex-direction:column;gap:3px}
.mwhy-row{display:flex;justify-content:space-between;gap:12px;font-size:12px}
.mission .m-ok{background:var(--grad);color:#fff;border:none}

/* Bewohner-360-Drawer (U2) */
#r360 .drawer-backdrop{position:fixed;inset:0;background:rgba(4,7,16,.5);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:70}
#r360 .drawer{position:fixed;top:0;right:0;bottom:0;width:min(440px,94vw);background:var(--panel);border-left:1px solid var(--line);
  box-shadow:var(--shadow-lg);transform:translateX(102%);transition:transform .22s cubic-bezier(.2,.8,.2,1);z-index:71;overflow-y:auto}
#r360.open .drawer{transform:translateX(0)}
#r360.open .drawer-backdrop{opacity:1;pointer-events:auto}

/* BSC KPI-Detail-Drawer (Plan §6) — eigener Root, teilt sich .drawer/.dw-Optik */
#kpidw .drawer-backdrop{position:fixed;inset:0;background:rgba(4,7,16,.5);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:70}
#kpidw .drawer{position:fixed;top:0;right:0;bottom:0;width:min(460px,94vw);background:var(--panel);border-left:1px solid var(--line);
  box-shadow:var(--shadow-lg);transform:translateX(102%);transition:transform .22s cubic-bezier(.2,.8,.2,1);z-index:71;overflow-y:auto}
#kpidw.open .drawer{transform:translateX(0)}
#kpidw.open .drawer-backdrop{opacity:1;pointer-events:auto}
.kpidw-range{display:inline-flex;gap:4px;border:1px solid var(--line);border-radius:999px;padding:3px;margin:4px 0 14px}
.kpidw-r{font-size:11.5px;font-weight:700;color:var(--muted);background:none;border:none;border-radius:999px;padding:4px 12px;cursor:pointer;transition:.15s}
.kpidw-r:hover{color:var(--text)}
.kpidw-r.on{background:var(--grad);color:#fff}
.kpidw-graph{height:200px;border:1px solid var(--line);border-radius:var(--r-s);background:var(--panel2);padding:8px;margin-bottom:6px}
.kpidw-graph .kpidw-canvas{width:100%;height:100%;display:block}
.kpidw-graph .mempty{height:100%;display:grid;place-items:center;font-size:12px;color:var(--muted);text-align:center}
.kpidw-formel{font-size:12.5px;color:var(--text);font-variant-numeric:tabular-nums;padding:6px 0;line-height:1.5}
.kpidw-src{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;color:var(--muted);text-align:right;word-break:break-word}
@media(prefers-reduced-motion:reduce){#kpidw .drawer{transition:none}.kpidw-r{transition:none}}

.drawer-body{padding:18px}
.dw-head{display:flex;align-items:center;gap:12px;margin-bottom:6px}
.dw-av{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:15px;background:var(--grad);color:#fff;flex:0 0 auto;box-shadow:var(--glow)}
.dw-id{flex:1;min-width:0}.dw-id b{font-size:16px}
.dw-x{flex:0 0 auto}
.dw-sec{margin-top:16px;border:1px solid var(--line);border-radius:var(--r-s);padding:11px 13px;background:var(--panel2)}
.dw-h{font-size:11px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.dw-row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12.5px;padding:4px 0;border-bottom:1px solid var(--line)}
.dw-row:last-child{border-bottom:none}
[data-r360]{cursor:pointer;text-decoration:underline dotted rgba(99,102,241,.55);text-underline-offset:3px}
[data-r360]:hover{color:var(--accent)}

/* ⌘K-Befehlspalette (U3) */
#kpal .pal-backdrop{position:fixed;inset:0;background:rgba(4,7,16,.55);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .18s ease;z-index:80}
#kpal .pal{position:fixed;left:50%;top:14vh;transform:translate(-50%,-8px) scale(.98);width:min(620px,94vw);background:var(--panel);
  border:1px solid var(--line2);border-radius:var(--r-l);box-shadow:var(--shadow-lg);z-index:81;opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease;overflow:hidden}
#kpal.open .pal{opacity:1;pointer-events:auto;transform:translate(-50%,0) scale(1)}
#kpal.open .pal-backdrop{opacity:1;pointer-events:auto}
#kpal #palInput{width:100%;border:none;background:transparent;color:var(--text);font:inherit;font-size:16px;padding:16px 18px;border-bottom:1px solid var(--line)}
#kpal #palInput:focus{outline:none;box-shadow:none}
.pal-list{max-height:46vh;overflow-y:auto;padding:7px}
.pal-item{display:flex;align-items:center;gap:11px;padding:9px 12px;border-radius:var(--r-s);font-size:13.5px;cursor:pointer}
.pal-item.on{background:color-mix(in srgb, var(--accent) 14%, transparent)}
.pal-ic{flex:0 0 auto}
.pal-t{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pal-item .muted{margin-left:auto;font-size:11.5px;white-space:nowrap}
.pal-foot{padding:8px 16px;border-top:1px solid var(--line);color:var(--muted);font-size:11px}

/* Forecast-Balken (vertragsbasiert): violett = gesichert, gelb = Auslauf-Klippe */
.fc-row{display:flex;align-items:center;gap:11px;padding:7px 4px;border-bottom:1px solid var(--line);font-size:12.5px}
.fc-row:last-child{border-bottom:none}
.fc-m{min-width:92px;font-weight:700}
.fc-bar{flex:1;height:14px;border-radius:999px;background:var(--panel2);overflow:hidden;display:flex}
.fc-bar i{display:block;height:100%;background:var(--grad)}
.fc-bar u{display:block;height:100%;background:repeating-linear-gradient(45deg,var(--warn),var(--warn) 4px,transparent 4px,transparent 8px);opacity:.85}
.fc-v{min-width:170px;text-align:right;white-space:nowrap}
.fc-in{background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-s);color:var(--text);padding:6px 9px;font:inherit;font-size:12.5px}

/* Vertragsdokument-Modal (Kontext-Aktionen S1) */
#cdoc .cdoc-backdrop,#kconfirm .kc-backdrop{position:fixed;inset:0;background:rgba(4,7,16,.55);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .18s ease;z-index:90}
#cdoc.open .cdoc-backdrop,#kconfirm.open .kc-backdrop{opacity:1;pointer-events:auto}
#cdoc .cdoc-modal{position:fixed;left:50%;top:8vh;transform:translate(-50%,-8px) scale(.98);width:min(560px,94vw);max-height:84vh;overflow-y:auto;
  background:var(--panel);border:1px solid var(--line2);border-radius:var(--r-l);box-shadow:var(--shadow-lg);z-index:91;opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease}
#cdoc.open .cdoc-modal{opacity:1;pointer-events:auto;transform:translate(-50%,0) scale(1)}
.cdoc-body{padding:20px}
.cdoc-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:6px}
.cdoc-head>div:first-child{flex:1;min-width:0}
.cdoc-kicker{font-size:10.5px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--accent)}
.cdoc-title{font-size:17px}
.cdoc-sec{margin-top:14px;border:1px solid var(--line);border-radius:var(--r-s);padding:11px 13px;background:var(--panel2)}
.cdoc-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font-size:13px;padding:4px 0;border-bottom:1px solid var(--line)}
.cdoc-row:last-child{border-bottom:none}
.cdoc-row>span:first-child{color:var(--muted)}
.cdoc-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px;font-size:11.5px}

/* Bestätigungs-Dialog (Kontext-Aktionen S2) */
#kconfirm .kc-modal{position:fixed;left:50%;top:22vh;transform:translate(-50%,-8px) scale(.98);width:min(480px,94vw);
  background:var(--panel);border:1px solid var(--line2);border-radius:var(--r-l);box-shadow:var(--shadow-lg);z-index:92;padding:20px;
  opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease}
#kconfirm.open .kc-modal{opacity:1;pointer-events:auto;transform:translate(-50%,0) scale(1)}
.kc-title{font-weight:var(--fw-brand);font-size:15px;margin-bottom:10px}
.kc-object{border:1px solid var(--line);border-radius:var(--r-s);background:var(--panel2);padding:10px 12px;font-size:13px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.kc-letter{flex-basis:100%;margin-top:6px;padding:7px 10px;border-left:3px solid var(--line);color:var(--muted);font-size:12.5px;font-style:italic;line-height:1.5}
/* Transparenz-Journal (T1): der Feed, in dem sich das System erklärt */
.chipbar{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.jr-row{display:flex;align-items:flex-start;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-s);background:var(--panel2);font-size:13px}
.jr-row.jr-link{cursor:pointer}
.jr-row.jr-link:hover{border-color:var(--accent)}
.jr-ic{flex-shrink:0}
.jr-body{flex:1;min-width:0}
.jr-meta{color:var(--muted);font-size:11.5px;margin-top:2px}
.jr-actor{font-weight:700}
.jr-actor.system,.jr-actor.agent{color:var(--accent)}
/* Cockpit-Puls (U6a): letzte Journal-Einträge, kompakt */
.puls-wrap{margin-top:10px;border:1px solid var(--line);border-radius:var(--r-s);background:var(--panel2);padding:8px 10px}
.puls-head{display:flex;justify-content:space-between;align-items:center;font-weight:700;font-size:12.5px;margin-bottom:6px}
.puls{display:flex;flex-direction:column;gap:4px;max-height:150px;overflow:auto}
.puls-row{display:flex;align-items:baseline;gap:7px;font-size:12px;color:var(--text);text-decoration:none;padding:2px 0}
.puls-row:hover b{color:var(--accent)}
.puls-tx{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.puls-who{color:var(--muted);font-size:11px;flex-shrink:0}
/* U4 Owner-Statement: Trend-Canvas, Benchmark, Monats-Navigation, Kommentar */
.ow-trend{width:100%;height:190px;display:block}
.ow-legend{display:flex;gap:14px;font-size:11.5px;color:var(--muted);margin:4px 0 8px}
.ow-legend .lg{display:inline-flex;align-items:center;gap:5px}
.ow-legend i{display:inline-block;width:14px;height:9px}
.ow-legend .lg-line{height:2px;background:var(--text)}
.ow-legend .lg-box{border:1px solid var(--muted)}
.ow-legend .lg-fill{background:var(--accent);opacity:.8}
.ow-nav{display:flex;align-items:center;gap:9px;font-size:13.5px}
.ow-nav .tstate{font-size:13px;padding:3px 10px}
.ow-events .muted{margin-top:8px;font-size:11.5px;text-transform:uppercase;letter-spacing:.4px}
.ow-cm{width:100%;background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-s);color:var(--text);padding:9px 11px;font:inherit;font-size:13px;resize:vertical}
.ow-cm:focus{outline:none;border-color:var(--accent)}
.ow-cm-foot{display:flex;justify-content:space-between;align-items:center;margin-top:8px;gap:10px}
.ow-quote{border-left:3px solid var(--accent);padding:8px 12px;font-size:13.5px;font-style:italic;line-height:1.55}
.ow-quote .muted{font-style:normal;font-size:11.5px;margin-top:6px}
#stCard h4{margin:14px 0 6px;font-size:13px}
/* B2 Übergabeprotokolle: Kautions-Empfehlung + Foto-Thumbnails */
.ho-dep{border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:var(--r-s);background:var(--panel2);padding:9px 12px;font-size:13px;margin:8px 0}
.ho-dep .muted{font-size:11.5px;margin-top:3px}
.ho-thumb{width:52px;height:52px;object-fit:cover;border-radius:8px;border:1px solid var(--line);flex-shrink:0}
/* M1+M2: Schadenfoto im Thread + Termin-Box */
.tk-photo{margin:0 0 10px}
.tk-photo img{max-width:280px;max-height:200px;border-radius:var(--r-s);border:1px solid var(--line)}
.ap-box{border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:var(--r-s);background:var(--panel2);padding:9px 12px;font-size:13px;margin:0 0 10px}
.ap-actions{display:flex;gap:8px;margin-top:8px}
.kc-cons{margin:12px 0 4px;padding-left:20px;font-size:13px;color:var(--muted)}
.kc-cons li{margin:4px 0}
.kc-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:14px}
/* Text-/Passwort-Eingabe im Dialog (promptAction) — ersetzt natives prompt() */
.kc-label{font-size:12.5px;color:var(--muted);margin-bottom:8px}
.kc-input{width:100%;box-sizing:border-box;background:var(--panel2);border:1px solid var(--line2);border-radius:var(--r-s);color:var(--text);font:inherit;font-size:14px;padding:10px 12px}
.kc-input:focus{outline:none;border-color:var(--accent);box-shadow:var(--ring)}
textarea.kc-input{resize:vertical;min-height:64px}
.kc-go{background:var(--grad);color:#fff;border:none;border-radius:var(--r-s);padding:8px 16px;font-weight:700;cursor:pointer}
@media print{
  header,.tabbar,footer,#topnav,.toast,#kconfirm,#r360,#kpal,.cdoc-foot button{display:none!important}
  #cdoc .cdoc-modal{position:static;transform:none;max-height:none;box-shadow:none;border:none;width:100%}
  #cdoc .cdoc-backdrop{display:none}
  body{background:#fff!important;color:#000!important}
}
.bell-item.bell-link{cursor:pointer}
.bell-item.bell-link:hover{background:color-mix(in srgb, var(--accent) 12%, transparent);color:var(--text)}
.bell-go{margin-left:auto;color:var(--accent);flex:0 0 auto}
.dw-actions{display:flex;gap:8px;margin-top:10px}

/* ---------- Kalender (K1): Monatsraster + Tagesliste ---------- */
.cal-nav{display:flex;align-items:center;gap:8px}
.cal-nav b{min-width:130px;text-align:center;font-size:13.5px}
.cal-head{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin:10px 0 4px;color:var(--muted);font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.cal-head div{padding:0 6px}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:12px}
.cal-day{min-height:76px;border:1px solid var(--line);border-radius:var(--r-s);background:var(--panel2);padding:5px 6px;display:flex;flex-direction:column;gap:3px;overflow:hidden}
.cal-day.off{background:transparent;border-color:transparent}
.cal-day.has{cursor:pointer}
.cal-day.has:hover{border-color:var(--accent)}
.cal-day.today{box-shadow:var(--ring)}
.cal-day.sel{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 10%, var(--panel2))}
.cal-num{font-size:11.5px;font-weight:700;color:var(--muted)}
.cal-day.today .cal-num{color:var(--accent)}
.cal-chip{font-size:10.5px;line-height:1.35;border-radius:5px;padding:1px 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:color-mix(in srgb, var(--accent) 14%, transparent)}
.cal-chip.handwerker{background:color-mix(in srgb, var(--warn) 18%, transparent)}
.cal-chip.event{background:color-mix(in srgb, var(--accent2) 16%, transparent)}
.cal-chip.vertragsende{background:color-mix(in srgb, var(--accent) 16%, transparent)}
.cal-chip.faellig{background:color-mix(in srgb, var(--ok) 16%, transparent)}
.cal-more{font-size:10.5px;color:var(--muted)}
@media (max-width:760px){.cal-day{min-height:54px}.cal-chip{display:none}.cal-day.has .cal-num::after{content:" •";color:var(--accent)}}

/* K2: View-Switcher, 🚩-Flaggen, Wochen-/Jahres-/Listenansicht */
.cal-top{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:10px 0 8px}
.cal-views{display:flex;gap:6px;flex-wrap:wrap}
.cal-title{font-size:13.5px}
.cal-flag{font-size:10px;margin-left:3px;letter-spacing:-1px}
.cal-flag i{font-style:normal;color:var(--bad);font-weight:800;font-size:10.5px;margin-left:1px}
.cal-week{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.cal-wcol{border:1px solid var(--line);border-radius:var(--r-s);background:var(--panel2);padding:6px;display:flex;flex-direction:column;gap:6px;min-height:120px}
.cal-wcol.today{box-shadow:var(--ring)}
.cal-whead{font-size:12px;font-weight:700;color:var(--muted)}
.cal-whead.has{cursor:pointer}
.cal-whead.has:hover{color:var(--accent)}
.cal-wcol .jr-row{padding:6px 7px;font-size:12px}
.cal-wempty{color:var(--muted);font-size:12px}
.cal-year{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.cal-mini{border:1px solid var(--line);border-radius:var(--r-s);background:var(--panel2);padding:8px}
.cal-mini b{display:block;font-size:12.5px;margin-bottom:6px;cursor:pointer}
.cal-mini b:hover{color:var(--accent)}
.cal-mini-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.cal-mini-grid i{font-style:normal;font-size:9.5px;color:var(--muted);text-align:center;padding:1px 0;border-radius:4px;min-height:14px}
.cal-mini-grid i.has{cursor:pointer;font-size:10px}
.cal-mini-grid i.has:hover{background:color-mix(in srgb, var(--accent) 18%, transparent)}
.cal-mini-grid i.today{box-shadow:inset 0 0 0 1px var(--accent)}
.cal-list{max-height:560px}
@media (max-width:760px){.cal-week{grid-template-columns:1fr}.cal-wcol{min-height:0}}

/* B6: E-Mail-Karte */
.mail-check{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text)}
.mail-err{color:var(--bad)}

/* ============================================================================
   Shared Agent-View (window.KAgentView) — Antwort-Rendering + Sprach-Toggles.
   Additiv, tokenbasiert (beide Themes), ruhige & lesbare Fließtext-Fläche.
   ============================================================================ */
.aview{color:var(--text);line-height:1.7;font-size:15px}
.aview>*{max-width:70ch}                     /* angenehme Zeilenlänge für Fließtext */
.aview>.aview-tablewrap{max-width:100%}      /* Tabellen dürfen die volle Breite nutzen */
.aview p{margin:0 0 .85em}
.aview h1,.aview h2,.aview h3{margin:1.2em 0 .5em;line-height:1.3;font-weight:var(--fw-heading);color:var(--text)}
.aview h1{font-size:1.5em}
.aview h2{font-size:1.25em}
.aview h3{font-size:1.08em;color:var(--muted)}
.aview>*:first-child{margin-top:0}
.aview ul,.aview ol{margin:0 0 .85em;padding-left:1.4em}
.aview li{margin:.2em 0}
.aview blockquote{margin:.85em 0;padding:.4em .95em;border-left:3px solid var(--accent);
  background:var(--grad-soft);border-radius:0 var(--r-s) var(--r-s) 0;color:var(--muted)}
.aview code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9em;
  background:var(--panel2);border:1px solid var(--line);border-radius:6px;padding:.08em .38em;color:var(--text)}

/* Tabelle: Zebra, fetter Kopf, rechtsbündige Zahlen, auf schmal horizontal scrollbar. */
.aview-tablewrap{margin:1em 0}
.aview-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--r-m)}
.aview-table{border-collapse:collapse;width:100%;font-size:14px}
.aview-table th,.aview-table td{padding:.5em .8em;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}
.aview-table th{font-weight:700;color:var(--text);background:var(--panel2);position:sticky;top:0}
.aview-table td{color:var(--muted)}
.aview-table th.num,.aview-table td.num{text-align:right;font-variant-numeric:tabular-nums}
.aview-table tbody tr:nth-child(odd) td{background:rgba(148,163,216,.04)}
[data-theme="light"] .aview-table tbody tr:nth-child(odd) td{background:rgba(28,37,74,.03)}
.aview-table tbody tr:hover td{background:rgba(99,102,241,.08)}
.aview-canvas{display:block;width:100%;height:160px;margin-top:.7em}

/* Sprach-Toggle-Button: kompakt, aktiv = Akzentfarbe, .off = gedimmt. */
.voicebtn{display:inline-flex;align-items:center;gap:.35em;padding:.32em .7em;font-size:13px;
  line-height:1;border:1px solid var(--line2);border-radius:999px;cursor:pointer;
  background:var(--panel2);color:var(--accent);transition:background .15s,color .15s,border-color .15s,box-shadow .15s}
.voicebtn:hover{border-color:var(--accent);box-shadow:var(--ring)}
.voicebtn:focus-visible{outline:none;box-shadow:var(--ring)}
.voicebtn.off{color:var(--muted);background:transparent;opacity:.7}
.voicebtn.off:hover{opacity:1}

@media (prefers-reduced-motion:reduce){
  .voicebtn{transition:none}
}

/* Cockpit-Ergebnis: die SEITE waechst nach unten (kein enger Kasten mehr).
   Nur das Cockpit (body.cockpit) — andere Seiten scrollen ohnehin selbst. */
body.cockpit{height:auto;min-height:100vh}
/* Dashboard behaelt garantiert ~eine Bildschirmhoehe (Graph/Konsole strecken sich);
   das Ergebnis-Panel darunter dehnt die Seite, der Nutzer scrollt normal.
   WICHTIG (Runaway-Schutz): height (DEFINIT), nicht nur min-height. Nur eine definite Hoehe
   laesst die Grid-Reihe strecken -> .graph-panel bekommt eine definite Pixelhoehe -> der
   absolut eingespannte #graph (inset:0) loest sich fest auf. flex:0 0 auto haelt main aus dem
   Body-Flex heraus, damit das Ergebnis-Panel darunter die Seite regulaer nach unten verlaengert.
   Aendert man dies auf min-height/flex:1 zurueck, kann der Canvas in die Wachstumsschleife kippen. */
body.cockpit main{flex:0 0 auto;height:calc(100vh - 118px)}
.cockpit-result{padding:0 16px 26px;width:100%;box-sizing:border-box}
.cockpit-result[hidden]{display:none}
.cockpit-result .result-panel{max-width:1180px;margin:0 auto;background:var(--panel);
  border:1px solid var(--line);border-radius:var(--r-l);box-shadow:var(--shadow);padding:16px 20px 22px}
.cockpit-result .result-head{display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.cockpit-result .result-title{font-weight:700;font-size:14px;letter-spacing:-.01em}
/* Im vollen Seitenfluss keinen klebrigen Tabellenkopf (der war fuer die kleine Box gedacht). */
body.cockpit .aview-table th{position:static}
/* Schmaler Viewport: einspaltig, Seite darf natuerlich wachsen. .graph-panel bekommt via
   @media(max-width:900px) .graph-panel{min-height:320px} (oben) eine definite Bezugshoehe,
   an der sich der absolute #graph aufloest. */
@media(max-width:900px){ body.cockpit main{height:auto;min-height:auto} }

/* B3: Bank-Abgleich */
.rc-sug{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:6px;font-size:12.5px}
.rc-more{margin-top:4px;display:flex;flex-direction:column;gap:4px}

/* AP 4.3: Autonomie-Governance (Autopilot-Konsole) — nur additive Klassen */
.gov-banner{margin-top:6px;font-size:12.5px;font-weight:600;color:var(--warn);border:1px solid rgba(245,158,11,.4);background:rgba(245,158,11,.07);border-radius:var(--r-s);padding:9px 12px}
.gov-rule{border:1px solid var(--line);border-radius:var(--r-m);background:var(--panel2);padding:11px 13px;margin-top:10px}
.gov-rule:first-child{margin-top:12px}
.gov-rule-head{display:flex;align-items:center;gap:8px;font-size:13px;flex-wrap:wrap}
.gov-rule-head .muted{margin-left:auto;font-size:11.5px}
.gov-segs{display:inline-flex;gap:0;margin-top:9px;border:1px solid var(--line);border-radius:999px;overflow:hidden}
.gov-seg{border:none;border-right:1px solid var(--line);border-radius:0;text-transform:none;padding:5px 14px}
.gov-seg:last-child{border-right:none}
.gov-seg:disabled{opacity:.4;cursor:not-allowed}
.gov-seg:disabled:hover{border-color:var(--line);color:var(--muted)}
.gov-thresh{display:flex;align-items:center;gap:10px;margin-top:10px;font-size:12px}
.gov-thresh input[type=range]{flex:1;max-width:280px;accent-color:var(--accent)}

/* Inspektions-Schicht (additiv): Überblick, Regelakte, Trockenlauf — nur Theme-Tokens. */
.gov-ov-grid{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:10px}
.gov-ov-grid .kpi{flex:1 1 130px;min-width:120px}
.gov-ov-spark{flex:0 0 auto;width:180px;height:48px;opacity:.9}
.gov-dim{opacity:.45}
.gov-killpill{display:inline-block;font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}
.gov-killpill.on{color:var(--warn);border-color:rgba(245,158,11,.5);background:rgba(245,158,11,.08)}
.gov-inspect-row{margin-top:9px}
.gov-inspect{background:transparent;border:1px solid var(--line);color:var(--muted);border-radius:var(--r-s);padding:4px 11px;font-size:12px;cursor:pointer;text-transform:none}
.gov-inspect:hover{color:var(--text);border-color:var(--accent)}
.gov-inspect[aria-expanded=true]{color:var(--accent);border-color:var(--accent)}
.gov-dossier{margin-top:10px;border-top:1px solid var(--line);padding-top:10px;font-size:12.5px;overflow:hidden;animation:govReveal .22s ease}
.gov-dossier[hidden]{display:none}
@keyframes govReveal{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.gov-dossier{animation:none}}
.gov-dsec{margin-bottom:7px;line-height:1.5}
.gov-dlab{display:inline-block;min-width:96px;font-weight:600;color:var(--muted)}
.gov-dstats{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.gov-mini-spark{width:72px;height:20px;vertical-align:middle}
.gov-revpill{display:inline-block;font-size:11.5px;font-weight:700;padding:2px 9px;border-radius:999px;border:1px solid var(--line)}
.gov-rev-full{color:var(--ok);border-color:rgba(34,197,94,.5);background:rgba(34,197,94,.08)}
.gov-rev-partial{color:var(--accent);border-color:rgba(99,102,241,.5);background:rgba(99,102,241,.08)}
.gov-rev-effortful{color:var(--warn);border-color:rgba(245,158,11,.5);background:rgba(245,158,11,.08)}
.gov-rev-none{color:var(--bad);border-color:rgba(239,68,68,.5);background:rgba(239,68,68,.08)}
.gov-locknote{font-size:12px;color:var(--muted);margin:3px 0}
.gov-hist{margin:2px 0 10px}
.gov-hist-row{font-size:12px;padding:3px 0;border-bottom:1px solid var(--line)}
.gov-hist-row:last-child{border-bottom:none}
.gov-jlink{cursor:pointer}
.gov-jlink:hover{color:var(--accent)}
.gov-dry-wrap{margin-top:8px}
.gov-dryrun{text-transform:none}
.gov-dry{margin-top:8px}
.gov-dry-head{font-size:12.5px;margin-bottom:6px}
.gov-dry-item{font-size:12px;padding:5px 9px;margin-top:5px;border:1px solid var(--line);border-radius:var(--r-s);background:var(--panel2)}
/* Autopilot-Undo: kleiner, unaufdringlicher ↩-Button im Trace-Stil + stiller „zurückgenommen"-Marker. */
.gov-undo{background:transparent;border:1px solid var(--line);color:var(--muted);border-radius:var(--r-s);padding:2px 9px;font-size:11.5px;cursor:pointer;text-transform:none;white-space:nowrap}
.gov-undo:hover{color:var(--text);border-color:var(--accent)}
.gov-undo-mark{font-size:11.5px}

/* Art. 50 EU-AI-Act: dezente, permanente KI-Kennzeichnung an den KI-Oberflächen (Konsole, Schwarm).
   18px-Gutter fluchtet mit .examples/.prompt-row/.panel-head — kein Overlay, reine Textzeile. */
.ai-note{display:flex;align-items:center;gap:6px;font-size:11.5px;line-height:1.4;color:var(--muted);padding:2px 18px 4px}

/* FIX-5 Lead-Notizen: aufklappbarer Aktivitätsverlauf je Lead + Anhänge-Zeile. */
.lead-notes-btn{margin-left:0;margin-top:4px}
.lead-notes{width:100%;margin-top:6px;padding-left:2px;display:flex;flex-direction:column;gap:4px}
.lead-note{font-size:11.5px;color:var(--text);line-height:1.45}
.lead-note .muted{margin-left:0;font-size:10.5px}
.lead-note-add{display:flex;gap:6px;margin-top:4px}
.lead-note-in{flex:1;min-width:0;font-size:12px;padding:5px 9px}
/* FIX-4 Handwerker-Dispatch: dezenter Hinweis, dass der Partner per E-Mail benachrichtigt wurde. */
.wo-notified{color:var(--ok);font-size:10.5px;font-weight:600}

/* ---------- SEPA-QR (P1.2): Zahlungs-Modal im Portal + Statistik ---------- */
.sq-modal { max-width: 460px; }
.sq-qr { background: #fff; border-radius: 14px; padding: 14px; width: fit-content; margin: 12px auto; }   /* QR braucht hellen Grund — auch im Dark-Theme */
.sq-qr img { width: 220px; height: 220px; display: block; }
.sq-amount { text-align: center; font-size: 1.25rem; font-weight: 700; margin-bottom: 10px; }
.sq-copy { background: none; border: none; cursor: pointer; font-size: 0.95em; padding: 0 2px; }

/* ---------- Beidseitige Zahlungs-Übersicht: Filter-Chips (Portal + Verwaltung) ---------- */
.fchip{display:flex;gap:7px;margin:2px 0 10px;flex-wrap:wrap}
.fchip button{background:var(--panel);border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:4px 13px;font-size:12px;font-weight:600;cursor:pointer}
.fchip button:hover{border-color:var(--accent);color:var(--text)}
.fchip button.on{background:var(--accent);border-color:var(--accent);color:#fff}

/* Auszug/Kündigung (Mieter-Baustein #3) — Vorschau + Formular im Portal-Zuhause */
.mo-preview{background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-m);padding:12px 14px;margin-bottom:10px}
.mo-row{display:flex;justify-content:space-between;gap:12px;padding:3px 0}
.mo-hint{margin-top:6px;font-size:12px;line-height:1.4}
.mo-reassure{margin:-2px 0 10px;padding:9px 12px;border-radius:var(--r-m);font-size:12.5px;line-height:1.45;color:var(--ok);background:rgba(34,197,94,.08);border:1px solid rgba(34,197,94,.25)}
.mo-status{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:8px 0}
.mo-note{margin:4px 0 8px}
.mo-form{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.mo-lbl{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted);font-weight:600}
.mo-lbl input,.mo-lbl textarea{font:inherit}

/* =====================================================================
   PRÄZISIONS-INSTRUMENT — Verwaltungs-Arbeitsplatz (body.mgmt)
   Dichtes, ruhiges, tastatur-first Profi-Layout für Betreiber. Komplett
   unter .mgmt gescopt → das Bewohner-Portal (body.portal OHNE .mgmt)
   bleibt unverändert. Farbe = Bedeutung, weniger Deko-Gradient/Glow.
   ===================================================================== */

/* --- Shell: Kopfzeile oben · linke Navigations-Schiene · Arbeitsfläche --- */
body.mgmt{display:grid;grid-template-columns:222px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;
  grid-template-areas:"head head" "nav main" "nav foot";height:100vh;overflow:hidden;font-variant-numeric:tabular-nums;
  /* Lokale Token-Overrides: engere Radien = crisperes Instrument; ruhiger, flacher Hintergrund (kein Vollbild-Farbschleier). */
  --r-s:7px;--r-m:9px;--r-l:11px;background:var(--bg)}
body.mgmt>header{grid-area:head;padding:11px 20px}
body.mgmt>footer{grid-area:foot;padding:7px 24px;font-size:11px;background:var(--panel2)}
body.mgmt>#toast{position:fixed;left:auto;top:auto;right:24px;bottom:24px}

/* --- Navigations-Schiene (aus .tabbar) --- */
body.mgmt>.tabbar{grid-area:nav;flex-direction:column;flex-wrap:nowrap;gap:1px;align-content:start;
  overflow-y:auto;overflow-x:hidden;padding:10px 8px;border-bottom:none;border-right:1px solid var(--line);
  background:var(--panel2);backdrop-filter:none}
body.mgmt .tab{width:100%;display:flex;align-items:center;justify-content:flex-start;text-align:left;
  border:none;border-radius:var(--r-s);background:transparent;color:var(--muted);
  padding:7px 11px;font-size:12.5px;font-weight:600;letter-spacing:0;white-space:nowrap;
  transition:background .12s ease,color .12s ease}
body.mgmt .tab:hover{color:var(--text);background:color-mix(in srgb,var(--text) 6%,transparent);border:none;transform:none}
body.mgmt .tab.active{color:var(--text);font-weight:600;background:color-mix(in srgb,var(--accent) 26%,transparent);
  box-shadow:inset 3px 0 0 var(--accent);border:none;transform:none}
body.mgmt .tab:focus-visible{box-shadow:var(--ring)}

/* --- Arbeitsfläche --- */
body.mgmt>.portal2{grid-area:main;overflow:auto;padding:20px 24px}
body.mgmt .pane{max-width:1160px;margin:0}

/* --- Typografie: ruhige, konsistente Hierarchie --- */
body.mgmt .card>h3,body.mgmt .pane>h3{font-size:14px;font-weight:700;letter-spacing:-.01em}
body.mgmt .hint{font-size:11.5px;font-weight:400}

/* --- KPI-Streifen: dicht, ruhig, tabellarische Zahlen (kein Gradient-Zahlenschmuck) --- */
body.mgmt .kpis{gap:8px;padding:0 0 16px}
body.mgmt .kpi{flex:1;min-width:118px;background:var(--panel2);background-image:none;border:1px solid var(--line);
  border-radius:var(--r-m);padding:9px 12px;box-shadow:none}
body.mgmt .kpi:hover{transform:none;border-color:var(--line2)}
body.mgmt .kpi .v{font-size:18px;font-weight:750;letter-spacing:-.015em;background:none;-webkit-text-fill-color:var(--text);color:var(--text)}
body.mgmt .kpi .k{font-size:9.5px;letter-spacing:.5px}

/* --- Karten: flacher, dichter --- */
body.mgmt .card{border-radius:var(--r-m);padding:14px 16px;box-shadow:none;background-image:none;margin-bottom:14px}

/* --- Daten-Listen: dichte, geteilte Zeilen statt Karten-pro-Zeile --- */
body.mgmt .mlist{gap:0;max-height:none}
body.mgmt .mrow{background:transparent;border:none;border-bottom:1px solid var(--line);border-radius:0;
  padding:8px 8px;font-size:13px;gap:10px}
body.mgmt .mrow:hover{background:color-mix(in srgb,var(--text) 4%,transparent);border-color:var(--line)}
body.mgmt .mrow:last-child{border-bottom:none}
body.mgmt .mrow .muted{font-size:11.5px}
body.mgmt .tk:hover{background:color-mix(in srgb,var(--accent) 7%,transparent)}

/* --- Status-Pills: kleiner, semantisch, crisp --- */
body.mgmt .pill{font-size:9.5px;padding:2px 8px;letter-spacing:.3px}
body.mgmt .tagpill{font-size:9.5px;padding:2px 8px}

/* --- Aktions-Buttons: klare Hierarchie, ruhig (Primär = einfarbig statt Gradient) --- */
body.mgmt .tstate{border-radius:6px;padding:4px 10px;font-size:11.5px;font-weight:600}
body.mgmt .tstate.on{background:color-mix(in srgb,var(--accent) 16%,transparent);border-color:var(--accent);color:var(--text)}
body.mgmt .primary,body.mgmt .pform button{background:var(--accent);background-image:none;box-shadow:none;filter:none;border-radius:var(--r-s);font-weight:700}
body.mgmt .primary:hover,body.mgmt .pform button:hover{background:var(--accent);filter:brightness(1.08);box-shadow:none}
body.mgmt .navlink{background:var(--panel);border:1px solid var(--line);color:var(--text);border-radius:var(--r-s);padding:5px 12px;font-weight:600}
body.mgmt .navlink:hover{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent)}

/* --- Filter: kompaktes Segmented-Control statt Pill-Reihe --- */
body.mgmt .fchip{gap:0;background:var(--panel2);border:1px solid var(--line);border-radius:var(--r-s);padding:2px;width:fit-content;margin:0 0 12px;flex-wrap:wrap}
body.mgmt .fchip button{background:transparent;border:none;border-radius:6px;padding:5px 12px;font-size:12px;color:var(--muted)}
body.mgmt .fchip button:hover{color:var(--text);background:color-mix(in srgb,var(--text) 5%,transparent);border:none}
body.mgmt .fchip button.on{background:var(--panel);color:var(--text);box-shadow:var(--shadow)}

/* --- Sammel-Aktions-Leisten (U5) im neuen System --- */
body.mgmt #billBulk,body.mgmt #tktBulk{gap:8px;align-items:center;padding:9px 8px;border-top:1px solid var(--line);margin-top:2px}

/* --- Daten-Tabelle: ausgerichtete Spalten, rechtsbündige tabellarische Beträge (Finanzblick) --- */
body.mgmt .dtable{width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}
body.mgmt .dtable thead th{text-align:left;font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;
  color:var(--muted);padding:0 10px 8px;border-bottom:1px solid var(--line2);white-space:nowrap}
body.mgmt .dtable td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
body.mgmt .dtable tbody tr:last-child td{border-bottom:none}
body.mgmt .dtable tbody tr:hover td{background:color-mix(in srgb,var(--text) 4%,transparent)}
body.mgmt .dtable th.num,body.mgmt .dtable td.num{text-align:right;font-weight:650;letter-spacing:-.005em}
body.mgmt .dtable td.dt-dim{color:var(--muted)}
body.mgmt .dtable td b{font-weight:650}
body.mgmt .dtable .dt-sub{font-size:11px;color:var(--muted);margin-top:2px}
body.mgmt .dtable td.chkcol,body.mgmt .dtable th.chkcol{width:1%;padding-right:0}
body.mgmt .dtable td.actcol,body.mgmt .dtable th.actcol{text-align:right;white-space:nowrap;width:1%}
body.mgmt .dtable td.actcol .tstate{margin-left:5px}
body.mgmt .dtable td.pos{color:var(--ok);font-weight:650}
body.mgmt .dtable td.neg{color:var(--warn);font-weight:650}
body.mgmt .dtable tr.dt-detail>td{padding:0;border:none}
body.mgmt .dtable td .lead-notes{margin:2px 0 9px}
body.mgmt .lead-form-card{max-width:560px}

/* --- Responsiv: Schiene oben als horizontaler Streifen --- */
@media(max-width:860px){
  body.mgmt{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr) auto;grid-template-areas:"head" "nav" "main" "foot"}
  body.mgmt>.tabbar{flex-direction:row;flex-wrap:nowrap;overflow-x:auto;border-right:none;border-bottom:1px solid var(--line)}
  body.mgmt .tab{width:auto}
  body.mgmt .tab.active{box-shadow:inset 0 -2px 0 var(--accent)}
}
/* ---------- KI-Antwortentwurf (UX #7): Hinweis über dem Antwortfeld ---------- */
.ai-draft-hint{font-size:12px;color:var(--accent);background:rgba(139,92,246,.08);border:1px solid var(--line);border-radius:8px;padding:6px 11px;margin:6px 0}

/* ---------- Onboarding-Checkliste (UX #4): Fortschrittsbalken + Schritt-Zeilen ---------- */
.onb-bar{height:7px;background:var(--panel2);border:1px solid var(--line);border-radius:999px;overflow:hidden;margin:2px 0 12px}
.onb-bar>#onbFill{height:100%;background:var(--grad);transition:width .35s ease}
.onb-done b{opacity:.6}
.onb-done .jr-ic,.onb-blocked .jr-ic{opacity:.9}
.onb-go{flex:none;align-self:center}

/* PBSA-Betrieb / Studentenwohnheim (Beachhead): Studienjahr-Lebenszyklus + Sommer-Flip */
.pb-head{margin-bottom:14px}
.pb-title{margin:0 0 4px;font-size:var(--fs-lg,17px);font-weight:var(--fw-heading,600);letter-spacing:-.01em}
.pb-lead{margin:0;max-width:74ch;color:var(--muted);font-size:var(--fs-sm,12px);line-height:1.55}
.pb-bar{display:flex;gap:1px;height:8px;margin:2px 0 12px;border-radius:999px;overflow:hidden;background:var(--line)}
.pb-seg{min-width:2px;transition:flex .3s ease}
.pb-seg.ok{background:var(--ok)} .pb-seg.risk{background:var(--warn)} .pb-seg.open{background:var(--line2)}
.pb-acts{display:flex;gap:4px;flex-wrap:wrap;flex:none}
.pb-unis{display:flex;gap:6px;flex-wrap:wrap}
.pb-legend{font-size:var(--fs-2xs,10px);color:var(--muted);margin:-6px 0 10px}

/* ---- UX-Runde 2 (Audit 5930283): Orientierungskarten + Owner-KPI-Hierarchie ---- */
/* Wegweiser-Karte für Neulinge (Cockpit-Konsole + „Mein Tag") — dezent, einmalig, wegklickbar */
.orient{display:flex;gap:12px;align-items:flex-start;background:var(--panel2);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:var(--r-m);padding:12px 14px;margin:0 0 14px}
.orient[hidden]{display:none}
.console-panel .orient{margin:10px 16px 0}
.orient-ic{font-size:20px;line-height:1.3}
.orient-body{flex:1;min-width:0}
.orient-body b{display:block;margin-bottom:4px;font-size:13px}
.orient-body ul{margin:0;padding-left:16px;color:var(--muted);font-size:12.5px;line-height:1.5}
.orient-body li{margin:2px 0}
.orient-x{flex:none;background:none;border:1px solid var(--line);border-radius:var(--r-s);color:var(--muted);font-size:11.5px;padding:5px 11px;cursor:pointer}
.orient-x:hover{border-color:var(--line2);color:var(--text)}
/* Owner-KPI-Hierarchie: 2 Headline-Kacheln + kleiner Kontext statt gleichrangiger Kachel-Wand */
.kpis.hier .kpi.hero{flex:2 1 200px}
.kpis.hier .kpi.hero .v{font-size:26px}
.kpis.hier .kpi.ctx{flex:1 1 108px;max-width:180px;padding:8px 10px;align-self:flex-end}
.kpis.hier .kpi.ctx .v{font-size:13px;font-weight:550}
.kpis.hier .kpi.ctx .k{font-size:10px}

/* ---- UX-Runde 3 (Audit mittel): Tab-Schiene mit Suche + kollabierbaren Gruppen ---- */
.tabsearch{display:flex;padding:2px 0 4px}
/* var(--panel): hebt sich vom --panel2-Hintergrund der mgmt-Schiene ab */
.tabsearch input{width:100%;min-width:130px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-s);color:var(--text);font-size:12px;padding:5px 9px}
.tabsearch input::placeholder{color:var(--muted)}
.tabsearch input:focus-visible{box-shadow:var(--ring);outline:none}
/* Screenreader-only (Treffer-Ansage der Tab-Suche) */
.vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.tabgroup-lbl{cursor:pointer;user-select:none}
/* Chevron: keine Eigen-Opazität (Label hat schon .6), Größe erbt vom 9px-Label; alt-"" hält Screenreader still */
.tabgroup-lbl::after{content:"▾";content:"▾" / "";margin-left:4px;font-size:inherit}
.tabgroup.collapsed .tabgroup-lbl::after{content:"▸";content:"▸" / ""}
.tabgroup.collapsed .tabgroup-tabs{display:none}
/* Während der Suche zählt nur der Filter — Treffer erscheinen auch in zugeklappten Gruppen */
.tabbar.searching .tabgroup.collapsed .tabgroup-tabs{display:flex}
.tab.filtered{display:none!important}
.tabgroup.nohit{display:none}
body.mgmt>.tabbar .tabsearch{padding:0 2px 6px}
/* Vertikale mgmt-Schiene: .tabbar{align-items:flex-start} würde die Suchbox schrumpfen — voll strecken */
@media(min-width:861px){body.mgmt>.tabbar .tabsearch{align-self:stretch}}
.kpidw-gl{font-size:12px;line-height:1.5;margin:0 0 8px}

/* ---- UX #8: Belegungs-Zeitstrahl (Einheiten × Zeit, Lücken = Leerstand) ---- */
.tl-controls{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.tl-controls select{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-s);color:var(--text);font-size:12px;padding:5px 8px;max-width:220px}
.tl-months{display:flex;gap:4px;flex-wrap:wrap}
.tl-legend{display:flex;gap:14px;flex-wrap:wrap;font-size:11px;color:var(--muted);margin:6px 0 10px}
.tl-legend>span{display:inline-flex;align-items:center;gap:5px}
.tl-sw{display:inline-block;width:14px;height:9px;border-radius:3px}
.tl-sw-contract{background:var(--accent)}
.tl-sw-stay{background:var(--ok)}
.tl-sw-gap{background:transparent;border:1px dashed var(--bad)}
.tl-sw-today{width:2px;height:12px;border-radius:0;background:var(--warn)}
.tl-scroll{overflow-x:auto}
.tl-grid{min-width:640px}
.tl-row{display:flex;align-items:stretch;border-bottom:1px solid var(--line)}
.tl-row:last-child{border-bottom:0}
.tl-lbl{flex:0 0 172px;min-width:0;padding:6px 10px 6px 0;display:flex;flex-direction:column;justify-content:center;position:sticky;left:0;background:var(--panel);z-index:5}
.tl-lbl b{font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tl-lbl .muted{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-left:0}
.tl-track{flex:1;position:relative;min-height:30px;background:var(--panel2)}
.tl-track-head{background:transparent;min-height:20px}
.tl-head .tl-mlbl{position:absolute;top:2px;font-size:10px;color:var(--muted);padding-left:5px;border-left:1px solid var(--line2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tl-mline{position:absolute;top:0;bottom:0;width:0;border-left:1px solid var(--line);pointer-events:none}
.tl-now{position:absolute;top:0;bottom:0;width:0;border-left:2px solid var(--warn);pointer-events:none;z-index:3}
.tl-bar{position:absolute;top:6px;bottom:6px;min-width:3px;border:0;border-radius:4px;padding:0;cursor:pointer}
.tl-bar:focus-visible{box-shadow:var(--ring);outline:none;z-index:4}
.tl-contract{background:var(--accent);opacity:.92}
.tl-contract.tl-ended{opacity:.45}
.tl-stay{background:var(--ok);opacity:.92}
.tl-contract:hover,.tl-stay:hover{opacity:1}
/* Angeschnittene Balken: flache Kante signalisiert „läuft weiter" */
.tl-bar.cutl{border-top-left-radius:0;border-bottom-left-radius:0}
.tl-bar.cutr{border-top-right-radius:0;border-bottom-right-radius:0}
.tl-gapbar{top:4px;bottom:4px;background:transparent;border:1px dashed color-mix(in srgb,var(--bad) 55%,transparent);border-radius:4px;z-index:2}
.tl-gapbar:hover{background:color-mix(in srgb,var(--bad) 12%,transparent);border-color:var(--bad)}
.tl-detail{border:1px solid var(--line2);border-radius:var(--r-m);background:var(--panel2);padding:10px 12px;margin-top:10px}
.tl-detail .card-head{margin-bottom:4px}
.tl-dline{font-size:13px;margin:2px 0}
.tl-dacts{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
@media(max-width:640px){.tl-lbl{flex-basis:110px}.tl-lbl .muted{display:none}}

/* ---- UX #12: Tipps proaktiv — Kontext-Chips (SoT-Vorschläge über den Beispiel-Chips) ---- */
.tips-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:8px 0 2px}
.tips-chips:empty{display:none}
.tips-sg-lbl{flex:0 0 100%;font-size:11px;color:var(--muted)}
.tips-chips .chip.sg{border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);background:color-mix(in srgb,var(--accent) 10%,transparent);font-weight:550}
.tips-chips .chip.sg:hover{background:color-mix(in srgb,var(--accent) 18%,transparent)}

/* ---- Fix (vorbestehend): SEPA-QR-Modal #sq nutzt die cdoc-Klassen, war aber nie auf #sq gestylt —
   es lag als sichtbarer In-Flow-Block am Seitenende und „Schließen" blendete nichts aus.
   Jetzt dieselbe Overlay-Mechanik wie #cdoc (relevant auch für den Chip-Sprung aus den Tipps). ---- */
#sq .cdoc-backdrop{position:fixed;inset:0;background:rgba(4,7,16,.55);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .18s ease;z-index:90}
#sq.open .cdoc-backdrop{opacity:1;pointer-events:auto}
#sq .cdoc-modal{position:fixed;left:50%;top:8vh;transform:translate(-50%,-8px) scale(.98);width:min(560px,94vw);max-height:84vh;overflow-y:auto;
  background:var(--panel);border:1px solid var(--line2);border-radius:var(--r-l);box-shadow:var(--shadow-lg);z-index:91;opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease}
#sq.open .cdoc-modal{opacity:1;pointer-events:auto;transform:translate(-50%,0) scale(1)}
@media print{ #sq{display:none!important} }

/* Touch: die 🔍-Pill ist dort der einzige Palette-Zugang (kein ⌘K) — Mindest-Zielgröße sichern */
@media (pointer: coarse){ .cmdk-pill{min-height:34px;min-width:44px;font-size:15px} }

/* ---- Bewohner-Foto via Ausweis-Scan: Avatare (Drawer + Portal-Profil) ---- */
.dw-avimg{overflow:hidden;padding:0}
.dw-avimg img{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%}
.pf-avrow{display:flex;align-items:center;gap:12px;margin:10px 0 14px}
.pf-av{width:56px;height:56px;font-size:18px;flex:0 0 auto;display:grid;place-items:center;border-radius:50%;background:var(--grad);color:#fff;font-weight:800;overflow:hidden}
.pf-av img{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%}

/* ---- Foto-Dialog (#pcam): QR-Handoff Desktop → Handy, gleiche Overlay-Mechanik wie #sq/#cdoc ---- */
#pcam .cdoc-backdrop{position:fixed;inset:0;background:rgba(4,7,16,.55);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .18s ease;z-index:92}
#pcam.open .cdoc-backdrop{opacity:1;pointer-events:auto}
#pcam .cdoc-modal{position:fixed;left:50%;top:8vh;transform:translate(-50%,-8px) scale(.98);width:min(480px,94vw);max-height:84vh;overflow-y:auto;
  background:var(--panel);border:1px solid var(--line2);border-radius:var(--r-l);box-shadow:var(--shadow-lg);z-index:93;opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease}
#pcam.open .cdoc-modal{opacity:1;pointer-events:auto;transform:translate(-50%,0) scale(1)}
.pcam-qr{display:flex;justify-content:center;margin:14px 0}
.pcam-qr img{width:min(240px,70vw);border-radius:12px;background:#fff;padding:10px}
.pcam-status{text-align:center;font-size:14px;margin:6px 0}
.pcam-preview{display:flex;justify-content:center;margin:8px 0}
.pcam-img{width:120px;height:160px;object-fit:cover;border-radius:12px;border:1px solid var(--line2);box-shadow:var(--shadow-lg)}

/* ---- Scan-Seite (/scan/, Handy/Tablet ohne Login): fokussierter Ein-Spalten-Flow ---- */
body.scanp{display:block;min-height:100vh}
.scan-wrap{max-width:440px;margin:0 auto;padding:18px 14px calc(24px + env(safe-area-inset-bottom))}
.scan-brand{font-weight:800;letter-spacing:.14em;font-size:14px;color:var(--muted);margin:6px 2px 12px}
.scan-card{padding:16px}
.scan-ctx{margin:8px 0 4px}
.scan-privacy{font-size:12.5px;color:var(--muted);border:1px dashed var(--line2);border-radius:10px;padding:8px 10px;margin:10px 0}
.scan-big{width:100%;min-height:52px;font-size:16px;margin-top:6px}
.scan-hint{font-size:12.5px;color:var(--muted);margin:8px 0}
.scan-stage{display:flex;justify-content:center;margin:10px 0}
#scCanvas{width:min(270px,80vw);aspect-ratio:3/4;height:auto;touch-action:none;cursor:grab;border-radius:12px;
  outline:3px solid var(--accent);outline-offset:2px;background:#111;box-shadow:var(--shadow-lg)}
#scCanvas:active{cursor:grabbing}
.scan-zoom{display:flex;align-items:center;gap:10px;margin:10px 0}
.scan-zoom input{flex:1;min-height:32px}
.scan-done{margin:8px 0}
.scan-done-img{display:block;width:120px;height:160px;object-fit:cover;border-radius:12px;border:1px solid var(--line2);margin:10px auto}
.scan-foot{text-align:center;color:var(--muted);font-size:12px;margin-top:14px}

/* ---- Fall-Metadaten (Zielbild): Prio/SLA/Agent-Zeile auf Mein-Tag-Karten + Fallakte im Warum-Panel ---- */
.m-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:6px 0 2px;font-size:12px}
.pill.cf-prio-kritisch{border:1px solid color-mix(in srgb,#ef4444 55%,transparent);background:color-mix(in srgb,#ef4444 14%,transparent);color:#ef4444}
.pill.cf-prio-hoch{border:1px solid color-mix(in srgb,#f59e0b 55%,transparent);background:color-mix(in srgb,#f59e0b 12%,transparent);color:#d97706}
.pill.cf-prio-mittel{border:1px solid color-mix(in srgb,#6366f1 45%,transparent);background:color-mix(in srgb,#6366f1 10%,transparent);color:var(--accent)}
.pill.cf-prio-niedrig{border:1px solid var(--line2);color:var(--muted)}
.cf-sla{color:var(--muted)}
.cf-sla.over{color:#ef4444;font-weight:600}
.cf-agent{color:var(--muted)}
.cf-h{font-weight:650;font-size:12px;margin:10px 0 4px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.cf-pipe{display:flex;align-items:center;flex-wrap:wrap;gap:4px;margin:8px 0 4px}
.cf-step{display:inline-flex;align-items:center;gap:4px;font-size:12px;border:1px solid var(--line2);border-radius:999px;padding:2px 9px;color:var(--muted)}
.cf-step i{font-style:normal;opacity:.7;font-size:10.5px;margin-left:2px}
.cf-step.done{border-color:color-mix(in srgb,#22c55e 50%,transparent);color:#16a34a}
.cf-step.wartet{border-color:color-mix(in srgb,#f59e0b 55%,transparent);color:#d97706}
.cf-step.abgelehnt,.cf-step.verworfen{border-color:color-mix(in srgb,#ef4444 50%,transparent);color:#ef4444}
.cf-link{flex:0 0 12px;height:1px;background:var(--line2)}
.cf-act{display:flex;gap:8px;font-size:12px;margin:3px 0;align-items:baseline}
.cf-act .muted{flex:0 0 auto}
.cf-avatar{width:20px;height:20px;border-radius:50%;object-fit:cover;vertical-align:-5px;margin-right:2px}
.cf-more:empty{display:none}

/* ---- Zielbild-Runde 2: Fall-Aufgaben + Kommunikationsvorschlag (Fallakte im Warum-Panel) ---- */
.cf-task{display:flex;align-items:center;gap:8px;font-size:13px;margin:4px 0}
.cf-task.done .cf-task-t{text-decoration:line-through;opacity:.55}
.cf-task-t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.cf-task input[type=checkbox]{accent-color:var(--accent);width:15px;height:15px;flex:0 0 auto}
.cf-assg{font-size:12px;color:var(--muted);white-space:nowrap}
.cf-task-x{background:none;border:none;color:var(--muted);cursor:pointer;padding:2px 6px;border-radius:6px}
.cf-task-x:hover{color:#ef4444;background:color-mix(in srgb,#ef4444 10%,transparent)}
.cf-taskform{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.cf-taskform input[type=date]{max-width:150px}
.cf-taskform input:first-child{flex:1;min-width:160px}
.cf-taskform select{max-width:190px}
.cf-comm{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.cf-comm .muted{font-size:12px}
.cf-comm-subj,.cf-comm-body{width:100%;box-sizing:border-box}
.cf-comm-body{resize:vertical;font:inherit}
.cf-comm-sent{color:#16a34a;font-weight:600;font-size:13px}

/* ---- Zielbild-Runde 3: Zeitversand (Editor-Option + Outbox-Pill 'verworfen') ---- */
.cf-sched{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.cf-sched input[type=datetime-local]{max-width:210px}
.pill.verworfen{border:1px solid var(--line2);color:var(--muted);opacity:.8}

/* ---- Zielbild-Runde 4: Verlängerungsangebot (Fallakte-Zeile + Portal nutzt mo-*-Bestand) ---- */
.cf-offer{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px}
#renewBody textarea{width:100%;box-sizing:border-box;margin-top:6px;font:inherit;resize:vertical}
