/* Gemeinsame Arbeitsflächen: klare Priorität, eine Leserichtung, lesbare Zustände. */
:root { --arbeits-akzent: var(--brand-600); }
.inhalt { max-width: 1680px; }
.seitenauftakt { display:flex; justify-content:space-between; align-items:center; gap:24px; margin:8px 0 26px; }
.seitenauftakt h2 { font-size:clamp(23px,2.3vw,32px); line-height:1.2; margin:7px 0 10px; letter-spacing:-.025em; }
.seitenauftakt p { margin:0; color:var(--text-2); max-width:70ch; }
.oberzeile { color:var(--arbeits-akzent); font-size:12px; font-weight:650; letter-spacing:.08em; text-transform:uppercase; }
.auftaktaktionen { display:flex; flex-wrap:wrap; gap:8px; }
.karte { border-radius:9px; box-shadow:0 2px 5px rgb(16 32 47 / 3%); }
.karte__kopf h3 { font-size:16px; margin:0; font-weight:650; }
.arbeitszahlen { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; margin:0 0 24px; }
.arbeitszahl { border:1px solid var(--border); background:var(--surface); border-radius:9px; padding:18px 20px; display:flex; flex-direction:column; gap:9px; color:var(--text); text-decoration:none; }
.arbeitszahl:hover { border-color:var(--arbeits-akzent); text-decoration:none; }
.arbeitszahl>span { font-size:13px; color:var(--text-2); min-height:38px; }
.arbeitszahl>strong { font-size:34px; line-height:1.1; font-variant-numeric:tabular-nums; }
.arbeitszahl>small { color:var(--text-2); }
.arbeitszahl--warn { border-top:3px solid var(--rot); }
.arbeitszahl--warn>strong { color:var(--rot); }
/* Kacheln im Hinweiscenter: je Art eine Farbe und ein Zeichen. */
.arbeitszahl { --farbe:var(--arbeits-akzent); border-top:3px solid var(--farbe); transition:background-color .12s ease, border-color .12s ease; }
.arbeitszahl--rot { --farbe:var(--rot); }
.arbeitszahl--gelb { --farbe:var(--gelb); }
.arbeitszahl--teal { --farbe:var(--teal-ink); }
.arbeitszahl--gruen { --farbe:var(--brand-600); }
.arbeitszahl--navy { --farbe:var(--navy); }
.arbeitszahl__kopf { display:flex; align-items:flex-start; gap:10px; }
.arbeitszahl__zeichen { flex:none; width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:color-mix(in srgb, var(--farbe) 13%, var(--surface)); color:var(--farbe); }
.arbeitszahl__zeichen svg { width:18px; height:18px; }
.arbeitszahl__kopf>span:last-child { padding-top:1px; }
.arbeitszahl>strong { color:var(--farbe); }
.arbeitszahl--leer { border-top-color:color-mix(in srgb, var(--farbe) 35%, var(--border)); }
.arbeitszahl--leer>strong { color:var(--text-3); }
.arbeitszahl--leer .arbeitszahl__zeichen { background:var(--surface-2); color:var(--text-3); }
.arbeitszahl:hover { border-color:var(--farbe); background:color-mix(in srgb, var(--farbe) 4%, var(--surface)); }
.arbeitszahl--aktiv { border-color:var(--farbe); background:color-mix(in srgb, var(--farbe) 8%, var(--surface)); box-shadow:inset 0 0 0 1px var(--farbe); }
.arbeitszahl--aktiv>small { color:var(--farbe); font-weight:600; }
.arbeitsfilter { display:flex; align-items:end; flex-wrap:wrap; gap:14px; margin:20px 0; }
.arbeitsfilter>div { flex:1 1 180px; }
.arbeitsfilter>div:first-child { flex:2 1 240px; }
.arbeitsfilter label { display:block; font-size:13px; font-weight:600; margin-bottom:6px; }
.arbeitszeile { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1.1fr) minmax(0,1fr) 20px; gap:20px; padding:19px 22px; color:var(--text); text-decoration:none; border-bottom:1px solid var(--border); align-items:center; }
.arbeitszeile:last-child { border-bottom:0; }
.arbeitszeile:hover { background:var(--surface-2); text-decoration:none; }
.arbeitszeile>div { min-width:0; }
.arbeitszeile strong { display:block; overflow-wrap:anywhere; font-size:14px; }
.arbeitszeile span { display:block; color:var(--text-2); font-size:12px; margin-top:4px; }
.arbeitszeile--warn { border-left:3px solid var(--rot); }
.arbeitszeile--warn>div:nth-child(3)>strong { color:var(--rot); }
.statistikbereich { margin:28px 0; }
.statistikbereich>summary { cursor:pointer; padding:16px; font-weight:600; }
.statistikbereich .uebersicht .kachel__titel { white-space:normal; overflow:visible; }
/* Bearbeitungsstand, kompakt: Titelzeile, je offene Bearbeitung eine kleine Karte, Fristen als Fuss. */
.arbeitskopf { padding:12px 16px; border:1px solid var(--border); border-top:3px solid var(--arbeits-akzent); background:var(--surface); border-radius:9px; margin-bottom:14px; }
.arbeitskopf__titel { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.arbeitskopf h2 { margin:0; font-size:17px; line-height:1.35; display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 10px; min-width:0; overflow-wrap:anywhere; }
.arbeitskopf__nummer { font-size:12.5px; font-weight:500; color:var(--text-3); text-decoration:none; font-variant-numeric:tabular-nums; }
.arbeitskopf__nummer:only-child { font-size:inherit; font-weight:inherit; color:inherit; }
.arbeitskopf__nummer:hover { text-decoration:underline; }
.arbeitskopf__marken { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; flex:none; }
.arbeitskopf__ruhig { display:flex; align-items:center; gap:6px; color:var(--text-2); font-size:13px; margin:8px 0 0; }
.aufgabe { display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; margin-top:8px; padding:8px 10px 8px 12px; border:1px solid var(--border); border-left:3px solid var(--border-2); border-radius:7px; background:var(--surface-2); }
.aufgabe--warn { border-color:color-mix(in srgb, var(--rot) 30%, var(--border)); border-left-color:var(--rot); background:color-mix(in srgb, var(--rot) 6%, var(--surface)); }
.aufgabe__zeichen { width:18px; height:18px; flex:none; color:var(--text-3); }
.aufgabe--warn .aufgabe__zeichen { color:var(--rot); }
.aufgabe__inhalt { flex:1 1 280px; min-width:0; display:flex; flex-wrap:wrap; align-items:center; gap:3px 14px; }
.aufgabe__inhalt>strong { font-size:14px; margin-right:2px; overflow-wrap:anywhere; }
.fakt { display:inline-flex; align-items:center; gap:5px; font-size:12.5px; color:var(--text-2); }
.fakt__zeichen { width:14px; height:14px; flex:none; color:var(--text-3); }
.fakt--warn, .fakt--warn .fakt__zeichen { color:var(--rot); }
/* Achtung, nicht Alarm: eine Frist, die bald ablaeuft, aber noch zu halten ist. */
.fakt--acht, .fakt--acht .fakt__zeichen { color:var(--gelb); }
.fakt--stark { font-weight:650; }
.aufgabe__aktionen { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-left:auto; }
.aufgabe__aktionen:empty { display:none; }
.aufgabe__aktionen form { margin:0; }
.aufgabe__aktionen .knopf { white-space:nowrap; }
/* Gleich hoch: `button[type=submit]` ist spezifischer als `.knopf--klein` und machte „Übernehmen“ groesser als „Erinnern“. */
.aufgabe__aktionen .knopf--klein { padding:5px 10px; font-size:13px; line-height:1.35; }
/* Erinnern klappt als kleines Fenster am Knopf auf, nicht als Zeile darunter. */
.erinnerung { position:relative; }
.erinnerung>summary { list-style:none; }
.erinnerung>summary::-webkit-details-marker { display:none; }
.erinnerung[open]>summary { background:var(--surface-2); }
.erinnerung[open]>form { position:absolute; right:0; top:calc(100% + 6px); z-index:20; width:min(340px, 80vw); margin:0; padding:12px 14px; background:var(--surface); border:1px solid var(--border-2); border-radius:8px; box-shadow:0 8px 24px rgb(16 32 47 / 14%); }
.erinnerung p { font-size:13px; margin:0 0 8px; }
/* Dokumentfristen als schmaler Fuss; aufgeklappt nur, wenn etwas ansteht. */
/* Dokumentfristen: im Kopf eine Zeile mit den offenen Fristen, verwaltet wird im Fenster. */
.fristfuss { display:flex; flex-wrap:wrap; align-items:center; gap:4px 14px; margin-top:10px; padding-top:8px; border-top:1px solid var(--border); }
.fristfuss__titel { display:inline-flex; align-items:center; gap:5px; font-size:13px; font-weight:600; color:var(--text-2); }
.fristfuss__knopf { margin-left:auto; }
.dialog--fristen { width:min(720px, calc(100vw - 32px)); }
.dialog--fristen .dialog__kopf h2 .matt { font-size:13px; font-weight:500; margin-left:6px; }
.fristeintrag { padding:12px 14px; margin-bottom:10px; border:1px solid var(--border); border-left:3px solid var(--teal); border-radius:7px; background:var(--surface); }
.fristeintrag--warn { border-color:color-mix(in srgb, var(--rot) 30%, var(--border)); border-left-color:var(--rot); background:color-mix(in srgb, var(--rot) 5%, var(--surface)); }
.fristeintrag--ruhig { border-left-color:var(--border-2); background:var(--surface-2); }
.fristeintrag--ruhig strong { color:var(--text-2); }
.fristeintrag__kopf { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; }
.fristeintrag__kopf strong { font-size:14px; }
.fristeintrag__zeichen { width:17px; height:17px; flex:none; color:var(--text-3); }
.fristeintrag--warn .fristeintrag__zeichen { color:var(--rot); }
.fristeintrag__beleg { margin:6px 0 0 27px; font-size:12.5px; color:var(--text-2); }
.fristeintrag__aktionen { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; margin:10px 0 0 27px; }
.fristeintrag__aktionen form { display:flex; flex-wrap:wrap; gap:6px; margin:0; }
.fristeintrag__korrektur { flex:1 1 100%; }
.fristeintrag__korrektur>summary { cursor:pointer; font-size:12.5px; color:var(--text-2); }
.fristeintrag__korrektur[open]>summary { margin-bottom:8px; }
.fristformular { display:grid; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr)); gap:8px 12px; align-items:end; }
.fristformular label { display:flex; flex-direction:column; gap:4px; font-size:12.5px; font-weight:600; color:var(--text-2); }
.fristformular__knoepfe { display:flex; flex-wrap:wrap; gap:6px; }
.fristneu { margin-top:6px; padding-top:4px; }
.fristneu .kopfdaten__titel { margin-top:10px; }
.fristeintrag__aktionen .knopf--klein, .fristneu .knopf--klein { padding:5px 10px; font-size:13px; line-height:1.35; }
.handlungszeile { display:flex; flex-wrap:wrap; gap:14px; align-items:center; padding:16px 0; border-top:1px solid var(--border); }
.handlungszeile>div:first-child { flex:1 1 230px; }
.handlungszeile span { display:block; font-size:13px; margin-top:4px; }
.handlungszeile--warn>div:first-child>strong { color:var(--rot); }
.fristzeile { display:flex; flex-wrap:wrap; gap:12px; padding-top:12px; border-top:1px solid var(--border); font-size:13px; }
.vorgang__inhalt { display:block; }
.vorgang .dokumentbild { height:620px; width:100%; }
.vorgang .ftabs { flex-wrap:wrap; overflow:visible; }
.vorgang .ftabs__blatt { flex-shrink:0; }
.vorgang .karte__leib--weg { max-height:none; overflow:visible; }
/* Alle Karten des Schriftstuecks als Reiter einer Karte: Die Leiste sitzt ganz oben und
   folgt der Rundung; Spruenge landen unter der festen Kopfzeile, nicht dahinter. */
