.sb-wrapper {
  position: fixed;
  z-index: 9999;
  transform: translateY(-50%);
}
.sb-right { right: 0; }
.sb-left  { left: 0; }

.sb-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 2px; /* небольшой отступ между кнопками */
}

.sb-item a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 45px;
  height: 45px;
  background-color: rgba(0,0,0,0.7); /* фон с прозрачностью */
  color: #ffffff; /* иконки всегда белые */
  text-decoration: none;
  border-radius: 0; /* строгие квадраты */
  transition: background-color 0.25s ease, transform 0.25s ease;
}

.sb-item a:hover {
  background-color: rgba(0,0,0,1); /* насыщенный чёрный */
  transform: translateX(-3px); /* лёгкий сдвиг при наведении */
}

.sb-icon {
  width: 100%;  /* иконка заполняет кнопку */
  height: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.sb-icon svg {
  width: 60%; /* немного отступов от краёв */
  height: 60%;
  fill: currentColor; /* цвет совпадает с color родителя */
  border-radius: 0; /* убираем закругления */
}