.talp-printer {
	--talp-max-width: 760px;
	--talp-slot-left: 43.5%;
	--talp-slot-top: 70%;
	--talp-label-width: 41%;
	--talp-travel: 82%;
	--talp-angle: 0deg;
	--talp-print-speed: 3.2s;
	--talp-pause: 1.5s;
	--talp-exit-speed: .8s;
	--talp-status-colour: #e61e1e;
	position: relative;
	width: min(100%, var(--talp-max-width));
	margin-inline: auto;
	isolation: isolate;
}

.talp-stage {
	position: relative;
	width: 100%;
	overflow: visible;
}

.talp-printer-image {
	position: relative;
	z-index: 3;
	display: block;
	width: 100%;
	height: auto;
	pointer-events: none;
	user-select: none;
}

.talp-paper-viewport {
	position: absolute;
	z-index: 4;
	top: var(--talp-slot-top);
	left: var(--talp-slot-left);
	width: var(--talp-label-width);
	height: var(--talp-travel);
	overflow: hidden;
	pointer-events: none;
	transform: rotate(var(--talp-angle));
	transform-origin: 50% 0;
}

.talp-paper {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: auto;
	opacity: 0;
	transform: translate3d(0, -101%, 0);
	transform-origin: 50% 0;
	will-change: transform, opacity;
	backface-visibility: hidden;
}

.talp-has-shadow .talp-paper {
	filter: drop-shadow(0 12px 9px rgba(0, 0, 0, .28));
}

.talp-paper.is-current.is-printing {
	opacity: 1;
	transition:
		transform var(--talp-print-speed) cubic-bezier(.18, .64, .24, 1),
		opacity .16s linear;
	transform: translate3d(0, 0, 0);
}

.talp-paper.is-current.is-paused {
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

.talp-has-sway .talp-paper.is-current.is-paused {
	animation: talp-paper-breathe 1.25s ease-in-out infinite alternate;
}

.talp-paper.is-current.is-exiting {
	opacity: 0;
	transition:
		transform var(--talp-exit-speed) cubic-bezier(.4, 0, 1, 1),
		opacity var(--talp-exit-speed) ease;
	transform: translate3d(0, 14%, 0) rotate(.5deg);
}

.talp-status {
	position: absolute;
	z-index: 5;
	top: 7%;
	left: 7%;
	display: inline-flex;
	align-items: center;
	gap: .55em;
	padding: .48em .72em;
	border: 1px solid color-mix(in srgb, var(--talp-status-colour) 55%, transparent);
	border-radius: 999px;
	background: rgba(0, 0, 0, .62);
	color: #fff;
	font: 600 clamp(8px, 1.35vw, 12px)/1.1 Arial, sans-serif;
	letter-spacing: .12em;
	box-shadow: 0 0 16px color-mix(in srgb, var(--talp-status-colour) 28%, transparent);
	opacity: .68;
	transition: opacity .25s ease;
}

.talp-printer.is-running .talp-status {
	opacity: 1;
}

.talp-status-dot {
	width: .62em;
	height: .62em;
	border-radius: 50%;
	background: var(--talp-status-colour);
	box-shadow: 0 0 .75em var(--talp-status-colour);
	animation: talp-status-pulse .9s ease-in-out infinite alternate;
}

.talp-pause-hover:hover .talp-paper,
.talp-pause-hover:hover .talp-status-dot {
	animation-play-state: paused !important;
	transition-duration: 999999s !important;
}

.talp-notice {
	padding: 16px 18px;
	border: 1px dashed #c9c9c9;
	border-radius: 8px;
	color: #555;
	background: #fafafa;
	font: 14px/1.45 Arial, sans-serif;
}

@keyframes talp-paper-breathe {
	from { transform: translate3d(0, 0, 0) rotate(-.18deg); }
	to { transform: translate3d(0, .8%, 0) rotate(.18deg); }
}

@keyframes talp-status-pulse {
	from { opacity: .45; transform: scale(.82); }
	to { opacity: 1; transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
	.talp-paper,
	.talp-paper.is-current,
	.talp-status-dot {
		animation: none !important;
		transition-duration: .01ms !important;
	}
}