/* ============================================================
   DESMOCHEE · ARENA SIZE + EXCHANGE POLISH · FASE 2.3.6D
   ------------------------------------------------------------
   Geometría únicamente. No modifica skins ni reglas.
   1) Bot cards no se recortan.
   2) CAMBIO vuelve a ser un destino visible.
   3) El cuadro lateral ocupa menos ancho para no aplastar la mano.
   4) Las cartas colocadas en MESA conservan proporción de naipe.
   ============================================================ */

/* ------------------------------------------------------------
   1 · BOTS: el contenedor anterior tenía overflow:hidden.
   Las cartas pueden sobresalir unos píxeles sin ser recortadas.
   ------------------------------------------------------------ */
.game-screen.game-screen-arena .bot-hand,
.game-screen.game-screen-arena.display-fit .bot-hand {
  overflow: visible !important;
  padding-inline: 3px !important;
}

.game-screen.game-screen-arena.display-fit .bot-card-back {
  width: 16px !important;
  height: 25px !important;
  flex: 0 0 16px !important;
  border-radius: 4px !important;
}

.game-screen.game-screen-arena.display-fit .bot-card-back + .bot-card-back {
  margin-left: -7px !important;
}

/* En modo grande conservamos algo más de presencia. */
.game-screen.game-screen-arena:not(.display-fit) .bot-card-back {
  width: 18px !important;
  height: 28px !important;
  flex-basis: 18px !important;
}
.game-screen.game-screen-arena:not(.display-fit) .bot-card-back + .bot-card-back {
  margin-left: -7px !important;
}

/* ------------------------------------------------------------
   2 · CAMBIO: destino claro y consistente con DESCARTE.
   El Arena anterior ganaba por especificidad y apagaba el borde.
   ------------------------------------------------------------ */
.game-screen.game-screen-arena .special-card-slot.exchange-drop-ready {
  border: 2px dashed rgba(241,208,109,.82) !important;
  background:
    radial-gradient(circle at 50% 42%, rgba(241,208,109,.11), transparent 58%),
    rgba(35,31,18,.16) !important;
  box-shadow:
    0 0 0 3px rgba(241,208,109,.08),
    0 0 20px rgba(241,208,109,.16) !important;
  animation: arenaExchangeTargetPulse 1.35s ease-in-out infinite;
}

.game-screen.game-screen-arena .special-card-slot.exchange-drop-ready .special-card-title {
  color: #f2d77f !important;
  font-weight: 900 !important;
  opacity: 1 !important;
}

.game-screen.game-screen-arena .special-card-slot.exchange-drop-ready.drop-active,
.game-screen.game-screen-arena .special-card-slot.exchange-landing-target {
  border-color: #f1d06d !important;
  background:
    radial-gradient(circle at 50% 42%, rgba(241,208,109,.22), transparent 62%),
    rgba(49,42,20,.24) !important;
  box-shadow:
    0 0 0 4px rgba(241,208,109,.12),
    0 0 30px rgba(241,208,109,.30) !important;
  animation: none !important;
}

@keyframes arenaExchangeTargetPulse {
  0%,100% { box-shadow:0 0 0 3px rgba(241,208,109,.06),0 0 13px rgba(241,208,109,.10); }
  50% { box-shadow:0 0 0 4px rgba(241,208,109,.12),0 0 25px rgba(241,208,109,.22); }
}

/* ------------------------------------------------------------
   3 · MANO: CAMBIO/CARTA NUEVA deja de robar 92px.
   Mantiene el cuadro, pero la mano conserva suficiente ancho.
   ------------------------------------------------------------ */
.game-screen.game-screen-arena .hand-workspace,
.game-screen.game-screen-arena.display-fit .hand-workspace {
  grid-template-columns: minmax(0,1fr) 72px !important;
  gap: 5px !important;
  overflow: visible !important;
}

.game-screen.game-screen-arena .special-card-slot,
.game-screen.game-screen-arena.display-fit .special-card-slot {
  width: 72px !important;
  min-width: 72px !important;
  max-width: 72px !important;
  height: 118px !important;
  min-height: 118px !important;
  max-height: 118px !important;
  padding: 5px 3px !important;
}

