:root {
	--th-slide-ratio: 1.78;
	--th-slide-nlines: 18;
}
.th-slideshow {
	> *:not(.th-slide-backdrop):not(#th-contactsheet) {
		display: none !important;
	}
	> .th-slide-backdrop {
		display: flex;
	}
	.th-slide {
		--font-size: calc(100vw / (var(--th-slide-nlines) * var(--th-slide-ratio)));
		font-size: var(--font-size);
	}
	.th-web-only {
		display: none;
	}
}
body:not(.th-slideshow) {
	.th-slide-only {
		display: none;
	}
}
.th-slide-backdrop {
	align-items: center;
	justify-content: center;
	overflow: hidden;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-image: repeating-linear-gradient(
		to right,
		hsl(340, 100%, 20%),
		hsl(340, 100%, 23%),
		hsl(340, 100%, 20%),
		hsl(340, 100%, 17%) 4.5%,
		hsl(340, 100%, 20%) 5%
	);
	display: grid;
	justify-items: center;
	align-content: center;
	.th-only-screen {
		display: none;
	}
}
.th-slide {
	background-color: black;
	color: white;
	width: calc(1em * var(--th-slide-nlines) * var(--th-slide-ratio));
	height: calc(1em * var(--th-slide-nlines));
	display: grid;
	grid-template-rows: auto 1fr auto;
	align-content: space-between;
	position: relative;
	box-sizing: border-box;
	& > header {
		padding: 0 1ch;
		order: -1000;
		display: flex;
		align-items: baseline;
		gap: 1ch;
		h1,
		h2,
		h3,
		p {
			margin: 0 !important;
			font-size: inherit !important;
			background: none !important;
		}
	}
	& > footer {
		order: 1000;
		padding: 0 1ch;
	}
	& > .th-slide-body {
		padding: 1em;
		overflow: auto;
		display: grid;
		// align-items: center;
		// justify-items: center;
		align-content: center;
		justify-content: center;
		> :first-child {
			margin-top: 0;
		}
		> :last-child {
			margin-bottom: 0;
		}
	}
	&.th-slide-no-header,
	&.th-slide-full {
		grid-template-rows: 1fr auto;
		> header {
			display: none;
		}
	}
	&.th-slide-no-footer {
		grid-template-rows: auto 1fr;
		> footer {
			display: none;
		}
	}
	&.th-slide-no-header.th-slide-no-footer {
		grid-template-rows: 1fr;
	}
	iframe[src^="http"],
	iframe[src^="data:"],
	object[data^="http"],
	object[data^="data:"] {
		pointer-events: none;
	}
	&.th-slide-continued > header > :last-child::after {
		font-size: .6em;
		margin-left: 1ch;
		content: "...continued";
	}
}
@import "navigation";

@mixin icon-after {
	display: flex;
	align-items: center;
	gap: 0.25ch;
	justify-content: end;
	&::after {
		font-family: Material Icons;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 1.5em;
		height: 1em;
	}
}
.th-slide-number {
	@include icon-after();
	&::after {
		content: "auto_stories";
	}
}
.th-slide-clock::after {
	content: "schedule";
}
.th-slide-time::after {
	content: "watch";
}
.th-slideshow-time::after {
	content: "av_timer";
}
.th-slide-status {
	width: 6ch;
	color: #fff2;
	cursor: pointer;
	> * {
		@include icon-after();
	}
}
.th-slide-feedback {
	--size: 0.25in;
	background-color: #fff2;
	position: absolute;
	padding: var(--size);
	border-radius: var(--size);
	margin-top: calc(-1 * var(--size));
	margin-left: -var(--size);
	box-shadow: inset 0 0 var(--size) #fff5;
	mix-blend-mode: exclusion;
}
@import "contactsheet";