How to move the title to the right or centered on the title slide in xaringan?

For some reason, my code does work as I intend. I want my title right-aligned with the following code, but for some reason, it does not work. Any mistake I made here?

My code is

---
title: "Lecture"
author: "Instructor"
institute: "University"
output: 
  xaringan::moon_reader:
    css: [default, metropolis, metropolis-fonts, "styles.css"]
    lib_dir: libs
    seal: false
    nature:
      highlightStyle: arta
      highlightLines: true
      countIncrementalSlides: false
      titleSlideClass: [top, right]
---
class: title-slide, top, right, inverse
background-image: url(aaa.jpeg)
background-size: cover

# *`r rmarkdown::metadata$title`*
## *`r rmarkdown::metadata$subtitle`*
### `r rmarkdown::metadata$author`
### `r rmarkdown::metadata$institute`
### `r rmarkdown::metadata$date`
### `r Sys.Date()`

```{css, echo=FALSE}
<style>
.remark-slide-content.hljs-default {
  border-top: 40px solid #23373B;
}

.remark-slide-content > h1 {
  font-size: 35px;
  margin-top: -85px;
}

</style>
```

```{r setup, include=FALSE}
options(htmltools.dir.version = FALSE)
```

class: title-slide, top, right is not working because for metropolis theme title-slide headers are left aligned. So AFAIK, one option could be, overwrite them using CSS again.

```{css, echo=FALSE}
.remark-slide-content .hljs-default {
  border-top: 40px solid #23373B;
}

.remark-slide-content > h1 {
  font-size: 35px;
  margin-top: -85px;
}

.title-slide h1, 
.title-slide h2, 
.title-slide h3 {
  text-align: right;
}
```