/* ============================================================
 * 设计令牌 — 暗色系主题
 * 主色：深炭黑 + 暖灰
 * 点缀：翡翠绿（成功/正向）+ 琥珀橙黄（价格/CTA）
 * ============================================================ */

:root {
    /* ===== 暗色背景体系 ===== */
    --color-bg: #0F1115;             /* 最深 — 页面背景 */
    --color-bg-1: #161920;           /* 深炭 — 次级背景 */
    --color-bg-2: #1C2028;           /* 卡片背景 */
    --color-bg-3: #242935;           /* hover/交互背景 */
    --color-bg-4: #2D3340;           /* 更亮交互 */

    /* ===== 文字 ===== */
    --color-text: #E8EAED;           /* 主文字 — 高对比白 */
    --color-text-2: #B4B8C2;         /* 次要文字 */
    --color-text-3: #7C8090;         /* 辅助文字 */
    --color-text-4: #50545E;         /* 最弱文字 */

    /* ===== 边框 ===== */
    --color-border: #2A2E38;         /* 标准边框 */
    --color-border-2: #353A48;       /* 亮边框 */
    --color-border-3: #1E2228;       /* 暗边框 */

    /* ===== 点缀色：翡翠绿（成功/正向/免费） ===== */
    --color-green: #10B981;          /* 翡翠绿 */
    --color-green-dark: #059669;     /* 深翡翠 */
    --color-green-light: rgba(16, 185, 129, 0.12); /* 绿色背景 */

    /* ===== 点缀色：琥珀橙黄（价格/CTA/热门） ===== */
    --color-orange: #F59E0B;         /* 琥珀黄 */
    --color-orange-dark: #D97706;    /* 深琥珀 */
    --color-orange-light: rgba(245, 158, 11, 0.12); /* 橙色背景 */

    /* ===== 功能色 ===== */
    --color-danger: #EF4444;         /* 红 — 危险 */
    --color-info: #3B82F6;           /* 蓝 — 信息（仅辅助） */

    /* ===== 字体 ===== */
    --font-sans: "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
    --font-mono: "SF Mono", "JetBrains Mono", "Fira Code", Consolas, monospace;

    /* ===== 间距（4px 基准） ===== */
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 40px;
    --space-2xl: 64px;
    --space-3xl: 96px;

    /* ===== 圆角 ===== */
    --radius-sm: 6px;
    --radius: 10px;
    --radius-lg: 14px;
    --radius-xl: 20px;
    --radius-full: 9999px;

    /* ===== 动画曲线（非线性） ===== */
    --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
    --ease-smooth: cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --ease-snappy: cubic-bezier(0.16, 1, 0.3, 1);

    /* ===== 阴影 — 暗色系专用 ===== */
    --shadow-xs: 0 1px 2px rgba(0,0,0,0.3);
    --shadow-sm: 0 2px 8px rgba(0,0,0,0.3);
    --shadow-md: 0 8px 24px rgba(0,0,0,0.4);
    --shadow-lg: 0 16px 48px rgba(0,0,0,0.5);
    --shadow-glow-green: 0 0 20px rgba(16, 185, 129, 0.15);
    --shadow-glow-orange: 0 0 20px rgba(245, 158, 11, 0.15);

    /* ===== 容器 ===== */
    --container-max: 1240px;
}