:root {
    /* Color Palette - Light Mode */
    --bg-primary: #ffffff;
    --bg-secondary: #f8f9fa;
    --bg-tertiary: #f1f3f5;
    
    --text-primary: #1a1a2e;
    --text-secondary: #4a5568;
    --text-tertiary: #a0aec0;
    
    --accent: #667eea;
    --accent-hover: #5a67d8;
    --accent-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    
    --border-color: #e2e8f0;
    --header-height: 64px;
    --sidebar-width: 280px;
    --toc-width: 240px;
    
    /* Alert Colors */
    --info-bg: #e3f2fd;
    --info-text: #0d47a1;
    --tip-bg: #e8f5e9;
    --tip-text: #1b5e20;
    --warning-bg: #fff3e0;
    --warning-text: #e65100;
    --danger-bg: #ffebee;
    --danger-text: #b71c1c;
    
    --code-bg: #f6f8fa;
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

[data-theme="dark"] {
    /* Color Palette - Dark Mode */
    --bg-primary: #0d1117;
    --bg-secondary: #161b22;
    --bg-tertiary: #21262d;
    
    --text-primary: #f0f6fc;
    --text-secondary: #8b949e;
    --text-tertiary: #484f58;
    
    --accent: #58a6ff;
    --accent-hover: #1f6feb;
    --accent-gradient: linear-gradient(135deg, #58a6ff 0%, #a371f7 100%);
    
    --border-color: #30363d;
    
    /* Alert Colors - Dark */
    --info-bg: rgba(56, 139, 253, 0.15);
    --info-text: #58a6ff;
    --tip-bg: rgba(63, 185, 80, 0.15);
    --tip-text: #3fb950;
    --warning-bg: rgba(210, 153, 34, 0.15);
    --warning-text: #d29922;
    --danger-bg: rgba(248, 81, 73, 0.15);
    --danger-text: #f85149;
    
    --code-bg: #010409;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans SC", sans-serif;
    color: var(--text-primary);
    background-color: var(--bg-primary);
    line-height: 1.6;
    transition: background-color 0.3s, color 0.3s;
}

a {
    color: var(--accent);
    text-decoration: none;
    transition: color 0.2s;
}

a:hover {
    color: var(--accent-hover);
}

ul {
    list-style: none;
}