From dd3912545dedf4c6673b21d6e84f693917dff23e Mon Sep 17 00:00:00 2001
From: yarnom <admin@yarnom.com>
Date: Mon, 3 Nov 2025 17:14:36 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=A4=A7=E5=B1=8F=E5=B9=95=E7=9A=84?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 templates/bigscreen.html | 61 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 61 insertions(+)

diff --git a/templates/bigscreen.html b/templates/bigscreen.html
index 16e5ec3..e1e0a07 100644
--- a/templates/bigscreen.html
+++ b/templates/bigscreen.html
@@ -191,6 +191,8 @@
             color: #bd6718;
             font-size: 1.7rem;
             font-weight: 600;
+            padding: 0.1rem 0.35rem;
+            border-radius: var(--radius-1);
         }
         /* 预警时：pastAccuracySummary 字体稍微变大，颜色保持 #bcd0ff */
         .summary-panel.alert-on .summary-sub {
@@ -209,6 +211,8 @@
             color: #b81f1f;
             font-size: 1.7rem;
             font-weight: 600;
+            padding: 0.1rem 0.35rem;
+            border-radius: var(--radius-1);
         }
         .summary-panel.alert-red .summary-sub {
             color: #bcd0ff;
@@ -220,17 +224,74 @@
             box-shadow:
                 inset 0 0 20rem var(--orange-shadow-3),
                 inset 0 0 20rem var(--orange-shadow-1);
+            animation: screenGlowOrange 1.8s ease-in-out infinite;
+        }
+        @keyframes screenGlowOrange {
+            0%, 100% { box-shadow:
+                inset 0 0 20rem var(--orange-shadow-3),
+                inset 0 0 20rem var(--orange-shadow-1);
+            }
+            50% { box-shadow: none; }
         }
         .screen.alert-red {
             box-shadow:
                 inset 0 0 20rem rgba(255, 107, 107, 0.25),
                 inset 0 0 20rem rgba(255, 107, 107, 0.35);
+            animation: screenGlowRed 1.8s ease-in-out infinite;
+        }
+        @keyframes screenGlowRed {
+            0%, 100% { box-shadow:
+                inset 0 0 20rem rgba(255, 107, 107, 0.25),
+                inset 0 0 20rem rgba(255, 107, 107, 0.35);
+            }
+            50% { box-shadow: none; }
         }
 
         /* 减少动画偏好时关闭动画（目前无动画，但作为扩展） */
         @media (prefers-reduced-motion: reduce) {
             * { animation: none !important; }
         }
+
+        /* Panel 与文字整体闪烁：橙色 */
+        .summary-panel.alert-on { animation: panelGlowOrange 1.8s ease-in-out infinite; }
+        .summary-panel.alert-on .summary-title,
+        .summary-panel.alert-on .summary-sub { animation: textPulseOrange 1.8s ease-in-out infinite; }
+        @keyframes panelGlowOrange {
+            0%, 100% {
+                background: linear-gradient(180deg, var(--orange-bg-1), var(--orange-bg-2));
+                border-color: var(--orange-border);
+                box-shadow: 0 0.375rem 1.125rem var(--orange-shadow-1), 0 0 0 1px var(--orange-shadow-2) inset, 0 0 1.5rem var(--orange-shadow-3) inset;
+            }
+            50% {
+                background: var(--color-bg);
+                border-color: var(--panel-border);
+                box-shadow: none;
+            }
+        }
+        @keyframes textPulseOrange {
+            0%, 100% { /* 使用各自定义色 */ }
+            50% { color: var(--color-fg); }
+        }
+        /* Panel 与文字整体闪烁：红色 */
+        .summary-panel.alert-red { animation: panelGlowRed 1.8s ease-in-out infinite; }
+        .summary-panel.alert-red .summary-title,
+        .summary-panel.alert-red .summary-sub { animation: textPulseRed 1.8s ease-in-out infinite; }
+        @keyframes panelGlowRed {
+            0%, 100% {
+                background: linear-gradient(180deg, rgba(255, 107, 107, 0.22), rgba(255, 107, 107, 0.12));
+                border-color: rgba(200, 40, 40, 0.6);
+                box-shadow: 0 0.375rem 1.125rem rgba(255, 107, 107, 0.35), 0 0 0 1px rgba(255,107,107,0.10) inset, 0 0 1.5rem rgba(255, 107, 107, 0.25) inset;
+            }
+            50% {
+                background: var(--color-bg);
+                border-color: var(--panel-border);
+                box-shadow: none;
+            }
+        }
+        @keyframes textPulseRed {
+            0%, 100% { /* 使用各自定义色 */ }
+            50% { color: var(--color-fg); }
+        }
     </style>
 </head>
 <body>