html,
html[data-theme-preset],
:root {
  --background: #f2f4f9 !important;
  --foreground: #17203a !important;
  --card: #ffffff !important;
  --card-foreground: #17203a !important;
  --popover: #ffffff !important;
  --popover-foreground: #17203a !important;
  --primary: #4f46e5 !important;
  --primary-foreground: #ffffff !important;
  --secondary: #eef1f7 !important;
  --secondary-foreground: #17203a !important;
  --muted: #eef1f7 !important;
  --muted-foreground: #5c6b85 !important;
  --accent: #eef1f7 !important;
  --accent-foreground: #4f46e5 !important;
  --destructive: #e11d48 !important;
  --destructive-foreground: #ffffff !important;
  --success: #0d9668 !important;
  --success-foreground: #ffffff !important;
  --warning: #d4af37 !important;
  --warning-foreground: #17203a !important;
  --info: #0891b2 !important;
  --info-foreground: #ffffff !important;
  --neutral: #8b97ad !important;
  --neutral-foreground: #17203a !important;
  --border: #e3e8f0 !important;
  --input: #e3e8f0 !important;
  --ring: #4f46e5 !important;
  --chart-1: #4f46e5 !important;
  --chart-2: #0891b2 !important;
  --chart-3: #818cf8 !important;
  --chart-4: #22d3ee !important;
  --chart-5: #0d9668 !important;
  --overview-accent-1: #4f46e5 !important;
  --overview-accent-2: #0891b2 !important;
  --overview-accent-3: #818cf8 !important;
  --sidebar: #f7f8fc !important;
  --sidebar-foreground: #17203a !important;
  --sidebar-primary: #4f46e5 !important;
  --sidebar-primary-foreground: #ffffff !important;
  --sidebar-accent: #eef1f7 !important;
  --sidebar-accent-foreground: #4f46e5 !important;
  --sidebar-border: #e3e8f0 !important;
  --sidebar-ring: #4f46e5 !important;
  --skeleton-base: #eef1f7 !important;
  --skeleton-highlight: #ffffff !important;
  --radius: 1rem !important;
  --font-ui-sans: "Segoe UI Variable Text", Inter, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei", sans-serif !important;
  --font-body: var(--font-ui-sans) !important;
  --grok-glow-1: rgba(99, 102, 241, 0.10);
  --grok-glow-2: rgba(8, 145, 178, 0.08);
  --grok-shadow: 0 1px 2px rgba(23, 32, 58, 0.05), 0 8px 24px -12px rgba(23, 32, 58, 0.12);
}

html.dark,
html.dark[data-theme-preset],
.dark,
.dark[data-theme-preset] {
  color-scheme: dark !important;
  --background: #0a0e18 !important;
  --foreground: #e7ecf6 !important;
  --card: #121826 !important;
  --card-foreground: #e7ecf6 !important;
  --popover: #161d2e !important;
  --popover-foreground: #e7ecf6 !important;
  --primary: #818cf8 !important;
  --primary-foreground: #0a0e18 !important;
  --secondary: rgba(255, 255, 255, 0.05) !important;
  --secondary-foreground: #e7ecf6 !important;
  --muted: #161d2e !important;
  --muted-foreground: #9aa8c0 !important;
  --accent: rgba(129, 140, 248, 0.12) !important;
  --accent-foreground: #c7d2fe !important;
  --destructive: #fb7185 !important;
  --destructive-foreground: #0a0e18 !important;
  --success: #34d399 !important;
  --success-foreground: #0a0e18 !important;
  --warning: #fbd38d !important;
  --warning-foreground: #0a0e18 !important;
  --info: #22d3ee !important;
  --info-foreground: #0a0e18 !important;
  --neutral: #66748d !important;
  --neutral-foreground: #e7ecf6 !important;
  --border: rgba(255, 255, 255, 0.085) !important;
  --input: rgba(255, 255, 255, 0.12) !important;
  --ring: #818cf8 !important;
  --chart-1: #818cf8 !important;
  --chart-2: #22d3ee !important;
  --chart-3: #a5b4fc !important;
  --chart-4: #67e8f9 !important;
  --chart-5: #34d399 !important;
  --overview-accent-1: #818cf8 !important;
  --overview-accent-2: #22d3ee !important;
  --overview-accent-3: #a5b4fc !important;
  --sidebar: #0c111c !important;
  --sidebar-foreground: #e7ecf6 !important;
  --sidebar-primary: #818cf8 !important;
  --sidebar-primary-foreground: #0a0e18 !important;
  --sidebar-accent: rgba(129, 140, 248, 0.12) !important;
  --sidebar-accent-foreground: #c7d2fe !important;
  --sidebar-border: rgba(255, 255, 255, 0.085) !important;
  --sidebar-ring: #818cf8 !important;
  --skeleton-base: #161d2e !important;
  --skeleton-highlight: #1e293b !important;
  --grok-glow-1: rgba(129, 140, 248, 0.12);
  --grok-glow-2: rgba(34, 211, 238, 0.07);
  --grok-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 12px 32px -16px rgba(0, 0, 0, 0.5);
}

html {
  font-family: var(--font-ui-sans) !important;
}

body {
  font-family: var(--font-ui-sans) !important;
  background-color: var(--background) !important;
  background-image:
    radial-gradient(900px 480px at 12% -8%, var(--grok-glow-1), transparent 60%),
    radial-gradient(800px 420px at 88% -6%, var(--grok-glow-2), transparent 55%) !important;
  background-attachment: fixed !important;
  color: var(--foreground) !important;
}

::selection {
  background: var(--primary);
  color: var(--primary-foreground);
}

[data-slot="card"],
[data-slot="popover"],
[data-slot="dialog"],
[data-slot="sheet"] {
  box-shadow: var(--grok-shadow);
}

[data-slot="sidebar"] {
  background: var(--sidebar) !important;
  border-color: var(--sidebar-border) !important;
}

header,
[data-slot="header"],
[data-sidebar="header"] {
  backdrop-filter: blur(16px) saturate(1.4);
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
}

[data-slot="button"][data-variant="default"],
button[class*="bg-primary"] {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--primary) 35%, transparent),
    0 8px 20px -10px color-mix(in srgb, var(--primary) 55%, transparent);
}

#grok-sinyalee-boot {
  position: absolute;
  width: 0;
  height: 0;
  opacity: 0;
  pointer-events: none;
}