Tailwind's source-driven generation helps keep the stylesheet focused on the utilities used by the project. Production size still depends on source discovery, custom CSS, plugins, and how the app imports styles. Avoid assuming that adding a large utility framework means every possible rule ships to every user.

Load CSS through the normal application build pipeline, avoid duplicating the same stylesheet through multiple entry points, and inspect the production bundle when CSS size matters. Measure before optimizing; unused custom CSS and duplicated assets can be as relevant as framework output.

When a style does not appear, debug systematically:

1. Confirm the utility name and syntax are valid for the installed version.
2. Inspect the element's class attribute in the browser.
3. Check whether the class candidate appears in a scanned source file.
4. Inspect the generated CSS and computed styles.
5. Look for specificity, cascade layers, inline styles, or conflicting rules.
6. Check whether a parent clips or constrains the element.

A class being present in HTML does not guarantee a matching rule exists. Likewise, a generated rule may be overridden by another declaration. Distinguish generation problems from cascade problems before applying a workaround.

Before shipping, test a production build rather than relying only on development mode. Verify responsive layouts, keyboard navigation, focus visibility, contrast, form errors, dark mode, and reduced-motion behavior. Check that all important content is available without hover and that hidden elements do not create confusing keyboard paths.

Keep utilities consistent through a documented scale and reusable components where they add value. Remove dead custom CSS, avoid broad global selectors that unexpectedly affect third-party components, and document non-obvious arbitrary values or design tokens.