:root{
  --bg:#EEF2F0;--surface:#FBFCFB;--surface-2:#F4F7F5;--panel:#FFFFFF;
  --ink:#0F1E1C;--ink-soft:#2C3C3A;--muted:#5C6A68;--line:#DBE1DC;--line-strong:#C6CFC9;
  --brass:#5F9C1E;--brass-soft:#E9F3D8;--teal:#003D7C;--teal-2:#0063A6;--teal-soft:#DCE6F2;
  --violet:#0072B0;--violet-2:#009EE0;--violet-soft:#DDEFFA;--blue:#215E86;--blue-soft:#DBE9F2;
  --good:#5F9C1E;--good-soft:#E9F3D8;--warn:#9C7020;--warn-soft:#F5E9CE;--crit:#A83A2A;--crit-soft:#F6DED8;
  --shadow:0 1px 2px rgba(15,30,28,.05),0 10px 26px rgba(15,30,28,.07);
  --shadow-lg:0 2px 6px rgba(15,30,28,.06),0 20px 50px rgba(15,30,28,.10);
  --mono:ui-monospace,"SF Mono","JetBrains Mono",Menlo,Consolas,monospace;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#0B0B16;--surface:#141527;--surface-2:#1C1E36;--panel:#171833;
  --ink:#F1F0F8;--ink-soft:#C9C8DC;--muted:#8D8CA8;--line:#282A45;--line-strong:#383A5C;
  --brass:#8CC63F;--brass-soft:#1E2A12;--teal:#4FA8E6;--teal-2:#3D8FCF;--teal-soft:#0E2537;
  --violet:#3BB4EC;--violet-2:#6FC9EE;--violet-soft:#0E2A3B;--blue:#6FB0DA;--blue-soft:#101F2B;
  --good:#8CC63F;--good-soft:#18240E;--warn:#D6A94E;--warn-soft:#2A2113;--crit:#E37B67;--crit-soft:#2E1712;
  --shadow:0 1px 2px rgba(0,0,0,.35),0 14px 34px rgba(76,29,149,.22);--shadow-lg:0 2px 10px rgba(0,0,0,.4),0 26px 64px rgba(76,29,149,.28);
}}
:root[data-theme="light"]{--bg:#EEF2F0;--surface:#FBFCFB;--surface-2:#F4F7F5;--panel:#FFFFFF;--ink:#0F1E1C;--ink-soft:#2C3C3A;--muted:#5C6A68;--line:#DBE1DC;--line-strong:#C6CFC9;--brass:#5F9C1E;--brass-soft:#E9F3D8;--teal:#003D7C;--teal-2:#0063A6;--teal-soft:#DCE6F2;--violet:#0072B0;--violet-2:#009EE0;--violet-soft:#DDEFFA;--blue:#215E86;--blue-soft:#DBE9F2;--good:#5F9C1E;--good-soft:#E9F3D8;--warn:#9C7020;--warn-soft:#F5E9CE;--crit:#A83A2A;--crit-soft:#F6DED8;--shadow:0 1px 2px rgba(15,30,28,.05),0 10px 26px rgba(15,30,28,.07);--shadow-lg:0 2px 6px rgba(15,30,28,.06),0 20px 50px rgba(15,30,28,.10);}
:root[data-theme="dark"]{--bg:#0B0B16;--surface:#141527;--surface-2:#1C1E36;--panel:#171833;--ink:#F1F0F8;--ink-soft:#C9C8DC;--muted:#8D8CA8;--line:#282A45;--line-strong:#383A5C;--brass:#8CC63F;--brass-soft:#1E2A12;--teal:#4FA8E6;--teal-2:#3D8FCF;--teal-soft:#0E2537;--violet:#3BB4EC;--violet-2:#6FC9EE;--violet-soft:#0E2A3B;--blue:#6FB0DA;--blue-soft:#101F2B;--good:#8CC63F;--good-soft:#18240E;--warn:#D6A94E;--warn-soft:#2A2113;--crit:#E37B67;--crit-soft:#2E1712;--shadow:0 1px 2px rgba(0,0,0,.35),0 14px 34px rgba(76,29,149,.22);--shadow-lg:0 2px 10px rgba(0,0,0,.4),0 26px 64px rgba(76,29,149,.28);}
/* Zwischenstufen hell→dunkel, HAN-Akzente bleiben gleich */
:root[data-theme="papier"]{--bg:#DDE6EE;--surface:#EFF4F9;--surface-2:#E4ECF3;--panel:#F9FBFD;--ink:#132230;--ink-soft:#32414F;--muted:#5C6A78;--line:#CBD6E1;--line-strong:#B4C2CF;--brass:#5F9C1E;--brass-soft:#E1EFCF;--teal:#003D7C;--teal-2:#0063A6;--teal-soft:#D6E3F1;--violet:#0072B0;--violet-2:#009EE0;--violet-soft:#D7EBF8;--blue:#215E86;--blue-soft:#DBE9F2;--good:#5F9C1E;--good-soft:#E1EFCF;--warn:#9C7020;--warn-soft:#F1E4C6;--crit:#A83A2A;--crit-soft:#F2D7CF;--shadow:0 1px 2px rgba(19,34,48,.06),0 10px 26px rgba(19,34,48,.09);--shadow-lg:0 2px 6px rgba(19,34,48,.08),0 20px 50px rgba(19,34,48,.13);}
:root[data-theme="schiefer"]{--bg:#28323F;--surface:#313D4C;--surface-2:#394656;--panel:#354150;--ink:#EDF1F5;--ink-soft:#C2CCD6;--muted:#8A97A4;--line:#41505F;--line-strong:#4E5E6E;--brass:#8CC63F;--brass-soft:#26331A;--teal:#4FA8E6;--teal-2:#3D8FCF;--teal-soft:#1C3348;--violet:#3BB4EC;--violet-2:#6FC9EE;--violet-soft:#173142;--blue:#6FB0DA;--blue-soft:#1A2C3A;--good:#8CC63F;--good-soft:#243318;--warn:#D6A94E;--warn-soft:#332916;--crit:#E37B67;--crit-soft:#3A2019;--shadow:0 1px 2px rgba(0,0,0,.28),0 14px 34px rgba(0,0,0,.3);--shadow-lg:0 2px 10px rgba(0,0,0,.35),0 26px 64px rgba(0,0,0,.4);}
:root[data-theme="nachtblau"]{--bg:#0D1B2B;--surface:#132638;--surface-2:#1A3145;--panel:#162A3E;--ink:#EAF1F8;--ink-soft:#BACAD9;--muted:#7E90A2;--line:#243D54;--line-strong:#31485F;--brass:#8CC63F;--brass-soft:#1B2A12;--teal:#4FA8E6;--teal-2:#3D8FCF;--teal-soft:#123048;--violet:#3BB4EC;--violet-2:#6FC9EE;--violet-soft:#0E2A3F;--blue:#6FB0DA;--blue-soft:#0F2434;--good:#8CC63F;--good-soft:#18240E;--warn:#D6A94E;--warn-soft:#2A2113;--crit:#E37B67;--crit-soft:#2E1712;--shadow:0 1px 2px rgba(0,0,0,.4),0 16px 38px rgba(0,0,0,.45);--shadow-lg:0 2px 10px rgba(0,0,0,.5),0 28px 64px rgba(0,0,0,.55);}
:root[data-theme="light"],:root[data-theme="papier"]{color-scheme:light;}
:root[data-theme="schiefer"],:root[data-theme="nachtblau"],:root[data-theme="dark"]{color-scheme:dark;}

*{box-sizing:border-box;}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased;}
h1,h2,h3,h4{margin:0;letter-spacing:-.01em;}
.mono{font-family:var(--mono);} .muted{color:var(--muted);}
.mt8{margin-top:8px;}.mt16{margin-top:16px;}.mt24{margin-top:24px;}
.row-split{display:flex;gap:14px;flex-wrap:wrap;}
.hidden{display:none!important;}
a{color:var(--violet);}

/* ---------- Login ---------- */
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(1200px 600px at 50% -10%,var(--teal-soft),var(--bg));}
.login-card{width:100%;max-width:400px;background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-lg);padding:32px 30px;}
.login-card .logo{width:52px;height:52px;border-radius:14px;background:linear-gradient(145deg,var(--violet-2),var(--violet));display:grid;place-items:center;color:#fff;font-weight:800;font-size:26px;margin-bottom:18px;}
.login-card .ey{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass);}
.login-card h1{font-size:24px;font-weight:800;margin:2px 0 4px;}
.login-card .sub{font-size:13px;color:var(--muted);margin-bottom:22px;}
.login-card label{display:block;font-size:12px;font-weight:600;color:var(--ink-soft);margin:14px 0 5px;}
.login-card input{width:100%;padding:11px 13px;border:1px solid var(--line-strong);border-radius:10px;background:var(--panel);color:var(--ink);font-size:15px;}
.login-card input:focus{outline:2px solid var(--violet);outline-offset:1px;border-color:var(--violet);}
.login-card .btn{width:100%;justify-content:center;margin-top:20px;padding:12px;}
.login-err{color:var(--crit);font-size:13px;margin-top:12px;min-height:18px;}
.login-hint{font-family:var(--mono);font-size:11px;color:var(--muted);text-align:center;margin-top:18px;border-top:1px solid var(--line);padding-top:14px;}

/* ---------- App shell ---------- */
.app{display:grid;grid-template-columns:252px minmax(0,1fr);min-height:100vh;}
.side{background:var(--surface);border-right:1px solid var(--line);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;}
.brand{padding:20px 20px 16px;border-bottom:1px solid var(--line);display:flex;gap:12px;align-items:center;}
.brand .logo{width:40px;height:40px;border-radius:11px;background:linear-gradient(145deg,var(--violet-2),var(--violet));display:grid;place-items:center;color:#fff;font-weight:800;font-size:20px;flex:none;}
.brand .ey{font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass);}
.brand h1{font-size:18px;font-weight:800;line-height:1.1;}
.brand .sub{font-size:10.5px;color:var(--muted);}
nav{padding:10px 12px;display:flex;flex-direction:column;gap:1px;flex:1;overflow-y:auto;}
.nav-lab{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:12px 12px 5px;}
.nav-item{display:flex;align-items:center;gap:11px;padding:8px 12px;border-radius:9px;cursor:pointer;color:var(--ink-soft);font-size:13.5px;font-weight:500;border:1px solid transparent;user-select:none;}
.nav-item:hover{background:var(--surface-2);}
.nav-item.active{background:var(--violet);color:#fff;border-color:transparent;font-weight:700;box-shadow:0 3px 10px color-mix(in srgb,var(--violet) 30%,transparent);}
.nav-item.active .ic{opacity:1;}
.nav-item.active .badge{background:#fff;color:var(--violet);}
.nav-item .ic{width:16px;text-align:center;flex:none;opacity:.85;}
.nav-item .badge{margin-left:auto;font-family:var(--mono);font-size:10px;background:var(--crit-soft);color:var(--crit);padding:1px 7px;border-radius:999px;}
.side-foot{padding:12px 16px;border-top:1px solid var(--line);}
.user-chip{display:flex;align-items:center;gap:10px;}
.user-chip .ua{width:30px;height:30px;border-radius:50%;background:var(--teal);color:#fff;display:grid;place-items:center;font-weight:700;font-size:13px;flex:none;}
.user-chip .un{font-size:12.5px;font-weight:600;line-height:1.2;}
.user-chip .ur{font-size:10.5px;color:var(--muted);}
.logout{margin-left:auto;background:none;border:0;color:var(--muted);cursor:pointer;font-size:11px;font-family:var(--mono);text-decoration:underline;}

/* main = Vollflächen-Kachel auf ALLEN Seiten: Kopfband (Topbar) oben + scrollbarer Inhalt */
main{padding:0;max-width:none;height:100vh;display:flex;flex-direction:column;overflow:hidden;}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0;padding:13px clamp(16px,2.4vw,26px);border-bottom:1px solid var(--line);background:var(--surface-2);position:sticky;top:0;z-index:10;}
#view{flex:1;min-height:0;overflow-y:auto;padding:clamp(15px,2.3vw,24px);}
.topbar-ctl{display:flex;align-items:center;gap:10px;}
.topbar .crumb{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:3px;}
.topbar h2{font-size:clamp(19px,2.6vw,25px);font-weight:750;}
.clock{font-family:var(--mono);font-size:12.5px;color:var(--muted);}
.theme-picker{display:inline-flex;align-items:center;gap:6px;background:var(--surface-2);border:1px solid var(--line-strong);border-radius:999px;padding:5px 9px;}
.tsw{width:17px;height:17px;border-radius:50%;padding:0;cursor:pointer;background:var(--sw);border:1px solid rgba(0,0,0,.18);box-shadow:inset 0 1px 2px rgba(255,255,255,.25);transition:transform .14s ease,box-shadow .14s ease;position:relative;}
.tsw:hover{transform:scale(1.18);}
.tsw.on{box-shadow:0 0 0 2px var(--surface-2),0 0 0 4px var(--violet);transform:scale(1.12);}

.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);}
.pad{padding:clamp(15px,2.2vw,20px);}
.card-h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line);}
.card-h h3{font-size:14.5px;}
.card-h .mtag{font-family:var(--mono);font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);}
.lead-title{font-size:11px;color:var(--muted);font-family:var(--mono);letter-spacing:.05em;text-transform:uppercase;}
.grid{display:grid;gap:14px;}

.maestro{background:linear-gradient(150deg,var(--teal),#0e4640 65%);color:#fff;border-radius:16px;padding:20px 22px;box-shadow:var(--shadow-lg);position:relative;overflow:hidden;}
.maestro .top{display:flex;gap:16px;align-items:center;flex-wrap:wrap;}
.avatar{width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.14);border:1.5px solid rgba(255,255,255,.5);color:#fff;display:grid;place-items:center;font-weight:700;font-size:22px;position:relative;flex:none;}
.avatar .ring{position:absolute;inset:-6px;border-radius:50%;border:2px solid rgba(255,255,255,.5);}
@media (prefers-reduced-motion:no-preference){.avatar.live .ring{animation:pulse 2.4s ease-out infinite;}@keyframes pulse{0%{transform:scale(1);opacity:.6;}100%{transform:scale(1.4);opacity:0;}}}
.maestro .who{font-weight:750;font-size:18px;}
.maestro .role{font-size:12px;opacity:.85;}
.maestro .stat{margin-left:auto;text-align:right;}
.maestro .stat .n{font-size:13px;opacity:.8;font-family:var(--mono);}
.runctl{display:flex;align-items:center;gap:10px;margin-top:16px;flex-wrap:wrap;}
.btn{border:0;border-radius:10px;padding:10px 16px;font-size:13.5px;font-weight:650;cursor:pointer;font-family:var(--sans);display:inline-flex;align-items:center;gap:7px;}
.btn.primary{background:var(--violet);color:#fff;} .btn.primary:hover{background:var(--violet-2);}
.btn.ghost{background:var(--surface-2);color:var(--ink);border:1px solid var(--line-strong);}
.btn.brass{background:var(--brass);color:#fff;} .btn.light{background:rgba(255,255,255,.16);color:#fff;border:1px solid rgba(255,255,255,.3);}
.btn.light:hover{background:rgba(255,255,255,.26);}
.btn:disabled{opacity:.5;cursor:not-allowed;} .btn.sm{padding:7px 12px;font-size:12.5px;border-radius:8px;}
.btn.danger{background:none;color:var(--crit);border:1px solid transparent;padding:5px 8px;}
.live-dot{width:8px;height:8px;border-radius:50%;background:#7fe0c4;}
@media (prefers-reduced-motion:no-preference){.live-dot.on{animation:beat 1.4s infinite;}@keyframes beat{0%{box-shadow:0 0 0 0 rgba(127,224,196,.6);}70%{box-shadow:0 0 0 8px rgba(127,224,196,0);}100%{box-shadow:0 0 0 0 rgba(127,224,196,0);}}}

.players{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-top:18px;}
.player{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);border-radius:11px;padding:11px 13px;cursor:pointer;transition:background .15s;}
.player:hover{background:rgba(255,255,255,.16);}
.player .pn{font-size:13px;font-weight:650;}
.player .pd{font-size:10.5px;opacity:.78;margin-top:2px;}
.eq{display:flex;align-items:flex-end;gap:2px;height:14px;margin-top:8px;}
.eq span{width:3px;background:rgba(255,255,255,.6);border-radius:2px;height:30%;}
@media (prefers-reduced-motion:no-preference){.playing .eq span{animation:eq .9s ease-in-out infinite;}
  .playing .eq span:nth-child(2){animation-delay:.15s;}.playing .eq span:nth-child(3){animation-delay:.3s;}.playing .eq span:nth-child(4){animation-delay:.45s;}.playing .eq span:nth-child(5){animation-delay:.6s;}
  @keyframes eq{0%,100%{height:25%;}50%{height:100%;}}}
.idle .eq span{height:22%;opacity:.5;}

.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin-top:16px;}
.tile{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 17px;cursor:pointer;box-shadow:var(--shadow);transition:transform .12s,box-shadow .12s,border-color .12s;position:relative;overflow:hidden;}
.tile:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:var(--line-strong);}
.tile .th{display:flex;align-items:center;justify-content:space-between;}
.tile .tl{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:7px;}
.tile .tl .dot{width:8px;height:8px;border-radius:2px;}
.tile .go{color:var(--muted);font-size:15px;opacity:.5;}
.tile .tv{font-size:29px;font-weight:750;font-variant-numeric:tabular-nums;letter-spacing:-.02em;margin-top:9px;line-height:1.05;}
.tile .ts{font-size:12px;color:var(--muted);margin-top:2px;}
.tile .spark{margin-top:8px;height:30px;}
.tile.wide{grid-column:span 2;}
@media (max-width:640px){.tile.wide{grid-column:span 1;}}
.delta{font-family:var(--mono);font-size:11.5px;font-weight:600;}
.delta.up{color:var(--good);} .delta.down{color:var(--crit);}

.target{margin-top:10px;}
.bar{height:12px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line);overflow:hidden;}
.bar>i{display:block;height:100%;background:linear-gradient(90deg,var(--violet),var(--violet-2));border-radius:999px;transition:width .6s cubic-bezier(.2,.7,.2,1);}
.tgt-row{display:flex;justify-content:space-between;font-family:var(--mono);font-size:12px;margin-top:6px;color:var(--muted);gap:8px;flex-wrap:wrap;}
.tgt-row b{color:var(--ink);}

.feed{display:flex;flex-direction:column;max-height:520px;overflow-y:auto;}
.fitem{display:grid;grid-template-columns:auto 1fr;gap:11px;padding:11px 0;border-top:1px solid var(--line);animation:fadein .4s ease;}
@keyframes fadein{from{opacity:0;transform:translateY(-4px);}to{opacity:1;}}
@media (prefers-reduced-motion:reduce){.fitem{animation:none;}}
.fitem:first-child{border-top:0;}
.fitem .tm{font-family:var(--mono);font-size:11px;color:var(--muted);white-space:nowrap;padding-top:1px;}
.fitem .ft{font-size:13px;color:var(--ink-soft);}
.fitem .ft b{color:var(--ink);}
.ftag{font-family:var(--mono);font-size:9.5px;padding:1px 7px;border-radius:999px;margin-right:6px;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;}
.ftag.mk{background:var(--brass-soft);color:var(--brass);} .ftag.seo{background:var(--blue-soft);color:var(--blue);}
.ftag.sales{background:var(--good-soft);color:var(--good);} .ftag.hr{background:var(--violet-soft);color:var(--violet);}
.ftag.rec{background:var(--warn-soft);color:var(--warn);} .ftag.obj{background:var(--teal-soft);color:var(--teal);}
.ftag.call{background:var(--brass-soft);color:var(--brass);} .ftag.sys{background:var(--surface-2);color:var(--muted);}

.tbl-wrap{overflow-x:auto;}
table{border-collapse:collapse;width:100%;min-width:560px;font-size:13px;}
th,td{text-align:left;padding:11px 15px;border-bottom:1px solid var(--line);vertical-align:middle;}
thead th{font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);background:var(--surface-2);font-weight:600;}
tbody tr:last-child td{border-bottom:0;} tbody tr:hover{background:var(--surface-2);}
td .m,.m{font-family:var(--mono);font-variant-numeric:tabular-nums;}

.pill{display:inline-flex;align-items:center;gap:5px;font-family:var(--mono);font-size:10.5px;padding:3px 9px;border-radius:999px;font-weight:600;white-space:nowrap;}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;}
.pill.good{background:var(--good-soft);color:var(--good);}.pill.crit{background:var(--crit-soft);color:var(--crit);}
.pill.warn{background:var(--warn-soft);color:var(--warn);}.pill.muted{background:var(--surface-2);color:var(--muted);}
.pill.brass{background:var(--brass-soft);color:var(--brass);}.pill.teal{background:var(--teal-soft);color:var(--teal);}
.pill.blue{background:var(--blue-soft);color:var(--blue);}.pill.violet{background:var(--violet-soft);color:var(--violet);}
.score{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:8px;font-family:var(--mono);font-weight:700;font-size:12px;}
.score.A{background:var(--good-soft);color:var(--good);}.score.B{background:var(--warn-soft);color:var(--warn);}.score.C{background:var(--surface-2);color:var(--muted);}

