@import 'tailwindcss';
@plugin '@tailwindcss/typography';
@import 'tw-animate-css';

@custom-variant dark (&:is(.dark *));

[data-domain="default"] {
  --background: oklch(1.00 0 0);
  --foreground: oklch(0.14 0 0);
  --card: oklch(1.00 0 0);
  --card-foreground: oklch(0.14 0 0);
  --popover: oklch(1.00 0 0);
  --popover-foreground: oklch(0.14 0 0);
  --primary: oklch(0.20 0 0);
  --primary-foreground: oklch(0.99 0 0);
  --secondary: oklch(0.97 0 0);
  --secondary-foreground: oklch(0.20 0 0);
  --muted: oklch(0.97 0 0);
  --muted-foreground: oklch(0.56 0 0);
  --accent: oklch(0.97 0 0);
  --accent-foreground: oklch(0.20 0 0);
  --destructive: oklch(0.58 0.24 28.48);
  --border: oklch(0.92 0 0);
  --input: oklch(0.92 0 0);
  --ring: oklch(0.71 0 0);
  --chart-1: oklch(0.65 0.22 36.85);
  --chart-2: oklch(0.60 0.11 184.15);
  --chart-3: oklch(0.40 0.07 227.18);
  --chart-4: oklch(0.83 0.17 81.03);
  --chart-5: oklch(0.77 0.17 65.36);
  --sidebar: oklch(0.99 0 0);
  --sidebar-foreground: oklch(0.14 0 0);
  --sidebar-primary: oklch(0.20 0 0);
  --sidebar-primary-foreground: oklch(0.99 0 0);
  --sidebar-accent: oklch(0.97 0 0);
  --sidebar-accent-foreground: oklch(0.20 0 0);
  --sidebar-border: oklch(0.92 0 0);
  --sidebar-ring: oklch(0.708 0 0);;

  --font-sans: 'Geist', 'Geist Fallback', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
  --font-serif: "Geist", "Geist Fallback", ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  --font-mono: "Geist Mono", "Geist Mono Fallback", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

  --radius: 0.625rem;
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
  
}

.dark[data-domain="default"] {
  --background: oklch(0.14 0 0);
  --foreground: oklch(0.99 0 0);
  --card: oklch(0.20 0 0);
  --card-foreground: oklch(0.99 0 0);
  --popover: oklch(0.20 0 0);
  --popover-foreground: oklch(0.99 0 0);
  --primary: oklch(0.92 0 0);
  --primary-foreground: oklch(0.20 0 0);
  --secondary: oklch(0.27 0 0);
  --secondary-foreground: oklch(0.99 0 0);
  --muted: oklch(0.27 0 0);
  --muted-foreground: oklch(0.71 0 0);
  --accent: oklch(0.27 0 0);
  --accent-foreground: oklch(0.99 0 0);
  --destructive: oklch(0.70 0.19 22.23);
  --border: oklch(1.00 0 0 / 10%);
  --input: oklch(1.00 0 0 / 15%);
  --ring: oklch(0.56 0 0);
  --chart-1: oklch(0.49 0.24 264.40);
  --chart-2: oklch(0.70 0.16 160.43);
  --chart-3: oklch(0.77 0.17 65.36);
  --chart-4: oklch(0.62 0.26 305.32);
  --chart-5: oklch(0.64 0.25 16.51);
  --sidebar: oklch(0.20 0 0);
  --sidebar-foreground: oklch(0.99 0 0);
  --sidebar-primary: oklch(0.49 0.24 264.40);
  --sidebar-primary-foreground: oklch(0.99 0 0);
  --sidebar-accent: oklch(0.27 0 0);
  --sidebar-accent-foreground: oklch(0.99 0 0);
  --sidebar-border: oklch(1.00 0 0 / 10%);
  --sidebar-ring: oklch(0.56 0 0);
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
}


[data-domain="art_deco"] {
  --background: oklch(0.96 0.03 106.92);
  --foreground: oklch(0.40 0.07 90.80);
  --card: oklch(0.98 0.04 97.73);
  --card-foreground: oklch(0.32 0 0);
  --popover: oklch(0.98 0.04 97.73);
  --popover-foreground: oklch(0.32 0 0);
  --primary: oklch(0.77 0.14 91.27);
  --primary-foreground: oklch(0 0 0);
  --secondary: oklch(0.67 0.13 61.58);
  --secondary-foreground: oklch(0 0 0);
  --muted: oklch(0.93 0.03 106.94);
  --muted-foreground: oklch(0.32 0 0);
  --accent: oklch(0.89 0.18 95.47);
  --accent-foreground: oklch(0.32 0 0);
  --destructive: oklch(0.69 0.20 32.29);
  --border: oklch(0.83 0.11 93.01);
  --input: oklch(0.65 0.13 81.66);
  --ring: oklch(0.75 0.15 84.05);
  --chart-1: oklch(0.89 0.18 95.47);
  --chart-2: oklch(0.67 0.13 61.58);
  --chart-3: oklch(0.65 0.13 81.66);
  --chart-4: oklch(0.75 0.15 84.05);
  --chart-5: oklch(0.77 0.14 91.27);
  --sidebar: oklch(0.96 0.03 106.92);
  --sidebar-foreground: oklch(0.32 0 0);
  --sidebar-primary: oklch(0.77 0.14 91.27);
  --sidebar-primary-foreground: oklch(0.32 0 0);
  --sidebar-accent: oklch(0.89 0.18 95.47);
  --sidebar-accent-foreground: oklch(0.32 0 0);
  --sidebar-border: oklch(0.65 0.13 81.66);
  --sidebar-ring: oklch(0.75 0.15 84.05);

  --font-sans: Delius Swash Caps;
  --font-serif: Delius Swash Caps;
  --font-mono: Delius Swash Caps;

  --radius: 0.625rem;
  
  --shadow-2xs: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.03);
  --shadow-xs: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.03);
  --shadow-sm: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.05), 0px 1px 2px -1px oklch(0.70 0.17 28.12 / 0.05);
  --shadow: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.05), 0px 1px 2px -1px oklch(0.70 0.17 28.12 / 0.05);
  --shadow-md: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.05), 0px 2px 4px -1px oklch(0.70 0.17 28.12 / 0.05);
  --shadow-lg: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.05), 0px 4px 6px -1px oklch(0.70 0.17 28.12 / 0.05);
  --shadow-xl: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.05), 0px 8px 10px -1px oklch(0.70 0.17 28.12 / 0.05);
  --shadow-2xl: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.13);
  
}

.dark[data-domain="art_deco"] {
  --background: oklch(0.32 0 0);
  --foreground: oklch(0.96 0.03 106.92);
  --card: oklch(0.41 0 0);
  --card-foreground: oklch(0.96 0.03 106.92);
  --popover: oklch(0.41 0 0);
  --popover-foreground: oklch(0.96 0.03 106.92);
  --primary: oklch(0.84 0.17 83.07);
  --primary-foreground: oklch(0 0 0);
  --secondary: oklch(0.47 0.11 50.64);
  --secondary-foreground: oklch(0.96 0.03 106.92);
  --muted: oklch(0.44 0 0);
  --muted-foreground: oklch(0.96 0.03 106.92);
  --accent: oklch(0.66 0.14 79.74);
  --accent-foreground: oklch(0 0 0);
  --destructive: oklch(0.66 0.23 35.22);
  --border: oklch(0.47 0.11 50.64);
  --input: oklch(0.47 0.11 50.64);
  --ring: oklch(0.65 0.13 81.66);
  --chart-1: oklch(0.75 0.15 84.05);
  --chart-2: oklch(0.47 0.11 50.64);
  --chart-3: oklch(0.65 0.13 81.66);
  --chart-4: oklch(0.75 0.15 84.05);
  --chart-5: oklch(0.65 0.13 81.66);
  --sidebar: oklch(0.32 0 0);
  --sidebar-foreground: oklch(1.00 0 0);
  --sidebar-primary: oklch(0.61 0.13 79.65);
  --sidebar-primary-foreground: oklch(1.00 0 0);
  --sidebar-accent: oklch(0.75 0.15 84.05);
  --sidebar-accent-foreground: oklch(0.96 0.03 106.92);
  --sidebar-border: oklch(0.47 0.11 50.64);
  --sidebar-ring: oklch(0.65 0.13 81.66);
  
  --shadow-2xs: 0px 1px 3px 0px oklch(0 0 0 / 0.03);
  --shadow-xs: 0px 1px 3px 0px oklch(0 0 0 / 0.03);
  --shadow-sm: 0px 1px 3px 0px oklch(0 0 0 / 0.05), 0px 1px 2px -1px oklch(0 0 0 / 0.05);
  --shadow: 0px 1px 3px 0px oklch(0 0 0 / 0.05), 0px 1px 2px -1px oklch(0 0 0 / 0.05);
  --shadow-md: 0px 1px 3px 0px oklch(0 0 0 / 0.05), 0px 2px 4px -1px oklch(0 0 0 / 0.05);
  --shadow-lg: 0px 1px 3px 0px oklch(0 0 0 / 0.05), 0px 4px 6px -1px oklch(0 0 0 / 0.05);
  --shadow-xl: 0px 1px 3px 0px oklch(0 0 0 / 0.05), 0px 8px 10px -1px oklch(0 0 0 / 0.05);
  --shadow-2xl: 0px 1px 3px 0px oklch(0 0 0 / 0.13);
}

[data-domain="caffeine"] {
  --background: oklch(0.98 0 0);
  --foreground: oklch(0.24 0 0);
  --card: oklch(0.99 0 0);
  --card-foreground: oklch(0.24 0 0);
  --popover: oklch(0.99 0 0);
  --popover-foreground: oklch(0.24 0 0);
  --primary: oklch(0.43 0.04 42.00);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.92 0.07 76.67);
  --secondary-foreground: oklch(0.35 0.07 41.41);
  --muted: oklch(0.95 0 0);
  --muted-foreground: oklch(0.50 0 0);
  --accent: oklch(0.93 0 0);
  --accent-foreground: oklch(0.24 0 0);
  --destructive: oklch(0.63 0.19 33.26);
  --border: oklch(0.88 0 0);
  --input: oklch(0.88 0 0);
  --ring: oklch(0.43 0.04 42.00);
  --chart-1: oklch(0.43 0.04 42.00);
  --chart-2: oklch(0.92 0.07 76.67);
  --chart-3: oklch(0.93 0 0);
  --chart-4: oklch(0.94 0.05 75.02);
  --chart-5: oklch(0.43 0.04 42.00);
  --sidebar: oklch(0.99 0 0);
  --sidebar-foreground: oklch(0.26 0 0);
  --sidebar-primary: oklch(0.33 0 0);
  --sidebar-primary-foreground: oklch(0.99 0 0);
  --sidebar-accent: oklch(0.98 0 0);
  --sidebar-accent-foreground: oklch(0.33 0 0);
  --sidebar-border: oklch(0.94 0 0);
  --sidebar-ring: oklch(0.77 0 0);

  --font-sans: 'Geist', 'Geist Fallback', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
  --font-serif: "Geist", "Geist Fallback", ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  --font-mono: "Geist Mono", "Geist Mono Fallback", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

  --radius: 0.5rem;
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
  
}

.dark[data-domain="caffeine"] {
  --background: oklch(0.18 0 0);
  --foreground: oklch(0.95 0 0);
  --card: oklch(0.21 0 0);
  --card-foreground: oklch(0.95 0 0);
  --popover: oklch(0.21 0 0);
  --popover-foreground: oklch(0.95 0 0);
  --primary: oklch(0.92 0.05 67.14);
  --primary-foreground: oklch(0.20 0.02 201.14);
  --secondary: oklch(0.32 0.02 67.00);
  --secondary-foreground: oklch(0.92 0.05 67.14);
  --muted: oklch(0.25 0 0);
  --muted-foreground: oklch(0.77 0 0);
  --accent: oklch(0.29 0 0);
  --accent-foreground: oklch(0.95 0 0);
  --destructive: oklch(0.63 0.19 33.26);
  --border: oklch(0.24 0.01 88.77);
  --input: oklch(0.40 0 0);
  --ring: oklch(0.92 0.05 67.14);
  --chart-1: oklch(0.92 0.05 67.14);
  --chart-2: oklch(0.32 0.02 67.00);
  --chart-3: oklch(0.29 0 0);
  --chart-4: oklch(0.35 0.02 67.11);
  --chart-5: oklch(0.92 0.05 67.14);
  --sidebar: oklch(0.21 0.01 285.56);
  --sidebar-foreground: oklch(0.97 0 0);
  --sidebar-primary: oklch(0.49 0.22 264.43);
  --sidebar-primary-foreground: oklch(1.00 0 0);
  --sidebar-accent: oklch(0.27 0.01 285.81);
  --sidebar-accent-foreground: oklch(0.97 0 0);
  --sidebar-border: oklch(0.27 0.01 285.81);
  --sidebar-ring: oklch(0.87 0.01 286.27);
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
}

