:root {
    --color-bg-primary: #0a0a0a;
    --color-bg-secondary: #111111;
    --color-bg-tertiary: #1a1a1a;
    --color-bg-card: #141414;
    --color-accent-primary: #7d4698;
    --color-accent-secondary: #68217a;
    --color-accent-hover: #9b5cb8;
    --color-accent-glow: rgba(125, 70, 152, 0.3);
    --color-accent-subtle: rgba(125, 70, 152, 0.1);
    --color-text-primary: #f5f5f5;
    --color-text-secondary: #b0b0b0;
    --color-text-muted: #707070;
    --color-code-bg: #0d0d0d;
    --color-code-border: #2a2a2a;
    --color-code-keyword: #c586c0;
    --color-code-string: #ce9178;
    --color-code-function: #dcdcaa;
    --color-code-comment: #6a9955;
    --color-code-number: #b5cea8;
    --color-code-type: #4ec9b0;
    --color-code-macro: #569cd6;
    --gradient-accent: linear-gradient(135deg, #7d4698 0%, #9b5cb8 50%, #68217a 100%);
    --gradient-card: linear-gradient(180deg, rgba(125, 70, 152, 0.08) 0%, transparent 100%);
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-mono: 'JetBrains Mono', 'Fira Code', 'SF Mono', Consolas, monospace;
    --text-xs: 0.75rem;
    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-lg: 1.125rem;
    --text-xl: 1.25rem;
    --text-2xl: 1.5rem;
    --text-3xl: 2rem;
    --text-4xl: 2.5rem;
    --text-5xl: 3.5rem;
    --text-6xl: 4.5rem;
    --leading-tight: 1.2;
    --leading-normal: 1.5;
    --leading-relaxed: 1.7;
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-16: 4rem;
    --space-20: 5rem;
    --space-24: 6rem;
    --space-32: 8rem;
    --max-width: 1280px;
    --max-width-narrow: 900px;
    --border-radius: 12px;
    --border-radius-sm: 8px;
    --border-radius-lg: 16px;
    --border-radius-xl: 24px;
    --transition-fast: 150ms ease;
    --transition-normal: 250ms ease;
    --transition-slow: 400ms ease;
    --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.5);
    --shadow-glow: 0 0 40px var(--color-accent-glow);
}
