@pastel-palette/tailwindcss/dist/theme-oklch.css

A comprehensive kawaii-inspired color system with OKLCH color space support, TypeScript definitions, and TailwindCSS v4 integration. Features a cute & kawaii aesthetic with soft, pastel tones.

/* This file is auto-generated by Pastel Palette for Tailwind v4 */
@import "tailwindcss";

/* Light mode colors (default) */
@theme {
  --color-blue: oklch(0.65 0.18 237);
  --color-pink: oklch(0.68 0.22 350);
  --color-purple: oklch(0.65 0.2 280);
  --color-green: oklch(0.67 0.15 155);
  --color-orange: oklch(0.68 0.15 60);
  --color-yellow: oklch(0.9 0.19 100);
  --color-sky: oklch(0.7 0.14 210);
  --color-red: oklch(0.65 0.22 27);
  --color-brown: oklch(0.62 0.12 45);
  --color-gray: oklch(0.65 0 0);
  --color-neutral: oklch(0.6 0 0);
  --color-black: oklch(0.2 0 0);
  --color-white: oklch(0.99 0.005 200);
  --color-teal: oklch(0.66 0.16 180);
  --color-cyan: oklch(0.7 0.15 195);
  --color-indigo: oklch(0.58 0.2 260);
  --color-violet: oklch(0.62 0.22 300);
  --color-lime: oklch(0.75 0.16 125);
  --color-emerald: oklch(0.64 0.16 160);
  --color-amber: oklch(0.75 0.13 85);
  --color-rose: oklch(0.63 0.21 15);
  --color-slate: oklch(0.55 0.015 240);
  --color-zinc: oklch(0.58 0.01 240);
  --color-gray1: oklch(0.900 0 0);
  --color-gray2: oklch(0.850 0 0);
  --color-gray3: oklch(0.800 0 0);
  --color-gray4: oklch(0.750 0 0);
  --color-gray5: oklch(0.700 0 0);
  --color-gray6: oklch(0.650 0 0);
  --color-gray7: oklch(0.600 0 0);
  --color-gray8: oklch(0.550 0 0);
  --color-gray9: oklch(0.500 0 0);
  --color-gray10: oklch(0.450 0 0);
  --color-text: oklch(0.15 0.0049 230);
  --color-text-secondary: oklch(0.45 0.0049 230);
  --color-text-tertiary: oklch(0.55 0.0049 230);
  --color-text-quaternary: oklch(0.7 0.0049 230);
  --color-placeholder-text: oklch(0.8 0.0049 226);
  --color-border: oklch(0.92 0.0049 234);
  --color-border-secondary: oklch(0.94 0.0049 234);
  --color-separator: oklch(0.88 0.0049 236);
  --color-link: oklch(0.7 0.16 250);
  --color-disabled-control: oklch(0.94 0.0049 226);
  --color-disabled-text: oklch(0.9 0.0049 226);
  --color-background: oklch(0.99 0.0049 230);
  --color-background-secondary: oklch(0.98 0.0049 230);
  --color-background-tertiary: oklch(0.97 0.0049 230);
  --color-background-quaternary: oklch(0.96 0.0049 230);
  --color-background-quinary: oklch(0.949 0.0049 230);
  --color-fill: oklch(0.96 0.0049 228);
  --color-fill-secondary: oklch(0.94 0.0049 228);
  --color-fill-tertiary: oklch(0.92 0.0049 228);
  --color-fill-quaternary: oklch(0.90 0.0049 228);
  --color-material-ultra-thick: oklch(0.96 0.0049 232 / 0.93);
  --color-material-thick: oklch(0.96 0.0049 232 / 0.85);
  --color-material-medium: oklch(0.96 0.0049 232 / 0.65);
  --color-material-thin: oklch(0.96 0.0049 232 / 0.60);
  --color-material-ultra-thin: oklch(0.96 0.0049 232 / 0.45);
  --color-material-opaque: oklch(0.96 0.0049 232);
  --color-accent: oklch(0.65 0.18 238);
  --color-primary: oklch(0.55 0.20 249);
  --color-secondary: oklch(0.77 0.14 171);
}

