<script setup lang="ts"></script>

<template>
  <AtomsButtonCircle sr-only="home" type="link" to="/" class="btn-home">
    <AtomsIconsHomeFill />
  </AtomsButtonCircle>
</template>

<style scoped>
.empty-game + main .btn-home {
  @apply mt-[var(--scroll-position,48px)] md:mt-[var(--scroll-position,64px)];
}
.btn-home {
  @apply fixed top-3 right-3 mt-[calc(var(--scroll-position,48px)+48px)] bg-black/20 shadow-[0_1.667px_3.333px_0_rgba(0,0,0,0.06)] backdrop-blur-[12.5px] z-[100]
  sm:top-5 md:top-6 md:right-8 md:mt-[calc(var(--scroll-position,64px)+64px)];
}
</style>
