html[data-dept] {
  --color-primary: #f5c018;
  --color-primary-content: #101425;
  --color-secondary: #4a6fd1;
  --color-secondary-content: #fff;
  --color-accent: #4a6fd1;
  --color-accent-content: #fff;
  --color-info: #4a6fd1;
  --color-navy: #0e1838;
  --color-ocean: #4a6fd1;
  --color-sunset-1: #f5c018;
  --color-sunset-2: color-mix(in oklab, #f5c018 50%, #4a6fd1);
  --color-sunset-3: #4a6fd1;
  --color-base-100: color-mix(in oklab, #0e1838 22%, #08090d);
  --color-base-200: color-mix(in oklab, #0e1838 30%, #111218);
  --color-base-300: color-mix(in oklab, #0e1838 38%, #191a22);
}
html[data-dept] ::selection { background: #4a6fd1; color: #fff; }
html[data-dept] :focus-visible { outline-color: #f5c018; }
html[data-dept] .text-sunset {
  background: linear-gradient(100deg, color-mix(in oklab, #f5c018 60%, white) 0%, #f5c018 40%, #4a6fd1 100%);
  -webkit-background-clip: text;
  background-clip: text;
}
html[data-dept] .bg-sunset {
  background: linear-gradient(100deg, #f5c018 0%, color-mix(in oklab, #f5c018 55%, #4a6fd1) 55%, #4a6fd1 100%);
}
/* The button stays gold with dark text: white on a gold-to-blue fill doesn't read. */
html[data-dept] .pill-sunset {
  background: linear-gradient(100deg, color-mix(in oklab, #f5c018 60%, white), #f5c018 60%);
  color: #101425;
  box-shadow: 0 10px 30px -10px #f5c018;
}
html[data-dept] .neon {
  color: color-mix(in oklab, color-mix(in oklab, #f5c018 60%, white) 17%, transparent);
  text-shadow: 0 0 18px color-mix(in oklab, #f5c018 45%, transparent), 0 0 50px color-mix(in oklab, #f5c018 30%, transparent), 0 0 110px color-mix(in oklab, #4a6fd1 35%, transparent),
    0 0 220px color-mix(in oklab, #4a6fd1 30%, transparent);
}
html[data-dept] .beacon-haze {
  background: radial-gradient(closest-side, color-mix(in oklab, #d6a447 40%, transparent) 0%, color-mix(in oklab, #d6a447 12%, transparent) 45%, transparent 100%);
}
html[data-dept] .beacon-glow {
  background: radial-gradient(closest-side, color-mix(in oklab, #d6a447 65%, transparent) 0%, color-mix(in oklab, #d6a447 32%, transparent) 40%, color-mix(in oklab, #d6a447 8%, transparent) 70%, transparent 100%);
}
html[data-dept] .beacon-core {
  background: radial-gradient(closest-side, color-mix(in oklab, #d6a447 70%, #f3dca6) 0%, color-mix(in oklab, #d6a447 25%, transparent) 50%, transparent 100%);
}
html[data-dept] .beacon-shaft {
  background: linear-gradient(to top, color-mix(in oklab, #d6a447 35%, transparent), color-mix(in oklab, #d6a447 8%, transparent) 45%, transparent 85%);
}
html[data-dept] .beacon-cool {
  background: radial-gradient(closest-side, transparent 55%, color-mix(in oklab, #4a6fd1 12%, transparent) 80%, transparent 100%);
}
html[data-dept] [data-spotlight]::after {
  background: radial-gradient(420px circle at var(--x, 50%) var(--y, 50%), color-mix(in oklab, #f5c018 11%, transparent), transparent 60%);
}
