@font-face { font-family: "Hanken Grotesk"; src: url(/schrift/hanken-grotesk-variabel-latin-ext.woff2?v=a1376a56) format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "IBM Plex Mono"; src: url(/schrift/ibm-plex-mono-400-latin-ext.woff2?v=f1050dc5) format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "IBM Plex Mono"; src: url(/schrift/ibm-plex-mono-500-latin-ext.woff2?v=77f03e26) format("woff2"); font-weight: 500; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Hanken Grotesk"; src: url(/schrift/hanken-grotesk-variabel-latin.woff2?v=1f21c6ea) format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url(/schrift/ibm-plex-mono-400-latin.woff2?v=c36f509c) format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url(/schrift/ibm-plex-mono-500-latin.woff2?v=a76f53ca) format("woff2"); font-weight: 500; font-display: swap; }

:root {
  color-scheme: light;
  --schrift: "Hanken Grotesk", system-ui, sans-serif;
  
  --schrift-bild: "Hanken Grotesk", system-ui, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, monospace;
  --grund: #f5f1ea;
  --erhoben: #ece6da;
  --text: #11212d;
  --text-leise: #4a5d6e;
  --trennlinie: #d4c6ac;
  --feldrand: #8a7f6d;
  --knopf-flaeche: #244055;
  --knopf-schrift: #f5f1ea;
  --akzent: #c98b3b;
  
  --akzent-text: color-mix(in srgb, var(--akzent) 60%, var(--text));
  --warnung: #a33a2a;
  
  --overlay: rgba(10, 21, 28, 0.55);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-modus="hell"]) {
    color-scheme: dark;
    --grund: #0a151c; --erhoben: #1a3041; --text: #f5f1ea; --text-leise: #a8b5c0;
    --trennlinie: #2a4356; --feldrand: #6b8299;
    --knopf-flaeche: #f5f1ea; --knopf-schrift: #0a151c;
    --akzent: #e6c089; --warnung: #e8917d;
    --akzent-text: var(--akzent);
  }
}
:root[data-modus="dunkel"] {
  color-scheme: dark;
  --grund: #0a151c; --erhoben: #1a3041; --text: #f5f1ea; --text-leise: #a8b5c0;
  --trennlinie: #2a4356; --feldrand: #6b8299;
  --knopf-flaeche: #f5f1ea; --knopf-schrift: #0a151c;
  --akzent: #e6c089; --warnung: #e8917d;
  --akzent-text: var(--akzent);
}


.marke-logo-dunkel { display: none; }
@media (prefers-color-scheme: dark) {
  :root:not([data-modus="hell"]) .marke-logo-hell { display: none; }
  :root:not([data-modus="hell"]) .marke-logo-dunkel { display: inline; }
}
:root[data-modus="dunkel"] .marke-logo-hell { display: none; }
:root[data-modus="dunkel"] .marke-logo-dunkel { display: inline; }


.marke-wortmarke { display: inline-flex; align-items: center; gap: 12px; white-space: nowrap; vertical-align: middle; }
.produkt-name { padding-left: 12px; border-left: 1px solid var(--trennlinie); font-size: 16px; font-weight: 600;
                letter-spacing: -0.02em; line-height: 24px; }

.pn-oeffnen { display: inline-grid; }
.pn-oeffnen > span { grid-area: 1 / 1; }
.pn-geist { visibility: hidden; }

.pn-bewegt { contain: inline-size; }
.pn-rest { display: inline-grid; grid-template-columns: 1fr; animation: pn-oeffnen 900ms cubic-bezier(0.65, 0, 0.35, 1) 2s both; }
.pn-rest > span { min-width: 0; overflow: hidden; animation: pn-ueberlauf 0s linear 2.9s both; }
@keyframes pn-oeffnen { from { grid-template-columns: 0fr; } to { grid-template-columns: 1fr; } }

@keyframes pn-ueberlauf { from { overflow: hidden; } to { overflow: visible; } }
@media (prefers-reduced-motion: reduce) { .pn-rest { animation: none; } .pn-rest > span { animation: none; overflow: visible; } }

* { box-sizing: border-box; }

html { scrollbar-gutter: stable; }
body { margin: 0; background: var(--grund); color: var(--text); font-family: var(--schrift);
       font-size: 15px; line-height: 1.5; -webkit-font-smoothing: antialiased; }

header { position: relative; display: flex; align-items: center; gap: 28px; padding: 0 24px;
         min-height: 56px; border-bottom: 1px solid var(--trennlinie); flex-wrap: wrap; }
header .produkt { font-weight: 600; letter-spacing: -0.02em; white-space: nowrap; }

header a.produkt { color: inherit; text-decoration: none; }

header .kopf-rechts { margin-left: auto; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; justify-content: flex-end; }

header .person { font-size: 13.5px; color: var(--text-leise); flex-shrink: 0; overflow-wrap: anywhere; }

.modus { display: flex; }

.modus-sym { display: inline-flex; }

.modus-sym[hidden] { display: none; }
.modus button { display: inline-flex; align-items: center; justify-content: center;
                width: 34px; height: 34px; padding: 0; background: transparent;
                color: var(--text-leise); border: 1px solid var(--feldrand); border-radius: 6px;
                cursor: pointer; }

.nur-fuer-vorleser { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
                     overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.umschalter { display: flex; }

.umschalter button { font: 500 12px/1 var(--mono); background: transparent; color: var(--text-leise);
                     border: 1px solid var(--feldrand); height: 34px; padding: 0 10px; cursor: pointer; }
.umschalter button[disabled] { background: var(--erhoben); color: var(--text); opacity: 1; }

main { padding: 28px 24px 40px; max-width: 1180px; }

.leiste-rahmen { display: grid; grid-template-columns: 232px minmax(0, 1fr); align-items: start;
                 background: linear-gradient(var(--trennlinie), var(--trennlinie)) 231px 0 / 1px 100% no-repeat; }
.leiste-rahmen > main { grid-column: 2; grid-row: 1; min-width: 0; }

.seitenleiste { grid-column: 1; grid-row: 1; align-self: start; padding: 20px 12px 32px; }
.leiste-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.leiste-punkt { display: flex; align-items: center; gap: 10px; padding: 8px 10px 8px 9px; border-radius: 6px;
                border-left: 3px solid transparent; color: var(--text-leise); text-decoration: none;
                font: 400 14px/1.3 var(--schrift); cursor: pointer; list-style: none; }
.leiste-punkt svg { flex: none; }
.leiste-punkt > span { min-width: 0; }
summary.leiste-punkt::-webkit-details-marker { display: none; }
summary.leiste-punkt::after { content: "\25B8"; content: "\25B8" / ""; margin-left: auto; font-size: 11px; color: var(--text-leise); }
.leiste-gruppe[open] > summary.leiste-punkt::after { content: "\25BE"; content: "\25BE" / ""; }
.leiste-gruppe.enthaelt-aktiv > summary.leiste-punkt { color: var(--text); font-weight: 500; }
.leiste-unter { list-style: none; margin: 2px 0 6px; padding: 0 0 0 31px; display: flex; flex-direction: column; gap: 2px; }
.leiste-unterpunkt { display: block; padding: 6px 10px 6px 9px; border-radius: 6px; border-left: 3px solid transparent;
                     color: var(--text-leise); text-decoration: none; font: 400 13.5px/1.3 var(--schrift); }
.leiste-punkt:hover, .leiste-unterpunkt:hover { background: var(--erhoben); color: var(--text); }

.leiste-punkt[aria-current="page"], .leiste-unterpunkt[aria-current="page"] { background: var(--erhoben); color: var(--text);
  font-weight: 500; border-left-color: var(--akzent-text); }
.leiste-verwaltung { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--trennlinie); }
.menue-schmal { display: none; }
.menue-knopf { display: inline-flex; align-items: center; gap: 8px; list-style: none; cursor: pointer;
               border: 1px solid var(--feldrand); border-radius: 6px; padding: 7px 12px;
               font: 500 13.5px/1 var(--schrift); color: var(--text); }
.menue-knopf::-webkit-details-marker { display: none; }
.menue-knopf svg { flex: none; }
.menue-ort { font-weight: 400; color: var(--text-leise); }
.menue-schmal[open] > .menue-knopf { margin-bottom: 10px; }
.menue-inhalt .leiste-verwaltung { margin-top: 10px; padding-top: 10px; }
@media (max-width: 1255px) {
  .leiste-rahmen { display: block; background: none; }
  .seitenleiste { display: none; }
  .menue-schmal { display: block; padding: 10px 16px; border-bottom: 1px solid var(--trennlinie); }
}

footer { padding: 14px 24px; border-top: 1px solid var(--trennlinie);
         font: 400 12px/1 var(--mono); color: var(--text-leise); }

.sichtkopf { display: flex; align-items: baseline; gap: 16px; margin-bottom: 20px; }

.hilfe-inhalt ol { margin: 0 0 24px; padding-left: 20px; columns: 2 220px; column-gap: 32px; }
.hilfe-inhalt a[aria-current] { font-weight: 600; }

.hilfe-nach-oben { --rand: max(0px, calc(100% - 72ch)); }
.hilfe-kapitel > .hilfe-nach-oben { float: right; margin: 3px var(--rand) 4px 16px; }
.hilfe-handbuch > .hilfe-nach-oben { display: block; width: fit-content; margin: -16px var(--rand) 32px auto; }
#hilfe-verzeichnis { scroll-margin-top: 16px; }

.fehler-wuensche > .hilfe-nach-oben { float: right; margin: 3px var(--rand) 4px 16px; }
.hilfe-kapitel h2[id], .hilfe-kapitel h3[id], #fehler-wuensche { scroll-margin-top: 16px; }

.hilfe-kapitel > :not(.hilfe-bild) { max-width: 72ch; }
.hilfe-kapitel { margin-bottom: 32px; }
.hilfe-kapitel h2 { font-size: 17px; font-weight: 600; margin: 0 0 8px; }
.hilfe-kapitel h3 { font-size: 14.5px; font-weight: 600; margin: 16px 0 6px; }

.ueber-angaben { display: grid; grid-template-columns: fit-content(45%) minmax(0, 1fr); gap: 4px 16px; margin: 0 0 12px; }
.ueber-angaben > div { display: contents; }
.ueber-angaben dt { color: var(--text-leise); }
.ueber-angaben dd { margin: 0; overflow-wrap: break-word; }

.ueber-tabelle-rahmen { overflow-x: auto; margin: 0 0 12px; }

.hilfe-bild[data-rollt], .ueber-tabelle-rahmen[data-rollt] {
  -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 56px), transparent);
  mask-image: linear-gradient(to right, #000 calc(100% - 56px), transparent);
}
.ueber-tabelle { border-collapse: collapse; font-variant-numeric: tabular-nums; }
.ueber-tabelle th, .ueber-tabelle td { padding: 4px 12px 4px 0; border-bottom: 1px solid var(--trennlinie); white-space: nowrap; }
.ueber-tabelle thead th { font-weight: 600; text-align: right; }
.ueber-tabelle thead th:first-child, .ueber-tabelle tbody th { text-align: left; font-weight: 400; }
.ueber-tabelle td { text-align: right; }

.ueber-tabelle thead th:first-child, .ueber-tabelle tbody th { position: sticky; left: 0; background: var(--grund); }

.hilfe-bild { margin: 16px 0 20px; overflow-x: auto; }
.hilfe-bild svg { display: block; width: 100%; height: auto; max-width: 720px; font-family: var(--schrift-bild); }
.hilfe-bild .hb-kasten { fill: var(--erhoben); stroke: var(--trennlinie); stroke-width: 1.5; }
.hilfe-bild .hb-mitte { stroke: var(--akzent); stroke-width: 2; }
.hilfe-bild .hb-titel { fill: var(--text); font-size: 15px; font-weight: 600; }
.hilfe-bild .hb-unter { fill: var(--text-leise); font-size: 12.5px; }
.hilfe-bild .hb-beschrift { fill: var(--text-leise); font-size: 11.5px; }
.hilfe-bild .hb-linie { stroke: var(--text-leise); stroke-width: 1.5; fill: none; }
.hilfe-bild .hb-haken { stroke: var(--text-leise); stroke-width: 1.5; stroke-dasharray: 4 3; fill: none; }
.hilfe-bild .hb-spitze { fill: var(--text-leise); }

.hilfe-bild .hb-ki { stroke: var(--akzent); stroke-width: 2; }
.hilfe-bild .hb-auto { stroke-dasharray: 6 4; }

.sichtkopf { flex-wrap: wrap; }
.sichtkopf .hilfe-link { margin-left: auto; }
.hilfe-link { font-size: 12.5px; color: var(--akzent-text); text-decoration: underline; }   

.hilfe-inhalt a, .hilfe-handbuch a, .fehler-wuensche > .hilfe-nach-oben, .meldung a:not(.knopf), .fw-zurueck a { color: var(--akzent-text); text-decoration: underline; }
.hilfe-kopf { margin: 4px 0 0; }
.abschnitt-hilfe { margin: 12px 0 0; }

.fehler-wuensche { margin-top: 40px; }
.fehler-wuensche h2 { font-size: 17px; font-weight: 600; margin: 0 0 12px; }

.fw-filter { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin: 0 0 12px; }
.fw-liste { list-style: none; margin: 0; padding: 0; }

.fw-zeile { display: grid; grid-template-columns: 64px 128px minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr) 96px; gap: 12px; padding: 10px 0;
  border-bottom: 1px solid var(--trennlinie); color: inherit; text-decoration: none; }
.fw-zeile > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fw-datum, .fw-person, .fw-seite, .fw-zustand { color: var(--text-leise); }

.fw-erledigte { margin-top: 16px; }
.fw-erledigte > summary { cursor: pointer; font-weight: 500; padding: 8px 0; }
.fw-anfang { color: var(--text); }
.fw-leer { color: var(--text-leise); }
.fw-liste-gekappt { color: var(--text-leise); margin: 12px 0 0; }   
.fw-text { white-space: pre-wrap; overflow-wrap: anywhere; max-width: 72ch; margin: 0 0 20px; }
.fw-angaben { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 6px 16px; margin: 0 0 20px; }
.fw-angaben dt { color: var(--text-leise); }
.fw-angaben dd { margin: 0; overflow-wrap: anywhere; }
.fw-anhaenge-liste { margin: 0 0 20px; padding-left: 20px; }
.fw-zurueck { margin-top: 24px; }
.meldung h2 { font-size: 15px; font-weight: 600; margin: 20px 0 8px; }

.fehler-wunsch-knopf { white-space: nowrap; }
.fehler-wunsch-formular .fw-formular { margin-top: 8px; }
.fw-formular { max-width: 72ch; }
.fw-anhaenge { margin: 12px 0; }
.fw-anhang-datei { max-width: 100%; }

.feld input.fw-anhang-datei { font: 13.5px var(--schrift); }

.fw-anhang-datei::file-selector-button { font: 500 13.5px/1 var(--schrift); background: transparent; color: var(--text);
  border: 1px solid var(--feldrand); border-radius: 6px; padding: 8px 15px; margin-right: 12px; cursor: pointer; }
.fw-formular textarea { width: 100%; }
.fw-hinweis { color: var(--warnung); margin: 0 0 12px; }
.fw-ohne-ablage, .fw-mitgesendet { color: var(--text-leise); margin: 12px 0; }
.fw-status { margin: 12px 0; }
.fw-anhang-senden { margin-top: 8px; }

.hilfe-frag { max-width: 72ch; margin: 0 0 28px; }
.hilfe-frag h2 { font-size: 17px; font-weight: 600; margin: 0 0 8px; }
.hilfe-frag textarea { width: 100%; }
.hilfe-frag-hinweis, .hilfe-frag-deckel { color: var(--text-leise); margin: 0 0 12px; }
.hilfe-frag-antwort { white-space: pre-wrap; overflow-wrap: anywhere; margin: 16px 0 12px; padding: 12px 14px; background: var(--erhoben);
  border: 1px solid var(--trennlinie); border-radius: 8px; color: var(--text); }
.hilfe-frag-fehler { color: var(--warnung); margin: 16px 0 12px; }
.hilfe-frag-fw { margin: 0; }

.hilfe-frag .knopf-laedt { animation-name: knopf-laedt-puls-voll; }
@keyframes knopf-laedt-puls-voll { 0%, 100% { opacity: 1; } 50% { opacity: 0.9; } }
@media (prefers-reduced-motion: reduce) { .hilfe-frag .knopf-laedt { animation: none; opacity: 1; } }

.fw-admin { margin-top: 24px; }
.fw-admin-form { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin: 0 0 12px; }
.fw-entfernen { margin: 12px 0 0; }
.fw-anhang-entfernen { font-size: 12.5px; margin-left: 8px; }
.fw-rueckfrage { border: 1px solid var(--warnung); padding: 12px; margin: 0 0 20px; }
.fw-rueckfrage-form { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.konfiguration-kopf { margin-bottom: 0; }
h1 { font-size: 21px; font-weight: 600; letter-spacing: -0.02em; margin: 0; }
.zaehler { font: 500 12.5px/1 var(--mono); color: var(--text-leise); letter-spacing: 0.03em; }


.knopf { font: 500 13.5px/1 var(--schrift); background: var(--knopf-flaeche);
         color: var(--knopf-schrift); border: 1px solid transparent; border-radius: 6px;
         padding: 8px 15px; cursor: pointer; }
.knopf-umriss { background: transparent; color: var(--text); border-color: var(--feldrand); }

.knopf-gefahr { background: transparent; color: var(--warnung); border: 1px solid var(--warnung);
                border-radius: 6px; padding: 8px 15px; font: 500 13.5px/1 var(--schrift);
                cursor: pointer; }

:is(button, a, select, input, summary):focus-visible { outline: 2px solid var(--akzent-text); outline-offset: 2px; }
button[disabled] { cursor: default; }

.knopf[disabled], .knopf-gefahr[disabled] { opacity: 0.45; cursor: default; }

.liste { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--trennlinie); }
.liste > li { border-bottom: 1px solid var(--trennlinie); }

.zeile { display: grid; grid-template-columns: 62px 1fr 128px 248px 152px; align-items: center;
         gap: 16px; min-height: 52px; padding: 0 12px 0 9px; border-left: 3px solid transparent;
         text-decoration: none; color: inherit; }