/* All color variants with suffixes */
@theme {
  --color-blue-light: oklch(0.65 0.18 237);
  --color-blue-dark: oklch(0.7 0.16 237);
  --color-blue-hc: oklch(0.45 0.25 237);
  --color-blue-kawaii: oklch(0.85 0.12 237);
  --color-pink-light: oklch(0.68 0.22 350);
  --color-pink-dark: oklch(0.73 0.2 350);
  --color-pink-hc: oklch(0.5 0.3 350);
  --color-pink-kawaii: oklch(0.87 0.16 350);
  --color-purple-light: oklch(0.65 0.2 280);
  --color-purple-dark: oklch(0.7 0.18 280);
  --color-purple-hc: oklch(0.45 0.28 280);
  --color-purple-kawaii: oklch(0.84 0.14 280);
  --color-green-light: oklch(0.67 0.15 155);
  --color-green-dark: oklch(0.72 0.16 155);
  --color-green-hc: oklch(0.5 0.2 155);
  --color-green-kawaii: oklch(0.85 0.12 155);
  --color-orange-light: oklch(0.68 0.15 60);
  --color-orange-dark: oklch(0.73 0.16 60);
  --color-orange-hc: oklch(0.55 0.18 60);
  --color-orange-kawaii: oklch(0.86 0.12 60);
  --color-yellow-light: oklch(0.9 0.19 100);
  --color-yellow-dark: oklch(0.85 0.18 100);
  --color-yellow-hc: oklch(0.65 0.15 100);
  --color-yellow-kawaii: oklch(0.9 0.1 100);
  --color-sky-light: oklch(0.7 0.14 210);
  --color-sky-dark: oklch(0.75 0.13 210);
  --color-sky-hc: oklch(0.5 0.2 210);
  --color-sky-kawaii: oklch(0.87 0.11 210);
  --color-red-light: oklch(0.65 0.22 27);
  --color-red-dark: oklch(0.7 0.21 27);
  --color-red-hc: oklch(0.5 0.28 20);
  --color-red-kawaii: oklch(0.84 0.14 20);
  --color-brown-light: oklch(0.62 0.12 45);
  --color-brown-dark: oklch(0.67 0.12 45);
  --color-brown-hc: oklch(0.45 0.15 45);
  --color-brown-kawaii: oklch(0.82 0.1 45);
  --color-gray-light: oklch(0.65 0 0);
  --color-gray-dark: oklch(0.7 0 0);
  --color-gray-hc: oklch(0.3 0 0);
  --color-gray-kawaii: oklch(0.87 0 0);
  --color-neutral-light: oklch(0.6 0 0);
  --color-neutral-dark: oklch(0.652 0 0);
  --color-neutral-hc: oklch(0.25 0 0);
  --color-neutral-kawaii: oklch(0.82 0 0);
  --color-black-light: oklch(0.2 0 0);
  --color-black-dark: oklch(0.25 0 0);
  --color-black-hc: oklch(0 0 0);
  --color-black-kawaii: oklch(0.35 0 0);
  --color-white-light: oklch(0.99 0.005 200);
  --color-white-dark: oklch(0.97 0 0);
  --color-white-hc: oklch(1 0 0);
  --color-white-kawaii: oklch(0.999 0 0);
  --color-teal-light: oklch(0.66 0.16 180);
  --color-teal-dark: oklch(0.71 0.15 180);
  --color-teal-hc: oklch(0.45 0.25 180);
  --color-teal-kawaii: oklch(0.86 0.1 180);
  --color-cyan-light: oklch(0.7 0.15 195);
  --color-cyan-dark: oklch(0.75 0.14 195);
  --color-cyan-hc: oklch(0.5 0.22 195);
  --color-cyan-kawaii: oklch(0.88 0.09 195);
  --color-indigo-light: oklch(0.58 0.2 260);
  --color-indigo-dark: oklch(0.65 0.18 260);
  --color-indigo-hc: oklch(0.4 0.28 260);
  --color-indigo-kawaii: oklch(0.83 0.11 260);
  --color-violet-light: oklch(0.62 0.22 300);
  --color-violet-dark: oklch(0.68 0.2 300);
  --color-violet-hc: oklch(0.42 0.3 300);
  --color-violet-kawaii: oklch(0.85 0.12 300);
  --color-lime-light: oklch(0.75 0.16 125);
  --color-lime-dark: oklch(0.78 0.17 125);
  --color-lime-hc: oklch(0.6 0.22 125);
  --color-lime-kawaii: oklch(0.89 0.08 125);
  --color-emerald-light: oklch(0.64 0.16 160);
  --color-emerald-dark: oklch(0.69 0.15 160);
  --color-emerald-hc: oklch(0.48 0.22 160);
  --color-emerald-kawaii: oklch(0.86 0.1 160);
  --color-amber-light: oklch(0.75 0.13 85);
  --color-amber-dark: oklch(0.78 0.14 85);
  --color-amber-hc: oklch(0.62 0.18 85);
  --color-amber-kawaii: oklch(0.9 0.08 85);
  --color-rose-light: oklch(0.63 0.21 15);
  --color-rose-dark: oklch(0.68 0.19 15);
  --color-rose-hc: oklch(0.48 0.3 15);
  --color-rose-kawaii: oklch(0.86 0.13 15);
  --color-slate-light: oklch(0.55 0.015 240);
  --color-slate-dark: oklch(0.6 0.015 240);
  --color-slate-hc: oklch(0.35 0.02 240);
  --color-slate-kawaii: oklch(0.84 0.01 240);
  --color-zinc-light: oklch(0.58 0.01 240);
  --color-zinc-dark: oklch(0.63 0.01 240);
  --color-zinc-hc: oklch(0.38 0.01 240);
  --color-zinc-kawaii: oklch(0.85 0.005 240);
  --color-gray1-light: oklch(0.900 0 0);
  --color-gray1-dark: oklch(0.200 0 0);
  --color-gray1-hc: oklch(0.900 0 0);
  --color-gray1-kawaii: oklch(0.900 0 0);
  --color-gray2-light: oklch(0.850 0 0);
  --color-gray2-dark: oklch(0.250 0 0);
  --color-gray2-hc: oklch(0.850 0 0);
  --color-gray2-kawaii: oklch(0.850 0 0);
  --color-gray3-light: oklch(0.800 0 0);
  --color-gray3-dark: oklch(0.300 0 0);
  --color-gray3-hc: oklch(0.800 0 0);
  --color-gray3-kawaii: oklch(0.800 0 0);
  --color-gray4-light: oklch(0.750 0 0);
  --color-gray4-dark: oklch(0.350 0 0);
  --color-gray4-hc: oklch(0.750 0 0);
  --color-gray4-kawaii: oklch(0.750 0 0);
  --color-gray5-light: oklch(0.700 0 0);
  --color-gray5-dark: oklch(0.400 0 0);
  --color-gray5-hc: oklch(0.700 0 0);
  --color-gray5-kawaii: oklch(0.700 0 0);
  --color-gray6-light: oklch(0.650 0 0);
  --color-gray6-dark: oklch(0.451 0 0);
  --color-gray6-hc: oklch(0.650 0 0);
  --color-gray6-kawaii: oklch(0.650 0 0);
  --color-gray7-light: oklch(0.600 0 0);
  --color-gray7-dark: oklch(0.501 0 0);
  --color-gray7-hc: oklch(0.600 0 0);
  --color-gray7-kawaii: oklch(0.600 0 0);
  --color-gray8-light: oklch(0.550 0 0);
  --color-gray8-dark: oklch(0.551 0 0);
  --color-gray8-hc: oklch(0.550 0 0);
  --color-gray8-kawaii: oklch(0.550 0 0);
  --color-gray9-light: oklch(0.500 0 0);
  --color-gray9-dark: oklch(0.601 0 0);
  --color-gray9-hc: oklch(0.500 0 0);
  --color-gray9-kawaii: oklch(0.500 0 0);
  --color-gray10-light: oklch(0.450 0 0);
  --color-gray10-dark: oklch(0.651 0 0);
  --color-gray10-hc: oklch(0.450 0 0);
  --color-gray10-kawaii: oklch(0.450 0 0);
  --color-text-light: oklch(0.15 0.0049 230);
  --color-text-dark: oklch(0.95 0.0049 230);
  --color-text-secondary-light: oklch(0.45 0.0049 230);
  --color-text-secondary-dark: oklch(0.75 0.0049 230);
  --color-text-tertiary-light: oklch(0.55 0.0049 230);
  --color-text-tertiary-dark: oklch(0.65 0.0049 230);
  --color-text-quaternary-light: oklch(0.7 0.0049 230);
  --color-text-quaternary-dark: oklch(0.451 0.0049 230);
  --color-placeholder-text-light: oklch(0.8 0.0049 226);
  --color-placeholder-text-dark: oklch(0.6 0.0049 226);
  --color-border-light: oklch(0.92 0.0049 234);
  --color-border-dark: oklch(0.35 0.0049 234);
  --color-border-secondary-light: oklch(0.94 0.0049 234);
  --color-border-secondary-dark: oklch(0.3 0.0049 234);
  --color-separator-light: oklch(0.88 0.0049 236);
  --color-separator-dark: oklch(0.33 0.0049 236);
  --color-link-light: oklch(0.7 0.16 250);
  --color-link-dark: oklch(0.78 0.14 250);
  --color-disabled-control-light: oklch(0.94 0.0049 226);
  --color-disabled-control-dark: oklch(0.27 0.0049 226);
  --color-disabled-text-light: oklch(0.9 0.0049 226);
  --color-disabled-text-dark: oklch(0.55 0.0049 226);
  --color-background-light: oklch(0.99 0.0049 230);
  --color-background-dark: oklch(0.22 0.0049 230);
  --color-background-secondary-light: oklch(0.98 0.0049 230);
  --color-background-secondary-dark: oklch(0.26 0.0049 230);
  --color-background-tertiary-light: oklch(0.97 0.0049 230);
  --color-background-tertiary-dark: oklch(0.30 0.0049 230);
  --color-background-quaternary-light: oklch(0.96 0.0049 230);
  --color-background-quaternary-dark: oklch(0.34 0.0049 230);
  --color-background-quinary-light: oklch(0.949 0.0049 230);
  --color-background-quinary-dark: oklch(0.38 0.0049 230);
  --color-fill-light: oklch(0.96 0.0049 228);
  --color-fill-dark: oklch(0.3 0.0049 228);
  --color-fill-secondary-light: oklch(0.94 0.0049 228);
  --color-fill-secondary-dark: oklch(0.35 0.0049 228);
  --color-fill-tertiary-light: oklch(0.92 0.0049 228);
  --color-fill-tertiary-dark: oklch(0.4 0.0049 228);
  --color-fill-quaternary-light: oklch(0.90 0.0049 228);
  --color-fill-quaternary-dark: oklch(0.45 0.0049 228);
  --color-material-ultra-thick-light: oklch(0.96 0.0049 232 / 0.93);
  --color-material-ultra-thick-dark: oklch(0.2 0.0049 232 / 0.93);
  --color-material-thick-light: oklch(0.96 0.0049 232 / 0.85);
  --color-material-thick-dark: oklch(0.2 0.0049 232 / 0.85);
  --color-material-medium-light: oklch(0.96 0.0049 232 / 0.65);
  --color-material-medium-dark: oklch(0.2 0.0049 232 / 0.80);
  --color-material-thin-light: oklch(0.96 0.0049 232 / 0.60);
  --color-material-thin-dark: oklch(0.2 0.0049 232 / 0.60);
  --color-material-ultra-thin-light: oklch(0.96 0.0049 232 / 0.45);
  --color-material-ultra-thin-dark: oklch(0.2 0.0049 232 / 0.45);
  --color-material-opaque-light: oklch(0.96 0.0049 232);
  --color-material-opaque-dark: oklch(0.2 0.0049 232);
  --color-accent-light: oklch(0.65 0.18 238);
  --color-accent-dark: oklch(0.70 0.16 237);
  --color-primary-light: oklch(0.55 0.20 249);
  --color-primary-dark: oklch(0.75 0.17 250);
  --color-secondary-light: oklch(0.77 0.14 171);
  --color-secondary-dark: oklch(0.8 0.14 170);
}

