/* SEA Suite – Stile aus v7 + v8-Ergänzungen am Ende.
   Alle Farben der Themes stehen nur hier in .th-dark / .th-light (Klasse am <html>, gesetzt von applyTheme in app.js).
   --p4t/--p6t: Textfarbe für Prio 4 und 6 (Hellgelb/Weiß brauchen im hellen Theme eine dunkle Variante);
   --viz-*: Diagrammfarben, geprüfte Palette (dataviz-Validator, beide Themes), bewusst nicht die Prioritätsfarben;
   --mark/--logo-bg: Bildmarke und Logo-Fläche (in beiden Themes gleich); --onfill: Schrift/Knopf auf Farbflächen */
body{margin:0}
.th-dark{--done:#2fbf83;--donefg:#0d0f14;--bg:#0d0f14;--card:#161a22;--hi:#1d222c;--line:#2a303c;--text:#eef0f4;--muted:#a0a8b8;--brand:#ff6670;--btn:#e30613;--btnfg:#fff;--p1:#ff6b6b;--p2:#ff9a52;--p3:#f5c04a;--p4:#f9dc8a;--p5:#3ddc97;--p6:#ffffff;--p1bg:rgba(255,107,107,.15);--p2bg:rgba(255,154,82,.15);--p3bg:rgba(245,192,74,.15);--p4bg:rgba(249,220,138,.13);--p5bg:rgba(61,220,151,.13);--p6bg:rgba(255,255,255,.12);--p4t:#f9dc8a;--p6t:#ffffff;--scrim:rgba(0,0,0,.55);--toast:#eef0f4;--toastfg:#12151b;--sel:rgba(255,102,112,.09);--warn:#f5c04a;--logo:#fff;--viz-new:#3987e5;--viz-done:#199e70;--mark:#e30613;--logo-bg:#12151b;--onfill:#fff;color-scheme:dark}
.th-light{--done:#0e7a52;--donefg:#ffffff;--bg:#f3f4f7;--card:#ffffff;--hi:#f5f6f9;--line:#e1e4ea;--text:#12151b;--muted:#5b6272;--brand:#c4040f;--btn:#d10511;--btnfg:#fff;--p1:#c42a1e;--p2:#b9430a;--p3:#8a5f00;--p4:#e9bf3c;--p5:#0e7259;--p6:#ffffff;--p1bg:#fdeceb;--p2bg:#fdf0e7;--p3bg:#fbf3df;--p4bg:#fdf8e6;--p5bg:#e5f4ef;--p6bg:#eef0f4;--p4t:#8a6d1a;--p6t:#4b5563;--scrim:rgba(16,24,40,.32);--toast:#12151b;--toastfg:#fff;--sel:#fdf1f2;--warn:#8a5f00;--logo:#12151b;--viz-new:#2a78d6;--viz-done:#1baf7a;--mark:#e30613;--logo-bg:#12151b;--onfill:#fff;color-scheme:light}
html{background:var(--bg)}
.root{background:var(--bg);color:var(--text);font-family:'Plus Jakarta Sans',system-ui,sans-serif;font-size:14px;line-height:1.45;min-height:100vh}
.root *{box-sizing:border-box}
.root button,.root select,.root input{font:inherit;color:inherit}
.root button{cursor:pointer}
.root a{color:inherit;text-decoration:none}
.root :focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.sr,.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.i{width:18px;height:18px;flex:none}
.i-sm{width:14px;height:14px;flex:none}
.app{display:flex;flex-wrap:wrap;min-height:100vh}
.side{flex:1 1 220px;max-width:236px;background:var(--card);border-right:1px solid var(--line);padding:18px 12px;display:flex;flex-direction:column;gap:2px}
.col{flex:999 1 560px;min-width:0;display:flex;flex-direction:column}
.brand{display:flex;align-items:center;gap:10px;padding:2px 10px 18px}
.mark{display:flex;align-items:flex-end;gap:3px;height:24px}
.mark i{display:block;width:7px;background:var(--mark);border-radius:1px}
.wm{display:flex;flex-direction:column;line-height:1;color:var(--logo)}
.wm b{font-size:17px;font-weight:800;letter-spacing:.02em}
.wm span{font-size:11px;font-weight:600;letter-spacing:.18em}
.ed-badge{font-size:10px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--brand);border:1px solid var(--brand);border-radius:6px;padding:2px 6px;margin-left:auto}
.nav-item{display:flex;align-items:center;gap:11px;width:100%;border:0;background:none;padding:10px 12px;border-radius:10px;color:var(--muted);font-weight:600;text-align:left;min-height:42px}
.nav-item:hover{background:var(--hi);color:var(--text)}
.nav-item.on{background:var(--hi);color:var(--text);box-shadow:inset 3px 0 0 var(--brand)}
.nav-item .lbl{flex:1}
.nav-badge{font-size:11px;font-weight:800;min-width:22px;height:20px;padding:0 6px;border-radius:999px;background:var(--p1bg);color:var(--p1);display:inline-grid;place-items:center}
.lock{color:var(--muted);display:inline-flex}
.nav-label{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);padding:16px 12px 6px}
.spacer{flex:1;min-height:16px}
.user{display:flex;align-items:center;gap:10px;border:0;background:none;padding:10px;border-radius:12px;text-align:left}
.user:hover{background:var(--hi)}
.me{width:36px;height:36px;border-radius:10px;background:var(--btn);color:var(--btnfg);display:grid;place-items:center;font-weight:800;flex:none}
.user small{display:block;color:var(--muted);font-size:12px}
.top{position:sticky;top:0;z-index:10;background:var(--bg);border-bottom:1px solid var(--line)}
.top-inner{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:12px 28px}
.search{display:flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:0 12px;min-height:42px;flex:1 1 240px;max-width:420px}
.search:focus-within{border-color:var(--brand)}
.search input{border:0;outline:0;background:none;width:100%;min-height:40px}
.search input::placeholder{color:var(--muted)}
.top-right{display:flex;align-items:center;gap:8px;margin-left:auto}
.sel{background:var(--card);border:1px solid var(--line);border-radius:12px;min-height:42px;padding:0 10px;font-weight:600}
.icon-btn{width:42px;height:42px;border-radius:12px;border:1px solid var(--line);background:var(--card);display:grid;place-items:center;position:relative;flex:none}
.icon-btn:hover{border-color:var(--muted)}
.pip{position:absolute;top:8px;right:9px;width:8px;height:8px;border-radius:50%;background:var(--brand);border:2px solid var(--card)}
.main{padding:26px 28px 120px;max-width:1360px;width:100%}
.hero{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:18px;margin-bottom:26px}
.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:22px 24px}
.h1{font-size:28px;margin:0;letter-spacing:-.02em;font-weight:800}
.h2{font-size:18px;margin:0;font-weight:700}
.h2b{font-size:22px;margin:0;font-weight:800;letter-spacing:-.01em}
.muted{color:var(--muted);margin:4px 0 0}
.stand{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:14px}
.sd{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:2px 10px 2px 3px}
.sd.stale{color:var(--warn);border-color:var(--warn)}
.ch{display:inline-grid;place-items:center;min-width:26px;height:20px;padding:0 5px;border-radius:6px;background:var(--hi);border:1px solid var(--line);font-size:10px;font-weight:800;letter-spacing:.02em;color:var(--text)}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:18px}
.tile{background:var(--hi);border:1px solid var(--line);border-radius:14px;padding:13px 15px}
.tile-label{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:13px;font-weight:600}
.tile-val{font-size:27px;font-weight:800;letter-spacing:-.03em;margin-top:3px}
.tile-hint{font-size:12px;color:var(--muted)}
.dot{width:9px;height:9px;border-radius:50%;display:inline-block;flex:none}
.dist{display:flex;height:8px;border-radius:99px;overflow:hidden;margin-top:16px;gap:2px;background:var(--hi)}
.focus-list{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.focus{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;background:var(--hi);border:1px solid var(--line);text-align:left;width:100%;min-height:58px}
.focus:hover{border-color:var(--brand)}
.focus-txt{display:flex;flex-direction:column;min-width:0;flex:1}
.focus-t{font-weight:700}
.focus-s{color:var(--muted);font-size:12px}
.cost{font-weight:800;font-size:13px;white-space:nowrap}
.go{color:var(--brand);display:inline-flex}
.all-ok{display:flex;align-items:center;gap:10px;padding:14px;border-radius:12px;background:var(--p5bg);color:var(--p5);font-weight:700}
.toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin-bottom:16px}
.fgroup{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.push{margin-left:auto}
.flabel{color:var(--muted);font-size:12px;font-weight:600}
.seg{display:inline-flex;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:3px;gap:2px;flex-wrap:wrap}
.seg button{border:0;background:none;padding:6px 12px;border-radius:9px;color:var(--muted);font-weight:600;font-size:13px;min-height:34px}
.seg button.on{background:var(--hi);color:var(--text);box-shadow:inset 0 0 0 1px var(--line)}
.chip{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--card);border-radius:999px;padding:4px 12px 4px 5px;font-size:13px;font-weight:600;min-height:36px}
.chip.off{opacity:.5;border-style:dashed;text-decoration:line-through}
.linkbtn{border:0;background:none;color:var(--brand);font-weight:700;text-decoration:underline;min-height:36px;padding:0 4px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:18px}
.grid.two{grid-template-columns:repeat(auto-fill,minmax(max(min(100%,320px),calc(50% - 9px)),1fr))} /* User mit 2 Kunden: immer 2 Spalten über die volle Breite – auch wenn ein Filter nur 1 Kachel übrig lässt (Breite bleibt); schmal: 1 Spalte */
.cust{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:20px;display:flex;flex-direction:column;gap:14px}
.cust.crit{border-top:3px solid var(--p1)}
.cust-head{display:flex;align-items:center;gap:12px;border:0;background:none;padding:0;text-align:left;width:100%}
.avatar{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-weight:800;flex:none;background:var(--hi);border:1px solid var(--line)}
.avatar.ok{background:var(--p5bg);color:var(--p5);border-color:transparent}
.cust-id{display:flex;flex-direction:column;flex:1;min-width:0}
.cust-name{font-size:18px;font-weight:700}
.cust-sub{color:var(--muted);font-size:12px}
.ch-row{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}
.pills{display:flex;gap:6px;flex-wrap:wrap}
.pill{font-size:12px;font-weight:700;border-radius:999px;padding:3px 10px;white-space:nowrap}
.issues{display:flex;flex-direction:column;gap:6px}
.issue{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:10px;background:var(--hi);border:1px solid transparent;font-size:13px;text-align:left;width:100%;min-height:44px}
.issue:hover{border-color:var(--line)}
.iss-n{font-weight:800;min-width:34px}
.iss-name{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.more{color:var(--muted);font-size:12px;padding-left:4px}
.growline{display:flex;align-items:center;gap:8px;color:var(--p5);font-size:13px;font-weight:700}
.actions{display:flex;gap:6px;margin-top:auto;padding-top:14px;border-top:1px dashed var(--line)}
.act{flex:1;text-align:center;padding:9px 8px;border-radius:10px;font-size:13px;font-weight:600;color:var(--muted);background:transparent;border:1px solid var(--line);min-height:42px;white-space:nowrap}
.act:hover{color:var(--text);border-color:var(--muted)}
a.act{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}  /* externer Report-/Ads-Link sieht aus wie die Knöpfe */
a.btn{text-decoration:none}
.root a.act,.root a.btn{font:inherit}  /* wie die Knöpfe daneben (.root button{font:inherit}) */
.act.main-act{color:var(--text);background:var(--hi);flex:1.6}
.act.add{flex:0 0 44px;color:var(--brand);font-size:18px}
.lwrap{overflow-x:auto;border:1px solid var(--line);border-radius:18px;background:var(--card)}
.lgrid{display:grid;grid-template-columns:minmax(200px,2fr) 120px 72px 72px 72px 72px 120px 90px minmax(220px,2fr);align-items:center;gap:0 10px;padding:0 18px;min-width:1100px}
.lhead{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);min-height:44px;border-bottom:1px solid var(--line)}
.lrow{border:0;border-bottom:1px solid var(--line);background:none;text-align:left;width:100%;min-height:56px}
.lrow:hover{background:var(--hi)}
.lname{display:flex;align-items:center;gap:10px;font-weight:700}
.lname .avatar{width:32px;height:32px;border-radius:9px;font-size:12px}
.num{font-weight:800;font-variant-numeric:tabular-nums}
.zero{color:var(--muted);font-weight:500}
.ltop{display:flex;align-items:center;gap:8px;font-size:13px;min-width:0}
.ltop span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.back{display:inline-flex;align-items:center;gap:6px;border:0;background:none;color:var(--muted);font-weight:700;padding:6px 0;margin-bottom:12px;min-height:40px}
.back:hover{color:var(--text)}
.acct-head{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-bottom:18px}
.qlinks{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);background:var(--hi);border-radius:10px;padding:9px 14px;font-weight:700;font-size:13px;min-height:42px;white-space:nowrap}
.btn:hover{border-color:var(--muted)}
.btn.primary{background:var(--btn);border-color:var(--btn);color:var(--btnfg)}
.btn.ghost{background:none}
.btn.locked{color:var(--muted)}
.fhead{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:6px}
.tabs{display:inline-flex;gap:4px;flex-wrap:wrap}
.tab{border:1px solid transparent;background:none;padding:8px 14px;border-radius:10px;font-weight:700;color:var(--muted);min-height:42px;display:inline-flex;align-items:center;gap:8px}
.tab.on{background:var(--hi);color:var(--text);border-color:var(--line)}
.tab .cnt{font-size:12px;font-weight:800;padding:1px 8px;border-radius:999px;background:var(--bg)}
.grp-title{display:flex;align-items:center;gap:8px;padding:18px 4px 8px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.frows{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,520px),1fr));gap:8px}
.frow{display:flex;align-items:center;gap:12px;border:1px solid var(--line);background:var(--hi);border-radius:12px;padding:10px 14px 10px 10px;text-align:left;width:100%;min-height:60px}
.frow:hover{border-color:var(--muted)}
.bar{width:4px;align-self:stretch;border-radius:4px;flex:none}
.ftxt{flex:1;min-width:0;display:flex;flex-direction:column}
.ft{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fm{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.age{font-size:12px;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.age.old{color:var(--warn);font-weight:700}
.owner{display:inline-grid;place-items:center;min-width:28px;height:22px;padding:0 6px;border-radius:999px;background:var(--hi);border:1px solid var(--line);font-size:11px;font-weight:800;color:var(--muted)}
.lgrid.own{grid-template-columns:minmax(200px,2fr) 120px 56px 72px 72px 72px 72px 120px 90px minmax(220px,2fr);min-width:1160px}
.selrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.btn.accent{background:transparent;border-color:var(--brand);color:var(--brand)}
.btn.accent:hover{background:var(--sel)}
.btn.sm{min-height:34px;padding:6px 10px;font-size:12px}
.btn:disabled,.pager button:disabled{opacity:.35;cursor:default}
.tag{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--muted);background:var(--hi);border-radius:999px;padding:2px 10px 2px 3px}
.pager{display:inline-flex;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.pager button{width:38px;height:38px;border:0;background:var(--card);display:grid;place-items:center}
.pager button+button{border-left:1px solid var(--line)}
.pager button:hover:not(:disabled){background:var(--hi)}
.close-btn{width:38px;height:38px;margin-left:8px}
.facts{display:flex;gap:8px;flex-wrap:wrap}
.fact{background:var(--hi);border:1px solid var(--line);border-radius:10px;padding:6px 12px;font-size:12px;color:var(--muted);min-width:92px}
.fact b{display:block;font-size:15px;color:var(--text)}
.fact.old b{color:var(--warn)}
.sec-head{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.selbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.split{display:inline-flex;align-items:stretch}
.split .btn{border-top-right-radius:0;border-bottom-right-radius:0}
.split .btn:only-child{border-radius:10px}
.split-sel{border:1px solid var(--done);border-left:1px solid rgba(127,127,127,.45);background:var(--done);color:var(--donefg);border-radius:0 10px 10px 0;font-weight:700;font-size:13px;padding:0 8px;min-height:42px}
.menu-wrap{position:relative}
.menu-wrap > .btn svg{transform:rotate(0deg)}
.menu{position:absolute;bottom:calc(100% + 6px);left:0;min-width:210px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 28px rgba(0,0,0,.28);padding:6px;display:flex;flex-direction:column;z-index:5}
.menu button{display:flex;align-items:center;gap:10px;text-align:left;border:0;background:none;padding:10px 12px;border-radius:8px;min-height:42px;font-weight:600}
.menu button:hover{background:var(--hi)}
.menu-h{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);padding:8px 12px 4px}
.btn.done{background:var(--done);border-color:var(--done);color:var(--donefg)}
.btn.done:hover{filter:brightness(1.06)}
.pg-head{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.info-strip{font-size:13px;color:var(--muted);border:1px dashed var(--line);border-radius:12px;padding:10px 14px}
.switch{position:relative;display:inline-block;width:42px;height:24px;flex:none}
.switch input{position:absolute;inset:0;opacity:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:1}
.switch span{position:absolute;inset:0;background:var(--line);border-radius:99px;transition:background .15s}
.switch span::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:var(--onfill);transition:transform .15s;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.switch input:checked + span{background:var(--done)}
.switch input:checked + span::after{transform:translateX(18px)}
.switch input:focus-visible + span{outline:2px solid var(--brand);outline-offset:2px}
.ck{border-top:1px solid var(--line);padding:14px 0}
.ck.first{border-top:0}
.ck.off .ck-main,.ck.off .pseg{opacity:.45}
.ck-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.ck-main{flex:1 1 280px;min-width:0}
.ck-title{font-weight:700;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ck-meta{font-size:12px;color:var(--muted);margin-top:2px}
.badge-c{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--p3);border:1px solid var(--p3);border-radius:5px;padding:0 5px}
.pseg{display:inline-flex;border:1px solid var(--line);border-radius:10px;padding:2px;gap:2px;background:var(--card);flex-wrap:wrap}
.pseg button{border:0;display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:8px;font-size:12px;font-weight:700;min-height:34px}
.ck-edit{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:18px;margin-top:14px;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--hi)}
.ck-edit .btn-row{grid-column:1/-1}
.fld{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:700;color:var(--muted);margin-bottom:12px}
.ta,.inp.wide{width:100%;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:8px 10px;font-size:14px;color:var(--text);font-weight:500;resize:vertical}
.ck-prev{border:1px solid var(--line);border-radius:12px;background:var(--card);padding:14px 16px;display:flex;flex-direction:column;gap:6px;align-self:start}
.ck-prev h4{margin:4px 0 0;font-size:17px}
.ck-prev p{margin:0;font-size:13px}
.faq{border-top:1px solid var(--line);padding:12px 0}
.faq:first-child{border-top:0}
.faq summary{font-weight:700;cursor:pointer;min-height:32px;display:flex;align-items:center}
.faq p{margin:8px 0 0;color:var(--muted)}
.ch-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.legend{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.legend span{display:inline-flex;align-items:center;gap:6px}
.bars{display:flex;align-items:flex-end;gap:4px;height:190px;margin-top:16px;padding-bottom:24px}
.bar-col{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;position:relative;min-width:0}
.bar-stack{width:100%;max-width:26px;display:flex;flex-direction:column-reverse;border-radius:4px 4px 0 0;overflow:hidden;gap:1px}
.bar-stack i{display:block;min-height:0}
.bar-x{position:absolute;bottom:-22px;font-size:10px;color:var(--muted);white-space:nowrap}
.pair{display:flex;align-items:flex-end;justify-content:center;gap:2px;height:100%;width:100%}
.pair i{display:block;width:44%;max-width:12px;border-radius:3px 3px 0 0}
.hbar{display:grid;grid-template-columns:minmax(120px,190px) minmax(0,1fr) 44px;gap:12px;align-items:center;font-size:13px;padding:6px 0}
.track{height:10px;background:var(--hi);border-radius:99px;overflow:hidden;display:block}
.track i{display:block;height:100%;border-radius:99px;background:var(--done)}
.trend-up{color:var(--p2);font-size:13px;font-weight:700;margin:10px 0 0}
.trend-down{color:var(--done);font-size:13px;font-weight:700;margin:10px 0 0}
.rgrid{display:grid;grid-template-columns:minmax(200px,2fr) repeat(5,minmax(70px,1fr)) minmax(100px,1.2fr);gap:0 10px;align-items:center;padding:0 6px;min-width:780px}
.logo-ph{width:64px;height:40px;border:1px dashed var(--muted);border-radius:8px;display:grid;place-items:center;font-size:10px;font-weight:800;color:var(--muted)}
.cp-paper{border:1px solid var(--line);border-radius:14px;padding:20px;background:var(--bg)}
.cp-list{margin:6px 0 0;padding-left:18px;font-size:14px}
.cp-list li{margin:4px 0}
.adr{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 0;border-top:1px solid var(--line)}
.adr.off .ck-main,.adr.off .thr-in{opacity:.45}
.thr-in{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.thr-box{border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:6px;background:var(--hi)}
.thr-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.src-l{flex:1;display:flex;flex-direction:column;min-width:0}
.src-l small{font-size:12px;color:var(--muted)}
.src-l small.stale{color:var(--warn);font-weight:700}
.src.picked{border-color:var(--brand);background:var(--sel)}
.kanban{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px;align-items:start}
.kcol{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:14px;display:flex;flex-direction:column;gap:10px}
.kcol-h{display:flex;align-items:center;gap:8px;font-weight:800;padding:2px 4px 4px}
.kcol-h .cnt{margin-left:auto;font-size:12px;font-weight:800;padding:1px 8px;border-radius:999px;background:var(--hi)}
.kc{background:var(--hi);border:1px solid var(--line);border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:8px}
.kc.open{border-color:var(--muted)}
.kc.done .kc-title{text-decoration:line-through;color:var(--muted)}
.kc-main{border:0;background:none;padding:0;text-align:left;display:flex;flex-direction:column;gap:6px;width:100%}
.kc-title{font-weight:700}
.kc-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.due{font-weight:700}
.due.over{color:var(--p1)}
.due.today{color:var(--p2)}
.kc-link{display:inline-flex;align-items:center;gap:8px;border:1px dashed var(--line);background:var(--card);border-radius:10px;padding:6px 10px;font-size:12px;font-weight:600;text-align:left;min-height:36px;max-width:100%}
.kc-link span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kc-link:hover{border-color:var(--muted)}
.kc-detail{display:flex;flex-direction:column;gap:8px;border-top:1px dashed var(--line);padding-top:10px}
.kc-edit{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 10px}
.kc-edit .sel{width:100%}
.kc-actions{display:flex;gap:6px;flex-wrap:wrap}
.kempty{color:var(--muted);font-size:13px;text-align:center;padding:16px;border:1px dashed var(--line);border-radius:12px}
.fld .sel{width:100%}
.stepper{list-style:none;margin:0 0 22px;padding:0;display:flex;gap:6px;flex-wrap:wrap}
.stepper li{flex:1 1 110px}
.stepper button{width:100%;display:flex;align-items:center;gap:8px;border:0;border-top:4px solid var(--line);background:none;padding:10px 2px 0;text-align:left;color:var(--muted);font-weight:700;font-size:12px;min-height:44px}
.stepper button:disabled{cursor:default}
.stepper li.done button{border-top-color:var(--done);color:var(--text)}
.stepper li.cur button{border-top-color:var(--brand);color:var(--text)}
.st-n{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--hi);font-size:11px;flex:none}
.stepper li.done .st-n{background:var(--done);color:var(--donefg)}
.stepper li.cur .st-n{background:var(--brand);color:var(--onfill)}
.opt-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:12px;margin-top:18px}
.opt{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;border:1px solid var(--line);background:var(--hi);border-radius:14px;padding:16px;min-height:96px}
.opt:hover{border-color:var(--muted)}
.opt.on{border-color:var(--brand);background:var(--sel);box-shadow:inset 0 0 0 1px var(--brand)}
.opt b{font-size:15px}
.opt span{font-size:13px;color:var(--muted)}
.opt-ic{color:var(--brand)}
.onb-nav{margin-top:20px;justify-content:space-between}
.newb{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--brand);border:1px solid var(--brand);border-radius:5px;padding:0 5px;flex:none}
.empty{padding:36px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:14px;margin-top:12px}
.scrim{position:fixed;inset:0;background:var(--scrim);z-index:30;border:0;padding:0;width:100%;cursor:default}
.drawer{position:fixed;top:0;right:0;bottom:0;width:560px;max-width:100vw;background:var(--card);border-left:1px solid var(--line);z-index:31;display:flex;flex-direction:column;box-shadow:-12px 0 32px rgba(0,0,0,.2)}
.dr-head{padding:16px 22px 16px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:10px}
.dr-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dr-nav{display:flex;align-items:center;gap:6px;margin-left:auto}
.dr-nav .icon-btn{width:38px;height:38px}
.counter{font-size:12px;color:var(--muted);font-weight:600;padding:0 4px}
.dr-title{margin:0;font-size:21px;font-weight:800;letter-spacing:-.01em}
.dr-body{flex:1;overflow:auto;padding:6px 22px 22px;display:flex;flex-direction:column;gap:18px}
.sec p{margin:4px 0 0}
.up{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-top:14px}
.ai{border:1px solid var(--line);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:10px;background:var(--hi)}
.ai-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ai-t{font-weight:800}
.ai-list{margin:0;padding-left:18px;color:var(--muted);font-size:13px}
.tbl{border:1px solid var(--line);border-radius:12px;overflow:hidden}
.trow{display:grid;grid-template-columns:36px minmax(0,1.6fr) minmax(0,1.2fr) 86px;gap:8px;align-items:center;padding:8px 12px;border-top:1px solid var(--line);font-size:13px}
.trow:first-child{border-top:0}
.thead{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);background:var(--hi)}
.trow.ck{background:var(--sel)}
.el{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.el small{display:block;font-weight:500;color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis}
.right{text-align:right}
.trow input{width:18px;height:18px;accent-color:var(--btn)}
.tmore{padding:10px 12px;border-top:1px solid var(--line);color:var(--muted);font-size:12px}
.ignbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.dr-foot{border-top:1px solid var(--line);padding:14px 22px;display:flex;flex-direction:column;gap:10px}
.btn-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.hint{font-size:12px;color:var(--muted)}
.mscrim{position:fixed;inset:0;background:var(--scrim);z-index:40;display:grid;place-items:center;padding:16px}
.modal{background:var(--card);border:1px solid var(--line);border-radius:20px;max-width:640px;width:100%;padding:28px;display:flex;flex-direction:column;gap:16px;max-height:92vh;overflow:auto}
.cmp{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,1fr);border:1px solid var(--line);border-radius:14px;overflow:hidden;font-size:13px}
.cmp div{padding:10px 14px;border-top:1px solid var(--line);display:flex;align-items:center;gap:6px}
.cmp .h{border-top:0;font-weight:800;background:var(--hi)}
.yes{color:var(--p5);font-weight:800}
.no{color:var(--muted)}
.reason{font-size:13px;font-weight:700;color:var(--brand)}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--toast);color:var(--toastfg);border-radius:12px;padding:10px 12px 10px 16px;display:flex;align-items:center;gap:14px;z-index:50;font-weight:600;box-shadow:0 8px 24px rgba(0,0,0,.25);max-width:calc(100vw - 32px)}
.toast button{border:0;background:none;color:inherit;text-decoration:underline;font-weight:800;min-height:32px}
.proto{position:fixed;right:14px;bottom:14px;z-index:20;display:flex;flex-wrap:wrap;align-items:center;gap:8px;background:var(--card);border:1px dashed var(--muted);border-radius:14px;padding:6px 8px 6px 12px;font-size:12px;color:var(--muted);max-width:calc(100vw - 28px)}
.proto .seg button{min-height:30px;padding:4px 10px;font-size:12px}
.form{display:flex;flex-direction:column;gap:14px;margin-top:16px}
.frm-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;padding:12px 0;border-top:1px solid var(--line)}
.frm-row:first-child{border-top:0}
.frm-row label{font-weight:700;flex:1 1 220px}
.frm-row .sub{display:block;font-weight:500;color:var(--muted);font-size:12px}
.inp{background:var(--hi);border:1px solid var(--line);border-radius:10px;min-height:40px;padding:0 10px;width:110px}
.tog{width:20px;height:20px;accent-color:var(--btn)}
.stack{display:flex;flex-direction:column;gap:18px}
.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:18px}
.lex{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,360px),1fr));gap:10px;margin-top:8px}
.lex-i{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:var(--hi);display:flex;flex-direction:column;gap:4px}
.lex-i b{font-size:14px}
.lex-i p{margin:0;font-size:13px;color:var(--muted)}
.onb{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:28px 16px 120px}
.onb-top{width:100%;max-width:720px;display:flex;align-items:center;gap:12px;margin-bottom:36px}
.onb-card{width:100%;max-width:720px}
.steps{display:flex;gap:8px;margin:18px 0}
.steps i{flex:1;height:5px;border-radius:99px;background:var(--line)}
.steps i.on{background:var(--btn)}
.srcs{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.src{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--hi)}
.src label{flex:1;font-weight:700}
.prog{display:flex;flex-direction:column;gap:8px;margin-top:16px}
.prog div{display:flex;align-items:center;gap:10px;font-weight:600}
.prog .wait{color:var(--muted)}
.pbar{height:8px;border-radius:99px;background:var(--hi);overflow:hidden;margin-top:14px}
.pbar i{display:block;height:100%;background:var(--btn);border-radius:99px}

