:root{--green:#07583d;--green2:#0b6b49;--deep:#043c2a;--cream:#f8f3e6;--paper:#fffdf8;--gold:#d4a63d;--line:#dfd2b2;--muted:#747a74;--shadow:0 12px 36px rgba(24,42,34,.12)}*{box-sizing:border-box}html,body{height:100%;margin:0}body{font-family:'Tajawal',system-ui,sans-serif;background:#e8e6df;color:#153d32;overflow:hidden}button,input{font:inherit}a{color:inherit;text-decoration:none}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.app{height:100vh;height:100dvh;display:grid;grid-template-rows:auto 1fr auto;overflow:hidden}.topbar{min-height:64px;padding:8px max(10px,env(safe-area-inset-right)) 8px max(10px,env(safe-area-inset-left));background:rgba(255,253,248,.97);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:9px;z-index:20}.return-site,.icon-button,.edition-button,.tool-button,.zoom-value{border:1px solid var(--line);background:var(--paper);color:var(--deep);border-radius:13px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:6px;font-weight:700}.return-site{padding:0 13px;white-space:nowrap}.icon-button{width:44px;padding:0;cursor:pointer}.brand{min-width:0;flex:1;padding:0 4px}.brand strong,.brand small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand strong{font-size:.96rem}.brand small{font-size:.72rem;color:var(--muted)}.edition-switch{display:flex;gap:5px}.edition-button{padding:0 10px;cursor:pointer}.edition-button[aria-pressed=true]{background:var(--green);color:white;border-color:var(--green)}.viewer{position:relative;overflow:auto;overscroll-behavior:contain;display:flex;justify-content:center;padding:18px;background:linear-gradient(180deg,#eceae5,#dfddd6)}.page-stage{width:100%;display:flex;justify-content:center;align-items:flex-start}.paper{background:white;box-shadow:0 8px 30px rgba(0,0,0,.14);display:flex;justify-content:center;align-items:flex-start;transition:filter .2s}.paper canvas{display:block;max-width:none}.reading-progress{position:fixed;left:0;right:0;bottom:64px;height:3px;background:transparent;z-index:18}.reading-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--green2),var(--gold));transition:width .18s}.toolbar{min-height:64px;padding:7px max(10px,env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));background:rgba(255,253,248,.98);border-top:1px solid var(--line);display:flex;justify-content:center;align-items:center;gap:6px;z-index:19;overflow-x:auto;scrollbar-width:none}.toolbar::-webkit-scrollbar{display:none}.tool-button,.zoom-value{height:44px;padding:0 11px;cursor:pointer;white-space:nowrap}.tool-button:disabled{opacity:.4;cursor:not-allowed}.icon-only{width:44px;padding:0;font-size:1.15rem}.page-control{height:44px;border:1px solid var(--line);border-radius:13px;background:var(--paper);display:flex;align-items:center;gap:6px;padding:0 8px;white-space:nowrap}.page-control input{width:52px;height:30px;border:0;border-radius:8px;background:#f7f1e4;text-align:center;outline:none;color:var(--deep)}.zoom-value{min-width:68px}.tool-sep{width:1px;height:28px;background:var(--line);margin:0 2px}.loading{position:absolute;inset:0;display:grid;place-items:center;background:rgba(248,243,230,.68);z-index:15}.loading.hidden{display:none}.loading-card{background:white;border:1px solid var(--line);border-radius:18px;padding:20px 26px;text-align:center;box-shadow:var(--shadow)}.loading-card small{display:block;color:var(--muted);margin-top:4px}.spinner{width:28px;height:28px;border:3px solid #ddd;border-top-color:var(--green);border-radius:50%;margin:0 auto 10px;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-box{display:none;margin:auto;padding:18px;background:#fff;border:1px solid #dfb4a8;border-radius:14px}.error-box.active{display:block}.reader-drawer{position:fixed;inset:0;z-index:60;display:none}.reader-drawer.open{display:block}.drawer-backdrop{position:absolute;inset:0;background:rgba(2,28,19,.35);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.reader-panel{position:absolute;top:0;right:0;height:100%;width:min(410px,94vw);background:var(--cream);box-shadow:-14px 0 40px rgba(0,0,0,.18);padding:18px;overflow:auto;padding-bottom:calc(24px + env(safe-area-inset-bottom))}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}.panel-head strong,.panel-head small{display:block}.panel-head small{color:var(--muted);font-size:.75rem}.action-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px}.panel-action{border:1px solid var(--line);background:var(--paper);border-radius:14px;min-height:72px;padding:9px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;color:var(--deep);font-weight:700;cursor:pointer}.panel-action svg{width:22px;height:22px}.panel-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;background:#efe7d4;border-radius:13px;padding:4px;position:sticky;top:-18px;z-index:3}.panel-tab{border:0;background:transparent;border-radius:10px;height:40px;color:var(--deep);font-weight:700;cursor:pointer}.panel-tab.active{background:var(--green);color:white}.panel-section{display:none;padding-top:13px}.panel-section.active{display:block}.reader-search{display:grid;grid-template-columns:1fr auto;gap:7px}.reader-search input{height:44px;border:1px solid var(--line);border-radius:13px;background:var(--paper);padding:0 13px;outline:none}.reader-search button{height:44px;border:0;border-radius:13px;background:var(--green);color:white;padding:0 16px;font-weight:700}.search-status,.panel-empty{color:var(--muted);font-size:.88rem;padding:12px 4px}.search-results,.outline-list{display:grid;gap:7px}.search-result,.outline-item{width:100%;border:1px solid var(--line);background:var(--paper);border-radius:13px;padding:10px 12px;text-align:right;color:var(--deep);cursor:pointer}.search-result b,.outline-item b{display:block}.search-result small{display:block;color:var(--muted);margin-top:3px;line-height:1.5}.outline-item{padding-right:calc(12px + var(--indent,0px))}.thumbs-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.thumb-card{border:1px solid var(--line);background:var(--paper);border-radius:13px;padding:7px;cursor:pointer;color:var(--deep);font-weight:700}.thumb-card.active{border-color:var(--green);box-shadow:0 0 0 1px var(--green)}.thumb-canvas-wrap{aspect-ratio:3/4;background:#eee9df;border-radius:9px;display:grid;place-items:center;overflow:hidden;margin-bottom:5px}.thumb-card canvas{display:block;max-width:100%;max-height:100%}.print-frame{position:fixed;width:1px;height:1px;opacity:0;pointer-events:none;bottom:0;left:0}.toast{position:fixed;left:50%;bottom:86px;transform:translate(-50%,18px);background:var(--deep);color:white;border:1px solid rgba(212,166,61,.65);border-radius:13px;padding:9px 14px;opacity:0;pointer-events:none;transition:.2s;z-index:90;white-space:nowrap}.toast.show{opacity:1;transform:translate(-50%,0)}body.night-reader{background:#12221d}.night-reader .viewer{background:#15231f}.night-reader .paper{filter:invert(.9) hue-rotate(180deg) brightness(.86) contrast(.92)}.night-reader .topbar,.night-reader .toolbar{background:rgba(12,42,31,.98);border-color:#365347}.night-reader .brand,.night-reader .return-site,.night-reader .icon-button,.night-reader .edition-button,.night-reader .tool-button,.night-reader .zoom-value{color:#f6ecd5}.night-reader .return-site,.night-reader .icon-button,.night-reader .edition-button,.night-reader .tool-button,.night-reader .zoom-value,.night-reader .page-control{background:#153d31;border-color:#365347}.night-reader .page-control input{background:#0f2d24;color:#f6ecd5}
@media(max-width:760px){.topbar{min-height:58px;padding-top:6px;padding-bottom:6px}.return-site{width:44px;padding:0}.return-site span{display:none}.brand strong{font-size:.84rem}.brand small{display:none}.edition-button{width:44px;padding:0}.edition-button span{display:none}.viewer{padding:7px}.toolbar{justify-content:flex-start;min-height:58px;padding-top:5px}.tool-button,.zoom-value{height:44px;font-size:.82rem;padding:0 9px}.tool-button span{display:none}.tool-button:first-child span,.tool-button:nth-of-type(2) span{display:none}.icon-only{width:44px}.page-control{height:44px}.page-control input{height:32px;width:46px}.zoom-value{min-width:58px}.reading-progress{bottom:58px}.action-grid{grid-template-columns:repeat(3,1fr)}.reader-panel{width:min(390px,96vw);padding:15px}.panel-tabs{top:-15px}.toast{bottom:76px}}
@media(max-width:380px){.edition-switch{display:none}.action-grid{grid-template-columns:repeat(2,1fr)}}

/* Let wider zoomed pages scroll fully in both directions; avoid Safari double-tap page zoom. */
.viewer{display:block;touch-action:manipulation}
.page-stage{width:max-content;min-width:100%;margin-inline:auto}
.paper{flex:none}

/* Rapid page-button taps must not trigger Safari double-tap viewport zoom.
   Pinch zoom remains available for accessibility. */
html,body,.app,.topbar,.toolbar,.toolbar button,.toolbar input{touch-action:manipulation}


/* READER VIEW FIX 3.4.1 */

/*
 * PDF canvas itself does not need RTL.
 * Keeping the scrollable viewport LTR prevents the right side
 * of oversized/zoomed pages from becoming unreachable.
 */
.viewer{
    direction:ltr !important;
    display:block !important;
    overflow:auto !important;
}

.page-stage{
    width:max-content !important;
    min-width:100% !important;
    display:flex !important;
    justify-content:center !important;
    align-items:flex-start !important;
}

.paper{
    flex:none !important;
    direction:ltr !important;
}

@media(max-width:760px){
    .viewer{
        padding:6px !important;
    }
}



/* READER FONT + LAYOUT FIX 3.4.2 */

.viewer{
    direction:ltr !important;
    display:block !important;
    overflow:auto !important;
}

.page-stage{
    display:block !important;
    width:fit-content !important;
    min-width:100% !important;
    margin:0 auto !important;
}

.paper{
    display:block !important;
    width:fit-content;
    margin:0 auto !important;
    flex:none !important;
    direction:ltr !important;
}

.paper canvas{
    display:block !important;
    max-width:none !important;
}


/* Khalwati V64 — reader phone/tablet/desktop guardrails */
html,body,.app{max-width:100%;overflow-x:hidden}
:where(.reader-shell,.reader-main,.reader-stage,.reader-toolbar,.reader-sidebar){min-width:0;max-width:100%}
:where(img,canvas,iframe){max-width:100%}
@media(max-width:700px){:where(input,select,textarea){font-size:16px}.reader-toolbar{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}.reader-toolbar button,.reader-toolbar a{min-height:44px}}

/* Khalwati V71 — visual viewport constrained PDF reader (Safari/iPhone/iPad) */
html,body{width:100%;max-width:100%;overflow-x:hidden!important}
.app{width:100%;max-width:100vw;min-width:0!important;overflow:hidden!important}
.topbar,.toolbar,.viewer{min-width:0!important;max-width:100%!important}
.viewer{
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    direction:ltr!important;
    display:block!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    position:relative!important;
}
.page-stage{
    box-sizing:border-box!important;
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    align-items:flex-start!important;
    justify-content:center!important;
}
.paper{
    display:block!important;
    flex:0 0 auto!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
    direction:ltr!important;
}
.paper canvas{display:block!important;max-width:none!important;margin:0!important}
.viewer.pdf-fit-horizontal{overflow-x:hidden!important}
.viewer.pdf-fit-horizontal .page-stage{width:100%!important;max-width:100%!important;justify-content:center!important}
.viewer.pdf-overflow-horizontal{overflow-x:auto!important;-webkit-overflow-scrolling:touch}
.viewer.pdf-overflow-horizontal .page-stage{width:max-content!important;min-width:100%!important;max-width:none!important;justify-content:flex-start!important}
@media(max-width:760px){
    .viewer{padding:6px!important;overscroll-behavior-x:none}
}

/* Khalwati Reader 04 — touch targets, focus, compact responsive toolbar */
:root{--kh-reader-touch:48px}
:where(.toolbar button,.toolbar a,.toolbar select,.toolbar input,.reader-toolbar button,.reader-toolbar a,.reader-toolbar select){min-height:var(--kh-reader-touch)}
:where(.toolbar button,.reader-toolbar button){min-width:var(--kh-reader-touch)}
:where(button,a,input,select):focus-visible{outline:2px solid #c99a37;outline-offset:2px}
@media(max-width:700px){
  .toolbar,.reader-toolbar{gap:6px;overscroll-behavior-inline:contain;scrollbar-width:thin}
  .toolbar button,.reader-toolbar button{min-width:48px;min-height:48px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}
\n\n/* Khalwati V8 unified reader: deterministic mobile centering and controlled zoom overflow. */
.viewer{direction:ltr!important;scrollbar-gutter:stable both-edges;}
.page-stage{direction:ltr!important;box-sizing:border-box!important;}
.paper{flex:0 0 auto!important;max-width:none!important;}
@media(max-width:820px){
  .viewer{padding:6px!important;overflow-x:hidden!important;overscroll-behavior-x:none!important;}
  .viewer.pdf-fit-horizontal .page-stage{width:100%!important;min-width:100%!important;justify-content:center!important;margin-inline:auto!important;}
  .viewer.pdf-overflow-horizontal{overflow-x:auto!important;overscroll-behavior-x:contain!important;-webkit-overflow-scrolling:touch!important;}
  .viewer.pdf-overflow-horizontal .page-stage{width:max-content!important;min-width:100%!important;justify-content:flex-start!important;margin-inline:0!important;}
  .paper{margin-inline:auto!important;}
}

/* BEGIN KHALWATI V8.14 READER VIEWPORT */
html,body{max-width:100%;overflow-x:hidden}
#viewerContainer,.viewerContainer,.pdf-viewer,.reader-stage,.reader-viewport{max-width:100%;overscroll-behavior:contain}
canvas{display:block;max-width:none}
@media(max-width:900px){#viewerContainer,.viewerContainer,.pdf-viewer,.reader-stage,.reader-viewport{touch-action:pan-y pinch-zoom}}
/* END KHALWATI V8.14 READER VIEWPORT */


/* =========================================================
   KHALWATI READER V5 — DEVICE-FIT / LOW-MEMORY VIEW
   Final authoritative rules intentionally come last.
   ========================================================= */
:root{
  --kh-topbar-h:58px;
  --kh-toolbar-h:58px;
}
html,body{
  width:100%;
  height:100%;
  margin:0;
  overflow:hidden!important;
  overscroll-behavior:none;
}
body{background:#e7e5df}
.app{
  width:100%;
  height:100vh;
  height:100dvh;
  max-height:100dvh;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  overflow:hidden!important;
}
.topbar{
  min-height:var(--kh-topbar-h)!important;
  padding-top:max(5px,env(safe-area-inset-top))!important;
  padding-bottom:5px!important;
}
.viewer{
  position:relative!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  max-width:100%!important;
  padding:8px!important;
  overflow:auto!important;
  direction:ltr!important;
  display:block!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch;
  background:linear-gradient(180deg,#eceae5,#dedcd5)!important;
}
.page-stage{
  box-sizing:border-box!important;
  width:100%!important;
  min-width:100%!important;
  max-width:none!important;
  min-height:100%!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  direction:ltr!important;
}
.paper{
  flex:0 0 auto!important;
  display:block!important;
  width:fit-content!important;
  height:fit-content!important;
  min-width:0!important;
  max-width:none!important;
  margin:auto!important;
  direction:ltr!important;
  background:#fff!important;
  box-shadow:0 6px 24px rgba(0,0,0,.12)!important;
}
.paper canvas{
  display:block!important;
  width:auto;
  height:auto;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
}
.toolbar{
  min-height:var(--kh-toolbar-h)!important;
  padding-top:5px!important;
  padding-bottom:max(5px,env(safe-area-inset-bottom))!important;
}
.viewer.pdf-fit-horizontal{
  overflow-x:hidden!important;
}
.viewer.pdf-fit-horizontal .page-stage{
  width:100%!important;
  min-width:100%!important;
  justify-content:center!important;
}
.viewer.pdf-overflow-horizontal{
  overflow-x:auto!important;
}
.viewer.pdf-overflow-horizontal .page-stage{
  width:max-content!important;
  min-width:100%!important;
  justify-content:flex-start!important;
}

/* Phones: maximize usable page area; automatic reader edition is used. */
@media(max-width:700px){
  :root{--kh-topbar-h:52px;--kh-toolbar-h:54px}
  .topbar{
    min-height:52px!important;
    gap:6px!important;
    padding-inline:max(6px,env(safe-area-inset-left)) max(6px,env(safe-area-inset-right))!important;
  }
  .viewer{padding:3px!important}
  .page-stage{min-height:100%!important}
  .toolbar{
    min-height:54px!important;
    gap:4px!important;
    padding-inline:max(5px,env(safe-area-inset-left)) max(5px,env(safe-area-inset-right))!important;
  }
  .edition-switch{display:none!important}
  .brand strong{font-size:.78rem!important}
  .return-site,.icon-button{width:42px!important;min-width:42px!important;min-height:42px!important}
  .toolbar .tool-button,.toolbar .zoom-value,.page-control{
    min-height:42px!important;
    height:42px!important;
  }
  #zoomOutButton,#zoomInButton,#zoomValue,.tool-sep,#rotateButton{
    display:none!important;
  }
  #fitButton{min-width:44px!important}
  .page-control{padding-inline:5px!important}
  .page-control input{width:42px!important}
  .reading-progress{bottom:54px!important}
}

/* Tablets/iPad: still prioritize the PDF page rather than chrome. */
@media(min-width:701px) and (max-width:1100px){
  .viewer{padding:6px!important}
  .topbar{min-height:56px!important}
  .toolbar{min-height:56px!important}
  .edition-switch{display:none!important}
}

@media(orientation:landscape) and (max-height:600px){
  :root{--kh-topbar-h:48px;--kh-toolbar-h:50px}
  .topbar{min-height:48px!important;padding-block:3px!important}
  .toolbar{min-height:50px!important;padding-top:3px!important;padding-bottom:max(3px,env(safe-area-inset-bottom))!important}
  .viewer{padding:2px!important}
  .brand small{display:none!important}
}

@media(prefers-reduced-motion:reduce){
  .paper,.reading-progress span{transition:none!important}
}


/* =========================================================
   KHALWATI READER V6 — FINAL DEVICE-FIT OVERRIDES
   ========================================================= */
html,body,.app{width:100%;max-width:100%;height:100%;overflow:hidden}
.app{height:100dvh;max-height:100dvh}
.viewer{
  min-width:0!important;
  min-height:0!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  padding:5px!important;
  overflow:auto!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch;
}
.page-stage{
  min-width:100%!important;
  min-height:100%!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.paper{margin:auto!important;max-width:none!important}
.paper canvas{display:block!important;max-width:none!important;max-height:none!important}

@media(max-width:700px){
  .topbar{min-height:48px!important;padding-block:max(3px,env(safe-area-inset-top)) 3px!important}
  .viewer{padding:2px!important}
  .toolbar{min-height:50px!important;padding-top:3px!important;padding-bottom:max(3px,env(safe-area-inset-bottom))!important}
  .brand small,.edition-switch,#zoomOutButton,#zoomInButton,#zoomValue,.tool-sep,#rotateButton{display:none!important}
  .return-site,.icon-button,.toolbar .tool-button,.page-control{min-height:40px!important;height:40px!important}
  .return-site,.icon-button{width:40px!important;min-width:40px!important}
  .page-control input{width:38px!important}
  .reading-progress{bottom:50px!important}
}
@media(min-width:701px) and (max-width:1100px){
  .viewer{padding:4px!important}
  .topbar,.toolbar{min-height:53px!important}
  .edition-switch{display:none!important}
}
@media(orientation:landscape) and (max-height:560px){
  .topbar{min-height:44px!important;padding-block:2px!important}
  .toolbar{min-height:46px!important}
  .viewer{padding:1px!important}
  .brand small{display:none!important}
}