1---
2tagline: "Five-dimension technical quality check with P0 to P3 severity."
3---
4
5<div class="docs-viz-hero">
6 <div class="docs-viz-report">
7 <div class="docs-viz-report-head">
8 <div>
9 <div class="docs-viz-report-title">/impeccable audit the checkout flow</div>
10 <div class="docs-viz-report-target">src/checkout/**</div>
11 </div>
12 <div class="docs-viz-report-score">
13 <span class="docs-viz-report-score-num">2.6</span>
14 <span class="docs-viz-report-score-out">/ 4</span>
15 </div>
16 </div>
17 <div class="docs-viz-report-dims">
18 <div class="docs-viz-report-dim">
19 <span class="docs-viz-report-dim-name">Accessibility</span>
20 <span class="docs-viz-report-dim-bar"><span class="docs-viz-report-dim-fill docs-viz-report-dim-fill--fail" style="width:50%"></span></span>
21 <span class="docs-viz-report-dim-score">2 / 4</span>
22 </div>
23 <div class="docs-viz-report-dim">
24 <span class="docs-viz-report-dim-name">Performance</span>
25 <span class="docs-viz-report-dim-bar"><span class="docs-viz-report-dim-fill" style="width:75%"></span></span>
26 <span class="docs-viz-report-dim-score">3 / 4</span>
27 </div>
28 <div class="docs-viz-report-dim">
29 <span class="docs-viz-report-dim-name">Theming</span>
30 <span class="docs-viz-report-dim-bar"><span class="docs-viz-report-dim-fill docs-viz-report-dim-fill--warn" style="width:62%"></span></span>
31 <span class="docs-viz-report-dim-score">2.5 / 4</span>
32 </div>
33 <div class="docs-viz-report-dim">
34 <span class="docs-viz-report-dim-name">Responsive</span>
35 <span class="docs-viz-report-dim-bar"><span class="docs-viz-report-dim-fill" style="width:75%"></span></span>
36 <span class="docs-viz-report-dim-score">3 / 4</span>
37 </div>
38 <div class="docs-viz-report-dim">
39 <span class="docs-viz-report-dim-name">Anti-patterns</span>
40 <span class="docs-viz-report-dim-bar"><span class="docs-viz-report-dim-fill docs-viz-report-dim-fill--warn" style="width:70%"></span></span>
41 <span class="docs-viz-report-dim-score">2.8 / 4</span>
42 </div>
43 </div>
44 <div class="docs-viz-report-issues">
45 <span class="docs-viz-report-sev docs-viz-report-sev--p0">P0<span class="docs-viz-report-sev-n">2</span></span>
46 <span class="docs-viz-report-sev docs-viz-report-sev--p1">P1<span class="docs-viz-report-sev-n">5</span></span>
47 <span class="docs-viz-report-sev docs-viz-report-sev--p2">P2<span class="docs-viz-report-sev-n">8</span></span>
48 <span class="docs-viz-report-sev docs-viz-report-sev--p3">P3<span class="docs-viz-report-sev-n">14</span></span>
49 </div>
50 </div>
51 <p class="docs-viz-caption">Five dimensions scored 0 to 4, each finding tagged P0 (blocks release) to P3 (polish). Audit documents; it doesn't fix. Route the findings into <code>/impeccable harden</code>, <code>/impeccable polish</code>, or <code>/impeccable optimize</code>.</p>
52</div>
53
54## When to use it
55
56`/impeccable audit` is the technical counterpart to `/impeccable critique`. Where `/impeccable critique` asks "does this feel right", `/impeccable audit` asks "does this hold up". It runs accessibility, performance, theming, responsive design, and anti-pattern checks against the implementation, scores each dimension 0 to 4, and produces a plan with P0 to P3 severity ratings.
57
58Use it before shipping, during a quality sprint, or whenever a tech lead says "we should really look at accessibility".
59
60## How it works
61
62The skill scans your code across five dimensions:
63
641. **Accessibility**: WCAG contrast, ARIA, keyboard nav, semantic HTML, form labels.
652. **Performance**: layout thrashing, expensive animations, missing lazy loading, bundle weight.
663. **Theming**: hard-coded colors, dark mode coverage, token consistency.
674. **Responsive**: breakpoint behavior, touch targets, mobile viewport handling.
685. **Anti-patterns**: the same deterministic 25 checks the detector runs.
69
70Each dimension gets a 0 to 4 score. Each finding gets a severity: P0 blocks the release, P1 should fix this sprint, P2 is next cycle, P3 is polish. You get back a single document you can paste into a ticket tracker.
71
72Audit does not fix anything. It documents. Route the findings to `/impeccable polish`, `/impeccable harden`, or `/impeccable optimize` depending on the category.
73
74## Try it
75
76```
77/impeccable audit the checkout flow
78```
79
80Expected output:
81
82```
83Accessibility: 2/4 (partial)
84 P0: Missing form labels on 4 inputs
85 P1: Contrast 3.1:1 on disabled button state
86 P2: No visible focus indicator on custom dropdown
87
88Performance: 3/4 (good)
89 P1: Hero image not lazy-loaded (340KB)
90 ...
91```
92
93Hand the P0s to `/impeccable harden`, the theming and typography P1s to `/impeccable typeset` and `/impeccable polish`, the rest to `/impeccable polish`.
94
95## Pitfalls
96
97- **Confusing it with `/impeccable critique`.** Audit is implementation quality. Critique is design quality. Run both for a full picture.
98- **Fixing P3s before P0s.** The severity scale exists for a reason. Start at the top.
99- **Skipping the dimensions you think are fine.** Theming and responsive are the ones most people assume are fine until they are not.