Should we encourage use of $var for css variables?

Right now we support both `--var: value` and `$var: value`. For using variables in property values you do either `display: var(--value)` or just `display: $value`. What should we encourage and explain the documentation? It is important that we stay consistent.

Review the issue's two supported CSS variable syntaxes, `--var`/`var(--value)` and `$var`/`$value`, and determine which usage should be recommended. Done means the preferred convention and its explanation are agreed and reflected in the documentation; no specific documentation file or test is named here.

Written by the indexing model from the issue text.