/**
 * ePaper screen and page viewer. Uses the theme's custom properties, with fallbacks.
 */
.epaper { padding-block: var(--s-6, 32px) var(--s-8, 64px); }

.epaper__head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--s-4, 16px);
	margin-bottom: var(--s-6, 32px);
	padding-bottom: var(--s-5, 24px);
	border-bottom: 1px solid var(--line, #e3e8ef);
}
.epaper__title {
	margin: 0;
	color: var(--heading, #082577);
	font-size: var(--fs-1, 2.25rem);
}
.epaper__date {
	margin: var(--s-1, 4px) 0 0;
	color: var(--muted, #5f6b7a);
	font-size: var(--fs-7, 0.875rem);
}
.epaper__tools {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--s-2, 8px);
}
.epaper__picker {
	display: flex;
	flex-wrap: wrap;
	min-width: 0;
	align-items: center;
	gap: var(--s-2, 8px);
}
.epaper__picker label {
	color: var(--muted, #5f6b7a);
	font: 500 var(--fs-7, 0.875rem) / 1.4 var(--font-ui, sans-serif);
}
.epaper__picker input {
	min-height: 44px;
	padding: 0 var(--s-2, 8px);
	border: 1px solid var(--line-strong, #8a94a6);
	border-radius: var(--radius, 4px);
	background: var(--bg, #fff);
	color: var(--ink, #0b1220);
	font: 500 var(--fs-7, 0.875rem) / 1 var(--font-ui, sans-serif);
}
.epaper__notice {
	padding: var(--s-4, 16px);
	border-radius: var(--radius, 4px);
	background: var(--bg-soft, #f5f7fa);
	color: var(--text, #2b303b);
}

/* Page thumbnails */
.epaper__pages {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr));
	gap: var(--s-5, 24px) var(--gutter, 24px);
	margin: 0 0 var(--s-8, 64px);
	padding: 0;
	list-style: none;
}
@media (min-width: 1024px) {
	.epaper__pages { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
.epaper__thumb {
	display: grid;
	gap: var(--s-2, 8px);
	width: 100%;
	padding: 0;
	text-align: center;
	cursor: zoom-in;
}
.epaper__thumb img {
	display: block;
	width: 100%;
	height: auto;
	border: 1px solid var(--line, #e3e8ef);
	box-shadow: 0 2px 8px rgb(0 0 0 / 0.08);
	transition: transform 0.15s, box-shadow 0.15s;
}
.epaper__thumb:focus-visible img { transform: translateY(-2px); box-shadow: 0 6px 18px rgb(0 0 0 / 0.14); }
@media (hover: hover) {
	.epaper__thumb:hover img { transform: translateY(-2px); box-shadow: 0 6px 18px rgb(0 0 0 / 0.14); }
}
.epaper__page-no {
	color: var(--muted, #5f6b7a);
	font: 500 var(--fs-7, 0.875rem) / 1.4 var(--font-ui, sans-serif);
}
@media (prefers-reduced-motion: reduce) {
	.epaper__thumb img { transition: none; }
	.epaper__thumb:hover img { transform: none; }
}

/* Viewer (full screen) */
.epaper-viewer {
	width: 100vw;
	max-width: none;
	height: 100dvh;
	max-height: none;
	margin: 0;
	padding: 0;
	border: 0;
	background: #111;
	color: #fff;
}
.epaper-viewer[open] { display: flex; flex-direction: column; }
.epaper-viewer::backdrop { background: rgb(0 0 0 / 0.85); }

.epaper-viewer__bar {
	display: flex;
	align-items: center;
	gap: var(--s-1, 4px);
	padding: var(--s-1, 4px) var(--s-2, 8px);
	background: #000;
}
.epaper-viewer__bar button {
	display: grid;
	place-items: center;
	min-width: 44px;
	height: 44px;
	border-radius: var(--radius, 4px);
	color: #fff;
	font-size: var(--fs-4, 1.25rem);
	line-height: 1;
}
@media (hover: hover) {
	.epaper-viewer__bar button:hover:not([aria-disabled="true"]) { background: rgb(255 255 255 / 0.12); }
}
.epaper-viewer__bar button[aria-disabled="true"] { opacity: var(--disabled-opacity, 0.5); }
.epaper-viewer__count {
	margin: 0 var(--s-2, 8px);
	font: 700 var(--fs-7, 0.875rem) / 1 var(--font-ui, sans-serif);
	white-space: nowrap;
}
.epaper-viewer__spacer { flex: 1; }

.epaper-viewer__stage {
	flex: 1;
	overflow: auto;
	overscroll-behavior: contain;
}
.epaper-viewer__stage:focus-visible { outline: 2px solid var(--sky, #8CC8F5); outline-offset: -2px; }
.epaper-viewer__stage img {
	display: block;
	max-width: none;
	height: auto;
	margin: 0 auto;
	background: #fff;
	cursor: zoom-in;
	user-select: none;
	-webkit-user-drag: none;
}
.epaper-viewer__stage.is-zoomed img { cursor: grab; }
.epaper-viewer__stage.is-zoomed img:active { cursor: grabbing; }

/* Month calendar */
.epaper-calendar { max-width: 640px; }
.epaper-calendar__head {
	display: flex;
	align-items: center;
	gap: var(--s-3, 12px);
	margin-bottom: var(--s-3, 12px);
}
.epaper-calendar__head h2 {
	flex: 1;
	margin: 0;
	color: var(--heading, #082577);
	font-size: var(--fs-4, 1.25rem);
	text-align: center;
}
.epaper-calendar__grid {
	width: 100%;
	border-collapse: separate;
	border-spacing: 4px;
	table-layout: fixed;
}
.epaper-calendar__grid th {
	color: var(--muted, #5f6b7a);
	font: 500 var(--fs-7, 0.875rem) / 1.4 var(--font-ui, sans-serif);
}
.epaper-calendar__grid td { padding: 0; text-align: center; }
.epaper-calendar__grid a,
.epaper-calendar__none {
	display: grid;
	min-height: 52px;
	place-content: center;
	border-radius: var(--radius, 4px);
	line-height: 1.2;
}
.epaper-calendar__grid a {
	background: var(--tint, #EAF3FF);
	color: var(--blue, #0B5ED3);
	font-weight: 700;
}
@media (hover: hover) {
	.epaper-calendar__grid a:hover { background: var(--fill-selected, #0B5ED3); color: var(--white, #fff); }
}
/* Days without an edition: plain muted text at full opacity (dimming it drops it to 2:1). */
.epaper-calendar__none { color: var(--muted, #5f6b7a); }
.epaper-calendar__grid .is-today > * { outline: 2px solid var(--brand, #D5040A); outline-offset: -2px; }
.epaper-calendar__ad { font-size: var(--fs-7, 0.875rem); }
.epaper-calendar__bs { font-size: var(--fs-7, 0.875rem); font-weight: 500; }