diff --git a/register.css b/register.css
deleted file mode 100644
index d102af1..0000000
--- a/register.css
+++ /dev/null
@@ -1,200 +0,0 @@
-body {
-    margin: 0;
-    font-family: Arial, sans-serif;
-    background: linear-gradient(135deg, #d9a7ff, #fbc2eb, #a1c4fd);;
-}
-
-.page {
-    height: 100vh;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    position: relative;
-}
-
-/* Background Animasi */
-.bg-1, .bg-2, .bg-3 {
-    position: absolute;
-    border-radius: 50%;
-    filter: blur(70px);
-    opacity: 0.4;
-}
-
-.bg-1 {
-    width: 300px; height: 300px;
-    background: rgba(255,255,255,0.3);
-    top: 10%; left: 10%;
-    animation: glow 4s infinite alternate;
-}
-
-.bg-2 {
-    width: 400px; height: 400px;
-    background: rgba(255,120,200,0.3);
-    bottom: 10%; right: 10%;
-    animation: float 6s infinite;
-}
-
-.bg-3 {
-    width: 250px; height: 250px;
-    background: rgba(200,100,255,0.3);
-    top: 50%; left: 50%;
-    transform: translate(-50%, -50%);
-    animation: glow 5s infinite alternate;
-}
-
-@keyframes glow {
-    0% { opacity: 0.2; }
-    100% { opacity: 0.55; }
-}
-
-@keyframes float {
-    0% { transform: translateY(0); }
-    50% { transform: translateY(-20px); }
-    100% { transform: translateY(0); }
-}
-
-/* Container */
-.container {
-    background: rgba(255,255,255,0.7);
-    backdrop-filter: blur(10px);
-    padding: 40px;
-    border-radius: 25px;
-    width: 350px;
-    z-index: 10;
-    box-shadow: 0 10px 28px rgba(0,0,0,0.2);
-}
-
-/* Icon */
-.icon-wrapper {
-    display: flex;
-    justify-content: center;
-    margin-bottom: 20px;
-}
-
-.icon-bg {
-    width: 90px; height: 90px;
-    background: linear-gradient(45deg, purple, hotpink);
-    border-radius: 50%;
-    filter: blur(12px);
-    position: absolute;
-    animation: glow 3s infinite alternate;
-}
-
-.icon {
-    background: linear-gradient(45deg, purple, hotpink);
-    border-radius: 50%;
-    width: 70px; height: 70px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    position: relative;
-}
-
-/* Text */
-.title {
-    text-align: center;
-    font-size: 22px;
-    margin-bottom: 10px;
-    color: white;
-    padding: 10px;
-    border-radius: 40px;
-    background: linear-gradient(45deg, purple, hotpink);;
-    font-family: 'Segoe UI', Tahoma, Verdana, sans-serif;
-    text-shadow: 
-        0 0 10px #000000,
-}
-
-
-.subtitle {
-    text-align: center;
-    color: gray;
-    margin-bottom: 20px;
-}
-
-/* Form */
-label {
-    font-size: 14px;
-    color: #444;
-}
-
-input {
-    width: 100%;
-    padding: 12px;
-    border-radius: 12px;
-    border: 2px solid #ccc;
-    background: #fafafa;
-    margin-bottom: 15px;
-}
-
-input:focus {
-    outline: none;
-    border-color: purple;
-}
-
-#errorBox {
-    color: red;
-    background: #ffe5e5;
-    padding: 10px;
-    border-radius: 10px;
-    margin-bottom: 10px;
-    display: none;
-}
-
-/* Button */
-.btn {
-    width: 100%;
-    background: linear-gradient(45deg, purple, hotpink);
-    color: white;
-    padding: 14px;
-    border: none;
-    border-radius: 15px;
-    font-size: 16px;
-    cursor: pointer;
-    transition: 0.2s;
-}
-
-.btn:hover {
-    transform: scale(1.02);
-    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
-}
-
-.login-link {
-    text-align: center;
-    margin-top: 15px;
-}
-
-.login-link a {
-    color: purple;
-    text-decoration: underline;
-}
-
-.fruit {
-  position: absolute;
-  width: 95px;
-  opacity: .85;
-  animation: float 6s infinite ease-in-out, drift 15s infinite linear;
-  pointer-events: none;
-}
-
-.f1 { top: 8%; left: 10%; animation-delay: .3s; }
-.f2 { top: 65%; right: 12%; animation-delay: .7s; }
-.f3 { top: 22%; right: 55%; animation-delay: 1.1s; }
-.f4 { bottom: 15%; left: 28%; animation-delay: .9s; }
-.f5 { bottom: 10%; right: 30%; animation-delay: 1.4s; }
-.f6 { top: 40%; left: 50%; animation-delay: .5s; }
-.f7 { bottom: 30%; left: 15%; animation-delay: 1.2s; }
-.f8 { top: 75%; right: 40%; animation-delay: .8s; }
-.f9 { top: 50%; left: 80%; animation-delay: 1s; }
-.f10 { bottom: 20%; right: 5%; animation-delay: 1.3s; }
-
-@keyframes float {
-  0% { transform: translateY(0) rotate(0deg); }
-  50% { transform: translateY(-20px) rotate(6deg); }
-  100% { transform: translateY(0) rotate(0deg); }
-}
-
-@keyframes drift {
-  0% { transform: translateX(0); }
-  50% { transform: translateX(15px); }
-  100% { transform: translateX(0); }
-}
\ No newline at end of file
diff --git a/register.html b/register.html
index 0d277a2..d8305a0 100644
--- a/register.html
+++ b/register.html
@@ -4,7 +4,210 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Register Akun</title>
-    <link rel="stylesheet" href="register.css" />
+
+<style>
+body {
+    margin: 0;
+    font-family: Arial, sans-serif;
+    background: linear-gradient(135deg, #d9a7ff, #fbc2eb, #a1c4fd);;
+}
+
+.page {
+    height: 100vh;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    position: relative;
+}
+
+/* Background Animasi */
+.bg-1, .bg-2, .bg-3 {
+    position: absolute;
+    border-radius: 50%;
+    filter: blur(70px);
+    opacity: 0.4;
+}
+
+.bg-1 {
+    width: 300px; height: 300px;
+    background: rgba(255,255,255,0.3);
+    top: 10%; left: 10%;
+    animation: glow 4s infinite alternate;
+}
+
+.bg-2 {
+    width: 400px; height: 400px;
+    background: rgba(255,120,200,0.3);
+    bottom: 10%; right: 10%;
+    animation: float 6s infinite;
+}
+
+.bg-3 {
+    width: 250px; height: 250px;
+    background: rgba(200,100,255,0.3);
+    top: 50%; left: 50%;
+    transform: translate(-50%, -50%);
+    animation: glow 5s infinite alternate;
+}
+
+@keyframes glow {
+    0% { opacity: 0.2; }
+    100% { opacity: 0.55; }
+}
+
+@keyframes float {
+    0% { transform: translateY(0); }
+    50% { transform: translateY(-20px); }
+    100% { transform: translateY(0); }
+}
+
+/* Container */
+.container {
+    background: rgba(255,255,255,0.7);
+    backdrop-filter: blur(10px);
+    padding: 40px;
+    border-radius: 25px;
+    width: 350px;
+    z-index: 10;
+    box-shadow: 0 10px 28px rgba(0,0,0,0.2);
+}
+
+/* Icon */
+.icon-wrapper {
+    display: flex;
+    justify-content: center;
+    margin-bottom: 20px;
+}
+
+.icon-bg {
+    width: 90px; height: 90px;
+    background: linear-gradient(45deg, purple, hotpink);
+    border-radius: 50%;
+    filter: blur(12px);
+    position: absolute;
+    animation: glow 3s infinite alternate;
+}
+
+.icon {
+    background: linear-gradient(45deg, purple, hotpink);
+    border-radius: 50%;
+    width: 70px; height: 70px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    position: relative;
+}
+
+/* Text */
+.title {
+    text-align: center;
+    font-size: 22px;
+    margin-bottom: 10px;
+    color: white;
+    padding: 10px;
+    border-radius: 40px;
+    background: linear-gradient(45deg, purple, hotpink);;
+    font-family: 'Segoe UI', Tahoma, Verdana, sans-serif;
+    text-shadow: 
+        0 0 10px #000000,
+}
+
+
+.subtitle {
+    text-align: center;
+    color: gray;
+    margin-bottom: 20px;
+}
+
+/* Form */
+label {
+    font-size: 14px;
+    color: #444;
+}
+
+input {
+    width: 100%;
+    padding: 12px;
+    border-radius: 12px;
+    border: 2px solid #ccc;
+    background: #fafafa;
+    margin-bottom: 15px;
+}
+
+input:focus {
+    outline: none;
+    border-color: purple;
+}
+
+#errorBox {
+    color: red;
+    background: #ffe5e5;
+    padding: 10px;
+    border-radius: 10px;
+    margin-bottom: 10px;
+    display: none;
+}
+
+/* Button */
+.btn {
+    width: 100%;
+    background: linear-gradient(45deg, purple, hotpink);
+    color: white;
+    padding: 14px;
+    border: none;
+    border-radius: 15px;
+    font-size: 16px;
+    cursor: pointer;
+    transition: 0.2s;
+}
+
+.btn:hover {
+    transform: scale(1.02);
+    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
+}
+
+.login-link {
+    text-align: center;
+    margin-top: 15px;
+}
+
+.login-link a {
+    color: purple;
+    text-decoration: underline;
+}
+
+.fruit {
+  position: absolute;
+  width: 95px;
+  opacity: .85;
+  animation: float 6s infinite ease-in-out, drift 15s infinite linear;
+  pointer-events: none;
+}
+
+.f1 { top: 8%; left: 10%; animation-delay: .3s; }
+.f2 { top: 65%; right: 12%; animation-delay: .7s; }
+.f3 { top: 22%; right: 55%; animation-delay: 1.1s; }
+.f4 { bottom: 15%; left: 28%; animation-delay: .9s; }
+.f5 { bottom: 10%; right: 30%; animation-delay: 1.4s; }
+.f6 { top: 40%; left: 50%; animation-delay: .5s; }
+.f7 { bottom: 30%; left: 15%; animation-delay: 1.2s; }
+.f8 { top: 75%; right: 40%; animation-delay: .8s; }
+.f9 { top: 50%; left: 80%; animation-delay: 1s; }
+.f10 { bottom: 20%; right: 5%; animation-delay: 1.3s; }
+
+@keyframes float {
+  0% { transform: translateY(0) rotate(0deg); }
+  50% { transform: translateY(-20px) rotate(6deg); }
+  100% { transform: translateY(0) rotate(0deg); }
+}
+
+@keyframes drift {
+  0% { transform: translateX(0); }
+  50% { transform: translateX(15px); }
+  100% { transform: translateX(0); }
+}
+</style>
+
 </head>
 <body>
 