[data-domain="claude"] {
  --background: oklch(0.98 0.01 93.48);
  --foreground: oklch(0.34 0.03 94.42);
  --card: oklch(0.98 0.01 93.48);
  --card-foreground: oklch(0.19 0 0);
  --popover: oklch(1.00 0 0);
  --popover-foreground: oklch(0.27 0.02 99.70);
  --primary: oklch(0.62 0.14 39.15);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.92 0.01 87.42);
  --secondary-foreground: oklch(0.43 0.02 99.33);
  --muted: oklch(0.95 0.01 91.46);
  --muted-foreground: oklch(0.61 0.01 91.49);
  --accent: oklch(0.92 0.01 87.42);
  --accent-foreground: oklch(0.27 0.02 99.70);
  --destructive: oklch(0.19 0 0);
  --border: oklch(0.91 0.01 106.47);
  --input: oklch(0.76 0.02 96.91);
  --ring: oklch(0.59 0.17 252.92);
  --chart-1: oklch(0.56 0.13 42.95);
  --chart-2: oklch(0.69 0.16 290.29);
  --chart-3: oklch(0.88 0.03 91.64);
  --chart-4: oklch(0.88 0.04 298.21);
  --chart-5: oklch(0.56 0.13 41.94);
  --sidebar: oklch(0.97 0.01 93.49);
  --sidebar-foreground: oklch(0.36 0.01 106.85);
  --sidebar-primary: oklch(0.62 0.14 39.15);
  --sidebar-primary-foreground: oklch(0.99 0 0);
  --sidebar-accent: oklch(0.22 0 0);
  --sidebar-accent-foreground: oklch(0.33 0 0);
  --sidebar-border: oklch(0.94 0 0);
  --sidebar-ring: oklch(0.77 0 0);

  --font-sans: 'Geist', 'Geist Fallback', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
  --font-serif: "Geist", "Geist Fallback", ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  --font-mono: "Geist Mono", "Geist Mono Fallback", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

  --radius: 0.5rem;
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
  
}

.dark[data-domain="claude"] {
  --background: oklch(0.27 0 0);
  --foreground: oklch(0.81 0.01 93.53);
  --card: oklch(0.27 0 0);
  --card-foreground: oklch(0.98 0.01 93.48);
  --popover: oklch(0.31 0 0);
  --popover-foreground: oklch(0.92 0 0);
  --primary: oklch(0.67 0.13 38.92);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.98 0.01 93.48);
  --secondary-foreground: oklch(0.31 0 0);
  --muted: oklch(0.22 0 0);
  --muted-foreground: oklch(0.77 0.02 100.64);
  --accent: oklch(0.21 0.01 88.79);
  --accent-foreground: oklch(0.97 0.01 93.49);
  --destructive: oklch(0.64 0.21 25.39);
  --border: oklch(0.36 0.01 106.85);
  --input: oklch(0.43 0.01 99.03);
  --ring: oklch(0.59 0.17 252.92);
  --chart-1: oklch(0.56 0.13 42.95);
  --chart-2: oklch(0.69 0.16 290.29);
  --chart-3: oklch(0.21 0.01 88.79);
  --chart-4: oklch(0.31 0.05 289.74);
  --chart-5: oklch(0.56 0.13 41.94);
  --sidebar: oklch(0.24 0 0);
  --sidebar-foreground: oklch(0.81 0.01 93.53);
  --sidebar-primary: oklch(0.33 0 0);
  --sidebar-primary-foreground: oklch(0.99 0 0);
  --sidebar-accent: oklch(0.17 0 0);
  --sidebar-accent-foreground: oklch(0.81 0.01 93.53);
  --sidebar-border: oklch(0.94 0 0);
  --sidebar-ring: oklch(0.77 0 0);
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
}

[data-domain="clean_slate"] {
  --background: oklch(0.98 0 0);
  --foreground: oklch(0.28 0.04 260.33);
  --card: oklch(1.00 0 0);
  --card-foreground: oklch(0.28 0.04 260.33);
  --popover: oklch(1.00 0 0);
  --popover-foreground: oklch(0.28 0.04 260.33);
  --primary: oklch(0.59 0.20 277.06);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.93 0.01 261.82);
  --secondary-foreground: oklch(0.37 0.03 259.73);
  --muted: oklch(0.97 0 0);
  --muted-foreground: oklch(0.55 0.02 264.41);
  --accent: oklch(0.93 0.03 273.66);
  --accent-foreground: oklch(0.37 0.03 259.73);
  --destructive: oklch(0.64 0.21 25.39);
  --border: oklch(0.87 0.01 261.81);
  --input: oklch(0.87 0.01 261.81);
  --ring: oklch(0.59 0.20 277.06);
  --chart-1: oklch(0.59 0.20 277.06);
  --chart-2: oklch(0.51 0.23 276.97);
  --chart-3: oklch(0.46 0.21 277.06);
  --chart-4: oklch(0.40 0.18 277.16);
  --chart-5: oklch(0.36 0.14 278.65);
  --sidebar: oklch(0.97 0 0);
  --sidebar-foreground: oklch(0.28 0.04 260.33);
  --sidebar-primary: oklch(0.59 0.20 277.06);
  --sidebar-primary-foreground: oklch(1.00 0 0);
  --sidebar-accent: oklch(0.93 0.03 273.66);
  --sidebar-accent-foreground: oklch(0.37 0.03 259.73);
  --sidebar-border: oklch(0.87 0.01 261.81);
  --sidebar-ring: oklch(0.59 0.20 277.06);

  --font-sans: Inter, sans-serif;
  --font-serif: Merriweather, serif;
  --font-mono: JetBrains Mono, monospace;

  --radius: 0.5rem;
  
  --shadow-2xs: 0px 4px 8px -1px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0px 4px 8px -1px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0px 4px 8px -1px oklch(0.00 0 0 / 0.10), 0px 1px 2px -2px oklch(0.00 0 0 / 0.10);
  --shadow: 0px 4px 8px -1px oklch(0.00 0 0 / 0.10), 0px 1px 2px -2px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0px 4px 8px -1px oklch(0.00 0 0 / 0.10), 0px 2px 4px -2px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0px 4px 8px -1px oklch(0.00 0 0 / 0.10), 0px 4px 6px -2px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0px 4px 8px -1px oklch(0.00 0 0 / 0.10), 0px 8px 10px -2px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0px 4px 8px -1px oklch(0.00 0 0 / 0.25);
  
}

.dark[data-domain="clean_slate"] {
  --background: oklch(0.21 0.04 264.04);
  --foreground: oklch(0.93 0.01 256.71);
  --card: oklch(0.28 0.04 260.33);
  --card-foreground: oklch(0.93 0.01 256.71);
  --popover: oklch(0.28 0.04 260.33);
  --popover-foreground: oklch(0.93 0.01 256.71);
  --primary: oklch(0.68 0.16 276.93);
  --primary-foreground: oklch(0.21 0.04 264.04);
  --secondary: oklch(0.34 0.03 261.83);
  --secondary-foreground: oklch(0.87 0.01 261.81);
  --muted: oklch(0.28 0.04 260.33);
  --muted-foreground: oklch(0.71 0.02 261.33);
  --accent: oklch(0.37 0.03 259.73);
  --accent-foreground: oklch(0.87 0.01 261.81);
  --destructive: oklch(0.64 0.21 25.39);
  --border: oklch(0.45 0.03 257.68);
  --input: oklch(0.45 0.03 257.68);
  --ring: oklch(0.68 0.16 276.93);
  --chart-1: oklch(0.68 0.16 276.93);
  --chart-2: oklch(0.59 0.20 277.06);
  --chart-3: oklch(0.51 0.23 276.97);
  --chart-4: oklch(0.46 0.21 277.06);
  --chart-5: oklch(0.40 0.18 277.16);
  --sidebar: oklch(0.28 0.04 260.33);
  --sidebar-foreground: oklch(0.93 0.01 256.71);
  --sidebar-primary: oklch(0.68 0.16 276.93);
  --sidebar-primary-foreground: oklch(0.21 0.04 264.04);
  --sidebar-accent: oklch(0.37 0.03 259.73);
  --sidebar-accent-foreground: oklch(0.87 0.01 261.81);
  --sidebar-border: oklch(0.45 0.03 257.68);
  --sidebar-ring: oklch(0.68 0.16 276.93);
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
}

[data-domain="corporate"] {
  --background: oklch(0.96 0.01 271.34);
  --foreground: oklch(0.21 0.03 263.61);
  --card: oklch(0.98 0.01 271.41);
  --card-foreground: oklch(0.21 0.03 263.61);
  --popover: oklch(1.00 0 0);
  --popover-foreground: oklch(0.21 0.03 263.61);
  --primary: oklch(0.48 0.20 260.47);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.91 0.02 274.06);
  --secondary-foreground: oklch(0.37 0.03 259.73);
  --muted: oklch(0.94 0.02 274.86);
  --muted-foreground: oklch(0.55 0.02 264.41);
  --accent: oklch(0.95 0.02 260.18);
  --accent-foreground: oklch(0.48 0.20 260.47);
  --destructive: oklch(0.58 0.22 27.29);
  --border: oklch(0.89 0.02 259.43);
  --input: oklch(0.90 0.01 266.73);
  --ring: oklch(0.48 0.20 260.47);
  --chart-1: oklch(0.48 0.20 260.47);
  --chart-2: oklch(0.56 0.24 260.92);
  --chart-3: oklch(0.40 0.16 259.61);
  --chart-4: oklch(0.43 0.16 259.82);
  --chart-5: oklch(0.29 0.07 261.20);
  --sidebar: oklch(0.97 0 0);
  --sidebar-foreground: oklch(0.21 0.03 263.61);
  --sidebar-primary: oklch(0.48 0.20 260.47);
  --sidebar-primary-foreground: oklch(1.00 0 0);
  --sidebar-accent: oklch(0.95 0.02 260.18);
  --sidebar-accent-foreground: oklch(0.48 0.20 260.47);
  --sidebar-border: oklch(0.93 0.01 261.82);
  --sidebar-ring: oklch(0.48 0.20 260.47);

  --font-sans: Inter, sans-serif;
  --font-serif: Source Serif 4, serif;
  --font-mono: IBM Plex Mono, monospace;

  --radius: 0.375rem;
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
  
}

.dark[data-domain="corporate"] {
  --background: oklch(0.26 0.03 262.67);
  --foreground: oklch(0.93 0.01 261.82);
  --card: oklch(0.35 0.02 255.68);
  --card-foreground: oklch(0.93 0.01 261.82);
  --popover: oklch(0.35 0.02 255.68);
  --popover-foreground: oklch(0.93 0.01 261.82);
  --primary: oklch(0.56 0.24 260.92);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.35 0.04 261.40);
  --secondary-foreground: oklch(0.93 0.01 261.82);
  --muted: oklch(0.30 0.03 260.51);
  --muted-foreground: oklch(0.71 0.02 261.33);
  --accent: oklch(0.33 0.04 264.63);
  --accent-foreground: oklch(0.93 0.01 261.82);
  --destructive: oklch(0.64 0.21 25.39);
  --border: oklch(0.35 0.04 261.40);
  --input: oklch(0.35 0.04 261.40);
  --ring: oklch(0.56 0.24 260.92);
  --chart-1: oklch(0.56 0.24 260.92);
  --chart-2: oklch(0.48 0.20 260.47);
  --chart-3: oklch(0.69 0.17 255.59);
  --chart-4: oklch(0.43 0.16 259.82);
  --chart-5: oklch(0.29 0.07 261.20);
  --sidebar: oklch(0.26 0.03 262.67);
  --sidebar-foreground: oklch(0.93 0.01 261.82);
  --sidebar-primary: oklch(0.56 0.24 260.92);
  --sidebar-primary-foreground: oklch(1.00 0 0);
  --sidebar-accent: oklch(0.33 0.04 264.63);
  --sidebar-accent-foreground: oklch(0.93 0.01 261.82);
  --sidebar-border: oklch(0.35 0.04 261.40);
  --sidebar-ring: oklch(0.56 0.24 260.92);
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
}


[data-domain="spotify"] {
  --background: oklch(0.99 0 0);
  --foreground: oklch(0.35 0.02 165.48);
  --card: oklch(1.00 0 0);
  --card-foreground: oklch(0.35 0.02 165.48);
  --popover: oklch(1.00 0 0);
  --popover-foreground: oklch(0.35 0.02 165.48);
  --primary: oklch(0.67 0.17 153.85);
  --primary-foreground: oklch(0.99 0.02 175.22);
  --secondary: oklch(0.90 0.02 238.66);
  --secondary-foreground: oklch(0.20 0.02 266.02);
  --muted: oklch(0.90 0.02 240.73);
  --muted-foreground: oklch(0.50 0.03 268.53);
  --accent: oklch(0.90 0.02 240.73);
  --accent-foreground: oklch(0.35 0.02 165.48);
  --destructive: oklch(0.61 0.24 20.96);
  --border: oklch(0.94 0.01 238.46);
  --input: oklch(0.85 0.02 240.75);
  --ring: oklch(0.67 0.17 153.85);
  --chart-1: oklch(0.67 0.17 153.85);
  --chart-2: oklch(0.50 0.10 270.06);
  --chart-3: oklch(0.72 0.12 201.79);
  --chart-4: oklch(0.80 0.10 100.65);
  --chart-5: oklch(0.60 0.15 300.14);
  --sidebar: oklch(0.98 0.01 238.45);
  --sidebar-foreground: oklch(0.35 0.02 165.48);
  --sidebar-primary: oklch(0.67 0.17 153.85);
  --sidebar-primary-foreground: oklch(0.98 0.01 238.45);
  --sidebar-accent: oklch(0.90 0.02 240.73);
  --sidebar-accent-foreground: oklch(0.35 0.02 165.48);
  --sidebar-border: oklch(0.85 0.02 240.75);
  --sidebar-ring: oklch(0.67 0.17 153.85);

  --font-sans: Lato, sans-serif;
  --font-serif: Merriweather, Geist, Geist Fallback, ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  --font-mono: Roboto Mono, Geist Mono, Geist Mono Fallback, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

  --radius: 0.25rem;
  
  --shadow-2xs: 0px 1px 3px 0px oklch(0.35 0.05 163.02 / 0.02);
  --shadow-xs: 0px 1px 3px 0px oklch(0.35 0.05 163.02 / 0.02);
  --shadow-sm: 0px 1px 3px 0px oklch(0.35 0.05 163.02 / 0.04), 0px 1px 2px -1px oklch(0.35 0.05 163.02 / 0.04);
  --shadow: 0px 1px 3px 0px oklch(0.35 0.05 163.02 / 0.04), 0px 1px 2px -1px oklch(0.35 0.05 163.02 / 0.04);
  --shadow-md: 0px 1px 3px 0px oklch(0.35 0.05 163.02 / 0.04), 0px 2px 4px -1px oklch(0.35 0.05 163.02 / 0.04);
  --shadow-lg: 0px 1px 3px 0px oklch(0.35 0.05 163.02 / 0.04), 0px 4px 6px -1px oklch(0.35 0.05 163.02 / 0.04);
  --shadow-xl: 0px 1px 3px 0px oklch(0.35 0.05 163.02 / 0.04), 0px 8px 10px -1px oklch(0.35 0.05 163.02 / 0.04);
  --shadow-2xl: 0px 1px 3px 0px oklch(0.35 0.05 163.02 / 0.10);
  
}

