:root{--bg:#0f0f11;--surface:#18181c;--surface2:#222228;--border:rgba(255,255,255,0.07);--border2:rgba(255,255,255,0.12);--text:#e8e8ec;--text2:#aaaabc;--text3:#6e6e80;--accent:#5b6af0;--accent2:#7b8af8;--success:#2dd98d;--warning:#f0b429;--danger:#f06060;--radius:10px;--radius-lg:14px;--sidebar-font:13px;--table-font:13px;--chat-font:14px;--detail-font:13px;--subtask-font:13px;--badge-color:var(--text);--av-size:22px;--av-font:10px;--av-radius:5px;}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:'DM Sans',sans-serif;background:var(--bg);color:var(--text);height:100vh;display:flex;font-size:14px;}
.sidebar{width:220px;background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0;transition:transform 0.25s;height:100vh;overflow:hidden;}.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.5);z-index:90;}
.hamburger{display:none;align-items:center;justify-content:center;width:36px;height:36px;border:none;background:none;cursor:pointer;color:var(--text);}
@media(max-width:700px){
  .sidebar{position:fixed;top:0;left:0;height:100vh;z-index:100;transform:translateX(-100%);width:200px!important;}
  .sidebar.open{transform:translateX(0);}
  .sidebar-overlay.open{display:block;}
  .hamburger{display:flex;}
  .main{width:100%;min-width:0;}
  .content{padding:12px!important;}
  .topbar{padding:10px 12px!important;}
  }
