body.webchat { margin:0; background:#f7f6fa; color:#252132; font-family:system-ui,sans-serif; }
.webchat .fa-solid,.webchat .fa-regular { --fa-family:"Font Awesome 7 Sharp"; --fa-style:300; font-family:"Font Awesome 7 Sharp"; font-weight:300; }
.webchat-header { display:flex; align-items:center; justify-content:space-between; gap:1rem; background:#171421; color:white; padding:calc(.8rem + env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) .8rem max(1rem,env(safe-area-inset-left)); }
.webchat-brand { color:white; font-size:1.5rem; font-weight:700; text-decoration:none; white-space:nowrap; }.webchat-brand span { color:#dc9cdd; }
.webchat-tools { display:flex; gap:.6rem; align-items:center; flex-wrap:wrap; }.webchat-tools form { margin:0; }
.webchat-tools button,.webchat-tools a { background:transparent; border:1px solid #777080; color:white; padding:.55rem .75rem; border-radius:.6rem; font:inherit; text-decoration:none; font-size:.85rem; }
.webchat-tools button,.webchat-tools a { display:inline-grid; place-items:center; width:44px; height:44px; padding:0; font-size:1rem; }
.webchat-tools [hidden] { display:none; }
.install-help { padding:.65rem 1rem; background:#eee9f8; font-size:.85rem; }.install-help p { max-width:55rem; margin:.8rem 0; }@media(display-mode:standalone) { .install-help { display:none; } }
#app-status { padding:.8rem 1rem; background:#f3e6fa; margin:0; }
.webchat .members-chat-page { max-width:none; margin:0; padding:1rem; }.webchat .members-chat-heading { display:none; }.webchat .chat-shell { height:calc(100dvh - 140px); min-height:25rem; }.webchat .chat-room { min-height:0; }.webchat .chat-messages { min-height:0; overflow:auto; }.webchat .chat-room__welcome { min-height:0; }
.webchat-login { max-width:28rem; margin:3rem auto; padding:1.5rem; }.webchat-login h1 { font-family:inherit; font-size:2rem; text-transform:none; }.webchat-login form { display:grid; gap:.65rem; margin:1.5rem 0; }.webchat-login input { padding:.8rem; border:1px solid #bdb5cb; border-radius:.5rem; }.webchat-login button { background:#6552bd; color:white; border:0; padding:.9rem; border-radius:.5rem; }
.webchat button:focus-visible,.webchat a:focus-visible { outline:3px solid #b7a1ff; outline-offset:2px; }
/* The website uses an avatar-only sidebar on phones; this app has a full list screen. */
@media(max-width:760px) {
    .webchat .chat-conversation { grid-template-columns:auto minmax(0,1fr) auto; justify-items:stretch; padding:.85rem 1rem; }
    .webchat .chat-conversation__copy, .webchat .chat-unread { display:grid; }
}
@media(max-width:760px) { .webchat-header { align-items:flex-start; }.webchat-tools { justify-content:flex-end; }.webchat-brand { font-size:1.1rem; }.webchat .members-chat-page { padding:.5rem; }.webchat .chat-shell { display:block; height:auto; min-height:0; }.webchat.has-conversation .chat-sidebar { display:none; }.webchat:not(.has-conversation) .chat-room { display:none; }.webchat .chat-room { height:calc(100dvh - 180px); min-height:20rem; }.webchat .chat-sidebar { max-height:none; }.webchat .chat-composer { padding-bottom:max(.75rem,env(safe-area-inset-bottom)); } }