The webpage in question contains CSS that is not being utilized in the actual rendering of the page's content.
Why is this important?
Web browsers are programmed to diligently download every encountered stylesheet full of styles, in pursuit of rendering the webpage. However, this can lead to needless downloading of CSS styles that serve no purpose, consequently impeding the rendering speed.
What does the Optimization check?
Loud Interactive's Optimization mechanism activates for any internal link pointing to a CSS file that harbors more than 2 KiB of superfluous CSS rules.
How do you resolve this issue?
Clearing out unnecessary CSS might appear straightforward, yet it's a deceivingly intricate task. All available tools, akin to both Sitebulb and Lighthouse, are bound by their own constraints regarding the detection of unutilized CSS.
For instance, Lighthouse is capable of identifying redundant or unused codes on a solitary page, yet it cannot provide insightinto their use across other webpages. Sitebulb boasts a 'Code Coverage' feature which divulges needless rulses scattered throughout your entire site:
<!-- Example of potential output from Sitebulb's Code Coverage feature --><div> <!-- Code Coverage Percentage --> <p>78% utilized</p></div>
However, heed the caution that you cannot be absolutely certain the CSS is expendable:
User interactions, like clicking a button or opening a drop-down menu, are outside the capability of tools like Sitebulb to simulate, leaving several page states unverified.
Verifying each media query permutation on every webpage is an intricate and often impracticable affair.
Therefore, heedlessly deleting CSS solely based on a tool's output could potentially disrupt the essential functionality of critical webpages.
Instead, the imperative path forward is to entrust such optimization to a seasoned developer who has an intimate understanding of the web code, progressively refining it with time.
Further Reading
Remove unused CSS (Lighthouse documentation)