/* Generated by scripts/sync-site.mjs from src/index.css. Do not edit here: change the app and re-run. */
:root {
  --radius: 0.75rem;
  --brand-purple-100: #eee8fa;
  --brand-purple-300: #c4b0f0;
  --brand-purple-400: #ae93e8;
  --brand-purple-500: #9b7bdc;
  --brand-purple-600: #7c5bc8;
  --brand-purple-700: #6a4bb0;
  --brand-purple-800: #4e3590;
  --brand-yellow-100: #fff3d1;
  --brand-yellow-300: #ffe08a;
  --brand-yellow-500: #ffc94d;
  --brand-yellow-600: #f2b02e;
  --brand-yellow-800: #8a5e00;
  --brand-ink: #2b1b2c;
  --brand-snow: #f3eef9;
  --brand-night: #16121f;
  --brand-cream: #fbf8f2;
  --background: #fbf8f2;
  --foreground: #2b1b2c;
  --card: #ffffff;
  --card-foreground: #2b1b2c;
  --popover: #ffffff;
  --popover-foreground: #2b1b2c;
  --primary: #7c5bc8;
  --primary-foreground: #ffffff;
  --secondary: #f3eee4;
  --secondary-foreground: #2b1b2c;
  --muted: #f3eee4;
  --muted-foreground: #6b5f70;
  --accent: #eee8fa;
  --accent-foreground: #4e3590;
  --tile: #eee8fa;
  --tile-foreground: #6a4bb0;
  --link: #6a4bb0;
  --spark: #ffc94d;
  --spark-foreground: #2b1b2c;
  --destructive: #e5484d;
  --success: #3faa6e;
  --border: #e6dfd3;
  --input: #d6ccbe; /* a step darker than --border: switches and inputs stay visible on Cream */
  --ring: #7c5bc8;
  --sidebar: #ffffff;
  --sidebar-foreground: #2b1b2c;
  --sidebar-primary: #7c5bc8;
  --sidebar-primary-foreground: #ffffff;
  --sidebar-accent: #eee8fa;
  --sidebar-accent-foreground: #2b1b2c;
  --sidebar-border: #e6dfd3;
  --sidebar-ring: #7c5bc8;
  --chart-1: #7c5bc8;
  --chart-2: #6b5f70;
  --chart-3: #3faa6e;
  --chart-4: #e5484d;
  --chart-5: #ffc94d;
  --edge: color-mix(in oklch, var(--border) 78%, transparent);
  --elev-xs: 0 1px 2px rgb(22 18 31 / 0.06);
  --elev-pop: 0 1px 3px rgb(22 18 31 / 0.07), 0 14px 36px -12px rgb(22 18 31 / 0.22);
  --elev-dialog: 0 2px 6px rgb(22 18 31 / 0.07), 0 32px 72px -24px rgb(22 18 31 / 0.38);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --background: #16121f;
    --foreground: #f3eef9;
    --card: #211a2e;
    --card-foreground: #f3eef9;
    --popover: #2b2238;
    --popover-foreground: #f3eef9;
    --primary: #9b7bdc;
    --primary-foreground: #2b1b2c;
    --secondary: #2b2238;
    --secondary-foreground: #f3eef9;
    --muted: #2b2238;
    --muted-foreground: #b3a8c0;
    --accent: #352a4d;
    --accent-foreground: #c4b0f0;
    --tile: #352a4d;
    --tile-foreground: #c4b0f0;
    --link: #c4b0f0;
    --spark: #ffc94d;
    --spark-foreground: #2b1b2c;
    --destructive: #e5484d;
    --success: #3faa6e;
    --border: #3a2f4a;
    --input: #3a2f4a;
    --ring: #9b7bdc;
    --sidebar: #211a2e;
    --sidebar-foreground: #f3eef9;
    --sidebar-primary: #9b7bdc;
    --sidebar-primary-foreground: #2b1b2c;
    --sidebar-accent: #2b2238;
    --sidebar-accent-foreground: #f3eef9;
    --sidebar-border: #3a2f4a;
    --sidebar-ring: #9b7bdc;
    --chart-1: #9b7bdc;
    --chart-2: #b3a8c0;
    --chart-3: #3faa6e;
    --chart-4: #e5484d;
    --chart-5: #ffc94d;
    --edge: color-mix(in oklch, var(--border) 80%, transparent);
    --elev-xs: 0 1px 2px rgb(0 0 0 / 0.28);
    --elev-pop: inset 0 1px 0 rgb(255 255 255 / 0.05), 0 1px 3px rgb(0 0 0 / 0.4), 0 18px 40px -12px rgb(0 0 0 / 0.66);
    --elev-dialog: inset 0 1px 0 rgb(255 255 255 / 0.06), 0 2px 8px rgb(0 0 0 / 0.4), 0 40px 90px -24px rgb(0 0 0 / 0.78);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --background: #16121f;
  --foreground: #f3eef9;
  --card: #211a2e;
  --card-foreground: #f3eef9;
  --popover: #2b2238;
  --popover-foreground: #f3eef9;
  --primary: #9b7bdc;
  --primary-foreground: #2b1b2c;
  --secondary: #2b2238;
  --secondary-foreground: #f3eef9;
  --muted: #2b2238;
  --muted-foreground: #b3a8c0;
  --accent: #352a4d;
  --accent-foreground: #c4b0f0;
  --tile: #352a4d;
  --tile-foreground: #c4b0f0;
  --link: #c4b0f0;
  --spark: #ffc94d;
  --spark-foreground: #2b1b2c;
  --destructive: #e5484d;
  --success: #3faa6e;
  --border: #3a2f4a;
  --input: #3a2f4a;
  --ring: #9b7bdc;
  --sidebar: #211a2e;
  --sidebar-foreground: #f3eef9;
  --sidebar-primary: #9b7bdc;
  --sidebar-primary-foreground: #2b1b2c;
  --sidebar-accent: #2b2238;
  --sidebar-accent-foreground: #f3eef9;
  --sidebar-border: #3a2f4a;
  --sidebar-ring: #9b7bdc;
  --chart-1: #9b7bdc;
  --chart-2: #b3a8c0;
  --chart-3: #3faa6e;
  --chart-4: #e5484d;
  --chart-5: #ffc94d;
  --edge: color-mix(in oklch, var(--border) 80%, transparent);
  --elev-xs: 0 1px 2px rgb(0 0 0 / 0.28);
  --elev-pop: inset 0 1px 0 rgb(255 255 255 / 0.05), 0 1px 3px rgb(0 0 0 / 0.4), 0 18px 40px -12px rgb(0 0 0 / 0.66);
  --elev-dialog: inset 0 1px 0 rgb(255 255 255 / 0.06), 0 2px 8px rgb(0 0 0 / 0.4), 0 40px 90px -24px rgb(0 0 0 / 0.78);
  color-scheme: dark;
}