:root {
    /* =========================================
     1. PRIMITIVES
     Define base color palette for the theme.
     ========================================= */

    /* --- ORACLE PALETTE (The Truth) --- */
    --palette-oracle-red: #C74634;

    /* Slates (Teal/Greys) - Used for Surfaces & Borders */
    --palette-slate-50-1: #C2D4D4;
    /* Lightest Teal */
    --palette-slate-50-2: #A0BBBB;
    --palette-slate-50-3: #85A8A8;
    --palette-slate-50-4: #6A9595;
    /* Vibrant Teal */

    --palette-slate-100-1: #697778;
    /* Mid Grey */
    --palette-slate-100-2: #778788;
    --palette-slate-100-3: #8F9D9E;
    --palette-slate-100-4: #A8B2B3;

    --palette-slate-150-1: #3C4545;
    /* Card Surface */
    --palette-slate-150-2: #4C5757;
    /* Card Hover */
    --palette-slate-150-3: #617070;
    --palette-slate-150-4: #778888;

    --palette-slate-200-1: #2B3333;
    /* Background Root */
    --palette-slate-200-2: #4C5757;
    --palette-slate-200-3: #617070;
    --palette-slate-200-4: #778888;

    /* Warm Neutrals - Used for Text */
    --palette-neutral-30-1: #F1EFED;
    /* Main Text */
    --palette-neutral-30-2: #DED9D4;
    /* Secondary Text */
    --palette-neutral-30-3: #CAC2BB;
    /* Disabled Text */
    --palette-neutral-30-4: #B6ACA2;

    /* Standard Colors */
    --white: #FFFFFF;
    --black: #1A1A1A;
    /* Never use pure #000000 in dark mode */

    /* --- REFACTORED NEUTRALS (Mapped to Palette) --- */
    /* We replace the random greys with your Slate Palette */
    --neutral-10: var(--palette-slate-150-1);
    /* Darkest */
    --neutral-20: var(--palette-slate-150-2);
    --neutral-30: var(--palette-slate-150-3);
    --neutral-40: var(--palette-slate-100-1);
    --neutral-50: var(--palette-slate-100-2);
    /* Borders */
    --neutral-60: var(--palette-slate-100-4);
    --neutral-70: var(--palette-slate-50-4);
    --neutral-80: var(--palette-slate-50-2);
    --neutral-90: var(--palette-neutral-30-2);
    --neutral-100: var(--palette-neutral-30-1);
    /* Lightest */


    /* =========================================
     2. FUNCTIONAL
     ========================================= */

    /* Alarm colors */
    --alarm-critical: #D32F2F;
    --alarm-high: #F57C00;
    --alarm-medium: #FBC02D;
    --alarm-low: #0288D1;
    --alarm-info: #70539B;

    /* One Line & HP (High Performance) */
    --oneline-green: #8fca94;
    --oneline-yellow: #f4b834;
    --oneline-red: #e23030;
    --oneline-gray: var(--palette-slate-100-2);

    --high-performance-white: var(--white);
    --high-performance-gray: var(--palette-slate-100-1);
    --high-performance-red: var(--oneline-red);
    --high-performance-blue: #a9d9ff;
    --high-performance-purple: #7266b7;
    --high-performance-green: var(--oneline-green);
    --high-performance-yellow: var(--oneline-yellow);

    /* Functional Status */
    --error: var(--alarm-critical);
    --info: #5691F0;
    --info-secondary: #114599;
    --warning: var(--alarm-medium);
    --warning-secondary: #693D07;
    --success: var(--oneline-green);

    /* =========================================
     3. OBJECTS
     ========================================= */

    /* Containers & Surfaces */
    --container-root: var(--palette-slate-200-1);
    /* The deep floor */
    --container: var(--palette-slate-150-1);
    /* The card surface */
    --container-nested: var(--palette-slate-150-2);
    /* Slightly lighter */

    /* Inputs (Mapped to Slate) */
    --input: var(--palette-slate-200-1);
    /* Dark input background */
    --input-disabled: var(--palette-slate-150-3);

    /* Icons & Labels */
    --icon: var(--palette-neutral-30-3);
    --icon-hover: var(--white);
    --icon-disabled: var(--palette-slate-100-1);
    --icon-selected: var(--palette-oracle-red);
    /* Brand Pop */

    --label: var(--palette-neutral-30-1);
    --label-disabled: var(--palette-slate-100-2);

    /* Borders (Mapped to Slate) */
    --border: var(--palette-slate-100-1);
    --border-disabled: var(--palette-slate-150-3);
    --container-border: 1px solid rgba(255, 255, 255, 0.1);
    /* Glass Edge */

    /* --- REFACTORED BOX SHADOWS (Smooth Curve) --- */
    /* Level 1: Subtle lift (Buttons, Inputs) */
    --box-shadow-1: 0 2px 4px rgba(0, 0, 0, 0.4);

    /* Level 2: Standard Card (Resting state) */
    --box-shadow-2: 0 4px 8px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.05);

    /* Level 3: Hover State / Dropdowns */
    --box-shadow-3: 0 8px 16px rgba(0, 0, 0, 0.6);

    /* Level 4: Modals / Drawers (High Lift) */
    --box-shadow-4: 0 16px 24px rgba(0, 0, 0, 0.65);

    /* Level 5: Critical Alerts (Floating high) */
    --box-shadow-5: 0 24px 48px rgba(0, 0, 0, 0.75);

    --box-shadow-inset: inset 0 2px 4px rgba(0, 0, 0, 0.5);


    /* --- Data Grids / Tables --- */
    --table-header-bg: var(--palette-slate-150-3);
    --table-header-text: var(--palette-neutral-30-1);
    --table-row-bg: var(--palette-slate-150-1);
    --table-row-alt-bg: rgba(255, 255, 255, 0.03);
    /* Subtle Transparency for stripe */
    --table-row-hover: var(--palette-slate-150-2);
    --table-border: var(--palette-slate-100-1);

    /* --- Typography --- */
    --text-color: var(--palette-neutral-30-1);
    --text-muted: var(--palette-neutral-30-3);
    /* --- Typography Scale --- */
    --text-xs: 0.75rem;
    /* 12px - Labels */
    --text-sm: 0.875rem;
    /* 14px - Body text */
    --text-md: 1rem;
    /* 16px - Standard values */
    --text-lg: 1.25rem;
    /* 20px - Sub-headers */
    --text-xl: 1.5rem;
    /* 24px - Headers */
    --text-2xl: 2rem;

    /* Weights */
    --weight-light: 300;
    --weight-reg: 400;
    --weight-bold: 700;
    --font-NotoSans: 'Nunito Sans', -apple-system, sans-serif;

    /* --- ACTIONS (Consolidated) --- */
    /* We use the Oracle Red for Primary Actions, or Slate-50-4 for Secondary */
    --call-to-action: var(--palette-slate-50-4);
    --call-to-action-highlight: #5A8585;
    /* Lighter Red */
    --call-to-action-hover: #4A7575;
    /* Darker Red */
    --call-to-action-disabled: var(--palette-slate-100-1);
    /* DESTRUCTIVE: Keep Oracle Red ONLY for dangerous actions */
    --destructive: var(--palette-slate-50-4);
    --destructive-hover: #4A7575;

    /* SECONDARY: Neutral (Ghost style) */
    --secondary-action: transparent;
    --secondary-action-border: var(--palette-slate-100-2);
    --secondary-action-text: var(--palette-neutral-30-1);
    /* Checkbox / Radio */
    --checkbox--checked: var(--palette-slate-50-4);
    /* Teal check is safer than Red */
    --checkbox--unchecked: var(--border);
    --checkbox--disabled: var(--input-disabled);

    --toggleSwitch--selected: var(--palette-slate-50-4);
    /* Teal */
    --toggleSwitch--unselected: var(--palette-slate-150-3);
    /* Border Radius */
    --border-radius: 4px;
    --border-radius-input: 2px;

    /* Opacity */
    --opacity-25: rgba(0, 0, 0, 0.25);
    --opacity-50: rgba(0, 0, 0, 0.50);
    --opacity-85: rgba(0, 0, 0, 0.85);

    /* Typography */
    --font-NotoSans: 'Nunito Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;

    /* Checkbox */
    --checkbox--checked: var(--call-to-action);
    --checkbox--unchecked: var(--border);
    --checkbox--indeterminate: var(--call-to-action);
    --checkbox--disabled: var(--input-disabled);

    /* Progress Bar */
    --progressLinearTrack--determinate: var(--neutral-10);
    --progressLinearTrack--indeterminate: var(--neutral-10);
    --progressLinearBar--determinate: var(--info-secondary);
    --progressLinearBar--indeterminate: var(--border);

    /* Toggle Switch */
    --toggleSwitch--selected: var(--call-to-action);
    --toggleSwitch--unselected: var(--neutral-10);

    /* Radio */
    --radio--selected: var(--call-to-action);
    --radio--unselected: var(--border);
    --radio--disabled: var(--input-disabled);

    /* Piping */
    --pipePrimaryFill: var(--neutral-20);
    --pipeSecondaryFill: #5a5a5a;
    --pipeStroke: var(--neutral-70);
    --pipeSelectStroke: var(--call-to-action);

    /* Component Context Menu */
    --contextBackground: var(--black);

    /* Symbols */
    --symbolFill--default: var(--neutral-20);
    --symbolStroke--default: var(--neutral-70);
    --symbolFillAnimation--default: var(--neutral-80);
    --symbolFill--running: var(--neutral-50);
    --symbolFillAnimation--running: var(--neutral-80);
    --symbolStroke--running: var(--neutral-70);
    --symbolFill--stopped: var(--black);
    --symbolStroke--stopped: var(--neutral-70);
    --symbolFill--faulted: #8F0E0E;
    --symbolStroke--faulted: #FA8E8E;

    /* --- LAYERS --- */
    --z-background: -1;
    --z-card: 10;
    --z-header: 100;
    --z-popup: 500;
    --z-alarm-banner: 1000;
    --z-tooltip: 2000;
    /* Spacing Scale */
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 32px;
}