.dark[data-domain="spotify"] {
  --background: oklch(0.15 0.02 269.18);
  --foreground: oklch(0.95 0.01 238.46);
  --card: oklch(0.20 0.02 266.02);
  --card-foreground: oklch(0.95 0.01 238.46);
  --popover: oklch(0.20 0.02 266.02);
  --popover-foreground: oklch(0.95 0.01 238.46);
  --primary: oklch(0.67 0.17 153.85);
  --primary-foreground: oklch(0.15 0.02 269.18);
  --secondary: oklch(0.30 0.03 271.05);
  --secondary-foreground: oklch(0.95 0.01 238.46);
  --muted: oklch(0.30 0.03 271.05);
  --muted-foreground: oklch(0.60 0.03 269.46);
  --accent: oklch(0.30 0.03 271.05);
  --accent-foreground: oklch(0.95 0.01 238.46);
  --destructive: oklch(0.64 0.25 19.69);
  --border: oklch(0.95 0.01 238.46 / 15%);
  --input: oklch(0.95 0.01 238.46 / 20%);
  --ring: oklch(0.67 0.17 153.85);
  --chart-1: oklch(0.67 0.17 153.85);
  --chart-2: oklch(0.60 0.10 269.83);
  --chart-3: oklch(0.72 0.12 201.79);
  --chart-4: oklch(0.80 0.10 100.65);
  --chart-5: oklch(0.60 0.15 300.14);
  --sidebar: oklch(0.20 0.02 266.02);
  --sidebar-foreground: oklch(0.95 0.01 238.46);
  --sidebar-primary: oklch(0.67 0.17 153.85);
  --sidebar-primary-foreground: oklch(0.15 0.02 269.18);
  --sidebar-accent: oklch(0.30 0.03 271.05);
  --sidebar-accent-foreground: oklch(0.95 0.01 238.46);
  --sidebar-border: oklch(0.95 0.01 238.46 / 15%);
  --sidebar-ring: oklch(0.67 0.17 153.85);
  
  --shadow-2xs: 0px 1px 2px 0px oklch(0 0 0 / 0.01);
  --shadow-xs: 0px 1px 2px 0px oklch(0 0 0 / 0.01);
  --shadow-sm: 0px 1px 2px 0px oklch(0 0 0 / 0.01), 0px 1px 2px -1px oklch(0 0 0 / 0.01);
  --shadow: 0px 1px 2px 0px oklch(0 0 0 / 0.01), 0px 1px 2px -1px oklch(0 0 0 / 0.01);
  --shadow-md: 0px 1px 2px 0px oklch(0 0 0 / 0.01), 0px 2px 4px -1px oklch(0 0 0 / 0.01);
  --shadow-lg: 0px 1px 2px 0px oklch(0 0 0 / 0.01), 0px 4px 6px -1px oklch(0 0 0 / 0.01);
  --shadow-xl: 0px 1px 2px 0px oklch(0 0 0 / 0.01), 0px 8px 10px -1px oklch(0 0 0 / 0.01);
  --shadow-2xl: 0px 1px 2px 0px oklch(0 0 0 / 0.03);
}

[data-domain="summer"] {
  --background: oklch(0.98 0.01 81.76);
  --foreground: oklch(0.38 0.02 64.16);
  --card: oklch(0.98 0.01 67.70);
  --card-foreground: oklch(0.38 0.02 64.16);
  --popover: oklch(0.96 0.04 83.12);
  --popover-foreground: oklch(0.38 0.02 64.16);
  --primary: oklch(0.70 0.17 28.12);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.81 0.15 71.81);
  --secondary-foreground: oklch(0.38 0.02 64.16);
  --muted: oklch(0.94 0.03 62.32);
  --muted-foreground: oklch(0.56 0.05 58.74);
  --accent: oklch(0.93 0.04 83.20);
  --accent-foreground: oklch(0.47 0.05 58.08);
  --destructive: oklch(0.57 0.20 26.34);
  --border: oklch(0.90 0.06 66.11);
  --input: oklch(0.90 0.06 66.11);
  --ring: oklch(0.70 0.17 28.12);
  --chart-1: oklch(0.70 0.17 28.12);
  --chart-2: oklch(0.81 0.15 71.81);
  --chart-3: oklch(0.71 0.18 37.63);
  --chart-4: oklch(0.89 0.15 91.66);
  --chart-5: oklch(0.59 0.19 36.05);
  --sidebar: oklch(0.97 0.02 72.57);
  --sidebar-foreground: oklch(0.38 0.02 64.16);
  --sidebar-primary: oklch(0.70 0.17 28.12);
  --sidebar-primary-foreground: oklch(1.00 0 0);
  --sidebar-accent: oklch(0.81 0.15 71.81);
  --sidebar-accent-foreground: oklch(0.38 0.02 64.16);
  --sidebar-border: oklch(0.87 0.08 65.83);
  --sidebar-ring: oklch(0.70 0.17 28.12);

  --font-sans: Nunito, Segoe UI, Tahoma, Geneva, Verdana, sans-serif;
  --font-serif: Lora, ui-serif, Georgia, Cambria, Times New Roman, Times, serif;
  --font-mono: Fira Code, ui-monospace, SFMono-Regular;

  --radius: 0.6rem;
  
  --shadow-2xs: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.03);
  --shadow-xs: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.03);
  --shadow-sm: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.05), 0px 1px 2px -1px oklch(0.70 0.17 28.12 / 0.05);
  --shadow: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.05), 0px 1px 2px -1px oklch(0.70 0.17 28.12 / 0.05);
  --shadow-md: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.05), 0px 2px 4px -1px oklch(0.70 0.17 28.12 / 0.05);
  --shadow-lg: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.05), 0px 4px 6px -1px oklch(0.70 0.17 28.12 / 0.05);
  --shadow-xl: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.05), 0px 8px 10px -1px oklch(0.70 0.17 28.12 / 0.05);
  --shadow-2xl: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.13);
  
}

.dark[data-domain="summer"] {
  --background: oklch(0.26 0.02 63.41);
  --foreground: oklch(0.87 0.08 65.83);
  --card: oklch(0.31 0.03 60.03);
  --card-foreground: oklch(0.87 0.08 65.83);
  --popover: oklch(0.36 0.03 54.43);
  --popover-foreground: oklch(0.87 0.08 65.83);
  --primary: oklch(0.70 0.17 28.12);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.81 0.15 71.81);
  --secondary-foreground: oklch(0.26 0.02 63.41);
  --muted: oklch(0.38 0.03 60.76);
  --muted-foreground: oklch(0.79 0.06 71.87);
  --accent: oklch(0.45 0.03 54.70);
  --accent-foreground: oklch(0.97 0.03 82.90);
  --destructive: oklch(0.50 0.19 27.43);
  --border: oklch(0.42 0.03 58.74);
  --input: oklch(0.40 0.04 60.31);
  --ring: oklch(0.70 0.17 28.12);
  --chart-1: oklch(0.70 0.17 28.12);
  --chart-2: oklch(0.81 0.15 71.81);
  --chart-3: oklch(0.71 0.18 37.63);
  --chart-4: oklch(0.89 0.15 91.66);
  --chart-5: oklch(0.59 0.19 36.05);
  --sidebar: oklch(0.31 0.03 60.03);
  --sidebar-foreground: oklch(0.87 0.08 65.83);
  --sidebar-primary: oklch(0.70 0.17 28.12);
  --sidebar-primary-foreground: oklch(1.00 0 0);
  --sidebar-accent: oklch(0.81 0.15 71.81);
  --sidebar-accent-foreground: oklch(0.26 0.02 63.41);
  --sidebar-border: oklch(0.45 0.05 60.24);
  --sidebar-ring: oklch(0.70 0.17 28.12);
  
  --shadow-2xs: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.03);
  --shadow-xs: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.03);
  --shadow-sm: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.05), 0px 1px 2px -1px oklch(0.70 0.17 28.12 / 0.05);
  --shadow: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.05), 0px 1px 2px -1px oklch(0.70 0.17 28.12 / 0.05);
  --shadow-md: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.05), 0px 2px 4px -1px oklch(0.70 0.17 28.12 / 0.05);
  --shadow-lg: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.05), 0px 4px 6px -1px oklch(0.70 0.17 28.12 / 0.05);
  --shadow-xl: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.05), 0px 8px 10px -1px oklch(0.70 0.17 28.12 / 0.05);
  --shadow-2xl: 0px 1px 3px 0px oklch(0.70 0.17 28.12 / 0.13);
}

[data-domain="marshmallow"] {
  --background: oklch(0.97 0.01 267.41);
  --foreground: oklch(0.22 0 0);
  --card: oklch(1.00 0 0);
  --card-foreground: oklch(0.22 0 0);
  --popover: oklch(1.00 0 0);
  --popover-foreground: oklch(0.22 0 0);
  --primary: oklch(0.80 0.14 348.82);
  --primary-foreground: oklch(0 0 0);
  --secondary: oklch(0.94 0.07 97.70);
  --secondary-foreground: oklch(0 0 0);
  --muted: oklch(0.92 0.01 273.42);
  --muted-foreground: oklch(0.34 0 0);
  --accent: oklch(0.83 0.09 247.96);
  --accent-foreground: oklch(0 0 0);
  --destructive: oklch(0.70 0.19 23.04);
  --border: oklch(0.85 0 0);
  --input: oklch(0.85 0 0);
  --ring: oklch(0.83 0.09 247.96);
  --chart-1: oklch(0.80 0.14 348.82);
  --chart-2: oklch(0.77 0.15 306.21);
  --chart-3: oklch(0.83 0.09 247.96);
  --chart-4: oklch(0.88 0.09 66.79);
  --chart-5: oklch(0.94 0.14 130.35);
  --sidebar: oklch(1.00 0 0);
  --sidebar-foreground: oklch(0.22 0 0);
  --sidebar-primary: oklch(0.80 0.14 348.82);
  --sidebar-primary-foreground: oklch(0 0 0);
  --sidebar-accent: oklch(0.83 0.09 247.96);
  --sidebar-accent-foreground: oklch(0 0 0);
  --sidebar-border: oklch(0.85 0 0);
  --sidebar-ring: oklch(0.83 0.09 247.96);

  --font-sans: Gabriela, Geist Fallback, ui-sans-serif;
  --font-serif: Gabriela, Geist Fallback, ui-serif;
  --font-mono: Geist Mono, Geist Mono Fallback, ui-monospace;

  --radius: 0rem;
  
  --shadow-2xs: 0px 2px 5px 0px oklch(0.83 0.09 247.96 / 0.05);
  --shadow-xs: 0px 2px 5px 0px oklch(0.83 0.09 247.96 / 0.05);
  --shadow-sm: 0px 2px 5px 0px oklch(0.83 0.09 247.96 / 0.10), 0px 1px 2px -1px oklch(0.83 0.09 247.96 / 0.10);
  --shadow: 0px 2px 5px 0px oklch(0.83 0.09 247.96 / 0.10), 0px 1px 2px -1px oklch(0.83 0.09 247.96 / 0.10);
  --shadow-md: 0px 2px 5px 0px oklch(0.83 0.09 247.96 / 0.10), 0px 2px 4px -1px oklch(0.83 0.09 247.96 / 0.10);
  --shadow-lg: 0px 2px 5px 0px oklch(0.83 0.09 247.96 / 0.10), 0px 4px 6px -1px oklch(0.83 0.09 247.96 / 0.10);
  --shadow-xl: 0px 2px 5px 0px oklch(0.83 0.09 247.96 / 0.10), 0px 8px 10px -1px oklch(0.83 0.09 247.96 / 0.10);
  --shadow-2xl: 0px 2px 5px 0px oklch(0.83 0.09 247.96 / 0.25);
  
}