/* v7: zentrale Dateien (Logo, Kanal-Logos, Sprachauswahl) */
.logo-wrap{display:inline-flex;background:var(--logo-bg);border-radius:10px;padding:6px 10px;flex:none}
.logo-wrap img{height:26px;display:block}
a.logo-wrap:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.ch[data-ch="G"],.ch[data-ch="MS"],.ch[data-ch="GA4"],.ch[data-ch="MC"],.ch[data-ch="CR"]{font-size:0;color:transparent;min-width:20px;width:20px;height:20px;padding:0;border:0;background:transparent center/16px 16px no-repeat}
.ch[data-ch="G"]{background-image:url(assets/favicon_google.ico)}
.ch[data-ch="MS"]{background-image:url(assets/favicon_bing.ico)}
.ch[data-ch="GA4"]{background-image:url(assets/ga4.ico)}
.ch[data-ch="MC"]{background-image:url(assets/gmc.ico)}
.ch[data-ch="CR"]{background-image:url(assets/criteo.ico)}
@media (max-width:820px){
.side{max-width:none;flex-basis:100%;flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line);padding:8px 10px;align-items:center;gap:4px}
.side .nav-label,.side .spacer,.side .user{display:none}
.brand{padding:0 8px 0 4px}
.nav-item{width:auto;flex:none;white-space:nowrap}
.nav-item.on{box-shadow:inset 0 -3px 0 var(--brand)}
.top-inner,.main{padding-left:16px;padding-right:16px}
.search{max-width:none;flex-basis:100%;order:3}
.drawer{width:100vw}
.push{margin-left:0}
.trow{grid-template-columns:30px minmax(0,1fr) 80px}
.trow .det{display:none}
}