@@ -51,6 +254,72 @@
     </div>
 </div>
 
-<script src="register.js"></script>
+<script>
+    document.getElementById("registerForm").addEventListener("submit", function (e) {
+    e.preventDefault();
+
+    let username = document.getElementById("username").value.trim();
+    let email = document.getElementById("email").value.trim();
+    let password = document.getElementById("password").value.trim();
+    let confirmPassword = document.getElementById("confirmPassword").value.trim();
+    let errorBox = document.getElementById("errorBox");
+
+    errorBox.style.display = "none";
+
+    // Validasi
+    if (!username || !email || !password || !confirmPassword) {
+        showError("Semua field harus diisi");
+        return;
+    }
+
+    if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email)) {
+        showError("Format email tidak valid");
+        return;
+    }
+
+    if (password.length < 6) {
+        showError("Password minimal 6 karakter");
+        return;
+    }
+
+    if (password !== confirmPassword) {
+        showError("Password dan konfirmasi password tidak cocok");
+        return;
+    }
+
+    let users = JSON.parse(localStorage.getItem("users") || "[]");
+
+    if (users.some(u => u.username === username)) {
+        showError("Username sudah digunakan");
+        return;
+    }
+
+    if (users.some(u => u.email === email)) {
+        showError("Email sudah digunakan");
+        return;
+    }
+
+    // Simpan user baru
+    users.push({
+        id: Date.now().toString(),
+        username,
+        email,
+        password,
+        role: "player"
+    });
+
+    localStorage.setItem("users", JSON.stringify(users));
+
+    alert("Registrasi berhasil! Silakan login.");
+    window.location.href = "login.html";
+});
+
+function showError(msg) {
+    let box = document.getElementById("errorBox");
+    box.innerText = msg;
+    box.style.display = "block";
+}
+
+</script>
 </body>
 </html>
