/* 在线客服挂件样式（PC / darkv） */
#cs-fab {
    position: fixed; right: 20px; bottom: 80px; z-index: 1500;
    width: 56px; height: 56px; border-radius: 50%;
    background: linear-gradient(135deg, #4f46e5, #7c3aed); color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 26px; cursor: pointer; box-shadow: 0 8px 24px rgba(79,70,229,.4);
    user-select: none;
}
#cs-fab:hover { filter: brightness(1.08); }
.cs-badge {
    position: absolute; top: -4px; right: -4px; min-width: 18px; height: 18px;
    padding: 0 4px; border-radius: 9px; background: #f44336; color: #fff;
    font-size: 12px; line-height: 18px; text-align: center;
}
#cs-panel {
    position: fixed; right: 20px; bottom: 148px; z-index: 1501;
    width: 360px; height: 520px; max-height: 80vh;
    background: #16181f; border: 1px solid #2c2f3d; border-radius: 12px;
    display: flex; flex-direction: column; overflow: hidden;
    box-shadow: 0 20px 60px rgba(0,0,0,.5); font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
}
#cs-head {
    height: 48px; padding: 0 14px; background: #1f2530; color: #fff;
    display: flex; align-items: center; justify-content: space-between; font-size: 15px; font-weight: 600;
}
#cs-close { cursor: pointer; font-size: 22px; line-height: 1; color: #c2c7d4; }
#cs-close:hover { color: #fff; }
#cs-msgs {
    flex: 1; overflow-y: auto; padding: 14px; background: #10121a;
}
.cs-row { display: flex; margin-bottom: 12px; }
.cs-left { justify-content: flex-start; }
.cs-right { justify-content: flex-end; }
.cs-bubble {
    max-width: 75%; padding: 8px 12px; border-radius: 10px; line-height: 1.5;
    word-break: break-all; font-size: 14px;
}
.cs-left .cs-bubble { background: #262b36; color: #e8eaf0; border-bottom-left-radius: 2px; }
.cs-right .cs-bubble { background: #4f46e5; color: #fff; border-bottom-right-radius: 2px; }
.cs-img { max-width: 180px; max-height: 180px; border-radius: 6px; display: block; }
.cs-sys { text-align: center; color: #8b93a7; font-size: 12px; margin: 8px 0; }
#cs-emoji {
    display: flex; flex-wrap: wrap; gap: 2px; padding: 8px; background: #10121a;
    border-top: 1px solid #2c2f3d; max-height: 120px; overflow-y: auto;
}
.cs-emoji { cursor: pointer; font-size: 20px; padding: 4px; }
.cs-emoji:hover { background: #262b36; border-radius: 6px; }
#cs-bar {
    display: flex; align-items: center; gap: 6px; padding: 8px; background: #1f2530; border-top: 1px solid #2c2f3d;
}
#cs-bar button {
    border: none; background: #2c3140; color: #e8eaf0; border-radius: 6px;
    padding: 6px 10px; cursor: pointer; font-size: 16px; line-height: 1;
}
#cs-bar button:hover { background: #3a4150; }
#cs-text {
    flex: 1; height: 34px; border: 1px solid #2c2f3d; background: #10121a; color: #e8eaf0;
    border-radius: 6px; padding: 0 10px; outline: none; font-size: 14px;
}
#cs-send-btn { background: #4f46e5 !important; font-size: 14px !important; }
#cs-send-btn:hover { background: #4338ca !important; }
