/* Bierimmobilien – Rechner. Werte wie Nodus (docs/DESIGN.md): Outfit, Rot nur für den Hauptknopf, 1px Linien, Feld-Karten. */
:root { --rot:#d7261e; --rot-dunkel:#b81f18; --schwarz:#111; --grau:#6b6b6b; --grau-hell:#999; --linie:#e6e6e6; --linie-t:#eee; --rahmen:#dcdcdc;
  --hell:#f5f5f5; --flaeche:#f3f3f3; --gruen:#1f8a3b; --ampelrot:#c62828; --nav:236px; }
* { box-sizing:border-box; }
html, body { height:100%; }
body { margin:0; font-family:Outfit, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; color:var(--schwarz); background:var(--flaeche); font-size:15px; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
[hidden] { display:none !important; }

/* Seitenleiste – Werte 1:1 aus Nodus (styles.css, Stand 05.11.2026) */
aside.seite { position:fixed; inset:0 auto 0 0; width:var(--nav); background:var(--schwarz); color:#fff; padding:12px 0 0; display:flex; flex-direction:column; z-index:30; transition:width .18s ease; }
.seite-kopf { display:flex; align-items:center; gap:2px; padding:0 8px 12px 10px; border-bottom:1px solid #2a2a2a; margin-bottom:8px; flex:none; }
.seite-kopf .logo { display:flex; align-items:center; gap:9px; padding:4px; flex:1; min-width:0; color:#fff; }
.logo-bild { width:34px; height:34px; object-fit:contain; background:#fff; border-radius:8px; padding:3px; flex:none; }
.logo-text { display:flex; flex-direction:column; min-width:0; line-height:1.2; } .logo-text b { color:#fff; font-size:15px; letter-spacing:-.1px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.kopf-lupe, .einklappen { background:none; border:none; color:#aaa; padding:5px; height:auto; border-radius:6px; cursor:pointer; display:flex; flex:none; }
.kopf-lupe:hover, .einklappen:hover { background:#222; color:#fff; } .kopf-lupe svg, .einklappen svg { width:18px; height:18px; }
#nav { padding:0 8px; flex:1; overflow-y:auto; min-height:0; }
#nav a { display:flex; align-items:center; gap:12px; color:#ddd; padding:9px 12px; margin:0 0 2px; border-radius:8px; font-size:15px; font-weight:400; position:relative; }
#nav a svg { width:19px; height:19px; flex:0 0 19px; }
#nav a:hover { background:#1d1d1d; color:#fff; }
#nav a.aktiv { background:#262626; color:#fff; font-weight:500; }
#nav a b { margin-left:auto; background:var(--rot); color:#fff; border-radius:9px; padding:0 7px; font-size:12px; font-weight:500; } #nav a b:empty { display:none; }
.nav-text { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.seite-fuss { display:flex; align-items:center; gap:6px; padding:10px 12px; border-top:1px solid #2a2a2a; position:relative; flex:none; }
.fuss-knopf { display:flex; padding:8px; border-radius:8px; color:#bbb; } .fuss-knopf svg { width:21px; height:21px; }
.fuss-knopf:hover, .fuss-knopf.aktiv { background:#262626; color:#fff; }
#konto-platz { margin-left:auto; }
.avatar { width:34px; height:34px; border-radius:50%; background:var(--rot); color:#fff; font-weight:600; font-size:13px; display:flex; align-items:center; justify-content:center; border:2px solid #333; cursor:pointer; padding:0; }
.avatar:hover { border-color:#666; background:var(--rot); }
.konto-menue { position:absolute; bottom:58px; left:10px; width:220px; background:#fff; color:var(--schwarz); border-radius:10px; box-shadow:0 10px 30px rgba(0,0,0,.35); padding:6px; z-index:50; }
.konto-menue .wer { padding:10px 10px 8px; border-bottom:1px solid var(--linie); margin-bottom:4px; } .konto-menue .wer b { display:block; } .konto-menue .wer span { font-size:12px; color:var(--grau); }
.konto-menue a { display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:6px; color:var(--schwarz); } .konto-menue a:hover { background:var(--hell); }
/* Suche ⌘K */
.such-grund { align-items:flex-start; padding-top:12vh; }
.such-fenster { width:620px; max-width:100%; background:#fff; border-radius:14px; box-shadow:0 20px 60px rgba(0,0,0,.3); overflow:hidden; }
.such-feld { display:flex; align-items:center; gap:10px; padding:14px 16px; border-bottom:1px solid var(--linie-t); } .such-feld svg { color:var(--grau); flex:none; }
.such-feld input { flex:1; border:none; outline:none; font:inherit; font-size:17px; } .such-feld kbd { font:inherit; font-size:11px; color:var(--grau); border:1px solid var(--linie); border-radius:5px; padding:1px 6px; }
.such-liste { max-height:420px; overflow:auto; padding:6px; } .such-liste .leer-text { padding:14px; color:var(--grau); font-size:14px; }
.such-treffer { display:flex; align-items:center; gap:12px; padding:9px 12px; border-radius:8px; } .such-treffer.aktiv, .such-treffer:hover { background:var(--hell); }
.such-treffer span { flex:1; min-width:0; } .such-treffer b { display:block; font-weight:500; font-size:15px; } .such-treffer small { display:block; font-size:13px; color:var(--grau); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.such-treffer em { font-style:normal; font-size:12px; color:var(--grau); }

main { margin-left:var(--nav); padding:8px 10px 16px; height:100vh; display:flex; flex-direction:column; min-width:0; overflow:hidden; transition:margin-left .18s ease; }
main > .kopf:first-child { margin-top:2px; }
main.scroll { overflow:auto; }

/* Kopf, Reiter, Filter */
.kopf { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:18px; flex:none; }
.kopf h1 { margin:0; font-size:22px; font-weight:600; }
.kopf .rechts { margin-left:auto; display:flex; gap:8px; align-items:center; }
.unterzeile { font-size:13px; color:var(--grau); }
h2 { font-size:17px; font-weight:600; margin:0 0 12px; } h3 { font-size:15px; font-weight:600; margin:0 0 8px; }
.klein-text { font-size:13px; color:var(--grau); }
.rot-text { color:var(--ampelrot); font-weight:600; } .gruen-text { color:var(--gruen); }

button, .btn { font-weight:500; font-size:15px; height:40px; padding:0 14px; border-radius:8px; border:1px solid #dcdcdc; background:#fff; color:var(--schwarz);
  cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:7px; white-space:nowrap; }
button:hover, .btn:hover { background:var(--hell); border-color:#bdbdbd; }
button.primaer, .btn.primaer { background:var(--rot); border-color:var(--rot); color:#fff; font-weight:600; } button.primaer:hover, .btn.primaer:hover { background:var(--rot-dunkel); border-color:var(--rot-dunkel); }
button.klein { height:32px; padding:0 10px; font-size:14px; }
button.link, .link { border:none; background:none; height:auto; padding:0; color:var(--grau); font-size:13px; font-weight:500; } button.link:hover { background:none; color:var(--schwarz); }
button.rot-link { border:none; background:none; color:var(--ampelrot); padding:0; height:auto; }
button:disabled { opacity:.45; cursor:default; }
.ik { width:36px; height:36px; padding:0; border:1px solid var(--rahmen); border-radius:8px; background:#fff; flex:none; }
.ik.still { border-color:transparent; width:30px; height:30px; } .ik.still:hover { border-color:#d9d9d9; }
.ik svg { width:18px; height:18px; }

.segment { display:inline-flex; gap:2px; background:#e9e9e9; border-radius:9px; padding:3px; }
.segment > button, .segment > a { border:none; border-radius:7px; height:auto; padding:4px 12px; font-size:13.5px; font-weight:500; background:none; color:#5e5e5e; }
.segment > .an { background:#fff; color:#131313; box-shadow:0 1px 2px rgba(0,0,0,.14); }

.reiter { display:flex; gap:2px; min-height:46px; align-items:flex-end; border-bottom:1px solid var(--linie); margin-bottom:16px; flex:none; overflow-x:auto; }
.reiter button { background:none; border:none; border-bottom:2px solid transparent; border-radius:0; height:auto; padding:8px 6px; margin-right:12px; font-size:15px; font-weight:500; color:#6a6a6a; }
.reiter button.an { color:#131313; font-weight:600; border-bottom-color:#131313; } .reiter button:hover { background:none; color:#131313; }
.reiter .zahl { font-size:12px; color:var(--grau); margin-left:4px; font-weight:500; }

.filterleiste { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:14px; flex:none; }
.suchfeld { position:relative; display:flex; align-items:center; flex:0 1 320px; min-width:220px; }
.suchfeld input { width:100%; height:40px; padding:0 34px 0 12px; border:1px solid #d9d9d9; border-radius:8px; font:inherit; background:#fff; }
.suchfeld svg { position:absolute; right:11px; width:18px; height:18px; color:var(--grau); pointer-events:none; }
.fbtn { display:inline-flex; align-items:center; gap:7px; height:40px; padding:0 12px; border:1px solid var(--rahmen); border-radius:8px; background:#fff; font-weight:500; color:var(--schwarz); }
.fbtn svg { width:18px; height:18px; color:#555; } .fbtn svg.pfeil { width:14px; height:14px; }
.fbtn.an { border-color:var(--schwarz); box-shadow:inset 0 0 0 1px var(--schwarz); }

/* Aufklappliste (Filter, Auswahl, ⋮) */
.menue { position:fixed; z-index:80; background:#fff; border:1px solid #e5e5e5; border-radius:14px; box-shadow:0 10px 30px rgba(0,0,0,.18); padding:4px; min-width:200px; max-height:360px; overflow:auto; }
.menue input.msuche { width:100%; height:36px; border:none; background:var(--hell); border-radius:8px; padding:0 10px; margin-bottom:4px; font:inherit; }
.menue .eintrag { display:flex; align-items:center; justify-content:space-between; gap:14px; width:100%; height:auto; padding:8px 10px; border:none; border-radius:8px; background:none; font-weight:400; font-size:14.5px; text-align:left; white-space:nowrap; }
.menue .eintrag:hover, .menue .eintrag.aktiv { background:var(--hell); }
.menue .eintrag.gewaehlt { font-weight:600; } .menue .eintrag.gewaehlt::after { content:"✓"; color:var(--rot); }
.menue .eintrag.rot { color:var(--ampelrot); } .menue hr { border:none; border-top:1px solid #eee; margin:4px 0; }
.menue .leer-text { padding:8px 10px; color:var(--grau); font-size:14px; }

/* Kacheln */
.kacheln { display:grid; grid-template-columns:repeat(auto-fill, minmax(190px, 1fr)); gap:14px; margin-bottom:18px; flex:none; }
.kacheln.klein { grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); }
.kachel { background:#fff; border:1px solid var(--linie); border-radius:10px; padding:16px; color:inherit; display:block; position:relative; cursor:pointer; }
.kachel:hover { border-color:var(--schwarz); }
.kachel .zahl { font-size:30px; font-weight:700; line-height:1.2; }
.kacheln.klein .kachel { padding:12px 14px; } .kacheln.klein .zahl { font-size:24px; text-align:right; }
.kachel .titel { font-size:14px; color:#333; } .kachel .unter { font-size:13px; color:var(--grau); margin-top:2px; }
.kachel.warn .zahl { color:var(--rot); }
.kachel .ziel { position:absolute; top:12px; right:14px; font-size:12px; color:#aaa; }

/* Tabelle (die feine) */
.tabelle { background:#fff; border:1px solid var(--linie); border-radius:10px; display:flex; flex-direction:column; min-height:0; overflow:hidden; }
.tabelle.fuellt { flex:1; }
.tabelle-scroll { overflow:auto; flex:1; min-height:0; }
.tabelle table { width:100%; border-collapse:collapse; font-size:14px; }
.tabelle th { position:sticky; top:0; background:#fff; z-index:1; height:52px; padding:12px 4px 12px 14px; text-align:left; font-weight:600; color:#2b2b2b; border-bottom:1px solid var(--linie-t); white-space:nowrap; }
.tabelle td { height:64px; padding:12px 4px 12px 14px; border-bottom:1px solid var(--linie-t); vertical-align:middle; }
.tabelle tr.klick { cursor:pointer; } .tabelle tr.klick:hover td { background:#fbfbfb; }
.tabelle td.zahl, .tabelle th.zahl { text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.tabelle td.menue-zelle, .tabelle th.menue-zelle { width:52px; text-align:center; padding:0 6px; }
.tabelle td.bild-zelle { width:72px; padding-right:0; }
/* letzte Spalte: Abstand zum rechten Rand, sonst wirkt die Tabelle abgeschnitten (Dom 13.11.2026) */
.tabelle th:last-child:not(.menue-zelle), .tabelle td:last-child:not(.menue-zelle):not(.bild-zelle) { padding-right:16px; }
.tabelle-fuss { display:flex; align-items:center; gap:10px; padding:14px 16px; color:var(--grau); font-size:14px; background:#fff; border-top:1px solid var(--linie-t); flex:none; }
.tabelle-fuss .rechts { margin-left:auto; }
.leer { padding:40px 20px; text-align:center; color:var(--grau); background:#fff; border:1px solid var(--linie); border-radius:10px; }
.mini-bild { width:44px; height:44px; border-radius:6px; object-fit:cover; display:flex; align-items:center; justify-content:center; background:#f0f0f0; border:1px solid #e5e5e5; color:#9a9a9a; }
.mini-bild.breit { width:56px; } .mini-bild svg { width:22px; height:22px; }

/* Marken */
.marke { display:inline-block; font-size:12.5px; font-weight:500; line-height:1.45; padding:2px 8px; border-radius:4px; background:#ebeae7; color:#4a4844; white-space:nowrap; }
.marke.schwarz { background:#2a2a2a; color:#fff; } .marke:empty { display:none; }
.marke.blau { background:#e1e9f7; color:#2c4a86; } .marke.gruen { background:#e3eedb; color:#3d5e26; } .marke.gelb { background:#f7edc4; color:#6e5410; }
.marke.orange { background:#f7e0cf; color:#8c4318; } .marke.rot { background:#f6dcdb; color:#962626; } .marke.lila { background:#e9e1f1; color:#55387a; }

/* Karten / Akte */
.karte { background:#fff; border:1px solid var(--linie); border-radius:10px; padding:18px; }
.akte { display:grid; grid-template-columns:minmax(0, 2fr) minmax(300px, 1fr); gap:16px; flex:1; min-height:0; }
.akte-links { overflow:auto; display:flex; flex-direction:column; gap:16px; min-height:0; padding-bottom:4px; }
.kaesten { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:16px; }
.kasten { background:#fff; border:1px solid var(--linie); border-radius:12px; padding:16px 18px; }
.kasten > h3, .kasten-kopf h3 { font-size:15px; font-weight:600; }
.kasten-kopf { display:flex; align-items:center; gap:8px; margin-bottom:6px; } .kasten-kopf h3 { margin:0; flex:1; }
.daten { display:flex; justify-content:space-between; gap:14px; padding:9px 0; border-bottom:1px solid var(--linie-t); font-size:14px; }
.daten:last-child { border-bottom:none; } .daten > span:first-child { color:var(--grau); flex:none; } .daten > span:last-child { text-align:right; }
.ergaenzen { font-size:13px; color:var(--grau); padding-top:8px; }
.verlauf-kasten { background:#fff; border:1px solid var(--linie); border-radius:12px; display:flex; flex-direction:column; min-height:0; }
.verlauf-kasten > h3 { padding:16px 18px 8px; margin:0; }
.verlauf-liste { overflow:auto; padding:0 18px 12px; flex:1; }
.vz { display:grid; grid-template-columns:58px 1fr; gap:10px; padding:10px 0; border-bottom:1px solid var(--linie-t); font-size:14px; }
.vz .tag { font-size:12px; color:var(--grau); line-height:1.3; } .vz .tag b { display:block; font-size:14px; color:var(--schwarz); font-weight:600; }
.vz .wer { font-size:12px; color:var(--grau); }
.hinweis { background:#fbefc5; color:#5c4500; border-radius:8px; padding:10px 14px; font-size:14px; margin-bottom:14px; flex:none; }

.akte-titel { display:flex; align-items:center; gap:14px; }
.akte-titel .foto { width:56px; height:56px; border-radius:10px; object-fit:cover; background:#ececec; display:flex; align-items:center; justify-content:center; color:#999; flex:none; }
.akte-titel .foto svg { width:26px; height:26px; }

/* Immobilien-Kacheln */
.immo-raster { display:grid; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); gap:14px; overflow:auto; padding-bottom:4px; }
.immo-karte { background:#fff; border:1px solid var(--linie); border-radius:10px; overflow:hidden; display:flex; flex-direction:column; }
.immo-karte:hover { border-color:var(--schwarz); }
.immo-karte .bild { height:170px; background:#ececec; display:flex; align-items:center; justify-content:center; color:#999; }
.immo-karte .bild img { width:100%; height:100%; object-fit:cover; } .immo-karte .bild svg { width:44px; height:44px; }
.immo-karte .inhalt { padding:12px 14px; display:flex; flex-direction:column; gap:4px; }
.immo-karte .zeile1 { display:flex; align-items:center; gap:8px; } .immo-karte .zeile1 b { font-size:16px; font-weight:600; flex:1; }

.immo-kopf { display:grid; grid-template-columns:320px minmax(0,1fr); gap:16px; margin-bottom:6px; flex:none; }
.immo-kopf .bild { height:190px; border-radius:12px; overflow:hidden; background:#ececec; display:flex; align-items:center; justify-content:center; color:#999; position:relative; cursor:pointer; }
.immo-kopf .bild img { width:100%; height:100%; object-fit:cover; }
.immo-kopf .bild .tausch { position:absolute; right:8px; bottom:8px; background:#fff; border-radius:8px; padding:4px 10px; font-size:13px; opacity:0; transition:opacity .15s; }
.immo-kopf .bild:hover .tausch { opacity:1; }

/* Belegungsplan */
  cursor:pointer; border:1px solid transparent; background:#e9e9e9; color:#111; z-index:1; justify-content:flex-start; } .balken:hover { background:#dedede; } .balken.bald:hover { background:#fbd3bb; }
/* Belegungsplan 1:1 wie die Nodus-Plantafel (Werte aus Nodus styles.css .pt-*) */
.pt-knoepfe { display:flex; gap:8px; align-items:center; } .pt-knoepfe .segment button { min-width:36px; justify-content:center; }
.pt-zahlen { margin-left:auto; font-size:13.5px; color:var(--grau); align-self:center; }
.pt { flex:1 1 auto; min-height:0; overflow:auto; background:#fff; border:1px solid #e3e3e3; border-radius:8px; position:relative; }
.pt-innen { position:relative; min-height:100%; }
.pt-koerper { position:relative; }
.pt-hinter { position:absolute; top:0; pointer-events:none; z-index:0; background-image:linear-gradient(to right, #eee 1px, transparent 1px); background-size:var(--tw) 100%; } .pt-hinter div { position:absolute; top:0; bottom:0; } .pt-hinter .frei { background:#f5f5f5; } .pt-hinter .heute { background:#eaf5ee; }
.pt-zeile { display:flex; position:relative; z-index:1; border-bottom:1px solid #eee; }
.pt-l { position:sticky; left:0; z-index:3; flex:0 0 230px; width:230px; background:#fff; border-right:1px solid #e3e3e3; display:flex; align-items:center; gap:6px; padding:0 8px 0 10px; box-sizing:border-box; min-width:0; }
.pt-r { position:relative; flex:1; min-height:100%; }
.pt-reihe .pt-r { cursor:copy; } .pt-reihe .pt-r:hover { background:rgba(0,0,0,.02); }
.pt-kopf { position:sticky; top:0; z-index:5; background:#fff; } .pt-kopf .pt-zeile { background:#fff; } .pt-kopf .pt-l { z-index:6; }
.pt-monate, .pt-kws { height:30px; } .pt-monate span, .pt-kws span { position:absolute; top:0; bottom:0; display:flex; align-items:center; padding:0 8px; box-sizing:border-box; border-left:1px solid #eee; white-space:nowrap; overflow:clip; }
.pt-monate em, .pt-kws em { position:sticky; left:238px; font-style:normal; white-space:nowrap; }
.pt-monate span { font-weight:700; font-size:15px; } .pt-kws span { font-size:13px; color:#555; }
.pt-tage { height:54px; } .pt-tage .pt-r { display:flex; } .pt-tag { flex:none; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; border-left:1px solid #eee; box-sizing:border-box; font-size:12px; color:#666; overflow:hidden; }
.pt-tag b { font-size:15px; font-weight:500; color:#111; } .pt-tag.we { background:#f5f5f5; }
.pt-tag.heute { background:#eaf5ee; color:#1f7a4d; } .pt-tag.heute b { color:#fff; background:#1f7a4d; border-radius:12px; padding:0 7px; font-weight:600; }
.pt-l-kopf { font-size:15px; } .pt-auf { border:none; background:none; padding:2px; display:flex; color:#111; height:auto; }
.pt-gruppe { height:46px; } .pt-gruppe .pt-l { cursor:pointer; } .pt-gruppe .pt-l small { margin-left:auto; font-size:12.5px; color:var(--grau); white-space:nowrap; }
.pt-gname { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:500; }
.pt-reihe { height:52px; }
.pt-name { flex:1; min-width:0; padding-left:22px; display:flex; flex-direction:column; } .pt-name b { font-weight:500; font-size:14.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .pt-name small { font-size:12px; color:var(--grau); }
.pt-balken { position:absolute; top:7px; bottom:7px; height:auto; border:none; border-radius:6px; background:#e8e8e8; display:flex; align-items:center; justify-content:flex-start; padding:0; font-size:14px; font-weight:500; color:#111; cursor:pointer; z-index:2; overflow:clip; box-sizing:border-box; }
.pt-balken:hover { filter:brightness(.96); }
.pt-text { flex:0 1 auto; min-width:0; padding:0 8px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; position:sticky; left:238px; } .pt-text small { font-weight:400; color:#555; font-size:12.5px; }
.pt-balken.bald { background:#fde0cf; } .pt-balken.reserviert { background:#fff; border:1px dashed #8a8a8a; }
.pt-balken.offen::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--ampelrot); flex:none; margin-left:8px; }
.pt-balken.offen .pt-text { padding-left:6px; }
.pt-balken.gewaehlt { box-shadow:inset 0 0 0 2px #111; }
.plan-legende { display:flex; gap:18px; padding:12px 16px; font-size:13.5px; color:var(--grau); flex-wrap:wrap; }
.plan-legende i { display:inline-block; width:14px; height:10px; border-radius:2px; margin-right:6px; vertical-align:middle; }

/* Seitenfenster rechts */
.seitenfenster { position:fixed; top:0; right:0; bottom:0; width:420px; background:#fff; z-index:60; box-shadow:-10px 0 30px rgba(0,0,0,.12); display:flex; flex-direction:column; animation:rein .15s ease-out; }
@keyframes rein { from { transform:translateX(30px); opacity:0; } }
.sf-kopf { display:flex; align-items:flex-start; gap:4px; padding:20px 18px 10px 22px; } .sf-kopf h2 { margin:0; } .sf-kopf > div:first-child { flex:1; min-width:0; }
.sf-inhalt { overflow:auto; padding:0 22px 22px; flex:1; display:flex; flex-direction:column; gap:18px; }
.sf-fuss { display:flex; gap:8px; padding:14px 22px; border-top:1px solid var(--linie-t); }

/* Fenster (Dialog) */
.grund { position:fixed; inset:0; background:rgba(17,17,17,.45); z-index:70; display:flex; align-items:center; justify-content:center; padding:20px; animation:auf .12s ease-out; }
@keyframes auf { from { opacity:0; } }
.fenster { background:#fff; border-radius:12px; box-shadow:0 10px 40px rgba(0,0,0,.25); width:860px; max-width:100%; max-height:calc(100vh - 40px); display:flex; flex-direction:column; }
.fenster.schmal { width:580px; } .fenster.klein { width:520px; }
.f-kopf { display:flex; align-items:flex-start; gap:10px; padding:22px 22px 6px; } .f-kopf h2 { margin:0; } .f-kopf > div { flex:1; min-width:0; }
.f-inhalt { padding:12px 22px 18px; overflow:auto; display:flex; flex-direction:column; gap:12px; }
.f-fuss { display:flex; gap:8px; align-items:center; padding:14px 22px; border-top:1px solid var(--linie-t); }
.f-fuss .primaer { min-width:150px; } .f-fuss .rechts { margin-left:auto; display:flex; gap:8px; }

/* Felder als Karten (Nodus ab 6.28) */
.reihe { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px; } .reihe.drei { grid-template-columns:repeat(3, minmax(0,1fr)); }
.reihe .breit { grid-column:1 / -1; }
label.feld, div.feld { position:relative; display:flex; flex-direction:column; justify-content:center; gap:1px; min-height:58px; padding:7px 14px; border:1px solid #e1e1e1; border-radius:12px; background:#fff; cursor:text; }
.feld > small { font-size:12px; color:var(--grau); }
.feld input, .feld select, .feld textarea { border:none; outline:none; padding:0; font:inherit; font-size:15px; font-weight:600; color:#111; background:transparent; width:100%; }
.feld textarea { resize:none; font-weight:500; min-height:44px; field-sizing:content; }
.feld input::placeholder, .feld textarea::placeholder { color:#a8a8a8; font-weight:500; }
.feld:focus-within { border-color:#111; box-shadow:0 0 0 3px rgba(17,17,17,.06); }
.feld.fehler { border-color:var(--rot); }
.feld .rechts-icon { position:absolute; right:12px; top:50%; transform:translateY(-50%); width:18px; height:18px; color:var(--grau); pointer-events:none; }
.feld .wahl-knopf { border:none; background:none; height:auto; padding:0; justify-content:space-between; font-size:15px; font-weight:600; width:100%; text-align:left; }
.feld .wahl-knopf.leer { color:#a8a8a8; font-weight:500; } .feld .wahl-knopf:hover { background:none; }
.feld .wahl-ein { display:flex; align-items:center; gap:6px; } .feld .wahl-ein input { flex:1; min-width:0; cursor:text; text-overflow:ellipsis; } .feld .wahl-ein svg { flex:none; color:var(--grau); }
.feld:has(.wahl-ein) { cursor:pointer; }
.feld .schiene { margin-top:4px; display:flex; width:100%; border-radius:10px; } .feld .schiene button { flex:1; border-radius:8px; padding:5px 8px; }
.titel-klein { font-size:13px; color:var(--grau); margin:4px 0 -4px; }
.schiene { display:inline-flex; gap:2px; background:#e9e9e9; border-radius:9px; padding:3px; width:max-content; }
.schiene button { border:none; height:auto; border-radius:7px; padding:5px 13px; font-size:14px; font-weight:500; background:none; color:#5e5e5e; }
.schiene button.an { background:#fff; color:#131313; box-shadow:0 1px 2px rgba(0,0,0,.14); } .schiene button:hover { background:rgba(255,255,255,.55); }
label.haken-feld { display:flex; align-items:center; gap:10px; min-height:58px; padding:0 14px; border:1px solid #e1e1e1; border-radius:12px; font-size:15px; font-weight:500; cursor:pointer; }
label.haken-feld input { appearance:none; -webkit-appearance:none; flex:none; width:22px; height:22px; margin:0; border:1.5px solid #c8c8c8; border-radius:7px; background:#fff; display:grid; place-items:center; cursor:pointer; transition:background .12s, border-color .12s; }
label.haken-feld input:checked { background:var(--rot); border-color:var(--rot); }
label.haken-feld input:checked::after { content:""; width:6px; height:11px; border:solid #fff; border-width:0 2.2px 2.2px 0; transform:translateY(-1px) rotate(45deg); }
label.haken-feld:has(input:checked) { border-color:#e9b9b6; background:#fffafa; }
.wahl-karten { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:8px; }
.wahl-karten button { flex-direction:column; align-items:flex-start; height:auto; gap:2px; padding:10px 12px; border:1px solid #e1e1e1; border-radius:12px; text-align:left; white-space:normal; }
.wahl-karten button b { font-size:14.5px; font-weight:600; } .wahl-karten button small { font-size:12px; color:var(--grau); font-weight:400; }
.wahl-karten button.an { border-color:#111; box-shadow:inset 0 0 0 1px #111; }
.ablage { border:2px dashed #cfcfcf; border-radius:12px; padding:16px; text-align:center; color:var(--grau); font-size:13px; cursor:pointer; background:#fff; }
.ablage.drueber { border-color:#111; color:#111; }

.schl-zeile { display:flex; align-items:center; gap:10px; padding:8px 10px; border:1px solid #e1e1e1; border-radius:12px; font-size:14px; }
.schl-zeile b { width:74px; font-weight:600; } .schl-zeile span { flex:1; }
.unterschrift { width:100%; height:200px; border:1.5px dashed #ccc; border-radius:12px; touch-action:none; display:block; background:#fff; }

.zahlungen { border:1px solid var(--linie); border-radius:10px; overflow:hidden; }
.zahlung { display:grid; grid-template-columns:1fr auto auto auto; gap:10px; align-items:center; padding:10px 12px; border-bottom:1px solid var(--linie-t); font-size:14px; cursor:pointer; }
.zahlung:last-child { border-bottom:none; } .zahlung:hover { background:#fbfbfb; }
.zahlung .betrag { min-width:84px; text-align:right; font-variant-numeric:tabular-nums; }

/* Dashboard */
.dash { display:grid; grid-template-columns:minmax(0,2fr) minmax(300px,1fr); gap:16px; }
.saeulen { display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:10px; align-items:end; height:190px; border-bottom:1px solid var(--linie); position:relative; }
.saeule { display:flex; align-items:flex-end; justify-content:center; gap:3px; height:100%; position:relative; }
.saeule i { display:block; width:42%; border-radius:3px 3px 0 0; } .saeule i.soll { background:#d6d6d6; } .saeule i.ist { background:#303030; } .saeule.jetzt i.ist { background:var(--rot); }
.saeulen-namen { display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:10px; font-size:12px; color:var(--grau); text-align:center; padding-top:6px; }
.liste-zeile { display:flex; align-items:center; gap:10px; padding:10px 0; border-bottom:1px solid var(--linie-t); font-size:14px; }
.liste-zeile:last-child { border-bottom:none; } .liste-zeile .mitte { flex:1; min-width:0; } .liste-zeile .mitte small { display:block; color:var(--grau); font-size:12.5px; }

/* Anmeldung */
.anmeldung { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px; }
.anmeldung .karte { width:400px; max-width:100%; display:flex; flex-direction:column; gap:12px; padding:28px; border-radius:14px; }
.anmeldung img { width:56px; height:56px; } .anmeldung h1 { font-size:22px; margin:4px 0 4px; }

#toast { position:fixed; bottom:22px; left:calc(50% + var(--nav) / 2); transform:translateX(-50%); background:#111; color:#fff; padding:10px 18px; border-radius:8px; opacity:0; transition:opacity .2s; pointer-events:none; z-index:90; font-size:14px; }
#toast.an { opacity:1; } #toast.fehler { background:var(--ampelrot); }
.laedt { padding:40px; color:var(--grau); }
.pac-container { z-index:100 !important; border-radius:12px; font-family:Outfit, sans-serif; }

/* Dateien */
.datei-zeile { display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:8px; font-size:14px; }
.datei-zeile:hover { background:var(--hell); } .datei-zeile .name { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.datei-zeile svg { width:20px; height:20px; color:#777; flex:none; }
.betrachter { position:fixed; inset:0; z-index:85; background:rgba(17,17,17,.85); display:flex; flex-direction:column; }
.betrachter-kopf { display:flex; align-items:center; gap:10px; padding:10px 14px; color:#fff; }
.betrachter-kopf .ik { background:transparent; border-color:#555; color:#fff; } .betrachter-kopf span { flex:1; }
.betrachter img { flex:1; border:none; background:#fff; margin:0 14px 14px; border-radius:8px; min-height:0; object-fit:contain; }
.pdfa { position:relative; flex:1; min-height:0; display:flex; flex-direction:column; background:#ececec; margin:0 14px 14px; border-radius:8px; overflow:hidden; }
.pdfa-seiten { flex:1 1 auto; min-height:0; overflow:auto; padding:16px; }
.pdfa-innen { display:flex; flex-direction:column; align-items:center; gap:14px; width:fit-content; min-width:100%; } .pdfa-innen canvas { background:#fff; box-shadow:0 1px 6px rgba(0,0,0,.14); display:block; }
.pdfa-lade { padding:40px; text-align:center; color:var(--grau); }
.pdfa-leiste { position:absolute; left:50%; transform:translateX(-50%); top:10px; z-index:3; display:flex; background:rgba(30,30,30,.82); border-radius:10px; padding:4px; }
.pdfa-leiste button { border:none; background:none; color:#fff; height:30px; padding:0 10px; border-radius:7px; font-size:13px; } .pdfa-leiste button:hover { background:rgba(255,255,255,.16); }
.pdf-rueckfall { padding:28px 18px; text-align:center; color:var(--grau); line-height:1.45; } .pdf-rueckfall .pdf-fehlertext { font-size:12px; opacity:.75; word-break:break-word; }
.pdf-oeffnen { display:inline-flex; align-items:center; border-radius:24px; padding:12px 20px; background:var(--rot); color:#fff; font-weight:600; }
.adr-treffer { position:absolute; left:-1px; right:-1px; top:calc(100% + 4px); z-index:75; background:#fff; border:1px solid #e5e5e5; border-radius:14px; box-shadow:0 10px 30px rgba(0,0,0,.18); padding:4px; display:flex; flex-direction:column; }
.adr-treffer button { justify-content:flex-start; border:none; height:auto; padding:9px 10px; border-radius:8px; font-weight:400; font-size:14.5px; text-align:left; white-space:normal; gap:8px; }
.adr-treffer button svg { flex:none; color:var(--grau); }

@media (max-width:1100px) { .akte, .dash { grid-template-columns:1fr; } .kaesten { grid-template-columns:1fr; } .immo-kopf { grid-template-columns:1fr; } main { height:auto; min-height:100vh; overflow:visible; } }
@media (max-width:760px) { :root { --nav:0px; } aside.seite { display:none; } main { padding:16px; } .reihe, .reihe.drei { grid-template-columns:1fr; } .wahl-karten { grid-template-columns:repeat(2,1fr); } .seitenfenster { width:100%; } }

/* Mehrere Eigentümer als Chips */
.eig-chips { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-top:4px; }
.eig-chip { display:inline-flex; align-items:center; gap:4px; height:30px; padding:0 4px 0 10px; border:1px solid #dcdcdc; border-radius:999px; font-size:14px; font-weight:600; background:#fff; }
.eig-chip button { width:22px; height:22px; padding:0; border:none; border-radius:50%; background:none; color:#6b6b6b; } .eig-chip button:hover { background:var(--hell); }

/* ---------- Runde 2: Seitenleiste einklappbar, Objekt-Menü, Bereiche ---------- */
/* Eingeklappt wie Nodus: nur Symbole, Zähler als roter Punkt; in Immobilie/Einheit klappt die Leiste von selbst ein und geht beim Überfahren auf */
body.nav-zu, body.nav-auto-zu { --nav:64px; }
:is(body.nav-zu, body.nav-auto-zu:not(:has(aside.seite:hover))) .logo, :is(body.nav-zu, body.nav-auto-zu:not(:has(aside.seite:hover))) .kopf-lupe, :is(body.nav-zu, body.nav-auto-zu:not(:has(aside.seite:hover))) .nav-text, :is(body.nav-zu, body.nav-auto-zu:not(:has(aside.seite:hover))) .fuss-knopf { display:none; }
:is(body.nav-zu, body.nav-auto-zu:not(:has(aside.seite:hover))) .seite-kopf { flex-direction:column; padding:0 8px 10px; }
:is(body.nav-zu, body.nav-auto-zu:not(:has(aside.seite:hover))) #nav a { justify-content:center; padding:10px 0; }
:is(body.nav-zu, body.nav-auto-zu:not(:has(aside.seite:hover))) #nav a b { position:absolute; top:4px; right:8px; padding:0; min-width:8px; height:8px; font-size:0; border-radius:50%; }
:is(body.nav-zu, body.nav-auto-zu:not(:has(aside.seite:hover))) .seite-fuss { flex-direction:column; padding:10px 0; } :is(body.nav-zu, body.nav-auto-zu:not(:has(aside.seite:hover))) #konto-platz { margin:0; }
body.nav-zu .einklappen svg, body.nav-auto-zu .einklappen svg { transform:scaleX(-1); }
body.nav-zu .konto-menue, body.nav-auto-zu .konto-menue { left:8px; }
body.nav-auto-zu:not(.nav-zu) aside.seite:hover { width:236px; z-index:65; box-shadow:6px 0 24px rgba(0,0,0,.25); }
main.tief { padding:0; }
.tief-rahmen { display:flex; height:100vh; min-height:0; }
.om { flex:0 0 250px; background:#fff; border-right:1px solid var(--linie); display:flex; flex-direction:column; min-height:0; position:relative; transition:flex-basis .15s; }
.om.zu { flex-basis:46px; } .om.zu .om-kopf, .om.zu .om-liste { display:none; }
.om-klapp { position:absolute; right:8px; top:16px; width:28px; height:28px; padding:0; border:none; color:#888; background:none; } .om.zu .om-klapp { right:9px; }
.om-kopf { display:flex; align-items:flex-start; gap:6px; padding:16px 40px 10px 10px; } .om-kopf b { display:block; font-size:15px; font-weight:600; } .om-kopf span { display:block; font-size:12px; color:var(--grau); }
.om-kopf .om-ober { font-size:12.5px; color:var(--grau); margin-bottom:2px; }
.om-zurueck { padding:3px; border-radius:6px; color:#111; } .om-zurueck:hover { background:var(--hell); }
.om-liste { overflow:auto; padding:0 10px 12px; flex:1; display:flex; flex-direction:column; }
.om-liste a { display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:8px; font-size:15px; color:var(--schwarz); }
.om-liste a:hover { background:var(--hell); } .om-liste a.an { background:#ececec; color:#111; font-weight:600; } .om-liste a.spaeter { color:#a6a6a6; }
.om-liste a .z { margin-left:auto; font-size:12px; color:var(--grau); font-weight:500; } .om-liste a .z.rot { color:var(--rot); font-weight:700; }
.om-gr { font-size:11px; text-transform:uppercase; letter-spacing:.8px; color:var(--grau); padding:14px 10px 6px; }
.om-liste a.unten { margin-top:auto; }
.tief-inhalt { flex:1; min-width:0; overflow:auto; padding:18px 22px 28px; display:flex; flex-direction:column; }
.objekt-kopf { display:flex; gap:16px; background:#fff; border:1px solid var(--linie); border-radius:12px; padding:14px; margin-bottom:16px; flex:none; }
.foto-q { flex:0 0 150px; width:150px; height:150px; border-radius:10px; overflow:hidden; background:#ececec; display:flex; align-items:center; justify-content:center; color:#999; position:relative; cursor:pointer; }
.foto-q img { width:100%; height:100%; object-fit:cover; } .foto-q .tausch { position:absolute; left:6px; right:6px; bottom:6px; background:#fff; border-radius:8px; padding:3px 8px; font-size:12px; text-align:center; opacity:0; transition:opacity .15s; } .foto-q:hover .tausch { opacity:1; }
.kz-raster { flex:1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px 18px; align-content:center; }
.kz-raster small { display:block; font-size:11.5px; letter-spacing:.5px; text-transform:uppercase; color:#666; margin-bottom:3px; } .kz-raster b { font-size:15px; font-weight:500; line-height:1.45; }
.ueb-raster { display:grid; grid-template-columns:minmax(0,2fr) minmax(280px,1fr); gap:16px; align-items:start; } .ueb-raster.drei { grid-template-columns:repeat(2,minmax(0,1fr)) minmax(260px,.9fr); }
.ampel { width:10px; height:10px; border-radius:50%; display:inline-block; flex:none; background:var(--gruen); } .ampel.orange { background:#d49a00; } .ampel.rot { background:var(--ampelrot); }
.schnell-raster, .vorlagen { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; margin-bottom:16px; flex:none; } .vorlagen { grid-template-columns:repeat(4,minmax(0,1fr)); }
.schnell { flex-direction:column; align-items:flex-start; justify-content:flex-start; height:auto; gap:2px; padding:10px 12px; border:1px solid #e1e1e1; border-radius:12px; text-align:left; white-space:normal; }
.schnell b { font-size:14.5px; font-weight:600; } .schnell small { font-size:12px; color:var(--grau); font-weight:400; } .schnell:hover { border-color:#111; background:#fff; } .schnell.spaeter b { color:#999; }
.tabelle tr.mv-kopf td { height:34px; font-size:12px; text-transform:uppercase; letter-spacing:.4px; color:var(--grau); background:#fafafa; font-weight:600; }
.tabelle tr.mv-zeile td { height:44px; background:#fbfbfb; font-size:13.5px; }
.kacheln a.kachel { text-decoration:none; }
/* Ablage wie Nodus */
.abl-pfad { display:flex; align-items:center; gap:6px; font-size:15px; } .abl-pfad span { color:#bbb; }
.abl { background:#fff; border:1px solid var(--linie); border-radius:10px; flex:1; min-height:240px; overflow:auto; padding:6px; }
.abl.drueber, .abl-ordner.drueber { outline:2px dashed #111; outline-offset:-4px; }
.abl.liste .abl-ordner, .abl.liste .abl-datei { display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:8px; font-size:14px; cursor:pointer; }
.abl.liste .abl-ordner:hover, .abl.liste .abl-datei:hover { background:var(--hell); } .abl .name { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.abl.liste .abl-ordner svg { color:#d49a00; } .abl.liste .abl-datei svg { color:#777; }
.abl.kacheln { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:10px; align-content:start; padding:10px; }
.abl.kacheln .abl-ordner, .abl.kacheln .abl-datei { display:flex; flex-direction:column; align-items:center; gap:6px; padding:10px; border:1px solid var(--linie); border-radius:10px; cursor:pointer; position:relative; text-align:center; font-size:13px; }
.abl.kacheln img { width:100%; aspect-ratio:1; object-fit:cover; border-radius:6px; } .abl.kacheln .abl-ordner svg { color:#d49a00; }
.abl.kacheln .ik { position:absolute; top:4px; right:4px; } .abl.kacheln .klein-text { font-size:11.5px; } .abl.kacheln .name { white-space:normal; width:100%; }
.abl-leer { padding:40px; text-align:center; color:var(--grau); grid-column:1/-1; }
/* Zuschneiden */
.zs-grund { position:fixed; inset:0; z-index:95; background:rgba(17,17,17,.6); display:flex; align-items:center; justify-content:center; padding:16px; }
.zs-fenster { background:#fff; border-radius:14px; padding:18px; display:flex; flex-direction:column; gap:10px; max-width:100%; }
.zs-kopf { display:flex; align-items:center; } .zs-kopf b { flex:1; font-size:17px; } .zs-kopf button { border:none; background:none; font-size:18px; height:auto; padding:4px; }
.zs-hinweis { font-size:13px; color:#6b6b6b; } .zs-fenster canvas { border:2px solid #111; border-radius:8px; cursor:grab; display:block; } .zs-fenster input { width:100%; accent-color:#111; }
.zs-fuss { display:flex; gap:8px; justify-content:flex-end; } .zs-fuss .rot { background:var(--rot); border-color:var(--rot); color:#fff; }
.immo-karte .bild { height:auto; aspect-ratio:1; }
@media (max-width:1100px) { .ueb-raster, .ueb-raster.drei { grid-template-columns:1fr; } .schnell-raster { grid-template-columns:repeat(2,1fr); } .kz-raster { grid-template-columns:repeat(2,1fr); } .tief-rahmen { height:auto; } }
/* Einstellungen wie Nodus: Spalte links, Karten rechts, Stift zum Bearbeiten */
.einst { display:flex; height:100vh; min-height:0; }
.einst-menue { width:250px; flex:0 0 250px; background:#fff; border-right:1px solid var(--linie); padding:16px 10px; overflow:auto; }
.einst-menue h1 { font-size:20px; font-weight:600; padding:0 10px; margin:0 0 14px; }
.einst-titel { font-size:11px; text-transform:uppercase; letter-spacing:.8px; color:var(--grau); padding:14px 10px 6px; }
.einst-menue a { display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:8px; color:var(--schwarz); font-size:15px; }
.einst-menue a svg { width:18px; height:18px; flex:none; color:#333; }
.einst-menue a:hover { background:var(--hell); } .einst-menue a.aktiv { background:#ececec; font-weight:600; }
.einst-inhalt { flex:1; min-width:0; overflow:auto; padding:18px 22px 40px; }
.einst-inhalt > h1 { font-size:20px; font-weight:600; margin:0 0 14px; }
.einst-box { max-width:820px; }
.einst-karte { background:#fff; border-radius:10px; padding:20px 22px; margin-bottom:14px; }
.einst-kopf { display:flex; align-items:center; gap:12px; margin-bottom:12px; } .einst-kopf h2 { margin:0; font-size:16px; font-weight:600; flex:1; } .einst-kopf svg { color:#111; flex:none; }
.einst-werte { display:flex; flex-direction:column; gap:14px; padding-left:30px; }
.einst-werte span { display:block; font-size:11.5px; letter-spacing:.5px; text-transform:uppercase; color:#666; margin-bottom:3px; } .einst-werte > div > div { font-size:15px; line-height:1.45; min-height:1.2em; }
.leer-wert { color:#b0b0b0; font-style:normal; }
.einst-hinweis { margin:12px 0 0 30px; } .einst-form .einst-hinweis { margin-left:0; }
.form-fuss { display:flex; justify-content:flex-end; gap:8px; margin-top:14px; }
.einst-box .tabelle { border:none; }
/* Kastentitel in Immobilie/Einheit wie Nodus (pa-box-titel): klein, Großbuchstaben */
.tief-inhalt .kasten > h3, .tief-inhalt .kasten-kopf h3 { font-size:13px; font-weight:400; letter-spacing:.3px; text-transform:uppercase; color:#444; }

/* ---------- Schlüssel wie Nodus (übernommen 05.11.2026 aus Nodus styles.css, vorlagen.css und crm.css: Akte, Kacheln, Blöcke, Verlauf, Übergabe) ---------- */
.lfd { color:var(--grau); font-weight:400; font-size:.8em; } .k-gross { font-size:64px; font-weight:700; text-align:center; letter-spacing:2px; color:var(--rot); } .k-gross .lfd { font-size:.5em; }
.tabelle th.sortier { cursor:pointer; user-select:none; white-space:nowrap; } .tabelle th.sortier:hover, .tabelle th.sortier.an { color:#111; }
.sbild .mini-bild { object-fit:cover; }
.nummer-feld { display:flex; align-items:center; border:1px solid var(--rahmen); border-radius:8px; background:#fff; margin-top:4px; }
.feld .nummer-feld { border:none; margin:0; } .feld .nummer-feld input { padding:0; }
.nummer-feld span { padding:0 4px 0 12px; font-weight:700; color:var(--grau); } .feld .nummer-feld span { padding-left:0; }
.nummer-feld input { border:none; background:none; font:inherit; font-weight:600; font-size:16px; padding:8px 10px 8px 0; width:100%; outline:none; }
.nummer-feld.gross span, .nummer-feld.gross input { font-size:34px; font-weight:700; padding-top:8px; padding-bottom:8px; }
.nummer-feld:focus-within { border-color:#111; }
.schluessel-treffer { display:flex; gap:12px; align-items:center; width:100%; text-align:left; padding:10px 12px; border:1px solid var(--linie); border-radius:12px; background:#fff; margin-bottom:8px; height:auto; white-space:normal; }
.schluessel-treffer:hover { border-color:#111; } .schluessel-treffer .mini-bild { width:56px; height:56px; flex:none; }
.ue-treffer { margin-top:12px; }
.ablage.foto-ablage { height:130px; display:flex; align-items:center; justify-content:center; padding:0; overflow:hidden; }
.ablage.foto-ablage img { height:100%; aspect-ratio:1; object-fit:cover; } .ablage.foto-ablage span { display:flex; flex-direction:column; align-items:center; gap:6px; font-size:13px; }
.us-details summary { cursor:pointer; font-size:14px; color:var(--grau); padding:4px 0; } .us-details[open] summary { margin-bottom:8px; }
.unterschrift-mini { height:44px; max-width:160px; border:1px solid var(--linie); border-radius:6px; background:#fff; vertical-align:middle; margin-top:6px; cursor:zoom-in; }
.unterschrift-gross { max-width:100%; height:120px; border:1px solid var(--linie); border-radius:10px; background:#fff; display:block; }
.gelb-text { color:#8a5a00; font-weight:600; }
/* Akte (Einzelseite) */
main.ak-seite { gap:14px; }
.kx-kopf { display:flex; align-items:center; gap:14px; flex:none; }
.kx-kopf h1 { margin:0; font-size:22px; font-weight:600; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.kx-kopf .kx-unter { color:#6b6b6b; font-size:13.5px; margin-top:2px; }
.kx-kopf .kx-rechts { margin-left:auto; display:flex; align-items:center; gap:8px; }
.kx-zurueck { width:36px; height:36px; border:1px solid #dcdcdc; border-radius:8px; background:#fff; display:inline-flex; align-items:center; justify-content:center; color:#111; flex:none; }
.kx-ik { width:38px; height:38px; border:1px solid #dcdcdc; border-radius:8px; background:#fff; display:inline-flex; align-items:center; justify-content:center; color:#222; padding:0; }
.ak-kopf-text { min-width:0; } .ak-kopf .kx-rechts .primaer { height:38px; padding:0 16px; white-space:nowrap; }
.ak-bild { width:52px; height:52px; object-fit:cover; flex:none; border-radius:9px; background:#f1f1f1; cursor:zoom-in; } .ak-bild.dunkel { background:#111; color:#fff; display:inline-flex; align-items:center; justify-content:center; cursor:default; }
.ak-bild.dunkel svg { width:26px; height:26px; }
.kx-kacheln { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:14px; flex:none; }
.kx-kachel { background:#fff; border:1px solid #e6e6e6; border-radius:12px; padding:13px 16px; display:flex; flex-direction:column; gap:2px; min-width:0; }
.kx-kachel span { font-size:13px; color:#6b6b6b; } .kx-kachel b { font-size:24px; line-height:30px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .kx-kachel small { font-size:12.5px; color:#8a8a8a; }
.kx-kachel b.rot { color:#b42323; } .kx-kachel b.gelb { color:#8a5a00; } .kx-kachel b.gruen { color:#1d6b38; }
.vl-hinweis { display:flex; align-items:center; gap:14px; background:#fff8ec; border:1px solid #f3e1bf; color:#8a5a00; border-radius:10px; padding:9px 14px; font-size:13.5px; flex:none; }
.vl-hinweis span { color:#6b4500; font-weight:600; } .vl-hinweis span + span { border-left:1px solid #ecd6aa; padding-left:14px; }
.vl-block { background:#fff; border:1px solid #e6e6e6; border-radius:12px; display:flex; flex-direction:column; min-width:0; }
.vl-block-kopf { display:flex; align-items:center; gap:8px; padding:14px 18px 6px; }
.vl-block-kopf h2 { margin:0; font-size:15px; font-weight:600; flex:1; display:flex; align-items:center; gap:8px; }
.vl-block-kopf h2 small { font-size:12.5px; color:#9a9a9a; font-weight:500; }
.vl-stift { width:30px; height:30px; border:none; background:none; border-radius:8px; color:#8a8a8a; display:inline-flex; align-items:center; justify-content:center; padding:0; } .vl-stift:hover { background:#f2f2f2; color:#111; }
.vl-felder { margin:0; padding:2px 18px 12px; display:grid; grid-template-columns:120px 1fr; }
.vl-felder dt, .vl-felder dd { margin:0; padding:9px 0; border-bottom:1px solid #f0f0f0; font-size:14px; line-height:1.35; }
.vl-felder dt { color:#8a8a8a; padding-right:12px; } .vl-felder dd { color:#111; min-width:0; overflow-wrap:anywhere; }
.vl-felder dt:nth-last-of-type(1), .vl-felder dd:last-of-type { border-bottom:none; }
.vl-block a:not(.vl-fehlt) { color:#111; } .vl-block a:not(.vl-fehlt):hover { text-decoration:underline; }
.vl-notiz { margin:0 18px 14px; background:#f7f7f7; border-radius:8px; padding:10px 12px; font-size:13.5px; line-height:1.45; color:#333; } .vl-notiz small { display:block; color:#8a8a8a; font-size:12px; margin-bottom:2px; }
.vl-fehlt { display:flex; align-items:center; gap:6px; margin:0 18px 12px; font-size:13px; color:#9a9a9a; } .vl-fehlt:hover { color:#111; }
.vl-liste { display:flex; flex-direction:column; }
.vl-zeile { display:grid; grid-template-columns:auto minmax(0, 1fr) auto; gap:10px; align-items:center; padding:9px 0; border-bottom:1px solid #f2f2f2; font-size:14px; } .vl-zeile:last-child { border-bottom:none; }
.vl-zeile b { font-weight:600; display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .vl-zeile small { display:block; color:#8a8a8a; font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.vl-zeile em { font-style:normal; font-size:12.5px; color:#8a8a8a; white-space:nowrap; } .vl-zeile.klick { cursor:pointer; } .vl-zeile.klick:hover b { text-decoration:underline; }
.vl-akte { display:grid; grid-template-columns:minmax(0, 2fr) minmax(0, 1fr); gap:14px; flex:1; min-height:320px; align-items:stretch; }
.vl-links { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; align-content:start; overflow:auto; min-height:0; }
.vl-verlauf { display:flex; flex-direction:column; min-height:0; height:100%; }
.vl-ev-filter { display:inline-flex; align-items:center; gap:2px; margin:0 18px 10px; padding:3px; background:#e9e9e9; border-radius:9px; align-self:flex-start; }
.vl-ev-filter span { font-size:13px; font-weight:500; line-height:1.45; padding:4px 9px; border-radius:7px; color:#5e5e5e; white-space:nowrap; cursor:pointer; }
.vl-ev-filter span.an { background:#fff; color:#131313; box-shadow:0 1px 2px rgba(0,0,0,.14); }
.vl-ev-liste { flex:1; overflow:auto; min-height:0; padding:0 18px 8px; }
.vl-ev { display:grid; grid-template-columns:46px 22px minmax(0, 1fr); gap:8px; position:relative; padding-bottom:14px; }
.vl-ev::before { content:""; position:absolute; left:64px; top:22px; bottom:0; border-left:1px solid #ececec; } .vl-ev:last-child::before { display:none; } .vl-ev[hidden] { display:none; }
.vl-ev-tag { display:flex; flex-direction:column; align-items:flex-end; line-height:1.2; padding-top:2px; } .vl-ev-tag b { font-size:12.5px; font-weight:600; color:#111; } .vl-ev-tag small { font-size:11.5px; color:#9a9a9a; }
.vl-ev-ic { width:22px; height:22px; border-radius:50%; background:#f1f1f1; color:#555; display:inline-flex; align-items:center; justify-content:center; }
.vl-ev-ic.status, .vl-ev-ic.eingang { background:#e7f5ec; color:#1d6b38; } .vl-ev-ic.dokument { background:#e8eefc; color:#2d4a9a; } .vl-ev-ic.ausgabe { background:#f1f1f1; color:#333; } .vl-ev-ic.teilen { background:#fff4e0; color:#8a5a00; }
.vl-ev-inhalt { display:flex; flex-direction:column; gap:1px; font-size:13.5px; min-width:0; padding-top:2px; } .vl-ev-inhalt b { font-weight:600; } .vl-ev-inhalt span { color:#444; } .vl-ev-inhalt small { color:#9a9a9a; font-size:12px; }
.ak-verlauf .vl-ev[data-vb] { cursor:pointer; } .ak-verlauf .vl-ev[data-vb]:hover b { text-decoration:underline; } .ak-verlauf .unterschrift-mini { height:22px; margin:0 0 0 4px; }
.ak-spalte { display:flex; flex-direction:column; gap:14px; min-width:0; }
.ak-liste { padding:0 18px 12px; } .ak-liste .klein-text { margin:0; }
.ak-form { padding:4px 18px 16px; display:flex; flex-direction:column; gap:10px; }
.ak-schluessel > .vl-links { overflow:hidden; padding-bottom:0; grid-template-rows:minmax(0, 1fr); align-content:stretch; }
.ak-schluessel > .vl-links > .ak-spalte { align-self:stretch; overflow-y:auto; min-height:0; }
.ak-schluessel > .vl-links > .vl-block { min-height:0; overflow:hidden; } .ak-schluessel .vl-block > .ak-liste { flex:1; min-height:0; overflow-y:auto; }
/* Übergabe-Fenster wie Nodus */
.ue-form { gap:8px; } .ue-label { margin:8px 0 0; }
.ue-wahl { display:grid; grid-template-columns:repeat(auto-fit, minmax(120px, 1fr)); gap:8px; }
.ue-wahl button { display:flex; flex-direction:column; align-items:flex-start; gap:1px; text-align:left; padding:10px 12px; border:1px solid #e1e1e1; border-radius:12px; background:#fff; font-weight:600; font-size:14px; height:auto; white-space:normal; }
.ue-wahl button small { font-weight:400; font-size:12px; color:#8a8a8a; } .ue-wahl button.an { border-color:#111; box-shadow:0 0 0 1px #111 inset; }
.ue-schluessel { display:flex; flex-direction:column; gap:6px; } .ue-schluessel > .link { align-self:flex-start; padding:4px 2px; }
.ue-schluessel .schl-zeile b { width:auto; min-width:56px; } .ue-schluessel .schl-zeile .mini-bild { flex:none; }
.wie-viele { display:flex; align-items:center; flex-wrap:wrap; gap:6px; margin-top:6px; }
.wie-viele .chip { height:30px; padding:0 12px; border:1px solid var(--rahmen); border-radius:999px; background:#fff; font-size:13.5px; font-weight:600; }
.wie-viele .chip.an { border-color:var(--rot); background:#fdf2f2; color:var(--rot); }
.gewaehlt-person { display:flex; align-items:center; gap:8px; border:1px solid #111; border-radius:12px; padding:10px 14px; } .gewaehlt-person .link { margin-left:auto; }
.p-treffer { display:flex; flex-direction:column; } .p-treffer button { justify-content:flex-start; border:none; border-bottom:1px solid #f0f0f0; border-radius:0; background:#fff; height:auto; padding:9px 10px; text-align:left; }
.p-treffer button:hover { background:#f6f6f6; }
.ue-form > .link, .ue-form .such-feld-p + .link { align-self:flex-start; }
.ue-fuss { display:flex; align-items:center; gap:8px; } .ue-fuss .primaer { min-width:160px; }
.fenster.ue-unterschrift { width:900px; }
.ue-zwei-u { display:grid; grid-template-columns:1fr 1fr; gap:14px; } .ue-u-name { margin:0 0 6px; font-size:14px; }
@media (max-width:1100px) { .kx-kacheln { grid-template-columns:repeat(2, minmax(0, 1fr)); } .vl-akte, .vl-links { grid-template-columns:1fr; } main.ak-seite { overflow:auto; } .ak-schluessel > .vl-links { overflow:visible; } }
@media (max-width:760px) { .ue-zwei-u { grid-template-columns:1fr; } }

/* Mehr Luft zwischen den Boxen am Rechner (Dom 05.11.2026: „am Desktop viel zu nah aneinander“, am Handy passt es).
   Nur hier gesammelt, damit es leicht nachzustellen ist; das Handy (/app) hat eigenes CSS und bleibt unberührt. */
/* Laufendes Mietverhältnis (mietkonto.js): Karten in der Vermietung, Mahnstand, Kündigungsfrist, Auszug vorbereiten */
.mk-raster { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px; }
.mk-kachel { border:1px solid var(--linie); border-radius:12px; padding:12px 14px; background:#fff; min-width:0; }
.mk-kachel small { display:block; font-size:12.5px; color:var(--grau); } .mk-kachel b { display:block; font-size:19px; font-weight:700; margin:2px 0 1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mk-kachel span { display:block; font-size:12.5px; color:var(--grau); } .mk-kachel.warn b { color:var(--rot); }
.mk-mahn { display:flex; align-items:center; gap:12px; margin-top:10px; padding:12px 14px; border-radius:12px; background:#fdf1f0; }
.mk-mahn > div { flex:1; min-width:0; } .mk-mahn small { display:block; font-size:12.5px; color:var(--grau); } .mk-mahn b { display:block; font-size:14px; } .mk-mahn span { font-size:12.5px; color:var(--grau); }
.mk-karten { display:grid; gap:10px; margin-top:10px; }
.mk-karte { border:1px solid var(--linie); border-radius:12px; padding:10px 14px 4px; background:#fff; }
.mk-karte .daten:last-child { border-bottom:none; }
.mk-kopf { display:flex; align-items:center; gap:8px; } .mk-kopf h3 { flex:1; margin:0; font-size:14px; font-weight:600; } .mk-kopf .ik { width:30px; height:30px; }
.mk-auszug { display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:12px; background:#f6f6f6; }
.mk-auszug > div { flex:1; min-width:0; } .mk-auszug b { display:block; font-size:14px; } .mk-auszug span { font-size:12.5px; color:var(--grau); }
.mk-frist { border-radius:12px; background:#f6f6f6; padding:12px 14px; }
.mk-frist-kopf { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:4px; } .mk-frist-kopf small { font-size:13px; color:var(--grau); } .mk-frist-kopf b { font-size:18px; }
.mk-hinweise { margin:8px 0 0; padding-left:18px; font-size:12.5px; color:#555; line-height:1.45; } .mk-hinweise li { margin-bottom:4px; }
.mk-posten { display:grid; gap:0; } .mk-posten .mvt-summe { margin-top:8px; }
.mk-schritt { display:flex; align-items:center; gap:12px; width:100%; text-align:left; padding:12px 14px; height:auto; border:1px solid var(--linie); border-radius:12px; background:#fff; margin-bottom:8px; }
.mk-schritt > span { flex:1; } .mk-schritt b { display:block; font-size:14px; font-weight:600; } .mk-schritt small { font-size:12.5px; color:var(--grau); font-weight:400; }
.mk-schritt:hover { border-color:var(--schwarz); background:#fff; }
button.klein-knopf { height:30px; padding:0 12px; font-size:13px; }

/* Datei-Betrachter 1:1 aus Nodus (betrachter.js) */
dialog.dv { position:fixed; inset:0; width:100vw; height:100vh; max-width:none; max-height:none; margin:0; padding:0; border:none; border-radius:0; background:transparent; box-shadow:none; display:flex; flex-direction:column; overflow:hidden; }
dialog.dv:not([open]) { display:none; } dialog.dv::backdrop { background:rgba(0,0,0,.55); }
.dv-leiste { flex:none; height:56px; background:#141414; color:#fff; display:flex; align-items:center; justify-content:center; gap:14px; padding:0 14px; position:relative; }
.dv-name { font-weight:600; font-size:17px; max-width:min(60vw, 720px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dv-rechts { position:absolute; right:12px; top:0; bottom:0; display:flex; align-items:center; gap:4px; } .dv-links { position:absolute; left:12px; top:0; bottom:0; display:flex; align-items:center; }
.dv-knopf { background:none; border:none; color:#fff; width:38px; height:38px; border-radius:8px; display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0; } .dv-knopf:hover { background:#2a2a2a; } .dv-knopf:disabled { opacity:.3; cursor:default; background:none; } .dv-knopf svg { width:20px; height:20px; }
.dv-buehne { flex:1; min-height:0; display:flex; align-items:center; justify-content:center; overflow:hidden; position:relative; }
.dv-bild { max-width:calc(100vw - 200px); max-height:calc(100vh - 56px); object-fit:contain; transform-origin:center; user-select:none; box-shadow:0 6px 30px rgba(0,0,0,.35); }
.dv-pdf { width:100%; height:100%; overflow:auto; }
.dv-seiten { display:flex; flex-direction:column; align-items:center; gap:14px; padding:24px 24px 60px; width:max-content; min-width:100%; box-sizing:border-box; }
.dv-seiten canvas { background:#fff; box-shadow:0 4px 20px rgba(0,0,0,.35); border-radius:3px; }
.dv-lade { color:#eee; text-align:center; padding:40vh 20px 0; }
.dv-zoom { position:absolute; top:66px; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:2px; background:#3a3a3a; color:#fff; border-radius:6px; padding:3px; font-size:14px; font-weight:600; z-index:2; }
.dv-zoom span { min-width:64px; text-align:center; padding:4px 12px; cursor:pointer; border-radius:4px; } .dv-zoom span:hover { background:rgba(255,255,255,.16); }
.dv-keine { background:#fff; border-radius:10px; padding:30px 40px; display:flex; flex-direction:column; align-items:center; gap:14px; color:#444; }
.dv-druck { position:fixed; right:0; bottom:0; width:1px; height:1px; border:0; opacity:0; }
.dv-video { max-width:calc(100vw - 200px); max-height:calc(100vh - 140px); border-radius:8px; background:#000; } .dv-audio { width:min(480px, 90%); }
.dv { touch-action:manipulation; } .dv .dv-knopf, .dv .dv-pfeil, .dv .dv-zoom { touch-action:manipulation; -webkit-user-select:none; user-select:none; }
.dv-pfeil { position:absolute; top:calc(50% + 28px); transform:translateY(-50%); z-index:6; width:48px; height:48px; border-radius:50%; border:none; background:rgba(20,20,20,.62); color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0; }
.dv-pfeil:hover { background:rgba(20,20,20,.85); } .dv-pfeil:disabled { opacity:0; pointer-events:none; } .dv-pfeil.links { left:14px; } .dv-pfeil.rechts { right:14px; }
.pdf-seite { position:relative; margin:0 auto; flex:none; } .pdf-seite canvas { display:block; }
.textLayer { position:absolute; inset:0; overflow:hidden; line-height:1; text-size-adjust:none; forced-color-adjust:none; transform-origin:0 0; z-index:2; }
.textLayer span, .textLayer br { color:transparent; position:absolute; white-space:pre; cursor:text; transform-origin:0% 0%; }
.textLayer ::selection { background:rgba(0, 90, 255, .25); color:transparent; }
.textLayer > :not(.endOfContent) { z-index:1; }
.textLayer .endOfContent { display:block; position:absolute; inset:100% 0 0; z-index:0; cursor:default; user-select:none; } .textLayer.selecting .endOfContent { top:0; }
@media (max-width:760px) { .dv-bild, .dv-video { max-width:100vw; } .dv-pfeil { display:none; } .dv-name { max-width:50vw; font-size:15px; } }

/* Ablage 1:1 aus Nodus (ablage.js): Pfadleiste, Haken, Auswahlleiste, Ziehen, Hochladen-Stand */
.ab-kopf { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:6px; } .ab-kopf .ab-pfad { flex:1; min-width:0; }
.ab-aktionen { display:flex; align-items:center; gap:8px; } .ab-segment { display:inline-flex; } .ab-segment button { width:38px; padding:0; justify-content:center; }
.ab-flaeche { background:#fff; border:1px solid var(--linie); border-radius:6px; flex:1; min-height:320px; overflow:auto; padding:4px 10px 10px; position:relative; }
.pa-knopf { display:inline-flex; align-items:center; justify-content:center; gap:7px; height:38px; min-width:38px; padding:0 10px; background:#fff; border:1px solid #d9d9d9; border-radius:8px; color:#222; cursor:pointer; font:inherit; font-size:14.5px; font-weight:500; text-decoration:none; }
.pa-knopf:hover { background:#f6f6f6; } .pa-knopf svg { width:17px; height:17px; }
.pa-liste { display:flex; flex-direction:column; }
.pa-zeile { display:flex; align-items:center; gap:16px; padding:12px 10px; border-bottom:1px solid #f0f0f0; color:inherit; text-decoration:none; min-height:62px; box-sizing:border-box; }
.pa-zeile:hover { background:#f5f5f5; } .pa-zeile.klick { cursor:pointer; } .pa-zeile.aus { opacity:.45; cursor:default; }
.pa-ic { width:30px; flex:none; display:flex; align-items:center; justify-content:center; color:#111; } .pa-ic svg { width:22px; height:22px; } .pa-ic img { width:34px; height:34px; object-fit:cover; border-radius:5px; }
.pa-zeile-text { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; } .pa-zeile-text b { font-weight:600; font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .pa-zeile-text span { font-size:13px; color:#666; }
.ab-haken { display:none; } .ab-zeile:hover .ab-haken, .ab-zeile.gewaehlt .ab-haken, .mit-wahl .ab-haken { display:block; }
.pa-liste .ab-zeile:hover .ab-symbol, .pa-liste .ab-zeile.gewaehlt .ab-symbol, .pa-liste.mit-wahl .ab-symbol { display:none; }
.ab-symbol { display:flex; align-items:center; justify-content:center; }
.ab-zeile.gewaehlt { background:#f3f3f3; } .ab-zeile.zieht { opacity:.45; }
.ab-zeile.ziel-an, .ab-ziel.ziel-an { background:#fde8e8; box-shadow:inset 0 0 0 2px var(--rot); border-radius:6px; }
.ab-leiste { display:flex; align-items:center; gap:14px; padding:10px 12px; border-bottom:1px solid #f0f0f0; position:sticky; top:0; background:#fff; z-index:2; }
.ab-alle { display:flex; align-items:center; gap:10px; font-size:14.5px; cursor:pointer; }
.ab-trenner { width:1px; height:22px; background:#ddd; } .ab-zahl { font-size:13px; font-weight:600; color:#222; }
.ab-icon { background:none; border:none; padding:6px; border-radius:6px; color:#222; cursor:pointer; display:flex; height:auto; } .ab-icon:hover { background:#f0f0f0; } .ab-icon svg { width:19px; height:19px; }
button.ab-icon.gefahr { color:var(--rot); background:none; border:none; } button.ab-icon.gefahr:hover { background:#fdeaea; }
.ab-pfad { display:flex; align-items:center; gap:10px; padding:6px 0; min-height:46px; }
.ab-hoch-ebene { width:34px !important; min-width:34px; height:34px !important; padding:0; }
.ab-krumen { display:flex; align-items:center; gap:4px; min-width:0; overflow-x:auto; scrollbar-width:none; } .ab-krumen > svg { width:14px; height:14px; color:#999; flex:none; }
.ab-krume { display:inline-flex; align-items:center; gap:7px; padding:6px 10px; height:34px; box-sizing:border-box; border-radius:8px; border:1px dashed transparent; background:none; font:inherit; font-size:15px; color:#555; cursor:pointer; white-space:nowrap; max-width:240px; }
.ab-krume span { overflow:hidden; text-overflow:ellipsis; } .ab-krume svg { width:17px; height:17px; flex:none; color:#c62828; fill:#fde8e8; }
button.ab-krume:hover { background:#f2f2f2; color:#111; } .ab-krume.jetzt { color:#111; font-weight:600; cursor:default; padding-left:0; }
.ab-pfad.ziehen .ab-ziel { border-color:#c9c9c9; } .ab-krume.ziel-an, .ab-hoch-ebene.ziel-an { background:#fde8e8; border:1px solid var(--rot); color:var(--rot); }
.ab-zeile[data-ordner] .ab-symbol svg, .ab-kachel[data-ordner] .ab-bild svg { color:#c62828; fill:#fde8e8; }
.ab-leerfeld { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; width:100%; min-height:300px; height:100%; border:1.5px dashed #d6d6d6; border-radius:8px; background:none; color:#aaa; font:inherit; font-size:15px; cursor:pointer; margin-top:8px; }
.ab-leerfeld:hover { border-color:#999; color:#777; background:none; } .ab-leerfeld svg { width:22px; height:22px; }
.ab-stapel { position:fixed; top:-200px; left:-200px; padding:8px 12px; background:#fff; border:1px solid #d8d8d8; border-radius:8px; font-weight:600; font-size:13px; color:#222; box-shadow:3px 3px 0 #fff, 4px 4px 0 #d8d8d8, 7px 7px 0 #fff, 8px 8px 0 #d8d8d8; }
.ab-haken, .ab-alle input { -webkit-appearance:none; appearance:none; width:18px; height:18px; min-width:18px; box-sizing:border-box; margin:0; border:1.5px solid #c9c9c9; border-radius:50%; background:#fff; cursor:pointer; flex:none; }
.ab-haken:checked, .ab-alle input:checked, .ab-alle input:indeterminate { background:var(--rot) no-repeat center/12px; border-color:var(--rot); }
.ab-haken:checked, .ab-alle input:checked { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E"); }
.ab-alle input:indeterminate { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round'%3E%3Cpath d='M6 12h12'/%3E%3C/svg%3E"); }
.ab-drueber::after { content:'Zum Hochladen loslassen'; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(255,244,244,.85); outline:2px dashed var(--rot); outline-offset:-6px; border-radius:10px; color:var(--rot); font-weight:600; font-size:15px; z-index:6; pointer-events:none; }
.ab-kacheln { display:grid; grid-template-columns:repeat(auto-fill, minmax(160px, 1fr)); gap:12px; padding-top:10px; }
.ab-kacheln.leer { display:block; }
.ab-kachel { position:relative; display:flex; flex-direction:column; gap:3px; padding:8px; border:1px solid #e6e6e6; border-radius:4px; cursor:pointer; min-width:0; }
.ab-kachel:hover { background:#f7f7f7; } .ab-kachel b { font-size:13.5px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .ab-kachel > span { font-size:12px; color:#777; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ab-bild svg { width:40px; height:40px; } .ab-bild { aspect-ratio:4/3; border-radius:2px; background:#f4f4f4; display:flex; align-items:center; justify-content:center; overflow:hidden; color:#666; } .ab-bild img { width:100%; height:100%; object-fit:cover; }
.ab-kachel .ab-haken { position:absolute; top:12px; left:12px; z-index:2; } .ab-kachel .ik { position:absolute; top:10px; right:10px; z-index:2; background:rgba(255,255,255,.9); opacity:0; } .ab-kachel:hover .ik { opacity:1; }
.ow-liste { max-height:60vh; overflow:auto; }
.hoch-stand { position:fixed; left:calc(var(--nav, 240px) + 20px); bottom:20px; z-index:60; width:320px; background:#fff; border:1px solid #e3e3e3; border-radius:12px; box-shadow:0 6px 24px rgba(0,0,0,.12); padding:12px 14px; font-size:13.5px; }
.hoch-stand .hs-kopf { display:flex; align-items:center; gap:8px; margin-bottom:8px; } .hoch-stand .hs-kopf b { flex:1; } .hoch-stand .hs-zu { margin-left:auto; border:none; background:none; color:#666; cursor:pointer; height:auto; padding:2px; }
.hoch-stand > i { display:block; height:6px; border-radius:3px; background:#f0f0f0; overflow:hidden; } .hoch-stand > i > b { display:block; height:100%; background:var(--rot); transition:width .2s; }
.hoch-stand .hs-fehler { margin-top:10px; color:#a11; } .hoch-stand .hs-fehler ul { margin:4px 0 8px; padding-left:16px; color:#444; max-height:120px; overflow:auto; }

.ab-pdfv { display:flex; align-items:center; justify-content:center; width:34px; height:34px; } .pa-ic .ab-pdfbild { width:30px; height:38px; object-fit:cover; object-position:top; border-radius:2px; border:1px solid #e3e3e3; background:#fff; }
.ab-bild .ab-pdfv { width:100%; height:100%; } .ab-bild .ab-pdfbild { width:100%; height:100%; object-fit:cover; object-position:top; }
.ab-titel { font-size:15px; font-weight:600; margin:18px 0 10px; }
/* Mietverhältnis als große Seite */
.mv-seite-rahmen { max-width:1280px; }
.mv-kopf { align-items:center; gap:14px; } .mv-titel { flex:1; min-width:0; } .mv-titel h1 { margin:0; } .mv-titel .klein-text { font-size:14px; margin-top:3px; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.mv-seite { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; align-items:start; }
.mv-seite > div { background:#fff; border:1px solid var(--linie); border-radius:10px; padding:18px 20px; min-width:0; }
.mv-seite > div:empty { display:none; }
.mv-seite > [data-auszug-block], .mv-seite > [data-konto-block] { grid-column:1 / -1; background:none; border:none; padding:0; }
.mv-seite h3 { font-size:16px; font-weight:600; margin:0 0 10px; } .mv-seite .daten { font-size:15px; padding:10px 0; }
.mv-seite [data-konto-block] .mk-raster { grid-template-columns:repeat(4, minmax(0,1fr)); gap:14px; } .mv-seite .mk-kachel { padding:16px 18px; } .mv-seite .mk-kachel b { font-size:24px; }
.mv-seite [data-konto-block] .mk-karten { grid-template-columns:repeat(3, minmax(0,1fr)); gap:14px; align-items:start; } .mv-seite .mk-karte { padding:14px 18px 6px; }
.mv-seite .mk-mahn { margin-top:14px; }
@media (max-width:1100px) { .mv-seite, .mv-seite [data-konto-block] .mk-karten { grid-template-columns:1fr; } .mv-seite [data-konto-block] .mk-raster { grid-template-columns:1fr 1fr; } }

button.primaer.rot-knopf:disabled { opacity:.45; cursor:default; }
/* Zentrale und Feedback (zentrale.js) */
.fuss-knopf { position:relative; } .zentrale-knopf b { position:absolute; top:2px; right:0; min-width:16px; height:16px; padding:0 4px; border-radius:8px; background:var(--rot); color:#fff; font-size:10.5px; line-height:16px; text-align:center; font-weight:700; }
.einst-box.einst-breit { max-width:none; }
.kopfzeile-klein { display:flex; align-items:center; gap:8px; margin:-4px 0 14px; flex-wrap:wrap; }
.chip { height:32px; padding:0 12px; border-radius:16px; border:1px solid var(--linie); background:#fff; font-size:13.5px; } .chip.an { border-color:#111; background:#111; color:#fff; }
.fb-art { display:inline-flex; align-items:center; gap:4px; font-size:12px; font-weight:600; padding:2px 8px; border-radius:4px; background:#f1f1f1; color:#444; }
.fb-art.fehler { background:#fdecec; color:#b42318; } .fb-art.idee { background:#fff6e0; color:#8a5a00; } .fb-art.frage { background:#e9f0fb; color:#2b4c80; }
.fb-zeile { display:flex; align-items:center; gap:8px; margin-bottom:6px; } .fb-antwort { margin-top:10px; padding:10px 12px; background:#f6f6f6; border-radius:8px; font-size:14px; }
.fb-meine b { font-size:15px; }
.zb-board { display:grid; grid-template-columns:repeat(6, minmax(150px, 1fr)); gap:12px; overflow-x:auto; align-items:start; padding-bottom:8px; } .zb-board.rm { grid-template-columns:repeat(4, minmax(170px, 1fr)); }
.zb-spalte { background:#f3f3f3; border-radius:10px; padding:10px; min-height:200px; } .zb-spalte.ziel-an { box-shadow:inset 0 0 0 2px var(--rot); background:#fdf3f3; }
.zb-spalte h3 { font-size:13.5px; font-weight:600; margin:2px 4px 10px; display:flex; gap:6px; } .zb-spalte h3 span { color:var(--grau); font-weight:500; }
.zb-karte { background:#fff; border:1px solid #e6e6e6; border-radius:8px; padding:10px 12px; margin-bottom:8px; cursor:pointer; } .zb-karte:hover { border-color:#bbb; } .zb-karte.zieht { opacity:.4; }
.zb-karte b { display:block; font-size:14px; line-height:1.3; } .zb-text { font-size:12.5px; color:#666; margin-top:4px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.zb-karte img { width:100%; height:90px; object-fit:cover; border-radius:6px; margin-top:8px; } .zb-fuss { font-size:12px; color:#888; margin-top:6px; } .zb-ic { color:#888; }
.fbm-arten { display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; } .fbm-arten button { display:flex; flex-direction:column; align-items:flex-start; gap:4px; height:auto; padding:12px; border:1.5px solid var(--linie); border-radius:12px; background:#fff; text-align:left; }
.fbm-arten button b { font-size:14.5px; } .fbm-arten button span { font-size:12.5px; color:var(--grau); font-weight:400; } .fbm-arten button.an { border-color:var(--rot); background:#fffafa; } .fbm-arten button.an svg { color:var(--rot); }
.fbm-ablage { display:flex; align-items:center; gap:10px; padding:14px; color:var(--grau); font-size:13.5px; cursor:pointer; }
.fbm-fotos { display:flex; flex-wrap:wrap; gap:8px; } .fbm-fotos span { position:relative; } .fbm-fotos img { width:84px; height:64px; object-fit:cover; border-radius:6px; border:1px solid #e6e6e6; display:block; }
.fbm-fotos button { position:absolute; top:-6px; right:-6px; width:20px; height:20px; padding:0; border-radius:50%; background:#111; color:#fff; border:none; display:grid; place-items:center; }
.ae-tag { font-size:12.5px; font-weight:600; color:var(--grau); text-transform:uppercase; letter-spacing:.5px; margin:14px 0 6px; } .ae-tag:first-child { margin-top:0; }
.ae-zeile { display:flex; align-items:flex-start; gap:10px; padding:8px 0; border-bottom:1px solid var(--linie-t); } .ae-zeile > div { flex:1; min-width:0; } .ae-zeile b { font-size:14.5px; }


/* Briefbogen (Einstellungen → Unternehmen → Briefbogen, wie Nodus „Briefpapier“): links Karten, rechts Vorschau */
.bb-grid { display:grid; grid-template-columns:minmax(0, 1fr) minmax(300px, 440px); gap:16px; align-items:start; }
.bb-rechts { background:#fff; border-radius:10px; padding:12px; position:sticky; top:0; max-height:calc(100vh - 120px); overflow-y:auto; }
.bb-vk { text-align:center; font-size:14px; margin-bottom:8px; }
.bb-vorschau { display:flex; justify-content:center; }
.bb-seiten { display:flex; flex-direction:column; align-items:center; gap:6px; }
.bb-seiten canvas { box-shadow:0 2px 10px rgba(0,0,0,.12); }
.bb-seite-nr { font-size:12px; color:#777; margin-top:8px; }
.bb-inhalt { margin-left:30px; }
.bb-seg { max-width:460px; }
.bb-warn { background:#fdf3d8; color:#9a6b00; border-radius:12px; padding:3px 12px; font-size:13px; font-weight:500; }
.bb-info { display:flex; gap:10px; align-items:flex-start; background:var(--hell); border-radius:10px; padding:10px 12px; margin-top:12px; font-size:13.5px; color:#555; } .bb-info svg { flex:none; margin-top:1px; }
.bb-hg-reihe { display:flex; gap:14px; align-items:flex-start; flex-wrap:wrap; }
.bb-hg { display:flex; flex-direction:column; align-items:center; gap:6px; font-size:13px; color:#555; }
.bb-hg-bild { position:relative; width:150px; height:212px; border:1px solid #e3e3e3; border-radius:6px; overflow:hidden; background:#fafafa; display:flex; align-items:center; justify-content:center; }
.bb-hg-bild img, .bb-hg-bild canvas { width:100%; height:100%; object-fit:cover; }
.bb-hg-bild .ik { position:absolute; top:6px; right:6px; background:#fff; border-color:#e3e3e3; }
.bb-hg-bild label { display:flex; flex-direction:column; align-items:center; gap:6px; cursor:pointer; color:#555; border:1.5px dashed #ccc; inset:8px; position:absolute; justify-content:center; border-radius:6px; }
.bb-logo { display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.bb-logo-kachel { min-width:160px; min-height:60px; max-width:240px; padding:8px 12px; border:1px solid var(--linie); border-radius:8px; display:flex; align-items:center; justify-content:center; background:#fff; }
.bb-logo-kachel img { max-width:100%; max-height:70px; }
.bb-knoepfe { display:flex; gap:8px; align-items:center; flex-wrap:wrap; } .bb-knoepfe label.btn { display:inline-flex; align-items:center; cursor:pointer; }
.bb-knoepfe.spalte { flex-direction:column; align-items:flex-start; gap:10px; }
.bb-knoepfe button svg, #bb-abstand svg { vertical-align:-3px; margin-right:4px; }
.bb-schalter { display:flex; align-items:center; gap:10px; cursor:pointer; color:#111; font-size:14px; font-weight:500; }
.bb-schalter input { display:none; }
.bb-schalter span { width:22px; height:22px; border:1.5px solid #c8c8c8; border-radius:7px; background:#fff; position:relative; flex:none; display:grid; place-items:center; transition:background .12s, border-color .12s; }
.bb-schalter input:checked + span { background:var(--rot); border-color:var(--rot); } .bb-schalter input:checked + span::after { content:''; width:6px; height:11px; border:solid #fff; border-width:0 2.2px 2.2px 0; transform:translateY(-1px) rotate(45deg); }
.bb-ap-felder-raster { display:grid; grid-template-columns:1fr 1fr; gap:12px; } .bb-ap-felder-raster .breit { grid-column:1 / -1; }
.bb-ap-schalter { display:flex; flex-direction:column; gap:10px; } .bb-ap-felder { display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
@media (max-width:1100px) { .bb-grid { grid-template-columns:1fr; } .bb-rechts { position:static; max-height:none; } }
/* Nebenkostenabrechnung (public/nebenkosten.js) – Aufbau wie Nahaus (Dom 10.11.2026) */
.nk-rahmen { display:grid; grid-template-columns:220px minmax(0,1fr); gap:0; margin:-8px 0 0; min-height:calc(100vh - 40px); }
.nk-seite { border-right:1px solid var(--linie); padding:10px 14px 20px 0; display:flex; flex-direction:column; gap:2px; position:sticky; top:0; align-self:start; }
.nk-fest { display:flex; align-items:center; gap:10px; padding:10px 8px; font-size:14px; color:#444; } .nk-fest svg { flex:none; color:#777; }
.nk-trenner { height:1px; background:var(--linie); margin:6px 0 10px; }
.nk-schritt { display:flex; justify-content:flex-start; align-items:center; gap:10px; width:100%; height:auto; min-height:42px; padding:8px; border:none; border-radius:10px; background:none; text-align:left; font-size:14px; font-weight:500; color:#333; cursor:pointer; }
.nk-schritt:hover { background:#f5f5f3; } .nk-schritt.an { background:#ececea; color:#111; font-weight:600; }
.nk-st { flex:none; width:22px; height:22px; display:grid; place-items:center; border-radius:50%; }
.nk-st.ok { color:#111; } .nk-st.fehler { color:var(--rot); } .nk-st.nr { background:#ececea; color:#666; font-size:12px; font-weight:600; }
.nk-haupt { padding:4px 0 40px 22px; min-width:0; }
.nk-pfad { display:flex; align-items:center; gap:8px; font-size:14px; color:#666; flex-wrap:wrap; } .nk-pfad a { color:#666; } .nk-pfad b { color:#111; font-weight:500; } .nk-pfad svg { color:#aaa; }
.nk-titelzeile { display:flex; align-items:center; gap:12px; margin:10px 0 18px; } .nk-titelzeile h1 { margin:0; font-size:30px; font-weight:500; letter-spacing:-.01em; }
.nk-titelzeile .rechts { margin-left:auto; display:flex; align-items:center; gap:8px; }
.nk-knopf { display:inline-flex; align-items:center; gap:6px; height:40px; padding:0 14px; border-radius:10px; font-size:14px; font-weight:500; cursor:pointer; color:#111; text-decoration:none; }
.nk-knopf.grau { background:#f1f1ee; border:1px solid #f1f1ee; } .nk-knopf.rand { background:#fff; border:1px solid var(--linie); } .nk-knopf:disabled { opacity:.45; cursor:default; }
.nk-satz { font-size:22px; font-weight:500; margin:6px 0 8px; letter-spacing:-.01em; } .nk-text { color:#444; font-size:14.5px; margin:0 0 16px; }
.nk-box { display:flex; gap:12px; align-items:flex-start; padding:14px 16px; border-radius:12px; font-size:14px; margin-bottom:12px; line-height:1.45; }
.nk-box svg { flex:none; margin-top:1px; } .nk-box a { text-decoration:underline; color:inherit; }
.nk-box.warn { background:#fdeceb; color:#a3201a; } .nk-box.heiz { background:#fff3e6; color:#7a4300; } .nk-box.info { background:#fff; border:1px solid var(--linie); color:#3a3a38; }
.nk-block { background:#fff; border:1px solid var(--linie); border-radius:12px; margin:0 0 16px; overflow-x:auto; }
.nk-block-kopf { display:flex; align-items:center; padding:14px 16px 10px; font-weight:600; font-size:14.5px; } .nk-block-kopf .nk-link { margin-left:auto; font-weight:500; font-size:13.5px; text-decoration:underline; color:#444; }
.nk-tab { width:100%; border-collapse:collapse; font-size:14px; background:transparent; }
.nk-tab th { text-align:left; font-weight:600; color:#111; padding:12px 14px; border-bottom:1px solid var(--linie); vertical-align:bottom; } .nk-tab th div { color:#888; font-weight:400; font-size:12.5px; }
.nk-tab td { padding:12px 14px; border-bottom:1px solid var(--linie-t); vertical-align:middle; } .nk-tab tr:last-child td { border-bottom:none; }
.nk-tab .zahl { text-align:right; white-space:nowrap; } .nk-tab td small { display:block; color:#888; font-size:12px; }
.nk-tab.innen { background:#fff; border-radius:10px; } .nk-tab.innen td, .nk-tab.innen th { padding:7px 10px; }
.nk-einheit { display:flex; align-items:center; gap:10px; min-width:150px; } .nk-einheit b { white-space:nowrap; } .nk-einheit svg { flex:none; color:#8a8a86; } .nk-einheit b { display:block; font-weight:500; } .nk-einheit small { display:block; color:#777; font-size:12.5px; }
.nk-ein { display:inline-flex; align-items:center; width:100%; height:40px; border:1px solid var(--rahmen); border-radius:8px; background:#fff; padding:0 10px; gap:6px; }
.nk-ein input { flex:1; min-width:0; border:none; outline:none; background:transparent; font:inherit; font-size:14px; text-align:right; color:#111; }
.nk-ein b { flex:none; font-weight:400; color:#888; font-size:13.5px; } .nk-ein:focus-within { border-color:#111; } .nk-ein:has(input:disabled) { background:#f3f3f1; }
.nk-erkl { color:#777; font-size:13px; margin:-4px 0 14px; line-height:1.45; }
.nk-schalter-block { background:#fff; border:1px solid var(--linie); border-radius:12px; padding:12px 16px; margin-bottom:8px; }
.nk-schalter-zeile { display:flex; align-items:center; gap:12px; font-size:14.5px; cursor:pointer; margin:6px 0 10px; } .nk-schalter-block .nk-schalter-zeile { margin:0; }
/* An/Aus überall als der normale rote Haken (Dom 13.11.2026: „Regler normal anzeigen“) */
input.nk-schalter, input.schalter { appearance:none; -webkit-appearance:none; flex:none; width:22px; height:22px; margin:0; border:1.5px solid #c8c8c8; border-radius:7px; background:#fff; display:inline-grid; place-items:center; cursor:pointer; transition:background .12s, border-color .12s; vertical-align:middle; }
input.nk-schalter:checked, input.schalter:checked { background:var(--rot); border-color:var(--rot); }
input.nk-schalter:checked::after, input.schalter:checked::after { content:""; width:6px; height:11px; border:solid #fff; border-width:0 2.2px 2.2px 0; transform:translateY(-1px) rotate(45deg); }
input.nk-schalter:disabled, input.schalter:disabled { opacity:.5; cursor:default; }
.nk-absender { display:flex; flex-direction:column; gap:3px; padding:0 16px 16px; font-size:14px; } .nk-absender b { font-weight:600; }
.nk-brief { display:flex; align-items:center; gap:16px; padding:16px; } .nk-brief > div:first-child { display:flex; flex-direction:column; gap:3px; } .nk-brief .rechts { margin-left:auto; display:flex; gap:8px; }
/* Kosten-Tabelle */
.nk-kt { --spalten: minmax(140px,1.4fr) minmax(90px,1fr) 138px 112px minmax(130px,1fr) 236px; }
.nk-kt-kopf, .nk-kt-zeile { display:grid; grid-template-columns:var(--spalten); gap:8px; align-items:center; }
.nk-kt-kopf { padding:0 0 8px; font-size:13.5px; color:#555; font-weight:500; } .nk-kt-kopf .zahl { text-align:right; }
.nk-kt-zeile { padding:5px 0; }
.nk-feld { height:40px; border:1px solid var(--rahmen); border-radius:8px; background:#fff; padding:0 10px; font:inherit; font-size:14px; color:#111; width:100%; min-width:0; outline:none; }
.nk-feld.zahl { text-align:right; font-weight:600; } .nk-feld:focus { border-color:#111; background:#fff; } .nk-feld:disabled { color:#666; }
.nk-akt { display:flex; gap:4px; }
.nk-ak { position:relative; flex:none; width:36px; height:40px; padding:0; display:grid; place-items:center; border:1px solid var(--rahmen); border-radius:8px; background:#fff; color:#333; cursor:pointer; }
.nk-ak:hover { background:#f4f4f2; } .nk-ak:disabled { color:#c9c9c4; cursor:default; background:#fafaf8; }
.nk-ak.an { background:#111; border-color:#111; color:#fff; } .nk-ak.an:hover { background:#333; } .nk-ak.warn { background:#fff3e2; border-color:#f3c98b; color:#b26a00; }
.nk-ak.rot { color:var(--rot); background:#fdf0ef; border-color:#fdf0ef; } .nk-ak.still { border:none; background:none; color:#555; width:30px; height:30px; } .nk-ak.still.offen svg { transform:rotate(90deg); }
.nk-ak i { position:absolute; top:-6px; right:-6px; min-width:17px; height:17px; border-radius:9px; background:var(--rot); color:#fff; font-size:11px; font-style:normal; font-weight:600; display:grid; place-items:center; padding:0 4px; }
.nk-zeile-hinweis { display:flex; align-items:center; gap:10px; margin:2px 0 8px; padding:11px 14px; border-radius:10px; background:#fdeceb; color:#a3201a; font-size:14px; }
.nk-neu { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; height:44px; margin-top:10px; border:1px dashed #cfcfca; border-radius:10px; background:#fff; color:#333; font-size:14px; cursor:pointer; }
.nk-neu:hover { background:#f8f8f6; }
.nk-neu-zeile { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.nk-kt-summe { display:flex; justify-content:flex-end; gap:24px; padding:14px 4px 0; font-size:15px; }
.lw-knopf.tabelle:disabled { cursor:default; color:#666; }
/* Aufteilung */
.nk-af-karten { display:grid; grid-template-columns:1fr 1.3fr 1fr; gap:10px; }
.nk-af-karte { display:flex; align-items:center; gap:12px; padding:12px 14px; border:1px solid var(--linie); border-radius:12px; background:#fff; min-width:0; }
.nk-af-karte.wahl { background:#fafaf8; } .nk-af-karte svg { flex:none; color:#8a8a86; } .nk-af-karte small { display:block; color:#888; font-size:12px; } .nk-af-karte b { font-weight:600; font-size:15px; }
.nk-af-teil { display:flex; align-items:center; gap:8px; padding:5px 0; }
.fenster.breit { width:min(980px, calc(100vw - 32px)); }
/* Verbraucherfassung */
.nk-vf { display:grid; grid-template-columns:250px minmax(0,1fr); gap:0; margin:-6px -4px; min-height:380px; }
.nk-vf-links { border-right:1px solid var(--linie); padding-right:12px; display:flex; flex-direction:column; gap:6px; }
.nk-vf-e { display:flex; justify-content:flex-start; align-items:center; gap:10px; width:100%; height:auto; padding:9px 10px; border:none; border-radius:10px; background:none; text-align:left; cursor:pointer; color:#111; }
.nk-vf-e:hover { background:#f5f5f3; } .nk-vf-e.an { background:#f1f1ee; } .nk-vf-e b { display:block; font-weight:500; font-size:14px; } .nk-vf-e small { display:block; color:#777; font-size:12px; }
.nk-vf-rechts { padding-left:18px; display:flex; flex-direction:column; gap:10px; }
.nk-vf-kopf { display:flex; align-items:center; } .nk-vf-kopf b { display:block; font-size:15.5px; font-weight:600; } .nk-vf-kopf small { color:#777; font-size:12.5px; } .nk-vf-kopf .rechts { margin-left:auto; display:flex; gap:8px; }
.nk-vf-typ small { display:block; color:#777; font-size:12.5px; margin-bottom:4px; }
.nk-vf-pos { border:1px solid var(--linie); border-radius:12px; padding:12px 14px; display:flex; flex-direction:column; gap:10px; }
.nk-vf-pos-kopf { display:flex; align-items:center; gap:8px; } .nk-vf-pos-kopf svg { color:#8a8a86; }
.nk-vf-zeile { display:flex; gap:8px; align-items:flex-end; } .nk-vf-l { flex:1; min-width:0; } .nk-vf-l small { display:block; color:#777; font-size:12px; margin-bottom:3px; }
.nk-vf-mieter { display:flex; align-items:center; gap:8px; font-size:14px; color:#555; }
.nk-vf-neu { display:flex; align-items:center; justify-content:center; gap:6px; height:44px; border:1px dashed #cfcfca; border-radius:10px; background:#fff; color:#444; cursor:pointer; font-size:14px; }
.nk-vf-fuss { display:flex; gap:10px; } .nk-vf-summe { border:1px solid var(--linie); border-radius:10px; padding:6px 12px; min-width:180px; } .nk-vf-summe small { display:block; color:#777; font-size:12px; }
.nk-vf-fenster .f-fuss { display:flex; align-items:center; }
/* Lohnkosten, Belege */
.nk-lohn { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 0; border-bottom:1px solid var(--linie); font-size:15px; }
.nk-beleg { display:flex; align-items:center; gap:8px; padding:4px 0; }
.nk-beleg-n { flex:1; display:flex; justify-content:flex-start; align-items:center; gap:10px; height:44px; padding:0 12px; border:1px solid var(--linie); border-radius:10px; background:#fff; text-align:left; cursor:pointer; min-width:0; }
.nk-beleg-n span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nk-ablage { display:flex; flex-direction:column; align-items:center; gap:4px; width:100%; height:auto; padding:18px; margin:10px 0; border:1.5px dashed #cfcfca; border-radius:12px; background:#fafaf8; cursor:pointer; color:#333; }
.nk-ablage small { color:#888; } .nk-ablage.drueber { border-color:#111; background:#f1f1ee; }
/* Vorschau */
.nk-vt td { vertical-align:middle; } .nk-vt .nk-vt-a td { border-bottom:none; padding-bottom:4px; } .nk-vt .nk-vt-b td { padding-top:4px; }
.nk-vt td small { display:block; color:#888; font-size:11.5px; }
.nk-vs { display:flex; align-items:center; gap:6px; } .nk-vt-akt { display:flex; gap:6px; justify-content:flex-end; } .nk-datum { display:flex; align-items:center; gap:6px; padding:0 8px 0 10px; cursor:text; } .nk-datum input { flex:1; min-width:0; border:none; outline:none; background:transparent; font:inherit; font-size:14px; color:#111; } .nk-datum svg { flex:none; color:var(--grau); }
.nk-datum:focus-within { border-color:#111; } .nk-datum.fehler { border-color:var(--rot); }
.nk-vt-ueb { text-align:center; } .nk-vt .nk-einheit { min-width:120px; } .nk-vt td:last-child { padding-right:14px; white-space:nowrap; }
.nk-vt-saldo { font-size:12.5px; font-weight:600; margin-top:4px; white-space:nowrap; } .nk-vt td, .nk-vt th { padding-left:7px; padding-right:7px; font-size:13.5px; } .nk-vt .nk-ak { width:34px; height:36px; } .nk-vt .nk-ein { height:36px; }
.nk-vt-det > td { background:#fff; }

/* Zähler (public/zaehler.js) */
.z-icon { flex:none; width:34px; height:34px; border-radius:50%; display:inline-grid; place-items:center; }
.z-name { display:flex; align-items:center; gap:10px; } .z-name b { font-weight:500; }
tr.z-alt td { color:#888; } tr.z-alt .z-icon { filter:grayscale(1); opacity:.6; }
.z-arten { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:6px; margin-top:6px; }
.z-arten button { display:flex; align-items:center; gap:8px; height:auto; min-height:46px; padding:6px 10px; border:1px solid var(--linie); border-radius:12px; background:#fff; text-align:left; font-size:13px; cursor:pointer; color:inherit; }
.z-arten button .z-icon { width:30px; height:30px; } .z-arten button.an { border-color:var(--rot); box-shadow:0 0 0 1px var(--rot) inset; }
.z-foto { display:flex; align-items:center; gap:12px; border:1px solid var(--linie); border-radius:12px; padding:8px 12px; cursor:pointer; background:#fff; margin:6px 0 10px; }
.z-foto > span, .z-foto > img { flex:none; width:48px; height:48px; border-radius:10px; display:grid; place-items:center; background:#f4f4f4; color:#777; object-fit:cover; }
.z-foto b { display:block; font-weight:500; font-size:14px; } .z-foto small { color:#888; font-size:12px; } .z-foto [data-fweg] { margin-left:auto; }
.z-karten { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.3fr); gap:14px; align-items:start; }
.z-letzte { display:flex; gap:14px; align-items:center; padding:6px 0 12px; }
.z-bild { flex:none; width:96px; height:96px; padding:0; border:0; border-radius:12px; overflow:hidden; cursor:zoom-in; background:#f4f4f4; } .z-bild img { width:100%; height:100%; object-fit:cover; }
.z-stand { font-size:26px; font-weight:600; letter-spacing:-.01em; } .z-stand small { font-size:14px; font-weight:400; color:#888; }
.z-mini { width:38px; height:38px; padding:0; border:0; border-radius:8px; overflow:hidden; cursor:zoom-in; background:#f4f4f4; } .z-mini img { width:100%; height:100%; object-fit:cover; }
.z-kopf { display:flex; flex-direction:column; min-width:0; } .z-kopf h1 { margin:0; } .z-kopf small { color:#888; font-size:13px; }
.z-hinweis { display:flex; gap:8px; align-items:flex-start; padding:10px 12px; border-radius:10px; background:#f5f6f8; color:#444; font-size:13.5px; margin-bottom:14px; } .z-hinweis a { text-decoration:underline; }

/* Auswahlliste (listeWahl in bausteine.js) */
.lw-knopf { display:flex; flex-wrap:nowrap; flex-direction:row; align-items:center; justify-content:flex-start; gap:10px; width:100%; min-width:0; text-align:left; cursor:pointer; color:#111; }
.lw-knopf.karte { border:none; background:none; height:auto; padding:0; font-size:15px; font-weight:600; } .lw-knopf.karte:hover { background:none; }
.lw-knopf.tabelle { height:40px; padding:0 10px; border:1px solid var(--rahmen); border-radius:8px; background:#fff; font-size:14px; font-weight:500; }
.lw-knopf.tabelle:hover { background:#fafaf8; }
.lw-knopf > span:not(.z-icon) { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lw-knopf.leer > span:not(.z-icon) { color:#a8a8a8; font-weight:500; } .lw-knopf .lw-pfeil { flex:none; color:var(--grau); }
.lw-knopf .z-icon { width:28px; height:28px; } .lw-knopf .z-icon svg { width:16px; height:16px; }
.feld:has(.lw-knopf) { cursor:pointer; }
.lw-liste { position:fixed; z-index:1000; background:#fff; border:1px solid var(--linie); border-radius:12px; box-shadow:0 12px 32px rgba(0,0,0,.14); padding:6px; max-height:320px; display:flex; flex-direction:column; }
.lw-suche { display:flex; align-items:center; gap:8px; height:38px; padding:0 10px; margin-bottom:4px; border:1px solid var(--linie); border-radius:8px; color:var(--grau); flex:none; }
.lw-suche input { border:none; outline:none; flex:1; font:inherit; font-size:14px; background:transparent; color:#111; }
.lw-eintraege { overflow-y:auto; overscroll-behavior:contain; min-height:0; flex:1 1 auto; }   /* min-height:0, sonst wächst die Liste aus dem Kasten und lässt sich nicht scrollen */
.lw-eintrag { display:flex; align-items:center; gap:12px; width:100%; min-height:44px; height:auto; padding:6px 10px; border:none; border-radius:8px; background:none; text-align:left; font-size:14.5px; font-weight:500; color:#111; cursor:pointer; }
.lw-eintrag:hover { background:#f4f4f2; } .lw-eintrag.an { background:#fdf0ef; }
.lw-eintrag > span:not(.z-icon) { flex:1; min-width:0; } .lw-suche svg { width:16px; height:16px; flex:none; } .lw-eintrag small { display:block; font-size:12px; color:#888; font-weight:400; }
.lw-eintrag .z-icon { width:30px; height:30px; } .lw-eintrag .z-icon svg { width:17px; height:17px; }
.lw-nichts { padding:10px; color:#888; font-size:13.5px; }

.z-mit-einheit { display:flex; align-items:baseline; gap:8px; } .z-mit-einheit input { flex:1; min-width:0; } .z-mit-einheit b { flex:none; font-weight:500; color:var(--grau); font-size:14px; }

/* Mietvertrag als Seite (public/mietvertrag.js) – nutzt den Rahmen der Nebenkosten (.nk-rahmen, .nk-seite, .nk-block …) */
.mvt-block { overflow:visible; } .mvt-innen { padding:2px 16px 16px; display:flex; flex-direction:column; gap:10px; }
.mvt-fakten { display:grid; grid-template-columns:repeat(auto-fill, minmax(190px, 1fr)); gap:10px 18px; padding:2px 0 6px; }
.mvt-fakten small { display:block; font-size:12px; color:var(--grau); } .mvt-fakten b { font-weight:500; font-size:14.5px; }
label.mvt-haken { min-height:54px; padding:8px 14px; } label.mvt-haken span { display:flex; flex-direction:column; } label.mvt-haken b { font-weight:500; font-size:14.5px; } label.mvt-haken small { color:var(--grau); font-size:12.5px; font-weight:400; }
.mvt-regeln { gap:8px; } .mvt-unter { padding:0 0 4px 36px; }
.mvt-staffel { display:flex; gap:8px; align-items:center; } .mvt-staffel .nk-datum { width:200px; flex:none; }
.mvt-seitensumme { padding:8px; display:flex; flex-direction:column; gap:2px; } .mvt-seitensumme small { color:var(--grau); font-size:12.5px; } .mvt-seitensumme b { font-size:20px; font-weight:600; }
.mvt-papier { background:#fff; border:1px solid var(--linie); border-radius:6px; box-shadow:0 2px 14px rgba(0,0,0,.06); padding:46px 56px; max-width:820px; }
.mvt-papier .vertrag-text h3 { font-size:22px; margin:0 0 18px; font-weight:600; }
.vt-abs h4 { display:flex; align-items:center; gap:8px; } .vt-abs h4 .ik { margin-left:auto; opacity:.55; } .vt-abs:hover h4 .ik { opacity:1; }
.mvt-knopfzeile { display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-top:6px; } .mvt-knopfzeile button { display:inline-flex; align-items:center; gap:6px; }
.knopf-link { display:inline-flex; align-items:center; height:40px; padding:0 14px; border:1px solid var(--rahmen); border-radius:10px; background:#fff; font-weight:500; font-size:14px; }
.mvt-papierweg { display:flex; align-items:center; gap:14px; border:1px dashed #cfcfca; border-radius:12px; padding:12px 14px; } .mvt-papierweg > div { flex:1; display:flex; flex-direction:column; gap:2px; } .mvt-papierweg b { font-weight:500; }
.nk-seite .nk-fest span { line-height:1.3; }

.mk-verlauf { margin-top:6px; padding-top:6px; border-top:1px solid var(--linie); } .mk-verlauf > small { font-size:11.5px; text-transform:uppercase; letter-spacing:.6px; color:var(--grau); font-weight:600; }
.mk-x { width:20px; height:20px; flex:none; } .mk-verlauf .daten > span:last-child { display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }

/* Darlehen mit Tilgungsplan (public/finanzen.js, Dom 13.11.2026) */
.dl-seite { display:flex; flex-direction:column; gap:18px; padding-bottom:30px; }
.dl-kacheln { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:14px; }
.dl-kachel { background:#fff; border:1px solid var(--linie); border-radius:10px; padding:16px 18px; min-height:128px; }
.dl-kt { display:flex; justify-content:space-between; align-items:center; font-size:13px; color:#555; } .dl-kt svg { color:#999; }
.dl-kz { font-size:24px; font-weight:700; margin-top:10px; line-height:1.2; font-variant-numeric:tabular-nums; } .dl-kz small { font-size:15px; font-weight:500; color:#666; }
.dl-ku { font-size:13px; color:var(--grau); margin-top:6px; }
.dl-teile { display:flex; gap:16px; flex-wrap:wrap; margin-top:10px; font-size:13px; color:#555; } .dl-teile b { color:#111; font-weight:600; margin-left:4px; }
.dl-farbe { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:6px; vertical-align:middle; }
.dl-balken { height:5px; border-radius:3px; background:#ececec; margin-top:12px; overflow:hidden; } .dl-balken i { display:block; height:100%; background:var(--schwarz); border-radius:3px; }
.dl-zwei { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:18px; align-items:start; }
.dl-seite .karte h3 { margin:0 0 4px; font-size:17px; font-weight:600; } .dl-unter { margin:0 0 10px; font-size:14px; color:var(--grau); } .dl-leer { color:var(--grau); font-size:14px; margin:8px 0 0; }
.dl-daten { display:grid; grid-template-columns:minmax(150px, 40%) 1fr; margin:10px 0 0; font-size:14.5px; }
.dl-daten dt, .dl-daten dd { margin:0; padding:9px 0; border-top:1px solid var(--linie-t); } .dl-daten dt { color:var(--grau); } .dl-daten dd { font-weight:500; text-align:right; font-variant-numeric:tabular-nums; }
.dl-daten dt:first-of-type, .dl-daten dd:first-of-type { border-top:none; }
.dl-bild { position:relative; } .dl-bild svg { display:block; width:100%; height:auto; }
.dl-gitter { stroke:#ececec; stroke-width:1; } .dl-achse { font-size:11px; fill:#777; font-family:inherit; }
.dl-linie { fill:none; stroke:#111; stroke-width:2; stroke-linejoin:round; } .dl-flaeche { fill:#111; opacity:.05; }
.dl-heute { stroke:#999; stroke-width:1; stroke-dasharray:3 3; } .dl-heute-box { fill:#fff; stroke:#d6d6d6; }
.dl-faden { stroke:#bbb; stroke-width:1; } .dl-punkt { fill:#111; stroke:#fff; stroke-width:2; }
.dl-legende { display:flex; justify-content:center; gap:18px; font-size:13px; color:#555; margin-top:4px; } .dl-legende i, .dl-tip i { display:inline-block; width:10px; height:10px; border-radius:2px; margin-right:6px; }
.dl-tip { position:absolute; pointer-events:none; background:#fff; border:1px solid var(--rahmen); border-radius:8px; box-shadow:0 4px 14px rgba(0,0,0,.1); padding:8px 11px; font-size:13px; display:flex; flex-direction:column; gap:3px; min-width:150px; z-index:2; }
.dl-tip[hidden] { display:none; } .dl-tip small { color:var(--grau); } .dl-tip b { font-weight:600; font-variant-numeric:tabular-nums; } .dl-tip span { color:#555; } .dl-tip span b { color:#111; float:right; margin-left:14px; }
.dl-plan { padding:0; overflow:hidden; } .dl-plankopf { display:flex; align-items:center; gap:14px; padding:18px; } .dl-plankopf .rechts { margin-left:auto; display:flex; align-items:center; gap:10px; } .dl-plankopf .dl-unter { margin:0; }
.dl-plankopf button[data-csv] { display:inline-flex; align-items:center; gap:6px; }
.dl-plan .tabelle-scroll { max-height:620px; overflow:auto; border-top:1px solid var(--linie); }
.dl-plan table { width:100%; border-collapse:collapse; font-size:14px; font-variant-numeric:tabular-nums; }
.dl-plan th { position:sticky; top:0; background:#fafafa; text-align:left; font-size:11.5px; letter-spacing:.04em; text-transform:uppercase; color:#666; font-weight:600; padding:10px 18px; border-bottom:1px solid var(--linie); z-index:1; white-space:nowrap; }
.dl-plan td { padding:9px 18px; border-bottom:1px solid var(--linie-t); } .dl-plan .zahl { text-align:right; }
.dl-plan tr.dl-jahr td { background:#f5f5f5; font-weight:600; font-size:13px; } .dl-plan tr.dl-bezahlt td { color:#8a8a8a; } .dl-plan tr.dl-naechste td { background:#fdf3f2; font-weight:600; }
.dl-plan tr.dl-summe td { font-weight:700; border-top:1px solid var(--linie); border-bottom:none; position:sticky; bottom:0; background:#fff; }
.dl-abschnitt { font-size:13px; font-weight:600; color:#555; margin:18px 0 8px; } .dl-hinweis { font-size:13px; color:var(--grau); align-self:center; }
.reihe.dl-sonder { display:flex; flex-wrap:nowrap; gap:10px; align-items:center; } .dl-sonder > label { flex:1; min-width:0; } .dl-sonder .ik { flex:none; }
.dl-plus { width:auto; }
.dl-plus { display:inline-flex; align-items:center; gap:6px; border:1px dashed var(--rahmen); background:none; border-radius:9px; padding:7px 12px; font-size:14px; color:#444; }
@media (max-width:1100px) { .dl-kacheln, .dl-zwei { grid-template-columns:repeat(2, minmax(0, 1fr)); } }

/* Auswertungen (public/auswertung.js, Dom 13.11.2026) – nutzt die Karten und Diagramme vom Darlehen (.dl-*) */
.aw-zeile { display:grid; grid-template-columns:1fr auto; gap:2px 12px; align-items:baseline; font-size:14.5px; padding:7px 0; } .aw-zeile small { color:var(--grau); font-size:12px; margin-left:4px; }
.aw-zeile b { font-weight:600; font-variant-numeric:tabular-nums; } .aw-balken { grid-column:1 / -1; height:5px; border-radius:3px; background:#efefef; overflow:hidden; } .aw-balken i { display:block; height:100%; border-radius:3px; }
.aw-posten { display:flex; align-items:center; gap:10px; padding:10px 0; border-top:1px solid var(--linie-t); font-size:14.5px; } .aw-posten:first-of-type { border-top:none; } .aw-posten:hover b { text-decoration:underline; }
.aw-posten > div { flex:1; min-width:0; } .aw-posten b { font-weight:500; display:block; } .aw-posten small { color:var(--grau); font-size:13px; } .aw-posten > span { font-weight:600; font-variant-numeric:tabular-nums; white-space:nowrap; }
.aw-mehr { display:inline-block; margin-top:10px; font-size:14px; font-weight:500; text-decoration:underline; }
.aw-orte { display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); gap:0 28px; } .aw-orte h3, .aw-orte .dl-unter, .aw-orte .dl-leer { grid-column:1 / -1; }
.aw-stift { border:none; background:none; padding:2px 4px; height:auto; color:#888; vertical-align:middle; } .aw-stift:hover { color:#111; background:none; }
.aw-vorschlag { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; } .aw-vorschlag button { border:1px solid var(--rahmen); background:#fff; border-radius:999px; padding:4px 12px; height:auto; font-size:13px; }
.aw-nk-kopf { display:flex; align-items:flex-start; gap:12px; margin-bottom:12px; } .aw-nk-kopf .rechts { margin-left:auto; display:flex; gap:10px; align-items:center; } .aw-nk-kopf h3 a:hover { text-decoration:underline; }
.knopf-link { border:1px solid var(--rahmen); border-radius:9px; padding:7px 13px; font-size:14px; font-weight:500; background:#fff; white-space:nowrap; } .knopf-link:hover { border-color:#111; }
.aw-urteil { font-size:14.5px; color:#333; margin:12px 0 0; line-height:1.45; } .aw-unterkopf { font-size:13px; color:var(--grau); margin-bottom:6px; }
.aw-mini { width:100%; border-collapse:collapse; font-size:14px; font-variant-numeric:tabular-nums; } .aw-mini th { text-align:left; font-size:11.5px; letter-spacing:.04em; text-transform:uppercase; color:#666; font-weight:600; padding:8px 8px 8px 0; border-bottom:1px solid var(--linie); }
.aw-mini td { padding:9px 8px 9px 0; border-bottom:1px solid var(--linie-t); vertical-align:top; } .aw-mini .zahl { text-align:right; padding-right:0; padding-left:8px; } .aw-mini tr:last-child td { border-bottom:none; } .aw-mini tr.klick { cursor:pointer; } .aw-mini tr.klick:hover td { background:#fafafa; }
.dl-kacheln.aw-klein { margin-bottom:14px; } .aw-klein .dl-kachel { min-height:0; background:#fafafa; } .dl-kz .rot-text, .aw-posten .rot-text { color:var(--rot); }
.dl-plan td.zahl, .aw-mini td.zahl { white-space:nowrap; } .dl-plan tr.klick { cursor:pointer; } .dl-plan tr.klick:hover td { background:#fafafa; }

/* Aufgaben und Ein-/Auszüge (public/aufgaben.js, Dom 13.11.2026) */
.auf-liste { display:flex; flex-direction:column; gap:10px; padding-bottom:30px; max-width:1100px; }
.auf-gruppe { font-size:13px; font-weight:600; color:#555; margin:12px 0 0; } .auf-gruppe span { color:var(--grau-hell); font-weight:500; margin-left:4px; } .auf-gruppe.rot-text { color:var(--rot); }
.auf-karte { padding:4px 16px; }
.auf-zeile { display:flex; align-items:center; gap:12px; padding:11px 0; border-top:1px solid var(--linie-t); cursor:pointer; } .auf-zeile:first-child { border-top:none; } .kasten .auf-zeile:first-of-type { border-top:none; }
.auf-zeile input.schalter { border-radius:50%; } .auf-mitte { flex:1; min-width:0; } .auf-mitte b { display:block; font-weight:500; font-size:15px; } .auf-mitte small { color:var(--grau); font-size:13px; display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.auf-zeile:hover .auf-mitte b { text-decoration:underline; } .auf-zeile.erledigt .auf-mitte b { color:#999; text-decoration:line-through; }
.auf-datum { font-size:13px; color:#555; white-space:nowrap; font-variant-numeric:tabular-nums; } .auf-datum.rot-text { color:var(--rot); font-weight:600; }
.auf-wichtig { display:inline-grid; place-items:center; width:18px; height:18px; border-radius:50%; background:var(--rot); color:#fff; margin-right:6px; vertical-align:-3px; } .auf-wichtig svg { stroke-width:2.6; }
.auf-haken { display:flex; align-items:center; gap:10px; margin-top:12px; font-size:15px; cursor:pointer; } .auf-haken input.schalter { border-radius:50%; }
.um-karte { padding:0; } .um-kopf { display:flex; align-items:center; gap:16px; padding:14px 18px; }
.um-tag { width:74px; flex:none; text-align:center; background:#f5f5f5; border-radius:9px; padding:7px 4px; } .um-tag b { display:block; font-size:16px; } .um-tag small { font-size:12px; color:#666; } .um-tag.spaet { background:#fdecea; } .um-tag.spaet small { color:var(--rot); font-weight:600; }
.um-wer { flex:1; min-width:0; } .um-wer b { font-weight:600; font-size:16px; } .um-wer a:hover b { text-decoration:underline; } .um-wer small { color:var(--grau); font-size:13px; display:block; margin-top:3px; }
.um-stand { width:130px; flex:none; font-size:13px; color:#555; text-align:right; } .um-stand b { font-weight:600; color:#111; } .um-stand .dl-balken { margin-top:6px; }
.um-schritte { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:0; border-top:1px solid var(--linie); }
.um-schritt { display:flex; align-items:flex-start; gap:10px; padding:12px 14px 12px 18px; border-right:1px solid var(--linie-t); border-bottom:1px solid var(--linie-t); cursor:pointer; min-width:0; margin:0 -1px -1px 0; }
.um-schritt input.schalter { border-radius:50%; margin-top:1px; } .um-schritt span { flex:1; min-width:0; } .um-schritt b { display:block; font-weight:500; font-size:14px; line-height:1.3; } .um-schritt small { color:var(--grau); font-size:12.5px; display:block; margin-top:2px; line-height:1.3; }
.um-schritt.erledigt b { color:#8a8a8a; } .um-los { color:#999; flex:none; margin-top:1px; } .um-los:hover { color:#111; }
@media (max-width:1250px) { .um-schritte { grid-template-columns:repeat(2, minmax(0, 1fr)); } }
/* Tickets (public/tickets.js): Liste, Ticket-Seite mit Chat und Verlauf in einem Strom (wie Nodus: eigene Nachrichten rechts schwarz, Änderungen als kleine graue Zeile), Bilder, Melde-Link */
.tk-liste { flex:1; min-height:0; display:flex; flex-direction:column; }
.tk-marken { display:inline-flex; align-items:center; gap:6px; flex-wrap:wrap; }
.tk-punkt { width:9px; height:9px; border-radius:50%; background:var(--rot); display:inline-block; }
.tk-zahlen { white-space:nowrap; color:#8a8a8a; font-size:13px; } .tk-zahlen span { display:inline-flex; align-items:center; gap:4px; margin-right:10px; } .tk-zahlen svg { width:15px; height:15px; }
main.tk-seite > .kopf { flex-wrap:nowrap; } main.tk-seite .z-kopf { flex:0 1 auto; } main.tk-seite .z-kopf h1 { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } main.tk-seite .kopf .rechts { flex:none; }
.tk-spalten { flex:1; min-height:0; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:16px; }
.tk-links { overflow:auto; display:flex; flex-direction:column; gap:14px; min-height:0; padding-bottom:4px; }
.tk-links .mk-karte { padding:12px 16px 6px; flex:none; } .tk-links .daten a, .tk-text a { text-decoration:underline; text-decoration-color:#cfcfcf; text-underline-offset:3px; }
.tk-ergaenzen { margin:6px 0 8px; }
.tk-text { white-space:pre-wrap; overflow-wrap:anywhere; font-size:14.5px; line-height:1.5; color:#333; padding:8px 0 10px; }
.tk-bilder { display:grid; grid-template-columns:repeat(auto-fill, minmax(104px, 1fr)); gap:8px; padding:10px 0 4px; }
.tk-bild { position:relative; aspect-ratio:1; height:auto; padding:0; border:0; border-radius:10px; overflow:hidden; background:#f4f4f4; cursor:zoom-in; }
.tk-bild img { width:100%; height:100%; object-fit:cover; display:block; }
.tk-bild small { position:absolute; left:6px; bottom:6px; background:rgba(17,17,17,.78); color:#fff; font-size:11px; font-weight:500; border-radius:20px; padding:1px 8px; }
.tk-ablage { display:flex; align-items:center; justify-content:center; gap:8px; margin:10px 0 10px; padding:14px; border:1.5px dashed #cfcfcf; border-radius:10px; color:var(--grau); font-size:14px; cursor:pointer; }
.tk-ablage b { color:#111; font-weight:600; } .tk-ablage:hover, .tk-ablage.drueber { border-color:#111; color:#111; background:#fafafa; }
.tk-chat { border:1px solid var(--linie); border-radius:12px; background:#fff; display:flex; flex-direction:column; min-height:0; overflow:hidden; }
.tk-chat.drueber { outline:2px dashed #111; outline-offset:-5px; }
.tk-chat-kopf { display:flex; align-items:center; gap:12px; padding:10px 16px; border-bottom:1px solid var(--linie-t); flex:none; } .tk-chat-kopf h3 { flex:1; margin:0; font-size:15px; font-weight:600; }
.tk-strom { flex:1; min-height:0; overflow:auto; padding:10px 18px 14px; display:flex; flex-direction:column; gap:4px; }
.tk-leer { margin:auto; color:var(--grau); font-size:14px; text-align:center; padding:30px; }
.tk-tag { text-align:center; margin:12px 0 6px; flex:none; } .tk-tag span { font-size:12px; font-weight:500; color:#6f6f6f; background:#f1f1ef; border-radius:20px; padding:3px 11px; }
.tk-zeile { text-align:center; font-size:12.5px; color:#8c8c8c; padding:3px 24px; flex:none; overflow-wrap:anywhere; }
.tk-n { display:flex; flex-direction:column; align-items:flex-start; max-width:78%; flex:none; margin-top:2px; } .tk-n.ich { align-self:flex-end; align-items:flex-end; }
.tk-von { font-size:12px; font-weight:500; color:#6f6f6f; margin:3px 6px 3px; } .tk-n.melder .tk-von { color:var(--rot); }
.tk-blase { background:#f1f1ef; color:#111; border-radius:18px 18px 18px 6px; padding:9px 14px; font-size:15.5px; line-height:1.4; white-space:pre-wrap; overflow-wrap:anywhere; min-width:0; max-width:100%; }
.tk-n.ich .tk-blase { background:#111; color:#fff; border-radius:18px 18px 6px 18px; } .tk-n.melder .tk-blase { background:#fdf0ef; }
.tk-zeit { font-size:11.5px; color:#9a9a9a; margin:3px 6px 2px; display:inline-flex; align-items:center; gap:4px; } .tk-zeit svg { width:12px; height:12px; }
.tk-b-bilder { display:flex; flex-wrap:wrap; gap:4px; margin:-4px -9px 0; } .tk-b-bilder:not(:last-child) { margin-bottom:8px; }
.tk-b-bild { width:150px; height:150px; padding:0; border:0; border-radius:13px; overflow:hidden; background:#ddd; cursor:zoom-in; } .tk-b-bild img { width:100%; height:100%; object-fit:cover; display:block; }
.tk-eingabe-box { border-top:1px solid var(--linie-t); padding:10px 12px 12px; flex:none; }
.tk-eingabe { display:flex; align-items:flex-end; gap:8px; } .tk-eingabe .ik { width:40px; height:40px; color:#555; }
.tk-eingabe textarea { flex:1; min-width:0; min-height:40px; max-height:150px; border:1px solid #dcdcdc; border-radius:20px; padding:9px 15px; font:inherit; font-size:15px; line-height:1.35; resize:none; outline:none; field-sizing:content; background:#fff; }
.tk-eingabe textarea:focus { border-color:#111; }
.tk-senden { flex:none; width:40px; height:40px; padding:0; border-radius:50%; border:0; background:var(--rot); color:#fff; } .tk-senden:hover { background:var(--rot-dunkel); }
.tk-anhaenge { display:flex; flex-wrap:wrap; gap:8px; } .tk-anhaenge:not(:empty) { margin:0 0 10px 48px; }
.tk-anhaenge span { position:relative; width:60px; height:60px; } .tk-anhaenge img { width:100%; height:100%; object-fit:cover; border-radius:10px; display:block; }
.tk-anhaenge button { position:absolute; top:-6px; right:-6px; width:20px; height:20px; padding:0; border-radius:50%; border:0; background:#111; color:#fff; }
label.tk-haken { display:flex; align-items:center; gap:9px; margin:10px 0 0 48px; font-size:13.5px; font-weight:500; color:#333; cursor:pointer; } label.tk-haken small { font-weight:400; color:var(--grau); font-size:13px; }
label.tk-haken input { appearance:none; -webkit-appearance:none; flex:none; width:20px; height:20px; margin:0; border:1.5px solid #c8c8c8; border-radius:50%; background:#fff; display:grid; place-items:center; cursor:pointer; }
label.tk-haken input:checked { background:var(--rot); border-color:var(--rot); } label.tk-haken input:checked::after { content:""; width:5px; height:9px; border:solid #fff; border-width:0 2px 2px 0; transform:translateY(-1px) rotate(45deg); }
@media (max-width:1100px) { .tk-spalten { grid-template-columns:1fr; overflow:auto; } .tk-links { overflow:visible; } .tk-chat { min-height:520px; } }
/* ---------- Anschreiben und Postausgang (public/anschreiben.js) – Rahmen und Tabellen kommen von den Nebenkosten (.nk-*) ---------- */
.an-klein { display:block; color:#888; font-size:12.5px; font-weight:400; margin-top:1px; }
.tabelle tr.an-aus td { color:#999; } .an-anriss { color:#777; font-size:13.5px; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; }
.kopf .schiene { margin-left:6px; }
.an-haus { max-width:520px; margin-bottom:16px; }
.an-zahl { margin-left:12px; font-weight:400; font-size:13px; color:#888; } .nk-block-kopf .an-links { margin-left:auto; }
.an-links { display:inline-flex; gap:16px; } .an-links .link { text-decoration:underline; color:#444; font-size:13.5px; }
.an-tab td:first-child, .an-tab th:first-child { padding-left:16px; } .an-tab td svg { color:#8a8a86; vertical-align:middle; }
.an-tab tr.an-zeile { cursor:pointer; } .an-tab tr.an-zeile:hover td { background:#fbfbfa; } .an-tab tr.an-leerstand td { color:#999; }
.an-tab td small.an-warn, .an-warn { color:#a3201a; } .an-nichts { padding:4px 16px 16px; color:#777; font-size:14px; }
.an-dazu { padding:10px 16px 14px; max-width:420px; } .an-dazu .lw-knopf { height:40px; padding:0 12px; border:1px dashed #cfcfca; border-radius:10px; background:#fff; font-size:14px; }
.an-wahl { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:16px; }
.an-karte { display:flex; align-items:flex-start; gap:12px; padding:16px; border:1px solid var(--linie); border-radius:12px; background:#fff; cursor:pointer; min-height:118px; }
.an-karte.an { border-color:#e9b9b6; background:#fffafa; } .an-karte > div { display:flex; flex-direction:column; gap:3px; min-width:0; font-size:14.5px; }
.an-karte b { font-weight:600; font-size:15.5px; } .an-karte small { color:#777; font-size:13px; } .an-karte small.an-so { margin-top:6px; color:#555; }
.an-karte input { appearance:none; -webkit-appearance:none; flex:none; width:22px; height:22px; margin:1px 0 0; border:1.5px solid #c8c8c8; border-radius:50%; background:#fff; display:grid; place-items:center; cursor:pointer; }
.an-karte input:checked { background:var(--rot); border-color:var(--rot); } .an-karte input:checked::after { content:""; width:6px; height:11px; border:solid #fff; border-width:0 2.2px 2.2px 0; transform:translateY(-1px) rotate(45deg); }
.an-kopfzeile { display:grid; grid-template-columns:minmax(0,1fr) 220px; gap:10px; margin-bottom:10px; }
.an-editor { margin-top:10px; border:1px solid #e1e1e1; border-radius:12px; background:#fff; overflow:hidden; } .an-editor:focus-within { border-color:#111; }
.an-werkzeug { display:flex; align-items:center; flex-wrap:wrap; gap:6px; padding:9px 12px; border-bottom:1px solid var(--linie-t); background:#fafaf8; }
.an-wz { height:30px; padding:0 10px; border-radius:15px; font-size:13px; font-weight:500; background:#fff; border:1px solid var(--rahmen); color:#333; display:inline-flex; align-items:center; gap:5px; }
.an-wz:hover { border-color:#111; background:#fff; } .an-wz.fett { border-radius:8px; font-weight:600; margin-right:6px; } .an-wz-titel { font-size:12.5px; color:#888; margin-right:2px; }
textarea.an-text { display:block; width:100%; min-height:420px; border:none; outline:none; resize:vertical; padding:18px 20px; font:inherit; font-size:15px; line-height:1.55; color:#111; background:#fff; }
textarea.an-text.klein { min-height:300px; } .fenster .an-editor { margin:0 0 10px; }
.an-unter { display:flex; align-items:center; gap:16px; margin:10px 2px 18px; } .an-unter .an-links { margin-left:auto; white-space:nowrap; }
.an-anlage .nk-block-kopf svg { color:#555; } .an-datei { display:flex; align-items:center; gap:8px; padding:2px 16px 16px; } .an-datei .link { display:inline-flex; align-items:center; gap:8px; font-size:14.5px; color:#111; }
.an-schiene { width:100%; display:flex; } .an-schiene button { flex:1; } .an-schiene button:disabled { opacity:.4; cursor:default; background:none; }
.an-aktion { display:flex; align-items:center; gap:16px; padding:16px; } .an-aktion-text { display:flex; align-items:center; gap:14px; min-width:0; } .an-aktion-text svg { flex:none; color:#555; }
.an-aktion-text div { display:flex; flex-direction:column; gap:2px; font-size:14px; color:#555; } .an-aktion-text b { color:#111; font-weight:600; font-size:15px; }
.an-aktion-knoepfe { margin-left:auto; display:flex; align-items:center; gap:16px; flex:none; } .an-gedruckt { display:inline-flex; align-items:center; gap:10px; font-size:14px; cursor:pointer; }
.an-mail .nk-block-kopf svg { color:#555; } .an-mail-innen { padding:0 16px 16px; } .an-mail-innen textarea { min-height:120px; line-height:1.5; } .an-mail-innen .nk-box { margin:0; }
.an-mail-fuss { display:flex; align-items:center; gap:16px; margin-top:12px; } .an-mail-fuss .primaer { margin-left:auto; flex:none; display:inline-flex; align-items:center; gap:8px; min-width:190px; justify-content:center; }
.an-mail-fuss .primaer:disabled { opacity:.45; cursor:default; }
.an-rueck { display:flex; flex-direction:column; gap:6px; max-height:260px; overflow:auto; font-size:14px; } .an-rueck div { display:flex; justify-content:space-between; gap:14px; } .an-rueck b { font-weight:500; } .an-rueck span { color:#666; }
.an-test { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; padding-left:30px; } .an-test .primaer { height:58px; border-radius:12px; padding:0 20px; } .an-test .primaer:disabled { opacity:.45; cursor:default; }
#an-test-erg { padding-left:30px; margin-top:12px; } #an-test-erg:empty { display:none; }

/* Mietvertrag ausführlich: Zahlenfelder für Räume und Schlüssel, Anlagen in der Vorschau */
.mvt-zahlen { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:8px; }
.mvt-zahl { display:flex; align-items:center; gap:10px; border:1px solid var(--rahmen); border-radius:10px; padding:6px 10px; background:#fff; cursor:text; }
.mvt-zahl input { width:44px; border:none; outline:none; font:inherit; font-weight:600; text-align:center; background:#f5f5f5; border-radius:7px; padding:6px 2px; } .mvt-zahl span { font-size:14px; color:#444; }
.mvt-zahl:focus-within { border-color:#111; }
.vertrag-text .vt-abs p { white-space:pre-line; } .vertrag-text .vt-anlage { border-top:1px dashed var(--rahmen); margin-top:22px; padding-top:18px; }
/* ---------- Bescheinigungen (public/bescheinigungen.js): Auswahlkarten und Formular ---------- */
.be-karten { display:flex; flex-direction:column; gap:10px; padding:4px 0 6px; }
button.be-karte { display:flex; align-items:center; gap:14px; width:100%; height:auto; min-height:76px; padding:13px 14px 13px 16px; border:1px solid #e1e1e1; border-radius:14px; background:#fff; text-align:left; white-space:normal; cursor:pointer; transition:border-color .12s, box-shadow .12s; }
button.be-karte:hover { border-color:#111; background:#fff; box-shadow:0 2px 10px rgba(0,0,0,.06); }
.be-icon { flex:none; width:44px; height:44px; border-radius:50%; background:#f3f3f1; color:#222; display:grid; place-items:center; }
.be-mitte { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; } .be-mitte b { font-size:15.5px; font-weight:600; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.be-mitte b i { font-style:normal; font-size:12px; font-weight:500; color:var(--grau); background:#f1f1ef; border-radius:20px; padding:2px 9px; }
.be-mitte small { font-size:13.5px; font-weight:400; color:var(--grau); line-height:1.35; } .be-pfeil { flex:none; color:#9a9a9a; } .be-karte:hover .be-pfeil { color:#111; }
.be-form { display:flex; flex-direction:column; gap:18px; } .be-ab h3 { font-size:13px; font-weight:600; color:var(--grau); text-transform:uppercase; letter-spacing:.3px; margin:0 0 8px 2px; }
.be-info { font-size:13.5px; line-height:1.45; color:#555; background:#f6f6f4; border-radius:10px; padding:10px 14px; } .be-info.warn { background:#fbefc5; color:#5c4500; }
.be-zwischen { font-size:13.5px; font-weight:600; color:#333; margin:6px 2px -2px; }
label.be-haken { display:flex; align-items:center; gap:12px; min-height:58px; padding:8px 14px; border:1px solid #e1e1e1; border-radius:12px; font-size:15px; font-weight:500; line-height:1.35; cursor:pointer; }
label.be-haken input.schalter { border-radius:50%; } label.be-haken:has(input:checked) { border-color:#e9b9b6; background:#fffafa; }
/* ---------- Chat (public/chat.js) – aus Nodus styles.css übernommen ---------- */
/* Grundlagen, die in Nodus allgemein gelten und hier nur der Chat braucht: kleines Fenster (dialog.klein), Leiste, Felder */
dialog.klein { border:none; border-radius:12px; padding:22px; width:min(520px, 94vw); box-shadow:0 10px 40px rgba(0,0,0,.25); color:var(--schwarz); }
dialog.klein::backdrop { background:rgba(0,0,0,.4); }
dialog.klein .leiste { display:flex; gap:10px; align-items:center; flex-wrap:wrap; } dialog.klein .leiste .rechts { margin-left:auto; }
dialog.klein .formular { display:grid; grid-template-columns:1fr; gap:12px 16px; } dialog.klein .formular label { display:flex; flex-direction:column; gap:4px; font-size:13px; color:var(--grau); }
dialog.klein input:not([type=checkbox]), dialog.klein textarea { font:inherit; font-size:15px; color:var(--schwarz); border:1px solid #d9d9d9; border-radius:8px; padding:9px 12px; background:#fff; outline:none; width:100%; }
dialog.klein input:not([type=checkbox]):focus, dialog.klein textarea:focus { border-color:#111; }
dialog.klein input[type=checkbox] { appearance:none; -webkit-appearance:none; flex:none; width:22px; height:22px; margin:0; border:1.5px solid #c8c8c8; border-radius:50%; background:#fff; display:inline-grid; place-items:center; cursor:pointer; }
dialog.klein input[type=checkbox]:checked { background:var(--rot); border-color:var(--rot); }
dialog.klein input[type=checkbox]:checked::after { content:""; width:5px; height:10px; border:solid #fff; border-width:0 2px 2px 0; transform:translateY(-1px) rotate(45deg); }
dialog.klein .menue { z-index:200; }
.auswahl-liste { position:fixed; max-width:460px; z-index:60; background:#fff; border:1px solid var(--linie); border-radius:8px; box-shadow:0 8px 24px rgba(0,0,0,.14); padding:4px; }
.auswahl-eintraege { max-height:280px; overflow-y:auto; }
.auswahl-eintrag { display:flex; justify-content:space-between; gap:14px; padding:7px 10px; border-radius:5px; cursor:pointer; white-space:nowrap; }
.auswahl-eintrag.aktiv { background:#fff0f0; }
.auswahl-eintrag.gewaehlt { font-weight:500; color:var(--rot); }
.auswahl-eintrag .klein-text { font-weight:400; }
.icon-knopf { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; padding:0; border:1px solid #dcdcdc; border-radius:8px; background:#fff; color:var(--schwarz); flex:none; }
.icon-knopf:hover { background:var(--hell); text-decoration:none; }
.icon-knopf.klein { width:30px; height:30px; border-color:transparent; }
.icon-knopf.klein:hover { border-color:#d9d9d9; }
td .icon-knopf { width:32px; height:32px; border-color:transparent; background:transparent; }
td .icon-knopf:hover { border-color:#d9d9d9; background:#fff; }
.auswahl-eintrag.gefahr span:first-child { color:var(--rot); }
.auswahl-eintrag.aktiv { background:#f2f2f2; }
.avatar-bild, .avatar-kreis { width:26px; height:26px; border-radius:50%; flex:none; object-fit:cover; display:inline-flex; align-items:center; justify-content:center; background:#ececec; color:#555; font-size:11px; font-weight:500; vertical-align:middle; }
.pa-leer { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; color:#666; text-align:center; padding:60px 20px; height:100%; box-sizing:border-box; line-height:1.6; }
.pa-leer b { color:#555; }
.pa-chat { display:flex; flex-direction:column; min-height:0; overflow:hidden; }
.ch-titel { margin:0; padding:18px 16px 6px; font-size:20px; font-weight:700; }
.ch-reiter { display:flex; align-items:center; gap:2px; margin:0 8px; border-bottom:1px solid #e3e3e3; flex:none; }
.ch-reiter > button[data-kanal] { background:none; border:none; border-bottom:2px solid transparent; border-radius:0; padding:10px 12px; font-size:15px; font-weight:500; color:#333; cursor:pointer; margin-bottom:-1px; }
.ch-reiter > button[data-kanal].an { font-weight:600; color:#111; border-bottom-color:#111; }
.ch-filter { margin-left:auto; height:32px; margin-bottom:6px; font-size:13.5px; }
.ch-angeheftet { flex:none; border-bottom:1px solid #eee; max-height:84px; overflow:auto; background:#fafafa; }
.ch-verlauf { flex:1; min-height:0; overflow-y:auto; padding:6px 10px 10px; display:flex; flex-direction:column; gap:10px; }
.ch-ziel { outline:2px solid var(--rot) !important; outline-offset:-2px; border-radius:12px; }
.ch-tag { display:flex; align-items:center; gap:10px; color:#666; font-size:12.5px; margin:10px 0 2px; }
.ch-tag::before, .ch-tag::after { content:''; flex:1; height:1px; background:#e2e2e2; }
.ch-n { display:flex; align-items:flex-start; gap:10px; max-width:90%; }
.ch-n.ich { align-self:flex-end; flex-direction:row-reverse; }
.ch-av { width:30px !important; height:30px !important; font-size:11px; flex:none; margin-top:2px; }
.ch-av-platz { width:30px; flex:none; }
.ch-blase { background:#f1f1f1; border-radius:16px 16px 16px 4px; padding:8px 12px 6px; min-width:90px; overflow-wrap:anywhere; }
.ch-n.ich .ch-blase { background:#fdecec; border-radius:16px 16px 4px 16px; } /* Dom 13.11.2026: Blasen am Rechner wie am Handy (Nodus-App): Gegenseite grau, eigene hellrot */
.ch-n.erwaehnt .ch-blase { box-shadow:inset 3px 0 0 #e0a800; }
.ch-blase.geloescht { color:#888; font-style:italic; font-size:13.5px; }
.ch-wer { font-size:13.5px; font-weight:600; margin-bottom:4px; }
.ch-text { font-size:14.5px; line-height:1.5; }
.ch-zeit { font-size:12px; color:#555; text-align:right; margin-top:4px; display:flex; justify-content:flex-end; align-items:center; gap:4px; }
.ch-pin-ic svg { width:12px; height:12px; }
.ch-bild { display:block; max-width:240px; max-height:240px; border-radius:6px; cursor:zoom-in; margin:2px 0 4px; }
.ch-datei { display:flex; align-items:center; gap:8px; color:#111; margin:2px 0; font-size:14px; text-decoration:none; }
.ch-datei:hover b { text-decoration:underline; }
.ch-datei svg { width:18px; height:18px; flex:none; }
.ch-zitat { border-left:3px solid #999; background:rgba(0,0,0,.05); border-radius:4px; padding:4px 8px; margin-bottom:6px; font-size:13px; cursor:pointer; display:flex; flex-direction:column; }
.ch-zitat span { color:#555; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ch-n.blink .ch-blase { animation:chBlink 1.2s; }
@keyframes chBlink { 30% { box-shadow:0 0 0 3px #e0a800; } }
.ch-galerie { display:grid; grid-template-columns:repeat(3, 1fr); gap:6px; padding-top:6px; }
.ch-kachel { aspect-ratio:1; border:none; padding:0; border-radius:6px; overflow:hidden; background:#f2f2f2; cursor:zoom-in; display:flex; }
.ch-kachel img { width:100%; height:100%; object-fit:cover; }
.ch-kachel.datei { flex-direction:column; align-items:center; justify-content:center; gap:6px; color:#111; text-decoration:none; cursor:pointer; padding:8px; text-align:center; font-size:12px; }
.ch-kachel.datei svg { width:28px; height:28px; }
.ch-kachel.datei span { overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.ch-unten { flex:none; background:#f2f2f2; border-radius:0 0 10px 10px; }
.ch-antwort { display:flex; align-items:center; gap:8px; padding:8px 12px 0; }
.ch-antwort div { flex:1; min-width:0; border-left:3px solid #999; padding-left:8px; display:flex; flex-direction:column; font-size:13px; }
.ch-antwort span { color:#666; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ch-eingabe { display:flex; align-items:flex-end; gap:8px; padding:12px; }
.ch-feld { flex:1; min-width:0; background:#fff; border:1px solid #d9d9d9; border-radius:8px; }
.ch-feld:focus-within { border-color:#999; }
.ch-werkzeug { display:none; gap:2px; padding:5px 6px 0; }
.ch-feld:focus-within .ch-werkzeug { display:flex; }
.ch-werkzeug button { background:none; border:none; width:28px; height:26px; border-radius:5px; color:#222; cursor:pointer; font-size:14px; display:flex; align-items:center; justify-content:center; }
.ch-werkzeug button:hover { background:#f0f0f0; }
.ch-werkzeug svg { width:16px; height:16px; }
.ch-feld textarea { display:block; width:100%; box-sizing:border-box; border:none; outline:none; resize:none; padding:9px 10px; font:inherit; font-size:14.5px; line-height:1.4; max-height:140px; background:none; }
.ch-senden { color:#aaa; }
.ch-senden.bereit { color:#fff; background:var(--rot); border-color:var(--rot); }
@media (max-width:1100px) {
  .pa-chat { height:75vh; }
}
.ch-eingabe { align-items:stretch; }
.ch-eingabe > .pa-knopf { height:auto; min-height:42px; width:44px; padding:0; }
.ch-editor { min-height:22px; max-height:160px; overflow-y:auto; padding:10px 12px; font-size:14.5px; line-height:1.45; outline:none; overflow-wrap:anywhere; }
.ch-marke { display:inline-block; background:#e9e9e9; color:#111; border-radius:6px; padding:0 6px; font-weight:500; white-space:nowrap; }
.ch-werkzeug button.an { background:#e6e6e6; }
button.ch-datei { background:none; border:none; padding:0; font:inherit; cursor:pointer; text-align:left; }
button.ch-kachel.datei { border:none; font:inherit; }
.ch-reiter.einzeln { border-bottom:none; }
.ch-eingabe { align-items:flex-end; }
.ch-eingabe > .pa-knopf { height:42px; min-height:42px; width:42px; flex:none; }
.ch-trenner { width:1px; height:16px; background:#d6d6d6; margin:0 4px; align-self:center; }
.ch-werkzeug button svg { width:16px; height:16px; }
.cl { flex:1 1 auto; min-height:0; display:grid; grid-template-columns:340px 1fr; background:#fff; border:1px solid #e3e3e3; border-radius:10px; overflow:hidden; }
.cl-liste { display:flex; flex-direction:column; min-height:0; border-right:1px solid #e3e3e3; }
.cl-kopf { display:flex; align-items:center; justify-content:space-between; padding:14px 12px 8px 16px; }
.cl-kopf h1 { margin:0; font-size:22px; }
.cl-suche { display:flex; align-items:center; gap:8px; margin:0 12px 8px; padding:0 10px; height:38px; background:#f2f2f2; border-radius:8px; color:#666; }
.cl-suche input { border:none; background:none; outline:none; flex:1; min-width:0; font:inherit; font-size:14.5px; padding:0; height:100%; }
.cl-zeilen { flex:1; min-height:0; overflow-y:auto; }
.cl-zeile { display:flex; align-items:center; gap:12px; padding:10px 14px; color:inherit; text-decoration:none; border-bottom:1px solid #f2f2f2; }
.cl-zeile:hover { background:#f7f7f7; text-decoration:none; }
.cl-zeile.an { background:#efefef; }
.cl-av { width:44px !important; height:44px !important; font-size:15px; flex:none; }
.cl-av.klein { width:32px !important; height:32px !important; font-size:12px; }
.cl-av.gross { width:56px !important; height:56px !important; font-size:18px; }
.cl-gruppe { display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background:#1b1b1b; color:#fff; }
.cl-gruppe svg { width:55%; height:55%; }
.cl-mitte { flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.cl-oben, .cl-unten { display:flex; align-items:center; gap:8px; min-width:0; }
.cl-oben b { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:15px; font-weight:600; }
.cl-zeit { font-size:12px; color:#777; flex:none; }
.cl-zeit.neu { color:var(--rot); font-weight:600; }
.cl-vorschau { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13.5px; color:#666; }
.cl-zahl { flex:none; min-width:20px; height:20px; padding:0 6px; border-radius:10px; background:var(--rot); color:#fff; font-size:12px; display:inline-flex; align-items:center; justify-content:center; }
.cl-chat { display:flex; flex-direction:column; min-height:0; background:#fff; }
.cl-leer { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; color:#888; }
.cl-chat-kopf { flex:none; display:flex; align-items:center; gap:12px; padding:10px 12px; border-bottom:1px solid #e3e3e3; }
.cl-zurueck { display:none; }
.cl-titel { flex:1; min-width:0; display:flex; flex-direction:column; align-items:flex-start; background:none; border:none; padding:0; cursor:pointer; font:inherit; text-align:left; color:inherit; }
.cl-titel b { font-size:16px; }
.cl-titel span { font-size:13px; color:#666; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }
.cl-verlauf { flex:1 1 auto; min-height:0; }
.cl-verlauf .ch-reiter { border-bottom:none; justify-content:flex-end; padding-top:6px; }
.cl-verlauf .ch-unten { border-radius:0; }
.cl-personen { max-height:50vh; overflow-y:auto; display:flex; flex-direction:column; }
.cl-person { display:flex; align-items:center; gap:10px; padding:8px 6px; border-radius:8px; cursor:pointer; background:none; border:none; font:inherit; color:inherit; text-align:left; width:100%; }
.cl-person:hover { background:#f4f4f4; }
.cl-person > span:not(.cl-av):not(.marke) { flex:1; }
.cl-person input { margin:0; }
.cl-neue-gruppe { margin-bottom:8px; font-weight:600; }
.cl-feld { display:flex; flex-direction:column; gap:4px; margin-bottom:10px; }
.cl-info-kopf { display:flex; align-items:center; gap:14px; margin-bottom:12px; }
.cl-info-kopf h2 { margin:0 0 2px; }
.cl-beschreibung { margin:0 0 12px; white-space:pre-wrap; }
.cl-info-titel { display:flex; align-items:center; justify-content:space-between; margin:6px 0 4px; }
.ch-links .ch-link { display:flex; align-items:center; gap:10px; padding:10px 6px; border-bottom:1px solid #f0f0f0; }
.ch-link a { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ch-link > span { font-size:12.5px; color:#777; flex:none; }
@media (max-width:760px) {
  .cl { grid-template-columns:1fr; border:none; border-radius:0; }
  .cl.mit-chat .cl-liste { display:none; }
  .cl:not(.mit-chat) .cl-chat { display:none; }
  .cl-zurueck { display:inline-flex; }
  .ch-link > span { display:none; }
}
@media (max-width:1100px) {
  .cl { flex:none; height:calc(100dvh - 90px); }
}
@media (max-width:760px) {
  .cl { position:fixed; left:0; right:0; bottom:0; top:57px; height:auto; z-index:5; }
}
.cl-liste, .cl-chat { min-width:0; }
.ch-sprache { display:flex; flex-direction:column; gap:4px; margin:2px 0 4px; }
.ch-sprache audio { width:260px; max-width:100%; height:40px; }
.ch-transkript { font-size:13.5px; color:#444; line-height:1.45; border-left:2px solid #ccc; padding-left:8px; max-width:320px; }
.ch-video { position:relative; display:flex; align-items:center; justify-content:center; width:240px; min-height:140px; max-height:300px; padding:0; border:none; border-radius:6px; margin:2px 0 4px; background:#222; overflow:hidden; cursor:pointer; }
.ch-video img { display:block; width:100%; max-height:300px; object-fit:cover; }
.ch-play { position:absolute; inset:0; margin:auto; width:52px; height:52px; border-radius:50%; background:rgba(0,0,0,.55); color:#fff; display:flex; align-items:center; justify-content:center; padding-left:3px; }
.ch-play svg { fill:#fff; stroke:none; }
.ch-video:hover .ch-play { background:rgba(0,0,0,.75); }
.ch-eingabe.mit-mikro:not(.hat-text) .ch-senden { display:none; }
.ch-eingabe.hat-text .ch-mikro { display:none; }
.ch-aufnahme { display:flex; align-items:center; gap:10px; padding:12px; }
.ch-aufnahme > .pa-knopf { height:42px; width:42px; padding:0; flex:none; }
.ch-auf-punkt { width:10px; height:10px; border-radius:50%; background:var(--rot); animation:chPuls 1s infinite; flex:none; }
@keyframes chPuls { 50% { opacity:.3; } }
.ch-auf-text { flex:1; min-width:0; color:#666; font-size:13.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.md .md-luecke { height:.5em; min-height:0; }
.md .md-zitat { border-left:3px solid #bbb; padding-left:8px; color:#555; }
.md .md-code { background:rgba(0,0,0,.06); border-radius:6px; padding:8px 10px; margin:4px 0; font-size:13px; white-space:pre-wrap; overflow-wrap:anywhere; font-family:ui-monospace, Menlo, monospace; }
.md .md-linie { border:none; border-top:1px solid #ccc; margin:6px 0; }
.md ul.md-todo { list-style:none; padding-left:2px; }
.md-todo li { display:flex; align-items:flex-start; gap:8px; }
.md-todo li.erledigt > span:last-child { color:#888; text-decoration:line-through; }
.md-kasten { flex:none; width:16px; height:16px; margin-top:2px; border:1.6px solid #888; border-radius:4px; background:#fff; padding:0; cursor:default; display:inline-flex; align-items:center; justify-content:center; }
button.md-kasten { cursor:pointer; }
button.md-kasten:hover { border-color:#111; }
.md-kasten.an { background:var(--rot); border-color:var(--rot); }
.md-kasten.an::after { content:''; width:8px; height:4px; border:2px solid #fff; border-top:none; border-right:none; transform:rotate(-45deg) translate(1px,-1px); }
.cl-pins { display:flex; justify-content:center; gap:6px; padding:2px 10px 10px; border-bottom:1px solid #eee; }
.cl-pins > .cl-pin { flex:0 1 25%; }
.cl-pin.zieht { opacity:.4; }
.cl-pin[draggable] { cursor:grab; }
.cl-pins[hidden] { display:none; }
.cl-pin { display:flex; flex-direction:column; align-items:center; gap:5px; padding:8px 4px; border-radius:10px; color:inherit; text-decoration:none; min-width:0; }
.cl-pin:hover { background:#f4f4f4; text-decoration:none; }
.cl-pin.an { background:#efefef; }
.cl-pin-bild { position:relative; }
.cl-pin-bild .cl-zahl { position:absolute; top:-4px; right:-6px; border:2px solid #fff; }
.cl-pin-name { font-size:12.5px; font-weight:500; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
img.cl-av { object-fit:cover; border-radius:50%; }
.cl-bild-wahl { background:none; border:none; padding:0; cursor:pointer; border-radius:50%; flex:none; }
.cl-bild-wahl:hover { opacity:.85; }
.cl-neu-kopf { display:flex; gap:14px; align-items:flex-start; margin-bottom:6px; }
.cl-neu-felder { flex:1; min-width:0; }
.cl-feld textarea { resize:none; font:inherit; }
.md-feld { position:relative; outline:none; overflow-wrap:anywhere; cursor:text; }
.md-feld.md-leer::before { content:attr(data-platzhalter); color:#999; pointer-events:none; position:absolute; top:var(--md-oben, auto); left:var(--md-links, auto); }
.ch-editor { --md-oben:10px; --md-links:12px; }
.md-feld > div { min-height:1.45em; }
.md-feld > .ed-li, .md-feld > .ed-ol { position:relative; padding-left:22px; }
.md-feld > .ed-li::before { content:'•'; position:absolute; left:7px; }
.md-feld { counter-reset:mdnr; }
.md-feld > :not(.ed-ol) { counter-reset:mdnr; }
.md-feld > .ed-ol { counter-increment:mdnr; }
.md-feld > .ed-ol::before { content:counter(mdnr) '.'; position:absolute; left:2px; font-variant-numeric:tabular-nums; }
.md-feld > .ed-todo { position:relative; padding-left:26px; }
.md-feld > .ed-todo::before { content:''; position:absolute; left:2px; top:.2em; width:15px; height:15px; border:1.6px solid #888; border-radius:4px; background:#fff; box-sizing:border-box; cursor:pointer; }
.md-feld > .ed-todo.an::before { background:var(--rot); border-color:var(--rot); }
.md-feld > .ed-todo.an::after { content:''; position:absolute; left:6.5px; top:calc(.2em + 3.5px); width:7px; height:3.5px; border:2px solid #fff; border-top:none; border-right:none; transform:rotate(-45deg); pointer-events:none; }
.md-feld > .ed-todo.an { color:#888; text-decoration:line-through; }
.md-feld > .ed-zitat { border-left:3px solid #bbb; padding-left:10px; color:#555; }
.md-eingabe { width:100%; box-sizing:border-box; min-height:58px; padding:8px 10px; border:1px solid #cfcfcf; border-radius:6px; background:#fff; line-height:1.45; color:var(--schwarz); }
.md-eingabe:focus { border-color:#999; }
.md-feld.ch-editor { min-height:42px; box-sizing:border-box; }
main.chat-seite { padding:8px 10px 10px; }
.cl-verlauf .ch-n { max-width:72%; }
.cl-verlauf .ch-bild { max-width:min(440px, 100%); max-height:440px; }
.cl-verlauf .ch-video { width:min(340px, 100%); max-height:400px; }
.cl-verlauf .ch-video img { max-height:400px; }
a.ch-projekt { display:inline-block; background:#fdecec; color:var(--rot); border-radius:6px; padding:0 6px; font-weight:500; text-decoration:none; }
a.ch-projekt:hover { background:#fbd9d9; text-decoration:none; }
.ch-marke.ch-projekt { background:#fdecec; color:var(--rot); }
.ch-wartend { display:flex; gap:8px; padding:10px 12px 0; flex-wrap:wrap; }
.ch-w { position:relative; width:84px; height:84px; border-radius:8px; overflow:hidden; background:#fff; border:1px solid #ddd; flex:none; }
.ch-w img { width:100%; height:100%; object-fit:cover; display:block; }
.ch-w-datei { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; height:100%; padding:6px; font-size:11px; text-align:center; overflow:hidden; }
.ch-w-datei span { overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-break:break-all; }
.ch-w button { position:absolute; top:4px; right:4px; width:22px; height:22px; border-radius:50%; border:none; background:rgba(0,0,0,.6); color:#fff; font-size:11px; cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0; }
.ch-antwort.bearbeiten div { border-left-color:var(--rot); }
.ch-bearbeitet { font-style:italic; margin-right:4px; }
.ch-blase { position:relative; }
.ch-n:has(.ch-reakt) { margin-bottom:12px; }
.ch-reakt { position:absolute; left:8px; bottom:-14px; display:flex; gap:3px; }
.ch-reakt button { display:inline-flex; align-items:center; gap:3px; height:24px; padding:0 7px; border-radius:12px; border:1px solid #e2e2e2; background:#fff; font-size:13px; cursor:pointer; box-shadow:0 1px 2px rgba(0,0,0,.08); }
.ch-reakt button span { font-size:11.5px; color:#555; }
.ch-reakt button.meins { border-color:var(--rot); background:#fdf2f2; }
.ch-emoji-wahl { position:fixed; z-index:80; display:flex; gap:4px; padding:6px 8px; background:#fff; border-radius:30px; box-shadow:0 6px 22px rgba(0,0,0,.18); }
.ch-emoji-wahl button { width:46px; height:46px; border:none; background:none; border-radius:50%; font-size:28px; cursor:pointer; }
.ch-emoji-wahl button:hover { background:#f2f2f2; transform:scale(1.12); }
.ch-pfeil { position:absolute; top:4px; right:4px; width:26px; height:24px; border:none; border-radius:6px; padding:0; display:flex; align-items:center; justify-content:center; background:linear-gradient(to left, #f1f1f1 60%, rgba(241,241,241,0)); color:#555; cursor:pointer; opacity:0; transition:opacity .1s; z-index:2; }
.ch-n.ich .ch-pfeil { background:linear-gradient(to left, #fdecec 60%, rgba(253,236,236,0)); }
.ch-n:hover .ch-pfeil, .ch-pfeil:focus { opacity:1; }
.ch-pfeil:hover { color:#111; }
.ch-smiley { align-self:center; flex:none; width:32px; height:32px; border:none; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.15); color:#666; cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0; opacity:0; transition:opacity .1s; }
.ch-n:hover .ch-smiley, .ch-smiley:focus { opacity:1; }
.ch-smiley:hover { color:#111; }
.ch-weiter { display:flex; align-items:center; gap:4px; font-size:12.5px; font-style:italic; color:#777; margin-bottom:3px; }
.ch-weiter svg { width:13px; height:13px; }
.ch-quelle { display:flex; align-items:center; gap:6px; margin:2px 0 6px; padding:6px 10px; border:1px solid #e3e3e3; border-radius:8px; background:#fff; color:#111; text-decoration:none; font-size:13px; max-width:100%; }
.ch-quelle:hover { border-color:#999; text-decoration:none; }
.ch-quelle span { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:500; }
.ch-quelle em { font-style:normal; color:#777; font-weight:400; margin-left:4px; }
.ch-quelle svg { flex:none; color:#666; }
.ch-n.ich .ch-quelle { background:rgba(255,255,255,.75); }
.ch-weg-ganz { border:none; background:none; padding:0 0 0 8px; color:#999; cursor:pointer; vertical-align:middle; }
.ch-weg-ganz:hover { color:var(--rot); }
.ch-sprache .sprache { width:254px; max-width:100%; display:flex; align-items:center; gap:10px; padding:2px 0; }
.sp-block { flex:1; min-width:0; }
.sp-reihe { display:flex; align-items:center; gap:6px; }
.sp-play { width:32px; height:32px; flex:none; border-radius:50%; border:none; background:none; color:#555; display:flex; align-items:center; justify-content:center; padding:0; cursor:pointer; }
.sp-play .ic, .sp-play svg { width:26px; height:26px; }
.sp-play svg:last-child, .sprache.spielt .sp-play svg:first-child { display:none; }
.sprache.spielt .sp-play svg:last-child { display:block; }
.sp-mitte { flex:1; min-width:0; }
.sp-welle { display:flex; align-items:center; gap:2px; height:28px; cursor:pointer; }
.sp-welle i { flex:1; min-height:3px; border-radius:2px; background:#c4c4c4; }
.sp-welle i.an { background:var(--rot, #e40000); }
.sp-fuss { display:flex; justify-content:space-between; align-items:center; gap:6px; margin-top:-3px; padding-left:38px; font-size:11.5px; line-height:1.2; color:#888; font-variant-numeric:tabular-nums; }
.sp-uhr { display:inline-flex; align-items:center; gap:4px; }
.sp-seite { position:relative; width:38px; height:38px; flex:none; display:flex; align-items:center; justify-content:center; }
.sp-seite .sp-av { width:38px !important; height:38px !important; border-radius:50%; font-size:13px; display:flex; align-items:center; justify-content:center; object-fit:cover; }
.sp-mikro { position:absolute; right:-3px; bottom:-2px; width:16px; height:16px; border-radius:50%; background:#fff; color:#e40000; display:flex; align-items:center; justify-content:center; box-shadow:0 1px 2px rgba(0,0,0,.2); }
.sp-mikro svg { width:10px; height:10px; }
.sp-tempo { display:none; border:none; background:rgba(0,0,0,.55); color:#fff; border-radius:13px; font-size:12px; font-weight:600; padding:4px 8px; cursor:pointer; }
.sprache.spielt .sp-seite .sp-av, .sprache.spielt .sp-mikro { display:none; }
.sprache.spielt .sp-tempo { display:block; }
.pa-chat .ch-unten, .cl-verlauf .ch-unten { background:#fff; border-top:1px solid var(--linie); }
main.chat-seite { padding-bottom:10px; }
.auswahl-eintrag.aus { color:#b5b5b5; cursor:default; }
.auswahl-eintrag.aus.aktiv { background:none; }
.ds-kopf { display:flex; align-items:center; gap:12px; padding-bottom:14px; margin-bottom:16px; border-bottom:1px solid #eee; }
.ds-kopf h2 { margin:0; font-size:20px; }
.ds-kopf .rechts { margin-left:auto; }
.icon-knopf.ohne-rand { border-color:transparent; background:none; }
.avatar-kreis.klein { width:28px; height:28px; font-size:11px; }
dialog .leiste > [data-zu].icon-knopf { margin-left:auto; }
dialog .leiste:has(> [data-zu].icon-knopf) > h2 { flex:1; }
.auswahl-liste { border:1px solid #ececec; border-radius:14px; box-shadow:0 18px 44px rgba(0,0,0,.18); padding:8px; }
.auswahl-eintrag { padding:9px 10px; border-radius:10px; font-size:14.5px; align-items:center; }
.auswahl-eintrag.aktiv { background:#f4f4f4; }
.auswahl-eintrag.gewaehlt { color:#111; font-weight:600; }
.auswahl-eintrag.gewaehlt::after { content:'✓'; color:var(--rot); font-weight:700; margin-left:auto; }
.auswahl-eintraege { max-height:320px; }
.ch-strom { margin-right:auto; align-self:center; margin-left:4px; }
.ch-reiter:has(.ch-strom) { padding:6px 0; }
.ch-sys { display:flex; align-items:flex-start; gap:8px; margin:4px 36px; font-size:12.5px; color:#6b6b6b; line-height:1.45; }
.ch-sys > span:last-child { min-width:0; }
.ch-sys b { color:#333; font-weight:600; }
.ch-sys em { font-style:normal; color:#9a9a9a; margin-left:6px; white-space:nowrap; }
.ch-nur-lesen { padding:12px 14px; margin:6px 10px 10px; border-radius:10px; background:#f3f3f3; color:#666; font-size:13.5px; text-align:center; }
.pa-chat { position:relative; }
.ch-reiter.ch-pkopf { padding:4px 0 0 !important; }
.ch-pkopf .ch-strom { margin:0 0 0 auto; }
.ch-pkopf .ch-strom button { padding:3px 10px; font-size:12.5px; }
.ch-pkopf .ch-strom:not([hidden]) ~ .ch-filter { position:absolute; right:14px; top:56px; z-index:4; margin:0; background:rgba(255,255,255,.92); backdrop-filter:blur(6px); box-shadow:0 2px 10px rgba(0,0,0,.08); border-radius:18px; height:32px; padding:0 12px; }
.ch-pkopf .ch-filter { margin-bottom:0; }
a.ch-dokverweis { display:inline-flex; align-items:center; gap:5px; background:#f1f1f1; color:#222; padding:2px 8px; }
a.ch-dokverweis:hover { background:#e8e8e8; }
.ch-haken { display:inline-flex; color:#999; margin-left:1px; }
.ch-haken .ic { width:15px; height:15px; }
.ch-haken.gelesen { color:var(--rot); }
.cl-online { position:relative; display:inline-flex; flex:none; }
.cl-online.an::after { content:''; position:absolute; right:0; bottom:0; width:11px; height:11px; border-radius:50%; background:var(--rot); border:2px solid #fff; box-sizing:border-box; }
.cl-titel span.tippt { color:var(--rot); }
.ch-tippt { padding:6px 16px 0; font-size:12.5px; color:var(--grau); font-style:italic; }
.ch-angeheftet { display:flex; align-items:center; gap:10px; padding:8px 16px; cursor:pointer; max-height:none; overflow:hidden; background:#fff; }
.ch-angeheftet[hidden] { display:none; }
.ch-angeheftet:hover { background:#fafafa; }
.ch-angeheftet > .ic { color:var(--grau); flex:none; }
.ch-pl-text { min-width:0; display:flex; flex-direction:column; font-size:13px; }
.ch-pl-text b { font-size:12px; font-weight:600; color:#444; }
.ch-pl-text span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#333; }
.ch-umfrage { min-width:260px; max-width:380px; padding:2px 0 2px; }
.ch-umfrage .u-frage { font-weight:600; font-size:14.5px; margin-bottom:2px; }
.ch-umfrage .u-art { font-size:12px; color:var(--grau); margin-bottom:4px; }
.ch-umfrage .u-opt { display:flex; align-items:flex-start; gap:10px; width:100%; padding:6px 0; background:none; border:none; font:inherit; color:inherit; text-align:left; cursor:pointer; border-radius:0; }
.ch-umfrage .u-kreis { width:18px; height:18px; border-radius:50%; border:1.5px solid #aaa; flex:none; display:flex; align-items:center; justify-content:center; margin-top:1px; background:#fff; }
.ch-umfrage .u-opt.mehr .u-kreis { border-radius:4px; }
.ch-umfrage .u-opt.an .u-kreis { background:#111; border-color:#111; color:#fff; }
.ch-umfrage .u-kreis .ic { width:12px; height:12px; }
.ch-umfrage .u-opt:hover .u-kreis { border-color:#111; }
.ch-umfrage .u-mitte { flex:1; min-width:0; }
.ch-umfrage .u-zeile { display:flex; justify-content:space-between; gap:8px; font-size:14px; }
.ch-umfrage .u-zeile b { font-weight:600; font-size:13px; }
.ch-umfrage .u-balken { display:block; height:4px; border-radius:2px; background:#d6d6d6; margin-top:5px; overflow:hidden; }
.ch-umfrage .u-balken i { display:block; height:100%; background:#111; border-radius:2px; transition:width .2s; }
.ch-umfrage .u-stimmen { display:block; width:100%; margin-top:4px; padding:7px 0 0; border:none; border-top:1px solid #d6d6d6; border-radius:0; background:none; color:#111; font:inherit; font-size:13px; font-weight:500; cursor:pointer; }
.ch-umfrage .u-stimmen:hover { text-decoration:underline; }
.ch-info-titel { display:flex; align-items:center; gap:6px; font-size:12.5px; font-weight:600; color:var(--grau); margin:14px 0 6px; }
.ch-info-titel .ic { width:15px; height:15px; }
.ch-info-zeile { display:flex; align-items:center; gap:10px; padding:5px 0; font-size:14px; }
.ch-info-leer { padding:2px 0 6px; }
.ch-info-vorschau { background:#f2f2f2; border-radius:8px; padding:8px 12px; font-size:13.5px; color:#333; }
.ch-u-eingaben { display:flex; flex-direction:column; gap:8px; }
.ch-u-eingaben input { width:100%; box-sizing:border-box; }
.ch-u-mehr { display:flex; align-items:center; gap:8px; margin:14px 0 16px; font-size:14px; cursor:pointer; }
.ch-suche { position:absolute; left:0; right:0; z-index:20; padding:10px 14px 0; background:#fff; border-bottom:1px solid #e5e5e5; box-shadow:0 8px 18px rgba(0,0,0,.06); }
.ch-suche[hidden] { display:none; }
.ch-suche .ch-suchfeld { flex:none; width:100%; min-width:0; margin-bottom:10px; }
.ch-suche .ch-suchfeld input { width:100%; font-size:15px; }
.ch-suche-treffer { max-height:320px; overflow:auto; margin:0 -14px; }
.ch-suche-treffer:empty { display:none; }
.ch-suche-z { display:flex; flex-direction:column; align-items:flex-start; gap:3px; width:100%; text-align:left; border:0; border-top:1px solid #eee; border-radius:0; background:#fff; padding:10px 14px; font-size:14px; }
.ch-suche-z:hover { background:#fafafa; }
.ch-suche-z mark { background:#ffe7a3; color:inherit; padding:0 1px; border-radius:2px; }
.ch-gefunden .ch-blase { box-shadow:0 0 0 2px var(--rot); transition:box-shadow .3s; }
button.icon-knopf.gefahr { background:#fff; border-color:var(--linie, #e5e5e5); color:var(--rot); filter:none; }
button.icon-knopf.gefahr.ohne-rand { border-color:transparent; background:none; }
button.icon-knopf.gefahr:hover { background:#fdf0f0; border-color:#f1c4c4; filter:none; }
.ch-suchfeld input::-webkit-search-cancel-button { -webkit-appearance:none; appearance:none; }
.ch-sys a { color:var(--schwarz); text-decoration:none; }
.ch-sys a:hover { text-decoration:underline; }
/* Anpassungen an Bierimmobilien: Reaktionen sind Linien-Icons, Seite füllt den Platz neben der Navigation */
main.chat-seite { height:100vh; }
.ch-reakt button svg, .ch-emoji-wahl button svg { display:block; }
.ch-reakt button { display:inline-flex; align-items:center; gap:4px; color:#333; }
.ch-emoji-wahl button { display:inline-flex; align-items:center; justify-content:center; color:#222; }
.ch-emoji-wahl button svg { width:22px; height:22px; }
dialog.klein .cl-suche input:not([type=checkbox]) { border:none; background:none; padding:0; border-radius:0; }
dialog.klein h2 { margin:0 0 12px; font-size:19px; }
/* ---------- Ende Chat ---------- */

/* Nebenkosten-Korrekturen (Dom 13.11.2026): feste Spalten bei „Einheiten prüfen“, Abstand zwischen Feldreihen, Schritt-Namen dürfen umbrechen */
.nk-tab-fest { table-layout:fixed; } .nk-tab-fest td, .nk-tab-fest th { overflow:hidden; text-overflow:ellipsis; } .nk-tab-fest .nk-ein { width:100%; }
.nk-felder { padding:0 16px 16px; display:flex; flex-direction:column; gap:10px; }
.nk-rahmen { grid-template-columns:236px minmax(0,1fr); } .nk-schritt > span:last-child { min-width:0; overflow-wrap:anywhere; line-height:1.25; }
.nk-block { scrollbar-width:thin; }

/* Mietverhältnisse je Einheit (public/bestand.js, Dom 13.11.2026) */
.eb-kacheln { display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:10px; margin-bottom:14px; }
.eb-kachel { background:#fafafa; border:1px solid var(--linie-t); border-radius:10px; padding:10px 12px; display:flex; flex-direction:column; gap:2px; min-width:0; }
.eb-kachel small { color:#555; font-size:12.5px; } .eb-kachel b { font-size:18px; font-weight:700; white-space:nowrap; font-variant-numeric:tabular-nums; } .eb-kachel > span { color:var(--grau); font-size:12.5px; }
.bs-kacheln { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:12px; margin-bottom:14px; flex:none; }
button.bs-kachel { display:flex; align-items:center; gap:12px; height:auto; min-height:64px; padding:10px 16px; text-align:left; background:#fff; border:1px solid var(--linie); border-radius:12px; cursor:pointer; }
button.bs-kachel:hover { border-color:#111; background:#fff; } button.bs-kachel.an { border-color:var(--rot); background:#fdf3f2; box-shadow:inset 0 0 0 1px var(--rot); }
.bs-icon { width:36px; height:36px; flex:none; border-radius:9px; background:#f3f3f1; display:grid; place-items:center; color:#333; } .bs-kachel.an .bs-icon { background:#fff; color:var(--rot); }
.bs-kachel b { display:block; font-size:21px; font-weight:700; line-height:1.15; } .bs-kachel small { color:var(--grau); font-size:12.5px; font-weight:500; }
button.bs-chip { height:37px; border-radius:999px; padding:0 14px; font-size:13.5px; font-weight:500; color:#555; background:#fff; border:1px solid var(--rahmen); } button.bs-chip b { margin-left:4px; color:#111; } button.bs-chip.an { border-color:var(--rot); color:var(--rot); background:#fdf3f2; }
.bs-haken { display:inline-flex; align-items:center; gap:8px; font-size:14px; margin-left:auto; cursor:pointer; white-space:nowrap; } .bs-haken input.schalter { border-radius:50%; }
.bs-tab td { white-space:nowrap; } .bs-tab td:first-child, .bs-tab td:nth-child(3) { white-space:normal; } .bs-hw { font-weight:600; } .bs-name { color:#444; }
.bs-tab tr.bs-alt td { color:#8a8a8a; background:#fbfbfb; } .tabelle .bs-tab tr.bs-summe td { position:sticky; bottom:0; background:#fff; border-top:1px solid var(--linie); border-bottom:none; height:58px; z-index:1; }
@media (max-width:1100px) { .bs-kacheln { grid-template-columns:repeat(2, minmax(0, 1fr)); } }
/* Portfolio (public/portfolio.js, Dom 13.11.2026) – vordere Reiter der Auswertung: Überblick, Portfolio, Mieteingang, Offene Posten, Objekte, Karte; nutzt .dl-* und .aw-* */
.pf-eig { min-width:220px; } .kopf button[data-export] { display:inline-flex; align-items:center; gap:6px; }
.pf-marken { display:flex; flex-wrap:wrap; gap:8px; } .pf-marken span, .pf-summen span { background:#fff; border:1px solid var(--linie); border-radius:999px; padding:5px 13px; font-size:13.5px; color:#555; white-space:nowrap; }
.pf-marken b, .pf-summen b { color:#111; font-weight:600; font-variant-numeric:tabular-nums; } .pf-marken span.rot, .pf-marken span.rot b, .pf-summen span.rot, .pf-summen span.rot b { color:var(--ampelrot); }
.pf-kartenkopf { display:flex; align-items:flex-start; gap:12px; } .pf-kartenkopf > div { flex:1; min-width:0; } .pf-kartenkopf button { display:inline-flex; align-items:center; gap:6px; flex:none; }
.pf-heute { display:flex; align-items:center; gap:12px; padding:11px 0; border-top:1px solid var(--linie-t); font-size:14.5px; } .pf-heute:first-of-type { border-top:none; }
.pf-heute > div { flex:1; min-width:0; } .pf-heute > div b { display:block; font-weight:500; } .pf-heute small { color:var(--grau); font-size:13px; } .pf-heute[href]:hover > div b { text-decoration:underline; }
.pf-heute > span { font-weight:600; white-space:nowrap; font-variant-numeric:tabular-nums; } .pf-heute > svg { color:#999; flex:none; }
.pf-zahl { flex:none; min-width:36px; height:36px; padding:0 8px; border-radius:9px; background:#f3f3f3; display:grid; place-items:center; font-weight:700; font-size:15px; font-variant-numeric:tabular-nums; }
.pf-risiko { display:flex; align-items:flex-start; gap:14px; padding:11px 0; border-top:1px solid var(--linie-t); font-size:14.5px; } .pf-risiko:first-of-type { border-top:none; }
.pf-risiko > div { flex:1; min-width:0; } .pf-risiko > div b { display:block; font-weight:500; } .pf-risiko small { color:var(--grau); font-size:13px; } .pf-risiko small a { text-decoration:underline; }
.pf-risiko > span { font-weight:600; font-size:16px; white-space:nowrap; font-variant-numeric:tabular-nums; }
.pf-breit { display:grid; grid-template-columns:minmax(0, 3fr) minmax(0, 2fr); gap:18px; align-items:start; } .pf-breit .dl-teile { margin:0 0 8px; }
.pf-ziel { stroke:#9a9a9a; stroke-width:1.2; stroke-dasharray:5 4; } .pf-quote-linie { fill:none; stroke:#111; stroke-width:2; stroke-linejoin:round; } .pf-quote-hof { fill:none; stroke:#fff; stroke-width:5; stroke-linejoin:round; opacity:.85; } .pf-ring text { pointer-events:none; }
.dl-legende i.pf-leg-linie { height:2px; width:16px; background:#111; border-radius:0; vertical-align:middle; } .dl-legende i.pf-leg-ziel { height:0; width:16px; border-top:2px dashed #9a9a9a; border-radius:0; vertical-align:middle; }
.pf-objekt { display:block; padding:10px 0; border-top:1px solid var(--linie-t); } .pf-objekt:first-of-type { border-top:none; } .pf-objekt > div:first-child { display:flex; justify-content:space-between; gap:10px; font-size:14.5px; }
.pf-objekt b { font-weight:500; } .pf-objekt:hover b { text-decoration:underline; } .pf-objekt span { white-space:nowrap; font-variant-numeric:tabular-nums; } .pf-objekt .aw-balken { margin:6px 0 4px; } .pf-objekt small { color:var(--grau); font-size:13px; }
.dl-kacheln.pf-fuenf { grid-template-columns:repeat(5, minmax(0, 1fr)); } .pf-fuenf .dl-kz { font-size:21px; white-space:nowrap; }
.pf-drei { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:18px; } [data-ring1], [data-ring2], [data-balken] { position:relative; }
.pf-ring { display:flex; align-items:center; gap:18px; margin-top:6px; } .pf-ring svg { width:150px; height:150px; flex:none; } .pf-ring-zahl { font-size:23px; font-weight:700; fill:#111; } .pf-ring-unter { font-size:11.5px; fill:#777; }
.pf-ring-leg { flex:1; min-width:0; display:flex; flex-direction:column; gap:9px; font-size:14px; } .pf-ring-leg div { display:flex; align-items:center; gap:8px; } .pf-ring-leg i { width:10px; height:10px; border-radius:2px; flex:none; }
.pf-ring-leg span { flex:1; color:#555; } .pf-ring-leg b { font-weight:600; font-variant-numeric:tabular-nums; }
.pf-balkenzeile { display:grid; grid-template-columns:230px minmax(0, 1fr) 120px; gap:14px; align-items:center; padding:8px 0; font-size:14.5px; border-top:1px solid var(--linie-t); } .pf-balkenzeile:first-of-type { border-top:none; }
.pf-balkenzeile span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .pf-balkenzeile:hover span { text-decoration:underline; } .pf-balkenzeile > div { height:14px; background:#f1f1f1; border-radius:4px; overflow:hidden; }
.pf-balkenzeile i { display:block; height:100%; background:#111; border-radius:4px; } .pf-balkenzeile b { text-align:right; font-weight:600; white-space:nowrap; font-variant-numeric:tabular-nums; }
.pf-hnr { display:inline-grid; place-items:center; min-width:36px; height:24px; padding:0 6px; border-radius:6px; background:#f1f1f1; font-size:12px; font-weight:600; color:#333; margin-right:9px; vertical-align:middle; flex:none; }
.pf-eingang table { table-layout:fixed; } .pf-eingang th, .pf-eingang td { padding-left:4px; padding-right:4px; } .pf-eingang th:first-child, .pf-eingang td:first-child { padding-left:18px; }
.pf-eingang th.zahl { width:66px; text-align:center; } .pf-eingang th:last-child { width:124px; text-align:right; padding-right:18px; } .pf-eingang td:last-child { padding-right:18px; } .pf-eingang .dl-summe td.zahl:not(:last-child) { text-align:center; font-size:13px; }
.pf-eingang th.heute { background:#111; color:#fff; } .pf-eingang td.heute { box-shadow:inset 1px 0 0 #cfcfcf, inset -1px 0 0 #cfcfcf; }
.pf-haus { cursor:pointer; white-space:normal; overflow:hidden; line-height:1.25; font-size:13.5px; } .pf-haus:hover span:last-child { text-decoration:underline; }
.pf-z { text-align:center; cursor:pointer; line-height:1.25; } .pf-z b { display:block; font-weight:600; font-size:13px; white-space:nowrap; } .pf-z small { display:block; font-size:11px; white-space:nowrap; }
.pf-z.bezahlt b { font-weight:500; color:#333; } .pf-z.bezahlt small { color:var(--gruen); } .pf-z.bezahlt svg { vertical-align:-1px; margin-right:2px; stroke-width:2.6; }
.pf-z.teil { background:#fdf3e4; } .pf-z.teil b, .pf-z.teil small { color:#8f5200; } .pf-z.offen { background:#fdecea; } .pf-z.offen b, .pf-z.offen small { color:var(--ampelrot); }
.pf-z.nichts { cursor:default; color:#bbb; } .pf-z[data-z]:hover { box-shadow:inset 0 0 0 1.5px #111; }
.pf-summen { flex-wrap:wrap; justify-content:flex-end; } .pf-legende { display:flex; gap:18px; flex-wrap:wrap; font-size:13px; color:#555; }
.pf-legende i { display:inline-block; width:12px; height:12px; border-radius:3px; margin-right:6px; vertical-align:-1px; border:1px solid var(--rahmen); background:#fff; } .pf-legende i.teil { background:#fdf3e4; } .pf-legende i.offen { background:#fdecea; }
.pf-ok { color:var(--gruen); } .aw-mini tr.pf-fuss td { font-weight:600; border-top:1px solid var(--linie); }
.pf-leiste { display:flex; align-items:center; gap:10px; flex-wrap:wrap; } .pf-leiste .suchfeld { flex:1 1 320px; max-width:420px; } .pf-leiste > button { margin-left:auto; } .pf-leiste > .pf-eig { margin-left:auto; }
.pf-posten { display:flex; flex-direction:column; gap:12px; } .pf-gruppe { padding:0; overflow:hidden; }
.pf-gruppe summary { display:flex; align-items:center; gap:12px; padding:14px 18px; cursor:pointer; list-style:none; } .pf-gruppe summary::-webkit-details-marker { display:none; }
.pf-gruppe summary > div { flex:1; min-width:0; } .pf-gruppe summary b { display:block; font-weight:600; font-size:15.5px; } .pf-gruppe summary small { color:var(--grau); font-size:13px; }
.pf-gn { font-size:13px; color:#555; white-space:nowrap; } .pf-gb { font-size:16px; white-space:nowrap; min-width:120px; text-align:right; font-variant-numeric:tabular-nums; }
.pf-auf { color:#888; flex:none; transition:transform .15s; } .pf-gruppe[open] .pf-auf { transform:rotate(180deg); }
.pf-gruppe table { border-top:1px solid var(--linie); } .pf-gruppe .aw-mini th { background:#fafafa; padding-top:9px; } .pf-gruppe .aw-mini th:first-child, .pf-gruppe .aw-mini td:first-child { padding-left:18px; }
.pf-gruppe .aw-mini .zahl { padding-right:18px; } .pf-gruppe .aw-mini td { vertical-align:middle; }
.pf-sort { border:none; background:none; height:auto; padding:0; font:inherit; letter-spacing:inherit; text-transform:inherit; color:inherit; display:inline-flex; align-items:center; gap:3px; } .pf-sort:hover { background:none; color:#111; }
.pf-sort svg { opacity:.35; } .pf-sort.an { color:#111; } .pf-sort.an svg { opacity:1; }
.pf-objekte { display:grid; grid-template-columns:210px minmax(0, 1fr); gap:18px; align-items:start; } .pf-objekte > div:last-child { display:flex; flex-direction:column; gap:14px; }
.pf-filter { padding:14px 10px; } .dl-seite .pf-filter h3 { font-size:11.5px; text-transform:uppercase; letter-spacing:.04em; color:#666; margin:0 8px 6px; }
.pf-filter button { display:flex; width:100%; align-items:center; gap:8px; border:none; background:none; height:auto; padding:8px; border-radius:8px; font-size:14.5px; text-align:left; } .pf-filter button span { flex:1; }
.pf-filter button b { font-weight:500; color:var(--grau); font-size:13px; } .pf-filter button:hover { background:#f6f6f6; } .pf-filter button.an { background:#f1f1f1; font-weight:600; }
.pf-objektname { display:flex; align-items:center; } .pf-objektname b { display:block; font-weight:500; } .pf-objektname small { color:var(--grau); font-size:13px; display:block; } .pf-objektname small.pf-fehlt { color:#8f5200; } .pf-objekttab th:not(:first-child), .pf-objekttab td:not(:first-child) { width:1%; white-space:nowrap; }
.pf-belegung { width:130px; } .pf-belegung b { font-weight:600; font-size:14px; } .pf-belegung .aw-balken { margin:4px 0 3px; } .pf-belegung small { color:var(--grau); font-size:12.5px; white-space:nowrap; }
.pf-hinweis { display:flex; gap:8px; font-size:13px; color:var(--grau); margin:0; line-height:1.45; } .pf-hinweis svg { flex:none; margin-top:2px; }
.pf-karte { padding:0; overflow:hidden; position:relative; } .pf-flaeche { height:620px; background:#eceae6; } .pf-schicht { position:absolute; left:0; top:0; }
button.pf-marke { position:absolute; transform:translate(-50%, -50%); height:30px; padding:0 11px; border-radius:999px; border:2px solid #fff; box-shadow:0 2px 6px rgba(0,0,0,.3); font-size:13px; font-weight:600; white-space:nowrap; cursor:pointer;
  font-variant-numeric:tabular-nums; display:inline-flex; align-items:center; font-family:inherit; } button.pf-marke:hover { z-index:2; box-shadow:0 3px 10px rgba(0,0,0,.45); }
.pf-marke.hoch, button.pf-marke.hoch:hover { background:#1a1a1a; color:#fff; } .pf-marke.mittel, button.pf-marke.mittel:hover { background:#757575; color:#fff; } .pf-marke.niedrig, button.pf-marke.niedrig:hover { background:#dedede; color:#222; }
.pf-marke.keine, button.pf-marke.keine:hover { background:#fff; color:#777; border:1.5px dashed #999; }
button.pf-marke.gruppe, button.pf-marke.gruppe:hover { background:#fff; color:#111; border:2px solid #111; height:44px; flex-direction:column; justify-content:center; line-height:1.2; padding:0 15px; border-radius:22px; }
.pf-marke.gruppe b { font-size:12.5px; font-weight:700; } .pf-marke.gruppe span { font-size:12px; font-weight:500; color:#555; }
button.pf-marke > i { position:absolute; right:-4px; top:-4px; width:12px; height:12px; border-radius:50%; background:var(--rot); border:2px solid #fff; }
.pf-info { position:absolute; left:14px; top:14px; width:310px; max-height:calc(100% - 28px); overflow:auto; background:#fff; border:1px solid var(--rahmen); border-radius:12px; box-shadow:0 6px 22px rgba(0,0,0,.18); padding:14px 16px; z-index:3; }
.pf-info[hidden] { display:none; } .pf-info > b { display:block; font-size:16px; font-weight:600; padding-right:30px; } .pf-info > small { color:var(--grau); font-size:13px; display:block; margin:2px 0 6px; } .pf-info [data-info-zu] { position:absolute; right:8px; top:8px; }
.pf-info-daten { display:grid; grid-template-columns:auto 1fr; gap:7px 12px; font-size:14px; margin:10px 0 14px; } .pf-info-daten span { color:var(--grau); } .pf-info-daten b { font-weight:500; text-align:right; }
.pf-oeffnen { display:block; text-align:center; background:var(--rot); color:#fff; font-weight:600; border-radius:9px; padding:9px; } .pf-oeffnen:hover { background:var(--rot-dunkel); }
.pf-karte-leg { position:absolute; right:14px; top:14px; background:#fff; border:1px solid var(--rahmen); border-radius:10px; padding:9px 13px; display:flex; align-items:center; gap:14px; font-size:13px; color:#444; box-shadow:0 2px 8px rgba(0,0,0,.12); z-index:2; }
.pf-karte-leg small { color:var(--grau); } .pf-karte-leg i.pf-marke { display:inline-block; width:22px; height:13px; border-radius:7px; margin-right:6px; vertical-align:-2px; border:1px solid rgba(0,0,0,.12); } .pf-karte-leg i.pf-marke.keine { border:1.5px dashed #999; }
.pf-punkt { display:inline-block; width:10px; height:10px; border-radius:50%; background:var(--rot); margin-right:6px; }
.pf-karte-hinweis { display:flex; gap:16px; align-items:flex-start; padding:26px; } .pf-karte-hinweis > svg { color:#999; flex:none; } .pf-karte-hinweis p { margin:0 0 12px; color:#555; font-size:14.5px; max-width:640px; line-height:1.45; } .pf-karte-hinweis .knopf-link { display:inline-block; }
@media (max-width:1100px) { .pf-breit, .pf-drei, .pf-objekte { grid-template-columns:minmax(0, 1fr); } .dl-kacheln.pf-fuenf { grid-template-columns:repeat(2, minmax(0, 1fr)); } }

/* ---------- Mieterportal: Verwaltung (public/portal.js) ---------- */
.po-hinweis { margin:10px 0 0; line-height:1.45; } .po-hinweis a { text-decoration:underline; }
.po-fuss { display:flex; justify-content:flex-end; gap:8px; margin-top:12px; }
.po-link { display:flex; align-items:center; gap:16px; } .po-qr { flex:none; width:132px; height:132px; border:1px solid var(--linie); border-radius:10px; overflow:hidden; background:#fff; } .po-qr svg { display:block; }
.po-mitte { flex:1; min-width:0; display:flex; flex-direction:column; gap:12px; } .po-url { font-size:13px; color:var(--grau); overflow-wrap:anywhere; user-select:all; line-height:1.4; }
.po-knoepfe { display:flex; flex-wrap:wrap; gap:8px; } .po-knoepfe button, .po-adresse button { display:inline-flex; align-items:center; gap:6px; }
.po-zeile { display:flex; align-items:flex-start; gap:12px; padding:12px 0; border-top:1px solid var(--linie-t); cursor:pointer; } .po-zeile.fest { cursor:default; padding-left:34px; } .einst-kopf + .po-zeile { border-top:none; padding-top:2px; }
.po-zeile input.schalter { border-radius:50%; margin-top:1px; } .po-zeile span { flex:1; min-width:0; } .po-zeile b { display:block; font-weight:500; font-size:15px; } .po-zeile small { display:block; color:var(--grau); font-size:13px; line-height:1.4; margin-top:2px; }
.po-adresse { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-top:12px; padding:12px 14px; background:#f6f6f4; border-radius:10px; font-size:14px; } .po-adresse span { color:var(--grau); } .po-adresse b { flex:1; min-width:0; font-weight:500; overflow-wrap:anywhere; user-select:all; } .po-adresse a { text-decoration:underline; }
/* Aushänge und Freigabe fürs Mieterportal (public/aushang.js, Dom 13.11.2026) */
.au-anriss { display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; max-width:520px; }
.au-ganz, .au-datei { display:flex; align-items:flex-start; gap:10px; cursor:pointer; padding:8px 0; } .au-ganz input.schalter, .au-datei input.schalter { border-radius:50%; margin-top:1px; }
.au-ganz span, .au-datei span { min-width:0; } .au-ganz b, .au-datei b { display:block; font-weight:500; font-size:14.5px; overflow-wrap:anywhere; } .au-ganz small, .au-datei small { display:block; color:var(--grau); font-size:12.5px; }
.au-dateien { border-top:1px solid var(--linie-t); margin-top:4px; max-height:320px; overflow-y:auto; } .au-datei { border-bottom:1px solid var(--linie-t); } .au-datei.aus { opacity:.55; cursor:default; }

/* ---------- Ticket-Chat (public/tickets.js) mit Kanälen Intern | Mieter, eigene Blasen rot wie in Nodus ---------- */
.tk-chat.pa-chat { padding:0 4px; }
.tk-chat .ch-unten { background:#fff; border-top:1px solid var(--linie); border-radius:0 0 12px 12px; }
.ch-pkopf .ch-strom[hidden] ~ .ch-suche-knopf { margin-left:auto; } .ch-pkopf .ch-strom[hidden] ~ .ch-filter { margin-left:6px; }
.ch-bilder-reihe { display:grid; grid-template-columns:repeat(2, 150px); gap:4px; margin:2px 0 6px; }
.ch-bilder-reihe .ch-bild { width:150px; height:150px; max-width:none; max-height:none; object-fit:cover; margin:0; }
.ch-bilder-reihe .ch-datei { grid-column:1 / -1; }
/* Sprachnachricht in der eigenen (roten) Blase wie Nodus Handy */
.ch-n.ich .sp-welle i { background:#e3a9a9; } .ch-n.ich .sp-welle i.an { background:var(--rot); } .ch-n.ich .sp-play { color:#7a4a4a; }
/* Wer ist dabei? */
dialog.tk-mg-dlg { width:min(520px, calc(100vw - 32px)); }
.tk-mg-seg { margin:4px 0 6px; }
.tk-mg-text { margin:8px 0 6px; line-height:1.45; }
.tk-mg-z { display:flex; align-items:center; gap:12px; padding:9px 2px; border-bottom:1px solid var(--linie-t); cursor:pointer; }
.tk-mg-z > span { flex:1; min-width:0; display:flex; flex-direction:column; } .tk-mg-z b { font-weight:500; } .tk-mg-z small { color:var(--grau); font-size:12.5px; }
.tk-mg-z.fest { cursor:default; } .tk-mg-z > span.tk-mg-fest { flex:none; display:inline-grid; }
.tk-mg-fest { width:22px; height:22px; border-radius:50%; background:var(--rot); color:#fff; display:inline-grid; place-items:center; flex:none; }
#tk-mg .feld { margin:8px 0 4px; }
/* ---------- Ende Ticket-Chat ---------- */
/* ---------- Profil wie Nodus (Einstellungen → Mein Konto, public/app.js profilKarte) und Profilbild im Konto-Kreis ---------- */
.avatar.mit-bild { overflow:hidden; background:#ececec; } .avatar.mit-bild img { width:100%; height:100%; object-fit:cover; display:block; border-radius:50%; }
.profil-karte { display:flex; gap:16px; align-items:center; padding:4px 0 14px; }
.profil-bild { width:72px; height:72px; border-radius:50%; overflow:hidden; background:#ececec; display:flex; align-items:center; justify-content:center; font-size:24px; font-weight:500; color:#555; flex:none; border:none; padding:0; cursor:pointer; }
.profil-bild img { width:100%; height:100%; object-fit:cover; } .profil-bild:hover { box-shadow:0 0 0 2px var(--linie); }
.profil-text { flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; } .profil-text b { font-size:18px; font-weight:600; }
.einst-kopf #pr-menue { margin-left:auto; }
.pr-form { display:flex; flex-direction:column; gap:10px; margin-top:6px; }
.pr-feld { display:flex; flex-direction:column; gap:4px; border:1px solid var(--linie); border-radius:12px; padding:8px 12px; } .pr-feld small { color:var(--grau); font-size:12.5px; }
.pr-feld input { border:none; outline:none; padding:2px 0; font:inherit; font-size:15px; background:none; }
.pr-feld:focus-within { border-color:#999; }
/* ---------- Ende Profil ---------- */
@media (min-width:768px) {
  main:not(.tief) { padding:14px 22px 22px; }
  .tief-inhalt { padding:22px 28px 32px; }
  .kopf { margin-bottom:20px; }
  .kacheln { gap:20px; margin-bottom:22px; }
  .dash, .ueb-raster, .akte, .kaesten { gap:22px; }
  .dash > div, .ueb-raster > div, .akte-links { gap:22px; }
  .objekt-kopf { margin-bottom:22px; }
  main.ak-seite, .ak-spalte { gap:20px; }
  .einst-karte { margin-bottom:20px; }
  .filterleiste { margin-bottom:18px; }
}

/* Fenster von rechts (Vermietung aus dem Belegungsplan, wie Nodus dialog.pt-panel: rechts, volle Höhe, 560px) */
.grund.seite { justify-content:flex-end; align-items:stretch; padding:0; background:rgba(17,17,17,.18); }
.grund.seite .fenster { width:min(560px, 100vw); max-height:none; height:100vh; border-radius:0; box-shadow:-6px 0 30px rgba(0,0,0,.18); animation:rein-rechts .18s ease-out; }
.grund.seite .f-kopf { padding:16px 20px; border-bottom:1px solid #e6e6e6; align-items:center; }
.grund.seite .f-inhalt { flex:1; padding:16px 20px; gap:14px; }
.grund.seite .f-fuss { padding:12px 20px; }
.grund.seite .reihe.drei { grid-template-columns:repeat(2, minmax(0,1fr)); } .grund.seite .reihe.drei > :last-child:nth-child(3) { grid-column:1 / -1; }
@keyframes rein-rechts { from { transform:translateX(40px); opacity:0; } }

/* Plantafel-Knöpfe 1:1 Nodus (gemessen: einzelne weiße Knöpfe 37×37, Rand #dcdcdc, 8px rund, 17px, Abstand 8px) */
.pt-knoepfe .segment { background:none; padding:0; gap:8px; border-radius:0; }
.pt-knoepfe .segment > button { width:37px; height:37px; min-width:37px; padding:0; background:#fff; border:1px solid #dcdcdc; border-radius:8px; font-size:17px; font-weight:500; color:#111; display:inline-flex; align-items:center; justify-content:center; box-shadow:none; }
.pt-knoepfe .segment > button:hover { background:#f5f5f5; }
/* Heute in Rot (unsere Farbe) statt Nodus-Grün */
.pt-hinter .heute { background:#fdf2f2; }
.pt-tag.heute { background:#fdf2f2; color:var(--rot); } .pt-tag.heute b { color:#fff; background:var(--rot); border-radius:12px; padding:0 7px; font-weight:600; }
/* Ziehen wie Plantafel */
.pt-reihe .pt-r { cursor:default; } .pt-reihe .pt-r:hover { background:transparent; }
.pt-balken { cursor:grab; touch-action:none; user-select:none; }
.pt-griff { flex:none; width:7px; align-self:stretch; cursor:ew-resize; } .pt-balken:hover .pt-griff { background:rgba(0,0,0,.08); } .pt-balken .pt-griff.r { margin-left:auto; }
.pt-balken.zieht { opacity:.35; }
.pt-geist { position:absolute; top:7px; bottom:7px; border-radius:6px; opacity:.85; outline:2px dashed #111; pointer-events:none; z-index:4; }
.pt-geist.neu { background:rgba(215,38,30,.12); outline-color:var(--rot); }
body.pt-greift, body.pt-greift * { cursor:grabbing !important; user-select:none; }

/* Icons im Objektmenü (Dom 06.11.2026) */
.om-liste a .om-ic { flex:none; color:#6a6a6a; } .om-liste a.an .om-ic { color:#111; } .om-liste a.spaeter .om-ic { color:#c4c4c4; }
.om-liste a .om-t { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
/* „Mehr“ im Formular (Neue Vermietung) */
.mehr-zeile { display:flex; align-items:center; gap:8px; border:none; background:none; padding:4px 2px; height:auto; color:#555; font-size:14px; font-weight:500; align-self:flex-start; }
.mehr-zeile svg { transform:rotate(-90deg); transition:transform .15s; } .mehr-zeile.offen svg { transform:none; } .mehr-zeile:hover { background:none; color:#111; }
.mehr-inhalt { display:flex; flex-direction:column; gap:10px; } .mehr-inhalt[hidden] { display:none; }
.grund.seite .f-inhalt { gap:10px; }
.datei-zeile .ik { margin-left:auto; }
/* Kontaktseite: Karten mit Stift wie Einstellungen */
.k-karten { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:22px; align-items:start; }
.k-karten .einst-karte { margin:0; border:1px solid var(--linie); }
@media (max-width:1100px) { .k-karten { grid-template-columns:1fr; } }

/* Objektmenü eingeklappt: nur die Icons */
.om.zu { flex-basis:56px; } .om.zu .om-liste { display:flex; padding-top:52px; } .om.zu .om-t, .om.zu .om-liste .z, .om.zu .om-gr { display:none; }
.om.zu .om-liste a { justify-content:center; padding:9px 0; }

.ergaenzen-knopf { border:none; background:none; padding:2px 0; height:auto; color:var(--grau); font-weight:500; } .ergaenzen-knopf:hover { background:none; color:#111; }

/* Rechte & Beta (06.11.2026, wie Nodus) */
.beta-pille { display:inline-block; margin-left:7px; padding:0 7px; border-radius:20px; font-size:10.5px; font-weight:600; line-height:17px; background:#fff2e0; color:#9a5b00; vertical-align:1px; }
body.nav-zu .beta-pille { display:none; }
.beta-liste { display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)); gap:8px 18px; padding:4px 0 6px; }
.beta-fuss { display:flex; justify-content:flex-end; padding-top:10px; }
.rm-leiste { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin:0 0 12px; } .rm-leiste .rechts { display:flex; gap:8px; }
.rm-legende { display:flex; align-items:center; gap:14px; flex-wrap:wrap; font-size:13px; color:#444; } .rm-legende > span { display:inline-flex; align-items:center; gap:5px; } .rm-legende .rm-box { cursor:default; width:22px; height:20px; } .rm-legende .rm-box.wo { color:#444; }
.rm-wrap { max-width:100%; overflow:auto; max-height:calc(100vh - 210px); border:1px solid var(--linie); border-radius:12px; background:#fff; }
.rm { border-collapse:separate; border-spacing:0; width:max-content; table-layout:fixed; }
.rm th, .rm td { border-bottom:1px solid #f0f0f0; padding:8px 10px; background:#fff; }
.rm thead th { position:sticky; top:0; z-index:2; vertical-align:bottom; border-bottom:1px solid var(--linie); }
.rm .rm-erste { position:sticky; left:0; z-index:1; width:270px; min-width:270px; max-width:270px; text-align:left; border-right:1px solid var(--linie); }
.rm thead .rm-erste { z-index:3; }
.rm td.rm-erste b { display:block; font-size:13.5px; font-weight:500; } .rm td.rm-erste span { display:block; font-size:11.5px; color:var(--grau); line-height:1.35; margin-top:1px; }
.rm-rolle, .rm td.rm-zelle { width:140px; min-width:140px; max-width:140px; text-align:center; font-weight:400; }
.rm-rolle > div { display:flex; align-items:center; justify-content:center; gap:2px; } .rm-rolle b { font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:104px; }
.rm-rolle .punkte { width:22px; height:24px; }
.rm-lizenz { display:inline-block; margin:3px 0 1px; padding:1px 8px; border-radius:20px; font-size:11px; font-weight:600; background:#eef3fb; color:#1f4f99; } .rm-lizenz.mobil { background:#fff2e0; color:#9a5b00; }
.rm-rolle .klein-text { display:block; font-size:11px; }
.rm-gruppe td { background:#fafafa; font-size:11px; text-transform:uppercase; letter-spacing:.8px; color:var(--grau); padding-top:12px; }
.rm-zelle > div { display:inline-flex; flex-direction:column; gap:4px; }
.rm-box { display:inline-flex; align-items:center; justify-content:center; width:30px; height:26px; padding:0; border:none; border-radius:6px; background:none; color:#a8acaf; cursor:pointer; }
.rm-box svg { fill:none; stroke:currentColor; }
.rm-box.an { color:var(--rot); } .rm-box.an svg rect { fill:currentColor; } .rm-box.an svg rect + path[d^="M11"] { stroke:#fff; }
.rm-box:not(.leer):not(:disabled):hover { background:#f3f3f3; } .rm-box:disabled { cursor:not-allowed; } .rm-box.an:disabled { color:#6b6b6b; }
.rm-box.leer { color:#b8bdc0; font-size:13px; cursor:default; }

/* Bewerber (06.11.2026, Nahaus-Nachbau) */
.sterne { display:inline-flex; gap:1px; color:#cfcfcf; vertical-align:middle; } .sterne .an { color:#e0a100; } .sterne .an svg, .sterne button.an svg { fill:currentColor; }
.sterne button { width:26px; height:26px; color:#c4c4c4; } .sterne button.an { color:#e0a100; }
.bw-notiz { width:100%; border:1px solid var(--rahmen); border-radius:12px; padding:10px 12px; font:inherit; resize:vertical; }
.bl-zeile { display:flex; align-items:center; gap:14px; padding:12px 0; border-bottom:1px solid var(--linie-t); } .bl-zeile.aus { opacity:.55; }
.bl-qr { flex:none; width:76px; height:76px; border:1px solid var(--linie); border-radius:8px; overflow:hidden; } .bl-qr svg { display:block; }
.bl-mitte { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; } .bl-url { font-size:12.5px; color:var(--grau); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; user-select:all; }
.bl-knoepfe { display:flex; gap:6px; align-items:center; } .bl-neu { padding-top:14px; }
#b-link svg { margin-right:6px; vertical-align:-3px; }

/* Mietvertrag (06.11.2026, Nahaus-Nachbau) */
.pruefungen { display:flex; flex-direction:column; gap:6px; }
.pruefung { display:flex; gap:9px; align-items:flex-start; padding:9px 12px; border-radius:10px; font-size:13.5px; line-height:1.4; }
.pruefung svg { flex:none; margin-top:1px; } .pruefung.fehler { background:#fdf2f2; color:#9d1c15; } .pruefung.warnung { background:#fff6e5; color:#8a5300; } .pruefung.hinweis { background:#f3f5f8; color:#44505e; }
fieldset.mvt-felder { border:0; padding:0; margin:0; display:flex; flex-direction:column; gap:10px; min-width:0; } fieldset.mvt-felder:disabled { opacity:.75; }
.mvt-titel { font-size:11.5px; text-transform:uppercase; letter-spacing:.7px; color:var(--grau); font-weight:600; margin:8px 0 -2px; }
.mvt-summe { display:flex; justify-content:space-between; padding:10px 14px; background:#f6f6f6; border-radius:12px; font-size:14px; } .mvt-summe b { font-size:15px; }
.mvt-sigs { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.mvt-sig { border:1px solid var(--rahmen); border-radius:14px; padding:10px 12px; display:flex; flex-direction:column; gap:4px; min-width:0; } .mvt-sig.an { border-color:#bfe0c9; background:#f6fbf7; }
.mvt-sig small { font-size:12px; color:var(--grau); } .mvt-sig b { font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .mvt-sig img { max-width:100%; height:54px; object-fit:contain; object-position:left; }
.mvt-sig-knoepfe { display:flex; gap:6px; flex-wrap:wrap; margin-top:4px; }
.mvt-link { display:flex; gap:12px; align-items:center; border:1px solid var(--rahmen); border-radius:14px; padding:10px 12px; } .mvt-link b { display:block; font-size:14px; }
.sig-marke { display:inline-flex; align-items:center; gap:3px; font-size:12px; color:#9a9a9a; margin-right:6px; } .sig-marke.an { color:#1a8a3a; }
.vertrag-text { font-size:14px; line-height:1.55; } .vertrag-text h4 { margin:16px 0 4px; font-size:14px; } .vertrag-text p { margin:0; white-space:pre-wrap; }
.vt-parteien { display:grid; gap:10px; padding-bottom:12px; border-bottom:1px solid var(--linie); } .vt-parteien small { display:block; color:var(--grau); font-size:12px; } .vt-parteien span { display:block; color:var(--grau); font-size:13px; }
.vv-liste { display:flex; flex-direction:column; gap:10px; } .vv-abs { padding:12px 14px; }
.vv-kopf { display:flex; gap:4px; align-items:center; margin-bottom:6px; } .vv-titel { flex:1; border:0; font:inherit; font-weight:600; font-size:15px; outline:0; padding:4px 0; }
.vv-text { width:100%; border:1px solid var(--rahmen); border-radius:10px; padding:9px 11px; font:inherit; font-size:14px; line-height:1.5; resize:vertical; }
.vv-platz { display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:6px 16px; font-size:13px; color:var(--grau); } .vv-platz code { color:var(--schwarz); background:#f3f3f3; padding:1px 5px; border-radius:5px; }

/* Einzug/Auszug (06.11.2026): Kaution und Übergabeprotokoll in der Vermietung */
.k-knoepfe { display:flex; gap:8px; flex-wrap:wrap; margin-top:8px; } .k-knoepfe:empty { display:none; }
.k-buchungen { margin-top:6px; border-top:1px dashed var(--linie); padding-top:4px; }
.grund.seite .fenster.protokoll-fenster .f-inhalt { padding:0; overflow:hidden; } .protokoll-rahmen { width:100%; height:100%; border:0; display:block; min-height:calc(100vh - 70px); }

/* ---------- Einstellungen → Google Drive (public/drive.js, wie Nodus driveKasten) ---------- */
.dr-adresse { word-break:break-all; user-select:all; }
.dr-stift { vertical-align:middle; margin-left:4px; }
.dr-pfad { margin-bottom:10px; } .dr-pfad .link { display:inline-flex; align-items:center; gap:2px; }
.dr-liste { display:flex; flex-direction:column; gap:6px; max-height:50vh; overflow:auto; }
.dr-ordner { display:flex; align-items:center; gap:10px; width:100%; text-align:left; padding:10px 12px; border:1px solid var(--linie); border-radius:12px; background:#fff; height:auto; }
.dr-ordner span { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .dr-ordner:hover { border-color:#111; }