.zeile:hover { background: var(--erhoben); }
.zeile.frist-bald { border-left-color: var(--akzent); }
.zeile.frist-ueber { border-left-color: var(--warnung); }

.naechster { display: block; padding: 0 12px 12px 90px; font: 400 12.5px/1.35 var(--schrift);
             color: var(--text-leise); }

.neue-post { display: block; padding: 0 12px 10px 90px; font: 500 12.5px/1.35 var(--schrift);
             color: var(--text); }
.neue-post::before { content: "●"; color: var(--akzent); margin-right: 6px; font-size: 0.9em; }

.neu-am-vorgang { margin: 0 0 14px; padding: 12px 14px; border-radius: 8px; background: var(--erhoben);
  border: 1px solid var(--feldrand); min-width: 0; overflow-wrap: anywhere; display: flex; flex-direction: column; gap: 10px; }
.neu-am-vorgang-titel { margin: 0; font: 500 12px/1.3 var(--mono); letter-spacing: 0.05em; text-transform: uppercase; color: var(--text); }
.neu-mail { margin: 0; font: 400 13px/1.45 var(--schrift); color: var(--text); }

.neu-mail a { color: var(--akzent-text); text-decoration: underline; }
.neu-kollisionen { margin: 0; padding: 0; list-style: none; }
.neu-kollisionen .ablage-kollision { border-color: var(--feldrand); background: var(--grund); }
.marke-neu { margin-left: 6px; }
.neu-am-vorgang-aktionen { margin: 0; }
#teil-vorgang [id^="mail-"] { scroll-margin-top: 16px; }
.kennung { font: 500 12.5px/1 var(--mono); letter-spacing: 0.04em; color: var(--text-leise); }
.zeile.frist-ueber .kennung { color: var(--text); }

.titel { font-weight: 500; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.frist { font: 400 12.5px/1.4 var(--mono); color: var(--text-leise); white-space: nowrap; }
.zustand { font: 400 12.5px/1.4 var(--mono); color: var(--text-leise); }

.uhr-bald, .frist.uhr-bald { color: var(--text); }
.uhr-ueber, .frist.uhr-ueber { color: var(--warnung); font-weight: 500; }

.traeger { font-size: 13px; color: var(--text-leise); text-align: right;
           min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.typspalte { font: 400 12.5px/1.4 var(--mono); color: var(--text-leise); min-width: 0;
             overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zeile.mit-typ { grid-template-columns: 62px 1fr 96px 128px 248px 152px; }


.filterleiste { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin-bottom: 22px; }
.filter-feld { display: flex; flex-direction: column; gap: 5px; }
.filter-feld > span { font: 500 11.5px/1 var(--mono); letter-spacing: 0.05em; text-transform: uppercase;
                      color: var(--text-leise); }
.filter-feld :is(input, select) { font: 400 14px/1 var(--schrift); color: var(--text); background: var(--grund);
  border: 1px solid var(--feldrand); border-radius: 6px; padding: 0 10px; height: 36px; min-width: 168px; }
.filter-suche { flex: 1 1 240px; }
.filter-suche input { width: 100%; min-width: 0; }


.filter-suche-hinweis { flex: 0 0 100%; margin-top: -2px; font: 400 12px/1.35 var(--schrift); color: var(--text-leise); }
.filterleiste .filter-zuruecksetzen { height: 36px; }

.filter-ki { display: flex; align-items: center; gap: 7px; align-self: flex-end; height: 36px;
  font: 400 14px/1 var(--schrift); color: var(--text); white-space: nowrap; cursor: pointer; }
.filter-ki input { width: 16px; height: 16px; margin: 0; accent-color: var(--akzent); }
.ki-suche-hinweis { color: var(--text-leise); font-size: 13px; margin: -14px 0 18px; max-width: 70ch; }
.ki-suche-fehler { color: var(--warnung); font-size: 13px; margin: -14px 0 18px; max-width: 70ch; }


.liste > li.gruppe { border-bottom: none; display: flex; align-items: baseline;
  justify-content: space-between; gap: 12px; padding: 16px 10px 6px; }
.liste > li.gruppe:first-child { padding-top: 4px; }



.traeger-liste { border-top: 1px solid var(--trennlinie); }
.traeger-kopf, .traeger-zeile { display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) 72px 72px 18px; gap: 0 14px; align-items: baseline; }
.traeger-kopf { font: 500 11.5px/1 var(--mono); letter-spacing: 0.05em; text-transform: uppercase;
  color: var(--text-leise); padding: 10px 14px; border-bottom: 1px solid var(--trennlinie); }
.traeger-eintrag { border-bottom: 1px solid var(--trennlinie); }
.traeger-eintrag:last-child { border-bottom: 0; }
.traeger-zeile { padding: 11px 14px; cursor: pointer; list-style: none; }
.traeger-zeile::-webkit-details-marker { display: none; }
.traeger-eintrag.ich > .traeger-zeile { background: var(--erhoben); box-shadow: inset 3px 0 0 var(--akzent); }
.traeger-rollen { color: var(--text-leise); overflow-wrap: anywhere; }
.traeger-name { overflow-wrap: anywhere; }
.traeger-name .marke { font: 500 11px/1 var(--mono); letter-spacing: 0.05em; color: var(--text-leise); margin-left: 6px; }
.traeger-zeile .num { text-align: right; font: 400 13px/1 var(--mono); white-space: nowrap; color: var(--text-leise); }
.traeger-zeile .num.heiss { color: var(--text); font-weight: 600; }
.traeger-chevron::before { content: "\25B8"; font-size: 11px; color: var(--text-leise); }
.traeger-eintrag[open] .traeger-chevron::before { content: "\25BE"; }
.traeger-vorgaenge { list-style: none; margin: 0; padding: 2px 14px 12px 28px; display: flex;
  flex-direction: column; gap: 6px; }

.traeger-vorgaenge a { color: var(--akzent-text); text-decoration: underline; overflow-wrap: anywhere; }

.fuss2 { margin: 16px 0 0; max-width: 720px; font: 400 12.5px/1.5 var(--schrift); color: var(--text-leise); }
.gruppe-titel { font: 500 11.5px/1 var(--mono); letter-spacing: 0.06em; text-transform: uppercase;
                color: var(--text-leise); }
.gruppe-zahl { font: 500 12px/1 var(--mono); color: var(--text-leise); }

summary.gruppe-kopf { cursor: pointer; list-style: none; display: flex; align-items: baseline; justify-content: space-between;
  gap: 12px; padding: 16px 10px 6px; border-radius: 8px; }
summary.gruppe-kopf::-webkit-details-marker { display: none; }
summary.gruppe-kopf > .gruppe-titel::before { content: "\25B8\00A0"; content: "\25B8\00A0" / ""; }
.gruppe-klapp[open] > summary.gruppe-kopf > .gruppe-titel::before { content: "\25BE\00A0"; content: "\25BE\00A0" / ""; }
summary.gruppe-kopf:hover { background: var(--erhoben); }

.anlegen-block { margin-bottom: 22px; }

.meldung-anlegen-weg { margin: 0 0 22px; }
.anlegen-block > summary { cursor: pointer; display: inline-block; font: 500 13.5px/1 var(--schrift);
  background: var(--knopf-flaeche); color: var(--knopf-schrift); border-radius: 6px;
  padding: 9px 16px; list-style: none; }
.anlegen-block > summary::-webkit-details-marker { display: none; }

.email-aendern, .person-anlegen, .zuweisung-beginnen, .stufe-anlegen, .rolle-anlegen,
.feiertag-anlegen, .instanz-aendern, .verkauf-aendern, .postfach-anlegen {
  display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; }
.anlegen, .person-anlegen, .zuweisung-beginnen, .stufe-anlegen, .rolle-anlegen,
.feiertag-anlegen, .instanz-aendern, .verkauf-aendern, .postfach-anlegen { margin-top: 16px; }

.person-anlegen, .zuweisung-beginnen { margin-bottom: 22px; }

.email-aendern .feld :is(input, select),
.person-anlegen .feld input[type="email"] { min-width: 40ch; }


.feldzeile { display: grid; column-gap: 20px; grid-template-rows: auto auto auto; margin-bottom: 20px; }
.feldzeile.z1 { grid-template-columns: 1fr; }
.feldzeile.z3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.feldzeile > .feld { display: grid; grid-row: span 3; grid-template-rows: subgrid; row-gap: 0; }

.feldzeile > .feld > span { align-self: start; }
.feldzeile > .feld .hilfe { align-self: end; padding-bottom: 7px; max-width: none; }

.feldzeile > .feld .hilfe:empty { display: block; }

.feldzeile > .feld .hilfe:not(:empty) { padding-top: 3px; }


.nur-mit-js { display: none; }

.feld.nur-mit-js { display: none; }

[data-mit-js] .rueckfrage-abbrechen { display: inline-block; }

[data-mit-js] .pruefkatalog-einlesen { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; margin-top: 16px; }
.pruefkatalog-datei { max-width: 100%; }

.compliance-ausloesen-block { display: grid; gap: 16px; padding: 12px 0 4px; min-width: 0; }
.compliance-rolle { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; min-width: 0; }
.compliance-ausloesen { display: grid; gap: 14px; max-width: 48rem; min-width: 0; }

.compliance-ausloesen > .feld, .compliance-ausloesen > .feld select { min-width: 0; max-width: 100%; }
.compliance-ausloesen > .feld select { overflow: hidden; }
fieldset.compliance-wahl { display: flex; flex-wrap: wrap; gap: 8px 18px; min-width: 0; }
fieldset.compliance-wahl > legend { width: 100%; padding: 0; margin-bottom: 4px; font-weight: 500; }
.compliance-ausloesen > .knopf { justify-self: start; }

.durchlauf-block { display: grid; gap: 12px; margin: 22px 0 0; min-width: 0; max-width: 48rem; }
.durchlauf-block > h2 { margin: 0; }
.durchlauf-block > p { margin: 0; }

.meldung-block h3 { margin: 6px 0 0; }

.meldung-block, .treffer-block { margin-bottom: 22px; }
.meldung-neu .feld input[type="text"] { width: 340px; max-width: 100%; }
.cmp-angaben { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 8px 18px; margin: 0; }
.cmp-angaben dt { font: 500 11.5px/1.6 var(--mono); letter-spacing: 0.05em; text-transform: uppercase; color: var(--text-leise); }
.cmp-angaben dd { margin: 0; overflow-wrap: anywhere; }
.cmp-auswahl { display: flex; flex-direction: column; gap: 5px; }
.cmp-auswahl > span { font: 500 11.5px/1 var(--mono); letter-spacing: 0.05em; text-transform: uppercase; color: var(--text-leise); }
.cmp-wahl { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 4px 0; }
.mel-form fieldset { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; min-width: 0; margin: 0; padding: 0; border: 0; }
.mel-form .feld-reihe { display: flex; flex-wrap: wrap; gap: 10px 18px; }
.mel-form textarea { width: 340px; max-width: 100%; }
.mel-form button { align-self: flex-start; }
.mel-zeitpunkte .wert.leer, .mel-fristen .wert.leer { color: var(--text-leise); font-style: italic; }
.mel-zeitpunkte .wert, .mel-fristen .wert { overflow-wrap: anywhere; }

.mel-vorschau { border-left: 3px solid var(--akzent-text); background: var(--erhoben); padding: 10px 14px; overflow-wrap: anywhere;
                display: flex; flex-direction: column; gap: 8px; }
.mel-vorschau > h3 { margin: 0; }
.mel-vorschau > p, .mel-vorschau > ul { margin: 0; }
.mel-vorschau > ul { padding-left: 18px; }
.mel-vorschau-form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; }
.mel-vorschau-form a { color: var(--akzent-text); text-decoration: underline; }
.durchlauf-geraete-block > .durchlauf-geraete { margin-bottom: 0; }
.durchlauf-geraet-form { display: grid; gap: 14px; min-width: 0; }
.durchlauf-geraet-form > .knopf, .durchlauf-erklaerung > .knopf { justify-self: start; }
.durchlauf-anleitung, .durchlauf-erklaerung { min-width: 0; }
.durchlauf-pruefpunkte:empty { display: none; }

.abweichung-block > .inbox-felder { margin: 0; }

.durchlauf-pruefpunkte { display: grid; gap: 12px; margin: 22px 0 0; min-width: 0; max-width: 48rem; }
.durchlauf-pruefpunkte > h2, .durchlauf-stand { margin: 0; }
.durchlauf-stand { font: 500 14px/1.35 var(--schrift); }
details.pruefgruppe { border-top: 1px solid var(--trennlinie); padding-top: 10px; min-width: 0; }
details.pruefgruppe > summary { cursor: pointer; font: 600 15px/1.35 var(--schrift); }
.pruefgruppe-stand { margin-left: 8px; font: 400 13px/1.35 var(--schrift); color: var(--text-leise); }
.pruefpunkte-liste { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 0; min-width: 0; }
li.pruefpunkt { display: grid; gap: 8px; padding: 10px 0; border-bottom: 1px solid var(--trennlinie); min-width: 0; }
li.pruefpunkt > .hinweis { margin: 0; }
.pruefpunkt-text { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; min-width: 0; }
.pruefpunkt-titel { font: 500 14px/1.4 var(--schrift); overflow-wrap: anywhere; min-width: 0; }
.pruefpunkt-quelle { font: 400 12.5px/1.35 var(--schrift); color: var(--text-leise); }
details.cmp-anleitung { flex-basis: 100%; min-width: 0; }
details.cmp-anleitung > summary { cursor: pointer; font: 500 13px/1.35 var(--schrift); color: var(--akzent-text); }
details.cmp-anleitung > p { margin: 6px 0 0; overflow-wrap: anywhere; }
form.pruefpunkt-form { display: grid; gap: 10px; min-width: 0; }

.compliance-filter { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin: 22px 0 0; min-width: 0; }

.compliance-filter .filter-feld, .compliance-filter .filter-feld select { min-width: 0; max-width: 100%; }
.compliance-filter .filter-feld select { overflow: hidden; }
.cmp-block { display: grid; gap: 10px; margin: 18px 0 0; min-width: 0; }
.cmp-block > h2, .cmp-block > p { margin: 0; }
.cmp-matrix-rahmen { max-width: 100%; overflow-x: auto; min-width: 0; }
.cmp-matrix { border-collapse: collapse; font: 400 13.5px/1.3 var(--schrift); }
.cmp-matrix th, .cmp-matrix td { padding: 7px 4px; border-bottom: 1px solid var(--trennlinie); text-align: center; vertical-align: top; }
.cmp-matrix thead th { font: 500 11px/1.2 var(--mono); letter-spacing: 0.04em; color: var(--text-leise); }
.cmp-matrix thead th abbr { text-decoration: none; white-space: nowrap; }   
.cmp-matrix .cmp-gruppe { border-left: 1px solid var(--trennlinie); text-transform: uppercase; }
.cmp-matrix .cmp-person, .cmp-matrix .cmp-person-kopf { text-align: left; padding-right: 16px; }
.cmp-matrix .cmp-person > a { color: var(--text); font-weight: 500; white-space: nowrap; }
.cmp-matrix .cmp-person small { display: block; font-family: var(--mono); }
.cmp-abweichungen { display: grid; gap: 2px; margin-top: 4px; font-weight: 400; font-size: 12.5px; white-space: nowrap; }
.cmp-abweichung { color: var(--akzent-text); }
.cmp-abweichung-offen { margin-left: 4px; color: var(--warnung); }   
.cmp-matrix .cmp-stand, .cmp-matrix .cmp-stand-kopf { text-align: left; padding-left: 14px; white-space: nowrap; font-size: 12.5px; }
.cmp-z { min-width: 26px; }
.cmp-z-nicht, .cmp-z-nicht a { color: var(--warnung); font-weight: 600; }
.cmp-z-offen, .cmp-z-nz_ohne_geraet { color: var(--text-leise); }
.cmp-legende { font-size: 12.5px; }
.cmp-lauf { font-size: 12.5px; }   
.cmp-links { display: flex; flex-wrap: wrap; gap: 8px 10px; align-items: center; }
.cmp-links .erklaer { flex-basis: 100%; }
form.pruefpunkt-form > .knopf { justify-self: start; }
fieldset.pruefpunkt-wahl { display: flex; flex-wrap: wrap; gap: 8px 18px; min-width: 0; }
fieldset.pruefpunkt-wahl > legend { width: 100%; padding: 0; margin-bottom: 4px; font-weight: 500; }
.pruefpunkt-nicht { display: grid; gap: 10px; min-width: 0; }
.pruefpunkt-nicht > .pruefpunkt-nur-nicht { margin: 0; }
.pruefpunkt-nicht textarea { width: 100%; }
[data-mit-js] form.pruefpunkt-form:not(:has(input[name="ergebnis"][value="nicht"]:checked)) .pruefpunkt-nicht { display: none; }
[data-mit-js] .pruefpunkt-nur-nicht { display: none; }
.pruefpunkt-ergebnis { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; min-width: 0; }
.pruefpunkt-zeichen { font-weight: 600; }
.pruefpunkt-ergebnis-wort { font-weight: 500; }
li.pruefpunkt-gesetzt > .pruefpunkt-text .kennung { color: var(--text); }
.pruefpunkt-abweichung { font: 500 13px/1.35 var(--schrift); }
details.pruefpunkt-aendern { flex-basis: 100%; min-width: 0; }
details.pruefpunkt-aendern > summary { cursor: pointer; font: 500 13px/1.35 var(--schrift); color: var(--akzent-text); }
details.pruefpunkt-aendern > p { margin: 6px 0 8px; }
.pruefpunkt-getippt { margin: 0; }
.pruefpunkt-getippt pre { margin: 4px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; font: 400 13px/1.4 var(--mono); }
.rueckfrage-knoepfe { display: inline-flex; flex-wrap: wrap; gap: 8px; align-self: end; }

details:not([open]) .rueckfrage-knoepfe { display: none; }

.feld.kombi-grund[hidden] { display: none; }


.anlegen-block[open] > summary { display: none; }
.kartenkopf { display: flex; align-items: center; justify-content: space-between; margin-bottom: 22px; }
.kartenkopf h2 { font: 600 16px/1.3 var(--schrift); margin: 0; }
.schliessen { width: 30px; height: 30px; border: 1px solid var(--trennlinie); border-radius: 8px;
              background: none; color: var(--text-leise); font: 400 15px/1 var(--schrift); cursor: pointer; }
.schliessen:hover { color: var(--text); }
.fuss { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
        border-top: 1px solid var(--trennlinie); margin-top: 4px; padding-top: 18px; }

.fuss-schlicht { border-top: none; margin-top: 0; padding-top: 0; }
.pflicht-legende { font: 400 12.5px/1.35 var(--schrift); color: var(--text-leise); }
.fuss .aktionen { display: flex; gap: 10px; }

.handlungen { display: grid; gap: 28px; margin: 16px 0 26px; }


.handlungen > form { display: grid; gap: 4px 12px; align-items: start;
                     grid-template-columns: minmax(0, auto) 1fr; }
.handlungen > form .feld { grid-column: 1; }

.handlungen > form button { justify-self: start; align-self: end; }

.handlungen > form .kaestchen-feld { grid-column: 1; }
.handlungen > form .kaestchen-feld { margin-top: 8px; }

.zustaendigkeit-traeger { grid-column: 1 / -1; margin: 0 0 4px; font: 500 14px/1.4 var(--schrift); overflow-wrap: anywhere; }

.handlungen > form select[name="anlass"] { max-width: 100%; min-width: 0; }

.uebernehmen-weiche-wege > form { display: flex; flex-direction: column; gap: 12px; }
.uebernehmen-weiche-wege > form button,
.uebernehmen-weiche-wege > form .kaestchen-feld { align-self: start; }

fieldset { display: contents; border: 0; margin: 0; padding: 0; min-width: 0; }

fieldset[data-gilt-fuer-fuer][hidden] { display: none; }
.feld { display: flex; flex-direction: column; gap: 5px; }
.feld > span { font: 500 11.5px/1 var(--mono); letter-spacing: 0.05em; text-transform: uppercase;
               color: var(--text-leise); }

.feld.pflicht > span::after { content: " *"; color: var(--text-leise); }

.feld :is(select, input), .melder-aendern select { font: 400 14px/1 var(--schrift); color: var(--text); background: var(--grund);
  border: 1px solid var(--feldrand); border-radius: 6px; padding: 0 10px; height: 36px; min-width: 168px; }

.feld .hilfe { font: 400 12.5px/1.35 var(--schrift); color: var(--text-leise); max-width: 46ch; }

.faelligkeit-bisher { display: block; margin-top: 4px; font: 400 12.5px/1.35 var(--schrift); color: var(--text-leise); }


.handlungen > form:has(> input[name="name"]:is([value="faelligkeit_aendern"], [value="warten"], [value="nachhaken_verschieben"])) { grid-template-columns: minmax(0, 1fr); row-gap: 12px; align-content: start; }
.handlungen > form:has(> input[name="name"]:is([value="faelligkeit_aendern"], [value="warten"], [value="nachhaken_verschieben"])) button { grid-column: 1; align-self: start; }

.handlungen > form:has(> input[name="name"]:is([value="faelligkeit_aendern"], [value="warten"], [value="nachhaken_verschieben"])) .feld :is(input[type="date"], select) { align-self: flex-start; }
.datum-titel { grid-column: 1 / -1; margin: 0; font: 600 15px/1.3 var(--schrift); color: var(--text); }
.datum-bisher { grid-column: 1 / -1; display: block; margin: 0; font: 400 13px/1.4 var(--schrift); color: var(--text-leise); }

.warten-worauf { grid-column: 1 / -1; margin: 0; font: 400 13px/1.4 var(--schrift); color: var(--text-leise); }
.nachhaken-warnung { grid-column: 1 / -1; margin: 0; max-width: 46ch; font: 400 13px/1.4 var(--schrift); color: var(--warnung); }
@media (min-width: 768px) {
  .handlungen:has(> form > input[name="name"][value="faelligkeit_aendern"]):has(> form > input[name="name"]:is([value="warten"], [value="nachhaken_verschieben"])) { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 40px; }
  .handlungen:has(> form > input[name="name"][value="faelligkeit_aendern"]):has(> form > input[name="name"]:is([value="warten"], [value="nachhaken_verschieben"])) > * { grid-column: 1 / -1; }
  .handlungen:has(> form > input[name="name"][value="faelligkeit_aendern"]):has(> form > input[name="name"]:is([value="warten"], [value="nachhaken_verschieben"])) > form:has(> input[name="name"]:is([value="faelligkeit_aendern"], [value="warten"], [value="nachhaken_verschieben"])) { grid-column: auto; }
  
  .handlungen:has(> form > input[name="name"][value="faelligkeit_aendern"]):has(> form > input[name="name"]:is([value="warten"], [value="nachhaken_verschieben"])) > form:has(> input[name="name"][value="warten_beenden"]) { grid-column: 2; }
}

.knopf-reihe { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-width: 0; }
.feld-reihe { display: contents; }
@media (min-width: 768px) {
  .knopf-reihe { flex-direction: row; flex-wrap: wrap; align-items: center; }
  .feld-reihe { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-start; min-width: 0; }
  .handlungen > form[data-kombi] { grid-template-columns: minmax(0, 1fr); row-gap: 12px; align-content: start; }
  .handlungen > form[data-kombi] button { grid-column: 1; align-self: start; }
}

.feld .hilfe:empty { display: none; }


.erklaer, .sperrgrund { display: block; grid-column: 1 / -1; margin-top: 2px; max-width: 42ch;
           font: 400 12.5px/1.35 var(--schrift); color: var(--text-leise); }


.feld textarea { font: 400 14px/1.4 var(--schrift); color: var(--text); background: var(--grund);
  border: 1px solid var(--feldrand); border-radius: 6px; padding: 7px 10px; min-width: 168px;
  resize: vertical; }
.anlegen .feld textarea { min-height: 5.2em; }

.handlungen .feld textarea { width: 44ch; max-width: 100%; min-height: 2.6em; }


.gesperrte-klapp { margin: 0 0 26px; }

.gesperrte-klapp > summary { cursor: pointer; list-style: none; display: flex; align-items: baseline;
  gap: 8px; font: 500 13.5px/1.3 var(--schrift); color: var(--text-leise); }
.gesperrte-klapp > summary::-webkit-details-marker, .entschieden-klapp > summary::-webkit-details-marker { display: none; }
.gesperrte-klapp > summary::after, .entschieden-klapp > summary::after { content: "\25B8"; content: "\25B8" / ""; font-size: 11px; color: var(--text-leise); }
.gesperrte-klapp[open] > summary, .entschieden-klapp[open] > summary { margin-bottom: 16px; }
.gesperrte-klapp[open] > summary::after, .entschieden-klapp[open] > summary::after { content: "\25BE"; content: "\25BE" / ""; }

.entschieden-klapp > summary { cursor: pointer; list-style: none; display: flex; align-items: baseline; gap: 8px; }

.entschieden-klapp > summary { padding: 8px 10px; margin: 0 -10px; border-radius: 8px; gap: 10px; }
.entschieden-klapp > summary:hover { background: var(--erhoben); }
.entschieden-klapp > summary:focus-visible { outline: 2px solid var(--akzent-text); outline-offset: 2px; }

.entschieden-klapp > summary::after, .entschieden-klapp[open] > summary::after { content: none; }
.entschieden-klapp > summary::before { content: "\25B8"; content: "\25B8" / ""; font-size: 13px; color: var(--text); align-self: center; }
.entschieden-klapp[open] > summary::before { content: "\25BE"; content: "\25BE" / ""; }

[data-wartet-antwort] > summary, [data-wartet-vertrag] > summary { margin: 0; }
.gesperrte-klapp .handlungen { margin: 0; }


.ablage-klapp { margin: 0 0 26px; }
.ablage-klapp-titel { cursor: pointer; list-style: none; display: flex; align-items: baseline;
  gap: 8px; font: 600 15px/1.2 var(--schrift); letter-spacing: -0.01em; }
.ablage-klapp-titel::-webkit-details-marker { display: none; }
.ablage-klapp-titel::after { content: "\25B8"; content: "\25B8" / ""; font-size: 11px; color: var(--text-leise); }
.ablage-klapp[open] .ablage-klapp-titel { margin-bottom: 16px; }
.ablage-klapp[open] .ablage-klapp-titel::after { content: "\25BE"; content: "\25BE" / ""; }
.ablage-klapp section[data-sicht="ablage"] > h2 { display: none; }


.uebernehmen-weiche { margin: 0 0 22px; padding: 14px 16px; border: 1px solid var(--trennlinie);
  border-radius: 8px; background: var(--erhoben); }
.uebernehmen-weiche-frage { margin: 0 0 12px; font: 500 14px/1.4 var(--schrift); }
.uebernehmen-weiche-wege { display: flex; flex-wrap: wrap; gap: 16px 20px; align-items: flex-start; }

.vorgang h1 { margin-bottom: 4px; overflow-wrap: anywhere; }

.vorgang .uhr { font: 400 13px/1.5 var(--schrift); color: var(--text-leise); margin: 0 0 18px; }
.vorgang .uhr .marke { margin-left: 4px; }

.vorgang .uhr-block { margin: 0 0 18px; }
.vorgang .uhr-block > .uhr { display: inline; margin: 0; }

.vorgang-gegenpartei { margin: 0 0 14px; }
.vorgang-herkunft { margin: 0 0 22px; }
.vorgang-herkunft h2 { font: 500 12px/1.3 var(--mono); letter-spacing: 0.05em; text-transform: uppercase;
  color: var(--text-leise); margin: 0 0 8px; }

.vorgang-angedockte { margin: 0 0 22px; }
.vorgang-angedockte h2 { font: 500 12px/1.3 var(--mono); letter-spacing: 0.05em; text-transform: uppercase;
  color: var(--text-leise); margin: 0 0 8px; }
.vorgang-angedockte-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 16px; }

