Объясните глупенькой: зачем тут присваивается класс соседнему элементу, если пометить красным нужно в итоге следующий?.. не проще ли сразу делать красными нужные круги?
.shooter-1 li {
background-color: white;
}
.shooter-1 .third + li {
background-color: red;
}
.shooter-2 li {
background-color: white;
}
.shooter-2 .first + li {
background-color: red;
}
.shooter-2 .third + li {
background-color: yellow;
}