/* Visual companions for the haptic library — short keyframe animations
   that map 1:1 to haptic methods. Designed to be unobtrusive but felt. */

@keyframes dr-haptic-flash {
  0%   { background-color: rgba(201, 97, 63, 0.06); }
  100% { background-color: transparent; }
}
@keyframes dr-haptic-success-flash {
  0%   { box-shadow: inset 0 0 0 9999px rgba(33, 122, 58, 0.04); }
  100% { box-shadow: inset 0 0 0 9999px transparent; }
}
@keyframes dr-haptic-complete-flash {
  0%   { box-shadow: inset 0 0 0 9999px rgba(201, 97, 63, 0.10); }
  100% { box-shadow: inset 0 0 0 9999px transparent; }
}
@keyframes dr-haptic-freeze-pulse {
  0%   { filter: saturate(0.6) brightness(0.94); }
  40%  { filter: saturate(0.6) brightness(0.94); }
  100% { filter: none; }
}
@keyframes dr-haptic-warm-rise {
  0%   { background-color: rgba(201, 97, 63, 0.04); }
  60%  { background-color: rgba(201, 97, 63, 0.04); }
  100% { background-color: transparent; }
}
@keyframes dr-haptic-pulse-out {
  0%   { background-color: rgba(201, 97, 63, 0.08); }
  100% { background-color: transparent; }
}
@keyframes dr-haptic-ripple-out {
  0%   { background-color: rgba(201, 97, 63, 0.05); }
  50%  { background-color: rgba(201, 97, 63, 0.03); }
  100% { background-color: transparent; }
}
@keyframes dr-haptic-easter-flash {
  0%   { background-color: rgba(20, 30, 60, 0.08); }
  30%  { background-color: rgba(201, 97, 63, 0.10); }
  60%  { background-color: rgba(20, 30, 60, 0.05); }
  100% { background-color: transparent; }
}

body.dr-haptic-tap     { animation: dr-haptic-flash 100ms ease-out; }
body.dr-haptic-success { animation: dr-haptic-success-flash 360ms ease-out; }
body.dr-haptic-complete{ animation: dr-haptic-complete-flash 700ms ease-out; }
body.dr-haptic-freeze  { animation: dr-haptic-freeze-pulse 600ms ease-out; }
body.dr-haptic-warm    { animation: dr-haptic-warm-rise 600ms ease-out; }
body.dr-haptic-pulse   { animation: dr-haptic-pulse-out 240ms ease-out; }
body.dr-haptic-fade    { animation: dr-haptic-pulse-out 360ms ease-out; }
body.dr-haptic-ripple  { animation: dr-haptic-ripple-out 480ms ease-out; }
body.dr-haptic-easter  { animation: dr-haptic-easter-flash 1200ms ease-out; }

@media (prefers-reduced-motion: reduce) {
  body.dr-haptic-tap, body.dr-haptic-success, body.dr-haptic-complete,
  body.dr-haptic-freeze, body.dr-haptic-warm, body.dr-haptic-pulse,
  body.dr-haptic-fade, body.dr-haptic-ripple, body.dr-haptic-easter {
    animation: none;
  }
}
