diff --git a/.playground/pages/composant/date/datetime.vue b/.playground/pages/composant/date/datetime.vue
index eeb468e..f7d0938 100644
--- a/.playground/pages/composant/date/datetime.vue
+++ b/.playground/pages/composant/date/datetime.vue
@@ -3,8 +3,8 @@
     <h1 class="text-2xl font-bold">MalioDateTime</h1>
 
     <div class="flex flex-wrap items-start gap-10">
-      <div class="w-[396px] space-y-3">
-        <h2 class="font-semibold">Simple</h2>
+      <div class="w-[480px] space-y-3">
+        <h2 class="font-semibold">Large (480px)</h2>
         <MalioDateTime
           v-model="value"
           label="Date et heure du rendez-vous"
@@ -13,27 +13,41 @@
         <div class="rounded border p-3 text-sm">
           <p>Valeur (ISO naïf) : <code>{{ value ?? 'null' }}</code></p>
         </div>
-        <button
-          type="button"
-          class="rounded border px-3 py-1.5"
-          @click="value = null"
-        >
-          Réinitialiser
-        </button>
+        <div class="flex gap-2">
+          <button
+            type="button"
+            class="rounded bg-m-primary px-3 py-1.5 text-white"
+            @click="value = '2026-12-25T09:30:00'"
+          >
+            Forcer le 25/12/2026 09:30
+          </button>
+          <button
+            type="button"
+            class="rounded border px-3 py-1.5"
+            @click="value = null"
+          >
+            Réinitialiser
+          </button>
+        </div>
       </div>
 
       <div class="w-[396px] space-y-3">
-        <h2 class="font-semibold">Valeur initiale + bornes</h2>
+        <h2 class="font-semibold">ERP (396px)</h2>
+        <MalioDateTime
+          v-model="erpValue"
+          label="Date et heure du rendez-vous"
+          hint="Largeur cible ERP"
+        />
+        <div class="rounded border p-3 text-sm">
+          <p>Valeur (ISO naïf) : <code>{{ erpValue ?? 'null' }}</code></p>
+        </div>
         <MalioDateTime
           v-model="bounded"
-          label="Créneau"
+          label="Créneau borné"
           :min="todayIso"
           :max="maxIso"
           hint="Entre aujourd'hui et +30 jours"
         />
-        <div class="rounded border p-3 text-sm">
-          <p>Valeur (ISO naïf) : <code>{{ bounded ?? 'null' }}</code></p>
-        </div>
       </div>
     </div>
   </div>
@@ -49,5 +63,6 @@ const todayIso = toIso(now)
 const maxIso = toIso(new Date(now.getTime() + 30 * 86400000))
 
 const value = ref<string | null>(null)
+const erpValue = ref<string | null>(null)
 const bounded = ref<string | null>('2026-05-20T14:30:00')
 </script>