.dark[data-domain="marshmallow"]  {
  --background: oklch(0.22 0 0);
  --foreground: oklch(0.97 0.01 267.41);
  --card: oklch(0.29 0 0);
  --card-foreground: oklch(0.97 0.01 267.41);
  --popover: oklch(0.29 0 0);
  --popover-foreground: oklch(0.97 0.01 267.41);
  --primary: oklch(0.80 0.14 348.82);
  --primary-foreground: oklch(0.22 0 0);
  --secondary: oklch(0.77 0.15 306.21);
  --secondary-foreground: oklch(0.22 0 0);
  --muted: oklch(0.32 0 0);
  --muted-foreground: oklch(0.85 0 0);
  --accent: oklch(0.83 0.09 247.96);
  --accent-foreground: oklch(0.22 0 0);
  --destructive: oklch(0.70 0.19 23.04);
  --border: oklch(0.39 0 0);
  --input: oklch(0.39 0 0);
  --ring: oklch(0.83 0.09 247.96);
  --chart-1: oklch(0.80 0.14 348.82);
  --chart-2: oklch(0.77 0.15 306.21);
  --chart-3: oklch(0.83 0.09 247.96);
  --chart-4: oklch(0.88 0.09 66.79);
  --chart-5: oklch(0.94 0.14 130.35);
  --sidebar: oklch(0.29 0 0);
  --sidebar-foreground: oklch(0.97 0.01 267.41);
  --sidebar-primary: oklch(0.80 0.14 348.82);
  --sidebar-primary-foreground: oklch(0.22 0 0);
  --sidebar-accent: oklch(0.83 0.09 247.96);
  --sidebar-accent-foreground: oklch(0.22 0 0);
  --sidebar-border: oklch(0.39 0 0);
  --sidebar-ring: oklch(0.83 0.09 247.96);
  
  --shadow-2xs: 0px 1px 2px 0px oklch(0.83 0.09 247.96 / 0.05);
  --shadow-xs: 0px 1px 2px 0px oklch(0.83 0.09 247.96 / 0.05);
  --shadow-sm: 0px 1px 2px 0px oklch(0.83 0.09 247.96 / 0.10), 0px 1px 2px -1px oklch(0.83 0.09 247.96 / 0.10);
  --shadow: 0px 1px 2px 0px oklch(0.83 0.09 247.96 / 0.10), 0px 1px 2px -1px oklch(0.83 0.09 247.96 / 0.10);
  --shadow-md: 0px 1px 2px 0px oklch(0.83 0.09 247.96 / 0.10), 0px 2px 4px -1px oklch(0.83 0.09 247.96 / 0.10);
  --shadow-lg: 0px 1px 2px 0px oklch(0.83 0.09 247.96 / 0.10), 0px 4px 6px -1px oklch(0.83 0.09 247.96 / 0.10);
  --shadow-xl: 0px 1px 2px 0px oklch(0.83 0.09 247.96 / 0.10), 0px 8px 10px -1px oklch(0.83 0.09 247.96 / 0.10);
  --shadow-2xl: 0px 1px 2px 0px oklch(0.83 0.09 247.96 / 0.25);
}

[data-domain="vs_code"] {
  --background: oklch(0.97 0.02 225.66);
  --foreground: oklch(0.15 0.02 269.18);
  --card: oklch(0.98 0.01 228.79);
  --card-foreground: oklch(0.15 0.02 269.18);
  --popover: oklch(0.98 0.01 238.45);
  --popover-foreground: oklch(0.15 0.02 269.18);
  --primary: oklch(0.71 0.15 239.15);
  --primary-foreground: oklch(0.94 0.03 232.39);
  --secondary: oklch(0.91 0.03 229.20);
  --secondary-foreground: oklch(0.15 0.02 269.18);
  --muted: oklch(0.89 0.02 225.69);
  --muted-foreground: oklch(0.36 0.03 231.55);
  --accent: oklch(0.88 0.02 235.72);
  --accent-foreground: oklch(0.34 0.05 229.20);
  --destructive: oklch(0.61 0.24 20.96);
  --border: oklch(0.82 0.02 240.77);
  --input: oklch(0.82 0.02 240.77);
  --ring: oklch(0.55 0.10 235.72);
  --chart-1: oklch(0.57 0.11 228.92);
  --chart-2: oklch(0.45 0.10 270.08);
  --chart-3: oklch(0.65 0.15 159.03);
  --chart-4: oklch(0.75 0.10 100.01);
  --chart-5: oklch(0.55 0.15 299.88);
  --sidebar: oklch(0.93 0.01 238.46);
  --sidebar-foreground: oklch(0.15 0.02 269.18);
  --sidebar-primary: oklch(0.57 0.11 228.92);
  --sidebar-primary-foreground: oklch(0.99 0.01 203.97);
  --sidebar-accent: oklch(0.88 0.02 235.72);
  --sidebar-accent-foreground: oklch(0.15 0.02 269.18);
  --sidebar-border: oklch(0.82 0.02 240.77);
  --sidebar-ring: oklch(0.57 0.11 228.92);

  --font-sans: 'Source Code Pro', 'Geist', 'Geist Fallback', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
  --font-serif: 'Source Serif 4', 'Geist', 'Geist Fallback', ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif;
  --font-mono: 'Source Code Pro', 'Geist Mono', 'Geist Mono Fallback', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;

  --radius: 0rem;
  
  --shadow-2xs: 0px 1px 2.5px 0px oklch(0.49 0.09 235.00 / 0.03);
  --shadow-xs: 0px 1px 2.5px 0px oklch(0.49 0.09 235.00 / 0.03);
  --shadow-sm: 0px 1px 2.5px 0px oklch(0.49 0.09 235.00 / 0.06), 0px 1px 2px -1px oklch(0.49 0.09 235.00 / 0.06);
  --shadow: 0px 1px 2.5px 0px oklch(0.49 0.09 235.00 / 0.06), 0px 1px 2px -1px oklch(0.49 0.09 235.00 / 0.06);
  --shadow-md: 0px 1px 2.5px 0px oklch(0.49 0.09 235.00 / 0.06), 0px 2px 4px -1px oklch(0.49 0.09 235.00 / 0.06);
  --shadow-lg: 0px 1px 2.5px 0px oklch(0.49 0.09 235.00 / 0.06), 0px 4px 6px -1px oklch(0.49 0.09 235.00 / 0.06);
  --shadow-xl: 0px 1px 2.5px 0px oklch(0.49 0.09 235.00 / 0.06), 0px 8px 10px -1px oklch(0.49 0.09 235.00 / 0.06);
  --shadow-2xl: 0px 1px 2.5px 0px oklch(0.49 0.09 235.00 / 0.15);
  
}

.dark[data-domain="vs_code"] {
  --background: oklch(0.18 0.02 271.27);
  --foreground: oklch(0.90 0.01 238.47);
  --card: oklch(0.22 0.02 271.67);
  --card-foreground: oklch(0.90 0.01 238.47);
  --popover: oklch(0.22 0.02 271.67);
  --popover-foreground: oklch(0.90 0.01 238.47);
  --primary: oklch(0.71 0.15 239.15);
  --primary-foreground: oklch(0.94 0.03 232.39);
  --secondary: oklch(0.28 0.03 270.91);
  --secondary-foreground: oklch(0.90 0.01 238.47);
  --muted: oklch(0.28 0.03 270.91);
  --muted-foreground: oklch(0.60 0.03 269.46);
  --accent: oklch(0.28 0.03 270.91);
  --accent-foreground: oklch(0.90 0.01 238.47);
  --destructive: oklch(0.64 0.25 19.69);
  --border: oklch(0.90 0.01 238.47 / 15%);
  --input: oklch(0.90 0.01 238.47 / 20%);
  --ring: oklch(0.66 0.13 227.70);
  --chart-1: oklch(0.66 0.13 227.70);
  --chart-2: oklch(0.60 0.10 269.83);
  --chart-3: oklch(0.70 0.15 159.83);
  --chart-4: oklch(0.80 0.10 100.65);
  --chart-5: oklch(0.60 0.15 300.14);
  --sidebar: oklch(0.22 0.02 271.67);
  --sidebar-foreground: oklch(0.90 0.01 238.47);
  --sidebar-primary: oklch(0.66 0.13 227.70);
  --sidebar-primary-foreground: oklch(0.18 0.02 271.27);
  --sidebar-accent: oklch(0.28 0.03 270.91);
  --sidebar-accent-foreground: oklch(0.90 0.01 238.47);
  --sidebar-border: oklch(0.90 0.01 238.47 / 15%);
  --sidebar-ring: oklch(0.66 0.13 227.70);
  
  --shadow-2xs: 0px 1px 2px 0px oklch(0 0 0 / 0.01);
  --shadow-xs: 0px 1px 2px 0px oklch(0 0 0 / 0.01);
  --shadow-sm: 0px 1px 2px 0px oklch(0 0 0 / 0.01), 0px 1px 2px -1px oklch(0 0 0 / 0.01);
  --shadow: 0px 1px 2px 0px oklch(0 0 0 / 0.01), 0px 1px 2px -1px oklch(0 0 0 / 0.01);
  --shadow-md: 0px 1px 2px 0px oklch(0 0 0 / 0.01), 0px 2px 4px -1px oklch(0 0 0 / 0.01);
  --shadow-lg: 0px 1px 2px 0px oklch(0 0 0 / 0.01), 0px 4px 6px -1px oklch(0 0 0 / 0.01);
  --shadow-xl: 0px 1px 2px 0px oklch(0 0 0 / 0.01), 0px 8px 10px -1px oklch(0 0 0 / 0.01);
  --shadow-2xl: 0px 1px 2px 0px oklch(0 0 0 / 0.03);
}

[data-domain="material_design"] {
  --background: oklch(0.98 0.01 335.69);
  --foreground: oklch(0.22 0 0);
  --card: oklch(0.96 0.01 335.69);
  --card-foreground: oklch(0.14 0 0);
  --popover: oklch(0.95 0.01 316.67);
  --popover-foreground: oklch(0.40 0.04 309.35);
  --primary: oklch(0.51 0.21 286.50);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.49 0.04 300.23);
  --secondary-foreground: oklch(1.00 0 0);
  --muted: oklch(0.96 0.01 335.69);
  --muted-foreground: oklch(0.14 0 0);
  --accent: oklch(0.92 0.04 303.47);
  --accent-foreground: oklch(0.14 0 0);
  --destructive: oklch(0.57 0.23 29.21);
  --border: oklch(0.83 0.02 308.26);
  --input: oklch(0.57 0.02 309.68);
  --ring: oklch(0.50 0.13 293.77);
  --chart-1: oklch(0.61 0.21 279.42);
  --chart-2: oklch(0.72 0.15 157.67);
  --chart-3: oklch(0.66 0.17 324.24);
  --chart-4: oklch(0.81 0.15 127.91);
  --chart-5: oklch(0.68 0.17 258.25);
  --sidebar: oklch(0.99 0 0);
  --sidebar-foreground: oklch(0.15 0 0);
  --sidebar-primary: oklch(0.56 0.11 228.27);
  --sidebar-primary-foreground: oklch(0.98 0 0);
  --sidebar-accent: oklch(0.95 0 0);
  --sidebar-accent-foreground: oklch(0.25 0 0);
  --sidebar-border: oklch(0.90 0 0);
  --sidebar-ring: oklch(0.56 0.11 228.27);

  --font-sans: Roboto, sans-serif;
  --font-serif: Merriweather, serif;
  --font-mono: "Geist Mono", "Geist Mono Fallback", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

  --radius: 1rem;
  
  --shadow-2xs: 0px 1px 3px 0px oklch(0 0 0 / 0.01);
  --shadow-xs: 0px 1px 3px 0px oklch(0 0 0 / 0.01);
  --shadow-sm: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 1px 2px -1px oklch(0 0 0 / 0.01);
  --shadow: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 1px 2px -1px oklch(0 0 0 / 0.01);
  --shadow-md: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 2px 4px -1px oklch(0 0 0 / 0.01);
  --shadow-lg: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 4px 6px -1px oklch(0 0 0 / 0.01);
  --shadow-xl: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 8px 10px -1px oklch(0 0 0 / 0.01);
  --shadow-2xl: 0px 1px 3px 0px oklch(0 0 0 / 0.03);
  
}

.dark[data-domain="material_design"] {
  --background: oklch(0.15 0.01 317.69);
  --foreground: oklch(0.95 0.01 321.50);
  --card: oklch(0.22 0.02 322.13);
  --card-foreground: oklch(0.95 0.01 321.50);
  --popover: oklch(0.22 0.02 322.13);
  --popover-foreground: oklch(0.95 0.01 321.50);
  --primary: oklch(0.60 0.22 279.81);
  --primary-foreground: oklch(0.98 0.01 321.51);
  --secondary: oklch(0.45 0.03 294.79);
  --secondary-foreground: oklch(0.95 0.01 321.50);
  --muted: oklch(0.22 0.01 319.50);
  --muted-foreground: oklch(0.70 0.01 320.70);
  --accent: oklch(0.35 0.06 299.57);
  --accent-foreground: oklch(0.95 0.01 321.50);
  --destructive: oklch(0.57 0.23 29.21);
  --border: oklch(0.40 0.04 309.35);
  --input: oklch(0.40 0.04 309.35);
  --ring: oklch(0.50 0.15 294.97);
  --chart-1: oklch(0.50 0.25 274.99);
  --chart-2: oklch(0.60 0.15 150.16);
  --chart-3: oklch(0.65 0.20 309.96);
  --chart-4: oklch(0.60 0.17 132.98);
  --chart-5: oklch(0.60 0.20 255.25);
  --sidebar: oklch(0.20 0.01 317.74);
  --sidebar-foreground: oklch(0.95 0.01 321.50);
  --sidebar-primary: oklch(0.59 0.11 225.82);
  --sidebar-primary-foreground: oklch(0.95 0.01 321.50);
  --sidebar-accent: oklch(0.30 0.01 319.52);
  --sidebar-accent-foreground: oklch(0.95 0.01 321.50);
  --sidebar-border: oklch(0.35 0.01 319.53 / 30%);
  --sidebar-ring: oklch(0.59 0.11 225.82);
  
  --shadow-2xs: 0px 1px 3px 0px oklch(0 0 0 / 0.01);
  --shadow-xs: 0px 1px 3px 0px oklch(0 0 0 / 0.01);
  --shadow-sm: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 1px 2px -1px oklch(0 0 0 / 0.01);
  --shadow: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 1px 2px -1px oklch(0 0 0 / 0.01);
  --shadow-md: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 2px 4px -1px oklch(0 0 0 / 0.01);
  --shadow-lg: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 4px 6px -1px oklch(0 0 0 / 0.01);
  --shadow-xl: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 8px 10px -1px oklch(0 0 0 / 0.01);
  --shadow-2xl: 0px 1px 3px 0px oklch(0 0 0 / 0.03);
}