.game-screen.game-screen-arena .special-card-visual,
.game-screen.game-screen-arena.display-fit .special-card-visual {
  min-height: 68px !important;
  max-height: 70px !important;
}

.game-screen.game-screen-arena .special-card-visual .playing-card,
.game-screen.game-screen-arena.display-fit .special-card-visual .playing-card,
.game-screen.game-screen-arena .special-card-placeholder,
.game-screen.game-screen-arena .special-card-back,
.game-screen.game-screen-arena.display-fit .special-card-placeholder,
.game-screen.game-screen-arena.display-fit .special-card-back {
  width: 47px !important;
  height: 68px !important;
  flex-basis: 47px !important;
}

/* Si el cuadro está en estado neutro, no deforma visualmente la mesa. */
.game-screen.game-screen-arena .special-card-slot.idle-slot {
  opacity: .56;
}

/* ------------------------------------------------------------
   4 · MESA DEL JUGADOR: cartas siempre con proporción de naipe.
   Se permite desplazamiento horizontal antes que deformarlas.
   ------------------------------------------------------------ */
.game-screen.game-screen-arena .human-melds-zone .melds-scroll,
.game-screen.game-screen-arena .human-melds-zone .table-building-cards {
  overflow-x: auto !important;
  overflow-y: visible !important;
  padding-block: 3px !important;
  scrollbar-width: none;
}
.game-screen.game-screen-arena .human-melds-zone .melds-scroll::-webkit-scrollbar,
.game-screen.game-screen-arena .human-melds-zone .table-building-cards::-webkit-scrollbar {
  display: none;
}

.game-screen.game-screen-arena .human-melds-zone .table-card,
.game-screen.game-screen-arena .human-melds-zone .table-building-card,
.game-screen.game-screen-arena.display-fit .human-melds-zone .table-card,
.game-screen.game-screen-arena.display-fit .human-melds-zone .table-building-card {
  width: 38px !important;
  min-width: 38px !important;
  height: 54px !important;
  flex: 0 0 38px !important;
  border-radius: 6px !important;
  font-size: .78rem !important;
  line-height: 1 !important;
  transform: none !important;
}

.game-screen.game-screen-arena .human-melds-zone .table-card + .table-card,
.game-screen.game-screen-arena.display-fit .human-melds-zone .table-card + .table-card {
  margin-left: -5px !important;
}

.game-screen.game-screen-arena .human-melds-zone .table-building-cards {
  gap: 3px !important;
}

/* La zona MESA gana apenas altura para que el naipe no se corte. */
.game-screen.game-screen-arena .human-melds-zone,
.game-screen.game-screen-arena .human-melds-zone.show,
.game-screen.game-screen-arena.display-fit .human-melds-zone,
.game-screen.game-screen-arena.display-fit .human-melds-zone.show {
  min-height: 72px !important;
  overflow: visible !important;
}

@media (max-width:390px) {
  .game-screen.game-screen-arena.display-fit .bot-card-back {
    width:15px !important;
    height:23px !important;
    flex-basis:15px !important;
  }
  .game-screen.game-screen-arena.display-fit .bot-card-back + .bot-card-back {
    margin-left:-7px !important;
  }
  .game-screen.game-screen-arena .hand-workspace,
  .game-screen.game-screen-arena.display-fit .hand-workspace {
    grid-template-columns:minmax(0,1fr) 68px !important;
  }
  .game-screen.game-screen-arena .special-card-slot,
  .game-screen.game-screen-arena.display-fit .special-card-slot {
    width:68px !important;
    min-width:68px !important;
    max-width:68px !important;
  }
}

@media (prefers-reduced-motion:reduce) {
  .game-screen.game-screen-arena .special-card-slot.exchange-drop-ready {
    animation:none !important;
  }
}

/* ============================================================
   DESMOCHEE · ARENA GEOMETRY POLISH · FASE 2.3.6E
   ------------------------------------------------------------
   Ajustes posteriores a prueba real:
   1) Tradicional: CAMBIO neutro al inicio; se marca al pasar.
   2) Mano humana: menos compresión cuando aumenta el número de cartas.
   3) Bots: cartas más grandes sin volver a recortarse.
   ============================================================ */

/* ------------------------------------------------------------
   1 · CAMBIO POR MODO
   Principiante/Intermedio conservan guía previa.
   Tradicional permanece discreto hasta el aterrizaje real.
   ------------------------------------------------------------ */