.pipe{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}
@media (max-width:820px){.pipe{grid-template-columns:1fr 1fr;}}
.col{background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:10px;min-height:110px;}
.col .ch{font-family:var(--mono);font-size:10.5px;letter-spacing:.04em;color:var(--muted);text-transform:uppercase;padding:4px 6px 9px;display:flex;justify-content:space-between;}
.lead{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:9px;padding:9px 11px 9px 34px;margin-bottom:7px;}
.lead .ln{font-weight:650;font-size:13px;display:flex;justify-content:space-between;gap:8px;align-items:center;}
.lead-cb{position:absolute;top:10px;left:10px;width:17px;height:17px;cursor:pointer;z-index:3;accent-color:var(--teal);}
.lead.sel{border-color:var(--teal);box-shadow:0 0 0 2px var(--teal) inset;}
.lead.lead-drag{opacity:.45;}
.lead[draggable="true"]{cursor:grab;}
.lead[draggable="true"]:active{cursor:grabbing;}
.lead-col.lead-drop{outline:2px dashed var(--teal);outline-offset:-2px;background:color-mix(in srgb, var(--teal) 10%, var(--surface-2));}
.ch-cb{display:flex;align-items:center;gap:6px;cursor:pointer;}
.ch-cb input{cursor:pointer;accent-color:var(--teal);width:14px;height:14px;}
.lead-bulk{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);flex-wrap:wrap;}
.lead-bulk button[disabled]{opacity:.45;cursor:default;}
/* SEO-Prüfstand */
.seo-gauge{width:118px;height:118px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.seo-gauge-in{width:88px;height:88px;border-radius:50%;background:var(--surface);display:flex;flex-direction:column;align-items:center;justify-content:center;}
.seo-gauge-num{font-size:34px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums;}
.seo-gauge-lab{font-size:11px;color:var(--muted);margin-top:2px;}
.seo-check{padding:9px 0;border-bottom:1px solid var(--line);}
.seo-check:last-child{border-bottom:none;}
.seo-check-h{display:flex;align-items:center;gap:9px;}
.seo-dot{width:20px;height:20px;border-radius:50%;color:#fff;font-size:12px;display:flex;align-items:center;justify-content:center;flex:0 0 auto;font-weight:700;}
.seo-check-t{font-weight:600;font-size:13.5px;}
.seo-check-v{margin-left:auto;font-size:12px;color:var(--muted);font-family:var(--mono);text-align:right;}
.seo-check-tip{font-size:12.5px;color:var(--ink-soft);margin:5px 0 0 29px;line-height:1.5;}
.seo-mass{display:flex;gap:11px;padding:9px 0;border-bottom:1px solid var(--line);}
.seo-mass:last-child{border-bottom:none;}
.seo-mnum{width:22px;height:22px;border-radius:50%;color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.seo-mt{font-weight:650;font-size:13.5px;}
.seo-mtip{font-size:12.5px;color:var(--ink-soft);margin-top:2px;line-height:1.5;}
.seo-copy{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:10px;background:var(--surface-2);}
.seo-copy-h{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12px;color:var(--muted);font-weight:600;margin-bottom:6px;}
.seo-copy-v{font-size:13px;color:var(--ink);white-space:pre-wrap;word-break:break-word;margin:0;font-family:inherit;}
pre.seo-copy-v{font-family:var(--mono);font-size:12px;max-height:260px;overflow:auto;}
.seo-kws{display:flex;flex-wrap:wrap;gap:7px;}
.seo-kw{background:var(--surface-2);border:1px solid var(--line);border-radius:999px;padding:5px 12px;font-size:12.5px;}
.seo-plan{white-space:pre-wrap;font-size:13.5px;line-height:1.6;color:var(--ink);}
/* Reinigungsart-Kachel in der Kundenliste (klickbar) */
.art-badge{font-size:11.5px;font-weight:600;border-radius:999px;padding:4px 11px;border:1px solid var(--line);cursor:pointer;white-space:nowrap;transition:filter .1s;}
.art-badge:hover{filter:brightness(1.06);}
.art-badge.art-u{background:color-mix(in srgb, var(--teal) 16%, var(--surface));border-color:var(--teal);color:var(--teal);}
.art-badge.art-s{background:color-mix(in srgb, var(--brass) 16%, var(--surface));border-color:var(--brass);color:var(--brass);}
.art-badge.art-o{background:var(--surface-2);border-color:var(--line);color:var(--muted);border-style:dashed;}
.art-badge.st-a{background:color-mix(in srgb, var(--good) 15%, var(--surface));border-color:var(--good);color:var(--good);}
.art-badge.st-p{background:var(--surface-2);border-color:var(--line);color:var(--muted);}
.art-badge.st-e{background:color-mix(in srgb, var(--crit) 13%, var(--surface));border-color:var(--crit);color:var(--crit);}
.art-badge.st-u{background:color-mix(in srgb, var(--blue) 14%, var(--surface));border-color:var(--blue);color:var(--blue);}
.art-badge.st-k{background:color-mix(in srgb, var(--brass) 16%, var(--surface));border-color:var(--brass);color:var(--brass);}
/* Leistungsverzeichnis (bearbeitbar) */
.lv-wrap{display:flex;flex-direction:column;gap:14px;}
.lv-group{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--surface);}
.lv-group-h{background:var(--surface-2);padding:10px 14px;font-weight:700;font-size:14px;border-bottom:1px solid var(--line);}
.lv-ic{font-size:16px;}
.lv-item{display:grid;grid-template-columns:50px 1fr auto 28px;align-items:center;gap:12px;padding:9px 14px;border-bottom:1px solid var(--line);}
.lv-item:last-child{border-bottom:none;}
.lv-pos{font-family:var(--mono);font-size:12px;color:var(--muted);}
.lv-leist{font-weight:600;font-size:13.5px;}
.lv-meta{font-size:12px;color:var(--muted);font-family:var(--mono);white-space:nowrap;}
.lv-del{border:none;background:transparent;color:var(--crit);cursor:pointer;font-size:14px;opacity:.6;}
.lv-del:hover{opacity:1;}
.lv-add-grid{display:grid;grid-template-columns:180px 1fr 160px 160px auto;gap:8px;align-items:center;}
/* Qualitätsprüfung */
.qp-legende{font-size:12px;color:var(--muted);padding:8px 0 2px;}
.qp-obj-titel{font-size:14px;margin-bottom:12px;}
.qp-group{border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:14px;background:var(--surface);}
.qp-group-h{background:var(--surface-2);padding:9px 14px;font-weight:700;font-size:13.5px;border-bottom:1px solid var(--line);}
.qp-point{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:9px 14px;border-bottom:1px solid var(--line);flex-wrap:wrap;}
.qp-point:last-child{border-bottom:none;}
.qp-pt-name{font-size:13.5px;font-weight:600;flex:1;min-width:180px;}
.qp-controls{display:flex;gap:14px;align-items:center;flex-wrap:wrap;}
.qp-notes,.qp-prios{display:flex;gap:4px;}
.qp-note{width:30px;height:30px;border:1px solid var(--line-strong);background:var(--surface-2);color:var(--ink-soft);border-radius:7px;cursor:pointer;font-weight:700;font-size:13px;}
.qp-note:hover{border-color:var(--teal);}
.qp-note.on{color:#fff;border-color:transparent;}
.qp-note.on.n1{background:var(--good);}.qp-note.on.n2{background:var(--teal);}.qp-note.on.n3{background:var(--brass);}.qp-note.on.n4{background:#e0803a;}.qp-note.on.n5{background:var(--crit);}
.qp-prio{padding:5px 11px;border:1px solid var(--line-strong);background:var(--surface-2);color:var(--ink-soft);border-radius:999px;cursor:pointer;font-size:12px;}
.qp-prio.on.p-niedrig{background:var(--good);color:#fff;border-color:transparent;}
.qp-prio.on.p-mittel{background:var(--brass);color:#fff;border-color:transparent;}
.qp-prio.on.p-hoch{background:var(--crit);color:#fff;border-color:transparent;}
.qp-hist{border:1px solid var(--line);border-radius:9px;padding:8px 12px;margin-bottom:8px;}
.qp-hist summary{cursor:pointer;font-size:13px;}
/* Objekt-Karte (Hamburg 3D) */
.karte-page{padding:18px 22px 22px;display:flex;flex-direction:column;height:100%;box-sizing:border-box;}
.karte-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px;}
.hh-map{flex:1;min-height:440px;border-radius:14px;overflow:hidden;border:1px solid var(--line);box-shadow:0 4px 18px rgba(0,0,0,.12);}
.hh-map canvas{outline:none;}
.hh-pin{width:16px;height:16px;background:var(--teal);border:2.5px solid #fff;border-radius:50%;box-shadow:0 1px 5px rgba(0,0,0,.45);cursor:pointer;}
.maplibregl-popup-content{border-radius:10px;padding:9px 12px;font-family:inherit;}
/* Einstellungen-Modul: Shell mit Links-Kategorien + Oben-Unterbereichen */
.settings-shell{display:flex;height:100%;box-sizing:border-box;gap:0;}
.settings-left{width:236px;flex:0 0 236px;border-right:1px solid var(--line);background:var(--surface-2);padding:16px 12px;overflow-y:auto;}
.settings-left-h{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:2px 8px 12px;}
.setcat{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:none;background:transparent;color:var(--ink-soft);font-size:13.5px;font-weight:600;padding:10px 12px;border-radius:10px;cursor:pointer;margin-bottom:2px;}
.setcat:hover{background:var(--surface);}
.setcat.on{background:var(--teal);color:#fff;}
.setcat-ic{font-size:16px;width:22px;text-align:center;}
.settings-main{flex:1;display:flex;flex-direction:column;min-width:0;}
.settings-top{display:flex;gap:6px;flex-wrap:wrap;padding:14px 22px;border-bottom:1px solid var(--line);background:var(--surface);}
.setsub{border:1px solid transparent;background:transparent;color:var(--ink-soft);font-size:13px;font-weight:600;padding:7px 14px;border-radius:999px;cursor:pointer;}
.setsub:hover{background:var(--surface-2);}
.setsub.on{background:var(--surface-2);border-color:var(--teal);color:var(--teal);}
.settings-body{flex:1;overflow-y:auto;padding:20px 22px;}
.aut-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:11px 0;border-bottom:1px solid var(--line);}
.aut-row:last-child{border-bottom:none;}
.aut-name .si{font-weight:650;font-size:13.5px;}
.prm-table th.prm-col,.prm-table td.prm-col{text-align:center;width:70px;}
.prm-table th.prm-col{font-size:11px;writing-mode:horizontal-tb;}
.prm-table td.prm-col input{width:17px;height:17px;cursor:pointer;accent-color:var(--teal);}
.perm-tree{border:1px solid var(--line);border-radius:12px;padding:8px 10px;background:var(--surface-2);max-height:none;}
.perm-gh{font-family:var(--mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);padding:10px 4px 4px;}
.perm-leaf{padding:3px 0;}
.perm-view{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;cursor:pointer;}
.perm-view input,.perm-fn input{width:16px;height:16px;cursor:pointer;accent-color:var(--teal);}
.perm-view .ic{opacity:.7;}
.perm-fns{display:flex;flex-wrap:wrap;gap:6px 16px;margin:4px 0 6px 40px;}
.perm-fn{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--ink-soft);cursor:pointer;}
.lead .lv{font-family:var(--mono);font-size:11.5px;color:var(--teal);margin-top:2px;}
.lead .lx{font-size:11px;color:var(--muted);margin-top:3px;}
.lead .movebtns{display:flex;gap:4px;margin-top:7px;}
.lead .movebtns button{font-family:var(--mono);font-size:11px;border:1px solid var(--line-strong);background:var(--surface-2);color:var(--ink-soft);border-radius:6px;padding:2px 8px;cursor:pointer;}

.carla-tip{background:var(--teal-soft);border:1px solid color-mix(in srgb,var(--teal) 22%,transparent);border-radius:11px;padding:12px 14px;font-size:13px;color:var(--ink-soft);display:flex;gap:10px;}
.carla-tip .b{width:26px;height:26px;border-radius:50%;background:var(--teal);color:#fff;display:grid;place-items:center;font-weight:700;font-size:13px;flex:none;}
.carla-tip b{color:var(--ink);}

.scene{display:flex;flex-direction:column;gap:8px;margin-top:12px;}
.step{display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start;opacity:0;transform:translateY(6px);animation:stepIn .45s ease forwards;}
@keyframes stepIn{to{opacity:1;transform:none;}}
@media (prefers-reduced-motion:reduce){.step{animation:none;opacity:1;transform:none;}}
.step .idx{width:22px;height:22px;border-radius:50%;background:var(--teal-soft);color:var(--teal);display:grid;place-items:center;font-family:var(--mono);font-size:11px;font-weight:700;flex:none;margin-top:1px;}
.step.act .idx{background:var(--brass-soft);color:var(--brass);}.step.done .idx{background:var(--good-soft);color:var(--good);}
.step .txt{font-size:13px;color:var(--ink-soft);}.step .txt b{color:var(--ink);}
.thinking{font-family:var(--mono);font-size:12px;color:var(--muted);display:flex;gap:6px;align-items:center;padding:2px 0;}
.thinking .d{width:5px;height:5px;border-radius:50%;background:var(--muted);animation:blink 1.2s infinite;}
.thinking .d:nth-child(2){animation-delay:.2s;}.thinking .d:nth-child(3){animation-delay:.4s;}
@keyframes blink{0%,100%{opacity:.25;}50%{opacity:1;}}
.call{background:var(--surface-2);border:1px solid var(--line);border-radius:11px;padding:12px;margin:2px 0;display:flex;flex-direction:column;gap:7px;}
.call .ch{font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--brass);}
.bubble{font-size:12.5px;padding:8px 11px;border-radius:10px;max-width:84%;}
.bubble.carla{background:var(--teal);color:#fff;align-self:flex-start;border-bottom-left-radius:3px;}
.bubble.cust{background:var(--panel);border:1px solid var(--line-strong);align-self:flex-end;border-bottom-right-radius:3px;}
.bubble .n{display:block;font-size:9.5px;opacity:.7;margin-bottom:2px;font-family:var(--mono);}
.approve{background:var(--brass-soft);border:1px solid color-mix(in srgb,var(--brass) 40%,transparent);border-radius:11px;padding:12px 14px;margin-top:6px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.approve .t{font-size:12.5px;flex:1;min-width:180px;}.approve .t b{color:var(--brass);}

.calc{display:grid;grid-template-columns:1fr 320px;gap:18px;align-items:start;}
@media (max-width:820px){.calc{grid-template-columns:1fr;}}
.field{margin-bottom:14px;}
.field label{display:block;font-size:12px;font-weight:600;color:var(--ink-soft);margin-bottom:5px;}
.field label .h{font-weight:400;color:var(--muted);font-family:var(--mono);font-size:11px;}
input[type=number],select,input[type=text]{width:100%;padding:9px 12px;border:1px solid var(--line-strong);border-radius:9px;background:var(--panel);color:var(--ink);font-size:14px;font-family:var(--sans);}
input:focus,select:focus{outline:2px solid var(--violet);outline-offset:1px;border-color:var(--violet);}
input[type=range]{width:100%;accent-color:var(--violet);padding:0;}
.rng-row{display:flex;justify-content:space-between;font-family:var(--mono);font-size:12px;color:var(--muted);margin-bottom:4px;}
.result{background:linear-gradient(160deg,var(--violet),#3B2170);color:#fff;border-radius:14px;padding:20px;position:sticky;top:16px;}
.result .rl{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;opacity:.8;}
.result .big{font-size:34px;font-weight:750;font-variant-numeric:tabular-nums;margin:3px 0 1px;letter-spacing:-.02em;}
.result .rsub{font-size:12px;opacity:.85;}.result hr{border:0;border-top:1px solid rgba(255,255,255,.18);margin:14px 0;}
.rrow{display:flex;justify-content:space-between;font-size:12.5px;margin:6px 0;}

.swrow{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line);gap:12px;}
.swrow:last-child{border-bottom:0;}
.swrow .si{font-size:13.5px;font-weight:600;}.swrow .sd{font-size:11.5px;color:var(--muted);}
.switch{position:relative;width:44px;height:25px;flex:none;}
.switch input{opacity:0;width:0;height:0;}
.slider{position:absolute;inset:0;background:var(--line-strong);border-radius:999px;cursor:pointer;transition:.2s;}
.slider::before{content:"";position:absolute;width:19px;height:19px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s;}
.switch input:checked+.slider{background:var(--violet);}
.switch input:checked+.slider::before{transform:translateX(19px);}
.seg{display:flex;gap:3px;background:var(--surface-2);padding:3px;border-radius:9px;border:1px solid var(--line);}
.seg button{flex:1;border:0;background:transparent;color:var(--muted);font-family:var(--mono);font-size:11.5px;font-weight:600;padding:6px 3px;border-radius:7px;cursor:pointer;}
.seg button.on{background:var(--brass);color:#fff;}

.agenda{display:flex;flex-direction:column;}
.ag{display:grid;grid-template-columns:64px auto 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--line);align-items:center;}
.ag:first-child{border-top:0;}
.ag .agt{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--teal);}
.ag .agn{font-weight:600;font-size:13.5px;}.ag .agx{font-size:11.5px;color:var(--muted);}

.chgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;}
.ch-card{border:1px solid var(--line);border-radius:12px;padding:14px;background:var(--surface);}
.ch-card .cn{font-weight:650;font-size:14px;}.ch-card .cf{font-size:24px;font-weight:750;font-variant-numeric:tabular-nums;margin-top:6px;}
.post{border:1px solid var(--line);border-radius:11px;padding:13px;background:var(--surface);margin-bottom:10px;}
.post .ph{display:flex;justify-content:space-between;align-items:center;margin-bottom:7px;}
.post .pc{font-size:13px;color:var(--ink-soft);white-space:pre-wrap;}
.post .tags{font-family:var(--mono);font-size:11px;color:var(--teal);margin-top:7px;}

/* inline forms */
.iform{background:var(--surface-2);border:1px dashed var(--line-strong);border-radius:12px;padding:14px;margin-top:12px;}
.iform .fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;}
.iform .fa{display:flex;gap:8px;margin-top:12px;}
.mini-select{padding:4px 8px;border:1px solid var(--line-strong);border-radius:7px;background:var(--panel);color:var(--ink);font-size:12px;font-family:var(--sans);}
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:11px 18px;border-radius:10px;font-size:13px;box-shadow:var(--shadow-lg);z-index:50;opacity:0;transition:opacity .2s,transform .2s;}
.toast.show{opacity:1;transform:translateX(-50%) translateY(-4px);}

/* ---------- Rechte Spalte mit KI-Sprech-Button (Clara/Noa) — eigener Freiraum, verdeckt nichts ---------- */
.clock{white-space:nowrap;font-size:12px;}
/* Schwebender KI-Kreis (Clara/Noa) — kein Foto, pulsiert beim Sprechen */
.aifab{--ai:#25b3a3;position:fixed;right:22px;bottom:22px;z-index:60;display:flex;flex-direction:row-reverse;align-items:center;gap:12px;cursor:pointer;user-select:none;}
.aifab.carla{--ai:#25b3a3;} .aifab.noa{--ai:#8B5CF6;}
.aifab-orb{position:relative;width:62px;height:62px;flex:none;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 34% 30%, color-mix(in srgb,var(--ai) 40%,#fff) 0%, var(--ai) 46%, color-mix(in srgb,var(--ai) 62%,#000) 100%);
  box-shadow:0 10px 28px color-mix(in srgb,var(--ai) 45%,transparent), inset 0 2px 10px rgba(255,255,255,.4), inset 0 -6px 14px color-mix(in srgb,var(--ai) 70%,#000);
  transition:transform .16s ease;}
.aifab:hover .aifab-orb{transform:scale(1.06);}
.aifab:active .aifab-orb{transform:scale(.97);}
.aifab-core{width:16px;height:16px;border-radius:50%;background:radial-gradient(circle at 40% 35%, #fff, color-mix(in srgb,var(--ai) 30%,#fff));box-shadow:0 0 12px rgba(255,255,255,.9);transition:box-shadow .06s linear;}
.aifab-ring{position:absolute;inset:0;border-radius:50%;border:2px solid color-mix(in srgb,var(--ai) 65%,transparent);opacity:0;pointer-events:none;}
@media (prefers-reduced-motion:no-preference){
  /* Ruhe: sanfter, langsamer Puls-Ring */
  .aifab-ring{animation:aifabWave 3s ease-out infinite;}
  .aifab-ring.r2{animation-delay:1.5s;}
  @keyframes aifabWave{0%{transform:scale(1);opacity:.55;}100%{transform:scale(1.95);opacity:0;}}
  /* Zuhören: ruhiges Glimmen */
  .aifab.v-listen .aifab-core{animation:aifabGlow 1.3s ease-in-out infinite;}
  @keyframes aifabGlow{0%,100%{box-shadow:0 0 8px rgba(255,255,255,.7);}50%{box-shadow:0 0 20px rgba(255,255,255,1);}}
  /* Sprechen: der Kreis reagiert live auf die Lautstärke (--lvl, von voice.js/app.js gesetzt) — echter Equalizer-Effekt statt fester Animation */
  .aifab.speaking .aifab-ring{animation-duration:1.05s;}
  .aifab.speaking .aifab-orb{transform:scale(calc(1 + var(--lvl,0) * 0.4));transition:transform .05s linear;}
  .aifab.speaking .aifab-core{box-shadow:0 0 calc(10px + var(--lvl,0) * 22px) rgba(255,255,255,calc(.75 + var(--lvl,0) * .25));}
}
@media (max-width:560px){ .aifab{right:16px;bottom:16px;} }

/* Employee module header + recommendations */
.emp-head{border-left:3px solid var(--brass);}
.reco{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:10px 13px;margin-bottom:8px;}
.reco .rc{font-size:13px;color:var(--ink-soft);flex:1;min-width:200px;}
.reco .ra{display:flex;gap:7px;}

/* Marketing ad preview */
.ad-out{border:1px solid var(--line);border-radius:12px;padding:14px;background:var(--surface);}
.ad-visual{height:120px;border-radius:10px;background:linear-gradient(135deg,var(--teal-soft),var(--brass-soft));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;font-size:34px;color:var(--teal);}
.ad-visual span{font-size:12px;font-family:var(--mono);color:var(--muted);}
.ad-copy{font-size:14px;color:var(--ink);margin-top:10px;line-height:1.5;}

/* ---------- Feinschliff: Übergänge, Fokus, Reaktionen ---------- */
.btn{transition:background .15s ease,transform .07s ease,box-shadow .15s ease,opacity .15s ease;}
.btn:not(:disabled):active{transform:translateY(1px);}
.btn.primary:hover,.btn.brass:hover{box-shadow:0 4px 14px color-mix(in srgb,var(--violet) 22%,transparent);}
.nav-item{transition:background .13s ease,color .13s ease,border-color .13s ease;}
.nav-item:active{transform:translateY(.5px);}
.player{transition:background .15s ease,transform .1s ease;}
.player:active{transform:scale(.99);}
.logout:hover{color:var(--crit);}

/* Tastatur-Fokus klar sichtbar (Barrierefreiheit), aber nicht bei Maus-Klick */
:focus-visible{outline:2px solid var(--violet);outline-offset:2px;border-radius:4px;}
.btn:focus-visible,.nav-item:focus-visible,.tile:focus-visible,.tsw:focus-visible{outline:2px solid var(--violet);outline-offset:2px;}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--violet);outline-offset:1px;}

/* Sanfter Einblende-Übergang beim Seitenwechsel */
@media (prefers-reduced-motion:no-preference){
  .view-anim{animation:viewIn .28s cubic-bezier(.2,.7,.2,1);}
  @keyframes viewIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
}

/* ---------- Clara-Gesprächsfenster (Zwei-Wege-Chat) ---------- */
.cchat{position:fixed;right:22px;bottom:22px;width:370px;max-width:calc(100vw - 32px);height:540px;max-height:calc(100vh - 44px);z-index:70;display:flex;flex-direction:column;background:var(--surface);border:1px solid color-mix(in srgb,var(--teal) 32%,var(--line));border-radius:18px;box-shadow:var(--shadow-lg);overflow:hidden;}
.cchat.hidden{display:none;}
.cchat-head{display:flex;align-items:center;gap:11px;padding:12px 14px;border-bottom:1px solid var(--line);background:linear-gradient(120deg,color-mix(in srgb,var(--teal) 15%,var(--surface)),var(--surface));}
.cchat-face{width:42px;height:42px;border-radius:50%;object-fit:cover;object-position:center 22%;border:2px solid var(--teal);flex:none;}
.cchat-name{font-weight:750;font-size:15px;color:var(--teal);line-height:1.1;}
.cchat-sub{font-size:10.5px;color:var(--muted);font-family:var(--mono);}
.cchat-icon{background:none;border:0;color:var(--muted);cursor:pointer;font-size:14px;padding:4px;border-radius:7px;}
.cchat-icon:first-of-type{margin-left:auto;} .cchat-icon:hover{background:var(--surface-2);color:var(--ink);}
.cchat-body{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:9px;}
.cbub{max-width:86%;padding:9px 13px;border-radius:14px;font-size:13.5px;line-height:1.5;white-space:pre-wrap;word-break:break-word;animation:fadein .25s ease;}
.cbub.me{align-self:flex-end;background:var(--teal);color:#fff;border-bottom-right-radius:4px;}
.cbub.carla{align-self:flex-start;background:var(--surface-2);color:var(--ink);border:1px solid var(--line);border-bottom-left-radius:4px;}
.ctyping{color:var(--muted);}
.cchat-in{display:flex;align-items:center;gap:8px;padding:10px 12px;border-top:1px solid var(--line);background:var(--surface);}
.cchat-in input{flex:1;padding:9px 12px;border:1px solid var(--line-strong);border-radius:10px;background:var(--panel);color:var(--ink);font-size:14px;}
.cchat-mic{width:38px;height:38px;border-radius:50%;border:1px solid var(--line-strong);background:var(--surface-2);color:var(--ink-soft);cursor:pointer;font-size:16px;flex:none;}
.cchat-mic.listening{background:var(--crit);color:#fff;border-color:var(--crit);animation:micpulse 1.1s ease-in-out infinite;}
.cchat-send{flex:none;}
@media (max-width:760px){.cchat{right:8px;left:8px;bottom:8px;width:auto;height:min(72vh,540px);}}

@media (max-width:760px){
  .app{grid-template-columns:1fr;}
  .side{position:static;height:auto;} nav{flex-direction:row;overflow-x:auto;padding:8px;gap:5px;} .nav-lab{display:none;}
  .nav-item{white-space:nowrap;} .side-foot{display:none;}
  .cols2{grid-template-columns:1fr!important;}
}

/* ---- Freihändiges Sprach-Gespräch (voice.js) ---- */
.aifab.voicechat .aifab-orb{ box-shadow:0 0 0 3px color-mix(in srgb,var(--ai) 40%,transparent), 0 10px 28px color-mix(in srgb,var(--ai) 45%,transparent); }

/* ---- Zweistufige Navigation: obere waagerechte Unterbereiche ---- */
.subnav{ display:flex; gap:6px; flex-wrap:wrap; align-items:center; padding:2px 0 12px; margin:0 0 16px; border-bottom:1px solid var(--line); }
.subtab{ display:inline-flex; align-items:center; gap:6px; border:1px solid var(--line); background:var(--panel); color:var(--muted); border-radius:9px; padding:7px 13px; font-size:13px; font-weight:500; cursor:pointer; transition:background .12s,color .12s,border-color .12s; }
.subtab .ic{ opacity:.85; font-size:13px; }
.subtab:hover{ color:var(--ink); }
.subtab.active{ background:var(--teal); color:#fff; border-color:transparent; }
.subtab.active .ic{ opacity:1; }
.subtab .badge{ margin-left:2px; }
.nav-item.area{ font-weight:600; }

/* Verschachtelter Menübaum (links, aufklappbar) */
.nav-group{ display:flex; flex-direction:column; gap:1px; }
.nav-item.parent{ font-weight:600; }
.nav-item .chev{ margin-left:auto; font-size:10px; opacity:.6; flex:none; transition:transform .12s; }
.nav-item.parent:hover .chev{ opacity:.9; }
.nav-children{ display:flex; flex-direction:column; gap:1px; }
.nav-children .nav-item{ font-size:13px; }
.nav-children .nav-item.leaf::before{ content:""; position:absolute; }
.nav-item.leaf{ position:relative; }

/* Einsatzplan (Dienstplan) */
.ep-nav{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:14px; }
.ep-range{ font-weight:650; font-size:14px; min-width:150px; text-align:center; color:var(--ink); }
.ep-such{ margin-left:auto; min-width:200px; }
.ep-days{ display:flex; gap:6px; flex-wrap:wrap; }
.ep-day{ display:flex; flex-direction:column; align-items:center; gap:1px; min-width:58px; padding:8px 6px; border:1px solid var(--line); background:var(--panel); border-radius:11px; cursor:pointer; color:var(--muted); transition:background .12s,color .12s,border-color .12s; }
.ep-day:hover{ color:var(--ink); border-color:var(--line-strong); }
.ep-day.active{ background:var(--teal); color:#fff; border-color:transparent; }
.ep-day .ep-wd{ font-size:12px; font-weight:600; letter-spacing:.03em; }
.ep-day .ep-dt{ font-size:16px; font-weight:700; }
.ep-day .ep-cnt{ font-family:var(--mono); font-size:10px; opacity:.8; background:var(--surface-2); color:var(--muted); padding:0 6px; border-radius:999px; }
.ep-day.active .ep-cnt{ background:rgba(255,255,255,.25); color:#fff; }
.ep-tag-kopf{ font-weight:650; font-size:14px; margin-bottom:10px; color:var(--ink); }
.ep-row{ display:flex; gap:14px; padding:11px 12px; border:1px solid var(--line); border-radius:11px; margin-bottom:7px; background:var(--panel); align-items:flex-start; }
.ep-row:hover{ border-color:var(--line-strong); }
.ep-zeit{ display:flex; flex-direction:column; align-items:flex-start; min-width:74px; flex:none; border-right:1px solid var(--line); padding-right:12px; }
.ep-zeit b{ font-size:15px; color:var(--teal); font-variant-numeric:tabular-nums; }
.ep-zeit span{ font-size:12px; color:var(--muted); font-variant-numeric:tabular-nums; }
.ep-zeit em{ font-size:10.5px; color:var(--muted); font-style:normal; margin-top:3px; }
.ep-info{ flex:1; min-width:0; }
.ep-mit{ font-weight:650; font-size:14px; color:var(--ink); }
.ep-obj{ font-size:13px; color:var(--ink-soft); margin-top:1px; }
.ep-adr{ font-size:12px; color:var(--muted); margin-top:1px; }
.ep-flag{ font-size:10.5px; font-weight:600; background:var(--crit-soft); color:var(--crit); padding:1px 8px; border-radius:999px; margin-left:6px; white-space:nowrap; }
.ep-row.ep-abwesend{ border-color:color-mix(in srgb,var(--crit) 40%,transparent); background:var(--crit-soft); }
@media(max-width:640px){ .ep-such{ margin-left:0; width:100%; order:5; } }

/* Urlaub & Krankheit (Abwesenheiten) */
.ab-summe{ display:flex; gap:10px; flex-wrap:wrap; }
.ab-kachel{ flex:1; min-width:120px; border:1px solid var(--line); border-radius:12px; padding:12px 14px; background:var(--panel); display:flex; flex-direction:column; gap:2px; }
.ab-kachel b{ font-size:24px; font-weight:750; color:var(--ink); }
.ab-kachel span{ font-size:12px; color:var(--muted); }
.ab-kachel.ab-krank{ border-color:color-mix(in srgb,var(--crit) 35%,transparent); }
.ab-kachel.ab-krank b{ color:var(--crit); }
.ab-kachel.ab-urlaub{ border-color:color-mix(in srgb,var(--teal) 40%,transparent); }
.ab-kachel.ab-urlaub b{ color:var(--teal); }
.ab-check{ display:inline-flex; align-items:center; gap:6px; font-size:12.5px; color:var(--muted); cursor:pointer; margin-left:auto; }
.ab-row{ display:flex; gap:12px; align-items:center; padding:10px 12px; border:1px solid var(--line); border-left-width:4px; border-radius:11px; margin-bottom:7px; background:var(--panel); }
.ab-row.ab-krank{ border-left-color:var(--crit); }
.ab-row.ab-urlaub{ border-left-color:var(--teal); }
.ab-row.ab-sonst{ border-left-color:var(--muted); }
.ab-row.ab-abgelehnt{ opacity:.55; }
.ab-typ{ font-size:11.5px; font-weight:650; min-width:74px; flex:none; color:var(--ink-soft); }
.ab-info{ flex:1; min-width:0; }
.ab-name{ font-weight:650; font-size:14px; color:var(--ink); }
.ab-zeit{ font-size:12.5px; color:var(--muted); font-variant-numeric:tabular-nums; }
.ab-tage{ margin-left:8px; opacity:.85; }
.ab-status{ font-size:11px; font-weight:650; padding:2px 9px; border-radius:999px; flex:none; white-space:nowrap; }
.ab-status.ok{ background:var(--ok-soft,color-mix(in srgb,var(--teal) 15%,transparent)); color:var(--teal); }
.ab-status.wait{ background:var(--surface-2); color:var(--muted); }
.ab-status.no{ background:var(--crit-soft); color:var(--crit); }

/* Material — Kachel-Raster statt Balken (mehr Info direkt auf der Fläche) */
.mat-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(236px,1fr)); gap:10px; }
.mat-card{ background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:12px 14px; display:flex; flex-direction:column; gap:6px; cursor:pointer; transition:box-shadow .12s,border-color .12s; }
.mat-card:hover{ border-color:var(--line-strong); box-shadow:0 3px 10px rgba(0,0,0,.10); }
.mat-card-art{ cursor:default; }
.mat-card-art:hover{ border-color:var(--line); box-shadow:none; }
.mat-card-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.mat-nr{ font-weight:700; font-size:12.5px; color:var(--muted); }
.mat-obj{ font-weight:650; font-size:14.5px; color:var(--ink); line-height:1.3; }
.mat-meta{ display:flex; flex-wrap:wrap; gap:4px 10px; font-size:12px; color:var(--muted); }
/* Bestellungs-Detailfenster: Positionen nach Lieferant gruppiert */
.mat-pgroup{ margin-top:12px; }
.mat-pgroup:first-child{ margin-top:0; }
.mat-plief{ font-size:12px; font-weight:700; color:var(--muted); margin-bottom:3px; }
.mat-pitem{ display:flex; justify-content:space-between; gap:8px; font-size:13.5px; padding:4px 0; border-top:1px solid var(--line); }
.mat-pitem:first-child{ border-top:0; }
.mat-pmenge{ white-space:nowrap; color:var(--muted); }
/* Material-Archiv: schlanke Zeilen zum Durchscrollen (statt Kacheln) */
.mat-row{ display:flex; align-items:center; gap:12px; padding:8px 12px; border-bottom:1px solid var(--line); cursor:pointer; font-size:13px; }
.mat-row:hover{ background:var(--surface-2); }
.mat-row-nr{ flex:none; width:64px; color:var(--muted); font-variant-numeric:tabular-nums; }
.mat-row-obj{ flex:2; min-width:0; font-weight:600; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mat-row-mit{ flex:1.4; min-width:0; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mat-row-dat{ flex:none; width:88px; color:var(--muted); font-variant-numeric:tabular-nums; }

/* Einsatzplan als Kalender (Mitarbeiter × Tage) */
.ep-modus{ display:inline-flex; border:1px solid var(--line); border-radius:9px; overflow:hidden; }
.ep-mbtn{ border:0; background:var(--panel); color:var(--muted); padding:7px 14px; font-size:13px; font-weight:600; cursor:pointer; }
.ep-mbtn+.ep-mbtn{ border-left:1px solid var(--line); }
.ep-mbtn.active{ background:var(--teal); color:#fff; }
/* Einsatzplan: Inhalt randlos, Kalender-Kachel füllt den ganzen Inhaltsbereich */
main.full #view{ padding:0; display:flex; }
main.full .ep-card{ flex:1; min-height:0; border:0; border-radius:0; box-shadow:none; }
main.full .ep-grid-wrap{ flex:1; min-height:0; max-height:none; }
.ep-card{ display:flex; flex-direction:column; overflow:hidden; }
.ep-top{ display:flex; align-items:center; gap:10px 14px; flex-wrap:wrap; padding:12px 18px; border-bottom:1px solid var(--line); background:var(--surface-2); }
.ep-top .mtag{ font-family:var(--mono); font-size:10px; letter-spacing:.09em; text-transform:uppercase; color:var(--muted); }
.ep-top .ep-nav{ margin:0; }
.ep-grid-wrap{ overflow:auto; max-height:calc(100vh - 210px); }
.ep-grid{ display:grid; --ep-emp-w:150px; }
/* Woche: füllt die Breite komplett, kein seitliches Scrollen */
.ep-woche .ep-grid-wrap, .ep-woche.ep-grid-wrap{ overflow-x:hidden; }
.ep-woche .ep-grid{ width:100%; min-width:0; --ep-emp-w:130px; }
.ep-monat .ep-grid{ min-width:max-content; }
.ep-legende{ padding:12px 18px; border-top:1px solid var(--line); margin-top:0; }
.ep-cell{ border-right:1px solid var(--line); border-bottom:1px solid var(--line); padding:5px 7px; min-height:34px; background:var(--panel); }
.ep-head{ position:sticky; top:0; z-index:2; display:flex; flex-direction:column; gap:1px; align-items:flex-start; background:var(--surface-2); font-weight:600; }
.ep-head .ep-h-wd{ font-size:11px; color:var(--muted); }
.ep-head .ep-h-dt{ font-size:13px; color:var(--ink); }
.ep-emp{ position:sticky; left:0; z-index:1; width:var(--ep-emp-w); font-weight:600; font-size:12.5px; color:var(--ink); display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:1px; overflow:hidden; }
.ep-emp-nm{ max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ep-emp-abs{ font-size:9.5px; font-weight:600; color:var(--muted); display:flex; align-items:center; gap:4px; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ep-emp-abs::before{ content:""; width:8px; height:8px; border-radius:2px; flex:none; background:var(--muted); }
.ep-emp-abs.ep-abs-urlaub::before{ background:#eab308; }
.ep-emp-abs.ep-abs-krank::before{ background:#3b82f6; }
.ep-emp-abs.ep-abs-sonst::before{ background:#94a3b8; }
.ep-corner{ position:sticky; top:0; left:0; z-index:3; width:var(--ep-emp-w); background:var(--surface-2); font-weight:700; font-size:12px; color:var(--muted); display:flex; align-items:center; }
.ep-slot{ display:flex; flex-direction:column; gap:3px; min-height:72px; padding-bottom:20px; }
.ep-monat .ep-slot{ min-height:46px; padding-bottom:16px; }
.ep-slot:hover{ background:color-mix(in srgb,var(--teal) 5%,transparent); }
.ep-head.ep-we, .ep-slot.ep-we{ background:var(--surface-2); }
.ep-head.ep-today{ background:var(--teal); }
.ep-head.ep-today .ep-h-wd, .ep-head.ep-today .ep-h-dt{ color:#fff; }
.ep-slot.ep-today{ background:color-mix(in srgb,var(--teal) 8%,transparent); }
/* Abwesenheit (Urlaub=gelb, Krankheit=blau) — Farbstreifen unten mit Datum drauf */
.ep-slot.ep-abs{ position:relative; }
.ep-absbar{ position:absolute; left:0; right:0; bottom:0; height:16px; line-height:16px; font-size:9.5px; font-weight:700; letter-spacing:.01em; text-align:center; pointer-events:none; overflow:hidden; white-space:nowrap; font-variant-numeric:tabular-nums; }
.ep-absbar.ep-abs-urlaub{ background:#eab308; color:#3a2c04; }
.ep-absbar.ep-abs-krank{ background:#3b82f6; color:#fff; }
.ep-absbar.ep-abs-sonst{ background:#94a3b8; color:#1f2937; }
.ep-monat .ep-absbar{ height:14px; line-height:14px; font-size:8.5px; }
/* Einsatz-Kachel im Abwesenheits-Zeitraum: ausgegraut */
.ep-chip.ep-frei, .ep-mchip.ep-frei{ filter:grayscale(1); opacity:.5; border-left-color:#9ca3af; }
/* Status-Streifen links an der Kachel: grün=gearbeitet, rot=nicht gearbeitet, blau=offen */
.ep-chip.ep-st-gearbeitet, .ep-mchip.ep-st-gearbeitet{ border-left-color:#16a34a; border-left-width:4px; }
.ep-chip.ep-st-versaeumt, .ep-mchip.ep-st-versaeumt{ border-left-color:#dc2626; border-left-width:4px; }
.ep-chip.ep-st-offen, .ep-mchip.ep-st-offen{ border-left-color:#2563eb; border-left-width:4px; }
.ep-leg-sep{ width:1px; height:14px; background:var(--line); margin:0 2px; }
.ep-leg-bar{ width:4px; height:13px; border-radius:2px; background:var(--muted); display:inline-block; }
.ep-leg-bar.ep-st-gearbeitet{ background:#16a34a; } .ep-leg-bar.ep-st-versaeumt{ background:#dc2626; } .ep-leg-bar.ep-st-offen{ background:#2563eb; }
.epf-dauer{ font-size:12.5px; color:var(--muted); margin-top:6px; }
/* Eigene (hier geplante) Einsätze: verschiebbar, mit Stift-Marker */
.ep-chip-eigen{ border:1px dashed var(--violet); cursor:grab; }
.ep-chip-eigen:active{ cursor:grabbing; }
.ep-eig-mk{ font-size:9px; opacity:.7; margin-right:2px; }
.ep-slot{ cursor:pointer; }
.ep-slot.ep-drop{ outline:2px dashed var(--teal); outline-offset:-2px; background:color-mix(in srgb,var(--teal) 10%,transparent); }
/* Planungs-Formular */
.epf-card{ width:min(440px,100%); }
.epf-body{ display:flex; flex-direction:column; gap:3px; }
.epf-l{ font-size:11.5px; font-weight:600; color:var(--muted); margin-top:9px; }
.epf-in{ width:100%; padding:8px 10px; border:1px solid var(--line-strong); border-radius:9px; background:var(--panel); color:var(--ink); font-family:var(--sans); font-size:14px; }
.epf-row2{ display:flex; gap:10px; } .epf-row2>div{ flex:1; }
.epf-seg{ display:inline-flex; border:1px solid var(--line); border-radius:9px; overflow:hidden; }
.epf-wied{ border:0; background:var(--panel); color:var(--muted); padding:8px 16px; font-size:13px; font-weight:600; cursor:pointer; }
.epf-wied+.epf-wied{ border-left:1px solid var(--line); }
.epf-wied.on{ background:var(--teal); color:#fff; }
.epf-wds{ display:flex; gap:6px; flex-wrap:wrap; margin-top:2px; }
.epf-wd{ width:42px; padding:8px 0; border:1px solid var(--line-strong); border-radius:9px; background:var(--panel); color:var(--ink-soft); font-size:13px; font-weight:600; cursor:pointer; transition:background .12s,color .12s,border-color .12s; }
.epf-wd:hover{ border-color:var(--teal); }
.epf-wd.on{ background:var(--teal); color:#fff; border-color:transparent; }
.epf-actions{ display:flex; align-items:center; justify-content:space-between; margin-top:18px; gap:8px; }
.epp-hbtns{ display:flex; align-items:center; gap:4px; flex:none; }
.epp-trash{ font-size:15px; }
.epp-trash:hover{ color:var(--crit); }
.btn.danger{ background:var(--crit); color:#fff; border-color:transparent; }
.btn.danger:hover{ filter:brightness(1.06); }
/* Lösch-Bestätigung */
.epc-card{ background:var(--panel); border-radius:16px; width:min(400px,100%); box-shadow:0 20px 60px rgba(0,0,0,.35); overflow:hidden; }
.epc-h{ padding:15px 18px; font-size:16px; font-weight:750; border-bottom:1px solid var(--line); }
.epc-msg{ padding:16px 18px; font-size:14px; line-height:1.5; color:var(--ink); }
.epc-btns{ display:flex; flex-direction:column; gap:8px; padding:0 18px 18px; }
.epc-btns .btn{ width:100%; justify-content:center; }
/* PlanD-Einsatz nur ansehen: Felder gleich aussehen lassen (nicht ausgegraut) */
.epf-ro .epf-in[readonly], .epf-ro .epf-in:disabled{ color:var(--ink); -webkit-text-fill-color:var(--ink); opacity:1; background:var(--panel); cursor:default; }
.epf-ro .epf-wd:disabled, .epf-ro .epf-wied:disabled{ opacity:1; cursor:default; }
.epf-ro .epf-wd:disabled:not(.on){ color:var(--ink-soft); }
.ep-leg-dot.ep-abs-urlaub{ background:#eab308; }
.ep-leg-dot.ep-abs-krank{ background:#3b82f6; }
.ep-leg-dot.ep-abs-sonst{ background:#94a3b8; }
/* Chips (Wochen-Ansicht) */
.ep-chip{ font-size:10.5px; line-height:1.2; padding:3px 5px; border-radius:6px; cursor:pointer; border-left:3px solid var(--muted); background:var(--surface-2); color:var(--ink); overflow:hidden; word-break:break-word; }
.ep-chip b{ font-variant-numeric:tabular-nums; }
.ep-chip-z{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.ep-chip-art{ font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.02em; line-height:1.15; margin-top:1px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--muted); }
.ep-chip-art.art-unterhalt{ color:#16a34a; } .ep-chip-art.art-quali{ color:#dc2626; } .ep-chip-art.art-treppe{ color:#7c3aed; }
.ep-chip-art.art-sonder{ color:#ea580c; } .ep-chip-art.art-bau{ color:#b45309; } .ep-chip-art.art-glas{ color:#0284c7; }
.ep-chip-art.art-grund{ color:#0d9488; } .ep-chip-art.art-default{ color:#64748b; }
.ep-chip:hover{ filter:brightness(1.04); box-shadow:0 1px 4px rgba(0,0,0,.12); }
.ep-chip-abw{ outline:1px dashed var(--crit); }
/* Monats-Ansicht: Zellen mit kleinen Einsatz-Kacheln, mehrere untereinander */
.ep-monat .ep-cell{ padding:3px; min-height:28px; }
.ep-monat .ep-slot{ flex-direction:column; gap:2px; }
.ep-mchip{ font-size:9.5px; line-height:1.3; padding:1px 2px; border-radius:4px; cursor:pointer; border-left:3px solid var(--muted); background:var(--surface-2); color:var(--ink); text-align:center; overflow:hidden; white-space:nowrap; font-variant-numeric:tabular-nums; }
.ep-mchip:hover{ filter:brightness(1.05); }
.ep-mini{ width:11px; height:11px; border-radius:3px; cursor:pointer; background:var(--muted); display:inline-block; }
.ep-monat .ep-head .ep-h-dt{ font-size:12px; }
/* Reinigungsart-Farben */
.art-unterhalt{ border-left-color:#16a34a; background:color-mix(in srgb,#16a34a 12%,var(--panel)); } .ep-mini.art-unterhalt{ background:#16a34a; }
.art-treppe{ border-left-color:#7c3aed; background:color-mix(in srgb,#7c3aed 12%,var(--panel)); } .ep-mini.art-treppe{ background:#7c3aed; }
.art-sonder{ border-left-color:#ea580c; background:color-mix(in srgb,#ea580c 12%,var(--panel)); } .ep-mini.art-sonder{ background:#ea580c; }
.art-bau{ border-left-color:#b45309; background:color-mix(in srgb,#b45309 12%,var(--panel)); } .ep-mini.art-bau{ background:#b45309; }
.art-glas{ border-left-color:#0284c7; background:color-mix(in srgb,#0284c7 12%,var(--panel)); } .ep-mini.art-glas{ background:#0284c7; }
.art-quali{ border-left-color:#dc2626; background:color-mix(in srgb,#dc2626 12%,var(--panel)); } .ep-mini.art-quali{ background:#dc2626; }
.art-grund{ border-left-color:#0d9488; background:color-mix(in srgb,#0d9488 12%,var(--panel)); } .ep-mini.art-grund{ background:#0d9488; }
.art-default{ border-left-color:#64748b; background:color-mix(in srgb,#64748b 12%,var(--panel)); } .ep-mini.art-default{ background:#64748b; }
/* Legende */
.ep-legende{ display:flex; flex-wrap:wrap; gap:12px; margin-top:12px; font-size:12px; color:var(--muted); }
.ep-leg-item{ display:inline-flex; align-items:center; gap:5px; }
.ep-leg-dot{ width:12px; height:12px; border-radius:3px; background:var(--muted); display:inline-block; }
.ep-leg-item.art-unterhalt .ep-leg-dot{ background:#16a34a; } .ep-leg-item.art-treppe .ep-leg-dot{ background:#7c3aed; }
.ep-leg-item.art-sonder .ep-leg-dot{ background:#ea580c; } .ep-leg-item.art-bau .ep-leg-dot{ background:#b45309; }
.ep-leg-item.art-glas .ep-leg-dot{ background:#0284c7; } .ep-leg-item.art-quali .ep-leg-dot{ background:#dc2626; }
.ep-leg-item.art-grund .ep-leg-dot{ background:#0d9488; } .ep-leg-item.art-default .ep-leg-dot{ background:#64748b; }
/* Detail-Popup */
.ep-pop{ position:fixed; inset:0; background:rgba(15,23,42,.55); display:none; align-items:center; justify-content:center; z-index:1000; padding:20px; }
.ep-pop.show{ display:flex; }
.epp-card{ background:var(--panel); border-radius:16px; width:min(460px,100%); max-height:88vh; overflow:auto; box-shadow:0 20px 60px rgba(0,0,0,.35); }
.epp-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; padding:16px 18px; border-left:6px solid var(--muted); }
.epp-obj{ font-size:17px; font-weight:750; color:var(--ink); }
.epp-art{ font-size:13px; color:var(--muted); margin-top:2px; }
.epp-x{ border:0; background:transparent; font-size:18px; cursor:pointer; color:var(--muted); line-height:1; }
.epp-body{ padding:6px 18px 18px; }
.epp-row{ display:flex; gap:12px; padding:8px 0; border-top:1px solid var(--line); }
.epp-row:first-child{ border-top:0; }
.epp-lab{ flex:none; width:110px; font-size:12.5px; color:var(--muted); }
.epp-val{ flex:1; font-size:13.5px; color:var(--ink); }
/* Verbundenes Detail-Popup (Kunde/Objekt/Mitarbeiter) — feste Kachel mit Reitern, Zurück-Navigation
   und weiterklickbaren Verknüpfungen. Nutzt --acc als Akzentfarbe (von app.js pro Datensatz gesetzt). */
.dpop-card{ --acc: var(--teal); background:var(--panel); border-radius:20px; width:min(760px,94vw); max-height:90vh;
  display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--line);
  box-shadow:0 2px 0 rgba(255,255,255,.06) inset, 0 34px 90px rgba(0,0,0,.45), 0 10px 26px rgba(0,0,0,.28);
  animation:dpopin .18s cubic-bezier(.2,.8,.3,1); }
@keyframes dpopin{ from{ opacity:0; transform:translateY(14px) scale(.98); } to{ opacity:1; transform:none; } }
.dpop-card::before{ content:""; position:absolute; inset:0 0 auto 0; height:4px; background:var(--acc); opacity:.9; }
.dpop-card{ position:relative; }
.dpop-head{ display:flex; align-items:flex-start; gap:10px; padding:17px 20px 13px; border-bottom:1px solid var(--line);
  border-top:4px solid var(--acc); background:var(--surface-2); flex:none; }
.dpop-back{ flex:none; width:30px; height:30px; border-radius:50%; border:1px solid var(--line-strong); background:var(--panel);
  color:var(--ink); font-size:17px; line-height:1; cursor:pointer; display:grid; place-items:center; }
.dpop-back:hover{ background:var(--surface); border-color:var(--acc); color:var(--acc); }
.dpop-htext{ flex:1; min-width:0; }
.dpop-title{ font-size:19px; font-weight:750; color:var(--ink); line-height:1.25; }
.dpop-sub{ font-size:12.5px; color:var(--muted); margin-top:3px; display:flex; align-items:center; gap:8px; }
.dpop-pill{ font-size:10.5px; font-weight:700; padding:2px 9px; border-radius:999px; background:color-mix(in srgb,var(--acc) 16%,transparent); color:var(--acc); }
.dpop-x{ flex:none; border:0; background:transparent; font-size:19px; cursor:pointer; color:var(--muted); line-height:1; padding:4px; }
.dpop-x:hover{ color:var(--ink); }
.dpop-tabs{ display:flex; gap:2px; padding:0 16px; border-bottom:1px solid var(--line); background:var(--surface-2); flex:none; overflow-x:auto; }
.dpop-tab{ border:0; background:transparent; padding:11px 12px; font-size:13px; font-weight:650; color:var(--muted); cursor:pointer; border-bottom:2.5px solid transparent; white-space:nowrap; }
.dpop-tab:hover{ color:var(--ink); }
.dpop-tab.on{ color:var(--acc); border-bottom-color:var(--acc); }
.dpop-body{ padding:6px 20px 16px; overflow-y:auto; flex:1; min-height:140px; }
.dpop-foot{ display:flex; align-items:center; justify-content:space-between; gap:8px; padding:12px 20px; border-top:1px solid var(--line); background:var(--surface-2); flex:none; }
.dl-a{ color:var(--acc); text-decoration:none; font-weight:650; }
.dl-a:hover{ text-decoration:underline; }
.dpop-list{ display:flex; flex-direction:column; gap:8px; padding:10px 0 4px; }
.dpop-link{ display:flex; align-items:center; gap:10px; padding:11px 13px; border:1px solid var(--line); border-radius:11px; cursor:pointer; background:var(--surface); transition:border-color .12s,box-shadow .12s; }
.dpop-link:hover{ border-color:var(--acc); box-shadow:0 3px 10px rgba(0,0,0,.08); }
.dpop-link-m{ flex:1; min-width:0; font-weight:650; font-size:13.5px; color:var(--ink); }
.dpop-link-s{ flex:none; font-size:12px; color:var(--muted); max-width:45%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dpop-link-go{ flex:none; color:var(--muted); font-size:16px; }
.dpop-empty{ padding:22px 0; text-align:center; color:var(--muted); font-size:13px; }
@media (max-width:560px){ .dpop-link-s{ display:none; } }
/* Fußleiste in zwei Gruppen (links Navigation, rechts Aktionen) */
.dpop-foot{ flex-wrap:wrap; }
.dpop-foot-l, .dpop-foot-r{ display:flex; gap:7px; align-items:center; flex-wrap:wrap; }
/* Tags */
.dtag{ display:inline-block; font-size:11px; font-weight:650; padding:2px 9px; border-radius:999px; background:color-mix(in srgb,var(--acc,var(--violet)) 15%,transparent); color:var(--acc,var(--violet)); }
/* „Anlegen"-Zeile in den Reitern (Bemerkung/Aufgabe/Ansprechpartner) */
.dadd{ display:flex; gap:8px; align-items:flex-start; padding:4px 0 12px; border-bottom:1px solid var(--line); margin-bottom:10px; }
.dadd-in{ flex:1; min-width:90px; padding:9px 11px; border:1px solid var(--line-strong); border-radius:9px; background:var(--surface); color:var(--ink); font-size:13px; }
.dadd-ta{ flex:1; padding:9px 11px; border:1px solid var(--line-strong); border-radius:9px; background:var(--surface); color:var(--ink); font-size:13px; min-height:44px; resize:vertical; font-family:inherit; }
.dadd-grid{ flex-wrap:wrap; }
/* Bemerkungen */
.dnote{ padding:9px 0; border-bottom:1px solid var(--line); }
.dnote:last-child{ border-bottom:0; }
.dnote-t{ font-size:13.5px; color:var(--ink); line-height:1.45; white-space:pre-wrap; }
.dnote-m{ font-size:11px; color:var(--muted); margin-top:3px; }
/* Aufgaben */
.dtask{ display:flex; align-items:center; gap:10px; padding:9px 2px; border-bottom:1px solid var(--line); cursor:pointer; }
.dtask:last-child{ border-bottom:0; }
.dtask input{ width:17px; height:17px; flex:none; accent-color:var(--good); }
.dtask-t{ flex:1; font-size:13.5px; color:var(--ink); }
.dtask.done .dtask-t{ text-decoration:line-through; color:var(--muted); }
.dtask-m{ flex:none; font-size:11px; color:var(--muted); }
/* Dokumente */
.ddoc{ display:flex; align-items:center; gap:10px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; margin-bottom:7px; text-decoration:none; background:var(--surface); transition:border-color .12s; }
.ddoc:hover{ border-color:var(--acc); }
.ddoc-ic{ flex:none; font-size:16px; }
.ddoc-n{ flex:1; font-size:13.5px; color:var(--ink); font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ddoc-m{ flex:none; font-size:11px; color:var(--muted); }
.ddoc-thumb{ flex:none; width:40px; height:40px; object-fit:cover; border-radius:7px; border:1px solid var(--line); background:var(--surface-2); }
.ddoc-img .ddoc-n{ font-weight:600; }
/* Verlauf (Zeitleiste) */
.dtl{ padding:4px 0; }
.dtl-i{ display:flex; gap:12px; padding:8px 0; border-left:2px solid var(--line); padding-left:14px; margin-left:4px; position:relative; }
.dtl-i::before{ content:""; position:absolute; left:-5px; top:12px; width:8px; height:8px; border-radius:50%; background:var(--acc); }
.dtl-d{ flex:none; font-size:11px; color:var(--muted); width:118px; }
.dtl-t{ flex:1; font-size:13px; color:var(--ink); }
/* Bearbeiten-Formular */
.dedit-grid{ display:grid; grid-template-columns:1fr; gap:3px 14px; }
@media (min-width:560px){ .dedit-grid{ grid-template-columns:1fr 1fr; } .dedit-grid .epf-l:nth-child(4n+1), .dedit-grid .epf-l:nth-child(4n+2){ } }
.dedit-grid .epf-l{ margin-top:8px; }
/* Anklickbarer Name in Stammdaten-Listen (öffnet das Detailfenster) */
.dlink{ cursor:pointer; }
.dlink:hover{ color:var(--violet); text-decoration:underline; text-underline-offset:2px; }

/* Aufgaben & Anliegen */
.auf-tabs{ display:flex; flex-wrap:wrap; gap:6px; margin-top:14px; }
.auf-tab{ display:inline-flex; align-items:center; gap:6px; border:1px solid var(--line); background:var(--panel); color:var(--ink-soft); border-radius:999px; padding:6px 13px; font-size:12.5px; font-weight:600; cursor:pointer; }
.auf-tab:hover{ border-color:var(--line-strong); }
.auf-tab.active{ background:var(--teal); color:#fff; border-color:transparent; }
.auf-dot{ width:9px; height:9px; border-radius:50%; flex:none; }
.auf-row{ border:1px solid var(--line); border-left-width:4px; border-radius:11px; margin-bottom:8px; background:var(--panel); overflow:hidden; }
.auf-main{ padding:10px 12px; cursor:pointer; }
.auf-main:hover{ background:var(--surface-2); }
.auf-top{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin-bottom:3px; }
.auf-kat{ font-size:10.5px; font-weight:700; color:#fff; padding:1px 8px; border-radius:999px; }
.auf-prio{ font-size:10.5px; font-weight:700; padding:1px 8px; border-radius:999px; }
.auf-p-urgent{ background:var(--crit-soft); color:var(--crit); }
.auf-p-high{ background:color-mix(in srgb,#ea580c 18%,transparent); color:#c2410c; }
.auf-p-med{ background:var(--surface-2); color:var(--ink-soft); }
.auf-p-low{ background:var(--surface-2); color:var(--muted); }
.auf-status{ font-size:10.5px; font-weight:650; padding:1px 8px; border-radius:999px; margin-left:auto; }
.auf-status.ok{ background:color-mix(in srgb,var(--teal) 15%,transparent); color:var(--teal); }
.auf-status.wait{ background:var(--surface-2); color:var(--muted); }
.auf-titel{ font-weight:650; font-size:14px; color:var(--ink); }
.auf-meta{ font-size:12px; color:var(--muted); margin-top:2px; }
.auf-detail{ padding:0 12px 10px; }
.auf-detail:empty{ padding:0; }

/* Zeiterfassung & Standortkontrolle — Tabelle (wie PlanD Zeitenfreigabe) */
.ze-tabwrap{ overflow-x:auto; border:1px solid var(--line); border-radius:12px; }
.ze-tab{ width:100%; border-collapse:collapse; font-size:13px; min-width:820px; }
.ze-tab thead th{ text-align:left; font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); font-weight:600; padding:10px 12px; border-bottom:1px solid var(--line); background:var(--surface-2); white-space:nowrap; }
.ze-tab td{ padding:10px 12px; border-bottom:1px solid var(--line); vertical-align:top; }
.ze-tab tbody tr:hover{ background:var(--surface-2); }
.ze-tab tbody tr:last-child td{ border-bottom:0; }
.ze-r-ok{ background:color-mix(in srgb,var(--teal) 7%,transparent); }
.ze-r-no{ background:color-mix(in srgb,var(--crit) 7%,transparent); }
.ze-c-datum{ white-space:nowrap; color:var(--ink-soft); }
.ze-sub{ font-size:11.5px; color:var(--muted); margin-top:2px; font-variant-numeric:tabular-nums; }
.ze-art{ color:var(--ink-soft); font-size:12px; }
.ze-obj{ font-weight:600; color:var(--ink); }
.ze-fehler{ display:inline-block; font-size:11px; font-weight:700; padding:2px 9px; border-radius:999px; white-space:nowrap; }
.ze-fehler.f-ueber{ background:color-mix(in srgb,#f59e0b 22%,transparent); color:#b45309; }
.ze-fehler.f-unter{ background:color-mix(in srgb,#eab308 24%,transparent); color:#a16207; }
.ze-fehler.f-ort{ background:color-mix(in srgb,#3b82f6 20%,transparent); color:#1d4ed8; }
.ze-fehler.f-ok{ background:color-mix(in srgb,var(--teal) 15%,transparent); color:var(--teal); }
.ze-orte{ display:flex; gap:6px; flex-wrap:wrap; align-items:center; margin-top:5px; }
.ze-ort{ font-size:10.5px; font-weight:650; padding:1px 7px; border-radius:999px; }
.ze-ort.ok{ background:color-mix(in srgb,var(--teal) 14%,transparent); color:var(--teal); }
.ze-ort.nicht{ background:var(--crit-soft); color:var(--crit); }
.ze-ort.fehlt{ background:var(--surface-2); color:var(--muted); }
.ze-karte{ font-size:11px; color:var(--teal); text-decoration:none; white-space:nowrap; }
.ze-karte:hover{ text-decoration:underline; }
.ze-c-soll{ white-space:nowrap; font-variant-numeric:tabular-nums; }
.ze-c-abw{ white-space:nowrap; font-variant-numeric:tabular-nums; font-weight:650; color:var(--muted); }
.ze-c-abw.ze-abw-rot{ color:var(--crit); }
.ze-c-akt{ white-space:nowrap; }
.ze-akz,.ze-abl{ width:34px; height:30px; border-radius:8px; border:1px solid var(--line-strong); background:var(--panel); font-size:15px; cursor:pointer; margin-right:5px; }
.ze-akz{ color:#16a34a; } .ze-abl{ color:var(--crit); }
.ze-akz:hover{ background:color-mix(in srgb,#16a34a 12%,transparent); border-color:#16a34a; }
.ze-abl:hover{ background:var(--crit-soft); border-color:var(--crit); }
.ze-akz.on{ background:#16a34a; color:#fff; border-color:transparent; }
.ze-abl.on{ background:var(--crit); color:#fff; border-color:transparent; }
.ze-fest{ font-size:10.5px; font-weight:600; color:var(--teal); margin-top:4px; white-space:nowrap; }
.ze-fest.ze-fest-no{ color:var(--crit); }
/* Freigabe-Auswahl-Popup (Soll/Ist) */
.ze-akzpop{ position:fixed; display:none; z-index:1200; width:210px; background:var(--panel); border:1px solid var(--line-strong); border-radius:12px; box-shadow:0 14px 40px rgba(0,0,0,.28); padding:8px; }
.ze-akzp-t{ font-size:11.5px; font-weight:700; color:var(--muted); padding:4px 6px 7px; }
.ze-akzp-b{ display:block; width:100%; text-align:left; border:1px solid var(--line); background:var(--panel); color:var(--ink); border-radius:9px; padding:9px 11px; font-size:13px; cursor:pointer; margin-top:5px; }
.ze-akzp-b:hover{ border-color:var(--teal); background:var(--surface-2); }
.ze-akzp-b.on{ background:var(--teal); color:#fff; border-color:transparent; }

/* Voll-Höhe-Ansichten: Kopf/Filter fest, Liste scrollt in der Kachel, füllt die Fläche */
#view.vfill{ display:flex; overflow:hidden; }
#view.vfill > .card{ flex:1; display:flex; flex-direction:column; min-height:0; }
#view.vfill > .card > .card-h{ flex:none; }
#view.vfill > .card > .pad{ flex:1; display:flex; flex-direction:column; min-height:0; overflow:hidden; }
#view.vfill > .card > .pad > :last-child{ flex:1; min-height:0; overflow:auto; }
#view.vfill .ze-tabwrap{ border:0; border-radius:0; overflow:visible; }
#view.vfill .ze-tab thead th{ position:sticky; top:0; z-index:2; }

/* Zeitkonto pro Mitarbeiter */
.zk-row{ border:1px solid var(--line); border-radius:11px; margin-bottom:8px; background:var(--panel); overflow:hidden; }
.zk-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; cursor:pointer; }
.zk-head:hover{ background:var(--surface-2); }
.zk-total{ font-size:17px; font-weight:750; color:var(--teal); font-variant-numeric:tabular-nums; white-space:nowrap; }
.zk-detail{ display:none; padding:2px 14px 10px; }
.zk-detail.open{ display:block; }
.zk-e{ display:flex; justify-content:space-between; gap:10px; font-size:12.5px; padding:5px 0; border-top:1px solid var(--line); color:var(--ink-soft); }
.zk-e-z{ font-variant-numeric:tabular-nums; color:var(--muted); white-space:nowrap; }

/* Zeiterfassung als Vollseite: Sticky-Header (Kennzahlen/Filter) + große scrollende Tabelle */
main.full .ze-page{ flex:1; display:flex; flex-direction:column; min-height:0; }
.ze-sticky{ flex:none; padding:14px clamp(12px,2vw,22px); border-bottom:1px solid var(--line); background:var(--surface); }
.ze-scroll{ flex:1; min-height:0; overflow:auto; }
main.full .ze-scroll .ze-tabwrap{ border:0; border-radius:0; overflow:visible; }
main.full .ze-tab{ font-size:13.5px; min-width:920px; }
main.full .ze-tab td{ padding:12px clamp(12px,2vw,22px); }
main.full .ze-tab thead th{ position:sticky; top:0; z-index:2; padding:12px clamp(12px,2vw,22px); }

/* Generische Vollseite (fp = full page): Sticky-Header + scrollende Liste */
main.full .fp-page{ flex:1; display:flex; flex-direction:column; min-height:0; }
.fp-sticky{ flex:none; padding:14px clamp(12px,2vw,22px); border-bottom:1px solid var(--line); background:var(--surface); }
.fp-scroll{ flex:1; min-height:0; overflow:auto; padding:14px clamp(12px,2vw,22px); }

/* Schmalere Sticky-Header in den Vollseiten (mehr Arbeitsfläche) */
.fp-sticky{ padding:10px clamp(12px,2vw,20px); }
.fp-sticky .ab-summe .ab-kachel{ padding:7px 13px; min-width:110px; }
.fp-sticky .ab-summe .ab-kachel b{ font-size:19px; }
.fp-sticky .ab-summe .ab-kachel span{ font-size:11px; }
.ze-sticky{ padding:10px clamp(12px,2vw,20px); }
.ze-sticky .ab-summe .ab-kachel{ padding:7px 13px; }
.ze-sticky .ab-summe .ab-kachel b{ font-size:19px; }
.ze-sticky .ab-summe .ab-kachel span{ font-size:11px; }
main.full .ep-top{ padding:9px 16px; }

/* Tabellen-Werkzeugleiste (Suche/Sortierung) + Vollseiten-Tabellen */
.tbl-tools{ display:flex; align-items:center; gap:12px 14px; flex-wrap:wrap; }
.tbl-search{ flex:1; min-width:220px; max-width:520px; padding:10px 14px; border:1px solid var(--line-strong); border-radius:10px; background:var(--surface-2); color:var(--ink); font-size:14px; }
.tbl-search:focus{ outline:2px solid var(--violet); outline-offset:1px; }
.tbl-count{ font-weight:750; color:var(--violet); font-size:14px; }
.tbl-stat{ color:var(--muted); font-size:12.5px; }
.lead-click{ cursor:pointer; transition:border-color .12s, box-shadow .12s, transform .06s; }
.lead-click:hover{ border-color:var(--good); box-shadow:0 3px 12px rgba(0,0,0,.1); }
.lead-click:active{ transform:translateY(.5px); }
.scrape-row{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.scrape-row .dadd-in{ flex:1; min-width:180px; }
.tbl-filters{ display:flex; align-items:center; gap:7px; flex-wrap:wrap; margin-top:9px; }
.tbl-flab{ font-size:12px; color:var(--muted); margin-right:2px; }
.tbl-fchip{ border:1px solid var(--line-strong); background:var(--surface); color:var(--ink-soft); border-radius:999px; padding:5px 13px; font-size:12.5px; font-weight:600; cursor:pointer; transition:.12s; }
.tbl-fchip:hover{ border-color:var(--violet); }
.tbl-fchip.on{ background:var(--violet); color:#fff; border-color:var(--violet); }
main.full .fp-scroll table{ width:100%; border-collapse:collapse; }
main.full .fp-scroll thead th{ position:sticky; top:0; z-index:2; background:var(--surface-2); text-align:left; padding:11px clamp(10px,1.6vw,18px); font-size:11.5px; letter-spacing:.03em; text-transform:uppercase; color:var(--muted); border-bottom:1px solid var(--line-strong); white-space:nowrap; }
main.full .fp-scroll tbody td{ padding:11px clamp(10px,1.6vw,18px); border-bottom:1px solid var(--line); vertical-align:top; }
main.full .fp-scroll tbody tr:hover{ background:var(--surface-2); }
.th-sort{ cursor:pointer; user-select:none; }
.th-sort:hover{ color:var(--ink); }
.th-sort.th-on{ color:var(--violet); }
.th-sort.th-on::after{ content:" ▲"; font-size:9px; }
.th-sort.th-on.th-desc::after{ content:" ▼"; }
.dlink{ color:var(--violet); cursor:pointer; font-weight:700; }
.dlink:hover{ text-decoration:underline; }
/* Vollständige Detail-Seite (obere Reiter) */
.dp-page{ --acc:var(--violet); }
.dp-head{ border-top:3px solid var(--acc); }
.dp-top{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.dp-titb{ flex:1; min-width:0; }
.dp-title{ font-size:clamp(18px,2.4vw,24px); font-weight:750; color:var(--ink); line-height:1.2; }
.dp-sub{ font-size:12.5px; color:var(--muted); margin-top:2px; display:flex; align-items:center; gap:8px; }
.dp-actions{ display:flex; gap:8px; flex-wrap:wrap; }
.dp-tabs{ display:flex; gap:2px; margin-top:12px; overflow-x:auto; border-bottom:1px solid var(--line); }
.dp-tab{ border:0; background:transparent; padding:11px 15px; font-size:14px; font-weight:650; color:var(--muted); cursor:pointer; border-bottom:2.5px solid transparent; white-space:nowrap; }
.dp-tab:hover{ color:var(--ink); }
.dp-tab.on{ color:var(--acc); border-bottom-color:var(--acc); }
.dp-body{ max-width:1100px; }
.dp-body .epp-row{ max-width:760px; }

/* ---------- Clara-Simulation ---------- */
.sim-head{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.sim-hi{ flex:none; }
.sim-orb{ display:inline-block; width:34px; height:34px; border-radius:50%; background:radial-gradient(circle at 32% 30%, #7ff0e0, var(--teal) 70%); box-shadow:0 0 0 4px color-mix(in srgb,var(--teal) 20%,transparent), 0 6px 18px color-mix(in srgb,var(--teal) 40%,transparent); animation:simpulse 2.4s ease-in-out infinite; }
.sim-orb.sm{ width:20px; height:20px; vertical-align:middle; }
@keyframes simpulse{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.08); filter:brightness(1.12); } }
.sim-ht{ flex:1; min-width:240px; }
.sim-h1{ font-size:clamp(17px,2.2vw,22px); font-weight:750; color:var(--ink); }
.sim-h2{ font-size:13px; color:var(--muted); margin-top:3px; max-width:70ch; }
.sim-safe{ margin-top:12px; font-size:12.5px; color:var(--ink-soft); background:color-mix(in srgb,var(--good) 12%,transparent); border:1px solid color-mix(in srgb,var(--good) 34%,transparent); border-radius:11px; padding:10px 13px; display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.sim-toggle{ display:inline-flex; align-items:center; gap:7px; cursor:pointer; font-weight:600; }
.sim-empty{ padding:34px 16px; text-align:center; color:var(--muted); font-size:14px; }
.sim-safe-n{ display:block; margin-top:6px; font-size:12px; color:var(--ink-soft); }
.sim-guthaben{ margin-top:10px; font-size:13px; border-radius:10px; padding:10px 13px; line-height:1.5; }
.sim-guthaben:empty{ display:none; }
.sim-guthaben.warn{ background:var(--crit-soft); border:1px solid color-mix(in srgb,var(--crit) 40%,transparent); color:var(--ink); }
.sim-guthaben.ok{ background:var(--good-soft); border:1px solid color-mix(in srgb,var(--good) 34%,transparent); color:var(--ink-soft); }
.sim-queue{ background:var(--surface-2); border:1px solid var(--line-strong); border-radius:12px; padding:12px 14px; margin-bottom:16px; display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.sim-queue-t{ flex:1; min-width:220px; font-size:13.5px; color:var(--ink); }
.sim-queue-status{ flex-basis:100%; font-size:12.5px; color:var(--muted); }
.sim-q-run{ color:var(--warn); font-weight:600; }
.sim-q-done{ color:var(--good); font-weight:700; }
.sim-q-err{ color:var(--crit); }
.sim-q-line{ padding:4px 0; border-top:1px solid var(--line); }
.sim-q-line:first-child{ border-top:0; }
.sim-q-muted{ color:var(--muted); }
.sim-fazit{ background:linear-gradient(150deg,color-mix(in srgb,var(--teal) 14%,var(--surface)),var(--surface)); border:1px solid color-mix(in srgb,var(--teal) 32%,var(--line)); border-left:4px solid var(--teal); border-radius:14px; padding:14px 16px; margin-bottom:14px; }
.sim-fazit-h{ font-weight:750; color:var(--teal); display:flex; align-items:center; gap:9px; font-size:14px; }
.sim-fazit-t{ margin-top:7px; font-size:14px; line-height:1.55; color:var(--ink); white-space:pre-wrap; }
.sim-kpis{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:16px; }
.sim-kpi{ flex:1; min-width:96px; background:var(--surface-2); border:1px solid var(--line); border-radius:11px; padding:10px 12px; text-align:center; }
.sim-kpi b{ display:block; font-size:22px; color:var(--violet); }
.sim-kpi span{ font-size:11.5px; color:var(--muted); }
/* Kompakter Kopf + KPIs im festen Kopf (bleiben beim Scrollen sichtbar) */
.sim-sticky{ padding-top:8px; padding-bottom:9px; }
.sim-sticky .sim-head{ align-items:center; gap:12px; }
.sim-sticky .sim-orb{ width:28px; height:28px; }
.sim-sticky .sim-h2{ font-size:12px; margin-top:1px; }
.sim-sticky .sim-safe{ margin-top:8px; padding:7px 12px; gap:10px; }
.sim-kpis-head{ display:flex; gap:8px; flex-wrap:wrap; margin-top:9px; }
.sim-kpis-head:empty{ display:none; }
.sim-kpis-head .sim-kpi{ flex:0 1 auto; min-width:0; padding:5px 12px; text-align:left; display:flex; align-items:baseline; gap:6px; }
.sim-kpis-head .sim-kpi b{ display:inline; font-size:17px; }
.sim-kpis-head .sim-kpi span{ font-size:11px; }
.sim-cols{ display:grid; grid-template-columns:1fr; gap:18px; }
@media (min-width:900px){ .sim-cols{ grid-template-columns:1.1fr 1fr; } }
.sim-colh{ font-size:13px; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); margin:0 0 10px; }
.sim-timeline{ display:flex; flex-direction:column; gap:8px; }
.sim-ev{ display:flex; gap:11px; padding:11px 13px; border:1px solid var(--line); border-left:3px solid var(--c,var(--violet)); border-radius:11px; background:var(--surface); animation:simin .3s ease; }
@keyframes simin{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }
.sim-ev-ic{ flex:none; width:26px; height:26px; border-radius:7px; display:grid; place-items:center; background:color-mix(in srgb,var(--c) 16%,transparent); color:var(--c); font-size:14px; }
.sim-ev-b{ flex:1; min-width:0; }
.sim-ev-area{ font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--c,var(--violet)); margin-right:8px; }
.sim-ev-t{ font-weight:650; font-size:13.5px; color:var(--ink); }
.sim-ev-d{ font-size:12.5px; color:var(--muted); margin-top:3px; }
.sim-call{ margin-top:8px; background:var(--surface-2); border:1px dashed color-mix(in srgb,var(--good) 45%,var(--line)); border-radius:9px; padding:8px 10px; }
.sim-call-t{ font-size:13px; color:var(--ink); font-style:italic; }
.sim-call-b{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:6px; }
.sim-call-as{ font-size:11.5px; color:var(--good); font-weight:600; }
.sim-call-ok{ font-size:11.5px; color:var(--good); font-weight:700; }
.sim-call-frg{ font-size:11px; color:var(--violet); font-weight:700; background:var(--violet-soft); border-radius:999px; padding:2px 9px; }
.sim-gap{ border:1px solid var(--line); border-radius:11px; padding:11px 13px; margin-bottom:9px; background:var(--surface); border-left:4px solid var(--muted); }
.sim-gap.sev-hoch{ border-left-color:var(--crit); }
.sim-gap.sev-mittel{ border-left-color:var(--warn); }
.sim-gap.sev-niedrig{ border-left-color:var(--good); }
.sim-gap-h{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; }
.sim-gap-sev{ font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; padding:2px 8px; border-radius:999px; color:#fff; background:var(--muted); }
.sev-hoch .sim-gap-sev{ background:var(--crit); }
.sev-mittel .sim-gap-sev{ background:var(--warn); }
.sev-niedrig .sim-gap-sev{ background:var(--good); }
.sim-gap-area{ font-size:11px; font-weight:700; color:var(--muted); text-transform:uppercase; }
.sim-gap-h b{ font-size:13.5px; color:var(--ink); flex-basis:100%; }
.sim-gap-p{ font-size:13px; color:var(--ink-soft); margin-top:5px; }
.sim-gap-b{ font-size:12.5px; color:var(--muted); margin-top:5px; }
.sim-gap-b b{ color:var(--violet); }
.sim-foot{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-top:16px; padding-top:12px; border-top:1px solid var(--line); }
.sim-foot-n{ font-size:12px; color:var(--muted); }

/* ---------- Freigabe-Matrix ---------- */
.frg-legend{ font-size:13px; color:var(--ink-soft); line-height:1.5; }
.frg-proto{ display:inline-block; margin-left:6px; color:var(--good); font-weight:600; }
.frg-scalekey{ display:flex; gap:8px; flex-wrap:wrap; margin:10px 0 14px; }
.frg-k{ font-size:11px; color:var(--muted); background:var(--surface-2); border:1px solid var(--line); border-radius:999px; padding:3px 10px; }
.frg-k b{ color:var(--violet); }
.frg-grp{ margin-bottom:14px; }
.frg-grph{ font-size:11.5px; font-weight:750; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); padding:6px 0; border-bottom:1px solid var(--line); margin-bottom:6px; }
.frg-row{ display:flex; align-items:center; gap:14px; padding:7px 0; flex-wrap:wrap; }
.frg-lab{ flex:1; min-width:200px; font-size:13.5px; color:var(--ink); }
.frg-dots{ display:flex; gap:5px; }
.frg-dot{ width:30px; height:30px; border-radius:8px; border:1px solid var(--line-strong); background:var(--surface); color:var(--muted); font-weight:700; font-size:13px; cursor:pointer; transition:.12s; }
.frg-dot:hover{ border-color:var(--violet); }
.frg-dot.ok{ background:color-mix(in srgb,var(--good) 16%,transparent); color:var(--good); border-color:color-mix(in srgb,var(--good) 40%,transparent); }
.frg-dot.sel{ background:var(--violet); color:#fff; border-color:var(--violet); box-shadow:0 2px 8px color-mix(in srgb,var(--violet) 40%,transparent); }
.frg-modes{ display:flex; gap:7px; align-items:center; }
.frg-modes .btn.on{ background:var(--violet); color:#fff; border-color:var(--violet); }
.frg-del{ border:0; background:none; color:var(--crit); cursor:pointer; font-size:12px; margin-left:8px; opacity:.6; }
.frg-del:hover{ opacity:1; }
/* Reiter je Stufe */
.frg-stabs{ display:flex; gap:5px; flex-wrap:wrap; margin:4px 0 12px; }
.frg-stab{ border:1px solid var(--line-strong); background:var(--surface); color:var(--ink-soft); border-radius:9px 9px 0 0; padding:9px 15px; font-weight:700; font-size:13.5px; cursor:pointer; }
.frg-stab:hover{ border-color:var(--violet); }
.frg-stab.on{ background:var(--violet); color:#fff; border-color:var(--violet); }
.frg-stufe-desc{ font-size:13px; color:var(--ink-soft); margin-bottom:12px; }
.frg-cols{ display:grid; grid-template-columns:1fr; gap:14px; }
@media (min-width:760px){ .frg-cols{ grid-template-columns:1fr 1fr; } }
.frg-list{ border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.frg-list.darf{ border-color:color-mix(in srgb,var(--good) 40%,var(--line)); }
.frg-list.nicht{ border-color:color-mix(in srgb,var(--crit) 34%,var(--line)); }
.frg-listh{ padding:9px 13px; font-weight:750; font-size:13px; border-bottom:1px solid var(--line); }
.frg-list.darf .frg-listh{ background:color-mix(in srgb,var(--good) 12%,transparent); color:var(--good); }
.frg-list.nicht .frg-listh{ background:color-mix(in srgb,var(--crit) 10%,transparent); color:var(--crit); }
.frg-item{ display:flex; align-items:center; gap:10px; padding:9px 13px; border-bottom:1px solid var(--line); font-size:13.5px; }
.frg-item:last-child{ border-bottom:0; }
.frg-item-l{ flex:1; color:var(--ink); }
.frg-item-x{ flex:none; font-size:11px; color:var(--muted); font-family:var(--mono); }
.frg-none{ padding:14px; text-align:center; color:var(--muted); font-size:13px; }
/* Hinzufügen-Zeile */
.frg-add{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-top:16px; padding-top:14px; border-top:1px dashed var(--line-strong); }
.frg-add-l{ font-weight:700; font-size:13px; color:var(--violet); }
.frg-add-x{ font-size:12.5px; color:var(--muted); }
.frg-add-in{ flex:1; min-width:200px; padding:9px 12px; border:1px solid var(--line-strong); border-radius:9px; background:var(--surface); color:var(--ink); font-size:13.5px; }

/* Aufgaben-Board (Trello-Stil) */
main.full .brd-wrap{ flex:1; min-height:0; display:flex; gap:12px; overflow-x:auto; overflow-y:hidden; padding:12px clamp(12px,2vw,20px); align-items:stretch; }
.brd-col{ flex:0 0 300px; width:300px; display:flex; flex-direction:column; min-height:0; background:var(--surface-2); border:1px solid var(--line); border-radius:12px; }
.brd-col-h{ flex:none; padding:10px 13px; font-weight:700; font-size:13px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); color:var(--ink); }
.brd-anz{ font-family:var(--mono); font-size:11px; color:var(--muted); background:var(--panel); border:1px solid var(--line); border-radius:999px; padding:1px 9px; }
.brd-col-b{ flex:1; min-height:0; overflow-y:auto; padding:9px; display:flex; flex-direction:column; gap:8px; }
.brd-card{ background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:9px 11px 8px; cursor:pointer; transition:box-shadow .12s,border-color .12s; }
.brd-card:hover{ border-color:var(--line-strong); box-shadow:0 3px 10px rgba(0,0,0,.10); }
.brd-card-top{ display:flex; align-items:center; justify-content:space-between; gap:6px; margin-bottom:5px; }
.brd-ref{ font-size:10.5px; color:var(--muted); font-family:var(--mono); }
.brd-typ{ font-size:9.5px; font-weight:800; color:#fff; padding:2px 8px; border-radius:999px; white-space:nowrap; }
.brd-titel{ font-size:13px; font-weight:600; color:var(--ink); line-height:1.3; }
.brd-meta{ display:flex; align-items:flex-end; justify-content:space-between; gap:8px; margin-top:6px; }
.brd-obj{ font-size:11px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.brd-prio{ display:inline-flex; gap:2px; align-items:flex-end; flex:none; }
.brd-prio i{ width:3px; border-radius:1px; display:inline-block; }
.brd-datum{ font-size:10.5px; color:var(--muted); margin-top:4px; font-variant-numeric:tabular-nums; }
.brd-mehr{ font-size:11px; color:var(--muted); text-align:center; padding:6px; }
.brd-leer{ font-size:12px; color:var(--muted); text-align:center; padding:14px; opacity:.6; }

/* Board: Zuweisung, Bilder, Historie, Drag&Drop */
.brd-foot{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:5px; font-size:10.5px; color:var(--muted); }
.brd-mit{ width:22px; height:22px; border-radius:50%; background:var(--violet); color:#fff; font-size:9.5px; font-weight:700; display:grid; place-items:center; flex:none; }
.brd-col-b.brd-drop{ outline:2px dashed var(--teal); outline-offset:-3px; background:color-mix(in srgb,var(--teal) 7%,transparent); border-radius:8px; }
.brd-card.brd-drag{ opacity:.5; }
.brd-card{ cursor:grab; } .brd-card:active{ cursor:grabbing; }
.brd-detail-card{ width:min(520px,100%); }
.brd-sec{ font-size:12px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; margin:16px 0 6px; padding-top:12px; border-top:1px solid var(--line); }
.brd-imgs{ display:flex; flex-wrap:wrap; gap:8px; margin-top:6px; }
.brd-imgs a{ display:block; }
.brd-imgs img{ width:84px; height:84px; object-fit:cover; border-radius:9px; border:1px solid var(--line); }
.brd-hist{ display:flex; flex-direction:column; gap:5px; }
.brd-hist-e{ font-size:12.5px; color:var(--ink-soft); padding:5px 0; border-bottom:1px solid var(--line); }
.brd-hist-e:last-child{ border-bottom:0; }
.brd-hist-z{ font-family:var(--mono); font-size:11px; color:var(--muted); margin-right:6px; }

/* HAN-Logo in Seitenleiste + Login */
.side .brand{ flex-direction:column; align-items:stretch; gap:0; }
.brand-logo{ background:#fff; border-radius:10px; padding:9px 12px; display:flex; box-shadow:0 1px 3px rgba(0,0,0,.07); }
.brand-logo img{ width:100%; height:auto; display:block; }
.brand-name{ font-weight:750; font-size:14.5px; color:var(--ink); margin-top:10px; }
.brand-name span{ color:var(--muted); font-weight:500; font-size:12px; }
.login-logo{ width:220px; max-width:82%; margin:0 auto 18px; padding:12px 16px; }

/* HAN-Marke kräftiger: Dreifarb-Streifen oben + Blau/Grün-Akzente */
main::before{ content:""; display:block; flex:none; height:4px; background:linear-gradient(90deg,#003D7C 0 33.34%,#009EE0 33.34% 66.67%,#5F9C1E 66.67% 100%); }
.side{ border-top:4px solid #009EE0; }
.ab-summe .ab-kachel{ border-left:3px solid var(--violet); }
.ab-summe .ab-kachel b{ color:var(--violet); }
.ab-summe .ab-kachel.ab-krank{ border-left-color:var(--crit); }
.ab-summe .ab-kachel.ab-krank b{ color:var(--crit); }
.ab-summe .ab-kachel.ab-urlaub{ border-left-color:#eab308; }
.fp-sticky, .ze-sticky{ background:linear-gradient(180deg,color-mix(in srgb,var(--violet) 6%,var(--surface)),var(--surface)); }
.card-h h3, .ep-title-t, .brd-sec{ color:var(--violet); }
.topbar h2{ color:var(--violet); }
.btn.primary{ box-shadow:0 2px 8px color-mix(in srgb,var(--violet) 26%,transparent); }

/* ---------- Qualitätsprüfung (Starter · Vorlagen · Berichte) ---------- */
.q-tabs{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;}
.q-tab{font:inherit;font-size:13.5px;font-weight:600;border:1px solid var(--line);background:var(--surface);color:var(--ink-soft);border-radius:9px;padding:8px 14px;cursor:pointer;}
.q-tab:hover{background:var(--surface-2);}
.q-tab.on{background:var(--violet);border-color:var(--violet);color:#fff;}
.q-start{max-width:720px;}
.q-start-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-top:6px;}
.q-start-grid label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.3px;}
.q-sel{font:inherit;font-size:14px;font-weight:400;text-transform:none;letter-spacing:0;color:var(--ink);padding:9px 11px;border:1px solid var(--line-strong);border-radius:9px;background:var(--panel);}
.btn.lg{padding:11px 20px;font-size:15px;}
.q-vhead{display:flex;align-items:center;gap:10px;margin-bottom:6px;flex-wrap:wrap;}
.q-vhead-act{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto;}
.q-vlist{display:flex;flex-direction:column;gap:10px;margin-top:10px;}
.q-vcard{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:11px;padding:12px 14px;background:var(--surface);}
.q-vcard-main{flex:1;min-width:0;}
.q-vname{font-weight:700;font-size:15px;color:var(--ink);}
.q-vcard-act{display:flex;gap:6px;}
.q-editor .q-ber{border:1px solid var(--line);border-radius:11px;margin-top:12px;overflow:hidden;background:var(--surface);}
.q-ber-h{display:flex;align-items:center;gap:6px;padding:10px 14px;background:var(--surface-2);border-bottom:1px solid var(--line);}
.q-ber-n{font-weight:700;font-size:14.5px;color:var(--teal);}
.q-pts{display:flex;flex-direction:column;gap:5px;padding:10px 14px;}
.q-pt{display:flex;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:7px 10px;}
.q-pt-t{flex:1;font-size:13.5px;color:var(--ink);}
.q-pt-x{border:0;background:var(--crit-soft);color:var(--crit);width:22px;height:22px;border-radius:6px;font-size:15px;line-height:1;cursor:pointer;}
.q-pt-x:hover{background:var(--crit);color:#fff;}
.q-addrow{display:flex;gap:8px;padding:8px 14px 12px;}
.q-inp{flex:1;font:inherit;font-size:13.5px;padding:8px 11px;border:1px solid var(--line-strong);border-radius:8px;background:var(--panel);color:var(--ink);}
.q-ber-new{background:transparent;border-style:dashed;}
.q-ber-new .q-addrow{padding:12px 14px;}

/* Qualitätsprüfung – Typ/Skala */
.q-typbadge{display:inline-block;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;
  background:var(--violet-soft);color:var(--violet);border-radius:6px;padding:2px 7px;margin-left:6px;vertical-align:middle;}
.q-meta-row{display:flex;gap:14px;flex-wrap:wrap;margin:8px 0 4px;}
.q-meta-row label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.3px;}

/* Prüfpunkt-Priorität im Vorlagen-Editor */
.q-pt-prio{font:inherit;font-size:12px;font-weight:700;border:1px solid var(--line-strong);border-radius:7px;padding:5px 8px;cursor:pointer;background:var(--panel);flex:none;}
.q-prio-niedrig{color:#16a34a;} .q-prio-mittel{color:#d97706;} .q-prio-hoch{color:#dc2626;}

/* Qualitäts-Mängel-Karte im Aufgaben-Board */
.qm-mlist{display:flex;flex-direction:column;gap:6px;}
.qm-mrow{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:8px 10px;background:var(--surface-2);border:1px solid var(--line);border-radius:8px;font-size:13px;}

/* Qualität: Basis-Format-Knöpfe + Priorität "Keine" */
.q-basis{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:6px 0 12px;padding:10px 12px;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;}
.q-prio-keine{color:#64748b;}

/* Qualität: eigener Skalen-Baukasten */
.q-skala{margin:2px 0 10px;padding:12px 14px;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;}
.q-sk-row{display:flex;align-items:center;gap:8px;margin-bottom:6px;}
.q-sk-col{width:40px;height:32px;padding:0;border:1px solid var(--line-strong);border-radius:7px;background:none;cursor:pointer;}
.q-sk-lab{flex:1;}

/* Qualität: Textblöcke im Editor */
.q-tx-row{display:flex;gap:8px;align-items:flex-start;margin-bottom:6px;}
.q-tx{flex:1;min-height:46px;resize:vertical;}

/* ---------- Reinigungs- & Pflegeplan ---------- */
.rp-ed{display:flex;flex-direction:column;height:100%;background:var(--surface);}
.rp-top{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line);background:var(--surface-2);flex:none;}
.rp-name{font:inherit;font-size:15px;font-weight:700;padding:8px 11px;border:1px solid var(--line-strong);border-radius:9px;background:var(--panel);color:var(--ink);min-width:260px;}
.rp-obj{min-width:240px;}
.rp-top2{display:flex;align-items:center;gap:10px;padding:8px 14px;border-bottom:1px solid var(--line);flex:none;}
.rp-komm{flex:1;font:inherit;font-size:13.5px;padding:8px 11px;border:1px solid var(--line-strong);border-radius:9px;background:var(--panel);color:var(--ink);}
.rp-grid-wrap{flex:1;overflow:auto;padding:0;}
.rp-grid{border-collapse:separate;border-spacing:0;width:max-content;min-width:100%;font-size:13px;}
.rp-grid th,.rp-grid td{border-bottom:1px solid var(--line);border-right:1px solid var(--line);padding:4px 8px;vertical-align:middle;background:var(--panel);}
.rp-grid thead th{position:sticky;top:0;z-index:3;background:var(--surface-2);font-size:11px;text-transform:uppercase;letter-spacing:.3px;color:var(--muted);}
.rp-aufg-h,.rp-grid td.rp-aufg{position:sticky;left:0;z-index:2;background:var(--panel);min-width:230px;max-width:300px;}
.rp-grid thead th.rp-aufg-h{z-index:4;}
.rp-bh{min-width:210px;}
.rp-bh-in{display:flex;align-items:center;gap:6px;justify-content:space-between;}
.rp-bh-act{display:flex;gap:2px;}
.rp-mini{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:13px;padding:2px 4px;border-radius:5px;}
.rp-mini:hover{background:var(--line);color:var(--ink);}
.rp-grp td{background:var(--brass-soft);}
.rp-grp-in{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.rp-grp-n{font-weight:700;color:var(--teal);font-size:14px;}
.rp-grp-act{display:flex;gap:6px;align-items:center;margin-left:auto;}
.rp-libsel{font:inherit;font-size:12.5px;padding:5px 8px;border:1px solid var(--line-strong);border-radius:7px;background:var(--panel);color:var(--ink);max-width:230px;}
.rp-aufg{font-weight:600;color:var(--ink);}
.rp-ic{font-size:15px;}
.rp-descr{min-width:150px;}
.rp-inp{width:100%;font:inherit;font-size:12.5px;padding:6px 8px;border:1px solid var(--line);border-radius:7px;background:var(--panel);color:var(--ink);}
.rp-cell{text-align:center;white-space:nowrap;}
.rp-cnt{display:block;font-size:10.5px;font-weight:700;color:var(--brass);min-height:13px;}
.rp-days{display:inline-flex;gap:2px;}
.rp-day{width:22px;height:22px;border:1px solid var(--line-strong);background:var(--panel);color:var(--muted);border-radius:5px;font-size:10px;font-weight:700;cursor:pointer;padding:0;line-height:1;}
.rp-day:hover{border-color:var(--violet);}
.rp-day.on{background:var(--brass);border-color:var(--brass);color:#fff;}

/* Reinigungsplan – Neu-Dialog + Formate */
.rp-neu{max-width:900px;}
.rp-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;}
.rp-card{text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:16px 16px 18px;cursor:pointer;transition:.12s;}
.rp-card:hover{border-color:var(--violet);box-shadow:var(--shadow);transform:translateY(-1px);}
.rp-card-ic{font-size:30px;margin-bottom:8px;}
.rp-card-t{font-weight:700;font-size:15px;color:var(--ink);margin-bottom:4px;}
.rp-card-d{font-size:12.5px;color:var(--muted);line-height:1.4;}
.rp-freqsel{font:inherit;font-size:12px;padding:5px 6px;border:1px solid var(--line-strong);border-radius:6px;background:var(--panel);color:var(--ink);max-width:120px;}
.rp-wday{width:30px;height:26px;font-size:13px;}

/* Reinigungsplan – Briefkopf im Editor + Zeile verschieben */
.rp-letter{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;padding:7px 16px;border-bottom:3px solid var(--teal);background:var(--panel);flex:none;}
.rp-letter-l{display:flex;gap:12px;align-items:flex-start;}
.rp-logo{height:32px;width:auto;}
.rp-firma{font-size:11px;color:var(--ink-soft);line-height:1.5;}
.rp-firma b{color:var(--teal);font-size:12.5px;}
.rp-letter-r{text-align:right;font-size:14px;color:var(--ink);line-height:1.4;}
.rp-move{display:inline-flex;flex-direction:column;gap:0;margin-right:2px;vertical-align:middle;}
.rp-move .rp-mini{padding:0 3px;font-size:9px;line-height:1.1;color:var(--muted);}
.rp-move .rp-mini:hover{color:var(--violet);background:transparent;}

/* Reinigungsplan – Zusatz-Intervalle hinter den Wochentagen */
.rp-ints{display:flex;flex-wrap:wrap;gap:3px;margin-top:4px;justify-content:center;}
.rp-int{width:auto !important;min-width:0;padding:0 7px;height:20px;font-size:9.5px;white-space:nowrap;}
.rp-int.on{background:var(--teal);border-color:var(--teal);color:#fff;}
.rp-bh{min-width:230px;}

/* Reinigungsplan – Aufgabe schmaler, Bemerkungen breiter + mehrzeilig */
.rp-aufg-h,.rp-grid td.rp-aufg{min-width:140px;max-width:190px;white-space:normal;line-height:1.25;}
.rp-descr{min-width:340px;}
.rp-grid td.rp-descr .rp-inp{min-height:42px;resize:vertical;font-family:inherit;line-height:1.35;}

/* Reinigungsplan – Spaltenbreiten nachjustiert (ausgewogener) */
.rp-aufg-h,.rp-grid td.rp-aufg{min-width:200px;max-width:240px;}
.rp-descr{min-width:250px;}

/* Reinigungsplan – Wochentage vs. längere Intervalle optisch trennen */
.rp-ints{border-top:1px dashed var(--line);padding-top:4px;margin-top:5px;}

/* Reinigungsplan – 4-Farben-System */
.rp-farbe{width:30px;min-width:30px;height:22px;border:1px solid var(--line-strong);border-radius:5px;cursor:pointer;font-size:0;color:transparent;padding:0;margin-right:5px;vertical-align:middle;-webkit-appearance:none;appearance:none;background:var(--panel);}
.rp-farbe option{font-size:12.5px;color:var(--ink);background:var(--panel);}
.rp-farbe.rp-f-rot{background:#dc2626;border-color:#dc2626;} .rp-farbe.rp-f-gelb{background:#eab308;border-color:#eab308;}
.rp-farbe.rp-f-gruen{background:#16a34a;border-color:#16a34a;} .rp-farbe.rp-f-blau{background:#2563eb;border-color:#2563eb;}
.rp-legend{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:5px 14px;font-size:12px;color:var(--ink-soft);background:var(--surface-2);border-bottom:1px solid var(--line);flex:none;}
.rp-lg{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:20px;background:var(--panel);border:1px solid var(--line);font-size:11.5px;}
.rp-lg::before{content:"";width:11px;height:11px;border-radius:3px;background:#ccc;display:inline-block;}
.rp-lg.rp-f-rot::before{background:#dc2626;} .rp-lg.rp-f-gelb::before{background:#eab308;}
.rp-lg.rp-f-gruen::before{background:#16a34a;} .rp-lg.rp-f-blau::before{background:#2563eb;}

/* Reinigungsplan – Wochenplan: eigene schmale Turnus-Spalte */
.rp-bh.rp-turnus-h{min-width:76px;}
.rp-grid td.rp-turnus{min-width:76px;}
.rp-ints2{display:flex;flex-direction:column;gap:3px;align-items:stretch;}
.rp-ints2 .rp-int{width:100% !important;height:19px;}

/* Reinigungsplan – kompaktes Turnus-Dropdown je Feld (statt extra Spalte/Buttons) */
.rp-turnus-sel{display:block;margin:4px auto 0;font-size:11px;padding:3px 6px;border:1px solid var(--line-strong);border-radius:6px;background:var(--panel);color:var(--ink-soft);max-width:160px;cursor:pointer;}

/* Reinigungsplan – Turnus-Spalte (nur das eine Dropdown, schmal) */
.rp-bh.rp-turnus-h{min-width:150px;}
.rp-grid td.rp-turnus{min-width:150px;text-align:center;}
.rp-grid td.rp-turnus .rp-turnus-sel{margin:0 auto;max-width:150px;}

/* Reinigungsplan – Bemerkungen-Spalte ein Drittel breiter */
.rp-descr{min-width:335px;}

/* Reinigungsplan – Tuch-Icon (Farbwahl) + editierbarer Aufgabenname */
.rp-farbe-wrap{position:relative;display:inline-block;vertical-align:middle;margin-right:4px;line-height:0;cursor:pointer;}
.rp-farbe-ov{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;}
.rp-aufg-inp{display:inline;border-radius:4px;padding:1px 4px;cursor:text;outline:none;}
.rp-aufg-inp:hover{background:var(--surface-2);}
.rp-aufg-inp:focus{background:var(--panel);box-shadow:0 0 0 1px var(--violet);}

/* Reinigungsplan – PDF-Ansicht als Fenster im Programm (kein separater Tab) */
.rp-pdf-ov{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:9999;display:flex;align-items:center;justify-content:center;padding:24px;}
.rp-pdf-box{background:var(--panel);width:min(1000px,96vw);height:92vh;border-radius:12px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 24px 70px rgba(0,0,0,.45);}
.rp-pdf-bar{display:flex;align-items:center;gap:12px;padding:10px 14px;background:var(--surface-2);border-bottom:1px solid var(--line);}
.rp-pdf-status{color:var(--muted);font-size:13px;}
.rp-pdf-body{flex:1;background:#525659;}
.rp-pdf-if{width:100%;height:100%;border:0;display:block;}

/* Linkes Menü ein-/ausklappen */
.topbar-left{display:flex;align-items:center;gap:12px;min-width:0;}
.nav-toggle{width:38px;height:38px;flex:none;border:1px solid var(--line);background:var(--panel);border-radius:9px;font-size:18px;line-height:1;cursor:pointer;color:var(--ink-soft);display:grid;place-items:center;}
.nav-toggle:hover{background:var(--surface-2);border-color:var(--violet);color:var(--violet);}
/* Eingeklappt: schmaler Streifen, nur Symbole */
.app.nav-collapsed{grid-template-columns:64px minmax(0,1fr);}
.app.nav-collapsed .side{overflow:hidden;}
.app.nav-collapsed .nav-txt,
.app.nav-collapsed .chev,
.app.nav-collapsed .nav-lab,
.app.nav-collapsed .nav-item .badge,
.app.nav-collapsed .brand-name,
.app.nav-collapsed .user-chip .un,
.app.nav-collapsed .user-chip .ur,
.app.nav-collapsed .user-chip .logout{display:none;}
.app.nav-collapsed .nav-item{justify-content:center;gap:0;padding-left:0!important;padding-right:0;}
.app.nav-collapsed .nav-item .ic{width:auto;font-size:17px;opacity:1;}
.app.nav-collapsed nav#nav{padding:0 6px;}
.app.nav-collapsed .brand{padding:14px 8px;align-items:center;}
.app.nav-collapsed .brand-logo{padding:6px;}
.app.nav-collapsed .side-foot{padding:12px 6px;display:flex;justify-content:center;}
.app.nav-collapsed .user-chip{justify-content:center;gap:0;}

/* ============================================================
   PREMIUM HAN DESIGN-EBENE — Farbverläufe · Glas · Effekte
   Nutzt vorhandene Bausteine -> passt sich jedem Farbthema an
   ============================================================ */
:root{
  --grad-brand:linear-gradient(135deg,var(--teal) 0%,var(--teal-2) 50%,var(--violet-2) 100%);
  --grad-hero:linear-gradient(140deg,var(--teal) 0%,var(--teal-2) 58%,var(--brass) 135%);
  --grad-green:linear-gradient(135deg,var(--teal-2),var(--brass));
  --glow:0 6px 22px color-mix(in srgb,var(--violet) 34%,transparent);
  --glow-strong:0 12px 30px color-mix(in srgb,var(--violet) 46%,transparent);
}
/* sanfte Übergänge auf interaktiven Elementen */
.btn,.nav-item,.tile,.card,.tsw,.nav-toggle,.q-sel,.user-chip .ua{
  transition:transform .18s cubic-bezier(.4,0,.2,1),box-shadow .2s ease,background .2s ease,filter .18s ease,border-color .18s ease,color .18s ease;
}
/* feiner Marken-Farbverlauf ganz oben über der App */
.app::before{content:"";position:fixed;top:0;left:0;right:0;height:3px;background:var(--grad-brand);z-index:200;}
/* Seitenleiste: zarter Verlauf + Marken-Trennlinie */
.side{background:linear-gradient(180deg,var(--surface),color-mix(in srgb,var(--teal) 4%,var(--surface)));}
.brand{position:relative;}
.brand::after{content:"";position:absolute;left:20px;right:20px;bottom:-1px;height:2px;border-radius:2px;background:var(--grad-brand);opacity:.75;}
.nav-item.active{background:var(--grad-brand);box-shadow:var(--glow);border-color:transparent;}
.nav-item.active .badge{background:rgba(255,255,255,.92);color:var(--teal);}
.user-chip .ua{background:var(--grad-brand);box-shadow:var(--glow);}
/* Kopfleiste: zarter Marken-Ton + Verlaufs-Titel */
.topbar{background:linear-gradient(180deg,color-mix(in srgb,var(--teal) 7%,var(--surface-2)),var(--surface-2));box-shadow:0 8px 20px -16px color-mix(in srgb,var(--teal) 55%,transparent);}
.topbar h2{background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;}
/* Knöpfe: Verlauf, Anheben, Glanz */
.btn.primary{background:var(--grad-brand);box-shadow:var(--glow);}
.btn.primary:hover{background:var(--grad-brand);filter:brightness(1.07) saturate(1.04);transform:translateY(-1px);box-shadow:var(--glow-strong);}
.btn.primary:active{transform:translateY(0);filter:brightness(.98);}
.btn.brass{background:var(--grad-green);box-shadow:0 6px 20px color-mix(in srgb,var(--brass) 30%,transparent);}
.btn.brass:hover{filter:brightness(1.06);transform:translateY(-1px);}
.btn.ghost:hover{border-color:var(--violet);color:var(--violet);}
/* Karten & Kacheln: edler Hover, Verlaufskante */
.card{transition:box-shadow .2s ease,transform .2s ease;}
.card:hover{box-shadow:var(--shadow-lg);}
.tile::after{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--grad-brand);opacity:0;transition:opacity .18s ease;}
.tile:hover::after{opacity:1;}
/* Hero-Karte (Maestro) mit Marken-Verlauf inkl. Grün + Glanz */
.maestro{background:var(--grad-hero);}
.maestro::after{content:"";position:absolute;inset:0;background:radial-gradient(600px 200px at 85% -20%,rgba(255,255,255,.18),transparent);pointer-events:none;}
/* Menü-Aufklapp-Knopf edel */
.nav-toggle:hover{border-color:transparent;color:#fff;background:var(--grad-brand);box-shadow:var(--glow);}
/* Auswahl-/Eingabefelder mit weicherem Rahmen */
.q-sel:focus,input:focus,select:focus,textarea:focus{outline:none;border-color:var(--violet)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--violet) 22%,transparent);}

/* ============================================================
   NEON-THEMA — dunkel, Glas, Neon-Röhren-Rahmen, 3D-Glow
   (Vorbild BOS 2.0 – Form bleibt, nur Stil/Leuchten/Verläufe)
   ============================================================ */
:root[data-theme="neon"]{
  --bg:#070B16;--surface:#0C1124;--surface-2:#121A38;--panel:#0E1530;
  --ink:#EAF2FF;--ink-soft:#C4D2EC;--muted:#7E93B6;--line:#22315C;--line-strong:#2E3F72;
  --brass:#2FE39B;--brass-soft:#08281C;
  --teal:#22D3EE;--teal-2:#38BDF8;--teal-soft:#082436;
  --violet:#B06CFF;--violet-2:#C88BFF;--violet-soft:#1A1140;
  --blue:#4C8DFF;--blue-soft:#0A1A38;
  --good:#2FE39B;--good-soft:#08281C;--warn:#F7B84B;--warn-soft:#2A2010;--crit:#FF5E86;--crit-soft:#2E0F1C;
  --shadow:0 1px 2px rgba(0,0,0,.5),0 12px 30px rgba(6,12,36,.55);
  --shadow-lg:0 2px 10px rgba(0,0,0,.6),0 26px 64px rgba(6,12,36,.65);
  color-scheme:dark;
}
:root[data-theme="neon"]{color-scheme:dark;}
[data-theme="neon"] body{
  background:
    radial-gradient(1100px 640px at 12% -6%,rgba(34,211,238,.12),transparent 58%),
    radial-gradient(1000px 620px at 102% 2%,rgba(176,108,255,.14),transparent 55%),
    radial-gradient(900px 700px at 60% 110%,rgba(47,227,155,.08),transparent 60%),
    var(--bg);
}
/* feiner leuchtender Marken-Streifen oben */
[data-theme="neon"] .app::before{box-shadow:0 0 14px rgba(34,211,238,.75);}
/* Seitenleiste + Kopf: dunkles Glas mit Neon-Kante */
[data-theme="neon"] .side{background:linear-gradient(180deg,rgba(12,18,40,.92),rgba(7,11,24,.92));border-right:1px solid rgba(56,189,248,.18);backdrop-filter:blur(8px);}
[data-theme="neon"] .topbar{background:linear-gradient(180deg,rgba(18,26,58,.55),rgba(10,15,36,.35));backdrop-filter:blur(16px) saturate(1.4);border-bottom:1px solid rgba(56,189,248,.18);box-shadow:0 10px 34px -16px rgba(34,211,238,.6);}
[data-theme="neon"] .topbar h2{text-shadow:0 0 26px rgba(56,189,248,.4);}
/* Karten & Kacheln: Glas + Neon-Röhren-Rahmen (Verlauf) + Glow */
[data-theme="neon"] .card,[data-theme="neon"] .tile{
  background:linear-gradient(160deg,rgba(20,28,60,.74),rgba(10,15,34,.80)) padding-box,
            linear-gradient(135deg,var(--teal) 0%,var(--violet) 60%,var(--brass) 120%) border-box;
  border:1px solid transparent;
  backdrop-filter:blur(11px) saturate(1.25);
  box-shadow:0 12px 36px rgba(2,6,20,.6),0 0 20px -6px rgba(34,211,238,.30);
}
[data-theme="neon"] .card:hover{box-shadow:0 14px 42px rgba(2,6,20,.7),0 0 28px -4px rgba(56,189,248,.5);}
[data-theme="neon"] .tile:hover{box-shadow:0 16px 44px rgba(2,6,20,.75),0 0 32px -2px rgba(56,189,248,.6);}
[data-theme="neon"] .tile .tv{text-shadow:0 0 18px color-mix(in srgb,var(--teal) 65%,transparent);}
[data-theme="neon"] .card-h{border-bottom:1px solid rgba(56,189,248,.16);}
[data-theme="neon"] .tile::after{opacity:0;} /* Verlaufsrahmen genügt */
/* Hero-Karte: dunkles Glas mit Neon-Rahmen + innerem Leuchten (wie Vorbild) */
[data-theme="neon"] .maestro{
  background:linear-gradient(150deg,rgba(22,30,68,.88),rgba(10,15,36,.92)) padding-box,
            linear-gradient(120deg,var(--teal),var(--violet) 65%,var(--brass)) border-box;
  border:1px solid transparent;
  box-shadow:0 16px 48px rgba(2,6,20,.7),0 0 50px -8px rgba(176,108,255,.5),inset 0 0 70px rgba(34,211,238,.08);
}
[data-theme="neon"] .maestro::after{background:radial-gradient(680px 260px at 82% -30%,rgba(176,108,255,.28),transparent 60%),radial-gradient(520px 220px at 10% 120%,rgba(34,211,238,.18),transparent 60%);}
/* Knöpfe & Menü: Neon-Glow */
[data-theme="neon"] .btn.primary{box-shadow:0 0 24px -4px rgba(34,211,238,.75),0 6px 20px rgba(2,6,20,.5);}
[data-theme="neon"] .btn.primary:hover{box-shadow:0 0 34px 0 rgba(56,189,248,.85);}
[data-theme="neon"] .btn.ghost{background:rgba(18,26,58,.5);}
[data-theme="neon"] .nav-item.active{box-shadow:0 0 22px -2px rgba(34,211,238,.65);}
[data-theme="neon"] .nav-item:hover{background:rgba(56,189,248,.09);}
/* Eingabefelder dunkel-glasig, Neon-Fokus */
[data-theme="neon"] input,[data-theme="neon"] select,[data-theme="neon"] textarea,[data-theme="neon"] .q-sel,[data-theme="neon"] .rp-inp{background:rgba(9,14,32,.6);border-color:rgba(56,189,248,.24);color:var(--ink);}
[data-theme="neon"] input:focus,[data-theme="neon"] select:focus,[data-theme="neon"] textarea:focus{box-shadow:0 0 0 3px rgba(34,211,238,.28),0 0 18px -4px rgba(34,211,238,.5);}
/* Fortschrittsbalken & Pills leuchten leicht */
[data-theme="neon"] .bar>i{box-shadow:0 0 12px rgba(34,211,238,.6);}
[data-theme="neon"] .pill{backdrop-filter:blur(6px);}
/* Theme-Auswahl: Neon-Kreis als Verlauf */
.tsw[data-t="neon"]{background:linear-gradient(135deg,#22D3EE,#B06CFF)!important;}

/* ---- KI-Gehirn (Clara türkis + Noa violett) ---- */
.brainpanel{position:relative;overflow:hidden;margin-top:16px;padding:16px 20px 18px;border-radius:16px;background:linear-gradient(160deg,#0c1330,#0a0f24);border:1px solid rgba(56,189,248,.22);box-shadow:0 14px 44px rgba(2,6,20,.5),0 0 46px -12px rgba(176,108,255,.4);}
.brainpanel::before{content:"";position:absolute;inset:0;background:radial-gradient(620px 240px at 50% -20%,rgba(176,108,255,.16),transparent 60%);pointer-events:none;}
.brain-title{position:relative;text-align:center;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:#8fb6d8;margin-bottom:8px;}
.brainwrap{position:relative;display:flex;align-items:center;justify-content:center;gap:26px;flex-wrap:wrap;}
.brain-center{display:flex;flex-direction:column;align-items:center;}
.brain-cap{margin-top:4px;font-size:11px;color:#7f93b4;text-align:center;}
.brainside{flex:1;min-width:170px;max-width:250px;text-align:center;}
.bs-badge{width:44px;height:44px;border-radius:50%;margin:0 auto 8px;display:grid;place-items:center;font-weight:800;font-size:19px;color:#04121c;background:var(--c);box-shadow:0 0 22px -1px var(--c);}
.bs-name{font-size:20px;font-weight:800;}
.bs-role{font-size:12.5px;color:#9db2d0;margin-top:4px;line-height:1.5;}
.brain-svg{width:320px;max-width:72vw;height:auto;filter:drop-shadow(0 0 12px rgba(56,189,248,.28));}
.brain-svg .el{stroke:#22D3EE;stroke-width:1.4;stroke-opacity:.6;}
.brain-svg .er{stroke:#B06CFF;stroke-width:1.4;stroke-opacity:.6;}
.brain-svg .bx{stroke:#93e9ff;stroke-width:1;stroke-opacity:.3;}
.brain-svg .brain-net{filter:drop-shadow(0 0 3px rgba(56,189,248,.45));}
.brain-svg .nl{fill:#38e0f5;}
.brain-svg .nr{fill:#c88bff;}
.brain-svg .bnc{fill:#eaf6ff;}
@media (prefers-reduced-motion:no-preference){
  .brain-svg .nl{filter:drop-shadow(0 0 5px #22D3EE);animation:bpulse 2.6s ease-in-out infinite;}
  .brain-svg .nr{filter:drop-shadow(0 0 5px #B06CFF);animation:bpulse 2.6s ease-in-out infinite;}
  .brain-svg .bnc{animation:bpulse 2.6s ease-in-out infinite;}
  .brainpanel::after{content:"";position:absolute;inset:0;background:radial-gradient(420px 170px at 50% 42%,rgba(34,211,238,.10),transparent 60%);animation:bbreath 4.2s ease-in-out infinite;pointer-events:none;}
}
@keyframes bpulse{0%,100%{opacity:.5;}50%{opacity:1;}}
@keyframes bbreath{0%,100%{opacity:.45;}50%{opacity:1;}}

/* ============================================================
   Cockpit kompakt · alles auf einen Blick (Kennzahlen · Gehirn · Live)
   ============================================================ */
.ckx{height:100%;display:flex;flex-direction:column;gap:12px;min-height:0;}
.ckx-top{padding:11px 18px!important;display:flex;align-items:center;gap:16px;flex:none;color:#fff;}
.ckx-top .avatar{width:44px;height:44px;font-size:18px;flex:none;}
.ckx-top .ckx-id{min-width:0;}
.ckx-top .who{font-weight:750;font-size:16.5px;color:#fff;line-height:1.1;}
.ckx-top .role{font-size:11px;opacity:.85;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ckx-top .ckx-dept{margin-left:auto;text-align:right;color:#fff;line-height:1.15;}
.ckx-top .ckx-dept .n{display:block;font-family:var(--mono);font-size:10px;opacity:.8;letter-spacing:.08em;text-transform:uppercase;}
.ckx-top .ckx-dept b{font-size:17px;}
.ckx-top .ckx-run{display:flex;align-items:center;gap:9px;flex:none;}

.ckx-body{flex:1;min-height:0;display:grid;grid-template-columns:minmax(196px,.92fr) 1.55fr minmax(250px,1.05fr);gap:12px;}
@media (max-width:1080px){.ckx-body{grid-template-columns:1fr 1fr;}.ckx-brain{grid-column:1/-1;order:-1;}}

.ckx-kpis{min-height:0;overflow:auto;display:grid;grid-template-columns:1fr 1fr;gap:9px;align-content:start;padding-right:2px;}
.kcell{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:9px 11px;cursor:pointer;box-shadow:var(--shadow);transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;}
.kcell:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:var(--line-strong);}
.kcell .kl{font-family:var(--mono);font-size:9px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.kcell .kdot{width:8px;height:8px;border-radius:2px;flex:none;box-shadow:0 0 8px currentColor;}
.kcell .kv{font-size:21px;font-weight:750;letter-spacing:-.02em;margin-top:3px;line-height:1.05;font-variant-numeric:tabular-nums;}
.kcell .ks{font-size:10.5px;color:var(--muted);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

.ckx-brain{min-height:0;margin-top:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:14px 16px;}
.ckx-brainrow{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;flex-wrap:nowrap;}
.ckx-brain .brain-svg{width:300px;max-width:40vw;flex:none;}
.ckx-brain .brainside{flex:none;min-width:96px;max-width:150px;}
.ckx-brain .bs-badge{width:40px;height:40px;font-size:17px;}
.ckx-brain .bs-name{font-size:17px;}
.ckx-brain .bs-role{font-size:11.5px;}

.ckx-live{min-height:0;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);overflow:hidden;}
.ckx-live .ckx-h{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 14px;border-bottom:1px solid var(--line);flex:none;}
.ckx-live .ckx-h h3{font-size:14px;}
.lvi-list{flex:1;min-height:0;overflow-y:auto;padding:4px 12px 8px;}
.lvi{display:flex;gap:9px;padding:8px 2px;border-bottom:1px solid var(--line);}
.lvi:last-child{border-bottom:0;}
.lvi-dot{width:9px;height:9px;border-radius:50%;margin-top:4px;flex:none;background:var(--muted);box-shadow:0 0 8px currentColor;}
.lvi-b{min-width:0;flex:1;}
.lvi-c{font-size:12.5px;line-height:1.45;}
.lvi-tm{font-family:var(--mono);font-size:10px;color:var(--muted);margin-top:2px;}
/* Neon-Feinschliff für Live + Kennzahlen */
[data-theme="neon"] .kcell{background:linear-gradient(160deg,rgba(20,28,60,.7),rgba(10,15,34,.78)) padding-box,linear-gradient(135deg,var(--teal),var(--violet)) border-box;border:1px solid transparent;box-shadow:0 8px 26px rgba(2,6,20,.55);}
[data-theme="neon"] .kcell .kv{text-shadow:0 0 14px color-mix(in srgb,var(--teal) 55%,transparent);}
[data-theme="neon"] .ckx-live{background:linear-gradient(160deg,rgba(18,26,56,.66),rgba(10,15,34,.74));border:1px solid rgba(56,189,248,.2);backdrop-filter:blur(10px);}

/* ---- Lebendiges KI-Gehirn: 3D, Windungen, Puls, atmendes Leuchten, Signale ---- */
.brain-svg{overflow:visible;}
.brain-svg .brain-outline{filter:drop-shadow(0 0 5px rgba(140,225,255,.55));}
.brain-svg .gy{fill:none;stroke-width:1.6;stroke-linecap:round;}
.brain-svg .gl{stroke:#3fe6f7;stroke-opacity:.72;filter:drop-shadow(0 0 3px rgba(56,224,245,.55));}
.brain-svg .gr{stroke:#c88bff;stroke-opacity:.72;filter:drop-shadow(0 0 3px rgba(200,139,255,.55));}
.brain-svg .nl{fill:#6ff2ff;filter:drop-shadow(0 0 5px #22D3EE);}
.brain-svg .nr{fill:#d7abff;filter:drop-shadow(0 0 5px #B06CFF);}
.brain-svg .bnc{fill:#eaf6ff;filter:drop-shadow(0 0 5px #bfefff);}
.brain-svg .sigpath{fill:none;stroke:none;}
.brain-svg .glint{filter:drop-shadow(0 0 6px currentColor);}
.brain-svg .gcy{fill:#8ff3ff;color:#22D3EE;}
.brain-svg .gvi{fill:#e0bcff;color:#B06CFF;}
.brain-svg .gout{fill:#c8f6ff;color:#5fe0ff;}
/* klickbare Hälften */
.brain-center{position:relative;}
.brain-half{position:absolute;top:6px;bottom:6px;width:48%;cursor:pointer;z-index:3;border-radius:16px;transition:background .22s ease;}
.bh-l{left:2%;} .bh-r{right:2%;}
.bh-l:hover{background:radial-gradient(circle at 62% 50%,rgba(34,211,238,.16),transparent 70%);}
.bh-r:hover{background:radial-gradient(circle at 38% 50%,rgba(176,108,255,.16),transparent 70%);}
.bs-click{cursor:pointer;border-radius:12px;padding:6px 4px;transition:background .2s ease,transform .2s ease;}
.bs-click:hover{transform:translateY(-2px);}
.brainside.bs-click:first-child:hover{background:radial-gradient(circle at 50% 30%,rgba(34,211,238,.14),transparent 70%);}
.brainside.bs-click:last-child:hover{background:radial-gradient(circle at 50% 30%,rgba(176,108,255,.14),transparent 70%);}
@media (prefers-reduced-motion:no-preference){
  .brain-svg{animation:brainBreath 4.2s ease-in-out infinite;}
  .brain-svg .nl,.brain-svg .nr,.brain-svg .bnc{animation:bpulse 2.6s ease-in-out infinite;}
  .brain-svg .gyri{animation:gyriBreath 4.2s ease-in-out infinite;}
  .brain-svg .glint{animation:glintFade 2.6s ease-in-out infinite;}
}
@keyframes brainBreath{
  0%,100%{filter:drop-shadow(0 0 8px rgba(56,189,248,.32)) drop-shadow(0 0 18px rgba(176,108,255,.18));}
  50%{filter:drop-shadow(0 0 20px rgba(56,189,248,.7)) drop-shadow(0 0 42px rgba(176,108,255,.5));}
}
@keyframes gyriBreath{0%,100%{opacity:.72;}50%{opacity:1;}}
@keyframes glintFade{0%,100%{opacity:.15;}50%{opacity:1;}}

/* ---- Größeres Gehirn + leuchtende pulsierende Verbindungen (innen & nach außen) ---- */
.ckx-brain .brain-svg{width:360px;max-width:46vw;}
.ckx-brain .brainside{min-width:88px;max-width:132px;}
/* innere Synapsen-Verbindungen: leuchten, pulsieren, fließen */
.brain-svg .brainnet line{stroke-width:1.3;stroke-opacity:.55;stroke-dasharray:3 6;stroke-linecap:round;}
.brain-svg .netl{stroke:#22D3EE;color:#22D3EE;filter:drop-shadow(0 0 3px #22D3EE);}
.brain-svg .netr{stroke:#B06CFF;color:#B06CFF;filter:drop-shadow(0 0 3px #B06CFF);}
.brain-svg .netc{stroke:#9fe9ff;color:#9fe9ff;filter:drop-shadow(0 0 3px #9fe9ff);}
@media (prefers-reduced-motion:no-preference){
  .brain-svg .brainnet line{animation:netflow 1.9s linear infinite, netpulse 2.8s ease-in-out infinite;}
}
/* Verbindungen vom Gehirn zu den Nachbar-Spalten (über den Karten) */
.ckx-body{position:relative;}
.ckx-kpis,.ckx-brain,.ckx-live{position:relative;z-index:1;}
.ckx-net{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:4;overflow:visible;}
.ckx-net .netline{fill:none;stroke-width:2;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-dasharray:5 11;opacity:.5;}
.ckx-net .nl-l{stroke:#22D3EE;filter:drop-shadow(0 0 5px #22D3EE);}
.ckx-net .nl-r{stroke:#B06CFF;filter:drop-shadow(0 0 5px #B06CFF);}
@media (prefers-reduced-motion:no-preference){
  .ckx-net .netline{animation:netflow 1.7s linear infinite, netpulse 3s ease-in-out infinite;}
}
@keyframes netflow{to{stroke-dashoffset:-32;}}
@keyframes netpulse{0%,100%{opacity:.22;}50%{opacity:.7;}}
/* Atmen etwas kräftiger */
@keyframes brainBreath{
  0%,100%{filter:drop-shadow(0 0 8px rgba(56,189,248,.3)) drop-shadow(0 0 16px rgba(176,108,255,.16));}
  50%{filter:drop-shadow(0 0 24px rgba(56,189,248,.85)) drop-shadow(0 0 50px rgba(176,108,255,.6));}
}

/* Feinschliff: Gehirn groß, aber ohne die Clara/Noa-Schilder zu überlappen */
.ckx-body{grid-template-columns:minmax(178px,.8fr) 1.95fr minmax(232px,.98fr);}
.ckx-brainrow{gap:6px;}
.ckx-brain .brain-center{flex:1 1 auto;min-width:0;display:flex;justify-content:center;}
.ckx-brain .brain-svg{width:100%;max-width:360px;}
.ckx-brain .brainside{flex:none;min-width:78px;max-width:120px;position:relative;z-index:2;}
.ckx-brain .bs-role{font-size:11px;}

/* Wandernde Signal-Punkte auf den äußeren Verbindungen */
.ckx-net .oglint{filter:drop-shadow(0 0 7px currentColor);}
.ckx-net .oglint.gcy{fill:#9ff4ff;color:#22D3EE;}
.ckx-net .oglint.gvi{fill:#e4c4ff;color:#B06CFF;}

/* Kometen-Kopf heller, Hover-Hervorhebung der Verbindung, Aufblitzen neuer Live-Einträge */
.ckx-net .oglint.head{filter:drop-shadow(0 0 4px #fff) drop-shadow(0 0 9px currentColor);}
.ckx-net .netline.hot{stroke-width:3.4;opacity:1!important;filter:drop-shadow(0 0 10px currentColor) drop-shadow(0 0 4px #fff);}
.lvi-flash{animation:lviFlash 1.1s ease-out 1;border-radius:8px;}
@keyframes lviFlash{
  0%{background:color-mix(in srgb,var(--teal) 42%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--teal) 55%,transparent),0 0 16px -4px var(--teal);}
  100%{background:transparent;box-shadow:none;}
}

/* ---- Gehirn-Kachel passt sich dem Thema an (hell/dunkel) ---- */
.brainpanel{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);}
.brain-title{color:var(--muted);}
.brain-cap{color:var(--muted);}
.bs-role{color:var(--ink-soft);}
/* Namen: auf hellen Themen kräftiger (Kontrast), auf dunklen leuchtend */
.bs-name.bs-clara{color:#0891b2;}
.bs-name.bs-noa{color:#7c3aed;}
/* dunkle & Neon-Themen: edles dunkles Glas + Neon-Rahmen + helle Akzentnamen */
:root[data-theme="neon"] .brainpanel,
:root[data-theme="dark"] .brainpanel,
:root[data-theme="nachtblau"] .brainpanel,
:root[data-theme="schiefer"] .brainpanel{
  background:linear-gradient(160deg,color-mix(in srgb,var(--teal) 9%,var(--surface)),var(--surface));
  border:1px solid color-mix(in srgb,var(--teal) 26%,var(--line));
  box-shadow:0 14px 44px rgba(2,6,20,.4),0 0 40px -14px color-mix(in srgb,var(--violet) 60%,transparent);
}
:root[data-theme="neon"] .bs-clara,:root[data-theme="dark"] .bs-clara,
:root[data-theme="nachtblau"] .bs-clara,:root[data-theme="schiefer"] .bs-clara{color:#5FE6FF;}
:root[data-theme="neon"] .bs-noa,:root[data-theme="dark"] .bs-noa,
:root[data-theme="nachtblau"] .bs-noa,:root[data-theme="schiefer"] .bs-noa{color:#C88BFF;}
/* auf hellen Themen den Innen-Glanz/Weiß-Highlight des Gehirns zurücknehmen */
:root[data-theme="light"] .brainpanel::before,:root[data-theme="papier"] .brainpanel::before,
:root[data-theme="light"] .brainpanel::after,:root[data-theme="papier"] .brainpanel::after{opacity:.25;}

/* ---- System-Einstellungen (Status/Sicherung/Sicherheit/Protokoll) ---- */
.sys-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;}
.sys-kpi{background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:12px 14px;}
.sys-kpi.ok{border-color:color-mix(in srgb,var(--good) 45%,var(--line));}
.sys-kpi .sk-l{font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);}
.sys-kpi .sk-v{font-size:20px;font-weight:750;margin-top:3px;}
.sys-kpi.ok .sk-v{color:var(--good);}
.sys-kpi .sk-s{font-size:11.5px;color:var(--muted);margin-top:1px;}
.drow-wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0 26px;}
.drow{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line);font-size:13.5px;}
.drow .dl{color:var(--muted);} .drow .dv{font-weight:650;}
.sys-form{max-width:420px;}
.sys-form label{display:block;font-size:12px;font-weight:600;color:var(--ink-soft);margin:10px 0 5px;}
.sys-form input{width:100%;padding:10px 12px;border:1px solid var(--line-strong);border-radius:9px;background:var(--panel);color:var(--ink);font-size:14px;}

/* ============================================================
   E-MAIL-MODUL
   ============================================================ */
.mail-root{height:100%;min-height:0;flex:1 1 auto;min-width:0;width:100%;}
.mail-loading,.mail-empty{padding:24px;color:var(--muted);font-size:14px;}
.mail-setup{max-width:640px;margin:18px auto;}
.mail-form label{display:block;font-size:12px;font-weight:600;color:var(--ink-soft);margin:12px 0 5px;}
.mail-form input,.mail-form textarea{width:100%;padding:10px 12px;border:1px solid var(--line-strong);border-radius:9px;background:var(--panel);color:var(--ink);font-size:14px;font-family:inherit;}
.mail-form-row{display:flex;gap:12px;}
.mail-form-row>div{flex:1;}
.mail-form-row .mail-port{flex:0 0 100px;max-width:100px;}

/* 3-Spalten-Client */
.mailc{display:grid;grid-template-columns:230px 340px 1fr;height:100%;min-height:0;transition:grid-template-columns .18s ease;}
.mailc.side-collapsed{grid-template-columns:0 340px 1fr;}
.mailc.side-collapsed .mailc-side{width:0;min-width:0;overflow:hidden;border:0;opacity:0;pointer-events:none;}
.mailc-side{border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0;min-width:0;background:var(--surface);}
.mailc-accts{padding:8px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:2px;}
.mailc-allbtn{padding:9px 10px;border-radius:8px;cursor:pointer;font-weight:700;font-size:13.5px;color:var(--ink);display:flex;align-items:center;gap:6px;}
.mailc-allbtn:hover{background:var(--surface-2);}
.mailc-allbtn.on{background:var(--violet);color:#fff;}
.mailc-acctrow{padding:8px 10px;border-radius:8px;cursor:pointer;font-size:13px;color:var(--ink-soft);display:flex;align-items:center;gap:8px;white-space:nowrap;overflow:hidden;}
.mailc-acctrow:hover{background:var(--surface-2);}
.mailc-acctrow.on{background:var(--violet-soft);color:var(--ink);font-weight:600;}
.acct-dot{width:10px;height:10px;border-radius:50%;flex:none;}
.acct-name{overflow:hidden;text-overflow:ellipsis;}
.mailc-addacct{padding:7px 10px;border-radius:8px;cursor:pointer;font-size:12.5px;color:var(--violet);border:1px dashed var(--line-strong);margin-top:4px;text-align:center;}
.mailc-addacct:hover{background:var(--violet-soft);}
.mi-acct{display:inline-block;padding:1px 7px;border-radius:6px;color:#fff;font-size:10.5px;font-weight:700;margin-right:6px;vertical-align:middle;}
.mail-comp-from{display:flex;align-items:center;gap:8px;}
.mail-comp-from label{font-size:13px;color:var(--ink-soft);flex:none;}
.mail-comp-from select{flex:1;padding:8px 10px;border:1px solid var(--line-strong);border-radius:8px;background:var(--panel);color:var(--ink);font-size:13.5px;}
.mailc-listcol{border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0;background:var(--surface);}
.mailc-listbar{flex:none;display:flex;align-items:center;gap:8px;padding:8px 10px;border-bottom:1px solid var(--line);background:var(--surface-2);}
.mailc-toggle{flex:none;width:32px;height:32px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--ink);font-size:15px;cursor:pointer;line-height:1;}
.mailc-toggle:hover{border-color:var(--violet);color:var(--violet);}
.mailc-listtitle{flex:1;font-weight:700;font-size:13.5px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.mailc-newmini{flex:none;}
.mailc-acct{padding:14px;font-weight:650;font-size:13px;border-bottom:1px solid var(--line);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.mailc-new{margin:12px;}
.mailc-folders{flex:1;overflow:auto;padding:4px 8px;}
.mail-folder{padding:8px 10px;border-radius:8px;cursor:pointer;font-size:13.5px;color:var(--ink-soft);}
.mail-folder:hover{background:var(--surface-2);}
.mail-folder.on{background:var(--violet);color:#fff;font-weight:600;}
.mailc-cfg{margin:8px 12px;}
.mailc-search{flex:none;padding:8px 10px;border-bottom:1px solid var(--line);background:var(--surface);position:relative;}
.mailc-search input{width:100%;padding:8px 30px 8px 11px;border:1px solid var(--line-strong);border-radius:8px;background:var(--panel);color:var(--ink);font-size:13.5px;}
.mailc-search input:focus{outline:none;border-color:var(--violet);}
.mail-search-x{position:absolute;right:18px;top:50%;transform:translateY(-50%);width:22px;height:22px;border:0;border-radius:6px;background:var(--surface-2);color:var(--ink-soft);cursor:pointer;font-size:12px;line-height:1;}
.mail-search-x:hover{background:var(--violet);color:#fff;}
.mailc-list{flex:1;overflow-y:auto;overflow-x:hidden;min-height:0;background:var(--surface);}
/* Auswahl-Leiste (Mehrfachauswahl) */
.mail-selbar{flex:none;display:flex;align-items:center;gap:6px;padding:7px 10px;border-bottom:1px solid var(--line);background:var(--violet-soft);flex-wrap:wrap;}
.msel-count{font-weight:700;font-size:13px;margin-right:2px;}
.msel-sp{flex:1;}
.mail-selbar .btn{padding:5px 9px;}
.msel-del:hover{color:#dc2626;border-color:#dc2626;}
.msel-folders{display:flex;flex-direction:column;gap:6px;margin:12px 0;max-height:340px;overflow:auto;}
.msel-folders .btn{justify-content:flex-start;width:100%;}
.mail-foot{padding:2px;}
.mail-more{margin:8px 12px;padding:9px;text-align:center;border:1px dashed var(--line-strong);border-radius:8px;color:var(--violet);font-size:13px;font-weight:600;cursor:pointer;}
.mail-more:hover{background:var(--violet-soft);}
.mail-allloaded{padding:12px;text-align:center;color:var(--muted);font-size:12px;}
.mail-item{display:flex;align-items:flex-start;gap:0;padding:11px 14px;border-bottom:1px solid var(--line);cursor:pointer;position:relative;background:var(--surface);will-change:transform;}
.mail-item:hover{background:var(--surface-2);}
.mi-mark{flex:none;width:0;overflow:hidden;color:var(--good);font-weight:800;font-size:15px;margin-top:1px;white-space:nowrap;transition:width .12s ease;}
.mail-item.checked .mi-mark{width:22px;}
.mi-body{flex:1;min-width:0;}
.mail-item.sel{background:var(--violet-soft);}
.mail-item.checked{background:rgba(0,158,224,.12);}
.mail-item.unread .mi-from,.mail-item.unread .mi-subj{font-weight:750;}
.mail-item.unread{border-left:3px solid var(--violet);}
.mail-item.pinned{background:rgba(219,158,0,.09);}
.mail-item.swiping{z-index:2;cursor:grabbing;user-select:none;box-shadow:0 3px 12px rgba(0,0,0,.14);background:var(--surface);}
#mail-items{position:relative;}
.mail-swbg{position:absolute;left:0;right:0;display:flex;align-items:center;padding:0 20px;font-weight:800;font-size:14px;color:#fff;z-index:1;box-sizing:border-box;}
.mail-swbg.arch{background:#5F9C1E;justify-content:flex-start;}
.mail-swbg.del{background:#dc2626;justify-content:flex-end;}
.mi-pin{margin-right:4px;font-size:12px;}
.mail-pindiv{padding:4px 14px;font-size:11px;color:var(--muted);background:var(--surface-2);border-bottom:1px solid var(--line);letter-spacing:.02em;}
.mr-pin-btn.on{background:#db9e00;border-color:#db9e00;color:#fff;}
/* Verschieben-Menü im Leser */
.mr-movewrap{position:relative;display:inline-block;}
.mr-movemenu{position:absolute;top:100%;left:0;margin-top:4px;background:var(--panel);border:1px solid var(--line-strong);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.2);z-index:20;min-width:190px;max-height:320px;overflow:auto;padding:4px;}
.mr-moveitem{padding:8px 10px;border-radius:6px;cursor:pointer;font-size:13px;color:var(--ink);}
.mr-moveitem:hover{background:var(--surface-2);}
.mr-moveitem.muted{color:var(--muted);cursor:default;}
.mr-del:hover{color:#dc2626;border-color:#dc2626;}
/* Rechtsklick-Menü */
.mail-ctx{position:fixed;z-index:10000;background:var(--panel);border:1px solid var(--line-strong);border-radius:10px;box-shadow:0 12px 34px rgba(0,0,0,.28);padding:5px;min-width:210px;}
.mctx-head{padding:6px 12px 8px;font-size:12px;font-weight:700;color:var(--muted);border-bottom:1px solid var(--line);margin-bottom:4px;}
.mctx-item{padding:9px 12px;border-radius:7px;cursor:pointer;font-size:13.5px;color:var(--ink);white-space:nowrap;}
.mctx-item:hover{background:var(--surface-2);}
.mctx-item.danger:hover{background:#dc2626;color:#fff;}
.mctx-sep{height:1px;background:var(--line);margin:5px 0;}
.mi-top{display:flex;justify-content:space-between;gap:8px;align-items:baseline;}
.mi-from{font-size:13.5px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.mi-date{font-size:11.5px;color:var(--muted);flex:none;}
.mi-subj{font-size:12.5px;color:var(--ink-soft);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.mailc-read{display:flex;flex-direction:column;min-height:0;overflow-y:auto;background:var(--panel);}
.mail-read-head{padding:16px 20px;border-bottom:1px solid var(--line);flex:none;position:sticky;top:0;background:var(--panel);z-index:2;}
.mr-subj{font-size:18px;font-weight:750;margin-bottom:8px;}
.mr-meta{font-size:12.5px;color:var(--ink-soft);line-height:1.6;}
.mr-date{color:var(--muted);margin-top:2px;}
.mail-read-actions{margin-top:12px;display:flex;gap:8px;}
.mail-atts{margin-top:12px;display:flex;flex-wrap:wrap;gap:8px;}
.mail-att{display:inline-flex;align-items:center;gap:4px;background:var(--surface-2);border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:12.5px;color:var(--ink);}
.mail-att:hover{border-color:var(--violet);}
.mail-att-open,.mail-att-name{text-decoration:none;color:var(--ink);cursor:pointer;}
.mail-att-name{cursor:default;}
.mail-att-open:hover{color:var(--violet);text-decoration:underline;}
.mail-att-dl{margin-left:8px;padding-left:8px;border-left:1px solid var(--line);text-decoration:none;color:var(--ink-soft);font-size:14px;}
.mail-att-dl:hover{color:var(--violet);}
.mail-body{width:100%;border:0;background:#fff;display:block;min-height:300px;}

/* Verfassen-Fenster (großes Popup) */
.mail-comp-ov{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:9999;display:flex;align-items:center;justify-content:center;padding:24px;}
.mail-comp{position:relative;background:var(--panel);width:min(1000px,96vw);height:min(90vh,900px);border-radius:14px;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.4);overflow:hidden;}
.mail-comp-h{padding:12px 16px;background:var(--violet);color:#fff;font-weight:700;display:flex;justify-content:space-between;align-items:center;flex:none;}
.mail-comp-x{background:none;border:0;color:#fff;font-size:18px;cursor:pointer;}
.mail-comp-b{flex:1;padding:12px 16px;display:flex;flex-direction:column;gap:8px;overflow:auto;min-height:0;}
.mail-comp-b input,.mail-comp-b textarea{width:100%;padding:9px 11px;border:1px solid var(--line-strong);border-radius:8px;background:var(--panel);color:var(--ink);font-size:14px;font-family:inherit;}
.mail-comp-b input{flex:none;}
.mail-comp-b textarea{flex:1;min-height:260px;resize:vertical;line-height:1.5;}
.mail-comp-editor{flex:1;min-height:280px;overflow:auto;padding:12px 14px;border:1px solid var(--line-strong);border-radius:8px;background:var(--panel);color:var(--ink);font-size:14px;line-height:1.55;}
.mail-comp-editor:focus{outline:none;border-color:var(--violet);}
.mail-comp-editor .csig{margin-top:4px;color:var(--ink);}
.mail-comp-editor .csig-logo{max-width:220px;height:auto;display:block;margin-top:8px;}
.mail-comp-editor .cquote{margin-top:12px;padding-left:12px;border-left:3px solid var(--line-strong);color:var(--ink-soft);}
.csig-logo{max-width:220px;height:auto;}
.mail-comp-logo{flex:none;display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:8px 10px;border:1px dashed var(--line-strong);border-radius:8px;background:var(--surface);}
.mail-comp-logo .mcl-lbl{font-size:12.5px;color:var(--ink-soft);}
.mail-comp-logo img{max-height:60px;max-width:200px;object-fit:contain;background:#fff;border:1px solid var(--line);border-radius:6px;padding:4px;}
.mail-comp-logo.nologo{border-color:var(--line);}
.mail-comp-foot{flex:none;display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-top:2px;}
.mail-attbtn{cursor:pointer;}
/* KI-Hilfe-Leiste im Schreibfenster */
.mail-ai-bar{flex:none;display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--violet);border-radius:8px;background:var(--violet-soft);}
.mail-ai-bar input{flex:1;padding:8px 10px;border:1px solid var(--line-strong);border-radius:8px;background:var(--panel);color:var(--ink);font-size:13.5px;}
.mail-ai-bar input:focus{outline:none;border-color:var(--violet);}
.mail-ai-mic{flex:none;width:38px;height:36px;border:1px solid var(--line-strong);border-radius:8px;background:var(--panel);cursor:pointer;font-size:16px;line-height:1;}
.mail-ai-mic:hover{border-color:var(--violet);}
.mail-ai-mic.rec{background:#dc2626;border-color:#dc2626;color:#fff;animation:aiMicPulse 1s ease-in-out infinite;}
@keyframes aiMicPulse{0%,100%{box-shadow:0 0 0 0 rgba(220,38,38,.5)}50%{box-shadow:0 0 0 6px rgba(220,38,38,0)}}
/* Wichtigkeit + Erledigt in der Liste */
.mi-prio{margin-right:4px;font-size:12px;}
.mi-prio.high{color:#dc2626;}
.mi-prio.low{color:var(--muted);}
.mail-item.prio-high{border-left:3px solid #dc2626;}
.mi-done{color:var(--good);font-weight:800;margin-right:4px;}
.mail-item.done{opacity:.72;}
.mail-item.done .mi-subj{text-decoration:line-through;text-decoration-color:var(--muted);}
.mr-prio{display:inline-block;font-size:12px;font-weight:700;padding:1px 7px;border-radius:6px;vertical-align:middle;margin-right:6px;}
.mr-prio.high{background:#dc2626;color:#fff;}
.mr-prio.low{background:var(--surface-2);color:var(--ink-soft);}
.mr-done-btn.on{background:var(--good);border-color:var(--good);color:#fff;}
/* Signatur-Logo */
.mail-logo-box{border:1px solid var(--line);border-radius:10px;padding:12px;background:var(--surface);display:flex;flex-direction:column;gap:10px;}
.mail-logo-prev{max-width:220px;max-height:110px;object-fit:contain;border:1px solid var(--line);border-radius:8px;padding:6px;background:#fff;align-self:flex-start;}
.mail-logo-btns{display:flex;gap:8px;flex-wrap:wrap;}
.mail-logo-up{cursor:pointer;}
.mail-logo-hint{font-size:12px;line-height:1.5;}
/* Nachfrage beim Schließen */
.mcc{position:absolute;inset:0;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;z-index:5;}
.mcc-box{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px 24px;max-width:420px;text-align:center;box-shadow:0 20px 50px rgba(0,0,0,.35);}
.mcc-t{font-weight:750;font-size:16px;margin-bottom:6px;color:var(--ink);}
.mcc-s{font-size:13.5px;color:var(--ink-soft);margin-bottom:16px;}
.mcc-btns{display:flex;flex-direction:column;gap:8px;}
.mcc-btns .btn{width:100%;justify-content:center;}
@media (max-width:1000px){.mailc{grid-template-columns:1fr;}.mailc-side,.mailc-listcol{display:none;}}
/* Neon-Feinschliff */
[data-theme="neon"] .mailc-side,[data-theme="neon"] .mailc-listcol{background:linear-gradient(180deg,rgba(18,26,56,.5),rgba(10,15,34,.6));}
[data-theme="neon"] .mailc-listbar{background:rgba(10,15,34,.6);}
[data-theme="neon"] .mail-body{background:#fff;}