/* Pre-game setup phase: functional styling only. */
body[data-game-phase="setup"] .centre-zone {
  opacity: .32;
  pointer-events: none;
}

body[data-game-phase="setup"] .self-face-row .face-stack,
body[data-game-phase="setup"] .self-face-row .setup-table-card,
body[data-game-phase="setup"] .hand button.card {
  cursor: pointer;
}

body[data-game-phase="setup"] .self-face-row .face-stack:hover .card:not(.card-back),
body[data-game-phase="setup"] .hand button.card:hover {
  box-shadow: 0 0 0 3px rgba(240,194,123,.65), 0 10px 22px rgba(0,0,0,.34);
}

body[data-game-phase="setup"] .setup-selected {
  box-shadow: 0 0 0 4px var(--accent), 0 10px 22px rgba(0,0,0,.38) !important;
  transform: translateY(-12px) scale(1.04) !important;
  z-index: 190 !important;
}

/* During setup, put the controls visibly between the table cards and hand.
   Do not inherit the normal play-action position below the table edge. */
body[data-game-phase="setup"] .setup-actions {
  position: absolute !important;
  left: 50% !important;
  bottom: 8.5% !important;
  transform: translateX(-50%) !important;
  z-index: 230 !important;
  min-width: min(650px, 94%);
  margin: 0 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 8px 12px;
  border-radius: 14px;
  background: rgba(28,18,12,.58);
  box-shadow: 0 5px 16px rgba(0,0,0,.24);
}

.setup-ready {
  min-width: 110px;
  min-height: 42px;
  border: 1px solid var(--accent);
  border-radius: 999px;
  background: rgba(0,0,0,.68);
  color: #fff;
  padding: 9px 18px;
  font-weight: 900;
  letter-spacing: .06em;
}

.setup-ready:disabled {
  opacity: .7;
  cursor: default;
}

.setup-hint {
  max-width: 455px;
  color: rgba(255,255,255,.92);
  font-size: .78rem;
  line-height: 1.28;
  text-align: left;
}

body[data-game-phase="setup"] .player-label::after {
  content: " — click one to swap";
  color: var(--accent);
}

@media (max-height: 760px) and (min-width: 701px) {
  body[data-game-phase="setup"] .setup-actions {
    bottom: 7.5% !important;
    transform: translateX(-50%) scale(.9) !important;
    transform-origin: center bottom;
  }
}

@media (max-width: 700px) {
  body[data-game-phase="setup"] .setup-actions {
    bottom: 8% !important;
    min-width: 94%;
    gap: 7px;
    padding: 6px 8px;
    transform: translateX(-50%) scale(.86) !important;
    transform-origin: center bottom;
  }
  .setup-hint { max-width: 260px; font-size: .68rem; }
  .setup-ready { min-width: 90px; min-height: 38px; padding: 7px 12px; }
}