style(mail): fond crème edge-to-edge (au lieu d'un container blanc)

Avant : body crème + container blanc avec border-radius + bordure → effet
"card flottante" qui laissait des marges crème en haut/bas et un fond
blanc pour le contenu. Sur iPhone Mail, cette structure créait un gap
mal rendu entre la frame Mail.app et le header rubis-deep.

Maintenant :
- bodyStyle.padding 24px 0 → 0 (rubis-deep colle au haut de la zone mail)
- containerStyle background blanc → crème (toute la zone email est crème,
  cohérente avec la palette)
- containerStyle borderRadius + border supprimés (edge-to-edge)
- invoiceCardStyle (checkin) + summaryCardStyle (relance) passent en
  blanc pour se détacher du nouveau fond crème
- Dark mode CSS : .rubis-container override aussi mis à crème

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

apps/api/app/mails/_layout.tsx

@@ -68,7 +68,7 @@ export function EmailLayout({
               }
               [data-ogsc] .rubis-container,
               [data-ogsb] .rubis-container {
-                background-color: ${BRAND.white} !important;
+                background-color: ${BRAND.cream} !important;
               }
               [data-ogsc] .rubis-header,
               [data-ogsb] .rubis-header {
@@ -134,14 +134,15 @@ const bodyStyle: React.CSSProperties = {
   backgroundColor: BRAND.cream,
   fontFamily: BRAND.fontBody,
   margin: 0,
-  padding: `${sp.xl} 0`,
+  padding: 0,
   color: BRAND.ink,
 }
 
 const containerStyle: React.CSSProperties = {
-  backgroundColor: BRAND.white,
-  borderRadius: BRAND.radiusCard,
-  border: `1px solid ${BRAND.line}`,
+  // Fond crème pour que toute la zone du mail soit dans la palette
+  // (au lieu d'un container blanc flottant sur cream). Le header
+  // rubis-deep et le footer cream2 gardent leur couleur dédiée.
+  backgroundColor: BRAND.cream,
   margin: '0 auto',
   maxWidth: '560px',
   overflow: 'hidden',

apps/api/app/mails/checkin_email.tsx

@@ -125,7 +125,9 @@ const leadStyle: React.CSSProperties = {
 }
 
 const invoiceCardStyle: React.CSSProperties = {
-  backgroundColor: BRAND.cream,
+  // Blanc sur fond crème pour détacher la card visuellement (avant
+  // c'était crème sur container blanc — maintenant le container est crème).
+  backgroundColor: BRAND.white,
   border: `1px solid ${BRAND.line}`,
   borderRadius: BRAND.radiusCard,
   padding: `${sp.lg} ${sp.xl}`,

apps/api/app/mails/relance_email.tsx

@@ -108,7 +108,9 @@ const bodyTextStyle: React.CSSProperties = {
 }
 
 const summaryCardStyle: React.CSSProperties = {
-  backgroundColor: BRAND.cream,
+  // Blanc sur fond crème pour détacher la card visuellement (le container
+  // du layout est désormais crème, pas blanc).
+  backgroundColor: BRAND.white,
   border: `1px solid ${BRAND.line}`,
   borderRadius: BRAND.radiusCard,
   padding: `${sp.md} ${sp.lg}`,