*{box-sizing:border-box}body{margin:0;background:#f4f5f7;color:#222;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.top{height:64px;background:#fff;border-bottom:1px solid #e7e7e7;display:flex;align-items:center;justify-content:space-between;padding:10px 16px;position:sticky;top:0;z-index:5}.brand{display:flex;align-items:center;gap:10px}.brand>span{font-size:29px}.brand strong{display:block;font-size:16px}.brand small{display:block;color:#888;margin-top:2px}.status{font-size:13px;color:#999}.status.good{color:#16834b}.chat{max-width:760px;margin:auto}.messages{height:calc(100vh - 145px);min-height:430px;overflow:auto;padding:14px}.row{display:flex;margin:9px 0}.row.me{justify-content:flex-end}.bubble{max-width:82%;padding:10px 13px;border-radius:15px;background:#fff;white-space:pre-wrap;word-break:break-word;box-shadow:0 1px 2px #0000000d}.row.me .bubble{background:#222;color:#fff}.bubble img{display:block;max-width:280px;max-height:380px;border-radius:10px}.composer{position:fixed;bottom:0;left:0;right:0;max-width:760px;margin:auto;padding:8px;background:#fff;border-top:1px solid #ddd;display:flex;gap:7px}.composer>input{flex:1;min-width:0;border:1px solid #ddd;border-radius:11px;padding:11px 12px;font-size:15px}.composer button{border:0;background:#222;color:#fff;border-radius:11px;padding:0 16px}.iconBtn{width:42px;display:grid;place-items:center;font-size:25px;cursor:pointer}.iconBtn input{display:none}.staffLayout{display:grid;grid-template-columns:220px 1fr;max-width:1000px;margin:auto}.customers{background:#fff;min-height:calc(100vh - 64px);border-right:1px solid #ddd}.sideTitle{font-weight:700;padding:14px;border-bottom:1px solid #eee}.customerItem{width:100%;padding:12px 14px;text-align:left;border:0;border-bottom:1px solid #eee;background:#fff}.customerItem.active{background:#f0f0f0}.customerItem b,.customerItem small{display:block}.customerItem small{color:#888;margin-top:4px}.tip{padding:14px;color:#888;font-size:12px;line-height:1.5}.staffChat{min-width:0}.currentCustomer{height:48px;background:#fff;border-bottom:1px solid #eee;padding:14px}.settings{max-width:650px;margin:25px auto;background:#fff;border-radius:14px;padding:20px}.settings label{display:block;margin:14px 0}.settings input,.settings textarea{width:100%;margin-top:6px;padding:11px;border:1px solid #ddd;border-radius:9px}.settings textarea{min-height:100px}.settings button{border:0;background:#222;color:#fff;border-radius:9px;padding:11px 16px}.settings pre{background:#f3f3f3;padding:12px;border-radius:8px;white-space:pre-wrap;font-size:12px;overflow:auto}@media(max-width:650px){.staffLayout{grid-template-columns:1fr}.customers{min-height:auto;border-right:0;border-bottom:1px solid #ddd;display:flex;overflow:auto}.sideTitle,.tip{display:none}.customerItem{min-width:120px;border-right:1px solid #eee}.messages{height:calc(100vh - 145px)}}