/* 拾光学习平台 Design System V2.0 tokens */
:root {
    --sg-primary: #4f6ef7;
    --sg-primary-hover: #3b5de7;
    --sg-primary-light: rgba(79, 110, 247, 0.08);

    --sg-success: #22c55e;
    --sg-warning: #f59e0b;
    --sg-danger: #ef4444;
    --sg-info: #3b82f6;

    --sg-bg: #fafbfc;
    --sg-surface: #ffffff;
    --sg-surface-hover: #f1f5f9;
    --sg-border: #e2e8f0;
    --sg-divider: #f1f5f9;

    --sg-text-primary: #1e293b;
    --sg-text-secondary: #64748b;
    --sg-text-tertiary: #94a3b8;
    --sg-text-disabled: #cbd5e1;

    --sg-display: 28px;
    --sg-h1: 22px;
    --sg-h2: 18px;
    --sg-h3: 16px;
    --sg-body: 14px;
    --sg-body-sm: 13px;
    --sg-caption: 12px;

    --sg-space-xs: 4px;
    --sg-space-sm: 8px;
    --sg-space-md: 16px;
    --sg-space-lg: 24px;
    --sg-space-xl: 32px;
    --sg-space-2xl: 48px;
    --sg-space-3xl: 64px;

    --sg-radius-btn: 8px;
    --sg-radius-card: 12px;
    --sg-radius-input: 8px;
    --sg-radius-modal: 16px;
    --sg-radius-tag: 20px;

    --sg-shadow-card: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
    --sg-shadow-card-hover: 0 4px 12px rgba(0,0,0,0.08);
    --sg-shadow-fab: 0 4px 16px rgba(79,110,247,0.3);
    --sg-shadow-modal: 0 20px 60px rgba(0,0,0,0.15);
}

[data-bs-theme="dark"],
[data-theme="dark"] {
    --sg-bg: #0f172a;
    --sg-surface: #1e293b;
    --sg-surface-hover: #334155;
    --sg-border: #334155;
    --sg-divider: #334155;
    --sg-text-primary: #f1f5f9;
    --sg-text-secondary: #94a3b8;
    --sg-text-tertiary: #64748b;
}