:root{--bg-deep:#f0f4ff;--bg-primary:#f5f7fb;--bg-secondary:#f8fafd;--bg-elevated:#fff;--bg-card:#ffffffd1;--bg-card-hover:#fffffff0;--bg-sidebar:#ffffffe0;--bg-input:#ffffffd9;--color-primary:#3b82f6;--color-primary-hover:#60a5fa;--color-primary-pressed:#2563eb;--color-primary-dim:#3b82f61a;--color-primary-glow:#3b82f62e;--color-cyan:#06b6d4;--color-cyan-dim:#06b6d41a;--color-purple:#8b5cf6;--color-purple-dim:#8b5cf61a;--color-purple-glow:#8b5cf629;--color-green:#10b981;--color-green-dim:#10b9811a;--color-green-glow:#10b98129;--color-blue:#3b82f6;--color-blue-dim:#3b82f61a;--color-warning:#f59e0b;--color-warning-dim:#f59e0b1a;--color-danger:#ef4444;--color-danger-dim:#ef44441a;--color-info:#06b6d4;--color-info-dim:#06b6d41a;--border-color:#3b82f61a;--border-glow:#3b82f640;--border-elevated:#0000000f;--text-primary:#1e293b;--text-secondary:#64748b;--text-muted:#94a3b8;--text-inverse:#fff;--radius-xs:4px;--radius-sm:6px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-2xl:20px;--shadow-sm:0 1px 2px #0000000a;--shadow-card:0 0 0 1px #3b82f60f, 0 2px 12px #0000000a, 0 0 40px #3b82f605;--shadow-card-hover:0 0 0 1px #3b82f624, 0 6px 20px #00000012, 0 0 60px #3b82f60d;--shadow-glow:0 0 16px #3b82f61f, 0 0 32px #3b82f60a;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--ease-spring:cubic-bezier(.34, 1.56, .64, 1);--ease-standard:cubic-bezier(.2, 0, 0, 1);--ease-decelerate:cubic-bezier(0, 0, .2, 1);--ease-accelerate:cubic-bezier(.3, 0, 1, 1);--duration-fast:.12s;--duration-normal:.24s;--duration-slow:.38s;--font-mono:"JetBrains Mono", "Fira Code", "Cascadia Code", "Consolas", monospace;--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{font-family:var(--font-sans);color:var(--text-primary);background:radial-gradient(60% 50% at 20% 20%,#3b82f60a 0%,#0000 60%),radial-gradient(50% 40% at 75% 55%,#06b6d408 0%,#0000 60%),radial-gradient(40% 30% at 50% 85%,#8b5cf608 0%,#0000 60%),linear-gradient(160deg,#f0f4ff 0%,#f5f7fb 40%,#f8fafd 100%);min-height:100vh;overflow-x:hidden}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:linear-gradient(180deg, var(--color-primary-dim), #3b82f647);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:linear-gradient(#3b82f666,#3b82f68c)}::-webkit-scrollbar-corner{background:0 0}::selection{color:var(--text-primary);background:#3b82f640}.bg-grid{pointer-events:none;z-index:0;opacity:.04;background-image:linear-gradient(#3b82f680 1px,#0000 1px),linear-gradient(90deg,#3b82f680 1px,#0000 1px);background-size:60px 60px;animation:30s linear infinite gridScroll;position:fixed;inset:0}@keyframes gridScroll{0%{background-position:0 0}to{background-position:60px 60px}}.scan-line-decoration{z-index:200;pointer-events:none;background:linear-gradient(90deg,#0000 0% 20%,#3b82f659 50%,#0000 80% 100%);height:1px;animation:5s ease-in-out infinite scanPulse;position:fixed;top:0;left:0;right:0}@keyframes scanPulse{0%,to{opacity:.25}50%{opacity:.8}}.glow-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(20px);box-shadow:var(--shadow-card);transition:border-color var(--duration-normal) var(--ease-standard), box-shadow var(--duration-normal) var(--ease-standard), transform var(--duration-normal) var(--ease-standard)}.glow-card:hover{border-color:var(--border-glow);box-shadow:var(--shadow-card-hover);transform:translateY(-1px)}.glow-card:active{transform:translateY(0)}.glow-card-accent{border-color:#3b82f633;box-shadow:0 0 14px #3b82f614,0 6px 28px #0000000f}.glow-card-accent:hover{border-color:#3b82f659;box-shadow:0 0 20px #3b82f624,0 6px 40px #00000014}.outlined-card{border:1px solid var(--border-color);border-radius:var(--radius-md);transition:border-color var(--duration-fast) var(--ease-standard);background:0 0}.outlined-card:hover{border-color:var(--border-glow)}.stat-number{font-family:var(--font-mono);letter-spacing:-.02em;background:linear-gradient(135deg, var(--color-primary), var(--color-cyan));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:2rem;font-weight:700}.stat-number-sm{font-family:var(--font-mono);letter-spacing:-.01em;background:linear-gradient(135deg, var(--color-primary), var(--color-blue));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.25rem;font-weight:600}.stat-number-xl{font-family:var(--font-mono);letter-spacing:-.03em;background:linear-gradient(135deg, var(--color-primary) 0%, var(--color-purple) 50%, var(--color-cyan) 100%);-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 6px #3b82f640);-webkit-background-clip:text;background-clip:text;font-size:2.75rem;font-weight:800}.page-header{margin-bottom:var(--space-6);padding-left:var(--space-4);position:relative}.page-header:before{content:"";background:linear-gradient(180deg, var(--color-primary), var(--color-purple));border-radius:2px;width:3px;position:absolute;top:4px;bottom:4px;left:0;box-shadow:0 0 6px #3b82f638}.page-header h2{color:var(--text-primary);letter-spacing:.5px;font-size:1.5rem;font-weight:700}.page-header .subtitle{color:var(--text-secondary);margin-top:2px;font-size:.85rem}.code-text{font-family:var(--font-mono);color:var(--color-primary);background:var(--color-primary-dim);border-radius:var(--radius-xs);letter-spacing:.5px;border:1px solid #3b82f62e;padding:2px 8px;font-size:.85rem}.code-block{font-family:var(--font-mono);color:var(--color-primary);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3);background:#3b82f60a;border:1px solid #3b82f61a;font-size:.82rem;line-height:1.6}.status-dot{border-radius:50%;width:8px;height:8px;margin-right:6px;display:inline-block;position:relative}.status-dot.online{background:var(--color-green);box-shadow:0 0 6px var(--color-green-glow);animation:2s ease-in-out infinite dotPulse}.status-dot.offline{background:var(--text-muted);box-shadow:none}.status-dot.warning{background:var(--color-warning);box-shadow:0 0 6px #f59e0b4d}@keyframes dotPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.3)}}.glow-progress{background:#0000000d;border-radius:4px;height:8px;position:relative;overflow:hidden}.glow-progress-fill{background:linear-gradient(90deg, var(--color-primary), var(--color-cyan));height:100%;transition:width var(--duration-slow) var(--ease-decelerate);border-radius:4px;position:relative;box-shadow:0 0 6px #3b82f638}.glow-progress-fill:after{content:"";background:linear-gradient(90deg,#0000,#fff3);width:30px;position:absolute;top:0;bottom:0;right:0}.glow-divider{background:linear-gradient(90deg, transparent 0%, var(--border-color) 20%, var(--border-glow) 50%, var(--border-color) 80%, transparent 100%);height:1px;margin:var(--space-4) 0;border:none}.skeleton{border-radius:var(--radius-sm);background:linear-gradient(90deg,#00000008 25%,#0000000f 50%,#00000008 75%) 0 0/200% 100%;animation:1.8s ease-in-out infinite skeletonWave}@keyframes skeletonWave{0%{background-position:200% 0}to{background-position:-200% 0}}.page-container,.dashboard,.device-management{width:100%;max-width:1600px;margin:0 auto}@media (width<=1024px){html{font-size:15px}:root{--shadow-card:0 0 0 1px #3b82f60f, 0 2px 8px #0000000a}.stat-number{font-size:1.6rem}.stat-number-xl{font-size:2.2rem}}@media (width<=768px){html{font-size:14px}.stat-number{font-size:1.4rem}.stat-number-xl{font-size:1.8rem}}
