﻿/* D2 环境与镜头 */
.d2-motes{position:fixed;inset:0;pointer-events:none;z-index:40;overflow:hidden}
.d2-mote{
  position:absolute;border-radius:50%;background:#efe3f0;opacity:0;
  box-shadow:0 0 6px rgba(230,220,255,.85);
  animation:d2-mote-float 2.2s ease-out forwards;
}
@keyframes d2-mote-float{
  0%{opacity:0;transform:translate(0,0) scale(.8)}
  18%{opacity:.55}
  70%{opacity:.35}
  100%{opacity:0;transform:translate(var(--dx,10px),var(--dy,-40px)) scale(1.1)}
}
@keyframes d2-camera-move{
  0%{transform:scale(1.012) translate3d(0,0,0)}
  18%{transform:scale(1.014) translate3d(-2px,1px,0)}
  38%{transform:scale(1.012) translate3d(2px,-1px,0)}
  58%{transform:scale(1.011) translate3d(-1px,1px,0)}
  78%{transform:scale(1.006) translate3d(1px,0,0)}
  100%{transform:scale(1) translate3d(0,0,0)}
}
main.d2-camera{animation:d2-camera-move .34s cubic-bezier(.2,.8,.3,1)}
@media (prefers-reduced-motion: reduce){
  .d2-mote{display:none}
  main.d2-camera{animation:none}
}

/* A: 便签被剑风掀起 + 角色蓄力/出鞘微动作 */
.desk-item.d2-note-lift{animation:d2-note-lift .42s cubic-bezier(.2,.9,.25,1) var(--d2-delay,0ms) both}
@keyframes d2-note-lift{
  0%{transform:rotate(0deg) translateY(0)}
  35%{transform:rotate(-4.5deg) translateY(-5px)}
  70%{transform:rotate(1.5deg) translateY(1px)}
  100%{transform:rotate(0deg) translateY(0)}
}
#b2-ip-layer .b2-actor-layer img{transition:transform .16s ease}
#b2-ip-layer .b2-actor-layer.d2-lean img{transform:translateY(-2px) rotate(1.6deg)}
#b2-ip-layer .b2-actor-layer.d2-pop img{animation:d2-pop .24s cubic-bezier(.2,.9,.3,1)}
@keyframes d2-pop{0%{transform:translateY(0)}40%{transform:translateY(-6px) rotate(-1deg) scale(1.02)}100%{transform:translateY(0)}}
@media (prefers-reduced-motion: reduce){
  .desk-item.d2-note-lift{animation:none}
  #b2-ip-layer .b2-actor-layer.d2-lean img,
  #b2-ip-layer .b2-actor-layer.d2-pop img{animation:none;transform:none}
}
