I’m trying to figure out how to prefer local sources with variable fonts. Do you need to do multiple @font-face rules, each pointing to the webfont file? Eg:

font-weight 400, src: local('Font'), url(./variable-font.woff)...

font-weight 700, src: local('Font Bold'), url(./variable-font.woff)...