@font-face{font-family:Bersan;src:url('assets/fonts/Bersan-vnlvE.ttf') format('truetype');font-display:swap}@font-face{font-family:Obida;src:url('assets/fonts/Obida.ttf') format('truetype');font-display:swap}@font-face{font-family:'Turath Arabic';src:url('assets/fonts/NotoSansArabic.ttf') format('truetype');font-weight:100 900;font-display:swap}
:root{--paper:#f4eadd;--muted:#c6b8a7;--line:#ffffff26;--body:Obida,Arial,sans-serif;--heading:Obida,Arial,sans-serif;color-scheme:dark}*{box-sizing:border-box}body{margin:0;color:var(--paper);background:#211d1b;font-family:var(--body);background-image:radial-gradient(ellipse at 50% 40%,#4b3f32 0,transparent 70%);min-height:100svh}button,a,select{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button,select{font:inherit;color:inherit}button{cursor:pointer;background:none;border:0}button:disabled{opacity:.3;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible{outline:2px solid #cfb894;outline-offset:4px}button:hover:not(:disabled),a:hover{color:#e3c9a3}[hidden]{display:none!important}.reader-header{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:22px clamp(18px,4vw,70px);border-bottom:1px solid var(--line);background:#211d1bba}.reader-brand{width:160px;flex:none;direction:ltr}.reader-brand img{width:100%;height:auto;filter:brightness(0) invert(1)}.reader-title{text-align:center}.reader-title>span{font-size:12px;letter-spacing:.1em;color:var(--muted)}h1{font:400 22px/1.5 var(--heading);margin:6px 0 0}.reader-actions{display:flex;align-items:center;gap:22px;font-size:16px}.reader-actions button{border:1px solid var(--line);padding:7px 12px;border-radius:3px;font-family:'Turath Arabic',Arial,sans-serif;font-size:12px}main{width:min(1440px,100%);margin:auto;padding:24px 30px 0}.book-stage{height:min(calc(100svh - 390px),820px);min-height:240px;display:flex;align-items:center;justify-content:center;position:relative;isolation:isolate}.book-surface{position:relative;filter:drop-shadow(0 20px 22px #0007);direction:ltr}.book-spine{position:absolute;left:50%;top:0;bottom:0;width:1px;background:#261a0f33;pointer-events:none;z-index:3;box-shadow:-2px 0 4px #0001,2px 0 4px #0001}.catalogue-page{background:#f3ecdf;overflow:hidden}.page-art{width:100%;height:100%;position:relative;pointer-events:none;background:#f3ecdf}.page-art img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}.page-paper-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#00000008,transparent 8%,transparent 94%,#00000008)}#catalogue-book{direction:ltr;touch-action:pan-y}.reader-loading{position:absolute;z-index:8;padding:18px 24px;background:#211d1bf0;border:1px solid var(--line);border-radius:4px;font-size:18px;max-width:85%;text-align:center}.reader-loading button{margin-inline-start:15px;text-decoration:underline}.reader-hint{text-align:center;margin:20px 0 8px;font-size:16px;line-height:1.6;color:var(--muted)}.reader-controls{display:flex;align-items:center;justify-content:center;gap:36px;margin:10px auto;max-width:620px}.reader-controls>button{display:flex;gap:14px;align-items:center;min-width:110px;justify-content:center;padding:12px;font-size:19px;border:1px solid var(--line);border-radius:3px}.reader-controls>button>span[aria-hidden]{font-family:Arial,sans-serif;font-size:23px}.reader-location{display:flex;align-items:center;justify-content:center;gap:10px;white-space:nowrap;font-size:18px}.reader-location select{padding:8px 10px;border:1px solid var(--line);border-radius:3px;background:#302a25;direction:ltr;min-width:60px;font-size:18px}.reader-total{direction:ltr;unicode-bidi:isolate}.reader-tools{display:flex;justify-content:center;gap:30px;flex-wrap:wrap;margin:20px 0 30px;font-size:17px}.reader-tools button{border-bottom:1px solid var(--line);padding:6px 0}.reader-contents{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px;padding:25px 0 35px;border-top:1px solid var(--line)}.reader-contents button{display:block;padding:0;text-align:start}.reader-contents img{display:block;width:100%;aspect-ratio:1690/1191;object-fit:contain;background:#322c27}.reader-contents button>span{display:block;margin-top:10px;font-size:15px}.reader-contents button[aria-current=true] img{outline:2px solid #d3b994;outline-offset:3px}.reader-footer{display:flex;justify-content:space-between;padding:20px clamp(18px,4vw,70px);gap:20px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}.reader-footer>span:first-child{letter-spacing:.12em}dialog{inset:0;width:100%;height:100svh;max-height:none;max-width:none;margin:0;border:0;padding:0;background:#171b1c;color:var(--paper);overflow:hidden}dialog[open]{display:flex;flex-direction:column}dialog::backdrop{background:#000a}.zoom-toolbar{display:flex;align-items:center;gap:25px;padding:14px 22px;border-bottom:1px solid var(--line);flex:none}.zoom-toolbar h2{font:400 20px/1.7 var(--body);margin:0;flex:1}.zoom-toolbar button{font-size:17px;padding:8px;border:1px solid var(--line);border-radius:3px}.zoom-scroll{flex:1;min-height:0;overflow:auto;padding:20px;direction:ltr}#zoom-spread{display:flex;align-items:flex-start;width:min(1690px,100%);margin:auto}#zoom-spread img{display:block;width:50%;height:auto;max-width:none}#zoom-spread.actual-size{width:1690px;max-width:none}#zoom-spread img:first-child{order:0}#zoom-spread img:last-child{order:1}.zoom-note{margin:0;padding:12px;text-align:center;color:var(--muted);font-size:16px;border-top:1px solid var(--line)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}html[lang=ar]{--body:'Turath Arabic',Tahoma,Arial,sans-serif;--heading:'Turath Arabic',Tahoma,Arial,sans-serif}html[lang=ar] .reader-title>span{letter-spacing:0;font-size:11px}html[lang=ar] h1{font-size:22px}html[lang=ar] .reader-actions,html[lang=ar] .reader-hint,html[lang=ar] .reader-tools,html[lang=ar] .reader-controls>button,html[lang=ar] .reader-location{font-size:13px;line-height:1.9}html[lang=ar] .reader-footer,html[lang=ar] .reader-contents button>span{font-size:11px}html[lang=ar] .reader-controls>button{direction:ltr}.reader-controls{direction:ltr}html[lang=ar] .reader-location{direction:rtl}html[lang=ar] .zoom-toolbar h2,html[lang=ar] .zoom-toolbar button,html[lang=ar] .zoom-note{font-size:13px}
@media(max-width:760px){.reader-header{padding:15px 18px;gap:12px;flex-wrap:wrap}.reader-brand{width:120px}.reader-title{order:3;width:100%;text-align:start;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:11px}.reader-title>span{font-size:11px}h1{font-size:15px;margin:0}.reader-actions{margin-inline-start:auto;gap:13px;font-size:14px}.reader-actions button{font-size:11px;padding:5px 9px}main{padding:14px 12px 0}.book-stage{height:auto;aspect-ratio:1690/1191;min-height:0}.reader-hint{font-size:14px;margin:19px 10px 12px}.reader-controls{gap:12px}.reader-controls>button{padding:9px 7px;gap:7px;min-width:80px;font-size:16px}.reader-location{gap:6px;font-size:16px}.reader-location select{padding:6px;min-width:46px;font-size:16px}.reader-tools{gap:24px;font-size:15px;margin-top:16px}.reader-contents{grid-template-columns:repeat(3,minmax(0,1fr));gap:17px 12px}.reader-footer{font-size:12px;line-height:1.7;padding:18px;flex-wrap:wrap}.reader-loading{font-size:15px;padding:12px 15px}.zoom-toolbar{gap:9px;padding:10px 12px}.zoom-toolbar h2{font-size:17px}.zoom-toolbar button{font-size:14px;padding:6px}.zoom-scroll{padding:8px}.zoom-note{font-size:14px;padding:12px}.reader-contents button>span{font-size:13px}html[lang=ar] .reader-title>span{font-size:10px}html[lang=ar] h1{font-size:16px}html[lang=ar] .reader-actions{font-size:11px}html[lang=ar] .reader-controls>button{font-size:11px}html[lang=ar] .reader-controls{gap:8px}html[lang=ar] .reader-location{font-size:11px}html[lang=ar] .reader-footer>span:first-child{font-size:10px}html[lang=ar] .reader-loading{font-size:12px}}
@media(max-width:360px){.reader-controls{gap:6px}.reader-controls>button{min-width:72px}.reader-location label{font-size:14px}.reader-actions{font-size:13px}.reader-title>span{letter-spacing:0}.reader-tools{gap:19px}html[lang=ar] .reader-actions{font-size:10px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

/* Immersive reader: the paper owns the entire viewport. */
html,body{width:100%;height:100%;overflow:hidden}
main{position:fixed;inset:0;width:100%;max-width:none;margin:0;padding:0}
.book-stage{position:absolute;inset:0;width:100%;height:100dvh;min-height:0;aspect-ratio:auto}
.book-surface{filter:drop-shadow(0 8px 20px #0006)}
.reader-header{position:fixed;inset:0 0 auto;z-index:20;padding:10px 18px;min-height:58px;border:0;background:linear-gradient(#171513dc,#17151370,transparent);gap:16px}
.reader-brand{width:115px}.reader-title{display:none}.reader-actions{gap:16px;margin-inline-start:auto}
.reader-hint,.reader-footer{display:none}
.reader-controls{position:fixed;z-index:20;bottom:45px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 16px);margin:0;padding:5px 10px;gap:18px;background:#211d1be8;border:1px solid #ffffff24;border-radius:6px;backdrop-filter:blur(10px)}
.reader-controls>button{font-size:16px;padding:5px 8px;min-width:85px;border:0}
.reader-location,.reader-location select{font-size:15px}.reader-location select{padding:3px 6px}
.reader-tools{position:fixed;z-index:20;bottom:4px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 12px);gap:24px;margin:0;padding:3px 15px;background:#211d1be8;border-radius:5px;font-size:14px}
.reader-tools button{padding:5px 0;border:0}
.reader-contents{position:fixed;z-index:25;inset:65px 18px 112px;padding:20px;overflow:auto;background:#211d1bf5;border:1px solid var(--line);border-radius:8px;overscroll-behavior:contain}
.reader-header,.reader-controls,.reader-tools{transition:opacity .35s,visibility .35s}
.reader-idle .reader-header,.reader-idle .reader-controls,.reader-idle .reader-tools{opacity:0;visibility:hidden;pointer-events:none}
@media(max-width:760px){.reader-header{padding:8px 12px;min-height:52px;flex-wrap:nowrap}.reader-brand{width:96px}.reader-actions{gap:9px}.reader-controls{gap:8px;bottom:45px;padding:4px 6px}.reader-controls>button{min-width:69px;font-size:14px;gap:5px}.reader-tools{gap:18px;font-size:13px}.reader-contents{inset:60px 8px 108px;padding:12px}.reader-location{gap:5px}.reader-location label{font-size:13px}html[lang=ar] .reader-controls{gap:6px}}
@media(prefers-reduced-motion:reduce){.reader-header,.reader-controls,.reader-tools{transition:none}}

/* Header decoration must not intercept the paper corners. */
.reader-header{pointer-events:none}.reader-header a,.reader-header button{pointer-events:auto}
.book-surface,#catalogue-book{touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab}.book-surface.is-dragging{cursor:grabbing}

