The browser chooses the default sans-serif. If you want the system font, you need to use "system-ui" for Safari/Chrome and "-apple-system" for Firefox (Chrome also has BlinkMacSystemFont). "system-ui" is becoming an official standard, so its only a matter of time until Firefox supports it. https://drafts.csswg.org/css-fonts-4/#system-ui-def
But 'system-ui' is... well... intended for UI usage. It may not be so well suited for page content.
If you're creating UI elements on your web page (though why aren't you using the browser's built-in form control elements?), then 'system-ui' is probably appropriate. But if you're publishing textual content (rather than UI), 'sans-serif' or 'serif' may be a better choice. Most browsers even let users configure their preferred fonts for these generic names, if they don't like the defaults.
Presumably because it is or was considered a web standard (either de facto or explicit, I assume the former but I’m not sure) that browsers decided to respect.
There are two defaults: web default and OS default. I can understand the default default(!) being the web, at least then it looks consistent across platforms.
