Template:Scroll/styles.css

/* https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/animation-timeline
 * not stable in firefox yet
 * flag in about:config is:
 * layout.css.scroll-driven-animations.enabled
 */
@keyframes scroll-box-border {
	from, to {
		border-color: var(--BlueThemeSecondary);
		padding: .5em;
		width: 100%;
		resize: vertical;
	}
}

.desktop-scroll-box,
.scroll-box {
	overflow: auto;
	width: fit-content;
	max-width: 100%;
	height: 400px;
	max-height: max-content;
	border: 1px solid transparent;
	border-radius: var(--BorderRadius);
	margin: 3px 0;
	scrollbar-width: thin;
	animation: scroll-box-border linear both;
	animation-timeline: scroll(self);
}

.desktop-scroll-box h3,
.scroll-box h3 { margin-top: 0; }