/* Keep feedback inside the existing sun/moon switch. No icon spins. */
.switch .switch__input,
.switch .switch__icon { transition: none !important; }
.switch .switch__inner-icons,
.switch .switch__inner::before { transition: transform 160ms ease-out !important; }

@media (prefers-reduced-motion: reduce) {
    .switch .switch__inner-icons,
    .switch .switch__inner::before { transition: none !important; }
}

/* First-paint preference resolves before this CSS. Fade only reading colors. */
@media (prefers-reduced-motion: no-preference) {
    html body,
    html :is(.content, .popular, .editorial, .topchart, .trending, .authorsection, .content_detail .banner_side, .dose-content-list) {
        transition: background-color 220ms ease-in-out, border-color 220ms ease-in-out, color 220ms ease-in-out !important;
    }
    html :is(.content, .popular, .editorial, .topchart, .trending, .authorsection) :is(a, h1, h2, h3, h4, p, li, .num, .txt-gd, .txt-semi, .box_info, .timepost) {
        transition: color 220ms ease-in-out, border-color 220ms ease-in-out !important;
    }
}