/* hidden 属性优先级需高于各组件的 display，否则弹层/面板藏不掉 */
[hidden]{display:none !important;}

/* 内嵌到后台时：订单名与状态已由后台工具栏展示，隐藏聊天自带 topbar 避免重复 */
.app.in-admin .topbar{display:none;}

:root{
    --bg:#F3F4F6;
    --text:#1C1E21;
    --sub:#9AA0A6;
    --orange:#FF8F1F;
    --orange-deep:#FF6B3B;
    --red:#F5483B;
    --blue:#576B95;
    --line:#EFEFF1;
  }
  *{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
  html,body{height:100%;}
  body{
    font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Helvetica Neue","Microsoft YaHei",sans-serif;
    background:var(--bg);
    color:var(--text);
    overflow:hidden;
  }
  svg{display:block;}
  button{font-family:inherit;}
  .ic{width:16px;height:16px;flex-shrink:0;}

  /* ===== 全屏应用容器 ===== */
  .app{display:flex;flex-direction:column;height:100vh;height:100dvh;width:100%;}
  .wrap{max-width:960px;margin:0 auto;width:100%;}

  /* ===== 顶部栏（订单号：小字号，靠左上角） ===== */
  .topbar{background:#fff;flex-shrink:0;border-bottom:.5px solid #ECECEE;}
  .topbar-inner{
    height:52px;display:flex;align-items:center;gap:6px;padding:0 12px;
  }
  .nav-btn{
    width:36px;height:36px;border:none;background:none;border-radius:9px;
    display:flex;align-items:center;justify-content:center;cursor:pointer;color:#26282C;flex-shrink:0;
  }
  .nav-btn:hover{background:#F4F5F7;}
  .nav-btn:active{opacity:.6;}
  .order-head{flex:1;display:flex;align-items:center;justify-content:flex-start;gap:6px;min-width:0;padding-left:2px;}
  .order-title{
    font-size:13.5px;font-weight:600;color:#17181A;white-space:nowrap;
    overflow:hidden;text-overflow:ellipsis;max-width:78%;
  }
  .edit-pen{
    width:22px;height:22px;border:none;background:#FFF4E5;color:#FF8A1E;
    border-radius:6px;cursor:pointer;display:none;align-items:center;justify-content:center;
    flex-shrink:0;font-size:11px;padding:0;
  }
  .edit-pen.show{display:flex;}
  .edit-pen:hover{background:#FFE9CC;}
  .top-right{display:flex;align-items:center;gap:8px;flex-shrink:0;}
  .role-pill{
    display:flex;align-items:center;gap:5px;
    height:30px;padding:0 12px;border-radius:15px;cursor:pointer;
    border:1px solid #FFC27A;background:#FFF3E2;color:#FF7A00;
    font-size:12px;font-weight:600;white-space:nowrap;
  }
  .role-pill.user{border-color:#D3D8DF;background:#F4F5F7;color:#6B7076;}
  .role-pill:hover{filter:brightness(.97);}
  .role-dot{width:6px;height:6px;border-radius:50%;background:#FF8A1E;}
  .role-pill.user .role-dot{background:#9AA0A6;}

  /* ===== 交易流程条（官方可自由选择） ===== */
  .flowbar{background:#fff;flex-shrink:0;border-bottom:1px solid #F0F0F2;}
  .flowbar-inner{display:flex;align-items:center;gap:6px;padding:7px 10px;min-height:36px;}
  /* 交易流程：强制单行横排，六步等分宽度全部显示，不换行不滚动 */
  .steps{display:flex;align-items:center;gap:4px;flex-wrap:nowrap;flex:1;min-width:0;
    overflow:hidden;padding-bottom:1px;}
  .steps::-webkit-scrollbar{display:none;}
  /* 步骤：等分容器宽度，保证 6 步全部落在可视区内 */
  .steps .step{flex:1 1 0;min-width:0;justify-content:center;}
  /* 步骤：线条风格（白底描边，靠颜色区分状态） */
  .step{
    display:flex;align-items:center;gap:3px;
    font-size:10px;color:#9AA0A6;white-space:nowrap;
    padding:4px 3px;border-radius:12px;border:1px solid var(--line);
    background:#fff;
    transition:background .15s,border-color .15s,color .15s;user-select:none;
  }
  .step .dot{
    width:12px;height:12px;border-radius:50%;flex-shrink:0;
    border:1.2px solid #D2D6DB;display:flex;align-items:center;justify-content:center;
    font-size:8px;font-weight:800;color:#B9BEC5;line-height:1;
    background:#fff;font-family:inherit;
  }
  /* 买家端无可编辑需求，隐藏折叠按钮，把宽度全部让给流程步骤 */
  .flowbar:not(.editable) .flow-toggle{display:none;}
  /* 窄屏进一步压缩，确保六步完整可见 */
  @media (max-width:400px){
    .flowbar-inner{padding:6px 6px;}
    .steps{gap:3px;}
    .step{font-size:9px;padding:4px 2px;gap:2px;border-radius:10px;}
    .step .dot{width:11px;height:11px;font-size:7.5px;}
  }
  /* 已完成：对勾 + 绿色线条（不填色） */
  .step.done{color:#3E9E63;border-color:#8FD3A8;font-weight:600;}
  .step.done .dot{background:#fff;border-color:#5BC77F;color:#5BC77F;}
  .flowbar.editable .step{cursor:pointer;}
  .flowbar.editable .step:hover{border-color:var(--orange-soft);background:#FFFBF6;}
  .flowbar.editable .step.done:hover{border-color:#8FD3A8;background:#F7FDF9;}
  .flow-toggle{
    width:28px;height:28px;border:none;background:#F5F6F8;border-radius:8px;cursor:pointer;
    color:#8A9096;display:flex;align-items:center;justify-content:center;flex-shrink:0;
    transition:transform .2s;
  }
  .flow-toggle:hover{background:#ECEDEF;}
  .flow-toggle.collapsed{transform:rotate(-90deg);}
  /* 删除状况栏 */
  .flow-del{
    width:28px;height:28px;border:none;background:#F5F6F8;border-radius:8px;cursor:pointer;
    color:#8A9096;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-left:6px;
  }
  .flow-del:hover{background:#FDECEC;color:#E5484D;}
  .flowbar:not(.editable) .flow-del{display:none;}
  .flowbar.collapsed .steps{display:none;}
  .flow-summary{
    display:none;font-size:12px;color:#8A9096;flex:1;min-width:0;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  }
  .flowbar.collapsed .flow-summary{display:block;}
  .flow-hint{font-size:11px;color:#C0C4C9;white-space:nowrap;display:none;flex-shrink:0;}
  .flowbar.editable .flow-hint{display:block;}

  /* ===== 聊天区 ===== */
  /* 成员条：聊天区顶部一行（头像 + 身份），参考版式 */
  /* 顶部成员条已移除 */
  .roster{display:none;}
  .roster .ros-item{display:flex;align-items:center;gap:6px;font-size:12px;color:#6B7076;}
  .roster .ros-item img{width:24px;height:24px;border-radius:50%;object-fit:cover;border:none;}

  .chat{flex:1;overflow-y:auto;overflow-x:hidden;background:var(--bg);}
  .chat-inner{max-width:960px;margin:0 auto;padding:14px 16px 26px;}
  .chat::-webkit-scrollbar{width:8px;}
  .chat::-webkit-scrollbar-thumb{background:#D8DBDF;border-radius:4px;}
  .chat::-webkit-scrollbar-track{background:transparent;}

  .time-divider{text-align:center;color:#A6ABB1;font-size:11.5px;margin:16px 0 2px;}

  .sys-line{ text-align:center;color:#A2A7AD;font-size:11.5px;line-height:1.6;margin:16px auto 2px;padding:0 30px;}
  .sys-dashed{
    display:table;margin:14px auto 2px;padding:6px 12px;
    border:none;border-radius:7px;
    color:#989DA3;font-size:11.5px;line-height:1.6;text-align:center;
    background:rgba(255,255,255,.45);
    max-width:86%;
  }

  .msg{display:flex;align-items:flex-start;margin:15px 0;}
  .msg.anim{animation:pop .22s ease;}
  @keyframes pop{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
  .msg .avatar{width:40px;height:40px;border-radius:50%;overflow:hidden;flex-shrink:0;
    border:none;background:#fff;cursor:pointer;transition:transform .12s,box-shadow .15s;}
  .msg .avatar:active{transform:scale(.9);}
  .msg .avatar svg{width:100%;height:100%;}
  .msg .avatar img{width:100%;height:100%;object-fit:cover;display:block;}
  .msg-body{max-width:min(100%,640px);min-width:0;}
  .msg.left .avatar{margin-right:9px;}
  .msg.right{flex-direction:row-reverse;}
  .msg.right .avatar{margin-left:9px;}
  .msg.right .msg-body{display:flex;flex-direction:column;align-items:flex-end;}

  .msg-name{
    font-size:11.5px;color:#9AA0A6;margin:0 0 4px 1px;
    display:flex;align-items:center;gap:4px;line-height:1;
  }
  .msg-name .nick-t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:190px;}
  .msg.right .msg-name{margin:0 1px 4px 0;}
  /* 官方标识：浅橙色背景（仿参考图 #FFF4E6 底 + #8E4A03 字） */
  .tag-official,.tag-role{
    font-size:10px;border-radius:3px;
    padding:1px 5px;line-height:1.5;font-weight:600;flex-shrink:0;
  }
  .tag-official{color:#8E4A03;background:#FFF4E6;border:1px solid #FFE0BC;}
  /* 卖家 / 买家身份标识：浅灰底 + 灰字（1:1 仿参考图） */
  .tag-role{color:#5A5E66;background:#E7E8EC;border:1px solid #DFE0E5;}

  .bubble{
    background:#fff;border-radius:10px;
    padding:9px 12px;font-size:14.5px;line-height:1.66;color:var(--text);
    width:fit-content;max-width:100%;word-break:break-word;
    box-shadow:0 1px 1px rgba(30,32,36,.04);
  }
  .bubble p{margin:2px 0;}
  .bubble .b{font-weight:700;}
  .bubble .red{color:var(--red);}
  .bubble .ato{color:#FF7A00;}
  .bubble .at{color:var(--blue);}
  .bubble .hl{color:var(--orange-deep);}
  /* @名字：白字 + 深橙色椭圆底 */
  .bubble .at-light{
    color:#fff;font-weight:600;background:#E8720C;
    border-radius:999px;padding:1px 9px;display:inline-block;
  }
  .bubble.yellow{background:#FFF6DE;}
  .outside-red{color:var(--red);font-size:12.5px;margin:6px 0 0 2px;font-weight:500;}

  /* 我方气泡：浅橙色填充（去掉橙色描边轮廓） */
  .msg.right .bubble{background:#FFEFDD;color:var(--text);border:none;box-shadow:none;}
  .msg.right .bubble .at,.msg.right .bubble .ato,.msg.right .bubble .hl{color:var(--orange-deep);}
  .msg.right .bubble .at-light{color:#fff;background:#D2620A;}
  .msg.right .bubble.yellow{background:#FFE7CC;color:var(--text);}
  .msg.right .bubble.yellow .at-light{color:#fff;background:#D2620A;}

  /* 图片消息（统一尺寸） */
  .bubble.img-bubble{padding:4px;}
  .bubble.img-bubble img{width:180px;height:180px;object-fit:cover;border-radius:8px;display:block;}

  /* 表情包消息（统一尺寸，无边框无背景） */
  .bubble.sticker-bubble{padding:0;background:transparent;box-shadow:none;border:none;}
  .msg.right .bubble.sticker-bubble{background:transparent;box-shadow:none;border:none;}
  .bubble.sticker-bubble svg{width:132px;height:132px;}
  /* 表情包体积小且需要即时播放动画：放宽缓存，避免每次打开面板重新请求 */
  .bubble.sticker-bubble .sticker-gif{width:140px;height:140px;object-fit:contain;display:block;}
  /* 1:1 还原参考图：发送后气泡内是「会动的」表情包，视觉尺寸再放大一档 */
  @media (min-width:560px){
    .bubble.sticker-bubble .sticker-gif{width:152px;height:152px;}
  }

  /* 消息卡片（官方发送）：标题蓝 / 正文黑（前缀橙色@买家）/ 图片下置可展开长图 / 橙色官方落款 */
  .msg-card{
    width:250px;background:#fff;border-radius:12px;overflow:hidden;
    box-shadow:0 2px 10px rgba(30,32,36,.08);border:1px solid #F0F1F3;
  }
  /* 标题：蓝色 */
  .mc-title{font-size:13.5px;font-weight:700;color:#2B6BE4;margin-bottom:5px;line-height:1.5;}
  /* 正文：黑色 */
  .mc-text{font-size:13px;line-height:1.7;color:#1C1E21;word-break:break-word;white-space:pre-wrap;}
  /* 自动 @ 用户：同款橙色 */
  /* 卡片内 @ 名字：深橙色椭圆 + 浅橙底（与气泡内 @ 风格统一） */
  .mc-text .mc-at{
    color:#E8720C;font-weight:600;background:#FFF1E2;
    border-radius:999px;padding:1px 9px;display:inline-block;
  }
  .mc-body{padding:10px 12px 4px;}
  /* 图片：置于标题/内容下方，竖长图按比例展示，点击展开 */
  .mc-img{
    position:relative;margin:8px 12px 0;border-radius:10px;overflow:hidden;background:#F5F6F8;
    cursor:zoom-in;max-height:260px;
  }
  .mc-img img{width:100%;height:auto;max-height:260px;object-fit:cover;object-position:top;display:block;}
  /* “查看长图”按钮：图片最下方居中 */
  .mc-zoomhint{
    position:absolute;left:50%;bottom:10px;transform:translateX(-50%);
    padding:7px 16px;border-radius:20px;font-size:12px;font-weight:600;color:#fff;
    background:rgba(60,64,70,.86);white-space:nowrap;pointer-events:none;
  }
  /* 落款：官方名称橙色 + 认证标识 */
  .mc-foot{padding:9px 12px 10px;font-size:11px;display:flex;align-items:center;gap:5px;}
  .mc-official{color:var(--orange);font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  /* 卡片底部：橙色盾牌认证 */
  .mc-badge{width:15px;height:15px;flex-shrink:0;display:block;color:var(--orange);}

  /* ===== 交互卡片：账号填写卡 / 换绑手机号卡 ===== */
  .msg-account,.msg-rebind{width:270px;}
  /* 填写表单 */
  .ma-form{padding:2px 12px 4px;}
  .ma-label{display:block;font-size:11.5px;color:#8A9096;margin:9px 0 5px;}
  .ma-input{
    width:100%;border:1px solid #E5E7EA;border-radius:9px;padding:9px 11px;height:38px;
    font-size:13.5px;outline:none;font-family:inherit;color:var(--text);background:#fff;
  }
  .ma-input:focus{border-color:var(--orange-soft);}
  /* 二次实名图片上传 */
  .ma-up{
    position:relative;border:1.5px dashed #D8DBDF;border-radius:10px;background:#FAFBFC;
    min-height:74px;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px;
    padding:8px;cursor:pointer;
  }
  .ma-up.has{border-style:solid;border-color:var(--orange-soft);background:#FFFBF6;justify-content:flex-start;}
  .ma-up img{width:56px;height:56px;border-radius:8px;object-fit:cover;display:block;}
  .ma-up .u-ico{font-size:20px;color:#B4B8BE;line-height:1;}
  .ma-up span{font-size:11.5px;color:#9AA0A6;}
  .ma-up .u-more{font-size:11.5px;color:var(--orange);font-weight:600;}
  .ma-submit{
    width:100%;margin:12px 0 2px;height:38px;border:none;border-radius:10px;cursor:pointer;
    background:var(--orange);color:#fff;font-size:13.5px;font-weight:700;font-family:inherit;
  }
  .ma-submit:hover{background:#FF7A00;}
  .ma-submit:active{opacity:.85;}
  /* 无填写权限：输入框禁用 + 顶部锁定提示 */
  .ma-form.is-locked{opacity:.92;}
  .ma-form.is-locked .ma-input{background:#F5F6F8;color:#A9AEB4;border-color:#E9EBEE;cursor:not-allowed;}
  .ma-lock{
    display:flex;align-items:center;gap:6px;margin:10px 0 2px;padding:8px 10px;
    border-radius:9px;background:#FFF6EA;border:1px solid var(--orange-soft);
    color:#B1640A;font-size:11.5px;line-height:1.5;
  }
  .ma-lock svg{width:14px;height:14px;flex:0 0 14px;color:#E8720C;}
  /* 已提交结果：浅灰细体标签 + 深色值 + 复制按钮（仿参考图） */
  .ma-list{padding:2px 0 4px;}
  .ma-result{padding:8px 12px 2px;}
  .ma-row{
    display:flex;align-items:center;gap:10px;margin-bottom:8px;
    padding:11px 12px;border-radius:10px;background:#F5F6F8;
    font-size:13px;line-height:1.5;
  }
  .ma-row:last-child{margin-bottom:2px;}
  /* 标签：浅灰、字重细、固定列宽（与上方状况栏左对齐） */
  .ma-row .k{color:#9B9FA6;font-weight:300;flex-shrink:0;letter-spacing:.2px;width:78px;}
  /* 值：紧跟标签、单行不换行 */
  .ma-row .v{
    color:#1C1E21;font-weight:400;text-align:left;white-space:nowrap;
    font-size:13.5px;min-width:0;
  }
  /* 复制按钮：紧跟数值，非行尾 */
  .ma-copy{
    flex-shrink:0;width:22px;height:22px;padding:0;border:none;background:none;cursor:pointer;
    color:#B6BAC0;display:flex;align-items:center;justify-content:center;margin-left:-2px;
  }
  .ma-copy svg{
    width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;
    stroke-linecap:round;stroke-linejoin:round;
  }
  .ma-copy:hover{color:var(--orange);}
  .ma-copy:active{transform:scale(.9);}
  .ma-copy.copied{color:#22B573;}
  .ma-done{
    display:flex;align-items:center;gap:5px;margin:8px 12px 0;padding:8px 10px;
    background:#FFF3E4;border-radius:9px;font-size:11.5px;color:#C1651A;font-weight:600;
  }
  .ma-done svg{width:14px;height:14px;flex-shrink:0;}
  /* 右上角「已完成」绿色圆印章 */
  .mc-stamp{
    position:absolute;top:-10px;right:-8px;width:62px;height:62px;z-index:3;
    color:#2ECC9A;opacity:.9;pointer-events:none;
    transform:rotate(-6deg);
    filter:drop-shadow(0 1px 2px rgba(46,204,154,.25));
  }
  .mc-stamp svg{width:100%;height:100%;display:block;}
  .msg-card.is-done{position:relative;overflow:visible;}
  /* 说明文字（换绑卡等）：深灰常规，行距宽松 */
  .mc-note{font-size:13px;line-height:1.7;color:#1C1E21;padding:2px 0 4px;word-break:break-word;white-space:pre-wrap;}
  /* 二次实名图片：卡片内点击展开全图 */
  .ma-imgs{padding:8px 12px 0;display:flex;flex-direction:column;gap:8px;}
  .ma-img{
    position:relative;border-radius:10px;overflow:hidden;background:#F5F6F8;cursor:zoom-in;
    border:1px solid #F0F1F3;
  }
  .ma-img img{width:100%;height:132px;object-fit:cover;object-position:top;display:block;transition:height .2s;}
  .ma-img.open img{height:auto;max-height:none;}
  .ma-img.open{cursor:zoom-out;}
  .ma-imghint{
    position:absolute;left:50%;bottom:8px;transform:translateX(-50%);
    padding:5px 13px;border-radius:18px;font-size:11px;font-weight:600;color:#fff;
    background:rgba(60,64,70,.86);white-space:nowrap;pointer-events:none;
  }
  /* 换绑手机号卡 */
  .msg-rebind .ma-list{padding:0 12px;}
  .msg-rebind .mc-note{padding:0 12px;}
  .mr-btn{
    width:100%;margin:10px 0 2px;height:38px;border:none;border-radius:10px;cursor:pointer;
    background:var(--orange);color:#fff;font-size:13.5px;font-weight:700;font-family:inherit;
  }
  .mr-btn:hover{background:#FF7A00;}
  .mr-btn:active{opacity:.85;}

  /* 商品消息（官方发送：名称 + 图片） */
  .msg-goods{
    width:250px;background:#fff;border-radius:12px;padding:10px;
    display:flex;gap:10px;box-shadow:0 2px 10px rgba(30,32,36,.08);border:1px solid #F0F1F3;
  }
  .mg-img{width:74px;height:74px;border-radius:8px;overflow:hidden;flex-shrink:0;background:#F5F6F8;}
  .mg-img img{width:100%;height:100%;object-fit:cover;display:block;}
  .mg-info{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:4px;}
  .mg-name{font-size:13px;font-weight:600;color:#1C1E21;line-height:1.45;word-break:break-word;}
  .mg-price{font-size:13px;font-weight:700;color:#FF6B3B;}

  /* 商品卡：立即购买 / 已支付 */
  .msg-goods.is-paid{border-color:#FFE0BC;background:#FFFDF9;}
  .mg-buy{
    margin-top:2px;display:inline-flex;align-items:center;gap:6px;align-self:flex-start;
    background:linear-gradient(135deg,#FF9A3C,#FF7A18);color:#fff;font-size:12px;font-weight:700;
    padding:5px 14px;border-radius:999px;cursor:pointer;line-height:1.2;
    box-shadow:0 2px 8px rgba(255,122,24,.28);transition:transform .12s,box-shadow .12s;
  }
  .mg-buy:hover{box-shadow:0 4px 12px rgba(255,122,24,.36);}
  .mg-buy:active{transform:scale(.95);}
  .mg-buy .mg-tip{font-size:10px;font-weight:500;opacity:.9;}
  .mg-paid{
    margin-top:2px;display:inline-flex;align-items:center;gap:5px;align-self:flex-start;
    color:#2BA471;font-size:12px;font-weight:700;
  }
  .mg-paid svg{width:12px;height:12px;stroke:currentColor;stroke-width:2;fill:none;
    stroke-linecap:round;stroke-linejoin:round;}
  .mg-paid .mg-tn{color:#9AA0A6;font-weight:400;font-size:10px;}
  .mg-pend{
    margin-top:2px;align-self:flex-start;color:#C8871B;background:#FFF7E6;border:1px solid #FFE3AE;
    font-size:11px;font-weight:600;padding:3px 10px;border-radius:999px;
  }

  /* 支付完成自动通知里的订单号行 */
  .pay-done-no{margin:4px 0 0;font-size:11px;color:#9AA0A6;}

  /* 锁定的订单金额（只读，来自交易信息） */
  .fl-lock{
    margin-left:6px;font-size:10px;font-weight:600;color:#2BA471;
    background:#EAF7F1;border:1px solid #CDEBDF;border-radius:3px;padding:1px 5px;
  }
  .field.is-locked{
    background:#F4F5F7;color:#5A5E66;font-weight:700;cursor:not-allowed;
    border-color:#E3E5E9;
  }
  .field.is-locked:focus{border-color:#E3E5E9;box-shadow:none;}

  /* 支付方式选择弹层 */
  .pay-amount{color:#FF6B3B;font-size:18px;font-weight:800;}
  .pay-list{display:flex;flex-direction:column;gap:10px;margin:6px 0 4px;}
  .pay-item{
    display:flex;align-items:center;gap:12px;width:100%;padding:13px 14px;text-align:left;
    background:#fff;border:1.5px solid var(--line-strong);border-radius:12px;cursor:pointer;
    transition:border-color .15s,background .15s,transform .1s;
  }
  .pay-item:hover{border-color:var(--orange);background:#FFFBF5;}
  .pay-item:active{transform:scale(.985);}
  .pay-ico{width:40px;height:40px;flex-shrink:0;display:block;object-fit:contain;
    /* 512px 高清图缩放显示，任意尺寸都锐利 */
    image-rendering:auto;}
  .pay-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;}
  .pay-txt b{font-size:14px;color:var(--ink);font-weight:700;}
  .pay-txt span{font-size:11.5px;color:#9AA0A6;line-height:1.4;}
  .pay-arrow{color:#C4C8D0;font-size:20px;line-height:1;flex-shrink:0;}
  .pay-note{margin:10px 0 0;font-size:11px;color:#A8AEB6;line-height:1.6;text-align:center;}

  /* ===== 官方贴（官方认证填写账号信息 + 上传账号图片） ===== */
  .msg-post{
    width:100%;max-width:420px;background:#fff;border-radius:14px;overflow:hidden;
    box-shadow:0 3px 14px rgba(30,32,36,.10);border:1px solid #F0F1F3;
  }
  .mp-head{
    display:flex;align-items:center;gap:7px;padding:11px 14px 9px;
    background:#fff;border-bottom:1px solid var(--line);
  }
  .mp-badge{
    font-size:10px;font-weight:700;color:var(--orange);background:#fff;
    border:1px solid var(--orange);border-radius:5px;padding:2px 6px;line-height:1.5;
    letter-spacing:.5px;flex-shrink:0;
  }
  .mp-title{font-size:14px;font-weight:700;color:#1C1E21;line-height:1.4;min-width:0;}
  /* 账号图片：主图大图展示，突出重要元素 */
  .mp-imgs{padding:12px 14px 0;}
  .mp-main{width:100%;border-radius:11px;overflow:hidden;background:#F2F3F5;position:relative;cursor:zoom-in;}
  .mp-main img{width:100%;height:auto;max-height:440px;object-fit:contain;display:block;}
  .mp-more{display:flex;gap:8px;margin-top:8px;}
  .mp-more .mp-thumb{
    width:74px;height:74px;border-radius:9px;overflow:hidden;background:#F5F6F8;
    cursor:zoom-in;border:1px solid #EFF0F2;flex-shrink:0;
  }
  .mp-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
  .mp-zoomhint{
    position:absolute;right:8px;bottom:8px;font-size:10px;color:#fff;
    background:rgba(17,20,24,.42);border-radius:20px;padding:3px 9px;backdrop-filter:blur(2px);
  }
  .mp-fields{padding:10px 14px 2px;display:flex;flex-direction:column;}
  .mp-field{
    display:flex;justify-content:space-between;align-items:flex-start;gap:16px;
    padding:8px 0;border-bottom:1px dashed #F1F2F4;font-size:13px;line-height:1.5;
  }
  .mp-field:last-child{border-bottom:none;}
  .mp-field .k{color:#9AA0A6;flex-shrink:0;}
  .mp-field .v{color:#1C1E21;font-weight:600;text-align:right;word-break:break-all;}
  .mp-field .v.hi{color:#FF6B3B;}
  .mp-note{
    margin:2px 14px 0;padding:9px 11px;background:#FFF8EE;border-radius:9px;
    font-size:12.5px;line-height:1.65;color:#8A6134;white-space:pre-wrap;word-break:break-word;
  }
  /* 公告消息（官方发布：标题 + 正文 + 多图） */
  .msg-notice{
    width:100%;max-width:420px;background:#fff;border-radius:14px;overflow:hidden;
    box-shadow:0 3px 14px rgba(30,32,36,.10);border:1px solid #F0F1F3;
  }
  .mn-badge{
    font-size:10px;font-weight:700;color:#fff;background:var(--orange);
    border:1px solid var(--orange);border-radius:5px;padding:2px 6px;line-height:1.5;
    letter-spacing:.5px;flex-shrink:0;
  }
  .mn-text{
    padding:11px 14px 0;font-size:13.5px;line-height:1.7;color:#33383E;
    white-space:pre-wrap;word-break:break-word;
  }
  .mn-main{width:100%;border-radius:11px;overflow:hidden;background:#F2F3F5;position:relative;cursor:zoom-in;}
  .mn-main img{width:100%;height:auto;max-height:440px;object-fit:contain;display:block;}

  .mp-foot{
    display:flex;align-items:center;gap:6px;padding:10px 14px 12px;margin-top:8px;
    font-size:10.5px;color:#B4B8BE;border-top:1px solid #F6F7F8;
  }
  .mp-foot img{width:16px;height:16px;border-radius:50%;object-fit:cover;}

  /* ===== 阅读确认（真实双方用户名称） ===== */
  .msg-confirm{
    width:100%;max-width:400px;background:#fff;border-radius:14px;overflow:hidden;
    box-shadow:0 3px 14px rgba(30,32,36,.10);border:1px solid #F0F1F3;
  }
  .mcf-head{
    display:flex;align-items:center;gap:7px;padding:11px 14px;
    font-size:13.5px;font-weight:700;color:#1C1E21;
    background:#fff;border-bottom:1px solid var(--line);
  }
  .mcf-head svg{width:16px;height:16px;flex-shrink:0;}
  .mcf-tip{padding:10px 14px 4px;font-size:12.5px;line-height:1.7;color:#6B7076;}
  .mcf-list{padding:6px 10px 4px;}
  .mcf-row{
    display:flex;align-items:center;gap:10px;padding:9px 6px;
    border-radius:11px;transition:background .15s;
  }
  .mcf-row + .mcf-row{border-top:1px dashed #F1F2F4;}
  .mcf-av{width:36px;height:36px;border-radius:50%;object-fit:cover;flex-shrink:0;box-shadow:0 1px 3px rgba(0,0,0,.08);}
  .mcf-info{min-width:0;flex:1;}
  .mcf-name{font-size:13px;font-weight:600;color:#1C1E21;display:flex;align-items:center;gap:5px;line-height:1.4;}
  .mcf-name .mcf-tag{
    font-size:9.5px;font-weight:500;border-radius:3px;padding:1px 3px;line-height:1;
    color:#8A9096;background:#F2F3F5;border:1px solid #E1E4E8;flex-shrink:0;
  }
  .mcf-name .mcf-tag.off{color:#FF7A00;background:#FFF3E2;border-color:#FFC27A;}
  .mcf-sub{font-size:10.5px;color:#A2A7AD;margin-top:3px;}
  .mcf-btn{
    flex-shrink:0;height:30px;padding:0 13px;border-radius:15px;cursor:pointer;
    border:1px solid #FFD9A8;background:#fff;color:#C1651A;font-size:12px;font-weight:600;
    font-family:inherit;transition:all .15s;
  }
  .mcf-btn:hover{background:#FFF3E2;}
  .mcf-btn:active{transform:scale(.97);}
  .mcf-row.ok .mcf-btn{
    background:#fff;color:#1AA260;border-color:#1AA260;
    cursor:default;box-shadow:none;
  }
  .mcf-row.ok{background:#F5FCF8;}
  .mcf-foot{
    display:flex;align-items:center;justify-content:space-between;gap:8px;
    padding:9px 14px 12px;border-top:1px solid #F6F7F8;font-size:10.5px;color:#B4B8BE;
  }
  .mcf-foot b{color:#42B673;font-weight:700;}

  /* ===== 空会话（已清空聊天记录） ===== */
  .empty-chat{
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:10px;padding:54px 24px;text-align:center;
  }
  .ec-avs{display:flex;align-items:center;}
  .ec-avs img{width:52px;height:52px;border-radius:50%;object-fit:cover;border:2.5px solid #fff;box-shadow:0 3px 10px rgba(30,32,36,.14);}
  .ec-avs img:last-child{margin-left:-14px;}
  .ec-arrow{
    position:relative;display:flex;align-items:center;justify-content:center;
    width:30px;height:30px;margin:0 4px;border-radius:50%;background:#FFF3E2;color:#FF8A1E;font-size:15px;
  }
  .ec-title{font-size:14px;font-weight:600;color:#4B5058;margin-top:4px;}
  .ec-sub{font-size:12.5px;color:#A2A7AD;line-height:1.7;max-width:420px;}
  .ec-sub b{color:#FF8A1E;font-weight:600;}
  .ec-chips{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:8px;}
  .ec-chip{
    display:flex;align-items:center;gap:6px;font-size:12px;color:#5B6066;
    background:#F7F8FA;border:1px solid #EFF0F2;border-radius:20px;padding:5px 12px 5px 5px;
  }
  .ec-chip img{width:22px;height:22px;border-radius:50%;object-fit:cover;}

  /* 图片放大查看 */
  /* 长图查看：点空白处收回；图片自身可滚动查看完整长图 */
  .zoom{
    position:fixed;inset:0;z-index:130;background:rgba(10,12,16,.9);
    display:none;align-items:flex-start;justify-content:center;padding:20px;cursor:zoom-out;
    overflow:hidden;
  }
  .zoom.open{display:flex;}
  .zoom-inner{
    max-width:100%;max-height:100%;overflow-y:auto;overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;border-radius:10px;cursor:default;
    scrollbar-width:thin;
  }
  .zoom-inner::-webkit-scrollbar{width:6px;}
  .zoom-inner::-webkit-scrollbar-thumb{background:rgba(255,255,255,.35);border-radius:3px;}
  .zoom img{display:block;width:100%;max-width:100%;height:auto;border-radius:10px;}
  .zoom-close{
    position:fixed;top:14px;right:16px;width:34px;height:34px;border:none;border-radius:50%;
    background:rgba(255,255,255,.16);color:#fff;font-size:16px;line-height:1;cursor:pointer;
    display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px);
  }
  .zoom-close:hover{background:rgba(255,255,255,.28);}

  /* 商品卡 */
  .goods-card{
    display:flex;gap:9px;background:#F5F6F8;border-radius:9px;
    padding:8px;margin:9px 0 4px;
  }
  .goods-img{width:72px;height:72px;border-radius:6px;overflow:hidden;flex-shrink:0;}
  .goods-img svg{width:100%;height:100%;}
  .goods-info{min-width:0;display:flex;flex-direction:column;justify-content:center;}
  .g-title{font-size:11px;line-height:1.5;color:#26282C;white-space:nowrap;}
  .g-price{font-size:11.5px;color:#9AA0A6;margin-top:6px;}
  .g-final{font-size:13px;font-weight:700;color:#1C1E21;margin-top:2px;}

  /* 交易规则 */
  .rule-box{border-top:1px solid #F1F2F4;margin-top:12px;padding-top:4px;}
  .rule-title{
    font-size:20px;font-weight:800;color:#1E2A47;
    margin:12px 0 6px;letter-spacing:.5px;
  }
  .rule-p{font-size:13.5px;line-height:1.78;color:#26282C;margin:9px 0;}
  .rule-p .rn{
    font-size:19px;font-weight:800;color:var(--orange-deep);
    margin-right:7px;line-height:1;vertical-align:-2px;letter-spacing:.5px;
  }

  /* ===== 底部操作区 ===== */
  .bottom{background:#fff;flex-shrink:0;border-top:1px solid var(--line);}

  /* 官方专属工具条（收拢，展开后横排） */
  .official-bar{
    display:none;align-items:center;
    padding:9px 0;background:#fff;border-bottom:1px solid var(--line);
  }
  .official-bar.show{display:flex;}
  .official-bar .wrap{display:flex;align-items:center;gap:8px;padding:0 14px;flex-wrap:wrap;}
  .obar-label{display:flex;align-items:center;gap:5px;font-size:11.5px;color:#FF8A1E;font-weight:600;flex-shrink:0;}
  .obar-label .role-dot{background:#FF8A1E;}
  .obar-btn{
    display:flex;align-items:center;gap:5px;height:32px;padding:0 13px;
    border-radius:16px;cursor:pointer;border:1px solid var(--orange-soft);background:#fff;
    color:var(--orange);font-size:12px;font-weight:600;white-space:nowrap;
    transition:background .15s,border-color .15s;
  }
  .obar-btn:hover{background:#FFFBF6;border-color:var(--orange);}
  .obar-btn:active{opacity:.7;transform:scale(.98);}
  .obar-btn .ic{width:14px;height:14px;}

  /* 快捷操作栏（消息栏上方） */
  .quick-bar{background:#fff;border-bottom:1px solid var(--line);}
  /* 用户功能：强制并列一排，不换行 */
  .quick-bar .wrap{display:flex;align-items:center;gap:8px;padding:9px 14px;flex-wrap:nowrap;
    overflow-x:auto;scrollbar-width:none;}
  .quick-bar .wrap::-webkit-scrollbar{display:none;}
  .qbtn{flex:0 0 auto;}
  .qbtn{
    display:flex;align-items:center;justify-content:center;gap:5px;
    background:#fff;border:1px solid var(--line);cursor:pointer;border-radius:19px;
    font-size:12.5px;color:#3C4046;padding:8px 15px;white-space:nowrap;
    transition:background .15s,border-color .15s,color .15s;
  }
  .qbtn:hover{background:#FFFBF6;border-color:var(--orange-soft);color:var(--orange);}
  .qbtn:hover svg{stroke:var(--orange);}
  .qbtn:active{opacity:.7;transform:scale(.98);}
  .qbtn .ic{width:15px;height:15px;}
  .qbtn.hide{display:none!important;}
  .qbtn-more{color:#C1651A;border-color:#FFDDB4;background:#FFF7EC;font-weight:600;}
  .qbtn-more.on{background:#FFEFD9;border-color:#FFC27A;}

  /* ===== 表情 / 更多面板（底部悬浮） ===== */
  .panel{
    position:fixed;left:50%;bottom:0;transform:translate(-50%,105%);
    width:100%;max-width:960px;background:#F7F8FA;
    border-radius:14px 14px 0 0;box-shadow:0 -6px 24px rgba(20,22,26,.10);
    z-index:70;transition:transform .26s cubic-bezier(.22,.9,.36,1);
    display:none;
  }
  .panel.open{display:block;transform:translate(-50%,0);}
  .panel-inner{max-width:960px;margin:0 auto;padding:16px 18px 22px;position:relative;}
  .pane-title{font-size:12px;color:#9AA0A6;margin:0 0 10px;font-weight:600;}
  /* 表情包页签（线条风格） */
  /* 表情面板页签：纯图标按钮，无文字 */
  .pane-tabs{display:flex;gap:8px;margin:0 0 14px;}
  .pane-tab{
    width:40px;height:34px;padding:0;border:1px solid var(--line);background:#fff;
    cursor:pointer;border-radius:10px;color:#6B7076;font-family:inherit;
    display:flex;align-items:center;justify-content:center;
    transition:border-color .15s,color .15s,background .15s;
  }
  .pane-tab:hover{border-color:var(--orange-soft);color:var(--orange);}
  .pane-tab.on{border-color:var(--orange);color:var(--orange);background:#FFFBF6;}
  .pane-tab svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;}
  .pane-tab img{width:26px;height:26px;object-fit:contain;display:block;}
  .pane-body{min-height:88px;}
  .emoji-panel{height:300px;overflow-y:auto;}
  /* 线条表情：铺满整行，描边风格 */
  /* 表情 tab：动态 GIF 网格（与动态表情包同款布局） */
  .emoji-grid{
    display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));
    gap:8px;width:100%;
  }
  .emoji-item{
    display:flex;align-items:center;justify-content:center;
    cursor:pointer;border-radius:10px;border:1px solid transparent;background:none;
    aspect-ratio:1/1;color:#4B5159;padding:4px;
  }
  .emoji-item svg{width:100%;height:100%;}
  .emoji-item img{width:100%;height:100%;object-fit:contain;display:block;}
  .emoji-item:hover{background:#FFFBF6;border-color:var(--orange-soft);color:var(--orange);}
  .emoji-item:active{transform:scale(.9);}
  /* 动态表情包：网格铺满整行，不靠 flex 换行留右侧空白 */
  .gif-grid{
    display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));
    gap:8px;width:100%;
  }
  .gif-item{
    aspect-ratio:1/1;border:none;background:transparent;cursor:pointer;
    padding:4px;display:flex;align-items:center;justify-content:center;border-radius:10px;
  }
  .gif-item:hover{background:#F4F5F7;}
  .gif-item:active{transform:scale(.94);}
  .gif-item img{width:100%;height:100%;object-fit:contain;display:block;}
  .panel-close{
    position:absolute;top:12px;right:18px;width:28px;height:28px;border:none;background:#EFF0F2;
    border-radius:8px;color:#8A9096;cursor:pointer;font-size:13px;line-height:1;
  }
  .panel-close:hover{background:#E6E8EB;}

  .plus-panel{height:200px;}
  .plus-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;max-width:520px;}
  .plus-item{background:none;border:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:7px;}
  /* 加号面板：线条勾勒风格（描边方块 + 线条图标） */
  .plus-item .p-ico{
    width:58px;height:58px;border-radius:14px;background:#fff;
    display:flex;align-items:center;justify-content:center;
    border:1px solid var(--line);color:#4B5159;
    transition:border-color .15s,color .15s,background .15s;
  }
  .plus-item .p-ico svg{width:26px;height:26px;}
  .plus-item span{font-size:11px;color:#6B7076;}
  .plus-item:hover .p-ico{border-color:var(--orange-soft);color:var(--orange);background:#FFFBF6;}
  .plus-item:active .p-ico{transform:scale(.93);}
  .plus-item[hidden]{display:none !important;}

  /* ===== 输入栏 ===== */
  .input-bar{padding:9px 0 12px;background:#fff;}
  .input-bar-inner{
    max-width:960px;margin:0 auto;padding:0 14px;
    display:flex;align-items:center;gap:9px;
  }
  .input-wrap{
    flex:1;background:#F5F6F8;border-radius:12px;min-height:40px;
    display:flex;align-items:center;padding:9px 14px;min-width:0;
    box-shadow:inset 0 0 0 .5px #ECEDEF;
  }
  .input-edit{
    flex:1;min-width:0;outline:none;font-size:14px;line-height:1.45;color:var(--text);
    font-family:inherit;max-height:96px;overflow-y:auto;word-break:break-word;white-space:pre-wrap;
  }
  .input-edit:empty:before{content:attr(data-ph);color:#B4B8BE;pointer-events:none;}
  .mention{color:#FF9E43;font-weight:600;background:#FFF2E0;border-radius:6px;padding:1px 5px;margin:0 1px;}
  .in-ico{
    width:32px;height:32px;border:none;background:none;cursor:pointer;border-radius:8px;
    display:flex;align-items:center;justify-content:center;color:#7E848C;flex-shrink:0;
  }
  .in-ico:hover{background:#EAEBED;}
  .in-ico:active{opacity:.6;}
  .in-ico svg{width:23px;height:23px;}
  /* 表情按钮：使用第一个表情包作为标识 */
  .in-ico-sticker img{width:26px;height:26px;object-fit:contain;display:block;}
  .send-btn{
    width:32px;height:32px;border-radius:50%;border:none;cursor:pointer;
    background:var(--orange);color:#fff;
    display:flex;align-items:center;justify-content:center;flex-shrink:0;
  }
  .send-btn:hover{background:#FF7A00;}
  .send-btn:active{transform:scale(.93);}
  .send-btn svg{width:17px;height:17px;}

  /* ===== 底部弹窗（全局悬浮） ===== */
  .mask{
    position:fixed;inset:0;background:rgba(10,12,16,.45);z-index:100;
    opacity:0;pointer-events:none;transition:opacity .25s;
  }
  .mask.open{opacity:1;pointer-events:auto;}
  .sheet{
    position:fixed;left:50%;bottom:0;z-index:101;
    width:100%;max-width:560px;max-height:88vh;overflow-y:auto;
    background:#fff;border-radius:18px 18px 0 0;
    padding:18px 20px 28px;
    transform:translate(-50%,106%);transition:transform .3s cubic-bezier(.22,.9,.36,1);
  }
  .sheet.open{transform:translate(-50%,0);}
  .sheet h3{font-size:15.5px;text-align:center;font-weight:700;}
  .sheet .sub{font-size:12px;color:#A2A7AD;text-align:center;margin-top:6px;}
  .sheet-close{
    position:absolute;top:14px;right:14px;width:30px;height:30px;border-radius:9px;
    border:none;background:#F2F3F5;color:#8A9096;font-size:14px;cursor:pointer;line-height:1;
  }
  .sheet-close:hover{background:#E9EBEE;}

  /* 评价（同款表情包） */
  .rate-title{font-size:15px;text-align:center;font-weight:600;line-height:1.5;padding:2px 26px 0;}
  .rate-title b{color:#FF7A00;font-weight:700;}
  .rate-row{display:flex;justify-content:space-between;gap:4px;margin:16px 0 4px;}
  .rate-item{
    flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;
    background:none;border:none;cursor:pointer;padding:10px 2px;border-radius:14px;
  }
  .rate-item svg{width:52px;height:52px;transition:transform .12s;}
  .rate-item span{font-size:11.5px;color:#6B7076;white-space:nowrap;}
  .rate-item img{width:52px;height:52px;object-fit:contain;transition:transform .12s;}
  .rate-item:hover{background:#F7F8FA;}
  .rate-item:hover svg,.rate-item:hover img{transform:scale(1.08);}
  .rate-item:active svg,.rate-item:active img{transform:scale(.9);}
  .rate-item.on{background:#FFF6EA;}
  .rate-item.on span{color:#FF7A00;font-weight:600;}
  /* 评价弹窗次级提示（原 .sheet .sub 为居中无间距，这里单独控制） */
  .rate-sub{font-size:12px;color:#A2A7AD;text-align:center;margin:12px 0 0;}

  /* 表单字段 */
  .field-label{font-size:12.5px;color:#8A9096;margin:14px 0 6px;display:block;}
  .field,.field-area{
    width:100%;border:1px solid #E5E7EA;border-radius:10px;padding:0 12px;height:42px;
    font-size:14px;outline:none;font-family:inherit;color:var(--text);background:#fff;
  }
  .field-area{height:84px;padding:10px 12px;resize:none;line-height:1.6;}
  .field:focus,.field-area:focus{border-color:#FFB05C;}
  /* 填写权限选择器：卖家 / 买家 二选一 */
  .role-pick{display:flex;gap:10px;margin-top:2px;}
  .rp-item{
    flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;position:relative;
    padding:12px 8px 10px;border:1.5px solid #E5E7EA;border-radius:12px;background:#fff;
    cursor:pointer;font-family:inherit;transition:.15s;
  }
  .rp-item:hover{border-color:#FFC27A;background:#FFFBF5;}
  .rp-item.on{border-color:var(--orange);background:#FFF7EF;box-shadow:0 0 0 2px rgba(255,143,31,.12);}
  .rp-av{width:38px;height:38px;border-radius:50%;object-fit:cover;display:block;background:#F0F1F3;}
  .rp-t{font-size:13px;font-weight:700;color:var(--text);}
  .rp-n{font-size:11px;color:#9AA0A6;}
  .rp-ck{
    position:absolute;top:6px;right:6px;width:18px;height:18px;border-radius:50%;
    background:var(--orange);display:flex;align-items:center;justify-content:center;
    opacity:0;transition:.15s;
  }
  .rp-ck svg{
    width:11px;height:11px;fill:none;stroke:#fff;stroke-width:2.6;
    stroke-linecap:round;stroke-linejoin:round;
  }
  .rp-item.on .rp-ck{opacity:1;}
  .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;}
  @media (max-width:560px){.form-grid{grid-template-columns:1fr;}}
  .upload{
    position:relative;border:1.5px dashed #D8DBDF;border-radius:12px;background:#FAFBFC;
    height:124px;display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:6px;color:#9AA0A6;font-size:12.5px;cursor:pointer;overflow:hidden;margin-top:6px;
  }
  .upload:hover{border-color:#FFC27A;background:#FFFBF5;}
  .upload img{width:100%;height:100%;object-fit:cover;display:block;}
  .upload .u-del{
    position:absolute;top:8px;right:8px;width:24px;height:24px;border-radius:50%;
    background:rgba(17,20,24,.62);color:#fff;border:none;cursor:pointer;font-size:13px;line-height:1;
  }
  .upload .u-ico{font-size:22px;color:#C4C8CD;line-height:1;}

  /* 多图上传（官方贴账号图片） */
  .up-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:6px;}
  .up-tile{
    position:relative;aspect-ratio:1/1;border-radius:12px;overflow:hidden;cursor:pointer;
    border:1.5px dashed #D8DBDF;background:#FAFBFC;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
    color:#9AA0A6;font-size:11px;
  }
  .up-tile:hover{border-color:#FFC27A;background:#FFFBF5;}
  .up-tile img{width:100%;height:100%;object-fit:cover;display:block;}
  .up-tile .u-del{
    position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:50%;
    background:rgba(17,20,24,.62);color:#fff;border:none;cursor:pointer;font-size:12px;line-height:1;
  }
  .up-tile .u-main{
    position:absolute;left:6px;bottom:6px;font-size:9.5px;color:#fff;
    background:rgba(255,122,31,.92);border-radius:20px;padding:2px 7px;font-weight:600;
  }
  .up-tile .u-ico{font-size:20px;color:#C4C8CD;line-height:1;}

  .btn-primary{
    width:100%;height:44px;margin-top:18px;border:1.5px solid var(--orange);border-radius:22px;cursor:pointer;
    background:#fff;color:var(--orange);font-size:15px;font-weight:700;font-family:inherit;
    transition:background .15s;
  }
  .btn-primary:hover{background:#FFF7EF;}
  .btn-primary:active{opacity:.85;}
  .btn-ghost{
    width:100%;height:44px;margin-top:10px;border:1px solid #E5E7EA;border-radius:22px;cursor:pointer;
    background:#fff;color:#6B7076;font-size:15px;font-family:inherit;
  }
  .btn-ghost:hover{background:#F7F8FA;}

  .info-list{padding:0 2px;}
  .info-row{
    display:flex;justify-content:space-between;align-items:flex-start;gap:20px;
    padding:10px 0;border-bottom:1px solid #F3F4F6;font-size:13.5px;
  }
  .info-row:last-child{border-bottom:none;}
  .info-row .k{color:#8A9096;flex-shrink:0;}
  .info-row .v{color:#1C1E21;text-align:right;word-break:break-all;font-weight:500;}
  .info-row .v.org{color:#FF7A00;font-weight:600;}
  /* 交易信息图片 */
  .info-img-row{align-items:center;}
  .info-img-row .info-img{
    width:96px;height:96px;object-fit:cover;border-radius:9px;
    border:1px solid #F0F1F3;cursor:zoom-in;display:block;
  }

  /* 链接失效遮罩（默认隐藏，仅 .show 时覆盖整个聊天区） */
  .link-dead{
    position:absolute;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;
    background:rgba(240,241,243,.96);opacity:0;pointer-events:none;transition:opacity .25s;padding:24px;
  }
  .link-dead.show{opacity:1;pointer-events:auto;}
  .link-dead .ld-box{
    background:#fff;border-radius:16px;padding:30px 26px;max-width:320px;width:100%;text-align:center;
    box-shadow:0 12px 40px rgba(0,0,0,.12);display:flex;flex-direction:column;align-items:center;gap:8px;
  }
  .link-dead .ld-ico{font-size:42px;line-height:1;}
  .link-dead .ld-msg{font-size:15px;font-weight:700;color:#3B4045;margin:4px 0 0;line-height:1.5;}
  .link-dead .ld-sub{font-size:12.5px;color:#9AA0A6;margin:0;}

  /* toast */
  .toast{
    position:fixed;top:44%;left:50%;transform:translate(-50%,-50%) scale(.94);
    background:rgba(17,20,24,.82);color:#fff;font-size:13px;
    padding:10px 18px;border-radius:9px;z-index:120;
    opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;
    max-width:70%;text-align:center;line-height:1.5;
  }
  .toast.show{opacity:1;transform:translate(-50%,-50%) scale(1);}

/* ===== 交易信息弹层内的「官方操作」开关 ===== */
.info-ops{margin:2px 0 12px;}
.info-ops-btn{
  width:100%;height:42px;border:1px solid var(--orange-soft);border-radius:11px;
  background:#fff;color:#E8720C;font-size:13.5px;font-weight:700;font-family:inherit;cursor:pointer;
}
.info-ops-btn:hover{background:#FFF7EF;}
.info-ops-btn.on{background:#FFF1E2;border-color:var(--orange);}
.info-ops-tip{margin:8px 0 0;font-size:11.5px;color:#9AA0A6;line-height:1.6;}

/* ===== 暗藏技能：支付接口设置弹窗（连点螃蟹头像 4 下进入） ===== */
.modal{position:fixed;inset:0;background:rgba(20,23,28,.32);display:flex;align-items:center;justify-content:center;z-index:90;}
.modal[hidden]{display:none !important;}
.modal-card{background:#fff;border-radius:16px;padding:22px;width:384px;max-width:92vw;box-shadow:0 18px 52px rgba(0,0,0,.18);max-height:88vh;overflow:auto;}
.modal-card h3{margin:0 0 4px;font-size:17px;font-weight:800;color:#1F2329;}
.modal-card .sub{font-size:12.5px;color:#9AA0A6;margin-bottom:14px;line-height:1.6;}
.pc-label{font-size:12.5px;color:#6B7280;margin:2px 0 5px;font-weight:600;}
.pc-field{width:100%;padding:11px 12px;border:1px solid #E2E5EA;border-radius:11px;font-size:14px;box-sizing:border-box;margin-bottom:11px;outline:none;color:#1F2329;font-family:inherit;}
.pc-field:focus{border-color:#FF8F1F;}
.pc-field::placeholder{color:#B0B5BC;}
.pc-actions{display:flex;gap:10px;margin-top:6px;}
.pc-actions button{flex:1;padding:12px;border-radius:11px;font-size:15px;font-weight:700;border:1px solid transparent;cursor:pointer;font-family:inherit;}
.pc-primary{background:#FF8F1F;color:#fff;}
.pc-primary:hover{background:#F77F0A;}
.pc-primary:active{opacity:.85;}
.pc-ghost{background:#fff;color:#6B7280;border-color:#D8DCE2;}
.pc-ghost:hover{border-color:#B7BDC6;}
.pc-ghost:active{opacity:.85;}
  .pc-hint{font-size:11.5px;color:#B0B5BC;margin-top:10px;line-height:1.6;}
  .pc-err{color:#E5484D;font-size:12.5px;margin-top:10px;text-align:center;min-height:16px;}
/* 螃蟹头像（顶部连点入口）：放大点击区域，但视觉仍是小图标 */
.crab-tap{cursor:pointer;}
.crab-tap img{display:block;}

/* 客服发言身份切换（输入框左侧身份胶囊） */
.as-pill{flex:none;align-self:center;height:30px;padding:0 10px;margin-right:6px;border:1px solid #E3E6EA;border-radius:15px;background:#fff;font-size:12px;font-weight:600;color:#667;cursor:pointer;white-space:nowrap;user-select:none;}
.as-pill.as-official{color:#E5484D;border-color:#F0C9CB;background:#FDF3F3;}
.as-pill.as-buyer{color:#6E56CF;border-color:#DCD3F5;background:#F7F5FE;}
.as-pill.as-seller{color:#1877C9;border-color:#C7E0F5;background:#F2F8FD;}
.as-pill:active{transform:scale(.95);}
.as-pill.hide{display:none;}
/* 双方确认交易卡 */
.msg-deal .mcf-head.done{color:#1A7F37;}
.msg-deal.is-done{border-color:#C6E9D4;background:#F4FBF6;}
.mcf-tip.ok{color:#1A7F37;}
.mcf-btn.dk-act{background:#E5484D;color:#fff;border-color:#E5484D;}
.mcf-btn:disabled{opacity:.55;cursor:default;}