:root {
    /* Colors - Dark Theme */
    --color-bg-primary: #1a1a2e;
    --color-bg-secondary: #16213e;
    --color-bg-tertiary: #0d1117;
    --color-bg-graph: #1e1e2e;
    --color-border-primary: #0f3460;
    --color-border-secondary: #1e3a5f;

    /* Accent */
    --color-accent: #667eea;
    --color-accent-hover: #5a6fd6;
    --color-accent-light: #7c8ff5;

    /* Text */
    --color-text: #e0e0e0;
    --color-text-secondary: #aaa;
    --color-text-muted: #888;
    --color-text-dim: #666;

    /* Semantic */
    --color-success: #2ecc71;
    --color-error: #e74c3c;
    --color-danger: #e17055;
    --color-danger-hover: #d35400;

    /* Code */
    --color-code: #a8d8a8;
    --font-code: 'Fira Code', 'Consolas', 'Monaco', monospace;
    --font-ui: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

    /* Spacing */
    --sp-xs: 4px;
    --sp-sm: 8px;
    --sp-md: 12px;
    --sp-lg: 16px;
    --sp-xl: 20px;

    /* Misc */
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 10px;
    --transition: 0.2s ease;
    --shadow-sm: 0 2px 8px rgba(0,0,0,0.15);
    --shadow-md: 0 4px 16px rgba(0,0,0,0.25);
    --shadow-lg: 0 8px 30px rgba(0,0,0,0.3);
    --shadow-xl: 0 20px 60px rgba(0,0,0,0.5);
}