| Iterative polish | Run the same polish prompt 10+ times | Small improvements compound dramatically |
| Desktop/mobile split | Optimize each modality independently | Prevents compromises that hurt both |
| Glassmorphism | backdrop-blur-xl + bg-white/70 + border | Functional depth with legibility |
| Neumorphism | Dual-direction box shadows | Best in light mode; use borders for a11y |
| Bento grid | CSS Grid with rounded-3xl cells | Hero cell spans multiple columns/rows |
| WCAG 2.2 AA | Contrast ratios + target sizes + focus visible | 4.5:1 text, 3:1 UI, 24x24px targets |
| Reduced motion | prefers-reduced-motion: reduce | Disable animations for motion-sensitive users |
| Semantic HTML | Landmarks + heading hierarchy + native elements | Use <button> not <div role="button"> |
| Inclusive design | Multiple input methods + error forgiveness | Support keyboard, voice, and touch equally |
| Typography hierarchy | Consistent scale with clear levels | Font size, weight, and spacing rhythm |
| Spacing rhythm | Consistent padding and margin scale | Use design token multiples (4px, 8px, 16px) |
| Hover/focus states | Visible feedback on all interactive elements | Keyboard users need visible focus indicators |
| Animation/transitions | ease-out enter, ease-in exit, 100-300ms | Prefer transform/opacity for GPU compositing |
| Micro-interactions | Button press, toggle, focus, success/error | Always respect prefers-reduced-motion |
