:root{color-scheme:dark;--bg:#081018;--panel:#101b27;--panel2:#142231;--line:#26384a;--text:#eaf2f8;--muted:#8ea4b7;--accent:#53d6a5;--warn:#f5c451;--danger:#ff7575}*{box-sizing:border-box}body,html{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}.shell{display:grid;grid-template-columns:230px 1fr}.sidebar{border-right:1px solid var(--line);padding:24px 16px;background:#0b151f}.brand{font-weight:800;font-size:18px;letter-spacing:.3px;margin-bottom:4px}.subbrand{color:var(--muted);font-size:12px;margin-bottom:28px}.nav{display:grid;grid-gap:8px;gap:8px}.nav a{padding:10px 12px;border-radius:10px;color:var(--muted)}.nav a:hover{background:var(--panel);color:var(--text)}.main{padding:28px;max-width:1320px;width:100%;margin:0 auto}.header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px}h1,h2,h3,p{margin-top:0}h1{font-size:28px;margin-bottom:6px}.muted{color:var(--muted)}.grid{display:grid;grid-gap:16px;gap:16px}.grid.cards{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:18px}.cardHead{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.status{display:inline-flex;align-items:center;gap:7px;font-size:12px;padding:5px 9px;border-radius:999px;background:#1b2937}.dot{width:8px;height:8px;border-radius:50%;background:var(--muted)}.status.CONNECTED .dot{background:var(--accent);box-shadow:0 0 10px rgba(83,214,165,.6)}.status.ERROR .dot,.status.REAUTH_REQUIRED .dot{background:var(--danger)}.status.AUTHENTICATING .dot,.status.QR_PENDING .dot,.status.RECONNECTING .dot{background:var(--warn)}.row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.stack{display:grid;grid-gap:12px;gap:12px}.button,button{border:1px solid var(--line);background:#172738;color:var(--text);border-radius:10px;padding:10px 13px}.button.primary,button.primary{background:#1b805f;border-color:#279a76}button.danger{background:#582929;border-color:#834040}button:disabled{opacity:.5;cursor:not-allowed}input,select,textarea{width:100%;color:var(--text);background:#0a141e;border:1px solid var(--line);border-radius:10px;padding:11px 12px;outline:none}input:focus,textarea:focus{border-color:#4c7a9c}label{display:grid;grid-gap:6px;gap:6px;font-size:13px;color:var(--muted)}.modalBackdrop{position:fixed;inset:0;background:rgba(0,0,0,.65);display:grid;place-items:center;padding:20px;z-index:20}.modal{width:min(680px,100%);max-height:90vh;overflow:auto;background:#0e1924;border:1px solid var(--line);border-radius:18px;padding:22px}.tabs{display:flex;gap:8px;margin:12px 0 18px}.tabs button.active{background:#24435a;border-color:#3d6885}.qr{background:#fff;padding:14px;width:280px;height:280px;border-radius:14px;object-fit:contain;display:block;margin:16px auto}.kv{display:grid;grid-template-columns:130px 1fr;grid-gap:8px 12px;gap:8px 12px;font-size:13px}.kv>div:nth-child(odd){color:var(--muted)}.error{color:#ff9b9b;background:#341d24;border:1px solid #5c303b;border-radius:10px}.error,.success{padding:10px 12px}.success{color:#9ef0cf;background:#153329;border:1px solid #275a48;border-radius:10px}.eventList{display:grid;grid-gap:10px;gap:10px}.event{border:1px solid var(--line);background:#0c1721;border-radius:12px}.event,pre{padding:12px}pre{white-space:pre-wrap;word-break:break-word;background:#071019;border-radius:10px;overflow:auto;font-size:12px;line-height:1.45}.loginPage{min-height:100vh;display:grid;place-items:center;padding:24px}.loginCard{width:min(440px,100%)}@media (max-width:800px){.shell{grid-template-columns:1fr}.sidebar{border-right:0;border-bottom:1px solid var(--line)}.main{padding:18px}.kv{grid-template-columns:1fr}.qr{width:230px;height:230px}}.authMain{min-height:100vh}.sidebar{display:flex;flex-direction:column}.sidebarFooter{margin-top:auto;padding-top:18px;border-top:1px solid var(--line);display:grid;grid-gap:10px;gap:10px}.signedInAs{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.logoutButton{width:100%}.loginBrand{font-weight:800;font-size:24px;margin-bottom:6px}.authNote{color:var(--muted);font-size:12px;margin:16px 0 0;line-height:1.5}.authLoading{min-height:100vh;display:grid;place-items:center;color:var(--muted)}.inboxShell{display:grid;grid-template-columns:minmax(300px,380px) 1fr;height:calc(100vh - 145px);min-height:560px;border:1px solid #e5e7eb;border-radius:16px;overflow:hidden;background:#fff}.conversationPane{border-right:1px solid #e5e7eb}.conversationPane,.messagePane{min-width:0;display:flex;flex-direction:column}.messagePane{background:#f8fafc}.paneTitle{min-height:62px;padding:14px 16px;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;align-items:center;gap:12px;background:#fff}.conversationList{overflow:auto}.conversationItem{display:block;width:100%;text-align:left;border:0;border-bottom:1px solid #eef2f7;background:#fff;padding:14px 16px;border-radius:0}.conversationItem.active,.conversationItem:hover{background:#f1f5f9}.conversationMeta,.conversationTop{display:flex;justify-content:space-between;gap:10px;align-items:center}.conversationMeta,.conversationTop span{font-size:12px;color:#64748b}.conversationPreview{margin-top:7px;color:#475569;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.badge{background:#111827;color:#fff;border-radius:999px;min-width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;padding:0 6px;font-size:11px}.messageList{flex:1 1;overflow:auto;padding:20px}.messageRow{display:flex;margin:8px 0}.messageRow.outbound{justify-content:flex-end}.bubble{max-width:min(72%,680px);padding:10px 13px;border-radius:14px;background:#fff;border:1px solid #e2e8f0;box-shadow:0 1px 2px rgba(15,23,42,.04)}.bubble.outbound{background:#e0f2fe;border-color:#bae6fd}.bubbleTime,.bubbleType{font-size:11px;color:#64748b}.bubbleType{margin-bottom:4px}.bubbleTime{margin-top:5px;text-align:right}.attachment{font-size:12px;margin-top:6px;padding:6px 8px;background:hsla(0,0%,100%,.65);border-radius:8px}.composerDisabled{padding:13px 16px;border-top:1px solid #e5e7eb;background:#fff;color:#64748b;font-size:13px}.emptyPane{padding:24px;color:#64748b;text-align:center}@media(max-width:900px){.inboxShell{grid-template-columns:1fr;height:auto}.conversationPane{border-right:0;border-bottom:1px solid #e5e7eb;max-height:360px}.messagePane{min-height:560px}}.c311{color:#0f172a;min-width:0}.c311 .eyebrow{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#55c7a2;margin-bottom:4px}.c311 .inboxTopbar{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:14px}.c311 .inboxTopbar h1{margin:0;color:#f8fafc;font-size:26px;line-height:1.1}.c311 .inboxTopbar p{margin:6px 0 0;color:#8fa3b5;font-size:12px}.c311 .inboxTopStats{display:flex;gap:8px}.c311 .inboxTopStats span{background:#0f1c28;border:1px solid #23384a;border-radius:10px;color:#91a5b5;padding:7px 10px;font-size:11px}.c311 .inboxTopStats b{color:#f8fafc;margin-right:3px}.c311 .inboxError{margin-bottom:10px}.c311 .operatorInboxShell{height:calc(100vh - 118px);min-height:640px;display:grid;grid-template-columns:minmax(300px,330px) minmax(520px,1fr) minmax(260px,290px);overflow:hidden;border:1px solid #243647;border-radius:16px;background:#f8fafc;box-shadow:0 18px 50px rgba(0,0,0,.25)}.c311 .operatorConversationPane{min-width:0;display:flex;flex-direction:column;background:#fff;border-right:1px solid #dfe6ee}.c311 .conversationPaneHeader{height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid #e6ebf1;color:#0f172a}.c311 .conversationPaneHeader strong{font-size:14px}.c311 .conversationPaneHeader span{font-size:11px;color:#64748b;background:#f1f5f9;padding:3px 7px;border-radius:999px}.c311 .conversationTools{padding:11px 12px 9px;border-bottom:1px solid #e8edf3;background:#fbfdff}.c311 .searchBox{height:38px;display:flex;align-items:center;gap:7px;padding:0 10px;border:1px solid #cfd9e4;border-radius:10px;background:#fff}.c311 .searchBox span{font-size:18px;color:#64748b}.c311 .searchBox input{flex:1 1;min-width:0;border:0!important;outline:0;background:transparent!important;color:#0f172a!important;font-size:12px;padding:0!important}.c311 .searchBox input::placeholder{color:#94a3b8}.c311 .filterTabs{display:flex;gap:6px;margin-top:9px}.c311 .filterTabs button{border:1px solid transparent;background:#f1f5f9;color:#475569;border-radius:8px;padding:6px 9px;font-size:10px;font-weight:700}.c311 .filterTabs button.active{background:#e7f7f1;border-color:#b6e7d6;color:#087454}.c311 .operatorConversationList{flex:1 1;min-height:0;overflow:auto;background:#fff}.c311 .operatorConversationItem{width:100%;display:flex;gap:10px;padding:12px;border:0;border-bottom:1px solid #edf1f5;border-radius:0;background:#fff;color:#0f172a;text-align:left}.c311 .operatorConversationItem:hover{background:#f7fafc}.c311 .operatorConversationItem.active{background:#edf8f4;box-shadow:inset 3px 0 #18a477}.c311 .avatarWrap{position:relative;flex:none}.c311 .avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#dbeafe,#c7d2fe);border:1px solid #cbd5e1;color:#1e3a5f;font-weight:850;font-size:12px}.c311 .avatar.large{width:42px;height:42px}.c311 .avatar.xl{width:64px;height:64px;font-size:18px;margin:0 auto}.c311 .channelDot{position:absolute;right:0;bottom:0;width:11px;height:11px;border:2px solid #fff;border-radius:50%}.c311 .channelDot.zalo{background:#1677ff}.c311 .conversationBody{flex:1 1;min-width:0}.c311 .conversationLastLine,.c311 .conversationNameRow,.c311 .conversationSubRow{display:flex;align-items:center;gap:7px}.c311 .conversationNameRow{justify-content:space-between}.c311 .conversationNameRow strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#0f172a;font-size:12.5px}.c311 .conversationNameRow time{flex:none;color:#64748b;font-size:9.5px}.c311 .conversationSubRow{margin-top:3px;color:#64748b;font-size:9.5px;white-space:nowrap;overflow:hidden}.c311 .conversationSubRow span:last-child{overflow:hidden;text-overflow:ellipsis}.c311 .dotSep{color:#cbd5e1}.c311 .conversationLastLine{justify-content:space-between;margin-top:6px}.c311 .conversationLastLine>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#475569;font-size:11px}.c311 .unreadBadge{flex:none;min-width:20px;height:20px;padding:0 6px;border-radius:999px;display:grid;place-items:center;background:#0f8a65;color:#fff;font-size:9px;font-weight:800;box-shadow:none}.c311 .operatorChatPane{display:flex;flex-direction:column;min-width:0;background:#f4f7fa}.c311 .chatHeader{height:64px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 16px;background:#fff;border-bottom:1px solid #dfe6ee}.c311 .chatIdentity{display:flex;align-items:center;gap:10px;min-width:0}.c311 .chatIdentity strong{display:block;color:#0f172a;font-size:14px}.c311 .chatMeta{margin-top:3px;color:#64748b;font-size:10px;white-space:nowrap}.c311 .statusDot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px;background:#94a3b8}.c311 .statusDot.online{background:#10b981}.c311 .conversationStatus{display:inline-flex;align-items:center;border:1px solid #cfe2da;border-radius:999px;background:#effaf6;color:#0d7a59;padding:5px 9px;font-size:9px;font-weight:800}.c311 .chatHeaderEmpty{color:#64748b;font-size:12px}.c311 .operatorMessageList{flex:1 1;min-height:0;overflow:auto;padding:18px 22px;background:linear-gradient(180deg,#f5f8fb,#edf3f7);scroll-behavior:smooth}.c311 .operatorMessageRow{display:flex;margin:7px 0}.c311 .operatorMessageRow.outbound{justify-content:flex-end}.c311 .operatorBubble{max-width:min(72%,650px);padding:9px 11px;border-radius:14px;line-height:1.45;font-size:12px;color:#172033;box-shadow:0 1px 2px rgba(15,23,42,.08)}.c311 .operatorBubble.inbound{background:#fff;border:1px solid #dbe3eb;border-bottom-left-radius:5px}.c311 .operatorBubble.outbound{background:#dff7ed;border:1px solid #bfe9d9;border-bottom-right-radius:5px}.c311 .operatorBubble.system{max-width:80%;background:#eef2f6;border-color:#d7e0e8;color:#475569}.c311 .messageText{white-space:pre-wrap;word-break:break-word;color:#172033}.c311 .messagePlaceholder{color:#475569}.c311 .operatorBubbleFooter{display:flex;justify-content:flex-end;gap:6px;min-height:10px;margin-top:5px;color:#7a8a99;font-size:8.5px}.c311 .operatorBubbleFooter span:empty{display:none}.c311 .mediaStack{display:grid;grid-gap:7px;gap:7px;margin-top:7px}.c311 .imageAttachmentLink{display:block;line-height:0}.c311 .messageImage{display:block;max-width:min(100%,420px);max-height:340px;object-fit:cover;border-radius:10px;border:1px solid #d8e1ea;background:#eef2f6}.c311 .messageVideo{display:block;width:min(100%,420px);max-height:340px;border-radius:10px;background:#000}.c311 .fileAttachment{display:flex;align-items:center;gap:9px;padding:9px 10px;border:1px solid #d8e1e8;border-radius:9px;background:#f8fafc;color:#1e293b;text-decoration:none}.c311 .fileAttachment:hover{background:#f1f5f9}.c311 .fileAttachmentIcon{font-size:18px}.c311 .fileAttachment b{display:block;font-size:10px}.c311 .fileAttachment small{display:block;margin-top:2px;color:#64748b;font-size:8.5px}.c311 .operatorComposer{height:60px;flex:none;display:flex;align-items:center;gap:8px;padding:9px 11px;background:#fff;border-top:1px solid #dfe6ee}.c311 .composerIcon{width:38px;height:38px;border:1px solid #d9e1e8;border-radius:10px;background:#f8fafc;color:#64748b}.c311 .composerInputDisabled{flex:1 1;height:38px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;border:1px solid #d9e1e8;border-radius:11px;background:#f8fafc;color:#64748b;font-size:11px}.c311 .composerInputDisabled span{color:#94a3b8;font-size:9px}.c311 .sendDisabled{height:38px;padding:0 15px;border:0;border-radius:10px;background:#d7eee6;color:#6c9486}.c311 .chatBlankState{height:100%;display:grid;place-items:center;align-content:center;text-align:center;color:#64748b}.c311 .chatBlankState h3{margin:8px 0 4px;color:#334155}.c311 .chatBlankState p{font-size:11px;max-width:280px}.c311 .blankIcon{font-size:28px}.c311 .operatorCustomerPane{min-width:0;overflow:auto;padding:15px 14px;background:#fff;border-left:1px solid #dfe6ee;color:#0f172a}.c311 .customerEmpty{height:100%;display:grid;place-items:center;align-content:center;text-align:center;color:#64748b;font-size:11px}.c311 .customerHero{text-align:center;padding:5px 0 14px;border-bottom:1px solid #e6ebf1}.c311 .customerHero h3{margin:9px 0 7px;color:#0f172a;font-size:14px}.c311 .channelPill.prominent{display:inline-flex;padding:4px 8px;border-radius:999px;background:#eaf3ff;border:1px solid #cde1fb;color:#1668c1;font-size:9px;font-weight:800}.c311 .customerChannelState{margin-top:7px;color:#64748b;font-size:9px}.c311 .customerSection{padding:13px 0;border-bottom:1px solid #e7edf2}.c311 .sectionTitle{margin-bottom:8px;color:#64748b;font-size:8.5px;font-weight:900;letter-spacing:.09em;text-transform:uppercase}.c311 .customerKv{display:flex;justify-content:space-between;gap:10px;padding:4px 0;color:#64748b;font-size:9.5px}.c311 .customerKv b{max-width:58%;color:#1e293b;font-weight:650;text-align:right}.c311 .identityCard{padding:8px 9px;margin:6px 0;border:1px solid #dfe6ed;border-radius:9px;background:#f8fafc}.c311 .identityCard>div{display:flex;align-items:center;justify-content:space-between;gap:5px;color:#64748b;font-size:8.5px}.c311 .identityCard>span{display:block;margin-top:3px;color:#1e293b;font-size:9.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.c311 .verified{color:#0b8a63}.c311 .customerAction{width:100%;margin:4px 0;padding:8px 9px;border:1px solid #dce4eb;border-radius:8px;background:#f8fafc;color:#64748b;text-align:left;font-size:9.5px}.c311 .customerHint{color:#7b8a99;font-size:8.8px;line-height:1.45}.c311 .developerDetails{margin-top:13px;color:#7b8a99;font-size:8.5px}.c311 .developerDetails summary{cursor:pointer}.c311 .techLine{margin-top:5px;word-break:break-all}.c311 .inboxEmpty{padding:22px;text-align:center;color:#64748b;font-size:11px}@media(max-width:1240px){.c311 .operatorInboxShell{grid-template-columns:300px 1fr}.c311 .operatorCustomerPane{display:none}}@media(max-width:860px){.c311 .operatorInboxShell{grid-template-columns:1fr;height:auto;min-height:0}.c311 .operatorConversationPane{max-height:400px;border-right:0;border-bottom:1px solid #dfe6ee}.c311 .operatorChatPane{min-height:620px}.c311 .inboxTopbar{align-items:flex-start;flex-direction:column}.c311 .operatorBubble{max-width:88%}}.c32Composer{height:auto!important;min-height:64px;align-items:flex-end!important;padding:10px 12px!important}.c32Composer .composerEditor{flex:1 1;min-width:0}.c32Composer textarea{display:block;width:100%;min-height:40px;max-height:120px;resize:vertical;border:1px solid #cfd9e3;border-radius:11px;background:#fff;color:#172033;padding:10px 12px;font:inherit;font-size:12px;line-height:1.45;outline:none;box-sizing:border-box}.c32Composer textarea:focus{border-color:#64a9df;box-shadow:0 0 0 3px rgba(55,139,202,.12)}.c32Composer textarea:disabled{background:#f4f6f8;color:#94a3b8;cursor:not-allowed}.c32Composer .sendButton{height:40px;min-width:78px;padding:0 16px;border:0;border-radius:10px;background:#1477bd;color:#fff;font-weight:800;cursor:pointer}.c32Composer .sendButton:hover:not(:disabled){background:#0f68a8}.c32Composer .sendButton:disabled{background:#c8d7e2;color:#758795;cursor:not-allowed}.c32Composer .composerError{margin:5px 3px 0;color:#b42318;font-size:9.5px;line-height:1.3}.c311 .deliveryState{font-weight:700}.c311 .deliveryState.queued,.c311 .deliveryState.sending{color:#64748b}.c311 .deliveryState.sent{color:#187a5c}.c311 .deliveryState.failed{color:#a16207}.c311 .deliveryState.dead{color:#b42318}.shell{min-height:100vh}.main,.shell{height:100vh;overflow:hidden}.main{min-height:0;box-sizing:border-box}.operatorInboxPage.c311{height:100%;min-height:0;display:flex;flex-direction:column;overflow:hidden}.operatorInboxPage.c311 .inboxTopbar{flex:0 0 auto}.operatorInboxPage.c311 .operatorInboxShell{flex:1 1 auto;height:auto!important;min-height:0!important;overflow:hidden}.operatorInboxPage.c311 .operatorChatPane,.operatorInboxPage.c311 .operatorConversationPane,.operatorInboxPage.c311 .operatorCustomerPane{min-height:0}.operatorInboxPage.c311 .operatorConversationList{min-height:0;overflow-y:auto}.operatorInboxPage.c311 .operatorMessageList{flex:1 1 auto;min-height:0;overflow-y:auto}.operatorInboxPage.c311 .operatorComposer{flex:0 0 auto;position:relative;z-index:2}.operatorInboxPage.c311 .operatorCustomerPane{overflow-y:auto}@media (max-width:860px){.shell{min-height:100vh}.main,.operatorInboxPage.c311,.shell{height:auto;overflow:visible}.operatorInboxPage.c311 .operatorInboxShell{height:auto!important}}