/* Shared controls and hover treatment across every page and viewport. */
.back-to-top { position: fixed; right: max(16px, env(safe-area-inset-right)); bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 30; display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 44px; height: 44px; min-height: 44px; padding: 0; border: 1px solid #1f6b4f; border-radius: 12px; background: #1f6b4f; color: #fff; font: inherit; font-size: .78rem; font-weight: 500; cursor: pointer; box-shadow: 0 4px 16px rgba(9,22,18,.18); transition: background 180ms ease, color 180ms ease; }
.back-to-top svg { width: 18px; height: 18px; }
.back-to-top[hidden] { display: none !important; }
.back-to-top:focus-visible { outline: 2px solid #a7d94b; outline-offset: 3px; }
/* These shared colors take priority over existing component hover rules. */
:is(.button--primary, .nav-links__cta, .about-tabs__link, .about-panel__cta, .about-tabs__tab.is-active, .gallery-tabs button[aria-selected="true"], .editor-button--primary, .editor-tab[aria-selected="true"], .editor-hero__actions a, .back-to-top):is(:hover, :focus-visible) { background: #111111 !important; color: #a7d94b !important; border-color: #111111; }
@media (prefers-reduced-motion: reduce) { .back-to-top { transition: none; } }