/* chokinghazard.org: rating-card flip that works in Safari on iPhone.
   The card face is a <button>, and Safari flattens 3D inside buttons, so the old flip
   (rotating the whole button 180deg and relying on the back face being hidden) showed the
   front mirrored and never showed the back. Here each face turns on its own, with its own
   perspective, and never past 90deg: the front turns away to edge-on, then the back turns in
   from edge-on. Nothing is ever seen from behind, so nothing can show mirrored. */
.rc-in,.rc-card.flipped .rc-in{transform:none!important;transform-style:flat!important;transition:none!important}
.rc-front,.rc-back,.rc-front *,.rc-back *{-webkit-backface-visibility:visible!important;backface-visibility:visible!important}
/* resting state: front showing, back turned edge-on */
.rc-front{transform:perspective(1400px) rotateY(0deg);visibility:visible;
  transition:transform .26s cubic-bezier(0,.55,.45,1) .26s,visibility 0s linear .26s!important}
.rc-back{transform:perspective(1400px) rotateY(-90deg)!important;visibility:hidden;
  transition:transform .26s cubic-bezier(.55,0,1,.45) 0s,visibility 0s linear .26s!important}
/* flipped: the front turns away first, then the back turns in */
.rc-card.flipped .rc-front{transform:perspective(1400px) rotateY(90deg);visibility:hidden;
  transition:transform .26s cubic-bezier(.55,0,1,.45) 0s,visibility 0s linear .26s!important}
.rc-card.flipped .rc-back{transform:perspective(1400px) rotateY(0deg)!important;visibility:visible;
  transition:transform .26s cubic-bezier(0,.55,.45,1) .26s,visibility 0s linear .26s!important}
@media (prefers-reduced-motion:reduce){
  .rc-front,.rc-back,.rc-card.flipped .rc-front,.rc-card.flipped .rc-back{transition:none!important}
}
/* With the cover beside the card, the back sits over the front's box instead of stretching the card
   (cardfit.js scales a long back's text to fit). Stacked on phones, the card still grows to fit both. */
.rc-bz,.rc-fz{display:block}
@media(min-width:901px){.rc-item .rc-back{position:absolute;inset:0}}
