Update index.html

index.html

@@ -663,20 +663,26 @@
             display: none;
         }
         
-        .sync-status {
-            position: absolute;
-            bottom: 60px;
-            left: 10px;
-            background-color: rgba(0, 0, 0, 0.7);
-            color: #64ffda;
-            padding: 5px 10px;
-            border-radius: 3px;
-            font-size: 12px;
-            z-index: 5;
-            display: flex;
-            align-items: center;
-            gap: 5px;
-        }
+.sync-status {
+    position: fixed; /* 位置を完全に固定 */
+    bottom: 60px;
+    left: 10px;
+    width: 120px; /* 幅を固定 */
+    height: 30px;  /* 高さを固定 */
+    background-color: rgba(0, 0, 0, 0.7);
+    color: #64ffda;
+    padding: 0 10px; /* パディングは横のみ */
+    border-radius: 3px;
+    font-size: 12px;
+    z-index: 9999; /* 他要素より前に */
+    display: flex;
+    align-items: center;
+    justify-content: center; /* 中央寄せ */
+    gap: 5px;
+    overflow: hidden; /* 内容がはみ出たら隠す */
+    pointer-events: none; /* ドラッグなどの操作を防止したい場合 */
+    user-select: none; /* テキスト選択禁止 */
+}
         
         .sync-status button {
             background: none;