/* ─── hub.alei.at · hub.css · v3 ───
   Warm Dark Theme · Raycast × Things 3 × Superhuman
   --v-css: 3;
*/

:root{
  --v-css:3;

  /* Warm Dark Base */
  --bg:#121417;
  --surface:#1A1D22;
  --sh:#22262E;
  --border:#2A2E38;
  --bl:#1E2128;

  /* Text hierarchy */
  --text:#E8E6E3;
  --tm:#8A8F9A;
  --td:#505667;

  /* Accent: warm blue (desaturated) */
  --ac:#6B9CF5;
  --acd:rgba(107,156,245,.10);

  /* Semantic */
  --gr:#34C46A;
  --grd:rgba(52,196,106,.10);
  --re:#E86060;
  --red:rgba(232,96,96,.10);
  --ye:#E8A030;
  --yed:rgba(232,160,48,.10);

  /* Focus accent: warm orange */
  --fo:#E89848;
  --fod:rgba(232,152,72,.10);

  /* Calendar colors (desaturated) */
  --cp:#D4A040;
  --cs:#6B9CF5;
  --ca:#E86060;
  --cr:#34C46A;
  --cf:#9878D0;

  /* Geometry */
  --r:14px;
  --rsm:8px;
  --rlg:16px;

  /* Typography */
  --font:'Outfit',sans-serif;
  --mono:'JetBrains Mono',monospace;
}

*{box-sizing:border-box;margin:0;padding:0}
html{font-size:14px}
body{background:var(--bg);color:var(--text);font-family:var(--font);min-height:100vh;line-height:1.5}
::selection{background:rgba(107,156,245,.25)}
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}

/* ── STATUS BAR ── */
#sb{
  position:sticky;top:0;z-index:100;
  background:rgba(18,20,23,.88);
  backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(42,46,56,.5);
  height:48px;padding:0 24px;
  display:flex;align-items:center;justify-content:space-between
}
.logo{font-family:var(--mono);font-size:13px;font-weight:500;letter-spacing:.06em;color:var(--tm)}
.logo span{color:var(--fo)}
.pills{display:flex;align-items:center;gap:8px;margin-left:16px}
.pill{display:flex;align-items:center;gap:5px;font-family:var(--mono);font-size:10px;color:var(--td);padding:3px 10px;border-radius:20px;background:rgba(42,46,56,.35)}
.pill .dot{width:5px;height:5px;border-radius:50%;background:var(--td);flex-shrink:0}
.pill.ok{color:var(--tm)}.pill.ok .dot{background:var(--gr)}
.pill.warn .dot{background:var(--ye)}.pill.warn{color:var(--ye)}
.pill.err .dot{background:var(--re)}.pill.err{color:var(--re)}
.vb{font-family:var(--mono);font-size:10px;color:var(--td);padding:3px 8px;border-radius:6px;background:rgba(42,46,56,.35)}

/* ── TAB BUTTONS ── */
.tab-btn{
  padding:6px 16px;border-radius:20px;
  font-family:var(--font);font-size:11px;font-weight:500;
  cursor:pointer;border:none;
  background:transparent;color:var(--tm);
  transition:all .2s
}
.tab-btn.active{background:var(--fo);color:#fff;box-shadow:0 2px 8px rgba(232,152,72,.25)}
.tab-btn:hover:not(.active){background:var(--sh);color:var(--text)}

/* ── LAYOUT ── */
#main{padding:16px 24px 70px;display:grid;grid-template-columns:370px 1fr;gap:14px;max-width:1600px;margin:0 auto}
.col{display:flex;flex-direction:column;gap:14px}

/* ── BOX (Widget Container) ── */
.box{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);overflow:hidden}
.bh{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 16px;cursor:pointer;user-select:none;
  border-bottom:1px solid transparent;
  transition:background .15s
}
.bh:hover{background:var(--sh)}
.bhl{display:flex;align-items:center;gap:8px}
.bi{width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:12px;border-radius:6px;background:var(--sh)}
.bt{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--tm)}
.bb{font-family:var(--mono);font-size:10px;color:var(--fo);background:var(--fod);padding:2px 8px;border-radius:20px}
.bc{font-size:9px;color:var(--td);transition:transform .2s}
.box.collapsed .bc{transform:rotate(-90deg)}
.box.collapsed .bdy{display:none}
.bdy{padding:14px 16px}
.bdy.sc{max-height:400px;overflow-y:auto}
.bdy.scl{max-height:580px;overflow-y:auto}

