/**
 * 前台统一视觉 Token — Product Design / Advanced Betting
 */
:root {
    /* Primary blue */
    --fe-primary: #2563EB;
    --fe-primary-dark: #1D4ED8;
    --fe-primary-light: #60A5FA;
    --fe-primary-soft: #EFF6FF;
    --fe-primary-muted: #DBEAFE;
    --fe-primary-ring: rgba(37, 99, 235, 0.14);

    /* Surfaces */
    --fe-bg-page: #F6F8FC;
    --fe-bg-card: #FFFFFF;
    --fe-bg-subtle: #F9FAFB;
    --fe-bg-muted: #F3F4F6;
    --fe-bg-section: #EEF2FF;

    /* Text */
    --fe-text-primary: #1F2937;
    --fe-text-secondary: #6B7280;
    --fe-text-muted: #9CA3AF;
    --fe-text-inverse: #FFFFFF;

    /* Border */
    --fe-border: #E5E7EB;
    --fe-border-light: #F3F4F6;

    /* Semantic */
    --fe-success: #10B981;
    --fe-success-soft: #ECFDF5;
    --fe-success-text: #047857;
    --fe-warning: #F59E0B;
    --fe-warning-soft: #FFFBEB;
    --fe-warning-text: #B45309;
    --fe-danger: #EF4444;
    --fe-danger-soft: #FEF2F2;
    --fe-danger-text: #B91C1C;

    /* Radius */
    --fe-radius-sm: 8px;
    --fe-radius-md: 12px;
    --fe-radius-lg: 16px;
    --fe-radius-xl: 18px;
    --fe-radius-pill: 999px;

    /* Shadow */
    --fe-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.05);
    --fe-shadow-md: 0 4px 12px rgba(15, 23, 42, 0.07);
    --fe-shadow-lg: 0 8px 24px rgba(15, 23, 42, 0.09);
    --fe-shadow-footer: 0 -4px 16px rgba(15, 23, 42, 0.06);

    /* Layout */
    --fe-header-h: 48px;
    --fe-tabbar-h: 56px;
}