* {
  -webkit-tap-highlight-color: transparent;
}

body {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.cell {
  align-items: center;
  aspect-ratio: 1 / 1;
  background: #ffffff;
  border: 1px solid #cbd5e1;
  border-radius: 0.5rem;
  color: #0f172a;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
  display: flex;
  font-size: clamp(2.75rem, 12vw, 6rem);
  font-weight: 950;
  justify-content: center;
  line-height: 1;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.cell:not(:disabled):hover {
  background: #f0fdfa;
  border-color: #14b8a6;
  box-shadow: 0 12px 24px rgba(20, 184, 166, 0.16);
  transform: translateY(-1px);
}

.cell:disabled {
  cursor: default;
}

.cell-x {
  color: #0f766e;
  text-shadow: 0 8px 24px rgba(15, 118, 110, 0.18);
}

.cell-o {
  color: #d97706;
  text-shadow: 0 8px 24px rgba(217, 119, 6, 0.18);
}

.cell-win {
  background: #dcfce7;
  border-color: #22c55e;
  color: #166534;
  box-shadow: 0 12px 26px rgba(34, 197, 94, 0.2);
}