*{box-sizing:border-box}body{margin:0;font-family:Arial,"Microsoft YaHei",sans-serif;color:#172033}button,input,textarea,select{font:inherit}a{text-decoration:none;color:inherit}.login-bg,.chat-bg{min-height:100vh;background:#eef3fa;display:grid;place-items:center}.login-card{width:min(420px,92vw);background:#fff;padding:32px;border-radius:22px;box-shadow:0 20px 60px #20385825}.login-card input,.login-card button{width:100%;padding:13px;margin:8px 0;border:1px solid #d8e0ec;border-radius:12px}.login-card button,.settings-page button,.profile button,#send{background:#246bfd;color:#fff;border:0}.logo{display:inline-block;background:#246bfd;color:#fff;padding:12px;border-radius:14px}.error{background:#ffecef;color:#d22;padding:10px;border-radius:10px}.visitor{width:min(560px,100vw);height:min(820px,100vh);display:flex;flex-direction:column;background:#f4f7fb;box-shadow:0 20px 70px #20385825}.visitor header{display:flex;align-items:center;gap:12px;padding:18px;background:#246bfd;color:#fff}.visitor header nav{margin-left:auto;display:flex;gap:8px}.avatar{width:48px;height:48px;border-radius:15px;background:#ffffff25;display:grid;place-items:center;font-weight:bold}.visitor h2{margin:0}.visitor main,.chat main{flex:1;overflow:auto;padding:18px}.msg{position:relative;max-width:78%;padding:11px 14px;border-radius:15px;margin:9px 0;background:#fff;box-shadow:0 4px 12px #18365310;word-break:break-word}.visitor .msg.visitor,.chat .msg.admin{margin-left:auto;background:#246bfd;color:#fff}.visitor .msg.admin,.chat .msg.visitor{margin-right:auto;background:#fff;color:#172033}.msg.system{margin-right:auto}.msg img{display:block;max-width:280px;max-height:300px;border-radius:10px}.msg audio{max-width:260px}.msg small,.who{display:block;font-size:11px;opacity:.68;margin-top:5px}.who{margin:0 0 5px}.file{display:block;padding:9px;background:#ffffff22;border-radius:9px}.pending{opacity:.6}.failed{outline:2px solid #f44}.failed button{margin-left:8px}.typing{min-height:24px;padding:3px 18px;color:#7a8799;font-size:13px}.offline{margin:10px;padding:12px;background:#fff6d9;border-radius:14px}.offline input,.offline textarea{width:100%;padding:9px;margin:4px 0}.emoji{display:none;flex-wrap:wrap;padding:8px;background:#fff}.emoji.show{display:flex}.emoji button{border:0;background:#f2f5fa;padding:7px;font-size:20px}footer{display:flex;gap:8px;padding:12px;background:#fff;border-top:1px solid #e3e8f0}footer input{flex:1;padding:11px;border:1px solid #d7dfeb;border-radius:12px}footer button,footer label{padding:11px;border:0;border-radius:12px;background:#eef2f8}.top{height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;background:#172b4d;color:#fff}.top nav{display:flex;gap:18px}.top i{background:#246bfd;padding:3px 7px;border-radius:7px}.layout{height:calc(100vh - 62px);display:grid;grid-template-columns:300px minmax(360px,1fr) 320px;background:#dfe5ee;gap:1px}.list,.chat,.profile{background:#fff;overflow:auto}.list{padding:12px}.search{display:grid;grid-template-columns:1fr 90px 40px;gap:5px}.search input,.search select,.msearch input,.profile input,.profile textarea,.profile select,.settings-page input,.settings-page textarea,.settings-page select{width:100%;padding:10px;border:1px solid #d8e0ec;border-radius:10px}.bulk{display:flex;gap:6px;margin:8px 0}.bulk button{border:0;padding:7px;border-radius:8px}.conv{display:grid;grid-template-columns:22px 1fr;margin:6px 0;padding:10px;border-radius:12px}.conv.active,.conv:hover{background:#edf3ff}.conv a{position:relative}.conv small,.conv span{display:block;font-size:11px;color:#78869a;margin-top:3px}.conv em{position:absolute;right:0;top:0;background:#ff3e5f;color:#fff;border-radius:20px;padding:3px 7px;font-style:normal}.chat{display:flex;flex-direction:column}.chathead{padding:14px;display:flex;justify-content:space-between;border-bottom:1px solid #e2e8f0}.actions{display:flex}.actions form{margin-left:5px}.actions button,.msearch button{border:0;padding:8px;border-radius:9px}.msearch{display:flex;padding:7px}.recall{position:absolute;right:-8px;top:-8px;background:#ff4563;color:#fff;border:0;border-radius:15px;padding:4px 7px;font-size:11px}.recalled{opacity:.55;background:#eef1f5!important;color:#667!important}.quick{display:flex;gap:6px;padding:7px;overflow:auto}.quick button{white-space:nowrap;border:1px solid #d8e0ec;border-radius:18px;background:#fff;padding:7px}.profile{padding:16px}.profile dl{font-size:13px}.profile dt{color:#8490a2;margin-top:9px}.profile dd{margin:3px 0;word-break:break-all}.profile form{margin:12px 0}.profile textarea{min-height:90px}.danger{background:#e33!important}.empty{margin:auto}.settings-page{display:grid;grid-template-columns:2fr 1fr 1fr;gap:14px;padding:18px;background:#eef3fa;min-height:calc(100vh - 62px)}.settings-page section{background:#fff;border-radius:16px;padding:18px}.settings-page label{display:block;margin:10px 0}.settings-page textarea{min-height:90px}.settings-page button{padding:11px 15px;border-radius:10px}.row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.agent{padding:10px;background:#f4f7fb;margin:6px 0;border-radius:10px}.agent span{display:block;color:#78869a;font-size:12px}@media(max-width:1000px){.layout{grid-template-columns:240px 1fr}.profile{display:none}.settings-page{grid-template-columns:1fr 1fr}}@media(max-width:650px){.layout{grid-template-columns:95px 1fr}.list{padding:5px}.search,.bulk{display:none}.conv{grid-template-columns:1fr;padding:7px}.conv input,.conv small,.conv span{display:none}.top{font-size:12px;padding:0 8px}.top nav{gap:8px}.settings-page{grid-template-columns:1fr}.visitor{height:100vh}}

.hint{padding:10px 12px;background:#eef5ff;border-radius:10px;color:#42628a;font-size:13px;line-height:1.6}


/* v4.3: mobile message bubbles must size to their content */
.visitor #messages{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  min-height:0;
}
.visitor #messages .msg{
  display:block;
  flex:0 0 auto !important;
  width:fit-content;
  min-width:0;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  align-self:flex-start;
  white-space:normal;
}
.visitor #messages .msg.visitor{
  align-self:flex-end;
}
.visitor #messages .msg.admin,
.visitor #messages .msg.system{
  align-self:flex-start;
}
.visitor #messages .msg > span{
  display:block;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
