/* Versioned final override: keeps legacy one-off utilities inside the blueprint system. */
:root,
.light,
.dark {
  --background: #1c1c1c !important;
  --foreground: #f8f8f2 !important;
  --card: #232323 !important;
  --card-foreground: #f8f8f2 !important;
  --popover: #232323 !important;
  --popover-foreground: #f8f8f2 !important;
  --primary: #facc15 !important;
  --primary-rgb: 250, 204, 21 !important;
  --primary-foreground: #000000 !important;
  --secondary: #303030 !important;
  --secondary-foreground: #f8f8f2 !important;
  --muted: #303030 !important;
  --muted-foreground: #c7c7bd !important;
  --accent: #facc15 !important;
  --accent-foreground: #000000 !important;
  --border: #000000 !important;
  --input: #000000 !important;
  --ring: #facc15 !important;
  --sidebar: #facc15 !important;
  --sidebar-foreground: #000000 !important;
  --sidebar-border: #000000 !important;
}

[data-accent="yellow"],
:root:not([data-accent]) {
  --primary: #facc15 !important;
  --primary-rgb: 250, 204, 21 !important;
  --primary-foreground: #000000 !important;
  --accent: #facc15 !important;
  --accent-foreground: #000000 !important;
  --ring: #facc15 !important;
  --sidebar: #facc15 !important;
  --sidebar-foreground: #000000 !important;
}

[data-accent="blue"] {
  --primary: #3b82f6 !important;
  --primary-rgb: 59, 130, 246 !important;
  --primary-foreground: #ffffff !important;
  --accent: #3b82f6 !important;
  --accent-foreground: #ffffff !important;
  --ring: #3b82f6 !important;
  --sidebar: #3b82f6 !important;
  --sidebar-foreground: #ffffff !important;
}

[data-accent="green"] {
  --primary: #22c55e !important;
  --primary-rgb: 34, 197, 94 !important;
  --primary-foreground: #000000 !important;
  --accent: #22c55e !important;
  --accent-foreground: #000000 !important;
  --ring: #22c55e !important;
  --sidebar: #22c55e !important;
  --sidebar-foreground: #000000 !important;
}

[data-accent="cyan"] {
  --primary: #06b6d4 !important;
  --primary-rgb: 6, 182, 212 !important;
  --primary-foreground: #000000 !important;
  --accent: #06b6d4 !important;
  --accent-foreground: #000000 !important;
  --ring: #06b6d4 !important;
  --sidebar: #06b6d4 !important;
  --sidebar-foreground: #000000 !important;
}

[data-accent="orange"] {
  --primary: #f97316 !important;
  --primary-rgb: 249, 115, 22 !important;
  --primary-foreground: #000000 !important;
  --accent: #f97316 !important;
  --accent-foreground: #000000 !important;
  --ring: #f97316 !important;
  --sidebar: #f97316 !important;
  --sidebar-foreground: #000000 !important;
}

[data-accent="red"] {
  --primary: #ef4444 !important;
  --primary-rgb: 239, 68, 68 !important;
  --primary-foreground: #ffffff !important;
  --accent: #ef4444 !important;
  --accent-foreground: #ffffff !important;
  --ring: #ef4444 !important;
  --sidebar: #ef4444 !important;
  --sidebar-foreground: #ffffff !important;
}

[data-accent="purple"] {
  --primary: #a855f7 !important;
  --primary-rgb: 168, 85, 247 !important;
  --primary-foreground: #ffffff !important;
  --accent: #a855f7 !important;
  --accent-foreground: #ffffff !important;
  --ring: #a855f7 !important;
  --sidebar: #a855f7 !important;
  --sidebar-foreground: #ffffff !important;
}

[data-accent="white"] {
  --primary: #e2e8f0 !important;
  --primary-rgb: 226, 232, 240 !important;
  --primary-foreground: #000000 !important;
  --accent: #e2e8f0 !important;
  --accent-foreground: #000000 !important;
  --ring: #e2e8f0 !important;
  --sidebar: #e2e8f0 !important;
  --sidebar-foreground: #000000 !important;
}

html,
body {
  background-color: var(--background) !important;
  background-image:
    linear-gradient(rgba(var(--primary-rgb, 250, 204, 21), 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(var(--primary-rgb, 250, 204, 21), 0.05) 1px, transparent 1px) !important;
  background-size: 20px 20px !important;
  color: #f8f8f2 !important;
  font-family: var(--font-jetbrains-mono), ui-monospace, monospace !important;
}

body h1,
body h2,
body h3,
body .font-display {
  font-family: var(--font-archivo-black), Impact, sans-serif !important;
  letter-spacing: -0.045em !important;
  text-transform: uppercase !important;
}

body [class*="rounded-"] {
  border-radius: 0 !important;
}

body [class~="bg-card"][class*="border"],
body [class*="bg-card/"][class*="border"] {
  border: 4px solid #000000 !important;
  box-shadow: 8px 8px 0 0 #000000 !important;
}

body [class*="border-border"],
body [class*="border-input"] {
  border-color: #000000 !important;
}

body input,
body select,
body textarea {
  border: 4px solid #000000 !important;
  border-radius: 0 !important;
  background: #1c1c1c !important;
  color: #f8f8f2 !important;
  box-shadow: 4px 4px 0 0 #000000 !important;
  font-family: var(--font-jetbrains-mono), ui-monospace, monospace !important;
}

body input::placeholder,
body textarea::placeholder {
  color: #c7c7bd !important;
}

body button,
body a[class*="bg-primary"] {
  border-radius: 0 !important;
  font-family: var(--font-jetbrains-mono), ui-monospace, monospace !important;
}

body a[class~="bg-card"] {
  transition: transform 300ms cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 300ms cubic-bezier(0.16, 1, 0.3, 1) !important;
}

body a[class~="bg-card"]:hover {
  transform: translateY(-4px) scale(1.02) !important;
}

body table thead {
  background: #000000 !important;
  color: #facc15 !important;
}

body table th {
  color: #facc15 !important;
  font-family: var(--font-jetbrains-mono), ui-monospace, monospace !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
}

body table tbody tr {
  border-bottom: 2px solid #000000 !important;
}

/* Lifted graphite, not a yellow invert: cells carry their own text tokens
   (steel/chalk), which a yellow row would render unreadable. */
body table tbody tr:hover {
  background: #2e2e2e !important;
  color: #f8f8f2 !important;
}

@media (prefers-reduced-motion: reduce) {
  body a[class~="bg-card"] {
    transition-duration: 0.01ms !important;
  }
}
