Supascribe

0-A · Design system, palette et typographie

Crée une nouvelle app appelée « NewsletterBoost Africa ». Configure le design system global : fond principal #1A1A2E (nuit encre), accent primaire #F5A623 (or sahélien), succès #2ECC71 (vert savane), surface carte #F7F3ED (écru papier), alerte #E74C3C (rouge latérite). Polices Google : DM Sans pour tout le corps et l'UI, Fraunces (italic bold) pour les titres éditoriaux. Applique un motif dot-grid géométrique fin à 4% d'opacité sur tous les fonds sombres #1A1A2E. Animations globales : slide-up 280ms ease-out sur les cartes stats, compteurs animés count-up sur les métriques chiffrées, skeleton loader pulsé sur les tableaux de données, toast notifications slide-in depuis la droite. Crée les composants réutilisables : Button primaire (#F5A623, texte #1A1A2E, bold DM Sans), Button danger (#E74C3C, texte blanc), Badge succès (#2ECC71), Badge alerte (#E74C3C), Card (fond #F7F3ED, border-radius 12px, shadow légère), StatCard (Card + titre Fraunces + chiffre animé count-up). Crée le routing avec 10 routes nommées : /onboarding, /dashboard, /widgets, /pages, /analytics, /abonnes, /monetisation, /integrations, /notifications, /admin. Barre de navigation latérale sombre (#1A1A2E) avec icônes et labels en DM Sans, accent actif #F5A623. Ça marche si… la nav affiche 10 entrées, les couleurs correspondent aux hex, DM Sans et Fraunces sont visibles, et les toasts apparaissent depuis la droite.