/* kambas.css v14.9 – komplett neu */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{height:100%}
body{height:100%;font-family:var(--font-body,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif);
  font-size:14px;background:var(--bg);color:var(--text);line-height:1.5;
  -webkit-font-smoothing:antialiased}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ── Flex-Chain ──────────────────────────────────────── */
.shell{height:100vh;display:flex;flex-direction:column;overflow:hidden}
nav.sidebar{flex-shrink:0;height:48px;display:flex;align-items:center;
  padding:0 16px;gap:16px;background:var(--surface);
  border-bottom:1px solid var(--border);z-index:100;position:relative}
main.content{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column}

/* ── Top-Nav ──────────────────────────────────────── */
.nav-logo{display:flex;align-items:center;gap:10px;flex-shrink:0}
.nav-brand{font-family:var(--font-display,inherit);font-size:14px;font-weight:600;color:var(--text);white-space:nowrap;max-width:200px;overflow:hidden;text-overflow:ellipsis}
.nav-links{display:flex;align-items:center;gap:2px;flex:1;overflow-x:auto;scrollbar-width:none}
.nav-links::-webkit-scrollbar{display:none}
.nav-links a{display:flex;align-items:center;gap:5px;padding:5px 10px;border-radius:6px;
  color:var(--muted);text-decoration:none;font-size:13px;white-space:nowrap;transition:all .12s}
.nav-links a:hover{color:var(--text);background:rgba(255,255,255,.06)}
.nav-links a.active{color:var(--text);background:rgba(255,255,255,.1);font-weight:500}
.nav-section{font-size:10px;text-transform:uppercase;letter-spacing:.06em;
  color:var(--muted);padding:0 8px;opacity:.6}
.nav-footer{display:flex;align-items:center;gap:12px;margin-left:auto;flex-shrink:0}
.nav-footer a,.nav-footer span{font-size:12px;color:var(--muted);text-decoration:none}
.nav-footer a:hover{color:var(--text)}
.dsgvo-warn{background:#7f1d1d;color:#fecaca;font-size:12px;
  text-align:center;padding:4px;flex-shrink:0}

/* Mobile nav */
.sidebar-toggle{display:none;background:none;border:none;cursor:pointer;
  color:var(--text);font-size:20px;padding:4px 8px}
.sidebar-overlay{display:none}
@media(max-width:768px){
  .nav-links .nav-section,.nav-links a:not(.active){display:none}
  .sidebar-toggle{display:none}
  nav.sidebar.open .nav-links{display:flex;flex-direction:column;position:fixed;
    top:48px;left:0;width:220px;height:calc(100% - 48px);background:var(--surface);
    border-right:1px solid var(--border);padding:12px 8px;z-index:200;overflow-y:auto}
  nav.sidebar.open .nav-links a{display:flex}
  nav.sidebar.open .nav-links .nav-section{display:block}
  .sidebar-overlay.open{display:block;position:fixed;inset:0;
    top:48px;background:rgba(0,0,0,.4);z-index:199}
}

/* ── Buttons ─────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;
  border-radius:10px;border:1px solid var(--border);background:none;cursor:pointer;
  font-size:13px;color:var(--text);transition:all .15s;font-family:inherit;
  text-decoration:none;white-space:nowrap}
.btn:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.2)}
.btn-p{background:var(--accent)!important;color:#fff!important;border-color:transparent!important;
  box-shadow:0 0 0 rgba(0,0,0,0);transition:box-shadow .2s,transform .15s}
.btn-p:hover{opacity:.92!important;box-shadow:0 4px 18px var(--glow-accent)!important;transform:translateY(-1px)}
.btn-d{background:#dc2626!important;color:#fff!important;border-color:transparent!important}
.btn-d:hover{opacity:.88!important}
.btn-g{background:none;color:var(--muted)}
.btn-g:hover{color:var(--text)}
.btn-s{background:rgba(255,255,255,.05);color:var(--muted)}

/* ── Forms ──────────────────────────────────────── */
.form-group{display:flex;flex-direction:column;gap:5px;margin-bottom:14px}
.form-group label{font-size:12px;color:var(--muted);font-weight:500;letter-spacing:.02em}
.form-row{display:flex;gap:10px;flex-wrap:wrap}
.form-row .form-group{flex:1;min-width:160px}
input,select,textarea{width:100%;padding:8px 12px;background:var(--surface);
  color:var(--text);border:1px solid var(--border);border-radius:8px;
  font-size:13px;font-family:inherit;outline:none;transition:border-color .15s}
input:focus,select:focus,textarea:focus{border-color:var(--accent)}
input::placeholder,textarea::placeholder{color:var(--muted)}
textarea{resize:vertical;min-height:80px}
select option{background:var(--surface)}
input[type=checkbox]{width:auto;accent-color:var(--accent)}

