/* Bierimmobilien – Rechner. Werte wie Nodus (docs/DESIGN.md): Outfit, Rot nur für den Hauptknopf, 1px Linien, Feld-Karten. */
:root { --rot:#e40000; --rot-dunkel:#b30000; --schwarz:#111; --grau:#6b6b6b; --grau-hell:#999; --linie:#e6e6e6; --linie-t:#eee; --rahmen:#dcdcdc;
  --hell:#f5f5f5; --flaeche:#fafafa; --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 */
aside.seite { position:fixed; inset:0 auto 0 0; width:var(--nav); background:var(--schwarz); color:#fff; overflow-y:auto; padding:16px 0; display:flex; flex-direction:column; }
.marke-kopf { display:flex; align-items:center; gap:10px; padding:0 18px 16px; border-bottom:1px solid #2a2a2a; margin-bottom:8px; }
.marke-kopf img { width:34px; height:34px; } .marke-kopf b { font-size:17px; font-weight:600; display:block; } .marke-kopf span { font-size:12px; color:#888; }
nav a { display:flex; align-items:center; gap:12px; color:#ddd; padding:10px 18px; border-left:3px solid transparent; font-size:15px; }
nav a svg { width:18px; height:18px; flex:none; opacity:.85; }
nav a:hover { background:#262626; color:#fff; }
nav a.aktiv { background:#262626; color:#fff; border-left-color:var(--rot); font-weight:500; }
nav b { margin-left:auto; background:var(--rot); color:#fff; border-radius:999px; padding:0 7px; font-size:12px; font-weight:500; } nav b:empty { display:none; }
.nav-titel { font-size:11px; text-transform:uppercase; letter-spacing:.8px; color:#888; padding:16px 20px 6px; }
.seite-fuss { margin-top:auto; padding:12px 18px 0; border-top:1px solid #2a2a2a; font-size:13px; color:#aaa; display:flex; align-items:center; gap:8px; }
.seite-fuss button { margin-left:auto; background:none; border:1px solid #444; color:#ddd; border-radius:6px; padding:4px 10px; cursor:pointer; font-size:13px; }

main { margin-left:var(--nav); padding:24px 28px 28px; height:100vh; display:flex; flex-direction:column; min-width:0; overflow:hidden; }
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:6px; border:1px solid var(--schwarz); 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); }
button.primaer, .btn.primaer { background:var(--rot); border-color:var(--rot); color:#fff; } button.primaer:hover { background: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(160px, 1fr)); }
.kachel { background:#fff; border:1px solid var(--linie); border-radius:10px; padding:14px 16px; color:inherit; display:block; position:relative; cursor:pointer; }
.kachel:hover { border-color:var(--schwarz); }
.kachel .zahl { font-size:28px; font-weight:700; line-height:1.2; } .kacheln.klein .zahl { font-size:24px; }
.kachel .titel { font-size:13px; color:var(--grau); } .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:0 14px; text-align:left; font-weight:600; color:#2b2b2b; border-bottom:1px solid var(--linie-t); white-space:nowrap; }
.tabelle td { height:64px; padding:6px 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; }
.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:12px; font-weight:500; padding:3px 8px; border-radius:6px; background:#ebeae7; color:#4a4844; white-space:nowrap; }
.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-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 */
.plan { background:#fff; border:1px solid var(--linie); border-radius:10px; overflow:auto; flex:1; min-height:0; position:relative; }
.plan-gitter { min-width:1100px; }
.plan-kopf { display:flex; position:sticky; top:0; z-index:3; background:#fff; border-bottom:1px solid var(--linie-t); }
.plan-name { flex:0 0 210px; position:sticky; left:0; z-index:2; background:#fff; border-right:1px solid var(--linie-t); padding:0 14px; display:flex; flex-direction:column; justify-content:center; }
.plan-kopf .plan-name { font-size:14px; font-weight:600; color:#2b2b2b; z-index:4; }
.plan-tage { flex:1; display:grid; }
.plan-tag { text-align:center; font-size:12.5px; padding:6px 0; border-left:1px solid #f2f2f2; } .plan-tag small { display:block; font-size:10.5px; color:var(--grau); }
.plan-tag.we { background:#f7f7f7; } .plan-tag.heute { background:#fdf2f2; } .plan-tag.heute span { background:var(--rot); color:#fff; border-radius:999px; padding:0 6px; font-weight:600; }
.plan-haus { display:flex; align-items:center; gap:8px; padding:10px 14px; border-bottom:1px solid var(--linie-t); font-weight:600; font-size:14px; position:sticky; left:0; background:#fff; cursor:pointer; width:max-content; }
.plan-haus small { font-weight:400; color:var(--grau); font-size:13px; }
.plan-zeile { display:flex; border-bottom:1px solid var(--linie-t); height:46px; }
.plan-zeile .plan-name { padding-left:34px; } .plan-zeile .plan-name b { font-size:14px; font-weight:500; } .plan-zeile .plan-name small { font-size:12px; color:var(--grau); }
.plan-spur { flex:1; position:relative; display:grid; }
.plan-zelle { border-left:1px solid #f2f2f2; cursor:copy; } .plan-zelle.we { background:#f7f7f7; } .plan-zelle.heute { background:#fdf2f2; } .plan-zelle:hover { background:#f2f2f2; }
.balken { position:absolute; top:9px; height:28px; border-radius:6px; display:flex; align-items:center; gap:6px; padding:0 9px; font-size:13px; font-weight:500; overflow:hidden; white-space:nowrap;
  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; }
.balken small { font-weight:400; color:#555; font-size:12.5px; } .balken.bald { background:#fde0cf; } .balken.reserviert { background:#fff; border:1px dashed #8a8a8a; }
.balken.offen::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--ampelrot); flex:none; }
.balken.gewaehlt { border-color:#111; box-shadow:inset 0 0 0 1px #111; }
.balken.links-ab { border-top-left-radius:0; border-bottom-left-radius:0; } .balken.rechts-ab { border-top-right-radius:0; border-bottom-right-radius:0; }
.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 .schiene { margin-top:3px; }
.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 { width:20px; height:20px; accent-color:var(--rot); margin:0; }
.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 ---------- */
body.nav-zu, body.nav-auto-zu { --nav:64px; }
body.nav-zu aside.seite nav a, body.nav-auto-zu aside.seite nav a { justify-content:center; padding:11px 0; font-size:0; gap:0; }
body.nav-zu aside.seite nav a svg, body.nav-auto-zu aside.seite nav a svg { width:20px; height:20px; }
body.nav-zu aside.seite nav b, body.nav-auto-zu aside.seite nav b { position:absolute; margin:-18px 0 0 22px; font-size:10px; padding:0 5px; }
body.nav-zu .marke-kopf div, body.nav-auto-zu .marke-kopf div, body.nav-zu .nav-titel, body.nav-auto-zu .nav-titel, body.nav-zu .nur-offen, body.nav-auto-zu .nur-offen { display:none; }
body.nav-zu .marke-kopf, body.nav-auto-zu .marke-kopf { justify-content:center; padding:0 0 14px; }
body.nav-zu .seite-fuss, body.nav-auto-zu .seite-fuss { justify-content:center; padding:12px 0 0; }
body.nav-zu #navklapp svg, body.nav-auto-zu #navklapp svg { transform:rotate(180deg); }
body.nav-auto-zu:not(.nav-zu) aside.seite:hover { --nav:236px; width:236px; z-index:65; box-shadow:6px 0 24px rgba(0,0,0,.25); }
body.nav-auto-zu:not(.nav-zu) aside.seite:hover nav a { justify-content:flex-start; padding:10px 18px; font-size:15px; gap:12px; }
body.nav-auto-zu:not(.nav-zu) aside.seite:hover .marke-kopf div, body.nav-auto-zu:not(.nav-zu) aside.seite:hover .nur-offen, body.nav-auto-zu:not(.nav-zu) aside.seite:hover .nav-titel { display:revert; }
#navklapp { margin-left:auto; width:30px; height:30px; padding:0; border:1px solid #444; background:none; color:#ddd; border-radius:6px; }
aside.seite { transition:width .15s; } aside.seite nav a { position:relative; }
main.tief { padding:0; }
.tief-rahmen { display:flex; height:100vh; min-height:0; }
.om { flex:0 0 236px; 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 12px; border-radius:8px; font-size:14.5px; color:#333; }
.om-liste a:hover { background:#f6f6f6; } .om-liste a.an { background:#efefef; 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:#888; padding:14px 12px 4px; }
.om-liste a.unten { margin-top:auto; }
.tief-inhalt { flex:1; min-width:0; overflow:auto; padding:24px 28px 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:12px; color:var(--grau); } .kz-raster b { font-size:16px; font-weight:600; }
.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:#e40000; border-color:#e40000; 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; } }