/* 在线客服悬浮按钮 v5b（复刻自 jiege01.cn） */
.cs-float4{position:fixed!important;right:24px!important;bottom:16px;z-index:2147483647!important;pointer-events:none!important;font-family:-apple-system,BlinkMacSystemFont,sans-serif;-webkit-transform:translateZ(0);transform:translateZ(0);
  animation:csFloatBounce 3s ease-in-out infinite;}
/* 上下浮动动画 */
@keyframes csFloatBounce{0%,100%{bottom:16px}50%{bottom:28px}}
.cs-circle4{width:50px;height:50px;border-radius:50%;background:#fff!important;
box-shadow:0 4px 20px rgba(168,132,46,0.45),0 0 0 3px rgba(168,132,46,0.15)!important;display:flex;align-items:center;justify-content:center;
cursor:pointer;border:none;outline:none;padding:0;margin:0;pointer-events:auto!important;overflow:hidden;
touch-action:manipulation;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;
position:relative;transition:all .35s cubic-bezier(.4,0,.2,1);
-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;}
.cs-circle4:hover{transform:scale(1.1);box-shadow:0 6px 30px rgba(168,132,46,0.55),0 0 0 4px rgba(168,132,46,0.25)!important}
.cs-circle4:active{transform:scale(0.95)}
.cs-avatar-img{width:100%;height:100%;border-radius:50%;object-fit:cover;object-position:center top;display:block;transition:transform .35s ease;}
.cs-circle4:hover .cs-avatar-img{transform:scale(1.08)}
/* 呼吸脉冲动画 */
.cs-circle4::before{content:'';position:absolute;top:-6px;left:-6px;right:-6px;bottom:-6px;border-radius:50%;
border:2px solid rgba(168,132,46,0.3);animation:csAvatarPulse 2.5s ease-in-out infinite;z-index:-1;}
@keyframes csAvatarPulse{0%,100%{opacity:0.5;transform:scale(1)}50%{opacity:0;transform:scale(1.15)}}
.cs-pop4{position:absolute;bottom:72px;right:0;width:280px;background:#fff;border-radius:16px;
box-shadow:0 12px 48px rgba(0,0,0,0.12);padding:20px;opacity:0;visibility:hidden;
transform:translateY(16px) scale(0.96);transition:all .35s cubic-bezier(.4,0,.2,1);
pointer-events:auto!important;
-webkit-transform:translateZ(0);transform:translateZ(0);}
.cs-pop4.show{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.cs-pop4 h4{margin:0 0 16px;font-size:15px;font-weight:600;color:#a8842e;display:flex;align-items:center;gap:8px}
.cs-dot4{display:inline-block;width:7px;height:7px;background:#a8842e;border-radius:50%;animation:csPulse4 1.8s ease-in-out infinite}
@keyframes csPulse4{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(0.8)}}
.cs-item4{display:flex;align-items:center;padding:11px 6px;border-bottom:1px solid #f5f5f5;text-decoration:none;color:#333;
transition:all .2s ease;border-radius:8px;pointer-events:auto!important;cursor:pointer;}
.cs-item4:last-child{border-bottom:none}
.cs-item4:hover{background:#fdf9ef;padding-left:12px}
.cs-item-icon{width:36px;height:36px;margin-right:12px;flex-shrink:0;object-fit:contain;border-radius:8px;}
.cs-info4{flex:1;min-width:0}.cs-lbl4{font-size:11px;color:#aaa;line-height:1.3}.cs-val4{font-size:13px;font-weight:600;color:#a8842e;line-height:1.4}
.cs-val4.hl{color:#a8842e}
.cs-x4{position:absolute;top:10px;right:10px;width:24px;height:24px;border:none;background:#f7f7f7;border-radius:50%;
cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:11px;color:#bbb;transition:all .2s;line-height:1;
pointer-events:auto!important;}
.cs-x4:hover{background:#eee;color:#666}
/* 二维码弹窗 */
.cs-qr-modal4{position:fixed;top:0;left:0;right:0;bottom:0;width:100vw;height:100vh;height:100dvh;
background:rgba(0,0,0,.45);z-index:999999;display:flex;align-items:center;justify-content:center;
opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;pointer-events:none;
-webkit-tap-highlight-color:transparent;}
.cs-qr-modal4.show{opacity:1;visibility:visible;pointer-events:auto!important;display:flex;align-items:center;justify-content:center;}
.cs-qr-box4{position:relative;background:#fff;border-radius:16px;padding:12px 10px 12px;text-align:center;
box-shadow:0 20px 60px rgba(0,0,0,.25);z-index:1;max-width:340px;width:88%;margin:20px auto;
transform:scale(.9) translateY(16px);transition:transform .35s cubic-bezier(.4,0,.2,1);box-sizing:border-box}
.cs-qr-modal4.show .cs-qr-box4{transform:scale(1) translateY(0)}
.cs-qr-box4 img{width:100%;height:auto;max-width:100%;border-radius:10px;object-fit:contain;border:1px solid #f0f0f0;display:block;margin:0 auto 14px;}
.cs-qr-box4 p{margin:0 0 4px;font-size:15px;font-weight:700;color:#222;line-height:1.4}
.cs-qr-box4 span{display:block;font-size:12px;color:#888;margin-bottom:16px;line-height:1.4}
.cs-qr-box4 button{display:inline-block;margin:0;padding:10px 32px;border:none;background:linear-gradient(135deg,#c5a45e,#a8842e);
color:#fff;border-radius:24px;cursor:pointer;font-size:14px;font-weight:600;outline:none;
touch-action:manipulation;-webkit-tap-highlight-color:transparent;
box-shadow:0 2px 8px rgba(168,132,46,0.35);transition:transform .15s ease,box-shadow .15s ease;}
.cs-qr-box4 button:active{transform:scale(0.96);box-shadow:0 1px 4px rgba(168,132,46,0.3)}
@media(max-width:480px){
.cs-float4{right:14px!important;bottom:14px;animation:csFloatBounceMobile 3s ease-in-out infinite;}
@keyframes csFloatBounceMobile{0%,100%{bottom:14px}50%{bottom:26px}}
.cs-circle4{width:52px;height:52px}.cs-pop4{width:250px;padding:16px}
.cs-qr-box4{width:82%;padding:12px 10px 12px}.cs-qr-box4 img{width:100%;height:auto}
}