/* Physical tools: pickup, clear destinations, then a short completion animation. */
#crate-art{cursor:grab;touch-action:none;border-radius:8px;position:relative}
#crate-art:focus-visible{outline:3px solid var(--brand);outline-offset:3px}
#crate-art.drag-source-lift{opacity:.65}
.drag-ghost{transform:translate3d(-50%,-50%,0) scale(1.08);will-change:left,top;contain:layout style;z-index:1000}
.drag-returning{position:fixed;pointer-events:none!important}
.drop-accept{outline:2px dashed #ffa249;outline-offset:3px;background-color:#ffefb51a}
.drop-hover{outline:3px solid #fff8dc;outline-offset:1px;box-shadow:0 0 0 4px #ff7009,0 0 22px #ffb35d!important}
.board-slot.gesture-slice:after{content:'';position:absolute;left:50%;top:12%;height:78%;width:3px;background:#fff8cf;box-shadow:0 0 6px #ff850d;transform:rotate(24deg);animation:knife-slice .4s ease-out both;pointer-events:none}
.board-slot.gesture-slice>svg{animation:slice-open .5s ease-out both}
.board-slot.gesture-spread>svg clipPath rect{transform-origin:left center;transform-box:fill-box;animation:spread-finish .55s ease-out both}
.board-slot.gesture-spread{box-shadow:inset 0 0 0 2px #ffb348;animation:spread-glow .65s ease-out}
.board-slot.gesture-drop>svg{animation:food-land .28s ease-out}
@keyframes knife-slice{0%{clip-path:inset(0 0 100% 0);opacity:1}65%{clip-path:inset(0);opacity:1}100%{clip-path:inset(0);opacity:0}}
@keyframes slice-open{0%{transform:scale(.91) rotate(-2deg)}60%{transform:scale(1.035) rotate(.5deg)}100%{transform:none}}
@keyframes spread-finish{from{transform:scaleX(.05)}to{transform:scaleX(1)}}
@keyframes spread-glow{0%,100%{background-color:transparent}40%{background-color:#fff6db70}}
@keyframes food-land{0%{transform:translateY(-7px) scale(1.04)}70%{transform:translateY(1px) scale(.99)}100%{transform:none}}
@media(prefers-reduced-motion:reduce){.drag-ghost{will-change:auto}.board-slot.gesture-slice:after{display:none}.board-slot.gesture-slice>svg,.board-slot.gesture-spread,.board-slot.gesture-spread>svg clipPath rect,.board-slot.gesture-drop>svg{animation:none!important}}
/* Feedback is never an input surface, even when it overlaps a small board. */
.selection-pill{pointer-events:none!important}
@media(max-height:600px) and (orientation:landscape){.selection-pill{top:66%;bottom:auto;left:64%;max-width:52%;transform:translate(-50%,-50%);border-radius:8px;padding:4px 7px;font-size:10px}.selection-pill .copy-vi{font-size:8px}}
