From 3ad7651cd815180ac480265de3da70814f35924b Mon Sep 17 00:00:00 2001
From: Admin <admin@domovoy.local>
Date: Fri, 26 Jun 2026 21:03:23 +0400
Subject: [PATCH] Style: enhance Web Admin UI with Glassmorphism styles and
 animations from Swarm Dashboard

---
 web/static/css/matrix.css | 62 +++++++++++++++++++++++++++++++++++++++
 1 file changed, 62 insertions(+)

diff --git a/web/static/css/matrix.css b/web/static/css/matrix.css
index 0a350a9..314d147 100644
--- a/web/static/css/matrix.css
+++ b/web/static/css/matrix.css
@@ -325,3 +325,65 @@ pre, code {
     background: rgba(255, 255, 255, 0.15);
 }
 
+/* Дополнения для соответствия Swarm Dashboard */
+.glass-panel {
+    background: var(--panel-bg) !important;
+    backdrop-filter: blur(12px) !important;
+    -webkit-backdrop-filter: blur(12px) !important;
+    border: 1px solid var(--panel-border) !important;
+    border-radius: 16px !important;
+    padding: 24px !important;
+    transition: var(--transition-smooth) !important;
+}
+
+.glass-panel:hover {
+    background: var(--panel-bg-hover) !important;
+    border-color: var(--panel-border-hover) !important;
+    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4) !important;
+}
+
+@keyframes neonPulseSuccess {
+    0%, 100% { box-shadow: 0 0 8px var(--color-success-glow); }
+    50% { box-shadow: 0 0 18px rgba(0, 255, 204, 0.6); }
+}
+
+@keyframes neonPulseDanger {
+    0%, 100% { box-shadow: 0 0 8px var(--color-danger-glow); }
+    50% { box-shadow: 0 0 18px rgba(255, 45, 85, 0.6); }
+}
+
+@keyframes neonPulsePrimary {
+    0%, 100% { box-shadow: 0 0 8px var(--color-primary-glow); }
+    50% { box-shadow: 0 0 18px rgba(138, 43, 226, 0.6); }
+}
+
+.glow-success {
+    animation: neonPulseSuccess 3s infinite alternate !important;
+}
+
+.glow-danger {
+    animation: neonPulseDanger 3s infinite alternate !important;
+}
+
+.glow-primary {
+    animation: neonPulsePrimary 3s infinite alternate !important;
+}
+
+.text-gradient {
+    background: linear-gradient(135deg, #fff 0%, var(--color-text-muted) 100%) !important;
+    -webkit-background-clip: text !important;
+    -webkit-text-fill-color: transparent !important;
+}
+
+.text-gradient-neon {
+    background: linear-gradient(135deg, #00ffcc 0%, #8a2be2 100%) !important;
+    -webkit-background-clip: text !important;
+    -webkit-text-fill-color: transparent !important;
+}
+
+.flex-center {
+    display: flex !important;
+    align-items: center !important;
+    justify-content: center !important;
+}
+