Dark mode with light-dark()

CSS
:root {
  color-scheme: light dark;
  --surface: light-dark(#ffffff, #14161a);
  --text: light-dark(#16181d, #eef0f4);
  --accent: light-dark(#2457d6, #8ab4ff);
}

body {
  background: var(--surface);
  color: var(--text);
}

a {
  color: var(--accent);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}