/* Individual transform properties compose with existing editorial rotations.
   Interactive card shells never move: their content carries the small response. */
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 [data-card-motion]:not(button):not(a):not([role="button"]),
 :is(button,a,[role="button"])[data-card-motion]>:is(strong,span,b,svg){
  translate:var(--card-x,0px) var(--card-y,0px);
  rotate:var(--card-axis-x,0) var(--card-axis-y,0) var(--card-axis-z,1) var(--card-angle,0deg);
  scale:var(--card-scale,1);
  transform-origin:50% 50%;
  transition:translate 480ms cubic-bezier(.19,.85,.25,1),rotate 480ms cubic-bezier(.19,.85,.25,1),scale 480ms cubic-bezier(.19,.85,.25,1),border-color 220ms ease,background-color 220ms ease;
 }
 :is(button,a,[role="button"])[data-card-motion]>:is(strong,span,b,svg){position:relative}
}
/* Keyboard feedback is stable; no pointer-following movement is required. */
[data-card-motion]:not(button):not(a):not([role="button"]):focus-within{outline:1px solid currentColor;outline-offset:4px}
body.motion-paused [data-card-motion],body.modal-open [data-card-motion],body.tab-hidden [data-card-motion],
body.motion-paused :is(button,a,[role="button"])[data-card-motion]>:is(strong,span,b,svg),
body.modal-open :is(button,a,[role="button"])[data-card-motion]>:is(strong,span,b,svg),
body.tab-hidden :is(button,a,[role="button"])[data-card-motion]>:is(strong,span,b,svg){translate:none;rotate:none;scale:none;transition:none}
@media(prefers-reduced-motion:reduce),(hover:none),(pointer:coarse){
 [data-card-motion],:is(button,a,[role="button"])[data-card-motion]>:is(strong,span,b,svg){translate:none;rotate:none;scale:none}
}