responsive-design

name	responsive-design
description	Mobile-first and fluid layout best practices.

Responsive Design Skill

Context

FinanzApp must look great on all devices, from mobile phones to high-res monitors.

Guidelines

1. Mobile-First: Always start with mobile styles and add enhancements via @media queries for larger screens.
2. Fluid Units: Use relative units like rem, em, vw, vh, and % instead of fixed px.
3. Grid & Flexbox: Use CSS Grid for overall layout and Flexbox for component-level alignment.
4. Breakpoints: Use standard, consistent breakpoints across the application.
5. Touch Targets: Ensure buttons and links are large enough for touch interaction (min 44x44px).