body {
  font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif;
}

#dropZone {
  transition:
    border-color 0.2s ease,
    background-color 0.2s ease,
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

#dropZone:hover {
  transform: translateY(-1px);
  box-shadow: 0 16px 40px rgba(37, 99, 235, 0.08);
}

#dropZone:focus-visible {
  outline: none;
  border-color: #2563eb;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.15);
}

#batchDropZone {
  transition:
    border-color 0.2s ease,
    background-color 0.2s ease,
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

#batchDropZone:hover {
  transform: translateY(-1px);
  box-shadow: 0 16px 40px rgba(37, 99, 235, 0.08);
}

#batchDropZone:focus-visible {
  outline: none;
  border-color: #2563eb;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.15);
}

.image-item {
  cursor: grab;
}

.image-item:active {
  cursor: grabbing;
}

.image-item.is-dragging {
  opacity: 0.75;
  transform: scale(0.985);
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.12);
}

.image-item.is-drag-over {
  border-color: rgba(37, 99, 235, 0.65);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

select,
button,
input {
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    background-color 0.2s ease,
    color 0.2s ease;
}