.vorgang__reiter { scroll-margin-top:calc(var(--kopf-h) + 16px); }
:root[data-menue="senkrecht"] .vorgang__reiter { scroll-margin-top:16px; }
.vorgang__reiter>.ftabs:first-child { border-top-left-radius:inherit; border-top-right-radius:inherit; }
/* Karten bis zum Fensterende (arbeitsplatz.js setzt die Hoehe): Leiste oben fest, Reiter rollen in sich. */
.vorgang__reiter.ist-fensterhoch { display:flex; flex-direction:column; margin-bottom:0; overflow:hidden; }
.vorgang__reiter.ist-fensterhoch>.ftabs { flex:none; }
.vorgang__reiter.ist-fensterhoch>[data-reiterfeld] { flex:1 1 auto; min-height:0; overflow-y:auto; }
.vorgang__reiter.ist-fensterhoch>[data-reiterfeld="dokument"] { display:flex; flex-direction:column; }
.vorgang__reiter.ist-fensterhoch .dokumentbild { flex:1 1 auto; height:auto; min-height:260px; }
.zweispalt__liste>.karte.ist-fensterhoch { overflow-y:auto; margin-bottom:0; }
.postliste__mehr { padding:14px 12px; text-align:center; font-size:12.5px; color:var(--text-3); list-style:none; }
.postliste__mehr--fehler { color:var(--rot); cursor:pointer; }