@layer theme {
  :root {
    /* Dark mode overrides */
    @variant dark {
      --color-blue: oklch(0.7 0.16 237);
    --color-pink: oklch(0.73 0.2 350);
    --color-purple: oklch(0.7 0.18 280);
    --color-green: oklch(0.72 0.16 155);
    --color-orange: oklch(0.73 0.16 60);
    --color-yellow: oklch(0.85 0.18 100);
    --color-sky: oklch(0.75 0.13 210);
    --color-red: oklch(0.7 0.21 27);
    --color-brown: oklch(0.67 0.12 45);
    --color-gray: oklch(0.7 0 0);
    --color-neutral: oklch(0.652 0 0);
    --color-black: oklch(0.25 0 0);
    --color-white: oklch(0.97 0 0);
    --color-teal: oklch(0.71 0.15 180);
    --color-cyan: oklch(0.75 0.14 195);
    --color-indigo: oklch(0.65 0.18 260);
    --color-violet: oklch(0.68 0.2 300);
    --color-lime: oklch(0.78 0.17 125);
    --color-emerald: oklch(0.69 0.15 160);
    --color-amber: oklch(0.78 0.14 85);
    --color-rose: oklch(0.68 0.19 15);
    --color-slate: oklch(0.6 0.015 240);
    --color-zinc: oklch(0.63 0.01 240);
    --color-gray1: oklch(0.200 0 0);
    --color-gray2: oklch(0.250 0 0);
    --color-gray3: oklch(0.300 0 0);
    --color-gray4: oklch(0.350 0 0);
    --color-gray5: oklch(0.400 0 0);
    --color-gray6: oklch(0.451 0 0);
    --color-gray7: oklch(0.501 0 0);
    --color-gray8: oklch(0.551 0 0);
    --color-gray9: oklch(0.601 0 0);
    --color-gray10: oklch(0.651 0 0);
    --color-text: oklch(0.95 0.0049 230);
    --color-text-secondary: oklch(0.75 0.0049 230);
    --color-text-tertiary: oklch(0.65 0.0049 230);
    --color-text-quaternary: oklch(0.451 0.0049 230);
    --color-placeholder-text: oklch(0.6 0.0049 226);
    --color-border: oklch(0.35 0.0049 234);
    --color-border-secondary: oklch(0.3 0.0049 234);
    --color-separator: oklch(0.33 0.0049 236);
    --color-link: oklch(0.78 0.14 250);
    --color-disabled-control: oklch(0.27 0.0049 226);
    --color-disabled-text: oklch(0.55 0.0049 226);
    --color-background: oklch(0.22 0.0049 230);
    --color-background-secondary: oklch(0.26 0.0049 230);
    --color-background-tertiary: oklch(0.30 0.0049 230);
    --color-background-quaternary: oklch(0.34 0.0049 230);
    --color-background-quinary: oklch(0.38 0.0049 230);
    --color-fill: oklch(0.3 0.0049 228);
    --color-fill-secondary: oklch(0.35 0.0049 228);
    --color-fill-tertiary: oklch(0.4 0.0049 228);
    --color-fill-quaternary: oklch(0.45 0.0049 228);
    --color-material-ultra-thick: oklch(0.2 0.0049 232 / 0.93);
    --color-material-thick: oklch(0.2 0.0049 232 / 0.85);
    --color-material-medium: oklch(0.2 0.0049 232 / 0.80);
    --color-material-thin: oklch(0.2 0.0049 232 / 0.60);
    --color-material-ultra-thin: oklch(0.2 0.0049 232 / 0.45);
    --color-material-opaque: oklch(0.2 0.0049 232);
    --color-accent: oklch(0.70 0.16 237);
    --color-primary: oklch(0.75 0.17 250);
    --color-secondary: oklch(0.8 0.14 170);
    }
  }
}


