:root{--blue:#0052d9;--ink:#1c1b1b;--muted:#737686;--bg:#f8f9fc;--line:#eef0f4;--blue-light:#ecf2fe;--radius:16px}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--bg);font:14px/1.6 -apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:wait;opacity:.55}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #0052d940;outline-offset:2px}button{border:0;background:none}input,select,textarea{border:1px solid #e1e5ec;border-radius:9px;padding:10px 12px;background:#fff;color:var(--ink);min-width:0}textarea{resize:vertical}label{display:block;font-weight:550;margin-bottom:18px}label input,label select,label textarea{display:block;width:100%;margin-top:7px;font-weight:400}h1,h2,p{margin:0}h1{font-size:28px;letter-spacing:-.6px}h2{font-size:17px}strong{font-weight:650}.hidden{display:none!important}.muted{color:var(--muted)}.small{font-size:12px}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:650;color:#7f8da4;margin-bottom:7px}.primary,.secondary{border-radius:9px;padding:10px 17px;font-weight:550;white-space:nowrap}.primary{color:#fff;background:var(--blue);box-shadow:0 3px 7px #0052d914}.primary:hover{background:#0047bd}.secondary{background:white;border:1px solid #e1e5ec;color:#434654}.text-button{color:var(--muted);font-size:12px;padding:5px}.full{width:100%}.error{color:#ba1a1a;font-size:13px;white-space:pre-wrap;overflow-wrap:anywhere}.banner{background:#fff0ee;border:1px solid #ffd4cf;padding:14px 18px;border-radius:10px;margin-bottom:20px}.brand-mark{width:36px;height:36px;display:grid;place-items:center;border-radius:12px;background:var(--blue);font-family:serif;font-size:21px;color:white;flex:none}.app{display:flex;min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:224px;background:white;border-right:1px solid var(--line);padding:28px 18px;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:12px;padding:0 10px 45px}.brand strong{display:block;font-size:17px}.brand small{font-size:10px;letter-spacing:1px;color:var(--muted)}.nav-caption{font-size:10px;color:#9ca3b2;padding:0 16px;margin-bottom:12px}.nav-item{display:flex;align-items:center;gap:13px;width:100%;text-align:left;padding:13px 16px;border-radius:10px;color:#687184;margin-bottom:7px}.nav-item span{font-size:21px;width:24px;line-height:1}.nav-item.selected{color:var(--blue);background:var(--blue-light);font-weight:650}.nav-item:hover{background:#f5f7fb}.sidebar-foot{margin-top:auto;padding:22px 12px 0;font-size:11px;color:var(--muted)}.sidebar-foot p{margin-top:5px;font-size:10px;color:#a4a9b5}.status-dot{display:inline-block;background:#21ad77;border-radius:50%;width:6px;height:6px;margin-right:7px}.count{margin-left:auto;font:10px/18px sans-serif;color:#fff;background:#e34646;min-width:18px;text-align:center;border-radius:10px;font-style:normal}.workspace{margin-left:224px;width:calc(100% - 224px)}.topbar{height:76px;padding:0 40px;background:#ffffffc9;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.breadcrumb{font-size:12px;color:#8b93a2}.breadcrumb span{margin:0 14px;color:#c2c8d2}.breadcrumb b{font-weight:500;color:#434654}.account{display:flex;align-items:center;gap:12px;font-size:12px}.account-avatar{width:29px;height:29px;background:#ecf2fe;color:var(--blue);display:grid;place-items:center;border-radius:50%;font-size:11px}.account .text-button{margin-left:12px;border-left:1px solid #e4e7ed;padding-left:16px}main{padding:36px 40px;max-width:1600px;margin:auto}.page-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;gap:20px}.page-heading p{font-size:12px;margin-top:7px}.panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.panel-heading{display:flex;justify-content:space-between;align-items:center;padding:24px 28px}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:26px}.stat{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px}.stat-label{font-size:12px;color:#7b8495}.stat-value{font-size:31px;line-height:1.3;letter-spacing:-1px;margin:13px 0 8px;font-weight:650}.stat-note{font-size:11px;color:#99a1af}.stat:first-child .stat-value{color:var(--blue)}.overview-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:24px}.welcome-panel{padding:34px;background:linear-gradient(120deg,#f0f5ff,#fff);position:relative}.welcome-panel h2{font-size:29px;line-height:1.5;margin:24px 0 15px;letter-spacing:-.5px}.welcome-panel p{font-size:12px;color:#7c879d;max-width:260px}.welcome-panel button{margin-top:30px}.welcome-panel button span{margin-left:28px}.pill{display:inline-block;border-radius:6px;background:#e2ebff;color:var(--blue);font-size:10px;padding:4px 8px;white-space:nowrap}.pill.neutral{background:#f1f3f7;color:#7e8799}.quick-action{display:flex;align-items:center;text-align:left;gap:16px;width:calc(100% - 56px);margin:0 28px;padding:18px 0;border-top:1px solid var(--line)}.quick-action small{display:block;font-size:11px;margin-top:3px;color:#8d95a3}.quick-action b{margin-left:auto;color:#b1b9c8;font-size:22px;font-weight:400}.quick-icon{width:40px;height:40px;background:#f1f5ff;border-radius:11px;color:var(--blue);display:grid;place-items:center;font-size:23px}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px}.filters{display:flex;gap:10px;flex-wrap:wrap}.filters input{width:230px;background:#f9fafc}.filters select{font-size:12px}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;white-space:nowrap;text-align:left}th{font-weight:500;font-size:11px;color:#8b93a2;background:#fafbfd;padding:15px 24px;border-block:1px solid var(--line)}td{padding:18px 24px;border-bottom:1px solid var(--line);font-size:12px;color:#4a5364}.product-cell{display:flex;align-items:center;gap:14px}.thumbnail{width:49px;height:49px;border-radius:10px;background:#f0f4fb;display:grid;place-items:center;overflow:hidden;color:var(--blue);font-size:22px;flex:none}.thumbnail img{width:100%;height:100%;object-fit:cover}.product-title{max-width:250px;white-space:normal;font-weight:600;color:#263147}.subtext{font-size:10px;color:#9aa2b2;margin-top:4px;max-width:220px;overflow:hidden;text-overflow:ellipsis}.money{font-weight:650;color:#263147}.table-action{color:var(--blue);font-size:12px;padding:5px 9px}.table-action+.table-action{border-left:1px solid #e8ebf1;color:#738097}.badge{font-size:10px;border-radius:5px;padding:4px 8px;color:#048c58;background:#eaf8f0;display:inline-block}.badge.off{color:#8b93a2;background:#f0f2f5}.badge.pending{background:#fff5e6;color:#b77811}.table-footer{padding:16px 24px;color:#9aa2b2;font-size:11px}.empty{padding:70px 24px;text-align:center;color:#959ead;font-size:13px}.loading{padding:14px 0;color:var(--blue);font-size:12px}.page-footer{text-align:center;font-size:10px;color:#adb4c0;padding:0 0 24px}.chat-shell{display:flex;height:calc(100vh - 285px);min-height:510px}.conversation-sidebar{width:290px;border-right:1px solid var(--line);flex:none;overflow:auto;background:#fff}.conversation-heading{padding:22px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.conversation-heading h2{font-size:14px}.conversation{display:flex;text-align:left;width:100%;padding:18px;gap:12px;border-bottom:1px solid #f5f6f8;align-items:center}.conversation:hover{background:#fafbfd}.conversation.selected{background:#ecf2fe}.conversation-avatar{width:38px;height:38px;border-radius:12px;background:#e9eef9;color:#0052d9;display:grid;place-items:center;flex:none}.conversation-copy{min-width:0;flex:1}.conversation-name{font-size:12px;font-weight:600;display:flex;justify-content:space-between;gap:6px}.conversation-name time{font-size:9px;font-weight:400;color:#9aa3b2}.conversation-preview{color:#9099a9;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:4px}.conversation .count{flex:none}.chat-main{min-width:0;flex:1;position:relative}.chat-empty{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.empty-symbol{font-size:34px;color:#a9bbdd}.chat-empty h2{font-size:16px;margin:12px 0 6px;color:#64718a}.chat-empty p{font-size:12px}#chat-active{height:100%;display:flex;flex-direction:column}.chat-header{display:flex;justify-content:space-between;align-items:center;padding:18px 24px;border-bottom:1px solid var(--line);background:#fff}.chat-header h2{font-size:14px}.chat-header p{font-size:10px;margin-top:3px}.messages{flex:1;min-height:0;overflow:auto;background:#f7f9fc;padding:24px}.message{display:flex;flex-direction:column;align-items:flex-start;margin-bottom:20px}.message.admin{align-items:flex-end}.message-meta{font-size:9px;color:#9ba4b4;margin:0 2px 6px}.bubble{background:white;border:1px solid #edf0f5;color:#404c60;border-radius:0 12px 12px 12px;padding:11px 15px;max-width:78%;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px}.admin .bubble{background:var(--blue);color:#fff;border-color:var(--blue);border-radius:12px 0 12px 12px}.composer{padding:18px 24px 16px;border-top:1px solid var(--line);background:#fff}.composer textarea{width:100%;height:70px;border:0;padding:0;resize:none;font-size:12px;outline:none}.composer-footer{display:flex;align-items:center;justify-content:space-between;gap:10px}.composer-footer .primary{font-size:12px}.composer-footer .small{font-size:10px}dialog{padding:0;border:1px solid #e4e8f0;border-radius:18px;width:620px;max-width:calc(100vw - 32px);max-height:90vh;color:var(--ink);box-shadow:0 20px 80px #12255229}dialog::backdrop{background:#182b4c55;backdrop-filter:blur(3px)}.dialog-heading{padding:22px 28px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.dialog-heading .eyebrow{font-size:9px}.dialog-heading h2{font-size:20px}.icon-button{font-size:25px;color:#9ca4b2;padding:0 5px}.dialog-body{padding:24px 28px;max-height:65vh;overflow:auto}.dialog-body label{font-size:12px}.dialog-footer{display:flex;justify-content:flex-end;gap:10px;padding:18px 28px;background:#fafbfd;border-top:1px solid var(--line)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.upload-row{display:flex;gap:16px;align-items:center;margin-top:10px}.image-preview{width:92px;height:92px;flex:none;border:1px dashed #cfd7e7;border-radius:12px;display:grid;place-items:center;overflow:hidden;color:#a0a9ba;background:#f8faff;font-size:10px}.image-preview img{width:100%;height:100%;object-fit:cover}.upload-copy{flex:1;min-width:0}.upload-copy input{margin:0 0 9px;font-size:11px}.upload-button{display:inline-block;font-size:11px;cursor:pointer;margin:0;padding:6px 12px}.upload-copy p{font-size:10px;margin-top:6px}.detail-block{border-bottom:1px solid var(--line);padding:0 0 20px;margin-bottom:20px}.detail-block h3{font-size:12px;margin:0 0 13px;color:#929bae}.detail-line{display:flex;justify-content:space-between;gap:20px;margin-bottom:10px;font-size:12px;white-space:pre-wrap;overflow-wrap:anywhere}.detail-line .muted{flex:none}.toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);padding:12px 22px;background:#263147;color:white;border-radius:10px;font-size:12px;z-index:10}.auth-screen{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(at 10% 10%,#e8f0ff,transparent 55%),#f8f9fc}.auth-card{width:400px;max-width:100%;background:white;border:1px solid #e7edf8;border-radius:22px;padding:38px;box-shadow:0 20px 70px #17397e08}.auth-card .brand-mark{margin-bottom:28px}.auth-card h1{font-size:25px;margin-bottom:10px}.auth-card .muted{font-size:12px}.auth-card form{margin-top:28px}.auth-card label{font-size:12px}.auth-card .error{margin-bottom:16px}.auth-foot{font-size:10px;color:#a5afbf;margin-top:30px;text-align:center}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0)}@media(max-width:1100px){.sidebar{width:190px}.workspace{margin-left:190px;width:calc(100% - 190px)}main{padding:28px}.topbar{padding:0 28px}.stats-grid{gap:12px}.stat{padding:18px}.overview-grid{grid-template-columns:1fr}.conversation-sidebar{width:240px}.toolbar{align-items:flex-start;flex-wrap:wrap}.filters input{width:200px}}@media(max-width:760px){.sidebar{width:70px;padding:24px 8px}.brand{padding:0 8px 32px}.brand>div:last-child,.nav-caption,.sidebar-foot,.nav-item .count{display:none}.nav-item{font-size:0;justify-content:center;padding:13px 8px}.nav-item span{font-size:24px}.workspace{margin-left:70px;width:calc(100% - 70px)}.topbar{padding:0 18px;height:65px}.breadcrumb{font-size:10px}.breadcrumb span{margin:0 6px}.account{gap:6px}.account-avatar{display:none}.account .text-button{margin-left:0;padding-left:8px}.account #account-name{max-width:70px;overflow:hidden;text-overflow:ellipsis}main{padding:22px 16px}.page-heading{align-items:flex-start}.page-heading .eyebrow{font-size:8px}.page-heading h1{font-size:23px}.page-heading p{font-size:11px}.page-heading .secondary{padding:7px 10px;font-size:11px}.stats-grid{grid-template-columns:1fr 1fr}.stat-value{font-size:27px}.welcome-panel{padding:25px}.toolbar{padding:18px}.filters{width:100%;gap:8px}.filters input{width:100%}.filters select{flex:1}.toolbar>button{width:100%}th,td{padding:14px 18px}.chat-shell{flex-direction:column;height:calc(100vh - 230px);min-height:600px}.conversation-sidebar{width:100%;height:160px;flex:none;border-right:0;border-bottom:1px solid var(--line)}.conversation-heading{padding:12px 16px}.conversation{padding:10px 16px}.conversation-name time{display:none}.chat-header{padding:14px 16px}.messages{padding:18px}.composer{padding:14px 16px}.bubble{max-width:90%}.form-grid{gap:0 12px}.dialog-body,.dialog-heading{padding:20px}.dialog-footer{padding:16px 20px}.upload-row{align-items:flex-start}.image-preview{width:70px;height:70px}.auth-card{padding:30px}.page-footer{font-size:9px}}

.nav-item span svg{display:block;width:21px;height:21px}.quick-icon svg{width:22px;height:22px}.empty-symbol svg{width:44px;height:44px}

/* Purchase context stays beside the conversation, and moves below on narrow screens. */
.customer-orders{width:280px;flex:none;border-left:1px solid var(--line);display:flex;flex-direction:column;min-height:0;background:#fff}.customer-orders-heading{padding:20px 18px 12px;display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.customer-orders-heading h2{font-size:14px}.customer-orders-heading p{margin-top:6px}.customer-orders-note{font-size:10px;line-height:1.7;color:#929bad;padding:0 18px 12px}.customer-order-list{overflow:auto;min-height:0;flex:1;padding:0 18px}.customer-order{padding:16px 0;border-top:1px solid var(--line)}.customer-order-header{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:12px}.customer-order-header .money{font-size:13px}.customer-order-item{display:flex;justify-content:space-between;gap:10px;font-size:12px;margin:8px 0;overflow-wrap:anywhere}.customer-order-item .muted{flex:none}.customer-order-id{overflow-wrap:anywhere;font-size:9px;margin-bottom:6px}.customer-orders-pagination{padding:12px 18px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:8px}.customer-orders button:disabled{opacity:.4;cursor:default}
@media(min-width:1281px){.conversation-sidebar{width:240px}.chat-main{min-width:260px}}
@media(max-width:1280px){.chat-shell{flex-wrap:wrap;height:auto}.conversation-sidebar{height:560px;width:240px}.chat-main{height:560px}.customer-orders{width:100%;max-height:420px;border-left:0;border-top:1px solid var(--line)}.customer-order-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px}.customer-orders-heading{padding-top:16px}}
@media(max-width:760px){.chat-shell{flex-wrap:nowrap}.conversation-sidebar{height:160px;width:100%}.chat-main{flex:auto;height:480px;min-height:480px}.customer-orders{max-height:400px}.customer-order-list{display:block}.customer-orders-note{font-size:11px}}