/* ── Cards / Page layout ─────────────────────────── */
.page{padding:20px 24px;flex:1;overflow-y:auto;min-height:0;
  background:
    radial-gradient(ellipse 900px 500px at 10% -5%, var(--mesh-accent) 0%, transparent 60%),
    radial-gradient(ellipse 700px 450px at 100% 15%, var(--mesh-accent2) 0%, transparent 55%),
    var(--bg);
  background-attachment:fixed}
.card{background:var(--surface);border:1px solid var(--border);
  border-radius:12px;padding:20px 24px;margin-bottom:16px;
  transition:transform .18s,box-shadow .18s,border-color .18s}
.card:hover{transform:translateY(-2px);box-shadow:0 8px 24px var(--glow-accent);border-color:color-mix(in srgb, var(--accent) 35%, var(--border))}
.card-title{font-family:var(--font-display,inherit);font-size:15px;font-weight:600;margin-bottom:16px;
  padding-bottom:12px;border-bottom:1px solid var(--border);color:var(--text)}
.page-header{display:flex;align-items:center;justify-content:space-between;
  margin-bottom:20px;gap:12px;flex-wrap:wrap}
.page-header h1{font-family:var(--font-display,inherit);font-size:18px;font-weight:600;color:var(--text)}

/* ── Tables ─────────────────────────────────────── */
.table-wrap{overflow-x:auto;border-radius:10px;border:1px solid var(--border)}
table{width:100%;border-collapse:collapse;font-size:13px}
thead th{background:rgba(255,255,255,.04);padding:10px 14px;text-align:left;
  font-weight:500;color:var(--muted);border-bottom:1px solid var(--border);
  white-space:nowrap}
tbody tr{border-bottom:1px solid var(--border);transition:background .1s}
tbody tr:last-child{border-bottom:none}
tbody tr:hover{background:rgba(255,255,255,.03)}
tbody td{padding:10px 14px;vertical-align:middle}

/* ── Badges & Alerts ─────────────────────────────── */
.badge{display:inline-block;padding:2px 8px;border-radius:20px;
  font-size:11px;font-weight:500;letter-spacing:.02em}
