/*
 * Tailwind CSS v4 Configuration
 *
 * This file imports Tailwind CSS and can be extended with custom configuration.
 * @see https://tailwindcss.com/docs/v4-beta
 */
@import 'tailwindcss' prefix(sa);
@plugin 'daisyui/index.js' {
  prefix: 'dui-';
  themes: false;
}

@layer components {
  body {
    @apply sa:font-body sa:text-base;
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    @apply sa:font-heading sa:leading-tight sa:font-bold;
  }
  h1 {
    @apply sa:text-4xl;
  }
  h2 {
    @apply sa:text-3xl;
  }
  h3 {
    @apply sa:text-2xl;
  }
  h4 {
    @apply sa:text-xl;
  }
  h5 {
    @apply sa:text-lg;
  }
  h6 {
    @apply sa:text-base;
  }
}

@custom-variant dark (&:where([data-theme=dark], [data-theme=dark] *));
@custom-variant light (&:where([data-theme=light], [data-theme=light] *));
@custom-variant hackerman (&:where([data-brand=hackerman], [data-brand=hackerman] *));
@custom-variant snyder (&:where([data-brand=snyder], [data-brand=snyder] *));
@utility container {
  @apply sa:max-w-440;
  @apply sa:mx-auto;
  @apply sa:px-5;
}
@theme {
  /*Typography*/
  --font-body: var(--brandOS-font-body);
  --font-heading: var(--brandOS-font-heading);
  --font-red-hat: var(--brandOS-font-red-hat);
  --font-jetbrains: var(--brandOS-font-jetbrains);
  --font-inter: var(--brandOS-font-inter);

  --text-xs: var(--brandOS-text-xs);
  --text-sm: var(--brandOS-text-sm);
  --text-base: var(--brandOS-text-base);
  --text-md: var(--brandOS-text-md);
  --text-lg: var(--brandOS-text-lg);
  --text-xl: var(--brandOS-text-xl);
  --text-2xl: var(--brandOS-text-2xl);
  --text-3xl: var(--brandOS-text-3xl);
  --text-4xl: var(--brandOS-text-4xl);
  --text-5xl: var(--brandOS-text-5xl);
  --text-6xl: var(--brandOS-text-6xl);
  --text-7xl: var(--brandOS-text-7xl);
  --text-8xl: var(--brandOS-text-8xl);
  --text-9xl: var(--brandOS-text-9xl);

  --leading-none: var(--brandOS-leading-none);
  --leading-tight: var(--brandOS-leading-tight);
  --leading-snug: var(--brandOS-leading-snug);
  --leading-normal: var(--brandOS-leading-normal);
  --leading-relaxed: var(--brandOS-leading-relaxed);
  --leading-loose: var(--brandOS-leading-loose);

  /* Primary */
  --color-primary-50: var(--brandOS-primary-050);
  --color-primary-100: var(--brandOS-primary-100);
  --color-primary-150: var(--brandOS-primary-150);
  --color-primary-200: var(--brandOS-primary-200);
  --color-primary-250: var(--brandOS-primary-250);
  --color-primary-300: var(--brandOS-primary-300);
  --color-primary-350: var(--brandOS-primary-350);
  --color-primary-400: var(--brandOS-primary-400);
  --color-primary-450: var(--brandOS-primary-450);
  --color-primary-500: var(--brandOS-primary-500);
  --color-primary-550: var(--brandOS-primary-550);
  --color-primary-600: var(--brandOS-primary-600);
  --color-primary-650: var(--brandOS-primary-650);
  --color-primary-700: var(--brandOS-primary-700);
  --color-primary-750: var(--brandOS-primary-750);
  --color-primary-800: var(--brandOS-primary-800);
  --color-primary-850: var(--brandOS-primary-850);
  --color-primary-900: var(--brandOS-primary-900);
  --color-primary-950: var(--brandOS-primary-950);

  --color-gray-50: var(--brandOS-gray-050);
  --color-gray-100: var(--brandOS-gray-100);
  --color-gray-150: var(--brandOS-gray-150);
  --color-gray-200: var(--brandOS-gray-200);
  --color-gray-250: var(--brandOS-gray-250);
  --color-gray-300: var(--brandOS-gray-300);
  --color-gray-350: var(--brandOS-gray-350);
  --color-gray-400: var(--brandOS-gray-400);
  --color-gray-450: var(--brandOS-gray-450);
  --color-gray-500: var(--brandOS-gray-500);
  --color-gray-550: var(--brandOS-gray-550);
  --color-gray-600: var(--brandOS-gray-600);
  --color-gray-650: var(--brandOS-gray-650);
  --color-gray-700: var(--brandOS-gray-700);
  --color-gray-750: var(--brandOS-gray-750);
  --color-gray-800: var(--brandOS-gray-800);
  --color-gray-850: var(--brandOS-gray-850);
  --color-gray-900: var(--brandOS-gray-900);
  --color-gray-950: var(--brandOS-gray-950);

  /* Matrix */
  --color-accent-matrix-050: var(--brandOS-accent-matrix-050);
  --color-accent-matrix-100: var(--brandOS-accent-matrix-100);
  --color-accent-matrix-200: var(--brandOS-accent-matrix-200);
  --color-accent-matrix-300: var(--brandOS-accent-matrix-300);
  --color-accent-matrix-400: var(--brandOS-accent-matrix-400);
  --color-accent-matrix-500: var(--brandOS-accent-matrix-500);
  --color-accent-matrix-600: var(--brandOS-accent-matrix-600);
  --color-accent-matrix-700: var(--brandOS-accent-matrix-700);
  --color-accent-matrix-800: var(--brandOS-accent-matrix-800);
  --color-accent-matrix-900: var(--brandOS-accent-matrix-900);
  --color-accent-matrix-950: var(--brandOS-accent-matrix-950);

  /* Cyan */
  --color-accent-cyan-050: var(--brandOS-accent-cyan-050);
  --color-accent-cyan-100: var(--brandOS-accent-cyan-100);
  --color-accent-cyan-200: var(--brandOS-accent-cyan-200);
  --color-accent-cyan-300: var(--brandOS-accent-cyan-300);
  --color-accent-cyan-400: var(--brandOS-accent-cyan-400);
  --color-accent-cyan-500: var(--brandOS-accent-cyan-500);
  --color-accent-cyan-600: var(--brandOS-accent-cyan-600);
  --color-accent-cyan-700: var(--brandOS-accent-cyan-700);
  --color-accent-cyan-800: var(--brandOS-accent-cyan-800);
  --color-accent-cyan-900: var(--brandOS-accent-cyan-900);
  --color-accent-cyan-950: var(--brandOS-accent-cyan-950);

  /* Magenta */
  --color-accent-magenta-050: var(--brandOS-accent-magenta-050);
  --color-accent-magenta-100: var(--brandOS-accent-magenta-100);
  --color-accent-magenta-200: var(--brandOS-accent-magenta-200);
  --color-accent-magenta-300: var(--brandOS-accent-magenta-300);
  --color-accent-magenta-400: var(--brandOS-accent-magenta-400);
  --color-accent-magenta-500: var(--brandOS-accent-magenta-500);
  --color-accent-magenta-600: var(--brandOS-accent-magenta-600);
  --color-accent-magenta-700: var(--brandOS-accent-magenta-700);
  --color-accent-magenta-800: var(--brandOS-accent-magenta-800);
  --color-accent-magenta-900: var(--brandOS-accent-magenta-900);
  --color-accent-magenta-950: var(--brandOS-accent-magenta-950);

  /* Electric */
  --color-accent-electric-050: var(--brandOS-accent-electric-050);
  --color-accent-electric-100: var(--brandOS-accent-electric-100);
  --color-accent-electric-200: var(--brandOS-accent-electric-200);
  --color-accent-electric-300: var(--brandOS-accent-electric-300);
  --color-accent-electric-400: var(--brandOS-accent-electric-400);
  --color-accent-electric-500: var(--brandOS-accent-electric-500);
  --color-accent-electric-600: var(--brandOS-accent-electric-600);
  --color-accent-electric-700: var(--brandOS-accent-electric-700);
  --color-accent-electric-800: var(--brandOS-accent-electric-800);
  --color-accent-electric-900: var(--brandOS-accent-electric-900);
  --color-accent-electric-950: var(--brandOS-accent-electric-950);

  /* Coral */
  --color-accent-coral-050: var(--brandOS-accent-coral-050);
  --color-accent-coral-100: var(--brandOS-accent-coral-100);
  --color-accent-coral-200: var(--brandOS-accent-coral-200);
  --color-accent-coral-300: var(--brandOS-accent-coral-300);
  --color-accent-coral-400: var(--brandOS-accent-coral-400);
  --color-accent-coral-500: var(--brandOS-accent-coral-500);
  --color-accent-coral-600: var(--brandOS-accent-coral-600);
  --color-accent-coral-700: var(--brandOS-accent-coral-700);
  --color-accent-coral-800: var(--brandOS-accent-coral-800);
  --color-accent-coral-900: var(--brandOS-accent-coral-900);
  --color-accent-coral-950: var(--brandOS-accent-coral-950);

  /* Amber */
  --color-accent-amber-050: var(--brandOS-accent-amber-050);
  --color-accent-amber-100: var(--brandOS-accent-amber-100);
  --color-accent-amber-200: var(--brandOS-accent-amber-200);
  --color-accent-amber-300: var(--brandOS-accent-amber-300);
  --color-accent-amber-400: var(--brandOS-accent-amber-400);
  --color-accent-amber-500: var(--brandOS-accent-amber-500);
  --color-accent-amber-600: var(--brandOS-accent-amber-600);
  --color-accent-amber-700: var(--brandOS-accent-amber-700);
  --color-accent-amber-800: var(--brandOS-accent-amber-800);
  --color-accent-amber-900: var(--brandOS-accent-amber-900);
  --color-accent-amber-950: var(--brandOS-accent-amber-950);

  /* Lime */
  --color-accent-lime-050: var(--brandOS-accent-lime-050);
  --color-accent-lime-100: var(--brandOS-accent-lime-100);
  --color-accent-lime-200: var(--brandOS-accent-lime-200);
  --color-accent-lime-300: var(--brandOS-accent-lime-300);
  --color-accent-lime-400: var(--brandOS-accent-lime-400);
  --color-accent-lime-500: var(--brandOS-accent-lime-500);
  --color-accent-lime-600: var(--brandOS-accent-lime-600);
  --color-accent-lime-700: var(--brandOS-accent-lime-700);
  --color-accent-lime-800: var(--brandOS-accent-lime-800);
  --color-accent-lime-900: var(--brandOS-accent-lime-900);
  --color-accent-lime-950: var(--brandOS-accent-lime-950);

  /* Teal */
  --color-accent-teal-050: var(--brandOS-accent-teal-050);
  --color-accent-teal-100: var(--brandOS-accent-teal-100);
  --color-accent-teal-200: var(--brandOS-accent-teal-200);
  --color-accent-teal-300: var(--brandOS-accent-teal-300);
  --color-accent-teal-400: var(--brandOS-accent-teal-400);
  --color-accent-teal-500: var(--brandOS-accent-teal-500);
  --color-accent-teal-600: var(--brandOS-accent-teal-600);
  --color-accent-teal-700: var(--brandOS-accent-teal-700);
  --color-accent-teal-800: var(--brandOS-accent-teal-800);
  --color-accent-teal-900: var(--brandOS-accent-teal-900);
  --color-accent-teal-950: var(--brandOS-accent-teal-950);

  /* Azure */
  --color-accent-azure-050: var(--brandOS-accent-azure-050);
  --color-accent-azure-100: var(--brandOS-accent-azure-100);
  --color-accent-azure-200: var(--brandOS-accent-azure-200);
  --color-accent-azure-300: var(--brandOS-accent-azure-300);
  --color-accent-azure-400: var(--brandOS-accent-azure-400);
  --color-accent-azure-500: var(--brandOS-accent-azure-500);
  --color-accent-azure-600: var(--brandOS-accent-azure-600);
  --color-accent-azure-700: var(--brandOS-accent-azure-700);
  --color-accent-azure-800: var(--brandOS-accent-azure-800);
  --color-accent-azure-900: var(--brandOS-accent-azure-900);
  --color-accent-azure-950: var(--brandOS-accent-azure-950);

  /* Violet */
  --color-accent-violet-050: var(--brandOS-accent-violet-050);
  --color-accent-violet-100: var(--brandOS-accent-violet-100);
  --color-accent-violet-200: var(--brandOS-accent-violet-200);
  --color-accent-violet-300: var(--brandOS-accent-violet-300);
  --color-accent-violet-400: var(--brandOS-accent-violet-400);
  --color-accent-violet-500: var(--brandOS-accent-violet-500);
  --color-accent-violet-600: var(--brandOS-accent-violet-600);
  --color-accent-violet-700: var(--brandOS-accent-violet-700);
  --color-accent-violet-800: var(--brandOS-accent-violet-800);
  --color-accent-violet-900: var(--brandOS-accent-violet-900);
  --color-accent-violet-950: var(--brandOS-accent-violet-950);

  /* Rose */
  --color-accent-rose-050: var(--brandOS-accent-rose-050);
  --color-accent-rose-100: var(--brandOS-accent-rose-100);
  --color-accent-rose-200: var(--brandOS-accent-rose-200);
  --color-accent-rose-300: var(--brandOS-accent-rose-300);
  --color-accent-rose-400: var(--brandOS-accent-rose-400);
  --color-accent-rose-500: var(--brandOS-accent-rose-500);
  --color-accent-rose-600: var(--brandOS-accent-rose-600);
  --color-accent-rose-700: var(--brandOS-accent-rose-700);
  --color-accent-rose-800: var(--brandOS-accent-rose-800);
  --color-accent-rose-900: var(--brandOS-accent-rose-900);
  --color-accent-rose-950: var(--brandOS-accent-rose-950);

  /* Slate */
  --color-accent-slate-050: var(--brandOS-accent-slate-050);
  --color-accent-slate-100: var(--brandOS-accent-slate-100);
  --color-accent-slate-200: var(--brandOS-accent-slate-200);
  --color-accent-slate-300: var(--brandOS-accent-slate-300);
  --color-accent-slate-400: var(--brandOS-accent-slate-400);
  --color-accent-slate-500: var(--brandOS-accent-slate-500);
  --color-accent-slate-600: var(--brandOS-accent-slate-600);
  --color-accent-slate-700: var(--brandOS-accent-slate-700);
  --color-accent-slate-800: var(--brandOS-accent-slate-800);
  --color-accent-slate-900: var(--brandOS-accent-slate-900);
  --color-accent-slate-950: var(--brandOS-accent-slate-950);

  /* raw-rocketred */
  --color-raw-rocketred-50: oklch(var(--colors-raw-rocketred-050-v-oklch));
  --color-raw-rocketred-100: oklch(var(--colors-raw-rocketred-100-v-oklch));
  --color-raw-rocketred-150: oklch(var(--colors-raw-rocketred-150-v-oklch));
  --color-raw-rocketred-200: oklch(var(--colors-raw-rocketred-200-v-oklch));
  --color-raw-rocketred-250: oklch(var(--colors-raw-rocketred-250-v-oklch));
  --color-raw-rocketred-300: oklch(var(--colors-raw-rocketred-300-v-oklch));
  --color-raw-rocketred-350: oklch(var(--colors-raw-rocketred-350-v-oklch));
  --color-raw-rocketred-400: oklch(var(--colors-raw-rocketred-400-v-oklch));
  --color-raw-rocketred-450: oklch(var(--colors-raw-rocketred-450-v-oklch));
  --color-raw-rocketred-500: oklch(var(--colors-raw-rocketred-500-v-oklch));
  --color-raw-rocketred-550: oklch(var(--colors-raw-rocketred-550-v-oklch));
  --color-raw-rocketred-600: oklch(var(--colors-raw-rocketred-600-v-oklch));
  --color-raw-rocketred-650: oklch(var(--colors-raw-rocketred-650-v-oklch));
  --color-raw-rocketred-700: oklch(var(--colors-raw-rocketred-700-v-oklch));
  --color-raw-rocketred-750: oklch(var(--colors-raw-rocketred-750-v-oklch));
  --color-raw-rocketred-800: oklch(var(--colors-raw-rocketred-800-v-oklch));
  --color-raw-rocketred-850: oklch(var(--colors-raw-rocketred-850-v-oklch));
  --color-raw-rocketred-900: oklch(var(--colors-raw-rocketred-900-v-oklch));
  --color-raw-rocketred-950: oklch(var(--colors-raw-rocketred-950-v-oklch));

  /* raw-groovygreen */
  --color-raw-groovygreen-50: oklch(var(--colors-raw-groovygreen-050-v-oklch));
  --color-raw-groovygreen-100: oklch(var(--colors-raw-groovygreen-100-v-oklch));
  --color-raw-groovygreen-150: oklch(var(--colors-raw-groovygreen-150-v-oklch));
  --color-raw-groovygreen-200: oklch(var(--colors-raw-groovygreen-200-v-oklch));
  --color-raw-groovygreen-250: oklch(var(--colors-raw-groovygreen-250-v-oklch));
  --color-raw-groovygreen-300: oklch(var(--colors-raw-groovygreen-300-v-oklch));
  --color-raw-groovygreen-350: oklch(var(--colors-raw-groovygreen-350-v-oklch));
  --color-raw-groovygreen-400: oklch(var(--colors-raw-groovygreen-400-v-oklch));
  --color-raw-groovygreen-450: oklch(var(--colors-raw-groovygreen-450-v-oklch));
  --color-raw-groovygreen-500: oklch(var(--colors-raw-groovygreen-500-v-oklch));
  --color-raw-groovygreen-550: oklch(var(--colors-raw-groovygreen-550-v-oklch));
  --color-raw-groovygreen-600: oklch(var(--colors-raw-groovygreen-600-v-oklch));
  --color-raw-groovygreen-650: oklch(var(--colors-raw-groovygreen-650-v-oklch));
  --color-raw-groovygreen-700: oklch(var(--colors-raw-groovygreen-700-v-oklch));
  --color-raw-groovygreen-750: oklch(var(--colors-raw-groovygreen-750-v-oklch));
  --color-raw-groovygreen-800: oklch(var(--colors-raw-groovygreen-800-v-oklch));
  --color-raw-groovygreen-850: oklch(var(--colors-raw-groovygreen-850-v-oklch));
  --color-raw-groovygreen-900: oklch(var(--colors-raw-groovygreen-900-v-oklch));
  --color-raw-groovygreen-950: oklch(var(--colors-raw-groovygreen-950-v-oklch));

  /* raw-yellowjacket */
  --color-raw-yellowjacket-50: oklch(var(--colors-raw-yellowjacket-050-v-oklch));
  --color-raw-yellowjacket-100: oklch(var(--colors-raw-yellowjacket-100-v-oklch));
  --color-raw-yellowjacket-150: oklch(var(--colors-raw-yellowjacket-150-v-oklch));
  --color-raw-yellowjacket-200: oklch(var(--colors-raw-yellowjacket-200-v-oklch));
  --color-raw-yellowjacket-250: oklch(var(--colors-raw-yellowjacket-250-v-oklch));
  --color-raw-yellowjacket-300: oklch(var(--colors-raw-yellowjacket-300-v-oklch));
  --color-raw-yellowjacket-350: oklch(var(--colors-raw-yellowjacket-350-v-oklch));
  --color-raw-yellowjacket-400: oklch(var(--colors-raw-yellowjacket-400-v-oklch));
  --color-raw-yellowjacket-450: oklch(var(--colors-raw-yellowjacket-450-v-oklch));
  --color-raw-yellowjacket-500: oklch(var(--colors-raw-yellowjacket-500-v-oklch));
  --color-raw-yellowjacket-550: oklch(var(--colors-raw-yellowjacket-550-v-oklch));
  --color-raw-yellowjacket-600: oklch(var(--colors-raw-yellowjacket-600-v-oklch));
  --color-raw-yellowjacket-650: oklch(var(--colors-raw-yellowjacket-650-v-oklch));
  --color-raw-yellowjacket-700: oklch(var(--colors-raw-yellowjacket-700-v-oklch));
  --color-raw-yellowjacket-750: oklch(var(--colors-raw-yellowjacket-750-v-oklch));
  --color-raw-yellowjacket-800: oklch(var(--colors-raw-yellowjacket-800-v-oklch));
  --color-raw-yellowjacket-850: oklch(var(--colors-raw-yellowjacket-850-v-oklch));
  --color-raw-yellowjacket-900: oklch(var(--colors-raw-yellowjacket-900-v-oklch));
  --color-raw-yellowjacket-950: oklch(var(--colors-raw-yellowjacket-950-v-oklch));

  /* raw-floridaorange */
  --color-raw-floridaorange-50: oklch(var(--colors-raw-floridaorange-050-v-oklch));
  --color-raw-floridaorange-100: oklch(var(--colors-raw-floridaorange-100-v-oklch));
  --color-raw-floridaorange-150: oklch(var(--colors-raw-floridaorange-150-v-oklch));
  --color-raw-floridaorange-200: oklch(var(--colors-raw-floridaorange-200-v-oklch));
  --color-raw-floridaorange-250: oklch(var(--colors-raw-floridaorange-250-v-oklch));
  --color-raw-floridaorange-300: oklch(var(--colors-raw-floridaorange-300-v-oklch));
  --color-raw-floridaorange-350: oklch(var(--colors-raw-floridaorange-350-v-oklch));
  --color-raw-floridaorange-400: oklch(var(--colors-raw-floridaorange-400-v-oklch));
  --color-raw-floridaorange-450: oklch(var(--colors-raw-floridaorange-450-v-oklch));
  --color-raw-floridaorange-500: oklch(var(--colors-raw-floridaorange-500-v-oklch));
  --color-raw-floridaorange-550: oklch(var(--colors-raw-floridaorange-550-v-oklch));
  --color-raw-floridaorange-600: oklch(var(--colors-raw-floridaorange-600-v-oklch));
  --color-raw-floridaorange-650: oklch(var(--colors-raw-floridaorange-650-v-oklch));
  --color-raw-floridaorange-700: oklch(var(--colors-raw-floridaorange-700-v-oklch));
  --color-raw-floridaorange-750: oklch(var(--colors-raw-floridaorange-750-v-oklch));
  --color-raw-floridaorange-800: oklch(var(--colors-raw-floridaorange-800-v-oklch));
  --color-raw-floridaorange-850: oklch(var(--colors-raw-floridaorange-850-v-oklch));
  --color-raw-floridaorange-900: oklch(var(--colors-raw-floridaorange-900-v-oklch));
  --color-raw-floridaorange-950: oklch(var(--colors-raw-floridaorange-950-v-oklch));

  /* raw-hendrixpurple */
  --color-raw-hendrixpurple-50: oklch(var(--colors-raw-hendrixpurple-050-v-oklch));
  --color-raw-hendrixpurple-100: oklch(var(--colors-raw-hendrixpurple-100-v-oklch));
  --color-raw-hendrixpurple-150: oklch(var(--colors-raw-hendrixpurple-150-v-oklch));
  --color-raw-hendrixpurple-200: oklch(var(--colors-raw-hendrixpurple-200-v-oklch));
  --color-raw-hendrixpurple-250: oklch(var(--colors-raw-hendrixpurple-250-v-oklch));
  --color-raw-hendrixpurple-300: oklch(var(--colors-raw-hendrixpurple-300-v-oklch));
  --color-raw-hendrixpurple-350: oklch(var(--colors-raw-hendrixpurple-350-v-oklch));
  --color-raw-hendrixpurple-400: oklch(var(--colors-raw-hendrixpurple-400-v-oklch));
  --color-raw-hendrixpurple-450: oklch(var(--colors-raw-hendrixpurple-450-v-oklch));
  --color-raw-hendrixpurple-500: oklch(var(--colors-raw-hendrixpurple-500-v-oklch));
  --color-raw-hendrixpurple-550: oklch(var(--colors-raw-hendrixpurple-550-v-oklch));
  --color-raw-hendrixpurple-600: oklch(var(--colors-raw-hendrixpurple-600-v-oklch));
  --color-raw-hendrixpurple-650: oklch(var(--colors-raw-hendrixpurple-650-v-oklch));
  --color-raw-hendrixpurple-700: oklch(var(--colors-raw-hendrixpurple-700-v-oklch));
  --color-raw-hendrixpurple-750: oklch(var(--colors-raw-hendrixpurple-750-v-oklch));
  --color-raw-hendrixpurple-800: oklch(var(--colors-raw-hendrixpurple-800-v-oklch));
  --color-raw-hendrixpurple-850: oklch(var(--colors-raw-hendrixpurple-850-v-oklch));
  --color-raw-hendrixpurple-900: oklch(var(--colors-raw-hendrixpurple-900-v-oklch));
  --color-raw-hendrixpurple-950: oklch(var(--colors-raw-hendrixpurple-950-v-oklch));

  /* raw-hackergreen */
  --color-raw-hackergreen-50: oklch(var(--colors-raw-hackergreen-050-v-oklch));
  --color-raw-hackergreen-100: oklch(var(--colors-raw-hackergreen-100-v-oklch));
  --color-raw-hackergreen-150: oklch(var(--colors-raw-hackergreen-150-v-oklch));
  --color-raw-hackergreen-200: oklch(var(--colors-raw-hackergreen-200-v-oklch));
  --color-raw-hackergreen-250: oklch(var(--colors-raw-hackergreen-250-v-oklch));
  --color-raw-hackergreen-300: oklch(var(--colors-raw-hackergreen-300-v-oklch));
  --color-raw-hackergreen-350: oklch(var(--colors-raw-hackergreen-350-v-oklch));
  --color-raw-hackergreen-400: oklch(var(--colors-raw-hackergreen-400-v-oklch));
  --color-raw-hackergreen-450: oklch(var(--colors-raw-hackergreen-450-v-oklch));
  --color-raw-hackergreen-500: oklch(var(--colors-raw-hackergreen-500-v-oklch));
  --color-raw-hackergreen-550: oklch(var(--colors-raw-hackergreen-550-v-oklch));
  --color-raw-hackergreen-600: oklch(var(--colors-raw-hackergreen-600-v-oklch));
  --color-raw-hackergreen-650: oklch(var(--colors-raw-hackergreen-650-v-oklch));
  --color-raw-hackergreen-700: oklch(var(--colors-raw-hackergreen-700-v-oklch));
  --color-raw-hackergreen-750: oklch(var(--colors-raw-hackergreen-750-v-oklch));
  --color-raw-hackergreen-800: oklch(var(--colors-raw-hackergreen-800-v-oklch));
  --color-raw-hackergreen-850: oklch(var(--colors-raw-hackergreen-850-v-oklch));
  --color-raw-hackergreen-900: oklch(var(--colors-raw-hackergreen-900-v-oklch));
  --color-raw-hackergreen-950: oklch(var(--colors-raw-hackergreen-950-v-oklch));

  /* raw-neutral */
  --color-raw-neutral-fg-light: oklch(var(--colors-raw-neutral-fg-light-v-oklch));
  --color-raw-neutral-fg-dark: oklch(var(--colors-raw-neutral-fg-dark-v-oklch));
  --color-raw-neutral-bg-light: oklch(var(--colors-raw-neutral-bg-light-v-oklch));
  --color-raw-neutral-bg-dark: oklch(var(--colors-raw-neutral-bg-dark-v-oklch));

  /* raw-base */
  --color-raw-base-bg1-light: oklch(var(--colors-raw-base-bg1-light-v-oklch));
  --color-raw-base-bg1-dark: oklch(var(--colors-raw-base-bg1-dark-v-oklch));
  --color-raw-base-bg2-light: oklch(var(--colors-raw-base-bg2-light-v-oklch));
  --color-raw-base-bg2-dark: oklch(var(--colors-raw-base-bg2-dark-v-oklch));
  --color-raw-base-bg3-light: oklch(var(--colors-raw-base-bg3-light-v-oklch));
  --color-raw-base-bg3-dark: oklch(var(--colors-raw-base-bg3-dark-v-oklch));

  /* Motion - Easing (sa:ease-snappy, sa:ease-smooth, etc.) */
  --ease-linear: var(--brandOS-ease-linear);
  --ease-snappy: var(--brandOS-ease-snappy);
  --ease-smooth: var(--brandOS-ease-smooth);
  --ease-bounce: var(--brandOS-ease-bounce);
  --ease-stroke-draw: var(--brandOS-ease-strokeDraw);
  --ease-enter: var(--brandOS-ease-enter);
  --ease-exit: var(--brandOS-ease-exit);

  /* Motion - Animations (sa:animate-fade, sa:animate-slide-up, etc.) */
  --animate-fade-in: brandos-fade-in 0.2s ease-out both;
  --animate-fade: brandos-fade 2s var(--brandOS-ease-smooth) infinite;
  --animate-slide-up: brandos-slide 2s var(--brandOS-ease-enter) infinite;
  --animate-scale-pulse: brandos-scale 1.5s var(--brandOS-ease-bounce) infinite;
  --animate-purposeful: brandos-purposeful 500ms var(--brandOS-ease-smooth) infinite;
  --animate-natural: brandos-natural 500ms var(--brandOS-ease-smooth) infinite;
  --animate-quick: brandos-quick 1s var(--brandOS-ease-snappy) infinite;
  --animate-accessible: brandos-accessible 500ms var(--brandOS-ease-linear) infinite;
  --animate-easing-move: brandos-easing-move 1s var(--brandOS-ease-smooth) forwards;

  @keyframes brandos-fade-in {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
  }
  @keyframes brandos-purposeful {
    0%,
    100% {
      transform: translateX(0);
    }
    50% {
      transform: translateX(calc(100% - 12px));
    }
  }
  @keyframes brandos-natural {
    0%,
    100% {
      transform: translateX(0) scale(1);
    }
    50% {
      transform: translateX(100px) scale(1.2);
    }
  }
  @keyframes brandos-quick {
    0%,
    100% {
      transform: translateX(0);
    }
    50% {
      transform: translateX(100px);
    }
  }
  @keyframes brandos-accessible {
    0%,
    100% {
      opacity: 1;
    }
    50% {
      opacity: 0.5;
    }
  }
  @keyframes brandos-easing-move {
    from {
      transform: translateX(0);
    }
    to {
      transform: translateX(140px);
    }
  }
  @keyframes brandos-fade {
    0%,
    100% {
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
  }
  @keyframes brandos-slide {
    0%,
    100% {
      transform: translateY(20px);
      opacity: 0;
    }
    50% {
      transform: translateY(0);
      opacity: 1;
    }
  }
  @keyframes brandos-scale {
    0%,
    100% {
      transform: scale(0.8);
    }
    50% {
      transform: scale(1.2);
    }
  }
}