.vorgang-angedockte-mail { border-left: 3px solid var(--akzent-text); padding-left: 12px; min-width: 0; }
.vorgang-angedockte-mail .inbox-felder { margin: 0 0 8px; }
.vorgang-anhang-nachholen { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; margin: 6px 0 0; }
.vorgang-anhang-fehlt { font: 500 12.5px/1.4 var(--schrift); color: var(--warnung); margin: 0; max-width: 60ch; overflow-wrap: anywhere; }

.ziel { margin: 0 0 22px; max-width: 62ch; overflow-wrap: anywhere; }


.satz-gl, .feld > span.satz-gl { display: block; font: 500 11.5px/1.35 var(--schrift);
            letter-spacing: normal; text-transform: none; color: var(--text-leise); }
.ziel .satz-gl { margin-bottom: 5px; }

.ziel .leer { color: var(--text-leise); }

.ergebnis-aendern, .melder-aendern { display: inline-block; margin-left: 10px; }

.pruefung-endet-satz { margin: 0; font: 400 13px/1.45 var(--schrift); color: var(--text); }
.erledigen-reaktion { margin: 0; font: 400 13px/1.45 var(--schrift); color: var(--text); }

.erledigen-reaktion-link { font-weight: 500; color: var(--akzent-text); text-decoration: underline; }
.ergebnis-aendern > summary, .melder-aendern > summary { cursor: pointer; font: 500 13px/1.35 var(--schrift); color: var(--akzent-text); list-style: none; }
.ergebnis-aendern > summary::-webkit-details-marker, .melder-aendern > summary::-webkit-details-marker { display: none; }
.ergebnis-aendern[open], .melder-aendern[open] { display: block; margin-left: 0; margin-top: 8px; }
.ergebnis-aendern[open] > summary, .melder-aendern[open] > summary { margin-bottom: 6px; }
.ergebnis-aendern > form, .melder-aendern > form { margin: 0; }
.ergebnis-aendern textarea, .melder-aendern textarea { width: 100%; }
.ergebnis-aendern button, .melder-aendern button { margin-top: 8px; }

.melder-aendern-form fieldset { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; min-width: 0; }
.melder-aendern select { max-width: 100%; min-width: 0; }
.melder-aendern button { margin-top: 0; }

.melder-aendern:not([open]) > form { display: none; }
.ergebnis-ki-hinweis { margin: 8px 0 0; font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); }
.ergebnis-uebernehmen { margin: 10px 0 0; }

.ergebnis-andock-ki { margin: 10px 0 0; }
.ergebnis-ki-vorschlag { margin: 8px 0; font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); overflow-wrap: anywhere; }

p.leer { margin: 0 0 22px; color: var(--text-leise); }

.bemerkungen { margin: 0 0 22px; max-width: 62ch; }

.bemerkungen textarea { width: 100%; }
.bemerkungen button { margin-top: 8px; }
.bemerkung { margin: 0 0 22px; max-width: 62ch; white-space: pre-line; }

.vorgang h2 { font: 600 15px/1.2 var(--schrift); letter-spacing: -0.01em; margin: 0 0 22px; }
.akte { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--trennlinie); }


.akte > li { display: grid; grid-template-columns: 132px 168px minmax(0, 62ch); gap: 16px;
             padding: 11px 0; border-bottom: 1px solid var(--trennlinie); }
.akte .zeit, .akte .wer { font: 400 12.5px/1.4 var(--mono); color: var(--text-leise); }

.akte .satz { font-size: 14px; min-width: 0; overflow-wrap: anywhere; }

.akte .satz a { color: var(--akzent-text); text-decoration: underline; }



.ablage-slot { display: block; margin-top: 22px; margin-bottom: 22px; }
.ablage-dateien { list-style: none; margin: 8px 0 0; padding: 0; }

#teil-vorgang .ablage-dateien { max-height: 320px; overflow-y: auto; }

#teil-vorgang .ablage-dateien:has(.ablage-eml-ziel:not(:empty)) { max-height: none; }

.ablage-dateien > li { display: flex; align-items: center; justify-content: flex-start; gap: 12px 16px;
                       flex-wrap: wrap; padding: 8px 0; min-width: 0; }

.ablage-dateien > li:not(:last-child) { border-bottom: 1px solid var(--trennlinie); }

.ablage-datei-info { display: flex; flex-direction: column; gap: 3px; min-width: 0; overflow-wrap: anywhere; }
.ablage-ort { font: 400 12px/1.35 var(--mono); color: var(--text-leise); overflow-wrap: anywhere; }

