No styles are loaded when page refreshes after editing nested stylesheet

[itsHall]

My website has a main stylesheet which imports three other stylesheets which then import about a dozen sheets each. Editing the main stylesheet and its directly imported sheets reloads the page with proper CSS displaying. However, when editing the second-level nested sheets, the page reloads with no CSS applied.

The console logs:
GET http://website.local/main/buttons.css?browsersync=1679670024597 net::ERR_ABORTED 404 (Not Found) http://website.local/browser-sync/browser-sync-client.js?v=2.27.0:18

When editing the first-level nested sheets, as I said, it works, but it also outputs to console:
GET http://website.local/assets/css/main.css?browsersync=1679670033103 net::ERR_ABORTED 404 (Not Found) http://website.local/browser-sync/browser-sync-client.js?v=2.27.0:18

I also have this error when loading the page after turning on Instant Reload:
WebSocket connection to 'ws://website.local/browser-sync/socket.io/?EIO=3&transport=websocket&sid=zR62yz8jiREnCFg2AAAE' failed: http://website.local/browser-sync/browser-sync-client.js?v=2.27.0:18

Any help would be greatly appreciated, thank you!