:root{font-family:Inter,"Microsoft YaHei","PingFang SC",system-ui,sans-serif;color:#1e304a;background:#f2f5fa;font-synthesis:none;font-size:14px;--blue:#2168d6;--muted:#7a879b;--line:#e5ebf3}*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}button,a,label.tool-button{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0}button:disabled{opacity:.45;cursor:not-allowed}a{color:var(--blue);text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #91b9ff;outline-offset:2px}[hidden]{display:none!important}h1,h2,h3,p{margin:0}input,textarea{color:#23364f}textarea{resize:none;line-height:1.6}img{max-width:100%}.primary{background:var(--blue);color:white;border-radius:9px;padding:11px 18px;font-weight:600;white-space:nowrap}.primary:hover{background:#195abd}.subtle{background:#f0f4fa;color:#4b6181;border:1px solid #e0e7f1;border-radius:8px;padding:8px 12px;white-space:nowrap}.subtle:hover{background:#e6edf8}.customer-page{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px 16px 12px;background:radial-gradient(ellipse at 18% 10%,#e2edff,transparent 55%),#f1f5fb}.customer-shell{width:min(100%,700px);height:min(850px,calc(100dvh - 75px));min-height:480px;background:white;display:flex;flex-direction:column;border-radius:20px;overflow:hidden;box-shadow:0 16px 70px #2e528417;border:1px solid #dce7f5}.chat-header{background:linear-gradient(110deg,#1f62cc,#2879e5);color:white;display:flex;gap:13px;align-items:center;padding:22px 26px}.chat-header img{border:2px solid #ffffff75;border-radius:17px}.chat-header h1{font-size:18px;font-weight:650;letter-spacing:.5px}.chat-header p{font-size:12px;color:#d8e9ff;margin-top:6px;display:flex;align-items:center;gap:6px}.status-dot{width:6px;height:6px;background:#79e3b4;border-radius:50%}.header-mark{margin-left:auto;letter-spacing:3px;font-size:11px;opacity:.7}.privacy-banner{font-size:11px;background:#f7faff;border-bottom:1px solid #edf1f7;padding:12px 24px;display:flex;gap:7px;color:#7188a7;align-items:center}#visitor-name{margin-left:auto}.messages{flex:1;min-height:0;overflow-y:auto;padding:26px 24px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#d9e2ef transparent;background:#fbfcfe}.welcome-card{padding:24px 22px;background:white;border:1px solid #e9eef6;border-radius:15px;max-width:440px;margin:8px auto 28px;box-shadow:0 3px 14px #2d568004}.eyebrow{display:block;font-size:10px;letter-spacing:2px;color:#8ca4c3;font-weight:600;margin-bottom:12px}.welcome-card h2{font-size:19px;font-weight:650;margin-bottom:12px}.welcome-card p{line-height:1.9;font-size:13px;color:#7e8ca1}.welcome-tags{display:flex;gap:8px;margin-top:20px}.welcome-tags span{font-size:11px;color:#5a81b8;background:#f0f6ff;border-radius:5px;padding:5px 9px}.date-divider{margin:15px 0 22px;text-align:center;color:#9aa7b9;font-size:11px}.message-row{display:flex;align-items:flex-end;gap:9px;margin-bottom:19px}.message-row.own{justify-content:flex-end}.bubble-avatar{width:30px;height:30px;border-radius:11px;align-self:flex-start;margin-top:18px}.message-stack{max-width:78%;min-width:45px;display:flex;flex-direction:column;align-items:flex-start;gap:5px}.own .message-stack{align-items:flex-end}.message-author{font-size:11px;color:#8292a9;padding:0 2px}.bubble{padding:11px 15px;border-radius:13px 13px 13px 3px;background:white;border:1px solid #e4eaf3;box-shadow:0 2px 4px #23476f03;max-width:100%;line-height:1.7}.bubble p{white-space:pre-wrap;overflow-wrap:anywhere}.own .bubble{background:#246bd4;color:#fff;border-color:transparent;border-radius:13px 13px 3px 13px}.message-image{display:block;max-width:260px;max-height:300px;border-radius:8px;object-fit:contain}.message-time{font-size:10px;color:#9ba8ba;margin:1px 3px}.composer{background:#fff;border-top:1px solid var(--line);padding:11px 22px 15px;flex-shrink:0;position:relative}.composer-tools{display:flex;align-items:center;gap:3px;margin-bottom:6px}.tool-button{display:inline-flex;align-items:center;justify-content:center;background:none;color:#6e83a2;font-size:25px;width:34px;height:32px;border-radius:7px;cursor:pointer}.tool-button:hover{background:#edf4ff}.composer-hint{font-size:10px;color:#9ba8ba;margin-left:auto}.input-row{display:flex;gap:12px;align-items:flex-end}.input-row textarea{flex:1;width:0;background:#f6f8fc;border:1px solid #e9edf5;min-height:46px;max-height:110px;border-radius:10px;padding:11px 13px}.input-row textarea::placeholder{color:#98a5b9}.send-button{height:46px;padding:0 21px}.send-button span{padding-left:8px}.input-footnote{color:#a1adbf;font-size:10px;margin-top:9px;display:flex;justify-content:space-between;gap:8px}.outside-footer{color:#a1aec1;font-size:11px;letter-spacing:2px;margin-top:17px}.emoji-panel{position:absolute;bottom:104px;left:20px;padding:10px;background:#fff;box-shadow:0 4px 25px #25497d22;border:1px solid var(--line);border-radius:10px;display:flex;gap:4px;z-index:2}.emoji-panel button{padding:4px;background:none;font-size:23px;border-radius:5px}.emoji-panel button:hover{background:#edf4ff}.notice{font-size:12px;color:#af6625;background:#fff9ed;text-align:center;padding:9px 15px}.notice:empty{display:none}.expired-bar{display:flex;gap:16px;align-items:center;padding:18px;background:#fff6e8;font-size:12px;justify-content:space-between}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.admin-page{height:100dvh;overflow:hidden}.login-view{min-height:100dvh;display:grid;place-items:center;padding:24px;background:radial-gradient(ellipse at top,#e0ecff,transparent 65%)}.login-card{width:min(100%,390px);padding:36px;background:white;border:1px solid #e3ebf6;box-shadow:0 15px 60px #2d568012;border-radius:20px}.login-card>img{display:block;margin-bottom:24px}.login-card h1{font-size:25px;margin-bottom:9px}.login-card p{color:var(--muted);font-size:13px;margin-bottom:27px}label:not(.tool-button){display:block}label input,dialog textarea{display:block;width:100%;margin:8px 0 19px;border:1px solid #dce4f0;border-radius:8px;padding:12px;background:#fbfcfe}.login-card label,dialog label{font-size:12px;font-weight:550;color:#5e7190}.login-card .primary{width:100%;margin-top:6px}.login-card small{display:block;margin-top:23px;font-size:10px;line-height:1.9;color:#9ba7b9}.error{color:#c44646;font-size:12px;margin-top:12px}.workspace{height:100dvh;display:flex;flex-direction:column;background:#fff}.admin-header{height:76px;flex-shrink:0;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 26px;gap:15px}.brand{display:flex;gap:12px;align-items:center}.brand strong{font-size:16px;display:block}.brand div>span{display:block;font-size:10px;color:#92a0b5;letter-spacing:1px;margin-top:5px}.admin-actions{display:flex;gap:14px;align-items:center;font-size:12px}#online-agents{color:#6c9e8a;font-size:11px}#self-name{color:#5c7292}.admin-body{display:flex;min-height:0;flex:1}.inbox{width:320px;border-right:1px solid var(--line);display:flex;flex-direction:column;background:#fff;flex-shrink:0}.inbox-heading{padding:24px 20px 18px;display:flex;align-items:center;justify-content:space-between;gap:5px}.inbox-heading h2{font-size:16px}#conversation-count{background:#edf3fd;color:#4e7cba;border-radius:6px;padding:3px 7px;margin-left:5px;font-size:11px}.connection-label{font-size:10px;color:#699b85}.search-field{display:flex!important;align-items:center;background:#f6f8fc;border-radius:8px;margin:0 18px;padding:0 11px;color:#8fa0b8}.search-field input{padding:10px;border:0;background:none;margin:0;font-size:12px;min-width:0}.filters{display:flex;gap:3px;margin:16px 18px 10px;padding:3px;background:#f4f7fb;border-radius:8px}.filters button{flex:1;border-radius:6px;background:none;padding:8px;color:#8b99ad;font-size:12px}.filters button.active{background:white;color:#276bc8;box-shadow:0 1px 6px #264d7e10;font-weight:600}.conversation-list{overflow-y:auto;flex:1;min-height:0;padding:4px 10px}.conversation-card{display:flex;gap:11px;width:100%;padding:16px 11px;text-align:left;background:white;border-radius:10px;border:1px solid transparent;margin-bottom:3px}.conversation-card:hover{background:#f7faff}.conversation-card.selected{background:#edf4ff;border-color:#e1ecfc}.visitor-icon{flex-shrink:0;display:grid;place-items:center;width:38px;height:38px;background:#e9eff8;border-radius:13px;font-weight:600;color:#6c8cb5;font-size:12px}.selected .visitor-icon{background:#dceaff;color:#3274cf}.card-main{flex:1;min-width:0}.card-title{display:flex;justify-content:space-between;align-items:center;font-weight:600;font-size:13px;gap:5px}.card-title time{font-size:10px;font-weight:400;color:#9ca9ba}.card-preview{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;color:#92a0b4;margin-top:7px;min-height:18px}.card-footer{font-size:10px;color:#7291b3;display:flex;justify-content:space-between;align-items:center;margin-top:8px}.unread-badge{background:var(--blue);color:white;border-radius:9px;padding:2px 6px;min-width:18px;text-align:center}.list-empty{font-size:12px;color:#97a5b9;padding:25px 15px;text-align:center}.retention-card{background:#f8fafe;border-top:1px solid var(--line);padding:17px 21px;display:flex;flex-direction:column;gap:7px;font-size:10px;color:#94a5ba}.retention-card strong{font-size:11px;color:#6d88ab;font-weight:500}.retention-card small{font-size:10px;color:#b0bbca}.conversation-panel{flex:1;min-width:0;display:flex;flex-direction:column;background:#fbfcfe}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;text-align:center;padding:30px;color:#8d9db3}.empty-state img{margin-bottom:25px;opacity:.85}.empty-state h2{font-size:20px;font-weight:600;color:#58708f;margin-bottom:13px}.empty-state p{font-size:13px;line-height:1.9}.empty-state a{font-size:12px;margin-top:25px;background:#edf4ff;padding:10px 16px;border-radius:8px}.selected-conversation{display:flex;flex:1;flex-direction:column;min-height:0}.conversation-header{padding:20px 26px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:12px;background:white}.conversation-header h2{font-size:17px}.conversation-header p{font-size:11px;color:#96a5b9;margin-top:6px}.conversation-actions{display:flex;gap:7px}.conversation-actions button{font-size:11px;padding:9px 12px}.assignment-notice{background:#f4f8ff;padding:10px 26px;color:#728dae;font-size:11px}.admin-page .messages{padding:20px 30px}.admin-page .message-stack{max-width:70%}.notes-panel{background:#fff;border-top:1px solid var(--line);padding:10px 25px;font-size:11px;color:#869ab7}.notes-panel summary{cursor:pointer;user-select:none}.notes-panel textarea{width:100%;display:block;margin:10px 0;border:1px solid var(--line);border-radius:6px;padding:10px}.notes-panel button{font-size:11px}.admin-page .composer{padding:10px 26px 13px}.mobile-only{display:none}dialog{border:1px solid var(--line);border-radius:16px;box-shadow:0 15px 80px #16365e25;padding:25px;width:min(460px,90vw);max-height:90dvh;overflow:auto;color:#2e4563}dialog::backdrop{background:#102a4866}.dialog-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.dialog-heading h2{font-size:19px}dialog h3{font-size:14px;margin-bottom:18px}dialog form+form{margin-top:25px;padding-top:22px;border-top:1px solid var(--line)}dialog .primary{font-size:12px}.settings-result{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;color:#426fa6;line-height:1.8;margin-top:16px}@media(min-width:1400px){.inbox{width:355px}.admin-page .messages{padding-left:7%;padding-right:7%}.admin-page .composer{padding-left:7%;padding-right:7%}}@media(max-width:760px){.customer-page{padding:0;justify-content:flex-start}.customer-shell{width:100%;height:100dvh;min-height:0;border:0;border-radius:0;box-shadow:none}.outside-footer{display:none}.chat-header{padding:18px}.chat-header h1{font-size:16px}.header-mark{font-size:10px}.privacy-banner{padding:11px 17px;font-size:10px}.messages{padding:20px 16px}.welcome-card{padding:23px 20px;margin-top:6px}.welcome-card h2{font-size:18px}.composer{padding:10px 16px max(12px,env(safe-area-inset-bottom))}.composer-hint{font-size:9px}.input-row{gap:8px}.send-button{padding:0 15px}.input-footnote{font-size:9px}.message-stack{max-width:83%}.message-image{max-width:min(235px,55vw)}.expired-bar{flex-direction:column}.admin-header{height:65px;padding:0 15px}.brand strong{font-size:14px}.brand div>span{display:none}.brand img{width:32px;height:32px}.admin-actions{gap:7px}.admin-actions .subtle{font-size:10px;padding:7px}#online-agents{display:none}#self-name{font-size:11px}.inbox{width:100%;border:0}.conversation-panel{display:none}.workspace.has-selection .inbox{display:none}.workspace.has-selection .conversation-panel{display:flex}.conversation-header{padding:14px 12px;flex-wrap:wrap;gap:9px}.conversation-header h2{font-size:15px}.conversation-header p{font-size:10px}.conversation-actions{margin-left:auto}.conversation-actions button{padding:8px;font-size:10px}.mobile-only{display:block;font-size:11px;padding:7px}.assignment-notice{padding:9px 16px;font-size:10px}.admin-page .messages{padding:20px 14px}.admin-page .message-stack{max-width:82%}.admin-page .composer{padding:8px 14px max(10px,env(safe-area-inset-bottom))}.notes-panel{padding:9px 16px}.login-card{padding:28px}.login-card small{font-size:10px}}@media(prefers-reduced-motion:no-preference){button{transition:background .15s,opacity .15s}}

.message-video{display:block;width:260px;max-width:100%;max-height:300px;background:#17211e;border-radius:5px}.attachment-link{display:flex;align-items:center;gap:10px;min-width:160px;max-width:260px;padding:6px 0;color:inherit;text-decoration:none}.attachment-link:hover{text-decoration:underline}.attachment-icon{font-size:30px;line-height:1;flex-shrink:0}.attachment-detail{min-width:0;display:flex;flex-direction:column;gap:3px}.attachment-detail strong{font-size:13px;line-height:1.5;font-weight:500;overflow-wrap:anywhere}.attachment-detail small{font-size:10px;opacity:.75}.tool-button:has(input:disabled){opacity:.45;cursor:not-allowed}.admin-page .emoji-panel{max-width:300px;flex-wrap:wrap}
