:root {
    /* 基础变量 */
    --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    --spacing-base: 16px;
    --spacing-small: 8px;
    
    /* 主色调 */
    --primary-color: #6366f1;
    --primary-color-rgb: 99, 102, 241;
    --primary-hover: #4f46e5;
    
    /* 明亮主题变量 */
    --light-background: #ffffff;
    --light-background-card: #f8fafc;
    --light-text-primary: #1a202c;
    --light-text-secondary: #4a5568;
    --light-border-color: rgba(0, 0, 0, 0.1);
    --light-card-shadow: 0 4px 6px rgba(0, 0, 0, 0.05), 0 1px 3px rgba(0, 0, 0, 0.1);
    --light-card-hover-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
    --light-nav-bg: rgba(255, 255, 255, 0.8);
    --light-editor-bg: rgba(243, 244, 246, 0.5);
    --light-gradient-bg: linear-gradient(135deg, #ffffff, #f3f4f6);
    
    /* 暗色主题变量 */
    --dark-background: #1a1b1e;
    --dark-background-card: #2a2b2e;
    --dark-text-primary: #ffffff;
    --dark-text-secondary: rgba(255, 255, 255, 0.85);
    --dark-border-color: rgba(255, 255, 255, 0.1);
    --dark-card-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
    --dark-card-hover-shadow: 0 10px 15px rgba(0, 0, 0, 0.3);
    --dark-nav-bg: rgba(26, 31, 46, 0.8);
    --dark-editor-bg: rgba(30, 41, 59, 0.5);
    --dark-gradient-bg: linear-gradient(135deg, #000000, #1a1a1a);
    
    /* 默认使用暗色主题 */
    --background: var(--dark-background);
    --background-card: var(--dark-background-card);
    --text-primary: var(--dark-text-primary);
    --text-secondary: var(--dark-text-secondary);
    --border-color: var(--dark-border-color);
    --card-shadow: var(--dark-card-shadow);
    --card-hover-shadow: var(--dark-card-hover-shadow);
    --nav-bg: var(--dark-nav-bg);
    --editor-bg: var(--dark-editor-bg);
    --gradient-bg: var(--dark-gradient-bg);
}

/* 亮色主题样式 */
[data-theme="light"] {
    --background: var(--light-background);
    --background-card: var(--light-background-card);
    --text-primary: var(--light-text-primary);
    --text-secondary: var(--light-text-secondary);
    --border-color: var(--light-border-color);
    --card-shadow: var(--light-card-shadow);
    --card-hover-shadow: var(--light-card-hover-shadow);
    --nav-bg: var(--light-nav-bg);
    --editor-bg: var(--light-editor-bg);
    --gradient-bg: var(--light-gradient-bg);
}