diff --git a/app/(site)/registration/cancel/page.tsx b/app/(site)/registration/cancel/page.tsx
index 720f3b4..5633694 100644
--- a/app/(site)/registration/cancel/page.tsx
+++ b/app/(site)/registration/cancel/page.tsx
@@ -1,10 +1,10 @@
 "use client";
 
-import { useEffect, useState } from "react";
+import { Suspense, useEffect, useState } from "react";
 import { useSearchParams } from "next/navigation";
 import Link from "next/link";
 
-export default function RegistrationCancelPage() {
+function CancelContent() {
   const searchParams = useSearchParams();
   const token = searchParams.get("token");
   const [cancelled, setCancelled] = useState(false);
@@ -21,6 +21,18 @@ export default function RegistrationCancelPage() {
     }
   }, [token]);
 
+  return (
+    <>
+      {!cancelled && (
+        <p className="mt-6 text-on-surface-variant text-xs opacity-60">
+          Đang cập nhật trạng thái...
+        </p>
+      )}
+    </>
+  );
+}
+
+export default function RegistrationCancelPage() {
   return (
     <main className="min-h-screen bg-[var(--color-background)] flex items-center justify-center px-[var(--spacing-gutter)] py-[80px]">
       <div className="w-full max-w-[560px]">
@@ -59,11 +71,9 @@ export default function RegistrationCancelPage() {
             </Link>
           </div>
 
-          {!cancelled && (
-            <p className="mt-6 text-on-surface-variant text-xs opacity-60">
-              Đang cập nhật trạng thái...
-            </p>
-          )}
+          <Suspense fallback={null}>
+            <CancelContent />
+          </Suspense>
         </div>
       </div>
     </main>
diff --git a/app/(site)/registration/success/page.tsx b/app/(site)/registration/success/page.tsx
index a02ac6b..86c64f5 100644
--- a/app/(site)/registration/success/page.tsx
+++ b/app/(site)/registration/success/page.tsx
@@ -1,10 +1,10 @@
 "use client";
 
-import { useEffect, useState } from "react";
+import { Suspense, useEffect, useState } from "react";
 import { useSearchParams } from "next/navigation";
 import Link from "next/link";
 
-export default function RegistrationSuccessPage() {
+function SuccessContent() {
   const searchParams = useSearchParams();
   const token = searchParams.get("token");
   const payerId = searchParams.get("PayerID");
@@ -43,99 +43,122 @@ export default function RegistrationSuccessPage() {
   }, [token, payerId]);
 
   return (
-    <main className="min-h-screen bg-[var(--color-background)] flex items-center justify-center px-[var(--spacing-gutter)] py-[80px]">
-      <div className="w-full max-w-[560px]">
-        {state === "loading" && (
-          <div className="glass-panel rounded-xl p-[48px] text-center">
-            <div className="flex justify-center mb-6">
-              <span className="material-symbols-outlined text-[48px] text-primary animate-spin">
-                progress_activity
-              </span>
-            </div>
-            <p className="text-on-surface-variant text-lg">
-              Đang xử lý thanh toán của bạn...
-            </p>
+    <>
+      {state === "loading" && (
+        <div className="glass-panel rounded-xl p-[48px] text-center">
+          <div className="flex justify-center mb-6">
+            <span className="material-symbols-outlined text-[48px] text-primary animate-spin">
+              progress_activity
+            </span>
           </div>
-        )}
+          <p className="text-on-surface-variant text-lg">
+            Đang xử lý thanh toán của bạn...
+          </p>
+        </div>
+      )}
 
-        {state === "success" && (
-          <div className="glass-panel rounded-xl p-[48px] text-center relative overflow-hidden">
-            <div className="absolute top-0 left-0 w-full h-[1px] bg-gradient-to-r from-transparent via-primary/20 to-transparent" />
+      {state === "success" && (
+        <div className="glass-panel rounded-xl p-[48px] text-center relative overflow-hidden">
+          <div className="absolute top-0 left-0 w-full h-[1px] bg-gradient-to-r from-transparent via-primary/20 to-transparent" />
 
-            <div className="flex justify-center mb-6">
-              <span className="material-symbols-outlined text-[64px] text-green-400">
-                check_circle
-              </span>
-            </div>
+          <div className="flex justify-center mb-6">
+            <span className="material-symbols-outlined text-[64px] text-green-400">
+              check_circle
+            </span>
+          </div>
 
-            <h1 className="font-[var(--font-display-lg)] text-[clamp(1.5rem,3vw,2rem)] text-on-surface mb-3 leading-[1.2]">
-              Thanh toán thành công!
-            </h1>
+          <h1 className="font-[var(--font-display-lg)] text-[clamp(1.5rem,3vw,2rem)] text-on-surface mb-3 leading-[1.2]">
+            Thanh toán thành công!
+          </h1>
 
-            <p className="text-on-surface-variant text-base mb-8">
-              Cảm ơn bạn đã đăng ký tham dự IPv6 Summit.
-            </p>
+          <p className="text-on-surface-variant text-base mb-8">
+            Cảm ơn bạn đã đăng ký tham dự IPv6 Summit.
+          </p>
 
-            <div className="bg-[var(--color-surface-container-high)] rounded-lg p-6 mb-8 text-left space-y-3">
-              {registrationId && (
-                <div className="flex items-center justify-between">
-                  <span className="text-on-surface-variant text-sm">Mã đăng ký</span>
-                  <span className="text-primary font-mono font-medium">
-                    #{registrationId}
-                  </span>
-                </div>
-              )}
+          <div className="bg-[var(--color-surface-container-high)] rounded-lg p-6 mb-8 text-left space-y-3">
+            {registrationId && (
               <div className="flex items-center justify-between">
-                <span className="text-on-surface-variant text-sm">Số tiền đã thanh toán</span>
-                <span className="text-on-surface font-medium">$120 USD</span>
+                <span className="text-on-surface-variant text-sm">Mã đăng ký</span>
+                <span className="text-primary font-mono font-medium">
+                  #{registrationId}
+                </span>
               </div>
-            </div>
-
-            <p className="text-on-surface-variant text-sm">
-              Chúng tôi sẽ liên hệ với bạn qua email để xác nhận.
-            </p>
-
-            <div className="mt-8">
-              <Link
-                href="/"
-                className="inline-flex items-center gap-2 text-primary hover:text-on-surface transition-colors text-sm"
-              >
-                <span className="material-symbols-outlined text-[18px]">home</span>
-                Về trang chủ
-              </Link>
+            )}
+            <div className="flex items-center justify-between">
+              <span className="text-on-surface-variant text-sm">Số tiền đã thanh toán</span>
+              <span className="text-on-surface font-medium">$120 USD</span>
             </div>
           </div>
-        )}
 
-        {state === "error" && (
-          <div className="glass-panel rounded-xl p-[48px] text-center relative overflow-hidden">
-            <div className="absolute top-0 left-0 w-full h-[1px] bg-gradient-to-r from-transparent via-primary/20 to-transparent" />
-
-            <div className="flex justify-center mb-6">
-              <span className="material-symbols-outlined text-[64px] text-red-400">
-                error
-              </span>
-            </div>
-
-            <h1 className="font-[var(--font-display-lg)] text-[clamp(1.5rem,3vw,2rem)] text-on-surface mb-3 leading-[1.2]">
-              Có lỗi xảy ra
-            </h1>
-
-            {errorMessage && (
-              <p className="text-on-surface-variant text-base mb-8">
-                {errorMessage}
-              </p>
-            )}
+          <p className="text-on-surface-variant text-sm">
+            Chúng tôi sẽ liên hệ với bạn qua email để xác nhận.
+          </p>
 
+          <div className="mt-8">
             <Link
-              href="/registration"
-              className="inline-flex items-center gap-2 px-6 py-3 rounded-lg gold-gradient-bg text-on-primary font-medium transition-opacity hover:opacity-90"
+              href="/"
+              className="inline-flex items-center gap-2 text-primary hover:text-on-surface transition-colors text-sm"
             >
-              <span className="material-symbols-outlined text-[18px]">refresh</span>
-              Thử lại đăng ký
+              <span className="material-symbols-outlined text-[18px]">home</span>
+              Về trang chủ
             </Link>
           </div>
-        )}
+        </div>
+      )}
+
+      {state === "error" && (
+        <div className="glass-panel rounded-xl p-[48px] text-center relative overflow-hidden">
+          <div className="absolute top-0 left-0 w-full h-[1px] bg-gradient-to-r from-transparent via-primary/20 to-transparent" />
+
+          <div className="flex justify-center mb-6">
+            <span className="material-symbols-outlined text-[64px] text-red-400">
+              error
+            </span>
+          </div>
+
+          <h1 className="font-[var(--font-display-lg)] text-[clamp(1.5rem,3vw,2rem)] text-on-surface mb-3 leading-[1.2]">
+            Có lỗi xảy ra
+          </h1>
+
+          {errorMessage && (
+            <p className="text-on-surface-variant text-base mb-8">
+              {errorMessage}
+            </p>
+          )}
+
+          <Link
+            href="/registration"
+            className="inline-flex items-center gap-2 px-6 py-3 rounded-lg gold-gradient-bg text-on-primary font-medium transition-opacity hover:opacity-90"
+          >
+            <span className="material-symbols-outlined text-[18px]">refresh</span>
+            Thử lại đăng ký
+          </Link>
+        </div>
+      )}
+    </>
+  );
+}
+
+export default function RegistrationSuccessPage() {
+  return (
+    <main className="min-h-screen bg-[var(--color-background)] flex items-center justify-center px-[var(--spacing-gutter)] py-[80px]">
+      <div className="w-full max-w-[560px]">
+        <Suspense
+          fallback={
+            <div className="glass-panel rounded-xl p-[48px] text-center">
+              <div className="flex justify-center mb-6">
+                <span className="material-symbols-outlined text-[48px] text-primary animate-spin">
+                  progress_activity
+                </span>
+              </div>
+              <p className="text-on-surface-variant text-lg">
+                Đang tải...
+              </p>
+            </div>
+          }
+        >
+          <SuccessContent />
+        </Suspense>
       </div>
     </main>
   );