/* ============================================================
   English single-page reader — overrides on top of book.css.
   Reuses the altitude palette; swaps to LTR + Fraunces/Instrument Sans.
   ============================================================ */
html.en{--serif:"Fraunces",serif;--body:"Instrument Sans",system-ui,sans-serif}
html.en body{font-size:clamp(16px,1rem + .3vw,18px);line-height:1.75;letter-spacing:-.005em}
/* The reading column runs on the reader vars (book.css). English gets the Latin
   text face; the Arabic face picker is hidden on these pages by book.js. */
html.en{--read-font:"Instrument Sans",system-ui,sans-serif;--read-scale:1;--read-lh:1.75}
html.en[data-rfont]{--read-font:"Instrument Sans",system-ui,sans-serif;--read-scale:1;--read-lh:1.75}

/* atmosphere: mirror the contour drift to the right for LTR */
.en .contours svg{left:auto;right:-8vw}

/* article typography for English */
.en article p{text-align:left}
.en article h1{letter-spacing:-.02em}
.en article h2{letter-spacing:-.015em}
.en article th,.en article td{text-align:left}
.en .eyebrow{direction:ltr}
.en .toc h4{direction:ltr}

/* ---------- cover hero ---------- */
.cover-hero{max-width:1100px;margin:0 auto;padding:120px clamp(18px,4vw,48px) 20px;text-align:center}
.cover-hero .eyebrow{justify-content:center;margin-bottom:1.6em}
.cover-img{display:block;width:min(560px,92%);margin:0 auto;border-radius:12px;
  border:1px solid var(--line);box-shadow:0 30px 80px -30px rgba(0,0,0,.7)}
.cover-hero.text{min-height:70vh;display:flex;flex-direction:column;align-items:center;justify-content:center}
/* Centre-aligned flex items keep their max-content (unwrapped) width and would
   overflow a narrow phone; cap every child to the column so long titles wrap. */
.cover-hero.text>*{max-width:100%}
.cover-title{font-family:var(--serif);font-weight:400;font-size:clamp(2.4rem,7vw,5.4rem);line-height:1.04;
  letter-spacing:-.035em;color:#f5f7fe;overflow-wrap:break-word}
.cover-title em{font-style:italic;color:var(--accent)}
.cover-sub{font-family:var(--serif);font-style:italic;font-size:clamp(1.2rem,3vw,1.7rem);color:var(--muted);margin-top:.5em}
.cover-auth{color:var(--faint);font-size:1rem;margin-top:1.6em;font-family:var(--body)}
.startbtn{display:inline-flex;align-items:center;gap:.5em;margin-top:2.2em;background:var(--accent);color:#1a1205;
  border-radius:100px;padding:.85em 1.6em;font-family:var(--body);font-weight:600;text-decoration:none;transition:.3s}
.startbtn:hover{background:var(--accent-soft);transform:translateY(-2px)}

/* chapter headings render as chapter dividers */
.en article h1{border-top:1px solid var(--line);margin-top:3em;padding-top:1.6em}
.en article h1:first-of-type{border-top:none;margin-top:.5em}

/* ---------- mobile reading layout (LTR) ----------
   book.css turns the sidebar TOC into a slide-in drawer on phones, whose
   geometry (built RTL-first) leaves a sliver of the panel across the page.
   Instead, on phones drop the drawer entirely: stack the contents at the
   top as a compact, scrollable box, and let the chapter flow full-width
   below it. Reader = whole page; navigate from the TOC on top. */
@media(max-width:900px){
  html.en .layout{display:flex;flex-direction:column}
  /* transform uses !important: book.css's RTL drawer rule ":root[dir] .toc"
     (specificity 0,3,0) otherwise beats this and slides the panel off-screen. */
  html.en .toc{order:-1;position:static;inset:auto;top:auto;width:auto;transform:none!important;
    z-index:auto;box-shadow:none;max-height:52vh;overflow-y:auto;
    border:1px solid var(--line);border-inline-start:1px solid var(--line);border-radius:16px;
    padding:1.2em 1.3em;margin-bottom:2em;background:var(--surface)}
  html.en .toc.open{transform:none!important}
  html.en .toc-toggle{display:none}   /* no drawer toggle needed */
  html.en .scrim{display:none}
}

/* light theme: warm ink for the hardcoded cover title */
:root[data-theme="light"] .cover-title{color:#241c10}
@media(prefers-color-scheme:light){
  :root:not([data-theme="dark"]) .cover-title{color:#241c10}
}