:root {
    /* 颜色系统 */
    --color-primary: #007aff;
    --color-primary-dark: #0066d6;
    --color-danger: #ff3b30;
    --color-warning: #F5B400;
    --color-success: #00b894;
    --color-purple: #9B6DFF;
    --color-orange: #F5A623;

    /* 中性色 */
    --color-text-primary: #1d1d1f;
    --color-text-secondary: #666;
    --color-border: #d2d2d7;
    --color-bg-primary: #fff;
    --color-bg-secondary: #f5f5f7;

    /* 间距系统 */
    --spacing-xs: 4px;
    --spacing-sm: 8px;
    --spacing-md: 12px;
    --spacing-lg: 16px;
    --spacing-xl: 20px;
    --spacing-xxl: 24px;

    /* 圆角 */
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 8px;
    --radius-xl: 12px;

    /* 阴影 */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.1);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.15);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.2);
}

/* 重置样式 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* 基础样式 */
body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    background-color: var(--color-bg-secondary);
    color: var(--color-text-primary);
}

/* 通用滚动条样式 */
::-webkit-scrollbar {
    width: var(--spacing-sm);
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background-color: var(--color-border);
    border-radius: var(--radius-sm);
}

::-webkit-scrollbar-thumb:hover {
    background-color: #b0b0b5;
}