@media(max-width:650px){
  .visitor #messages .msg{
    max-width:82%;
    padding:10px 13px;
    margin:7px 0;
  }
}


/* v4.4: admin message bubbles size to content, never stretch vertically */
.chat #messages{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  min-height:0;
}
.chat #messages .msg{
  display:block;
  flex:0 0 auto !important;
  width:fit-content;
  min-width:120px;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  align-self:flex-start;
  white-space:normal;
}
.chat #messages .msg.admin{
  align-self:flex-end;
}
.chat #messages .msg.visitor,
.chat #messages .msg.system{
  align-self:flex-start;
}
.chat #messages .msg > span{
  display:block;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
.notify-toggle{
  border:1px solid #ffffff55;
  background:#ffffff18;
  color:#fff;
  border-radius:10px;
  padding:7px 10px;
  cursor:pointer;
}
.reconnecting .top::after{
  content:"实时连接正在恢复…";
  position:fixed;
  left:50%;
  top:68px;
  transform:translateX(-50%);
  z-index:99;
  padding:7px 12px;
  border-radius:10px;
  color:#8a5a00;
  background:#fff1bd;
  box-shadow:0 4px 14px #0002;
  font-size:13px;
}
@media(max-width:650px){
  .chat #messages .msg{
    max-width:86%;
    min-width:0;
    padding:10px 13px;
  }
  .notify-toggle{display:none}
}