.ablage-dateien > li.ablage-datei-inaktiv .ablage-datei-info { color: var(--text-leise); }
.ablage-datei-akt { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ablage-datei-akt > form { margin: 0; }

.ablage-herkunft { font: 400 12px/1.35 var(--mono); color: var(--text-leise); overflow-wrap: anywhere; }


.ablage-browser { margin-top: 8px; padding: 10px; border: 1px solid var(--trennlinie); border-radius: 6px; }
.browser-pfad { display: flex; flex-wrap: wrap; gap: 4px 6px; align-items: baseline; margin-bottom: 8px;
                font: 400 12px/1.35 var(--mono); }
.browser-pfad-schritt { background: none; border: 0; padding: 0; font: inherit; color: var(--text-leise); cursor: pointer;
                        text-decoration: underline; overflow-wrap: anywhere; }

.browser-pfad-hier { font: inherit; color: var(--text); font-weight: 500; overflow-wrap: anywhere; }
.browser-liste { list-style: none; margin: 0; padding: 0; }
.browser-liste > li { padding: 6px 0; border-bottom: 1px solid var(--trennlinie); min-width: 0; overflow-wrap: anywhere; }
.browser-liste > li:last-child { border-bottom: 0; }
.browser-ziel { background: none; border: 0; padding: 0; font: inherit; text-align: left; color: inherit; cursor: pointer;
                overflow-wrap: anywhere; }
.browser-datei > form { display: flex; align-items: baseline; gap: 10px; margin: 0; min-width: 0; }
.browser-name { min-width: 0; overflow-wrap: anywhere; }


.site-kopfzeile { font: 700 14px/1.3 var(--schrift); padding-top: 10px; overflow-wrap: anywhere; }
.browser-liste.gruppe > li { padding-left: 16px; }

.site-gruppe { border-bottom: 1px solid var(--trennlinie); }
.site-gruppe:last-child { border-bottom: 0; }
summary.site-kopfzeile { cursor: pointer; list-style: none; display: flex; align-items: baseline; gap: 8px;
  padding: 10px; margin: 0 -10px; border-radius: 8px; }
summary.site-kopfzeile::-webkit-details-marker { display: none; }
summary.site-kopfzeile::after { content: "\25B8"; content: "\25B8" / ""; font-size: 11px; color: var(--text-leise); margin-left: auto; }
.site-gruppe[open] > summary.site-kopfzeile::after { content: "\25BE"; content: "\25BE" / ""; }
summary.site-kopfzeile:hover { background: var(--erhoben); }
.zeile-gestoert { display: flex; align-items: center; gap: 8px; padding: 8px 0; color: var(--text-leise);
  border-bottom: 1px solid var(--trennlinie); min-width: 0; overflow-wrap: anywhere; }
.zeile-gestoert .badge.gestoert { margin-left: auto; }


.ablage-hinzufuegen { margin-top: 12px; display: flex; flex-direction: column; gap: 18px; }
.ablage-quelle { min-width: 0; }
.ablage-quelle-titel { display: block; font: 500 12.5px/1.3 var(--schrift); color: var(--text-leise); margin: 0 0 8px; }
.ablage-datei-waehler { position: relative; cursor: pointer; }
.ablage-datei-waehler:focus-within { outline: 2px solid var(--akzent-text); outline-offset: 2px; }
.ablage-dateiname { color: var(--text); font-size: 13px; overflow-wrap: anywhere; }
.ablage-keine-kopie { display: block; margin-top: 8px; font-size: 12.5px; color: var(--text-leise); }


.ablage-oeffnen { display: inline-block; margin: 0 0 8px; text-decoration: none; }
.browser-pfad-sep { color: var(--text-leise); }
.ablage-wechseln { margin-left: auto; font: 400 12px/1.35 var(--mono); color: var(--text-leise); text-decoration: underline; }

.ablage-suche { display: flex; flex-direction: column; gap: 6px; margin: 0 0 6px; }
.ablage-suche-zeile { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.ablage-suche-feld { flex: 1 1 12rem; min-width: 0; padding: 6px 8px; font: inherit; color: var(--text);
                     background: var(--grund); border: 1px solid var(--feldrand); border-radius: 6px; }
.ablage-suche-knopf { padding: 6px 12px; font: 500 13px/1 var(--schrift); cursor: pointer; color: var(--knopf-schrift);
                      background: var(--knopf-flaeche); border: 1px solid var(--knopf-flaeche); border-radius: 6px; }
.ablage-suche-hinweis { margin: 0 0 10px; font-size: 12px; color: var(--text-leise); }

.ablage-suche-umfang { display: flex; flex-wrap: wrap; gap: 4px 16px; align-items: center; margin: 0; padding: 0; border: 0; }
.ablage-suche-umfang legend { flex-basis: 100%; padding: 0; font: 500 12px/1.3 var(--schrift); color: var(--text-leise); }
.ablage-suche-umfang-opt { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; color: var(--text); }
.ablage-suche-alle { margin: 0; font-size: 12px; color: var(--text-leise); }
.ablage-suche-aktiv { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: baseline; margin: 0 0 8px;
                      font-size: 13px; color: var(--text); }

.ablage-suche-unvollstaendig { margin: 0 0 6px; font-size: 13px; color: var(--text); }
.ablage-suche-eingrenzen { margin: 0 0 8px; font-size: 13px; color: var(--text-leise); }
.ablage-zurueck-ordner { font: 400 12px/1.35 var(--mono); color: var(--text-leise); text-decoration: underline; }

.ablage-tabelle { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.ablage-tabelle th { text-align: left; font: 500 12px/1.3 var(--schrift); color: var(--text-leise);
                     padding: 4px 10px 6px 0; border-bottom: 1px solid var(--trennlinie); }
.ablage-tabelle td { padding: 7px 10px 7px 0; border-bottom: 1px solid var(--trennlinie);
                     vertical-align: baseline; overflow-wrap: anywhere; }
.ablage-tabelle tr:last-child td { border-bottom: 0; }
.ablage-tabelle .z-geaendert, .ablage-tabelle .z-groesse { white-space: nowrap; color: var(--text-leise);
                     font: 400 12.5px/1.3 var(--mono); }

.z-name { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 8px; min-width: 0; }
.z-dateiname { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.z-ordner { flex-basis: 100%; font: 400 12px/1.3 var(--mono); color: var(--text-leise); margin-top: 2px; }

.z-herkunft { flex-basis: 100%; font: 400 12px/1.3 var(--mono); color: var(--text-leise); margin-top: 2px; }

.z-dateiaktionen { flex-basis: 100%; display: flex; flex-wrap: wrap; column-gap: 12px; row-gap: 2px; margin-top: 2px; min-width: 0; }
.z-dateiaktionen .ablage-vorschau-knopf { margin-left: 0; }
.typ-badge { flex: 0 0 auto; min-width: 2.4em; padding: 1px 4px; text-align: center;
             font: 600 10px/1.4 var(--mono); letter-spacing: 0.03em; color: var(--text-leise);
             background: var(--erhoben); border: 1px solid var(--trennlinie); border-radius: 4px; }
.typ-symbol { flex: 0 0 auto; color: var(--text-leise); }
.ablage-ziel { display: flex; align-items: center; column-gap: 8px; min-width: 0; color: var(--text); text-decoration: none; }
.ablage-ziel .z-dateiname { align-self: baseline; }
.ablage-ziel:hover, .ablage-ziel:focus-visible { text-decoration: underline; }
.ablage-zeile.ordner .z-name { font-weight: 500; } 
.ablage-zeile.datei .ablage-zeile-form { display: flex; margin: 0; }
.ablage-verknuepfen-knopf { padding: 4px 10px; font: 500 12.5px/1 var(--schrift); cursor: pointer;
                            color: var(--knopf-schrift); background: var(--knopf-flaeche);
                            border: 1px solid var(--knopf-flaeche); border-radius: 6px; }

.ablage-dialog { width: min(680px, 94vw); max-height: 86vh; padding: 0; overflow: hidden;
                 border: 1px solid var(--trennlinie); border-radius: 10px; background: var(--grund); color: var(--text);
                 display: flex; flex-direction: column; }

dialog.ablage-dialog:not([open]) { display: none; }
.ablage-dialog::backdrop { background: var(--overlay); }
.ablage-dialog-kopf { display: flex; align-items: center; justify-content: space-between; gap: 12px;
                      padding: 14px 18px; border-bottom: 1px solid var(--trennlinie); }
.ablage-dialog-titel { margin: 0; font: 600 16px/1.2 var(--schrift); }
.ablage-dialog-schliessen { background: none; border: 0; padding: 0; font-size: 22px; line-height: 1;
                            min-width: 32px; min-height: 32px; display: inline-flex; align-items: center;
                            justify-content: center; cursor: pointer; color: var(--text-leise); }
.ablage-dialog-koerper { padding: 14px 18px; overflow: auto; }
.ablage-dialog-fuss { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px;
                      padding: 12px 18px; border-top: 1px solid var(--trennlinie); background: var(--erhoben); }
.ablage-dialog-stand { font-size: 13px; color: var(--text); min-width: 0; overflow-wrap: anywhere; }
.ablage-dialog-verknuepfen[disabled] { opacity: 0.5; cursor: not-allowed; }
.ablage-dialog .ablage-zeile.datei { cursor: pointer; }
.ablage-dialog .ablage-zeile-form, .ablage-dialog .z-akt { display: none; }
.ablage-dialog .ablage-zeile.datei:hover td { background: var(--erhoben); }
.ablage-dialog .ablage-zeile.gewaehlt td { background: var(--erhoben); }

.ablage-dialog .ablage-tabelle th:first-child, .ablage-dialog .ablage-tabelle td:first-child { padding-left: 6px; }

.ablage-dialog .ablage-zeile.gewaehlt td:first-child { box-shadow: inset 3px 0 0 var(--akzent-text); }
.ablage-dialog .ablage-zeile.datei:focus-visible { outline: 2px solid var(--akzent-text); outline-offset: -2px; }

.ablage-seite { max-width: 820px; margin: 0 auto; padding: 20px 16px 40px; }
.ablage-seite-zurueck { display: inline-block; margin-bottom: 12px; font-size: 13px; color: var(--text-leise); }
.ablage-seite h1 { font: 600 20px/1.25 var(--schrift); margin: 0 0 16px; }



.ablage-upload { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 10px; margin: 0; min-width: 0; }
.ablage-upload-datei { min-width: 0; overflow-wrap: anywhere; }
.ablage-upload-ziel { color: var(--text-leise); font-size: 13px; overflow-wrap: anywhere; }
.ablage-upload-status { color: var(--text-leise); font-size: 13px; overflow-wrap: anywhere; }


.ablage-kollisionen { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.ablage-kollisionen > li { display: flex; flex-direction: column; gap: 8px; padding: 10px 12px;
                           border: 1px solid var(--akzent-text); border-radius: 6px; background: var(--erhoben); min-width: 0; }
.ablage-kollision-frage { font-size: 13px; overflow-wrap: anywhere; }
.ablage-kollision-wahlen { display: flex; flex-wrap: wrap; gap: 8px; }
.ablage-kollision-wahlen > form { margin: 0; }



.ablage-loeschen-dialog, .ablage-entfernen-dialog { display: inline-block; margin-left: 8px; }
.ablage-loeschen-dialog > summary, .ablage-entfernen-dialog > summary { cursor: pointer; list-style: none; display: inline-block; }
.ablage-loeschen-dialog > summary::-webkit-details-marker, .ablage-entfernen-dialog > summary::-webkit-details-marker { display: none; }

.ablage-loeschen-start { color: var(--text-leise); font-size: 13px; text-decoration: underline; }
.ablage-loeschen-dialog[open] > summary.ablage-loeschen-start { color: var(--warnung); }
.ablage-loeschen-frage { color: var(--warnung); font-size: 13px; margin: 8px 0; max-width: 44ch; }

.ablage-entfernen-start { color: var(--text-leise); font-size: 13px; text-decoration: underline; }
.ablage-entfernen-frage { color: var(--text-leise); font-size: 13px; margin: 8px 0; max-width: 44ch; }

.ablage-datei-oeffnen { color: var(--text-leise); font-size: 13px; text-decoration: underline; }

.ablage-vorschau-knopf { margin-left: 10px; font-size: 12px; color: var(--akzent-text); text-decoration: underline;
                         white-space: nowrap; cursor: pointer; }

.ablage-vorschau { display: none; flex-direction: column; min-height: 0; flex: 1 1 auto; }
.ablage-dialog.vorschau-offen .ablage-dialog-koerper, .ablage-dialog.vorschau-offen .ablage-dialog-fuss { display: none; }
.ablage-dialog.vorschau-offen .ablage-vorschau { display: flex; }
.ablage-vorschau-kopf { display: flex; align-items: center; gap: 12px; padding: 12px 18px;
                        border-bottom: 1px solid var(--trennlinie); }
.ablage-vorschau-zu { flex-shrink: 0; }
.ablage-vorschau-titel { font: 600 15px/1.2 var(--schrift); min-width: 0; overflow-wrap: anywhere; }
.ablage-vorschau-rahmen-aussen { flex: 1 1 auto; width: 100%; min-height: 60vh; border: 0; }

.ablage-vorschau-seite { padding: 16px; }
.ablage-vorschau-zurueck { display: inline-block; margin-bottom: 12px; color: var(--akzent-text); text-decoration: underline; }
.ablage-vorschau-rahmen { width: 100%; height: 75vh; border: 1px solid var(--trennlinie); }
.ablage-loesch-status { flex-basis: 100%; color: var(--warnung); font-size: 13px; margin-top: 4px; overflow-wrap: anywhere; }

.ablage-bremse { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 4px 0; }
.ablage-bremse-satz { margin: 0; max-width: 60ch; overflow-wrap: anywhere; }

.ablage-bremse-knopf { display: inline-block; text-decoration: none; }

.anmelde-knopf { display: inline-block; text-decoration: none; }


.abschnitt { margin: 22px 0 34px; }
.abschnitt h2 { font: 600 15px/1.2 var(--schrift); letter-spacing: -0.01em; margin: 0 0 12px; }

.abschnitt > summary { cursor: pointer; list-style: none; }
.abschnitt > summary::-webkit-details-marker { display: none; }
.abschnitt > summary h2 { display: flex; align-items: baseline; gap: 8px; }
.abschnitt > summary h2::after { content: "\25B8"; content: "\25B8" / ""; font-size: 11px; color: var(--text-leise); }
.abschnitt[open] > summary h2::after { content: "\25BE"; content: "\25BE" / ""; }

.abschnitt:not([open]) > summary h2 { margin-bottom: 0; }

.abschnitt h3 { font: 600 13.5px/1.2 var(--schrift); letter-spacing: -0.01em; margin: 22px 0 12px; }

.zuweisungen-klapp { margin-top: 22px; }
.zuweisungen-klapp > summary { cursor: pointer; list-style: none; }
.zuweisungen-klapp > summary::-webkit-details-marker { display: none; }
.zuweisungen-klapp > summary h3 { display: flex; align-items: baseline; gap: 8px; margin-top: 0; }
.zuweisungen-klapp > summary h3::after { content: "\25B8"; content: "\25B8" / ""; font-size: 11px; color: var(--text-leise); }
.zuweisungen-klapp[open] > summary h3::after { content: "\25BE"; content: "\25BE" / ""; }
.zuweisungen-klapp:not([open]) > summary h3 { margin-bottom: 0; }

.personen, .zuweisungen, .stufen, .rollen, .pruefkataloge, .feiertage, .instanz, .umsysteme, .postfaecher, .betrieb, .parteien {
                          list-style: none; margin: 0 0 22px; padding: 0;
                          border-top: 1px solid var(--trennlinie); }

.personen > li, .zuweisungen > li, .stufen > li, .rollen > li, .pruefkataloge > li, .feiertage > li, .instanz > li,
.umsysteme > li, .postfaecher > li, .betrieb > li, .parteien > li {
  display: grid; grid-template-columns: minmax(0, 62ch) auto; justify-content: start;
  align-items: start; gap: 8px 24px;
  padding: 11px 0; border-bottom: 1px solid var(--trennlinie); min-height: 48px; }
.zeilen-inhalt { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; min-width: 0; }

.zeilen-form { display: flex; align-items: start; gap: 10px; flex-wrap: wrap; }

.zeilen-form > form { display: flex; align-items: start; gap: 10px; flex-wrap: wrap;
                      align-self: end; }
.zeilen-form button { align-self: end; }
.personen .name, .zuweisungen .name, .stufen .name, .rollen .name, .pruefkataloge .name,
.feiertage .name, .umsysteme .name, .postfaecher .name, .instanz .wert, .parteien .name { font-weight: 500; }
.personen .mail, .zuweisungen .rolle, .zuweisungen .seit, .rollen .rechte, .pruefkataloge .pruefkatalog-angaben,
.umsysteme .bestaetigt, .umsysteme .bexio-zugang, .postfaecher .rolle, .postfaecher .reihenfolge { font: 400 12.5px/1 var(--mono); color: var(--text-leise); }

.umsysteme .bexio-zugang { display: block; flex-basis: 100%; }

.postfach-zustand { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 4px 14px;
                    font: 400 12px/1.3 var(--mono); color: var(--text-leise); }
.zustand-lesen, .zustand-entwuerfe { overflow-wrap: anywhere; }

.postfach-ordner { flex-basis: 100%; font: 400 12px/1.3 var(--mono); color: var(--text-leise); overflow-wrap: anywhere; }

.postfach-sprung { flex-basis: 100%; font: 400 12px/1.3 var(--mono); color: var(--text-leise); overflow-wrap: anywhere; }

.postfach-verschieben { flex-basis: 100%; font: 400 12px/1.3 var(--mono); color: var(--text-leise); overflow-wrap: anywhere; }

.postfach-gruppe { flex-basis: 100%; display: flex; align-items: start; gap: 8px 10px; flex-wrap: wrap; }
.postfach-gruppe-schreibrecht { flex-direction: column; gap: 4px; }
.postfach-gruppe-postfach { align-items: end; }
.postfach-gruppe > form { display: flex; align-items: start; gap: 10px; flex-wrap: wrap; align-self: end; }
.postfach-gruppe-schreibrecht > form { align-self: start; }
.postfach-gruppe-schreibrecht .zustand-entwuerfe { font: 400 12px/1.3 var(--mono); color: var(--text-leise); }

.postfach-entfernen { align-self: end; }
.postfach-entfernen > summary { list-style: none; cursor: pointer; }
.postfach-entfernen > summary::-webkit-details-marker { display: none; }

.zeilen-inhalt .mail { overflow-wrap: anywhere; }

.pruefkataloge .name { overflow-wrap: anywhere; }

.umsysteme .name { min-width: 132px; }

.weitere { grid-column: 1 / -1; margin-top: 12px; border-top: 1px dashed var(--trennlinie); padding-top: 12px; }
.weitere-titel { font: 600 12.5px/1.3 var(--schrift); color: var(--text-leise); margin: 0 0 10px;
  text-transform: uppercase; letter-spacing: 0.04em; }
.site-liste { list-style: none; margin: 0 0 12px; padding: 0; }
.site-liste > li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 8px 0;
  border-top: 1px solid var(--trennlinie); }
.site-liste > li:first-child { border-top: 0; }
.site-name { font-weight: 600; }
.site-pfad { font: 400 12.5px/1.3 var(--mono); overflow-wrap: anywhere; min-width: 0; }
.badge { font: 500 11.5px/1 var(--mono); padding: 2px 8px; border-radius: 999px;
  border: 1px solid var(--trennlinie); color: var(--text-leise); white-space: nowrap; }
.badge.ok { color: var(--knopf-flaeche); border-color: var(--knopf-flaeche); }
.badge.warn { color: var(--warnung); border-color: var(--warnung); }
.badge.gestoert { color: var(--warnung); border-color: var(--warnung); border-style: dashed; }
.site-meta { font: 400 11.5px/1.3 var(--mono); color: var(--text-leise); flex-basis: 100%; overflow-wrap: anywhere; }
.site-akt { margin-left: auto; }
.weitere > form { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: end; margin-top: 4px; }

.feiertage .datum { font: 400 12.5px/1 var(--mono); color: var(--text-leise); min-width: 96px; }
.instanz .gl { font: 500 11.5px/1 var(--mono); letter-spacing: 0.05em; text-transform: uppercase;
               color: var(--text-leise); min-width: 132px; }


.personen .rolle { display: flex; flex-wrap: wrap; gap: 6px; }

.kennung-verlauf { flex-basis: 100%; min-width: 0; }
.kennung-verlauf > summary { cursor: pointer; list-style: none; display: flex; align-items: baseline; gap: 6px;
  font: 500 12.5px/1.3 var(--schrift); color: var(--text-leise); }
.kennung-verlauf > summary::-webkit-details-marker { display: none; }
.kennung-verlauf > summary::before { content: "\25B8"; content: "\25B8" / ""; font-size: 11px; }
.kennung-verlauf[open] > summary::before { content: "\25BE"; content: "\25BE" / ""; }
.kennung-verlauf:not([open]) > .kennung-verlauf-liste { display: none; }
.kennung-verlauf-liste { list-style: none; margin: 8px 0 0; padding: 0; }
.kennung-verlauf-liste > li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; min-width: 0;
  padding: 6px 0; border-top: 1px solid var(--trennlinie); }
.kennung-verlauf-liste .zeit { font: 400 12.5px/1.4 var(--mono); color: var(--text-leise); }
.kennung-verlauf-liste .satz { font-size: 13.5px; min-width: 0; overflow-wrap: anywhere; }
.kennung-verlauf-liste .kennung-verlauf-aeltere { font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); }

.kaestchen { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;
             font: 400 13px/1 var(--schrift); color: var(--text); }
.kaestchen input { margin: 0; }

.kaestchen-feld { display: flex; flex-direction: column; gap: 5px; }
.kaestchen-feld .hilfe { font: 400 12.5px/1.35 var(--schrift); color: var(--text-leise); max-width: 46ch; }

.marke { font: 500 11px/1 var(--mono); letter-spacing: 0.05em; text-transform: uppercase;
         color: var(--text-leise); border: 1px solid var(--feldrand); border-radius: 3px;
         padding: 3px 6px; }
.marke-aus { color: var(--warnung); border-color: var(--warnung); }

.marke-abgewiesen { white-space: nowrap; }

.marke-schreibrecht { text-transform: none; }

.marke-art { text-transform: none; }
.marke-erlaubt { color: var(--text); border-color: var(--akzent-text); }

.marke-prio { text-transform: none; }

.ticket-block { margin: 12px 0 18px; }
.ticket-block .inbox-felder { margin: 0 0 10px; }
.ticket-block .uhr-vorschlag { margin: 10px 0; }
.ticket-block .prio-aendern, .ticket-block .uhr-erfuellen { margin-top: 4px; }
.uhr-stand { color: var(--text); }
.annehmen-eingang { display: block; margin-top: 4px; }

.konfig-satz { margin: 0 0 12px; max-width: 72ch; font-size: 13.5px; color: var(--text); }

.prioritaeten .spannen { color: var(--text-leise); font-size: 13px; flex-basis: 100%; }
.spanne-eingabe { display: flex; gap: 8px; }

.zeilen-quittung { margin-left: 10px; font-size: 13px; color: var(--text); }
.spanne-eingabe input[type=number] { width: 84px; min-width: 0; }
.spanne-eingabe select { min-width: 120px; }

.fenster-tage { display: flex; flex-wrap: wrap; flex: 0 0 100%; gap: 4px 14px; margin: 0 0 8px; }
.fenster-zeiten { display: flex; flex-wrap: wrap; flex: 0 0 100%; gap: 8px 14px; }
.fenster-zeiten .feld { flex: 0 1 9rem; min-width: 0; }
.fenster-zeiten .feld input { min-width: 0; width: 100%; }

.zeiten-rolle { margin: 0 0 12px; }
.zeiten-aktionen { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start; margin: 0 0 12px; }

.gilt-fuer-liste { margin: 0 0 12px; padding: 0; list-style: none; }
.gilt-fuer-kunde { display: flex; flex-wrap: wrap; gap: 2px 12px; padding: 4px 0; }
.gilt-fuer-kunde .name { font-weight: 600; }
.gilt-fuer-kunde .wert { color: var(--text-leise); overflow-wrap: anywhere; }
.gilt-fuer-form fieldset { border: 0; padding: 0; margin: 0 0 12px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.gilt-fuer-form .vertrag-gilt-fuer-kunden { display: flex; flex-direction: column; gap: 6px; margin-left: 24px; }
.zeiten-zurueck { margin: 0; }
.zeiten-zurueck > summary { cursor: pointer; list-style: none; display: inline-block; }
.zeiten-zurueck > summary::-webkit-details-marker { display: none; }
.zeiten-zurueck[open] { flex-basis: 100%; }
.kaestchen-lang { white-space: normal; align-items: flex-start; overflow-wrap: anywhere; }
.zeiten-wirkung { margin: 0; }

.zeiten-form .feldzeile.z3 { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 12px; }
.zeiten-form .feldzeile.z3 > :first-child { grid-column: 1 / -1; }

.frist-art { display: block; font: 500 10.5px/1.2 var(--mono); letter-spacing: 0.04em; color: var(--text-leise); }
.prio-aendern-form, .uhr-erfuellen-form { margin: 0; display: flex; flex-direction: column; gap: 10px; }
.prio-aendern-form fieldset, .uhr-erfuellen-form fieldset { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.uhr-erfuellen-form .feldzeile, .prio-aendern-form .feld { align-self: stretch; margin: 0; }

form fieldset.doppelte-stunde { border: 1px solid var(--trennlinie); border-radius: 6px; padding: 10px 12px; margin: 0 0 20px;
  min-width: 0; max-width: 100%; box-sizing: border-box; align-self: stretch; display: grid; gap: 7px; }
form fieldset.doppelte-stunde legend { font: 500 12.5px/1.35 var(--schrift); color: var(--text-leise); padding: 0 4px; }
form fieldset.doppelte-stunde .kaestchen { white-space: normal; align-items: flex-start; overflow-wrap: anywhere; }
.uhr-erfuellen-form fieldset.doppelte-stunde { margin: 0; }
form fieldset.doppelte-stunde[hidden] { display: none; }
.marke-verweigert { color: var(--warnung); border-color: var(--warnung); }



.hinweis { border-left: 3px solid var(--akzent-text); background: var(--erhoben);
           padding: 10px 14px; margin: 0 0 18px; overflow-wrap: anywhere; }
.hinweis.fehler { border-left-color: var(--warnung); }

.hinweis.hinweis-seite { margin: 16px 24px 0; }

.vorgang-verkauf-standardknopf { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.hinweis.erfolg { border-left-color: var(--knopf-flaeche); }

.hinweis-link { margin-left: 10px; font-weight: 500; white-space: nowrap; color: var(--knopf-flaeche); }

.hinweis-knopf { margin-left: 10px; padding: 4px 10px; white-space: nowrap; }

.connector-stand { margin: 0 0 16px; color: var(--text-leise); font-size: 0.9em; }


.inbox-erfassen, .inbox-dialog { margin-bottom: 16px; }

.inbox-direkt, .inbox-plan-weg { margin: 0; }

.inbox-plan-sperre { flex-basis: 100%; order: 5; margin: 0; font: 400 13px/1.4 var(--schrift); color: var(--text-leise); overflow-wrap: anywhere; }

.ki-vorschlag { margin: 12px 0; padding: 10px 12px; border-radius: 8px; background: var(--erhoben); border: 1px solid var(--trennlinie); }
.ki-vorschlag-kopf { margin: 0 0 4px; font: 600 12.5px/1.35 var(--schrift); }
.ki-vorschlag-satz { margin: 0 0 8px; font: 400 13px/1.4 var(--schrift); }
.ki-vorschlag-knoepfe { display: flex; gap: 8px; flex-wrap: wrap; }
.ki-vorschlag-knoepfe button { font: 500 12.5px/1 var(--schrift); padding: 6px 10px; border-radius: 6px; border: 1px solid var(--trennlinie); background: var(--grund); cursor: pointer; }
.ki-herkunft { margin: 4px 0 0; font: 400 12.5px/1.35 var(--schrift); color: var(--text-leise); }
.ki-vorschlag[hidden] { display: none; }

.ki-vorbelegung { margin: 10px 0 4px; }

.ki-vorbelegung-anhang { flex: 0 0 auto; }

.ki-vorbelegung-anhang-keiner { margin: 6px 0 0; font: 400 12px/1.35 var(--schrift); color: var(--text-leise); }
.vorbelegung { margin: 10px 0 0; padding: 10px 12px; border-radius: 8px; background: var(--erhoben); border: 1px solid var(--trennlinie); }
.vorbelegung-feld { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 5px 0; }
.vorbelegung-feld + .vorbelegung-feld { border-top: 1px solid var(--trennlinie); }
.vorbelegung-feld > span { font: 500 12.5px/1.35 var(--schrift); }

.vorbelegung-warum { margin: 8px 0 0; font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); white-space: pre-line; }


.vorbelegung-anhang-lage { margin: 8px 0 0; font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); }
.ki-anhang-unpassend { margin: 8px 0 0; padding-left: 8px; border-left: 2px solid var(--warnung); font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); }
.ki-ohne-zielsatz { margin: 0 0 6px; padding-left: 8px; border-left: 2px solid var(--warnung); font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); }

.rolle-pruefen { margin: 8px 0 0; }
.rollenpruefung { margin: 8px 0 0; font: 400 12.5px/1.4 var(--schrift); }
.rollenpruefung-einwand { padding: 8px 12px; border-radius: 8px; background: var(--erhoben); border: 1px solid var(--trennlinie); border-left: 3px solid var(--akzent); }
.rollenpruefung-marke { font-weight: 600; }
.rollenpruefung-ok { color: var(--text-leise); }

.gegenpartei-mail { margin: 8px 0 0; }
.gegenpartei-vorschlag { margin: 8px 0 0; padding: 8px 12px; border-radius: 8px; background: var(--erhoben); border: 1px solid var(--trennlinie); }
.gegenpartei-vorschlag-satz { margin: 0; font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); }

