/* ==========================================================================
   PIECES CSS - TIBIA CHESS ENGINE
   ========================================================================== */

/* Piece Image inside square */
.square .piece {
    width: 32px;
    height: 32px;
    object-fit: contain;
    image-rendering: pixelated;
    image-rendering: crisp-edges;
    pointer-events: none;
    user-select: none;
    z-index: 2;
    transition: transform 0.15s ease-out, opacity 0.15s ease;
    filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.5));
}

/* Hover effect when piece is interactive */
.square:hover .piece {
    transform: scale(1.08);
}

/* Captured piece styling in UI sidebar */
.captured-piece-icon {
    width: 24px;
    height: 24px;
    image-rendering: pixelated;
    image-rendering: crisp-edges;
    margin: 1px;
    filter: drop-shadow(0px 1px 2px rgba(0, 0, 0, 0.6));
}