diff --git a/public/oauth/callback/index.html b/public/oauth/callback/index.html
index 56b21b9..b676e1e 100644
--- a/public/oauth/callback/index.html
+++ b/public/oauth/callback/index.html
@@ -21,6 +21,7 @@
       background: rgba(255, 255, 255, 0.1);
       border-radius: 20px;
       backdrop-filter: blur(10px);
+      max-width: 400px;
     }
     .spinner {
       border: 4px solid rgba(255, 255, 255, 0.3);
@@ -35,6 +36,28 @@
       0% { transform: rotate(0deg); }
       100% { transform: rotate(360deg); }
     }
+    .message {
+      font-size: 18px;
+      margin-bottom: 20px;
+    }
+    .button {
+      display: inline-block;
+      padding: 15px 30px;
+      font-size: 18px;
+      font-weight: bold;
+      color: white;
+      background: rgba(255, 255, 255, 0.2);
+      border: 2px solid white;
+      border-radius: 10px;
+      text-decoration: none;
+      transition: all 0.3s;
+      cursor: pointer;
+      margin-top: 10px;
+    }
+    .button:hover {
+      background: rgba(255, 255, 255, 0.3);
+      transform: scale(1.05);
+    }
     .error {
       color: #ff6b6b;
       background: rgba(255, 255, 255, 0.9);
@@ -45,8 +68,10 @@
 </head>
 <body>
   <div class="container">
-    <div class="spinner"></div>
-    <p id="status">認証中...</p>
+    <div id="content">
+      <div class="spinner"></div>
+      <p class="message">認証中...</p>
+    </div>
   </div>
 
   <script>
@@ -62,61 +87,38 @@
         console.log('OAuth callback page loaded');
         console.log('Params:', { code: code ? 'present' : 'missing', state: state ? 'present' : 'missing' });
 
+        const content = document.getElementById('content');
+
         // エラーチェック
         if (error) {
-          document.getElementById('status').innerHTML =
-            `<div class="error">認証エラー: ${errorDescription || error}</div>`;
+          content.innerHTML = `<div class="error">認証エラー: ${errorDescription || error}</div>`;
           return;
         }
 
         if (!code || !state) {
-          document.getElementById('status').innerHTML =
-            '<div class="error">認証パラメータが不足しています</div>';
+          content.innerHTML = '<div class="error">認証パラメータが不足しています</div>';
           return;
         }
 
-        // React Nativeアプリに戻す (deep link)
-        const deepLink = `aicard://oauth/callback?code=${encodeURIComponent(code)}&state=${encodeURIComponent(state)}`;
+        // Universal Links用: 現在のHTTPS URLがそのままアプリに渡される
+        // iOSがUniversal Linkを認識すれば自動的にアプリが開く
+        console.log('Waiting for Universal Link to trigger...');
 
-        console.log('Deep link:', deepLink);
-        document.getElementById('status').innerHTML = 'アプリに戻っています...<br><small>' + deepLink + '</small>';
-
-        // Method 1: iframe approach
-        const iframe = document.createElement('iframe');
-        iframe.style.display = 'none';
-        iframe.src = deepLink;
-        document.body.appendChild(iframe);
-
-        // Method 2: Direct window.location
+        // 3秒後にフォールバックメッセージを表示
         setTimeout(() => {
-          console.log('Attempting window.location redirect');
-          window.location.href = deepLink;
-        }, 500);
+          // カスタムスキームのDeep Linkを生成（フォールバック用）
+          const deepLink = `aicard://oauth/callback?code=${encodeURIComponent(code)}&state=${encodeURIComponent(state)}`;
 
-        // Method 3: Link click simulation
-        setTimeout(() => {
-          console.log('Attempting link click');
-          const link = document.createElement('a');
-          link.href = deepLink;
-          link.click();
-        }, 1000);
-
-        // Method 4: Window.open
-        setTimeout(() => {
-          console.log('Attempting window.open');
-          window.open(deepLink, '_self');
-        }, 1500);
-
-        // フォールバック: 5秒後にメッセージ表示
-        setTimeout(() => {
-          document.getElementById('status').innerHTML =
-            '<div class="error">アプリが開かない場合は、下のリンクをタップしてください<br><br>' +
-            '<a href="' + deepLink + '" style="color: white; text-decoration: underline; font-size: 18px;">Aicardアプリを開く</a></div>';
-        }, 5000);
+          content.innerHTML = `
+            <div class="message">認証が完了しました</div>
+            <p style="font-size: 14px; opacity: 0.9;">アプリが自動的に開かない場合は、<br>下のボタンをタップしてください</p>
+            <a href="${deepLink}" class="button">アプリを開く</a>
+          `;
+        }, 3000);
 
       } catch (err) {
         console.error('Callback error:', err);
-        document.getElementById('status').innerHTML =
+        document.getElementById('content').innerHTML =
           `<div class="error">エラーが発生しました: ${err.message}</div>`;
       }
     })();
