/* Scoped to an entered room: lobby and other community pages keep their layout. */
body.chat-room-active .foot,body.chat-room-active #rankBox{display:none!important}
body.chat-room-active #app{display:block!important;max-width:1200px;margin:0 auto!important;padding:0 12px!important}
body.chat-room-active #view{min-width:0;padding:0!important}
body.chat-room-active .release-board-tabs{margin:0!important;min-height:40px;padding:2px!important;border-radius:0;flex-shrink:0}
body.chat-room-active .release-board-tabs .tab{font-size:12px!important;min-height:38px!important;padding:6px 2px!important}
body.chat-room-active .chat-room-layout{display:block!important;height:auto!important;margin:0!important}
.chat-room-layout>[data-release-match]{display:none!important}
.chat-room-layout .release-chat-column{gap:0!important;min-height:0}
body.chat-room-active .chat-room-expanded.card{position:relative;display:flex;flex-direction:column;box-sizing:border-box;height:var(--chat-room-height,70dvh)!important;flex:0 0 var(--chat-room-height,70dvh)!important;min-height:0!important;max-height:none!important;overflow:hidden!important;border:0!important;border-radius:0;padding:8px 0 0!important;margin:0!important;box-shadow:none;background:transparent}
.chat-room-expanded .bar{flex:0 0 auto;min-height:36px;gap:6px;padding:0 4px}
.chat-room-expanded .bar h2{font-size:16px!important;margin:0!important;min-width:0}
.chat-room-tools{display:flex;gap:2px;flex-shrink:0;margin-left:auto}
.chat-room-tools .iconbutton{width:36px;min-width:36px;height:36px;min-height:36px;padding:4px!important;font-size:22px!important;color:var(--ink);background:transparent;border:0}
.chat-room-expanded #chat-state{font-size:11px!important;margin:0 4px 6px!important;flex-shrink:0}
body.chat-room-active .chat-room-expanded #msgs{flex:1 1 0!important;min-height:0!important;border:0!important;border-radius:0;background:transparent!important;padding:10px 4px!important;gap:8px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.chat-room-expanded #msgs .m{flex-shrink:0;font-size:13px!important;line-height:1.5!important;max-width:86%;margin:0 0 4px;padding:8px 10px;border:1px solid var(--line);background:var(--soft,var(--panel));border-radius:14px}
.chat-room-expanded #msgs .m.me{margin-left:auto;background:#cfe4f7!important;color:#10243d!important;border-color:transparent}
.chat-room-expanded #msgs .m.me .release-message-author,.chat-room-expanded #msgs .m.me small,.chat-room-expanded #msgs .m.me time{color:#38536e!important}
.chat-room-expanded .release-message-author{gap:5px;font-size:11px!important;flex-wrap:wrap}
.chat-room-expanded .release-message-author b{font-size:11px!important}
.chat-room-expanded .release-message-author small,.chat-room-expanded .release-message-author time{font-size:10px!important}
.chat-room-expanded .release-message-author .member-avatar{width:22px!important;height:22px!important;font-size:11px}
.chat-room-expanded .user-copy{line-height:1.5}
/* Message surfaces own their foregrounds: page theme ink must not bleed into
   these light bubbles, including directly styled .user-copy descendants. */
