/* Radix UI colors inlined due to Tailwind CSS v4 compatibility issue with @import */

/* Slate Light */
:root, .light, .light-theme {
  --slate-1: hsl(206, 30.0%, 98.8%);
  --slate-2: hsl(210, 16.7%, 97.6%);
  --slate-3: hsl(209, 13.3%, 95.3%);
  --slate-4: hsl(209, 12.2%, 93.2%);
  --slate-5: hsl(208, 11.7%, 91.1%);
  --slate-6: hsl(208, 11.3%, 88.9%);
  --slate-7: hsl(207, 11.1%, 85.9%);
  --slate-8: hsl(205, 10.7%, 78.0%);
  --slate-9: hsl(206, 6.0%, 56.1%);
  --slate-10: hsl(206, 5.8%, 52.3%);
  --slate-11: hsl(206, 6.0%, 43.5%);
  --slate-12: hsl(206, 24.0%, 9.0%);
  --slate-a1: hsla(210, 92.6%, 26.5%, 0.016);
  --slate-a2: hsla(210, 87.7%, 16.0%, 0.032);
  --slate-a3: hsla(210, 98.8%, 14.4%, 0.055);
  --slate-a4: hsla(210, 94.1%, 11.1%, 0.079);
  --slate-a5: hsla(208, 97.7%, 10.1%, 0.102);
  --slate-a6: hsla(209, 94.4%, 10.9%, 0.126);
  --slate-a7: hsla(208, 90.3%, 10.1%, 0.157);
  --slate-a8: hsla(205, 98.9%, 9.9%, 0.244);
  --slate-a9: hsla(206, 99.8%, 7.3%, 0.459);
  --slate-a10: hsla(206, 98.1%, 6.9%, 0.499);
  --slate-a11: hsla(205, 96.6%, 6.0%, 0.585);
  --slate-a12: hsla(202, 97.7%, 3.7%, 0.930);
}

/* Slate Dark */
.dark, .dark-theme {
  --slate-1: hsl(200, 7.0%, 8.8%);
  --slate-2: hsl(195, 7.1%, 11.0%);
  --slate-3: hsl(197, 6.8%, 13.6%);
  --slate-4: hsl(198, 6.6%, 15.8%);
  --slate-5: hsl(199, 6.4%, 17.9%);
  --slate-6: hsl(201, 6.2%, 20.5%);
  --slate-7: hsl(203, 6.0%, 24.3%);
  --slate-8: hsl(207, 5.6%, 31.6%);
  --slate-9: hsl(206, 6.0%, 43.9%);
  --slate-10: hsl(206, 5.2%, 49.5%);
  --slate-11: hsl(206, 6.0%, 63.0%);
  --slate-12: hsl(210, 6.0%, 93.0%);
  --slate-a1: hsla(0, 0%, 0%, 0);
  --slate-a2: hsla(180, 93.3%, 48.4%, 0.031);
  --slate-a3: hsla(189, 86.7%, 63.9%, 0.057);
  --slate-a4: hsla(195, 87.1%, 65.8%, 0.079);
  --slate-a5: hsla(198, 93.4%, 65.1%, 0.101);
  --slate-a6: hsla(203, 90.7%, 66.3%, 0.127);
  --slate-a7: hsla(206, 87.5%, 67.1%, 0.166);
  --slate-a8: hsla(208, 86.4%, 67.6%, 0.244);
  --slate-a9: hsla(206, 95.5%, 68.6%, 0.395);
  --slate-a10: hsla(206, 96.6%, 72.2%, 0.450);
  --slate-a11: hsla(206, 98.9%, 80.8%, 0.587);
  --slate-a12: hsla(210, 93.8%, 95.5%, 0.927);
}

/* Blue Light */
:root, .light, .light-theme {
  --blue-1: hsl(206, 100%, 99.2%);
  --blue-2: hsl(210, 100%, 98.0%);
  --blue-3: hsl(209, 100%, 96.5%);
  --blue-4: hsl(210, 98.8%, 94.0%);
  --blue-5: hsl(209, 95.0%, 90.1%);
  --blue-6: hsl(209, 81.2%, 84.5%);
  --blue-7: hsl(208, 77.5%, 76.9%);
  --blue-8: hsl(206, 81.9%, 65.3%);
  --blue-9: hsl(206, 100%, 50.0%);
  --blue-10: hsl(208, 93.5%, 47.4%);
  --blue-11: hsl(211, 90.0%, 42.0%);
  --blue-12: hsl(216, 71.0%, 23.0%);
}

/* Blue Dark */
.dark, .dark-theme {
  --blue-1: hsl(212, 35.0%, 9.2%);
  --blue-2: hsl(216, 50.0%, 11.8%);
  --blue-3: hsl(214, 59.4%, 15.3%);
  --blue-4: hsl(214, 65.8%, 17.9%);
  --blue-5: hsl(213, 71.2%, 20.2%);
  --blue-6: hsl(212, 77.4%, 23.1%);
  --blue-7: hsl(211, 85.1%, 27.4%);
  --blue-8: hsl(211, 89.7%, 34.1%);
  --blue-9: hsl(206, 100%, 50.0%);
  --blue-10: hsl(209, 100%, 60.6%);
  --blue-11: hsl(210, 100%, 66.1%);
  --blue-12: hsl(206, 98.0%, 95.8%);
}