/* Kopfdaten: Zeichen vor der Bezeichnung, Einstufungen als Marken. */
.kopfdaten th { white-space:nowrap; }
.kopfdaten__zeichen { width:15px; height:15px; margin-right:8px; vertical-align:-3px; color:var(--text-3); }
.kopfdaten td { vertical-align:middle; }
.kopfdaten td .marke { vertical-align:1px; }

/* Bearbeitungsweg als Schlange: Zeilen laufen hin und zurueck (arbeitsplatz.js ordnet an). */
.bearbeitungsweg { --luecke-x:34px; --luecke-y:26px; --schlange-linie:var(--border-2); }
.wegbahn+.wegbahn { margin-top:18px; padding-top:14px; border-top:1px solid var(--border); }
.wegbahn__titel { display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; margin:0 0 12px; font-size:14px; }
.schlange { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill, minmax(170px, 1fr)); gap:var(--luecke-y) var(--luecke-x); align-items:stretch; }
.schlange__schritt { position:relative; min-width:0; padding:8px 10px 8px 34px; border:1px solid var(--border); border-radius:7px; background:var(--surface); font-size:12px; line-height:1.35; }
.schlange__schritt strong { display:block; font-size:13px; overflow-wrap:anywhere; }
.schlange__schritt time, .schlange__schritt span { display:block; color:var(--text-2); overflow-wrap:anywhere; }
.schlange__schritt .schlange__wer { font-weight:650; color:var(--text); }
.schlange__schritt small { display:block; margin-top:3px; color:var(--text-3); font-size:11.5px; overflow-wrap:anywhere; }
.schlange__zeichen { position:absolute; left:10px; top:9px; width:16px; height:16px; color:var(--text-3); }
.schlange__schritt--start { background:var(--surface-2); }
.schlange__schritt--jetzt { border-color:var(--teal); border-left:3px solid var(--teal); background:color-mix(in srgb, var(--teal) 6%, var(--surface)); }
.schlange__schritt--jetzt .schlange__zeichen { color:var(--teal-ink); }
.schlange__schritt--warn { border-color:color-mix(in srgb, var(--rot) 35%, var(--border)); border-left-color:var(--rot); background:color-mix(in srgb, var(--rot) 6%, var(--surface)); }
.schlange__schritt--warn strong, .schlange__schritt--warn small, .schlange__schritt--warn .schlange__zeichen { color:var(--rot); }
.wegbahn--kenntnis .schlange__schritt--jetzt { border-color:var(--border-2); border-left-color:var(--border-2); background:var(--surface-2); }
/* Verbinder: Linie in die Luecke, Spitze am Ende. */
.schlange__schritt[data-weiter="rechts"]::after, .schlange__schritt[data-weiter="links"]::after { content:""; position:absolute; top:50%; width:var(--luecke-x); border-top:2px solid var(--schlange-linie); }
.schlange__schritt[data-weiter="rechts"]::after { left:100%; }
.schlange__schritt[data-weiter="links"]::after { right:100%; }
.schlange__schritt[data-weiter="runter"]::after { content:""; position:absolute; left:50%; top:100%; height:var(--luecke-y); border-left:2px solid var(--schlange-linie); }
.schlange__schritt[data-weiter="rechts"]::before, .schlange__schritt[data-weiter="links"]::before, .schlange__schritt[data-weiter="runter"]::before { content:""; position:absolute; width:7px; height:7px; border-top:2px solid var(--schlange-linie); border-right:2px solid var(--schlange-linie); }
.schlange__schritt[data-weiter="rechts"]::before { left:calc(100% + var(--luecke-x) - 9px); top:calc(50% - 4px); transform:rotate(45deg); }
.schlange__schritt[data-weiter="links"]::before { right:calc(100% + var(--luecke-x) - 9px); top:calc(50% - 4px); transform:rotate(-135deg); }
.schlange__schritt[data-weiter="runter"]::before { left:calc(50% - 4px); top:calc(100% + var(--luecke-y) - 9px); transform:rotate(135deg); }
/* Filter ueber der Postliste: vier halbe Felder in zwei Zeilen. Bleibt eines
   uebrig (nur ein Postfach, also kein Postfachfilter), nimmt das letzte die
   ganze Breite. Ein gesetzter Filter traegt einen Rahmen in Teal. */