.gegenpartei-anhang { margin: 8px 0 0; }
.gegenpartei-anhang-ergebnis { margin: 8px 0 0; }
.gegenpartei-anhang-hinweis { margin: 0; font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); }
.gegenpartei-anhang-ablage { margin: 0; }

.inbox-dialog form.anlegen { display: flex; flex-direction: column; gap: 22px; }
.inbox-dialog .dialog-abschnitt { display: flex; flex-direction: column; gap: 9px; }

.inbox-dialog .annehmen-persoenlich { margin: 0; font: 400 13.5px/1.5 var(--schrift); color: var(--text); overflow-wrap: anywhere; }

.inbox-dialog .annehmen-fruehere-anhaenge { margin: 0; font: 400 13.5px/1.5 var(--schrift); color: var(--text); overflow-wrap: anywhere; }
.inbox-dialog .feldzeile { margin-bottom: 0; }
.inbox-dialog .rolle-pruefen, .inbox-dialog .ki-vorbelegung { margin: 0; }
.inbox-dialog .inbox-partei, .inbox-dialog .ki-vorschlag { margin: 0; }
.inbox-dialog .fuss { margin: 0; }

.inbox-dialog .annehmen-koerper { display: flex; flex-direction: column; gap: 22px; }
.inbox-dialog .ablage-slot { margin: 0; }   

.inbox-dialog .dialog-ablage-klapp { margin: 0; }

.inbox-anhang-hinweis { margin: 6px 0 0; font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); }

.abschnitt-ergebnis { position: relative; }
.abschnitt-ergebnis .ki-holen-gruppe { position: absolute; top: 0; right: 0;
  display: flex; flex-direction: row-reverse; flex-wrap: wrap; align-items: center;
  justify-content: flex-start; gap: 6px 8px; }

.abschnitt-ergebnis .feld > span, .abschnitt-ergebnis .feld > .hilfe { padding-right: 320px; }

.inbox-dialog .inbox-partei { display: flex; flex-direction: column; gap: 14px; }
.inbox-dialog .inbox-partei > * { margin: 0; }

.knopf-laedt { cursor: wait; animation: knopf-laedt-puls 1.1s ease-in-out infinite; }

@keyframes knopf-laedt-puls { 0%, 100% { opacity: 1; } 50% { opacity: 0.8; } }
@media (prefers-reduced-motion: reduce) { .knopf-laedt { animation: none; opacity: 1; } }
.ki-leer { margin: 8px 0 0; font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); }

.verbrauch-block { margin-top: 14px; }
.verbrauch-kopf { margin: 0 0 8px; font: 600 14px/1.35 var(--schrift); }
.verbrauch-monat { margin-bottom: 14px; }
.verbrauch { border-collapse: collapse; width: 100%; font: 400 12.5px/1.4 var(--schrift); }

.verbrauch-rolle { overflow-x: auto; }
.verbrauch th, .verbrauch td { text-align: left; padding: 4px 8px; border-bottom: 1px solid var(--trennlinie); }
.verbrauch th { font-weight: 600; color: var(--text-leise); }
.verbrauch-leer { margin: 4px 0; font: 400 12.5px/1.35 var(--schrift); color: var(--text-leise); }

.verbrauch-gesamt { margin: 4px 0 10px; font: 600 14px/1.35 var(--schrift); color: var(--text); }
.verbrauch-gesamt-label { color: var(--text-leise); font-weight: 400; }


.kosten-kopf { flex-basis: 100%; contain: inline-size; text-align: right; margin-top: 4px; font: 400 12.5px/1.35 var(--schrift); color: var(--text-leise); }
.kosten-wert { font-weight: 600; color: var(--text); }

.kosten-unbepreist { color: var(--akzent-text); font-weight: 600; cursor: help; }

.modellpreise { list-style: none; margin: 0; padding: 0; }
.modellpreise > li { padding: 6px 0; border-bottom: 1px solid var(--trennlinie); font: 400 13px/1.4 var(--schrift); }
.preis-modell { font-weight: 600; }
.preis-vorkommen { margin: 8px 0; font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); }
.preis-vorkommen code { font: 400 12px/1 var(--mono); background: var(--erhoben); padding: 1px 5px; border-radius: 4px; }
.preis-vorkommen code.hat-preis { color: var(--text); }
.preis-vorkommen code.ohne-preis { color: var(--warnung); }
.kosten-label { color: var(--text-leise); }
.preis-zeile { display: block; }

.preis-zeile > form { display: inline-block; margin-left: 8px; }

.modellpreis-aendern > form { display: flex; align-items: start; gap: 10px; flex-wrap: wrap; margin-top: 8px; }
.modellpreis-aendern button { align-self: end; }

.modellpreis-neu-titel { margin: 18px 0 0; }
.modellpreis-setzen { margin-top: 10px; }
.inbox-erfassen > summary, .inbox-dialog > summary {
  cursor: pointer; list-style: none; display: inline-flex; width: fit-content; }
.inbox-erfassen > summary::-webkit-details-marker,
.inbox-dialog > summary::-webkit-details-marker { display: none; }
.inbox-erfassen[open] > summary, .inbox-dialog[open] > summary { margin-bottom: 14px; }

.inbox-liste { list-style: none; padding: 0; margin: 0 0 8px; }
.inbox-karte { border: 1px solid var(--trennlinie); border-radius: 8px; padding: 16px 18px;
  margin-bottom: 14px; background: var(--grund); }
.inbox-karte-kopf { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.inbox-betreff { font: 600 15px/1.35 var(--schrift); margin: 0; overflow-wrap: anywhere; }

.inbox-haken { flex: 0 0 24px; width: 24px; height: 24px; justify-content: center; align-self: flex-start; cursor: pointer; }
.inbox-haken input { width: 16px; height: 16px; margin: 0; accent-color: var(--akzent); cursor: pointer; }
.inbox-haken input:disabled { cursor: default; }
.inbox-haken-leer { display: block; cursor: default; }

.inbox-karte-kopf .inbox-betreff { flex: 1 1 12ch; min-width: 0; }

.inbox-sammel { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 14px; }
.inbox-alle { display: none; }
[data-mit-js] .inbox-alle { display: inline-block; }
.inbox-alle-hinweis { font: 400 12.5px/1.35 var(--schrift); color: var(--text-leise); }

.inbox-sammel-bestaetigung .verwerfen-frage { flex: 0 1 auto; min-width: 0; }

.inbox-nebenablage { margin-top: 24px; min-width: 0; }
.inbox-nebenablage .inbox-regeln-kopf { margin: 18px 0 6px; }
.inbox-nebenablage > summary + .inbox-regeln-kopf { margin-top: 0; }
.inbox-regeln { list-style: none; padding: 0; margin: 0 0 8px; }
.inbox-regel { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 14px; padding: 9px 0; border-top: 1px solid var(--trennlinie); min-width: 0; }
.inbox-regel-text { flex: 1 1 24ch; min-width: 0; font: 400 13.5px/1.4 var(--schrift); color: var(--text); overflow-wrap: anywhere; }
.inbox-regel-form { margin: 0; flex: 0 0 auto; }


.verwerfen-text { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.inbox-felder + .inbox-regel-hinweis { margin: 12px 0 0; }
.inbox-regel-hinweis { margin: 0; max-width: 64ch; font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); overflow-wrap: anywhere; }

.inbox-zweizeiler { margin: 0 0 10px; }
.inbox-zweizeiler p { margin: 0; font: 400 13.5px/1.4 var(--schrift); color: var(--text); overflow-wrap: anywhere; }


.inbox-ki-rolle { margin: 0 0 10px; padding: 7px 11px; border-radius: 8px; background: var(--erhoben);
  border-left: 3px solid var(--akzent); color: var(--text-leise); font: 400 12.5px/1.4 var(--schrift); }

.inbox-ki-rolle-wert { font-weight: 600; color: var(--text); }

.inbox-ki-gegenpartei { margin: 0 0 10px; padding: 7px 11px; border-radius: 8px; background: var(--erhoben);
  border-left: 3px solid var(--akzent); color: var(--text-leise); font: 400 12.5px/1.4 var(--schrift); }
.inbox-ki-gegenpartei-wert { font-weight: 600; color: var(--text); }
.inbox-felder { margin: 0 0 12px; display: grid; gap: 6px 14px; }
.inbox-feld { display: grid; grid-template-columns: 7.5em minmax(0, 1fr); gap: 2px 12px; align-items: baseline; }
.inbox-feld dt { font: 500 11px/1.4 var(--mono); letter-spacing: 0.05em; text-transform: uppercase;
  color: var(--text-leise); margin: 0; }
.inbox-feld dd { margin: 0; font: 400 14px/1.4 var(--schrift); color: var(--text);
  min-width: 0; overflow-wrap: anywhere; }

.inbox-anhaenge { list-style: none; padding: 0; margin: 0; display: grid; gap: 2px; }

.inbox-anhaenge a { color: var(--akzent-text); text-decoration: underline; overflow-wrap: anywhere; }
.inbox-anhang-groesse { color: var(--text-leise); font: 400 12px/1.4 var(--mono); margin-left: 6px; }

.inbox-auszug { white-space: pre-wrap; overflow-wrap: anywhere; min-width: 0;
  border-left: 2px solid var(--trennlinie); padding: 2px 0 2px 10px; color: var(--text-leise);
  font: 400 13.5px/1.5 var(--schrift); max-height: 12em; overflow-y: auto; }

.ki-dialog { margin: 0 0 14px; padding: 12px 14px; border-radius: 8px; background: var(--erhoben);
  border: 1px solid var(--feldrand); border-left: 3px solid var(--akzent-text); min-width: 0; overflow-wrap: anywhere; }
.ki-dialog-kopf { display: flex; align-items: baseline; justify-content: space-between; gap: 2px 12px; flex-wrap: wrap; margin: 0 0 10px; }
.ki-dialog-titel { margin: 0; font: 500 12px/1.3 var(--mono); letter-spacing: 0.05em; text-transform: uppercase; color: var(--text); }
.ki-dialog-stand { font: 400 12.5px/1.35 var(--schrift); color: var(--text-leise); }

.ki-quelle { font: 600 12.5px/1.3 var(--schrift); color: var(--text); margin-right: 8px; }

.marke-ueberholt { margin-left: 6px; }
.ki-dialog .inbox-felder { margin: 0 0 12px; gap: 12px 14px; }
.ki-dialog .inbox-feld { grid-template-columns: 6.5em minmax(0, 1fr); }
.ki-dialog .inbox-feld dd { overflow-wrap: anywhere; white-space: pre-line; }
.ki-meta { display: block; margin: 0 0 2px; font: 400 12px/1.35 var(--schrift); color: var(--text-leise); }
.ki-liest { margin: 0 0 4px; font: 500 14px/1.4 var(--schrift); color: var(--text); }
.ki-satz { margin: 0 0 12px; font: 400 13px/1.45 var(--schrift); color: var(--text); max-width: 72ch; }
.ki-satz:last-child { margin-bottom: 0; }

.ki-wiederholen { margin: 0 0 12px; }

.ki-analyse { margin: 0; }
.ki-plan { margin: 0; padding: 0 0 0 1.35em; display: grid; gap: 9px; list-style: decimal; }
.ki-plan > li { padding-left: 2px; }
.ki-plan > li::marker { font-weight: 600; }
.ki-schritt-kopf { font-weight: 600; }
.ki-schritt-ungueltig .marke { margin-left: 6px; vertical-align: 1px; white-space: nowrap; }
.ki-schritt-fehler { display: block; margin-top: 4px; font: 400 13px/1.4 var(--schrift); color: var(--warnung); }
.ki-nachschlagen, .ki-plan-alt { margin: 0 0 12px; }
.ki-nachschlagen > summary, .ki-plan-alt > summary { cursor: pointer; width: fit-content; max-width: 100%;
  font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); }
