/* ET-HOST responsive chat foundation, phase 1 ? 2026-10-16.
   Consolidated mobile structure; no hard-coded tenant colours. */
@media (max-width: 600px) {
 body.chat-page .tenant-shell {
   width:100%;max-width:100%;min-width:0;
   overflow-x:clip;
 }
 body.chat-page .tenant-head {
   flex:0 0 auto;min-width:0;max-width:100%;
 }
 body.chat-page .chat-layout {
   display:flex!important;flex-direction:column!important;
   flex:1 1 auto!important;min-height:0!important;
   min-width:0!important;width:100%!important;max-width:100%!important;
   overflow:hidden!important;gap:0!important;
 }
 body.chat-page .chat-panel {
   display:flex!important;flex-direction:column!important;
   flex:1 1 auto!important;min-height:0!important;
   min-width:0!important;width:100%!important;max-width:100%!important;
   overflow:hidden!important;isolation:isolate;
 }
 body.chat-page .chat-panel .room-tabs {
   position:relative!important;z-index:4;
   flex:0 0 auto!important;
   min-width:0!important;width:100%!important;
   overflow:visible!important;
   isolation:isolate;
 }
 body.chat-page .chat-panel .room-player-dock {
   position:relative!important;z-index:2!important;
   min-width:0!important;max-width:100%!important;
   isolation:isolate;
 }
 body.chat-page .chat-panel .room-player-dock > .radio-player.radio-player-room-v1 {
   display:grid!important;
   grid-template-columns:40px minmax(0,1fr) 102px!important;
   grid-template-rows:38px 28px 30px!important;
   gap:3px 7px!important;
   height:auto!important;min-height:112px!important;max-height:none!important;
   padding:7px 9px!important;
 }
 body.chat-page .room-player-dock .radio-player-room-v1 .radio-onair-host {
   display:none!important;
 }
 body.chat-page .room-player-dock .radio-player-room-v1 .play-btn {
   grid-column:1!important;grid-row:1!important;
 }
 body.chat-page .room-player-dock .radio-player-room-v1 .radio-player-copy {
   display:contents!important;
 }
 body.chat-page .room-player-dock .radio-player-room-v1 .radio-player-meta {
   display:none!important;
 }
 body.chat-page .room-player-dock .radio-player-room-v1 .radio-now-playing {
   grid-column:2/4!important;grid-row:1!important;
   position:static!important;min-width:0!important;
   width:100%!important;max-width:100%!important;
   overflow:hidden!important;white-space:nowrap!important;
 }
 body.chat-page .room-player-dock .radio-player-room-v1 .radio-song-voting {
   grid-column:1/-1!important;grid-row:2!important;
   position:static!important;justify-content:center!important;
   width:100%!important;min-width:0!important;
 }
 body.chat-page .room-player-dock .radio-player-room-v1 .radio-volume-control {
   grid-column:1/-1!important;grid-row:3!important;
   position:static!important;width:100%!important;
   min-width:0!important;
 }
 body.chat-page .chat-panel #chatMessages,
 body.chat-page .chat-panel .messages {
   position:relative!important;z-index:1!important;
   flex:1 1 0!important;min-height:0!important;
   overflow-x:hidden!important;overflow-y:auto!important;
   overscroll-behavior:contain;isolation:isolate;
 }
 body.chat-page #chatMessages > .message:not(.message-system) {
   min-width:0!important;height:auto!important;
 }
 body.chat-page #chatMessages > .message:not(.message-system) .message-content {
   position:relative;min-width:0!important;max-width:100%!important;
   height:auto!important;overflow-wrap:anywhere;
 }
 body.chat-page #chatMessages > .message:not(.message-system) .msg-meta {
   display:flex!important;flex-wrap:wrap!important;
   position:static!important;inset:auto!important;
   min-height:0!important;height:auto!important;
   margin:0 0 5px!important;padding:0!important;
   gap:4px 7px!important;
 }
 body.chat-page #chatMessages > .message:not(.message-system) .msg-tools {
   display:flex!important;flex-wrap:wrap!important;
   position:static!important;inset:auto!important;
   transform:none!important;float:none!important;
   justify-content:flex-start!important;
   height:auto!important;width:auto!important;
   max-width:100%!important;gap:5px!important;
   margin:6px 0 0!important;padding:0!important;
 }
 body.chat-page #chatMessages > .message:not(.message-system) .msg-tools button {
   position:static!important;transform:none!important;
   min-height:26px!important;margin:0!important;
 }
 body.chat-page .chat-panel .chat-composer {
   position:relative!important;z-index:3;
   flex:0 0 auto!important;min-width:0!important;
   width:100%!important;max-width:100%!important;
   height:auto!important;max-height:min(50dvh,340px)!important;
   overflow-y:auto!important;overflow-x:hidden!important;
   padding-bottom:max(10px,env(safe-area-inset-bottom))!important;
 }
 body.chat-page .chat-composer .composer-toolbar[hidden] {display:none!important}
 body.chat-page .chat-composer .composer-toolbar:not([hidden]) {
   position:static!important;inset:auto!important;
   max-width:100%!important;max-height:40dvh!important;
   overflow-y:auto!important;
 }
 body.chat-page .user-panel {
   isolation:isolate;background:var(--online-panel-bg,#fff);
 }
 body.chat-page .user-panel #onlineUsers {
   opacity:1;background:var(--online-panel-bg,#fff);
 }
}