.filter__raster { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:6px; }
.filter__raster>.filter__feld:last-child:nth-child(odd) { grid-column:1 / -1; }
.filter__feld { position:relative; display:flex; align-items:center; min-width:0; margin:0; }
.filter__feld .kopf__zeichen { position:absolute; left:10px; width:15px; height:15px; color:var(--text-3); opacity:1; pointer-events:none; z-index:1; }
.filter__feld>select { width:100%; min-width:0; padding:7px 8px 7px 32px; border:1px solid var(--border-2); border-radius:var(--radius); background:var(--surface); font:inherit; font-size:13px; color:var(--text); text-overflow:ellipsis; }
.filter__feld>select:focus { outline:2px solid var(--teal); outline-offset:-1px; border-color:var(--teal); }
.filter__feld>input { min-width:0; font-size:13px; }
.filter__feld--aktiv>input, .filter__feld--aktiv>select, .filter__feld--aktiv .select2-selection { border-color:var(--teal) !important; background:color-mix(in srgb, var(--teal) 6%, var(--surface)) !important; }
.filter__feld--aktiv .kopf__zeichen { color:var(--teal-ink); }

/* Statusfilter: mehrere Zustaende zugleich, das Kaestchen sitzt in der Marke. */
.filter__marken { margin:0; }
.filtermarke--wahl { cursor:pointer; user-select:none; }
.filtermarke--wahl input { margin:0; width:13px; height:13px; accent-color:var(--teal); cursor:pointer; }
.filtermarke--wahl:has(input:checked) { background:var(--navy); border-color:var(--navy); color:#fff; }
.filtermarke--wahl:has(input:checked) input { accent-color:#fff; }
.filtermarke--wahl:not(:has(input:checked)) { background:var(--surface); border-color:var(--border-2); color:var(--text-2); }
.filtermarke--wahl:focus-within { outline:2px solid var(--teal); outline-offset:1px; }
.prozesskopf { display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px; }
.prozessursprung { margin:0 auto 30px; border:1px solid var(--border); border-radius:8px; background:var(--surface-2); padding:12px 18px; text-align:center; max-width:300px; position:relative; }
.prozessursprung::after { content:""; position:absolute; left:50%; height:30px; top:100%; border-left:2px solid var(--border-2); }
.prozessursprung strong,.prozessursprung time,.prozessursprung span { display:block; }
.prozessursprung time,.prozessursprung span { font-size:12px; color:var(--text-2); }
.prozessbahnen { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)); gap:28px; align-items:start; }
.prozessbahn { border-top:2px solid var(--border-2); padding-top:12px; }
.prozessbahn h4 { font-size:15px; margin:0 0 15px; overflow-wrap:anywhere; }
.prozessbahn h4 small { display:block; font-size:12px; font-weight:400; color:var(--text-2); margin-top:4px; }
.prozesspunkte { list-style:none; padding:0; margin:0; }
.prozesspunkt { position:relative; margin:0 0 22px; border:1px solid var(--border); border-radius:7px; background:var(--surface); }
.prozesspunkt::after { content:"↓"; position:absolute; top:100%; left:calc(50% - 5px); height:22px; color:var(--text-3); }
.prozesspunkt summary { cursor:pointer; padding:12px; }
.prozesspunkt summary strong { display:block; font-size:13px; }
.prozesspunkt summary span,.prozesspunkt time { display:block; font-size:12px; color:var(--text-2); overflow-wrap:anywhere; }
.prozesspunkt__details { padding:0 12px 12px; font-size:12px; }
.prozessjetzt { border:1px solid var(--border-2); border-left:3px solid var(--arbeits-akzent); background:var(--surface-2); padding:12px; border-radius:7px; }
.prozessjetzt span,.prozessjetzt strong { display:block; }
.prozessjetzt span { font-size:12px; color:var(--text-2); }
.prozessjetzt--warn { border-left-color:var(--rot); }
.prozessjetzt--warn strong { color:var(--rot); }
.prozessweitere { padding:14px 18px; border-top:1px solid var(--border); }
.prozessweitere summary { cursor:pointer; font-size:13px; }
.prozessweitere>.prozesspunkte { margin-top:14px; }
.prozesspunkte--liste .prozesspunkt summary { display:grid; grid-template-columns:2fr 1fr 1fr; gap:12px; }
.prozessweitere>.prozesspunkte .prozesspunkt { max-width:700px; }
.benachrichtigung-form { max-width:800px; }
.benachrichtigung-felder { margin:18px 0; padding:20px; border:1px solid var(--border); border-radius:8px; }
.benachrichtigung-felder legend { padding:0 8px; font-weight:600; }
.benachrichtigung-felder:disabled { opacity:.6; }
.hinweiswahl { display:flex; gap:9px; align-items:center; padding:8px 0; }
.benachrichtigung-form p { max-width:70ch; }
.netz { position:relative; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:35px; align-items:start; padding:6px 0 20px; }
.netz__spalte { position:relative; z-index:1; min-width:0; }
.netz__spalte h4 { font-size:12px; color:var(--text-2); margin:0 0 14px; }
.netzknoten { display:block; width:100%; text-align:left; border:1px solid var(--border-2); border-radius:7px; background:var(--surface); color:var(--text); padding:12px; margin:0 0 16px; font:inherit; cursor:pointer; }
.netzknoten strong,.netzknoten small,.netzknoten span { display:block; overflow-wrap:anywhere; }
.netzknoten strong { font-size:13px; }
.netzknoten small,.netzknoten span { font-size:11px; color:var(--text-2); }
.netzknoten--warn { border-left:3px solid var(--rot); }
.netzknoten[aria-pressed="true"] { outline:2px solid var(--arbeits-akzent); outline-offset:2px; }
.netzknoten.ist-ferner { opacity:.35; }
.netz__linien { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; overflow:visible; }
.netz__linien path { fill:none; stroke:var(--border-2); stroke-width:1.5; }
.netz__linien path.ist-ausgewaehlt { stroke:var(--arbeits-akzent); stroke-width:2; }
.netz__linien path.ist-ferner { opacity:.15; }
[data-network-detail] { padding:12px 0; font-size:14px; }
[data-network-detail] a { margin-left:12px; }
[data-network-detail] li a { margin-left:0; }
[data-network-detail] li { margin:8px 0; }
[data-network-detail] button { margin-left:16px; }
/* Liste und Detail bleiben zusammen; Verlauf und Aktionen wandern nicht mehr unter die Liste. */
@media(min-width:1000px) {
    .zweispalt { grid-template-columns:minmax(270px,.7fr) minmax(0,1.65fr); gap:22px; }
    .zweispalt__liste { max-height:none; position:static; overflow:visible; }
    .zweispalt__liste>.karte { max-height:none; overflow:visible; }
    .zweispalt__liste .postliste { overflow:visible; max-height:none; }
}
@media(max-width:1200px) {
    .arbeitszahlen { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .seitenauftakt { align-items:flex-start; flex-direction:column; }
    .arbeitszahl>span { min-height:0; }
}
@media(max-width:760px) {
    .arbeitszeile { grid-template-columns:1fr; gap:8px; padding:16px; }
    .arbeitszeile>span:last-child { display:none; }
    .arbeitszeile>div:not(:first-child) { display:flex; flex-wrap:wrap; gap:8px; align-items:baseline; }
    .arbeitszeile span { margin:0; }
    .netz { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
    .netz__linien { display:none; }
    .prozesspunkte--liste .prozesspunkt summary { display:block; }
    .statistikbereich .uebersicht { grid-template-columns:1fr; }
}
@media(max-width:440px) {
    .arbeitszahlen { gap:8px; }
    .arbeitszahl { padding:13px; }
    .arbeitszahl>strong { font-size:28px; }
    .arbeitszahl small { display:none; }
    .arbeitskopf { padding:12px; }
    .arbeitskopf__titel { display:block; }
    .arbeitskopf__marken { margin-top:6px; justify-content:flex-start; }
    .aufgabe__aktionen { margin-left:0; }
    .erinnerung[open]>form { right:auto; left:0; }
    .netz { grid-template-columns:1fr; }
}
@media print {
    .arbeitskopf,.prozesskarte { break-inside:auto; }
    .ansichtschalter,.arbeitsfilter,.erinnerung, .handlungszeile form, .aufgabe__aktionen, .fristfuss__knopf { display:none!important; }
    .prozesspunkt { break-inside:avoid; }
    .netz { display:none; }
}

[hidden] { display:none!important; }
.listenblaettern { display:flex; align-items:center; gap:16px; padding:18px; }
.prozesspunkt::after { content:""; width:7px; height:7px; border-right:1px solid var(--text-3); border-bottom:1px solid var(--text-3); transform:translateY(6px) rotate(45deg); }
.kopf__logo { max-width:160px; }

/* Knoten im Ablagebaum: Reiter „Einstellungen" und „Empfänger" im Dialog. */
.knoten-reiter>.ftabs { margin:-18px -20px 16px; }
.karte__leib>.knoten-reiter>.ftabs { margin:-16px -16px 16px; }
.knotenempfaenger__block+.knotenempfaenger__block { margin-top:18px; padding-top:14px; border-top:1px solid var(--border); }
.knotenempfaenger__zeichen { width:15px; height:15px; margin-right:6px; vertical-align:-3px; color:var(--text-3); flex:none; }
.knotenempfaenger__kopf { display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; margin:0 0 6px; }
.knotenempfaenger__leer { margin:0; font-size:13px; color:var(--text-3); }
.knotenempfaenger__leer.warn { color:var(--rot); }
.personenliste { list-style:none; margin:0; padding:0; }
.personenliste>li { display:flex; flex-wrap:wrap; align-items:center; gap:4px 10px; padding:7px 0; border-top:1px solid var(--border); font-size:13.5px; }
.personenliste>li:first-child { border-top:0; }
.personenliste>li .knotenempfaenger__zeichen { margin-right:0; }
.personenliste__aktion { margin:0 0 0 auto; }
.personenliste__aktion .knopf--klein { padding:4px 9px; font-size:12.5px; line-height:1.35; }
.marke__icon { width:11px; height:11px; margin-right:3px; vertical-align:-1px; }
.externneu { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr) auto; gap:8px 10px; align-items:end; margin-top:12px; padding:12px; border:1px dashed var(--border-2); border-radius:7px; background:var(--surface-2); }
.externneu label { display:flex; flex-direction:column; gap:4px; min-width:0; font-size:12.5px; font-weight:600; color:var(--text-2); }
.externneu .knopf--klein { padding:6px 12px; font-size:13px; line-height:1.35; white-space:nowrap; }
@media (max-width:760px) { .externneu { grid-template-columns:1fr 1fr; } .externneu__knopf { grid-column:1 / -1; } }

/* Externe Empfänger beim Schriftstück: vorausgefüllt, gesendet per Klick. */
.aufgabe--extern { border-left-color:var(--teal); background:color-mix(in srgb, var(--teal) 5%, var(--surface)); }
.aufgabe--extern.aufgabe--warn { border-left-color:var(--rot); background:color-mix(in srgb, var(--rot) 6%, var(--surface)); }
.aufgabe--extern .aufgabe__zeichen { color:var(--teal-ink); }
.externsenden { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; margin:0; }
.externsenden__vertraulich { display:inline-flex; align-items:center; gap:5px; font-size:12px; font-weight:600; color:var(--rot); cursor:pointer; }
.externblock { border-top:1px solid var(--border); }
.externblock .aufgabe:first-of-type { margin-top:4px; }