鼠标从卡片上划过去，整排卡片一起上下抖一下，快速移动时能明显看到下面的列表在跳，截图里高度差出四个像素。碰到这种情况，我一般先确认改动有没有真的生效。
原因不复杂，hover 里改的是 margin-top，外边距参与布局计算，一张卡片变化会把整行的高度重新分配，同一行的兄弟节点跟着位移。改布局属性必然触发重排，动画再短也看得见。
碰到「hover 布局抖动」这类问题，我习惯先把当前配置原样备份一份，改坏了立刻换回来，不用现场推。改完顺手把文档补一句，省得下次自己重新推一遍。
.card { transition: transform .2s ease; }
.card:hover {
transform: translateY(-4px);
box-shadow: 0 6px 16px rgba(0,0,0,.12);
}
监控和日志的时间要对上，时区不一致会多绕很大一圈。临时改动用注释写上日期和原因，过两周自己都记不清为什么这么写。
具体做法是，把位移改成 transform: translateY(-4px)，只走合成层，不影响周围元素；过渡时间给到 0.2 秒左右，别用 all，明确写 transform；需要阴影变化时一起放进 transform 和 box-shadow，别碰宽高和外边距。
最后用这个标准收尾，鼠标快速划过一排卡片，周围卡片位置不动，只有当前这张轻微上浮。