/* ==========================================================================
   Chapter reader — loaded on chapter pages only.
   Text size / width / font are driven by CSS variables set by reader.js.
   ========================================================================== */

.reader{
  --rd-size:20px;
  --rd-width:42rem;
  max-width:var(--rd-width);
  margin-inline:auto;
  transition:max-width .25s var(--ease);
}
.reader[data-width="narrow"]{--rd-width:34rem}
.reader[data-width="medium"]{--rd-width:42rem}
.reader[data-width="wide"]{--rd-width:54rem}
.container--reader .breadcrumbs{max-width:54rem;margin-inline:auto}

/* Thin, non-intrusive reading progress line */
.reader-progress{position:fixed;inset-block-start:0;inset-inline:0;height:3px;z-index:100;background:transparent;pointer-events:none}
.admin-bar .reader-progress{inset-block-start:32px}
@media (max-width:782px){.admin-bar .reader-progress{inset-block-start:46px}}
.reader-progress span{display:block;height:100%;width:0;background:var(--accent);border-end-end-radius:3px;border-start-end-radius:3px;transition:width .1s linear}

/* Heading block */
.reader__head{text-align:center;margin-block-end:var(--space-6);padding-block-end:var(--space-5);border-block-end:1px solid var(--border)}
.reader__novel{margin:0 0 .15rem;font-size:.95rem;font-weight:500}
.reader__novel a{text-decoration:none}
.reader__novel a:hover{text-decoration:underline}
.reader__author{margin:0 0 .8rem;color:var(--muted);font-size:.85rem}
.reader__title{font-size:clamp(1.5rem,1.2rem + 1.5vw,2.2rem);margin-block-end:.3em}
.reader__meta{margin:0 0 1.1rem;color:var(--muted);font-size:.88rem}
.reader__toolbar{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center;align-items:center}

/* The text itself */
.reader__content{
  font-size:var(--rd-size);
  line-height:var(--rd-lh,2.05);
  letter-spacing:0;
  word-spacing:.02em;
  hyphens:none;
  color:var(--text);
  text-align:start;
}
.reader__content>*+*{margin-block-start:0}
.reader__content p{margin:0 0 var(--rd-ps,1.35em);text-align:justify;text-justify:inter-word}
.reader__content p:last-child{margin-block-end:0}
.reader__content h2,.reader__content h3{margin-block:1.8em .6em;text-align:center;font-size:1.15em}
.reader__content hr{border:0;margin:2.2em auto;width:6rem;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.reader__content img{display:block;margin:1.6em auto}
.reader__content blockquote{margin-block:1.4em}
@media (max-width:640px){.reader__content{font-size:max(var(--rd-size),var(--rd-min,18px));line-height:2}.reader__content p{text-align:start}}

.reader[data-font="serif"] .reader__content{font-family:var(--font-serif);font-size:calc(var(--rd-size)*1.12);line-height:2.15}
@media (max-width:640px){.reader[data-font="serif"] .reader__content{font-size:max(calc(var(--rd-size)*1.12),20px)}}

/* Bottom navigation */
.reader__nav{display:grid;grid-template-columns:1fr auto 1fr;gap:.6rem;margin-block:var(--space-7) var(--space-5);padding-block-start:var(--space-5);border-block-start:1px solid var(--border)}
.reader__nav .btn{min-height:48px}
.reader__nav-prev{justify-self:stretch}
.reader__nav-next{justify-self:stretch}
@media (max-width:560px){
  .reader__nav{grid-template-columns:1fr 1fr}
  .reader__nav-index{grid-column:1/-1;order:3}
}
.reader .share{justify-content:center}

/* Settings sheet */
.reader-settings{position:fixed;inset-inline:1rem;inset-block-end:1rem;margin-inline:auto;max-width:400px;padding:1rem 1.1rem;background:var(--surface);color:var(--text);border:1px solid var(--border-strong);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);z-index:120;display:grid;gap:.9rem}
.reader-settings[hidden]{display:none}
.reader-settings__row{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:0;padding:0;border:0;min-width:0}
.reader-settings__row--end{justify-content:flex-end}
.reader-settings__label{font-size:.9rem;font-weight:700;padding:0;float:none}
fieldset.reader-settings__row{flex-wrap:wrap}
.stepper{display:inline-flex;align-items:center;gap:.25rem}
.stepper .icon-btn{border:1px solid var(--border-strong);border-radius:50%;font-size:1.3rem;line-height:1}
.stepper output{min-width:3ch;text-align:center;font-weight:700;font-variant-numeric:tabular-nums}
.segmented{display:inline-flex;border:1px solid var(--border-strong);border-radius:999px;overflow:hidden;background:var(--bg)}
.segmented label{position:relative;display:block;cursor:pointer}
.segmented input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.segmented span{display:block;padding:.35rem .85rem;font-size:.85rem;white-space:nowrap}
.segmented input:checked+span{background:var(--accent);color:var(--accent-ink);font-weight:700}
.segmented input:focus-visible+span{outline:3px solid var(--focus);outline-offset:-3px}

/* Chapter table of contents (native <dialog>) */
.toc{width:min(520px,92vw);max-height:80vh;padding:0;border:1px solid var(--border-strong);border-radius:var(--radius-lg);background:var(--surface);color:var(--text);box-shadow:var(--shadow-md);overflow:hidden}
.toc[open]{display:flex;flex-direction:column}
.toc::backdrop{background:rgba(10,8,5,.55)}
.toc__head{display:flex;align-items:center;justify-content:space-between;padding:.4rem .6rem .4rem 1.2rem;padding-inline:1.2rem .6rem;border-block-end:1px solid var(--border)}
.toc__head h2{margin:0;font-size:1.1rem}
.toc__body{overflow:auto;padding:.5rem;display:grid;gap:.5rem;justify-items:center}
.toc__body .chapter-list{width:100%}