@layer theme {
  [data-contrast=low], [data-contrast=low] * {
     /* Kawaii color overrides */
     --color-blue: oklch(0.85 0.12 237);
      --color-pink: oklch(0.87 0.16 350);
      --color-purple: oklch(0.84 0.14 280);
      --color-green: oklch(0.85 0.12 155);
      --color-orange: oklch(0.86 0.12 60);
      --color-yellow: oklch(0.9 0.1 100);
      --color-sky: oklch(0.87 0.11 210);
      --color-red: oklch(0.84 0.14 20);
      --color-brown: oklch(0.82 0.1 45);
      --color-gray: oklch(0.87 0 0);
      --color-neutral: oklch(0.82 0 0);
      --color-black: oklch(0.35 0 0);
      --color-white: oklch(0.999 0 0);
      --color-teal: oklch(0.86 0.1 180);
      --color-cyan: oklch(0.88 0.09 195);
      --color-indigo: oklch(0.83 0.11 260);
      --color-violet: oklch(0.85 0.12 300);
      --color-lime: oklch(0.89 0.08 125);
      --color-emerald: oklch(0.86 0.1 160);
      --color-amber: oklch(0.9 0.08 85);
      --color-rose: oklch(0.86 0.13 15);
      --color-slate: oklch(0.84 0.01 240);
      --color-zinc: oklch(0.85 0.005 240);
      --color-gray1: oklch(0.900 0 0);
      --color-gray2: oklch(0.850 0 0);
      --color-gray3: oklch(0.800 0 0);
      --color-gray4: oklch(0.750 0 0);
      --color-gray5: oklch(0.700 0 0);
      --color-gray6: oklch(0.650 0 0);
      --color-gray7: oklch(0.600 0 0);
      --color-gray8: oklch(0.550 0 0);
      --color-gray9: oklch(0.500 0 0);
      --color-gray10: oklch(0.450 0 0);
      --color-text: oklch(0.15 0.02 320);
      --color-text-secondary: oklch(0.3 0.02 320);
      --color-text-tertiary: oklch(0.5 0.01 320);
      --color-text-quaternary: oklch(0.75 0.01 320);
      --color-placeholder-text: oklch(0.65 0.02 320);
      --color-border: oklch(0.85 0.02 330);
      --color-border-secondary: oklch(0.9 0.01 330);
      --color-separator: oklch(0.88 0.01 330);
      --color-link: oklch(0.86 0.0617 256.24);
      --color-disabled-control: oklch(0.92 0.0049 338.82);
      --color-disabled-text: oklch(0.7 0.0049 338.82);
      --color-background: oklch(0.986 0 358.73967248753775);
      --color-background-secondary: oklch(0.978 0.004 358.73967248753775);
      --color-background-tertiary: oklch(0.970 0.005 358.73967248753775);
      --color-background-quaternary: oklch(0.962 0.006 358.73967248753775);
      --color-background-quinary: oklch(0.954 0.01 358.73967248753775);
      --color-fill: oklch(0.964 0.0049 338.82);
      --color-fill-secondary: oklch(0.952 0.0049 338.82);
      --color-fill-tertiary: oklch(0.940 0.0049 338.82);
      --color-fill-quaternary: oklch(0.928 0.0049 338.82);
      --color-material-ultra-thick: oklch(0.956 0.0049 338.82 / 0.93);
      --color-material-thick: oklch(0.952 0.0049 338.82 / 0.85);
      --color-material-medium: oklch(0.948 0.0049 338.82 / 0.65);
      --color-material-thin: oklch(0.944 0.0049 338.82 / 0.60);
      --color-material-ultra-thin: oklch(0.940 0.0049 338.82 / 0.45);
      --color-material-opaque: oklch(0.936 0.0049 338.82);
      --color-accent: oklch(0.71 0.14 237);
      --color-primary: oklch(0.68 0.14 237);
      --color-secondary: oklch(0.7486 0.1168 187.91);

     /* Kawaii dark mode overrides */
     @variant dark {
       --color-blue: oklch(0.65 0.14 237);
        --color-pink: oklch(0.7 0.18 350);
        --color-purple: oklch(0.67 0.16 280);
        --color-green: oklch(0.68 0.14 155);
        --color-orange: oklch(0.69 0.14 60);
        --color-yellow: oklch(0.73 0.12 100);
        --color-sky: oklch(0.7 0.13 210);
        --color-red: oklch(0.67 0.16 20);
        --color-brown: oklch(0.65 0.12 45);
        --color-gray: oklch(0.7 0 0);
        --color-neutral: oklch(0.65 0 0);
        --color-black: oklch(0.5 0 0);
        --color-white: oklch(0.95 0 0);
        --color-teal: oklch(0.72 0.12 180);
        --color-cyan: oklch(0.74 0.11 195);
        --color-indigo: oklch(0.69 0.13 260);
        --color-violet: oklch(0.71 0.14 300);
        --color-lime: oklch(0.75 0.1 125);
        --color-emerald: oklch(0.72 0.12 160);
        --color-amber: oklch(0.76 0.1 85);
        --color-rose: oklch(0.72 0.15 15);
        --color-slate: oklch(0.7 0.01 240);
        --color-zinc: oklch(0.71 0.005 240);
        --color-gray1: oklch(0.200 0 0);
        --color-gray2: oklch(0.250 0 0);
        --color-gray3: oklch(0.300 0 0);
        --color-gray4: oklch(0.350 0 0);
        --color-gray5: oklch(0.400 0 0);
        --color-gray6: oklch(0.451 0 0);
        --color-gray7: oklch(0.501 0 0);
        --color-gray8: oklch(0.551 0 0);
        --color-gray9: oklch(0.601 0 0);
        --color-gray10: oklch(0.651 0 0);
        --color-text: oklch(0.95 0.01 320);
        --color-text-secondary: oklch(0.85 0.01 320);
        --color-text-tertiary: oklch(0.7 0.01 320);
        --color-text-quaternary: oklch(0.55 0.01 320);
        --color-placeholder-text: oklch(0.6 0.01 320);
        --color-border: oklch(0.3 0.0049 338.82);
        --color-border-secondary: oklch(0.25 0.0049 338.82);
        --color-separator: oklch(0.28 0.0049 338.82);
        --color-link: oklch(0.8959 0.0524530753637823 250.67881278919134);
        --color-disabled-control: oklch(0.22 0.0049 338.82);
        --color-disabled-text: oklch(0.5 0.0049 338.82);
        --color-background: oklch(0.241 0.0049 338.82);
        --color-background-secondary: oklch(0.253 0.0049 338.82);
        --color-background-tertiary: oklch(0.265 0.0049 338.82);
        --color-background-quaternary: oklch(0.277 0.0049 338.82);
        --color-background-quinary: oklch(0.289 0.0049 338.82);
        --color-fill: oklch(0.255 0.0049 338.82);
        --color-fill-secondary: oklch(0.275 0.0049 338.82);
        --color-fill-tertiary: oklch(0.295 0.0049 338.82);
        --color-fill-quaternary: oklch(0.315 0.0049 338.82);
        --color-material-ultra-thick: oklch(0.156 0.0049 338.82 / 0.93);
        --color-material-thick: oklch(0.152 0.0049 338.82 / 0.85);
        --color-material-medium: oklch(0.148 0.0049 338.82 / 0.80);
        --color-material-thin: oklch(0.144 0.0049 338.82 / 0.60);
        --color-material-ultra-thin: oklch(0.140 0.0049 338.82 / 0.45);
        --color-material-opaque: oklch(0.136 0.0049 338.82);
        --color-accent: oklch(0.67 0.14 237);
        --color-primary: oklch(0.7 0.14 237);
        --color-secondary: oklch(0.77 0.1168 187.91);
     }
   }
}

