I like it. It enables some cool tricks and features a preprocesor can't handle.

While the double hyphen syntax for declaring variables is uniquely weird, var is interesting in that it allows for fallbacks if the variable is not defined.

True to its name, CSS offers cascading variables. As outlined in the spec:

The fallback value allows for some types of defensive coding. For example, an author may create a component intended to be included in a larger application, and use variables to style it so that it’s easy for the author of the larger application to theme the component to match the rest of the app. Without fallback, the app author must supply a value for every variable that your component uses. With fallback, the component author can supply defaults, so the app author only needs to supply values for the variables they wish to override.

/* In the component’s style: */
.component .header {
  color: var(--header-color, blue);
}
.component .text {
  color: var(--text-color, black);
}

/* In the larger application’s style: */
.component {
  --text-color: #080;
  /* header-color isn’t set,
     and so remains blue,
     the fallback value */
}