diff --git a/2048.css b/2048.css
index 8ade4f5..d425735 100644
--- a/2048.css
+++ b/2048.css
@@ -47,10 +47,6 @@ button:hover {
     font-size: 20px;
 }
 
-/* ======================
-   BOARD
-====================== */
-
 
 /* ==========================
    BOARD — MIRIP BORDER LOGIN
@@ -100,7 +96,6 @@ button:hover {
 }
 
 
-
 /* ======================
    TILE
 ====================== */
diff --git a/Modal_Register.js b/Modal_Register.js
index 9a18417..6334895 100644
--- a/Modal_Register.js
+++ b/Modal_Register.js
@@ -9,10 +9,10 @@ export function showModal(type, title, message) {
 
     if (type === "success") {
         modalIcon.classList.add("success");
-        modalTitle.textContent = title || "Register Berhasil!";
+        modalTitle.textContent = title || "Register Successful!";
     } else {
         modalIcon.classList.add("error");
-        modalTitle.textContent = title || "Register Gagal!";
+        modalTitle.textContent = title || "Register Failed!";
     }
 
     modalMessage.textContent = message;
diff --git a/Register.css b/Register.css
index 7a5cb53..8c5504f 100644
--- a/Register.css
+++ b/Register.css
@@ -158,14 +158,18 @@ input::placeholder {
     text-shadow: 0 0 10px #00ddff;
 }
 
-/* Modal */
+/* Modal - CENTERED VERSION */
 .modal {
     display: none;
     position: fixed;
-    z-index: 999;
-    inset: 0;
-    background-color: rgba(0, 0, 0, 0.75);
-    backdrop-filter: blur(8px);
+    z-index: 1000;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(0, 0, 0, 0.7);
+    backdrop-filter: blur(5px);
+    animation: fadeIn 0.3s ease;
 }
 
 .modal.show {
@@ -175,75 +179,124 @@ input::placeholder {
 }
 
 .modal-content {
-    background: rgba(20, 0, 40, 0.95);
+    background: linear-gradient(135deg, rgba(30, 0, 50, 0.95) 0%, rgba(50, 0, 80, 0.95) 100%);
+    border: 2px solid rgba(0, 217, 255, 0.3);
     border-radius: 20px;
-    border: 2px solid rgba(0, 255, 255, 0.4);
-    padding: 35px 25px;
-    width: 90%;
+    padding: 40px 30px;
+    text-align: center;
     max-width: 400px;
+    width: 90%;
+    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5),
+                0 0 40px rgba(0, 217, 255, 0.3),
+                inset 0 0 30px rgba(0, 217, 255, 0.1);
+    animation: slideIn 0.3s ease, glowBorder 3s ease-in-out infinite;
+}
 
-    box-shadow:
-        0 0 30px #00eaff,
-        0 0 60px #ff00ff;
+@keyframes glowBorder {
+    0%, 100% {
+        border-color: rgba(0, 217, 255, 0.4);
+        box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5),
+                    0 0 40px rgba(0, 217, 255, 0.3),
+                    inset 0 0 30px rgba(0, 217, 255, 0.1);
+    }
+    50% {
+        border-color: rgba(255, 0, 255, 0.5);
+        box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5),
+                    0 0 50px rgba(255, 0, 255, 0.4),
+                    inset 0 0 40px rgba(255, 0, 255, 0.15);
+    }
 }
 
 .modal-icon {
     width: 80px;
     height: 80px;
-    margin: 0 auto 15px;
+    margin: 0 auto 20px;
     border-radius: 50%;
-
     display: flex;
     justify-content: center;
     align-items: center;
-    font-size: 38px;
-    color: white;
+    font-size: 40px;
 }
 
 .modal-icon.success {
-    background: linear-gradient(135deg, #00eaff, #00ff88);
-    box-shadow: 0 0 25px #00ffcc;
+    background: linear-gradient(135deg, #00d9ff 0%, #00ff88 100%);
+    box-shadow: 0 0 30px rgba(0, 217, 255, 0.6);
+}
+
+.modal-icon.success::before {
+    content: "✓";
+    color: #fff;
 }
 
 .modal-icon.error {
-    background: linear-gradient(135deg, #ff0066, #ff00ff);
-    box-shadow: 0 0 25px #ff00aa;
+    background: linear-gradient(135deg, #ff0080 0%, #ff00ff 100%);
+    box-shadow: 0 0 30px rgba(255, 0, 128, 0.6);
+}
+
+.modal-icon.error::before {
+    content: "✕";
+    color: #fff;
 }
 
 .modal-content h2 {
-    font-size: 1.7rem;
-    margin-bottom: 10px;
-
-    background: linear-gradient(90deg, #00eaff, #ff00ff);
+    color: #fff;
+    font-size: 1.8rem;
+    margin-bottom: 15px;
+    background: linear-gradient(90deg, #00d9ff 0%, #ff00ff 100%);
     -webkit-background-clip: text;
-    background-clip: text;     /* FIX: properti standar */
     -webkit-text-fill-color: transparent;
+    background-clip: text;
 }
 
 .modal-content p {
-    color: rgba(240, 240, 255, 0.8);
-    margin-bottom: 25px;
+    color: rgba(255, 255, 255, 0.8);
+    font-size: 1rem;
+    margin-bottom: 30px;
     line-height: 1.5;
 }
 
 .modal-btn {
-    padding: 12px 55px;
-    background: linear-gradient(90deg, #00eaff, #ff00ff);
+    padding: 12px 50px;
+    background: linear-gradient(90deg, #00d9ff 0%, #ff00ff 100%);
     border: none;
     border-radius: 10px;
-
-    color: white;
+    color: #fff;
     font-size: 16px;
     font-weight: bold;
-
+    text-transform: uppercase;
+    letter-spacing: 2px;
     cursor: pointer;
-    box-shadow: 0 0 20px #00d9ff;
-    transition: 0.3s ease;
+    transition: all 0.3s ease;
+    box-shadow: 0 5px 25px rgba(0, 217, 255, 0.4);
 }
 
 .modal-btn:hover {
-    transform: translateY(-3px);
-    box-shadow: 0 0 30px #00eaff;
+    transform: translateY(-2px);
+    box-shadow: 0 8px 35px rgba(0, 217, 255, 0.6);
+}
+
+.modal-btn:active {
+    transform: translateY(0);
+}
+
+@keyframes fadeIn {
+    from {
+        opacity: 0;
+    }
+    to {
+        opacity: 1;
+    }
+}
+
+@keyframes slideIn {
+    from {
+        transform: translateY(-50px);
+        opacity: 0;
+    }
+    to {
+        transform: translateY(0);
+        opacity: 1;
+    }
 }
 
 /* Autocomplete/Datalist Styling */
@@ -251,7 +304,7 @@ input::-webkit-calendar-picker-indicator {
     filter: invert(1);
 }
 
-/* Styling untuk browser autocomplete */
+/* Browser autocomplete styling */
 input:-webkit-autofill,
 input:-webkit-autofill:hover,
 input:-webkit-autofill:focus {
@@ -265,7 +318,7 @@ input:-webkit-autofill:focus {
     border-color: #00d9ff;
 }
 
-/* Styling untuk datalist dropdown - terbatas karena browser restrictions */
+/* Datalist dropdown styling - limited due to browser restrictions */
 datalist {
     background-color: rgba(30, 0, 50, 0.95);
 }
@@ -276,12 +329,12 @@ option {
     padding: 10px;
 }
 
-/* Untuk Firefox */
+/* For Firefox */
 input::-moz-list-thumbnail {
     background-color: rgba(30, 0, 50, 0.95);
 }
 
-/* Custom styling untuk dropdown suggestion */
+/* Custom styling for dropdown suggestion */
 input[list]::-webkit-list-button {
     color: #00d9ff;
 }
@@ -305,4 +358,18 @@ input[list]::-webkit-list-button {
         padding: 13px;
         font-size: 16px;
     }
-}
+
+    .modal-icon {
+        width: 60px;
+        height: 60px;
+        font-size: 30px;
+    }
+
+    .modal-content h2 {
+        font-size: 1.3rem;
+    }
+
+    .modal-content p {
+        font-size: 0.9rem;
+    }
+}
\ No newline at end of file
diff --git a/Register.js b/Register.js
index c5c9b58..0b01421 100644
--- a/Register.js
+++ b/Register.js
@@ -14,13 +14,13 @@ document.getElementById("registerForm").addEventListener("submit", async functio
 
     // Validasi kosong
     if (!username || !password || !confirmPassword) {
-        showModal("error", "Register Gagal!", "Semua field wajib diisi.");
+        showModal("error", "Register Failed!", "All fields are required.");
         return;
     }
 
     // Validasi password tidak sama
     if (password !== confirmPassword) {
-        showModal("error", "Password Tidak Cocok!", "Password dan Confirm Password harus sama.");
+        showModal("error", "Password Mismatch!", "Password and Confirm Password must match.");
         setInputError("password");
         setInputError("confirmPassword");
         return;
@@ -29,7 +29,7 @@ document.getElementById("registerForm").addEventListener("submit", async functio
     // Button loading state
     const submitBtn = this.querySelector("button[type='submit']");
     const originalText = submitBtn.textContent;
-    submitBtn.innerHTML = "<span>Memproses...</span>";
+    submitBtn.innerHTML = "<span>Loading...</span>";
     submitBtn.disabled = true;
 
     try {
@@ -37,20 +37,20 @@ document.getElementById("registerForm").addEventListener("submit", async functio
 
         // API temenmu return: { status: "success", message: "..." }
         if (data.status === "success") {
-            showModal("success", "Register Berhasil!", data.message);
+            showModal("success", "Register Successful!", data.message);
 
         } else {
-            showModal("error", "Register Gagal!", data.message || "Terjadi kesalahan.");
+            showModal("error", "Register Failed!", data.message || "An error occurred.");
             setInputError("username");
         }
 
     } catch (error) {
         console.error("Register Error:", error);
 
-        let msg = "Terjadi kesalahan koneksi.";
+        let msg = "A connection error occurred.";
 
         if (error.message === "Failed to fetch") {
-            msg = "Tidak dapat terhubung ke server.";
+            msg = "Unable to connect to server.";
         }
 
         showModal("error", "Error!", msg);