.dk-pawtrail {
	padding-block: 8px;
}

.dk-pawtrail__inner {
	display: flex;
	align-items: center;
	gap: 16px;
}

.dk-pawtrail__line {
	height: 1px;
	flex: 1 1 0;
	background: var(--dk-border);
}

.dk-pawtrail__prints {
	display: flex;
	align-items: center;
	gap: 20px;
}

.dk-pawtrail__print {
	position: relative;
	width: 16px;
	height: 16px;
	flex: 0 0 auto;
	animation: dk-trail 4.4s ease-in-out infinite;
}

.dk-pawtrail__pad {
	position: absolute;
	left: 2px;
	bottom: 0;
	width: 12px;
	height: 9px;
	background: var(--dk-ocher);
	border-radius: 50% 50% 46% 46%;
}

.dk-pawtrail__toe {
	position: absolute;
	width: 4px;
	height: 4px;
	background: var(--dk-ocher);
	border-radius: 50%;
}

/* Opacity-only so the per-print inline rotate is preserved. */
@keyframes dk-trail {
	0%, 8% { opacity: 0; }
	18%, 62% { opacity: 1; }
	84%, 100% { opacity: 0; }
}

@media (max-width: 700px) {
	.dk-pawtrail__prints {
		gap: 12px;
	}
}