:root{
  --accent:#4f46e5; --accent-d:#4338ca; --accent-soft:#eef0ff;
  --grad:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%);      /* Indigo → Violett (Buttons, aktive Navigation) */
  --grad-d:linear-gradient(135deg,#5558e8 0%,#7c4fe0 100%);
  --bg:#f5f6f8; --surface:#ffffff; --border:#e5e7eb; --border-2:#eef0f3;
  --text:#111827; --muted:#6b7280; --faint:#9ca3af;
  --danger:#dc2626; --green:#16a34a; --amber:#d97706;
  --side:#0f1524; --side-2:#1b2740; --side-tx:#9aa7bd; --side-lb:#5b6b86;
  --radius:16px; --radius-s:10px;
  --shadow:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.06);
  --shadow-lg:0 12px 34px rgba(16,24,40,.14);
  --app-fs:16px;   /* Basis-Schriftgroesse, steuert nur Text (rem), nicht das Layout */
  --ico-size:20px;   /* Kategorie-Icons (Baum) — einstellbar unter Darstellung */
  --thumb-size:28px; /* Produkt-Miniaturen (Artikelliste) — folgt der Icon-Grösse */
  --panel:#ffffff; --panel2:#eef2f7;   /* Karten/Flächen der Planungs-Module — bisher nur als Fallback in var() */
}
/* Weisser Bild-Hintergrund „transparent" (Multiply) — abschaltbar unter Darstellung */
html[data-icoblend="1"] .cat-ico,html[data-icoblend="1"] .cd-icon,
html[data-icoblend="1"] .prod-thumb:not(.ph),html[data-icoblend="1"] .recent-th:not(.ph){mix-blend-mode:multiply}

/* ===== Theme „Neo" — weich & pastellig: heller Grund, fast-weisse Karten (klarer Vorder-/Hintergrund),
       dunkelgraue Seitenleiste ===== */
html[data-theme="neo"]{
  --accent:#7089c4; --accent-d:#5f78b3; --accent-soft:#e4e9f4;   /* Pastellblau */
  --grad:#7089c4; --grad-d:#5f78b3;
  --bg:#e8eaee; --surface:#f9fafc; --surface-2:#eef0f4; --border-2:rgba(140,148,162,.18);
  --border:rgba(140,148,162,.24);
  --text:#3a4150; --muted:#6f7684; --faint:#9aa1ae;
  --green:#5f9e7f; --amber:#c29a4a; --danger:#c4707c;            /* Pastell-Grün / -Gelb / -Rosé */
  --side:#2f333a; --side-2:#3c4149; --side-tx:#c3c8d1; --side-lb:#858c98;   /* dunkelgraue Seitenleiste */
  --radius:20px; --radius-s:13px;
  --shadow:-4px -4px 10px rgba(255,255,255,.75),5px 5px 14px rgba(151,158,172,.35);
  --shadow-lg:-6px -6px 16px rgba(255,255,255,.8),9px 9px 24px rgba(151,158,172,.42);
  --neo-inset:inset 2px 2px 6px rgba(151,158,172,.4),inset -2px -2px 6px rgba(255,255,255,.9);
}
html[data-theme="neo"] body{font-family:"Plus Jakarta Sans","Inter",system-ui,sans-serif}
/* Flächen: randlos + extrudiert */
html[data-theme="neo"] .card,html[data-theme="neo"] .kpi,html[data-theme="neo"] .set-card,html[data-theme="neo"] .dash-block{border-color:transparent;box-shadow:var(--shadow)}
/* Listenkarten (Attribute etc.) sichtbar machen: sanfter Schatten statt unsichtbarem Rand */
html[data-theme="neo"] .attr-card{border-color:transparent;box-shadow:-3px -3px 8px rgba(255,255,255,.7),4px 4px 10px rgba(151,158,172,.32)}
html[data-theme="neo"] .attr-card:hover{border-color:transparent;box-shadow:var(--shadow-lg)}
/* Chips/Badges/kleine Buttons: FLACH (kein erhabener Schatten), Pastell statt grell */
html[data-theme="neo"] .chiplet,html[data-theme="neo"] .attr-code{background:#eef0f4;box-shadow:none}
html[data-theme="neo"] .attr-type{box-shadow:none;border-color:transparent}
html[data-theme="neo"] .chiplet.sub{background:var(--accent-soft);color:var(--accent);border-color:transparent}
html[data-theme="neo"] .chiplet.brand{background:#e2ede6;color:#4c7d63;border-color:transparent}
html[data-theme="neo"] .btn.sm,html[data-theme="neo"] .btn.xs{box-shadow:none;background:var(--surface-2);border-color:var(--border-2)}
html[data-theme="neo"] .btn.sm:hover,html[data-theme="neo"] .btn.xs:hover{box-shadow:none;background:#e3e6eb}
html[data-theme="neo"] .btn.sm:active,html[data-theme="neo"] .btn.xs:active{box-shadow:var(--neo-inset)}
html[data-theme="neo"] .kpi-accent{background:var(--surface);border-color:transparent}
html[data-theme="neo"] .kpi-accent .kpi-ic{background:var(--accent);color:#fff}
/* Seitenleiste dunkelgrau — helle Schrift & Icons, aktiver Reiter in Pastellblau */
html[data-theme="neo"] .nav-item{color:var(--side-tx);font-weight:500}
html[data-theme="neo"] .nav-item svg{opacity:.9}
html[data-theme="neo"] .nav-item:hover:not(:disabled){background:var(--side-2);color:#fff}
html[data-theme="neo"] .nav-item.active{background:var(--accent);color:#fff;box-shadow:0 4px 12px rgba(112,137,196,.4)}
html[data-theme="neo"] .settings-gear.active{background:var(--accent);color:#fff}
html[data-theme="neo"] .sidebar-foot .btn{box-shadow:none}
html[data-theme="neo"] .build-tag{color:var(--side-lb)}
/* Eingaben eingelassen */
html[data-theme="neo"] input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]),
html[data-theme="neo"] select,html[data-theme="neo"] textarea{background:var(--surface);border-color:transparent;box-shadow:var(--neo-inset)}
html[data-theme="neo"] input:focus,html[data-theme="neo"] select:focus,html[data-theme="neo"] textarea:focus{border-color:transparent;box-shadow:var(--neo-inset),0 0 0 2px var(--accent-soft)}
/* Buttons: erhaben, gedrückt = inset */
html[data-theme="neo"] .btn{background:var(--surface);border-color:transparent;box-shadow:var(--shadow);border-radius:14px;font-weight:600}
html[data-theme="neo"] .btn:hover{background:var(--surface);box-shadow:var(--shadow-lg)}
html[data-theme="neo"] .btn:active{box-shadow:var(--neo-inset)}
html[data-theme="neo"] .btn.primary{background:var(--accent);color:#fff;box-shadow:-4px -4px 10px rgba(255,255,255,.5),4px 4px 12px rgba(112,137,196,.4)}
html[data-theme="neo"] .btn.primary:hover{background:var(--accent-d);box-shadow:-5px -5px 12px rgba(255,255,255,.55),5px 5px 14px rgba(112,137,196,.48)}
/* Kleinkram */
html[data-theme="neo"] .set-nav-item.active{box-shadow:var(--neo-inset)}
html[data-theme="neo"] ::-webkit-scrollbar-thumb{background:rgba(152,158,170,.55)}
html[data-theme="neo"] .sidebar{box-shadow:6px 0 18px rgba(30,34,42,.18)}
html[data-theme="neo"] .nav-badge{background:var(--amber)}
html[data-theme="neo"] .kpi-accent .kpi-ic,html[data-theme="neo"] .user-av{background:var(--accent)}
*{box-sizing:border-box}
html{font-size:var(--app-fs,16px)}
body{margin:0;height:100%}
html{height:100%}
body{font:0.906rem/1.55 "Inter",-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:var(--bg)}
.hidden{display:none !important}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:#cdd5e0;border-radius:6px;border:2px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:#b6c0cf;background-clip:padding-box}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:7px;padding:9px 15px;border:1px solid var(--border);background:var(--surface);border-radius:10px;cursor:pointer;font:inherit;font-weight:500;color:var(--text);transition:.12s}
.btn:hover{border-color:#cdd6e2;background:#fafbfd}
.btn.primary{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 2px 8px rgba(99,102,241,.32)}
.btn.primary:hover{background:var(--grad-d);border-color:transparent}
.btn.sm{padding:6px 11px;font-size:.781rem;border-radius:8px}
.btn.danger{color:var(--danger);border-color:#f3c9c9}
.btn.danger:hover{background:#fef2f2}

/* Login */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;background:linear-gradient(rgba(15,23,42,.30),rgba(15,23,42,.30)),url('/branding/login-bg') center/cover no-repeat,radial-gradient(1200px 600px at 50% -10%,#dde7fb,var(--bg))}
.login-card{width:360px;background:var(--surface);border:1px solid var(--border);border-radius:20px;box-shadow:var(--shadow-lg);padding:32px;display:flex;flex-direction:column;gap:6px}
.login-img{width:200px;max-width:100%;align-self:center;margin:4px 0 16px}
.login-logo{font-size:1.25rem;font-weight:700;color:var(--text)}
.login-sub{color:var(--muted);margin-bottom:14px}
.login-card label{font-size:.75rem;color:var(--muted);margin-top:8px;font-weight:500}
.login-card input{padding:11px 12px;border:1px solid var(--border);border-radius:10px;font:inherit}
.login-card input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.login-card .btn{margin-top:18px;justify-content:center}
.login-err{color:var(--danger);font-size:.813rem;min-height:18px;margin-top:8px}

/* App-Layout */
.app{display:flex;height:100vh}
.sidebar{width:248px;flex:0 0 248px;background:var(--side);color:var(--side-tx);display:flex;flex-direction:column;padding:20px 16px}
.brand{display:flex;flex-direction:column;gap:8px;padding:4px 8px 18px}
.brand-img{width:150px;max-width:100%;display:block}
.brand-name{font-size:.813rem;font-weight:600;color:#fff;letter-spacing:.2px}
.brand .ver{font-size:.625rem;color:var(--side-lb);font-weight:500}
.nav{display:flex;flex-direction:column;gap:2px;flex:1;overflow:auto}
.nav-section{font-size:.656rem;font-weight:700;letter-spacing:1.4px;color:var(--side-lb);margin:16px 12px 6px;text-transform:uppercase}
.nav-item{display:flex;align-items:center;gap:11px;padding:10px 12px;border:none;background:none;color:var(--side-tx);text-align:left;border-radius:10px;cursor:pointer;font:inherit;font-size:.875rem;font-weight:500;width:100%}
.nav-item svg{width:18px;height:18px;flex:0 0 18px;stroke:currentColor;fill:none;stroke-width:1.8;opacity:.85}
.nav-item .nav-lbl{flex:1}
.nav-item:hover:not(:disabled){background:var(--side-2);color:#fff}
.nav-item.active{background:var(--grad);color:#fff;box-shadow:0 4px 14px rgba(99,102,241,.42)}
.nav-item.active svg{opacity:1}
.nav-item:disabled{opacity:.45;cursor:default}
.soon{font-size:.594rem;background:var(--side-2);color:var(--side-lb);padding:2px 7px;border-radius:10px;font-weight:600;letter-spacing:.3px}
.sidebar-foot{border-top:1px solid var(--side-2);padding-top:12px;margin-top:8px;display:flex;flex-direction:column;gap:10px}
.user-card{display:flex;align-items:center;gap:10px;padding:4px 6px}
.user-av{width:36px;height:36px;flex:0 0 36px;border-radius:10px;background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.813rem}
.user-info{min-width:0;flex:1}
.user-name{font-size:.813rem;font-weight:600;color:#fff}
.user-role{font-size:.688rem;color:var(--side-lb)}
/* Einstellungen als Zahnrad rechts neben dem User (dreht 90° beim Hover) */
.settings-gear{margin-left:auto;flex:0 0 auto;width:36px;height:36px;border:none;background:transparent;color:var(--side-lb);border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}
.settings-gear svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;transition:transform .35s ease}
.settings-gear:hover{background:var(--side-2);color:#fff}
.settings-gear:hover svg{transform:rotate(90deg)}
.settings-gear.active{background:var(--grad);color:#fff}
.sidebar-foot .btn{background:var(--side-2);border-color:transparent;color:var(--side-tx);justify-content:center}
.sidebar-foot .btn:hover{background:#243352;color:#fff}
.build-tag{font-size:.625rem;color:var(--side-lb);text-align:center;letter-spacing:.5px}

.main{flex:1;overflow:auto;padding:30px 38px}
/* Klebende Kopfleiste: Suche + Ansichten + Filter bleiben beim Scrollen oben */
.sticky-head{position:sticky;top:0;z-index:30;background:var(--bg);
  margin:0 -38px 18px;padding:14px 38px 12px;
  box-shadow:0 8px 14px -12px rgba(15,23,42,.18)}
/* deckt den 30px-Padding-Streifen von .main ab, damit beim Scrollen
   nichts oberhalb der Leiste durchscheint */
.sticky-head::before{content:'';position:absolute;left:0;right:0;bottom:100%;
  height:36px;background:var(--bg)}
.sticky-head .page-head{margin-bottom:14px}
.sticky-head .view-bar{margin-bottom:0}
.sticky-head .direkt-bar{margin-bottom:12px}
.page-head{display:flex;align-items:flex-end;gap:14px;margin-bottom:22px}
.ph-left{min-width:0}
.ph-eyebrow{font-size:.688rem;font-weight:700;letter-spacing:1.5px;color:var(--accent);text-transform:uppercase;margin-bottom:4px}
.page-head h1{font-size:1.875rem;font-weight:700;margin:0;letter-spacing:-.5px}
.ph-sub{color:var(--muted);font-size:.875rem;margin-top:5px}
.page-head .spacer{flex:1}
.ph-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.muted{color:var(--muted)}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}

input,select,textarea{font-family:inherit}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}

/* Kategorie-Baum */
.tree{display:flex;flex-direction:column;gap:1px}
.tnode{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;cursor:pointer}
.tnode:hover{background:var(--accent-soft)}
.tnode.sel{background:var(--accent-soft)}
.tnode.sel .tname{color:var(--accent);font-weight:600}
.tnode .tog{width:22px;font-size:1.25em;line-height:1;text-align:center;cursor:pointer;color:var(--muted);user-select:none;flex:none}
.tnode .tog:hover{color:var(--accent)}
.tnode .tog.leaf{cursor:default;color:transparent}
.tnode .tname{flex:1;min-width:0;display:flex;align-items:center;gap:7px;font-weight:500;overflow:hidden;white-space:nowrap}
.tnode .tname>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}   /* langer Name → „…" statt hart abgeschnitten */
/* Rechte Seite: feste Spalten (Attribute · Unterkategorien · Ring ganz rechts) */
.tnode .tright{flex:none;display:flex;align-items:center;gap:8px}
.tnode .tcell{display:inline-flex;justify-content:flex-end;align-items:center;min-width:30px}   /* schmaler = mehr Platz für den Namen */
.tnode .tright .st-ring{margin-left:2px}
.tnode .tcount{font-size:.688rem;color:var(--muted);background:#eef2f7;border-radius:10px;padding:2px 9px;font-weight:600}
.tnode .tattr{font-size:.66rem;color:#3f5878;background:#eef3f9;border:1px solid #dde6f0;border-radius:8px;padding:1px 7px;font-weight:600}
.tnode .tcheck{flex:none;width:14px;height:14px;cursor:pointer;accent-color:var(--accent)}
.tnode.ctx{opacity:.45}
/* Verschiebe-Modus (Baum entsperrt) */
.cat-toolbar.unlocked{border-color:var(--accent);background:var(--accent-soft)}
.cat-toolbar .move-hint{font-size:.78rem;color:var(--accent);font-weight:600}
.cat-tree-col.moving .tnode{cursor:grab}
.cat-tree-col.moving .tnode:active{cursor:grabbing}
.tnode.dragging{opacity:.4}
.tnode.drop-into{background:var(--accent-soft);box-shadow:inset 0 0 0 2px var(--accent);border-radius:10px}
/* Kategorie-Icon (eigenes Bild) im Baum */
.cat-ico{width:var(--ico-size);height:var(--ico-size);object-fit:contain;border-radius:4px;display:block;flex:none}

/* ---- Status & Fortschritt ---- */
/* Status-Punkt: offen = hohler Ring · in Arbeit = gelb · fertig = grün — klickbar (wechselt den Status) */
.st-dot{flex:none;width:12px;height:12px;border-radius:50%;box-sizing:border-box;cursor:pointer;transition:transform .12s}
.st-dot:hover{transform:scale(1.25)}
.st-dot.s-offen{background:transparent;border:2px solid #9aa4b2}
.st-dot.s-arbeit{background:#f0b429;border:2px solid #f0b429}
.st-dot.s-kontrolle{background:#5b8def;border:2px solid #5b8def}
.st-dot.s-fertig{background:var(--green,#22c55e);border:2px solid var(--green,#22c55e)}
.st-ring{flex:none;display:inline-flex;align-items:center;justify-content:center;line-height:0}
.st-ring svg{display:block}
/* Toolbar (Auswahl + Filter) */
.cat-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px;padding:8px 12px;background:var(--surface);border:1px solid var(--border);border-radius:10px}
.cat-toolbar .sel-all{display:inline-flex;align-items:center;gap:6px;font-size:.84rem;font-weight:600;cursor:pointer}
.cat-toolbar .sel-all .tcheck{width:15px;height:15px;accent-color:var(--accent);cursor:pointer}
.cat-toolbar .flt-lbl{font-size:.78rem;font-weight:700;color:var(--muted)}
/* Status-Segmented-Control im Panel */
.st-seg{display:inline-flex;gap:4px;background:#eef2f7;border-radius:9px;padding:3px}
.st-segb{border:none;background:none;padding:6px 14px;border-radius:7px;cursor:pointer;font:inherit;font-size:.82rem;font-weight:600;color:var(--muted)}
.st-segb.on{background:var(--surface);box-shadow:var(--shadow);color:var(--text)}
.st-segb.s-offen.on{color:#64748b}
.st-segb.s-arbeit.on{color:#b7791f}
.st-segb.s-kontrolle.on{color:#3b62c4}
.st-segb.s-fertig.on{color:#15803d}
/* Fortschritt im Panel */
.cd-prog{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.cd-prog-crit{display:inline-flex;flex-direction:column;gap:4px}
.cd-prog-crit .crit{font-size:.74rem;font-weight:600}
.cd-prog-crit .crit.ok{color:#15803d}
.cd-prog-crit .crit.no{color:var(--faint)}
.cd-status{padding:14px 0;border-bottom:1px solid var(--border)}

/* ---- Kategorien: Vergleichen (Spalten) ---- */
.cmp-area{min-width:0}
.cmp-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.cmp-cols{display:flex;gap:12px;align-items:flex-start;overflow-x:auto;padding-bottom:8px}
/* Zeilen-Layout: Kategorien untereinander, Attribute horizontal */
.cmp-cols.cmp-h{flex-direction:column;overflow-x:visible}
.cmp-cols.cmp-h .cmp-col{flex:none;width:100%}
.cmp-cols.cmp-h .cmp-inh,.cmp-cols.cmp-h .cmp-own{flex-direction:row;flex-wrap:wrap;align-items:center}
.cmp-cols.cmp-h .cmp-attr{flex:none}
.cmp-cols.cmp-h .cmp-attr .ord-nm{flex:none}
.cmp-col{flex:0 0 260px;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:12px;box-shadow:var(--shadow)}
.cmp-head{display:flex;align-items:center;gap:8px;margin-bottom:2px}
.cmp-head .cmp-title{flex:1;min-width:0;font-weight:700;font-size:.95rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmp-path{font-size:.7rem;margin-bottom:6px}
.cmp-inh{display:flex;flex-direction:column;gap:4px}
.cmp-own{display:flex;flex-direction:column;gap:4px;min-height:40px;border:1px dashed transparent;border-radius:8px;padding:2px}
.cmp-own.drop-into{border-color:var(--accent);background:var(--accent-soft)}
.cmp-attr{display:flex;align-items:center;gap:5px;padding:5px 6px;background:#f7f9fc;border:1px solid var(--border);border-radius:8px;cursor:grab}
.cmp-attr:active{cursor:grabbing}
.cmp-attr.dragging{opacity:.4}
.cmp-attr.drag-over{border-color:var(--accent);box-shadow:0 -2px 0 -1px var(--accent) inset}
.cmp-attr.ro{cursor:default;background:#f2f5f9;opacity:.9}
.cmp-attr .ord-nm{flex:1;min-width:0;font-weight:600;font-size:.82rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmp-attr .ord-grip{color:#b6c2d1;font-size:.8rem;letter-spacing:-1px;user-select:none}
.cmp-attr .cmp-from{font-size:.66rem;color:var(--muted);flex:none}
.cmp-attr .chip-x{border:none;background:none;cursor:pointer;color:var(--faint);font-size:.9rem;line-height:1;padding:1px 4px;border-radius:5px}
.cmp-attr .chip-x:hover{background:#fde8e8;color:#c0392b}

/* ---- Kategorien: Zwei-Spalten (Baum + Einstellungs-Panel) ---- */
.cat-layout{display:grid;grid-template-columns:minmax(300px,420px) 1fr;gap:14px;align-items:start}
.cat-tree-col{padding:8px;max-height:calc(100vh - 190px);overflow:auto}
.cat-detail-col{padding:18px 20px;min-height:240px}
.cd-empty{padding:30px 6px;font-size:.9rem}
.cd-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:4px;font-weight:600;color:var(--text)}
.cd-crumbs i{color:var(--faint);font-style:normal;margin:0 2px}
.cd-crumbs span:last-child{color:var(--accent)}
.cd-lvlrow{display:flex;align-items:center;gap:10px;margin:8px 0 14px}
.cd-lvlrow .lvlbadge{font-size:.72rem;font-weight:700;color:#3f5878;background:#eef3f9;border:1px solid #dde6f0;border-radius:7px;padding:3px 9px}
.cd-actions{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.cd-iconrow{display:flex;align-items:center;gap:12px;padding:14px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.cd-icon{width:48px;height:48px;object-fit:contain;border-radius:8px;flex:none;mix-blend-mode:multiply}
.cd-icon.ph{display:flex;align-items:center;justify-content:center;border:1px dashed #cbd5e1;background:#f8fafc;color:var(--faint);font-size:.7rem}
.cd-iconrow.drop-over{background:var(--accent-soft);border-radius:10px;box-shadow:inset 0 0 0 2px var(--accent)}

/* ---- Attribut-Gruppen (Kategorie-Editor + Produktformular) ---- */
.cd-lbl{display:flex;align-items:center;gap:8px}
.cd-grp-head{display:flex;align-items:center;gap:8px;margin:12px 0 4px;padding:5px 10px;border-radius:9px;border-left:4px solid var(--gc,#7089c4);background:color-mix(in srgb,var(--gc,#7089c4) 10%,transparent)}
.cd-grp-head .grp-grip{cursor:grab;color:var(--faint);user-select:none;font-size:.85rem;line-height:1;flex:none}
.cd-grp-head .grp-grip:active{cursor:grabbing}
.cd-grp-head.dragging{opacity:.45}
.cd-grp-head.drop-before{box-shadow:inset 0 3px 0 var(--accent)}
.cd-grp-head.drop-after{box-shadow:inset 0 -3px 0 var(--accent)}
.grp-move{border:none;background:none;cursor:pointer;color:var(--faint);font-size:.85rem;line-height:1;padding:1px 4px;border-radius:5px;flex:none}
.grp-move:hover{background:rgba(0,0,0,.07);color:var(--text)}
.grp-color{width:26px;height:24px;padding:1px;border:none;background:none;cursor:pointer;flex:none}
.grp-name{border:none;background:none;font:inherit;font-weight:700;font-size:.85rem;color:var(--text);min-width:80px;flex:1}
.grp-name:focus{outline:none;border-bottom:1px dashed var(--gc,#7089c4)}
.grp-cnt{font-size:.7rem;color:var(--muted);white-space:nowrap}
.grp-tag{display:inline-block;padding:2px 8px;border-radius:7px;font-size:.72rem;font-weight:600;border-left:3px solid var(--gc,#7089c4);background:color-mix(in srgb,var(--gc,#7089c4) 12%,transparent);white-space:nowrap}
/* Combo: aktuell gewählter Eintrag in der offenen Liste */
.combo-item.on{font-weight:700;background:var(--accent-soft)}

/* Mehrfachauswahl kompakt: gewählte Werte als Chips + Suchfeld darunter */
.pf-tags{display:flex;flex-direction:column;gap:4px;min-width:220px}
.pf-tags-row{display:flex;flex-wrap:wrap;gap:4px}
.pf-tags-row:empty{display:none}
.pf-tag{display:inline-flex;align-items:center;gap:2px;padding:2px 6px 2px 9px;border:1px solid var(--border);border-radius:7px;font-size:.8rem;background:var(--accent-soft)}

/* Optional-Gruppen in Vorlagen (⬚): farbig markierte Abschnitte im Editor */
.rte-area .tpl-opt{border-radius:6px;padding:1px 3px;box-decoration-break:clone;-webkit-box-decoration-break:clone}

/* Gruppen-Filter (Attribute-Reiter): Klappliste mit Häkchen — Mehrfachauswahl */
.grpf-wrap{position:relative}
.grpf-btn{min-width:130px;text-align:left;cursor:pointer}
.grpf-panel{position:absolute;top:calc(100% + 4px);left:0;z-index:70;background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:0 10px 26px rgba(20,35,60,.18);padding:8px;min-width:230px;max-height:340px;overflow:auto;display:flex;flex-direction:column;gap:2px}
.grpf-row{display:flex;align-items:center;gap:8px;padding:4px 6px;border-radius:6px;cursor:pointer;font-size:.8rem;white-space:nowrap}
.grpf-row:hover{background:var(--accent-soft)}
.grp-tag.main{box-shadow:inset 0 0 0 1px var(--gc,#7089c4)}
.grp-tag .chip-x{margin-left:4px}
.attr-grps{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.attr-top .attr-grps{margin-right:16px;justify-content:flex-end}
.grp-dot{width:10px;height:10px;border-radius:3px;background:var(--gc,#7089c4);flex:none;display:inline-block}
.attr-grp-sec{margin:14px 0 6px}
.attr-grp-sec b{font-size:.85rem}
.grp-info{width:100%;border:1px dashed var(--border);border-radius:8px;padding:4px 10px;font:inherit;font-size:.76rem;color:var(--muted);margin:-2px 0 8px;background:none}
.grp-info:focus{outline:none;border-color:var(--accent);color:var(--text)}
/* Kopffelder im Produktformular (Attribute mit „Kopffeld"-Haken) */
.pf-headflds.lay-over-head{outline:2px dashed var(--accent);outline-offset:4px;border-radius:10px}
.phf-attr{position:relative}
.pf-headflds .phf.phf-attr{min-width:110px}   /* gewinnt gegen min-width:0 der allgemeinen Kopf-Regel */
/* Kopffeld-Attribute sehen aus wie die anderen Kopf-Felder: Etikett OBEN, Eingabe volle Breite —
   so wird Breiter-Ziehen sofort sichtbar (vorher: Etikett links, Feld wuchs nicht mit) */
.phf-attr .pf-row{flex-direction:column;align-items:stretch;gap:2px;border-bottom:none;padding:0;width:100%;justify-content:flex-start}
.phf-attr .pf-row .pf-ctrl{flex:0 0 auto}   /* Eingabe klebt am Namen — darf nie nach unten wegwachsen */
.phf-attr .pf-lbl{flex:0 0 auto;font-size:.68rem;letter-spacing:.4px;text-transform:uppercase;color:var(--muted)}
.phf-attr .phf-out{position:absolute;top:-4px;right:74px}
.phf-wbtn{position:absolute;top:-4px;right:14px;font-size:.62rem;padding:1px 6px}
.prod-big-imgcol{display:flex;flex-direction:column;gap:4px;align-items:center;flex:0 0 auto}
.img-tools{display:flex;gap:4px;align-items:center}
/* Varianten-Nr. im Kopf: gleiches Kleid wie die anderen Felder (volle Breite, runde Ecken) */
.pf-headflds #pf-sku{width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:8px;font-size:inherit;box-sizing:border-box;background:var(--surface)}
.pf-headflds #pf-sku:focus{border-color:var(--accent);outline:none}

/* Auswahl-Fenster: Attribute in die Merkmalsleiste einfügen (seitlich, Leiste bleibt sichtbar) */
.attrpick{position:fixed;top:86px;right:18px;bottom:18px;width:370px;background:var(--surface);border:1px solid var(--border);border-radius:14px;box-shadow:0 14px 36px rgba(20,35,60,.22);z-index:60;display:flex;flex-direction:column;padding:12px 14px;gap:6px}
.attrpick-head{display:flex;align-items:center;gap:8px}
.attrpick-list{flex:1;overflow:auto;display:flex;flex-direction:column;gap:2px;margin-top:4px}
.attrpick-list .cd-grp-head{margin:8px 0 2px}
.attrpick-row{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:8px;cursor:grab;border:1px solid transparent;font-size:.82rem}
.attrpick-row:hover{background:var(--accent-soft);border-color:var(--border)}
.attrpick-row:active{cursor:grabbing}
.attrpick-nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.attrpick-type{font-size:.68rem;color:var(--muted);flex:none}
.attrpick-foot{display:flex;align-items:center;gap:8px;border-top:1px solid var(--border);padding-top:8px}

/* Icon-Wähler aus den Medien (Kategorie) */
.icopick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.icopick-item{border:1px solid var(--border);border-radius:10px;background:var(--surface);cursor:pointer;padding:8px 6px;display:flex;flex-direction:column;align-items:center;gap:6px}
.icopick-item:hover{border-color:var(--accent)}
.icopick-item img{width:44px;height:44px;object-fit:contain}
.icopick-nm{font-size:.68rem;color:var(--muted);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cd-grpwrap{border-radius:10px;padding:4px;min-height:34px}
.cd-grpwrap.grouped{background:color-mix(in srgb,var(--gc,#7089c4) 5%,transparent);border:1px dashed color-mix(in srgb,var(--gc,#7089c4) 30%,transparent);margin-bottom:6px}
.cd-grpwrap.drag-over{outline:2px dashed var(--gc,var(--accent));outline-offset:-2px;background:color-mix(in srgb,var(--gc,#7089c4) 12%,transparent)}
/* ---- Lieferanten-Onboarding: zwei Listen + Verbindungslinien ---- */
.map-overlay{position:fixed;inset:0;z-index:150;background:rgba(15,23,42,.45);display:flex;align-items:center;justify-content:center;padding:24px}
.map-modal{background:#fff;border-radius:16px;box-shadow:0 24px 60px rgba(15,23,42,.3);width:min(980px,94vw);max-height:90vh;display:flex;flex-direction:column;overflow:hidden}
/* Kompakte Zuordnungs-Tabelle */
.map2-wrap{flex:1;overflow:auto;padding:12px 20px 18px}
.map2-row{display:grid;grid-template-columns:minmax(170px,1fr) 24px minmax(240px,1.25fr) 92px;gap:10px;align-items:center;padding:5px 8px;border-bottom:1px solid var(--border-2)}
.map2-headrow{position:sticky;top:0;background:#fff;z-index:1;border-bottom:1px solid var(--border);padding-top:2px}
.map2-h{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.map2-term{font-size:.85rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.map2-arrow{color:var(--faint);text-align:center}
.map2-sel{font:inherit;font-size:.82rem;padding:6px 9px;border:1px solid var(--border);border-radius:8px;background:#fff;width:100%;box-sizing:border-box}
.map2-row.spez{background:rgba(240,180,41,.08)}
.map2-row.spez .map2-sel{border-color:#e3b341}
.map2-row.auto .map2-term{color:var(--muted);font-weight:500}
.map2-row:hover{background:var(--accent-soft)}
.map2-row.spez:hover{background:rgba(240,180,41,.14)}
.map-head{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--border)}
.map-wrap{position:relative;flex:1;overflow:auto;padding:16px 22px;display:flex;gap:100px;align-items:flex-start;user-select:none}
.map-item[data-term]{cursor:grab}
.map-item[data-term]:active{cursor:grabbing}
.map-item.drop-hot{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);background:var(--accent-soft)}
.map-svg{position:absolute;top:0;left:0;pointer-events:none}
.map-col{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px;position:relative;z-index:1}
.map-col-h{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:4px}
.map-item{display:flex;align-items:center;gap:7px;padding:4px 9px;border:1.5px solid var(--border);border-radius:8px;background:#fff;cursor:pointer;font-size:.8rem;transition:border-color .12s,box-shadow .12s}
.map-badge{flex:none;font-size:.6rem;font-weight:800;border-radius:6px;padding:1px 6px;letter-spacing:.02em}
.map-badge.auto{background:#eef1f5;color:#7b8494}
.map-badge.spez{background:rgba(240,180,41,.2);color:#b7791f}
.map-item:hover{border-color:var(--accent)}
.map-item.sel{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.map-item.paired{border-color:var(--mc)}
.map-item .map-dot{width:9px;height:9px;border-radius:50%;background:var(--mc,transparent);border:1.5px solid var(--border);flex:none}
.map-item.paired .map-dot{border-color:var(--mc)}
.map-txt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.map-x{border:none;background:none;color:var(--faint);cursor:pointer;font-size:1rem;line-height:1;display:none;padding:0 2px}
.map-item.paired .map-x{display:block}
.map-x:hover{color:var(--danger)}
.map-add{margin-top:6px;padding:6px 10px;border:1.5px dashed var(--border);border-radius:8px;font:inherit;font-size:.8rem;background:transparent}
.map-add:focus{outline:none;border-color:var(--accent)}
/* PDF-Zeile im Auslese-Panel: Dokument + Knöpfe (ansehen/Werte) nebeneinander */
.scrape-docrow{display:flex;align-items:center;gap:8px;margin:3px 0}
.scrape-docrow .scrape-doc{flex:1;margin:0}
.scrape-docrow .btn.sm{flex:none;white-space:nowrap}
/* Bild-Lightbox: gross ansehen im Programm (kein neuer Tab) */
.lightbox{position:fixed;inset:0;z-index:200;background:rgba(10,14,22,.82);display:flex;align-items:center;justify-content:center;cursor:zoom-out;flex-direction:column;gap:12px}
.lightbox img{max-width:92vw;max-height:88vh;object-fit:contain;border-radius:10px;background:#fff;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.lightbox-hint{color:rgba(255,255,255,.75);font-size:.8rem}

/* PDF-Viewer im Panel (Browser-eigener Viewer, 1:1 wie das Original) */
.scrape-pdfframe{width:100%;flex:1;min-height:65vh;border:1px solid var(--border);border-radius:10px;background:#525659}
/* Massen-Änderung (Produkt-Tabelle) */
.pt-bulk{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 12px;margin:0 0 8px;border:1px solid var(--amber,#d97706);border-radius:10px;background:rgba(245,158,11,.07)}
.pt-bulk-lbl{font-size:.8rem;font-weight:700;color:#b45309}

/* Klickbare Prüf-Zeile (öffnet das passende Formular) */
.dash-row-click{cursor:pointer;border-radius:8px}
.dash-row-click:hover{background:var(--accent-soft)}

/* Prüf-Link zur Quelle (Entwurf → Lieferanten-Seite, springt zur Stelle) */
.dash-src{margin-left:8px;font-size:.74rem;font-weight:600;color:var(--accent);text-decoration:none;white-space:nowrap}
.dash-src:hover{text-decoration:underline}

/* „Fehlt"-Filter in der Artikelliste */
.art-missf{font:inherit;font-size:.74rem;padding:4px 6px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--muted);cursor:pointer}
.art-missf.on{border-color:var(--amber);color:#b45309;font-weight:600}

/* Was fehlt? — Dashboard-Liste */
.miss-list{display:flex;flex-direction:column}
.miss-row{display:flex;align-items:center;gap:12px;padding:9px 4px;border-bottom:1px solid var(--border-2);cursor:pointer;border-radius:8px}
.miss-row:last-child{border-bottom:none}
.miss-row:hover{background:var(--accent-soft)}
.miss-cnt{flex:none;min-width:34px;height:26px;border-radius:8px;background:rgba(245,158,11,.14);color:#b45309;font-weight:800;font-size:.8rem;display:inline-flex;align-items:center;justify-content:center;padding:0 8px}
.miss-main{flex:1;min-width:0}
.miss-name{font-size:.86rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.miss-fields{font-size:.75rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.miss-open{flex:none;font-size:.76rem;color:var(--accent);font-weight:600}

/* Kategorien-KPI: Status-Balken + Mini-Legende */
.kpi-stbar{display:flex;height:7px;border-radius:5px;overflow:hidden;margin-top:9px;gap:1px}
.kpi-stleg{display:flex;flex-wrap:wrap;gap:4px 10px;margin-top:7px}
.kpi-stitem{display:inline-flex;align-items:center;gap:5px;font-size:.7rem;color:var(--muted);white-space:nowrap}

/* Inline-Bearbeitung in der Attribut-Tabelle */
.attr-type-sel{font:inherit;font-size:.72rem;font-weight:700;color:var(--accent);background:var(--accent-soft);border:1px solid transparent;border-radius:999px;padding:2px 6px;cursor:pointer;max-width:100%}
.attr-type-sel:hover{border-color:var(--accent)}
.vis-strip.hot .vico{cursor:pointer;transition:transform .1s}
.vis-strip.hot .vico:hover{transform:scale(1.25)}

/* Gruppen-Trenner in der Vergleichs-Spalte */
.cmp-grp{display:flex;align-items:center;gap:7px;margin:8px 0 3px;padding:4px 9px;border-radius:8px;font-weight:700;font-size:.72rem;letter-spacing:.02em;color:var(--text);border-left:3px solid var(--gc,#7089c4);background:color-mix(in srgb,var(--gc,#7089c4) 9%,transparent)}
/* Farbiger Gruppen-Trenner im Produktformular */
.pf-group{grid-column:1/-1;display:flex;align-items:center;gap:8px;margin:14px 0 0;padding:6px 11px;border-radius:9px;font-weight:700;font-size:.8rem;letter-spacing:.02em;color:var(--text);border-left:4px solid var(--gc,#7089c4);background:color-mix(in srgb,var(--gc,#7089c4) 9%,transparent)}
.pf-group-dot{width:8px;height:8px;border-radius:50%;background:var(--gc,#7089c4);flex:none}

/* Langtext-Felder (Offerte, Intern, Onlineshop, Katalog …) */
.pf-longtext{width:100%;min-height:84px;resize:vertical;padding:9px 11px;border:1px solid var(--border);border-radius:10px;font:inherit;font-size:.86rem;line-height:1.5;box-sizing:border-box;background:var(--surface)}
/* Reiter „Texte": Titel oben, Feld volle Breite darunter, Werkzeug-Knöpfe UNTER dem Feld,
   mindestens ~5 Zeilen hoch und am unteren Rand von Hand vergrösserbar */
.pf-texte{display:flex;flex-direction:column;gap:12px;padding:4px 2px}
.pf-texte .pf-row{flex-direction:column;align-items:stretch;gap:4px;border-bottom:none;padding:2px 0}
.pf-texte .pf-lbl{flex:none;width:auto;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
.pf-texte .pf-row{flex:none}   /* nie eine Breiten-Vorgabe als Höhe übernehmen */
.pf-texte .pf-ctrl{width:100%;flex-direction:column;align-items:stretch;gap:6px}   /* Feld volle Breite, KI-/Vorlage-Knöpfe UNTER dem Feld */
.pf-texte .rte-wrap{display:flex;flex-direction:column}
.pf-texte .rte-area{order:1;min-height:128px;resize:vertical;overflow:auto;padding:9px 12px}
.pf-texte .rte-bar{order:2;border-bottom:none;border-top:1px solid var(--border)}
.pf-texte .pf-longtext{min-height:0}
.pf-longtext[readonly]{color:var(--muted);background:#f8fafc}
.cd-attrs{margin-top:16px}
.cd-head{font-weight:700;font-size:.95rem;margin-bottom:10px}
.cd-lbl{font-size:.72rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--muted);margin:12px 0 6px}
.cd-ownlist{display:flex;flex-wrap:wrap;gap:6px}
.cd-ownchip{display:inline-flex;align-items:center;gap:4px;padding:4px 6px 4px 5px;background:#f7f9fc;border:1px solid var(--border);border-radius:9px;cursor:grab;transition:box-shadow .1s,border-color .1s,opacity .1s}
.cd-ownchip:active{cursor:grabbing}
.cd-ownchip.dragging{opacity:.4}
.cd-ownchip.drag-over{border-color:var(--accent);box-shadow:-3px 0 0 -1px var(--accent)}
.cd-ownchip .ord-grip{color:#b6c2d1;font-size:.8rem;line-height:1;letter-spacing:-1px;user-select:none}
.cd-ownchip .ord-nm{font-weight:600;font-size:.84rem}
.cd-ownchip .ord-unit{color:var(--muted);font-weight:400}
.cd-ownchip .chip-x{border:none;background:none;cursor:pointer;color:var(--faint);font-size:.9rem;line-height:1;padding:1px 4px;border-radius:5px;margin-left:2px}
.cd-ownchip .chip-x:hover{background:#fde8e8;color:#c0392b}
.iconb{border:none;background:none;cursor:pointer;color:var(--faint);font-size:.875rem;padding:4px 7px;border-radius:8px;line-height:1}
.iconb:hover{background:#eef2f7;color:var(--text)}
.iconb.del:hover{color:var(--danger);background:#fef2f2}

/* Einstellungen */
.foot-item{width:100%}
.set-card{max-width:780px;margin-bottom:18px}
/* Breite Karten (Benutzer-Tabelle, Journal): die 780px schnitten rechts die Knöpfe ab (21.08.2026).
   Solche Karten nutzen die volle Breite; die Tabelle rollt bei Bedarf waagrecht statt zu verschwinden. */
.set-card.wide{max-width:none}
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tbl-scroll>table{min-width:100%}
/* 🛡 Sicherheits-Übersicht: Kennzahl-Kacheln + Balken-Verlauf */
.sec-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:6px 0 16px}
.sec-kpi{border:1px solid var(--border);border-radius:12px;padding:12px 14px;background:var(--card,#fff)}
.sec-kpi .k-lbl{font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;font-weight:600}
.sec-kpi .k-val{font-size:1.7rem;font-weight:700;line-height:1.25;margin-top:2px}
.sec-kpi .k-sub{font-size:.75rem;color:var(--muted)}
.sec-kpi.ok .k-val{color:#2e9e44}.sec-kpi.warn .k-val{color:#c2903f}.sec-kpi.bad .k-val{color:#dc2626}
.sec-chart{display:flex;align-items:flex-end;gap:3px;height:110px;padding:8px 10px;border:1px solid var(--border);border-radius:12px}
.sec-bar{flex:1;min-width:4px;background:var(--border-2);border-radius:3px 3px 0 0;position:relative}
.sec-bar.hat{background:#dc2626}
.sec-bar:hover{outline:2px solid var(--muted)}
.set-h{font-size:1.125rem;margin:0 0 16px;font-weight:700}
.set-sub{font-size:.875rem;color:var(--muted);margin:20px 0 12px;font-weight:600}
.backup-list{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.backup-row{display:flex;align-items:center;gap:12px;padding:8px 12px;border:1px solid var(--border);border-radius:9px;background:#fafcff}
.backup-when{font-weight:600;font-size:.875rem;font-variant-numeric:tabular-nums}
/* Link-Prüfung */
.link-report{margin-top:14px;max-height:68vh;overflow:auto}
.link-tbl{width:100%}
.link-tbl thead th{position:sticky;top:0;background:var(--surface);z-index:3}
.link-tbl th.filter-aktiv{color:var(--accent)}
/* Klick-Menü im Spalten-Titel (wie Excel-Filter) */
.kopf-menue{position:absolute;top:calc(100% - 4px);left:0;background:var(--surface);border:1px solid #e2e8f0;border-radius:10px;box-shadow:0 14px 34px rgba(15,23,42,.18);min-width:220px;padding:6px;z-index:30;font-weight:400;text-transform:none}
.kopf-menue-e{padding:7px 10px;border-radius:7px;cursor:pointer;font-size:.8rem;white-space:nowrap}
.kopf-menue-e:hover{background:#f1f5f9}
.kopf-menue-e.aktiv{font-weight:700;color:var(--accent)}
.kopf-menue-e:first-child{border-bottom:1px solid #eef2f7;border-radius:7px 7px 0 0;margin-bottom:4px}
.link-sep td{background:#f1f5f9;font-weight:600;font-size:.78rem;color:#475569;padding:8px 10px}
.link-tbl tr.row-ctrl td{background:#f8fafc;color:#64748b}
.link-tbl tr.row-aus td{background:#f8fafc;color:#a3adba}
.link-tbl tr.row-aus .link-url{color:#a3adba}
/* Zeilen-Knöpfe: vier gleich grosse, ruhige Quadrate in einer Reihe */
.link-tbl .link-akt{white-space:nowrap}
.link-tbl .link-akt .btn.xs{width:26px;height:26px;padding:0;margin:0 1px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;vertical-align:middle}
.link-tbl .link-akt .btn.xs .ico{display:flex}
.link-tbl .link-akt .btn.xs .ico svg{width:14px;height:14px}
/* Werkzeug-Leiste: alles gleich hoch und bündig */
.link-werkzeuge{display:flex;flex-wrap:wrap;gap:8px;align-items:stretch;margin-bottom:4px}
.link-werkzeuge .btn{height:38px;display:inline-flex;align-items:center;gap:6px;padding:0 14px;margin:0;border-radius:10px;white-space:nowrap}
.lstat.neutral{color:#64748b}   /* 🛡 blockiert = kein Fehler, neutral grau */
.link-tbl .ldetail{font-size:.78rem;color:#64748b;max-width:340px}
/* Suchen & Ersetzen: grosses, ruhiges Fenster — alt in Rot (nicht durchgestrichen), neu in Grün */
.modal-box:has(.se-box){max-width:none;width:min(940px,94vw)}
.se-box{padding:22px}
.se-box input[type=text]{width:100%;box-sizing:border-box;margin:4px 0 12px;padding:10px 12px;border:1px solid #e2e8f0;border-radius:10px;font-size:.86rem}
.se-vorschau{max-height:46vh;overflow:auto;border:1px solid #e2e8f0;border-radius:10px;padding:4px 10px;margin-top:6px}
.se-zeile{display:flex;gap:12px;align-items:flex-start;padding:10px 4px;border-bottom:1px solid #f1f5f9;cursor:pointer}
.se-zeile:last-child{border-bottom:none}
.se-zeile input[type=checkbox]{margin-top:3px}
.se-inhalt{flex:1;min-width:0}
.se-kopfz{display:flex;gap:8px;align-items:center;margin-bottom:3px}
.se-name{font-weight:600;font-size:.82rem}
.se-alt{color:#c0392b;word-break:break-all;font-size:.8rem;line-height:1.5}
.se-neu{color:#1d7a46;word-break:break-all;font-size:.8rem;line-height:1.5}
/* Kategorien-Vorschau: Gruppen-Zwischentitel + eingerückte Einträge */
.se-zeile.se-gruppe{background:#f8fafc;border-radius:8px;margin-top:6px;border-bottom:none}
.se-zeile.se-eintrag{margin-left:20px}
.bl-chip .chip-goto{margin-left:5px;opacity:.6;font-weight:700}
.bl-chip .chip-goto:hover{opacity:1}
/* 🤍 Weisse Logos automatisch sichtbar machen */
img.logo-hell{background:#3f4a5a;border-radius:6px;padding:2px}
img.logo-fremd{filter:drop-shadow(0 0 1px rgba(15,23,42,.5))}
/* Schnellzugriff: ★ Favoriten + 🕘 Verlauf — dynamische Aufklapp-Fenster neben der Seitenleiste */
.schnell-flyout{position:fixed;z-index:200;background:var(--surface);border:1px solid #e2e8f0;border-radius:12px;box-shadow:0 18px 44px rgba(15,23,42,.22);min-width:260px;max-width:360px;padding:8px;max-height:70vh;overflow:auto}
.schnell-titel{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#94a3b8;padding:4px 10px 6px}
.schnell-zeile{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;cursor:pointer;font-size:.84rem}
.schnell-zeile:hover{background:#f1f5f9}
.schnell-lbl{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.schnell-zurueck{font-weight:700}
.schnell-pin{color:var(--accent);font-weight:600;border-bottom:1px solid #eef2f7;border-radius:8px 8px 0 0;margin-bottom:4px}
.schnell-x{border:none;background:none;color:#94a3b8;cursor:pointer;font-size:.9rem;width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;flex:none}
.schnell-x:hover{background:#fdecec;color:#c0392b}
.schnell-leer{padding:6px 10px 10px;font-size:.8rem}
.schnell-teilen{color:var(--accent);font-weight:600;border-top:1px solid #eef2f7;border-radius:0 0 8px 8px;margin-top:4px}
/* 🖱 Gummiband-Auswahl im DAM (Rechteck wie im Explorer) */
.dam-gummi{position:fixed;z-index:400;border:1px solid var(--accent);background:rgba(76,110,245,.12);border-radius:3px;pointer-events:none}
.dam-grid{padding-bottom:56px}   /* freie Startfläche fürs Gummiband unter der letzten Reihe */
/* ★ Stern direkt am Datensatz: gefüllt = Favorit */
.fav-stern{border:none;background:none;cursor:pointer;color:#94a3b8;width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;padding:0;flex:none}
.fav-stern:hover{background:#f1f5f9;color:#c2903f}
.fav-stern.aktiv{color:#c2903f}
.fav-stern.aktiv svg{fill:currentColor}
.fav-stern svg{width:15px;height:15px}
.link-tbl td{font-size:.82rem;vertical-align:top;padding:7px 10px}
.link-tbl .link-url{font-size:.76rem;word-break:break-all;color:var(--accent);text-decoration:none}
.link-tbl tr.row-bad td{background:#fdecec}
.link-tbl tr.row-warn td{background:#fff7e6}
.lstat{white-space:nowrap;font-weight:700}
.lstat.ok{color:#1d7a46}
.lstat.warn{color:#b7791f}
.lstat.bad{color:#c0392b}
.lkind{display:inline-block;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.3px;padding:1px 6px;border-radius:6px;margin-right:2px}
.lkind.sup{background:var(--accent-soft);color:var(--accent)}
.lkind.br{background:#eef7f0;color:#1d7a46}
/* Festes 3-Spalten-Raster: Label | Feld | Aktion — alle Felder enden auf derselben Fluchtlinie */
.set-row{display:grid;grid-template-columns:140px minmax(0,1fr) 170px;align-items:center;gap:14px;margin-bottom:12px}
.set-row label{font-size:.875rem;color:var(--muted);font-weight:500}
.set-row input,.set-row select{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid var(--border);border-radius:10px;font:inherit}
.set-row input:disabled{background:#f4f6f9;color:var(--muted)}
.set-row .btn{justify-self:start}
.fs-choice{display:flex;gap:8px;flex-wrap:wrap}
.fs-wrap{display:flex;align-items:center;gap:13px;flex:1}
.fs-slider{flex:1;max-width:320px;accent-color:var(--accent);cursor:pointer;height:6px}
.fs-a{color:var(--muted);font-weight:700;line-height:1}
.fs-a-s{font-size:.8rem}
.fs-a-b{font-size:1.25rem}
.fs-val{font-weight:700;color:var(--accent);min-width:48px}
/* Einstellungen: linkes Menü + Inhalt */
.settings-layout{display:flex;gap:24px;align-items:flex-start}
.settings-nav{flex:0 0 210px;display:flex;flex-direction:column;gap:2px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:8px}
.set-nav-item{text-align:left;padding:10px 14px;border:none;background:none;border-radius:9px;cursor:pointer;font:inherit;font-size:.9rem;font-weight:500;color:var(--text)}
.set-nav-item:hover{background:#eef2f7}
.set-nav-item.active{background:var(--accent-soft);color:var(--accent);font-weight:600}
.settings-content{flex:1;min-width:0}
.settings-content .set-card{margin-bottom:0}

.utable{width:100%;border-collapse:collapse;margin-top:4px}
.utable th{text-align:left;font-size:.688rem;color:var(--muted);font-weight:600;padding:8px;border-bottom:1px solid var(--border);text-transform:uppercase;letter-spacing:.4px}
.utable td{padding:8px;border-bottom:1px solid var(--border-2);font-size:.844rem;vertical-align:middle}
.utable select{padding:5px 7px;border:1px solid var(--border);border-radius:8px}
.urow-actions{display:flex;gap:4px}
.uadd{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.uadd input,.uadd select{padding:9px 11px;border:1px solid var(--border);border-radius:10px;font:inherit}
.uadd input{flex:1;min-width:120px}

/* Such-/Listen-Felder */
.list-search{padding:10px 13px;border:1px solid var(--border);border-radius:10px;font:inherit;min-width:240px;background:var(--surface)}
.list-add{display:flex;gap:8px;align-items:center;margin-bottom:14px}
.list-add input{flex:1;padding:10px 12px;border:1px solid var(--border);border-radius:10px;font:inherit}
.list-add select{padding:10px 12px;border:1px solid var(--border);border-radius:10px;font:inherit}
.list-table{width:100%;border-collapse:collapse}
.list-table td{padding:6px;border-bottom:1px solid var(--border-2);vertical-align:middle}
.list-table tr:last-child td{border-bottom:none}
.list-table input{width:100%;padding:8px 10px;border:1px solid transparent;border-radius:8px;font:inherit;background:none}
.list-table input:hover{border-color:var(--border)}
.list-table input:focus{border-color:var(--accent);background:var(--surface)}
.ta-right{text-align:right;width:44px}
.sup-st-cell{width:160px}

/* Direktsuche-Leiste */
.direkt-bar{display:flex;align-items:center;gap:12px;margin-bottom:16px;padding:6px 8px 6px 16px}
.direkt-bar .direkt-ic{font-size:1.063rem}
.direkt-bar input{flex:1;padding:11px 12px;border:1px solid var(--border);border-radius:10px;font:inherit;background:var(--surface)}

/* Karten (Lieferanten / Marken) */
.lib-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 18px;margin-bottom:12px;cursor:pointer;transition:.14s}
.lib-card:hover{border-color:#cbd9f0;box-shadow:0 4px 14px rgba(37,99,235,.1);transform:translateY(-1px)}
.lib-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.lib-title{display:flex;align-items:center;gap:9px;flex-wrap:wrap;min-width:0}
.lib-logo{height:30px;width:auto;max-width:90px;object-fit:contain;border-radius:6px}
.lib-title .an{font-weight:700;font-size:.969rem}
.lib-title .at{font-size:.688rem;color:var(--muted);background:#eef2f7;border-radius:6px;padding:2px 7px;font-weight:600}
.card-acts{display:flex;gap:2px;flex:0 0 auto}
.sup-meta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:10px;font-size:.781rem}
.sup-meta a{color:var(--accent);text-decoration:none;font-weight:500}
.sup-meta a:hover{text-decoration:underline}
.card-notes{margin:10px 0 0;font-size:.781rem}
.sup-brands{display:flex;gap:6px;flex-wrap:wrap;margin-top:11px}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--accent-soft);border:1px solid #d7e3fb;color:#1e40af;border-radius:8px;padding:4px 10px;font-size:.75rem;font-weight:500}
.brand-chip{cursor:pointer}
.brand-chip:hover{background:#dde8fc}
/* BP-Chips auf der Medien-Kachel: verknüpfte Artikel (auch Varianten) — Klick öffnet den Artikel */
.dam-card-bps{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.dam-bp{font-size:.68rem;font-weight:600;color:#1e40af;background:var(--accent-soft);border:1px solid #d7e3fb;border-radius:7px;padding:1px 7px;cursor:pointer}
.dam-bp:hover{background:#dde8fc}
.dam-bp.mehr{color:var(--muted);background:#eef2f7;border-color:var(--border)}
/* 🔍 Lupe: Bild bildschirmfüllend mit Zoom (Mausrad) und Verschieben (Ziehen) */
.dam-lupe{position:fixed;inset:0;background:rgba(13,18,28,.93);z-index:1700;display:flex;align-items:center;justify-content:center;overflow:hidden;cursor:grab}
.dam-lupe.pan{cursor:grabbing}
.dam-lupe-img{max-width:94vw;max-height:92vh;user-select:none;box-shadow:0 8px 40px rgba(0,0,0,.5);background:#fff}
.dam-lupe-bar{position:absolute;top:14px;right:16px;display:flex;gap:6px;align-items:center;background:rgba(255,255,255,.94);border-radius:10px;padding:6px 8px;cursor:default;box-shadow:0 2px 10px rgba(0,0,0,.25)}
.dam-lupe-pct{font-size:.78rem;color:#475569;min-width:44px;text-align:right}
/* Marke entspricht dem Suchbegriff (deshalb ist der Lieferant im Treffer) → gelb statt blau */
.chip.marke-hit{background:#fef3c7;border-color:#fcd34d;color:#92400e}
.chip.marke-hit:hover{background:#fde68a}
.chip.marke-hit .brand-goto{color:#b45309}
.chip-x{cursor:pointer;color:#7d93b8;font-weight:700}
.chip-x:hover{color:var(--danger)}
.chiplet{font-size:.688rem;color:var(--muted);background:#eef2f7;border:1px solid var(--border);border-radius:8px;padding:2px 8px;font-weight:500}
.chiplet.last{background:var(--accent-soft);color:var(--text);border-color:var(--accent);font-weight:600}
.chiplet.type{background:#f1f5fb;color:#42597a;border-color:#e1e9f4}
.qbadge{font-size:.688rem;border-radius:8px;padding:2px 9px;border:1px solid;font-weight:600}
.qbadge.q-good{color:var(--green);background:#ecfdf3;border-color:#bbf7d0}
.qbadge.q-mid{color:var(--amber);background:#fffbeb;border-color:#fde68a}
.qbadge.q-bad{color:var(--danger);background:#fef2f2;border-color:#fecaca}
.type-chips{display:flex;gap:7px;flex-wrap:wrap}
.type-chip{padding:7px 13px;border:1px solid var(--border);background:var(--surface);border-radius:10px;cursor:pointer;font:inherit;font-size:.781rem;font-weight:500;color:var(--muted)}
.type-chip:hover{border-color:#bcd0e6}
.type-chip.on{background:var(--accent);border-color:var(--accent);color:#fff}
.sup-status{padding:3px 10px;border-radius:8px;font-size:.719rem;border:1px solid var(--border);font-weight:600}
.sup-status.s-on{color:var(--green);border-color:#bbf7d0;background:#ecfdf3}
.sup-status.s-off{color:var(--danger);border-color:#fecaca;background:#fef2f2}
.sup-status.s-wait{color:var(--amber);border-color:#fde68a;background:#fffbeb}
.filter-tag{display:inline-flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:6px 12px;margin-bottom:12px;font-size:.813rem}

/* Detail-Panel (rechts reinschiebend) */
.panel-overlay{position:fixed;inset:0;background:rgba(15,23,42,.4);opacity:0;pointer-events:none;transition:opacity .2s;z-index:60;backdrop-filter:blur(1px)}
.panel-overlay.open{opacity:1;pointer-events:auto}
.detail-panel{position:fixed;top:0;right:0;height:100vh;width:540px;max-width:94vw;background:var(--surface);box-shadow:-8px 0 40px rgba(15,23,42,.2);transform:translateX(100%);transition:transform .24s cubic-bezier(.4,0,.2,1);z-index:61;display:flex}
.detail-panel.open{transform:translateX(0)}
.panel-inner{display:flex;flex-direction:column;width:100%;height:100%}
.panel-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--border)}
.panel-head h2{margin:0;font-size:1.125rem;font-weight:700}
.panel-body{flex:1;overflow:auto;padding:20px 22px;display:flex;flex-direction:column;gap:14px}
.panel-foot{display:flex;align-items:center;gap:8px;padding:16px 22px;border-top:1px solid var(--border);background:#fafbfd}
.fld{display:flex;flex-direction:column;gap:5px}
.fld label{font-size:.75rem;color:var(--muted);font-weight:600}
.fld input,.fld select,.fld textarea{padding:9px 11px;border:1px solid var(--border);border-radius:10px;font:inherit;width:100%}
.fld textarea{resize:vertical}
.fld-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.search-row{display:flex;gap:8px;align-items:center}
.search-row input{flex:1}
.search-prev{font-size:.75rem;margin-top:6px;word-break:break-all;color:var(--muted)}
.search-prev .tok{background:#fef9c3;color:#854d0e;border-radius:4px;padding:1px 5px;font-weight:700}
.logo-box{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.logo-prev{height:48px;max-width:130px;object-fit:contain;border:1px solid var(--border);border-radius:8px;background:#fff;padding:4px}
.chips{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:8px}

/* Ansichts-Umschalter */
.view-bar{display:flex;align-items:center;gap:16px;margin-bottom:16px;flex-wrap:wrap}
.view-switch{display:inline-flex;background:#e9edf3;border-radius:10px;padding:3px}
.vbtn{border:none;background:none;padding:7px 16px;border-radius:8px;cursor:pointer;font:inherit;font-size:.84rem;font-weight:600;color:var(--muted)}
.vbtn.on{background:var(--surface);color:var(--accent);box-shadow:var(--shadow)}
.col-sel{display:inline-flex;align-items:center;gap:6px;font-size:.84rem}
.cbtn{width:30px;height:30px;border:1px solid var(--border);background:var(--surface);border-radius:8px;cursor:pointer;font:inherit;font-weight:600;color:var(--muted)}
.cbtn.on{background:var(--accent);border-color:var(--accent);color:#fff}
.filter-row{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap}
.filter-ctl{display:flex;flex-direction:column;gap:3px}
.filter-lbl{font-size:.62rem;text-transform:uppercase;letter-spacing:.5px;color:var(--faint);font-weight:700}
.filter-sel{padding:7px 10px;border:1px solid var(--border);border-radius:8px;font:inherit;font-size:.82rem;background:var(--surface);cursor:pointer}

/* Kompakt-Ansicht */
.kompakt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(420px,1fr));gap:10px}
.kompakt-item{display:flex;align-items:center;gap:9px;padding:9px 12px;background:var(--surface);border:1px solid var(--border);border-radius:10px;cursor:pointer;transition:.12s;overflow:hidden}
.kompakt-item:hover{border-color:#bcd0e6;background:#fafcff}
.ki-logo{height:18px;max-width:34px;object-fit:contain;border-radius:3px}
.ki-dot{width:8px;height:8px;border-radius:50%;flex:0 0 8px}
.ki-dot.s-on{background:var(--green)} .ki-dot.s-off{background:#cbd5e1}
.ki-name{flex:1;font-weight:600;font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ki-count{font-size:.7rem;color:var(--muted);background:#eef2f7;border-radius:10px;min-width:20px;text-align:center;padding:1px 6px}
.ki-ind{display:inline-flex;align-items:center;gap:3px;color:var(--faint);flex:0 0 auto}
.ind-ico{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.7;display:block}
.ki-n{font-size:.6rem;font-weight:700}
.line-toggle{margin-top:10px;border:none;background:none;cursor:pointer;font:inherit;font-size:.78rem;font-weight:600;color:var(--muted);padding:2px 0}
.line-toggle:hover{color:var(--text)}

/* Karten-Ansicht (Raster) */
.karten-grid{display:grid;gap:16px}
.karten-grid.cols-2{grid-template-columns:repeat(2,1fr)}
.karten-grid.cols-3{grid-template-columns:repeat(3,1fr)}
.karten-grid.cols-4{grid-template-columns:repeat(4,1fr)}
.mk-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:15px}
.mk-head{display:flex;align-items:center;gap:9px;flex-wrap:wrap;cursor:pointer}
.mk-head .an{font-weight:700;font-size:.95rem;flex:1;min-width:0}
.line-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.line-chip{background:#eef2f7;border-color:#e0e6ee;color:#475569}
.mk-add{margin-top:11px;display:flex;gap:8px;flex-wrap:wrap}
.mini-line-add{padding:6px 9px;border:1px dashed #c3d2e6;border-radius:8px;font:inherit;font-size:.8rem;color:var(--accent);background:#f6f9ff;max-width:150px}
.mini-pick{padding:6px 9px;border:1px dashed #c3d2e6;border-radius:8px;font:inherit;font-size:.8rem;color:var(--accent);background:#f6f9ff;cursor:pointer;max-width:100%}

/* Tabelle (Excel) */
.excel-wrap{padding:0;overflow:hidden}
/* Excel-artiger Scroll-Container: horizontal + vertikal scrollbar, Spaltenkopf klebt oben */
.grid-scroll{overflow:auto;max-height:calc(100vh - 16.5rem);border:1px solid var(--border);border-radius:12px;background:var(--surface)}
.grid-scroll .excel-table{table-layout:fixed;border-collapse:collapse}
.grid-scroll .excel-table th{position:sticky;top:0;z-index:3;white-space:nowrap}
.grid-scroll .excel-table th.cb-col{z-index:4}
.grid-scroll .excel-table td{vertical-align:top;overflow:hidden}
/* Inhalt oben ausrichten + vertikale Spaltenlinien (überall in Tabellen) */
.excel-table td,.excel-table th,.utable td,.utable th{vertical-align:top !important;border-right:1px solid var(--border-2)}
.excel-table td:last-child,.excel-table th:last-child,.utable td:last-child,.utable th:last-child{border-right:none}
.excel-table td.ta-center{vertical-align:top !important;padding-top:9px}
.grid-scroll .excel-table .name-in{width:100%;min-width:0;max-width:none}
/* Eingefrorene Spalten: links haften beim horizontalen Scrollen */
.grid-scroll .excel-table td.frozen,.grid-scroll .excel-table th.frozen{position:sticky;background:var(--surface);z-index:2}
.grid-scroll .excel-table th.frozen{z-index:4;background:#f7f9fc}
.grid-scroll .excel-table .fz-cb{left:0}
.grid-scroll .excel-table .fz-name{left:36px;box-shadow:1px 0 0 var(--border)}
.grid-scroll .excel-table tr:hover td.frozen{background:#fafcff}
.grid-scroll .excel-table tr.row-sel td.frozen{background:var(--accent-soft)}
.grid-scroll .excel-table .add-row td.frozen{background:#f7f9fc}
.grid-scroll .excel-table .fz-edge{box-shadow:1px 0 0 var(--border)}
/* Löschen-Spalte rechts festpinnen — der × ist so IMMER sichtbar (kein horizontales Scrollen nötig) */
.grid-scroll .excel-table td.ta-right,.grid-scroll .excel-table th.ta-right{position:sticky;right:0;background:var(--surface);z-index:2;box-shadow:-1px 0 0 var(--border)}
.grid-scroll .excel-table th.ta-right{z-index:4;background:#f7f9fc}
.grid-scroll .excel-table tr:hover td.ta-right{background:#fafcff}
.grid-scroll .excel-table tr.row-sel td.ta-right{background:var(--accent-soft)}
.grid-scroll .excel-table .add-row td.ta-right{background:#f7f9fc}
/* Spaltenkopf mit ▾-Menü — WICHTIG: th bleibt Tabellenzelle (kein display:flex!),
   der Knopf wird absolut positioniert. */
.grid-scroll .excel-table th.col-th{padding-right:24px;overflow:hidden;text-overflow:ellipsis}
.col-th .col-sort{color:var(--accent);font-weight:700;margin-left:3px}
.col-menu-btn{position:absolute;right:3px;top:50%;transform:translateY(-50%);border:none;background:none;cursor:pointer;color:var(--muted);font-size:.7rem;line-height:1;padding:3px 4px;border-radius:5px}
.col-menu-btn:hover{background:var(--border);color:var(--text)}
/* Aufklapp-Menü */
.col-menu{position:fixed;z-index:90;background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow);padding:6px;min-width:210px;max-width:340px;max-height:60vh;overflow:auto}
.col-menu-item{display:block;width:100%;text-align:left;border:none;background:none;padding:8px 10px;border-radius:7px;font:inherit;font-size:.85rem;cursor:pointer;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.col-menu-item:hover{background:var(--accent-soft)}
.col-menu-item.active{color:var(--accent);font-weight:600}
.col-menu-item.danger:hover{background:#fde8e8;color:#c0392b}
.col-menu-item.disabled{color:var(--muted);cursor:default}
.col-menu-item.disabled:hover{background:none}
.col-menu-head{padding:6px 10px 8px;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.col-menu-sep{height:1px;background:var(--border);margin:5px 4px}
/* Produktlinien-Popup (Suchfeld + Chips) */
.col-menu.pop{min-width:300px;max-width:440px;max-height:82vh;overflow:auto}
.bl-note{font-size:.78rem;color:#c0392b;padding:0 4px 6px}
.bl-search{width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:8px;font:inherit;margin:2px 0 10px;box-sizing:border-box}
.bl-search:focus{border-color:var(--accent);outline:none}
.bl-chips{display:flex;flex-wrap:wrap;gap:6px;padding:1px}
.bl-chip{cursor:pointer;border:none;font:inherit}
.bl-chip.line-chip:hover{background:var(--accent-soft);color:var(--accent)}
.bl-chip.cat-chip{background:var(--accent-soft);color:var(--accent)}
.bl-chip.cat-chip:hover{background:var(--accent);color:#fff}
.bl-grp{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);margin:12px 2px 6px}
.bl-add{min-width:130px;padding:5px 9px;border:1px dashed var(--border);border-radius:999px;font:inherit;font-size:.8rem;background:none;color:var(--accent)}
.bl-add:focus{border-style:solid;border-color:var(--accent);outline:none}
.bl-chip.dl-chip{background:#eaf7ef;color:#1d7a46}
.bl-chip.dl-chip:hover{background:#1d7a46;color:#fff}
.chip.dl-chip{background:#eaf7ef;color:#1d7a46;max-width:200px;overflow:hidden;text-overflow:ellipsis}
.dl-addrow{display:flex;gap:6px;margin-top:6px}
.dl-addrow .dl-name{flex:0 0 90px;min-width:0;color:var(--text)}
.dl-addrow .dl-url{flex:1;min-width:0;color:var(--text)}
/* Direkt-Links-Editor im Marken-Detail */
.link-rows{display:flex;flex-direction:column;gap:6px;margin-bottom:8px}
.link-row{display:flex;gap:6px;align-items:center}
.link-row input{flex:1;min-width:0}
.link-row input:first-child{flex:0 0 130px}
.bl-foot{display:flex;gap:8px;margin-top:12px;padding-top:10px;border-top:1px solid var(--border)}
.cat-edit{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
/* Ausgeblendete Spalten */
.hidden-cols{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.btn.xs{padding:3px 9px;font-size:.75rem}
/* Schlichte Lupe */
.ic-search{width:16px;height:16px;display:inline-block;vertical-align:middle}
.iconb .ic-search{width:17px;height:17px}
.chiplet .ic-search{width:13px;height:13px;margin-right:4px}
.direkt-ic{color:var(--muted);display:flex;align-items:center}
.direkt-ic .ic-search{width:18px;height:18px}
/* Fortschritt: wie weit ausgefüllt */
.compl{display:flex;align-items:center;gap:8px;margin:10px 0 4px}
.compl-track{flex:1;height:6px;background:var(--border-2);border-radius:99px;overflow:hidden}
.compl-fill{height:100%;border-radius:99px;background:var(--accent);transition:width .2s}
.compl-fill.low{background:#e0526b}
.compl-fill.mid{background:#e0a23a}
.compl-fill.high{background:#2bb673}
.compl-pct{font-size:.72rem;color:var(--muted);font-weight:700;min-width:30px;text-align:right;font-variant-numeric:tabular-nums}
.compl-mini{width:44px;height:5px;background:var(--border-2);border-radius:99px;overflow:hidden;flex:none}
/* %-Spalte vorne in den Tabellen */
.compl-num{font-weight:700;font-size:.78rem;font-variant-numeric:tabular-nums}
.compl-num.low{color:#e0526b}
.compl-num.mid{color:#d98a1f}
.compl-num.high{color:#1d9e63}
.grid-scroll .excel-table th.compl-col,.grid-scroll .excel-table td.compl-col{text-align:center;padding-left:4px;padding-right:4px}
/* Marken-Zelle: viele Chips -> innerhalb der Zelle scrollen, Zeile bleibt kompakt */
.grid-scroll .cell-flex{max-height:92px;overflow:auto;align-content:flex-start}
.excel-table{width:100%;border-collapse:collapse}
.excel-table th{text-align:left;font-size:.7rem;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);font-weight:700;padding:11px 14px;border-bottom:1px solid var(--border);background:#f7f9fc}
.excel-table td{padding:7px 14px;border-bottom:1px solid var(--border-2);vertical-align:middle}
.excel-table tr:hover td{background:#fafcff}
.excel-table input{width:100%;padding:7px 9px;border:1px solid transparent;border-radius:8px;font:inherit;background:none}
/* Name/Code wachsen dynamisch mit dem Inhalt (size-Attribut), statt abzuschneiden */
.excel-table .name-in{width:auto;min-width:150px;max-width:520px;font-weight:600}
.excel-table .code-in{width:auto;min-width:80px;max-width:240px}
.excel-table input:hover{border-color:var(--border)}
.excel-table input:focus{border-color:var(--accent);background:var(--surface)}
.excel-table td{vertical-align:top}
.cell-flex{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.excel-table td:first-child,.excel-table td:nth-child(2){vertical-align:middle}
.excel-table .add-row td{background:#f7f9fc}
.cb-col{width:36px;text-align:center}
.excel-table tr.row-sel td{background:var(--accent-soft)}
.cell-add{min-width:100px;border-style:dashed !important;color:var(--accent)}
/* Massen-Leiste */
.bulk-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:#0f172a;color:#fff;border-radius:12px;padding:10px 16px;margin-bottom:14px;box-shadow:var(--shadow)}
.bulk-count{font-weight:700;font-size:.85rem;white-space:nowrap}
.bulk-in{padding:7px 10px;border:1px solid #334155;border-radius:8px;font:inherit;font-size:.82rem;background:#1e293b;color:#fff;max-width:170px}
.bulk-bar .btn{background:#1e293b;border-color:#334155;color:#fff}
.bulk-bar .btn:hover{background:#27364d;border-color:#475569}
.bulk-bar .btn.danger{color:#fca5a5;border-color:#7f1d1d}
.bulk-bar .btn.danger:hover{background:#3a1414}

/* z-index 2000: Rückmeldungen müssen ÜBER allen Fenstern liegen (Ernten-Panel, Vorschau, Menüs) — sonst unsichtbar */
.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(80px);background:#0f172a;color:#fff;padding:12px 18px;border-radius:12px;opacity:0;transition:.25s;z-index:2000;font-size:.844rem;box-shadow:var(--shadow-lg)}
.toast.show{transform:translateX(-50%) translateY(0);opacity:1}
.toast-undo{margin-left:14px;background:none;border:none;color:#7dd3fc;font:inherit;font-weight:700;cursor:pointer;padding:0}
.toast-undo:hover{color:#bae6fd;text-decoration:underline}

/* ===== Einheiten-Modul ===== */
.u-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
@media(max-width:1100px){.u-grid{grid-template-columns:1fr}}
.u-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:16px 18px;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.u-card:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.u-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.u-icon{width:34px;height:34px;flex:none;display:flex;align-items:center;justify-content:center;border-radius:9px;background:var(--accent-soft);color:var(--accent)}
.u-icon .u-ico{width:20px;height:20px}
.u-icon-img{width:24px;height:24px;object-fit:contain;border-radius:5px}
.u-ico{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.u-title{flex:1;min-width:0}
.u-name{font-weight:700;font-size:1rem}
.u-count{font-size:.78rem}
.u-base{flex:none;font-size:.72rem;font-weight:700;color:var(--accent);background:var(--accent-soft);padding:3px 9px;border-radius:999px;white-space:nowrap}
.u-chips{display:flex;flex-wrap:wrap;gap:6px}
.u-chip{display:inline-flex;align-items:center;gap:5px;background:#f3f5f9;border:1px solid var(--border-2);border-radius:8px;padding:4px 9px;font-size:.82rem}
.u-chip.base{background:var(--accent-soft);border-color:transparent}
.u-chip b{font-weight:700}
.u-uname{font-size:.76rem}
.u-fac-b{font-size:.72rem;color:var(--muted);font-variant-numeric:tabular-nums}

/* Modal-Dialog */
.modal-ov{position:fixed;inset:0;z-index:120;background:rgba(15,23,42,.45);display:flex;align-items:center;justify-content:center;padding:24px}
.modal-box{background:var(--surface);border-radius:16px;box-shadow:0 24px 60px rgba(15,23,42,.3);width:100%;max-width:680px;max-height:90vh;overflow:auto}
.unit-edit{padding:26px 28px}
.unit-edit h2{margin:0 0 18px;font-size:1.25rem}
.ue-lbl{display:block;font-size:.8rem;font-weight:600;color:var(--muted);margin:14px 0 6px}
.unit-edit > input[type=text]{width:100%;padding:11px 13px;border:1px solid var(--border);border-radius:9px;font:inherit;box-sizing:border-box}
.unit-edit > input[type=text]:focus{border-color:var(--accent);outline:none}
.icon-grid{display:flex;flex-wrap:wrap;gap:8px}
.icon-btn{width:42px;height:42px;border:1px solid var(--border);border-radius:9px;background:var(--surface);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text);padding:0}
.icon-btn:hover{border-color:var(--accent)}
.icon-btn.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
.icon-btn .u-ico{width:22px;height:22px}
.icon-btn .u-cust{width:26px;height:26px;object-fit:contain}
.icon-up{font-size:1.4rem;color:var(--accent);border-style:dashed}
.unit-head{display:grid;grid-template-columns:1fr 130px 130px 28px;gap:8px;margin:16px 0 6px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}
.unit-rows{display:flex;flex-direction:column;gap:8px}
.unit-row{display:grid;grid-template-columns:1fr 130px 130px 28px;gap:8px;align-items:center}
.unit-row input{padding:9px 11px;border:1px solid var(--border);border-radius:8px;font:inherit;width:100%;box-sizing:border-box}
.unit-row input:focus{border-color:var(--accent);outline:none}
.ue-foot{display:flex;align-items:center;gap:10px;margin-top:22px;padding-top:16px;border-top:1px solid var(--border)}

/* ===== Werte-Modul ===== */
.list-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:4px}
.lchip{border:1px solid var(--border);background:var(--surface);border-radius:999px;padding:5px 13px;font:inherit;font-size:.8rem;cursor:pointer;color:var(--text)}
.lchip:hover{border-color:var(--accent)}
.lchip.on{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
.val-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:1300px){.val-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.val-grid{grid-template-columns:1fr}}
.val-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:14px 16px;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.val-card:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.val-head{display:flex;align-items:center;gap:8px;margin-bottom:9px}
.val-name{font-weight:700;font-size:.95rem}
.val-parent{font-size:.72rem;color:var(--muted)}
.val-list{flex:none;font-size:.7rem;font-weight:700;color:var(--accent);background:var(--accent-soft);padding:2px 9px;border-radius:999px;white-space:nowrap}
.val-syns{display:flex;flex-wrap:wrap;gap:5px}
.syn-chip{display:inline-flex;align-items:center;gap:5px;background:#f3f5f9;border:1px solid var(--border-2);border-radius:8px;padding:3px 9px;font-size:.8rem}
.syn-lang{font-size:.6rem;font-weight:800;letter-spacing:.4px;color:#fff;background:var(--accent);border-radius:4px;padding:1px 4px}
/* Werte-Editor */
.val-grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.val-grid2 select,.val-grid2 input{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:9px;font:inherit;box-sizing:border-box;margin-top:0}
.val-grid2 input{margin-top:6px}
.unit-edit select{padding:10px 12px;border:1px solid var(--border);border-radius:9px;font:inherit}
.syn-rows{display:flex;flex-direction:column;gap:7px}
.syn-row{display:grid;grid-template-columns:1fr 80px 28px;gap:8px;align-items:center}
.syn-row input{padding:9px 11px;border:1px solid var(--border);border-radius:8px;font:inherit;width:100%;box-sizing:border-box}
.syn-lang-sel{padding:9px 6px;border:1px solid var(--border);border-radius:8px;font:inherit}
.syn-tools{display:flex;align-items:center;gap:8px;margin-top:10px;flex-wrap:wrap}

/* ---- Werte: Zwei-Spalten (Listen links, Werte rechts) ---- */
.val-layout{display:flex;align-items:flex-start;gap:0}
.val-lists{flex:0 0 232px;align-self:stretch;border-right:1px solid var(--border);padding-right:14px;position:sticky;top:0;max-height:calc(100vh - 40px);overflow:auto}
.vl-head{display:flex;align-items:center;justify-content:space-between;padding:2px 8px 12px;font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--faint)}
.vl-head .iconb{font-size:1.1rem;font-weight:700}
.vl-items{display:flex;flex-direction:column;gap:2px}
.vl-item{display:flex;align-items:center;gap:8px;width:100%;padding:8px 10px;border:none;background:none;border-radius:9px;cursor:pointer;font:inherit;text-align:left;color:var(--text)}
.vl-item:hover{background:var(--accent-soft)}
.vl-item.on{background:var(--accent);color:#fff}
.vl-item .vl-name{flex:1;min-width:0;font-weight:600;font-size:.86rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vl-item .vl-count{flex:none;font-size:.68rem;font-weight:700;background:#eef2f7;color:var(--muted);border-radius:999px;padding:1px 8px}
.vl-item.on .vl-count{background:rgba(255,255,255,.25);color:#fff}
.vl-item .vl-acts{display:none;gap:0;flex:none}
.vl-item:hover .vl-acts{display:flex}
.vl-item.on .vl-acts .iconb{color:rgba(255,255,255,.85)}
.vl-item.on .vl-acts .iconb:hover{background:rgba(255,255,255,.2);color:#fff}
.val-main{flex:1;min-width:0;padding-left:26px}
.val-main .page-head{margin-top:0}
@media(max-width:900px){.val-layout{flex-direction:column}.val-lists{flex:none;width:100%;border-right:none;border-bottom:1px solid var(--border);position:static;max-height:none;padding:0 0 12px;margin-bottom:14px}.vl-items{flex-direction:row;flex-wrap:wrap}.vl-item{width:auto}.val-main{padding-left:0}}

/* ---- Werte-Editor: Synonyme als Token in Sprach-Spuren ---- */
.syn-lanes{display:flex;flex-direction:column;gap:7px}
.syn-lane{display:flex;align-items:flex-start;gap:10px;padding:7px 9px;border:1px solid var(--border);border-radius:10px;background:var(--surface);transition:border-color .12s,background .12s}
.syn-lane.lane-none{background:#f7f9fc}
.syn-lane.drop{border-color:var(--accent);border-style:dashed;background:var(--accent-soft)}
.lane-code{flex:0 0 34px;text-align:center;font-size:.72rem;font-weight:800;color:var(--accent);padding-top:7px;letter-spacing:.5px}
.syn-lane.lane-none .lane-code{color:var(--faint)}
.lane-chips{flex:1;min-width:0;display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.lane-in{flex:1;min-width:110px;border:none;background:none;font:inherit;font-size:.86rem;padding:5px 4px;outline:none;color:var(--text)}
.lane-in::placeholder{color:var(--faint)}
.syn-token{display:inline-flex;align-items:center;gap:5px;background:var(--accent-soft);color:var(--accent);border:1px solid #cfe0f2;border-radius:8px;padding:3px 6px 3px 5px;font-size:.84rem;cursor:grab;user-select:none}
.syn-token:active{cursor:grabbing}
.syn-token.dragging{opacity:.45}
.syn-lane.lane-none .syn-token{background:#eef1f5;color:#4a5a6e;border-color:var(--border)}
.tok-grip{color:var(--faint);font-size:.7rem;line-height:1;cursor:grab}
.tok-text{font-weight:500}
.tok-x{border:none;background:none;cursor:pointer;color:inherit;opacity:.65;font-size:.95rem;line-height:1;padding:0 1px;border-radius:5px}
.tok-x:hover{opacity:1;background:rgba(0,0,0,.07)}

/* ---- Einstellungen: Sprachen ---- */
.lang-list{display:flex;flex-direction:column;gap:8px}
.lang-row{display:flex;align-items:center;gap:10px}
.lang-badge{flex:0 0 38px;text-align:center;font-size:.72rem;font-weight:800;color:var(--accent);background:var(--accent-soft);border-radius:7px;padding:5px 0}
.lang-code{flex:0 0 90px;padding:8px 10px;border:1px solid var(--border);border-radius:8px;font:inherit;text-transform:lowercase}
.lang-label{flex:1;padding:8px 10px;border:1px solid var(--border);border-radius:8px;font:inherit}
.lang-tools{flex:0 0 auto;display:flex;gap:2px}
.lang-tools .iconb:disabled{opacity:.3;cursor:default}
.lang-foot{display:flex;align-items:center;gap:10px;margin-top:14px}

/* ---- Werte-Editor: Unterwerte + Lieferant ---- */
.sub-box{margin-bottom:6px}
.sub-list{display:flex;flex-direction:column;gap:5px;border:1px solid var(--border);border-radius:10px;padding:8px}
.sub-row{display:flex;align-items:center;gap:8px;padding:5px 7px;border-radius:8px}
.sub-row:hover{background:#f7f9fc}
.sub-name{font-weight:600;font-size:.88rem;cursor:pointer;color:var(--accent)}
.sub-name:hover{text-decoration:underline}
.sub-sup{font-size:.7rem;font-weight:600;color:#4a5a6e;background:#eef1f5;border:1px solid var(--border);border-radius:999px;padding:1px 8px}
.sub-add{display:flex;align-items:center;gap:7px;margin-top:4px;padding-top:8px;border-top:1px dashed var(--border)}
.sub-in{flex:1;min-width:120px;padding:8px 10px;border:1px solid var(--border);border-radius:8px;font:inherit}
.sub-sup-sel{flex:0 0 auto;padding:8px 8px;border:1px solid var(--border);border-radius:8px;font:inherit;font-size:.82rem;max-width:170px}
.chiplet.sub{background:var(--accent-soft);color:var(--accent);border-color:#cfe0f2}
.chiplet.sup{background:#eef1f5;color:#4a5a6e}

/* ---- Lieferant: „Alle Produktlinien"-Sammelchip ---- */
.chip.alllines-chip{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:600;cursor:pointer}
.chip.alllines-chip:hover{filter:brightness(1.07)}

/* ---- Werte-Tabelle: Mehrfach-Auswahl, Drag-Griff, Sammel-Leiste ---- */
.bulk-bar{display:flex;align-items:center;gap:12px;padding:9px 12px;margin-bottom:10px;background:var(--accent-soft);border:1px solid #cfe0f2;border-radius:10px}
.bulk-count{font-weight:700;color:var(--accent);font-size:.9rem}
.excel-table th.fz-check,.excel-table td.fz-check{padding:0;text-align:center;background:var(--surface)}
.excel-table td.fz-check{cursor:grab}
.excel-table td.fz-check:active{cursor:grabbing}
.fz-check{white-space:nowrap}
.row-grip{color:var(--faint);font-size:.7rem;margin-right:2px;vertical-align:middle;cursor:grab}
.excel-table tr.sel td{background:#eaf2fc !important}
.excel-table tr.sel td.frozen{background:#eaf2fc !important}
.vl-item.drop{outline:2px dashed var(--accent);outline-offset:-2px;background:var(--accent-soft)}

/* ---- Wertelisten-Regel: aktives Zahnrad + Pflicht-Eltern-Markierung ---- */
.vl-item .vl-acts .iconb.on{color:var(--accent)}
.vl-item.on .vl-acts .iconb.on{color:#fff;background:rgba(255,255,255,.18)}
.unit-edit select.required{border-color:var(--accent);background:var(--accent-soft)}

/* ---- Verknüpfte Wertelisten: Markierung + Beschreibung ---- */
.vl-item .vl-link{flex:none;font-size:.74rem;opacity:.8;margin-left:-2px}
.vl-item.linked .vl-name{font-weight:600}
.link-banner{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;margin:-4px 0 14px;padding:9px 13px;background:var(--accent-soft);border:1px solid #cfe0f2;border-radius:10px;font-size:.85rem;color:#2c3e52}
.lb-item{display:inline-flex;align-items:center;gap:5px}
.lb-ic{font-size:.85rem}
.lb-link{color:var(--accent);font-weight:600;text-decoration:none}
.lb-link:hover{text-decoration:underline}

/* ---- Werte: verknüpfte Marken + Lieferanten (Tag-Felder + Chiplets) ---- */
.tag-field{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:7px 8px;border:1px solid var(--border);border-radius:9px;background:var(--surface);min-height:42px;box-sizing:border-box;margin-top:6px}
.tag-chip{display:inline-flex;align-items:center;gap:5px;background:var(--accent-soft);color:var(--accent);border:1px solid #cfe0f2;border-radius:8px;padding:3px 6px 3px 9px;font-size:.84rem;font-weight:500}
.tag-x{border:none;background:none;cursor:pointer;color:inherit;opacity:.65;font-size:.95rem;line-height:1;padding:0 1px;border-radius:5px}
.tag-x:hover{opacity:1;background:rgba(0,0,0,.08)}
.tag-add{flex:1;min-width:130px;border:none;background:none;font:inherit;font-size:.84rem;color:var(--muted);outline:none;cursor:pointer}
.chiplet.brand{background:#eef4ec;color:#3f6b46;border-color:#d6e6d2}
.chiplet.sup{background:#eef1f5;color:#4a5a6e}

/* ---- Export-Dialog: Listenauswahl ---- */
.exp-all{display:flex;align-items:center;gap:8px;font-size:.95rem;margin:6px 0 2px}
/* Attribut-Sichtbarkeit (Matrix) */
.vis-matrix{display:flex;flex-wrap:wrap;gap:7px 16px;padding:8px 10px;background:#f7f9fc;border:1px solid var(--border);border-radius:9px}
.vis-item{display:inline-flex;align-items:center;gap:6px;font-size:.85rem;font-weight:600;cursor:pointer}
.vis-item input{accent-color:var(--accent);cursor:pointer}
.export-lists{display:flex;flex-direction:column;gap:2px;max-height:300px;overflow:auto;border:1px solid var(--border);border-radius:9px;padding:6px}
.exp-row{display:flex;align-items:center;gap:9px;padding:6px 8px;border-radius:7px;cursor:pointer}
.exp-row:hover{background:#f7f9fc}
.exp-name{flex:1;font-size:.88rem}
.exp-count{font-size:.74rem}
/* Attribut-Auswahl mit Reihenfolge (Matrix-Export) */
.exp-picker{margin:2px 0 14px}
.exp-picker-head{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.exp-attr-list{display:flex;flex-direction:column;gap:2px;max-height:240px;overflow:auto;border:1px solid var(--border);border-radius:9px;padding:6px}
.exp-arow{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:7px;background:#f7f9fc;border:1px solid transparent;cursor:grab}
.exp-arow:active{cursor:grabbing}
.exp-arow.dragging{opacity:.4}
.exp-arow.drag-over{border-color:var(--accent);box-shadow:0 -2px 0 -1px var(--accent) inset}
.exp-arow .ord-grip{color:#b6c2d1;font-size:.8rem;letter-spacing:-1px;user-select:none}
.exp-arow input[type=checkbox]{accent-color:var(--accent);cursor:pointer}

/* ---- Einstellungen: Bilder (Login-Hintergrund) ---- */
.login-bg-prev{margin:8px 0 12px;max-width:360px;border:1px solid var(--border);border-radius:10px;overflow:hidden;background:#f7f9fc;min-height:80px;display:flex;align-items:center;justify-content:center}
.login-bg-prev img{display:block;width:100%;max-height:140px;object-fit:cover}
.imgbtns{display:flex;align-items:center;gap:10px}

/* ---- Einstellungen: Bilder-Galerie ---- */
.img-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px;margin:8px 0}
.img-tile{position:relative;border:1px solid var(--border);border-radius:10px;overflow:hidden;background:#f7f9fc;aspect-ratio:1/1}
.img-tile img{width:100%;height:100%;object-fit:cover;display:block}
.img-del{position:absolute;top:4px;right:4px;width:24px;height:24px;border:none;border-radius:7px;background:rgba(15,23,42,.6);color:#fff;cursor:pointer;font-size:1rem;line-height:1;display:flex;align-items:center;justify-content:center;opacity:0;transition:.12s}
.img-tile:hover .img-del{opacity:1}
.img-del:hover{background:var(--danger)}

/* ---- Attribute-Modul ---- */
.attr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.attr-card{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:13px 15px;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.attr-card:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.attr-top{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.attr-name{font-weight:600;font-size:.95rem;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.attr-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.attr-type{font-size:.7rem;font-weight:700;color:var(--accent);background:var(--accent-soft);border:1px solid #cfe0f2;border-radius:999px;padding:2px 10px}
.attr-del{position:absolute;top:8px;right:8px;opacity:0;transition:.12s}
.attr-card:hover .attr-del{opacity:1}

/* ---- Attribut: technischer Code ---- */
.attr-code{display:inline-block;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.72rem;color:#5f6b7a;background:#f1f5f9;border:1px solid var(--border);border-radius:6px;padding:1px 7px;margin-bottom:8px}
.unit-edit input.mono{font-family:ui-monospace,Menlo,Consolas,monospace;letter-spacing:.2px}

/* ---- Kategorie ↔ Attribut Zuordnung (Panel) ---- */
.cat-attr-panel{padding:20px 22px}
.cat-attr-panel .panel-head{display:flex;align-items:flex-start;gap:10px;margin-bottom:8px}
.cat-attr-panel .panel-head h2{margin:2px 0 0;font-size:1.15rem}
.cat-attr-panel .set-sub{margin:16px 0 8px}
.attr-chips{display:flex;flex-wrap:wrap;gap:7px}
.attr-chip{display:inline-flex;align-items:center;gap:6px;background:var(--accent-soft);color:var(--accent);border:1px solid #cfe0f2;border-radius:8px;padding:4px 8px 4px 11px;font-size:.84rem;font-weight:500}
.attr-chip.inherited{background:#f1f5f9;color:#5f6b7a;border-color:var(--border)}
.attr-chip .chip-src{font-size:.7rem;color:var(--faint);font-weight:400}
.attr-chip .chip-x{border:none;background:none;cursor:pointer;color:inherit;opacity:.6;font-size:.95rem;line-height:1;padding:0 1px;border-radius:5px}
.attr-chip .chip-x:hover{opacity:1;background:rgba(0,0,0,.08)}

/* ---- Lieferanten Kompakt: Logo + Direkt-Links (Website/Portal/Suche) ---- */
.kompakt-item .ki-logo{height:22px;max-width:46px;object-fit:contain;border-radius:4px;flex:none;background:#fff}
.ki-links{display:inline-flex;align-items:center;gap:2px;flex:none}
.ki-ic{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:7px;text-decoration:none;font-size:.95rem;color:var(--faint);cursor:pointer;border:none;background:none}
.ki-ic:hover{background:#eef2f7;color:var(--text)}
.ki-links .iconb{color:var(--faint)}
.ki-links .iconb:hover{color:var(--accent)}

/* ---- Einheitliche einfarbige Linien-Icons (schlicht) ---- */
.ico{display:inline-flex;align-items:center;justify-content:center;color:inherit}
.ico svg{width:16px;height:16px;display:block}
.btn .ico svg{width:15px;height:15px}
.chip .ico svg,.chiplet .ico svg,.bl-grp .ico svg,.lb-ic svg{width:13px;height:13px}
.ki-ic .ico svg{width:16px;height:16px}
.vl-link.ico svg{width:13px;height:13px}

/* ---- Icon + Text Ausrichtung (Chips, Meta-Links) ---- */
.brand-chip,.alllines-chip{display:inline-flex;align-items:center;gap:5px}
.bl-grp{display:flex;align-items:center;gap:5px}
.sup-meta .meta-link{display:inline-flex;align-items:center;gap:5px}
.chiplet .ico{margin-right:2px}

/* ---- Attribut → Kategorie-Zuordnung ---- */
.attr-cats{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.cat-tag{display:inline-flex;align-items:center;font-size:.7rem;font-weight:600;color:#3f5878;background:#eef3f9;border:1px solid #dde6f0;border-radius:6px;padding:2px 7px;line-height:1.3}
.attr-cats-none{font-size:.72rem;color:var(--faint);font-style:italic}
.cat-count{flex:none;font-size:.68rem;font-weight:600;color:#3f5878;background:#eef3f9;border:1px solid #dde6f0;border-radius:6px;padding:2px 6px;cursor:default}

/* ---- Produkte ---- */
.prod-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:9px;cursor:pointer}
.prod-row:hover{background:var(--accent-soft)}
.prod-name{font-weight:600}
.prod-cat{font-size:.82rem}
.prod-vals{font-size:.72rem;color:var(--muted);background:#eef2f7;border-radius:8px;padding:2px 8px;flex:none}
.pf-title{font-weight:700;margin:16px 0 8px;padding-top:12px;border-top:1px solid var(--border)}
.prod-fields{display:flex;flex-direction:column}
.pf-field{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}
.pf-row{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--border)}
.pf-lbl{flex:0 0 118px;font-size:.8rem;display:flex;align-items:center;gap:3px;overflow:hidden}
.pf-lbl>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pf-ctrl{flex:1;min-width:0;display:flex;align-items:center;gap:6px}
.pf-ctrl input,.pf-ctrl select{flex:1;min-width:0}
.pf-ctrl .pf-num{flex:0 1 130px}
.pf-head{display:flex;align-items:center;gap:6px;font-weight:700;font-size:.82rem;color:var(--muted);margin:6px 0 4px}
/* Feld-Farben: geerbt/BP = blau · eigen = grün · Pflichtfeld leer = rot · gesperrt = gestrichelt */
.pf-ctrl input.bp,.pf-ctrl select.bp{color:var(--text);background:rgba(47,109,176,.13);border-color:#9bbfe0!important}
.pf-ctrl input.own,.pf-ctrl select.own{background:rgba(46,139,87,.13);border-color:#7bbf9a!important}
/* Layout-Modus (Admin/Power): feines Quadrat-Raster wie in Access, Felder/Gruppen ziehbar */
.prod-fields.layout-on{
  background-image:linear-gradient(to right, rgba(112,137,196,.14) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(112,137,196,.14) 1px, transparent 1px);
  background-size:20px 20px;
  border:1px dashed var(--accent);border-radius:10px;padding:10px}
.lay-badge{font-size:.7rem;font-weight:700;color:var(--accent);background:var(--accent-soft);border-radius:999px;padding:2px 10px;margin-left:10px}
.layout-on .lay-drag{cursor:grab}
.layout-on .lay-drag.dragging{opacity:.4}
.layout-on .pf-row.lay-drag{border:1px dashed transparent;border-radius:8px;padding:2px 4px}
.layout-on .pf-row.lay-drag:hover{border-color:var(--accent);background:rgba(255,255,255,.55)}
.lay-over{box-shadow:inset 0 3px 0 var(--accent) !important;background:var(--accent-soft) !important}
.lay-end{margin-top:8px;padding:8px;border:1px dashed var(--border);border-radius:8px;text-align:center;font-size:.75rem;color:var(--muted);flex:1 1 100%}
.lay-toolbar{display:flex;align-items:center;gap:10px;margin:6px 0 10px;flex-wrap:wrap}
.lay-tools{position:absolute;top:-8px;right:-4px;display:flex;gap:3px;z-index:5}
.lay-tb{width:22px;height:22px;border-radius:50%;border:1px solid var(--border);background:var(--surface);font-size:.7rem;line-height:1;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.15);display:inline-flex;align-items:center;justify-content:center;padding:0}
.lay-tb:hover{border-color:var(--accent);background:var(--accent-soft)}
.lay-tb.del{color:#b91c1c}
.lay-tb.del:hover{border-color:#b91c1c;background:#fdeaea}
.lock-banner{display:flex;align-items:center;margin:8px 12px;padding:10px 14px;border-radius:10px;background:#fdf3e0;border:1px solid #f3e2c0;color:#8a5a00;font-size:.85rem;font-weight:600}
/* Token-Ansicht im Layout-Modus: kompakte Chips wie im Kategorien-Reiter */
.lay-token{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;font-size:.8rem;font-weight:600;flex:0 0 auto;position:relative;cursor:grab;
  border:1px solid color-mix(in srgb, var(--gc) 55%, var(--border));background:color-mix(in srgb, var(--gc) 10%, var(--surface));color:var(--text)}
.lay-token-dot{width:8px;height:8px;border-radius:50%;background:var(--gc);flex:none}
.lay-token .lay-tools{top:-10px;right:-8px}
/* Kopf-Felder (Artikelname / Nr / Kategorie) als Fliess-Layout — global einstellbar */
.pf-headflds{display:flex;flex-flow:row wrap;gap:8px 14px;align-items:flex-start;margin-top:2px}
.pf-headflds .phf{flex:1 1 260px;min-width:0;display:flex;flex-direction:column;gap:2px}
.pf-headflds .phf-name{flex:1 1 100%}
.pf-headflds.layout-on{background-image:linear-gradient(to right, rgba(112,137,196,.14) 1px, transparent 1px),linear-gradient(to bottom, rgba(112,137,196,.14) 1px, transparent 1px);background-size:20px 20px;border:1px dashed var(--accent);border-radius:10px;padding:8px}
.phf-grip{position:absolute;right:-5px;top:20px;bottom:2px;min-height:0}
/* Feldbreiten-Griff: rechts am Feld ziehen (pro Merkmal gespeichert) · Doppelklick = automatisch */
.pf-resize{flex:none;width:7px;align-self:stretch;min-height:26px;cursor:ew-resize;border-radius:4px;background:transparent;margin-left:2px;position:relative}
.pf-resize::before{content:'';position:absolute;left:2px;top:50%;transform:translateY(-50%);width:3px;height:18px;border-left:1px solid var(--border);border-right:1px solid var(--border);opacity:.6}
.pf-resize:hover{background:var(--accent-soft)}
.pf-resize:hover::before{border-color:var(--accent);opacity:1}
/* Pflichtfeld leer: roter Hauch (95% transparent) — gewinnt auch gegen das Neo-Theme */
.pf-ctrl input.req-empty,.pf-ctrl select.req-empty,.pf-ctrl .rte-area.req-empty{background:rgba(214,69,69,.05)!important;border-color:#d64545!important}
.pf-ctrl input.celllock{cursor:not-allowed;border-style:dashed;opacity:.9}
.req-star{color:#d64545;font-weight:700;margin-left:1px}
.req-warn{color:#d64545;font-size:.72rem;font-weight:700;margin-left:6px}
.lock-ic{margin-left:3px;font-size:.7rem;opacity:.6}
/* Kopf */
.prod-big{display:flex;gap:14px;align-items:flex-start;margin-bottom:6px}
.prod-big-img{width:88px;height:88px;border-radius:12px;object-fit:contain;border:none;background:#f7f9fc;flex:0 0 88px;cursor:pointer}
.prod-big-img.ph{display:flex;align-items:center;justify-content:center;color:var(--faint);background:var(--accent-soft);font-size:.72rem;text-align:center}
.prod-big-img.inh{opacity:.5}
.pf-mini{display:block;font-size:.66rem;color:var(--faint);font-weight:700;text-transform:uppercase;letter-spacing:.03em;margin:8px 0 3px}
.prod-name2{width:100%;font-size:1.02rem;font-weight:700;padding:8px 11px;border:1px solid var(--border);border-radius:9px;background:var(--surface);color:var(--text);box-sizing:border-box}
.prod-name2:focus{outline:none;border-color:var(--accent)}
.prod-meta{display:flex;gap:12px;flex-wrap:wrap;margin-top:2px}
.prod-meta>div{flex:1;min-width:140px}
.prod-meta input{width:100%;padding:7px 9px;border:1px solid var(--border);border-radius:8px;font:inherit;box-sizing:border-box}
.cat-pick-btn{width:100%;text-align:left;padding:7px 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface);font:inherit;color:var(--text);box-sizing:border-box}
.cat-pick-btn.empty{color:var(--faint)}
/* Fortschritt */
.prod-prog{display:flex;align-items:center;gap:8px;margin:8px 0 2px;font-size:.72rem;color:var(--faint)}
.prod-prog .bar{flex:1;height:7px;border-radius:99px;background:var(--accent-soft);overflow:hidden}
.prod-prog .fill{height:100%;background:var(--accent);border-radius:99px;transition:width .15s}
.prod-prog .fill.full{background:#2e8b57}
/* Liste: Mini-Bild */
.prod-thumb{width:var(--thumb-size);height:var(--thumb-size);border-radius:7px;object-fit:contain;border:none;background:#f7f9fc;flex:0 0 var(--thumb-size)}
.prod-thumb.sm{width:calc(var(--thumb-size) - 4px);height:calc(var(--thumb-size) - 4px);flex:0 0 calc(var(--thumb-size) - 4px)}
.prod-thumb.ph{display:flex;align-items:center;justify-content:center;background:#eef2f7}
.prod-thumb.ph svg{width:17px;height:17px;stroke:var(--faint);fill:none;stroke-width:1.6}
.pf-name{font-weight:600;font-size:.86rem}
.pf-req{color:#c0392b;font-weight:700}
.pf-inh{font-size:.72rem}
.pf-row input[type=text],.pf-row input[type=number],.pf-row input[type=date],.pf-row select,.pf-field input,.pf-field select{padding:8px 10px;border:1px solid var(--border);border-radius:8px;font:inherit;box-sizing:border-box;width:100%}
.pf-row input:focus,.pf-field input:focus,.pf-field select:focus,.pf-row select:focus{border-color:var(--accent);outline:none}
.pf-numwrap,.pf-range{display:flex;align-items:center;gap:8px}
.pf-num{max-width:150px}
.pf-unit{font-size:.82rem;color:var(--muted);flex:none}
.pf-bool{display:inline-flex;align-items:center;gap:7px;font-size:.88rem;cursor:pointer}
.pf-multi{display:flex;flex-wrap:wrap;gap:6px 14px}
.pf-multi-item{display:inline-flex;align-items:center;gap:6px;font-size:.85rem;cursor:pointer}
.pf-comb-wrap{display:flex;align-items:center;gap:10px}
.pf-comb{font-weight:700;background:#eef3f9;border:1px solid #dde6f0;border-radius:8px;padding:6px 12px;color:#2b3a52}

/* ---- Attribut-Sichtbarkeit: kompakte Kontext-Icons ---- */
.vis-strip{display:inline-flex;align-items:center;gap:4px;flex:none}
.vico{width:13px;height:13px;display:inline-flex;align-items:center;justify-content:center;color:#ccd5e0;cursor:default;transition:color .1s}
.vico svg{width:13px;height:13px;display:block}
.vico.on{color:var(--accent)}
.attr-vis{display:flex;align-items:center;gap:7px;margin-top:8px}
.attr-vis .vis-lbl{font-size:.7rem;font-weight:600;color:var(--muted)}
.kompakt-item .vis-strip{margin-right:2px}
/* Legende: Icon = Kontext */
.vis-legend{display:flex;flex-wrap:wrap;align-items:center;gap:5px 14px;margin:2px 0 12px;padding:6px 12px;background:var(--surface);border:1px solid var(--border);border-radius:9px;font-size:.72rem;color:var(--muted)}
.vis-legend .vlg-lbl{font-weight:700;color:var(--text)}
.vis-legend .vlg-item{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.vis-legend .vlg-item.clickable{cursor:pointer;padding:3px 8px;border-radius:7px;border:1px solid transparent;transition:.1s}
.vis-legend .vlg-item.clickable:hover{background:var(--accent-soft);border-color:#cfe0f4}
.vis-legend .vlg-item.on{background:var(--accent);border-color:var(--accent);color:#fff}
.vis-legend .vlg-item.on .vico{color:#fff}
.vis-legend .vlg-item.off{background:#f0b429;border-color:#e0a91f;color:#3a2c05}
.vis-legend .vlg-item.off .vico{color:#3a2c05}
.vis-legend .vlg-status{font-weight:700;color:var(--accent)}
.vis-legend .vlg-status.off{color:#b7791f}
.vis-legend .vlg-reset{border:1px solid var(--border);background:var(--surface);cursor:pointer;font:inherit;font-size:.9rem;font-weight:700;color:var(--muted);border-radius:50%;width:22px;height:22px;line-height:1;padding:0}
.vis-legend .vlg-reset:hover{background:#fdeaea;color:#c0392b;border-color:#f2c4c4}
.vis-legend .vico{width:12px;height:12px}
.vis-cat-matrix .vc-h{padding-bottom:7px}
.vis-cat-matrix .vc-h .vico{color:var(--muted)}

/* ---- Sichtbarkeit-Matrix (je Katalog) + Katalog-Verwaltung ---- */
.vis-cat-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:9px;padding:6px}
.vis-cat-matrix{border-collapse:collapse;font-size:.8rem;width:100%}
.vis-cat-matrix th,.vis-cat-matrix td{padding:6px 10px;text-align:center}
.vis-cat-matrix .vc-lbl{text-align:left;font-weight:600;white-space:nowrap;padding-right:18px}
.vis-cat-matrix .vc-lbl .vico{margin-right:7px;vertical-align:-2px;color:var(--accent)}
.vis-cat-matrix .vc-colh,.vis-cat-matrix .vc-ctxh{font-weight:700;color:var(--muted);font-size:.74rem;white-space:nowrap;border-bottom:1px solid var(--border);padding-bottom:7px}
.vis-cat-matrix .vc-ctxh{text-align:left}
.vis-cat-matrix tr:nth-child(even){background:#f7f9fc}
.vis-cat-matrix input{accent-color:var(--accent);cursor:pointer}
.cat-manage{display:flex;flex-direction:column;gap:4px;max-height:240px;overflow:auto}
.cat-manage-row{display:flex;align-items:center;gap:8px;padding:7px 10px;background:#f7f9fc;border:1px solid var(--border);border-radius:8px}
.cat-manage-name{font-weight:600}

.cat-ctl-row{display:flex;align-items:center;gap:4px}

/* ---- Produkte: BP → Varianten ---- */
.prod-row.bp{font-weight:600}
.prod-row.bp .tog{width:16px;flex:none;text-align:center;color:var(--faint);cursor:pointer;user-select:none}
.prod-row.bp .tog.leaf{cursor:default;color:#cbd5e1}
.prod-row.variant{padding-left:34px;background:#fafcff}
.prod-row .var-mark{color:var(--faint);flex:none}
.prod-varc{font-size:.72rem;color:#3f5878;background:#eef3f9;border:1px solid #dde6f0;border-radius:8px;padding:2px 8px;flex:none}
.var-of{font-size:.82rem;font-weight:600;color:var(--accent);background:var(--accent-soft);border-radius:8px;padding:6px 10px;margin-bottom:12px}
.bp-config{margin-top:8px}
.bp-cfg-row{margin-bottom:14px}
.pf-vardef{font-size:.66rem;font-weight:700;color:#7c3aed;background:#f1eafd;border:1px solid #e2d3fb;border-radius:7px;padding:1px 6px}
.pf-lock{font-size:.66rem;font-weight:700;color:#b7791f;background:#fdf3e0;border:1px solid #f3e2c0;border-radius:7px;padding:1px 6px}
.pf-row.vardef{border-left:3px solid #7c3aed;padding-left:9px;margin-left:-12px}
.pf-inh-hint{font-size:.72rem;color:var(--faint);display:flex;align-items:center;gap:8px;margin-top:3px}
.pf-inh-hint.active{color:var(--muted)}
.pf-reset{border:1px solid var(--border);background:var(--surface);cursor:pointer;font:inherit;font-size:.7rem;font-weight:600;color:var(--accent);border-radius:6px;padding:1px 7px}
.pf-reset:hover{background:var(--accent-soft)}
.pf-locked-val{padding:8px 10px;background:#faf6ee;border:1px dashed #e6d6b8;border-radius:8px;font-weight:600}
.pf-static{padding:8px 0;font-weight:600}

/* ---- Produkte: 3-Spalten (Kategorie · Artikel · Formular) ---- */
.prod-layout{display:grid;grid-template-columns:265px minmax(300px,1fr) minmax(360px,1.15fr);gap:14px;align-items:start}
.prod-catcol,.prod-artcol{padding:0;max-height:calc(100vh - 200px);overflow:auto}
.prod-formcol{padding:14px;max-height:calc(100vh - 200px);overflow:auto}
.col-head{display:flex;align-items:center;gap:8px;padding:11px 14px;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--surface);z-index:2}
.col-head .spacer{flex:1}
.prod-formcol .col-head{position:static;margin:0;padding:13px 18px}   /* kein Minus-Abstand mehr — die Spalte hat heute padding:0, sonst ragt „Detail" oben aus der Karte */
.prod-catcol .tree{padding:6px}
.prod-catcol .tnode{padding-top:6px;padding-bottom:6px}
.art-list{padding:6px;display:flex;flex-direction:column;gap:2px}
.art-row{display:flex;align-items:center;gap:8px;padding:4px 9px;border-radius:8px;cursor:pointer}
.art-row:hover{background:var(--accent-soft)}
.art-row.sel{background:var(--accent-soft);box-shadow:inset 3px 0 0 var(--accent)}
/* Basisprodukt-Zeile stärker hervorgehoben: gelbe Karte, fetter Name — kompakt */
.art-row.bp{background:rgba(250,204,21,.14);border:1px solid #eddfa0;border-radius:9px;margin-top:4px;padding:6px 10px}
.art-row.bp .art-name{font-weight:800;font-size:.86rem}
.art-row.bp.sel{background:var(--accent-soft);border-color:#cfe0f4}
.art-row.variant{padding-left:20px;background:#fafcff}
.art-row .pring{margin-left:2px;width:18px;height:18px;flex:0 0 18px}
.art-row .pring::after{width:11px;height:11px}
.art-row .var-mark{color:var(--faint);flex:none}
.art-row .tog{width:26px;flex:none;text-align:center;color:var(--muted);cursor:pointer;user-select:none;font-size:1.2rem;line-height:1;padding:8px 0;border-radius:6px}
.art-row .tog:hover{color:var(--accent);background:rgba(79,109,205,.1)}
.art-row .tog.leaf{cursor:default;color:var(--faint);font-size:.9rem}
.art-row .tog.leaf:hover{color:var(--faint);background:none}
.art-row .tog.leaf{cursor:default;color:#cbd5e1}
.art-ico{width:26px;height:26px;border-radius:6px;background:#eef2f7;flex:none}
.art-ico.sm{width:22px;height:22px}
.art-txt{flex:1;min-width:0}
.art-name{font-weight:600;font-size:.82rem;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.art-sub{font-size:.7rem;line-height:1.2;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bp-badge{font-size:.64rem;font-weight:800;color:var(--accent);background:var(--accent-soft);border:1px solid #cfe0f4;border-radius:6px;padding:2px 6px;flex:none}
.pf-foot{display:flex;align-items:center;gap:10px;position:sticky;bottom:-14px;margin:10px -14px -14px;padding:12px 14px;background:var(--surface);border-top:1px solid var(--border)}
.prod-formcol .pf-row input[type=text],.prod-formcol .pf-row input[type=number],.prod-formcol .pf-row input[type=date],.prod-formcol .pf-row select,.prod-formcol .pf-field input,.prod-formcol .pf-field select{padding:8px 10px;border:1px solid var(--border);border-radius:8px;font:inherit;box-sizing:border-box;width:100%}

/* ---- Provisorische Werte + Dashboard ---- */
.nav-badge{flex:none;min-width:20px;height:20px;padding:0 6px;border-radius:11px;background:var(--amber);color:#fff;font-size:.68rem;font-weight:800;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.nav-item.active .nav-badge{background:#fff;color:var(--amber)}
.prov-tag{font-size:.62rem;font-weight:800;letter-spacing:.02em;color:#8a5a00;background:#fdf3e0;border:1px solid #f3e2c0;border-radius:6px;padding:2px 6px;flex:none;text-transform:uppercase}
.prov-tag.sm{padding:1px 5px;font-size:.58rem;margin-left:5px}
/* Provisorisch-Grund: farbiges Etikett (Farbe --pc aus Einstellungen → Provisorisch-Gründe) */
.provr-chip{color:var(--pc);background:color-mix(in srgb, var(--pc) 12%, #fff);border-color:color-mix(in srgb, var(--pc) 35%, #fff);text-transform:none;letter-spacing:0}
.provr-sel{width:100%;font:inherit;font-size:.85rem;padding:6px 8px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text)}
.provr-dot{flex:none;width:16px;height:16px;border-radius:50%;border:1px solid rgba(0,0,0,.12)}
.provr-color{flex:none;width:38px;height:30px;padding:2px;border:1px solid var(--border);border-radius:8px;background:var(--surface);cursor:pointer}
.pf-addprov{display:inline-flex;align-items:center;gap:5px;border:1px dashed #cbd5e1;background:var(--surface);color:var(--accent);cursor:pointer;font:inherit;font-size:.76rem;font-weight:600;border-radius:8px;padding:3px 10px}
.pf-addprov:hover{background:var(--accent-soft);border-color:var(--accent)}
/* Dashboard */
.dash-card{padding:0;overflow:hidden}
.dash-card-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 18px;border-bottom:1px solid var(--border)}
.dash-card-title{font-weight:700;font-size:1rem;display:flex;align-items:center;gap:8px}
.dash-badge{min-width:22px;height:22px;padding:0 7px;border-radius:11px;background:var(--amber);color:#fff;font-size:.72rem;font-weight:800;display:inline-flex;align-items:center;justify-content:center}
.dash-empty{padding:26px 18px;color:var(--green);font-weight:600}
.dash-list{display:flex;flex-direction:column}
.dash-row{display:flex;align-items:center;gap:10px;padding:7px 12px;border-bottom:1px solid var(--border-2)}
.dash-row:last-child{border-bottom:none}
.dash-row:hover{background:var(--accent-soft)}
.dash-row-main{flex:1;min-width:0}
.dash-row-name{font-weight:600}
.dash-row-sub{font-size:.78rem;margin-top:1px}
.dash-list-ref{font-weight:600;color:var(--accent);background:var(--accent-soft);border-radius:6px;padding:1px 7px}
.dash-row-act{display:flex;align-items:center;gap:8px;flex:none}

/* Speichern-Knopf: nach dem Speichern deaktiviert (kein „aktiv"-Reiz) */
.btn:disabled{cursor:default;opacity:1}
.btn.primary:disabled{background:var(--surface);border-color:var(--border);color:var(--faint);box-shadow:none}

/* ---- Seitenleiste einklappen (schmale Icon-Leiste) ---- */
.sidebar{position:relative;transition:width .15s,flex-basis .15s,padding .15s}
/* runder Knopf auf der rechten Kante, mittig — wie im Prototyp */
/* Seitenleisten-Pfeil: dezenter Kreis, SVG-Chevron exakt zentriert, dreht sich beim Einklappen */
.sb-toggle{position:absolute;top:50%;right:-13px;transform:translateY(-50%);width:26px;height:26px;border-radius:50%;border:1px solid var(--border);background:#fff;color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:60;box-shadow:0 1px 4px rgba(15,23,42,.15);padding:0;transition:color .15s,border-color .15s,box-shadow .15s,transform .15s}
.sb-toggle svg{width:13px;height:13px;display:block;margin-left:-1px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;transition:transform .22s ease}
.sb-toggle:hover{color:var(--accent);border-color:var(--accent);box-shadow:0 2px 8px rgba(79,70,229,.22)}
.sidebar.collapsed .sb-toggle svg{transform:rotate(180deg);margin-left:1px}
.sidebar.collapsed{width:64px;flex:0 0 64px;padding:16px 8px}
.sidebar.collapsed .brand,.sidebar.collapsed .nav-section,.sidebar.collapsed .nav-lbl,.sidebar.collapsed .user-info,.sidebar.collapsed .build-tag,.sidebar.collapsed #logoutBtn,.sidebar.collapsed .settings-gear{display:none}
.sidebar.collapsed .nav-item{position:relative;justify-content:center;padding:11px 0;gap:0}
.sidebar.collapsed .nav-item svg{opacity:1}
.sidebar.collapsed .user-card{justify-content:center;padding:4px 0}
.sidebar.collapsed .nav-badge{position:absolute;top:3px;right:8px;min-width:16px;height:16px;padding:0 4px;font-size:.58rem}

/* ---- Kategorie-Panel: Name inline + Speicherleiste (gesammeltes Speichern) ---- */
.cd-namerow{margin:8px 0 6px}
.cd-name{width:100%;padding:8px 11px;border:1px solid var(--border);border-radius:9px;font:inherit;font-size:1rem;font-weight:600;color:var(--text);background:var(--surface);box-sizing:border-box}
.cd-name:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.cd-savebar{display:flex;align-items:center;gap:10px;margin-top:18px;padding-top:14px;border-top:1px solid var(--border)}
.cd-savebar .spacer{flex:1}

/* ---- Such-Auswahlfeld (Combobox) im Produkt-Formular ---- */
.combo{position:relative;flex:1;min-width:0}
/* dezenter Pfeil: zeigt, dass es eine Auswahl ist */
.combo::after{content:'▾';position:absolute;right:11px;top:50%;transform:translateY(-50%);color:var(--muted);opacity:.55;font-size:1.44rem;line-height:1;pointer-events:none}
.combo .combo-input{padding-right:34px}
.combo:focus-within::after{opacity:.9;color:var(--accent)}
.combo-input{width:100%;box-sizing:border-box;padding:8px 10px;border:1px solid var(--border);border-radius:8px;font:inherit}
.combo-list{position:absolute;top:calc(100% + 3px);left:0;right:0;z-index:50;background:var(--surface);border:1px solid var(--border);border-radius:9px;box-shadow:0 8px 22px rgba(0,0,0,.14);max-height:240px;overflow:auto;padding:4px}
.combo-item{padding:7px 9px;border-radius:7px;cursor:pointer;font-size:.85rem;display:flex;align-items:center;gap:6px}
.combo-item.hi{background:var(--accent-soft)}
.combo-item .prov-tag{margin-left:auto}
.combo-clear{color:var(--muted);font-size:.8rem}
.combo-new{color:var(--accent);font-weight:600;border-top:1px solid var(--border);border-radius:0;margin-top:3px}
.combo-empty{padding:8px 9px;color:var(--muted);font-size:.8rem}

.dash-row-click{cursor:pointer}

/* ---- BP-Formular: Varianten-Abschnitt ---- */
.pf-varsec{margin-top:2px}
.pf-varlist{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.pf-varchip{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:8px 11px;border:1px solid var(--border);border-radius:9px;background:var(--surface);cursor:pointer;font:inherit}
.pf-varchip:hover{border-color:var(--accent);background:var(--accent-soft)}
.pf-varchip-nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.pf-varsku{font-size:.76rem;color:var(--muted);font-family:ui-monospace,monospace;flex:none}

/* ---- Produkte: volle Tabelle (Bulk-Editor) ---- */
.prod-layout-table{display:grid;grid-template-columns:265px 1fr;gap:14px;align-items:start}
.prod-tablecol{padding:0;height:calc(100vh - 130px);overflow:hidden;display:flex;flex-direction:column}
.ptbl td input,.ptbl td select,.ptbl-namecell .ptbl-name{padding-top:8px;padding-bottom:8px}
.pt-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:10px 14px;border-bottom:1px solid var(--border)}
.pt-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pt-title{font-size:.78rem;color:var(--muted);font-weight:600}
.col-search{padding:6px 10px;border:1px solid var(--border);border-radius:8px;font:inherit;font-size:.8rem}
.ptbl-wrap{overflow:auto;flex:1}
.ptbl{border-collapse:separate;border-spacing:0;font-size:.8rem;white-space:nowrap}
.ptbl th,.ptbl td{border-bottom:1px solid var(--border);border-right:1px solid var(--border-2);background:var(--surface)}
.ptbl thead th{position:sticky;top:0;z-index:3;background:#f7f9fc;padding:6px 8px;text-align:left;font-weight:700;color:var(--muted)}
.ptbl thead th .th-lbl{margin-right:4px}
.th-freeze,.th-menu{border:none;background:none;cursor:pointer;color:#c3ccd8;font-size:.72rem;padding:0 2px}
.th-freeze.on,.th-menu.on{color:var(--accent)}
.th-freeze:hover,.th-menu:hover{color:var(--text)}
.ptbl td input,.ptbl td select{border:1px solid transparent;background:none;font:inherit;padding:6px 8px;width:100%;box-sizing:border-box;min-width:90px;color:var(--text)}
.ptbl td input:focus,.ptbl td select:focus{outline:none;border-color:var(--accent);background:var(--surface)}
.ptbl td input.bp,.ptbl td select.bp{background:rgba(47,109,176,.13)}
.ptbl td input.own,.ptbl td select.own{background:rgba(46,139,87,.13)}
.ptbl td input.req-empty,.ptbl td select.req-empty{background:rgba(214,69,69,.05)!important;border-color:#d64545!important}
.ptbl td input.celllock{border-style:dashed;cursor:not-allowed;opacity:.85}
.ptbl tr.var td{background:#fafcff}
.ptbl tr.base td{background:rgba(250,204,21,.12)}   /* Basisprodukt-Zeile: dezenter gelber Schleier zum Abheben */
.ptbl-namecell{display:flex;align-items:center;gap:6px;padding:3px 6px;min-width:240px}
.ptbl-namecell.v{padding-left:14px}
.bp-tog{cursor:pointer;color:var(--faint);width:14px;flex:none;user-select:none;text-align:center}
.bp-spacer{width:14px;flex:none}
.ptbl-conn{color:var(--faint);flex:none}
.ptbl-namecell .ptbl-name{font-weight:600;border:1px solid transparent;background:none;padding:6px 8px;min-width:120px;flex:1}
.ptbl-sku{min-width:90px}
.ptbl-comb{display:inline-block;padding:6px 8px;color:#2b3a52;font-weight:600}
.pt-acth{width:64px}
.pt-actc{white-space:nowrap;text-align:center}
.pring{width:20px;height:20px;border-radius:50%;flex:0 0 20px;display:inline-flex;align-items:center;justify-content:center;background:conic-gradient(var(--accent) calc(var(--p,0)*1%),#e6ebf2 0)}
.pring::after{content:"";width:13px;height:13px;border-radius:50%;background:var(--surface)}
.pring.full{background:#22c55e}
.prod-thumb.xs{width:calc(var(--thumb-size) - 4px);height:calc(var(--thumb-size) - 4px);flex:0 0 calc(var(--thumb-size) - 4px)}
.ptbl .frozen{position:sticky;z-index:2}
.ptbl thead th.frozen{z-index:4}
.ptbl .freeze-edge{border-right:2px solid var(--accent)}
.pt-menu{position:fixed;z-index:200;background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.18);padding:6px;min-width:210px;max-height:70vh;overflow:auto}
.pt-mb{display:block;width:100%;text-align:left;border:none;background:none;padding:7px 9px;border-radius:7px;cursor:pointer;font:inherit;font-size:.82rem}
.pt-mb:hover{background:var(--accent-soft)}
.pt-msep{height:1px;background:var(--border);margin:5px 0}
.pt-mlbl{font-size:.7rem;color:var(--muted);font-weight:700;padding:3px 9px}
.pt-mfilter{max-height:200px;overflow:auto;padding:2px 4px}
.pt-mfitem{display:flex;align-items:center;gap:7px;padding:4px 6px;font-size:.82rem;cursor:pointer}
.pt-mrow{display:flex;gap:8px;justify-content:flex-end;padding:6px 4px 2px}

/* ---- Attribut-Tabelle: Massen-Auswahl ---- */
.bulk-bar{display:flex;align-items:center;gap:8px;padding:8px 12px;margin-bottom:8px;border:1px solid var(--border);border-radius:10px;background:var(--accent-soft);flex-wrap:wrap}
.bulk-bar.empty{background:var(--surface);color:var(--muted);font-size:.82rem}
.bulk-bar .spacer{flex:1}
.bulk-bar .bulk-count{font-weight:700;color:var(--accent)}
.excel-table th.ta-center,.excel-table td.ta-center{text-align:center}
.excel-table td.ta-center input,.excel-table th.ta-center input{cursor:pointer;accent-color:var(--accent)}
.excel-table tr.row-sel td{background:var(--accent-soft)}
.excel-table tr.row-sel td.frozen{background:#e6effc}

/* ---- Kategorie: Ebene je Merkmal (BP / V / Beide) — dezente Pillen ---- */
.sc-seg{display:inline-flex;gap:3px;margin-left:auto;flex:none}
.sc-b{border:1px solid transparent;background:transparent;color:var(--faint);cursor:pointer;font:inherit;font-size:.64rem;font-weight:700;padding:2px 9px;border-radius:999px;line-height:1.5;transition:.1s}
.sc-b:hover{background:#eef2f7;color:var(--muted)}
.sc-b.on.bp{background:rgba(34,197,94,.14);color:#15803d;border-color:#bbe7c9}
.sc-b.on.variant{background:#eff2f6;color:#5b6675;border-color:#dbe2ea}
.sc-b.on.both{background:var(--accent-soft);color:var(--accent);border-color:#cfe0f4}
.sc-b.on.provisorisch{background:#fdf3e0;color:#b7791f;border-color:#f3e2c0}
.sc-badge{font-size:.58rem;font-weight:800;border-radius:5px;padding:1px 5px;margin-left:5px}
.sc-badge.bp{background:rgba(34,197,94,.15);color:#15803d}
.sc-badge.variant{background:#eff2f6;color:#5b6675}
.sc-badge.provisorisch{background:#fdf3e0;color:#b7791f}

/* „pro Variante"-Hinweis (Varianten-Merkmal auf dem BP) */
.pf-varonly{color:var(--faint);font-size:.8rem;font-style:italic}
.ptbl-varonly{display:inline-block;padding:6px 8px;color:var(--faint);font-size:.76rem;font-style:italic}

/* „＋ Variante"-Zeile am Ende der BP-Gruppe (Tabelle) */
.ptbl tr.addvar td{background:#fbfdff}
.ptbl-addvar{border:none;background:none;color:var(--accent);cursor:pointer;font:inherit;font-size:.78rem;font-weight:600;padding:6px 8px;border-radius:6px}
.ptbl-addvar:hover{background:var(--accent-soft)}

/* Produktbild-Vorschau beim Drüberfahren */
.img-zoom{position:fixed;z-index:400;width:280px;height:280px;object-fit:contain;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 16px 48px rgba(0,0,0,.28);padding:8px;pointer-events:none}

/* Direkt-Link (z.B. Lieferanten-Seite) neben einem Auswahlfeld */
.ext-link{flex:none;text-decoration:none;font-size:.95rem;padding:2px 5px;border-radius:6px;line-height:1;cursor:pointer}
.ext-link:hover{background:var(--accent-soft)}
.cell-link-wrap{display:flex;align-items:center;gap:1px}
.cell-link-wrap select{flex:1;min-width:0}

/* ---- Website auslesen (Panel) ---- */
.scrape-box{width:min(760px,94vw);max-height:88vh;display:flex;flex-direction:column;padding:0;overflow:hidden}
.scrape-head{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--border)}
.scrape-head .spacer{flex:1}
.scrape-url{font-size:.76rem;max-width:340px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-decoration:none}
.scrape-body{padding:14px 16px;overflow:auto;display:flex;flex-direction:column;gap:8px}
.scrape-title{font-size:1.05rem;font-weight:700}
.scrape-desc{color:var(--muted);font-size:.85rem}
.scrape-bar{display:flex;align-items:center;gap:10px}
.scrape-bar .spacer{flex:1}
.scrape-text{width:100%;min-height:320px;resize:vertical;border:1px solid var(--border);border-radius:9px;padding:10px 12px;font:inherit;font-size:.82rem;line-height:1.5;background:#fbfcfe;color:var(--text)}
.scrape-links{display:flex;flex-direction:column;gap:3px;max-height:220px;overflow:auto;padding:6px 2px}
.scrape-link{font-size:.8rem;color:var(--accent);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.scrape-link:hover{text-decoration:underline}
.scrape-imgs{display:flex;flex-wrap:wrap;gap:8px;padding:6px 2px;max-height:260px;overflow:auto}
.scrape-img{width:78px;height:78px;object-fit:contain;border:1px solid var(--border);border-radius:8px;background:#f7f9fc}
.scrape-body details summary{cursor:pointer;font-size:.82rem;font-weight:600;color:var(--muted);padding:6px 0}

.ext-linkwrap{display:inline-flex;align-items:center;flex:none}

/* Website auslesen — Hauptbild + Dokumente */
.scrape-main{max-width:100%;max-height:240px;object-fit:contain;border:1px solid var(--border);border-radius:10px;background:#f7f9fc;cursor:zoom-in;align-self:flex-start}
.scrape-sec-h{font-weight:700;font-size:.86rem;margin-top:4px}
.scrape-docs{display:flex;flex-direction:column;gap:5px}
.scrape-doc{display:flex;align-items:center;gap:9px;padding:7px 10px;border:1px solid var(--border);border-radius:9px;text-decoration:none;background:var(--surface)}
.scrape-doc:hover{border-color:var(--accent);background:var(--accent-soft)}
.doc-kind{flex:none;font-size:.62rem;font-weight:800;padding:2px 7px;border-radius:6px;color:#fff;background:var(--muted)}
.doc-kind.k-pdf{background:#d64545}
.doc-kind.k-cad{background:#2f6db0}
.doc-kind.k-archiv{background:#b7791f}
.doc-kind.k-office{background:#2e8b57}
.doc-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text);font-size:.84rem}
.doc-ext{flex:none;font-size:.72rem;color:var(--muted);font-family:ui-monospace,monospace}

.scrape-stage{display:flex;align-items:center;padding-bottom:2px}

/* Website auslesen — erkannte Werte (regelbasiert) */
.scrape-specs{display:flex;flex-direction:column;gap:3px}
.spec-row{display:flex;align-items:center;gap:10px;padding:5px 9px;border:1px solid var(--border);border-radius:8px;background:#fbfcfe}
.spec-key{flex:0 0 190px;font-weight:600;font-size:.82rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.spec-val{flex:1;min-width:0;font-size:.85rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* erkannte Werte → Merkmal-Zuordnung */
.spec-row.ok{border-color:#bbe7c9;background:rgba(34,197,94,.06)}
.spec-match{flex:none;font-size:.7rem;font-weight:700;color:#15803d;background:rgba(34,197,94,.14);border-radius:6px;padding:2px 8px;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.spec-nomatch{flex:none;font-size:.68rem;color:var(--faint)}
.spec-row .btn.sm{flex:none}
/* schon belegt (eigen oder vom BP geerbt) → nicht nochmal übernehmen */
.spec-row.covered{opacity:.6}
.spec-have{flex:none;font-size:.72rem;font-weight:700;color:#15803d;white-space:nowrap;padding:2px 6px}
.spec-have.bp{color:var(--accent)}
.spec-row .btn.sm.warn{border-color:#f59e0b;color:#b45309}
.spec-row .btn.sm.warn:hover{background:#fffbeb}

/* „Seite auslesen" als frei verschiebbares, grössenveränderbares Fenster — Formular bleibt bedienbar */
.scrape-dock{position:fixed;z-index:115;display:flex;overflow:hidden;resize:both;min-width:360px;min-height:280px;
  background:var(--surface);border-radius:14px;box-shadow:0 24px 70px rgba(15,23,42,.34)}
.scrape-dock .scrape-box{width:100%;max-width:none;height:100%;max-height:none;border-radius:14px;box-shadow:none}
.scrape-head{cursor:move;user-select:none}
.scrape-grip{color:var(--faint);font-size:1rem;letter-spacing:-2px;margin-right:2px;cursor:move}
.scrape-img,.scrape-doc,.scrape-main{cursor:grab}
/* Umschalter: Ausgelesen ⇄ Original-Seite */
.scrape-tabs{display:flex;gap:4px;padding:6px 12px 0;border-bottom:1px solid var(--border);background:var(--surface)}
.sc-tab{border:1px solid transparent;border-bottom:none;background:transparent;color:var(--muted);font-size:.82rem;font-weight:600;padding:7px 14px;border-radius:9px 9px 0 0;cursor:pointer}
.sc-tab:hover{color:var(--text);background:var(--accent-soft)}
.sc-tab.active{color:var(--accent);border-color:var(--border);background:var(--surface);margin-bottom:-1px}
.scrape-shot{width:100%;height:auto;display:block;border:1px solid var(--border);border-radius:8px}
.scrape-variant{font-size:.78rem;font-weight:600;color:#92600a;background:rgba(245,158,11,.14);border-radius:7px;padding:6px 10px}
.scrape-vgrid{display:flex;flex-wrap:wrap;gap:10px;padding:4px 0}
.vcard{display:flex;flex-direction:column;gap:5px;width:150px}
.vimg{width:150px;height:120px;object-fit:contain;border:1px solid var(--border);border-radius:9px;background:#f7f9fc;cursor:grab}
.vimg:active{cursor:grabbing}
.vmain-btn{width:100%}
.scrape-img:active,.scrape-doc:active,.scrape-main:active{cursor:grabbing}

/* Produkt-Medien: Bilder-Galerie + Dokumente + Drop-Zone */
.mv-drop{border:1.5px dashed var(--border);border-radius:12px;padding:10px;min-height:60px;display:flex;flex-direction:column;gap:9px;transition:border-color .15s,background .15s}
.mv-drop.over{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 2px var(--accent-soft)}
/* Ablage aufs ganze Formular */
#prodFormCol.form-drop{outline:2.5px dashed var(--accent);outline-offset:-8px;background:var(--accent-soft)}
#prodFormCol.form-drop::after{content:'⬇ Bild / Datei hier ablegen';position:sticky;bottom:10px;display:block;text-align:center;color:var(--accent);font-weight:700;font-size:.85rem;pointer-events:none}
.mv-sech{font-size:.7rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}
.mv-gallery{display:flex;flex-wrap:wrap;gap:10px}
.mv-thumb{position:relative;width:168px;height:168px;border:1px solid var(--border);border-radius:9px;overflow:hidden;background:#f7f9fc}
.mv-thumb img{width:100%;height:100%;object-fit:contain;display:block;cursor:zoom-in}
.mv-thumb.cur{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}
.mv-mainbadge{position:absolute;top:2px;left:3px;font-size:.8rem;color:#f59e0b;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.mv-acts{position:absolute;top:3px;right:3px;display:flex;gap:3px;opacity:.92;transition:opacity .15s}
.mv-thumb:hover .mv-acts{opacity:1}
.mv-a{border:none;background:rgba(15,23,42,.62);color:#fff;border-radius:6px;width:21px;height:21px;cursor:pointer;font-size:.72rem;line-height:1;display:flex;align-items:center;justify-content:center;padding:0;flex:none}
.mv-a .ki-ico{width:15px;height:15px;margin:0;vertical-align:0;cursor:pointer}   /* Kachel-Regel „Bild = Lupe" gilt nicht für den KI-Knopf */
.mv-a:hover{background:rgba(15,23,42,.85)}
.mv-a.del:hover{background:#d64545}
.mv-docs{display:flex;flex-direction:column;gap:5px}
.mv-doc{display:flex;align-items:center;gap:8px;padding:6px 9px;border:1px solid var(--border);border-radius:8px;background:var(--surface)}
.mv-doc-ic{flex:none;font-size:.95rem}
.mv-doc-lbl{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-decoration:none;color:var(--text);font-size:.84rem}
.mv-doc-lbl:hover{color:var(--accent);text-decoration:underline}
.mv-doc .mv-a{background:transparent;color:var(--muted)}
.mv-doc .mv-a.del:hover{background:#d64545;color:#fff}
.mv-empty{text-align:center;color:var(--faint);font-size:.82rem;padding:14px 4px}

/* ===== Detail-Panel mit Reitern (Redesign) ===== */
.prod-formcol{padding:0;display:flex;flex-direction:column;max-height:calc(100vh - 190px);overflow:hidden}
.prod-formcol .col-head.pf-tophead{position:static;margin:0;padding:13px 18px;border-bottom:1px solid var(--border)}
.pf-tabs{display:flex;gap:2px;padding:0 12px;border-bottom:1px solid var(--border);background:var(--surface);overflow-x:auto}
.pf-tabs::-webkit-scrollbar{height:0}
.pf-tab{border:none;background:none;font:inherit;font-size:.85rem;font-weight:600;color:var(--muted);padding:12px 13px;cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap;transition:color .12s,border-color .12s}
.pf-tab:hover{color:var(--text)}
.pf-tab.active{color:var(--accent);border-bottom-color:var(--accent)}
.pf-panel{flex:1;overflow:auto;padding:16px 18px}
.prod-formcol .pf-foot{position:static;margin:0;padding:11px 18px;border-top:1px solid var(--border);background:var(--surface)}
.pf-foot .prod-prog{flex:1;margin:0}
.pf-empty{display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;padding:52px 20px;color:var(--muted)}
.pf-empty-ic{font-size:2rem;opacity:.85}
.pf-empty-h{font-weight:700;color:var(--text);font-size:1.06rem}

/* ===== Merkmalsfelder als Fliess-Layout (Label oben; schmale Felder rücken zusammen — Breite pro Merkmal) ===== */
.prod-fields{display:flex;flex-flow:row wrap;gap:13px 14px;align-items:flex-start}
.prod-fields .pf-row{flex:1 1 280px;min-width:0;display:flex;flex-direction:column;align-items:stretch;gap:4px;padding:0;border-bottom:none}
.prod-fields .pf-row.pf-w-full{flex:1 1 100%}
.prod-fields .pf-lbl{flex:none;font-size:.64rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--faint);gap:5px}
.prod-fields .pf-ctrl{flex:none;width:100%;gap:6px}
.prod-fields .pf-ctrl input,.prod-fields .pf-ctrl select,.prod-fields .pf-ctrl .combo{flex:1;min-width:0;width:100%}
.prod-fields .pf-ctrl .pf-num{flex:1;max-width:none}
.prod-fields .pf-numwrap,.prod-fields .pf-range{width:100%;min-width:0}
.prod-fields .pf-lbl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}   /* schmale Spalten: Beschriftung kürzt statt zu blockieren */
/* Gruppen als gefüllte Farbfläche: vom Gruppen-Titel bis zum nächsten Feld/zur nächsten Gruppe */
.pf-grpbox{flex:1 1 100%;display:flex;flex-wrap:wrap;gap:13px 14px;align-items:flex-start;
  background:color-mix(in srgb, var(--gc) 7%, transparent);border-left:3px solid var(--gc);border-radius:10px;padding:10px 12px 12px}
.pf-grpbox>.pf-group{flex:1 1 100%;margin:0}
/* Ablegen: linke Hälfte = davor · rechte Hälfte = dahinter */
.lay-over-l{box-shadow:inset 4px 0 0 var(--accent) !important;background:var(--accent-soft) !important}
.lay-over-r{box-shadow:inset -4px 0 0 var(--accent) !important;background:var(--accent-soft) !important}

/* ===== „Schneller finden"-Karte + Seiten-Navigation ===== */
.find-card{margin:10px 8px 10px;display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:12px;background:linear-gradient(135deg,var(--accent-soft),#f2f0ff);border:1px solid #e6e3fb}
.find-ic{font-size:1.1rem;line-height:1.2}
.find-h{font-weight:700;font-size:.82rem;color:var(--text)}
.find-tx{font-size:.72rem;color:var(--muted);line-height:1.45;margin-top:2px}
.art-count{font-size:.72rem;color:var(--muted);font-weight:600}
.art-pager{display:flex;align-items:center;gap:8px;padding:9px 12px;border-top:1px solid var(--border);position:sticky;bottom:0;background:var(--surface)}
.pager-nav{display:flex;gap:4px;align-items:center;flex-wrap:wrap}
.pgb{min-width:30px;height:30px;padding:0 8px;border:1px solid var(--border);background:var(--surface);border-radius:8px;cursor:pointer;font:inherit;font-size:.82rem;font-weight:600;color:var(--text)}
.pgb:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}
.pgb.on{background:var(--grad);border-color:transparent;color:#fff}
.pgb:disabled{opacity:.4;cursor:default}
.pg-ell{color:var(--faint);padding:0 2px}
.pager-per{padding:6px 8px;border:1px solid var(--border);border-radius:8px;font:inherit;font-size:.8rem;background:var(--surface);cursor:pointer}

/* Kategorie-Spalte: Baum scrollt, „Schneller finden"-Karte bleibt unten sichtbar */
.prod-catcol{display:flex;flex-direction:column;overflow:hidden}
.prod-catcol .tree{flex:1;overflow:auto;min-height:0}
.prod-catcol .find-card{flex:none}

/* ===== Dashboard (Redesign) ===== */
.dash-hello{margin-bottom:18px}
.dash-hello h1{font-size:1.6rem;font-weight:800;color:var(--text);letter-spacing:-.01em}
.dash-hello p{margin:4px 0 0}
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:10px;margin-bottom:12px}
.kpi{background:var(--surface);border:1px solid var(--border);border-radius:13px;padding:10px 13px;box-shadow:var(--shadow)}
.kpi-top{display:flex;align-items:center;gap:8px;margin-bottom:9px}
.kpi-ic{width:30px;height:30px;border-radius:9px;background:var(--accent-soft);display:grid;place-items:center;font-size:.95rem}
.kpi-lbl{font-size:.78rem;color:var(--muted);font-weight:600}
.kpi-val{font-size:1.3rem;font-weight:800;color:var(--text);letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.1}
.kpi-sub{font-size:.74rem;color:var(--faint);margin-top:3px}
.kpi-click{cursor:pointer;transition:box-shadow .12s,transform .12s}
.kpi-click:hover{box-shadow:var(--shadow-lg);transform:translateY(-1px)}
.kpi-accent{background:linear-gradient(135deg,#eef0ff,#f6f0ff);border-color:#ddd8fb}
.kpi-accent .kpi-ic{background:var(--grad);color:#fff}
.kpi-accent .kpi-val{color:var(--accent)}
.kpi-ringrow{display:flex;align-items:center;gap:12px}
.mini-ring{flex:none}.mini-ring svg{width:100%;height:100%;display:block}

.dash-cols{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px;align-items:start}
/* Reiter innerhalb einer Einstellungs-Karte (z.B. Glossar) */
.set-tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);margin-top:4px}
.set-tab{font:inherit;font-size:.84rem;font-weight:600;padding:8px 14px;border:none;background:transparent;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px}
.set-tab:hover{color:var(--text)}
.set-tab.active{color:var(--accent);border-bottom-color:var(--accent)}
/* Sprach-Glossar-Tabelle */
.lgx-grid{display:grid;gap:6px 8px;align-items:center}
.lgx-head{font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:var(--faint)}
/* Titel- & Text-Vorlagen (Einstellungen) */
.tpl-chips{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 4px}
.tpl-chip{font:inherit;font-size:.76rem;font-weight:600;padding:3px 10px;border-radius:999px;border:1px solid var(--border);background:var(--surface);color:var(--accent);cursor:pointer}
.tpl-chip:hover{background:var(--accent-soft);border-color:var(--accent)}
.tpl-in{width:100%;font:inherit;font-size:.9rem;padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text)}
.tpl-ta{min-height:84px;resize:vertical;margin-bottom:10px}
.tpl-talbl{font-size:.78rem;font-weight:700;color:var(--muted);margin:8px 0 4px}
.tpl-preview{margin-top:8px;font-size:.85rem;padding:8px 10px;border-radius:8px;background:var(--accent-soft)}
/* Rich-Text-Editor (Textfelder + Text-Vorlagen) */
.rte-wrap{border:1px solid var(--border);border-radius:10px;background:var(--surface);overflow:visible}
.rte-bar{display:flex;flex-wrap:wrap;gap:2px;padding:4px 6px;border-bottom:1px solid var(--border);background:color-mix(in srgb, var(--surface) 60%, var(--bg))}
.rte-btn{font:inherit;font-size:.8rem;font-weight:700;min-width:26px;height:26px;padding:0 6px;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--text);cursor:pointer}
.rte-btn:hover{background:var(--accent-soft);border-color:var(--border)}
.rte-bar .rte-btn:nth-child(2){font-style:italic}
.rte-bar .rte-btn:nth-child(3){text-decoration:underline}
.rte-area{min-height:96px;padding:10px 12px;font:inherit;font-size:.9rem;line-height:1.5;outline:none;overflow-wrap:break-word}
.rte-area:empty::before{content:attr(data-ph);color:var(--muted);pointer-events:none}
.rte-area a{color:var(--accent)}
.rte-area ul{margin:4px 0 4px 18px}
.rte-view{padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:color-mix(in srgb, var(--surface) 70%, var(--bg));font-size:.9rem;line-height:1.5;min-height:38px}
.rte-view ul{margin:4px 0 4px 18px}
.rte-menuwrap{position:relative;display:inline-flex}
.rte-menu{position:absolute;top:100%;left:0;z-index:60;display:flex;flex-wrap:wrap;gap:2px;max-width:260px;padding:6px;background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.14)}
.rte-menu-item{font:inherit;font-size:.82rem;padding:4px 8px;border:1px solid var(--border);border-radius:6px;background:var(--surface);cursor:pointer;max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rte-menu-item:hover{background:var(--accent-soft)}
.rte-menu-empty{font-size:.76rem;color:var(--muted);padding:4px 6px;white-space:nowrap}
/* Längen-Vorgaben + Zähler */
.tpl-num{width:84px !important;display:inline-block}
.tpl-limrow{display:flex;align-items:center;gap:16px;margin:6px 0 8px;font-size:.8rem;color:var(--muted)}
.tpl-limrow label{display:inline-flex;align-items:center;gap:6px}
.tpl-cnt{font-size:.72rem;color:var(--muted);margin-top:3px}
.tpl-cnt.over{color:var(--danger);font-weight:700}
.pf-tplrow{display:flex;gap:6px;margin-top:4px}
.tpl-modal{max-width:760px}
/* Platzhalter-Chips IM Vorlagen-Text: Klick = W ↔ A+W · × = entfernen */
.tpl-ph{display:inline-flex;align-items:center;gap:3px;margin:0 2px;padding:1px 4px 1px 8px;border-radius:999px;font-size:.8rem;font-weight:700;cursor:pointer;user-select:none;
  color:#1d4ed8;background:#e8eefc;border:1px solid #c7d7f7;vertical-align:baseline}
.tpl-ph:hover{border-color:#1d4ed8}
.tpl-ph.aw{color:#6d28d9;background:#f1eafc;border-color:#ddcdf5}
.tpl-ph.aw:hover{border-color:#6d28d9}
.tpl-ph-x{font:inherit;font-size:.78rem;font-weight:800;line-height:1;border:none;background:transparent;color:inherit;opacity:.5;cursor:pointer;padding:0 3px;border-radius:50%}
.tpl-ph-x:hover{opacity:1;background:rgba(0,0,0,.08)}
/* sichtbare Leerzeichen (·) im Vorlagen-Editor */
.rte-ws{color:#c2410c;opacity:.7;font-weight:800}
.rte-btn.on{background:var(--accent);color:#fff;border-color:var(--accent)}
/* Einfüge-Modus für Bausteine: W (Wert) · A (Name) · A+W (Name: Wert) */
.tpl-mode{display:flex;align-items:center;gap:6px;margin:4px 0 6px;font-size:.78rem}
.tplm-btn{font:inherit;font-size:.74rem;font-weight:700;padding:3px 10px;border-radius:999px;border:1px solid var(--border);background:var(--surface);color:var(--muted);cursor:pointer}
.tplm-btn:hover{border-color:var(--accent)}
.tplm-btn.on{background:var(--accent);border-color:var(--accent);color:#fff}
/* Herkunft von Texten: ✎ eigener · ↳ vom BP · ⚡ aus Kategorie-Vorlage */
.src-tag{display:inline-block;font-size:.66rem;font-weight:800;letter-spacing:.02em;border-radius:6px;padding:1px 7px;margin-bottom:3px;border:1px solid transparent}
.src-tag.tag-own{color:#166534;background:#e7f6ec;border-color:#c3e6cd}
.src-tag.tag-bp{color:#1d4ed8;background:#e8eefc;border-color:#c7d7f7}
.src-tag.tag-tpl{color:#6d28d9;background:#f1eafc;border-color:#ddcdf5}
/* Text-Zellen in der Tabelle: Herkunft + Kurzvorschau, Klick öffnet das Formular (Reiter Texte) */
.ptbl-text{display:flex;align-items:center;gap:6px;width:100%;max-width:260px;font:inherit;font-size:.78rem;text-align:left;border:none;background:transparent;color:var(--text);cursor:pointer;padding:2px 4px;border-radius:6px}
.ptbl-text:hover{background:var(--accent-soft)}
.ptbl-text .src-tag{margin-bottom:0;flex:none}
.ptbl-text-prev{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ptbl-text.empty{color:var(--muted)}
/* Dubletten-Hinweise (Attribute) */
.dup-hint{font-size:.76rem;font-weight:600;color:#9a3412;background:#fdeadd;border:1px solid #f5cdb0;border-radius:8px;padding:4px 10px;margin:4px 0 2px}
.dup-chip{font-size:.68rem;font-weight:700;color:#9a3412;background:#fdeadd;border:1px solid #f5cdb0;border-radius:6px;padding:1px 6px;margin-left:6px;flex:none}
/* Glossar-Hinweis unter dem Feld: Klick = Korrektur übernehmen */
.gloss-hint{display:block;width:fit-content;max-width:100%;margin-top:4px;font:inherit;font-size:.75rem;font-weight:600;text-align:left;color:#8a5a00;background:#fdf3e0;border:1px solid #f3e2c0;border-radius:8px;padding:3px 10px;cursor:pointer}
.gloss-hint:hover{background:#fbe9c8}
/* ===== DAM (Medien): Ordner-Spalte + Kachel-Raster + Detail ===== */
.dam-layout{display:flex;gap:16px;align-items:flex-start}
.dam-side{flex:0 0 230px;padding:12px;position:sticky;top:10px}
.dam-side-h{font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:var(--faint);margin:10px 0 6px}
.dam-folder{display:block;width:100%;text-align:left;font:inherit;font-size:.84rem;padding:6px 10px;border:none;background:transparent;border-radius:8px;cursor:pointer;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dam-folder:hover{background:var(--accent-soft)}
.dam-folder.on{background:var(--accent-soft);color:var(--accent);font-weight:700}
.dam-folder-row{display:flex;align-items:center;gap:2px}
.dam-ftog{flex:none;width:18px;height:18px;border:none;background:transparent;color:var(--muted);font-size:.7rem;cursor:pointer;padding:0;border-radius:4px}
.dam-ftog:hover{background:var(--accent-soft);color:var(--accent)}
.dam-ftog.ph{cursor:default}
.dam-fsearch{width:100%;margin:2px 0 8px;box-sizing:border-box}
/* Eingabe-Popover (ersetzt die Browser-prompt-Fenster) — erscheint direkt beim Knopf */
.pop-input{position:fixed;z-index:400;min-width:270px;max-width:340px;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:0 12px 34px rgba(0,0,0,.22);padding:12px}
.pop-input-t{font-size:.8rem;font-weight:700;margin-bottom:8px;white-space:pre-line}
.pop-input input{width:100%;box-sizing:border-box;font:inherit;font-size:.9rem;padding:8px 10px;border:1px solid var(--border);border-radius:8px}
.pop-input-b{display:flex;gap:8px;justify-content:flex-end;margin-top:10px}
.dam-flist{max-height:52vh;overflow:auto}
.dam-fparent{font-size:.68rem;color:var(--faint);font-weight:400}
.dam-fbtns{display:flex;flex-wrap:wrap;gap:5px;margin:8px 0 14px}
/* Begriff-Auswahl für Datum-Ordner */
.dam-terms{display:flex;flex-wrap:wrap;gap:6px}
.dam-term{font:inherit;font-size:.8rem;font-weight:600;padding:6px 12px;border:1px solid var(--border);border-radius:999px;background:var(--surface);cursor:pointer;color:var(--text);display:inline-flex;align-items:center;gap:4px}
.dam-term:hover{border-color:var(--accent);background:var(--accent-soft)}
.dam-term.own{border-style:dashed;color:var(--accent)}
.dam-term.edit{cursor:default}
.dam-term.edit:hover{border-color:var(--border);background:var(--surface)}
/* Begriff-Auswahl NEU: 2 Spalten mit Luft, Datum gedimmt, Begriff farbig+fett */
.dam-terms2{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px}
.dam-terms2.manage{grid-template-columns:1fr 1fr}
.dam-term2{display:flex;align-items:center;gap:8px;font:inherit;font-size:.86rem;padding:9px 13px;border:1px solid color-mix(in srgb, var(--tc, var(--border)) 45%, var(--border));border-radius:10px;background:color-mix(in srgb, var(--tc, transparent) 7%, var(--surface));cursor:pointer;color:var(--text);text-align:left;min-width:0}
.dam-term2:hover{border-color:var(--tc, var(--accent));box-shadow:0 2px 8px rgba(0,0,0,.08)}
.dam-term2-dot{flex:none;width:9px;height:9px;border-radius:50%;background:var(--tc, var(--border))}
.dam-term2-date{flex:none;font-size:.74rem;color:var(--faint)}
.dam-term2-name{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:color-mix(in srgb, var(--tc, var(--text)) 75%, var(--text))}
.dam-term2.own{border-style:dashed}
.dam-term2.own .dam-term2-name{color:var(--accent)}
.dam-term2.edit{cursor:grab}
.dam-term2-col{flex:none;width:26px;height:22px;padding:1px;border:1px solid var(--border);border-radius:6px;background:var(--surface);cursor:pointer}
/* Ordner-Sortierung in der Seitenleiste */
.dam-fsort{display:flex;gap:5px;margin:0 0 8px}
/* Such-Treffer als Baum: Vorfahren nur als gedimmter Kontext */
.dam-fctx .dam-folder{opacity:.5;font-weight:400}
/* 🗂🗂 Zwei-Ordner-Ansicht */
.dam-dualwrap{flex:1;min-width:0}
.dam-cmpbar{display:flex;align-items:center;gap:10px;margin-bottom:10px;padding:8px 12px;border:1px solid var(--border);border-radius:10px;background:var(--surface);font-size:.8rem}
.dam-cmpstat{font-weight:700}
.dam-cmpstat.same{color:#166534;background:#e7f6ec;border-radius:6px;padding:1px 8px}
.dam-dual{display:flex;gap:14px;align-items:flex-start}
.dam-pane{flex:1;min-width:0;border:1px solid var(--border);border-radius:12px;padding:10px;background:color-mix(in srgb, var(--surface) 70%, var(--bg))}
.dam-pane.dam-dropover{outline:2px dashed var(--accent);outline-offset:2px}
.dam-pane-h{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.dam-grid.pane{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));flex:1;min-width:0}
.dam-pane-row{display:flex;gap:10px;align-items:flex-start}
.dam-side.compact{position:static;flex:0 0 205px;padding:8px;font-size:.9em}
.dam-side.compact .dam-flist{max-height:34vh}
.dam-pane-name{font-weight:700;font-size:.86rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dam-by{color:var(--faint)}
.dam-date{color:var(--faint)}
.dam-subfolder{color:var(--accent);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:110px}
.dam-foldercard{border-style:dashed}
.dam-foldercard .dam-thumb.ph{font-size:2.2rem;display:flex;align-items:center;justify-content:center}
.dam-foldercard:hover{border-color:var(--accent)}
/* 🔗 Link-Sammlung im Zeigen & Ernten (Ctrl+Klick) */
.pick-linkbar{display:flex;gap:10px;align-items:center;padding:4px 12px;font-size:.8rem;color:var(--accent)}
.pick-linksel{position:absolute;outline:2px solid #16a34a;background:rgba(22,163,74,.14);pointer-events:none;border-radius:4px}
/* Original-Seite: Rechteck-Schneiden direkt auf dem Vollseiten-Abbild; bei ＋-Zoom scrollt der Wrap */
.shot-wrap{position:relative;display:block;max-width:100%;overflow:auto;cursor:crosshair}
/* ⚠ Pflichtfeld-Meldung ist klickbar (Liste + Anspringen); angesprungene Felder blinken kurz auf */
.req-warn{cursor:pointer;text-decoration:underline dotted;text-underline-offset:3px}
.req-warn:hover{filter:brightness(1.2)}
@keyframes pfblink{0%,100%{outline-color:transparent}50%{outline-color:#dc2626}}
.pf-blink{outline:3px solid #dc2626;outline-offset:3px;border-radius:8px;animation:pfblink .65s ease 3}
.pflicht-row{display:flex;gap:10px;align-items:flex-end;margin-bottom:12px}
.pflicht-row>.pf-row{flex:1;margin:0}
/* 🪄 Direkt-Links: Drop-Zone für Links aus dem Browser (gestrichelt beim Drüberziehen) */
.link-dropbox{border:2px dashed transparent;border-radius:10px;padding:4px;transition:.15s}
.link-dropbox.drop-an{border-color:var(--accent);background:rgba(37,99,235,.06)}
/* 📥 Import-Knopf leuchtet, wenn eine Datei darüber schwebt */
.btn.drop-an,label.drop-an{outline:2px dashed var(--accent);outline-offset:2px;background:rgba(37,99,235,.08)}
@media(max-width:1000px){.dam-dual{flex-direction:column}}
.dam-folder-row .dam-folder{flex:1;min-width:0}
.dam-folder-row .iconb{opacity:0;transition:opacity .12s}
.dam-folder-row:hover .iconb{opacity:.8}
.dam-chips{display:flex;flex-wrap:wrap;gap:5px}
.dam-chip{font:inherit;font-size:.74rem;font-weight:600;padding:3px 10px;border-radius:999px;border:1px solid var(--border);background:var(--surface);cursor:pointer;color:var(--text)}
.dam-chip:hover{border-color:var(--accent)}
.dam-chip.on{background:var(--accent);border-color:var(--accent);color:#fff}
.dam-main{flex:1;min-width:0}
.dam-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.dam-main.dam-dropover{outline:2px dashed var(--accent);outline-offset:4px;border-radius:12px}
.dam-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:12px}
.dam-card{display:flex;flex-direction:column;gap:6px;font:inherit;text-align:left;border:1px solid var(--border);background:var(--surface);border-radius:12px;padding:8px;cursor:pointer;color:var(--text)}
.dam-card:hover{border-color:var(--accent);box-shadow:0 4px 14px rgba(0,0,0,.08)}
.dam-card{position:relative}
.dam-warncard{border-color:#e5b3b3;background:#fdf7f7}
.dam-warnbadge{position:absolute;top:6px;right:6px;z-index:2;font-size:.66rem;font-weight:800;color:#fff;background:#d64545;border-radius:6px;padding:2px 7px;box-shadow:0 1px 4px rgba(0,0,0,.25)}
/* Mehrfachauswahl: Häkchen oben links, gewählte Kachel markiert, Auswahl-Leiste */
.dam-selchk{position:absolute;top:8px;left:8px;z-index:3;width:17px;height:17px;cursor:pointer;accent-color:var(--accent)}
/* ⬇ Einzel-Download auf der Kachel — erscheint beim Überfahren; bei ⚠-Kacheln unter das Badge versetzt */
.dam-dlbtn{position:absolute;top:6px;right:6px;z-index:3;display:none;width:26px;height:26px;line-height:26px;text-align:center;background:var(--surface);border:1px solid var(--border);border-radius:7px;cursor:pointer;font-size:.85rem;box-shadow:0 1px 4px rgba(0,0,0,.18)}
.dam-card:hover .dam-dlbtn{display:block}
.dam-dlbtn:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.dam-warncard .dam-dlbtn{top:34px}
/* Bildtyp (Pflicht-Metadatum am Bild) */
.dam-itype{font-size:.64rem;font-weight:700;background:var(--accent-soft);color:var(--accent);border-radius:5px;padding:1px 6px}
.dam-itype.missing{background:#fdf3e0;color:#b7791f}
.dam-chip.warnchip{border-color:#f3e2c0;color:#b7791f}
.dam-chip.warnchip.on{background:#b7791f;border-color:#b7791f;color:#fff}
/* Scrape-Panel: ＋-Anhängen-Knopf auf Galerie-Bildern */
.scrape-imgwrap{position:relative;display:inline-block}
.scrape-img-add{position:absolute;top:4px;right:4px;width:22px;height:22px;border:1px solid var(--border);border-radius:6px;background:var(--surface);cursor:pointer;font-size:.8rem;line-height:1;padding:0;box-shadow:0 1px 4px rgba(0,0,0,.18)}
.scrape-img-add:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
/* 📤 Export-Dialog */
.dam-exp-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:10px 0}
.dam-exp-row b{font-size:.8rem;min-width:78px}
.dam-exp-chk{display:flex;align-items:center;gap:8px;margin:10px 0;font-size:.85rem;cursor:pointer}
.dam-exp-chk input{accent-color:var(--accent);width:16px;height:16px;flex:none}
.dam-card.dam-selected{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}
.dam-selbar{display:inline-flex;align-items:center;gap:8px;font-size:.8rem}
.dam-thumb{width:100%;height:110px;object-fit:contain;border-radius:8px;background:color-mix(in srgb, var(--surface) 60%, var(--bg))}
.dam-thumb.ph{display:flex;align-items:center;justify-content:center;font-size:2rem}
.dam-thumb.pdfpage{object-fit:contain;background:#fff;border:1px solid var(--border)}
/* PDF-Deckblatt-Miniatur in Dokument-Listen (Produktformular + Seite auslesen) */
.pdf-mini{flex:none;width:44px;height:58px;object-fit:contain;border:1px solid var(--border);border-radius:6px;background:#fff;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.1)}
.pdf-mini:hover{border-color:var(--accent);box-shadow:0 2px 8px rgba(0,0,0,.18)}
.pdf-mini.ph{display:inline-flex;align-items:center;justify-content:center;font-size:1.1rem}
.dam-card-name{font-size:.78rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dam-card-sub{display:flex;justify-content:space-between;font-size:.7rem;color:var(--muted)}
.dam-card-meta{display:flex;flex-wrap:wrap;gap:5px;align-items:center;font-size:.68rem;color:var(--muted)}
.dam-fmt{font-weight:800;letter-spacing:.03em;padding:0 6px;border-radius:5px;background:color-mix(in srgb, var(--border) 45%, transparent);color:var(--text)}
.dam-cs{font-weight:700;padding:0 6px;border-radius:5px;background:#e7f6ec;color:#166534}
.dam-cs.cmyk{background:#fdeaea;color:#b91c1c}
.dam-usage{color:var(--accent);font-weight:700}
.dam-card-tags{display:flex;flex-wrap:wrap;gap:3px}
.dam-minitag{font-size:.62rem;font-weight:700;padding:1px 6px;border-radius:6px;background:var(--accent-soft);color:var(--accent)}
.dam-modal{max-width:920px}
.dam-detail{display:flex;gap:18px;align-items:flex-start}
.dam-det-left{flex:0 0 46%;min-width:0}
.dam-det-right{flex:1;min-width:0}
.dam-prev{width:100%;max-height:320px;object-fit:contain;border-radius:10px;background:color-mix(in srgb, var(--surface) 60%, var(--bg))}
.dam-prev.ph{display:flex;align-items:center;justify-content:center;height:180px;font-size:1rem;color:var(--muted);padding:10px;text-align:center}
.dam-prev-pdf{width:100%;height:340px;border:1px solid var(--border);border-radius:10px;background:#fff}
.dam-det-acts{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
@media(max-width:1000px){.dam-layout{flex-direction:column}.dam-side{position:static;flex:none;width:100%}.dam-detail{flex-direction:column}}
/* Bild-Analyse (aus Bildvergleich V8) */
.dam-ana{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px;align-items:center}
.dam-ana-chip{font-size:.7rem;font-weight:700;padding:2px 8px;border-radius:6px;background:var(--accent-soft);color:var(--accent)}
.dam-ana-chip.warn{background:#fdeaea;color:#b91c1c}
.dam-ana-warn{flex:1 1 100%;font-size:.74rem;font-weight:600;color:#9a3412;background:#fdeadd;border:1px solid #f5cdb0;border-radius:8px;padding:4px 10px}
.dam-ana-ok{flex:1 1 100%;font-size:.74rem;font-weight:600;color:#166534}
/* Versions-Vergleich: Slider + Differenz */
.dam-cmp-stage{margin-top:10px}
.dam-cmp-wrap{position:relative;width:100%;max-height:440px;overflow:hidden;border-radius:10px;background:#f3f4f6}
.dam-cmp-img{display:block;width:100%;max-height:440px;object-fit:contain}
.dam-cmp-img.top{position:absolute;inset:0}
.dam-cmp-line{position:absolute;top:0;bottom:0;width:2px;background:var(--accent);box-shadow:0 0 0 1px rgba(255,255,255,.7)}
.dam-cmp-tag{position:absolute;bottom:8px;font-size:.68rem;font-weight:800;background:rgba(0,0,0,.55);color:#fff;border-radius:6px;padding:2px 8px}
.dam-cmp-tag.l{left:8px}.dam-cmp-tag.r{right:8px}
.dam-cmp-range{width:100%;margin-top:8px}
.dam-cmp-canvas{width:100%;border-radius:10px;border:1px solid var(--border)}

/* Dashboard: Fluss-Layout (Karten mit Breiten-Klassen), Skeleton, neue Karten */
.dash-flow{display:flex;flex-flow:row wrap;gap:16px;align-items:flex-start}
.dash-flow>.dash-block{margin:0}
.dash-w-full{flex:1 1 100%}
.dash-w-half{flex:1 1 calc(50% - 8px);min-width:320px}
.dash-w-third{flex:1 1 calc(33.33% - 11px);min-width:260px}
.dash-skel{border-radius:16px;background:linear-gradient(100deg,var(--surface) 40%,color-mix(in srgb, var(--surface) 60%, var(--bg)) 50%,var(--surface) 60%);background-size:200% 100%;animation:skel 1.2s infinite linear;margin-bottom:12px}
@keyframes skel{from{background-position:200% 0}to{background-position:-200% 0}}
.dash-upd{font-size:.72rem;color:var(--faint)}
.dash-laydrag{cursor:grab;outline:1px dashed var(--accent);outline-offset:2px}
.dash-hiddenmark{opacity:.45}
.cont-row{display:flex;align-items:center;gap:12px}
.cont-main{flex:1;min-width:0}
.wk-row{display:flex;gap:18px;flex-wrap:wrap}
.wk-item{display:flex;flex-direction:column;gap:2px}
.wk-num{font-size:1.5rem;line-height:1.1}
.provg-list{display:flex;flex-direction:column;gap:6px}
.provg-row{display:flex;align-items:center;gap:10px;font:inherit;font-size:.8rem;border:1px solid transparent;background:transparent;padding:4px 8px;border-radius:8px;cursor:pointer;text-align:left}
.provg-row:hover{background:var(--accent-soft)}
.provg-row.on{border-color:var(--accent);background:var(--accent-soft)}
.provg-name{flex:0 0 180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.provg-track{flex:1;height:10px;border-radius:5px;background:color-mix(in srgb, var(--border) 50%, transparent);overflow:hidden}
.provg-fill{display:block;height:100%;border-radius:5px}
.provg-cnt{flex:none;font-weight:700;min-width:22px;text-align:right}
.provg-clear{font:inherit;font-size:.7rem;font-weight:700;border:1px solid var(--accent);background:var(--accent-soft);color:var(--accent);border-radius:999px;padding:1px 8px;cursor:pointer;margin-left:8px}
.qual-tbl{display:flex;flex-direction:column}
.qual-row{display:grid;grid-template-columns:minmax(120px,1.2fr) minmax(140px,1.6fr) 60px 70px 70px;gap:10px;align-items:center;font:inherit;font-size:.8rem;text-align:left;border:none;background:transparent;padding:6px 8px;border-radius:8px;cursor:pointer;color:var(--text)}
.qual-row:hover{background:var(--accent-soft)}
.qual-head{cursor:default;font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:var(--faint)}
.qual-head:hover{background:transparent}
.qual-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.qual-bar{position:relative;height:12px;border-radius:6px;background:color-mix(in srgb, var(--border) 50%, transparent);overflow:hidden}
.qual-fill{display:block;height:100%;border-radius:6px}
.qual-pct{position:absolute;right:4px;top:-2px;font-size:.62rem;font-weight:800;color:var(--muted)}
.qual-warn{color:var(--danger);font-weight:700}
.age-badge{font-size:.68rem;color:var(--muted);margin-left:5px}
.age-badge.old{color:var(--danger);font-weight:700}
.dash-skuin{width:86px;font-size:.76rem;padding:4px 7px;border:1px solid var(--border);border-radius:7px}
.qa-cfg{display:flex;flex-wrap:wrap;gap:4px 14px;border-top:1px dashed var(--border);margin-top:10px;padding-top:4px}
.qa-cfg-item{display:inline-flex;align-items:center;gap:5px;font-size:.76rem;color:var(--muted);cursor:pointer}
/* Aufklappbare Dashboard-Karten (FAQ-Stil) */
.fold-head{cursor:pointer;user-select:none}
.fold-head:hover b{color:var(--accent)}
.fold-chev{flex:none;width:18px;height:18px;color:var(--muted);display:inline-flex;transition:transform .18s}
.fold-chev svg{width:100%;height:100%}
.dash-block:not(.folded) .fold-chev{transform:rotate(90deg)}
.dash-block.folded .dash-fold-body{display:none}
.dash-block.folded .dash-block-h{margin-bottom:0}
.dash-cols-2{grid-template-columns:1.5fr 1fr}
.dash-block{padding:12px 14px}
.dash-block-h{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.dash-block-h b{font-size:1rem;color:var(--text)}
.dash-block-h .muted{margin-left:auto;text-align:right}
.link-btn{margin-left:auto;border:none;background:none;color:var(--accent);font:inherit;font-size:.8rem;font-weight:600;cursor:pointer;white-space:nowrap}
.link-btn:hover{text-decoration:underline}

.donut-row{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.donut-wrap{position:relative;width:148px;height:148px;flex:none}
.donut{width:148px;height:148px;border-radius:50%}
.donut-hole{position:absolute;inset:26px;background:var(--surface);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center}
.donut-hole b{font-size:1.35rem;font-weight:800;color:var(--text);font-variant-numeric:tabular-nums}
.donut-hole span{font-size:.66rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.legend{display:flex;flex-direction:column;gap:9px;flex:1;min-width:170px}
.legend-item{display:flex;align-items:center;gap:9px;font-size:.85rem}
.lg-dot{width:11px;height:11px;border-radius:3px;flex:none}
.lg-name{flex:1;color:var(--text);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lg-pct{font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}
.lg-cnt{color:var(--faint);font-size:.8rem;font-variant-numeric:tabular-nums}

.cbars{display:flex;flex-direction:column;gap:15px}
.cbar-top{display:flex;justify-content:space-between;font-size:.85rem;margin-bottom:6px}
.cbar-pct{font-weight:700;font-variant-numeric:tabular-nums}
.cbar-track{height:8px;background:var(--border-2);border-radius:99px;overflow:hidden}
.cbar-fill{height:100%;border-radius:99px;background:var(--grad)}

.recent-tbl{display:flex;flex-direction:column}
.recent-row{display:flex;align-items:center;gap:12px;padding:9px 6px;border-bottom:1px solid var(--border-2);cursor:pointer;border-radius:8px}
.recent-row:hover{background:var(--accent-soft)}
.recent-row:last-child{border-bottom:none}
.recent-th{width:40px;height:40px;border-radius:8px;object-fit:contain;background:#f7f9fc;flex:none}
.recent-th.ph{background:var(--accent-soft)}
.recent-main{flex:1;min-width:0}
.recent-name{font-weight:600;font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.recent-sub{font-size:.75rem;color:var(--muted)}
.recent-sku{font-size:.78rem;color:var(--muted);flex:none}
.recent-when{font-size:.75rem;color:var(--faint);flex:none;min-width:70px;text-align:right}

.qa-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.qa-tile{display:flex;flex-direction:column;align-items:center;gap:8px;padding:18px 10px;border:1px solid var(--border);border-radius:14px;background:var(--surface);cursor:pointer;transition:border-color .12s,background .12s,transform .12s}
.qa-tile:hover{border-color:var(--accent);background:var(--accent-soft);transform:translateY(-1px)}
.qa-ic{font-size:1.5rem}
.qa-lbl{font-size:.82rem;font-weight:600;color:var(--text)}

.rev-grid{display:flex;flex-direction:column;gap:6px}   /* Abschnitte stapeln dicht — kein Leerraum durch Spalten-Angleich */
.rev-sec-h{display:flex;align-items:center;gap:8px;font-weight:700;font-size:.82rem;color:var(--text);margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid var(--border-2)}
.rev-empty{font-size:.82rem;color:var(--green);padding:6px 2px}
.ok-badge{color:var(--green);font-size:.78rem;font-weight:700;margin-left:8px}
#dash-review{scroll-margin-top:14px}

@media(max-width:1000px){.dash-cols,.dash-cols-2{grid-template-columns:1fr}}

/* ===== Dashboard: farbige Icons, Kopfzeile, Aktivität, Status ===== */
.ic-box{width:34px;height:34px;flex:none;border-radius:10px;display:grid;place-items:center}
.ic-box svg{width:19px;height:19px}
.btn-ico{display:inline-grid;place-items:center}
.btn-ico svg{width:16px;height:16px;vertical-align:middle}
.kpi-accent .ic-box{background:var(--grad)!important;color:#fff}

/* Heute wichtig — priorisierte Aufgaben-Zeile zuoberst */
.dash-prio{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:7px 12px;margin-bottom:10px;box-shadow:var(--shadow)}
.dash-prio-t{font-size:.82rem;color:var(--muted)}
.dash-prio-chip{font:inherit;font-size:.8rem;font-weight:600;border:1px solid #cfe0f4;background:var(--accent-soft);color:var(--accent);border-radius:999px;padding:4px 12px;cursor:pointer}
.dash-prio-chip:hover{border-color:var(--accent)}
.dash-prio-chip.warn{background:#fdf3e0;color:#b7791f;border-color:#f3e2c0}
.dash-prio.done{background:#eaf7ef;border-color:#bbe7c9}
.dash-prio-emoji{font-size:1.25rem}
.dash-topbar{display:flex;align-items:flex-start;gap:12px;margin-bottom:10px;flex-wrap:wrap}
.dash-topbar h1{font-size:1.3rem;font-weight:800;color:var(--text);letter-spacing:-.01em}
.dash-topbar p{margin:3px 0 0}
.top-acts{display:flex;align-items:center;gap:10px;margin-left:auto;flex-wrap:wrap}
.top-search{display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--border);border-radius:11px;padding:8px 12px;min-width:220px;color:var(--muted)}
.top-search-in{border:none;outline:none;background:none;font:inherit;flex:1;min-width:0;color:var(--text)}
.kbd{border:1px solid var(--border);border-radius:6px;padding:1px 6px;font-size:.7rem;color:var(--faint)}
.top-bell{position:relative;width:40px;height:40px;border:1px solid var(--border);background:var(--surface);border-radius:11px;cursor:pointer;display:grid;place-items:center;color:var(--muted)}
.top-bell:hover{border-color:var(--accent);color:var(--accent)}
.top-bell svg{width:19px;height:19px}
.top-bell-badge{position:absolute;top:-5px;right:-5px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--danger);color:#fff;font-size:.68rem;font-weight:700;display:grid;place-items:center}
.top-acts .btn .btn-ico{margin-right:3px}

.dash-cols-3{grid-template-columns:1fr 1fr 1fr}
.act-list{display:flex;flex-direction:column}
.act-row{display:flex;align-items:flex-start;gap:11px;padding:9px 2px;border-bottom:1px solid var(--border-2)}
.act-row:last-child{border-bottom:none}
.act-row .ic-box{width:30px;height:30px}
.act-row .ic-box svg{width:16px;height:16px}
.act-main{flex:1;min-width:0}
.act-txt{font-size:.84rem;line-height:1.35}
.act-txt b{color:var(--text);font-weight:600}
.act-sub{font-size:.72rem;color:var(--faint)}
.act-when{font-size:.72rem;color:var(--faint);white-space:nowrap;flex:none}

.io-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--border-2)}
.io-row:last-child{border-bottom:none}
.io-main{flex:1;min-width:0}
.io-h{font-weight:600;font-size:.9rem}
.io-sub{font-size:.78rem}
.io-row .btn.sm{flex:none}

.qa-tile .ic-box{width:42px;height:42px}
.qa-tile .ic-box svg{width:22px;height:22px}

/* Status-Schalter im Produkt-Formular */
.pf-status{border:1px solid var(--border);border-radius:20px;padding:3px 10px;font:inherit;font-size:.72rem;font-weight:700;cursor:pointer;background:var(--surface)}
.pf-status.s-aktiv{color:#16794f;background:#e7f6ec;border-color:#bfe6cd}
.pf-status.s-inaktiv{color:#9a6a12;background:#fdf3e0;border-color:#f2dca9}
.pf-status.s-entwurf{color:var(--accent);background:var(--accent-soft);border-color:#d6d4fb}
.pf-status.s-archiviert{color:#64748b;background:#eef1f5;border-color:#dbe1ea}

@media(max-width:1100px){.dash-cols-3{grid-template-columns:1fr}}

/* ===== Fix: Spalten auf volle Höhe + Reiter/Fuss nicht stauchen ===== */
.prod-catcol,.prod-artcol,.prod-formcol{height:calc(100vh - 104px);max-height:none}
.prod-artcol{display:flex;flex-direction:column;overflow:hidden}
.prod-artcol .col-head{flex:none}
.prod-artcol .art-list{flex:1;overflow:auto;min-height:0}
.prod-artcol .art-pager{flex:none}
/* Reiter-Kopf, Reiter-Leiste und Fuss behalten ihre Höhe, nur das Panel scrollt */
.prod-formcol .pf-tophead,.prod-formcol .pf-tabs,.prod-formcol .pf-foot{flex:none}
.prod-formcol .pf-tabs{min-height:44px}

/* ===== Vom Basisartikel geerbte Medien (für alle Varianten) ===== */
.mv-inherited{margin-bottom:12px}
.mv-inh-h{font-size:.72rem;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:.03em;margin-bottom:8px;display:flex;align-items:center;flex-wrap:wrap}
.mv-own-h{font-size:.72rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;margin:2px 0 8px}
.mv-thumb.inh::after{content:'geerbt';position:absolute;bottom:3px;left:3px;font-size:.56rem;font-weight:700;color:#fff;background:rgba(99,102,241,.85);border-radius:5px;padding:1px 5px;pointer-events:none}
.mv-doc.inh{background:var(--accent-soft);border-color:#d6d4fb}

/* ---- Produkt-Import-Dialog ---- */
.imp-overlay{position:fixed;inset:0;z-index:140;background:rgba(15,23,42,.42);display:flex;align-items:flex-start;justify-content:center;padding:40px 16px;overflow:auto}
.imp-modal{background:#fff;border-radius:16px;box-shadow:0 24px 60px rgba(15,23,42,.28);width:min(860px,100%);max-height:calc(100vh - 80px);display:flex;flex-direction:column;overflow:hidden}
.imp-head{display:flex;align-items:center;gap:12px;padding:16px 22px;border-bottom:1px solid var(--border)}
.imp-head .spacer{flex:1}
.imp-body{padding:18px 22px;overflow:auto}
.imp-sec{margin-bottom:16px}
.imp-2col{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.imp-lbl{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);margin:0 0 6px}
.imp-paste{width:100%;min-height:120px;border:1px solid var(--border);border-radius:10px;padding:10px 12px;font:13px/1.5 ui-monospace,'Consolas',monospace;resize:vertical;box-sizing:border-box}
.imp-orrow{display:flex;align-items:center;gap:10px;margin-top:8px;flex-wrap:wrap}
.imp-fname{font-size:.82rem}
.imp-sel{width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:9px;background:#fff;font-size:.86rem}
.imp-actions{display:flex;justify-content:flex-end;margin-top:8px}
.imp-result:empty{display:none}
.imp-result{margin-top:8px;border-top:1px solid var(--border);padding-top:16px}
.imp-map{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.imp-maprow{display:grid;grid-template-columns:1fr 20px 1.3fr;align-items:center;gap:8px}
.imp-h{font-size:.82rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-arr{color:var(--faint);text-align:center}
.imp-msel{padding:6px 8px;border:1px solid var(--border);border-radius:8px;background:#fff;font-size:.82rem;max-width:100%}
.imp-sum{display:flex;align-items:center;gap:8px;margin:4px 0 16px;flex-wrap:wrap}
.imp-chip{font-size:.76rem;font-weight:700;border-radius:20px;padding:4px 12px}
.imp-chip.new{background:rgba(34,197,94,.14);color:#15803d}
.imp-chip.upd{background:rgba(99,102,241,.14);color:#4f46e5}
.imp-chip.skip{background:rgba(245,158,11,.16);color:#b45309}
.imp-prev{max-height:260px;overflow:auto;border:1px solid var(--border);border-radius:10px}
.imp-prow{display:flex;align-items:center;gap:10px;padding:6px 10px;border-bottom:1px solid var(--border)}
.imp-prow:last-child{border-bottom:none}
.imp-badge{flex:none;font-size:.64rem;font-weight:800;border-radius:6px;padding:2px 7px;letter-spacing:.02em}
.imp-pname{flex:1;min-width:0;font-size:.85rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-pnote{flex:none;font-size:.76rem}
@media(max-width:640px){.imp-2col{grid-template-columns:1fr}.imp-maprow{grid-template-columns:1fr 16px 1fr}}

/* ---- Infos & Tipps: Karte (Dashboard + Vorschau) ---- */
.tips-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.tip-item{border:1px solid var(--border);border-left:4px solid var(--tipc,#6366f1);border-radius:10px;padding:12px 14px;background:#fff}
.tip-head{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.tip-emoji{font-size:1.25rem;line-height:1}
.tip-title{font-weight:700;font-size:.92rem}
.tip-img{width:100%;max-height:160px;object-fit:cover;border-radius:8px;margin:8px 0 4px}
.tip-text{font-size:.85rem;color:var(--muted);line-height:1.5;white-space:pre-wrap;margin-top:4px}
/* ---- Infos & Tipps: Editor ---- */
.tip-editor{display:flex;flex-direction:column;gap:14px}
.tip-edit-row{border:1px solid var(--border);border-radius:10px;padding:12px;background:#fbfcfe}
.tip-edit-top{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.tip-emoji-in{width:54px;text-align:center;font-size:1.15rem;padding:7px 4px;border:1px solid var(--border);border-radius:8px}
.tip-title-in{flex:1;padding:7px 10px;border:1px solid var(--border);border-radius:8px;font-size:.9rem}
.tip-color-in{width:42px;height:36px;padding:2px;border:1px solid var(--border);border-radius:8px;background:#fff;cursor:pointer;flex:none}
.tip-tools{display:flex;gap:4px;margin-left:auto}
.tip-text-in{width:100%;min-height:62px;border:1px solid var(--border);border-radius:8px;padding:8px 10px;font:inherit;font-size:.85rem;resize:vertical;box-sizing:border-box}
.tip-img-prev{margin-top:8px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.tip-img-prev img{max-width:170px;max-height:110px;border-radius:8px;border:1px solid var(--border);object-fit:cover}
.tip-prev{margin-top:10px}

/* ---- Netzwerk / Graph ---- */
.graph-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 12px}
.g-pill{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border:1px solid var(--border);border-radius:100px;background:#fff;font-size:.8rem;color:var(--muted);cursor:pointer;transition:all .15s;opacity:.5}
.g-pill.on{opacity:1;color:var(--text,#0f172a);border-color:var(--border-hover,#cbd5e1);box-shadow:0 1px 3px rgba(0,0,0,.04)}
.g-pill:hover{border-color:var(--accent)}
.g-dot{width:9px;height:9px;border-radius:50%;flex:none}
.g-dot.sm{width:7px;height:7px}
.g-cnt{font-size:.68rem;background:#eef2f7;border-radius:8px;padding:1px 6px;color:var(--muted);font-weight:600}
.graph-stage{position:relative;height:calc(100vh - 200px);min-height:420px;border:1px solid var(--border);border-radius:14px;overflow:hidden;background:radial-gradient(circle at 50% 40%,#fff, #f7f8fc)}
.graph-canvas{display:block;width:100%;height:100%;cursor:default}
.graph-detail{position:absolute;top:14px;right:14px;width:300px;max-height:calc(100% - 28px);overflow:auto;background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 8px 30px rgba(15,23,42,.12);padding:16px 16px 14px}
.graph-detail.hidden{display:none}
.g-close{position:absolute;top:8px;right:10px;border:none;background:none;font-size:1.2rem;line-height:1;color:var(--faint);cursor:pointer}
.g-close:hover{color:var(--muted)}
.g-d-type{display:inline-flex;align-items:center;gap:6px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
.g-d-name{font-size:1.05rem;font-weight:700;margin:4px 0 8px;line-height:1.3}
.g-d-facts{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.g-chip{font-size:.72rem;background:var(--surface-2,#f1f5f9);color:var(--muted);border-radius:20px;padding:3px 9px}
.g-chip.pin{background:rgba(148,163,184,.18);color:#475569;font-weight:600}
.g-d-sub{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--faint);margin:6px 0 5px}
.g-d-links{display:flex;flex-direction:column;gap:3px;max-height:220px;overflow:auto}
.g-link{display:flex;align-items:center;gap:7px;padding:5px 7px;border:none;background:none;border-radius:7px;font-size:.82rem;color:var(--text,#0f172a);cursor:pointer;text-align:left;width:100%}
.g-link:hover{background:var(--accent-soft)}
.g-d-acts{display:flex;flex-direction:column;gap:7px;margin-top:12px}
.g-d-acts .btn{width:100%;justify-content:center}

/* ---- Design-Auswahl (Einstellungen → Darstellung) ---- */
.theme-row{display:flex;gap:12px;flex-wrap:wrap}
.theme-opt{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1.5px solid var(--border);border-radius:12px;background:var(--surface);cursor:pointer;text-align:left;min-width:230px;transition:.15s;font:inherit;color:var(--text)}
.theme-opt:hover{border-color:var(--faint)}
.theme-opt.on{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.theme-sw{width:46px;height:46px;border-radius:10px;flex:none;border:1px solid rgba(0,0,0,.06)}
.theme-sw.sw-standard{background:linear-gradient(135deg,#6366f1,#8b5cf6)}
.theme-sw.sw-neo{background:#e7ebf2;box-shadow:inset 3px 3px 6px rgba(158,172,199,.6),inset -3px -3px 6px rgba(255,255,255,.9)}
.theme-name{font-weight:600;font-size:.9rem}
.theme-desc{font-size:.78rem;margin-top:2px}

/* 🕘 Änderungs-Verlauf */
.hist-tbl{border-collapse:collapse;width:100%;font-size:.8rem}
.hist-tbl th{background:#eef0ff;text-align:left;padding:5px 8px;position:sticky;top:0}
.hist-tbl td{padding:4px 8px;border-bottom:1px solid var(--border-2);vertical-align:top}
.hist-old{color:var(--faint);text-decoration:line-through;max-width:180px;overflow:hidden;text-overflow:ellipsis}
.hist-new{color:var(--text);font-weight:600;max-width:200px}
/* 📊 Content-Score je Kanal (Qualitäts-Ampel) */
.chan-score{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;font-weight:600}
.chan-dot{width:10px;height:10px;border-radius:50%;flex:none}
.chan-dot.ok{background:#16a34a}.chan-dot.mid{background:#d97706}.chan-dot.bad{background:#dc2626}
.chan-bar{height:7px;border-radius:5px;background:#eef0f4;overflow:hidden;flex:1;min-width:60px}
.chan-bar span{display:block;height:100%;border-radius:5px}
/* 🧩 Kategorie-Vorlage */
.tpl-pick{display:flex;flex-direction:column;gap:6px}
.tpl-pick-item{display:flex;align-items:center;gap:10px;border:1px solid var(--border);border-radius:10px;padding:8px 12px;cursor:pointer;background:var(--surface)}
.tpl-pick-item:hover{border-color:var(--accent);background:var(--accent-soft)}

/* 🧭 Begleiter — geführte Hilfe (ohne KI) */
.beg-fab{position:fixed;right:22px;bottom:22px;z-index:120;width:52px;height:52px;border-radius:50%;border:none;background:var(--grad);color:#fff;padding:0;overflow:hidden;cursor:pointer;box-shadow:0 6px 18px rgba(99,102,241,.4)}
.beg-fab-img{width:100%;height:100%;border-radius:50%;object-fit:cover;object-position:50% 50%;display:block}
.beg-fab:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(99,102,241,.5)}
.beg-panel{position:fixed;right:22px;bottom:86px;z-index:121;width:360px;max-width:calc(100vw - 44px);max-height:72vh;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:0 16px 44px rgba(16,24,40,.24);overflow:hidden}
.beg-head{display:flex;align-items:center;gap:8px;padding:12px 14px;background:var(--side);color:#fff}
.beg-head b{font-size:.95rem}
.beg-logo{display:inline-flex}
.beg-logo img{width:22px;height:22px;border-radius:50%;object-fit:cover;object-position:50% 50%;display:block}
.beg-back,.beg-x{border:none;background:rgba(255,255,255,.14);color:#fff;width:26px;height:26px;border-radius:7px;cursor:pointer;font-size:1rem;line-height:1}
.beg-back:hover,.beg-x:hover{background:rgba(255,255,255,.28)}
.beg-sub{padding:10px 14px;font-size:.8rem;color:var(--muted);border-bottom:1px solid var(--border-2)}
.beg-list{overflow:auto;padding:6px}
.beg-topic{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:none;background:none;padding:10px 12px;border-radius:10px;cursor:pointer;font:inherit;font-size:.86rem;color:var(--text)}
.beg-topic:hover{background:var(--accent-soft)}
.beg-ic{font-size:1.1rem;width:24px;text-align:center}
.beg-arrow{margin-left:auto;color:var(--faint);font-size:1.1rem}
.beg-steps{overflow:auto;padding:10px 12px;display:flex;flex-direction:column;gap:8px}
.beg-step{display:flex;align-items:flex-start;gap:9px;font-size:.83rem;line-height:1.5}
.beg-num{flex:none;width:20px;height:20px;border-radius:50%;background:var(--accent-soft);color:var(--accent);font-weight:700;font-size:.72rem;display:flex;align-items:center;justify-content:center;margin-top:1px}
.beg-goto{flex:none;margin-left:auto;border:1px solid var(--border);background:var(--surface);color:var(--accent);width:26px;height:26px;border-radius:7px;cursor:pointer;font-weight:700}
.beg-goto:hover{background:var(--accent);color:#fff;border-color:var(--accent)}

/* KI-Android-Icon (ersetzt das 🤖-Emoji auf allen KI-Knöpfen) */
.ki-ico{width:17px;height:17px;border-radius:50%;object-fit:cover;object-position:50% 50%;vertical-align:-4px;margin-right:6px;background:#eef2f8;box-shadow:0 0 0 1px rgba(0,0,0,.06)}
button:disabled .ki-ico{opacity:.5}


/* Marken-Chip beim Lieferanten: kleiner „→" springt zur Marke */
.brand-chip{display:inline-flex;align-items:center}
.brand-chip .brand-goto{margin-left:6px;padding:0 5px;border-radius:6px;color:var(--accent);font-weight:700;opacity:.6;cursor:pointer}
.brand-chip .brand-goto:hover{opacity:1;background:var(--accent-soft)}

/* 🌾 Web-Ernte im Auslesen-Panel: Auswahl-Häkchen + Sammel-Leiste */
.harvest-bar{display:flex;align-items:center;gap:8px;padding:8px 12px;border-top:1px solid var(--border);background:var(--accent-soft);border-radius:0 0 12px 12px}
.hv-chk{position:absolute;top:4px;left:4px;z-index:3;width:17px;height:17px;accent-color:var(--accent);cursor:pointer;background:#fff;border-radius:4px}
.scrape-imgwrap{position:relative;display:inline-block}
.scrape-docrow .hv-chk{position:static;flex:none;margin-right:2px}
.scrape-img-logo{right:auto;left:4px;top:auto;bottom:4px;width:auto;padding:0 7px;font-size:.7rem;font-weight:700}

/* 🖱 Zeigen & Ernten: klickbares Seiten-Abbild mit Element-Landkarte */
.pick-wrap{overflow:auto;flex:1;min-height:200px;border:1px solid var(--border);border-radius:10px;background:#fff}
.pick-inner{position:relative;cursor:crosshair}
.pick-shot{display:block;width:100%;height:auto;user-select:none}
.pick-hl{position:absolute;border:2px solid var(--accent);background:rgba(79,109,205,.12);pointer-events:auto;cursor:grab;border-radius:3px;z-index:2}
.pick-hl:active{cursor:grabbing}
.pick-lbl{position:absolute;background:var(--accent);color:#fff;font-size:.68rem;padding:1px 6px;border-radius:4px;pointer-events:none;white-space:nowrap;z-index:4}
.pick-sel{position:absolute;border:2px solid #2f9e63;background:rgba(47,158,99,.15);pointer-events:none;border-radius:3px;z-index:1}
.pick-rubber{position:absolute;border:2px dashed var(--accent);background:rgba(79,109,205,.1);pointer-events:none;z-index:3}
.pick-menu{position:absolute;display:flex;gap:6px;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:6px;box-shadow:0 8px 24px rgba(0,0,0,.18);z-index:6}

/* 🔀 Kategorien umsortieren: Einfüge-Linien beim Ziehen + ↑/↓ beim Zeigen */
.tnode.drop-before{box-shadow:inset 0 3px 0 var(--accent)}
.tnode.drop-after{box-shadow:inset 0 -3px 0 var(--accent)}
.tnode .tmove{display:inline-flex;opacity:0;transition:opacity .12s}
.tnode:hover .tmove{opacity:.9}
.tmove .iconb{padding:1px 4px;font-size:.72rem;line-height:1.2}

/* 📄 Datenblatt-Vorlagen: Briefkopf-Zeile, Abschnitts-Liste, Logo-Vorschau */
.stpl-row{display:flex;align-items:center;gap:10px;margin-top:10px;flex-wrap:wrap}
.stpl-lbl{font-size:.78rem;font-weight:600;color:var(--muted);min-width:64px}
.stpl-logo{display:inline-flex;align-items:center;gap:6px}
.stpl-logo img{height:30px;max-width:110px;object-fit:contain;background:#fff;border:1px solid var(--border);border-radius:6px;padding:2px 6px}
.stpl-secs{display:flex;flex-direction:column;gap:2px;margin-top:4px}
.stpl-sec{display:flex;align-items:center;gap:8px;padding:3px 6px;border-radius:8px;font-size:.85rem;cursor:pointer}
.stpl-sec:hover{background:var(--hover, rgba(0,0,0,.04))}
.stpl-sec.off .stpl-sec-nm{color:var(--muted);text-decoration:line-through;text-decoration-thickness:1px}
.stpl-sec-nm{flex:1}
.stpl-sec .iconb{padding:0 5px;font-size:.75rem}
.stpl-texts{display:flex;flex-wrap:wrap;gap:4px 14px;margin:2px 0 4px 30px}
.stpl-txt{display:inline-flex;align-items:center;gap:5px;font-size:.8rem;color:var(--muted);cursor:pointer}

/* 🖊 Blatt-Editor (Datenblatt-Vorlage direkt auf dem Blatt gestalten) */
.modal-box:has(.shd-wrap){max-width:none;width:min(1240px,95vw);padding:12px}
.shd-wrap{display:flex;flex-direction:column;height:min(860px,86vh)}
.shd-head{display:flex;align-items:center;gap:10px;padding:2px 4px 10px;border-bottom:1px solid var(--border)}
.shd-body{flex:1;display:flex;gap:12px;min-height:0;padding-top:10px}
.shd-frame-wrap{flex:1;overflow:auto;background:var(--bg, #eef1f6);border:1px solid var(--border);border-radius:10px;display:flex;justify-content:center;padding:14px}
.shd-frame{width:820px;min-width:820px;height:100%;border:none;background:#fff;box-shadow:0 4px 18px rgba(0,0,0,.14);border-radius:4px}
.shd-side{width:264px;flex:0 0 264px;overflow:auto;display:flex;flex-direction:column;gap:10px}
.shd-box{border:1px solid var(--border);border-radius:10px;padding:10px;font-size:.85rem}
.shd-box.flash{outline:2px solid var(--accent);transition:outline .2s}

/* Baustein-Chip im Vorlagen-Editor: ⠿-Griff zum Verschieben (nur der Griff ist ziehbar) */
.tpl-ph-grip{cursor:grab;opacity:.5;margin-right:4px;font-size:.82em;user-select:none}
.tpl-ph:hover .tpl-ph-grip{opacity:.9}
.tpl-ph-grip:active{cursor:grabbing}

/* 📂 Verschieben-Fenster: Kategorie-Liste wie der Katalog-Baum — aktuell GELB, Ziel beim Zeigen BLAU */
.catpick-row{display:flex;align-items:center;gap:8px;padding:7px 10px;border:none;background:none;border-radius:8px;cursor:pointer;font:inherit;font-size:.88rem;text-align:left;width:100%}
.catpick-row:hover{background:var(--accent-soft);color:var(--accent)}
.catpick-row.cur{background:#fdf3d2;cursor:default}
.catpick-row.cur:hover{background:#fdf3d2;color:inherit}
.catpick-row .cat-ico{width:20px;height:20px;object-fit:contain;flex:none}
.catpick-row .cat-ico-ph{width:20px;flex:none}
.catpick-cur{margin-left:auto;font-size:.68rem;font-weight:700;color:#8a6d1a;background:#f6e3a1;border-radius:8px;padding:1px 8px}

/* ⬚-Gruppen im Vorlagen-Editor: sichtbare Eckklammern [ ] an den Rändern der farbigen Gruppe */
.rte-area .tpl-opt::before{content:'[';font-weight:800;color:#5a6472;margin-right:1px}
.rte-area .tpl-opt::after{content:']';font-weight:800;color:#5a6472;margin-left:1px}
.rte-area .tpl-ph{cursor:grab}
.rte-area .tpl-ph:active{cursor:grabbing}

/* Baustein-Palette im Titel-Dialog: GRÜN = steckt schon in der Vorlage (BP oder Variante) */
.tpl-chip.used{background:#e7f6ec;border-color:#22c55e;color:#15803d;font-weight:600}
.tpl-chip.used::before{content:'✓ ';font-weight:800}

/* ⬚ Klick-Gruppier-Modus: gewählte Bausteine gelb umrandet, Hinweis-Zeile unter der Werkzeugleiste */
.rte-area .tpl-ph.gsel{outline:2px solid #f0b429;outline-offset:1px;border-radius:6px;background:#fdf3d2}
.rte-area.grp-mode .tpl-ph{cursor:pointer}
.rte-btn.on{background:var(--accent-soft);color:var(--accent)}
.rte-grphint{font-size:.75rem;color:#8a6d1a;background:#fdf6dd;border-bottom:1px solid #f0dfa8;padding:5px 10px}

/* 🚦 Artikelliste: BP-Zeilen-Ampel — orange = Planung, gelb = unvollständig, grün = vollständig */
.art-row.bp.st-plan:not(.sel){background:rgba(234,124,32,.15);border-color:#f0cba4}
.art-row.bp.st-todo:not(.sel){background:rgba(250,204,21,.14);border-color:#eddfa0}
.art-row.bp.st-done:not(.sel){background:rgba(34,197,94,.11);border-color:#bfe3ca}

/* 📝 Lücken begründen: Status-Punkte im Dialog */
.gap-dot{width:10px;height:10px;border-radius:50%;flex:none}
.gap-dot.ok{background:#22c55e}
.gap-dot.fehlt{background:#f0b429}

/* ⏳ Lade-Spinner (Seite auslesen / Zeigen & Ernten) — sichtbares „es läuft" */
.lade-spin{width:34px;height:34px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;flex:none;animation:ladespin .8s linear infinite;margin-bottom:10px}
@keyframes ladespin{to{transform:rotate(360deg)}}

/* Typ-Etiketten an Bildern/Dokumenten (Bildtyp, Dokumenttyp, Sprache) — steuern die Datei-Benennung */
.mv-typ{position:absolute;left:5px;bottom:5px;z-index:2;font-size:.82rem;line-height:1;padding:5px 9px;border-radius:9px;
  border:1px solid var(--border);background:var(--bg);color:var(--muted);cursor:pointer;opacity:.92;font-weight:600}
.mv-typ:hover{border-color:var(--accent);color:var(--accent);opacity:1}
.mv-typ.on{background:var(--accent-soft, #eaf0fb);border-color:var(--accent);color:var(--accent);font-weight:700}
.mv-typ.dok{position:static;flex:none;font-size:.8rem;border-radius:9px}
.mv-typ.warn{border-style:dashed;color:#b0812c;border-color:#d9b970}
/* z-index ÜBER .hovzoom(1300) — das Schnitt-Menü öffnet mitten im Vorschau-Panel und war sonst dahinter versteckt */
.typ-menu{position:fixed;z-index:1400;background:var(--bg);border:1px solid var(--border);border-radius:10px;
  box-shadow:0 10px 30px rgba(0,0,0,.16);padding:4px;display:flex;flex-direction:column;gap:2px;min-width:190px;max-height:320px;overflow:auto}
.typ-mi{text-align:left;border:0;background:none;padding:6px 10px;border-radius:7px;font-size:.8rem;cursor:pointer;color:var(--text)}
.typ-mi:hover{background:var(--accent-soft, #eaf0fb)}
.typ-mi.on{font-weight:700;color:var(--accent)}
.typ-in{margin:4px;padding:5px 8px;border:1px solid var(--border);border-radius:7px;font-size:.78rem}
/* 🔍 Hover-Lupe: grosse Vorschau neben der Miniatur (PDF-Deckblatt / Bild) */
.hovzoom{position:fixed;z-index:1300;background:var(--bg);border:1px solid var(--border);border-radius:12px;
  box-shadow:0 14px 44px rgba(0,0,0,.22);padding:6px;pointer-events:none;max-width:540px;max-height:600px;overflow:hidden}
.hovzoom img{display:block;max-width:520px;max-height:580px;width:auto;height:auto;border-radius:8px;background:#fff}
/* Gepinnte Vorschau: linke Bildschirmhälfte, 90% Höhe — bleibt stehen, rechts bleibt alles bedienbar */
.hovzoom.pin{left:12px;top:50%;transform:translateY(-50%);max-width:calc(50vw - 24px);max-height:92vh;
  pointer-events:auto;padding:8px}
/* Flüchtig (nur Drüberfahren): für die Maus durchsichtig — fängt keine Klicks, erst der Klick auf die Miniatur stellt fest */
.hovzoom.pin.fluechtig{pointer-events:none}
.hovzoom.pin.fluechtig .hz-x{display:none}
.hovzoom.pin img{max-width:calc(50vw - 44px);max-height:88vh}
.hz-x{position:absolute;top:6px;right:6px;z-index:2;width:26px;height:26px;border-radius:8px;border:1px solid var(--border);
  background:var(--bg);color:var(--muted);cursor:pointer;font-size:.8rem;line-height:1}
.hz-x:hover{color:#c0392b;border-color:#c0392b}
.hz-lade{display:flex;align-items:center;gap:12px;padding:34px 46px;color:var(--muted);font-size:.85rem}
.hz-lade .lade-spin{margin-bottom:0;width:26px;height:26px}
/* Blättern in der grossen PDF-Vorschau */
.hz-pdf{position:relative;display:flex;flex-direction:column;gap:6px;align-items:center;min-width:min(600px,calc(50vw - 48px))}
.hz-pdf img{max-width:calc(50vw - 44px);max-height:calc(88vh - 60px)}
/* width:0 + min-width:100%: die Leiste darf die Panel-Breite NIE mitbestimmen — sonst springt das
   Bild bei jedem Status-Wechsel seitlich unter der Maus weg (ihr „kann das Bild nicht speichern") */
.hz-bar{display:flex;gap:6px;align-items:center;justify-content:center;padding:2px 0;cursor:default;width:0;min-width:100%}
.hz-nav{width:38px;height:27px;border:1px solid var(--border);border-radius:8px;background:var(--bg);color:var(--text);cursor:pointer;font-size:1.05rem;line-height:1}
.hz-nav:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}
.hz-nav:disabled{opacity:.35;cursor:default}
.hz-nav.primary{background:var(--accent);color:#fff;border-color:var(--accent)}
.hz-pg{font-size:.8rem;color:var(--muted);min-width:96px;text-align:center}
/* Eigene, IMMER vorhandene Zeile unter den Knöpfen — feste Höhe/Breite, nichts verrutscht beim Text-Wechsel */
.hz-status{display:block;width:0;min-width:100%;min-height:1.2em;text-align:center;padding:0 8px 2px;
  font-size:.82rem;font-weight:700;color:var(--accent);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mv-cadbtn{border:none;background:none;cursor:pointer;padding:0}
.mv-cadbtn:hover{filter:brightness(1.2)}
.cad3d-canvas{border-radius:8px;background:#fff;cursor:grab;max-width:calc(50vw - 44px);max-height:88vh}
.cad3d-canvas:active{cursor:grabbing}
/* 🔖 Vorgemerkte Verknüpfungen (URL-Merkzettel am Produkt) */
.reln{display:flex;align-items:flex-start;gap:10px;border:1px solid var(--border);border-radius:10px;padding:8px 10px}
.reln-status{font-size:.68rem;font-weight:700;padding:2px 7px;border-radius:8px;background:var(--bg);border:1px solid var(--border);color:var(--muted)}
.reln-status.s-offen{color:#b0812c;border-color:#d9b970}
.reln-status.s-uebernommen{color:var(--accent);border-color:var(--accent)}
.reln-status.s-erledigt{color:#2e8b57;border-color:#7bbf9a}
.reln-status.s-abgelehnt{color:#c0392b;border-color:#d99}
.reln.reln-erledigt,.reln.reln-abgelehnt{opacity:.62}
/* 🔢 Markierungen auf Zeichnung/PDF (Original scheint durch, ohne Rand) — ziehbar in die Formularfelder.
   Gelb = Zahl · Blau (sehr transparent) = Textstück */
.zahl-wrap{position:relative;display:inline-block}
/* Beim Anzeige-Zoom (＋) wird das Bild GRÖSSER als das Panel → der Wrap scrollt, Chips bleiben am Inhalt */
.hz-pdf .zahl-wrap{overflow:auto;max-width:calc(50vw - 44px);max-height:calc(88vh - 96px)}
.zahl-chip{position:absolute;z-index:3;background:rgba(255,214,0,.35);border:none;border-radius:4px;
  cursor:grab;user-select:none;box-sizing:border-box}
.zahl-chip:active{cursor:grabbing}
.zahl-chip:hover{background:rgba(255,214,0,.55)}
.txt-chip{position:absolute;z-index:2;background:rgba(37,99,235,.10);border:none;border-radius:4px;
  cursor:grab;user-select:none;box-sizing:border-box}
.txt-chip:active{cursor:grabbing}
.txt-chip:hover{background:rgba(37,99,235,.28)}
.zahl-ghost{position:fixed;top:-200px;left:0;background:#ffd600;color:#111;font-weight:700;font-size:1rem;
  padding:4px 12px;border-radius:8px;box-shadow:0 3px 10px rgba(0,0,0,.3);z-index:9999;max-width:420px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zahl-ghost.blau{background:#3b82f6;color:#fff;font-weight:600;font-size:.85rem}
/* 🧺 Block-Auswahl: markierte Chips + schwebende Leiste (ziehen/kopieren/aufheben) */
.zahl-chip.sel{outline:2px solid var(--accent);background:rgba(255,214,0,.55)}
.txt-chip.sel{outline:2px solid var(--accent);background:rgba(37,99,235,.30)}
.zahl-selbar{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);z-index:7;display:flex;gap:8px;align-items:center;
  background:var(--bg);border:1px solid var(--accent);border-radius:10px;padding:4px 10px;box-shadow:0 4px 14px rgba(0,0,0,.18);font-size:.8rem;white-space:nowrap}
.selbar-drag{cursor:grab;font-weight:700;color:var(--accent)}
.selbar-drag:active{cursor:grabbing}
.selbar-btn{border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:7px;padding:2px 8px;cursor:pointer;font-size:.75rem}
.selbar-btn:hover{border-color:var(--accent);color:var(--accent)}
/* 🔀 Bilder-Galerie sortieren: Einfüge-Kante beim Ziehen */
.mv-thumb{cursor:grab}
.mv-thumb.ins-links{box-shadow:-3px 0 0 var(--accent)}
.mv-thumb.ins-rechts{box-shadow:3px 0 0 var(--accent)}
input.drop-wert{outline:2px solid var(--accent);outline-offset:1px}
.zahl-wrap img{cursor:crosshair}   /* Rechteck über eine übersehene Zahl aufziehen = gezielte Nachlese */
.zahl-rect{position:absolute;z-index:4;border:1.5px dashed var(--accent);background:rgba(37,99,235,.08);
  border-radius:3px;pointer-events:none}
/* Vorschau „Nach Schema benennen": alt → neu */
.srn-row{display:flex;gap:10px;align-items:center;padding:5px 16px;font-size:.8rem;border-bottom:1px solid var(--border)}
.srn-row.bleibt{opacity:.66}
.srn-alt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}
.srn-pfeil{flex:none;color:var(--muted)}
.srn-neu{flex:1;min-width:0;overflow-wrap:anywhere;color:var(--accent)}

/* ===== Spalten einklappen im Produkte-Formular (Fokus-Modus, z.B. Laptop) ===== */
.prod-layout.l-nocat{grid-template-columns:36px minmax(300px,1fr) minmax(360px,1.15fr)}
.prod-layout.l-noart{grid-template-columns:265px 36px minmax(360px,1.15fr)}
.prod-layout.l-nocat.l-noart{grid-template-columns:36px 36px 1fr}
.prod-colrail{height:calc(100vh - 104px);background:var(--surface);border:1px solid var(--border);border-radius:16px;display:flex;flex-direction:column;align-items:center;gap:10px;padding-top:12px;cursor:pointer;user-select:none;color:var(--muted)}
.prod-colrail:hover{background:var(--accent-soft);color:var(--accent);border-color:#d6d4fb}
.prod-colrail .rail-ic{font-weight:700;line-height:1}
.prod-colrail .rail-tx{writing-mode:vertical-rl;font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.col-hide{flex:none}

/* ===== Einklapp-Pfeil gross und fest oben in der Ecke (Wunsch Aileen 16.07.2026) ===== */
.prod-catcol,.prod-artcol{position:relative}
button.col-hide{position:absolute;top:9px;right:9px;z-index:6;width:30px;height:30px;display:flex;align-items:center;justify-content:center;font-size:1.15rem;font-weight:700;line-height:1;background:var(--surface);border:1px solid var(--border);border-radius:8px;color:var(--muted);cursor:pointer;padding:0}
button.col-hide:hover{background:var(--accent-soft);color:var(--accent);border-color:#d6d4fb}
.prod-catcol .col-head,.prod-artcol .col-head{padding-right:48px}
.prod-colrail .rail-ic{font-size:1.15rem}

/* ===== Artikel-Kopfzeile: eine Zeile, Pfad gekuerzt, nichts ueberlappt (16.07.2026) ===== */
.prod-artcol .col-head{flex-wrap:nowrap}
.art-htitle{flex:0 1 auto;min-width:36px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prod-artcol .col-head .art-missf{flex:0 1 auto;min-width:72px;max-width:180px}
.prod-artcol .col-head .art-count{white-space:nowrap}
.prod-artcol .col-head .btn{white-space:nowrap;flex:none}

/* 💬 Rückfragen-Gespräch (Prüf-Liste): Blasen + Kürzel/Foto + Antwortfeld */
.rf-chat { margin-top: 8px; display: flex; flex-direction: column; gap: 6px; max-width: 640px; }
.rf-msg { display: flex; align-items: flex-start; gap: 8px; }
.rf-msg.rf-mein { flex-direction: row-reverse; }
.rf-ava { width: 28px; height: 28px; border-radius: 50%; flex: none; object-fit: cover; border: 2px solid transparent; }
.rf-ava-txt { display: flex; align-items: center; justify-content: center; color: #fff; font-size: .72rem; font-weight: 700; letter-spacing: .02em; }
.rf-bubble { background: var(--panel2, #f1f5f9); border: 1px solid var(--line, #e2e8f0); border-radius: 12px; padding: 6px 10px; max-width: 82%; }
.rf-mein .rf-bubble { background: color-mix(in srgb, var(--acc, #2563eb) 8%, var(--panel, #fff)); }
.rf-kopf { font-size: .7rem; opacity: .65; margin-bottom: 2px; }
.rf-text { font-size: 1rem; line-height: 1.4; word-break: break-word; }
.rf-text a { text-decoration: underline; }
.rf-schreib { display: flex; gap: 6px; margin-top: 2px; }
.rf-in { flex: 1; min-width: 0; font: inherit; font-size: .95rem; line-height: 1.35; padding: 7px 10px; border: 1px solid var(--line, #cbd5e1); border-radius: 8px; background: var(--panel, #fff); color: inherit; resize: vertical; }
.rf-schreib { align-items: flex-end; }

/* Prüf-Liste kompakt: enge Zeilen, Knöpfe nah am Inhalt, Chat-Zeile oben ausgerichtet */
.rev-sec .dash-row { padding: 4px 10px; gap: 8px; }
.rev-sec .dash-row-main { flex: 1 1 auto; }   /* Knöpfe wieder exakt bündig in einer Spalte */
.rev-sec .dash-row-act { margin-left: 8px; }
.dash-row.rf-row { align-items: flex-start; }
.dash-row.rf-row .prov-tag, .dash-row.rf-row .dash-row-act { margin-top: 2px; }
.rev-fold { font-size: .72rem; opacity: .7; }
.rf-vorschau { display: flex; align-items: center; gap: 6px; margin-top: 3px; font-size: .85rem; cursor: pointer; user-select: none; min-width: 0; }
.rf-vorschau:hover { text-decoration: underline; }
.rf-vorschau .muted { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rf-pfeil { font-size: .7rem; opacity: .7; flex: none; }

/* Gruppen-Überschrift in der Provisorisch-Liste (statt gleicher Chip vor jeder Zeile) */
.prov-grp-h { display: flex; align-items: baseline; gap: 4px; font-weight: 700; font-size: .78rem; padding: 8px 10px 2px; color: var(--text); }
.prov-grp-h:first-child { padding-top: 2px; }

/* FAQ-Pfeil an Gesprächs-Zeilen (dreht sich beim Öffnen) + zweispaltige Werte-Liste */
.rf-chev { display: flex; align-items: center; flex: none; width: 18px; opacity: .65; }
.rf-chev svg { width: 16px; height: 16px; transition: transform .18s ease; }
.rf-chev.offen svg { transform: rotate(180deg); }
.dash-list.zweispaltig { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); column-gap: 26px; }
.dash-list.zweispaltig .prov-grp-h { grid-column: 1 / -1; }

/* Mehrzeilige Eingabe im Popup (Rückfragen): 4 Zeilen, angenehme Breite */
.pop-input textarea { min-width: 440px; font: inherit; font-size: .95rem; line-height: 1.35; padding: 7px 10px; border: 1px solid var(--line, #cbd5e1); border-radius: 8px; background: var(--panel, #fff); color: inherit; }

/* Prüf-Panel: jeder Abschnitt als eigene Karte — Titel gross, Gruppen klein mit Linie, Zeilen mit Luft */
.rev-grid { gap: 12px; }
.rev-grid .rev-sec { background: var(--panel2, #f6f8fb); border: 1px solid var(--border-2, #e2e8f0); border-radius: 12px; padding: 10px 14px 8px; }
.rev-grid .rev-sec-h { font-size: .98rem; padding-bottom: 8px; }
.rev-sec .dash-row { padding: 6px 10px; }
.dash-list.zweispaltig { grid-template-columns: repeat(auto-fill, minmax(430px, 1fr)); column-gap: 36px; }
.prov-grp-h { align-items: baseline; padding: 12px 10px 4px; border-bottom: 1px solid var(--border-2, #e2e8f0); margin-bottom: 2px; }
.prov-grp-t { font-size: .86rem; font-weight: 700; }
.prov-grp-ctx { font-size: .74rem; opacity: .65; margin-left: 12px; font-weight: 400; }

/* Dashboard-Module: KPI-Verlaufskurven, Top-5-Liste, Radar */
.kpi-spark { margin-top: 4px; line-height: 0; }
.low5-row { width: 100%; text-align: left; background: none; border: none; cursor: pointer; }
.low5-pct { flex: none; font-weight: 700; font-size: .78rem; padding: 3px 8px; border-radius: 999px; }
.radar-box { line-height: 0; color: var(--text, #1f2937); }

/* Verwendungs-Chip (Prüf-Liste) + Breiten-Wahl im Anpassen-Modus */
.verw-chip { flex: none; font-size: .74rem; font-weight: 700; padding: 3px 10px; border-radius: 999px; background: rgba(99, 102, 241, .1); color: #4f46e5; white-space: nowrap; }
.lay-breite { display: inline-flex; gap: 3px; margin-left: 8px; }
.lay-breite .lay-tb.lay-an { background: var(--acc, #2563eb); color: #fff; border-color: var(--acc, #2563eb); }

/* Aufgaben, Tickets & Termine */
.auf-kopf { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.auf-filter { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.auf-trenn { width: 1px; height: 20px; background: var(--border-2, #e2e8f0); margin: 0 4px; }
.auf-row { align-items: flex-start; }
.auf-prio { flex: none; width: 10px; height: 10px; border-radius: 50%; margin-top: 8px; }
.auf-status { font-size: .8rem; padding: 4px 6px; border-radius: 8px; border: 1px solid var(--border-2, #cbd5e1); background: var(--panel, #fff); color: inherit; max-width: 130px; }
.auf-beschr { font-size: .88rem; margin-top: 3px; white-space: pre-wrap; }
.auf-durch { text-decoration: line-through; opacity: .6; }
.auf-spaet { color: #dc2626; font-weight: 600; }
.auf-form .auf-feld { display: flex; flex-direction: column; gap: 3px; margin-bottom: 8px; flex: 1; }
.auf-lbl { font-size: .74rem; font-weight: 600; opacity: .7; }
.auf-form input, .auf-form select, .auf-form textarea { font: inherit; padding: 7px 10px; border: 1px solid var(--border-2, #cbd5e1); border-radius: 8px; background: var(--panel, #fff); color: inherit; }
.auf-reihe { display: flex; gap: 10px; }

/* Ticket-Themen + Anhänge */
.auf-thema { background: rgba(139, 92, 246, .12); color: #7c3aed; margin-left: 4px; }
.auf-anh { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 4px; }
.auf-anh-chip { display: inline-flex; align-items: center; gap: 4px; font-size: .78rem; padding: 3px 9px; border-radius: 999px; background: var(--panel2, #f1f5f9); border: 1px solid var(--border-2, #e2e8f0); text-decoration: none; color: inherit; }
a.auf-anh-chip:hover { text-decoration: underline; }
.auf-th-gruppe { border: 1px solid var(--border-2, #e2e8f0); border-radius: 10px; padding: 8px 10px; margin-bottom: 8px; }
.auf-th-kopf { display: flex; align-items: center; margin-bottom: 6px; }
.auf-th-chips { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.auf-thema-zeile { align-items: flex-end; gap: 6px; }

/* Web-Suche-Menü */
.ws-menue { position: fixed; z-index: 1500; width: 360px; background: var(--panel, #fff); border: 1px solid var(--border-2, #cbd5e1); border-radius: 12px; box-shadow: 0 12px 34px rgba(15, 23, 42, .18); padding: 8px; }
.ws-kopf { display: flex; align-items: center; gap: 8px; padding: 2px 4px 8px; border-bottom: 1px solid var(--border-2, #e2e8f0); margin-bottom: 6px; }
.ws-maschine { font-size: .8rem; padding: 4px 6px; border-radius: 8px; border: 1px solid var(--border-2, #cbd5e1); background: var(--panel, #fff); color: inherit; }
.ws-zeile { display: flex; align-items: baseline; gap: 8px; width: 100%; text-align: left; background: none; border: none; cursor: pointer; padding: 6px 8px; border-radius: 8px; color: inherit; }
.ws-zeile:hover { background: var(--accent-soft, #eff6ff); }
.ws-name { font-weight: 600; font-size: .84rem; flex: none; }
.ws-preview { font-size: .74rem; opacity: .6; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ws-frei-zeile { padding: 6px 4px; }
.ws-frei { width: 100%; font-size: .85rem; padding: 6px 10px; border: 1px solid var(--border-2, #cbd5e1); border-radius: 8px; background: var(--panel, #fff); color: inherit; }
.ws-ki { border-top: 1px solid var(--border-2, #e2e8f0); border-radius: 0 0 8px 8px; margin-top: 2px; }
.ws-vw-zeile { display: flex; align-items: center; gap: 8px; padding: 4px 0; }

/* Token-Editor (Korrigieren & freigeben): Chips ziehen = verschmelzen, ∦ = trennen */
.tok-zeile { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-height: 42px; padding: 8px; border: 1px dashed var(--border-2, #cbd5e1); border-radius: 10px; }
.tok-chip { display: inline-flex; align-items: center; gap: 4px; padding: 5px 10px; border-radius: 999px; background: rgba(99, 102, 241, .1); border: 1.5px solid transparent; font-size: .88rem; font-weight: 600; cursor: grab; }
.tok-chip.tok-ueber { border-color: var(--acc, #2563eb); background: rgba(37, 99, 235, .16); }
.tok-text { cursor: text; }
.tok-edit { font: inherit; font-size: .88rem; padding: 2px 6px; border: 1px solid var(--border-2, #cbd5e1); border-radius: 6px; width: 160px; }
.tok-neu { font-size: .85rem; padding: 6px 10px; border: 1px solid var(--border-2, #cbd5e1); border-radius: 8px; background: var(--panel, #fff); color: inherit; min-width: 170px; }

/* Verwendungs-Tabelle (Klick auf den Artikel-Chip) */
.verw-klick { cursor: pointer; border: none; }
.verw-klick:hover { text-decoration: underline; }
.verw-tbl { width: 100%; border-collapse: collapse; font-size: .86rem; }
.verw-tbl th { text-align: left; font-size: .72rem; text-transform: uppercase; letter-spacing: .03em; opacity: .6; padding: 4px 8px; border-bottom: 1px solid var(--border-2, #e2e8f0); }
.verw-tbl td { padding: 6px 8px; border-bottom: 1px solid var(--border-2, #eef2f7); }
.verw-zeile { cursor: pointer; }
.verw-zeile:hover { background: var(--accent-soft, #eff6ff); }

/* Trennen-Knopf im Token: deutlich abgesetzt und beschriftet */
.tok-trenn { margin-left: 10px; font-size: .72rem; font-weight: 600; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--border-2, #cbd5e1); background: var(--panel, #fff); color: inherit; cursor: pointer; opacity: .85; }
.tok-trenn:hover { border-color: var(--acc, #2563eb); color: var(--acc, #2563eb); opacity: 1; }

/* Antwort-Bausteine im Popup (Ablehnen/Rückfrage) */
.pop-bausteine { display: flex; flex-direction: column; align-items: stretch; gap: 6px; margin: 8px 0 10px; max-width: 460px; }
.pop-baustein { font-size: .9rem; line-height: 1.35; text-align: left; padding: 7px 12px; border-radius: 10px; border: 1px solid var(--border-2, #cbd5e1); background: var(--panel2, #f6f8fb); color: inherit; cursor: pointer; }
.pop-baustein:hover { border-color: var(--acc, #2563eb); color: var(--acc, #2563eb); }

/* Popup mit Bausteinen/Textfeld: breiter + grössere Titelschrift, damit alles gut lesbar ist */
.pop-input:has(textarea), .pop-input:has(.pop-bausteine) { max-width: 520px; }
.pop-input:has(textarea) .pop-input-t { font-size: .92rem; }
.pop-input textarea { min-width: 0; width: 100%; box-sizing: border-box; }

/* Produktfotos in der Artikel-Liste immer klar: eigener weisser Grund statt Verrechnung mit der Ampel-Farbe */
.art-row .prod-thumb:not(.ph) { mix-blend-mode: normal !important; background: #fff; border-radius: 6px; }

/* Planungs-Übersicht: KPI-Zeile + Spalten-Ansicht (Kanban) */
.auf-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-bottom: 12px; }
.auf-kpi { background: var(--panel, #fff); border: 1px solid var(--border-2, #e2e8f0); border-radius: 12px; padding: 10px 14px; }
.auf-kpi-zahl { font-size: 1.5rem; font-weight: 800; line-height: 1.1; }
.auf-kpi-lbl { font-size: .74rem; font-weight: 600; opacity: .65; margin-top: 2px; }
.auf-kpi-sub { font-size: .72rem; opacity: .75; margin-top: 2px; }
.kb-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; align-items: start; }
@media (max-width: 1100px) { .kb-grid { grid-template-columns: repeat(2, 1fr); } }
.kb-col { background: var(--panel2, #f6f8fb); border: 1px solid var(--border-2, #e2e8f0); border-radius: 12px; padding: 8px; min-height: 160px; }
.kb-col.kb-ueber { border-color: var(--acc, #2563eb); background: rgba(37, 99, 235, .06); }
.kb-kopf { display: flex; align-items: center; gap: 6px; padding: 2px 6px 8px; font-size: .88rem; }
.kb-anzahl { font-size: .72rem; font-weight: 700; background: var(--panel, #fff); border: 1px solid var(--border-2, #e2e8f0); border-radius: 999px; padding: 1px 8px; }
.kb-karten { display: flex; flex-direction: column; gap: 8px; min-height: 40px; }
.kb-karte { background: var(--panel, #fff); border: 1px solid var(--border-2, #e2e8f0); border-radius: 10px; padding: 8px 10px; cursor: grab; }
.kb-karte:hover { border-color: var(--acc, #2563eb); }
.kb-karte-kopf { display: flex; align-items: center; gap: 7px; }
.kb-karte-kopf .auf-prio { margin-top: 0; }
.kb-titel { flex: 1; min-width: 0; font-weight: 600; font-size: .86rem; line-height: 1.3; }
.kb-karte-kopf .rf-ava { width: 22px; height: 22px; font-size: .6rem; }
.kb-meta { display: flex; align-items: center; gap: 8px; margin-top: 5px; font-size: .74rem; flex-wrap: wrap; }

/* Kalender (Tag/Woche) */
.kal-wrap { padding: 12px 14px; }
.kal-kopf { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.kal-titel { margin-left: 8px; font-size: .95rem; }
.kal-grid { display: grid; gap: 2px; }
.kal-tag { border-radius: 8px; padding: 4px 6px; min-height: 30px; }
.kal-tag-t { font-weight: 700; font-size: .8rem; margin-bottom: 3px; }
.kal-heute { background: rgba(37, 99, 235, .07); }
.kal-std { font-size: .72rem; opacity: .55; text-align: right; padding: 4px 6px 0 0; }
.kal-zelle { border-top: 1px solid var(--border-2, #eef2f7); min-height: 34px; padding: 2px; cursor: pointer; display: flex; flex-direction: column; gap: 2px; }
.kal-zelle:hover { background: var(--accent-soft, #f0f6ff); }
.kal-termin { display: block; width: 100%; text-align: left; font-size: .76rem; line-height: 1.3; padding: 4px 8px; border-radius: 8px; border: 1px solid rgba(37, 99, 235, .35); background: rgba(37, 99, 235, .1); color: inherit; cursor: pointer; }
.kal-termin:hover { border-color: var(--acc, #2563eb); }
.kal-fertig { opacity: .55; text-decoration: line-through; }
.kal-chip { display: inline-flex; align-items: center; gap: 5px; font-size: .72rem; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--border-2, #e2e8f0); background: var(--panel, #fff); color: inherit; cursor: pointer; margin: 1px 0; max-width: 100%; overflow: hidden; }
.kal-chip .auf-prio { margin-top: 0; width: 7px; height: 7px; }
.kal-fuss { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 8px; font-size: .8rem; }

/* Monatsraster */
.kalm-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.kalm-kopf div { font-size: .74rem; font-weight: 700; opacity: .6; padding: 4px 8px; }
.kalm-zelle { min-height: 96px; border: 1px solid var(--border-2, #eef2f7); border-radius: 8px; padding: 4px 6px; cursor: pointer; display: flex; flex-direction: column; gap: 3px; margin-bottom: 2px; }
.kalm-zelle:hover { border-color: var(--acc, #2563eb); }
.kalm-fremd { opacity: .45; }
.kalm-nr { font-size: .78rem; font-weight: 700; }
.kalm-block { display: block; width: 100%; text-align: left; font-size: .7rem; line-height: 1.25; padding: 3px 7px; border-radius: 7px; border: 1px solid; color: inherit; cursor: pointer; }
.kalm-block b { display: block; font-size: .72rem; }
.kalm-legende { display: flex; gap: 14px; margin-top: 8px; font-size: .76rem; opacity: .8; }
.kalm-leg { display: inline-flex; align-items: center; gap: 5px; }
.kalm-punkt { width: 9px; height: 9px; border-radius: 3px; }

/* Projekt-Leiste + Projekt-Chip */
.prj-leiste { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; margin-bottom: 12px; }
.prj-karte { text-align: left; background: var(--panel, #fff); border: 1px solid var(--border-2, #e2e8f0); border-radius: 12px; padding: 10px 12px; cursor: pointer; color: inherit; }
.prj-karte:hover { border-color: var(--acc, #2563eb); }
.prj-kopf { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.prj-kopf b { font-size: .88rem; }
.prj-balken { height: 7px; border-radius: 999px; background: var(--panel2, #eef2f7); overflow: hidden; }
.prj-voll { height: 100%; border-radius: 999px; }
.prj-sub { display: flex; justify-content: space-between; gap: 8px; font-size: .74rem; opacity: .8; margin-top: 5px; }
.prj-chip { background: rgba(34, 197, 94, .12); color: #15803d; }

/* Timeline (Gantt) — interaktive Balken, Seitenleiste, untere Karten */
.tl-haupt { display: grid; grid-template-columns: minmax(0, 1fr) 264px; gap: 16px; align-items: start; }
@media (max-width: 1100px) { .tl-haupt { grid-template-columns: 1fr; } }
.tl-links { min-width: 0; }
.tl-achse, .tl-zeile { display: grid; grid-template-columns: 220px 1fr; align-items: center; }
.tl-achse { border-bottom: 1px solid var(--border-2, #e2e8f0); padding-bottom: 2px; margin-bottom: 2px; }
.tl-achse .tl-spur { height: 30px; border-left: none; }
.tl-tag { position: absolute; top: 0; display: flex; flex-direction: column; align-items: center; line-height: 1.15; }
.tl-tag b { font-size: .64rem; opacity: .7; }
.tl-tag i { font-style: normal; font-size: .54rem; opacity: .5; }
.tl-we b, .tl-we i { opacity: .32; }
.tl-tag-heute b, .tl-tag-heute i { opacity: 1; font-weight: 800; color: #dc2626; }
.tl-lbl { display: flex; align-items: center; gap: 7px; padding: 3px 8px 3px 2px; min-width: 0; }
.tl-lbl-t { font-size: .8rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tl-einzug { padding-left: 18px; }
.tl-spur { position: relative; height: 28px; border-left: 1px solid var(--border-2, #eef2f7); }
/* feines Raster: senkrechte Striche je Tag, waagrechte je Zeile */
.tl-zeile .tl-spur { background-image: linear-gradient(to right, var(--border-2, #eef2f7) 1px, transparent 1px); background-size: var(--tl-tagb, 3.2258%) 100%; }
.tl-zeile { border-bottom: 1px solid var(--border-2, #eef2f7); }
.tl-zeile:last-child { border-bottom: none; }
.tl-balken { position: absolute; top: 3px; height: 22px; display: flex; align-items: center; gap: 6px; border: 1.5px solid; border-radius: 7px;
  font-size: .68rem; line-height: 1; padding: 0 8px; text-align: left; overflow: hidden; white-space: nowrap; color: inherit;
  cursor: grab; user-select: none; touch-action: none; }
.tl-balken.tl-fix { cursor: pointer; }
.tl-balken.tl-zieht { cursor: grabbing; opacity: .88; box-shadow: 0 3px 10px rgba(15, 23, 42, .18); z-index: 3; }
.tl-btitel { overflow: hidden; text-overflow: ellipsis; pointer-events: none; }
.tl-datum { margin-left: auto; font-size: .6rem; opacity: .65; pointer-events: none; }
.tl-griff { position: absolute; top: 0; bottom: 0; width: 9px; cursor: ew-resize; }
.tl-griff-l { left: 0; border-radius: 7px 0 0 7px; }
.tl-griff-r { right: 0; border-radius: 0 7px 7px 0; }
.tl-balken:hover .tl-griff { background: rgba(15, 23, 42, .12); }
.tl-heute { position: absolute; top: -2px; bottom: -2px; width: 2px; background: #dc2626; opacity: .55; }
.tl-gruppe { font-size: .76rem; font-weight: 700; opacity: .8; margin: 10px 0 2px; }
/* Seitenleiste + untere Karten */
.tl-seite { display: flex; flex-direction: column; gap: 12px; }
.tl-karte { padding: 12px 14px; }
.tl-karte-kopf { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.tl-karte-kopf b { font-size: .74rem; text-transform: uppercase; letter-spacing: .05em; opacity: .7; }
.tl-eintrag { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; background: none; border: 0;
  border-bottom: 1px solid var(--border-2, #eef2f7); padding: 7px 2px; cursor: pointer; font-size: .8rem; color: inherit; border-radius: 6px; }
.tl-eintrag:hover { background: rgba(99, 102, 241, .06); }
.tl-eintrag:last-of-type { border-bottom: none; }
.tl-eintrag-t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tl-prio-chip { font-size: .64rem; font-weight: 700; border: 1px solid; border-radius: 999px; padding: 2px 8px; white-space: nowrap; background: transparent; }
.tl-wann { font-size: .72rem; white-space: nowrap; }
.tl-donut-zeile { display: flex; align-items: center; gap: 14px; margin-bottom: 6px; }
.tl-donut { width: 88px; height: 88px; flex: none; }
.tl-donut-txt { font-size: 9px; font-weight: 800; fill: currentColor; }
.tl-legs { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 0; }
.tl-leg { display: flex; align-items: center; gap: 6px; font-size: .74rem; }
.tl-leg-t { flex: 1; opacity: .72; }
.tl-kw { display: flex; justify-content: space-between; gap: 8px; font-size: .76rem; padding: 5px 0; border-top: 1px solid var(--border-2, #eef2f7); }
.tl-unten { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; margin-top: 12px; }
.tl-tab-scroll { overflow-x: auto; }
.tl-tab { width: 100%; border-collapse: collapse; font-size: .76rem; }
.tl-tab th { text-align: left; font-size: .64rem; text-transform: uppercase; letter-spacing: .04em; opacity: .55; padding: 4px 8px 4px 0; font-weight: 700; }
.tl-tab td { padding: 6px 8px 6px 0; border-top: 1px solid var(--border-2, #eef2f7); }
.tl-tab tbody tr { cursor: pointer; }
.tl-tab tbody tr:hover td { background: rgba(99, 102, 241, .05); }
.tl-prj-balken { flex: 1; min-width: 60px; }
.tl-akt { align-items: flex-start; }
.tl-akt-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.tl-akt-sub { font-size: .7rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Kalender-Drag&Drop: Ziel-Zelle leuchtet beim Darüberziehen */
.kal-drop { outline: 2px dashed #6366f1; outline-offset: -2px; background: rgba(99, 102, 241, .08) !important; }
.kal-chip[draggable="true"], .kal-termin[draggable="true"], .kalm-block[draggable="true"] { cursor: grab; }

/* Gebiete-Dialog: Auswahl links (Suche/Filter), Zugeteiltes rechts */
.geb-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 18px; align-items: start; }
@media (max-width: 760px) { .geb-grid { grid-template-columns: 1fr; } }
.geb-suche { width: 100%; font-size: .86rem; padding: 8px 12px; }
.geb-liste { max-height: 380px; overflow: auto; border: 1px solid var(--border-2, #e2e8f0); border-radius: 10px; }
.geb-zeile { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; background: none; border: 0;
  border-bottom: 1px solid var(--border-2, #eef2f7); padding: 7px 10px; cursor: pointer; font-size: .82rem; color: inherit; }
.geb-zeile:hover { background: rgba(99, 102, 241, .07); }
.geb-zeile:last-child { border-bottom: none; }
.geb-typ { flex: none; font-size: .6rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; border-radius: 5px; padding: 2px 6px; opacity: .8; }
.geb-typ-kategorie { background: rgba(34, 197, 94, .14); color: #15803d; }
.geb-typ-lieferant { background: rgba(37, 99, 235, .12); color: #1d4ed8; }
.geb-typ-marke { background: rgba(245, 158, 11, .16); color: #b45309; }
.geb-typ-thema { background: rgba(139, 92, 246, .14); color: #6d28d9; }
.geb-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.geb-bei { font-size: .68rem; flex: none; }
.geb-chips { max-height: 210px; overflow: auto; }
/* Projekt-Avatare: wer arbeitet mit — überlappende Köpfe/Kürzel */
.prj-avas { display: inline-flex; align-items: center; flex: none; }
.prj-avas .rf-ava { width: 22px; height: 22px; font-size: .58rem; margin-left: -7px; border: 2px solid var(--panel, #fff); box-sizing: content-box; }
.prj-avas .rf-ava:first-child { margin-left: 0; }
.tl-gruppe { display: flex; align-items: center; gap: 10px; }

/* Prognose-Balken (Timeline): gestrichelt = berechnete Dauer, noch ohne echtes Datum */
.tl-balken.tl-prognose { border-style: dashed; opacity: .85; }
/* Spalten-Ansicht „Nach Mitarbeiter": eine Zeile pro Person × Status-Spalten, Karten frei ziehbar */
.kbp-wrap { padding: 10px 12px; overflow-x: auto; }
.kbp-grid { display: grid; grid-template-columns: 170px repeat(4, minmax(160px, 1fr)); gap: 8px; align-items: stretch; }
.kbp-kopf { font-size: .7rem; text-transform: uppercase; letter-spacing: .04em; opacity: .6; font-weight: 700; padding: 4px 0 6px; border-bottom: 1px solid var(--border-2, #e2e8f0); margin-bottom: 4px; }
.kbp-name { display: flex; align-items: center; gap: 8px; padding: 8px 4px; min-width: 0; }
.kbp-name-t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .82rem; font-weight: 600; }
.kbp-zelle { min-height: 52px; border: 1px dashed var(--border-2, #e2e8f0); border-radius: 10px; padding: 5px; display: flex; flex-direction: column; gap: 6px; }
.kbp-zelle .kb-karte { margin: 0; }
.kbp-grid + .kbp-grid { border-top: 1px solid var(--border-2, #eef2f7); padding-top: 6px; margin-top: 6px; }
.prj-mehr { display: flex; align-items: center; justify-content: center; font-size: .8rem; opacity: .75; min-height: 60px; }

/* Timeline: Status am Balken ablesbar + Legende + Avatare + Prozent */
.tl-balken.tl-neu { background: transparent; }
.tl-balken.tl-arbeit { color: #fff; }
.tl-balken.tl-arbeit .tl-datum { opacity: .85; }
.tl-pct { font-size: .66rem; flex: none; pointer-events: none; }
.tl-ava.rf-ava { width: 16px; height: 16px; font-size: .48rem; flex: none; pointer-events: none; border-width: 1px; }
.tl-lbl .rf-ava { width: 18px; height: 18px; font-size: .5rem; flex: none; }
.tl-legende { display: flex; gap: 14px; flex-wrap: wrap; font-size: .7rem; padding: 5px 2px 7px; }
.tl-leg-e { display: inline-flex; align-items: center; gap: 5px; }
.tl-leg-m { width: 20px; height: 10px; border-radius: 4px; border: 1.5px solid #6366f1; display: inline-block; }
.tl-lm-neu { background: transparent; }
.tl-lm-arbeit { background: #6366f1; }
.tl-lm-pruef { background: rgba(99, 102, 241, .4); }
.tl-lm-fertig { background: rgba(99, 102, 241, .15); opacity: .5; }
.tl-lm-prog { background: transparent; border-style: dashed; }
.tl-gruppe-btn { background: none; border: 0; padding: 2px 0; cursor: pointer; width: 100%; text-align: left; font: inherit; font-weight: 700; font-size: .76rem; color: inherit; }
.tl-gruppe-btn:hover { opacity: 1; background: rgba(99, 102, 241, .05); border-radius: 6px; }
.tl-gruppe .rf-ava { width: 20px; height: 20px; font-size: .54rem; }
/* Checkliste im Dialog + Fortschritt auf Karten */
.cl-liste { display: flex; flex-direction: column; gap: 2px; }
.cl-punkt { display: flex; align-items: center; gap: 8px; padding: 4px 2px; border-bottom: 1px solid var(--border-2, #eef2f7); cursor: pointer; }
.cl-punkt .cl-text { flex: 1; font-size: .86rem; }
.cl-punkt.cl-ok .cl-text { text-decoration: line-through; opacity: .55; }
.cl-neu { margin-top: 6px; font-size: .84rem; padding: 6px 10px; }
.kb-cl-balken { height: 4px; margin-top: 6px; }

/* Mitarbeiter-Köpfe oben im Spalten-Brett: anklicken = filtern */
.kbf-chip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border-2, #e2e8f0); background: var(--panel, #fff);
  border-radius: 999px; padding: 4px 10px 4px 5px; cursor: pointer; font-size: .78rem; color: inherit; }
.kbf-chip:hover { border-color: var(--acc, #2563eb); }
.kbf-chip.kbf-aktiv { border-color: var(--acc, #2563eb); background: rgba(37, 99, 235, .08); font-weight: 700; }
.kbf-chip .rf-ava { width: 22px; height: 22px; font-size: .56rem; }
.kbf-name { white-space: nowrap; }
.kbp-name { align-items: flex-start; padding-top: 10px; }

/* Beobachten-Stern: dezent, gefüllt wenn aktiv */
.kb-stern { opacity: .45; }
.kb-stern:hover { opacity: 1; }
.kb-stern.beob-an { opacity: 1; }
.kb-stern.beob-an svg { fill: #f59e0b; stroke: #f59e0b; }

/* Mitarbeiter-Akkordeon im Spalten-Brett + STV-Zeichen + Timeline-Personen-Zeile */
.kbp-lane-kopf { display: flex; align-items: center; gap: 9px; width: 100%; text-align: left; background: none; border: 0;
  border-bottom: 1px solid var(--border-2, #eef2f7); padding: 9px 6px; cursor: pointer; font: inherit; color: inherit; border-radius: 8px; }
.kbp-lane-kopf:hover { background: rgba(99, 102, 241, .05); }
.kbp-lane-kopf.kbp-offen { background: rgba(37, 99, 235, .06); font-weight: 700; }
.kbp-lane-kopf .rf-ava { width: 26px; height: 26px; font-size: .6rem; }
.kbp-mini { font-size: .72rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kbp-nur-status { grid-template-columns: repeat(4, minmax(170px, 1fr)); padding: 8px 2px 12px; }
.kbp-zelle-kopf { font-size: .64rem; text-transform: uppercase; letter-spacing: .04em; opacity: .55; font-weight: 700; padding: 1px 2px 3px; }
.kbf-stv { font-size: .58rem; font-weight: 800; letter-spacing: .04em; color: #b45309; border: 1px solid #f59e0b88; border-radius: 5px; padding: 1px 4px; }
.tl-pers-zeile { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; justify-content: flex-end; margin: -2px 0 8px; }

/* Projekt-Stern oben rechts in der Karten-Ecke */
.prj-karte { position: relative; }
.prj-karte .kb-stern { position: absolute; top: 7px; right: 7px; }
.prj-kopf { padding-right: 26px; }
/* KPI-Kacheln als Knöpfe: klick = einblenden, aktiv = blau markiert */
.auf-kpi-btn { text-align: left; font: inherit; color: inherit; cursor: pointer; border: 1px solid var(--border-2, #e2e8f0); }
.auf-kpi-btn:hover { border-color: var(--acc, #2563eb); }
.auf-kpi-btn.auf-kpi-an { border-color: var(--acc, #2563eb); background: rgba(37, 99, 235, .07); box-shadow: inset 0 0 0 1px var(--acc, #2563eb); }
.kpi-hinweis { display: flex; align-items: center; gap: 10px; background: rgba(37, 99, 235, .07); border: 1px solid var(--acc, #2563eb);
  border-radius: 10px; padding: 8px 12px; margin-bottom: 10px; font-size: .84rem; }

/* Projekt-Karten: grösserer Titel, kleinerer Art-Chip, Stern frei in der Ecke, Segment-Striche im Balken */
.prj-kopf { padding-right: 32px; }
.prj-kopf b { font-size: 1.02rem; line-height: 1.25; }
.prj-karte .dash-list-ref { font-size: .62rem; padding: 2px 7px; }
.prj-balken { position: relative; display: block; }
.prj-teilstrich { position: absolute; top: 0; bottom: 0; width: 2px; background: var(--panel, #fff); }
.prj-avas-mehr { cursor: pointer; }
.prj-avas-mehr:hover { filter: brightness(1.15); }
.prj-faellig { cursor: pointer; }
.prj-oben { display: flex; margin-bottom: 5px; padding-right: 26px; }
.prj-karte .prj-kopf { padding-right: 8px; }

/* Minimierbare Bereiche (Kennzahlen, Projekte) + klebende Filterzeile beim Scrollen */
.sek-klapp { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; background: none; border: 0;
  padding: 4px 2px; margin: 2px 0; cursor: pointer; font: inherit; color: inherit; border-radius: 8px; }
.sek-klapp:hover { background: rgba(99, 102, 241, .05); }
.sek-klapp b { font-size: .74rem; text-transform: uppercase; letter-spacing: .05em; opacity: .65; }
.sek-klapp .muted { font-size: .76rem; }
.auf-filter { position: sticky; top: 0; z-index: 30; background: var(--bg, #f1f5f9); padding: 8px 0 8px; }

/* Klapp-Zeilen als erkennbare Tasten + Filterzeile deckt beim Scrollen sauber ab */
.sek-klapp { background: var(--panel, #fff); border: 1px solid var(--border-2, #e2e8f0); border-radius: 10px;
  padding: 9px 14px; margin: 6px 0; box-shadow: 0 1px 2px rgba(15, 23, 42, .05); }
.sek-klapp:hover { border-color: var(--acc, #2563eb); box-shadow: 0 2px 6px rgba(15, 23, 42, .08); }
.sek-klapp b { font-size: .8rem; opacity: .9; }
.sek-klapp .rf-chev { opacity: .85; }
.auf-filter { top: -1px; padding: 12px; margin: 0 -12px 6px; border-bottom: 1px solid var(--border-2, #e2e8f0);
  box-shadow: 0 10px 18px -14px rgba(15, 23, 42, .3); }
/* Die klebende Filterzeile beginnt ganz oben am Scroll-Rand (30px Innen-Polster überbrücken) */
.auf-filter { top: -30px; padding-top: 14px; margin-top: -8px; }

/* Jahres-Zoom der Timeline: Monatsmarken statt Tages-Raster */
.tl-monatstick { align-items: flex-start !important; border-left: 1px solid var(--border-2, #e2e8f0); padding-left: 5px; height: 100%; }
.tl-monatstick b { font-size: .66rem; }
.tl-links-jahr .tl-zeile .tl-spur { background-image: linear-gradient(to right, var(--border-2, #eef2f7) 1px, transparent 1px); background-size: 8.333% 100%; }
/* Grobe Timeline-Zooms (Quartal/Jahr): Monats-Raster statt Tages-Raster */
.tl-links-grob .tl-zeile .tl-spur { background-image: linear-gradient(to right, var(--border-2, #eef2f7) 1px, transparent 1px); background-size: var(--tl-monatb, 8.333%) 100%; }
/* Anfassbarer Datum-Strahl + Projekt-Balken ziehbar */
.tl-achse-griff { cursor: grab; touch-action: none; user-select: none; }
.tl-achse-griff:active { cursor: grabbing; }
.tl-balken.tl-fix { cursor: grab; }
/* Kalenderwochen-Nummern an der Tages-Achse (jeweils am Montag) */
.tl-tag .tl-kw { font-style: normal; font-size: .52rem; font-weight: 800; color: var(--acc, #2563eb); opacity: .85; }
.tl-achse .tl-spur { height: 38px; }

/* Dialog-Abschnitte (Trennlinien) + mehrwertiges Zuständig-Feld + Checklisten-Vorlagen */
.auf-abschnitt { display: flex; align-items: center; gap: 10px; margin: 14px 0 4px; font-size: .66rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: .07em; opacity: .55; }
.auf-abschnitt::after { content: ''; flex: 1; height: 1px; background: var(--border-2, #e2e8f0); }
.auf-form > .auf-abschnitt:first-child { margin-top: 0; }
.zst-chips { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.zst-chip { display: inline-flex; align-items: center; gap: 6px; }
.zst-chip .rf-ava { width: 20px; height: 20px; font-size: .52rem; }
.zst-chip.zst-haupt { border-color: var(--acc, #2563eb); }
.zst-add { font-size: .78rem; }
.auf-lbl { display: flex; align-items: center; gap: 8px; }
.cl-vorl { font-size: .74rem; max-width: 170px; }

/* Personen-Auswahl mit Foto (schwebendes Feld) + Projekt-Verlauf + DAM-Pfadzeile */
.pw-panel { position: fixed; z-index: 1200; width: 260px; background: var(--panel, #fff); border: 1px solid var(--border-2, #e2e8f0);
  border-radius: 12px; box-shadow: 0 12px 30px rgba(15, 23, 42, .18); padding: 8px; }
.pw-such { width: 100%; font-size: .82rem; padding: 6px 10px; margin-bottom: 6px; }
.pw-liste { max-height: 260px; overflow: auto; }
.pw-titel { font-size: .62rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; opacity: .5; padding: 5px 4px 3px; }
.pw-zeile { display: flex; align-items: center; gap: 9px; width: 100%; text-align: left; background: none; border: 0;
  padding: 6px 6px; cursor: pointer; font-size: .84rem; color: inherit; border-radius: 8px; }
.pw-zeile:hover { background: rgba(99, 102, 241, .07); }
.pw-zeile.pw-an { background: rgba(37, 99, 235, .07); }
.pw-zeile .rf-ava { width: 26px; height: 26px; font-size: .6rem; }
.pw-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pw-haken { color: var(--acc, #2563eb); font-weight: 800; }
.zst-row { padding: 3px 8px; }
.zst-row .prj-avas .rf-ava { width: 22px; height: 22px; }
.prj-verlauf { display: flex; flex-direction: column; gap: 3px; margin-bottom: 10px; }
.prj-verlauf-z { display: flex; gap: 10px; font-size: .8rem; padding: 3px 0; border-bottom: 1px solid var(--border-2, #eef2f7); }
.prj-verlauf-wann { flex: none; width: 90px; font-size: .72rem; }
.dam-pfad { display: flex; align-items: center; gap: 10px; margin-top: 8px; }
.geb-typ { flex: none; font-size: .6rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; border-radius: 5px; padding: 2px 6px; }

/* Chat-Sprechblase mit Status: gelb = wartet auf deine Antwort, grün = beantwortet */
.chat-knopf { position: relative; display: inline-flex; align-items: center; gap: 4px; }
.chat-knopf.chat-gelb { border-color: #f59e0b; background: rgba(245, 158, 11, .13); color: #b45309; }
.chat-knopf.chat-gruen { border-color: #22c55e; background: rgba(34, 197, 94, .12); color: #15803d; }
.chat-anzahl { font-size: .66rem; font-weight: 800; }

/* Team-Chat: Kanäle links, Verlauf rechts — Teams-artig, ohne Kamera/Mikrofon */
.chat-wrap { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 14px; align-items: start; }
@media (max-width: 900px) { .chat-wrap { grid-template-columns: 1fr; } }
.chat-seite { padding: 12px; position: sticky; top: 0; }
.chat-haupt { padding: 0; display: flex; flex-direction: column; min-height: 60vh; }
.chat-kopf { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--border-2, #e2e8f0); }
.chat-verlauf { flex: 1; overflow-y: auto; max-height: 58vh; padding: 12px 16px; display: flex; flex-direction: column; gap: 10px; }
.chat-tag { display: flex; justify-content: center; margin: 6px 0 2px; }
.chat-tag span { font-size: .68rem; font-weight: 700; opacity: .5; background: var(--panel2, #eef2f7); border-radius: 999px; padding: 2px 10px; }
.chat-msg { position: relative; }
.chat-msg .chat-akt { opacity: 0; display: flex; gap: 2px; align-self: flex-start; }
.chat-msg:hover .chat-akt { opacity: 1; }
.chat-bubble { max-width: 70%; }
.chat-zitat { font-size: .74rem; opacity: .7; border-left: 3px solid var(--acc, #2563eb); padding: 2px 8px; margin: 4px 0; background: rgba(37, 99, 235, .05); border-radius: 0 6px 6px 0; }
.chat-zitat-aktiv { display: flex; align-items: center; gap: 8px; margin: 0 16px; }
.chat-eingabe { border-top: 1px solid var(--border-2, #e2e8f0); padding: 10px 16px 14px; }
.chat-schreib { display: flex; gap: 8px; align-items: flex-end; }
.chat-schreib .rf-in { flex: 1; }
.chat-mention { color: var(--acc, #2563eb); font-weight: 700; }
.chat-mention-ich { background: rgba(245, 158, 11, .2); border-radius: 4px; padding: 0 3px; }
.chat-unge { font-size: .6rem; font-weight: 800; color: #fff; background: var(--acc, #2563eb); border-radius: 999px; padding: 2px 7px; }
.chat-raute { flex: none; width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; opacity: .5; }

/* Mitteilungen: Glocke unten + Eingangs-Liste */
.mitteil-item { width: 100%; margin-bottom: 6px; position: relative; }
.mit-zeile { display: flex; align-items: center; gap: 10px; padding: 8px 4px; border-bottom: 1px solid var(--border-2, #eef2f7); }
.mit-zeile.mit-neu { background: rgba(37, 99, 235, .04); }
.mit-haupt { flex: 1; min-width: 0; display: flex; align-items: center; gap: 12px; background: none; border: 0; text-align: left; cursor: pointer; font: inherit; color: inherit; padding: 2px 4px; border-radius: 8px; }
.mit-haupt:hover { background: rgba(99, 102, 241, .06); }
.mit-titel { flex: none; max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .84rem; }
.mit-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .8rem; }
.mit-wann { flex: none; font-size: .7rem; }

/* Lieferanten-Kopf: eine Zeile — Artikel-Direktsuche schmal (30%), beschriftete Lieferanten-Suche, Knöpfe */
.direkt-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.direkt-bar .direkt-term { flex: 0 1 30%; min-width: 180px; }
.direkt-lbl { flex: none; font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; opacity: .6; margin-left: 8px; }
.direkt-bar .list-search { flex: 1 1 200px; min-width: 160px; }
/* Lieferanten-Zeile: Lieferant-Suche links (20%), Artikel-Direktsuche daneben (40%) */
.direkt-bar .list-search { flex: 0 1 20%; min-width: 140px; }
.direkt-bar .direkt-term { flex: 0 1 40%; min-width: 200px; }

/* Web-Suche: Suchfeld mit Lupe zuoberst, Abschnitt „Suchoptionen", Such-Tricks, KI-Maskottchen */
.ws-frei-zeile { display: flex; gap: 6px; align-items: center; }
.ws-frei { flex: 1; }
.ws-lupe { flex: none; padding: 6px 10px; }
.ws-titel { font-size: .62rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; opacity: .5; padding: 8px 10px 3px; }
.ws-tricks-knopf { display: flex; align-items: center; gap: 6px; width: 100%; text-align: left; background: none; border: 0;
  padding: 6px 10px; cursor: pointer; font-size: .76rem; font-weight: 700; opacity: .7; color: inherit; }
.ws-tricks-knopf:hover { opacity: 1; }
.ws-tricks { padding: 2px 10px 8px; display: flex; flex-direction: column; gap: 4px; }
.ws-trick { display: flex; gap: 8px; font-size: .74rem; align-items: baseline; background: none; border: 0;
  text-align: left; width: 100%; cursor: pointer; padding: 3px 4px; border-radius: 6px; color: inherit; font-family: inherit; }
.ws-trick:hover { background: var(--panel2, #eef2f7); }
.ws-trick:hover code { background: var(--accent, #4f6ef7); color: #fff; }
.ws-trick code { flex: none; min-width: 86px; font-size: .7rem; background: var(--panel2, #eef2f7); border-radius: 5px; padding: 1px 6px; }
.ws-trick span { opacity: .75; }
.ws-ki-ico { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; flex: none; }

/* ===== „Weiterarbeiten"-Karte auf dem Dashboard (Build 633) ===== */
.dash-weiter-k{display:inline-flex;align-items:center;gap:7px;font:inherit;font-size:.8rem;font-weight:600;
  border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:999px;padding:4px 12px;cursor:pointer}
.dash-weiter-k:hover{border-color:var(--accent);color:var(--accent)}
.dash-weiter-k .btn-ico{display:inline-flex;width:15px;height:15px}
.dash-weiter-k .btn-ico svg{width:15px;height:15px}
.dash-weiter-lbl{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ===== Datei-Ablage-Flächen: Rahmen beim Drüberziehen (Build 633) ===== */
.auf-drop-an{outline:2px dashed var(--accent);outline-offset:-2px;background:var(--accent-soft) !important;border-radius:12px}

/* ===== Tastatur-Spickzettel (Taste ?) (Build 633) ===== */
.kbd-titel{font-size:.72rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin:10px 0 6px}
.kbd-titel:first-child{margin-top:0}
.kbd-zeile{display:flex;align-items:baseline;gap:10px;padding:4px 0;font-size:.84rem}
.kbd-k{flex:none;min-width:86px;text-align:center;font-family:ui-monospace,Consolas,monospace;font-size:.74rem;
  background:var(--bg);border:1px solid var(--border);border-bottom-width:2px;border-radius:6px;padding:2px 8px;color:var(--text)}

/* ===== Theme „Dunkel" — dunkler Grund, helle Schrift; Akzent bleibt Indigo (Build 633) ===== */
html[data-theme="dunkel"]{
  --accent:#818cf8; --accent-d:#9aa3ff; --accent-soft:#272c45;
  --grad:linear-gradient(135deg,#5b5fe0 0%,#7c53d6 100%);
  --grad-d:linear-gradient(135deg,#6a6ef0 0%,#8b63e6 100%);
  --bg:#12151c; --surface:#1a1e28; --border:#2c323f; --border-2:#232833;
  --text:#e6eaf2; --muted:#98a1b3; --faint:#6c7484;
  --danger:#f07178; --green:#4ccb7e; --amber:#e8b04b;
  --side:#0b0e14; --side-2:#1a2233; --side-tx:#9aa7bd; --side-lb:#5b6b86;
  --shadow:0 1px 2px rgba(0,0,0,.5),0 1px 3px rgba(0,0,0,.55);
  --shadow-lg:0 12px 34px rgba(0,0,0,.65);
}
/* Chips/Bänder mit fest kodierten Pastellfarben nachdunkeln */
html[data-theme="dunkel"] .dash-prio-chip{border-color:#3a4160}
html[data-theme="dunkel"] .dash-prio-chip.warn{background:#3a2f16;color:#e8b04b;border-color:#5c4a1e}
html[data-theme="dunkel"] .dash-prio.done{background:#15291c;border-color:#245534}
html[data-theme="dunkel"] .ws-trick code,html[data-theme="dunkel"] .chiplet,html[data-theme="dunkel"] .attr-code{background:#232833;color:var(--text)}
html[data-theme="dunkel"] .ws-trick:hover{background:#232833}
html[data-theme="dunkel"] .kbd-k{background:#232833}
html[data-theme="dunkel"] ::-webkit-scrollbar-thumb{background:#3a4150}
html[data-theme="dunkel"] ::-webkit-scrollbar-track{background:transparent}
/* Weisse Produktbilder/Logos: Multiply würde sie im Dunkeln schlucken → weisses Plättchen darunter */
html[data-theme="dunkel"] .cat-ico,html[data-theme="dunkel"] .cd-icon,
html[data-theme="dunkel"] .prod-thumb:not(.ph),html[data-theme="dunkel"] .recent-th:not(.ph){mix-blend-mode:normal;background:#fff;border-radius:6px}
/* Eingaben: dunkle Fläche statt Weiss */
html[data-theme="dunkel"] input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]),
html[data-theme="dunkel"] select,html[data-theme="dunkel"] textarea{background:#141821;border-color:var(--border);color:var(--text)}
html[data-theme="dunkel"] input::placeholder,html[data-theme="dunkel"] textarea::placeholder{color:var(--faint)}
/* Auswahl-Swatch in den Einstellungen */
.theme-sw.sw-dunkel{background:linear-gradient(135deg,#12151c 55%,#272c45);border-color:#3a4160}
/* Dunkel: nackte Buttons (Fokus-Zeilen u.a.) erben sonst Browser-Schwarz */
html[data-theme="dunkel"] button{color:inherit}
html[data-theme="dunkel"] .kpi-accent{background:linear-gradient(135deg,#242a49,#2c2544);border-color:#3a4160}
/* Dunkel: Planungs-Flächen (Kennzahlen, Projekt-Karten, Klapp-Leisten, Chips) über die --panel-Variablen */
html[data-theme="dunkel"]{--panel:#1a1e28;--panel2:#232833}
/* Dunkel: fest-weisse Dialog-/Panel-Flächen nachziehen (Bild-Unterleger bleiben bewusst weiss) */
html[data-theme="dunkel"] .imp-modal,html[data-theme="dunkel"] .map-modal,html[data-theme="dunkel"] .map2-headrow,
html[data-theme="dunkel"] .tip-item,html[data-theme="dunkel"] .graph-detail,html[data-theme="dunkel"] .pick-wrap,
html[data-theme="dunkel"] .g-pill,html[data-theme="dunkel"] .map-item,html[data-theme="dunkel"] .sb-toggle{background:var(--surface)}
/* Dunkel: Produkte-Seite — Artikel-Tönungen (Status), Ansicht-Umschalter, Zähler, Tipp-Karte */
html[data-theme="dunkel"] .view-switch{background:#232833}
html[data-theme="dunkel"] .tnode .tcount{background:#232833}
html[data-theme="dunkel"] .find-card{background:var(--accent-soft);border-color:#3a4160}
html[data-theme="dunkel"] .art-row.bp{background:rgba(250,204,21,.08);border-color:#4c4426}
html[data-theme="dunkel"] .art-row.bp.sel{background:var(--accent-soft);border-color:#3a4160}
html[data-theme="dunkel"] .art-row.variant{background:#161a22}
html[data-theme="dunkel"] .art-row.bp.st-plan:not(.sel){background:rgba(234,124,32,.12);border-color:#5a3d20}
html[data-theme="dunkel"] .art-row.bp.st-todo:not(.sel){background:rgba(250,204,21,.08);border-color:#4c4426}
html[data-theme="dunkel"] .art-row.bp.st-done:not(.sel){background:rgba(34,197,94,.10);border-color:#28452f}
/* Dunkel: Status-Chips und Abzeichen auf allen Seiten (Lieferanten, Marken, Kategorien, DAM, Attribute, Werte) */
html[data-theme="dunkel"] .tattr,html[data-theme="dunkel"] .lvlbadge,html[data-theme="dunkel"] .st-seg,
html[data-theme="dunkel"] .attr-chip.inherited,html[data-theme="dunkel"] .sc-badge.variant,html[data-theme="dunkel"] .chip-x,
html[data-theme="dunkel"] .cd-ownchip,html[data-theme="dunkel"] .vl-count,html[data-theme="dunkel"] .cat-tag,
html[data-theme="dunkel"] .cd-icon.ph{background:#232833;border-color:#2c323f;color:var(--muted)}
html[data-theme="dunkel"] .bp-badge,html[data-theme="dunkel"] .chiplet.type,html[data-theme="dunkel"] .chiplet.sub,
html[data-theme="dunkel"] .chip,html[data-theme="dunkel"] .chip.brand-chip,html[data-theme="dunkel"] .dam-bp,
html[data-theme="dunkel"] .attr-type,html[data-theme="dunkel"] .qbadge{border-color:#3a4160}
html[data-theme="dunkel"] .sup-status.s-on,html[data-theme="dunkel"] .qbadge.q-good,
html[data-theme="dunkel"] .dam-cs,html[data-theme="dunkel"] .sc-b.bp{background:rgba(34,197,94,.12);border-color:#28452f}
html[data-theme="dunkel"] .sup-status.s-off,html[data-theme="dunkel"] .qbadge.q-bad{background:rgba(239,68,68,.12);border-color:#552b2b}
html[data-theme="dunkel"] .sup-status.s-wait,html[data-theme="dunkel"] .qbadge.q-mid,
html[data-theme="dunkel"] .dam-itype.missing,html[data-theme="dunkel"] .dam-chip.warnchip{background:rgba(245,158,11,.12);border-color:#57431e}
html[data-theme="dunkel"] .btn.danger{border-color:#5a3030}
html[data-theme="dunkel"] .pring{background:conic-gradient(var(--accent) calc(var(--p,0)*1%),#2c323f 0)}

/* ===== Treffer-Fenster der Lieferanten-Suche: Lieferanten + Marken + Direkt-Links (Build 635) ===== */
.sup-treffer{position:fixed;z-index:230;min-width:340px;max-width:480px;max-height:50vh;overflow:auto;
  background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-lg);padding:6px}
.sup-treffer-t{font-size:.66rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--muted);padding:7px 10px 3px}
.sup-treffer-z{display:flex;align-items:center;gap:7px;width:100%;text-align:left;background:none;border:0;
  font:inherit;font-size:.84rem;color:var(--text);padding:6px 10px;border-radius:8px;cursor:pointer}
.sup-treffer-z:hover{background:var(--accent-soft)}
.sup-treffer-z b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:240px;flex:none}
.sup-treffer-z .muted{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.76rem}
.sup-treffer-z .ico{flex:none;width:15px;height:15px;display:inline-flex;color:var(--accent)}
.sup-treffer-z .ico svg{width:15px;height:15px}
.sup-treffer-go{margin-left:auto;flex:none;padding:2px 9px;border-radius:6px;color:var(--accent);font-weight:700}
.sup-treffer-go:hover{background:var(--accent);color:#fff}
.sup-treffer-mehr{font-size:.72rem;padding:3px 10px 6px}

/* ===== Katalog-Fenster: PDF-Seite mit gelben Leuchtstift-Markierungen (Build 636) ===== */
.kat-modal{max-width:1060px;width:96vw}
.kat-sel{max-width:340px;font-size:.8rem;padding:6px 8px;border:1px solid var(--border);border-radius:8px;background:var(--surface)}
.kat-status{font-size:.76rem;white-space:nowrap}
.kat-seiteinfo{font-size:.8rem;font-weight:600;white-space:nowrap;min-width:100px;text-align:center}
.kat-body{display:flex;gap:0;min-height:420px;max-height:calc(100vh - 210px)}
.kat-treffer{flex:0 0 190px;border-right:1px solid var(--border-2);overflow:auto;padding:6px}
.kat-treffer-t{font-size:.66rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--muted);padding:6px 8px 3px}
.kat-treffer-z{display:flex;flex-direction:column;align-items:flex-start;gap:1px;width:100%;text-align:left;background:none;border:0;
  font:inherit;font-size:.8rem;color:var(--text);padding:6px 8px;border-radius:8px;cursor:pointer}
.kat-treffer-z:hover{background:var(--accent-soft)}
.kat-treffer-z .muted{font-size:.7rem}
.kat-seite{flex:1;overflow:auto;background:var(--bg);display:flex;justify-content:center;align-items:flex-start;padding:10px}
.kat-blatt{position:relative;max-width:100%;box-shadow:var(--shadow-lg)}
.kat-blatt img{display:block;max-width:100%;height:auto}
.kat-mark{position:absolute;background:rgba(250,204,21,.42);border-radius:2px;pointer-events:auto;mix-blend-mode:multiply}
.kat-mark-nr{background:rgba(250,204,21,.62);outline:2px solid rgba(217,119,6,.85)}
.kat-fuss{font-size:.76rem;padding:7px 14px;border-top:1px solid var(--border-2)}
html[data-theme="dunkel"] .kat-blatt img{background:#fff}
html[data-theme="dunkel"] .kat-mark{mix-blend-mode:multiply}
/* Katalog-PDF-Verwaltung (Lieferant + Marke) + Medien-Wähler */
.katpdf-row select{flex:0 0 110px}
.katpdf-row .iconb{flex:none;display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.katpdf-pick{position:fixed;z-index:300;width:360px;background:var(--surface);border:1px solid var(--border);border-radius:12px;
  box-shadow:var(--shadow-lg);padding:8px}
.katpdf-pick input{width:100%}
.katpdf-pick-lst{max-height:250px;overflow:auto;margin-top:6px;display:flex;flex-direction:column;gap:2px}
.katpdf-pick-z{text-align:left;background:none;border:0;font:inherit;font-size:.8rem;color:var(--text);padding:6px 8px;border-radius:8px;cursor:pointer;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.katpdf-pick-z:hover{background:var(--accent-soft)}
/* Katalog-Zeile: Jahr-Feld schmal, Sprach-Chips kompakt (Build 638) */
.katpdf-row{flex-wrap:wrap}
.katpdf-row input:first-child{flex:1 1 180px;min-width:150px}
.katpdf-jahr{flex:0 0 70px !important;min-width:70px !important}
.katpdf-langs{display:inline-flex;gap:4px;flex:none}
.katpdf-langs .type-chip{padding:4px 9px;font-size:.72rem}

/* ===== Katalog-Zeichen in der Lieferanten-Übersicht + Auswahl-Menü (Build 639) ===== */
button.ki-ic,button.meta-link{background:none;border:0;cursor:pointer;font:inherit;padding:0;color:inherit;display:inline-flex;align-items:center;gap:5px}
.kat-menu{position:fixed;z-index:300;min-width:240px;max-width:340px;background:var(--surface);border:1px solid var(--border);
  border-radius:12px;box-shadow:var(--shadow-lg);padding:6px;display:flex;flex-direction:column;gap:2px}
.kat-menu-z{display:flex;align-items:center;gap:8px;text-align:left;background:none;border:0;font:inherit;font-size:.82rem;
  color:var(--text);padding:7px 10px;border-radius:8px;cursor:pointer}
.kat-menu-z:hover{background:var(--accent-soft)}
.kat-menu-z .ico{flex:none;width:15px;height:15px;display:inline-flex;color:var(--accent)}
.kat-menu-z .ico svg{width:15px;height:15px}
/* Such-Treffer: angesprungene Karte leuchtet kurz auf (Build 642) */
.treffer-blitz{outline:3px solid var(--accent);outline-offset:2px;border-radius:12px;transition:outline-color .3s}

/* ===== ETIM-Feld im Kategorie-Kopf (Build 654) ===== */
.cd-etim{width:150px;font-size:.72rem;padding:4px 8px;border:1px solid var(--border);border-radius:8px;background:var(--surface);text-transform:uppercase}
.cd-etim::placeholder{text-transform:none}
/* 🌐 Sprachfassungen unter den Langtext-Feldern (Build 655) */
.txt-sprachen{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:-4px 0 12px;padding:0 2px}
.txt-sprach-lbl{font-size:.74rem;flex:none}
.txt-sprach-chips{display:inline-flex;gap:5px}

/* ===== Build 657: Kurven-Zeitraum-Wähler auf dem Dashboard ===== */
.dash-zeitrow { display: flex; justify-content: flex-end; align-items: center; gap: 8px; margin: 10px 0 2px; font-size: .8rem; }
.dash-zeit-sel { width: auto; padding: 3px 8px; border-radius: 8px; border: 1px solid var(--line, #e2e8f0); background: var(--card, #fff); color: inherit; font-size: .78rem; }

/* ===== Build 658: Kurven-Punkt anklicken (Höchststand + Datum/Wert-Anzeige) ===== */
.kpi-spark { position: relative; cursor: crosshair; }
.spark-tip { display: none; position: absolute; bottom: calc(100% + 3px); background: var(--card, #fff); border: 1px solid var(--line, #e2e8f0); border-radius: 6px; padding: 2px 7px; font-size: .68rem; white-space: nowrap; box-shadow: 0 2px 8px rgba(0, 0, 0, .14); pointer-events: none; z-index: 5; color: inherit; }

/* ===== Build 660: Zahlen-Karten ordnen/ausblenden + Karte „Wer hat gearbeitet" ===== */
.cbar-row.wer-du .cbar-top span:first-child { font-weight: 700; }
.cbar-row.wer-du .cbar-fill { background: #22c55e; }
.kpi .lay-tb { flex: none; }

/* ===== Build 661: Dashboard-Reihen buendig — gleiche Hoehe je Reihe statt Treppen ===== */
.dash-flow { align-items: stretch; }

/* ===== Build 662: Strecken zurueckgenommen — kurze Karten werden nicht mehr zu leeren Riesen-Kaesten ===== */
.dash-flow { align-items: flex-start; }

/* Einfuege-Markierung rechts (Karte wird DAHINTER eingefuegt) */
.lay-over-r { box-shadow: inset -4px 0 0 var(--accent) !important; background: var(--accent-soft) !important; }

/* ===== Build 663: Dichtes Karten-Brett — kleine Karten stapeln sich untereinander, Loecher fuellen sich ===== */
.dash-flow { display: grid; grid-template-columns: repeat(6, 1fr); grid-auto-rows: 8px; grid-auto-flow: dense; gap: 0 16px; align-items: stretch; }
.dash-flow > .dash-block { margin: 0 0 16px 0; min-width: 0; }
.dash-w-full { grid-column: span 6; }
.dash-w-half { grid-column: span 3; min-width: 0; }
.dash-w-third { grid-column: span 2; min-width: 0; }
@media (max-width: 980px) { .dash-w-third { grid-column: span 3; } }
@media (max-width: 700px) { .dash-w-third, .dash-w-half { grid-column: span 6; } }

/* Mini-Plan im Layout-Modus: schwebende Karten-Liste rechts */
.dash-miniplan { position: fixed; right: 18px; top: 96px; z-index: 60; width: 250px; max-height: 72vh; overflow: auto; background: var(--card, #fff); border: 1px solid var(--line, #e2e8f0); border-radius: 12px; padding: 10px 12px; box-shadow: 0 8px 30px rgba(0, 0, 0, .18); font-size: .78rem; }
.mini-zeile { display: flex; align-items: center; gap: 6px; padding: 2px 0; }
.mini-nr { width: 20px; text-align: right; color: #94a3b8; font-variant-numeric: tabular-nums; flex: none; }
.mini-t { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.mini-t:hover { text-decoration: underline; }
.mini-aus { opacity: .45; }

/* Mini-Plan: Zeilen per Drag umsortieren */
.mini-zeile[draggable] { cursor: grab; }
.mini-zeile[draggable]:active { cursor: grabbing; }
.mini-over-o { box-shadow: inset 0 2px 0 var(--accent); }
.mini-over-u { box-shadow: inset 0 -2px 0 var(--accent); }

/* Mini-Plan: verschiebbar (Kopf ziehen) + Groesse ziehbar (Ecke unten rechts) */
.dash-miniplan { resize: both; min-width: 190px; min-height: 46px; }
.mini-kopf { display: flex; align-items: center; gap: 6px; cursor: move; user-select: none; margin-bottom: 2px; }

/* ===== Build 666: Andocken auch OBEN/UNTEN beim Karten-Ziehen (nicht nur links/rechts) ===== */
.lay-over-o { box-shadow: inset 0 4px 0 var(--accent) !important; background: var(--accent-soft) !important; }
.lay-over-u { box-shadow: inset 0 -4px 0 var(--accent) !important; background: var(--accent-soft) !important; }

/* Mini-Plan: Auge je Zeile — offen = Karte sichtbar, gedimmt = ausgeblendet */
.mini-aug.aus { opacity: .3; }

/* ===== Build 668: Schnellzugriff kompakter — Icon neben dem Text, flache Kacheln ===== */
.qa-grid { gap: 8px; }
.qa-tile { flex-direction: row; justify-content: flex-start; gap: 10px; padding: 8px 12px; }
.qa-tile .ic-box { width: 30px; height: 30px; flex: none; }
.qa-tile .ic-box svg { width: 17px; height: 17px; }

/* ===== Build 671: Karte und Mini-Plan-Zeile leuchten gemeinsam (Klick-Markierung) ===== */
.dash-flow .lay-sel { outline: 2px solid var(--accent); outline-offset: 2px; }
.mini-zeile.mini-sel { background: var(--accent-soft); border-radius: 6px; }
.mini-zeile.mini-sel .mini-t { font-weight: 700; }

/* ===== Build 672: Karten folgen STRIKT der Hand-Reihenfolge (kein automatisches Umspringen mehr) ===== */
.dash-flow { grid-auto-flow: row; }

/* ===== Build 673: Schnellzugriff noch enger — so viele Knoepfe nebeneinander wie Platz haben ===== */
.qa-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }

/* Karten-Deckel: lange Karten scrollen innen (Kopf bleibt stehen) statt alles nach unten zu schieben */
.dash-flow > .dash-block { max-height: 480px; overflow-y: auto; }
.dash-flow > .dash-block > .dash-block-h { position: sticky; top: 0; background: var(--card, #fff); z-index: 2; }

/* ===== Build 674: Klapp-Pfeil links fuer die Zahlen-Karten (statt der Alle-Knoepfe rechts) ===== */
.dash-zeitrow { justify-content: flex-start; }
.dash-zeitrow .spacer { flex: 1; }

/* ===== Build 675: grosser Klapp-Knopf fuer die Zahlen-Karten (keine Mini-Pfeile) ===== */
.dash-kpi-klapp { display: flex; align-items: center; gap: 8px; padding: 8px 16px; font-size: .9rem; font-weight: 600; color: inherit; border: 1px solid var(--line, #e2e8f0); border-radius: 10px; background: var(--card, #fff); cursor: pointer; transition: border-color .12s, background .12s; }
.dash-kpi-klapp:hover { border-color: var(--accent); background: var(--accent-soft); }
.dash-kpi-pfeil { font-size: 1.15rem; line-height: 1; }

/* ===== Build 677: Vermerk im Layout-Modus fuer Karten, die der Kompakt-Modus sonst versteckt ===== */
.dash-kompakt-hinweis { font-size: .68rem; padding: 2px 9px; border-radius: 999px; margin-left: 8px; flex: none; color: #8a6d1a; background: rgba(234, 179, 8, .16); border: 1px dashed rgba(180, 140, 20, .5); }

/* ===== Build 678: Mass-Editor fuer Zeichnungen (Zahl anklicken -> neuen Wert eintippen) ===== */
.mass-input { position: absolute; z-index: 30; padding: 4px 8px; border: 2px solid var(--accent, #4c7ed9); border-radius: 8px; font-size: .9rem; font-weight: 600; background: var(--card, #fff); color: inherit; box-shadow: 0 4px 14px rgba(0, 0, 0, .18); }
.hz-nav.hz-an { background: var(--accent, #4c7ed9); color: #fff; }
.zahl-wrap.mass-an .zahl-chip, .zahl-wrap.mass-an .txt-chip { cursor: text; outline: 1px dashed var(--accent, #4c7ed9); }

/* ===== Build 679: fester Lieferanten-Baustein in der Web-Suche + Kachel-Klick = Artikel-Suche ===== */
.ws-fix { display: inline-flex; align-items: center; gap: 5px; flex: none; padding: 5px 10px; border-radius: 8px; background: var(--accent-soft, #e6edf9); color: var(--accent, #4c7ed9); font-weight: 700; font-size: .85rem; }
.ws-fix .chip-x { cursor: pointer; opacity: .7; }
.ws-fix .chip-x:hover { opacity: 1; }
.ws-frei-zeile { display: flex; align-items: center; gap: 6px; }
.lib-card { cursor: pointer; }

/* ===== Build 681: Im-PIM-Knopf + Info-Fenster (Lieferanten- und Marken-Kacheln) ===== */
.pim-knopf { flex: none; padding: 3px 10px; font-size: .74rem; font-weight: 700; border-radius: 999px; border: 1px solid var(--accent, #4c7ed9); background: var(--accent-soft, #e6edf9); color: var(--accent, #4c7ed9); cursor: pointer; }
.pim-knopf:hover { background: var(--accent, #4c7ed9); color: #fff; }
.pim-info-modal { max-width: 620px; width: 92vw; }
.pim-info-modal .imp-body { max-height: 68vh; overflow: auto; }
.pim-info-filter { width: 100%; box-sizing: border-box; margin-bottom: 10px; padding: 8px 10px; border-radius: 8px; border: 1px solid var(--line, #cdd6e4); font-size: .9rem; }
.pim-kat { font-weight: 700; margin: 12px 0 4px; }
.pim-zeile { display: flex; gap: 10px; width: 100%; text-align: left; align-items: center; padding: 5px 8px; border: none; background: none; border-radius: 8px; cursor: pointer; font-size: .84rem; color: inherit; }
.pim-zeile:hover { background: var(--accent-soft, #e6edf9); }
.pim-variante { padding-left: 34px; opacity: .85; }
.pim-sku { flex: none; min-width: 110px; font-family: Consolas, monospace; font-size: .78rem; color: #667; }
.pim-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pim-var-n { flex: none; font-size: .72rem; color: #889; }

/* Im-PIM-Fenster: Filterzeile mit Kategorie/Produktlinie/Marke */
.pim-filter-zeile { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.pim-filter-zeile .pim-info-filter { flex: 1 1 220px; margin-bottom: 0; }
.pim-info-sel { flex: none; padding: 7px 9px; border-radius: 8px; border: 1px solid var(--line, #cdd6e4); font-size: .84rem; background: var(--card, #fff); color: inherit; max-width: 200px; }

/* ===== Build 683: Im-PIM-Fenster — groessere Schrift, BP-Zeilen gelb, URL-Sprung ===== */
.pim-zeile { font-size: .95rem; padding: 7px 10px; }
.pim-zeile:not(.pim-variante) { background: #fdf3cd; }
.pim-zeile:not(.pim-variante):hover { background: #f7e9a8; }
.pim-variante:hover { background: var(--accent-soft, #e6edf9); }
.pim-sku { font-size: .85rem; }
.pim-kat { font-size: 1rem; }
.pim-url { flex: none; display: inline-flex; align-items: center; color: var(--accent, #4c7ed9); padding: 2px 4px; border-radius: 6px; }
.pim-url:hover { background: #fff; }
.pim-url svg { width: 16px; height: 16px; }

/* ===== Build 684: Im-PIM-Fenster groesser + Nummern-Chips + Varianten-Sprung ===== */
.pim-info-modal { max-width: 980px; }
.pim-info-modal .imp-body { max-height: 78vh; }
.pim-mini { flex: none; font-size: .74rem; font-family: Consolas, monospace; color: #556; background: rgba(0, 0, 0, .06); padding: 2px 8px; border-radius: 999px; white-space: nowrap; }
.pim-variante .pim-mini { background: rgba(0, 0, 0, .045); }

/* ===== Build 685: Filter immer EINZEILIG — Fenster wird dafuer breiter, Textfeld schrumpft ===== */
.pim-info-modal { max-width: 1150px; width: 96vw; }
.pim-filter-zeile { flex-wrap: nowrap; }
.pim-filter-zeile .pim-info-filter { flex: 1 1 auto; min-width: 120px; }
.pim-info-sel { max-width: none; }

/* ===== Build 686: Chips im Im-PIM-Fenster sind klickbar (Wert in die Direktsuche) ===== */
.pim-klick { cursor: pointer; }
.pim-klick:hover { background: var(--accent, #4c7ed9); color: #fff; }

/* ===== Build 690: Vorlagen-Aufbau-Zeile — Leerschlag GELB, Handtext VIOLETT, Bausteine blau ===== */
.tpl-struktur { display: flex; flex-wrap: wrap; align-items: center; gap: 3px; margin: 4px 0 2px; }
.st-token { font-size: .72rem; padding: 2px 8px; border-radius: 999px; background: var(--accent-soft, #e6edf9); color: var(--accent, #4c7ed9); font-weight: 600; }
.st-leer { font-size: .72rem; min-width: 16px; text-align: center; padding: 2px 3px; border-radius: 5px; background: #ffe58a; border: 1px solid #e3c55a; color: #7a5c00; font-family: Consolas, monospace; }
.st-hand { font-size: .72rem; padding: 2px 8px; border-radius: 6px; background: #e9dbf7; border: 1px solid #c9aee6; color: #5f3591; font-weight: 600; }
.st-umbruch { font-size: .72rem; padding: 2px 5px; border-radius: 5px; background: #eceef2; color: #778; font-family: Consolas, monospace; }

/* ===== Build 691: Leerschlag-Kaestchen LEER (kein Zeichen) + Klick loescht den Leerschlag ===== */
.st-leer { display: inline-block; width: 14px; height: 15px; padding: 0; cursor: pointer; vertical-align: middle; }
.st-leer:hover { background: #f0c94f; border-color: #c9a53a; }

/* ===== Build 694: Schreibweisen-Befehle (AA/aa/Aa), Symbol-Raster, Im-PIM Besucht-Markierung ===== */
/* Befehls-Chip im Vorlagen-Editor: wirkt auf den naechsten Baustein (GRUEN, klar anders als Bausteine/Handtext) */
.tpl-cmd { display: inline-flex; align-items: center; gap: 2px; background: #e6f4ea; border: 1px solid #9ccfab; color: #1d7a3f; border-radius: 6px; padding: 0 5px; margin: 0 1px; font-size: .72rem; font-weight: 700; font-family: Consolas, monospace; cursor: pointer; user-select: none; vertical-align: baseline; line-height: 1.5; }
.tpl-cmd:hover { background: #d6ecdd; }
.tpl-cmd .tpl-ph-x { color: #1d7a3f; }
.st-cmd { font-size: .68rem; padding: 2px 6px; border-radius: 5px; background: #e6f4ea; border: 1px solid #9ccfab; color: #1d7a3f; font-weight: 700; font-family: Consolas, monospace; }
/* Symbol-Palette: Raster mit 10 Spalten + Fusszeile zum Hinzufuegen/Loeschen */
.rte-symmenu { max-width: none; display: block; padding: 8px; }
.rte-symgrid { display: grid; grid-template-columns: repeat(10, 32px); gap: 4px; }
.rte-symbtn { width: 32px; height: 30px; border: 1px solid var(--border, #d6dbe6); background: var(--surface, #fff); border-radius: 6px; cursor: pointer; font-size: .9rem; display: flex; align-items: center; justify-content: center; padding: 0; color: inherit; }
.rte-symbtn:hover { background: var(--accent-soft, #e6edf9); }
.rte-symbtn.del { border-color: #dd8a8a; color: #b33333; }
.rte-symbtn.del:hover { background: #fbe9e9; }
.rte-symfoot { display: flex; gap: 6px; margin-top: 8px; align-items: center; }
.rte-symin { flex: 1; min-width: 90px; border: 1px solid var(--border, #d6dbe6); border-radius: 6px; padding: 4px 8px; font-size: .8rem; background: var(--surface, #fff); color: inherit; }
.rte-symfoot .btn.on { background: #b33333; border-color: #b33333; color: #fff; }
/* Im-PIM-Fenster: schon angeklickte Chips/URL-Globen + deren Zeilen (solange das Fenster offen ist) */
.pim-klick.pim-besucht { background: #2f3a52; color: #fff; }
.pim-klick.pim-besucht::before { content: '\2713 '; font-weight: 700; }
.pim-url.pim-besucht { color: #1d7a3f; }
.pim-url.pim-besucht::after { content: '\2713'; font-size: .62rem; font-weight: 700; margin-left: 1px; vertical-align: super; }
.pim-zeile.pim-war-da { box-shadow: inset 3px 0 0 #1d7a3f; }

/* ===== Build 697: Sprache als Mehrfach-Chips in der Lieferanten-Tabelle ===== */
.excel-table .type-chip { font-size: .68rem; padding: 1px 7px; }
.excel-table td .cell-flex { align-items: center; }

/* ===== Build 700: Web-Suche - fester Baustein per Klick aus-/einschaltbar ===== */
.ws-fix { cursor: pointer; }
.ws-fix.aus { opacity: .45; text-decoration: line-through; }

/* ===== Build 701: Lieferantkatalog auf der Marken-Kachel (gelbe Chips, aufklappbar) ===== */
.kat-chip { background: #fdf3cd; border-color: #e7d290; }
.kat-chip.kat-link { cursor: pointer; }
.kat-chip.kat-link:hover { background: #f7e9a8; }

/* ===== Build 703: Sprache-Zelle kompakt (Klick-Menue) - Tabelle wieder schmal, kein Gedraenge ===== */
.cell-lang { width: 100%; border: 1px solid transparent; background: none; text-align: left; padding: 4px 6px; border-radius: 6px; cursor: pointer; font-size: .8rem; color: inherit; }
.cell-lang:hover { border-color: var(--border, #d6dbe6); background: var(--surface, #fff); }
.lang-pop { position: fixed; z-index: 500; display: flex; flex-wrap: wrap; gap: 4px; align-items: center; max-width: 250px; padding: 8px; background: var(--surface, #fff); border: 1px solid var(--border, #d6dbe6); border-radius: 10px; box-shadow: 0 8px 24px rgba(0, 0, 0, .16); }

/* ===== Build 708: Suchfeld in grossen Chip-Bloecken (Katalog/Produktlinien) ===== */
.chipfilter { flex: 1 0 100%; max-width: 260px; border: 1px solid var(--border, #d6dbe6); border-radius: 8px; padding: 4px 10px; font-size: .8rem; background: var(--surface, #fff); color: inherit; }

/* ===== Build 709: Direktsuche-Vorschlaege - eigene Eingabe zuoberst gespiegelt ===== */
.sup-treffer-frei { background: var(--accent-soft, #e6edf9); border-radius: 8px; }
.sup-treffer-frei b { color: var(--accent, #4c7ed9); }

/* ===== Build 710: inaktive in Vorschlaegen zuunterst/ausgegraut + Onboarding-Chip klar ===== */
.sup-treffer-z.z-inaktiv { opacity: .55; }
.chiplet.onb-da { background: #e6f4ea; border-color: #9ccfab; color: #1d7a3f; }
.chiplet.onb-fehlt { opacity: .55; border-style: dashed; }

/* ===== Build 720: Dubletten-Hinweis auf der Lieferanten-Karte ===== */
.chiplet.dub-chip { background: #fdeaea; border-color: #e5a1a1; color: #b33333; font-weight: 600; }

/* ===== Build 722: Sprach-Waehler pro Direkt-Link ===== */
.link-lang { flex: none; width: 62px; font-size: .78rem; padding: 4px 4px; }

/* ===== Build 724: rote Lupe - Such-Link vorhanden, aber als unbrauchbar blockiert ===== */
.iconb.lupe-rot { color: #b33333; }
.iconb.lupe-rot:hover { background: #fbe9e9; }

/* ===== Build 726: Verlauf & Notizen am Lieferanten + Wort-Vorschlaege in der Direktsuche ===== */
.sup-log-liste { max-height: 240px; overflow: auto; border: 1px solid var(--border, #d6dbe6); border-radius: 8px; padding: 4px 6px; background: var(--surface, #fff); }
.sup-log-z { display: flex; gap: 8px; align-items: baseline; padding: 3px 4px; font-size: .78rem; border-bottom: 1px dashed #eef0f4; }
.sup-log-z:last-child { border-bottom: none; }
.sup-log-wann { flex: none; color: #778; font-family: Consolas, monospace; font-size: .72rem; }
.sup-log-art { flex: none; font-size: .68rem; padding: 1px 7px; border-radius: 999px; background: #eef2fb; color: #38508a; border: 1px solid #d3ddf3; }
.sup-log-art.ist-notiz { background: #fdf3cd; border-color: #e7d290; color: #7a6215; }
.sup-log-txt { flex: 1; color: #333; }
.sup-wort b { font-weight: 600; }

/* ===== Build 728: Sprach-Glossar - Werkzeuge + Spaltenkoepfe sticky, Raender symmetrisch, KI-Maskottchen ===== */
.lgx-tools { position: sticky; top: 0; z-index: 21; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; background: var(--surface, #fff); padding: 8px 0; margin: 0 0 4px; }
/* Deck-Balken: schliesst den Spalt ueber der klebenden Leiste (nur nach oben, nicht seitlich raus) */
.lgx-tools::before { content: ''; position: absolute; left: 0; right: 0; top: -44px; bottom: -2px; background: var(--surface, #fff); z-index: -1; }
.lgx-tools { border-bottom: 2px solid var(--border, #d6dbe6); box-shadow: 0 6px 10px -6px rgba(0, 0, 0, .22); }
/* Sprach-Koepfe kleben oben IM Kasten (sauber, weil der Kasten selbst scrollt) */
.lgx-grid .lgx-head { position: sticky; top: 0; z-index: 6; background: var(--surface, #fff); padding: 8px 0 6px; border-bottom: 2px solid var(--border, #d6dbe6); }
.lgx-grid { padding-right: 26px; }   /* Loesch-x mit deutlichem Abstand vom Kartenrand (ihr roter Strich) */
.lgx-grid .iconb { justify-self: center; }

/* ===== Build 730/731: Sprach-Glossar - horizontal scrollbar; x + KI kleben IMMER sichtbar rechts ===== */
/* Excel-Kasten: eigene Hoehe -> horizontaler Balken IMMER sichtbar, Sprach-Koepfe kleben oben im Kasten */
.lgx-scroll { overflow: auto; max-height: calc(100vh - 330px); min-height: 320px; padding-bottom: 4px; border: 1px solid var(--border, #d6dbe6); border-radius: 10px; padding: 0 10px; }
.lgx-scroll .lgx-grid { padding-right: 4px; }
.lgx-grid input.lang-label { min-width: 0; width: 100%; }
.lgx-grid .iconb { position: sticky; z-index: 5; background: var(--surface, #fff); }
.lgx-grid .iconb:not(.del) { right: 46px; box-shadow: -8px 0 10px -8px rgba(0, 0, 0, .3); }
.lgx-grid .iconb.del { right: 2px; }
/* EIN durchgehender Deck-Block hinter KI + x (inkl. Spalt) - kein durchscheinender Text mehr */
.lgx-grid .iconb:not(.del)::before { content: ''; position: absolute; top: -4px; bottom: -4px; left: -6px; right: -52px; background: var(--surface, #fff); z-index: -1; }
/* Speichern-Zeile rechtsbuendig (ihr Pfeil) */
.lang-foot { width: 100%; justify-content: flex-end; }

/* ===== Build 734: Glossar-Werkzeugzeile - kleine Schrift im Filter, volle Breite genutzt ===== */
.lgx-tools select { font-size: .8rem; padding: 5px 8px; border: 1px solid var(--border, #d6dbe6); border-radius: 8px; background: var(--surface, #fff); color: inherit; }

/* ===== Build 735: Vorschlags-Fenster zweispaltig + Verlaufsspalte rechts ===== */
.sup-treffer.sup-treffer-breit { display: flex; gap: 12px; max-width: 1150px; }
/* Eintraege bleiben IN ihrer Spalte: schrumpfen + Punkte statt in die Nachbarspalte laufen */
.st-haupt .sup-treffer-z { min-width: 0; overflow: hidden; }
.st-haupt .sup-treffer-z b { flex: 0 1 auto; }
.st-haupt .sup-treffer-z .muted { flex: 0 1 auto; }
.st-haupt { flex: 1; min-width: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; align-content: start; }
.st-haupt .sup-treffer-t, .st-haupt .sup-treffer-frei, .st-haupt .sup-treffer-mehr { grid-column: 1 / -1; }
.st-verlauf { flex: none; width: 230px; border-left: 1px solid var(--border, #d6dbe6); padding-left: 10px; }

/* ===== Build 736: Logos in den Direktsuche-Vorschlaegen + im Verlauf ===== */
.sup-treffer-z .st-logo { flex: none; width: 28px; height: 28px; object-fit: contain; border-radius: 4px; }

/* ===== Build 737: Sprach-Kuerzel bei Direkt-Links klein (DE frass die ganze Zeile) ===== */
.link-row select.link-lang { flex: 0 0 64px; width: 64px; min-width: 0; padding: 4px 4px; font-size: .78rem; }

/* ===== Build 740: Sucher - Gruppen-Titel doppelt so gross (besser erkennbar) ===== */
.sup-treffer .sup-treffer-t { font-size: 1.05rem; font-weight: 800; letter-spacing: .4px; color: var(--ink, #1e2430); padding: 10px 10px 4px; }

/* ===== Build 745: Verlaufs-Spalte darf scrollen, wenn alle Stichwoerter gezeigt werden ===== */
.sup-treffer .st-verlauf { overflow-y: auto; max-height: min(60vh, 520px); }

/* ===== Build 749: Verlaufszeile - Lieferant mit Logo rechtsbuendig als eigene Spalte ===== */
.st-verlauf .sup-treffer-z { display: flex; align-items: center; gap: 6px; width: 100%; }
.st-verlauf .st-vlief { margin-left: auto; display: flex; align-items: center; gap: 6px; min-width: 0; flex: 0 1 auto; }
.st-verlauf .st-vlief .st-logo { width: 22px; height: 22px; }
.st-verlauf .st-vlief:hover .muted { text-decoration: underline; }

/* Build 749b: In der Verlaufszeile schrumpft die MITTE (Variante), nie der Lieferant rechts */
.st-verlauf .sup-treffer-z b,
.st-verlauf .sup-treffer-z > .muted { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.st-verlauf .st-vlief { flex: 0 0 auto; }
.st-verlauf .st-vlief .muted { overflow: visible; white-space: nowrap; }

/* ===== Build 750: Drei Verlaufs-Spalten im Artikel-Sucher ===== */
.sup-treffer .st-verlauf.st-sp { width: 215px; flex: 0 0 auto; }

/* ===== Build 751: Verlauf pflegen - Pin/Entfernen-Knoepfe + Favoriten-Stern ===== */
.st-verlauf .st-akt { flex: 0 0 auto; width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; border-radius: 6px; color: var(--muted); cursor: pointer; }
.st-verlauf .st-akt:hover { background: rgba(0,0,0,.07); color: var(--ink, #1e2430); }
.st-verlauf .st-akt.an { color: #b45309; }
.st-verlauf .st-akt .ico, .st-verlauf .st-akt svg { width: 15px; height: 15px; display: block; }
.st-verlauf .ico.st-fav { color: #b45309; flex: 0 0 auto; }
.st-verlauf .ico.st-fav svg { width: 14px; height: 14px; display: block; }

/* ===== Build 752: Sterne einfarbig + rechts sauber untereinander, Pin-aktiv ohne Farbe ===== */
.st-verlauf .ico.st-fav { color: var(--muted); }
.st-verlauf .st-fav-platz { flex: 0 0 auto; width: 14px; }
.st-verlauf .st-akt.an { color: var(--ink, #1e2430); background: rgba(0,0,0,.08); }

/* Build 753: Lupe in den Zeilen braucht Platz - Verlaufs-Spalten etwas breiter */
.sup-treffer .st-verlauf.st-sp { width: 245px; }

/* ===== Build 754: Sucher-Fenster hebt sich ab + Haupt-Gruppen kuerzen nicht mehr extrem ===== */
.st-dim { position: fixed; left: 0; right: 0; bottom: 0; top: 0; background: rgba(15, 23, 42, .22); backdrop-filter: blur(2.5px); z-index: 229; }
.sup-treffer.sup-treffer-breit { max-width: min(96vw, 1680px); box-shadow: 0 18px 50px rgba(15, 23, 42, .28); }
/* Zweispaltig nur, wenn wirklich Platz ist - sonst EINE volle Spalte statt extrem gekuerzter Eintraege */
.st-haupt { grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); }
/* abc/123-Umschalter an der Verlaufszeile */
.st-verlauf .st-akt.st-abc { width: auto; padding: 0 6px; font-size: .6rem; font-weight: 800; letter-spacing: .5px; }

/* ===== Build 755: Sucher-Icons - EINE Farbe (grau) und feste Spalten, exakt untereinander ===== */
/* Abstandhalter wirkt jetzt auch in den Verlaufszeilen - Icons ruecken geschlossen nach rechts */
.st-verlauf .sup-treffer-z .spacer { flex: 1 1 auto; min-width: 6px; }
/* Feste Slot-Breiten: Stern 18px, Knoepfe 24px, abc/123 30px - dadurch stehen alle buendig untereinander */
.st-verlauf .st-akt, .st-verlauf .sup-treffer-go { flex: 0 0 24px; width: 24px; height: 24px; padding: 0; margin-left: 0; display: inline-flex; align-items: center; justify-content: center; }
.st-verlauf .st-akt.st-abc { flex: 0 0 30px; width: 30px; }
.st-verlauf .ico.st-fav, .st-verlauf .st-fav-platz { flex: 0 0 18px; width: 18px; display: inline-flex; justify-content: center; }
/* EINE Farbe fuer alle Aktions-Icons im ganzen Sucher-Fenster (nur die Warn-Lupe bleibt rot) */
.sup-treffer .sup-treffer-go, .sup-treffer .st-akt { color: var(--muted); font-weight: 600; }
.sup-treffer .sup-treffer-go:hover, .sup-treffer .st-akt:hover { color: var(--ink, #1e2430); background: rgba(0,0,0,.07); }
.sup-treffer .sup-treffer-go.lupe-rot, .sup-treffer .st-akt.lupe-rot { color: #dc2626; }

/* ===== Build 757: Grosses Loesch-x in beiden Suchfeldern, immer sichtbar ===== */
.direkt-bar .feld-wrap { position: relative; display: flex; min-width: 0; }
.direkt-bar .feld-wrap.fw-lief { flex: 0 1 20%; min-width: 140px; }
.direkt-bar .feld-wrap.fw-art { flex: 0 1 40%; min-width: 200px; }
.direkt-bar .feld-wrap > input { flex: 1; width: 100%; min-width: 0; padding-right: 38px; }
.direkt-bar .feld-wrap .feld-x { position: absolute; right: 5px; top: 50%; transform: translateY(-50%);
  width: 28px; height: 28px; border: none; background: transparent; color: var(--muted);
  font-size: 1.02rem; font-weight: 700; cursor: pointer; border-radius: 7px;
  display: flex; align-items: center; justify-content: center; }
.direkt-bar .feld-wrap .feld-x:hover { background: rgba(0,0,0,.08); color: var(--ink, #1e2430); }
/* das kleine Browser-eigene Such-x abschalten - wir haben jetzt das grosse */
.direkt-bar .feld-wrap input[type=search]::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }

/* ===== Build 759: Suchmappen - Ordner-Panel rechts + Ordner-Auswahl-Menue ===== */
.mappen-panel { position: fixed; top: 74px; right: 16px; width: 400px; max-height: calc(100vh - 100px);
  overflow: auto; z-index: 240; display: flex; flex-direction: column; gap: 8px; padding: 12px;
  box-shadow: 0 18px 50px rgba(15, 23, 42, .3); }
.mappen-kopf { display: flex; align-items: center; gap: 8px; padding: 0 2px 4px; }
.mappen-liste { display: flex; flex-direction: column; gap: 8px; }
.mappe { border: 1px solid var(--border); border-radius: 10px; padding: 6px 8px; background: var(--surface); }
.mappe-kopf { display: flex; align-items: center; gap: 7px; min-width: 0; }
.mappe-kopf b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.mappe-eintrag { display: flex; align-items: center; gap: 6px; padding: 3px 0 3px 4px; min-width: 0; }
.mappe-eintrag b { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .82rem; }
.mappe-eintrag input[type=text] { flex: 1; min-width: 60px; font-size: .76rem; padding: 4px 7px; border: 1px solid var(--border); border-radius: 7px; }
.mappe-eintrag .b-erledigt, b.b-erledigt { text-decoration: line-through; color: var(--muted); }
.mappen-pop { position: fixed; z-index: 245; width: 280px; padding: 6px; display: flex; flex-direction: column; gap: 2px;
  box-shadow: 0 12px 36px rgba(15, 23, 42, .3); }
.mappen-pop .sup-treffer-z { display: flex; align-items: center; gap: 7px; }

/* ===== Build 760: Ordner-Spalte ganz rechts im Sucher + Drag-and-Drop ===== */
.sup-treffer .st-verlauf.st-ordner { width: 200px; }
.st-ordner .ordner-ziel { border: 1px dashed transparent; border-radius: 8px; }
.st-ordner .ordner-ziel.drop-da { background: rgba(37, 99, 235, .1); border-color: var(--accent); }
.st-verlauf .sup-treffer-z[draggable=true] { cursor: grab; }

/* ===== Build 761: Flaeche nutzen - Spalten breit genug, Namen nicht mehr kuerzen ===== */
.sup-treffer .st-verlauf.st-breit { width: 430px; }
.sup-treffer .st-verlauf.st-sp.sp-a { width: 290px; }
.sup-treffer .st-verlauf.st-sp.sp-b { width: 310px; }
.sup-treffer .st-verlauf.st-sp.sp-c { width: 310px; }
.sup-treffer .st-verlauf.st-ordner { width: 230px; }

/* Build 762: Auch in den HAUPT-Gruppen (Lieferanten/Marken/Katalog) stehen die Icons
   in festen Spalten am rechten Rand - exakt untereinander, egal wie lang der Name ist */
.st-haupt .sup-treffer-z { display: flex; align-items: center; gap: 6px; width: 100%; }
.st-haupt .sup-treffer-z .sup-treffer-go { flex: 0 0 26px; width: 26px; height: 24px; padding: 0; margin-left: 0;
  display: inline-flex; align-items: center; justify-content: center; }
.st-haupt .sup-treffer-z .sup-treffer-go:first-of-type { margin-left: auto; }

/* Build 762b: Das ERSTE Aktions-Icon jeder Haupt-Zeile traegt .go-erst und zieht den Block nach rechts */
.st-haupt .sup-treffer-z .sup-treffer-go { margin-left: 0; }
.st-haupt .sup-treffer-z .go-erst { margin-left: auto; }

/* ===== Build 763: Suchmappen-Panel im App-Stil - Karten mit Luft, Flaechen-Icons, Zaehler-Chips ===== */
.mappen-panel { width: 460px; padding: 14px; gap: 10px; border-radius: 16px; }
.mappen-kopf { padding: 0 2px 6px; border-bottom: 1px solid var(--border); }
.mappen-titel b { font-size: 1.02rem; }
.mappen-unter { font-size: .72rem; }
.mappe-ico { flex: 0 0 34px; width: 34px; height: 34px; border-radius: 10px; background: rgba(0, 0, 0, .05);
  display: inline-flex; align-items: center; justify-content: center; color: var(--muted); }
.mappe-ico svg { width: 17px; height: 17px; }
.mappe-ico.gross { flex-basis: 40px; width: 40px; height: 40px; }
.mappe-ico.gross svg { width: 20px; height: 20px; }
.mappe { padding: 10px 12px; border-radius: 12px; transition: box-shadow .12s; }
.mappe:hover { box-shadow: 0 4px 14px rgba(15, 23, 42, .08); }
.mappe-kopf { gap: 9px; }
.mappe-kopf b { font-size: .92rem; }
.mappe-pf { flex: 0 0 22px; width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; border-radius: 6px; }
.mappe-pf:hover { background: rgba(0, 0, 0, .06); }
.chiplet.mappe-zahl { flex: 0 0 auto; }
.mappe-eintrag { padding: 6px 0 6px 30px; border-top: 1px solid var(--border); margin-top: 4px; }
.mappe-eintrag:first-of-type { border-top: none; }
.mappe-eintrag input[type=checkbox] { width: 16px; height: 16px; accent-color: var(--muted); }
.mappe-eintrag b { font-size: .84rem; }

/* ===== Build 765: Ordner-Inhalt direkt in der Sucher-Spalte + Panel mit Dim und x oben rechts ===== */
.sup-treffer .st-verlauf.st-ordner { width: 280px; }
.st-ordner .ordner-eintrag { display: flex; align-items: center; gap: 6px; padding: 3px 4px 3px 28px; min-width: 0; }
.st-ordner .ordner-eintrag b { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: .8rem; cursor: pointer; }
.st-ordner .ordner-eintrag.erl b { text-decoration: line-through; color: var(--muted); }
.st-ordner .ordner-eintrag input[type=checkbox] { width: 14px; height: 14px; flex: 0 0 auto; accent-color: var(--muted); }
.st-ordner .ordner-ziel > .muted:first-child { flex: 0 0 14px; }
.mappen-dim { position: fixed; inset: 0; background: rgba(15, 23, 42, .35); backdrop-filter: blur(3px); z-index: 239; }
.mappen-x { width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; }
.mappen-x svg { width: 17px; height: 17px; }

/* ===== Build 766: Ordner-Spalte - grosser Pfeil, Farb-Punkte, Aktions-Icons in festen Spalten ===== */
.st-ordner .op-pfeil { font-size: .95rem; font-weight: 700; }
.st-ordner .mappe-farb { display: inline-flex; flex: 0 0 18px; align-items: center; }
.st-ordner .mappe-farb svg { width: 16px; height: 16px; }
.farb-punkt { width: 14px; height: 14px; border-radius: 50%; border: 1.5px solid var(--border); display: inline-block; background: transparent; }
.farb-punkt.gross { width: 24px; height: 24px; cursor: pointer; border: 1.5px solid rgba(0, 0, 0, .18); }
.farb-reihe { display: flex; gap: 9px; padding: 8px 10px; flex-wrap: wrap; }
.st-ordner .ordner-notiz { flex: 1; min-width: 0; font-size: .76rem; padding: 4px 7px; border: 1px solid var(--border); border-radius: 7px; }
.sup-treffer .st-verlauf.st-ordner { width: 300px; }

/* ===== Build 767: Ordner ganz einfaerben, freier Farbwaehler, GROSSE Pfeile ===== */
.st-ordner .op-pfeil { font-size: 1.2rem; font-weight: 700; flex: 0 0 28px; width: 28px; height: 28px; }
.st-ordner .ordner-ziel { border-left: 4px solid transparent; }
.farb-frei-zeile { display: flex; align-items: center; gap: 10px; padding: 4px 10px 8px; }
.farb-frei { width: 46px; height: 32px; border: 1px solid var(--border); border-radius: 8px; padding: 2px; cursor: pointer; background: var(--surface); }

/* Build 767b: Pfeile nochmals groesser und dunkler */
.st-ordner .op-pfeil { font-size: 1.35rem; color: var(--ink, #1e2430); }

/* ===== Build 768: Sammel-Suche - Haekchen je Lieferant + Knopf "Bei allen gleichzeitig suchen" ===== */
.st-haupt .alle-suchen { display: flex; align-items: center; gap: 7px; margin: 2px 0 6px; width: fit-content; }
.st-haupt .sup-treffer-z input[type=checkbox] { width: 15px; height: 15px; flex: 0 0 auto; accent-color: var(--muted); }

/* Build 770: Master-Haekchen fuer die Sammel-Suche */
.st-haupt .sammel-zeile { display: flex; align-items: center; gap: 9px; margin: 2px 0 6px; }
.st-haupt .sammel-zeile input[type=checkbox] { width: 16px; height: 16px; accent-color: var(--muted); }
.mappen-pop a.sup-treffer-z { text-decoration: none; color: inherit; }

/* ===== Build 774: Lupen sind echte Links (Strg+Klick = nativer Hintergrund-Tab) ===== */
.sup-treffer .sup-treffer-z { cursor: pointer; }
.sup-treffer a.sup-treffer-go, .sup-treffer a.st-akt { text-decoration: none; color: var(--muted); }
.sup-treffer a.sup-treffer-go.lupe-rot, .sup-treffer a.st-akt.lupe-rot { color: #dc2626; }

/* ===== Build 776: Meistgesucht-Karte (Dashboard, nur Power-User) ===== */
.suchstat-liste { display: flex; flex-direction: column; gap: 2px; padding: 4px 2px; }
.suchstat-z { display: flex; align-items: center; gap: 8px; padding: 3px 4px; font-size: .84rem; min-width: 0; }
.suchstat-z b { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Build 777: Meistgesucht-Zeilen sind Links */
a.suchstat-z { text-decoration: none; color: inherit; border-radius: 7px; }
a.suchstat-z:hover { background: rgba(0, 0, 0, .05); }

/* ===== Build 779: Katalog-Heft-Ansicht (zwei Seiten nebeneinander) ===== */
.kat-heft { display: flex; gap: 8px; justify-content: center; align-items: flex-start; }
.kat-heft.doppel .kat-blatt { width: calc(50% - 4px); }
.kat-heft.doppel .kat-blatt img { width: 100%; height: auto; }

/* ===== Build 780: Katalog-Fenster gross, Zoom, Suchfeld links ===== */
.kat-modal { width: 96vw !important; max-width: 1900px !important; height: 94vh; display: flex; flex-direction: column; }
.kat-body { flex: 1; min-height: 0; display: flex; }
.kat-seite { overflow: auto; flex: 1; min-width: 0; }
.kat-heft { margin: 0 auto; min-width: 260px; }
.kat-links { display: flex; flex-direction: column; min-height: 0; flex: 0 0 auto; }
.kat-links .kat-treffer { flex: 1; overflow: auto; }
.kat-suchzeile { display: flex; gap: 6px; padding: 8px 8px 4px; align-items: center; }
.kat-suchzeile .kat-suchin { flex: 1; min-width: 0; padding: 7px 10px; border: 1px solid var(--border); border-radius: 8px; font: inherit; }
.kat-zoominfo { min-width: 42px; text-align: center; }

/* ===== Build 781: Sortiments-Vormerkung - Drop auf Kachel, Dialog, Vormerk-Block ===== */
.lib-card.drop-da { outline: 2px dashed var(--accent); outline-offset: -2px; background: rgba(37, 99, 235, .05); }
.sortvm .sortvm-zeile { display: flex; gap: 10px; align-items: flex-start; margin-top: 10px; }
.sortvm .sortvm-lbl { flex: 0 0 110px; font-size: .8rem; color: var(--muted); padding-top: 8px; }
.sortvm input[type=text], .sortvm select, .sortvm textarea, .sortvm input[type=date] {
  flex: 1; min-width: 0; padding: 8px 10px; border: 1px solid var(--border); border-radius: 8px; font: inherit; }
.sortvm-eintrag { display: flex; align-items: center; gap: 6px; font-size: .78rem; min-width: 0; width: 100%; }
.sortvm-eintrag .sortvm-link { color: var(--accent); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sortvm-eintrag .muted { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ===== Build 782: Kategorie-Waehler mit Icons + Vormerkung bearbeiten/loeschen ===== */
.katpick-btn { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; padding: 8px 10px;
  border: 1px solid var(--border); border-radius: 8px; background: var(--surface); font: inherit; cursor: pointer; text-align: left; }
.katpick-btn .katpick-txt { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.katpick-ico { width: 22px; height: 22px; object-fit: contain; flex: 0 0 auto; }
.katpick-pop { position: fixed; z-index: 320; width: 360px; max-height: 360px; display: flex; flex-direction: column;
  padding: 8px; gap: 6px; box-shadow: 0 14px 40px rgba(15, 23, 42, .3); }
.katpick-such { padding: 7px 10px; border: 1px solid var(--border); border-radius: 8px; font: inherit; }
.katpick-lst { overflow: auto; display: flex; flex-direction: column; gap: 2px; }
.katpick-z { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border: none; background: transparent;
  border-radius: 7px; font: inherit; cursor: pointer; text-align: left; min-width: 0; }
.katpick-z:hover { background: rgba(0, 0, 0, .06); }
.katpick-z span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Build 782b: Vormerkungs-Block in der Kategorie-Detailansicht */
.cd-vormerk { margin-top: 10px; display: flex; flex-direction: column; gap: 4px; }
.cd-vormerk .cd-lbl { font-weight: 700; }

/* Build 783: Kategorie-Baum im Waehler (Pfeile) */
.katpick-pf { flex: 0 0 20px; width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center;
  font-size: .95rem; font-weight: 700; color: var(--ink, #1e2430); border-radius: 5px; cursor: pointer; }
.katpick-pf:hover { background: rgba(0, 0, 0, .08); }
.katpick-pf.leer { cursor: default; }

/* ===== Build 784: Kategorie-Waehler groesser (Pfeile, Text, Symbole) + URL-Feld trennt Adressen ===== */
.katpick-pop { width: 460px; max-height: 480px; }
.katpick-such { padding: 10px 12px; font-size: 1rem; }
.katpick-z { font-size: 1.05rem; padding: 9px 10px; gap: 10px; }
.katpick-ico { width: 28px; height: 28px; }
.katpick-z svg, .katpick-btn svg { width: 24px; height: 24px; flex: 0 0 auto; }
.katpick-pf { flex: 0 0 30px; width: 30px; height: 30px; font-size: 1.35rem; }
.katpick-btn { font-size: 1.05rem; padding: 10px 12px; }
.sortvm-urlzahl { font-size: .8rem; }
.sortvm textarea.drop-da { outline: 2px dashed var(--accent, #2563eb); outline-offset: -2px; }

/* ===== Build 785: Ticket-Herkunft sichtbar — Ersteller-Zeile, klickbare Links, Sprung-Knopf zum Ticket ===== */
.auf-erstellt { font-size: .82rem; color: var(--muted); padding: 6px 10px; border: 1px solid var(--border);
  border-radius: 8px; background: rgba(0, 0, 0, .03); }
.auf-links { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 2px 0 4px; }
.auf-links .auf-links-lbl { font-size: .74rem; flex: 0 0 100%; }
.auf-links .auf-anh-chip { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sortvm-ticket { flex: 0 0 auto; white-space: nowrap; }

/* ===== Build 786: EIN Ticket-Knopf im Kopf + Dubletten-Warnung im Vormerk-Dialog ===== */
.sortvm-kopf { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cd-vormerk .cd-lbl { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sortvm-warn { display: flex; flex-direction: column; gap: 8px; padding: 8px 10px; border: 1px solid #d97706;
  background: rgba(217, 119, 6, .08); border-radius: 8px; font-size: .8rem; }
.sortvm-warn-z { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-width: 0; }
.sortvm-warn-txt { min-width: 0; flex: 1 1 100%; overflow: hidden; text-overflow: ellipsis; }

/* ===== Build 788: Vormerkungen nach Ticket gruppiert (Klapp-Zeile je Ticket) ===== */
.sortvm-gruppe-t { font-weight: 600; }
.sortvm-gruppe-rows { display: flex; flex-direction: column; gap: 4px; padding-left: 16px; }

/* ===== Build 789: Ticket-Sprung als dezenter Text-Link statt Knopf-Pille ===== */
.sortvm-ticket-link { color: var(--accent, #2563eb); font-size: .78rem; font-weight: 600;
  text-decoration: none; white-space: nowrap; flex: 0 0 auto; }
.sortvm-ticket-link:hover { text-decoration: underline; }

/* ===== Build 790: Ticket-Zeile — Klapp-Text und "Ticket oeffnen"-Link auf GLEICHER Hoehe ===== */
.sortvm-kopf { margin-top: 8px; }
.sortvm-kopf .line-toggle { margin-top: 0; }
.sortvm-kopf .sortvm-ticket-link { padding: 2px 0; line-height: 1.2; }

/* ===== Build 792: Ersteller-Zeile mit Lieferanten-Sprung + Sammel-Bearbeitung der Ticket-Gruppe ===== */
.auf-erstellt { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* ===== Build 797: Dokument-Liste zeigt den echten Dateinamen hinter Seiten-Links ===== */
.doc-echt { font-size: .72rem; font-weight: 400; }

/* ===== Build 798: Ignorier-Liste im Onboarding-Dialog (nie einlesen, z.B. Newsletter) ===== */
.map-ignore { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 14px;
  padding-top: 10px; border-top: 1px dashed var(--border); font-size: .8rem; }

/* ===== Build 801: Bildname unter jeder Bild-Kachel im Auslesen-Panel ===== */
.scrape-imgname { position: absolute; left: 0; right: 0; bottom: 0; font-size: .62rem; line-height: 1.25;
  padding: 2px 5px; background: rgba(255, 255, 255, .88); color: #1e2430; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; border-radius: 0 0 8px 8px; pointer-events: none; }

/* ===== Build 802: Varianten-Blaettern rechts in der Reiter-Leiste ===== */
.pf-tabs .var-blaettern { flex: 0 0 auto; white-space: nowrap; margin: 4px 0; }
.pf-tabs .var-zaehler { flex: 0 0 auto; align-self: center; font-size: .78rem; padding: 0 4px; white-space: nowrap; }

/* ===== Build 803: Varianten-Blaettern schlicht - nur zwei Pfeile + Seitenzahl ===== */
.pf-tabs .var-pfeil { flex: 0 0 auto; align-self: center; width: 30px; height: 30px; border: none;
  background: transparent; border-radius: 8px; font-size: 1.25rem; line-height: 1; color: var(--text, #1e2430);
  cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 0 0 3px; }
.pf-tabs .var-pfeil:hover:not(:disabled) { background: rgba(0, 0, 0, .07); }
.pf-tabs .var-pfeil:disabled { opacity: .3; cursor: default; }

/* ===== Build 804: DAM - bearbeitete Fassung uebernimmt die Verknuepfungen des Originals ===== */
.dam-uebernehm { display: inline-flex; align-items: center; gap: 4px; margin: 4px 8px 6px; padding: 4px 8px;
  border: 1px solid var(--accent, #2563eb); border-radius: 8px; color: var(--accent, #2563eb);
  font-size: .72rem; font-weight: 600; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dam-uebernehm:hover { background: rgba(37, 99, 235, .08); }

/* ===== Build 805: Original-Waehler (Umhaengen ohne Namens-Paarung) ===== */
.dam-orig-lst { display: flex; flex-direction: column; gap: 6px; max-height: 420px; overflow: auto; margin-top: 8px; }
.dam-orig-z { display: flex; align-items: center; gap: 10px; padding: 6px 8px; border: 1px solid var(--border); border-radius: 10px; }
.dam-orig-z img { width: 64px; height: 44px; object-fit: contain; background: #f4f4f4; border-radius: 6px; flex: 0 0 auto; }
.dam-orig-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; font-size: .8rem; }
.dam-orig-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }

/* ===== Build 806: DAM - Auswahl an Artikel haengen (Artikel-Waehler) ===== */
.dam-art-z { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--border);
  border-radius: 10px; background: var(--surface); font: inherit; font-size: .82rem; cursor: pointer; text-align: left; }
.dam-art-z:hover { background: rgba(37, 99, 235, .07); }
.dam-art-z.einzug { margin-left: 22px; }
.dam-art-z span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ===== Build 807: DAM-Waehler im Artikel - vorgefiltert + Mehrfach-Uebernahme ===== */
.dam-pick-fuss { display: flex; align-items: center; gap: 10px; justify-content: flex-end;
  padding: 10px 14px; border-top: 1px solid var(--border); background: var(--surface); }

/* ===== Build 808: Bildtypen-Reihenfolge (bestimmt Bild-Reihenfolge am Artikel) ===== */
.ityp-sort { display: flex; flex-direction: column; gap: 6px; }
.ityp-sort-z { display: flex; align-items: center; gap: 10px; padding: 6px 10px; border: 1px solid var(--border); border-radius: 10px; }
.ityp-sort-nr { flex: 0 0 24px; color: var(--muted); }
.ityp-sort-name { font-weight: 600; }

/* ===== Build 811: Zeigen & Ernten - Zoom (Abbild scrollt im Rahmen) ===== */
.pick-wrap { overflow: auto; }

/* ===== Build 812: Werkzeugleiste im Zeigen & Ernten bricht um statt zu quetschen ===== */
.scrape-stage { flex-wrap: wrap; gap: 6px 8px; }
.scrape-stage .muted { flex: 1 1 100%; order: 9; min-width: 0; }

/* ===== Build 813: Klick-Menue untereinander + Werte-Raster (3-4 Spalten, ziehbar) ===== */
.pick-menu { display: flex; flex-direction: column; align-items: stretch; gap: 6px; min-width: 250px; max-width: 340px; padding: 8px; }
.pick-menu > .btn { width: 100%; text-align: left; white-space: normal; line-height: 1.25; }
.pick-menu-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(70px, 1fr)); gap: 6px; }
.pick-menu-grid .btn { white-space: nowrap; text-align: center; cursor: grab; overflow: hidden; text-overflow: ellipsis; }

/* ===== Build 814: Klick-Menue als richtiges Menue - flache Zeilen, Trennlinie, Werte-Chips ===== */
.pick-menu { gap: 2px; padding: 6px; min-width: 260px; max-width: 320px; border-radius: 12px; }
.pick-menu > .btn { border: none; background: transparent; box-shadow: none; border-radius: 8px;
  padding: 8px 10px; font-size: .82rem; font-weight: 500; color: var(--text, #1e2430); }
.pick-menu > .btn:hover { background: rgba(0, 0, 0, .06); }
.pick-menu > .btn.primary { background: transparent; color: var(--accent, #2563eb); font-weight: 700; }
.pick-menu > .btn.primary:hover { background: rgba(37, 99, 235, .09); }
.pick-menu-grid { grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--border, #e2e8f0);
  padding-top: 8px; margin-top: 4px; }
.pick-menu-grid .btn { border: 1px solid var(--border, #e2e8f0); border-radius: 8px; background: var(--surface, #fff);
  padding: 6px 4px; font-size: .8rem; font-weight: 600; box-shadow: none; }
.pick-menu-grid .btn:hover { border-color: var(--accent, #2563eb); color: var(--accent, #2563eb); background: rgba(37, 99, 235, .05); }

/* Build 814b: gleiche Regel-Staerke wie das Neo-Design, damit das Menue wirklich flach wird */
html .pick-menu > .btn, html[data-theme="neo"] .pick-menu > .btn {
  border: none; background: transparent; box-shadow: none; border-radius: 8px;
  padding: 8px 10px; font-size: .82rem; font-weight: 500; color: var(--text, #1e2430); }
html .pick-menu > .btn:hover, html[data-theme="neo"] .pick-menu > .btn:hover { background: rgba(0, 0, 0, .06); box-shadow: none; }
html .pick-menu > .btn.primary, html[data-theme="neo"] .pick-menu > .btn.primary {
  background: transparent; color: var(--accent, #2563eb); font-weight: 700; box-shadow: none; }
html .pick-menu > .btn.primary:hover, html[data-theme="neo"] .pick-menu > .btn.primary:hover {
  background: rgba(37, 99, 235, .09); box-shadow: none; }
html .pick-menu-grid .btn, html[data-theme="neo"] .pick-menu-grid .btn {
  border: 1px solid var(--border, #e2e8f0); border-radius: 8px; background: var(--surface, #fff);
  padding: 6px 4px; font-size: .8rem; font-weight: 600; box-shadow: none; color: var(--text, #1e2430); }
html .pick-menu-grid .btn:hover, html[data-theme="neo"] .pick-menu-grid .btn:hover {
  border-color: var(--accent, #2563eb); color: var(--accent, #2563eb); background: rgba(37, 99, 235, .05); box-shadow: none; }

/* ===== Build 821: Mehrfachauswahl in der Tabelle - Haekchen-Popup ===== */
.ptbl-multi { width: 100%; text-align: left; font: inherit; cursor: pointer; overflow: hidden; }
.ptbl-multi .ptbl-multi-txt { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ptbl-multi-pop { position: fixed; z-index: 340; min-width: 220px; max-width: 300px; max-height: 320px;
  overflow: auto; display: flex; flex-direction: column; gap: 2px; padding: 8px;
  box-shadow: 0 14px 40px rgba(15, 23, 42, .3); }
.ptbl-multi-z { display: flex; align-items: center; gap: 8px; padding: 5px 6px; border-radius: 7px;
  font-size: .82rem; cursor: pointer; }
.ptbl-multi-z:hover { background: rgba(0, 0, 0, .05); }

/* ===== Build 823: URL-Ampel - gruen eingepflegt, gelb provisorisch, grau offen ===== */
a.url-ok, .sortvm-link.url-ok { color: #15803d !important; font-weight: 600; }
a.url-teils, .sortvm-link.url-teils { color: #b45309 !important; font-weight: 600; }
a.auf-anh-chip.url-ok { border-color: #15803d; background: rgba(21, 128, 61, .08); }
a.auf-anh-chip.url-teils { border-color: #b45309; background: rgba(180, 83, 9, .08); }

/* ===== Build 825: Excel-Ausfuell-Eck in der Tabelle ===== */
.ptbl-wrap { position: relative; }
.ptbl-fill { position: absolute; width: 11px; height: 11px; background: var(--accent, #2563eb);
  border: 2px solid #fff; border-radius: 3px; cursor: ns-resize; z-index: 6; display: none;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .35); }
.ptbl-fill:hover { transform: scale(1.25); }
.ptbl-fill-mark { outline: 2px dashed var(--accent, #2563eb); outline-offset: -2px; background: rgba(37, 99, 235, .07); }

/* ===== Build 827: Ausfuell-Eck groesser und ueber dem Haekchen-Fenster ===== */
.ptbl-fill { width: 14px; height: 14px; z-index: 360; }

/* ===== Build 828: Ausfuell-Eck GROSS und ORANGE, sichtbar beim Draufzeigen ===== */
.ptbl-fill { width: 18px; height: 18px; background: #f59e0b; border: 3px solid #fff;
  border-radius: 5px; box-shadow: 0 2px 8px rgba(0, 0, 0, .45); }
.ptbl-fill:hover { transform: scale(1.2); background: #d97706; }

/* ===== Build 830: Ausfuell-Eck wie Excel — sitzt IN der Ecke der AKTIVEN Zelle, Klick = Befehls-Menue ===== */
.ptbl-fill { width: 12px; height: 12px; background: #1a7f37; border: 2px solid #fff;
  border-radius: 2px; box-shadow: 0 1px 3px rgba(0, 0, 0, .3); cursor: crosshair; }
.ptbl-fill:hover { transform: scale(1.3); background: #15803d; }
html .ptbl td.ptbl-aktiv, html[data-theme="neo"] .ptbl td.ptbl-aktiv { outline: 2px solid #1a7f37; outline-offset: -2px; }
.ptbl-fill-mark { outline: 2px dashed #1a7f37; outline-offset: -2px; background: rgba(26, 127, 55, .08); }
.ptbl-fill-menu { position: fixed; z-index: 400; background: var(--panel, #fff); border: 1px solid var(--border, #d1d5db);
  border-radius: 10px; box-shadow: 0 10px 30px rgba(0, 0, 0, .25); padding: 6px;
  display: flex; flex-direction: column; gap: 2px; min-width: 250px; }
html .ptbl-fill-menu button, html[data-theme="neo"] .ptbl-fill-menu button { border: 0; background: none; text-align: left;
  padding: 10px 12px; border-radius: 8px; cursor: pointer; font-size: .89rem; color: var(--text, #111827); width: 100%; }
html .ptbl-fill-menu button:hover, html[data-theme="neo"] .ptbl-fill-menu button:hover { background: rgba(26, 127, 55, .12); }
.ptbl td.ptbl-selz { background: rgba(26, 127, 55, .14) !important; outline: 1px solid rgba(26, 127, 55, .55); outline-offset: -1px; }
.ptbl-keinselect, .ptbl-keinselect * { user-select: none; }

/* ===== Build 830: Formular-Chips — 3px mehr Luft zwischen Wert und dem x-Quadrat (Zuruf 18.08.) ===== */
html .pf-tag, html[data-theme="neo"] .pf-tag { gap: 5px; }

/* ===== Build 831: Chip-x ohne Quadrat · Feld-Knopf 'auf alle Varianten' · Varianten-Fenster · Glossar-Karte ===== */
html .pf-tag button.chip-x, html[data-theme="neo"] .pf-tag button.chip-x { border: 0; background: none; box-shadow: none;
  padding: 0 3px; margin: 0; min-width: 0; min-height: 0; width: auto; height: auto; font-size: .95rem;
  line-height: 1; color: var(--faint, #8b9bb4); cursor: pointer; border-radius: 4px; }
html .pf-tag button.chip-x:hover, html[data-theme="neo"] .pf-tag button.chip-x:hover { background: none; color: #c0392b; transform: none; }
.pf-allvar { margin-top: 4px; align-self: flex-start; }
.varmehr-pop { width: min(460px, 92vw); }
.varmehr-pop textarea { font-family: inherit; font-size: .88rem; margin-top: 2px; }
.varmehr-anz { display: flex; align-items: center; gap: 10px; margin: 8px 0 2px; }
.varmehr-anz input { width: 96px; padding: 8px 10px; font-size: 1rem; }
.varmehr-ziel { margin: 10px 0 2px; }
html .varmehr-ziel label, html[data-theme="neo"] .varmehr-ziel label { display: flex; align-items: center; gap: 10px;
  padding: 8px 12px; border: 1px solid var(--border, #d1d5db); border-radius: 8px; margin-top: 5px; cursor: pointer; font-size: .9rem; }
.varmehr-ziel input { width: 16px; height: 16px; }
.gloss-tools { display: flex; align-items: center; gap: 12px; padding: 4px 10px 8px; flex-wrap: wrap; }
html .gloss-auto, html[data-theme="neo"] .gloss-auto { display: flex; align-items: center; gap: 7px; font-size: .84rem; cursor: pointer; }
.gloss-auto input { width: 16px; height: 16px; }
.gloss-fix-pop { width: min(520px, 94vw); max-height: 72vh; overflow: auto; }
.gloss-fix-zeile { border: 1px solid var(--border, #e2e8f0); border-radius: 8px; padding: 8px 10px; margin: 6px 0; }
.gloss-fix-feld { font-weight: 700; font-size: .78rem; margin-bottom: 3px; }
.gloss-fix-alt { color: #b91c1c; text-decoration: line-through; font-size: .84rem; }
.gloss-fix-neu { color: #15803d; font-size: .84rem; font-weight: 600; }

/* ===== Build 832: Formular — gruenes Eck am aktiven Feld statt Text-Knopf (Zuruf 18.08.) ===== */
.pf-row { position: relative; }
html .pf-row button.pf-fill, html[data-theme="neo"] .pf-row button.pf-fill { position: absolute; right: 3px; bottom: 3px;
  width: 12px; height: 12px; min-width: 0; min-height: 0; padding: 0; background: #1a7f37; border: 2px solid #fff;
  border-radius: 2px; cursor: pointer; z-index: 5; box-shadow: 0 1px 3px rgba(0, 0, 0, .3); }
html .pf-row button.pf-fill:hover, html[data-theme="neo"] .pf-row button.pf-fill:hover { transform: scale(1.35); background: #15803d; }

/* ===== Build 833: 'Auf alle Varianten'-Fenster statt Browser-Bestaetigung (Zuruf 18.08.) ===== */
.allvar-pop { width: min(480px, 94vw); }
html .allvar-kopf, html[data-theme="neo"] .allvar-kopf { display: flex; align-items: center; gap: 9px;
  font-weight: 700; font-size: .86rem; padding: 6px 2px; cursor: pointer; }
.allvar-liste { max-height: 46vh; overflow: auto; border: 1px solid var(--border, #e2e8f0); border-radius: 10px; padding: 4px; }
html .allvar-zeile, html[data-theme="neo"] .allvar-zeile { display: flex; align-items: center; gap: 10px;
  padding: 6px 8px; border-radius: 8px; cursor: pointer; }
html .allvar-zeile:hover, html[data-theme="neo"] .allvar-zeile:hover { background: rgba(26, 127, 55, .08); }
.allvar-zeile input { width: 16px; height: 16px; flex: none; }
.allvar-img { width: 30px; height: 30px; object-fit: cover; border-radius: 6px; flex: none; background: #fff; }
.allvar-imgleer { width: 30px; height: 30px; flex: none; }
.allvar-txt { display: flex; flex-direction: column; min-width: 0; }
.allvar-name { font-size: .85rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.allvar-nr { font-size: .74rem; color: var(--faint, #64748b); }

/* ===== Build 835: Auslesen — Mass-Ketten als ziehbare Token, Kombiniert-Ziel fuellt Einzel-Felder ===== */
.spec-token-reihe { display: inline-flex; gap: 4px; margin-left: 6px; flex: none; flex-wrap: wrap; }
html .spec-token, html[data-theme="neo"] .spec-token { border: 1px solid var(--border, #cbd5e1); border-radius: 7px;
  padding: 2px 8px; font-size: .78rem; cursor: grab; background: var(--panel, #fff); user-select: none; white-space: nowrap; }
html .spec-token:hover, html[data-theme="neo"] .spec-token:hover { border-color: #1a7f37; color: #1a7f37; }
.spec-token:active { cursor: grabbing; }

/* ===== Build 838: Zahlen-Karten vergroessern (Icon-Klick) — grosse Kurve + Zahlen + Zeitraum-Filter ===== */
.kpi-zoombtn { cursor: zoom-in; transition: transform .12s; }
.kpi-zoombtn:hover { transform: scale(1.12); }
.kpi-zoom-modal { max-width: 740px; width: min(740px, 94vw); }
.kpi-zoom-kopf { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.kpi-zoom-wert { font-size: 2rem; font-weight: 800; }
.kpi-zoom-filter { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 6px 0 10px; }
.kpi-zoom-kurve { overflow-x: auto; padding: 6px 0; }
.kpi-zoom-tblwrap { max-height: 38vh; overflow: auto; border: 1px solid var(--border, #e2e8f0); border-radius: 10px; }
.kpi-zoom-tbl { width: 100%; border-collapse: collapse; font-size: .86rem; }
.kpi-zoom-tbl th { text-align: left; padding: 8px 12px; position: sticky; top: 0; background: var(--panel, #fff); border-bottom: 1px solid var(--border, #e2e8f0); font-size: .76rem; }
.kpi-zoom-tbl td { padding: 6px 12px; border-bottom: 1px solid var(--border, #eef2f7); }
.kz-plus { color: #15803d; font-weight: 600; }
.kz-minus { color: #b91c1c; font-weight: 600; }
.kpi-zoom-extra { margin-top: 10px; display: flex; flex-direction: column; gap: 6px; }
.kpi-zoom-exrow { display: flex; align-items: center; gap: 8px; font-size: .9rem; }

/* ===== Build 839: Zoom-Fenster spektakulaerer — Hero-Zahl, echte Kurve mit Gitter/Hover, Stat-Kacheln, Balken ===== */
.kz-hero { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; margin: -6px -8px 10px; padding: 14px 16px; border-radius: 14px; }
.kpi-zoom-wert { font-size: 2.6rem; font-weight: 800; line-height: 1; letter-spacing: -.02em; }
.kz-pille { font-size: .82rem; font-weight: 700; padding: 4px 10px; border-radius: 999px; background: rgba(100, 116, 139, .12); }
.kz-pille.kz-plus { background: rgba(21, 128, 61, .12); }
.kz-pille.kz-minus { background: rgba(185, 28, 28, .10); }
.kz-kurvewrap { position: relative; margin: 8px 0 4px; }
.kz-svg { width: 100%; height: auto; display: block; }
.kz-grid { stroke: rgba(100, 116, 139, .18); stroke-width: 1; stroke-dasharray: 3 4; }
.kz-ylab { font-size: 11px; fill: #64748b; text-anchor: end; }
.kz-xlab { font-size: 11px; fill: #64748b; }
.kz-tip { position: absolute; top: 2px; background: var(--panel, #fff); border: 1px solid var(--border, #cbd5e1); border-radius: 8px;
  padding: 4px 10px; font-size: .78rem; font-weight: 700; box-shadow: 0 4px 14px rgba(0, 0, 0, .15); pointer-events: none; white-space: nowrap; }
.kz-tipline { position: absolute; top: 6%; bottom: 12%; width: 0; border-left: 1px dashed rgba(100, 116, 139, .55); pointer-events: none; }
.kz-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; margin: 10px 0 2px; }
.kz-stat { border: 1px solid var(--border, #e2e8f0); border-radius: 12px; padding: 10px 12px; }
.kz-stat-l { font-size: .72rem; font-weight: 700; color: var(--faint, #64748b); text-transform: uppercase; letter-spacing: .04em; }
.kz-stat-w { font-size: 1.3rem; font-weight: 800; margin-top: 2px; }
.kz-stat-u { font-size: .74rem; color: var(--faint, #64748b); }
.kz-stat.kz-plus .kz-stat-w { color: #15803d; }
.kz-stat.kz-minus .kz-stat-w { color: #b91c1c; }
.kz-balkzelle { position: relative; min-width: 140px; }
.kz-balken { position: absolute; left: 4px; top: 5px; bottom: 5px; border-radius: 5px; }
.kz-balkwert { position: relative; font-weight: 600; padding-left: 6px; }

/* ===== Build 841: 7 Zusatz-Kennzahl-Karten + Listen mit Balken im Zoom ===== */
.kz-listzeile { display: flex; align-items: center; gap: 10px; padding: 5px 2px; font-size: .86rem; }
.kz-listname { flex: 0 0 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.kz-listbalken { flex: 1; height: 12px; border-radius: 6px; background: rgba(100, 116, 139, .1); overflow: hidden; }
.kz-listfill { display: block; height: 100%; border-radius: 6px; }
.kz-listwert { flex: 0 0 auto; font-weight: 700; font-size: .8rem; color: var(--faint, #475569); min-width: 84px; text-align: right; }

/* ===== Build 843: interaktive Kennzahl-Listen (Direktspruenge), animierte Mehrfach-Linien, roter Prov-Chip am BP ===== */
.kz-line { stroke-dasharray: 1; stroke-dashoffset: 1; animation: kzDraw 1.1s ease-out forwards; }
@keyframes kzDraw { to { stroke-dashoffset: 0; } }
.kz-svg polygon { opacity: 0; animation: kzFade .9s ease-out .4s forwards; }
@keyframes kzFade { to { opacity: 1; } }
.kz-svg circle { opacity: 0; animation: kzPop .35s ease-out 1.05s forwards; }
@keyframes kzPop { to { opacity: 1; } }
.kpi svg { animation: kzGrow .55s ease-out; transform-origin: bottom; }
@keyframes kzGrow { from { transform: scaleY(0); opacity: .2; } to { transform: scaleY(1); opacity: 1; } }
.kz-legende { display: flex; gap: 16px; align-items: center; padding: 2px 2px 6px; flex-wrap: wrap; }
html .kz-legpunkt, html[data-theme="neo"] .kz-legpunkt { display: inline-flex; align-items: center; gap: 6px; font-size: .8rem; font-weight: 700; }
html button.kz-sprung, html[data-theme="neo"] button.kz-sprung { display: flex; align-items: center; justify-content: space-between; gap: 10px;
  width: 100%; text-align: left; border: 0; background: none; padding: 7px 10px; border-radius: 8px; cursor: pointer; font: inherit; }
html button.kz-sprung:hover, html[data-theme="neo"] button.kz-sprung:hover { background: rgba(99, 102, 241, .08); }
.kz-sprung-h { font-size: .86rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kz-sprung-m { font-size: .74rem; color: var(--faint, #64748b); flex: none; }
html button.kz-listzeile, html[data-theme="neo"] button.kz-listzeile { border: 0; background: none; width: 100%; font: inherit; text-align: left; }
.kz-listzeile.kz-klick { cursor: pointer; border-radius: 8px; }
.kz-listzeile.kz-klick:hover { background: rgba(99, 102, 241, .08); }
.bp-prov-warn { background: #fee2e2; color: #b91c1c; border: 1px solid #fecaca; border-radius: 999px;
  font-size: .68rem; font-weight: 800; padding: 2px 8px; flex: none; white-space: nowrap; }
.kz-endlab { font-size: 12px; font-weight: 700; }
.kz-legende .kz-legpunkt { margin-right: 14px; }
.kz-legpunkt .lg-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; flex: none; }
.kz-tag-klick { cursor: pointer; }
.kz-tag-klick:hover td { background: rgba(99, 102, 241, .06); }

/* ===== Build 844: Reiter Grob-Ansicht / Detail im Zoom-Fenster ===== */
.kz-reiter { display: flex; gap: 8px; margin: 2px 0 12px; }

/* ===== Build 845: Aufzeichnungs-Hinweis + klickbare Vollstaendigkeits-Kacheln ===== */
.kz-hinweis { background: rgba(245, 158, 11, .1); border: 1px solid rgba(245, 158, 11, .3); color: #92400e;
  border-radius: 10px; padding: 8px 12px; font-size: .8rem; margin: 2px 0 8px; }
html button.kz-stat, html[data-theme="neo"] button.kz-stat { font: inherit; text-align: left; }
.kz-statklick { cursor: pointer; transition: transform .1s; }
.kz-statklick:hover { transform: translateY(-2px); border-color: #94a3b8; }

/* ===== Build 846: Tages-Fenster mit FAQ-Klappen statt Liste unter der Tabelle ===== */
html .kz-zellknopf, html[data-theme="neo"] .kz-zellknopf { border: 1px solid rgba(21, 128, 61, .35); background: rgba(21, 128, 61, .08);
  color: #15803d; font-weight: 800; font-size: .84rem; border-radius: 8px; padding: 3px 10px; cursor: pointer; }
html .kz-zellknopf:hover, html[data-theme="neo"] .kz-zellknopf:hover { background: rgba(21, 128, 61, .16); }
.kz-faq { border: 1px solid var(--border, #e2e8f0); border-radius: 12px; margin: 6px 0; overflow: hidden; }
html button.kz-faq-kopf, html[data-theme="neo"] button.kz-faq-kopf { display: flex; align-items: center; gap: 10px; width: 100%;
  border: 0; background: none; padding: 12px 14px; cursor: pointer; font: inherit; text-align: left; }
html button.kz-faq-kopf:hover, html[data-theme="neo"] button.kz-faq-kopf:hover { background: rgba(99, 102, 241, .06); }
.kz-faq-pfeil { font-size: .9rem; color: var(--faint, #64748b); flex: none; }
.kz-faq-titel { font-weight: 700; font-size: .9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kz-faq-meta { font-size: .76rem; color: var(--faint, #64748b); margin-left: auto; flex: none; }
.kz-faq-inhalt { padding: 2px 10px 10px; border-top: 1px dashed var(--border, #e2e8f0); }

/* ===== Build 847: 8-Karten-Umbau + Ziel-Balken + grosser oranger Artikel-Filter ===== */
html select.art-missf, html[data-theme="neo"] select.art-missf { min-width: 200px; padding: 8px 12px; font-size: .88rem;
  font-weight: 600; border-radius: 10px; border: 1px solid var(--border, #cbd5e1); cursor: pointer; }
html select.art-missf.filter-orange, html[data-theme="neo"] select.art-missf.filter-orange { background: #fff7ed; border-color: #f97316;
  color: #9a3412; box-shadow: 0 0 0 3px rgba(249, 115, 22, .15); }
.kpi-zielbar { height: 7px; border-radius: 4px; background: rgba(100, 116, 139, .14); margin-top: 6px; overflow: hidden; }
.kpi-zielbar span { display: block; height: 100%; border-radius: 4px; background: #22c55e; }
.kz-zielzeile { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; font-size: .88rem; }
.kz-zielbar { flex: 1; min-width: 140px; height: 12px; border-radius: 6px; background: rgba(100, 116, 139, .14); overflow: hidden; }
.kz-zielfill { display: block; height: 100%; border-radius: 6px; background: #22c55e; }

/* ===== Build 848: klickbare Team-Kacheln, Kreis-/Netz-Ansichten, Listen-Kopf mit Umschalter ===== */
.kz-listkopf { display: flex; align-items: center; gap: 8px; }
.kz-donutwrap { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; padding: 10px 4px; }
.kz-donut { width: 150px; height: 150px; border-radius: 50%; position: relative; flex: none; }
.kz-donutloch { position: absolute; inset: 26px; border-radius: 50%; background: var(--panel, #fff);
  display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 1.1rem; }
.kz-donutleg { display: flex; flex-direction: column; gap: 4px; min-width: 220px; }
html .kz-donutzeile, html[data-theme="neo"] .kz-donutzeile { display: flex; align-items: center; gap: 8px; font-size: .86rem;
  border: 0; background: none; padding: 4px 8px; border-radius: 8px; text-align: left; font: inherit; }
.kz-donutzeile.kz-klick { cursor: pointer; }
.kz-donutzeile.kz-klick:hover { background: rgba(99, 102, 241, .08); }
.kz-donutname { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kz-donutwert { margin-left: auto; font-weight: 700; font-size: .8rem; color: var(--faint, #475569); }
.kz-radar { display: flex; justify-content: center; padding: 6px 0; }

/* ===== Build 851: KI-Berater in der Pruef-Inbox ===== */
.wertrat-pop { width: min(480px, 94vw); }
.wertrat-beg { background: rgba(99, 102, 241, .08); border-radius: 10px; padding: 10px 12px; font-size: .88rem; margin: 6px 0 10px; }
.wertrat-zeile { font-size: .86rem; padding: 3px 2px; }

/* ===== Build 852: Begriffs-Bibliothek (KI-Rat gratis wiederverwenden) ===== */
.wertrat-bib { display: inline-block; background: rgba(34, 197, 94, .12); color: #15803d; border-radius: 8px; padding: 4px 10px; font-size: .78rem; font-weight: 600; margin-bottom: 6px; }

/* ===== Build 853: Bibliothek-Eintraege aufklappbar ===== */
.bib-eintrag { border-bottom: 1px solid var(--border-2, #edf1f6); }
.bib-kopf { cursor: pointer; user-select: none; }
.bib-kopf:hover { background: var(--panel2, #f6f8fb); }
.bib-klapp { padding: 4px 10px 10px 34px; background: var(--panel2, #f8fafc); border-radius: 8px; margin: 0 0 8px; }

/* ===== Build 853: Einstellungs-Navigation mit Themen-Gruppen ===== */
.set-nav-grp { font-size: .82rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--text, #1f2937); padding: 18px 12px 6px; border-bottom: 2px solid var(--border-2, #e2e8f0); margin-bottom: 6px; }
.settings-nav .set-nav-grp:first-child { padding-top: 4px; }

/* ===== Build 854: Nachfrage beim endgueltigen Entfernen abgelehnter Werte ===== */
.wertweg-liste { max-height: 260px; overflow: auto; border: 1px solid var(--border-2, #e2e8f0); border-radius: 10px; padding: 6px 10px; }
.wertweg-zeile { font-size: .84rem; padding: 3px 0; }
.wertweg-zeile a { font-weight: 600; }

/* ===== Build 855: Listen-Doktor (Checkliste) + Kategorie-Einheit ===== */
.doktor-liste { max-height: 340px; overflow: auto; display: flex; flex-direction: column; gap: 4px; }
.doktor-zeile { display: flex; gap: 10px; align-items: flex-start; padding: 8px 10px; border: 1px solid var(--border-2, #e2e8f0); border-radius: 10px; cursor: pointer; }
.doktor-zeile:hover { background: var(--panel2, #f6f8fb); }
.doktor-zeile input { margin-top: 3px; }
.doktor-wert { font-size: .86rem; }
.doktor-beg { font-size: .76rem; color: var(--muted, #64748b); margin-top: 2px; }
.cd-unit { font-size: .78rem; padding: 3px 8px; border-radius: 8px; border: 1px solid var(--border, #d7dee8); }

/* ===== Build 856: Einheit am Merkmals-Chip waehlbar ===== */
.ord-unit-btn { background: none; border: none; cursor: pointer; padding: 0 2px; font: inherit; color: var(--muted, #64748b); border-radius: 6px; }
.ord-unit-btn:hover { background: var(--accent-soft, #e8edff); color: var(--accent, #4f6bed); }
.ord-unit-btn.anders { color: var(--accent, #4f6bed); font-weight: 700; }
.unit-pop { position: fixed; z-index: 240; display: flex; flex-direction: column; gap: 4px; padding: 8px; width: 230px; box-shadow: 0 12px 30px rgba(20, 35, 60, .22); }
.unit-warn { background: #fef3c7; border: 1px solid #f59e0b; color: #78350f; border-radius: 10px; padding: 10px 12px; font-size: .84rem; }

/* ===== Build 859: Einheiten-Knopf fuer ALLE Einheiten sichtbar (Pill, nicht gruen wie BP/V) ===== */
.ord-unit-btn { display: inline-flex; align-items: center; margin-left: 5px; padding: 1px 9px; font: inherit; font-size: .74rem; font-weight: 600;
  color: #4f6bed; background: #eef1fd; border: 1px solid #c9d3f7; border-radius: 999px; cursor: pointer; }
.ord-unit-btn:hover { background: #dfe6fb; border-color: #4f6bed; }
.ord-unit-btn.anders { background: #4f6bed; color: #fff; border-color: #4f6bed; }

/* ===== Build 861: Zweit-Einheit-Knopf am Kombinierten ===== */
.ord-unit2 { color: #7a869c; background: #f1f4f9; border-color: #d7dee8; border-style: dashed; }
.ord-unit2.anders { background: #64748b; color: #fff; border-color: #64748b; border-style: solid; }

/* ===== Build 862: Ketten-Fenster + Gruppen-Einheit-Frage ===== */
.kett-zeile { display: flex; align-items: center; gap: 12px; padding: 8px 10px; border: 1px dashed var(--border, #d7dee8); border-radius: 10px; margin-bottom: 6px; }
.kett-zeile.drag-over { border-color: #4f6bed; background: #eef1fd; }
.kett-ziel { flex: 1; font-size: .86rem; font-weight: 600; }
.kett-chip { cursor: grab; }

/* ===== Build 863: Bibliothek (eigener Navi-Punkt) ===== */
.bib-layout { display: grid; grid-template-columns: 320px 1fr; gap: 14px; align-items: start; }
.bib-liste { padding: 8px; max-height: calc(100vh - 210px); overflow: auto; }
.bib-zeile { padding: 10px 12px; border-radius: 10px; cursor: pointer; }
.bib-zeile:hover { background: var(--panel2, #f6f8fb); }
.bib-zeile.sel { background: var(--accent-soft, #e8edff); }
.bib-z-titel { font-weight: 700; font-size: .92rem; }
.bib-z-sub { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; font-size: .74rem; margin-top: 2px; }
.bib-tag { background: var(--panel2, #eef1f6); border: 1px solid var(--border-2, #e2e8f0); border-radius: 999px; padding: 0 8px; font-size: .7rem; color: var(--muted, #64748b); }
.bib-detail { padding: 16px 20px; min-height: 300px; }
.bib-kopfzeile { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.bib-titel { font-size: 1.15rem; margin: 0; }
.bib-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.bib-nebeneinander { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: start; }
.bib-text { font-size: .9rem; line-height: 1.55; }
.bib-dateien { display: flex; flex-wrap: wrap; gap: 10px; }
.bib-dateien.layout-galerie { margin-bottom: 14px; }
.bib-datei { display: flex; flex-direction: column; gap: 4px; width: 150px; text-decoration: none; color: inherit; border: 1px solid var(--border-2, #e2e8f0); border-radius: 10px; padding: 8px; }
.bib-datei:hover { border-color: var(--accent, #4f6bed); }
.bib-thumb { width: 100%; height: 100px; object-fit: contain; background: var(--panel2, #f6f8fb); border-radius: 6px; }
.bib-doksymbol { font-size: 2rem; text-align: center; padding: 26px 0; background: var(--panel2, #f6f8fb); border-radius: 6px; }
.bib-dateiname { font-size: .76rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bib-dokliste { display: flex; flex-direction: column; gap: 4px; }
.bib-dok-zeile { display: flex; gap: 8px; align-items: center; padding: 8px 10px; border: 1px solid var(--border-2, #e2e8f0); border-radius: 10px; text-decoration: none; color: inherit; }
.bib-dok-zeile:hover { border-color: var(--accent, #4f6bed); }
.bib-verkn { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--border-2, #edf1f6); font-size: .84rem; }
.bib-feld { margin-bottom: 12px; }
.bib-feld > label { display: block; font-size: .76rem; font-weight: 700; color: var(--muted, #64748b); margin-bottom: 4px; text-transform: uppercase; letter-spacing: .04em; }
.bib-titel-in { width: 100%; font-size: 1rem; padding: 8px 12px; border: 1px solid var(--border, #d7dee8); border-radius: 10px; }
.bib-layoutwahl { display: flex; gap: 8px; flex-wrap: wrap; }
.bib-edit-dateien { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.bib-chip { display: inline-flex; align-items: center; gap: 5px; background: var(--panel2, #f4f6fa); border: 1px solid var(--border-2, #e2e8f0); border-radius: 999px; padding: 3px 6px 3px 10px; font-size: .8rem; }
.bib-tag-in { font-size: .8rem; padding: 4px 10px; border: 1px solid var(--border, #d7dee8); border-radius: 999px; }
.bib-picker { position: fixed; z-index: 260; width: 340px; padding: 10px; box-shadow: 0 14px 34px rgba(20, 35, 60, .24); }
.bib-picker-liste { max-height: 320px; overflow: auto; display: flex; flex-direction: column; gap: 2px; margin-top: 8px; }
.bib-picker-zeile { display: flex; gap: 8px; align-items: center; padding: 6px 8px; border: none; background: none; border-radius: 8px; cursor: pointer; text-align: left; font: inherit; }
.bib-picker-zeile:hover { background: var(--panel2, #f6f8fb); }
.bib-picker-thumb { width: 34px; height: 34px; object-fit: contain; background: var(--panel2, #f6f8fb); border-radius: 6px; flex: none; }
.bib-picker-ico { width: 34px; text-align: center; font-size: 1.2rem; flex: none; }

/* ===== Build 864: Ketten-LEISTE (freie Zieh-Tokens statt Fenster) ===== */
.kett-leiste { position: fixed; z-index: 230; width: min(440px, 92vw); padding: 10px 14px; box-shadow: 0 14px 34px rgba(20, 35, 60, .24); }
.kett-leiste-kopf { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.kett-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.kett-chip { cursor: grab; font-size: .92rem; padding: 6px 14px; }
.kett-chip.dragging { opacity: .4; }

/* ===== Build 865: Gruppen-Einheit-Frage als Popover am Feld ===== */
.grpeinh-frage { position: fixed; z-index: 240; width: min(400px, 92vw); padding: 12px 14px; box-shadow: 0 14px 34px rgba(20, 35, 60, .26); border: 1px solid var(--accent, #4f6bed); }
.grpeinh-kopf { display: flex; align-items: center; gap: 8px; font-size: .9rem; }

/* ===== Build 867: Wissen dazu am Artikel ===== */
.verkn-bib { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; padding: 10px 12px; border: 1px solid var(--border-2, #e2e8f0); border-radius: 12px; margin-bottom: 12px; background: var(--panel2, #f8fafc); max-width: 640px; }
.bib-doksymbol { font-size: .82rem; font-weight: 800; letter-spacing: .06em; color: var(--muted, #64748b); }
.bib-picker-ico { font-size: .66rem; font-weight: 800; letter-spacing: .04em; color: var(--muted, #64748b); }
.bib-text img { max-width: 100%; height: auto; border-radius: 8px; }
.bib-text table { border-collapse: collapse; margin: 8px 0; }
.bib-text td, .bib-text th { border: 1px solid var(--border-2, #e2e8f0); padding: 4px 10px; font-size: .84rem; }

/* ===== Build 868: Tabellen/Bilder auch IM Editor sauber (Word-Import) ===== */
.rte-area table { border-collapse: collapse; margin: 8px 0; }
.rte-area td, .rte-area th { border: 1px solid var(--border-2, #e2e8f0); padding: 4px 10px; font-size: .84rem; }
.rte-area img { max-width: 100%; height: auto; border-radius: 8px; }
.rte-area h1, .rte-area h2, .rte-area h3, .rte-area h4 { margin: 12px 0 6px; }

/* ===== Build 869: Kapitel-Klappen fuer lange Bibliothek-Eintraege ===== */
.bib-kap-leiste { display: flex; gap: 8px; align-items: center; margin: 10px 0; }
.bib-kap { border: 1px solid var(--border-2, #e2e8f0); border-radius: 12px; margin-bottom: 8px; overflow: hidden; }
html button.bib-kap-kopf { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 14px; background: var(--panel2, #f8fafc);
  border: none; cursor: pointer; font: inherit; font-weight: 700; font-size: .92rem; text-align: left; color: var(--text, #1f2937); }
html button.bib-kap-kopf:hover { background: var(--accent-soft, #eef1fd); }
.bib-kap-body { padding: 10px 16px; }
.bib-text table { max-width: 100%; }

/* ===== Build 870: Text breit, Datei-Spalte schmal; Farb-Palette + Bild-Knopf im Editor ===== */
.bib-nebeneinander { grid-template-columns: minmax(0, 1fr) 240px; }
.bib-nebeneinander .bib-dateien { flex-direction: column; }
.bib-nebeneinander .bib-datei { width: auto; }
.bib-dokliste-oben { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.bib-dokliste-oben .bib-dok-zeile { padding: 6px 12px; }
.rte-farbbtn { font-weight: 800; text-decoration: underline; text-decoration-thickness: 3px; text-decoration-color: #7089c4; }
.rte-farbmenu { padding: 8px 10px; }
.rte-farbreihe { display: flex; gap: 5px; align-items: center; margin-bottom: 6px; }
.rte-farblbl { font-size: .72rem; color: var(--muted, #64748b); width: 46px; }
.rte-farbfeld { width: 22px; height: 22px; border-radius: 6px; border: 1px solid var(--border, #d7dee8); cursor: pointer; }
.rte-farbfeld:hover { transform: scale(1.15); }

/* ===== Build 871: Word-Look in der Bibliothek — Navigation links, blaue Ueberschriften, kompakte Tabellen ===== */
.bib-navwrap { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 18px; align-items: start; }
.bib-nav { position: sticky; top: 8px; max-height: calc(100vh - 220px); overflow: auto; border: 1px solid var(--border-2, #e2e8f0); border-radius: 12px; padding: 8px; background: var(--panel2, #f8fafc); }
.bib-nav-titel { font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--muted, #64748b); padding: 4px 8px 6px; }
html button.bib-nav-punkt { display: block; width: 100%; text-align: left; border: none; background: none; cursor: pointer; font: inherit;
  font-size: .82rem; padding: 4px 8px; border-radius: 8px; color: var(--text, #1f2937); }
html button.bib-nav-punkt:hover { background: var(--accent-soft, #eef1fd); }
html button.bib-nav-punkt.aktiv { background: var(--accent-soft, #e8edff); font-weight: 700; }
html button.bib-nav-punkt.stufe-h2 { padding-left: 20px; font-size: .78rem; }
html button.bib-nav-punkt.stufe-h3 { padding-left: 32px; font-size: .76rem; color: var(--muted, #64748b); }
/* Ueberschriften wie im Word: Titel gross-dunkel, Kapitel blau, klare Groessen-Treppe */
.bib-text h1 { font-size: 1.6rem; font-weight: 800; color: var(--text, #1f2937); margin: 14px 0 6px; }
.bib-text h1 ~ h1, .bib-text h2 { font-size: 1.25rem; font-weight: 700; color: #2e74b5; margin: 16px 0 6px; }
.bib-text h3 { font-size: 1.05rem; font-weight: 700; color: #2e74b5; margin: 12px 0 4px; }
.bib-text h4 { font-size: .92rem; font-weight: 600; color: var(--muted, #64748b); margin: 10px 0 4px; }
/* Tabellen kompakt wie im Dokument */
.bib-text td, .bib-text th { padding: 2px 8px; font-size: .82rem; line-height: 1.35; }
.bib-text th { background: var(--panel2, #f4f6fa); font-weight: 700; }
.bib-text p { margin: 4px 0; }

/* ===== Build 874: Tabellen-Breite wie im Word + schwebende Bilder (Umfluss) ===== */
.bib-text h1, .bib-text h2, .bib-text h3, .bib-text table { clear: both; }
.bib-text::after { content: ''; display: block; clear: both; }

/* ===== Build 875: rahmenlose Word-Tabellen + Zellen-Divs ===== */
.bib-text table.bib-tab-ohne td, .bib-text table.bib-tab-ohne th { border: none; }
.bib-text td > div { margin: 0; }

/* ===== Build 876: PDF-Import + eingebettete 1:1-Ansicht ===== */
.bib-pdf { margin-top: 16px; border: 1px solid var(--border-2, #e2e8f0); border-radius: 12px; overflow: hidden; }
.bib-pdf summary { padding: 10px 14px; background: var(--panel2, #f8fafc); font-weight: 700; font-size: .88rem; cursor: pointer; }
.bib-pdf-frame { width: 100%; height: 75vh; border: none; display: block; }

/* ===== Build 877: Bild-Werkzeug im Editor (Groesse + Lage) ===== */
.rte-bildwerk { position: fixed; z-index: 260; width: min(420px, 92vw); padding: 10px 14px; box-shadow: 0 14px 34px rgba(20, 35, 60, .26); border: 1px solid var(--accent, #4f6bed); }
.rte-bildzeile { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; flex-wrap: wrap; }
.rte-bildwert { font-size: .76rem; color: var(--muted, #64748b); width: 58px; text-align: right; }
.rte-area img { cursor: pointer; }
.rte-area img:hover { outline: 2px solid var(--accent, #4f6bed); outline-offset: 2px; }

/* ---- Build 881: PIM-Zurück-Knopf + „+ Vormerkung / Ticket" auf der Lieferanten-Karte ---- */
.pim-rueck { position: fixed; top: 74px; right: 24px; z-index: 120; display: inline-flex; align-items: center; gap: 10px;
  padding: 10px 16px; border: 1px solid #2563eb; border-radius: 999px; background: #2563eb; color: #fff;
  font-size: .88rem; font-weight: 700; cursor: pointer; box-shadow: 0 6px 20px rgba(37, 99, 235, .35); }
.pim-rueck:hover { background: #1d4ed8; }
.pim-rueck-x { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px;
  border-radius: 50%; background: rgba(255, 255, 255, .22); font-weight: 400; font-size: .78rem; }
.pim-rueck-x:hover { background: rgba(255, 255, 255, .4); }
.vm-neu-row { margin-top: 8px; }
.vm-neu-btn { width: 100%; text-align: center; border-style: dashed; color: #475569; }
.vm-neu-btn:hover { color: #1d4ed8; border-color: #2563eb; }

/* ---- Build 883: aktiver Artikel in der Liste — kräftig BLAU statt gelb, damit man ihn sofort sieht ---- */
.art-row.bp.sel { background: #bfdbfe; border-color: #2563eb; box-shadow: inset 4px 0 0 #2563eb; }
.art-row.variant.sel { background: #dbeafe; box-shadow: inset 4px 0 0 #2563eb; }
html[data-theme="dunkel"] .art-row.bp.sel { background: #1e3a5f; border-color: #3b82f6; box-shadow: inset 4px 0 0 #3b82f6; }
html[data-theme="dunkel"] .art-row.variant.sel { background: #172a45; box-shadow: inset 4px 0 0 #3b82f6; }

/* ---- Build 886: BP/Varianten-Blätterer sitzt GANZ RECHTS in der Reiter-Leiste (ihr Wunsch 20.08.) ---- */
.pf-tabs .spacer { flex: 1 1 auto; min-width: 12px; }
.pf-tabs .bp-taste { flex: 0 0 auto; align-self: center; white-space: nowrap; }

/* ---- Build 887: „Extras"-Menü im Formular-Kopf — Pflege-Knöpfe sichtbar, Übriges aufgeräumt ---- */
.extras-pop { position: fixed; z-index: 1500; width: 300px; background: var(--panel, #fff); border: 1px solid var(--border-2, #cbd5e1); border-radius: 12px; box-shadow: 0 12px 34px rgba(15, 23, 42, .18); padding: 6px; }
.extras-z { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; text-align: left; padding: 8px 10px; border: none; background: none; border-radius: 8px; cursor: pointer; }
.extras-z:hover { background: var(--accent-soft, #eef2ff); }
.extras-z b { font-size: .85rem; }
.extras-z .muted { font-size: .72rem; }
.extras-strich { border-top: 1px solid var(--border, #e2e8f0); margin: 4px 6px; }
.extras-z.gefahr b { color: #dc2626; }
.extras-z.gefahr:hover { background: #fee2e2; }
html[data-theme="dunkel"] .extras-z.gefahr:hover { background: #4c1d1d; }

/* ---- Build 889: Tabellen im Auslesen-Panel (Server/KI/eingefügt) — Zellen ziehbar ---- */
.scrape-tabwrap { overflow-x: auto; margin: 8px 0; }
.scrape-tab { border-collapse: collapse; font-size: .78rem; }
.scrape-tab th, .scrape-tab td { border: 1px solid var(--border, #e2e8f0); padding: 4px 9px; white-space: nowrap; max-width: 260px; overflow: hidden; text-overflow: ellipsis; }
.scrape-tab th { background: var(--accent-soft, #eef2ff); font-weight: 700; text-align: left; }
.scrape-tab td[draggable="true"], .scrape-tab th[draggable="true"] { cursor: grab; }
.scrape-tab td[draggable="true"]:hover, .scrape-tab th[draggable="true"]:hover { background: #dbeafe; }
.scrape-tab-ki th { background: #ecfdf5; }
html[data-theme="dunkel"] .scrape-tab td[draggable="true"]:hover, html[data-theme="dunkel"] .scrape-tab th[draggable="true"]:hover { background: #1e3a5f; }
html[data-theme="dunkel"] .scrape-tab-ki th { background: #14342a; }
.scrape-tabwrap { flex: 0 0 auto; }   /* Panel-Body ist flex — ohne das wird der Umschlag auf 0 Höhe gequetscht */

/* ---- Build 891: Varianten aus Tabelle — Zuordnungs-Fenster ---- */
.vartab-btn { margin: 2px 0 10px; }
.vartab .vartab-sel { max-width: 160px; font-size: .74rem; padding: 2px 4px; }
.vartab th { vertical-align: middle; }
.vartab td:first-child, .vartab th:first-child { text-align: center; width: 34px; }

/* ---- Build 897: „Deine Merkmale auf der Seite" — Fund-Liste im Auslesen-Panel ---- */
.scrape-attrfunde { display: flex; flex-direction: column; gap: 3px; margin: 6px 0 10px; flex: 0 0 auto; }
.af-zeile { display: flex; align-items: center; gap: 10px; padding: 4px 8px; border: 1px solid var(--border, #e2e8f0); border-radius: 8px; }
.af-name { font-size: .78rem; font-weight: 600; min-width: 160px; }
.af-wert { font-size: .82rem; cursor: grab; background: #eef2ff; border-radius: 6px; padding: 1px 8px; }
.af-wert:hover { background: #dbeafe; }
.af-quelle { font-size: .72rem; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html[data-theme="dunkel"] .af-wert { background: #1e293b; }
html[data-theme="dunkel"] .af-wert:hover { background: #1e3a5f; }

/* ---- Build 898: Dubletten-Wächter im Varianten-Generator ---- */
.vartab-doppelt td { opacity: .55; }
.vartab-mark { display: block; color: #dc2626; font-size: .68rem; font-weight: 700; white-space: nowrap; }

/* ★ Favoriten-Kategorien (21.08.2026): Stern in jeder Baum-Zeile + Block „Meine Kategorien" oben.
   Der Stern hält sich im Hintergrund, bis man über die Zeile fährt — angepinnte bleiben sichtbar. */
.tstern{opacity:0;transition:opacity .12s}
.tnode:hover .tstern,.tstern.aktiv{opacity:1}
.fav-block{border-bottom:1px solid var(--border);padding:10px 12px 12px;background:var(--bg2,#fafafa);border-radius:12px 12px 0 0}
.fav-block-kopf{display:flex;align-items:baseline;gap:8px;justify-content:space-between;font-weight:600;font-size:.82rem;color:#c2903f;margin-bottom:8px}
.fav-block-liste{display:flex;flex-wrap:wrap;gap:6px}
.fav-chip{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:5px 11px;border:1px solid var(--border);border-radius:999px;background:var(--card,#fff);cursor:pointer;font-size:.84rem;font-family:inherit;color:inherit}
.fav-chip:hover{border-color:#c2903f;background:#fffaf0}
.fav-chip.aktiv{border-color:#c2903f;background:#fff4e0;font-weight:600}
.fav-chip img.cat-ico{width:16px;height:16px;object-fit:contain}
.fav-chip>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* 🕐 „Zuletzt bearbeitet"-Leiste: gleiche Bauart wie der Favoriten-Block, aber ruhiger (grau statt gold) */
.zuletzt-block{background:transparent;border-bottom:1px solid var(--border)}
.zuletzt-block .fav-block-kopf{color:var(--muted)}
.zuletzt-chip{color:var(--muted)}
.zuletzt-chip:hover{border-color:var(--fg,#334155);background:var(--bg2,#f8fafc);color:inherit}
.chip-wann{font-size:.72rem;opacity:.7;padding-left:2px}
/* Leisten in der schmalen Artikel-Spalte: kompakter, Namen dürfen abschneiden */
.art-fav-block{border-radius:0;padding:8px 10px 10px}
.art-fav-block .fav-chip{max-width:100%;font-size:.8rem;padding:4px 9px}
.art-fav-block .fav-chip>span:first-child{max-width:170px}
/* ★ Stern in der Ecke von Kacheln (Attribut-Karten, Bild-Kacheln) — stört das Bild nicht */
.fav-stern.ecke{position:absolute;top:4px;right:4px;z-index:3;background:rgba(255,255,255,.85);backdrop-filter:blur(2px)}
.attr-card,.dam-card{position:relative}
.dam-card .fav-stern.ecke{top:6px;right:34px}
/* Leisten-Hülle: beide Blöcke untereinander, gleicher Abstand wie Karten */
.schnell-leisten{margin:0 0 14px}
.schnell-leisten .fav-block{border-radius:12px;border:1px solid var(--border);margin-bottom:8px}
.schnell-leisten .fav-block:last-child{margin-bottom:0}
.schnell-leisten.kompakt .fav-block{border-radius:0;border-left:none;border-right:none;margin-bottom:0}
/* Gruppen im Weitergeben-Fenster: Sammel-Häkchen fett, Einträge eingerückt */
.fav-gruppe{margin-bottom:10px}
.fav-gruppe-kopf{padding:2px 0}
.fav-gruppe-liste{padding-left:22px}

/* 🙂 Emoji-Auswahl und 🔗 Verknüpfen-Fenster im Chat (21.08.2026) */
.emoji-panel{position:fixed;z-index:1200;background:var(--card,#fff);border:1px solid var(--border);border-radius:12px;
  box-shadow:0 12px 32px rgba(0,0,0,.18);padding:10px;max-height:340px;overflow-y:auto;width:320px}
.emoji-gruppe{margin-bottom:8px}
.emoji-titel{font-size:.7rem;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);font-weight:600;margin-bottom:4px}
.emoji-raster{display:grid;grid-template-columns:repeat(8,1fr);gap:3px}
.emoji-btn{border:none;background:none;cursor:pointer;font-size:1.15rem;line-height:1;padding:4px 2px;border-radius:6px}
.emoji-btn:hover{background:var(--bg2,#f1f5f9);transform:scale(1.25)}
.verkn-panel{width:380px}
.verkn-liste{max-height:230px;overflow-y:auto}
.verkn-zeile{display:flex;align-items:center;gap:8px;width:100%;text-align:left;border:none;background:none;cursor:pointer;
  padding:6px 8px;border-radius:8px;font-family:inherit;font-size:.84rem;color:inherit}
.verkn-zeile:hover{background:var(--bg2,#f1f5f9)}
.verkn-typ{flex:0 0 auto;font-size:.68rem;text-transform:uppercase;letter-spacing:.3px;font-weight:700;color:var(--muted);
  border:1px solid var(--border);border-radius:5px;padding:1px 5px}
.verkn-titel{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* #123 im Chat: sieht aus wie ein Link, ist aber ein Knopf */
.chat-auf-link{border:none;background:none;padding:0;font:inherit;color:#2563eb;cursor:pointer;font-weight:600}
.chat-auf-link:hover{text-decoration:underline}

/* 👀 Live-Anwesenheit (21.08.2026): wer arbeitet gerade woran */
.praesenz-chip{display:inline-flex;align-items:center;justify-content:center;flex:none;
  width:22px;height:22px;border-radius:50%;background:#64748b;color:#fff;
  font-size:.62rem;font-weight:700;letter-spacing:.2px;margin-left:3px;border:2px solid var(--card,#fff)}
.praesenz-chip.schreibt{box-shadow:0 0 0 2px #f59e0b}
.praesenz-chips{display:inline-flex;flex:none}
.praesenz-warn{display:flex;align-items:center;gap:10px;margin:0 0 12px;padding:9px 14px;border-radius:10px;
  background:#eff6ff;border:1px solid #93c5fd;color:#1e40af;font-size:.85rem}
.praesenz-warn.schreibt{background:#fef3c7;border-color:#f59e0b;color:#92400e;font-weight:600}
.live-zahl{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:#2e9e44;color:#fff;
  border-radius:999px;min-width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;
  font-size:.68rem;font-weight:700;padding:0 5px}
.nav-item.schnell-btn{position:relative}
.live-zeile{display:flex;align-items:center;gap:8px;padding:5px 4px}
.live-punkt{width:8px;height:8px;border-radius:50%;background:#f59e0b;flex:none;margin-left:auto}
/* Personen-Reihe unter „Team live": immer sichtbar, ohne Klick */
.live-reihe{display:flex;flex-wrap:wrap;gap:2px;padding:2px 14px 6px;min-height:0}
.live-reihe:empty{display:none}
.live-reihe .praesenz-chip{margin-left:0;width:24px;height:24px;font-size:.66rem}
.sidebar.collapsed .live-reihe{padding:2px 6px 6px;justify-content:center}
/* „Gerade am Arbeiten"-Zeile auf dem Dashboard */
.dash-live .praesenz-chip{margin-left:0;margin-right:6px}
.dash-live .dash-weiter-k{align-items:center}
/* Blasser Kreis = die Person ist nicht direkt hier, sondern in einem Artikel/einer Unterkategorie */
.praesenz-chip.indirekt{opacity:.62;border-style:dashed}
/* „+3" wenn mehr Leute da sind als Kreise passen */
.praesenz-chip.mehr{background:transparent;color:var(--muted);border-color:var(--border);font-weight:700}
/* Kleine Zahl am zugeklappten Zweig: „hier drin arbeiten 2" — unaufdringlich, kein Kreis-Stapel */
.praesenz-tief{display:inline-flex;align-items:center;justify-content:center;flex:none;margin-left:4px;
  min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--bg2,#eef2f7);
  color:var(--muted);font-size:.66rem;font-weight:700;border:1px solid var(--border)}
.praesenz-tief::before{content:"";width:5px;height:5px;border-radius:50%;background:#2e9e44;margin-right:3px}
/* „Gerade in Arbeit"-Leiste: hebt sich leicht ab, damit man sie beim Arbeiten wahrnimmt */
.praesenz-block{background:#fffbeb;border-bottom-color:#fcd34d}
.praesenz-block .fav-block-kopf{color:#92400e}
.praesenz-chip-zeile{border-color:#fcd34d}
.praesenz-chip-zeile:hover{border-color:#f59e0b;background:#fef3c7}
.praesenz-chip-zeile .praesenz-chip{margin-left:0;margin-right:4px;width:20px;height:20px;font-size:.6rem}

/* 📂 Zuklappbare Gruppen in der Seitenleiste (21.08.2026) */
.nav-section.klappbar{cursor:pointer;display:flex;align-items:center;justify-content:space-between;
  border-radius:6px;user-select:none}
.nav-section.klappbar:hover{background:rgba(255,255,255,.06)}
.nav-pfeil{font-size:.7rem;opacity:.6;transition:transform .15s;margin-left:6px}
.nav-section.zu .nav-pfeil{transform:rotate(-90deg)}
.nav-item.nav-versteckt{display:none}
.sidebar.collapsed .nav-pfeil{display:none}

/* 🚨 Warnung, wenn ein anderes Fenster die Anmeldung übernommen hat (21.08.2026) */
.anmeldung-gewechselt{position:fixed;top:0;left:0;right:0;z-index:3000;display:flex;align-items:center;
  gap:14px;padding:12px 20px;background:#dc2626;color:#fff;font-size:.88rem;line-height:1.45;
  box-shadow:0 4px 16px rgba(0,0,0,.28)}
.anmeldung-gewechselt b{font-weight:700}
.anmeldung-gewechselt .btn{flex:none;background:#fff;color:#991b1b;border-color:#fff;font-weight:700}

/* 🔒 „Jemand arbeitet hier" — deutlich rot statt nur ein kleiner Kreis (21.08.2026) */
.art-row.belegt{background:#fef2f2;border-left:4px solid #dc2626}
.art-row.belegt:hover{background:#fee2e2}
.art-row.belegt .art-name{color:#991b1b}
.belegt-sub{color:#b91c1c !important;font-weight:600;display:flex;align-items:center;gap:4px}
.belegt-sub .schloss{font-size:.8em}
.tnode.belegt{background:#fef2f2;border-left:3px solid #dc2626}
.tnode.belegt:hover{background:#fee2e2}
.tnode.belegt .tname>span:first-of-type{color:#991b1b;font-weight:600}
.belegt-name{margin-left:6px;font-size:.72rem;font-weight:700;color:#b91c1c;white-space:nowrap}
/* Schreibschutz im Formular (nur wenn eingeschaltet) */
.formular-gesperrt input:not([type=button]):not([type=submit]),
.formular-gesperrt textarea,
.formular-gesperrt select{pointer-events:none;background:#f8fafc;color:#94a3b8}
.formular-gesperrt .pf-fill,.formular-gesperrt .btn.primary{opacity:.45;pointer-events:none}
.sperr-leiste{display:flex;align-items:center;gap:12px;margin:0 0 12px;padding:9px 14px;border-radius:10px;
  background:#fee2e2;border:1px solid #dc2626;color:#991b1b;font-size:.85rem;font-weight:600}
.sperr-leiste .btn{flex:none}
/* „ist auch hier, hat aber noch nichts offen" — blasser als die echten Bearbeiter */
.praesenz-chip-zeile.umher{border-style:dashed;opacity:.75;cursor:default}
/* Hinweis über der Artikelliste, wenn die Kategorie gerade bearbeitet wird */
.kat-belegt-hinweis{display:flex;align-items:center;gap:10px;padding:9px 12px;background:#fef3c7;
  border-bottom:1px solid #f59e0b;color:#92400e;font-size:.82rem;font-weight:600;line-height:1.4}

/* 🗂 Einstellungen: zwei Ebenen statt einer langen Liste (21.08.2026) */
.settings-nav{flex:0 0 200px}
.set-grp-btn{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;
  padding:10px 14px;margin-bottom:4px;border:1px solid transparent;border-radius:10px;background:none;
  cursor:pointer;font-family:inherit;font-size:.88rem;font-weight:600;color:var(--fg,#334155);text-align:left}
.set-grp-btn:hover{background:var(--bg2,#f1f5f9)}
.set-grp-btn.active{background:var(--accent-weak,#eef2ff);border-color:var(--accent,#6366f1);color:var(--accent,#4f46e5)}
.set-grp-zahl{flex:none;font-size:.7rem;font-weight:700;color:var(--muted);background:var(--bg2,#f1f5f9);
  border-radius:999px;min-width:20px;text-align:center;padding:1px 6px}
.set-grp-btn.active .set-grp-zahl{background:#fff;color:var(--accent,#4f46e5)}
/* Waagrechte Reiter über dem Inhalt */
.set-reiter{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.set-reiter:empty{display:none}
.set-reiter-btn{padding:7px 14px;border:1px solid var(--border);border-radius:999px;background:var(--card,#fff);
  cursor:pointer;font-family:inherit;font-size:.84rem;color:var(--fg,#334155)}
.set-reiter-btn:hover{border-color:var(--accent,#6366f1)}
.set-reiter-btn.active{background:var(--accent,#6366f1);border-color:var(--accent,#6366f1);color:#fff;font-weight:600}

/* 🔒 Balken: Zwei-Faktor ist Pflicht, fehlt aber noch (21.08.2026) */
.zweifaktor-pflicht{position:fixed;top:0;left:0;right:0;z-index:2900;display:flex;align-items:center;
  gap:14px;padding:11px 20px;background:#f59e0b;color:#3b2600;font-size:.88rem;line-height:1.45;
  box-shadow:0 3px 14px rgba(0,0,0,.22)}
.zweifaktor-pflicht .btn{flex:none;background:#3b2600;color:#fff;border-color:#3b2600;font-weight:700}

/* 📥 Ablage-Felder je Bildart im Produktformular (21.08.2026) */
.mv-ablagen{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.mv-ablage{flex:1 1 120px;min-width:110px;padding:12px 10px;border:2px dashed var(--border);border-radius:12px;
  background:var(--bg2,#f8fafc);text-align:center;transition:background .12s,border-color .12s}
.mv-ablage.over{border-color:#2563eb;background:#eff6ff;border-style:solid}
.mv-ablage.sonstige{background:transparent;border-color:#cbd5e1}
.mv-ablage.sonstige.over{border-color:#64748b;background:#f1f5f9}
.mv-ablage-name{font-size:.8rem;font-weight:600;color:var(--fg,#334155);line-height:1.25}
.mv-ablage-zahl{font-size:1.3rem;font-weight:700;color:var(--muted);margin-top:2px}
.mv-ablage.over .mv-ablage-name,.mv-ablage.over .mv-ablage-zahl{color:#1d4ed8}
/* 🏷 Typ-Knopf im Medien-Bereich als Ablage-Ziel (Dateien darauf ziehen) */
.dam-chip.drop-ziel{outline:2px solid #2563eb;outline-offset:2px;background:#eff6ff;color:#1d4ed8;transform:scale(1.06)}
/* 👀 Während man Dateien zieht: Ablage-Ziele deutlich hervorheben */
.dam-side-hint{font-size:.68rem;font-weight:500;color:var(--muted);text-transform:none;letter-spacing:0;margin-left:6px}
.dam-chip.ziel-bereit{border-color:#2563eb;border-style:dashed;background:#eff6ff;color:#1d4ed8;font-weight:600}
body.dam-zieht .dam-side-hint{color:#1d4ed8;font-weight:700}
/* Hinweis, wo die Massen-Werkzeuge herkommen (erscheint nur ohne Auswahl) */
.dam-tipp{display:block;font-size:.76rem;color:#1d4ed8;background:#eff6ff;border:1px solid #bfdbfe;
  border-radius:8px;padding:6px 10px;margin-top:6px;line-height:1.45}

/* 📥 Ablage-Kacheln im Medien-Bereich (21.08.2026) — erscheinen, sobald links ein Bildtyp
   gedrückt ist: Bilder aus dem Raster darauf ziehen setzt den Typ sofort, auch in Menge. */
.dam-ablagen{display:block;margin:4px 0 14px;padding:10px 12px;border:1px solid var(--border);border-radius:14px;background:var(--card,#fff)}
.dam-ablagen-titel{font-size:.82rem;font-weight:600;color:var(--muted);margin-bottom:8px}
.mv-ablage.aktiv{border-style:solid;border-color:#2563eb;background:#eff6ff}
/* Zwei Gruppen nebeneinander: links gross die Produkt-Arten, rechts kompakt die seltenen.
   Die Breite wird voll ausgenutzt — alles bleibt in einer Zeile. */
.mv-ablagen-zwei{display:flex;gap:18px;align-items:flex-start;width:100%}
.mv-ablagen-spalte{flex:1 1 auto;min-width:0}
/* die seltenen kleben am rechten Rand — dazwischen bleibt Luft, die Breite ist voll genutzt */
.mv-ablagen-spalte.schmal{flex:0 0 auto;margin-left:auto;padding-left:18px;border-left:1px dashed var(--border)}
.mv-ablagen-label{font-size:.7rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  color:var(--muted);margin:0 0 6px 2px}
.mv-ablagen-reihe{display:flex;gap:8px;flex-wrap:wrap}
.mv-ablagen-reihe.haupt .mv-ablage{flex:1 1 0;min-width:120px;max-width:260px;padding:14px 10px}
.mv-ablagen-reihe.neben .mv-ablage{flex:0 0 auto;min-width:84px;padding:9px 8px}
.mv-ablagen-reihe.neben .mv-ablage-name{font-size:.74rem}
.mv-ablagen-reihe.neben .mv-ablage-zahl{font-size:.9rem}
.mv-ablage-zahl.pfeil{font-size:1.1rem;color:var(--muted);font-weight:700;opacity:.65}
.mv-ablage.over .mv-ablage-zahl.pfeil{color:#1d4ed8;opacity:1}