@font-face {
      font-family: 'BrandFont';
      src: url('/static/lib/NotoSansSC-subset.woff2') format('woff2');
      font-weight: 900;
      font-style: normal;
      font-display: swap;
    }
    /* ===== Design Tokens ===== */
    :root {
      /* Brand */
      --brand: #667eea;
      --brand-light: #8b9cf7;
      --brand-dark: #5a6fd6;
      --purple: #a855f7;
      --pink: #ec4899;

      /* Background */
      --bg-deep: #0a0a1a;
      --bg-body: #0d0d22;
      --bg-card: rgba(255,255,255,0.02);
      --bg-card-hover: rgba(255,255,255,0.04);

      /* Border */
      --border-subtle: rgba(255,255,255,0.04);
      --border-light: rgba(255,255,255,0.06);
      --border-hover: rgba(255,255,255,0.12);

      /* Text */
      --text-primary: #f0f0f8;
      --text-secondary: #8888a8;
      --text-muted: #555570;
      --text-brand: #a8b2ff;

      /* Radius */
      --radius-sm: 8px;
      --radius-md: 12px;
      --radius-lg: 16px;
      --radius-xl: 20px;

      /* Spacing */
      --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;
      --space-16: 64px;
      --space-20: 80px;
      --space-24: 100px;

      /* Shadow */
      --shadow-glow: 0 0 0 3px rgba(102,126,234,0.10);
      --shadow-btn: 0 8px 24px rgba(102,126,234,0.30);
      --shadow-card: 0 12px 40px rgba(0,0,0,0.30);

      /* Element Plus 深色覆盖变量 */
      --el-table-header-bg-color: rgba(30,30,60,0.95);
      --el-table-tr-bg-color: transparent;
      --el-table-bg-color: transparent;
      --el-border-color: rgba(255,255,255,0.06);

      /* Transition */
      --transition-fast: 0.2s;
      --transition-normal: 0.3s;
    }

    * { margin: 0; padding: 0; box-sizing: border-box; }
    body {
      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Noto Sans SC', 'Microsoft YaHei', sans-serif;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      background: #07070f; color: #e0e0e8;
    }
    .app-container { min-height: 100vh; }
    /* ===== 渐变文字 ===== */
    .gradient-text {
      background: linear-gradient(135deg, #667eea, #764ba2);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }


@keyframes meshFlow {
  0% { transform: translate(0,0) rotate(0deg) scale(1); }
  100% { transform: translate(-30px,-40px) rotate(3deg) scale(1.05); }
}
@keyframes meshFlow2 {
  0% { transform: translate(0,0) rotate(0deg); }
  100% { transform: translate(20px,30px) rotate(-4deg); }
}
@keyframes pulse-dot {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}
@keyframes neonScroll {
  0% { background-position: 0% 0%; }
  100% { background-position: 200% 0%; }
}