/* ========================================
   六六学社 · 设计令牌 v1.1
   （Design Tokens / CSS Variables）
   ======================================== */

:root {
  /* ---------- 主色：桔梗紫 9阶 ---------- */
  --purple-50: #F0E4EE;   /* 藕丝秋半 */
  --purple-100: #E2D0E8;
  --purple-200: #C9AAD5;
  --purple-300: #B281B9;   /* 红藤 */
  --purple-400: #986EB1;   /* 半色 */
  --purple-500: #6C4F9B;   /* 桔梗（主色） */
  --purple-600: #5A3E88;
  --purple-700: #4C3677;   /* 三公子 */
  --purple-800: #3A2550;
  --purple-900: #2F1D3A;   /* 凝夜紫 */

  /* ---------- 底色 ---------- */
  --bg-page: #2F1D3A;          /* 凝夜紫 - 页面主背景 */
  --bg-card: #2B234A;          /* 铁绀 - 卡片/弹层底色 */
  --bg-light: #F0E4EE;         /* 藕丝秋半 - 浅色页面背景 */
  --bg-highlight: #F3D4EF;     /* 退红 - 浅粉高光 */

  /* ---------- 点缀色 ---------- */
  --gold: #F0D870;             /* 金黄 - 高亮点缀 3% */
  --mustard: #DCC960;          /* 芥黄 - 次级点缀 5% */
  --plum: #A74C7B;             /* 梅紫 - 警示/错题 */
  --silver-pink: #EEDCE7;      /* 银红 - 辅助粉浅 */

  /* ---------- 文字色（深底） ---------- */
  --text-primary: #F6F1FA;     /* 主文字 - 12.3:1 AAA */
  --text-secondary: #B9A9CE;   /* 次文字 - 5.8:1 AA */
  --text-muted: #8E7EA6;       /* 弱文字 - 3.2:1 (仅12px以下) */
  --text-accent: #C188C4;      /* 高亮文字 - 木槿 6.2:1 */

  /* ---------- 文字色（浅底） ---------- */
  --light-text-primary: #2F1D3A;  /* 凝夜紫 - 12.3:1 AAA */
  --light-text-secondary: #6E5C85; /* 5.2:1 AA */
  --light-text-muted: #9E8FB5;    /* 3.0:1 (仅12px以下) */

  /* ---------- 边框 ---------- */
  --border-dark: rgba(193, 136, 196, 0.22);   /* 木槿 22% - 深底卡片 */
  --border-light: #E2D4EA;                     /* 浅底卡片 */
  --border-focus: #8F78B3;                     /* 紫苑 - 聚焦态 */

  /* ---------- 渐变 ---------- */
  --gradient-primary: linear-gradient(135deg, var(--purple-400), var(--purple-500));
  --gradient-primary-hover: linear-gradient(135deg, var(--purple-300), var(--purple-400));
  --gradient-primary-active: linear-gradient(135deg, var(--purple-600), var(--purple-700));
  --gradient-gold: linear-gradient(135deg, #F0D870, #E4C845);
  --gradient-plum: linear-gradient(135deg, #C97BA0, #A74C7B);

  /* ---------- 背景渐变（含双光晕） ---------- */
  --bg-page-gradient:
    radial-gradient(circle at 15% 10%, rgba(143, 120, 179, 0.20), transparent 55%),
    radial-gradient(circle at 85% 85%, rgba(193, 136, 196, 0.14), transparent 50%),
    radial-gradient(circle at 50% 50%, rgba(220, 201, 96, 0.04), transparent 60%),
    linear-gradient(165deg, var(--purple-900) 0%, var(--purple-800) 52%, var(--bg-card) 100%);

  --bg-light-gradient:
    radial-gradient(circle at 20% 0%, rgba(243, 212, 239, 0.60), transparent 50%),
    linear-gradient(180deg, var(--purple-50) 0%, var(--bg-highlight) 100%);

  /* ---------- 阴影 ---------- */
  --shadow-card: 0 10px 30px rgba(32, 16, 50, 0.45);
  --shadow-btn: 0 6px 18px rgba(108, 79, 155, 0.45);
  --shadow-gold: 0 6px 16px rgba(240, 216, 112, 0.45);
  --shadow-mustard: 0 4px 12px rgba(220, 201, 96, 0.35);
  --shadow-plum: 0 6px 16px rgba(167, 76, 123, 0.4);

  /* ---------- 圆角 ---------- */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 18px;      /* 卡片 */
  --radius-btn: 14px;     /* 按钮 */
  --radius-pill: 999px;   /* 胶囊 */
  --radius-tag: 8px;      /* 标签 */

  /* ---------- 间距（4px基数，9档） ---------- */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 12px;
  --space-base: 16px;
  --space-lg: 20px;
  --space-xl: 24px;
  --space-2xl: 32px;
  --space-3xl: 48px;
  --space-4xl: 64px;

  /* ---------- 字号 ---------- */
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-base: 15px;
  --fs-md: 16px;
  --fs-lg: 17px;       /* 导航标题 */
  --fs-xl: 22px;       /* 模块标题 */
  --fs-2xl: 28px;      /* 大标题 */
  --fs-brand: 44px;    /* 品牌标题 */

  /* ---------- 图标尺寸 ---------- */
  --icon-xs: 14px;
  --icon-sm: 18px;
  --icon-md: 24px;
  --icon-lg: 32px;
  --icon-xl: 48px;
}