/* Website chat window (opened from the support button). Uses the theme variables, so it follows the live theme. */
.chat{position:fixed;inset-block-end:92px;inset-inline-end:18px;width:min(380px,calc(100vw - 24px));height:min(560px,calc(100dvh - 120px));display:flex;flex-direction:column;z-index:80;overflow:hidden;padding:0}
.chat[hidden]{display:none}
.chat-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;border-bottom:1px solid var(--edge);background:var(--glass-hi)}
.chat-h b{display:block;font-size:16px}
.chat-h small{display:block;color:var(--ink2);font-size:12px;margin-top:2px}
.chat-x{width:34px;height:34px;border-radius:50%;border:1px solid var(--edge);background:transparent;color:var(--ink);font-size:22px;line-height:1;cursor:pointer}
.chat-log{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth}
.cm{max-width:86%;padding:9px 13px;border-radius:16px;font-size:14.5px;line-height:1.55;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:anywhere}
.cm small{display:block;font-size:11px;opacity:.65;margin-bottom:2px}
.cm.bot,.cm.staff{align-self:flex-start;background:var(--glass-hi);border:1px solid var(--edge);border-end-start-radius:4px}
.cm.staff{border-color:var(--accent)}
.cm.visitor{align-self:flex-end;background:var(--accent);color:#03212a;border-end-end-radius:4px}
.cm.note{align-self:center;background:transparent;color:var(--ink2);font-size:12.5px;padding:2px}
.chat-q{display:flex;gap:6px;flex-wrap:wrap;padding:0 14px 8px}
.chat-q button{border:1px solid var(--edge);background:var(--glass-hi);color:var(--ink);border-radius:999px;padding:6px 12px;font-size:13px;cursor:pointer}
.chat-q button:hover{border-color:var(--accent)}
.chat-f{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--edge);position:relative}
.chat-f .field{flex:1;min-width:0}
.chat-f .btn{flex:none}
.dots3 i{display:inline-block;width:6px;height:6px;margin:0 2px;border-radius:50%;background:var(--ink2);animation:cdot 1s infinite}
.dots3 i:nth-child(2){animation-delay:.15s}.dots3 i:nth-child(3){animation-delay:.3s}
@keyframes cdot{0%,80%,100%{opacity:.25}40%{opacity:1}}
@media (max-width:520px){.chat{inset-inline:8px;inset-block-end:84px;width:auto;height:min(78dvh,560px)}}
@media (prefers-reduced-motion:reduce){.chat-log{scroll-behavior:auto}.dots3 i{animation:none}}