/* Violet Light */
:root, .light, .light-theme {
  --violet-1: hsl(255, 65.0%, 99.4%);
  --violet-2: hsl(252, 100%, 99.0%);
  --violet-3: hsl(252, 96.9%, 97.4%);
  --violet-4: hsl(252, 91.5%, 95.5%);
  --violet-5: hsl(252, 85.1%, 93.0%);
  --violet-6: hsl(252, 77.8%, 89.4%);
  --violet-7: hsl(252, 71.0%, 83.7%);
  --violet-8: hsl(252, 68.6%, 76.3%);
  --violet-9: hsl(252, 56.0%, 57.5%);
  --violet-10: hsl(251, 48.1%, 53.5%);
  --violet-11: hsl(250, 43.0%, 48.0%);
  --violet-12: hsl(254, 60.0%, 18.5%);
}

/* Violet Dark */
.dark, .dark-theme {
  --violet-1: hsl(250, 20.0%, 10.2%);
  --violet-2: hsl(255, 30.3%, 12.9%);
  --violet-3: hsl(253, 37.0%, 18.4%);
  --violet-4: hsl(252, 40.1%, 22.5%);
  --violet-5: hsl(252, 42.2%, 26.2%);
  --violet-6: hsl(251, 44.3%, 31.1%);
  --violet-7: hsl(250, 46.8%, 38.9%);
  --violet-8: hsl(250, 51.8%, 51.2%);
  --violet-9: hsl(252, 56.0%, 57.5%);
  --violet-10: hsl(251, 63.2%, 63.2%);
  --violet-11: hsl(250, 95.0%, 76.8%);
  --violet-12: hsl(252, 87.0%, 96.4%);
}

/*
  The default border color has changed to `currentColor` in Tailwind CSS v4,
  so we've added these compatibility styles to make sure everything still
  looks the same as it did with Tailwind CSS v3.

  If we ever want to remove these styles, we need to add an explicit border
  color utility to any element that depends on these defaults.
*/
@layer base {
  *,
  ::after,
  ::before,
  ::backdrop,
  ::file-selector-button {
    border-color: var(--color-gray-200, currentColor);
  }
}

