/* Kommentare beim Ausrollen entfernt (deploy/css_kommentare_entfernen.py, 2026-10-07). Die Fassung MIT Kommentaren steht im Repo unter web/statisch/neu.css - dort wird geaendert, nicht hier auf dem Server. */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('schriften/inter-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
    U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
    U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('schriften/inter-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191,
    U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

body.neu {
  --n-tinte:        #1e283d;
  --n-leise:        #5f6676;
  --n-linie:        #e1e3e8;
  --n-linie-fein:   #ebecef;
  --n-flaeche:      #f1f2f6;
  --n-abzeichen:    #e8e9eb;
  --n-feld:         #f9fafb;
  --n-leiste:       #fbfbfc;
  --n-grund:        #f2f4f7;
  --n-blau:         #1e93d6;
  --n-blau-voll:    #147cbd;
  --n-blau-voll-tief: #0f6dab;
  --n-blau-tief:    #0b6fa8;
  --n-blau-hell:    #7fc4ec;
  --n-blau-flaeche: #eaf4fc;
  --n-blau-linie:   #cfe5f6;
  
  --n-blau-verlauf: linear-gradient(150deg, rgb(140 205 242) 0%, rgb(48 160 222) 45%, rgb(14 116 176) 100%);
  --n-gut:          #098b5e;
  --n-gut-flaeche:  #d7fce3;
  --n-gut-text:     #177637;
  --n-schlecht:     #dd1b3f;
  --n-schlecht-flaeche: #ffe0e2;
  --n-gelb-flaeche: #fff6d9;
  --n-gelb-linie:   #f3dfa2;
  --n-gelb-text:    #7a4510;

  --n-rund:         16px;
  --n-rund-klein:   12px;
  --n-rund-knopf:   10px;

  --n-kopf-hoehe:   64px;

  --text:        var(--n-tinte);
  --text-leise:  var(--n-leise);
  --linie:       var(--n-linie);
  --linie-fein:  var(--n-linie-fein);
  --grund:       var(--n-flaeche);
  --karte:       #ffffff;
  --akzent:      var(--n-blau-flaeche);
  --akzent-text: var(--n-blau-tief);
  --tinte:       var(--n-blau-flaeche);
  --tag:         var(--n-blau-flaeche);
  --verlauf:       var(--n-blau-voll);
  --knopf-verlauf: var(--n-blau-voll);
  --gut:         var(--n-gut);
  --schlecht:    var(--n-schlecht);
  --schatten:    0 0 0 1px var(--n-linie), 0 1px 2px rgb(16 24 40 / .04);

  background: #fff;
  color: var(--n-tinte);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 14px;
  line-height: 1.5;
  padding: 0;
}

.neu .huelle { max-width: none; margin: 0; gap: 0; min-height: 100vh; }

.neu .leiste {
  position: sticky; top: 0; z-index: 21; align-self: flex-start;
  height: 100vh; max-height: none;
  padding: 0 12px 12px;
  gap: 2px;
  background: var(--n-leiste);
  border-radius: 0;
  
  box-shadow: inset -1px 0 0 var(--n-linie);
  transition: width var(--dauer-lang) var(--kurve), padding var(--dauer-lang) var(--kurve);
}
.neu .leiste-marke {
  position: sticky; top: 0; z-index: 1;
  display: flex; align-items: center; gap: 10px;
  flex: none; height: var(--n-kopf-hoehe);
  margin: 0 -12px 10px; padding: 0 12px 0 20px;
  background: #fff;
  border-bottom: 1px solid var(--n-linie);
  color: var(--n-tinte);
}
.neu .leiste-zeichen {
  flex: 1 1 auto; min-width: 0;
  display: flex; align-items: center; gap: 10px;
  color: inherit; text-decoration: none;
}

.neu .leiste-schalter {
  width: 32px; height: 32px; flex: none;
  display: grid; place-items: center;
  border: 0; border-radius: 8px; padding: 0;
  background: transparent; color: var(--n-leise);
  cursor: pointer;
  transition: background-color var(--dauer) var(--kurve), color var(--dauer) var(--kurve);
}
.neu .leiste-schalter:hover { background: var(--n-flaeche); color: var(--n-tinte); }
.neu .leiste-schalter svg { width: 18px; height: 18px; stroke-width: 1.8; }

.neu .leiste-kachel {
  width: 30px; height: 30px; flex: none;
  display: grid; place-items: center; overflow: hidden;
  border-radius: 8px;
  background: var(--n-blau-verlauf);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .5), inset 0 0 0 1px rgb(255 255 255 / .2);
}
.neu .leiste-kachel img { width: 60%; height: auto; display: block; }
.neu .leiste-wortmarke { font-size: 16.5px; font-weight: 700; letter-spacing: -.025em; }

.neu .leiste .sym {
  min-height: 38px; padding: 8px 10px; gap: 10px;
  border-radius: 8px;
  font-size: 14px; font-weight: 500; letter-spacing: -.005em;
  color: var(--n-tinte);
}
.neu .leiste .sym svg { width: 18px; height: 18px; stroke-width: 1.8; }
.neu .leiste .sym > svg:first-child { color: var(--n-leise); }
.neu .leiste .sym:hover { background: var(--n-flaeche); }
.neu .leiste .sym:hover > svg:first-child { color: var(--n-blau); }
.neu .leiste .sym.aktiv {
  background: var(--n-blau-voll); color: #fff;
  font-weight: 600; box-shadow: none;
}
.neu .leiste .sym.aktiv > svg:first-child { color: #fff; }
.neu .leiste summary.sym.zweig-aktiv { font-weight: 650; }
.neu .leiste summary.sym.zweig-aktiv > svg:first-child { color: var(--n-blau); }
.neu .leiste .pfeil { width: 14px; height: 14px; color: var(--n-leise); }

.neu .leiste .unter { gap: 1px; padding: 2px 0 8px; }
.neu .leiste .unter .sym {
  min-height: 34px; padding: 7px 10px 7px 38px;
  font-size: 13.5px; font-weight: 500;
  color: var(--n-leise);
}
.neu .leiste .unter .sym:hover { color: var(--n-tinte); }

.neu .leiste .unter .sym.aktiv { background: var(--n-blau-voll); color: #fff; font-weight: 600; }
.neu .leiste .unter .sym.zweig-aktiv { color: var(--n-tinte); font-weight: 600; }
.neu .leiste .unter .sym.entwurf { padding: 6px 10px 6px 50px; font-size: 13px; }
.neu .leiste .unter .sym.entwurf .klein { font-size: 11.5px; color: var(--n-leise); }
.neu .leiste .unter .sym.entwurf.aktiv .klein { color: #fff; opacity: .75; }
.neu .leiste .sym .punkt { top: 7px; left: 22px; border-color: var(--n-leiste); }

.neu .leiste .fuss { border-top-color: var(--n-linie); }
.neu .leiste .konto {
  height: 46px; padding: 0 8px; gap: 10px;
  border-radius: 10px;
  font-size: 13.5px; font-weight: 600;
}
.neu .leiste .konto-bild {
  width: 32px; height: 32px;
  background: var(--n-blau-verlauf); box-shadow: none;
  font-size: 11.5px;
}
.neu .leiste a.konto:hover { background: var(--n-flaeche); }
.neu .leiste a.konto:hover .konto-bild { box-shadow: none; }
.neu .leiste a.konto.aktiv .konto-bild {
  box-shadow: 0 0 0 2px var(--n-leiste), 0 0 0 4px var(--n-blau);
}

.neu.leiste-zu .leiste { width: 68px; overflow: visible; }
.neu.leiste-zu .leiste-marke { justify-content: center; padding: 0; }
.neu.leiste-zu .leiste-zeichen { display: none; }
.neu .leiste-schalter .richtung { transform-box: fill-box; transform-origin: center; }
.neu.leiste-zu .leiste-schalter .richtung { transform: scaleX(-1); }
.neu.leiste-zu .leiste .unter,
.neu.leiste-zu .leiste .pfeil { display: none; }
.neu.leiste-zu .leiste .sym,
.neu.leiste-zu .leiste .konto { position: relative; justify-content: center; padding: 0; gap: 0; }
.neu.leiste-zu .leiste .sym .wort,
.neu.leiste-zu .leiste .konto .wort {
  display: none;
  position: absolute; left: calc(100% + 12px); top: 50%; transform: translateY(-50%);
  z-index: 40; padding: 6px 10px; border-radius: 8px;
  background: #fff; color: var(--n-tinte);
  box-shadow: 0 0 0 1px var(--n-linie), 0 6px 16px rgb(16 24 40 / .10);
  font-size: 13px; font-weight: 500; white-space: nowrap; pointer-events: none;
}
.neu.leiste-zu .leiste .sym:hover .wort,
.neu.leiste-zu .leiste .sym:focus-visible .wort,
.neu.leiste-zu .leiste .konto:hover .wort,
.neu.leiste-zu .leiste .konto:focus-visible .wort { display: block; }
.neu.leiste-zu .leiste .sym .punkt { left: auto; right: 9px; }

.neu .inhalt { padding: 0 32px 32px; }

.neu .kopf {
  position: sticky; top: 0; z-index: 20;
  height: var(--n-kopf-hoehe);
  margin: 0 -32px 28px; padding: 0 32px;
  gap: 12px;
  background: rgb(255 255 255 / .9);
  -webkit-backdrop-filter: saturate(1.4) blur(12px);
  backdrop-filter: saturate(1.4) blur(12px);
  border-bottom: 1px solid var(--n-linie);
}

.neu .kopf > .marke { display: none; }
.neu .gruss {
  flex: 1 1 auto; min-width: 0;
  display: flex; align-items: center; gap: 12px;
}
.neu .gruss h1 {
  flex: none;
  font-size: 15.5px; font-weight: 650; letter-spacing: -.015em;
  white-space: nowrap;
}
.neu .gruss p {
  margin: 0; min-width: 0;
  font-size: 13px; color: var(--n-leise);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.neu .kopf-fakten { display: flex; align-items: center; gap: 6px; }
.neu .kopf-fakten span {
  display: inline-flex; align-items: center; gap: 6px;
  height: 26px; padding: 0 10px;
  border-radius: 999px; background: var(--n-flaeche);
  font-size: 12.5px; font-weight: 500; color: var(--n-leise);
  white-space: nowrap;
}
.neu .kopf-fakten span:first-child::before {
  content: ''; width: 6px; height: 6px; border-radius: 50%;
  background: var(--n-blau);
}

.neu .kopf-rechts { gap: 8px; }
.neu .rundknopf,
.neu .rundknopf.rundknopf-as {
  width: 36px; height: 36px;
  background: var(--n-flaeche); box-shadow: none;
  color: var(--n-tinte);
  transition: background-color var(--dauer) var(--kurve);
}
.neu .rundknopf:hover,
.neu .rundknopf.rundknopf-as:hover { background: var(--n-abzeichen); box-shadow: none; color: var(--n-tinte); }
.neu .rundknopf svg { width: 17px; height: 17px; }
.neu .rundknopf .punkt { top: 7px; right: 8px; border-color: var(--n-flaeche); }

.neu .seitenfuss {
  margin: 40px 0 0; padding-top: 16px;
  border-top-color: var(--n-linie);
  font-size: 12.5px; color: var(--n-leise);
}
.neu .seitenfuss a:hover { color: var(--n-tinte); }

.neu .hilfe-knopf {
  width: 48px; height: 48px;
  background: var(--n-blau-voll);
  box-shadow: 0 8px 24px rgb(20 124 189 / .28);
  transition: background-color var(--dauer) var(--kurve);
}
.neu .hilfe-knopf:hover { background: var(--n-blau-voll-tief); box-shadow: 0 10px 28px rgb(20 124 189 / .34); }
.neu .hilfe-knopf svg { width: 21px; height: 21px; }

.neu .meldung {
  padding: 12px 16px; border-radius: var(--n-rund-klein);
  font-size: 13px; margin-bottom: 16px;
}
.neu .meldung.warn {
  background: var(--n-gelb-flaeche); color: var(--n-gelb-text);
  box-shadow: inset 0 0 0 1px var(--n-gelb-linie);
}
.neu .meldung.rueckblick {
  border-left: 0;
  box-shadow: inset 3px 0 0 #c9930f, inset 0 0 0 1px var(--n-gelb-linie);
}

.ks-abschnitt { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.ks-abschnitt-kopf {
  display: flex; align-items: center; flex-wrap: wrap;
  gap: 10px 16px; min-height: 34px;
}
.ks-etikett {
  flex: 1 1 160px;
  display: flex; align-items: center; gap: 16px;
  margin: 0;
  font-size: 11.5px; font-weight: 700; line-height: 1;
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--n-tinte);
}
.ks-etikett::after { content: ''; flex: 1; height: 1px; background: var(--n-linie); }

.ks-buehne {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-areas:
    "karte   karte   rechts"
    "verlauf verlauf rechts"
    "versand wirkung rechts";
  grid-template-rows: auto auto 1fr;
  align-items: start;
  gap: 24px;
}
.ks-bereich-karte { grid-area: karte; }
.ks-bereich-verlauf { grid-area: verlauf; }
.ks-bereich-versand { grid-area: versand; margin-top: 4px; }
.ks-bereich-wirkung { grid-area: wirkung; margin-top: 4px; }
.ks-bereich-interessenten { grid-area: interessenten; }
.ks-bereich-reichweite { grid-area: reichweite; }
.ks-bereich-eigentuemer { grid-area: eigentuemer; }
.ks-rechts-spalte { grid-area: rechts; display: flex; flex-direction: column; gap: 28px; min-width: 0; }

:where(.ks-abschnitt) > .ks-karte { display: flex; flex-direction: column; }

.ks-karte {
  min-width: 0;
  padding: 20px 22px;
  background: #fff;
  border: 1px solid var(--n-linie);
  border-radius: var(--n-rund);
}

.ks-karte-kopf { display: flex; align-items: center; gap: 8px 10px; }
.ks-karte-kopf h3 {
  flex: 0 1 auto; margin: 0; min-width: 0;
  font-size: 14.5px; font-weight: 600; letter-spacing: -.01em; line-height: 1.35;
}
.ks-karte-kopf > .ks-pille,
.ks-karte-kopf > .ks-knopf-umriss { flex: none; }
.ks-karte-sym { width: 18px; height: 18px; flex: none; color: var(--n-blau); stroke-width: 1.8; }

.ks-karte-kopf .ks-rechts { margin-left: auto; }
.ks-karte-unter { margin: 0; font-size: 13px; color: var(--n-leise); }

.ks-klein-etikett {
  margin: 0;
  font-size: 11.5px; font-weight: 600; line-height: 1.35;
  letter-spacing: .06em; text-transform: uppercase;
  color: var(--n-leise);
}

.ks-gross {
  margin: 10px 0 2px;
  font-size: 32px; font-weight: 700; line-height: 1.1; letter-spacing: -.03em;
  font-variant-numeric: tabular-nums;
}

.ks-meta {
  margin: 16px 0 0; padding-top: 12px;
  border-top: 1px solid var(--n-linie-fein);
  font-size: 12.5px; color: var(--n-leise);
}
.ks-meta b { font-weight: 700; color: var(--n-tinte); }

.ks-pille {
  display: inline-flex; align-items: center; gap: 5px;
  height: 24px; padding: 0 10px;
  border-radius: 999px;
  background: var(--n-flaeche); color: var(--n-leise);
  font-size: 12px; font-weight: 600; white-space: nowrap;
  text-decoration: none;
}
.ks-pille.ks-gut { background: var(--n-gut-flaeche); color: var(--n-gut-text); }
.ks-pille.ks-schlecht { background: var(--n-schlecht-flaeche); color: #b3122f; }
.ks-pille.ks-leise { background: var(--n-flaeche); color: var(--n-leise); }
a.ks-pille { transition: filter var(--dauer) var(--kurve); }
a.ks-pille:hover { filter: brightness(.96); }

.ks-abzeichen {
  flex: none;
  display: inline-flex; align-items: center;
  height: 24px; padding: 0 10px;
  border-radius: 999px; background: var(--n-abzeichen);
  font-size: 12px; font-weight: 600; color: var(--n-tinte);
}
.ks-abzeichen.ks-gut { background: var(--n-gut-flaeche); color: var(--n-gut-text); }

.ks-knopf,
.ks-knopf-umriss {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 40px; padding: 0 16px;
  border-radius: var(--n-rund-knopf);
  font: inherit; font-size: 13.5px; font-weight: 600; white-space: nowrap;
  text-decoration: none; cursor: pointer;
  transition: background-color var(--dauer) var(--kurve), border-color var(--dauer) var(--kurve);
}
.ks-knopf { border: 0; background: var(--n-blau-voll); color: #fff; }
.ks-knopf:hover { background: var(--n-blau-voll-tief); }
.ks-knopf svg { width: 16px; height: 16px; flex: none; }
.ks-knopf-umriss { border: 1px solid var(--n-linie); background: #fff; color: var(--n-tinte); }
.ks-knopf-umriss:hover { background: var(--n-feld); border-color: #d3d6dd; }
.ks-knopf.ks-klein,
.ks-knopf-umriss.ks-klein { height: 34px; padding: 0 12px; font-size: 13px; border-radius: 9px; }

.ks-balken {
  height: 8px; border-radius: 999px; overflow: hidden;
  background: var(--n-flaeche);
}
.ks-balken > span {
  display: block; height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--n-blau-tief) 0%, var(--n-blau) 100%);
}
.ks-balken.ks-hell > span { background: var(--n-blau-hell); }
.ks-balken.ks-satt > span { background: var(--n-blau-tief); }
.ks-skala-zeile {
  display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
  margin-top: 14px;
  font-size: 12px; color: var(--n-leise); font-variant-numeric: tabular-nums;
}

.ks-zeitraum { position: relative; }
.ks-zeitraum > summary {
  list-style: none; cursor: pointer;
  display: inline-flex; align-items: center; gap: 8px;
  height: 36px; padding: 0 10px 0 12px;
  border: 1px solid var(--n-linie); border-radius: 999px;
  background: #fff; color: var(--n-tinte);
  font-size: 13px; font-weight: 500; white-space: nowrap;
  transition: background-color var(--dauer) var(--kurve), border-color var(--dauer) var(--kurve);
}
.ks-zeitraum > summary::-webkit-details-marker { display: none; }
.ks-zeitraum > summary:hover { background: var(--n-feld); border-color: #d3d6dd; }
.ks-zeitraum > summary svg { width: 15px; height: 15px; flex: none; color: var(--n-blau); stroke-width: 1.9; }
.ks-zeitraum > summary .ks-zeitraum-pfeil { color: var(--n-leise); transition: transform var(--dauer) var(--kurve); }
.ks-zeitraum[open] .ks-zeitraum-pfeil { transform: rotate(180deg); }

.ks-zeitraum.ks-aktiv > summary {
  border-color: var(--n-blau-linie); background: var(--n-blau-flaeche); color: var(--n-blau-tief);
}
.ks-heute { height: 36px; border-radius: 999px; }

.ks-zeitraum::details-content,
.ks-zeitraum[open]::details-content { block-size: auto; overflow: visible; transition: none; }
.ks-zeitraum[open] > .ks-stichtag {
  
  position: absolute; right: 0; top: calc(100% + 8px); z-index: 30;
  width: max-content;
  display: grid; grid-template-columns: auto auto; align-items: center;
  gap: 10px 12px; padding: 14px;
  background: #fff;
  border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein);
  box-shadow: 0 14px 34px rgb(16 24 40 / .12);
}
.ks-stichtag > :last-child { grid-column: 1 / -1; }
.ks-stichtag label { font-size: 13px; font-weight: 500; color: var(--n-leise); }

.ks-stichtag input[type="date"],
.ks-stichtag .dwahl-knopf {
  height: 34px; padding: 0 11px;
  border: 1px solid var(--n-linie); border-radius: 9px;
  background: var(--n-feld); color: var(--n-tinte);
  font: inherit; font-size: 13px;
}

.ks-stichtag > input[type="date"],
.ks-stichtag .dwahl { width: 168px; }
.ks-stichtag .dwahl-knopf:hover { border-color: #d3d6dd; }
.ks-stichtag .dwahl-sym svg { width: 15px; height: 15px; }

.ks-tipp {
  position: absolute; z-index: 15;
  left: 50%; bottom: calc(100% + 10px);
  transform: translateX(-50%);
  display: none; flex-direction: column; gap: 1px;
  width: max-content; max-width: 250px;
  padding: 9px 12px 10px;
  background: #fff;
  border: 1px solid var(--n-linie); border-radius: 10px;
  box-shadow: 0 12px 28px rgb(16 24 40 / .16);
  font-size: 12px; font-weight: 400; line-height: 1.45; letter-spacing: 0;
  color: var(--n-tinte); text-align: left; white-space: normal;
  pointer-events: none;
}
.ks-tipp-unten { bottom: auto; top: calc(100% + 10px); }
.ks-tipp-links { left: -4px; transform: none; }
.ks-tipp-rechts { left: auto; right: -4px; transform: none; }
:hover > .ks-tipp { display: flex; animation: ks-tipp-ein var(--dauer) var(--kurve); }
@keyframes ks-tipp-ein { from { opacity: 0; } }
.ks-tipp-titel { font-size: 13px; font-weight: 650; }
.ks-tipp-wert { margin-top: 3px; font-size: 14.5px; font-weight: 700; font-variant-numeric: tabular-nums; }
.ks-tipp-leise { color: var(--n-leise); }
.ks-tipp-gut { display: flex; align-items: center; gap: 6px; margin-top: 3px; font-weight: 600; color: var(--n-gut-text); }
.ks-tipp-gut::before { content: ''; width: 7px; height: 7px; flex: none; border-radius: 50%; background: var(--n-gut); }

.ks-legende { display: flex; align-items: center; gap: 14px; font-size: 12px; color: var(--n-leise); }
.ks-legende span { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.ks-legende i { width: 8px; height: 8px; border-radius: 50%; }
.ks-legende .ks-blau { background: var(--n-blau); }
.ks-legende .ks-gruen { background: var(--n-gut); }
.ks-karte-feld {
  position: relative;
  margin-top: 14px;
  aspect-ratio: 1100 / 440;
  border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein);
  background: #eef3f7;
}
.ks-karte-grund {
  position: absolute; inset: 0; width: 100%; height: 100%; display: block;
  border-radius: calc(var(--n-rund-klein) - 1px);
}

.ks-ort {
  --g: calc(var(--d) * var(--massstab, 1));
  position: absolute;
  left: clamp(calc(var(--g) / 2 + 2px), var(--x), calc(100% - var(--g) / 2 - 2px));
  top: clamp(calc(var(--g) / 2 + 2px), var(--y), calc(100% - var(--g) / 2 - 2px));
  width: var(--g); height: var(--g);
  margin: calc(var(--g) / -2) 0 0 calc(var(--g) / -2);
  border-radius: 50%;
}
.ks-ort::before {
  content: ''; position: absolute; inset: 0;
  border-radius: 50%;
  background: rgb(30 147 214 / .5);
  border: 2px solid #fff;
  box-shadow: 0 2px 8px rgb(11 111 168 / .3);
  transition: transform var(--dauer) var(--kurve), background-color var(--dauer) var(--kurve);
}
.ks-ort:hover { z-index: 10; }
.ks-ort:hover::before { transform: scale(1.15); background: rgb(30 147 214 / .85); }

.ks-ort.ks-geklickt::after {
  content: ''; position: absolute; top: -3px; right: -3px;
  width: 11px; height: 11px; border-radius: 50%;
  background: var(--n-gut); border: 2px solid #fff;
}
.ks-karte-chip {
  position: absolute; z-index: 3;
  display: inline-flex; align-items: center;
  height: 26px; padding: 0 10px;
  border-radius: 999px; background: rgb(255 255 255 / .94);
  box-shadow: 0 1px 4px rgb(16 24 40 / .12);
  font-size: 12px; font-weight: 600; color: var(--n-tinte); white-space: nowrap;
}
.ks-karte-chip.ks-oben { top: 12px; left: 12px; }
.ks-karte-chip.ks-unten { right: 12px; bottom: 12px; font-weight: 500; color: var(--n-leise); }
.ks-karte-quelle {
  position: absolute; left: 0; bottom: 0; z-index: 3;
  padding: 2px 8px; border-radius: 0 6px 0 calc(var(--n-rund-klein) - 1px);
  background: rgb(255 255 255 / .8);
  font-size: 10.5px; color: var(--n-leise);
}
.ks-karte-leer {
  display: grid; place-items: center; text-align: center; padding: 24px;
  overflow: hidden;
  background:
    repeating-linear-gradient(0deg, transparent 0 39px, rgb(207 229 246 / .55) 39px 40px),
    repeating-linear-gradient(90deg, transparent 0 39px, rgb(207 229 246 / .55) 39px 40px),
    #f7fbfe;
}
.ks-karte-leer > div { max-width: 360px; padding: 16px 20px; border-radius: var(--n-rund-klein); background: rgb(255 255 255 / .9); }

.ks-saeulen-feld { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; margin-top: 16px; }

.ks-saeulen-y {
  position: relative; height: 150px;
  font-size: 11px; color: var(--n-leise); font-variant-numeric: tabular-nums;
}
.ks-saeulen-y span { position: absolute; right: 0; transform: translateY(50%); line-height: 1; }

.ks-saeulen {
  position: relative;
  display: flex; align-items: flex-end; justify-content: center;
  gap: min(4px, 120px / var(--n, 30));
  height: 150px;
  border-bottom: 1px solid var(--n-linie);
  background:
    linear-gradient(var(--n-linie-fein), var(--n-linie-fein)) 0 0 / 100% 1px no-repeat,
    linear-gradient(var(--n-linie-fein), var(--n-linie-fein)) 0 50% / 100% 1px no-repeat;
}

.ks-tag {
  position: relative;
  flex: 1 1 0; min-width: 0; max-width: 56px; height: 100%;
  display: flex; align-items: flex-end;
}
.ks-saeule {
  width: 100%;
  height: max(var(--h), 3px);
  border-radius: 4px 4px 1px 1px;
  background: #a9d6f3;
  transition: background-color var(--dauer) var(--kurve), opacity var(--dauer) var(--kurve);
}
.ks-saeule.ks-spitze { background: linear-gradient(180deg, var(--n-blau) 0%, var(--n-blau-tief) 100%); }
.ks-saeule.ks-null { height: 3px; background: var(--n-linie); }
.ks-tag:hover > .ks-saeule { background: var(--n-blau); }
.ks-tag:hover > .ks-saeule.ks-null { background: var(--n-leise); }

.ks-saeulen:hover > .ks-tag:not(:hover) > .ks-saeule { opacity: .45; }
.ks-tag > .ks-tipp { bottom: calc(max(var(--h), 3px) + 10px); }
.ks-schnitt {
  position: absolute; left: 0; right: 0; bottom: var(--h);
  border-top: 2px dashed #e08000;
  pointer-events: none;
}
.ks-schnitt-wert {
  position: absolute; left: 0; top: -11px;
  height: 20px; padding: 0 7px; border-radius: 999px;
  display: inline-flex; align-items: center;
  background: #e08000; color: #fff;
  font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap;
  pointer-events: auto; cursor: default;
}
.ks-saeulen-x {
  display: flex; justify-content: space-between;
  margin: 8px 0 0 44px;
  font-size: 11.5px; color: var(--n-leise); font-variant-numeric: tabular-nums;
}

@media (hover: none) {
  .ks-tipp,
  .ks-tipp-unten, .ks-tipp-links, .ks-tipp-rechts,
  .ks-tag > .ks-tipp {
    position: fixed; z-index: 60;
    left: 16px; right: 16px; top: auto; bottom: calc(96px + env(safe-area-inset-bottom));
    transform: none; width: auto; max-width: none;
  }
}

.ks-zahl-kopf { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: 6px 12px; }
.ks-zahl-kopf > .ks-klein-etikett { white-space: nowrap; }
.ks-zahl-sym {
  width: 30px; height: 30px; flex: none;
  display: grid; place-items: center;
  border-radius: 8px; background: var(--n-blau-flaeche); color: var(--n-blau);
}
.ks-zahl-sym svg { width: 16px; height: 16px; stroke-width: 1.9; }
.ks-zahl-kopf + .ks-gross { margin-top: 8px; }
.ks-gross + .ks-felder { margin-top: 16px; }
.ks-karte-unter b { font-weight: 700; color: var(--n-tinte); }

.ks-felder { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ks-feld { min-width: 0; padding: 12px 14px; border-radius: var(--n-rund-klein); background: var(--n-flaeche); }
.ks-feld-name { font-size: 12.5px; color: var(--n-leise); }
.ks-feld-zeile { display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 6px; margin-top: 2px; }
.ks-feld-wert {
  font-size: 18px; font-weight: 650; letter-spacing: -.015em;
  font-variant-numeric: tabular-nums;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.ks-trend { font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ks-trend.ks-gut { color: var(--n-gut); }
.ks-trend.ks-schlecht { color: var(--n-schlecht); }

.ks-limit-kopf { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.ks-limit-kopf h3 { margin: 0; font-size: 14px; font-weight: 600; }
.ks-limit-wert { font-size: 14px; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ks-limit-text { margin: 12px 0 0; font-size: 12px; line-height: 1.55; color: var(--n-leise); }
.ks-limit-text a { color: var(--n-blau-tief); font-weight: 600; white-space: nowrap; }
.ks-limit.ks-eng .ks-balken > span { background: var(--n-schlecht); }
.ks-limit.ks-eng .ks-limit-wert { color: var(--n-schlecht); }

.ks-live {
  width: 22px; height: 22px; flex: none; border-radius: 50%;
  background: radial-gradient(circle, var(--n-blau) 0 4px, var(--n-blau-flaeche) 5px);
}

.ks-anrufe {
  display: flex; align-items: center; gap: 10px;
  margin-top: 14px; padding: 10px 12px;
  border: 1px solid var(--n-blau-linie); border-radius: var(--n-rund-klein);
  background: var(--n-blau-flaeche);
  color: inherit; text-decoration: none;
  transition: background-color var(--dauer) var(--kurve), border-color var(--dauer) var(--kurve);
}
.ks-anrufe:hover { background: #dcedfa; border-color: var(--n-blau-hell); }
.ks-anrufe-pfeil {
  width: 16px; height: 16px; flex: none;
  color: var(--n-blau); stroke-width: 2.2;
  transition: transform var(--dauer) var(--kurve);
}
.ks-anrufe:hover .ks-anrufe-pfeil { transform: translateX(2px); }
.ks-anrufe-sym {
  width: 30px; height: 30px; flex: none;
  display: grid; place-items: center;
  border-radius: 8px; background: #fff; color: var(--n-blau);
}
.ks-anrufe-sym svg { width: 16px; height: 16px; stroke-width: 1.9; }
.ks-anrufe-wert {
  font-size: 22px; font-weight: 700; line-height: 1; letter-spacing: -.02em;
  color: var(--n-blau-tief); font-variant-numeric: tabular-nums;
}
.ks-anrufe-name { flex: 1 1 auto; font-size: 13px; font-weight: 600; color: var(--n-blau-tief); white-space: nowrap; }
.ks-anrufe-kurve { flex: none; }
.ks-anrufe-kurve path { fill: none; stroke: var(--n-blau); stroke-width: 2; stroke-linecap: round; }

.ks-zeilen { list-style: none; margin: 4px 0 0; padding: 0; }
.ks-zeile {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 0;
  border-top: 1px solid var(--n-linie-fein);
  color: inherit; text-decoration: none;
}
.ks-zeile:first-child { border-top: 0; }
.ks-zeile:last-child { padding-bottom: 0; }
.ks-kuerzel {
  width: 38px; height: 38px; flex: none;
  display: grid; place-items: center;
  border-radius: 11px; background: var(--n-blau-flaeche);
  font-size: 12.5px; font-weight: 700; color: var(--n-blau-tief);
}

.ks-kuerzel.ks-ton-0 { background: #e3f1fb; color: #0b6fa8; }
.ks-kuerzel.ks-ton-1 { background: #e3f6ee; color: #0d7a51; }
.ks-kuerzel.ks-ton-2 { background: #fdf0dc; color: #9a5a00; }
.ks-kuerzel.ks-ton-3 { background: #efeafd; color: #5b3fc4; }
.ks-kuerzel.ks-ton-4 { background: #fde9ee; color: #b4234a; }
.ks-kuerzel.ks-rang { width: 32px; height: 32px; border-radius: 9px; font-size: 13px; }
.ks-zeile-text { flex: 1; min-width: 0; }
.ks-zeile-titel {
  display: block;
  font-size: 14px; font-weight: 600; line-height: 1.35;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  transition: color var(--dauer) var(--kurve);
}
.ks-zeile-unter {
  display: block;
  font-size: 12.5px; color: var(--n-leise);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ks-zeile-unter b { font-weight: 700; color: var(--n-tinte); }
.ks-zeile-unter .ks-gut { font-weight: 600; color: var(--n-gut-text); }
.ks-zeile-pfeil { width: 16px; height: 16px; flex: none; color: var(--n-leise); stroke-width: 2; }
a.ks-zeile:hover .ks-zeile-titel { color: var(--n-blau-tief); }
a.ks-zeile:hover .ks-zeile-pfeil { color: var(--n-blau); }

.ks-leer { padding: 26px 8px 10px; text-align: center; }
.ks-leer-satz { font-size: 14px; font-weight: 600; }
.ks-leer-dazu { margin-top: 4px; font-size: 12.5px; line-height: 1.5; color: var(--n-leise); }

.ks-zuwachs { flex: none; }
.ks-zuwachs rect.ks-tief { fill: #d6ecfb; }
.ks-zuwachs rect.ks-mittel { fill: var(--n-blau-hell); }
.ks-zuwachs rect.ks-hoch { fill: var(--n-blau); }
.ks-posten { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.ks-posten li { display: flex; align-items: center; gap: 12px; font-size: 13.5px; color: var(--n-leise); }
.ks-posten li > span:nth-child(2) { flex: 1; min-width: 0; }
.ks-posten b { margin-left: auto; font-weight: 600; color: var(--n-tinte); font-variant-numeric: tabular-nums; }
.ks-posten b.ks-rot { color: var(--n-schlecht); }
.ks-zeichen {
  width: 22px; height: 22px; flex: none;
  display: grid; place-items: center;
  border-radius: 5px; font-size: 14px; font-weight: 600; line-height: 1;
}
.ks-zeichen.ks-gleich { background: #fef1c0; color: #ab490d; }
.ks-zeichen.ks-plus { background: #cbf9e1; color: #399072; }
.ks-zeichen.ks-minus { background: #ffe0e2; color: #da1b3f; }
.ks-posten li.ks-summe {
  margin-top: 2px; padding-top: 12px;
  border-top: 1px solid var(--n-linie);
  font-weight: 600; color: var(--n-tinte);
}
.ks-posten li.ks-summe b { font-weight: 700; }

.ks-quoten { display: flex; flex-direction: column; gap: 16px; margin-top: 16px; }
.ks-quote-kopf {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  margin-bottom: 7px;
  font-size: 13px; color: var(--n-leise);
}
.ks-quote-kopf > span { display: inline-flex; align-items: center; gap: 8px; }
.ks-quote-kopf b { font-weight: 700; color: var(--n-tinte); font-variant-numeric: tabular-nums; }
.ks-quote-kurve path { fill: none; stroke: var(--n-blau-hell); stroke-width: 2; stroke-linecap: round; }
.ks-quote-dazu { font-size: 12px; font-weight: 500; color: var(--n-blau-tief); }

.ks-pillen { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.ks-berichte .ks-pillen + .ks-karte-unter { margin-top: 12px; font-size: 12.5px; }
.ks-berichte .ks-zeilen { margin: 6px 0 18px; }
.ks-berichte .ks-zeile-titel { font-size: 13.5px; }
.ks-berichte .ks-leer { margin-bottom: 14px; }
.ks-berichte-alle { align-self: stretch; }

.ks-startseite {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-areas:
    "hallo   hallo   rechts"
    "heute   heute   rechts"
    "kacheln kacheln rechts"
    "laeuft  laeuft  rechts";
  grid-template-rows: auto auto auto 1fr;
  align-items: start;
  gap: 24px;
}
.ks-bereich-hallo { grid-area: hallo; }
.ks-bereich-heute { grid-area: heute; }
.ks-bereich-kacheln { grid-area: kacheln; }
.ks-bereich-laeuft { grid-area: laeuft; }
.ks-bereich-zeit { grid-area: zeit; }
.ks-bereich-plan { grid-area: plan; }
.ks-bereich-signale { grid-area: signale; }

.ks-etikett small {
  font-size: 12.5px; font-weight: 500; letter-spacing: 0; text-transform: none;
  color: var(--n-leise);
}

.ks-hallo {
  position: relative; overflow: hidden;
  padding: 26px 28px 24px;
  background:
    radial-gradient(60% 120% at 100% 0%, rgb(127 196 236 / .28), transparent 70%),
    radial-gradient(40% 90% at 70% 0%, rgb(30 147 214 / .08), transparent 70%),
    #fff;
}
.ks-hallo-marke {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 11.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--n-blau-tief);
}
.ks-hallo-marke svg { width: 15px; height: 15px; color: var(--n-blau); }
.ks-hallo-satz {
  margin: 10px 0 20px;
  font-size: 30px; font-weight: 400; line-height: 1.2; letter-spacing: -.025em;
  color: var(--n-tinte);
}
.ks-hallo-satz b { font-weight: 700; }
.ks-hallo-satz span { display: block; color: var(--n-leise); }

.ks-hallo .as-start { margin-top: 0; }
.ks-hallo .as-balken { padding: 8px 10px 8px 10px; }
.ks-hallo .as-eingabe { font-size: 16px; padding: 12px 0; }

.ks-headline {
  margin: 0;
  font-size: 24px; font-weight: 700; line-height: 1.25; letter-spacing: -.025em;
  text-wrap: balance;
}
.ks-knoepfe { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }

.ks-tageszahlen {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px;
  margin-top: 20px; padding-top: 20px;
  border-top: 1px solid var(--n-linie-fein);
}
.ks-tageszahl {
  display: flex; flex-direction: column; gap: 3px; min-width: 0;
  padding: 13px 15px;
  border: 1px solid transparent; border-radius: var(--n-rund-klein);
  background: var(--n-flaeche);
  color: inherit; text-decoration: none;
  transition: background-color var(--dauer) var(--kurve), border-color var(--dauer) var(--kurve);
}
.ks-tageszahl:hover { background: var(--n-blau-flaeche); border-color: var(--n-blau-linie); }
.ks-tageszahl .ks-klein-etikett { color: var(--n-blau-tief); }
.ks-tageszahl-wert {
  font-size: 18px; font-weight: 700; letter-spacing: -.015em;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ks-tageszahl-unter {
  font-size: 12.5px; line-height: 1.4; color: var(--n-leise);
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
}

.ks-aufgaben { padding: 6px 22px; }
.ks-aufgabe { padding: 14px 0; }
.ks-aufgabe:last-child { padding-bottom: 14px; }
.ks-aufgabe-sym {
  width: 40px; height: 40px; flex: none;
  display: grid; place-items: center;
  border-radius: 11px;
  background: var(--n-blau-flaeche); color: var(--n-blau-tief);
}
.ks-aufgabe-sym svg { width: 19px; height: 19px; stroke-width: 1.8; }
.ks-aufgabe-titel {
  display: block;
  font-size: 14.5px; font-weight: 600; line-height: 1.35;
  transition: color var(--dauer) var(--kurve);
}
.ks-aufgabe-unter { display: block; margin-top: 2px; font-size: 12.5px; line-height: 1.45; color: var(--n-leise); }
.ks-aufgabe-unter b { font-weight: 600; color: var(--n-blau-tief); }
a.ks-aufgabe:hover .ks-aufgabe-titel { color: var(--n-blau-tief); }
a.ks-aufgabe:hover .ks-zeile-pfeil { color: var(--n-blau); }

.ks-b-thema .ks-aufgabe-sym { background: #f1ecfd; color: #5334bd; }
.ks-b-thema .ks-aufgabe-unter b { color: #5334bd; }
.ks-b-impuls .ks-aufgabe-sym { background: #fff4e6; color: #a95f00; }
.ks-b-impuls .ks-aufgabe-unter b { color: #a95f00; }
.ks-b-social .ks-aufgabe-sym { background: #fbeef8; color: #9c3587; }
.ks-b-social .ks-aufgabe-unter b { color: #9c3587; }
.ks-b-plan .ks-aufgabe-sym { background: var(--n-flaeche); color: var(--n-tinte); }
.ks-b-plan .ks-aufgabe-unter b { color: var(--n-tinte); }

.ks-laeuft-titel { margin-left: 6px; font-weight: 400; color: var(--n-leise); }
.ks-laeuft-zahl { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; margin-top: 12px; }
.ks-laeuft-zahl .ks-gross { margin: 0; }
.ks-laeuft .ks-meta { margin-top: 10px; }

.ks-stationen {
  list-style: none; margin: 16px 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(92px, 1fr)); gap: 8px;
}
.ks-station {
  display: flex; flex-direction: column; gap: 2px;
  padding: 10px 12px;
  border: 1px solid transparent; border-radius: var(--n-rund-klein);
  background: var(--n-flaeche);
}
.ks-station time { font-size: 11.5px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--n-leise); }
.ks-station b { font-size: 17px; font-weight: 700; font-variant-numeric: tabular-nums; }
.ks-station em { font-size: 12px; font-style: normal; color: var(--n-leise); }
.ks-station .ks-balken { height: 5px; margin: 4px 0 2px; background: #fff; }
.ks-station.ks-stand-fertig em { font-weight: 600; color: var(--n-gut-text); }
.ks-station.ks-stand-laeuft { background: var(--n-blau-flaeche); border-color: var(--n-blau-linie); }
.ks-station.ks-stand-laeuft em { font-weight: 600; color: var(--n-blau-tief); }
.ks-station.ks-stand-geplant b { color: var(--n-leise); }
.ks-laeuft-hinweis { margin-top: 14px; font-size: 12.5px; line-height: 1.5; }
.ks-laeuft-hinweis a { font-weight: 600; color: var(--n-blau-tief); white-space: nowrap; text-decoration: none; }
.ks-laeuft-hinweis a:hover { text-decoration: underline; }
.ks-laeuft-hinweis a::after { content: " →"; }

.ks-gross small { font-size: 15px; font-weight: 500; letter-spacing: 0; color: var(--n-leise); }
.ks-zeit .ks-karte-unter { margin-top: 2px; }
.ks-zeit .ks-felder { margin-top: 16px; }
.ks-zeit-wie { margin-top: 14px; }
.ks-zeit-wie > summary {
  list-style: none; cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: 600; color: var(--n-blau-tief);
}
.ks-zeit-wie > summary::-webkit-details-marker { display: none; }
.ks-zeit-wie > summary svg { width: 15px; height: 15px; stroke-width: 2; transition: transform var(--dauer) var(--kurve); }
.ks-zeit-wie[open] > summary svg { transform: rotate(180deg); }

.ks-zeit-posten { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.ks-zeit-posten li { display: flex; align-items: flex-start; gap: 12px; }
.ks-zeit-sym {
  width: 28px; height: 28px; flex: none;
  display: grid; place-items: center;
  border-radius: 7px; background: var(--n-blau-flaeche); color: var(--n-blau);
}
.ks-zeit-sym svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.ks-zeit-text { flex: 1; min-width: 0; }
.ks-zeit-name { display: block; font-size: 13.5px; font-weight: 600; }
.ks-zeit-satz { display: block; font-size: 12px; line-height: 1.45; color: var(--n-leise); }
.ks-zeit-anzahl { flex: none; display: flex; flex-direction: column; align-items: flex-end; font-size: 12px; color: var(--n-leise); font-variant-numeric: tabular-nums; }
.ks-zeit-anzahl b { font-size: 14px; font-weight: 700; color: var(--n-tinte); }
.ks-zeit-posten li.ks-leise .ks-zeit-sym { background: var(--n-flaeche); color: var(--n-leise); }
.ks-zeit-posten li.ks-leise .ks-zeit-name { color: var(--n-leise); }
.ks-zeit-kommt {
  display: flex; flex-direction: column; gap: 6px;
  margin-top: 16px; padding-top: 14px;
  border-top: 1px solid var(--n-linie-fein);
}
.ks-zeit-zeile { display: flex; align-items: baseline; gap: 10px; font-size: 13px; }
.ks-zeit-zeile b { flex: none; font-weight: 600; }
.ks-zeit-zeile span { flex: 1; min-width: 0; color: var(--n-leise); }
.ks-zeit-zeile em { flex: none; font-style: normal; font-weight: 700; color: var(--n-gut-text); }
.ks-zeit-erklaerung { margin: 14px 0 0; font-size: 12px; line-height: 1.55; color: var(--n-leise); }

.ks-weg-karte {
  display: flex; flex-direction: column;
  color: inherit; text-decoration: none;
  transition: border-color var(--dauer) var(--kurve), box-shadow var(--dauer) var(--kurve);
}
.ks-weg-karte:hover { border-color: var(--n-blau-linie); box-shadow: 0 8px 22px rgb(16 24 40 / .06); }
.ks-weg {
  margin-top: 16px; padding-top: 12px;
  border-top: 1px solid var(--n-linie-fein);
  font-size: 13px; font-weight: 600; color: var(--n-blau-tief);
}
.ks-weg::after { content: " →"; }
.ks-zeile-bild { width: 44px; height: 44px; flex: none; border-radius: 11px; object-fit: cover; background: var(--n-flaeche); }
.ks-signal-leer { margin-top: 12px; }
.ks-plan-termine { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.ks-plan-termine li { display: flex; align-items: baseline; gap: 12px; font-size: 13.5px; }
.ks-plan-termine b {
  flex: none; min-width: 64px;
  font-size: 12px; font-weight: 700; letter-spacing: .02em; color: var(--n-blau-tief);
}
.ks-plan-termine span { min-width: 0; color: var(--n-tinte); }

.neu .wegweiser-jetzt {
  background: var(--n-blau-flaeche); color: var(--n-tinte);
  border: 1px solid var(--n-blau-linie); box-shadow: none;
}
.neu .wegweiser-jetzt::after { content: none; }
.neu .wegweiser-jetzt .stufe {
  font-size: 11.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--n-blau-tief);
}
.neu .wegweiser-jetzt h2 { font-size: 24px; font-weight: 700; letter-spacing: -.025em; color: var(--n-tinte); }
.neu .wegweiser-jetzt p { color: var(--n-leise); }
.neu .wegweiser-jetzt .knopf { background: var(--n-blau-voll); color: #fff; box-shadow: none; }
.neu .wegweiser-jetzt .knopf:hover { background: var(--n-blau-voll-tief); }
.neu .wegweiser-jetzt .knopf.leise { background: #fff; color: var(--n-blau-tief); }
.neu .wegweiser-jetzt .klein { color: var(--n-leise); }
.neu .wegliste li.dran .marke { background: var(--n-blau-voll); }
.neu .wegliste li.dran .titel { color: var(--n-blau-tief); }

@media (max-width: 1199px) {
  .ks-startseite {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
    grid-template-areas:
      "hallo   hallo"
      "heute   heute"
      "kacheln kacheln"
      "laeuft  laeuft"
      "zeit    signale"
      "plan    signale";
  }
}
@media (max-width: 900px) {
  .ks-startseite {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "hallo" "heute" "kacheln" "laeuft" "zeit" "plan" "signale";
  }
  .ks-hallo { padding: 20px 18px; }
  .ks-hallo-satz { font-size: 25px; }
  .ks-headline { font-size: 21px; }
}
@media (max-width: 560px) {
  .ks-tageszahlen { grid-template-columns: minmax(0, 1fr); }
  .ks-aufgaben { padding: 4px 16px; }
}

.ks-mailbrett {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-areas:
    "buehne  buehne  auto"
    "katalog katalog katalog"
    "wunsch  wunsch  wunsch";
  gap: 24px;
}
.ks-bereich-buehne { grid-area: buehne; }
.ks-bereich-auto { grid-area: auto; }
.ks-bereich-katalog { grid-area: katalog; }
.ks-bereich-wunsch { grid-area: wunsch; }

.ks-mailchip {
  width: 36px; height: 36px; flex: none;
  display: grid; place-items: center;
  border-radius: 10px; background: var(--n-blau-verlauf);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .3);
}
.ks-mailchip img { width: 20px; height: 20px; display: block; }
.ks-mailchip-gross { width: 48px; height: 48px; border-radius: 13px; }
.ks-mailchip-gross img { width: 28px; height: 28px; }
.ks-mailpille {
  display: inline-flex; align-items: center; flex: none; vertical-align: 2px;
  height: 22px; padding: 0 9px; border-radius: 999px;
  background: var(--n-blau-flaeche); color: var(--n-blau-tief);
  font-size: 11.5px; font-weight: 600; letter-spacing: 0; white-space: nowrap;
}
.ks-mailpille.ks-an { background: var(--n-blau-voll); color: #fff; }

.ks-laeuft-streifen { display: flex; flex-direction: column; gap: 8px; margin-bottom: 24px; }
.ks-laeuft-zeile {
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px 14px;
  padding: 12px 18px;
  border: 1px solid var(--n-linie); border-radius: var(--n-rund);
  background: #fff; color: var(--n-tinte); text-decoration: none;
  font-size: 13px;
  transition: border-color var(--dauer) var(--kurve);
}
.ks-laeuft-zeile:hover { border-color: var(--n-blau-linie); }
.ks-laeuft-zeile-titel { font-weight: 600; }
.ks-laeuft-zeile-stand { color: var(--n-leise); font-variant-numeric: tabular-nums; }
.ks-laeuft-zeile-stand b { color: var(--n-tinte); }
.ks-laeuft-zeile-ende { color: var(--n-leise); }
.ks-laeuft-zeile-weg { margin-left: auto; font-weight: 600; color: var(--n-blau-tief); }

.ks-schrittfolge { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; }
.ks-schrittfolge li {
  position: relative; display: flex; align-items: center; gap: 10px;
  min-height: 30px; font-size: 13px; font-weight: 500;
}
.ks-schrittfolge li + li { margin-top: 6px; }
.ks-schrittfolge li + li::before {
  content: ''; position: absolute; left: 11px; bottom: 100%;
  width: 2px; height: 8px; border-radius: 2px; background: var(--n-blau-linie);
}
.ks-schrittfolge span {
  width: 24px; height: 24px; flex: none;
  display: grid; place-items: center;
  border-radius: 50%; background: #fff;
  box-shadow: inset 0 0 0 1.5px var(--n-blau-hell);
  font-size: 11.5px; font-weight: 700; color: var(--n-blau-tief);
  font-variant-numeric: tabular-nums;
}
.ks-schrittfolge.ks-gross li { min-height: 40px; font-size: 14px; }
.ks-schrittfolge.ks-gross li + li { margin-top: 10px; }
.ks-schrittfolge.ks-gross li + li::before { left: 15px; height: 12px; }
.ks-schrittfolge.ks-gross span { width: 32px; height: 32px; font-size: 13px; }
.ks-schrittfolge.ks-gross li:first-child span { background: var(--n-blau-voll); color: #fff; box-shadow: none; }

.ks-mailbuehne {
  display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
  padding: 0; overflow: hidden;
}
.ks-mailbuehne-text { display: flex; flex-direction: column; align-items: flex-start; padding: 26px 28px; }
.ks-mailbuehne .ks-headline { margin-top: 16px; font-size: 26px; }
.ks-mailbuehne-satz { margin: 8px 0 0; max-width: 470px; font-size: 14px; line-height: 1.6; color: var(--n-leise); }
.ks-mailbuehne .ks-pillen { margin-top: 14px; }
.ks-mailbuehne-form { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 18px; margin-top: auto; padding-top: 22px; }
.ks-mailbuehne-weg {
  padding: 26px 26px 26px;
  border-left: 1px solid var(--n-linie);
  background: linear-gradient(180deg, var(--n-blau-flaeche) 0%, #fff 100%);
}
.ks-mailbuehne-weg .ks-klein-etikett { color: var(--n-blau-tief); }

.ks-kippe { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; cursor: pointer; }
.ks-kippe input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ks-kippe-bahn {
  position: relative; width: 36px; height: 20px; flex: none;
  border-radius: 999px; background: var(--n-linie);
  transition: background-color var(--dauer) var(--kurve);
}
.ks-kippe-bahn::after {
  content: ''; position: absolute; top: 2px; left: 2px;
  width: 16px; height: 16px; border-radius: 50%; background: #fff;
  box-shadow: 0 1px 3px rgb(16 24 40 / .25);
  transition: transform var(--dauer) var(--kurve);
}
.ks-kippe input:checked + .ks-kippe-bahn { background: var(--n-blau-voll); }
.ks-kippe input:checked + .ks-kippe-bahn::after { transform: translateX(16px); }
.ks-kippe input:focus-visible + .ks-kippe-bahn { box-shadow: 0 0 0 3px var(--n-blau-linie); }
.ks-kippe-dazu { color: var(--n-leise); }

.ks-bereich-auto { gap: 12px; }
.ks-auto { display: flex; flex-direction: column; padding: 16px 18px; }
.ks-auto-kopf { display: flex; align-items: center; gap: 10px; }
.ks-auto-kopf h3 { flex: 1 1 auto; min-width: 0; margin: 0; font-size: 14.5px; font-weight: 650; }
.ks-auto > p { margin: 10px 0 0; font-size: 12.5px; line-height: 1.55; color: var(--n-leise); }
.ks-auto-zahlen { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.ks-auto-zahlen span {
  display: inline-flex; align-items: baseline; gap: 4px;
  padding: 5px 10px; border-radius: 8px; background: var(--n-flaeche);
  font-size: 12px; color: var(--n-leise);
}
.ks-auto-zahlen b { font-size: 14px; font-weight: 700; color: var(--n-tinte); font-variant-numeric: tabular-nums; }
.ks-auto.ks-aus .ks-mailchip { background: #b5bac4; }
.ks-auto-weg {
  margin-top: 12px; padding-top: 10px;
  border-top: 1px solid var(--n-linie-fein);
  font-size: 13px; font-weight: 600; color: var(--n-blau-tief); text-decoration: none;
}
.ks-auto-weg:hover { text-decoration: underline; }

.ks-katalog {
  
  display: grid; grid-template-columns: minmax(0, 1fr) calc((100% - 48px) / 3);
  column-gap: 0; padding: 0; overflow: hidden;
}
.ks-katalog-liste { padding: 8px 0 10px; }
.ks-katalog-gruppe {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 8px;
  padding: 14px 22px 6px;
  font-size: 12.5px; color: var(--n-leise);
}
.ks-katalog-gruppe b {
  font-size: 11.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--n-tinte);
}
.ks-katalog-gruppe + .ks-katalog-zeile { border-top: 0; }

.ks-katalog-zeile {
  position: relative;
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px;
  margin: 0 10px; padding: 12px 12px;
  border-top: 1px solid var(--n-linie-fein); border-radius: 12px;
  transition: background-color var(--dauer) var(--kurve);
}
.ks-katalog-zeile::before {
  content: ''; position: absolute; left: 0; top: 14px; bottom: 14px;
  width: 3px; border-radius: 3px; background: var(--n-blau);
  opacity: 0; transform: scaleY(.4);
  transition: opacity var(--dauer) var(--kurve), transform var(--dauer) var(--kurve);
}
.ks-katalog-zeile:hover,
.ks-katalog-zeile.ks-gewaehlt { background: var(--n-blau-flaeche); border-top-color: transparent; }
.ks-katalog-zeile:hover + .ks-katalog-zeile,
.ks-katalog-zeile.ks-gewaehlt + .ks-katalog-zeile { border-top-color: transparent; }
.ks-katalog-zeile:hover::before,
.ks-katalog-zeile.ks-gewaehlt::before { opacity: 1; transform: none; }
.ks-katalog-text { min-width: 0; }
.ks-katalog-text h3 { margin: 0; font-size: 14.5px; font-weight: 650; letter-spacing: -.01em; }
.ks-katalog-text p {
  margin: 2px 0 0; font-size: 12.5px; color: var(--n-leise);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ks-mailfuss { display: flex; align-items: center; gap: 12px; }
.ks-stand {
  display: inline-flex; align-items: center;
  height: 24px; padding: 0 9px; border-radius: 999px;
  font-size: 11.5px; font-weight: 600; white-space: nowrap;
}
.ks-stand-gut { background: var(--n-gut-flaeche); color: var(--n-gut-text); }
.ks-stand-aus { background: var(--n-flaeche); color: var(--n-leise); }
.ks-stand-weg { background: var(--n-blau-flaeche); color: var(--n-blau-tief); }
.ks-katalog-zeile:hover .ks-stand-weg,
.ks-katalog-zeile.ks-gewaehlt .ks-stand-weg { background: #fff; }
.ks-mailweg {
  min-width: 128px; padding: 0; border: 0; background: none; text-align: right;
  font: inherit; font-size: 13px; font-weight: 650; white-space: nowrap;
  color: var(--n-blau-tief); text-decoration: none; cursor: pointer;
  transition: transform var(--dauer) var(--kurve);
}
.ks-katalog-zeile:hover .ks-mailweg:not(.ks-mailweg-aus) { transform: translateX(3px); }
.ks-mailweg-aus { color: var(--n-leise); font-weight: 500; cursor: default; }

.ks-ganz::after { content: ''; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }

.ks-katalog-blaetter {
  display: grid;
  padding: 24px 24px 22px;
  border-left: 1px solid var(--n-linie);
  background: linear-gradient(180deg, var(--n-blau-flaeche) 0%, #fff 55%);
}
.ks-katalog-blatt {
  grid-area: 1 / 1; min-width: 0;
  display: flex; flex-direction: column;
  opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: opacity var(--dauer) var(--kurve), transform var(--dauer) var(--kurve),
              visibility 0s var(--dauer);
}
.ks-katalog-blatt[data-an] {
  opacity: 1; visibility: visible; transform: none;
  transition: opacity var(--dauer) var(--kurve), transform var(--dauer) var(--kurve), visibility 0s;
}
.ks-katalog-blatt-kopf { display: flex; align-items: center; gap: 14px; }
.ks-katalog-blatt-kopf h3 { margin: 0; font-size: 18px; font-weight: 700; letter-spacing: -.02em; }
.ks-katalog-ziel { display: block; margin-top: 3px; font-size: 12.5px; font-weight: 600; color: var(--n-blau-tief); }
.ks-katalog-satz { margin: 14px 0 16px; font-size: 13px; line-height: 1.6; color: var(--n-leise); }
.ks-katalog-blatt .ks-klein-etikett { color: var(--n-tinte); }
.ks-katalog-vorschau {
  position: relative; overflow: hidden; pointer-events: none;
  height: 150px; margin-top: 18px;
  border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein);
  background: #fff;
}
.ks-katalog-vorschau iframe {
  position: absolute; left: 50%; top: 0; margin-left: -135px;
  width: 600px; height: 340px; zoom: .45; border: 0; background: #fff;
}
.ks-katalog-blatt-fuss {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px 10px;
  margin-top: auto; padding-top: 18px;
}
.ks-katalog-handlung { font-size: 12px; color: var(--n-leise); }

.ks-wunsch { padding: 0; }
.ks-wunsch > summary {
  list-style: none; cursor: pointer;
  display: flex; align-items: center; gap: 14px;
  padding: 16px 20px;
}
.ks-wunsch > summary::-webkit-details-marker { display: none; }
.ks-wunsch-text { flex: 1 1 auto; min-width: 0; }
.ks-wunsch-titel { display: block; font-size: 14.5px; font-weight: 650; }
.ks-wunsch-unter { display: block; margin-top: 2px; font-size: 12.5px; line-height: 1.45; color: var(--n-leise); }
.ks-wunsch-knopf {
  flex: none; display: inline-flex; align-items: center; gap: 6px;
  height: 36px; padding: 0 14px;
  border: 1px solid var(--n-blau-linie); border-radius: 10px;
  font-size: 13px; font-weight: 600; color: var(--n-blau-tief);
  transition: background-color var(--dauer) var(--kurve);
}
.ks-wunsch-knopf:hover { background: var(--n-blau-flaeche); }
.ks-wunsch-knopf svg { transition: transform var(--dauer) var(--kurve); }
.ks-wunsch[open] .ks-wunsch-knopf svg { transform: rotate(180deg); }
.ks-wunsch > form { padding: 6px 20px 20px; border-top: 1px solid var(--n-linie-fein); }
.ks-wunsch-felder { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; }

@media (max-width: 1199px) {
  .ks-mailbrett {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "buehne" "auto" "katalog" "wunsch";
  }
  .ks-bereich-auto { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ks-bereich-auto > .ks-abschnitt-kopf { grid-column: 1 / -1; }
}

@media (max-width: 1199px), (hover: none) {
  .ks-katalog { grid-template-columns: minmax(0, 1fr); }
  .ks-katalog-blaetter, .ks-nur-maus { display: none; }
}
@media (max-width: 900px) {
  .ks-bereich-auto { grid-template-columns: minmax(0, 1fr); }
  .ks-mailbuehne { grid-template-columns: minmax(0, 1fr); }
  .ks-mailbuehne-text { padding: 22px 20px; }
  .ks-mailbuehne-weg { padding: 20px; border-left: 0; border-top: 1px solid var(--n-linie); }
  .ks-katalog-zeile { grid-template-columns: auto minmax(0, 1fr); margin: 0 6px; }
  .ks-katalog-zeile .ks-mailfuss { grid-column: 2; }
  .ks-katalog-text p { white-space: normal; }
  .ks-mailweg { min-width: 0; margin-left: auto; }
  .ks-mailfuss { width: 100%; }
  .ks-wunsch > summary { flex-wrap: wrap; }
  .ks-wunsch-felder { grid-template-columns: minmax(0, 1fr); }
}

:where(.neu) .knopf {
  min-height: 40px; padding: 8px 16px; justify-content: center;
  border-radius: var(--n-rund-knopf); line-height: 1.2;
}
:where(.neu) .knopf:not(.leise):not(.gefahr):not(.ki) { box-shadow: none; }
:where(.neu) .knopf:hover { transform: none; }
:where(.neu) .knopf:not(.leise):not(.gefahr):not(.ki):not(.gut):hover { box-shadow: none; background: var(--n-blau-voll-tief); }

:where(.neu) .knopf.leise {
  background: #fff; color: var(--n-tinte);
  box-shadow: inset 0 0 0 1px var(--n-linie);
}
:where(.neu) .knopf.leise:hover { background: var(--n-feld); color: var(--n-tinte); box-shadow: inset 0 0 0 1px #d3d6dd; }
:where(.neu) .knopf.klein { min-height: 34px; padding: 6px 12px; font-size: 13px; border-radius: 9px; }

:where(.neu) .knopf.gross { min-height: 48px; padding: 12px 22px; border-radius: 12px; font-weight: 600; letter-spacing: 0; }

:where(.neu) .knopf.gefahr { background: var(--n-schlecht); color: #fff; box-shadow: none; }
:where(.neu) .knopf.gefahr:hover { background: #c0122f; box-shadow: none; }

:where(.neu) .knopf.gut { background: var(--n-gut); color: #fff; box-shadow: none; }
:where(.neu) .knopf.gut:hover { background: #077a52; }

:where(.neu) .knopf.ki {
  background: var(--n-blau-flaeche); color: var(--n-blau-tief);
  border: 0; box-shadow: inset 0 0 0 1px var(--n-blau-linie);
}
:where(.neu) .knopf.ki:hover { background: #dcedfa; box-shadow: inset 0 0 0 1px #b7d8f1; }
:where(.neu) .knopf.ki.klein { min-height: 30px; padding: 4px 10px 4px 9px; font-size: 12px; }
:where(.neu) .knopf:disabled,
:where(.neu) .knopf[aria-disabled="true"] { opacity: .45; box-shadow: none; }

:where(.neu) .knopf[aria-busy="true"] { position: relative; opacity: .7; }
:where(.neu) .knopf[aria-busy="true"]::after {
  content: ""; position: absolute; right: 6px; top: 50%;
  width: 10px; height: 10px; margin-top: -5px;
  border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%;
  animation: n-dreht .7s linear infinite;
}
@keyframes n-dreht { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  :where(.neu) .knopf[aria-busy="true"]::after { animation: none; }
}
:where(.neu) .knopf-reihe { gap: 10px; }

:where(.neu) .karte {
  border-radius: var(--n-rund);
  box-shadow: 0 0 0 1px var(--n-linie);
  background: #fff;
}
:where(.neu) .karte-kopf { gap: 10px; }
:where(.neu) .karte-kopf h2,
:where(.neu) .karte > h2:first-child { font-size: 15.5px; font-weight: 650; letter-spacing: -.01em; }
:where(.neu) .karte-kopf h2 + .klein,
:where(.neu) .karte-kopf .unter { color: var(--n-leise); }

:where(.neu) .karte.abgehakt { background: var(--n-feld); border: 0; box-shadow: 0 0 0 1px var(--n-linie-fein); }

:where(.neu) .karte.bittet-um-anruf { border: 0; box-shadow: 0 0 0 1.5px var(--n-blau); }

:where(.neu) .kennzahl { gap: 14px; }
:where(.neu) .kennzahl .rund {
  width: 40px; height: 40px; border-radius: var(--n-rund-klein);
  background: var(--n-blau-flaeche); color: var(--n-blau);
}
:where(.neu) .kennzahl .rund svg { width: 19px; height: 19px; stroke-width: 1.8; }
:where(.neu) .kennzahl .label {
  margin-bottom: 4px;
  font-size: 11.5px; font-weight: 600; line-height: 1.35;
  letter-spacing: .06em; text-transform: uppercase; color: var(--n-leise);
}
:where(.neu) .kennzahl .wert {
  font-size: 28px; font-weight: 700; letter-spacing: -.03em; line-height: 1.1;
  color: var(--n-tinte); font-variant-numeric: tabular-nums;
}
@media (max-width: 900px) {
  :where(.neu) .kennzahl .wert { font-size: 20px; }
  :where(.neu) .kennzahl .label { font-size: 10.5px; }
}

:where(.neu) .feld input[type=text], :where(.neu) .feld input[type=email], :where(.neu) .feld input[type=password],
:where(.neu) .feld input[type=number], :where(.neu) .feld input[type=url], :where(.neu) .feld input[type=date],
:where(.neu) .feld input[type=datetime-local], :where(.neu) .feld input[type=time],
:where(.neu) .feld input[type=search], :where(.neu) .feld input[type=tel], :where(.neu) .feld input:not([type]),
:where(.neu) .feld select, :where(.neu) .feld textarea {
  background: var(--n-feld); border-radius: var(--n-rund-knopf);
  box-shadow: inset 0 0 0 1px var(--n-linie); color: var(--n-tinte);
  font-size: 14px;
}
:where(.neu) .feld input[type=text], :where(.neu) .feld input[type=email], :where(.neu) .feld input[type=password],
:where(.neu) .feld input[type=number], :where(.neu) .feld input[type=url], :where(.neu) .feld input[type=date],
:where(.neu) .feld input[type=datetime-local], :where(.neu) .feld input[type=time],
:where(.neu) .feld input[type=search], :where(.neu) .feld input[type=tel], :where(.neu) .feld input:not([type]),
:where(.neu) .feld select, :where(.neu) .wahl-knopf, :where(.neu) .dwahl-knopf {
  box-sizing: border-box; height: 42px; padding-top: 0; padding-bottom: 0;
}
:where(.neu) .feld input[type=search], :where(.neu) .feld input[type=tel], :where(.neu) .feld input:not([type]) {
  width: 100%; border: 0; padding-left: 14px; padding-right: 14px; font-family: inherit; outline: 0;
}
:where(.neu) .feld input:hover, :where(.neu) .feld select:hover, :where(.neu) .feld textarea:hover { box-shadow: inset 0 0 0 1px #cbd0d8; }
:where(.neu) .feld input:focus, :where(.neu) .feld select:focus, :where(.neu) .feld textarea:focus {
  background: #fff; box-shadow: inset 0 0 0 1px var(--n-blau);
}
:where(.neu) .feld input::placeholder, :where(.neu) .feld textarea::placeholder { color: #8a909c; }
:where(.neu) .feld input[disabled], :where(.neu) .feld select[disabled], :where(.neu) .feld textarea[disabled] {
  background: var(--n-flaeche); color: var(--n-leise); box-shadow: none;
}
:where(.neu) .feld textarea { padding: 11px 14px; }
:where(.neu) .feld label, :where(.neu) .feld .beschriftung { font-size: 13px; font-weight: 600; color: var(--n-tinte); }
:where(.neu) .feld .hilfe { font-size: 12.5px; color: var(--n-leise); }
:where(.neu) .feld .hilfe.schlecht { color: var(--n-schlecht); }
:where(.neu) .feld.schlecht input { box-shadow: inset 0 0 0 1px var(--n-schlecht); background: #fffafb; }
:where(.neu) .feld-paar, :where(.neu) .feld-drei { gap: 14px 16px; }

:where(.neu) input[type=checkbox], :where(.neu) input[type=radio] { accent-color: var(--n-blau-voll); }
:where(.neu) .haken .text { color: var(--n-tinte); }
:where(.neu) .haken .text .dazu { color: var(--n-leise); }

:where(.neu) .feld label.haken { font-size: 13.5px; font-weight: 500; margin-bottom: 10px; }
:where(.neu) .feld label.haken .dazu { font-weight: 400; color: var(--n-leise); }

:where(.neu) .wahl-knopf, :where(.neu) .dwahl-knopf {
  border: 1px solid var(--n-linie); border-radius: var(--n-rund-knopf);
  background: var(--n-feld); color: var(--n-tinte); font-size: 14px;
}
:where(.neu) .wahl-knopf:hover, :where(.neu) .dwahl-knopf:hover { border-color: #cbd0d8; }
:where(.neu) .wahl-knopf:focus-visible, :where(.neu) .wahl.offen .wahl-knopf,
:where(.neu) .dwahl-knopf:focus-visible, :where(.neu) .dwahl.offen .dwahl-knopf { border-color: var(--n-blau); background: #fff; }
:where(.neu) .wahl-knopf[disabled], :where(.neu) .dwahl-knopf[disabled] { background: var(--n-flaeche); color: var(--n-leise); }
:where(.neu) .wahl-pfeil { border-color: var(--n-leise); }
:where(.neu) .wahl-liste, :where(.neu) .dwahl-blatt {
  border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein);
  box-shadow: 0 12px 32px rgb(16 24 40 / .12);
}
:where(.neu) .wahl-eintrag { border-radius: 8px; color: var(--n-tinte); }
:where(.neu) .wahl-eintrag:hover, :where(.neu) .wahl-eintrag.aktiv { background: var(--n-flaeche); }
:where(.neu) .wahl-eintrag.gewaehlt { color: var(--n-blau-tief); }
:where(.neu) .wahl-eintrag.gewaehlt:hover, :where(.neu) .wahl-eintrag.gewaehlt.aktiv { background: var(--n-blau-flaeche); }
:where(.neu) .dwahl-tag:hover { background: var(--n-flaeche); }
:where(.neu) .dwahl-tag.heute { box-shadow: inset 0 0 0 1.5px var(--n-blau); color: var(--n-blau-tief); }
:where(.neu) .dwahl-tag.gewaehlt, :where(.neu) .dwahl-tag.gewaehlt:hover { background: var(--n-blau-voll); color: #fff; }
:where(.neu) .dwahl-wochentage { letter-spacing: .06em; }

:where(.neu) .werkzeug { gap: 10px; }
:where(.neu) .werkzeug .suchfeld {
  box-sizing: border-box; min-height: 42px; padding: 0 14px;
  background: var(--n-feld); border-radius: var(--n-rund-knopf);
  box-shadow: inset 0 0 0 1px var(--n-linie);
}

:where(.neu) .werkzeug .suchfeld:focus-within { background: #fff; box-shadow: inset 0 0 0 2px var(--n-blau-tief); }
.neu .werkzeug .suchfeld input:focus-visible { outline: 0 !important; }
:where(.neu) .werkzeug select,
:where(.neu) .werkzeug input[type=text], :where(.neu) .werkzeug input[type=email],
:where(.neu) .werkzeug input[type=number], :where(.neu) .werkzeug input[type=date],
:where(.neu) .werkzeug textarea {
  border: 1px solid var(--n-linie); border-radius: var(--n-rund-knopf); background: var(--n-feld);
}
:where(.neu) .werkzeug .wahl-knopf { height: 42px; }

:where(.neu) .datei-huelle {
  box-sizing: border-box; min-height: 66px; flex-wrap: nowrap;
  padding: 12px 14px; border: 1px dashed #cdd1d9; border-radius: var(--n-rund-klein);
  background: var(--n-feld);
}
:where(.neu) .datei-huelle.gefuellt { border-style: solid; border-color: var(--n-linie); background: #fff; }
:where(.neu) .datei-huelle.drueber,
:where(.neu) .datei-huelle:focus-within { border-color: var(--n-blau); background: var(--n-blau-flaeche); }
:where(.neu) .datei-huelle .datei-knopf { min-height: 40px; }
:where(.neu) .datei-stand {
  flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  word-break: normal; color: var(--n-leise);
}
:where(.neu) .datei-liste:empty { display: none; }

.neu .expose-ablage .datei-huelle { min-height: 200px; }
.neu .expose-ablage input[type=file]:not(.datei-echt) {
  grid-area: 1 / 1; height: 200px; padding: 120px 22px 0;
  border-width: 2px; border-radius: 16px; text-align: center;
}
.neu .expose-ablage > .expose-ablage-marke {
  grid-area: 1 / 1; align-self: start; position: relative;
  margin: 0; padding: 30px 24px 0; text-align: center; pointer-events: none;
  font-size: 15.5px; font-weight: 700;
}
:where(.neu) input[type=file]:not(.datei-echt):not([data-eigen]) {
  box-sizing: border-box; display: block; width: 100%; height: 66px;
  padding: 12px 14px; border: 1px dashed #cdd1d9; border-radius: var(--n-rund-klein);
  background: var(--n-feld); color: var(--n-leise); font: inherit; font-size: 13px;
}

:where(.neu input:is([type=text], [type=search], [type=email], [type=number], [type=tel],
  [type=url], [type=password], [type=date], [type=time], [type=datetime-local],
  [type=month], [type=week], :not([type])), :where(.neu) select, :where(.neu) textarea) {
  box-sizing: border-box; min-height: 42px; max-width: 100%;
  padding: 8px 12px; margin: 0;
  font: inherit; font-size: 14px; line-height: 1.4; color: var(--n-tinte);
  background-color: var(--n-feld);
  border: 1px solid var(--n-linie); border-radius: var(--n-rund-knopf);
  outline: 0;
  transition: border-color var(--dauer) var(--kurve), background-color var(--dauer) var(--kurve);
}
:where(.neu textarea) { min-height: 88px; line-height: 1.55; }
:where(.neu input:hover, .neu select:hover, .neu textarea:hover) { border-color: #cbd0d8; }
:where(.neu input:focus, .neu select:focus, .neu textarea:focus) { border-color: var(--n-blau); background-color: #fff; }
:where(.neu input::placeholder, .neu textarea::placeholder) { color: #8a909c; opacity: 1; }
:where(.neu input:disabled, .neu select:disabled, .neu textarea:disabled) {
  background-color: var(--n-flaeche); color: var(--n-leise); cursor: default;
}

:where(.neu button, .neu input, .neu select, .neu textarea) { font-family: inherit; }

.neu select:not([multiple]):not([size]) {
  -webkit-appearance: none; appearance: none; padding-right: 34px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235f6676' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center; background-size: 12px;
}

:where(.neu input[type=search]) { -webkit-appearance: none; appearance: none; }
:where(.neu) input[type=search]::-webkit-search-decoration,
:where(.neu) input[type=search]::-webkit-search-cancel-button { -webkit-appearance: none; display: none; }

:where(.neu) input::-webkit-calendar-picker-indicator { opacity: .5; cursor: pointer; }
:where(.neu) input::-webkit-calendar-picker-indicator:hover { opacity: .85; }

:where(.neu input[type=checkbox], .neu input[type=radio]) {
  -webkit-appearance: none; appearance: none;
  box-sizing: border-box; flex: none;
  width: 18px; height: 18px; margin: 0; vertical-align: -3px;
  border: 1.5px solid #b9bec8; border-radius: 5px; background-color: #fff;
  background-repeat: no-repeat; background-position: center; background-size: 78%;
  cursor: pointer;
  transition: background-color var(--dauer) var(--kurve), border-color var(--dauer) var(--kurve);
}
:where(.neu input[type=radio]) { border-radius: 50%; }
:where(.neu input[type=checkbox]:hover, .neu input[type=radio]:hover) { border-color: var(--n-blau); }
:where(.neu input[type=checkbox]:checked) {
  background-color: var(--n-blau-voll); border-color: var(--n-blau-voll);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E");
}
:where(.neu input[type=checkbox]:indeterminate) {
  background-color: var(--n-blau-voll); border-color: var(--n-blau-voll);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round'%3E%3Cpath d='M6 12h12'/%3E%3C/svg%3E");
}
:where(.neu input[type=radio]:checked) {
  border-color: var(--n-blau-voll); background-color: #fff;
  box-shadow: inset 0 0 0 4px var(--n-blau-voll);
}
:where(.neu input[type=checkbox]:disabled, .neu input[type=radio]:disabled) { opacity: .45; cursor: default; }

:where(.neu) input[type=file]::file-selector-button {
  height: 40px; margin-right: 12px; padding: 0 14px;
  font: inherit; font-size: 13.5px; font-weight: 600; color: var(--n-tinte);
  background: #fff; border: 1px solid var(--n-linie); border-radius: var(--n-rund-knopf);
  cursor: pointer;
}
:where(.neu) input[type=file]::file-selector-button:hover { background: var(--n-feld); border-color: #d3d6dd; }

:where(.neu input[type=range]) { accent-color: var(--n-blau-voll); cursor: pointer; }
:where(.neu input[type=color]) {
  box-sizing: border-box; width: 44px; height: 40px; padding: 4px;
  border: 1px solid var(--n-linie); border-radius: var(--n-rund-knopf); background: #fff; cursor: pointer;
}
:where(.neu) input[type=color]::-webkit-color-swatch-wrapper { padding: 0; }
:where(.neu) input[type=color]::-webkit-color-swatch { border: 0; border-radius: 6px; }
:where(.neu progress, .neu meter) {
  -webkit-appearance: none; appearance: none;
  height: 8px; border: 0; border-radius: 999px; overflow: hidden;
  background: var(--n-flaeche); accent-color: var(--n-blau-voll);
}
:where(.neu) progress::-webkit-progress-bar { background: var(--n-flaeche); border-radius: 999px; }
:where(.neu) progress::-webkit-progress-value { background: var(--n-blau-voll); border-radius: 999px; }
:where(.neu) progress::-moz-progress-bar { background: var(--n-blau-voll); border-radius: 999px; }
:where(.neu) meter::-webkit-meter-bar { background: var(--n-flaeche); border: 0; border-radius: 999px; }
:where(.neu) meter::-webkit-meter-optimum-value { background: var(--n-blau-voll); }

:where(.neu button:not([class])) {
  min-height: 40px; padding: 0 14px;
  font: inherit; font-size: 13.5px; font-weight: 600; color: var(--n-tinte);
  background: #fff; border: 1px solid var(--n-linie); border-radius: var(--n-rund-knopf);
  cursor: pointer;
}
:where(.neu button:not([class]):hover) { background: var(--n-feld); border-color: #d3d6dd; }

@media (pointer: coarse), (max-width: 900px) {
  :where(.neu input:is([type=text], [type=search], [type=email], [type=number], [type=tel],
    [type=url], [type=password], [type=date], [type=time], [type=datetime-local],
    [type=month], [type=week], :not([type])), :where(.neu) select, :where(.neu) textarea) { min-height: 44px; font-size: 16px; }
  :where(.neu button:not([class])) { min-height: 44px; }
  :where(.neu) input[type=file]::file-selector-button { height: 44px; }
  :where(.neu) .farbe-feld input[type=color] { width: 44px; height: 44px; }
  
  :where(.neu) .register a { min-height: 44px; }
  :where(.neu) .seitenfuss a { display: inline-flex; align-items: center; min-height: 44px; }
}

@media (max-width: 900px) {
  .neu .gruss { min-width: 0; max-width: 100%; }
  .neu .gruss p { max-width: 100%; white-space: normal; }
  
  .neu .hilfe-knopf {
    right: max(var(--seiten-rand), env(safe-area-inset-right));
    bottom: calc(max(var(--seiten-rand), env(safe-area-inset-bottom)) + 76px);
  }
}

@media (min-width: 901px) and (max-width: 1239px) {
  .neu .gruss p { max-width: 100%; }
}

.neu .leiste details.gruppe:not(:focus-within)::details-content { transition: none; }

:where(.neu .inhalt a:not([class])) { color: var(--n-blau-tief); text-decoration: none; }
:where(.neu .inhalt a:not([class]):hover) { text-decoration: underline; text-underline-offset: 3px; }

:where(.neu a) { color: var(--n-blau-tief); text-decoration: none; }
:where(.neu a:not([class]):hover) { text-decoration: underline; text-underline-offset: 3px; }

.neu .schritt-fuehrung {
  top: calc(var(--n-kopf-hoehe) + 10px);
  padding: 10px 12px;
  box-shadow: 0 0 0 1px var(--n-linie), 0 8px 20px rgb(16 24 40 / .06);
}
.neu .schritt-fuehrung .stand.offen { color: var(--n-gelb-text); }

.neu .wegleiste { padding: 14px 16px 12px; border-radius: var(--n-rund); }
.neu .wegleiste .jetzt { border-bottom-color: var(--n-blau-voll); }
.neu .wegleiste .jetzt .zahl { background: var(--n-blau-voll); box-shadow: 0 0 0 4px var(--n-blau-flaeche); }
.neu .wegleiste .zahl { background: var(--n-flaeche); }

.neu .ziel-zahl b { font-size: 34px; font-weight: 700; letter-spacing: -.03em; color: var(--n-tinte); }
.neu .ziel-block { background: var(--n-feld); border: 1px solid var(--n-linie); }

.neu .register { padding: 4px; border-radius: 12px; }
.neu .register a { padding: 7px 14px; border-radius: 9px; }
.neu .register a.aktiv { background: var(--n-blau-flaeche); color: var(--n-blau-tief); box-shadow: inset 0 0 0 1px var(--n-blau-linie); }
.neu .register a.aktiv .zaehler { background: #fff; color: var(--n-blau-tief); }
.neu .register .zaehler { background: var(--n-flaeche); }

.neu .karte.marke-voll {
  background: var(--n-blau-flaeche); color: var(--n-tinte);
  box-shadow: 0 0 0 1px var(--n-blau-linie);
}
.neu .karte.marke-voll::after { content: none; }
.neu .karte.marke-voll .label { color: var(--n-blau-tief); }
.neu .karte.marke-voll .wert { color: var(--n-tinte); }
.neu .karte.marke-voll .rund { background: #fff; color: var(--n-blau); box-shadow: none; }

:where(.neu) .tabelle { font-size: 13.5px; color: var(--n-tinte); }
:where(.neu) .tabelle th {
  padding-bottom: 10px;
  font-size: 11px; font-weight: 600; line-height: 1.3;
  letter-spacing: .06em; text-transform: uppercase; color: var(--n-leise);
  border-bottom: 1px solid var(--n-linie);
}
:where(.neu) .tabelle td { border-bottom: 1px solid var(--n-linie-fein); }
:where(.neu) .tabelle tbody tr:hover { background: var(--n-feld); }
:where(.neu) .tabelle .stark { font-weight: 600; color: var(--n-tinte); }
:where(.neu) .tabelle .leise { color: var(--n-leise); }
:where(.neu) .tabelle a { color: var(--n-blau-tief); }
:where(.neu) .tabelle-eingabe { border: 1px solid var(--n-linie); border-radius: 8px; background: var(--n-feld); }
:where(.neu) .tabelle-huelle {
  background:
    linear-gradient(to right, #fff 40%, rgb(255 255 255 / 0)) left center / 26px 100% no-repeat local,
    linear-gradient(to left,  #fff 40%, rgb(255 255 255 / 0)) right center / 26px 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%,   rgb(30 40 61 / .12), rgb(30 40 61 / 0)) left center / 10px 100% no-repeat scroll,
    radial-gradient(farthest-side at 100% 50%, rgb(30 40 61 / .12), rgb(30 40 61 / 0)) right center / 10px 100% no-repeat scroll;
}

:where(.neu) .meldung {
  padding: 12px 15px; border-radius: var(--n-rund-klein);
  font-size: 13.5px; line-height: 1.5;
  border: 1px solid transparent;
}
:where(.neu) .meldung.gut      { background: #ecfbf2; border-color: #bfe9cf; color: var(--n-gut-text); }
:where(.neu) .meldung.warn     { background: var(--n-gelb-flaeche); border-color: var(--n-gelb-linie); color: var(--n-gelb-text); }
:where(.neu) .meldung.schlecht { background: #fff1f2; border-color: #f8c7cd; color: #a3112b; }
:where(.neu) .meldung.hinweis  { background: var(--n-blau-flaeche); border-color: var(--n-blau-linie); color: var(--n-tinte); }
:where(.neu) .meldung.hinweis svg { color: var(--n-blau); }
:where(.neu) .meldung a { color: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
:where(.neu) .meldung.rueckblick { border-left-width: 3px; border-left-color: #c99a1c; }

:where(.neu) .meldung:has(> a, > b, > strong, > em, > code) { display: block; }
:where(.neu) .meldung:has(> a, > b, > strong, > em, > code) > svg {
  display: inline-block; vertical-align: -3px; margin: 0 8px 0 0;
}

:where(.neu) .blaettern a:hover { background: var(--n-flaeche); color: var(--n-tinte); }
:where(.neu) .blaettern .jetzt {
  background: var(--n-blau-flaeche); color: var(--n-blau-tief);
  box-shadow: inset 0 0 0 1px var(--n-blau-linie);
}

:where(.neu) .pille {
  min-height: 24px; padding: 2px 10px; box-sizing: border-box;
  font-size: 12px; font-weight: 600; line-height: 1.3;
  background: var(--n-flaeche); color: var(--n-leise);
}
:where(.neu) .pille.gut { background: var(--n-gut-flaeche); color: var(--n-gut-text); }
:where(.neu) .pille.schlecht { background: var(--n-schlecht-flaeche); color: #b3122f; }
:where(.neu) .pille.leise { background: var(--n-flaeche); color: var(--n-leise); box-shadow: none; }
:where(.neu) .pille.marke { background: var(--n-blau-flaeche); color: var(--n-blau-tief); }
:where(.neu) .pille.anruf { background: var(--n-blau-voll); color: #fff; }
.neu .register .zaehler,
:where(.neu) .zaehler { font-variant-numeric: tabular-nums; }

:where(.neu) .leer { padding: 28px 14px; }
:where(.neu) .leer .satz { font-size: 14.5px; font-weight: 600; color: var(--n-tinte); }
:where(.neu) .leer .dazu { font-size: 13px; color: var(--n-leise); }
:where(.neu) .leer .hilfe { color: var(--n-leise); }
:where(.neu) .leer .hilfe a { color: var(--n-blau-tief); }

:where(.neu) .karte.hinweis .sym-gross {
  width: 48px; height: 48px; border-radius: var(--n-rund-klein);
  background: var(--n-blau-flaeche); color: var(--n-blau);
}
:where(.neu) .karte.hinweis h3 { font-size: 15px; font-weight: 650; }
:where(.neu) .karte.hinweis p { font-size: 13px; color: var(--n-leise); }

:where(.neu) .stark { font-weight: 600; }
:where(.neu) .klein:not(.knopf) { color: var(--n-leise); }

:where(.neu) .balken { background: var(--n-flaeche); }
:where(.neu) .balken .fuellung { background: linear-gradient(90deg, var(--n-blau-tief) 0%, var(--n-blau) 100%); }
:where(.neu) .karte.limit .fuellung { background: linear-gradient(90deg, var(--n-blau-tief) 0%, var(--n-blau) 100%); }
:where(.neu) .karte.limit.eng .fuellung { background: var(--n-schlecht); }

:where(.neu) .skelett { background: var(--n-flaeche); }
:where(.neu) .skelett.bild { border-radius: var(--n-rund); }

:where(.neu) .aufklapp > summary { border-radius: var(--n-rund-klein); }
:where(.neu) .aufklapp > summary:hover { background: var(--n-feld); }
:where(.neu) .aufklapp-zeichen {
  border-radius: var(--n-rund-knopf);
  background: var(--n-blau-flaeche); color: var(--n-blau);
}
:where(.neu) .aufklapp > summary .titel { font-size: 14.5px; font-weight: 600; color: var(--n-tinte); }
:where(.neu) .aufklapp > summary .unter { color: var(--n-leise); }
:where(.neu) .karte.klapp > summary h2 { font-size: 15.5px; font-weight: 650; letter-spacing: -.01em; }
:where(.neu) .karte.klapp > summary::after { border-color: var(--n-leise); }

:where(.neu) .karte.klapp > summary .klapp-wert {
  display: inline-flex; align-items: center; min-height: 22px; padding: 0 9px;
  border-radius: 999px; background: var(--n-flaeche);
  font-size: 12px; font-weight: 600; color: var(--n-leise);
}
:where(.neu) .karte.klapp > summary .klapp-wert::before { content: none; }
:where(.neu) .karte.klapp[open] > summary { border-bottom-color: var(--n-linie); }

:where(.neu) .inhalt details > summary { color: inherit; }

:where(.neu) .kippe {
  min-height: 36px; padding: 0 10px 0 12px; border-radius: var(--n-rund-knopf);
  border-color: var(--n-linie); background: #fff; color: var(--n-tinte);
  font-size: 13px;
}
:where(.neu) .kippe:hover { border-color: #cbd0d8; background: var(--n-feld); }
:where(.neu) .kippe .lampe { background: #c9ced4; }
:where(.neu) .kippe.an .lampe, :where(.neu) .kippe:has(> input:checked) .lampe {
  background: var(--n-blau); box-shadow: 0 0 0 3px var(--n-blau-flaeche);
}
:where(.neu) .kippe .bahn { background: var(--n-linie); }
:where(.neu) .kippe.an .bahn, :where(.neu) .kippe:has(> input:checked) .bahn { background: var(--n-blau-voll); }
:where(.neu) .kippe .bahn i { box-shadow: 0 1px 2px rgb(16 24 40 / .2); }

:where(.neu) .kreis {
  background: var(--n-blau-flaeche); color: var(--n-blau-tief);
  font-weight: 700; box-shadow: inset 0 0 0 1px var(--n-blau-linie);
}
:where(.neu) .chat-person-bild { border: 0; box-shadow: 0 0 0 1px var(--n-linie); }

:where(.neu) .liste h2, :where(.neu) .zeile h2 { font-size: 15.5px; font-weight: 650; letter-spacing: -.01em; }
:where(.neu) .liste .posten, :where(.neu) .eintrag { border-bottom-color: var(--n-linie-fein); }
:where(.neu) .liste .posten .titel { color: var(--n-tinte); }
:where(.neu) .liste .posten .unter { color: var(--n-leise); }

:where(.neu) dialog::backdrop { background: rgb(30 40 61 / .32); }
:where(.neu) .hilfe-fenster,
:where(.neu) .as-fenster {
  border-radius: var(--n-rund);
  box-shadow: 0 0 0 1px var(--n-linie), 0 24px 60px rgb(16 24 40 / .18);
}
:where(.neu) .hilfe-fenster-kopf, :where(.neu) .as-kopf { border-bottom-color: var(--n-linie); }
:where(.neu) .hilfe-fenster-kopf h2, :where(.neu) .as-kopf h2 { font-size: 15.5px; font-weight: 650; letter-spacing: -.01em; }
:where(.neu) .hilfe-fenster-zu { background: transparent; color: var(--n-leise); border-radius: var(--n-rund-knopf); }
:where(.neu) .hilfe-fenster-zu:hover { background: var(--n-flaeche); color: var(--n-tinte); }
:where(.neu) .as-kopf-stern { color: var(--n-blau); }

:where(.neu) .hilfe-knopf {
  width: 52px; height: 52px;
  background: var(--n-blau-verlauf);
  box-shadow: 0 6px 18px rgb(16 24 40 / .16), 0 0 0 1px rgb(255 255 255 / .6) inset;
}
:where(.neu) .hilfe-knopf:hover { box-shadow: 0 8px 22px rgb(16 24 40 / .22), 0 0 0 1px rgb(255 255 255 / .6) inset; }

:where(.neu) .chat-person { border-bottom-color: var(--n-linie); }
:where(.neu) .chat-person-name { font-weight: 650; }
:where(.neu) .blase { border-radius: 14px; border-color: var(--n-linie); background: #fff; }
:where(.neu) .chat-zeile.fremd .blase { background: var(--n-feld); }
:where(.neu) .chat-zeile.meins .blase { background: var(--n-blau-voll); border-color: var(--n-blau-voll); }
:where(.neu) .chat-eingabe textarea {
  border: 1px solid var(--n-linie); border-radius: var(--n-rund-knopf);
  background: var(--n-feld); font-size: 14px;
}
:where(.neu) .chat-eingabe textarea:focus { border-color: var(--n-blau); background: #fff; }
:where(.neu) .chat-artikel-zeile:hover, :where(.neu) .chat-vorschlag-zeile:hover { background: var(--n-blau-flaeche); }

:where(.neu) .willkommen::backdrop { background: rgb(30 40 61 / .45); }
:where(.neu) .willkommen-karte {
  border-radius: 20px;
  box-shadow: 0 0 0 1px var(--n-linie), 0 30px 70px rgb(16 24 40 / .22);
}
:where(.neu) .willkommen-bild { background: var(--n-blau-verlauf); }
:where(.neu) .willkommen-fahne {
  padding: 0 11px; height: 26px; display: inline-flex; align-items: center;
  background: var(--n-blau-flaeche); color: var(--n-blau-tief);
  font-size: 12.5px; font-weight: 600;
}
:where(.neu) .willkommen-text h2 { font-size: 26px; font-weight: 700; letter-spacing: -.03em; color: var(--n-tinte); }
:where(.neu) .willkommen-text p { font-size: 15px; color: var(--n-leise); }
:where(.neu) .willkommen-tipp { background: var(--n-feld); border-color: var(--n-linie); border-radius: var(--n-rund-klein); }
:where(.neu) .willkommen-tipp div { color: var(--n-leise); }
:where(.neu) .willkommen-nebenweg { color: var(--n-blau-tief); }
:where(.neu) .anlass-karte {
  border-radius: var(--n-rund);
  box-shadow: 0 0 0 1px var(--n-linie), 0 24px 60px rgb(16 24 40 / .18);
}
:where(.neu) .anlass-karte h2 { font-size: 19px; font-weight: 700; letter-spacing: -.02em; }

:where(.neu) .frage-schicht { background: rgb(30 40 61 / .32); }
:where(.neu) .as-fenster::backdrop { background: rgb(30 40 61 / .32); }
:where(.neu) .frage-karte {
  border-radius: var(--n-rund);
  box-shadow: 0 0 0 1px var(--n-linie), 0 24px 60px rgb(16 24 40 / .18);
}
:where(.neu) .frage-titel { font-size: 16px; font-weight: 650; letter-spacing: -.01em; color: var(--n-tinte); }
:where(.neu) .frage-dazu { color: var(--n-leise); }
.kopier-fenster {
  width: min(460px, calc(100vw - 32px)); max-width: none;
  padding: 0; border: 0; background: transparent; overflow: visible;
}
.kopier-fenster .frage-karte { max-width: none; }
.kopier-fenster-text {
  display: block; width: 100%; margin-top: 14px; resize: none;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px;
}
.kopier-fenster .frage-knoepfe { display: flex; justify-content: flex-end; margin-top: 16px; }

@media (pointer: coarse), (max-width: 900px) {
  :where(.neu) .knopf, :where(.neu) .knopf.klein, :where(.neu) .knopf.ki.klein { min-height: 44px; }
  :where(.neu) .feld input[type=text], :where(.neu) .feld input[type=email], :where(.neu) .feld input[type=password],
  :where(.neu) .feld input[type=number], :where(.neu) .feld input[type=url], :where(.neu) .feld input[type=date],
  :where(.neu) .feld input[type=datetime-local], :where(.neu) .feld input[type=time],
  :where(.neu) .feld input[type=search], :where(.neu) .feld input[type=tel], :where(.neu) .feld input:not([type]),
  :where(.neu) .feld select, :where(.neu) .wahl-knopf, :where(.neu) .dwahl-knopf, :where(.neu) .werkzeug .wahl-knopf {
    height: 44px; font-size: 16px;
  }
  :where(.neu) .feld textarea, :where(.neu) .chat-eingabe textarea { font-size: 16px; }
  :where(.neu) .werkzeug .suchfeld { min-height: 44px; }
  :where(.neu) .kippe { min-height: 44px; }
  :where(.neu) .datei-huelle { min-height: 70px; }
  :where(.neu) .datei-huelle .datei-knopf { min-height: 44px; }
  :where(.neu) input[type=file]:not(.datei-echt):not([data-eigen]) { height: 70px; }
}

.ks-regler { --griff: 22px; flex: 1 1 100%; min-width: 0; }
.ks-regler-kopf { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; }
.ks-regler-wert {
  font-size: 22px; font-weight: 700; line-height: 1;
  letter-spacing: -.02em; color: var(--n-tinte); font-variant-numeric: tabular-nums;
}
.ks-regler-urteil {
  display: inline-flex; align-items: center; height: 22px; padding: 0 9px;
  border-radius: 999px; background: var(--n-gut-flaeche); color: var(--n-gut-text);
  font-size: 11.5px; font-weight: 600; white-space: nowrap;
}
.ks-regler.ks-ausserhalb .ks-regler-urteil { background: var(--n-flaeche); color: var(--n-leise); }
.ks-regler-speichern { margin-left: auto; }

.neu .ks-regler-speichern.ks-geaendert { background: var(--n-blau-voll); color: #fff; box-shadow: none; }
.neu .ks-regler-speichern.ks-geaendert:hover { background: var(--n-blau-voll-tief); color: #fff; box-shadow: none; }

.ks-regler input[type=range] {
  -webkit-appearance: none; appearance: none;
  display: block; width: 100%; height: 28px; margin: 10px 0 0;
  background: transparent; cursor: pointer;
}

.ks-regler input[type=range]:focus-visible { outline: 0 !important; }
.ks-regler input[type=range]:disabled { cursor: default; opacity: .55; }

.ks-regler input[type=range]::-webkit-slider-runnable-track {
  height: 8px; border-radius: 999px;
  background: linear-gradient(90deg,
    var(--n-blau-voll) 0 calc(var(--griff) / 2 + var(--p) * (100% - var(--griff))),
    var(--n-linie) 0);
}
.ks-regler input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none; box-sizing: border-box;
  width: var(--griff); height: var(--griff); margin-top: calc((8px - var(--griff)) / 2);
  border: 2px solid var(--n-blau-voll); border-radius: 50%; background: #fff;
  box-shadow: 0 2px 6px rgb(16 24 40 / .18);
  transition: transform var(--dauer) var(--kurve), box-shadow var(--dauer) var(--kurve);
}
.ks-regler input[type=range]:not(:disabled):hover::-webkit-slider-thumb { transform: scale(1.1); }
.ks-regler input[type=range]:focus-visible::-webkit-slider-thumb {
  box-shadow: 0 0 0 5px var(--n-blau-linie), 0 2px 6px rgb(16 24 40 / .18);
}
.ks-regler input[type=range]::-moz-range-track { height: 8px; border-radius: 999px; background: var(--n-linie); }
.ks-regler input[type=range]::-moz-range-progress { height: 8px; border-radius: 999px; background: var(--n-blau-voll); }
.ks-regler input[type=range]::-moz-range-thumb {
  box-sizing: border-box; width: var(--griff); height: var(--griff);
  border: 2px solid var(--n-blau-voll); border-radius: 50%; background: #fff;
  box-shadow: 0 2px 6px rgb(16 24 40 / .18);
}
.ks-regler input[type=range]:focus-visible::-moz-range-thumb {
  box-shadow: 0 0 0 5px var(--n-blau-linie), 0 2px 6px rgb(16 24 40 / .18);
}

.ks-regler-skala {
  position: relative; display: flex; justify-content: space-between;
  margin-top: 4px; padding-top: 10px;
  font-size: 11.5px; color: var(--n-leise); font-variant-numeric: tabular-nums;
}
.ks-regler-band {
  position: absolute; top: 0; height: 4px; border-radius: 999px; background: var(--n-gut);
  left: calc(var(--griff) / 2 + var(--band-von) * (100% - var(--griff)));
  width: calc((var(--band-bis) - var(--band-von)) * (100% - var(--griff)));
}
.ks-regler-band > span {
  position: absolute; top: 10px; left: 50%; transform: translateX(-50%);
  font-weight: 600; color: var(--n-gut-text); white-space: nowrap;
}
@media (pointer: coarse) {
  .ks-regler { --griff: 28px; }
}

@media (max-width: 900px) {
  
  .neu .schritt-fuehrung { top: 8px; }
}

@media (max-width: 1359px) {
  .ks-anrufe-kurve { display: none; }
}

@media (max-width: 1239px) {
  .neu .gruss { flex-direction: column; align-items: flex-start; gap: 3px; }
  .neu .kopf-fakten span { height: 22px; padding: 0 8px; font-size: 11.5px; }
}

@media (max-width: 1199px) {
  .ks-buehne {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
    grid-template-areas:
      "karte         karte"
      "verlauf       verlauf"
      "interessenten reichweite"
      "versand       wirkung"
      "eigentuemer   eigentuemer";
  }
  .ks-rechts-spalte { display: contents; }
}

@media (max-width: 900px) {
  .neu .inhalt { padding: 0 16px 20px; }
  
  .neu .kopf {
    position: relative;
    height: auto; flex-wrap: wrap; gap: 10px;
    margin: 0 -16px 20px; padding: 12px 16px;
  }
  .neu .kopf > .marke {
    display: grid; place-items: center;
    width: 36px; height: 36px; flex: none;
    border-radius: 10px; box-shadow: none;
    background: var(--n-blau-verlauf);
  }
  .neu .kopf > .marke img { width: 60%; height: auto; display: block; }
  .neu .kopf-rechts { order: 1; margin-left: auto; }
  .neu .gruss { order: 2; flex: 1 1 100%; flex-direction: column; align-items: flex-start; gap: 6px; }
  .neu .gruss h1 { font-size: 17px; white-space: normal; }
  .neu .kopf-fakten { flex-wrap: wrap; gap: 4px; }
  .neu .kopf-fakten span { height: 24px; padding: 0 9px; font-size: 12px; }
  
  .ks-zeitraum-text, .ks-zeitraum-pfeil, .ks-heute { display: none; }
  .ks-zeitraum > summary { width: 44px; padding: 0; justify-content: center; }
  .ks-zeitraum { position: static; }
  .ks-zeitraum[open] > .ks-stichtag { left: 16px; right: 16px; width: auto; grid-template-columns: minmax(0, 1fr); }
  .ks-stichtag > input[type="date"],
  .ks-stichtag .dwahl { width: 100%; }

  .ks-buehne {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "karte" "interessenten" "verlauf" "versand" "wirkung" "reichweite" "eigentuemer";
  }
  .ks-karte-kopf { flex-wrap: wrap; }
  .ks-legende { margin-left: 0; width: 100%; }
}

@media (max-width: 560px) {
  .ks-karte { padding: 16px; }
  .ks-gross { font-size: 28px; }
  .ks-saeulen { gap: min(2px, 60px / var(--n, 30)); height: 120px; }
  .ks-saeulen-y { height: 120px; }
  .ks-karte-chip.ks-unten { display: none; }
  .ks-karte-feld { --massstab: .6; }
  .ks-karte-chip { height: 22px; padding: 0 8px; font-size: 11px; }
  .ks-karte-chip.ks-oben { top: 8px; left: 8px; }
}

@media (pointer: coarse), (max-width: 900px) {
  .neu .rundknopf,
  .neu .rundknopf.rundknopf-as { width: 44px; height: 44px; }
  .neu .leiste .sym { min-height: 44px; }
  .ks-knopf, .ks-knopf-umriss { min-height: 44px; }
  .ks-knopf.ks-klein, .ks-knopf-umriss.ks-klein { height: 44px; padding: 0 15px; }
  .ks-zeitraum > summary { height: 44px; }
  .ks-stichtag input[type="date"],
  .ks-stichtag .dwahl-knopf { height: 44px; font-size: 16px; }
}

.neu .designkarte {
  display: flex; flex-direction: column; justify-content: flex-start; align-items: stretch;
  border: 1px solid var(--n-linie); border-radius: var(--n-rund);
}
.neu .designkarte > .designbuehne { flex: none; }
.neu .designkarte:hover { transform: none; border-color: var(--n-blau-linie); box-shadow: 0 6px 18px rgb(16 24 40 / .06); }
.neu .designkarte--gewaehlt,
.neu .designkarte--gewaehlt:hover { border-color: var(--n-blau); box-shadow: 0 0 0 3px var(--n-blau-flaeche); }
.neu .designtipp {
  background: var(--n-blau-flaeche); color: var(--n-blau-tief);
  box-shadow: inset 0 0 0 1px var(--n-blau-linie);
  font-size: 10.5px; letter-spacing: .1em;
}
.neu .designhaken { background: var(--n-blau-voll); box-shadow: 0 0 0 3px #fff; }
.neu .designbuehne { background: var(--n-flaeche); border-bottom-color: var(--n-linie); }
.neu .designtext b { font-size: 14.5px; font-weight: 650; letter-spacing: -.01em; }
.neu .designsatz { font-size: 12.5px; color: var(--n-leise); }
.neu .designmerkmale span { background: var(--n-flaeche); color: var(--n-leise); font-size: 11.5px; font-weight: 600; }
.neu .designkarte--wunsch { background: var(--n-feld); border-style: dashed; }
.neu .designkarte--wunsch .designbuehne { background: var(--n-feld); }
.neu .designpreis { background: var(--n-blau-flaeche); color: var(--n-blau-tief); }
.neu .designvorschau {
  border-radius: 9px; background: #fff; color: var(--n-tinte);
  box-shadow: inset 0 0 0 1px var(--n-linie);
}
.neu .designvorschau:hover { color: var(--n-blau-tief); background: var(--n-feld); box-shadow: inset 0 0 0 1px var(--n-blau-linie); }
.neu .wunschbox { border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein); background: var(--n-feld); box-shadow: none; }
.neu .designfuss { border-top-color: var(--n-linie-fein); }

.neu .pv-karte { padding: 20px 22px; }
.neu .pv-karte .karte-kopf h2 { font-size: 15.5px; }
.neu .pv-satz { font-size: 12.5px; color: var(--n-leise); }
.neu .pv-kacheln { gap: 8px; }
.neu .pv-kachel {
  padding: 8px 10px 8px 8px; border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein);
  background: #fff; transition: background-color var(--dauer) var(--kurve), border-color var(--dauer) var(--kurve);
}
.neu .pv-kachel:hover { background: var(--n-feld); }
.neu .pv-kachel.hervor { border-color: var(--n-blau-linie); background: var(--n-blau-flaeche); box-shadow: inset 3px 0 0 var(--n-blau); }
.neu .pv-bild { border-radius: 9px; }
.neu .pv-ohne-foto { background: var(--n-flaeche); color: var(--n-leise); }
.neu .pv-text .titel { font-weight: 600; color: var(--n-tinte); }
.neu .pv-text .unter { color: var(--n-leise); }
.neu .pv-text .pille { height: 20px; padding: 0 8px; font-size: 11px; }
.neu .pv-fass:hover .titel { color: var(--n-blau-tief); }
.neu .pv-kachel .griff { gap: 4px; }
.neu .pv-kachel .griff button:hover { background: var(--n-abzeichen); color: var(--n-tinte); }

.neu .pv-kachel .griff button,
.neu .vb-liste .objekt .griff button {
  width: 30px; height: 30px; min-height: 0; padding: 0;
  display: grid; place-items: center;
  border-radius: 8px; background: var(--n-flaeche); color: var(--n-leise);
}
@media (pointer: coarse) {
  .neu .pv-kachel .griff button,
  .neu .vb-liste .objekt .griff button { width: 38px; height: 38px; }
}
.neu .pv-kachel .griff .stern.an,
.neu .pv-kachel .griff .stern.an:hover { background: var(--n-blau-flaeche); color: var(--n-blau-tief); }

.neu .bestand-liste > .aufklapp { border-bottom-color: var(--n-linie-fein); }
.neu .objekt.knapp { border-bottom-color: var(--n-linie-fein); }

.neu .objekt.knapp .foto { border-radius: 9px; background-color: var(--n-flaeche); grid-template-rows: 100%; overflow: hidden; }
.neu .objekt.knapp .titel { font-weight: 600; }
.neu .aufklapp-zeichen { background: var(--n-blau-flaeche); color: var(--n-blau); }

.neu .ob-uebersicht { margin-bottom: 0; }
.ob-satz { margin: -4px 0 0; max-width: 78ch; font-size: 13px; line-height: 1.55; color: var(--n-leise); }
.neu .ob-bilanz { color: var(--n-gelb-text); }
.neu .ob-uebersicht .ks-abschnitt-kopf .knopf-reihe { margin: 0; }
.neu .karte.ob-karte { border: 1px solid var(--n-linie); border-radius: var(--n-rund); box-shadow: none; }
.neu .karte.ob-karte.hervor { border-color: var(--n-blau-linie); box-shadow: inset 3px 0 0 var(--n-blau); }
.neu .ob-kopf { padding: 16px 22px; background: #fff; border-bottom-color: var(--n-linie-fein); }
.neu .ob-nummer {
  width: 28px; height: 28px; border-radius: 9px;
  background: var(--n-blau-flaeche); color: var(--n-blau-tief); box-shadow: inset 0 0 0 1px var(--n-blau-linie);
  font-size: 12.5px; font-variant-numeric: tabular-nums;
}
.neu .ob-titelzeile h3 { font-size: 14.5px; font-weight: 650; letter-spacing: -.01em; }
.neu .ob-ort { color: var(--n-leise); }
.neu .ob-preis { font-size: 17px; font-weight: 700; letter-spacing: -.02em; color: var(--n-tinte); font-variant-numeric: tabular-nums; }
.neu .ob-rumpf { gap: 16px 22px; padding: 18px 22px 20px; }
.neu .ob-titelbild, .neu .ob-kein-foto { border-radius: var(--n-rund-klein); }
.neu .ob-kein-foto { border-color: var(--n-linie); background: var(--n-feld); }
.neu .ob-fotozahl { font-size: 12px; color: var(--n-leise); }
.neu .ob-daten { gap: 10px; }
.neu .ob-block { padding: 12px 14px; border-radius: var(--n-rund-klein); background: var(--n-feld); border: 1px solid var(--n-linie-fein); }
.neu .ob-block .beschriftung {
  margin-bottom: 6px;
  font-size: 11.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--n-leise);
}
.neu .ob-text { font-size: 13px; color: var(--n-tinte); }
.neu .ob-leerzeile { border-left: 0; padding-left: 0; font-size: 12.5px; color: var(--n-leise); }
.neu .ob-fakt { background: #fff; box-shadow: inset 0 0 0 1px var(--n-linie); color: var(--n-leise); }
.neu .ob-fakt b { color: var(--n-tinte); }
.neu .ob-fakt.leer { border-color: var(--n-linie); box-shadow: none; background: transparent; }
.neu .ob-fuss { padding-top: 12px; border-top-color: var(--n-linie-fein); font-size: 12.5px; color: var(--n-leise); }
.neu .ob-fussfeld .label { color: var(--n-leise); }
.neu .ob-fussfeld > :not(.label) { color: var(--n-tinte); }
.neu .ob-fehlt { color: var(--n-leise); }

.neu .var-knopf { font-family: inherit; font-weight: 600; font-size: 12px; border-radius: 999px; padding: 4px 10px; }
.neu .var-label { color: var(--n-leise); }
.neu .postfach { background: var(--n-feld); border-color: var(--n-linie); border-radius: var(--n-rund-klein); padding: 14px; }
.neu .postfach .kreis { background: var(--n-blau-flaeche); color: var(--n-blau-tief); }
.neu .pf-von { font-weight: 650; }
.neu .pf-leer { color: var(--n-leise); }
.neu .pille.pf-eng { background: var(--n-gelb-flaeche); color: var(--n-gelb-text); }
.neu .ns-kopf { font-size: 11.5px; font-weight: 600; letter-spacing: .06em; color: var(--n-leise); }
.neu .ns-karte { background: var(--n-feld); border: 1px solid var(--n-linie); border-left: 3px solid var(--n-blau); }
.neu .ns-karte .kreis { background: var(--n-blau-flaeche); color: var(--n-blau-tief); }
.neu .feld-marke.fehlt { background: var(--n-schlecht-flaeche); color: #b3122f; }
.neu .feld-marke.rat { background: var(--n-gelb-flaeche); color: var(--n-gelb-text); }
.neu .feld-marke.ki { background: var(--n-blau-flaeche); color: var(--n-blau-tief); }
.neu .feld.braucht input[type=text] { border-color: var(--n-gelb-linie); background: #fffdf5; }
.neu .pv-objektwahl .knopf-reihe { gap: 8px; }

.neu .live-spalte .karte-kopf .knopf-reihe[role=group] {
  gap: 2px; padding: 3px; border-radius: 11px; background: var(--n-flaeche); margin: 0;
}
.neu .live-spalte .karte-kopf .knopf-reihe[role=group] .knopf {
  border: 0; background: transparent; color: var(--n-leise); box-shadow: none;
}
.neu .live-spalte .karte-kopf .knopf-reihe[role=group] .knopf:hover { color: var(--n-tinte); background: rgb(255 255 255 / .6); }
.neu .live-spalte .karte-kopf .knopf-reihe[role=group] .knopf[aria-current] {
  background: #fff; color: var(--n-blau-tief); box-shadow: 0 1px 2px rgb(16 24 40 / .08), inset 0 0 0 1px var(--n-linie);
}
.neu .live-spalte .mailrahmen { border-radius: var(--n-rund-klein); }

.neu .live-spalte > .karte-kopf { flex-wrap: wrap; row-gap: 8px; }
.neu .live-spalte > .karte-kopf h2,
.neu .live-spalte > .karte-kopf .klick-hinweis { white-space: nowrap; }

.neu .befund { border-bottom-color: var(--n-linie-fein); }
.neu .befund .zeichen { width: 22px; height: 22px; font-size: 11.5px; }
.neu .befund.gut .zeichen { background: var(--n-gut-flaeche); color: var(--n-gut-text); }
.neu .befund.warn .zeichen { background: var(--n-gelb-flaeche); color: var(--n-gelb-text); box-shadow: inset 0 0 0 1px var(--n-gelb-linie); }
.neu .befund.schlecht .zeichen { background: var(--n-schlecht-flaeche); color: #b3122f; }
.neu .befund .satz { font-weight: 600; color: var(--n-tinte); }
.neu .befund .dazu { color: var(--n-leise); }

.neu details.baustein, .neu details.region { border-bottom-color: var(--n-linie-fein); }
.neu details.baustein > summary .name, .neu details.region > summary .name { font-weight: 650; }
.neu .schritt-verweise {
  margin: 0; padding: 14px 18px; gap: 8px 28px;
  border: 1px solid var(--n-linie); border-radius: var(--n-rund); background: #fff;
}
.neu .schritt-verweise .wozu { flex-basis: 100%; font-size: 11.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--n-leise); }
.neu .schritt-verweise a { color: var(--n-blau-tief); }

.neu .vb-liste .objekt { border-bottom-color: var(--n-linie-fein); }
.neu .vb-liste .objekt .foto { border-radius: var(--n-rund-klein); background-color: var(--n-flaeche); color: var(--n-leise); }
.neu .vb-liste .objekt .titel { font-weight: 650; }
.neu .vb-liste .objekt .preis { color: var(--n-tinte); }

.neu .vb-liste .objekt .preis svg { display: none; }
.neu .vb-liste .objekt .griff button:hover { background: var(--n-abzeichen); color: var(--n-tinte); }

.neu .typwahl button {
  border: 1px solid var(--n-linie); border-radius: var(--n-rund); box-shadow: none; padding: 22px;
  font-weight: 400; color: var(--n-tinte);
  transition: border-color var(--dauer) var(--kurve), background-color var(--dauer) var(--kurve);
}
.neu .typwahl button:hover { transform: none; border-color: var(--n-blau-linie); background: var(--n-feld); }
.neu .typwahl button h3 { font-size: 15.5px; font-weight: 650; letter-spacing: -.01em; }
.neu .typwahl button p { color: var(--n-leise); font-size: 13px; }

.neu .karte.rang-haupt { border-left: 1px solid var(--n-linie); }

:where(.ks-mailbau .ks-abschnitt) > .meldung { margin: 0; }

@media (max-width: 700px) {
  .neu .ob-kopf { padding: 14px 16px; }
  .neu .ob-rumpf { padding: 16px; }
  .neu .pv-karte { padding: 16px; }
  .neu .schritt-verweise { padding: 14px 16px; }
}

.ks-mailbau { display: flex; flex-direction: column; gap: 32px; min-width: 0; }
:where(.ks-mailbau, .ks-mailbau > .ks-abschnitt, .ks-mailbau > form,
       .ks-mailbau > .ks-abschnitt > form, .ks-mailbau > form > .ks-abschnitt) > .reihe { margin-bottom: 0; }
:where(.ks-mailbau, .ks-mailbau > form) > .knopf-reihe { margin-top: 0; }
:where(.ks-mailbau) > form { display: flex; flex-direction: column; gap: 32px; min-width: 0; }
.ks-abschnitt-kopf .ks-etikett-zusatz { font-size: 12.5px; color: var(--n-leise); }

.ks-spalten-stapel { display: flex; flex-direction: column; gap: 28px; min-width: 0; }

.neu .vorlagenwahl .karte-kopf .sym { background: var(--n-blau-verlauf); border-radius: 10px; }
.neu .vorlagen-vorschau {
  gap: 20px; padding: 18px 20px;
  border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein);
  background: var(--n-feld);
}
.neu .vv-blatt img { box-shadow: 0 0 0 1px var(--n-linie); }
.neu .vv-marke { font-size: 11px; letter-spacing: .12em; color: var(--n-leise); }
.neu .vv-headline { font-size: 17px; font-weight: 650; letter-spacing: -.015em; color: var(--n-tinte); }
.neu .vv-liste li::marker { color: var(--n-blau); }

.neu .vv-jetzt {
  padding: 12px 16px; border: 1px solid var(--n-blau-linie); border-radius: var(--n-rund-klein);
  background: var(--n-blau-flaeche); color: var(--n-tinte);
}
.neu .vv-jetzt-marke { color: var(--n-blau-tief); }

.ks-baustein {
  margin-bottom: 12px; padding: 16px 18px;
  border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein);
  background: var(--n-feld);
}
.ks-baustein > .ks-klein-etikett { margin-bottom: 12px; }
.ks-baustein > .feld:last-child { margin-bottom: 0; }
.neu .ks-baustein .feld input[type=text], .neu .ks-baustein .feld textarea { background: #fff; }
.ks-baustein .bild-buehne { background: #fff; }
.ks-baustein > .knopf-reihe { margin-top: 10px; }
.ks-punkte-kopf { margin: 14px 0 8px; }
.ks-punkt { margin-bottom: 10px; padding-left: 12px; border-left: 2px solid var(--n-blau-linie); }

.ks-wahl-frage { margin: 4px 0 8px; }
.ks-wahlliste { display: flex; flex-direction: column; margin: 0 -10px 10px; }
.ks-wahlzeile {
  width: auto; margin: 0; min-height: 64px;
  border-left: 0; border-right: 0; border-bottom: 0; background: none;
  font: inherit; color: inherit; text-align: left;
}
button.ks-wahlzeile { cursor: pointer; }
button.ks-wahlzeile:focus-visible { outline-offset: -2px; }
.ks-wahlliste > .ks-katalog-gruppe { padding: 16px 12px 6px; }
.ks-wahl-deckel {
  width: 36px; height: 50px; flex: none;
  display: grid; place-items: center; overflow: hidden;
  border-radius: 6px; background: var(--n-blau-flaeche); color: var(--n-blau);
  box-shadow: 0 0 0 1px var(--n-linie);
}
.ks-wahl-deckel img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ks-wahl-deckel svg { width: 18px; height: 18px; }
.ks-wahl-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ks-wahl-titel { font-size: 14.5px; font-weight: 650; letter-spacing: -.01em; }
.ks-wahl-unter { font-size: 12.5px; color: var(--n-leise); }
.ks-wahl-aus .ks-wahl-titel { color: var(--n-leise); font-weight: 600; }
.ks-wahl-aus .ks-wahl-deckel { background: var(--n-flaeche); color: var(--n-leise); }
.ks-wahl-aus:hover { background: none; }
.ks-wahl-aus:hover::before { opacity: 0; }

.ks-ablauf {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px;
  margin: 0 0 14px; padding: 0; list-style: none; counter-reset: ks-ablauf;
}
.ks-ablauf > li {
  counter-increment: ks-ablauf;
  padding: 14px 16px; border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein);
  background: var(--n-feld); font-size: 13px; line-height: 1.55; color: var(--n-leise);
}
.ks-ablauf > li::before {
  content: counter(ks-ablauf);
  display: grid; place-items: center; width: 24px; height: 24px; margin-bottom: 10px;
  border-radius: 8px; background: var(--n-blau-flaeche); color: var(--n-blau-tief);
  font-size: 12px; font-weight: 700;
}
.ks-ablauf b { color: var(--n-tinte); font-weight: 650; }

.ks-stadtteile { gap: 12px; margin-bottom: 14px; }
.ks-stadtteile .kachel.haken {
  position: relative; align-items: center; gap: 12px; margin: 0;
  padding: 14px 44px 14px 14px;
  background: #fff; box-shadow: none;
  border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein);
  transition: background-color var(--dauer) var(--kurve), border-color var(--dauer) var(--kurve);
}
.ks-stadtteile .kachel.haken:hover { background: var(--n-feld); border-color: var(--n-blau-linie); }
.ks-stadtteile .kachel.haken:has(input:checked) { background: var(--n-blau-flaeche); border-color: var(--n-blau-linie); }
.ks-stadtteile .kachel.haken .text { min-width: 0; }
.ks-stadtteile .kachel.haken .text b { font-weight: 650; color: var(--n-tinte); }
.ks-stadtteile .kachel.haken .text .dazu { margin-top: 2px; }
.ks-stadtteile .kachel.haken .dazu .pille { margin-top: 4px; }

.ks-stadtteile .kachel.haken .text > .pille { background: #fff; color: var(--n-blau-tief); box-shadow: inset 0 0 0 1px var(--n-blau-linie); }
:is(.ks-stadtteile .kachel.haken, .ks-objektwahl .haken) input {
  -webkit-appearance: none; appearance: none;
  display: grid; place-items: center; flex: none;
  width: 20px; height: 20px; margin: 0;
  border: 1.5px solid #c3c8d1; border-radius: 6px; background: #fff;
  cursor: pointer;
  transition: background-color var(--dauer) var(--kurve), border-color var(--dauer) var(--kurve);
}
.ks-stadtteile .kachel.haken input { position: absolute; top: 12px; right: 12px; }
:is(.ks-stadtteile .kachel.haken, .ks-objektwahl .haken) input::after {
  content: ''; width: 9px; height: 5px; margin-top: -2px;
  border: 2px solid #fff; border-top: 0; border-right: 0;
  transform: rotate(-45deg); opacity: 0;
}
:is(.ks-stadtteile .kachel.haken, .ks-objektwahl .haken) input:checked { background: var(--n-blau-voll); border-color: var(--n-blau-voll); }
:is(.ks-stadtteile .kachel.haken, .ks-objektwahl .haken) input:checked::after { opacity: 1; }
:is(.ks-stadtteile .kachel.haken, .ks-objektwahl .haken) input:focus-visible { outline: 2px solid var(--n-blau); outline-offset: 2px; }

.ks-stadtteil-block > .karte-kopf { margin-bottom: 12px; }
.ks-stadtteil-block > .karte-kopf h2 { font-size: 14.5px; font-weight: 650; }
.ks-stadtteil-block .kacheln { gap: 8px; grid-template-columns: minmax(0, 1fr); }
.ks-objektwahl {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 10px 12px; background: #fff; box-shadow: none;
  border: 1px solid var(--n-linie); border-radius: 10px;
}
.ks-objektwahl:has(input:checked) { border-color: var(--n-blau-linie); }
.ks-objektwahl .haken { display: flex; margin: 0; align-items: center; min-width: 0; }
.ks-objektwahl .knopf-reihe { margin: 0; flex-wrap: nowrap; gap: 6px; }

.neu .anlass-baustein {
  margin-bottom: 12px; padding: 14px 16px 16px;
  border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein);
  background: var(--n-feld);
}
.neu .anlass-baustein > .karte-kopf { margin-bottom: 10px; min-height: 28px; }
.neu .anlass-baustein > .karte-kopf h2 { font-size: 14.5px; font-weight: 650; }
.neu .anlass-baustein :is(input[type=text], textarea, select) { background: #fff; }
.neu .anlass-baustein .pv-kachel { background: #fff; }

.ks-einzel-objekt .objekt { padding-top: 4px; }
.ks-einzel-objekt .objekt .foto { grid-template-rows: 100%; overflow: hidden; border-radius: var(--n-rund-klein); }
.ks-einzel-objekt .objekt .titel { font-weight: 650; }

.ev-raster { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 16px; }
.ev-karte {
  display: flex; flex-direction: column; margin: 0; overflow: hidden;
  background: #fff; border: 1px solid var(--n-linie); border-radius: var(--n-rund);
  transition: border-color var(--dauer) var(--kurve);
}
.ev-karte:hover { border-color: var(--n-blau-linie); }
.ev-karte .ev-bild { height: 150px; display: grid; place-items: center; background: var(--n-flaeche); color: var(--n-leise); font-size: 12px; }
.ev-karte .ev-bild img { display: block; width: 100%; height: 150px; object-fit: cover; }
.ev-karte .ev-text { flex: 1; display: flex; flex-direction: column; gap: 4px; padding: 14px 16px 16px; }
.ev-karte b { font-size: 14.5px; font-weight: 650; line-height: 1.3; letter-spacing: -.01em; }
.ev-karte small { font-size: 12.5px; color: var(--n-leise); }
.ev-karte .ev-preis { font-size: 14px; font-weight: 700; color: var(--n-blau-tief); font-variant-numeric: tabular-nums; }
.ev-karte .ev-art { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.ev-karte fieldset {
  display: flex; flex-direction: column; gap: 6px; margin: 8px 0 0; padding: 10px 12px;
  border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein); background: var(--n-feld);
  font-size: 13px;
}
.ev-karte legend { float: left; width: 100%; margin-bottom: 4px; padding: 0; font-size: 12px; font-weight: 600; }
.ev-karte fieldset label { display: flex; align-items: center; gap: 8px; min-height: 28px; cursor: pointer; }
.ev-karte .ev-gemeinschaft {
  display: none; margin: 6px 0 0; padding: 8px 10px; border-radius: 10px;
  background: var(--n-gelb-flaeche); color: var(--n-gelb-text); font-size: 12px; line-height: 1.45;
}

.ev-karte.ev-fremd .ev-gemeinschaft,
.ev-karte:has(input[value="gemeinschaft"]:checked) .ev-gemeinschaft { display: block; }
.ev-karte .ev-fuss { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: auto; padding-top: 12px; }
.ev-karte .ev-fuss > * { white-space: nowrap; }
.ev-karte .ev-duenn {
  padding: 3px 9px; border-radius: 999px; background: var(--n-gelb-flaeche); color: var(--n-gelb-text);
  font-size: 11.5px; font-weight: 600;
}
.ev-leer .hilfe { margin: 0; }

.ks-aus-plan .ks-karte { max-width: 720px; }
.ks-aus-plan .ks-felder { margin: 4px 0 14px; }
.ks-aus-plan-satz { margin: 0 0 16px; font-size: 13.5px; line-height: 1.55; color: var(--n-leise); }
.ks-aus-plan .knopf-reihe { margin: 0; }

.ks-aus-plan .ks-feld-wert { margin-top: 3px; font-size: 14.5px; line-height: 1.4; white-space: normal; overflow-wrap: anywhere; }

:where(.ks-mailbau) .hilfe { font-size: 12.5px; line-height: 1.5; color: var(--n-leise); }
.ks-wahlliste + .hilfe { margin: 0 0 14px; }

@media (max-width: 700px) {
  .ks-mailbau, :where(.ks-mailbau) > form { gap: 24px; }
  .ks-ablauf { grid-template-columns: minmax(0, 1fr); }
}

.va-seite { display: flex; flex-direction: column; gap: 32px; min-width: 0; }
:where(.va-seite, .va-seite > .ks-abschnitt, .va-seite > form) > .reihe { margin-bottom: 0; }
:where(.va-seite, .va-seite > .ks-abschnitt) > :is(.meldung, .schritt-fuehrung, .schritte) { margin: 0; }
.va-seite .ks-abschnitt-kopf > .ks-pille { flex: none; }

.neu .kontingent {
  margin: 0; padding: 20px 22px;
  background: #fff; border: 1px solid var(--n-linie); border-radius: var(--n-rund);
  box-shadow: none;
}
.neu .kontingent + .kontingent { margin-top: 16px; }
.neu .kontingent-kopf { display: flex; align-items: baseline; gap: 12px; margin-bottom: 12px; }
.neu .kontingent-kopf > span:first-child { font-size: 14.5px; font-weight: 600; letter-spacing: -.01em; color: var(--n-tinte); }
.neu .kontingent-kopf .weg { flex: 1; }
.neu .kontingent-wert { font-size: 14.5px; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; color: var(--n-tinte); }
.neu .kontingent > .balken { height: 8px; border-radius: 999px; background: var(--n-flaeche); overflow: hidden; }
.neu .kontingent > .balken .fuellung {
  height: 100%; border-radius: inherit;
  background: linear-gradient(90deg, var(--n-blau-tief) 0%, var(--n-blau) 100%);
}
.neu .kontingent.eng > .balken .fuellung { background: var(--n-schlecht); }
.neu .kontingent.eng .kontingent-wert { color: var(--n-schlecht); }
.neu .kontingent-dazu { margin: 12px 0 0; font-size: 12.5px; line-height: 1.55; color: var(--n-leise); }
.neu .kontingent-sprung {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px;
  margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--n-linie-fein);
  font-size: 12.5px; line-height: 1.55; color: var(--n-leise);
}
.neu .kontingent-sprung b { color: var(--n-tinte); font-weight: 600; }
.neu .kontingent-tag {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px;
  margin-top: 14px; padding-top: 16px; border-top: 1px solid var(--n-linie-fein);
}
.neu .kontingent-tag > .klein { font-size: 12.5px; line-height: 1.55; color: var(--n-leise); }

.va-liste { padding: 4px 22px 18px; }
.va-zeile {
  display: grid; grid-template-columns: minmax(0, 1fr) auto auto;
  grid-template-areas: "text zahl stand" "knoepfe knoepfe knoepfe";
  align-items: center; gap: 10px 22px;
  padding: 16px 0;
}
.va-zeile + .va-zeile { border-top: 1px solid var(--n-linie-fein); }
.va-zeile-text { grid-area: text; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.va-zeile-titel { font-size: 14.5px; font-weight: 600; letter-spacing: -.01em; line-height: 1.4; }
.va-zeile-titel .pille { margin-left: 6px; vertical-align: 1px; }
.va-zeile-unter { font-size: 12.5px; color: var(--n-leise); }
.va-zeile-unter .stark { color: var(--n-tinte); font-weight: 600; }
.va-zeile-text > .meldung { margin: 8px 0 0; }
.va-zeile-stand { grid-area: stand; justify-self: end; }
.va-zeile-zahl { grid-area: zahl; display: flex; flex-direction: column; align-items: flex-end; line-height: 1.15; }
.va-zeile-zahl b { font-size: 20px; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.va-zeile-zahl span { font-size: 11.5px; color: var(--n-leise); }
.neu .va-zeile-knoepfe { grid-area: knoepfe; margin: 0; flex-wrap: wrap; gap: 8px; }
.va-zeile-knoepfe form { margin: 0; }
.va-liste > .ks-meta { margin-top: 2px; }

.va-erledigt { grid-template-areas: "text zahlen stand"; }
.va-zahlen { grid-area: zahlen; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.va-zahlen span {
  display: inline-flex; align-items: baseline; gap: 4px;
  padding: 5px 10px; border-radius: 8px; background: var(--n-flaeche);
  font-size: 12px; color: var(--n-leise); white-space: nowrap;
}
.va-zahlen b { font-size: 14px; font-weight: 700; color: var(--n-tinte); font-variant-numeric: tabular-nums; }
.va-gruende { margin-top: 6px; font-size: 12px; line-height: 1.55; color: var(--n-leise); }
.va-gruende > div { color: var(--n-tinte); }

.va-laeuft .meldung { margin: 14px 0 0; }
.va-fortschritt { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 14px; margin: 14px 0 12px; }
.va-fortschritt .ks-gross { margin: 0; }
.va-felder { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 16px; }
.va-laeuft .va-gruende { margin-top: 12px; }
.neu .va-fuss { margin: 16px 0 0; padding-top: 14px; border-top: 1px solid var(--n-linie-fein); }
.va-fuss form { margin: 0; }

.neu .kal-eintrag { border-left-width: 0; border-radius: 10px; padding: 8px 12px; box-shadow: inset 0 0 0 1px rgb(16 24 40 / .05); }
.neu .kal-eintrag.geplant { background: var(--n-blau-flaeche); color: var(--n-blau-tief); box-shadow: inset 0 0 0 1px var(--n-blau-linie); }
.neu .kal-eintrag.wartet { background: var(--n-gelb-flaeche); color: var(--n-gelb-text); box-shadow: inset 0 0 0 1px var(--n-gelb-linie); }
.neu .kal-eintrag.laeuft { background: var(--n-blau-voll); color: #fff; }
.neu .kal-eintrag.fertig { background: var(--n-gut-flaeche); color: var(--n-gut-text); }
.neu .kal-eintrag.gestoppt { background: var(--n-schlecht-flaeche); color: #b3122f; }
.neu .kal-punkt { border-radius: 50%; }
.neu .kal-punkt.laeuft { background: var(--n-blau-voll); }
.neu .kal-aendern { border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein); background: #fff; box-shadow: none; }
.neu .kal-aendern > summary { gap: 10px; }
.neu .kal-aendern > summary:hover { background: var(--n-feld); }
.neu .kal-leiste h2 { font-size: 15px; font-weight: 650; letter-spacing: -.01em; }

.va-kennzahlen { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.va-kennzahl .ks-gross { margin-top: 8px; }
.va-kennzahl.va-haupt { background: var(--n-blau-flaeche); border-color: var(--n-blau-linie); }
.va-kennzahl.va-haupt .ks-klein-etikett { color: var(--n-blau-tief); }
.va-kennzahl.va-haupt .ks-zahl-sym { background: #fff; }

.neu .schritte {
  display: flex; align-items: center; gap: 12px; margin: 0;
  padding: 14px 20px; border: 1px solid var(--n-linie); border-radius: var(--n-rund);
  background: #fff;
}
.neu .schritte .schritt { display: flex; align-items: center; gap: 10px; flex: none; }
.neu .schritte .punkt {
  width: 28px; height: 28px; flex: none;
  display: grid; place-items: center;
  border-radius: 50%; background: #fff; box-shadow: inset 0 0 0 1.5px var(--n-linie);
  font-size: 12.5px; font-weight: 700; color: var(--n-leise); font-variant-numeric: tabular-nums;
}
.neu .schritte .schritt.fertig .punkt { background: var(--n-gut-flaeche); color: var(--n-gut-text); box-shadow: none; }
.neu .schritte .schritt.jetzt .punkt { background: var(--n-blau-voll); color: #fff; box-shadow: none; }
.neu .schritte .name { font-size: 13.5px; font-weight: 600; color: var(--n-leise); white-space: nowrap; }
.neu .schritte .schritt.jetzt .name,
.neu .schritte .schritt.fertig .name { color: var(--n-tinte); }
.neu .schritte .strecke { flex: 1; min-width: 16px; height: 2px; border-radius: 2px; background: var(--n-linie); margin: 0; }

.neu .va-sperre {
  margin: 14px 0 16px; padding: 12px 14px; border-radius: var(--n-rund-klein);
  background: var(--n-gelb-flaeche); box-shadow: inset 0 0 0 1px var(--n-gelb-linie);
  font-size: 13px; line-height: 1.55; color: var(--n-gelb-text);
}
.neu .va-sperre a { color: var(--n-blau-tief); font-weight: 600; }

.va-seite .ks-abschnitt > .reihe + .reihe { margin-top: 0; }
.neu .va-freigabe .fg-zahlen { align-items: center; gap: 14px 28px; margin: 0 0 16px; }
.va-zahl-gross .ks-gross { margin: 6px 0 0; }
.neu .va-freigabe .fg-fakten { gap: 8px; }
.neu .va-freigabe .fg-fakten > span { padding: 6px 10px; border-radius: 8px; background: var(--n-flaeche); font-size: 12.5px; }
.neu .va-freigabe-knopf { margin: 18px 0 0; padding-top: 16px; border-top: 1px solid var(--n-linie-fein); }
.va-freigabe-knopf form { margin: 0; }
.va-zurueck { margin-top: 16px; }

.va-seite .tabelle .knopf-reihe { flex-wrap: nowrap; margin: 0; }
.va-seite .tabelle .knopf-reihe form { margin: 0; }

.neu .erinnern-kopf { margin: 0; box-shadow: none; border: 1px solid var(--n-linie); border-radius: var(--n-rund); }
.neu .erinnern-kopf .sym { background: var(--n-blau-flaeche); color: var(--n-blau); box-shadow: none; }
.neu .erinnern-person .wer .pille { display: inline-flex; width: auto; margin: 4px 0 0; }
.neu .erinnern-person .pille.warn { background: var(--n-gelb-flaeche); color: var(--n-gelb-text); }
.neu .erinnern-person img,
.neu .erinnern-person .ohne-bild { border-radius: 10px; }
.neu .erinnern-person .ohne-bild { background: var(--n-flaeche); color: var(--n-leise); }
.neu .erinnern-leer .rund { background: var(--n-blau-flaeche); color: var(--n-blau); }
.neu .erinnern-arbeit { margin: 0; }
.neu .vorschau-rahmen { border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein); background: var(--n-feld); }

.va-postfaecher { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.va-postfach .ks-felder { margin-top: 14px; }
.va-postfach .ks-balken { margin-top: 14px; }
.va-postfach.va-krank { border-color: #f3b4bf; }
.va-adresse { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.va-drei { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.va-drei .ks-feld { padding: 10px 12px; }
.va-drei .ks-feld-wert { font-size: 16px; }
.ks-feld-wert small { font-size: 12px; font-weight: 600; color: var(--n-leise); }
.va-summe { display: flex; flex-direction: column; background: var(--n-blau-flaeche); border-color: var(--n-blau-linie); }
.va-summe .ks-klein-etikett { color: var(--n-blau-tief); }
.va-summe .ks-gross { margin: 8px 0 6px; }
.va-summe .ks-karte-unter { margin-bottom: 14px; }
.va-weg { margin-top: auto; padding-top: 12px; border-top-color: var(--n-blau-linie); font-weight: 600; color: var(--n-blau-tief); text-decoration: none; }
.va-weg:hover { text-decoration: underline; }
.ka-leise { display: block; font-size: 11.5px; font-weight: 500; color: var(--n-leise); }
.ks-balken.ka-balken { height: 6px; max-width: 140px; margin-top: 6px; }

.neu .kip-impuls {
  border: 0; border-radius: var(--n-rund-klein);
  background: var(--n-flaeche); padding: 10px 14px;
}
.neu .kip-impuls.aus, .neu .kip-impuls.eng { background: #fff; box-shadow: inset 0 0 0 1px var(--n-linie); }
.neu .kip-impuls-monat { letter-spacing: .12em; color: var(--n-tinte); }
.neu .kip-impuls > select, .neu .kip-impuls > .wahl { flex: 0 1 340px; width: 340px; min-width: 0; }

.pe-karte { padding: 6px 22px; }
.pe-liste { display: flex; flex-direction: column; }
.pe-zeile + .pe-zeile { border-top: 1px solid var(--n-linie-fein); }
.pe-zeile summary {
  display: flex; align-items: center; gap: 12px; min-width: 0;
  min-height: 60px; padding: 10px 0; list-style: none; cursor: pointer;
}
.pe-zeile summary::-webkit-details-marker { display: none; }
.pe-zeile summary:hover .pe-betreff { color: var(--n-blau-tief); }
.pe-punkt { width: 8px; height: 8px; flex: none; border-radius: 50%; }
.pe-neu .pe-punkt { background: var(--n-blau); }
.pe-wer { width: 240px; flex: none; min-width: 0; }
.pe-wer b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; font-weight: 600; }
.pe-wer i { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-style: normal; font-size: 12px; color: var(--n-leise); }
.pe-neu .pe-wer b, .pe-neu .pe-betreff { font-weight: 700; }
.pe-betreff { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13.5px; transition: color var(--dauer) var(--kurve); }
.pe-zeit { flex: none; font-size: 12px; color: var(--n-leise); font-variant-numeric: tabular-nums; }
.pe-inhalt { padding: 2px 0 20px 20px; }
.pe-meta { margin-bottom: 6px; font-size: 12px; color: var(--n-leise); }
.pe-text { max-width: 720px; font-size: 13.5px; line-height: 1.6; white-space: pre-wrap; word-break: break-word; }
.pe-eigene {
  max-width: 700px; margin: 14px 0 0 22px; padding: 12px 14px;
  border-radius: var(--n-rund-klein); background: var(--n-blau-flaeche); box-shadow: inset 0 0 0 1px var(--n-blau-linie);
}
.pe-antwort { max-width: 720px; margin-top: 16px; }
.pe-antwort textarea { display: block; width: 100%; min-height: 96px; margin-bottom: 10px; resize: vertical; }
.neu .pe-senden { margin: 0; flex-wrap: wrap; align-items: center; gap: 10px; }
.pe-von { margin-left: auto; font-size: 12px; color: var(--n-leise); }

.pk-karte, .pk-leer { padding: 20px 22px; }
.neu .pk-kopf h2, .neu .pk-leer h2 { font-size: 15px; font-weight: 650; letter-spacing: -.01em; }
.neu .pk-leer p { margin: 8px 0 0; font-size: 13.5px; line-height: 1.6; }
.neu .pk-leer form { margin-top: 14px; }
.neu .pk-liste li { border-top-color: var(--n-linie-fein); }
.neu .pk-liste li:last-child { border-bottom: 0; }
.neu .pk-foto { border-radius: 10px; background: var(--n-flaeche); }
.neu .pk-zahl b { font-size: 24px; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }

.st-verlauf { display: flex; flex-direction: column; gap: 14px; }
.st-nachricht { display: flex; align-items: flex-start; gap: 10px; max-width: 760px; }
.st-nachricht.st-du { flex-direction: row-reverse; align-self: flex-end; }
.st-kreis {
  width: 32px; height: 32px; flex: none;
  display: grid; place-items: center; border-radius: 10px;
  background: var(--n-blau-verlauf); color: #fff;
  font-size: 11.5px; font-weight: 700;
}
.st-du .st-kreis { background: var(--n-flaeche); color: var(--n-leise); }
.st-blase { min-width: 0; padding: 10px 14px; border-radius: var(--n-rund-klein); background: var(--n-feld); box-shadow: inset 0 0 0 1px var(--n-linie); }
.st-du .st-blase { background: var(--n-blau-flaeche); box-shadow: inset 0 0 0 1px var(--n-blau-linie); }
.st-name { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; color: var(--n-leise); }
.st-text { margin-top: 3px; font-size: 13.5px; line-height: 1.55; white-space: pre-wrap; word-break: break-word; }
.st-quellen { margin-top: 6px; font-size: 12px; color: var(--n-leise); word-break: break-all; }
.neu .st-warte { margin: 16px 0 0; }
.neu .st-weiter { margin-top: 16px; }
.st-senden { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--n-linie-fein); }

.neu .einbettung-karte { border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein); background: var(--n-feld); box-shadow: none; }
.neu .einbettung-karte img { border-radius: 10px; }

@media (max-width: 1100px) {
  .va-kennzahlen { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  .va-seite { gap: 24px; }
  .va-liste { padding: 2px 16px 14px; }
  .va-zeile, .va-erledigt {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "text text" "zahl stand" "knoepfe knoepfe";
  }
  .va-erledigt { grid-template-areas: "text text" "zahlen stand"; }
  .va-zeile-zahl { flex-direction: row; align-items: baseline; gap: 6px; justify-self: start; }
  .va-zahlen { justify-content: flex-start; }
  .va-felder { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .va-kennzahlen { gap: 10px; }
  .va-kennzahl { padding: 14px 16px; }
  .va-kennzahl .ks-gross { font-size: 26px; }
  .neu .schritte { padding: 12px 14px; gap: 8px; }
  .neu .schritte .schritt:not(.jetzt) .name { display: none; }
  .neu .kip-impuls { display: grid; grid-template-columns: minmax(0, 1fr); }
  .neu .kip-impuls > * { width: auto; min-width: 0; max-width: 100%; }
  .pe-karte { padding: 4px 16px; }
  .pe-wer { width: auto; flex: 1; }
  .pe-betreff { display: none; }
  .pe-inhalt { padding-left: 0; }
  .pe-eigene { margin-left: 0; }
}

.aw-gruppe { margin-bottom: 32px; }
.aw-gruppe:last-child { margin-bottom: 0; }
.aw-gruppe .ks-etikett .ks-abzeichen {
  height: 20px; margin-left: -6px; padding: 0 8px;
  font-size: 11.5px; letter-spacing: 0; text-transform: none;
  font-variant-numeric: tabular-nums;
}
.aw-kopf-weg {
  flex: none;
  font-size: 13px; font-weight: 600; color: var(--n-blau-tief); text-decoration: none;
}
.aw-kopf-weg:hover { text-decoration: underline; }

.aw-erklaerung { margin: -8px 0 0; font-size: 13px; line-height: 1.5; color: var(--n-leise); }
.aw-erklaerung b { color: var(--n-tinte); }
.aw-erklaerung a { color: var(--n-blau-tief); font-weight: 600; }
.aw-leise { color: var(--n-leise); }

.aw-leiste {
  display: flex; align-items: center; flex-wrap: wrap; gap: 12px 20px;
  margin-bottom: 28px;
}
.aw-leiste > .register { margin: 0; }
.neu .al-sortierung {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px 10px;
  margin: 0 0 0 auto;
  font-size: 13px; color: var(--n-leise);
}
.neu .al-hinweis { margin: 0 8px 0 0; color: var(--n-leise); }
.neu .al-wahl {
  display: inline-flex; gap: 2px; padding: 3px;
  border: 1px solid var(--n-linie); border-radius: var(--n-rund-knopf);
  background: var(--n-feld);
}
.neu .al-wahl a {
  display: inline-flex; align-items: center; height: 30px; padding: 0 12px;
  border-radius: 8px;
  font-size: 13px; font-weight: 600; color: var(--n-leise); text-decoration: none;
  transition: background-color var(--dauer) var(--kurve), color var(--dauer) var(--kurve);
}
.neu .al-wahl a:hover { color: var(--n-tinte); background: var(--n-flaeche); }
.neu .al-wahl a.an { background: var(--n-blau-flaeche); color: var(--n-blau-tief); box-shadow: inset 0 0 0 1px var(--n-blau-linie); }

.aw-hinweis {
  display: flex; align-items: center; flex-wrap: wrap; gap: 14px 16px;
  margin-bottom: 28px;
}
.aw-hinweis > .ks-zahl-sym { align-self: flex-start; }
.aw-hinweis-text { flex: 1 1 360px; min-width: 0; }
.aw-hinweis-text h3 { margin: 0 0 4px; font-size: 14.5px; font-weight: 600; }
.aw-hinweis-text p { margin: 0; font-size: 13px; line-height: 1.55; color: var(--n-leise); }
.aw-hinweis-text p + p { margin-top: 6px; }
.aw-hinweis-text strong { color: var(--n-tinte); }
.aw-hinweis > form { flex: none; margin: 0; }

.aw-liste {
  padding: 6px 0;
  background: #fff;
  border: 1px solid var(--n-linie); border-radius: var(--n-rund);
}
.neu .aw-liste > .al-zeile {
  margin: 0 8px; overflow: visible;
  background: transparent; border-radius: 12px; box-shadow: none;
  border-top: 1px solid var(--n-linie-fein);
}
.neu .aw-liste > .al-zeile:first-child,
.neu .aw-liste > .al-zeile[open] + .al-zeile,
.neu .aw-liste > .al-zeile:hover + .al-zeile { border-top-color: transparent; }
.neu .al-zeile::before { content: none; }
.neu .al-zeile > summary {
  position: relative;
  gap: 14px; padding: 12px 14px 12px 16px;
  border-radius: 12px;
}
.neu .al-zeile > summary::before {
  content: ''; position: absolute; left: 0; top: 14px; bottom: 14px;
  width: 3px; border-radius: 3px; background: var(--n-linie);
}
.neu .al-rueckruf > summary::before { background: var(--n-gut); }
.neu .al-objekt > summary::before { background: var(--n-blau); }
.neu .al-zeile > summary:hover { background: var(--n-blau-flaeche); }
.neu .al-zeile[open] > summary { background: var(--n-feld); border-radius: 12px 12px 0 0; }
.neu .al-erledigt > summary { opacity: 1; }
.neu .al-erledigt .al-mitte b,
.neu .al-erledigt .al-foto { opacity: .6; }
.neu .al-wann {
  flex: 0 0 96px;
  font-size: 12.5px; font-weight: 600; line-height: 1.35; color: var(--n-tinte);
  font-variant-numeric: tabular-nums;
}
.neu .al-wann span { font-size: 11.5px; font-weight: 500; color: var(--n-leise); }
.neu .al-foto { border-radius: 10px; background: var(--n-flaeche); }
.neu .al-foto.al-funnel { color: var(--n-blau); background: var(--n-blau-flaeche); }
.neu .al-mitte b { font-size: 15px; font-weight: 650; letter-spacing: -.01em; line-height: 1.35; }
.neu .al-obj { margin-top: 1px; font-size: 12.5px; color: var(--n-leise); }
.neu .al-passt { color: var(--n-gut-text); }
.neu .al-passt.teils { color: var(--n-gelb-text); }
.neu .al-fahne {
  flex: none;
  display: inline-flex; align-items: center; height: 24px; padding: 0 10px;
  border-radius: 999px;
  font-size: 12px; font-weight: 600;
}
.neu .al-fahne.jetzt { background: var(--n-gut-flaeche); color: var(--n-gut-text); }
.neu .al-fahne.signal { background: var(--n-blau-flaeche); color: var(--n-blau-tief); }
.neu .al-fahne.frist { background: var(--n-gelb-flaeche); color: var(--n-gelb-text); }
.neu .al-fahne.erledigt { background: var(--n-flaeche); color: var(--n-leise); }
.neu .al-pfeil { color: var(--n-leise); }
.neu .al-zeile > summary:hover .al-pfeil { color: var(--n-blau); }

.neu .al-tiefe {
  margin: 0 0 8px; padding: 4px 16px 16px;
  background: var(--n-feld); border-top: 0; border-radius: 0 0 12px 12px;
}
.neu .al-stand { padding-top: 6px; font-size: 12.5px; color: var(--n-leise); }
.neu .al-stand b { color: var(--n-tinte); }
.neu .al-spalten {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px; padding-top: 12px;
}
.neu .al-block {
  min-width: 0; padding: 14px 16px;
  background: #fff; border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein);
}
.neu .al-block h3 {
  margin: 0 0 10px;
  font-size: 11.5px; font-weight: 600; letter-spacing: .06em; color: var(--n-leise);
}
.neu .al-block p { font-size: 13.5px; line-height: 1.45; overflow-wrap: anywhere; }
.neu .al-block a { color: var(--n-blau-tief); }
.neu .al-leise, .neu .al-klein { color: var(--n-leise); }
.neu .al-fehlt { color: var(--n-gelb-text); }
.neu .al-nummer { font-size: 18px; font-weight: 700; letter-spacing: -.01em; color: var(--n-blau-tief); font-variant-numeric: tabular-nums; }
.neu .al-grossfoto { border-radius: 10px; background: var(--n-flaeche); }
.neu .al-treffer { color: var(--n-gut-text); }
.neu .al-kriterien li { font-size: 13px; color: var(--n-tinte); }
.neu .al-kriterien li.gut > span { color: var(--n-gut); }
.neu .al-kriterien li.knapp > span { color: var(--n-gelb-text); }
.neu .al-kriterien li.daneben { color: var(--n-leise); }
.neu .al-kriterien li.daneben > span { color: var(--n-linie); }
.neu .al-verlauf { font-size: 13px; color: var(--n-leise); }
.neu .al-verlauf b { color: var(--n-tinte); }

.aw-zeitleiste { list-style: none; margin: 0 0 8px; padding: 0; }
.aw-zeitleiste li {
  display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 8px;
  padding: 3px 0; font-size: 13px; color: var(--n-leise);
}
.aw-zeitleiste time { white-space: nowrap; font-variant-numeric: tabular-nums; }
.aw-zeitleiste li.aw-stark span { font-weight: 600; color: var(--n-tinte); }
.neu .al-tat { margin-top: 14px; align-items: flex-start; }

.neu .al-termin[open] { order: 10; flex-basis: 100%; }
.neu .al-termin[open] > form {
  display: grid; grid-template-columns: repeat(2, minmax(0, 200px)); gap: 0 12px;
  margin-top: 10px; padding: 4px 16px 14px;
  background: #fff; border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein);
}
.neu .al-termin[open] > form > .knopf-reihe { grid-column: 1 / -1; margin-top: 12px; }
@media (max-width: 560px) {
  .neu .al-termin[open] > form { grid-template-columns: minmax(0, 1fr); }
}

.neu .al-klickdaten {
  margin: 0; padding: 14px 18px;
  background: #fff; border: 1px solid var(--n-linie); border-radius: var(--n-rund);
  box-shadow: none;
  transition: background-color var(--dauer) var(--kurve), border-color var(--dauer) var(--kurve);
}
.neu .al-klickdaten:hover { transform: none; background: var(--n-blau-flaeche); border-color: var(--n-blau-linie); }
.neu .al-ikon { flex-basis: 36px; width: 36px; height: 36px; border-radius: 10px; background: var(--n-blau-flaeche); color: var(--n-blau); }
.neu .al-ikon svg { width: 17px; height: 17px; }
.neu .al-text b { font-size: 14.5px; font-weight: 600; letter-spacing: -.01em; }
.neu .al-text span { font-size: 12.5px; color: var(--n-leise); }
.neu .al-weiter { color: var(--n-blau); }

.aw-gruppe > .reihe { margin: 0; }
.aw-leer { padding: 8px 22px 22px; }
.neu .al-fahnen { flex: none; display: inline-flex; align-items: center; gap: 6px; }

.aw-verlauf-kopf { margin-bottom: 6px; }
.aw-zeitleiste li span b { margin-right: 4px; color: var(--n-blau-tief); }

@media (max-width: 700px) {
  .neu .al-sortierung { margin-left: 0; }
  .neu .al-hinweis { display: none; }
}

@media (pointer: coarse) {
  .neu .al-wahl a { height: 44px; }
  .aw-kopf-weg { display: inline-flex; align-items: center; min-height: 44px; }
}

@media (max-width: 560px) {
  .neu .aw-liste > .al-zeile { margin: 0 4px; }
  .neu .al-zeile > summary {
    display: grid; grid-template-columns: 52px minmax(0, 1fr) 16px;
    align-items: center; gap: 4px 12px;
    padding: 12px 10px 12px 14px;
  }
  .neu .al-zeile > summary > .al-foto { grid-column: 1; grid-row: 1 / span 3; align-self: start; width: 52px; height: 40px; }
  .neu .al-wann { grid-column: 2; grid-row: 1; display: flex; gap: 6px; font-size: 12px; }
  .neu .al-wann span { display: inline; font-size: 12px; }
  .neu .al-wann span::before { content: '· '; }
  .neu .al-mitte { grid-column: 2; grid-row: 2; }
  .neu .al-obj { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .neu .al-fahnen { grid-column: 2; grid-row: 3; flex-wrap: wrap; margin-top: 4px; }
  .neu .al-zeile > summary > .al-pfeil { grid-column: 3; grid-row: 1 / span 3; }
  .neu .al-tiefe { padding: 4px 10px 12px; }
}

.aw-gruppe .kamp-filter { margin: 0; gap: 10px 12px; }
.aw-gruppe .kamp-versteckt-hinweis { margin: -4px 0 0; color: var(--n-leise); }
.aw-gruppe .kamp-versteckt-hinweis a { color: var(--n-blau-tief); font-weight: 600; }
.kamp-tabelle td:first-child { min-width: 240px; }

.aw-gruppe .kamp-tabelle td.rechts > div.klein { white-space: normal; }
.neu .kamp-name { font-weight: 600; color: var(--n-tinte); }
.neu .kamp-name:hover { color: var(--n-blau-tief); }
.neu .kamp-anrufe { font-size: 15px; font-weight: 700; color: var(--n-leise); font-variant-numeric: tabular-nums; }
.neu .kamp-anrufe.hat { color: var(--n-blau-tief); }

.neu .kb-balken { height: 6px; background: var(--n-flaeche); }
.neu .kb-balken.laeuft i { background: var(--n-blau); }
.neu .kb-balken.fertig i { background: var(--n-gut); }
.neu .kb-balken.geplant { background: transparent; border-color: var(--n-linie); }
.neu .kb-text { color: var(--n-leise); }
.neu .kb-gruppe th {
  padding: 16px 0 8px;
  font-size: 11.5px; font-weight: 700; letter-spacing: .1em; color: var(--n-tinte);
  border-bottom-color: var(--n-linie);
}

.aw-gruppe .kamp-tabelle tr.kamp-folge td { background: var(--n-feld); }
.aw-gruppe .kamp-tabelle tr.kamp-folge td:first-child::before { border-color: var(--n-blau-linie); }
:where(.aw-gruppe, .aw-ratgeber) .pille.mail2 { background: var(--n-blau-flaeche); color: var(--n-blau-tief); }
:where(.aw-gruppe, .aw-ratgeber) .kb-balken.mail2 i { background: var(--n-blau-hell); }
.neu .kamp-verpasst { color: var(--n-schlecht); }
.aw-fussnote { margin: 0; font-size: 12.5px; line-height: 1.55; color: var(--n-leise); }
.aw-fussnote b { color: var(--n-tinte); }

.aw-gruppe .kamp-tabelle th.kamp-weg-kopf { position: relative; }

@media (max-width: 1280px) {
  .kamp-tabelle td:first-child { min-width: 180px; }
  .aw-gruppe .kamp-tabelle td:nth-child(3) { white-space: normal; min-width: 104px; }
  .aw-gruppe .kamp-tabelle th.rechts,
  .aw-gruppe .kamp-tabelle td.rechts,
  .aw-gruppe .kamp-tabelle td.rechts:nth-last-child(2) { padding-right: 12px; }
  .aw-gruppe .kb-balken, .aw-gruppe .kb-text { width: 96px; max-width: 96px; }
}
@media (max-width: 560px) {
  .aw-gruppe .kamp-suche { flex: 1 1 100%; }
}

.aw-wege { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.aw-zahlen { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.aw-zahlen > .ks-karte { display: flex; flex-direction: column; }
.aw-zahlen .ks-karte-unter { margin-top: 2px; }
.aw-balken { margin-top: auto; }
.aw-zahlen .ks-karte-unter + .aw-balken { margin-top: 14px; }
.aw-marke { background: var(--n-blau-flaeche); border-color: var(--n-blau-linie); }
a.aw-marke {
  color: inherit; text-decoration: none;
  transition: background-color var(--dauer) var(--kurve), border-color var(--dauer) var(--kurve);
}
a.aw-marke:hover { background: #dcedfa; border-color: var(--n-blau-hell); }
.aw-marke .ks-klein-etikett,
.aw-marke .ks-gross,
.aw-marke .ks-karte-unter { color: var(--n-blau-tief); }
.aw-marke .ks-karte-unter { font-weight: 600; }
.aw-marke .ks-zahl-sym { background: #fff; }

.aw-drei, .aw-zwei { display: grid; gap: 24px; align-items: stretch; margin-bottom: 32px; }
.aw-drei { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.aw-zwei { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.aw-drei > .ks-abschnitt > .ks-karte,
.aw-zwei > .ks-abschnitt > .ks-karte { flex: 1; }
.aw-text { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--n-leise); }
.aw-fuss { margin-top: auto; padding-top: 16px; display: flex; flex-wrap: wrap; gap: 8px; }
.aw-stark { font-weight: 600; color: var(--n-tinte); }

.aw-posten { list-style: none; margin: 0; padding: 0; }
.aw-posten li {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  padding: 10px 0; border-top: 1px solid var(--n-linie-fein);
  font-size: 13.5px; color: var(--n-tinte);
}
.aw-posten li:first-child { border-top: 0; padding-top: 0; }
.aw-posten li:last-child { padding-bottom: 0; }
.aw-posten li > span { min-width: 0; }
.aw-posten small { display: block; margin-top: 2px; font-size: 12px; color: var(--n-leise); }
.aw-posten .ks-pille { height: 20px; margin-left: 4px; font-size: 11px; vertical-align: 1px; }
.aw-posten b { flex: none; font-weight: 700; font-variant-numeric: tabular-nums; }

.aw-steckbrief { margin: 0; }
.aw-steckbrief dt { margin-top: 12px; font-size: 12px; color: var(--n-leise); }
.aw-steckbrief dt:first-child { margin-top: 0; }
.aw-steckbrief dd { margin: 2px 0 0; font-size: 13.5px; line-height: 1.45; overflow-wrap: anywhere; }

.aw-rang { margin-top: 0; }
.aw-rang .ks-quote-kopf { align-items: flex-start; }
.aw-rang-titel { min-width: 0; font-size: 13.5px; color: var(--n-tinte); }
.aw-rang-titel small { display: block; font-size: 12px; color: var(--n-leise); }
.aw-rang-zahl { flex: none; font-size: 12.5px; white-space: nowrap; font-variant-numeric: tabular-nums; }

.aw-reaktionen { display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }
.aw-reaktionen .verlauf-zeile { display: flex; align-items: center; gap: 12px; margin: 0; }
.aw-reaktionen .verlauf-zeit { flex: 0 0 84px; font-size: 12.5px; color: var(--n-leise); white-space: nowrap; }
.aw-reaktionen .ks-balken { flex: 1 1 auto; min-width: 40px; }
.aw-reaktionen .verlauf-zahl { flex: none; font-size: 12.5px; color: var(--n-leise); white-space: nowrap; font-variant-numeric: tabular-nums; }
.aw-reaktionen .verlauf-zahl b { color: var(--n-tinte); }
.aw-drei .leer, .aw-zwei .leer { padding: 18px 4px 6px; }

@media (max-width: 1280px) {
  .aw-drei { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .aw-drei > .ks-abschnitt:first-child { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
  .aw-zahlen { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .aw-drei, .aw-zwei { grid-template-columns: minmax(0, 1fr); gap: 32px; }
}
@media (max-width: 560px) {
  .aw-zahlen { gap: 12px; }
  .aw-zahlen .ks-gross { font-size: 26px; }
  
  .aw-zahlen .ks-zahl-kopf > .ks-klein-etikett { white-space: normal; min-width: 0; }
  .aw-zahlen > .ks-karte { padding: 16px; min-width: 0; }
  .aw-reaktionen .verlauf-zeile { flex-wrap: wrap; row-gap: 4px; }
  .aw-reaktionen .ks-balken { order: 3; flex-basis: 100%; }
  
  .aw-rang .ks-quote-kopf { flex-direction: column; align-items: flex-start; gap: 2px; }
  .aw-rang .aw-eine-zeile { white-space: normal; }
}

.aw-zwei-dicht { margin-bottom: 0; }
.aw-kopf-zahl { flex: none; font-size: 12.5px; font-weight: 600; color: var(--n-leise); }
.aw-ratgeber .rk-satz { font-size: 17px; font-weight: 650; letter-spacing: -.015em; }
.aw-ratgeber .rk-dazu { color: var(--n-leise); }
.aw-ratgeber .rk-stufe { border-radius: var(--n-rund-klein); background: var(--n-flaeche); }
.aw-ratgeber .rk-stufe span { margin: 0 0 4px; font-size: 12.5px; color: var(--n-leise); }
.aw-ratgeber .rk-stufe b { font-size: 20px; font-weight: 700; color: var(--n-tinte); font-variant-numeric: tabular-nums; }
.aw-ratgeber .rk-stufe.mail2 { background: var(--n-blau-flaeche); }
.aw-ratgeber .rk-stufe.mail2 b { color: var(--n-blau-tief); }
.aw-ratgeber .rk-stufe:not(:last-child)::after { color: var(--n-leise); }
.aw-ratgeber .rk-betreff { font-weight: 600; color: var(--n-tinte); }
.aw-ratgeber .rk-meta { color: var(--n-leise); }
.aw-ratgeber .karte-kopf a { color: var(--n-blau-tief); font-weight: 600; text-decoration: none; }
.aw-ratgeber .karte-kopf a:hover { text-decoration: underline; }
.aw-ratgeber .rk-regeln { color: var(--n-leise); }
.aw-ratgeber .rk-regeln summary { color: var(--n-tinte); font-weight: 600; }
.aw-ratgeber .rk-regeln li::marker { color: var(--n-blau); }

.aw-haupt-neben {
  display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  gap: 24px; align-items: stretch; margin-bottom: 32px;
}
.aw-haupt-neben:last-child { margin-bottom: 0; }
.aw-haupt-neben > .ks-abschnitt > .ks-karte { flex: 1; }
.aw-tafel { padding: 0; overflow: clip; }
.aw-tafel .tabelle-huelle { margin: 0; }
.aw-tafel .tabelle th:first-child, .aw-tafel .tabelle td:first-child { padding-left: 20px; }
.aw-tafel .tabelle th:last-child, .aw-tafel .tabelle td:last-child { padding-right: 20px; }
.aw-tafel .tabelle thead th { padding-top: 12px; padding-bottom: 10px; background: var(--n-feld); }
.aw-tafel > .leer { padding: 40px 24px 44px; }
.aw-tafel > .aw-tafel-fuss { padding: 12px 20px; border-top: 1px solid var(--n-linie-fein); }
.aw-eine-zeile { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aw-tafel .tabelle th.rechts, .aw-tafel .tabelle td.rechts { padding-left: 20px; text-align: right; }
.aw-tafel > .aw-tafel-kopf { padding: 16px 20px 12px; }
.aw-tafel-kopf h3 { margin: 0; font-size: 14.5px; font-weight: 600; letter-spacing: -.01em; }
.aw-luft { margin-top: 10px; }

.aw-werkzeug { padding: 14px 16px; }
.aw-report-wahl { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 0; }
.aw-report-wahl > select.aw-objektwahl,
.aw-report-wahl > .wahl:has(> select.aw-objektwahl) { flex: 1 1 320px; min-width: 0; max-width: none; }
.aw-report-wahl > select.aw-zeitwahl,
.aw-report-wahl > .wahl:has(> select.aw-zeitwahl) { flex: 0 0 190px; width: 190px; max-width: none; }
.aw-report-wahl > input[type=date] { flex: 0 1 170px; min-width: 0; }
.aw-feldname { font-size: 13px; font-weight: 600; color: var(--n-tinte); }
.aw-rechts { margin-left: auto; }
@media (max-width: 560px) {
  .aw-report-wahl > .aw-rechts { margin-left: 0; width: 100%; }
  .aw-report-wahl > select.aw-zeitwahl,
  .aw-report-wahl > .wahl:has(> select.aw-zeitwahl) { flex: 1 1 100%; width: auto; }
}

.aw-archiv > .meldung { margin: 0; }
.aw-archiv .tabelle th:last-child { position: relative; }
.aw-archiv .tabelle td { vertical-align: middle; }
.neu .aw-archiv-name { font-weight: 600; color: var(--n-tinte); text-decoration: none; }
.neu .aw-archiv-name:hover { color: var(--n-blau-tief); text-decoration: underline; text-underline-offset: 3px; }
.aw-archiv-wege { display: flex; align-items: center; justify-content: flex-end; flex-wrap: nowrap; gap: 8px; }
.aw-inline { display: flex; align-items: center; gap: 6px; margin: 0; }
.aw-archiv .tabelle-eingabe.aw-eingabe-name { width: 150px; }
.aw-archiv .tabelle-eingabe.aw-eingabe-wort { width: 110px; }

.aw-archiv .knopf.gefahr {
  background: #fff; color: var(--n-schlecht);
  box-shadow: inset 0 0 0 1px var(--n-linie);
}
.aw-archiv .knopf.gefahr:hover { background: var(--n-schlecht-flaeche); box-shadow: inset 0 0 0 1px #f5b5bf; }
@media (max-width: 1280px) {
  .aw-archiv-wege { flex-wrap: wrap; justify-content: flex-start; }
}

.aw-monate, .aw-entwicklung { list-style: none; margin: 12px 0 0; padding: 0; }
.aw-monate li, .aw-entwicklung li {
  display: flex; align-items: center; gap: 12px;
  min-height: 40px; padding: 6px 0;
  border-top: 1px solid var(--n-linie-fein);
  font-size: 13px;
}
.aw-monate li:first-child, .aw-entwicklung li:first-child { border-top: 0; }
.aw-monat { flex: 0 0 52px; color: var(--n-leise); font-variant-numeric: tabular-nums; }
.aw-monat-mitte { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; gap: 4px; }
.aw-monate b { flex: none; font-weight: 700; font-variant-numeric: tabular-nums; }
.aw-monate b.aw-plus { color: var(--n-gut); }
.aw-monate b.aw-minus { color: var(--n-schlecht); }
.aw-monate b.aw-null { color: var(--n-leise); }
.aw-entw-balken { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.aw-entw-balken .ks-balken { height: 6px; }
.aw-entw-zahl {
  flex: 0 0 64px; display: flex; flex-direction: column; align-items: flex-end;
  font-size: 12px; line-height: 1.25; color: var(--n-leise); font-variant-numeric: tabular-nums;
}
.aw-entw-zahl b { font-weight: 700; color: var(--n-tinte); }
.aw-legende { display: flex; align-items: center; gap: 6px; margin: 12px 0 0; font-size: 12px; color: var(--n-leise); }
.aw-punkt { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.aw-punkt.ks-hell { background: var(--n-blau-hell); }
.aw-punkt.ks-satt { background: var(--n-blau-tief); margin-left: 10px; }

@media (max-width: 1280px) {
  .aw-haupt-neben { grid-template-columns: minmax(0, 1fr); gap: 32px; }
}
@media (max-width: 560px) {
  .aw-tafel .tabelle th:first-child, .aw-tafel .tabelle td:first-child { padding-left: 14px; }
  .aw-tafel .tabelle th:last-child, .aw-tafel .tabelle td:last-child { padding-right: 14px; }
}

.ks-crm { display: flex; flex-direction: column; gap: 32px; min-width: 0; }

.ks-crm > .reihe,
.ks-crm .ks-abschnitt > .reihe,
.ks-crm > .meldung,
.ks-crm .ks-abschnitt > .meldung { margin: 0; }
.ks-crm .ks-abschnitt-kopf > .el-wege,
.ks-crm .ks-abschnitt-kopf > .ks-crm-rechts {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-left: 0;
}

.ks-crm-zahl { font-size: 12.5px; font-weight: 600; color: var(--n-leise); white-space: nowrap; }

.ks-crm-kacheln { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 16px; }
.ks-crm-kachel { display: flex; flex-direction: column; justify-content: space-between; min-height: 112px; }
.ks-crm-kachel .ks-gross { margin: 12px 0 0; }
.ks-crm-kachel .ks-karte-unter { margin-top: 4px; }
.ks-crm-kachel-marke { background: var(--n-blau-flaeche); border-color: var(--n-blau-linie); }
.ks-crm-kachel-marke .ks-klein-etikett { color: var(--n-blau-tief); }

.ks-crm-tafel { padding: 0; overflow: clip; }
.ks-crm-tafel > .werkzeug,
.ks-crm-tafel > .el-werkzeug {
  margin: 0; padding: 14px 16px;
  border-bottom: 1px solid var(--n-linie);
}
.ks-crm-tafel > .ks-crm-hinweis { margin: 14px 16px 0; }
.ks-crm-tafel > .leer { padding: 44px 24px 48px; }
.ks-crm-sammel {
  margin: 0; padding: 12px 16px;
  border-top: 1px solid var(--n-linie); background: var(--n-feld);
}
.ks-crm-stand { font-size: 12.5px; color: var(--n-leise); font-variant-numeric: tabular-nums; }
.ks-crm-fuss {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px;
  min-height: 52px; padding: 10px 16px;
  border-top: 1px solid var(--n-linie);
}
.ks-crm-fuss .blaettern { margin: 0; }

.ks-crm .el-werkzeug .suchfeld,
.ks-crm .el-werkzeug .knopf { min-height: 42px; }
.ks-crm .el-werkzeug .wahl-knopf { border-radius: var(--n-rund-knopf); font-size: 13px; }
.ks-crm .el-werkzeug .suchfeld { flex: 1 1 220px; min-width: 0; height: 42px; }

.ks-crm .el-filter > select,
.ks-crm .el-filter > .wahl { flex: 0 0 172px; width: 172px; max-width: none; }
.ks-crm .el-filter > select,
.ks-crm .el-filter > .wahl .wahl-knopf { height: 42px; min-height: 0; box-sizing: border-box; }

.ks-crm .el-huelle { margin: 0; }
.ks-crm .el-tabelle thead th {
  top: var(--n-kopf-hoehe);
  padding: 11px 12px 10px 0;
  background: var(--n-feld);
  border-bottom: 1px solid var(--n-linie);
  font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: var(--n-leise);
}
.ks-crm .el-tabelle td { padding: 12px 12px 12px 0; border-bottom-color: var(--n-linie-fein); }
.ks-crm .el-tabelle th:first-child,
.ks-crm .el-tabelle td:first-child { padding-left: 16px; }
.ks-crm .el-tabelle th:last-child,
.ks-crm .el-tabelle td:last-child { padding-right: 16px; }

.ks-crm .el-tabelle tbody tr:hover { background: var(--n-blau-flaeche); }
.ks-crm .el-tabelle tbody tr:hover td:first-child,
.ks-crm .el-tabelle tbody tr:hover td:last-child { border-radius: 0; }
.ks-crm .el-tabelle tbody tr:hover td:first-child { box-shadow: inset 3px 0 0 var(--n-blau); }
.ks-crm .el-sp-haken { width: 46px; }
.ks-crm .el-sp-tat { width: 96px; }
.ks-crm .el-sp-datum { width: 92px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ks-crm .el-tabelle td.el-sp-tel { font-variant-numeric: tabular-nums; color: var(--n-tinte); font-size: 13px; }
.ks-crm .el-sp-tel { width: 124px; }
.ks-crm .el-kontakt .kreis { width: 32px; height: 32px; font-size: 11.5px; }
.ks-crm .el-tabelle tbody tr:hover .el-kontakt .kreis { background: #fff; }
.ks-crm .el-name { font-size: 14px; font-weight: 600; }
.ks-crm .el-mail { font-size: 12.5px; color: var(--n-leise); }

.ks-crm .knopf.el-nachtragen {
  min-height: 0; margin-top: 3px; padding: 0;
  background: none; box-shadow: none; border-radius: 4px;
  font-size: 12.5px; font-weight: 600; color: var(--n-blau-tief);
}
.ks-crm .knopf.el-nachtragen:hover { background: none; box-shadow: none; color: var(--n-blau-tief); text-decoration: underline; text-underline-offset: 3px; }
.ks-crm .el-stand { font-size: 13px; color: var(--n-tinte); }
.ks-crm .el-stand.leise { color: var(--n-leise); }
.ks-crm .el-tat .knopf.still { font-size: 13px; color: var(--n-leise); }
.ks-crm .el-tat .knopf.still:hover { color: var(--n-tinte); }
.ks-crm .el-tat > a.knopf.still:hover { color: var(--n-blau-tief); }

@media (pointer: coarse), (max-width: 900px) {
  
  .ks-crm .knopf.el-nachtragen { min-height: 44px; margin-top: 0; }
  .ks-crm .el-filter > select,
  .ks-crm .el-filter > .wahl .wahl-knopf { height: 44px; }
  
  .ks-crm .el-sp-tat { width: auto; }
  .ks-crm .el-tat { flex-direction: row; align-items: center; gap: 4px; }
  .ks-crm .el-tat .knopf.still { min-height: 44px; padding: 0 8px; }
  
  .ks-crm label.haken:not(:has(.text)) { position: relative; }
  .ks-crm label.haken:not(:has(.text))::after { content: ''; position: absolute; inset: -12px; }
  .ks-crm .el-tabelle a.el-kontakt { min-height: 44px; }
}
@media (max-width: 900px) {
  .ks-crm { gap: 24px; }
  
  .ks-crm .el-tabelle thead th { top: 0; }
  .ks-crm .el-filter > select,
  .ks-crm .el-filter > .wahl { flex: 1 1 140px; width: auto; }
}
@media (max-width: 560px) {
  .ks-crm .ks-abschnitt-kopf > .el-wege,
  .ks-crm .ks-abschnitt-kopf > .ks-crm-rechts { width: 100%; }
  .ks-crm-kacheln { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .ks-crm-kachel { min-height: 96px; }
  
  .ks-crm-kacheln > :first-child:nth-last-child(3) { grid-column: 1 / -1; }
  .ks-crm .el-tabelle th:first-child,
  .ks-crm .el-tabelle td:first-child { padding-left: 12px; }
  .ks-crm .el-tabelle th:last-child,
  .ks-crm .el-tabelle td:last-child { padding-right: 12px; }
  
  .ks-crm .el-tabelle, .ks-crm .el-tabelle tbody, .ks-crm .el-tabelle thead { display: block; }
  .ks-crm .el-tabelle tr {
    display: grid; grid-template-columns: 32px minmax(0, 1fr) auto;
    align-items: center; gap: 2px 10px; padding: 10px 12px;
    border-bottom: 1px solid var(--n-linie-fein);
  }
  .ks-crm .el-tabelle thead tr { background: var(--n-feld); border-bottom-color: var(--n-linie); }
  .ks-crm .el-tabelle tbody tr:last-child { border-bottom: 0; }
  .ks-crm .el-tabelle tr > th,
  .ks-crm .el-tabelle tr > td { padding: 0; border: 0; background: none; }
  .ks-crm .el-tabelle tr > .el-sp-haken { grid-column: 1; grid-row: 1 / span 2; width: auto; }
  .ks-crm .el-tabelle tr > :nth-child(2) { grid-column: 2 / -1; grid-row: 1; min-width: 0; }
  .ks-crm .el-tabelle tr > .el-sp-stand { grid-column: 2; grid-row: 2; }
  .ks-crm .el-tabelle tr > .el-sp-tat { grid-column: 3; grid-row: 2; }
  .ks-crm .el-tabelle thead .el-sp-stand,
  .ks-crm .el-tabelle thead .el-sp-tat { display: none; }
  .ks-crm .el-tabelle tbody tr:hover td:first-child { box-shadow: none; }
  .ks-crm .el-tabelle tbody tr:hover { box-shadow: inset 3px 0 0 var(--n-blau); }
}

.ks-kontakt-kopf {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center;
  gap: 16px 20px; padding: 22px 24px;
}
.ks-kontakt-kreis { width: 60px; height: 60px; font-size: 19px; }
.ks-kontakt-wer { min-width: 0; }
.ks-kontakt-wer h1 {
  margin: 0; font-size: 24px; font-weight: 700; letter-spacing: -.025em; line-height: 1.2;
  overflow-wrap: anywhere;
}
.ks-kontakt-adresse {
  display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px;
  margin: 4px 0 0; font-size: 14px; color: var(--n-leise); overflow-wrap: anywhere;
}
.ks-kontakt-fakten { display: flex; flex-wrap: wrap; gap: 4px 0; margin: 6px 0 0; font-size: 12.5px; color: var(--n-leise); }
.ks-kontakt-fakten span + span::before { content: '·'; margin: 0 8px; }
.ks-kontakt-wege { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }

.ks-kontakt-urteil { font-size: 22px; letter-spacing: -.02em; }
.ks-kontakt-pillen { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 0; }

.ks-kontakt-raster {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start;
  grid-template-areas:
    "einwilligung sucht"
    "merkmale     sucht"
    "getan        post";
  gap: 32px 24px;
}
.ks-kontakt-einwilligung { grid-area: einwilligung; }
.ks-kontakt-sucht { grid-area: sucht; }
.ks-kontakt-merkmale { grid-area: merkmale; }
.ks-kontakt-getan { grid-area: getan; }
.ks-kontakt-post { grid-area: post; }
.ks-kontakt .ks-feld-wert { font-size: 14.5px; font-weight: 600; white-space: normal; overflow-wrap: anywhere; margin-top: 3px; }
.ks-kontakt .ks-feld-wert .ks-pille { vertical-align: middle; }
.ks-kontakt-klein { font-size: 13px; font-weight: 500; font-variant-numeric: tabular-nums; }
.ks-kontakt-luft { margin-top: 12px; }
.ks-kontakt .meldung { margin: 0; }

.ks-kontakt-profil { gap: 0; }
.ks-kontakt-paare { margin: 12px 0 0; }
.ks-kontakt-paare > div {
  display: grid; grid-template-columns: minmax(110px, 38%) minmax(0, 1fr); gap: 12px;
  padding: 9px 0; border-top: 1px solid var(--n-linie-fein);
}
.ks-kontakt-paare > div:first-child { border-top: 0; }
.ks-kontakt-paare dt { font-size: 13px; color: var(--n-leise); }
.ks-kontakt-paare dd { margin: 0; font-size: 13.5px; font-weight: 600; overflow-wrap: anywhere; }
.ks-kontakt-hinweis { display: block; margin-top: 2px; font-size: 12px; font-weight: 400; color: var(--n-leise); }

.ks-kontakt-marken { display: flex; flex-wrap: wrap; gap: 8px; }
.ks-kontakt-marke {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 30px; padding: 0 12px; border-radius: 999px;
  background: var(--n-flaeche); font-size: 13px; font-weight: 600;
}
.ks-kontakt-marke.ks-eigen { padding-right: 4px; background: var(--n-blau-flaeche); color: var(--n-blau-tief); }
.ks-kontakt-herkunft { font-weight: 500; color: var(--n-leise); }
.ks-kontakt-marke form { display: inline-flex; }
.ks-kontakt-marke .knopf.still {
  min-height: 24px; padding: 0 9px; border-radius: 999px;
  background: #fff; font-size: 12px; color: var(--n-leise);
}
.ks-kontakt-marke .knopf.still:hover { color: var(--n-schlecht); }
.ks-kontakt-setzen { margin-top: 16px; flex-wrap: wrap; }
.ks-kontakt-setzen > select,
.ks-kontakt-setzen > .wahl { flex: 0 0 210px; width: 210px; max-width: 100%; }
.ks-kontakt-setzen > input[type=text] { flex: 1 1 200px; min-width: 0; height: 42px; }

.ks-kontakt-setzen > select,
.ks-kontakt-setzen > .wahl .wahl-knopf { height: 42px; min-height: 0; box-sizing: border-box; }
.ks-kontakt-oder { font-size: 12.5px; color: var(--n-leise); }

.ks-kontakt-verlauf, .ks-kontakt-mails { list-style: none; margin: 0; padding: 0; }
.ks-kontakt-ereignis {
  position: relative;
  display: grid; grid-template-columns: 14px minmax(0, 1fr) auto; align-items: center; gap: 12px;
  padding: 10px 0;
}
.ks-kontakt-ereignis + .ks-kontakt-ereignis { border-top: 1px solid var(--n-linie-fein); }
.ks-kontakt-punkt { width: 8px; height: 8px; margin-left: 3px; border-radius: 50%; background: var(--n-blau-hell); }
.ks-kontakt-ereignis.ks-klick .ks-kontakt-punkt { background: var(--n-blau); }
.ks-kontakt-ereignis.ks-interesse .ks-kontakt-punkt { background: var(--n-gut); }
.ks-kontakt-was { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; font-size: 13.5px; font-weight: 600; }
.ks-kontakt-objekt { font-size: 12.5px; font-weight: 500; color: var(--n-leise); }
.ks-kontakt-wann { font-size: 12.5px; color: var(--n-leise); white-space: nowrap; font-variant-numeric: tabular-nums; }
.ks-kontakt-mails li {
  display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 12px;
  padding: 11px 0;
}
.ks-kontakt-mails li + li { border-top: 1px solid var(--n-linie-fein); }
.ks-kontakt-betreff { min-width: 0; font-size: 13.5px; font-weight: 600; overflow-wrap: anywhere; }
.ks-kontakt-fehler { display: block; margin-top: 2px; font-size: 12px; font-weight: 500; color: #a8322e; }
.ks-kontakt-mails .pille { justify-self: start; }
.ks-kontakt-fuss { display: flex; }

@media (max-width: 1100px) {
  .ks-kontakt-raster {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "einwilligung" "sucht" "merkmale" "getan" "post";
  }
}
@media (max-width: 700px) {
  .ks-kontakt-kopf { grid-template-columns: auto minmax(0, 1fr); padding: 18px; }
  .ks-kontakt-kreis { width: 48px; height: 48px; font-size: 16px; }
  .ks-kontakt-wer h1 { font-size: 20px; }
  .ks-kontakt-wege { grid-column: 1 / -1; justify-content: flex-start; }
  .ks-kontakt-setzen > select,
  .ks-kontakt-setzen > .wahl { flex: 1 1 100%; width: 100%; }
  .ks-kontakt-mails li { grid-template-columns: minmax(0, 1fr) auto; }
  .ks-kontakt-mails .ks-kontakt-wann { grid-column: 1 / -1; }
}
@media (pointer: coarse), (max-width: 900px) {
  .ks-kontakt-marke .knopf.still { min-height: 44px; }
  .ks-kontakt-setzen > input[type=text] { height: 44px; }
  .ks-kontakt-setzen > select,
  .ks-kontakt-setzen > .wahl .wahl-knopf { height: 44px; }
}

.ks-crm-vier { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.ks-crm-anker { scroll-margin-top: calc(var(--n-kopf-hoehe) + 16px); }

.ks-crm-block { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 20px; }
.ks-crm-block-text { flex: 1 1 360px; min-width: 0; }
.ks-crm-block-text p { margin: 4px 0 0; font-size: 12.5px; line-height: 1.55; }
.ks-crm-wege { display: flex; flex-direction: column; gap: 16px; }
.ks-crm-wege-satz { margin: 0; font-size: 13px; line-height: 1.6; color: var(--n-leise); }
.ks-crm-freigabe {
  display: flex; align-items: center; flex-wrap: wrap; gap: 12px 24px;
  padding: 16px 18px; border-radius: var(--n-rund-klein);
  background: var(--n-blau-flaeche); box-shadow: inset 0 0 0 1px var(--n-blau-linie);
}
.ks-crm-freigabe > div { flex: 1 1 360px; min-width: 0; }
.ks-crm-freigabe h3 { margin: 0; font-size: 14.5px; font-weight: 650; }
.ks-crm-freigabe p { margin: 4px 0 0; font-size: 12.5px; line-height: 1.55; color: var(--n-leise); }

.ks-crm-zeilen { list-style: none; margin: 0; padding: 0; }
.ks-crm-zeile {
  position: relative;
  display: grid; grid-template-columns: minmax(0, 1fr) 190px auto; align-items: center; gap: 10px 16px;
  padding: 12px 16px;
  transition: background-color var(--dauer) var(--kurve);
}
.ks-crm-zeile + .ks-crm-zeile { border-top: 1px solid var(--n-linie-fein); }
.ks-crm-zeile:hover { background: var(--n-blau-flaeche); box-shadow: inset 3px 0 0 var(--n-blau); }
.ks-crm-wer { display: flex; align-items: center; gap: 12px; min-width: 0; }
.ks-crm-wer .kreis { width: 32px; height: 32px; font-size: 11.5px; }
.ks-crm-zeile:hover .ks-crm-wer .kreis { background: #fff; }
.ks-crm-wer-text { display: flex; flex-direction: column; min-width: 0; }
.ks-crm-name { font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.ks-crm-name.ks-crm-ohne { font-weight: 500; font-style: italic; color: var(--n-leise); }
.ks-crm-mail { font-size: 12.5px; color: var(--n-leise); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ks-crm-stand-wort { font-size: 13px; color: var(--n-leise); }
.ks-crm-klein { margin-top: 3px; font-size: 12px; color: var(--n-leise); }
.ks-crm-umbruch { overflow-wrap: anywhere; }
.ks-ew-wege { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px; }
.ks-ew-liegt { display: flex; align-items: center; gap: 8px; }
.ks-ew-liegt input[type=text] { width: 200px; height: 34px; min-height: 0; font-size: 13px; }
.ks-crm-zeile:hover .ks-ew-liegt input[type=text] { background: #fff; }

.ks-crm-leiste {
  display: flex; align-items: center; flex-wrap: wrap; gap: 12px 20px;
  padding: 14px 16px; border-bottom: 1px solid var(--n-linie);
}
.ks-crm-leiste-satz { flex: 1 1 320px; margin: 0; font-size: 12.5px; line-height: 1.55; color: var(--n-leise); }
.ks-crm-filter {
  display: inline-flex; flex-wrap: wrap; gap: 2px; padding: 3px;
  border-radius: 11px; background: var(--n-flaeche);
}
.ks-crm-filter a {
  display: inline-flex; align-items: center; height: 32px; padding: 0 12px;
  border-radius: 8px; font-size: 13px; font-weight: 600; color: var(--n-leise);
  text-decoration: none; transition: background-color var(--dauer) var(--kurve), color var(--dauer) var(--kurve);
}
.ks-crm-filter a:hover { color: var(--n-tinte); background: rgb(255 255 255 / .6); }
.ks-crm-filter a.aktiv { background: #fff; color: var(--n-blau-tief); box-shadow: 0 0 0 1px var(--n-blau-linie); }

.ks-crm-tafel > .tabelle-huelle { position: relative; margin: 0; }
.ks-crm .ks-crm-tabelle { width: 100%; border-collapse: separate; border-spacing: 0; }
.ks-crm .ks-crm-tabelle thead th {
  padding: 11px 12px 10px 0; background: var(--n-feld);
  border-bottom: 1px solid var(--n-linie);
  font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: var(--n-leise); white-space: nowrap; text-align: left;
}
.ks-crm .ks-crm-tabelle td {
  padding: 12px 12px 12px 0; border-bottom: 1px solid var(--n-linie-fein);
  vertical-align: middle; font-size: 13px;
}
.ks-crm .ks-crm-tabelle tbody tr:last-child td { border-bottom: 0; }
.ks-crm .ks-crm-tabelle th:first-child,
.ks-crm .ks-crm-tabelle td:first-child { padding-left: 16px; }
.ks-crm .ks-crm-tabelle th:last-child,
.ks-crm .ks-crm-tabelle td:last-child { padding-right: 16px; }
.ks-crm .ks-crm-tabelle tbody tr { transition: background-color var(--dauer) var(--kurve); }
.ks-crm .ks-crm-tabelle tbody tr:hover { background: var(--n-blau-flaeche); }
.ks-crm .ks-crm-tabelle tbody tr:hover td:first-child { box-shadow: inset 3px 0 0 var(--n-blau); }
.ks-crm .ks-crm-tabelle tbody tr:hover .kreis { background: #fff; }
.ks-crm .ks-crm-tabelle td.schmal { white-space: nowrap; }

@media (max-width: 1100px) {
  .ks-crm-vier { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ks-crm-zeile { grid-template-columns: minmax(0, 1fr) auto; }
  .ks-ew-wege { grid-column: 1 / -1; justify-content: flex-start; }
}
@media (max-width: 560px) {
  .ks-crm-zeile { grid-template-columns: minmax(0, 1fr); }
  
  .ks-ew-zeilen > .ks-crm-zeile { grid-template-columns: minmax(0, 1fr) auto; }
  .ks-ew-zeilen .ks-crm-stand-wort { font-size: 12px; text-align: right; }
  .ks-ew-liegt { flex: 1 1 100%; }
  .ks-ew-liegt input[type=text] { flex: 1 1 auto; width: auto; min-width: 0; }
  .ks-crm-filter { width: 100%; }
}
@media (pointer: coarse), (max-width: 900px) {
  .ks-ew-liegt input[type=text] { height: 44px; font-size: 16px; }
  .ks-crm-filter a { height: 44px; }
}

.ks-sperre-oben { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 16px; align-items: start; }
.ks-sperre-zahlen { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ks-sperre-warum .ks-karte-unter + .ks-karte-unter { margin-top: 10px; }
.ks-sperre-warum .ks-karte-unter { margin-top: 8px; line-height: 1.6; }
@media (max-width: 1100px) {
  .ks-sperre-oben { grid-template-columns: minmax(0, 1fr); }
}

.ks-seg-wozu { display: flex; align-items: flex-start; gap: 16px; }
.ks-seg-wozu h3 { margin: 0; font-size: 15px; font-weight: 650; }
.ks-seg-wozu p { margin: 6px 0 0; font-size: 13.5px; line-height: 1.6; }
.ks-seg-zeichen {
  flex: none; display: grid; place-items: center;
  width: 40px; height: 40px; border-radius: 12px;
  background: var(--n-blau-verlauf); color: #fff;
}
.ks-seg-zeichen svg { width: 20px; height: 20px; }
.ks-seg-satz {
  margin: 0; padding: 14px 16px;
  border-bottom: 1px solid var(--n-linie);
  font-size: 12.5px; color: var(--n-leise);
}

.ks-seg .segment-liste .segment-zeile {
  position: relative;
  gap: 10px 12px; padding: 14px 16px;
  border-left: 0; border-bottom: 1px solid var(--n-linie-fein);
  transition: background-color var(--dauer) var(--kurve);
}
.ks-seg .segment-liste .segment-zeile:last-child { border-bottom: 0; }
.ks-seg .segment-liste .segment-zeile:hover { background: var(--n-blau-flaeche); box-shadow: inset 3px 0 0 var(--n-blau); }
.ks-seg .segment-zeile .titel { font-size: 14.5px; font-weight: 650; letter-spacing: -.01em; }
.ks-seg .segment-zeile .unter { margin-top: 1px; font-size: 12.5px; color: var(--n-leise); }

.ks-seg .segment-zeile > details[open] > .segment-rumpf,
.ks-seg .segment-zeile > details[open] > summary + * {
  margin-top: 12px; padding: 16px 18px;
  border-radius: var(--n-rund-klein); background: #fff;
  box-shadow: inset 0 0 0 1px var(--n-linie);
}
.ks-seg .segment-zeile > details[open] > summary { background: var(--n-blau-flaeche); color: var(--n-blau-tief); box-shadow: inset 0 0 0 1px var(--n-blau-linie); }

.ks-seg .segment-zeile > details[open] { min-width: 0; }
.ks-seg .segment-regeln { padding-left: 18px; font-size: 13px; line-height: 1.6; }
.ks-seg .segment-regeln li + li { margin-top: 4px; }
.ks-seg-tafel > .leer { padding: 40px 24px 44px; }

.ks-seg-raster {
  display: grid; grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr);
  align-items: start; gap: 32px 24px;
}
.ks-seg-luft { margin: 0 0 16px; line-height: 1.6; }
.ks-seg-gemerkt { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--n-linie-fein); }
.ks-seg-gemerkt .ks-klein-etikett { margin-bottom: 8px; }
.ks-seg-gemerkt-zeile { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; font-size: 13px; }
.ks-seg-gemerkt-zeile form { display: inline-flex; }

.ks-seg form { counter-reset: regel; }
.ks-seg .regelzeile {
  counter-increment: regel;
  grid-template-columns: 28px minmax(0, 3fr) minmax(0, 2fr) minmax(0, 4fr);
  align-items: center; gap: 8px; margin-bottom: 8px;
}
.ks-seg .regelzeile::before {
  content: counter(regel);
  display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%;
  background: var(--n-blau-flaeche); color: var(--n-blau-tief);
  font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums;
}
.ks-seg .regelzeile select,
.ks-seg .regelzeile input[type=text],
.ks-seg .regelzeile .wahl-knopf {
  height: 42px; min-height: 0; box-sizing: border-box;
  border: 0; border-radius: 10px; background: var(--n-feld);
  box-shadow: inset 0 0 0 1px var(--n-linie);
  font-size: 13.5px;
}
.ks-seg .regelzeile input[type=text]:focus,
.ks-seg .regelzeile select:focus { background: #fff; box-shadow: inset 0 0 0 1px var(--n-blau); }
.ks-seg .regelzeile + .klein.leise,
.ks-seg .regelzeile ~ .klein.leise { font-size: 12.5px; line-height: 1.55; color: var(--n-leise); }
.ks-seg .aufklapp > summary .titel { font-size: 14.5px; font-weight: 650; }
.ks-seg-wolke-kopf { margin: 18px 0 8px; }

@media (max-width: 1100px) {
  .ks-seg-raster { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 700px) {
  .ks-seg .regelzeile { grid-template-columns: minmax(0, 1fr); padding-top: 10px; border-top: 1px solid var(--n-linie-fein); }
  .ks-seg .regelzeile::before { width: auto; height: auto; place-items: start; background: none; content: 'Regel ' counter(regel); font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--n-leise); }
}
@media (pointer: coarse), (max-width: 900px) {
  .ks-seg .regelzeile select,
  .ks-seg .regelzeile input[type=text],
  .ks-seg .regelzeile .wahl-knopf { height: 44px; font-size: 16px; }
}

.ks-crm-rechts form { display: inline-flex; }
.ks-obj-tafel > .werkzeug .suchfeld { flex: 1 1 260px; min-width: 0; }
.ks-obj-tafel > .werkzeug form { display: inline-flex; }
.ks-obj-tafel > .leer { padding: 40px 24px 44px; }
.ks-obj-gruppen { display: flex; flex-direction: column; gap: 16px; }
.ks-obj-gruppen > .reihe { margin: 0; }

.ks-crm .aufklapp > summary { margin: -4px -6px; padding: 4px 6px; }
.ks-crm .aufklapp > summary:hover { background: none; }
.ks-crm .aufklapp-zeichen { width: 38px; height: 38px; border-radius: 11px; background: var(--n-blau-flaeche); color: var(--n-blau); }
.ks-crm .aufklapp > summary .titel { font-size: 15px; font-weight: 650; letter-spacing: -.01em; }
.ks-crm .aufklapp[open] > summary { margin-bottom: 16px; }

.ks-obj .objekt-liste { border-top-color: var(--n-linie); }
.ks-obj .objekt-kopfzeile {
  align-items: center; background: var(--n-feld);
  border-bottom-color: var(--n-linie);
  font-size: 11px; letter-spacing: .08em; color: var(--n-leise);
}
.ks-obj .objekt-zeile {
  position: relative; padding-top: 12px; padding-bottom: 12px;
  transition: background-color var(--dauer) var(--kurve);
}
.ks-obj .objekt-zeile + .objekt-zeile { border-top-color: var(--n-linie-fein); }
.ks-obj .objekt-zeile:hover { background: var(--n-blau-flaeche); box-shadow: inset 3px 0 0 var(--n-blau); }
.ks-obj .objekt-zeile:has(> .oz-auf[open]) { background: var(--n-feld); box-shadow: inset 3px 0 0 var(--n-blau); }
.ks-obj .oz-auf > summary:hover,
.ks-obj .oz-auf[open] > summary { background: none; }
.ks-obj .oz-bild { border-radius: 10px; background: var(--n-flaeche); }
.ks-obj .oz-kein-foto { background: var(--n-blau-flaeche); color: var(--n-blau); }
.ks-obj .oz-titel { font-size: 14.5px; font-weight: 650; letter-spacing: -.01em; }
.ks-obj .oz-leise { color: var(--n-leise); }
.ks-obj .oz-fehlt { color: var(--n-gelb-text); }
.ks-obj .oz-ohne-titel { color: var(--n-gelb-text); }
.ks-obj .oz-preis { font-size: 15px; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.ks-obj .oz-pfeil { color: var(--n-leise); }
.ks-obj .objekt-zeile:hover .oz-pfeil { color: var(--n-blau); }
.ks-obj .objekt-zeile.ohne-haken .oz-bild { opacity: .75; }

.ks-obj .oz-detail {
  margin: 12px 0 4px; padding: 18px 20px;
  border: 0; border-radius: var(--n-rund-klein);
  background: #fff; box-shadow: 0 0 0 1px var(--n-linie);
}
.ks-obj .oz-formular,
.ks-obj .oz-griffe { border-top-color: var(--n-linie-fein); }
.ks-obj .fotostreifen .foto-kachel { border-radius: 10px; }

.oz-sucher { grid-column: 2; min-width: 0; }
.oz-sucher-kopf {
  width: fit-content; cursor: pointer;
  font-size: 12.5px; font-weight: 600; color: var(--n-blau-tief);
}
.oz-sucher-kopf:hover { text-decoration: underline; text-underline-offset: 3px; }
.oz-sucher-kopf:focus-visible { outline: 2px solid var(--n-blau); outline-offset: 2px; border-radius: 4px; }
.oz-sucher-zahl { font-weight: 700; color: var(--n-tinte); }
.oz-sucher-warten { margin-top: 6px; }
.oz-sucher-rumpf {
  display: flex; flex-direction: column; gap: 12px;
  margin-top: 10px; padding: 14px 16px;
  border-radius: var(--n-rund-klein); background: #fff;
  box-shadow: 0 0 0 1px var(--n-linie);
}
.oz-sucher-liste { display: flex; flex-direction: column; }
.oz-sucher-treffer { padding: 9px 0; line-height: 1.5; }
.oz-sucher-treffer:first-child { padding-top: 0; }
.oz-sucher-treffer + .oz-sucher-treffer { border-top: 1px solid var(--n-linie-fein); }
.oz-sucher-name { font-weight: 600; color: var(--n-tinte); }
.oz-sucher-name:hover { color: var(--n-blau-tief); }
.oz-sucher-rang { margin-top: 2px; }
.oz-sucher-gruende { color: var(--n-leise); }
.oz-sucher-block { line-height: 1.5; }
.oz-sucher-knapp { margin-top: 3px; }
.oz-sucher-wege {
  display: flex; flex-wrap: wrap; gap: 12px 24px;
  padding-top: 12px; border-top: 1px solid var(--n-linie-fein);
}
.oz-sucher-weg { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; flex: 1 1 240px; min-width: 0; }
.oz-sucher-nichts { color: var(--n-leise); }
@media (pointer: coarse), (max-width: 900px) {
  
  .oz-sucher-kopf { padding: 12px 0; }
  .oz-sucher-rumpf { margin-top: 0; }
}

@media (max-width: 900px) {
  .ks-crm .ks-abschnitt-kopf > .ks-crm-rechts { width: 100%; }
}

.ks-vk-zeichen {
  flex: none; display: grid; place-items: center;
  width: 32px; height: 32px; border-radius: 10px;
  background: var(--n-gut-flaeche); color: var(--n-gut-text);
}
.ks-vk-zeichen svg { width: 16px; height: 16px; }
.ks-crm-zeile:hover .ks-vk-zeichen { background: #fff; }

.ks-vk-zeilen .ks-crm-zeile { grid-template-columns: minmax(0, 1fr) 170px auto; }

.ks-vk-zeilen .ks-crm-name { white-space: normal; overflow-wrap: anywhere; }
.ks-vk-stand { display: flex; flex-direction: column; min-width: 0; }
.ks-vk-stand .ks-crm-stand-wort { color: var(--n-tinte); font-variant-numeric: tabular-nums; }
.ks-vk-wege { display: flex; justify-content: flex-end; }
@media (max-width: 560px) {
  
  .ks-vk-zeilen .ks-crm-zeile { grid-template-columns: minmax(0, 1fr) auto; }
  .ks-vk-zeilen .ks-crm-wer { grid-column: 1 / -1; }
  .ks-vk-zeilen .ks-vk-stand { padding-left: 44px; }
}

.ks-imp-dazu { margin-top: 3px; }
.ks-imp-satz { margin: 0; }
.ks-imp-satz.ks-imp-dazu { margin-top: 6px; }

.ks-crm .ks-imp-filter { flex: 0 1 380px; flex-wrap: nowrap; margin: 0; min-width: 0; }
.ks-imp-filter .suchfeld { flex: 1 1 auto; min-width: 0; }
.ks-imp-filter .ks-crm-stand:empty { display: none; }
.ks-imp-haken { margin: 0; justify-content: center; }
.ks-imp .crm-bild { border-radius: 10px; background-color: var(--n-flaeche); }
.ks-imp .ks-imp-sp-nummer { font-variant-numeric: tabular-nums; }
.ks-imp .ks-imp-sp-preis { font-weight: 650; font-variant-numeric: tabular-nums; }
.ks-imp .crm-fakten { color: var(--n-leise); font-variant-numeric: tabular-nums; }
.ks-imp .ks-imp-geschuetzt { margin-top: 6px; }

.ks-crm .tat-leiste {
  margin: 0; padding: 10px 12px 10px 14px;
  border-radius: var(--n-rund);
  box-shadow: 0 0 0 1px var(--n-linie), 0 12px 32px rgb(30 40 61 / .10);
}
@media (min-width: 901px) {
  
  .ks-crm .tat-leiste { margin-right: 62px; }
}

.ks-crm .tat-leiste .stand { min-height: 1.5em; line-height: 1.5; font-variant-numeric: tabular-nums; }

.ks-crm .pille.warn { background: var(--n-gelb-flaeche); color: var(--n-gelb-text); box-shadow: none; }
@media (max-width: 900px) {
  
  .ks-crm .tat-leiste { bottom: calc(max(var(--seiten-rand), env(safe-area-inset-bottom)) + 74px); }
  
  .neu:has(.ks-crm .tat-leiste) .hilfe-knopf { bottom: calc(max(var(--seiten-rand), env(safe-area-inset-bottom)) + 178px); }
}
.ks-imp-filter .ks-crm-stand { white-space: nowrap; }
@media (max-width: 700px) {
  .ks-crm .ks-imp-filter { flex: 1 1 100%; }
  
  .ks-imp-neu, .ks-imp-neu thead, .ks-imp-neu tbody { display: block; }
  .ks-crm .ks-imp-neu tr {
    display: grid; grid-template-columns: 28px 64px minmax(0, 1fr) auto;
    align-items: center; gap: 2px 12px;
    height: auto; padding: 12px;
    border-bottom: 1px solid var(--n-linie-fein);
  }
  .ks-crm .ks-imp-neu thead tr { padding: 8px 12px; background: var(--n-feld); border-bottom-color: var(--n-linie); }
  
  .ks-imp-neu tbody tr[hidden] { display: none; }
  .ks-imp-neu tbody tr:last-child { border-bottom: 0; }
  .ks-crm .ks-imp-neu tr > th,
  .ks-crm .ks-imp-neu tr > td { padding: 0; border: 0; }
  .ks-crm .ks-imp-neu thead tr > th:first-child { display: flex; align-items: center; gap: 12px; grid-column: 1 / -1; }
  .ks-imp-neu thead th:first-child::after { content: 'Alle sichtbaren'; }
  .ks-imp-neu thead th + th { display: none; }
  .ks-imp-neu .ks-imp-sp-haken { grid-column: 1; grid-row: 1 / span 3; }
  .ks-imp-neu .ks-imp-sp-bild { grid-column: 2; grid-row: 1 / span 3; }
  .ks-imp-neu .ks-imp-sp-nummer { grid-column: 3; grid-row: 1; font-size: 12px; }
  .ks-imp-neu .ks-imp-sp-preis { grid-column: 4; grid-row: 1; }
  .ks-imp-neu .ks-imp-sp-objekt { grid-column: 3 / -1; grid-row: 2; }
  .ks-imp-neu .ks-imp-sp-lage { grid-column: 3 / -1; grid-row: 3; font-size: 12px; }
  .ks-crm .ks-imp-neu tbody tr:hover td:first-child { box-shadow: none; }
  
  .ks-imp-bekannt, .ks-imp-bekannt tbody { display: block; }
  .ks-imp-bekannt thead { display: none; }
  .ks-crm .ks-imp-bekannt tr {
    display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: start;
    gap: 8px 12px; padding: 12px; border-bottom: 1px solid var(--n-linie-fein);
  }
  .ks-imp-bekannt tbody tr:last-child { border-bottom: 0; }
  .ks-crm .ks-imp-bekannt tr > td { padding: 0; border: 0; }
  .ks-imp-bekannt td:first-child { grid-row: 1 / span 2; }
  .ks-imp-bekannt td:nth-child(3) { grid-column: 2; }
  .ks-crm .ks-imp-bekannt tbody tr:hover td:first-child { box-shadow: none; }
}

.neu .bw-reiter {
  gap: 2px; padding: 4px; margin: 0 0 24px;
  border: 1px solid var(--n-linie); border-radius: 12px; box-shadow: none;
}
.neu .bw-reiter a { padding: 7px 14px; border-radius: 9px; color: var(--n-leise); }
.neu .bw-reiter a:hover { background: var(--n-flaeche); color: var(--n-tinte); }
.neu .bw-reiter a.aktiv {
  background: var(--n-blau-flaeche); color: var(--n-blau-tief);
  box-shadow: inset 0 0 0 1px var(--n-blau-linie);
}
.neu .bw-reiter a.aktiv svg { color: var(--n-blau); }
.neu .bw-reiter .zahl { background: var(--n-blau-voll); }

.bw-abschnitt + .bw-abschnitt { margin-top: 28px; }
.bw-abschnitt > .meldung { margin: 0; }

.bw-ansichten {
  display: inline-flex; flex-wrap: wrap; gap: 2px; padding: 3px;
  border: 1px solid var(--n-linie); border-radius: 11px; background: #fff;
}
.bw-ansichten a {
  display: inline-flex; align-items: center; min-height: 30px; padding: 0 12px;
  border-radius: 8px; font-size: 13px; font-weight: 600; color: var(--n-leise);
  text-decoration: none; font-variant-numeric: tabular-nums;
  transition: background-color var(--dauer) var(--kurve), color var(--dauer) var(--kurve);
}
.bw-ansichten a:hover { background: var(--n-flaeche); color: var(--n-tinte); }
.bw-ansichten a.aktiv {
  background: var(--n-blau-flaeche); color: var(--n-blau-tief);
  box-shadow: inset 0 0 0 1px var(--n-blau-linie);
}

.reihe.werkbank:has(> .bw-vorschau-spalte) { gap: 24px; }

.reihe.werkbank > .bw-vorschau-spalte { top: calc(var(--n-kopf-hoehe) + 16px); }
.bw-aussehen-satz { margin: 0 0 18px; }
.bw-aussehen .hilfe { margin-top: 6px; font-size: 12.5px; color: var(--n-leise); }
.neu .bw-farbfeld {
  border-color: var(--n-linie); border-radius: 10px; background: var(--n-feld);
}
.neu .bw-farbfeld:focus-within {
  border-color: var(--n-blau); background: #fff;
  box-shadow: 0 0 0 3px var(--n-blau-flaeche);
}
.neu .bw-tupfer { border-radius: 8px; border-color: rgb(16 24 40 / .12); }
.neu .bw-mini { border-radius: 7px; border-color: rgb(16 24 40 / .12); }
.neu .bw-mini:focus-visible { box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--n-blau); }
.neu .bw-gleich-link,
.neu .bw-eigenschrift > summary { color: var(--n-blau-tief); font-weight: 500; text-decoration: none; }
.neu .bw-gleich-link:hover,
.neu .bw-eigenschrift > summary:hover { text-decoration: underline; text-underline-offset: 3px; }
.neu .bw-trenner { background: var(--n-linie-fein); }
.neu .bw-schrift {
  border: 1px solid var(--n-linie); border-radius: 12px; background: #fff;
  transition: border-color var(--dauer) var(--kurve), background-color var(--dauer) var(--kurve);
}
.neu .bw-schrift:hover { border-color: #cbd0d8; background: var(--n-feld); }
.neu .bw-schrift.gewaehlt,
.neu .bw-schrift:has(input:checked) {
  border-color: var(--n-blau-linie); background: var(--n-blau-flaeche);
  box-shadow: inset 0 0 0 1px var(--n-blau);
}
.neu .bw-schrift.gewaehlt .probe,
.neu .bw-schrift:has(input:checked) .probe,
.neu .bw-schrift:has(input:checked) .name { color: var(--n-blau-tief); }
.neu .bw-schrift:has(input:focus-visible) { box-shadow: inset 0 0 0 1px var(--n-blau), 0 0 0 3px var(--n-blau-flaeche); }
.neu .bw-eigenschrift.hat {
  border: 1px solid var(--n-blau-linie); border-radius: 12px; background: var(--n-blau-flaeche);
}
.neu .bw-logo {
  border: 1px dashed #d3d6dd; border-radius: 12px; background: var(--n-feld);
}
.neu .bw-logo.hat { border: 1px solid var(--n-linie); background: #fff; }
.neu .bw-speichern { border-top-color: var(--n-linie-fein); }
.neu .bw-vorschau-karte { padding: 10px; }
.neu .bw-rahmen { border: 0; border-radius: 10px; background: var(--n-feld); }
.bw-vorschau-spalte .ks-abschnitt-kopf > .ks-knopf-umriss { flex: none; }

.neu .bw-mail { flex-direction: row; margin-bottom: 0; gap: 22px 28px; padding: 22px; }
.bw-mail .ks-karte-kopf { flex-wrap: wrap; margin-bottom: 8px; }
.bw-ansehen {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 13px; font-weight: 600; color: var(--n-blau-tief); text-decoration: none;
}
.bw-ansehen:hover { text-decoration: underline; text-underline-offset: 3px; }
.neu .bw-mail-wann { color: var(--n-leise); margin-bottom: 14px; }
.bw-mail-text .bw-ansichten { margin-bottom: 18px; }
.bw-mail-etikett { display: block; padding-top: 16px; border-top: 1px solid var(--n-linie-fein); }
.neu .bw-mail-regeln { margin-top: 10px; color: var(--n-leise); }
.neu .bw-mail-regeln li::marker { color: var(--n-blau); }
.neu .bw-mail > .mailrahmen { border-radius: 12px; }

.bw-wege {
  display: grid; gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
  align-items: start;
}
.bw-weg-sym {
  width: 34px; height: 34px; flex: none; display: grid; place-items: center;
  border-radius: 10px; background: var(--n-blau-flaeche); color: var(--n-blau-tief);
}
.bw-weg-sym svg { width: 18px; height: 18px; }
.bw-weg-unter { margin: 8px 0 14px; }

.neu .bw-code {
  min-height: 40px; box-sizing: border-box; padding: 9px 12px;
  border: 0; border-radius: 10px; background: var(--n-feld); color: var(--n-tinte);
  box-shadow: inset 0 0 0 1px var(--n-linie);
  transition: box-shadow var(--dauer) var(--kurve), background-color var(--dauer) var(--kurve);
}
.neu .bw-code:hover { box-shadow: inset 0 0 0 1px #cbd0d8; }
.neu .bw-code:focus { outline: 0; background: #fff; box-shadow: inset 0 0 0 1px var(--n-blau), 0 0 0 3px var(--n-blau-flaeche); }
.neu textarea.bw-code { resize: vertical; }
.bw-mitnehmen > .knopf { min-height: 40px; }

.bw-zahlen {
  display: grid; gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
}
.bw-zahl .ks-gross { margin-top: 8px; }
.bw-zahl-marke { background: var(--n-blau-flaeche); border-color: var(--n-blau-linie); }
.bw-zahl-marke .ks-klein-etikett { color: var(--n-blau-tief); }
.neu .reihe.bw-liste { gap: 16px; }

.neu .bw-anfrage { display: flex; flex-direction: column; }
.neu .bw-anfrage .anrufband {
  display: flex; align-items: flex-start; gap: 10px;
  margin: 0 0 16px; padding: 11px 14px;
  border-radius: 12px; background: var(--n-blau-flaeche); color: var(--n-blau-tief);
  box-shadow: inset 0 0 0 1px var(--n-blau-linie);
}
.neu .bw-anfrage .anrufband svg { flex: none; margin-top: 1px; color: var(--n-blau); }
.neu .bw-anfrage .anrufband .satz { font-size: 13.5px; font-weight: 600; letter-spacing: -.005em; }
.neu .bw-anfrage .anrufband .frist { color: var(--n-leise); }
.bw-anfrage-kopf { margin-bottom: 14px; }
.neu .bw-anfrage .kreis {
  width: 42px; height: 42px; border-radius: 12px; box-shadow: none;
  background: var(--n-blau-flaeche); color: var(--n-blau-tief);
  font-size: 13px; font-weight: 700;
}
.bw-anfrage-wer { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.bw-anfrage-name { font-size: 15px; font-weight: 650; letter-spacing: -.01em; }
.neu .bw-anfrage a.stark { color: var(--n-blau-tief); font-weight: 600; text-decoration: none; }
.neu .bw-anfrage a.stark:hover { text-decoration: underline; text-underline-offset: 3px; }
.neu .bw-ohne-telefon { color: var(--n-gelb-text); }
.neu .bw-anfrage-pillen { gap: 6px; margin-bottom: 14px; }
.bw-anfrage-adresse { margin-bottom: 8px; font-size: 14px; font-weight: 600; }
.neu .bw-anfrage .daten {
  padding: 12px 14px; gap: 5px 16px;
  border-radius: 12px; background: var(--n-feld); box-shadow: inset 0 0 0 1px var(--n-linie-fein);
}
.neu .bw-anfrage .daten dt { color: var(--n-leise); }
.neu .bw-anfrage .daten dd { font-variant-numeric: tabular-nums; }
.bw-anfrage-anliegen { margin-top: 12px; }
.bw-anfrage-wann { margin-top: 6px; }
.neu .bw-anfrage-fuss {
  margin: 16px 0 0; padding-top: 14px; border-top: 1px solid var(--n-linie-fein);
}
.bw-anfrage-fuss form { display: contents; }
.neu .bw-anfrage.abgehakt .daten { background: #fff; }

@media (max-width: 900px) {
  .neu .bw-reiter { width: 100%; }
  .neu .bw-reiter a { flex: 1 1 auto; justify-content: center; }
  .neu .bw-mail { padding: 16px; }
}
@media (pointer: coarse), (max-width: 900px) {
  .bw-ansichten a { min-height: 44px; }
  .neu .bw-code, .bw-mitnehmen > .knopf { min-height: 44px; }
}

@media (max-width: 600px) {
  :is(.bw-abschnitt, .reihe.werkbank > .ks-abschnitt, .tut-abschnitt, .hl-seite,
      .hl-support, .fm-seite, .as-spalte) .ks-etikett small { display: none; }
}

.hl-seite {
  display: grid; gap: 24px; align-items: start;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
  max-width: 1180px;
}
.hl-seite .chat-karte {
  padding: 20px 22px; border-radius: var(--n-rund);
  border: 1px solid var(--n-linie); box-shadow: none;
}
.hl-wege { padding: 6px; gap: 2px; }
.hl-weg {
  display: flex; align-items: center; gap: 12px;
  padding: 11px 12px; border-radius: 12px;
  color: inherit; text-decoration: none;
  transition: background-color var(--dauer) var(--kurve);
}
.hl-weg:hover { background: var(--n-blau-flaeche); }
.hl-weg:focus-visible { outline: 2px solid var(--n-blau); outline-offset: -2px; }
.hl-weg-sym {
  width: 36px; height: 36px; flex: none; display: grid; place-items: center;
  border-radius: 10px; background: var(--n-blau-flaeche); color: var(--n-blau-tief);
  transition: background-color var(--dauer) var(--kurve);
}
.hl-weg:hover .hl-weg-sym { background: #fff; }
.hl-weg-sym svg { width: 18px; height: 18px; }
.hl-weg-text { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.hl-weg-text b { font-size: 14px; font-weight: 600; }
.hl-weg-text span { font-size: 12.5px; line-height: 1.4; color: var(--n-leise); }
.hl-support-karte { padding: 6px 14px; }
.hl-support-karte .tabelle-huelle { box-shadow: none; border: 0; }
@media (max-width: 1100px) {
  .hl-seite { grid-template-columns: minmax(0, 1fr); }
  
  .hl-wege { flex-direction: row; flex-wrap: wrap; }
  .hl-weg { flex: 1 1 220px; }
}
@media (max-width: 1239px) {
  .bw-vorschau-spalte .ks-etikett small { display: none; }
}
@media (pointer: coarse) {
  .hl-weg { min-height: 48px; }
}

.tut-abschnitt + .tut-abschnitt { margin-top: 28px; }
.tut-abschnitt > .meldung { margin: 0; }
.tut-abschnitt > .meldung p { margin: 0 0 6px; }
.tut-abschnitt > .meldung p:last-child { margin: 0; }
.neu .tut-kopf {
  
  flex-direction: row;
  padding: 24px 26px; gap: 28px;
  background:
    radial-gradient(60% 140% at 100% 0%, rgb(127 196 236 / .22), transparent 70%),
    #fff;
}
.neu .tut-kopf-text h2 {
  margin: 0 0 8px;
  font-size: 22px; font-weight: 700; line-height: 1.25; letter-spacing: -.02em;
  text-wrap: balance;
}
.neu .tut-kopf-text p { font-size: 13.5px; color: var(--n-leise); }

.neu .tut-stand {
  flex: 0 0 200px; text-align: left;
  padding: 14px 16px; border-radius: var(--n-rund-klein);
  background: #fff; box-shadow: inset 0 0 0 1px var(--n-linie);
}
.neu .tut-stand .label {
  margin: 0 0 6px;
  font-size: 11.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--n-leise);
}
.neu .tut-stand .wert {
  font-size: 32px; font-weight: 700; line-height: 1.1; letter-spacing: -.03em;
  color: var(--n-tinte); font-variant-numeric: tabular-nums;
}
.neu .tut-stand .von { font-size: 18px; font-weight: 600; color: var(--n-leise); letter-spacing: -.01em; }
.tut-stand-balken { margin-top: 12px; }

.tut-raster {
  display: grid; gap: 16px; align-items: stretch;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 380px), 1fr));
}
.neu .tut-kapitel .karte-kopf { gap: 10px; margin-bottom: 6px; }
.neu .tut-kapitel .karte-kopf h2 { font-size: 15px; font-weight: 650; }
.neu .tut-kapitel .karte-kopf h2 a { color: inherit; }
.neu .tut-kapitel .karte-kopf h2 a:hover { color: var(--n-blau-tief); }
.neu .tut-nummer {
  width: 28px; height: 28px; border-radius: 8px;
  background: var(--n-blau-flaeche); color: var(--n-blau-tief);
  font-size: 12.5px; font-variant-numeric: tabular-nums;
}
.neu .tut-schritt.gelesen .tut-nummer { background: var(--n-gut-flaeche); color: var(--n-gut-text); }
.neu .tut-kurz { color: var(--n-leise); }
.neu .tut-liste li { padding: 8px 0; border-bottom-color: var(--n-linie-fein); }
.neu .tut-liste .marke {
  width: 22px; height: 22px; border-radius: 7px;
  
  box-shadow: none;
  background: var(--n-flaeche); color: var(--n-leise); font-variant-numeric: tabular-nums;
}
.neu .tut-liste li.gelesen .marke { background: var(--n-gut-flaeche); color: var(--n-gut-text); }
.neu .tut-liste a { color: var(--n-tinte); font-weight: 500; }
.neu .tut-liste a:hover { color: var(--n-blau-tief); }
.neu .tut-liste li.gelesen a { color: var(--n-leise); }

.neu .tut-schritt { padding: 22px 24px; scroll-margin-top: calc(var(--n-kopf-hoehe) + 16px); }
.neu .tut-schritt .karte-kopf { margin-bottom: 14px; }
.neu .tut-schritt .karte-kopf h2 { font-size: 16px; }
.neu .tut-text p { color: var(--n-tinte); }
.neu .tut-bild img { border-color: var(--n-linie); background: var(--n-feld); }
.neu .tut-bild-fehlt { border-radius: 12px; background: var(--n-feld); border-color: var(--n-linie); }
.neu .tut-bild figcaption { color: var(--n-leise); }
.neu .tut-haken { border-top-color: var(--n-linie-fein); }
.neu .tut-weiter { margin-top: 24px; }

.nu-ausgabe .ks-karte-kopf { flex-wrap: wrap; }
.nu-ausgabe.nu-neu { border-color: var(--n-blau-linie); box-shadow: inset 3px 0 0 var(--n-blau); }
.nu-einleitung { margin: 12px 0 0; }
.nu-gruppe { margin-top: 18px; }
.nu-gruppe-kopf { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.neu .nu-liste { margin-bottom: 0; }
.nu-text { font-size: 13.5px; line-height: 1.55; }
.neu .nu-art-neu .marke { background: var(--n-gut-flaeche); color: var(--n-gut-text); }
.neu .nu-art-besser .marke { background: var(--n-blau-flaeche); color: var(--n-blau-tief); }

.sch-verwalten {
  display: grid; gap: 16px; align-items: start;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
}
.neu .schulung-abspieler { border-radius: 12px; }
.sch-beschreibung { margin-top: 16px; }
.sch-ordnen { margin-top: 14px; }
.sch-stand-balken { width: 40%; }
.neu .schulung-verwalten > summary { color: var(--n-blau-tief); font-weight: 500; }

.fm-raster {
  display: grid; gap: 24px; align-items: start;
  grid-template-columns: minmax(0, 760px) minmax(240px, 320px);
}
.neu .fm-karte { padding: 24px 26px; }
.fm-kopf { align-items: flex-start; margin-bottom: 20px; }
.neu .fm-kopf .sym {
  width: 40px; height: 40px; flex: none; display: grid; place-items: center;
  border-radius: 11px; background: var(--n-blau-flaeche); color: var(--n-blau-tief);
}
.neu .fm-kopf .sym svg { width: 20px; height: 20px; }
.neu .fm-kopf h2 { margin: 0 0 4px; font-size: 20px; font-weight: 700; letter-spacing: -.02em; }
.neu .fm-kopf .unter { margin: 0; font-size: 13.5px; color: var(--n-leise); }
.fm-rand { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.fm-rand p { margin: 0 0 6px; font-size: 13.5px; line-height: 1.55; color: var(--n-leise); }

.as-spalte { max-width: 860px; }
.neu .as-seite { padding: 22px 24px; border: 1px solid var(--n-linie); border-radius: var(--n-rund); box-shadow: none; }
.as-spalte .ks-abschnitt-kopf > .as-neu-form { flex: none; }

@media (max-width: 1100px) {
  .fm-raster { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 700px) {
  .neu .tut-kopf { padding: 18px; gap: 16px; }
  .neu .tut-stand { flex: 1 1 100%; }
  .neu .tut-kopf-text h2 { font-size: 19px; }
  .neu .tut-schritt, .neu .fm-karte, .neu .as-seite { padding: 16px; }
  .sch-stand-balken { width: auto; min-width: 80px; }
}

.neu .einst-buehne { grid-template-columns: 220px minmax(0, 1fr); gap: 36px; }

.neu .einst-inhalt { max-width: 1100px; }
.neu .einst-spalte { top: calc(var(--n-kopf-hoehe) + 28px); gap: 24px; }
.neu .einst-gruppe-titel {
  padding: 0 12px 8px;
  font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--n-leise);
}
.neu .einst-punkt {
  min-height: 38px; padding: 8px 12px; border-radius: var(--n-rund-knopf);
  font-size: 14px; font-weight: 500; color: var(--n-tinte);
}
.neu .einst-punkt-zeichen { color: var(--n-leise); transition: color var(--dauer) var(--kurve); }
.neu .einst-punkt:hover { background: var(--n-flaeche); color: var(--n-tinte); }
.neu .einst-punkt:hover .einst-punkt-zeichen { color: var(--n-blau); }
.neu .einst-punkt.aktiv {
  background: var(--n-blau-flaeche); color: var(--n-blau-tief); font-weight: 600;
  box-shadow: inset 0 0 0 1px var(--n-blau-linie);
}
.neu .einst-punkt.aktiv .einst-punkt-zeichen { color: var(--n-blau); }

.neu .einst-kopf { margin: 40px 0 16px; }
.neu .einst-inhalt > .einst-kopf:first-child,
.neu .einst-inhalt > .meldung + .einst-kopf,
.neu .einst-inhalt > .register + .einst-kopf { margin-top: 0; }
.neu .einst-kopf h2 {
  display: flex; align-items: center; gap: 16px; min-height: 20px;
  font-size: 11.5px; font-weight: 700; line-height: 1;
  letter-spacing: .14em; color: var(--n-tinte);
}
.neu .einst-kopf h2::after { content: ''; flex: 1; height: 1px; background: var(--n-linie); }
.neu .einst-kopf p { margin: 10px 0 0; font-size: 13px; color: var(--n-leise); max-width: 78ch; }

.neu .einst-satz { font-size: 13px; color: var(--n-leise); }
.neu .einst-satz strong { color: var(--n-tinte); font-weight: 600; }
.neu .einst-anbau { border-top-color: var(--n-linie-fein); }

.neu .feld-warum-zeichen { background: var(--n-flaeche); color: var(--n-leise); }
.neu .feld-warum > summary:hover .feld-warum-zeichen,
.neu .feld-warum[open] .feld-warum-zeichen { background: var(--n-blau-voll); color: #fff; }
.neu .feld-warum-text {
  background: var(--n-feld); color: var(--n-leise);
  border-left-color: var(--n-blau); border-radius: 0 var(--n-rund-klein) var(--n-rund-klein) 0;
}
.neu .feld-warum-text .stark { color: var(--n-tinte); }

.neu .einst-inhalt .karte.klapp { padding: 16px 22px; }
.neu .einst-inhalt .karte.klapp > summary { min-height: 34px; gap: 12px; }
.neu .einst-inhalt .karte.klapp > summary h2 { font-size: 15px; font-weight: 650; letter-spacing: -.01em; }
.neu .einst-inhalt .karte.klapp > summary .klapp-wert {
  flex: 0 1 auto; height: 24px; line-height: 24px; padding: 0 10px;
  border-radius: 999px; background: var(--n-flaeche);
  font-size: 12px; font-weight: 500; color: var(--n-leise);
}
.neu .einst-inhalt .karte.klapp > summary .klapp-wert::before { content: none; }
.neu .einst-inhalt .karte.klapp > summary .klein { font-size: 12.5px; color: var(--n-leise); }
.neu .einst-inhalt .karte.klapp > summary::after { border-color: var(--n-leise); }
.neu .einst-inhalt .karte.klapp[open] > summary { margin-bottom: 18px; padding-bottom: 16px; border-bottom-color: var(--n-linie-fein); }

.vb-gitter {
  display: grid; gap: 16px;
  grid-template-columns: repeat(auto-fill, minmax(196px, 1fr));
}
.vb-karte {
  display: grid; grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "marke" "stand" "knopf";
  align-items: center; gap: 12px;
  padding: 18px 18px 16px;
  background: #fff; border: 1px solid var(--n-linie); border-radius: var(--n-rund);
  transition: border-color var(--dauer) var(--kurve);
}
.vb-karte:hover { border-color: #d3d6dd; }
.vb-karte.vb-verbunden { border-color: #b9e6cb; }
.vb-marke {
  grid-area: marke; min-width: 0;
  display: flex; align-items: center; gap: 9px; min-height: 40px;
}
.vb-marke svg { width: 28px; height: 28px; flex: none; }
.vb-marke-wort { gap: 0; }

.vb-marke svg.vb-logo-propstack { width: auto; max-width: 100%; height: 19px; color: #14181d; }

.vb-marke svg.vb-logo-claude { width: 26px; height: 26px; color: #d97757; }
.vb-karte.vb-aus .vb-marke { opacity: .45; filter: grayscale(1); }
.vb-wort { font-size: 18px; font-weight: 700; letter-spacing: -.02em; color: var(--n-tinte); white-space: nowrap; }
.vb-wort b { font-weight: 700; }
.vb-onoffice { font-weight: 500; }
.vb-flowfact {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 6px 11px; border-radius: 4px;
  background: #14181d; color: #fff;
  font-size: 14px; font-weight: 800; letter-spacing: .05em;
}
.vb-flowfact svg { width: 14px; height: 14px; }
.vb-facebook { color: #1877f2; font-weight: 800; }
.vb-empro { color: #1e3a34; position: relative; }
.vb-empro svg { width: 9px; height: 9px; vertical-align: super; margin-left: 2px; }
.vb-in { display: inline-block; margin-left: 1px; padding: 0 3px; border-radius: 4px; background: #0a66c2; color: #fff; }
.vb-karte > .vb-stand { grid-area: stand; justify-self: start; }
.vb-knopf {
  grid-area: knopf; margin-top: 4px;
  display: inline-flex; align-items: center; justify-content: center;
  height: 36px; padding: 0 14px;
  border: 1px solid var(--n-blau-linie); border-radius: var(--n-rund-knopf);
  background: var(--n-blau-flaeche); color: var(--n-blau-tief);
  font: inherit; font-size: 13px; font-weight: 600;
  text-decoration: none; cursor: pointer;
  transition: background-color var(--dauer) var(--kurve), border-color var(--dauer) var(--kurve);
}

.vb-dialog form > .hilfe { margin-top: 10px; font-size: 12.5px; color: var(--n-leise); }
.vb-knopf:hover { background: #dcedfa; border-color: #b7d8f0; }
.vb-knopf.vb-leise { border-color: var(--n-linie); background: #fff; color: var(--n-tinte); }
.vb-knopf.vb-leise:hover { background: var(--n-feld); border-color: #d3d6dd; }
.vb-fuss { margin: 14px 0 0; }

.vb-dialog {
  width: min(680px, calc(100vw - 32px)); padding: 0;
  border: 0; border-radius: var(--n-rund);
  box-shadow: 0 0 0 1px var(--n-linie), 0 24px 64px rgb(16 24 40 / .18);
}
.vb-dialog::backdrop { background: rgb(16 24 40 / .40); }
.vb-dialog-kopf {
  display: flex; align-items: center; gap: 12px;
  padding: 16px 20px; border-bottom: 1px solid var(--n-linie);
}
.vb-dialog-kopf h3 { flex: 1; margin: 0; font-size: 16px; font-weight: 650; letter-spacing: -.01em; color: var(--n-tinte); }
.vb-dialog-zu {
  width: 36px; height: 36px; flex: none; display: grid; place-items: center;
  border: 0; border-radius: 50%; padding: 0;
  background: var(--n-flaeche); color: var(--n-tinte);
  font-size: 22px; line-height: 1; cursor: pointer;
  transition: background-color var(--dauer) var(--kurve);
}
.vb-dialog-zu:hover { background: var(--n-abzeichen); }
.vb-dialog-rumpf { padding: 18px 20px 20px; max-height: 72vh; overflow: auto; }

.neu .einst-inhalt .reihe { gap: 16px; margin-bottom: 16px; }

.konto-plan {
  display: grid; gap: 16px; margin-bottom: 16px;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
}
.neu .konto-plan > .reihe { margin: 0; }
.konto-plan .karte { height: 100%; }
.konto-plan .karte-kopf + .ks-klein-etikett { margin-top: 4px; }
.konto-plan .ks-gross { margin-top: 6px; }
.konto-plan .ks-karte-unter strong { color: var(--n-tinte); }
.konto-plan-satz { margin-top: 14px; }
.konto-plan-satz:empty { display: none; }

.neu .profil-anker-band { background: var(--n-feld); border-bottom-color: var(--n-linie); }
.neu .profil-anker-wer h2 { font-size: 19px; font-weight: 650; letter-spacing: -.02em; }
.neu .profil-anker-rolle { color: var(--n-leise); }

.einst-inhalt .tabelle td.schmal > .knopf-reihe { flex-wrap: nowrap; }
.einst-inhalt .tabelle td > form[action$="/einrichtung"] {
  display: flex; flex-direction: column; align-items: flex-start; gap: 6px;
}
.einst-inhalt .tabelle td.schmal > .knopf-reihe { gap: 4px; }
.einst-inhalt .tabelle td.schmal > .knopf-reihe .knopf.klein { padding-left: 10px; padding-right: 10px; }
.einst-inhalt .tabelle td.leise { overflow-wrap: anywhere; }
.einst-inhalt .tabelle td .pille { white-space: nowrap; }

.abs-nummer {
  display: inline-grid; place-items: center; flex: none;
  width: 26px; height: 26px; border-radius: 50%;
  background: var(--n-flaeche); color: var(--n-leise);
  font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums;
}
.abs-nummer.aktiv { background: var(--n-blau-voll); color: #fff; box-shadow: 0 0 0 4px var(--n-blau-flaeche); }
.abs-nummer.fertig { background: var(--n-gut-flaeche); color: var(--n-gut-text); }
.abs-nummer + div > .stark:first-child { font-size: 15px; font-weight: 650; letter-spacing: -.01em; margin-top: 2px; }
.abs-domain {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0 14px; align-items: end;
}
.abs-domain > .feld { margin-bottom: 12px; }
.abs-domain-knopf { grid-column: 1 / -1; }
@media (max-width: 700px) {
  .abs-domain { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 1180px) {
  .neu .einst-buehne { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .neu .einst-inhalt { max-width: none; }
  .neu .einst-spalte {
    padding: 4px; gap: 4px;
    background: #fff; border: 1px solid var(--n-linie); border-radius: 12px; box-shadow: none;
  }
  .neu .einst-punkt { min-height: 36px; padding: 7px 13px; border-radius: 9px; font-size: 13.5px; }
}
@media (pointer: coarse), (max-width: 900px) {
  .neu .einst-punkt { min-height: 44px; }
  .vb-knopf, .vb-dialog-zu { min-height: 44px; }
  .vb-dialog-zu { width: 44px; }
}
@media (max-width: 560px) {
  .neu .einst-inhalt .karte.klapp { padding: 14px 16px; }
  .vb-gitter { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .vb-karte { gap: 10px; padding: 14px; }
  .vb-wort { font-size: 16px; white-space: normal; overflow-wrap: anywhere; min-width: 0; }
  .vb-knopf { height: auto; padding-top: 8px; padding-bottom: 8px; text-align: center; }
}

.vertretung-form input[type=date], .vertretung-form .dwahl { width: 148px; }

.ks-tor-kachel {
  width: 30px; height: 30px; flex: none;
  display: grid; place-items: center; overflow: hidden;
  border-radius: 8px;
  background: var(--n-blau-verlauf);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .5), inset 0 0 0 1px rgb(255 255 255 / .2);
}
.ks-tor-kachel img { width: 60%; height: auto; display: block; }
.ks-tor-kachel.ks-gross { width: 40px; height: 40px; border-radius: 11px; }
.ks-tor-zeichen {
  display: flex; align-items: center; gap: 10px; min-width: 0;
  color: var(--n-tinte); text-decoration: none;
}
.ks-tor-wortmarke { font-size: 16.5px; font-weight: 700; letter-spacing: -.025em; line-height: 1.2; }
.ks-tor-unter { font-size: 12.5px; color: var(--n-leise); line-height: 1.3; }

.ks-tor {
  min-height: 100vh;
  display: grid; place-items: center;
  padding: 40px 16px;
  background: var(--n-grund);
}
.ks-tor-karte {
  width: 100%; max-width: 420px; min-width: 0;
  padding: 32px;
  background: #fff;
  border: 1px solid var(--n-linie); border-radius: var(--n-rund);
  box-shadow: 0 1px 2px rgb(16 24 40 / .04);
}
.ks-tor-karte.ks-breit { max-width: 480px; }
.ks-tor-karte h1 {
  margin: 28px 0 0;
  font-size: 22px; font-weight: 700; letter-spacing: -.02em; line-height: 1.25;
}
.ks-tor-text { margin: 8px 0 0; font-size: 14px; line-height: 1.6; color: var(--n-leise); }
.ks-tor-text b { color: var(--n-tinte); font-weight: 600; }
.ks-tor-karte .meldung { margin: 18px 0 0; }
.ks-tor-karte .meldung a { color: inherit; font-weight: 600; }

.ks-tor-karte label {
  display: block; margin: 18px 0 6px;
  font-size: 13px; font-weight: 600; color: var(--n-tinte);
}
.ks-tor-karte input:not([type=hidden]):not([type=checkbox]) {
  display: block; width: 100%; height: 44px; padding: 0 14px;
  font: inherit; font-size: 15px; color: var(--n-tinte);
  background: var(--n-feld);
  border: 1px solid var(--n-linie); border-radius: var(--n-rund-knopf);
  transition: border-color var(--dauer) var(--kurve), background-color var(--dauer) var(--kurve);
}
.ks-tor-karte input:not([type=hidden]):not([type=checkbox]):hover { border-color: #cdd1d8; }

.ks-tor-karte input:not([type=hidden]):not([type=checkbox]):focus { border-color: var(--n-blau); background: #fff; }
.ks-tor-hilfe { margin: 6px 0 0; font-size: 12.5px; line-height: 1.5; color: var(--n-leise); }

.ks-tor-knopf {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  width: 100%; height: 44px; margin-top: 24px; padding: 0 18px;
  border: 0; border-radius: var(--n-rund-knopf);
  background: var(--n-blau-voll); color: #fff;
  font: inherit; font-size: 14.5px; font-weight: 600;
  text-decoration: none; cursor: pointer;
  transition: background-color var(--dauer) var(--kurve);
}
.ks-tor-knopf:hover { background: var(--n-blau-voll-tief); }
.ks-tor-knopf svg { width: 15px; height: 15px; flex: none; }

.ks-tor-fehler {
  display: flex; align-items: flex-start; gap: 9px;
  margin-top: 16px; padding: 11px 13px;
  border-radius: var(--n-rund-klein);
  background: var(--n-schlecht-flaeche); color: #a3132f;
  font-size: 13px; font-weight: 500; line-height: 1.45;
}
.ks-tor-fehler svg { width: 16px; height: 16px; flex: none; margin-top: 1px; }

.ks-tor-fuss {
  margin-top: 24px; padding-top: 20px;
  border-top: 1px solid var(--n-linie);
  font-size: 12.5px; line-height: 1.55; color: var(--n-leise); text-align: center;
}
.ks-tor-fuss:empty { display: none; }
.ks-tor-fuss p { margin: 0; }
.ks-tor-fuss p + p { margin-top: 6px; }
.ks-tor-fuss a { color: var(--n-blau-tief); font-weight: 600; text-decoration: none; }
.ks-tor-fuss a:hover { text-decoration: underline; text-underline-offset: 3px; }

.ks-tor-fuss .ks-tor-rechts { font-size: 12px; }
.ks-tor-fuss .ks-tor-rechts a { color: var(--n-leise); font-weight: 500; }
.ks-tor-fuss .ks-tor-rechts a:hover { color: var(--n-tinte); }

.ks-tor-rolle {
  display: inline-flex; align-items: center; gap: 4px;
  height: 26px; margin: 14px 0 0; padding: 0 10px;
  border-radius: 999px; background: var(--n-blau-flaeche); color: var(--n-blau-tief);
  font-size: 12.5px;
}
.ks-tor-rolle b { font-weight: 600; }

.ks-tor-etikett { margin: 28px 0 -4px; font-size: 11px; color: var(--n-leise); }
.ks-tor-karte .meldung + .ks-tor-text { margin-top: 14px; }

.ks-bueros-zahl { font-size: 12.5px; color: var(--n-leise); }
.ks-bueros-liste {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px 16px;
  padding: 8px; background: #fff;
  border: 1px solid var(--n-linie); border-radius: var(--n-rund);
}
.ks-buero-zeile {
  position: relative;
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: 12px;
  width: 100%; min-height: 56px; padding: 8px 12px;
  border: 0; border-radius: var(--n-rund-klein);
  background: transparent; color: var(--n-tinte);
  font: inherit; text-align: left; cursor: pointer;
  transition: background-color var(--dauer) var(--kurve);
}
.ks-buero-zeile::before {
  content: ''; position: absolute; left: 0; top: 14px; bottom: 14px;
  width: 3px; border-radius: 3px; background: var(--n-blau);
  opacity: 0; transform: scaleY(.4);
  transition: opacity var(--dauer) var(--kurve), transform var(--dauer) var(--kurve);
}
.ks-buero-zeile:hover { background: var(--n-blau-flaeche); }
.ks-buero-zeile:hover::before { opacity: 1; transform: none; }
.ks-buero-kreis {
  width: 36px; height: 36px; display: grid; place-items: center;
  border-radius: 10px; background: var(--n-blau-flaeche); color: var(--n-blau-tief);
  font-size: 12.5px; font-weight: 700; letter-spacing: .02em;
}
.ks-buero-zeile:hover .ks-buero-kreis { background: #fff; }
.ks-buero-text { display: flex; flex-direction: column; min-width: 0; }
.ks-buero-name {
  font-size: 14px; font-weight: 600;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ks-buero-kuerzel {
  font-size: 12px; color: var(--n-leise);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ks-buero-pfeil {
  width: 16px; height: 16px; color: var(--n-leise);
  transition: transform var(--dauer) var(--kurve), color var(--dauer) var(--kurve);
}
.ks-buero-zeile:hover .ks-buero-pfeil { color: var(--n-blau); transform: translateX(2px); }
@media (min-width: 1100px) {
  .ks-bueros-liste { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.ks-frage { max-width: 520px; margin: 24px auto 0; padding: 28px; text-align: center; }
.ks-frage-zeichen {
  width: 44px; height: 44px; margin: 0 auto 14px;
  display: grid; place-items: center;
  border-radius: 12px; background: var(--n-blau-flaeche); color: var(--n-blau);
}
.ks-frage-zeichen svg { width: 22px; height: 22px; }
.ks-frage h2 { margin: 0; font-size: 18px; font-weight: 700; letter-spacing: -.015em; }
.ks-frage p { margin: 8px 0 0; font-size: 14px; line-height: 1.6; color: var(--n-leise); }
.ks-frage-knoepfe { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin-top: 22px; }

.ks-tor-kopfzeile {
  display: flex; align-items: center; gap: 12px;
  height: var(--n-kopf-hoehe); padding: 0 32px;
  background: #fff; border-bottom: 1px solid var(--n-linie);
}
.ks-tor-kopfzeile-rechts { margin-left: auto; display: flex; align-items: center; gap: 8px; min-width: 0; }
.ks-tor-spalte { max-width: 760px; margin: 0 auto; padding: 32px 24px 56px; }

.ks-einr-wo {
  display: inline-flex; align-items: center; height: 28px; padding: 0 11px;
  border-radius: 999px; background: var(--n-flaeche); color: var(--n-leise);
  font-size: 12.5px; font-weight: 500;
}
.ks-einr-titel { margin: 0 0 20px; }
.ks-einr-titel h1 { margin: 0; font-size: 24px; font-weight: 700; letter-spacing: -.02em; line-height: 1.25; }
.ks-einr-titel p { margin: 6px 0 0; font-size: 14px; line-height: 1.55; color: var(--n-leise); }
.ks-einr-titel p:empty { display: none; }
.ks-einr .wegleiste { margin-bottom: 20px; }

.ks-einr { max-width: 900px; }
.ks-einr.ks-einr-schmal { max-width: 520px; }
.ks-einr .meldung { margin-bottom: 20px; }
.ks-einr-abschnitt { margin-bottom: 28px; }
.ks-einr-abschnitt > .karte,
.ks-einr-abschnitt > .reihe,
.reihe > .ks-einr-abschnitt { margin-bottom: 0; }
.ks-einr-meta { font-size: 12.5px; color: var(--n-leise); }
.ks-einr-text { margin: 0 0 16px; font-size: 13.5px; line-height: 1.6; color: var(--n-leise); }
.ks-einr-text:last-child { margin-bottom: 0; }
.ks-einr-text strong, .ks-einr-text b { color: var(--n-tinte); font-weight: 600; }
.ks-einr-text a, .ks-einr-neben a { color: var(--n-blau-tief); font-weight: 600; text-decoration: none; }
.ks-einr-text a:hover, .ks-einr-neben a:hover { text-decoration: underline; text-underline-offset: 3px; }
.ks-einr-neben { margin: 18px 0 0; font-size: 12.5px; color: var(--n-leise); }
.ks-einr-trenner { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--n-linie); }
.ks-einr-voll { width: 100%; }
.ks-einr-weiter { margin-top: 4px; }
.ks-einr-code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; color: var(--n-tinte); }
.ks-einr .feld input.ks-einr-codefeld {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .06em; text-transform: uppercase;
}

.ks-einr-kopf { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 18px; }
.ks-einr-kopf .ks-einr-text { margin: 0; }
.ks-einr-zeichen {
  flex: none; width: 40px; height: 40px; display: grid; place-items: center;
  border-radius: 11px; background: var(--n-blau-flaeche); color: var(--n-blau);
}
.ks-einr-zeichen svg { width: 20px; height: 20px; }

.ks-einr-bild {
  display: grid; place-items: center; height: 96px; margin-bottom: 12px; padding: 12px;
  border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein); background: var(--n-feld);
}
.ks-einr-bild img { max-width: 100%; max-height: 100%; object-fit: contain; display: block; border-radius: 8px; }
.ks-einr-fakten { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ks-einr-fakten .ks-einr-breit { grid-column: 1 / -1; }
.ks-einr-fakten .ks-feld-wert.ks-einr-wert-klein {
  font-size: 14.5px; font-weight: 600; letter-spacing: -.005em;
  white-space: normal; overflow-wrap: anywhere;
}
.ks-einr-farben { gap: 6px; margin-top: 6px; }
.ks-einr-farbe {
  width: 22px; height: 22px; border-radius: 7px;
  box-shadow: inset 0 0 0 1px rgb(16 24 40 / .12);
}

.ks-einr-person { padding: 18px 0 4px; border-top: 1px solid var(--n-linie); }
.ks-einr-person:first-of-type { margin-top: 4px; }
.ks-einr-person-kopf { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.ks-einr-foto {
  width: 36px; height: 36px; flex: none; border-radius: 50%; object-fit: cover;
}
.ks-einr-foto.ks-einr-foto-leer {
  display: grid; place-items: center;
  background: var(--n-blau-flaeche); color: var(--n-blau-tief);
  font-size: 12px; font-weight: 700;
}
.ks-einr-person-name { font-size: 14px; font-weight: 600; color: var(--n-tinte); }
.ks-einr-person .haken { margin: 2px 0 12px; }

.ks-einr .feld textarea.ks-einr-probe { min-height: 110px; }
.ks-einr-adressen { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }

.ks-einr-anleitung li { padding: 10px 0; font-size: 13.5px; line-height: 1.5; align-items: flex-start; }
.ks-einr-anleitung .marke {
  width: 24px; height: 24px; margin-top: -1px;
  background: var(--n-blau-flaeche); color: var(--n-blau-tief); box-shadow: none;
  font-size: 12px; font-weight: 700;
}

.ks-einr-zeilen { display: flex; flex-direction: column; }
.ks-einr-zeile {
  display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 10px 0;
  border-top: 1px solid var(--n-linie-fein);
}
.ks-einr-zeile:first-child { border-top: 0; padding-top: 0; }
.ks-einr-zeile > strong { flex: 1; min-width: 0; font-size: 13.5px; font-weight: 600; overflow-wrap: anywhere; }
.ks-einr-zeile-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ks-einr-zeile-text strong { font-size: 13.5px; font-weight: 600; }
.ks-einr-zeile-text span { font-size: 12.5px; line-height: 1.5; color: var(--n-leise); }
.ks-einr-aufgabe { padding-left: 14px; position: relative; }
.ks-einr-aufgabe::before {
  content: ''; position: absolute; left: 0; top: 17px; width: 6px; height: 6px;
  border-radius: 50%; background: var(--n-blau);
}
.ks-einr-zeile.ks-einr-aufgabe:first-child::before { top: 7px; }

.ks-einr-achtung { box-shadow: inset 3px 0 0 #c9930f, 0 0 0 1px var(--n-gelb-linie); }
.ks-einr .feld textarea.ks-einr-dnstext {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; line-height: 1.55;
}

.ks-einr-warten {
  display: flex; flex-direction: column; justify-content: center;
  border: 1px dashed var(--n-linie); border-radius: var(--n-rund-klein); background: var(--n-feld);
}
.ks-einr-mailplatz { height: 722px; }
.ks-einr-mailplatz.leer { padding: 26px 24px; }
.mailrahmen.ks-einr-mailplatz iframe { height: 720px; }
.ks-einr-ratgeberplatz { min-height: calc(var(--zeilen) * 60px + 64px); display: flex; flex-direction: column; }
.ks-einr-ratgeberplatz > * { flex: 1 1 auto; }
.ks-einr-ratgeber-zeile {
  display: flex; align-items: center; gap: 12px; height: 60px;
  border-top: 1px solid var(--n-linie-fein);
}
.ks-einr-ratgeber-zeile:first-child { border-top: 0; }
.ks-einr-ratgeber-zeichen {
  width: 34px; height: 34px; flex: none; display: grid; place-items: center;
  border-radius: 10px; background: var(--n-blau-flaeche); color: var(--n-blau);
}
.ks-einr-ratgeber-zeichen svg { width: 18px; height: 18px; }
.ks-einr-ratgeber-text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ks-einr-ratgeber-text strong {
  font-size: 13.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ks-einr-ratgeber-text span {
  font-size: 12.5px; color: var(--n-leise); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ks-einr-ratgeber .meldung { margin: 12px 0 0; }

@media (max-width: 720px) {
  .ks-einr-adressen { grid-template-columns: minmax(0, 1fr); }
  .ks-einr-mailplatz { height: 482px; }
  .mailrahmen.ks-einr-mailplatz iframe { height: 480px; }
  .ks-einr-ratgeber-zeile .ks-einr-meta { display: none; }
  
  .ks-einr-ratgeberplatz { min-height: calc(var(--zeilen) * 60px + 100px); }
}

@media (max-width: 560px) {
  .ks-tor-kopfzeile { padding: 0 16px; }
  .ks-tor-spalte { padding: 20px 16px 40px; }
}

@media (max-width: 440px) {
  .ks-tor { padding: 20px 12px; place-items: start center; }
  .ks-tor-karte { padding: 24px 20px; }
  .ks-tor-karte h1 { margin-top: 24px; font-size: 21px; }
}

.ks-bald { max-width: 600px; margin: 0 auto; }
.ks-bald-karte { padding: 32px 32px 24px; text-align: center; }

.ks-bald-sym {
  width: 56px; height: 56px; margin: 0 auto 16px;
  display: grid; place-items: center;
  border-radius: var(--n-rund); background: var(--n-blau-verlauf); color: #fff;
}
.ks-bald-sym svg { width: 26px; height: 26px; stroke-width: 1.8; }
.ks-bald-pille { background: var(--n-blau-flaeche); color: var(--n-blau-tief); margin-bottom: 14px; }
.ks-bald-pille svg { width: 13px; height: 13px; stroke-width: 2; }
.ks-bald-karte h2 {
  margin: 0 0 10px;
  font-size: 22px; font-weight: 700; line-height: 1.25; letter-spacing: -.02em;
  text-wrap: balance;
}
.ks-bald-dazu {
  max-width: 48ch; margin: 0 auto;
  font-size: 14px; line-height: 1.6; color: var(--n-leise);
}

.ks-bald-kopf { margin-top: 24px; text-align: left; }
.ks-bald-liste {
  list-style: none; margin: 10px 0 0; padding: 0;
  display: grid; gap: 8px; text-align: left;
}
.ks-bald-liste li {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 11px 14px; border-radius: var(--n-rund-klein);
  background: var(--n-flaeche);
  font-size: 13.5px; line-height: 1.5;
}
.ks-bald-liste svg {
  width: 16px; height: 16px; flex: none; margin-top: 2px;
  color: var(--n-blau); stroke-width: 2.2;
}
.ks-bald-knoepfe { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.ks-bald-fuss { margin-top: 24px; }
@media (max-width: 560px) {
  .ks-bald-karte { padding: 24px 18px 18px; }
  .ks-bald-karte h2 { font-size: 19px; }
  
  .ks-bald-knoepfe { flex-direction: column; }
  .ks-bald-knoepfe > a { height: 44px; }
}

.ks-sozial { display: flex; flex-direction: column; gap: 32px; min-width: 0; }
.ks-sozial .meldung { margin: 0; }
.ks-sozial .meldung p { margin: 0; }
.ks-sozial .meldung p + p { margin-top: 8px; }
.ks-sozial .knopf-reihe { margin: 0; align-items: center; }
.ks-sozial .leer { margin: 0; }

.sz-klapp > summary {
  display: flex; align-items: center; flex-wrap: wrap; gap: 10px 12px;
  min-height: 34px; list-style: none; cursor: pointer;
  border-radius: var(--n-rund-knopf);
}
.sz-klapp > summary::-webkit-details-marker { display: none; }
.sz-klapp-kopf .ks-etikett { flex: 1 1 160px; }
.sz-klapp-kopf > .pille { flex: none; }
.sz-klapp-pfeil {
  flex: none; display: grid; place-items: center;
  width: 32px; height: 32px; box-sizing: border-box;
  border: 1px solid var(--n-linie); border-radius: 9px;
  background: #fff; color: var(--n-leise);
  transition: background-color var(--dauer) var(--kurve), border-color var(--dauer) var(--kurve), color var(--dauer) var(--kurve);
}
.sz-klapp-pfeil svg { transition: transform var(--dauer) var(--kurve); }
.sz-klapp > summary:hover .sz-klapp-pfeil { background: var(--n-feld); border-color: #d3d6dd; color: var(--n-tinte); }
.sz-klapp[open] > summary .sz-klapp-pfeil svg { transform: rotate(180deg); }
.sz-klapp-inhalt { display: flex; flex-direction: column; gap: 16px; margin-top: 16px; min-width: 0; }

.sz-einrichtung { container: sz-einrichtung / inline-size; }
.ks-sozial .einrichtung { padding: 16px 18px; }
.ks-sozial .einrichtung[open] > summary { margin-bottom: 16px; padding-bottom: 14px; border-bottom-color: var(--n-linie-fein); }
.ks-sozial .einricht-stand { font-size: 12.5px; }
.ks-sozial .einricht-stand .ist-da { color: var(--n-gut-text); }
.ks-sozial .einricht-stand .fehlt-noch { color: var(--n-gelb-text); }
.ks-sozial .einricht-teile { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
@container sz-einrichtung (min-width: 640px) {
  .ks-sozial .einricht-teile { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  
  .ks-sozial .einricht-teile.sz-teile-3 > :nth-child(3) { grid-column: 1 / -1; }
}
@container sz-einrichtung (min-width: 1040px) {
  
  .ks-sozial .einricht-teile.sz-teile-3 { grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); }
  .ks-sozial .einricht-teile.sz-teile-3 > :nth-child(3) { grid-column: 2; grid-row: 1 / span 2; }
}
.sz-teil {
  display: flex; flex-direction: column; gap: 12px; min-width: 0;
  padding: 16px 18px 18px;
  background: var(--n-feld); border: 1px solid var(--n-linie-fein); border-radius: var(--n-rund-klein);
}
.sz-teil-kopf { flex-wrap: wrap; min-height: 24px; }
.sz-teil-satz { margin: 0; font-size: 13px; line-height: 1.5; color: var(--n-leise); }
.sz-teil-satz .stark { color: var(--n-tinte); }

.ks-sozial .sz-teil-fuss { margin-top: auto; padding-top: 2px; }
.ks-sozial .sz-teil-hilfe { margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--n-leise); }
.sz-konto { display: flex; flex-direction: column; gap: 4px; }
.sz-konto-name { font-size: 15px; font-weight: 650; letter-spacing: -.01em; overflow-wrap: anywhere; }
.sz-farben { display: flex; flex-direction: column; gap: 8px; }
.sz-farben-punkte { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.sz-farbpunkt {
  width: 22px; height: 22px; flex: none; border-radius: 50%;
  box-shadow: inset 0 0 0 1px rgb(16 24 40 / .14), 0 0 0 2px #fff;
}
.sz-farben-art { margin-left: 4px; font-size: 13.5px; font-weight: 600; }
.sz-mehr > summary {
  display: inline-flex; align-items: center; min-height: 28px;
  font-size: 13px; font-weight: 600; color: var(--n-blau-tief); cursor: pointer;
}
.sz-mehr > summary:hover { text-decoration: underline; text-underline-offset: 3px; }
.sz-mehr[open] > summary { margin-bottom: 4px; }
.sz-weg { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; }
.sz-vorlagen { gap: 8px; }
.sz-teil .foto-kachel { border: 1px solid var(--n-linie); border-radius: 10px; background: #fff; overflow: hidden; }
.sz-teil .foto-bild { border-radius: 0; background: var(--n-flaeche); }
.sz-hochladen { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }

.sz-hochladen > input[type=file]:not(.datei-echt),
.sz-hochladen > .datei-huelle { flex: 1 1 220px; min-width: 0; }
.sz-vermessen { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; }

.sz-objekte { gap: 16px; }
.ks-sozial .objekt-galerie > summary {
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 36px; box-sizing: border-box; padding: 0 12px 0 14px;
  border: 1px solid var(--n-linie); border-radius: var(--n-rund-knopf);
  background: #fff; color: var(--n-tinte); font-size: 13px; font-weight: 600;
}
.ks-sozial .objekt-galerie > summary:hover { background: var(--n-feld); border-color: #d3d6dd; }
.ks-sozial .objekt-galerie .auf-pfeil { color: var(--n-leise); }
.ks-sozial .objekt-galerie[open] > summary { margin-bottom: 16px; }
.sz-galerie {
  display: grid; gap: 14px;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 176px), 1fr));
}
.sz-objekt {
  display: flex; flex-direction: column; min-width: 0; overflow: hidden;
  background: #fff; border: 1px solid var(--n-linie); border-radius: var(--n-rund-klein);
}

.sz-objekt-bild {
  display: block; width: 100%; height: auto; aspect-ratio: 4 / 3;
  object-fit: cover; background: var(--n-flaeche);
}
.sz-ohne-foto {
  display: grid; place-content: center; justify-items: center; gap: 6px;
  color: var(--n-leise); font-size: 12px;
}
.sz-objekt-text { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px 12px; }
.sz-objekt-titel { font-size: 13.5px; font-weight: 650; line-height: 1.3; letter-spacing: -.01em; }
.sz-objekt-lage { font-size: 12px; color: var(--n-leise); }
.sz-objekt-pillen { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }

.sz-fortschritt { display: flex; flex-direction: column; gap: 14px; }
.sz-fortschritt-text { display: flex; flex-direction: column; gap: 4px; }
.sz-fortschritt-titel { font-size: 14.5px; font-weight: 650; }

.sz-posts {
  display: grid; gap: 16px; align-items: start;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr));
}
.ks-karte.sz-post { padding: 0; overflow: hidden; }

.sz-posts > .sz-post-skelett { width: 100%; border-radius: var(--n-rund); }
.sz-post-folien {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1px;
  background: var(--n-linie-fein); border-bottom: 1px solid var(--n-linie-fein);
}
.sz-post-folie { margin: 0; background: #fff; min-width: 0; }
.sz-post-folie img {
  display: block; width: 100%; height: auto; aspect-ratio: 4 / 5;
  object-fit: cover; background: var(--n-flaeche);
}
.sz-post-folie figcaption {
  display: flex; align-items: center; gap: 6px; min-height: 32px;
  padding: 0 12px; font-size: 12px; color: var(--n-leise);
}
.sz-post-folie figcaption a {
  margin-left: auto; font-weight: 600; color: var(--n-blau-tief); text-decoration: none; white-space: nowrap;
}
.sz-post-folie figcaption a:hover { text-decoration: underline; text-underline-offset: 3px; }
.sz-post-text { display: flex; flex-direction: column; gap: 12px; padding: 16px 18px 18px; }
.sz-post-titel { margin: 0; font-size: 14.5px; font-weight: 650; line-height: 1.3; letter-spacing: -.01em; }
.sz-post-lage { margin-top: -10px; font-size: 12.5px; color: var(--n-leise); }
.sz-pruefung { margin: 6px 0 0; padding-left: 18px; }
.sz-post-form .feld { margin-bottom: 12px; }
.ks-sozial .sz-post-form textarea { min-height: 180px; font-size: 13px; line-height: 1.5; }

.ks-karte.sz-liste { padding: 6px 10px; }
.sz-zeile {
  position: relative;
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto;
  grid-template-areas: "bild text stand";
  align-items: start; gap: 16px;
  padding: 14px 12px;
  border-top: 1px solid var(--n-linie-fein); border-radius: var(--n-rund-klein);
  transition: background-color var(--dauer) var(--kurve);
}
.sz-zeile:first-child { border-top: 0; }
.sz-zeile > :first-child { grid-area: bild; }
.sz-zeile-text { grid-area: text; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.sz-zeile-stand { grid-area: stand; }
.sz-zeile-titel { margin: 0; font-size: 14.5px; font-weight: 650; line-height: 1.35; letter-spacing: -.01em; overflow-wrap: anywhere; }
.sz-zeile-unter { margin: -6px 0 0; font-size: 12.5px; color: var(--n-leise); }
.sz-kalender-zeile::before {
  content: ''; position: absolute; left: 0; top: 14px; bottom: 14px;
  width: 3px; border-radius: 3px; background: var(--n-blau);
  opacity: 0; transform: scaleY(.4);
  transition: opacity var(--dauer) var(--kurve), transform var(--dauer) var(--kurve);
}
.sz-kalender-zeile:hover { background: var(--n-blau-flaeche); }
.sz-kalender-zeile:hover + .sz-zeile { border-top-color: transparent; }
.sz-kalender-zeile:hover::before { opacity: 1; transform: none; }
.sz-kalender-zeile:target { background: var(--n-blau-flaeche); }
.sz-bild-link { display: block; border-radius: 8px; }
.sz-bild-link img,
.sz-paar img,
.sz-zeile-bild {
  display: block; width: 56px; height: 70px; object-fit: cover;
  border-radius: 8px; background: var(--n-flaeche); box-shadow: 0 0 0 1px var(--n-linie);
}
.sz-paar { display: flex; gap: 6px; }
.sz-paar img { width: 64px; height: 80px; }
.ks-sozial .beitrag-link { color: inherit; text-decoration: none; }
.ks-sozial .beitrag-link:hover { color: var(--n-blau-tief); text-decoration: underline; text-underline-offset: 3px; }
.sz-liste-fuss { margin: 4px 12px 10px; }
.sz-kalender-zeile:hover .pille.marke { background: #fff; }

.sz-plan-form { display: flex; flex-direction: column; gap: 4px; max-width: 760px; }
.ks-sozial .knopf-reihe.sz-schnellwahl { margin-bottom: 10px; }
.ks-sozial .sz-mehr > summary { color: var(--n-blau-tief); }

.sz-beitrag-buehne {
  display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
  align-items: start; gap: 28px;
}
.sz-beitrag-buehne.sz-ein-bild { grid-template-columns: minmax(0, 400px) minmax(0, 1fr); }
.sz-beitrag-rechts { display: flex; flex-direction: column; gap: 28px; min-width: 0; }
.sz-folien {
  display: grid; gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
}
.sz-folien .folie img,
.sz-folien .folie .fehlt { border-color: var(--n-linie); border-radius: var(--n-rund-klein); }
.sz-folien .folie .fehlt { background: var(--n-feld); color: var(--n-leise); }
.sz-folien .folie figcaption { color: var(--n-leise); }
.sz-bildkarte { gap: 14px; padding: 12px; }
.sz-li-gross {
  display: block; width: 100%; height: auto; aspect-ratio: 4 / 5;
  object-fit: cover; border-radius: 10px; background: var(--n-flaeche);
}
.sz-stand { gap: 12px; }
.sz-stand .ks-karte-kopf { flex-wrap: wrap; }

.sz-stand .ks-karte-kopf > .pille { margin-left: auto; }
.sz-stand .ks-karte-kopf > .pille:not(.gut):not(.schlecht):not(.leise) { background: var(--n-blau-flaeche); color: var(--n-blau-tief); }
.sz-stand .ks-meta { margin-top: 4px; }
.ks-sozial .beitrag-text { font-size: 14px; line-height: 1.65; color: var(--n-tinte); }
.ks-sozial .knopf-reihe.sz-text-fuss { margin-top: 14px; }
.sz-formkarte form { max-width: 760px; }
.sz-formkarte .feld { margin-bottom: 16px; }
.ks-sozial .sz-formkarte > .meldung { margin-bottom: 16px; }

.sz-li-bild { display: block; width: 72px; height: 90px; object-fit: cover; border-radius: 8px; box-shadow: 0 0 0 1px var(--n-linie); }
.sz-bild-link .sz-li-bild { width: 72px; height: 90px; }
div.sz-li-bild { box-shadow: none; }

.ks-suchformular { display: flex; flex-direction: column; gap: 32px; min-width: 0; }
.ks-suchformular > .reihe { margin-bottom: 0; }
.ks-suchformular .meldung { margin: 0; }

.ks-suchformular > .bw-abschnitt + .bw-abschnitt { margin-top: 0; }

.ks-suchformular .reihe.werkbank { gap: 32px 24px; }

.ks-suchformular .reihe.werkbank > .live-spalte { top: calc(var(--n-kopf-hoehe) + 16px); }
.ks-suchformular .mw-objekte { gap: 16px; }
.sf-beschriftung { display: block; margin-bottom: 8px; font-size: 13px; font-weight: 600; color: var(--n-tinte); }
.ks-suchformular .bw-aussehen .bw-farbe:last-of-type { margin-bottom: 0; }
.sf-bauer { gap: 4px; }
.sf-bauer > .ks-karte-unter { margin-bottom: 6px; max-width: 78ch; }
.ks-suchformular details.baustein { padding: 4px 0; border-bottom-color: var(--n-linie-fein); }
.ks-suchformular details.baustein > summary {
  min-height: 44px; padding: 0 10px; margin: 0 -10px;
  border-radius: var(--n-rund-klein);
  transition: background-color var(--dauer) var(--kurve);
}
.ks-suchformular details.baustein > summary:hover { background: var(--n-feld); }
.ks-suchformular details.baustein > summary .name { font-size: 14.5px; font-weight: 650; }
.ks-suchformular .sf-schritte { margin: 4px 0 12px; gap: 0; }
.ks-suchformular .sf-schritte > li {
  min-height: 44px; padding: 4px 10px; border-radius: 10px;
  grid-template-columns: minmax(0, 1fr) auto 64px;
}
.ks-suchformular .sf-schritte > li:nth-child(odd) { background: var(--n-feld); }
.ks-suchformular .sf-schritte > li:hover { background: var(--n-blau-flaeche); }
.ks-suchformular .sf-haken { font-size: 13.5px; color: var(--n-tinte); }
.ks-suchformular .sf-haken:has(input:not(:checked)) > span { color: var(--n-leise); }
.ks-suchformular .sf-name { color: var(--n-leise); }

.ks-suchformular .sf-platz {
  box-sizing: border-box; height: 34px; padding: 0 6px;
  border: 0; border-radius: 8px; background: #fff; color: var(--n-tinte);
  box-shadow: inset 0 0 0 1px var(--n-linie);
  font: inherit; font-size: 13px; font-variant-numeric: tabular-nums;
}
.ks-suchformular .sf-platz:hover { box-shadow: inset 0 0 0 1px #cbd0d8; }
.ks-suchformular .sf-platz:focus { outline: 0; box-shadow: inset 0 0 0 1px var(--n-blau), 0 0 0 3px var(--n-blau-flaeche); }
.ks-suchformular .sf-bauen-fuss { margin-top: 16px; padding-top: 16px; border-top-color: var(--n-linie-fein); }
.ks-suchformular .sf-bauen-fuss .hilfe { margin: 0; color: var(--n-leise); font-size: 12.5px; }
.ks-suchformular .bw-anfrage-wann a { color: var(--n-blau-tief); font-weight: 600; text-decoration: none; }
.ks-suchformular .bw-anfrage-wann a:hover { text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 1279px) {
  .ks-suchformular .werkbank .ks-etikett small { display: none; }
}
@media (max-width: 900px) {
  .sz-beitrag-buehne,
  .sz-beitrag-buehne.sz-ein-bild { grid-template-columns: minmax(0, 1fr); }
  .sz-beitrag-buehne.sz-ein-bild .sz-bildkarte { max-width: 420px; }
}

@media (max-width: 640px) {
  .ks-sozial, .ks-suchformular { gap: 28px; }
  
  .ks-sozial .ks-etikett small,
  .ks-suchformular .ks-etikett small { display: none; }
  
  .sz-klapp > summary { flex-wrap: nowrap; }
  .sz-klapp-kopf .ks-etikett { flex: 1 1 auto; min-width: 0; line-height: 1.35; }
  .ks-karte.sz-liste { padding: 4px 6px; }
  .sz-zeile {
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-areas: "bild stand" "text text";
    gap: 12px; padding: 14px 8px;
  }
  .sz-zeile-stand { justify-self: start; }
  .ks-sozial .einrichtung { padding: 14px; }
  
  .ks-sozial .einrichtung > summary { flex-wrap: wrap; row-gap: 10px; }
  .ks-sozial .einrichtung > summary > .weg { flex: 1 1 calc(100% - 47px); }
  .ks-sozial .einrichtung .aufklapp-knopf { margin-left: 47px; }
  .sz-teil { padding: 14px; }
  
  .sz-galerie { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .ks-suchformular .sf-schritte > li { grid-template-columns: minmax(0, 1fr) 56px; padding: 4px 8px; }
}
@media (pointer: coarse), (max-width: 900px) {
  .sz-klapp > summary { min-height: 44px; }
  .sz-klapp-pfeil { width: 44px; height: 44px; border-radius: 10px; }
  .ks-sozial .objekt-galerie > summary { min-height: 44px; }
  .sz-post-folie figcaption { min-height: 44px; }
  .sz-post-folie figcaption a { display: inline-flex; align-items: center; min-height: 44px; }
  .sz-mehr > summary { min-height: 44px; }
  .ks-suchformular .sf-platz { height: 44px; font-size: 16px; }
  
  .ks-suchformular .sf-haken { min-height: 44px; }
  
  .ks-suchformular .bw-mitnehmen > .knopf,
  .ks-suchformular .bw-code { min-height: 44px; }
}