.__preload-loading {
	position: fixed;
	top: 50vh;
	left: 50vw;
	transform: translate(-50%, -50%);

	/* 图案颜色 */
	--page-loading-color: #0052d9;
	/* 整体尺寸 */
	--page-loading-size: 60px;
	/* 轨道宽度 */
	--page-loading-border-width: calc(var(--page-loading-size) * 0.1);
	/* 轨道颜色 */
	--page-loading-border-color: var(--td-bg-color-page, #fff);
	/* 背景颜色 */
	--page-loading-background-color: var(--td-bg-color-page, #fff);
	/* 动画周期时长 */
	--page-loading-duration: 0.75s;
}

.__preload-loading .__loading-text {
	text-align: center;
	margin-top: 10px;
}

.__preload-loading .__loading-containner {
	background-color: var(--page-loading-border-color);
	border-radius: 50%;
	animation: roll var(--page-loading-duration) ease-in-out infinite;
}

.__preload-loading .__loading-containner .__loading-cycle {
	width: var(--page-loading-size, 200px);
	height: var(--page-loading-size, 200px);
	position: relative;
}

.__preload-loading .__loading-containner .__loading-cycle:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 50%;
	height: 100%;
	background: linear-gradient(0, transparent, var(--page-loading-color));
	background-size: 50% 100%;
	border-top-left-radius: calc(var(--page-loading-size, 200px) * 0.5);
	border-bottom-left-radius: calc(var(--page-loading-size, 200px) * 0.5);
}

.__preload-loading .__loading-containner .__loading-cycle:after {
	content: '';
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%);
	width: calc(var(--page-loading-size, 200px) * 0.1);
	height: calc(var(--page-loading-size, 200px) * 0.1);
	border-radius: 50%;
	background-color: var(--page-loading-color);
	box-shadow:
		0 0 20px var(--page-loading-color),
		0 0 40px var(--page-loading-color),
		0 0 50px var(--page-loading-color);
}

.__preload-loading .__loading-containner .__loading-cycle span {
	position: absolute;
	top: var(--page-loading-border-width, 10px);
	left: var(--page-loading-border-width, 10px);
	right: var(--page-loading-border-width, 10px);
	bottom: var(--page-loading-border-width, 10px);
	border-radius: 50%;
	background: var(--page-loading-background-color, #0005);
}

@keyframes roll {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}