/* Hidden mobile online list must not paint its children outside the panel. */
@media(max-width:600px){
 body.chat-page #userPanel[aria-hidden="true"]{display:none!important}
 body.chat-page #userPanel[aria-hidden="false"]{visibility:visible!important}
}
/* Align user-panel visibility with JavaScript's 760px mobile breakpoint. */
@media(max-width:760px){
 body.chat-page #userPanel:not(.open),
 body.chat-page #userPanel[aria-hidden="true"]{
   display:none!important;
   visibility:hidden!important;
   pointer-events:none!important;
 }
 body.chat-page #userPanel.open[aria-hidden="false"]{
   display:flex!important;
   visibility:visible!important;
   pointer-events:auto!important;
 }
}
@media(max-width:600px){
body.chat-page .chat-panel #chatComposer{display:flex!important;flex-direction:column!important;flex:0 0 auto!important;min-height:0!important;max-height:min(48dvh,355px)!important;overflow:hidden!important;gap:6px!important;padding:8px 10px 10px!important}
body.chat-page #chatComposer .composer-input-row{order:0!important;display:grid!important;grid-template-columns:minmax(0,1fr) 46px!important;position:relative!important;grid-row:auto!important;flex:0 0 auto!important;width:100%!important;min-width:0!important;margin:0!important}
body.chat-page #chatComposer #composerToolsToggle{order:1!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:9px!important;position:relative!important;flex:0 0 40px!important;width:100%!important;min-height:40px!important;height:40px!important;padding:6px 12px!important;margin:0!important;white-space:nowrap!important;line-height:1.2!important;overflow:visible!important;border-radius:11px!important;border:1px solid rgba(112,124,136,.2)!important;background:rgba(255,255,255,.9)!important}
body.chat-page #chatComposer #composerToolsToggle .tools-chevron{margin-left:auto!important}
body.chat-page #chatComposer #composerToolbar{order:2!important;position:relative!important;flex:0 1 auto!important;width:100%!important;min-width:0!important;min-height:0!important;max-width:100%!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain}
body.chat-page #chatComposer:not(.tools-open) #composerToolbar{display:none!important}
body.chat-page #chatComposer.tools-open #composerToolbar{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-auto-flow:row!important;gap:7px!important;align-content:start!important;align-items:stretch!important;padding:7px!important;border-radius:12px!important;background:rgba(255,255,255,.7)!important}
body.chat-page #chatComposer #composerToolbar>*{min-width:0!important;max-width:100%!important}
}
/* Mobile composer: tools as upward-opening panel, input permanently visible. */
@media(max-width:900px){
 body.chat-page .chat-panel #chatComposer {
  position:relative!important;overflow:visible!important;
  display:flex!important;flex-direction:column!important;
  flex:0 0 auto!important;max-height:none!important;
  height:auto!important;min-height:0!important;
  padding:8px 10px 9px!important;gap:6px!important;
  isolation:isolate;z-index:50!important;
 }
 body.chat-page #chatComposer .composer-input-row{
  order:0!important;flex:0 0 auto!important;
  position:relative!important;grid-row:auto!important;
  display:grid!important;grid-template-columns:minmax(0,1fr) 46px!important;
 }
 body.chat-page #chatComposer #composerToolsToggle {
  order:1!important;position:relative!important;flex:0 0 40px!important;
  width:100%!important;max-width:100%!important;
  min-height:40px!important;height:40px!important;
  margin:0!important;overflow:visible!important;
 }
 body.chat-page #chatComposer #composerToolbar {
  position:absolute!important;inset:auto 8px calc(100% + 4px) 8px!important;
  order:0!important;flex:none!important;
  box-sizing:border-box!important;width:auto!important;
  max-width:none!important;max-height:min(43dvh,305px)!important;
  height:auto!important;min-height:0!important;
  overflow-y:auto!important;overflow-x:hidden!important;
  z-index:55!important;box-shadow:0 -12px 32px rgba(20,35,45,.18)!important;
  border:1px solid rgba(100,115,128,.22)!important;
  border-radius:14px!important;background:var(--tenant-composer-bg,#f8fafb)!important;
 }
 body.chat-page #chatComposer:not(.tools-open) #composerToolbar{display:none!important}
 body.chat-page #chatComposer.tools-open #composerToolbar{
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:7px!important;padding:10px!important;align-content:start!important;
 }
}
/* Align the mobile tool toggle with the 900px compact-chat breakpoint. */
@media(min-width:601px) and (max-width:900px){
 body.chat-page #chatComposer #composerToolsToggle{
  display:flex!important;visibility:visible!important;
  align-items:center!important;justify-content:flex-start!important;
  flex:0 0 40px!important;min-height:40px!important;height:40px!important;
 }
}
/* Restore full text input width in compact chat layout. */
@media(max-width:900px){
 body.chat-page #chatComposer .composer-input-row{
  display:grid!important;grid-template-columns:minmax(0,1fr) 48px!important;
  grid-auto-flow:row!important;align-items:stretch!important;
  min-width:0!important;width:100%!important;max-width:100%!important;
 }
 body.chat-page #chatComposer .composer-input-row #chatInput{
  display:block!important;position:relative!important;
  grid-column:1!important;grid-row:1!important;
  width:100%!important;min-width:0!important;max-width:none!important;
  height:52px!important;min-height:52px!important;
  box-sizing:border-box!important;padding:10px 14px!important;
  border-radius:12px!important;opacity:1!important;visibility:visible!important;
 }
 body.chat-page #chatComposer .composer-input-row .send-btn{
  display:grid!important;grid-column:2!important;grid-row:1!important;
  width:48px!important;min-width:48px!important;height:52px!important;
 }
}
@media(max-width:900px){
body.chat-page .tenant-more-menu:not([hidden]){box-sizing:border-box!important;position:fixed!important;inset:auto 12px max(12px,env(safe-area-inset-bottom)) 12px!important;margin:0 auto!important;width:calc(100% - 24px)!important;max-width:520px!important;max-height:min(75dvh,680px)!important;overflow:hidden!important;display:flex!important;flex-direction:column!important;z-index:100050!important;padding:0!important;border-radius:18px!important;background:var(--tenant-composer-bg,#fff)!important;box-shadow:0 16px 48px rgba(0,0,0,.3)!important}
body.chat-page .tenant-more-menu .tenant-more-head{display:flex!important;align-items:center!important;justify-content:space-between!important;flex:0 0 auto!important;padding:12px 14px!important}
body.chat-page .tenant-more-menu .tenant-more-head button{width:40px!important;height:40px!important;min-width:40px!important;border-radius:10px!important}
body.chat-page .tenant-more-menu .tenant-more-items{display:grid!important;grid-template-columns:1fr!important;gap:7px!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;padding:10px 12px 14px!important;align-content:start!important}
body.chat-page .tenant-more-menu .tenant-more-items > .tenant-more-item{box-sizing:border-box!important;display:flex!important;flex-direction:row!important;justify-content:flex-start!important;align-items:center!important;text-align:left!important;gap:13px!important;width:100%!important;min-height:50px!important;height:auto!important;max-width:none!important;padding:10px 14px!important;border-radius:12px!important;white-space:normal!important}
body.chat-page .tenant-more-menu .tenant-more-items .tenant-action-label,body.chat-page .tenant-more-menu .tenant-more-items .tenant-custom-link-label,body.chat-page .tenant-more-menu .tenant-more-items .tenant-logout-label{display:inline!important;visibility:visible!important;opacity:1!important;position:static!important;max-width:none!important;width:auto!important;height:auto!important;overflow:visible!important;font-size:15px!important;font-weight:700!important;line-height:1.3!important;color:inherit!important}
body.chat-page .tenant-more-menu .tenant-more-items .tenant-action-icon,body.chat-page .tenant-more-menu .tenant-more-items .tenant-custom-link-icon{display:inline-flex!important;flex:0 0 26px!important;align-items:center!important;justify-content:center!important;min-width:26px!important;font-size:19px!important}
body.chat-page .tenant-more-menu .tenant-more-items .pm-nav-badge{margin-left:auto!important}
}


/* Mobile More navigation: same full-height panel model as Online users. */
@media(max-width:760px){
 body.chat-page .tenant-more-menu:not([hidden]){
  position:fixed!important;
  top:max(10px,env(safe-area-inset-top))!important;
  bottom:max(10px,env(safe-area-inset-bottom))!important;
  left:50%!important;right:auto!important;
  transform:translateX(-50%)!important;
  width:calc(100vw - 24px)!important;max-width:620px!important;
  height:auto!important;max-height:none!important;
  margin:0!important;padding:0!important;
  display:flex!important;flex-direction:column!important;
  overflow:hidden!important;box-sizing:border-box!important;
  z-index:100050!important;
  border-radius:17px!important;
 }
 body.chat-page .tenant-more-menu .tenant-more-head{
  position:relative!important;flex:0 0 auto!important;
  min-height:62px!important;padding:12px 16px!important;
 }
 body.chat-page .tenant-more-menu .tenant-more-items{
  flex:1 1 0!important;min-height:0!important;
  overflow-y:auto!important;overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch;
  align-content:start!important;
 }
 body.chat-page .tenant-more-backdrop:not([hidden]){
  position:fixed!important;inset:0!important;
  z-index:100040!important;
 }
}
/* Mobile online-list header: keep All Profiles and Close fully readable. */
@media(max-width:760px){
 body.chat-page #userPanel .user-head{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto auto!important;
  grid-template-rows:auto auto!important;
  gap:6px 8px!important;align-items:center!important;
  padding:12px 14px!important;min-height:92px!important;
 }
 body.chat-page #userPanel .user-head > strong{
  grid-column:1!important;grid-row:1!important;min-width:0!important;
 }
 body.chat-page #userPanel .user-head > span{
  grid-column:1!important;grid-row:2!important;justify-self:start!important;
 }
 body.chat-page #userPanel .user-head .all-profiles-link{
  display:inline-flex!important;visibility:visible!important;opacity:1!important;
  position:static!important;grid-column:2!important;grid-row:1/3!important;
  align-items:center!important;justify-content:center!important;
  min-width:0!important;width:auto!important;max-width:125px!important;
  min-height:40px!important;height:auto!important;
  padding:7px 10px!important;white-space:normal!important;
  font-size:12px!important;line-height:1.15!important;text-align:center!important;
  overflow:visible!important;
 }
 body.chat-page #userPanel .user-head .user-panel-close{
  display:flex!important;visibility:visible!important;
  grid-column:3!important;grid-row:1/3!important;
  position:static!important;align-items:center!important;justify-content:center!important;
  width:42px!important;min-width:42px!important;height:42px!important;
  margin:0!important;
 }
}
@media(max-width:760px){
body.chat-page .tenant-more-menu .tenant-more-head{
display:grid!important;grid-template-columns:minmax(0,1fr) 42px!important;
align-items:center!important;gap:8px!important;height:92px!important;
min-height:92px!important;box-sizing:border-box!important;padding:12px 14px!important;
background:rgba(var(--tenant-online-bg-rgb,255,255,255),var(--chat-userhead-opacity,.97))!important;
color:#1d252d!important;border-bottom:1px solid rgba(34,57,66,.16)!important;
position:sticky!important;top:0!important;z-index:60!important;
}
body.chat-page .tenant-more-menu .tenant-more-head strong{
grid-column:1!important;font-size:1.05rem!important;font-weight:800!important;
text-align:left!important;line-height:1.3!important;
}
body.chat-page .tenant-more-menu .tenant-more-head button[data-nav-more-close]{
grid-column:2!important;position:static!important;display:flex!important;
align-items:center!important;justify-content:center!important;
width:42px!important;min-width:42px!important;height:42px!important;
margin:0!important;padding:0!important;border-radius:12px!important;
background:#f0f2f4!important;color:#26343d!important;
}
}

