diff --git a/apps/extension/src/ui/atoms/OperationalStatusBadge.svelte b/apps/extension/src/ui/atoms/OperationalStatusBadge.svelte
index ca35b655..185ae1da 100644
--- a/apps/extension/src/ui/atoms/OperationalStatusBadge.svelte
+++ b/apps/extension/src/ui/atoms/OperationalStatusBadge.svelte
@@ -26,7 +26,7 @@
 </script>
 
 <span
-  class="inline-flex items-center whitespace-nowrap rounded-md border px-2 py-1 text-micro font-medium {toneClass}"
+  class="inline-flex items-center whitespace-nowrap rounded-md border px-2 py-1 text-caption font-medium {toneClass}"
 >
   {label}
 </span>
diff --git a/apps/extension/src/ui/molecules/OperationalEmptyState.svelte b/apps/extension/src/ui/molecules/OperationalEmptyState.svelte
index f3fb68b9..16ae9881 100644
--- a/apps/extension/src/ui/molecules/OperationalEmptyState.svelte
+++ b/apps/extension/src/ui/molecules/OperationalEmptyState.svelte
@@ -66,7 +66,9 @@
     </div>
     <div class="min-w-0 flex-1">
       <div class="flex flex-wrap items-center gap-2">
-        <p class="text-micro font-semibold uppercase tracking-[0.15em] text-text-muted">Décision</p>
+        <p class="text-caption font-semibold uppercase tracking-[0.15em] text-text-subtle">
+          Décision
+        </p>
         {#if statusLabel}
           <OperationalStatusBadge label={statusLabel} {severity} />
         {/if}
@@ -78,7 +80,7 @@
 
   {#if proofLabel && proofValue !== null}
     <div class="mt-4 rounded-lg border border-border-light bg-surface-white/70 px-3 py-2">
-      <p class="text-micro font-semibold uppercase tracking-[0.13em] text-text-muted">
+      <p class="text-caption font-semibold uppercase tracking-[0.13em] text-text-subtle">
         {proofLabel}
       </p>
       <p class="mt-1 font-mono text-body-lg font-semibold tabular-nums text-text-primary">
diff --git a/apps/extension/src/ui/molecules/OperationalStoryCard.svelte b/apps/extension/src/ui/molecules/OperationalStoryCard.svelte
index ef68cf06..73a7dcaf 100644
--- a/apps/extension/src/ui/molecules/OperationalStoryCard.svelte
+++ b/apps/extension/src/ui/molecules/OperationalStoryCard.svelte
@@ -136,7 +136,7 @@
       <div class="min-w-0 flex-1">
         <div class="flex flex-wrap items-center gap-2">
           {#if eyebrow}
-            <p class="text-micro font-semibold uppercase tracking-[0.15em] text-text-muted">
+            <p class="text-caption font-semibold uppercase tracking-[0.15em] text-text-subtle">
               {eyebrow}
             </p>
           {/if}
@@ -156,7 +156,7 @@
         {#each evidence as item, i (i)}
           <div class="rounded-lg border border-border-light bg-surface-white/70 px-3 py-2">
             <p
-              class="flex items-center gap-1 text-micro uppercase tracking-[0.13em] text-text-muted"
+              class="flex items-center gap-1 text-caption uppercase tracking-[0.13em] text-text-subtle"
             >
               {#if item.icon}
                 <Icon name={item.icon} size={10} />
diff --git a/apps/extension/src/ui/organisms/ApplicationPipelineSummary.svelte b/apps/extension/src/ui/organisms/ApplicationPipelineSummary.svelte
index 96418eee..1eb0377d 100644
--- a/apps/extension/src/ui/organisms/ApplicationPipelineSummary.svelte
+++ b/apps/extension/src/ui/organisms/ApplicationPipelineSummary.svelte
@@ -91,7 +91,7 @@
       >
         <div class="flex items-start justify-between gap-2">
           <div class="min-w-0">
-            <p class="text-micro font-medium uppercase tracking-[0.15em] text-text-muted">
+            <p class="text-caption font-medium uppercase tracking-[0.15em] text-text-subtle">
               {card.label}
             </p>
             <p class="mt-1 text-heading font-semibold tabular-nums text-text-primary">
@@ -112,17 +112,19 @@
             <Icon name={card.icon} size={13} />
           </span>
         </div>
-        <p class="mt-1 text-micro font-medium text-text-primary">{card.stateLabel}</p>
-        <p class="mt-0.5 min-h-7 text-micro leading-4 text-text-subtle">{card.hint}</p>
+        <p class="mt-1 text-caption font-medium text-text-primary">{card.stateLabel}</p>
+        <p class="mt-0.5 min-h-9 text-caption leading-[1.15rem] text-text-subtle">{card.hint}</p>
       </div>
     {/each}
   </div>
 
   <div class="rounded-xl border border-border-light bg-surface-white p-3">
     <div class="mb-2 flex items-center justify-between gap-3">
-      <p class="text-micro font-semibold uppercase tracking-[0.15em] text-text-muted">Avancement</p>
+      <p class="text-caption font-semibold uppercase tracking-[0.15em] text-text-subtle">
+        Avancement
+      </p>
       {#if summary.bottleneck}
-        <p class="flex items-center gap-1 text-micro text-text-subtle">
+        <p class="flex items-center gap-1 text-caption text-text-subtle">
           <Icon name="traffic-cone" size={11} />
           Goulot: {summary.bottleneck.label}
         </p>
diff --git a/apps/extension/src/ui/organisms/AvailabilityPanel.svelte b/apps/extension/src/ui/organisms/AvailabilityPanel.svelte
index 15ec1775..f9d51b52 100644
--- a/apps/extension/src/ui/organisms/AvailabilityPanel.svelte
+++ b/apps/extension/src/ui/organisms/AvailabilityPanel.svelte
@@ -187,7 +187,7 @@
             class="rounded-lg border border-border-light bg-surface-white px-3 py-2 text-body-lg text-text-primary focus:border-blueprint-blue focus:outline-none focus:ring-2 focus:ring-blueprint-blue/20"
           />
           {#if dateMissing}
-            <span class="text-micro text-status-red">La date est requise pour ce statut.</span>
+            <span class="text-caption text-status-red">La date est requise pour ce statut.</span>
           {/if}
         </label>
       {/if}
@@ -201,7 +201,7 @@
           placeholder="Précisions : rythme, remote, foursquare…"
           class="resize-y rounded-lg border border-border-light bg-surface-white px-3 py-2 text-body-lg leading-relaxed text-text-primary placeholder:text-text-muted focus:border-blueprint-blue focus:outline-none focus:ring-2 focus:ring-blueprint-blue/20"
         ></textarea>
-        <span class="text-right text-micro text-text-muted"
+        <span class="text-right text-caption text-text-subtle"
           >{noteLen}/{AVAILABILITY_NOTE_MAX_LENGTH}</span
         >
       </label>
diff --git a/apps/extension/src/ui/organisms/CopilotPanel.svelte b/apps/extension/src/ui/organisms/CopilotPanel.svelte
index 2c38e524..78265fdb 100644
--- a/apps/extension/src/ui/organisms/CopilotPanel.svelte
+++ b/apps/extension/src/ui/organisms/CopilotPanel.svelte
@@ -268,7 +268,7 @@
           Copilot Premium
         </h3>
         <span
-          class="rounded-md border border-blueprint-blue/20 bg-blueprint-blue/6 px-2 py-0.5 text-micro font-medium text-blueprint-blue"
+          class="rounded-md border border-blueprint-blue/20 bg-blueprint-blue/6 px-2 py-0.5 text-caption font-medium text-blueprint-blue"
         >
           Eve · distant
         </span>
@@ -285,7 +285,7 @@
     <div class="mt-4 rounded-lg border border-border-light bg-page-canvas p-3" role="status">
       <p class="text-meta font-medium text-text-primary">Issue de la demande de suppression</p>
       <p class="mt-1 text-caption leading-5 text-text-subtle">{deletionReceiptMessage()}</p>
-      <p class="mt-1 text-micro text-text-muted">Confirmé le {deletionReceiptDate()}.</p>
+      <p class="mt-1 text-caption text-text-subtle">Confirmé le {deletionReceiptDate()}.</p>
     </div>
   {/if}
 
@@ -299,12 +299,12 @@
           <p id="living-dossier-title" class="text-meta font-medium text-text-primary">
             Dossier vivant
           </p>
-          <p class="mt-1 text-micro leading-4 text-text-muted">
+          <p class="mt-1 text-caption leading-4 text-text-subtle">
             Contenus explicitement conservés · état serveur {store.dossier.state}
           </p>
         </div>
         {#if store.dossier.activeJob}
-          <span class="rounded-md bg-surface-white px-2 py-1 text-micro text-text-subtle">
+          <span class="rounded-md bg-surface-white px-2 py-1 text-caption text-text-subtle">
             Traitement actif · {store.dossier.activeJob.kind}
           </span>
         {/if}
@@ -314,7 +314,7 @@
         <article class="mt-3 rounded-lg border border-border-light bg-surface-white p-3">
           <div class="flex items-center justify-between gap-2">
             <p class="text-caption font-medium text-text-primary">Analyse approuvée</p>
-            <span class="text-micro text-text-muted">
+            <span class="text-caption text-text-subtle">
               {approvedAt(store.dossier.analysis.approvedAtMs)}
             </span>
           </div>
@@ -323,7 +323,7 @@
               {#each store.dossier.analysis.result.evidenceClaims as claim (`${claim.text}:${claim.evidenceIds.join(',')}`)}
                 <li class="text-caption leading-5 text-text-secondary">
                   {claim.text}
-                  <span class="block text-micro text-text-muted">
+                  <span class="block text-caption text-text-subtle">
                     Preuves : {claim.evidenceIds.join(' · ')}
                   </span>
                 </li>
@@ -353,7 +353,7 @@
 
       {#if store.dossier.approvedArtifacts.length > 0}
         <div class="mt-3 space-y-2">
-          <p class="text-micro font-medium uppercase tracking-[0.14em] text-text-muted">
+          <p class="text-caption font-medium uppercase tracking-[0.14em] text-text-subtle">
             Brouillons approuvés ({store.dossier.approvedArtifacts.length})
           </p>
           {#each store.dossier.approvedArtifacts as artifact (artifact.artifactId)}
@@ -362,7 +362,9 @@
                 <p class="text-caption font-medium text-text-primary">
                   {artifactLabels[artifact.kind]}
                 </p>
-                <span class="text-micro text-text-muted">{approvedAt(artifact.approvedAtMs)}</span>
+                <span class="text-caption text-text-subtle"
+                  >{approvedAt(artifact.approvedAtMs)}</span
+                >
               </div>
               <p class="mt-2 whitespace-pre-wrap text-meta leading-5 text-text-primary">
                 {artifact.draft}
@@ -445,7 +447,7 @@
       </summary>
       <div class="border-t border-border-light p-3">
         <fieldset>
-          <legend class="text-micro font-medium uppercase tracking-[0.14em] text-text-muted">
+          <legend class="text-caption font-medium uppercase tracking-[0.14em] text-text-subtle">
             Mission
           </legend>
           <div class="mt-2 grid grid-cols-2 gap-2">
@@ -464,7 +466,7 @@
         </fieldset>
 
         <fieldset class="mt-4">
-          <legend class="text-micro font-medium uppercase tracking-[0.14em] text-text-muted">
+          <legend class="text-caption font-medium uppercase tracking-[0.14em] text-text-subtle">
             Profil
           </legend>
           <div class="mt-2 grid grid-cols-2 gap-2">
@@ -484,7 +486,7 @@
 
         {#if store.availableEvidence.length > 0}
           <fieldset class="mt-4">
-            <legend class="text-micro font-medium uppercase tracking-[0.14em] text-text-muted">
+            <legend class="text-caption font-medium uppercase tracking-[0.14em] text-text-subtle">
               Expériences comme sources
             </legend>
             <div class="mt-2 space-y-2">
@@ -515,15 +517,15 @@
           />
           Je consens à transmettre uniquement les champs cochés à MissionPulse Copilot pour ce job.
         </label>
-        <p class="mt-2 text-micro leading-4 text-text-muted">
+        <p class="mt-2 text-caption leading-4 text-text-subtle">
           Coach TJM transmet aussi des repères de marché numériques agrégés : stacks rapprochées,
           volumes, fourchette, tendance et date. Aucun relevé de mission individuel n’est transmis.
         </p>
-        <p class="mt-1 text-micro leading-4 text-text-muted">
+        <p class="mt-1 text-caption leading-4 text-text-subtle">
           Pitch, message et résumé CV exigent au moins une expérience cochée afin que chaque segment
           généré cite sa source.
         </p>
-        <p class="mt-1 text-micro leading-4 text-text-muted">
+        <p class="mt-1 text-caption leading-4 text-text-subtle">
           Décocher limite le job courant. Les données déjà consenties restent dans le dossier
           Copilot jusqu’à sa suppression confirmée.
         </p>
@@ -542,7 +544,7 @@
             <Icon name={operation.icon} size={13} class="text-blueprint-blue" />
             {operation.label}
           </span>
-          <span class="text-micro text-text-muted">{operation.detail}</span>
+          <span class="text-caption text-text-subtle">{operation.detail}</span>
         </button>
       {/each}
     </div>
@@ -552,7 +554,7 @@
         <div class="flex items-center justify-between gap-3">
           <div>
             <p class="text-meta font-medium text-text-primary">{statusLabel(store.job.status)}</p>
-            <p class="mt-0.5 text-micro text-text-muted">
+            <p class="mt-0.5 text-caption text-text-subtle">
               {store.job.kind === 'analysis' ? 'Analyse incluse' : `${store.job.creditCost} crédit`}
             </p>
           </div>
@@ -571,7 +573,7 @@
 
         {#if store.job.tjmFacts}
           <div class="mt-3 rounded-lg border border-border-light bg-surface-white p-3">
-            <p class="text-micro font-medium uppercase tracking-[0.14em] text-text-muted">
+            <p class="text-caption font-medium uppercase tracking-[0.14em] text-text-subtle">
               Repères locaux déterministes
             </p>
             <div class="mt-2 grid grid-cols-2 gap-2 text-caption text-text-secondary">
@@ -580,7 +582,7 @@
               <span>Marché : {formatEur(store.job.tjmFacts.market.weightedAverage)}</span>
               <span>Confiance : {store.job.tjmFacts.confidence}</span>
             </div>
-            <p class="mt-2 text-micro text-text-muted">
+            <p class="mt-2 text-caption text-text-subtle">
               {store.job.tjmFacts.market.sampleCount} observation{store.job.tjmFacts.market
                 .sampleCount > 1
                 ? 's'
@@ -591,7 +593,7 @@
 
         {#if store.job.result && store.job.status === 'review'}
           <div class="mt-3 rounded-lg border border-border-light bg-surface-white p-3">
-            <p class="text-micro font-medium uppercase tracking-[0.14em] text-blueprint-blue">
+            <p class="text-caption font-medium uppercase tracking-[0.14em] text-blueprint-blue">
               Proposition IA non vérifiée
             </p>
             {#if groundedDraftText}
@@ -601,7 +603,7 @@
                   {#each groundedDraftSegments as segment, index (`${index}:${segment.text}`)}
                     <li class="text-meta leading-5 text-text-primary">
                       <span class="whitespace-pre-wrap">{segment.text}</span>
-                      <span class="mt-1 block space-y-1 text-micro leading-4 text-text-muted">
+                      <span class="mt-1 block space-y-1 text-caption leading-4 text-text-subtle">
                         {#each segment.sourceRefs as sourceRef (`${sourceRef.kind}:${sourceRef.id}`)}
                           <span class="block">
                             {sourceRefLabel(sourceRef)} — « {sourceRefExcerpt(sourceRef)} »
@@ -625,7 +627,7 @@
                 role="alert"
               >
                 <p class="text-caption font-medium text-text-primary">Proposition non vérifiée</p>
-                <p class="mt-1 text-micro leading-4 text-text-subtle">
+                <p class="mt-1 text-caption leading-4 text-text-subtle">
                   Les segments ne disposent pas tous de sources consenties valides. Le contenu est
                   masqué et ne peut être ni copié ni conservé.
                 </p>
@@ -640,7 +642,7 @@
                   {#each supportedEvidenceClaims as claim (claim.text)}
                     <li class="text-caption leading-5 text-text-secondary">
                       <span>{claim.text}</span>
-                      <span class="block text-micro text-text-muted">
+                      <span class="block text-caption text-text-subtle">
                         {claim.evidenceIds
                           .map((id) => `${evidenceLabel(id)} — « ${evidenceExcerpt(id)} »`)
                           .join(' · ')}
@@ -743,7 +745,7 @@
       {:else}
         <button
           type="button"
-          class="text-caption font-medium text-text-muted hover:text-status-red"
+          class="text-caption font-medium text-text-subtle hover:text-status-red"
           onclick={() => (deleteConfirmation = true)}>Supprimer le dossier Copilot</button
         >
       {/if}
diff --git a/apps/extension/src/ui/pages/ApplicationsPage.svelte b/apps/extension/src/ui/pages/ApplicationsPage.svelte
index bde7b422..5ec08874 100644
--- a/apps/extension/src/ui/pages/ApplicationsPage.svelte
+++ b/apps/extension/src/ui/pages/ApplicationsPage.svelte
@@ -519,14 +519,14 @@
 <div class="flex h-full flex-col overflow-y-auto px-4 pb-5 pt-4">
   <AvailabilityPanel store={availabilityStore} platforms={availabilityPlatforms} />
 
-  <section class="section-card-strong rounded-2xl px-5 py-4">
+  <section class="section-card-strong mt-5 rounded-2xl px-5 py-5">
     <div class="flex items-start justify-between gap-4">
       <div>
         <p class="eyebrow text-blueprint-blue">Pipeline</p>
         <div class="mt-1 flex flex-wrap items-center gap-2">
           <h1 class="text-subheading font-semibold text-text-primary">Candidatures</h1>
           <span
-            class="rounded-md border border-border-light bg-page-canvas px-2 py-1 text-micro font-medium text-text-subtle"
+            class="rounded-md border border-border-light bg-page-canvas px-2 py-1 text-caption font-medium text-text-subtle"
           >
             Local uniquement
           </span>
@@ -534,7 +534,7 @@
         <p class="mt-1 text-meta leading-5 text-text-subtle">
           Suivre les missions qualifiées, préparer les messages et faire avancer chaque dossier.
         </p>
-        <p class="mt-2 text-caption leading-5 text-text-muted">
+        <p class="mt-2 text-caption leading-5 text-text-subtle">
           Ces statuts restent dans l'extension tant que le compte MissionPulse n'est pas connecté.
         </p>
       </div>
@@ -544,7 +544,7 @@
         <Icon name="mail" size={18} class="text-blueprint-blue" />
       </div>
     </div>
-    <div class="mt-4">
+    <div class="mt-5">
       <OperationalStoryCard
         eyebrow="Priorité"
         variant="compact"
@@ -559,7 +559,7 @@
       />
     </div>
     {#if isOffline}
-      <div class="mt-3">
+      <div class="mt-4">
         <OfflineNotice
           description="Le pipeline local reste modifiable. Les ouvertures de mission et générations de messages peuvent attendre le retour réseau."
           action="Prochaine action : mettre à jour les relances dues et préparer les prochaines actions."
@@ -568,13 +568,10 @@
     {/if}
 
     {#if !isLoading}
-      <section
-        class="mt-3 rounded-xl border border-blueprint-blue/15 bg-surface-white p-3"
-        aria-label="Dossier recommandé"
-      >
+      <section class="mt-5 rounded-xl bg-blueprint-blue/5 p-4" aria-label="Dossier recommandé">
         <div class="flex items-start justify-between gap-3">
           <div class="min-w-0">
-            <p class="text-micro font-semibold uppercase tracking-[0.15em] text-blueprint-blue">
+            <p class="text-caption font-semibold uppercase tracking-[0.15em] text-blueprint-blue">
               Dossier recommandé
             </p>
             {#if recommendedTrackedMission}
@@ -586,12 +583,12 @@
               </p>
               <div class="mt-2 flex flex-wrap items-center gap-2">
                 <span
-                  class="rounded-md bg-blueprint-blue/8 px-2 py-0.5 text-micro font-medium text-blueprint-blue"
+                  class="rounded-md bg-blueprint-blue/8 px-2 py-0.5 text-caption font-medium text-blueprint-blue"
                 >
                   {STATUS_LABELS[recommendedTrackedMission.record.currentStatus]}
                 </span>
                 {#if formatNextAction(recommendedTrackedMission.record.nextActionAt)}
-                  <span class="text-micro text-text-muted">
+                  <span class="text-caption text-text-subtle">
                     Action {formatNextAction(recommendedTrackedMission.record.nextActionAt)}
                   </span>
                 {/if}
@@ -620,10 +617,10 @@
   </section>
 
   {#if isLoading}
-    <div class="mt-4 section-card rounded-xl p-5" aria-busy="true" role="status" aria-live="polite">
+    <div class="mt-5 section-card rounded-xl p-5" aria-busy="true" role="status" aria-live="polite">
       <div class="flex items-start justify-between gap-3">
         <div>
-          <p class="text-micro font-semibold uppercase tracking-[0.15em] text-text-muted">
+          <p class="text-caption font-semibold uppercase tracking-[0.15em] text-text-subtle">
             Chargement candidatures
           </p>
           <h3 class="mt-1 text-body-lg font-semibold text-text-primary">
@@ -661,7 +658,7 @@
       </div>
     </div>
   {:else if loadError}
-    <div class="mt-4">
+    <div class="mt-5">
       <OperationalEmptyState
         title="Le pipeline candidatures ne peut pas être chargé"
         description="Les statuts locaux sont indisponibles pour le moment. Réessayez avant de modifier un dossier ou de générer un kit."
@@ -678,7 +675,7 @@
       />
     </div>
   {:else if missions.length === 0}
-    <div class="mt-4">
+    <div class="mt-5">
       <OperationalEmptyState
         title="Aucune mission ne peut encore devenir candidature"
         description="Le pipeline démarre quand une mission existe dans le feed. Lancez ou consultez le radar, puis revenez préparer un dossier."
@@ -693,13 +690,13 @@
       />
     </div>
   {:else}
-    <div class="mt-4 grid gap-4 lg:grid-cols-[0.85fr_1.15fr]">
+    <div class="mt-5 grid gap-4 lg:grid-cols-[0.85fr_1.15fr]">
       <section class="section-card rounded-xl p-3">
         <div class="flex items-center justify-between px-2 pb-2">
           <h3 class="text-body-lg font-medium text-text-primary">Missions</h3>
           <span class="text-meta text-text-muted">{trackedMissions.length} suivies</span>
         </div>
-        <div class="max-h-[32rem] space-y-2 overflow-y-auto pr-1">
+        <div class="space-y-2 pr-1 lg:max-h-[32rem] lg:overflow-y-auto">
           {#each trackedMissions.length > 0 ? trackedMissions : missions
                 .slice(0, 20)
                 .map( (mission) => ({ mission, record: tracking.getTrackingForMission(mission.id) ?? null }) ) as item (item.mission.id)}
@@ -725,11 +722,11 @@
               </div>
               <div class="mt-2 flex items-center justify-between gap-2">
                 <span
-                  class="rounded-md bg-surface-white px-2 py-0.5 text-micro font-medium text-text-subtle"
+                  class="rounded-md bg-surface-white px-2 py-0.5 text-caption font-medium text-text-subtle"
                 >
                   {STATUS_LABELS[item.record?.currentStatus ?? 'detected']}
                 </span>
-                <span class="text-micro text-text-muted">
+                <span class="text-caption text-text-subtle">
                   {formatNextAction(item.record?.nextActionAt) ??
                     formatDate(getLastActivity(item.record))}
                 </span>
@@ -744,7 +741,7 @@
           <div class="section-card rounded-xl p-5">
             <div class="flex items-start justify-between gap-4">
               <div class="min-w-0">
-                <p class="text-micro font-medium uppercase tracking-[0.15em] text-blueprint-blue">
+                <p class="text-caption font-medium uppercase tracking-[0.15em] text-blueprint-blue">
                   {STATUS_LABELS[selectedStatus]}
                 </p>
                 <h3 class="mt-1 text-subheading font-semibold text-text-primary">
@@ -793,7 +790,7 @@
               {:else}
                 <label
                   for="application-next-action"
-                  class="text-micro font-medium uppercase tracking-[0.15em] text-text-muted"
+                  class="text-caption font-medium uppercase tracking-[0.15em] text-text-subtle"
                 >
                   Prochaine action
                 </label>
@@ -831,10 +828,10 @@
                 aria-label="Historique des décisions"
               >
                 <div class="flex items-center justify-between gap-3">
-                  <p class="text-micro font-medium uppercase tracking-[0.15em] text-text-muted">
+                  <p class="text-caption font-medium uppercase tracking-[0.15em] text-text-subtle">
                     Historique des décisions
                   </p>
-                  <span class="text-micro text-text-muted">
+                  <span class="text-caption text-text-subtle">
                     {selectedTracking?.history.length ?? 0} événement{(selectedTracking?.history
                       .length ?? 0) > 1
                       ? 's'