.tt-book-preview {
	position: relative;
	z-index: 1;
	width: 100%;
	aspect-ratio: 2 / 3;
	overflow: visible !important;
}

.tt-book-preview.tt-book-open {
	z-index: 100;
}

.tt-book-card-open {
	position: relative !important;
	z-index: 100 !important;
	overflow: visible !important;
}

.tt-book-link {
	display: block;
	width: 100%;
	height: 100%;
	color: inherit;
	text-decoration: none;
	overflow: visible !important;
}

.tt-book-stage {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	min-width: 0 !important;
	min-height: 0 !important;
	box-sizing: border-box;
	overflow: hidden !important;
	perspective: 1400px;
	background: #f7f4ee;
	box-shadow: 0 5px 16px rgba(28, 23, 18, 0.16);
	transition: width 600ms ease, left 600ms ease;
}

.tt-book-stage.tt-book-open {
	left: -50% !important;
	width: 200% !important;
}

.tt-book-stage img {
	position: absolute !important;
	inset: 0 !important;
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
	min-width: 0 !important;
	min-height: 0 !important;
	margin: 0 !important;
	object-fit: contain;
	user-select: none;
	-webkit-user-drag: none;
	pointer-events: none;
}

.tt-book-stage img[hidden] {
	display: none !important;
}

.tt-book-under {
	position: absolute !important;
	inset: 0 !important;
	z-index: 1;
	visibility: hidden;
}

.tt-book-open .tt-book-under {
	visibility: visible;
}

.tt-book-page {
	position: absolute;
	top: 0;
	width: 50%;
	height: 100%;
	overflow: hidden;
	background: #fffdf8;
}

.tt-book-left {
	left: 0;
}

.tt-book-right {
	left: 50%;
}

.tt-book-page img {
	object-fit: cover !important;
	object-position: center center !important;
}

.tt-book-leaf {
	position: absolute !important;
	inset: 0 !important;
	z-index: 2;
	transform: rotateY(0deg);
	transform-origin: left center;
	transform-style: preserve-3d;
	transition: transform 700ms cubic-bezier(0.48, 0.02, 0.24, 1), left 600ms ease, width 600ms ease;
}

.tt-book-open .tt-book-leaf {
	left: 50% !important;
	width: 50% !important;
}

.tt-book-leaf.tt-is-turning {
	transform: rotateY(-180deg);
}

.tt-book-leaf.tt-is-resetting {
	transform: rotateY(0deg);
	transition: none !important;
}

.tt-book-face {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}

.tt-book-stage:not(.tt-book-turned) .tt-book-front img {
	object-fit: fill !important;
	object-position: center center !important;
}

.tt-book-stage.tt-book-turned .tt-book-front img,
.tt-book-stage .tt-book-back img {
	object-fit: cover !important;
	object-position: center center !important;
}

.tt-book-back {
	transform: rotateY(180deg);
}

.tt-book-spine {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	z-index: 3;
	width: 3%;
	background: linear-gradient(90deg, rgba(30, 24, 18, 0.24), rgba(30, 24, 18, 0));
	pointer-events: none;
}

.tt-book-open .tt-book-spine {
	left: 49.5%;
	width: 1%;
}

.tt-book-preview-button {
	position: absolute;
	right: 10px;
	bottom: 10px;
	z-index: 101;
	padding: 8px 12px;
	border: 0;
	border-radius: 4px;
	background: rgba(30, 24, 18, 0.82);
	color: #fff;
	font: inherit;
	cursor: pointer;
}

@media (hover: hover) and (pointer: fine) {
	.tt-book-preview-button {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.tt-book-stage,
	.tt-book-leaf {
		transition: none;
	}
}
