:root{
  --accent:#6d4bf4;
  --accent-dark:#5b3ee6;
  --bg:#ffffff;
  --soft:#f6f7fb;
  --bot:#eef2ff;
  --border:#e5e7eb;
  --text:#111827;
  --muted:#6b7280;
  --shadow:0 20px 45px rgba(0,0,0,.18);
  --font:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}

/* ---------- Launcher ---------- */
.cb-launcher{
  position:fixed;
  bottom:22px;
  right:22px;
  width:58px;height:58px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--accent),var(--accent-dark));
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  box-shadow:0 12px 30px rgba(0,0,0,.35);
  z-index:999999;
}
.cb-launcher svg{width:22px;height:22px;stroke:#fff;fill:none;stroke-width:2}

/* ---------- Wrapper ---------- */
.cb-wrapper{
  position:fixed;
  bottom:96px;right:22px;
  width:380px;height:620px;
  display:none;z-index:999998;
}
.cb-card{
  height:100%;
  background:var(--bg);
  border-radius:32px;
  box-shadow:var(--shadow);
  display:flex;flex-direction:column;
  overflow:hidden;font-family:var(--font);
}

/* ---------- Header ---------- */
.cb-header{
  padding:16px 18px;
  display:flex;justify-content:space-between;align-items:center;
}
.cb-header-left{
  display:flex;align-items:center;gap:10px;font-weight:600;
}
.cb-ai-icon{
  width:26px;height:26px;border-radius:50%;
  background:#ede9fe;display:flex;align-items:center;justify-content:center;
}
.cb-ai-icon svg{width:16px;height:16px;stroke:var(--accent);fill:none;stroke-width:2}
.cb-plan{font-size:12px;color:var(--muted)}

/* ---------- Body ---------- */
.cb-body{
  flex:1;background:var(--soft);
  padding:16px;overflow:hidden;
}
.cb-messages{
  height:100%;overflow-y:auto;
  display:flex;flex-direction:column;gap:14px;
}

/* ---------- Intro ---------- */
.cb-intro{text-align:center;margin-top:60px}
.cb-intro h2{font-size:20px;font-weight:600;margin-bottom:6px}
.cb-intro p{font-size:14px;color:var(--muted)}

.cb-orb{
  width:72px;height:72px;margin:24px auto 0;
  border-radius:50%;
  background:radial-gradient(circle at 30% 30%, #c4b5fd, var(--accent));
  animation:pulse 1.6s infinite;
}
@keyframes pulse{
  0%{transform:scale(1);opacity:.6}
  50%{transform:scale(1.3);opacity:1}
  100%{transform:scale(1);opacity:.6}
}

/* ---------- Messages ---------- */
.cb-msg{
  max-width:85%;
  padding:14px 18px;border-radius:18px;
  font-size:14px;line-height:1.5;
  position:relative;
}
.cb-msg-user{
  background:linear-gradient(135deg,var(--accent),var(--accent-dark));
  color:#fff;margin-left:auto;
}
.cb-msg-bot{
  background:var(--bot);color:var(--text);margin-right:auto;
}

/* Edit icon */
.cb-edit-btn{
  position:absolute;
  right:-22px;top:50%;
  transform:translateY(-50%);
  opacity:0;cursor:pointer;
}
.cb-msg-user:hover .cb-edit-btn{opacity:1}
.cb-edit-btn svg{
  width:16px;height:16px;
  stroke:#fff;fill:none;stroke-width:2;
}

/* Typing cursor */
.cb-cursor{
  display:inline-block;
  margin-left:2px;
  animation:blink 1s steps(1) infinite;
}
@keyframes blink{50%{opacity:0}}

/* ---------- File card ---------- */
.cb-file{
  background:var(--bot);
  padding:12px;border-radius:14px;
  font-size:13px;
}
.cb-file small{color:var(--muted)}

/* ---------- Follow-ups ---------- */
.cb-followups{display:flex;gap:8px;flex-wrap:wrap}
.cb-followups button{
  border:1px solid var(--border);
  background:transparent;border-radius:999px;
  padding:6px 12px;font-size:12px;cursor:pointer;
}

/* ---------- Footer ---------- */
.cb-footer{border-top:1px solid var(--border);padding:10px}
.cb-context{
  font-size:12px;color:var(--muted);
  text-align:center;margin-bottom:6px;
}
.cb-input-shell{
  display:flex;gap:8px;align-items:center;
  border:1px solid var(--border);
  border-radius:999px;padding:8px;
}
.cb-input-shell button{
  width:34px;height:34px;
  border:none;background:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
}
.cb-input-shell button svg{
  width:18px;height:18px;
  stroke:var(--text);fill:none;stroke-width:2;
}
#cb-input{flex:1;border:none;outline:none;background:none}

.cb-send-btn{
  background:linear-gradient(135deg,var(--accent),var(--accent-dark));
  border-radius:50%;
}
.cb-send-btn svg{stroke:#fff}

/* Emoji */
.cb-emoji{display:none;gap:6px;padding:8px}
.cb-emoji span{cursor:pointer;font-size:18px}

/* Voice active */
.cb-mic-active svg{
  stroke:var(--accent);
  animation:pulse 1.2s infinite;
}

/* Voice preview */
.cb-voice-preview{
  font-style:italic;
  color:var(--muted);
}