How to load different style files for different platforms?

Question

css

Hello! A couple of days ago I started to study BEM (a requirement for an internship) and came across in the documentation on the item "Separation of the project into platforms". If I understand correctly, the point is not to load large files with styles on all platforms, but only those necessary for a specific platform, but I didn’t understand how exactly they will be connected? Suppose, as a result of the work, we got the following files:
desktop.bundles/bundle/bundle.css, which contains

import "common.blocks/button/button.css";   /* Базовые CSS-правила */
import "desktop.blocks/button/button.css";  /* Особенности для настольных устройств */

mobile.bundles/bundle/bundle.css

import "common.blocks/button/button.css";   /* Базовые CSS-правила */
import "mobile.blocks/button/button.css";   /* Особенности для мобильных устройств */

So far, I can only imagine connecting them one by one, but you can shove everything into one file and connect only it.
Ps I apologize in advance for possible stupidity, I'm literally taking my first steps, and I took up BEM because of an internship (+ desire to learn new things)

Answer 1

Where did you read this? I've been working with BEM for a long time, I definitely haven't come across something like this