fix: replace back-to-top button icon with SVG for improved accessibility and styling

css/style.css

@@ -1606,10 +1606,8 @@ footer.footer-modern a:hover {
 	border-radius: 50%;
 	background: var(--accent);
 	color: var(--accent-contrast);
-	font-size: 1.25rem;
-	display: flex;
-	align-items: center;
-	justify-content: center;
+	display: grid;
+	place-items: center;
 	cursor: pointer;
 	box-shadow: var(--shadow-md);
 	opacity: 0;
@@ -1629,15 +1627,10 @@ footer.footer-modern a:hover {
 	background: var(--accent-hover);
 }
 
-/* The <i> fills the button and flex-centres its ::before glyph, so neither
-   Bootstrap Icons' vertical-align:-.125em nor glyph side-bearing can offset it */
-.back-to-top i {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	width: 100%;
-	height: 100%;
-	line-height: 1;
+/* Inline SVG arrow — centred in its own viewBox, so no font baseline/bearing
+   offsets. grid place-items on the button does the rest. */
+.back-to-top svg {
+	display: block;
 }
 
 /* ========================================