:root{
  --blue:#493EF2; --soft:#90AFFF; --khaki:#FFE0A3; --pink:#E9408F; --mint:#86D2B9;
  --ink:#14142b; --muted:#6b7280; --line:#e6e8f0; --bg:#f5f6fb; --card:#ffffff;
  --radius:12px; --shadow:0 1px 3px rgba(20,20,43,.08),0 6px 24px rgba(20,20,43,.05);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:Inter,system-ui,sans-serif;background:var(--bg);color:var(--ink);font-size:14px}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}

/* Header */
header{position:sticky;top:0;z-index:30;background:var(--blue);color:#fff;
  display:flex;align-items:center;gap:18px;padding:12px 22px;box-shadow:0 2px 14px rgba(73,62,242,.35)}
header .logo{font-weight:700;font-size:17px;letter-spacing:.2px;display:flex;align-items:center;gap:9px}
header .logo .dot{width:11px;height:11px;border-radius:50%;background:var(--khaki)}
header .meta{font-size:12px;color:rgba(255,255,255,.78);margin-left:6px}
header .spacer{flex:1}
.btn{border:none;border-radius:8px;padding:9px 16px;font-family:inherit;font-size:13px;font-weight:600;
  cursor:pointer;transition:.15s;display:inline-flex;align-items:center;gap:7px}
.btn-primary{background:var(--khaki);color:#1a1a2e}
.btn-primary:hover{background:#f5d070}
.btn-ghost{background:rgba(255,255,255,.16);color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.27)}
.btn-sm{padding:6px 11px;font-size:12px}
.btn-line{background:#fff;border:1px solid var(--line);color:var(--ink)}
.btn-line:hover{border-color:var(--blue);color:var(--blue)}
.btn[disabled]{opacity:.5;cursor:not-allowed}

/* Tabs */
nav.tabs{display:flex;gap:4px;background:#fff;padding:0 22px;border-bottom:1px solid var(--line);position:sticky;top:54px;z-index:20}
nav.tabs button{background:none;border:none;padding:14px 16px;font-family:inherit;font-size:14px;font-weight:600;
  color:var(--muted);cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px}
nav.tabs button.active{color:var(--blue);border-bottom-color:var(--blue)}
nav.tabs button:hover{color:var(--ink)}

main{padding:22px;max-width:1400px;margin:0 auto}
.view{display:none}
.view.active{display:block}
h2{font-size:18px;margin:0 0 14px}
.sub{color:var(--muted);font-size:13px;margin:-8px 0 18px}

/* KPI cards */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-bottom:20px}
.kpi{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 18px}
.kpi .v{font-size:28px;font-weight:700;line-height:1.1}
.kpi .l{color:var(--muted);font-size:12px;margin-top:4px}
.kpi .v.mint{color:#2f9e7d}.kpi .v.blue{color:var(--blue)}.kpi .v.pink{color:var(--pink)}

/* Charts */
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:900px){.grid2{grid-template-columns:1fr}}
.panel{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 18px;margin-bottom:16px}
.panel h3{margin:0 0 12px;font-size:14px}
.panel canvas{max-height:280px}

/* Explorer layout */
.explorer{display:grid;grid-template-columns:248px 1fr;gap:16px}
@media(max-width:880px){.explorer{grid-template-columns:1fr}}
.filters{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px;align-self:start;position:sticky;top:108px}
.filters .fg{margin-bottom:16px}
.filters label.h{display:block;font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);margin-bottom:7px}
.filters input[type=text],.filters input[type=number],.filters select{width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:8px;font-family:inherit;font-size:13px}
.filters input:focus,.filters select:focus{outline:none;border-color:var(--blue)}
.check{display:flex;align-items:center;gap:8px;margin:5px 0;font-size:13px;cursor:pointer}
.check input{accent-color:var(--blue)}
.bundes-list{max-height:190px;overflow:auto;border:1px solid var(--line);border-radius:8px;padding:8px}

/* Table */
.toolbar{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.toolbar .count{font-weight:600}
.toolbar .spacer{flex:1}
.tablewrap{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);overflow:auto}
table{width:100%;border-collapse:collapse;font-size:13px}
th,td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}
th{position:sticky;top:0;background:#fafbff;font-size:12px;color:var(--muted);cursor:pointer;user-select:none;z-index:1}
th:hover{color:var(--blue)}
tbody tr{cursor:pointer}
tbody tr:hover{background:#f7f8ff}
td.name{white-space:normal;min-width:200px;font-weight:600}
.badge{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11px;font-weight:600}
.b-online{background:#e3f5ee;color:#2f9e7d}
.b-praesenz{background:#eef0fb;color:#4b50a6}
.b-khaki{background:#fff4dc;color:#9a6b16}
.score{font-weight:700}
.status-pill{font-size:11px;padding:2px 8px;border-radius:999px;background:var(--line);color:var(--muted)}
.status-offen{background:#eef0fb;color:#4b50a6}
.status-kontaktiert{background:#fff4dc;color:#9a6b16}
.status-qualifiziert{background:#e3f5ee;color:#2f9e7d}
.status-kein{background:#fde7f0;color:#b3306b}

/* Drawer */
.drawer-bg{position:fixed;inset:0;background:rgba(20,20,43,.4);opacity:0;pointer-events:none;transition:.2s;z-index:40}
.drawer-bg.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;height:100%;width:420px;max-width:92vw;background:#fff;box-shadow:-8px 0 30px rgba(0,0,0,.18);
  transform:translateX(100%);transition:.25s;z-index:41;display:flex;flex-direction:column}
.drawer.open{transform:none}
.drawer .dhead{background:var(--blue);color:#fff;padding:18px 20px}
.drawer .dhead h3{margin:0 0 4px;font-size:17px}
.drawer .dhead .x{position:absolute;top:14px;right:16px;cursor:pointer;color:#fff;font-size:20px;background:none;border:none}
.drawer .dbody{padding:20px;overflow:auto;flex:1}
.row{display:flex;gap:8px;margin:7px 0;font-size:13px}
.row .k{width:120px;color:var(--muted);flex-shrink:0}
.row .v{font-weight:500}
.drawer textarea{width:100%;min-height:70px;border:1px solid var(--line);border-radius:8px;padding:8px;font-family:inherit;font-size:13px;resize:vertical}
.drawer select{width:100%;padding:8px;border:1px solid var(--line);border-radius:8px;font-family:inherit;font-size:13px}
.divider{height:1px;background:var(--line);margin:16px 0}

/* Progress / toast */
#progress{display:none;align-items:center;gap:10px;font-size:12px;color:#fff}
#progress .bar{width:120px;height:6px;background:rgba(255,255,255,.3);border-radius:3px;overflow:hidden}
#progress .bar span{display:block;height:100%;background:var(--khaki);width:30%;animation:pulse 1.2s infinite}
@keyframes pulse{0%{opacity:.5}50%{opacity:1}100%{opacity:.5}}
#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;padding:11px 18px;border-radius:8px;font-size:13px;opacity:0;pointer-events:none;transition:.2s;z-index:60}
#toast.show{opacity:1}
.tip{cursor:help;border-bottom:1px dotted var(--muted)}

/* Vermittler-Finder Zusaetze */
.status-partner{background:#e3f5ee;color:#2f9e7d}
header .btn{white-space:nowrap}