@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;600;700;800&display=swap');
html, body {
    overscroll-behavior: none;
}
body {
  font-family: 'Plus Jakarta Sans', sans-serif;
  user-select: none;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.dama-board-container {
  background: linear-gradient(135deg, #2a1810 0%, #170d08 100%);
  box-shadow: 0 20px 25px -5px rgba(0,0,0,0.5);
}

#boardCanvas {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 12px;
  touch-action: manipulation;
}

.piece-white {
  background: radial-gradient(circle at 35% 35%, #ffffff 0%, #e2e8f0 60%, #94a3b8 100%);
  border: 2px solid #cbd5e1;
  box-shadow: 0 6px 10px rgba(0,0,0,0.4);
}
.piece-black {
  background: radial-gradient(circle at 35% 35%, #334155 0%, #1e293b 60%, #0f172a 100%);
  border: 2px solid #475569;
  box-shadow: 0 6px 10px rgba(0,0,0,0.6);
}

.card-active {
  border-color: #f59e0b !important;
  box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.15), 0 0 20px rgba(245, 158, 11, 0.25);
  background: linear-gradient(180deg, rgba(245, 158, 11, 0.08), rgba(245, 158, 11, 0.02)) !important;
}
.card-active #selfName,
.card-active #opponentName {
  color: #fbbf24 !important;
}

#countdownNumber {
  transition: transform 0.4s ease-out, opacity 0.3s ease-out;
}