/**
 * 陪练猫网站 - CSS变量统一管理
 * 版本: v2.1
 * 日期: 2026-05-22
 */

:root {
    /* 主色系 */
    --primary: #0066FF;
    --primary-light: #3390FF;
    --primary-dark: #0052CC;
    --primary-glow: rgba(0, 102, 255, 0.3);

    /* 辅助色系 */
    --secondary: #00C48C;
    --secondary-light: #00E5A0;

    /* 强调色系 */
    --accent: #FF6B35;
    --accent-light: #FF8F5C;

    /* 中性色 - 与shared.css保持一致 */
    --dark: #16213E;
    --dark-light: #252542;
    --gray: #6B7280;
    --gray-light: #aaaac0;
    --gray-600: #6B7280;
    --light: #f5f6fa;
    --white: #FFFFFF;

    /* 渐变 */
    --gradient-primary: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
    --gradient-accent: linear-gradient(135deg, var(--accent) 0%, var(--accent-light) 100%);
    --gradient-hero: linear-gradient(160deg, #F0F7FF 0%, #F5FFFC 50%, #FFFAF5 100%);

    /* 阴影 */
    --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 20px rgba(0, 0, 0, 0.12);
    --shadow-lg: 0 10px 40px rgba(0, 0, 0, 0.15);
    --shadow-xl: 0 20px 60px rgba(0, 0, 0, 0.18);
    --shadow-primary: 0 4px 15px rgba(0, 102, 255, 0.3);
    --shadow-primary-lg: 0 8px 30px rgba(0, 102, 255, 0.35);

    /* 动效 */
    --duration-fast: 0.2s;
    --duration-normal: 0.3s;
    --duration-slow: 0.5s;
    --easing-smooth: cubic-bezier(0.4, 0, 0.2, 1);

    /* 字体层级 */
    --text-xs: 12px;
    --text-sm: 14px;
    --text-base: 16px;
    --text-lg: 18px;
    --text-xl: 20px;
    --text-2xl: 24px;
    --text-3xl: 30px;
    --text-4xl: 36px;
    --text-5xl: 48px;

    /* 间距 */
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 32px;
    --space-2xl: 48px;
    --space-3xl: 64px;

    /* 圆角 */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --radius-full: 9999px;

    /* Z-Index */
    --z-fixed: 1000;
}
