/* Demo-only additions on top of the product stylesheet (app.css). Same tokens as the product. */
.brand{text-decoration:none;color:inherit}
.header-actions a.icon-button{color:inherit;display:inline-flex;align-items:center;justify-content:center}
.sidebar-footer{font-size:11px;color:var(--muted);padding:12px 16px;text-align:center}
.chat-row .chat-select{width:100%}
.reply-stack{display:flex;flex-direction:column;align-items:stretch;gap:4px;max-width:min(85%,560px);min-width:220px}
.reply-stack .message-bubble{max-width:100%}
/* WhatsApp-style interactive buttons: each option is its own row under the message. */
.quick-reply{font:inherit;font-size:13px;font-weight:500;color:var(--action);background:var(--incoming);border:0;border-radius:8px;padding:10px 12px;text-align:center;cursor:pointer;box-shadow:0 1px 1px #0b141a1a}
.quick-reply:hover{background:#f5f7f6}
.quick-reply:focus-visible{outline:2px solid var(--action);outline-offset:2px}
.quick-reply:disabled{color:var(--disabled);cursor:default}
.gemini-mark{display:inline-flex;align-items:center;gap:3px;color:#6b5aa6}
.gemini-mark svg{width:11px;height:11px}
.message-line.error .message-bubble{background:#fdecea;color:#8a1c12}
.ai-typing{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
.ai-spark{position:relative;width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center}
.ai-spark svg{animation:tv-pulse 1.2s ease-in-out infinite}
.twinkle{position:absolute;width:4px;height:4px;border-radius:50%;background:#9b72cb;opacity:0;animation:tv-twinkle 1.5s ease-in-out infinite}
.twinkle.t1{top:-3px;right:-2px}.twinkle.t2{bottom:-2px;left:-3px;background:#4285f4;animation-delay:.5s}.twinkle.t3{top:2px;left:-6px;background:#d96570;animation-delay:1s}
.ai-dots{display:inline-flex;gap:4px}.ai-dots i{width:6px;height:6px;border-radius:50%;animation:tv-bounce 1s ease-in-out infinite}
.ai-dots i:nth-child(1){background:#4285f4}.ai-dots i:nth-child(2){background:#ea4335;animation-delay:.15s}.ai-dots i:nth-child(3){background:#fbbc04;animation-delay:.3s}
@keyframes tv-pulse{50%{transform:scale(.78) rotate(45deg)}}@keyframes tv-twinkle{50%{opacity:1;transform:scale(1.5)}}@keyframes tv-bounce{0%,80%,100%{transform:translateY(0);opacity:.55}40%{transform:translateY(-4px);opacity:1}}
@media(prefers-reduced-motion:reduce){.ai-spark svg,.twinkle,.ai-dots i{animation:none}.twinkle{opacity:.6}}
html,body{overflow-x:hidden}
@media(max-width:640px){.reply-stack{max-width:92%;min-width:0}}