
  /* UI-1565, deviation 5: the copy that follows the pointer, appended to body by SortableJS
     (fallbackClass is one token, so this is a plain class, not utilities). Upstream's overlay is
     full opacity, z-50 and cursor-grabbing; SortableJS paints its copy at 0.8 inline, hence the
     !important. The lift (a slight tilt and scale and a soft shadow, on the copy's child, below) is drawn with `rotate`, `scale` and `filter`, never
     `transform`, which SortableJS rewrites on every move. `transition: none` so the copy is not
     dragged behind the pointer by a card's own hover transition, and every animation inside is
     stopped (but the lift's): a static copy of a card that was fading in would replay it. */
.kanban-drag-ghost {
    opacity: 1 !important;
    cursor: grabbing !important;
    transition: none !important;
}
.kanban-drag-ghost * {
    animation: none !important;
    transition: none !important;
}
  /* UI-2803 (Boaz: "it wont let dnd more then once"): nothing in the copy takes the pointer. SortableJS sets pointer-events
     none on the copy alone, and a part that sets its own (reka's ContextMenuTrigger writes pointer-events auto inline) was
     then what the pointer was over: in fallback mode the list under the pointer is found by elementFromPoint, which hit the
     copy, so no list but an empty one (found by its box, emptyInsertThreshold) could take a drop. The !important beats an
     inline style. */
.kanban-drag-ghost,
  .kanban-drag-ghost * {
    pointer-events: none !important;
}
  /* The lift sits on the copy's child, never on the copy: CSS applies rotate and scale outside
     transform, so on the copy itself they rotated and scaled SortableJS's own pointer offset and
     the card drifted away from the pointer the further it was carried. */
.kanban-drag-ghost > * {
    rotate: 2deg;
    scale: 1.03;
    filter: drop-shadow(0 12px 18px rgb(0 0 0 / 0.16)) drop-shadow(0 2px 4px rgb(0 0 0 / 0.08));
    animation: kanban-drag-lift 160ms cubic-bezier(0.16, 1, 0.3, 1) both !important;
}
:root[dir='rtl'] .kanban-drag-ghost > * {
    rotate: -2deg;
}
.dark .kanban-drag-ghost > * {
    filter: drop-shadow(0 14px 22px rgb(0 0 0 / 0.5)) drop-shadow(0 2px 4px rgb(0 0 0 / 0.3));
}
@keyframes kanban-drag-lift {
from {
      rotate: 0deg;
      scale: 1;
}
}
@media (prefers-reduced-motion: reduce) {
.kanban-drag-ghost > *,
    :root[dir='rtl'] .kanban-drag-ghost > * {
      rotate: none;
      scale: none;
      animation: none !important;
}
}