diff --git a/register.js b/register.js
deleted file mode 100644
index 56f5a48..0000000
--- a/register.js
+++ /dev/null
@@ -1,64 +0,0 @@
-document.getElementById("registerForm").addEventListener("submit", function (e) {
-    e.preventDefault();
-
-    let username = document.getElementById("username").value.trim();
-    let email = document.getElementById("email").value.trim();
-    let password = document.getElementById("password").value.trim();
-    let confirmPassword = document.getElementById("confirmPassword").value.trim();
-    let errorBox = document.getElementById("errorBox");
-
-    errorBox.style.display = "none";
-
-    // Validasi
-    if (!username || !email || !password || !confirmPassword) {
-        showError("Semua field harus diisi");
-        return;
-    }
-
-    if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email)) {
-        showError("Format email tidak valid");
-        return;
-    }
-
-    if (password.length < 6) {
-        showError("Password minimal 6 karakter");
-        return;
-    }
-
-    if (password !== confirmPassword) {
-        showError("Password dan konfirmasi password tidak cocok");
-        return;
-    }
-
-    let users = JSON.parse(localStorage.getItem("users") || "[]");
-
-    if (users.some(u => u.username === username)) {
-        showError("Username sudah digunakan");
-        return;
-    }
-
-    if (users.some(u => u.email === email)) {
-        showError("Email sudah digunakan");
-        return;
-    }
-
-    // Simpan user baru
-    users.push({
-        id: Date.now().toString(),
-        username,
-        email,
-        password,
-        role: "player"
-    });
-
-    localStorage.setItem("users", JSON.stringify(users));
-
-    alert("Registrasi berhasil! Silakan login.");
-    window.location.href = "login.html";
-});
-
-function showError(msg) {
-    let box = document.getElementById("errorBox");
-    box.innerText = msg;
-    box.style.display = "block";
-}