/* Compact player: usable volume slider and a clear track title. */
@media(max-width:600px){
 body.chat-page .room-player-dock .radio-player-room-v1 .radio-volume-control{
  box-sizing:border-box!important;display:grid!important;
  grid-template-columns:22px minmax(0,1fr)!important;
  gap:8px!important;width:100%!important;max-width:100%!important;
  justify-self:stretch!important;align-items:center!important;
  padding:0 5px!important;
 }
 body.chat-page .room-player-dock .radio-player-room-v1 .radio-volume-control input[type=range]{
  display:block!important;width:100%!important;min-width:0!important;
  max-width:none!important;box-sizing:border-box!important;
 }
 body.chat-page .room-player-dock .radio-player-room-v1 .radio-now-playing{
  text-overflow:ellipsis!important;line-height:1.4!important;
  font-size:clamp(12px,3.2vw,14px)!important;
 }
}
/* Mobile message card refinement: typography, actions, avatars and dice. */
@media(max-width:760px){
 body.chat-page #chatMessages>.message{box-sizing:border-box;min-width:0;max-width:100%;gap:10px;padding:11px 10px!important}
 body.chat-page #chatMessages>.message .avatar{flex:0 0 43px;width:43px;height:43px;max-width:43px;object-fit:cover;border-radius:12px}
 body.chat-page #chatMessages>.message .message-content{flex:1 1 0;min-width:0;max-width:100%}
 body.chat-page #chatMessages>.message .msg-meta{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;margin-bottom:5px}
 body.chat-page #chatMessages>.message .msg-meta .msg-time{font-size:12px;opacity:.76}
 body.chat-page #chatMessages>.message .message-content>p{max-width:100%;overflow-wrap:anywhere;line-height:1.45}
 body.chat-page #chatMessages>.message .msg-tools{display:flex!important;position:static!important;flex-wrap:wrap!important;justify-content:flex-start!important;align-items:center!important;gap:6px!important;margin-top:8px!important;max-width:100%!important}
 body.chat-page #chatMessages>.message .msg-tools button{position:static!important;min-height:32px!important;padding:6px 10px!important;border-radius:9px!important;font-weight:650!important;line-height:1.2!important;white-space:normal!important}
 body.chat-page #chatMessages .chat-dice-event{box-sizing:border-box;max-width:100%;min-width:0;gap:12px;padding:12px!important;border-radius:16px!important}
 body.chat-page #chatMessages .chat-dice-event .chat-die-face{flex:0 0 54px;max-width:54px}
}