[data-domain="marvel"] {
  --background: oklch(0.98 0.01 25.23);
  --foreground: oklch(0.23 0.08 24.25);
  --card: oklch(0.95 0.02 25.25);
  --card-foreground: oklch(0.18 0.01 29.18);
  --popover: oklch(0.94 0.01 25.23);
  --popover-foreground: oklch(0.22 0.01 29.09);
  --primary: oklch(0.55 0.22 27.03);
  --primary-foreground: oklch(0.98 0.01 100.72);
  --secondary: oklch(0.52 0.14 247.51);
  --secondary-foreground: oklch(0.98 0.01 100.72);
  --muted: oklch(0.94 0.02 25.25);
  --muted-foreground: oklch(0.45 0.02 17.96);
  --accent: oklch(0.86 0.04 33.45);
  --accent-foreground: oklch(0.18 0.01 29.18);
  --destructive: oklch(0.56 0.23 29.23);
  --border: oklch(0.90 0.03 25.35);
  --input: oklch(0.80 0.01 25.22);
  --ring: oklch(0.50 0.12 244.86);
  --chart-1: oklch(0.58 0.23 27.06);
  --chart-2: oklch(0.61 0.18 251.95);
  --chart-3: oklch(0.72 0.15 83.50);
  --chart-4: oklch(0.67 0.15 144.89);
  --chart-5: oklch(0.75 0.15 304.74);
  --sidebar: oklch(0.97 0 0);
  --sidebar-foreground: oklch(0.20 0.01 18.05);
  --sidebar-primary: oklch(0.52 0.14 247.51);
  --sidebar-primary-foreground: oklch(0.98 0.01 100.72);
  --sidebar-accent: oklch(0.69 0.14 79.70);
  --sidebar-accent-foreground: oklch(0.20 0.01 18.05);
  --sidebar-border: oklch(0.87 0.01 25.23);
  --sidebar-ring: oklch(0.52 0.14 247.51);

  --font-sans: Outfit, sans-serif;
  --font-serif: Merriweather, serif;
  --font-mono: Geist Mono, monospace;

  --radius: 0rem;
  
  --shadow-2xs: 0px 1px 3px 0px oklch(0 0 0 / 0.01);
  --shadow-xs: 0px 1px 3px 0px oklch(0 0 0 / 0.01);
  --shadow-sm: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 1px 2px -1px oklch(0 0 0 / 0.01);
  --shadow: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 1px 2px -1px oklch(0 0 0 / 0.01);
  --shadow-md: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 2px 4px -1px oklch(0 0 0 / 0.01);
  --shadow-lg: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 4px 6px -1px oklch(0 0 0 / 0.01);
  --shadow-xl: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 8px 10px -1px oklch(0 0 0 / 0.01);
  --shadow-2xl: 0px 1px 3px 0px oklch(0 0 0 / 0.03);
  
}

.dark[data-domain="marvel"] {
  --background: oklch(0.17 0.01 31.25);
  --foreground: oklch(0.95 0.01 25.23);
  --card: oklch(0.22 0.01 34.34);
  --card-foreground: oklch(0.95 0.01 25.23);
  --popover: oklch(0.18 0.01 29.18);
  --popover-foreground: oklch(0.95 0.01 25.23);
  --primary: oklch(0.55 0.22 27.03);
  --primary-foreground: oklch(0.98 0.01 100.72);
  --secondary: oklch(0.50 0.14 249.16);
  --secondary-foreground: oklch(0.98 0.01 100.72);
  --muted: oklch(0.20 0.01 18.05);
  --muted-foreground: oklch(0.70 0.01 25.22);
  --accent: oklch(0.59 0.12 78.19);
  --accent-foreground: oklch(0.95 0.01 25.23);
  --destructive: oklch(0.56 0.23 29.23);
  --border: oklch(0.32 0.01 17.67);
  --input: oklch(0.38 0.01 17.71);
  --ring: oklch(0.49 0.14 250.75);
  --chart-1: oklch(0.64 0.25 26.85);
  --chart-2: oklch(0.66 0.19 250.17);
  --chart-3: oklch(0.78 0.16 87.01);
  --chart-4: oklch(0.68 0.15 144.94);
  --chart-5: oklch(0.75 0.15 304.74);
  --sidebar: oklch(0.14 0.01 33.25);
  --sidebar-foreground: oklch(0.95 0.01 25.23);
  --sidebar-primary: oklch(0.50 0.14 249.16);
  --sidebar-primary-foreground: oklch(0.98 0.01 100.72);
  --sidebar-accent: oklch(0.59 0.12 78.19);
  --sidebar-accent-foreground: oklch(0.95 0.01 25.23);
  --sidebar-border: oklch(0.32 0.01 27.45 / 30%);
  --sidebar-ring: oklch(0.50 0.14 249.16);
  
  --shadow-2xs: 0px 1px 3px 0px oklch(0 0 0 / 0.01);
  --shadow-xs: 0px 1px 3px 0px oklch(0 0 0 / 0.01);
  --shadow-sm: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 1px 2px -1px oklch(0 0 0 / 0.01);
  --shadow: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 1px 2px -1px oklch(0 0 0 / 0.01);
  --shadow-md: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 2px 4px -1px oklch(0 0 0 / 0.01);
  --shadow-lg: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 4px 6px -1px oklch(0 0 0 / 0.01);
  --shadow-xl: 0px 1px 3px 0px oklch(0 0 0 / 0.01), 0px 8px 10px -1px oklch(0 0 0 / 0.01);
  --shadow-2xl: 0px 1px 3px 0px oklch(0 0 0 / 0.03);
}


[data-domain="velorant"] {
  --background: oklch(0.97 0.02 12.89);
  --foreground: oklch(0.24 0.07 17.95);
  --card: oklch(0.98 0.01 17.50);
  --card-foreground: oklch(0.26 0.07 19.47);
  --popover: oklch(0.98 0.01 17.50);
  --popover-foreground: oklch(0.26 0.07 19.47);
  --primary: oklch(0.67 0.22 21.22);
  --primary-foreground: oklch(0.99 0 0);
  --secondary: oklch(0.95 0.02 10.30);
  --secondary-foreground: oklch(0.24 0.07 17.95);
  --muted: oklch(0.98 0.01 17.50);
  --muted-foreground: oklch(0.26 0.07 19.47);
  --accent: oklch(0.99 0 0);
  --accent-foreground: oklch(0.43 0.13 20.48);
  --destructive: oklch(0.80 0.17 73.59);
  --border: oklch(0.91 0.05 10.24);
  --input: oklch(0.90 0.05 11.99);
  --ring: oklch(0.92 0.04 12.26);
  --chart-1: oklch(0.86 0.18 88.48);
  --chart-2: oklch(0.62 0.21 255.62);
  --chart-3: oklch(0.54 0.29 297.65);
  --chart-4: oklch(0.95 0.10 98.75);
  --chart-5: oklch(0.87 0.12 100.10);
  --sidebar: oklch(0.97 0.02 12.89);
  --sidebar-foreground: oklch(0.26 0.07 19.47);
  --sidebar-primary: oklch(0.67 0.22 21.22);
  --sidebar-primary-foreground: oklch(0.98 0.01 17.50);
  --sidebar-accent: oklch(0.98 0.01 17.50);
  --sidebar-accent-foreground: oklch(0.43 0.13 20.48);
  --sidebar-border: oklch(0.91 0.05 10.24);
  --sidebar-ring: oklch(0.92 0.04 12.26);

  --font-sans: Barlow;
  --font-serif: Merriweather;
  --font-mono: JetBrains Mono;

  --radius: 0rem;
  
  --shadow-2xs: 0px 0px 3px 0px oklch(0.30 0.09 19.60 / 0.04);
  --shadow-xs: 0px 0px 3px 0px oklch(0.30 0.09 19.60 / 0.04);
  --shadow-sm: 0px 0px 3px 0px oklch(0.30 0.09 19.60 / 0.08), 0px 1px 2px -1px oklch(0.30 0.09 19.60 / 0.08);
  --shadow: 0px 0px 3px 0px oklch(0.30 0.09 19.60 / 0.08), 0px 1px 2px -1px oklch(0.30 0.09 19.60 / 0.08);
  --shadow-md: 0px 0px 3px 0px oklch(0.30 0.09 19.60 / 0.08), 0px 2px 4px -1px oklch(0.30 0.09 19.60 / 0.08);
  --shadow-lg: 0px 0px 3px 0px oklch(0.30 0.09 19.60 / 0.08), 0px 4px 6px -1px oklch(0.30 0.09 19.60 / 0.08);
  --shadow-xl: 0px 0px 3px 0px oklch(0.30 0.09 19.60 / 0.08), 0px 8px 10px -1px oklch(0.30 0.09 19.60 / 0.08);
  --shadow-2xl: 0px 0px 3px 0px oklch(0.30 0.09 19.60 / 0.20);
  
}

.dark[data-domain="velorant"] {
  --background: oklch(0.16 0.03 16.52);
  --foreground: oklch(0.99 0 0);
  --card: oklch(0.21 0.05 18.42);
  --card-foreground: oklch(0.98 0 0);
  --popover: oklch(0.26 0.07 19.47);
  --popover-foreground: oklch(0.99 0 0);
  --primary: oklch(0.67 0.22 21.22);
  --primary-foreground: oklch(0.99 0 0);
  --secondary: oklch(0.30 0.09 19.60);
  --secondary-foreground: oklch(0.95 0.02 10.30);
  --muted: oklch(0.26 0.07 19.47);
  --muted-foreground: oklch(0.99 0 0);
  --accent: oklch(0.43 0.13 20.48);
  --accent-foreground: oklch(0.99 0 0);
  --destructive: oklch(0.80 0.17 73.59);
  --border: oklch(0.31 0.09 19.47);
  --input: oklch(0.39 0.12 20.38);
  --ring: oklch(0.50 0.16 20.99);
  --chart-1: oklch(0.86 0.18 88.48);
  --chart-2: oklch(0.62 0.21 255.62);
  --chart-3: oklch(0.54 0.29 297.65);
  --chart-4: oklch(0.95 0.10 98.75);
  --chart-5: oklch(0.87 0.12 100.10);
  --sidebar: oklch(0.26 0.07 19.47);
  --sidebar-foreground: oklch(0.99 0 0);
  --sidebar-primary: oklch(0.67 0.22 21.22);
  --sidebar-primary-foreground: oklch(0.99 0 0);
  --sidebar-accent: oklch(0.43 0.13 20.48);
  --sidebar-accent-foreground: oklch(0.99 0 0);
  --sidebar-border: oklch(0.39 0.12 20.38);
  --sidebar-ring: oklch(0.50 0.16 20.99);
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
}


[data-domain="ghibli_studio"] {
  --background: oklch(0.91 0.05 82.78);
  --foreground: oklch(0.41 0.08 78.86);
  --card: oklch(0.92 0.04 84.56);
  --card-foreground: oklch(0.41 0.08 74.04);
  --popover: oklch(0.92 0.04 84.56);
  --popover-foreground: oklch(0.41 0.08 74.04);
  --primary: oklch(0.71 0.10 111.96);
  --primary-foreground: oklch(0.98 0.01 2.18);
  --secondary: oklch(0.88 0.05 83.32);
  --secondary-foreground: oklch(0.51 0.08 78.21);
  --muted: oklch(0.86 0.06 82.94);
  --muted-foreground: oklch(0.51 0.08 74.78);
  --accent: oklch(0.86 0.05 85.12);
  --accent-foreground: oklch(0.26 0.02 356.72);
  --destructive: oklch(0.63 0.24 29.21);
  --border: oklch(0.74 0.06 79.64);
  --input: oklch(0.74 0.06 79.64);
  --ring: oklch(0.51 0.08 74.78);
  --chart-1: oklch(0.66 0.19 41.68);
  --chart-2: oklch(0.70 0.12 183.58);
  --chart-3: oklch(0.48 0.08 211.35);
  --chart-4: oklch(0.84 0.17 84.99);
  --chart-5: oklch(0.74 0.17 60.02);
  --sidebar: oklch(0.87 0.06 84.46);
  --sidebar-foreground: oklch(0.41 0.08 78.86);
  --sidebar-primary: oklch(0.26 0.02 356.72);
  --sidebar-primary-foreground: oklch(0.98 0.01 2.18);
  --sidebar-accent: oklch(0.83 0.06 84.44);
  --sidebar-accent-foreground: oklch(0.26 0.02 356.72);
  --sidebar-border: oklch(0.91 0 0);
  --sidebar-ring: oklch(0.71 0 0);

  --font-sans: Nunito, sans-serif;
  --font-serif: PT Serif, serif;
  --font-mono: JetBrains Mono, monospace;

  --radius: 0.625rem;
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
  
}

