/* ============================================================
   全局CSS变量 (Global CSS Variables)
   文件：variables.css
   说明：定义全站的色彩方案、字体、间距、动画等核心变量
   遵循赛博朋克+极客风格的深灰青绿配色方案
   ============================================================ */

:root {
  /* === 核心色彩方案 === */
  --primary: #00BFA5;         /* 主色：青绿色，代表数据流、成功状态、高亮信息 */
  --secondary: #004D40;       /* 辅色：深青色，用于次要按钮、背景渐变过渡 */
  --bg: #1E1E1E;              /* 背景色：深灰色，全局背景 */
  --card-bg: #2C2C2C;         /* 卡片背景色：稍浅深灰色，区分内容区块 */
  --accent: #1DE9B6;          /* 强调色：明亮青绿色，交互反馈、悬停效果 */
  --text: #F0F0F0;            /* 文字色：浅灰白色，高对比度可读性 */
  --text-muted: #9E9E9E;      /* 辅助文字色：中灰色，时间戳、哈希值等 */
  --border-color: #333333;    /* 边框色：暗灰色，表格分割线 */
  --success: #00E676;         /* 成功状态色：亮绿色，节点正常 */
  --warning: #FFEA00;         /* 警告状态色：亮黄色，待确认交易 */
  --danger: #FF1744;          /* 危险状态色：亮红色，节点异常 */

  /* === 渐变色 === */
  --gradient-primary: linear-gradient(135deg, var(--secondary) 0%, var(--primary) 100%);
  --gradient-dark: linear-gradient(180deg, #1a1a1a 0%, var(--bg) 100%);
  --glow-primary: 0 0 10px rgba(0, 191, 165, 0.3), 0 0 20px rgba(0, 191, 165, 0.1);
  --glow-accent: 0 0 10px rgba(29, 233, 182, 0.4), 0 0 30px rgba(29, 233, 182, 0.1);

  /* === 字体方案 === */
  --font-mono: 'Roboto Mono', 'Fira Code', 'Consolas', 'Courier New', monospace;
  --font-body: 'Inter', 'Helvetica Neue', Arial, sans-serif;
  --font-size-xs: 0.75rem;    /* 12px */
  --font-size-sm: 0.875rem;   /* 14px */
  --font-size-base: 1rem;     /* 16px */
  --font-size-lg: 1.125rem;   /* 18px */
  --font-size-xl: 1.5rem;     /* 24px */
  --font-size-2xl: 2rem;      /* 32px */
  --font-size-3xl: 2.5rem;    /* 40px */
  --font-size-4xl: 3.5rem;    /* 56px */

  /* === 间距系统 === */
  --space-xs: 0.25rem;        /* 4px */
  --space-sm: 0.5rem;         /* 8px */
  --space-md: 1rem;           /* 16px */
  --space-lg: 1.5rem;         /* 24px */
  --space-xl: 2rem;           /* 32px */
  --space-2xl: 3rem;          /* 48px */
  --space-3xl: 4rem;          /* 64px */

  /* === 圆角 === */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-full: 9999px;

  /* === 阴影 === */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.5);

  /* === 过渡动画 === */
  --transition-fast: 150ms ease;
  --transition-base: 300ms ease;
  --transition-slow: 500ms ease;

  /* === 布局 === */
  --sidebar-width: 260px;
  --header-height: 56px;
  --max-width: 1440px;
  --container-padding: var(--space-lg);
}

/* === 全局重置与基础样式 === */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font-body);
  font-size: var(--font-size-base);
  line-height: 1.6;
  color: var(--text);
  background-color: var(--bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

/* === 等宽字体类 === */
.mono {
  font-family: var(--font-mono);
}

/* === 链接基础样式 === */
a {
  color: var(--primary);
  text-decoration: none;
  transition: color var(--transition-fast);
}

a:hover {
  color: var(--accent);
}

/* === 滚动条自定义 === */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: var(--bg);
}

::-webkit-scrollbar-thumb {
  background: var(--secondary);
  border-radius: var(--radius-full);
}

::-webkit-scrollbar-thumb:hover {
  background: var(--primary);
}

/* === 选中文本样式 === */
::selection {
  background: rgba(0, 191, 165, 0.3);
  color: var(--text);
}