#backToTop {
  opacity: 0;
  pointer-events: none;
  transform: translateY(20px) scale(0.9);
  background: var(--btt-bg, var(--green-dark)) !important;
  color: var(--btt-fg, #ffffff) !important;
  transition: opacity .4s cubic-bezier(.25,.8,.25,1),
              transform .4s cubic-bezier(.25,.8,.25,1),
              background .25s;
  font-family: var(--font-body);
  font-weight: 700;
  box-shadow: 0 4px 16px rgba(75,122,8,0.35);
}

#backToTop:hover {
  background: var(--btt-hover-bg, var(--text-dark)) !important;
  transform: translateY(-2px) scale(1.05) !important;
}

#backToTop.visible {
  opacity: 1;
  pointer-events: all;
  transform: translateY(0) scale(1);
}

@media (max-width: 479px) {
  #backToTop {
    width: 36px !important;
    height: 36px !important;
    bottom: 16px;
    right: 16px;
    font-size: 0.85rem;
  }
}