/* Compact responsive message spacing, retaining tenant palette. */
@media(max-width:900px){
 body.chat-page #chatMessages>.message{
  padding:9px 9px!important;gap:9px!important;
  margin-block:0!important;
 }
 body.chat-page #chatMessages>.message .message-content{
  min-width:0!important;align-self:start;
 }
 body.chat-page #chatMessages>.message .msg-meta{
  min-height:0!important;margin:0 0 3px!important;gap:3px 7px!important;
 }
 body.chat-page #chatMessages>.message .message-content>p{
  margin-block:2px 0!important;line-height:1.4!important;
 }
 body.chat-page #chatMessages>.message .msg-tools{
  margin:5px 0 0!important;gap:5px!important;
 }
 body.chat-page #chatMessages>.message .msg-tools button{
  min-height:30px!important;padding:5px 9px!important;
  border-radius:8px!important;
 }
 body.chat-page #chatMessages .chat-dice-event{
  width:100%!important;max-width:100%!important;
  min-height:0!important;padding:9px 11px!important;
  gap:10px!important;border-radius:14px!important;
 }
 body.chat-page #chatMessages .chat-dice-event .chat-die-face{
  width:48px!important;height:48px!important;
  max-width:48px!important;flex-basis:48px!important;
 }
}
/* Mobile profile dialogs: consistent viewport fit and internal scrolling. */
@media(max-width:900px){
 body.chat-page .profile-modal{
  box-sizing:border-box!important;padding:10px!important;
  align-items:center!important;justify-items:center!important;
  overflow:hidden!important;
 }
 body.chat-page .profile-modal .chat-persistent-page-dialog{
  box-sizing:border-box!important;
  width:min(100%,680px)!important;max-width:680px!important;
  height:min(92dvh,860px)!important;max-height:92dvh!important;
  min-height:0!important;
  border-radius:16px!important;overflow:auto!important;
  overscroll-behavior:contain!important;
 }
 body.chat-page .profile-modal .chat-persistent-page-dialog :is(img,video,iframe){
  max-width:100%;
 }
 body.chat-page .profile-modal .chat-persistent-page-dialog :is(input,textarea,select){
  max-width:100%;box-sizing:border-box;
 }
}



