/* MENTE UNO: VER USUARIOS DE REACCIÓN */

.reaction-users-dialog{
    width:min(390px,calc(100vw - 24px));
    max-height:min(620px,calc(100dvh - 24px));
    padding:0;
    overflow:hidden;
    border:1px solid #355975;
    border-radius:20px;
    background:#0d2139;
    color:#dce8f2;
    box-shadow:0 24px 70px rgba(0,0,0,.65);
}

.reaction-users-dialog::backdrop{
    background:rgba(2,10,20,.74);
    backdrop-filter:blur(5px);
}

.reaction-users-dialog header{
    display:flex;
    justify-content:space-between;
    gap:15px;
    padding:18px;
    border-bottom:1px solid #294761;
}

.reaction-users-dialog h2{
    margin:0;
    font-size:18px;
}

.reaction-users-dialog header p{
    margin:5px 0 0;
    color:#8ca2b6;
    font-size:13px;
}

.reaction-users-dialog header button{
    width:38px;
    height:38px;
    border:1px solid #355975;
    border-radius:11px;
    background:#102a47;
    color:#fff;
    font-size:24px;
}

#reactionUsersList{
    display:grid;
    max-height:min(470px,calc(100dvh - 145px));
    overflow:auto;
    padding:8px;
}

.reaction-user-row{
    display:grid;
    grid-template-columns:40px minmax(0,1fr) auto;
    align-items:center;
    gap:10px;
    min-height:52px;
    padding:6px 9px;
    border-radius:12px;
}

.reaction-user-row > span{
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    border-radius:50%;
    background:linear-gradient(145deg,#4d83a7,#173e5e);
    font-weight:700;
}

.reaction-user-row strong{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:15px;
}

.reaction-user-row small{
    color:#8fd3ff;
}

.reaction-users-empty{
    padding:20px 12px;
    color:#8ca2b6;
    text-align:center;
}