When a browser requests a page, the first network response it gets back is small. TCP's slow-start behaviour means the very first round-trip from server to browser carries roughly 14 KB of compressed data before a second round-trip is needed. If the styling rules required to render the first screen fit inside that first packet, the page can paint correctly the instant the HTML arrives. If those rules live in a separate stylesheet, the browser has to fetch that file, parse it, and only then paint — and the reader watches an unstyled flicker while it happens.
Critical CSS is the technique of identifying the styling rules the page needs to paint correctly on first view and inlining them directly into the HTML. It is not the same as "above-the-fold CSS," which is a common shorthand and slightly wrong. Box-model resets, cascade layer declarations, custom property definitions, and font-loading rules all belong in critical CSS even though none of them are visible. They are the foundation everything else inherits from. Strip them out and the visible styles break.
The failure modes are real. Inline too much and the HTML balloons past the 14 KB budget, which defeats the point — now the first packet is bloated and the second round-trip happens anyway, just with a heavier payload. Inline a stale snapshot that no longer matches the current stylesheet and the page paints with the wrong layout, then jumps when the real CSS arrives. Critical CSS done badly is worse than not doing it at all, because the reader sees the layout shift twice instead of once.