diff --git a/module/actor.js b/module/actor.js
index 3c5e1014..66a9dedb 100644
--- a/module/actor.js
+++ b/module/actor.js
@@ -2315,15 +2315,17 @@ export class RdDActor extends Actor {
   /* -------------------------------------------- */
   async _rollArt(artData, selected, oeuvre, callBackResult = r => this._resultArt(r)) {
     const actorData = Misc.data(this);
-    mergeObject(artData, {
-      oeuvre: oeuvre,
-      art: oeuvre.type,
-      competence: Misc.data(this.getCompetence(oeuvre.data.competence ?? artData.art)),
-      diffLibre: - (oeuvre.data.niveau ?? 0),
-      diffConditions: 0,
-      use: { libre: false, conditions: true },
-      selectedCarac: duplicate(actorData.data.carac[selected])
-    });
+    mergeObject(artData,
+      {
+        oeuvre: oeuvre,
+        art: oeuvre.type,
+        competence: duplicate(Misc.data(this.getCompetence(oeuvre.data.competence ?? artData.art))),
+        diffLibre: - (oeuvre.data.niveau ?? 0),
+        diffConditions: 0,
+        use: { libre: false, conditions: true },
+        selectedCarac: duplicate(actorData.data.carac[selected])
+      },
+      { overwrite: false });
     artData.competence.data.defaut_carac = selected;
     if (!artData.forceCarac) {
       artData.forceCarac = {};
@@ -2366,13 +2368,13 @@ export class RdDActor extends Actor {
     const actorData = Misc.data(this);
     const artData = { art: 'danse', verbe: 'Danser', forceCarac: {} };
     const oeuvre = duplicate(this.getItemOfType(id, artData.art));
-    const selectedCarac = this._getCaracDanse(oeuvre);
     if (oeuvre.data.agilite) {
       artData.forceCarac['agilite'] = duplicate(actorData.data.carac.agilite);
     }
     if (oeuvre.data.apparence) {
       artData.forceCarac['apparence'] = duplicate(actorData.data.carac.apparence);
     }
+    const selectedCarac = this._getCaracDanse(oeuvre);
     await this._rollArt(artData, selectedCarac, oeuvre);
   }
 
@@ -2434,12 +2436,21 @@ export class RdDActor extends Actor {
 
   /* -------------------------------------------- */
   async rollJeu(id) {
+    const actorData = Misc.data(this);
+    const oeuvre = Misc.data(this.getJeu(id));
+
+    const listCarac = oeuvre.data.caraccomp.toLowerCase().split(/[.,:\/-]/).map(it => it.trim());
+    const carac = listCarac.length > 0 ? listCarac[0] : 'chance'
     const artData = {
       art: 'jeu', verbe: 'Jeu',
       use: { libre: true, conditions: true, },
+      competence: duplicate(Misc.data(this.getCompetence('jeu'))),
+      forceCarac: {}
     };
-    const oeuvre = duplicate(this.getJeu(id));
-    await this._rollArt(artData, oeuvre.data?.caraccomp.toLowerCase() ?? 'chance', oeuvre);
+    listCarac.forEach(c => artData.forceCarac[c] = actorData.data.carac[c]);
+    artData.competence.data.niveauReel = artData.competence.data.niveau;
+    artData.competence.data.niveau = Math.max(artData.competence.data.niveau, oeuvre.data.base);
+    await this._rollArt(artData, carac, oeuvre);
   }
 
   async rollOeuvre(id) {
@@ -2597,9 +2608,8 @@ export class RdDActor extends Actor {
       let xpComp = 0;
       if (competence) {
         xpComp = xp - xpCarac;
-        competence = duplicate(competence);
-        competence.data.xp = Misc.toInt(competence.data.xp) + xpComp;
-        await this.updateEmbeddedDocuments('Item', [competence]);
+        let update = { _id: competence.id, 'data.xp': Misc.toInt(competence.data.xp) + xpComp };
+        await this.updateEmbeddedDocuments('Item', [update]);
       } else {
         xpCarac = Math.max(xpCarac, 1);
       }
@@ -3229,7 +3239,7 @@ export class RdDActor extends Actor {
         }
       }
       rollData.competence.data.defaut_carac = caracTache;
-      
+
       const dialog = await RdDRoll.create(this, rollData,
         {
           html: 'systems/foundryvtt-reve-de-dragon/templates/dialog-roll-alchimie.html',
diff --git a/templates/dialog-roll-chant.html b/templates/dialog-roll-chant.html
index ad65341b..f9cd5a85 100644
--- a/templates/dialog-roll-chant.html
+++ b/templates/dialog-roll-chant.html
@@ -1,36 +1,26 @@
 <form class="rdddialog">
-<div class="form-group">
-  <ul>
-    <li><label>Chant : {{oeuvre.name}}</label></li>
-    <li><label>Jet : OUIE / {{competence.name}}</label></li>
-  </ul>
-  <div class="tooltipAppelAuMoral divAppelAuMoral">
-    <img class="imgAppelAuMoral small-button-container" src="/systems/foundryvtt-reve-de-dragon/icons/moral-neutre.svg">
-    <span class="tooltipAppelAuMoralText">Sans appel au moral</span>
+<h2>Chanter: {{oeuvre.name}}</h2>
+
+<div class="grid grid-2col">
+  <div class="flex-group-left">
+    <img class="chat-icon" src="{{competence.img}}" alt="{{competence.name}}"/>
+    <div class="grid grid-2col">
+      <label>Caractéristique: </label><label class="flex-grow">{{selectedCarac.label}}</label>
+      <label>{{competence.name}}:</label><label class="flex-grow">{{numberFormat competence.data.niveau decimals=0 sign=true}}</label></label>
+    </div>
+    {{> "systems/foundryvtt-reve-de-dragon/templates/chat-poesie.html" oeuvre.data}}
+  </div>
+  <div class="flex-group-left">
+    <div class="flexrow">
+      <label>Difficulté</label>
+      <label>{{numberFormat diffLibre decimals=0 sign=true}}</label>
+    </div>
+    {{>"systems/foundryvtt-reve-de-dragon/templates/partial-roll-diffCondition.html"}}
+    {{>"systems/foundryvtt-reve-de-dragon/templates/partial-roll-moral.html"}}
+    <div id="tableAjustements" class="flexrow"></div>
   </div>
-</div> 
-
-<div class="form-group">
-  <label>conditions</label>
-  <select name="diffConditions" id="diffConditions" data-dtype="number">
-      {{#select diffConditions}}
-      {{#each ajustementsConditions as |key|}}
-      <option value={{key}}>{{numberFormat key decimals=0 sign=true}}</option>
-      {{/each}}
-      {{/select}}
-  </select>
-  <label>Difficulté </label>
-  <select name="diffLibre" id="diffLibre" data-dtype="number">
-    {{#select diffLibre}}
-    {{#each difficultesLibres  as |key|}}
-    <option value={{key}}>{{numberFormat key decimals=0 sign=true}}</option>
-    {{/each}}
-  {{/select}}
-  </select>
 </div>
 
-<div id="tableAjustements">
-</div>
 <div id="tableResolution">
 </div>
 <div id="tableProbaReussite">  
diff --git a/templates/dialog-roll-danse.html b/templates/dialog-roll-danse.html
index dae51917..2134cb7a 100644
--- a/templates/dialog-roll-danse.html
+++ b/templates/dialog-roll-danse.html
@@ -1,47 +1,26 @@
 <form class="dialog-roll-danse">
-  <div class="form-group">
-    <ul>
-      <li><label>Danse : {{oeuvre.name}}</label></li>
-      <li><label>Jet : APPARENCE ou AGILITE / {{competence.name}}</label></li>
-    </ul>
-  </div>
+  <h2>Danser: {{oeuvre.name}}</h2>
 
-  <div class="form-group">
-    <label>Caractéristique</label>
-    <select name="carac" id="carac" class="select-diff" data-dtype="String">
-      {{#select carac}}
-      {{#each carac as |caracitem key|}}
-      <option value={{key}}>{{caracitem.label}}</option>
-      {{/each}}
-      {{/select}}
-    </select>
-    <div class="tooltipAppelAuMoral divAppelAuMoral">
-      <img class="imgAppelAuMoral small-button-container" src="/systems/foundryvtt-reve-de-dragon/icons/moral-neutre.svg">
-      <span class="tooltipAppelAuMoralText">Sans appel au moral</span>
+  <div class="grid grid-2col">
+    <div class="flex-group-left">
+      <img class="chat-icon" src="{{competence.img}}" alt="{{competence.name}}"/>
+      <div class="grid grid-2col">
+        <label for="carac">Caractéristique:</label>{{>"systems/foundryvtt-reve-de-dragon/templates/partial-select-carac.html"}}
+        <label>{{competence.name}}:</label><label class="flex-grow">{{numberFormat competence.data.niveau decimals=0 sign=true}}</label></label>
+      </div>
+      {{> "systems/foundryvtt-reve-de-dragon/templates/chat-poesie.html" oeuvre.data}}
+    </div>
+    <div class="flex-group-left">
+      <div class="flexrow">
+        <label>Difficulté</label>
+        <label>{{numberFormat diffLibre decimals=0 sign=true}}</label>
+      </div>
+      {{>"systems/foundryvtt-reve-de-dragon/templates/partial-roll-diffCondition.html"}}
+      {{>"systems/foundryvtt-reve-de-dragon/templates/partial-roll-moral.html"}}
+      <div id="tableAjustements" class="flexrow"></div>
     </div>
   </div>
 
-  <div class="form-group">
-    <label>conditions</label>
-    <select name="diffConditions" id="diffConditions" data-dtype="number">
-      {{#select diffConditions}}
-      {{#each ajustementsConditions as |key|}}
-      <option value={{key}}>{{numberFormat key decimals=0 sign=true}}</option>
-      {{/each}}
-      {{/select}}
-    </select>
-    <label>Difficulté </label>
-    <select name="diffLibre" id="diffLibre" data-dtype="number">
-      {{#select diffLibre}}
-      {{#each difficultesLibres as |key|}}
-      <option value={{key}}>{{numberFormat key decimals=0 sign=true}}</option>
-      {{/each}}
-      {{/select}}
-    </select>
-  </div>
-
-  <div id="tableAjustements">
-  </div>
   <div id="tableResolution">
   </div>
   <div id="tableProbaReussite">
diff --git a/templates/dialog-roll-jeu.html b/templates/dialog-roll-jeu.html
index c67bbcdc..c2195a4d 100644
--- a/templates/dialog-roll-jeu.html
+++ b/templates/dialog-roll-jeu.html
@@ -1,47 +1,25 @@
 <form class="rdddialog">
-  <div class="form-group">
-    <ul>
-      <li><label for="competence-label">Jouer à : {{oeuvre.name}}</label></li>
-      <li><label for="competence-label">Type : {{oeuvre.data.type}}</label></li>
-      <li><label for="competence-label">Base : {{oeuvre.data.base}}</label></li>
-      <li><label for="competence-label">Carac/Compétence : {{oeuvre.data.caraccomp}}</label></li>
-    </ul>
-  </div>
-  <div class="form-group">
-    <label>Caractéristique</label>
-    <select name="carac" id="carac" class="select-diff" data-dtype="String">
-      {{#select carac}}
-      {{#each carac as |caracitem key|}}
-      <option value={{key}}>{{caracitem.label}}</option>
-      {{/each}}
-      {{/select}}
-    </select>
-    <div class="tooltipAppelAuMoral divAppelAuMoral">
-      <img class="imgAppelAuMoral small-button-container" src="/systems/foundryvtt-reve-de-dragon/icons/moral-neutre.svg">
-      <span class="tooltipAppelAuMoralText">Sans appel au moral</span>
+  <h2>Jouer à : {{oeuvre.name}}</h2>
+
+  <div class="grid grid-2col">
+    <div class="flex-group-left">
+      <img class="chat-icon" src="{{competence.img}}" alt="{{competence.name}}"/>
+      <div class="grid grid-2col">
+        <label>Type:</label><label class="flex-grow">{{oeuvre.data.type}}</label>
+        <label for="carac">Caractéristique:</label>{{>"systems/foundryvtt-reve-de-dragon/templates/partial-select-carac.html"}}
+        <label>{{competence.name}}:</label><label class="flex-grow">{{numberFormat competence.data.niveauReel decimals=0 sign=true}}</label></label>
+        <label>Niveau de base:</label><label class="flex-grow">{{oeuvre.data.base}}</label>
+      </div>
+    </div>
+    <div class="flex-group-left">
+      {{>"systems/foundryvtt-reve-de-dragon/templates/partial-roll-diffLibre.html"}}
+      {{>"systems/foundryvtt-reve-de-dragon/templates/partial-roll-diffCondition.html"}}
+      {{>"systems/foundryvtt-reve-de-dragon/templates/partial-roll-moral.html"}}
+      <div id="tableAjustements" class="flexrow"></div>
     </div>
   </div>
-  <div class="form-group">
-    <label>Conditions</label>
-    <select name="diffConditions" id="diffConditions" data-dtype="number">
-      {{#select diffConditions}}
-      {{#each ajustementsConditions as |key|}}
-      <option value={{key}}>{{numberFormat key decimals=0 sign=true}}</option>
-      {{/each}}
-      {{/select}}
-    </select>
-    <label>Difficulté </label>
-    <select name="diffLibre" id="diffLibre" data-dtype="number">
-      {{#select diffLibre}}
-      {{#each difficultesLibres as |key|}}
-      <option value={{key}}>{{numberFormat key decimals=0 sign=true}}</option>
-      {{/each}}
-      {{/select}}
-    </select>
-  </div>
+  {{> "systems/foundryvtt-reve-de-dragon/templates/chat-poesie.html" oeuvre.data}}
 
-  <div id="tableAjustements">
-  </div>
   <div id="tableResolution">
   </div>
   <div id="tableProbaReussite">
diff --git a/templates/partial-roll-diffCondition.html b/templates/partial-roll-diffCondition.html
index 0bc7fd18..45a68528 100644
--- a/templates/partial-roll-diffCondition.html
+++ b/templates/partial-roll-diffCondition.html
@@ -1,5 +1,5 @@
 <div class="flexrow">
-  <label>Conditions</label>
+  <label for="diffConditions">Conditions</label>
   <select name="diffConditions" id="diffConditions" data-dtype="number" {{#unless use.conditions}}disabled{{/unless}}>
       {{#select diffConditions}}
       {{#each ajustementsConditions  as |key|}}
diff --git a/templates/partial-roll-diffLibre.html b/templates/partial-roll-diffLibre.html
index 355141f9..544a7bb5 100644
--- a/templates/partial-roll-diffLibre.html
+++ b/templates/partial-roll-diffLibre.html
@@ -1,5 +1,5 @@
 <div class="flexrow">
-  <label>Difficulté libre</label>
+  <label for="diffLibre">Difficulté libre</label>
   <select name="diffLibre" id="diffLibre" data-dtype="number" {{#unless use.libre}}disabled{{/unless}}>
     {{#select diffLibre}}
     {{#each difficultesLibres as |key|}}