[css-properties-values-api] Allow custom properties to be used for initial-value inside @property

[ianthedev]

If I define a custom property explicitly with the @property at-rule by using a straightfoward color value for initial-value, it works. Working example below:

@property --my-color1 {
    syntax: "<color>";
    initial-value: magenta;
    inherits: false;
}

But if I use a previously defined custom property for initial-value, it does not work. Not-working example below:

:root {
    --color-primary: magenta;
}

@property --my-color1 {
    syntax: "<color>";
    initial-value: var(--color-primary);
    inherits: false;
}

Please allow the not-working example to work. It kinda defeats the purpose of custom properties if we still have to write their values after defining them (inside @property, in this case).

The reason for involving @property in this case is to animate CSS gradient, as illustrated in this Stack Overflow answer. Such an animation/transition normally wouldn't work without @property.