Испытание. Дуэль

Уважаемые Гуру, подскажите пожалуйста, непонятны два момента:

  1. В каждом элементе списка li содержатся: класс hitbox, класс lever и тэг i - вопрос:
    почему в данном задании их расположении в CSS как селекторов имеет значение?
  2. Почему в коде:

.lever{
position:absolute;
top:-2px;
left:-2px;
width:26px;
height:26px;
background:#f5f5f5;
border-radius:50%;
box-shadow:0 0 2px rgba(0,0,0,0.5);
}
i{
position:absolute;
background:#f5f5f5;
width:5px;
height:25px;
top:12px;
left:11px;
box-shadow:
-1px 15px 2px rgba(0,0,0,0.3),
1px 15px 2px rgba(0,0,0,0.3);
}
.miss .lever{
display:none;
}

блокируется только селектор lever , не блокируется селектор i , однако, этого достаточно?

Даже само по себе наличие “i” в эл-те с классом “.lever” сильно запутывает.
Просьба к разробам поподробней рассказать о такой комбинации? Почему так запутано?

.Lever - это объект состоящий из белого круга и объекта i -палки к этому кругу.
Общий алгоритм такой прописываем все мешени как пробитые, далее закрываем их.
А дальше на определенные дырки говорим объект Lever убрать. В этом случае и закрытая дырка и палка исчезнут (палка находится внутри объекта lever).

2 лайка