diff --git a/home/templates/partials/change_faction.html b/home/templates/partials/change_faction.html
index f8e5871..ce7da58 100644
--- a/home/templates/partials/change_faction.html
+++ b/home/templates/partials/change_faction.html
@@ -55,21 +55,16 @@
                                     <p>Por favor, asegúrate de haber escogido al personaje correcto ya que esta acción no es reversible una vez realizada.</p>
                                 </div>
                             </fieldset>
-							<script src="{{ URL_PRINCIPAL }}/static/nw-themes/nw-ryu/nw-js-handlers/change_faction_response.js"></script>
-							<script src="https://js.stripe.com/v3/"></script>
-                           <form action="" id="nw-change-faction-form" method="POST" accept-charset="utf-8">
-                                    <select name="character">
-										 <option value="" selected disabled>Seleccione un personaje</option>
-										{% for character in characters %}
-                                        <option class="priest big-font" value="{{ character }}">{{ character }}</option>
-										{% endfor %}
-                                    </select>
-                                    <br>
-                                    <button class="change-faction-button" type="submit" name="change-faction-button" data-id="ChangeFaction">Cambiar Facción por {{ price }} €</button>
-                                </form>
-                                <br>
-                                <hr>
-                                <center><div class="alert-message" id="change-race-response"></div></center>
+                            {% load django_vite %}
+                            <!-- Isla React (Vite): servicio de pago de personaje (genérico). -->
+                            <div id="character-purchase-app"
+                                 data-csrf="{{ csrf_token }}"
+                                 data-url="{% url 'change-faction-character' %}"
+                                 data-price="{{ price }}"
+                                 data-label="Cambiar Facción"
+                                 data-button-class="change-faction-button"></div>
+                            {{ characters|json_script:"character-purchase-data" }}
+                            {% vite_asset 'src/entries/character_purchase.tsx' %}
                                 <br>
                             </div>
                         </div>
diff --git a/home/templates/partials/change_race.html b/home/templates/partials/change_race.html
index a1024d5..1d21bb2 100644
--- a/home/templates/partials/change_race.html
+++ b/home/templates/partials/change_race.html
@@ -19,26 +19,16 @@
                                     <p>Por favor, asegúrate de haber escogido al personaje correcto ya que esta acción no es reversible una vez realizada.</p>
                                 </div>
                             </fieldset>
-							<script src="{{ URL_PRINCIPAL }}/static/nw-themes/nw-ryu/nw-js-handlers/change_race_response.js"></script>
-							<script src="https://js.stripe.com/v3/"></script>
-                              <form id="nw-change-race-form" div class="centered">
-                                <br>
-                                <br>
-                                <p>Escoge el personaje que quieres desbloquear</p>
-                                <br>
-                                <form action="" id="nw-change-race-form" method="POST" accept-charset="utf-8">
-                                    <select name="character">
-										 <option value="" selected disabled>Seleccione un personaje</option>
-										{% for character in characters %}
-                                        <option class="priest big-font" value="{{ character }}">{{ character }}</option>
-										{% endfor %}
-                                    </select>
-                                    <br>
-                                    <button class="change-race-button" type="submit" name="change-race-button" data-id="ChangeRace">Cambiar Raza por {{ price }} €</button>
-                                </form>
-                                <br>
-                                <hr>
-                                <center><div class="alert-message" id="change-race-response"></div></center>
+                            {% load django_vite %}
+                            <!-- Isla React (Vite): servicio de pago de personaje (genérico). -->
+                            <div id="character-purchase-app"
+                                 data-csrf="{{ csrf_token }}"
+                                 data-url="{% url 'change-race-character' %}"
+                                 data-price="{{ price }}"
+                                 data-label="Cambiar Raza"
+                                 data-button-class="change-race-button"></div>
+                            {{ characters|json_script:"character-purchase-data" }}
+                            {% vite_asset 'src/entries/character_purchase.tsx' %}
                                 <br>
                             </div>
                         </div>
