*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;color:#1f2b28}.layout{min-height:100vh;height:100vh;overflow:hidden;display:grid;grid-template-columns:132px 230px 520px 1fr;background:radial-gradient(circle at 20% -20%,#fff3cf 0%,transparent 46%),radial-gradient(circle at 90% 120%,#d9f0ff 0%,transparent 42%),#f5f7f6}.primary-sidebar{border-right:1px solid #d7dfdc;padding:.85rem .65rem;display:flex;flex-direction:column;gap:1.1rem}.product-mark{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(150deg,#0f9b8a,#1a7f97);color:#fff;font-weight:800;letter-spacing:.02em;margin:0 auto}.primary-nav{display:grid;gap:.55rem}.primary-nav-button{border:1px solid #d5dfdb;background:#fff;border-radius:12px;color:#2a3835;padding:.55rem .45rem;font-size:.78rem;font-weight:700;cursor:pointer;display:grid;justify-items:center;gap:.35rem}.primary-nav-button.active{border-color:#0e8f7e;background:#e5f8f2}.icon-dot{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#f0f4f2;color:#1e6762;font-size:.73rem}.icon-dot svg{width:15px;height:15px;fill:currentColor}.sidebar,.conversation-list,.detail-panel{border-right:1px solid #d7dfdc;padding:1rem;overflow:auto}.conversation-list{position:relative;overflow-y:auto;overflow-x:visible;z-index:25}.detail-panel{border-right:none;padding:0;overflow:hidden;position:relative;z-index:1;min-height:0}.brand{margin:0;font-family:Trebuchet MS,Gill Sans,sans-serif;letter-spacing:.02em;font-size:1.35rem}.subtitle{margin:.6rem 0 1.2rem;color:#60706a;font-size:.95rem}.channel-menu{display:grid;gap:.5rem}.channel-button{border:1px solid #d5dfdb;background:#fff;color:#1f2b28;border-radius:10px;height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 .8rem;cursor:pointer;font-weight:600}.channel-label{display:inline-flex;align-items:center;gap:.5rem}.channel-icon{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#eff4f2;color:#2a5a51}.channel-icon svg{width:14px;height:14px;fill:currentColor}.channel-button.active{border-color:#0e8f7e;background:#e5f8f2}.count{min-width:24px;text-align:center;padding:.1rem .35rem;border-radius:999px;background:#f0f4f2;font-size:.75rem}.panel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.9rem}.panel-header h2{margin:0;font-size:1.1rem}.panel-header small{color:#73807c}.cards{display:grid;gap:.75rem;overflow:visible}.conversation-card{background:#fff;border:1px solid #dae2de;border-radius:14px;padding:.75rem;display:grid;grid-template-columns:44px 1fr;gap:.7rem;cursor:pointer;transition:border-color .2s ease,transform .2s ease}.conversation-card:hover{transform:translateY(-1px);border-color:#bfc9c5}.conversation-card.selected{border-color:#0e8f7e;box-shadow:0 0 0 1px #0e8f7e}.conversation-card.pinned{border-color:#9dcfc6}@keyframes new-arrival-glow{0%{box-shadow:0 0 #3daa613d}70%{box-shadow:0 0 0 7px #3daa6100}to{box-shadow:0 0 #3daa6100}}.conversation-card.new-arrival{background:linear-gradient(135deg,#f3fff3,#e3f9e3);border-color:#8ccf98;animation:new-arrival-glow 1.8s ease-in-out infinite}.conversation-card.new-arrival:hover{border-color:#74bf82}.avatar{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(140deg,#ffd493,#ffab81);color:#4a2a16;font-weight:700;font-size:.88rem}.card-content{display:grid;gap:.3rem}.top-row{display:flex;justify-content:space-between;align-items:center;gap:.6rem}.top-actions{display:flex;align-items:center;gap:.38rem}.top-row strong{color:#172320;font-size:.96rem}.top-row time{color:#83918d;font-size:.8rem}.pin-indicator{font-size:.66rem;font-weight:700;color:#0e8f7e;background:#e3f8f2;border-radius:999px;padding:.08rem .4rem;text-transform:uppercase}.card-menu-wrapper{position:relative}.card-menu-trigger{border:1px solid #d2dcd9;width:26px;height:26px;border-radius:50%;background:#fff;color:#566662;cursor:pointer;display:grid;place-items:center;padding:0;transition:border-color .2s ease,background-color .2s ease,color .2s ease}.card-menu-trigger:hover{border-color:#93a8a1;background:#f3f7f5;color:#344743}.card-menu-trigger svg{width:14px;height:14px;fill:currentColor}.card-menu{position:absolute;top:28px;right:0;min-width:150px;background:#fff;border:1px solid #d6dfdb;border-radius:10px;box-shadow:0 10px 25px #1826221f;padding:.3rem;z-index:15;overflow:visible}.submenu-group{position:relative}.card-menu-item{width:100%;border:none;background:transparent;text-align:left;padding:.5rem .55rem;border-radius:8px;cursor:pointer;color:#20312d;font-size:.8rem;display:flex;justify-content:space-between;align-items:center}.card-menu-item:hover,.card-menu-item.expanded{background:#eef5f2}.label-submenu{position:absolute;top:0;right:calc(100% + 8px);min-width:168px;background:#fff;border:1px solid #d6dfdb;border-radius:10px;box-shadow:0 10px 25px #1826221f;padding:.3rem;z-index:1000}.label-submenu-item{width:100%;border:none;background:transparent;text-align:left;padding:.45rem .55rem;border-radius:8px;cursor:pointer;color:#2a3b37;font-size:.78rem}.label-submenu-item:hover,.label-submenu-item.active{background:#e5f8f2;color:#1a6f62}.last-message{margin:0;color:#4d5e59;font-size:.87rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.meta-row{display:flex;gap:.4rem;flex-wrap:wrap}.badge,.status-tag{font-size:.76rem;border-radius:999px;padding:.2rem .6rem;text-transform:capitalize}.badge{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border-radius:6px}.badge svg{width:15px;height:15px;flex-shrink:0}.badge.zalo{background:#e8f1ff;color:#1467c8}.badge.messenger{background:#e8ecff;color:#3445cf}.badge.tiktok{background:#f3e9f5;color:#7a3286}.status-tag.new{background:#fff2cc;color:#8d6300}.status-tag.open{background:#dff5ff;color:#046d93}.status-tag.pending{background:#ffe7dc;color:#9f431f}.status-tag.resolved{background:#dff7e9;color:#1b7948}.customer-label{font-size:.76rem;border-radius:999px;padding:.2rem .6rem;text-transform:none;font-weight:700}.customer-label.b1{background:#ffe5b4;color:#8a4d00}.customer-label.b2{background:#e5f0ff;color:#1552a7}.customer-label.b3{background:#e5f8ef;color:#1d7a47}.customer-label.b4{background:#ffe7e2;color:#9f3c2e}.customer-label.b5{background:#efe8ff;color:#5a3a9d}.detail-card,.empty-state{border:1px solid #dae3df;background:#fff;border-radius:14px;padding:1rem;color:#32403d}.detail-card h3{margin:0 0 .8rem}.detail-card p{margin:.3rem 0}.chat-window{height:100%;min-height:0;display:grid;grid-template-rows:auto 1fr auto;background:#f3f5f6}.chat-header{display:flex;justify-content:space-between;align-items:center;padding:.85rem 1rem;border-bottom:1px solid #d6dedd;background:#fff}.chat-user{display:flex;align-items:center;gap:.75rem}.avatar.large{width:42px;height:42px;font-size:.84rem}.chat-user h3{margin:0;font-size:1rem;color:#192623}.chat-user p{margin:.1rem 0 0;color:#4c8b6e;font-size:.8rem}.chat-actions{display:flex;gap:.4rem}.chat-icon-button{width:32px;height:32px;border:1px solid #d3ddda;border-radius:50%;background:#fff;display:grid;place-items:center;color:#546561;cursor:pointer}.chat-icon-button svg{width:15px;height:15px;fill:currentColor}.chat-timeline{padding:1rem;overflow:auto;min-height:0;display:grid;gap:.95rem;background-color:#f4f6f6;background-image:radial-gradient(circle at 1px 1px,rgba(151,166,160,.25) 1.2px,transparent 1.4px);background-size:30px 30px}.chat-row{display:grid;gap:.32rem;width:fit-content;max-width:min(72%,520px);align-content:start;justify-items:start}.chat-row.in{justify-self:start}.chat-row.out{justify-self:end;justify-items:end}.message-meta{display:flex;gap:.55rem;font-size:.76rem;color:#798984}.message-meta strong{color:#334340}.message-bubble{display:inline-flex;align-items:center;border-radius:14px;padding:.7rem .9rem;font-size:.91rem;line-height:1.35;width:fit-content;max-width:100%;justify-self:start;align-self:start}.chat-row.in .message-bubble{background:#fff;border:1px solid #dde4e2;color:#25322f}.chat-row.out .message-bubble{background:linear-gradient(135deg,#5f35ff,#7b39ff);color:#fff}.message-call-card{border-radius:14px;border:1px solid #dde4e2;background:#fff;padding:.65rem .8rem;display:grid;grid-template-columns:32px 1fr;gap:.55rem;align-items:center;width:fit-content;max-width:100%;justify-self:start;align-self:start}.message-call-card.ended{background:linear-gradient(135deg,#5f35ff,#7b39ff);border-color:transparent;color:#fff}.call-icon{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#f1f5f4;color:#3f5d57}.message-call-card.ended .call-icon{background:#ffffff3d;color:#fff}.call-icon svg{width:16px;height:16px;fill:currentColor}.message-call-card strong{font-size:.9rem}.message-call-card p{margin:.12rem 0 0;font-size:.79rem;color:#6d7f79}.message-call-card.ended p{color:#ffffffe0}.typing-pill{width:fit-content;max-width:100%;background:#e8ecec;color:#667772;border-radius:12px;padding:.5rem .75rem;font-style:italic;justify-self:start;align-self:start}.chat-composer{display:grid;grid-template-columns:auto 1fr auto;gap:.55rem;align-items:center;padding:.65rem .9rem;border-top:1px solid #d6dfdc;background:#fff}.chat-composer input{border:1px solid #d6dfdc;border-radius:999px;height:38px;padding:0 .9rem;font-size:.9rem;color:#22312d;background:#f8fbfa}.chat-composer input:focus{outline:2px solid #bee8dd}.chat-composer input:disabled{opacity:.7;cursor:not-allowed}.send-button{width:34px;height:34px;border:none;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#5f35ff,#7b39ff);color:#fff;cursor:pointer}.send-button svg{width:16px;height:16px;fill:currentColor}.send-button:disabled{opacity:.55;cursor:not-allowed}.statistics-view{grid-column:2 / -1;padding:1rem 1.05rem;background:transparent;color:#1d2623;display:grid;grid-template-rows:auto 1fr;gap:.85rem;min-height:0;overflow:auto}.board-topbar{display:flex;align-items:center;flex-wrap:wrap;gap:.75rem}.board-create-button{border:1px solid #3a3c42;border-radius:10px;background:#f5f6f8;color:#121317;font-size:.95rem;font-weight:600;padding:.45rem .8rem;cursor:pointer}.board-view-switcher{display:flex;align-items:center;gap:.25rem;border:1px solid #2d2f34;border-radius:10px;background:#15161a;padding:.2rem}.view-tab{border:none;background:transparent;color:#9fa3ad;font-size:.83rem;font-weight:600;padding:.4rem .62rem;border-bottom:2px solid transparent;cursor:pointer;transition:background .2s ease,color .2s ease}.view-tab:hover{color:#f2f2f2;background:#202228}.view-tab.active{color:#fff;border-bottom-color:#fff}.board-filters{display:flex;align-items:center;gap:.35rem}.board-filter-pill{border:1px solid #2f3140;border-radius:999px;background:#5e58ff1f;color:#beb4ff;font-size:.78rem;font-weight:600;padding:.28rem .64rem;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);cursor:pointer}.board-filter-pill.active{color:#d3ccff;border-color:#4a4398;background:#6f65ff38}.kanban-board{display:grid;grid-template-columns:repeat(3,minmax(220px,1fr)) auto;gap:.82rem;align-items:start;min-width:max-content}.kanban-column{background:#686f8138;border:1px solid rgba(77,85,103,.48);border-radius:12px;padding:.7rem;min-height:340px;transition:background .2s ease}.kanban-column:hover{background:#747b8d4d}.kanban-column.in-progress{background:#6348cb47;border-color:#4f38ad9e}.kanban-column.finished{background:#2d916742;border-color:#1e7a5494}.kanban-column-header{display:flex;align-items:center;justify-content:flex-start;gap:.48rem;margin-bottom:.62rem}.status-pill{display:inline-flex;align-items:center;border-radius:999px;padding:.24rem .62rem;font-size:.74rem;font-weight:700;letter-spacing:.01em}.status-pill.todo{background:#a1a6b033;color:#5e626b}.status-pill.in-progress{background:#7356ff40;color:#4f2dbe}.status-pill.finished{background:#2faf7338;color:#198d53}.kanban-count{font-size:.84rem;font-weight:700;color:#848d9e}.kanban-column.drop-target{box-shadow:0 0 0 2px #8971ff59 inset}.kanban-cards{display:grid;gap:.62rem}.kanban-task-card{border:1px solid #2d3038;border-radius:12px;background:#17191d;padding:.72rem;box-shadow:0 4px 20px #00000040;cursor:grab;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.kanban-task-card:hover{transform:translateY(-2px) scale(1.01);border-color:#424654}.kanban-task-card.dragging{opacity:.6;transform:rotate(2deg);box-shadow:0 14px 34px #0000008c}.kanban-task-card h4{margin:0;font-size:.92rem;font-weight:600;color:#e5e5e5}.kanban-task-card p{margin:.24rem 0 0;font-size:.74rem;color:#8a90a0}.task-meta{margin-top:.55rem;display:grid;gap:.24rem}.task-meta span{display:inline-flex;align-items:center;gap:.34rem;font-size:.74rem;color:#8f97aa}.task-meta strong{color:#e5e5e5;font-weight:500}.inline-add-task,.add-group-button{border:none;background:transparent;color:#7f8592;font-size:.95rem;text-align:left;margin-top:.62rem;padding:.1rem .12rem;cursor:pointer;transition:color .2s ease}.inline-add-task:hover,.add-group-button:hover{color:#141a18}.add-group-button{margin-top:0;align-self:start;white-space:nowrap}.statistics-view .panel-header,.stats-grid,.stat-card{display:none}@media(max-width:1100px){.layout{grid-template-columns:116px 200px 1fr}.detail-panel{display:none}.statistics-view{grid-column:2 / -1}.kanban-board{grid-template-columns:repeat(2,minmax(220px,1fr))}.add-group-button{grid-column:1 / -1}}@media(max-width:760px){.layout{grid-template-columns:1fr}.primary-sidebar{border-right:none;border-bottom:1px solid #d7dfdc;flex-direction:row;align-items:center;justify-content:space-between;padding:.7rem .85rem}.product-mark{margin:0}.primary-nav{grid-template-columns:repeat(2,minmax(0,1fr));width:min(320px,100%)}.primary-nav-button{grid-auto-flow:column;align-items:center;justify-content:center;gap:.45rem}.sidebar,.conversation-list{border-right:none}.sidebar{border-bottom:1px solid #d7dfdc}.channel-menu{grid-template-columns:repeat(2,minmax(0,1fr))}.statistics-view{grid-column:auto}.board-topbar{align-items:flex-start;flex-direction:column}.board-view-switcher{width:100%;overflow-x:auto}.kanban-board{grid-template-columns:1fr}}