karson 👨‍💻

Name	Summary
`prefers-color-scheme`	Detect if the user prefers a light or dark color scheme
`prefers-contrast`	Detects if the user has requested the system increase or decrease the amount of contrast between adjacent colors
`prefers-reduced-motion`	The user prefers less motion on the page
`prefers-reduced-transparency`	The user prefers reduced transparency
`inverted-colors`	Is the user agent or underlying OS inverting colors?

@media (prefers-color-scheme: dark) {
  body { background: #1e1e1e; color: white; }
}

@media (prefers-contrast: high) {
  :root {
    --text-color: black;
  }
}

@media (prefers-reduced-motion) {
  * { transition-duration: 0.05s; }
}

@media (prefers-reduced-transparency) {
  .floating-box { opacity: 1; }
}

@media (inverted-colors: inverted) {
  p {
    background: black;
    color: yellow;
  }
}