:root {
    /* Font Sizes */
    --bricks-font-size-100: 0.75rem; /* 12px */
    --bricks-font-size-200: 0.875rem; /* 14px */
    --bricks-font-size-300: 1rem; /* 16px */
    --bricks-font-size-400: 1.125rem; /* 18px */
    --bricks-font-size-500: 1.25rem; /* 20px */
    --bricks-font-size-600: 1.5rem; /* 24px */
    --bricks-font-size-700: 1.75rem; /* 28px */
    --bricks-font-size-800: 2rem; /* 32px */
    --bricks-font-size-900: 2.5rem; /* 40px */
    --bricks-font-size-1000: 3rem; /* 48px */
    /* Font Family */
    --bricks-font-family-primary: 'Poppins', sans-serif;
    /* Spacing */
    --bricks-spacing-010: 0.1rem; /* 1.6px */
    --bricks-spacing-015: 0.15rem; /* 2.4px */
    --bricks-spacing-020: 0.2rem; /* 3.2px */
    --bricks-spacing-025: 0.25rem; /* 4px */
    --bricks-spacing-050: 0.5rem; /* 8px */
    --bricks-spacing-075: 0.75rem; /* 12px */
    --bricks-spacing-100: 1rem; /* 16px */
    --bricks-spacing-125: 1.25rem; /* 20px */
    --bricks-spacing-150: 1.5rem; /* 24px */
    --bricks-spacing-175: 1.75rem; /* 28px */
    --bricks-spacing-200: 2rem; /* 32px */
    --bricks-spacing-225: 2.25rem; /* 36px */
    --bricks-spacing-250: 2.5rem; /* 40px */
    --bricks-spacing-275: 2.75rem; /* 44px */
    --bricks-spacing-300: 3rem; /* 48px */
    /* Border Radius */
    --bricks-border-radius-025: 0.25rem; /* 4px */
    --bricks-border-radius-050: 0.5rem; /* 8px */
    --bricks-border-radius-100: 1rem; /* 16px */
    --bricks-border-radius-200: 2rem; /* 32px */
    --bricks-border-radius-500: 6.25rem; /* 100px */
    --bricks-border-radius-1000: 8rem; /* 128px */
    /* Colors - HEX */
    --bricks-colors-legacy-primary-500: #efa41f;
    --bricks-colors-primary-300: #ebf1f3;
    --bricks-colors-primary-350: #e4e5ea;
    --bricks-colors-primary-400: #d3eeff;
    --bricks-colors-primary-450: #c1e9fe;
    --bricks-colors-primary-500: #00507d;
    --bricks-colors-primary-550: #06456b;
    --bricks-colors-primary-600: #053d5f;
    --bricks-colors-primary-700: #003654;
    --bricks-colors-secondary-300: #f7ccbf;
    --bricks-colors-secondary-600: #fc5521;
    --bricks-colors-secondary-700: #dc4a1d;
    --bricks-colors-state-error-300: #f6dbd3;
    --bricks-colors-state-error-500: #e00000;
    --bricks-colors-state-error-600: #b30000;
    --bricks-colors-state-error-700: #9b0101;
    --bricks-colors-state-warning-500: #ffb84d;
    --bricks-colors-state-warning-600: #e0a143;
    --bricks-colors-state-warning-700: #d1963f;
    --bricks-colors-state-success-300: #d4eae2;
    --bricks-colors-state-success-500: #00aa6f;
    --bricks-colors-state-success-600: #008556;
    --bricks-colors-state-info-500: #00507d;
    --bricks-colors-state-error-500-contrast: #ffffff;
    --bricks-colors-state-warning-500-contrast: #000000;
    --bricks-colors-state-success-500-contrast: #ffffff;
    --bricks-colors-state-info-500-contrast: #ffffff;
    --bricks-colors-grayscale-100: #ffffff;
    --bricks-colors-grayscale-200: #fafafa;
    --bricks-colors-grayscale-300: #f2f3f5;
    --bricks-colors-grayscale-400: #f0f0f0;
    --bricks-colors-grayscale-500: #dddddd;
    --bricks-colors-grayscale-600: #c1c1c1;
    --bricks-colors-grayscale-650: #9d9d9d;
    --bricks-colors-grayscale-700: #8c8c8c;
    --bricks-colors-grayscale-800: #676767;
    --bricks-colors-grayscale-900: #4b5257;
    --bricks-colors-grayscale-1000: #262626;
    --bricks-colors-grayscale-1100: #1f1f1f;
    --bricks-colors-grayscale-1200: #141414;
    --bricks-colors-grayscale-1300: #000000;
    --bricks-colors-highlight-500: #f6dbd3;
    /* Colors - RGB */
    --bricks-colors-legacy-primary-500-rgb: 239, 164, 31;
    --bricks-colors-primary-300-rgb: 235, 241, 243;
    --bricks-colors-primary-600-rgb: 5, 61, 95;
    --bricks-colors-primary-700-rgb: 0, 54, 84;
    --bricks-colors-state-error-500-rgb: 224, 0, 0;
    --bricks-colors-secondary-700-rgb: 252, 85, 33;
    --bricks-colors-state-error-500-rgb: 236, 58, 88;
    --bricks-colors-state-warning-500-rgb: 255, 184, 77;
    --bricks-colors-state-success-300-rgb: 212, 234, 226;
    --bricks-colors-state-success-500-rgb: 6, 198, 48;
    --bricks-colors-state-success-600-rgb: 0, 133, 86;
    --bricks-colors-state-info-500-rgb: 0, 80, 125;
    --bricks-colors-state-error-500-contrast-rgb: 255, 255, 255;
    --bricks-colors-state-warning-500-contrast-rgb: 0, 0, 0;
    --bricks-colors-state-success-500-contrast-rgb: 255, 255, 255;
    --bricks-colors-state-info-500-contrast-rgb: 255, 255, 255;
    --bricks-colors-grayscale-100-rgb: 255, 255, 255;
    --bricks-colors-grayscale-200-rgb: 250, 250, 250;
    --bricks-colors-grayscale-300-rgb: 245, 245, 245;
    --bricks-colors-grayscale-400-rgb: 240, 240, 240;
    --bricks-colors-grayscale-500-rgb: 217, 217, 217;
    --bricks-colors-grayscale-600-rgb: 191, 191, 191;
    --bricks-colors-grayscale-700-rgb: 140, 140, 140;
    --bricks-colors-grayscale-800-rgb: 89, 89, 89;
    --bricks-colors-grayscale-900-rgb: 67, 67, 67;
    --bricks-colors-grayscale-1000-rgb: 38, 38, 38;
    --bricks-colors-grayscale-1100-rgb: 31, 31, 31;
    --bricks-colors-grayscale-1200-rgb: 20, 20, 20;
    --bricks-colors-grayscale-1300-rgb: 0, 0, 0;

    /* ───────────────────────────── */
    /* Fire design system (hh2)      */
    /* ───────────────────────────── */

    /* Brand & neutrals */
    --bricks-fire-color-navy: #0f2f4a;
    --bricks-fire-color-navy-700: #153a5a;
    --bricks-fire-color-navy-600: #1e4a6e;
    --bricks-fire-color-navy-500: #2a5a82;
    --bricks-fire-color-navy-ink: #0a2338;

    --bricks-fire-color-canvas: #f3f3f5;
    --bricks-fire-color-surface: #ffffff;
    --bricks-fire-color-surface-alt: #efeff1;
    --bricks-fire-color-surface-sunk: #f7f7f9;

    --bricks-fire-color-border: #e6e7ea;
    --bricks-fire-color-border-strong: #cfd3d9;
    --bricks-fire-color-border-row: #d9dce1;

    /* Foreground / text */
    --bricks-fire-color-fg-1: #1f2a37;
    --bricks-fire-color-fg-2: #4b5563;
    --bricks-fire-color-fg-3: #6b7280;
    --bricks-fire-color-fg-muted: #9aa0a6;
    --bricks-fire-color-fg-on-dark: #ffffff;
    --bricks-fire-color-fg-on-dark-2: #cbd5e1;
    --bricks-fire-color-sidebar-inactive: #8ca3ba;
    --bricks-fire-color-sidebar-active-bg: rgba(255, 255, 255, 0.1);
    --bricks-fire-color-sidebar-active-border: rgba(255, 255, 255, 0.35);
    --bricks-fire-color-sidebar-hover-bg: rgba(255, 255, 255, 0.08);

    /* Semantic accents */
    --bricks-fire-color-success: #2fb573;
    --bricks-fire-color-success-hover: #27a065;
    --bricks-fire-color-success-bg: #e8f6ef;
    --bricks-fire-color-success-border: #8fd5ae;

    --bricks-fire-color-danger: #e5484d;
    --bricks-fire-color-danger-hover: #d23a3f;
    --bricks-fire-color-danger-bg: #fdecec;

    --bricks-fire-color-warning: #c99035;
    --bricks-fire-color-warning-hover: #b57d28;
    --bricks-fire-color-warning-bg: #fbf3e3;

    --bricks-fire-color-promote: #f26b35;
    --bricks-fire-color-promote-hover: #dc5a29;
    --bricks-fire-color-promote-bg: #feede3;

    --bricks-fire-color-info: #2fa8a0;
    --bricks-fire-color-link: #0f2f4a;

    /* Chart legend */
    --bricks-fire-color-chart-reg: #3a76c4;
    --bricks-fire-color-chart-ot: #e8569c;
    --bricks-fire-color-chart-2x: #f26b35;
    --bricks-fire-color-star: #f4b922;

    /* Ant Design form field palette */
    --bricks-fire-color-antd-border: #d9d9d9;
    --bricks-fire-color-antd-border-hover: #4096ff;
    --bricks-fire-color-antd-primary: #1677ff;
    --bricks-fire-color-antd-primary-shadow: rgba(5, 145, 255, 0.1);
    --bricks-fire-color-antd-error: #ff4d4f;
    --bricks-fire-color-antd-error-shadow: rgba(255, 38, 5, 0.06);
    --bricks-fire-color-antd-warning-shadow: rgba(201, 144, 53, 0.25);
    --bricks-fire-color-antd-disabled-bg: #f5f5f5;
    --bricks-fire-color-antd-text: rgba(0, 0, 0, 0.88);
    --bricks-fire-color-antd-placeholder: rgba(0, 0, 0, 0.25);
    --bricks-fire-color-antd-option-hover-bg: rgba(0, 0, 0, 0.04);
    --bricks-fire-color-antd-option-selected-bg: rgba(5, 145, 255, 0.08);

    /* Font family */
    --bricks-fire-font-family-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
    --bricks-fire-font-family-mono: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

    /* Font sizes not already in the bricks scale */
    --bricks-fire-font-size-display: 3.25rem; /* 52px */
    --bricks-fire-font-size-kpi: 1.375rem; /* 22px */
    --bricks-fire-font-size-h3: 0.9375rem; /* 15px */
    --bricks-fire-font-size-sm: 0.8125rem; /* 13px */
    --bricks-fire-font-size-label: 0.6875rem; /* 11px */

    /* Line heights */
    --bricks-fire-line-height-tight: 1.15;
    --bricks-fire-line-height-body: 1.5;

    /* Border radii not in the bricks scale */
    --bricks-fire-border-radius-sm: 0.375rem; /* 6px */
    --bricks-fire-border-radius-lg: 0.75rem; /* 12px */
    --bricks-fire-border-radius-full: 999px;

    /* Shadows / overlay */
    --bricks-fire-shadow-card: 0 1px 2px rgba(15, 47, 74, 0.04), 0 4px 12px rgba(15, 47, 74, 0.04);
    --bricks-fire-shadow-drawer: 0 8px 24px rgba(15, 47, 74, 0.1), 0 2px 6px rgba(15, 47, 74, 0.06);
    --bricks-fire-shadow-pop: 0 4px 12px rgba(15, 47, 74, 0.12);
    --bricks-fire-overlay: rgba(255, 255, 255, 0.72);

    /* Layout constants */
    --bricks-fire-sidebar-width: 68px;
    --bricks-fire-topbar-height: 64px;
    --bricks-fire-drawer-width: 560px;
}
