/* Internal dark-mode study of the preserved Lemma reference.
   The layout and motion remain Lemma's; only the palette is mapped to Veyl. */

:root {
  --veyl-ground: #1b1b1b;
  --veyl-surface: #222222;
  --veyl-surface-raised: #292929;
  --veyl-ink: #ffffff;
  --veyl-ink-muted: rgba(255, 255, 255, 0.68);
  --veyl-ink-faint: rgba(255, 255, 255, 0.42);
  --veyl-rule: rgba(255, 255, 255, 0.14);

  --color-primary: var(--veyl-ink);
  --color-primary-foreground: var(--veyl-ground);
  --color-primary-medium: var(--veyl-ink);
  --color-secondary: var(--veyl-surface-raised);
  --color-secondary-foreground: var(--veyl-ink);
  --color-accent-light: var(--veyl-surface-raised);
  --color-border: var(--veyl-rule);
  --color-line: var(--veyl-rule);
  --color-gray: var(--veyl-ink-muted);
  --color-label: var(--veyl-ink-muted);
  --color-muted: var(--veyl-surface-raised);
  --color-muted-foreground: var(--veyl-ink-muted);
  --color-muted-background: var(--veyl-ground);
  --color-input: var(--veyl-surface-raised);
  --color-ring: var(--veyl-ink);
  --color-background: var(--veyl-ground);
  --color-foreground: var(--veyl-ink);
  --color-card: var(--veyl-surface);
  --color-card-foreground: var(--veyl-ink);
  --color-popover: var(--veyl-surface);
  --color-popover-foreground: var(--veyl-ink);
  --color-sidebar-foreground: var(--veyl-ink);
  --color-sidebar-primary: var(--veyl-surface-raised);
  --color-sidebar-primary-foreground: var(--veyl-ink);
  --color-sidebar-border: var(--veyl-rule);
  --color-sidebar-ring: var(--veyl-ink);
  --color-brand-purple: var(--veyl-ink);
  --color-brand-purple-deep: var(--veyl-ink);
  --color-brand-navy: var(--veyl-ink);
  --color-brand-navy-light: var(--veyl-ink);
}

html,
body {
  color-scheme: dark;
  background: var(--veyl-ground) !important;
  color: var(--veyl-ink) !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 1000;
  pointer-events: none;
  opacity: 0.025;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}

section,
footer,
header,
.bg-background,
.bg-muted-background {
  background-color: var(--veyl-ground) !important;
}

.bg-white,
.bg-card,
.bg-popover {
  background-color: var(--veyl-surface) !important;
}

.bg-brand-purple,
.bg-brand-purple-deep,
[class*="bg-[#755CFE]"],
[class*="bg-[#755cfe]"],
[class*="bg-[#1D1956]"],
[class*="bg-[#1d1956]"] {
  background-color: var(--veyl-ground) !important;
  border-color: var(--veyl-rule) !important;
}

.text-primary,
.text-foreground,
.text-card-foreground,
.text-popover-foreground,
.text-brand-purple,
.text-brand-purple-deep,
.text-brand-navy,
.text-brand-navy-light,
[class*="text-[#1D1956]"],
[class*="text-[#1d1956]"],
[class*="text-[#322C8A]"],
[class*="text-[#322c8a]"],
[class*="text-[#5D4EE7]"],
[class*="text-[#5d4ee7]"],
[class*="text-[#1d1c1d]"],
[class*="text-[#000]"],
[class*="text-black"] {
  color: var(--veyl-ink) !important;
}

[style*="color: rgb(117, 92, 254)"],
[style*="color: rgb(93, 78, 231)"] {
  color: var(--veyl-ink) !important;
  border-color: var(--veyl-rule) !important;
}

[style*="background: rgb(117, 92, 254)"],
[style*="background: rgb(93, 78, 231)"] {
  background: var(--veyl-ink) !important;
}

.lw-tip {
  color: var(--veyl-ink) !important;
  background: var(--veyl-surface) !important;
  border-color: var(--veyl-rule) !important;
}

.text-muted-foreground,
.text-primary\/80,
.text-primary\/75,
.text-primary\/65,
.text-primary\/60,
.text-primary\/50,
.text-primary\/40,
.text-primary\/25 {
  color: var(--veyl-ink-muted) !important;
}

.border-line,
.border-border,
.border-primary\/10,
.border-primary\/20,
.border-primary\/25,
.border-primary\/30 {
  border-color: var(--veyl-rule) !important;
}

input,
textarea,
select {
  color: var(--veyl-ink) !important;
  background: var(--veyl-surface) !important;
  border-color: var(--veyl-rule) !important;
}

input::placeholder,
textarea::placeholder {
  color: var(--veyl-ink-faint) !important;
}

/* Preserve button contrast without bringing the purple palette back. */
.bg-primary {
  background-color: var(--veyl-ink) !important;
}

.text-primary-foreground {
  color: var(--veyl-ground) !important;
}

[class*="bg-[#E8E8E8]"],
[class*="bg-[#e8e8e8]"] {
  background-color: var(--veyl-ink) !important;
}

[class*="bg-[#F2F2F2]"],
[class*="bg-[#f2f2f2]"] {
  background-color: var(--veyl-surface-raised) !important;
}

[class*="bg-[#E8E8E8]"][class*="text-primary"],
[class*="bg-[#e8e8e8]"][class*="text-primary"] {
  color: var(--veyl-ground) !important;
}

a.bg-primary,
button.bg-primary {
  color: var(--veyl-ground) !important;
}

/* The captured product visuals also carry Lemma's purple as literal values. */
[fill="#423C88"],
[fill="#755CFE"],
[fill="#755cfe"],
[fill="#1D1956"],
[fill="#1d1956"] {
  fill: var(--veyl-ink) !important;
}

[stroke="#423C88"],
[stroke="#755CFE"],
[stroke="#755cfe"],
[stroke="#1D1956"],
[stroke="#1d1956"] {
  stroke: var(--veyl-ink) !important;
}

img[src*="/logos/"] {
  filter: grayscale(1) brightness(0) invert(1);
  opacity: 0.72;
}

#integrations img {
  filter: grayscale(1) brightness(0) invert(1) !important;
}

/* Keep the shader motion, but remove the bright purple wash. */
[data-paper-shader] canvas,
#lemma-reference-hero canvas,
#cta canvas {
  filter: grayscale(1) brightness(0.42) contrast(1.12);
  opacity: 0.72;
}

::selection {
  color: var(--veyl-ground);
  background: var(--veyl-ink);
}

/* The capture included its inspection overlay; it is not part of the reference. */
[data-codex-agent-overlay-root],
.styles-module__toolbar___wNsdK {
  display: none !important;
}