.dark[data-domain="ghibli_studio"] {
  --background: oklch(0.20 0.01 52.89);
  --foreground: oklch(0.88 0.05 79.11);
  --card: oklch(0.25 0.01 48.28);
  --card-foreground: oklch(0.88 0.05 79.11);
  --popover: oklch(0.25 0.01 48.28);
  --popover-foreground: oklch(0.88 0.05 79.11);
  --primary: oklch(0.64 0.05 114.58);
  --primary-foreground: oklch(0.98 0.01 2.18);
  --secondary: oklch(0.33 0.02 60.70);
  --secondary-foreground: oklch(0.88 0.05 83.32);
  --muted: oklch(0.27 0.01 39.35);
  --muted-foreground: oklch(0.74 0.06 79.64);
  --accent: oklch(0.33 0.02 60.70);
  --accent-foreground: oklch(0.86 0.05 85.12);
  --destructive: oklch(0.63 0.24 29.21);
  --border: oklch(0.33 0.02 60.70);
  --input: oklch(0.33 0.02 60.70);
  --ring: oklch(0.64 0.05 114.58);
  --chart-1: oklch(0.66 0.19 41.68);
  --chart-2: oklch(0.70 0.12 183.58);
  --chart-3: oklch(0.48 0.08 211.35);
  --chart-4: oklch(0.84 0.17 84.99);
  --chart-5: oklch(0.74 0.17 60.02);
  --sidebar: oklch(0.23 0.01 60.90);
  --sidebar-foreground: oklch(0.88 0.05 79.11);
  --sidebar-primary: oklch(0.64 0.05 114.58);
  --sidebar-primary-foreground: oklch(0.98 0.01 2.18);
  --sidebar-accent: oklch(0.33 0.02 60.70);
  --sidebar-accent-foreground: oklch(0.86 0.05 85.12);
  --sidebar-border: oklch(0.33 0.02 60.70);
  --sidebar-ring: oklch(0.64 0.05 114.58);
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
}

[data-domain="modern_minimal"] {
  --background: oklch(1.00 0 0);
  --foreground: oklch(0.32 0 0);
  --card: oklch(1.00 0 0);
  --card-foreground: oklch(0.32 0 0);
  --popover: oklch(1.00 0 0);
  --popover-foreground: oklch(0.32 0 0);
  --primary: oklch(0.62 0.19 259.76);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.97 0 0);
  --secondary-foreground: oklch(0.45 0.03 257.68);
  --muted: oklch(0.98 0 0);
  --muted-foreground: oklch(0.55 0.02 264.41);
  --accent: oklch(0.95 0.03 233.56);
  --accent-foreground: oklch(0.38 0.14 265.59);
  --destructive: oklch(0.64 0.21 25.39);
  --border: oklch(0.93 0.01 261.82);
  --input: oklch(0.93 0.01 261.82);
  --ring: oklch(0.62 0.19 259.76);
  --chart-1: oklch(0.62 0.19 259.76);
  --chart-2: oklch(0.55 0.22 262.96);
  --chart-3: oklch(0.49 0.22 264.43);
  --chart-4: oklch(0.42 0.18 265.55);
  --chart-5: oklch(0.38 0.14 265.59);
  --sidebar: oklch(0.98 0 0);
  --sidebar-foreground: oklch(0.14 0 0);
  --sidebar-primary: oklch(0.20 0 0);
  --sidebar-primary-foreground: oklch(0.98 0 0);
  --sidebar-accent: oklch(0.97 0 0);
  --sidebar-accent-foreground: oklch(0.20 0 0);
  --sidebar-border: oklch(0.92 0 0);
  --sidebar-ring: oklch(0.71 0 0);

  --font-sans: 'Geist', 'Geist Fallback', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
  --font-serif: Source Serif 4, serif;
  --font-mono: JetBrains Mono, monospace;

  --radius: 0.375rem;
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
  
}

.dark[data-domain="modern_minimal"] {
  --background: oklch(0.20 0 0);
  --foreground: oklch(0.92 0 0);
  --card: oklch(0.27 0 0);
  --card-foreground: oklch(0.92 0 0);
  --popover: oklch(0.27 0 0);
  --popover-foreground: oklch(0.92 0 0);
  --primary: oklch(0.62 0.19 259.76);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.27 0 0);
  --secondary-foreground: oklch(0.92 0 0);
  --muted: oklch(0.27 0 0);
  --muted-foreground: oklch(0.72 0 0);
  --accent: oklch(0.38 0.14 265.59);
  --accent-foreground: oklch(0.88 0.06 254.63);
  --destructive: oklch(0.64 0.21 25.39);
  --border: oklch(0.37 0 0);
  --input: oklch(0.37 0 0);
  --ring: oklch(0.62 0.19 259.76);
  --chart-1: oklch(0.71 0.14 254.69);
  --chart-2: oklch(0.62 0.19 259.76);
  --chart-3: oklch(0.55 0.22 262.96);
  --chart-4: oklch(0.49 0.22 264.43);
  --chart-5: oklch(0.42 0.18 265.55);
  --sidebar: oklch(0.21 0.01 285.56);
  --sidebar-foreground: oklch(0.99 0 0);
  --sidebar-primary: oklch(0.49 0.24 264.41);
  --sidebar-primary-foreground: oklch(0.99 0 0);
  --sidebar-accent: oklch(0.27 0.01 285.81);
  --sidebar-accent-foreground: oklch(0.99 0 0);
  --sidebar-border: oklch(1.00 0 0 / 10%);
  --sidebar-ring: oklch(0.55 0.02 285.76);
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
}

[data-domain="nature"] {
  --background: oklch(0.97 0.01 87.41);
  --foreground: oklch(0.31 0.02 148.20);
  --card: oklch(0.97 0.01 87.41);
  --card-foreground: oklch(0.30 0.04 29.20);
  --popover: oklch(0.97 0.01 87.41);
  --popover-foreground: oklch(0.30 0.04 29.20);
  --primary: oklch(0.52 0.13 144.33);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.96 0.02 147.54);
  --secondary-foreground: oklch(0.43 0.12 144.33);
  --muted: oklch(0.94 0.01 72.65);
  --muted-foreground: oklch(0.50 0.01 156.76);
  --accent: oklch(0.90 0.05 146.01);
  --accent-foreground: oklch(0.43 0.12 144.33);
  --destructive: oklch(0.54 0.19 26.90);
  --border: oklch(0.88 0 0);
  --input: oklch(0.88 0.02 77.29);
  --ring: oklch(0.52 0.13 144.33);
  --chart-1: oklch(0.67 0.16 144.06);
  --chart-2: oklch(0.58 0.14 144.14);
  --chart-3: oklch(0.52 0.13 144.33);
  --chart-4: oklch(0.43 0.12 144.33);
  --chart-5: oklch(0.22 0.05 145.34);
  --sidebar: oklch(0.94 0.01 72.65);
  --sidebar-foreground: oklch(0.30 0.04 29.20);
  --sidebar-primary: oklch(0.52 0.13 144.33);
  --sidebar-primary-foreground: oklch(1.00 0 0);
  --sidebar-accent: oklch(0.90 0.05 146.01);
  --sidebar-accent-foreground: oklch(0.43 0.12 144.33);
  --sidebar-border: oklch(0.88 0.02 77.29);
  --sidebar-ring: oklch(0.52 0.13 144.33);

  --font-sans: Montserrat, sans-serif;
  --font-serif: Merriweather, serif;
  --font-mono: Source Code Pro, monospace;

  --radius: 0.5rem;
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
  
}

.dark[data-domain="nature"] {
  --background: oklch(0.31 0.03 149.96);
  --foreground: oklch(0.84 0.01 145.30);
  --card: oklch(0.35 0.03 148.55);
  --card-foreground: oklch(0.84 0.01 145.30);
  --popover: oklch(0.33 0.03 146.53);
  --popover-foreground: oklch(0.94 0.01 72.65);
  --primary: oklch(0.67 0.16 144.06);
  --primary-foreground: oklch(0.99 0.02 145.33);
  --secondary: oklch(0.39 0.03 143.09);
  --secondary-foreground: oklch(0.90 0.02 142.94);
  --muted: oklch(0.29 0.03 148.25);
  --muted-foreground: oklch(0.69 0.02 150.35);
  --accent: oklch(0.58 0.14 144.14);
  --accent-foreground: oklch(0.94 0.01 72.65);
  --destructive: oklch(0.54 0.19 26.90);
  --border: oklch(0.39 0.03 143.09);
  --input: oklch(0.39 0.03 143.09);
  --ring: oklch(0.67 0.16 144.06);
  --chart-1: oklch(0.77 0.12 145.23);
  --chart-2: oklch(0.72 0.14 144.92);
  --chart-3: oklch(0.67 0.16 144.06);
  --chart-4: oklch(0.63 0.15 144.32);
  --chart-5: oklch(0.58 0.14 144.14);
  --sidebar: oklch(0.27 0.03 150.18);
  --sidebar-foreground: oklch(0.94 0.01 72.65);
  --sidebar-primary: oklch(0.67 0.16 144.06);
  --sidebar-primary-foreground: oklch(0.22 0.05 145.34);
  --sidebar-accent: oklch(0.58 0.14 144.14);
  --sidebar-accent-foreground: oklch(0.94 0.01 72.65);
  --sidebar-border: oklch(0.39 0.03 143.09);
  --sidebar-ring: oklch(0.67 0.16 144.06);
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
}

[data-domain="neo_brutalism"] {
  --background: oklch(1.00 0 0);
  --foreground: oklch(0 0 0);
  --card: oklch(1.00 0 0);
  --card-foreground: oklch(0 0 0);
  --popover: oklch(1.00 0 0);
  --popover-foreground: oklch(0 0 0);
  --primary: oklch(0.65 0.24 26.92);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.97 0.21 109.74);
  --secondary-foreground: oklch(0 0 0);
  --muted: oklch(0.96 0 0);
  --muted-foreground: oklch(0.32 0 0);
  --accent: oklch(0.56 0.24 260.83);
  --accent-foreground: oklch(1.00 0 0);
  --destructive: oklch(0 0 0);
  --border: oklch(0 0 0);
  --input: oklch(0 0 0);
  --ring: oklch(0.65 0.24 26.92);
  --chart-1: oklch(0.65 0.24 26.92);
  --chart-2: oklch(0.97 0.21 109.74);
  --chart-3: oklch(0.56 0.24 260.83);
  --chart-4: oklch(0.73 0.25 142.50);
  --chart-5: oklch(0.59 0.27 328.36);
  --sidebar: oklch(0.96 0 0);
  --sidebar-foreground: oklch(0 0 0);
  --sidebar-primary: oklch(0.65 0.24 26.92);
  --sidebar-primary-foreground: oklch(1.00 0 0);
  --sidebar-accent: oklch(0.56 0.24 260.83);
  --sidebar-accent-foreground: oklch(1.00 0 0);
  --sidebar-border: oklch(0 0 0);
  --sidebar-ring: oklch(0.65 0.24 26.92);

  --font-sans: DM Sans, sans-serif;
  --font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  --font-mono: Space Mono, monospace;

  --radius: 0px;
  
  --shadow-2xs: 4px 4px 0px 0px oklch(0.00 0 0 / 0.50);
  --shadow-xs: 4px 4px 0px 0px oklch(0.00 0 0 / 0.50);
  --shadow-sm: 4px 4px 0px 0px oklch(0.00 0 0 / 1.00), 4px 1px 2px -1px oklch(0.00 0 0 / 1.00);
  --shadow: 4px 4px 0px 0px oklch(0.00 0 0 / 1.00), 4px 1px 2px -1px oklch(0.00 0 0 / 1.00);
  --shadow-md: 4px 4px 0px 0px oklch(0.00 0 0 / 1.00), 4px 2px 4px -1px oklch(0.00 0 0 / 1.00);
  --shadow-lg: 4px 4px 0px 0px oklch(0.00 0 0 / 1.00), 4px 4px 6px -1px oklch(0.00 0 0 / 1.00);
  --shadow-xl: 4px 4px 0px 0px oklch(0.00 0 0 / 1.00), 4px 8px 10px -1px oklch(0.00 0 0 / 1.00);
  --shadow-2xl: 4px 4px 0px 0px oklch(0.00 0 0 / 2.50);
  
}

.dark[data-domain="neo_brutalism"] {
  --background: oklch(0 0 0);
  --foreground: oklch(1.00 0 0);
  --card: oklch(0.32 0 0);
  --card-foreground: oklch(1.00 0 0);
  --popover: oklch(0.32 0 0);
  --popover-foreground: oklch(1.00 0 0);
  --primary: oklch(0.70 0.19 23.04);
  --primary-foreground: oklch(0 0 0);
  --secondary: oklch(0.97 0.20 109.61);
  --secondary-foreground: oklch(0 0 0);
  --muted: oklch(0.32 0 0);
  --muted-foreground: oklch(0.85 0 0);
  --accent: oklch(0.68 0.18 251.63);
  --accent-foreground: oklch(0 0 0);
  --destructive: oklch(1.00 0 0);
  --border: oklch(1.00 0 0);
  --input: oklch(1.00 0 0);
  --ring: oklch(0.70 0.19 23.04);
  --chart-1: oklch(0.70 0.19 23.04);
  --chart-2: oklch(0.97 0.20 109.61);
  --chart-3: oklch(0.68 0.18 251.63);
  --chart-4: oklch(0.74 0.23 142.87);
  --chart-5: oklch(0.61 0.25 328.13);
  --sidebar: oklch(0 0 0);
  --sidebar-foreground: oklch(1.00 0 0);
  --sidebar-primary: oklch(0.70 0.19 23.04);
  --sidebar-primary-foreground: oklch(0 0 0);
  --sidebar-accent: oklch(0.68 0.18 251.63);
  --sidebar-accent-foreground: oklch(0 0 0);
  --sidebar-border: oklch(1.00 0 0);
  --sidebar-ring: oklch(0.70 0.19 23.04);
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
}

