/* Compact room controls; message and player nodes stay attached. */
.chat>.pro-toolbar,.chat>.intro{display:none}.chat .chat-header{position:relative;min-height:64px;padding:12px 20px;gap:10px;z-index:8}.chat .chat-header h1{font-size:20px;margin-bottom:3px}.chat .chat-header p{font-size:10px}.chat .chat-room-emblem{width:35px;height:35px;flex-basis:35px;border-radius:11px}.chat .chat-typing-band:not(.has-typists){display:none}.chat .chat-typing-band.has-typists{min-height:24px;padding:5px 20px;font-size:10px}.chat-typing-band .chat-live-caption{display:none}.messages{flex:1;min-height:0;padding:12px 20px 16px}.chat>.compose{padding:10px 18px max(10px,env(safe-area-inset-bottom))}.compose-note{padding-top:4px;font-size:8px;min-height:0}.compose-note>span:first-child{display:none}.compose-note #counter{margin-left:auto}.pro-draft-state{margin-left:8px}.room-compact-trigger{display:inline-flex;align-items:center;justify-content:center;gap:6px;flex:none;min-height:36px;padding:8px 10px;border:1px solid var(--line);border-radius:11px;background:var(--input);color:var(--text);font-size:11px}.room-compact-trigger>.chat-ui-icon{width:17px;height:17px;flex:0 0 17px}.room-compact-trigger[aria-expanded=true]{background:var(--panel2);color:var(--accent)}.room-compact-trigger:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.room-pin-count{font-size:9px;color:var(--accent);white-space:nowrap}.room-compact-menu,.room-compose-menu{position:absolute;z-index:75;border:1px solid var(--line);border-radius:17px;background:var(--panel);color:var(--text);box-shadow:0 12px 35px #0004;max-height:min(360px,calc(var(--mobile-app-height,100dvh) - 140px));overflow-y:auto;overscroll-behavior:contain}.room-compact-menu{top:calc(100% + 6px);right:12px;width:min(340px,calc(100vw - 24px));padding:14px}.room-compact-menu h3{font-size:12px;margin:0 0 12px}.room-compact-menu .pro-toolbar-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.room-compact-menu .pro-control{display:flex;align-items:center;justify-content:flex-start;gap:9px;padding:12px;font-size:11px;min-height:42px;border:1px solid var(--line);border-radius:11px;background:var(--input);color:var(--text)}.room-compact-menu .pro-control>svg{width:17px;height:17px;flex:none}.room-compact-menu #historyButton{display:block;width:100%;padding:11px;margin:10px 0 0;border-radius:11px;font-size:11px;background:var(--input);color:var(--muted)}.room-compact-menu .chat-pins{padding:10px 0 0;margin-top:10px;display:grid;gap:7px;border:0;max-height:160px;overflow-y:auto}.room-compact-menu .chat-pin{min-width:0;max-width:none;width:100%;font-size:11px;padding:10px}.room-compose-menu{bottom:calc(100% + 7px);left:14px;right:14px;max-width:410px;padding:9px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.room-compose-menu button,.compose .room-compose-menu #mentionButton{display:flex;align-items:center;justify-content:flex-start;gap:8px;width:auto;min-width:0;height:auto;min-height:46px;flex:initial;padding:11px!important;border:1px solid var(--line);border-radius:11px;background:var(--input);color:var(--text);font-size:17px}.room-compose-menu button>svg{width:19px;height:19px;flex:none}.room-compact-label{font-size:11px;line-height:1.4;text-align:left}.compose #composeMoreButton{display:grid;place-items:center;flex:0 0 36px;width:36px;height:39px;min-height:39px;padding:8px;border:0;background:transparent;color:var(--muted)}#composeMoreButton>span{display:none}.compose #messageInput{flex:1;min-width:0}.message .app-message-options{position:absolute;top:1px;right:0;display:grid;place-items:center;width:28px;height:28px;padding:0;border-radius:8px;background:transparent;color:var(--muted);font-size:23px;line-height:1}.message .message-meta{position:relative;padding-right:30px;min-height:28px}.messages .message-actions{display:none}.messages .message.app-actions-open .message-actions{display:flex;flex-wrap:wrap;opacity:1}.message-content,.message.own .message-content{padding:11px 14px}.message-body{line-height:1.65}
@media(min-width:1151px){.layout{grid-template-columns:280px minmax(0,1fr) 210px}.people{padding:22px 14px}.chat .messages{padding-left:22px;padding-right:22px}}
@media(min-width:701px) and (max-width:1150px){.layout{grid-template-columns:260px minmax(0,1fr)}}
@media(max-width:700px){.chat .chat-header,body.mobile-app-active .chat .chat-header{min-height:calc(58px + env(safe-area-inset-top));padding:calc(8px + env(safe-area-inset-top)) 10px 8px;gap:7px}.chat .chat-header h1{font-size:16px}.chat .chat-header p{max-width:140px;font-size:9px}.chat .chat-header #menuButton{width:34px;height:34px;flex-basis:34px;padding:8px}.chat #roomOptionsButton{width:34px;height:34px;min-height:34px;padding:8px}.chat #roomOptionsButton>span,.chat #roomOptionsButton .room-pin-count{display:none}.chat #roomOptionsButton:has(.room-pin-count:not([hidden]))::after{content:'';position:absolute;width:6px;height:6px;border-radius:50%;background:var(--accent);transform:translate(11px,-10px)}.chat .messages{padding:8px 10px 12px}.chat>.compose{padding:7px 9px max(7px,env(safe-area-inset-bottom))}.chat .chat-typing-band.has-typists{padding:4px 12px;min-height:22px}.room-compose-menu{left:9px;right:9px}.room-compact-label{font-size:10px}.message-content,.message.own .message-content{padding:10px 11px}.compose-note{font-size:7px}.room-compact-menu .pro-control>span{display:inline}}
[hidden]{display:none!important}
.chat .chat-header.room-options-open,.chat>.compose.room-compose-open{z-index:65}
.room-compact-menu,.room-compose-menu{position:fixed;z-index:75}.room-compose-menu{bottom:auto}
.room-compose-menu #stickerButton{width:100%;height:auto;min-height:46px;flex:initial;justify-content:flex-start;background:var(--input);color:var(--text)}.room-compose-menu #stickerButton>.room-compact-label{display:inline}

/* Stable chat identity hierarchy, independent of decorator arrival order. */
#messages .message{gap:8px;align-items:flex-start}
#messages .message>.message-content{padding-left:10px;padding-right:10px;min-width:0}
#messages .message-meta{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:4px 6px;padding-right:28px;margin-bottom:6px;line-height:1.4;min-width:0}
#messages .message-meta>strong{order:0;min-width:0;max-width:100%;overflow-wrap:anywhere}
#messages .message-meta>.role-tag{order:1;flex:none}
#messages .message-meta>time{order:5;margin-left:auto;flex:none;font-size:9px}
#messages .message-meta>small{order:5;flex:none}
#messages .message-meta>.spark-user-title{order:10;flex:1 1 calc(100% - 85px);margin:0;min-width:0;max-width:calc(100% - 78px);font-size:10px;line-height:1.4}
#messages .message-meta>.spark-user-title img{max-width:min(130px,100%);max-height:23px;object-fit:contain}
#messages .message-meta>.chat-level-summary{order:2;flex:0 1 auto;margin:0;gap:3px;max-width:100%;flex-wrap:wrap}
#messages .message-meta>.god-mode-badge{order:3;flex:0 0 auto;margin:0;padding:3px 5px;gap:4px}
#messages .message-meta>.spark-user-gifts{order:4;flex:0 1 auto;margin:0;flex-wrap:wrap;max-width:100%}
#messages .chat-sticker-image,#messages .spark-paid-sticker-image{width:auto;height:auto;max-width:min(120px,100%);max-height:120px;object-fit:contain}
#messages .spark-paid-sticker,#messages .spark-paid-sticker.spark-vector-sticker{width:120px;max-width:100%;min-width:0}
#messages .spark-illustrated-sticker{display:block;width:100%;height:auto;max-height:120px;object-fit:contain}
#messages .spark-paid-sticker svg{display:block;width:100%;height:auto;max-height:120px}
@media(max-width:700px){
 #messages .message{gap:7px}
 #messages .message>.message-content{padding:9px}
 #messages .chat-sticker-image,#messages .spark-paid-sticker-image{max-width:min(96px,100%);max-height:96px}
 #messages .spark-paid-sticker,#messages .spark-paid-sticker.spark-vector-sticker{width:96px}
 #messages .spark-paid-sticker svg,#messages .spark-illustrated-sticker{max-height:96px}
 #messages .message-meta>.god-mode-badge strong{font-size:7px!important;letter-spacing:.4px}
}

/* Visible message actions, separated from identity and timestamp. */
#messages .message .message-meta{padding-right:0}
#messages .message-meta>.app-message-options{display:inline-flex;align-items:center;justify-content:center;gap:5px;white-space:nowrap;position:static;order:11;flex:0 0 auto;width:auto;height:auto;min-height:26px;padding:4px 8px;margin-left:0;border:1px solid var(--line);border-radius:7px;background:var(--input);color:var(--muted);font-size:10px;line-height:1.4;font-weight:600;letter-spacing:0}
#messages .message-meta>.app-message-options::after{content:'⌄';margin-left:0;font-size:12px}
#messages .message-meta>.app-message-options[aria-expanded=true]{color:var(--accent);border-color:var(--accent)}
#messages .message-meta>.app-role-identity{font-size:10px;letter-spacing:.4px;padding:3px 6px;color:var(--accent);font-weight:750}
@media(max-width:700px){#messages .message-meta>.app-message-options{font-size:9px;min-height:26px;padding:4px 7px}}

#messages .message-meta:has(>.spark-user-title)::after{content:"";order:9;flex:0 0 100%;height:0}

/* Desktop online list: avatar and clickable username only. */
@media(min-width:1151px){
 .people #online .user-line{display:flex;align-items:center;gap:10px;padding:8px 0;margin:0;min-height:48px}
 .people #online .user-line>.user-info{min-width:0;flex:1}
 .people #online .user-info>:not(strong),.people #online .user-line>:not(.avatar):not(.user-info){display:none!important}
 .people #online .user-line::before,.people #online .user-line::after,.people #online .user-info::before,.people #online .user-info::after{display:none!important}
 .people #online .user-info>strong{display:block;margin:0;font-size:12px;line-height:1.5;overflow-wrap:anywhere}
}