/* Mobile tools menu: compact, evenly sized controls instead of huge empty grid cells. */
@media(max-width:900px){
 body.chat-page #chatComposer.tools-open #composerToolbar{
  grid-template-columns:repeat(auto-fill,minmax(58px,1fr))!important;
  grid-auto-flow:row!important;grid-auto-rows:minmax(44px,auto)!important;
  justify-content:stretch!important;align-items:stretch!important;
  gap:6px!important;padding:9px!important;
  max-height:min(43dvh,290px)!important;
 }
 body.chat-page #chatComposer #composerToolbar>.composer-tool,
 body.chat-page #chatComposer #composerToolbar>label.upload-label,
 body.chat-page #chatComposer #composerToolbar>.composer-tool-style{
  box-sizing:border-box!important;display:flex!important;
  justify-content:center!important;align-items:center!important;
  width:100%!important;min-width:0!important;max-width:100%!important;
  min-height:44px!important;height:auto!important;margin:0!important;
 }
 body.chat-page #chatComposer #composerToolbar>.composer-status-control,
 body.chat-page #chatComposer #composerToolbar>.composer-status-container{
  grid-column:span 2!important;min-width:0!important;max-width:100%!important;
 }
 body.chat-page #chatComposer #composerToolbar>.composer-dj-actions{
  display:contents!important;
 }
 body.chat-page #chatComposer #composerToolbar .composer-dj-actions :is(a,button){
  box-sizing:border-box!important;max-width:100%!important;min-width:0!important;
 }
}
/* Uniform mobile composer tiles: icon on top, complete label beneath. */
@media(max-width:900px){
 body.chat-page #chatComposer.tools-open #composerToolbar{
  grid-template-columns:repeat(auto-fit,minmax(78px,1fr))!important;
  grid-auto-rows:auto!important;align-items:stretch!important;
  gap:8px!important;padding:11px 10px 13px!important;
 }
 body.chat-page #chatComposer #composerToolbar :is(
  .composer-tool,.composer-dj-action,.upload-label
 ){
  box-sizing:border-box!important;display:flex!important;
  flex-direction:column!important;align-items:center!important;
  justify-content:center!important;gap:5px!important;
  width:100%!important;min-width:0!important;max-width:100%!important;
  min-height:65px!important;height:auto!important;
  margin:0!important;padding:8px 4px!important;text-align:center!important;
  border-radius:12px!important;
 }
 body.chat-page #chatComposer #composerToolbar :is(
  .composer-tool,.composer-dj-action,.upload-label
 ) :is(.composer-tool-icon,.composer-dice-mark,.tenant-action-icon){
  display:flex!important;flex:0 0 26px!important;align-items:center!important;
  justify-content:center!important;min-width:26px!important;
  height:26px!important;font-size:20px!important;line-height:1!important;
 }
 body.chat-page #chatComposer #composerToolbar :is(
  .composer-tool,.composer-dj-action,.upload-label
 ) :is(.composer-tool-label,b){
  display:block!important;position:static!important;
  flex:0 0 auto!important;min-width:0!important;max-width:100%!important;
  margin:0!important;overflow:visible!important;text-overflow:clip!important;
  white-space:normal!important;overflow-wrap:normal!important;
  font-size:10px!important;font-weight:750!important;line-height:1.22!important;
  text-align:center!important;
 }
 body.chat-page #chatComposer #composerToolbar>.composer-dj-actions{display:contents!important}
 body.chat-page #chatComposer #composerToolbar .composer-dj-actions .composer-dj-action[hidden]{
  display:none!important;
 }
 body.chat-page #chatComposer #composerToolbar .composer-status-control{
  grid-column:span 2!important;display:flex!important;align-items:center!important;
  justify-content:space-between!important;min-width:0!important;
  max-width:100%!important;margin:0!important;padding:7px!important;
 }
 body.chat-page #chatComposer #composerToolbar .composer-status-control select{
  min-width:0!important;max-width:100%!important;flex:1 1 auto!important;
 }
}


