/* "Back to top" button (08 §7.2). Bottom-right, above page content, below the drawer (40), consent (45) and toasts (50). */
.back-top {
  position: fixed; z-index: 25;
  right: var(--space-4); bottom: calc(var(--space-4) + var(--back-top-lift, 0px));
  display: inline-grid; place-items: center; width: var(--tap-min); height: var(--tap-min);
  border: 1px solid var(--color-border-strong); border-radius: 50%;
  background: var(--color-surface-raised); color: var(--color-primary); box-shadow: var(--shadow-2);
  opacity: 0; visibility: hidden; transform: translateY(var(--space-2));
  transition: opacity var(--dur-base) var(--ease), transform var(--dur-base) var(--ease), visibility 0s linear var(--dur-base),
              bottom var(--dur-base) var(--ease);
}
.back-top.is-visible {
  opacity: 1; visibility: visible; transform: none;
  transition: opacity var(--dur-base) var(--ease), transform var(--dur-base) var(--ease), visibility 0s, bottom var(--dur-base) var(--ease);
}
.back-top:hover { background: var(--color-primary); color: var(--color-on-primary); border-color: var(--color-primary); }
.back-top svg { width: var(--icon-md); height: var(--icon-md); transform: rotate(-90deg); }
@media (min-width: 768px) { .back-top { right: var(--space-5); bottom: calc(var(--space-5) + var(--back-top-lift, 0px)); } }
@media (prefers-reduced-motion: reduce) { .back-top, .back-top.is-visible { transition: none; transform: none; } }
/* Focus lands on <main> after the jump (programmatic, tabindex -1): no ring around the whole page. */
main[tabindex="-1"]:focus { outline: none; }