CSS Переменная с HSL не пересчитывается

Question

Ситуация

В моем файле CSS есть следующие определения (упрощенно).

:root {
  --app-color-hue: 30;
  --app-color: hsl(var(--app-color-hue), 80%, 60%);
}

body {
  --app-color-hue: 145;
  background: var(--app-color);
}

Я ожидал использовать переменную CSS app-color во всем приложении и установите оттенок до --app-color-hue. Однако элемент body показывает Оранжевый (30) вместо Зеленый (145) .

Когда я сам устанавливаю hsl в значение, цвет обновляется очень хорошо Я предполагаю, что проблема в том, что hsl обнаруживает изменение и не пересчитывает, когда переменная CSS внутри него обновляется в другом элементе.

Вопрос

Есть ли у кого-нибудь более проницательное понимание по этому вопросу?

Я также не знаю, как я могу сообщить об этом как об ошибке, если это считается ошибкой. Поэтому я также был бы признателен всем, кто указал мне правильное направление в этом отношении.

Answer 1

Я нашел ответ сам.

Пользовательские свойства ограничены элементом (ами), на котором они объявлены, и участвуют в каскаде: значение такого пользовательского свойства - это значение из Декларация определяется каскадным алгоритмом.
_{Источник: https://developer.mozilla.org/en-US/docs/Web/CSS/--*}

Таким образом, мое "возможное объяснение" является разработанным и поэтому не является ошибкой.