#hthchat-root{position:fixed;right:18px;bottom:18px;z-index:99990;font-family:inherit}
#hthchat-bubble{position:relative;width:56px;height:56px;border-radius:50%;border:0;background:#FFC531;box-shadow:0 8px 24px rgba(0,0,0,.45);cursor:pointer;display:flex;align-items:center;justify-content:center}
#hthchat-bubble:hover{background:#FAC12C}
#hthchat-badge{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;border-radius:10px;background:#E62117;color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 5px}
#hthchat-panel{position:fixed;right:12px;bottom:84px;width:min(360px,calc(100vw - 24px));height:480px;max-height:calc(100dvh - 110px);background:#1E1E28;border:1px solid rgba(255,255,255,.08);border-radius:16px;box-shadow:0 18px 50px rgba(0,0,0,.55);display:flex;flex-direction:column;overflow:hidden;color:#EDEDF2;z-index:99991;box-sizing:border-box}
#hthchat-panel[hidden]{display:none}
#hthchat-ident[hidden]{display:none}
#hthchat-panel *{box-sizing:border-box}
.hthchat-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;background:#131317;padding:14px 16px;border-bottom:2px solid #FFC531}
.hthchat-head strong{display:block;font-size:15px;line-height:1.3}
.hthchat-head span{display:block;font-size:12px;color:#9A9AA6;margin-top:2px}
#hthchat-close{background:none;border:0;color:#EDEDF2;font-size:26px;line-height:1;cursor:pointer;padding:0 2px}
#hthchat-ident{padding:18px 16px;display:flex;flex-direction:column;gap:10px}
#hthchat-ident p{margin:0;font-size:14px;line-height:1.5}
#hthchat-ident input{background:#131317;border:1px solid rgba(255,255,255,.14);border-radius:10px;color:#EDEDF2;padding:11px 12px;font-size:16px;width:100%;box-sizing:border-box}
#hthchat-start{background:#FFC531;color:#131317;border:0;border-radius:10px;padding:12px;font-size:14px;font-weight:700;cursor:pointer}
.hthchat-ident-err{color:#ff8a80;font-size:13px;min-height:0}
#hthchat-main{display:flex;flex-direction:column;flex:1;min-height:0}
#hthchat-main[hidden]{display:none}
#hthchat-msgs{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:8px}
.hthchat-msg{max-width:82%;padding:9px 12px;border-radius:14px;font-size:14px;line-height:1.5;white-space:pre-wrap;word-break:break-word}
.hthchat-msg small{display:block;font-size:11px;opacity:.55;margin-top:4px}
.hthchat-msg.visitor{align-self:flex-end;background:#FFC531;color:#131317;border-bottom-right-radius:4px}
.hthchat-msg.agent,.hthchat-msg.admin{align-self:flex-start;background:#2A2A38;color:#EDEDF2;border-bottom-left-radius:4px}
.hthchat-msg.system{align-self:center;background:transparent;border:1px dashed rgba(255,255,255,.25);color:#C9C9D4;font-size:13px;text-align:center;max-width:92%}
.hthchat-typing{display:flex;gap:4px;align-items:center;padding:13px 14px}
.hthchat-typing[hidden]{display:none}
.hthchat-typing i{width:7px;height:7px;border-radius:50%;background:#C9C9D4;display:block;animation:hthchat-bounce 1.2s infinite}
.hthchat-typing i:nth-child(2){animation-delay:.15s}
.hthchat-typing i:nth-child(3){animation-delay:.3s}
@keyframes hthchat-bounce{0%,60%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-5px);opacity:1}}
#hthchat-form{display:flex;gap:8px;padding:10px;border-top:1px solid rgba(255,255,255,.08);background:#131317}
#hthchat-input{flex:1;background:#1E1E28;border:1px solid rgba(255,255,255,.14);border-radius:999px;color:#EDEDF2;padding:10px 14px;font-size:16px;min-width:0}
#hthchat-form button{width:42px;height:42px;border-radius:50%;border:0;background:#FFC531;cursor:pointer;display:flex;align-items:center;justify-content:center;flex:none}
