From c9e4dc2c1655b24617c80d74e33492659561d1e6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=89=A1=E8=9B=8E?= <tzwlink@163.com>
Date: Fri, 12 Sep 2025 12:44:35 +0800
Subject: [PATCH] =?UTF-8?q?feat(404.html,=20500.html):=20=E6=9B=B4?=
 =?UTF-8?q?=E6=96=B0=E5=8A=A8=E7=94=BB=E6=95=88=E6=9E=9C=EF=BC=8C=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0=E6=96=B0=E7=9A=84=E7=BA=BF=E6=9D=A1=E5=8A=A8=E7=94=BB?=
 =?UTF-8?q?=E5=92=8C=E8=B0=83=E6=95=B4=E7=8E=B0=E6=9C=89=E5=8A=A8=E7=94=BB?=
 =?UTF-8?q?=E5=8F=82=E6=95=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 html/404.html | 38 +++++++++++++++++++++++++++++++-------
 html/500.html | 30 ++++++++++++++++++++++++++----
 2 files changed, 57 insertions(+), 11 deletions(-)

diff --git a/html/404.html b/html/404.html
index 79d1ae2..794104c 100644
--- a/html/404.html
+++ b/html/404.html
@@ -92,10 +92,21 @@
             top: 50%;
             left: 50%;
             transform: translate(-50%, -50%);
-            animation: lineFloat 8s ease-in-out infinite;
             background: var(--line-color);
             transition: background 0.3s ease;
         }
+        .horizontal-line {
+            animation: lineFloatH 8s ease-in-out infinite;
+        }
+        .vertical-line {
+            animation: lineFloatV 10s ease-in-out infinite;
+        }
+        .diagonal-line-1 {
+            animation: lineFloatD1 12s ease-in-out infinite;
+        }
+        .diagonal-line-2 {
+            animation: lineFloatD2 14s ease-in-out infinite;
+        }
         
         .horizontal-line {
             width: 60%;
@@ -105,21 +116,18 @@
         .vertical-line {
             width: 2px;
             height: 60%;
-            animation-delay: 2s;
         }
         
         .diagonal-line-1 {
             width: 70%;
             height: 2px;
             transform: translate(-50%, -50%) rotate(45deg);
-            animation-delay: 4s;
         }
         
         .diagonal-line-2 {
             width: 70%;
             height: 2px;
             transform: translate(-50%, -50%) rotate(-45deg);
-            animation-delay: 6s;
         }
         
         /* 漂浮的点 */
@@ -239,11 +247,27 @@
         }
         
         /* 动画 */
-        @keyframes lineFloat {
+        @keyframes lineFloatH {
             0%, 100% { transform: translate(-50%, -50%) rotate(0deg); }
-            25% { transform: translate(-50%, -50%) rotate(5deg); }
+            25% { transform: translate(-50%, -50%) rotate(6deg); }
             50% { transform: translate(-50%, -50%) rotate(0deg); }
-            75% { transform: translate(-50%, -50%) rotate(-5deg); }
+            75% { transform: translate(-50%, -50%) rotate(-6deg); }
+        }
+        @keyframes lineFloatV {
+            0%, 100% { transform: translate(-50%, -50%) rotate(0deg); }
+            20% { transform: translate(-50%, -50%) rotate(5deg); }
+            50% { transform: translate(-50%, -50%) rotate(0deg); }
+            80% { transform: translate(-50%, -50%) rotate(-5deg); }
+        }
+        @keyframes lineFloatD1 {
+            0%, 100% { transform: translate(-50%, -50%) rotate(20deg); }
+            30% { transform: translate(-50%, -50%) rotate(25deg); }
+            60% { transform: translate(-50%, -50%) rotate(15deg); }
+        }
+        @keyframes lineFloatD2 {
+            0%, 100% { transform: translate(-50%, -50%) rotate(-20deg); }
+            40% { transform: translate(-50%, -50%) rotate(-15deg); }
+            70% { transform: translate(-50%, -50%) rotate(-25deg); }
         }
         
         @keyframes floatDot {
diff --git a/html/500.html b/html/500.html
index c85b3d7..835cb7f 100644
--- a/html/500.html
+++ b/html/500.html
@@ -125,9 +125,24 @@
             position: absolute;
             background: var(--line-color);
             transform-origin: center;
-            animation: lineMove 8s ease-in-out infinite;
             transition: background 0.3s ease;
         }
+        .line-1 {
+            width: 2px;
+            height: 200px;
+            top: 50%;
+            left: 30%;
+            transform: translateY(-50%) rotate(45deg);
+            animation: lineMove1 9s ease-in-out infinite;
+        }
+        .line-2 {
+            width: 2px;
+            height: 150px;
+            top: 40%;
+            right: 30%;
+            transform: translateY(-50%) rotate(-45deg);
+            animation: lineMove2 11s ease-in-out infinite;
+        }
         
         .line-1 {
             width: 2px;
@@ -144,7 +159,7 @@
             top: 40%;
             right: 30%;
             transform: translateY(-50%) rotate(-45deg);
-            animation-delay: 2s;
+            animation-delay: 0s;
         }
         
         .dot {
@@ -226,9 +241,16 @@
             to { transform: rotate(360deg); }
         }
         
-        @keyframes lineMove {
+        
+        @keyframes lineMove1 {
             0%, 100% { transform: translateY(-50%) rotate(45deg); }
-            50% { transform: translateY(-50%) rotate(135deg); }
+            30% { transform: translateY(-50%) rotate(60deg); }
+            60% { transform: translateY(-50%) rotate(30deg); }
+        }
+        @keyframes lineMove2 {
+            0%, 100% { transform: translateY(-50%) rotate(-45deg); }
+            40% { transform: translateY(-50%) rotate(-30deg); }
+            80% { transform: translateY(-50%) rotate(-60deg); }
         }
         
         @keyframes pulse {