/* ===== v8: Ergänzungen zu den Stilen aus v7 ===== */
[hidden] { display: none !important; }

/* Prioritätsfarben: Punkt/Balken über data-p, Text über .pc1 … .pc6 (Pill zusätzlich mit Hintergrund).
   Priorität 4 (Niedrig) hellgelb, heller als 3; Priorität 6 (Analyse) weiß – im hellen Theme mit Rand und dunklerer Schrift (--p4t, --p6t) */
.dot[data-p="1"], .bar[data-p="1"], .dist i[data-p="1"] { background: var(--p1); }
.dot[data-p="2"], .bar[data-p="2"], .dist i[data-p="2"] { background: var(--p2); }
.dot[data-p="3"], .bar[data-p="3"], .dist i[data-p="3"] { background: var(--p3); }
.dot[data-p="4"], .bar[data-p="4"], .dist i[data-p="4"] { background: var(--p4); }
.dot[data-p="5"], .bar[data-p="5"], .dist i[data-p="5"] { background: var(--p5); }
.dot[data-p="6"], .bar[data-p="6"], .dist i[data-p="6"] { background: var(--p6); }
.dot[data-c="brand"] { background: var(--brand); }
.dot[data-c="warn"] { background: var(--warn); }
.dot[data-c="muted"] { background: var(--muted); }
.dot[data-c="viz-new"] { background: var(--viz-new); }
.dot[data-c="viz-done"] { background: var(--viz-done); }
.dot-sm { width: 11px; height: 11px; }
.dot[data-p="6"], .bar[data-p="6"], .dist i[data-p="6"] { box-shadow: inset 0 0 0 1px var(--muted); }
.th-light .dot[data-p="4"], .th-light .bar[data-p="4"], .th-light .dist i[data-p="4"] { box-shadow: inset 0 0 0 1px var(--p4t); }

