Why is the overlay on the page not working?

Question

css

I want to impose a dimmer color on the page using fade in less, declared a variable with the color that I need, added this variable to background-color and the background becomes dim only for half a second and returns to the original one again. I don't understand what is wrong.

header {
background-color: fade(@overlay, 85%);
}

Answer 1

Somewhere in the styles there is another rule that overwrites the given.
How to treat - add !important / remove redundant rule / stick to time-tested methodology like BEM / etc.