[data-domain="pastel_dreams"] {
  --background: oklch(0.97 0.01 316.68);
  --foreground: oklch(0.37 0.03 259.73);
  --card: oklch(1.00 0 0);
  --card-foreground: oklch(0.37 0.03 259.73);
  --popover: oklch(1.00 0 0);
  --popover-foreground: oklch(0.37 0.03 259.73);
  --primary: oklch(0.71 0.16 293.40);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.91 0.05 306.07);
  --secondary-foreground: oklch(0.45 0.03 257.68);
  --muted: oklch(0.95 0.03 307.19);
  --muted-foreground: oklch(0.55 0.02 264.41);
  --accent: oklch(0.94 0.03 322.47);
  --accent-foreground: oklch(0.37 0.03 259.73);
  --destructive: oklch(0.81 0.10 19.47);
  --border: oklch(0.91 0.05 306.07);
  --input: oklch(0.91 0.05 306.07);
  --ring: oklch(0.71 0.16 293.40);
  --chart-1: oklch(0.71 0.16 293.40);
  --chart-2: oklch(0.61 0.22 292.63);
  --chart-3: oklch(0.54 0.25 293.03);
  --chart-4: oklch(0.49 0.24 292.70);
  --chart-5: oklch(0.43 0.21 292.63);
  --sidebar: oklch(0.91 0.05 306.07);
  --sidebar-foreground: oklch(0.37 0.03 259.73);
  --sidebar-primary: oklch(0.71 0.16 293.40);
  --sidebar-primary-foreground: oklch(1.00 0 0);
  --sidebar-accent: oklch(0.94 0.03 322.47);
  --sidebar-accent-foreground: oklch(0.37 0.03 259.73);
  --sidebar-border: oklch(0.91 0.05 306.07);
  --sidebar-ring: oklch(0.71 0.16 293.40);

  --font-sans: Open Sans, sans-serif;
  --font-serif: Source Serif 4, serif;
  --font-mono: IBM Plex Mono, monospace;

  --radius: 1.5rem;
  
  --shadow-2xs: 0px 8px 16px -4px oklch(0.00 0 0 / 0.04);
  --shadow-xs: 0px 8px 16px -4px oklch(0.00 0 0 / 0.04);
  --shadow-sm: 0px 8px 16px -4px oklch(0.00 0 0 / 0.08), 0px 1px 2px -5px oklch(0.00 0 0 / 0.08);
  --shadow: 0px 8px 16px -4px oklch(0.00 0 0 / 0.08), 0px 1px 2px -5px oklch(0.00 0 0 / 0.08);
  --shadow-md: 0px 8px 16px -4px oklch(0.00 0 0 / 0.08), 0px 2px 4px -5px oklch(0.00 0 0 / 0.08);
  --shadow-lg: 0px 8px 16px -4px oklch(0.00 0 0 / 0.08), 0px 4px 6px -5px oklch(0.00 0 0 / 0.08);
  --shadow-xl: 0px 8px 16px -4px oklch(0.00 0 0 / 0.08), 0px 8px 10px -5px oklch(0.00 0 0 / 0.08);
  --shadow-2xl: 0px 8px 16px -4px oklch(0.00 0 0 / 0.20);
  
}

.dark[data-domain="pastel_dreams"] {
  --background: oklch(0.22 0.01 52.96);
  --foreground: oklch(0.93 0.03 273.66);
  --card: oklch(0.28 0.03 307.25);
  --card-foreground: oklch(0.93 0.03 273.66);
  --popover: oklch(0.28 0.03 307.25);
  --popover-foreground: oklch(0.93 0.03 273.66);
  --primary: oklch(0.79 0.12 295.97);
  --primary-foreground: oklch(0.22 0.01 52.96);
  --secondary: oklch(0.34 0.04 309.13);
  --secondary-foreground: oklch(0.87 0.01 261.81);
  --muted: oklch(0.28 0.03 307.25);
  --muted-foreground: oklch(0.71 0.02 261.33);
  --accent: oklch(0.39 0.05 304.68);
  --accent-foreground: oklch(0.87 0.01 261.81);
  --destructive: oklch(0.81 0.10 19.47);
  --border: oklch(0.34 0.04 309.13);
  --input: oklch(0.34 0.04 309.13);
  --ring: oklch(0.79 0.12 295.97);
  --chart-1: oklch(0.79 0.12 295.97);
  --chart-2: oklch(0.71 0.16 293.40);
  --chart-3: oklch(0.61 0.22 292.63);
  --chart-4: oklch(0.54 0.25 293.03);
  --chart-5: oklch(0.49 0.24 292.70);
  --sidebar: oklch(0.34 0.04 309.13);
  --sidebar-foreground: oklch(0.93 0.03 273.66);
  --sidebar-primary: oklch(0.79 0.12 295.97);
  --sidebar-primary-foreground: oklch(0.22 0.01 52.96);
  --sidebar-accent: oklch(0.39 0.05 304.68);
  --sidebar-accent-foreground: oklch(0.87 0.01 261.81);
  --sidebar-border: oklch(0.34 0.04 309.13);
  --sidebar-ring: oklch(0.79 0.12 295.97);
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
}

[data-domain="midnight_bloom"] {
  --background: oklch(0.98 0 0);
  --foreground: oklch(0.32 0 0);
  --card: oklch(1.00 0 0);
  --card-foreground: oklch(0.32 0 0);
  --popover: oklch(1.00 0 0);
  --popover-foreground: oklch(0.32 0 0);
  --primary: oklch(0.57 0.20 283.26);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.82 0.07 249.99);
  --secondary-foreground: oklch(0.32 0 0);
  --muted: oklch(0.82 0.02 90.54);
  --muted-foreground: oklch(0.54 0 0);
  --accent: oklch(0.65 0.06 117.02);
  --accent-foreground: oklch(1.00 0 0);
  --destructive: oklch(0.64 0.21 25.39);
  --border: oklch(0.87 0 0);
  --input: oklch(0.87 0 0);
  --ring: oklch(0.57 0.20 283.26);
  --chart-1: oklch(0.57 0.20 283.26);
  --chart-2: oklch(0.53 0.17 314.68);
  --chart-3: oklch(0.34 0.18 301.34);
  --chart-4: oklch(0.67 0.14 261.15);
  --chart-5: oklch(0.59 0.10 245.35);
  --sidebar: oklch(0.98 0 0);
  --sidebar-foreground: oklch(0.32 0 0);
  --sidebar-primary: oklch(0.57 0.20 283.26);
  --sidebar-primary-foreground: oklch(1.00 0 0);
  --sidebar-accent: oklch(0.65 0.06 117.02);
  --sidebar-accent-foreground: oklch(1.00 0 0);
  --sidebar-border: oklch(0.87 0 0);
  --sidebar-ring: oklch(0.57 0.20 283.26);

  --font-sans: Montserrat, sans-serif;
  --font-serif: Playfair Display, serif;
  --font-mono: Source Code Pro, monospace;

  --radius: 0.5rem;
  
  --shadow-2xs: 0px 5px 10px -2px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0px 5px 10px -2px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0px 5px 10px -2px oklch(0.00 0 0 / 0.10), 0px 1px 2px -3px oklch(0.00 0 0 / 0.10);
  --shadow: 0px 5px 10px -2px oklch(0.00 0 0 / 0.10), 0px 1px 2px -3px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0px 5px 10px -2px oklch(0.00 0 0 / 0.10), 0px 2px 4px -3px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0px 5px 10px -2px oklch(0.00 0 0 / 0.10), 0px 4px 6px -3px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0px 5px 10px -2px oklch(0.00 0 0 / 0.10), 0px 8px 10px -3px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0px 5px 10px -2px oklch(0.00 0 0 / 0.25);
  
}

.dark[data-domain="midnight_bloom"] {
  --background: oklch(0.23 0.01 268.25);
  --foreground: oklch(0.92 0 0);
  --card: oklch(0.32 0.01 229.15);
  --card-foreground: oklch(0.92 0 0);
  --popover: oklch(0.32 0.01 229.15);
  --popover-foreground: oklch(0.92 0 0);
  --primary: oklch(0.57 0.20 283.26);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.34 0.18 301.34);
  --secondary-foreground: oklch(0.92 0 0);
  --muted: oklch(0.39 0 0);
  --muted-foreground: oklch(0.72 0 0);
  --accent: oklch(0.67 0.14 261.15);
  --accent-foreground: oklch(0.92 0 0);
  --destructive: oklch(0.64 0.21 25.39);
  --border: oklch(0.39 0 0);
  --input: oklch(0.39 0 0);
  --ring: oklch(0.57 0.20 283.26);
  --chart-1: oklch(0.57 0.20 283.26);
  --chart-2: oklch(0.53 0.17 314.68);
  --chart-3: oklch(0.34 0.18 301.34);
  --chart-4: oklch(0.67 0.14 261.15);
  --chart-5: oklch(0.59 0.10 245.35);
  --sidebar: oklch(0.23 0.01 268.25);
  --sidebar-foreground: oklch(0.92 0 0);
  --sidebar-primary: oklch(0.57 0.20 283.26);
  --sidebar-primary-foreground: oklch(1.00 0 0);
  --sidebar-accent: oklch(0.67 0.14 261.15);
  --sidebar-accent-foreground: oklch(0.92 0 0);
  --sidebar-border: oklch(0.39 0 0);
  --sidebar-ring: oklch(0.57 0.20 283.26);
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
}

[data-domain="sunset_horizon"] {
  --background: oklch(0.99 0.01 67.74);
  --foreground: oklch(0.34 0.01 7.89);
  --card: oklch(1.00 0 0);
  --card-foreground: oklch(0.34 0.01 7.89);
  --popover: oklch(1.00 0 0);
  --popover-foreground: oklch(0.34 0.01 7.89);
  --primary: oklch(0.74 0.16 34.57);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.96 0.02 28.97);
  --secondary-foreground: oklch(0.56 0.13 32.65);
  --muted: oklch(0.97 0.02 44.86);
  --muted-foreground: oklch(0.49 0.05 27.86);
  --accent: oklch(0.83 0.11 57.89);
  --accent-foreground: oklch(0.34 0.01 7.89);
  --destructive: oklch(0.61 0.21 22.21);
  --border: oklch(0.93 0.04 40.57);
  --input: oklch(0.93 0.04 40.57);
  --ring: oklch(0.74 0.16 34.57);
  --chart-1: oklch(0.74 0.16 34.57);
  --chart-2: oklch(0.83 0.11 57.89);
  --chart-3: oklch(0.88 0.08 56.41);
  --chart-4: oklch(0.82 0.11 41.27);
  --chart-5: oklch(0.64 0.13 32.06);
  --sidebar: oklch(0.97 0.02 44.86);
  --sidebar-foreground: oklch(0.34 0.01 7.89);
  --sidebar-primary: oklch(0.74 0.16 34.57);
  --sidebar-primary-foreground: oklch(1.00 0 0);
  --sidebar-accent: oklch(0.83 0.11 57.89);
  --sidebar-accent-foreground: oklch(0.34 0.01 7.89);
  --sidebar-border: oklch(0.93 0.04 40.57);
  --sidebar-ring: oklch(0.74 0.16 34.57);

  --font-sans: Montserrat, sans-serif;
  --font-serif: Merriweather, serif;
  --font-mono: Ubuntu Mono, monospace;

  --radius: 0.625rem;
  
  --shadow-2xs: 0px 6px 12px -3px oklch(0.00 0 0 / 0.04);
  --shadow-xs: 0px 6px 12px -3px oklch(0.00 0 0 / 0.04);
  --shadow-sm: 0px 6px 12px -3px oklch(0.00 0 0 / 0.09), 0px 1px 2px -4px oklch(0.00 0 0 / 0.09);
  --shadow: 0px 6px 12px -3px oklch(0.00 0 0 / 0.09), 0px 1px 2px -4px oklch(0.00 0 0 / 0.09);
  --shadow-md: 0px 6px 12px -3px oklch(0.00 0 0 / 0.09), 0px 2px 4px -4px oklch(0.00 0 0 / 0.09);
  --shadow-lg: 0px 6px 12px -3px oklch(0.00 0 0 / 0.09), 0px 4px 6px -4px oklch(0.00 0 0 / 0.09);
  --shadow-xl: 0px 6px 12px -3px oklch(0.00 0 0 / 0.09), 0px 8px 10px -4px oklch(0.00 0 0 / 0.09);
  --shadow-2xl: 0px 6px 12px -3px oklch(0.00 0 0 / 0.22);
  
}

