feat: Add collapsible sections and mobile grid layout

- Convert Active Sessions and Trusted Devices to collapsible Accordion components
- Display count badge in collapsed state
- Show loading state in accordion header
- Implement 2-card grid layout on mobile (xs=6)
- Responsive card sizing and spacing
- Centered layout on mobile, horizontal on desktop
- Hide full birthdate on mobile, show age only

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

maternal-web/app/settings/page.tsx

@@ -266,10 +266,9 @@ export default function SettingsPage() {
         initial={{ opacity: 0, y: 20 }}
         animate={{ opacity: 1, y: 0 }}
         transition={{ duration: 0.4, delay: 0.3 }}
+        style={{ marginBottom: '24px' }}
       >
-        <Box sx={{ mb: 3 }}>
-          <SessionsManagement />
-        </Box>
+        <SessionsManagement />
       </motion.div>
 
       {/* Device Trust Management */}
@@ -277,10 +276,9 @@ export default function SettingsPage() {
         initial={{ opacity: 0, y: 20 }}
         animate={{ opacity: 1, y: 0 }}
         transition={{ duration: 0.4, delay: 0.33 }}
+        style={{ marginBottom: '24px' }}
       >
-        <Box sx={{ mb: 3 }}>
-          <DeviceTrustManagement />
-        </Box>
+        <DeviceTrustManagement />
       </motion.div>
 
       {/* Biometric Authentication */}