.games-hub-link {
  position: absolute;
  z-index: 121;
  top: max(0.8rem, env(safe-area-inset-top));
  left: max(0.8rem, env(safe-area-inset-left));
  display: inline-flex;
  width: 11rem;
  height: 3.5rem;
  min-height: 3.5rem;
  padding: 0 0.9rem;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  border: 1px solid rgb(98 82 245 / 16%);
  border-radius: 0.95rem;
  color: var(--app-ink);
  font-size: 0.78rem;
  font-weight: 900;
  white-space: nowrap;
  text-decoration: none;
  background: rgb(255 255 255 / 84%);
  box-shadow: 0 0.55rem 1.5rem rgb(46 43 91 / 10%);
  backdrop-filter: blur(1rem);
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.games-hub-link:hover {
  transform: translateY(-0.1rem);
  box-shadow: 0 0.7rem 1.7rem rgb(46 43 91 / 16%);
}

.games-hub-link:focus-visible {
  outline: 4px solid #fbbf24;
  outline-offset: 3px;
}

.games-hub-icon {
  width: 1.55rem;
  height: 1.55rem;
  flex: 0 0 auto;
}

html[data-theme="dark"] .games-hub-link {
  border-color: rgb(167 139 250 / 28%);
  color: var(--app-ink);
  background: rgb(26 30 52 / 88%);
}

body.access-locked .games-hub-link {
  visibility: hidden;
}

body.gameplay-view .games-hub-link,
body.settings-view .games-hub-link {
  display: none;
}

body:not(.home-view):not(.gameplay-view):not(.settings-view) .home-button {
  left: calc(max(0.8rem, env(safe-area-inset-left)) + 11.5rem);
}

@media (max-width: 42rem) {
  .games-hub-link {
    width: 3.25rem;
    height: 3.25rem;
    min-height: 3.25rem;
    padding: 0;
    justify-content: center;
  }

  .games-hub-link span {
    display: none;
  }

  body:not(.home-view):not(.gameplay-view):not(.settings-view) .home-button {
    left: calc(max(0.8rem, env(safe-area-inset-left)) + 3.75rem);
  }
}

@media (max-width: 23rem) {
  .games-hub-link {
    width: 3.1rem;
    height: 3.1rem;
    min-height: 3.1rem;
  }

  body:not(.home-view):not(.gameplay-view):not(.settings-view) .home-button {
    left: calc(max(0.8rem, env(safe-area-inset-left)) + 3.6rem);
  }
}

@media (hover: none) {
  .games-hub-link:hover {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .games-hub-link {
    transition: none;
  }
}