/* Anmeldung */
.auth-card { max-width: 440px; width: 100%; }
.auth-card .h1 { font-size: 26px; }
.auth-form { display: flex; flex-direction: column; gap: 14px; margin-top: 18px; }
.auth-form label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 700; color: var(--muted); }
.auth-form input { background: var(--hi); border: 1px solid var(--line); border-radius: 10px; min-height: 44px; padding: 0 12px; font-size: 15px; color: var(--text); }
.auth-form input:focus { outline: none; border-color: var(--brand); }
.msg { border-radius: 10px; padding: 10px 14px; font-size: 13px; font-weight: 600; }
.msg.err { background: var(--p1bg); color: var(--p1); }
.msg.ok { background: var(--p5bg); color: var(--p5); }
.onb-top .lang-slot { margin-left: auto; }

/* Sprachauswahl (lang-menu.js) im v7-Look */
.root { --slm-bg: var(--card); --slm-border: var(--line); --slm-text: var(--text); --slm-muted: var(--muted); --slm-hover: var(--hi); --slm-accent: var(--brand); --slm-height: 42px; --slm-radius: 12px; }

/* Laden / Hinweise */
.loading { padding: 40px; text-align: center; color: var(--muted); }
.soon { display: inline-flex; align-items: center; gap: 6px; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); border: 1px dashed var(--muted); border-radius: 5px; padding: 0 5px; }
.sidebar-user { display: flex; flex-direction: column; gap: 4px; }
.logout { border: 0; background: none; color: var(--muted); font-weight: 700; font-size: 12px; text-align: left; padding: 4px 10px; min-height: 32px; }
.logout:hover { color: var(--text); }

