:root{
  --vhb-bg:#0b0c0f; --vhb-fg:#fff; --vhb-border:rgba(255,255,255,.12);
  --vhb-blue:#0A84FF; --vhb-blue2:#007AFF; --vhb-soft:#111318;
}
.vhb-fab{ position:fixed; right:18px; bottom:18px; height:46px; padding:0 14px; display:flex; align-items:center; gap:10px; border-radius:999px; background:#0e0f12; color:#fff; border:1px solid var(--vhb-border); cursor:pointer; z-index:2147483646; box-shadow:0 10px 26px rgba(0,0,0,.45); }
.vhb-fab .fab-dot{ width:10px; height:10px; border-radius:50%; background:var(--vhb-blue); box-shadow:0 0 10px var(--vhb-blue); }
.vhb-fab .fab-label{ font:600 14px/1 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial }
.vhb-fab.ping .fab-dot{ animation:vh-pulse 1.2s infinite; }
@keyframes vh-pulse{ 0%{ box-shadow:0 0 0 0 rgba(10,132,255,.7) } 70%{ box-shadow:0 0 0 12px rgba(10,132,255,0) } 100%{ box-shadow:0 0 0 0 rgba(10,132,255,0) } }
.vhb-panel{ position:fixed; right:12px; bottom:12px; width:420px; max-width:95vw; background:var(--vhb-bg); color:var(--vhb-fg); border:1px solid var(--vhb-border); border-radius:18px; display:none; z-index:2147483647; overflow:hidden; box-shadow:0 26px 60px rgba(0,0,0,.45); }
.vhb-panel.show{ display:block; }
.vhb-panel.mode-pre .vhb-body{ height: 180px; }
.vhb-panel:not(.mode-pre) .vhb-body{ height: 52vh; }
@media (max-width:640px){
  .vhb-panel{ left:10px; right:10px; bottom:10px; width:auto; }
  .vhb-panel.mode-pre .vhb-body{ height: 150px; }
  .vhb-panel:not(.mode-pre) .vhb-body{ height: 60vh; }
}
.vhb-head{ display:flex; justify-content:space-between; align-items:center; padding:14px 16px; border-bottom:1px solid var(--vhb-border); font:700 16px/1.2 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial; }
.vhb-head .actions{ display:flex; gap:8px; }
.vhb-x{ width:32px; height:32px; border-radius:10px; border:1px solid var(--vhb-border); background:#121317; color:#fff; display:grid; place-items:center; cursor:pointer }
.vhb-btn{ padding:10px 14px; border-radius:12px; border:1px solid var(--vhb-border); background:#121317; color:#fff; cursor:pointer }
.vhb-btn.primary{ background:linear-gradient(180deg, var(--vhb-blue), var(--vhb-blue2)); border:none; color:#fff; font-weight:700; }
.vhb-btn.outline{ background:transparent; }
.vhb-body{ padding:14px; overflow:auto; -webkit-overflow-scrolling:touch; scrollbar-width:thin; }
.vhb-body::-webkit-scrollbar{ width:8px } .vhb-body::-webkit-scrollbar-thumb{ background:#2a2a2e; border-radius:8px }
.vhb-msg{ max-width:78%; padding:10px 13px; border-radius:18px; margin:10px 0; font-size:14px; box-shadow:0 6px 16px rgba(0,0,0,.25) }
.vhb-msg.agent{ background:#fff; color:#111; margin-right:auto; border-top-left-radius:6px; }
.vhb-msg.visitor{ background:linear-gradient(180deg, var(--vhb-blue), var(--vhb-blue2)); color:#fff; margin-left:auto; border-top-right-radius:6px; }
.vhb-who{ display:block; font-size:12px; opacity:.75; margin:0 4px 6px }
.vhb-pre{ padding:12px; border-top:1px solid var(--vhb-border); background:var(--vhb-soft); }
.vhb-pre .row{ margin:10px 0; } .vhb-pre label{ font-size:12px; color:#b4bcc8; display:block; margin-bottom:6px; }
.vhb-input{ width:100%; padding:12px 14px; border:1px solid var(--vhb-border); border-radius:12px; background:#0f1116; color:#fff; outline:none; font-size:16px; -webkit-text-size-adjust:100%; text-size-adjust:100%; }
.vhb-foot{ padding:12px; border-top:1px solid var(--vhb-border); background:var(--vhb-soft); }
.vh-sendbar{ display:flex; align-items:center; gap:10px; }
.vh-sendbar .send-input{ flex:1; border-radius:18px 10px 10px 18px; font-size:16px; }
.vh-sendbar .send-btn{ padding:12px 16px; border-radius:10px 18px 18px 10px; }
.vhb-powered{ text-align:center; font:600 11px/1.2 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial; color:#9aa3af; padding:8px 0 12px; border-top:1px solid var(--vhb-border); background:#0b0e12; }