/* ── UTILS ── */
.sl{font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--td);margin-bottom:8px}
.empty{text-align:center;padding:24px;color:var(--td);font-size:12px}
@keyframes ldots{0%,20%{content:'.'}40%{content:'..'}60%,100%{content:'...'}}
.ld::after{content:'...';animation:ldots 1.2s infinite}

/* ── BUTTONS ── */
.btn{
  display:inline-flex;align-items:center;gap:4px;
  padding:6px 12px;border-radius:var(--rsm);
  font-family:var(--font);font-size:11px;font-weight:500;
  cursor:pointer;border:1px solid transparent;
  transition:all .15s;white-space:nowrap
}
.bg{background:var(--sh);border-color:var(--border);color:var(--tm)}
.bg:hover{background:var(--border);color:var(--text)}
.bp{background:var(--fo);border-color:var(--fo);color:#fff}
.bp:hover{opacity:.88}
.bd{background:transparent;border-color:transparent;color:var(--td)}
.bd:hover{background:var(--red);color:var(--re)}
.bsm{padding:4px 8px;font-size:10px}

/* ── COUNTDOWN (Hero Cards) ── */
.cdg{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.cdc{
  background:linear-gradient(135deg,var(--bg) 0%,var(--sh) 100%);
  border:1px solid var(--border);border-radius:var(--rlg);
  padding:14px 16px
}
.cdl{font-size:10px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;color:var(--tm);margin-bottom:4px}
.cdd{font-size:32px;font-weight:600;font-family:var(--mono);line-height:1;margin-bottom:4px}
.cdd.blue{color:var(--ac)}.cdd.yellow{color:var(--ye)}.cdd.red{color:var(--re)}
.cddate{font-size:10px;font-family:var(--mono);color:var(--td)}
.pb{height:3px;background:var(--bg);border-radius:3px;margin-top:8px;overflow:hidden}
.pbf{height:100%;border-radius:3px;transition:width .5s}
.pbf.blue{background:linear-gradient(90deg,var(--ac),rgba(107,156,245,.5))}.pbf.yellow{background:linear-gradient(90deg,var(--ye),rgba(232,160,48,.5))}.pbf.red{background:linear-gradient(90deg,var(--re),rgba(232,96,96,.5))}

/* ── TODOS ── */
.tl{display:flex;flex-direction:column;gap:4px}
.ti{display:flex;align-items:flex-start;gap:8px;padding:8px 10px;border-radius:var(--rsm);transition:background .1s}
.ti:hover{background:var(--sh)}.ti.done{opacity:.35}
.chk{width:16px;height:16px;border-radius:4px;border:1.5px solid var(--border);flex-shrink:0;margin-top:1px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:9px;color:#fff;transition:all .15s}
.chk:hover{border-color:var(--fo)}.chk.on{background:var(--fo);border-color:var(--fo)}
.tt{font-size:12px;flex:1;line-height:1.45}
.ti.done .tt{text-decoration:line-through;color:var(--td)}
.pr{font-size:9px;font-family:var(--mono);padding:2px 6px;border-radius:4px;flex-shrink:0;margin-top:1px}
.pr.high{background:var(--red);color:var(--re)}
.pr.mid{background:var(--yed);color:var(--ye)}
.pr.low{background:var(--sh);color:var(--td)}
.ta{display:flex;gap:6px;margin-top:8px}
.ta input{
  flex:1;background:var(--bg);border:1px solid var(--border);border-radius:var(--rsm);
  padding:7px 11px;font-family:var(--font);font-size:12px;color:var(--text);
  outline:none;transition:border-color .2s
}
.ta input:focus{border-color:var(--fo)}.ta input::placeholder{color:var(--td)}

/* ── CALENDAR ── */
.ng-wrap{overflow:hidden;border-radius:var(--rsm)}
.ng-head{display:grid;grid-template-columns:32px repeat(7,1fr);gap:1px;background:var(--bl)}
.ng-hc{background:var(--surface);padding:6px 2px;text-align:center}
.ng-hc.todh{background:var(--acd);box-shadow:inset 0 -2px 0 var(--ac)}
.ng-dn{font-size:9px;font-weight:600;text-transform:uppercase;color:var(--td);letter-spacing:.04em}
.ng-dd{font-size:15px;font-family:var(--mono);font-weight:500;color:var(--text);line-height:1.3}
.ng-hc.todh .ng-dn,.ng-hc.todh .ng-dd{color:var(--ac)}
.ng-allday{display:grid;grid-template-columns:32px repeat(7,1fr);gap:1px;background:var(--bl)}
.ng-adc{background:var(--surface);padding:3px 3px;min-height:18px}
.ng-adc.todc{background:var(--acd)}
.ng-body{display:flex}
.ng-taxis{width:32px;flex-shrink:0;background:var(--surface);border-right:1px solid var(--bl);position:relative}
.ng-days{flex:1;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:1px;background:var(--bl)}
.ng-day{background:var(--surface);position:relative}
.ng-day.todc{background:rgba(107,156,245,.04)}
.ng-hline{position:absolute;left:0;right:0;border-top:1px solid var(--bl);pointer-events:none}

/* Calendar events – softer, more rounded */
.ng-ev{
  position:absolute;border-radius:var(--rsm);
  padding:2px 5px;overflow:hidden;
  border-left:3px solid;font-size:9px;line-height:1.3;
  cursor:default;z-index:1;min-width:0;
  transition:filter .15s,z-index 0s
}
.ng-ev:hover{z-index:10;filter:brightness(1.15)}
.ng-ev.privat{background:rgba(212,160,64,.15);border-color:var(--cp)}
.ng-ev.schule{background:rgba(107,156,245,.15);border-color:var(--cs)}
.ng-ev.aufgaben{background:rgba(232,96,96,.15);border-color:var(--ca)}
.ng-ev.redner{background:rgba(52,196,106,.15);border-color:var(--cr)}
.ng-ev.family{background:rgba(152,120,208,.15);border-color:var(--cf)}
.ng-ev-t{font-size:8px;font-family:var(--mono);opacity:.7;white-space:nowrap;overflow:hidden}
.ng-ev-n{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Calendar toolbar */
.ctb{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;flex-wrap:wrap;gap:8px}
.cnav{display:flex;align-items:center;gap:5px}
.ctitle{font-size:11px;font-weight:500;min-width:120px;text-align:center;font-family:var(--mono)}
.vt{display:flex;gap:2px;background:var(--bg);border:1px solid var(--border);border-radius:var(--rsm);padding:3px}
.vbtn{padding:3px 10px;border-radius:6px;font-size:11px;font-weight:500;cursor:pointer;border:none;background:transparent;color:var(--td);font-family:var(--font);transition:all .15s}
.vbtn.active{background:var(--sh);color:var(--text)}

/* Calendar filter pills (soft) */
.cfs{display:flex;gap:5px;margin-bottom:10px;flex-wrap:wrap}
.cf{display:flex;align-items:center;gap:5px;padding:3px 10px;border-radius:20px;font-size:10px;cursor:pointer;border:none;background:var(--sh);color:var(--tm);transition:all .15s;user-select:none}
.cf.privat{background:rgba(212,160,64,.12);color:var(--cp)}
.cf.schule{background:rgba(107,156,245,.12);color:var(--cs)}
.cf.aufgaben{background:rgba(232,96,96,.12);color:var(--ca)}
.cf.redner{background:rgba(52,196,106,.12);color:var(--cr)}
.cf.family{background:rgba(152,120,208,.12);color:var(--cf)}
.cf.off{opacity:.22}
.cfd{width:6px;height:6px;border-radius:50%}
.cf.privat .cfd{background:var(--cp)}.cf.schule .cfd{background:var(--cs)}.cf.aufgaben .cfd{background:var(--ca)}.cf.redner .cfd{background:var(--cr)}.cf.family .cfd{background:var(--cf)}

/* Calendar list */
.cl{display:flex;flex-direction:column}
.cld{display:grid;grid-template-columns:52px 1fr;gap:8px;padding:6px 0;border-bottom:1px solid var(--bl)}
.cld:last-child{border-bottom:none}
.cldl{display:flex;flex-direction:column;align-items:flex-end;padding-right:8px;border-right:1px solid var(--border)}
.cldname{font-size:9px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--td)}
.cldnum{font-size:16px;font-family:var(--mono);font-weight:500;color:var(--text);line-height:1}
.cld.tod .cldnum,.cld.tod .cldname{color:var(--ac)}
.clevs{display:flex;flex-direction:column;gap:3px;padding-top:2px}
.clev{display:flex;align-items:center;gap:5px;padding:3px 8px;border-radius:6px;font-size:11px;border-left:3px solid;background:rgba(255,255,255,.02)}
.clev.privat{border-color:var(--cp)}.clev.schule{border-color:var(--cs)}.clev.aufgaben{border-color:var(--ca)}.clev.redner{border-color:var(--cr)}.clev.family{border-color:var(--cf)}
.clevt{font-size:9px;font-family:var(--mono);color:var(--tm);min-width:70px;flex-shrink:0}

/* Calendar month */
.cm{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--bl);border-radius:var(--rsm);overflow:hidden}
.cmdow{background:var(--surface);padding:5px 2px;text-align:center;font-size:9px;font-weight:600;text-transform:uppercase;color:var(--td);letter-spacing:.04em}
.cmc{background:var(--surface);padding:5px 6px;min-height:56px;cursor:pointer;transition:background .1s}
.cmc:hover{background:var(--sh)}.cmc.todm{background:var(--acd)}.cmc.oth{opacity:.2}
.cmdnum{font-size:10px;font-family:var(--mono);font-weight:500;margin-bottom:3px}
.cmc.todm .cmdnum{color:var(--ac)}
.cmev{font-size:9px;padding:2px 4px;border-radius:4px;margin-bottom:2px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.cmev.privat{background:rgba(212,160,64,.15);color:var(--cp)}.cmev.schule{background:rgba(107,156,245,.15);color:var(--cs)}
.cmev.aufgaben{background:rgba(232,96,96,.15);color:var(--ca)}.cmev.redner{background:rgba(52,196,106,.15);color:var(--cr)}.cmev.family{background:rgba(152,120,208,.15);color:var(--cf)}

/* ── PRIORITY BADGES ── */
.eprio{display:inline-flex;align-items:center;gap:4px;font-size:9px;font-family:var(--mono);padding:3px 8px;border-radius:6px;font-weight:600;letter-spacing:.04em;white-space:nowrap;flex-shrink:0}
.eprio.high{background:var(--red);color:var(--re)}
.eprio.mid{background:var(--yed);color:var(--ye)}
.eprio.low{background:var(--sh);color:var(--td)}

/* ── EMAIL GROUPS ── */
.eg{margin-bottom:8px;border:1px solid var(--border);border-radius:var(--rsm);overflow:hidden}
.eg:last-child{margin-bottom:0}
.eg-hd{display:flex;align-items:center;gap:8px;padding:9px 12px;cursor:pointer;background:var(--bg);user-select:none;transition:background .15s}
.eg-hd:hover{background:var(--sh)}
.eg-title{font-size:11px;font-weight:600;flex:1}
.eg-meta{font-size:10px;font-family:var(--mono);color:var(--tm)}
.eg-unread{font-size:10px;font-family:var(--mono);padding:2px 7px;border-radius:10px;background:var(--fo);color:#fff}
.eg-chev{font-size:9px;color:var(--td);transition:transform .2s}
.eg.closed .eg-chev{transform:rotate(-90deg)}
.eg.closed .eg-body{display:none}
.eg-body{border-top:1px solid var(--border)}

/* ── EMAIL CARD ── */
.ecard{padding:11px 14px;border-bottom:1px solid var(--bl);transition:opacity .3s}
.ecard:last-child{border-bottom:none}
.ecard.fading{opacity:0;pointer-events:none}
.ec-hd{display:flex;align-items:flex-start;gap:8px;margin-bottom:3px}
.ec-from{font-size:12px;font-weight:500;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ec-date{font-size:10px;font-family:var(--mono);color:var(--tm);flex-shrink:0}
.ec-subj{font-size:11px;color:var(--tm);margin-bottom:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ec-sum{font-size:11px;color:var(--text);line-height:1.45;margin-bottom:5px}
.ec-rec{font-size:11px;color:var(--fo);line-height:1.45;margin-bottom:8px;padding-left:12px;border-left:2px solid var(--fo)}
.ec-acts{display:flex;gap:4px;flex-wrap:wrap;align-items:center}

/* ── FOLDER DROPDOWN ── */
.folder-dd{position:relative;display:inline-block}
.folder-menu{position:absolute;top:100%;left:0;margin-top:4px;background:var(--surface);border:1px solid var(--border);border-radius:var(--rsm);padding:4px;z-index:50;min-width:170px;max-height:200px;overflow-y:auto;box-shadow:0 8px 24px rgba(0,0,0,.5);display:none}
.folder-menu.open{display:block}
.folder-item{padding:6px 10px;font-size:11px;cursor:pointer;border-radius:6px;white-space:nowrap;transition:background .1s}
.folder-item:hover{background:var(--sh)}
.folder-item.suggested{color:var(--fo)}

/* ── KI STATS ── */
.ksg{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.ksc{background:var(--bg);border:1px solid var(--border);border-radius:var(--rsm);padding:10px 12px}
.ksl{font-size:10px;color:var(--tm);margin-bottom:3px;font-weight:500}
.ksv{font-size:20px;font-family:var(--mono);font-weight:500}
.ksv.blue{color:var(--ac)}.ksv.green{color:var(--gr)}
.kss{font-size:10px;font-family:var(--mono);color:var(--td)}
.model-opt.active{background:var(--fo);border-color:var(--fo);color:#fff}

/* ── TASKS (Tests & Aufgaben) ── */
.taskitem{display:flex;align-items:flex-start;gap:8px;padding:8px 10px;border-radius:var(--rsm);margin-bottom:4px;background:var(--bg);border:1px solid var(--border)}
.taskdl{font-size:10px;font-family:var(--mono);flex-shrink:0;line-height:1.4;color:rgba(232,96,96,.55)}
.taskdl.soon{color:rgba(232,96,96,.75)}.taskdl.urgent{color:var(--re);font-weight:600}
.tasktitle{flex:1;font-size:12px;color:rgba(232,96,96,.7)}
.taskdl.soon~.tasktitle{color:rgba(232,96,96,.85)}.taskdl.urgent~.tasktitle{color:var(--re)}

/* ── FLOATING CHAT ── */
#chat-float{position:fixed;bottom:20px;right:20px;z-index:150;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
#chat-panel{width:380px;height:470px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:0 12px 40px rgba(0,0,0,.5);display:none;flex-direction:column;overflow:hidden;transform-origin:bottom right}
#chat-panel.open{display:flex;animation:chatpop .2s ease}
@keyframes chatpop{from{transform:scale(.95) translateY(8px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}
#chat-tog{padding:8px 14px;border-radius:24px;background:var(--surface);border:1px solid var(--border);color:var(--tm);font-size:11px;font-family:var(--font);font-weight:500;cursor:pointer;display:flex;align-items:center;gap:6px;box-shadow:0 4px 16px rgba(0,0,0,.35);transition:all .2s}
#chat-tog:hover{background:var(--sh);color:var(--text);border-color:var(--fo)}
#chat-tog .ctdot{width:7px;height:7px;border-radius:50%;background:var(--fo)}
.cph{display:flex;align-items:center;gap:8px;padding:10px 16px;border-bottom:1px solid var(--border);flex-shrink:0;background:var(--sh)}
.cpt{font-size:12px;font-weight:600;flex:1}
.cptok{font-size:10px;font-family:var(--mono);color:var(--td)}
.cpx{background:none;border:none;color:var(--tm);cursor:pointer;font-size:14px;padding:2px;line-height:1}
.cpx:hover{color:var(--text)}
.chat-msgs{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:10px;padding:12px 12px 0}
.cmsg{display:flex;gap:7px;max-width:90%}
.cmsg.user{align-self:flex-end;flex-direction:row-reverse}
.cav{width:22px;height:22px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:8px;font-weight:600;flex-shrink:0;background:var(--sh);color:var(--tm)}
.cmsg.user .cav{background:var(--fo);color:#fff}
.cbu{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:8px 12px;font-size:12px;line-height:1.5}
.cmsg.user .cbu{background:var(--fod);border-color:rgba(232,152,72,.2)}
.cia{display:flex;gap:6px;align-items:flex-end;padding:8px 12px;border-top:1px solid var(--border);flex-shrink:0}
.cin{flex:1;background:var(--bg);border:1px solid var(--border);border-radius:var(--rsm);padding:8px 12px;font-family:var(--font);font-size:12px;color:var(--text);outline:none;resize:none;line-height:1.4;max-height:76px;min-height:34px;transition:border-color .2s}
.cin:focus{border-color:var(--fo)}.cin::placeholder{color:var(--td)}
.cfoot{display:flex;align-items:center;justify-content:space-between;padding:4px 12px 8px;font-size:10px;font-family:var(--mono);color:var(--td)}

/* ── MODALS ── */
.mov{position:fixed;inset:0;background:rgba(0,0,0,.72);z-index:200;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(6px)}
.mod{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:20px;max-width:90vw}
.modt{font-size:14px;font-weight:600;margin-bottom:12px}
.modin{width:100%;background:var(--bg);border:1px solid var(--border);border-radius:var(--rsm);padding:8px 12px;font-family:var(--font);font-size:13px;color:var(--text);outline:none;margin-bottom:10px;transition:border-color .2s}
.modin:focus{border-color:var(--fo)}
.moda{display:flex;gap:8px;justify-content:flex-end;align-items:center}
.modinfo{font-size:11px;color:var(--tm);margin-bottom:6px}
.ai-tag{font-size:10px;font-family:var(--mono);color:var(--fo);margin-bottom:4px;display:flex;align-items:center;gap:4px}

@media(max-width:900px){#main{grid-template-columns:1fr}}

/* ── KANBAN ── */
#kanban-view{display:none;padding:16px 24px 70px;max-width:1800px;margin:0 auto}
#kanban-view.active{display:block}
#main.hidden{display:none}
.kb-col-head{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:10px;position:sticky;top:48px;z-index:50;background:var(--bg);padding:8px 0}
.kb-ch{background:var(--surface);border:1px solid var(--border);border-radius:var(--rsm);padding:8px 14px;text-align:center}
.kb-ch-label{font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--tm)}
.kb-ch-count{font-size:11px;font-family:var(--mono);color:var(--td);margin-top:2px}
.kb-ch.doing{border-top:2px solid var(--fo)}
.swim{margin-bottom:10px;border:1px solid var(--border);border-radius:var(--r);overflow:hidden;background:var(--surface)}
.swim-hd{display:flex;align-items:center;gap:8px;padding:9px 14px;cursor:pointer;user-select:none;border-bottom:1px solid var(--border);background:var(--sh);transition:background .15s}
.swim-hd:hover{background:var(--border)}
.swim-icon{font-size:14px}
.swim-title{font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--tm);flex:1}
.swim-badge{font-family:var(--mono);font-size:9px;color:var(--td);background:var(--bg);padding:2px 7px;border-radius:10px}
.swim-chev{font-size:9px;color:var(--td);transition:transform .2s;margin-left:4px}
.swim.collapsed .swim-chev{transform:rotate(-90deg)}
.swim.collapsed .swim-body{display:none}
.swim-body{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--bl)}
.kb-cell{background:var(--bg);padding:6px;min-height:52px;transition:background .15s}
.kb-cell.drag-over{background:var(--fod)}
.kcard{background:var(--surface);border:1px solid var(--border);border-radius:var(--rsm);padding:9px 11px;margin-bottom:5px;cursor:grab;user-select:none;border-left:3px solid transparent;transition:all .15s}
.kcard:active{cursor:grabbing}
.kcard.dragging{opacity:.3}
.kcard.prio-high{border-left-color:var(--re)}
.kcard.prio-mid{border-left-color:var(--ye)}
.kcard.prio-low{border-left-color:var(--border)}
.kcard.done-card{opacity:.4}
.kc-title{font-size:12px;font-weight:500;line-height:1.4;margin-bottom:6px;color:var(--text)}
.kc-meta{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.kc-tag{font-size:9px;font-weight:600;padding:2px 6px;border-radius:4px;letter-spacing:.04em}
.kc-tag.t-diplom{background:rgba(107,156,245,.12);color:var(--ac)}
.kc-tag.t-schule{background:rgba(232,96,96,.1);color:var(--re)}
.kc-tag.t-privat{background:rgba(232,160,48,.1);color:var(--ye)}
.kc-tag.t-infra{background:rgba(52,196,106,.1);color:var(--gr)}
.kc-src{font-size:9px;color:var(--td);font-family:var(--mono)}
.kc-dl{font-size:9px;font-family:var(--mono);margin-left:auto}
.kc-dl.urgent{color:var(--re)}.kc-dl.soon{color:var(--ye)}.kc-dl.ok{color:var(--td)}
.kb-add{width:100%;padding:5px;background:none;border:none;font-size:11px;color:var(--td);cursor:pointer;text-align:left;border-radius:var(--rsm);transition:background .1s}
.kb-add:hover{background:var(--sh);color:var(--tm)}

/* ── E-MAIL TAB ── */
#email-view{display:none;padding:8px 24px 60px;max-width:1600px;margin:0 auto}
#email-view.active{display:block}
.em-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:5px;flex-wrap:wrap;gap:4px}
.em-filters{display:flex;gap:3px;margin-bottom:4px;overflow-x:auto;flex-wrap:nowrap;padding-bottom:2px}
.em-filters::-webkit-scrollbar{height:0}
.em-catf{flex-shrink:0}
.em-catf.active{color:#fff!important}
.em-tags-row{display:flex;gap:3px;margin-bottom:4px;overflow-x:auto;flex-wrap:nowrap;padding-bottom:2px}
.em-tags-row::-webkit-scrollbar{height:0}
.em-tags-row:empty{display:none}
.em-tagf{flex-shrink:0}
.em-status-filters{display:flex;gap:3px;margin-bottom:6px}
.em-sf.active{background:var(--fo);border-color:var(--fo);color:#fff}
.em-panels{display:grid;grid-template-columns:340px 1fr;gap:10px;min-height:calc(100vh - 160px)}
.em-list{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);overflow-y:auto;max-height:calc(100vh - 160px)}
.em-detail{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);overflow-y:auto;max-height:calc(100vh - 160px);padding:14px;position:relative}

/* Mail list items */
.em-item{padding:7px 12px;border-bottom:1px solid var(--bl);cursor:pointer;transition:background .1s}
.em-item:last-child{border-bottom:none}
.em-item:hover{background:var(--sh)}
.em-item.active{background:var(--acd);border-left:3px solid var(--fo)}
.em-item.unread{border-left:3px solid var(--ac)}
.em-item.unread .em-item-from{font-weight:600}
.em-item.unread .em-item-subj{color:var(--text)}
.em-item-hd{display:flex;align-items:center;gap:6px;margin-bottom:2px}
.em-item-status{font-size:10px;flex-shrink:0}
.em-item-from{font-size:12px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.em-item-date{font-size:10px;font-family:var(--mono);color:var(--td);flex-shrink:0}
.em-item-subj{font-size:11px;color:var(--tm);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:3px}
.em-item-meta{display:flex;align-items:center;gap:6px;font-size:10px}
.em-item-cat{font-size:10px}
.em-item-ai{font-size:10px}
.em-item-wait{font-size:10px;color:var(--ye)}

/* Detail panel */
.em-det-header{margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--border)}
.em-det-from{font-size:14px;font-weight:600;margin-bottom:2px}
.em-det-subj{font-size:16px;font-weight:500;margin-bottom:6px;line-height:1.35}
.em-det-meta{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--tm)}
.em-det-ai{background:var(--bg);border:1px solid var(--border);border-radius:var(--rsm);padding:12px;margin-bottom:12px}
.em-det-ai-sum{font-size:12px;margin-bottom:6px;line-height:1.45}
.em-det-ai-rec{font-size:12px;color:var(--fo);padding-left:10px;border-left:2px solid var(--fo);margin-bottom:8px;line-height:1.45}
.em-det-ai-draft{background:var(--surface);border:1px solid rgba(232,152,72,.2);border-radius:var(--rsm);padding:10px;margin-top:8px}
.em-det-body{font-size:12px;line-height:1.6;color:var(--tm);margin-bottom:14px;padding:12px;background:var(--bg);border-radius:var(--rsm);max-height:200px;overflow-y:auto;white-space:pre-wrap}
.em-det-section{margin-bottom:12px}
.em-det-cats{display:flex;gap:4px;flex-wrap:wrap}
.em-det-cats .btn.active{color:#fff!important}
.em-det-acts{display:flex;gap:5px;flex-wrap:wrap}

/* Folder popup */
.em-folder-popup{position:absolute;right:16px;bottom:16px;background:var(--surface);border:1px solid var(--border);border-radius:var(--rsm);padding:8px;z-index:50;min-width:180px;max-height:250px;overflow-y:auto;box-shadow:0 8px 24px rgba(0,0,0,.5)}

/* Tags */
.em-tagf.active{background:var(--fo);border-color:var(--fo);color:#fff}
.em-tag{display:inline-flex;align-items:center;gap:3px;font-size:10px;padding:2px 8px;border-radius:12px;background:var(--sh);color:var(--tm)}
.em-tag-x{cursor:pointer;opacity:.5;font-size:9px}.em-tag-x:hover{opacity:1;color:var(--re)}
.em-det-tags{display:flex;gap:4px;flex-wrap:wrap;align-items:center}

/* GTD quick action */
.em-det-gtd{margin-top:10px;padding-top:10px;border-top:1px solid var(--border);display:flex;gap:6px;flex-wrap:wrap}

/* Collapsible edit section */
.em-det-edit{margin-top:10px;border:1px solid var(--border);border-radius:var(--rsm);overflow:hidden}
.em-det-edit-sum{padding:8px 12px;font-size:11px;color:var(--tm);cursor:pointer;background:var(--bg);user-select:none}
.em-det-edit-sum:hover{background:var(--sh)}
.em-det-edit[open] .em-det-edit-sum{border-bottom:1px solid var(--border)}
.em-det-edit>div,.em-det-edit>.em-det-section{padding:0 12px}
.em-det-edit .em-det-section:first-of-type{padding-top:10px}
.em-det-edit .em-det-section:last-of-type{padding-bottom:10px}

/* Queue bar */
.em-queue-bar{position:fixed;bottom:0;left:0;right:0;background:var(--surface);border-top:1px solid var(--border);padding:8px 24px;z-index:100;display:flex;flex-direction:column;gap:6px}
.em-qb-progress{height:3px;background:var(--bg);border-radius:3px;overflow:hidden}
.em-qb-fill{height:100%;background:var(--fo);border-radius:3px;transition:width .3s}
.em-qb-info{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-family:var(--mono);color:var(--tm)}

@media(max-width:900px){.em-panels{grid-template-columns:1fr}}