/* Kundenliste: Spalten ohne Kosten, mit Analyse */
.lgrid.v8 { grid-template-columns: minmax(200px,2fr) 120px 72px 72px 72px 72px 72px 80px minmax(220px,2fr); min-width: 1080px; }

/* Befund-Detail: breitere Seitenleiste, Tabelle mit freien Spalten */
.drawer { width: min(100vw, 1680px, max(860px, calc(100vw - 236px))); }  /* Befund-Details: so breit wie möglich, Navigation bleibt sichtbar */
.dwrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; }
.dtbl { width: 100%; border-collapse: collapse; font-size: 13px; }  /* an die Breite anpassen, umbrechen statt scrollen */
.dtbl th { text-align: left; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); background: var(--hi); padding: 9px 12px; white-space: nowrap; }
.dtbl th[aria-sort] { padding: 0; white-space: normal; vertical-align: bottom; }
.th-sort { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: 6px; width: 100%; padding: 9px 12px; cursor: pointer; font: inherit; color: inherit; letter-spacing: inherit; text-transform: inherit; white-space: normal; }  /* lange Überschriften dürfen zweizeilig werden – spart Breite */
.th-sort:hover { color: var(--text); }
.th-sort:focus-visible { outline: 2px solid var(--brand); outline-offset: -2px; }
.th-sort .sort-ind { font-size: 10px; opacity: .45; }
.th-sort.on { color: var(--text); }
.th-sort.on .sort-ind { opacity: 1; color: var(--brand); }
.dtbl td { padding: 8px 12px; border-top: 1px solid var(--line); vertical-align: top; max-width: 220px; overflow-wrap: break-word; }
.dtbl td a { color: var(--brand); text-decoration: underline; }
.dtbl td.acc { color: var(--muted); max-width: 180px; }
.dtbl td.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }  /* Zahlenspalten rechtsbündig */
.dtbl th.num .th-sort { justify-content: flex-end; text-align: right; }
.expl a { color: var(--brand); text-decoration: underline; }
.kv { display: grid; grid-template-columns: minmax(140px, 220px) 1fr; gap: 10px 18px; margin-top: 14px; }
.kv dt { color: var(--muted); font-size: 13px; font-weight: 600; }
.kv dd { margin: 0; }
.notes { white-space: pre-wrap; margin: 6px 0 0; }
.acct-tbl td { vertical-align: middle; }

