body {
	max-width: 600px;
	margin: 0 auto;
	padding: 20px;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

:root {
	font-family: sans-serif;
}

#printer-output {
	color-scheme: light;
	display: flex;
	flex-direction: column;
	height: 80vh; /* Example height, adjust as needed */
	overflow-y: scroll;
	border: 1px solid light-dark(#ccc, #333); /* Just for visualization */
	scrollbar-gutter: stable both-sides;
}

#printer-output::before {
	content: '';
	flex-basis: 100%;
	flex-shrink: 0;
}

.paper {
	background-color: white;
	color: black;
	padding: 10px;
}

.paper:empty {
	display: none;
}

#printer-output img {
	max-width: 100%;
	height: auto;
	display: block;
}

.cut-line {
	border: 1px solid
		light-dark(#999, #666); /* Solid border for clear visibility */
	background-color: light-dark(
		#f0f0f0,
		#1a1a1a
	); /* Light background for contrast */
	height: 20px; /* Give it a fixed height */
	display: flex; /* Use flexbox for centering text */
	align-items: center; /* Center vertically */
	justify-content: center; /* Center horizontally */
	margin: 10px 0;
	font-size: 0.8em;
	color: light-dark(#666, #999);
}