/* Marke: Weiß + Dunkelblau. */
:root{--blau:#0a1f44;--blau-80:rgba(10,31,68,.82);--blau-60:rgba(10,31,68,.6);--linie:rgba(10,31,68,.1);--flaeche:#f5f7fb;--weiss:#fff;--schatten:0 1px 2px rgba(10,31,68,.04),0 8px 24px rgba(10,31,68,.06);--r:14px}
*{box-sizing:border-box}
html{min-height:100%}body{margin:0;min-height:100vh;display:flex;flex-direction:column;background:var(--flaeche);color:var(--blau);font:15px/1.6 "Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--blau);text-underline-offset:3px}
h1{font-size:1.9rem;font-weight:650;letter-spacing:-.025em;margin:.2em 0 1em;line-height:1.2}
h2{font-size:.72rem;font-weight:650;letter-spacing:.1em;text-transform:uppercase;color:var(--blau-60);margin:0 0 1rem}h3{font-size:1rem;font-weight:600;margin:1.8em 0 .7em}
.kopf{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.82);backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--linie)}
.kopf-in{max-width:1360px;margin:0 auto;padding:.85rem 2rem;display:flex;flex-wrap:wrap;gap:.6rem 1rem;align-items:center}
.logo{display:flex;align-items:center;gap:.6rem;font-weight:700;letter-spacing:-.01em;color:var(--blau);text-decoration:none}
.marke{width:22px;height:22px;border-radius:7px;background:var(--blau);position:relative;display:inline-block}.marke::after{content:"";position:absolute;left:6px;top:6px;width:10px;height:10px;border-radius:50%;background:#fff}
.logo-bild{height:22px;width:auto;display:block}
.platz{flex:1}
nav{display:flex;gap:.3rem;flex:1 0 auto;flex-wrap:nowrap}nav a{white-space:nowrap;color:var(--blau-60);text-decoration:none;padding:.4rem .75rem;border-radius:999px;transition:background .15s,color .15s}nav a:hover{color:var(--blau);background:var(--flaeche)}nav a.aktiv{color:var(--weiss);background:var(--blau)}
nav a.aktiv .punkt{background:var(--weiss);color:var(--blau)}
.rechts{display:flex;gap:1rem;align-items:center}.klein{font-size:.85rem;color:var(--blau-60)}.kunde{font-weight:600}
.punkt{background:var(--blau);color:var(--weiss);border-radius:9px;padding:0 .45em;font-size:.72rem;margin-left:.25em}
.haupt{width:100%;max-width:1360px;margin:0 auto;padding:2.4rem 2rem 4rem;flex:1}.schmal{width:100%;max-width:400px;margin:0 auto;padding:12vh 1.25rem 4rem;flex:1}
.karte{background:var(--weiss);border:1px solid var(--linie);border-radius:var(--r);padding:1.5rem 1.7rem;margin:0 0 1.4rem;box-shadow:var(--schatten)}
.karte.rot{border-left:4px solid var(--blau)}.karte.gelb{background:var(--flaeche)}.freigabe{border-color:var(--blau)}
.login.karte{padding:2rem}.login h1{font-size:1.5rem;margin-top:0}.login .knopf{width:100%;margin-top:1rem}
.tabelle-box{padding:0;overflow-x:auto}table{border-collapse:collapse;width:100%}
th,td{padding:.9rem 1.3rem;text-align:left;border-bottom:1px solid var(--linie);vertical-align:middle}
th{font-size:.7rem;font-weight:650;color:var(--blau-60);text-transform:uppercase;letter-spacing:.1em;background:var(--flaeche)}tbody tr:hover td{background:#fafbfd}tr:last-child td{border-bottom:0}.r{text-align:right}
.karte table{margin:0}
.kacheln{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.6rem}
@media (max-width:900px){.kacheln{grid-template-columns:repeat(2,1fr)}}@media (max-width:520px){.kacheln{grid-template-columns:1fr}}
.kachel{background:var(--weiss);border:1px solid var(--linie);border-radius:var(--r);padding:1.3rem 1.5rem;color:var(--blau);text-decoration:none;display:block;box-shadow:var(--schatten);transition:transform .15s}
a.kachel:hover{transform:translateY(-2px)}
.kachel.warnung{background:var(--blau);border-color:var(--blau);color:var(--weiss)}.kachel.warnung .titel{color:rgba(255,255,255,.7)}
.kachel .wert{font-size:2rem;font-weight:650;letter-spacing:-.03em;line-height:1.2}.kachel .titel{color:var(--blau-60);font-size:.85rem;margin-top:.2rem}
.diagramm{width:100%;max-width:720px;height:auto}.balken{fill:var(--blau)}.zahl{font-size:10px;fill:var(--blau)}.achse{font-size:9px;fill:var(--blau-60)}
.badge{display:inline-block;background:var(--flaeche);border-radius:999px;padding:.12rem .7rem;font-size:.75rem;font-weight:500;color:var(--blau-80);white-space:nowrap}
.badge.fehler{background:var(--blau);color:var(--weiss)}.badge.warn{background:#e4e9f4;color:var(--blau)}.badge.ok{background:var(--flaeche)}
.filterleiste{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.2rem}.filter{text-decoration:none;color:var(--blau-60);padding:.35rem .95rem;border-radius:999px;background:var(--weiss);border:1px solid var(--linie)}.filter.aktiv{background:var(--blau);border-color:var(--blau);color:var(--weiss)}
.suche{display:flex;gap:.6rem;margin-bottom:1.2rem}.suche input{flex:1}
.seiten{display:flex;gap:1.2rem;justify-content:center;align-items:center;color:var(--blau-60);margin-top:1.2rem}
input,select{font:inherit;padding:.65rem .9rem;border:1px solid var(--linie);border-radius:10px;background:var(--weiss);color:var(--blau);max-width:100%}
input:focus,select:focus,button:focus-visible,a:focus-visible{outline:2px solid var(--blau);outline-offset:2px}
label{display:block;margin:.9rem 0;font-size:.85rem;color:var(--blau-60)}label input,label select{display:block;width:100%;margin-top:.3rem}
.knopf{font:inherit;font-weight:600;padding:.65rem 1.4rem;border:1px solid var(--blau);border-radius:10px;background:var(--blau);color:var(--weiss);cursor:pointer;transition:opacity .15s}.knopf:hover{opacity:.88}
.knopf.zweit{background:var(--weiss);color:var(--blau);border-color:var(--linie)}
.link{font:inherit;background:none;border:0;color:var(--blau);cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:3px}.inline{display:inline}
.flash{padding:.8rem 1.1rem;border-radius:10px;margin-bottom:1.4rem;background:#e4e9f4}.flash.fehler{background:var(--blau);color:var(--weiss)}
dl.daten{display:grid;grid-template-columns:max-content 1fr;gap:.5rem 2.5rem;margin:0}dl.daten dt{color:var(--blau-60)}dl.daten dd{margin:0}
pre{white-space:pre-wrap;word-break:break-word;background:var(--flaeche);padding:1rem;border-radius:10px;font-size:.85rem}.geheim{font-size:1rem;user-select:all}
details summary{cursor:pointer;font-weight:600}
.verlauf{margin:0;padding-left:1.2rem}.verlauf .zeit,.meld .zeit{color:var(--blau-60);font-size:.85rem;margin-right:.8rem}
.meldungen{list-style:none;padding:0;margin:1rem 0 0}.meld{background:var(--weiss);border:1px solid var(--linie);border-radius:var(--r);padding:1.1rem 1.4rem;margin-bottom:.7rem;box-shadow:var(--schatten)}.meld.neu,.meld.fehler{border-left:4px solid var(--blau)}
.kopfzeile{display:flex;gap:.5rem;align-items:center}.kopfzeile .zeit{margin-left:auto}.aktionen{display:flex;gap:1.2rem;margin-top:.5rem}
.zeile{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}.zeile input{flex:1;min-width:160px}
.gitter{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.2rem 1.2rem;align-items:end}
code{background:var(--flaeche);padding:.1rem .4rem;border-radius:6px}
.text{max-width:760px;background:var(--weiss);border:1px solid var(--linie);border-radius:var(--r);padding:1.8rem 2rem;box-shadow:var(--schatten)}.text h2{margin-top:1.6rem}.text h2:first-child{margin-top:0}.text p{margin:.3rem 0}
mark{background:#e4e9f4;color:var(--blau);padding:0 .3rem;border-radius:4px}
.fuss{border-top:1px solid var(--linie);background:var(--weiss)}.fuss-in{max-width:1360px;margin:0 auto;padding:1.2rem 2rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;color:var(--blau-60);font-size:.85rem}.fuss a{color:var(--blau-60);margin-left:1.4rem;text-decoration:none}.fuss a:hover{color:var(--blau)}
@media (max-width:700px){.kopf-in,.haupt,.fuss-in{padding-left:1rem;padding-right:1rem}.rechts{width:100%;justify-content:space-between}dl.daten{grid-template-columns:1fr}h1{font-size:1.5rem}}

/* Dashboard, Freigabe-Stufen, Nachrichten */
.zwei{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem}.zwei .karte{margin:0}
@media (max-width:900px){.zwei{grid-template-columns:1fr}}
.karte.hinweis{border-color:var(--blau);background:var(--flaeche)}
.punkt{vertical-align:middle}h2 .punkt{margin-left:.5rem;letter-spacing:0}
.aufgaben{list-style:none;margin:0;padding:0}
.aufgabe{padding:1rem 0;border-bottom:1px solid var(--linie)}.aufgabe:last-child{border-bottom:0}
.aufgabe-kopf{display:flex;gap:1rem;justify-content:space-between;align-items:flex-start;flex-wrap:wrap}
.titel-link{font-weight:600;font-size:1.05rem}
.aufgabe .aktionen{margin:0;align-items:flex-start}
.wrap{flex-wrap:wrap}
details.ablehnen summary{list-style:none;display:inline-block}details.ablehnen summary::-webkit-details-marker{display:none}
details.ablehnen[open]{flex-basis:100%}details.ablehnen form{margin-top:.6rem;min-width:260px}
.meldungen.kompakt{margin:0}.meldungen.kompakt .meld{box-shadow:none;margin-bottom:.6rem}
.verlauf{list-style:none;padding:0}.verlauf li{padding:.45rem 0;border-bottom:1px solid var(--linie);font-size:.92rem}.verlauf li:last-child{border-bottom:0}.verlauf li.f{font-weight:600}
.verlauf .zeit{display:inline-block;min-width:8.5rem}
.stufen{list-style:none;margin:0;padding:0;counter-reset:s}
.stufe{display:flex;gap:1rem;padding:.9rem 0;border-bottom:1px solid var(--linie)}.stufe:last-child{border-bottom:0}
.stufe .nr{flex:0 0 auto;width:28px;height:28px;border-radius:50%;border:1px solid var(--blau-60);display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:600;color:var(--blau)}
.stufe.offen .nr{background:var(--blau);color:var(--weiss);border-color:var(--blau)}.stufe.freigegeben .nr{background:#e4e9f4;border-color:transparent}.stufe.abgelehnt .nr{background:var(--blau);color:var(--weiss)}
.stufe.wartet,.stufe.uebersprungen{opacity:.6}
.stufe-text{flex:1}.stufe-text .aktionen{margin-top:.5rem}
.upload{display:inline-block}.upload.laeuft{opacity:.55;pointer-events:none}.upload.laeuft::after{content:" …"}
.spalte{display:flex;flex-direction:column;gap:.4rem;min-width:280px}
input[hidden]{display:none!important}
label.knopf{margin:0;font-size:inherit;color:var(--blau);cursor:pointer;display:inline-block}
label.knopf.upload input{display:none}
@media (min-width:900px){.kopf-in{flex-wrap:nowrap}.rechts{white-space:nowrap}nav{flex:1 1 auto}}
.logo{white-space:nowrap}
@media (min-width:900px){nav a{padding:.4rem .6rem}}

.gross{display:grid;grid-template-columns:1.25fr 1fr;gap:1.4rem;align-items:start;margin-bottom:1.4rem}.gross .karte{margin-bottom:1.4rem}
.beleg{background:var(--weiss);border:1px solid var(--linie);border-radius:var(--r);box-shadow:var(--schatten);padding:2.4rem 2.6rem;min-height:640px}
.beleg-kopf{display:flex;justify-content:space-between;align-items:baseline;font-size:1.3rem;border-bottom:2px solid var(--blau);padding-bottom:.8rem;margin-bottom:1.4rem}.beleg-kopf span{color:var(--blau-60);font-size:1rem}
.beleg-an{margin-bottom:1.4rem;font-size:.9rem}.beleg table{margin:1.4rem 0}.beleg .summe{margin-left:auto;width:max-content;margin-top:1rem}
.pruef,.unterl{list-style:none;margin:0;padding:0}.pruef li{display:flex;gap:.7rem;padding:.5rem 0;border-bottom:1px solid var(--linie)}.pruef li:last-child{border:0}.pruef li span{font-weight:700}.pruef li.nein{font-weight:600}
.unterl li{display:flex;flex-direction:column;gap:.15rem;padding:.7rem 0;border-bottom:1px solid var(--linie)}.unterl li:last-child{border:0}.unterl li.fehlt strong::after{content:' – fehlt';font-weight:400}
@media (max-width:1000px){.gross{grid-template-columns:1fr}.beleg{min-height:0;padding:1.4rem}}

.reiter{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:.8rem}.reiter button{font:inherit;padding:.5rem 1rem;border:1px solid var(--linie);border-radius:999px;background:var(--weiss);color:var(--blau-60);cursor:pointer}.reiter button.aktiv{background:var(--blau);color:var(--weiss);border-color:var(--blau)}
.pdf-box{width:min(100%,calc((100vh - 190px)*.7071));min-width:320px;aspect-ratio:210/297;margin:0 auto;border:1px solid var(--linie);border-radius:8px;overflow:hidden;box-shadow:var(--schatten);background:var(--flaeche)}.pdf-box iframe{display:block;width:100%;height:100%;border:0}
button.dok{all:unset;box-sizing:border-box;display:flex;flex-direction:column;gap:.15rem;width:100%;cursor:pointer}button.dok:hover strong{text-decoration:underline}button.dok.aktiv strong::after{content:' ●';font-size:.7rem}

.vergleich{position:fixed;inset:0;z-index:100;background:var(--weiss);display:flex;flex-direction:column}
.vergleich-kopf{display:flex;justify-content:space-between;align-items:center;padding:.6rem 1rem;border-bottom:1px solid var(--linie)}
.vergleich-raster{flex:1;min-height:0;display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;padding:.6rem}
.vergleich-raster>div{display:flex;flex-direction:column;min-height:0;min-width:0}.vergleich-titel{font-weight:600;padding:.2rem .1rem .4rem}
.vergleich-raster iframe{flex:1;width:100%;border:1px solid var(--linie);border-radius:6px;background:var(--flaeche)}
@media (min-width:1001px){.gross>div:first-child{position:sticky;top:88px}}

/* Modernes Finish */
:root{--r:20px;--schatten:0 1px 2px rgba(10,31,68,.04),0 4px 12px rgba(10,31,68,.04),0 16px 40px rgba(10,31,68,.06)}
body{background:radial-gradient(1200px 500px at 85% -120px,#e9eefb 0,transparent 70%),var(--flaeche);font-feature-settings:"tnum" 1,"cv11" 1}
.karte{border:1px solid rgba(10,31,68,.06);padding:1.7rem 1.9rem}
h1{font-size:2.1rem;letter-spacing:-.035em}
.kopf{background:rgba(255,255,255,.7)}
nav a.aktiv{box-shadow:0 4px 12px rgba(10,31,68,.25)}
.knopf{border-radius:999px;transition:transform .15s,box-shadow .15s,background .15s}.knopf:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(10,31,68,.18)}
tbody tr{transition:background .15s}tbody tr:hover td{background:#f3f6fc}
th{background:transparent;border-bottom:1px solid var(--linie)}
.badge{padding:.2rem .8rem}.kachel{border:1px solid rgba(10,31,68,.06)}a.kachel:hover{box-shadow:0 12px 32px rgba(10,31,68,.12)}
input,select{border-radius:999px;padding:.65rem 1.1rem}.pruef li span{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:#e4e9f4;font-size:.75rem}
.pruef li{border-bottom:0;padding:.45rem 0}.unterl li{border-bottom:0;padding:.4rem 0}button.dok{padding:.75rem 1rem;border-radius:14px;background:var(--flaeche);transition:background .15s}button.dok:hover{background:#e9eefb}button.dok:hover strong{text-decoration:none}button.dok.aktiv{background:#e4e9f4}
.dok-kopf{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.8rem}
.pdf-box{border:0;border-radius:14px;box-shadow:0 2px 4px rgba(10,31,68,.05),0 24px 60px rgba(10,31,68,.14)}
.stufe .nr{border-radius:50%}.vergleich-raster iframe{border:0;box-shadow:0 8px 28px rgba(10,31,68,.12)}

/* Prüfschein (Inhaltliche Prüfung) */
.karte.schein{padding:1.7rem 1.4rem}.karte.schein h2{padding:0 .5rem;font-size:1rem;letter-spacing:-.01em;text-transform:none;color:var(--blau);font-weight:650;margin-bottom:.4rem}
.karte.schein table{width:100%}.karte.schein th{padding:.8rem .5rem;font-size:.78rem;text-transform:none;letter-spacing:0;color:var(--blau);font-weight:650;border-bottom:0}
.karte.schein td{padding:.7rem .5rem;border-bottom:0;vertical-align:top;font-variant-numeric:tabular-nums}.karte.schein tbody tr:hover td{background:transparent}
.s-blass td{color:var(--blau-60)}.s-summe td{font-weight:650;border-top:1px solid var(--linie)}.s-zeile td{color:var(--blau-80)}
.s-kopf td{background:var(--flaeche);font-weight:650;border-radius:8px;padding:.6rem .6rem}
.s-sub{display:flex;align-items:center;gap:.4rem;font-size:.75rem;margin-top:.15rem}.s-sub.ok{color:#1b7a4a}.s-sub.dev{color:#c0392b}
.s-ico{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border:1.5px solid currentColor;border-radius:50%;font-size:.62rem;font-weight:700;flex:0 0 auto}
.s-hinweis{margin:.2rem .5rem .6rem;padding:.5rem .8rem;border-radius:10px;background:#fbeceb;color:#c0392b;font-size:.85rem}
.karte.schein td.r,.karte.schein th.r{white-space:nowrap}

/* ===== Layout: dunkle Seitenleiste ===== */
:root{--nav:#11224a}
body.shell-body{display:block;background:#e8ecf3;padding:14px;min-height:100vh}
.app{display:flex;min-height:calc(100vh - 28px);border-radius:28px;overflow:hidden;background:#f4f6fa;box-shadow:0 10px 40px rgba(10,31,68,.12)}
.seitenleiste{flex:0 0 268px;background:var(--nav);color:#fff;display:flex;flex-direction:column;padding:26px 18px 18px;align-self:stretch}
.seitenleiste .logo{color:#fff;font-size:1.05rem;gap:.7rem;padding:0 10px;margin-bottom:2.4rem}.seitenleiste .logo-bild{height:22px;filter:brightness(0) invert(1)}
.seitenleiste nav{flex-direction:column;gap:.35rem;flex:1 1 auto}
.seitenleiste nav a{display:flex;align-items:center;justify-content:space-between;color:rgba(255,255,255,.78);padding:.8rem 1rem;border-radius:14px;font-size:.95rem;font-weight:500;box-shadow:none}
.seitenleiste nav a:hover{background:rgba(255,255,255,.08);color:#fff}
.seitenleiste nav a.aktiv{background:#fff;color:var(--blau);font-weight:650;box-shadow:none}
.seitenleiste .punkt{background:#fff;color:var(--blau);width:24px;height:24px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;padding:0;margin:0;font-weight:700;font-size:.75rem}.seitenleiste .punkt:empty{display:none}
.seitenleiste nav a.aktiv .punkt{background:var(--blau);color:#fff}
.kundenkarte{background:rgba(255,255,255,.07);border-radius:18px;padding:1.1rem 1.1rem 1rem}
.kundenkarte .kunde{font-weight:650;font-size:1rem;color:#fff}
.kundenkarte label{display:block;margin:.6rem 0 0;color:rgba(255,255,255,.65);font-size:.8rem}
.kundenkarte select{display:block;width:100%;margin-top:.45rem;background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:10px;padding:.5rem .7rem;font-size:.85rem}
.kundenkarte select option{color:var(--blau)}
.rechtliches{display:flex;gap:1rem;padding:.9rem 10px 0;font-size:.78rem}.rechtliches a{color:rgba(255,255,255,.55);text-decoration:none}.rechtliches a:hover{color:#fff}
.inhalt{flex:1;min-width:0;padding:3rem 4rem 4rem;max-width:1500px}
.seiten-label{color:var(--blau-60);font-size:1rem;margin-bottom:.1rem}
.inhalt h1{font-size:3rem;letter-spacing:-.04em;line-height:1.1;margin:0 0 2rem}
.inhalt .karte{border-radius:26px;box-shadow:none;border:1px solid rgba(10,31,68,.09);padding:2rem 2.3rem}
body.shell-body{background-image:none}
/* Dashboard */
.dash-grid{display:grid;grid-template-columns:1fr 1.55fr;gap:1.5rem;margin-bottom:1.6rem}.dash-grid .karte{margin:0}
@media (max-width:1100px){.dash-grid{grid-template-columns:1fr}}
.aufgaben li.leer{display:flex;align-items:center;gap:1rem;color:var(--blau-60);line-height:1.5;min-height:110px;margin-top:1.5rem}.aufgaben li.leer strong{color:var(--blau);font-weight:650}
.haken{flex:0 0 auto;width:52px;height:52px;border-radius:50%;background:#e4e9f4;display:inline-flex;align-items:center;justify-content:center;font-size:1.3rem;color:var(--blau)}
.meldungen.kompakt .meld{position:relative;background:transparent;border:0;border-radius:0;box-shadow:none;padding:0 0 0 1.6rem;margin:0 0 1.4rem}
.meldungen.kompakt .meld::before{content:"";position:absolute;left:.15rem;top:.6rem;width:10px;height:10px;border-radius:50%;background:var(--blau)}
.meldungen.kompakt .kopfzeile{display:block}.meldungen.kompakt .kopfzeile strong{font-size:1.2rem;font-weight:650}
.meldungen.kompakt .zeit{font-family:ui-monospace,"SF Mono",Menlo,monospace;color:var(--blau-60);font-size:.9rem}
.meldungen.kompakt .meld:first-child .zeit{position:absolute;right:0;top:-2.9rem}
.meldungen.kompakt .meld>div:nth-child(2){color:var(--blau-60);margin:.5rem 0 .8rem;max-width:44em}
a.mehr{font-weight:650;text-decoration:none}a.mehr::after{content:" →"}
.karte.tab{padding:2rem 0 0}.karte.tab .karte-kopf{display:flex;justify-content:space-between;align-items:baseline;padding:0 2.3rem 1.4rem}.karte.tab h2{margin:0}
.karte.tab .alle{font-size:.85rem;font-weight:650;text-decoration:none}
.karte.tab table th{background:#fafbfd;border-top:1px solid var(--linie);padding:.95rem 1.2rem;font-size:.82rem;font-weight:500;text-transform:none;letter-spacing:0;color:var(--blau-60)}
.karte.tab table th:first-child,.karte.tab table td:first-child{padding-left:2.3rem}.karte.tab table th:last-child,.karte.tab table td:last-child{padding-right:2.3rem}
.karte.tab table td{padding:1.1rem 1.2rem;border-bottom:1px solid var(--linie)}
a.lief{display:inline-flex;align-items:center;gap:.9rem;text-decoration:none;font-weight:500}a.lief:hover{text-decoration:underline}
.avatar{width:38px;height:38px;border-radius:11px;background:#eef1f7;display:inline-flex;align-items:center;justify-content:center;font-size:.78rem;font-weight:700}
.mono{font-family:ui-monospace,"SF Mono",Menlo,monospace;color:var(--blau-80)}.brutto{font-weight:650}
@media (max-width:900px){
 body.shell-body{padding:0}.app{flex-direction:column;border-radius:0;min-height:100vh}
 .seitenleiste{position:static;height:auto;flex:0 0 auto;padding:16px}.seitenleiste .logo{margin-bottom:1rem}.seitenleiste nav{flex-direction:row;flex-wrap:wrap}.seitenfuss{margin-top:1rem}
 .inhalt{padding:1.6rem 1.1rem 3rem}.inhalt h1{font-size:2.1rem}.inhalt .karte{padding:1.4rem}.karte.tab .karte-kopf{padding:0 1.4rem 1rem}.meldungen.kompakt .meld:first-child .zeit{position:static;display:block;margin-top:.2rem}
}
.rechtstext{max-width:760px}.rechtstext h1{margin-top:0}

.seitenleiste nav a{transition:none}
.inhalt{padding:3rem 3rem 4rem}
.gross{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
@media (max-width:1100px){.gross{grid-template-columns:1fr}}
.inhalt h1 .badge{font-size:.8rem;letter-spacing:0;vertical-align:middle;margin-left:.5rem;font-weight:500}

/* echte Webseite */
.kundenkarte .konto{display:flex;justify-content:space-between;align-items:center;gap:.6rem;margin-top:.8rem;font-size:.82rem}
.kundenkarte .konto a,.kundenkarte .link{color:rgba(255,255,255,.75);text-decoration:none}.kundenkarte .link:hover,.kundenkarte .konto a:hover{color:#fff;text-decoration:underline}
.kundenkarte form.inline select{margin-top:0}
.meldungen.kompakt .meld:not(.neu)::before{opacity:.25}
div.login.karte{max-width:420px;margin:8vh auto 0}
.inhalt .text{max-width:760px}
.seitenleiste .platz{flex:1}
/* Seitenleiste bleibt stehen, nur der Inhalt scrollt */
@media (min-width:901px){.app{height:calc(100vh - 28px);min-height:0}.inhalt{overflow-y:auto}.gross>div:first-child{top:1.5rem}}

/* Rechnungsliste + Status-Badges */
.seitenkopf{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;flex-wrap:wrap;margin-bottom:2rem}.seitenkopf h1{margin-bottom:0}
.seitenkopf .filterleiste{margin:0 0 .35rem;background:#eceff5;border-radius:16px;padding:5px;gap:2px;flex-wrap:wrap}
.filter{border:0;background:transparent;color:var(--blau-60);padding:.55rem 1.1rem;border-radius:12px;font-weight:500;transition:none}
.filter:hover{color:var(--blau)}.filter.aktiv{background:#fff;color:var(--blau);font-weight:650;box-shadow:0 1px 3px rgba(10,31,68,.1)}
.filter .anz{margin-left:.35rem;font-weight:400;color:var(--blau-60)}
.badge{display:inline-flex;align-items:center;gap:.5rem;padding:.38rem .95rem;font-weight:600;font-size:.85rem;background:#eef1f7;color:var(--blau)}
.badge::before{content:"";width:8px;height:8px;border-radius:50%;background:#8b97b3;flex:0 0 auto}
.badge.warn{background:#e8ecf5}.badge.ok{background:#fff;border:1px solid var(--linie);color:var(--blau-60)}.badge.ok::before{background:#d3d9e6}
.badge.fehler{background:var(--blau);color:#fff}.badge.fehler::before{background:#fff}
.inhalt h1 .badge{font-size:.8rem;font-weight:600}
.karte.liste{padding:0;overflow:hidden}
.karte.liste table th{background:#fafbfd;padding:1.1rem 1.2rem;font-size:.82rem;font-weight:500;text-transform:none;letter-spacing:0;color:var(--blau-60);border-bottom:1px solid var(--linie)}
.karte.liste table td{padding:1.1rem 1.2rem;border-bottom:1px solid var(--linie)}.karte.liste tr:last-child td{border-bottom:0}
.karte.liste table th:first-child,.karte.liste table td:first-child{padding-left:2.3rem}.karte.liste table th:last-child,.karte.liste table td:last-child{padding-right:2.3rem}
.suche input{border-radius:999px}
.seitenkopf .filter{padding:.5rem .8rem;font-size:.92rem}

/* Nachrichten-Seite */
.meldungen:not(.kompakt){max-width:900px}
.meldungen:not(.kompakt) .meld{border-radius:26px;box-shadow:none;border:1px solid rgba(10,31,68,.09);margin-bottom:1.2rem;padding:1.5rem 2rem}
.meldungen:not(.kompakt) .meld.neu,.meldungen:not(.kompakt) .meld.fehler{border-left:1px solid rgba(10,31,68,.09)}
.meldungen:not(.kompakt) .meld.voll{padding:0;overflow:hidden}
.meld-kopf{display:flex;gap:1.3rem;padding:1.8rem 2.3rem 1.6rem}.meld-text{flex:1;min-width:0}
.meld-icon{flex:0 0 auto;width:60px;height:60px;border-radius:16px;background:#e8ecf5;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:1.3rem}
.meld.voll .kopfzeile{display:flex;justify-content:space-between;align-items:baseline;gap:1rem}.meld.voll .kopfzeile strong{font-size:1.3rem;font-weight:650}
.meld.voll .zeit{margin:0;font-family:ui-monospace,"SF Mono",Menlo,monospace;color:var(--blau-60);font-size:.9rem}
.meld.voll .meld-text>div:last-child{color:var(--blau-60);margin-top:.5rem;font-size:1rem}
.meld-fuss{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem;padding:1.3rem 2.3rem 1.4rem calc(2.3rem + 60px + 1.3rem);background:#fafbfd;border-top:1px solid var(--linie)}
.meld-rechts{margin-left:auto;display:inline-flex;align-items:center;gap:1.4rem}
@media (max-width:900px){.meld-kopf{padding:1.3rem}.meld-fuss{padding:1rem 1.3rem}.meld-icon{width:44px;height:44px}}
.meld-rechts{gap:1rem;font-size:.9rem}.meld-fuss{padding-right:1.6rem}
/* Deutlichere Umrandung aller weißen Kästen */
:root{--rand:#cdd5e5}
.inhalt .karte,.karte,.kachel,.beleg,.pdf-box,.login.karte{border:1px solid var(--rand)}
.inhalt .karte.rot,.karte.rot{border-left:4px solid var(--blau)}
.meldungen:not(.kompakt) .meld,.meldungen:not(.kompakt) .meld.neu,.meldungen:not(.kompakt) .meld.fehler,.meldungen:not(.kompakt) .meld.voll{border:1px solid var(--rand)}
.meld-fuss{border-top:1px solid var(--rand)}
.filter.aktiv{border:1px solid var(--rand)}
.badge.ok{border:1px solid var(--rand)}
.knopf.zweit,label.knopf.zweit{border:1px solid var(--rand)}
input,select{border:1px solid var(--rand)}
.avatar{border:1px solid var(--rand);background:#fff}
.haken,.meld-icon{border:1px solid var(--rand)}
.karte.liste table td,.karte.tab table td,.karte.liste table th,.karte.tab table th{border-bottom-color:var(--rand)}
.karte.tab table th{border-top-color:var(--rand)}
.kundenkarte select{border:1px solid rgba(255,255,255,.2)}
.karte.hinweis,.freigabe.karte{border-color:var(--blau)}
/* Rechnungsdetail (Layout nach Vorlage) */
.seiten-label a{color:inherit;text-decoration:none}.seiten-label a:hover{text-decoration:underline}
.inhalt h1 .badge{font-size:.95rem;padding:.45rem 1.05rem;vertical-align:middle;margin-left:.8rem}
.gross{grid-template-columns:minmax(0,.92fr) minmax(0,1fr);gap:1.6rem}
.gross .karte{margin-bottom:1.6rem}
.beleg-karte.karte,.inhalt .beleg-karte.karte{padding:0;overflow:hidden}
.dok-kopf{padding:1.15rem 1.6rem;margin:0}.dok-kopf strong{font-size:1.05rem;font-weight:650}
.dok-flaeche{background:#edf0f6;border-top:1px solid var(--rand);padding:1.6rem;display:flex;justify-content:center}
.dok-flaeche .pdf-box{width:min(100%,calc((100vh - 330px)*.7071));min-width:260px;border:0;border-radius:2px;box-shadow:0 2px 10px rgba(10,31,68,.15)}
.dok-link{margin:0;padding:.8rem 1.6rem;text-align:center;font-size:.85rem;border-top:1px solid var(--rand)}
.gross .karte>h2,.gross .pk-kopf h2{font-size:1.5rem;font-weight:650;letter-spacing:-.02em;text-transform:none;color:var(--blau);margin:0 0 1.1rem}
.pk-kopf{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.4rem}.pk-kopf h2{margin:0!important}
.karte.schein{padding:2rem 1.9rem}.karte.schein h2{padding:0}
.karte.schein table{margin-top:.4rem}.karte.schein th{padding:.9rem .6rem;font-size:.95rem;font-weight:500;color:var(--blau-60);border-bottom:1px solid var(--rand)}
.karte.schein td{padding:.85rem .6rem;font-size:1rem;border-bottom:1px solid #edf0f6}
.s-summe td{background:#f7f9fc;border-top:0;font-weight:650}.s-blass td{color:var(--blau-60)}
.karte.schein tr.s-kopf td{background:transparent;border-bottom:0;padding:1.6rem .6rem .3rem;font-size:.72rem;font-weight:650;letter-spacing:.12em;text-transform:uppercase;color:var(--blau-60);border-radius:0}
.s-sub{font-size:.95rem;gap:.55rem;margin-top:.3rem}.s-ico{width:22px;height:22px;font-size:.75rem;border-width:1.5px}
.s-sub.ok{color:#1b7a4a}.s-sub.dev{color:#c0392b}
.s-final{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:1.4rem;padding:1.3rem 1.6rem;border-radius:16px;background:var(--blau);color:#fff}
.s-final span{font-size:1.1rem;font-weight:600}.s-final strong{font-size:1.8rem;letter-spacing:-.02em;white-space:nowrap}
.pk .badge.ok{background:#e4f3ea;color:#1b7a4a;border:0}.pk .badge.ok::before{background:#1b7a4a}
.pk .pruef{margin-top:.8rem}.pk .pruef li{align-items:center;gap:.9rem;padding:.6rem 0;font-size:1.02rem}
.pk .pruef li span{width:30px;height:30px;flex:0 0 auto;border-radius:50%;background:#e4f3ea;color:#1b7a4a;border:1px solid #b6dcc6;font-size:.85rem}
.pk .pruef li.nein span{background:#fbeceb;color:#c0392b;border-color:#f0c4c0}
.gross .unterl li{padding:.3rem 0}
@media (max-width:1100px){.gross{grid-template-columns:1fr}.dok-flaeche .pdf-box{width:min(100%,520px)}}
.gross{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
.dok-kopf{flex-wrap:nowrap;gap:.8rem;padding:1.1rem 1.3rem}.dok-kopf>div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dok-kopf .knopf{white-space:nowrap;padding:.55rem 1rem;font-size:.85rem}
.dok-flaeche{padding:1.3rem}
.karte.schein{padding:1.8rem 1.5rem}.karte.schein td{font-size:.95rem}.s-sub{font-size:.88rem}.s-ico{width:20px;height:20px;font-size:.7rem}
.s-final span{font-size:1rem}.s-final strong{font-size:1.6rem}
.pk .pruef li{font-size:.95rem}
.dok-kopf>div{overflow:visible;text-overflow:clip}.dok-kopf .mono{font-size:.8rem}

.kacheln.eine{grid-template-columns:minmax(240px,340px)}

/* Offene Freigaben pro Mitarbeiter */
.mabalken{list-style:none;margin:0;padding:0;display:grid;gap:1rem}
.mabalken li{display:grid;grid-template-columns:minmax(120px,220px) 1fr 2.5rem;align-items:center;gap:1.2rem}
.mname{font-weight:500}.mspur{height:14px;border-radius:999px;background:#edf0f6;overflow:hidden}
.mfuell{display:block;height:100%;border-radius:999px;background:var(--blau);min-width:0}
.mzahl{text-align:right;font-weight:650;font-variant-numeric:tabular-nums}

.mfuell{width:100%;height:100%;display:block;background:none;border-radius:0}.mfuell rect{fill:var(--blau)}

/* Verlauf als Zeitstrahl */
.tag-kopf{font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--blau-60);margin:1.6rem 0 .6rem}.tag-kopf:first-child{margin-top:.2rem}
.strahl{list-style:none;margin:0;padding:0}
.strahl li{position:relative;display:grid;grid-template-columns:4.2rem 2.25rem 1fr;align-items:center;gap:.9rem;padding:.45rem .5rem;border-radius:10px;min-height:3.9rem}
.strahl li:not(:last-child)::after{content:"";position:absolute;left:calc(.5rem + 4.2rem + .9rem + 1.1rem);top:calc(50% + 1.1rem);bottom:calc(-50% + 1.1rem);width:2px;background:var(--rand)}
.strahl .zeit{font-family:ui-monospace,"SF Mono",Menlo,monospace;color:var(--blau-60);font-size:.9rem}
.strahl .ico{width:2.25rem;height:2.25rem;border-radius:50%;display:grid;place-items:center;background:#edf0f6;color:var(--blau);font-size:.85rem;font-weight:700;position:relative;z-index:1}
.strahl .ico.ok::before{content:"✓"}
.strahl .ico.punkt{background:#fff;border:2px solid var(--rand)}.strahl .ico.punkt::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--blau)}
.strahl .ico.x{background:var(--blau);color:#fff}.strahl .ico.x::before{content:"✕"}
.strahl li.f{background:#f4f6fb;font-weight:600}
.strahl .txt{color:#4a5a7a}.strahl .txt a{color:var(--blau);text-decoration:none}.strahl li.f .txt{color:var(--blau)}

/* Mehrfachauswahl Empfänger */
.multi{display:flex;flex-wrap:wrap;gap:.5rem}
.wahl{cursor:pointer}.wahl input{position:absolute;opacity:0;pointer-events:none}
.wahl span{display:inline-block;padding:.4rem .9rem;border:1px solid var(--rand);border-radius:999px;background:#fff;color:var(--blau);font-size:.92rem;transition:background .15s}
.wahl:hover span{background:#f4f6fb}
.wahl input:checked+span{background:var(--blau);border-color:var(--blau);color:#fff}
.wahl input:focus-visible+span{outline:2px solid var(--blau);outline-offset:2px}

/* Sofort-Speichern-Hinweis */
#speicher-hinweis{position:fixed;right:1.5rem;bottom:1.5rem;z-index:60;background:var(--blau);color:#fff;padding:.7rem 1.1rem;border-radius:999px;font-size:.92rem;font-weight:600;box-shadow:0 6px 20px rgba(10,31,68,.25);opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .2s,transform .2s}
#speicher-hinweis.zeigen{opacity:1;transform:none}#speicher-hinweis.fehler{background:#9b1c1c}

/* Vollbild: kein äußerer Rand, keine Rundung */
body.shell-body{padding:0;background:#f4f6fa}
.app{border-radius:0;box-shadow:none;min-height:100vh}
@media (min-width:901px){.app{height:100vh;min-height:0}}

/* Mitarbeiter-Tabelle: Vertretung */
.mitarb td{vertical-align:top}.mitarb .zeile input,.mitarb .zeile select{width:100%;max-width:240px}
.vertr{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.vertr select{max-width:200px}
.datum{display:inline-flex;align-items:center;gap:.35rem;font-size:.85rem;color:var(--blau-60)}.datum input{width:auto;padding:.35rem .6rem}
.mitarb .vertr{gap:.4rem .6rem}.mitarb .vertr select{width:11rem;padding:.4rem 2rem .4rem .8rem;font-size:.9rem}
.mitarb .datum input{width:9.2rem;font-size:.85rem;padding:.35rem .6rem}
.mitarb input[data-mname],.mitarb td>form input[name=name]{padding:.5rem .9rem}
.mitarb td{padding-top:.8rem;padding-bottom:.8rem}

/* Mitarbeiter: Raster statt Umbruch */
.mitarb{table-layout:fixed;width:100%}.mitarb th:nth-child(1){width:23%}.mitarb th:nth-child(2){width:15%}.mitarb th:nth-child(3){width:44%}
.mitarb select{min-width:9rem}
.mitarb .vertr{display:grid;grid-template-columns:1fr 1fr;gap:.5rem .6rem;align-items:center}
.mitarb .vertr select{grid-column:1 / -1;width:100%;max-width:none}
.mitarb .datum{display:flex;width:100%}.mitarb .datum input{flex:1;width:auto;min-width:0}
.mitarb .vertr .badge{grid-column:1 / -1;justify-self:start}
.mitarb-akt{display:flex;flex-direction:column;gap:.4rem;align-items:flex-start}.mitarb-akt .zeile{display:flex;gap:.5rem;align-items:center;width:100%}.mitarb-akt input{min-width:0}
.mitarb th:nth-child(1){width:21%}.mitarb th:nth-child(2){width:14%}.mitarb th:nth-child(3){width:38%}
.mitarb-akt .zeile input{flex:1;min-width:7rem}