.dark[data-domain="sunset_horizon"] {
  --background: oklch(0.26 0.02 351.79);
  --foreground: oklch(0.94 0.01 48.70);
  --card: oklch(0.32 0.02 339.89);
  --card-foreground: oklch(0.94 0.01 48.70);
  --popover: oklch(0.32 0.02 339.89);
  --popover-foreground: oklch(0.94 0.01 48.70);
  --primary: oklch(0.74 0.16 34.57);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.36 0.02 342.33);
  --secondary-foreground: oklch(0.94 0.01 48.70);
  --muted: oklch(0.32 0.02 339.89);
  --muted-foreground: oklch(0.84 0.02 50.14);
  --accent: oklch(0.83 0.11 57.89);
  --accent-foreground: oklch(0.26 0.02 351.79);
  --destructive: oklch(0.61 0.21 22.21);
  --border: oklch(0.36 0.02 342.33);
  --input: oklch(0.36 0.02 342.33);
  --ring: oklch(0.74 0.16 34.57);
  --chart-1: oklch(0.74 0.16 34.57);
  --chart-2: oklch(0.83 0.11 57.89);
  --chart-3: oklch(0.88 0.08 56.41);
  --chart-4: oklch(0.82 0.11 41.27);
  --chart-5: oklch(0.64 0.13 32.06);
  --sidebar: oklch(0.26 0.02 351.79);
  --sidebar-foreground: oklch(0.94 0.01 48.70);
  --sidebar-primary: oklch(0.74 0.16 34.57);
  --sidebar-primary-foreground: oklch(1.00 0 0);
  --sidebar-accent: oklch(0.83 0.11 57.89);
  --sidebar-accent-foreground: oklch(0.26 0.02 351.79);
  --sidebar-border: oklch(0.36 0.02 342.33);
  --sidebar-ring: oklch(0.74 0.16 34.57);
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
}

[data-domain="slack"] {
  --background: oklch(1.00 0 0);
  --foreground: oklch(0.23 0 0);
  --card: oklch(0.98 0 0);
  --card-foreground: oklch(0.23 0 0);
  --popover: oklch(0.98 0 0);
  --popover-foreground: oklch(0.23 0 0);
  --primary: oklch(0.37 0.14 323.40);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.96 0.01 311.36);
  --secondary-foreground: oklch(0.31 0.11 327.10);
  --muted: oklch(0.97 0 0);
  --muted-foreground: oklch(0.49 0 0);
  --accent: oklch(0.88 0.02 323.34);
  --accent-foreground: oklch(0.31 0.11 327.10);
  --destructive: oklch(0.59 0.22 11.39);
  --border: oklch(0.91 0 0);
  --input: oklch(0.91 0 0);
  --ring: oklch(0.37 0.14 323.40);
  --chart-1: oklch(0.31 0.11 327.10);
  --chart-2: oklch(0.37 0.14 323.40);
  --chart-3: oklch(0.59 0.22 11.39);
  --chart-4: oklch(0.77 0.13 222.66);
  --chart-5: oklch(0.69 0.14 160.27);
  --sidebar: oklch(0.96 0.01 311.36);
  --sidebar-foreground: oklch(0.23 0 0);
  --sidebar-primary: oklch(0.37 0.14 323.40);
  --sidebar-primary-foreground: oklch(1.00 0 0);
  --sidebar-accent: oklch(0.88 0.02 323.34);
  --sidebar-accent-foreground: oklch(0.31 0.11 327.10);
  --sidebar-border: oklch(0.91 0 0);
  --sidebar-ring: oklch(0.37 0.14 323.40);

  --font-sans: Lato, sans-serif;
  --font-serif: Merriweather, serif;
  --font-mono: Roboto Mono, monospace;

  --radius: 0.5rem;
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
  
}

.dark[data-domain="slack"]  {
  --background: oklch(0.23 0.01 260.69);
  --foreground: oklch(0.93 0 0);
  --card: oklch(0.26 0.01 260.70);
  --card-foreground: oklch(0.93 0 0);
  --popover: oklch(0.26 0.01 260.70);
  --popover-foreground: oklch(0.93 0 0);
  --primary: oklch(0.58 0.14 327.21);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.30 0.01 254.00);
  --secondary-foreground: oklch(0.93 0 0);
  --muted: oklch(0.26 0.01 260.70);
  --muted-foreground: oklch(0.68 0 0);
  --accent: oklch(0.33 0.03 326.28);
  --accent-foreground: oklch(0.93 0 0);
  --destructive: oklch(0.59 0.22 11.39);
  --border: oklch(0.30 0.01 268.37);
  --input: oklch(0.30 0.01 268.37);
  --ring: oklch(0.58 0.14 327.21);
  --chart-1: oklch(0.58 0.14 327.21);
  --chart-2: oklch(0.77 0.13 222.66);
  --chart-3: oklch(0.69 0.14 160.27);
  --chart-4: oklch(0.59 0.22 11.39);
  --chart-5: oklch(0.80 0.15 82.32);
  --sidebar: oklch(0.23 0.01 260.69);
  --sidebar-foreground: oklch(0.93 0 0);
  --sidebar-primary: oklch(0.58 0.14 327.21);
  --sidebar-primary-foreground: oklch(1.00 0 0);
  --sidebar-accent: oklch(0.33 0.03 326.28);
  --sidebar-accent-foreground: oklch(0.93 0 0);
  --sidebar-border: oklch(0.30 0.01 268.37);
  --sidebar-ring: oklch(0.58 0.14 327.21);
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
}

[data-domain="perplexity"] {
  --background: oklch(0.96 0.01 196.81);
  --foreground: oklch(0.38 0.06 211.49);
  --card: oklch(0.98 0.00 196.66);
  --card-foreground: oklch(0.38 0.06 211.49);
  --popover: oklch(0.97 0.01 196.81);
  --popover-foreground: oklch(0.38 0.06 211.49);
  --primary: oklch(0.72 0.12 210.36);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.97 0.01 247.91);
  --secondary-foreground: oklch(0.14 0 0);
  --muted: oklch(0.94 0.01 196.81);
  --muted-foreground: oklch(0.55 0.04 256.40);
  --accent: oklch(0.92 0.02 204.76);
  --accent-foreground: oklch(0.57 0.10 213.73);
  --destructive: oklch(0.64 0.21 25.39);
  --border: oklch(0.93 0.01 256.71);
  --input: oklch(0.93 0.01 256.71);
  --ring: oklch(0.72 0.12 210.36);
  --chart-1: oklch(0.72 0.12 210.36);
  --chart-2: oklch(0.57 0.10 213.73);
  --chart-3: oklch(0.79 0.12 209.45);
  --chart-4: oklch(0.76 0.11 208.70);
  --chart-5: oklch(0.83 0.10 208.33);
  --sidebar: oklch(0.98 0 0);
  --sidebar-foreground: oklch(0.14 0 0);
  --sidebar-primary: oklch(0.72 0.12 210.36);
  --sidebar-primary-foreground: oklch(1.00 0 0);
  --sidebar-accent: oklch(0.96 0.02 204.34);
  --sidebar-accent-foreground: oklch(0.57 0.10 213.73);
  --sidebar-border: oklch(0.93 0.01 256.71);
  --sidebar-ring: oklch(0.72 0.12 210.36);

  --font-sans: Inter, sans-serif;
  --font-serif: Lora, serif;
  --font-mono: Roboto Mono, monospace;

  --radius: 0.5rem;
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
  
}

.dark[data-domain="perplexity"] {
  --background: oklch(0.21 0.02 226.02);
  --foreground: oklch(0.81 0.04 226.14);
  --card: oklch(0.23 0.03 218.18);
  --card-foreground: oklch(0.70 0.04 225.59);
  --popover: oklch(0.23 0.03 218.18);
  --popover-foreground: oklch(0.94 0.05 196.31);
  --primary: oklch(0.72 0.12 210.36);
  --primary-foreground: oklch(1.00 0 0);
  --secondary: oklch(0.27 0.01 285.81);
  --secondary-foreground: oklch(0.97 0 0);
  --muted: oklch(0.18 0.02 227.33);
  --muted-foreground: oklch(0.58 0.03 223.55);
  --accent: oklch(0.17 0.02 210.68);
  --accent-foreground: oklch(0.97 0 0);
  --destructive: oklch(0.64 0.21 25.39);
  --border: oklch(0.36 0.02 213.25);
  --input: oklch(0.29 0 0);
  --ring: oklch(0.72 0.12 210.36);
  --chart-1: oklch(0.72 0.12 210.36);
  --chart-2: oklch(0.79 0.12 209.45);
  --chart-3: oklch(0.76 0.11 208.70);
  --chart-4: oklch(0.83 0.10 208.33);
  --chart-5: oklch(0.57 0.10 213.73);
  --sidebar: oklch(0.19 0 0);
  --sidebar-foreground: oklch(0.97 0 0);
  --sidebar-primary: oklch(0.72 0.12 210.36);
  --sidebar-primary-foreground: oklch(1.00 0 0);
  --sidebar-accent: oklch(0.24 0 0);
  --sidebar-accent-foreground: oklch(0.97 0 0);
  --sidebar-border: oklch(0.29 0 0);
  --sidebar-ring: oklch(0.72 0.12 210.36);
  
  --shadow-2xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-xs: 0 1px 3px 0px oklch(0.00 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 1px 2px -1px oklch(0.00 0 0 / 0.10);
  --shadow-md: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 2px 4px -1px oklch(0.00 0 0 / 0.10);
  --shadow-lg: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 4px 6px -1px oklch(0.00 0 0 / 0.10);
  --shadow-xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.10), 0 8px 10px -1px oklch(0.00 0 0 / 0.10);
  --shadow-2xl: 0 1px 3px 0px oklch(0.00 0 0 / 0.25);
}

@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --color-card: var(--card);
  --color-card-foreground: var(--card-foreground);
  --color-popover: var(--popover);
  --color-popover-foreground: var(--popover-foreground);
  --color-primary: var(--primary);
  --color-primary-foreground: var(--primary-foreground);
  --color-secondary: var(--secondary);
  --color-secondary-foreground: var(--secondary-foreground);
  --color-muted: var(--muted);
  --color-muted-foreground: var(--muted-foreground);
  --color-accent: var(--accent);
  --color-accent-foreground: var(--accent-foreground);
  --color-destructive: var(--destructive);
  --color-border: var(--border);
  --color-input: var(--input);
  --color-ring: var(--ring);
  --color-chart-1: var(--chart-1);
  --color-chart-2: var(--chart-2);
  --color-chart-3: var(--chart-3);
  --color-chart-4: var(--chart-4);
  --color-chart-5: var(--chart-5);
  --color-sidebar: var(--sidebar);
  --color-sidebar-foreground: var(--sidebar-foreground);
  --color-sidebar-primary: var(--sidebar-primary);
  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
  --color-sidebar-accent: var(--sidebar-accent);
  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
  --color-sidebar-border: var(--sidebar-border);
  --color-sidebar-ring: var(--sidebar-ring);

  --font-sans: var(--font-sans);
  --font-mono: var(--font-mono);
  --font-serif: var(--font-serif);

  --radius-sm: calc(var(--radius) - 4px);
  --radius-md: calc(var(--radius) - 2px);
  --radius-lg: var(--radius);
  --radius-xl: calc(var(--radius) + 4px);

  --shadow-2xs: var(--shadow-2xs);
  --shadow-xs: var(--shadow-xs);
  --shadow-sm: var(--shadow-sm);
  --shadow: var(--shadow);
  --shadow-md: var(--shadow-md);
  --shadow-lg: var(--shadow-lg);
  --shadow-xl: var(--shadow-xl);
  --shadow-2xl: var(--shadow-2xl);
}

@layer base {
  * {
    @apply border-border outline-ring/50;
  }
  body {
    @apply bg-background text-foreground;
    letter-spacing: var(--tracking-normal);
  }
  button,
  [data-slot='combobox-item'],
  [data-slot='command-item'],
  [data-slot='context-menu-item'],
  [data-slot='context-menu-checkbox-item'],
  [data-slot='context-menu-radio-item'],
  [data-slot='dropdown-menu-item'],
  [data-slot='dropdown-menu-checkbox-item'],
  [data-slot='dropdown-menu-radio-item'],
  [data-slot='select-item'] {
    @apply cursor-pointer!;
  }
}

button {
  @apply cursor-pointer;
}

/* Custom styles for Filament RichEditor (Tiptap) content */
.prose {
  --tw-prose-bullets: var(--primary);
  --tw-prose-counters: var(--primary);
  --tw-prose-links: var(--primary);
  --tw-prose-quote-borders: var(--primary);
}

.prose ul {
  list-style-type: disc !important;
  margin-left: 1.5rem !important;
}

.prose ol {
  list-style-type: decimal !important;
  margin-left: 1.5rem !important;
}

.prose li {
  margin-top: 0.25rem !important;
  margin-bottom: 0.25rem !important;
  padding-left: 0.375rem !important;
}

.prose p {
  margin-top: 1.25em !important;
  margin-bottom: 1.25em !important;
}

.prose blockquote {
  font-style: italic;
  border-left: 4px solid var(--primary);
  padding-left: 1rem;
  margin: 1.5rem 0;
  color: var(--muted-foreground);
}

.prose img {
  border-radius: 0.75rem;
  margin: 2rem auto;
}

.prose hr {
  margin: 3rem 0;
  border-color: var(--border);
}

.prose table {
  width: 100%;
  border-collapse: collapse;
  margin: 2rem 0;
}

.prose th, .prose td {
  border: 1px solid var(--border);
  padding: 0.75rem;
  text-align: left;
}

.prose th {
  background-color: var(--muted);
}
