Summary
The dashboard ships two parallel styling systems: a legacy @layer components layer (.btn-primary, .btn-outline, .btn-sm, .btn-danger, .btn-ghost, .btn-success, .btn-secondary, .form-input, .form-label, .form-helper, .detail-dialog, …) and the shadcn-svelte primitives (Button, Field, Input, Dialog). They have different focus-ring mechanics, radii, and sizing — which is the main source of visual inconsistency.
Evidence
web/src/app.css:297-803 — legacy classes (82+ selectors).
- Remaining legacy usage is small:
.btn-secondary (2 files), .btn-success / .btn-ghost / .btn-danger (1 file each); .btn-primary / .btn-outline = zero usage.
.text-sm is redefined in app.css:1042 colliding with the Tailwind utility name (13 refs).
.detail-dialog fights shadcn dialog-content with !important ×3 (app.css:806-815).
- Dual empty-state systems and dual form systems also stem from this split (tracked in a separate issue).
Fix
- Write
web/design/COMPONENT-STANDARDS.md declaring shadcn primitives as the ONLY component system; legacy classes deprecated.
- Migrate the ~5 files still using
.btn-* to Button variants.
- Delete
.btn-primary / .btn-outline (0 usage) and other dead legacy selectors; resolve .text-sm collision; re-evaluate .detail-dialog !importants.
Acceptance criteria
Source: Titen UX audit 2026-09-20 (finding M2).
Summary
The dashboard ships two parallel styling systems: a legacy
@layer componentslayer (.btn-primary,.btn-outline,.btn-sm,.btn-danger,.btn-ghost,.btn-success,.btn-secondary,.form-input,.form-label,.form-helper,.detail-dialog, …) and the shadcn-svelte primitives (Button,Field,Input,Dialog). They have different focus-ring mechanics, radii, and sizing — which is the main source of visual inconsistency.Evidence
web/src/app.css:297-803— legacy classes (82+ selectors)..btn-secondary(2 files),.btn-success/.btn-ghost/.btn-danger(1 file each);.btn-primary/.btn-outline= zero usage..text-smis redefined inapp.css:1042colliding with the Tailwind utility name (13 refs)..detail-dialogfights shadcndialog-contentwith!important×3 (app.css:806-815).Fix
web/design/COMPONENT-STANDARDS.mddeclaring shadcn primitives as the ONLY component system; legacy classes deprecated..btn-*toButtonvariants..btn-primary/.btn-outline(0 usage) and other dead legacy selectors; resolve.text-smcollision; re-evaluate.detail-dialog!importants.Acceptance criteria
grep -rn "btn-primary\|btn-outline" web/src= 0.ui/button.Source: Titen UX audit 2026-09-20 (finding M2).