.badge.info,.badge.active,.badge.ok{background:rgba(34,197,94,.15);color:#4ade80}
.badge.warn,.badge.pending{background:rgba(234,179,8,.15);color:#facc15}
.badge.err,.badge.error,.badge.inactive{background:rgba(239,68,68,.15);color:#f87171}
.alert{padding:10px 14px;border-radius:8px;font-size:13px;margin-bottom:14px}
.alert-ok{background:rgba(34,197,94,.1);color:#4ade80;border:1px solid rgba(34,197,94,.2)}
.alert-err{background:rgba(239,68,68,.1);color:#f87171;border:1px solid rgba(239,68,68,.2)}
.ico{font-size:20px;opacity:.7}

/* ── Tab Nav ─────────────────────────────────────── */
.tab-nav{display:flex;gap:2px;border-bottom:1px solid var(--border);margin-bottom:20px}
.tab-link{padding:8px 16px;border:none;background:none;cursor:pointer;
  font-size:13px;color:var(--muted);border-bottom:2px solid transparent;
  margin-bottom:-1px;transition:all .12s;font-family:inherit}
.tab-link:hover{color:var(--text)}
.tab-link.active{color:var(--accent);border-bottom-color:var(--accent)}

/* ── Login ("Signal", 2026-07-01) ─────────────────── */
.login-wrap{display:flex;align-items:center;justify-content:center;
  height:100%;padding:20px;position:relative;overflow:hidden;
  background:
    radial-gradient(ellipse 900px 600px at 15% -10%, var(--mesh-accent) 0%, transparent 60%),
    radial-gradient(ellipse 700px 500px at 100% 100%, var(--mesh-accent2) 0%, transparent 55%),
    var(--bg)}
.login-pulse-bg{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  opacity:.12;pointer-events:none;z-index:0}
.login-box{position:relative;z-index:1;
  background:color-mix(in srgb, var(--surface) 60%, transparent);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid var(--border);
  border-radius:16px;padding:36px 32px;width:100%;max-width:380px;
  box-shadow:0 8px 48px var(--glow-accent),0 8px 40px rgba(0,0,0,.35)}
.login-claim{text-align:center;font-size:12.5px;color:var(--muted);
  margin-top:18px;min-height:34px;font-style:italic;transition:opacity .4s}

/* ── Chat: Flex-Chain ─────────────────────────────── */
.layout{display:flex;flex:1;overflow:hidden;min-height:0}
.chat-area{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}

/* ── Chat: Sidebar ────────────────────────────────── */
.ks{width:240px;flex-shrink:0;display:flex;flex-direction:column;
  background:var(--surface);border-right:1px solid var(--border)}
.ks-head{padding:12px 10px;border-bottom:1px solid var(--border);flex-shrink:0}
.ks-list{flex:1;overflow-y:auto;padding:6px 0}
.ci{display:flex;align-items:center;padding:9px 12px;cursor:pointer;
  border-radius:7px;margin:1px 6px;gap:6px;transition:background .1s}
.ci.active{background:rgba(255,255,255,.07)}@media(hover:hover){.ci:hover{background:rgba(255,255,255,.07)}}
.ci.active .ct{color:var(--text);font-weight:500}
.ct{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:12.5px;color:var(--muted)}
.cd{opacity:0;border:none;background:none;cursor:pointer;color:var(--muted);
  font-size:16px;padding:0 3px;transition:opacity .1s;line-height:1}
.ci:hover .cd{opacity:1}

/* ── Chat: Toolbar ────────────────────────────────── */
.ctb{display:flex;align-items:center;gap:8px;padding:8px 12px;
  border-bottom:1px solid var(--border);flex-shrink:0;min-height:48px}
.bbadge{font-size:11px;padding:3px 10px;border-radius:12px;
  background:var(--accent);color:#fff;font-weight:500;display:none}
.bbadge.on{display:inline-block}
.ctb-space{flex:1}

/* ── Chat: Messages ───────────────────────────────── */
.msgs{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:14px;
  scrollbar-width:thin;scrollbar-color:var(--border) transparent}
.msgs::-webkit-scrollbar{width:4px}
.msgs::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}

.mw{display:flex;flex-direction:column;max-width:80%;
  animation:msgIn .15s ease-out}
@keyframes msgIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.mw.user{align-self:flex-end;align-items:flex-end}
.mw.assistant,.mw.system-info{align-self:flex-start;align-items:flex-start}

.mb{padding:10px 14px;font-size:14px;line-height:1.65;word-break:break-word}
.mb.user{background:var(--accent);color:#fff;border-radius:16px 16px 4px 16px}
.mb.assistant{background:var(--surface);border:1px solid var(--border);
  border-radius:4px 16px 16px 16px}
.mb.system-info{font-size:12px;color:var(--muted);padding:2px 0;
  background:none;border:none;font-style:italic}
.mb p{margin:0 0 10px}.mb p:last-child{margin:0}
.mb ul,.mb ol{padding-left:20px;margin:6px 0}
.mb li{margin:3px 0}
.mb pre{background:rgba(0,0,0,.3);border:1px solid var(--border);
  border-radius:8px;padding:12px;overflow-x:auto;font-size:12px;margin:8px 0}
.mb code{font-size:12.5px;background:rgba(0,0,0,.2);padding:1px 5px;border-radius:4px}
.mb pre code{background:none;padding:0}
.mb h1,.mb h2,.mb h3{margin:10px 0 4px;font-size:15px}
.mb a{color:var(--accent);text-decoration:none}
.mb a:hover{text-decoration:underline}
.mb table{border-collapse:collapse;font-size:12px;margin:8px 0}
.mb th,.mb td{border:1px solid var(--border);padding:5px 10px}

.msrc{font-size:11px;color:var(--muted);margin-top:6px;
  padding-top:6px;border-top:1px solid rgba(255,255,255,.08)}
.msrc a{color:var(--muted);text-decoration:underline}

/* Typing dots */
#ki-typing .mb{padding:12px 16px}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;
  background:var(--muted);animation:tdot .9s infinite;margin:0 2px}
.dot:nth-child(2){animation-delay:.15s}.dot:nth-child(3){animation-delay:.3s}
@keyframes tdot{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-5px)}}

/* Mbar */
.mbar{display:flex;gap:3px;margin-top:5px;opacity:0;transition:opacity .15s}
.mw:hover .mbar,.mbar.rated{opacity:1}
.mab{background:none;border:1px solid var(--border);cursor:pointer;
  font-size:11px;padding:2px 8px;border-radius:6px;color:var(--muted);
  transition:all .1s;font-family:inherit}
.mab:hover{color:var(--text);border-color:rgba(255,255,255,.3)}

/* ── Chat: Input area ─────────────────────────────── */
.inp-area{flex-shrink:0;padding:10px 16px 12px;background:var(--bg);
  border-top:1px solid var(--border)}
.inp-top{display:flex;gap:8px;align-items:center;margin-bottom:8px;flex-wrap:wrap}
.inp-row{display:flex;gap:8px;align-items:flex-end;background:var(--surface);
  border:1.5px solid var(--border);border-radius:14px;padding:8px 12px;
  transition:border-color .15s}
.inp-row:focus-within{border-color:var(--accent)}
.inp-row textarea{flex:1;background:none;border:none;outline:none;
  resize:none;font-size:14px;color:var(--text);line-height:1.55;
  font-family:inherit;max-height:180px;padding:2px 4px;min-height:24px}
.inp-row textarea::placeholder{color:var(--muted)}
.inp-btns{display:flex;gap:4px;align-items:flex-end;flex-shrink:0}

.ub-btn{cursor:pointer;font-size:18px;padding:3px 7px;color:var(--muted);
  border:1px solid var(--border);border-radius:7px;transition:all .12s;
  background:none;display:inline-flex;align-items:center}
.ub-btn:hover{color:var(--text);border-color:rgba(255,255,255,.3)}

.ks-sel{background:var(--surface);color:var(--text);border:1px solid var(--border);
  border-radius:7px;font-size:12px;padding:5px 8px;cursor:pointer;
  font-family:inherit;outline:none;transition:border-color .12s}
.ks-sel:focus{border-color:var(--accent)}

.kb{background:none;border:1px solid var(--border);cursor:pointer;font-size:13px;
  padding:6px 11px;border-radius:8px;color:var(--muted);transition:all .12s;
  font-family:inherit;white-space:nowrap;display:inline-flex;align-items:center;gap:4px}
.kb:hover{color:var(--text);border-color:rgba(255,255,255,.3)}
.kb-p{background:var(--accent);color:#fff;border:none;cursor:pointer;
  font-size:13px;padding:7px 18px;border-radius:8px;font-family:inherit;
  transition:opacity .12s;white-space:nowrap}
.kb-p:hover{opacity:.88}
.kb-d{background:#dc2626;color:#fff;border:none;cursor:pointer;
  font-size:13px;padding:7px 14px;border-radius:8px;font-family:inherit}

.mic-active{color:var(--accent)!important;border-color:var(--accent)!important}

.disclaimer{font-size:11px;color:var(--muted);text-align:center;
  margin:6px 0 0;line-height:1.4}
.disclaimer a{color:var(--muted);text-decoration:underline}

/* ── Save menu ────────────────────────────────────── */
.smenu{position:fixed;z-index:500;background:var(--surface);
  border:1px solid var(--border);border-radius:10px;
  min-width:164px;padding:4px 0;
  box-shadow:0 8px 30px rgba(0,0,0,.4)}
.smh,.smsep{font-size:10px;text-transform:uppercase;letter-spacing:.05em;
  color:var(--muted);padding:8px 14px 4px;cursor:default}
.smsep{border-top:1px solid var(--border)}
.smi{padding:8px 14px;font-size:13px;cursor:pointer;color:var(--text);
  transition:background .1s}
.smi:hover{background:rgba(255,255,255,.06)}

/* ── Overlays ─────────────────────────────────────── */
.kov{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:299}
.kov.on{display:block}
.panel-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:400}
.panel-overlay.on{display:block}

/* ── Mobile Chat ──────────────────────────────────── */
@media(max-width:768px){
  #histBtn{display:flex!important}
  .ks{display:none!important;position:fixed!important;top:48px!important;left:0!important;
    height:calc(100% - 48px)!important;width:260px!important;z-index:300!important;
    overflow-y:auto!important}
  .ks.open{display:flex!important}
  .msgs{padding:12px 10px}
  .mw{max-width:92%}
  .page{padding:12px}
}
@media(min-width:769px){
  #histBtn{display:none!important}
  .ks{display:flex!important}
}

/* ── Daumen-Farben per Klasse ─────────────────────── */
.mab.rated-up{color:#58a6ff!important;border-color:#58a6ff!important}
.mab.rated-dn{color:#f87171!important;border-color:#f87171!important}

/* ── Theme-Toggle Button (alle Seiten) ───────────────*/
.theme-btn{background:none;border:1px solid var(--border);cursor:pointer;
  font-size:15px;padding:4px 9px;border-radius:7px;color:var(--muted);
  transition:all .12s;line-height:1}
.theme-btn:hover{color:var(--text);border-color:rgba(255,255,255,.3)}

/* ── Scroll-Fix fuer System-Seiten ────────────────── */
main.content{overflow-y:auto}
.page{overflow-y:auto;max-height:100%}

/* ── Mic / Speaker Pulse-Animation ───────────────── */
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(88,166,255,.5)}
  50%{box-shadow:0 0 0 6px rgba(88,166,255,0)}}
.mic-active{color:var(--accent)!important;border-color:var(--accent)!important;
  animation:pulse 1.2s infinite}
@keyframes pulse-g{0%,100%{box-shadow:0 0 0 0 rgba(63,185,80,.5)}
  50%{box-shadow:0 0 0 6px rgba(63,185,80,0)}}
.spk-active{color:#3fb950!important;border-color:#3fb950!important;
  animation:pulse-g 1s infinite}

/* ── Daumen Toggle-Feedback ───────────────────────── */
.mab.rated-up{color:#58a6ff!important;border-color:#58a6ff!important;
  background:rgba(88,166,255,.12)!important}
.mab.rated-dn{color:#f87171!important;border-color:#f87171!important;
  background:rgba(248,113,113,.12)!important}

/* ── Quellenangaben ────────────────────────────────── */
.msg-sources{margin-top:4px;font-size:11px}
.msg-sources-toggle{background:none;border:1px solid var(--border);
  color:var(--muted);border-radius:4px;padding:2px 8px;cursor:pointer;
  font-size:11px;font-family:inherit;transition:all .12s}
.msg-sources-toggle:hover{color:var(--text);border-color:var(--accent)}
.msg-sources-list{display:none;margin-top:4px;padding:6px 8px;
  background:rgba(255,255,255,.03);border:1px solid var(--border);
  border-radius:6px;max-width:420px}
.msg-sources.open .msg-sources-list{display:block}
.msg-source-item{padding:3px 0;color:var(--muted);display:flex;
  align-items:baseline;gap:6px;border-bottom:1px solid rgba(255,255,255,.04)}
.msg-source-item:last-child{border-bottom:none}
.msg-source-item a{color:var(--accent);text-decoration:none;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;max-width:320px}
.msg-source-item a:hover{text-decoration:underline}
.msg-source-type{font-size:9px;background:var(--border);border-radius:3px;
  padding:1px 4px;flex-shrink:0;white-space:nowrap}
.msg-source-bereich{font-size:9px;color:var(--muted);opacity:.7}

/* ── Konfidenz-Anzeige ─────────────────────────────── */
.msg-confidence{font-size:10px;color:var(--muted);margin-top:2px;
  display:flex;align-items:center;gap:4px}
.msg-confidence-bar{height:3px;border-radius:2px;background:var(--accent);
  opacity:.6;min-width:20px;max-width:80px}

/* ── Inkognito-Modus ───────────────────────────────── */
.incognito-active{border-color:var(--accent)!important;
  background:rgba(88,166,255,.12)!important;color:var(--accent)!important}
.incognito-hint{font-size:11px;color:var(--accent);padding:3px 8px;
  border-radius:4px;background:rgba(88,166,255,.1);
  border:1px solid rgba(88,166,255,.2)}

/* ── Lokaler Server-Banner ─────────────────────────── */
.local-banner{display:flex;align-items:center;gap:8px;padding:6px 16px;
  background:rgba(63,185,80,.1);border-bottom:1px solid rgba(63,185,80,.25);
  font-size:12px;color:#3fb950;flex-shrink:0}
.local-banner-text{flex:1}
.local-banner-btn,.local-banner-close{background:none;border:none;
  cursor:pointer;color:#3fb950;font-size:14px;padding:2px 6px;
  border-radius:4px;opacity:.8;transition:.12s}
.local-banner-btn:hover,.local-banner-close:hover{opacity:1;
  background:rgba(63,185,80,.15)}

/* ── Befehl-Autocomplete ───────────────────────────── */
.cmd-dropdown{position:absolute;bottom:100%;left:0;right:0;
  background:var(--surface);border:1px solid var(--border);
  border-radius:8px 8px 0 0;max-height:200px;overflow-y:auto;
  box-shadow:0 -4px 16px rgba(0,0,0,.35);z-index:200}
.cmd-item{padding:7px 12px;cursor:pointer;display:flex;
  align-items:baseline;gap:10px;font-size:13px;
  border-bottom:1px solid rgba(255,255,255,.04)}
.cmd-item:last-child{border-bottom:none}
.cmd-item:hover,.cmd-item.active{background:rgba(88,166,255,.1);
  color:var(--text)}
.cmd-key{color:var(--accent);font-family:monospace;flex-shrink:0;font-weight:500}
.cmd-desc{color:var(--muted);font-size:11px;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}

/* ── Prompt-Editor Navigation ───────────────────────── */
.pnav-sidebar{width:200px;flex-shrink:0;background:var(--surface);
  border:1px solid var(--border);border-radius:8px;padding:8px;overflow-y:auto}
.pnav-section{font-size:10px;text-transform:uppercase;letter-spacing:.08em;
  color:var(--muted);padding:6px 8px 2px;font-weight:600}
.pnav-link{display:block;padding:5px 10px;text-decoration:none;font-size:13px;
  border-radius:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  color:var(--text);transition:background .15s}
.pnav-link:hover{background:rgba(255,255,255,.05)}
.pnav-active{font-weight:600;color:var(--accent) !important;
  background:rgba(88,166,255,.08)}
.ptab{display:inline-block;padding:4px 14px;font-size:12px;font-weight:600;
  border-radius:6px 6px 0 0;border:1px solid var(--border);border-bottom:none;
  text-decoration:none;color:var(--muted);background:var(--bg)}
.ptab-active{color:var(--text);background:var(--surface)}
.prompt-ta{flex:1;resize:none;background:var(--bg);color:var(--text);
  border:1.5px solid var(--border);border-radius:8px;padding:12px;
  font-family:monospace;font-size:13px;line-height:1.6;outline:none;min-height:300px}

/* ── Dataflow-Modal ─────────────────────────────────── */
.df-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:300}
.df-panel{display:none;position:fixed;top:50%;left:50%;
  transform:translate(-50%,-50%);width:min(440px,92vw);background:var(--surface);
  border:1px solid var(--border);border-radius:12px;padding:24px;z-index:301;
  box-shadow:0 8px 40px rgba(0,0,0,.5)}
.df-header{display:flex;justify-content:space-between;margin-bottom:16px;
  align-items:center}
.df-title{font-size:15px;font-weight:600}
.df-close{background:none;border:none;font-size:22px;cursor:pointer;
  color:var(--muted);line-height:1}
.df-body{font-size:13px;line-height:1.7;color:var(--text)}

/* ── PTT Pulse ───────────────────────────────────────── */
@keyframes pttPulse{0%,100%{box-shadow:0 0 0 0 rgba(248,113,113,.6)}50%{box-shadow:0 0 0 8px rgba(248,113,113,0)}}
.ptt-pulse{animation:pttPulse 0.8s ease infinite!important;background:rgba(248,113,113,.2)!important}

/* ── Print ───────────────────────────────────────────── */
@media print{
  body{background:#fff;color:#000;font-family:Georgia,serif}
  .sidebar,.adm-sidebar,#bottom-nav,.mbar,.msg-confidence,
  #sendBar,#sidebar,#sidebarOverlay,.sidebar-toggle,
  .adm-topbar,button,.btn,.nav-footer,#toast-container{display:none!important}
  .content,.main-col{margin:0;padding:0;max-width:100%}
  .mb{background:#fff!important;color:#000!important;border:none;box-shadow:none;padding:4px 0}
  .mw.user .mb{color:#333!important}
  .mw.assistant .mb{color:#000!important}
  .msg-ts{color:#666;font-size:10px}
  a{color:#000;text-decoration:underline}
  code,pre{background:#f5f5f5;color:#000;border:1px solid #ddd}
  .print-header{display:block!important}
}
.print-header{display:none}

/* ── Mobile Sidebar Additions ───────────────────────── */
.sidebar-close-btn{display:none}
@media(max-width:768px){
  .sidebar-close-btn{display:block;position:absolute;top:12px;right:12px;
    background:none;border:none;color:var(--text);font-size:20px;cursor:pointer;z-index:1001}
}
.nav-footer-mobile-back{display:none}
@media(max-width:768px){
  .nav-footer-mobile-back{display:block;padding:8px 16px;color:var(--accent);
    text-decoration:none;font-size:13px;border-top:1px solid var(--border)}
}

/* ── CI4U-Loader (Chat "denkt...") ───────────────────── */
.ci4u-loader{
  display:flex;align-items:center;justify-content:center;
  width:52px;height:52px;border-radius:50%;
  border:2px solid var(--accent);
  flex-shrink:0;
}
.ci4u-loader--lg{width:76px;height:76px}
.ci4u-loader--lg .ci4u-bars{height:30px;gap:5px}
.ci4u-loader--lg .ci4u-bars span{width:6px}
.ci4u-bars{display:flex;align-items:flex-end;gap:3px;height:20px}
.ci4u-bars span{width:4px;border-radius:2px;background:var(--accent2);animation:ci4u-bar 1.1s ease-in-out infinite}
.ci4u-bars span:nth-child(1){animation-delay:0s}
.ci4u-bars span:nth-child(2){animation-delay:0.15s}
.ci4u-bars span:nth-child(3){animation-delay:0.3s}
@keyframes ci4u-bar{0%,100%{height:6px}50%{height:20px}}
.ci4u-loader--lg .ci4u-bars span{animation-name:ci4u-bar-lg}
@keyframes ci4u-bar-lg{0%,100%{height:8px}50%{height:30px}}

/* Leerer Chat-Zustand: Vorschlags-Chips ("ist halt nur ein Chat"-Polish) */
.greeting-chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:16px;max-width:520px;margin-left:auto;margin-right:auto}
.greeting-chip{background:var(--surface);border:1px solid var(--border);color:var(--text);
  border-radius:20px;padding:8px 14px;font-size:12.5px;cursor:pointer;font-family:inherit;
  transition:border-color .15s,transform .15s}
.greeting-chip:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-1px)}

/* ── Pulse-Bars (Signature-Element, "Signal"-Redesign 2026-07-01) ──
   Wiederverwendbares Motiv fuer Sidebar-Aktiv-Marker, Login-Hintergrund,
   System-Health-Indikator. Einmal definiert, ueberall eingebunden statt
   dupliziert (siehe Sidebar/Login/Health in Phase 3-4). */
.ci4u-pulse{display:inline-flex;align-items:flex-end;gap:3px;flex-shrink:0}
.ci4u-pulse .bar{transform-origin:center;background:var(--accent2);border-radius:3px;
  animation:pulse-idle 1.8s ease-in-out infinite}
.ci4u-pulse .bar:nth-child(1){animation-delay:0s}
.ci4u-pulse .bar:nth-child(2){animation-delay:.2s}
.ci4u-pulse .bar:nth-child(3){animation-delay:.4s}
.ci4u-pulse--active .bar{animation-duration:.6s}
@keyframes pulse-idle{0%,100%{transform:scaleY(.5)}50%{transform:scaleY(1)}}
/* Klein: 1 Balken als aktiv-Marker links im Sidebar-Menuepunkt */
.ci4u-pulse--sm{width:3px;height:16px}
.ci4u-pulse--sm .bar{width:3px;height:16px}
/* Gross: gedaempfter Herzschlag im Login-Hintergrund */
.ci4u-pulse--xl .bar{width:14px;border-radius:7px}
.ci4u-pulse--xl .bar:nth-child(1){height:60px}
.ci4u-pulse--xl .bar:nth-child(2){height:110px}
.ci4u-pulse--xl .bar:nth-child(3){height:60px}
.ci4u-pulse--xl{animation:none;gap:10px}
.ci4u-pulse--xl .bar{animation-duration:5s}
@media(prefers-reduced-motion:reduce){
  .ci4u-pulse .bar,.ci4u-bars span{animation:none!important}
}
/* Dashboard-Hero-Equalizer (Phase "WOW", 2026-07-02) - viele duenne Balken,
   Delays werden pro Balken inline gesetzt (nicht ueber nth-child, da die
   Anzahl variabel ist je nach Anzahl aktiver Dienste) */
.hero-banner{position:relative;overflow:hidden;border-radius:16px;
  padding:28px 32px;margin-bottom:16px;min-height:120px;
  display:flex;flex-direction:column;justify-content:center;
  background:
    radial-gradient(ellipse 500px 300px at 20% 0%, var(--glow-accent) 0%, transparent 70%),
    radial-gradient(ellipse 400px 260px at 90% 100%, var(--glow-accent2) 0%, transparent 70%),
    var(--surface);
  border:1px solid var(--border)}
.hero-eq{position:absolute;inset:0;display:flex;align-items:flex-end;
  gap:4px;padding:0 32px 0;opacity:.55}
.hero-eq .bar{flex:1;min-width:2px;max-width:8px;border-radius:3px 3px 0 0;
  background:linear-gradient(to top, var(--accent2), color-mix(in srgb, var(--accent2) 40%, var(--accent)));
  animation:hero-eq-idle 2.4s ease-in-out infinite}
@keyframes hero-eq-idle{0%,100%{transform:scaleY(.25)}50%{transform:scaleY(1)}}
.hero-content{position:relative;z-index:1}
.hero-title{font-family:var(--font-display);font-size:1.7rem;font-weight:600;
  color:var(--text);margin-bottom:4px}
.hero-sub{font-size:.8rem;color:var(--muted)}
.hero-sub .ok-dot{display:inline-block;width:6px;height:6px;border-radius:50%;
  background:#3fb950;margin-right:5px;vertical-align:middle}
.hero-sub .warn-dot{background:#f59e0b}
@media(prefers-reduced-motion:reduce){.hero-eq .bar{animation:none!important;transform:scaleY(.6)}}
@media(max-width:768px){.hero-banner{padding:20px}.hero-eq{padding:0 20px}.hero-title{font-size:1.3rem}}

/* Stat-Kacheln: grosser Wert, winziges Label (Typo-Kontrast, Teil D) */
.stat-tile{background:var(--surface);border:1px solid var(--border);
  border-radius:10px;padding:14px 16px}
.stat-label{font-family:var(--font-body);font-size:.68rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.stat-value{font-family:var(--font-display);font-size:2rem;font-weight:600;
  color:var(--text);line-height:1}
.stat-value--accent{color:var(--accent2)}
.stat-sub{font-size:.72rem;color:var(--muted);margin-top:2px}
/* Nutzer-Toggle "Animationen reduzieren" (/my/settings) - zusaetzlich zur
   automatischen prefers-reduced-motion-Erkennung oben */
html.ui-reduce-motion *,html.ui-reduce-motion *::before,html.ui-reduce-motion *::after{
  animation-duration:.001ms!important;animation-iteration-count:1!important;
  transition-duration:.001ms!important;scroll-behavior:auto!important}

/* Nutzer-Toggle "Kompakte Sidebar" (/my/settings) */
html.ui-compact-sidebar .adm-link,html.ui-compact-sidebar .adm-link-disabled{padding:4px 16px 4px 20px;font-size:12.5px}
html.ui-compact-sidebar .adm-group-label{padding:6px 16px 3px}
html.ui-compact-sidebar .adm-sidebar-head{padding:10px 16px 7px}

/* ── Chat: Reiche Inhalte (Tabellen/Code/Quellen/TL;DR) ─────────
   "Charts im Chat + PDF-Export v1.0"-Nachfolge-Sprint, 2026-07-02 */

/* Tabellen */
.mb table.ci4u-table{border-collapse:collapse;width:100%;border-radius:10px;
  overflow:hidden;border:1px solid var(--border);margin:8px 0;font-size:13px}
.ci4u-table th{background:var(--bg);font-family:var(--font-display);
  font-size:.7rem;letter-spacing:.05em;text-transform:uppercase;
  color:var(--muted);padding:8px 12px;text-align:left;position:relative}
.ci4u-table td{font-family:var(--font-body);padding:7px 12px;
  border-top:1px solid var(--border)}
.ci4u-table td.numeric{font-family:var(--font-mono);text-align:right}
.ci4u-table tr:nth-child(even){background:rgba(255,255,255,.02)}
.ci4u-table th.sortable{cursor:pointer;user-select:none}
.ci4u-table th.sortable:hover{color:var(--text)}
.ci4u-table th.sortable::after{content:'⇅';opacity:.4;margin-left:5px;font-size:10px}
.ci4u-table th.sort-asc::after{content:'↑';opacity:1;color:var(--accent2)}
.ci4u-table th.sort-desc::after{content:'↓';opacity:1;color:var(--accent2)}
/* Bubbles mit reichen Inhalten (Tabelle/Code/TL;DR) muessen die Breite
   ihres Flex-Elternteils (.mw, bereits korrekt begrenzt) tatsaechlich
   respektieren - .mb selbst hat kein max-width (shrink-to-fit) und kann
   sonst durch das Zusammenspiel aus Canvas-Intrinsic-Groesse und Zeilen-
   umbruch-Timing breiter werden als sein Container (live auf 390px
   gefunden, 2026-07-02). Gezielt nur fuer Nachrichten mit diesen neuen
   Komponenten, um die bestehende Flex-Chain sonst unangetastet zu lassen. */
.mb:has(.tldr-bar),.mb:has(.ci4u-table-scroll),.mb:has(.ci4u-code){max-width:100%}

.ci4u-table-scroll{position:relative;overflow-x:auto;margin:8px 0;max-width:100%;
  -webkit-mask-image:linear-gradient(to right,#000 calc(100% - 24px),transparent 100%);
  mask-image:linear-gradient(to right,#000 calc(100% - 24px),transparent 100%)}
.ci4u-table-scroll:hover{-webkit-mask-image:none;mask-image:none}
.ci4u-table-scroll table.ci4u-table{margin:0}

/* Code-Bloecke */
.mb pre.ci4u-code{position:relative;background:var(--bg);border:1px solid var(--border);
  border-radius:10px;padding:0;overflow:hidden;margin:8px 0}
.mb pre.ci4u-code code{display:block;padding:12px 14px;overflow-x:auto;
  font-family:var(--font-mono);font-size:12.5px;line-height:1.5}
.code-bar{display:flex;justify-content:space-between;align-items:center;
  padding:5px 10px;background:var(--surface);border-bottom:1px solid var(--border)}
.code-lang{font-family:var(--font-mono);font-size:10px;text-transform:uppercase;
  letter-spacing:.06em;color:var(--muted)}
.code-copy-btn{background:none;border:1px solid var(--border);border-radius:6px;
  color:var(--muted);padding:2px 6px;cursor:pointer;display:flex;align-items:center;
  transition:color .15s,border-color .15s}
.code-copy-btn:hover{color:var(--accent2);border-color:var(--accent2)}

/* TL;DR-Leiste */
.tldr-bar{display:flex;justify-content:space-between;align-items:center;gap:10px;
  background:color-mix(in srgb, var(--accent) 10%, var(--surface));
  border:1px solid var(--border);border-radius:10px;padding:8px 12px;
  margin-bottom:8px;cursor:pointer;font-size:13px;min-width:0}
.tldr-bar:hover{border-color:var(--accent)}
.tldr-bar>span:first-child{min-width:0;overflow-wrap:break-word}
.tldr-toggle{font-size:11px;color:var(--accent2);white-space:nowrap;flex-shrink:0}
.tldr-body{margin-top:2px}

/* Quellen-Karten (ersetzt die frueheren grauen Linklisten) */
.msg-sources{margin-top:6px}
.msg-sources-toggle{background:none;border:1px solid var(--border);
  border-radius:14px;color:var(--muted);font-size:11px;padding:3px 10px;cursor:pointer}
.msg-sources-toggle:hover{color:var(--text);border-color:var(--accent)}
.msg-sources-list{display:none;margin-top:8px;gap:8px;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.msg-sources.open .msg-sources-list{display:grid}
.msg-source-card{background:var(--surface);border:1px solid var(--border);
  border-radius:10px;padding:10px 12px;font-size:12px;text-decoration:none;
  color:var(--text);display:flex;flex-direction:column;gap:4px;
  transition:border-color .15s,transform .15s}
a.msg-source-card:hover{border-color:var(--accent);transform:translateY(-1px)}
.msg-source-card-title{display:flex;align-items:center;gap:6px;font-weight:600;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.msg-source-card-snippet{color:var(--muted);font-size:11px;line-height:1.4;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.msg-source-card-meta{display:flex;justify-content:space-between;font-size:10px;
  color:var(--muted);margin-top:2px}
.msg-source-card-score{color:var(--accent2);font-weight:600}

@media(max-width:600px){
  .ci4u-table{font-size:12px}
  .msg-sources-list{grid-template-columns:1fr}
}