Use scss @at-root

style.css

.message > li {
  background-color: green;
}

.message--error.message > li {
  background-color: red;
}

style.scss

.message {
  > li {
    
    @at-root & {
      background-color: green;
    }
    
    @at-root .message--error#{&} {
      background-color: red;
    }
  }
}