/** * Back-to-top button — theme-neutral, byte-identical across the theme family. * * The button is appended to (a sibling of ) by back-to-top.js, so * the whole-site reading-theme rules (scoped to `... body`) never restyle it. * It keeps its own neutral colours and adapts to the OS light/dark scheme. */ .evg-back-to-top { position: fixed; right: 20px; bottom: 20px; z-index: 2147482000; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0; padding: 0; border: none; border-radius: 9999px; background-color: rgba(17, 17, 17, 0.72); color: #ffffff; cursor: pointer; opacity: 0; visibility: hidden; transform: translateY(12px); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25); transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease, background-color 0.2s ease; -webkit-appearance: none; appearance: none; } .evg-back-to-top.is-visible { opacity: 1; visibility: visible; transform: translateY(0); } .evg-back-to-top:hover { background-color: rgba(0, 0, 0, 0.9); } .evg-back-to-top:focus-visible { outline: 2px solid #ffffff; outline-offset: 2px; } .evg-back-to-top svg { display: block; width: 24px; height: 24px; fill: currentColor; } @media (prefers-color-scheme: dark) { .evg-back-to-top { background-color: rgba(240, 240, 240, 0.85); color: #111111; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5); } .evg-back-to-top:hover { background-color: #ffffff; } .evg-back-to-top:focus-visible { outline-color: #111111; } } @media (prefers-reduced-motion: reduce) { .evg-back-to-top { transform: none; transition: opacity 0.01ms, visibility 0.01ms; } }