/* ================================================================
   Ramcharitmanas reading pages            (Sundarkand first, 2026-09-13)

   The doha and the chaupai are the reason these pages exist; the prose
   around them is there to open them up. So the verse is set apart on its
   own ground and given room, and everything else stays quiet.

   All colour comes from the reader tokens, so light, dark and sepia are
   handled without a single hardcoded value.
   ================================================================ */

/* ---- the verse block ------------------------------------------- */
.lulla-epic blockquote.verse {
  margin: 2.1rem 0;
  padding: 1.15rem 1.4rem .85rem;
  background: var(--lv-bg-soft);
  border: 1px solid var(--lv-line);
  border-left: 2px solid var(--lv-accent);
  border-radius: 0 10px 10px 0;
}

.lulla-epic blockquote.verse p {
  font-family: 'Noto Serif Devanagari', 'Noto Serif', serif;
  font-size: 1.12rem;
  /* Devanagari verse needs air between the shirorekhas, more than prose
     does, or the matras of two lines start to touch. */
  line-height: 2.05;
  /* Never track Devanagari apart: matras and the headline need the
     cluster to stay contiguous. */
  letter-spacing: 0;
  color: var(--lv-ink);
  margin: 0 0 .35rem;
}
.lulla-epic blockquote.verse p:last-of-type { margin-bottom: .55rem; }

.lulla-epic blockquote.verse cite {
  display: block;
  text-align: right;
  font-family: var(--lv-font-ui);
  /* <cite> is italic by default. A synthetic slant on Devanagari is
     ugly and is not how the script marks emphasis. */
  font-style: normal;
  font-size: .78rem;
  letter-spacing: .04em;
  color: var(--lv-ink-faint);
}

/* ---- Awadhi quoted inside the prose ---------------------------- */
.lulla-epic em.awadhi {
  font-family: 'Noto Serif Devanagari', 'Noto Serif', serif;
  font-style: normal;
  color: var(--lv-accent-text);
  white-space: nowrap;
}
/* A long fragment must be allowed to break rather than push the column. */
.lulla-epic em.awadhi:not(:only-child) { white-space: normal; }

/* ---- the सार summary ------------------------------------------- */
.lulla-epic p.saar {
  margin: 1.5rem 0 2rem;
  padding: .75rem 0 .75rem 1.1rem;
  border-left: 2px solid var(--lv-line-strong);
  font-size: .97rem;
  line-height: 1.85;
  color: var(--lv-ink-soft);
}

/* ---- the cast of the episode ----------------------------------- */
.lulla-epic ul.cast {
  list-style: none;
  margin: 1rem 0 2.2rem;
  padding: 0;
  border-top: 1px solid var(--lv-line);
}
.lulla-epic ul.cast li {
  margin: 0;
  padding: .7rem .2rem;
  border-bottom: 1px solid var(--lv-line);
  line-height: 1.75;
  color: var(--lv-ink-soft);
}
.lulla-epic ul.cast li strong {
  color: var(--lv-ink);
  font-weight: 600;
}

/* ---- lead paragraph and source line ---------------------------- */
.lulla-epic p.first { font-size: 1.06rem; line-height: 1.95; }

.lulla-epic p.src {
  margin-top: 2.4rem;
  padding-top: 1rem;
  border-top: 1px solid var(--lv-line);
  font-size: .88rem;
  line-height: 1.7;
  color: var(--lv-ink-faint);
}

.lulla-epic hr.rule {
  border: 0;
  height: 1px;
  background: var(--lv-line);
  margin: 2.4rem auto;
  width: 42%;
}

/* ---- narrow screens -------------------------------------------- */
@media (max-width: 640px) {
  .lulla-epic blockquote.verse { padding: .95rem 1rem .7rem; margin: 1.7rem 0; }
  .lulla-epic blockquote.verse p { font-size: 1.05rem; line-height: 1.95; }
  /* On a phone a nowrap fragment would force a sideways scroll. */
  .lulla-epic em.awadhi { white-space: normal; }
}

/* ---- kanda hub: the episode list ------------------------------------- */
/* The Sundarkand hub carried these as inline style attributes.  Every later
   kanda is generated, and a generated page with inline styles is a page whose
   look cannot be changed in one place, so the rules live here instead. */
.lulla-epic ol.manas-toc { padding: 0; margin: 1rem 0 2rem; }
.lulla-epic ol.manas-toc li {
  list-style: none; margin: .6rem 0; padding: .85rem 1.05rem;
  border: 1px solid var(--lv-line, #D8CFBF); border-radius: 10px;
  transition: border-color .18s ease, background .18s ease;
}
.lulla-epic ol.manas-toc li:hover { border-color: var(--lv-accent, #9A6B3F); background: var(--lv-bg-card, transparent); }
.lulla-epic ol.manas-toc a { text-decoration: none; color: inherit; display: block; }
.lulla-epic ol.manas-toc b { display: block; font-size: 1.08rem; line-height: 1.35; }
.lulla-epic ol.manas-toc .rng { color: var(--lv-ink-soft); font-size: .9rem; }
.lulla-epic ol.manas-toc .dek { color: var(--lv-ink-soft); font-size: .95rem; }

/* ---- previous / next between episodes -------------------------------- */
.lulla-epic nav.lv-upnav {
  display: flex; justify-content: space-between; gap: 1rem;
  margin: 2.2rem 0 0; padding-top: 1rem;
  border-top: 1px solid var(--lv-line, #D8CFBF); font-size: .95rem;
}
.lulla-epic nav.lv-upnav a { color: var(--lv-accent-text); text-decoration: none; }
.lulla-epic nav.lv-upnav a:hover { text-decoration: underline; }

/* A kanda that is listed but not yet written. It reads as part of the work,
   not as a broken link, so it takes no hover and no pointer. */
.lulla-epic ol.manas-toc li.pending { opacity: .62; border-style: dashed; }
.lulla-epic ol.manas-toc li.pending:hover { border-color: var(--lv-line, #D8CFBF); background: none; }
.lulla-epic ol.manas-toc li.pending span { display: block; }