My website's CSS file is currently massive, containing site-wide selectors in a file named Mondo.css. While this setup has been effective for ensuring users only need to download the file once, I've recently developed a widget that requires its own smaller subset of CSS rules in a separate file called Widget.css for better performance.
I am looking for run-time tools, such as browser plugins for Chrome, Firefox, or Internet Explorer, that can analyze the CSS dependencies and assist me in extracting the necessary styles from Mondo.css to create Widget.css. The goal is for Widget.css to act as the base class for a new CSS file titled "Site.css".
Additionally, I would like a tool that allows me to combine Widget.css (the base class) with Site.css (the derived class) back into Mondo.css (the aggregated class) seamlessly.