.logo{padding:20px 18px 16px;border-bottom:1px solid var(--border);}
.logo-text{font-size:15px;font-weight:500;}
.logo-dot{display:inline-block;width:7px;height:7px;background:var(--accent);border-radius:50%;margin-right:8px;}
.nav{flex:1;padding:12px 8px;overflow-y:auto;min-height:0;}
.nav-section{margin-bottom:20px;}
.nav-label{font-size:10px;font-weight:500;color:var(--text3);letter-spacing:0.08em;text-transform:uppercase;padding:0 10px;margin-bottom:6px;display:flex;align-items:center;justify-content:space-between;}
.nav-label-add{cursor:pointer;color:var(--text3);font-size:14px;line-height:1;padding:0 10px;}
.nav-label-add:hover{color:var(--text2);}
.nav-item{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:var(--radius);cursor:pointer;color:var(--text2);font-size:var(--sidebar-font);transition:all 0.15s;position:relative;}
.nav-item:hover{background:var(--surface2);color:var(--text);}
.nav-item.active{background:var(--accent);color:#fff;}
.nav-count{margin-left:auto;font-size:12px;font-weight:600;background:var(--surface2);color:var(--badge-color);padding:1px 7px;border-radius:20px;}
.nav-count.unread{background:var(--accent);color:#fff;}
.nav-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
.nav-item .edit-proj{display:none;position:absolute;right:8px;color:var(--text3);font-size:11px;}
.nav-item:hover .edit-proj{display:block;}
.nav-item:hover .nav-count{display:none;}
.channel-item{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:var(--radius);cursor:pointer;color:var(--text2);font-size:var(--sidebar-font);transition:all 0.15s;}
.channel-item:hover{background:var(--surface2);color:var(--text);}
.channel-item.active{background:var(--accent);color:#fff;}
.dm-item{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:var(--radius);cursor:pointer;color:var(--text2);font-size:var(--sidebar-font);transition:all 0.15s;}
.dm-item:hover{background:var(--surface2);color:var(--text);}
.dm-item.active{background:var(--accent);color:#fff;}
/* TOPBAR INFO */
.topbar-info{display:flex;flex-direction:column;justify-content:center;flex:1;}
.topbar-title{font-size:16px;font-weight:500;}
.topbar-subtitle{font-size:12px;color:var(--text3);margin-top:2px;}
/* LOGIN SCREEN */
.login-screen{position:fixed;top:0;left:0;right:0;bottom:0;width:100%;height:100%;background:var(--bg);display:flex;align-items:center;justify-content:center;z-index:1000;}
#app-wrapper{display:flex;}
#app-wrapper[hidden]{display:none!important;}
.login-box{background:var(--surface);border:1px solid var(--border2);border-radius:var(--radius-lg);padding:36px;width:340px;box-shadow:0 20px 60px rgba(0,0,0,0.5);}
.login-logo{text-align:center;margin-bottom:28px;}
.login-logo-dot{display:inline-block;width:8px;height:8px;background:var(--accent);border-radius:50%;margin-right:6px;}
.login-logo-text{font-size:18px;font-weight:500;}
.login-title{font-size:13px;color:var(--text2);text-align:center;margin-bottom:24px;}
.login-field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;}
.login-field label{font-size:12px;color:var(--text2);font-weight:500;}
.login-field input{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);padding:9px 12px;color:var(--text);font-size:13px;font-family:inherit;outline:none;transition:border-color 0.15s;}
.login-field input:focus{border-color:var(--accent);}
.login-btn{width:100%;padding:10px;background:var(--accent);border:none;border-radius:var(--radius);color:#fff;font-size:13px;font-family:inherit;cursor:pointer;margin-top:6px;transition:background 0.15s;}
.login-btn:hover{background:var(--accent2);}
.login-error{font-size:12px;color:var(--danger);text-align:center;margin-top:8px;min-height:18px;}
/* ADMIN PASSWORD MODAL */
.admin-lock-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.6);display:flex;align-items:center;justify-content:center;z-index:200;backdrop-filter:blur(4px);}
.admin-lock-box{background:var(--surface);border:1px solid var(--border2);border-radius:var(--radius-lg);padding:28px;width:320px;box-shadow:0 20px 60px rgba(0,0,0,0.5);}
.admin-lock-title{font-size:15px;font-weight:500;margin-bottom:6px;}
.admin-lock-sub{font-size:12px;color:var(--text3);margin-bottom:20px;}
/* CHAT TABS */
.chat-tabs{display:flex;gap:0;border-bottom:1px solid var(--border);flex-shrink:0;}
.chat-tab{padding:8px 16px;font-size:12px;cursor:pointer;color:var(--text3);border-bottom:2px solid transparent;margin-bottom:-1px;transition:all 0.15s;}
.chat-tab:hover{color:var(--text2);}
.chat-tab.active{color:var(--accent2);border-bottom-color:var(--accent);}
/* DATE SEPARATOR */
.date-sep{display:flex;align-items:center;gap:10px;padding:12px 0;margin:4px 0;}
.date-sep-line{flex:1;height:1px;background:var(--border);}
.date-sep-label{font-size:12px;color:var(--text3);font-weight:500;white-space:nowrap;padding:3px 10px;border:1px solid var(--border);border-radius:20px;background:var(--surface);}
.linked-msg{display:flex;gap:8px;padding:8px 12px;border-radius:var(--radius);background:var(--surface2);margin-bottom:6px;font-size:12px;cursor:pointer;border:1px solid var(--border);}
.linked-msg:hover{border-color:var(--border2);}
.linked-msg-chan{font-size:11px;color:var(--accent2);margin-bottom:2px;}
.linked-msg-text{color:var(--text2);line-height:1.4;}
.user-av{width:var(--av-size);height:var(--av-size);border-radius:var(--av-radius);font-size:var(--av-font);font-weight:500;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:rgba(91,106,240,0.2);color:var(--accent2);}
.online-dot{width:7px;height:7px;border-radius:50%;background:var(--success);flex-shrink:0;}
.sidebar-bottom{padding:12px 8px;border-top:1px solid var(--border);flex-shrink:0;background:var(--surface);}
.user-btn{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--radius);cursor:pointer;transition:background 0.15s;}
.user-btn:hover{background:var(--surface2);}
.avatar{width:var(--av-size);height:var(--av-size);border-radius:var(--av-radius);background:rgba(91,106,240,0.2);color:var(--accent2);font-size:var(--av-font);font-weight:500;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;height:100vh;min-width:0;}
.topbar{padding:0 24px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:12px;flex-shrink:0;height:61px;}
.topbar-title{font-size:16px;font-weight:500;flex:1;}
.btn{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:var(--radius);border:1px solid var(--border2);background:var(--surface2);color:var(--text);font-size:13px;cursor:pointer;transition:all 0.15s;font-family:inherit;}
.btn:hover{background:var(--surface);}
.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff;}
.btn-primary:hover{background:var(--accent2);border-color:var(--accent2);}
.btn-danger{background:rgba(240,96,96,0.15);border-color:rgba(240,96,96,0.3);color:var(--danger);}
.btn-sm{padding:4px 10px;font-size:12px;}
.content{flex:1;overflow-y:auto;padding:24px;}
/* FILTERS & TABLE */
.filters{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap;align-items:center;}
.filter-btn{padding:5px 12px;border-radius:20px;border:1px solid var(--border);background:none;color:var(--text2);font-size:12px;cursor:pointer;font-family:inherit;transition:all 0.15s;display:flex;align-items:center;gap:5px;}
.filter-btn:hover{border-color:var(--border2);color:var(--text);}
.filter-btn.active{background:rgba(91,106,240,0.15);border-color:rgba(91,106,240,0.4);color:var(--accent2);}
.filter-dot{width:6px;height:6px;border-radius:50%;}
.cols-btn{margin-left:0;padding:5px 10px;border-radius:var(--radius);border:1px solid var(--border);background:none;color:var(--text3);font-size:12px;cursor:pointer;font-family:inherit;display:flex;align-items:center;gap:5px;}
.cols-btn:hover{color:var(--text2);border-color:var(--border2);}
.table-wrap{border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;}
table{width:100%;border-collapse:collapse;table-layout:fixed;}
.task-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
thead{background:var(--surface);}
th{text-align:left;padding:11px 14px;font-size:11px;font-weight:600;color:var(--text2);letter-spacing:0.06em;text-transform:uppercase;border-bottom:1px solid var(--border2);white-space:nowrap;cursor:pointer;background:var(--surface);}
th:hover{color:var(--text2);}
td{padding:11px 14px;border-bottom:1px solid var(--border);vertical-align:middle;font-size:var(--table-font);}
tr:last-child td{border-bottom:none;}
tr:hover td{background:rgba(255,255,255,0.02);}
tr.done td{opacity:0.4;}
.cb{width:15px;height:15px;border:1.5px solid var(--border2);border-radius:4px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:all 0.15s;}
.cb:hover{border-color:var(--accent);}
.cb.checked{background:var(--success);border-color:var(--success);}
.cb.checked::after{content:'';width:8px;height:5px;border-left:1.5px solid #000;border-bottom:1.5px solid #000;transform:rotate(-45deg) translate(1px,-1px);display:block;}
.task-title{display:flex;align-items:center;gap:8px;}
.task-name{color:var(--text);flex:1;cursor:pointer;font-weight:500;}
.task-name:hover{color:var(--accent2);}
.sub-count{font-size:11px;color:var(--text3);}
.expand-btn{width:16px;height:16px;cursor:pointer;color:var(--text3);display:inline-flex;align-items:center;justify-content:center;transition:transform 0.15s;flex-shrink:0;}
.expand-btn.open{transform:rotate(90deg);}
.prio{display:inline-flex;align-items:center;font-size:12px;padding:3px 8px;border-radius:20px;white-space:nowrap;}
.prio-hoch{background:rgba(240,96,96,0.18);color:#f07070;font-weight:500;}
.prio-mittel{background:rgba(240,180,41,0.18);color:#e8b840;font-weight:500;}
.prio-niedrig{background:rgba(45,217,141,0.18);color:#3dcc8e;font-weight:500;}
.status-badge{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--text);}
.status-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;}
.dot-offen{background:var(--text3);}.dot-laufend{background:var(--accent);}.dot-fertig{background:var(--success);}
.date-cell{font-size:12px;font-family:'DM Mono',monospace;white-space:nowrap;}
.overdue{color:var(--danger);}.soon{color:var(--warning);}.date-ok{color:var(--text);}
.av-stack{display:flex;align-items:center;gap:4px;}
.av{width:var(--av-size);height:var(--av-size);border-radius:var(--av-radius);font-size:var(--av-font);font-weight:500;display:flex;align-items:center;justify-content:center;margin-left:5px;flex-shrink:0;}
.av:first-child{margin-left:0;}
.av-b{background:rgba(91,106,240,0.2);color:var(--accent2);}
.av-p{background:rgba(180,91,240,0.2);color:#c090f8;}
.av-t{background:rgba(45,217,141,0.2);color:var(--success);}
.av-a{background:rgba(240,180,41,0.2);color:var(--warning);}
.proj-tag{font-size:11px;padding:3px 9px;border-radius:5px;white-space:nowrap;font-weight:500;}
.subtask-inner{display:flex;align-items:center;gap:8px;padding:6px 14px 6px 48px;font-size:var(--subtask-font);color:var(--text2);border-bottom:1px solid var(--border);background:rgba(255,255,255,0.01);}
/* MYDAY */
.myday-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;}
.proj-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:14px 16px;}
.proj-card-link{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:12px 14px;cursor:pointer;transition:border-color 0.15s;}
.proj-card-link:hover{border-color:var(--border2);}
.proj-card-header{display:flex;align-items:center;gap:8px;margin-bottom:12px;font-size:13px;font-weight:500;}
.proj-task{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--border);font-size:13px;}
.proj-task:last-child{border-bottom:none;}
/* CHAT */
.chat-layout{display:flex;height:100%;overflow:hidden;}
.chat-sidebar{width:180px;border-right:1px solid var(--border);padding:12px 8px;flex-shrink:0;overflow-y:auto;}
@media(max-width:700px){.chat-sidebar{display:none;}.chat-main{width:100%!important;}}
@media(max-width:700px){.chat-sidebar{display:none;} .chat-main{width:100%;}}
.chat-main{flex:1;display:flex;flex-direction:column;overflow:hidden;}
.chat-header{padding:12px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px;flex-shrink:0;font-weight:500;font-size:14px;}
.chat-messages{flex:1;overflow-y:auto;padding:16px 20px;display:flex;flex-direction:column;gap:4px;min-height:0;}
/* MSG AVATAR */
.msg{display:flex;align-items:flex-start;padding:3px 8px;border-radius:var(--radius);position:relative;line-height:1.6;gap:0;}
.msg:hover{background:rgba(255,255,255,0.03);}
.msg-avatar{width:var(--av-size);height:var(--av-size);border-radius:var(--av-radius);font-size:var(--av-font);font-weight:500;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:3px;letter-spacing:0.02em;}
.msg-actions{display:none;position:absolute;right:8px;top:4px;gap:2px;background:var(--surface);border:1px solid var(--border2);border-radius:8px;padding:3px 4px;z-index:2;box-shadow:0 2px 10px rgba(0,0,0,0.35);}
.msg:hover .msg-actions{display:flex;}
.msg-action-btn{background:none;border:none;cursor:pointer;color:var(--text3);padding:4px 6px;border-radius:5px;display:flex;align-items:center;}
.msg-action-btn:hover{background:var(--surface2);color:var(--text);}
.msg-action-del:hover{background:rgba(240,96,96,0.15);color:var(--danger);}
.msg-av{display:none;}
.msg-body{flex:1;min-width:0;padding-left:10px;display:grid;grid-template-columns:220px 1fr;column-gap:16px;align-items:baseline;}
.msg-initials{display:none;}
.msg-header{grid-column:1;grid-row:1;display:flex;align-items:baseline;gap:6px;flex-wrap:nowrap;overflow:hidden;}
.msg-name{font-size:var(--sidebar-font);font-weight:500;color:var(--text);margin-right:8px;flex-shrink:0;}
.msg-time{font-size:11px;color:var(--text3);font-family:'DM Mono',monospace;white-space:nowrap;flex-shrink:0;}
.msg-sep{color:var(--text3);margin-right:8px;font-size:12px;flex-shrink:0;}
.msg-text{font-size:var(--chat-font);color:var(--text2);line-height:1.6;word-break:break-word;overflow-wrap:anywhere;}
.msg-task-link{display:inline-flex;align-items:center;gap:5px;font-size:12px;padding:3px 8px;border-radius:var(--radius);background:rgba(91,106,240,0.1);color:var(--accent2);margin-top:4px;cursor:pointer;border:1px solid rgba(91,106,240,0.2);vertical-align:top;}
.msg-task-link:hover{background:rgba(91,106,240,0.2);}
.msg-file{display:inline-flex;align-items:center;gap:5px;font-size:12px;padding:3px 8px;border-radius:var(--radius);background:var(--surface2);color:var(--text2);margin-top:4px;cursor:pointer;border:1px solid var(--border);vertical-align:top;}
.chat-input-area{padding:12px 20px;border-top:1px solid var(--border);flex-shrink:0;}
.chat-input-toolbar{display:flex;align-items:center;gap:6px;margin-bottom:6px;}
.toolbar-btn{width:34px;height:34px;border-radius:var(--radius);border:none;background:none;color:var(--text2);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:18px;transition:all 0.15s;}
.toolbar-btn:hover{background:var(--surface2);color:var(--text);}
.toolbar-btn svg{width:18px;height:18px;}
/* Reply quote */
.reply-quote{display:block;background:var(--surface2);border-left:3px solid var(--accent);border-radius:0 6px 6px 0;padding:5px 10px;margin-top:4px;font-size:12px;color:var(--text2);opacity:0.85;clear:both;}
.reply-quote .rq-name{font-weight:600;color:var(--accent2);margin-bottom:2px;}
.reply-preview{display:flex;align-items:center;gap:8px;padding:6px 12px;background:var(--surface2);border-left:3px solid var(--accent);border-radius:0 6px 6px 0;margin:4px 16px 0;font-size:12px;color:var(--text2);}
.reply-preview .rp-cancel{cursor:pointer;margin-left:auto;color:var(--text3);font-size:16px;}
.task-link-badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:3px 10px;border-radius:20px;background:rgba(91,106,240,0.1);color:var(--accent2);border:1px solid rgba(91,106,240,0.2);margin-bottom:6px;}
.task-link-badge .remove{cursor:pointer;color:var(--text3);margin-left:4px;}
.chat-input-wrap{display:flex;gap:8px;align-items:flex-end;background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:10px 14px;}
.chat-input{flex:1;background:none;border:none;outline:none;color:var(--text);font-size:13px;font-family:inherit;resize:none;max-height:120px;line-height:1.5;}
.chat-input::placeholder{color:var(--text3);}
.send-btn{width:32px;height:32px;border-radius:var(--radius);background:var(--accent);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.send-btn:hover{background:var(--accent2);}
/* EMOJI PICKER */
.emoji-picker{position:absolute;bottom:100px;left:20px;background:var(--surface);border:1px solid var(--border2);border-radius:var(--radius-lg);padding:10px;z-index:50;display:grid;grid-template-columns:repeat(8,32px);gap:2px;box-shadow:0 10px 40px rgba(0,0,0,0.4);}
.emoji-btn{width:32px;height:32px;border:none;background:none;cursor:pointer;border-radius:var(--radius);font-size:18px;display:flex;align-items:center;justify-content:center;transition:background 0.1s;}
.emoji-btn:hover{background:var(--surface2);}
.task-detail-top{display:flex;height:45%;min-height:120px;max-height:80%;border-bottom:none;overflow:hidden;flex-shrink:0;}
.task-detail-left{flex:1;min-width:0;overflow-y:auto;overflow-x:hidden;padding:20px 24px;}
.task-detail-right{width:35%;min-width:160px;border-left:1px solid var(--border);display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;padding:16px;}
.detail-top-resize{width:5px;background:var(--border);cursor:col-resize;flex-shrink:0;transition:background 0.15s;}
.detail-top-resize:hover,.detail-top-resize.dragging{background:var(--accent);}
/* VERTICAL RESIZE between top and bottom */
.detail-vert-resize{height:8px;background:var(--surface2);cursor:row-resize;flex-shrink:0;display:flex;align-items:center;justify-content:center;border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
.detail-vert-resize:hover,.detail-vert-resize.dragging{background:rgba(91,106,240,0.2);}
.detail-vert-resize::after{content:'';width:40px;height:3px;border-radius:2px;background:var(--border2);}
.detail-vert-resize:hover::after,.detail-vert-resize.dragging::after{background:var(--accent);}
@media(max-width:700px){
  .task-detail-top{flex-direction:column;height:auto;max-height:50vh;}
  .task-detail-right{width:100%;border-left:none;border-top:1px solid var(--border);}
  .detail-top-resize,.detail-vert-resize{display:none;}
}
.task-detail-bottom{display:flex;flex:1;min-height:0;border-top:1px solid var(--border);overflow:hidden;}
.task-detail-chat{flex:1;min-width:0;display:flex;flex-direction:column;overflow:hidden;min-height:0;}
.task-detail-comments{width:40%;min-width:200px;border-left:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;min-height:0;}
.detail-resize{width:6px;background:var(--border);cursor:col-resize;flex-shrink:0;transition:background 0.15s;position:relative;}
.detail-resize:hover,.detail-resize.dragging{background:var(--accent);}
.detail-resize::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:2px;height:24px;border-radius:2px;background:var(--border2);}
@media(max-width:700px){
  .task-detail-bottom{flex-direction:column;}
  .task-detail-comments{width:100%;border-left:none;border-top:1px solid var(--border);min-height:200px;}
  .task-detail-main{max-height:none;}
}
.back-btn{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--text2);cursor:pointer;margin-bottom:20px;}
.back-btn:hover{color:var(--text);}
.subtask-item{display:flex;align-items:center;gap:8px;padding:7px 4px;border-bottom:1px solid var(--border);font-size:var(--subtask-font);}
.subtask-item.done-item{opacity:1;}
.subtask-title{flex:1;cursor:pointer;color:var(--text);}
.subtask-title:hover{color:var(--text);}
.subtask-title.done-title{color:var(--text);}
.subtask-del{background:none;border:none;cursor:pointer;color:var(--text3);font-size:12px;padding:2px 4px;border-radius:4px;opacity:0;}
.subtask-item:hover .subtask-del{opacity:1;}
.subtask-del:hover{color:var(--danger);}
.sub-attach-btn{background:none;border:none;padding:2px 4px;}
.subtask-item:hover .sub-attach-btn{opacity:1!important;}
.subtask-add-input{width:100%;background:none;border:none;border-bottom:1px dashed var(--border2);padding:7px 2px;color:var(--text);font-size:var(--detail-font);font-family:inherit;outline:none;margin-top:6px;}
.subtask-add-input:focus{border-bottom-color:var(--accent);}
.subtask-add-input::placeholder{color:var(--text3);}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px;}
.detail-label{font-size:11px;font-weight:500;color:var(--text3);text-transform:uppercase;letter-spacing:0.05em;margin-bottom:6px;}
.detail-select{background:var(--surface);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:13px;font-family:inherit;outline:none;cursor:pointer;padding:4px 6px;color-scheme:dark;}
/* COLUMNS PANEL */
.cols-panel{position:absolute;top:48px;right:0;width:260px;background:var(--surface);border:1px solid var(--border2);border-radius:var(--radius-lg);z-index:40;box-shadow:0 10px 40px rgba(0,0,0,0.4);overflow:hidden;}
.cols-panel-header{padding:10px 14px;border-bottom:1px solid var(--border);font-size:13px;font-weight:500;display:flex;align-items:center;justify-content:space-between;}
.col-row{display:flex;align-items:center;gap:10px;padding:8px 14px;border-bottom:1px solid var(--border);font-size:13px;cursor:grab;}
.col-row:last-child{border-bottom:none;}
.col-row:hover{background:var(--surface2);}
.col-row.dragging{opacity:0.5;}
.col-toggle{width:32px;height:18px;border-radius:9px;cursor:pointer;position:relative;transition:background 0.2s;flex-shrink:0;}
.col-toggle.on{background:var(--accent);}
.col-toggle.off{background:var(--border2);}
.col-toggle-thumb{position:absolute;top:2px;width:14px;height:14px;border-radius:50%;background:#fff;transition:left 0.2s;}
.col-toggle.on .col-toggle-thumb{left:16px;}
.col-toggle.off .col-toggle-thumb{left:2px;}
.drag-handle{color:var(--text3);font-size:14px;cursor:grab;}
/* SETTINGS PANEL */
.settings-overlay{position:fixed;inset:0;z-index:500;background:rgba(0,0,0,0.6);}
.settings-header{padding:16px 20px;border-bottom:1px solid var(--border);font-size:15px;font-weight:600;display:flex;align-items:center;justify-content:space-between;background:var(--surface);flex-shrink:0;}
.settings-section{padding:14px 20px;border-bottom:1px solid var(--border);}

.settings-section:last-child{border-bottom:none;}
.settings-label{font-size:10px;font-weight:500;color:var(--text3);letter-spacing:0.08em;text-transform:uppercase;margin-bottom:10px;}
.size-btns{display:flex;gap:6px;}
.size-btn{flex:1;padding:6px;border:1px solid var(--border);border-radius:var(--radius);background:none;color:var(--text2);font-size:12px;cursor:pointer;font-family:inherit;text-align:center;transition:all 0.15s;}
.size-btn:hover{border-color:var(--border2);color:var(--text);}
.size-btn.active{border-color:var(--accent);background:rgba(91,106,240,0.15);color:var(--accent2);}
.color-swatches{display:flex;gap:8px;flex-wrap:wrap;}
.swatch{width:22px;height:22px;border-radius:50%;cursor:pointer;border:2px solid transparent;transition:border-color 0.15s;}
.swatch.active{border-color:#fff;}
.toggle-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;font-size:13px;color:var(--text);}
.toggle-row:last-child{margin-bottom:0;}
.toggle{width:32px;height:18px;border-radius:9px;cursor:pointer;position:relative;transition:background 0.2s;flex-shrink:0;}
.toggle.on{background:var(--success);}
.toggle.off{background:var(--border2);}
.toggle-thumb{position:absolute;top:2px;width:14px;height:14px;border-radius:50%;background:#fff;transition:left 0.2s;}
.toggle.on .toggle-thumb{left:16px;}
.toggle.off .toggle-thumb{left:2px;}
.reset-select{width:100%;padding:7px 10px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface2);color:var(--text2);font-size:12px;font-family:inherit;outline:none;margin-bottom:8px;}
.save-settings{width:100%;padding:9px;background:var(--accent);border:none;border-radius:var(--radius);color:#fff;font-size:13px;font-family:inherit;cursor:pointer;}
.save-settings:hover{background:var(--accent2);}
/* ADMIN */
.admin-grid{display:grid;grid-template-columns:200px 1fr;gap:0;height:100%;}
.admin-nav{border-right:1px solid var(--border);padding:12px 8px;}
.admin-nav-item{padding:8px 12px;border-radius:var(--radius);cursor:pointer;font-size:13px;color:var(--text2);transition:all 0.15s;margin-bottom:2px;}
.admin-nav-item:hover{background:var(--surface2);color:var(--text);}
.admin-nav-item.active{background:rgba(91,106,240,0.15);color:var(--accent2);}
.admin-content{padding:24px;overflow-y:auto;}
.admin-section-title{font-size:15px;font-weight:500;margin-bottom:16px;}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px;}
.field{display:flex;flex-direction:column;gap:6px;}
.field label{font-size:12px;color:var(--text2);font-weight:500;}
.field input,.field select,.field textarea{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);padding:8px 12px;color:var(--text);font-size:13px;font-family:inherit;outline:none;transition:border-color 0.15s;}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--accent);}
.field textarea{resize:vertical;min-height:80px;}
.field-full{grid-column:1/-1;}
/* MODALS */
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,0.6);display:flex;align-items:center;justify-content:center;z-index:9999;padding:24px;}
.modal{background:var(--surface);border:1px solid var(--border2);border-radius:var(--radius-lg);width:100%;max-width:560px;max-height:90vh;overflow-y:auto;}
.modal-header{padding:18px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:var(--surface);z-index:1;}
.modal-title{font-size:15px;font-weight:500;}
.modal-close{cursor:pointer;color:var(--text3);font-size:20px;line-height:1;padding:4px;}
.modal-body{padding:20px;display:flex;flex-direction:column;gap:14px;}
.modal-footer{padding:14px 20px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:8px;}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
/* TASK PICKER MODAL */
.task-picker-list{max-height:300px;overflow-y:auto;}
.task-pick-item{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:var(--radius);cursor:pointer;font-size:13px;color:var(--text2);transition:all 0.15s;}
.task-pick-item:hover{background:var(--surface2);color:var(--text);}
.task-pick-item.selected{background:rgba(91,106,240,0.15);color:var(--accent2);}
/* USER MANAGEMENT */
.user-table{width:100%;border-collapse:collapse;}
.user-table th{text-align:left;padding:8px 12px;font-size:11px;font-weight:500;color:var(--text3);text-transform:uppercase;border-bottom:1px solid var(--border);}
.user-table td{padding:10px 12px;border-bottom:1px solid var(--border);font-size:13px;}
.user-table tr:last-child td{border-bottom:none;}
.role-badge{font-size:11px;padding:2px 8px;border-radius:20px;}
.role-admin{background:rgba(91,106,240,0.15);color:var(--accent2);}
.role-verwalter{background:rgba(45,180,130,0.15);color:var(--success);}
.role-member{background:var(--surface2);color:var(--text3);}
/* TOAST */
.toast{position:fixed;bottom:24px;right:24px;background:var(--surface);border:1px solid var(--border2);border-radius:var(--radius);padding:10px 16px;font-size:13px;color:var(--text);z-index:200;transform:translateY(60px);opacity:0;transition:all 0.25s;}
.toast.show{transform:translateY(0);opacity:1;}
.toast.error{border-color:rgba(240,96,96,0.4);color:var(--danger);}
.toast.success{border-color:rgba(45,217,141,0.3);}
.loading{display:flex;align-items:center;justify-content:center;padding:60px;color:var(--text3);gap:10px;}
.spinner{width:16px;height:16px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin 0.8s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
.empty{text-align:center;padding:60px;color:var(--text3);}
input[type=search]{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);padding:7px 12px;color:var(--text);font-size:13px;font-family:inherit;outline:none;width:100%;}
input[type=search]:focus{border-color:var(--accent);}
input[type=date]{color-scheme:dark;}
input[type=date]::-webkit-calendar-picker-indicator{filter:invert(0.7);}
.assignee-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 5px;border-radius:20px;background:rgba(91,106,240,0.15);border:1px solid rgba(91,106,240,0.25);font-size:13px;color:var(--accent2);cursor:pointer;}
.assignee-chip:hover{background:rgba(91,106,240,0.25);}
.assignee-chip .rm{color:var(--text3);margin-left:2px;font-size:14px;line-height:1;}
.assignee-chip .rm:hover{color:var(--danger);}
.user-pick-item{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:var(--radius);cursor:pointer;font-size:13px;color:var(--text2);transition:all 0.15s;}
.user-pick-item:hover{background:var(--surface2);color:var(--text);}
.user-pick-item.assigned{background:rgba(91,106,240,0.1);color:var(--accent2);}
/* Fix 12: Slim scrollbars */
::-webkit-scrollbar{width:4px;height:4px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:var(--text3);border-radius:4px;}
::-webkit-scrollbar-thumb:hover{background:var(--text2);}

