/* Short, shared feedback without changing the site's resting appearance. */
body :is(button, a.button, a.account-button, a.module-all, .header-inner nav a) {
  transition: translate 90ms ease-out, filter 140ms ease-out, background-color 140ms ease-out, border-color 140ms ease-out;
}

body :is(.module-articles .article-link, .series-links a, a.related-link, a.checkin-day, a.card, a.category-tile, a.carousel-slide) {
  transition: filter 140ms ease-out, background-color 140ms ease-out, border-color 140ms ease-out;
}

/* Hover feedback is reserved for a mouse or trackpad, avoiding sticky touch states. */
@media (hover: hover) and (pointer: fine) {
  body :is(button, a.button, a.account-button, a.module-all, .header-inner nav a):not(:disabled):not([aria-disabled="true"]):hover {
    filter: brightness(1.06);
  }
  body :is(.module-articles .article-link, .series-links a, a.related-link, a.checkin-day, a.card, a.category-tile, a.carousel-slide):not([aria-disabled="true"]):hover {
    filter: brightness(1.035);
  }
  body .module-articles .article-link:hover,
  body a.related-link:hover {background-color: #ffffff38;}
}

body :is(button, a.button, a.account-button, a.module-all, .header-inner nav a):not(:disabled):not([aria-disabled="true"]):active {
  translate: 0 2px;
  filter: brightness(.96);
  transition-duration: 60ms;
}
body :is(.module-articles .article-link, .series-links a, a.related-link, a.checkin-day, a.card, a.category-tile, a.carousel-slide):not([aria-disabled="true"]):active {
  filter: brightness(.97);
  transition-duration: 60ms;
}

body :is(button, a.button, a.account-button, a.module-all, .module-articles .article-link, .series-links a, a.related-link, a.checkin-day, a.card, a.category-tile, a.carousel-slide):focus-visible {
  outline: 3px solid #167e82;
  outline-offset: 3px;
}
body .module-articles .article-link:focus-visible {outline-offset: -3px;}
body .header-actions :is(button, a):focus-visible {outline-color: #ffe16b;}

/* Replace older floating/zooming card effects with the same restrained feedback. */
body a.card:hover, body a.category-tile:hover {transform: none;}
body a.card:hover img {transform: none;}

@media (prefers-reduced-motion: reduce) {
  body :is(button, a.button, a.account-button, a.module-all, .header-inner nav a, .module-articles .article-link, .series-links a, a.related-link, a.checkin-day, a.card, a.category-tile, a.carousel-slide) {
    transition: none !important;
    translate: none !important;
  }
}