/* v4.5 visitor device summary */
.profile dl#visitorProfile{
  display:grid;
  grid-template-columns:74px minmax(0,1fr);
  gap:9px 10px;
  align-items:start;
}
.profile dl#visitorProfile dt{
  margin:0;
  color:#7f8da1;
}
.profile dl#visitorProfile dd{
  margin:0;
  line-height:1.45;
  word-break:break-word;
}
.raw-device{
  margin:14px 0;
  padding:10px 12px;
  border:1px solid #e1e7f0;
  border-radius:10px;
  background:#f8fafc;
}
.raw-device summary{
  cursor:pointer;
  color:#58708f;
  font-size:13px;
}
.raw-device pre{
  white-space:pre-wrap;
  word-break:break-all;
  font-size:11px;
  color:#66758a;
  margin:10px 0 0;
}

.chat-bg{background:var(--chat-bg,#eef3fa)}
.visitor{background:var(--chat-bg,#f4f7fb)}
.visitor header{background:var(--theme,#246bfd)}
.visitor .msg.visitor{background:var(--visitor-bubble,#246bfd)}
.visitor .msg.admin{background:var(--admin-bubble,#fff)}
#send,.offline button{background:var(--button,#246bfd)}
.status{font-size:10px;opacity:.8}
.settings-page input[type="color"]{height:44px;padding:4px}


/* v5.1: message status is visible only in admin */
.admin-status{
  font-size:10px;
  opacity:.78;
}
.visitor .status,
.visitor [data-status-id]{
  display:none !important;
}

/* v6.0 usability refresh */
.top{min-height:68px;height:auto;gap:16px;box-shadow:0 2px 12px #10213a20}.top .stats{display:flex;gap:8px;margin-right:auto}.top .stats span{padding:6px 10px;border-radius:999px;background:#ffffff14;font-size:12px}.status-form select{border:1px solid #ffffff35;background:#ffffff12;color:#fff;border-radius:9px;padding:7px}.status-form option{color:#172033}.list{border-right:1px solid #edf0f5}.conv{border:1px solid transparent;transition:.15s}.conv:hover,.conv.active{border-color:#cfe0ff;transform:translateY(-1px)}.chathead{background:#fbfcfe}.profile h3{margin-top:8px}.rename-form,.agent-edit{display:grid;gap:7px}.rename-form{grid-template-columns:1fr auto}.rename-form button,.agent-edit button{border:0;border-radius:9px;padding:8px 10px;background:#246bfd;color:#fff}.ghost-danger{background:#fff!important;color:#d33!important;border:1px solid #f3b8b8!important}.privacy-note{text-align:center;padding:7px 12px;font-size:11px;color:#7b8799;background:#fff;border-bottom:1px solid #edf0f5}.agent-title{min-width:0}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}.dot.on{background:#45df85;box-shadow:0 0 0 3px #45df8533}.dot.off{background:#b8c0cc}.lang-btn{padding:5px 8px;border-radius:8px}.lang-btn.active{background:#ffffff25}.offline-success{text-align:center;padding:18px;color:#18884b}.login-mark{width:58px;height:58px;margin:auto;display:grid;place-items:center;border-radius:18px;background:#246bfd;color:#fff;font-size:26px;font-weight:bold;box-shadow:0 10px 30px #246bfd45}.login-card{text-align:left}.login-card h1,.login-card>p{text-align:center}.login-tip{display:block;text-align:center;color:#8893a3;margin-top:8px}.agent-edit{grid-template-columns:1fr 1fr 90px auto;margin-top:8px}.settings-page section:first-child{grid-row:span 2}@media(max-width:850px){.top .stats{display:none}.agent-edit{grid-template-columns:1fr}.top nav a{display:none}}@media(max-width:650px){.visitor header{padding-top:max(16px,env(safe-area-inset-top));}.visitor footer{padding-bottom:max(12px,env(safe-area-inset-bottom));}.privacy-note{font-size:10px}.visitor .avatar{width:44px;height:44px}.visitor h2{font-size:17px}}
.schedule-grid{display:grid;grid-template-columns:80px 1.2fr 1fr 1fr;gap:8px;align-items:center;margin:12px 0 18px}.schedule-grid>div{min-width:0}.schedule-grid input,.schedule-grid select{width:100%;box-sizing:border-box}.schedule-head{font-weight:700;color:#667085;font-size:13px}@media(max-width:700px){.schedule-grid{grid-template-columns:58px 1fr 92px 92px;gap:6px}.schedule-grid input,.schedule-grid select{font-size:12px;padding:8px 5px}}

/* v6.3 functional fixes */
.offline-panel{margin-top:18px;border-top:1px solid #e5e7eb;padding-top:12px}.offline-panel summary{cursor:pointer;font-weight:700}.offline-item{padding:10px 0;border-bottom:1px solid #eef1f5}.offline-item small{display:block;color:#7b8494;margin:4px 0}.offline-item p{white-space:pre-wrap;word-break:break-word;margin:6px 0}.offline-actions{display:flex;gap:6px}.offline-actions form{margin:0}.muted{color:#8a93a3}.msg span{white-space:pre-wrap;word-break:break-word}


/* v6.4 customer-service admin practical upgrade */
.conv.unread{background:#fff7ed;border-color:#fdba74;box-shadow:0 6px 18px #fb923c22}
.conv.unread b{color:#9a3412}.conv.unread span{color:#c2410c;font-weight:700}
.quick{align-items:center;background:#f8fafc;border-top:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb}.quick b{font-size:12px;color:#64748b;white-space:nowrap}.quick-reply:hover{background:#246bfd;color:#fff;border-color:#246bfd}
.member-card{display:grid;gap:8px;margin:8px 0 12px}.member-card p{display:flex;justify-content:space-between;gap:10px;margin:0;padding:9px 10px;border-radius:10px;background:#f8fafc;border:1px solid #e5e7eb}.member-card span{color:#64748b}.member-card b{text-align:right;word-break:break-all}.copy-profile{width:100%;border:0;border-radius:10px;padding:9px 10px;background:#172b4d;color:#fff;margin:0 0 10px}.tag-shortcuts{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0 12px}.tag-shortcuts span{width:100%;font-size:12px;color:#64748b}.tag-shortcuts button{border:1px solid #cbd5e1;background:#fff;border-radius:999px;padding:6px 10px}.tag-shortcuts button:hover{background:#edf3ff;border-color:#93c5fd}
@media(max-width:650px){.quick b{display:none}.quick-reply{font-size:12px;padding:6px 9px}}

.copy-head-btn{border:0;border-radius:9px;padding:8px 10px;background:#16a34a!important;color:#fff;cursor:pointer}
@media(max-width:650px){.copy-head-btn{display:inline-block;font-size:12px;padding:7px 8px}.chathead{gap:8px;align-items:flex-start}.actions{flex-wrap:wrap;justify-content:flex-end}}


/* v6.5 simple customer profile view */
.simple-profile-card{display:grid;gap:8px;margin:8px 0 16px}.simple-profile-card p{margin:0;padding:10px 12px;border:1px solid #e5e7eb;border-radius:10px;background:#f8fafc}.simple-profile-card span{display:block;color:#64748b;font-size:12px;margin-bottom:4px}.simple-profile-card b{display:block;color:#111827;font-size:14px;word-break:break-all}.simple-profile-card.member p{background:#f0fdf4;border-color:#bbf7d0}.simple-empty{padding:12px;border-radius:10px;background:#fff7ed;color:#9a3412;font-size:13px;line-height:1.5;margin-bottom:16px}.simple-form{display:grid;gap:8px;margin:8px 0 12px}.simple-form label{display:grid;gap:6px;color:#64748b;font-size:12px}.simple-form input,.simple-form textarea{width:100%;border:1px solid #d8e0ec;border-radius:10px;padding:9px}.simple-form textarea{min-height:74px}.simple-form button,.simple-actions button{border:0;border-radius:9px;padding:9px 10px;background:#246bfd;color:#fff}.simple-tags{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 12px}.simple-tags button{border:1px solid #bfdbfe;background:#eff6ff;color:#1d4ed8;border-radius:999px;padding:7px 10px}.simple-actions{display:grid;gap:8px;margin-top:10px}.simple-actions form{margin:0}.copy-head-btn,.copy-profile,.raw-device,.member-card,.tag-shortcuts{display:none!important}
@media(max-width:1000px){.profile{display:block}.layout{grid-template-columns:260px minmax(360px,1fr) 300px}}
@media(max-width:800px){.layout{grid-template-columns:1fr}.list{max-height:180px}.profile{display:block;max-height:none}.chat{min-height:520px}}


/* v6.6 balance always visible */
.balance-strip{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.balance-strip span{padding:6px 9px;border-radius:999px;background:#eef6ff;color:#1d4ed8;font-size:12px;font-weight:700}.balance-strip .money{background:#dcfce7;color:#15803d}.conv-balance{color:#15803d!important;font-weight:700!important}.conv .conv-balance{display:block!important}
@media(max-width:650px){.balance-strip{display:grid;grid-template-columns:1fr}.balance-strip span{border-radius:8px}.conv-balance{font-size:10px!important}}


/* v6.7 stronger new-message reminder */
#newMsgToast{position:fixed;right:22px;top:82px;z-index:9999;transform:translateY(-12px);opacity:0;pointer-events:none;max-width:320px;padding:13px 16px;border-radius:14px;background:#dc2626;color:#fff;font-weight:800;box-shadow:0 16px 45px #991b1b55;transition:.2s}
#newMsgToast.show{opacity:1;transform:translateY(0)}
#newMsgToast::before{content:"🔔 ";}
@media(max-width:650px){#newMsgToast{left:12px;right:12px;top:70px;max-width:none;text-align:center}}


/* v6.8 grouped quick replies */
.quick-group-box{display:block;background:#f8fafc;border-top:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb;padding:8px}.quick-tabs{display:flex;gap:6px;overflow:auto;align-items:center;margin-bottom:7px}.quick-tabs b{font-size:12px;color:#64748b;white-space:nowrap}.quick-tab{white-space:nowrap;border:1px solid #cbd5e1;border-radius:999px;background:#fff;color:#334155;padding:7px 10px;cursor:pointer}.quick-tab.active{background:#246bfd;color:#fff;border-color:#246bfd}.quick-list{display:flex;gap:6px;overflow:auto}.quick-list .quick-reply{white-space:nowrap;border:1px solid #d8e0ec;border-radius:18px;background:#fff;padding:7px 10px}.quick-list .quick-reply:hover{background:#16a34a;color:#fff;border-color:#16a34a}
@media(max-width:650px){.quick-tabs,.quick-list{gap:5px}.quick-tab,.quick-list .quick-reply{font-size:12px;padding:6px 8px}.quick-tabs b{display:none}}


/* v6.9 quick replies on right sidebar */
.profile .quick-group-box{display:block;padding:0;margin:8px 0 16px;background:transparent;border:0}.profile .quick-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;overflow:visible;margin-bottom:8px}.profile .quick-tabs b{grid-column:1/-1;display:none}.profile .quick-tab{border-radius:10px;text-align:center;padding:8px 6px}.profile .quick-list{display:grid;gap:7px;max-height:260px;overflow:auto;padding-right:2px}.profile .quick-list .quick-reply{white-space:normal;text-align:left;line-height:1.45;border-radius:10px;padding:9px 10px;background:#fff}.chat>.quick-group-box{display:none!important}
@media(max-width:800px){.profile .quick-list{max-height:none}.profile .quick-tabs{grid-template-columns:1fr 1fr 1fr}}


/* v7.0 static visible quick replies */
.quick-static{display:grid!important;gap:12px;margin:8px 0 16px;max-height:480px;overflow:auto;padding-right:4px}.quick-static section{display:grid!important;gap:7px;padding:10px;border:1px solid #e5e7eb;border-radius:12px;background:#f8fafc}.quick-static h4{margin:0 0 2px;color:#1d4ed8;font-size:14px}.quick-static button{display:block!important;width:100%;white-space:normal;text-align:left;line-height:1.45;border:1px solid #d8e0ec;border-radius:10px;background:#fff;color:#111827;padding:9px 10px;cursor:pointer}.quick-static button:hover{background:#16a34a;color:#fff;border-color:#16a34a}.profile .quick-group-box{display:none!important}
@media(max-width:800px){.quick-static{max-height:none}}


/* v7.1 compact quick reply accordion */
.quick-static{display:none!important}.quick-accordion{display:grid;gap:8px;margin:8px 0 16px;max-height:430px;overflow:auto;padding-right:3px}.quick-accordion details{border:1px solid #e5e7eb;border-radius:12px;background:#fff;overflow:hidden}.quick-accordion summary{cursor:pointer;list-style:none;padding:10px 12px;font-weight:800;color:#0f172a;background:linear-gradient(135deg,#f8fafc,#eef6ff);border-bottom:1px solid transparent}.quick-accordion summary::-webkit-details-marker{display:none}.quick-accordion summary:after{content:"+";float:right;color:#246bfd;font-weight:900}.quick-accordion details[open] summary{color:#1d4ed8;border-bottom-color:#e5e7eb}.quick-accordion details[open] summary:after{content:"−"}.quick-accordion button{display:block;width:calc(100% - 16px);margin:7px 8px;text-align:left;line-height:1.45;border:1px solid #e2e8f0;border-radius:10px;background:#f8fafc;color:#111827;padding:9px 10px;cursor:pointer}.quick-accordion button:hover{background:#16a34a;color:#fff;border-color:#16a34a;transform:translateY(-1px)}
@media(max-width:800px){.quick-accordion{max-height:none}.quick-accordion button{font-size:13px}}


/* v7.2 simplified admin workspace */
.top nav{gap:10px}.top nav a,.top nav button,.status-form select{font-size:13px}.actions:empty{display:none}.compact-note{padding:8px 10px;border-radius:10px;background:#f8fafc;color:#64748b;font-size:12px}.offline-panel,.bulk{display:none!important}

/* v7.3 customer-service admin UI refresh */
.admin{background:#eef2f7;color:#0f172a}.top{background:linear-gradient(135deg,#0f172a,#1e3a8a);padding:10px 18px;border-bottom:1px solid #1d4ed833}.top b{font-size:17px;letter-spacing:.2px}.top .stats span{background:#ffffff1f;border:1px solid #ffffff20}.layout{grid-template-columns:285px minmax(520px,1fr) 360px;background:#cbd5e1;gap:1px}.list,.chat,.profile{background:#fff}.list{padding:12px;background:#f8fafc}.search{grid-template-columns:1fr 82px 38px;margin-bottom:10px}.search input,.search select{background:#fff;border-color:#dbe3ef}.conv{display:block;padding:0;margin:8px 0;border:1px solid #e5e7eb;border-radius:14px;background:#fff;box-shadow:0 4px 14px #0f172a08;transition:.15s}.conv input.pick{display:none}.conv a{display:block;padding:11px 12px}.conv b{display:block;font-size:14px;color:#0f172a;margin-bottom:4px}.conv small{font-size:11px;color:#64748b;line-height:1.45}.conv-balance{margin-top:5px!important;padding:5px 8px;border-radius:999px;background:#dcfce7;color:#15803d!important;width:max-content;max-width:100%}.conv span{margin-top:6px;display:inline-block;padding:3px 8px;border-radius:999px;background:#eef2ff;color:#3730a3;font-weight:700}.conv em{right:10px;top:10px;background:#ef4444;box-shadow:0 5px 14px #ef444455}.conv.active{border-color:#2563eb;background:#eff6ff;box-shadow:0 8px 24px #2563eb22;transform:none}.conv.unread{background:#fff7ed;border-color:#fb923c}.conv.unread b:before{content:"● ";color:#ef4444}.chat{background:#f8fafc}.chathead{padding:14px 16px;background:#fff;border-bottom:1px solid #e5e7eb;box-shadow:0 4px 18px #0f172a08}.chathead b{font-size:16px}.chathead small{display:block;color:#64748b;margin-top:4px}.balance-strip span{background:#eff6ff;border:1px solid #bfdbfe;color:#1d4ed8}.balance-strip .money{background:#dcfce7;border-color:#86efac;color:#15803d}#messages{padding:18px 20px;background:linear-gradient(#f8fafc,#f1f5f9)}.chat #messages .msg{box-shadow:0 6px 18px #0f172a10;border:1px solid #e5e7eb;border-radius:16px;margin:8px 0;max-width:76%;font-size:14px;line-height:1.55}.chat #messages .msg.visitor{background:#fff;color:#0f172a;border-top-left-radius:6px}.chat #messages .msg.admin{background:#2563eb;color:#fff;border-color:#2563eb;border-top-right-radius:6px}.chat #messages .msg small{font-size:10px;opacity:.65;margin-top:6px}.who{font-size:11px;opacity:.7}.typing{background:#f8fafc;color:#64748b}.chat footer{background:#fff;border-top:1px solid #e5e7eb;padding:12px}.chat footer input#text{border-radius:999px;background:#f8fafc;border-color:#dbe3ef;padding:12px 14px}.chat footer button#send{border-radius:999px;background:#2563eb;padding:0 18px}.chat footer label,.chat footer #emojiBtn{border-radius:999px;background:#eef2ff;color:#1d4ed8}.profile{padding:14px;background:#ffffff}.profile h3{font-size:15px;margin:12px 0 8px;color:#0f172a;display:flex;align-items:center;gap:6px}.profile h3:before{content:"";width:4px;height:16px;border-radius:8px;background:#2563eb}.simple-profile-card{gap:6px;margin-bottom:14px}.simple-profile-card p{padding:8px 10px;background:#f8fafc}.simple-profile-card span{font-size:11px}.simple-profile-card b{font-size:13px}.quick-accordion{max-height:500px;gap:9px}.quick-accordion details{border-radius:14px;border-color:#dbe3ef;box-shadow:0 4px 14px #0f172a08}.quick-accordion summary{padding:11px 12px;background:linear-gradient(135deg,#ffffff,#eff6ff);font-size:14px}.quick-accordion button{background:#fff;border-color:#e5e7eb;border-radius:11px;margin:7px 9px;width:calc(100% - 18px);font-size:13px}.quick-accordion button:hover{background:#2563eb;border-color:#2563eb;color:#fff}.simple-form input,.simple-form textarea{background:#f8fafc}.simple-form button{background:#2563eb}.simple-tags button{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8}.simple-tags button:hover{background:#2563eb;color:#fff}.notify-toggle{background:#16a34a;color:#fff;border:0}.status-form select{background:#ffffff18;border-color:#ffffff30}.msearch{background:#fff;border-bottom:1px solid #e5e7eb}.msearch input{background:#f8fafc}
@media(max-width:1100px){.layout{grid-template-columns:260px minmax(420px,1fr) 330px}.top .stats{display:none}}
@media(max-width:850px){.layout{grid-template-columns:1fr}.list{max-height:230px}.profile{display:block}.chat{min-height:560px}.chat #messages .msg{max-width:88%}.top{align-items:flex-start;flex-wrap:wrap}.top nav{flex-wrap:wrap}}


/* v7.4 clearer online/offline status */
.status-form select option[value="online"]{color:#15803d}.status-form select option[value="busy"]{color:#c2410c}.status-form select option[value="offline"]{color:#64748b}.dot.on{background:#22c55e;box-shadow:0 0 0 4px #22c55e33}.dot.off{background:#94a3b8}.offline{background:#fff7ed;border:1px solid #fed7aa;color:#9a3412}.offline b{display:block;margin-bottom:8px}