/* Kacheln als Prioritätsfilter */
.tile-btn { text-align: left; font: inherit; color: inherit; cursor: pointer; width: 100%; display: flex; flex-direction: column; justify-content: flex-start; }  /* Inhalt oben, auch bei unterschiedlich langen Hinweisen */
.tile-btn:hover { border-color: var(--muted); }
.tile-btn.on { border-color: var(--brand); box-shadow: inset 0 0 0 1px var(--brand); }
.dist i { cursor: pointer; }
.dist i.on { outline: 2px solid var(--text); outline-offset: 1px; }
.fchip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--brand); background: var(--sel); color: var(--text); border-radius: 999px; padding: 2px 4px 2px 12px; font-size: 13px; min-height: 36px; }
.fchip button { border: 0; background: none; color: var(--muted); width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; }
.fchip button:hover { color: var(--text); background: var(--hi); }

/* Kanal-Filter: Auswahl statt Ausschluss */
.chip.sel { border-color: var(--brand); background: var(--sel); box-shadow: inset 0 0 0 1px var(--brand); }
.chip.dim { opacity: .55; }
.chip.logo-only { padding: 4px 9px; min-width: 42px; justify-content: center; }
.chip.logo-only .ch { pointer-events: none; }
.main .toolbar { gap: 10px 14px; }

