.chat-main{padding-top:clamp(24px,4vw,48px);padding-bottom:40px;max-width:1180px}.chat-intro{max-width:760px;margin-bottom:24px}.chat-intro h1{font-size:clamp(28px,4vw,44px);margin:8px 0 14px}.chat-intro p{line-height:1.6}.chat-entry{border:1px solid var(--line);border-radius:16px;background:var(--surface);padding:clamp(20px,3vw,32px);max-width:800px}.chat-entry h2{font-size:22px;margin:0 0 12px}.chat-entry p{line-height:1.6}#join-form{display:flex;align-items:center;gap:20px;margin:24px 0}.nick-field{display:flex;flex-direction:column;gap:8px;flex:1}.nick-field label{font-weight:600}.nick-field input{font:inherit;padding:12px 14px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink);width:100%}.nick-field small,.chat-privacy,.chat-client,.chat-credit{color:var(--muted);font-size:14px}.chat-main :is(#join,#cancel-join){font:inherit;font-weight:600;padding:12px 18px;border-radius:8px;border:1px solid var(--line);background:var(--wash);color:var(--ink);cursor:pointer}.chat-main :is(#join,#cancel-join).chat-primary{background:var(--accent);color:var(--accent-ink)}.chat-main :is(#join,#cancel-join):disabled{opacity:.55;cursor:default}.chat-main :focus-visible{outline:3px solid var(--accent);outline-offset:3px}.chat-main a{text-decoration:underline;text-underline-offset:3px}.chat-main [hidden]{display:none!important}.chat-status{padding:16px;border:1px solid var(--line);border-radius:10px;margin:16px 0;background:var(--surface)}.chat-status[data-error=true]{border-color:#c97565}.chat-panel{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--surface)}.chat-client{margin-top:24px}.chat-credit{font-size:12px;margin-top:24px}
#chat-host{height:clamp(420px,67dvh,780px);min-height:420px}.conversejs.converse-embedded{display:block;width:100%;height:100%;--fullpage-chat-height:100%;--normal-font:Inter,'Segoe UI',Arial,sans-serif;--heading-font:Inter,'Segoe UI',Arial,sans-serif;--font-size:15px;--message-font-size:15px;--background-color:var(--surface);--foreground-color:var(--ink);--text-color:var(--ink);--primary-color:var(--accent);--primary-color-dark:var(--accent);--primary-color-light:var(--wash);--secondary-color:var(--wash);--secondary-color-light:var(--wash);--secondary-color-dark:var(--line);--message-text-color:var(--ink);--chatroom-message-input-color:var(--ink);--chat-content-background-color:var(--surface);--chatroom-head-bg-color:var(--wash);--chatroom-head-fg-color:var(--ink);--chat-head-bg-color:var(--wash);--chat-head-fg-color:var(--ink);--chatroom-occupants-bg-color:var(--bg);--chatroom-occupants-fg-color:var(--ink);--chatroom-occupants-heading-color:var(--ink);--chatroom-occupants-border-color:var(--line);--chatroom-occupants-status-color:var(--muted);--chatroom-occupants-hover-color:var(--wash);--chatroom-occupants-padding:1rem;--chat-textarea-color:var(--ink);--chat-textarea-background-color:var(--bg);--chat-textarea-border-color:var(--line);--chat-toolbar-btn-color:var(--muted);--chatbox-border-color:var(--line);--heading-color:var(--ink);--link-color:var(--accent);--link-hover-color:var(--ink);--chat-info-color:var(--muted);--separator-text-color:var(--muted);--global-background-color:var(--surface);--controlbox-text-color:var(--ink);--controlbox-pane-bg-color:var(--surface);--modal-background-color:var(--surface);--modal-color:var(--ink);--input-text-color:var(--ink);--input-background-color:var(--bg);--input-border-color:var(--line);--chat-msg-author-color:var(--ink);--chat-msg-author-me-color:var(--accent);--chatroom-head-border-bottom:1px solid var(--line)}
#chat-host .conversejs .chatbox{margin:0!important;border:0!important;border-radius:0!important}#chat-host .conversejs .chat-body{background:var(--surface)}#chat-host .conversejs .chatroom .box-flyout{height:100%;border:0}#chat-host .conversejs .chat-message__text{color:var(--ink)}#chat-host .conversejs .chatroom .chat-area{min-width:0}#chat-host .conversejs .chat-textarea{background:var(--bg);color:var(--ink)}#chat-host .conversejs .dropdown-menu{background:var(--surface);color:var(--ink);border-color:var(--line)}#chat-host .conversejs .dropdown-item{color:var(--ink)}#chat-host .conversejs .dropdown-item:hover{background:var(--wash)}#chat-host .conversejs .chatroom-form-container{border-top:1px solid var(--line)}
@media(max-width:640px){.chat-main{padding-top:22px}.chat-intro h1{font-size:28px}.chat-entry{padding:20px}#join-form{align-items:stretch;flex-direction:column}.chat-intro{margin-bottom:18px}#chat-host{height:65dvh;min-height:400px}#chat-host .conversejs .occupants{max-width:45%}}
/* Map the documented Converse theme variables to the website palette. */
#chat-host .conversejs{--muc-header-bg-color:var(--wash);--muc-header-fg-color:var(--ink);--muc-color:var(--accent);--muc-color-hover:var(--ink);--chat-header-bg-color:var(--wash);--chat-header-fg-color:var(--ink);--primary-color:var(--accent)!important;--secondary-color:var(--muted)!important;--primary-color-hover:var(--ink);--subdued-color:var(--muted);--info-color:var(--muted);--highlight-color:var(--wash);--highlight-color-hover:var(--wash);--focus-color:var(--accent);--link-color-hover:var(--ink);--font-size-small:14px;--font-size-tiny:12px;--muc-rgb:188,216,195;--primary-rgb:188,216,195}
#chat-host .conversejs .chatroom .occupants{border-color:var(--line)}#chat-host .conversejs .chatroom .chat-area{border-color:var(--line)}#chat-host .conversejs .chatroom-form-container{border-color:var(--line)}

.chat-panel{position:relative}.chat-panel.is-loading #chat-host{visibility:hidden}
.chat-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;padding:24px;text-align:center;background:var(--surface);z-index:1}
#chat-host .dinox-guest-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-top:1px solid var(--line);background:var(--surface)}
#chat-host .dinox-guest-bottom p{margin:0;color:var(--muted);font-size:14px;line-height:1.45}
#chat-host .dinox-guest-bottom strong{color:var(--ink);font-weight:600}
#chat-host .dinox-guest-bottom .btn{flex-shrink:0;padding:7px 12px;font-size:14px;line-height:1.4;border:1px solid var(--line);border-radius:6px;background:var(--accent);color:var(--accent-ink)}
#chat-host .dinox-guest-bottom .btn:disabled{opacity:.6;cursor:default}
@media(max-width:640px){#chat-host .dinox-guest-bottom{flex-wrap:wrap;padding:10px 12px;gap:8px}#chat-host .dinox-guest-bottom .btn{max-width:100%;white-space:normal}}
/* Scroll only the participant list; additions must not resize the chat or
   trigger competing browser scroll anchoring while Lit updates keyed rows. */
#chat-host converse-muc-occupants{min-height:0;min-width:0}
#chat-host .conversejs .occupants{min-height:0;overflow:hidden}
#chat-host .conversejs .occupant-list{min-height:0;overflow-anchor:none;scrollbar-gutter:stable;overscroll-behavior:contain}
#chat-host .conversejs converse-muc-occupant-list-item{display:block}
@media(max-width:640px){
 #chat-host .conversejs .occupants{max-width:none}
 #chat-host converse-muc-chatarea:has(converse-muc-sidebar)>.chat-area{display:none!important}
 #chat-host converse-muc-sidebar{width:100%;min-width:0}
 #chat-host converse-muc-chatarea>converse-split-resize{display:none}
}