При использовании переменной в качестве значения свойства CSS вы можете добавить резервное значение, которое ваш браузер вернет, если данная переменная недействительна. Пример:
background: var(--penguin-skin, black);--penguin-skin не была установлена. Обратите внимание, что это может быть полезно для отладки.Похоже, что существует проблема с переменными в .penguin-top и .penguin-bottom . Вместо того, чтобы исправить опечатку, добавьте запасное значение black в свойство background в классах .penguin-top и .penguin-bottom .