#mj-chat-launcher {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 999998;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 13px 20px 13px 16px;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(135deg, #8a2424, #6d1717);
  color: #fff;
  font: 600 14px/1.2 -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  letter-spacing: .2px;
  cursor: pointer;
  box-shadow: 0 10px 30px rgba(109, 23, 23, .35), inset 0 1px 0 rgba(255, 255, 255, .18);
  transition: transform .18s ease, box-shadow .18s ease;
}
#mj-chat-launcher:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(109, 23, 23, .42); }
#mj-chat-launcher svg { width: 18px; height: 18px; }
#mj-chat-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #6ee7a8; box-shadow: 0 0 0 3px rgba(110, 231, 168, .22);
}

#mj-chat-panel {
  position: fixed;
  right: 24px;
  bottom: 88px;
  z-index: 999999;
  display: none;
  flex-direction: column;
  width: 380px;
  height: 560px;
  max-height: calc(100vh - 110px);
  background: #faf7f2;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 26px 70px rgba(30, 20, 10, .30), 0 0 0 1px rgba(0, 0, 0, .05);
  font: 14px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  color: #2b2622;
  opacity: 0;
  transform: translateY(12px) scale(.98);
  transition: opacity .2s ease, transform .2s ease;
}
#mj-chat-panel.mj-open { display: flex; opacity: 1; transform: none; }