.game-screen.game-screen-arena.traditional-mode-ui
.special-card-slot.exchange-drop-ready:not(.exchange-landing-target) {
  border: 1px dashed rgba(255,255,255,.16) !important;
  background: rgba(255,255,255,.018) !important;
  box-shadow: none !important;
  animation: none !important;
}

.game-screen.game-screen-arena.traditional-mode-ui
.special-card-slot.exchange-drop-ready:not(.exchange-landing-target)
.special-card-title {
  color: rgba(220,232,226,.70) !important;
  font-weight: 800 !important;
}

/* Cuando la carta realmente se pasa, Tradicional sí marca el destino. */
.game-screen.game-screen-arena.traditional-mode-ui
.special-card-slot.exchange-landing-target {
  border: 2px dashed rgba(241,208,109,.94) !important;
  background:
    radial-gradient(circle at 50% 42%, rgba(241,208,109,.24), transparent 62%),
    rgba(49,42,20,.25) !important;
  box-shadow:
    0 0 0 4px rgba(241,208,109,.12),
    0 0 30px rgba(241,208,109,.30) !important;
}

/* ------------------------------------------------------------
   2 · MANO HUMANA
   El cuadro derecho se compacta un poco más para que al llegar
   a 9/10 cartas no obligue a solaparlas tanto.
   Las cartas conservan proporción fija: nunca se estiran.
   ------------------------------------------------------------ */
.game-screen.game-screen-arena .hand-workspace,
.game-screen.game-screen-arena.display-fit .hand-workspace {
  grid-template-columns: minmax(0,1fr) 60px !important;
  gap: 4px !important;
}

.game-screen.game-screen-arena .special-card-slot,
.game-screen.game-screen-arena.display-fit .special-card-slot {
  width: 60px !important;
  min-width: 60px !important;
  max-width: 60px !important;
  height: 110px !important;
  min-height: 110px !important;
  max-height: 110px !important;
  padding: 4px 2px !important;
}

.game-screen.game-screen-arena .special-card-visual,
.game-screen.game-screen-arena.display-fit .special-card-visual {
  min-height: 62px !important;
  max-height: 64px !important;
}

.game-screen.game-screen-arena .special-card-visual .playing-card,
.game-screen.game-screen-arena.display-fit .special-card-visual .playing-card,
.game-screen.game-screen-arena .special-card-placeholder,
.game-screen.game-screen-arena .special-card-back,
.game-screen.game-screen-arena.display-fit .special-card-placeholder,
.game-screen.game-screen-arena.display-fit .special-card-back {
  width: 43px !important;
  min-width: 43px !important;
  height: 62px !important;
  flex: 0 0 43px !important;
}

/* Tamaño fijo/proporcionado de la mano en Ajustar a pantalla. */
.game-screen.game-screen-arena.display-fit .human-hand .playing-card {
  width: 40px !important;
  min-width: 40px !important;
  height: 58px !important;
  flex: 0 0 40px !important;
  border-radius: 6px !important;
}

.game-screen.game-screen-arena.display-fit .human-hand {
  padding-inline: 2px !important;
}

/* En modo grande mantiene más presencia sin deformarse. */
.game-screen.game-screen-arena:not(.display-fit) .human-hand .playing-card {
  width: 45px !important;
  min-width: 45px !important;
  height: 65px !important;
  flex: 0 0 45px !important;
}

/* ------------------------------------------------------------
   3 · BOTS
   Más legibles, usando solapamiento en vez de hacerlas diminutas.
   overflow sigue visible por la corrección 6D.
   ------------------------------------------------------------ */
.game-screen.game-screen-arena.display-fit .bot-card-back {
  width: 20px !important;
  min-width: 20px !important;
  height: 30px !important;
  flex: 0 0 20px !important;
  border-radius: 4px !important;
}

.game-screen.game-screen-arena.display-fit .bot-card-back + .bot-card-back {
  margin-left: -9px !important;
}

.game-screen.game-screen-arena:not(.display-fit) .bot-card-back {
  width: 22px !important;
  min-width: 22px !important;
  height: 33px !important;
  flex: 0 0 22px !important;
  border-radius: 5px !important;
}

