Comment by kaelwd

That's the same as regular css variables unfortunately

    padding: 1em;
    padding: var(--padding);

With no fallback value that resolves to padding: unset if the variable is not defined. The only ways I know of to work around this are style queries:

    padding: 1em;
    @container style(--padding) {
      padding: var(--padding);
    }

Or cascade layers:

    @layer base {
      padding: 1em;
    }
    @layer override {
      padding: var(--padding, revert-layer);
    }