:root{
  --bb-grad-1:#22577a; --bb-grad-2:#38a3a5; --bb-grad-3:#57cc99;
  --bb-surface:rgba(199,249,204,0.08);
  --bb-border:rgba(199,249,204,0.35);
  --bb-text:#fafffe;
  --bb-panel-bg:rgba(34,87,122,0.92);
  --bb-msg-user-bg:#38a3a5;
  --bb-msg-bot-bg:#57cc99;
  --bb-input-bg:rgba(199,249,204,0.25);
  --bb-badge:#80ed99;
  --bb-scroll-thumb:#80ed99;
}

.bb-widget{position:fixed;right:24px;bottom:24px;z-index:9999;font-family:'Inter',system-ui,ui-sans-serif,Segoe UI,Roboto,Helvetica,Arial}
.bb-widget.left{right:auto;left:24px}

.bb-button{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,var(--bb-grad-1),var(--bb-grad-2),var(--bb-grad-3));color:var(--bb-text);display:grid;place-items:center;box-shadow:0 10px 24px rgba(34,87,122,0.45);cursor:pointer;transition:transform .28s cubic-bezier(.34,1.56,.64,1), box-shadow .28s;position:relative;backdrop-filter:blur(18px);border:1px solid var(--bb-border);outline:none;font-size:22px;line-height:1}
.bb-button .bb-ico{display:inline-flex;align-items:center;justify-content:center;width:1em;height:1em;line-height:1;transform:translateY(1px)}
.bb-button:hover{transform:translateY(-3px) scale(1.06);box-shadow:0 18px 44px rgba(34,87,122,0.55)}
.bb-button:focus-visible{box-shadow:0 0 0 3px rgba(56,163,165,0.45)}
.bb-button .bb-badge{position:absolute;right:-2px;top:-2px;width:12px;height:12px;border-radius:50%;background:var(--bb-badge);box-shadow:0 0 0 2px rgba(34,87,122,0.35)}
.bb-button.pulse::after{content:'';position:absolute;inset:-6px;border-radius:50%;animation:bb-pulse 2.2s infinite}
@keyframes bb-pulse{0%{box-shadow:0 0 0 0 rgba(56,163,165,.45)}70%{box-shadow:0 0 0 12px rgba(56,163,165,0)}100%{box-shadow:0 0 0 0 rgba(56,163,165,0)}}
.bb-button.idle-bounce{animation:bb-bounce 2.4s infinite}
@keyframes bb-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}

@media (prefers-reduced-motion: reduce){.bb-button.pulse::after,.bb-button.idle-bounce{animation:none}}

.bb-panel{position:absolute;right:0;bottom:70px;width:350px;max-height:70vh;background:var(--bb-panel-bg);backdrop-filter:blur(18px);border:1px solid var(--bb-border);border-radius:18px;overflow:hidden;box-shadow:0 20px 48px rgba(34,87,122,0.6);transform-origin:bottom right;transform:scale(.86) translateY(10px);opacity:0;pointer-events:none;transition:transform .28s cubic-bezier(.34,1.56,.64,1), opacity .2s;color:var(--bb-text)}
.bb-panel.open{transform:scale(1) translateY(0);opacity:1;pointer-events:auto}
.bb-header{display:flex;align-items:center;gap:12px;padding:12px 14px;background:linear-gradient(180deg, rgba(199,249,204,0.12), rgba(199,249,204,0));}
.bb-logo{width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,var(--bb-grad-1),var(--bb-grad-2),var(--bb-grad-3))}
.bb-title{font-weight:700}

.bb-messages{padding:12px 14px;height:340px;overflow:auto;display:flex;flex-direction:column;gap:10px}
.bb-messages{scrollbar-width:thin;scrollbar-color:var(--bb-scroll-thumb) transparent}
.bb-messages::-webkit-scrollbar{width:10px;height:10px}
.bb-messages::-webkit-scrollbar-track{background:transparent}
.bb-messages::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--bb-grad-2),var(--bb-grad-3));border-radius:999px;border:2px solid transparent;background-clip:padding-box}
.bb-messages::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,var(--bb-grad-1),var(--bb-grad-2))}
.bb-msg{display:inline-block;padding:10px 12px;border-radius:12px;max-width:84%;line-height:1.35;color:var(--bb-text)}
.bb-msg.user{align-self:flex-end;background:var(--bb-msg-user-bg)}
.bb-msg.bot{align-self:flex-start;background:var(--bb-msg-bot-bg)}

.bb-suggestions{display:flex;flex-wrap:wrap;gap:8px;padding:8px 14px}
.bb-chip{font-size:12px;padding:6px 10px;border-radius:999px;background:rgba(199,249,204,0.16);cursor:pointer;transition:transform .16s ease, background .16s ease}
.bb-chip:hover{transform:translateY(-1px);background:rgba(199,249,204,0.24)}
.bb-typed{padding:4px 14px;opacity:.8;font-size:12px;min-height:18px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}

.bb-input{display:flex;gap:8px;padding:12px 14px;border-top:1px solid var(--bb-border)}
.bb-input input{flex:1;background:var(--bb-input-bg);border:1px solid var(--bb-border);color:var(--bb-text);border-radius:10px;padding:10px 12px;outline:none}
.bb-input input::placeholder{color:rgba(250,255,254,0.6)}
.bb-input input:focus{box-shadow:0 0 0 2px rgba(87,204,153,0.35)}
.bb-input button{border:none;background:linear-gradient(135deg,var(--bb-grad-1),var(--bb-grad-2));color:#fff;padding:10px 14px;border-radius:10px;cursor:pointer}

@media (max-width: 600px){
  .bb-panel{position:fixed;right:0;left:0;bottom:0;top:0;width:auto;max-height:none;border-radius:0;transform-origin:bottom center}
  .bb-messages::-webkit-scrollbar{width:6px}
}