Integrate individual media queries into categories

[argyleink]

todo: list all of theme

@media (prefers-reduced-motion);
@media (prefers-reduced-transparency);
@media (prefers-reduced-data);
@media (prefers-reduced-transparency);
@media (prefers-color-scheme);
@media (prefers-contrast);

@media (inverted-colors);
@media (forced-colors);

@media (orientation);

@media (dynamic-range)
@media (color-gamut);

@media (hover);
@media (pointer);

@media (min-width)
@media (width <= 720px)

@container (width)
@container (inline-size)
@container (min-width)

[argyleink]

@media (prefers-reduced-data)
@media (prefers-reduced-motion)
@media (prefers-color-scheme)
@media (horizontal-viewport-segments)

[Que-tin]

@media (any-hover)
@media (any-pointer)
@media (aspect-ratio)
@media (color)
@media (color-index)
@media (display-mode)
@media (monochrome)
@media (overflow-block)
@media (overflow-inline)
@media (orientation)
@media (update)
@media (video-dynamic-range)