.game-screen.game-screen-arena:not(.display-fit) .bot-card-back + .bot-card-back {
  margin-left: -10px !important;
}

/* El asiento deja respirar la mano más grande. */
.game-screen.game-screen-arena .bot-seat {
  overflow: visible !important;
}

.game-screen.game-screen-arena .bot-hand {
  min-height: 35px !important;
  justify-content: center !important;
}

@media (max-width:390px) {
  .game-screen.game-screen-arena .hand-workspace,
  .game-screen.game-screen-arena.display-fit .hand-workspace {
    grid-template-columns:minmax(0,1fr) 56px !important;
    gap:3px !important;
  }

  .game-screen.game-screen-arena .special-card-slot,
  .game-screen.game-screen-arena.display-fit .special-card-slot {
    width:56px !important;
    min-width:56px !important;
    max-width:56px !important;
  }

  .game-screen.game-screen-arena.display-fit .bot-card-back {
    width:19px !important;
    min-width:19px !important;
    height:29px !important;
    flex-basis:19px !important;
  }

  .game-screen.game-screen-arena.display-fit .bot-card-back + .bot-card-back {
    margin-left:-9px !important;
  }
}


/* ============================================================
   DESMOCHEE · FASE 2.3.6F
   CAMBIO FÍSICO + MANO ESTABLE + BOTS MÁS LEGIBLES
   ============================================================ */

/* La mano no cambia el tamaño del naipe; solo usa el overlap que
   calcula fitHumanHand() por cantidad de cartas. */
.game-screen.game-screen-arena.display-fit .human-hand .playing-card {
  width: 41px !important;
  min-width: 41px !important;
  max-width: 41px !important;
  height: 60px !important;
  min-height: 60px !important;
  max-height: 60px !important;
  flex: 0 0 41px !important;
}

.game-screen.game-screen-arena:not(.display-fit) .human-hand .playing-card {
  width: 46px !important;
  min-width: 46px !important;
  max-width: 46px !important;
  height: 67px !important;
  min-height: 67px !important;
  max-height: 67px !important;
  flex: 0 0 46px !important;
}

.game-screen.game-screen-arena .human-hand .playing-card + .playing-card,
.game-screen.game-screen-arena.display-fit .human-hand .playing-card + .playing-card {
  margin-left: var(--hand-overlap, -7px) !important;
}

/* Bots: presencia mayor sin cortar extremos. */
.game-screen.game-screen-arena.display-fit .bot-card-back {
  width: 23px !important;
  min-width: 23px !important;
  height: 34px !important;
  min-height: 34px !important;
  flex: 0 0 23px !important;
  border-radius: 5px !important;
}

.game-screen.game-screen-arena.display-fit .bot-card-back + .bot-card-back {
  margin-left: -10px !important;
}

.game-screen.game-screen-arena:not(.display-fit) .bot-card-back {
  width: 25px !important;
  min-width: 25px !important;
  height: 37px !important;
  min-height: 37px !important;
  flex: 0 0 25px !important;
  border-radius: 5px !important;
}

.game-screen.game-screen-arena:not(.display-fit) .bot-card-back + .bot-card-back {
  margin-left: -11px !important;
}

.game-screen.game-screen-arena .bot-hand {
  min-height: 38px !important;
  overflow: visible !important;
}

/* CAMBIO: la carta aterriza de frente y gira sobre su eje Y. */
.game-screen.game-screen-arena .exchange-flip-card {
  position: relative;
  width: 43px;
  height: 62px;
  flex: 0 0 43px;
  transform-style: preserve-3d;
  transition: transform .32s cubic-bezier(.2,.72,.25,1);
  transform: rotateY(0deg);
  perspective: 600px;
}

.game-screen.game-screen-arena .exchange-flip-card.is-flipped {
  transform: rotateY(180deg);
}

