@layer cm {
	.cm-toks {
		--cm-toks-size: 114.24%;
		--cm-toks-shift-x: -6.92%;
		--cm-toks-shift-y: 6.27%;
		pointer-events: none;
		position: absolute;
		inset: 0;
		-webkit-user-select: none;
		user-select: none;
	}

	.cm-toks--avatar {
		--cm-toks-size: 88%;
		--cm-toks-shift-x: 6.8%;
		--cm-toks-shift-y: 6%;
	}

	.cm-toks__pool {
		position: absolute;
		inset: 0;
	}

	.cm-toks__layer {
		position: absolute;
		left: 0;
		bottom: 0;
		width: var(--cm-toks-size);
		max-width: none;
		height: auto;
		aspect-ratio: 1;
		object-fit: contain;
		translate: var(--cm-toks-shift-x) var(--cm-toks-shift-y);
		opacity: 0;
		transition: opacity .3s ease-in-out;
	}

	.cm-toks__video {
		transition: none;
	}

	.cm-toks__layer--ready {
		opacity: 1;
	}

	@media (prefers-reduced-motion: reduce) {
		.cm-toks__layer {
			transition: none;
		}
	}
}
