:root{
  --bg:#F7F6F2; --side:#F2F1EC; --surface:#FFFFFF; --ink:#16150F; --sec:#6E6B64; --hair:#EAE7E0;
  --accent:#003F09; --accent2:#3E9E7A; --mint:#DDFED9;
  --grid:#F0F2F6; --mintink:#0F2C2F; --lime:#EDFBBD; --ok:#1E7A46; --warn:#B96A00; --bad:#C1121F;
  --disp:'Bricolage Grotesque',sans-serif; --body:'Inter',sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font-family:var(--body);cursor:pointer;border:none;background:none;font-size:14px;color:var(--ink)}
input,select,textarea{font-family:var(--body);font-size:14px;color:var(--ink);background:var(--surface);border:1px solid var(--hair);border-radius:10px;padding:10px 12px;width:100%;outline:none;transition:border-color .15s,box-shadow .15s,background-color .15s}
input:hover:not(:disabled),textarea:hover:not(:disabled){border-color:#D8D4CA}
input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(0,63,9,.10)}
input:disabled,select:disabled{background:var(--side);color:var(--sec);cursor:not-allowed}
/* Auswahlfelder mit eigenem Pfeil */
select{-webkit-appearance:none;appearance:none;cursor:pointer;padding-right:38px;font-weight:500;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236E6B64' stroke-width='2.2' 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:16px 16px}
select:hover:not(:disabled){border-color:#D8D4CA;background-color:#FDFDFC}
select:focus{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23003F09' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")}
select option{font-weight:400;color:var(--ink);background:var(--surface);padding:8px}
select:disabled{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B5B1A8' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")}
/* Filterleisten: Pillenform passend zu Chips und Segmenten */
.filterbar select,.jobfilter select{border-radius:100px;padding:9px 36px 9px 16px;background-position:right 13px center;font-size:13.5px}
.filterbar input,.jobfilter input,.jobsuche input{border-radius:100px;padding-left:16px}
.filterbar select:focus,.jobfilter select:focus{box-shadow:0 0 0 3px rgba(0,63,9,.10)}
label{display:block;font-size:12px;color:var(--sec);margin:14px 0 5px}
.eyebrow{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--sec);font-weight:500}
.disp{font-family:var(--disp)}
.hidden{display:none!important}
label{display:block;font-size:12px;color:var(--sec);margin:14px 0 5px}
.eyebrow{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--sec);font-weight:500}
.disp{font-family:var(--disp)}
.hidden{display:none!important}

/* ---------- Login ---------- */
.login{min-height:100vh;display:flex;flex-direction:column;justify-content:center;max-width:560px;margin:0 auto;padding:40px 24px}
.login .wordmark{margin-bottom:56px}
.login .wordmark span{color:var(--accent)}
.login h1{font-family:var(--disp);font-weight:600;font-size:clamp(30px,5vw,42px);line-height:1.12;letter-spacing:-.01em;margin-bottom:10px}
.login p.sub{color:var(--sec);margin-bottom:40px;max-width:420px}
.rolerow{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 0;border-top:1px solid var(--hair);cursor:pointer;transition:padding .15s}
.rolerow:last-of-type{border-bottom:1px solid var(--hair)}
.rolerow:hover{padding-left:8px}
.rolerow .rn{font-family:var(--disp);font-weight:600;font-size:18px}
.rolerow .rd{color:var(--sec);font-size:13px;margin-top:2px}
.rolerow .arr{color:var(--accent);font-size:18px;flex-shrink:0}
/* Fusszeile steht immer in EINER Zeile. Der Kasten ist 560px breit, abzueglich
   Innenabstand bleiben 512px - bei 12px waere die Zeile ~560px breit und wuerde
   abgeschnitten. Die Schrift richtet sich deshalb nach der Fensterbreite und
   wird nie groesser als 10,5px. Kein Abschneiden, kein Umbruch. */
.login .foot{margin-top:48px;color:var(--sec);white-space:nowrap;
  font-size:clamp(6.5px,1.85vw,10.5px);letter-spacing:-.01em}
/* ---------- Login (E-Mail + Passwort, als Popup/Modal) ---------- */
.login .lg-open{align-self:flex-start;padding:12px 34px;font-size:14px}
.lg-error{margin-top:12px;color:var(--bad);font-size:13px;background:#FDEDEE;border:1px solid #F4CDCF;border-radius:10px;padding:9px 12px}
.lg-admin{margin-top:24px}
.lg-onb{margin-top:34px;border-top:1px solid var(--hair);padding-top:8px}
.lg-onb-t{font-size:12px;font-weight:600;color:var(--sec);text-transform:uppercase;letter-spacing:.04em;margin:14px 0 2px}

/* ---------- Shell ---------- */
.shell{display:flex;min-height:100vh}
.mtop{display:none}
.side{width:224px;flex-shrink:0;background:var(--side);border-right:1px solid var(--hair);padding:28px 24px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.side .wordmark{margin-bottom:6px}
.side .wordmark span{color:var(--accent)}
.side .rolelabel{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--sec);margin-bottom:34px}
.side nav{display:flex;flex-direction:column;gap:3px}
.side nav a{padding:9px 12px;margin:0 -12px;border-radius:11px;color:var(--sec);font-size:14px;font-weight:500;display:flex;align-items:center;gap:9px;transition:background .14s,color .14s}
.side nav a:hover{color:var(--ink);background:rgba(20,20,18,.04)}
.side nav a.on{color:var(--mintink);background:var(--mint);font-weight:600}
.side nav a.on::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--accent)}
.side nav a .badge{margin-left:auto;background:var(--accent);color:#fff;font-size:11px;font-weight:600;min-width:18px;height:18px;border-radius:100px;display:inline-flex;align-items:center;justify-content:center;padding:0 5px;flex-shrink:0}
@media(max-width:860px){.side nav a .badge{margin-left:6px}}
.side .spacer{flex:1}
.side .me{border-top:1px solid var(--hair);padding-top:16px;font-size:13px}
.side .me .nm{font-weight:600}
.side .me .rl{color:var(--sec);font-size:12px;margin:1px 0 10px}
.side .me button{color:var(--sec);font-size:13px;padding:0}
.side .me button:hover{color:var(--accent)}
.side .me .nmrow{display:flex;align-items:center;justify-content:space-between;gap:8px}
.side .me .help{width:22px;height:22px;border:1px solid var(--hair);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;color:var(--sec);flex-shrink:0;padding:0;background:var(--surface)}
.side .me .help:hover{border-color:var(--accent);color:var(--accent)}
.side .me .help.on{border-color:var(--accent);color:var(--accent)}

/* Hilfeseite */
.faq{max-width:760px}
.faq .cat{margin-top:36px}
.faq .cat:first-child{margin-top:8px}
.faq .cat h2{font-family:var(--disp);font-weight:600;font-size:18px;padding-bottom:8px;border-bottom:1px solid var(--hair)}
.faq .qa{padding:16px 0;border-bottom:1px solid var(--hair)}
.faq .qa .q{font-weight:600;cursor:pointer;display:flex;justify-content:space-between;gap:14px;align-items:baseline}
.faq .qa .q .tw{color:var(--sec);font-size:18px;flex-shrink:0;transition:transform .15s}
.faq .qa.open .q .tw{transform:rotate(45deg)}
.faq .qa .a{color:var(--sec);margin-top:8px;line-height:1.6;display:none}
.faq .qa.open .a{display:block}
.faq .toc{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0 4px}
.faq .toc a{border:1px solid var(--hair);border-radius:100px;padding:6px 13px;font-size:12.5px;color:var(--sec);background:var(--surface)}
.faq .toc a:hover{border-color:var(--ink);color:var(--ink)}
.faq mark{background:#FFE9C7;color:inherit;border-radius:3px;padding:0 1px}
.main{flex:1;min-width:0;padding:36px 48px 80px;max-width:1120px}



/* ---------- Page furniture ---------- */
.pagehead{margin-bottom:30px}
.pagehead h1{font-family:var(--disp);font-weight:600;font-size:30px;letter-spacing:-.01em;line-height:1.15}
.pagehead .crumb{font-size:12px;color:var(--sec);margin-bottom:8px}
.pagehead .crumb a{color:var(--sec)}
.pagehead .crumb a:hover{color:var(--accent)}
.pagehead .sub{color:var(--sec);margin-top:6px;max-width:560px}
.headrow{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap}
.section{margin-top:36px}
.section .shead{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:14px}
.section h2{font-family:var(--disp);font-weight:600;font-size:20px;letter-spacing:-.01em}
.section .shead .link{font-size:13px;font-weight:600;color:var(--accent)}

/* KPIs */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;padding:0;margin-top:8px}
.kpi{background:var(--surface);border:1px solid var(--hair);border-radius:18px;padding:22px 22px;box-shadow:0 4px 20px rgba(20,20,18,.04);transition:transform .16s,box-shadow .16s}
.kpi:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(20,20,18,.08)}
.kpi:first-child{background:var(--mint);border-color:transparent}
.kpi:first-child .v{color:var(--mintink)} .kpi:first-child .l{color:var(--mintink);opacity:.75}
.kpi .v{font-family:var(--disp);font-weight:600;font-size:34px;letter-spacing:-.01em;line-height:1.1}
.kpi .v em{font-style:normal;color:var(--accent)}
.kpi .l{font-size:12px;color:var(--sec);margin-top:4px}
.kpi .d{font-size:12px;margin-top:6px;font-weight:500}
.kpi .d.up{color:var(--ok)} .kpi .d.dn{color:var(--bad)}

/* Rows / lists */
.rows{background:var(--surface);border:1px solid var(--hair);border-radius:18px;padding:6px 20px;box-shadow:0 4px 20px rgba(20,20,18,.04)}
.row{display:grid;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid var(--hair);cursor:pointer;transition:background .14s}
.row:last-child{border-bottom:none}
.row.static{cursor:default}
.row:hover{background:none;margin:0;padding-left:0;padding-right:0;border-radius:0;border-bottom-color:var(--hair)}
.row.static:hover{background:none;margin:0;padding-left:0;padding-right:0}
.row.nohover:hover{background:none;margin:0;padding-left:0;padding-right:0}
.row .t{font-weight:600}
.row .s{font-size:12px;color:var(--sec);margin-top:1px}
.row .num{font-family:var(--disp);font-weight:600;font-size:16px;text-align:right}
.row .arr{color:var(--sec);text-align:right}
.row:hover .arr{color:var(--sec)}
.row.termin{cursor:pointer}
.row.termin:hover{background:none;margin:0;padding-left:0;padding-right:0;border-radius:0;border-bottom-color:var(--hair)}
.row.termin:hover .arr{color:var(--sec)}
.colhead{display:grid;gap:16px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--sec);padding:0 0 8px}
.avatar{width:38px;height:38px;border-radius:50%;background:var(--mint);color:var(--mintink);display:flex;align-items:center;justify-content:center;font-family:var(--disp);font-weight:600;font-size:14px;flex-shrink:0}
.empty{padding:36px 0;color:var(--sec);text-align:center}

