diff --git a/templates/play.html b/templates/play.html
index 98fca6f1..fb991a48 100644
--- a/templates/play.html
+++ b/templates/play.html
@@ -40,7 +40,7 @@
     display:flex; align-items:center; justify-content:center;
   }
   .playElement input{ width:90%; height:70%; box-sizing:border-box; border:1px solid #2b3140; border-radius:4px; padding:0 8px; }
-  #emptyState{ color:#8b93a7; font-family:system-ui,sans-serif; text-align:center; padding-top:40vh; }
+  #emptyState{ color:var(--forge-text-muted, #8b95a7); font-family:system-ui,sans-serif; text-align:center; padding-top:40vh; }
   /* 3.3 (Confort) — surbrillance générique dynamique : liseré clignotant,
      posé/enlevé par une action "Modifier un élément → Surbrillance",
      applicable à n'importe quel élément (pas seulement les boutons). */
diff --git a/templates/screen_edit.html b/templates/screen_edit.html
index c6333d16..4b39ebc7 100644
--- a/templates/screen_edit.html
+++ b/templates/screen_edit.html
@@ -8,7 +8,7 @@
 {% endblock %}
 {% block content %}
 {% if screen.is_template %}
-<p class="hint" style="background:#1c2130; border:1px solid #2b3140; border-radius:8px; padding:10px 14px; margin:10px 0;">
+<p class="hint" style="background:var(--panel); border:1px solid var(--border); border-radius:8px; padding:10px 14px; margin:10px 0;">
   🧩 Contenu d'un élément de jeu réutilisable.
 </p>
 {% endif %}
@@ -522,7 +522,7 @@
         </header>
         <section class="modal-card-body">
           <p class="hint">Cette action est irréversible.</p>
-          <p class="hint" id="deleteConfirmFlowWarning" style="display:none; margin-top:10px; color:var(--danger, #e2685f);"></p>
+          <p class="hint" id="deleteConfirmFlowWarning" style="display:none; margin-top:10px; color:var(--danger, #f04438);"></p>
         </section>
         <footer class="modal-card-foot" style="justify-content:flex-end; gap:8px;">
           <button type="button" class="button is-small" onclick="closeDeleteConfirmModal()">Annuler</button>
@@ -2427,7 +2427,7 @@ function renderFlowConditionClauses() {
   wrap.innerHTML = flowConditionExtraClauses.map(function(clause, idx) {
     var isVariable = clause.source === 'variable';
     return '' +
-      '<div class="flowConditionClauseRow" style="border-top:1px dashed #ccc; margin-top:8px; padding-top:8px;">' +
+      '<div class="flowConditionClauseRow" style="border-top:1px dashed var(--border); margin-top:8px; padding-top:8px;">' +
         '<label>Source<select id="nf-cond-extra-source-' + idx + '" onchange="onFlowClauseSourceChange(' + idx + ')">' +
           '<option value="objet"' + (isVariable ? '' : ' selected') + '>Champ d\'un objet</option>' +
           '<option value="variable"' + (isVariable ? ' selected' : '') + '>Variable globale</option>' +