:root { --background: oklch(1 0 0); --foreground: oklch(0.18 0 0); --card: oklch(1 0 0); --card-foreground: oklch(0.18 0 0); --popover: oklch(1 0 0); --popover-foreground: oklch(0.18 0 0); --primary: oklch(0.52 0 0); --primary-foreground: oklch(0.99 0.005 0); --secondary: oklch(0.96 0 0); --secondary-foreground: oklch(0.18 0 0); --muted: oklch(0.96 0 0); --muted-foreground: oklch(0.54 0 0); --accent: oklch(0.96 0 0); --accent-foreground: oklch(0.18 0 0); --border: oklch(0.89 0 0); --input: oklch(0.89 0 0); --ring: oklch(0.52 0 0); --chart-1: oklch(0.85 0 0); --chart-2: oklch(0.73 0 0); --chart-3: oklch(0.61 0 0); --chart-4: oklch(0.49 0 0); --chart-5: oklch(0.37 0 0); --radius: 0.625rem; --sidebar: oklch(1 0 0); --sidebar-foreground: oklch(0.18 0 0); --sidebar-primary: oklch(0.52 0 0); --sidebar-primary-foreground: oklch(0.99 0.005 0); --sidebar-accent: oklch(0.96 0 0); --sidebar-accent-foreground: oklch(0.18 0 0); --sidebar-border: oklch(0.89 0 0); --sidebar-ring: oklch(0.52 0 0); --preset-body-font: var(--font-preset-inter), ui-sans-serif, system-ui, sans-serif; --preset-heading-font: var(--font-preset-inter), ui-sans-serif, system-ui, sans-serif; --preset-control-height: 2.25rem; --preset-shadow: 0 1px 2px oklch(0 0 0 / 8%); --preset-icon-library: "lucide"; }
:root[data-mode="dark"] { --background: oklch(0.15 0 0); --foreground: oklch(0.985 0 0); --card: oklch(0.22 0 0); --card-foreground: oklch(0.985 0 0); --popover: oklch(0.22 0 0); --popover-foreground: oklch(0.985 0 0); --primary: oklch(0.67 0 0); --primary-foreground: oklch(0.14 0.02 0); --secondary: oklch(0.29 0 0); --secondary-foreground: oklch(0.985 0 0); --muted: oklch(0.29 0 0); --muted-foreground: oklch(0.72 0 0); --accent: oklch(0.29 0 0); --accent-foreground: oklch(0.985 0 0); --border: oklch(0.36 0 0); --input: oklch(0.4 0 0); --ring: oklch(0.67 0 0); --chart-1: oklch(0.85 0 0); --chart-2: oklch(0.73 0 0); --chart-3: oklch(0.61 0 0); --chart-4: oklch(0.49 0 0); --chart-5: oklch(0.37 0 0); --radius: 0.625rem; --sidebar: oklch(0.22 0 0); --sidebar-foreground: oklch(0.985 0 0); --sidebar-primary: oklch(0.67 0 0); --sidebar-primary-foreground: oklch(0.14 0.02 0); --sidebar-accent: oklch(0.29 0 0); --sidebar-accent-foreground: oklch(0.985 0 0); --sidebar-border: oklch(0.36 0 0); --sidebar-ring: oklch(0.67 0 0); --preset-body-font: var(--font-preset-inter), ui-sans-serif, system-ui, sans-serif; --preset-heading-font: var(--font-preset-inter), ui-sans-serif, system-ui, sans-serif; --preset-control-height: 2.25rem; --preset-shadow: 0 1px 2px oklch(0 0 0 / 8%); --preset-icon-library: "lucide"; }
@media (prefers-color-scheme: dark) { :root[data-mode="system"] { --background: oklch(0.15 0 0); --foreground: oklch(0.985 0 0); --card: oklch(0.22 0 0); --card-foreground: oklch(0.985 0 0); --popover: oklch(0.22 0 0); --popover-foreground: oklch(0.985 0 0); --primary: oklch(0.67 0 0); --primary-foreground: oklch(0.14 0.02 0); --secondary: oklch(0.29 0 0); --secondary-foreground: oklch(0.985 0 0); --muted: oklch(0.29 0 0); --muted-foreground: oklch(0.72 0 0); --accent: oklch(0.29 0 0); --accent-foreground: oklch(0.985 0 0); --border: oklch(0.36 0 0); --input: oklch(0.4 0 0); --ring: oklch(0.67 0 0); --chart-1: oklch(0.85 0 0); --chart-2: oklch(0.73 0 0); --chart-3: oklch(0.61 0 0); --chart-4: oklch(0.49 0 0); --chart-5: oklch(0.37 0 0); --radius: 0.625rem; --sidebar: oklch(0.22 0 0); --sidebar-foreground: oklch(0.985 0 0); --sidebar-primary: oklch(0.67 0 0); --sidebar-primary-foreground: oklch(0.14 0.02 0); --sidebar-accent: oklch(0.29 0 0); --sidebar-accent-foreground: oklch(0.985 0 0); --sidebar-border: oklch(0.36 0 0); --sidebar-ring: oklch(0.67 0 0); --preset-body-font: var(--font-preset-inter), ui-sans-serif, system-ui, sans-serif; --preset-heading-font: var(--font-preset-inter), ui-sans-serif, system-ui, sans-serif; --preset-control-height: 2.25rem; --preset-shadow: 0 1px 2px oklch(0 0 0 / 8%); --preset-icon-library: "lucide"; } }
:root { --background: #F5F5F2; --foreground: #111214; --card: #FFFFFF; --card-foreground: #111214; --popover: #FFFFFF; --popover-foreground: #111214; --primary: #2F4BE0; --primary-foreground: #FFFFFF; --secondary: #EBEAE5; --secondary-foreground: #111214; --muted: #EEEDE8; --muted-foreground: #5B5E64; --accent: #E7EAF8; --accent-foreground: #111214; --destructive: #C8352B; --border: #DDDCD5; --input: #CFCEC7; --ring: #2F4BE0; --chart-1: #2F4BE0; --chart-2: #9A6700; --chart-3: #17885F; --chart-4: #A83E8F; --chart-5: #6B7076; --sidebar: #F5F5F2; --sidebar-foreground: #111214; --sidebar-primary: #2F4BE0; --sidebar-primary-foreground: #FFFFFF; --sidebar-accent: #EBEAE5; --sidebar-accent-foreground: #111214; --sidebar-border: #DDDCD5; --sidebar-ring: #2F4BE0; --preset-body-font: 'IBM Plex Sans', ui-sans-serif, system-ui, sans-serif; --preset-heading-font: 'Bricolage Grotesque', ui-sans-serif, system-ui, sans-serif; --radius: 0.375rem; --preset-shadow: none; --preset-control-height: 2.75rem; --theme-space-section: 4.5rem; --theme-space-card: 1.5rem; --theme-space-gap: 1rem; --theme-page-width: 1200px; --theme-reading-width: 42rem; }
:root[data-mode="dark"] { --background: #0D0E10; --foreground: #ECEAE3; --card: #15171A; --card-foreground: #ECEAE3; --popover: #1B1D21; --popover-foreground: #ECEAE3; --primary: #8EA2FF; --primary-foreground: #0D0E10; --secondary: #1F2226; --secondary-foreground: #ECEAE3; --muted: #1A1C20; --muted-foreground: #9A9C9F; --accent: #22262E; --accent-foreground: #ECEAE3; --destructive: #F0645A; --border: #2A2D33; --input: #33373E; --ring: #8EA2FF; --chart-1: #8EA2FF; --chart-2: #F2B84B; --chart-3: #5FD3A6; --chart-4: #E58BD0; --chart-5: #9AA0A6; --sidebar: #0D0E10; --sidebar-foreground: #ECEAE3; --sidebar-primary: #8EA2FF; --sidebar-primary-foreground: #0D0E10; --sidebar-accent: #1F2226; --sidebar-accent-foreground: #ECEAE3; --sidebar-border: #2A2D33; --sidebar-ring: #8EA2FF; --preset-body-font: 'IBM Plex Sans', ui-sans-serif, system-ui, sans-serif; --preset-heading-font: 'Bricolage Grotesque', ui-sans-serif, system-ui, sans-serif; --radius: 0.375rem; --preset-shadow: none; --preset-control-height: 2.75rem; --theme-space-section: 4.5rem; --theme-space-card: 1.5rem; --theme-space-gap: 1rem; --theme-page-width: 1200px; --theme-reading-width: 42rem; }
@media (prefers-color-scheme: dark) { :root[data-mode="system"] { --background: #0D0E10; --foreground: #ECEAE3; --card: #15171A; --card-foreground: #ECEAE3; --popover: #1B1D21; --popover-foreground: #ECEAE3; --primary: #8EA2FF; --primary-foreground: #0D0E10; --secondary: #1F2226; --secondary-foreground: #ECEAE3; --muted: #1A1C20; --muted-foreground: #9A9C9F; --accent: #22262E; --accent-foreground: #ECEAE3; --destructive: #F0645A; --border: #2A2D33; --input: #33373E; --ring: #8EA2FF; --chart-1: #8EA2FF; --chart-2: #F2B84B; --chart-3: #5FD3A6; --chart-4: #E58BD0; --chart-5: #9AA0A6; --sidebar: #0D0E10; --sidebar-foreground: #ECEAE3; --sidebar-primary: #8EA2FF; --sidebar-primary-foreground: #0D0E10; --sidebar-accent: #1F2226; --sidebar-accent-foreground: #ECEAE3; --sidebar-border: #2A2D33; --sidebar-ring: #8EA2FF; --preset-body-font: 'IBM Plex Sans', ui-sans-serif, system-ui, sans-serif; --preset-heading-font: 'Bricolage Grotesque', ui-sans-serif, system-ui, sans-serif; --radius: 0.375rem; --preset-shadow: none; --preset-control-height: 2.75rem; --theme-space-section: 4.5rem; --theme-space-card: 1.5rem; --theme-space-gap: 1rem; --theme-page-width: 1200px; --theme-reading-width: 42rem; } }