/* Mobile composer status: one coherent row, no stretched or overlapping dropdown. */
@media(max-width:900px){
 body.chat-page #chatComposer.tools-open #composerToolbar #composerStatusControl{
  grid-column:span 3!important;
  box-sizing:border-box!important;display:flex!important;
  flex-direction:row!important;align-items:center!important;
  justify-content:flex-start!important;gap:8px!important;
  width:100%!important;max-width:100%!important;min-width:0!important;
  min-height:54px!important;height:auto!important;
  padding:6px 10px!important;margin:0!important;
  border-radius:12px!important;overflow:hidden!important;
 }
 body.chat-page #chatComposer #composerStatusControl .composer-status-title{
  flex:0 0 auto!important;width:auto!important;min-width:0!important;
  margin:0!important;font-size:12px!important;white-space:nowrap!important
 }
 body.chat-page #chatComposer #composerStatusControl .composer-status-dot{
  flex:0 0 auto!important;margin:0!important
 }
 body.chat-page #chatComposer #composerStatusControl select{
  display:block!important;box-sizing:border-box!important;
  flex:1 1 auto!important;width:0!important;min-width:0!important;
  max-width:100%!important;height:40px!important;
  margin:0!important;padding:0 27px 0 10px!important;
  font-size:13px!important;text-overflow:ellipsis!important;
 }
}
@media(max-width:420px){
 body.chat-page #chatComposer.tools-open #composerToolbar #composerStatusControl{
  grid-column:1/-1!important
 }
}


