Global CSS options with custom properties

With a preprocessor, like Sass, building a logical “do this or don’t” setting is fairly straightforward:
$option: false;
@mixin doThing {
@if $option {
do-thing: yep;
}
}
.el {
@include doThing;
}
Can we do that in native CSS with custom properties? Mark Otto shows that we can. It’s just a smidge different.
html {
–component-shadow: 0 .5rem 1rem rgba(0,0,0,.1);
}
.component {
box-shadow: var(–component-shadow);
}

.remove-shadow {
–component-shadow: none;
}
Direct Link ?