/* The ready class is added only after JavaScript has found the cards. */
html.hasaki-card-effects-ready .hasaki-card-effects-target {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	translate: 0 var(--hasaki-card-entry-y, 0px);
	scale: 0.985;
	transition-property: opacity, transform, translate, scale, box-shadow;
	transition-duration: var(--hasaki-card-entry-duration, 600ms), 500ms, var(--hasaki-card-entry-duration, 600ms), 180ms, 220ms;
	transition-timing-function: ease, ease, cubic-bezier(0.22, 1, 0.36, 1), ease-out, ease;
	will-change: opacity, translate;
}

html.hasaki-card-effects-ready .hasaki-card-effects-target.hasaki-card-effects-visible {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	translate: 0 0;
	scale: 1;
}

html.hasaki-card-effects-ready .hasaki-card-effects-target.hasaki-card-effects-visible:active,
html.hasaki-card-effects-ready .hasaki-card-effects-target.hasaki-card-effects-visible.hasaki-card-effects-pressed {
	scale: 0.98;
}

@media (hover: hover) and (pointer: fine) {
	html.hasaki-card-effects-ready .hasaki-card-effects-target.hasaki-card-effects-visible:hover {
	cursor: pointer;
	translate: 0 -8px;
	scale: 1.01;
	box-shadow: 0 16px 32px rgba(50, 50, 93, 0.16), 0 6px 12px rgba(0, 0, 0, 0.1);
	}

	html.hasaki-card-effects-ready .hasaki-card-effects-target.hasaki-card-effects-visible:hover.hasaki-card-effects-pressed {
	scale: 0.98;
	}
}