/* ET-HOST independent online-list wheel scroll 2026-10-17 */
@media (min-width:761px){
 body.chat-page .chat-layout > #userPanel{
  display:flex;flex-direction:column;min-height:0;max-height:100%;overflow:hidden;
 }
 body.chat-page .chat-layout > #userPanel > .user-head{flex:0 0 auto}
 body.chat-page .chat-layout > #userPanel > #onlineUsers{
  flex:1 1 auto;min-height:0;height:auto;
  overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;
  scrollbar-width:thin;-webkit-overflow-scrolling:touch;
 }
 body.chat-page #chatMessages{
  overflow-y:auto;overscroll-behavior-y:contain;
 }
}
@media (max-width:760px){
 body.chat-page #userPanel.open > #onlineUsers{
  overflow-y:auto;overscroll-behavior-y:contain;
  -webkit-overflow-scrolling:touch;
 }
}

/* Online-Panel has a fixed scroll viewport; only the list scrolls. */
@media(min-width:761px){body.chat-page .chat-layout>#userPanel{min-height:0!important;max-height:100%!important;overflow:hidden!important;display:flex!important;flex-direction:column!important}body.chat-page .chat-layout>#userPanel>#onlineUsers{flex:1 1 auto!important;min-height:0!important;max-height:100%!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain!important}}


/* ET-HOST mobile overlays readability and compact menu 2026-10-17 */
@media(max-width:760px){
 /* Guarantee opaque, high-contrast modal surfaces regardless of wallpaper/opacity. */
 body.chat-page #userPanel.open[aria-hidden="false"]{
  background:rgb(var(--tenant-online-bg-rgb,17,28,40))!important;color:var(--tenant-system-color,#f4f8fc)!important;
  opacity:1!important;isolation:isolate!important;
  border:1px solid #53758d!important;
  box-shadow:0 16px 50px rgba(0,0,0,.6)!important;
 }
 body.chat-page #userPanel.open>.user-head{
  background:rgb(var(--tenant-online-bg-rgb,24,42,59))!important;color:var(--tenant-system-color,#f3f8ff)!important;
  border-bottom:1px solid #41627b!important;
 }
 body.chat-page #userPanel.open>.user-head>strong,
 body.chat-page #userPanel.open>.user-head>span{
  color:#f3f8ff!important;text-shadow:none!important;opacity:1!important;
 }
 body.chat-page #userPanel.open>#onlineUsers{
  background:rgb(var(--tenant-online-bg-rgb,17,28,40))!important;opacity:1!important;color:var(--tenant-system-color,#f3f8ff)!important;
  isolation:isolate!important;overflow-y:auto!important;
 }
 body.chat-page #userPanel.open>#onlineUsers>*{
  background-color:rgb(var(--tenant-online-card-rgb,var(--tenant-online-bg-rgb,27,44,61)))!important;
  opacity:1!important;
  border-bottom-color:#38546b!important;
 }
 body.chat-page #userPanel.open #onlineUsers .user-info,
 body.chat-page #userPanel.open #onlineUsers .user-role,
 body.chat-page #userPanel.open #onlineUsers .online-user-name{
  opacity:1!important;
 }
 /* A compact floating sheet: no unused full-screen white area. */
 body.chat-page .tenant-more-menu:not([hidden]){
  top:50%!important;bottom:auto!important;
  transform:translate(-50%,-50%)!important;
  height:auto!important;max-height:calc(100dvh - 24px)!important;
  background:#111c28!important;color:#f3f8ff!important;
  border:1px solid #53758d!important;
  box-shadow:0 24px 65px rgba(0,0,0,.65)!important;
 }
 body.chat-page .tenant-more-menu .tenant-more-head{
  height:auto!important;min-height:64px!important;
  background:#182a3b!important;color:#f3f8ff!important;
  border-bottom:1px solid #41627b!important;
 }
 body.chat-page .tenant-more-menu .tenant-more-head strong{
  color:#f3f8ff!important;opacity:1!important;font-size:19px!important;
 }
 body.chat-page .tenant-more-menu .tenant-more-items{
  flex:0 1 auto!important;
  background:#111c28!important;
  padding:12px!important;gap:8px!important;
 }
 body.chat-page .tenant-more-menu .tenant-more-items>.tenant-more-item{
  background:#1b2c3d!important;color:#f3f8ff!important;
  border:1px solid #38546b!important;
  min-height:54px!important;border-radius:12px!important;
 }
 body.chat-page .tenant-more-menu .tenant-more-items>.tenant-more-item:focus-visible{
  outline:2px solid #82d8fa!important;outline-offset:2px!important;
 }
 body.chat-page .tenant-more-menu .tenant-more-items .tenant-action-label,
 body.chat-page .tenant-more-menu .tenant-more-items .tenant-custom-link-label,
 body.chat-page .tenant-more-menu .tenant-more-items .tenant-logout-label{
  color:#f3f8ff!important;
 }
}
/* High-contrast welcome cards for image-backed chat themes. */
body.chat-page #chatMessages>.message.welcome-stream-message>.message-content{background:rgba(246,249,253,.95)!important;border-radius:12px!important;padding:10px 14px!important;box-shadow:0 2px 12px rgba(0,0,0,.14)!important;backdrop-filter:blur(8px)!important;-webkit-backdrop-filter:blur(8px)!important;max-width:calc(100% - 52px)!important;width:fit-content!important;box-sizing:border-box!important}
body.chat-page #chatMessages>.message.welcome-stream-message>.message-content>p,body.chat-page #chatMessages>.message.welcome-stream-message>.message-content .msg-meta{color:#17324d!important;background:transparent!important;text-shadow:none!important}
body.chat-page .tenant-shell.chat-zero-transparency #chatMessages>.message.welcome-stream-message>.message-content>p,body.chat-page .tenant-shell #chatMessages>.message.welcome-stream-message .msg-meta b,body.chat-page .tenant-shell #chatMessages>.message.welcome-stream-message .msg-meta .msg-time{color:#17324d!important;text-shadow:none!important;-webkit-text-stroke:0!important}
