/* =============================================================
   Distraction-free book reader
   Themes: light (default) / sepia / dark, adjustable text size.
   ============================================================= */

body.is-reader {
	--reader-bg: var(--c-cream);
	--reader-surface: var(--c-paper);
	--reader-text: #26201a;
	--reader-muted: #6b6257;
	--reader-line: var(--c-line);
	--reader-accent: var(--c-orange-deep);
	--reader-fs: 1.125rem;
	background: var(--reader-bg);
}
body.is-reader[data-reader-theme="sepia"] {
	--reader-bg: #f4e8d6;
	--reader-surface: #faf1e3;
	--reader-text: #443528;
	--reader-muted: #7d6a55;
	--reader-line: #e0d0b8;
}
body.is-reader[data-reader-theme="dark"] {
	--reader-bg: #0e1420;
	--reader-surface: #171f30;
	--reader-text: #d9deea;
	--reader-muted: #8e99b3;
	--reader-line: #273350;
	--reader-accent: #ff8b3d;
}
body.is-reader[data-reader-theme="dark"] .site-header,
body.is-reader[data-reader-theme="dark"] .site-header.is-scrolled { background: rgba(14, 20, 32, 0.95); }
body.is-reader[data-reader-theme="dark"] .site-nav__list a,
body.is-reader[data-reader-theme="dark"] .nav-toggle { color: #d9deea; }
body.is-reader[data-reader-theme="dark"] .site-logo img { filter: invert(1) brightness(1.6); }
body.is-reader[data-reader-theme="sepia"] .site-header,
body.is-reader[data-reader-theme="sepia"] .site-header.is-scrolled { background: rgba(244, 232, 214, 0.95); }
@media (max-width: 860px) {
	body.is-reader[data-reader-theme="dark"] .site-nav { background: #0e1420; }
	body.is-reader[data-reader-theme="sepia"] .site-nav { background: #f4e8d6; }
}

/* progress bar */
.reader-progress {
	position: fixed; top: 0; left: 0; right: 0; height: 3px;
	background: transparent; z-index: calc(var(--z-header) + 5);
}
.reader-progress__bar {
	height: 100%; width: 0;
	background: linear-gradient(90deg, var(--c-orange), var(--c-orange-deep));
	transition: width 80ms linear;
}

/* On chapter pages the main site header scrolls away so the reader bar
   owns the top edge — distraction-free reading. */
body.is-reader .site-header { position: static; }

/* compact reader identity bar */
.reader-bar {
	position: sticky; top: 0; z-index: calc(var(--z-header) - 1);
	background: color-mix(in srgb, var(--reader-surface) 92%, transparent);
	backdrop-filter: blur(8px);
	border-bottom: 1px solid var(--reader-line);
	font-size: 0.88rem;
}
.reader-bar__inner {
	display: flex; align-items: center; justify-content: space-between; gap: 1rem;
	min-height: 3.2rem;
}
.reader-bar__meta { display: flex; align-items: center; gap: 0.7rem; min-width: 0; color: var(--reader-muted); }
.reader-bar__meta strong {
	color: var(--reader-text); font-weight: 600;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 34vw;
}
.reader-bar__count { white-space: nowrap; }
.reader-bar__tools { display: flex; align-items: center; gap: 0.15rem; }
.reader-tool {
	background: none; border: 0; cursor: pointer;
	color: var(--reader-muted);
	width: 2.4rem; height: 2.4rem; border-radius: var(--radius-s);
	display: inline-flex; align-items: center; justify-content: center;
	transition: background var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
	position: relative;
	text-decoration: none;
}
.reader-tool:hover { background: color-mix(in srgb, var(--reader-text) 8%, transparent); color: var(--reader-text); }
.reader-tool[aria-pressed="true"] { color: var(--reader-accent); }
.reader-tool--label { width: auto; padding-inline: 0.6rem; font-weight: 600; font-size: 0.85rem; gap: 0.35rem; }

/* article */
.reader-article {
	max-width: var(--container-text);
	margin-inline: auto;
	padding: clamp(2rem, 5vw, 3.5rem) clamp(1.1rem, 4vw, 2rem) clamp(3rem, 6vw, 4.5rem);
}
.reader-article__header { margin-bottom: clamp(2rem, 5vw, 3rem); }
.reader-article__crumb {
	font-size: 0.85rem; color: var(--reader-muted);
	display: flex; align-items: center; gap: 0.45rem; flex-wrap: wrap;
	margin-bottom: 1.4rem;
}
.reader-article__crumb a { color: var(--reader-muted); text-decoration: none; }
.reader-article__crumb a:hover { color: var(--reader-accent); }
.reader-article__chapterno {
	font-family: var(--font-display); font-size: 0.95rem; font-weight: 600;
	color: var(--reader-accent);
	letter-spacing: 0.1em; text-transform: uppercase;
	margin-bottom: 0.6rem; display: block;
}
.reader-article__title { color: var(--reader-text); font-size: clamp(1.9rem, 4.5vw, 3rem); }
.reader-article__meta { color: var(--reader-muted); font-size: 0.9rem; display: flex; gap: 1rem; flex-wrap: wrap; }

.reader-content {
	font-size: var(--reader-fs);
	line-height: 1.85;
	color: var(--reader-text);
}
.reader-content > p:first-of-type::first-letter {
	font-family: var(--font-display);
	font-size: 3.4em; font-weight: 560; line-height: 0.8;
	float: left; padding-right: 0.12em; padding-top: 0.08em;
	color: var(--reader-accent);
}
.reader-content p { margin-bottom: 1.35em; }
.reader-content h2, .reader-content h3 { color: var(--reader-text); margin-top: 2em; }
.reader-content img { border-radius: var(--radius-m); margin-block: 1.5em; }
.reader-content blockquote {
	border-left: 3px solid var(--reader-accent);
	margin-inline: 0; padding-left: 1.2rem;
	font-family: var(--font-display); font-style: italic;
	color: var(--reader-text);
}
.reader-content a { color: var(--reader-accent); }
.reader-content sup, .reader-content .footnote { font-size: 0.75em; }

/* chapter prev/next */
.reader-nav {
	max-width: var(--container-text); margin-inline: auto;
	padding: 0 clamp(1.1rem, 4vw, 2rem) clamp(3rem, 6vw, 4rem);
	display: grid; grid-template-columns: 1fr 1fr; gap: 1rem;
}
.reader-nav__link {
	border: 1.5px solid var(--reader-line);
	border-radius: var(--radius-m);
	background: var(--reader-surface);
	padding: 1.1rem 1.3rem;
	text-decoration: none;
	display: flex; flex-direction: column; gap: 0.25rem;
	transition: border-color var(--t-fast) var(--ease), translate var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
	min-width: 0;
}
.reader-nav__link:hover { border-color: var(--reader-accent); translate: 0 -2px; box-shadow: var(--shadow-s); }
.reader-nav__link--next { text-align: right; align-items: flex-end; }
.reader-nav__link span { font-size: 0.8rem; color: var(--reader-muted); display: inline-flex; align-items: center; gap: 0.35rem; }
.reader-nav__link strong { color: var(--reader-text); font-family: var(--font-display); font-weight: 560; font-size: 1.02rem; line-height: 1.3; }
.reader-nav__link--empty { visibility: hidden; }
@media (max-width: 620px) { .reader-nav { grid-template-columns: 1fr; } .reader-nav__link--next { text-align: left; align-items: flex-start; } }

/* end-of-chapter language + return */
.reader-extras {
	max-width: var(--container-text); margin-inline: auto;
	padding: 0 clamp(1.1rem, 4vw, 2rem) clamp(3rem, 6vw, 4rem);
	display: flex; flex-wrap: wrap; gap: 0.8rem; align-items: center;
	color: var(--reader-muted); font-size: 0.9rem;
}
.reader-extras .btn { font-size: 0.88rem; padding: 0.7rem 1.1rem; }

/* TOC drawer */
.reader-toc {
	position: fixed; inset: 0; z-index: var(--z-drawer);
	visibility: hidden;
}
.reader-toc.is-open { visibility: visible; }
.reader-toc__overlay {
	position: absolute; inset: 0;
	background: rgba(16, 24, 40, 0.5);
	opacity: 0; transition: opacity var(--t-med) var(--ease);
	border: 0; width: 100%; height: 100%; cursor: pointer;
}
.reader-toc.is-open .reader-toc__overlay { opacity: 1; }
.reader-toc__panel {
	position: absolute; top: 0; bottom: 0; left: 0;
	width: min(22rem, 88vw);
	background: var(--reader-surface);
	box-shadow: var(--shadow-m);
	transform: translateX(-102%);
	transition: transform var(--t-med) var(--ease);
	display: flex; flex-direction: column;
}
.reader-toc.is-open .reader-toc__panel { transform: none; }
.reader-toc__head {
	display: flex; align-items: center; justify-content: space-between;
	padding: 1.1rem 1.3rem; border-bottom: 1px solid var(--reader-line);
}
.reader-toc__head h2 { font-size: 1.05rem; margin: 0; color: var(--reader-text); }
.reader-toc__list { overflow-y: auto; flex: 1; margin: 0; padding: 0.6rem 0; list-style: none; }
.reader-toc__list a {
	display: flex; gap: 0.8rem; align-items: baseline;
	padding: 0.55rem 1.3rem;
	color: var(--reader-muted); text-decoration: none; font-size: 0.93rem; line-height: 1.4;
}
.reader-toc__list a:hover { background: color-mix(in srgb, var(--reader-text) 6%, transparent); color: var(--reader-text); }
.reader-toc__list .num { font-family: var(--font-display); font-size: 0.8rem; color: var(--reader-accent); flex: none; width: 1.4rem; }
.reader-toc__list [aria-current="page"] { color: var(--reader-accent); font-weight: 600; background: color-mix(in srgb, var(--reader-accent) 8%, transparent); }
.reader-toc__langs { border-top: 1px solid var(--reader-line); padding: 1rem 1.3rem; display: flex; gap: 0.5rem; align-items: center; font-size: 0.88rem; color: var(--reader-muted); flex-wrap: wrap; }
.reader-toc__langs a { color: var(--reader-text); font-weight: 600; text-decoration: none; padding: 0.3rem 0.7rem; border: 1px solid var(--reader-line); border-radius: 999px; }
.reader-toc__langs a:hover, .reader-toc__langs a[aria-current="true"] { border-color: var(--reader-accent); color: var(--reader-accent); }

/* toast for copy-link feedback */
.reader-toast {
	position: fixed; bottom: 1.4rem; left: 50%; translate: -50% 0;
	background: var(--c-navy); color: #fff;
	padding: 0.7rem 1.2rem; border-radius: 999px; font-size: 0.9rem;
	box-shadow: var(--shadow-m); z-index: var(--z-toast);
	opacity: 0; pointer-events: none;
	transition: opacity var(--t-med) var(--ease);
}
.reader-toast.is-visible { opacity: 1; }

/* print */
@media print {
	.reader-bar, .reader-progress, .reader-nav, .reader-extras, .reader-toc, .site-header, .site-footer { display: none !important; }
	body.is-reader { background: #fff; --reader-text: #000; }
	.reader-content { font-size: 11.5pt; line-height: 1.6; }
}
