At most one CSS approach dominates
Why it matters
When no single CSS approach covers at least 70 percent of styled files, every contributor must learn Tailwind utility conventions, CSS Module naming rules, and styled-components template syntax to navigate the codebase. Design tokens live in three places, dark mode implementations diverge, and specificity conflicts between global CSS and scoped modules cause cascade bugs that only appear in production builds after PurgeCSS runs.
Severity rationale
Medium because the risk is developer velocity and visual inconsistency rather than functional bugs, though cascade conflicts can break UI at build time.
Remediation
Designate one approach as primary in CONTRIBUTING.md and rewrite outliers. Tailwind for 70 percent or more of files is the common answer; permit CSS Modules only for genuinely complex one-off components.
// src/components/Card.tsx — primary Tailwind pattern
<div className="rounded-lg border p-4 shadow-sm">
// src/components/ComplexAnimation.tsx — exception via CSS Module
import styles from './ComplexAnimation.module.css'
Add a lint rule or CI check that fails new PRs introducing a fourth approach.
DetectionPro
The detection method for this pattern is part of AuditBuffet Pro.
The full method (what to look for, pass and fail conditions, and how results get reported) ships inside the Multi-Session Drift Audit. The pattern definition, severity rationale, and remediation remain openly licensed under CC-BY-4.0.
Taxons
History
- 2026-04-18·v1.0.0·Initial import from ai-slop-code-drift·automated