.pwr-reader {
	--pwr-accent: #1d4ed8;
	--pwr-border: #d9dee8;
	--pwr-surface: #ffffff;
	--pwr-muted: #5c6472;
	max-width: 800px;
	margin: 2rem auto;
	color: #1c2430;
}

.pwr-reader__status {
	margin-bottom: 0.65rem;
	color: var(--pwr-muted);
	font-size: 0.9rem;
	text-align: right;
}

.pwr-reader__pages {
	min-height: 28rem;
	padding: clamp(1.25rem, 4vw, 3.5rem);
	background: var(--pwr-surface);
	border: 1px solid var(--pwr-border);
	border-radius: 10px;
	box-shadow: 0 12px 30px rgba(25, 35, 55, 0.08);
}

.pwr-reader__page:focus {
	outline: 3px solid color-mix(in srgb, var(--pwr-accent) 35%, transparent);
	outline-offset: 8px;
}

.pwr-reader__page > :first-child {
	margin-top: 0;
}

.pwr-reader__page > :last-child {
	margin-bottom: 0;
}

.pwr-reader__page p,
.pwr-reader__page li {
	line-height: 1.75;
}

.pwr-reader__page img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 1.5rem auto;
}

.pwr-tab {
	display: inline-block;
	width: 2em;
	white-space: pre;
}

.pwr-table-wrap {
	overflow-x: auto;
	margin: 1.5rem 0;
}

.pwr-reader table {
	width: 100%;
	border-collapse: collapse;
}

.pwr-reader td {
	padding: 0.65rem;
	border: 1px solid var(--pwr-border);
	vertical-align: top;
}

.pwr-reader td p {
	margin: 0 0 0.5rem;
}

.pwr-reader__nav {
	display: grid;
	grid-template-columns: minmax(7rem, 1fr) auto minmax(7rem, 1fr);
	align-items: center;
	gap: 0.75rem;
	margin-top: 1rem;
}

.pwr-reader__button,
.pwr-reader__select {
	min-height: 44px;
	padding: 0.65rem 1rem;
	border: 1px solid var(--pwr-border);
	border-radius: 7px;
	background: var(--pwr-surface);
	color: inherit;
	font: inherit;
}

.pwr-reader__button {
	cursor: pointer;
}

.pwr-reader__button:last-child {
	background: var(--pwr-accent);
	border-color: var(--pwr-accent);
	color: #fff;
}

.pwr-reader__button:disabled {
	cursor: not-allowed;
	opacity: 0.45;
}

.pwr-reader__jump {
	display: block;
}

.pwr-reader__select {
	max-width: 9rem;
}

.pwr-message {
	padding: 1rem;
	border-left: 4px solid #dba617;
	background: #fff8e5;
}

@media (max-width: 540px) {
	.pwr-reader__pages {
		min-height: 20rem;
		padding: 1.15rem;
	}

	.pwr-reader__nav {
		grid-template-columns: 1fr 1fr;
	}

	.pwr-reader__jump {
		grid-column: 1 / -1;
		grid-row: 1;
		text-align: center;
	}
}

@media (prefers-reduced-motion: reduce) {
	.pwr-reader {
		scroll-behavior: auto;
	}
}