/* HaiGames SDK — Tic-Tac-Toe game specific styles
 *
 * 共用的 overlay/sheet/header/status/comment/action-btn 在 games/games.css。
 * 本文件只放 TTT 特有元素。
 */

.hg-ttt-score {
  text-align: center; font-size: 13px;
  color: rgba(255, 255, 255, 0.45); margin-bottom: 16px; letter-spacing: 0.5px;
}
.hg-ttt-score span {
  color: rgba(255, 255, 255, 0.85); font-weight: 700; font-size: 20px; margin: 0 10px;
}

.hg-ttt-board {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 8px; max-width: 270px; margin: 0 auto 18px;
}

.hg-ttt-cell {
  aspect-ratio: 1;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  font-size: 36px; font-weight: 800;
  cursor: pointer; user-select: none;
  transition: background 0.15s, transform 0.1s, border-color 0.15s;
}
.hg-ttt-cell:hover:not(.taken) {
  background: rgba(167, 139, 250, 0.12); border-color: rgba(167, 139, 250, 0.3);
}
.hg-ttt-cell:active:not(.taken) { transform: scale(0.93); }
.hg-ttt-cell.taken { cursor: default; }
.hg-ttt-cell.x { color: #a78bfa; }
.hg-ttt-cell.o { color: #f472b6; }
.hg-ttt-cell.winner {
  background: rgba(167, 139, 250, 0.2); border-color: rgba(167, 139, 250, 0.6);
  animation: hg-ttt-winPulse 0.5s ease forwards;
}
@keyframes hg-ttt-winPulse {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.09); }
  100% { transform: scale(1); }
}