diff --git a/frontend/src/components/Standings.tsx b/frontend/src/components/Standings.tsx
index fdf4c07..09fe1db 100644
--- a/frontend/src/components/Standings.tsx
+++ b/frontend/src/components/Standings.tsx
@@ -148,7 +148,7 @@ export default function Standings({ standings, guesses = [], players, myOrder, d
});
const scrollableRounds = (
-
+
{rows}
{/* Active round placeholder */}
diff --git a/frontend/src/index.css b/frontend/src/index.css
index 8b758f3..f71b75c 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -30,6 +30,27 @@
}
}
+/* Slim, on-theme scrollbar (velvet felt + gold accent) for opt-in scroll areas
+ such as the in-game score list, instead of the chunky OS default. */
+.velvet-scroll {
+ scrollbar-width: thin;
+ scrollbar-color: rgba(201, 168, 76, 0.35) transparent;
+}
+.velvet-scroll::-webkit-scrollbar {
+ width: 7px;
+ height: 7px;
+}
+.velvet-scroll::-webkit-scrollbar-track {
+ background: transparent;
+}
+.velvet-scroll::-webkit-scrollbar-thumb {
+ background: rgba(201, 168, 76, 0.28);
+ border-radius: 4px;
+}
+.velvet-scroll::-webkit-scrollbar-thumb:hover {
+ background: rgba(201, 168, 76, 0.5);
+}
+
/* Velvet-table animations (design handoff). Declared as raw CSS so they work
both via Tailwind's animate-* utilities and inline `animation:` strings. */
@keyframes tp {