/* One travelling Chat. His chest dots share the message indicator's rhythm. */
.chat-mascot{display:inline-block;position:relative;aspect-ratio:1;width:100%;flex:none;vertical-align:middle}
.chat-mascot>img{display:block;width:100%;height:100%;object-fit:contain}
.chat-dots{position:absolute;left:42.5%;top:60.5%;width:18%;display:flex;gap:20%;align-items:center;transform:rotate(-8deg);pointer-events:none}
.chat-dots i{flex:1;min-width:0;aspect-ratio:1;border-radius:50%;background:#8e8e93;opacity:.7;transform:translateY(0)}
.chat-is-thinking .chat-dots i,.chat-help-thinking .chat-dots i{animation:chat-thinking 1050ms ease-in-out infinite}
.chat-dots i:nth-child(2){animation-delay:140ms}
.chat-dots i:nth-child(3){animation-delay:280ms}
.typing-indicator i{animation-name:chat-thinking;animation-duration:1050ms}
.typing-indicator i:nth-child(2){animation-delay:140ms}
.typing-indicator i:nth-child(3){animation-delay:280ms}
@keyframes chat-thinking{0%,60%,100%{transform:translateY(0);opacity:.45}30%{transform:translateY(-50%);opacity:1}44%{transform:translateY(0);opacity:.75}52%{transform:translateY(-12%);opacity:.6}}
.chat-guide{position:fixed;right:24px;bottom:25px;z-index:70;width:112px;isolation:isolate}
.chat-guide.is-guided{left:0;top:0;right:auto;bottom:auto;will-change:transform}
.chat-guide-toggle{display:block;position:relative;width:112px;height:118px;outline-offset:5px;border-radius:18px;transition:scale 160ms ease-out}
.chat-guide-toggle:active{scale:.97}
.chat-guide-toggle>.chat-mascot{width:112px;position:absolute;left:0;top:0;filter:drop-shadow(0 6px 10px #00000014)}
.chat-guide-label{position:absolute;bottom:0;left:50%;transform:translateX(-50%);border-radius:30px;background:#fffffff5;padding:5px 12px;font-size:11px;font-weight:500;letter-spacing:0;box-shadow:0 2px 12px #00000012;border:1px solid #e9ecf2;color:#4e5663;white-space:nowrap}
.chat-thinking-label{display:none}
.chat-is-thinking .chat-idle-label,.chat-help-thinking .chat-idle-label{display:none}
.chat-is-thinking .chat-thinking-label,.chat-help-thinking .chat-thinking-label{display:inline}
.chat-guide-prompt{position:absolute;right:calc(100% + 10px);top:18px;width:193px;padding:13px 16px;border:1px solid #e8edf4;border-radius:18px 18px 5px 18px;background:#ffffffed;backdrop-filter:blur(14px);text-align:left;color:#1d1d1f;box-shadow:0 7px 26px #1028550c;opacity:0;visibility:hidden;transform:translateX(6px);transition:opacity 200ms ease-out,transform 250ms cubic-bezier(.16,1,.3,1),visibility 200ms;pointer-events:none}
.chat-guide-prompt strong{display:block;font-size:13px;font-weight:500;letter-spacing:-.2px;margin-bottom:4px}
.chat-guide-prompt span{display:block;font-size:11px;line-height:1.5;color:#7b808b}
.chat-guide.show-prompt .chat-guide-prompt,.chat-guide:focus-within .chat-guide-prompt{opacity:1;visibility:visible;transform:none;pointer-events:auto}
.chat-help{position:fixed;inset:auto 24px 30px auto;margin:0;border:1px solid #e4e8f0;border-radius:26px;width:370px;max-width:calc(100vw - 28px);max-height:calc(100dvh - 108px);overflow:auto;padding:24px;box-shadow:0 24px 90px #142c4e26;background:#fff;color:#242424;scrollbar-width:thin}
.chat-help::backdrop{background:#14203720;backdrop-filter:blur(5px)}
.chat-help[open]{animation:chat-panel-in 220ms cubic-bezier(.16,1,.3,1)}
.chat-help header{display:flex;justify-content:space-between;align-items:center}
.chat-help-eyebrow{font-size:10px;font-weight:500;letter-spacing:1.2px;color:#9a9da4}
.close-chat-help{width:28px;height:28px;border-radius:50%;background:#f1f2f5;color:#858b94;font-size:18px;line-height:1}
.chat-welcome{display:flex;align-items:center;gap:13px;margin:14px 0 12px}
.chat-welcome>.chat-mascot{width:112px;margin-left:-8px}
.chat-welcome h2,.demo-dialog .chat-welcome h2{font-size:25px;line-height:1.1;margin:0 0 9px;letter-spacing:-.9px;font-weight:400}
.chat-welcome p,.demo-dialog .chat-welcome p{font-size:13px;color:#8b8b91;line-height:1.5}
.chat-help-answer{background:#f5f7fa;border:1px solid #edf0f5;border-radius:18px;padding:17px;margin:8px 0 21px}
.chat-help-answer strong{display:block;font-size:14px;font-weight:500;letter-spacing:-.2px}
.chat-help-answer p{font-size:12px;line-height:1.65;color:#727986;margin-top:8px}
.chat-help-answer.answer-arriving{animation:chat-answer-in 220ms cubic-bezier(.16,1,.3,1)}
.chat-help-question{font-size:11px;color:#999fa9;margin-bottom:10px}
.chat-help-topics{display:flex;flex-wrap:wrap;gap:7px}
.chat-help-topics button{border:1px solid #e4e9f0;background:white;border-radius:25px;padding:8px 11px;font-size:11px;color:#657084;transition:background 150ms,color 150ms,border-color 150ms}
.chat-help-topics button[aria-pressed=true]{background:#edf5ff;color:#0071e3;border-color:#c7e1ff}
.chat-help-demo{margin-top:21px;width:100%;padding:12px 18px;font-size:12px}
.chat-help-note{display:block;text-align:center;font-size:9px;color:#a5abb5;margin-top:12px}
@keyframes chat-panel-in{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
@keyframes chat-answer-in{from{opacity:.35;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(hover:hover) and (pointer:fine){.chat-guide:hover .chat-guide-prompt{opacity:1;visibility:visible;transform:none;pointer-events:auto}.chat-help-topics button:hover{background:#f5f8fc;color:#0071e3}}
@media(max-width:900px){.chat-guide,.chat-guide-toggle{width:76px}.chat-guide-toggle{height:86px}.chat-guide-toggle>.chat-mascot{width:76px}.chat-guide-label{font-size:10px;padding:4px 10px}.chat-guide-prompt{width:172px;right:calc(100% + 6px);top:5px}}
@media(max-width:700px){.chat-guide-prompt{display:none}.chat-help{inset:auto 14px max(16px,env(safe-area-inset-bottom)) 14px;width:auto;padding:22px;max-height:calc(100dvh - 96px)}.chat-welcome>.chat-mascot{width:100px}.chat-welcome h2,.demo-dialog .chat-welcome h2{font-size:23px}}
@media(prefers-reduced-motion:reduce){.chat-is-thinking .chat-dots i,.chat-help-thinking .chat-dots i{animation:none;transform:none;opacity:.8}.chat-guide-prompt,.chat-guide-toggle{transition:none}.chat-help[open],.chat-help-answer.answer-arriving{animation:none}}
