:root {
    /* Background layers */
    --bg-base: #1e1e1e;
    --bg-sidebar: #252526;
    --bg-editor: #1e1e1e;
    --bg-console: #1e1e1e;
    --bg-panel: #252526;
    --bg-tab-active: #1e1e1e;
    --bg-tab-inactive: #2d2d2d;
    --bg-tab-hover: #353535;
    --bg-statusbar: #007acc;
    --bg-toolbar: #333333;
    --bg-input: #3c3c3c;
    --bg-hover: #2a2d2e;
    --bg-selected: #094771;
    --bg-lesson: #1a1a2e;

    /* Borders */
    --border: #3c3c3c;
    --border-active: #007acc;
    --border-subtle: #2a2a2a;

    /* Text */
    --text-primary: #d4d4d4;
    --text-secondary: #808080;
    --text-muted: #5a5a5a;
    --text-accent: #f0db4f;
    --text-link: #3794ff;
    --text-success: #89d185;
    --text-warning: #cca700;
    --text-error: #f48771;

    /* Accent */
    --accent: #f0db4f;
    --accent-dim: #f0db4f44;

    /* Syntax highlighting */
    --syn-keyword: #569cd6;
    --syn-string: #ce9178;
    --syn-number: #b5cea8;
    --syn-comment: #6a9955;
    --syn-function: #dcdcaa;
    --syn-class: #4ec9b0;
    --syn-operator: #d4d4d4;
    --syn-property: #9cdcfe;
    --syn-regex: #d16969;
    --syn-template: #ce9178;
    --syn-punctuation: #d4d4d4;
    --syn-boolean: #569cd6;
    --syn-builtin: #4ec9b0;

    /* Scrollbar */
    --scrollbar-thumb: #424242;
    --scrollbar-thumb-hover: #555555;

    /* Selection */
    --selection: #264f78;

    /* Sizing */
    --sidebar-width: 240px;
    --lesson-panel-width: 320px;
    --console-height: 200px;
    --statusbar-height: 24px;
    --toolbar-height: 36px;
    --tab-height: 35px;
    --line-number-width: 50px;

    /* Font */
    --font-mono: 'Cascadia Code', 'Fira Code', 'Consolas', 'Courier New', monospace;
    --font-ui: 'Segoe UI', system-ui, -apple-system, sans-serif;
    --font-size-editor: 14px;
    --font-size-ui: 13px;
    --font-size-small: 11px;

    /* Spacing */
    --line-height: 1.5;
    --gap-xs: 4px;
    --gap-sm: 8px;
    --gap-md: 12px;
    --gap-lg: 16px;
    --gap-xl: 24px;

    /* Transitions */
    --transition-fast: 0.1s ease;
    --transition-normal: 0.2s ease;

    /* Z-index layers */
    --z-base: 1;
    --z-panel: 10;
    --z-overlay: 100;
    --z-modal: 1000;
}