.ki-nachschlagen ul { margin: 6px 0 0; padding-left: 18px; font: 400 12.5px/1.45 var(--schrift); color: var(--text-leise); }
.ki-plan-alt { margin: 0; }
.ki-plan-alt > .ki-plan { margin-top: 6px; color: var(--text-leise); }
.ki-kennung { white-space: nowrap; }
.ki-plan-satz { margin: 0 0 14px; font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); max-width: 70ch; }
.ki-dialog form.anlegen { margin: 0; }

.ki-dialog > .ki-kasten-aktionen { margin-top: 14px; }
.ki-dialog > .ki-kasten-aktionen:first-child, .ki-dialog-kopf + .ki-kasten-aktionen { margin-top: 12px; }
.ki-dialog > form.anlegen + .ki-kasten-aktionen { margin-top: 14px; }
.ki-dialog > .ki-kasten-aktionen + form.anlegen { margin-top: 14px; }
.ki-verlauf > .ki-abschnitt-satz { margin-top: 0; }

.ki-dialog-vorgang { scroll-margin-top: 16px; }
.ki-dialog .ki-frage-erhalten { display: block; margin: 0 0 12px; }
.ki-dialog .ki-frage-erhalten textarea { width: 100%; box-sizing: border-box; }

.ki-dialog .fuss { margin-top: 0; }

.ki-frage-zeile { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 8px; align-items: stretch; }
.ki-frage-zeile > .feld { display: contents; }
.ki-frage-zeile > .feld > span, .ki-frage-zeile > .feld > .hilfe { grid-column: 1 / -1; margin: 0 0 5px; }
.ki-frage-zeile > .feld > .hilfe { max-width: none; }
.ki-frage-zeile > .feld > textarea { grid-column: 1; min-height: 0; min-width: 0; width: 100%; box-sizing: border-box; resize: none; }
.ki-frage-zeile > button { grid-column: 2; }
.ki-frage-zeile > .feld > textarea:is(:focus, :valid) { min-height: 6.6em; resize: vertical; }
.ki-frage-zeile:has(> .feld > textarea:is(:focus, :valid)) > button { align-self: end; }

.ki-formular-herkunft { margin: 0; max-width: 72ch; overflow-wrap: anywhere; }

.ki-abschnitt { margin: 0 0 8px; }
.ki-abschnitt-satz { margin: 0 0 12px; max-width: 72ch; font: 400 13px/1.45 var(--schrift); color: var(--text-leise); overflow-wrap: anywhere; }
.ki-gruppe { margin: 0 0 26px; }
.ki-gruppe-kopf { color: var(--text); }
.akte.ki-akte { border-top-color: var(--feldrand); }
.akte.ki-akte > li { border-bottom-color: var(--feldrand); }
.ki-art { display: block; margin: 0 0 2px; font: 500 11px/1.4 var(--mono); letter-spacing: 0.05em; text-transform: uppercase; color: var(--text-leise); }
.ki-akte .satz { white-space: pre-line; }
.ki-akte .satz .ki-plan { margin-top: 2px; }
.ki-akte .satz code { font: 400 12.5px/1.45 var(--mono); overflow-wrap: anywhere; }

.ki-konfig .konfig-satz { margin: 0 0 14px; max-width: 72ch; font: 400 13.5px/1.5 var(--schrift); color: var(--text-leise); overflow-wrap: anywhere; }
.ki-konfig h3 { font: 600 14px/1.3 var(--schrift); margin: 22px 0 8px; }

.ki-konfig-form, .ki-sprache-form { display: flex; flex-direction: column; gap: 10px; max-width: 640px; margin: 0 0 8px; }
.ki-konfig-form .feldzeile, .ki-sprache-form .feldzeile { margin: 0; }

.ki-konfig-form .feldzeile.z3, .ki-sprache-form .feldzeile.z3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.ki-konfig-form select, .ki-sprache-form select { min-width: 0; max-width: 100%; }
.ki-konfig-form button, .ki-sprache-form button { align-self: flex-start; }
.ki-konfig-stand { margin: 0 0 6px; font: 400 13px/1.45 var(--schrift); color: var(--text-leise); overflow-wrap: anywhere; }
.ki-kette-form { margin: 0 0 12px; }
.ki-konfig .hinweis { margin-bottom: 8px; }
.ki-konfig .akte.ki-akte { margin-bottom: 8px; }


.inbox-original-text { white-space: pre-wrap; overflow-wrap: anywhere; min-width: 0;
  border-left: 2px solid var(--trennlinie); padding: 2px 0 2px 10px; color: var(--text-leise);
  font: 400 13.5px/1.5 var(--schrift); max-height: 24em; overflow-y: auto; }
.inbox-original-meldung { color: var(--text-leise); font: 400 13.5px/1.5 var(--schrift); margin: 0; }

.inbox-original-text a { color: var(--akzent-text); text-decoration: underline; overflow-wrap: anywhere; }

.vorgang-herkunft-original { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; }
.vorgang-herkunft-original-titel { font-weight: 600; }
.vorgang-herkunft-original-fehlt { flex-direction: column; align-items: flex-start; }
.vorgang-eml-nachholen { margin: 0; }

.original-outlook-hinweis { display: block; flex-basis: 100%; margin-top: 2px; font: 400 12px/1.35 var(--schrift); color: var(--text-leise); }

.ki-antwort-vorschlag { display: flex; flex-direction: column; gap: 8px; margin: 8px 0 0; }
.ki-antwort-text { white-space: pre-wrap; overflow-wrap: anywhere; min-width: 0; margin: 0;
  border-left: 2px solid var(--akzent); padding: 2px 0 2px 10px; color: var(--text-leise);
  font: 400 13.5px/1.5 var(--schrift); max-height: 20em; overflow-y: auto; }

.ki-antwort-fehler { color: var(--warnung); font: 400 13.5px/1.5 var(--schrift); margin: 8px 0 0; max-width: 70ch; overflow-wrap: anywhere; }

.ki-antwort-frage { display: flex; flex-direction: column; gap: 8px; margin: 8px 0 0; }
.ki-antwort-frage > .ki-satz { margin: 0; }
.ki-antwort-frage > .rueckfrage-knoepfe { align-self: flex-start; }

.ki-antwort-keine { margin: 8px 0 0; font: 400 13.5px/1.5 var(--schrift); color: var(--text-leise);
  border-left: 3px solid var(--akzent); padding-left: 10px; overflow-wrap: anywhere; }

.antwort-klapp { margin: 10px 0 0; }
.antwort-klapp-titel { cursor: pointer; list-style: none; display: flex; align-items: baseline; gap: 8px;
  font: 600 14px/1.3 var(--schrift); }
.antwort-klapp-titel::-webkit-details-marker { display: none; }
.antwort-klapp-titel::after { content: "\25B8"; content: "\25B8" / ""; font-size: 11px; color: var(--text-leise); }
.antwort-klapp[open] > .antwort-klapp-titel::after { content: "\25BE"; content: "\25BE" / ""; }
.antwort-koerper { display: flex; flex-direction: column; gap: 14px; margin-top: 12px; }
.antwort-in-outlook { display: flex; flex-direction: column; gap: 6px; border-left: 2px solid var(--akzent); padding-left: 10px; }

.vorgang-verkauf-neue-mail[data-verkauf-neue-mail="liegt"] { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }

.vorgang-mail { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; margin: 0 0 22px; }
.vorgang-mail-liegt { flex-direction: column; align-items: flex-start; gap: 6px; }
.antwort-outlook-satz { margin: 0; font: 400 13.5px/1.4 var(--schrift); }
.antwort-empfaenger { color: var(--text-leise); overflow-wrap: anywhere; }

.antwort-anhang-fehlt { margin: 0; color: var(--warnung); font: 400 13.5px/1.5 var(--schrift); overflow-wrap: anywhere; }

.antwort-outlook-text { margin: 2px 0 0; min-width: 0; }
.antwort-outlook-text > summary { cursor: pointer; font: 400 13px/1.4 var(--schrift); color: var(--text-leise); }
.antwort-outlook-koerper { white-space: pre-wrap; overflow-wrap: anywhere; min-width: 0; margin: 6px 0 0;
  font: 400 13.5px/1.5 var(--schrift); }
