:root{--bg:#f5f8fc;--surface:#fff;--surface-2:#f8fbff;--ink:#142033;--muted:#738096;--line:#e5ebf4;--blue:#2167f3;--blue2:#0d4bd8;--cyan:#24b7ff;--success:#18a673;--warning:#e99b26;--danger:#d84b5b;--shadow:0 20px 60px rgba(25,54,100,.10);--shadow2:0 8px 30px rgba(24,57,108,.08);--radius:18px}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,system-ui,sans-serif;color:var(--ink);background:var(--bg)}body:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 82% 0,rgba(33,103,243,.09),transparent 32%),radial-gradient(circle at 0 70%,rgba(36,183,255,.06),transparent 28%);z-index:-1}button,input,textarea,select{font:inherit}button{cursor:pointer}a{text-decoration:none;color:inherit}.app-shell{min-height:100vh}.sidebar{position:fixed;z-index:50;left:0;top:0;bottom:0;width:276px;background:rgba(255,255,255,.86);backdrop-filter:blur(24px);border-right:1px solid rgba(220,228,240,.9);padding:24px 18px;display:flex;flex-direction:column;overflow:auto}.brand-row{display:flex;align-items:center;justify-content:space-between;padding:0 8px 22px}.brand img{width:138px;height:auto;display:block}.sidebar-close{display:none}.workspace-switcher{display:flex;align-items:center;gap:11px;padding:12px;border:1px solid var(--line);background:linear-gradient(135deg,#fff,#f6f9ff);border-radius:14px;box-shadow:0 8px 20px rgba(24,54,100,.05);margin-bottom:25px}.workspace-switcher .workspace-mark{width:36px;height:36px;border-radius:11px;background:linear-gradient(135deg,var(--blue),var(--cyan));color:#fff;display:grid;place-items:center;font-weight:800;box-shadow:0 7px 18px rgba(33,103,243,.25)}.workspace-switcher strong{font-size:12px;display:block}.workspace-switcher span{font-size:9px;color:var(--muted);display:block;margin-top:3px}.workspace-switcher svg{width:16px;margin-left:auto;stroke:#8a96a8;fill:none;stroke-width:2}.side-label{font-size:9px;text-transform:uppercase;letter-spacing:.16em;color:#9aa5b5;font-weight:800;padding:0 10px 9px}.side-label-gap{margin-top:24px}.side-nav{display:grid;gap:4px}.nav-item{border:0;background:transparent;color:#6e7a8f;width:100%;display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;text-align:left;font-weight:600;font-size:11px;transition:.22s ease;position:relative}.nav-item:hover{background:#f4f7fc;color:#1f2f48;transform:translateX(2px)}.nav-item.active{background:linear-gradient(90deg,#eaf1ff,#f5f8ff);color:var(--blue);box-shadow:inset 3px 0 0 var(--blue)}.nav-icon{width:18px;height:18px;display:grid;place-items:center}.nav-icon svg,.top-icon svg,.quick-icon svg,.quick-arrow svg,[data-icon] svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.nav-badge{margin-left:auto;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:#edf3ff;color:var(--blue);font-size:8px;display:none;align-items:center;justify-content:center;font-weight:800}.nav-badge.show{display:flex}.presence-mini{margin-left:auto;width:7px;height:7px;border-radius:50%;background:#16ad7a;box-shadow:0 0 0 4px rgba(22,173,122,.08);display:none}.presence-mini.show{display:block}.quick-card{display:flex;align-items:center;gap:10px;margin-top:4px;padding:13px;border-radius:15px;background:linear-gradient(135deg,#102b61,#1b5de0);color:#fff;box-shadow:0 15px 35px rgba(23,74,169,.2);overflow:hidden;position:relative}.quick-card:after{content:"";position:absolute;width:100px;height:100px;right:-45px;top:-50px;border-radius:50%;background:rgba(255,255,255,.12)}.quick-icon{width:30px;height:30px;border-radius:9px;background:rgba(255,255,255,.14);display:grid;place-items:center;flex:none}.quick-card b{font-size:10px;display:block}.quick-card span{font-size:8px;color:rgba(255,255,255,.7);display:block;line-height:1.45;margin-top:3px}.quick-arrow{border:0;background:rgba(255,255,255,.12);color:#fff;width:27px;height:27px;border-radius:8px;margin-left:auto;display:grid;place-items:center;z-index:1}.sidebar-bottom{margin-top:auto;padding-top:24px}.storage{padding:13px 12px;border:1px solid var(--line);border-radius:13px;background:#fff;margin-bottom:12px}.storage-top{display:flex;justify-content:space-between;font-size:8px;color:var(--muted);margin-bottom:8px}.storage-top b{color:var(--blue)}.progress{height:5px;border-radius:999px;background:#edf2f8;overflow:hidden}.progress i{height:100%;display:block;background:linear-gradient(90deg,var(--blue),var(--cyan));border-radius:999px}.storage small{font-size:7px;color:#a0a9b7;display:block;margin-top:7px}.logout{display:flex;align-items:center;gap:9px;color:#7a8799;font-size:10px;font-weight:700;padding:10px 12px;border-radius:10px;transition:.2s}.logout:hover{background:#fff2f4;color:var(--danger)}.logout span{display:grid}.mini-profile{display:flex;align-items:center;gap:9px;padding:13px 8px 0;border-top:1px solid var(--line);margin-top:5px}.mini-profile strong{font-size:9px;display:block}.mini-profile span{font-size:7px;color:var(--muted);display:block;margin-top:2px}.online-dot{margin-left:auto;width:8px;height:8px;background:#18a673;border-radius:50%;box-shadow:0 0 0 4px rgba(24,166,115,.08)}.avatar{width:34px;height:34px;border-radius:11px;background:linear-gradient(135deg,#dce8ff,#b8d0ff);color:#1c55bf;display:grid;place-items:center;font-size:9px;font-weight:800;flex:none;overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover}.avatar.small{width:29px;height:29px;border-radius:9px;font-size:8px}.main-area{margin-left:276px;min-height:100vh}.topbar{height:78px;position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:0 38px;border-bottom:1px solid rgba(224,231,241,.75);background:rgba(248,250,253,.72);backdrop-filter:blur(20px)}.topbar-left,.top-actions{display:flex;align-items:center}.crumbs{display:flex;align-items:center;gap:9px;font-size:11px;color:#98a2b1}.crumbs strong{color:#26344b}.crumbs b{font-weight:500;color:#c4ccd8}.top-actions{gap:10px}.search-box{width:300px;height:40px;background:#fff;border:1px solid var(--line);border-radius:12px;display:flex;align-items:center;padding:0 12px;gap:8px;box-shadow:0 5px 18px rgba(30,57,100,.04)}.search-box input{border:0;outline:0;width:100%;font-size:10px;color:var(--ink);background:transparent}.search-box span{color:#9aa5b5;display:grid}.top-icon,.icon-btn{border:1px solid var(--line);background:#fff;color:#69768b;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;transition:.2s;box-shadow:0 5px 18px rgba(30,57,100,.04)}.top-icon:hover{color:var(--blue);border-color:#cbd9f4;transform:translateY(-2px);box-shadow:0 8px 22px rgba(33,103,243,.12)}.notif-wrap{position:relative}.notif-count{display:none;position:absolute;right:5px;top:5px;width:7px;height:7px;border-radius:50%;background:#f24e62;border:2px solid #fff}.notif-count.show{display:block}.notif-panel{position:absolute;right:0;top:49px;width:360px;background:#fff;border:1px solid var(--line);border-radius:17px;box-shadow:var(--shadow);padding:14px;display:none;animation:pop .18s ease}.notif-panel.show{display:block}.notif-head{display:flex;justify-content:space-between;align-items:center;padding-bottom:10px;border-bottom:1px solid var(--line)}.notif-head strong{font-size:11px;display:block}.notif-head span{font-size:8px;color:var(--muted);display:block;margin-top:3px}.notif-head button{border:0;background:transparent;color:var(--blue);font-size:8px;font-weight:700}.top-user{display:flex;align-items:center;gap:8px;padding-left:4px}.top-user strong{display:block;font-size:9px}.top-user div:nth-child(2) span{font-size:7px;color:var(--muted);display:block;margin-top:2px}.top-user>span{color:#99a4b4}.mobile-menu{display:none}.content-wrap{padding:38px 42px 60px;max-width:1680px;margin:auto}.page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:26px}.eyebrow{font-size:8px;letter-spacing:.18em;color:var(--blue);font-weight:800;margin-bottom:7px}.page-heading h1{font-size:28px;letter-spacing:-.04em;margin:0}.page-heading p{font-size:10px;color:var(--muted);margin:7px 0 0}.card{background:rgba(255,255,255,.94);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow2);transition:.25s ease}.card:hover{box-shadow:0 14px 35px rgba(28,62,112,.10)}.btn{border:0;border-radius:11px;padding:10px 14px;font-size:10px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;gap:7px;transition:.22s ease}.btn.primary{background:linear-gradient(135deg,var(--blue),var(--blue2));color:#fff;box-shadow:0 8px 20px rgba(33,103,243,.22)}.btn.primary:hover{transform:translateY(-2px);box-shadow:0 12px 25px rgba(33,103,243,.3)}.btn.ghost{background:#fff;color:#58677d;border:1px solid var(--line)}.btn.ghost:hover{border-color:#c7d5ee;color:var(--blue);background:#f8fbff}.btn.danger{background:#fff0f2;color:var(--danger);border:1px solid #ffd6dc}.row{display:flex;align-items:center;gap:8px}.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:18px}.kpi{padding:19px;position:relative;overflow:hidden}.kpi:after{content:"";position:absolute;width:100px;height:100px;right:-45px;bottom:-50px;border-radius:50%;background:rgba(33,103,243,.045)}.kpi-top{display:flex;align-items:center;justify-content:space-between}.kpi-label{font-size:10px;color:var(--muted);font-weight:700}.kpi-icon{width:36px;height:36px;border-radius:11px;background:#edf4ff;color:var(--blue);display:grid;place-items:center}.kpi-number{font-size:31px;letter-spacing:-.05em;font-weight:800;margin-top:15px}.kpi-foot{font-size:8px;color:#9aa5b5;margin-top:6px}.trend{color:var(--success);font-weight:800;margin-right:6px}.dashboard-grid{display:grid;grid-template-columns:1.4fr .8fr;gap:18px}.panel{padding:20px}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:17px}.panel-title{font-size:12px;font-weight:800}.panel-sub{font-size:8px;color:var(--muted);margin-top:4px}.legend{display:flex;gap:12px;font-size:8px;color:var(--muted)}.legend span{display:flex;align-items:center;gap:5px}.legend i{width:7px;height:7px;background:var(--blue);border-radius:50%}.legend i.second{background:#cdd8e9}.chart-wrap{height:260px;position:relative;padding:0 10px 0 34px}.chart-grid{position:absolute;left:34px;right:10px;top:12px;bottom:30px;background:repeating-linear-gradient(to bottom,transparent 0,transparent 48px,#edf2f8 49px)}.chart-svg{position:absolute;left:34px;right:10px;top:12px;width:calc(100% - 44px);height:205px}.chart-labels{position:absolute;left:0;top:10px;bottom:30px;display:flex;flex-direction:column;justify-content:space-between;color:#a5afbd;font-size:7px}.chart-x{position:absolute;left:34px;right:10px;bottom:3px;display:flex;justify-content:space-between;color:#a5afbd;font-size:7px}.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.metric-box{padding:14px;border-radius:13px;background:#f7faff;border:1px solid #edf2f8}.metric-box span{font-size:8px;color:var(--muted);display:block}.metric-box b{font-size:20px;display:block;margin-top:7px}.notice-card{padding:14px;background:linear-gradient(135deg,#eef5ff,#fbfdff);border:1px solid #dce8fa;border-radius:13px}.notice-card strong{font-size:9px}.notice-card p{font-size:8px;color:var(--muted);line-height:1.55;margin:5px 0 0}.activity-list{display:grid}.activity{display:flex;align-items:center;gap:10px;padding:12px 0;border-top:1px solid #eef2f7}.activity:first-child{border-top:0}.activity-main{flex:1}.activity-main strong{font-size:9px;display:block}.activity-main span{font-size:7px;color:var(--muted);display:block;margin-top:4px}.toolbar-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:15px}.tabs{display:flex;gap:4px;padding:4px;background:#eef3f9;border-radius:12px}.tab{border:0;background:transparent;padding:8px 12px;border-radius:9px;color:#7b8799;font-size:8px;font-weight:800}.tab.active{background:#fff;color:var(--blue);box-shadow:0 4px 12px rgba(28,62,112,.07)}.workspace{display:grid;grid-template-columns:repeat(4,minmax(250px,1fr));gap:14px;align-items:start;overflow:auto;padding-bottom:10px}.kanban-column{background:rgba(239,244,250,.72);border:1px solid #e3e9f2;border-radius:16px;padding:12px;min-height:430px;transition:.2s}.kanban-column.drag-over{border-color:#8eb1f6;background:#edf4ff;box-shadow:inset 0 0 0 1px #b9d0ff}.kanban-head{display:flex;align-items:center;justify-content:space-between;padding:3px 4px 11px}.kanban-title{font-size:10px;font-weight:800;display:flex;align-items:center;gap:7px}.kanban-title i{width:7px;height:7px;border-radius:50%;background:#7d8ba0}.progress-col .kanban-title i{background:var(--blue)}.review-col .kanban-title i{background:var(--warning)}.completed-col .kanban-title i{background:var(--success)}.count-badge{min-width:21px;height:21px;border-radius:7px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;font-size:8px;color:#8b97a8}.task-card{background:#fff;border:1px solid #e3e9f2;border-radius:14px;padding:14px;margin-bottom:10px;box-shadow:0 5px 15px rgba(30,57,100,.05);cursor:grab;transition:.22s}.task-card:hover{transform:translateY(-3px);box-shadow:0 13px 25px rgba(30,57,100,.11);border-color:#cfdbed}.task-card.dragging{opacity:.45;transform:rotate(1deg)}.task-top{display:flex;gap:8px;align-items:flex-start}.task-top h4{font-size:10px;line-height:1.45;margin:0;flex:1}.more-dot{border:0;background:transparent;color:#9aa5b5;font-size:16px;line-height:12px}.task-desc{font-size:8px;line-height:1.55;color:var(--muted);margin-top:8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.task-meta{display:flex;gap:5px;flex-wrap:wrap;margin-top:11px}.tag,.status-pill{display:inline-flex;align-items:center;gap:4px;padding:5px 7px;border-radius:7px;font-size:7px;font-weight:800;background:#f0f3f7;color:#718096}.tag.blue{background:#eaf2ff;color:#326fe6}.tag.medium{background:#fff5df;color:#b87913}.tag.high{background:#fff0f2;color:#d04a59}.task-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:1px solid #eef2f6;margin-top:12px;padding-top:10px;font-size:7px;color:#98a3b1}.stack{display:flex}.stack .avatar{margin-left:-5px;border:2px solid #fff}.stack .avatar:first-child{margin-left:0}.drop-zone{height:100px;border:1px dashed #cbd5e4;border-radius:11px;display:grid;place-items:center;color:#9ba7b7;font-size:8px}.section-card{padding:20px}.data-table{width:100%;border-collapse:collapse}.data-table th{text-align:left;color:#8d98a8;font-size:8px;text-transform:uppercase;letter-spacing:.08em;padding:11px;border-bottom:1px solid var(--line)}.data-table td{padding:13px 11px;border-bottom:1px solid #eef2f6;font-size:9px}.data-table tr:hover td{background:#f9fbfe}.list-item{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:14px 0;border-bottom:1px solid #eef2f6}.list-item:last-child{border-bottom:0}.list-main{display:flex;align-items:center;gap:10px}.list-main strong{font-size:10px;display:block}.list-main span{font-size:7px;color:var(--muted);display:block;margin-top:4px}.status-pill.new{background:#edf3ff;color:#2c69dd}.status-pill.progress{background:#edf6ff;color:#1486c9}.status-pill.review{background:#fff5e4;color:#bd7d17}.status-pill.completed{background:#e9f8f1;color:#159367}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.project-card{padding:18px;position:relative;overflow:hidden}.project-card:before{content:"";position:absolute;right:-45px;top:-45px;width:130px;height:130px;border-radius:50%;background:radial-gradient(circle,#e8f2ff,transparent 68%)}.project-color{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--blue),var(--cyan));color:#fff;display:grid;place-items:center;font-size:12px;font-weight:800;box-shadow:0 8px 18px rgba(33,103,243,.18)}.project-card h3{font-size:13px;margin:14px 0 5px}.project-card p{font-size:8px;line-height:1.55;color:var(--muted);min-height:28px}.project-progress{height:6px;background:#edf1f6;border-radius:999px;overflow:hidden;margin:15px 0 8px}.project-progress i{display:block;height:100%;background:linear-gradient(90deg,var(--blue),var(--cyan));border-radius:999px}.project-foot{display:flex;justify-content:space-between;color:#8f99a8;font-size:8px}.profile-layout{display:grid;grid-template-columns:310px 1fr;gap:18px}.profile-hero{padding:25px;text-align:center;background:linear-gradient(160deg,#10295a,#1c62e6);color:#fff;position:relative;overflow:hidden}.profile-hero:after{content:"";position:absolute;width:220px;height:220px;right:-110px;top:-110px;border-radius:50%;background:rgba(255,255,255,.1)}.profile-big{width:92px;height:92px;border-radius:28px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.22);display:grid;place-items:center;margin:0 auto 15px;font-size:24px;font-weight:800;overflow:hidden}.profile-big img{width:100%;height:100%;object-fit:cover}.profile-hero h3{font-size:15px;margin:0}.profile-hero p{font-size:8px;color:rgba(255,255,255,.68);margin:6px 0 22px}.profile-stat{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(255,255,255,.15);padding-top:17px}.profile-stat div{font-size:8px;color:rgba(255,255,255,.65)}.profile-stat b{display:block;color:#fff;font-size:18px;margin-bottom:4px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-group{margin-bottom:14px}.form-group label{display:block;font-size:9px;color:#5e6d82;font-weight:700}.form-control{width:100%;margin-top:7px;padding:11px 12px;border:1px solid var(--line);border-radius:11px;outline:0;background:#fff;color:var(--ink);font-size:9px;transition:.2s}.form-control:focus{border-color:#9bb8ef;box-shadow:0 0 0 4px rgba(33,103,243,.08)}textarea.form-control{resize:vertical}.form-hint{font-size:7px;color:#9ba6b5;margin-top:6px}.password-wrap{position:relative}.password-wrap .form-control{padding-right:58px}.show-pass{position:absolute;right:7px;top:7px;height:29px;border:0;background:#f0f4f9;border-radius:8px;font-size:7px;color:#68778b}.profile-upload{display:flex;align-items:center;gap:12px;margin-bottom:20px}.upload-label{font-size:8px;color:var(--blue);font-weight:800;cursor:pointer}.upload-label input{display:none}.chat-layout{display:grid;grid-template-columns:330px minmax(0,1fr);gap:16px;min-height:650px}.chat-list{overflow:hidden}.chat-search{height:52px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:8px;padding:0 14px;color:#9aa5b5}.chat-search input{border:0;outline:0;width:100%;font-size:9px}.chat-user{display:flex;gap:10px;align-items:center;padding:12px 14px;border-bottom:1px solid #f0f3f7;cursor:pointer;transition:.2s}.chat-user:hover{background:#f8fbff}.chat-user.active{background:#edf4ff}.chat-user-main{flex:1;min-width:0}.chat-user-main strong{font-size:9px;display:block}.chat-user-main span{font-size:7px;color:var(--muted);display:block;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.online{color:var(--success)!important;font-weight:800}.chat-window{display:flex;flex-direction:column;overflow:hidden}.chat-header{padding:16px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.chat-header strong{font-size:11px;display:block}.chat-header div span{font-size:8px;color:var(--muted);display:block;margin-top:3px}.chat-header>span{font-size:7px;color:var(--success);font-weight:800}.messages{flex:1;padding:20px;overflow:auto;background:linear-gradient(180deg,#fbfdff,#f7faff)}.bubble-row{display:flex;margin:0 0 10px}.bubble-row.mine{justify-content:flex-end}.bubble{max-width:72%;padding:10px 12px;border-radius:14px 14px 14px 4px;background:#fff;border:1px solid #e2e8f1;box-shadow:0 4px 12px rgba(30,57,100,.05);font-size:9px;line-height:1.5}.mine .bubble{background:linear-gradient(135deg,var(--blue),var(--blue2));color:#fff;border:0;border-radius:14px 14px 4px 14px}.bubble-time{font-size:6px;opacity:.6;margin-top:5px}.chat-compose{display:flex;gap:8px;padding:13px;border-top:1px solid var(--line);background:#fff}.chat-compose input{flex:1;border:1px solid var(--line);border-radius:11px;padding:11px 12px;outline:0;font-size:9px}.chat-compose input:focus{border-color:#9bb8ef}.backlog-item{display:grid;grid-template-columns:1fr auto;gap:15px;align-items:center;padding:15px;border-bottom:1px solid #eef1f5}.backlog-item:last-child{border-bottom:0}.backlog-item strong{font-size:10px}.backlog-item p{font-size:8px;color:var(--muted);margin:5px 0}.due{color:var(--danger);font-weight:800}.online-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.person-card{padding:15px;display:flex;align-items:center;gap:10px}.person-main{flex:1}.person-card strong{font-size:10px;display:block}.person-card span{font-size:8px;color:var(--muted);display:block;margin-top:4px}.person-status{color:var(--success)!important;font-weight:800}.modal{position:fixed;inset:0;z-index:100;background:rgba(13,27,51,.34);backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;padding:20px}.modal.show{display:flex;animation:fade .18s ease}.modal-box{width:min(620px,100%);max-height:90vh;overflow:auto;background:#fff;border:1px solid rgba(255,255,255,.7);border-radius:22px;box-shadow:0 30px 100px rgba(13,30,65,.25);padding:23px}.modal-box.wide{width:min(900px,100%)}.modal-head{display:flex;justify-content:space-between;gap:20px;margin-bottom:20px}.modal-head h2{font-size:17px;margin:0;letter-spacing:-.03em}.modal-head p{font-size:8px;color:var(--muted);margin:5px 0 0}.close{border:0;background:#f2f5f9;color:#7c899b;width:32px;height:32px;border-radius:10px;font-size:18px}.modal-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:15px;border-top:1px solid var(--line);margin-top:15px}.modal-actions{display:flex;gap:8px}.editor-wrap{border:1px solid var(--line);border-radius:12px;margin-top:7px;overflow:hidden;background:#fff}.rich-toolbar{display:flex;gap:4px;padding:7px;background:#f7f9fc;border-bottom:1px solid var(--line);flex-wrap:wrap}.rich-toolbar button{border:1px solid #e2e8f0;background:#fff;color:#607087;border-radius:8px;min-width:31px;height:29px;font-size:8px;font-weight:800}.rich-toolbar button:hover{color:var(--blue);border-color:#bcd0f1;background:#f5f9ff}.editor{min-height:150px;padding:13px;outline:0;font-size:9px;line-height:1.7}.editor:empty:before{content:attr(data-placeholder);color:#a3adbb}.multi-picker{position:relative;margin-top:7px}.picker-button{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:11px;background:#fff;text-align:left;display:flex;justify-content:space-between;align-items:center;color:#6b788c;font-size:9px}.picker-menu{display:none;position:absolute;z-index:10;left:0;right:0;top:47px;background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:var(--shadow);padding:8px;max-height:240px;overflow:auto}.multi-picker.open .picker-menu{display:block;animation:pop .16s ease}.picker-option{display:flex;align-items:center;gap:9px;padding:9px;border-radius:8px;font-size:8px}.picker-option:hover{background:#f6f9fd}.picker-option input{accent-color:var(--blue)}.picker-search{width:100%;padding:9px;border:1px solid var(--line);border-radius:8px;font-size:8px;outline:0;margin-bottom:5px}.empty{display:grid;place-items:center;text-align:center;color:#9aa5b5;font-size:8px;min-height:100px;padding:20px}.empty-icon{width:38px;height:38px;border-radius:12px;background:#eef4ff;color:var(--blue);display:grid;place-items:center;margin-bottom:8px}.toast{position:fixed;z-index:200;right:22px;bottom:22px;display:none;max-width:360px;padding:12px 15px;border-radius:12px;background:#17233a;color:#fff;font-size:9px;box-shadow:0 18px 40px rgba(9,20,42,.22)}.toast.show{display:block;animation:toastIn .25s ease}.mobile-overlay{display:none}@keyframes fade{from{opacity:0}to{opacity:1}}@keyframes pop{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}@keyframes toastIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@media(max-width:1200px){.sidebar{width:250px}.main-area{margin-left:250px}.content-wrap{padding:30px 26px}.workspace{grid-template-columns:repeat(2,minmax(260px,1fr))}.project-grid,.online-grid{grid-template-columns:repeat(2,1fr)}.search-box{width:220px}}@media(max-width:900px){.sidebar{transform:translateX(-105%);transition:transform .25s ease;width:280px;box-shadow:25px 0 70px rgba(15,32,60,.18)}body.nav-open .sidebar{transform:none}.sidebar-close{display:grid}.mobile-overlay{position:fixed;inset:0;z-index:45;background:rgba(12,24,45,.25);backdrop-filter:blur(3px)}body.nav-open .mobile-overlay{display:block}.main-area{margin-left:0}.mobile-menu{display:grid}.topbar{padding:0 16px}.top-user div:nth-child(2),.top-user>span{display:none}.content-wrap{padding:24px 16px}.dashboard-grid{grid-template-columns:1fr}.kpis{grid-template-columns:repeat(2,1fr)}.profile-layout{grid-template-columns:1fr}.chat-layout{grid-template-columns:1fr}.chat-list{max-height:360px}.online-grid{grid-template-columns:1fr}}@media(max-width:620px){.topbar{height:68px}.crumbs span,.crumbs b{display:none}.search-box{width:150px}.top-actions{gap:5px}.top-icon{width:36px;height:36px}.page-heading{align-items:flex-start;flex-direction:column}.page-heading h1{font-size:24px}.kpis{gap:9px}.kpi{padding:14px}.kpi-number{font-size:24px}.workspace{grid-template-columns:1fr}.project-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.modal{padding:8px}.modal-box{padding:17px;border-radius:18px}.online-grid{grid-template-columns:1fr}.data-table{min-width:650px}.section-card{overflow:auto}.bubble{max-width:86%}.notif-panel{position:fixed;left:10px;right:10px;top:60px;width:auto}.chat-compose .btn{padding-left:11px;padding-right:11px}}@media(max-width:420px){.search-box{width:125px}.top-icon{display:none}.notification-btn{display:grid}.kpis{grid-template-columns:1fr 1fr}.kpi-label{font-size:8px}.content-wrap{padding:20px 12px}.panel,.section-card{padding:15px}}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.inline-control{display:flex;align-items:center;gap:7px}.inline-control .form-control{margin-top:7px}.inline-control .icon-btn{width:40px;height:40px;margin-top:7px;flex:none}.date-control{position:relative}.date-control svg{position:absolute;left:11px;top:17px;width:15px;color:#8e9aab;z-index:1}.date-control .form-control{padding-left:34px}.upload-box{display:flex;align-items:center;gap:10px;padding:12px;border:1px dashed #cbd6e5;border-radius:12px;background:#f9fbfe;margin-top:7px}.upload-box>div:first-child{width:32px;height:32px;border-radius:9px;background:#edf4ff;color:var(--blue);display:grid;place-items:center}.upload-box strong{font-size:8px;display:block}.upload-box span{font-size:7px;color:var(--muted);display:block;margin-top:2px}.upload-box input{display:none}.upload-box .btn{margin-left:auto}.subtask-add,.comment-compose{display:flex;gap:7px;align-items:center}.subtask-add .form-control,.comment-compose .form-control{margin-top:0}.subtask-item{display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:10px;background:#f7f9fc;border:1px solid #edf1f6;font-size:8px;margin-bottom:6px}.subtask-item input{accent-color:var(--blue)}.comment{padding:10px 0;border-bottom:1px solid #eef2f6}.comment-head{display:flex;align-items:center;gap:7px}.comment-head b{font-size:8px}.comment-head span{font-size:7px;color:#99a4b3;margin-left:auto}.comment p{font-size:8px;line-height:1.55;color:#68778c;margin:5px 0 0 36px}.attachment{display:flex;align-items:center;gap:8px;padding:9px;border:1px solid var(--line);border-radius:10px;font-size:8px;margin-bottom:6px}.attachment svg{width:15px;color:var(--blue)}.attachment a{color:var(--blue);font-weight:800;flex:1}.attachment span{font-size:7px;color:#9aa5b5}.avatar-change{display:inline-flex;align-items:center;gap:6px;padding:7px 9px;border:1px solid rgba(255,255,255,.22);border-radius:9px;color:#fff;background:rgba(255,255,255,.1);font-size:8px;font-weight:800;cursor:pointer;margin-bottom:14px}.avatar-change input{display:none}.project-card-top{display:flex;align-items:center;justify-content:space-between}.project-add{width:100%;margin-top:14px;border:1px solid var(--line);background:#f8fbff;color:var(--blue);border-radius:9px;padding:8px;font-size:8px;font-weight:800;display:flex;align-items:center;justify-content:center;gap:5px}.project-add svg{width:13px}.activity-icon{width:34px;height:34px;border-radius:10px;background:#edf4ff;color:var(--blue);display:grid;place-items:center;flex:none}.activity-icon svg{width:15px}.notice-card{display:flex;align-items:flex-start;gap:10px;margin-top:12px}.notice-card>div:first-child{width:29px;height:29px;border-radius:8px;background:#fff;color:var(--blue);display:grid;place-items:center;flex:none}.notice-card>div:first-child svg{width:14px}.notification-item{display:flex;gap:10px;padding:12px 3px;border-bottom:1px solid #eef2f6}.notification-item:last-child{border-bottom:0}.notification-icon{width:30px;height:30px;border-radius:9px;background:#edf4ff;color:var(--blue);display:grid;place-items:center;flex:none}.notification-icon svg{width:14px}.notification-item b{font-size:8px;display:block}.notification-item span{font-size:7px;color:#7d899a;display:block;line-height:1.45;margin-top:3px}.notification-item small{font-size:6px;color:#a3adba;display:block;margin-top:4px}.chat-user-side{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.chat-user-side b{min-width:17px;height:17px;border-radius:50%;display:grid;place-items:center;background:var(--blue);color:#fff;font-size:7px}.chat-user-side i{width:7px;height:7px;border-radius:50%;background:#c5ccd6}.chat-user-side i.is-online{background:var(--success);box-shadow:0 0 0 4px rgba(24,166,115,.08)}.avatar.tiny{width:25px;height:25px;border-radius:8px;margin-top:2px}.bubble-row{gap:7px;align-items:flex-start}.bubble-row.mine .avatar{display:none}.status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#c3cbd6;margin-right:5px}.status-dot.on{background:var(--success);box-shadow:0 0 0 3px rgba(24,166,115,.08)}.table-scroll{overflow:auto}.select-lite{border:1px solid var(--line);background:#fff;border-radius:10px;padding:9px 12px;font-size:8px;color:#67758a;outline:0}.task-type{width:24px;height:24px;border-radius:7px;background:#f2f6fc;color:var(--blue);display:grid;place-items:center;flex:none}.task-type svg{width:12px}.task-top .more-dot{width:24px;height:24px;display:grid;place-items:center}.more-dot svg{width:14px}.form-hint{line-height:1.4}@media(max-width:900px){.detail-grid{grid-template-columns:1fr}}@media(max-width:620px){.upload-box{flex-wrap:wrap}.upload-box .btn{margin-left:0}.comment-compose{align-items:stretch}.comment-compose .btn{padding:10px}.backlog-item{grid-template-columns:auto 1fr}.backlog-item .row{grid-column:2}.backlog-item .status-pill{font-size:6px}}

/* Xentra v7 polish + auth stability */
:root{--blue:#2167f3;--blue2:#5a8cff;--ink:#12213b;--muted:#718096;--line:#e6edf6;--surface:#fff;--soft:#f4f7fb;--shadow:0 18px 55px rgba(24,55,105,.10)}
svg.ui-icon{width:1em;height:1em;display:block;flex:0 0 auto}
button,.btn,a,.nav-item,.task-card,.person-card,.project-card,.chat-user,.kpi{transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease,border-color .18s ease,color .18s ease}
button:active,.btn:active{transform:translateY(1px)}
.btn:hover{transform:translateY(-1px);box-shadow:0 10px 26px rgba(33,103,243,.14)}
.card{box-shadow:var(--shadow)}
.task-card:hover,.project-card:hover,.person-card:hover,.kpi:hover{transform:translateY(-3px);box-shadow:0 24px 60px rgba(24,55,105,.14)}
.rich-toolbar button{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;font-size:11px}
.editor{font-size:14px;min-height:190px;line-height:1.65}
.editor h3{font-size:18px;margin:12px 0 6px}.editor ul{padding-left:22px}.editor a{color:var(--blue)}
.multi-picker .picker-button{font-size:13px;min-height:46px}.picker-option{font-size:13px;min-height:42px}.picker-option small{font-size:11px;color:#96a2b2;display:block;margin-top:2px}.picker-search{font-size:13px;padding:11px}
.form-control,.select-lite{font-size:13px;min-height:44px}.form-group label{font-size:12px;font-weight:700;color:#44536a}.form-hint{font-size:11px}
.project-modal{max-width:650px}.project-create-hero{display:flex;align-items:center;gap:14px;padding:16px;border:1px solid #dfe9fb;background:linear-gradient(135deg,#f5f9ff,#eef5ff);border-radius:16px;margin-bottom:20px}.project-orb{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,#2167f3,#6b96ff);color:#fff;box-shadow:0 10px 25px rgba(33,103,243,.24)}.project-orb svg{width:22px}.project-create-hero strong{display:block;font-size:13px;color:var(--ink)}.project-create-hero span{display:block;color:#7c899b;font-size:11px;margin-top:3px}.project-create-tip{display:flex;align-items:center;gap:8px;padding:11px 13px;border-radius:11px;background:#f7faff;color:#5d6d84;font-size:11px}.project-create-tip svg{color:var(--blue);width:16px}
/* Auth pages: consistent, spacious and responsive */
body.auth{min-height:100vh;margin:0;background:radial-gradient(circle at 15% 10%,rgba(90,140,255,.16),transparent 34%),radial-gradient(circle at 85% 85%,rgba(33,103,243,.10),transparent 36%),#f5f8fc;display:grid;place-items:center;padding:24px;box-sizing:border-box}
.auth-shell{width:100%;max-width:1120px;display:grid;grid-template-columns:minmax(0,1fr) 460px;min-height:680px;background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.9);border-radius:30px;box-shadow:0 35px 100px rgba(24,55,105,.15);overflow:hidden;backdrop-filter:blur(18px)}
.auth-shell:before{display:none}
.auth-card{width:auto;max-width:none;padding:58px 54px;display:flex;flex-direction:column;justify-content:center;background:#fff}.auth-brand{margin-bottom:24px}.auth-brand img{max-width:180px;height:auto}.auth-card h1{font-size:32px;line-height:1.1;margin:0 0 10px;color:var(--ink);letter-spacing:-.04em}.auth-card .muted{font-size:13px;line-height:1.6;margin:0 0 25px}.auth-card form{display:grid;gap:16px}.auth-card form>label{font-size:12px;font-weight:700;color:#41516a}.auth-card input{width:100%;box-sizing:border-box;margin-top:7px;height:48px;border:1px solid #dfe6f0;border-radius:12px;padding:0 14px;font:inherit;font-size:14px;outline:0;background:#fbfcfe}.auth-card input:focus{border-color:#7ba2ff;box-shadow:0 0 0 4px rgba(33,103,243,.10);background:#fff}.auth-card .grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.auth-card .password{position:relative;display:flex}.auth-card .password input{padding-right:70px}.auth-card .password button{position:absolute;right:7px;top:14px;border:0;background:transparent;color:var(--blue);font-size:11px;font-weight:800;cursor:pointer}.auth-card .btn{min-height:48px;font-size:13px}.auth-card .back{margin-top:18px;text-align:center;font-size:12px}.auth-card .divider{margin:18px 0;color:#a2adbc;font-size:11px;text-align:center}.alert{font-size:12px!important;padding:12px 14px!important;border-radius:11px!important;margin-bottom:14px!important}
@media(max-width:900px){.auth-shell{grid-template-columns:1fr;max-width:520px;min-height:auto}.auth-shell:before{display:none}.auth-card{padding:38px 28px}.auth-card h1{font-size:28px}}
@media(max-width:480px){body.auth{padding:10px}.auth-card{padding:30px 20px}.auth-card .grid2{grid-template-columns:1fr}.auth-card h1{font-size:25px}}

/* v8 stability + interaction layer */
*,*::before,*::after{box-sizing:border-box}
button,input,select,textarea{font:inherit}
html{scroll-behavior:smooth}
body{overflow-x:hidden}
.ui-icon{vertical-align:middle}
.btn .ui-icon,.nav-icon .ui-icon,.top-icon .ui-icon,.icon-btn .ui-icon{pointer-events:none}
@keyframes xentraPulse{0%,100%{box-shadow:0 0 0 0 rgba(33,103,243,.18)}50%{box-shadow:0 0 0 7px rgba(33,103,243,0)}}
.notification-btn:hover .ui-icon{animation:xentraPulse 1.4s ease-in-out infinite}
.nav-item:hover .nav-icon,.quick-arrow:hover,.icon-btn:hover{transform:translateY(-1px)}
.modal.show .modal-box{animation:xentraModal .2s ease-out both}
@keyframes xentraModal{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
.auth-card .btn.primary{box-shadow:0 12px 26px rgba(33,103,243,.18)}
.auth-card label{display:block;min-width:0}
.auth-card input,.auth-card select{display:block}
.auth-card .password{width:100%;min-width:0}
.auth-card .password input{min-width:0}
@media(max-width:600px){.auth-shell{width:100%;border-radius:20px}.auth-card{width:100%;padding:28px 20px}.auth-card .grid2{gap:10px}.auth-card input{height:46px}}
/* Xentra v15 - working v9 foundation, refined UI */
:root{--font-size-base:14px}
body{font-size:14px}
.sidebar-close{font-size:0!important}
.sidebar-close .ui-icon{width:18px;height:18px}
.workspace-switcher{cursor:default}.workspace-switcher>svg{display:none!important}
.side-label-gap,.quick-card,.storage{display:none!important}
.side-nav{gap:5px}.nav-item{font-size:14px;min-height:44px}.nav-icon{width:20px;height:20px}.nav-icon .ui-icon{width:18px;height:18px}
.main-area{min-width:0}.content-wrap{padding:30px 34px}.page-heading h1{font-size:30px}.page-heading p{font-size:14px}.crumbs{font-size:13px}.search-box input{font-size:13px}
/* compact task editor */
.compact-task{max-height:92vh;overflow:auto}.task-title-row{display:grid;grid-template-columns:minmax(0,1fr) 190px;gap:12px}.task-under-title{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}.upload-box.compact{min-height:58px;padding:8px 10px}.upload-box.compact strong{font-size:12px}.upload-box.compact span{font-size:10px}.choice-grid{display:grid;gap:7px;grid-template-columns:repeat(4,1fr)}.priority-choice{grid-template-columns:repeat(3,1fr)}.choice-btn{border:1px solid var(--line);background:#fff;border-radius:11px;padding:10px 8px;display:flex;align-items:center;justify-content:center;gap:6px;color:#607087;font-weight:700;font-size:11px;cursor:pointer}.choice-btn .ui-icon{width:16px;height:16px}.choice-btn.selected{border-color:#7ba2ff;background:#eef5ff;color:var(--blue);box-shadow:0 5px 15px rgba(33,103,243,.10)}.member-option-text{min-width:0}.member-option-text strong{font-size:12px;display:block}.member-option-text small{font-size:10px!important;color:#8793a5;display:block;margin-top:2px}.picker-option{padding:9px 10px!important;gap:9px!important}.picker-option input{accent-color:var(--blue)}
/* members */
.members-panel{overflow:hidden}.member-search{display:flex;align-items:center;gap:7px;border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 11px}.member-search .ui-icon{width:15px;color:#8a97aa}.member-search input{border:0;outline:0;font-size:12px;min-width:200px}.member-list{display:flex;flex-direction:column}.member-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto auto;align-items:center;gap:12px;padding:12px 2px;border-bottom:1px solid #edf1f6}.member-row:last-child{border-bottom:0}.member-main strong{display:block;font-size:13px}.member-main span{display:block;color:#8995a6;font-size:11px;margin-top:3px}.role-pill{padding:5px 8px;border-radius:999px;background:#f3f6fb;color:#63728a;font-size:10px;font-weight:800;text-transform:capitalize}.member-actions{display:flex;gap:5px}.danger-icon{color:#b52f3d}.member-modal{max-width:650px}
/* auth only form */
.auth-shell{display:block;max-width:520px;min-height:auto}.auth-card{padding:46px 44px}.auth-card h1{font-size:30px}.auth-brand{display:flex;justify-content:flex-start}.auth-brand img{max-width:190px}
@media(max-width:760px){.content-wrap{padding:22px 16px}.task-title-row,.task-under-title{grid-template-columns:1fr}.choice-grid{grid-template-columns:repeat(2,1fr)}.member-row{grid-template-columns:auto 1fr auto}.member-row>.role-pill,.member-row>.status-pill{display:none}.member-search input{min-width:0;width:100%}}
/* Xentra v15: working v9 foundation refinements */
*,*::before,*::after{box-sizing:border-box}body{font-size:14px;overflow-x:hidden}.sidebar-close{font-size:0!important}.sidebar-close .ui-icon{width:18px;height:18px}.workspace-switcher>svg{display:none!important}.side-label-gap,.quick-card,.storage{display:none!important}.nav-item{font-size:14px;min-height:44px}.nav-icon{width:20px;height:20px}.content-wrap{padding:30px 34px}.page-heading h1{font-size:30px}.page-heading p{font-size:14px}.search-box input{font-size:13px}.compact-task{max-height:92vh;overflow:auto}.task-title-row{display:grid;grid-template-columns:minmax(0,1fr) 190px;gap:12px}.task-under-title{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}.upload-box.compact{min-height:58px;padding:8px 10px}.upload-box.compact strong{font-size:12px}.upload-box.compact span{font-size:10px}.choice-grid{display:grid;gap:7px;grid-template-columns:repeat(4,1fr)}.priority-choice{grid-template-columns:repeat(3,1fr)}.choice-btn{border:1px solid var(--line);background:#fff;border-radius:11px;padding:10px 8px;display:flex;align-items:center;justify-content:center;gap:6px;color:#607087;font-weight:700;font-size:11px;cursor:pointer}.choice-btn .ui-icon{width:16px;height:16px}.choice-btn.selected{border-color:#7ba2ff;background:#eef5ff;color:var(--blue);box-shadow:0 5px 15px rgba(33,103,243,.10)}.picker-option{padding:9px 10px!important;gap:9px!important}.member-option-text{min-width:0}.member-option-text strong{font-size:12px;display:block}.member-option-text small{font-size:10px!important;color:#8793a5;display:block;margin-top:2px}.members-panel{overflow:hidden}.member-search{display:flex;align-items:center;gap:7px;border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 11px}.member-search input{border:0;outline:0;font-size:12px;min-width:200px}.member-list{display:flex;flex-direction:column}.member-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto auto;align-items:center;gap:12px;padding:12px 2px;border-bottom:1px solid #edf1f6}.member-row:last-child{border-bottom:0}.member-main strong{display:block;font-size:13px}.member-main span{display:block;color:#8995a6;font-size:11px;margin-top:3px}.role-pill{padding:5px 8px;border-radius:999px;background:#f3f6fb;color:#63728a;font-size:10px;font-weight:800;text-transform:capitalize}.member-actions{display:flex;gap:5px}.danger-icon{color:#b52f3d}.member-modal{max-width:650px}.auth-shell{display:block;max-width:520px;min-height:auto}.auth-card{padding:46px 44px}.auth-brand{display:flex;justify-content:flex-start}.auth-brand img{max-width:190px}@media(max-width:760px){.content-wrap{padding:22px 16px}.task-title-row,.task-under-title{grid-template-columns:1fr}.choice-grid{grid-template-columns:repeat(2,1fr)}.member-row{grid-template-columns:auto 1fr auto}.member-row>.role-pill,.member-row>.status-pill{display:none}.member-search input{min-width:0;width:100%}}


/* Xentra v16 — task controls, dark mode, responsive member picker */
:root{--panel-glass:rgba(255,255,255,.92);--input-bg:#fff;--picker-bg:#fff;--picker-hover:#f4f7fb;--picker-text:#25324a}
body{font-size:14px;transition:background .25s ease,color .25s ease}
.select-menu{position:relative;width:100%;margin-top:7px}.select-trigger{width:100%;min-height:46px;border:1px solid var(--line);background:var(--input-bg);color:var(--ink);border-radius:12px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;gap:10px;box-shadow:0 4px 14px rgba(25,54,100,.04);transition:.2s}.select-trigger:hover,.select-menu.open .select-trigger{border-color:#9bb8ef;box-shadow:0 0 0 4px rgba(33,103,243,.08)}.select-current{display:flex;align-items:center;gap:9px;font-weight:700}.select-current .ui-icon{width:17px;color:var(--blue)}.select-trigger>.ui-icon{width:16px;color:#8996aa;transition:.2s}.select-menu.open .select-trigger>.ui-icon{transform:rotate(180deg)}.select-options{position:absolute;z-index:120;left:0;right:0;top:calc(100% + 7px);padding:7px;background:var(--picker-bg);border:1px solid var(--line);border-radius:14px;box-shadow:0 22px 55px rgba(15,34,67,.18);opacity:0;visibility:hidden;transform:translateY(-5px) scale(.99);transition:.16s}.select-menu.open .select-options{opacity:1;visibility:visible;transform:none}.select-option{width:100%;border:0;background:transparent;color:var(--picker-text);padding:10px 11px;border-radius:9px;display:flex;align-items:center;gap:9px;text-align:left;font-size:12px;font-weight:700}.select-option:hover,.select-option.selected{background:var(--picker-hover);color:var(--blue)}.select-option .ui-icon:first-child{width:17px;color:var(--blue)}.select-option .option-check{margin-left:auto}.select-option .option-check .ui-icon{width:15px}
.multi-picker{position:relative;margin-top:7px}.picker-button{width:100%;min-height:46px;border:1px solid var(--line);background:var(--input-bg);color:var(--ink);border-radius:12px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;font-weight:700;box-shadow:0 4px 14px rgba(25,54,100,.04)}.picker-button>.ui-icon{width:16px;color:#8996aa;transition:.2s}.multi-picker.open .picker-button>.ui-icon{transform:rotate(180deg)}.picker-menu{position:absolute;z-index:125;left:0;right:0;top:calc(100% + 7px);background:var(--picker-bg);border:1px solid #39404a;border-radius:10px;box-shadow:0 24px 55px rgba(0,0,0,.3);padding:8px;display:none;overflow:hidden}.multi-picker.open .picker-menu{display:block;animation:pickerIn .16s ease-out}.picker-search{width:100%;height:34px;border:0;border-radius:7px;background:#202020;color:#f7f7f7;padding:0 11px;outline:0;font-size:12px}.picker-search::placeholder{color:#a9a9a9}.picker-label{font-size:13px;font-weight:700;color:#999;padding:12px 8px 7px}.picker-menu #assigneeOptions{max-height:315px;overflow-y:auto;padding-right:2px}.picker-menu #assigneeOptions::-webkit-scrollbar{width:7px}.picker-menu #assigneeOptions::-webkit-scrollbar-thumb{background:#929292;border-radius:8px}.picker-option{display:grid!important;grid-template-columns:auto 1fr auto;align-items:center;gap:10px!important;width:100%;min-height:49px;padding:7px 9px!important;border-radius:8px;cursor:pointer;color:#eee;background:transparent;transition:.15s}.picker-option:hover,.picker-option.selected{background:#303030}.picker-option input{position:absolute;opacity:0;pointer-events:none}.picker-option .avatar{width:34px;height:34px;border-radius:50%;font-size:10px}.member-option-text strong{font-size:13px!important;color:#f2f2f2!important;line-height:1.2}.member-option-text small{font-size:10px!important;color:#a8a8a8!important;margin-top:3px}.member-option-text em{font-style:normal;color:#5de0a4;margin-left:4px}.member-check{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;color:transparent}.member-check .ui-icon{width:17px}.picker-option.selected .member-check{color:#5c8dff}.picker-menu .empty{color:#aaa;padding:15px 10px;font-size:12px}
.attachment-list,.subtask-list{margin-top:7px;max-height:110px;overflow:auto}.attachment.pending{background:var(--surface-2)}.attachment.pending>span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.remove-pending{border:0;background:transparent;color:#9aa5b5;width:25px;height:25px;border-radius:7px;display:grid;place-items:center}.remove-pending:hover{background:#eef2f7;color:var(--danger)}.subtask-item{position:relative;min-height:38px}.subtask-item>span:nth-child(2){flex:1;min-width:0}.pending-sub .ui-icon{width:15px;color:var(--blue)}.pending-sub .remove-pending{margin-left:auto}.btn.danger{background:#fff0f2;color:var(--danger);border:1px solid #f4cbd1}.btn.danger:hover{background:#ffe4e8;border-color:#eaaab4}.compact-task{max-height:calc(100vh - 28px);overflow-y:auto;overflow-x:hidden}.compact-task::-webkit-scrollbar{width:8px}.compact-task::-webkit-scrollbar-thumb{background:#cbd4e1;border-radius:8px}.modal-footer{position:sticky;bottom:0;background:var(--surface);padding-top:12px}
@keyframes pickerIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
/* dark theme */
html[data-theme="dark"]{--bg:#0d1117;--surface:#151a21;--surface-2:#1b222c;--ink:#edf2fa;--muted:#9aa6b8;--line:#293241;--panel-glass:rgba(21,26,33,.94);--input-bg:#171d25;--picker-bg:#202020;--picker-hover:#303030;--picker-text:#f1f4f8;--shadow:0 20px 60px rgba(0,0,0,.35);--shadow2:0 10px 30px rgba(0,0,0,.28)}html[data-theme="dark"] body{background:var(--bg);color:var(--ink)}html[data-theme="dark"] body:before{background:radial-gradient(circle at 82% 0,rgba(33,103,243,.14),transparent 32%),radial-gradient(circle at 0 70%,rgba(36,183,255,.07),transparent 28%)}html[data-theme="dark"] .sidebar{background:rgba(15,19,25,.9);border-color:var(--line)}html[data-theme="dark"] .workspace-switcher{background:linear-gradient(135deg,#151b24,#11161e);border-color:var(--line)}html[data-theme="dark"] .nav-item{color:#aeb8c8}html[data-theme="dark"] .nav-item:hover{background:#1b222c;color:#fff}html[data-theme="dark"] .nav-item.active{background:linear-gradient(90deg,#182b50,#151d2b);color:#78a1ff}html[data-theme="dark"] .topbar{background:rgba(13,17,23,.76);border-color:var(--line)}html[data-theme="dark"] .search-box,html[data-theme="dark"] .top-icon,html[data-theme="dark"] .icon-btn,html[data-theme="dark"] .card,html[data-theme="dark"] .select-lite,html[data-theme="dark"] .form-control,html[data-theme="dark"] .select-trigger,html[data-theme="dark"] .picker-button{background:var(--surface);border-color:var(--line);color:var(--ink)}html[data-theme="dark"] .search-box input{color:var(--ink)}html[data-theme="dark"] .card:hover{box-shadow:0 16px 40px rgba(0,0,0,.28)}html[data-theme="dark"] .task-card{background:#171d25;border-color:var(--line)}html[data-theme="dark"] .task-desc,html[data-theme="dark"] .panel-sub,html[data-theme="dark"] .form-hint{color:#9aa6b8}html[data-theme="dark"] .upload-box,html[data-theme="dark"] .subtask-item{background:#1b222c;border-color:#303a49}html[data-theme="dark"] .editor,.html[data-theme="dark"] .rich-toolbar{background:#151a21;border-color:var(--line);color:var(--ink)}html[data-theme="dark"] .rich-toolbar button{color:#c8d1df}html[data-theme="dark"] .notif-panel{background:var(--surface);border-color:var(--line)}html[data-theme="dark"] .notification-item{border-color:var(--line)}html[data-theme="dark"] .project-add{background:#18202b;border-color:var(--line)}html[data-theme="dark"] .btn.ghost{background:var(--surface);color:#c2ccda;border-color:var(--line)}html[data-theme="dark"] .modal-box{background:var(--surface);border-color:var(--line);color:var(--ink)}html[data-theme="dark"] .modal-footer{background:var(--surface)}html[data-theme="dark"] .member-search{background:var(--surface);border-color:var(--line)}
@media(max-width:900px){.picker-menu{position:fixed;left:12px;right:12px;top:50%;transform:translateY(-50%);max-height:72vh}.multi-picker.open .picker-menu{animation:pickerMobile .18s ease-out}.task-under-title{grid-template-columns:1fr}.task-title-row{grid-template-columns:1fr}.compact-task{max-height:calc(100vh - 16px)}}
@keyframes pickerMobile{from{opacity:0;transform:translateY(calc(-50% + 8px))}to{opacity:1;transform:translateY(-50%)}}

.auth-card{position:relative}
html[data-theme="dark"] body.auth{background:radial-gradient(circle at 15% 10%,rgba(33,103,243,.18),transparent 34%),#0d1117}html[data-theme="dark"] .auth-shell{background:#151a21;border-color:#293241;box-shadow:0 35px 100px rgba(0,0,0,.4)}html[data-theme="dark"] .auth-card{background:#151a21}html[data-theme="dark"] .auth-card h1{color:#edf2fa}html[data-theme="dark"] .auth-card .muted,html[data-theme="dark"] .auth-card label{color:#aeb8c8}html[data-theme="dark"] .auth-card input{background:#10151c;color:#edf2fa;border-color:#303a49}html[data-theme="dark"] .auth-card input:focus{background:#151a21}html[data-theme="dark"] .auth-card .divider{color:#738096}

/* v17 task editor layout and reliable file/subtask controls */
.task-title-full,.task-date-row{width:100%}
.task-date-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.task-title-full .form-control{width:100%}
.task-two-col{grid-template-columns:1fr 1fr}
.task-two-col .form-group{min-width:0}
.clickable-upload{cursor:pointer;transition:.18s ease;border-style:dashed}
.clickable-upload:hover{border-color:#86aaf5;background:#f4f8ff;transform:translateY(-1px)}
.clickable-upload .upload-copy{min-width:0}
.upload-box strong{font-size:12px!important}
.upload-box span{font-size:10px!important;line-height:1.35}
.upload-box input{display:none!important}
.upload-box .btn{font-size:11px}
.subtask-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.subtask-heading label{margin-bottom:0}
.subtask-list{max-height:220px;overflow:auto}
.subtask-item{font-size:12px!important;min-height:42px}
.subtask-item input{width:16px;height:16px;flex:none}
.pending-sub{background:var(--surface-2)!important}
@media(max-width:700px){.task-date-row,.task-two-col{grid-template-columns:1fr}.subtask-heading{align-items:flex-start;flex-direction:column;gap:3px}}
html[data-theme="dark"] .clickable-upload:hover{background:#202a38;border-color:#5f8ff5}

/* v18 task editor refinements */
.project-select-row{display:grid;grid-template-columns:minmax(0,1fr) 46px;gap:8px;align-items:end}
.project-select-row .select-menu{margin-top:7px}
.selected-avatar-stack{display:inline-flex;align-items:center;margin-right:7px;vertical-align:middle}
.selected-avatar-stack .avatar{width:26px!important;height:26px!important;border:2px solid var(--surface);margin-left:-7px;font-size:8px!important}
.selected-avatar-stack .avatar:first-child{margin-left:0}
.picker-button .selected-avatar-stack + span{font-weight:800}
.pending-sub{cursor:pointer;display:flex;align-items:center;gap:10px}
.pending-sub input[type=checkbox]{appearance:none;-webkit-appearance:none;width:19px;height:19px;border:1.5px solid #aab5c5;border-radius:6px;background:transparent;display:grid;place-items:center;flex:none;cursor:pointer}
.pending-sub input[type=checkbox]:checked{background:var(--blue);border-color:var(--blue)}
.pending-sub input[type=checkbox]:checked::after{content:'✓';color:#fff;font-size:13px;font-weight:900;line-height:1}
.pending-sub.done>span{color:#8793a5;text-decoration:line-through}
@media(max-width:700px){.project-select-row{grid-template-columns:1fr 42px}}

/* v19 task editor refinement */
.task-editor-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px;align-items:start;min-height:0}
.task-editor-layout.create-layout{display:block}
.task-editor-main{min-width:0}
.task-comments-side{position:sticky;top:0;height:calc(100vh - 180px);min-height:360px;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:14px;background:var(--surface-2);padding:15px;overflow:hidden}
.comments-side-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.comments-side-head h3{margin:3px 0 2px;font-size:14px}.comments-side-head p{margin:0;color:var(--muted);font-size:9px;line-height:1.45}.comments-side-head>.ui-icon{width:20px;color:var(--blue);flex:none;margin-top:2px}
.task-comments-side .comment-list{flex:1;overflow:auto;padding-right:4px}.task-comments-side .comment{padding:11px 2px}.task-comments-side .comment-head b{font-size:9px}.task-comments-side .comment-head span{font-size:7px}.task-comments-side .comment p{font-size:9px;margin-left:34px}.task-comments-side .comment-compose{border-top:1px solid var(--line);padding-top:12px;margin-top:10px;align-items:flex-end}.task-comments-side .comment-compose .form-control{min-height:42px}.task-comments-side .comment-compose .btn{white-space:nowrap}
.subtask-item{display:flex!important;align-items:center!important;gap:10px!important}.subtask-item .check-wrap{width:20px;height:20px;position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none}.subtask-item .check-wrap input{position:absolute;inset:0;width:20px!important;height:20px!important;margin:0;opacity:0;cursor:pointer;z-index:2}.subtask-item .fake-check{width:18px;height:18px;border:1.5px solid #b9c5d5;border-radius:5px;background:var(--surface);display:grid;place-items:center;color:#fff;pointer-events:none}.subtask-item .fake-check .ui-icon{width:12px;height:12px}.subtask-item input:checked + .fake-check{background:var(--blue);border-color:var(--blue)}.subtask-item .subtask-label{flex:1;min-width:0;line-height:1.35;text-align:left}.subtask-item.done .subtask-label{text-decoration:line-through;color:var(--muted)}
html[data-theme="dark"] .task-comments-side{background:#1b222c;border-color:var(--line)}html[data-theme="dark"] .subtask-item .fake-check{background:#151a21;border-color:#465265}
@media(max-width:1050px){.task-editor-layout{grid-template-columns:1fr}.task-comments-side{position:relative;height:360px;min-height:0}}

/* v20 task collaboration layout */
.task-modal-shell{display:flex;align-items:stretch;justify-content:center;gap:14px;width:min(1260px,calc(100vw - 32px));max-height:calc(100vh - 32px)}
.task-modal-shell>.modal-box{flex:1 1 auto;width:min(900px,calc(100vw - 380px));max-width:900px;max-height:calc(100vh - 32px)}
.task-modal-shell>.task-comments-side{flex:0 0 330px;width:330px;height:auto;max-height:calc(100vh - 32px);position:relative;top:auto;align-self:stretch}
.task-comments-side{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow2);border-radius:18px}
.task-comments-side .comment-list{min-height:0}
.subtask-list .subtask-item{padding:9px 10px!important;border:1px solid var(--line);border-radius:10px;margin-bottom:7px;background:var(--surface-2);box-sizing:border-box}
.subtask-list .subtask-label{font-size:12px;font-weight:600;color:var(--ink);overflow-wrap:anywhere}
.subtask-list .subtask-item.done .subtask-label{color:var(--muted);text-decoration:line-through}
.subtask-list .check-wrap{margin-left:0}
@media(max-width:1050px){.task-modal-shell{width:min(900px,calc(100vw - 20px));max-height:calc(100vh - 16px);overflow:auto;display:block}.task-modal-shell>.modal-box{width:100%;max-width:none;max-height:none}.task-modal-shell>.task-comments-side{width:100%;max-height:none;height:360px;margin-top:12px}.task-modal-shell .modal-footer{position:sticky;bottom:0}}
@media(max-width:620px){.task-modal-shell{width:calc(100vw - 16px)}.task-modal-shell>.task-comments-side{height:320px}.task-comments-side .comment-compose{flex-direction:column}.task-comments-side .comment-compose .btn{width:100%}}
html[data-theme="dark"] .task-comments-side{background:var(--surface);border-color:var(--line);box-shadow:var(--shadow)}

/* v21 collaboration and project controls */
#assigneeOptions .picker-option,
#assigneeOptions .picker-option strong,
#assigneeOptions .picker-option .member-name,
#assigneeOptions .picker-option .member-main,
#assigneeOptions .picker-option .member-main strong { color:#111827 !important; opacity:1 !important; }
#assigneeOptions .picker-option .member-main span { color:#64748b !important; opacity:1 !important; }
#assigneeOptions .picker-option:hover { background:#f3f7ff !important; }
#assigneeOptions .picker-option.selected { background:#edf4ff !important; }
.subtask-item .subtask-label { color:#111827 !important; opacity:1 !important; }
html[data-theme="dark"] #assigneeOptions .picker-option,
html[data-theme="dark"] #assigneeOptions .picker-option strong,
html[data-theme="dark"] #assigneeOptions .picker-option .member-name,
html[data-theme="dark"] #assigneeOptions .picker-option .member-main,
html[data-theme="dark"] #assigneeOptions .picker-option .member-main strong { color:#f4f7fb !important; }
html[data-theme="dark"] #assigneeOptions .picker-option .member-main span { color:#aeb9c9 !important; }
html[data-theme="dark"] .subtask-item .subtask-label { color:#f4f7fb !important; }
.error-hint { color:var(--danger) !important; }
.project-card-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.project-card{cursor:pointer}
.project-card-actions button{cursor:pointer}
.project-card-actions .project-add { flex:1; margin-top:0 !important; }
.project-delete { border:1px solid #ffd4da; background:#fff5f6; color:var(--danger); border-radius:11px; padding:9px 12px; font-size:9px; font-weight:800; display:inline-flex; align-items:center; justify-content:center; gap:6px; }
.project-delete:hover { background:#ffe8eb; transform:translateY(-1px); }
.project-delete .ui-icon { width:14px; height:14px; }
html[data-theme="dark"] .project-delete { background:#2a1b20; border-color:#5d3038; }

/* v21 member picker readability */
#assigneeOptions .member-option-text,
#assigneeOptions .member-option-text strong { color:#111827 !important; opacity:1 !important; }
#assigneeOptions .member-option-text small { color:#64748b !important; opacity:1 !important; }
#assigneeOptions .member-option-text em { color:#16a673 !important; font-style:normal; font-weight:800; }
html[data-theme="dark"] #assigneeOptions .member-option-text,
html[data-theme="dark"] #assigneeOptions .member-option-text strong { color:#f4f7fb !important; }
html[data-theme="dark"] #assigneeOptions .member-option-text small { color:#aeb9c9 !important; }

/* v23 task sections, nested subtasks, attachments and notifications */
.task-sections{display:flex;flex-direction:column;gap:14px}.task-section{padding:0;overflow:hidden}.task-section-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--line);background:var(--surface-2)}.task-section-title{display:flex;align-items:center;gap:9px;font-weight:800;font-size:14px}.task-section-title i{width:8px;height:8px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 4px rgba(33,103,243,.10)}.task-list-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:12px}.task-list-grid .task-card{margin:0}.subtask-item{transition:transform .15s ease,box-shadow .15s ease}.subtask-item[draggable="true"]{cursor:grab}.subtask-item[draggable="true"]:active{cursor:grabbing}.subtask-child{border:0;background:transparent;color:var(--muted);width:28px;height:28px;border-radius:7px;display:grid;place-items:center;cursor:pointer}.subtask-child:hover{background:var(--picker-hover);color:var(--blue)}.notification-actions{display:flex;justify-content:flex-end;padding:8px 10px;border-bottom:1px solid var(--line)}.notification-actions .btn{font-size:11px;padding:7px 9px}.attachment .remove-pending{margin-left:auto}.attachment .remove-pending .ui-icon{width:15px}@media(max-width:800px){.task-list-grid{grid-template-columns:1fr}}

/* Restored four-column Kanban: Backlog tasks are intentionally excluded from Tasks. */
.kanban-board{display:grid;grid-template-columns:repeat(4,minmax(250px,1fr));gap:14px;align-items:start;overflow-x:auto;padding-bottom:12px}
.kanban-list{min-height:360px}
.kanban-column.new-col .kanban-title i{background:#7d8ba0}
.kanban-column .drop-zone{min-height:120px;display:grid;place-items:center;border:1px dashed #d6deea;border-radius:12px;color:#a0a9b7;font-size:8px;margin-top:6px}
.status-pill.backlog{background:#f0edff;color:#6952c8}
@media(max-width:1200px){.kanban-board{grid-template-columns:repeat(4,minmax(230px,1fr))}}
@media(max-width:900px){.kanban-board{grid-template-columns:repeat(2,minmax(250px,1fr));overflow-x:visible}}
@media(max-width:620px){.kanban-board{grid-template-columns:1fr}}


/* v25 comment alignment and typography */
.task-comments-side .comment-list{padding:2px 6px 4px 2px;}
.task-comments-side .comment{padding:15px 4px 16px;border-bottom:1px solid var(--line);}
.task-comments-side .comment:last-child{border-bottom:0;}
.task-comments-side .comment-head{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;column-gap:10px;width:100%;min-height:34px;}
.task-comments-side .comment-author-avatar{width:34px;height:34px;display:flex;align-items:center;justify-content:center;}
.task-comments-side .comment-author-avatar .avatar{width:34px!important;height:34px!important;margin:0!important;border-radius:50%;flex:none;}
.task-comments-side .comment-author{min-width:0;display:flex;align-items:center;}
.task-comments-side .comment-author b{font-size:12px!important;line-height:1.3;font-weight:750;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.task-comments-side .comment-head time{font-size:9px!important;line-height:1.3;color:#8b98aa;white-space:nowrap;text-align:right;margin:0;}
.task-comments-side .comment-body{margin:8px 0 0 44px;font-size:12px;line-height:1.6;color:var(--ink);overflow-wrap:anywhere;white-space:pre-wrap;}
html[data-theme="dark"] .task-comments-side .comment-author b,html[data-theme="dark"] .task-comments-side .comment-body{color:var(--ink);}
@media(max-width:620px){.task-comments-side .comment-head{grid-template-columns:32px minmax(0,1fr);column-gap:9px}.task-comments-side .comment-author-avatar,.task-comments-side .comment-author-avatar .avatar{width:32px!important;height:32px!important}.task-comments-side .comment-head time{grid-column:2;justify-self:start;margin-top:2px;font-size:8px!important}.task-comments-side .comment-body{margin-left:41px;margin-top:7px;font-size:11px;}}

/* v26 backlog/project parity and subtask controls */
.backlog-grid{align-items:stretch}.backlog-card{min-height:245px;display:flex;flex-direction:column}.backlog-card .project-color{display:grid;place-items:center}.backlog-card .project-color .ui-icon{width:17px;height:17px}.backlog-card .project-foot{margin-top:auto}.backlog-mark{background:linear-gradient(135deg,#7657f4,#9a83ff)!important}
.subtask-actions{margin-left:auto;display:flex;align-items:center;gap:3px;flex:none}.subtask-action{width:25px;height:25px;border:1px solid transparent;background:transparent;color:var(--muted);border-radius:7px;display:grid;place-items:center;padding:0;transition:transform .16s ease,background .16s ease,color .16s ease,border-color .16s ease}.subtask-action .ui-icon{width:13px;height:13px}.subtask-action:hover{background:#edf4ff;color:var(--blue);border-color:#d9e5fa;transform:translateY(-1px)}.subtask-item.subtask-dragging{opacity:.48;transform:scale(.985);box-shadow:0 10px 25px rgba(33,103,243,.12)}.subtask-item.subtask-drag-over{border-color:#8eb2ff!important;background:#edf4ff!important;transform:translateY(-2px)}.subtask-item.subtask-drop-pop{animation:subtaskDropPop .3s ease}.pending-sub{transition:transform .18s ease,box-shadow .18s ease,opacity .18s ease,border-color .18s ease,background .18s ease}.pending-sub .subtask-actions{opacity:.78}.pending-sub:hover .subtask-actions{opacity:1}@keyframes subtaskDropPop{0%{transform:scale(.98)}55%{transform:scale(1.015)}100%{transform:scale(1)}}
/* Keep the modal shell from producing a second scrollbar that visually overlaps the task/comments panels. */
.task-modal-shell{overflow:hidden;box-sizing:border-box}.task-modal-shell>.modal-box{overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable both-edges}.task-modal-shell>.task-comments-side{overflow:hidden}.task-comments-side .comment-list{scrollbar-gutter:stable}.task-modal-shell::-webkit-scrollbar,.task-modal-shell>.modal-box::-webkit-scrollbar,.task-comments-side .comment-list::-webkit-scrollbar{width:8px}.task-modal-shell>.modal-box::-webkit-scrollbar-thumb,.task-comments-side .comment-list::-webkit-scrollbar-thumb{background:#b8c1ce;border-radius:999px;border:2px solid transparent;background-clip:padding-box}
@media(max-width:1050px){.task-modal-shell{overflow:auto}.task-modal-shell>.modal-box{overflow:visible;scrollbar-gutter:auto}.task-modal-shell>.task-comments-side{overflow:hidden}}
@media(max-width:760px){.subtask-actions{gap:1px}.subtask-action{width:23px;height:23px}.subtask-action .ui-icon{width:12px;height:12px}}
html[data-theme="dark"] .subtask-action:hover{background:#1e2c43;border-color:#30466a;color:#78a1ff}

/* v27 — visible subtask positioning controls and polished drag feedback */
.subtask-actions{margin-left:auto;display:inline-flex!important;align-items:center;gap:3px;flex:0 0 auto}
.subtask-action{width:28px;height:28px;border:1px solid var(--line);background:var(--surface);color:#6d7a8f;border-radius:8px;display:grid;place-items:center;padding:0;cursor:pointer;transition:transform .16s ease,background .16s ease,color .16s ease,border-color .16s ease,box-shadow .16s ease}
.subtask-action .ui-icon{width:14px;height:14px}
.subtask-action:hover{background:#edf4ff;color:var(--blue);border-color:#cbdcff;transform:translateY(-2px);box-shadow:0 5px 12px rgba(33,103,243,.12)}
.subtask-action:active{transform:translateY(0) scale(.94)}
.subtask-action.danger:hover{background:#fff0f2;color:var(--danger);border-color:#ffd0d7}
.subtask-item.subtask-dragging{opacity:.45;transform:scale(.985);box-shadow:0 14px 30px rgba(33,103,243,.16);outline:2px dashed #8eb2ff;outline-offset:2px}
.subtask-item.subtask-drag-over{background:#edf4ff!important;border-color:#7fa8ff!important;transform:translateY(-3px) scale(1.01);box-shadow:0 10px 24px rgba(33,103,243,.12)}
.subtask-item.subtask-drop-pop{animation:subtaskDropPopV27 .32s cubic-bezier(.2,.8,.2,1)}
@keyframes subtaskDropPopV27{0%{transform:scale(.97);opacity:.7}55%{transform:scale(1.02)}100%{transform:scale(1);opacity:1}}

/* v27 — Backlogs uses the same visual card system as Projects */
.backlog-grid .backlog-card{min-height:245px;padding:18px;display:flex;flex-direction:column}
.backlog-grid .backlog-card h3{font-size:15px;margin:14px 0 7px}
.backlog-grid .backlog-card p{font-size:10px;line-height:1.6;color:var(--muted);margin:0 0 14px;min-height:48px}
.backlog-grid .backlog-card .project-foot{margin-top:auto;display:flex;justify-content:space-between;gap:10px;font-size:8px;color:var(--muted)}
.backlog-grid .backlog-card .project-foot span{display:flex;align-items:center;gap:5px;min-width:0}
.backlog-grid .backlog-card .project-foot .ui-icon{width:13px;height:13px;color:var(--blue)}
.backlog-grid .backlog-card .project-add{margin-top:12px!important}

/* v27 — ensure the desktop task modal has exactly one scrollbar per pane */
.task-modal-shell{display:grid!important;grid-template-columns:minmax(0,1fr) 330px;gap:12px;align-items:stretch;max-height:calc(100vh - 32px);overflow:hidden!important}
.task-modal-shell>.modal-box{min-width:0;max-height:calc(100vh - 32px);overflow-y:auto!important;overflow-x:hidden!important;scrollbar-gutter:stable}
.task-modal-shell>.task-comments-side{min-width:0;max-height:calc(100vh - 32px);overflow:hidden!important}
.task-modal-shell>.task-comments-side .comment-list{min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable}
@media(max-width:1050px){.task-modal-shell{display:block!important;width:min(900px,calc(100vw - 20px));max-height:calc(100vh - 16px);overflow:auto!important}.task-modal-shell>.modal-box{max-height:none;overflow:visible!important}.task-modal-shell>.task-comments-side{height:360px;max-height:none;margin-top:12px}.task-modal-shell>.task-comments-side .comment-list{overflow-y:auto}}
@media(max-width:620px){.subtask-action{width:26px;height:26px}.subtask-actions{gap:2px}.task-modal-shell{width:calc(100vw - 16px)}}

/* Xentra fix: sticky task-modal header so the close button never collides with the panel's own scrollbar/corner, plus a friendlier subtask row layout */
.task-modal-shell .modal-box .modal-head{position:sticky!important;top:0;z-index:6;background:var(--surface,#fff);margin:-17px -17px 16px;padding:18px 26px 15px 22px;border-radius:18px 18px 0 0;border-bottom:1px solid var(--line);box-shadow:0 6px 14px rgba(15,34,67,.04)}
.task-modal-shell .modal-box .close{flex:none;margin-left:12px}
html[data-theme="dark"] .task-modal-shell .modal-box .modal-head{background:var(--surface)}

.subtask-list{max-height:none!important;overflow:visible!important;margin-top:10px}
.subtask-item{display:flex!important;flex-wrap:wrap;align-items:center;gap:9px;min-height:50px!important;padding:10px 12px 10px 10px!important}
.subtask-item[data-depth]:not([data-depth="0"]){border-left:3px solid #cfe0fb;background:var(--surface,#fff)}
html[data-theme="dark"] .subtask-item[data-depth]:not([data-depth="0"]){border-left-color:#2c3a52}
.subtask-drag-handle{flex:none;display:grid;place-items:center;width:16px;height:26px;color:#b7c1d1;cursor:grab;touch-action:none}
.subtask-drag-handle:active{cursor:grabbing}
.subtask-item .subtask-label{flex:1 1 160px;min-width:120px}
.subtask-actions{flex-wrap:wrap;justify-content:flex-end;row-gap:6px}
.subtask-move-group{display:inline-flex!important;align-items:center;gap:0;padding:2px;border:1px solid var(--line);border-radius:9px;background:var(--surface-2,#f8fbff)}
.subtask-move-group .subtask-action{border:0!important;background:transparent!important;border-radius:6px!important}
.subtask-move-group .subtask-action:nth-child(2){border-right:1px solid var(--line)!important;border-radius:6px 0 0 6px!important}
.subtask-move-group .subtask-action:nth-child(3){border-radius:0 6px 6px 0!important}
.subtask-actions>.subtask-action{margin-left:2px}
@media(max-width:480px){.subtask-item{padding-left:8px}.subtask-actions{width:100%;justify-content:flex-start;margin-left:0!important}}

/* Xentra fix: Inbox — unread badge, group chat, bigger text, delete + attachments */
#msgBadge.show{background:var(--danger);color:#fff}
.bubble{font-size:12px!important;line-height:1.55!important}
.chat-compose input#message{font-size:12px!important}
.chat-user-main strong{font-size:11px!important}
.chat-user-main span{font-size:9px!important}
.bubble-time{font-size:8px!important}
.chat-header{gap:12px}
#chatHeaderActions{display:flex;gap:8px;flex:none}
.group-avatar{background:linear-gradient(135deg,#7c5cff,#ff8fd0)!important;color:#fff!important}
.group-avatar .ui-icon{width:16px;height:16px}
.group-tag{font-size:7px;font-weight:800;color:var(--blue);background:#eaf1ff;border-radius:6px;padding:2px 6px;margin-left:6px;vertical-align:middle}
.bubble-row{align-items:flex-end;gap:8px}
.bubble-wrap{display:flex;align-items:center;gap:6px;max-width:78%}
.bubble-row.mine{justify-content:flex-end}
.bubble-row.mine .bubble-wrap{flex-direction:row-reverse}
.msg-delete{flex:none;border:0;background:transparent;color:#b9c2d1;width:24px;height:24px;border-radius:7px;display:none;place-items:center;cursor:pointer}
.bubble-row:hover .msg-delete{display:grid}
.msg-delete:hover{background:#ffe4e8;color:var(--danger)}
.msg-delete .ui-icon{width:13px;height:13px}
.msg-attachment{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:11px;color:inherit;text-decoration:underline}
.msg-attachment.image{display:block;text-decoration:none}
.msg-attachment.image img{max-width:220px;max-height:220px;border-radius:10px;display:block;margin-top:4px}
.chat-compose{align-items:center}
.chat-input-wrap{flex:1;display:flex;flex-direction:column;min-width:0}
.chat-file-preview{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--muted);margin-top:4px}
.chat-file-preview:empty{display:none}
.chat-file-preview button{border:0;background:transparent;color:#9aa5b5;cursor:pointer;display:grid;place-items:center}
.group-member-list{max-height:280px;overflow:auto;margin-top:8px;display:flex;flex-direction:column;gap:4px}
html[data-theme="dark"] .group-tag{background:#182b50}
@media(max-width:620px){.bubble-wrap{max-width:88%}}

/* Xentra fix: group-member picker used the dark member-picker theme on a light modal — made it readable */
#groupMemberOptions.group-member-list .picker-option{background:var(--surface-2,#f8fbff)!important;border:1px solid var(--line);border-radius:10px;display:flex!important}
#groupMemberOptions.group-member-list .picker-option:hover{background:var(--picker-hover,#f4f7fb)!important}
#groupMemberOptions.group-member-list .picker-option.selected{background:#eaf1ff!important;border-color:#bcd4ff}
#groupMemberOptions .member-option-text strong{color:var(--ink)!important;font-size:12px!important}
#groupMemberOptions .member-option-text small{color:var(--muted)!important;font-size:10px!important}
#groupMemberOptions .member-check{color:#c7d0dc}
#groupMemberOptions .picker-option.selected .member-check{color:var(--blue)}
html[data-theme="dark"] #groupMemberOptions.group-member-list .picker-option{background:var(--surface-2)!important;border-color:var(--line)}
html[data-theme="dark"] #groupMemberOptions.group-member-list .picker-option.selected{background:#182b50!important}

/* Xentra fix: Inbox panel needs a bounded height, otherwise the message list and
   conversation list just grow forever instead of scrolling internally. */
.chat-layout{height:calc(100vh - 220px)!important;min-height:480px!important;max-height:840px}
.chat-list{display:flex!important;flex-direction:column;overflow:hidden}
.chat-search{flex:none}
#chatUsers{flex:1;overflow-y:auto}
.chat-window{height:100%}
.chat-compose{flex:none}
@media(max-width:900px){.chat-layout{height:auto!important;min-height:0!important;max-height:none}.chat-list{max-height:340px}.chat-window{height:520px}}
@media(max-width:620px){.chat-window{height:440px}}

/* v29 — organized inbox and group chat */
.chat-layout{grid-template-columns:minmax(260px,330px) minmax(0,1fr)!important;gap:14px!important}
.chat-list{background:var(--surface)!important;border:1px solid var(--line)!important;border-radius:16px!important;box-shadow:var(--shadow2)!important}
.chat-search{padding:12px!important;border-bottom:1px solid var(--line)!important}
.chat-search input{height:40px!important;font-size:12px!important;border-radius:10px!important}
#chatUsers{padding:7px!important}
.chat-user{display:grid!important;grid-template-columns:42px minmax(0,1fr) auto!important;align-items:center!important;gap:10px!important;padding:10px!important;margin:3px 0!important;border:1px solid transparent!important;border-radius:12px!important;min-height:62px!important}
.chat-user:hover{background:var(--surface-2)!important;border-color:var(--line)!important}
.chat-user.active{background:#edf4ff!important;border-color:#cfe0ff!important}
html[data-theme="dark"] .chat-user.active{background:#182b50!important;border-color:#2d4d83!important}
.chat-user .avatar{width:38px!important;height:38px!important;border-radius:11px!important}
.chat-user-main{min-width:0!important}
.chat-user-main strong{font-size:13px!important;display:flex!important;align-items:center!important;gap:5px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;color:var(--ink)!important}
.chat-user-main span{font-size:10px!important;display:block!important;margin-top:4px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;color:var(--muted)!important}
.chat-user-side{min-width:24px!important;align-items:flex-end!important}
.chat-user-side i{margin-bottom:3px!important}
.chat-head-btn{height:36px!important;padding:0 10px!important;font-size:10px!important}
.danger-chat{color:var(--danger)!important}
.group-member-list.large{max-height:420px!important;padding:3px!important}
.group-member-row{display:grid;grid-template-columns:40px 1fr;gap:10px;align-items:center;padding:10px;border-bottom:1px solid var(--line)}
.group-member-row strong{display:block;font-size:13px;color:var(--ink)}
.group-member-row span{display:block;margin-top:3px;font-size:10px;color:var(--muted)}
.group-member-row .status-dot{margin-left:4px}
.group-members-modal{max-width:560px}
.emoji-picker{position:absolute;bottom:58px;left:8px;width:270px;padding:9px;display:grid;grid-template-columns:repeat(8,1fr);gap:4px;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:0 20px 50px rgba(0,0,0,.2);opacity:0;visibility:hidden;transform:translateY(5px);transition:.15s;z-index:300}
.emoji-picker.show{opacity:1;visibility:visible;transform:none}
.emoji-picker button{border:0;background:transparent;border-radius:8px;font-size:20px;height:32px;cursor:pointer}
.emoji-picker button:hover{background:var(--surface-2);transform:scale(1.12)}
.chat-compose{position:relative!important}
.emoji-trigger{font-size:18px!important}
html[data-theme="dark"] .chat-user-main strong{color:var(--ink)!important}
@media(max-width:900px){.chat-layout{grid-template-columns:1fr!important}.chat-list{max-height:350px!important}.chat-head-btn span{display:none}.chat-head-btn{width:36px;padding:0!important;display:grid;place-items:center}}

/* v30 notification badge hardening */
.nav-badge:not(.show), .notif-count:not(.show){display:none !important;}
.nav-badge.show{display:flex !important;}
.notif-count.show{display:block !important;}

/* v31 — group member management + polished emoji picker */
.group-member-row{grid-template-columns:40px minmax(0,1fr) auto!important;min-height:58px!important}
.group-member-info{min-width:0}
.group-member-info strong{display:flex!important;align-items:center;gap:7px;min-width:0}
.group-you{font-size:9px!important;color:var(--blue)!important;background:#edf4ff;border-radius:999px;padding:3px 6px}
.group-remove-btn{width:34px!important;height:34px!important;color:var(--danger)!important;border-color:#f2cbd1!important;background:#fff7f8!important}
.group-remove-btn:hover{background:#ffe9ed!important;border-color:#eaaab4!important}
html[data-theme="dark"] .group-you{background:#182b50}
html[data-theme="dark"] .group-remove-btn{background:#2b1b20!important;border-color:#5b3038!important}
.emoji-picker{box-sizing:border-box!important;width:304px!important;max-width:min(304px,calc(100vw - 24px))!important;max-height:270px!important;padding:10px!important;grid-template-columns:repeat(8,minmax(0,1fr))!important;gap:3px!important;overflow-y:auto!important;overflow-x:hidden!important;scrollbar-gutter:stable!important}
.emoji-picker button{width:32px!important;height:32px!important;min-width:0!important;padding:0!important;display:grid!important;place-items:center!important;font-size:21px!important;line-height:1!important}
.emoji-picker::-webkit-scrollbar{width:6px}.emoji-picker::-webkit-scrollbar-thumb{background:#c0c8d4;border-radius:8px}
html[data-theme="dark"] .emoji-picker::-webkit-scrollbar-thumb{background:#596579}
@media(max-width:620px){.emoji-picker{left:0!important;bottom:54px!important;width:calc(100vw - 24px)!important;grid-template-columns:repeat(8,minmax(0,1fr))!important}.emoji-picker button{width:34px!important;height:34px!important;font-size:22px!important}}

/* v33 — neutral group system events */
.group-system-message{display:flex;align-items:center;gap:10px;justify-content:center;width:100%;padding:12px 8px;margin:4px 0;}
.group-system-line{height:1px;background:var(--line);flex:1;min-width:24px;}
.group-system-pill{display:inline-flex;align-items:center;justify-content:center;gap:7px;max-width:min(82%,560px);padding:7px 12px;border:1px solid var(--line);border-radius:999px;background:var(--surface-2);color:var(--muted);font-size:10px;line-height:1.4;text-align:center;box-shadow:0 4px 14px rgba(24,57,108,.04);}
.group-system-pill svg{width:13px;height:13px;flex:none;stroke:var(--blue);}
.group-system-pill span{overflow-wrap:anywhere;}
.group-system-pill time{font-size:8px;color:#9aa5b5;white-space:nowrap;margin-left:3px;}
html[data-theme="dark"] .group-system-pill{background:#172235;border-color:#2c3a50;color:#aab6c8;}
@media(max-width:620px){.group-system-line{min-width:8px}.group-system-pill{max-width:92%;font-size:9px;padding:6px 10px}.group-system-pill time{display:none}}

/* v34 — Inbox polish: readable member names + smooth conversation selection */
#inviteOptions .member-picker-row,
#groupMemberOptions .member-picker-row{
  color:#4b5563!important;
  transition:background-color .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease!important;
}
#inviteOptions .member-picker-row .member-option-text,
#inviteOptions .member-picker-row .member-option-text strong,
#groupMemberOptions .member-picker-row .member-option-text,
#groupMemberOptions .member-picker-row .member-option-text strong{
  color:#4b5563!important;
  opacity:1!important;
}
#inviteOptions .member-picker-row .member-option-text small,
#groupMemberOptions .member-picker-row .member-option-text small{
  color:#7b8798!important;
  opacity:1!important;
}
#inviteOptions .member-picker-row:hover,
#groupMemberOptions .member-picker-row:hover{
  background:#f4f7fc!important;
  border-color:#d8e3f3!important;
  transform:translateY(-1px);
}
#inviteOptions .member-picker-row.selected,
#groupMemberOptions .member-picker-row.selected{
  background:#edf4ff!important;
  border-color:#bfd4f7!important;
  box-shadow:0 4px 12px rgba(33,103,243,.08);
}
html[data-theme="dark"] #inviteOptions .member-picker-row .member-option-text,
html[data-theme="dark"] #inviteOptions .member-picker-row .member-option-text strong,
html[data-theme="dark"] #groupMemberOptions .member-picker-row .member-option-text,
html[data-theme="dark"] #groupMemberOptions .member-picker-row .member-option-text strong{color:#e7edf7!important}
html[data-theme="dark"] #inviteOptions .member-picker-row .member-option-text small,
html[data-theme="dark"] #groupMemberOptions .member-picker-row .member-option-text small{color:#aeb9c9!important}

.chat-user{
  will-change:transform,background-color,box-shadow;
  transition:background-color .2s ease,border-color .2s ease,transform .18s cubic-bezier(.2,.8,.2,1),box-shadow .2s ease!important;
}
.chat-user:hover{transform:translateX(2px);box-shadow:0 5px 16px rgba(28,62,112,.05)}
.chat-user:active{transform:translateX(2px) scale(.985);transition-duration:.08s!important}
.chat-user.active{box-shadow:0 7px 20px rgba(33,103,243,.08);animation:chatSelectionIn .22s ease-out}
@keyframes chatSelectionIn{0%{transform:translateX(2px) scale(.985);opacity:.82}100%{transform:translateX(0) scale(1);opacity:1}}
.chat-user .avatar{transition:transform .2s ease,box-shadow .2s ease}
.chat-user:hover .avatar{transform:scale(1.04)}
.chat-user.active .avatar{box-shadow:0 0 0 3px rgba(33,103,243,.10)}

/* Smoothly reveal the selected conversation without affecting polling refreshes. */
.chat-header,.chat-compose{transition:background-color .2s ease,border-color .2s ease}
.chat-window{transition:box-shadow .2s ease,border-color .2s ease}
.chat-window:focus-within{box-shadow:0 12px 32px rgba(28,62,112,.08)}

/* v35 Daily Task */
.daily-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:18px}.daily-date-nav{display:flex;align-items:center;gap:10px}.daily-date-nav>div{display:flex;flex-direction:column;min-width:220px}.daily-date-nav strong{font-size:18px;color:var(--ink)}.daily-kpis{display:flex;gap:8px;flex-wrap:wrap}.daily-kpis span{display:inline-flex;align-items:center;gap:6px;padding:9px 12px;border:1px solid var(--line);background:var(--surface);border-radius:12px;color:var(--muted);font-size:12px;font-weight:700}.daily-kpis .ui-icon{width:15px;height:15px}.daily-calendar-strip{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-bottom:18px}.daily-day{border:1px solid var(--line);background:var(--surface);border-radius:14px;padding:10px 8px;cursor:pointer;display:flex;flex-direction:column;gap:3px;align-items:center;color:var(--muted);transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease}.daily-day:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(31,72,128,.08)}.daily-day b{font-size:18px;color:var(--ink)}.daily-day.active{border-color:var(--accent);background:rgba(53,104,255,.08);color:var(--accent)}.daily-day.active b{color:var(--accent)}.daily-content{display:flex;flex-direction:column;gap:16px}.daily-person{border:1px solid var(--line);background:var(--surface);border-radius:18px;padding:16px;box-shadow:var(--shadow-sm)}.daily-person-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.daily-person-head h3{margin:2px 0 0;font-size:16px}.daily-task-list{display:flex;flex-direction:column;gap:9px}.daily-task-card{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:13px;border:1px solid var(--line);border-radius:14px;background:var(--surface-2, #fff);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}.daily-task-card:hover{transform:translateY(-1px);border-color:#c8d7ee;box-shadow:0 8px 18px rgba(31,72,128,.06)}.daily-task-card.is-done{opacity:.72}.daily-task-main{display:flex;gap:11px;min-width:0}.daily-check{width:30px;height:30px;flex:0 0 30px;border:1px solid var(--line);border-radius:9px;background:var(--surface);display:grid;place-items:center;color:var(--muted);cursor:pointer}.daily-check.checked{color:#fff;background:var(--accent);border-color:var(--accent)}.daily-check .ui-icon{width:16px;height:16px}.daily-task-copy{min-width:0}.daily-task-copy strong{display:block;font-size:14px;color:var(--ink);margin-bottom:4px}.daily-task-copy p{margin:0;color:var(--muted);font-size:12px;line-height:1.55;white-space:normal}.daily-task-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px;color:var(--muted);font-size:10px}.daily-task-meta>span{display:inline-flex;align-items:center;gap:4px}.daily-task-meta .ui-icon{width:12px;height:12px}.daily-task-actions{display:flex;gap:3px}.daily-task-actions .danger{color:#c84c5b}.daily-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.daily-form-grid label{display:flex;flex-direction:column;gap:7px;color:var(--ink);font-size:12px;font-weight:700}.daily-form-grid .full{grid-column:1/-1}.daily-form-grid input,.daily-form-grid select,.daily-form-grid textarea{font:inherit;font-weight:500;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:11px;padding:11px 12px;outline:none}.daily-form-grid textarea{resize:vertical}.daily-form-grid input:focus,.daily-form-grid select:focus,.daily-form-grid textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(53,104,255,.1)}@media(max-width:850px){.daily-toolbar{align-items:flex-start;flex-direction:column}.daily-calendar-strip{grid-template-columns:repeat(7,minmax(54px,1fr));overflow-x:auto}.daily-day{min-width:54px}.daily-form-grid{grid-template-columns:1fr}.daily-form-grid .full{grid-column:auto}.daily-date-nav>div{min-width:180px}}@media(max-width:560px){.daily-kpis{width:100%}.daily-kpis span{flex:1;justify-content:center}.daily-person{padding:12px}.daily-task-card{padding:11px}.daily-task-actions{flex-direction:column}}

/* v37 Daily Task modal + WYSIWYG */
.daily-modal-overlay{display:flex;align-items:center;justify-content:center;padding:24px;}
.daily-modal{width:min(760px,calc(100vw - 48px));max-height:calc(100vh - 48px);overflow:auto;padding:24px;}
.daily-modal .modal-head{margin-bottom:20px;}
.daily-modal .modal-head p{font-size:10px;color:var(--muted);margin:5px 0 0;}
.daily-form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;}
.daily-form-grid label{font-size:11px;}
.daily-form-grid input,.daily-form-grid select{min-height:44px;}
.daily-form-grid .full{grid-column:1/-1;}
.daily-wysiwyg{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--surface);box-shadow:inset 0 1px 0 rgba(255,255,255,.45);}
.wysiwyg-toolbar{display:flex;align-items:center;gap:5px;flex-wrap:wrap;padding:8px;border-bottom:1px solid var(--line);background:var(--surface-2);}
.wysiwyg-toolbar button{min-width:34px;height:32px;padding:0 8px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font-size:11px;font-weight:700;transition:transform .16s ease,border-color .16s ease,background .16s ease;}
.wysiwyg-toolbar button:hover{transform:translateY(-1px);border-color:#c7d5ee;background:#f7faff;color:var(--blue);}
.wysiwyg-editor{min-height:170px;padding:13px 14px;outline:none;color:var(--ink);font-size:12px;line-height:1.65;background:var(--surface);}
.wysiwyg-editor:empty:before{content:attr(data-placeholder);color:#9aa6b7;pointer-events:none;}
.wysiwyg-editor ul,.wysiwyg-editor ol{margin:6px 0 6px 22px;}
.daily-modal .modal-footer{margin-top:20px;}
@media(max-width:650px){.daily-modal-overlay{padding:12px;}.daily-modal{width:100%;max-height:calc(100vh - 24px);padding:18px;}.daily-form-grid{grid-template-columns:1fr;}.daily-form-grid .full{grid-column:auto;}}

/* v38 — visual polish: richer color, micro-interactions, clearer clickable task surfaces */
:root{--accent:#3568ff;--accent2:#6f5cff;--teal:#18b6a4;--violet:#8b5cf6;--surface-glow:rgba(53,104,255,.08)}
body:before{background:radial-gradient(circle at 86% 4%,rgba(53,104,255,.14),transparent 30%),radial-gradient(circle at 12% 78%,rgba(139,92,246,.09),transparent 27%),radial-gradient(circle at 60% 100%,rgba(24,182,164,.06),transparent 24%)}
.sidebar{box-shadow:12px 0 40px rgba(38,67,112,.045)}
.workspace-switcher{position:relative;overflow:hidden;background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(239,245,255,.98));border-color:#dce7f8}
.workspace-switcher:after{content:"";position:absolute;width:90px;height:90px;right:-44px;top:-46px;border-radius:50%;background:linear-gradient(135deg,rgba(53,104,255,.16),rgba(139,92,246,.02));pointer-events:none}
.workspace-switcher .workspace-mark{background:linear-gradient(135deg,#3568ff,#7b5cff 72%,#24b7ff);animation:softPulse 3.5s ease-in-out infinite}
.nav-item{will-change:transform}.nav-item:hover{background:linear-gradient(90deg,#f1f6ff,#fafbff);box-shadow:0 6px 18px rgba(53,104,255,.07)}
.nav-item.active{background:linear-gradient(90deg,#e8f0ff,#f7f9ff 78%);box-shadow:inset 3px 0 0 var(--accent),0 7px 20px rgba(53,104,255,.07)}
.nav-icon{transition:transform .2s ease,color .2s ease}.nav-item:hover .nav-icon,.nav-item.active .nav-icon{transform:scale(1.08)}
.topbar{box-shadow:0 6px 24px rgba(31,61,106,.035)}
.top-icon,.icon-btn,.btn,.search-box,.form-control,.daily-day,.daily-task-card,.project-card,.card{transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s ease,border-color .22s ease,background .22s ease}
.icon-btn:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 10px 24px rgba(53,104,255,.12);color:var(--accent)}
.btn.primary{background:linear-gradient(135deg,#3568ff,#5a5cf6 65%,#6f5cff);box-shadow:0 10px 24px rgba(53,104,255,.22)}
.btn.primary:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(53,104,255,.28)}
.btn:active,.icon-btn:active,.top-icon:active{transform:translateY(0) scale(.97)}
.card:hover{transform:translateY(-2px);box-shadow:0 18px 42px rgba(28,62,112,.11)}
.kpi{overflow:hidden;background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(247,250,255,.96));border-color:#dfe8f6}.kpi:nth-child(2) .kpi-icon{background:#eaf8f6;color:#12a58f}.kpi:nth-child(3) .kpi-icon{background:#f1edff;color:#7657f4}.kpi:nth-child(4) .kpi-icon{background:#fff5e8;color:#d8891f}
.kpi-icon{box-shadow:0 8px 20px rgba(53,104,255,.08);transition:transform .25s ease}.kpi:hover .kpi-icon{transform:rotate(-4deg) scale(1.08)}
.task-card{position:relative;overflow:hidden;cursor:pointer;background:linear-gradient(145deg,#fff,#fbfdff)}
.task-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,#3568ff,#7b5cff);opacity:0;transition:opacity .2s ease}
.task-card:hover:before{opacity:1}.task-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(33,103,243,.11)}
.task-top h4{transition:color .2s ease}.task-card:hover .task-top h4{color:var(--accent)}
.project-card{position:relative;overflow:hidden}.project-card:before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:linear-gradient(90deg,#3568ff,#7b5cff,#24b7ff);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}.project-card:hover:before{transform:scaleX(1)}
.project-color{box-shadow:0 8px 18px rgba(53,104,255,.15)}
.status-pill{transition:transform .18s ease,box-shadow .18s ease}.status-pill:hover{transform:translateY(-1px)}
.tag{transition:transform .18s ease}.tag:hover{transform:translateY(-1px)}
.daily-task-card{position:relative;cursor:pointer;background:linear-gradient(145deg,var(--surface),var(--surface-2,#fff));overflow:hidden}.daily-task-card:after{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,#3568ff,#18b6a4);opacity:0;transition:opacity .2s ease}.daily-task-card:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(31,72,128,.10);border-color:#c7d8f5}.daily-task-card:hover:after{opacity:1}.daily-task-card:active{transform:scale(.995)}
.daily-task-card:focus-visible,.project-card:focus-visible,.task-card:focus-visible{outline:3px solid rgba(53,104,255,.22);outline-offset:2px}
.daily-check{transition:transform .18s ease,background .18s ease,box-shadow .18s ease}.daily-check:hover{transform:scale(1.08);box-shadow:0 6px 14px rgba(53,104,255,.14)}
.daily-day.active{box-shadow:0 9px 22px rgba(53,104,255,.14)}
.page-heading .eyebrow:before{content:"✦";display:inline-block;margin-right:6px;animation:twinkle 2.4s ease-in-out infinite}
.panel-title,.task-section-title,.daily-person-head h3{letter-spacing:-.015em}
.notice-card{border:1px solid #dce7f8;background:linear-gradient(135deg,#f7faff,#fff)}
.empty{border:1px dashed #ccd8ea;background:linear-gradient(145deg,#fbfdff,#f6f9ff);border-radius:16px}
.modal-box{box-shadow:0 28px 80px rgba(20,40,80,.22);animation:modalIn .2s cubic-bezier(.2,.8,.2,1)}
.modal.show{animation:fadeIn .18s ease}
.form-control:focus,.search-box:focus-within{box-shadow:0 0 0 4px rgba(53,104,255,.09),0 8px 22px rgba(53,104,255,.06);border-color:#a9c2fa}
.notification-item{transition:background .18s ease,transform .18s ease}.notification-item:hover{background:#f5f8ff;transform:translateX(2px)}
.emoji-trigger{transition:transform .18s ease,box-shadow .18s ease}.emoji-trigger:hover{transform:translateY(-2px) rotate(-3deg);box-shadow:0 8px 18px rgba(53,104,255,.13)}
@keyframes modalIn{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes softPulse{0%,100%{box-shadow:0 7px 18px rgba(53,104,255,.25)}50%{box-shadow:0 10px 25px rgba(111,92,255,.34)}}@keyframes twinkle{0%,100%{opacity:.45;transform:scale(.9)}50%{opacity:1;transform:scale(1.1)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
html[data-theme="dark"] body:before{background:radial-gradient(circle at 86% 4%,rgba(53,104,255,.18),transparent 30%),radial-gradient(circle at 12% 78%,rgba(139,92,246,.13),transparent 27%),radial-gradient(circle at 60% 100%,rgba(24,182,164,.08),transparent 24%)}
html[data-theme="dark"] .workspace-switcher,html[data-theme="dark"] .kpi,html[data-theme="dark"] .task-card,html[data-theme="dark"] .project-card,html[data-theme="dark"] .daily-task-card,html[data-theme="dark"] .notice-card{background:linear-gradient(145deg,#121a2a,#0f1725);border-color:#253552}
html[data-theme="dark"] .notification-item:hover{background:#172238}
/* v39 online user profile */
.person-card{cursor:pointer;position:relative}
.person-card:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.online-user-modal{width:min(760px,calc(100vw - 40px));max-width:760px}
.online-profile-head{display:flex;align-items:center;gap:14px;min-width:0}
.online-profile-head h2{margin:2px 0 3px}
.online-profile-head p{margin:0;color:var(--muted);font-size:10px;display:flex;align-items:center;gap:6px}
.avatar.large{width:54px;height:54px;border-radius:16px;font-size:14px;flex:none}
.online-profile-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:4px 0 18px}
.online-info-card{display:flex;align-items:center;gap:10px;padding:13px;border:1px solid var(--line);border-radius:13px;background:var(--surface-2)}
.online-info-card>svg{width:18px;height:18px;color:var(--blue);flex:none}
.online-info-card small{display:block;color:var(--muted);font-size:8px;margin-bottom:3px}
.online-info-card strong{display:block;font-size:10px;word-break:break-word}
.online-tasks-section{border-top:1px solid var(--line);padding-top:15px}
.online-task-list{display:grid;gap:7px;max-height:330px;overflow:auto;padding-right:4px}
.online-task-row{display:flex;align-items:center;gap:10px;padding:10px 11px;border:1px solid var(--line);border-radius:11px;background:var(--surface);transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}
.online-task-row:hover{transform:translateY(-1px);box-shadow:0 10px 25px rgba(24,55,105,.08);border-color:#c8d8f3}
.online-task-icon{width:30px;height:30px;border-radius:9px;background:#eef4ff;color:var(--blue);display:grid;place-items:center;flex:none}
.online-task-icon svg{width:15px;height:15px}
.online-task-main{min-width:0;flex:1}
.online-task-main strong{display:block;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.online-task-main span{display:block;font-size:8px;color:var(--muted);margin-top:3px}
html[data-theme="dark"] .online-info-card{background:var(--surface-2)}
html[data-theme="dark"] .online-task-row{background:var(--surface)}
html[data-theme="dark"] .online-task-icon{background:#182b50}
@media(max-width:700px){.online-profile-grid{grid-template-columns:1fr}.online-user-modal{width:calc(100vw - 24px)}.online-task-row .status-pill{display:none}}

/* v40 message reactions */
.bubble-wrap{position:relative}
.message-body{min-width:0}
.message-reaction-tools{position:relative;display:flex;justify-content:flex-end;margin-top:4px}
.message-react-btn{width:26px;height:24px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--muted);display:grid;place-items:center;opacity:0;transform:translateY(3px);transition:opacity .16s ease,transform .16s ease,background .16s ease,color .16s ease;cursor:pointer}
.bubble-wrap:hover .message-react-btn,.message-react-btn:focus-visible{opacity:1;transform:none}
.message-react-btn:hover{color:var(--blue);background:var(--surface-2);transform:translateY(-1px)}
.message-react-btn .ui-icon{width:14px;height:14px}
.message-reaction-picker{position:absolute;right:0;bottom:30px;display:flex;gap:3px;padding:6px;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 35px rgba(12,28,58,.16);opacity:0;visibility:hidden;transform:translateY(5px) scale(.98);transition:.15s ease;z-index:80}
.message-reaction-picker.show{opacity:1;visibility:visible;transform:none}
.message-reaction-picker button{border:0;background:transparent;border-radius:8px;width:29px;height:29px;padding:0;font-size:17px;display:grid;place-items:center;cursor:pointer;transition:transform .12s ease,background .12s ease}
.message-reaction-picker button:hover{background:var(--surface-2);transform:scale(1.16)}
.message-reactions{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}
.message-reaction{border:1px solid var(--line);background:var(--surface-2);color:var(--ink);border-radius:999px;padding:2px 7px;min-height:23px;display:inline-flex;align-items:center;gap:4px;font-size:13px;cursor:pointer;transition:transform .12s ease,background .12s ease,border-color .12s ease}
.message-reaction:hover{transform:translateY(-1px);border-color:#bcd0f1}
.message-reaction.selected{background:#edf4ff;border-color:#a9c6ff;color:var(--blue)}
.message-reaction b{font-size:9px;font-weight:800}
html[data-theme="dark"] .message-react-btn,html[data-theme="dark"] .message-reaction-picker,html[data-theme="dark"] .message-reaction{background:var(--surface);color:var(--ink);border-color:var(--line)}
html[data-theme="dark"] .message-reaction.selected{background:#182b50;color:#8fb5ff;border-color:#31578f}
@media(max-width:620px){.message-react-btn{opacity:1;transform:none}.message-reaction-picker{max-width:calc(100vw - 40px);flex-wrap:wrap}.message-reaction-picker button{width:31px;height:31px;font-size:18px}}


/* v41 instant reaction feedback */
.message-reactions.reaction-updated{animation:reactionPop .22s ease-out}
@keyframes reactionPop{0%{transform:scale(.92);opacity:.65}60%{transform:scale(1.08)}100%{transform:scale(1);opacity:1}}
.message-reaction{transition:transform .12s ease,background .12s ease,border-color .12s ease,box-shadow .12s ease}
.message-reaction.selected{box-shadow:0 3px 10px rgba(37,99,235,.12)}


/* v42: single light theme — dark mode removed */
html[data-theme="dark"]{color-scheme:dark}
html[data-theme="dark"] .sidebar,html[data-theme="dark"] .topbar,html[data-theme="dark"] .card,html[data-theme="dark"] .modal-box,html[data-theme="dark"] .chat-window,html[data-theme="dark"] .chat-list{background:var(--surface);color:var(--ink)}

/* v42: smooth own-message hover — no lift or bounce */
.bubble-row.mine:hover .bubble,.bubble-row.mine:hover .message-body,.bubble-row.mine:hover{transform:none!important}
.bubble-row.mine .bubble{transition:background-color .18s ease,box-shadow .18s ease,opacity .18s ease}
.bubble-row.mine:hover .bubble{box-shadow:0 2px 10px rgba(31,78,121,.08)}
.bubble-row.mine:active .bubble{transform:none!important;opacity:.97}


/* v44: cleaner dashboard spacing */
.recent-panel .activity-list{display:grid;gap:12px}
.recent-panel .activity{padding:4px 0}

/* v44: own chat messages are completely static on hover */
.bubble-row.mine:hover .bubble,
.bubble-row.mine:hover .bubble-stack,
.bubble-row.mine:hover .bubble-time,
.bubble-row.mine:hover .message-body{transform:none!important;box-shadow:none!important;opacity:1!important}
.bubble-row.mine .bubble,
.bubble-row.mine .bubble-stack,
.bubble-row.mine .bubble-time{transition:none!important}
.bubble-row.mine .msg-delete{display:grid!important;opacity:1!important;transform:none!important;transition:none!important}
.bubble-row.mine .message-react-btn{opacity:1!important;transform:none!important;transition:none!important}

/* v44: chat timestamp sits below the bubble, never inside it */
.bubble-wrap{align-items:flex-start}
.bubble-stack{display:flex;flex-direction:column;align-items:flex-start;min-width:0;max-width:100%}
.bubble-row.mine .bubble-wrap{align-items:flex-end}
.bubble-row.mine .bubble-stack{align-items:flex-end}
.bubble-time{display:block!important;position:static!important;margin-top:5px!important;font-size:8px!important;line-height:1.2!important;opacity:.55!important;padding:0 3px}

/* v45: cleaner message hover + hidden chat timestamps */
.bubble-row.mine:hover .bubble,
.bubble-row.mine:hover .bubble-stack,
.bubble-row.mine:hover .bubble-wrap,
.bubble-row.mine:hover .message-body{transform:none!important;box-shadow:none!important;filter:none!important}
.bubble-row.mine .bubble{transition:none!important}
.bubble-row.mine .msg-delete,
.bubble-row.mine .message-react-btn{opacity:0!important;visibility:hidden!important;transition:opacity .16s ease,visibility .16s ease!important}
.bubble-row.mine:hover .msg-delete,
.bubble-row.mine:hover .message-react-btn{opacity:1!important;visibility:visible!important}
.bubble-time{display:block!important;visibility:hidden!important;opacity:0!important;height:0!important;overflow:hidden!important;margin-top:0!important;padding:0 3px!important;line-height:1!important;font-size:8px!important;transition:opacity .16s ease,visibility .16s ease,height .16s ease,margin-top .16s ease!important}
.bubble-row:hover .bubble-time{visibility:visible!important;opacity:.58!important;height:auto!important;margin-top:5px!important}
.recent-panel .activity-list{padding-top:12px!important}

/* v46: overview spacing, daily dropdown polish, project member avatars */
.recent-panel{margin-top:28px!important}
.recent-panel .activity-list{padding-top:4px!important}
.daily-form-grid select{appearance:none;-webkit-appearance:none;cursor:pointer;min-height:44px;padding-right:38px!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2367758a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;background-size:14px}
.daily-form-grid select:hover{border-color:#b8cae8;background-color:#fbfdff}.daily-form-grid select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(53,104,255,.1)}
.project-members{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:13px;padding-top:11px;border-top:1px solid var(--line)}
.project-members-label{font-size:8px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.project-member-stack{display:flex;align-items:center;justify-content:flex-end}.project-member-stack .avatar{width:25px!important;height:25px!important;border-radius:8px!important;margin-left:-6px;border:2px solid #fff;box-shadow:0 2px 7px rgba(31,61,106,.12)}.project-member-stack .avatar:first-child{margin-left:0}.project-member-more{width:25px;height:25px;border-radius:8px;margin-left:-6px;border:2px solid #fff;background:#eef4ff;color:var(--blue);display:grid;place-items:center;font-size:7px;font-weight:800}.project-card .project-foot{margin-top:12px}
@media(max-width:620px){.recent-panel{margin-top:20px!important}}

/* v47: all user avatars are perfectly circular */
.avatar,
.avatar.small,
.avatar.tiny,
.avatar.large,
.avatar.group-avatar,
.profile-big,
.project-member-stack .avatar,
.selected-avatar-stack .avatar,
.chat-user .avatar,
.group-member-row .avatar,
.member-picker-row .avatar,
.comment-author-avatar .avatar,
.bubble-row .avatar {
  border-radius: 50% !important;
  overflow: hidden !important;
  flex-shrink: 0;
}
.avatar img {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
  border-radius: 50% !important;
}
.project-member-stack .avatar,
.project-member-more { border-radius: 50% !important; }

/* project-v50: premium project card redesign */
.project-grid{gap:20px;align-items:stretch}
.project-card{padding:20px;min-height:330px;display:flex;flex-direction:column;position:relative;overflow:hidden;background:linear-gradient(145deg,#ffffff 0%,#fbfdff 58%,#f4f8ff 100%);border:1px solid #e2eaf5;border-radius:20px;box-shadow:0 10px 30px rgba(24,57,108,.07);cursor:pointer}
.project-card-glow{position:absolute;width:170px;height:170px;right:-80px;top:-85px;border-radius:50%;background:radial-gradient(circle,rgba(33,103,243,.13),rgba(33,103,243,0) 68%);pointer-events:none}
.project-card:after{content:"";position:absolute;left:20px;right:20px;bottom:0;height:2px;border-radius:2px;background:linear-gradient(90deg,#2167f3,#24b7ff);opacity:.35}
.project-card:hover{transform:translateY(-4px);box-shadow:0 22px 50px rgba(24,57,108,.13);border-color:#d4e1f5}
.project-card:before{height:3px;background:linear-gradient(90deg,#2167f3,#6b7cff,#24b7ff)}
.project-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;position:relative;z-index:1}
.project-card-identity{display:flex;align-items:center;gap:12px;min-width:0}
.project-color{width:46px;height:46px;border-radius:14px;background:linear-gradient(135deg,#2167f3,#24b7ff);color:#fff;display:grid;place-items:center;font-size:15px;font-weight:850;box-shadow:0 10px 24px rgba(33,103,243,.22);flex:none}
.project-card-heading{min-width:0}.project-label{display:block;font-size:7px;letter-spacing:.16em;font-weight:850;color:#9aa8bb;margin-bottom:4px}.project-card h3{font-size:15px;line-height:1.25;letter-spacing:-.025em;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.project-card-head .status-pill{flex:none;margin-top:3px}
.project-description{font-size:9px;line-height:1.6;color:#748196;margin:16px 0 14px;min-height:29px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.project-progress-block{padding:11px 12px;border:1px solid #e7edf6;border-radius:13px;background:rgba(247,250,255,.9)}.project-progress-meta{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;font-size:8px;color:#8a96a8;font-weight:700}.project-progress-meta strong{font-size:9px;color:#2167f3}.project-progress{height:6px;border-radius:999px;background:#e9eff7;overflow:hidden}.project-progress i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#2167f3,#24b7ff);box-shadow:0 2px 7px rgba(33,103,243,.2)}
.project-stat-row{display:flex;align-items:center;margin-top:14px;padding:2px 0}.project-stat{display:flex;align-items:center;gap:6px;min-width:0;font-size:8px;color:#7d899b}.project-stat b{color:#26354b;font-size:10px;margin-right:2px}.project-stat .ui-icon{width:13px;height:13px;color:#2167f3}.project-stat-divider{width:1px;height:20px;background:#e5ebf3;margin:0 14px}.project-members{margin-top:13px;padding-top:11px;border-top:1px solid #e8edf5;display:flex;align-items:center;justify-content:space-between;gap:10px}.project-members-label{font-size:7px;letter-spacing:.08em}.project-member-stack{flex-shrink:0}.project-member-stack .avatar{width:27px!important;height:27px!important;border-radius:50%!important;border:2px solid #fff;box-shadow:0 3px 9px rgba(31,61,106,.14)}.project-member-more{width:27px;height:27px;border-radius:50%!important;border:2px solid #fff;background:#eef4ff;color:#2167f3;box-shadow:0 3px 9px rgba(31,61,106,.1);font-size:7px}
.project-card-actions{margin-top:auto;padding-top:15px;display:grid;grid-template-columns:1fr 1fr 38px;gap:7px}.project-card-actions .project-add{margin:0!important;height:34px;padding:7px 8px;border-radius:10px;background:#f6f9fe;font-size:8px;border-color:#e3eaf4}.project-card-actions .project-add:hover{background:#edf4ff;border-color:#cfddf5}.project-card-actions .project-delete{height:34px;width:38px;padding:0;border-radius:10px}.project-card-actions .project-delete:hover{transform:none}
@media(max-width:620px){.project-card{min-height:315px;padding:17px}.project-card-actions{grid-template-columns:1fr 1fr 36px}.project-stat-divider{margin:0 10px}}
/* v50 compact project cards */
.project-grid{gap:14px}
.project-card{padding:14px 15px;min-height:0;height:auto;border-radius:15px;box-shadow:0 6px 20px rgba(24,57,108,.055);transition:box-shadow .22s ease,border-color .22s ease,background-color .22s ease,transform .22s ease}
.project-card:hover{transform:none;box-shadow:0 10px 26px rgba(24,57,108,.09);border-color:#d9e4f4}
.project-card:before{height:2px;transform:scaleX(.0);transform-origin:center;transition:transform .3s ease}
.project-card:hover:before{transform:scaleX(.35)}
.project-card-glow{width:110px;height:110px;right:-60px;top:-60px;opacity:.55}
.project-card-head{gap:8px}
.project-card-identity{gap:9px}
.project-color{width:34px;height:34px;border-radius:10px;font-size:11px;box-shadow:none}
.project-label{font-size:6px;margin-bottom:2px}
.project-card h3{font-size:12px;line-height:1.2}
.project-card-head .status-pill{font-size:6px;padding:4px 7px;margin-top:0}
.project-description{font-size:8px;line-height:1.4;margin:9px 0 9px;min-height:22px;-webkit-line-clamp:2}
.project-progress-block{padding:8px 9px;border-radius:10px}
.project-progress-meta{margin-bottom:5px;font-size:7px}
.project-progress-meta strong{font-size:8px}
.project-progress{height:4px}
.project-stat-row{margin-top:9px;padding:0}
.project-stat{gap:4px;font-size:7px}
.project-stat b{font-size:9px}
.project-stat .ui-icon{width:11px;height:11px}
.project-stat-divider{height:15px;margin:0 10px}
.project-members{margin-top:8px;padding-top:8px;gap:7px}
.project-members-label{font-size:6px}
.project-member-stack .avatar,.project-member-more{width:23px!important;height:23px!important}
.project-member-stack .avatar{margin-left:-5px}
.project-member-more{font-size:6px;margin-left:-5px}
.project-card-actions{padding-top:9px;grid-template-columns:1fr 1fr 32px;gap:5px}
.project-card-actions .project-add,.project-card-actions .project-delete{height:29px;border-radius:8px;font-size:7px}
.project-card-actions .project-add{padding:5px 6px}
.project-card-actions .project-delete{width:32px}
@media(max-width:620px){.project-card{padding:13px;min-height:0}.project-card-actions{grid-template-columns:1fr 1fr 32px}.project-stat-divider{margin:0 8px}}
/* v51 project cards — premium compact hover redesign */
.project-card{
  border:1px solid #dfe8f5!important;
  background:linear-gradient(145deg,#fff 0%,#fbfdff 58%,#f2f7ff 100%)!important;
  box-shadow:0 7px 22px rgba(24,57,108,.065)!important;
  transition:transform .28s cubic-bezier(.22,.75,.25,1),box-shadow .28s ease,border-color .28s ease,background .28s ease!important;
}
.project-card:before{
  inset:0!important;
  width:auto!important;
  height:auto!important;
  border-radius:15px!important;
  background:linear-gradient(135deg,rgba(33,103,243,.8),rgba(36,183,255,.35),rgba(123,92,255,.65))!important;
  opacity:0!important;
  transform:none!important;
  transition:opacity .28s ease!important;
  padding:1px!important;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
  z-index:3;
}
.project-card:hover{
  transform:translateY(-5px) scale(1.008)!important;
  border-color:#bcd2f5!important;
  box-shadow:0 18px 38px rgba(24,57,108,.14),0 0 0 1px rgba(33,103,243,.04)!important;
  background:linear-gradient(145deg,#fff 0%,#f9fcff 55%,#eef5ff 100%)!important;
}
.project-card:hover:before{opacity:1!important}
.project-card .project-card-glow{
  transition:transform .45s ease,opacity .35s ease!important;
}
.project-card:hover .project-card-glow{transform:scale(1.45);opacity:.9!important}
.project-card .project-color{
  transition:transform .3s cubic-bezier(.22,.75,.25,1),box-shadow .3s ease!important;
}
.project-card:hover .project-color{transform:translateY(-2px) rotate(-3deg);box-shadow:0 9px 20px rgba(33,103,243,.2)!important}
.project-card .project-card-actions{position:relative;z-index:5}
.project-card-actions .project-delete{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  visibility:visible!important;
  opacity:1!important;
  flex:0 0 32px!important;
  min-width:32px!important;
  width:32px!important;
  height:29px!important;
  padding:0!important;
  margin:0!important;
  border:1px solid #ffd0d7!important;
  background:#fff4f6!important;
  color:#d84b5b!important;
  box-shadow:none!important;
}
.project-card-actions .project-delete:hover{
  background:#ffe9ed!important;
  border-color:#f2aeb8!important;
  color:#c93447!important;
  transform:translateY(-2px) scale(1.04)!important;
  box-shadow:0 7px 15px rgba(216,75,91,.14)!important;
}
.project-card-actions .project-delete .ui-icon{width:13px!important;height:13px!important}
.project-card-actions .project-add{transition:transform .22s ease,background .22s ease,border-color .22s ease,box-shadow .22s ease!important}
.project-card-actions .project-add:hover{transform:translateY(-2px)!important;box-shadow:0 6px 14px rgba(33,103,243,.08)!important}
@media(max-width:620px){
 .project-card:hover{transform:translateY(-3px)!important}
 .project-card-actions .project-delete{flex-basis:32px!important;width:32px!important}
}
@media(prefers-reduced-motion:reduce){
 .project-card,.project-card:before,.project-card-glow,.project-color,.project-card-actions .project-add,.project-card-actions .project-delete{transition:none!important}
 .project-card:hover{transform:none!important}
}
/* v51 project cards — premium compact hover redesign */
.project-card{border:1px solid #dfe8f5!important;background:linear-gradient(145deg,#fff 0%,#fbfdff 58%,#f2f7ff 100%)!important;box-shadow:0 7px 22px rgba(24,57,108,.065)!important;transition:transform .28s cubic-bezier(.22,.75,.25,1),box-shadow .28s ease,border-color .28s ease,background .28s ease!important}
.project-card:before{inset:0!important;width:auto!important;height:auto!important;border-radius:15px!important;background:linear-gradient(135deg,rgba(33,103,243,.8),rgba(36,183,255,.35),rgba(123,92,255,.65))!important;opacity:0!important;transform:none!important;transition:opacity .28s ease!important;padding:1px!important;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:3}
.project-card:hover{transform:translateY(-5px) scale(1.008)!important;border-color:#bcd2f5!important;box-shadow:0 18px 38px rgba(24,57,108,.14),0 0 0 1px rgba(33,103,243,.04)!important;background:linear-gradient(145deg,#fff 0%,#f9fcff 55%,#eef5ff 100%)!important}
.project-card:hover:before{opacity:1!important}.project-card .project-card-glow{transition:transform .45s ease,opacity .35s ease!important}.project-card:hover .project-card-glow{transform:scale(1.45);opacity:.9!important}.project-card .project-color{transition:transform .3s cubic-bezier(.22,.75,.25,1),box-shadow .3s ease!important}.project-card:hover .project-color{transform:translateY(-2px) rotate(-3deg);box-shadow:0 9px 20px rgba(33,103,243,.2)!important}
.project-card .project-card-actions{position:relative;z-index:5}.project-card-actions .project-delete{display:inline-flex!important;align-items:center!important;justify-content:center!important;visibility:visible!important;opacity:1!important;flex:0 0 32px!important;min-width:32px!important;width:32px!important;height:29px!important;padding:0!important;margin:0!important;border:1px solid #ffd0d7!important;background:#fff4f6!important;color:#d84b5b!important;box-shadow:none!important}.project-card-actions .project-delete:hover{background:#ffe9ed!important;border-color:#f2aeb8!important;color:#c93447!important;transform:translateY(-2px) scale(1.04)!important;box-shadow:0 7px 15px rgba(216,75,91,.14)!important}.project-card-actions .project-delete .ui-icon{width:13px!important;height:13px!important}.project-card-actions .project-add{transition:transform .22s ease,background .22s ease,border-color .22s ease,box-shadow .22s ease!important}.project-card-actions .project-add:hover{transform:translateY(-2px)!important;box-shadow:0 6px 14px rgba(33,103,243,.08)!important}
@media(max-width:620px){.project-card:hover{transform:translateY(-3px)!important}.project-card-actions .project-delete{flex-basis:32px!important;width:32px!important}}@media(prefers-reduced-motion:reduce){.project-card,.project-card:before,.project-card-glow,.project-color,.project-card-actions .project-add,.project-card-actions .project-delete{transition:none!important}.project-card:hover{transform:none!important}}

/* v53 — attractive compact project cards */
.project-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch}
.project-card{padding:17px 18px 16px!important;min-height:0!important;border-radius:18px!important;border:1px solid #dce6f4!important;background:linear-gradient(145deg,#ffffff 0%,#f8fbff 64%,#eef6ff 100%)!important;box-shadow:0 8px 24px rgba(24,57,108,.07)!important;overflow:hidden!important;isolation:isolate!important;transition:transform .28s cubic-bezier(.2,.75,.25,1),box-shadow .28s ease,border-color .28s ease!important}
.project-card-glow{width:150px!important;height:150px!important;right:-70px!important;top:-75px!important;opacity:.5!important;background:radial-gradient(circle,rgba(33,103,243,.18),rgba(36,183,255,.07) 38%,transparent 70%)!important;transition:transform .5s ease,opacity .35s ease!important}
.project-card:before{content:""!important;position:absolute!important;inset:0!important;width:auto!important;height:auto!important;padding:1.5px!important;border-radius:18px!important;background:linear-gradient(120deg,#2167f3,#24b7ff,#7c62ff,#2167f3)!important;background-size:300% 300%!important;opacity:0!important;transform:none!important;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0)!important;-webkit-mask-composite:xor!important;mask-composite:exclude!important;pointer-events:none!important;z-index:8!important;animation:projectBorderFlow 3.2s linear infinite paused!important;transition:opacity .25s ease!important}
.project-card:after{content:""!important;position:absolute!important;left:18px!important;right:18px!important;bottom:0!important;height:3px!important;border-radius:999px!important;background:linear-gradient(90deg,#2167f3,#24b7ff,#7c62ff)!important;opacity:.2!important;transition:opacity .25s ease,transform .25s ease!important;z-index:2!important}
.project-card:hover{transform:translateY(-5px)!important;border-color:#bcd3f4!important;box-shadow:0 18px 38px rgba(24,57,108,.14),0 0 26px rgba(33,103,243,.07)!important}
.project-card:hover:before{opacity:1!important;animation-play-state:running!important}
.project-card:hover:after{opacity:.9!important;transform:scaleX(.94)!important}
.project-card:hover .project-card-glow{transform:scale(1.35)!important;opacity:.95!important}
.project-card-head{gap:10px!important}
.project-card-identity{gap:10px!important}
.project-color{width:42px!important;height:42px!important;border-radius:13px!important;font-size:14px!important;box-shadow:0 8px 18px rgba(33,103,243,.18)!important;transition:transform .3s ease,box-shadow .3s ease!important}
.project-card:hover .project-color{transform:translateY(-2px) rotate(-3deg)!important;box-shadow:0 12px 24px rgba(33,103,243,.25)!important}
.project-label{font-size:7px!important;letter-spacing:.14em!important;margin-bottom:3px!important;color:#8190a6!important}
.project-card h3{font-size:14px!important;line-height:1.25!important;font-weight:850!important;color:#17263d!important}
.project-card-head .status-pill{font-size:7px!important;padding:5px 8px!important;border-radius:999px!important}
.project-description{font-size:9px!important;line-height:1.5!important;margin:11px 0 10px!important;min-height:27px!important;color:#68778d!important}
.project-progress-block{padding:10px 11px!important;border-radius:12px!important;background:linear-gradient(135deg,#f8fbff,#f2f7ff)!important;border-color:#e0e9f5!important}
.project-progress-meta{font-size:8px!important;margin-bottom:7px!important}
.project-progress-meta strong{font-size:10px!important;color:#2167f3!important}
.project-progress{height:7px!important;margin:0!important;background:#e5edf7!important}
.project-progress i{background:linear-gradient(90deg,#2167f3,#24b7ff,#6d73ff)!important;box-shadow:0 0 8px rgba(33,103,243,.18)!important}
.project-stat-row{margin-top:11px!important;padding:0!important}
.project-stat{font-size:9px!important;gap:5px!important;color:#748197!important}
.project-stat b{font-size:10px!important;color:#27364d!important}
.project-stat-divider{height:18px!important;margin:0 12px!important;background:#dfe7f1!important}
.project-members{margin-top:11px!important;padding-top:9px!important;border-top:1px solid #e3eaf3!important;justify-content:flex-start!important;gap:10px!important}
.project-members-label{order:2!important;font-size:7px!important;letter-spacing:.07em!important;color:#8996a9!important}
.project-member-stack{order:1!important;justify-content:flex-start!important}
.project-member-stack .avatar{width:27px!important;height:27px!important;border-radius:50%!important;border:2px solid #fff!important;margin-left:-5px!important;box-shadow:0 3px 9px rgba(24,57,108,.12)!important}
.project-member-stack .avatar:first-child{margin-left:0!important}
.project-member-more{width:27px!important;height:27px!important;border-radius:50%!important;margin-left:-5px!important;border:2px solid #fff!important;font-size:8px!important}
.project-card-actions{margin-top:12px!important;padding-top:0!important;display:grid!important;grid-template-columns:1fr 1fr 40px!important;gap:7px!important}
.project-card-actions .project-add,.project-card-actions .project-delete{height:37px!important;min-height:37px!important;border-radius:10px!important;font-size:9px!important;font-weight:850!important}
.project-card-actions .project-add{padding:8px 10px!important;background:#f4f8ff!important;border:1px solid #dbe6f4!important;color:#2167f3!important;transition:transform .22s ease,background .22s ease,border-color .22s ease,box-shadow .22s ease!important}
.project-card-actions .project-add:hover{transform:translateY(-2px)!important;background:#eaf2ff!important;border-color:#c7daf5!important;box-shadow:0 7px 15px rgba(33,103,243,.12)!important}
.project-card-actions .project-delete{width:40px!important;min-width:40px!important;flex:0 0 40px!important;padding:0!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;background:#fff3f5!important;border:1px solid #ffd1d8!important;color:#d84b5b!important;box-shadow:none!important;transition:transform .22s ease,background .22s ease,border-color .22s ease,box-shadow .22s ease!important}
.project-card-actions .project-delete .ui-icon{width:15px!important;height:15px!important}
.project-card-actions .project-delete:hover{transform:translateY(-2px) scale(1.03)!important;background:#ffe8ec!important;border-color:#f2aab6!important;box-shadow:0 7px 15px rgba(216,75,91,.14)!important}
.project-card:nth-child(3n+1) .project-color{background:linear-gradient(135deg,#2167f3,#24b7ff)!important}
.project-card:nth-child(3n+2) .project-color{background:linear-gradient(135deg,#705cff,#9b7cff)!important}
.project-card:nth-child(3n) .project-color{background:linear-gradient(135deg,#0fae8a,#36d6ad)!important}
.project-card:nth-child(3n+2) .project-progress i{background:linear-gradient(90deg,#705cff,#a37dff)!important}
.project-card:nth-child(3n) .project-progress i{background:linear-gradient(90deg,#0fae8a,#36d6ad)!important}
@keyframes projectBorderFlow{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@media(max-width:1200px){.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.project-grid{grid-template-columns:1fr}.project-card{padding:15px!important}.project-card-actions{grid-template-columns:1fr 1fr 40px!important}}
@media(prefers-reduced-motion:reduce){.project-card,.project-card:before,.project-card:after,.project-card-glow,.project-color,.project-card-actions .project-add,.project-card-actions .project-delete{transition:none!important;animation:none!important}.project-card:hover{transform:none!important}}

/* v54 — reference-inspired project cards */
.project-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:18px!important;align-items:stretch!important}
.project-card{display:grid!important;grid-template-columns:58px minmax(0,1fr)!important;padding:0!important;min-height:0!important;height:auto!important;border-radius:16px!important;border:1px solid #dfe7f2!important;background:#fff!important;box-shadow:0 8px 24px rgba(25,58,105,.08)!important;overflow:hidden!important;position:relative!important;isolation:isolate!important;cursor:pointer!important;transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease,border-color .28s ease!important}
.project-card:before{content:""!important;position:absolute!important;inset:0!important;width:auto!important;height:auto!important;padding:1.5px!important;border-radius:16px!important;background:linear-gradient(120deg,var(--project-accent,#2167f3),rgba(255,255,255,.2),var(--project-accent-2,#24b7ff),var(--project-accent,#2167f3))!important;background-size:260% 260%!important;opacity:0!important;transform:none!important;z-index:9!important;pointer-events:none!important;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0)!important;-webkit-mask-composite:xor!important;mask-composite:exclude!important;transition:opacity .25s ease!important;animation:projectBorderFlow54 2.8s linear infinite paused!important}
.project-card:hover{transform:translateY(-5px)!important;border-color:color-mix(in srgb,var(--project-accent,#2167f3) 38%,#dfe7f2)!important;box-shadow:0 18px 40px rgba(25,58,105,.14),0 0 26px color-mix(in srgb,var(--project-accent,#2167f3) 13%,transparent)!important}
.project-card:hover:before{opacity:1!important;animation-play-state:running!important}
.project-card-glow{position:absolute!important;width:180px!important;height:180px!important;right:-85px!important;top:-95px!important;border-radius:50%!important;background:radial-gradient(circle,color-mix(in srgb,var(--project-accent,#2167f3) 18%,transparent),transparent 68%)!important;opacity:.55!important;transition:transform .45s ease,opacity .35s ease!important;pointer-events:none!important}
.project-card:hover .project-card-glow{transform:scale(1.3)!important;opacity:.9!important}
.project-avatar-rail{grid-column:1!important;grid-row:1!important;display:flex!important;align-items:flex-start!important;justify-content:center!important;padding:28px 7px 20px!important;background:linear-gradient(180deg,#f7faff 0%,#f0f5fb 100%)!important;border-right:1px solid #e4ebf4!important;position:relative!important;z-index:2!important}
.project-avatar-stack{display:flex!important;flex-direction:column!important;align-items:center!important;gap:8px!important}
.project-avatar-stack .avatar{width:34px!important;height:34px!important;border-radius:50%!important;border:2px solid #fff!important;margin:0!important;box-shadow:0 3px 10px rgba(24,57,108,.14)!important;object-fit:cover!important}
.project-avatar-more{width:34px!important;height:34px!important}
.project-member-more{width:34px!important;height:34px!important;border-radius:50%!important;margin:0!important;border:2px solid #fff!important;background:#fff!important;color:var(--project-accent,#2167f3)!important;display:grid!important;place-items:center!important;font-size:10px!important;font-weight:850!important;box-shadow:0 3px 10px rgba(24,57,108,.1)!important}
.project-card-main{grid-column:2!important;grid-row:1!important;min-width:0!important;padding:19px 18px 15px!important;position:relative!important;z-index:2!important}
.project-card-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:10px!important}
.project-card-identity{display:flex!important;align-items:center!important;gap:11px!important;min-width:0!important}
.project-color{width:46px!important;height:46px!important;border-radius:12px!important;display:grid!important;place-items:center!important;color:#fff!important;font-size:16px!important;font-weight:900!important;flex:none!important;background:linear-gradient(135deg,var(--project-accent,#2167f3),var(--project-accent-2,#24b7ff))!important;box-shadow:0 8px 18px color-mix(in srgb,var(--project-accent,#2167f3) 22%,transparent)!important;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease!important}
.project-card:hover .project-color{transform:translateY(-3px) rotate(-2deg)!important;box-shadow:0 12px 24px color-mix(in srgb,var(--project-accent,#2167f3) 28%,transparent)!important}
.project-label{font-size:8px!important;letter-spacing:.14em!important;font-weight:850!important;color:#8c99ab!important;margin-bottom:3px!important}
.project-card h3{font-size:17px!important;line-height:1.18!important;letter-spacing:-.025em!important;font-weight:900!important;color:#13233d!important;margin:0!important;white-space:normal!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
.project-card-head .status-pill{font-size:8px!important;padding:6px 10px!important;border-radius:999px!important;flex:none!important;margin-top:2px!important}
.project-description{font-size:10px!important;line-height:1.48!important;color:#627189!important;margin:14px 0 12px!important;min-height:30px!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
.project-progress-block{padding:10px 11px!important;border-radius:11px!important;background:#f6f9fd!important;border:1px solid #e7edf5!important}
.project-progress-meta{display:flex!important;align-items:center!important;justify-content:space-between!important;font-size:9px!important;color:#66758b!important;margin-bottom:7px!important}
.project-progress-meta strong{font-size:11px!important;color:var(--project-accent,#2167f3)!important}
.project-progress{height:7px!important;border-radius:999px!important;background:#dfe7f0!important;overflow:hidden!important}
.project-progress i{display:block!important;height:100%!important;border-radius:inherit!important;background:linear-gradient(90deg,var(--project-accent,#2167f3),var(--project-accent-2,#24b7ff))!important;box-shadow:0 0 9px color-mix(in srgb,var(--project-accent,#2167f3) 25%,transparent)!important}
.project-stat-row{display:flex!important;align-items:center!important;margin-top:12px!important;padding:0!important}
.project-stat{font-size:9px!important;gap:6px!important;color:#718096!important}
.project-stat b{font-size:11px!important;color:#17263d!important}
.project-stat .ui-icon{width:15px!important;height:15px!important;color:#74849a!important}
.project-stat-divider{height:22px!important;width:1px!important;margin:0 15px!important;background:#e1e8f1!important}
.project-card-actions{display:grid!important;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) auto!important;gap:8px!important;margin-top:14px!important;padding-top:0!important}
.project-card-actions .project-add,.project-card-actions .project-delete{height:40px!important;min-height:40px!important;border-radius:9px!important;font-size:10px!important;font-weight:850!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;cursor:pointer!important;white-space:nowrap!important;transition:transform .22s ease,box-shadow .22s ease,background .22s ease,border-color .22s ease,color .22s ease!important}
.project-card-actions .project-add{padding:8px 12px!important;border:1px solid color-mix(in srgb,var(--project-accent,#2167f3) 25%,#dbe6f4)!important;background:#fff!important;color:var(--project-accent,#2167f3)!important}
.project-card-actions .project-primary-action{background:var(--project-accent,#2167f3)!important;border-color:var(--project-accent,#2167f3)!important;color:#fff!important;box-shadow:0 6px 14px color-mix(in srgb,var(--project-accent,#2167f3) 18%,transparent)!important}
.project-card-actions .project-secondary-action{background:#fff!important}
.project-card-actions .project-add:hover{transform:translateY(-2px)!important;box-shadow:0 8px 16px color-mix(in srgb,var(--project-accent,#2167f3) 14%,transparent)!important}
.project-card-actions .project-primary-action:hover{filter:brightness(1.04)!important}
.project-card-actions .project-delete{width:auto!important;min-width:82px!important;padding:8px 13px!important;border:1px solid #ffcbd3!important;background:#fff5f6!important;color:#d44254!important;box-shadow:none!important}
.project-card-actions .project-delete .ui-icon{width:15px!important;height:15px!important}
.project-card-actions .project-delete:hover{transform:translateY(-2px)!important;background:#ffe9ed!important;border-color:#f2a8b4!important;color:#c72f43!important;box-shadow:0 8px 16px rgba(212,66,84,.14)!important}
.project-card-blue{--project-accent:#2167f3;--project-accent-2:#24b7ff}
.project-card-purple{--project-accent:#705cff;--project-accent-2:#a37dff}
.project-card-green{--project-accent:#16a765;--project-accent-2:#36d6ad}
.project-card-orange{--project-accent:#f49a21;--project-accent-2:#ffc15b}
.project-card-cyan{--project-accent:#16aebb;--project-accent-2:#49d6e0}
.project-card-pink{--project-accent:#ef4f7b;--project-accent-2:#ff86a5}
@keyframes projectBorderFlow54{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@media(max-width:1200px){.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:720px){.project-grid{grid-template-columns:1fr!important}.project-card{grid-template-columns:50px minmax(0,1fr)!important}.project-card-main{padding:16px 14px 14px!important}.project-avatar-rail{padding:22px 5px 16px!important}.project-avatar-stack .avatar,.project-member-more{width:30px!important;height:30px!important}.project-card-actions{grid-template-columns:1fr 1fr!important}.project-card-actions .project-delete{grid-column:1/-1;width:100%!important}}
@media(prefers-reduced-motion:reduce){.project-card,.project-card:before,.project-card-glow,.project-color,.project-card-actions .project-add,.project-card-actions .project-delete{transition:none!important;animation:none!important}.project-card:hover{transform:none!important}}


/* v55 — project delete confirmation UI + remove project card borders */
.project-card:after{display:none!important}
.project-card{border-color:transparent!important}
.project-card:hover{border-color:transparent!important}
.project-card:before{display:none!important}
.project-delete-confirm{min-width:150px!important;justify-content:center!important;background:#d44254!important;color:#fff!important;border-color:#d44254!important;box-shadow:0 8px 18px rgba(212,66,84,.18)!important}
.project-delete-confirm:hover{background:#c52f43!important;border-color:#c52f43!important;color:#fff!important;transform:translateY(-1px)!important;box-shadow:0 10px 20px rgba(212,66,84,.22)!important}
.project-delete-confirm:disabled{opacity:.72!important;cursor:wait!important;transform:none!important}
.delete-project-overlay{padding:20px!important}
.delete-project-modal{width:min(470px,calc(100vw - 32px))!important;max-width:470px!important;border-radius:20px!important;padding:26px!important;box-shadow:0 28px 80px rgba(18,38,70,.2)!important;border:1px solid #e7edf5!important}
.delete-project-icon{width:54px;height:54px;border-radius:16px;background:#fff0f2;color:#d44254;display:grid;place-items:center;margin-bottom:17px;box-shadow:0 8px 20px rgba(212,66,84,.09)}
.delete-project-icon .ui-icon{width:25px;height:25px}
.delete-project-content h2{font-size:22px!important;line-height:1.2!important;margin:4px 0 8px!important;color:#17263d!important;letter-spacing:-.025em!important}
.delete-project-copy{font-size:12px!important;line-height:1.6!important;color:#6e7d92!important;margin:0!important}
.delete-project-copy strong{color:#27364c!important}
.danger-eyebrow{color:#d44254!important}
.delete-project-warning{display:flex;align-items:flex-start;gap:10px;margin-top:18px;padding:13px 14px;border-radius:12px;background:#fff7f8;border:1px solid #ffdce1;color:#b73547}
.delete-project-warning>.ui-icon{width:18px;height:18px;flex:none;margin-top:1px}
.delete-project-warning strong{display:block;font-size:11px;color:#a82e40;margin-bottom:2px}
.delete-project-warning span{display:block;font-size:10px;line-height:1.45;color:#7c6870}
.delete-project-footer{margin-top:22px;padding-top:16px!important;border-top:1px solid #edf1f6;display:flex;justify-content:flex-end;gap:8px}
.delete-project-footer .btn{min-height:40px;font-size:10px!important;padding:9px 14px!important}
.delete-project-confirm .delete-spinner{width:13px;height:13px;border:2px solid rgba(255,255,255,.42);border-top-color:#fff;border-radius:50%;display:inline-block;animation:deleteSpin55 .65s linear infinite}
@keyframes deleteSpin55{to{transform:rotate(360deg)}}
@media(max-width:520px){.delete-project-modal{padding:21px!important}.delete-project-footer{flex-direction:column-reverse}.delete-project-footer .btn{width:100%!important}.delete-project-confirm{min-width:0!important}}

/* v56: typography + subtask alignment + project button hover readability */
.page-heading h1{font-size:32px!important}
.page-heading p{font-size:12px!important}
.panel-title{font-size:14px!important}
.panel-sub{font-size:10px!important}
.task-top h4{font-size:14px!important;line-height:1.35!important}
.task-desc{font-size:11px!important;line-height:1.55!important}
.task-meta{font-size:10px!important}
.person-main strong{font-size:14px!important}
.person-main span{font-size:10px!important}
.person-card .btn{font-size:10px!important}
.nav-item{font-size:13px!important}

/* Subtasks: keep every row aligned to the left edge while preserving nesting visually. */
.subtask-item{margin-left:0!important;width:100%!important;box-sizing:border-box!important;position:relative!important}
.subtask-item[data-depth="0"]{padding-left:10px!important}
.subtask-item[data-depth="1"]{padding-left:34px!important}
.subtask-item[data-depth="2"]{padding-left:58px!important}
.subtask-item[data-depth="3"]{padding-left:82px!important}
.subtask-item[data-depth="4"]{padding-left:106px!important}
.subtask-item .subtask-actions{margin-left:auto!important}

/* Project primary action: readable in every hover state. */
.project-card-actions .project-primary-action,.project-card-actions .project-primary-action:visited{color:#fff!important;background:var(--project-accent,#2167f3)!important;border-color:var(--project-accent,#2167f3)!important}
.project-card-actions .project-primary-action:hover,.project-card-actions .project-primary-action:focus-visible{color:#fff!important;background:var(--project-accent-strong,#1554d6)!important;border-color:var(--project-accent-strong,#1554d6)!important;filter:none!important;box-shadow:0 10px 20px color-mix(in srgb,var(--project-accent,#2167f3) 24%,transparent)!important}
.project-card-actions .project-primary-action .ui-icon{color:currentColor!important}
@media(max-width:620px){.page-heading h1{font-size:28px!important}.panel-title{font-size:13px!important}.task-top h4{font-size:13px!important}.person-main strong{font-size:13px!important}.nav-item{font-size:12px!important}}


/* v57: compact left-aligned subtasks + reliable checkbox interaction */
.subtask-item{width:max-content!important;max-width:100%!important;align-self:flex-start!important;margin-left:0!important;margin-right:auto!important;flex-wrap:nowrap!important;overflow:visible!important}
.subtask-item[data-depth="0"]{padding-left:10px!important}
.subtask-item[data-depth="1"]{padding-left:28px!important}
.subtask-item[data-depth="2"]{padding-left:46px!important}
.subtask-item[data-depth="3"]{padding-left:64px!important}
.subtask-item[data-depth="4"]{padding-left:82px!important}
.subtask-item .subtask-label{flex:0 1 auto!important;min-width:120px!important;max-width:520px!important;white-space:normal!important}
.subtask-item .subtask-actions{flex:0 0 auto!important;margin-left:14px!important}
.subtask-item .check-wrap{position:relative!important;z-index:20!important;width:20px!important;height:20px!important;display:inline-grid!important;place-items:center!important;flex:0 0 20px!important;pointer-events:auto!important}
.subtask-item .check-wrap input[type="checkbox"]{position:absolute!important;inset:0!important;width:20px!important;height:20px!important;margin:0!important;opacity:0!important;z-index:30!important;cursor:pointer!important;pointer-events:auto!important;appearance:none!important;-webkit-appearance:none!important}
.subtask-item .check-wrap .fake-check{position:relative!important;z-index:1!important;pointer-events:none!important}
.subtask-item .subtask-drag-handle{z-index:21!important}
@media(max-width:760px){.subtask-item{max-width:calc(100vw - 70px)!important}.subtask-item .subtask-label{max-width:calc(100vw - 220px)!important}}
@media(max-width:520px){.subtask-item{width:100%!important;max-width:100%!important;flex-wrap:wrap!important}.subtask-item .subtask-actions{margin-left:auto!important}.subtask-item .subtask-label{max-width:calc(100% - 90px)!important}}

/* v60 — clearer nested subtask hierarchy */
.subtask-list .subtask-item[data-depth="1"]{margin-left:34px!important;width:calc(100% - 34px)!important;position:relative;border-left:3px solid #8eb7ff!important;background:#fbfdff!important}
.subtask-list .subtask-item[data-depth="2"]{margin-left:68px!important;width:calc(100% - 68px)!important;position:relative;border-left:3px solid #a9c9ff!important;background:#fbfdff!important}
.subtask-list .subtask-item[data-depth="3"]{margin-left:102px!important;width:calc(100% - 102px)!important;position:relative;border-left:3px solid #bfd8ff!important;background:#fbfdff!important}
.subtask-list .subtask-item[data-depth="4"]{margin-left:136px!important;width:calc(100% - 136px)!important;position:relative;border-left:3px solid #d0e2ff!important;background:#fbfdff!important}
.subtask-list .subtask-item[data-depth]:not([data-depth="0"])::before{content:"";position:absolute;left:-17px;top:50%;width:13px;height:1px;background:#b7cdf0;opacity:.95}
.subtask-list .subtask-item[data-depth]:not([data-depth="0"])::after{content:"";position:absolute;left:-20px;top:-9px;width:1px;height:calc(50% + 9px);background:#d5e3f6;pointer-events:none}
.subtask-list .subtask-item[data-depth="1"]::after{display:block}
.subtask-list .subtask-item[data-depth="2"]::after,.subtask-list .subtask-item[data-depth="3"]::after,.subtask-list .subtask-item[data-depth="4"]::after{display:block}
@media(max-width:760px){
 .subtask-list .subtask-item[data-depth="1"]{margin-left:24px!important;width:calc(100% - 24px)!important}
 .subtask-list .subtask-item[data-depth="2"]{margin-left:48px!important;width:calc(100% - 48px)!important}
 .subtask-list .subtask-item[data-depth="3"]{margin-left:72px!important;width:calc(100% - 72px)!important}
 .subtask-list .subtask-item[data-depth="4"]{margin-left:96px!important;width:calc(100% - 96px)!important}
 .subtask-list .subtask-item[data-depth]:not([data-depth="0"])::before{left:-13px;width:10px}
 .subtask-list .subtask-item[data-depth]:not([data-depth="0"])::after{left:-16px}
}


/* v61: My Tasks layout - avatars left, date right, larger typography */
.my-tasks-list{overflow:hidden}
.my-tasks-list .my-task-row{display:grid;grid-template-columns:86px minmax(0,1fr) auto auto;align-items:center;gap:18px;padding:17px 20px;border-bottom:1px solid var(--line);cursor:pointer;transition:background .18s ease,box-shadow .18s ease}
.my-tasks-list .my-task-row:last-child{border-bottom:0}
.my-tasks-list .my-task-row:hover{background:#f8fbff;box-shadow:inset 3px 0 0 rgba(33,103,243,.18)}
.my-task-avatars{display:flex;align-items:center;justify-content:flex-start;min-width:0}
.my-task-avatars .stack{display:flex;align-items:center;justify-content:flex-start}
.my-task-avatars .avatar{width:36px!important;height:36px!important;border-radius:50%!important;border:2px solid #fff;margin-left:-9px;box-shadow:0 2px 8px rgba(25,54,100,.12);font-size:10px!important}
.my-task-avatars .avatar:first-child{margin-left:0}
.my-task-avatars .stack .avatar:nth-child(n+4){display:none}
.my-task-main{min-width:0}
.my-task-main strong{display:block;font-size:15px!important;line-height:1.3;font-weight:800;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.my-task-main span{display:block;font-size:11px!important;line-height:1.4;color:var(--muted);margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.my-task-date{display:flex;align-items:center;justify-content:flex-end;min-width:125px;color:var(--muted)}
.my-task-date>span{display:flex;align-items:center;gap:6px;white-space:nowrap}
.my-task-date .ui-icon{width:15px;height:15px;color:var(--blue)}
.my-task-date b{font-size:12px;color:#42516a;font-weight:750}
.my-task-status{display:flex;align-items:center;gap:8px;justify-content:flex-end}
.my-task-status .status-pill{font-size:10px;padding:6px 9px}
.my-task-status .btn{font-size:11px;padding:9px 12px}
@media(max-width:900px){.my-tasks-list .my-task-row{grid-template-columns:64px minmax(0,1fr) auto;gap:12px;padding:15px}.my-task-status{grid-column:2/-1;justify-content:flex-start}.my-task-date{justify-content:flex-start;min-width:0}.my-task-main strong{font-size:14px!important}}
@media(max-width:620px){.my-tasks-list .my-task-row{grid-template-columns:52px minmax(0,1fr);gap:10px;padding:13px 12px}.my-task-avatars .avatar{width:32px!important;height:32px!important}.my-task-date{grid-column:2;justify-content:flex-start}.my-task-status{grid-column:2;flex-wrap:wrap}.my-task-main strong{font-size:13px!important}.my-task-main span{font-size:10px!important}.my-task-date b{font-size:10px}.my-task-status .btn{font-size:10px;padding:8px 10px}}

/* v62: task board card layout and larger status typography */
.task-card .task-top h4{font-size:16px!important;line-height:1.35!important;font-weight:800!important}
.task-card .task-desc{font-size:12px!important;line-height:1.55!important}
.task-card .task-meta{font-size:11px!important}
.task-card .task-foot{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin-top:16px!important;padding-top:12px!important;border-top:1px solid #e7edf5!important}
.task-card .task-foot .stack{display:flex!important;align-items:center!important;justify-content:flex-start!important;order:1!important}
.task-card .task-foot .task-date{display:inline-flex!important;align-items:center!important;justify-content:flex-end!important;gap:5px!important;order:2!important;margin-left:auto!important;color:#8b97a8!important;font-size:11px!important;white-space:nowrap!important}
.task-card .task-foot .task-date .ui-icon{width:13px!important;height:13px!important}
.task-card .task-foot .avatar.small{width:34px!important;height:34px!important;border-radius:50%!important;font-size:9px!important}
.kanban-title{font-size:14px!important;font-weight:800!important}
.kanban-head .count-badge{font-size:10px!important;min-width:24px!important;height:24px!important}
@media(max-width:620px){.task-card .task-top h4{font-size:15px!important}.task-card .task-desc{font-size:11px!important}.task-card .task-foot .task-date{font-size:10px!important}.task-card .task-foot .avatar.small{width:30px!important;height:30px!important}}

/* v63 — chat emoji picker + inline message editing */
.chat-input-wrap{position:relative!important;min-width:0!important;flex:1!important;display:flex!important;align-items:center!important;gap:7px!important}
.chat-input-wrap #message{min-width:0!important;flex:1!important}
.chat-input-wrap .emoji-trigger{flex:none!important;width:34px!important;height:34px!important;padding:0!important}
.emoji-picker{position:absolute!important;left:0!important;right:auto!important;bottom:48px!important;width:336px!important;max-width:min(336px,calc(100vw - 32px))!important;max-height:286px!important;box-sizing:border-box!important;padding:10px!important;display:grid!important;grid-template-columns:repeat(8,minmax(0,1fr))!important;gap:4px!important;overflow-y:auto!important;overflow-x:hidden!important;background:#fff!important;border:1px solid #dfe6f0!important;border-radius:15px!important;box-shadow:0 18px 50px rgba(17,39,75,.18)!important;z-index:500!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(6px) scale(.98)!important;transition:opacity .16s ease,transform .16s ease,visibility .16s ease!important}
.emoji-picker.show{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:none!important}
.emoji-picker button{width:34px!important;height:34px!important;border:0!important;background:transparent!important;border-radius:9px!important;padding:0!important;display:grid!important;place-items:center!important;font-size:22px!important;line-height:1!important;cursor:pointer!important;transition:background .12s ease,transform .12s ease!important}
.emoji-picker button:hover{background:#eef4ff!important;transform:scale(1.1)!important}
.emoji-picker::-webkit-scrollbar{width:6px}.emoji-picker::-webkit-scrollbar-thumb{background:#c4cfdd;border-radius:8px}
.msg-actions{position:absolute!important;right:0!important;top:-30px!important;display:flex!important;align-items:center!important;gap:4px!important;opacity:0!important;visibility:hidden!important;transform:translateY(3px)!important;transition:opacity .15s ease,transform .15s ease,visibility .15s ease!important;z-index:10!important}
.bubble-wrap{position:relative!important}
.bubble-wrap:hover .msg-actions,.msg-actions:focus-within{opacity:1!important;visibility:visible!important;transform:none!important}
.msg-actions button{width:28px!important;height:28px!important;border:1px solid #dfe6f0!important;background:#fff!important;border-radius:8px!important;display:grid!important;place-items:center!important;padding:0!important;cursor:pointer!important;box-shadow:0 5px 14px rgba(17,39,75,.08)!important}
.msg-actions .msg-edit{color:#55708f!important}.msg-actions .msg-delete{color:#c94b5d!important;display:grid!important}
.msg-actions .msg-edit:hover{background:#eef5ff!important;color:#2167f3!important}.msg-actions .msg-delete:hover{background:#fff0f2!important;color:#c9364e!important}
.msg-actions .ui-icon{width:14px!important;height:14px!important}
.message-edit-wrap{min-width:220px!important;max-width:min(420px,70vw)!important}
.message-edit-input{display:block!important;width:100%!important;box-sizing:border-box!important;resize:vertical!important;min-height:58px!important;padding:9px 10px!important;border:1px solid rgba(255,255,255,.45)!important;border-radius:9px!important;background:rgba(255,255,255,.14)!important;color:inherit!important;outline:0!important;font:inherit!important;line-height:1.45!important}
.message-edit-input:focus{border-color:rgba(255,255,255,.8)!important;box-shadow:0 0 0 3px rgba(255,255,255,.1)!important}
.message-edit-actions{display:flex!important;justify-content:flex-end!important;gap:6px!important;margin-top:7px!important}
.message-edit-actions .btn{height:29px!important;padding:0 9px!important;font-size:9px!important}
.message-edit-cancel{background:rgba(255,255,255,.12)!important;color:inherit!important;border-color:rgba(255,255,255,.3)!important}
@media(max-width:620px){.emoji-picker{left:0!important;width:calc(100vw - 28px)!important;grid-template-columns:repeat(7,minmax(0,1fr))!important}.emoji-picker button{width:35px!important;height:35px!important}.msg-actions{top:-32px}.message-edit-wrap{max-width:78vw!important}}

/* v65 — stable chat composer + non-overlapping message editor */
.chat-compose{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto!important;align-items:center!important;gap:10px!important;width:100%!important;min-width:0!important;padding:12px 14px!important;overflow:visible!important}
.chat-compose>.icon-btn{flex:none!important}
.chat-input-wrap{position:relative!important;display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;align-items:center!important;gap:8px!important;width:100%!important;min-width:0!important;flex:1 1 auto!important}
.chat-input-wrap #message{display:block!important;width:100%!important;min-width:0!important;height:42px!important;margin:0!important;padding:10px 13px!important;border:1px solid var(--line)!important;border-radius:12px!important;outline:0!important;background:#fff!important;font-size:12px!important;line-height:1.35!important}
.chat-input-wrap .emoji-trigger{position:relative!important;left:auto!important;top:auto!important;bottom:auto!important;display:grid!important;place-items:center!important;flex:none!important;width:38px!important;height:38px!important;margin:0!important}
.chat-file-preview{grid-column:1 / -1!important;min-width:0!important;margin:0!important}
.emoji-picker{left:0!important;bottom:52px!important;z-index:1000!important}

/* Keep edited messages inside the conversation pane and never let controls overlap. */
.bubble-row{min-width:0!important}
.bubble-wrap{min-width:0!important;max-width:78%!important;overflow:visible!important}
.bubble-stack{min-width:0!important;max-width:100%!important}
.bubble{min-width:0!important;overflow:visible!important}
.bubble-row.is-editing .bubble{width:min(560px,calc(100vw - 120px))!important;max-width:min(560px,78vw)!important}
.message-edit-wrap{width:100%!important;min-width:0!important;max-width:none!important}
.message-edit-input{width:100%!important;min-width:0!important;max-width:100%!important;min-height:72px!important;max-height:220px!important;overflow:auto!important;white-space:pre-wrap!important;overflow-wrap:anywhere!important}
.message-edit-actions{width:100%!important;flex-wrap:wrap!important;align-items:center!important}
.message-edit-actions .btn{flex:0 0 auto!important;min-width:72px!important}
.message-edit-cancel{cursor:pointer!important;pointer-events:auto!important}
@media(max-width:620px){
 .chat-compose{grid-template-columns:auto minmax(0,1fr) auto!important;gap:6px!important;padding:10px!important}
 .chat-compose>.icon-btn{width:38px!important;height:38px!important}
 .chat-compose>.btn{height:38px!important;padding:0 12px!important}
 .chat-input-wrap{grid-template-columns:auto minmax(0,1fr)!important;gap:6px!important}
 .chat-input-wrap .emoji-trigger{width:36px!important;height:36px!important}
 .chat-input-wrap #message{height:38px!important;font-size:11px!important}
 .bubble-row.is-editing .bubble{width:min(86vw,560px)!important;max-width:86vw!important}
}

/* v65 — stable chat composer + non-overlapping message editor */
.chat-compose{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto!important;align-items:center!important;gap:10px!important;width:100%!important;min-width:0!important;padding:12px 14px!important;overflow:visible!important}
.chat-compose>.icon-btn{flex:none!important}
.chat-input-wrap{position:relative!important;display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;align-items:center!important;gap:8px!important;width:100%!important;min-width:0!important;flex:1 1 auto!important}
.chat-input-wrap #message{display:block!important;width:100%!important;min-width:0!important;height:42px!important;margin:0!important;padding:10px 13px!important;border:1px solid var(--line)!important;border-radius:12px!important;outline:0!important;background:#fff!important;font-size:12px!important;line-height:1.35!important}
.chat-input-wrap .emoji-trigger{position:relative!important;left:auto!important;top:auto!important;bottom:auto!important;display:grid!important;place-items:center!important;flex:none!important;width:38px!important;height:38px!important;margin:0!important}
.chat-file-preview{grid-column:1 / -1!important;min-width:0!important;margin:0!important}
.emoji-picker{left:0!important;bottom:52px!important;z-index:1000!important}
.bubble-row{min-width:0!important}
.bubble-wrap{min-width:0!important;max-width:78%!important;overflow:visible!important}
.bubble-stack{min-width:0!important;max-width:100%!important}
.bubble{min-width:0!important;overflow:visible!important}
.bubble-row.is-editing .bubble{width:min(560px,calc(100vw - 120px))!important;max-width:min(560px,78vw)!important}
.message-edit-wrap{width:100%!important;min-width:0!important;max-width:none!important}
.message-edit-input{width:100%!important;min-width:0!important;max-width:100%!important;min-height:72px!important;max-height:220px!important;overflow:auto!important;white-space:pre-wrap!important;overflow-wrap:anywhere!important}
.message-edit-actions{width:100%!important;flex-wrap:wrap!important;align-items:center!important}
.message-edit-actions .btn{flex:0 0 auto!important;min-width:72px!important}
.message-edit-cancel{cursor:pointer!important;pointer-events:auto!important}
@media(max-width:620px){
 .chat-compose{grid-template-columns:auto minmax(0,1fr) auto!important;gap:6px!important;padding:10px!important}
 .chat-compose>.icon-btn{width:38px!important;height:38px!important}
 .chat-compose>.btn{height:38px!important;padding:0 12px!important}
 .chat-input-wrap{grid-template-columns:auto minmax(0,1fr)!important;gap:6px!important}
 .chat-input-wrap .emoji-trigger{width:36px!important;height:36px!important}
 .chat-input-wrap #message{height:38px!important;font-size:11px!important}
 .bubble-row.is-editing .bubble{width:min(86vw,560px)!important;max-width:86vw!important}
}

/* v66 — reactions sit directly beside the message bubble */
.message-reaction-tools{
  flex:0 0 26px!important;
  width:26px!important;
  min-width:26px!important;
  margin-top:0!important;
  align-self:flex-end!important;
  justify-content:center!important;
  transform:none!important;
}
.bubble-row:not(.mine) .message-reaction-tools{margin-left:-28px!important;margin-right:0!important;}
.bubble-row.mine .message-reaction-tools{margin-right:-28px!important;margin-left:0!important;}
.message-reaction-picker{right:0!important;bottom:30px!important;}
@media(max-width:620px){
  .message-reaction-tools{flex-basis:26px!important;width:26px!important;min-width:26px!important}
  .bubble-row:not(.mine) .message-reaction-tools{margin-left:-26px!important}
  .bubble-row.mine .message-reaction-tools{margin-right:-26px!important}
}

/* v67 — message reactions live inside the bubble + FLIP subtask drag animation */
.bubble{position:relative!important;overflow:visible!important;padding-bottom:28px!important}
.bubble .message-reaction-tools{position:absolute!important;right:6px!important;bottom:5px!important;width:26px!important;min-width:26px!important;height:26px!important;margin:0!important;display:flex!important;align-items:center!important;justify-content:center!important;z-index:4}
.bubble .message-react-btn{width:26px!important;height:26px!important;margin:0!important}
.bubble .message-reactions{padding-right:34px!important;margin-bottom:0!important}
.bubble .message-reaction-picker{right:0!important;bottom:31px!important}
.bubble-row .message-reaction-tools{flex:none!important}
.subtask-drag-placeholder{box-sizing:border-box;width:100%;border:1.5px dashed #a8c3ee;border-radius:10px;background:#f5f9ff;min-height:42px;margin-bottom:7px;pointer-events:none;animation:subtaskPlaceholderIn .16s ease-out}
.subtask-item.subtask-dragging{opacity:.55!important;transform:scale(.985);box-shadow:0 12px 26px rgba(33,103,243,.14);outline:1px dashed #a8c3ee;outline-offset:2px}
.subtask-item.subtask-drag-over{border-color:#a8c3ee!important;background:#f8fbff!important}
@keyframes subtaskPlaceholderIn{from{opacity:0;transform:scaleY(.75)}to{opacity:1;transform:scaleY(1)}}
@media(max-width:620px){.bubble{padding-bottom:30px!important}.bubble .message-reaction-tools{right:5px!important;bottom:5px!important}.subtask-drag-placeholder{min-height:40px}}

/* v68 — stable chat rows + correct subtask order/enter-to-send */
.messages{display:flex!important;flex-direction:column!important;align-items:stretch!important;min-width:0!important;overflow-x:hidden!important}
.bubble-row{width:100%!important;max-width:100%!important;min-width:0!important;flex:0 0 auto!important;display:flex!important;align-items:flex-end!important}
.bubble-row:not(.mine){justify-content:flex-start!important}
.bubble-row.mine{justify-content:flex-end!important}
.bubble-wrap{width:auto!important;max-width:78%!important;min-width:0!important;flex:0 1 auto!important}
.bubble-stack{width:auto!important;min-width:0!important;max-width:100%!important}
.bubble{max-width:100%!important;min-width:0!important;overflow-wrap:anywhere!important;word-break:break-word!important}
.message-body{max-width:100%!important;min-width:0!important;overflow-wrap:anywhere!important;word-break:break-word!important}
.message-body>div{max-width:100%!important;overflow-wrap:anywhere!important;word-break:break-word!important}
.subtask-add #subTitle{min-width:0!important}
@media(max-width:620px){.bubble-wrap{max-width:88%!important}.bubble{max-width:100%!important}}

/* v69 — stable chat geometry: rows stay full width and bubbles stay anchored */
.messages{display:flex!important;flex-direction:column!important;align-items:stretch!important;width:100%!important;min-width:0!important;overflow-x:hidden!important;gap:0!important}
.bubble-row{display:grid!important;width:100%!important;max-width:none!important;min-width:0!important;flex:0 0 auto!important;margin:0 0 12px!important;align-items:end!important;gap:8px!important}
.bubble-row:not(.mine){grid-template-columns:auto minmax(0,1fr)!important;justify-content:initial!important}
.bubble-row.mine{grid-template-columns:minmax(0,1fr)!important;justify-content:initial!important}
.bubble-row .avatar{grid-column:1!important;grid-row:1!important;align-self:end!important}
.bubble-row:not(.mine) .bubble-wrap{grid-column:2!important;grid-row:1!important;justify-self:start!important;align-self:end!important;width:auto!important;max-width:min(72%,680px)!important;min-width:0!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important}
.bubble-row.mine .bubble-wrap{grid-column:1!important;grid-row:1!important;justify-self:end!important;align-self:end!important;width:auto!important;max-width:min(72%,680px)!important;min-width:0!important;display:flex!important;flex-direction:column!important;align-items:flex-end!important}
.bubble-stack{width:auto!important;max-width:100%!important;min-width:0!important;display:flex!important;flex-direction:column!important;align-items:inherit!important}
.bubble{display:block!important;width:fit-content!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;overflow:visible!important;overflow-wrap:anywhere!important;word-break:break-word!important}
.message-body{display:block!important;max-width:100%!important;min-width:0!important;overflow-wrap:anywhere!important;word-break:break-word!important;white-space:pre-wrap!important}
.message-body>div{max-width:100%!important;overflow-wrap:anywhere!important;word-break:break-word!important;white-space:pre-wrap!important}
.bubble-time{white-space:nowrap!important}
.msg-actions{max-width:100%!important}

/* v69 — compact own-comment actions and inline editor */
.comment{position:relative!important}
.comment-actions{display:flex!important;align-items:center!important;gap:4px!important;margin-left:6px!important;opacity:0!important;visibility:hidden!important;transition:opacity .15s ease,visibility .15s ease!important}
.comment-own:hover .comment-actions,.comment-own:focus-within .comment-actions{opacity:1!important;visibility:visible!important}
.comment-action{width:25px!important;height:25px!important;border:1px solid var(--line)!important;background:#fff!important;border-radius:7px!important;display:grid!important;place-items:center!important;padding:0!important;color:#6b7b90!important;cursor:pointer!important}
.comment-action:hover{background:#eef5ff!important;color:var(--blue)!important}.comment-action.delete:hover{background:#fff0f2!important;color:var(--danger)!important}
.comment-action .ui-icon{width:12px!important;height:12px!important}
.comment-edit-input{margin-top:0!important;width:100%!important;min-height:72px!important;resize:vertical!important;font-size:11px!important;line-height:1.45!important}
.comment-edit-actions{display:flex!important;justify-content:flex-end!important;gap:6px!important;margin-top:6px!important}
.comment-edit-actions .btn{min-height:30px!important;padding:0 10px!important;font-size:9px!important}
@media(max-width:620px){.bubble-row:not(.mine) .bubble-wrap,.bubble-row.mine .bubble-wrap{max-width:86%!important}.comment-actions{opacity:1!important;visibility:visible!important}.comment-head{grid-template-columns:32px minmax(0,1fr) auto!important}.comment-actions{grid-column:3!important;grid-row:1!important}}

/* v70 — final chat geometry, compact comments, reliable subtask reorder */
/* Keep each message row as a simple flex line. This prevents inherited grid/flex
   rules from making messages drift diagonally across the conversation. */
.messages{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow-x:hidden!important;
}
.bubble-row{
  display:flex!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  flex:0 0 auto!important;
  align-items:flex-end!important;
  gap:8px!important;
  margin:0 0 12px!important;
  padding:0!important;
  position:relative!important;
}
.bubble-row:not(.mine){justify-content:flex-start!important}
.bubble-row.mine{justify-content:flex-end!important}
.bubble-row:not(.mine) .avatar{display:grid!important;flex:0 0 25px!important;width:25px!important;height:25px!important}
.bubble-row.mine .avatar{display:none!important}
.bubble-wrap,
.bubble-row:not(.mine) .bubble-wrap,
.bubble-row.mine .bubble-wrap{
  display:flex!important;
  flex:0 1 auto!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  width:auto!important;
  min-width:0!important;
  max-width:min(72%,680px)!important;
  overflow:visible!important;
}
.bubble-row.mine .bubble-wrap{align-items:flex-end!important}
.bubble-stack{display:flex!important;flex-direction:column!important;align-items:inherit!important;width:auto!important;max-width:100%!important;min-width:0!important}
.bubble{
  display:block!important;
  width:auto!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  overflow:visible!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
}
.message-body,.message-body>div{
  max-width:100%!important;
  min-width:0!important;
  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
}
.bubble-time{white-space:nowrap!important}
.msg-actions{max-width:100%!important}

/* Comments: author/time share one compact line; message sits immediately below name. */
.comment-head{display:flex!important;align-items:flex-start!important;gap:8px!important}
.comment-author-avatar{flex:0 0 auto!important}
.comment-author-meta{min-width:0!important;flex:1 1 auto!important}
.comment-author-row{display:flex!important;align-items:baseline!important;justify-content:space-between!important;gap:10px!important;min-width:0!important}
.comment-author-row b{font-size:10px!important;line-height:1.25!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.comment-author-row time{font-size:8px!important;color:#9aa5b5!important;white-space:nowrap!important;flex:0 0 auto!important}
.comment-author-meta .comment-body{margin:3px 0 0!important;font-size:10px!important;line-height:1.45!important;color:#68778c!important;overflow-wrap:anywhere!important;word-break:break-word!important}
.comment-actions{flex:0 0 auto!important;margin-left:4px!important}

@media(max-width:620px){
  .bubble-row:not(.mine) .bubble-wrap,.bubble-row.mine .bubble-wrap{max-width:88%!important}
  .comment-author-row{gap:6px!important}
  .comment-author-row b{font-size:9px!important}
  .comment-author-row time{font-size:7px!important}
  .comment-author-meta .comment-body{font-size:9px!important}
}


/* v71 — definitive chat bubble sizing and subtask controls */
.messages{display:flex!important;flex-direction:column!important;align-items:stretch!important;width:100%!important;min-width:0!important;overflow-x:hidden!important}
.bubble-row{display:flex!important;align-items:flex-end!important;width:100%!important;min-width:0!important;max-width:100%!important;margin:0 0 12px!important;padding:0!important;gap:8px!important}
.bubble-row:not(.mine){justify-content:flex-start!important}
.bubble-row.mine{justify-content:flex-end!important}
.bubble-row:not(.mine)>.avatar{flex:0 0 25px!important;width:25px!important;height:25px!important}
.bubble-wrap{position:relative!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;width:min(72%,680px)!important;max-width:min(72%,680px)!important;min-width:0!important;flex:0 0 min(72%,680px)!important}
.bubble-row.mine .bubble-wrap{align-items:flex-end!important}
.bubble-stack{display:flex!important;flex-direction:column!important;align-items:inherit!important;width:100%!important;max-width:100%!important;min-width:0!important}
.bubble{display:block!important;width:max-content!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;overflow:visible!important;white-space:normal!important;overflow-wrap:break-word!important;word-break:normal!important}
.message-body{display:block!important;width:auto!important;max-width:100%!important;min-width:0!important;white-space:pre-wrap!important;overflow-wrap:break-word!important;word-break:normal!important}
.message-body>div{display:block!important;width:auto!important;max-width:100%!important;white-space:pre-wrap!important;overflow-wrap:break-word!important;word-break:normal!important}
.msg-actions{max-width:100%!important}
@media(max-width:620px){.bubble-wrap,.bubble-row:not(.mine) .bubble-wrap,.bubble-row.mine .bubble-wrap{width:min(86%,680px)!important;max-width:min(86%,680px)!important;flex-basis:min(86%,680px)!important}.bubble-row:not(.mine)>.avatar{flex-basis:22px!important;width:22px!important;height:22px!important}}


/* v72 — definitive chat geometry: never allow flex shrink to collapse a message bubble */
#messages.messages{display:flex!important;flex-direction:column!important;align-items:stretch!important;width:100%!important;max-width:100%!important;min-width:0!important;overflow-x:hidden!important;overflow-y:auto!important;}
#messages .bubble-row{display:flex!important;align-items:flex-end!important;justify-content:flex-start!important;width:100%!important;max-width:100%!important;min-width:0!important;flex:0 0 auto!important;gap:8px!important;margin:0 0 12px!important;position:relative!important;}
#messages .bubble-row.mine{justify-content:flex-end!important;}
#messages .bubble-row:not(.mine)>.avatar{flex:0 0 25px!important;width:25px!important;height:25px!important;}
#messages .bubble-row>.bubble-wrap{position:relative!important;display:flex!important;flex:0 1 auto!important;flex-direction:column!important;align-items:flex-start!important;width:auto!important;max-width:calc(100% - 33px)!important;min-width:0!important;}
#messages .bubble-row.mine>.bubble-wrap{max-width:100%!important;align-items:flex-end!important;}
#messages .bubble-stack{display:flex!important;flex:0 1 auto!important;flex-direction:column!important;align-items:flex-start!important;width:auto!important;max-width:100%!important;min-width:0!important;}
#messages .bubble-row.mine .bubble-stack{align-items:flex-end!important;}
#messages .bubble{display:block!important;flex:0 1 auto!important;width:auto!important;max-width:min(680px,calc(100vw - 80px))!important;min-width:42px!important;box-sizing:border-box!important;overflow:visible!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important;}
#messages .message-body{display:block!important;width:auto!important;max-width:100%!important;min-width:0!important;white-space:pre-wrap!important;overflow-wrap:anywhere!important;word-break:normal!important;}
#messages .message-body>div{display:block!important;width:auto!important;max-width:100%!important;white-space:pre-wrap!important;overflow-wrap:anywhere!important;word-break:normal!important;}
#messages .msg-actions{max-width:100%!important;}
#messages .bubble-time{white-space:nowrap!important;max-width:100%!important;}
@media(max-width:620px){
  #messages .bubble-row:not(.mine)>.avatar{flex-basis:22px!important;width:22px!important;height:22px!important;}
  #messages .bubble-row>.bubble-wrap{max-width:calc(100% - 30px)!important;}
  #messages .bubble-row.mine>.bubble-wrap{max-width:94%!important;}
  #messages .bubble{max-width:calc(100vw - 58px)!important;}
}

/* v72 — comments: timestamp right, edit/delete buttons under the comment */
.task-comments-side .comment-head{display:flex!important;align-items:flex-start!important;gap:9px!important;width:100%!important;}
.task-comments-side .comment-author-meta{flex:1 1 auto!important;min-width:0!important;display:block!important;}
.task-comments-side .comment-author-row{display:flex!important;align-items:baseline!important;justify-content:space-between!important;gap:10px!important;width:100%!important;}
.task-comments-side .comment-author-row b{min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;font-size:11px!important;}
.task-comments-side .comment-author-row time{margin-left:auto!important;text-align:right!important;font-size:8px!important;white-space:nowrap!important;flex:0 0 auto!important;}
.task-comments-side .comment-author-meta .comment-body{margin:4px 0 0!important;font-size:10px!important;line-height:1.5!important;}
.task-comments-side .comment-actions{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:5px!important;margin:7px 0 0!important;opacity:0!important;visibility:hidden!important;}
.task-comments-side .comment-own:hover .comment-actions,.task-comments-side .comment-own:focus-within .comment-actions{opacity:1!important;visibility:visible!important;}
.task-comments-side .comment-action{width:27px!important;height:27px!important;}
@media(max-width:620px){.task-comments-side .comment-actions{opacity:1!important;visibility:visible!important;}.task-comments-side .comment-author-row time{font-size:7px!important;}}

/* v72 — drag reorder: animate the placeholder, not the hierarchy itself */
.subtask-drag-placeholder{box-sizing:border-box!important;width:100%!important;border:1.5px dashed #8fb2ef!important;border-radius:10px!important;background:#f5f9ff!important;min-height:42px!important;margin-bottom:7px!important;pointer-events:none!important;opacity:.9!important;}
.subtask-item.subtask-dragging{opacity:.38!important;box-shadow:0 14px 30px rgba(33,103,243,.13)!important;}
.subtask-item.subtask-drag-over{border-color:#9ebcf1!important;background:#f5f9ff!important;transform:none!important;box-shadow:0 5px 14px rgba(33,103,243,.07)!important;}


/* v74 — subtask controls/drag feedback + stable chat bubbles/reactions */
.subtask-move-group{display:inline-flex!important;align-items:center!important;gap:0!important;padding:2px!important;border:1px solid var(--line)!important;border-radius:9px!important;background:var(--surface-2,#f8fbff)!important}
.subtask-move-group .subtask-action{border:0!important;background:transparent!important}
.subtask-actions>.subtask-action{width:29px!important;height:29px!important}
.subtask-item{transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s ease,opacity .18s ease!important}
.subtask-item.subtask-dragging{opacity:.52!important;transform:scale(.985) translateY(-2px)!important;box-shadow:0 16px 32px rgba(33,103,243,.16)!important;outline:2px dashed #8eb2ff!important;outline-offset:2px!important}
.subtask-item.subtask-drag-over{background:#edf4ff!important;transform:translateY(-3px)!important;box-shadow:0 9px 20px rgba(33,103,243,.10)!important}
.subtask-drag-placeholder{box-sizing:border-box!important;width:100%!important;border:1.5px dashed #8eb2ff!important;border-radius:10px!important;background:linear-gradient(180deg,#f8fbff,#f1f6ff)!important;min-height:44px!important;margin:0 0 7px!important;pointer-events:none!important;animation:subtaskPlaceholderInV74 .18s ease-out!important}
@keyframes subtaskPlaceholderInV74{from{opacity:0;transform:scaleY(.72)}to{opacity:.95;transform:scaleY(1)}}

/* Chat: one predictable row model. Bubble width is content-sized but capped, so
   short messages stay compact and long messages wrap instead of collapsing. */
#messages.messages{display:flex!important;flex-direction:column!important;align-items:stretch!important;width:100%!important;min-width:0!important;overflow-x:hidden!important;overflow-y:auto!important;box-sizing:border-box!important}
#messages .bubble-row{display:flex!important;align-items:flex-end!important;width:100%!important;min-width:0!important;max-width:100%!important;flex:0 0 auto!important;gap:8px!important;margin:0 0 12px!important;padding:0!important;box-sizing:border-box!important;position:relative!important}
#messages .bubble-row:not(.mine){justify-content:flex-start!important}
#messages .bubble-row.mine{justify-content:flex-end!important}
#messages .bubble-row:not(.mine)>.avatar{display:grid!important;flex:0 0 25px!important;width:25px!important;height:25px!important;border-radius:50%!important;align-self:flex-end!important}
#messages .bubble-row.mine>.avatar{display:none!important}
#messages .bubble-row>.bubble-wrap{position:relative!important;display:flex!important;flex:0 1 auto!important;flex-direction:column!important;align-items:flex-start!important;width:auto!important;max-width:min(78%,680px)!important;min-width:0!important;box-sizing:border-box!important}
#messages .bubble-row.mine>.bubble-wrap{align-items:flex-end!important;max-width:min(78%,680px)!important}
#messages .bubble-stack{display:flex!important;flex:0 1 auto!important;flex-direction:column!important;align-items:inherit!important;width:fit-content!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important}
#messages .bubble{display:block!important;width:fit-content!important;max-width:100%!important;min-width:42px!important;box-sizing:border-box!important;white-space:normal!important;overflow:visible!important;overflow-wrap:anywhere!important;word-break:break-word!important;position:relative!important}
#messages .message-body{display:block!important;width:fit-content!important;max-width:100%!important;min-width:0!important;white-space:pre-wrap!important;overflow-wrap:anywhere!important;word-break:break-word!important}
#messages .message-body>div{display:block!important;width:fit-content!important;max-width:100%!important;min-width:0!important;white-space:pre-wrap!important;overflow-wrap:anywhere!important;word-break:break-word!important}
#messages .bubble-time{display:block!important;width:max-content!important;max-width:100%!important;white-space:nowrap!important}
#messages .msg-actions{max-width:100%!important}
#messages .bubble .message-reaction-tools{position:absolute!important;right:6px!important;bottom:5px!important;display:flex!important;width:26px!important;height:26px!important;margin:0!important;z-index:10!important}
#messages .bubble .message-react-btn{width:26px!important;height:26px!important;margin:0!important}
#messages .bubble .message-reaction-picker{position:absolute!important;right:0!important;bottom:32px!important;z-index:100!important;max-width:min(330px,calc(100vw - 36px))!important;flex-wrap:wrap!important}
#messages .bubble .message-reactions{max-width:100%!important;padding-right:34px!important;box-sizing:border-box!important}
@media(max-width:620px){#messages .bubble-row>.bubble-wrap,#messages .bubble-row.mine>.bubble-wrap{max-width:88%!important}#messages .bubble{max-width:100%!important}#messages .bubble .message-reaction-picker{max-width:calc(100vw - 28px)!important}}


/* v74 — comment actions: icon-only, right aligned directly under timestamp */
.task-comments-side .comment-author-meta{display:flex!important;flex-direction:column!important;align-items:stretch!important;min-width:0!important}
.task-comments-side .comment-actions{display:flex!important;justify-content:flex-end!important;align-items:center!important;gap:4px!important;width:100%!important;margin:3px 0 0!important;opacity:0!important;visibility:hidden!important;transition:opacity .15s ease,visibility .15s ease!important}
.task-comments-side .comment-own:hover .comment-actions,.task-comments-side .comment-own:focus-within .comment-actions{opacity:1!important;visibility:visible!important}
.task-comments-side .comment-action{width:25px!important;height:25px!important;padding:0!important;border:1px solid var(--line)!important;border-radius:7px!important;background:var(--surface)!important;display:grid!important;place-items:center!important;color:#6b7b90!important}
.task-comments-side .comment-action .ui-icon{width:12px!important;height:12px!important}
.task-comments-side .comment-action.edit:hover{background:#eef5ff!important;color:var(--blue)!important;border-color:#cbdcff!important}
.task-comments-side .comment-action.delete:hover{background:#fff0f2!important;color:var(--danger)!important;border-color:#ffd0d7!important}
.task-comments-side .comment-author-meta .comment-body{margin-top:5px!important}
@media(max-width:620px){.task-comments-side .comment-actions{opacity:1!important;visibility:visible!important}}


/* v75 — reliable subtask drag source + animated reordering + edit modal */
.subtask-drag-handle{cursor:grab!important;user-select:none!important;-webkit-user-select:none!important;touch-action:none!important;display:grid!important;place-items:center!important;flex:0 0 20px!important;position:relative!important;z-index:40!important}
.subtask-drag-handle:active,.subtask-drag-handle.dragging-handle{cursor:grabbing!important}
.subtask-item.subtask-dragging{opacity:.62!important;transform:scale(.985) translateY(-2px)!important;box-shadow:0 14px 30px rgba(33,103,243,.15)!important;transition:opacity .15s ease,box-shadow .15s ease,transform .15s ease!important}
.subtask-drag-placeholder{width:100%!important;box-sizing:border-box!important;min-height:42px!important;margin:0 0 7px!important;border:2px dashed #8eb2f0!important;border-radius:10px!important;background:linear-gradient(180deg,#f8fbff,#eef5ff)!important;pointer-events:none!important;animation:subtaskPlaceholderInV75 .18s ease-out!important}
@keyframes subtaskPlaceholderInV75{from{opacity:0;transform:scaleY(.72)}to{opacity:.95;transform:scaleY(1)}}
.subtask-item.subtask-drag-over{background:#f4f8ff!important;box-shadow:0 6px 16px rgba(33,103,243,.08)!important}
.subtask-edit-overlay{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(15,30,55,.28);backdrop-filter:blur(4px);animation:fade .15s ease-out}
.subtask-edit-modal{width:min(460px,calc(100vw - 32px));background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 28px 80px rgba(20,40,80,.24);overflow:hidden;animation:subtaskEditIn .2s cubic-bezier(.2,.8,.2,1)}
.subtask-edit-head{display:flex;align-items:center;justify-content:space-between;padding:18px 20px 14px;border-bottom:1px solid var(--line)}
.subtask-edit-head h3{margin:0;font-size:18px;letter-spacing:-.02em}.subtask-edit-close{width:34px;height:34px;border:1px solid var(--line);border-radius:10px;background:#fff;color:#7a8799;display:grid;place-items:center}.subtask-edit-close:hover{color:var(--danger);background:#fff4f5}
.subtask-edit-body{padding:18px 20px}.subtask-edit-body label{display:block;font-size:10px;font-weight:800;color:#66758b;margin-bottom:7px}.subtask-edit-body .form-control{width:100%;font-size:13px;min-height:44px}
.subtask-edit-footer{display:flex;justify-content:flex-end;gap:8px;padding:14px 20px;border-top:1px solid var(--line);background:#fbfcfe}.subtask-edit-save.is-loading{opacity:.65;pointer-events:none}.subtask-edit-save.is-loading:after{content:"";width:13px;height:13px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}.subtask-edit-save.is-loading svg{display:none}
@keyframes subtaskEditIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
@keyframes spin{to{transform:rotate(360deg)}}

/* v75 — comment body and own-message controls share the row directly below metadata */
.task-comments-side .comment-content-row{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:8px!important;width:100%!important;margin-top:4px!important;min-width:0!important}
.task-comments-side .comment-content-row .comment-body{flex:1 1 auto!important;min-width:0!important;margin:0!important}
.task-comments-side .comment-content-row .comment-actions{flex:0 0 auto!important;width:auto!important;margin:0!important;justify-content:flex-end!important;opacity:0!important;visibility:hidden!important}
.task-comments-side .comment-own:hover .comment-content-row .comment-actions,.task-comments-side .comment-own:focus-within .comment-content-row .comment-actions{opacity:1!important;visibility:visible!important}

/* v75 — stable chat bubble geometry. Give every bubble a real available width so text can wrap normally. */
#messages.messages{display:flex!important;flex-direction:column!important;align-items:stretch!important;width:100%!important;min-width:0!important;max-width:100%!important;overflow-x:hidden!important}
#messages .bubble-row{display:flex!important;align-items:flex-end!important;justify-content:flex-start!important;width:100%!important;max-width:100%!important;min-width:0!important;flex:0 0 auto!important;gap:8px!important;margin:0 0 12px!important;padding:0!important;box-sizing:border-box!important}
#messages .bubble-row.mine{justify-content:flex-end!important}
#messages .bubble-row:not(.mine)>.avatar{display:grid!important;flex:0 0 25px!important;width:25px!important;height:25px!important;border-radius:50%!important;align-self:flex-end!important}
#messages .bubble-row>.bubble-wrap,#messages .bubble-row.mine>.bubble-wrap{display:flex!important;flex:0 1 78%!important;width:78%!important;max-width:78%!important;min-width:0!important;flex-direction:column!important;align-items:flex-start!important;box-sizing:border-box!important}
#messages .bubble-row.mine>.bubble-wrap{align-items:flex-end!important}
#messages .bubble-stack{display:flex!important;flex-direction:column!important;align-items:flex-start!important;width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important}
#messages .bubble-row.mine .bubble-stack{align-items:flex-end!important}
#messages .bubble{display:block!important;width:fit-content!important;max-width:100%!important;min-width:42px!important;box-sizing:border-box!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important;overflow:visible!important;position:relative!important}
#messages .message-body{display:block!important;width:auto!important;max-width:100%!important;min-width:0!important;white-space:pre-wrap!important;overflow-wrap:anywhere!important;word-break:break-word!important}
#messages .message-body>div{display:block!important;width:auto!important;max-width:100%!important;min-width:0!important;white-space:pre-wrap!important;overflow-wrap:anywhere!important;word-break:break-word!important}
#messages .bubble-time{display:block!important;width:max-content!important;max-width:100%!important;white-space:nowrap!important}
#messages .bubble .message-reaction-tools{position:absolute!important;right:6px!important;bottom:5px!important;width:26px!important;height:26px!important;margin:0!important;z-index:20!important}
#messages .bubble .message-react-btn{width:26px!important;height:26px!important}
#messages .bubble .message-reaction-picker{position:absolute!important;right:0!important;bottom:34px!important;z-index:100!important;display:none!important;max-width:min(330px,calc(100vw - 28px))!important;flex-wrap:wrap!important}
#messages .bubble .message-reaction-picker.show{display:flex!important}
#messages .bubble .message-reactions{max-width:100%!important;box-sizing:border-box!important;padding-right:34px!important;overflow-wrap:anywhere!important}
@media(max-width:620px){#messages .bubble-row>.bubble-wrap,#messages .bubble-row.mine>.bubble-wrap{width:88%!important;max-width:88%!important}#messages .bubble{max-width:100%!important}.subtask-edit-modal{width:calc(100vw - 24px)}.task-comments-side .comment-content-row .comment-actions{opacity:1!important;visibility:visible!important}}

/* v77 — pointer-driven subtask drag: reliable on desktop/touch with smooth FLIP movement */
body.subtask-is-dragging{user-select:none!important;-webkit-user-select:none!important;cursor:grabbing!important}
.subtask-item[draggable="false"]{cursor:default!important}
.subtask-drag-handle{cursor:grab!important;touch-action:none!important;-webkit-user-drag:none!important}
.subtask-drag-handle.dragging-handle,.subtask-is-dragging .subtask-drag-handle{cursor:grabbing!important}
.subtask-item.subtask-dragging{opacity:.42!important;transform:scale(.985)!important;box-shadow:0 18px 38px rgba(33,103,243,.18)!important;outline:2px dashed #8eb2ff!important;outline-offset:3px!important;transition:opacity .16s ease,transform .16s ease,box-shadow .16s ease!important}
.subtask-drag-placeholder{width:100%!important;box-sizing:border-box!important;border:2px dashed #8eb2ff!important;border-radius:10px!important;background:linear-gradient(180deg,#f9fbff,#eef5ff)!important;margin:0 0 7px!important;pointer-events:none!important;animation:subtaskPlaceholderV76 .2s cubic-bezier(.2,.8,.2,1)!important}
@keyframes subtaskPlaceholderV76{from{opacity:0;transform:scaleY(.7)}to{opacity:.95;transform:scaleY(1)}}
.subtask-item.subtask-drag-over{background:#f4f8ff!important;box-shadow:0 8px 18px rgba(33,103,243,.10)!important}

/* v77 — definitive chat bubble layout */
#messages.messages{display:flex!important;flex-direction:column!important;align-items:stretch!important;width:100%!important;min-width:0!important;max-width:none!important;overflow-x:hidden!important;box-sizing:border-box!important}
#messages.messages .bubble-row{display:flex!important;flex-direction:row!important;align-items:flex-end!important;width:100%!important;min-width:0!important;max-width:none!important;box-sizing:border-box!important;gap:8px!important;margin:0 0 14px!important;padding:0!important;position:relative!important}
#messages.messages .bubble-row:not(.mine){justify-content:flex-start!important}
#messages.messages .bubble-row.mine{justify-content:flex-end!important}
#messages.messages .bubble-row:not(.mine)>.avatar{display:grid!important;flex:0 0 25px!important;width:25px!important;height:25px!important;margin:0!important;align-self:flex-end!important}
#messages.messages .bubble-row.mine>.avatar{display:none!important}
#messages.messages .bubble-row>.bubble-wrap{display:flex!important;flex:0 0 auto!important;width:auto!important;max-width:min(680px,78%)!important;min-width:0!important;flex-direction:column!important;align-items:flex-start!important;box-sizing:border-box!important;overflow:visible!important}
#messages.messages .bubble-row.mine>.bubble-wrap{align-items:flex-end!important}
#messages.messages .bubble-stack{display:flex!important;flex:0 0 auto!important;flex-direction:column!important;align-items:flex-start!important;width:auto!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important}
#messages.messages .bubble-row.mine .bubble-stack{align-items:flex-end!important}
#messages.messages .bubble{display:block!important;flex:0 0 auto!important;width:max-content!important;max-width:100%!important;min-width:42px!important;box-sizing:border-box!important;position:relative!important;white-space:normal!important;overflow:visible!important;overflow-wrap:break-word!important;word-break:normal!important}
#messages.messages .message-body{display:block!important;width:auto!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;white-space:pre-wrap!important;overflow-wrap:break-word!important;word-break:normal!important}
#messages.messages .message-body>div{display:block!important;width:auto!important;max-width:100%!important;min-width:0!important;white-space:pre-wrap!important;overflow-wrap:break-word!important;word-break:normal!important}
#messages.messages .msg-attachment{max-width:100%!important}
#messages.messages .bubble-time{display:block!important;width:max-content!important;max-width:100%!important;white-space:nowrap!important}
#messages.messages .message-reaction-tools{position:absolute!important;right:6px!important;bottom:5px!important;width:26px!important;height:26px!important;margin:0!important;z-index:30!important}
#messages.messages .message-reaction-picker{position:absolute!important;right:0!important;bottom:34px!important;z-index:200!important;max-width:min(330px,calc(100vw - 28px))!important}
@media(max-width:620px){#messages.messages .bubble-row>.bubble-wrap{max-width:88%!important}#messages.messages .bubble{max-width:100%!important}}
/* v77 — smoother subtask drag feedback */
.subtask-drag-handle{transition:transform .18s ease,opacity .18s ease}.subtask-item.subtask-dragging .subtask-drag-handle{transform:scale(1.08);opacity:.75}
.subtask-drag-placeholder{transition:height .22s cubic-bezier(.16,1,.3,1),margin .22s ease,opacity .18s ease;will-change:height,transform}
.subtask-item.subtask-drag-over{transition:background .18s ease,box-shadow .18s ease}

/* v78 — definitive chat bubble sizing fix
   The previous rules allowed the bubble container to shrink to the text's
   min-content width, which caused messages to render as narrow vertical
   columns. Give the message wrapper a definite responsive width, then let
   the actual bubble shrink-to-content inside that width. */
#messages.messages .bubble-row {
  display:flex!important;
  flex-direction:row!important;
  align-items:flex-end!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  flex:0 0 auto!important;
  gap:8px!important;
  margin:0 0 14px!important;
  padding:0!important;
  box-sizing:border-box!important;
}
#messages.messages .bubble-row:not(.mine){justify-content:flex-start!important}
#messages.messages .bubble-row.mine{justify-content:flex-end!important}
#messages.messages .bubble-row:not(.mine)>.avatar {
  display:grid!important;
  flex:0 0 25px!important;
  width:25px!important;
  height:25px!important;
  min-width:25px!important;
  margin:0!important;
  align-self:flex-end!important;
}
#messages.messages .bubble-row.mine>.avatar{display:none!important}

/* Definite width prevents intrinsic flex sizing from collapsing the bubble. */
#messages.messages .bubble-row>.bubble-wrap,
#messages.messages .bubble-row.mine>.bubble-wrap {
  position:relative!important;
  display:flex!important;
  flex:0 1 78%!important;
  width:78%!important;
  max-width:78%!important;
  min-width:0!important;
  flex-direction:column!important;
  box-sizing:border-box!important;
  overflow:visible!important;
}
#messages.messages .bubble-row:not(.mine)>.bubble-wrap{align-items:flex-start!important}
#messages.messages .bubble-row.mine>.bubble-wrap{align-items:flex-end!important}

#messages.messages .bubble-stack {
  display:flex!important;
  flex:0 1 auto!important;
  flex-direction:column!important;
  align-items:inherit!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}
#messages.messages .bubble {
  display:block!important;
  flex:0 1 auto!important;
  width:fit-content!important;
  max-width:100%!important;
  min-width:42px!important;
  box-sizing:border-box!important;
  position:relative!important;
  white-space:normal!important;
  overflow:visible!important;
  overflow-wrap:break-word!important;
  word-break:normal!important;
  hyphens:none!important;
}
#messages.messages .message-body {
  display:block!important;
  width:fit-content!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  white-space:pre-wrap!important;
  overflow-wrap:break-word!important;
  word-break:normal!important;
  hyphens:none!important;
}
#messages.messages .message-body>div {
  display:block!important;
  width:auto!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  white-space:pre-wrap!important;
  overflow-wrap:break-word!important;
  word-break:normal!important;
  hyphens:none!important;
}
#messages.messages .msg-attachment{max-width:100%!important}
#messages.messages .bubble-time {
  display:block!important;
  width:max-content!important;
  max-width:100%!important;
  white-space:nowrap!important;
}

@media(max-width:620px){
  #messages.messages .bubble-row>.bubble-wrap,
  #messages.messages .bubble-row.mine>.bubble-wrap {
    flex-basis:86%!important;
    width:86%!important;
    max-width:86%!important;
  }
  #messages.messages .bubble-row:not(.mine)>.avatar {
    flex-basis:22px!important;
    width:22px!important;
    min-width:22px!important;
    height:22px!important;
  }
  #messages.messages .bubble{max-width:100%!important}
}

/* v79 — clean chat layout: reactions removed; use a stable two-column message geometry.
   The message row owns the available width. The wrapper gets a definite width,
   while the bubble itself shrink-wraps short messages and wraps long messages. */
#messages.messages{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:100%!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  box-sizing:border-box!important;
}
#messages.messages .bubble-row{
  display:grid!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:0 0 14px!important;
  padding:0!important;
  box-sizing:border-box!important;
  align-items:end!important;
  column-gap:8px!important;
}
#messages.messages .bubble-row:not(.mine){
  grid-template-columns:25px minmax(0,1fr)!important;
}
#messages.messages .bubble-row.mine{
  grid-template-columns:minmax(0,1fr)!important;
}
#messages.messages .bubble-row:not(.mine)>.avatar{
  grid-column:1!important;
  grid-row:1!important;
  display:grid!important;
  width:25px!important;
  height:25px!important;
  min-width:25px!important;
  flex:none!important;
  align-self:end!important;
  margin:0!important;
}
#messages.messages .bubble-row.mine>.avatar{display:none!important}

/* Always give the conversation side a real layout width. */
#messages.messages .bubble-row:not(.mine)>.bubble-wrap,
#messages.messages .bubble-row.mine>.bubble-wrap{
  position:relative!important;
  display:flex!important;
  flex-direction:column!important;
  width:min(680px,78%)!important;
  max-width:min(680px,78%)!important;
  min-width:0!important;
  box-sizing:border-box!important;
  overflow:visible!important;
}
#messages.messages .bubble-row:not(.mine)>.bubble-wrap{
  grid-column:2!important;
  grid-row:1!important;
  justify-self:start!important;
  align-items:flex-start!important;
}
#messages.messages .bubble-row.mine>.bubble-wrap{
  grid-column:1!important;
  grid-row:1!important;
  justify-self:end!important;
  align-items:flex-end!important;
}

#messages.messages .bubble-stack{
  display:flex!important;
  flex-direction:column!important;
  align-items:inherit!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}

/* The bubble is shrink-to-content, but can never exceed the wrapper. */
#messages.messages .bubble{
  display:inline-block!important;
  width:auto!important;
  max-width:100%!important;
  min-width:0!important;
  flex:none!important;
  box-sizing:border-box!important;
  position:relative!important;
  white-space:normal!important;
  overflow:visible!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
  padding-bottom:12px!important;
}
#messages.messages .message-body{
  display:block!important;
  width:auto!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
}
#messages.messages .message-body>div{
  display:block!important;
  width:auto!important;
  max-width:100%!important;
  min-width:0!important;
  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
}
#messages.messages .msg-attachment{max-width:100%!important}
#messages.messages .bubble-time{
  display:block!important;
  width:max-content!important;
  max-width:100%!important;
  white-space:nowrap!important;
  margin-top:5px!important;
}

/* Message actions stay outside the bubble and do not affect its text width. */
#messages.messages .msg-actions{
  display:flex!important;
  align-items:center!important;
  gap:4px!important;
  max-width:100%!important;
  min-width:0!important;
  margin-bottom:4px!important;
}
#messages.messages .message-reaction-tools,
#messages.messages .message-reactions,
#messages.messages .message-reaction-picker,
#messages.messages .message-react-btn,
#messages.messages .message-reaction{
  display:none!important;
}

@media(max-width:620px){
  #messages.messages .bubble-row:not(.mine){grid-template-columns:22px minmax(0,1fr)!important}
  #messages.messages .bubble-row:not(.mine)>.avatar{
    width:22px!important;
    height:22px!important;
    min-width:22px!important;
  }
  #messages.messages .bubble-row:not(.mine)>.bubble-wrap,
  #messages.messages .bubble-row.mine>.bubble-wrap{
    width:86%!important;
    max-width:86%!important;
  }
}
/* v79 final cleanup — reaction controls are disabled and their legacy spacing is removed. */
#messages.messages .bubble{padding-bottom:10px!important}
#messages.messages .message-reaction-tools,
#messages.messages .message-reactions,
#messages.messages .message-reaction-picker{display:none!important}


/* v81 — FINAL CHAT LAYOUT RESET
   This block intentionally overrides every older chat rule above it.
   The message row is full width. The message column has a definite width,
   preventing the browser from resolving the bubble against the avatar's width. */
#messages.messages.chat-messages-final{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  padding:18px 20px!important;
  gap:0!important;
}
#messages.messages.chat-messages-final .bubble-row{
  display:flex!important;
  flex-direction:row!important;
  align-items:flex-end!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  flex:0 0 auto!important;
  gap:8px!important;
  margin:0 0 14px!important;
  padding:0!important;
  box-sizing:border-box!important;
}
#messages.messages.chat-messages-final .bubble-row:not(.mine){justify-content:flex-start!important}
#messages.messages.chat-messages-final .bubble-row.mine{justify-content:flex-end!important}
#messages.messages.chat-messages-final .bubble-row:not(.mine)>.avatar{
  display:grid!important;
  flex:0 0 25px!important;
  width:25px!important;
  min-width:25px!important;
  max-width:25px!important;
  height:25px!important;
  align-self:flex-end!important;
  margin:0!important;
}
#messages.messages.chat-messages-final .bubble-row.mine>.avatar{display:none!important}
#messages.messages.chat-messages-final .bubble-row:not(.mine)>.bubble-wrap{
  display:flex!important;
  flex:0 1 auto!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  width:min(680px,calc(78% - 33px))!important;
  max-width:min(680px,calc(78% - 33px))!important;
  min-width:42px!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
}
#messages.messages.chat-messages-final .bubble-row.mine>.bubble-wrap{
  display:flex!important;
  flex:0 1 auto!important;
  flex-direction:column!important;
  align-items:flex-end!important;
  width:min(680px,78%)!important;
  max-width:min(680px,78%)!important;
  min-width:42px!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
}
#messages.messages.chat-messages-final .bubble-stack{
  display:flex!important;
  flex-direction:column!important;
  align-items:inherit!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
}
#messages.messages.chat-messages-final .bubble{
  display:block!important;
  width:fit-content!important;
  max-width:100%!important;
  min-width:42px!important;
  flex:0 0 auto!important;
  margin:0!important;
  box-sizing:border-box!important;
  white-space:normal!important;
  overflow:visible!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  padding-bottom:10px!important;
}
#messages.messages.chat-messages-final .message-body{
  display:block!important;
  width:fit-content!important;
  max-width:100%!important;
  min-width:0!important;
  margin:0!important;
  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  box-sizing:border-box!important;
}
#messages.messages.chat-messages-final .message-body>div{
  display:block!important;
  width:auto!important;
  max-width:100%!important;
  min-width:0!important;
  margin:0!important;
  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  box-sizing:border-box!important;
}
#messages.messages.chat-messages-final .bubble-time{
  display:block!important;
  width:max-content!important;
  max-width:100%!important;
  margin:5px 3px 0!important;
  padding:0!important;
  white-space:nowrap!important;
}
#messages.messages.chat-messages-final .msg-actions{
  display:flex!important;
  align-items:center!important;
  gap:4px!important;
  width:auto!important;
  max-width:100%!important;
  margin:0 0 4px!important;
  padding:0!important;
}
#messages.messages.chat-messages-final .message-reaction-tools,
#messages.messages.chat-messages-final .message-reactions,
#messages.messages.chat-messages-final .message-reaction-picker,
#messages.messages.chat-messages-final .message-react-btn,
#messages.messages.chat-messages-final .message-reaction{display:none!important}
@media(max-width:620px){
  #messages.messages.chat-messages-final{padding:12px!important}
  #messages.messages.chat-messages-final .bubble-row:not(.mine)>.bubble-wrap{
    width:calc(100% - 33px)!important;
    max-width:calc(100% - 33px)!important;
  }
  #messages.messages.chat-messages-final .bubble-row.mine>.bubble-wrap{
    width:88%!important;
    max-width:88%!important;
  }
}

/* v81 — restore the proven v65 chat bubble geometry on the latest build.
   IMPORTANT: this is intentionally simple. Do not use grid, fit-content,
   intrinsic flex sizing, or JS-set widths for message bubbles. */
#messages.messages{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  box-sizing:border-box!important;
}
#messages.messages .bubble-row{
  display:flex!important;
  align-items:flex-end!important;
  justify-content:flex-start!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  flex:0 0 auto!important;
  gap:8px!important;
  margin:0 0 12px!important;
  padding:0!important;
  box-sizing:border-box!important;
  position:relative!important;
}
#messages.messages .bubble-row.mine{justify-content:flex-end!important}
#messages.messages .bubble-row:not(.mine)>.avatar{
  display:grid!important;
  flex:0 0 25px!important;
  width:25px!important;
  min-width:25px!important;
  max-width:25px!important;
  height:25px!important;
  align-self:flex-end!important;
  margin:0!important;
}
#messages.messages .bubble-row.mine>.avatar{display:none!important}
#messages.messages .bubble-row>.bubble-wrap{
  position:relative!important;
  display:flex!important;
  flex:0 1 auto!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  width:auto!important;
  min-width:0!important;
  max-width:78%!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
#messages.messages .bubble-row.mine>.bubble-wrap{align-items:flex-end!important}
#messages.messages .bubble-stack{
  display:flex!important;
  flex-direction:column!important;
  align-items:inherit!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
#messages.messages .bubble{
  display:block!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  flex:0 1 auto!important;
  box-sizing:border-box!important;
  position:relative!important;
  white-space:normal!important;
  overflow:visible!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
  padding-bottom:10px!important;
}
#messages.messages .message-body{
  display:block!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
}
#messages.messages .message-body>div{
  display:block!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
}
#messages.messages .bubble-time{
  display:block!important;
  width:max-content!important;
  max-width:100%!important;
  white-space:nowrap!important;
  margin-top:5px!important;
}
#messages.messages .msg-actions{
  position:absolute!important;
  right:0!important;
  top:-30px!important;
  display:flex!important;
  align-items:center!important;
  gap:4px!important;
  max-width:100%!important;
  z-index:10!important;
}
/* Reactions are disabled for now — no layout space reserved for them. */
#messages.messages .message-reaction-tools,
#messages.messages .message-reactions,
#messages.messages .message-reaction-picker,
#messages.messages .message-react-btn,
#messages.messages .message-reaction{display:none!important}
@media(max-width:620px){
  #messages.messages .bubble-row:not(.mine)>.avatar{
    flex-basis:22px!important;width:22px!important;min-width:22px!important;height:22px!important;
  }
  #messages.messages .bubble-row>.bubble-wrap{max-width:88%!important}
  #messages.messages .bubble-row.mine>.bubble-wrap{max-width:88%!important}
  #messages.messages .bubble{max-width:100%!important}
}


/* v82 — CHAT LAYOUT ROOT FIX */
#messages.messages{display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;width:100%!important;max-width:100%!important;min-width:0!important;overflow-x:hidden!important;overflow-y:auto!important;box-sizing:border-box!important}
#messages.messages .bubble-row{display:grid!important;grid-template-columns:25px minmax(0,1fr)!important;align-items:end!important;width:100%!important;max-width:100%!important;min-width:0!important;flex:none!important;margin:0 0 14px!important;padding:0!important;gap:8px!important;box-sizing:border-box!important;position:relative!important}
#messages.messages .bubble-row:not(.mine){justify-content:start!important}
#messages.messages .bubble-row.mine{grid-template-columns:minmax(0,78%)!important;justify-content:end!important}
#messages.messages .bubble-row:not(.mine)>.avatar{grid-column:1!important;grid-row:1!important;display:grid!important;width:25px!important;min-width:25px!important;max-width:25px!important;height:25px!important;min-height:25px!important;max-height:25px!important;flex:none!important;align-self:end!important;margin:0!important}
#messages.messages .bubble-row.mine>.avatar{display:none!important}
#messages.messages .bubble-row>.bubble-wrap,#messages.messages .bubble-row.mine>.bubble-wrap{grid-column:2!important;grid-row:1!important;position:relative!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-self:start!important;align-self:end!important;width:100%!important;max-width:680px!important;min-width:0!important;flex:none!important;margin:0!important;padding:0!important;box-sizing:border-box!important;overflow:visible!important}
#messages.messages .bubble-row.mine>.bubble-wrap{grid-column:1!important;justify-self:end!important;align-items:flex-end!important}
#messages.messages .bubble-stack{display:flex!important;flex-direction:column!important;align-items:flex-start!important;width:100%!important;max-width:100%!important;min-width:0!important;flex:none!important;margin:0!important;padding:0!important;box-sizing:border-box!important}
#messages.messages .bubble-row.mine .bubble-stack{align-items:flex-end!important}
#messages.messages .bubble{display:block!important;width:max-content!important;max-width:100%!important;min-width:42px!important;flex:none!important;box-sizing:border-box!important;margin:0!important;white-space:normal!important;overflow:visible!important;overflow-wrap:anywhere!important;word-break:normal!important;hyphens:none!important}
#messages.messages .message-body{display:block!important;width:max-content!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;white-space:pre-wrap!important;overflow-wrap:anywhere!important;word-break:normal!important;hyphens:none!important}
#messages.messages .message-body>div{display:block!important;width:auto!important;max-width:100%!important;min-width:0!important;white-space:pre-wrap!important;overflow-wrap:anywhere!important;word-break:normal!important;hyphens:none!important}
#messages.messages .bubble-time{display:block!important;width:max-content!important;max-width:100%!important;min-width:0!important;margin:5px 3px 0!important;padding:0!important;white-space:nowrap!important;box-sizing:border-box!important}
#messages.messages .msg-actions{position:absolute!important;right:0!important;top:-30px!important;display:flex!important;align-items:center!important;gap:4px!important;width:auto!important;max-width:100%!important;min-width:0!important;margin:0!important;padding:0!important;z-index:20!important}
#messages.messages .message-reaction-tools,#messages.messages .message-reactions,#messages.messages .message-reaction-picker,#messages.messages .message-react-btn,#messages.messages .message-reaction{display:none!important}
@media(max-width:900px){#messages.messages .bubble-row.mine{grid-template-columns:minmax(0,88%)!important}#messages.messages .bubble-row:not(.mine)>.bubble-wrap{max-width:100%!important}}
@media(max-width:620px){#messages.messages{padding:12px!important}#messages.messages .bubble-row:not(.mine){grid-template-columns:22px minmax(0,1fr)!important}#messages.messages .bubble-row:not(.mine)>.avatar{width:22px!important;min-width:22px!important;height:22px!important;min-height:22px!important}#messages.messages .bubble-row.mine{grid-template-columns:minmax(0,88%)!important}#messages.messages .bubble{max-width:100%!important}}


/* v83 — restore stable chat bubble sizing from the earlier working implementation.
   The bubble itself uses shrink-to-fit sizing instead of flex/grid intrinsic sizing.
   This prevents incoming bubbles from collapsing to a one-character column. */
#messages.messages{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  box-sizing:border-box!important;
}
#messages.messages .bubble-row{
  display:flex!important;
  flex:0 0 auto!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  align-items:flex-end!important;
  gap:8px!important;
  margin:0 0 12px!important;
  padding:0!important;
  box-sizing:border-box!important;
  position:relative!important;
}
#messages.messages .bubble-row:not(.mine){justify-content:flex-start!important}
#messages.messages .bubble-row.mine{justify-content:flex-end!important}
#messages.messages .bubble-row:not(.mine)>.avatar{
  display:grid!important;
  flex:0 0 25px!important;
  width:25px!important;
  height:25px!important;
  min-width:25px!important;
  min-height:25px!important;
  align-self:flex-end!important;
}
#messages.messages .bubble-row.mine>.avatar{display:none!important}
#messages.messages .bubble-row>.bubble-wrap{
  position:relative!important;
  display:block!important;
  flex:0 1 auto!important;
  width:auto!important;
  min-width:0!important;
  max-width:calc(100% - 33px)!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
#messages.messages .bubble-row.mine>.bubble-wrap{
  max-width:78%!important;
}
#messages.messages .bubble-stack{
  display:block!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
#messages.messages .bubble{
  display:table!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
  position:relative!important;
  overflow:visible!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
}
#messages.messages .message-body{
  display:block!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  box-sizing:border-box!important;
}
#messages.messages .message-body>div{
  display:block!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
}
#messages.messages .bubble-time{
  display:block!important;
  width:max-content!important;
  max-width:100%!important;
  white-space:nowrap!important;
  margin-top:5px!important;
}
/* Reactions are disabled for now — no UI or reserved bubble space. */
#messages.messages .message-reaction-tools,
#messages.messages .message-reactions,
#messages.messages .message-reaction-picker,
#messages.messages .message-react-btn,
#messages.messages .message-reaction{display:none!important}
@media(max-width:620px){
  #messages.messages .bubble-row:not(.mine)>.avatar{
    flex-basis:22px!important;width:22px!important;height:22px!important;min-width:22px!important;min-height:22px!important;
  }
  #messages.messages .bubble-row>.bubble-wrap{max-width:calc(100% - 30px)!important}
  #messages.messages .bubble-row.mine>.bubble-wrap{max-width:92%!important}
  #messages.messages .bubble{max-width:100%!important}
}


/* v84 — restore reactions without touching the proven v83 bubble geometry.
   Reactions are overlays anchored to the bubble's bottom-right edge. */
#messages.messages .bubble{position:relative!important;overflow:visible!important}
#messages.messages .message-reactions{
  position:absolute!important;
  right:8px!important;
  bottom:-10px!important;
  z-index:25!important;
  display:flex!important;
  align-items:center!important;
  gap:3px!important;
  margin:0!important;
  padding:2px!important;
  width:max-content!important;
  max-width:calc(100% - 12px)!important;
  min-height:0!important;
  border:1px solid var(--line)!important;
  border-radius:999px!important;
  background:var(--surface)!important;
  box-shadow:0 3px 10px rgba(12,28,58,.10)!important;
  box-sizing:border-box!important;
  flex-wrap:nowrap!important;
  overflow:hidden!important;
}
#messages.messages .message-reaction{
  width:auto!important;
  min-width:24px!important;
  height:22px!important;
  min-height:22px!important;
  padding:0 5px!important;
  border:0!important;
  border-radius:999px!important;
  background:transparent!important;
  color:var(--ink)!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:3px!important;
  font-size:13px!important;
  line-height:1!important;
  cursor:pointer!important;
  white-space:nowrap!important;
}
#messages.messages .message-reaction:hover{background:var(--surface-2)!important;transform:none!important}
#messages.messages .message-reaction.selected{background:#edf4ff!important;color:var(--blue)!important}
#messages.messages .message-reaction span{font-size:14px!important;line-height:1!important}
#messages.messages .message-reaction b{font-size:10px!important;font-weight:800!important;line-height:1!important}
#messages.messages .message-reaction-tools{
  position:absolute!important;
  right:-34px!important;
  bottom:-11px!important;
  width:28px!important;
  height:28px!important;
  margin:0!important;
  z-index:30!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
#messages.messages .message-react-btn{
  width:26px!important;
  height:26px!important;
  min-width:26px!important;
  padding:0!important;
  border:1px solid var(--line)!important;
  border-radius:999px!important;
  background:var(--surface)!important;
  color:var(--muted)!important;
  display:grid!important;
  place-items:center!important;
  opacity:0!important;
  transform:scale(.9)!important;
  transition:opacity .15s ease,transform .15s ease,background .15s ease!important;
  cursor:pointer!important;
  box-shadow:0 3px 10px rgba(12,28,58,.10)!important;
}
#messages.messages .bubble:hover .message-react-btn,
#messages.messages .message-react-btn:focus-visible{opacity:1!important;transform:scale(1)!important}
#messages.messages .message-react-btn:hover{background:var(--surface-2)!important;color:var(--blue)!important}
#messages.messages .message-reaction-picker{
  position:absolute!important;
  right:-2px!important;
  bottom:32px!important;
  display:none!important;
  align-items:center!important;
  gap:3px!important;
  padding:5px!important;
  max-width:min(310px,calc(100vw - 30px))!important;
  flex-wrap:wrap!important;
  background:var(--surface)!important;
  border:1px solid var(--line)!important;
  border-radius:12px!important;
  box-shadow:0 12px 30px rgba(12,28,58,.16)!important;
  z-index:100!important;
}
#messages.messages .message-reaction-picker.show{display:flex!important}
#messages.messages .message-reaction-picker button{
  width:30px!important;height:30px!important;padding:0!important;border:0!important;border-radius:8px!important;
  background:transparent!important;display:grid!important;place-items:center!important;font-size:17px!important;cursor:pointer!important;
}
#messages.messages .message-reaction-picker button:hover{background:var(--surface-2)!important;transform:scale(1.08)!important}
#messages.messages .message-reactions.reaction-updated{animation:reactionPop84 .22s ease-out}
@keyframes reactionPop84{0%{transform:scale(.9);opacity:.65}60%{transform:scale(1.08)}100%{transform:scale(1);opacity:1}}
/* Never let the reaction overlay participate in bubble sizing. */
#messages.messages .message-body{padding-bottom:0!important}
@media(max-width:620px){
  #messages.messages .message-reactions{right:5px!important;bottom:-9px!important}
  #messages.messages .message-reaction-tools{right:-31px!important;bottom:-10px!important}
  #messages.messages .message-react-btn{opacity:1!important;transform:scale(1)!important}
}


/* v86 — reaction overflow + typography refinement.
   Keep the proven v83/v84 bubble geometry. Reactions are overlays and never
   participate in bubble sizing. Sender reactions are left; receiver reactions
   are right. Multiple reactions wrap inside a wider pill instead of overflowing. */
#messages.messages .bubble-row .bubble{
  font-size:14px!important;
  line-height:1.5!important;
}
#messages.messages .bubble-row .message-body,
#messages.messages .bubble-row .message-body>div{
  font-size:14px!important;
  line-height:1.5!important;
}
#messages.messages .bubble-row:has(.message-reactions){
  margin-bottom:28px!important;
}
#messages.messages .bubble-row .message-reactions{
  position:absolute!important;
  right:8px!important;
  left:auto!important;
  bottom:-11px!important;
  z-index:25!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  flex-wrap:wrap!important;
  gap:2px!important;
  margin:0!important;
  padding:2px!important;
  width:max-content!important;
  min-width:0!important;
  max-width:min(340px,calc(100vw - 48px))!important;
  min-height:24px!important;
  border:1px solid var(--line)!important;
  border-radius:999px!important;
  background:var(--surface)!important;
  box-shadow:0 3px 10px rgba(12,28,58,.10)!important;
  box-sizing:border-box!important;
  overflow:visible!important;
}
#messages.messages .bubble-row.mine .message-reactions{
  left:8px!important;
  right:auto!important;
}
#messages.messages .bubble-row .message-reaction{
  width:auto!important;
  min-width:24px!important;
  height:22px!important;
  min-height:22px!important;
  padding:0 5px!important;
  border:0!important;
  border-radius:999px!important;
  background:transparent!important;
  color:var(--ink)!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:3px!important;
  font-size:13px!important;
  line-height:1!important;
  cursor:pointer!important;
  white-space:nowrap!important;
  flex:0 0 auto!important;
}
#messages.messages .message-reaction span{font-size:14px!important;line-height:1!important}
#messages.messages .message-reaction b{font-size:10px!important;font-weight:800!important;line-height:1!important}
#messages.messages .bubble-row .message-reaction-tools{
  right:-34px!important;
  left:auto!important;
  bottom:-12px!important;
}
#messages.messages .bubble-row.mine .message-reaction-tools{
  left:-34px!important;
  right:auto!important;
}
#messages.messages .message-reactions.reaction-updated{animation:reactionPop86 .22s ease-out}
@keyframes reactionPop86{0%{transform:scale(.9);opacity:.65}60%{transform:scale(1.08)}100%{transform:scale(1);opacity:1}}
@media(max-width:620px){
  #messages.messages .bubble-row .message-reactions{
    right:5px!important;
    left:auto!important;
    bottom:-10px!important;
    max-width:calc(100vw - 34px)!important;
  }
  #messages.messages .bubble-row.mine .message-reactions{left:5px!important;right:auto!important}
  #messages.messages .bubble-row .message-reaction-tools{right:-31px!important;left:auto!important;bottom:-11px!important}
  #messages.messages .bubble-row.mine .message-reaction-tools{left:-31px!important;right:auto!important}
}


/* v87 — Discord-style chat message header + reaction row.
   Reactions are normal-flow elements below the bubble, never overlays. */
#messages.messages .bubble-row{position:relative!important;align-items:flex-end!important;margin-bottom:18px!important}
#messages.messages .bubble-row>.bubble-wrap{position:relative!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;min-width:0!important;width:auto!important;max-width:calc(100% - 33px)!important;overflow:visible!important}
#messages.messages .bubble-row.mine>.bubble-wrap{align-items:flex-end!important;max-width:78%!important}
#messages.messages .message-meta{display:flex!important;align-items:baseline!important;gap:7px!important;width:100%!important;min-width:0!important;margin:0 0 4px!important;padding:0 3px!important;box-sizing:border-box!important;line-height:1.2!important;white-space:nowrap!important}
#messages.messages .message-meta strong{display:block!important;min-width:0!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;font-size:12px!important;font-weight:700!important;color:var(--ink)!important}
#messages.messages .message-meta time{display:block!important;flex:0 0 auto!important;font-size:10px!important;color:var(--muted)!important;opacity:.72!important}
#messages.messages .bubble-row.mine .message-meta{justify-content:flex-end!important;text-align:right!important}
#messages.messages .bubble-stack{display:flex!important;flex-direction:column!important;align-items:flex-start!important;width:auto!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important}
#messages.messages .bubble-row.mine .bubble-stack{align-items:flex-end!important}
#messages.messages .bubble{display:table!important;width:auto!important;min-width:0!important;max-width:100%!important;position:relative!important;box-sizing:border-box!important;overflow:visible!important}
#messages.messages .message-body,#messages.messages .message-body>div{font-size:14px!important;line-height:1.5!important}
#messages.messages .message-reaction-row{position:relative!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;flex-wrap:wrap!important;gap:4px!important;width:100%!important;max-width:100%!important;min-width:0!important;margin-top:5px!important;padding:0!important;box-sizing:border-box!important;overflow:visible!important}
#messages.messages .bubble-row.mine .message-reaction-row{justify-content:flex-end!important}
#messages.messages .message-reactions{position:static!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;flex-wrap:wrap!important;gap:4px!important;width:auto!important;max-width:100%!important;min-width:0!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;overflow:visible!important;box-sizing:border-box!important}
#messages.messages .message-reaction{flex:0 0 auto!important;width:auto!important;min-width:32px!important;height:25px!important;min-height:25px!important;max-width:100%!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:4px!important;padding:2px 8px!important;border:1px solid var(--line)!important;border-radius:7px!important;background:var(--surface-2)!important;color:var(--ink)!important;box-sizing:border-box!important;font-size:13px!important;line-height:1!important;white-space:nowrap!important;cursor:pointer!important}
#messages.messages .message-reaction span{font-size:15px!important;line-height:1!important}
#messages.messages .message-reaction b{font-size:10px!important;font-weight:700!important;line-height:1!important}
#messages.messages .message-reaction:hover{transform:none!important;border-color:#bcd0f1!important;background:var(--surface)!important}
#messages.messages .message-reaction.selected{background:#edf4ff!important;border-color:#a9c6ff!important;color:var(--blue)!important}
#messages.messages .message-reaction-tools{position:relative!important;flex:0 0 auto!important;display:flex!important;align-items:center!important;width:26px!important;min-width:26px!important;height:25px!important;margin:0!important;padding:0!important;box-sizing:border-box!important;overflow:visible!important}
#messages.messages .message-react-btn{width:26px!important;height:25px!important;min-width:26px!important;padding:0!important;margin:0!important;opacity:0!important;transform:none!important;border:1px solid var(--line)!important;border-radius:7px!important;background:var(--surface)!important;display:grid!important;place-items:center!important;font-size:14px!important;cursor:pointer!important}
#messages.messages .message-reaction-row:hover .message-react-btn,#messages.messages .message-react-btn:focus-visible{opacity:1!important}
#messages.messages .message-reaction-picker{position:absolute!important;left:0!important;right:auto!important;bottom:31px!important;display:flex!important;flex-wrap:wrap!important;gap:3px!important;width:max-content!important;max-width:min(300px,calc(100vw - 32px))!important;padding:6px!important;margin:0!important;border:1px solid var(--line)!important;border-radius:10px!important;background:var(--surface)!important;box-shadow:0 12px 28px rgba(12,28,58,.16)!important;z-index:100!important;box-sizing:border-box!important}
#messages.messages .message-reaction-picker button{flex:0 0 29px!important;width:29px!important;height:29px!important;padding:0!important;border:0!important;border-radius:7px!important;background:transparent!important;display:grid!important;place-items:center!important;font-size:17px!important;cursor:pointer!important}
#messages.messages .message-reaction-picker button:hover{background:var(--surface-2)!important;transform:scale(1.08)!important}
#messages.messages .bubble-row.mine .message-reaction-picker{left:auto!important;right:0!important}
@media(max-width:620px){#messages.messages .bubble-row>.bubble-wrap{max-width:calc(100% - 30px)!important}#messages.messages .bubble-row.mine>.bubble-wrap{max-width:92%!important}#messages.messages .message-meta strong{font-size:11px!important}#messages.messages .message-meta time{font-size:9px!important}#messages.messages .message-reaction{min-width:30px!important;height:24px!important;min-height:24px!important;padding:2px 7px!important}}

/* v88 — Facebook Messenger-style reactions.
   Keep the v83/v84 bubble geometry. No sender name is rendered in the message.
   Reactions attach to the lower corner of the bubble without becoming part of
   the bubble's width/height calculation. */
#messages.messages .bubble-row{margin-bottom:22px!important}
#messages.messages .bubble-row>.bubble-wrap{overflow:visible!important}
#messages.messages .bubble-stack{position:relative!important;overflow:visible!important}
#messages.messages .bubble-stack.has-reactions{padding-bottom:8px!important}
#messages.messages .message-reaction-row{
  position:absolute!important;
  top:auto!important;
  bottom:-5px!important;
  width:auto!important;
  max-width:min(420px,calc(100vw - 70px))!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  align-items:flex-end!important;
  flex-wrap:nowrap!important;
  gap:0!important;
  z-index:20!important;
  pointer-events:none!important;
}
#messages.messages .bubble-row:not(.mine) .message-reaction-row{
  right:0!important;
  left:auto!important;
  justify-content:flex-end!important;
}
#messages.messages .bubble-row.mine .message-reaction-row{
  left:0!important;
  right:auto!important;
  justify-content:flex-start!important;
}
#messages.messages .message-reactions{
  pointer-events:auto!important;
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:1px!important;
  width:max-content!important;
  max-width:min(420px,calc(100vw - 70px))!important;
  min-width:0!important;
  padding:2px 4px!important;
  margin:0!important;
  border:1px solid #dbe3ef!important;
  border-radius:999px!important;
  background:#fff!important;
  box-shadow:0 2px 7px rgba(20,38,70,.14)!important;
  box-sizing:border-box!important;
  overflow:visible!important;
}
#messages.messages .message-reaction{
  width:auto!important;
  min-width:27px!important;
  height:21px!important;
  min-height:21px!important;
  padding:0 4px!important;
  border:0!important;
  border-radius:999px!important;
  background:transparent!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
  font-size:12px!important;
  line-height:1!important;
  white-space:nowrap!important;
  flex:0 0 auto!important;
}
#messages.messages .message-reaction span{font-size:14px!important}
#messages.messages .message-reaction b{font-size:10px!important;font-weight:700!important}
#messages.messages .message-reaction:hover{background:#f1f4f8!important;transform:none!important}
#messages.messages .message-reaction.selected{background:#edf4ff!important;color:var(--blue)!important}
#messages.messages .message-reaction-tools{
  position:absolute!important;
  pointer-events:auto!important;
  width:28px!important;
  min-width:28px!important;
  height:24px!important;
  bottom:29px!important;
  z-index:40!important;
}
#messages.messages .bubble-row:not(.mine) .message-reaction-tools{right:0!important;left:auto!important}
#messages.messages .bubble-row.mine .message-reaction-tools{left:0!important;right:auto!important}
#messages.messages .message-react-btn{opacity:0!important;width:28px!important;height:24px!important}
#messages.messages .message-reaction-row:hover .message-react-btn,
#messages.messages .message-react-btn:focus-visible{opacity:1!important}
#messages.messages .message-reaction-picker{
  position:absolute!important;
  bottom:29px!important;
  width:max-content!important;
  max-width:min(300px,calc(100vw - 32px))!important;
  padding:6px!important;
  display:none!important;
  flex-wrap:wrap!important;
  gap:3px!important;
  border:1px solid var(--line)!important;
  border-radius:10px!important;
  background:var(--surface)!important;
  box-shadow:0 12px 28px rgba(12,28,58,.16)!important;
  z-index:100!important;
  box-sizing:border-box!important;
}
#messages.messages .message-reaction-picker.show{display:flex!important}
#messages.messages .bubble-row:not(.mine) .message-reaction-picker{right:0!important;left:auto!important}
#messages.messages .bubble-row.mine .message-reaction-picker{left:0!important;right:auto!important}
#messages.messages .message-reaction-picker button{flex:0 0 29px!important;width:29px!important;height:29px!important}
@media(max-width:620px){
  #messages.messages .message-reaction-row{max-width:calc(100vw - 50px)!important}
  #messages.messages .message-reactions{max-width:calc(100vw - 50px)!important}
}

/* v89 — reaction trigger beside the message + hover timestamp tooltip.
   Sender: add-reaction control is BEFORE the bubble.
   Receiver: add-reaction control is AFTER the bubble. */
#messages.messages .message-line{
  display:flex!important;
  flex-direction:row!important;
  align-items:flex-end!important;
  justify-content:flex-start!important;
  gap:6px!important;
  width:auto!important;
  max-width:100%!important;
  min-width:0!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
#messages.messages .bubble-row.mine .message-line{justify-content:flex-end!important}
#messages.messages .message-line .bubble-stack{
  flex:0 1 auto!important;
  min-width:0!important;
  max-width:100%!important;
  width:auto!important;
  overflow:visible!important;
}
#messages.messages .message-line .message-reaction-tools{
  position:relative!important;
  inset:auto!important;
  flex:0 0 28px!important;
  width:28px!important;
  min-width:28px!important;
  height:28px!important;
  margin:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  z-index:50!important;
}
#messages.messages .message-line .message-react-btn{
  width:28px!important;
  height:28px!important;
  min-width:28px!important;
  padding:0!important;
  border:1px solid var(--line)!important;
  border-radius:50%!important;
  background:var(--surface)!important;
  color:var(--muted)!important;
  display:grid!important;
  place-items:center!important;
  opacity:0!important;
  transform:scale(.92)!important;
  transition:opacity .14s ease,transform .14s ease,background .14s ease,box-shadow .14s ease!important;
  cursor:pointer!important;
  box-shadow:0 3px 10px rgba(12,28,58,.10)!important;
}
#messages.messages .message-line:hover .message-react-btn,
#messages.messages .message-react-btn:focus-visible{
  opacity:1!important;
  transform:scale(1)!important;
}
#messages.messages .message-line .message-react-btn:hover{
  background:#f5f8fd!important;
  box-shadow:0 4px 12px rgba(12,28,58,.14)!important;
}
#messages.messages .message-line .message-reaction-picker{
  position:absolute!important;
  top:auto!important;
  bottom:34px!important;
  width:max-content!important;
  max-width:min(300px,calc(100vw - 32px))!important;
  padding:6px!important;
  margin:0!important;
  display:none!important;
  flex-wrap:wrap!important;
  gap:3px!important;
  border:1px solid var(--line)!important;
  border-radius:10px!important;
  background:var(--surface)!important;
  box-shadow:0 12px 28px rgba(12,28,58,.16)!important;
  z-index:100!important;
  box-sizing:border-box!important;
}
#messages.messages .message-line .message-reaction-picker.show{display:flex!important}
#messages.messages .bubble-row:not(.mine) .message-line .message-reaction-picker{left:auto!important;right:0!important}
#messages.messages .bubble-row.mine .message-line .message-reaction-picker{left:0!important;right:auto!important}
#messages.messages .message-line .message-reaction-picker button{
  flex:0 0 29px!important;
  width:29px!important;
  height:29px!important;
  padding:0!important;
  border:0!important;
  border-radius:7px!important;
  background:transparent!important;
  display:grid!important;
  place-items:center!important;
  font-size:17px!important;
  cursor:pointer!important;
}
#messages.messages .message-line .message-reaction-picker button:hover{background:var(--surface-2)!important;transform:scale(1.08)!important}

/* Reaction counters remain attached to the lower corner of the bubble. */
#messages.messages .message-reaction-row{
  position:absolute!important;
  left:auto!important;
  right:auto!important;
  bottom:-5px!important;
  top:auto!important;
  width:auto!important;
  max-width:min(420px,calc(100vw - 70px))!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  align-items:flex-end!important;
  flex-wrap:nowrap!important;
  gap:0!important;
  z-index:20!important;
  pointer-events:none!important;
}
#messages.messages .bubble-row:not(.mine) .message-reaction-row{right:0!important;left:auto!important}
#messages.messages .bubble-row.mine .message-reaction-row{left:0!important;right:auto!important}
#messages.messages .message-reaction-row .message-reactions{
  pointer-events:auto!important;
}

/* Messenger-like timestamp: hidden until the message is hovered. */
#messages.messages .bubble .message-time-tooltip{
  position:absolute!important;
  left:50%!important;
  bottom:calc(100% + 7px)!important;
  transform:translate(-50%,4px)!important;
  z-index:80!important;
  display:block!important;
  width:max-content!important;
  max-width:260px!important;
  padding:5px 8px!important;
  border-radius:7px!important;
  background:rgba(24,32,48,.94)!important;
  color:#fff!important;
  font-size:11px!important;
  font-weight:500!important;
  line-height:1.2!important;
  white-space:nowrap!important;
  pointer-events:none!important;
  opacity:0!important;
  visibility:hidden!important;
  transition:opacity .12s ease,transform .12s ease,visibility .12s ease!important;
  box-shadow:0 5px 14px rgba(12,28,58,.18)!important;
}
#messages.messages .bubble:hover .message-time-tooltip,
#messages.messages .bubble:focus-within .message-time-tooltip{
  opacity:1!important;
  visibility:visible!important;
  transform:translate(-50%,0)!important;
}
#messages.messages .bubble .message-time-tooltip::after{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  bottom:-4px!important;
  width:8px!important;
  height:8px!important;
  background:rgba(24,32,48,.94)!important;
  transform:translateX(-50%) rotate(45deg)!important;
  border-radius:1px!important;
}
@media(max-width:620px){
  #messages.messages .message-line{gap:4px!important}
  #messages.messages .message-line .message-reaction-tools{flex-basis:26px!important;width:26px!important;min-width:26px!important;height:26px!important}
  #messages.messages .message-line .message-react-btn{width:26px!important;height:26px!important;min-width:26px!important}
  #messages.messages .bubble .message-time-tooltip{font-size:10px!important;padding:4px 7px!important}
}


/* v90 — reaction picker stacking/position fix.
   The picker is positioned by JS as fixed so it is never clipped by the
   scrollable message panel. It opens above the message, with a safe fallback
   below when the message is too close to the top edge of the viewport. */
#messages.messages .message-line .message-reaction-tools{
  z-index:99990!important;
  overflow:visible!important;
}
#messages.messages .message-line .message-reaction-picker{
  position:fixed!important;
  z-index:999999!important;
  bottom:auto!important;
  top:-9999px;
  left:-9999px;
  display:none!important;
  max-height:min(220px,calc(100vh - 16px))!important;
  overflow:auto!important;
}
#messages.messages .message-line .message-reaction-picker.show{
  display:flex!important;
}
#messages.messages .message-line .message-reaction-picker.reaction-picker-below{
  /* JS flips the picker below only when there is not enough room above. */
}
#messages.messages .message-line{
  position:relative!important;
  z-index:2!important;
}
#messages.messages .bubble-row:hover .message-reaction-tools,
#messages.messages .message-line:focus-within .message-reaction-tools{
  z-index:99990!important;
}

/* v91 — reaction tray follows the clicked reaction button. */
#messages.messages .message-line .message-reaction-picker{
  transform:none!important;
}

/* v91 — show reactor names when a reaction has more than one person. */
#messages.messages .message-reaction{
  position:relative!important;
  overflow:visible!important;
}
#messages.messages .message-reaction .reaction-reactors-tooltip{
  position:absolute!important;
  left:50%!important;
  bottom:calc(100% + 7px)!important;
  transform:translate(-50%,4px)!important;
  z-index:1000000!important;
  display:block!important;
  width:max-content!important;
  max-width:240px!important;
  padding:6px 9px!important;
  border-radius:7px!important;
  background:rgba(24,32,48,.96)!important;
  color:#fff!important;
  font-size:11px!important;
  font-weight:500!important;
  line-height:1.25!important;
  white-space:normal!important;
  text-align:center!important;
  pointer-events:none!important;
  opacity:0!important;
  visibility:hidden!important;
  transition:opacity .12s ease,transform .12s ease,visibility .12s ease!important;
  box-shadow:0 5px 14px rgba(12,28,58,.18)!important;
}
#messages.messages .message-reaction .reaction-reactors-tooltip::after{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  bottom:-4px!important;
  width:8px!important;
  height:8px!important;
  background:rgba(24,32,48,.96)!important;
  transform:translateX(-50%) rotate(45deg)!important;
  border-radius:1px!important;
}
#messages.messages .message-reaction:hover .reaction-reactors-tooltip,
#messages.messages .message-reaction:focus-visible .reaction-reactors-tooltip{
  opacity:1!important;
  visibility:visible!important;
  transform:translate(-50%,0)!important;
}

/* v91 — JS controls the exact viewport position; neutralize the older side anchors. */
#messages.messages .message-line .message-reaction-picker{
  left:auto!important;
  right:auto!important;
}


/* v92 — body-level reaction tray. It is centered on the clicked add-reaction button by JS. */
.message-reaction-picker.reaction-picker-portal{
  position:fixed!important;
  display:none!important;
  flex-wrap:wrap!important;
  gap:3px!important;
  width:max-content!important;
  max-width:min(300px,calc(100vw - 16px))!important;
  max-height:min(220px,calc(100vh - 16px))!important;
  overflow:auto!important;
  padding:6px!important;
  margin:0!important;
  border:1px solid var(--line)!important;
  border-radius:10px!important;
  background:var(--surface)!important;
  box-shadow:0 12px 28px rgba(12,28,58,.16)!important;
  z-index:2147483000!important;
  box-sizing:border-box!important;
}
.message-reaction-picker.reaction-picker-portal.show{display:flex!important}
.message-reaction-picker.reaction-picker-portal button{
  flex:0 0 29px!important;width:29px!important;height:29px!important;padding:0!important;
  border:0!important;border-radius:7px!important;background:transparent!important;
  display:grid!important;place-items:center!important;font-size:17px!important;cursor:pointer!important;
}
.message-reaction-picker.reaction-picker-portal button:hover{background:var(--surface-2)!important;transform:scale(1.08)!important}


/* v93 Daily Task history navigation */
.daily-date-nav{flex-wrap:wrap}
.daily-date-nav .btn{white-space:nowrap}
.daily-jump{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:-6px 0 18px;padding:10px 12px;border:1px solid var(--line);background:var(--surface);border-radius:14px;box-shadow:var(--shadow-sm)}
.daily-jump label{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:11px;font-weight:800}
.daily-jump label .ui-icon{width:15px;height:15px;color:var(--accent)}
.daily-jump input{height:38px;min-width:145px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);padding:0 10px;font:inherit;font-weight:700;outline:none}
.daily-jump input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(53,104,255,.1)}
.daily-history-modal{width:min(820px,calc(100vw - 40px));max-height:calc(100vh - 40px);overflow:auto;padding:24px}
.daily-history-modal .modal-head p{max-width:620px}
.daily-history-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--surface-2,#f8fbff);margin-bottom:16px}
.daily-history-actions label{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:11px;font-weight:800}
.daily-history-actions label .ui-icon{width:15px;height:15px;color:var(--accent)}
.daily-history-actions input{height:38px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);padding:0 10px;font:inherit;font-weight:700;outline:none}
.daily-history-list{display:flex;flex-direction:column;gap:16px}
.daily-history-month{border:1px solid var(--line);border-radius:16px;padding:14px;background:var(--surface)}
.daily-history-month-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.daily-history-month-head strong{font-size:14px;color:var(--ink)}.daily-history-month-head span{font-size:10px;color:var(--muted);font-weight:700}
.daily-history-dates{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.daily-history-date{min-height:86px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2,#fff);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:var(--muted);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease}
.daily-history-date:hover{transform:translateY(-2px);border-color:#b9cdef;background:#f7faff;box-shadow:0 8px 18px rgba(31,72,128,.08)}
.daily-history-day{font-size:9px;text-transform:uppercase;font-weight:800;letter-spacing:.06em}.daily-history-date b{font-size:21px;color:var(--ink);line-height:1}.daily-history-date small{font-size:9px;color:var(--muted);font-weight:700}
.daily-history-modal .modal-footer{margin-top:16px}
@media(max-width:700px){.daily-date-nav{width:100%}.daily-date-nav>div{min-width:0;flex:1}.daily-jump,.daily-history-actions{align-items:stretch;flex-direction:column}.daily-jump label,.daily-history-actions label{justify-content:space-between}.daily-jump input,.daily-history-actions input{flex:1}.daily-history-modal{width:calc(100vw - 24px);padding:18px}}

/* v94 — Daily history month navigation + profile/member fields */
.heading-action-group{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.daily-history-month-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.daily-history-month-title{border:0;background:transparent;padding:2px 4px;margin:-2px 0;display:flex;flex-direction:column;align-items:flex-start;gap:2px;cursor:pointer;color:var(--ink);border-radius:9px;text-align:left}
.daily-history-month-title:hover{background:#f2f6fc}
.daily-history-month-title strong{font-size:17px;line-height:1.2;color:var(--ink)}
.daily-history-month-title span{font-size:10px;color:var(--muted);font-weight:700}
.daily-history-nav{display:flex;align-items:center;gap:6px}
.daily-history-nav .icon-btn{width:36px;height:36px}
.daily-history-nav .icon-btn:disabled{opacity:.35;cursor:not-allowed;box-shadow:none}
.daily-history-month-picker{margin:-2px 0 12px;padding:12px;border:1px solid var(--line);border-radius:13px;background:var(--surface-2,#f8fbff);box-shadow:0 12px 28px rgba(31,72,128,.08)}
.history-picker-grid{display:grid;grid-template-columns:110px minmax(0,1fr);gap:12px}
.history-picker-years{display:flex;flex-direction:column;gap:5px;padding-right:10px;border-right:1px solid var(--line)}
.history-year-btn,.history-month-btn{border:1px solid transparent;background:transparent;color:var(--muted);border-radius:9px;padding:9px 10px;text-align:left;font:inherit;font-size:11px;font-weight:800;cursor:pointer;transition:.15s}
.history-year-btn:hover,.history-month-btn:hover{background:#eef4ff;color:var(--blue)}
.history-year-btn.selected,.history-month-btn.selected{background:#eaf1ff;border-color:#c5d7ff;color:var(--blue)}
.history-picker-months{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;align-content:start}
.history-picker-months .history-month-btn{text-align:center}
.member-row{grid-template-columns:auto minmax(170px,1.4fr) minmax(120px,1fr) minmax(150px,1.2fr) auto auto auto}
.member-avatar-wrap{display:flex;align-items:center}
.member-detail{min-width:0;display:flex;flex-direction:column;gap:3px}
.member-detail small{font-size:9px;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.member-detail strong{font-size:11px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.team-manager-modal{max-width:620px}
.team-add-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;align-items:center;margin-bottom:14px}
.team-list{border:1px solid var(--line);border-radius:13px;overflow:hidden}
.team-list-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 13px;border-bottom:1px solid var(--line);background:var(--surface)}
.team-list-row:last-child{border-bottom:0}
.team-list-row>span{display:flex;align-items:center;gap:8px;min-width:0}.team-list-row .ui-icon{width:16px;color:var(--blue);flex:none}.team-list-row strong{font-size:12px;color:var(--ink)}.team-list-row small{font-size:10px;color:var(--muted);font-weight:700}
@media(max-width:900px){.member-row{grid-template-columns:auto minmax(140px,1fr) auto auto auto}.member-detail{display:none}}
@media(max-width:620px){.heading-action-group{width:100%;justify-content:flex-start}.history-picker-grid{grid-template-columns:1fr}.history-picker-years{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-right:0;padding-right:0}.history-year-btn{text-align:center}.history-picker-months{grid-template-columns:repeat(2,minmax(0,1fr))}.daily-history-month-title strong{font-size:15px}.team-add-row{grid-template-columns:1fr}.member-row{grid-template-columns:auto minmax(0,1fr) auto}.member-row>.role-pill,.member-row>.status-pill{display:none}}


/* v95 — Daily rich-text display + administrator-managed job titles */
.daily-task-description{margin:6px 0 0;color:var(--muted);font-size:12px;line-height:1.55;overflow-wrap:anywhere}
.daily-task-description p,.daily-task-description div{margin:0 0 4px}.daily-task-description p:last-child,.daily-task-description div:last-child{margin-bottom:0}
.daily-task-description ul,.daily-task-description ol{margin:4px 0 4px 18px;padding:0}.daily-task-description li{margin:2px 0}.daily-task-description a{color:var(--blue);text-decoration:underline}.daily-no-details{color:var(--muted)}
.manager-section{margin-top:18px}.manager-section:first-of-type{margin-top:0}.manager-section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}.manager-section-head>div{display:flex;align-items:baseline;gap:8px}.manager-section-head strong{font-size:13px;color:var(--ink)}.manager-section-head small{font-size:10px;color:var(--muted);font-weight:700}
.team-list-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center}.team-row-actions{display:flex;align-items:center;gap:4px}.team-row-actions .icon-btn{width:32px;height:32px}.team-row-actions .danger-icon{color:#c33}

/* v97 — dedicated Team & Job Title administration panels */
.settings-two-column{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
.directory-manager-card{overflow:hidden}
.directory-add{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;align-items:center;margin:16px 0}
.directory-list{border:1px solid var(--line);border-radius:13px;overflow:hidden;background:var(--surface)}
.directory-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 13px;border-bottom:1px solid var(--line);min-height:64px}
.directory-row:last-child{border-bottom:0}
.directory-item-main{display:flex;align-items:center;gap:10px;min-width:0}
.directory-item-icon{width:34px;height:34px;border-radius:10px;background:#eef4ff;color:var(--blue);display:grid;place-items:center;flex:none}
.directory-item-icon .ui-icon{width:16px;height:16px}
.directory-item-main strong{display:block;font-size:12px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.directory-item-main small{display:block;margin-top:3px;font-size:10px;color:var(--muted);font-weight:700}
.directory-row-actions{display:flex;align-items:center;gap:5px;flex:none}
.directory-row-actions .icon-btn{width:34px;height:34px}
.directory-row-actions .btn-sm{min-height:32px;padding:7px 10px;font-size:10px}
.directory-edit-wrap{flex:1;min-width:0}
.directory-edit-wrap .form-control{width:100%}
.directory-row.editing{background:#f8fbff}
.directory-empty{padding:28px 15px;text-align:center;color:var(--muted);font-size:12px}
@media(max-width:850px){.settings-two-column{grid-template-columns:1fr}}
@media(max-width:520px){.directory-add{grid-template-columns:1fr}.directory-row{align-items:flex-start}.directory-row-actions{padding-top:1px}.directory-item-main{min-width:0}.directory-item-main>div:last-child{min-width:0}}

/* v98 — Settings page + clearer Daily Task history controls */
.settings-page{display:flex;flex-direction:column;gap:16px}
.settings-tabs{display:flex;align-items:center;gap:7px;padding:5px;border:1px solid var(--line);background:var(--surface-2,#f8fbff);border-radius:14px;width:max-content;max-width:100%}
.settings-tab{display:inline-flex;align-items:center;gap:8px;border:1px solid transparent;background:transparent;color:var(--muted);padding:10px 14px;border-radius:10px;font:inherit;font-size:11px;font-weight:800;cursor:pointer;transition:.16s ease;white-space:nowrap}
.settings-tab .ui-icon{width:15px;height:15px}
.settings-tab:hover{background:#eef4ff;color:var(--blue)}
.settings-tab.active{background:var(--surface);border-color:#cbdcff;color:var(--blue);box-shadow:0 4px 12px rgba(31,72,128,.08)}
.settings-tab-content{min-width:0}
.daily-history-month-title{border:1px solid #cbdcff!important;background:#f7faff!important;padding:9px 12px!important;margin:-2px 0!important;display:flex;flex-direction:column;align-items:flex-start;gap:2px;cursor:pointer;color:var(--ink);border-radius:11px;text-align:left;box-shadow:0 2px 8px rgba(31,72,128,.05);transition:.16s ease}
.daily-history-month-title:hover{background:#edf4ff!important;border-color:#9fbcff!important;box-shadow:0 5px 14px rgba(31,72,128,.09)}
.daily-history-month-title:focus-visible{outline:3px solid rgba(53,104,255,.16);outline-offset:2px}
.daily-history-month-title strong:after{content:'  ▾';font-size:11px;color:var(--blue);vertical-align:middle}
@media(max-width:620px){.settings-tabs{width:100%;overflow:auto}.settings-tab{flex:1;justify-content:center}.settings-tab-content .settings-two-column{grid-template-columns:1fr}}


/* v99 — profile access, focused project color, online job title, admin directory UX */
.mini-profile,.top-user{cursor:pointer}
.mini-profile:focus-visible,.top-user:focus-visible{outline:3px solid rgba(33,103,243,.16);outline-offset:3px;border-radius:12px}
.top-user{border-radius:12px;padding:4px 6px;transition:background .16s ease}
.top-user:hover{background:#f4f7fc}
.settings-two-column .directory-manager-card{border-top:3px solid var(--blue)}
.directory-row-actions .danger-icon{color:#c83f52;background:#fff7f8;border-color:#f3c7cf}
.directory-row-actions .danger-icon:hover{background:#ffecef;border-color:#e99aa8;color:#b92f42}
.directory-delete-modal{width:min(560px,100%)}
.directory-delete-icon{margin-bottom:10px}
.directory-delete-warning{display:flex;align-items:flex-start;gap:10px;padding:13px 14px;border:1px solid #f0d5da;background:#fff8f9;border-radius:12px;color:#7f4b53;font-size:10px}
.directory-delete-warning .ui-icon{width:17px;flex:none;color:#c44759}
.directory-delete-warning strong{display:block;color:#8f3341;font-size:10px}
.directory-delete-warning span{display:block;margin-top:3px;color:#9a6b72}
.directory-row.editing .directory-edit-wrap .form-control{font-size:11px}
.online-profile-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.project-card-purple,.project-card-green,.project-card-orange,.project-card-cyan,.project-card-pink{--project-accent:#2167f3;--project-accent-2:#24b7ff}
.project-card-blue{--project-accent:#2167f3;--project-accent-2:#24b7ff}
.project-card-glow{background:radial-gradient(circle,color-mix(in srgb,#2167f3 18%,transparent),transparent 68%)!important}
.bubble,.bubble .message-body{font-size:12px!important}
@media(max-width:900px){.online-profile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.online-profile-grid{grid-template-columns:1fr}}


/* v100 — profile hover polish, uppercase Daily Task teams, and chat hover separation. */
.mini-profile,.top-user{transition:transform .18s ease,background .18s ease,box-shadow .18s ease,border-color .18s ease!important}
.mini-profile:hover,.top-user:hover{transform:translateY(-2px)!important;background:#f4f7fc!important;box-shadow:0 7px 18px rgba(31,72,128,.08)!important}
.mini-profile:active,.top-user:active{transform:translateY(0)!important}
.mini-profile .avatar,.top-user .avatar{transition:transform .18s ease,box-shadow .18s ease!important}
.mini-profile:hover .avatar,.top-user:hover .avatar{transform:scale(1.04)!important;box-shadow:0 4px 12px rgba(31,72,128,.14)!important}

/* Keep the Daily Task team label consistently uppercase. */
.daily-person-head .eyebrow{text-transform:uppercase!important}

/* Keep message timestamp and edit/delete controls on separate hover layers. */
#messages.messages .bubble-row.mine .msg-actions{top:-62px!important;right:0!important;z-index:90!important}
#messages.messages .bubble-row.mine .msg-actions button{position:relative!important;z-index:91!important}
#messages.messages .bubble-row.mine .message-time-tooltip{z-index:80!important;bottom:calc(100% + 7px)!important}
#messages.messages .bubble-row.mine:hover .msg-actions{z-index:90!important}
@media(max-width:620px){
  #messages.messages .bubble-row.mine .msg-actions{top:-58px!important}
}


/* v101 — Backlogs polish + inbox favorites + team-based group creation */
.backlog-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:stretch}
.backlog-task-card{padding:20px!important;cursor:pointer;min-width:0;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease!important}
.backlog-task-card:hover,.backlog-task-card:focus-visible{transform:translateY(-3px);box-shadow:0 18px 38px rgba(28,62,112,.13)!important;border-color:#cbd9f4;outline:none}
.backlog-task-main{display:flex;gap:14px;min-width:0}.backlog-task-icon{width:46px;height:46px;border-radius:14px;background:#edf4ff;color:var(--blue);display:grid;place-items:center;flex:none}.backlog-task-icon svg{width:20px;height:20px}.backlog-task-copy{min-width:0;flex:1}.backlog-task-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.backlog-task-head .status-pill{flex:none}.backlog-open-hint{display:inline-flex;align-items:center;gap:4px;color:#9aa6b7;font-size:8px;font-weight:700;opacity:0;transform:translateX(-4px);transition:.2s ease}.backlog-task-card:hover .backlog-open-hint,.backlog-task-card:focus-visible .backlog-open-hint{opacity:1;transform:none}.backlog-open-hint svg{width:11px;height:11px}.backlog-task-card h3{font-size:18px;line-height:1.2;margin:10px 0 7px;letter-spacing:-.025em}.backlog-task-card p{font-size:10px;line-height:1.6;color:var(--muted);margin:0;min-height:32px}.backlog-task-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;border-top:1px solid var(--line);margin-top:18px;padding-top:13px;color:#748197;font-size:8px}.backlog-task-foot span{display:flex;align-items:center;gap:5px;min-width:0}.backlog-task-foot span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.backlog-task-foot svg{width:12px;height:12px;color:var(--blue)}
.chat-list-section-label{padding:12px 12px 6px;color:#9aa5b5;font-size:8px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.chat-favorite-btn{width:26px!important;height:26px!important;padding:0!important;border:0!important;background:transparent!important;color:#a3afbf!important;border-radius:8px!important;display:grid!important;place-items:center!important;opacity:0;transition:.18s ease!important}.chat-user:hover .chat-favorite-btn,.chat-favorite-btn.active{opacity:1}.chat-favorite-btn:hover{color:var(--blue)!important;background:#eef4ff!important}.chat-favorite-btn.active{color:#2167f3!important}.chat-favorite-btn svg{width:14px!important;height:14px!important}.chat-user-side{gap:5px!important}
.group-modal-large{max-width:900px!important}.group-selection-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.group-selection-panel{border:1px solid var(--line);border-radius:14px;background:#fbfcff;padding:12px;min-width:0}.group-selection-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.group-selection-head strong{font-size:10px;display:block}.group-selection-head small{font-size:8px;color:var(--muted);display:block;margin-top:3px}.btn-sm{padding:7px 9px!important;font-size:8px!important}.group-team-list{display:grid;gap:6px;max-height:250px;overflow:auto}.group-team-option{display:flex!important;align-items:center;gap:9px;padding:9px;border:1px solid var(--line);border-radius:10px;background:#fff;cursor:pointer;transition:.16s ease}.group-team-option:hover,.group-team-option.selected{border-color:#c5d7fb;background:#f5f8ff}.group-team-option input{position:absolute;opacity:0;pointer-events:none}.group-team-icon{width:30px;height:30px;border-radius:9px;background:#edf4ff;color:var(--blue);display:grid;place-items:center;flex:none}.group-team-icon svg{width:14px;height:14px}.group-team-option>span:nth-child(3){margin-left:auto}.group-team-option strong{display:block;font-size:9px}.group-team-option small{display:block;font-size:7px;color:var(--muted);margin-top:2px}.group-member-search{margin-bottom:8px}.group-selection-summary{margin-top:10px;padding:9px 12px;border-radius:10px;background:#edf4ff;color:var(--blue);font-size:9px;font-weight:800;text-align:center}
@media(max-width:760px){.backlog-grid{grid-template-columns:1fr}.group-selection-grid{grid-template-columns:1fr}.group-modal-large{max-width:calc(100vw - 24px)!important}}


/* v102 — inbox avatar presence + larger group creation/member UI */
.avatar-status-wrap{position:relative;display:inline-flex;width:max-content;height:max-content;flex:none;line-height:0}
.avatar-status-wrap .avatar{display:flex}
.avatar-online-dot{position:absolute;right:-2px;bottom:-2px;width:10px;height:10px;border-radius:50%;background:#c5ccd6;border:2px solid var(--surface);box-shadow:0 1px 4px rgba(20,40,70,.12);z-index:3;pointer-events:none}
.avatar-online-dot.is-online{background:var(--success);box-shadow:0 0 0 2px var(--surface),0 2px 6px rgba(24,166,115,.22)}
.chat-user .avatar-status-wrap{margin-right:1px}
.chat-user .avatar-status-wrap .avatar.small{width:38px!important;height:38px!important}
.chat-user-side:has(.chat-favorite-btn),.chat-user-side{min-width:30px}
.group-modal-large{max-width:1040px!important}
.group-modal-large .modal-head h2{font-size:20px!important}
.group-modal-large .modal-head p{font-size:11px!important}
.group-modal-large .form-group label,.group-modal-large .group-selection-head strong{font-size:12px!important}
.group-modal-large .group-selection-head small{font-size:9px!important}
.group-modal-large #groupName{font-size:12px!important;min-height:44px}
.group-modal-large .group-selection-panel{padding:16px!important;border-radius:16px}
.group-modal-large .group-team-option{padding:12px!important;min-height:58px}
.group-modal-large .group-team-option strong{font-size:11px!important}
.group-modal-large .group-team-option small{font-size:9px!important}
.group-modal-large .group-team-icon{width:36px;height:36px;border-radius:10px}
.group-modal-large .group-team-icon svg{width:16px;height:16px}
.group-modal-large .group-member-row,.group-modal-large .member-picker-row{min-height:62px!important;padding:11px!important}
.group-modal-large .member-option-text strong{font-size:11px!important}
.group-modal-large .member-option-text small{font-size:9px!important}
.group-modal-large .member-check svg{width:18px!important;height:18px!important}
.group-modal-large .group-selection-summary{font-size:11px!important;padding:11px 14px!important}
.group-members-modal .modal-footer .modal-actions{display:flex;gap:7px;flex-wrap:wrap}
.group-members-modal .btn.danger{color:#c83f52;background:#fff7f8;border:1px solid #f3c7cf}
.group-members-modal .btn.danger:hover{background:#ffecef;border-color:#e99aa8}
@media(max-width:760px){.group-modal-large{max-width:calc(100vw - 16px)!important}.group-selection-panel{padding:12px!important}}


/* v103 — group creator controls, readable notifications, and chat-list avatar polish */
.group-members-modal .group-remove-all-btn{min-height:36px!important;padding:9px 13px!important;font-size:10px!important;font-weight:800!important;border-radius:10px!important;display:inline-flex!important;align-items:center!important;gap:6px!important;visibility:visible!important;opacity:1!important}
.group-members-modal .group-remove-all-btn svg{width:14px!important;height:14px!important}
.notification-item{padding:14px 5px!important;gap:12px!important}
.notification-icon{width:34px!important;height:34px!important;border-radius:10px!important}
.notification-icon svg{width:16px!important;height:16px!important}
.notification-item b{font-size:10px!important;line-height:1.3!important}
.notification-item span{font-size:9px!important;line-height:1.55!important;margin-top:4px!important}
.notification-item small{font-size:8px!important;margin-top:5px!important}
.notif-head{padding-bottom:12px!important}
.notif-head strong{font-size:13px!important}
.notif-head span{font-size:9px!important}
.notif-head button{font-size:9px!important}
.notif-panel{width:390px!important;padding:16px!important}
.chat-user{position:relative;min-height:64px!important;padding:10px 12px!important;gap:11px!important}
.chat-user .avatar-status-wrap{position:relative!important;width:40px!important;height:40px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;flex:none!important;overflow:visible!important;line-height:0!important}
.chat-user .avatar-status-wrap .avatar.small{width:40px!important;height:40px!important;border-radius:50%!important;overflow:hidden!important;flex:none!important}
.chat-user .avatar-status-wrap .avatar.small img{width:100%!important;height:100%!important;object-fit:cover!important;border-radius:50%!important;display:block!important}
.chat-user .avatar-online-dot{right:-1px!important;bottom:-1px!important;width:11px!important;height:11px!important;border:2px solid var(--surface)!important;z-index:5!important}
.chat-user .avatar-online-dot.is-online{box-shadow:0 0 0 1px var(--surface),0 2px 6px rgba(24,166,115,.25)!important}
.chat-user-main{min-width:0!important}
.chat-user-main strong{font-size:10px!important}
.chat-user-main span{font-size:8px!important}
.chat-user-side{min-width:26px!important}
.group-avatar{width:40px!important;height:40px!important;border-radius:50%!important;display:grid!important;place-items:center!important;flex:none!important;overflow:hidden!important}
.group-avatar svg{width:18px!important;height:18px!important}
@media(max-width:620px){.notif-panel{width:auto!important}.notification-item b{font-size:10px!important}.notification-item span{font-size:9px!important}.notification-item small{font-size:8px!important}}


/* v104 — inbox readability, centered initials, larger group creator UI, bounded notifications */
/* Chat list typography */
.chat-user-main strong{font-size:14px!important;line-height:1.25!important;letter-spacing:-.01em!important}
.chat-user-main span{font-size:12px!important;line-height:1.35!important;margin-top:4px!important}
.chat-user-main .group-tag{font-size:9px!important;padding:3px 6px!important;line-height:1!important}
/* Keep initials perfectly centered when a user has no avatar image. */
.chat-user .avatar-status-wrap .avatar,
.chat-user .avatar-status-wrap .avatar.small{
  display:grid!important;
  place-items:center!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
}
.chat-user .avatar-status-wrap .avatar:not(:has(img)){line-height:1!important;text-indent:0!important}
.chat-user .avatar-status-wrap .avatar img{display:block!important}
/* New Group: larger, easier-to-read controls */
.group-modal-large{max-width:1080px!important}
.group-modal-large .modal-head h2{font-size:24px!important}
.group-modal-large .modal-head p{font-size:12px!important;line-height:1.5!important}
.group-modal-large .form-group label{font-size:14px!important}
.group-modal-large #groupName{font-size:14px!important;min-height:48px!important;padding:12px 14px!important}
.group-modal-large .group-selection-head strong{font-size:14px!important}
.group-modal-large .group-selection-head small{font-size:10px!important;line-height:1.4!important}
.group-modal-large .btn-sm{font-size:10px!important;padding:9px 11px!important}
.group-modal-large .group-team-option{min-height:68px!important;padding:13px!important}
.group-modal-large .group-team-option strong{font-size:13px!important;color:#667085!important;font-weight:800!important}
.group-modal-large .group-team-option small{font-size:10px!important;color:#8a94a5!important;margin-top:4px!important}
.group-modal-large .group-team-icon{width:40px!important;height:40px!important}
.group-modal-large .member-picker-row{min-height:68px!important;padding:12px!important}
.group-modal-large .member-option-text strong{font-size:13px!important}
.group-modal-large .member-option-text small{font-size:10px!important;line-height:1.4!important}
.group-modal-large .group-selection-summary{font-size:13px!important;padding:12px 14px!important}
.group-modal-large .modal-actions .btn{font-size:11px!important;padding:11px 15px!important}
/* Notifications: readable, contained, and independently scrollable. */
.notif-panel{width:410px!important;max-height:min(82vh,calc(100vh - 86px))!important;overflow:hidden!important;display:none;flex-direction:column!important;padding:16px!important}
.notif-panel.show{display:flex!important}
.notification-scroll{min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;flex:1 1 auto!important;padding-right:4px!important}
.notification-item{padding:16px 6px!important;gap:13px!important;align-items:flex-start!important}
.notification-item b{font-size:12px!important;line-height:1.35!important}
.notification-item span{font-size:11px!important;line-height:1.55!important;margin-top:5px!important;overflow-wrap:anywhere!important;word-break:break-word!important}
.notification-item small{font-size:9px!important;line-height:1.3!important;margin-top:6px!important}
.notification-icon{width:38px!important;height:38px!important;border-radius:11px!important;flex:0 0 38px!important}
.notification-icon svg{width:18px!important;height:18px!important}
.notification-actions{display:flex!important;justify-content:flex-end!important;padding:12px 0 0!important;margin-top:8px!important;border-top:1px solid var(--line)!important;flex:0 0 auto!important}
.notification-actions .btn{font-size:10px!important;padding:9px 12px!important}
@media(max-width:620px){
 .notif-panel{left:8px!important;right:8px!important;top:60px!important;width:auto!important;max-height:calc(100vh - 72px)!important}
 .chat-user-main strong{font-size:14px!important}.chat-user-main span{font-size:12px!important}
 .group-modal-large .modal-head h2{font-size:20px!important}
}


/* v105 — compact chat list + chat-window hide action */
.chat-list{min-width:0!important}
.chat-user{min-height:50px!important;padding:6px 10px!important;gap:8px!important;border-bottom:1px solid #f1f4f8!important}
.chat-user .avatar-status-wrap,.chat-user .avatar-status-wrap .avatar.small,.chat-user .group-avatar{width:34px!important;height:34px!important}
.chat-user .avatar-online-dot{width:9px!important;height:9px!important;right:-1px!important;bottom:-1px!important}
.chat-user-main strong{font-size:12px!important;line-height:1.2!important;letter-spacing:0!important}
.chat-user-main span{font-size:10px!important;line-height:1.2!important;margin-top:2px!important}
.chat-user-main .group-tag{font-size:8px!important;padding:2px 5px!important;margin-left:5px!important}
.hidden-chat-tag{display:inline-flex!important;align-items:center!important;margin-left:5px!important;padding:2px 5px!important;border-radius:999px!important;background:#f0f3f7!important;color:#7b8799!important;font-size:7px!important;font-weight:800!important}
.chat-user-side{min-width:24px!important}
.chat-list-section-label{padding:7px 10px 3px!important;font-size:7px!important}
.hidden-chat-row{opacity:.95!important}

/* v105 — inbox typography and strict hidden-chat behavior */
.chat-title strong{font-size:14px!important}
#chatTitle strong{font-size:14px!important;line-height:1.25!important}
#chatTitle span{font-size:10px!important;line-height:1.35!important;margin-top:3px!important}
.chat-head-btn{font-size:12px!important}
.chat-head-btn .ui-icon{width:14px!important;height:14px!important}
.chat-user-main strong{font-size:12px!important;line-height:1.3!important}
.chat-user-main span{font-size:10px!important;line-height:1.35!important;margin-top:3px!important}
.chat-user-main .group-tag{font-size:8px!important;padding:2px 5px!important}
.message-body{font-size:13px!important;line-height:1.45!important}
.message-body *{font-size:inherit}
.message-edit-input{font-size:13px!important}

/* Keep the chat action/header spacing clean at smaller widths. */
#chatHeaderActions{gap:6px!important;flex-wrap:wrap!important}


/* v107 — requested compact chat bubble typography */
.message-body,.message-body *{font-size:12px!important;line-height:1.45!important}
.message-edit-input{font-size:12px!important;line-height:1.45!important}


/* v108 — persistent notification actions + compact chat typography */
.notif-head-actions{display:flex!important;align-items:center!important;gap:6px!important;flex:0 0 auto!important}
.notif-head-actions button{border:0!important;background:transparent!important;color:var(--blue)!important;font-weight:800!important;font-size:9px!important;padding:5px 6px!important;border-radius:7px!important;white-space:nowrap!important}
.notif-head-actions button:hover{background:#edf3ff!important}
.notif-head-actions button:disabled{color:#aab3c0!important;cursor:not-allowed!important;background:transparent!important}
html[data-theme="dark"] .notif-head-actions button:hover{background:#1a2940!important}
#messages.messages .bubble,#messages.messages .bubble .message-body,#messages.messages .bubble .message-body *{font-size:12px!important;line-height:1.45!important}


/* v109 — hard-lock chat bubble text to 12px */
#messages.messages .bubble,
#messages.messages .bubble .message-body,
#messages.messages .bubble .message-body > div,
#messages.messages .bubble .message-body * {
  font-size:12px !important;
  line-height:1.45 !important;
  -webkit-text-size-adjust:100% !important;
  text-size-adjust:100% !important;
}

/* v112 — administrator Monthly Reports; UI aligned to standalone report preview */
.report-actions{display:flex;gap:8px;flex-wrap:wrap}.report-print-meta{display:none}.report-filters{display:flex;align-items:end;gap:12px;flex-wrap:wrap;padding:14px;margin-bottom:16px}.report-field{display:flex;flex-direction:column;gap:6px;min-width:170px}.report-field label{font-size:10px;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.06em}.report-field select{height:40px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);padding:0 11px;font:inherit;font-size:12px;min-width:165px}.report-reset{margin-left:auto}.report-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-bottom:16px}.report-kpi{padding:15px 16px}.report-kpi-top{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.report-kpi-top .ui-icon{width:17px;height:17px}.report-kpi>strong{display:block;font-size:28px;line-height:1.1;margin:10px 0 5px;letter-spacing:-.03em}.report-kpi>small{display:block;color:var(--muted);font-size:10px}.report-grid-2{display:grid;grid-template-columns:1.35fr .95fr;gap:16px;margin-bottom:16px}.report-card{overflow:hidden}.report-card-head{padding:16px 17px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:14px}.report-card-head h3{margin:0;font-size:14px}.report-card-head p{margin:4px 0 0;color:var(--muted);font-size:11px}.report-card-body{padding:14px 16px}.report-legend{display:flex;gap:12px;font-size:10px;color:var(--muted);white-space:nowrap}.report-legend span{display:inline-flex;align-items:center;gap:5px}.created-dot,.completed-dot{display:inline-block;width:8px;height:8px;border-radius:50%}.created-dot{background:#cbd5e1}.completed-dot{background:#2563eb}.report-chart{height:245px;position:relative;padding:8px 8px 18px 36px}.report-ylabels{position:absolute;left:0;top:12px;bottom:28px;display:flex;flex-direction:column;justify-content:space-between;font-size:9px;color:#9ca3af}.report-grid{position:absolute;left:36px;right:8px;top:12px;bottom:28px;display:flex;flex-direction:column;justify-content:space-between}.report-grid i{display:block;border-top:1px dashed var(--line)}.report-bars{position:absolute;left:39px;right:8px;top:18px;bottom:28px;display:flex;gap:3px;align-items:stretch}.report-bar-day{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;min-width:7px;position:relative}.report-bar-pair{width:100%;height:100%;display:flex;align-items:flex-end;justify-content:center;gap:2px}.report-bar{display:block;width:42%;min-height:0;border-radius:4px 4px 1px 1px}.report-bar.created{background:#cbd5e1}.report-bar.completed{background:#2563eb}.report-bar-day small{height:14px;font-size:8px;color:#9ca3af;line-height:14px}.report-status-body{min-height:275px;padding:18px;display:flex;align-items:center;gap:20px}.report-donut{width:175px;height:175px;border-radius:50%;flex:0 0 175px;background:conic-gradient(#2563eb 0 var(--done),#7c3aed var(--done) calc(var(--done) + var(--prog)),#f59e0b calc(var(--done) + var(--prog)) calc(var(--done) + var(--prog) + var(--review)),#ef4444 calc(var(--done) + var(--prog) + var(--review)) calc(var(--done) + var(--prog) + var(--review) + var(--new)),#cbd5e1 0);display:grid;place-items:center;position:relative}.report-donut:after{content:"";position:absolute;width:108px;height:108px;background:var(--surface);border-radius:50%}.report-donut>div{position:relative;z-index:2;text-align:center}.report-donut strong{display:block;font-size:27px}.report-donut span{font-size:9px;color:var(--muted)}.report-status-list{flex:1;display:grid;gap:12px}.report-status-row{display:flex;justify-content:space-between;align-items:center;font-size:11px}.report-status-row span{display:flex;align-items:center;gap:7px;color:var(--muted)}.report-status-row i{width:8px;height:8px;border-radius:50%;display:inline-block}.report-progress{height:7px;background:var(--surface-2,#eef2f7);border-radius:999px;overflow:hidden;margin-top:5px}.report-progress span{display:block;height:100%;border-radius:999px}.report-chip{font-size:10px;background:var(--accent-soft,#eff6ff);color:var(--accent);padding:6px 8px;border-radius:999px;font-weight:800}.report-table-card{margin-bottom:16px}.report-table-wrap{overflow:auto}.report-table{width:100%;border-collapse:collapse;table-layout:fixed;min-width:640px}.report-member-table{min-width:960px}.report-project-table{min-width:620px}.report-priority-table{min-width:430px}.report-table col.c-rank{width:6%}.report-table col.c-member{width:26%}.report-table col.c-team{width:15%}.report-table col.c-metric{width:10%}.report-table col.c-rate{width:13%}.report-table col.p-name{width:43%}.report-table col.p-metric{width:14%}.report-table col.p-rate{width:15%}.report-table col.pr-name{width:40%}.report-table col.pr-metric{width:20%}.report-table th.num{text-align:right}.report-table th,.report-table td{padding:11px 12px;border-bottom:1px solid var(--line);font-size:11px;white-space:nowrap;text-align:left}.report-table th{background:var(--surface-2,#fafbfc);color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.05em}.report-table td.num{text-align:right;font-variant-numeric:tabular-nums}.report-person{display:flex;align-items:center;gap:9px}.report-person>div:last-child{display:flex;flex-direction:column}.report-person small{font-size:9px;color:var(--muted);margin-top:2px}.report-rank{width:24px;height:24px;border-radius:7px;background:var(--surface-2,#f3f4f6);display:grid;place-items:center;font-weight:800;font-size:10px}.report-rate{display:inline-flex;align-items:center;padding:5px 8px;border-radius:999px;font-size:9px;font-weight:800}.report-rate.good{background:#ecfdf3;color:#15803d}.report-rate.mid{background:#eff6ff;color:#1d4ed8}.report-rate.low{background:#fff7ed;color:#b45309}.report-priority{display:inline-flex;align-items:center;padding:5px 8px;border-radius:999px;font-size:9px;font-weight:800}.report-priority.red{background:#fef2f2;color:#b91c1c}.report-priority.orange{background:#fff7ed;color:#b45309}.report-priority.blue{background:#eff6ff;color:#1d4ed8}.report-compare{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:16px}.report-compare>div{border:1px solid var(--line);background:var(--surface-2,#fafbfc);border-radius:12px;padding:14px}.report-compare span{display:block;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.05em;font-weight:800}.report-compare strong{display:block;font-size:18px;margin-top:6px}.report-compare small{display:block;color:var(--muted);font-size:10px;margin-top:4px}.report-note{font-size:10px;color:var(--muted);margin:2px 2px 16px;line-height:1.5}
@media(max-width:1120px){.report-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.report-grid-2{grid-template-columns:1fr}.report-status-body{min-height:0}}
@media(max-width:720px){.report-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.report-filters{align-items:stretch}.report-field{min-width:0;flex:1}.report-reset{margin-left:0}.report-compare{grid-template-columns:1fr}.report-status-body{flex-direction:column}.report-donut{width:150px;height:150px;flex-basis:150px}.report-donut:after{width:94px;height:94px}}
@media print{.sidebar,.topbar,.page-heading,.report-actions,.report-filters{display:none!important}.main-area{margin:0!important}.content-wrap{padding:0!important}.report-print-meta{display:flex;justify-content:space-between;margin-bottom:12px;font-size:11px;font-weight:700}.report-kpis{grid-template-columns:repeat(5,1fr)}.report-grid-2{grid-template-columns:1.3fr .9fr}.card{box-shadow:none!important;break-inside:avoid}.report-table-card{break-inside:auto}.report-note{margin-bottom:0}}

/* v112 exact-preview alignment */
.report-actions .btn{height:40px;padding:0 13px;border-radius:10px;font-size:12px;font-weight:800}
.report-actions .btn.primary{color:#fff}
.report-filters{background:var(--surface);border:1px solid var(--line);box-shadow:0 8px 30px rgba(15,23,42,.06);border-radius:14px}
.report-kpi{background:var(--surface);border:1px solid var(--line);box-shadow:0 8px 30px rgba(15,23,42,.06);border-radius:14px}
.report-card{background:var(--surface);border:1px solid var(--line);box-shadow:0 8px 30px rgba(15,23,42,.06);border-radius:14px}
.report-note{margin:15px 2px 0}


/* v115 — Inbox spacing + message actions moved below bubbles + single timestamp tooltip + replies. */
#headingActions{display:flex!important;align-items:center!important;gap:10px!important;flex-wrap:wrap!important}
#headingActions .btn{margin:0!important}

/* Keep only the custom timestamp tooltip. The bubble no longer uses a native title tooltip. */
#messages.messages .bubble .message-time-tooltip{z-index:2147482000!important}
#messages.messages .bubble{overflow:visible!important}
#messages.messages .message-line,#messages.messages .bubble-stack{overflow:visible!important}

/* Message action buttons belong underneath the message, never above it. */
#messages.messages .bubble-row .msg-actions{position:static!important;display:flex!important;align-items:center!important;gap:4px!important;opacity:0;visibility:hidden;transform:translateY(-2px);transition:opacity .14s ease,transform .14s ease,visibility .14s ease!important;pointer-events:none!important}
#messages.messages .bubble-row:hover .msg-actions,#messages.messages .bubble-row:focus-within .msg-actions{opacity:1!important;visibility:visible!important;transform:none!important;pointer-events:auto!important}
#messages.messages .message-bottom-row{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:8px!important;width:100%!important;margin-top:5px!important;min-height:26px!important}
#messages.messages .message-bottom-row.mine{justify-content:flex-end!important}
#messages.messages .message-bottom-row .msg-actions{margin:0!important;padding:0!important;z-index:30!important}
#messages.messages .message-bottom-row .msg-actions button{position:relative!important;top:auto!important;right:auto!important;left:auto!important;width:26px!important;height:26px!important;min-width:26px!important;border:1px solid var(--line)!important;border-radius:8px!important;background:#fff!important;color:#758399!important;display:grid!important;place-items:center!important;padding:0!important;box-shadow:0 3px 8px rgba(24,57,108,.07)!important}
#messages.messages .message-bottom-row .msg-actions button:hover{color:var(--blue)!important;background:#f5f9ff!important;border-color:#cbd9f4!important}
#messages.messages .message-bottom-row .msg-actions .msg-delete:hover{color:var(--danger)!important;background:#fff4f5!important;border-color:#ffd3da!important}
#messages.messages .message-bottom-row .msg-actions .ui-icon{width:13px!important;height:13px!important}
#messages.messages .message-bottom-row .message-reaction-row{position:static!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;width:auto!important;max-width:100%!important;min-width:0!important;margin:0!important;padding:0!important;z-index:20!important}
#messages.messages .message-bottom-row.mine .message-reaction-row{justify-content:flex-end!important}
#messages.messages .message-bottom-row .message-reactions{pointer-events:auto!important}

/* Remove old floating action positioning from previous versions. */
#messages.messages .bubble-row.mine .msg-actions{top:auto!important;right:auto!important;left:auto!important;bottom:auto!important}

/* Reply quote inside a message. */
#messages.messages .message-reply-preview{display:flex!important;flex-direction:column!important;gap:2px!important;padding:7px 9px!important;margin:0 0 7px!important;border-left:3px solid #8fb3ff!important;background:rgba(33,103,243,.07)!important;border-radius:7px!important;cursor:pointer!important;max-width:100%!important;box-sizing:border-box!important}
#messages.messages .mine .message-reply-preview{background:rgba(255,255,255,.14)!important;border-left-color:rgba(255,255,255,.72)!important}
#messages.messages .message-reply-label{display:flex!important;align-items:center!important;gap:4px!important;font-size:9px!important;font-weight:800!important;color:#4e6fa9!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
#messages.messages .mine .message-reply-label{color:rgba(255,255,255,.9)!important}
#messages.messages .message-reply-label .ui-icon{width:11px!important;height:11px!important;flex:none!important}
#messages.messages .message-reply-text{display:block!important;font-size:10px!important;line-height:1.3!important;color:#66758b!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
#messages.messages .mine .message-reply-text{color:rgba(255,255,255,.78)!important}

.chat-reply-preview{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;padding:9px 13px!important;border-top:1px solid var(--line)!important;background:#f8fbff!important}
.chat-reply-preview-copy{display:flex!important;flex-direction:column!important;min-width:0!important;gap:3px!important}
.chat-reply-preview-copy>span{display:flex!important;align-items:center!important;gap:5px!important;font-size:9px!important;color:var(--blue)!important;font-weight:700!important}
.chat-reply-preview-copy>span .ui-icon{width:12px!important;height:12px!important}
.chat-reply-preview-copy small{display:block!important;max-width:100%!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;color:var(--muted)!important;font-size:9px!important}
.chat-reply-preview-close{flex:none!important;width:28px!important;height:28px!important;border:1px solid var(--line)!important;border-radius:8px!important;background:#fff!important;color:#7b8798!important;display:grid!important;place-items:center!important;padding:0!important}
.chat-reply-preview-close:hover{color:var(--danger)!important;background:#fff4f5!important}
.chat-reply-preview-close .ui-icon{width:13px!important;height:13px!important}
#messages.messages .reply-highlight .bubble{box-shadow:0 0 0 2px rgba(33,103,243,.24),0 5px 16px rgba(33,103,243,.14)!important;transition:box-shadow .18s ease!important}

@media(max-width:620px){
  #headingActions{width:100%!important;gap:8px!important}
  #headingActions .btn{flex:1 1 auto!important}
  #messages.messages .message-bottom-row{margin-top:4px!important}
  #messages.messages .message-bottom-row .msg-actions button{width:24px!important;height:24px!important;min-width:24px!important}
  #messages.messages .message-bottom-row .msg-actions .ui-icon{width:12px!important;height:12px!important}
}

/* v116 — Overview readability + compact task/editor geometry + clean task/comment spacing */
/* Overview: make the existing dashboard readable without changing its layout. */
#view>.kpis .kpi-label{font-size:12px!important}
#view>.kpis .kpi-number{font-size:34px!important}
#view>.kpis .kpi-foot{font-size:10px!important}
#view>.dashboard-grid .panel{padding:20px!important}
#view>.dashboard-grid .panel-title{font-size:16px!important;line-height:1.25!important}
#view>.dashboard-grid .panel-sub{font-size:11px!important;line-height:1.4!important}
#view>.dashboard-grid .metric-box span{font-size:10px!important}
#view>.dashboard-grid .metric-box b{font-size:19px!important}
#view>.dashboard-grid .notice-card strong{font-size:11px!important}
#view>.dashboard-grid .notice-card p{font-size:10px!important;line-height:1.45!important}
#view>.recent-panel .panel-title{font-size:16px!important}
#view>.recent-panel .panel-sub{font-size:11px!important}
#view>.recent-panel .activity-main strong{font-size:12px!important}
#view>.recent-panel .activity-main span{font-size:10px!important}
#view>.recent-panel .status-pill{font-size:9px!important}
#view>.dashboard-grid .chart-x{font-size:10px!important}
#view>.dashboard-grid .chart-labels{font-size:9px!important}

/* Task create/edit modal: compact, with one predictable scroll surface per pane. */
#taskModal{padding:8px!important;overflow:hidden!important;align-items:center!important}
#taskModal .task-modal-shell{width:min(1180px,calc(100vw - 24px))!important;max-height:calc(100vh - 24px)!important;grid-template-columns:minmax(0,1fr) 320px!important;gap:8px!important;overflow:hidden!important}
#taskModal .task-modal-shell>.modal-box{width:auto!important;max-width:none!important;max-height:calc(100vh - 24px)!important;overflow-y:auto!important;overflow-x:hidden!important;padding:14px!important;scrollbar-gutter:stable!important;border-radius:18px!important}
#taskModal .task-modal-shell>.modal-box::-webkit-scrollbar{width:7px}
#taskModal .task-modal-shell>.modal-box::-webkit-scrollbar-thumb{background:#aeb8c7;border-radius:999px;border:2px solid transparent;background-clip:padding-box}
#taskModal .task-modal-shell .modal-head{position:sticky!important;top:-14px!important;z-index:20!important;margin:-14px -14px 12px!important;padding:13px 18px 11px!important;border-radius:17px 17px 0 0!important;box-shadow:0 5px 12px rgba(15,34,67,.05)!important}
#taskModal .task-modal-shell .modal-head h2{font-size:18px!important;line-height:1.2!important}
#taskModal .task-modal-shell .modal-head p{font-size:9px!important;margin-top:4px!important}
#taskModal .task-modal-shell .form-group{margin-bottom:8px!important}
#taskModal .task-modal-shell .form-group>label{font-size:10px!important}
#taskModal .task-modal-shell .task-title-full .form-control{min-height:40px!important;height:40px!important}
#taskModal .task-modal-shell .task-date-row{gap:9px!important}
#taskModal .task-modal-shell .date-control{min-height:40px!important}
#taskModal .task-modal-shell .date-control input{height:40px!important}
#taskModal .task-modal-shell .upload-box.compact{min-height:50px!important;padding:7px 9px!important}
#taskModal .task-modal-shell .upload-box.compact strong{font-size:11px!important}
#taskModal .task-modal-shell .upload-box.compact span{font-size:9px!important}
#taskModal .task-modal-shell .select-menu,
#taskModal .task-modal-shell .multi-picker{margin-top:5px!important}
#taskModal .task-modal-shell .select-trigger,
#taskModal .task-modal-shell .picker-button{min-height:40px!important;height:40px!important;border-radius:10px!important;font-size:10px!important;padding:0 10px!important}
#taskModal .task-modal-shell .editor-wrap{margin-top:5px!important}
#taskModal .task-modal-shell .rich-toolbar{padding:5px!important}
#taskModal .task-modal-shell .rich-toolbar button{min-width:29px!important;height:27px!important}
#taskModal .task-modal-shell .editor{min-height:145px!important;padding:10px!important;font-size:10px!important;line-height:1.55!important}
#taskModal .task-modal-shell .subtask-heading{margin-bottom:5px!important}
#taskModal .task-modal-shell .subtask-heading label{font-size:10px!important}
#taskModal .task-modal-shell .subtask-heading .form-hint{font-size:9px!important}
#taskModal .task-modal-shell .subtask-add{gap:6px!important}
#taskModal .task-modal-shell .subtask-add .form-control{height:38px!important;min-height:38px!important}
#taskModal .task-modal-shell .subtask-add .btn{height:38px!important;padding:0 10px!important;font-size:10px!important}
#taskModal .task-modal-shell .subtask-list{margin-top:7px!important}
#taskModal .task-modal-shell .subtask-item{min-height:42px!important;padding:8px 9px!important;margin-bottom:5px!important}
#taskModal .task-modal-shell .subtask-label{font-size:10px!important}
#taskModal .task-modal-shell .modal-footer{margin-top:10px!important;padding-top:10px!important}
#taskModal .task-modal-shell .modal-footer .btn{min-height:36px!important;height:36px!important;padding:0 11px!important;font-size:10px!important}

/* Keep the comments pane visually tight against the task editor. */
#taskModal .task-modal-shell>.task-comments-side{width:auto!important;min-width:0!important;margin:0!important;height:100%!important;max-height:calc(100vh - 24px)!important;padding:12px!important;border-radius:16px!important;overflow:hidden!important}
#taskModal .task-modal-shell>.task-comments-side .comments-side-head{padding-bottom:9px!important}
#taskModal .task-modal-shell>.task-comments-side .comment-list{padding-right:2px!important}
#taskModal .task-modal-shell>.task-comments-side .comment{padding:9px 2px 10px!important}
#taskModal .task-modal-shell>.task-comments-side .comment-compose{padding-top:9px!important;margin-top:7px!important}

/* Eliminate the old mobile/desktop overflow collision where the shell scrollbar sat over controls. */
@media(max-width:1050px){
  #taskModal{overflow:auto!important;align-items:flex-start!important}
  #taskModal .task-modal-shell{display:block!important;width:min(900px,calc(100vw - 16px))!important;max-height:none!important;overflow:visible!important}
  #taskModal .task-modal-shell>.modal-box{max-height:none!important;overflow:visible!important}
  #taskModal .task-modal-shell>.task-comments-side{height:340px!important;max-height:none!important;margin-top:8px!important}
}
@media(max-width:620px){
  #taskModal{padding:6px!important}
  #taskModal .task-modal-shell{width:calc(100vw - 12px)!important}
  #taskModal .task-modal-shell>.task-comments-side{height:310px!important}
}

/* v117 — task card metadata/tag readability */
.task-card .task-meta{align-items:center!important;gap:8px!important}
.task-card .task-meta .tag{
  font-size:10px!important;
  line-height:1.2!important;
  font-weight:750!important;
  padding:5px 9px!important;
  min-height:24px!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:5px!important;
  white-space:nowrap!important;
}
.task-card .task-meta .tag .ui-icon{width:11px!important;height:11px!important;flex:none!important}
@media(max-width:620px){
  .task-card .task-meta .tag{font-size:9px!important;min-height:23px!important;padding:5px 8px!important}
  .task-card .task-meta .tag .ui-icon{width:10px!important;height:10px!important}
}

/* v118 — global workspace search */
.search-box{position:relative}.search-box:after{content:'↵';font-size:9px;color:#a5afbd;border:1px solid #e4e9f1;border-radius:5px;padding:1px 4px;line-height:1;display:none}@media(min-width:901px){.search-box:after{display:block}.search-box input{padding-right:2px}}
.search-page{padding:0;overflow:hidden}.search-page-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px;border-bottom:1px solid var(--line)}.search-tabs{display:flex;gap:7px;padding:13px 20px;border-bottom:1px solid var(--line);overflow:auto}.search-tab{border:1px solid transparent;background:#f5f8fd;color:#738096;border-radius:9px;padding:7px 10px;font-size:10px;font-weight:800;white-space:nowrap}.search-tab span{margin-left:5px;color:#9ba6b5}.search-tab.active{background:#eef4ff;border-color:#cbdcff;color:var(--blue)}.search-result{width:100%;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:12px;border:0;border-bottom:1px solid #edf1f6;background:#fff;padding:14px 20px;text-align:left;color:var(--ink)}.search-result:hover{background:#f8fbff}.search-result-icon{width:34px;height:34px;border-radius:10px;background:#eef4ff;color:var(--blue);display:grid;place-items:center}.search-result-main{min-width:0}.search-result-main strong{display:block;font-size:12px;font-weight:800}.search-result-main span{display:block;font-size:10px;color:#758297;margin-top:3px}.search-result-main small{display:block;font-size:9px;color:#8c97a8;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.search-result-type{font-size:8px;font-weight:800;color:#78869a;background:#f4f6fa;border-radius:999px;padding:5px 8px;white-space:nowrap}.search-result-arrow{color:#9aa5b4}.search-result-arrow svg{width:15px;height:15px}.search-home{text-align:center;padding:60px 30px}.search-home-icon{width:54px;height:54px;border-radius:16px;background:#eef4ff;color:var(--blue);display:grid;place-items:center;margin:0 auto 15px}.search-home-icon svg{width:25px;height:25px}.search-home h2{margin:0;font-size:20px}.search-home p{color:var(--muted);font-size:12px;margin:8px auto;max-width:520px}.search-shortcuts{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:18px}.search-shortcuts span{font-size:10px;color:#8793a5;background:#f5f7fb;border:1px solid var(--line);padding:7px 10px;border-radius:8px}.recent-searches{margin:28px auto 0;max-width:620px;text-align:left}.recent-search-list{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}.search-chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 10px;font-size:10px;color:#596980;cursor:pointer}.search-chip:hover{border-color:#c6d6f5;color:var(--blue);background:#f8fbff}@media(max-width:620px){.search-result{grid-template-columns:auto minmax(0,1fr) auto}.search-result-type{display:none}.search-page-head{padding:15px}.search-tabs{padding:11px 15px}.search-result{padding:12px 15px}.search-result-main strong{font-size:11px}.search-result-main span{font-size:9px}}

/* v123 — Projects list layout, matching approved HTML preview; header Filter/Export intentionally omitted */
.projects-list-toolbar{background:#fff!important;border:1px solid #e7ebf1!important;box-shadow:0 8px 28px rgba(15,23,42,.055)!important;border-radius:13px!important;padding:13px!important;display:flex!important;align-items:flex-end!important;gap:10px!important;flex-wrap:wrap!important;margin-bottom:16px!important}
.projects-list-toolbar .field{display:flex!important;flex-direction:column!important;gap:5px!important;min-width:145px!important}
.projects-list-toolbar .wide{min-width:260px!important;flex:1!important}
.projects-list-toolbar label,.projects-list-field label{font-size:10px!important;color:#8a92a1!important;font-weight:800!important;text-transform:uppercase!important;letter-spacing:.05em!important}
.projects-list-toolbar input,.projects-list-toolbar select{height:38px!important;border:1px solid #dfe4eb!important;border-radius:9px!important;background:#fff!important;padding:0 10px!important;font-size:12px!important;color:#303847!important;outline:none!important}
.projects-list-field{display:flex!important;flex-direction:column!important;gap:5px!important;min-width:145px!important}
.projects-list-summary{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important;margin-bottom:16px!important}
.projects-list-stat{background:#fff!important;border:1px solid #e7ebf1!important;box-shadow:0 8px 28px rgba(15,23,42,.055)!important;border-radius:12px!important;padding:14px 15px!important}
.projects-list-label{font-size:10px!important;color:#7f8795!important;font-weight:800!important}.projects-list-value{font-size:23px!important;font-weight:850!important;margin-top:5px!important}.projects-list-foot{font-size:10px!important;color:#737c8c!important;margin-top:3px!important}
.projects-list-panel{background:#fff!important;border:1px solid #e7ebf1!important;box-shadow:0 8px 28px rgba(15,23,42,.055)!important;border-radius:14px!important;overflow:hidden!important}
.projects-list-head{padding:14px 16px!important;border-bottom:1px solid #e7ebf1!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:15px!important}.projects-list-title{font-size:14px!important;font-weight:850!important}.projects-list-sub{font-size:11px!important;color:#737c8c!important;margin-top:3px!important}
.projects-view-switch{display:flex!important;border:1px solid #e7ebf1!important;border-radius:9px!important;padding:2px!important;background:#fafbfc!important}.projects-view-switch button{border:0!important;background:transparent!important;border-radius:7px!important;padding:7px 9px!important;color:#747d8b!important;font-size:11px!important;font-weight:750!important}.projects-view-switch button.active{background:#fff!important;box-shadow:0 1px 4px rgba(0,0,0,.06)!important;color:#1d4ed8!important}
.projects-list-table-wrap{overflow:auto!important}.projects-list-table{width:100%!important;border-collapse:collapse!important;table-layout:fixed!important;min-width:980px!important}.projects-list-table th,.projects-list-table td{padding:12px 13px!important;border-bottom:1px solid #eef0f3!important;text-align:left!important;font-size:12px!important;vertical-align:middle!important}.projects-list-table th{font-size:9px!important;text-transform:uppercase!important;letter-spacing:.06em!important;color:#7c8491!important;background:#fafbfc!important;white-space:nowrap!important}.projects-list-table tbody tr{cursor:pointer!important}.projects-list-table tbody tr:hover{background:#fbfcff!important}.projects-list-table tbody tr:last-child td{border-bottom:none!important}.projects-list-table th:nth-child(1){width:31%!important}.projects-list-table th:nth-child(2){width:10%!important}.projects-list-table th:nth-child(3){width:18%!important}.projects-list-table th:nth-child(4){width:11%!important}.projects-list-table th:nth-child(5){width:13%!important}.projects-list-table th:nth-child(6){width:10%!important}.projects-list-table th:nth-child(7){width:7%!important}
.project-list-identity{display:flex!important;align-items:center!important;gap:10px!important;min-width:0!important}.project-list-icon{width:35px!important;height:35px!important;border-radius:10px!important;display:grid!important;place-items:center!important;color:#fff!important;font-size:12px!important;font-weight:900!important;background:linear-gradient(135deg,#2563eb,#60a5fa)!important;flex:none!important}.project-list-name{font-weight:800!important;font-size:12px!important}.project-list-desc{font-size:10px!important;color:#737c8c!important;margin-top:3px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:310px!important}
.project-list-status{display:inline-flex!important;padding:5px 8px!important;border-radius:999px!important;font-size:9px!important;font-weight:850!important;white-space:nowrap!important}.project-list-status.active{background:#eef4ff!important;color:#1d4ed8!important}.project-list-status.complete{background:#ecfdf3!important;color:#15803d!important}
.project-list-progress{min-width:155px!important}.project-list-progress-meta{display:flex!important;justify-content:space-between!important;font-size:10px!important;margin-bottom:5px!important;color:#727b88!important}.project-list-progress-bar{height:7px!important;background:#edf1f5!important;border-radius:99px!important;overflow:hidden!important}.project-list-progress-bar span{display:block!important;height:100%!important;border-radius:99px!important;background:#2563eb!important}
.project-members{display:flex!important;align-items:center!important}.project-members .avatar{width:25px!important;height:25px!important;border-radius:50%!important;border:2px solid #fff!important;background:linear-gradient(135deg,#4f46e5,#06b6d4)!important;display:grid!important;place-items:center!important;color:#fff!important;font-size:8px!important;font-weight:800!important;margin-left:-6px!important;overflow:hidden!important}.project-members .avatar:first-child{margin-left:0!important}.project-members .avatar img{width:100%!important;height:100%!important;object-fit:cover!important}.project-more{width:25px!important;height:25px!important;border-radius:50%!important;background:#f1f3f7!important;color:#6b7280!important;display:grid!important;place-items:center!important;font-size:8px!important;font-weight:800!important;margin-left:-6px!important;border:2px solid #fff!important}
.project-list-actions{display:flex!important;gap:6px!important;justify-content:flex-end!important}.project-list-open,.project-list-more{height:30px!important;border:1px solid #e7ebf1!important;border-radius:8px!important;background:#fff!important;color:#5d6674!important;font-size:11px!important;font-weight:800!important}.project-list-open{padding:0 10px!important;color:#1d4ed8!important;background:#eef4ff!important;border-color:#dbe7ff!important}.project-list-more{width:32px!important;padding:0!important}
.projects-list-footer{display:flex!important;justify-content:space-between!important;align-items:center!important;padding:12px 16px!important;font-size:10px!important;color:#8a92a1!important;border-top:1px solid #e7ebf1!important}.projects-pagination{display:flex!important;gap:5px!important}.projects-page{height:27px!important;min-width:27px!important;padding:0 8px!important;border:1px solid #e7ebf1!important;background:#fff!important;border-radius:7px!important;font-size:10px!important;color:#667080!important}.projects-page.current{background:#2563eb!important;color:#fff!important;border-color:#2563eb!important}
@media(max-width:1000px){.projects-list-summary{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:720px){.projects-list-summary{grid-template-columns:1fr 1fr!important}.projects-list-table{min-width:980px!important}.projects-list-panel{overflow:auto!important}.projects-list-toolbar .field,.projects-list-field,.projects-list-toolbar .wide{min-width:100%!important}}

/* v124 — Projects refinements: remove KPI summary, explicit team selector sizing, 4 overlapping avatars */
.projects-list-summary{display:none!important}
.projects-list-toolbar #projectTeam{min-width:145px!important}
.projects-list-table .project-members{display:flex!important;align-items:center!important;justify-content:flex-start!important;min-width:100px!important;padding-left:6px!important}
.projects-list-table .project-members .avatar,.projects-list-table .project-more{position:relative!important;width:27px!important;height:27px!important;min-width:27px!important;border-radius:50%!important;border:2px solid #fff!important;margin-left:-7px!important;z-index:1!important}
.projects-list-table .project-members .avatar:first-child{margin-left:0!important}
.projects-list-table .project-members .avatar:nth-child(2){z-index:2!important}.projects-list-table .project-members .avatar:nth-child(3){z-index:3!important}.projects-list-table .project-members .avatar:nth-child(4){z-index:4!important}.projects-list-table .project-more{z-index:5!important;background:#f1f3f7!important;color:#6b7280!important;display:grid!important;place-items:center!important;font-size:8px!important;font-weight:800!important}
@media(max-width:720px){.projects-list-toolbar #projectTeam{min-width:100%!important}}

/* v125 — assignee search + project team filter/avatar overlap fixes */
#assigneePicker .picker-search{display:block!important;position:relative!important;z-index:3!important;pointer-events:auto!important}
#assigneeSearchEmpty{display:block!important;padding:14px 10px!important;color:#9aa5b5!important;text-align:center!important;font-size:12px!important}
.projects-list-table .project-members{gap:0!important;padding-left:0!important;overflow:visible!important;position:relative!important}
.projects-list-table .project-members .avatar,.projects-list-table .project-more{position:relative!important;display:grid!important;flex:0 0 27px!important;width:27px!important;height:27px!important;min-width:27px!important;margin-left:-9px!important;border:2px solid #fff!important;z-index:1!important}
.projects-list-table .project-members .avatar:first-child{margin-left:0!important}
.projects-list-table .project-members .avatar:nth-child(2){z-index:2!important}
.projects-list-table .project-members .avatar:nth-child(3){z-index:3!important}
.projects-list-table .project-members .avatar:nth-child(4){z-index:4!important}
.projects-list-table .project-members .project-more{z-index:5!important}

/* v127 — safe assignee search + reliable Projects avatar overlap */
#assigneeOptions .picker-option.assignee-search-hidden{display:none!important}
#assigneeSearchEmpty[hidden]{display:none!important}
#assigneeSearchEmpty{padding:14px 10px!important;color:#9aa5b5!important;text-align:center!important;font-size:12px!important}
.projects-list-table .project-members{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:0!important;min-width:110px!important;padding-left:0!important;overflow:visible!important;position:relative!important;}
.projects-list-table .project-members .avatar,.projects-list-table .project-more{position:relative!important;display:grid!important;flex:0 0 27px!important;width:27px!important;height:27px!important;min-width:27px!important;margin-left:-9px!important;border:2px solid #fff!important;border-radius:50%!important;z-index:1!important;box-sizing:border-box!important;}
.projects-list-table .project-members .avatar:first-child{margin-left:0!important}
.projects-list-table .project-members .avatar:nth-child(2){z-index:2!important}
.projects-list-table .project-members .avatar:nth-child(3){z-index:3!important}
.projects-list-table .project-members .avatar:nth-child(4){z-index:4!important}
.projects-list-table .project-members .project-more{z-index:5!important;background:#f1f3f7!important;color:#6b7280!important;}

/* v128 — assign member usability + projects filtering/search/actions */
#assigneePicker .picker-menu{max-height:420px!important;overflow:hidden!important;display:none}
#assigneePicker.open .picker-menu{display:block!important}
#assigneePicker .picker-menu #assigneeOptions{max-height:315px!important;overflow-y:auto!important;overflow-x:hidden!important}
#assigneePicker .picker-label-actions{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important}
#assigneePicker .assignee-clear-all{border:0!important;background:transparent!important;color:#2167f3!important;font-size:11px!important;font-weight:800!important;padding:4px 6px!important;border-radius:6px!important}
#assigneePicker .assignee-clear-all:hover{background:#eef4ff!important}
.projects-list-table .project-list-actions{display:flex!important;align-items:center!important;gap:6px!important;justify-content:flex-end!important}
.projects-list-table .project-list-open,.projects-list-table .project-list-more{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:5px!important}
.projects-list-table .project-list-open svg,.projects-list-table .project-list-more svg{width:14px!important;height:14px!important}
.projects-list-table .project-list-more{color:#d84b5b!important;background:#fff!important;border-color:#ffd6dc!important}
.projects-list-table .project-members{display:flex!important;align-items:center!important;gap:0!important;position:relative!important;overflow:visible!important;padding-left:0!important;min-width:110px!important}
.projects-list-table .project-members .avatar,.projects-list-table .project-members .project-more{position:relative!important;flex:0 0 27px!important;width:27px!important;height:27px!important;margin-left:-9px!important;border:2px solid #fff!important;border-radius:50%!important;box-sizing:border-box!important;z-index:1!important}
.projects-list-table .project-members .avatar:first-child,.projects-list-table .project-members .project-more:first-child{margin-left:0!important}
.projects-list-table .project-members .avatar:nth-child(2){z-index:2!important}.projects-list-table .project-members .avatar:nth-child(3){z-index:3!important}.projects-list-table .project-members .avatar:nth-child(4){z-index:4!important}.projects-list-table .project-members .project-more{z-index:5!important;background:#f1f3f7!important;color:#6b7280!important;display:grid!important;place-items:center!important;font-size:8px!important;font-weight:800!important}


/* v130 — task share URL + chat task links + project icon-only action */
.task-card .task-foot{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;}
.task-card .task-copy-url{width:32px!important;height:32px!important;min-width:32px!important;display:grid!important;place-items:center!important;border:1px solid #e5ebf4!important;border-radius:9px!important;background:#fff!important;color:#718096!important;padding:0!important;box-shadow:0 4px 12px rgba(25,54,100,.04)!important;transition:.18s ease!important;}
.task-card .task-copy-url:hover{color:#2167f3!important;border-color:#cbd9f4!important;background:#f5f9ff!important;transform:translateY(-1px)!important;}
.task-card .task-copy-url .ui-icon{width:14px!important;height:14px!important;}
.chat-link,.task-chat-link{color:#2167f3!important;text-decoration:underline!important;text-decoration-thickness:1px!important;text-underline-offset:2px!important;overflow-wrap:anywhere!important;word-break:break-word!important;}
.task-chat-link{font-weight:700!important;text-decoration:none!important;background:#eef4ff!important;border:1px solid #dbe7ff!important;border-radius:7px!important;padding:2px 6px!important;display:inline!important;}
.projects-list-table .project-list-open{width:32px!important;min-width:32px!important;padding:0!important;gap:0!important;}
.projects-list-table .project-list-open .ui-icon{width:14px!important;height:14px!important;margin:0!important;}

/* v130 — task card footer: avatars left, copy URL right */
.task-card .task-foot{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;width:100%!important;}
.task-card .task-assignee-side{display:flex!important;align-items:center!important;justify-content:flex-start!important;min-width:0!important;}
.task-card .task-assignee-side .stack{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:0!important;margin:0!important;}
.task-card .task-foot-actions{margin-left:auto!important;display:flex!important;align-items:center!important;justify-content:flex-end!important;flex:0 0 auto!important;}
.task-card .task-copy-url{margin-left:auto!important;}
/* v131 — compact task links in chat */
.task-chat-link{display:inline-block!important;max-width:260px!important;vertical-align:bottom!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;line-height:1.35!important;}
@media(max-width:620px){.task-chat-link{max-width:210px!important;}}


/* v132 — Projects: replace project initials with larger folder icons */
.projects-list-table .project-list-icon.project-folder-icon{width:42px!important;height:42px!important;border-radius:12px!important;display:grid!important;place-items:center!important;flex:none!important;background:#eef4ff!important;color:#2167f3!important;font-size:0!important;}
.projects-list-table .project-list-icon.project-folder-icon .ui-icon{width:21px!important;height:21px!important;min-width:21px!important;min-height:21px!important;}


/* v133 — complete site light/dark mode. Applied last so every page/component inherits correctly. */
html[data-theme="dark"]{
  --bg:#0c1118;--surface:#151b24;--surface-2:#1b2330;--ink:#eef3fa;--muted:#9aa7ba;--line:#293444;
  --blue:#6d9cff;--blue2:#4f7ff0;--cyan:#4ac7ff;--success:#3bd39b;--warning:#f2b34b;--danger:#ff6b7d;
  --shadow:0 20px 60px rgba(0,0,0,.38);--shadow2:0 10px 30px rgba(0,0,0,.28);--panel-glass:rgba(21,27,36,.94);--input-bg:#171e28;--picker-bg:#1a212b;--picker-hover:#242e3b;--picker-text:#eef3fa;
}
html[data-theme="dark"] body{background:var(--bg)!important;color:var(--ink)!important;color-scheme:dark}
html[data-theme="dark"] body:before{background:radial-gradient(circle at 82% 0,rgba(53,104,255,.18),transparent 32%),radial-gradient(circle at 0 70%,rgba(36,183,255,.08),transparent 28%)!important}
html[data-theme="dark"] .sidebar{background:rgba(14,19,26,.92)!important;border-color:var(--line)!important}
html[data-theme="dark"] .workspace-switcher{background:linear-gradient(135deg,#151c26,#10161e)!important;border-color:var(--line)!important;box-shadow:0 8px 20px rgba(0,0,0,.18)!important}
html[data-theme="dark"] .workspace-switcher svg{stroke:#a8b4c7!important}
html[data-theme="dark"] .side-label{color:#8090a7!important}
html[data-theme="dark"] .nav-item{color:#aab5c7!important}
html[data-theme="dark"] .nav-item:hover{background:#1b2430!important;color:#f5f7fb!important}
html[data-theme="dark"] .nav-item.active{background:linear-gradient(90deg,#182b50,#151d2a)!important;color:#8db1ff!important;box-shadow:inset 3px 0 0 var(--blue)!important}
html[data-theme="dark"] .storage{background:var(--surface)!important;border-color:var(--line)!important}
html[data-theme="dark"] .storage-top,html[data-theme="dark"] .storage small{color:var(--muted)!important}
html[data-theme="dark"] .mini-profile{border-color:var(--line)!important}
html[data-theme="dark"] .mini-profile strong,html[data-theme="dark"] .top-user strong,html[data-theme="dark"] .top-user div:nth-child(2) span{color:var(--ink)!important}
html[data-theme="dark"] .mini-profile span,html[data-theme="dark"] .crumbs,html[data-theme="dark"] .crumbs strong{color:var(--muted)!important}
html[data-theme="dark"] .topbar{background:rgba(12,17,24,.84)!important;border-color:var(--line)!important}
html[data-theme="dark"] .crumbs b{color:#566273!important}
html[data-theme="dark"] .search-box,html[data-theme="dark"] .top-icon,html[data-theme="dark"] .icon-btn{background:var(--surface)!important;border-color:var(--line)!important;color:#b8c4d5!important;box-shadow:0 5px 18px rgba(0,0,0,.16)!important}
html[data-theme="dark"] .search-box input{color:var(--ink)!important}
html[data-theme="dark"] .search-box input::placeholder{color:#77869b!important}
html[data-theme="dark"] .notif-count{border-color:var(--surface)!important}
html[data-theme="dark"] .notif-panel,html[data-theme="dark"] .notif-head{background:var(--surface)!important;border-color:var(--line)!important}
html[data-theme="dark"] .notif-head strong,html[data-theme="dark"] .notif-item strong,html[data-theme="dark"] .notification-item b{color:var(--ink)!important}
html[data-theme="dark"] .notif-head span,html[data-theme="dark"] .notification-item span,html[data-theme="dark"] .notification-item small{color:var(--muted)!important}
html[data-theme="dark"] .notification-item{border-color:var(--line)!important}
html[data-theme="dark"] .notification-item:hover{background:#172238!important}
html[data-theme="dark"] .notif-head-actions button:hover{background:#1a2940!important;color:#8db1ff!important}
html[data-theme="dark"] .top-user>span{color:#8190a5!important}
html[data-theme="dark"] .page-heading h1,html[data-theme="dark"] .panel-title,html[data-theme="dark"] .kpi-number,html[data-theme="dark"] .kpi-label{color:var(--ink)!important}
html[data-theme="dark"] .page-heading p,html[data-theme="dark"] .panel-sub,html[data-theme="dark"] .kpi-foot,html[data-theme="dark"] .eyebrow{color:var(--muted)!important}
html[data-theme="dark"] .card,html[data-theme="dark"] .panel,html[data-theme="dark"] .task-card,html[data-theme="dark"] .project-card,html[data-theme="dark"] .daily-task-card,html[data-theme="dark"] .notice-card,html[data-theme="dark"] .kpi{background:var(--surface)!important;border-color:var(--line)!important;color:var(--ink)!important;box-shadow:var(--shadow2)!important}
html[data-theme="dark"] .kpi{background:linear-gradient(145deg,#151d28,#111720)!important}
html[data-theme="dark"] .kpi:after{background:rgba(109,156,255,.05)!important}
html[data-theme="dark"] .task-card{background:linear-gradient(145deg,#171f29,#141b24)!important}
html[data-theme="dark"] .task-card:hover{border-color:#36517a!important}
html[data-theme="dark"] .task-title,html[data-theme="dark"] .task-name,html[data-theme="dark"] .task-card h3,html[data-theme="dark"] .task-card strong{color:var(--ink)!important}
html[data-theme="dark"] .task-desc,html[data-theme="dark"] .task-meta,html[data-theme="dark"] .task-card small{color:var(--muted)!important}
html[data-theme="dark"] .task-card .task-footer,html[data-theme="dark"] .task-card hr{border-color:var(--line)!important}
html[data-theme="dark"] .status-pill,html[data-theme="dark"] .tag-pill,html[data-theme="dark"] .badge{border-color:var(--line)!important}
html[data-theme="dark"] .project-card{background:linear-gradient(145deg,#151d28,#101721)!important;border-color:#253552!important}
html[data-theme="dark"] .project-card:hover{background:linear-gradient(145deg,#182131,#121a26)!important;border-color:#3a5680!important;box-shadow:0 18px 38px rgba(0,0,0,.32)!important}
html[data-theme="dark"] .project-description,html[data-theme="dark"] .project-stat,html[data-theme="dark"] .project-label{color:var(--muted)!important}
html[data-theme="dark"] .project-card h3,html[data-theme="dark"] .project-stat b{color:var(--ink)!important}
html[data-theme="dark"] .project-progress-block{background:#19212c!important;border-color:var(--line)!important}
html[data-theme="dark"] .project-progress{background:#263241!important}
html[data-theme="dark"] .project-members{border-color:var(--line)!important}
html[data-theme="dark"] .project-member-stack .avatar{border-color:var(--surface)!important}
html[data-theme="dark"] .project-member-more{border-color:var(--surface)!important;background:#1b2b48!important;color:#91b6ff!important}
html[data-theme="dark"] .project-card-actions .project-add,html[data-theme="dark"] .project-delete{background:#1b2430!important;border-color:#344256!important;color:#c8d3e2!important}
html[data-theme="dark"] .project-card-actions .project-delete{background:#2a1b20!important;border-color:#5d3038!important;color:#ff8796!important}
html[data-theme="dark"] .project-card-actions .project-add:hover{background:#223047!important}
html[data-theme="dark"] .btn.ghost,html[data-theme="dark"] .btn.secondary,html[data-theme="dark"] .btn:not(.primary):not(.danger){background:var(--surface)!important;border-color:var(--line)!important;color:#c4cfde!important}
html[data-theme="dark"] .btn.danger{background:#2a1b20!important;border-color:#5d3038!important;color:#ff8796!important}
html[data-theme="dark"] .form-control,html[data-theme="dark"] .select-lite,html[data-theme="dark"] .select-trigger,html[data-theme="dark"] .daily-form-grid input,html[data-theme="dark"] .daily-form-grid select,html[data-theme="dark"] .daily-form-grid textarea,html[data-theme="dark"] input,html[data-theme="dark"] textarea,html[data-theme="dark"] select{background:var(--input-bg)!important;border-color:var(--line)!important;color:var(--ink)!important}
html[data-theme="dark"] input::placeholder,html[data-theme="dark"] textarea::placeholder{color:#738197!important}
html[data-theme="dark"] .select-options,html[data-theme="dark"] .picker-menu{background:var(--picker-bg)!important;border-color:var(--line)!important;color:var(--picker-text)!important;box-shadow:0 24px 55px rgba(0,0,0,.42)!important}
html[data-theme="dark"] .select-option{color:var(--picker-text)!important}
html[data-theme="dark"] .select-option:hover,html[data-theme="dark"] .select-option.selected{background:var(--picker-hover)!important;color:#91b6ff!important}
html[data-theme="dark"] .picker-search{background:#20252c!important;color:#f7f7f7!important}
html[data-theme="dark"] .picker-label{color:#9ca8ba!important}
html[data-theme="dark"] .picker-option{color:#eef3fa!important}
html[data-theme="dark"] .picker-option:hover,html[data-theme="dark"] .picker-option.selected{background:#27303b!important}
html[data-theme="dark"] .picker-menu .empty{color:#9aa6b8!important}
html[data-theme="dark"] .upload-box,html[data-theme="dark"] .attachment,html[data-theme="dark"] .subtask-item,html[data-theme="dark"] .pending-sub{background:var(--surface-2)!important;border-color:var(--line)!important;color:var(--ink)!important}
html[data-theme="dark"] .editor,html[data-theme="dark"] .rich-toolbar,html[data-theme="dark"] .wysiwyg-editor,html[data-theme="dark"] .wysiwyg-toolbar{background:var(--surface)!important;border-color:var(--line)!important;color:var(--ink)!important}
html[data-theme="dark"] .wysiwyg-toolbar button{background:#19212b!important;border-color:#344255!important;color:#d8e0ec!important}
html[data-theme="dark"] .subtask-item .fake-check{background:#151a21!important;border-color:#465265!important}
html[data-theme="dark"] .subtask-item .subtask-label{color:#f4f7fb!important}
html[data-theme="dark"] .task-comments-side{background:var(--surface)!important;border-color:var(--line)!important}
html[data-theme="dark"] .task-comments-side .comment-body,html[data-theme="dark"] .task-comments-side .comment-author b{color:var(--ink)!important}
html[data-theme="dark"] .comment p,html[data-theme="dark"] .comment-head span{color:var(--muted)!important}
html[data-theme="dark"] .comment-compose{border-color:var(--line)!important}
html[data-theme="dark"] .modal-box,html[data-theme="dark"] .modal-footer,html[data-theme="dark"] .modal-head{background:var(--surface)!important;border-color:var(--line)!important;color:var(--ink)!important}
html[data-theme="dark"] .modal-box h1,html[data-theme="dark"] .modal-box h2,html[data-theme="dark"] .modal-box h3,html[data-theme="dark"] .modal-box h4,html[data-theme="dark"] .modal-box strong,html[data-theme="dark"] .modal-box label{color:var(--ink)!important}
html[data-theme="dark"] .modal-box p,html[data-theme="dark"] .modal-box .muted,html[data-theme="dark"] .form-hint{color:var(--muted)!important}
html[data-theme="dark"] .chat-list,html[data-theme="dark"] .chat-window{background:var(--surface)!important;border-color:var(--line)!important;color:var(--ink)!important}
html[data-theme="dark"] .chat-user{background:transparent!important;border-color:transparent!important;color:var(--ink)!important}
html[data-theme="dark"] .chat-user:hover{background:#1c2633!important}
html[data-theme="dark"] .chat-user.active{background:#182b50!important;border-color:#2d4d83!important}
html[data-theme="dark"] .chat-user-main strong{color:var(--ink)!important}
html[data-theme="dark"] .chat-user-main span{color:var(--muted)!important}
html[data-theme="dark"] .bubble-row:not(.mine) .bubble,html[data-theme="dark"] .bubble-row:not(.mine) .message-body{background:#202936!important;color:#edf2fa!important;border-color:#303d50!important}
html[data-theme="dark"] .bubble-row.mine .bubble{background:linear-gradient(135deg,#3568d7,#4f7ff0)!important;color:#fff!important}
html[data-theme="dark"] .bubble-time{color:#93a0b4!important}
html[data-theme="dark"] .message-reaction,html[data-theme="dark"] .message-reaction-picker,html[data-theme="dark"] .message-react-btn{background:var(--surface)!important;color:var(--ink)!important;border-color:var(--line)!important}
html[data-theme="dark"] .message-reaction.selected{background:#182b50!important;color:#8fb5ff!important;border-color:#31578f!important}
html[data-theme="dark"] .reply-preview,html[data-theme="dark"] .reply-box,html[data-theme="dark"] .group-system-pill{background:#172235!important;border-color:#2c3a50!important;color:#cbd5e1!important}
html[data-theme="dark"] .message-actions button{background:#1a222d!important;border-color:#334256!important;color:#b9c5d6!important}
html[data-theme="dark"] .search-results,html[data-theme="dark"] .search-result,html[data-theme="dark"] .search-tabs,html[data-theme="dark"] .search-page .card{background:var(--surface)!important;border-color:var(--line)!important;color:var(--ink)!important}
html[data-theme="dark"] .search-result:hover{background:#1b2531!important}
html[data-theme="dark"] .daily-calendar-strip,html[data-theme="dark"] .daily-day{background:var(--surface)!important;border-color:var(--line)!important;color:var(--ink)!important}
html[data-theme="dark"] .daily-day.active{background:#182b50!important;border-color:#31578f!important}
html[data-theme="dark"] .notice-card{background:linear-gradient(135deg,#172235,#141b25)!important;border-color:#2b3b55!important}
html[data-theme="dark"] .empty{background:linear-gradient(145deg,#151d27,#101720)!important;border-color:#344256!important;color:var(--muted)!important}
html[data-theme="dark"] .table-wrap,html[data-theme="dark"] table{background:var(--surface)!important;color:var(--ink)!important}
html[data-theme="dark"] th{background:#18202b!important;color:#96a4b8!important;border-color:var(--line)!important}
html[data-theme="dark"] td{background:var(--surface)!important;color:var(--ink)!important;border-color:var(--line)!important}
html[data-theme="dark"] .pagination .page,html[data-theme="dark"] .page{background:var(--surface)!important;border-color:var(--line)!important;color:#bac6d6!important}
html[data-theme="dark"] .pagination .page.current,html[data-theme="dark"] .page.current{background:var(--blue2)!important;color:#fff!important;border-color:var(--blue2)!important}
html[data-theme="dark"] .toast{background:#182333!important;color:#eef3fa!important;border-color:#31405a!important}
html[data-theme="dark"] .theme-toggle{color:#f6c453!important}
html[data-theme="dark"] .theme-toggle:hover{color:#ffe18b!important;border-color:#4e5f7a!important}
html[data-theme="dark"] .mobile-overlay{background:rgba(0,0,0,.62)!important}
html[data-theme="dark"] ::selection{background:rgba(109,156,255,.35);color:#fff}

/* v133 — auth pages theme toggle */
.theme-toggle-auth{position:absolute;top:16px;right:16px;width:36px;height:36px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--muted);display:grid;place-items:center;cursor:pointer;box-shadow:0 5px 18px rgba(30,57,100,.05)}
.theme-toggle-auth:hover{color:var(--blue);border-color:#bcd0f1}
.auth-shell{position:relative}
html[data-theme="dark"] .auth-shell{color:var(--ink)}
html[data-theme="dark"] .auth-card a:not(.btn){color:#91b6ff}
html[data-theme="dark"] .auth-card .back{color:#9eabbe!important}
html[data-theme="dark"] .auth-card .password button{background:#202833!important;color:#c7d1df!important;border-color:#354255!important}
html[data-theme="dark"] .auth-card .alert{border-color:var(--line)!important}

/* v135 — dark mode visual refinement pass */
html[data-theme="dark"] .kpi-icon{
  background:#1b2432!important;
  color:#91b6ff!important;
  box-shadow:none!important;
  border:1px solid #2d3a4c!important;
}
html[data-theme="dark"] .kpi:nth-child(2) .kpi-icon{background:#182a29!important;color:#5fe0c6!important;border-color:#2b4543!important}
html[data-theme="dark"] .kpi:nth-child(3) .kpi-icon{background:#292342!important;color:#b6a4ff!important;border-color:#413661!important}
html[data-theme="dark"] .kpi:nth-child(4) .kpi-icon{background:#2b241a!important;color:#ffc977!important;border-color:#4a3a25!important}

/* Overview cards / metrics */
html[data-theme="dark"] .metric-box{background:#18202a!important;border:1px solid #263242!important;color:var(--ink)!important}
html[data-theme="dark"] .metric-box span{color:#8f9caf!important}
html[data-theme="dark"] .metric-box b{color:#edf2fa!important}
html[data-theme="dark"] .notice-card{background:#151e29!important;border-color:#2b3a4e!important}
html[data-theme="dark"] .activity-list .activity{border-color:#26313f!important}
html[data-theme="dark"] .activity{color:var(--ink)!important}
html[data-theme="dark"] .activity-icon{background:#1b2940!important;color:#91b6ff!important;border-color:#30405a!important}
html[data-theme="dark"] .activity-main strong{color:#edf2fa!important}
html[data-theme="dark"] .activity-main span{color:#8f9caf!important}
html[data-theme="dark"] .status-pill.new{background:#1b2940!important;color:#91b6ff!important}
html[data-theme="dark"] .status-pill.progress{background:#1a3030!important;color:#5fe0c6!important}
html[data-theme="dark"] .status-pill.review{background:#30271a!important;color:#ffca73!important}
html[data-theme="dark"] .status-pill.completed{background:#173127!important;color:#65dda4!important}
html[data-theme="dark"] .status-pill.backlog{background:#2b2140!important;color:#c3a7ff!important}

/* Tasks — all kanban columns blend into the page background */
html[data-theme="dark"] .kanban-column{
  background:#10161e!important;
  border:1px solid #202a37!important;
  color:var(--ink)!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .kanban-head{background:transparent!important;border-color:#202a37!important}
html[data-theme="dark"] .kanban-list{background:transparent!important}
html[data-theme="dark"] .kanban-column .drop-zone{
  background:#121922!important;
  border-color:#2a3544!important;
  color:#66758a!important;
}
html[data-theme="dark"] .kanban-column:hover{border-color:#2a3b52!important}
html[data-theme="dark"] .kanban-title{color:#e6edf6!important}
html[data-theme="dark"] .count-badge{background:#1b2431!important;color:#c3cfdf!important;border-color:#2b3747!important}

/* Inbox — conversation area must not fall back to a light canvas */
html[data-theme="dark"] .chat-window .chat-body,
html[data-theme="dark"] .chat-window .chat-messages,
html[data-theme="dark"] .chat-window .chat-empty,
html[data-theme="dark"] .chat-window .empty,
html[data-theme="dark"] .chat-window .messages,
html[data-theme="dark"] .chat-messages-wrap{
  background:#151a21!important;
  color:var(--ink)!important;
  border-color:var(--line)!important;
}
html[data-theme="dark"] .chat-window .chat-header{
  background:#151a21!important;
  border-color:var(--line)!important;
}
html[data-theme="dark"] .chat-window .chat-compose{
  background:#151a21!important;
  border-color:var(--line)!important;
}
html[data-theme="dark"] .chat-window .chat-compose input,
html[data-theme="dark"] .chat-window .chat-compose textarea{
  background:#171d25!important;color:var(--ink)!important;border-color:#2e3949!important;
}
html[data-theme="dark"] .chat-window .chat-empty-state,
html[data-theme="dark"] .chat-window .empty-state{
  background:#151a21!important;color:var(--muted)!important;border-color:#283444!important;
}
html[data-theme="dark"] .chat-window .empty-icon{background:#1b2940!important;color:#91b6ff!important;border-color:#30405a!important}

/* Projects list — subdued separators and no member-column underline */
html[data-theme="dark"] .projects-list-panel,
html[data-theme="dark"] .projects-list-toolbar{background:#151a21!important;border-color:#25303e!important;box-shadow:none!important}
html[data-theme="dark"] .projects-list-head{border-color:#25303e!important}
html[data-theme="dark"] .projects-list-table th{background:#171e27!important;color:#7f8ca0!important;border-color:#273241!important}
html[data-theme="dark"] .projects-list-table td{background:#151a21!important;color:var(--ink)!important;border-color:#252f3d!important}
html[data-theme="dark"] .projects-list-table tbody tr:hover td{background:#19222d!important}
html[data-theme="dark"] .projects-list-table td:nth-child(5){border-bottom-color:transparent!important}
html[data-theme="dark"] .projects-list-table tbody tr:last-child td:nth-child(5){border-bottom-color:transparent!important}
html[data-theme="dark"] .project-list-desc{color:#8290a5!important}
html[data-theme="dark"] .project-list-progress-meta{color:#8390a3!important}
html[data-theme="dark"] .project-list-progress-bar{background:#27313e!important}
html[data-theme="dark"] .project-members .avatar{border-color:#151a21!important}
html[data-theme="dark"] .project-more{background:#202833!important;border-color:#151a21!important;color:#b7c3d5!important}
html[data-theme="dark"] .project-list-open{background:#182b4b!important;border-color:#31578f!important;color:#91b6ff!important}
html[data-theme="dark"] .project-list-more{background:#25191d!important;border-color:#5d3038!important;color:#ff8796!important}
html[data-theme="dark"] .projects-list-footer{border-color:#25303e!important}

/* Settings — soften all list separators */
html[data-theme="dark"] .settings-tab{color:#9aa6b8!important}
html[data-theme="dark"] .settings-tab:hover{background:#1c2531!important;color:#c5d0df!important}
html[data-theme="dark"] .settings-tab.active{background:#19222d!important;border-color:#344255!important;color:#91b6ff!important}
html[data-theme="dark"] .member-row{border-bottom-color:#25303e!important}
html[data-theme="dark"] .member-row:last-child{border-bottom-color:transparent!important}
html[data-theme="dark"] .settings-two-column > .card,
html[data-theme="dark"] .settings-page .card,
html[data-theme="dark"] .directory-manager-card{border-color:#25303e!important}
html[data-theme="dark"] .settings-page hr{border-color:#25303e!important}

/* Dropdown option names: gray on hover in dark mode */
html[data-theme="dark"] .select-option:hover,
html[data-theme="dark"] .select-option.selected,
html[data-theme="dark"] .picker-option:hover,
html[data-theme="dark"] .picker-option.selected,
html[data-theme="dark"] .dropdown-item:hover,
html[data-theme="dark"] .menu-option:hover{
  background:#252d37!important;
  color:#b7c0cc!important;
}
html[data-theme="dark"] .select-option:hover .ui-icon,
html[data-theme="dark"] .picker-option:hover .ui-icon{color:#aeb8c6!important}

/* WYSIWYG — sitewide dark editor surface */
html[data-theme="dark"] .editor,
html[data-theme="dark"] .editor-wrap,
html[data-theme="dark"] .rich-toolbar,
html[data-theme="dark"] .wysiwyg-toolbar,
html[data-theme="dark"] .wysiwyg-editor,
html[data-theme="dark"] [contenteditable="true"]{
  background:#151a21!important;
  color:#edf2fa!important;
  border-color:#2b3645!important;
}
html[data-theme="dark"] .rich-toolbar,
html[data-theme="dark"] .wysiwyg-toolbar{background:#171e27!important}
html[data-theme="dark"] .rich-toolbar button,
html[data-theme="dark"] .wysiwyg-toolbar button{
  background:#1c2530!important;
  color:#cbd5e1!important;
  border-color:#344153!important;
}
html[data-theme="dark"] .rich-toolbar button:hover,
html[data-theme="dark"] .wysiwyg-toolbar button:hover{
  background:#252f3b!important;
  color:#aeb8c6!important;
  border-color:#46566d!important;
}
html[data-theme="dark"] .editor:empty:before,
html[data-theme="dark"] .wysiwyg-editor:empty:before{
  color:#738197!important;
}
html[data-theme="dark"] .editor-wrap .editor,
html[data-theme="dark"] .task-modal-shell .editor,
html[data-theme="dark"] .daily-wysiwyg .wysiwyg-editor{
  background:#151a21!important;
}

/* Inputs and dropdowns used by editor/task UI */
html[data-theme="dark"] .editor-wrap,
html[data-theme="dark"] .daily-wysiwyg,
html[data-theme="dark"] .task-editor-main .form-group{color:var(--ink)!important}

/* Generic separators, list rows and table dividers */
html[data-theme="dark"] hr{border-color:#25303e!important}
html[data-theme="dark"] .divider{border-color:#25303e!important}
html[data-theme="dark"] .list-row{border-color:#25303e!important}
html[data-theme="dark"] .table-row{border-color:#25303e!important}

/* v136 — dark-mode detail polish from UI review */
html[data-theme="dark"] .task-card .task-foot{
  border-top-color:#202a37!important;
}
html[data-theme="dark"] .task-card .task-copy-url{
  background:#18202a!important;
  border-color:#2a3544!important;
  color:#9eacbf!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .task-card .task-copy-url:hover{
  background:#202b39!important;
  border-color:#3b4c63!important;
  color:#a9c4ff!important;
}

/* Daily Task history month/year picker */
html[data-theme="dark"] .daily-history-month-title{
  background:#1a222d!important;
  border-color:#2b3747!important;
  color:var(--ink)!important;
}
html[data-theme="dark"] .daily-history-month-title:hover{
  background:#212b38!important;
  border-color:#394a61!important;
}
html[data-theme="dark"] .daily-history-month-title strong,
html[data-theme="dark"] .daily-history-month-title span{
  color:var(--ink)!important;
}
html[data-theme="dark"] .daily-history-month-picker{
  background:#171e27!important;
  border-color:#293444!important;
  box-shadow:0 18px 40px rgba(0,0,0,.32)!important;
}
html[data-theme="dark"] .history-picker-years{
  border-right-color:#293444!important;
}
html[data-theme="dark"] .history-year-btn,
html[data-theme="dark"] .history-month-btn{
  color:#a8b4c6!important;
}
html[data-theme="dark"] .history-year-btn:hover,
html[data-theme="dark"] .history-month-btn:hover{
  background:#252f3c!important;
  color:#b9c3d0!important;
}
html[data-theme="dark"] .history-year-btn.selected,
html[data-theme="dark"] .history-month-btn.selected{
  background:#202e45!important;
  border-color:#38557e!important;
  color:#9bbaff!important;
}

/* Inbox composer and replying state */
html[data-theme="dark"] .chat-compose,
html[data-theme="dark"] .chat-input-wrap{
  background:#151a21!important;
  border-color:#293444!important;
}
html[data-theme="dark"] .chat-compose #message{
  background:#171e27!important;
  border-color:#2b3645!important;
  color:#edf2fa!important;
}
html[data-theme="dark"] .chat-compose #message::placeholder{color:#738197!important}
html[data-theme="dark"] .chat-reply-preview{
  background:#171e27!important;
  border-top-color:#293444!important;
}
html[data-theme="dark"] .chat-reply-preview-copy>span{color:#9bbaff!important}
html[data-theme="dark"] .chat-reply-preview-copy small{color:#8f9caf!important}
html[data-theme="dark"] .chat-reply-preview-close{
  background:#1a222d!important;
  border-color:#303d4f!important;
  color:#aab6c8!important;
}
html[data-theme="dark"] .chat-reply-preview-close:hover{
  background:#251c21!important;
  border-color:#5d3038!important;
  color:#ff8796!important;
}

/* Projects — dark folder icon, create-project surfaces, and member column */
html[data-theme="dark"] .projects-list-table .project-list-icon.project-folder-icon{
  background:#1b2940!important;
  color:#9bbaff!important;
}
html[data-theme="dark"] .project-create-hero{
  background:linear-gradient(135deg,#182233,#151c27)!important;
  border-color:#2a394d!important;
}
html[data-theme="dark"] .project-create-hero strong{color:#edf2fa!important}
html[data-theme="dark"] .project-create-hero span{color:#8f9caf!important}
html[data-theme="dark"] .project-orb{
  background:linear-gradient(135deg,#3568d7,#4f7ff0)!important;
  box-shadow:0 10px 25px rgba(35,71,145,.28)!important;
}
html[data-theme="dark"] .project-create-tip{
  background:#18202a!important;
  border:1px solid #293444!important;
  color:#9aa7ba!important;
}
html[data-theme="dark"] .projects-list-table th:nth-child(5),
html[data-theme="dark"] .projects-list-table td:nth-child(5){
  border-left:0!important;
  border-right:0!important;
  text-align:left!important;
}
html[data-theme="dark"] .projects-list-table td:nth-child(5){
  border-bottom-color:#252f3d!important;
}
html[data-theme="dark"] .projects-list-table .project-members{
  min-height:42px!important;
  align-items:center!important;
  justify-content:flex-start!important;
  padding:0!important;
}
html[data-theme="dark"] .projects-list-table .project-members .avatar,
html[data-theme="dark"] .projects-list-table .project-more{
  border-color:#151a21!important;
}

/* Edit/delete controls and inline editors */
html[data-theme="dark"] .directory-row.editing{
  background:#171e27!important;
  border-bottom-color:#293444!important;
}
html[data-theme="dark"] .directory-row.editing .directory-edit-wrap .form-control{
  background:#151b24!important;
  border-color:#344255!important;
  color:#edf2fa!important;
}
html[data-theme="dark"] .directory-row-actions .icon-btn,
html[data-theme="dark"] .directory-row-actions .danger-icon,
html[data-theme="dark"] .directory-row-actions button{
  background:#1a222d!important;
  border-color:#303d4f!important;
  color:#aeb9c9!important;
}
html[data-theme="dark"] .directory-row-actions .danger-icon,
html[data-theme="dark"] .directory-row-actions .danger-icon:hover{
  background:#251c21!important;
  border-color:#5d3038!important;
  color:#ff8796!important;
}
html[data-theme="dark"] .directory-row-actions .icon-btn:hover{
  background:#222d3a!important;
  border-color:#40546d!important;
  color:#aec5f8!important;
}
html[data-theme="dark"] .directory-delete-warning{
  background:#241b20!important;
  border-color:#5a3038!important;
  color:#caa1a8!important;
}
html[data-theme="dark"] .directory-delete-warning strong{color:#ff9daa!important}
html[data-theme="dark"] .directory-delete-warning span{color:#b58e97!important}
html[data-theme="dark"] .delete-project-overlay .modal-box,
html[data-theme="dark"] .directory-delete-modal,
html[data-theme="dark"] .modal-box.delete-project-modal{
  background:#151b24!important;
  border-color:#293444!important;
  color:var(--ink)!important;
}
html[data-theme="dark"] .delete-project-icon{
  background:#251c21!important;
  color:#ff8796!important;
  border-color:#5d3038!important;
}

/* Settings — editing Teams / Job Titles */
html[data-theme="dark"] .directory-list{
  background:#151b24!important;
  border-color:#293444!important;
}
html[data-theme="dark"] .directory-row{
  border-bottom-color:#293444!important;
}
html[data-theme="dark"] .directory-add input,
html[data-theme="dark"] .directory-add .form-control{
  background:#151b24!important;
  border-color:#2f3b4c!important;
  color:#edf2fa!important;
}

/* Generic modal/edit surfaces that still inherit light backgrounds */
html[data-theme="dark"] .modal-box .edit-row,
html[data-theme="dark"] .modal-box .edit-form,
html[data-theme="dark"] .modal-box .editing,
html[data-theme="dark"] .inline-edit,
html[data-theme="dark"] .edit-panel{
  background:#151b24!important;
  color:var(--ink)!important;
  border-color:#293444!important;
}
html[data-theme="dark"] .modal-box .edit-row input,
html[data-theme="dark"] .modal-box .edit-row select,
html[data-theme="dark"] .modal-box .edit-row textarea,
html[data-theme="dark"] .edit-form input,
html[data-theme="dark"] .edit-form select,
html[data-theme="dark"] .edit-form textarea,
html[data-theme="dark"] .inline-edit input,
html[data-theme="dark"] .inline-edit textarea{
  background:#151b24!important;
  border-color:#2f3b4c!important;
  color:#edf2fa!important;
}

/* v137 — final dark-mode detail pass from screenshot review */
html[data-theme="dark"] .daily-history-month-title,
html[data-theme="dark"] .daily-history-month-title strong,
html[data-theme="dark"] .daily-history-month-title span{
  color:#aeb8c6!important;
}
html[data-theme="dark"] .daily-history-month-title:hover,
html[data-theme="dark"] .daily-history-month-title:hover strong,
html[data-theme="dark"] .daily-history-month-title:hover span{
  color:#c3ccd8!important;
}

/* Task close buttons + member hover text */
html[data-theme="dark"] .modal-box .close,
html[data-theme="dark"] .task-modal-shell .close,
html[data-theme="dark"] .daily-history-modal .close{
  background:#1a222d!important;
  border:1px solid #303d4f!important;
  color:#aeb9c9!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .modal-box .close:hover,
html[data-theme="dark"] .task-modal-shell .close:hover,
html[data-theme="dark"] .daily-history-modal .close:hover{
  background:#232d3a!important;
  border-color:#3c4d63!important;
  color:#d3dce8!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option:hover .member-option-text strong,
html[data-theme="dark"] #inviteOptions .member-picker-row:hover .member-option-text strong,
html[data-theme="dark"] #groupMemberOptions .member-picker-row:hover .member-option-text strong{
  color:#aeb8c6!important;
}

/* Task card separator + copy button */
html[data-theme="dark"] .task-card .task-foot{border-top-color:#202a36!important}
html[data-theme="dark"] .task-card .task-copy-url{
  background:#171e27!important;
  border-color:#2a3543!important;
  color:#9eacbf!important;
}
html[data-theme="dark"] .task-card .task-copy-url:hover{
  background:#202a36!important;
  border-color:#3a4b61!important;
  color:#b7cbef!important;
}

/* Group creation + Add People: all surfaces dark */
html[data-theme="dark"] .group-modal-large .group-selection-panel,
html[data-theme="dark"] .group-modal-large .group-team-option,
html[data-theme="dark"] .group-modal-large #groupName,
html[data-theme="dark"] .group-modal-large .group-member-search,
html[data-theme="dark"] .group-modal-large .group-selection-summary,
html[data-theme="dark"] .group-modal-large #groupMemberOptions,
html[data-theme="dark"] .group-modal-large .group-team-list{
  background:#171e27!important;
  border-color:#2b3645!important;
  color:#edf2fa!important;
}
html[data-theme="dark"] .group-modal-large .group-team-option:hover,
html[data-theme="dark"] .group-modal-large .group-team-option.selected,
html[data-theme="dark"] #inviteOptions .member-picker-row:hover,
html[data-theme="dark"] #groupMemberOptions .member-picker-row:hover{
  background:#242d38!important;
  border-color:#3a4a60!important;
}
html[data-theme="dark"] .group-modal-large .group-selection-summary{
  background:#1b2940!important;
  color:#a4c0ff!important;
}
html[data-theme="dark"] .group-modal-large .group-team-icon{
  background:#1b2940!important;
  color:#9bbaff!important;
}
html[data-theme="dark"] .group-modal-large .member-option-text strong,
html[data-theme="dark"] #inviteOptions .member-option-text strong,
html[data-theme="dark"] #groupMemberOptions .member-option-text strong{
  color:#edf2fa!important;
}
html[data-theme="dark"] .group-modal-large .member-option-text small,
html[data-theme="dark"] #inviteOptions .member-option-text small,
html[data-theme="dark"] #groupMemberOptions .member-option-text small{
  color:#94a2b6!important;
}
html[data-theme="dark"] .group-modal-large .member-check{color:#8eacdf!important}

/* Projects — remove the member-column underline and make all separators subtle */
html[data-theme="dark"] .projects-list-table .project-members{
  border:0!important;
  border-top:0!important;
  border-bottom:0!important;
  box-shadow:none!important;
  background:transparent!important;
  min-height:42px!important;
}
html[data-theme="dark"] .projects-list-table td:nth-child(5),
html[data-theme="dark"] .projects-list-table th:nth-child(5){
  border-left:0!important;
  border-right:0!important;
}
html[data-theme="dark"] .projects-list-table .project-list-status{
  background:#1a2532!important;
  color:#9ebcff!important;
  border:1px solid #2b3b52!important;
}
html[data-theme="dark"] .projects-list-table .project-list-status.complete{
  background:#193329!important;
  color:#71e0ab!important;
  border-color:#28513f!important;
}
html[data-theme="dark"] .projects-list-table .project-list-icon.project-folder-icon{
  background:#1b2940!important;
  color:#a5c2ff!important;
  border:1px solid #2b4266!important;
}
html[data-theme="dark"] .projects-list-table .project-more{
  background:#202833!important;
  border-color:#151a21!important;
  color:#b7c3d5!important;
}

/* Settings — dark icons in Teams / Job Titles */
html[data-theme="dark"] .directory-item-icon{
  background:#1b2940!important;
  border-color:#2b4266!important;
  color:#9bbaff!important;
}
html[data-theme="dark"] .directory-item-icon .ui-icon{color:#9bbaff!important}
html[data-theme="dark"] .directory-row-actions .icon-btn,
html[data-theme="dark"] .directory-row-actions .danger-icon{
  box-shadow:none!important;
}

/* Sitewide WYSIWYG/contenteditable protection */
html[data-theme="dark"] .editor,
html[data-theme="dark"] .editor *:not(a):not(button),
html[data-theme="dark"] .wysiwyg-editor,
html[data-theme="dark"] .wysiwyg-editor *:not(a):not(button),
html[data-theme="dark"] .rich-editor,
html[data-theme="dark"] .rich-editor *:not(a):not(button),
html[data-theme="dark"] [contenteditable="true"]{
  background-color:#151a21!important;
  color:#edf2fa!important;
}
html[data-theme="dark"] [contenteditable="true"]::selection{
  background:rgba(109,156,255,.35)!important;
  color:#fff!important;
}


/* v138 — dark-mode-only task/member/backlog refinements */
html[data-theme="dark"] #assigneeOptions .picker-option:hover .member-option-text strong,
html[data-theme="dark"] #assigneeOptions .picker-option:hover .member-option-text,
html[data-theme="dark"] #inviteOptions .member-picker-row:hover .member-option-text strong,
html[data-theme="dark"] #groupMemberOptions .member-picker-row:hover .member-option-text strong,
html[data-theme="dark"] #groupMemberOptions .member-picker-row:hover .member-option-text{
  color:#20262e!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option:hover .member-option-text small,
html[data-theme="dark"] #inviteOptions .member-picker-row:hover .member-option-text small,
html[data-theme="dark"] #groupMemberOptions .member-picker-row:hover .member-option-text small{
  color:#3b4653!important;
}

/* Task card status/priority/project icons and tags */
html[data-theme="dark"] .task-card .task-type{
  background:#1b2430!important;
  color:#9bbaff!important;
  border:1px solid #2c3949!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .task-card .task-type .ui-icon,
html[data-theme="dark"] .task-card .task-type svg{
  color:#9bbaff!important;
}
html[data-theme="dark"] .task-card .task-meta .tag{
  background:#1d2631!important;
  border-color:#2c3847!important;
  color:#aeb9c9!important;
}
html[data-theme="dark"] .task-card .task-meta .tag.blue{
  background:#1a2940!important;
  border-color:#2c4261!important;
  color:#a8c2ff!important;
}
html[data-theme="dark"] .task-card .task-meta .tag.normal{
  background:#202a35!important;
  color:#adb9c9!important;
}
html[data-theme="dark"] .task-card .task-meta .tag.medium{
  background:#2b261c!important;
  border-color:#493d29!important;
  color:#eac77c!important;
}
html[data-theme="dark"] .task-card .task-meta .tag.high{
  background:#2b2025!important;
  border-color:#4b2d37!important;
  color:#ef9dac!important;
}

/* Daily history date hover text */
html[data-theme="dark"] .daily-history-date:hover,
html[data-theme="dark"] .daily-history-date:hover .daily-history-day,
html[data-theme="dark"] .daily-history-date:hover b,
html[data-theme="dark"] .daily-history-date:hover small{
  color:#20262e!important;
}

/* Backlogs task icon */
html[data-theme="dark"] .backlog-task-icon{
  background:#1b2430!important;
  border:1px solid #2d3a4b!important;
  color:#9bbaff!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .backlog-task-icon svg{color:#9bbaff!important}

/* v139 — dark-mode search + member hover/selection + cinematic theme transition */
html[data-theme="dark"] .search-page,
html[data-theme="dark"] .search-page .search-page-head,
html[data-theme="dark"] .search-page .search-tabs,
html[data-theme="dark"] .search-page #searchResults,
html[data-theme="dark"] .search-page .search-result,
html[data-theme="dark"] .search-page .search-home,
html[data-theme="dark"] .search-page .search-shortcuts,
html[data-theme="dark"] .search-page .recent-searches,
html[data-theme="dark"] .search-page .search-chip,
html[data-theme="dark"] .search-page .search-tab,
html[data-theme="dark"] .search-page .search-home-icon,
html[data-theme="dark"] .search-page .search-shortcuts span{
  background:#151b24!important;
  color:#dbe4ef!important;
  border-color:#293444!important;
}
html[data-theme="dark"] .search-page .search-page-head{background:#151b24!important}
html[data-theme="dark"] .search-page .search-tabs{background:#151b24!important}
html[data-theme="dark"] .search-page .search-result{border-bottom-color:#252f3d!important}
html[data-theme="dark"] .search-page .search-result:hover{background:#1c2530!important}
html[data-theme="dark"] .search-page .search-result-icon,
html[data-theme="dark"] .search-page .search-home-icon{
  background:#1b2940!important;
  color:#9dbbff!important;
  border:1px solid #2b4160!important;
}
html[data-theme="dark"] .search-page .search-result-main strong{color:#edf2fa!important;font-size:13px!important}
html[data-theme="dark"] .search-page .search-result-main span{color:#b1bdce!important;font-size:11px!important}
html[data-theme="dark"] .search-page .search-result-main small{color:#8f9caf!important;font-size:10px!important}
html[data-theme="dark"] .search-page .search-result-type{
  background:#202a35!important;
  color:#b5c1d0!important;
  border:1px solid #303d4d!important;
  font-size:9px!important;
}
html[data-theme="dark"] .search-page .search-result-arrow{color:#91a0b4!important}
html[data-theme="dark"] .search-page .search-tab{background:#1a222c!important;color:#aab6c8!important;border-color:#2a3544!important;font-size:11px!important}
html[data-theme="dark"] .search-page .search-tab.active{background:#203250!important;color:#a8c3ff!important;border-color:#38527a!important}
html[data-theme="dark"] .search-page .search-home h2{font-size:23px!important;color:#eef3f9!important}
html[data-theme="dark"] .search-page .search-home p{font-size:13px!important;color:#9aa7ba!important}
html[data-theme="dark"] .search-page .search-shortcuts span{font-size:11px!important;color:#9aa7ba!important}
html[data-theme="dark"] .search-page .search-chip{color:#b6c1d0!important;background:#1a222d!important}
html[data-theme="dark"] .search-page .search-chip:hover{background:#222d3a!important;color:#a9c3ff!important;border-color:#40546c!important}
html[data-theme="dark"] .search-page .empty{background:#151b24!important;color:#9aa7ba!important}

/* Assign-to picker: dark hover + readable selected names */
html[data-theme="dark"] #assigneeOptions .picker-option,
html[data-theme="dark"] #assigneeOptions .member-picker-row{
  background:#171e27!important;
  color:#dce5f0!important;
  border-color:#293444!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option:hover,
html[data-theme="dark"] #assigneeOptions .member-picker-row:hover{
  background:#202a35!important;
  border-color:#3a4a5f!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option.selected,
html[data-theme="dark"] #assigneeOptions .member-picker-row.selected{
  background:#222d3a!important;
  border-color:#3a4a60!important;
  box-shadow:inset 3px 0 0 #5b83d8!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option .member-option-text strong,
html[data-theme="dark"] #assigneeOptions .member-picker-row .member-option-text strong{
  color:#d7e0eb!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option:hover .member-option-text strong,
html[data-theme="dark"] #assigneeOptions .member-picker-row:hover .member-option-text strong{
  color:#aeb9c7!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option.selected .member-option-text strong,
html[data-theme="dark"] #assigneeOptions .member-picker-row.selected .member-option-text strong{
  color:#b9c4d0!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option .member-option-text small,
html[data-theme="dark"] #assigneeOptions .member-picker-row .member-option-text small{
  color:#8f9caf!important;
}
html[data-theme="dark"] #assigneeOptions .picker-search{
  background:#1b222c!important;
  color:#e1e8f0!important;
  border-color:#2c3949!important;
}
html[data-theme="dark"] #assigneeOptions .assignee-clear-all{color:#a7c0ff!important}

/* Theme transition: soft radial glow + page cross-fade */
html.theme-transition,
html.theme-transition body,
html.theme-transition .app-shell,
html.theme-transition .main-area,
html.theme-transition .sidebar{
  transition:background-color .48s ease,color .48s ease,border-color .48s ease,box-shadow .48s ease!important;
}
html.theme-transition::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:99999;
  background:radial-gradient(circle at 50% 42%,rgba(255,255,255,.32),rgba(98,141,255,.06) 28%,transparent 58%);
  opacity:0;
  animation:xentraThemeFlash .62s cubic-bezier(.2,.75,.25,1);
}
@keyframes xentraThemeFlash{
  0%{opacity:0;transform:scale(.84)}
  28%{opacity:.9;transform:scale(1)}
  100%{opacity:0;transform:scale(1.12)}
}

/* v139 — final dark-mode polish */
html[data-theme="dark"] .search-page .card,
html[data-theme="dark"] .search-page .search-results,
html[data-theme="dark"] .search-page #searchResults,
html[data-theme="dark"] .search-page .search-result,
html[data-theme="dark"] .search-page .search-tabs,
html[data-theme="dark"] .search-page .search-tab,
html[data-theme="dark"] .search-page .search-chip,
html[data-theme="dark"] .search-page .search-shortcuts span,
html[data-theme="dark"] .search-page .search-home,
html[data-theme="dark"] .search-page .search-home-icon{
  background-color:#151b24!important;
  background-image:none!important;
  color:#dbe4ef!important;
}
html[data-theme="dark"] .search-page .search-result{border-bottom:1px solid #252e3b!important}
html[data-theme="dark"] .search-page .search-result:hover{background:#1d2631!important}
html[data-theme="dark"] .search-page .search-result-icon{background:#1b2940!important;border-color:#2c4160!important;color:#9dbbff!important}
html[data-theme="dark"] .search-page .search-home-icon{background:#1b2940!important;border-color:#2c4160!important}

html[data-theme="dark"] #assigneeOptions .picker-option:hover,
html[data-theme="dark"] #assigneeOptions .member-picker-row:hover{
  background:#202a35!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option.selected,
html[data-theme="dark"] #assigneeOptions .member-picker-row.selected{
  background:#202a35!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option.selected .member-option-text strong,
html[data-theme="dark"] #assigneeOptions .member-picker-row.selected .member-option-text strong{
  color:#b9c4d0!important;
}

/* Ensure the theme animation is visible on the entire application surface. */
html.theme-transition body,
html.theme-transition .app-shell,
html.theme-transition .sidebar,
html.theme-transition .main-area,
html.theme-transition .topbar,
html.theme-transition .content-wrap,
html.theme-transition .card,
html.theme-transition .modal-box{
  transition:background-color .48s ease,color .48s ease,border-color .48s ease,box-shadow .48s ease!important;
}


/* v140 — final dark-mode refinements + theme transition anchored to toggle */
.brand img.logo-light{display:block}
.brand img.logo-dark{display:none}
html[data-theme="dark"] .brand img.logo-light{display:none!important}
html[data-theme="dark"] .brand img.logo-dark{display:block!important}

/* Create/Edit Task → Assign members */
html[data-theme="dark"] #assigneeOptions .picker-option,
html[data-theme="dark"] #assigneeOptions .member-picker-row{
  transition:background-color .18s ease,border-color .18s ease,color .18s ease!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option:hover,
html[data-theme="dark"] #assigneeOptions .member-picker-row:hover{
  background:#1e2732!important;
  border-color:#344255!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option:hover .member-option-text strong,
html[data-theme="dark"] #assigneeOptions .member-picker-row:hover .member-option-text strong{
  color:#c2ccd8!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option.selected,
html[data-theme="dark"] #assigneeOptions .member-picker-row.selected{
  background:#202a36!important;
  border-color:#3a4a5f!important;
  box-shadow:inset 3px 0 0 #6b92e8!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option.selected .member-option-text strong,
html[data-theme="dark"] #assigneeOptions .member-picker-row.selected .member-option-text strong{
  color:#bcc6d2!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option.selected .member-option-text small,
html[data-theme="dark"] #assigneeOptions .member-picker-row.selected .member-option-text small{
  color:#8997aa!important;
}

/* Saved + pending subtasks: consistent dark edit/delete controls, including nested rows */
html[data-theme="dark"] .subtask-edit-overlay{background:rgba(3,8,15,.74)!important}
html[data-theme="dark"] .subtask-edit-modal{background:#121923!important;border-color:#2b3747!important;box-shadow:0 24px 70px rgba(0,0,0,.55)!important;color:#e4ebf4!important}
html[data-theme="dark"] .subtask-edit-head,
html[data-theme="dark"] .subtask-edit-footer{border-color:#2a3544!important}
html[data-theme="dark"] .subtask-edit-modal label{color:#aab5c5!important}
html[data-theme="dark"] .subtask-edit-modal .form-control{background:#1a222d!important;color:#e1e8f0!important;border-color:#303c4d!important}
html[data-theme="dark"] .subtask-edit-modal .btn.ghost{background:#19212c!important;color:#b7c2d0!important;border-color:#303c4d!important}
html[data-theme="dark"] .subtask-edit-modal .subtask-edit-close{background:#1b2430!important;color:#aeb9c8!important;border-color:#303c4d!important}
html[data-theme="dark"] #subtasks .subtask-item{background:#151d27!important;border-color:#2a3544!important;color:#dce4ee!important}
html[data-theme="dark"] #subtasks .subtask-item[data-depth]:not([data-depth="0"]){background:#121a24!important;border-left-color:#3a4a5f!important}
html[data-theme="dark"] #subtasks .subtask-action{background:#19222d!important;color:#aeb9c8!important;border-color:#303c4d!important}
html[data-theme="dark"] #subtasks .subtask-action:hover{background:#222d3a!important;color:#c5d3e4!important;border-color:#40516a!important}
html[data-theme="dark"] #subtasks .subtask-action.danger:hover{background:#2a1e23!important;color:#ed9ba8!important;border-color:#5a343c!important}
html[data-theme="dark"] #subtasks .subtask-move-group{background:#151e28!important;border-color:#303c4d!important}

/* Projects / settings member secondary line now displays team */
html[data-theme="dark"] .member-main span{color:#7f8da2!important}

/* Magic UI-style View Transitions API reveal, centered on the actual theme toggle */
@supports (view-transition-name:root){
  ::view-transition-group(root),
  ::view-transition-image-pair(root){animation-duration:560ms;animation-timing-function:cubic-bezier(.22,.8,.22,1)}
  ::view-transition-old(root){animation:none}
  ::view-transition-new(root){
    animation:none;
    clip-path:circle(0 at var(--theme-origin-x) var(--theme-origin-y));
  }
  html[data-theme="light"]::view-transition-new(root){
    animation:xentraThemeRevealIn 560ms cubic-bezier(.22,.8,.22,1) both;
  }
  html[data-theme="dark"]::view-transition-new(root){
    animation:xentraThemeRevealIn 560ms cubic-bezier(.22,.8,.22,1) both;
  }
  @keyframes xentraThemeRevealIn{
    from{clip-path:circle(0 at var(--theme-origin-x) var(--theme-origin-y))}
    to{clip-path:circle(150vmax at var(--theme-origin-x) var(--theme-origin-y))}
  }
}

/* Fallback for browsers without View Transitions API */
html.theme-transition,
html.theme-transition body,
html.theme-transition .app-shell,
html.theme-transition .main-area,
html.theme-transition .sidebar,
html.theme-transition .topbar,
html.theme-transition .content-wrap,
html.theme-transition .card,
html.theme-transition .modal-box{
  transition:background-color .48s ease,color .48s ease,border-color .48s ease,box-shadow .48s ease!important;
}

/* Project status chips are dark in dark mode while staying readable */
html[data-theme="dark"] .projects-list-table .status-pill.completed,
html[data-theme="dark"] .projects-list-table .status-pill.active,
html[data-theme="dark"] .projects-list-table .status-pill.progress,
html[data-theme="dark"] .projects-list-table .status-pill.review{
  background:#1c2632!important;
  border-color:#334254!important;
  color:#b9c7d8!important;
}
html[data-theme="dark"] .projects-list-table .status-pill.completed{color:#88d8b3!important}
html[data-theme="dark"] .projects-list-table .status-pill.active{color:#9dbdff!important}


/* v141 — dark-mode member picker, subtask editor, toast and settings member identity refinements */
html[data-theme="dark"] #assigneeOptions .picker-option:hover,
html[data-theme="dark"] #assigneeOptions .member-picker-row:hover{
  background:#202a36!important;
  color:#d8e1ec!important;
  border-color:#334155!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option:hover .member-option-text strong,
html[data-theme="dark"] #assigneeOptions .member-picker-row:hover .member-option-text strong{
  color:#dbe4ef!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option:hover .member-option-text small,
html[data-theme="dark"] #assigneeOptions .member-picker-row:hover .member-option-text small{
  color:#91a0b3!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option.selected,
html[data-theme="dark"] #assigneeOptions .member-picker-row.selected{
  background:#202a36!important;
  border-color:#3a4a5f!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option.selected .member-option-text strong,
html[data-theme="dark"] #assigneeOptions .member-picker-row.selected .member-option-text strong{
  color:#c5cfdb!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option.selected .member-option-text small,
html[data-theme="dark"] #assigneeOptions .member-picker-row.selected .member-option-text small{
  color:#8d9bad!important;
}

/* Subtask editor footer and every related surface stay dark. */
html[data-theme="dark"] .subtask-edit-footer{
  background:#121923!important;
  border-top-color:#2a3544!important;
}
html[data-theme="dark"] .subtask-edit-footer .btn.ghost{
  background:#1a232e!important;
  border-color:#344153!important;
  color:#b9c5d3!important;
}
html[data-theme="dark"] .subtask-edit-footer .btn.ghost:hover{
  background:#232e3b!important;
  color:#d5deea!important;
}
html[data-theme="dark"] .subtask-edit-modal input,
html[data-theme="dark"] .subtask-edit-modal textarea,
html[data-theme="dark"] .subtask-edit-modal select{
  background:#1a222d!important;
  color:#e0e7ef!important;
  border-color:#303c4d!important;
}
html[data-theme="dark"] .subtask-edit-modal input::placeholder,
html[data-theme="dark"] .subtask-edit-modal textarea::placeholder{
  color:#7f8da0!important;
}

/* Settings member list should show username beneath the member name. */
html[data-theme="dark"] .member-main span{
  color:#8b98aa!important;
}

/* Task update / status notifications: top-center, larger and more noticeable. */
.toast{
  top:22px!important;
  bottom:auto!important;
  right:50%!important;
  transform:translateX(50%)!important;
  max-width:min(520px,calc(100vw - 36px))!important;
  min-width:220px!important;
  padding:14px 20px!important;
  border-radius:14px!important;
  text-align:center!important;
  font-size:12px!important;
  line-height:1.35!important;
  font-weight:800!important;
  letter-spacing:.01em!important;
  box-shadow:0 18px 45px rgba(0,0,0,.26)!important;
}
.toast.show{animation:toastInTop .38s cubic-bezier(.2,.8,.2,1)!important}
@keyframes toastInTop{
  from{opacity:0;transform:translate(50%,-12px) scale(.96)}
  to{opacity:1;transform:translate(50%,0) scale(1)}
}
html[data-theme="dark"] .toast{
  background:#1a2431!important;
  color:#e7edf5!important;
  border:1px solid #3a4a5d!important;
}

/* Slower, smoother theme reveal originating from the actual toggle. */
@supports (view-transition-name:root){
  ::view-transition-group(root),
  ::view-transition-image-pair(root){
    animation-duration:900ms!important;
    animation-timing-function:cubic-bezier(.16,1,.3,1)!important;
  }
  ::view-transition-new(root){
    animation:none!important;
  }
  html[data-theme="light"]::view-transition-new(root),
  html[data-theme="dark"]::view-transition-new(root){
    animation:xentraThemeRevealIn141 900ms cubic-bezier(.16,1,.3,1) both!important;
  }
  @keyframes xentraThemeRevealIn141{
    from{clip-path:circle(0 at var(--theme-origin-x) var(--theme-origin-y))}
    45%{clip-path:circle(65vmax at var(--theme-origin-x) var(--theme-origin-y))}
    100%{clip-path:circle(160vmax at var(--theme-origin-x) var(--theme-origin-y))}
  }
}
html.theme-transition,
html.theme-transition body,
html.theme-transition .app-shell,
html.theme-transition .main-area,
html.theme-transition .sidebar,
html.theme-transition .topbar,
html.theme-transition .content-wrap,
html.theme-transition .card,
html.theme-transition .modal-box{
  transition:background-color .75s cubic-bezier(.16,1,.3,1),color .75s cubic-bezier(.16,1,.3,1),border-color .75s cubic-bezier(.16,1,.3,1),box-shadow .75s cubic-bezier(.16,1,.3,1)!important;
}


/* v145 — final dark-mode task picker, toast and uninterrupted theme transition */
html[data-theme="dark"] #assigneeOptions .picker-option.selected,
html[data-theme="dark"] #assigneeOptions .member-picker-row.selected{
  background:#202a36!important;
  border-color:#334155!important;
  box-shadow:none!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option.selected .member-option-text strong,
html[data-theme="dark"] #assigneeOptions .member-picker-row.selected .member-option-text strong{
  color:#aeb9c7!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option.selected .member-option-text small,
html[data-theme="dark"] #assigneeOptions .member-picker-row.selected .member-option-text small{
  color:#8492a5!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option:hover,
html[data-theme="dark"] #assigneeOptions .member-picker-row:hover{
  background:#242f3c!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option:hover .member-option-text strong,
html[data-theme="dark"] #assigneeOptions .member-picker-row:hover .member-option-text strong{
  color:#aeb9c7!important;
}

/* Professional task update toast: bottom-right, compact and readable. */
.toast{
  top:auto!important;
  right:22px!important;
  bottom:22px!important;
  left:auto!important;
  transform:none!important;
  min-width:0!important;
  max-width:min(360px,calc(100vw - 32px))!important;
  padding:11px 14px!important;
  border-radius:12px!important;
  text-align:left!important;
  font-size:10px!important;
  line-height:1.35!important;
  font-weight:700!important;
  letter-spacing:0!important;
  box-shadow:0 16px 38px rgba(5,12,24,.28)!important;
  border:1px solid rgba(127,145,170,.28)!important;
}
.toast.show{animation:toastInBottom142 .32s cubic-bezier(.22,.8,.22,1)!important}
@keyframes toastInBottom142{
  from{opacity:0;transform:translateY(10px) scale(.98)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
html[data-theme="dark"] .toast{
  background:#182230!important;
  color:#dce5ef!important;
  border-color:#344256!important;
}
html[data-theme="light"] .toast{
  background:#ffffff!important;
  color:#26344b!important;
  border-color:#dce4ee!important;
}

/* Continuous, slow theme reveal. Keep the old snapshot hidden while the new theme expands. */
@supports (view-transition-name:root){
  ::view-transition-group(root),
  ::view-transition-image-pair(root){
    animation-duration:1600ms!important;
    animation-timing-function:cubic-bezier(.22,.75,.18,1)!important;
  }
  ::view-transition-old(root){animation:none!important;opacity:1!important}
  ::view-transition-new(root){
    animation:none!important;
    clip-path:circle(0 at var(--theme-origin-x) var(--theme-origin-y));
  }
  html[data-theme="light"]::view-transition-new(root),
  html[data-theme="dark"]::view-transition-new(root){
    animation:xentraThemeRevealIn142 1600ms cubic-bezier(.22,.75,.18,1) both!important;
  }
  @keyframes xentraThemeRevealIn142{
    from{clip-path:circle(0 at var(--theme-origin-x) var(--theme-origin-y))}
    to{clip-path:circle(250vmax at var(--theme-origin-x) var(--theme-origin-y))}
  }
}
/* Non-View-Transition fallback remains smooth instead of jumping. */
html.theme-transition,
html.theme-transition body,
html.theme-transition .app-shell,
html.theme-transition .main-area,
html.theme-transition .sidebar,
html.theme-transition .topbar,
html.theme-transition .content-wrap,
html.theme-transition .card,
html.theme-transition .modal-box,
html.theme-transition input,
html.theme-transition select,
html.theme-transition textarea,
html.theme-transition button{
  transition:background-color 1.6s cubic-bezier(.22,.75,.18,1),color 1.6s cubic-bezier(.22,.75,.18,1),border-color 1.6s cubic-bezier(.22,.75,.18,1),box-shadow 1.6s cubic-bezier(.22,.75,.18,1)!important;
}

/* v145 — professional toast icons, universal delete confirmations, report controls */
.toast{display:flex!important;align-items:center!important;gap:10px!important;overflow:hidden!important}
.toast-icon{width:28px;height:28px;flex:0 0 28px;border-radius:9px;display:grid;place-items:center;background:rgba(255,255,255,.09);color:inherit}
.toast-icon .ui-icon{width:15px;height:15px}
.toast-message{min-width:0;display:block}
html[data-theme="dark"] .toast-icon{background:#243145;color:#8db4ff}
html[data-theme="light"] .toast-icon{background:#edf3ff;color:#2563eb}
.toast[data-bad="1"] .toast-icon{background:rgba(255,80,95,.14);color:#ff7b88}

.action-confirm-overlay{background:rgba(3,7,14,.72)!important;backdrop-filter:blur(7px)!important}
.action-confirm-modal{position:relative!important;width:min(450px,calc(100vw - 28px))!important;max-width:450px!important;padding:24px!important;border-radius:18px!important;background:var(--surface)!important;border:1px solid var(--line)!important;box-shadow:0 30px 90px rgba(0,0,0,.34)!important}
.action-confirm-icon{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:#2b1f23;color:#ff7f8d;margin-bottom:14px}
.action-confirm-icon .ui-icon{width:22px;height:22px}
.action-confirm-content h2{margin:2px 0 8px;font-size:18px;line-height:1.25;color:var(--ink)}
.action-confirm-content p{margin:0;color:var(--muted);font-size:12px;line-height:1.55;max-width:390px}
.action-confirm-close{position:absolute;right:18px;top:18px}
.action-confirm-footer{margin-top:22px;padding:0!important;background:transparent!important;border-top:1px solid var(--line)!important;padding-top:16px!important}
.action-confirm-submit{min-width:132px;justify-content:center}
html[data-theme="light"] .action-confirm-overlay{background:rgba(8,14,28,.36)!important}
html[data-theme="light"] .action-confirm-modal{box-shadow:0 26px 70px rgba(18,38,70,.20)!important}
html[data-theme="light"] .action-confirm-icon{background:#fff0f2;color:#dc364d}

/* All report selects use the same themed control family as Status. */
.report-filters select{appearance:none!important;background:var(--input-bg)!important;color:var(--ink)!important;border:1px solid var(--line)!important;border-radius:10px!important;min-height:42px!important;padding:0 34px 0 12px!important;font-size:12px!important;font-weight:700!important;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%)!important;background-position:calc(100% - 15px) 17px,calc(100% - 10px) 17px!important;background-size:5px 5px,5px 5px!important;background-repeat:no-repeat!important}
html[data-theme="dark"] .report-filters select option{background:#171d25;color:#edf2fa}
html[data-theme="dark"] .report-filters select:hover{border-color:#3c4a5d!important;background-color:#1a212b!important}

/* Stronger dark-mode protection for native dropdowns, modal editors and delete surfaces. */
html[data-theme="dark"] select,html[data-theme="dark"] select option{color-scheme:dark}
html[data-theme="dark"] .modal-box input,html[data-theme="dark"] .modal-box textarea,html[data-theme="dark"] .modal-box select{background:var(--input-bg)!important;color:var(--ink)!important;border-color:var(--line)!important}
html[data-theme="dark"] .modal-box .form-control:focus,html[data-theme="dark"] .modal-box select:focus{box-shadow:0 0 0 3px rgba(70,120,220,.16)!important}

/* v145 — unified dropdown appearance */
select{
  appearance:none!important;
  -webkit-appearance:none!important;
  background-color:var(--input-bg,#fff)!important;
  color:var(--ink,#24344d)!important;
  border:1px solid var(--line,#dfe4eb)!important;
  border-radius:12px!important;
  min-height:44px!important;
  padding:0 38px 0 12px!important;
  font-size:12px!important;
  font-weight:700!important;
  line-height:1.2!important;
  outline:none!important;
  cursor:pointer!important;
  background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%)!important;
  background-position:calc(100% - 16px) 18px,calc(100% - 11px) 18px!important;
  background-size:5px 5px,5px 5px!important;
  background-repeat:no-repeat!important;
  transition:background-color .2s,border-color .2s,color .2s,box-shadow .2s!important;
}
select:hover,select:focus{
  border-color:#759bea!important;
  box-shadow:0 0 0 3px rgba(57,109,224,.10)!important;
}
select option{background:#fff;color:#24344d}
html[data-theme="dark"] select{background-color:var(--input-bg,#171d25)!important;color:var(--ink,#edf2fa)!important;border-color:var(--line,#293241)!important}
html[data-theme="dark"] select:hover,html[data-theme="dark"] select:focus{background-color:#1b222c!important;border-color:#43516a!important;box-shadow:0 0 0 3px rgba(70,120,220,.16)!important}
html[data-theme="dark"] select option{background:#171d25;color:#edf2fa}
html[data-theme="dark"] select option:hover{background:#303030;color:#aab5c4}

/* Keep assignment picker visually aligned with all dropdowns. */
html[data-theme="dark"] #assigneeOptions .picker-option:hover,
html[data-theme="dark"] #assigneeOptions .member-picker-row:hover{
  background:#252e39!important;
}
html[data-theme="dark"] #assigneeOptions .picker-option:hover .member-option-text strong,
html[data-theme="dark"] #assigneeOptions .member-picker-row:hover .member-option-text strong{
  color:#aeb9c7!important;
}


/* v145 — Work Report range filters, theme/hover polish, password eyes, and toast fix */
/* Status notification: no icon tile/background and only show while active. */
.toast{display:none!important;}
.toast.show{display:flex!important;}
.toast-icon{background:transparent!important;border:0!important;width:20px!important;height:20px!important;flex:0 0 20px!important;padding:0!important;}
.toast-icon .ui-icon{width:17px!important;height:17px!important;}
html[data-theme="dark"] .toast-icon,
html[data-theme="light"] .toast-icon{background:transparent!important;color:inherit!important;}

/* Profile sidebar / top-right hover in dark mode. */
html[data-theme="dark"] .mini-profile:hover,
html[data-theme="dark"] .top-user:hover{
  background:#202a36!important;
  color:#aeb9c7!important;
  box-shadow:0 7px 18px rgba(0,0,0,.18)!important;
}
html[data-theme="dark"] .mini-profile:hover strong,
html[data-theme="dark"] .top-user:hover strong{color:#c7d1de!important;}
html[data-theme="dark"] .mini-profile:hover span,
html[data-theme="dark"] .top-user:hover span{color:#8796a9!important;}

/* Daily Task priority surfaces. */
html[data-theme="dark"] .daily-task-meta .tag,
html[data-theme="dark"] .daily-task-card .tag{
  background:#202a35!important;
  border:1px solid #334255!important;
  color:#aebbd0!important;
}
html[data-theme="dark"] .daily-task-meta .tag.high,
html[data-theme="dark"] .daily-task-card .tag.high{background:#2d2325!important;color:#ff9ca8!important;border-color:#513237!important;}
html[data-theme="dark"] .daily-task-meta .tag.medium,
html[data-theme="dark"] .daily-task-card .tag.medium{background:#2c281f!important;color:#f6c878!important;border-color:#4d412b!important;}
html[data-theme="dark"] .daily-task-meta .tag.normal,
html[data-theme="dark"] .daily-task-card .tag.normal{background:#202a35!important;color:#aebbd0!important;border-color:#334255!important;}

/* Unified Work Report dropdowns. */
.report-filters{display:grid!important;grid-template-columns:repeat(5,minmax(150px,1fr))!important;gap:12px!important;align-items:end!important;padding:14px!important;}
.report-field{min-width:0!important;display:flex!important;flex-direction:column!important;gap:6px!important;}
.report-field>label{font-size:9px!important;color:var(--muted)!important;font-weight:800!important;letter-spacing:.07em!important;text-transform:uppercase!important;}
.report-filters .select-menu{width:100%!important;position:relative!important;}
.report-filters .select-trigger{width:100%!important;min-height:44px!important;background:var(--input-bg,#fff)!important;color:var(--ink)!important;border:1px solid var(--line)!important;border-radius:12px!important;padding:0 12px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;font-size:11px!important;font-weight:750!important;box-shadow:none!important;}
.report-filters .select-current{display:flex!important;align-items:center!important;gap:8px!important;min-width:0!important;}
.report-filters .select-current .ui-icon{width:15px!important;height:15px!important;flex:none!important;color:var(--blue)!important;}
.report-filters .select-trigger>.ui-icon{width:15px!important;height:15px!important;color:var(--muted)!important;flex:none!important;}
.report-filters .select-options{display:none!important;position:absolute!important;z-index:120!important;left:0!important;right:0!important;top:calc(100% + 6px)!important;padding:6px!important;border:1px solid var(--line)!important;border-radius:12px!important;background:var(--surface)!important;box-shadow:0 20px 45px rgba(4,9,18,.24)!important;max-height:260px!important;overflow:auto!important;}
.report-filters .select-menu.open .select-options{display:block!important;animation:pop .16s ease!important;}
.report-filters .select-option{width:100%!important;display:flex!important;align-items:center!important;gap:8px!important;border:0!important;background:transparent!important;color:var(--muted)!important;border-radius:9px!important;padding:10px!important;font-size:10px!important;text-align:left!important;}
.report-filters .select-option:hover{background:var(--surface-2)!important;color:#6f7d91!important;}
.report-filters .select-option.selected{background:#edf3ff!important;color:var(--blue)!important;font-weight:800!important;}
html[data-theme="dark"] .report-filters .select-trigger{background:#171e27!important;border-color:#2b3747!important;color:#e2e8f0!important;}
html[data-theme="dark"] .report-filters .select-options{background:#151c25!important;border-color:#2b3747!important;box-shadow:0 24px 55px rgba(0,0,0,.42)!important;}
html[data-theme="dark"] .report-filters .select-option{color:#9eacbe!important;}
html[data-theme="dark"] .report-filters .select-option:hover{background:#242e39!important;color:#aeb9c7!important;}
html[data-theme="dark"] .report-filters .select-option.selected{background:#202d3c!important;color:#a8c2ff!important;}
@media(max-width:1100px){.report-filters{grid-template-columns:repeat(3,minmax(0,1fr))!important;}}
@media(max-width:700px){.report-filters{grid-template-columns:1fr!important;}}

/* Auth password fields use an eye icon rather than a text button. */
.password{position:relative!important;display:flex!important;align-items:center!important;}
.password .password-toggle{position:absolute!important;right:6px!important;top:50%!important;transform:translateY(-50%)!important;width:34px!important;height:34px!important;border:0!important;background:transparent!important;color:#8997a9!important;display:grid!important;place-items:center!important;border-radius:8px!important;padding:0!important;box-shadow:none!important;}
.password .password-toggle:hover{color:#5c6f88!important;background:rgba(37,99,235,.06)!important;}
.password .password-eye{width:18px!important;height:18px!important;}
html[data-theme="dark"] .password .password-toggle{color:#8998ac!important;}
html[data-theme="dark"] .password .password-toggle:hover{color:#b2c2d5!important;background:#202a35!important;}
html[data-theme="dark"] .password .password-toggle.is-visible{color:#94b5ff!important;}

/* v145 — final alignment polish */

/* Weekly Daily Task date buttons: remove the visible card/background treatment. */
html[data-theme="dark"] .daily-calendar-strip .daily-day{
  background:transparent!important;
  border-color:transparent!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .daily-calendar-strip .daily-day:hover{
  background:#151d27!important;
  border-color:#2a3545!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .daily-calendar-strip .daily-day.active{
  background:#19263a!important;
  border-color:#31578f!important;
}

/* Overview Recent Work: centered, contained dividers with consistent row geometry. */
#view>.recent-panel .activity-list .activity{
  display:grid!important;
  grid-template-columns:34px minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:12px!important;
  min-height:58px!important;
  padding:10px 0!important;
  border-bottom:1px solid var(--line)!important;
}
#view>.recent-panel .activity-list .activity:last-child{border-bottom:0!important;}
html[data-theme="dark"] #view>.recent-panel .activity-list .activity{
  border-bottom-color:#26313f!important;
}
#view>.recent-panel .activity-main{min-width:0!important;}
#view>.recent-panel .activity-icon{align-self:center!important;}
#view>.recent-panel .status-pill{justify-self:end!important;}

/* v147 — final alignment polish */
/* Recent Work: one divider per row with even vertical spacing. */
#view>.recent-panel .activity-list{
  gap:0!important;
  padding-top:4px!important;
}
#view>.recent-panel .activity-list .activity{
  border-bottom:1px solid var(--line)!important;
  padding:13px 0!important;
  min-height:60px!important;
}
#view>.recent-panel .activity-list .activity+ .activity{
  border-top:0!important;
}
#view>.recent-panel .activity-list .activity:last-child{border-bottom:0!important;}
html[data-theme="dark"] #view>.recent-panel .activity-list .activity{
  border-bottom-color:#26313f!important;
}

/* Sidebar profile: centered hover surface with comfortable bottom spacing. */
.mini-profile{
  align-items:center!important;
  padding:10px 8px!important;
  margin-top:10px!important;
  margin-bottom:10px!important;
  border-top:1px solid var(--line)!important;
  border-bottom:0!important;
}
.mini-profile:hover,
html[data-theme="dark"] .mini-profile:hover{
  transform:none!important;
  box-shadow:0 7px 18px rgba(0,0,0,.14)!important;
}
.mini-profile .avatar{align-self:center!important;}

/* Password eye: exact vertical centering inside the field. */
.password .password-toggle{
  top:0!important;
  bottom:0!important;
  right:6px!important;
  margin:auto 0!important;
  transform:none!important;
  display:grid!important;
  place-items:center!important;
}

/* Daily Task weekly strip: restore the original date-card appearance; only remove the unwanted outer treatment. */
html[data-theme="dark"] .daily-calendar-strip .daily-day{
  background:#151d27!important;
  border-color:#2a3545!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .daily-calendar-strip .daily-day:hover{
  background:#1b2633!important;
  border-color:#34455b!important;
}
html[data-theme="dark"] .daily-calendar-strip .daily-day.active{
  background:#19263a!important;
  border-color:#31578f!important;
}

/* Dark-mode authentication logo. */
html[data-theme="dark"] .auth-brand img{content:url('../assets/xentra-logo-dark.png')!important;}


/* v147 — dark-mode picker/chat/delete/subtask refinements */
html[data-theme="dark"] #assigneeOptions .picker-option,
html[data-theme="dark"] #assigneeOptions .member-picker-row,
html[data-theme="dark"] #inviteOptions .member-picker-row,
html[data-theme="dark"] #groupMemberOptions .member-picker-row{
  border-left:0!important;
  border-left-color:transparent!important;
}
html[data-theme="dark"] #assigneeOptions .member-picker-row:hover,
html[data-theme="dark"] #assigneeOptions .picker-option:hover{
  background:#242c37!important;
  border-left:0!important;
}
html[data-theme="dark"] #assigneeOptions .member-picker-row.selected,
html[data-theme="dark"] #assigneeOptions .picker-option.selected{
  background:#1c2530!important;
  border-left:0!important;
}
html[data-theme="dark"] #assigneeOptions .member-picker-row.selected .member-option-text strong,
html[data-theme="dark"] #assigneeOptions .picker-option.selected .member-option-text strong{
  color:#aeb8c6!important;
}

/* Chat avatars sit vertically centered with the message bubble. */
#messages.messages .bubble-row:not(.mine){align-items:center!important;}
#messages.messages .bubble-row:not(.mine)>.avatar{align-self:center!important;margin-top:0!important;}
#messages.messages .bubble-row:not(.mine)>.bubble-wrap{align-self:center!important;}

/* Invite member hover/selected states for dark mode. */
html[data-theme="dark"] #inviteOptions .member-picker-row:hover,
html[data-theme="dark"] #groupMemberOptions .member-picker-row:hover{
  background:#242c37!important;
}
html[data-theme="dark"] #inviteOptions .member-picker-row:hover .member-option-text strong,
html[data-theme="dark"] #groupMemberOptions .member-picker-row:hover .member-option-text strong{
  color:#fff!important;
}
html[data-theme="dark"] #inviteOptions .member-picker-row.selected,
html[data-theme="dark"] #groupMemberOptions .member-picker-row.selected{
  background:#1b2430!important;
  border-color:#344256!important;
  color:#e6edf6!important;
  box-shadow:none!important;
}
html[data-theme="dark"] #inviteOptions .member-picker-row.selected .member-option-text strong,
html[data-theme="dark"] #groupMemberOptions .member-picker-row.selected .member-option-text strong{
  color:#dfe7f1!important;
}

/* Delete confirmations: readable dark warning surfaces. */
html[data-theme="dark"] .delete-project-warning,
html[data-theme="dark"] .directory-delete-warning,
html[data-theme="dark"] .action-confirm-modal .warning,
html[data-theme="dark"] .action-confirm-modal .danger-warning{
  background:#2a1d22!important;
  border-color:#5a353e!important;
  color:#cbb0b6!important;
}
html[data-theme="dark"] .delete-project-warning strong,
html[data-theme="dark"] .directory-delete-warning strong,
html[data-theme="dark"] .action-confirm-modal .warning strong,
html[data-theme="dark"] .action-confirm-modal .danger-warning strong{
  color:#ffabb5!important;
}
html[data-theme="dark"] .delete-project-warning span,
html[data-theme="dark"] .directory-delete-warning span,
html[data-theme="dark"] .action-confirm-modal .warning span,
html[data-theme="dark"] .action-confirm-modal .danger-warning span{
  color:#c9a6ad!important;
}
html[data-theme="dark"] .delete-project-warning>.ui-icon,
html[data-theme="dark"] .directory-delete-warning>.ui-icon{color:#ff8796!important;}

/* Parent/nested subtask add button uses icon only. */
#taskModal .subtask-add .btn{width:38px!important;min-width:38px!important;padding:0!important;gap:0!important;}
#taskModal .subtask-add .btn .ui-icon{width:15px!important;height:15px!important;}
/* No extra divider between Outdent / Nest controls. */
.subtask-move-group .subtask-action,
.subtask-move-group .subtask-action:nth-child(1),
.subtask-move-group .subtask-action:nth-child(2),
.subtask-move-group .subtask-action:nth-child(3){
  border-right:0!important;
  border-left:0!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .subtask-move-group .subtask-action{background:transparent!important;}
html[data-theme="dark"] .subtask-move-group .subtask-action:hover{background:#202a36!important;}

/* Keep member-picker and subtask surfaces dark in every modal layer. */
html[data-theme="dark"] .subtask-item,
html[data-theme="dark"] .pending-sub,
html[data-theme="dark"] .subtask-list,
html[data-theme="dark"] #subtasks{
  background:#151d27!important;
  border-color:#2a3545!important;
}
html[data-theme="dark"] .subtask-label{color:#d7e0ea!important;}

/* v148 — performance + responsive hardening */
html,body{max-width:100%;overflow-x:hidden}
img,svg{max-width:100%}
button,a,input,select,textarea{touch-action:manipulation}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}
@media (max-width:900px){
  .content-wrap{width:100%;max-width:100%;min-width:0}
  .topbar{width:100%;max-width:100%}
  .topbar-left,.top-actions{min-width:0}
  .top-actions{overflow:hidden}
  .search-box{min-width:0;flex:1 1 auto}
  .page-heading>*{min-width:0}
  .card,.panel,.section-card{min-width:0}
  .chat-layout,.profile-layout,.dashboard-grid,.settings-two-column,.group-selection-grid,.report-grid-2{min-width:0}
}
@media (max-width:620px){
  .content-wrap{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right));padding-bottom:max(24px,env(safe-area-inset-bottom))}
  .topbar{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
  .page-heading h1{max-width:100%;overflow-wrap:anywhere}
  .btn,.top-icon,.icon-btn,.close{min-height:36px}
  input,select,textarea,.form-control{font-size:16px}
  .modal-box{width:100%;max-width:100%;max-height:calc(100vh - 16px);overflow:auto}
  .task-modal-shell{width:calc(100vw - 16px)!important;max-width:calc(100vw - 16px)!important}
  .group-modal-large{width:calc(100vw - 16px)!important;max-width:calc(100vw - 16px)!important}
  .report-filters{min-width:0}
  .data-table,.projects-list-table,.report-table{min-width:620px}
}
@media (max-width:380px){
  .topbar{height:62px}
  .search-box{width:110px}
  .content-wrap{padding-top:16px}
  .page-heading h1{font-size:22px}
  .kpis{grid-template-columns:1fr!important}
  .form-grid{grid-template-columns:1fr!important}
  .chat-compose{gap:5px;padding:9px}
  .chat-compose input{min-width:0}
}

/* Keep large data sets inside their own scroller instead of expanding the viewport. */
.data-table-wrap,.projects-list-panel,.report-table-wrap,.table-wrap{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}


/* v149 — group-chat mentions */
.chat-input-wrap{position:relative!important}
.chat-mention-menu{display:none;position:absolute;left:44px;bottom:calc(100% + 8px);z-index:2147482000;min-width:250px;max-width:min(360px,calc(100vw - 32px));padding:6px;border:1px solid var(--line);border-radius:12px;background:var(--surface,#fff);box-shadow:0 16px 40px rgba(20,30,45,.16)}
.chat-mention-menu.show{display:block}
.chat-mention-option{width:100%;display:flex;align-items:center;gap:9px;padding:8px 10px;border:0;border-radius:8px;background:transparent;color:var(--ink);text-align:left;cursor:pointer}
.chat-mention-option:hover,.chat-mention-option.active{background:var(--soft,#f1f4f8)}
.chat-mention-option span{display:flex;flex-direction:column;min-width:0}
.chat-mention-option strong{font-size:12px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-mention-option small{font-size:10px;line-height:1.25;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mention-avatar{width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:var(--soft,#eef3fb);color:var(--accent,#416ff2);flex:0 0 24px}
.chat-mention{color:#4b7ff2;font-weight:700;background:rgba(75,127,242,.10);padding:1px 3px;border-radius:4px}
.chat-mention.here{color:#a06a12;background:rgba(214,155,52,.13)}
html[data-theme="dark"] .chat-mention-menu{background:#171e27!important;border-color:#2b3645!important;box-shadow:0 18px 44px rgba(0,0,0,.38)!important}
html[data-theme="dark"] .chat-mention-option{color:#edf2fa!important}
html[data-theme="dark"] .chat-mention-option:hover,html[data-theme="dark"] .chat-mention-option.active{background:#252f3c!important}
html[data-theme="dark"] .chat-mention-option small{color:#8f9caf!important}
html[data-theme="dark"] .mention-avatar{background:#202b39!important;color:#9bbaff!important}
html[data-theme="dark"] .chat-mention{color:#9bbaff!important;background:rgba(111,153,239,.15)!important}
html[data-theme="dark"] .chat-mention.here{color:#f0c06f!important;background:rgba(213,158,57,.16)!important}