#didot-chat-btn {
  position: fixed; bottom: 28px; right: 28px;
  width: 56px; height: 56px;
  background: #BA0000; border-radius: 50%; border: none; cursor: pointer;
  box-shadow: 0 4px 16px rgba(186,0,0,0.35);
  display: flex; align-items: center; justify-content: center;
  z-index: 99999; transition: transform 0.2s, box-shadow 0.2s;
}
#didot-chat-btn:hover { transform: scale(1.08); box-shadow: 0 6px 20px rgba(186,0,0,0.45); }
#didot-chat-btn svg { width: 24px; height: 24px; fill: #fff; }
#didot-chat-btn .dc-close { display: none; }
#didot-chat-btn.open .dc-open { display: none; }
#didot-chat-btn.open .dc-close { display: block; }

#didot-chat-box {
  position: fixed; bottom: 96px; right: 28px;
  width: 340px; max-height: 510px;
  background: #fff; border-radius: 14px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.13);
  display: none; flex-direction: column;
  z-index: 99998; font-family: 'Bitter', Georgia, serif;
  overflow: hidden; border: 1px solid #e0e0e0;
}
#didot-chat-box.open { display: flex; }

#dc-header {
  background: #1A1A1A; padding: 13px 15px;
  display: flex; align-items: center; gap: 10px; flex-shrink: 0;
}
.dc-av {
  width: 36px; height: 36px; background: #BA0000; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Bitter', Georgia, serif;
  font-size: 11px; font-weight: 700; color: #fff; flex-shrink: 0;
}
.dc-hinfo { flex: 1; }
.dc-hname { font-family: 'Bitter', Georgia, serif; font-size: 13px; font-weight: 700; color: #fff; line-height: 1.2; }
.dc-hsub { font-family: 'Bitter', Georgia, serif; font-size: 10.5px; color: #999; display: flex; align-items: center; gap: 4px; margin-top: 2px; }
.dc-dot { width: 6px; height: 6px; border-radius: 50%; background: #4ADE80; display: inline-block; }
.dc-powered { font-family: 'Bitter', Georgia, serif; font-size: 9px; color: #555; }

#dc-messages {
  flex: 1; overflow-y: auto; padding: 13px 11px;
  display: flex; flex-direction: column; gap: 9px;
  background: #f7f7f7; min-height: 0;
}
#dc-messages::-webkit-scrollbar { width: 3px; }
#dc-messages::-webkit-scrollbar-thumb { background: #ddd; border-radius: 2px; }

.dc-msg { display: flex; gap: 6px; align-items: flex-end; max-width: 90%; }
.dc-msg.bot { align-self: flex-start; }
.dc-msg.user { align-self: flex-end; flex-direction: row-reverse; }
.dc-msg-av {
  width: 25px; height: 25px; border-radius: 50%; background: #BA0000;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Bitter', Georgia, serif; font-size: 8px; font-weight: 700; color: #fff; flex-shrink: 0;
}
.dc-bubble {
  padding: 9px 12px; border-radius: 13px;
  font-family: 'Bitter', Georgia, serif; font-size: 13px; line-height: 1.55; word-break: break-word;
}
.dc-msg.bot .dc-bubble { background: #fff; border: 1px solid #e5e5e5; color: #1a1a1a; border-bottom-left-radius: 3px; }
.dc-msg.user .dc-bubble { background: #BA0000; color: #fff; border-bottom-right-radius: 3px; }
.dc-bubble a { color: #BA0000; }
.dc-msg.user .dc-bubble a { color: #ffcccc; }
.dc-bubble strong { font-weight: 700; }

.dc-qr { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }
.dc-qr button {
  font-family: 'Bitter', Georgia, serif; font-size: 11px; padding: 4px 10px;
  border-radius: 20px; border: 1px solid #BA0000; background: transparent; color: #BA0000;
  cursor: pointer; transition: background 0.15s;
}
.dc-qr button:hover { background: #fff0f0; }

.dc-typing {
  display: flex; gap: 4px; align-items: center; padding: 10px 12px;
  background: #fff; border: 1px solid #e5e5e5;
  border-radius: 13px; border-bottom-left-radius: 3px; width: fit-content;
}
.dc-typing span { width: 5px; height: 5px; border-radius: 50%; background: #bbb; animation: dcbounce 1.2s infinite; }
.dc-typing span:nth-child(2) { animation-delay: 0.2s; }
.dc-typing span:nth-child(3) { animation-delay: 0.4s; }
@keyframes dcbounce { 0%,60%,100% { transform: translateY(0); } 30% { transform: translateY(-5px); } }

#dc-input-area {
  padding: 10px 11px; border-top: 1px solid #ebebeb;
  display: flex; gap: 7px; align-items: center; background: #fff; flex-shrink: 0;
}
#dc-input {
  flex: 1; border: 1px solid #e0e0e0; border-radius: 20px; padding: 8px 14px;
  font-family: 'Bitter', Georgia, serif; font-size: 12.5px; color: #1a1a1a;
  background: #f7f7f7; outline: none; transition: border-color 0.15s;
}
#dc-input:focus { border-color: #BA0000; background: #fff; }
#dc-send {
  width: 34px; height: 34px; border-radius: 50%; background: #BA0000; border: none;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; transition: opacity 0.15s;
}
#dc-send:hover { opacity: 0.85; }
#dc-send svg { width: 15px; height: 15px; fill: #fff; }

#dc-footer {
  padding: 5px 11px 7px; text-align: center;
  font-family: 'Bitter', Georgia, serif; font-size: 9.5px; color: #bbb;
  background: #fff; border-top: 1px solid #f0f0f0; flex-shrink: 0;
}