feat: complete 20-screen onboarding flow

Full quiz flow s01-s20: splash, intro, value prop, social proof,
name/skin-type/age/concerns/goal quiz with insights, analysing loader,
result with skin score, AM/PM routines, ingredient science, signup, welcome.

Duolingo-style design: flat cards, pressable SButton (Stack trick),
4px progress bar, mascot moods (wave/think/analyze/celebrate),
confetti on result+welcome, personalized content throughout.

lib/screens/onboarding/s10_concern_insight.dart

@@ -0,0 +1,131 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_animate/flutter_animate.dart';
+import '../../theme.dart';
+import '../../widgets/mascot.dart';
+import '../../widgets/s_button.dart';
+import '../../model/quiz_state.dart';
+import '../../router.dart';
+import 's11_goal.dart';
+
+class ConcernInsightScreen extends StatelessWidget {
+  final QuizState state;
+  const ConcernInsightScreen({super.key, required this.state});
+
+  @override
+  Widget build(BuildContext context) {
+    final first = state.concerns.isNotEmpty ? state.concerns.first : 'skin concerns';
+    final emoji = _emoji(first);
+    final tip = _tip(first);
+
+    return Scaffold(
+      backgroundColor: SColors.bgSurface,
+      body: SafeArea(
+        child: Column(
+          children: [
+            Expanded(
+              flex: 42,
+              child: Stack(
+                alignment: Alignment.center,
+                children: [
+                  Mascot(mood: MascotMood.analyze, size: 160)
+                      .animate().fadeIn(duration: 500.ms).slideY(begin: 0.05, end: 0),
+                  Positioned(
+                    bottom: 20,
+                    right: 40,
+                    child: Container(
+                      padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 6),
+                      decoration: BoxDecoration(
+                        color: SColors.primaryLight,
+                        borderRadius: BorderRadius.circular(20),
+                        border: Border.all(color: SColors.borderLight),
+                      ),
+                      child: Text(emoji, style: const TextStyle(fontSize: 22)),
+                    ).animate().fadeIn(duration: 400.ms, delay: 700.ms)
+                     .scaleXY(begin: 0.6, end: 1.0, duration: 350.ms, curve: Curves.elasticOut),
+                  ),
+                ],
+              ),
+            ),
+            Expanded(
+              flex: 58,
+              child: Padding(
+                padding: const EdgeInsets.symmetric(horizontal: 24),
+                child: Column(
+                  crossAxisAlignment: CrossAxisAlignment.start,
+                  children: [
+                    const SizedBox(height: 8),
+                    _badge()
+                        .animate().fadeIn(duration: 300.ms, delay: 100.ms),
+                    const SizedBox(height: 14),
+                    Text('I see you picked\n"$first" 👀', style: SText.headline2(SColors.textHead))
+                        .animate().fadeIn(duration: 400.ms, delay: 180.ms)
+                        .slideY(begin: 0.05, end: 0),
+                    const SizedBox(height: 10),
+                    Text(tip, style: SText.subtitle(SColors.textSub))
+                        .animate().fadeIn(duration: 400.ms, delay: 260.ms),
+                    const SizedBox(height: 16),
+                    _concernBubbles()
+                        .animate().fadeIn(duration: 400.ms, delay: 350.ms),
+                    const Spacer(),
+                    SButton(
+                      label: "WE'VE GOT YOU",
+                      onTap: () => Navigator.of(context).push(slideRoute(GoalScreen(state: state))),
+                    ).animate().fadeIn(duration: 400.ms, delay: 500.ms),
+                    const SizedBox(height: 20),
+                  ],
+                ),
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+
+  String _emoji(String concern) => switch (concern) {
+    'Breakouts' => '🫧',
+    'Dullness' => '🌤️',
+    'Dryness' => '💧',
+    'Fine lines' => '⏳',
+    'Dark spots' => '🎯',
+    'Redness' => '🌹',
+    _ => '🔍',
+  };
+
+  String _tip(String concern) => switch (concern) {
+    'Breakouts' => '80% of breakouts are triggered by products you\'re already using. We\'ll audit your routine and clear the way.',
+    'Dullness' => 'Dullness is usually dead skin buildup. The right exfoliation schedule can reveal your glow in just 2 weeks.',
+    'Dryness' => 'True dryness means your barrier is compromised. We\'ll focus on healing and long-lasting moisture — not just drinking water.',
+    'Fine lines' => 'Starting prevention at any age works. Retinol, SPF, and peptides are your long-game trio.',
+    'Dark spots' => 'Vitamin C in the morning + SPF every day is the combo that fades spots fastest. We\'ll build around that.',
+    'Redness' => 'Redness often signals a disrupted barrier. Gentle, fragrance-free products and niacinamide will calm things down.',
+    _ => 'We\'ll address each concern with targeted ingredients and a smart routine.',
+  };
+
+  Widget _badge() {
+    return Container(
+      padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
+      decoration: BoxDecoration(
+        color: SColors.primaryLight,
+        borderRadius: BorderRadius.circular(20),
+      ),
+      child: Text('Shaynee insight', style: SText.caption(SColors.primary).copyWith(fontWeight: FontWeight.w700)),
+    );
+  }
+
+  Widget _concernBubbles() {
+    return Wrap(
+      spacing: 8,
+      runSpacing: 8,
+      children: state.concerns.map((c) => Container(
+        padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
+        decoration: BoxDecoration(
+          color: SColors.bgSurface,
+          borderRadius: BorderRadius.circular(20),
+          border: Border.all(color: SColors.primary.withAlpha(80)),
+        ),
+        child: Text(c, style: SText.caption(SColors.primary).copyWith(fontWeight: FontWeight.w600)),
+      )).toList(),
+    );
+  }
+}