.antwort-oeffnen { align-self: flex-start; }
.antwort-zurueckziehen { margin: 0; }
.antwort-zurueckziehen-knopf { align-self: flex-start; cursor: pointer; list-style: none; display: inline-block; }
.antwort-zurueckziehen-knopf::-webkit-details-marker { display: none; }
.antwort-zurueckziehen-frage { margin: 8px 0; font: 400 13.5px/1.4 var(--schrift); }
.antwort-formular { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.antwort-eingriff { margin: 0; color: var(--text-leise); font: 400 13px/1.4 var(--schrift); overflow-wrap: anywhere; }
.antwort-grund { margin: 0; color: var(--warnung); font: 400 13.5px/1.5 var(--schrift); }
.antwort-modus { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; }
.antwort-allen-hinweis { color: var(--text-leise); font: 400 12.5px/1.4 var(--schrift); flex-basis: 100%; }

.antwort-anhaenge, .antwort-beleg { border: 1px solid var(--trennlinie); border-radius: 8px; padding: 8px 10px; display: flex; flex-direction: column; gap: 4px; margin: 0; min-width: 0; }
.antwort-anhaenge legend, .antwort-beleg legend { font: 500 12.5px/1.3 var(--schrift); color: var(--text-leise); padding: 0 4px; }

.antwort-anhaenge-klapp { min-width: 0; }
.antwort-anhaenge-titel { cursor: pointer; list-style: none; display: flex; align-items: baseline; gap: 8px;
  font: 500 13px/1.4 var(--schrift); padding: 2px 0; }
.antwort-anhaenge-titel::-webkit-details-marker { display: none; }
.antwort-anhaenge-titel::after { content: "\25B8"; content: "\25B8" / ""; font-size: 11px; color: var(--text-leise); }
.antwort-anhaenge-klapp[open] > .antwort-anhaenge-titel::after { content: "\25BE"; content: "\25BE" / ""; }
.antwort-anhaenge-titeltext { min-width: 0; overflow-wrap: anywhere; }
.antwort-anhaenge-zaehler { font-weight: 600; }
.antwort-anhaenge-klapp > .antwort-anhaenge { margin-top: 6px; }
.antwort-neu-kopf { margin: 6px 0 0; font: 600 14px/1.3 var(--schrift); color: var(--text); }
.antwort-fuss { display: flex; flex-wrap: wrap; gap: 8px; }
.antwort-ersetzen-hinweis { margin: 0; color: var(--text-leise); font: 400 12.5px/1.4 var(--schrift); }
.antwort-postfach-inaktiv, .antwort-persoenlich { margin: 10px 0 0; color: var(--text-leise); font: 400 13.5px/1.5 var(--schrift); }
.antwort-ki { align-self: flex-start; }

[data-mit-js] .antwort-ki { display: inline-block; }
.antwort-ki-ziel { min-width: 0; }

.antwort-ki-ziel:empty { display: none; }

.antwort-warte { margin: 0; color: var(--text-leise); font: 400 13.5px/1.4 var(--schrift); }
.antwort-liegt { display: flex; flex-direction: column; gap: 4px; }

.antwort-liegt[hidden] { display: none; }
.antwort-liegt-satz { margin: 0; font: 400 13.5px/1.4 var(--schrift); }
.antwort-fremdpostfach { margin: 0; color: var(--text-leise); font: 400 12.5px/1.4 var(--schrift); overflow-wrap: anywhere; }

.antwort-gesendet { border-left: 2px solid var(--akzent); padding-left: 10px; min-width: 0; }
.antwort-gesendet-kopf { cursor: pointer; list-style: none; display: flex; align-items: baseline; gap: 8px; margin: 0;
  font: 500 13.5px/1.4 var(--schrift); }
.antwort-gesendet-kopf::-webkit-details-marker { display: none; }
.antwort-gesendet-kopf::after { content: "\25B8"; content: "\25B8" / ""; font-size: 11px; color: var(--text-leise); }
.antwort-gesendet[open] > .antwort-gesendet-kopf::after { content: "\25BE"; content: "\25BE" / ""; }
.antwort-gesendet-kopf-text { min-width: 0; overflow-wrap: anywhere; }
.antwort-gesendet-inhalt { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; min-width: 0; }
.antwort-gesendet-an, .antwort-gesendet-von {
  margin: 0; color: var(--text-leise); font: 400 13px/1.4 var(--schrift); overflow-wrap: anywhere; }
.antwort-gesendet-text, .antwort-textkasten { margin: 2px 0 0; }
.antwort-gesendet-text > summary, .antwort-textkasten > summary { cursor: pointer; font: 400 13px/1.4 var(--schrift); color: var(--text-leise); }
.antwort-gesendet-massgebend { margin: 6px 0; color: var(--text-leise); font: 400 12.5px/1.4 var(--schrift); }

.antwort-gesendet-koerper, .antwort-textkasten > pre { white-space: pre-wrap; overflow-wrap: anywhere; min-width: 0; margin: 0;
  font: 400 13.5px/1.5 var(--schrift); }
.antwort-eml { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-width: 0; }
.antwort-eml-ablegen { margin: 0; }
.antwort-verworfen { margin: 0; color: var(--text-leise); font: 400 13.5px/1.4 var(--schrift); }
.vorgang-korrespondenz { margin: 0 0 22px; }
.vorgang-korrespondenz-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.vorgang-korrespondenz-mail { display: flex; flex-direction: column; gap: 6px; }
.korrespondenz-ausserhalb { margin: 0; color: var(--text-leise); font: 400 12.5px/1.4 var(--schrift); overflow-wrap: anywhere; }

.inbox-original-block { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-width: 0; }
.inbox-original-ziel { min-width: 0; align-self: stretch; }
.inbox-original-ziel:empty { display: none; }

.inbox-original-links { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; min-width: 0; }
.text-knopf { background: none; border: 0; padding: 0; margin: 0; font: inherit; color: var(--akzent-text);
  text-decoration: underline; cursor: pointer; text-align: left; overflow-wrap: anywhere; }
.inbox-original-links .trenner { color: var(--text-leise); }

.ablage-datei-anzeigen { background: none; border: 0; padding: 0; font: inherit; color: var(--akzent-text);
  cursor: pointer; text-decoration: underline; text-align: left; overflow-wrap: anywhere; }
.ablage-eml-ziel { flex-basis: 100%; }
.ablage-eml-ziel:empty { display: none; }
.inbox-aktionen { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-start; position: relative; }
.inbox-aktionen .inbox-dialog { margin-bottom: 0; }

details.inbox-dialog-verwerfen { display: none; }
[data-mit-js] details.inbox-dialog-verwerfen { display: block; }

[data-mit-js] details.inbox-dialog-verwerfen[open] > summary { display: none; }

.inbox-verwerfen-ohne-skript > a { display: inline-flex; text-decoration: none; }
.verwerfen-frage { margin: 0; font: 500 14px/1.4 var(--schrift); color: var(--text); overflow-wrap: anywhere; }

.verwerfen-bestaetigen { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 4px 0 0; }

.inbox-karten-fehler { flex-basis: 100%; margin: 0; color: var(--warnung); font: 500 13.5px/1.4 var(--schrift);
  max-width: 60ch; overflow-wrap: anywhere; }

.inbox-andocken { margin: 0 0 12px; padding: 10px 12px; border-radius: 8px; background: var(--erhoben);
  border-left: 3px solid var(--akzent); display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.inbox-andocken-hinweis { margin: 0; font: 400 13px/1.45 var(--schrift); color: var(--text); overflow-wrap: anywhere; }

.outlook-hinweis { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; margin: 0 0 12px; padding: 10px 12px;
  border-left: 3px solid var(--trennlinie); background: var(--erhoben); }
.outlook-hinweis-satz { flex: 1 1 28ch; min-width: 0; margin: 0; font: 400 13px/1.45 var(--schrift); color: var(--text); overflow-wrap: anywhere; }

.inbox-karte-persoenlich { margin: 0 0 12px; font: 400 13px/1.45 var(--schrift); color: var(--text); overflow-wrap: anywhere; }
.inbox-andocken-form { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; margin: 0; min-width: 0; align-self: stretch; }
.inbox-andocken-form .feldzeile { margin: 0; align-self: stretch; }

.inbox-andocken-anlass { border: 1px solid var(--trennlinie); border-radius: 6px; padding: 10px 12px;
  margin: 0; min-width: 0; max-width: 100%; box-sizing: border-box; align-self: stretch; display: grid; gap: 7px; }
.inbox-andocken-anlass legend { font: 500 11.5px/1 var(--mono); letter-spacing: 0.05em; text-transform: uppercase;
  color: var(--text-leise); padding: 0; }
.inbox-andocken-anlass .kaestchen { white-space: normal; align-items: flex-start; overflow-wrap: anywhere; }
.inbox-andocken-neu { margin: 0; font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); overflow-wrap: anywhere; }

.inbox-dialog-zu-vorgang > .inbox-andocken { margin: 14px 0 0; }
.inbox-dialog[open] { flex-basis: 100%; }

.inbox-aktionen:has(> .inbox-dialog-annehmen[open]) > .inbox-dialog-verwerfen:not([open]) { position: absolute; left: 0; bottom: 0; margin: 0; }
.inbox-aktionen:has(> .inbox-dialog-annehmen[open]) > .inbox-dialog-verwerfen { order: 1; }

.inbox-aktionen:has(> .inbox-dialog-annehmen[open]):has(> .inbox-dialog-zu-vorgang[open]) > .inbox-dialog-verwerfen:not([open]) { position: static; }


.inbox-aktionen:has(> .inbox-dialog-annehmen[open]) > :is(.inbox-direkt, .inbox-plan-weg, .inbox-plan-sperre, .inbox-dialog-zu-vorgang:not([open]), .ki-analyse) { display: none; }

.inbox-dialog-annehmen:not([open]) > summary .griff-auf,
.inbox-dialog-annehmen[open] > summary .griff-zu { display: none; }

.inbox-dialog-annehmen[open] .fuss { align-self: flex-end; width: fit-content; max-width: 100%; }

.inbox-partei { border: 1px solid var(--trennlinie); border-radius: 6px; padding: 12px 14px; margin-bottom: 16px; }
.inbox-partei-neu { font: 500 11.5px/1 var(--mono); letter-spacing: 0.05em; text-transform: uppercase;
  color: var(--text-leise); margin: 4px 0 14px; }


.inbox-partei .inbox-neu-felder { display: none; }
.inbox-partei:has(input[name="neuAnlegen"]:checked) .inbox-neu-felder { display: contents; }


.gegenpartei-adresse { margin: 0 0 20px; color: var(--text-leise); font-size: 0.9em; }

.gegenpartei-aendern-form [data-gegenpartei-neuladen] { margin-bottom: 20px; }

.hinweis-ungespeichert { color: var(--text-leise); align-self: center; }

.inbox-dialog-annehmen .inbox-neu-klapp { display: block; }
.inbox-dialog-annehmen .inbox-neu-klapp-zeile { cursor: pointer; font: 400 12.5px/1.35 var(--schrift);
  color: var(--text-leise); }
.inbox-dialog-annehmen .inbox-neu-klapp-inhalt { display: flex; flex-direction: column; gap: 14px;
  margin-top: 14px; }

.inbox-dialog-annehmen .inbox-kontakt { border: 0; padding: 0; margin: 0; min-width: 0;
  display: flex; flex-direction: column; gap: 14px; }
.inbox-dialog-annehmen .inbox-kontakt > legend { font: 500 11.5px/1 var(--mono); letter-spacing: 0.05em;
  text-transform: uppercase; color: var(--text-leise); padding: 0; margin: 0 0 8px; }
.inbox-dialog-annehmen .inbox-kontakt-hilfe { font: 400 12.5px/1.35 var(--schrift); color: var(--text-leise);
  margin: 0; max-width: 46ch; }


.inbox-anhang-auswahl { border: 1px solid var(--trennlinie); border-radius: 6px; padding: 12px 14px;
  margin: 0 0 16px; min-width: 0; display: grid; gap: 8px; }
.inbox-anhang-auswahl legend { font: 500 11.5px/1 var(--mono); letter-spacing: 0.05em; text-transform: uppercase;
  color: var(--text-leise); padding: 0; }


.inbox-anhang-auswahl .kaestchen, .antwort-anhaenge .kaestchen { white-space: normal; align-items: flex-start; overflow-wrap: anywhere; }
.inbox-anhang-hinweis { font: 400 12.5px/1.35 var(--schrift); color: var(--text-leise); margin: 2px 0 0; }

.inbox-entschieden { margin-top: 24px; }

.inbox-entschieden-kopf { font: 500 11.5px/1.3 var(--mono); letter-spacing: 0.05em;
  text-transform: uppercase; color: var(--text); margin: 0 0 10px; }
.inbox-entschieden-sub { text-transform: none; color: var(--text-leise); }
.inbox-entschieden-zeile { border-top: 1px solid var(--trennlinie); }

.inbox-entschieden-mehr { border-top: 1px solid var(--trennlinie); padding: 9px 0 0; margin: 0; font: 400 13px/1.4 var(--schrift); color: var(--text-leise); }
.inbox-entschieden-aeltere { color: var(--akzent-text); }
.inbox-entschieden-zeile .inbox-betreff { font: 500 14px/1.4 var(--schrift); flex: 1 1 12ch; }

.inbox-entschieden-detail { min-width: 0; }
.inbox-entschieden-kopf-zeile { display: flex; align-items: baseline; gap: 6px 14px; flex-wrap: wrap;
  padding: 9px 0; cursor: pointer; list-style: none; }
.inbox-entschieden-kopf-zeile::-webkit-details-marker { display: none; }
.inbox-entschieden-kopf-zeile::after { content: "\25B8"; content: "\25B8" / ""; font-size: 11px; color: var(--text-leise); align-self: center; }
.inbox-entschieden-detail[open] .inbox-entschieden-kopf-zeile::after { content: "\25BE"; content: "\25BE" / ""; }
.inbox-entschieden-meta { font: 400 13px/1.4 var(--schrift); color: var(--text-leise); overflow-wrap: anywhere; }

.inbox-rest-offen { font: 500 12.5px/1.4 var(--schrift); color: var(--warnung); overflow-wrap: anywhere; }
.inbox-entschieden-detail .inbox-felder { padding: 2px 0 12px; }
.inbox-angenommen { font: 500 13px/1.4 var(--mono); color: var(--text); white-space: nowrap; }

.inbox-angedockt { font: 500 13px/1.4 var(--schrift); color: var(--text); overflow-wrap: anywhere; }
.inbox-verworfen { font: 400 13px/1.4 var(--schrift); color: var(--text-leise); overflow-wrap: anywhere; }

.inbox-ki-hinweis { font: 400 13px/1.4 var(--schrift); color: var(--text-leise); overflow-wrap: anywhere; }

.ki-entschieden-klapp { margin: 0 0 12px; min-width: 0; }
.ki-entschieden-klapp > summary { cursor: pointer; width: fit-content; max-width: 100%; margin: 0 0 8px;
  font: 500 12px/1.4 var(--mono); letter-spacing: 0.05em; text-transform: uppercase; color: var(--text-leise); }




.zeile.vertrag { grid-template-columns: 62px minmax(0, 1fr) 200px 110px 210px 128px; }
.zeile.vertrag-ohne-partei { grid-template-columns: 62px minmax(0, 1fr) 110px 210px 128px; }
.zeile.vertrag .partei { color: var(--text-leise); font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }

.zeile.ticket { grid-template-columns: 112px minmax(0, 1fr) 150px 150px 190px; align-items: start; padding-top: 10px; padding-bottom: 10px; }
.zeile.ticket .titel { white-space: normal; overflow: visible; text-overflow: clip; }
.ticket-id { display: flex; gap: 6px; align-items: center; }

.ticket-partei { display: block; margin-top: 2px; color: var(--text-leise); font-size: 13px; }
.uhr-zelle { display: flex; flex-direction: column; gap: 2px; font-size: 13px; min-width: 0; }
.uhr-termin { font: 400 12.5px/1.3 var(--mono); }

.uhr-zelle [data-zusatztermin] { margin-top: 6px; }
.uhr-bestaetigung { color: var(--text); font-weight: 500; }
.zustand-traeger { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.zustand-traeger .traeger { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zeile.ticket-kopf, .zeile.ticket-kopf:hover { min-height: 0; padding-top: 0; padding-bottom: 6px; background: transparent;
  font: 500 11px/1.2 var(--mono); letter-spacing: 0.05em; text-transform: uppercase; color: var(--text-leise); }
.tickets-hinweis { margin: 14px 0 0; color: var(--text-leise); font-size: 13px; }

.auswertung-filter { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin: 0 0 18px; }
.auswertung-zeitraum { margin: 0 0 6px; color: var(--text-leise); font-size: 13px; }
.auswertung-gruppe { margin: 0 0 8px; }
.auswertung-gruppe-titel { font: 600 16px/1.3 var(--schrift); letter-spacing: -0.01em; margin: 26px 0 10px; overflow-wrap: anywhere; }
.auswertung-summe { margin-top: 18px; padding-top: 4px; border-top: 1px solid var(--trennlinie); }
.auswertung-klasse { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 4px 20px; align-items: start; padding: 10px 0; border-bottom: 1px solid var(--trennlinie); }
.auswertung-klasse:last-child { border-bottom: 0; }
.auswertung-klasse-kopf { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; padding-top: 4px; }
.auswertung-anzahl { font: 500 13px/1.3 var(--schrift); }
.auswertung-verworfen { flex: 0 0 100%; font: 400 12.5px/1.3 var(--schrift); color: var(--text-leise); }
.auswertung-tabelle { max-width: 640px; }
.auswertung-tabelle th[scope="row"] { text-align: left; font-weight: 500; white-space: nowrap; padding: 7px 14px 7px 0; border-bottom: 1px solid var(--trennlinie); }
.auswertung-tabelle tr:last-child th[scope="row"] { border-bottom: 0; }
.auswertung-tabelle td { font-variant-numeric: tabular-nums; }
.auswertung-spaet { color: var(--warnung); font-weight: 600; }
.auswertung-verspaetet-block { margin-top: 8px; }
.auswertung-rolle { overflow-x: auto; }
.auswertung-verspaetet td { vertical-align: top; }
.auswertung-ticket { min-width: 12rem; }
.auswertung-ticket .kennung { display: block; }
.auswertung-ticket-titel { display: block; margin-top: 2px; }
.auswertung-csv { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; }
@media (max-width: 1023px) {
  
  .auswertung-klasse { grid-template-columns: minmax(0, 1fr); }
  .auswertung-klasse-kopf { padding-top: 0; }
  
  .auswertung-verspaetet thead { display: none; }
  .auswertung-verspaetet tr { display: block; padding: 7px 0; border-bottom: 1px solid var(--trennlinie); }
  .auswertung-verspaetet tr:last-child { border-bottom: 0; }
  .auswertung-verspaetet td { display: inline-block; padding: 0 14px 0 0; border: 0; }
  .auswertung-verspaetet td[data-label]::before { content: attr(data-label) " "; color: var(--text-leise); }
  .auswertung-verspaetet td.auswertung-ticket { display: block; padding: 0 0 4px; }
  
  .titel { overflow: visible; text-overflow: clip; white-space: normal; }
  .zeile { grid-template-columns: 1fr auto; gap: 4px 12px; padding: 12px 10px 12px 9px; min-height: 0; }
  .kennung { grid-row: 1; }
  .traeger { grid-row: 1; grid-column: 2; text-align: right; }
  .titel { grid-row: 2; grid-column: 1 / -1; }
  .frist { grid-row: 3; grid-column: 1; }
  .zustand { grid-row: 3; grid-column: 2; text-align: right; }
  
  .zeile.mit-typ { grid-template-columns: 1fr auto; }
  .zeile.mit-typ .typspalte { grid-row: 4; grid-column: 1 / -1; }
  
  .zeile.ticket-kopf { display: none; }
  .zeile.ticket { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .zeile.ticket .ticket-id { grid-row: 1; grid-column: 1; }
  .zeile.ticket .zustand-traeger { grid-row: 1; grid-column: 2; text-align: right; align-items: flex-end; }
  .zeile.ticket .titel { grid-row: 2; grid-column: 1 / -1; }
  .zeile.ticket .uhr-zelle:nth-of-type(3) { grid-row: 3; grid-column: 1; }
  .zeile.ticket .uhr-zelle:nth-of-type(4) { grid-row: 3; grid-column: 2; }
  
  .zeile.vertrag-kopf { display: none; }
  .zeile.vertrag, .zeile.vertrag-ohne-partei { grid-template-columns: minmax(0, 1fr) auto; }
  .zeile.vertrag .kennung, .zeile.vertrag-ohne-partei .kennung { grid-row: 1; grid-column: 1; }
  .zeile.vertrag .traeger, .zeile.vertrag-ohne-partei .traeger { grid-row: 1; grid-column: 2; text-align: right; }
  .zeile.vertrag .titel, .zeile.vertrag-ohne-partei .titel { grid-row: 2; grid-column: 1 / -1; }
  .zeile.vertrag .partei { grid-row: 3; grid-column: 1 / -1; white-space: normal; }
  .zeile.vertrag .frist { grid-row: 4; grid-column: 1; }
  .zeile.vertrag .zustand { grid-row: 4; grid-column: 2; text-align: right; }
  .zeile.vertrag-ohne-partei .frist { grid-row: 3; grid-column: 1; }
  .zeile.vertrag-ohne-partei .zustand { grid-row: 3; grid-column: 2; text-align: right; }
}
@media (max-width: 767px) {
  
  .cmp-angaben { grid-template-columns: minmax(0, 1fr); gap: 2px 0; }
  .cmp-angaben dd { margin-bottom: 8px; }
  
  .ueber-angaben { display: block; }
  .ueber-angaben > div { display: block; margin: 0 0 8px; }
  
  .hilfe-bild svg { min-width: 680px; }
  
  .auswertung-filter { flex-direction: column; align-items: stretch; gap: 0; }
  .auswertung-filter .filter-feld { margin-bottom: 16px; min-width: 0; max-width: 100%; }
  .auswertung-filter .filter-feld :is(input, select) { width: 100%; min-width: 0; }
  .auswertung-filter .knopf { align-self: flex-start; }
  .compliance-filter { flex-direction: column; align-items: stretch; gap: 0; }   
  .compliance-filter .filter-feld { margin-bottom: 16px; }   
  .compliance-filter .filter-feld { display: block; }   
  .compliance-filter .filter-feld :is(input, select) { width: 100%; min-width: 0; }
  .compliance-filter .knopf { align-self: flex-start; }
  .fw-filter { flex-direction: column; align-items: stretch; gap: 0; }
  .fw-filter .knopf { align-self: flex-start; }
  .auswertung-tabelle thead { display: none; }
  .auswertung-tabelle tr { display: block; padding: 7px 0; border-bottom: 1px solid var(--trennlinie); }
  .auswertung-tabelle tr:last-child { border-bottom: 0; }
  .auswertung-tabelle th[scope="row"] { display: block; border: 0; padding: 0 0 2px; }
  .auswertung-tabelle td { display: inline-block; padding: 0 14px 0 0; border: 0; }
  .auswertung-tabelle td[data-label]::before { content: attr(data-label) " "; color: var(--text-leise); }
  .auswertung-csv .knopf { flex: 0 1 auto; }
  
  .ki-dialog .inbox-feld { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .ki-dialog { padding: 12px; }
  
  .ki-frage-zeile { grid-template-columns: minmax(0, 1fr); }
  .ki-frage-zeile > button { grid-column: 1; justify-self: start; align-self: auto; margin-top: 8px; }
  .ki-frage-zeile:has(> .feld > textarea:is(:focus, :valid)) > button { align-self: auto; }
  .inbox-original-links { flex-direction: column; align-items: flex-start; gap: 4px; }
  .inbox-original-links .trenner { display: none; }
  
  :root :is(input, select, textarea):not(#_) { font-size: 16px; }
  
  header { flex-wrap: wrap; height: auto; gap: 8px 12px; padding: 8px 14px; }
  header .kopf-rechts { gap: 8px; }
  header .kopf-rechts .umschalter button { padding: 0 7px; }
  header .kopf-rechts .abmelden { order: 4; margin-left: auto; }
  
  .marke-wortmarke { gap: 8px; }
  .produkt-name { padding-left: 8px; font-size: 15px; }
  
  .abschnitt-ergebnis .ki-holen-gruppe { max-width: 158px; }
  .abschnitt-ergebnis .feld > span, .abschnitt-ergebnis .feld > .hilfe { padding-right: 158px; }
  .abschnitt-ergebnis:has(.ki-vorbelegung-anhang) .feld > .hilfe { min-height: 44px; }
  
  .ablage-tabelle .z-groesse { display: none; }
  
  .inbox-aktionen:has(> .inbox-dialog-annehmen[open]) > .inbox-dialog-verwerfen:not([open]) { position: static; }
  
  .inbox-dialog-annehmen[open] .fuss { align-self: auto; width: auto; }
  
  
  .feldzeile.z1, .feldzeile.z3 { display: contents; }
  .feldzeile > .feld { display: flex; flex-direction: column; gap: 5px; grid-row: auto;
                       grid-template-rows: none; }
  
  .anlegen .feld { margin-bottom: 20px; }
  
  .anlegen .kaestchen-feld { margin-bottom: 20px; }
  
  .naechster { padding-left: 12px; }
  .neue-post { padding-left: 12px; }   
  
  .filterleiste { flex-direction: column; align-items: stretch; gap: 0; }
  .filter-feld { margin-bottom: 16px; }
  
  .filter-ki { align-self: stretch; height: auto; margin-bottom: 16px; }
  
  .filter-suche { flex: 0 0 auto; }
  
  .adressbuch-suche-form .filter-suche { flex: 1 1 100%; }
  .filter-feld :is(input, select) { width: 100%; min-width: 0; }
  .filterleiste .filter-zuruecksetzen { align-self: flex-start; }
  .feldzeile > .feld > span, .feldzeile > .feld .hilfe { align-self: auto; padding-bottom: 0; }
  .feldzeile > .feld .hilfe:empty { display: none; }
  .feldzeile > .feld .hilfe:not(:empty) { padding-top: 0; }   
  main { padding: 20px 16px 32px; }
  .hinweis.hinweis-seite { margin: 12px 16px 0; }
  .akte > li { grid-template-columns: 1fr; gap: 3px; }
  .feld { flex: 1 1 100%; }
  
  .meldung-neu fieldset > .feld { align-self: stretch; }
  .meldung-neu .feld input[type="text"] { width: 100%; }
  
  .feld :is(select, input, textarea) { min-width: 0; width: 100%; }
  
  .email-aendern .feld :is(input, select),
  .person-anlegen .feld input[type="email"] { min-width: 0; }
  
  .handlungen .feld textarea { width: 100%; }
  
  .personen > li, .zuweisungen > li, .stufen > li, .rollen > li, .feiertage > li, .instanz > li,
  .umsysteme > li, .postfaecher > li, .betrieb > li, .parteien > li { grid-template-columns: 1fr; }
  
  
  .zeiten-form .spanne-eingabe { flex-wrap: wrap; }
  .zeiten-form .spanne-eingabe select { flex: 1 1 100%; }
  .zeiten-tabelle thead { display: none; }
  .zeiten-tabelle tr { display: block; padding: 7px 0; border-bottom: 1px solid var(--trennlinie); }
  .zeiten-tabelle tr:last-child { border-bottom: 0; }
  .zeiten-tabelle td { display: block; padding: 0; border: 0; }
  .zeiten-tabelle td:nth-child(1), .zeiten-tabelle td:nth-child(2) { display: inline; font-weight: 500; }
  .zeiten-tabelle td:nth-child(2) { margin-left: 8px; }
  .zeiten-tabelle td[data-label]::before { content: attr(data-label) " "; color: var(--text-leise); }
  .zeiten-form .fenster-zeiten, .zeiten-form .zeiten-wirkung { margin-bottom: 20px; }
  
  
  .gegenpartei-aendern-block.voll { border-width: 1px 0; border-radius: 0; padding: 14px 0; }
  .gegenpartei-aendern-block .inbox-partei { border: 0; padding: 0; }
  .vertrag-wahl-zeile select { flex: 1 1 100%; }
  
  .fw-zeile { grid-template-columns: 64px minmax(0, 1fr) auto; }
  .fw-zeile .fw-datum, .fw-zeile .fw-person, .fw-zeile .fw-seite { display: none; }
}

@media (max-width: 600px) {
  
  .handlungen > form { grid-template-columns: 1fr; row-gap: 12px; }
  .handlungen > form button { grid-column: 1; align-self: start; }
  .handlungen > form input[type="date"] { min-width: 0; }
  
  #teil-vorgang .ablage-dateien { max-height: 280px; }
}
@media (prefers-reduced-motion: no-preference) {
  .zeile.frisch { animation: aufblitzen 150ms ease-out; }
}
@keyframes aufblitzen { from { border-left-color: var(--akzent); } }

.adressbuch h2 { font: 600 15px/1.2 var(--schrift); letter-spacing: -0.01em; margin: 26px 0 12px; }
.adressbuch .note { margin: 0 0 22px; color: var(--text-leise); max-width: 62ch; }
.adressbuch .zurueck { display: inline-block; margin-bottom: 16px; font-size: 13px; }
.adressbuch .alias, .adressbuch .anzahl { color: var(--text-leise); font-size: 12.5px; }

#teil-adressbuch .parteien > li { grid-template-columns: minmax(0, 1fr); }
#teil-adressbuch .parteien .zeilen-inhalt { flex-wrap: nowrap; }
.partei-namen { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, auto); justify-content: start;
  align-items: baseline; column-gap: 12px; min-width: 0; flex: 0 1 auto; }
.partei-namen > .name, .partei-namen > .alias { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#teil-adressbuch .parteien .zeilen-inhalt > .wert { flex: none; max-width: 16ch;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#teil-adressbuch .parteien .zeilen-inhalt > :is(.marke, .anzahl) { flex: none; white-space: nowrap; }

@media (min-width: 768px) { .adressbuch-suche-form .filter-suche { flex: 0 1 36ch; } }

#teil-adressbuch .kartenkopf h2 { font: 600 16px/1.3 var(--schrift); margin: 0; }

.adressbuch-form { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; margin: 16px 0 22px; }

.fuehrung-satz { margin: 6px 0 0; color: var(--text-leise); max-width: 62ch; font-size: 12.5px; }

.adressbuch-bexio { margin: 0 0 22px; }

.adressbuch-cashctrl { margin: 0 0 22px; }
.bexio-vorschau .note { margin-bottom: 18px; }
.bexio-vorschau-form { margin: 0; }
.bexio-vorschau-form button { margin-top: 10px; }

.parteien > li.bexio-firma { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; }
.bexio-wahl { display: inline-flex; align-items: baseline; gap: 8px; font-weight: 500; cursor: pointer; min-width: 0; }
.bexio-personen { list-style: none; margin: 6px 0 0; padding: 0 0 0 22px; flex-basis: 100%;
                  display: flex; flex-direction: column; gap: 6px; }
.bexio-personen > li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; min-width: 0; }

.bexio-mail-hinweis { color: var(--warnung); font-size: 13px; min-width: 0; overflow-wrap: anywhere; }


.gebiet-reiter { display: flex; gap: 22px; margin: 0 0 18px; border-bottom: 1px solid var(--trennlinie); flex-wrap: wrap; }
.gebiet-reiter a { color: var(--text-leise); text-decoration: none; padding: 0 0 8px; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.gebiet-reiter a[aria-current="page"] { color: var(--text); border-bottom-color: var(--akzent-text); }
.gebiet-reiter .anzahl { font: 500 12px/1 var(--mono); margin-left: 4px; }
.vertrag-liste .zeile .traeger { text-align: right; }
.zeile.vertrag-kopf, .zeile.vertrag-kopf:hover { min-height: 0; padding-top: 0; padding-bottom: 6px; background: transparent;
  font: 500 11px/1.3 var(--mono); letter-spacing: 0.05em; text-transform: uppercase; color: var(--text-leise); }
.zeile.vertrag-kopf .rechts { text-align: right; }
.vertrag-daten .wert-leise { color: var(--text-leise); margin-left: 8px; font-size: 13px; }
.vertrag-schritt { border: 1px solid var(--trennlinie); border-radius: 6px; padding: 14px 16px; margin: 0 0 22px; max-width: 760px; }
.vertrag-schritt h3 { margin: 0 0 10px; font-size: 15px; }
.vertrag-schritt ol { margin: 0 0 12px; padding-left: 20px; }
.vertrag-schritt li { margin-bottom: 6px; overflow-wrap: anywhere; }
.vertrag-schritt .erledigt { color: var(--text-leise); }
.vorschau { border-left: 3px solid var(--trennlinie); padding: 6px 12px; margin: 10px 0 12px; color: var(--text-leise); font-size: 13.5px; max-width: 70ch; overflow-wrap: anywhere; }
.vorschau p { margin: 0 0 6px; }
.vorschau ul { margin: 6px 0 0; padding-left: 18px; }
.vertrag-erfassen-einstieg, .vertrag-vorgang-anlegen { margin: 14px 0 26px; }
.vertrag-erfassen-einstieg a.knopf, .vertrag-vorgang-anlegen a.knopf { text-decoration: none; display: inline-block; }
.vertrag-fassung { margin-top: 6px; }

.vertrag-hinzufuegen-block, .gegenpartei-aendern-block { border: 1px solid var(--trennlinie); border-radius: 6px; padding: 14px 16px; margin: 0 0 22px; max-width: 760px; }
.vertrag-hinzufuegen-block h3, .gegenpartei-aendern-block h3 { margin: 0 0 10px; font-size: 15px; overflow-wrap: anywhere; }

.gegenpartei-aendern-block select { max-width: 100%; min-width: 0; }
.gegenpartei-aendern-block .note { margin: 0 0 10px; }

.gegenpartei-setzen { margin: 0 0 14px; }
.vertrag-wahl { border: 0; margin: 0 0 12px; padding: 0; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.vertrag-wahl-zeile { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; min-width: 0; }
.vertrag-wahl-zeile .feld { flex: 1 1 220px; min-width: 0; margin: 0; }
.vertrag-wahl-zeile select { max-width: 100%; min-width: 0; }
.vertrag-kundenfrage { border: 0; margin: 0 0 12px; padding: 0; min-width: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; }
.vertrag-kundenfrage legend { padding: 0; margin-bottom: 6px; font-weight: 500; }
.vertrag-kundenfrage .kaestchen { white-space: normal; overflow-wrap: anywhere; }
.ablage-zeile.datei .ablage-zeile-form:has(.vertrag-wahl) { flex-direction: column; align-items: flex-start; gap: 6px; }
.ablage-dialog-fuss .ablage-dialog-wahl { flex: 1 1 100%; order: -1; margin: 0; }

option:disabled { color: var(--text-leise); }
.vertrag-werk { list-style: none; margin: 0 0 14px; padding: 0; max-width: 760px; }
.vertrag-werk-dokument { display: flex; flex-direction: column; gap: 2px; padding: 6px 0; border-bottom: 1px solid var(--trennlinie); min-width: 0; }
.vertrag-werk-dokument .name { font-weight: 500; min-width: 0; overflow-wrap: anywhere; }
.vertrag-werk-dokument .wert { min-width: 0; overflow-wrap: anywhere; }
.vertrag-werk-dokument .wert.leer { color: var(--text-leise); }
.vertrag-werk-dokument .wert-leise { flex: 1 1 100%; margin: 0; color: var(--text-leise); font-size: 13px; overflow-wrap: anywhere; }

.vertrag-link { color: var(--akzent-text); text-decoration: underline; overflow-wrap: anywhere; }

.vertrag-dokument-block { border: 1px solid var(--trennlinie); border-radius: 6px; padding: 14px 16px; margin: 0 0 22px; max-width: 800px; }
.vertrag-dokument-block h2 { margin: 0 0 8px; font-size: 15px; }
.vertrag-dokument-name { margin: 0 0 10px; overflow-wrap: anywhere; }
.vertrag-dokument-akt { margin: 0; }
.vertrag-dokument-akt a.knopf { text-decoration: none; display: inline-block; }

.vertrag-erfassen-form { max-width: 800px; }

.feld-fest { display: block; padding: 7px 0; overflow-wrap: anywhere; font: 400 15px/1.4 var(--schrift); color: var(--text); }
.feld-herkunft { color: var(--text-leise); font-size: 13px; }


.vertrag-partei-wahl { display: block; min-width: 0; }
.vertrag-partei-wahl > select { width: 100%; min-width: 0; }
.vertrag-partei-wahl > .feld-herkunft { display: block; margin-top: 4px; }
.vertrag-partei-wahl > .feld-herkunft[hidden] { display: none; }
.vertrag-kreuz { margin: 18px 0 6px; }
.vertrag-kreuz .kaestchen { white-space: normal; align-items: flex-start; overflow-wrap: anywhere; }
.vertrag-kreuz .hilfe { display: block; font: 400 12.5px/1.35 var(--schrift); color: var(--text-leise); max-width: 60ch; margin-top: 4px; }

.vertrag-kreuz .sperrgrund { max-width: 60ch; }
.vertrag-kreuz .sperrgrund[hidden] { display: none; }
.vertrag-erfassen-form .aktionen a.knopf { text-decoration: none; display: inline-block; }
.ablage-als-vertrag { color: var(--akzent-text); font-size: 13px; text-decoration: underline; }
.ablage-datei-vertrag { color: var(--text-leise); font-size: 13px; text-decoration: underline; }


.vorgang-vertrag { margin: 0 0 22px; }
.vorgang-verkauf { margin: 0 0 22px; }
.vorgang-verkauf > * + * { margin-top: 8px; }
.vorgang-verkauf h3 { margin: 0; font: 600 13px/1.4 var(--schrift); }
.vorgang-verkauf-liste { margin: 0 0 8px; padding: 0; list-style: none; }
.vorgang-verkauf-sperre, .vorgang-verkauf-keiner { margin: 0; font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); }

.vorgang-verkauf-stufe { margin: 0; font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); }
.vorgang-verkauf-beleg + .vorgang-verkauf-beleg { margin-top: 14px; }
.vorgang-verkauf-beleg h4 { margin: 0 0 4px; font: 600 13px/1.4 var(--schrift); }
.vorgang-verkauf-beleg a { color: var(--akzent-text); }
.vorgang-verkauf-angaben { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 0 0 6px; font: 400 12.5px/1.4 var(--schrift); }
.vorgang-verkauf-angaben dt { color: var(--text-leise); }
.vorgang-verkauf-angaben dd { margin: 0; }
.vorgang-verkauf-tabelle { border-collapse: collapse; width: 100%; font: 400 12.5px/1.4 var(--schrift); }
.vorgang-verkauf-tabelle th, .vorgang-verkauf-tabelle td { padding: 4px 8px 4px 0; text-align: left; border-top: 1px solid var(--trennlinie); }
.vorgang-verkauf-tabelle th { font-weight: 600; color: var(--text-leise); }
.vorgang-verkauf-tabelle td:first-child { overflow-wrap: anywhere; } .vorgang-verkauf-tabelle td:not(:first-child) { white-space: nowrap; }   
.vorgang-verkauf-fehler { margin: 0; padding: 6px 10px; border-left: 3px solid var(--text-leise); font: 500 13px/1.4 var(--schrift); }
.vorgang-verkauf-fehler.ist-fehler { border-left-color: var(--warnung); }   
.vorgang-verkauf-zeile > .vorgang-verkauf-fehler { flex-basis: 100%; }
.vorgang-verkauf-offerte-form [aria-invalid="true"] { border-color: var(--warnung); box-shadow: 0 0 0 1px var(--warnung); }   
.vorgang-verkauf-handlungen > * + * { margin-top: 8px; }
.vorgang-verkauf-belege [data-belege-neu][hidden] { display: none; }   

details.vorgang-verkauf-offerte[open] { margin-bottom: 22px; }
.vorgang-verkauf-offerte-form, form.vorgang-verkauf-suchen, form.vorgang-verkauf-treffer { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.vorgang-verkauf-offerte-form .feld :is(input, select, textarea) { width: 100%; min-width: 0; box-sizing: border-box; }
:is(.vorgang-verkauf-offerte-form, form.vorgang-verkauf-suchen, form.vorgang-verkauf-treffer) > button { align-self: flex-start; }
.vorgang-verkauf-positionen, fieldset.vorgang-verkauf-treffer, form.vorgang-verkauf-treffer fieldset { display: flex; flex-direction: column; gap: 8px; min-width: 0;
  margin: 0; border: 1px solid var(--trennlinie); border-radius: 8px; padding: 8px 10px; }
.vorgang-verkauf-positionen legend, .vorgang-verkauf-treffer legend { font: 500 12.5px/1.3 var(--schrift); color: var(--text-leise); padding: 0 4px; }
:is(.vorgang-verkauf-positionen, .vorgang-verkauf-treffer) .vorgang-verkauf-liste { margin: 0; }
.vorgang-verkauf-zeile { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 12px; min-width: 0; }
.vorgang-verkauf-zeile + .vorgang-verkauf-zeile { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--trennlinie); }
.vorgang-verkauf-zeile > strong { flex-basis: 100%; font: 600 13px/1.4 var(--schrift); overflow-wrap: anywhere; }
.vorgang-verkauf-zeile > .feld { flex: 1 1 140px; min-width: 0; }

.vorgang-verkauf-zeile > .feld-steuer { flex: 1 1 auto; }

.vorgang-verkauf-zeile > [data-verkauf-steuer-hinweis] { flex-basis: 100%; }
.vorgang-verkauf-treffer li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font: 400 13.5px/1.4 var(--schrift); overflow-wrap: anywhere; min-width: 0; }
.vorgang-verkauf-treffer li + li { margin-top: 6px; }
.vorgang-verkauf-treffer li label { display: flex; align-items: flex-start; gap: 6px; min-width: 0; }
div.vorgang-verkauf-suchen { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px; min-width: 0; }
div.vorgang-verkauf-suchen > .feld { flex: 1 1 100%; min-width: 0; }

#verkauf-artikel-suchen { scroll-margin-top: 15rem; }

#verkauf-kunde, #verkauf-kontakt { scroll-margin-top: 1rem; }
.offerte-waehrung .feld { max-width: 14em; }   

.sichtkopf-knoepfe { display: flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }
.verkauf-neu-form { max-width: 100%; }
.verkauf-neu-abschnitt { font-size: 1rem; margin: 8px 0 4px; }
.verkauf-neu-kunde, .verkauf-neu-kontakt, .verkauf-neu-nummer { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.verkauf-neu-nummer .feld { max-width: 20em; }

.verkauf-neu-form .kaestchen { white-space: normal; }
details.verkauf-neu-kontakt > .feld, details.verkauf-neu-kontakt > button { margin-top: 8px; }
.verkauf-neu-kunde p, .verkauf-neu-kunde li { overflow-wrap: anywhere; }
.vorgang-verkauf-kontakt-anlegen fieldset { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.vorgang-verkauf-kontakt-anlegen > button { margin-top: 8px; }
.offerte-waehrung .vorgang-verkauf-fehler { margin-top: 6px; }
.offerte-mehr { margin: 0 0 4px; display: block; }   
.offerte-mehr > summary { margin-bottom: 8px; }
.offerte-ende { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.offerte-ende .vorgang-verkauf-hinweis { margin: 0; }
.vorgang-verkauf-hinweis { margin: 0; font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); }

.vorgang-verkauf-ausgang { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; }
.vorgang-verkauf-ausgang > .hinweis { flex-basis: 100%; margin: 0; }
.vorgang-verkauf-rechnung { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; min-width: 0; }   
.vorgang-verkauf-rechnung > p { flex: 1 1 100%; margin: 0; }
.vorgang-verkauf-rechnung .kaestchen { white-space: normal; }
.vorgang-vertrag > * + * { margin-top: 8px; }
.vorgang-vertrag-offen { margin: 0; }

.termine-filter { margin: 4px 0 12px; font: 400 13px/1.4 var(--schrift); color: var(--text-leise); }
.termine-filter a { color: var(--akzent-text); }
.vorgang-vertrag-aktiv, .vorgang-vertrag-pdf { margin: 0; font: 400 12.5px/1.4 var(--schrift); color: var(--text-leise); overflow-wrap: anywhere; }
.vorgang-vertrag-aktiv .vertrag-link { color: var(--text-leise); }
.vorgang-vertrag-pdf-name { color: var(--text-leise); }
.ablage-datei-vertrag-offen { color: var(--text-leise); font-size: 13px; }
.vertrag-erfassen-im-vorgang { margin: 14px 0 26px; }

.vertrag-ki { margin-top: 12px; }
.vertrag-ki .vorbelegung-feld { display: none; }
.vertrag-ki .vertrag-ki-lage { margin: 0 0 6px; }