:root {
  --primary: #1a3d8f;
  --secondary: #cddfff;
  --bg: #f6f8fb;
  --surface: #ffffff;
  --surface-dark: #24324f;
  --text: #1f2937;
  --text-light: #ffffff;
  --text-muted: rgba(31,41,55,.68);
  --border: #dbe3ef;
  --shadow: 0 24px 60px rgba(17,24,39,.18);
}

#ssc-chatbot-root * { box-sizing: border-box; font-family: Inter, system-ui, sans-serif; }
#ssc-chatbot-root { position: fixed; inset: 0; pointer-events: none; z-index: 999999; }
.ssc-chatbot-toggle { position: fixed; right: 24px; bottom: 24px; width:64px; height:64px; border:0; border-radius:999px; background:linear-gradient(135deg, var(--primary), #365fc4); color:#fff; box-shadow:var(--shadow); cursor:pointer; display:flex; align-items:center; justify-content:center; pointer-events:auto; transition:transform .25s ease; animation:sscPulse 2.8s infinite; }
.ssc-chatbot-toggle:hover { transform: translateY(-2px) scale(1.03); }
.ssc-chatbot-badge { position:absolute; top:-6px; right:-6px; min-width:22px; height:22px; border-radius:999px; background:#ef4444; color:#fff; font-size:12px; display:none; align-items:center; justify-content:center; padding:0 6px; }
.ssc-chatbot-window { position:fixed; right:24px; bottom:100px; width:380px; height:520px; background:var(--surface); border-radius:20px; box-shadow:var(--shadow); overflow:hidden; transform:scale(.92); opacity:0; pointer-events:none; transition:all .22s ease; display:flex; flex-direction:column; border:1px solid rgba(0,0,0,.06); }
.ssc-chatbot-window.open { transform:scale(1); opacity:1; pointer-events:auto; }
.ssc-chatbot-header { background:linear-gradient(135deg, var(--primary), #365fc4); color:#fff; padding:16px; display:flex; align-items:center; justify-content:space-between; }
.ssc-chatbot-brand { display:flex; align-items:center; gap:12px; }
.ssc-chatbot-avatar { width:42px; height:42px; border-radius:999px; background:rgba(255,255,255,.18); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.ssc-chatbot-avatar img { width:100%; height:100%; object-fit:cover; }
.ssc-chatbot-status { font-size:12px; opacity:.92; display:flex; align-items:center; gap:6px; }
.ssc-chatbot-status::before { content:''; width:8px; height:8px; border-radius:50%; background:#82f288; display:inline-block; }
.ssc-chatbot-close { border:0; background:transparent; color:#fff; font-size:20px; cursor:pointer; }
.ssc-chatbot-messages { flex:1; overflow:auto; padding:18px 16px; background:var(--bg); display:flex; flex-direction:column; gap:12px; }
.ssc-msg { max-width:85%; padding:12px 14px; border-radius:18px; line-height:1.55; font-size:14px; animation:sscMessageIn .2s ease; }
.ssc-msg.bot { align-self:flex-start; background:var(--surface-dark); color:var(--text-light); border-bottom-left-radius:6px; }
.ssc-msg.user { align-self:flex-end; background:linear-gradient(135deg, var(--primary), #365fc4); color:#fff; border-bottom-right-radius:6px; }
.ssc-msg a { color:inherit; text-decoration:underline; }
.ssc-quick-wrap { display:flex; flex-wrap:wrap; gap:8px; padding:0 16px 10px; background:var(--bg); }
.ssc-quick-btn { border:1px solid var(--border); background:#fff; color:var(--text); padding:8px 12px; border-radius:999px; font-size:12px; cursor:pointer; transition:all .2s ease; }
.ssc-quick-btn:hover { border-color:var(--primary); background:#eef4ff; }
.ssc-chatbot-input { padding:14px; border-top:1px solid var(--border); background:#fff; display:flex; gap:10px; align-items:flex-end; }
.ssc-chatbot-textarea { flex:1; resize:none; max-height:120px; min-height:44px; border:1px solid var(--border); border-radius:14px; padding:12px 14px; outline:none; font-size:14px; }
.ssc-chatbot-send { border:0; background:linear-gradient(135deg, var(--primary), #365fc4); color:#fff; width:46px; height:46px; border-radius:14px; cursor:pointer; }
.ssc-typing { display:flex; gap:6px; align-items:center; }
.ssc-typing span { width:7px; height:7px; border-radius:999px; background:#fff; opacity:.4; animation:sscTyping 1.2s infinite; }
.ssc-typing span:nth-child(2){ animation-delay:.2s } .ssc-typing span:nth-child(3){ animation-delay:.4s }
@keyframes sscPulse { 0%,100%{ box-shadow:0 20px 50px rgba(17,24,39,.18)} 50%{ box-shadow:0 20px 50px rgba(54,95,196,.35)} }
@keyframes sscTyping { 0%,80%,100%{ transform:translateY(0); opacity:.35 } 40%{ transform:translateY(-3px); opacity:1 } }
@keyframes sscMessageIn { from { opacity:0; transform:translateY(8px) } to { opacity:1; transform:translateY(0) } }
@media (max-width: 640px) { .ssc-chatbot-toggle { right:16px; bottom:16px; } .ssc-chatbot-window { right:0; bottom:0; width:100vw; height:100vh; border-radius:0; } }