/* CSS Variables - 足球经理在线 Premium 配色方案 */
:root {
  /* === 主色调 === */
  --green-primary: #1a7a3a;
  --green-dark: #0d4f24;
  --green-light: #e8f5e9;
  --green-glow: rgba(26, 122, 58, 0.15);
  --green-gradient: linear-gradient(135deg, #1a7a3a 0%, #0d4f24 100%);
  --green-gradient-light: linear-gradient(135deg, #4caf50 0%, #1a7a3a 100%);
  --gold-accent: #e65100;
  --gold-light: #fff3e0;
  --gold-gradient: linear-gradient(135deg, #ff9800, #e65100);
  --red-danger: #d32f2f;
  --red-light: #ffebee;
  --blue-info: #1976d2;
  --blue-light: #e3f2fd;
  --purple-rare: #7b1fa2;
  --purple-light: #f3e5f5;

  /* === Tailwind色阶（match.css等引用） === */
  --green-50: #e8f5e9; --green-100: #c8e6c9; --green-200: #a5d6a7; --green-500: #4caf50; --green-600: #43a047; --green-700: #388e3c;
  --blue-50: #e3f2fd; --blue-100: #bbdefb; --blue-500: #2196f3; --blue-700: #1976d2;
  --amber-50: #fff8e1; --amber-100: #ffecb3; --amber-200: #ffe082; --amber-600: #ffb300; --amber-700: #ffa000;
  --red-50: #ffebee; --red-500: #f44336; --red-700: #d32f2f;

  /* === 中性色 === */
  --gray-50: #fafafa;
  --gray-100: #f5f5f5;
  --gray-200: #eeeeee;
  --gray-300: #e0e0e0;
  --gray-400: #bdbdbd;
  --gray-500: #9e9e9e;
  --gray-600: #757575;
  --gray-700: #616161;
  --gray-800: #424242;
  --gray-900: #212121;

  /* === 文字 === */
  --text-primary: #1a1a2e;
  --text-secondary: #5f6368;
  --text-hint: #9aa0a6;
  --text-white: #ffffff;

  /* === 背景 === */
  --bg-page: #f0f2f5;
  --bg-card: #ffffff;
  --bg-header: var(--green-dark);
  --bg-overlay: rgba(0,0,0,0.5);

  /* === 间距（4px基准）=== */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10: 40px;
  --sp-12: 48px;

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

  /* === 阴影 === */
  --shadow-xs: 0 1px 2px rgba(0,0,0,0.05);
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.1);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.12);
  --shadow-xl: 0 12px 32px rgba(0,0,0,0.16);
  --shadow-green: 0 4px 16px rgba(26,122,58,0.25);
  --shadow-gold: 0 4px 16px rgba(230,81,0,0.25);

  /* === 字体大小 === */
  --text-xs: 0.7rem;
  --text-sm: 0.8rem;
  --text-base: 0.95rem;
  --text-md: 1.1rem;
  --text-lg: 1.3rem;
  --text-xl: 1.6rem;
  --text-2xl: 2rem;
  --text-3xl: 2.4rem;

  /* === 动画 === */
  --ease-default: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
  --duration-fast: 150ms;
  --duration-normal: 250ms;
  --duration-slow: 400ms;
  --duration-slower: 600ms;

  /* === 响应式断点变量 === */
  --app-max-width: 414px;
  --app-padding-side: 0px; /* 大屏时两侧留白 */

  /* === Header & BottomNav === */
  --header-height: 80px;
  --bottomnav-height: 64px;
}