/* Status */
.st{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;white-space:nowrap;padding:5px 11px;border-radius:100px;background:#f1efe9}
.st::before{content:'';width:7px;height:7px;border-radius:50%;background:currentColor;flex-shrink:0}
.st.ok{color:var(--mintink);background:var(--mint)} .st.warn{color:#8a4d00;background:#FBEAD0} .st.bad{color:#8f1119;background:#FADEE0} .st.neu{color:var(--accent);background:#EAF3E6} .st.mut{color:var(--sec);background:#f1efe9}

/* Buttons */
.btn{background:var(--ink);color:#fff;border-radius:100px;padding:10px 20px;font-weight:600;font-size:13px;display:inline-flex;align-items:center;gap:8px}
.btn:hover{background:#0F2C2F;transform:translateY(-1px)}
.btn.acc{background:var(--accent);color:#fff} .btn.acc:hover{background:#0F2C2F}
.btn-ghost{border:1px solid var(--hair);border-radius:100px;padding:9px 18px;font-weight:600;font-size:13px;background:var(--surface)}
.btn-ghost:hover{border-color:var(--ink)}
.link{color:var(--accent);font-weight:500;cursor:pointer;background:none;border:none;padding:0;font-size:13px}
.link:hover{text-decoration:underline}
.btnrow{display:flex;gap:10px;align-items:center;flex-wrap:wrap}

/* Pipeline rail */
.rail{display:flex;gap:0;border:1px solid var(--hair);border-radius:100px;overflow:hidden;margin:18px 0 8px;background:var(--surface)}
.rail .rs{flex:1;text-align:center;padding:8px 4px;font-size:11px;color:var(--sec);border-right:1px solid var(--hair);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rail .rs:last-child{border-right:none}
.rail .rs b{display:block;font-family:var(--disp);font-size:16px;color:var(--ink)}
.rail .rs.hot b{color:var(--accent)}

/* Stage tag in lists */
.stage{font-size:12px;color:var(--sec)}
.stage b{color:var(--ink);font-weight:600}

/* Sparkbars */
.spark{display:inline-flex;align-items:flex-end;gap:3px;height:30px}
.spark i{width:7px;background:#D9D5CC;border-radius:2px;display:block}
.spark i.cur{background:var(--accent)}

/* Detail meta grid */
.meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:20px 32px;padding:22px 0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.meta .m .k{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--sec)}
.meta .m .v{font-weight:600;margin-top:3px}

/* Timeline */
.tl{border-left:1px solid var(--hair);margin:10px 0 0 4px;padding-left:20px}
.tl .te{position:relative;padding:0 0 20px}
.tl .te::before{content:'';position:absolute;left:-24.5px;top:6px;width:8px;height:8px;border-radius:50%;background:var(--hair)}
.tl .te.acc::before{background:var(--accent)}
.tl .te .d{font-size:11px;color:var(--sec)}
.tl .te .x{margin-top:2px}

/* Wizard */
.wsteps{display:flex;gap:22px;margin:6px 0 30px;flex-wrap:wrap}
.wsteps .ws{font-size:12px;color:var(--sec);display:flex;gap:7px;align-items:center}
.wsteps .ws i{font-style:normal;font-family:var(--disp);font-weight:600;width:22px;height:22px;border:1px solid var(--hair);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:11px}
.wsteps .ws.on{color:var(--ink);font-weight:600}
.wsteps .ws.on i{background:var(--ink);color:#fff;border-color:var(--ink)}
.wsteps .ws.done{color:var(--ok)}
.wsteps .ws.done i{border-color:var(--ok);color:var(--ok)}
.wbox{max-width:620px}
.wnav{display:flex;justify-content:space-between;margin-top:34px;padding-top:20px;border-top:1px solid var(--hair)}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
@media(max-width:620px){.f2{grid-template-columns:1fr}}

/* Choice rows (radio-like) */
.choice{border:1px solid var(--hair);border-radius:14px;padding:16px 18px;margin-top:10px;cursor:pointer;background:var(--surface);display:flex;gap:14px;align-items:flex-start}
.choice:hover{border-color:var(--ink)}
.choice.sel{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.choice .rb{width:16px;height:16px;border:1.5px solid var(--hair);border-radius:50%;flex-shrink:0;margin-top:2px}
.choice.sel .rb{border-color:var(--accent);background:radial-gradient(circle,var(--accent) 0 4.5px,transparent 5px)}
.choice .ct{font-weight:600}
.choice .cd{font-size:12.5px;color:var(--sec);margin-top:2px}

/* Chips */
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.chip{border:1px solid var(--hair);border-radius:100px;padding:7px 14px;font-size:13px;background:var(--surface);cursor:pointer}
.chip.sel{border-color:var(--ink);background:var(--ink);color:#fff}

/* Checklist */
.check{display:flex;gap:12px;align-items:center;padding:13px 0;border-bottom:1px solid var(--hair);cursor:pointer}
.check .box{width:20px;height:20px;border:1.5px solid var(--hair);border-radius:6px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:12px;color:#fff}
.check.on .box{background:var(--ok);border-color:var(--ok)}
.check.on .cx{color:var(--sec);text-decoration:line-through}

/* Signature pad */
.sig{border:1px dashed var(--hair);border-radius:14px;background:var(--surface);height:130px;display:flex;align-items:center;justify-content:center;color:var(--sec);font-size:13px;cursor:pointer;margin-top:8px}
.sig.signed{border-style:solid;color:var(--ink);font-family:var(--disp);font-size:24px;font-weight:600;font-style:italic}

/* Modal */
.overlay{position:fixed;inset:0;background:rgba(20,20,18,.4);display:flex;align-items:center;justify-content:center;z-index:50;padding:20px}
.sheet{background:var(--bg);border-radius:18px;max-width:540px;width:100%;max-height:88vh;overflow:auto;padding:28px}
/* ---------- Lade-Overlay (Spinner) beim Versand der Zugangsdaten ---------- */
.hub-loader{position:fixed;inset:0;background:rgba(20,20,18,.42);display:flex;align-items:center;justify-content:center;z-index:100050}
.hub-loader-card{background:var(--surface);border-radius:14px;padding:20px 26px;display:flex;align-items:center;gap:14px;box-shadow:0 12px 40px rgba(20,20,18,.22);max-width:90%}
.hub-loader-msg{font-size:14px;color:var(--ink)}
.hub-spinner{width:22px;height:22px;border:3px solid var(--hair);border-top-color:var(--accent);border-radius:50%;display:inline-block;animation:hubspin .7s linear infinite;flex-shrink:0}
@keyframes hubspin{to{transform:rotate(360deg)}}

/* ---------- Select2 (durchsuchbare Dropdowns) an das Portal-Design angepasst ---------- */
.select2-container{width:100% !important}
.select2-container--default .select2-selection--single{height:40px;background:var(--surface);border:1px solid var(--hair);border-radius:10px;display:flex;align-items:center}
.select2-container--default .select2-selection--single .select2-selection__rendered{color:var(--ink);font-family:var(--body);font-size:14px;line-height:38px;padding-left:12px;padding-right:28px}
.select2-container--default .select2-selection--single .select2-selection__placeholder{color:var(--sec)}
.select2-container--default .select2-selection--single .select2-selection__arrow{height:38px;right:8px}
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single{border-color:var(--accent)}
/* Dropdown muss über dem Modal-Overlay (z-index 50/200) liegen */
.select2-container--open{z-index:100000}
.select2-dropdown{background:var(--surface);border:1px solid var(--hair);border-radius:10px;z-index:100000;box-shadow:0 8px 24px rgba(20,20,18,.12)}
.select2-search--dropdown{padding:8px}
.select2-container--default .select2-search--dropdown .select2-search__field{border:1px solid var(--hair);border-radius:8px;padding:8px 10px;font-family:var(--body);font-size:13.5px;outline:none}
.select2-container--default .select2-results__option{font-family:var(--body);font-size:14px;color:var(--ink);padding:9px 12px}
.select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--accent);color:#fff}
.select2-container--default .select2-results__option[aria-selected=true]{background:var(--mint);color:var(--mintink)}
.select2-results__options{max-height:260px}
/* ---------- bootstrap-datepicker über dem Modal-Overlay + Portal-Farbe ---------- */
.datepicker.datepicker-dropdown{z-index:100001 !important;font-family:var(--body);border:1px solid var(--hair);border-radius:12px;box-shadow:0 8px 24px rgba(20,20,18,.14);padding:10px}
.datepicker table tr td,.datepicker table tr th{border-radius:8px}
.datepicker table tr td.active,.datepicker table tr td.active:hover,.datepicker table tr td.active.active{background:var(--accent) !important;color:#fff !important;text-shadow:none}
.datepicker table tr td.today,.datepicker table tr td.today:hover{background:var(--mint) !important;color:var(--mintink) !important}
/* Monats- und Jahresansicht (Klasse hub-month). Die mitgelieferte Datei des
   Kalenders faerbt nur die Tagesansicht ein - dort werden die Zellen als <td>
   gezeichnet, Monate und Jahre dagegen als <span>. Ohne diese Regeln stuende
   die Auswahl grau und ohne erkennbare Markierung da. */
.datepicker .datepicker-months,.datepicker .datepicker-years,.datepicker .datepicker-decades{min-width:210px}
.datepicker table tr td span{height:40px;line-height:40px;border-radius:8px;font-size:13px;color:var(--ink)}
.datepicker table tr td span:hover{background:var(--side)}
.datepicker table tr td span.focused{background:var(--side)}
.datepicker table tr td span.active,.datepicker table tr td span.active:hover,
.datepicker table tr td span.active.active{background:var(--accent) !important;color:#fff !important;text-shadow:none}
.datepicker table tr td span.old,.datepicker table tr td span.new{color:var(--sec);opacity:.55}
.datepicker table tr td span.disabled,.datepicker table tr td span.disabled:hover{color:var(--sec);opacity:.35;background:none;cursor:default}
.sheet h3{font-family:var(--disp);font-weight:600;font-size:20px;margin-bottom:4px}
.sheet .ssub{color:var(--sec);font-size:13px;margin-bottom:10px}
.sheet .snav{display:flex;justify-content:flex-end;gap:10px;margin-top:26px}
.sheet.wide{max-width:800px}
/* Lead-Erfassung: Auswahl-Optionen */
.leadopt{display:flex;align-items:center;gap:16px;padding:18px;border:1px solid var(--hair);border-radius:16px;background:var(--surface);cursor:pointer;margin-top:12px;transition:border-color .14s,background .14s}
.leadopt:hover{border-color:var(--accent);background:var(--mint)}
.leadopt .lo-ic{width:44px;height:44px;border-radius:12px;background:var(--mint);color:var(--mintink);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.leadopt:hover .lo-ic{background:#fff}
.leadopt .lo-t{font-family:var(--disp);font-weight:600;font-size:16px}
.leadopt .lo-s{font-size:13px;color:var(--sec);margin-top:2px}
.leadopt .lo-arr{margin-left:auto;color:var(--accent);font-size:18px;flex-shrink:0}
/* Verzeichnis-Import */
.vz-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:16px 0 8px}
.vz-list{border:1px solid var(--hair);border-radius:14px;max-height:320px;overflow-y:auto;background:var(--surface)}
.vz-row{display:flex;align-items:center;gap:14px;padding:13px 16px;border-bottom:1px solid var(--hair);cursor:pointer;transition:background .12s}
.vz-row:last-child{border-bottom:none}
.vz-row:hover:not(.dis){background:var(--mint)}
.vz-row.dis{opacity:.55;cursor:default}
.vz-cb{width:20px;height:20px;border:1.5px solid var(--hair);border-radius:6px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:12px;color:#fff;background:var(--surface)}
.vz-cb.on{background:var(--accent);border-color:var(--accent)}
.vz-tx{flex:1;min-width:0}
.vz-n{font-weight:600;font-size:14px}
.vz-m{font-size:12px;color:var(--sec);margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mailprev{margin-top:8px;background:var(--surface);border:1px solid var(--hair);border-radius:12px;padding:12px 14px}
.mailprev .mp-h{font-size:12.5px;font-weight:600;color:var(--ink);padding-bottom:8px;margin-bottom:8px;border-bottom:1px solid var(--hair)}
.mailprev .mp-b{font-size:13px;color:var(--sec);line-height:1.5;white-space:normal}
/* me-links (Sidebar unten) */
.me-links{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:4px}
.me-links button{background:none;border:none;padding:0;color:var(--sec);font-family:var(--body);font-size:13px;font-weight:600;cursor:pointer}
.me-links button:hover{color:var(--ink)}
.side .me .me-links .me-set{font-size:11px;font-weight:500}
.side .me .me-links .me-set svg{width:11px;height:11px}
.side .me .me-links .me-set.on{color:var(--accent)}
.side .me .me-links .me-sep{color:var(--hair);font-size:11px}
/* Einstellungen: Tabs */
.seg2{display:inline-flex;background:#E7E5DE;border:1px solid var(--hair);border-radius:100px;padding:4px;gap:4px;margin-bottom:8px;max-width:100%;flex-wrap:wrap}
@media(max-width:820px){.seg2{display:flex;border-radius:18px}}
.seg2 button{border:none;background:none;font-family:var(--body);font-size:13.5px;font-weight:600;color:var(--sec);padding:8px 18px;border-radius:100px;cursor:pointer;transition:all .14s}
.seg2 button:hover{color:var(--ink)}
.seg2 button.on{background:#fff;color:var(--ink);box-shadow:0 2px 6px rgba(20,20,18,.14),0 0 0 1px rgba(20,20,18,.05)}
.seg2 button.on:hover{color:var(--ink)}
/* Promotions: Tab-Leiste + Standort-Suche in einer Zeile */
.promobar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:4px}
.promo-search{position:relative;flex:0 0 auto}
.promo-search input{width:240px;max-width:100%;border:1px solid var(--hair);border-radius:100px;padding:9px 34px 9px 16px;font-family:var(--body);font-size:13.5px;background:var(--surface);color:var(--ink)}
.promo-search input:focus{outline:none;border-color:var(--accent)}
.promo-search .promo-clear{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:22px;height:22px;border:none;background:var(--side);border-radius:50%;color:var(--sec);font-size:15px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.promo-search .promo-clear:hover{color:var(--bad)}
/* Präsentations-Banner (Lead-Detail) */
.presbanner{display:flex;align-items:center;gap:16px;margin-top:18px;padding:18px 20px;background:linear-gradient(120deg,var(--mint),#EAF7E4);border:1px solid var(--hair);border-radius:16px;cursor:pointer;transition:box-shadow .15s,transform .15s}
.presbanner:hover{box-shadow:0 8px 26px rgba(0,63,9,.12);transform:translateY(-1px)}
.presbanner .pb-ic{flex-shrink:0;width:44px;height:44px;border-radius:12px;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center}
.presbanner .pb-tx{flex:1;min-width:0}
.presbanner .pb-t{font-family:var(--disp);font-weight:600;font-size:15.5px;color:var(--mintink)}
.presbanner .pb-s{font-size:13px;color:var(--block-sec,#4a5f52);margin-top:3px;line-height:1.45}
.presbanner .pb-btn{flex-shrink:0;background:var(--accent);color:#fff;font-weight:600;font-size:13.5px;padding:10px 18px;border-radius:100px;white-space:nowrap}
@media(max-width:640px){.presbanner{flex-wrap:wrap}.presbanner .pb-btn{width:100%;text-align:center}}
/* Benachrichtigungen */
.notif-group{margin-top:22px}
.notif-group .ng-title{font-family:var(--disp);font-weight:600;font-size:15px;margin-bottom:10px}
.notif-tbl{background:var(--surface);border:1px solid var(--hair);border-radius:16px;overflow:hidden;box-shadow:0 4px 20px rgba(20,20,18,.04)}
.nt-head,.nt-row{display:grid;grid-template-columns:1.6fr repeat(4,88px);align-items:center;gap:8px;padding:12px 18px}
.nt-head{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--sec);border-bottom:1px solid var(--hair)}
.nt-row{border-bottom:1px solid var(--hair)}
.nt-row:last-child{border-bottom:none}
.nt-ev{font-size:14px;font-weight:500}
.nt-head .nt-ch,.nt-row .nt-ch{text-align:center}
.nt-head .nt-ch{justify-self:center}
.tgl{width:40px;height:23px;border-radius:100px;border:none;background:#dcdad3;cursor:pointer;position:relative;transition:background .16s;padding:0}
.tgl.on{background:var(--accent)}
.tgl .knob{position:absolute;top:2.5px;left:2.5px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .16s}
.tgl.on .knob{left:19.5px}
/* Vorlagen */
.tpl-group{margin-top:22px}
.tpl-group .tg-title{font-family:var(--disp);font-weight:600;font-size:15px;margin-bottom:10px}
.tpl-edit{background:var(--surface);border:1px solid var(--hair);border-radius:16px;padding:22px;box-shadow:0 4px 20px rgba(20,20,18,.04)}
.tpl-edit code{background:var(--side);border-radius:5px;padding:1px 6px;font-size:12px;color:var(--accent)}
/* Anruf-Modal */
.callcard{background:var(--mint);border-radius:14px;padding:16px 18px;margin:6px 0 16px}
.callcard .cc-row{display:flex;justify-content:space-between;gap:12px;padding:5px 0;font-size:13.5px}
.callcard .cc-k{color:var(--mintink);opacity:.7}
.callcard .cc-v{color:var(--mintink);font-weight:500;text-align:right}
.callres{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:6px}
.callact{display:grid;gap:8px;margin-bottom:6px}
.ca-opt{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;background:var(--side);border:1px solid var(--hair);border-radius:12px;cursor:pointer;transition:border-color .14s,background .14s}
.ca-opt:hover{border-color:var(--accent2)}
.ca-opt input{margin-top:2px;width:17px;height:17px;flex-shrink:0;accent-color:var(--accent);cursor:pointer}
.ca-opt .ca-tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.ca-opt .ca-tx b{font-size:13.5px;font-weight:600;color:var(--ink)}
.ca-opt .ca-tx .s{font-size:12px;color:var(--sec);line-height:1.45}
.ca-opt:has(input:checked){background:var(--mint);border-color:var(--accent2)}
.cr-opt{border:1.5px solid var(--hair);background:var(--surface);border-radius:12px;padding:12px 14px;font-family:var(--body);font-size:13.5px;font-weight:600;color:var(--ink);cursor:pointer;text-align:left;transition:all .14s}
.cr-opt:hover{border-color:var(--accent)}
.cr-opt.on{background:var(--accent);border-color:var(--accent);color:#fff}
/* Werbematerial-Bestellung */
.matbar{display:flex;gap:16px;align-items:flex-end;margin-top:8px}
.qty{display:inline-flex;align-items:center;gap:10px}
.qty .qbtn{width:30px;height:30px;border-radius:8px;border:1px solid var(--hair);background:var(--surface);font-size:17px;font-weight:600;color:var(--ink);cursor:pointer;line-height:1;display:flex;align-items:center;justify-content:center;transition:all .12s}
.qty .qbtn:hover{border-color:var(--accent);color:var(--accent)}
.qty .qn{min-width:28px;text-align:center;font-family:var(--disp);font-weight:600;font-size:15px}
/* Promoter-Feedback */
.fbcard{background:var(--surface);border:1px solid var(--hair);border-radius:16px;padding:22px;box-shadow:0 4px 20px rgba(20,20,18,.04)}
.fb-t{font-family:var(--disp);font-weight:600;font-size:15px;margin-bottom:12px;display:flex;align-items:baseline;gap:9px}
.fb-t .s{font-weight:400}
/* Recruiter */
.recboard{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}
.reccol{background:var(--side);border:1px solid var(--hair);border-radius:14px;padding:12px}
.reccol.aus{opacity:.72}
.rc-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.rc-t{font-family:var(--disp);font-weight:700;font-size:13.5px}
.rc-n{background:var(--surface);border:1px solid var(--hair);border-radius:100px;font-size:11px;font-weight:700;padding:1px 8px;color:var(--accent)}
.rc-d{font-size:10.5px;color:var(--sec);line-height:1.35;margin:4px 0 10px;min-height:28px}
.rc-body{display:flex;flex-direction:column;gap:8px}
.rc-leer{font-size:12px;color:var(--sec);text-align:center;padding:8px 0}
.reccard{width:100%;text-align:left;background:var(--surface);border:1px solid var(--hair);border-radius:11px;padding:11px 12px;cursor:pointer;font-family:var(--body);transition:border-color .14s,transform .14s}
.reccard:hover{border-color:var(--accent2);transform:translateY(-1px)}
.reccard .rk-n{font-weight:600;font-size:13px;color:var(--ink);line-height:1.25}
.reccard .rk-r{font-size:11px;color:var(--accent2);font-weight:600;margin-top:2px}
.reccard .rk-g{font-size:11px;color:var(--sec)}
.reccard .rk-s{margin-top:4px}
.reccard .rk-t{margin-top:5px;font-size:10.5px;background:var(--mint);color:var(--mintink);border-radius:100px;padding:2px 8px;display:inline-block;font-weight:600}
.recstars{display:inline-flex;gap:1px;color:var(--warn);font-size:13px;line-height:1}
.recstars.klick{font-size:20px;gap:3px}
.recstars button{background:none;border:none;padding:0;color:var(--warn);font-size:inherit;cursor:pointer;line-height:1}
.recstars button:hover{transform:scale(1.15)}
.recrate{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.recprog{display:flex;align-items:center;gap:0;margin:18px 0 4px;flex-wrap:wrap}
.rp-s{display:flex;align-items:center;gap:7px;padding:6px 13px 6px 6px;border-radius:100px;background:var(--side);margin:0 8px 8px 0}
.rp-n{width:22px;height:22px;border-radius:50%;background:var(--surface);border:1px solid var(--hair);color:var(--sec);font-family:var(--disp);font-weight:700;font-size:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.rp-l{font-size:12px;font-weight:600;color:var(--sec);white-space:nowrap}
.rp-s.cur{background:var(--accent)}
.rp-s.cur .rp-n{background:#fff;border-color:#fff;color:var(--accent)}
.rp-s.cur .rp-l{color:#fff}
.rp-s.done{background:var(--mint)}
.rp-s.done .rp-n{background:var(--accent);border-color:var(--accent);color:#fff}
.rp-s.done .rp-l{color:var(--mintink)}
.rectermin{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.recobs{display:flex;gap:10px;flex-wrap:wrap}
.recobs .ro-s{display:flex;align-items:center;gap:8px;background:var(--side);border-radius:100px;padding:7px 15px 7px 7px;font-size:12.5px;font-weight:600;color:var(--sec)}
.recobs .ro-n{width:22px;height:22px;border-radius:50%;background:var(--surface);border:1px solid var(--hair);font-family:var(--disp);font-size:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.recobs .ro-s.done{background:var(--mint);color:var(--mintink)}
.recobs .ro-s.done .ro-n{background:var(--accent);border-color:var(--accent);color:#fff}
.recobs .ro-s.bad{background:#FADEE0;color:var(--bad)}
.recobs.mini .ro-s{padding:4px 11px 4px 4px;font-size:11px}
.recobs.mini .ro-n{width:17px;height:17px;font-size:9.5px}
/* Einarbeitung */
.eabar{height:8px;border-radius:100px;background:var(--hair);overflow:hidden;max-width:220px}
/* Arbeitsbereich je Prozessstufe */
.schrittbox{background:var(--surface);border:1px solid var(--hair);border-radius:16px;padding:22px;box-shadow:0 4px 20px rgba(20,20,18,.04)}
.sb-doks{margin-top:16px;padding-top:14px;border-top:1px dashed var(--hair);display:flex;gap:9px;align-items:center;flex-wrap:wrap}
.sb-doks .sb-ft{width:100%;margin-bottom:2px}
.sb-ck{width:18px;flex-shrink:0;font-size:14px;color:var(--accent);text-align:center}
/* Vertragskarte */
.vtrcard{background:var(--surface);border:1px solid var(--hair);border-radius:16px;padding:22px;box-shadow:0 4px 20px rgba(20,20,18,.04)}
.vc-head{display:flex;align-items:center;gap:13px;padding-bottom:14px;border-bottom:1px solid var(--hair);margin-bottom:14px}
.vc-ic{width:38px;height:38px;border-radius:11px;background:var(--mint);color:var(--mintink);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.vc-t{font-family:var(--disp);font-weight:700;font-size:16px}
.vc-m{font-size:12.5px;color:var(--sec);margin-top:2px}
.vc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px 20px}
.vc-f{display:flex;flex-direction:column;gap:2px}
.vc-f .k{font-size:10.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--sec)}
.vc-f .v{font-size:13.5px;color:var(--ink);font-weight:500}
.vc-sig{margin-top:16px;padding-top:14px;border-top:1px dashed var(--hair)}
.vc-sl{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--accent2);margin-bottom:7px}
.vc-sig img{height:52px;max-width:220px;object-fit:contain;display:block}
.vc-akt{display:flex;gap:9px;margin-top:16px;flex-wrap:wrap}
.vc-hint{margin-top:12px;background:#FDF6EC;border:1px solid #F0DFC4;color:#6b5433;border-radius:11px;padding:11px 14px;font-size:12.5px;line-height:1.5}
.vorlhinweis{display:flex;align-items:center;gap:7px;background:var(--side);border-radius:11px;padding:11px 14px;font-size:12.5px;color:var(--sec);line-height:1.45;margin:14px 0 4px}
.vorlhinweis b{color:var(--ink);font-weight:600}
/* Öffentliche Stellenseite */
.jobwrap{min-height:100vh;background:var(--bg);overflow-y:auto}
.jobtop{background:var(--surface);border-bottom:1px solid var(--hair);position:sticky;top:0;z-index:20}
.jt-in{max-width:1000px;margin:0 auto;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.jt-brand{display:flex;align-items:center;gap:10px}
.jt-bn{font-family:var(--disp);font-weight:700;font-size:15px;line-height:1.1}
.jt-bn span{display:block;font-family:var(--body);font-weight:400;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--sec);margin-top:1px}
.jt-login{background:none;border:1.5px solid var(--hair);border-radius:100px;padding:8px 16px;font-family:var(--body);font-size:12.5px;font-weight:600;color:var(--ink);cursor:pointer}
.jt-login:hover{border-color:var(--accent)}
.jobhero{background:linear-gradient(160deg,#00530C 0%,#003F09 55%,#00320B 100%);color:#fff;padding:56px 24px 48px}
.jh-in{max-width:1000px;margin:0 auto}
.jh-eyebrow{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--lime);margin-bottom:14px}
.jobhero h1{font-family:var(--disp);font-weight:700;font-size:clamp(30px,5vw,50px);line-height:1.04;letter-spacing:-.02em;margin:0 0 16px}
.jh-lead{font-size:clamp(15px,1.9vw,18px);color:rgba(255,255,255,.8);line-height:1.55;max-width:60ch;margin:0 0 28px}
.jh-lead b{color:var(--lime);font-weight:600}
.jh-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.jh-f{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:13px;padding:14px 16px}
.jh-f b{display:block;font-family:var(--disp);font-weight:700;font-size:15px;color:#fff}
.jh-f span{font-size:12.5px;color:rgba(255,255,255,.7)}
.jobmain{max-width:1000px;margin:0 auto;padding:36px 24px 56px}
.jobfilter{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:20px}
.jobfilter select{width:auto;margin:0}
.jobsuche{position:relative;display:inline-flex;align-items:center}
.jobsuche input{width:230px;margin:0;padding-right:34px}
.jobsuche-x{position:absolute;right:8px;background:var(--side);border:none;color:var(--sec);width:22px;height:22px;border-radius:50%;font-size:15px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.jobsuche-x:hover{background:var(--bad);color:#fff}
@media(max-width:520px){.jobsuche,.jobsuche input{width:100%}}
.jf-n{font-size:12.5px;color:var(--sec);margin-left:auto}
.joblist{display:flex;flex-direction:column;gap:12px}
.jobcard{width:100%;text-align:left;background:var(--surface);border:1px solid var(--hair);border-radius:18px;padding:22px 24px;cursor:pointer;font-family:var(--body);transition:border-color .15s,transform .15s,box-shadow .15s}
.jobcard:hover{border-color:var(--accent2);transform:translateY(-2px);box-shadow:0 10px 26px rgba(20,21,15,.07)}
.jc-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
.jc-t{font-family:var(--disp);font-weight:700;font-size:19px;line-height:1.2;color:var(--ink)}
.jc-o{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--sec);margin-top:4px}
.jc-n{background:var(--mint);color:var(--mintink);font-size:12px;font-weight:600;padding:5px 12px;border-radius:100px;white-space:nowrap}
.jc-k{font-size:14px;color:var(--sec);line-height:1.5;margin:10px 0 14px}
.jc-f{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.jc-tag{background:var(--side);color:var(--sec);font-size:11.5px;font-weight:500;padding:4px 11px;border-radius:100px}
.jc-mehr{margin-left:auto;font-size:13px;font-weight:600;color:var(--accent)}
.jobinit{margin-top:26px;background:var(--surface);border:1px dashed var(--hair);border-radius:18px;padding:26px;text-align:center}
.ji-t{font-family:var(--disp);font-weight:700;font-size:17px;margin-bottom:6px}
.jobinit p{font-size:14px;color:var(--sec);max-width:52ch;margin:0 auto 16px;line-height:1.55}
.jd-back{background:none;border:none;padding:0;color:var(--accent);font-family:var(--body);font-size:13.5px;font-weight:600;cursor:pointer;margin-bottom:18px}
.jd-head{background:var(--surface);border:1px solid var(--hair);border-radius:20px;padding:30px;margin-bottom:18px}
.jd-eyebrow{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--accent2);margin-bottom:10px}
.jd-head h1{font-family:var(--disp);font-weight:700;font-size:clamp(25px,4vw,38px);line-height:1.08;letter-spacing:-.02em;margin:0 0 12px}
.jd-head h1 span{font-weight:500;color:var(--sec)}
.jd-lead{font-size:16px;color:var(--sec);line-height:1.55;margin:0 0 16px;max-width:58ch}
.jd-tags{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:20px}
.jd-cta{font-size:15px;padding:13px 28px}
.jd-cols{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:18px}
.jd-box{background:var(--surface);border:1px solid var(--hair);border-radius:18px;padding:26px;margin-bottom:18px}
.jd-box h2{font-family:var(--disp);font-weight:700;font-size:18px;margin:0 0 14px}
.jd-l{list-style:none;margin:0;padding:0}
.jd-l li{position:relative;padding-left:26px;font-size:14px;line-height:1.55;margin-bottom:10px;color:var(--ink)}
.jd-l li::before{content:"";position:absolute;left:0;top:6px;width:8px;height:8px;border-radius:50%;background:var(--accent2)}
.jd-l.check li::before{width:17px;height:17px;border-radius:6px;background:var(--mint);top:2px}
.jd-l.check li::after{content:"";position:absolute;left:6px;top:6px;width:4px;height:8px;border:2px solid var(--accent);border-top:0;border-left:0;transform:rotate(42deg)}
.jd-bens{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
/* Profil */
.jd-profil{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.jp-i{display:flex;align-items:flex-start;gap:12px;background:var(--side);border-radius:13px;padding:14px 16px}
.jp-ck{width:26px;height:26px;border-radius:8px;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 2px 6px rgba(0,63,9,.2)}
.jp-ck svg{width:15px;height:15px;display:block}
.jp-t{font-size:14px;line-height:1.5;color:var(--ink);font-weight:500}
.jd-hinweis{margin-top:14px;background:var(--mint);color:var(--mintink);border-radius:12px;padding:13px 16px;font-size:13.5px;line-height:1.55}
/* Verdienstrechner */
.jd-calc{background:linear-gradient(160deg,#00530C 0%,#003F09 55%,#00320B 100%);color:#fff;border-radius:20px;padding:30px;margin-bottom:18px}
.jd-calc h2{font-family:var(--disp);font-weight:700;font-size:21px;margin:0 0 6px;color:#fff}
.jc-lead{font-size:14.5px;color:rgba(255,255,255,.72);line-height:1.55;margin:0 0 24px;max-width:60ch}
.jc-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
.jc-ctrl{margin-bottom:20px}
.jc-ctrl:last-child{margin-bottom:0}
.jc-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:10px}
.jc-l{font-size:14px;font-weight:600;color:#fff}
.jc-s{display:block;font-size:11.5px;font-weight:400;color:rgba(255,255,255,.6);margin-top:2px}
.jc-v{font-family:var(--disp);font-weight:700;font-size:18px;color:var(--lime);white-space:nowrap}
.jc-ctrl input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:100px;background:rgba(255,255,255,.18);outline:none;cursor:pointer}
.jc-ctrl input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:24px;height:24px;border-radius:50%;background:var(--lime);border:4px solid var(--accent);box-shadow:0 2px 8px rgba(0,0,0,.3);cursor:pointer}
.jc-ctrl input[type=range]::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:var(--lime);border:4px solid var(--accent);cursor:pointer}
.jc-scale{display:flex;justify-content:space-between;font-size:10.5px;color:rgba(255,255,255,.5);margin-top:6px}
.jc-stufen{display:flex;gap:7px;flex-wrap:wrap}
.jc-stufen button{flex:1;min-width:88px;background:rgba(255,255,255,.08);border:1.5px solid rgba(255,255,255,.16);color:#fff;border-radius:11px;padding:9px 6px;cursor:pointer;font-family:var(--body);text-align:center;transition:all .14s}
.jc-stufen button:hover{border-color:rgba(237,251,189,.5)}
.jc-stufen button.on{background:var(--lime);border-color:var(--lime)}
.jcs-n{display:block;font-size:11px;font-weight:600;line-height:1.3}
.jcs-v{display:block;font-family:var(--disp);font-weight:700;font-size:15px;margin-top:2px;color:var(--lime)}
.jc-stufen button.on .jcs-n{color:var(--mintink)}
.jc-stufen button.on .jcs-v{color:var(--accent)}
.jc-right{background:linear-gradient(150deg,rgba(255,255,255,.11),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:24px}
.jc-bl{font-size:11.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.jc-bn{display:block;font-family:var(--disp);font-weight:700;font-size:38px;line-height:1.05;letter-spacing:-.02em;margin:5px 0 2px}
.jc-bs{font-size:12.5px;color:rgba(255,255,255,.6)}
.jc-jahr{display:inline-flex;align-items:center;gap:7px;background:var(--lime);color:var(--accent);font-weight:600;font-size:13px;padding:7px 15px;border-radius:100px;margin-top:12px}
.jc-jahr b{font-family:var(--disp);font-weight:700;font-size:15px}
.jc-einm{margin-top:12px;background:rgba(237,251,189,.13);border:1px solid rgba(237,251,189,.3);border-radius:11px;padding:11px 14px;font-size:12.5px;color:rgba(255,255,255,.82);line-height:1.5;display:flex;flex-direction:column;gap:3px}
.jc-einm b{color:var(--lime)}
.jc-erster{font-size:12px;color:rgba(255,255,255,.6)}
.jc-break{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.14);display:flex;flex-direction:column;gap:13px}
.jc-bt{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;color:rgba(255,255,255,.85);margin-bottom:5px}
.jc-ba{font-family:var(--disp);font-weight:600;color:#fff;white-space:nowrap}
.jc-track{height:8px;border-radius:100px;background:rgba(255,255,255,.12);overflow:hidden}
.jc-fill{height:100%;border-radius:100px;background:var(--lime);transition:width .35s cubic-bezier(.2,.7,.3,1)}
.jc-fill.fix{background:rgba(255,255,255,.55)}
.jc-fill.minus{background:#E4A0A0}
.jc-abzug{margin-top:14px;background:rgba(228,160,160,.16);border:1px solid rgba(228,160,160,.42);border-radius:11px;padding:10px 13px;font-size:12px;color:#F6D9D9;line-height:1.5}
.jc-bm{font-size:10.5px;color:rgba(255,255,255,.5);margin-top:4px}
.jc-note{font-size:11.5px;color:rgba(255,255,255,.5);line-height:1.5;margin:18px 0 0}
/* Anhänge */
.bwfiles{display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin-top:2px}
.bwfiles input[type=file]{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.bwf-btn{display:inline-flex;align-items:center;gap:7px;background:var(--side);border:1.5px dashed var(--hair);border-radius:11px;padding:10px 16px;font-size:13px;font-weight:600;color:var(--ink);cursor:pointer;margin:0;transition:border-color .14s}
.bwf-btn:hover{border-color:var(--accent2)}
.bwf-hint{font-size:12.5px;color:var(--sec)}
.bwf-liste{display:flex;flex-direction:column;gap:7px;margin-top:10px}
.bwf-i{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--hair);border-radius:11px;padding:9px 12px}
.bwf-ic{color:var(--accent2);display:flex;flex-shrink:0}
.bwf-n{flex:1;font-size:13px;font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bwf-g{font-size:11.5px;color:var(--sec);white-space:nowrap}
.bwf-x{border:none;background:var(--side);color:var(--sec);width:22px;height:22px;border-radius:50%;font-size:14px;line-height:1;cursor:pointer;flex-shrink:0}
.bwf-x:hover{background:var(--bad);color:#fff}
@media(max-width:760px){.jd-profil{grid-template-columns:1fr}.jc-grid{grid-template-columns:1fr;gap:22px}.jd-calc{padding:22px}}
.jd-b{background:var(--side);border-radius:13px;padding:15px 17px}
.jd-b b{display:block;font-family:var(--disp);font-weight:700;font-size:14.5px;margin-bottom:4px}
.jd-b span{font-size:13px;color:var(--sec);line-height:1.5}
.jd-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.jd-s{display:flex;gap:12px;align-items:flex-start}
.jd-s .jd-sn{width:30px;height:30px;border-radius:9px;background:var(--accent);color:#fff;font-family:var(--disp);font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.jd-s b{display:block;font-size:14px;margin-bottom:2px}
.jd-s span{font-size:12.5px;color:var(--sec);line-height:1.45}
.jd-final{background:linear-gradient(160deg,#00530C 0%,#003F09 55%,#00320B 100%);color:#fff;border-radius:20px;padding:36px;text-align:center}
.jd-final h2{font-family:var(--disp);font-weight:700;font-size:24px;margin:0 0 8px}
.jd-final p{font-size:15px;color:rgba(255,255,255,.75);margin:0 0 20px}
.jd-final .btn{background:var(--lime);color:var(--accent)}
.jd-danke{background:var(--surface);border:1px solid var(--hair);border-radius:20px;padding:44px 34px;text-align:center;max-width:600px;margin:0 auto}
.jdk-ic{width:62px;height:62px;border-radius:50%;background:var(--mint);color:var(--accent);font-size:30px;display:flex;align-items:center;justify-content:center;margin:0 auto 18px}
.jd-danke h1{font-family:var(--disp);font-weight:700;font-size:26px;margin:0 0 10px}
.jd-danke p{font-size:15px;color:var(--sec);line-height:1.55;margin:0 0 20px}
.jdk-box{background:var(--side);border-radius:14px;padding:18px 20px;text-align:left;margin-bottom:18px}
.jdk-r{display:flex;justify-content:space-between;gap:14px;padding:6px 0;font-size:13.5px;border-bottom:1px solid var(--hair)}
.jdk-r:last-child{border-bottom:none}
.jdk-r span{color:var(--sec)}
.jdk-s{font-size:12.5px!important;color:var(--sec)}
.jobfoot{border-top:1px solid var(--hair);background:var(--surface)}
.jf-in{max-width:1000px;margin:0 auto;padding:22px 24px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:12.5px;color:var(--sec)}
.jobslink{display:flex;align-items:center;justify-content:space-between;gap:14px;background:var(--mint);border-radius:14px;padding:15px 18px;margin-top:14px;cursor:pointer;transition:transform .14s}
.jobslink:hover{transform:translateY(-1px)}
.jl-t{font-weight:600;font-size:14px;color:var(--mintink)}
.jl-s{font-size:12px;color:var(--mintink);opacity:.75;margin-top:2px}
@media(max-width:760px){.jd-cols{grid-template-columns:1fr}.jobhero{padding:36px 20px 34px}.jd-head,.jd-box{padding:20px}.jf-n{margin-left:0;width:100%}}
.sb-kurz{font-size:14px;color:var(--sec);line-height:1.55;margin-bottom:14px}
.sb-bar{height:7px;border-radius:100px;background:var(--hair);overflow:hidden;margin-bottom:18px}
.sb-fill{height:100%;border-radius:100px;background:var(--accent);transition:width .35s cubic-bezier(.2,.7,.3,1)}
.sb-liste{display:flex;flex-direction:column;gap:8px}
.sb-p{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;background:var(--side);border:1px solid transparent;border-radius:12px;cursor:pointer;transition:background .14s,border-color .14s}
.sb-p:hover{border-color:var(--accent2)}
.sb-p.an{background:var(--mint);border-color:#CBEFC6}
.sb-p input{width:18px;height:18px;margin-top:1px;flex-shrink:0;accent-color:var(--accent);cursor:pointer}
.sb-tx{flex:1;font-size:13.5px;line-height:1.45;color:var(--ink);font-weight:500}
.sb-p.an .sb-tx{color:var(--mintink)}
.sb-opt{font-size:10.5px;font-weight:500;color:var(--sec);background:var(--surface);padding:1px 8px;border-radius:100px;margin-left:4px}
.sb-st{font-size:11px;color:var(--sec);white-space:nowrap;flex-shrink:0}
.sb-fragen{margin-top:16px;padding-top:14px;border-top:1px dashed var(--hair)}
.sb-ft{font-size:11px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--accent2);margin-bottom:8px}
.sb-fragen ul{margin:0;padding:0;list-style:none}
.sb-fragen li{position:relative;padding-left:18px;font-size:13.5px;color:var(--sec);line-height:1.5;margin-bottom:6px}
.sb-fragen li::before{content:"„";position:absolute;left:0;top:2px;font-family:var(--disp);font-weight:700;color:var(--accent2)}
.sb-notiz{margin-top:14px;background:var(--mint);color:var(--mintink);border-radius:11px;padding:11px 14px;font-size:13px;line-height:1.5}
.sb-akt{display:flex;gap:9px;margin-top:14px;flex-wrap:wrap;align-items:center}
.sb-akt input{flex:1;min-width:220px;margin:0}
@media(max-width:640px){.sb-akt{flex-direction:column;align-items:stretch}.sb-akt input{min-width:0}.sb-st{display:none}}
.eabar.big{max-width:none;height:12px;flex:1}
.eafill{height:100%;border-radius:100px;background:var(--accent);transition:width .4s cubic-bezier(.2,.7,.3,1)}
.eahead{display:flex;align-items:center;gap:20px;margin:18px 0 4px;flex-wrap:wrap}
.ea-zahl{font-family:var(--disp);font-weight:700;font-size:26px;color:var(--accent);line-height:1;white-space:nowrap}
.ea-zahl span{display:block;font-family:var(--body);font-weight:400;font-size:12px;color:var(--sec);margin-top:4px}
.eamod{background:var(--surface);border:1px solid var(--hair);border-radius:16px;padding:18px 20px;margin-bottom:12px}
.eamod.done{background:linear-gradient(180deg,#fff,#F6FBF3);border-color:#DCE9DA}
.em-head{display:flex;align-items:center;gap:13px}
.em-n{width:30px;height:30px;border-radius:10px;background:var(--side);color:var(--sec);font-family:var(--disp);font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.eamod.done .em-n{background:var(--accent);color:#fff}
.em-tx{flex:1;min-width:0}
.em-t{font-family:var(--disp);font-weight:700;font-size:15.5px;line-height:1.25}
.em-opt{font-family:var(--body);font-weight:500;font-size:11px;color:var(--sec);background:var(--side);padding:2px 8px;border-radius:100px;vertical-align:middle}
.em-m{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--accent2);font-weight:600;margin-top:3px}
.em-i{font-size:13.5px;color:var(--sec);line-height:1.5;margin:10px 0 0 43px}
.em-notiz{margin:8px 0 0 43px;background:var(--mint);color:var(--mintink);border-radius:10px;padding:9px 13px;font-size:12.5px;line-height:1.5}
.em-stamp{margin:8px 0 0 43px;font-size:11.5px;color:var(--sec)}
.em-akt{display:flex;gap:9px;flex-wrap:wrap;margin:12px 0 0 43px}
.em-notizfeld{display:flex;gap:8px;margin:10px 0 0 43px}
.em-notizfeld input{flex:1;margin:0}
@media(max-width:640px){.em-i,.em-akt,.em-notiz,.em-stamp,.em-notizfeld{margin-left:0}.em-notizfeld{flex-direction:column}}
@media(max-width:1100px){.recboard{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.recboard{grid-template-columns:1fr}}
.fb-t .s{font-weight:400}

/* Gastgeber-Events */
.ggnote{background:var(--mint);color:var(--mintink);border-radius:14px;padding:15px 18px;font-size:13.5px;line-height:1.55}
.ggnote b{font-weight:600}
.ggwarn{margin-top:18px;background:#FDF6EC;border:1px solid #F0DFC4;border-radius:14px;padding:15px 18px;font-size:12.5px;line-height:1.55;color:#6b5433}
.ggwarn b{color:var(--warn);font-weight:600}
.ggcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:14px;margin-top:4px}
.ggcard{background:var(--surface);border:1px solid var(--hair);border-radius:14px;padding:18px}
.ggcard .gc-tag{display:inline-block;font-size:10.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--accent2);margin-bottom:7px}
.ggcard .gc-t{font-family:var(--disp);font-weight:600;font-size:15px;margin-bottom:4px}
.ggcard .gc-d{font-size:12.5px;color:var(--sec);line-height:1.5}
.ggthemen{display:grid;grid-template-columns:repeat(auto-fit,minmax(268px,1fr));gap:14px;margin-top:4px}
.ggthema{background:var(--surface);border:1px solid var(--hair);border-radius:16px;padding:20px;display:flex;flex-direction:column}
.ggthema .gt-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:6px}
.ggthema .gt-t{font-family:var(--disp);font-weight:600;font-size:15.5px;line-height:1.25}
.ggthema .gt-k{font-size:13px;color:var(--sec);line-height:1.5;margin-bottom:12px}
.gt-l{list-style:none;margin:0;padding:0}
.gt-l li{position:relative;padding-left:17px;font-size:12.5px;color:var(--ink);line-height:1.45;margin-bottom:6px}
.gt-l li::before{content:"";position:absolute;left:0;top:7px;width:5px;height:5px;border-radius:50%;background:var(--accent2)}
.ggthema .gt-f{margin-top:auto;padding-top:12px;font-size:11.5px;color:var(--sec)}
.ggsplit{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ggbox{background:var(--surface);border:1px solid var(--hair);border-radius:16px;padding:20px}
.ggbox .gb-t{font-family:var(--disp);font-weight:600;font-size:15px;margin-bottom:10px}
.gb-l{list-style:none;margin:0;padding:0}
.gb-l li{position:relative;padding-left:24px;font-size:13.5px;line-height:1.5;margin-bottom:9px}
.gb-l li::before{content:"";position:absolute;left:0;top:3px;width:15px;height:15px;border-radius:5px;background:var(--mint)}
.gb-l li::after{content:"";position:absolute;left:5px;top:6px;width:4px;height:7px;border:2px solid var(--accent);border-top:0;border-left:0;transform:rotate(42deg)}
.gb-l.wirkung li::before{background:#EDFBBD}
.gb-note{margin-top:12px;padding-top:12px;border-top:1px dashed var(--hair);font-size:12.5px;color:var(--sec);line-height:1.5}
.gb-note b{color:var(--ink);font-weight:600}
.ggfb{display:grid;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));gap:12px}
.ggfb-i{background:var(--side);border-radius:12px;padding:14px 15px;text-align:center}
.ggfb-i .v{font-family:var(--disp);font-weight:700;font-size:24px;color:var(--accent);line-height:1}
.ggfb-i .l{font-size:11.5px;color:var(--sec);margin-top:5px;line-height:1.35}
.ggfb-i.edit{background:var(--surface);border:1px solid var(--hair);padding:10px 12px}
.ggfb-i.edit input{width:100%;text-align:center;font-family:var(--disp);font-weight:700;font-size:21px;color:var(--accent);padding:5px 4px;margin:0}
.notizliste .nz{padding:11px 0;border-bottom:1px dashed var(--hair)}
.notizliste .nz:first-child{padding-top:0}
.notizliste .nz:last-child{border-bottom:none;padding-bottom:0}
.notizliste .nz-m{font-size:11.5px;color:var(--sec);font-weight:600;margin-bottom:3px}
.notizliste .nz-t{font-size:13.5px;color:var(--ink);line-height:1.5}
@media(max-width:760px){.ggsplit{grid-template-columns:1fr}}
.fbadd{margin-top:14px;padding-top:16px;border-top:1px dashed var(--hair)}
.fbfoot{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:18px;padding:16px 20px;background:var(--mint);border-radius:14px}
.fbfoot .btn{white-space:nowrap}
.dsgvo-check{display:flex;align-items:flex-start;gap:10px;margin-top:14px;padding:12px 14px;background:var(--side);border-radius:12px;cursor:pointer;font-size:13px;line-height:1.5;color:var(--sec)}
.dsgvo-check input{margin-top:2px;width:17px;height:17px;flex-shrink:0;accent-color:var(--accent);cursor:pointer}
.dsgvo-check b{color:var(--ink);font-weight:600}
/* Nutzerverwaltung: Status-Switcher + Stamps */
.userstatus{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:16px;padding:14px 16px;background:var(--side);border-radius:12px}
.userstatus .us-lbl{font-size:13px;font-weight:600;color:var(--ink)}
.userstatus .us-sub{font-size:12.5px;color:var(--sec);margin-top:2px}
.switch{position:relative;flex-shrink:0;width:46px;height:26px;border-radius:100px;border:none;background:#cfccc4;cursor:pointer;padding:0;transition:background .16s}
.switch.on{background:var(--accent)}
.switch .knob{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:left .16s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.switch.on .knob{left:23px}
/* Persönliche Landingpage im Nutzer-Modal (nur HUB Adviser).
   Übernommen aus der Entwurfsvorlage alltagsallianz-hub-plattform-18.html. */
.lpblock{margin-top:18px;padding:18px;background:var(--side);border-radius:14px}
.lp-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:14px;border-bottom:1px solid var(--hair);margin-bottom:4px}
.lp-t{display:flex;align-items:center;gap:8px;font-family:var(--disp);font-weight:700;font-size:15px}
.lp-t svg{color:var(--accent2)}
.lp-s{font-size:12.5px;color:var(--sec);margin-top:3px}
.lp-url{display:flex;align-items:center;gap:0;background:var(--surface);border:1px solid var(--hair);border-radius:12px;overflow:hidden}
.lp-url span{flex:0 1 auto;min-width:0;font-size:13px;color:var(--sec);padding:0 0 0 13px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;direction:rtl;text-align:left}
.lp-url input{flex:1 1 120px;min-width:90px;border:none;border-radius:0;padding-left:2px;font-weight:600}
.lp-url input:focus{box-shadow:none}
.lp-url:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(0,63,9,.1)}
.lp-url .lp-open2,.lp-url .lp-copy{flex-shrink:0;margin:4px 4px 4px 0;border:1px solid var(--hair);
  background:var(--side);color:var(--sec);border-radius:8px;padding:5px 11px;font-family:inherit;
  font-size:12px;font-weight:600;cursor:pointer;text-decoration:none;line-height:1.5}
.lp-url .lp-open2:hover,.lp-url .lp-copy:hover{border-color:var(--accent2);color:var(--ink)}
.lp-foto{display:flex;align-items:center;gap:16px;margin-top:2px}
.lpf-bild{width:78px;height:78px;border-radius:20px;overflow:hidden;flex-shrink:0;background:var(--mint);
  display:flex;align-items:center;justify-content:center;border:1px solid var(--hair)}
.lpf-bild img{width:100%;height:100%;object-fit:cover;display:block}
.lpf-leer{font-family:var(--disp);font-weight:700;font-size:26px;color:var(--accent)}
.lpf-akt{flex:1;min-width:0}
.lpf-akt input[type=file]{position:absolute;width:1px;height:1px;opacity:0}
.lpf-btn{display:inline-flex;align-items:center;gap:7px;background:var(--surface);border:1.5px dashed var(--hair);
  border-radius:11px;padding:9px 15px;font-size:13px;font-weight:600;color:var(--ink);cursor:pointer;margin:0}
.lpf-btn:hover{border-color:var(--accent2)}
.lpf-akt .btn-ghost{margin-left:8px;padding:9px 15px;font-size:13px}
.lpf-hint{font-size:11.5px;color:var(--sec);margin-top:8px;line-height:1.45}
.lp-mini{width:38px;height:38px;border-radius:11px;object-fit:cover;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.lp-mini.leer{background:var(--mint);color:var(--accent);font-family:var(--disp);font-weight:700;font-size:14px}
.lp-global{display:flex;align-items:flex-start;gap:9px;background:var(--surface);border:1px solid var(--hair);border-radius:11px;padding:11px 13px;margin-top:14px;font-size:12.5px;color:var(--sec);line-height:1.5}
.lp-global svg{color:var(--accent2);flex-shrink:0;margin-top:1px}
.lp-global b{color:var(--ink);font-weight:600}
.lp-akt{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-top:16px}
.mono{font-family:ui-monospace,'SF Mono',Menlo,Consolas,monospace;font-size:12.5px;letter-spacing:.02em}
/* Einbettungscode des Partner-Webwidgets */
.codebox{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;line-height:1.6;background:var(--surface);
  white-space:pre;overflow-x:auto;color:var(--ink)}
.codebox:focus{border-color:var(--accent)}
@media(max-width:560px){
  .lp-foto{flex-direction:column;align-items:flex-start}
  .lp-url{flex-wrap:wrap;padding:4px 0}
  .lp-url span{padding:2px 13px 0}
  .lp-url input{width:100%}
}
.stampbox{margin-top:16px;padding:14px 16px;background:var(--surface);border:1px solid var(--hair);border-radius:12px}
.stamp-row{display:flex;justify-content:space-between;gap:12px;padding:4px 0;font-size:12.5px}
.stamp-row .stamp-k{color:var(--sec);font-weight:600}
.stamp-row .stamp-v{color:var(--ink);text-align:right}
/* Gebietsverwaltung */
.chartcard{background:var(--surface);border:1px solid var(--hair);border-radius:16px;padding:20px 22px;box-shadow:0 4px 20px rgba(20,20,18,.04);overflow-x:auto}
.gzuord{margin-top:16px;padding:14px 16px;background:var(--surface);border:1px solid var(--hair);border-radius:12px}
.gzuord .gz-title{font-size:12.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--sec);margin-bottom:8px}
.gz-row{display:flex;justify-content:space-between;gap:14px;padding:5px 0;font-size:13px}
.gz-row .gz-k{color:var(--sec);font-weight:600;flex-shrink:0}
.gz-row .gz-v{color:var(--ink);text-align:right}
.gzuord .gz-hint{font-size:11.5px;color:var(--sec);margin-top:8px;line-height:1.4}
.chiplist{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px;min-height:20px}
/* Diese drei Regeln galten fuer jedes .chip und standen weiter unten als die
   Regel fuer die auswaehlbaren Chips - sie gewannen dadurch und faerbten auch
   die Auswahl im Assistenten mintgruen ein. Jetzt gelten sie nur noch
   innerhalb ihres eigenen Bausteins .chiplist. */
.chiplist .chip{display:inline-flex;align-items:center;gap:6px;background:var(--mint);color:var(--mintink);font-size:13px;font-weight:500;padding:6px 6px 6px 12px;border-radius:100px}
.chiplist .chip button{border:none;background:rgba(15,44,47,.12);color:var(--mintink);width:18px;height:18px;border-radius:50%;font-size:13px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.chiplist .chip button:hover{background:var(--bad);color:#fff}
.chipadd{display:flex;gap:8px;margin-top:12px}
.chipadd input{flex:1}
/* HW-Kräfte kommen aus dem Stamm: Auswahlfeld verhält sich wie das Textfeld
   davor (Select2 rendert seine eigene Box, deshalb min-width:0). */
.chipadd select,.chipadd .select2{flex:1;min-width:0}
/* Adviser-Onboarding (Zwischenseite) */
.onbwrap{min-height:100vh;background:var(--bg);display:flex;justify-content:center;padding:40px 20px 80px}
.onbcard{width:100%;max-width:720px}
/* Kopf: Logo bleibt links stehen, der Titel steht mittig über der Karte.
   Das Logo liegt dafür absolut links, damit es die Mitte nicht verschiebt. */
.onbhead{position:relative;display:flex;align-items:center;justify-content:center;gap:30px;margin-bottom:26px}
.onbhead>span:first-child{position:absolute;left:0;top:50%;transform:translateY(-50%)}
.onbhead-tx{text-align:center}
.onbhead-t{font-family:var(--disp);font-weight:600;font-size:19px;color:var(--ink)}
.onbhead-s{font-size:13px;color:var(--sec);margin-top:2px}
@media(max-width:640px){
  .onbhead{flex-direction:column;justify-content:flex-start;gap:12px}
  .onbhead>span:first-child{position:static;transform:none}
}
.onbsteps{display:flex;align-items:center;gap:0;margin-bottom:28px}
.onbstep{display:flex;align-items:center;gap:9px}
.onbstep .os-n{width:28px;height:28px;border-radius:50%;background:var(--side);color:var(--sec);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;flex-shrink:0;border:1px solid var(--hair)}
.onbstep .os-l{font-size:13px;font-weight:600;color:var(--sec);white-space:nowrap}
.onbstep.cur .os-n{background:var(--accent);color:#fff;border-color:var(--accent)}
.onbstep.cur .os-l{color:var(--ink)}
.onbstep.done .os-n{background:var(--mint);color:var(--mintink);border-color:var(--mint)}
.onbstep-line{flex:1;height:2px;background:var(--hair);margin:0 12px}
.onbstep-line.done{background:var(--accent)}
.onbbody{background:var(--surface);border:1px solid var(--hair);border-radius:20px;padding:30px;box-shadow:0 8px 30px rgba(20,20,18,.05)}
.onbbody h2{font-family:var(--disp);font-weight:600;font-size:20px;margin:0 0 6px}
.onbtext{font-size:14px;color:var(--sec);line-height:1.5;margin:0 0 22px}
.onbfoot{display:flex;justify-content:space-between;gap:12px;margin-top:26px;flex-wrap:wrap}
.onbfoot .btn,.onbfoot .btn-ghost{flex:0 0 auto}
/* Verdienstkalkulation */
.vk-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:20px;align-items:start}
.vk-group{margin-bottom:18px}
.vk-group:last-child{margin-bottom:0}
.vk-gt{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--accent2);margin-bottom:10px;display:flex;align-items:center;gap:8px}
.vk-once{background:#FBEAD0;color:var(--warn);font-size:9.5px;letter-spacing:.04em;padding:2px 7px;border-radius:100px}
.vk-ctrl{margin-bottom:14px}
.vk-ctrl:last-child{margin-bottom:0}
.vk-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:7px}
.vk-lbl{font-size:13px;font-weight:600;color:var(--ink)}
.vk-sub{display:block;font-size:11px;font-weight:400;color:var(--sec);margin-top:1px}
.vk-val{font-family:var(--disp);font-weight:700;font-size:17px;color:var(--accent)}
.vk-ctrl input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:5px;border-radius:100px;background:var(--hair);outline:none;cursor:pointer}
.vk-ctrl input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:var(--accent);border:3px solid #fff;box-shadow:0 1px 5px rgba(0,0,0,.25);cursor:pointer}
.vk-ctrl input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--accent);border:3px solid #fff;cursor:pointer}
.vk-scale{display:flex;justify-content:space-between;font-size:10.5px;color:var(--sec);margin-top:4px}
.vk-result{background:linear-gradient(160deg,#00530C 0%,#003F09 55%,#00320B 100%);color:#fff;border-radius:16px;padding:22px}
.vk-big{padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.16);margin-bottom:14px}
.vk-big.second{padding-bottom:0;border-bottom:none;margin-bottom:0}
.vk-big-l{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.vk-big-n{font-family:var(--disp);font-weight:700;font-size:34px;line-height:1.05;letter-spacing:-.02em;margin:4px 0 2px}
.vk-big.second .vk-big-n{font-size:26px;color:#EDFBBD}
.vk-big-s{font-size:11.5px;color:rgba(255,255,255,.62)}
.vk-break{margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.16);display:flex;flex-direction:column;gap:7px}
.vk-br{display:grid;grid-template-columns:1fr auto 62px;gap:8px;align-items:baseline;font-size:12.5px}
.vk-br .n{color:rgba(255,255,255,.85)}
.vk-br .v{font-family:var(--disp);font-weight:600;color:#fff;white-space:nowrap}
.vk-br .t{font-size:10px;color:rgba(255,255,255,.5);text-align:right}
.vk-br.once .v{color:#EDFBBD}
.vk-fast{margin-top:14px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);border-radius:11px;padding:10px 13px;font-size:11.5px;line-height:1.5;color:rgba(255,255,255,.78)}
.vk-fast b{color:#fff;font-weight:600}
.vk-fast.ok{background:rgba(237,251,189,.14);border-color:rgba(237,251,189,.4)}
.vk-fast.ok b{color:#EDFBBD}
@media(max-width:760px){.vk-grid{grid-template-columns:1fr;gap:18px}}
.onbfoot .btn,.onbfoot .btn-ghost{flex:0 0 auto}
/* Vertrag */
.vertrag{border:1px solid var(--hair);border-radius:14px;padding:24px;background:#fdfdfc;max-height:360px;overflow-y:auto}
.vtr-h{border-bottom:1px solid var(--hair);padding-bottom:14px;margin-bottom:14px}
.vtr-title{font-family:var(--disp);font-weight:700;font-size:16px}
.vtr-sub{font-size:12.5px;color:var(--sec);margin-top:4px;line-height:1.4}
.vtr-party{font-size:14px;margin-bottom:16px}
.vtr-sec{margin-bottom:14px}
.vtr-sec b{font-size:13.5px;display:block;margin-bottom:4px}
.vtr-sec p{font-size:13px;color:#3a3a34;line-height:1.55;margin:0}
.vtr-meta{display:flex;gap:30px;margin-top:18px;padding-top:14px;border-top:1px solid var(--hair)}
.vtr-meta .vm-k{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--sec)}
.vtr-meta .vm-v{font-size:13.5px;font-weight:600}
.siglabel{font-size:13px;font-weight:600;margin:20px 0 8px}
.siglabel .s{font-weight:400;color:var(--sec)}
.sigrow{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
/* Abschluss */
.onbdone{text-align:center}
.onbcheck{width:64px;height:64px;border-radius:50%;background:var(--mint);color:var(--mintink);font-size:32px;display:flex;align-items:center;justify-content:center;margin:0 auto 18px}
.onbsummary{background:var(--side);border-radius:14px;padding:18px 20px;margin:22px 0;text-align:left}
.onbsummary .os-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:7px 0;font-size:13.5px;border-bottom:1px solid var(--hair)}
.onbsummary .os-row:last-child{border-bottom:none}
.onbsummary .os-k{color:var(--sec);font-weight:600}
.onbsummary .os-v{color:var(--ink);text-align:right}
@media(max-width:640px){.onbbody{padding:20px}.onbstep .os-l{display:none}.onbstep-line{margin:0 6px}.vertrag{padding:16px;max-height:300px}.onbfoot .btn,.onbfoot .btn-ghost{flex:1;justify-content:center}}
/* Freigaben */
.segbadge{display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 5px;margin-left:5px;background:var(--warn);color:#fff;border-radius:100px;font-size:10px;font-weight:700;vertical-align:middle}
.freigcard{background:var(--surface);border:1px solid var(--hair);border-radius:16px;padding:20px 22px;box-shadow:0 4px 20px rgba(20,20,18,.04);margin-bottom:14px}
.freigcard .fc-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding-bottom:14px;border-bottom:1px solid var(--hair);margin-bottom:14px}
.freigcard .fc-name{font-family:var(--disp);font-weight:600;font-size:16px}
.freigcard .fc-sub{font-size:12.5px;color:var(--sec);margin-top:3px}
.fc-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}
.fc-f,.fc-vtr{display:flex;flex-direction:column;gap:2px}
.fc-vtr{margin-top:14px;padding-top:12px;border-top:1px solid var(--hair)}
.fc-k{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--sec);font-weight:600}
.fc-v{font-size:13.5px;color:var(--ink)}
.fc-foot{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}
.linkbtn{display:inline;background:none;border:none;padding:0;margin:0;color:var(--accent);font-family:var(--body);font-size:inherit;line-height:inherit;font-weight:600;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.linkbtn:focus-visible{outline:2px solid var(--accent2);outline-offset:2px;border-radius:3px}
.linkbtn:hover{color:var(--mintink)}
.vtr-sig{margin-top:20px;padding-top:16px;border-top:1px solid var(--hair)}
.vtr-sig-box{display:inline-block}
.vtr-sig-box img{display:block;height:56px;max-width:220px;object-fit:contain}
.vtr-sig-line{border-top:1px solid var(--ink);margin-top:4px;padding-top:4px;font-size:13px;font-weight:600;min-width:180px}
.vtr-sig-cap{font-size:11px;color:var(--sec);margin-top:2px}
.mono{font-family:ui-monospace,'SF Mono',Menlo,Consolas,monospace;font-size:12.5px;letter-spacing:.02em}
/* Demo-Modus im Onboarding */
.demorow{margin-top:16px;padding-top:14px;border-top:1px dashed var(--hair);text-align:center}
.demolink{background:none;border:none;padding:0;color:var(--accent);font-family:var(--body);font-size:13.5px;font-weight:600;cursor:pointer;text-decoration:underline}
.demolink:hover{color:var(--mintink)}
.demohint{font-size:12px;color:var(--sec);margin-top:4px;line-height:1.45}
.vtr-sigid{margin-top:12px;display:flex;flex-direction:column;gap:2px}
.vtr-sigid .vsi-k{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--sec);font-weight:600}
.vtr-sigid .vsi-v{font-family:ui-monospace,'SF Mono',Menlo,Consolas,monospace;font-size:13px;font-weight:600;color:var(--accent)}
.vtrview{max-height:60vh;overflow-y:auto;margin-top:8px}
.vtrview .vertrag{max-height:none}
@media(max-width:640px){.fc-grid{grid-template-columns:1fr}.fc-foot .btn,.fc-foot .btn-ghost{flex:1;justify-content:center}}
.callhist{max-height:180px;overflow-y:auto;border:1px solid var(--hair);border-radius:12px;background:var(--surface);margin-bottom:4px}
.callhist.empty-hist{padding:14px 16px;font-size:13px;color:var(--sec)}
.ch-item{display:grid;grid-template-columns:130px 1fr;gap:12px;padding:11px 16px;border-bottom:1px solid var(--hair);align-items:start}
.ch-item:last-child{border-bottom:none}
.ch-item.call{background:var(--mint)}
.ch-item .ch-d{font-size:12px;color:var(--sec);font-weight:600}
.ch-item.call .ch-d{color:var(--mintink)}
.ch-item .ch-t{font-size:13px;line-height:1.45}
.ch-item.call .ch-t{color:var(--mintink);font-weight:500}

/* Toast */
#toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:11px 22px;border-radius:100px;font-size:13px;font-weight:500;opacity:0;transition:all .25s;z-index:99;pointer-events:none;white-space:nowrap}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* Hero payout (partner) */
.hero{padding:34px 0 30px;border-bottom:1px solid var(--hair)}
.hero .hv{font-family:var(--disp);font-weight:700;font-size:clamp(44px,7vw,64px);letter-spacing:-.02em;line-height:1.05}
.hero .hv small{font-size:.45em;font-weight:600;color:var(--sec)}
.hero .hl{color:var(--sec);margin-top:6px}
.hero .hl b{color:var(--ok);font-weight:600}

/* Bars in operator capacity */
.cap{height:6px;background:#EBE8E1;border-radius:100px;overflow:hidden;margin-top:6px;max-width:180px}
.cap i{display:block;height:100%;background:var(--ink);border-radius:100px}
.cap i.hi{background:var(--accent)}

/* Meldungs-Threads */
.msg{padding:16px 0;border-bottom:1px solid var(--hair)}
.msg .mh{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:12px;color:var(--sec)}
.msg .mh .mn{font-weight:600;color:var(--ink)}
.mdot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.mdot.partner{background:var(--accent)}
.mdot.adviser{background:var(--ok)}
.mdot.zentrale{background:var(--ink)}
/* HUB Coordinator / HUB Promoter antworten ebenfalls in Meldungs-Threads -
   ohne eigene Regel blieb ihr Punkt farblos. */
.mdot.coordinator{background:var(--warn)}
.mdot.promoter{background:var(--accent2)}
.msg .mx{margin-top:6px}
.msg .matt{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.att-chip{display:inline-flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--hair);border-radius:10px;padding:7px 12px;font-size:12.5px;font-weight:500;color:var(--ink);max-width:260px}
.att-chip .ai{color:var(--accent);flex-shrink:0;display:inline-flex}
.att-chip .an{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.att-chip .asz{color:var(--sec);font-size:11px;flex-shrink:0}
.att-chip.pending{background:var(--mint);border-color:transparent;color:var(--mintink)}
.att-chip.pending .ai{color:var(--mintink)}
.att-chip .arm{cursor:pointer;color:var(--sec);flex-shrink:0;font-size:15px;line-height:1;padding:0 2px}
.att-chip .arm:hover{color:var(--bad)}
.composer{margin-top:24px;padding-top:18px;border-top:1px solid var(--hair);max-width:680px}
.composer .attbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px}
.att-add{display:inline-flex;align-items:center;gap:7px;border:1px dashed var(--hair);border-radius:10px;padding:8px 14px;font-size:13px;font-weight:600;color:var(--sec);background:var(--surface);cursor:pointer;transition:border-color .14s,color .14s}
.att-add:hover{border-color:var(--accent);color:var(--accent)}
#mel-pending{display:flex;flex-wrap:wrap;gap:8px}
.legend{display:flex;gap:18px;flex-wrap:wrap;font-size:12px;color:var(--sec);margin-top:8px}
.legend span{display:inline-flex;gap:6px;align-items:center}

/* Onboarding-Fortschritt */
.prog{height:6px;background:#EBE8E1;border-radius:100px;overflow:hidden;margin:10px 0 4px}
.prog i{display:block;height:100%;background:var(--accent);border-radius:100px;transition:width .25s}
.prog.done i{background:var(--ok)}

/* Vertragsvorschau */
.contract{background:#fff;border:1px solid var(--hair);border-radius:14px;padding:28px 32px;max-height:400px;overflow:auto;font-size:12.5px;line-height:1.6;margin-top:14px}
.contract .cbrand{font-family:var(--disp);font-weight:700;font-size:13px}
.contract .cbrand span{color:var(--accent)}
.contract .ctitle{font-family:var(--disp);font-weight:600;font-size:18px;margin:12px 0 4px}
.contract .cmeta{color:var(--sec);margin-bottom:8px}
.contract h4{font-size:12.5px;margin:14px 0 2px}
.contract p{color:#3A3833}
.contract .csig{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:28px}
.contract .csig .cimg{height:56px;display:flex;align-items:flex-end;padding-bottom:4px}
.contract .csig .cimg img{max-height:52px;max-width:100%}
.contract .csig .clbl{border-top:1px solid var(--ink);padding-top:5px;font-size:11px;color:var(--sec)}
.signame{font-family:var(--disp);font-style:italic;font-weight:600;font-size:19px;color:var(--ink)}
.sigwrap{margin-top:18px}
canvas.sigpad{width:100%;height:150px;background:#fff;border:1px dashed var(--hair);border-radius:14px;touch-action:none;display:block;cursor:crosshair}
.sigwrap.ok canvas.sigpad{border-style:solid;border-color:var(--ok)}

/* Adress-Autocomplete */
.ac{position:relative}
.ac-list{position:absolute;left:0;right:0;top:100%;z-index:5;background:var(--surface);border:1px solid var(--hair);border-radius:12px;margin-top:4px;box-shadow:0 8px 24px rgba(20,20,18,.10);overflow:hidden;max-height:240px;overflow-y:auto}
.ac-item{padding:10px 13px;cursor:pointer;border-bottom:1px solid var(--hair)}
.ac-item:last-child{border-bottom:none}
.ac-item:hover,.ac-item.on{background:#f0f0ef}
.ac-item .as{font-weight:600}
.ac-item .ao{font-size:12px;color:var(--sec);margin-top:1px}

/* Turnus-Stepper */
.stepper{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.stepper .srow{display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid var(--hair);border-radius:12px;padding:12px 14px;background:var(--surface)}
.stepper .srow .sl{font-weight:600}
.stepper .srow .sl small{display:block;font-weight:400;font-size:12px;color:var(--sec);margin-top:1px}
.stepper .ctrl{display:flex;align-items:center;gap:12px;flex-shrink:0}
.stepper .ctrl .np{width:34px;height:34px;border-radius:50%;border:1px solid var(--hair);background:var(--surface);font-size:20px;line-height:1;color:var(--ink);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.stepper .ctrl .np:hover:not(:disabled){border-color:var(--ink)}
.stepper .ctrl .np:disabled{opacity:.35;cursor:default}
.stepper .ctrl .sv{font-family:var(--disp);font-weight:600;font-size:18px;min-width:20px;text-align:center}
.stepper .ctrl .seg{flex-shrink:0}
.stepper .ctrl .seg button{padding:7px 12px;font-size:12.5px}

/* Formulargruppen (Modals) */
.fgroup{margin-top:20px;padding-top:16px;border-top:1px solid var(--hair)}
.fgroup:first-of-type{margin-top:10px;padding-top:0;border-top:none}
.fgroup .eyebrow{margin-bottom:2px}
.fgroup label{margin-top:12px}

/* Zuweisungshistorie im Modal */
.zwhist{border:1px solid var(--hair);border-radius:14px;background:var(--surface);padding:14px 16px;margin-top:14px}
.zwhist .tl{margin-top:2px}

/* Filterbar + Segment-Switcher */
.filterbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:0 0 18px}
.filterbar input{max-width:250px}
.filterbar select{width:auto}
.filterbar .cnt{font-size:12px;color:var(--sec);margin-left:auto}
.seg{display:inline-flex;border:1px solid var(--hair);border-radius:100px;background:var(--surface);overflow:hidden}
.seg button{padding:8px 14px;font-size:12.5px;color:var(--sec);border-right:1px solid var(--hair);white-space:nowrap}
.seg button:last-child{border-right:none}
.seg button.on{background:var(--ink);color:#fff;font-weight:600}

/* misc */
.note{font-size:12.5px;color:var(--sec);background:var(--surface);border:1px solid var(--hair);border-radius:12px;padding:12px 14px;margin-top:14px}
.right{text-align:right}
.mt8{margin-top:8px}.mt16{margin-top:16px}.mt24{margin-top:24px}

/* ============ MOBILE (ans Ende für Vorrang) ============ */
/* ===== Tablet (641–960px): Sidebar oben umbrechen ===== */
@media(max-width:960px) and (min-width:641px){
  .shell{flex-direction:column}
  .side{width:100%;height:auto;position:sticky;top:0;z-index:50;flex-direction:row;flex-wrap:wrap;align-items:center;gap:12px 18px;padding:14px 20px;border-right:none;border-bottom:1px solid var(--hair)}
  .side .wordmark{margin-bottom:0}
  .side nav{flex-direction:row;flex-wrap:wrap;gap:8px 16px}
  .side nav a{margin:0;padding:7px 12px}
  .side nav a.on::before{display:none}
  .side .rolelabel,.side .spacer{display:none}
  .side .me{border:none;padding:0;margin-left:auto}
  .main{padding:24px 24px 60px}
}

/* ===== Handy (≤640px): Bottom-Navigation ===== */
@media(max-width:640px){
  .shell{flex-direction:column;min-height:100vh}
  .side{
    position:fixed;bottom:0;left:0;right:0;top:auto;width:100%;height:auto;z-index:100;
    flex-direction:row;align-items:stretch;gap:0;padding:0;
    background:var(--surface);border-right:none;border-top:1px solid var(--hair);
    box-shadow:0 -4px 20px rgba(20,20,18,.06)
  }
  .side .wordmark,.side .rolelabel,.side .spacer,.side .me{display:none}
  .side nav{flex-direction:row;flex:1;gap:0;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .side nav a{
    flex:1 0 auto;min-width:22%;margin:0;padding:9px 6px;border-radius:0;
    display:flex;align-items:center;justify-content:center;gap:5px;
    text-align:center;font-size:11px;font-weight:600;line-height:1.15;position:relative
  }
  .side nav a.on{background:none;color:var(--accent)}
  .side nav a.on::before{display:none}
  .side nav a .navlabel{display:inline}
  /* Counter mit klarem Abstand neben dem Label statt daran klebend */
  .side nav a .badge{
    position:static;margin:0;min-width:15px;height:15px;padding:0 4px;
    font-size:9.5px;line-height:15px;border-radius:100px;display:inline-flex;flex-shrink:0
  }

  .main{padding:20px 16px 88px;max-width:100%}

  /* Mobile Top-Bar */
  .mtop{display:flex;align-items:center;justify-content:space-between;gap:12px;position:sticky;top:0;z-index:90;background:var(--surface);border-bottom:1px solid var(--hair);padding:12px 16px}
  .mtop-act{display:flex;align-items:center;gap:10px}
  .mtop-set{background:none;border:none;color:var(--sec);cursor:pointer;padding:4px;display:flex}
  .mtop-set svg{margin:0}
  .mtop .help{width:26px;height:26px;border:1px solid var(--hair);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;color:var(--sec);background:var(--surface);cursor:pointer}
  .mtop-out{background:var(--ink);color:#fff;border:none;border-radius:100px;padding:8px 16px;font-family:var(--body);font-size:13px;font-weight:600;cursor:pointer}

  /* Header / Titel */
  .pagehead h1{font-size:24px}
  .headrow{flex-direction:column;align-items:flex-start;gap:14px}
  .headrow .btnrow{width:100%;flex-wrap:wrap}
  .btnrow .btn,.btnrow .btn-ghost{flex:1;justify-content:center;white-space:nowrap}

  /* KPIs: 2 Spalten */
  .kpis{grid-template-columns:1fr 1fr;gap:10px}
  .kpi{padding:16px 15px;border-radius:14px}
  .kpi .v{font-size:26px}

  /* Sektionen etwas enger */
  .section{margin-top:26px}
  .section h2{font-size:17px}
  .shead{flex-wrap:wrap;gap:4px}

  /* Zeilen: Grid -> Flex-Wrap, damit alle Infos sichtbar bleiben und umbrechen */
  .rows{padding:4px 14px;border-radius:14px}
  .row{display:flex !important;flex-wrap:wrap;align-items:center;grid-template-columns:none !important;gap:6px 12px;padding:14px 0}
  .row > *{min-width:0}
  .row .t{width:100%}
  .row .s{font-size:12px}
  .row .num{margin-left:auto;text-align:right}
  .row .arr{margin-left:auto}
  .row .st{margin-left:0}

  /* Spaltenköpfe auf Mobile ausblenden (Zeilen sind selbsttragend) */
  .colhead{display:none !important}

  /* Meldungs-Thread */
  .composer{max-width:100%}
  .msg .matt{gap:6px}

  /* Modals: fast Vollbild, über der Bottom-Nav */
  .overlay{padding:0;align-items:flex-end;z-index:200}
  .sheet{max-width:100%;width:100%;border-radius:20px 20px 0 0;max-height:94vh;padding:22px 18px}
  .f2{grid-template-columns:1fr}
  .snav{position:sticky;bottom:0;background:var(--bg);padding-top:14px;margin-top:18px}
  .snav .btn,.snav .btn-ghost{flex:1;justify-content:center}

  /* Login */
  .rolerow{padding:16px 0}

  /* Benachrichtigungs-Matrix: horizontal scrollbar */
  .notif-tbl{overflow-x:auto}
  .nt-head,.nt-row{grid-template-columns:130px repeat(4,64px);min-width:400px}

  /* Einstellungen-Tabs */
  .seg2{width:100%;overflow-x:auto}
  .seg2 button{white-space:nowrap;padding:8px 14px;font-size:13px}

  /* Material-Stepper */
  .matbar{flex-direction:column;align-items:stretch}
  .qty{gap:8px}

  /* Anruf-Modal Verlauf */
  .callhist{max-height:150px}
  .ch-item{grid-template-columns:100px 1fr;gap:8px;padding:10px 12px}
  .callres{grid-template-columns:1fr}

  /* Tabellen/Charts nicht überlaufen */
  .rail{overflow-x:auto}
  svg{max-width:100%}
}

/* Sehr schmale Geräte (≤380px): KPIs einspaltig */
@media(max-width:380px){
  .kpis{grid-template-columns:1fr}
  .side nav a{font-size:10px}
}

/* Alt-Regel entfernt, ersetzt durch obige Blöcke */
@media(max-width:860px) and (min-width:961px){.side nav a .badge{margin-left:6px}}


/* ==================== EINARBEITUNG · MODULE UND FRAGEN ====================
   Übernommen aus der Entwurfsvorlage
   alltagsallianz-hub-plattform-einarbeitung_new.html (unverändert). */
.mvplayer{background:var(--grad,linear-gradient(160deg,#00530C,#003F09 55%,#00320B));border-radius:20px;
  aspect-ratio:16/7;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
  color:var(--lime);margin-bottom:20px;text-align:center;padding:20px}
.mv-play{width:72px;height:72px;border-radius:50%;background:rgba(237,251,189,.18);border:none;color:var(--lime);
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .16s,background .16s;padding-left:5px}
.mv-play:hover{background:var(--lime);color:var(--accent);transform:scale(1.06)}
.mv-t{font-family:var(--disp);font-weight:700;font-size:16px;color:#fff}
.mv-s{font-size:13px;color:rgba(255,255,255,.65)}
.mvfolien{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:16px}
.mvf{background:var(--surface);border:1px solid var(--hair);border-radius:16px;padding:20px;min-height:110px;
  display:flex;flex-direction:column;justify-content:flex-end}
.mvf-n{font-size:11px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--accent2);margin-bottom:5px}
.mvf-t{font-family:var(--disp);font-weight:700;font-size:15.5px;line-height:1.25}
.mvdone{display:flex;align-items:center;gap:14px}
.mvd-ic{width:42px;height:42px;border-radius:50%;background:var(--accent);color:var(--lime);font-size:20px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0}
.mvdone b{display:block;font-family:var(--disp);font-size:16px}
.mvdone span{font-size:13px;color:var(--sec)}
.mdl-lead{font-size:16px;color:var(--sec);line-height:1.6;max-width:66ch;margin:0 0 22px}
.mdl-embed{border-radius:20px;overflow:hidden;background:var(--ink);aspect-ratio:16/9;max-height:460px}
.mdl-embed iframe{width:100%;height:100%;border:0;display:block}
.mdl-player{background:var(--grad,linear-gradient(160deg,#00530C 0%,#003F09 55%,#00320B 100%));border-radius:20px;
  aspect-ratio:16/9;max-height:420px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;position:relative}
.mdl-play{width:74px;height:74px;border-radius:50%;background:rgba(237,251,189,.18);border:none;color:var(--lime);
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .15s,background .15s}
.mdl-play:hover{transform:scale(1.06);background:rgba(237,251,189,.3)}
.mdl-pt{font-size:14px;color:rgba(255,255,255,.75)}
.mdl-leiste{position:absolute;left:26px;right:26px;bottom:22px;height:5px;border-radius:100px;background:rgba(255,255,255,.2)}
.mdl-fort{display:block;height:100%;width:0;border-radius:100px;background:var(--lime)}
.mdl-folie{background:var(--surface);border:1px solid var(--hair);border-radius:20px;padding:34px;min-height:300px;
  display:flex;flex-direction:column;box-shadow:0 4px 20px rgba(20,20,18,.04)}
.mf-n{font-size:11.5px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--accent2);margin-bottom:10px}
.mf-t{font-family:var(--disp);font-weight:700;font-size:26px;letter-spacing:-.02em;margin-bottom:12px}
.mf-i{font-size:15.5px;color:var(--sec);line-height:1.6;flex:1;max-width:60ch}
.mf-nav{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:24px;padding-top:20px;border-top:1px solid var(--hair)}
.mf-nav button[disabled]{opacity:.4;cursor:not-allowed}
.mf-punkte{display:flex;gap:7px}
.mf-p{width:8px;height:8px;border-radius:50%;background:var(--hair)}
.mf-p.on{background:var(--accent);width:22px;border-radius:100px}
.mynext{display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap;
  background:var(--grad,linear-gradient(160deg,#00530C 0%,#003F09 55%,#00320B 100%));color:#fff;
  border-radius:18px;padding:24px 28px;margin-bottom:20px}
.mn-k{font-size:11.5px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--lime);margin-bottom:6px}
.mn-t{font-family:var(--disp);font-weight:700;font-size:21px;letter-spacing:-.015em;line-height:1.2}
.mn-m{display:flex;align-items:center;gap:7px;font-size:13px;color:rgba(255,255,255,.72);margin-top:5px}
.mynext .btn{background:var(--lime);color:var(--accent);flex-shrink:0}
.eahead{display:flex;align-items:center;gap:20px;margin:18px 0 4px;flex-wrap:wrap}
.ea-zahl{font-family:var(--disp);font-weight:700;font-size:26px;color:var(--accent);line-height:1;white-space:nowrap}
.ea-zahl span{display:block;font-family:var(--body);font-weight:400;font-size:12px;color:var(--sec);margin-top:4px}
.eamod{background:var(--surface);border:1px solid var(--hair);border-radius:16px;padding:18px 20px;margin-bottom:12px}
.eamod.done{background:linear-gradient(180deg,#fff,#F6FBF3);border-color:#DCE9DA}
.em-head{display:flex;align-items:center;gap:13px}
.em-n{width:30px;height:30px;border-radius:10px;background:var(--side);color:var(--sec);font-family:var(--disp);font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.eamod.done .em-n{background:var(--accent);color:#fff}
.em-tx{flex:1;min-width:0}
.em-t{font-family:var(--disp);font-weight:700;font-size:15.5px;line-height:1.25}
.em-opt{font-family:var(--body);font-weight:500;font-size:11px;color:var(--sec);background:var(--side);padding:2px 8px;border-radius:100px;vertical-align:middle}
.em-m{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--accent2);font-weight:600;margin-top:3px}
.em-i{font-size:13.5px;color:var(--sec);line-height:1.5;margin:10px 0 0 43px}
.fq-kopf{display:flex;align-items:center;justify-content:space-between;gap:14px;font-family:var(--disp);font-weight:700;font-size:15px;margin-bottom:12px}
.fq-frage{background:#FDF6EC;border:1px solid #F0DFC4;color:#6b5433;border-radius:12px;padding:12px 15px;font-size:13px;line-height:1.55}
.fq-frage b{color:#5a4526}
.fq-frage > div{margin-top:5px;font-size:14px}
.fq-antwort{background:var(--mint);color:var(--mintink);border-radius:12px;padding:12px 15px;font-size:13px;line-height:1.55;margin-top:10px}
.fq-antwort > div{margin-top:5px;font-size:14px}
.fq-mail{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:11.5px;opacity:.8}
.fq-mail svg{width:13px;height:13px}
.artzelle{display:inline-flex;align-items:center;gap:7px;line-height:1}
.artzelle svg{display:block;flex-shrink:0}

/* ==================== WERBEFLYER JE HUB ====================
   Aus der Entwurfsvorlage alltagsallianz-hub-plattform-19.html.
   fb-t und fb-s sind dort global gesetzt und wuerden die gleichnamige
   Klasse im Feedback-Block ueberschreiben - deshalb hier auf .flyerbanner
   eingegrenzt. Das Aussehen des Banners bleibt dadurch unveraendert. */
.flyerbanner{display:flex;align-items:center;gap:18px;background:var(--mint);color:var(--mintink);
  border-radius:18px;padding:20px 24px;margin-bottom:18px;flex-wrap:wrap}
.fb-ic{width:44px;height:44px;border-radius:13px;background:var(--accent);color:var(--lime);
  display:flex;align-items:center;justify-content:center;flex-shrink:0}
.fb-tx{flex:1;min-width:230px}
.flyerbanner .fb-t{font-family:var(--disp);font-weight:700;font-size:17px;letter-spacing:-.012em;margin-bottom:0;display:block}
.flyerbanner .fb-s{font-size:13.5px;opacity:.8;margin-top:3px;line-height:1.5}
.flyerbanner .btn{flex-shrink:0}

/* ==================== STANDORT-ONBOARDING (HUB) ====================
   Aus der Entwurfsvorlage alltagsallianz-hub-plattform-19.html. */
.gebietsgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:9px;margin-top:6px}
.dsvertrag{background:var(--surface);border:1px solid var(--hair);border-radius:13px;padding:18px 20px;
  font-size:13.5px;line-height:1.6;color:var(--sec);max-height:210px;overflow-y:auto}
.dsvertrag b{display:block;font-family:var(--disp);font-size:15px;color:var(--ink);margin-bottom:9px}
.dsvertrag p{margin:0 0 10px}
.dsvertrag p:last-child{margin-bottom:0}


/* ==================== ZUGANG (Passwort vor der Rollen-Auswahl) ====================
   1:1 aus der Entwurfsvorlage alltagsallianz-hub-plattform-password.html. */
.zugang .zgbox{background:var(--surface);border:1px solid var(--hair);border-radius:18px;padding:26px;
  margin-top:6px;box-shadow:0 4px 24px rgba(20,20,18,.05);text-align:left}
.zugang .zgbox label:first-child{margin-top:0}
.zugang .dsgvo-check a{color:var(--accent);font-weight:600;cursor:pointer;text-decoration:underline}
.zg-fehler{margin-top:14px;background:#FDF0F0;border:1px solid #F3DADA;color:#8d3b3b;border-radius:12px;
  padding:11px 14px;font-size:13px;line-height:1.5}
.gebietsgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:9px;margin-top:6px}
/* ==================== HINWEIS "BEREITS REGISTRIERT" ====================
   1:1 aus der Entwurfsvorlage alltagsallianz-recruiting.html. */
.skipbanner{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
  background:var(--mint);color:var(--mintink);border-radius:16px;padding:18px 22px;margin:0 0 26px}
.skipbanner .sb-l{display:flex;align-items:center;gap:14px;flex:1;min-width:250px}
.skipbanner .sb-ic{width:40px;height:40px;border-radius:12px;background:var(--accent);color:var(--lime);
  display:flex;align-items:center;justify-content:center;flex-shrink:0}
.skipbanner .sb-t{font-family:var(--disp);font-weight:700;font-size:16px;letter-spacing:-.01em}
.skipbanner .sb-s{font-size:13px;opacity:.82;margin-top:3px;line-height:1.5}
.skipbanner .btn{flex-shrink:0}
@media(max-width:620px){.skipbanner .btn{width:100%}}

/* ==================== VERDIENSTRECHNER (Schritt 0, nur HUB Adviser) ====================
   1:1 aus der Entwurfsvorlage alltagsallianz-recruiting.html. */
.vk-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:20px;align-items:start}
.vk-group{margin-bottom:18px}
.vk-group:last-child{margin-bottom:0}
.vk-gt{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--accent2);margin-bottom:10px;display:flex;align-items:center;gap:8px}
.vk-once{background:#FBEAD0;color:var(--warn);font-size:9.5px;letter-spacing:.04em;padding:2px 7px;border-radius:100px}
.vk-ctrl{margin-bottom:14px}
.vk-ctrl:last-child{margin-bottom:0}
.vk-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:7px}
.vk-lbl{font-size:13px;font-weight:600;color:var(--ink)}
.vk-sub{display:block;font-size:11px;font-weight:400;color:var(--sec);margin-top:1px}
.vk-val{font-family:var(--disp);font-weight:700;font-size:17px;color:var(--accent)}
.vk-ctrl input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:5px;border-radius:100px;background:var(--hair);outline:none;cursor:pointer}
.vk-ctrl input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:var(--accent);border:3px solid #fff;box-shadow:0 1px 5px rgba(0,0,0,.25);cursor:pointer}
.vk-ctrl input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--accent);border:3px solid #fff;cursor:pointer}
.vk-scale{display:flex;justify-content:space-between;font-size:10.5px;color:var(--sec);margin-top:4px}
.vk-result{background:linear-gradient(160deg,#00530C 0%,#003F09 55%,#00320B 100%);color:#fff;border-radius:16px;padding:22px}
.vk-big{padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.16);margin-bottom:14px}
.vk-big.second{padding-bottom:0;border-bottom:none;margin-bottom:0}
.vk-big-l{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.vk-big-n{font-family:var(--disp);font-weight:700;font-size:34px;line-height:1.05;letter-spacing:-.02em;margin:4px 0 2px}
.vk-big.second .vk-big-n{font-size:26px;color:#EDFBBD}
.vk-big-s{font-size:11.5px;color:rgba(255,255,255,.62)}
.vk-break{margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.16);display:flex;flex-direction:column;gap:7px}
.vk-br{display:grid;grid-template-columns:1fr auto 62px;gap:8px;align-items:baseline;font-size:12.5px}
.vk-br .n{color:rgba(255,255,255,.85)}
.vk-br .v{font-family:var(--disp);font-weight:600;color:#fff;white-space:nowrap}
.vk-br .t{font-size:10px;color:rgba(255,255,255,.5);text-align:right}
.vk-br.once .v{color:#EDFBBD}
.vk-fast{margin-top:14px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);border-radius:11px;padding:10px 13px;font-size:11.5px;line-height:1.5;color:rgba(255,255,255,.78)}
.vk-fast b{color:#fff;font-weight:600}
.vk-fast.ok{background:rgba(237,251,189,.14);border-color:rgba(237,251,189,.4)}
.vk-fast.ok b{color:#EDFBBD}
@media(max-width:760px){.vk-grid{grid-template-columns:1fr;gap:18px}}

/* ==========================================================================
   Zentrale · Recruiting (Übersicht & Bewerbungen / Vakanzen / Einarbeitung)
   Trichter über die Prozessstufen und die Kennzeichnung des zuständigen
   Recruiters. Gestaltung 1:1 aus alltagsallianz-recruiting.html.
   ========================================================================== */
.zust{display:inline-flex;align-items:center;gap:6px;background:var(--side);border-radius:100px;padding:3px 11px;font-size:12.5px;font-weight:500;color:var(--ink)}
.trichter{display:flex;flex-direction:column;gap:9px}
.tr-z{display:grid;grid-template-columns:150px 1fr 52px;align-items:center;gap:14px;width:100%;
  background:none;border:1.5px solid transparent;border-radius:11px;padding:7px 10px;cursor:pointer;
  font-family:var(--body);text-align:left;transition:all .14s}
.tr-z:hover{background:var(--side)}
.tr-z.on{border-color:var(--accent);background:var(--side)}
.tr-l{font-size:13.5px;font-weight:600;color:var(--ink)}
.tr-b{height:22px;border-radius:7px;background:var(--hair);overflow:hidden;display:block}
.tr-f{display:block;height:100%;border-radius:7px;background:var(--accent);transition:width .35s cubic-bezier(.2,.7,.3,1)}
.tr-f.aus{background:var(--sec);opacity:.45}
.tr-n{font-family:var(--disp);font-weight:700;font-size:16px;color:var(--accent);text-align:right}

/* ==========================================================================
   Einarbeitung · Folien-Editor und Audio-Module
   Aufbau und Gestaltung 1:1 aus alltagsallianz-hub-plattform.html.
   ========================================================================== */
.folie{display:flex;gap:12px;align-items:flex-start;background:var(--surface);border:1px solid var(--hair);
  border-radius:14px;padding:14px;margin-bottom:10px}
.fol-nr{width:28px;height:28px;border-radius:9px;background:var(--accent);color:#fff;font-family:var(--disp);
  font-weight:700;font-size:13px;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px}
.fol-feld{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px}
.fol-feld input,.fol-feld textarea{margin:0}
.fol-akt{display:flex;flex-direction:column;gap:4px;flex-shrink:0}
.fol-akt button{padding:5px 10px;font-size:13px;line-height:1}
.fol-akt button[disabled]{opacity:.35;cursor:not-allowed}
.fol-kopf{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:16px 0 10px}
.audiozeile{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:4px}
.audiozeile input[type=file]{position:absolute;width:1px;height:1px;opacity:0}
.au-vor{flex:1;min-width:180px;background:var(--side);border-radius:11px;padding:10px 14px;font-size:13px}
.au-ok{display:inline-flex;align-items:center;gap:7px;color:var(--accent);font-weight:600}
.au-leer{color:var(--sec)}
.mdl-audio{background:var(--grad,linear-gradient(160deg,#00530C 0%,#003F09 55%,#00320B 100%));
  border-radius:20px;padding:30px 32px;color:#fff}
.ma-kopf{display:flex;align-items:center;gap:16px}
.ma-ic{width:48px;height:48px;border-radius:14px;background:rgba(237,251,189,.18);color:var(--lime);
  display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ma-t{font-family:var(--disp);font-weight:700;font-size:19px;letter-spacing:-.015em}
.ma-s{font-size:13px;color:rgba(255,255,255,.7);margin-top:3px}
.mdl-audio audio{border-radius:10px}
/* Hinweis auf der dunklen Audio-Karte - der helle .note-Kasten von
   oben wirkte dort wie ein leeres Eingabefeld. */
.ma-fehlt{margin-top:16px;padding:12px 16px;border-radius:11px;
  background:rgba(237,251,189,.13);color:rgba(255,255,255,.86);font-size:13px;line-height:1.5}
.mdl-txt{font-size:15px;line-height:1.7;color:var(--sec)}

/* Vereinbarung: der Text steht genau so da, wie ihn die Zentrale unter
   Einstellungen -> Vorlagen -> PDF-Dokument eingetragen hat. Zeilenumbrüche
   und Leerzeilen bleiben deshalb erhalten. */
.vtr-text{white-space:pre-wrap;font-size:13px;color:#3a3a34;line-height:1.6;
  overflow-wrap:anywhere}

/* Anmeldung: Konto noch nicht von der Zentrale freigegeben. Kein Fehler des
   Nutzers - deshalb orange statt rot. */
.lg-error.lg-wartet{color:#B45309;background:#FFFBEB;border-color:#FDE68A}

/* ═══════════════════════════════════════════════════════════
 *  Inventar
 *  ----------------------------------------------------------
 *  Karten der eigenen Gegenstaende, Untertabs der Zentrale,
 *  Bildauswahl und der QR-Block auf der Gegenstandsakte.
 *  Uebernommen aus der Vorlage alltagsallianz-hub-inventory.html.
 * ═══════════════════════════════════════════════════════════ */
.me-inv{font-size:12px}
.me-inv.on{color:var(--accent);font-weight:600}
.invkarte{background:var(--surface);border:1px solid var(--hair);border-radius:18px;padding:22px 24px;margin-bottom:14px;
  box-shadow:0 4px 20px rgba(20,20,18,.04)}
.invkarte.offen{border-color:#F0DFC4;background:#FEFBF5}
.ik-kopf{display:flex;align-items:center;gap:15px}
.ik-ic{width:44px;height:44px;border-radius:13px;background:var(--mint);color:var(--mintink);
  display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ik-tx{flex:1;min-width:0}
.ik-t{font-family:var(--disp);font-weight:700;font-size:17px;letter-spacing:-.012em}
.ik-s{font-size:13px;color:var(--sec);margin-top:3px}
.ik-hinweis{font-size:13px;color:var(--sec);background:var(--side);border-radius:11px;padding:11px 14px;margin-top:13px;line-height:1.55}
.ik-vb{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--accent);margin-top:12px}
.ik-vb svg{width:14px;height:14px}
.ik-akt{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-top:16px}
.invvertrag{background:var(--side);border-radius:13px;padding:18px 20px;font-size:13.5px;line-height:1.6;
  color:var(--sec);max-height:260px;overflow-y:auto;margin-top:4px}
.invvertrag b{color:var(--ink)}
.invvertrag > b:first-child{display:block;font-family:var(--disp);font-size:15px;margin-bottom:10px}
.invvertrag p{margin:0 0 10px}
.invvertrag p:last-child{margin-bottom:0}

/* Inventar: Untertabs, Bild-Upload, QR-Code */
.subseg{background:transparent;border:none;padding:0;gap:18px;margin:2px 0 4px;border-bottom:1px solid var(--hair);border-radius:0;width:100%;display:flex}
.subseg button{border-radius:0;padding:9px 2px 11px;font-size:13.5px;border-bottom:2px solid transparent;background:none}
.subseg button.on{background:none;box-shadow:none;color:var(--accent);border-bottom-color:var(--accent)}
.bildfeld{margin-top:6px}
.bilddrop{display:flex;align-items:center;gap:12px;border:1.5px dashed var(--hair);border-radius:14px;padding:14px 16px;background:var(--side);cursor:pointer;transition:border-color .14s,background .14s}
.bilddrop:hover{border-color:var(--accent);background:#fff}
.bilddrop.voll{opacity:.5;cursor:not-allowed}
.bilddrop .bd-ic{flex-shrink:0;width:36px;height:36px;border-radius:10px;background:#fff;border:1px solid var(--hair);display:flex;align-items:center;justify-content:center;color:var(--sec)}
.bilddrop .bd-t{display:block;font-size:13.5px;font-weight:600;color:var(--ink)}
.bilddrop .bd-s{display:block;font-size:12px;color:var(--sec);margin-top:2px;line-height:1.45}
.bildliste{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
.bildkachel{position:relative;aspect-ratio:4/3;border-radius:12px;overflow:hidden;border:1px solid var(--hair);background:var(--side)}
.bildkachel img{width:100%;height:100%;object-fit:cover;display:block}
.bildkachel .bk-x{position:absolute;top:6px;right:6px;width:24px;height:24px;border:none;border-radius:50%;background:rgba(20,20,18,.72);color:#fff;font-size:15px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.bildkachel .bk-x:hover{background:var(--bad)}
.bildkachel .bk-n{position:absolute;left:6px;bottom:6px;background:rgba(20,20,18,.72);color:#fff;font-size:10.5px;font-weight:600;padding:2px 7px;border-radius:100px}
.qrblock{display:flex;gap:18px;align-items:center;border:1px solid var(--hair);border-radius:16px;padding:16px 18px;background:var(--side);margin:0 0 16px}
.qrblock .qb-code{flex-shrink:0;background:#fff;border:1px solid var(--hair);border-radius:12px;padding:8px;line-height:0}
.qrblock .qb-tx{min-width:0}
.qrblock .qb-l{font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--sec)}
.qrblock .qb-id{font-family:var(--mono,ui-monospace,monospace);font-size:15px;font-weight:600;color:var(--ink);margin-top:4px;word-break:break-all}
.qrblock .qb-s{font-size:12.5px;color:var(--sec);margin-top:6px;line-height:1.5}
@media(max-width:640px){.qrblock{flex-direction:column;align-items:flex-start}.bildliste{grid-template-columns:repeat(2,1fr)}}

/* Rueckgabe-Ablauf (Stufen und Zielwahl) und die Personenliste beim
   Zuweisen - ebenfalls aus der Vorlage. */
.rueckstufen{display:flex;gap:8px;margin:4px 0 20px}
.rueckstufen .rs{flex:1;display:flex;align-items:center;gap:8px;padding:9px 11px;border-radius:11px;background:var(--side);font-size:12.5px;color:var(--sec)}
.rueckstufen .rs-n{width:22px;height:22px;border-radius:50%;background:var(--hair);color:var(--sec);display:flex;align-items:center;
  justify-content:center;font-size:11.5px;font-weight:600;flex-shrink:0}
.rueckstufen .rs.cur{background:var(--accent);color:#fff}
.rueckstufen .rs.cur .rs-n{background:rgba(255,255,255,.25);color:#fff}
.rueckstufen .rs.done{background:var(--mint);color:var(--mintink)}
.rueckstufen .rs.done .rs-n{background:var(--accent);color:#fff}
.rueckwahl{display:flex;gap:9px;flex-wrap:wrap;margin-top:6px}
.wahlliste{margin-top:10px;border:1px solid var(--hair);border-radius:14px;background:var(--surface);max-height:250px;overflow-y:auto}
.wahlliste .wl{display:flex;align-items:center;gap:11px;padding:11px 14px;border-bottom:1px solid var(--hair);cursor:pointer;transition:background .12s}
.wahlliste .wl:last-child{border-bottom:none}
.wahlliste .wl:hover{background:var(--side)}
.wahlliste .wl.on{background:var(--mint)}
.wahlliste .wl-av{width:32px;height:32px;border-radius:50%;background:var(--side);border:1px solid var(--hair);display:flex;align-items:center;
  justify-content:center;font-size:12px;font-weight:700;color:var(--sec);flex-shrink:0}
.wahlliste .wl.on .wl-av{background:var(--accent);border-color:var(--accent);color:#fff}
.wahlliste .wl-tx{min-width:0;flex:1}
.wahlliste .wl-n{font-size:13.5px;font-weight:600;color:var(--ink)}
.wahlliste .wl-r{font-size:12px;color:var(--sec);margin-top:1px}
.wahlliste .wl-ck{flex-shrink:0;color:var(--accent);font-size:15px;opacity:0}
.wahlliste .wl.on .wl-ck{opacity:1}
.wahlliste .wl-leer{padding:16px 14px;font-size:13px;color:var(--sec)}

/* ==========================================================================
   MOBILITY · Fuhrpark und Fahrzeugbuchungen
   Aussehen 1:1 aus der Vorlage alltagsallianz-mobility.html: Belegungsplan,
   Filterzeile, Fotopositionen, Auslagen, Vereinbarungen und Anhänge.
   Gehört zu js/hub-mobility.js.
   ========================================================================== */
.wm-legende{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;font-size:11.5px;color:var(--sec)}
.wm-legende span{display:inline-flex;align-items:center;gap:5px}
.wm-legende i{width:9px;height:9px;border-radius:50%;display:inline-block}
/* Kundenfilter (Adviser): Suche oben, Statuswahl darunter */
.kundenfilter{margin:22px 0 18px}
.kf-zeile{display:flex;gap:10px;align-items:center}
.kf-zeile input,.kf-zeile select{height:38px;line-height:36px;padding-top:0;padding-bottom:0;font-size:13.5px;border-radius:100px}
.kf-zeile input{flex:1 1 auto;max-width:none;padding-left:16px}
.kf-zeile select{flex:0 0 auto;width:auto;padding-right:34px;padding-left:15px;background-position:right 12px center}
.kf-zeile2{display:flex;gap:14px;align-items:center;margin-top:12px}
.kf-zeile2 .cnt{font-size:12px;color:var(--sec);margin-left:auto;white-space:nowrap}
.statusseg{width:auto;flex:0 1 auto}
@media(max-width:720px){.kf-zeile{flex-wrap:wrap}.kf-zeile input,.kf-zeile select{flex:1 1 100%}.kf-zeile2{flex-wrap:wrap}.kf-zeile2 .cnt{margin-left:0}}
/* Zwei Aktionen nebeneinander in einer Tabellenzeile */
.btnpaar{display:flex;gap:8px;justify-content:flex-end;flex-wrap:nowrap}
.btnpaar button{white-space:nowrap;flex:0 0 auto}
@media(max-width:900px){.btnpaar{flex-wrap:wrap}}
/* Anhänge an Werkstattterminen */
.anhang{display:flex;align-items:center;gap:10px;border:1px solid var(--hair);border-radius:12px;
  padding:10px 12px;background:var(--surface);margin-top:8px}
.anhang .an-ic{width:30px;height:30px;border-radius:8px;background:var(--side);border:1px solid var(--hair);
  display:flex;align-items:center;justify-content:center;color:var(--sec);flex-shrink:0}
.anhang .an-tx{flex:1;min-width:0}
.anhang .an-n{font-size:13px;font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.anhang .an-s{font-size:11.5px;color:var(--sec);margin-top:1px}
.anhang .an-x{border:none;background:none;color:var(--sec);font-size:17px;cursor:pointer;padding:0 4px;line-height:1}
.anhang .an-x:hover{color:var(--bad)}
.anhangdrop{display:flex;align-items:center;gap:10px;border:1.5px dashed var(--hair);border-radius:12px;
  padding:11px 12px;background:var(--side);cursor:pointer;margin-top:8px;transition:border-color .14s,background .14s}
.anhangdrop:hover{border-color:var(--accent);background:#fff}
.anhangdrop .ad-t{display:block;font-size:13px;font-weight:600;color:var(--ink)}
.anhangdrop .ad-s{display:block;font-size:11.5px;color:var(--sec);margin-top:1px;line-height:1.45}
/* 1-%-Vereinbarung */
.vertragbox{border:1px solid var(--hair);border-radius:14px;background:var(--surface);padding:16px 18px;
  max-height:280px;overflow-y:auto;font-size:13px;line-height:1.6;margin-top:8px}
.vertragbox b{display:block;font-size:14px;margin-bottom:6px;color:var(--ink)}
.vertragbox p{margin:0 0 9px;color:var(--sec)}
.vertragbox p:last-child{margin-bottom:0}
.vertragbox .vb-h{font-weight:600;color:var(--ink);margin-top:12px;display:block}
/* Zustandsbewertung bei der Übernahme */
.zwahl{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-top:8px}
.zk{border:1.5px solid var(--hair);border-radius:13px;background:var(--surface);padding:12px 13px;cursor:pointer;
  transition:border-color .14s,background .14s}
.zk:hover{border-color:var(--accent2)}
.zk.on{border-color:var(--accent);background:var(--mint)}
.zk-t{font-size:13.5px;font-weight:600;color:var(--ink)}
.zk-d{font-size:11.5px;color:var(--sec);margin-top:2px;line-height:1.35}
/* Vier Fotoplätze rundum */
.fotoslots{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:8px}
.fs{position:relative;aspect-ratio:4/3;border-radius:11px;overflow:hidden;border:1.5px dashed var(--hair);background:var(--side)}
.fs.voll{border-style:solid;border-color:var(--accent)}
.fs img{width:100%;height:100%;object-fit:cover;display:block}
.fs-leer{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:100%;height:100%;
  cursor:pointer;color:var(--sec);text-align:center;padding:4px}
.fs-leer span{font-size:10.5px;font-weight:600;line-height:1.2}
.fs-leer:hover{color:var(--accent);background:#fff}
.fs-x{position:absolute;top:5px;right:5px;width:21px;height:21px;border:none;border-radius:50%;
  background:rgba(20,20,18,.72);color:#fff;font-size:13px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.fs-x:hover{background:var(--bad)}
.fs-l{position:absolute;left:5px;bottom:5px;background:rgba(20,20,18,.72);color:#fff;font-size:9.5px;font-weight:600;
  padding:2px 7px;border-radius:100px}
@media(max-width:560px){.fotoslots{grid-template-columns:repeat(2,1fr)}.zwahl{grid-template-columns:1fr}}
/* Auslagen einer Fahrt */
.au-grund{margin-top:8px;padding-left:11px;border-left:2px solid var(--bad);font-size:12px;color:var(--sec);line-height:1.5}
.au-betrag.durch{text-decoration:line-through;color:var(--sec)}
.auslagen{border:1px solid var(--hair);border-radius:14px;background:var(--surface);margin:8px 0 16px;overflow:hidden}
.au:last-child{border-bottom:none}
.au-kopf{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.au-art{font-size:13.5px;font-weight:600;color:var(--ink)}
.au-betrag{font-size:14px;font-weight:600;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums;
  display:inline-flex;align-items:center;gap:4px}
.au-sub{font-size:12px;color:var(--sec);margin-top:3px;line-height:1.5}
.au-akt{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;align-items:center}
.au-akt button{padding:7px 15px;font-size:12.5px}
.au.au-summe{background:var(--side)}
.au.au-summe .au-art,.au.au-summe .au-betrag{font-size:14px}
/* Belegungsplan des Fuhrparks */
.planwrap{border:1px solid var(--hair);border-radius:16px;background:var(--surface);padding:4px;overflow-x:auto}
.plan{display:grid;min-width:640px}
.pl-ecke{position:sticky;left:0;background:var(--surface);z-index:2;border-bottom:1px solid var(--hair)}
.pl-kopf{text-align:center;padding:9px 2px 8px;border-bottom:1px solid var(--hair);line-height:1.2}
.pl-kopf.we{background:var(--side)}
.pl-kopf .pl-wt{display:block;font-size:10px;color:var(--sec);text-transform:uppercase;letter-spacing:.06em}
.pl-kopf .pl-tg{display:block;font-size:13px;font-weight:600;color:var(--ink);margin-top:1px}
.pl-fz{position:sticky;left:0;background:var(--surface);z-index:1;padding:10px 12px 10px 10px;
  border-bottom:1px solid var(--hair);border-right:1px solid var(--hair);cursor:pointer;min-width:0}
.pl-fz:hover{background:var(--side)}
.pl-fz .pl-n{font-size:13px;font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pl-fz .pl-k{font-size:11.5px;color:var(--sec);margin-top:1px}
.pl-z{border-bottom:1px solid var(--hair);border-left:1px solid var(--hair);min-height:46px;position:relative}
.pl-z.we{background:var(--side)}
.pl-z.bel{cursor:pointer}
.pl-z.bel::after{content:'';position:absolute;inset:7px 2px;border-radius:5px;background:var(--accent)}
.pl-z.bel.angefragt::after{background:#B98E2E}
.pl-z.bel.bestaetigt::after{background:#003F09}
.pl-z.bel.laufend::after{background:#2F6D3A}
.pl-z.bel.abgeschlossen::after{background:#C9C6BE}
.pl-z.bel:hover::after{filter:brightness(1.25)}
.pl-z.sperr{background:repeating-linear-gradient(45deg,#E8E5DE 0 4px,#F4F2EC 4px 8px)}
.wahlliste .wl.wl-eng{opacity:.78}
.wahlliste .wl.wl-sperr{opacity:.55;cursor:not-allowed;background:var(--side)}
.wahlliste .wl.wl-sperr:hover{background:var(--side)}
/* Filterzeile: Suche und Filter in einer Linie, Zurücksetzen darunter */
.filterzeile{display:flex;gap:10px;align-items:center;margin:0 0 16px;flex-wrap:nowrap}
.filterzeile input,.filterzeile select{height:38px;line-height:36px;padding-top:0;padding-bottom:0;font-size:13.5px;border-radius:100px}
.filterzeile input{flex:1 1 200px;min-width:150px;max-width:none;padding-left:16px}
.filterzeile select{flex:0 1 auto;min-width:0;width:auto;padding-right:34px;padding-left:15px;
  background-position:right 12px center;text-overflow:ellipsis}
.filterzeile select:focus{box-shadow:0 0 0 3px rgba(0,63,9,.10)}
.filterfuss{display:flex;justify-content:flex-end;padding-top:12px}
@media(max-width:1100px){.filterzeile{flex-wrap:wrap}.filterzeile input{flex:1 1 100%}}

/* Fristen in den Fahrzeuglisten: HU und Wartung untereinander. Die Pillen
   duerfen umbrechen - "HU überfällig seit 10.2025" ist laenger als die Spalte
   und lief sonst in die Nachbarspalte hinein. */
.fristenzelle{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0;max-width:100%}
.fristenzelle .st{white-space:normal;max-width:100%;border-radius:12px;line-height:1.35;text-align:left}
.fristenzelle .st::before{margin-top:2px;align-self:flex-start}

/* ==========================================================================
   KUNDEN · Adviser-Kundenbereich, Umgebungskarte, Pflegegrad- und
   Leistungskarten. Aussehen 1:1 aus alltagsallianz-hub-plattform.2.html,
   gehoert zu js/hub-kunden.js.
   ========================================================================== */
.wbox.wbox-breit{max-width:1060px}
/* Assistent „Kunde anlegen“: zweispaltig mit Umgebungskarte */
.wiz2col{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;align-items:start}
.wiz2col .wiz-form{min-width:0}
.wiz-map{position:sticky;top:20px;border:1px solid var(--hair);border-radius:16px;background:var(--surface);padding:16px;min-width:0}
.wiz-map .wm-h{font-size:12.5px;font-weight:700;color:var(--ink);margin-bottom:2px}
.wiz-map .wm-s{font-size:11.5px;color:var(--sec);line-height:1.45;margin-bottom:12px}
.wiz-map .wm-leer{font-size:12.5px;color:var(--sec);line-height:1.5;padding:26px 4px;text-align:center}
@media(max-width:1080px){.wiz2col{grid-template-columns:1fr}.wiz-map{position:static}}
/* Pflegegrad-Auswahl */
.pgwahl{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:8px}
.pgk{border:1.5px solid var(--hair);border-radius:13px;background:var(--surface);padding:11px 8px 10px;cursor:pointer;
  text-align:center;transition:border-color .14s,background .14s}
.pgk:hover{border-color:var(--accent2)}
.pgk.on{border-color:var(--accent);background:var(--mint)}
.pgk .pg-n{font-family:var(--disp);font-size:19px;font-weight:700;color:var(--ink);line-height:1.1}
.pgk.on .pg-n{color:var(--accent)}
.pgk .pg-l{font-size:10.5px;color:var(--sec);margin-top:3px;line-height:1.3;min-height:26px}
.pgk .pg-bar{display:flex;gap:2px;justify-content:center;margin-top:7px}
.pgk .pg-bar i{width:100%;height:3px;border-radius:2px;background:var(--hair)}
.pgk .pg-bar i.f{background:var(--accent)}
@media(max-width:820px){.pgwahl{grid-template-columns:repeat(3,1fr)}}
/* Leistungsauswahl */
.lwahl{display:grid;grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:10px;margin-top:8px}
.lk{position:relative;border:1.5px solid var(--hair);border-radius:14px;background:var(--surface);padding:14px 14px 13px;
  cursor:pointer;transition:border-color .14s,background .14s;display:flex;gap:11px;align-items:flex-start}
.lk:hover{border-color:var(--accent2)}
.lk.on{border-color:var(--accent);background:var(--mint)}
.lk .lk-ic{width:34px;height:34px;border-radius:10px;background:var(--side);border:1px solid var(--hair);flex-shrink:0;
  display:flex;align-items:center;justify-content:center;color:var(--sec)}
.lk.on .lk-ic{background:var(--accent);border-color:var(--accent);color:#fff}
.lk .lk-t{font-size:13.5px;font-weight:600;color:var(--ink)}
.lk .lk-d{font-size:11.5px;color:var(--sec);margin-top:2px;line-height:1.35}
.lk .lk-ck{position:absolute;top:10px;right:11px;color:var(--accent);font-size:14px;opacity:0;transition:opacity .14s}
.lk.on .lk-ck{opacity:1}
/* Gesperrte Auswahl (z. B. HW-Kraft im Onboarding oder ERP-gebunden) */
.choice.locked{opacity:.62;cursor:not-allowed;background:var(--side)}
.choice.locked:hover{border-color:var(--hair)}
.choice.locked .rb{opacity:.35}
.choice .ct .st{font-size:11px}


/* ══════════════════════════════════════════════════════════
   Partner-Netzwerk

   Der oeffentliche Bereich (Startseite, Verzeichnis, Betriebsprofil,
   Anmeldung) und die Netzwerkkarten im Konto des HUB-Partners.
   Uebernommen aus der Vorlage alltagsallianz-hub-logistics.html,
   damit das Aussehen dem entspricht, was dort abgestimmt wurde.
   Gehoert zu js/hub-netzwerk.js.
   ══════════════════════════════════════════════════════════ */

/* Zahlenspalten: Kopf und Wert bündig */
.colhead .r,.colhead .right{text-align:right}
/* Hinweiszeile unterhalb einer Tabellenzeile, ohne eigene Trennlinie */
.rows .row.static.zusatz{grid-template-columns:1fr;padding:14px 0 16px;border-bottom:none}
.rows .row.static.zusatz + .row{border-top:1px solid var(--hair)}
/* Öffentlicher Netzwerkbereich */
.netzcta{background:var(--lime,#EDFBBD);color:#16150F;border:none;border-radius:100px;padding:13px 26px;
  font-family:var(--body);font-size:14.5px;font-weight:600;cursor:pointer;transition:transform .14s,filter .14s}
.netzcta:hover{transform:translateY(-1px);filter:brightness(1.04)}
.netzcta.ghost{background:rgba(255,255,255,.1);color:#fff;border:1.5px solid rgba(255,255,255,.3)}
.jobmain .netzcta.ghost{background:var(--surface);color:var(--ink);border:1.5px solid var(--hair)}
.jobmain .netzcta{background:var(--accent);color:#fff}
.netzcut .netzcta{background:var(--lime);color:#16150F}
.netzcut .netzcta:hover{filter:brightness(1.06)}
.netzsec{padding:44px 0;border-bottom:1px solid var(--hair)}
.netzsec:last-of-type{border-bottom:none}
.netz-eyebrow{font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--sec);font-weight:600;margin-bottom:9px}
.netz-h2{font-family:var(--disp);font-weight:600;font-size:clamp(22px,3.2vw,30px);letter-spacing:-.018em;margin:0 0 12px;line-height:1.18}
.netz-p{font-size:16px;color:var(--sec);line-height:1.6;max-width:66ch;margin:0 0 8px}
.netz-fuss{font-size:13.5px;color:var(--sec);line-height:1.55;margin-top:14px;max-width:66ch}
.netzgraph{margin:22px 0 6px;background:var(--grid,#F0F2F6);border-radius:18px;padding:18px 18px 14px}
.netzsvg{width:100%;height:auto;display:block}
.netzleg{display:flex;flex-wrap:wrap;gap:12px;margin-top:10px;font-size:11.5px;color:var(--sec)}
.netzleg span{display:inline-flex;align-items:center;gap:5px}
.netzleg i{width:9px;height:9px;border-radius:50%;display:inline-block}
.netzrechnung{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-top:20px}
.nr{border:1px solid var(--hair);border-radius:14px;background:var(--surface);padding:15px 17px}
.nr.jetzt{border-color:var(--accent);background:var(--mint)}
.nr-a{font-family:var(--disp);font-weight:700;font-size:17px;color:var(--ink)}
.nr-b{font-size:13px;color:var(--sec);margin-top:4px;line-height:1.4}
.nr-c{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--sec);margin-top:7px}
.nr.jetzt .nr-c{color:var(--accent);font-weight:600}
.netzschritte{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:18px}
.ns{border:1px solid var(--hair);border-radius:16px;background:var(--surface);padding:18px 20px}
.ns-n{width:26px;height:26px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;
  justify-content:center;font-size:13px;font-weight:700;margin-bottom:10px}
.ns-t{font-size:15px;font-weight:600;color:var(--ink)}
.ns-d{font-size:13.5px;color:var(--sec);line-height:1.5;margin-top:4px}
.netzbsp{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin-top:16px}
.nb{background:var(--surface);border:1px solid var(--hair);border-radius:14px;padding:14px 16px}
.nb-t{font-size:13.5px;font-weight:600;color:var(--accent)}
.nb-d{font-size:13px;color:var(--sec);line-height:1.45;margin-top:4px}
.netzbranchen{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-top:18px}
.nbr{text-align:left;background:var(--surface);border:1px solid var(--hair);border-radius:16px;padding:17px 19px;
  cursor:pointer;font-family:var(--body);transition:border-color .14s,transform .14s}
.nbr:hover{border-color:var(--accent);transform:translateY(-2px)}
.nbr.leer{opacity:.55}
.nbr-z{font-family:var(--disp);font-weight:700;font-size:24px;color:var(--accent);line-height:1}
.nbr-t{font-size:14.5px;font-weight:600;color:var(--ink);margin-top:6px}
.nbr-d{font-size:12.5px;color:var(--sec);line-height:1.45;margin-top:3px}
.netzluecken{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin-top:18px}
.nl{border:1.5px dashed var(--accent);border-radius:16px;background:var(--mint);padding:17px 19px}
.nl-b{font-size:15px;font-weight:600;color:var(--accent)}
.nl-o{font-size:13.5px;color:var(--ink);margin-top:2px}
.nl-n{font-size:12.5px;color:var(--sec);margin-top:6px;line-height:1.45}
.nl-cta{margin-top:12px;width:100%;background:var(--accent);color:#fff;border:none;border-radius:100px;
  padding:10px 16px;font-family:var(--body);font-size:13px;font-weight:600;cursor:pointer}
.netzcut{background:linear-gradient(160deg,#00530C 0%,#003F09 100%);border-radius:22px;padding:36px 32px;margin-top:36px;color:#fff}
.nc-in{max-width:56ch}
.netzcut h2{font-family:var(--disp);font-weight:700;font-size:clamp(21px,3vw,27px);margin:0 0 10px;line-height:1.2}
.netzcut p{font-size:15px;color:rgba(255,255,255,.82);line-height:1.55;margin:0 0 20px}
.netzform{background:var(--surface);border:1px solid var(--hair);border-radius:20px;padding:24px 26px;margin-top:18px}
.netzvorteile{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-top:18px}
.nv{background:var(--side);border-radius:13px;padding:14px 16px}
.nv-t{font-size:13.5px;font-weight:600;color:var(--accent)}
.nv-d{font-size:12.5px;color:var(--sec);line-height:1.45;margin-top:3px}
.netzdanke{background:var(--surface);border:1px solid var(--hair);border-radius:22px;padding:40px 34px;text-align:center;margin-top:20px}
.nd-ic{width:52px;height:52px;border-radius:50%;background:var(--mint);color:var(--accent);display:flex;
  align-items:center;justify-content:center;font-size:24px;margin:0 auto 18px}
.netzdanke h2{font-family:var(--disp);font-weight:700;font-size:25px;margin:0 0 10px}
.netzdanke p{font-size:15.5px;color:var(--sec);line-height:1.6;margin:0 auto;max-width:52ch}
.nd-box{background:var(--side);border-radius:16px;padding:20px 22px;margin-top:24px;text-align:left}
.nd-z{font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--sec);font-weight:600;margin-bottom:10px}
.nd-l{margin:0;padding-left:19px;font-size:14px;color:var(--ink);line-height:1.6}
.nd-l li{margin-bottom:6px}
.netzfuss{border-top:1px solid var(--hair);background:var(--surface);padding:26px 24px}
.nf-in{max-width:1000px;margin:0 auto;font-size:12.5px;color:var(--sec);line-height:1.6}
@media(max-width:640px){.netzcut{padding:28px 22px}.netzform{padding:20px 18px}.netzdanke{padding:30px 22px}}
/* Partner-Netzwerk: Verzeichniskarten */
.nwliste{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;margin-top:4px}
.nwk{border:1px solid var(--hair);border-radius:16px;background:var(--surface);padding:17px 19px;display:flex;flex-direction:column}
.nwk-kopf{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.nwk-n{font-size:15px;font-weight:600;color:var(--ink);line-height:1.25}
.nwk-b{font-size:12.5px;color:var(--sec);margin-top:2px}
.nwk-d{font-size:13px;color:var(--sec);line-height:1.5;margin-top:10px;flex:1}
.nwk-l{display:flex;flex-wrap:wrap;gap:6px;margin-top:11px}
.nwk-tag{font-size:11.5px;background:var(--side);border:1px solid var(--hair);color:var(--sec);padding:3px 9px;border-radius:100px}
.nwk-f{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:13px;padding-top:12px;border-top:1px solid var(--hair)}

/* ── Basisqualifizierung § 45a SGB XI ──────────────────────────────────────
   Häkchen je Baustein im Dialog "Basisqualifizierung bestätigen". Ein
   Baustein, der schon im eigenen Zugang bestanden wurde, ist festgesetzt
   (.fix) und lässt sich hier nicht wieder abwählen. */
.hmck{width:26px;height:26px;border-radius:8px;border:1.5px solid var(--hair);background:var(--surface);
  cursor:pointer;font-size:14px;font-weight:700;color:#fff;line-height:1;display:flex;align-items:center;justify-content:center}
.hmck.on{background:var(--accent);border-color:var(--accent)}
.hmck.fix{background:var(--ok);border-color:var(--ok);cursor:default}
/* Breiteres Fenster: die Bausteinliste braucht mehr Platz als ein Formular. */
.sheet.gross{max-width:760px}
/* Fortschrittsbalken der Bausteine */
.fs2-bar{height:9px;border-radius:100px;background:var(--side);margin-top:10px;overflow:hidden}
.fs2-bar span{display:block;height:100%;background:linear-gradient(90deg,#00530C,#003F09);border-radius:100px}