.game-screen.game-screen-arena .exchange-flip-front,
.game-screen.game-screen-arena .exchange-flip-back {
  position: absolute !important;
  inset: 0 !important;
  width: 43px !important;
  min-width: 43px !important;
  max-width: 43px !important;
  height: 62px !important;
  min-height: 62px !important;
  max-height: 62px !important;
  margin: 0 !important;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.game-screen.game-screen-arena .exchange-flip-back {
  transform: rotateY(180deg);
}

.game-screen.game-screen-arena .special-card-slot.exchange-card-flipping {
  border-color: rgba(241,208,109,.92) !important;
  box-shadow:
    0 0 0 3px rgba(241,208,109,.10),
    0 0 22px rgba(241,208,109,.24) !important;
}

@media (max-width:390px) {
  .game-screen.game-screen-arena.display-fit .bot-card-back {
    width:22px !important;
    min-width:22px !important;
    height:33px !important;
    min-height:33px !important;
    flex-basis:22px !important;
  }

  .game-screen.game-screen-arena.display-fit .bot-card-back + .bot-card-back {
    margin-left:-10px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .game-screen.game-screen-arena .exchange-flip-card {
    transition-duration: .01ms;
  }
}


/* ============================================================
   DESMOCHEE · FASE 2.3.6G
   CAMBIO IDA/VUELTA + HAND FIT REAL + BOTS MÁS GRANDES
   ============================================================ */

/* La carta física desaparece del cuadro exactamente al salir. */
.game-screen.game-screen-arena .exchange-flip-card.is-departing {
  opacity: 0 !important;
  transform: rotateY(180deg) scale(.96) !important;
  transition: opacity .10s linear, transform .10s ease !important;
}

/* La recepción usa el mismo flip, inicialmente mostrando dorso. */
.game-screen.game-screen-arena .incoming-exchange-card {
  transition: transform .34s cubic-bezier(.2,.72,.25,1) !important;
}

/*
  La mano puede usar todo el ancho de su columna y jamás recorta
  los extremos. El tamaño de carta sigue fijo; JS solo ajusta overlap.
*/
.game-screen.game-screen-arena .human-hand,
.game-screen.game-screen-arena.display-fit .human-hand {
  overflow: visible !important;
  min-width: 0 !important;
  width: 100% !important;
  padding-left: 4px !important;
  padding-right: 4px !important;
}

.game-screen.game-screen-arena .hand-main,
.game-screen.game-screen-arena.display-fit .hand-main {
  min-width: 0 !important;
  overflow: visible !important;
}

/* Bots: más presencia vertical; el solapamiento hace que 9 entren. */
.game-screen.game-screen-arena.display-fit .bot-card-back {
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  flex: 0 0 28px !important;
  border-radius: 5px !important;
}

.game-screen.game-screen-arena.display-fit .bot-card-back + .bot-card-back {
  margin-left: -16px !important;
}

.game-screen.game-screen-arena:not(.display-fit) .bot-card-back {
  width: 30px !important;
  min-width: 30px !important;
  max-width: 30px !important;
  height: 45px !important;
  min-height: 45px !important;
  max-height: 45px !important;
  flex: 0 0 30px !important;
  border-radius: 6px !important;
}

.game-screen.game-screen-arena:not(.display-fit) .bot-card-back + .bot-card-back {
  margin-left: -17px !important;
}

.game-screen.game-screen-arena .bot-hand {
  min-height: 47px !important;
  overflow: visible !important;
  padding-inline: 2px !important;
}

@media (max-width:390px) {
  .game-screen.game-screen-arena.display-fit .bot-card-back {
    width:27px !important;
    min-width:27px !important;
    max-width:27px !important;
    height:40px !important;
    min-height:40px !important;
    max-height:40px !important;
    flex-basis:27px !important;
  }
  .game-screen.game-screen-arena.display-fit .bot-card-back + .bot-card-back {
    margin-left:-15px !important;
  }
}


/* ============================================================
   DESMOCHEE · FASE 2.3.6H
   LIMPIEZA DE CAMBIO + MANO SIEMPRE CONTENIDA
   ============================================================ */

/*
  La mano usa el ancho real de su columna. Se mantiene centrada cuando
  sobra espacio, pero cuando hay muchas cartas nunca puede invadir la
  columna CAMBIO ni salirse del viewport.
*/
.game-screen.game-screen-arena .hand-main,
.game-screen.game-screen-arena.display-fit .hand-main {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  padding-inline: 1px !important;
}

.game-screen.game-screen-arena .human-hand,
.game-screen.game-screen-arena.display-fit .human-hand {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: visible !important;
  padding-left: 3px !important;
  padding-right: 3px !important;
}

/* Evita que el pequeño levantamiento de una carta fuerce ancho horizontal. */
.game-screen.game-screen-arena .human-hand .playing-card,
.game-screen.game-screen-arena.display-fit .human-hand .playing-card {
  box-sizing: border-box !important;
}

/* Mientras se espera la carta del bot, CAMBIO está realmente vacío. */
.game-screen.game-screen-arena .special-card-slot.exchange-waiting-empty .special-card-visual {
  min-height: 62px !important;
}


/* ============================================================
   DESMOCHEE · FASE 2.3.6I
   CAMBIO DE UNA SOLA CARTA + MANO ANCLADA
   ============================================================ */

/* La mano empieza siempre dentro del borde izquierdo.
   JS garantiza que el total termine antes de CAMBIO. */
.game-screen.game-screen-arena .hand-main,
.game-screen.game-screen-arena.display-fit .hand-main {
  overflow: visible !important;
  padding-left: 5px !important;
  padding-right: 3px !important;
}

.game-screen.game-screen-arena .human-hand,
.game-screen.game-screen-arena.display-fit .human-hand {
  justify-content: flex-start !important;
  overflow: visible !important;
  padding-left: 2px !important;
  padding-right: 2px !important;
}

/* Ningún ancestro de la mano recorta el primer naipe. */
.game-screen.game-screen-arena .hand-workspace {
  overflow: visible !important;
}

/* Flip robusto en Android: una sola cara visible, comprimida a 0
   en el punto en que se sustituye frente <-> dorso. */
.game-screen.game-screen-arena .exchange-stage-card {
  width: 43px !important;
  min-width: 43px !important;
  max-width: 43px !important;
  height: 62px !important;
  min-height: 62px !important;
  max-height: 62px !important;
  margin: 0 !important;
  flex: 0 0 43px !important;
  transform: scaleX(1);
  transform-origin: center;
  transition:
    transform .15s cubic-bezier(.4,0,.2,1),
    opacity .10s linear !important;
}

.game-screen.game-screen-arena .exchange-stage-card.exchange-stage-collapsed {
  transform: scaleX(.035) !important;
}

.game-screen.game-screen-arena .exchange-stage-card.exchange-stage-departing {
  opacity: 0 !important;
  transform: scale(.94) !important;
}

/* El dorso ya usa el motivo de la baraja; no agregamos ↔ encima. */
.game-screen.game-screen-arena .exchange-stage-card.special-card-back {
  font-size: 0 !important;
}

@media (max-width:390px) {
  .game-screen.game-screen-arena .hand-main,
  .game-screen.game-screen-arena.display-fit .hand-main {
    padding-left:4px !important;
  }
}


/* ============================================================
   DESMOCHEE · FASE 2.3.6K
   MANO ESTABLE · SOLO SE ANIMA LA CARTA ACTIVA
   ------------------------------------------------------------
   - CAMBIO conserve o no contenido, su columna queda reservada.
   - La mano ya no se expande/contrae al aparecer/desaparecer CAMBIO.
   - Las cartas normales no animan cambios de margin/posición.
   - Solo lifted/dragging conserva feedback de interacción.
   ============================================================ */

.game-screen.game-screen-arena .hand-workspace,
.game-screen.game-screen-arena.display-fit .hand-workspace,
.game-screen.game-screen-arena .hand-workspace:has(.special-card-slot[hidden]),
.game-screen.game-screen-arena.display-fit .hand-workspace:has(.special-card-slot[hidden]) {
  grid-template-columns: minmax(0, 1fr) 60px !important;
  gap: 4px !important;
}

.game-screen.game-screen-arena .human-hand .playing-card,
.game-screen.game-screen-arena.display-fit .human-hand .playing-card {
  rotate: 0deg !important;
  translate: none !important;
  transition: none !important;
  will-change: auto !important;
}

/* La carta elegida sí conserva un feedback breve. */
.game-screen.game-screen-arena .human-hand .playing-card.lifted,
.game-screen.game-screen-arena.display-fit .human-hand .playing-card.lifted {
  transition: transform .12s ease, filter .12s ease, box-shadow .12s ease !important;
}

.game-screen.game-screen-arena .human-hand .playing-card.dragging,
.game-screen.game-screen-arena.display-fit .human-hand .playing-card.dragging {
  transition: none !important;
}