/* Proj-Chat button blink when unread */
@keyframes tt-blink {
  0%,100%{opacity:1;} 50%{opacity:0.4;}
}
.proj-chat-unread {
  animation: tt-blink 1.2s ease-in-out infinite;
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}


/* === SETTINGS PANEL CLEAN === */
.settings-panel{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:min(500px,95vw);max-height:88vh;background:var(--surface);border:1px solid var(--border2);border-radius:14px;z-index:120;box-shadow:0 20px 60px rgba(0,0,0,0.7);flex-direction:column;}
.avatar-swatch:hover{opacity:0.85;}
.avatar-swatch.active{border-color:var(--accent)!important;box-shadow:0 0 0 2px var(--accent);}
@media(max-width:600px){.settings-panel{width:98vw;max-height:95vh;}}

/* Universal avatar chip - size controlled by --av-size */
.av-chip{width:var(--av-size);height:var(--av-size);border-radius:var(--av-radius);font-size:var(--av-font);font-weight:700;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;}
.table-wrap table th:last-child, .table-wrap table td:last-child{padding-right:12px;overflow:visible;}

@keyframes taskBlink {
  0%,100%{background:transparent;}
  50%{background:rgba(91,106,240,0.15);}
}
.task-blink td {animation:taskBlink 1.2s ease-in-out infinite;}
.task-blink .task-name {color:var(--accent2)!important;}