:root {
    color-scheme: light;

    /* CI core palette */
    --ci-black: #111111;
    --ci-orange: #f97316;
    --ci-white: #ffffff;
    --ci-gray: #737373;

    /* Permitted tonal variants */
    --ci-black-soft: #262626;
    --ci-orange-dark: #c2410c;
    --ci-orange-light: #ffedd5;
    --ci-gray-dark: #404040;
    --ci-gray-mid: #a3a3a3;
    --ci-gray-light: #e5e5e5;
    --ci-gray-soft: #f5f5f5;

    /* Semantic color roles */
    --color-text: var(--ci-black);
    --color-text-muted: var(--ci-gray-dark);
    --color-text-subtle: var(--ci-gray);
    --color-text-on-dark: var(--ci-white);
    --color-text-on-accent: var(--ci-black);
    --color-accent: var(--ci-orange);
    --color-accent-strong: var(--ci-orange-dark);
    --color-accent-soft: var(--ci-orange-light);
    --color-surface: var(--ci-white);
    --color-surface-soft: var(--ci-gray-soft);
    --color-surface-dark: var(--ci-black);
    --color-surface-dark-soft: var(--ci-black-soft);
    --color-border: var(--ci-gray-light);
    --color-border-strong: var(--ci-gray-mid);
    --color-focus: var(--ci-orange);
    --color-error: var(--ci-orange-dark);

    /* Page-level semantic aliases */
    --navy-950: var(--ci-black);
    --navy-900: var(--ci-black);
    --navy-800: var(--ci-black-soft);
    --navy-700: var(--ci-black-soft);
    --blue-500: var(--ci-orange);
    --mint-500: var(--ci-orange);
    --mint-400: var(--ci-orange);
    --mint-100: var(--ci-orange-light);
    --coral-500: var(--ci-orange);
    --amber-400: var(--ci-orange);
    --cream-100: var(--ci-gray-soft);
    --slate-700: var(--ci-gray-dark);
    --slate-500: var(--ci-gray);
    --slate-300: var(--ci-gray-mid);
    --slate-100: var(--ci-gray-light);
    --white: var(--ci-white);
    --error: var(--ci-orange-dark);

    /* Transparent variants for overlays, borders and shadows */
    --color-white-06: rgb(255 255 255 / 6%);
    --color-white-10: rgb(255 255 255 / 10%);
    --color-white-12: rgb(255 255 255 / 12%);
    --color-white-14: rgb(255 255 255 / 14%);
    --color-white-20: rgb(255 255 255 / 20%);
    --color-white-22: rgb(255 255 255 / 22%);
    --color-white-25: rgb(255 255 255 / 25%);
    --color-white-03: rgb(255 255 255 / 3%);
    --color-white-30: rgb(255 255 255 / 30%);
    --color-white-40: rgb(255 255 255 / 40%);
    --color-white-78: rgb(255 255 255 / 78%);
    --color-white-90: rgb(255 255 255 / 90%);
    --color-white-94: rgb(255 255 255 / 94%);
    --color-black-04: rgb(17 17 17 / 4%);
    --color-black-08: rgb(17 17 17 / 8%);
    --color-black-18: rgb(17 17 17 / 18%);
    --color-black-88: rgb(17 17 17 / 88%);
    --color-black-92: rgb(17 17 17 / 92%);
    --color-orange-08: rgb(249 115 22 / 8%);
    --color-orange-14: rgb(249 115 22 / 14%);
    --color-orange-22: rgb(249 115 22 / 22%);
    --color-orange-28: rgb(249 115 22 / 28%);
    --color-orange-30: rgb(249 115 22 / 30%);
    --color-orange-36: rgb(249 115 22 / 36%);
}