diff --git a/home/templates/partials/customize_character.html b/home/templates/partials/customize_character.html
index 9a696d9..7916779 100644
--- a/home/templates/partials/customize_character.html
+++ b/home/templates/partials/customize_character.html
@@ -24,26 +24,16 @@
                                     <p>Por favor, asegúrate de haber escogido al personaje correcto ya que esta acción no es reversible una vez realizada.</p>
                                 </div>
                             </fieldset>
-							<script src="{{ URL_PRINCIPAL }}/static/nw-themes/nw-ryu/nw-js-handlers/customize_response.js"></script>
-							<script src="https://js.stripe.com/v3/"></script>
-                            <form id="nw-customize-form" div class="centered">
-                                <br>
-                                <br>
-                                <p>Escoge el personaje que quieres desbloquear</p>
-                                <br>
-                                <form action="" id="nw-customize-form" method="POST" accept-charset="utf-8">
-                                    <select name="character">
-										 <option value="" selected disabled>Seleccione un personaje</option>
-										{% for character in characters %}
-                                        <option class="priest big-font" value="{{ character }}">{{ character }}</option>
-										{% endfor %}
-                                    </select>
-                                    <br>
-                                    <button class="customize-button" type="submit" name="rename-button" data-id="Renombrar">Renombrar por {{ price }} €</button>
-                                </form>
-                                <br>
-                                <hr>
-                                <center><div class="alert-message" id="customize-response"></div></center>
+                            {% load django_vite %}
+                            <!-- Isla React (Vite): servicio de pago de personaje (genérico). -->
+                            <div id="character-purchase-app"
+                                 data-csrf="{{ csrf_token }}"
+                                 data-url="{% url 'customize-character' %}"
+                                 data-price="{{ price }}"
+                                 data-label="Personalizar"
+                                 data-button-class="customize-button"></div>
+                            {{ characters|json_script:"character-purchase-data" }}
+                            {% vite_asset 'src/entries/character_purchase.tsx' %}
                                 <br>
                             </div>
                         </div>
diff --git a/home/templates/partials/level_up.html b/home/templates/partials/level_up.html
index a893609..30471d7 100644
--- a/home/templates/partials/level_up.html
+++ b/home/templates/partials/level_up.html
@@ -20,21 +20,16 @@
                                 </div>
                             </fieldset>
 							<p>Selecciona el personaje que deseas subir al nivel 80:</p>
-							<script src="{{ URL_PRINCIPAL }}/static/nw-themes/nw-ryu/nw-js-handlers/level_up_response.js"></script>
-							<script src="https://js.stripe.com/v3/"></script>
-                            <form action="" id="nw-levelup-form" method="POST" accept-charset="utf-8">
-                                    <select name="character">
-										 <option value="" selected disabled>Seleccione un personaje</option>
-										{% for character in characters %}
-                                        <option class="priest big-font" value="{{ character }}">{{ character }}</option>
-										{% endfor %}
-                                    </select>
-                                    <br>
-                                    <button class="level-up-button" type="submit" name="level-up-button" data-id="LevelUp">Subir a nivel 80 por {{ price }} €</button>
-                                </form>
-                                <br>
-                                <hr>
-                                <center><div class="alert-message" id="levelup-response"></div></center>
+                            {% load django_vite %}
+                            <!-- Isla React (Vite): servicio de pago de personaje (genérico). -->
+                            <div id="character-purchase-app"
+                                 data-csrf="{{ csrf_token }}"
+                                 data-url="{% url 'level_up_character' %}"
+                                 data-price="{{ price }}"
+                                 data-label="Subir a nivel 80"
+                                 data-button-class="level-up-button"></div>
+                            {{ characters|json_script:"character-purchase-data" }}
+                            {% vite_asset 'src/entries/character_purchase.tsx' %}
                                 <br>
                             </div>
                         </div>