feat: UI/UX全面优化 — CSS变量体系/a11y无障碍/Admin角色化/骨架屏/打印样式

stock-html/static/css/base.css

@@ -7,14 +7,29 @@
             --bg-dark: #0a0a0a;
             --bg-glass: rgba(255, 255, 255, 0.05);
             --bg-glass-hover: rgba(255, 255, 255, 0.08);
+            --bg-secondary: rgba(255, 255, 255, 0.06);
             --border-glass: rgba(255, 255, 255, 0.1);
+            --border-color: rgba(255, 255, 255, 0.1);
             --text-primary: #ffffff;
             --text-secondary: rgba(255, 255, 255, 0.7);
             --text-muted: rgba(255, 255, 255, 0.4);
             --accent: #ffffff;
+            --primary: #6c5ce7;
             --success: #00ff88;
             --danger: #ff4444;
             --warning: #ffaa00;
+            --info: #3b82f6;
+            /* 信号强度色系 */
+            --sig-85: #ff4444;
+            --sig-80: #ff6b35;
+            --sig-75: #4caf50;
+            --sig-70: #2196f3;
+            --sig-65: #9c27b0;
+            --sig-60: #ff9800;
+            --sig-55: #607d8b;
+            /* 涨跌色（红涨绿跌） */
+            --up: #ff4444;
+            --down: #00c853;
         }
         
         [v-cloak] {
@@ -706,4 +721,56 @@
             font-size: 18px;
             font-weight: 600;
         }
+
+        /* ===== 骨架屏 ===== */
+        .skeleton-card {
+            background: var(--bg-glass);
+            border-radius: 12px;
+            padding: 16px;
+            margin-bottom: 8px;
+            border: 1px solid var(--border-color);
+        }
+        .skeleton-line {
+            height: 14px;
+            border-radius: 6px;
+            background: linear-gradient(90deg, rgba(255,255,255,0.04) 25%, rgba(255,255,255,0.08) 50%, rgba(255,255,255,0.04) 75%);
+            background-size: 200% 100%;
+            animation: skeleton-shimmer 1.5s infinite;
+            margin-bottom: 8px;
+        }
+        .skeleton-line.short { width: 40%; }
+        .skeleton-line.medium { width: 65%; }
+        .skeleton-line.long { width: 90%; }
+        .skeleton-line:last-child { margin-bottom: 0; }
+        @keyframes skeleton-shimmer {
+            0% { background-position: 200% 0; }
+            100% { background-position: -200% 0; }
+        }
+        .skeleton-grid {
+            display: grid;
+            grid-template-columns: repeat(2, 1fr);
+            gap: 8px;
+        }
+
+        /* ===== 空状态优化 ===== */
+        .empty-state {
+            text-align: center;
+            padding: 40px 20px;
+            color: var(--text-muted);
+        }
+        .empty-state-icon {
+            font-size: 32px;
+            margin-bottom: 12px;
+            opacity: 0.5;
+        }
+        .empty-state-title {
+            font-size: 15px;
+            color: var(--text-secondary);
+            margin-bottom: 6px;
+        }
+        .empty-state-desc {
+            font-size: 13px;
+            color: var(--text-muted);
+            line-height: 1.5;
+        }