:root {
	--color-text: navy;
	--color-bg: papayawhip;
	--color-bg-accent: #ecdcc0;
	--size: clamp(10rem, 1rem + 40vmin, 30rem);
	--gap: calc(var(--size) / 14);
	--duration: 60s;
	--scroll-start: 100vw;
	--scroll-end: calc(-200vw - var(--gap));
}

.marquee-scroller {
	visibility: hidden;
}

.simply-scroll .simply-scroll-list li img {
	object-fit: cover;
	border-radius: 6px;
	width: 200px;
}

.simply-scroll .simply-scroll-clip {
	width: 100%;
	height: auto;
	padding: 20px 0;
	gap: var(--gap);
	mask-image: linear-gradient(var(--mask-direction, to right), hsla(0, 0%, 0%, 0), hsla(0, 0%, 0%, 1) 5%, hsla(0, 0%, 0%, 1) 95%, hsla(0, 0%, 0%, 0));
}

.simply-scroll {
	height: auto !important;
}

.vert .simply-scroll-list li img {
	height: 125px;
	object-fit: cover;
	aspect-ratio: 16/9;
	object-position: center center;
	border-radius: 6px;
}

.vert {
	width: 270px;
	margin-bottom: 1.5em;
}

.vert, .vert .simply-scroll-clip {
	height: 600px;
}

.vert .simply-scroll-list li {
	padding: 1em 0;
	height: auto;
	width: 250px;
}

.vert .simply-scroll-btn-up {
	right: 0;
	top: 0;
}

.vert .simply-scroll-btn-down {
	right: 0;
	top: 52px;
}

.simply-scroll .simply-scroll-list li {
	padding: 0 1em;
}