@layer base {
  :root {
    --tomato-contrast: #fff;
    --red-contrast: #fff;
    --ruby-contrast: #fff;
    --crimson-contrast: #fff;
    --pink-contrast: #fff;
    --plum-contrast: #fff;
    --purple-contrast: #fff;
    --violet-contrast: #fff;
    --iris-contrast: #fff;
    --indigo-contrast: #fff;
    --blue-contrast: #fff;
    --cyan-contrast: #fff;
    --teal-contrast: #fff;
    --jade-contrast: #fff;
    --green-contrast: #fff;
    --grass-contrast: #fff;
    --bronze-contrast: #fff;
    --gold-contrast: #fff;
    --brown-contrast: #fff;
    --orange-contrast: #fff;
    --amber-contrast: #000;
    --yellow-contrast: #000;
    --lime-contrast: #000;
    --mint-contrast: #000;
    --sky-contrast: #000;
    --gray-contrast: #fff;
    --mauve-contrast: #fff;
    --slate-contrast: #fff;
    --sage-contrast: #fff;
    --olive-contrast: #fff;
    --sand-contrast: #fff;

    /**
   * Spacing scale
   *
   * These variables define a spacing scale based on Tailwind's default.
   * We've introduced a --size-scale variable as a multiplier.
   * By adjusting this single value, we can proportionally
   * scale all spacing throughout the entire application.
   *
   * https://tailwindcss.com/docs/customizing-spacing#default-spacing-scale
   */
    --size-scale: 1;
    --size-0: 0px;
    --size-px: 1px;
    --size-0-5: calc(0.125rem * var(--size-scale));
    --size-1: calc(0.25rem * var(--size-scale));
    --size-1-5: calc(0.375rem * var(--size-scale));
    --size-2: calc(0.5rem * var(--size-scale));
    --size-2-5: calc(0.625rem * var(--size-scale));
    --size-3: calc(0.75rem * var(--size-scale));
    --size-3-5: calc(0.875rem * var(--size-scale));
    --size-4: calc(1rem * var(--size-scale));
    --size-5: calc(1.25rem * var(--size-scale));
    --size-6: calc(1.5rem * var(--size-scale));
    --size-7: calc(1.75rem * var(--size-scale));
    --size-8: calc(2rem * var(--size-scale));
    --size-9: calc(2.25rem * var(--size-scale));
    --size-10: calc(2.5rem * var(--size-scale));
    --size-11: calc(2.75rem * var(--size-scale));
    --size-12: calc(3rem * var(--size-scale));
    --size-14: calc(3.5rem * var(--size-scale));
    --size-16: calc(4rem * var(--size-scale));
    --size-20: calc(5rem * var(--size-scale));
    --size-24: calc(6rem * var(--size-scale));
    --size-28: calc(7rem * var(--size-scale));
    --size-32: calc(8rem * var(--size-scale));
    --size-36: calc(9rem * var(--size-scale));
    --size-40: calc(10rem * var(--size-scale));
    --size-44: calc(11rem * var(--size-scale));
    --size-48: calc(12rem * var(--size-scale));
    --size-52: calc(13rem * var(--size-scale));
    --size-56: calc(14rem * var(--size-scale));
    --size-60: calc(15rem * var(--size-scale));
    --size-64: calc(16rem * var(--size-scale));
    --size-72: calc(18rem * var(--size-scale));
    --size-80: calc(20rem * var(--size-scale));
    --size-96: calc(24rem * var(--size-scale));

    /* Border radii */
    --radius-factor: 1;
    --radius-sm: calc(2px * var(--radius-factor) * var(--size-scale));
    --radius-md: calc(6px * var(--radius-factor) * var(--size-scale));
    --radius-lg: calc(8px * var(--radius-factor) * var(--size-scale));
    --radius-xl: calc(12px * var(--radius-factor) * var(--size-scale));
    --radius-2xl: calc(16px * var(--radius-factor) * var(--size-scale));
    --radius-full: 9999px;

    /* Neutral colors */
    --color-neutral-1: var(--slate-1);
    --color-neutral-2: var(--slate-2);
    --color-neutral-3: var(--slate-3);
    --color-neutral-4: var(--slate-4);
    --color-neutral-5: var(--slate-5);
    --color-neutral-6: var(--slate-6);
    --color-neutral-7: var(--slate-7);
    --color-neutral-8: var(--slate-8);
    --color-neutral-9: var(--slate-9);
    --color-neutral-10: var(--slate-10);
    --color-neutral-11: var(--slate-11);
    --color-neutral-12: var(--slate-12);
    --color-neutral-a1: var(--slate-a1);
    --color-neutral-a2: var(--slate-a2);
    --color-neutral-a3: var(--slate-a3);
    --color-neutral-a4: var(--slate-a4);
    --color-neutral-a5: var(--slate-a5);
    --color-neutral-a6: var(--slate-a6);
    --color-neutral-a7: var(--slate-a7);
    --color-neutral-a8: var(--slate-a8);
    --color-neutral-a9: var(--slate-a9);
    --color-neutral-a10: var(--slate-a10);
    --color-neutral-a11: var(--slate-a11);
    --color-neutral-a12: var(--slate-a12);
    --color-neutral-contrast: var(--slate-contrast);

    /* Accent colors */
    --color-accent-1: var(--blue-1);
    --color-accent-2: var(--blue-2);
    --color-accent-3: var(--blue-3);
    --color-accent-4: var(--blue-4);
    --color-accent-5: var(--blue-5);
    --color-accent-6: var(--blue-6);
    --color-accent-7: var(--blue-7);
    --color-accent-8: var(--blue-8);
    --color-accent-9: var(--blue-9);
    --color-accent-10: var(--blue-10);
    --color-accent-11: var(--blue-11);
    --color-accent-12: var(--blue-12);
    --color-accent-contrast: var(--blue-contrast);

    /* Secondary accent colors */
    --color-accent-secondary-1: var(--violet-1);
    --color-accent-secondary-2: var(--violet-2);
    --color-accent-secondary-3: var(--violet-3);
    --color-accent-secondary-4: var(--violet-4);
    --color-accent-secondary-5: var(--violet-5);
    --color-accent-secondary-6: var(--violet-6);
    --color-accent-secondary-7: var(--violet-7);
    --color-accent-secondary-8: var(--violet-8);
    --color-accent-secondary-9: var(--violet-9);
    --color-accent-secondary-10: var(--violet-10);
    --color-accent-secondary-11: var(--violet-11);
    --color-accent-secondary-12: var(--violet-12);
    --color-accent-secondary-contrast: var(--violet-contrast);

    /* Foreground colors */
    --color-fg: var(--color-neutral-12);
    --color-fg-secondary: var(--color-neutral-a11);

    /* Background colors */
    --color-bg: #ffffff;
    --color-bg-inset: var(--color-neutral-2);
    --color-bg-overlay: #ffffff;

    /* Focus ring */
    --color-focus-ring: var(--color-accent-9);

    /* Fonts */
    --font-sans-serif: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
      "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
    --font-monospace: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
      "Liberation Mono", "Courier New", monospace;
    --font-family: var(--font-sans-serif);
  }

  /* Explicit Light Theme - ensures proper override when switching themes */
  :root.light {
    --color-neutral-1: var(--slate-1);
    --color-neutral-2: var(--slate-2);
    --color-neutral-3: var(--slate-3);
    --color-neutral-4: var(--slate-4);
    --color-neutral-5: var(--slate-5);
    --color-neutral-6: var(--slate-6);
    --color-neutral-7: var(--slate-7);
    --color-neutral-8: var(--slate-8);
    --color-neutral-9: var(--slate-9);
    --color-neutral-10: var(--slate-10);
    --color-neutral-11: var(--slate-11);
    --color-neutral-12: var(--slate-12);
    --color-neutral-contrast: var(--slate-contrast);

    --color-accent-1: var(--blue-1);
    --color-accent-2: var(--blue-2);
    --color-accent-3: var(--blue-3);
    --color-accent-4: var(--blue-4);
    --color-accent-5: var(--blue-5);
    --color-accent-6: var(--blue-6);
    --color-accent-7: var(--blue-7);
    --color-accent-8: var(--blue-8);
    --color-accent-9: var(--blue-9);
    --color-accent-10: var(--blue-10);
    --color-accent-11: var(--blue-11);
    --color-accent-12: var(--blue-12);
    --color-accent-contrast: var(--blue-contrast);

    --color-accent-secondary-1: var(--violet-1);
    --color-accent-secondary-2: var(--violet-2);
    --color-accent-secondary-3: var(--violet-3);
    --color-accent-secondary-4: var(--violet-4);
    --color-accent-secondary-5: var(--violet-5);
    --color-accent-secondary-6: var(--violet-6);
    --color-accent-secondary-7: var(--violet-7);
    --color-accent-secondary-8: var(--violet-8);
    --color-accent-secondary-9: var(--violet-9);
    --color-accent-secondary-10: var(--violet-10);
    --color-accent-secondary-11: var(--violet-11);
    --color-accent-secondary-12: var(--violet-12);
    --color-accent-secondary-contrast: var(--violet-contrast);

    --color-fg: var(--color-neutral-12);
    --color-fg-secondary: var(--color-neutral-a11);
    --color-bg: #ffffff;
    --color-bg-inset: var(--color-neutral-2);
    --color-bg-overlay: #ffffff;
    --color-focus-ring: var(--color-accent-9);

    /* shadcn/ui variables */
    --background: #ffffff;
    --foreground: var(--slate-12);
    --card: #ffffff;
    --card-foreground: var(--slate-12);
    --popover: #ffffff;
    --popover-foreground: var(--slate-12);
    --primary: var(--blue-9);
    --primary-foreground: #ffffff;
    --secondary: var(--slate-3);
    --secondary-foreground: var(--slate-12);
    --muted: var(--slate-3);
    --muted-foreground: var(--slate-11);
    --accent: var(--blue-9);
    --accent-foreground: #ffffff;
    --border: var(--slate-6);
    --input: var(--slate-6);
    --ring: var(--blue-9);
  }

  :root.dark,
  :root.dark-theme {
    /* Use Radix dark slate colors for neutrals */
    --color-neutral-1: var(--slate-dark-1, #111113);
    --color-neutral-2: var(--slate-dark-2, #18191b);
    --color-neutral-3: var(--slate-dark-3, #212225);
    --color-neutral-4: var(--slate-dark-4, #272a2d);
    --color-neutral-5: var(--slate-dark-5, #2e3135);
    --color-neutral-6: var(--slate-dark-6, #363a3f);
    --color-neutral-7: var(--slate-dark-7, #43484e);
    --color-neutral-8: var(--slate-dark-8, #5a6169);
    --color-neutral-9: var(--slate-dark-9, #696e77);
    --color-neutral-10: var(--slate-dark-10, #777b84);
    --color-neutral-11: var(--slate-dark-11, #b0b4ba);
    --color-neutral-12: var(--slate-dark-12, #edeef0);
    --color-neutral-contrast: var(--slate-dark-contrast, #FFFFFF);

    /* Use Radix dark blue colors for accents */
    --color-accent-1: var(--blue-dark-1, #0d1520);
    --color-accent-2: var(--blue-dark-2, #111927);
    --color-accent-3: var(--blue-dark-3, #0d2847);
    --color-accent-4: var(--blue-dark-4, #003362);
    --color-accent-5: var(--blue-dark-5, #004074);
    --color-accent-6: var(--blue-dark-6, #104d87);
    --color-accent-7: var(--blue-dark-7, #205d9e);
    --color-accent-8: var(--blue-dark-8, #2870bd);
    --color-accent-9: var(--blue-dark-9, #0090ff);
    --color-accent-10: var(--blue-dark-10, #3b9eff);
    --color-accent-11: var(--blue-dark-11, #70b8ff);
    --color-accent-12: var(--blue-dark-12, #c2e6ff);
    --color-accent-contrast: var(--blue-dark-contrast, #FFFFFF);

    /* Use Radix dark violet colors for secondary accents */
    --color-accent-secondary-1: var(--violet-dark-1, #14121f);
    --color-accent-secondary-2: var(--violet-dark-2, #1b1525);
    --color-accent-secondary-3: var(--violet-dark-3, #291f43);
    --color-accent-secondary-4: var(--violet-dark-4, #33255b);
    --color-accent-secondary-5: var(--violet-dark-5, #3c2e69);
    --color-accent-secondary-6: var(--violet-dark-6, #473876);
    --color-accent-secondary-7: var(--violet-dark-7, #56468b);
    --color-accent-secondary-8: var(--violet-dark-8, #6958ad);
    --color-accent-secondary-9: var(--violet-dark-9, #6e56cf);
    --color-accent-secondary-10: var(--violet-dark-10, #7d66d9);
    --color-accent-secondary-11: var(--violet-dark-11, #baa7ff);
    --color-accent-secondary-12: var(--violet-dark-12, #e2ddfe);
    --color-accent-secondary-contrast: var(--violet-dark-contrast, #FFFFFF);

    /* Dark theme specific background colors */
    --color-fg: var(--color-neutral-12);
    --color-fg-secondary: var(--color-neutral-11);
    --color-bg: var(--color-neutral-1);
    --color-bg-inset: #000000;
    --color-bg-overlay: var(--color-neutral-3);
    --color-focus-ring: var(--color-accent-9);

    /* shadcn/ui variables */
    --background: #111113;
    --foreground: #edeef0;
    --card: #212225;
    --card-foreground: #edeef0;
    --popover: #212225;
    --popover-foreground: #edeef0;
    --primary: #0090ff;
    --primary-foreground: #ffffff;
    --secondary: #272a2d;
    --secondary-foreground: #edeef0;
    --muted: #212225;
    --muted-foreground: #b0b4ba;
    --accent: #0090ff;
    --accent-foreground: #ffffff;
    --border: #363a3f;
    --input: #363a3f;
    --ring: #0090ff;
  }

  /* Solarized Light Theme */
  :root.solarized-light {
    /* Solarized Light base colors */
    --solarized-base03: #002b36;
    --solarized-base02: #073642;
    --solarized-base01: #586e75;
    --solarized-base00: #657b83;
    --solarized-base0: #839496;
    --solarized-base1: #93a1a1;
    --solarized-base2: #eee8d5;
    --solarized-base3: #fdf6e3;

    /* Solarized accent colors */
    --solarized-yellow: #b58900;
    --solarized-orange: #cb4b16;
    --solarized-red: #dc322f;
    --solarized-magenta: #d33682;
    --solarized-violet: #6c71c4;
    --solarized-blue: #268bd2;
    --solarized-cyan: #2aa198;
    --solarized-green: #859900;

    /* Apply Solarized Light mappings */
    --color-bg: var(--solarized-base3);
    --color-bg-inset: var(--solarized-base2);
    --color-bg-overlay: var(--solarized-base3);
    --color-fg: var(--solarized-base03);
    --color-fg-secondary: var(--solarized-base01);

    /* shadcn/ui variables */
    --background: var(--solarized-base3);
    --foreground: var(--solarized-base03);
    --card: var(--solarized-base2);
    --card-foreground: var(--solarized-base03);
    --popover: var(--solarized-base2);
    --popover-foreground: var(--solarized-base03);
    --primary: var(--solarized-blue);
    --primary-foreground: #fff;
    --secondary: #f5efe1;
    --secondary-foreground: var(--solarized-base03);
    --muted: var(--solarized-base2);
    --muted-foreground: var(--solarized-base01);
    --accent: var(--solarized-cyan);
    --accent-foreground: #fff;
    --border: #d8d2c4;
    --input: #d8d2c4;
    --ring: var(--solarized-blue);

    /* Neutral scale */
    --color-neutral-1: var(--solarized-base3);
    --color-neutral-2: var(--solarized-base2);
    --color-neutral-3: #f5efe1;
    --color-neutral-4: #ede7d9;
    --color-neutral-5: #e5dfd1;
    --color-neutral-6: #d8d2c4;
    --color-neutral-7: var(--solarized-base1);
    --color-neutral-8: var(--solarized-base0);
    --color-neutral-9: var(--solarized-base00);
    --color-neutral-10: var(--solarized-base01);
    --color-neutral-11: var(--solarized-base02);
    --color-neutral-12: var(--solarized-base03);
    --color-neutral-contrast: #fff;

    /* Accent colors (Blue) */
    --color-accent-1: #f4f9fd;
    --color-accent-2: #e5f1fa;
    --color-accent-3: #d0e6f7;
    --color-accent-4: #b8d9f3;
    --color-accent-5: #9dcbee;
    --color-accent-6: #7ebce8;
    --color-accent-7: #5aabe1;
    --color-accent-8: var(--solarized-blue);
    --color-accent-9: var(--solarized-blue);
    --color-accent-10: #2280c1;
    --color-accent-11: #1e75b0;
    --color-accent-12: #1a5a87;
    --color-accent-contrast: #fff;

    /* Secondary accent colors (Magenta) */
    --color-accent-secondary-1: #fdf5f9;
    --color-accent-secondary-2: #fae8f2;
    --color-accent-secondary-3: #f6d7e9;
    --color-accent-secondary-4: #f1c3de;
    --color-accent-secondary-5: #ebaccd;
    --color-accent-secondary-6: #e493bb;
    --color-accent-secondary-7: #dc76a6;
    --color-accent-secondary-8: var(--solarized-magenta);
    --color-accent-secondary-9: var(--solarized-magenta);
    --color-accent-secondary-10: #c23075;
    --color-accent-secondary-11: #b12b6b;
    --color-accent-secondary-12: #892253;
    --color-accent-secondary-contrast: #fff;

    --color-focus-ring: var(--solarized-blue);
  }

  /* Solarized Dark Theme */
  :root.solarized-dark {
    /* Solarized Dark base colors */
    --solarized-base03: #002b36;
    --solarized-base02: #073642;
    --solarized-base01: #586e75;
    --solarized-base00: #657b83;
    --solarized-base0: #839496;
    --solarized-base1: #93a1a1;
    --solarized-base2: #eee8d5;
    --solarized-base3: #fdf6e3;

    /* Solarized accent colors */
    --solarized-yellow: #b58900;
    --solarized-orange: #cb4b16;
    --solarized-red: #dc322f;
    --solarized-magenta: #d33682;
    --solarized-violet: #6c71c4;
    --solarized-blue: #268bd2;
    --solarized-cyan: #2aa198;
    --solarized-green: #859900;

    /* Apply Solarized Dark mappings (inverted) */
    --color-bg: var(--solarized-base03);
    --color-bg-inset: var(--solarized-base02);
    --color-bg-overlay: #053542;
    --color-fg: var(--solarized-base0);
    --color-fg-secondary: var(--solarized-base01);

    /* shadcn/ui variables */
    --background: var(--solarized-base03);
    --foreground: var(--solarized-base0);
    --card: var(--solarized-base02);
    --card-foreground: var(--solarized-base0);
    --popover: var(--solarized-base02);
    --popover-foreground: var(--solarized-base0);
    --primary: var(--solarized-blue);
    --primary-foreground: var(--solarized-base03);
    --secondary: #094451;
    --secondary-foreground: var(--solarized-base0);
    --muted: var(--solarized-base02);
    --muted-foreground: var(--solarized-base01);
    --accent: var(--solarized-cyan);
    --accent-foreground: var(--solarized-base03);
    --border: var(--solarized-base01);
    --input: var(--solarized-base01);
    --ring: var(--solarized-blue);

    /* Neutral scale */
    --color-neutral-1: var(--solarized-base03);
    --color-neutral-2: var(--solarized-base02);
    --color-neutral-3: #094451;
    --color-neutral-4: #0f5361;
    --color-neutral-5: #156271;
    --color-neutral-6: var(--solarized-base01);
    --color-neutral-7: var(--solarized-base00);
    --color-neutral-8: var(--solarized-base0);
    --color-neutral-9: var(--solarized-base1);
    --color-neutral-10: #9fb1b3;
    --color-neutral-11: var(--solarized-base2);
    --color-neutral-12: var(--solarized-base3);
    --color-neutral-contrast: var(--solarized-base03);

    /* Accent colors (Blue) */
    --color-accent-1: #0a2e3d;
    --color-accent-2: #0d3847;
    --color-accent-3: #114555;
    --color-accent-4: #155368;
    --color-accent-5: #1a647f;
    --color-accent-6: #1f7799;
    --color-accent-7: var(--solarized-blue);
    --color-accent-8: var(--solarized-blue);
    --color-accent-9: var(--solarized-blue);
    --color-accent-10: #4da4dc;
    --color-accent-11: #73b9e5;
    --color-accent-12: #a8d4f0;
    --color-accent-contrast: var(--solarized-base03);

    /* Secondary accent colors (Magenta) */
    --color-accent-secondary-1: #2e0a20;
    --color-accent-secondary-2: #3d0e2b;
    --color-accent-secondary-3: #501337;
    --color-accent-secondary-4: #671845;
    --color-accent-secondary-5: #821e56;
    --color-accent-secondary-6: #a12569;
    --color-accent-secondary-7: #c52d7e;
    --color-accent-secondary-8: var(--solarized-magenta);
    --color-accent-secondary-9: var(--solarized-magenta);
    --color-accent-secondary-10: #dc5b9b;
    --color-accent-secondary-11: #e580b3;
    --color-accent-secondary-12: #f0b3d4;
    --color-accent-secondary-contrast: var(--solarized-base03);

    --color-focus-ring: var(--solarized-blue);
  }

  /* GitHub Light Theme */
  :root.github-light {
    /* GitHub Light colors */
    --github-canvas-default: #ffffff;
    --github-canvas-subtle: #f6f8fa;
    --github-fg-default: #24292f;
    --github-fg-muted: #57606a;
    --github-accent-fg: #0969da;
    --github-accent-emphasis: #0969da;
    --github-success-fg: #1a7f37;
    --github-danger-fg: #da3633;
    --github-border-default: #d0d7de;

    /* Apply mappings */
    --color-bg: var(--github-canvas-default);
    --color-bg-inset: var(--github-canvas-subtle);
    --color-bg-overlay: var(--github-canvas-default);
    --color-fg: var(--github-fg-default);
    --color-fg-secondary: var(--github-fg-muted);

    /* shadcn/ui variables */
    --background: var(--github-canvas-default);
    --foreground: var(--github-fg-default);
    --card: var(--github-canvas-subtle);
    --card-foreground: var(--github-fg-default);
    --popover: var(--github-canvas-subtle);
    --popover-foreground: var(--github-fg-default);
    --primary: var(--github-accent-emphasis);
    --primary-foreground: #fff;
    --secondary: #eaeef2;
    --secondary-foreground: var(--github-fg-default);
    --muted: var(--github-canvas-subtle);
    --muted-foreground: var(--github-fg-muted);
    --accent: var(--github-accent-emphasis);
    --accent-foreground: #fff;
    --border: var(--github-border-default);
    --input: var(--github-border-default);
    --ring: var(--github-accent-emphasis);

    /* Neutral scale */
    --color-neutral-1: #ffffff;
    --color-neutral-2: #f6f8fa;
    --color-neutral-3: #eaeef2;
    --color-neutral-4: #d0d7de;
    --color-neutral-5: #afb8c1;
    --color-neutral-6: #8c959f;
    --color-neutral-7: #6e7781;
    --color-neutral-8: #57606a;
    --color-neutral-9: #424a53;
    --color-neutral-10: #32383f;
    --color-neutral-11: #24292f;
    --color-neutral-12: #1c2128;
    --color-neutral-contrast: #fff;

    /* Accent colors (Blue) */
    --color-accent-9: var(--github-accent-emphasis);
    --color-accent-11: var(--github-accent-fg);
    --color-accent-contrast: #fff;

    /* Secondary accent colors */
    --color-accent-secondary-9: #8250df;
    --color-accent-secondary-11: #8250df;
    --color-accent-secondary-contrast: #fff;

    --color-focus-ring: var(--github-accent-emphasis);
  }

  /* GitHub Dark Theme */
  :root.github-dark {
    /* GitHub Dark colors */
    --github-canvas-default: #0d1117;
    --github-canvas-subtle: #161b22;
    --github-fg-default: #c9d1d9;
    --github-fg-muted: #8b949e;
    --github-accent-fg: #58a6ff;
    --github-accent-emphasis: #1f6feb;
    --github-success-fg: #3fb950;
    --github-danger-fg: #f85149;
    --github-border-default: #30363d;

    /* Apply mappings */
    --color-bg: var(--github-canvas-default);
    --color-bg-inset: var(--github-canvas-subtle);
    --color-bg-overlay: var(--github-canvas-subtle);
    --color-fg: var(--github-fg-default);
    --color-fg-secondary: var(--github-fg-muted);

    /* shadcn/ui variables */
    --background: var(--github-canvas-default);
    --foreground: var(--github-fg-default);
    --card: var(--github-canvas-subtle);
    --card-foreground: var(--github-fg-default);
    --popover: var(--github-canvas-subtle);
    --popover-foreground: var(--github-fg-default);
    --primary: var(--github-accent-fg);
    --primary-foreground: #0d1117;
    --secondary: #21262d;
    --secondary-foreground: var(--github-fg-default);
    --muted: var(--github-canvas-subtle);
    --muted-foreground: var(--github-fg-muted);
    --accent: var(--github-accent-fg);
    --accent-foreground: #0d1117;
    --border: var(--github-border-default);
    --input: var(--github-border-default);
    --ring: var(--github-accent-emphasis);

    /* Neutral scale */
    --color-neutral-1: #0d1117;
    --color-neutral-2: #161b22;
    --color-neutral-3: #21262d;
    --color-neutral-4: #30363d;
    --color-neutral-5: #484f58;
    --color-neutral-6: #6e7681;
    --color-neutral-7: #8b949e;
    --color-neutral-8: #b1bac4;
    --color-neutral-9: #c9d1d9;
    --color-neutral-10: #d0d7de;
    --color-neutral-11: #e6edf3;
    --color-neutral-12: #f0f6fc;
    --color-neutral-contrast: #0d1117;

    /* Accent colors (Blue) */
    --color-accent-9: var(--github-accent-emphasis);
    --color-accent-11: var(--github-accent-fg);
    --color-accent-contrast: #0d1117;

    /* Secondary accent colors */
    --color-accent-secondary-9: #a371f7;
    --color-accent-secondary-11: #d2a8ff;
    --color-accent-secondary-contrast: #0d1117;

    --color-focus-ring: var(--github-accent-emphasis);
  }

  /* Windows 11 Light Theme */
  :root.windows11-light {
    /* Windows 11 Light colors */
    --win11-background: #f3f3f3;
    --win11-card: #ffffff;
    --win11-fg: #1c1c1c;
    --win11-fg-muted: #605e5c;
    --win11-accent: #0067c0;
    --win11-border: #e1dfdd;

    /* Apply mappings */
    --color-bg: var(--win11-background);
    --color-bg-inset: #e8e8e8;
    --color-bg-overlay: var(--win11-card);
    --color-fg: var(--win11-fg);
    --color-fg-secondary: var(--win11-fg-muted);

    /* shadcn/ui variables */
    --background: var(--win11-background);
    --foreground: var(--win11-fg);
    --card: var(--win11-card);
    --card-foreground: var(--win11-fg);
    --popover: var(--win11-card);
    --popover-foreground: var(--win11-fg);
    --primary: var(--win11-accent);
    --primary-foreground: #fff;
    --secondary: #edebe9;
    --secondary-foreground: var(--win11-fg);
    --muted: #f3f2f1;
    --muted-foreground: var(--win11-fg-muted);
    --accent: var(--win11-accent);
    --accent-foreground: #fff;
    --border: var(--win11-border);
    --input: var(--win11-border);
    --ring: var(--win11-accent);

    /* Neutral scale */
    --color-neutral-1: #ffffff;
    --color-neutral-2: #faf9f8;
    --color-neutral-3: #f3f2f1;
    --color-neutral-4: #edebe9;
    --color-neutral-5: #e1dfdd;
    --color-neutral-6: #d2d0ce;
    --color-neutral-7: #c8c6c4;
    --color-neutral-8: #a19f9d;
    --color-neutral-9: #605e5c;
    --color-neutral-10: #484644;
    --color-neutral-11: #323130;
    --color-neutral-12: #201f1e;
    --color-neutral-contrast: #fff;

    /* Accent colors (Windows Blue) */
    --color-accent-9: var(--win11-accent);
    --color-accent-11: var(--win11-accent);
    --color-accent-contrast: #fff;

    /* Secondary accent colors */
    --color-accent-secondary-9: #0078d4;
    --color-accent-secondary-11: #106ebe;
    --color-accent-secondary-contrast: #fff;

    --color-focus-ring: var(--win11-accent);
  }

  /* Windows 11 Dark Theme */
  :root.windows11-dark {
    /* Windows 11 Dark colors */
    --win11-background: #202020;
    --win11-card: #2b2b2b;
    --win11-fg: #ffffff;
    --win11-fg-muted: #8a8a8a;
    --win11-accent: #60cdff;
    --win11-border: #3b3b3b;

    /* Apply mappings */
    --color-bg: var(--win11-background);
    --color-bg-inset: #1a1a1a;
    --color-bg-overlay: var(--win11-card);
    --color-fg: var(--win11-fg);
    --color-fg-secondary: var(--win11-fg-muted);

    /* shadcn/ui variables */
    --background: var(--win11-background);
    --foreground: var(--win11-fg);
    --card: var(--win11-card);
    --card-foreground: var(--win11-fg);
    --popover: var(--win11-card);
    --popover-foreground: var(--win11-fg);
    --primary: var(--win11-accent);
    --primary-foreground: #000;
    --secondary: #3b3b3b;
    --secondary-foreground: var(--win11-fg);
    --muted: #2b2b2b;
    --muted-foreground: var(--win11-fg-muted);
    --accent: var(--win11-accent);
    --accent-foreground: #000;
    --border: var(--win11-border);
    --input: var(--win11-border);
    --ring: var(--win11-accent);

    /* Neutral scale */
    --color-neutral-1: #1a1a1a;
    --color-neutral-2: #202020;
    --color-neutral-3: #2b2b2b;
    --color-neutral-4: #3b3b3b;
    --color-neutral-5: #4a4a4a;
    --color-neutral-6: #6a6a6a;
    --color-neutral-7: #8a8a8a;
    --color-neutral-8: #a0a0a0;
    --color-neutral-9: #c8c8c8;
    --color-neutral-10: #d0d0d0;
    --color-neutral-11: #e0e0e0;
    --color-neutral-12: #f0f0f0;
    --color-neutral-contrast: #000;

    /* Accent colors (Windows Blue) */
    --color-accent-9: var(--win11-accent);
    --color-accent-11: var(--win11-accent);
    --color-accent-contrast: #000;

    /* Secondary accent colors */
    --color-accent-secondary-9: #60cdff;
    --color-accent-secondary-11: #4db8e8;
    --color-accent-secondary-contrast: #000;

    --color-focus-ring: var(--win11-accent);
  }

  /* Seamless View Light Theme */
  :root.seamless-light {
    /* Seamless Light base colors - from original theme */
    --seamless-base-00: hsl(40, 90%, 80%);
    --seamless-base-10: hsl(36, 85%, 76%);
    --seamless-base-20: hsl(35, 80%, 72%);
    --seamless-base-25: hsl(32, 80%, 70%);
    --seamless-base-30: hsl(32, 70%, 60%);
    --seamless-base-35: hsl(30, 60%, 55%);
    --seamless-base-40: hsl(30, 40%, 50%);
    --seamless-base-50: hsl(20, 35%, 45%);
    --seamless-base-70: hsl(20, 30%, 35%);
    --seamless-base-100: hsl(10, 20%, 15%);
    --seamless-accent: hsl(180, 100%, 25%);

    /* Apply mappings */
    --color-bg: var(--seamless-base-10);
    --color-bg-inset: var(--seamless-base-00);
    --color-bg-overlay: var(--seamless-base-20);
    --color-fg: var(--seamless-base-100);
    --color-fg-secondary: var(--seamless-base-70);

    /* shadcn/ui variables - CRITICAL for main app styling */
    --background: var(--seamless-base-10);
    --foreground: var(--seamless-base-100);
    --card: var(--seamless-base-00);
    --card-foreground: var(--seamless-base-100);
    --popover: var(--seamless-base-00);
    --popover-foreground: var(--seamless-base-100);
    --primary: var(--seamless-accent);
    --primary-foreground: #fff;
    --secondary: var(--seamless-base-25);
    --secondary-foreground: var(--seamless-base-100);
    --muted: var(--seamless-base-20);
    --muted-foreground: var(--seamless-base-70);
    --accent: var(--seamless-accent);
    --accent-foreground: #fff;
    --border: var(--seamless-base-30);
    --input: var(--seamless-base-30);
    --ring: var(--seamless-accent);

    /* Neutral scale - using Seamless warm beige palette */
    --color-neutral-1: var(--seamless-base-00);
    --color-neutral-2: var(--seamless-base-10);
    --color-neutral-3: var(--seamless-base-20);
    --color-neutral-4: var(--seamless-base-25);
    --color-neutral-5: var(--seamless-base-30);
    --color-neutral-6: var(--seamless-base-35);
    --color-neutral-7: var(--seamless-base-40);
    --color-neutral-8: var(--seamless-base-50);
    --color-neutral-9: hsl(20, 32%, 40%);
    --color-neutral-10: var(--seamless-base-70);
    --color-neutral-11: hsl(15, 25%, 25%);
    --color-neutral-12: var(--seamless-base-100);
    --color-neutral-contrast: #fff;

    /* Accent colors (Teal/Cyan) */
    --color-accent-9: var(--seamless-accent);
    --color-accent-11: hsl(180, 100%, 18%);
    --color-accent-contrast: #fff;

    /* Secondary accent colors (Purple) */
    --color-accent-secondary-9: hsl(285, 65%, 50%);
    --color-accent-secondary-11: hsl(285, 65%, 40%);
    --color-accent-secondary-contrast: #fff;

    --color-focus-ring: var(--seamless-accent);
  }

  /* Seamless View Dark Theme */
  :root.seamless-dark {
    /* Seamless Dark base colors - darker warm tones */
    --seamless-base-00: hsl(32, 80%, 70%);
    --seamless-base-10: hsl(32, 75%, 65%);
    --seamless-base-20: hsl(32, 70%, 60%);
    --seamless-base-25: hsl(30, 65%, 55%);
    --seamless-base-30: hsl(30, 60%, 50%);
    --seamless-base-35: hsl(28, 55%, 45%);
    --seamless-base-40: hsl(26, 50%, 40%);
    --seamless-base-50: hsl(24, 45%, 35%);
    --seamless-base-70: hsl(20, 40%, 28%);
    --seamless-base-90: hsl(15, 30%, 20%);
    --seamless-base-100: hsl(10, 25%, 12%);
    --seamless-fg: hsl(40, 90%, 80%);
    --seamless-accent: hsl(85, 45%, 40%);

    /* Apply mappings */
    --color-bg: var(--seamless-base-100);
    --color-bg-inset: var(--seamless-base-90);
    --color-bg-overlay: var(--seamless-base-90);
    --color-fg: var(--seamless-fg);
    --color-fg-secondary: var(--seamless-base-00);

    /* shadcn/ui variables - CRITICAL for main app styling */
    --background: var(--seamless-base-100);
    --foreground: var(--seamless-fg);
    --card: var(--seamless-base-90);
    --card-foreground: var(--seamless-fg);
    --popover: var(--seamless-base-90);
    --popover-foreground: var(--seamless-fg);
    --primary: var(--seamless-accent);
    --primary-foreground: #000;
    --secondary: var(--seamless-base-70);
    --secondary-foreground: var(--seamless-fg);
    --muted: var(--seamless-base-70);
    --muted-foreground: var(--seamless-base-00);
    --accent: var(--seamless-accent);
    --accent-foreground: #000;
    --border: var(--seamless-base-50);
    --input: var(--seamless-base-50);
    --ring: var(--seamless-accent);

    /* Neutral scale - darker warm palette */
    --color-neutral-1: var(--seamless-base-100);
    --color-neutral-2: var(--seamless-base-90);
    --color-neutral-3: var(--seamless-base-70);
    --color-neutral-4: var(--seamless-base-50);
    --color-neutral-5: var(--seamless-base-40);
    --color-neutral-6: var(--seamless-base-35);
    --color-neutral-7: var(--seamless-base-30);
    --color-neutral-8: var(--seamless-base-25);
    --color-neutral-9: var(--seamless-base-20);
    --color-neutral-10: var(--seamless-base-10);
    --color-neutral-11: var(--seamless-base-00);
    --color-neutral-12: var(--seamless-fg);
    --color-neutral-contrast: #000;

    /* Accent colors (Yellowish-green) */
    --color-accent-9: var(--seamless-accent);
    --color-accent-11: hsl(85, 45%, 62%);
    --color-accent-contrast: #000;

    /* Secondary accent colors (Cyan) */
    --color-accent-secondary-9: hsl(187, 47%, 55%);
    --color-accent-secondary-11: hsl(187, 47%, 70%);
    --color-accent-secondary-contrast: #000;

    --color-focus-ring: var(--seamless-accent);
  }
}