#scm-chat-btn {
  position: fixed;
  left: 22px;
  bottom: 24px;
  z-index: 995;
  height: 52px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 17px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 999px;
  color: #f8fbff;
  background: rgba(10,23,40,.94);
  box-shadow: 0 16px 40px rgba(0,0,0,.3);
  backdrop-filter: blur(14px);
  cursor: pointer;
  font-family: "DM Sans", sans-serif;
  font-size: 11px;
  font-weight: 800;
  transition: transform .25s ease, border-color .25s ease;
}
#scm-chat-btn:hover { transform: translateY(-4px); border-color: rgba(36,216,232,.5); }
#scm-chat-btn > i { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 9px; color: #04101a; background: #24d8e8; font-size: 13px; }
#scm-chat-box {
  position: fixed;
  left: 22px;
  bottom: 87px;
  z-index: 996;
  width: min(355px, calc(100vw - 28px));
  max-height: min(545px, calc(100vh - 120px));
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 22px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(14px) scale(.98);
  color: #182236;
  background: #f5f7fb;
  box-shadow: 0 30px 80px rgba(0,0,0,.42);
  overflow: hidden;
  transform-origin: bottom left;
  transition: opacity .25s ease, visibility .25s ease, transform .25s ease;
  font-family: "DM Sans", sans-serif;
}
#scm-chat-box.open { opacity: 1; visibility: visible; transform: none; }
.scm-header { display: flex; align-items: center; gap: 11px; padding: 16px; color: #f8fbff; background: linear-gradient(135deg, #07111f, #102a48); }
.scm-avatar { width: 39px; height: 39px; display: grid; place-items: center; flex: none; border-radius: 12px; color: #04101a; background: linear-gradient(135deg, #24d8e8, #58edbd); }
.scm-header > div:nth-child(2) { display: flex; flex: 1; flex-direction: column; }
.scm-header strong { font-size: 13px; }
.scm-header small { color: #9eacbe; font-size: 9px; }
.scm-header small i { width: 6px; height: 6px; display: inline-block; margin-right: 5px; border-radius: 50%; background: #51e89b; }
#scm-chat-close { width: 34px; height: 34px; display: grid; place-items: center; border: 0; border-radius: 10px; color: #bdc8d6; background: rgba(255,255,255,.06); cursor: pointer; }
.scm-body { min-height: 315px; padding: 18px; overflow-y: auto; background: #eef2f7; }
.scm-msg { width: fit-content; max-width: 86%; margin-bottom: 10px; padding: 11px 13px; border-radius: 14px; font-size: 11px; line-height: 1.55; }
.scm-bot { border-radius: 4px 14px 14px 14px; background: #fff; box-shadow: 0 4px 12px rgba(29,50,78,.06); }
.scm-user { margin-left: auto; border-radius: 14px 4px 14px 14px; color: #fff; background: #176fe9; }
.scm-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 13px; }
.scm-actions button { padding: 7px 10px; border: 1px solid #cbd7e7; border-radius: 999px; color: #185cae; background: #fff; cursor: pointer; font-size: 9px; font-weight: 800; }
.scm-actions button:hover { border-color: #2f7cff; }
.scm-input { min-height: 58px; display: flex; border-top: 1px solid #dfe5ee; background: #fff; }
.scm-input input { min-width: 0; flex: 1; padding: 0 15px; border: 0; outline: 0; color: #1a2637; background: transparent; font-size: 11px; }
.scm-input button { width: 48px; margin: 9px; border: 0; border-radius: 10px; color: #fff; background: #176fe9; cursor: pointer; }
@media (max-width: 560px) {
  #scm-chat-btn { left: 14px; bottom: 14px; width: 52px; padding: 0; justify-content: center; }
  #scm-chat-btn span { display: none; }
  #scm-chat-btn > i { width: 30px; height: 30px; }
  #scm-chat-box { left: 14px; bottom: 78px; }
}
@media (prefers-reduced-motion: reduce) {
  #scm-chat-btn, #scm-chat-box { transition: none; }
}