/* ===== Reports ===== */
.rep-tiles { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.fc-wrap { position: relative; padding: 14px 0 30px 44px; margin-top: 12px; }
.fc-plot { position: relative; height: 220px; display: flex; align-items: flex-end; gap: 2px; border-bottom: 1px solid var(--line); }
.fc-grid { position: absolute; left: 0; right: 0; border-top: 1px solid var(--line); pointer-events: none; }
.fc-grid span { position: absolute; left: -44px; width: 36px; transform: translateY(-50%); text-align: right; font-size: 11px; color: var(--muted); font-variant-numeric: tabular-nums; }
.fc-col { position: relative; flex: 1; height: 100%; display: flex; align-items: flex-end; justify-content: center; border-radius: 6px 6px 0 0; outline-offset: 2px; }
.fc-col:hover, .fc-col:focus-visible { background: var(--hi); }
.fc-bars { display: flex; align-items: flex-end; justify-content: center; gap: 2px; height: 100%; width: 100%; }
.fc-bars i { display: block; width: min(12px, 42%); border-radius: 4px 4px 0 0; }
.fc-new { background: var(--viz-new); }
.fc-done { background: var(--viz-done); }
.fc-col:hover .fc-bars i, .fc-col:focus-visible .fc-bars i { filter: brightness(1.15); }
.fc-x { position: absolute; bottom: -22px; font-size: 11px; color: var(--muted); white-space: nowrap; }
.fc-tip { position: absolute; z-index: 3; pointer-events: none; background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 8px 12px; box-shadow: 0 8px 22px rgba(0,0,0,.25); font-size: 12px; min-width: 150px; }
.fc-tip-h { color: var(--muted); margin-bottom: 4px; }
.fc-tip-r { display: flex; align-items: center; gap: 8px; }
.fc-tip-r b { font-size: 14px; color: var(--text); font-variant-numeric: tabular-nums; min-width: 24px; }
.fc-tip .key { width: 12px; height: 2px; border-radius: 1px; }
.fc-tip .key.new, .lg-sw.new { background: var(--viz-new); }
.fc-tip .key.done, .lg-sw.done { background: var(--viz-done); }
.lg-sw { display: inline-block; width: 10px; height: 10px; border-radius: 3px; }
.legend b { color: var(--text); }
.hbar .hb-l { display: flex; align-items: center; gap: 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hbar .track i { background: var(--viz-new); }
.dtbl.mid td { vertical-align: middle; }

/* Auswahl in der Elemente-Tabelle */
.dtbl .ck-col { width: 38px; padding-right: 0; }
.dtbl .ck-col input { width: 18px; height: 18px; accent-color: var(--btn); cursor: pointer; }
.dtbl tr.is-sel td { background: var(--sel); }
.dtbl tr[data-act="selRow"] { cursor: pointer; }
.dtbl tr[data-act="selRow"]:hover td { background: var(--hi); }
.dtbl tr[data-act="selRow"].is-sel:hover td { background: var(--sel); }
/* Meldung bei offener Seitenleiste im freien Bereich links zentrieren; schmal: über der Fußzeile */
/* Seitenleiste offen: Meldung rechts über der Fußleiste – sie darf deren Knöpfe nicht verdecken */
body.drawer-open .toast { left: auto; right: 24px; transform: none; bottom: calc(var(--foot-h, 96px) + 16px); z-index: 60; }

/* Benutzer */
.ustate { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
.cbx-group { border: 1px solid var(--line); border-radius: 10px; padding: 8px 12px 10px; margin: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; }
.cbx-group legend { font-size: 13px; font-weight: 700; color: var(--muted); padding: 0 4px; }
.auth-form .cbx { flex-direction: row; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: var(--text); min-height: 32px; }
.cbx input { width: 18px; height: 18px; min-height: 0; accent-color: var(--btn); }
.auth-form input:disabled { opacity: .6; }

/* Spaltenfilter in der Befund-Detailansicht (Chips wie der Prio-Filter, Eingabe als Zeile statt Dialog) */
.fbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 10px; }
.fbar:empty { display: none; }
.fbar .fchip { flex: 0 0 auto; max-width: 100%; }
.fchip .fchip-edit { all: unset; display: block; width: auto; height: auto; cursor: pointer; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 420px; }  /* nicht wie das runde × (.fchip button) */
.fchip .fchip-edit:hover { background: none; text-decoration: underline; }
.fchip .fchip-edit:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; border-radius: 4px; }
.fpanel { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px; margin: 0 0 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--hi); }
.fpanel .sel { min-height: 40px; }
.fpanel .inp { width: 120px; background: var(--card); color: var(--text); }
.fp-msg { flex-basis: 100%; margin: 0; color: var(--p1); font-size: 13px; }
.fp-msg:empty { display: none; }
.sec-head .btn.on { border-color: var(--brand); color: var(--text); }