.mj-chat-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  background: linear-gradient(135deg, #7a1f1f, #5c1414);
  color: #fff;
  flex: 0 0 auto;
}
.mj-chat-avatar {
  width: 34px; height: 34px; flex: 0 0 34px;
  border-radius: 10px;
  background: rgba(255, 255, 255, .13);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; font-weight: 700;
  border: 1px solid rgba(255, 255, 255, .22);
}
.mj-chat-head-text { flex: 1; min-width: 0; }
.mj-chat-head-text strong { display: block; font-size: 13.5px; letter-spacing: .3px; }
.mj-chat-head-text span { display: block; font-size: 10.5px; opacity: .78; margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mj-chat-close {
  border: 0; background: transparent; color: #fff; font-size: 20px;
  line-height: 1; cursor: pointer; padding: 2px 4px; opacity: .8;
}
.mj-chat-close:hover { opacity: 1; }

.mj-chat-offline {
  flex: 0 0 auto;
  margin: 10px 12px 0;
  padding: 10px 12px;
  background: #fff6e8;
  border: 1px solid #edd9b8;
  border-radius: 12px;
}
.mj-chat-offline strong { display: block; color: #7a1f1f; font-size: 12.5px; margin-bottom: 3px; }
.mj-chat-offline p { margin: 0 0 8px; color: #6b5f52; font-size: 11.5px; line-height: 1.5; }
.mj-chat-links { display: flex; gap: 7px; }
.mj-chat-links a {
  flex: 1;
  display: inline-flex; align-items: center; justify-content: center; gap: 4px;
  padding: 7px 8px;
  border-radius: 8px;
  font-size: 11.5px;
  font-weight: 600;
  text-decoration: none;
  background: #7a1f1f;
  color: #fff;
  border: 1px solid #7a1f1f;
}
.mj-chat-links a:last-child { background: #fff; color: #7a1f1f; border-color: #e0c9a6; }
.mj-chat-links a:hover { filter: brightness(1.06); }

.mj-chat-body {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 12px 14px 6px;
  background:
    radial-gradient(900px 260px at 100% 0%, #fbf6ee 0%, transparent 60%),
    #faf7f2;
  scroll-behavior: smooth;
  min-height: 0;
}
.mj-chat-day { text-align: center; font-size: 10.5px; color: #9a8f83; margin: 2px 0 10px; letter-spacing: .4px; }
.mj-chat-welcome {
  background: #fff; border: 1px solid #efe6d8; border-radius: 12px;
  padding: 9px 11px; color: #6b5f52; font-size: 12px; margin-bottom: 12px;
  box-shadow: 0 2px 8px rgba(120, 90, 50, .05);
}
.mj-chat-row { display: flex; align-items: flex-end; gap: 7px; margin-bottom: 9px; }
.mj-chat-row.visitor { flex-direction: row-reverse; }
.mj-chat-ava {
  width: 24px; height: 24px; flex: 0 0 24px; border-radius: 50%;
  background: #efe6d8; color: #7a1f1f; font-size: 10px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
.mj-chat-row.visitor .mj-chat-ava { background: #7a1f1f; color: #fff; }
.mj-chat-bubble {
  max-width: 78%;
  padding: 8px 11px;
  border-radius: 13px;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 13px;
  line-height: 1.5;
}
.mj-chat-row.admin .mj-chat-bubble {
  background: #fff; border: 1px solid #eee2d2; border-bottom-left-radius: 4px;
  box-shadow: 0 2px 6px rgba(120, 90, 50, .05);
}
.mj-chat-row.visitor .mj-chat-bubble {
  background: linear-gradient(135deg, #8a2424, #6d1717); color: #fff;
  border-bottom-right-radius: 4px;
}
.mj-chat-time { font-size: 10px; opacity: .55; margin-top: 3px; display: block; }

.mj-chat-chips {
  flex: 0 0 auto;
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding: 8px 12px 2px;
  background: #faf7f2;
  scrollbar-width: none;
}
.mj-chat-chips::-webkit-scrollbar { display: none; }
.mj-chat-chip {
  flex: 0 0 auto;
  border: 1px solid #e6d9c6; background: #fff; color: #6b4a2f;
  border-radius: 999px; padding: 6px 10px; font-size: 11px; cursor: pointer;
  white-space: nowrap;
}
.mj-chat-chip:hover { background: #fdf3e6; border-color: #d8b98e; }
#mj-chat-panel.mj-has-msg .mj-chat-chips { display: none; }

.mj-chat-foot { flex: 0 0 auto; border-top: 1px solid #f0e8dc; background: #fff; padding: 8px 10px 9px; }
.mj-chat-ident { display: flex; gap: 6px; margin-bottom: 6px; }
.mj-chat-ident input {
  flex: 1; min-width: 0; border: 1px solid #e8e0d4; border-radius: 8px;
  padding: 6px 8px; font-size: 11.5px; outline: none; background: #fcfaf7;
}
.mj-chat-ident input:focus { border-color: #c9a97d; background: #fff; }
.mj-chat-inputrow { display: flex; gap: 6px; align-items: flex-end; flex-wrap: nowrap; }
#mj-chat-file-btn, #mj-chat-mic-btn {
  flex: 0 0 34px; width: 34px; height: 34px;
  border: 1px solid #e8e0d4; border-radius: 9px; background: #fcfaf7;
  color: #7a1f1f; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
#mj-chat-file-btn:hover, #mj-chat-mic-btn:hover { background: #fdf3e6; border-color: #d8b98e; }
#mj-chat-file-btn svg, #mj-chat-mic-btn svg { width: 16px; height: 16px; }
#mj-chat-mic-btn.recording { background: #d63638; border-color: #d63638; color: #fff; animation: mj-pulse 1s infinite; }
@keyframes mj-pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(214,54,56,.45); } 50% { box-shadow: 0 0 0 8px rgba(214,54,56,0); } }
#mj-chat-input {
  flex: 1 1 auto; min-width: 0;
  resize: none; height: 38px; max-height: 92px;
  border: 1px solid #e8e0d4; border-radius: 10px; padding: 8px 10px;
  font: inherit; font-size: 12.5px; outline: none; background: #fcfaf7;
}
#mj-chat-input:focus { border-color: #c9a97d; background: #fff; }
#mj-chat-send {
  flex: 0 0 38px; width: 38px; height: 38px; border: 0; border-radius: 10px;
  background: linear-gradient(135deg, #8a2424, #6d1717); color: #fff;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 10px rgba(109, 23, 23, .25);
}
#mj-chat-send:disabled { opacity: .45; cursor: default; box-shadow: none; }
#mj-chat-send svg { width: 17px; height: 17px; }
.mj-chat-note { text-align: center; font-size: 9.5px; color: #a89a8a; margin-top: 5px; letter-spacing: .02em; }

.mj-chat-img { display: block; max-width: 100%; max-height: 200px; border-radius: 9px; cursor: zoom-in; }
.mj-chat-bubble:has(.mj-chat-img) { padding: 4px; background: #fff !important; border: 1px solid #eee2d2; }
.mj-chat-filebubble audio { width: 200px; max-width: 100%; display: block; }
.mj-chat-filebubble a { color: #7a1f1f; text-decoration: underline; word-break: break-all; }

@media (max-width: 520px) {
  #mj-chat-panel { right: 0; bottom: 0; width: 100%; height: 100dvh; max-height: 100dvh; border-radius: 0; }
  #mj-chat-launcher { right: 16px; bottom: 16px; }
}

/* chat control icons: force visible size */
#mj-chat-file-btn,#mj-chat-mic-btn,#mj-chat-send{line-height:0}
#mj-chat-file-btn svg,#mj-chat-mic-btn svg{width:17px !important;height:17px !important;flex:0 0 17px !important;display:block !important}
#mj-chat-send svg{width:18px !important;height:18px !important;flex:0 0 18px !important;display:block !important}
#mj-chat-input{height:40px;line-height:1.35;padding-top:9px}

.mj-chat-fallback{
  margin:12px 0 4px;
  padding:11px 12px;
  background:#fdf6ea;
  border:1px solid #ecdcbe;
  border-radius:12px;
}
.mj-chat-fallback p{margin:0 0 8px;color:#6b5a45;font-size:12px;line-height:1.5}

.mj-chat-auto{
  margin:8px auto 10px;
  max-width:88%;
  text-align:center;
  font-size:11px;
  line-height:1.5;
  color:#8a7b68;
  background:#f6efe3;
  border:1px dashed #e4d5bc;
  border-radius:10px;
  padding:7px 10px;
}