#view #msgs .m{background:#f3f5f8!important;color:#161c24!important;border-color:#c0cad5!important}
#view #msgs .m.me{background:#cfe4f7!important;color:#161c24!important;border-color:#9bb9d6!important}
#view #msgs .m :is(.user-copy,.release-message-author b){color:#161c24!important}
#view #msgs .m :is(.release-message-author,small,time,i,.empty-message){color:#485365!important}
#view #msgs .m .acts button{color:#253e60!important;background:transparent!important}
body.chat-room-active .chat-room-expanded .release-chat-composer{position:relative;flex:0 0 auto;grid-template-columns:minmax(0,1fr) 44px;gap:3px 7px;margin:6px 0 0!important;padding:6px 0!important;border-top:1px solid var(--line)}
body.chat-room-active .release-chat-composer input{height:46px;min-height:46px;padding:10px 65px 10px 12px!important;border-radius:24px;font-size:16px!important}
body.chat-room-active .release-chat-composer>button{height:44px;min-height:44px;width:44px;border-radius:50%;padding:0!important;font-size:25px!important;background:#4e8ef4!important;color:white!important}
body.chat-room-active .release-chat-composer>.release-char-count{position:absolute;right:62px;top:21px;font-size:10px;margin:0;pointer-events:none;line-height:16px}
.chat-room-expanded .err:empty{display:none}
.chat-room-guide{position:absolute;right:4px;top:48px;z-index:5;width:min(340px,calc(100% - 8px));max-height:60%;overflow-y:auto;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--panel);box-shadow:0 8px 30px #0004}
.chat-room-guide[hidden]{display:none!important}
.chat-room-guide p{font-size:12px!important;line-height:1.6;margin:0!important}
body.chat-room-fullscreen #app{position:fixed;inset:0;z-index:1100;max-width:none;background:var(--bg);padding:0 12px!important}
body.chat-room-fullscreen .top,body.chat-room-fullscreen .mobile-nav,body.chat-room-fullscreen .release-board-tabs{display:none!important}
body.chat-room-fullscreen{overflow:hidden}
@media(max-width:900px){
 body.chat-room-active .topin{min-height:48px!important;padding-top:4px!important;padding-bottom:4px!important}
 body.chat-room-active .logo{font-size:20px!important}
 body.chat-room-active .logo svg{width:26px;height:26px}
 body.chat-room-active .top .tools button{min-height:34px!important;font-size:12px!important;padding:6px 9px!important}
 body.chat-room-active #app{padding:0 8px!important}
 body.chat-room-active .mobile-nav{min-height:54px!important;padding-top:3px!important;padding-bottom:max(3px,env(safe-area-inset-bottom))!important}
 body.chat-room-active .mobile-nav button{min-height:45px!important;padding:3px!important;font-size:10px!important;gap:2px!important}
 body.chat-room-active .mobile-nav svg{width:22px!important;height:22px!important}
 body.chat-keyboard-open .mobile-nav{display:none!important}
}

/* Conversation layout: avatar and author outside the light message surface. */
#view #msgs .m.chat-message{display:grid;grid-template-columns:36px minmax(0,1fr);grid-template-areas:"avatar author" "avatar message" ". actions";column-gap:9px;row-gap:4px;width:fit-content;max-width:94%;padding:0!important;margin:0 0 14px!important;background:transparent!important;border:0!important;border-radius:0;align-self:flex-start;box-shadow:none!important}
#view #msgs .m.chat-message.me{grid-template-columns:minmax(0,1fr);grid-template-areas:"message";margin-left:auto!important;align-self:flex-end;max-width:87%;background:transparent!important}
.chat-message-avatar{grid-area:avatar;align-self:start;padding-top:1px}
#view #msgs .chat-message-avatar .member-avatar,#view #msgs .chat-message-avatar .admin-brand-logo{width:36px!important;height:36px!important;font-size:16px!important;border-radius:50%;background:#547cae!important;color:#fff!important;border:1px solid #ffffff30;object-fit:cover}
#view #msgs .chat-message .release-message-author{grid-area:author;margin:0;min-width:0;gap:7px;line-height:1.4}
#view #msgs .chat-message .release-message-author b{color:var(--ink)!important;font-size:12px!important;overflow-wrap:anywhere}
#view #msgs .chat-message .release-message-author small{color:var(--mute)!important;font-size:10px!important}
.chat-message-line{grid-area:message;display:flex;align-items:flex-end;gap:7px;min-width:0}
#view #msgs .chat-message .chat-message-bubble{background:#d9e8f7!important;color:#161c24!important;border:1px solid #b8cfe6!important;border-radius:5px 15px 15px 15px;padding:9px 12px;font-size:13px!important;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere;min-width:0}
#view #msgs .chat-message.me .chat-message-bubble{background:#cfe4f7!important;border-color:#9bb9d6!important;border-radius:15px 5px 15px 15px}
#view #msgs .chat-message .chat-message-time{flex:none;color:var(--mute)!important;font-size:10px!important;line-height:1.5;padding-bottom:2px;white-space:nowrap}
#view #msgs .chat-message.me .chat-message-line{flex-direction:row-reverse}
#view #msgs .chat-message.me .chat-message-avatar,#view #msgs .chat-message.me .release-message-author{display:none!important}
.chat-message-actions{grid-area:actions;justify-self:start}
#view #msgs .chat-message-actions .acts{margin:0!important;gap:8px}
#view #msgs .chat-message-actions .acts button{font-size:10px!important;color:var(--mute)!important;min-height:24px;padding:2px 4px!important}
@media(max-width:600px){
 #view #msgs .m.chat-message{grid-template-columns:30px minmax(0,1fr);column-gap:7px;max-width:98%;margin-bottom:12px!important}
 #view #msgs .chat-message-avatar .member-avatar,#view #msgs .chat-message-avatar .admin-brand-logo{width:30px!important;height:30px!important;font-size:14px!important}
 #view #msgs .m.chat-message.me{grid-template-columns:minmax(0,1fr);max-width:92%}
 .chat-message-line{gap:5px}
 #view #msgs .chat-message .chat-message-bubble{padding:8px 10px}
 #view #msgs .chat-message .chat-message-time{font-size:9px!important}
}