/* Element-Aktionen in der Zeile (✓ erledigt, Auge = Ausblend-Menü) wie im bisherigen System */
.dtbl td.row-act, .dtbl th.row-act { width: 1%; white-space: nowrap; text-align: right; padding-left: 4px; }
/* gleiches Grün wie „Alles erledigt“ (.btn.done) */
.ra-btn { display: inline-grid; place-items: center; width: 30px; height: 30px; border: 1px solid var(--done); border-radius: 8px; background: var(--done); color: var(--donefg); cursor: pointer; margin-left: 4px; }
.ra-btn:hover { filter: brightness(1.06); }
.ra-btn[aria-expanded="true"] { box-shadow: 0 0 0 2px var(--card), 0 0 0 4px var(--done); }
.ra-btn:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.menu.pop { position: fixed; bottom: auto; z-index: 70; min-width: 250px; }  /* über Meldungen (z 60): offenes Menü hat Vorrang */
.dr-foot .menu { z-index: 70; }
body.menu-open .toast { opacity: 0; pointer-events: none; }
.menu-head { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); padding: 6px 12px 4px; }
.menu .menu-row { display: flex; align-items: center; gap: 8px; padding: 6px 12px; border-top: 1px solid var(--line); }
.menu .menu-row .inp { width: 70px; min-height: 34px; background: var(--card); color: var(--text); }
.menu .menu-row input[type="date"] { width: 140px; }
.menu .menu-row .sel { min-height: 34px; flex: 1; }
.menu .menu-row .btn { min-height: 34px; padding: 0 12px; margin-left: auto; font-weight: 700; }

/* Übersicht: Prioritäts-Pills der Kunden-Kacheln sind zugleich Filter für die Kachel */
.pills .pill-btn { border: 1px solid transparent; font-family: inherit; font-size: 12px; font-weight: 700; line-height: inherit; cursor: pointer; }
.pill-btn:hover { border-color: currentColor; }
.pill-btn.on { border-color: currentColor; box-shadow: inset 0 0 0 1px currentColor; }
.pill-btn:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

/* Befund-Tabelle: eigener Scrollbereich in der Seitenleiste – waagerechte Scroll-Leiste immer im Bild,
   Kopfzeile oben, Auswahl links und Aktionen (✓ / Auge) rechts festgeheftet */
.drawer .dwrap { overflow: auto; max-height: max(240px, var(--table-h, 60vh)); overscroll-behavior: contain; }
.drawer .dtbl { border-collapse: separate; border-spacing: 0; }
.drawer .dtbl thead th { position: sticky; top: 0; z-index: 2; }
.drawer .dtbl .ck-col, .drawer .dtbl .row-act { position: sticky; z-index: 1; background: var(--card); }
.drawer .dtbl .ck-col { left: 0; }
.drawer .dtbl .row-act { right: 0; box-shadow: -10px 0 10px -10px rgba(0, 0, 0, .35); }
.drawer .dtbl thead .ck-col, .drawer .dtbl thead .row-act { z-index: 3; background: var(--hi); }
.drawer .dtbl tr.is-sel td.ck-col, .drawer .dtbl tr.is-sel td.row-act { background: linear-gradient(var(--sel), var(--sel)), var(--card); }
.drawer .dtbl tr[data-act="selRow"]:hover td.ck-col, .drawer .dtbl tr[data-act="selRow"]:hover td.row-act { background: var(--hi); }
.drawer .dtbl tr[data-act="selRow"].is-sel:hover td.ck-col, .drawer .dtbl tr[data-act="selRow"].is-sel:hover td.row-act { background: linear-gradient(var(--sel), var(--sel)), var(--card); }

/* ===== Varianten und Abstände (statt style="…" in app.js) ===== */
/* mit .root davor: so stark wie die Basisregeln (.root button …, .sec p), wie zuvor die Inline-Styles */
.root .pc1 { color: var(--p1); }
.root .pc2 { color: var(--p2); }
.root .pc3 { color: var(--p3); }
.root .pc4 { color: var(--p4t); }
.root .pc5 { color: var(--p5); }
.root .pc6 { color: var(--p6t); }
.root .pill.pc1 { background: var(--p1bg); }
.root .pill.pc2 { background: var(--p2bg); }
.root .pill.pc3 { background: var(--p3bg); }
.root .pill.pc4 { background: var(--p4bg); }
.root .pill.pc5 { background: var(--p5bg); }
.root .pill.pc6 { background: var(--p6bg); }
.root .c-muted { color: var(--muted); }
.root .c-brand { color: var(--brand); }
.root .linkbtn.bare { padding: 0; }
.root .linkbtn.name-link { padding: 0; text-decoration: none; color: var(--text); }
.root .linkbtn.more-link { text-align: left; font-size: 13px; min-height: 32px; }
.root button.growline { border: 0; background: none; padding: 0; min-height: 32px; }
.root button.ftxt { border: 0; background: none; padding: 0; text-align: left; }
.root .frow.no-click { cursor: default; }
.root .frows.one-col { grid-template-columns: 1fr; }
.root .muted.growth-intro { margin: 8px 4px 0; }
.root .lrow .ch-row { justify-content: flex-start; }
.root .lwrap .empty { margin: 16px; }
.root .tag.plain { padding: 2px 10px; }
/* Abstände: .m-0 steht vor .mt-*, damit „m-0 mt-10“ oben 10px und sonst 0 ergibt */
.root .m-0 { margin: 0; }
.root .mt-0 { margin-top: 0; }
.root .mt-6 { margin-top: 6px; }
.root .mt-8 { margin-top: 8px; }
.root .mt-10 { margin-top: 10px; }
.root .mt-12 { margin-top: 12px; }
.root .mt-14 { margin-top: 14px; }
.root .mt-22 { margin-top: 22px; }
.root .mb-0 { margin-bottom: 0; }
.root .mb-22 { margin-bottom: 22px; }
.root .mr-6 { margin-right: 6px; }
.root .mr-10 { margin-right: 10px; }
.root .ml-auto { margin-left: auto; }
.root .py-6 { padding-top: 6px; padding-bottom: 6px; }
.root .flex-1 { flex: 1; }
.root .flex-nowrap { flex-wrap: nowrap; }
.root .fs-13 { font-size: 13px; }
.root .fs-24 { font-size: 24px; }
.root .fs-26 { font-size: 26px; }