:root{font-family:Inter,"Microsoft YaHei",system-ui,sans-serif;color:#24242a;background:#f8f6fb;--purple:#7156e8;--purple-soft:#eee9ff;--orange:#f56b22;--line:#ece9f1;--muted:#8b8794}*{box-sizing:border-box}body{margin:0;overflow:hidden}.workspace{height:100vh;display:flex;background:#faf8fc}.rail{width:74px;background:#767789;color:#fff;display:flex;align-items:center;flex-direction:column;padding:14px 0;gap:12px}.rail-logo{width:48px;height:48px;border-radius:16px;background:#6754e8;display:grid;place-items:center;font-size:25px;margin-bottom:6px}.rail-btn{width:46px;height:46px;border:0;border-radius:14px;background:#56596a;color:white;font-size:22px;cursor:pointer;opacity:.9}.rail-btn.active{background:#6d57eb}.rail-btn:hover{filter:brightness(1.08)}.rail-spacer{flex:1}.app-shell{flex:1;min-width:0;display:flex;flex-direction:column}.topbar{height:74px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 24px}.brand{display:flex;align-items:center;gap:13px}.brand b{font-size:20px}.brand span{font-size:13px;color:var(--muted)}.top-actions{display:flex;align-items:center;gap:12px}.status-chip{padding:7px 12px;border-radius:8px;font-size:12px;font-weight:700}.status-chip.on{color:#d94d52;background:#ffe9eb}.status-chip.off{color:#777;background:#f2f1f3}.btn{border:0;border-radius:10px;padding:10px 14px;cursor:pointer;font:inherit}.btn.small{padding:8px 12px}.btn.orange{background:var(--orange);color:#fff;font-weight:700}.btn.ghost{background:#fff;border:1px solid #dedbe3}.seat{display:flex;align-items:center;gap:8px;padding-left:8px}.seat-avatar{width:36px;height:36px;border-radius:50%;background:#7460e9;color:#fff;display:grid;place-items:center;font-weight:800}.seat small{display:block;color:#7359e8;font-size:11px;margin-top:2px}.three-col{flex:1;min-height:0;display:grid;grid-template-columns:360px minmax(460px,1fr) 320px}.conversation-panel,.profile-panel{background:#fff;min-height:0}.conversation-panel{border-right:1px solid var(--line);display:flex;flex-direction:column}.panel-title{font-size:18px;font-weight:800;padding:18px 18px 10px}.tabs{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 14px 12px}.tab{border:0;border-radius:9px;padding:9px;background:#fff;color:#514f58;font-weight:700;cursor:pointer}.tab.active{background:#e9e0ff;color:#6d55de}.search-wrap{padding:0 14px 14px}.search-wrap input{width:100%;border:1px solid #dcd8e3;border-radius:13px;padding:11px 14px;font:inherit;outline:none}.sessions{overflow:auto}.session{position:relative;display:flex;align-items:center;gap:10px;margin:0 10px 4px;padding:12px 10px;border-radius:16px;cursor:pointer}.session:hover,.session.active{background:#ece5ff}.session-check{display:flex;align-items:center}.session-check input{width:17px;height:17px}.avatar{width:42px;height:42px;border-radius:50%;background:#22bf5a;color:#fff;display:grid;place-items:center;font-weight:800}.sbody{min-width:0;flex:1}.srow{display:flex;align-items:center;justify-content:space-between;gap:8px}.srow span,.preview{font-size:12px;color:#8f8b98}.preview{margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.session i{position:absolute;right:8px;bottom:9px;background:#ef4554;color:white;border-radius:50%;min-width:20px;height:20px;display:grid;place-items:center;font-size:11px;font-style:normal}.no-data{padding:36px;text-align:center;color:#9b97a4}.chat-panel{min-width:0;min-height:0;background:#fbf7ff}.empty-state{height:100%;display:grid;place-items:center;align-content:center;gap:10px;color:#a6a0af}.empty-icon{font-size:42px}.chat{height:100%;display:flex;flex-direction:column}.chat-head{height:76px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 18px}.chat-user{display:flex;align-items:center;gap:11px}.chat-avatar{width:38px;height:38px;border-radius:7px;background:#22c35c;color:white;display:grid;place-items:center;font-weight:800}.subtle{font-size:12px;color:#9792a1;margin-top:3px}.pin-btn{border:0;background:none;font-size:20px;cursor:pointer}.messages{flex:1;overflow:auto;padding:20px 7%;background:#fbf6ff}.msg{margin:14px 0;display:flex;flex-direction:column;align-items:flex-start}.msg.out{align-items:flex-end}.msg-line{display:flex;align-items:flex-end;gap:8px;max-width:86%}.bubble{max-width:680px;padding:10px 14px;border-radius:17px;background:#eeeef3;color:#2e2c33;white-space:pre-wrap;word-break:break-word;box-shadow:0 1px 1px #00000008}.msg.out .bubble{background:#7258e7;color:#fff}.mini-avatar,.agent-tag{width:32px;height:32px;border-radius:7px;display:grid;place-items:center;font-weight:800}.mini-avatar{background:#22bf5a;color:#fff}.agent-tag{background:#d8ffe2;color:#199849}.msg time{font-size:11px;color:#938d9e;margin:5px 42px}.msg.out time{text-align:right}.composer-area{background:#fff;border-top:1px solid var(--line);padding:8px 14px 14px}.composer-tools{display:flex;gap:14px;padding:4px 2px 8px}.composer-tools button{border:0;background:transparent;font-size:20px;cursor:pointer}.composer{display:grid;grid-template-columns:1fr 54px;gap:10px;align-items:end}.composer textarea{width:100%;border:1px solid #dbd6e5;border-radius:18px;padding:12px 14px;resize:none;font:inherit;outline:none;min-height:70px}.send-btn{width:50px;height:50px;border:0;border-radius:50%;background:#755bea;color:white;font-size:24px;cursor:pointer}.profile-panel{border-left:1px solid var(--line);overflow:auto}.profile-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:15px}.profile-tab{border:0;background:#fff;border-radius:10px;padding:10px;font:inherit;color:#777;cursor:pointer}.profile-tab.active{background:#eee9ff;color:#7059df;font-weight:800}.profile-empty{padding:60px 20px;text-align:center;color:#9a95a3}.profile-body{padding:0 18px 20px}.profile-hero{text-align:center;padding:12px 0 20px}.profile-avatar{width:72px;height:72px;background:#22bf5a;color:#fff;font-size:34px;font-weight:800;display:grid;place-items:center;margin:0 auto 10px}.profile-hero h3{margin:4px 0}.profile-type{color:#8d8797;font-size:12px}.profile-list{border-top:1px solid var(--line)}.profile-list>div{display:grid;grid-template-columns:112px 1fr;gap:8px;padding:13px 2px;border-bottom:1px solid var(--line);font-size:13px}.profile-list span{color:#8e8997}.profile-list strong{text-align:right;font-weight:500;word-break:break-all}.online-dot{color:#26b55a!important}.wide{width:100%;border:0;border-radius:12px;padding:12px;margin-top:14px;font-weight:800;cursor:pointer}.purple{background:#7259e7;color:#fff}.danger-soft{background:#ffe6e1;color:#6e3333}.hidden{display:none!important}.modal{position:fixed;inset:0;background:#0007;display:grid;place-items:center;z-index:50}.modal-card{width:410px;max-width:92vw;background:#fff;border-radius:18px;padding:28px;text-align:center;position:relative}.modal-card img{width:310px;max-width:100%}.modal-card h2{margin-top:8px}.x{position:absolute;right:14px;top:10px;border:0;background:transparent;font-size:28px;cursor:pointer}.verify-wrap{display:flex;gap:8px}.verify-wrap input{flex:1;border:1px solid #ddd;border-radius:9px;padding:10px}@media(max-width:1100px){.three-col{grid-template-columns:320px 1fr}.profile-panel{display:none}}@media(max-width:760px){.rail{display:none}.three-col{grid-template-columns:110px 1fr}.conversation-panel .panel-title,.tabs,.search-wrap,.session-check,.sbody{display:none}.session{justify-content:center}.topbar{padding:0 10px}.seat{display:none}}

.chat-head-actions{display:flex;align-items:center;gap:8px}.sync-history-btn{border:1px solid #ddd7ef;background:#fff;color:#6a55d7;border-radius:9px;padding:7px 10px;font:inherit;font-size:12px;font-weight:700;cursor:pointer}.sync-history-btn:hover{background:#f1ecff}.sync-history-btn:disabled{opacity:.55;cursor:wait}


/* inbound media */
.msg-content{display:flex;flex-direction:column;gap:7px;max-width:680px}.chat-image{display:block;max-width:min(360px,60vw);max-height:420px;border-radius:12px;object-fit:contain;background:#eee}.chat-video{display:block;max-width:min(420px,65vw);max-height:420px;border-radius:12px;background:#111}.media-link{display:block}.voice-card{min-width:180px;max-width:360px;padding:10px 12px;border-radius:14px;background:#eeeef3;display:flex;gap:8px;align-items:center;flex-wrap:wrap}.voice-card audio{width:220px;max-width:100%;height:34px}.voice-card small{width:100%;color:#666}.file-card{display:flex;align-items:center;gap:8px;padding:11px 13px;border-radius:13px;background:#eeeef3;color:#383542;text-decoration:none;max-width:360px;word-break:break-all}.media-error{padding:10px 12px;border-radius:12px;background:#fff2e7;color:#a05b21}.msg.out .voice-card,.msg.out .file-card{background:#eae5ff}
.purple-mini{background:#7058e8;color:#fff;font-weight:700}.entry-card{width:470px}.entry-card img{width:300px;max-width:100%;border:1px solid #eee;border-radius:12px}.entry-help{color:#777;font-size:13px;line-height:1.6}.entry-url{margin:12px 0 6px;padding:10px;border-radius:10px;background:#f6f4fa;word-break:break-all;font-size:12px;text-align:left}.entry-count{color:#6e59dc;font-weight:700;margin:8px 0}.entry-actions{display:flex;gap:10px;justify-content:center;margin-top:12px}


/* customer profile / blacklist / visitor details */
.session.blocked{opacity:.72}.blocked-badge{display:inline-block;margin-left:6px;padding:1px 5px;border-radius:999px;background:#ffe1df;color:#c6463d;font-style:normal;font-size:10px;vertical-align:1px}.danger-text{color:#d64842!important}.wide.unblock{background:#e5f6e9;color:#2d8b46}.detail-soft{background:#eef0ff;color:#5b56c7}.customer-edit-card{width:560px;max-width:94vw;text-align:left}.customer-edit-card h2,.visitor-detail-card h2{text-align:center}.customer-form{display:grid;gap:12px;margin-top:18px}.customer-form label{display:grid;gap:6px;font-size:13px;color:#666}.customer-form input,.customer-form textarea,.customer-form select{width:100%;box-sizing:border-box;border:1px solid #ddd7e6;border-radius:10px;padding:10px 12px;font:inherit;background:#fff;outline:none}.customer-form input:focus,.customer-form textarea:focus,.customer-form select:focus{border-color:#7b64ea;box-shadow:0 0 0 3px #7b64ea16}.customer-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.visitor-detail-card{width:620px;max-width:94vw;text-align:left}.visitor-detail{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;margin-top:18px}.visitor-detail>div{display:grid;grid-template-columns:110px 1fr;gap:8px;padding:11px 0;border-bottom:1px solid #eee}.visitor-detail span{color:#8b8694}.visitor-detail b{font-weight:600;word-break:break-all}@media(max-width:700px){.customer-form-grid,.visitor-detail{grid-template-columns:1fr}}

/* full visitor list page */
.visitor-page{flex:1;min-height:0;overflow:auto;padding:22px 26px 36px;background:#fbf8ff}.visitor-page-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.visitor-page-head h2{margin:0;font-size:22px}.visitor-page-head p{margin:5px 0 0;color:#938d9e;font-size:13px}.visitor-stats{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr));gap:18px;margin-bottom:18px}.visitor-stats article{position:relative;background:#fff;border:1px solid #eee9f4;border-radius:22px;padding:22px 22px 26px;box-shadow:0 6px 18px #452c6f12;overflow:hidden}.visitor-stats article::after{content:"";position:absolute;right:-26px;top:-32px;width:92px;height:92px;border-radius:50%;background:#eef4ff}.visitor-stats article:nth-child(2)::after{background:#eff8ef}.visitor-stats article:nth-child(3)::after{background:#fff2e8}.visitor-stats article:nth-child(4)::after{background:#f1efff}.visitor-stats span{display:block;color:#4c4854;font-size:15px}.visitor-stats b{display:block;margin-top:8px;font-size:27px}.visitor-filters{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}.visitor-filter{border:1px solid #dbd5e8;background:#fff;border-radius:999px;padding:10px 16px;cursor:pointer;font-weight:700;color:#666}.visitor-filter.active{background:#7358e8;color:#fff;border-color:#7358e8}.visitor-table-wrap{background:#fff;border:1px solid #eee9f4;border-radius:22px;padding:14px 18px 18px;box-shadow:0 6px 18px #452c6f12;overflow:auto}.visitor-table{width:100%;border-collapse:collapse;min-width:940px}.visitor-table th,.visitor-table td{padding:14px 12px;border-bottom:1px solid #eeeaf2;text-align:left;font-size:13px;vertical-align:middle}.visitor-table th{color:#55505d;font-weight:800;background:#fbfbfd;position:sticky;top:0;z-index:1}.visitor-person{display:flex;align-items:center;gap:9px}.visitor-avatar{width:34px;height:34px;border-radius:8px;background:#24bf5b;color:#fff;display:grid;place-items:center;font-weight:800}.table-link{border:0;background:transparent;padding:3px 2px;color:#6656dd;cursor:pointer;font:inherit}.table-link:hover{text-decoration:underline}.danger-action{color:#d54b48}.reply-state,.session-state,.list-state{display:inline-flex;align-items:center;border-radius:999px;padding:5px 10px;font-size:12px;white-space:nowrap}.reply-state.done{background:#e8f7eb;color:#2b9950}.reply-state.waiting{background:#fff0d9;color:#b47213}.session-state{background:#e7f2ff;color:#377abe}.list-state.normal{background:#e5f4e7;color:#2f9b4b}.list-state.blocked{background:#ffe4df;color:#c94b42}.visitor-actions{display:flex;gap:12px;align-items:center;white-space:nowrap}.visitor-empty{text-align:center;padding:40px;color:#999}.rail-btn[title="访客列表"].active{background:#6d57eb}.purple-mini{background:#7058e8;color:#fff;font-weight:700}.entry-card{width:470px}.entry-card img{width:300px;max-width:100%;border:1px solid #eee;border-radius:12px}.entry-help{color:#777;font-size:13px;line-height:1.6}.entry-url{margin:12px 0 6px;padding:10px;border-radius:10px;background:#f6f4fa;word-break:break-all;font-size:12px;text-align:left}.entry-count{color:#6e59dc;font-weight:700;margin:8px 0}.entry-actions{display:flex;gap:10px;justify-content:center;margin-top:12px}
@media(max-width:1050px){.visitor-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.visitor-page{padding:14px}.visitor-stats{grid-template-columns:1fr 1fr;gap:10px}.visitor-filters{grid-template-columns:1fr 1fr}.visitor-page-head p{display:none}}
.dashboard-page{flex:1;overflow:auto;padding:22px;background:#fbf8fd}.dashboard-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.dashboard-head h2{margin:0;font-size:20px}.dashboard-cards{display:grid;grid-template-columns:repeat(4,minmax(180px,1fr));gap:18px}.dashboard-cards article{min-height:150px;background:#fff;border:1px solid #eee8f1;border-radius:24px;padding:24px;display:flex;gap:18px;align-items:flex-start;box-shadow:0 8px 20px #4e3f6414}.dashboard-cards article div{display:flex;flex-direction:column;gap:10px;font-size:16px}.dashboard-cards article b{font-size:24px}.dash-icon{width:58px;height:58px;border-radius:16px;display:grid;place-items:center;font-size:26px;font-weight:800;box-shadow:0 4px 10px #0002}.dash-icon.blue{background:#bfe4ff;color:#1764a8}.dash-icon.green{background:#c8efc9;color:#25813c}.dash-icon.orange{background:#ffe2a9;color:#d27b00}.dash-icon.purple{background:#e4d4ff;color:#6f50dc}.trend-card{margin-top:28px;background:#fff;border:1px solid #eee8f1;border-radius:24px;padding:28px;min-height:300px;box-shadow:0 8px 20px #4e3f6414}.trend-title{font-size:18px;margin-bottom:26px}.trend-chart{height:220px;display:grid;grid-template-columns:repeat(7,1fr);gap:22px;align-items:end;border-bottom:1px solid #eee8f1;padding:0 30px 18px}.trend-col{height:190px;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:9px;color:#888392;font-size:12px}.trend-bar-wrap{height:165px;width:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}.trend-count{font-size:11px;color:#6c58e8;margin-bottom:4px}.trend-bar{width:20px;border-radius:5px 5px 0 0;background:#7058ea;min-height:2px}@media(max-width:1200px){.dashboard-cards{grid-template-columns:repeat(2,minmax(180px,1fr))}}

/* emoji + outbound media */
.composer-area{position:relative}
.composer-tools button{cursor:pointer;border:0;background:transparent;font-size:20px;padding:5px 8px;border-radius:8px}
.composer-tools button:hover{background:#f0ebff}
.composer-tools button:disabled{opacity:.45;cursor:not-allowed}
.media-send-status{font-size:12px;color:#6e61a9;margin-left:6px}
.emoji-panel{position:absolute;left:16px;bottom:92px;z-index:30;width:310px;max-height:220px;overflow:auto;background:#fff;border:1px solid #e9e3f5;border-radius:16px;box-shadow:0 12px 36px #3d2f6d26;padding:10px;display:grid;grid-template-columns:repeat(8,1fr);gap:4px}
.emoji-panel.hidden{display:none}
.emoji-panel button{border:0;background:transparent;border-radius:8px;font-size:23px;line-height:36px;height:38px;cursor:pointer}
.emoji-panel button:hover{background:#f2edff}

/* productivity: pinned conversations, customer tags, unanswered reminders */
.pin-btn.active{background:#fff3c8;border-radius:9px;padding:5px 8px;box-shadow:0 0 0 1px #f2d36d inset}.session.is-pinned{box-shadow:inset 3px 0 0 #f2b544}.inline-pin{font-size:12px}.session-tags{display:flex;gap:4px;flex-wrap:wrap;margin-top:5px}.session-tags span{font-size:10px;line-height:1;padding:4px 6px;border-radius:999px;background:#f0ebff;color:#6c54d9;max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.reply-reminder{display:inline-flex;margin-top:6px;padding:4px 7px;border-radius:999px;font-size:10px;font-weight:800}.reply-reminder.due{background:#fff2c7;color:#9b6d00}.reply-reminder.warn{background:#ffe5cc;color:#bf6200}.reply-reminder.critical{background:#ffe0e3;color:#c62d3e}.session.needs-reply{background-image:linear-gradient(90deg,#fff9f2 0,transparent 55%)}.session.active.needs-reply{background-image:linear-gradient(90deg,#f1e9ff 0,#fff6ee 100%)}.reminder-control{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 14px 12px;font-size:11px;color:#888291}.reminder-control select{border:1px solid #ddd7e7;background:white;border-radius:8px;padding:5px 7px;color:#5b5664;outline:none}.customer-tags-box{padding:0 2px 14px;margin-bottom:4px;border-bottom:1px solid var(--line)}.customer-tags-head{display:flex;align-items:center;justify-content:space-between;color:#8e8997;font-size:13px;margin-bottom:9px}.customer-tags-head button{border:0;background:#eee9ff;color:#6b54de;border-radius:8px;padding:5px 8px;cursor:pointer;font-weight:700}.customer-tags{display:flex;gap:6px;flex-wrap:wrap}.customer-tag{border:0;border-radius:999px;padding:6px 9px;background:#efeaff;color:#654bd5;cursor:pointer;font-size:11px}.customer-tag:hover{background:#ffe6e6;color:#b53d3d}.tags-empty{font-size:12px;color:#aaa4b0}


/* login page */
.login-body{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#fff5ef,#f5f6f8)}
.login-card{width:min(430px,92vw);background:#fff;border:1px solid #e6e8ec;border-radius:18px;padding:36px;box-shadow:0 20px 60px #0001}
.lobster{font-size:42px}
.login-card h1{margin:8px 0}
.login-card p{color:#7c8490}
.login-card label{display:block;margin:18px 0 7px}
.login-card input{width:100%;border:1px solid #dfe3e8;border-radius:10px;padding:12px 14px;font:inherit;outline:none}
.login-card button{width:100%;margin-top:22px;border:0;border-radius:10px;padding:12px;background:#ec641f;color:#fff;font-weight:700;cursor:pointer}
.login-card .error{color:#d33;margin-top:12px}