*{margin:0;padding:0;box-sizing:border-box;transition:all .3s cubic-bezier(.4,0,.2,1)}body{font-family:Cairo,Tajawal,sans-serif;direction:rtl;background:linear-gradient(to bottom right,#fff,#fef9f34d,#fff);color:#1e293b;min-height:100vh}#root{min-height:100vh}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:linear-gradient(to bottom,#f1f5f9,#e2e8f0);border-radius:10px}::-webkit-scrollbar-thumb{background:linear-gradient(to bottom,#c19758,#a67d47);border-radius:10px;border:2px solid #f1f5f9}::-webkit-scrollbar-thumb:hover{background:linear-gradient(to bottom,#a67d47,#8b6539)}input:focus,button:focus{outline:none}.glass{background:#ffffffb3;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.layout{min-height:100vh;background:linear-gradient(to bottom right,#fff,#fef9f34d,#fff);position:relative;overflow:hidden}.layout-decorations{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none}.layout-decoration-1{position:absolute;top:0;right:0;width:384px;height:384px;background:#fae4cc33;border-radius:50%;filter:blur(96px);margin-right:-192px;margin-top:-192px}.layout-decoration-2{position:absolute;bottom:0;left:0;width:384px;height:384px;background:#f6d0a826;border-radius:50%;filter:blur(96px);margin-left:-192px;margin-bottom:-192px}.layout-decoration-3{position:absolute;top:50%;left:50%;width:384px;height:384px;background:#fdf2e61a;border-radius:50%;filter:blur(96px);transform:translate(-50%,-50%)}.layout-main{position:relative;z-index:10;width:100%;min-height:100vh}.book-viewer{min-height:100vh;padding:4px;display:flex;flex-direction:column;gap:24px;max-width:1280px;margin:0 auto}@media(min-width:640px){.book-viewer{padding:16px;gap:24px}}@media(min-width:768px){.book-viewer{padding:24px;gap:32px}}@media(min-width:1024px){.book-viewer{padding:32px;gap:32px}}.header-card{position:relative;background:linear-gradient(to bottom right,#fff,#fef9f34d,#fff);border-radius:16px;box-shadow:0 25px 50px -12px #00000040;border:1px solid rgba(193,151,88,.5);padding:12px;overflow:hidden}@media(min-width:640px){.header-card{border-radius:24px;padding:20px}}@media(min-width:768px){.header-card{padding:32px}}.header-decor-1{position:absolute;top:0;right:0;width:256px;height:256px;background:#fae4cc33;border-radius:50%;filter:blur(96px);margin-right:-128px;margin-top:-128px}.header-decor-2{position:absolute;bottom:0;left:0;width:192px;height:192px;background:#f6d0a81a;border-radius:50%;filter:blur(64px);margin-left:-96px;margin-bottom:-96px}.header-content{position:relative;display:flex;flex-direction:column;align-items:center;gap:12px}@media(min-width:640px){.header-content{flex-direction:row;gap:16px}}@media(min-width:768px){.header-content{gap:24px}}.logo-container{flex-shrink:0;position:relative}.logo-glow{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom right,#f0b873,#c19758);border-radius:16px;filter:blur(24px);opacity:.3;animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes pulse{0%,to{opacity:.3}50%{opacity:.5}}.logo-wrapper{position:relative}.logo-img{width:64px;height:64px;-o-object-fit:contain;object-fit:contain;border-radius:12px;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;border:2px solid #ffffff;background:#ffffff80;padding:6px}@media(min-width:640px){.logo-img{width:80px;height:80px;border-radius:16px;border-width:2px}}@media(min-width:768px){.logo-img{width:96px;height:96px;border-radius:20px;border-width:4px}}@media(min-width:1024px){.logo-img{width:112px;height:112px;border-radius:24px}}.logo-img:hover{transform:scale(1.05)}.title-section{flex:1;text-align:center}@media(min-width:640px){.title-section{text-align:right}}.title-section-inner{padding:0 8px}.title{font-size:16px;font-weight:700;background:linear-gradient(to right,#8b6539,#c19758,#704f2e);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-family:Amiri,Cairo,Tajawal,serif;line-height:1.75;word-break:break-word}@media(min-width:640px){.title{font-size:18px}}@media(min-width:768px){.title{font-size:20px}}@media(min-width:1024px){.title{font-size:24px}}.download-btn{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(to right,#c19758,#a67d47);color:#fff;padding:8px 16px;border-radius:8px;font-size:12px;font-weight:600;text-decoration:none;transition:all .3s;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}@media(min-width:640px){.download-btn{gap:8px;padding:10px 20px;border-radius:12px;font-size:14px}}@media(min-width:768px){.download-btn{padding:12px 24px}}.download-btn:hover{background:linear-gradient(to right,#a67d47,#8b6539);box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;transform:scale(1.05)}.download-icon{width:14px;height:14px}@media(min-width:640px){.download-icon{width:16px;height:16px}}.audio-player{position:relative;margin-top:16px;background:linear-gradient(to right,#c19758,#a67d47,#8b6539);border-radius:12px;padding:12px;color:#fff;box-shadow:0 25px 50px -12px #00000040;overflow:hidden}@media(min-width:640px){.audio-player{margin-top:24px;border-radius:16px;padding:16px}}@media(min-width:768px){.audio-player{margin-top:32px;border-radius:24px;padding:28px}}.audio-bg-1{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to right,rgba(240,184,115,.2),transparent);animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.audio-bg-2{position:absolute;top:0;right:0;width:128px;height:128px;background:#ffffff1a;border-radius:50%;filter:blur(64px)}.audio-controls{position:relative;display:flex;align-items:center;gap:8px}@media(min-width:640px){.audio-controls{gap:12px}}@media(min-width:768px){.audio-controls{gap:24px}}.play-btn{position:relative;width:48px;height:48px;border-radius:12px;background:#ffffff40;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;transition:all .3s;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;flex-shrink:0;border:1px solid rgba(255,255,255,.3);cursor:pointer}@media(min-width:640px){.play-btn{width:56px;height:56px;border-radius:16px}}@media(min-width:768px){.play-btn{width:64px;height:64px}}.play-btn:hover{background:#ffffff59;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;transform:scale(1.1)}.play-btn-glow{position:absolute;top:0;right:0;bottom:0;left:0;background:#fff3;border-radius:12px;filter:blur(4px)}@media(min-width:640px){.play-btn-glow{border-radius:16px}}.play-icon{width:24px;height:24px;fill:#fff;position:relative;z-index:10;margin-right:2px}@media(min-width:640px){.play-icon{width:28px;height:28px}}@media(min-width:768px){.play-icon{width:32px;height:32px}}.audio-info{flex:1;display:flex;flex-direction:column;gap:12px}.audio-header{display:flex;align-items:center;justify-content:space-between}.audio-label{display:flex;align-items:center;gap:8px;color:#ffffffe6}.volume-icon{width:16px;height:16px}.audio-label-text{font-size:12px;font-weight:500}@media(min-width:640px){.audio-label-text{font-size:14px}}.audio-time{display:flex;justify-content:space-between;font-size:12px;color:#ffffffe6;font-family:monospace;font-weight:600;direction:ltr}@media(min-width:640px){.audio-time{font-size:14px}}.audio-slider{width:100%;height:10px;background:#ffffff40;border-radius:9999px;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;box-shadow:inset 0 2px 4px #0000000f}.audio-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;background:#fff;border-radius:50%;cursor:pointer}.audio-slider::-moz-range-thumb{width:16px;height:16px;background:#fff;border-radius:50%;cursor:pointer;border:none}.pdf-container{position:relative;background:linear-gradient(to bottom right,#fff,#fef9f333);border-radius:12px;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;border:1px solid rgba(193,151,88,.5);overflow:hidden;height:calc(100vh - 280px);min-height:400px;max-height:900px}@media(min-width:640px){.pdf-container{border-radius:16px}}@media(min-width:768px){.pdf-container{border-radius:24px}}.pdf-decor{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom right,rgba(254,249,243,.5),transparent);pointer-events:none;z-index:0}.pdf-decor-mobile-1{position:absolute;top:0;right:0;width:128px;height:128px;background:#fdf2e633;border-radius:50%;filter:blur(64px);margin-right:-64px;margin-top:-64px}@media(min-width:640px){.pdf-decor-mobile-1,.pdf-decor-mobile-2{display:none}}.pdf-decor-mobile-2{position:absolute;bottom:0;left:0;width:128px;height:128px;background:#fdf2e633;border-radius:50%;filter:blur(64px);margin-left:-64px;margin-bottom:-64px}.pdf-content{position:relative;z-index:10;height:100%}.pdf-viewer{position:relative;width:100%;height:100%;display:flex;flex-direction:column}.pdf-toolbar{display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;gap:6px;padding:6px;background:linear-gradient(to right,#fef9f380,#fff,#fef9f380);border-bottom:1px solid rgba(193,151,88,.5);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);flex-shrink:0;box-shadow:0 1px 2px #0000000d}@media(min-width:640px){.pdf-toolbar{flex-direction:row;align-items:center;gap:8px;padding:8px}}@media(min-width:768px){.pdf-toolbar{gap:12px;padding:16px}}.toolbar-group{display:flex;align-items:center;justify-content:center;gap:4px;background:#ffffffe6;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:8px;padding:4px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;border:1px solid rgba(193,151,88,.5)}@media(min-width:640px){.toolbar-group{gap:6px;padding:6px;border-radius:12px}}@media(min-width:768px){.toolbar-group{gap:8px;padding:8px;border-radius:16px}}.toolbar-btn{padding:6px;border-radius:6px;background:linear-gradient(to bottom right,#fdf2e6,#fef9f3);border:none;cursor:pointer;transition:all .3s;box-shadow:0 1px 2px #0000000d;touch-action:manipulation}@media(min-width:640px){.toolbar-btn{padding:8px;border-radius:8px}}@media(min-width:768px){.toolbar-btn{padding:10px;border-radius:12px}}.toolbar-btn:hover{background:linear-gradient(to bottom right,#fae4cc,#fdf2e6);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.toolbar-btn:active{transform:scale(.95)}.toolbar-btn:disabled{opacity:.4;cursor:not-allowed}.toolbar-btn:disabled:hover{box-shadow:0 1px 2px #0000000d}.toolbar-icon{width:14px;height:14px;color:#8b6539}@media(min-width:640px){.toolbar-icon{width:16px;height:16px}}@media(min-width:768px){.toolbar-icon{width:20px;height:20px}}.page-input-form{display:flex;align-items:center;gap:6px;padding:0 4px}@media(min-width:640px){.page-input-form{gap:6px;padding:0 6px}}@media(min-width:768px){.page-input-form{gap:8px;padding:0 8px}}.page-input{width:40px;padding:4px 6px;text-align:center;font-size:12px;font-weight:700;color:#5a4025;background:#fff;border:1px solid #f6d0a8;border-radius:6px;direction:ltr}@media(min-width:640px){.page-input{width:48px;padding:6px;font-size:14px;border-radius:8px}}@media(min-width:768px){.page-input{width:56px;padding:8px;border-width:2px;border-radius:12px}}@media(min-width:1024px){.page-input{width:64px}}.page-input:focus{outline:none;box-shadow:0 0 0 2px #c1975880;border-color:#c19758}.page-separator{font-size:12px;font-weight:600;color:#a67d47}@media(min-width:640px){.page-separator{font-size:14px}}.page-total{font-size:12px;font-weight:700;color:#5a4025}@media(min-width:640px){.page-total{font-size:14px}}.zoom-display{padding:4px 12px;font-size:12px;font-weight:700;color:#5a4025;background:linear-gradient(to bottom right,#fdf2e6,#fef9f3);border:1px solid #f6d0a8;border-radius:6px;touch-action:manipulation}@media(min-width:640px){.zoom-display{padding:6px 12px;font-size:14px;border-radius:8px}}@media(min-width:768px){.zoom-display{padding:8px 16px;border-width:2px;border-radius:12px}}.zoom-display:hover{background:linear-gradient(to bottom right,#fae4cc,#fdf2e6);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.zoom-display:active{transform:scale(.95)}.toolbar-btn-slate{background:linear-gradient(to bottom right,#f1f5f9,#f8fafc)}.toolbar-btn-slate:hover{background:linear-gradient(to bottom right,#e2e8f0,#f1f5f9)}.toolbar-icon-slate{color:#475569}.pdf-canvas-container{flex:1;position:relative;background:linear-gradient(to bottom right,#fff,#fef9f333,#fff);overflow:auto}.pdf-canvas-wrapper{display:flex;justify-content:center;align-items:flex-start;padding:2px;direction:ltr;min-height:100%}@media(min-width:640px){.pdf-canvas-wrapper{padding:8px}}@media(min-width:768px){.pdf-canvas-wrapper{padding:16px}}@media(min-width:1024px){.pdf-canvas-wrapper{padding:24px}}.pdf-canvas-inner{position:relative;display:inline-block;line-height:0;transform:none;max-width:100%}.pdf-canvas{box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;background:#fff;border-radius:8px;border:1px solid #ffffff;width:100%;height:auto;display:block;max-width:100%;direction:ltr;transform:none;image-rendering:auto;-o-object-fit:contain;object-fit:contain}@media(min-width:640px){.pdf-canvas{box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;border-radius:12px;border-width:2px}}@media(min-width:768px){.pdf-canvas{box-shadow:0 25px 50px -12px #00000040;border-radius:16px;border-width:4px}}.pdf-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;background:linear-gradient(to bottom right,#fff,#fef9f34d,#fff)}.loading-spinner-wrapper{position:relative}.loading-spinner-glow{position:absolute;top:0;right:0;bottom:0;left:0;background:#fae4cc;border-radius:50%;filter:blur(64px);opacity:.5;animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.loading-spinner{width:64px;height:64px;color:#a67d47;animation:spin 1s linear infinite;position:relative;z-index:10}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-text{color:#704f2e;font-weight:600;font-size:18px;margin-top:24px}.loading-subtext{color:#a67d47;font-size:14px;margin-top:8px}.pdf-error{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:32px;background:linear-gradient(to bottom right,#fef2f2,#fee2e2)}.error-box{background:#fff;border-radius:16px;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;padding:32px;max-width:448px;text-align:center}.error-icon-wrapper{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:50%;background:#fee2e2;margin-bottom:16px}.error-icon{width:32px;height:32px;color:#dc2626}.error-title{font-size:20px;font-weight:700;color:#991b1b;margin-bottom:8px}.error-message{color:#b91c1c;margin-bottom:16px}.pdf-empty{display:flex;align-items:center;justify-content:center;height:100%}.empty-text{color:#475569}.ziyarat-container{display:flex;flex-direction:column;gap:24px}.ziyarat-header{background:linear-gradient(to right,#704f2e,#a67d47);border-radius:16px;padding:32px;color:#fff;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.ziyarat-title{font-size:30px;font-weight:700;font-family:Amiri,Cairo,Tajawal,serif;margin-bottom:8px}.ziyarat-subtitle{font-size:20px;opacity:.9}.ziyarat-description{margin-top:16px;color:#fdf2e6;max-width:672px}.ziyarat-controls{margin-top:24px;display:flex;align-items:center;gap:16px}.ziyarat-play-btn{display:flex;align-items:center;padding:12px 24px;background:#c19758;color:#5a4025;font-weight:700;border-radius:9999px;border:none;cursor:pointer;transition:all .3s;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.ziyarat-play-btn:hover{background:#f0b873}.ziyarat-play-icon{width:20px;height:20px;margin-right:8px}.ziyarat-status{font-size:12px;color:#fdf2e6cc;text-transform:uppercase;letter-spacing:.1em}.ziyarat-segments{background:#fff;border-radius:16px;box-shadow:0 1px 2px #0000000d;border:1px solid rgba(253,242,230,1)}.ziyarat-segment{padding:24px;transition:all .5s;cursor:pointer;border-left:4px solid transparent}.ziyarat-segment:hover{background:#f8fafc}.ziyarat-segment-active{background:#fef9f3;border-left-color:#c19758;box-shadow:inset 0 2px 4px #0000000f;transform:scale(1.01)}.ziyarat-segment-content{display:flex;flex-direction:column;gap:16px}.ziyarat-arabic{text-align:right;font-family:Amiri,Cairo,Tajawal,serif;font-size:24px;line-height:1.75;color:#334155}@media(min-width:768px){.ziyarat-arabic{font-size:30px}}.ziyarat-arabic-active{color:#704f2e;font-weight:700}.ziyarat-transliteration{display:flex;flex-direction:column;gap:4px;font-size:14px;color:#64748b}@media(min-width:768px){.ziyarat-transliteration{flex-direction:row;justify-content:space-between;font-size:16px}}.ziyarat-transliteration-text{font-weight:500;color:#a67d47;font-style:italic}.ziyarat-translation{color:#475569;border-top:1px dashed #e2e8f0;padding-top:8px;margin-top:8px}.ziyarat-note{text-align:center;color:#94a3b8;font-size:14px;font-style:italic}