@layer theme {
 [data-contrast=high], [data-contrast=high] * {
     /* High contrast color overrides */
     --color-blue: oklch(0.45 0.25 237);
      --color-pink: oklch(0.5 0.3 350);
      --color-purple: oklch(0.45 0.28 280);
      --color-green: oklch(0.5 0.2 155);
      --color-orange: oklch(0.55 0.18 60);
      --color-yellow: oklch(0.65 0.15 100);
      --color-sky: oklch(0.5 0.2 210);
      --color-red: oklch(0.5 0.28 20);
      --color-brown: oklch(0.45 0.15 45);
      --color-gray: oklch(0.3 0 0);
      --color-neutral: oklch(0.25 0 0);
      --color-black: oklch(0 0 0);
      --color-white: oklch(1 0 0);
      --color-teal: oklch(0.45 0.25 180);
      --color-cyan: oklch(0.5 0.22 195);
      --color-indigo: oklch(0.4 0.28 260);
      --color-violet: oklch(0.42 0.3 300);
      --color-lime: oklch(0.6 0.22 125);
      --color-emerald: oklch(0.48 0.22 160);
      --color-amber: oklch(0.62 0.18 85);
      --color-rose: oklch(0.48 0.3 15);
      --color-slate: oklch(0.35 0.02 240);
      --color-zinc: oklch(0.38 0.01 240);
      --color-gray1: oklch(0.900 0 0);
      --color-gray2: oklch(0.850 0 0);
      --color-gray3: oklch(0.800 0 0);
      --color-gray4: oklch(0.750 0 0);
      --color-gray5: oklch(0.700 0 0);
      --color-gray6: oklch(0.650 0 0);
      --color-gray7: oklch(0.600 0 0);
      --color-gray8: oklch(0.550 0 0);
      --color-gray9: oklch(0.500 0 0);
      --color-gray10: oklch(0.450 0 0);
      --color-text: oklch(0.12 0.02 200);
      --color-text-secondary: oklch(0.25 0.02 200);
      --color-text-tertiary: oklch(0.4 0.02 200);
      --color-text-quaternary: oklch(0.55 0.015 200);
      --color-placeholder-text: oklch(0.5 0.015 200);
      --color-border: oklch(0.80 0.02 200);
      --color-border-secondary: oklch(0.85 0.01 200);
      --color-separator: oklch(0.83 0.01 200);
      --color-link: oklch(0.35 0.3 200);
      --color-disabled-control: oklch(0.7 0.01 200);
      --color-disabled-text: oklch(0.6 0.01 200);
      --color-background: oklch(1.0 0.005 200);
      --color-background-secondary: oklch(0.985 0.003 200);
      --color-background-tertiary: oklch(0.97 0.005 200);
      --color-background-quaternary: oklch(0.955 0.005 200);
      --color-background-quinary: oklch(0.94 0.005 200);
      --color-fill: oklch(0.66 0.005 200);
      --color-fill-secondary: oklch(0.52 0.01 200);
      --color-fill-tertiary: oklch(0.38 0.01 200);
      --color-fill-quaternary: oklch(0.24 0.005 200);
      --color-material-ultra-thick: oklch(0.98 0 0 / 0.95);
      --color-material-thick: oklch(0.96 0 0 / 0.88);
      --color-material-medium: oklch(0.94 0 0 / 0.70);
      --color-material-thin: oklch(0.92 0 0 / 0.65);
      --color-material-ultra-thin: oklch(0.90 0 0 / 0.50);
      --color-material-opaque: oklch(0.949 0 0);
      --color-accent: oklch(0.45 0.25 238);
      --color-primary: oklch(0.4 0.28 261);
      --color-secondary: oklch(0.5 0.2 156);

     /* High contrast dark mode overrides */
     @variant dark {
       --color-blue: oklch(0.75 0.2 237);
        --color-pink: oklch(0.78 0.25 350);
        --color-purple: oklch(0.75 0.22 280);
        --color-green: oklch(0.77 0.18 155);
        --color-orange: oklch(0.78 0.2 60);
        --color-yellow: oklch(0.82 0.16 100);
        --color-sky: oklch(0.8 0.16 210);
        --color-red: oklch(0.75 0.24 20);
        --color-brown: oklch(0.72 0.14 45);
        --color-gray: oklch(0.85 0 0);
        --color-neutral: oklch(0.9 0 0);
        --color-black: oklch(0.2 0 0);
        --color-white: oklch(0.95 0 0);
        --color-teal: oklch(0.78 0.2 180);
        --color-cyan: oklch(0.8 0.18 195);
        --color-indigo: oklch(0.75 0.22 260);
        --color-violet: oklch(0.78 0.24 300);
        --color-lime: oklch(0.82 0.2 125);
        --color-emerald: oklch(0.78 0.18 160);
        --color-amber: oklch(0.83 0.17 85);
        --color-rose: oklch(0.78 0.22 15);
        --color-slate: oklch(0.82 0.02 240);
        --color-zinc: oklch(0.8 0.01 240);
        --color-gray1: oklch(0.200 0 0);
        --color-gray2: oklch(0.250 0 0);
        --color-gray3: oklch(0.300 0 0);
        --color-gray4: oklch(0.350 0 0);
        --color-gray5: oklch(0.400 0 0);
        --color-gray6: oklch(0.451 0 0);
        --color-gray7: oklch(0.501 0 0);
        --color-gray8: oklch(0.551 0 0);
        --color-gray9: oklch(0.601 0 0);
        --color-gray10: oklch(0.651 0 0);
        --color-text: oklch(0.98 0.005 200);
        --color-text-secondary: oklch(0.93 0.01 200);
        --color-text-tertiary: oklch(0.85 0.015 200);
        --color-text-quaternary: oklch(0.75 0.01 200);
        --color-placeholder-text: oklch(0.8 0.01 200);
        --color-border: oklch(0.251 0.02 200);
        --color-border-secondary: oklch(0.20 0.01 200);
        --color-separator: oklch(0.23 0.01 200);
        --color-link: oklch(0.85 0.2 200);
        --color-disabled-control: oklch(0.4 0.01 200);
        --color-disabled-text: oklch(0.5 0.01 200);
        --color-background: oklch(0.08 0.005 200);
        --color-background-secondary: oklch(0.095 0.008 200);
        --color-background-tertiary: oklch(0.11 0.008 200);
        --color-background-quaternary: oklch(0.125 0.008 200);
        --color-background-quinary: oklch(0.14 0.008 200);
        --color-fill: oklch(0.62 0.005 200);
        --color-fill-secondary: oklch(0.70 0.005 200);
        --color-fill-tertiary: oklch(0.78 0.005 200);
        --color-fill-quaternary: oklch(0.86 0.005 200);
        --color-material-ultra-thick: oklch(0.08 0 0 / 0.95);
        --color-material-thick: oklch(0.12 0 0 / 0.88);
        --color-material-medium: oklch(0.16 0 0 / 0.82);
        --color-material-thin: oklch(0.18 0 0 / 0.65);
        --color-material-ultra-thin: oklch(0.20 0 0 / 0.50);
        --color-material-opaque: oklch(0.15 0 0);
        --color-accent: oklch(0.75 0.2 236);
        --color-primary: oklch(0.75 0.22 259);
        --color-secondary: oklch(0.77 0.18 154);
     }
   }
}