/* Chasing Arabic · Approved Refined Adaptive Reader — production. */
:root {
  --paper:#FAF8F3; --paper-deep:#F0ECE3; --white:#FFFEFB;
  --ink:#1F343C; --library:#244E66; --library-dark:#173B51;
  --reading-blue:#E8F0F1; --blue-border:#C6D9DB;
  --terracotta:#A0543F; --terracotta-soft:#F0DDD1;
  --sage:#DDE7DE; --muted:#52646D; --line:#CED7D5; --line-warm:#D9D5CC;
  --heading:'EB Garamond',Georgia,'Times New Roman',serif;
  --ui:Inter,'Segoe UI','Helvetica Neue',Arial,sans-serif;
  --arabic:'Noto Naskh Arabic',Amiri,'Traditional Arabic',serif;
  --arabic-size:28px; --reader-width:724px;
}
*,:before,:after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:94px}
body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.65 var(--ui);-webkit-font-smoothing:antialiased}
button,input{font:inherit} button{cursor:pointer;border:0} button:disabled{opacity:.48;cursor:default}
:focus-visible{outline:3px solid var(--terracotta);outline-offset:3px}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;top:-100px;left:12px;background:var(--library-dark);color:#fff;padding:9px 15px;z-index:100;}.skip-link:focus{top:10px}
.review-banner{background:var(--reading-blue);border-bottom:1px solid var(--blue-border);font:650 10px/1.5 var(--ui);letter-spacing:.085em;color:var(--library);text-align:center;padding:7px 12px}
.site-head{position:sticky;top:0;z-index:20;background:rgba(250,248,243,.96);border-top:3px solid var(--library-dark);border-bottom:1px solid var(--line-warm);backdrop-filter:blur(12px)}
.site-head-inner{height:67px;max-width:1350px;padding:0 clamp(18px,4vw,56px);margin:auto;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{color:var(--ink);text-decoration:none;display:flex;flex-direction:column;align-items:flex-start;min-width:0;white-space:nowrap}
.brand-name{font:500 29px/.97 var(--heading);letter-spacing:-.035em}
.brand-name em{color:var(--library);font-weight:400}.brand-name b{color:var(--terracotta);font-weight:700}
.brand-line{margin-top:7px;font:750 9px var(--ui);letter-spacing:.17em;text-transform:uppercase;color:var(--muted)}
.head-actions{display:flex;align-items:center;gap:5px}
.text-btn{background:transparent;color:var(--library-dark);border-radius:4px;min-height:44px;padding:10px 13px;font-weight:680;font-size:12.5px;display:inline-flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap}
.text-btn:hover,.text-btn[aria-expanded=true]{background:var(--reading-blue)}
.text-btn .symbol{font-size:17px;font-weight:400}
#book-back{border-right:1px solid var(--line-warm);margin-right:9px;padding-right:20px}
#mobile-tools{display:none}
.menu-surface{position:absolute;right:14px;top:calc(100% + 7px);width:min(290px,calc(100vw - 28px));border:1px solid var(--line);border-radius:6px;background:var(--white);padding:8px;box-shadow:0 18px 36px #173B5129;z-index:23}
.menu-surface button{display:flex;width:100%;text-align:left;align-items:center;gap:12px;border-radius:4px;background:transparent;color:var(--ink);padding:13px 15px;min-height:48px}
.menu-surface button:hover{background:var(--reading-blue)}
.menu-surface button span:first-child{font-size:17px;color:var(--terracotta)}
.small-kicker{font:750 10px/1.45 var(--ui);letter-spacing:.15em;text-transform:uppercase;color:var(--library)}
.primary{display:inline-flex;align-items:center;justify-content:center;gap:12px;background:var(--library-dark);color:white;min-height:50px;padding:13px 22px;border-radius:4px;font:700 13px var(--ui)}.primary:hover{background:var(--library)}
.secondary{background:var(--white);color:var(--library-dark);border:1px solid var(--blue-border)}.secondary:hover{background:var(--reading-blue)}
.linklike{background:transparent;color:var(--library-dark);border-bottom:1px solid var(--terracotta);min-height:38px;padding:7px 0;font-weight:700;font-size:13px}
/* Book entry deliberately closer to the real library's visual language. */
.book-entry{max-width:1110px;margin:auto;display:grid;grid-template-columns:minmax(245px,340px) minmax(0,1fr);gap:clamp(46px,7vw,100px);align-items:center;padding:clamp(46px,8vw,115px) 28px 100px}
.book-cover{width:100%;max-width:340px;aspect-ratio:3/4.1;background:#28546E;color:#fbf6ee;padding:25px;box-shadow:21px 26px 36px #173B5126;position:relative;display:flex;flex-direction:column;justify-content:space-between;border:1px solid #25485b}
.book-cover:before{content:'';position:absolute;inset:12px;border:1px solid #ffffff55;pointer-events:none}
.cover-imprint{font:700 10px/1.4 var(--ui);letter-spacing:.16em;position:relative}
.cover-center{text-align:center;position:relative}.cover-symbol{font:400 98px/.9 var(--heading);color:#e1b398;margin:0 auto 20px}.cover-ar{font:400 33px/2 var(--arabic);direction:rtl}.cover-name{font:400 49px/1.04 var(--heading);margin:12px 0}
.entry-copy h1{font:500 clamp(56px,7vw,84px)/.97 var(--heading);letter-spacing:-.045em;margin:14px 0 14px}
.entry-copy .arabic-title{color:var(--library);font:400 29px/2 var(--arabic);direction:rtl;text-align:left;margin:0 0 17px}
.entry-copy .deck{max-width:525px;font:400 21px/1.4 var(--heading);color:#3d5864;margin:0 0 14px}
.entry-copy .summary{font:14px/1.8 var(--ui);color:var(--muted);max-width:500px}
.book-meta{display:flex;gap:12px 22px;flex-wrap:wrap;border-block:1px solid var(--line-warm);padding:14px 0;margin:24px 0 27px;font-size:12px;color:var(--library);font-weight:650}
.entry-actions{display:flex;gap:13px;flex-wrap:wrap;align-items:center}
.mini-note{color:var(--muted);font-size:12px;max-width:490px;margin-top:20px}
.continue-card{border-left:2px solid var(--terracotta);padding:3px 0 4px 18px;margin:22px 0 0}.continue-card .mini-note{margin:4px 0 9px}.continue-card .primary{min-height:43px;padding:10px 15px}
.demo-button{display:inline-block;margin-top:19px;color:var(--library);text-decoration:underline;text-underline-offset:3px;background:transparent;padding:8px 0;font-size:12px}
/* Reading: Direction A's typographic calm + C's contextual controls. */
.reader-page{min-height:85vh}
.reader-body{padding:44px 25px 90px}
.chapter-intro{text-align:center;max-width:var(--reader-width);margin:0 auto 36px}
.chapter-intro .chapter-count{display:block;font:750 10px var(--ui);letter-spacing:.22em;color:var(--terracotta);text-transform:uppercase}
.chapter-intro h1{color:var(--library-dark);font:400 clamp(40px,5vw,51px)/1.75 var(--arabic);direction:rtl;margin:9px 0 -2px}
.chapter-intro h2{font:400 clamp(27px,3.3vw,36px)/1.1 var(--heading);margin:0 0 9px;color:var(--ink)}
.chapter-intro .subtitle{font-size:12px;color:var(--muted)}
.chapter-rule{width:53px;height:2px;margin:24px auto 0;background:var(--terracotta);opacity:.75}

.reader-inline-nav button:hover{background:var(--reading-blue)}
.reader-column{max-width:var(--reader-width);margin:auto}
.help-note{color:var(--muted);font:12px/1.6 var(--ui);max-width:var(--reader-width);margin:0 auto 28px;padding:0 0 0 12px;border-left:2px solid var(--line-warm)}
.story{margin:0 0 38px;scroll-margin-top:105px;min-width:0}
.arabic-paragraph{font:400 var(--arabic-size)/2.07 var(--arabic);direction:rtl;text-align:right;color:var(--library-dark);margin:0;overflow-wrap:normal;white-space:normal;unicode-bidi:plaintext}
.translation-btn{display:inline-flex;align-items:center;gap:5px;min-height:40px;background:transparent;color:var(--library);border:0;padding:6px 1px;font-size:12px;font-weight:650;text-decoration:underline;text-decoration-color:#b6c5c7;text-underline-offset:4px;margin-top:6px}
.translation-btn:hover{color:var(--terracotta)}.translation-btn::after{content:'↗';font-size:13px;font-weight:400;padding-left:3px}.translation-btn[aria-expanded=true]::after{content:'↘'}
.english-translation{margin:8px 0 0;padding:0 0 0 17px;border-left:2px solid #CAB9AA;font:14px/1.85 var(--ui);color:#56666c;max-width:96%}
.english-translation[hidden],.translation-btn[hidden]{display:none!important}
.reader-end{max-width:var(--reader-width);margin:76px auto 0;padding:26px 0 0;border-top:1px solid var(--line-warm);display:flex;align-items:center;justify-content:space-between;gap:14px}
.end-note{text-align:center;color:var(--muted);font:12px/1.5 var(--ui);margin:20px auto}
.progress-track{height:2px;background:var(--line);position:fixed;top:70px;left:0;width:100%;z-index:21;pointer-events:none}.progress-fill{width:0;height:100%;background:var(--terracotta);transition:width .15s}
.saved-hint{color:var(--muted);font-size:12px;margin:19px auto 0;max-width:var(--reader-width)}
/* Focused, accessible panels. On mobile, bottom sheets only when requested. */
.scrim{position:fixed;inset:0;background:#122C3A80;z-index:29;backdrop-filter:blur(2px)}
.drawer{position:fixed;z-index:30;right:0;top:0;height:100dvh;max-height:100dvh;width:min(480px,100vw);background:var(--white);box-shadow:-16px 0 44px #173B5129;display:flex;flex-direction:column;color:var(--ink)}
.drawer-head{flex-shrink:0;padding:26px 26px 18px;border-bottom:1px solid var(--line-warm);display:flex;align-items:center;justify-content:space-between;gap:12px}
.drawer-head h2{font:450 34px/1.08 var(--heading);margin:5px 0 0}.close{min-width:44px;min-height:44px;background:var(--reading-blue);border-radius:50%;color:var(--library-dark);font-size:23px}.close:hover{background:var(--blue-border)}
.drawer-body{padding:20px 26px 48px;overflow-y:auto;overscroll-behavior:contain;min-height:0}
.drawer-body .hint{color:var(--muted);font-size:12px;line-height:1.7;margin:0 0 24px}
.setting-label{font-size:13px;font-weight:750;margin:24px 0 10px}.choice-buttons{display:flex;flex-wrap:wrap;gap:9px}.small-choice{min-height:43px;border:1px solid var(--blue-border);border-radius:4px;background:var(--white);padding:9px 14px;font-size:13px;color:var(--ink)}.small-choice[aria-pressed=true]{background:var(--reading-blue);border-color:var(--library);color:var(--library-dark);font-weight:750}
.radio-set{display:grid;gap:9px}.radio-choice{display:flex;align-items:center;gap:11px;border:1px solid var(--line);padding:13px 15px;border-radius:4px;cursor:pointer;font-size:13px}.radio-choice:has(input:checked){border-color:var(--library);background:var(--reading-blue)}.radio-choice input{accent-color:var(--library);width:18px;height:18px}
.font-controls{display:flex;gap:14px;align-items:center}.font-controls button{border:1px solid var(--line);background:var(--paper);min-width:45px;min-height:45px;border-radius:4px;font-size:23px;color:var(--library-dark)}.font-controls output{font-weight:750;min-width:64px;text-align:center}
.chapter-list{display:grid;gap:9px}.chapter-item{width:100%;text-align:left;border:1px solid var(--line);background:var(--white);border-radius:4px;min-height:69px;padding:12px 16px;display:flex;align-items:center;gap:15px;color:var(--ink)}.chapter-item:hover,.chapter-item[aria-current=true]{background:var(--reading-blue);border-color:var(--blue-border)}.chapter-item .number{color:var(--terracotta);font:400 28px var(--heading)}.chapter-item strong{font-size:13px}.chapter-item .small-ar{font:400 18px/1.7 var(--arabic);display:block;direction:rtl;text-align:left;color:var(--library)}
.vocab-count{background:var(--reading-blue);padding:11px 13px;font-size:12px;color:var(--library);margin-bottom:12px}.vocab-filter{width:100%;padding:12px 13px;border:1px solid var(--line);background:var(--white);border-radius:4px;margin-bottom:8px;color:var(--ink)}
.vocab-rows{display:grid}.vocab-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:center;padding:13px 2px;border-bottom:1px solid var(--line-warm)}.vocab-ar{font:400 23px/1.7 var(--arabic);direction:rtl;color:var(--library-dark);text-align:right;min-width:0}.vocab-en{font-size:13px;color:var(--muted);overflow-wrap:anywhere}
.drawer-bottom{font:11px/1.5 var(--ui);color:var(--muted);margin:22px 0 0}
@media(max-width:770px){
  .site-head-inner{height:58px;padding:0 15px}.brand-name{font-size:24px}.brand-line{font-size:7.5px;letter-spacing:.11em}
  #desktop-actions{display:none}#mobile-tools{display:inline-flex}
  #book-back{margin-right:0;padding:10px 6px;border-right:0;font-size:12px}
  .progress-track{top:61px}
  .book-entry{grid-template-columns:1fr;gap:38px;padding:38px 26px 60px}.book-cover{max-width:265px;margin:auto}.entry-copy h1{font-size:56px}
  .reader-body{padding:26px 21px 76px}.chapter-intro{margin-bottom:22px}.chapter-intro h1{font-size:39px;line-height:1.65;margin-top:4px}.chapter-intro h2{font-size:27px;margin-bottom:4px}.chapter-rule{margin:16px auto 0}
  
  .help-note{margin-bottom:21px;font-size:11.5px}
  .arabic-paragraph{font-size:var(--arabic-size);line-height:2.03}.story{margin-bottom:31px;scroll-margin-top:84px}
  .english-translation{font-size:13.5px;max-width:100%}
  .reader-end{margin-top:52px}.reader-end .primary{padding:10px 11px;min-height:46px;font-size:12px}
  .drawer{top:auto;bottom:0;width:100%;height:auto;max-height:88dvh;border-radius:16px 16px 0 0}.drawer-head{padding:19px 22px 14px}.drawer-body{padding:17px 22px calc(34px + env(safe-area-inset-bottom,0px))}
}
@media(max-width:390px){.reader-body{padding-inline:17px}.brand-name{font-size:22px}.brand-line{display:none}.entry-copy h1{font-size:51px}.chapter-intro h1{font-size:36px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.progress-fill{transition:none}*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Approved Batch 3B correction: only sticky-header tool actions, never a duplicate chapter-opening row. */
#desktop-actions{display:flex;gap:4px;align-items:center}
@media(max-width:770px){#desktop-actions{display:none} #mobile-tools{display:inline-flex}}
.reader-body{min-height:75vh}
.reader-body .story[id]{scroll-margin-top:110px}
.reader-support{margin:0 auto 26px;max-width:var(--reader-width);text-align:center;color:var(--muted);font-size:12px}
#reader-main{display:block}
.reader-contents{font:500 12px var(--ui)}
.reader-title-bar{min-width:0;max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted);font-size:12px}
@media(max-width:540px){.reader-title-bar{display:none}.head-actions{gap:0}#book-back{font-size:11px;padding-inline:4px}.brand-name{font-size:22px}}
html:not(.reader-js) .translation-btn{display:none}
html.reader-js .english-translation{display:none}
html.reader-js .english-translation:not([hidden]){display:block}
html.reader-js .translation-btn:not([hidden]){display:inline-flex}
.no-script-note{margin:0 auto 25px;max-width:var(--reader-width);color:var(--muted)}
.reader-progress-link{color:var(--library);font-weight:700;text-decoration:underline;text-underline-offset:4px}
.reader-actions-note{font-size:12px;color:var(--muted)}
#reader-main .chapter-intro{padding:0}
.reader-end a{text-decoration:none;text-align:center}
.reader-end .primary{font-size:12px}
.reader-end .primary[aria-disabled=true]{opacity:.5;pointer-events:none}
.reader-entry-link{border-bottom:1px solid var(--terracotta);font-weight:700}

/* Batch 4A: print- and no-script-friendly complete offline reading fallback.
   Only used in the generated self-contained file when JS is disabled. */
html:not(.reader-js) #book-view{display:none}
.offline-nojs{max-width:900px;margin:45px auto 90px;padding:0 20px;color:var(--ink,#173b51);font-family:var(--ui,system-ui,sans-serif)}
.offline-nojs-head{text-align:center;margin-bottom:55px}
.offline-nojs-head h1{font-family:Georgia,serif;font-size:clamp(30px,5vw,50px);margin:12px 0}
.offline-nojs-ar{font-family:'Noto Naskh Arabic',Amiri,serif;font-size:32px}
.offline-nojs-head nav{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 18px;margin:22px auto}
.offline-nojs a{color:#173b51;text-decoration:underline;text-underline-offset:3px}
.offline-nojs-chapter{max-width:720px;margin:0 auto 72px;scroll-margin-top:30px}
.offline-nojs-chapter h2{font:600 clamp(30px,5vw,44px)/1.8 'Noto Naskh Arabic',Amiri,serif;text-align:center;margin:10px 0}
.offline-nojs-chapter h3{text-align:center;font-size:19px;font-weight:500;margin-bottom:35px}
.offline-nojs-paragraph{margin:0 0 29px}
.offline-nojs-paragraph .arabic-paragraph{font-size:clamp(24px,3.4vw,32px);line-height:2.1}
.offline-nojs-english{font-size:16px;line-height:1.65;color:#52616b;text-align:left;direction:ltr;margin-top:3px}
.offline-nojs-vocab{margin:35px auto;padding:16px 0;border-top:1px solid #ddd;border-bottom:1px solid #ddd}
.offline-nojs-vocab summary{cursor:pointer;font-weight:600}
.offline-nojs-vocab dl>div{display:grid;grid-template-columns:1fr 1fr;gap:12px;border-bottom:1px solid #ece8df;padding:9px 0}
.offline-nojs-vocab dt{font:24px/1.7 'Noto Naskh Arabic',Amiri,serif;margin:0}
.offline-nojs-vocab dd{margin:0;line-height:1.5;align-self:center}
@media(max-width:540px){.offline-nojs{margin-top:25px}.offline-nojs-paragraph .arabic-paragraph{line-height:2.15}.offline-nojs-head nav{display:block}.offline-nojs-head nav a{display:block;padding:7px}}

/* No-script mode: do not show JavaScript-only actions as broken buttons. */
html:not(.reader-js) #mobile-tools,
html:not(.reader-js) #desktop-actions,
html:not(.reader-js) #book-back {display:none!important}