:root {
  --theme-primary: #f4aa00;
  --theme-secondary: #1a1a1a;
  --theme-inverse: #1a1a1a;
  --header-image-hue: 0deg;
}
:root {
  --accent: #f4aa00;
  --accent-hover: color-mix(in srgb, #f4aa00 88%, #000 12%);
  --accent-soft: color-mix(in srgb, #f4aa00 18%, var(--surface) 82%);
  --accent-text: #1a1a1a;
}
@media (prefers-color-scheme: dark) {
  :root {
    --accent: color-mix(in srgb, #f4aa00 90%, #fff 10%);
    --accent-hover: color-mix(in srgb, #f4aa00 84%, #fff 16%);
    --accent-soft: color-mix(in srgb, #f4aa00 18%, var(--surface) 82%);
    --accent-text: #1a1a1a;
  }
}

.public-theme .home-hero__art img { filter: hue-rotate(var(--header-image-hue, 0deg)); }