/* Message actions float independently of message text and reaction chips. */
.message-payload > .message-image-link + small { display:block; margin-top:6px; font-size:11px; line-height:1.4; color:var(--muted); }
:is(#dm-content,#live-chat-messages) .message-payload { container-type:inline-size; }
:is(#dm-content,#live-chat-messages) .message-payload > .message-image-link { display:inline-flex; width:auto; background:transparent; }
:is(#dm-content,#live-chat-messages) .message-payload > .message-image-link > .message-image { max-width:min(430px,calc(100cqi - 2px)); }
.msg-content-line > .msg-tools { position:absolute!important; inset:auto!important; top:2px!important; right:8px!important; margin:0!important; visibility:visible!important; opacity:0; pointer-events:none; transition:opacity 120ms ease; z-index:26; }
:is(.live-message,.message,.reply):hover .msg-tools,
.msg-tools:focus-within,.msg-tools:has(.react-pop:not([hidden])) { opacity:1; pointer-events:auto; }
:is(.live-message,.reply)[data-actions-open] .msg-tools { opacity:1; pointer-events:auto; }
:is(.live-message,.reply):focus-visible { outline:1px solid var(--sea); outline-offset:2px; }
.msg-action-strip { display:flex; align-items:center; gap:1px; padding:2px; border:1px solid var(--line); border-radius:9px; background:var(--mist); color:var(--muted); box-shadow:0 2px 6px #0002; }
.msg-action-strip > button { display:grid; place-items:center; flex:none; width:28px; height:28px; min-width:28px; min-height:28px; margin:0; padding:4px; border:0; border-radius:5px; background:transparent; color:var(--muted); line-height:1; cursor:pointer; }
.msg-action-strip > .msg-quick-react { font-size:19px; }
.msg-action-strip > button:hover { background:var(--foam); color:var(--deep); }
.msg-action-strip > .msg-delete-btn { color:var(--red); }
.msg-action-strip > button:focus-visible{ outline:2px solid var(--sea); outline-offset:1px; }
.msg-action-strip svg { display:block; width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }

.msg-action-divider { width:1px; height:18px; margin-inline:3px; background:var(--line); }

.msg-tools > :is(.react-pop) { background:var(--mist); color:var(--deep); border-color:var(--line); border-radius:10px; }
.msg-tools > .react-pop::before { display:none; }
#thread-scroll .thread-meta > time { margin-inline-start:0; }
@media(min-width:651px) and (hover:hover) {
 #thread-scroll .reply > .thread-meta { padding-inline-end:200px; min-height:34px; }
}
@media(max-width:650px),(hover:none) {
 .msg-content-line > .msg-tools { position:relative!important; inset:auto!important; opacity:1; pointer-events:auto; width:44px; min-width:44px; height:44px; }
 .msg-action-strip { padding:0; border:0; border-radius:8px; background:transparent; box-shadow:none; }
 .msg-action-strip > :is(.msg-quick-react,.msg-react-btn,.msg-reply-btn,.msg-action-divider) { display:none; }

}
@media(max-width:650px) { :is(#dm-content,#live-chat-messages) .message-payload > .message-image-link > .message-image { max-width:calc(100cqi - 2px); } }
@media(prefers-reduced-motion:reduce) { .msg-content-line > .msg-tools { transition:none; } }
/* Touch: tap a message to expose its direct action strip. No extra menus and
   no permanent 44px toolbar beneath every consecutive message. */
@media(max-width:650px),(hover:none) {
 :is(#dm-content,#live-chat-messages,#thread-scroll) .msg-content-line { display:block; }
 :is(#dm-content,#live-chat-messages,#thread-scroll) .msg-content-line>.msg-tools { display:none; }
 :is(#dm-content,#live-chat-messages,#thread-scroll) :is(.live-message,.reply)[data-actions-open] .msg-content-line>.msg-tools { display:block; position:relative!important; inset:auto!important; width:100%; min-width:0; height:auto; min-height:0; margin:4px 0 0!important; padding:0; opacity:1; pointer-events:auto; }
 :is(#dm-content,#live-chat-messages,#thread-scroll) .msg-action-strip { justify-content:flex-end; flex-wrap:wrap; width:100%; }
 :is(#dm-content,#live-chat-messages,#thread-scroll) .msg-action-strip>:is(.msg-react-btn,.msg-reply-btn,.msg-edit-btn,.msg-delete-btn) { display:grid; width:44px; height:44px; min-width:44px; min-height:44px; padding:11px; }
}