В чем разница между & $ сосредоточенным и сфокусированным в материальном интерфейсе?

Question

Я изучаю материал, но думаю, что в нем нет документов. Но не смог найти подходящий документ по этому вопросу.

Ниже приведен пример:

const useStyles = makeStyles(theme => ({
   common: {
        "&$focused": {
          borderBottom: "1px solid #BDBDBD"
        }
      },

    focused: {},
})

Кроме того, что если я хочу установить css, когда текстовое поле активно?