Responsive Styling Skill

Purpose

Generate mobile-first, responsive CSS/SCSS that works across all devices and follows accessibility best practices.

Philosophy

Responsive design is accessibility. Mobile-first is user-first.

Core Beliefs

1. Mobile First is Performance First: Start with constraints, enhance progressively
2. Accessibility is Non-Negotiable: WCAG AA compliance is the baseline, not a bonus
3. Exact Specifications Build Confidence: Calculate exact contrast ratios, don't estimate
4. Touch-Friendly by Default: 44px minimum targets prevent user frustration

Why Mobile-First Responsive Styling Matters