/* ===== Reações nas mensagens (add-on) ===== */
#messages .msg{position:relative}
.rx-add{position:absolute;top:-12px;right:12px;width:32px;height:32px;border-radius:9px;background:var(--card);border:1px solid var(--line);font-size:17px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transition:opacity .12s,transform .12s,background .12s;box-shadow:var(--shadow);z-index:3}
.msg:hover .rx-add{opacity:1}
.rx-add:hover{background:var(--active);transform:translateY(-1px)}
@media(hover:none){.rx-add{opacity:.85}}
.rx-bar{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
.rx{display:inline-flex;align-items:center;gap:5px;padding:3px 9px 3px 8px;border-radius:20px;background:var(--card);border:1px solid var(--line);cursor:pointer;font-size:13px;color:var(--txt2);transition:.12s;line-height:1}
.rx:hover{border-color:var(--txt3);background:var(--hover)}
.rx.mine{background:color-mix(in srgb,var(--brand) 22%,transparent);border-color:var(--brand);color:var(--txt)}
.rx .rx-e{font-size:15px}
.rx .rx-n{font-weight:800;min-width:8px;text-align:center}
.rx-pop{position:fixed;z-index:700;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:8px;box-shadow:var(--shadow);display:grid;grid-template-columns:repeat(6,1fr);gap:2px;animation:pop .12s ease}
.rx-pop button{font-size:20px;padding:6px;border-radius:8px;cursor:pointer;line-height:1;background:none;border:0}
.rx-pop button:hover{background:var(--hover)}