diff --git a/client/src/modules/GameCreationStepManager.js b/client/src/modules/GameCreationStepManager.js
index a47a1a4..1679ae5 100644
--- a/client/src/modules/GameCreationStepManager.js
+++ b/client/src/modules/GameCreationStepManager.js
@@ -455,6 +455,14 @@ function initializeRemainingEventListeners(deckManager) {
         let description = document.getElementById("role-description").value.trim();
         let team = document.getElementById("role-alignment").value.toLowerCase().trim();
         if (!deckManager.getCustomRoleOption(name)) { // confirm there is no existing custom role with the same name
+            if (name.length > 40) {
+                toast('Your name is too long (max 40 characters).', "error", true);
+                return;
+            }
+            if (description.length > 500) {
+                toast('Your description is too long (max 500 characters).', "error", true);
+                return;
+            }
             deckManager.addToCustomRoleOptions({role: name, description: description, team: team});
             updateCustomRoleOptionsList(deckManager, document.getElementById("deck-select"))
             ModalManager.dispelModal("add-role-modal", "add-role-modal-background");
diff --git a/client/src/styles/create.css b/client/src/styles/create.css
index 1c925d5..137881e 100644
--- a/client/src/styles/create.css
+++ b/client/src/styles/create.css
@@ -138,7 +138,7 @@ form {
 
 select {
     padding: 10px;
-    font-size: 18px;
+    font-size: 16px;
     font-family: 'signika-negative', sans-serif;
     background-color: transparent;
     color: #d7d7d7;