:root {
  --drag-accent: #557a89;
  --drag-slot: #dfeaf0;
  --drag-lane: #edf0e9;
}
:root[data-theme="dark"] {
  --drag-accent: #a7b8d5;
  --drag-slot: #2c3443;
  --drag-lane: #191c22;
}
.native-drag-bitmap {
  position: fixed;
  top: 0;
  left: 0;
  pointer-events: none;
}
:root .drag-preview {
  position: fixed;
  z-index: 1000;
  pointer-events: none;
  opacity: 1;
  margin: 0;
  border: 2px solid var(--drag-accent);
  border-radius: 10px;
  box-shadow:
    0 18px 42px #00000055,
    0 3px 10px #00000035;
  transform: rotate(2deg);
  overflow: hidden;
}
:root[data-theme] .ticket.drag-preview {
  border-color: var(--drag-accent);
}
.drag-preview-column {
  display: flex;
  flex-direction: column;
  background: var(--drag-lane);
}
.drag-preview-column .lane-cards {
  overflow: hidden;
}
.drag-preview-column .add-card,
.drag-preview-column .add-card-form {
  display: none;
}
.card-drag-origin {
  opacity: 0.3;
}
.card-drop-placeholder {
  flex-shrink: 0;
  display: grid;
  place-items: center;
  border: 2px dashed var(--drag-accent);
  border-radius: 8px;
  background: var(--drag-slot);
  color: var(--ink);
  font-size: 11px;
  font-weight: 600;
}
:root[data-theme] .lane.column-drop-slot {
  border: 2px dashed var(--drag-accent);
  background: var(--drag-slot);
  box-shadow: none;
}
.column-drop-slot::before {
  content: "Drop list here";
  padding: 11px 9px 0;
  color: var(--ink);
  font-size: 11px;
  font-weight: 650;
}
.column-drop-slot .lane-cards,
.column-drop-slot .add-card,
.column-drop-slot .add-card-form {
  opacity: 0.35;
}
.is-dragging-columns > .lane:not(.column-drop-slot) {
  box-shadow: 0 4px 14px #00000020;
}
@media (prefers-reduced-motion: reduce) {
  .drag-preview {
    transform: none;
  }
}