Как убрать просвечивание фона родительского блока?

Есть такая конструкция: Пример кода Подскажите, как убрать просвечивание фона по краям изображения (см. картинку)?

Вариант сделать так:

.value-bar {
  position: absolute;
  left: -1px;
  top: -1px;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  overflow: hidden;
}

работает, при условии, что красным заполнен <= половины круга. А если больше половины круга, то появляется такая проблема:

Как это победить?