@Atawf
You stated you have four CSS files, one of them being your “main” one in which you added the @import rule.
When the TweeGo compiler processes the content of those four CSS file it will combine them together to create a <style role="stylesheet" id="twine-user-stylesheet" type="text/twine-css"> element in the Story HTML file’s <tw-storydata> element. Which the SugarCube engine will process during startup to create a <style id="style-story" type="text/css"> element in the document’s <head> element.
And the order that the TweeGo compiler processes those four CSS files, thus affecting the order their contents appears in the #twine-user-stylesheet and #style-story is determine by:
- the order that your Operating System supplied those CSS files to the TweeGo compiler.
- [potentially] the names you gave those CSS files
eg. if you named those CSS files: main.css; first.css; second.css; and third.css. And you were running Windows then by default those CSS files would be supplied to the TweeGo compiler in alphabetical order of their names (first, main, second & third).
And that can affect the order that rules get applied, and potential the execution of @ rules…