.blog-back-link {
  position: fixed;
  left: 80%;
  bottom: max(32px, calc(env(safe-area-inset-bottom) + 16px));
  z-index: 1000;
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
  border: 0;
  border-radius: 999px;
  background: #c8ff3d;
  box-shadow: 0 8px 24px rgb(19 28 16 / 22%);
  color: #182016;
  font: 700 14px/1.2 Inter, ui-sans-serif, system-ui, -apple-system, sans-serif;
  text-decoration: none;
  translate: -50% 0;
}

.blog-back-link:hover {
  background: #b9f52e;
  translate: -50% -1px;
}

.blog-back-link:focus-visible {
  outline: 3px solid #ff3da8;
  outline-offset: 3px;
}

@media (max-width: 560px) {
  .blog-back-link {
    left: auto;
    right: max(12px, env(safe-area-inset-right));
    bottom: max(24px, calc(env(safe-area-inset-bottom) + 12px));
    translate: 0;
  }

  .blog-back-link:hover {
    translate: 0 -1px;
  }
}