@font-face{font-family:"_PDMS_IslamicFont";src:url("assets/PDMS_ISLAMICFONT.ttf?v=fcab8f52c8b816b6beb32a778dd47c2bf9f2784de833fe8c44ddb88ec55cb04d") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Me Quran";src:url("assets/me-quran.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Noto Sans";src:url("assets/noto-sans.ttf") format("truetype");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Amiri Quran";src:url("assets/amiri-quran.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Rubik";src:url("assets/rubik.ttf") format("truetype");font-weight:300 900;font-style:normal;font-display:swap}
:root{--green:#173f37;--green-light:#2b594d;--gold:#ba9a59;--ink:#273a32;--muted:#838b81;--paper:#fff;--background:#fff;--arabic-size:30px;font-family:"Noto Sans",Arial,Helvetica,sans-serif;color:var(--ink);background:var(--background);font-synthesis:none}
html,body,body *{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
input,textarea,[contenteditable="true"]{user-select:text;-webkit-user-select:text;-webkit-touch-callout:default}
*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.35}button,a,input{ -webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #ba9a59;outline-offset:4px}button{color:inherit}a{color:inherit}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}[hidden]{display:none!important}.visually-hidden,.reader-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.skip-link{position:fixed;top:-80px;left:20px;z-index:100;background:white;padding:12px}.skip-link:focus{top:10px}
.sidebar{width:272px;position:fixed;inset:0 auto 0 0;background:var(--green);color:#f1ead9;padding:33px 23px 20px;display:flex;flex-direction:column;z-index:30}.brand{display:flex;gap:13px;align-items:center;padding:0 4px}.brand-name{font-family:Georgia,serif;font-size:25px;letter-spacing:-.4px}.brand-caption{font-size:8px;letter-spacing:2.5px;color:#b7c4ae;margin-top:7px}.sidebar-intro{font-size:12px;color:#a7bbad;margin:26px 4px 29px}.small-star{color:#d5b774;margin-right:7px;font-size:19px;vertical-align:middle}.quick-links{display:grid;gap:4px}.quick-links button{background:none;border:0;border-radius:7px;color:#d4dfd4;display:flex;align-items:center;padding:13px 11px;text-align:left;font-size:12px;gap:13px}.quick-links button:hover{background:#ffffff0c}.quick-links button>span{font-size:18px;color:#b99e65}.quick-links small{margin-left:auto;color:#9caf9c;font-size:10px}.jump-form{margin:21px 4px 26px}.jump-form label{display:block;font-size:9px;color:#a9bea9;letter-spacing:1.7px;margin-bottom:12px}.jump-form>div{display:flex;align-items:center;gap:8px;border:1px solid #73907766;border-radius:6px;padding:3px 4px 3px 10px}.jump-form input{background:transparent;border:0;color:white;width:53px;font-size:14px;padding:9px 0;outline-offset:0}.jump-form span{font-size:11px;color:#acbdab}.jump-form button{margin-left:auto;border:0;background:#355b4e;color:#ebddb5;width:32px;height:30px;border-radius:4px}.index-title{display:flex;align-items:center;justify-content:space-between;padding:0 5px;margin:0 0 15px}.index-title h2{margin:0;font-size:12px;font-weight:400;letter-spacing:.3px}.index-title>span{color:#acbdab;font-size:10px;border:1px solid #6e897366;padding:3px 6px;border-radius:4px}.surah-search{display:flex;align-items:center;gap:9px;margin:0 4px 14px;border-bottom:1px solid #6e897355;padding-bottom:11px;color:#9cb49e}.surah-search svg{width:15px;height:15px}.surah-search input{width:100%;min-width:0;border:0;background:transparent;color:#edf0df;font-size:11px}.surah-search input::placeholder{color:#9cb49e}.surah-list{overflow-y:auto;min-height:0;flex:1;margin:0 -7px;scrollbar-width:thin;scrollbar-color:#527563 transparent}.surah-link{width:100%;display:flex;align-items:center;gap:11px;color:#cbd9c9;background:transparent;border:0;text-align:left;padding:13px 12px;border-radius:6px}.surah-link:hover{background:#ffffff09}.surah-link.selected{background:#ffffff0e;color:#f6ead1;box-shadow:inset 2px 0 #c5a668}.surah-index-number{font-size:10px;color:#9aae99;min-width:20px;font-variant-numeric:tabular-nums}.surah-link-name{min-width:0;flex:1;display:grid;gap:5px;font-size:12px}.surah-link-name small{font-size:9px;color:#8fa993;line-height:1.4}.surah-start-page{font-size:10px;color:#91aa96}.sidebar-footer{margin-top:18px;padding:16px 4px 0;border-top:1px solid #6e897344;font-size:10px;line-height:2;color:#9fb59f}.sidebar-footer a{font-size:9px;color:#9fb59f;text-decoration:none}.sidebar-footer a:hover{text-decoration:underline}.index-loading,.no-results{font-size:12px;padding:10px 15px;color:#b9c9b9}.workspace{margin-left:272px}.topbar{height:82px;display:flex;justify-content:space-between;align-items:center;padding:0 48px;border-bottom:1px solid #d7d9cd;background:#f8f8f0a8}.topbar-left{display:flex;align-items:center;gap:18px}.topbar-title{font-size:12px;letter-spacing:.2px}.topbar-caption{color:#8b9287;font-size:11px}.topbar-divider{height:13px;width:1px;background:#d0d4c7}.text-controls{display:flex;gap:3px;border:1px solid #d5d9cb;border-radius:6px;padding:2px}.text-controls button{font-family:Georgia,serif;font-size:16px;border:0;background:transparent;padding:6px 10px}.text-controls button:hover{background:#e6e9de;border-radius:4px}.text-controls span{font-family:"Noto Sans",Arial,sans-serif;font-size:11px;margin-left:2px}.icon-button{border:0;background:none;padding:6px;color:inherit}.menu-toggle,.sidebar-close{display:none}
main{max-width:838px;padding:38px 30px 140px;margin:0 auto;outline:0}.reading-heading{display:flex;align-items:end;justify-content:space-between;padding:0 4px;margin-bottom:27px;gap:20px}.eyebrow{font-size:9px;letter-spacing:2.5px;color:#8a977f;margin-bottom:10px}.reading-heading h1{font-family:Georgia,serif;font-size:30px;font-weight:400;margin:0;letter-spacing:-.6px;line-height:1.3}.page-context{display:flex;gap:10px;font-size:11px;color:#7c8977;margin-bottom:5px;white-space:nowrap}
.mushaf-page{position:relative;background:var(--paper);padding:23px 28px 18px;box-shadow:0 2px 3px #33331d05,0 12px 32px #3d4a3011;border:1px solid #e4dfcc;border-radius:3px;min-height:880px}.mushaf-page:before{content:"";position:absolute;top:0;bottom:0;left:0;width:13px;background:linear-gradient(to right,#dcd6c130,#fffdf600);pointer-events:none}.page-topline{display:flex;justify-content:space-between;padding:0 9px 12px;gap:18px;font-family:"Amiri Quran",serif;font-size:16px;line-height:1.8;color:#7b805e}.page-frame{position:relative;padding:24px 26px 34px;border:1px solid #a9b189;outline:1px solid #d4c699;outline-offset:4px;min-height:778px;background:linear-gradient(to bottom,#f9f5e630,transparent 150px)}
.corner{position:absolute;width:27px;height:27px;border:1px solid #a5ad85;background:#fffdf6;z-index:1;transform:rotate(45deg);pointer-events:none}.corner:before{content:"";position:absolute;inset:4px;border:1px solid #c5b173}.corner:after{content:"";position:absolute;inset:8px;border:1px solid #a5ad85;background:#e5e4c7}.top-left{top:-14px;left:-14px}.top-right{top:-14px;right:-14px}.bottom-left{bottom:-14px;left:-14px}.bottom-right{bottom:-14px;right:-14px}.page-content{font-family:"Amiri Quran",serif;direction:rtl;color:#272b20}.surah-banner{display:flex;justify-content:space-between;align-items:center;gap:12px;border:1px solid #b1b894;margin:7px 0 21px;padding:7px 20px;background:linear-gradient(135deg,#edecd4,#f8f6e7 45%,#edecd4);position:relative;outline:1px solid #d0bd85;outline-offset:3px;min-height:57px}.surah-banner:before,.surah-banner:after{content:"";position:absolute;top:50%;height:16px;width:16px;border:1px solid #9eab7b;background:#f5f2df;transform:translateY(-50%) rotate(45deg)}.surah-banner:before{left:-9px}.surah-banner:after{right:-9px}.surah-banner h2{font-size:25px;line-height:1.6;font-weight:400;margin:0;white-space:normal;text-align:center;color:#435c3d}.banner-star{font-family:Georgia,serif;color:#b4a266;font-size:25px}.basmalah{font-size:29px;text-align:center;line-height:2;margin:10px 0 18px}.ayah-text{font-size:var(--arabic-size);font-weight:400;line-height:2.1;text-align:justify;text-align-last:center;margin:0;word-spacing:.7px;overflow-wrap:break-word}.ayah-marker{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;position:relative;height:27px;min-width:27px;font-family:Georgia,"Times New Roman",serif;font-size:15px;line-height:1;white-space:nowrap;margin:0 4px;color:#53673f;border:1px solid #9eaa79;border-radius:50%;background:#f6f3e5}.ayah-marker:before{content:"";position:absolute;inset:-4px;border:1px solid #b3ae80;border-radius:35%;transform:rotate(45deg);pointer-events:none}.surah-section+.surah-section{margin-top:27px}.page-number{margin:15px auto 0;width:50px;text-align:center;font-family:Georgia,serif;font-size:19px;color:#7e8c5b;line-height:1.6}.opening .page-frame{padding-top:48px;display:flex;align-items:center;justify-content:center;border-width:2px;background:linear-gradient(90deg,#e9edda22,transparent 25%,transparent 75%,#e9edda22)}.opening .page-content{width:100%}.opening .surah-banner{margin-bottom:38px;border-radius:45% 45% 4px 4px;padding:18px 20px;background:#e4e8cd80;min-height:100px;outline-offset:5px}.opening .surah-banner h2{font-size:31px;line-height:1.8}.opening .ayah-text{font-size:calc(var(--arabic-size) + 4px);line-height:2.45;text-align:center;text-wrap:pretty}.opening .basmalah{margin-bottom:24px;font-size:32px}.opening .page-content:after{content:"✧ · ✧ · ✧";display:block;color:#a1aa78;font:21px Georgia,serif;text-align:center;letter-spacing:8px;margin:36px 0 8px}.closing .page-frame{border-width:2px;background:linear-gradient(180deg,#e9edda33,transparent 80%)}.closing .surah-banner{margin-bottom:16px}.closing .basmalah{margin-bottom:12px;font-size:27px}.closing .ayah-text{font-size:calc(var(--arabic-size) - 2px);line-height:2}.closing .page-content:after{content:"✧";display:block;color:#a1aa78;text-align:center;margin-top:25px;font:28px Georgia,serif}.reading-footnote{display:flex;align-items:center;justify-content:center;gap:15px;font-size:9px;letter-spacing:.4px;color:#8c9480;margin:23px 0 0}.reading-footnote>span:first-child,.reading-footnote>span:last-child{color:#b8b386;font-size:15px}
.reader-navigation{position:fixed;left:272px;right:0;bottom:0;background:#f9f9f0f5;backdrop-filter:blur(14px);z-index:20;border-top:1px solid #d9ddcd}.page-progress{height:2px;background:#e0e4d7}.page-progress span{height:2px;display:block;background:#879b65;transition:width .2s}.navigation-inner{max-width:838px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:19px 34px 22px;gap:16px}.page-turn{display:flex;gap:12px;align-items:center;border:0;background:transparent;text-align:left;font-size:12px;padding:7px 0;min-width:115px}.page-turn:hover:not(:disabled){color:#6d834e}.page-turn svg{height:21px;width:21px;color:#71815e}.page-turn>div{display:grid;gap:6px}.page-turn span{font-size:9px;color:#8c9782}.previous{text-align:right;justify-content:end}.page-counter{display:flex;gap:8px;align-items:center;font-size:11px;color:#8b9383}.page-counter input{border:1px solid #d4dac6;background:#fffef7;border-radius:5px;color:#415c34;width:46px;text-align:center;font-size:12px;padding:8px 3px;font-variant-numeric:tabular-nums}.jump-form input::-webkit-inner-spin-button,.page-counter input::-webkit-inner-spin-button{appearance:none}.jump-form input,.page-counter input{appearance:textfield;-moz-appearance:textfield}.loading{height:600px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;font:12px "Noto Sans",Arial,sans-serif;color:#7c8d68;direction:ltr}.spinner{border:1px solid #d3dac3;border-top-color:#5f7750;border-radius:50%;width:26px;height:26px;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.load-error{text-align:center;font-size:13px;padding:20px}.load-error button{border:0;border-radius:5px;background:var(--green);color:white;padding:12px 20px}.page-unavailable{font:14px "Noto Sans",Arial,sans-serif;text-align:center;margin:100px 0}
@media(min-width:1450px){main{max-width:850px;padding-top:46px}.mushaf-page{min-height:945px}.page-frame{min-height:843px}}
@media(max-width:1199px){.sidebar{transform:translateX(-100%);visibility:hidden;transition:transform .2s,visibility .2s}.workspace{margin-left:0}.reader-navigation{left:0}.menu-toggle,.sidebar-close{display:block}.sidebar-close{margin-left:auto;font-size:25px}.topbar{height:70px;padding:0 30px}.topbar-left{gap:13px}.drawer-open{overflow:hidden}.drawer-open .sidebar{transform:translateX(0);visibility:visible}.drawer-shade{position:fixed;inset:0;background:#15281c55;border:0;z-index:29}.topbar-caption{font-size:10px}main{max-width:760px;padding-top:30px}.mushaf-page{min-height:840px}.page-frame{min-height:738px}}
@media(max-width:600px){.topbar{height:62px;padding:0 15px}.topbar-caption,.topbar-divider{display:none}.topbar-title{font-size:11px}.text-controls button{padding:5px 8px}.reading-heading{margin-bottom:21px;gap:12px}.reading-heading h1{font-size:24px}.eyebrow{font-size:8px;letter-spacing:1.7px}.page-context{font-size:10px;gap:7px}main{padding:26px 15px 119px}.mushaf-page{padding:16px 14px 13px;min-height:620px}.page-topline{font-size:14px;padding:0 2px 13px}.page-frame{padding:20px 14px 24px;min-height:535px}.corner{height:20px;width:20px}.top-left{top:-10px;left:-10px}.top-right{top:-10px;right:-10px}.bottom-left{bottom:-10px;left:-10px}.bottom-right{bottom:-10px;right:-10px}.corner:before{inset:3px}.corner:after{inset:6px}.ayah-text{font-size:calc(var(--arabic-size) - 4px);line-height:2.25}.ayah-marker{height:22px;min-width:22px;font-size:12px;margin:0 3px}.ayah-marker:before{inset:-3px}.surah-banner{padding:6px 12px;margin-bottom:20px;min-height:48px}.surah-banner h2{font-size:23px}.banner-star{font-size:21px}.basmalah{font-size:24px;margin:13px 0}.opening .page-frame{padding-top:30px;padding-bottom:28px}.opening .surah-banner{min-height:75px;padding:13px 14px;margin-bottom:27px}.opening .surah-banner h2{font-size:26px}.opening .ayah-text{font-size:var(--arabic-size);line-height:2.5}.opening .basmalah{font-size:27px}.closing .ayah-text{font-size:calc(var(--arabic-size) - 6px);line-height:2.2}.closing .basmalah{font-size:23px}.page-number{font-size:16px;margin-top:12px}.reading-footnote{font-size:8px;gap:8px;margin-top:20px}.navigation-inner{padding:13px 15px 15px;gap:8px}.page-turn{font-size:10px;min-width:85px;gap:5px}.page-turn span{font-size:8px}.page-counter{gap:5px;font-size:9px}.page-counter input{width:36px;font-size:11px}.page-turn svg{width:18px;height:18px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}.spinner{animation:none}}
.opening .page-frame{align-items:flex-start;padding-top:32px}.comparison-link{text-align:center;margin-top:14px;font-size:10px;color:#728466}.comparison-link a{text-decoration:none;border-bottom:1px solid #bfc6ad;padding-bottom:3px}.comparison-link a:hover{color:#173f37}
.topbar-tools{display:flex;align-items:center;gap:18px}.source-status{font-size:10px;color:#7e8a71}.source-status:before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:#98a878;margin-right:6px}@media(max-width:600px){.topbar-tools{gap:11px}.source-status{font-size:9px}}
.annotation-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin-bottom:10px;font-size:12px}.annotation-toolbar button,.annotation-toolbar select{border:1px solid #cbd1bc;border-radius:5px;background:#fffdf6;padding:10px;color:#173f37}.annotation-toolbar button[aria-pressed=true]{background:#173f37;color:white}.annotation-toolbar label{display:flex;gap:5px;align-items:center}.annotation-status{font-size:12px;line-height:1.5;color:#667653;margin:8px 0 18px;min-height:36px}#annotation-fit{width:100%;position:relative}.annotation-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.annotation-layer.drawing{pointer-events:auto;touch-action:none;cursor:crosshair;user-select:none;-webkit-user-select:none}.annotation-fixed{width:620px!important;min-height:778px!important;padding:24px 26px 34px!important;transform-origin:top left;display:block!important;flex-shrink:0}.annotation-fixed .ayah-text{font-size:var(--annotation-size)!important;line-height:2.1!important;text-align:justify;text-wrap:wrap!important}.annotation-fixed .surah-banner{padding:7px 20px!important;margin:7px 0 21px!important;min-height:57px!important;border-radius:0!important}.annotation-fixed .surah-banner h2{font-size:25px!important;line-height:1.6!important}.annotation-fixed .banner-star{font-size:25px!important}.annotation-fixed .basmalah{font-size:29px!important;line-height:2!important;margin:10px 0 18px!important}.annotation-fixed .ayah-marker{height:27px!important;min-width:27px!important;font-size:15px!important;margin:0 4px!important}.annotation-fixed .ayah-marker:before{inset:-4px!important}.opening .annotation-fixed{padding-top:32px!important}.opening .annotation-fixed .ayah-text{font-size:calc(var(--annotation-size) + 4px)!important;line-height:2.45!important;text-align:center}.closing .annotation-fixed .ayah-text{font-size:calc(var(--annotation-size) - 2px)!important;line-height:2!important}
/* Rounded Read / Annotate switch and animated tool card. */
.annotation-toolbar{display:block;margin-bottom:0;font-size:12px}.annotation-switch{display:inline-flex;align-items:center;gap:5px;padding:5px;border:1px solid #c3ccb7;border-radius:36px;background:#fffef9;box-shadow:0 3px 12px #173f3708}.annotation-toolbar .annotation-switch button{display:flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:10px 20px;border:0;border-radius:28px;background:transparent;font-size:14px;font-weight:600;transition:background .2s,color .2s,box-shadow .2s}.annotation-switch svg{width:23px;height:23px}.annotation-toolbar .annotation-switch button[aria-pressed=true]{background:#173f37;color:#fffdf6;box-shadow:0 2px 6px #173f3726}.annotation-switch .tool-chevron{width:15px;height:15px;transition:transform .25s}.tools-open .tool-chevron{transform:rotate(180deg)}.annotation-popout{display:grid;grid-template-rows:0fr;opacity:0;visibility:hidden;transform:translateY(-8px);transition:grid-template-rows .28s ease,opacity .2s ease,transform .28s ease,visibility .28s;max-width:590px}.tools-open .annotation-popout{grid-template-rows:1fr;opacity:1;visibility:visible;transform:translateY(0)}.annotation-panel-clip{overflow:hidden;padding:0 4px}.annotation-panel-card{margin:14px 0 8px;padding:18px;border:1px solid #d0d7c4;border-radius:20px;background:#fffef9;box-shadow:0 5px 12px #173f370c}.annotation-panel-heading{display:flex;justify-content:space-between;align-items:center;margin:0 2px 14px;gap:10px;font-size:9px;letter-spacing:1.6px;color:#657554}.annotation-panel-hint{font-size:11px;letter-spacing:0;color:#8a9380}.annotation-tool-row{display:grid;grid-template-columns:repeat(3,1fr) 1.3fr;gap:8px}.annotation-toolbar .annotation-tool-row button{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:7px;min-height:76px;border-radius:12px;background:#f5f5ec;border-color:transparent}.annotation-toolbar .annotation-tool-row button[aria-pressed=true]{background:#e5eee3;color:#173f37;border-color:#97ad89;box-shadow:inset 0 0 0 1px #97ad8933}.annotation-tool-row svg{width:25px;height:25px}.annotation-toolbar .annotation-colour-label{display:flex;flex-direction:column;justify-content:center;gap:3px;border:1px solid #e3e6d8;border-radius:12px;background:#fffef9;padding:6px}.annotation-toolbar .annotation-colour-label select{padding:3px 6px;max-width:100%;font-size:11px;background:transparent;border:0;color:#b83232}.annotation-action-row{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-top:14px}.annotation-toolbar .annotation-action-row button,.annotation-toolbar .annotation-backup-row button{display:flex;align-items:center;justify-content:center;gap:7px;border:0;background:transparent;min-height:44px;padding:9px;border-radius:9px;font-size:11px}.annotation-action-row svg,.annotation-backup-row svg{width:18px;height:18px}.annotation-toolbar .annotation-finger{margin-left:auto;gap:6px;font-size:11px;min-height:44px;padding:0 4px}.annotation-finger svg{width:18px;height:18px}.annotation-finger input{accent-color:#173f37;width:15px;height:15px}.annotation-backup-row{display:flex;align-items:center;gap:7px;border-top:1px solid #e3e6d8;margin-top:10px;padding-top:8px}.annotation-toolbar button:hover:not(:disabled){background:#eaf0e3}.annotation-status{margin-top:10px;font-size:11px;min-height:28px}.annotation-toolbar button:disabled{opacity:.4}@media(max-width:600px){.annotation-panel-card{padding:12px;border-radius:16px}.annotation-tool-row{gap:5px;grid-template-columns:repeat(3,1fr) 1.1fr}.annotation-toolbar .annotation-tool-row button{font-size:10px;padding:8px 3px;min-height:72px}.annotation-colour-label{font-size:10px}.annotation-panel-heading{letter-spacing:1px}.annotation-toolbar .annotation-switch button{padding:10px 16px;font-size:13px}.annotation-toolbar .annotation-finger{font-size:10px;gap:4px}.annotation-action-row{gap:3px}.annotation-toolbar .annotation-action-row button{padding:8px;font-size:10px}}@media(prefers-reduced-motion:reduce){.annotation-popout,.annotation-switch button,.tool-chevron{transition:none!important;transform:none!important}}
#annotation-fit.drawing-surface{touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.annotation-layer.drawing{pointer-events:all}.drawing-surface .page-content{user-select:none;-webkit-user-select:none}
.portrait-message{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px max(24px,env(safe-area-inset-right)) 24px max(24px,env(safe-area-inset-left));background:var(--background);color:var(--green)}.portrait-message>svg{width:46px;height:64px;color:var(--gold);margin-bottom:16px}.portrait-message h1{font-family:Georgia,serif;font-size:28px;margin:0 0 12px}.portrait-message p{font-size:15px;line-height:1.6;margin:0;max-width:360px}.portrait-message .portrait-note{font-size:12px;color:var(--muted);margin-top:10px}.portrait-blocked{overflow:hidden}.portrait-blocked>.workspace,.portrait-blocked>.sidebar,.portrait-blocked>.drawer-shade,.portrait-blocked>.skip-link{visibility:hidden}
@font-face{font-family:"IndoPak";src:url("assets/indopak.otf") format("opentype");font-weight:400;font-style:normal;font-display:swap}.page-content,.page-topline{font-family:var(--quran-font,"Amiri Quran",serif)}.font-choice{display:flex;flex-direction:column;gap:8px;margin:15px 4px 0;color:#a9bea9;font-size:9px;letter-spacing:1.7px}.font-choice select{font:12px "Noto Sans",Arial,sans-serif;letter-spacing:0;min-height:44px;width:100%;background:#244a3f;color:#f1ead9;border:1px solid #73907766;border-radius:6px;padding:8px}.font-choice select:disabled{opacity:.65}.font-choice select:focus-visible{outline:2px solid #ba9a59;outline-offset:3px}
.menu-toggle,.sidebar-close{min-width:44px;min-height:44px}
/* Full-page fit for the 12.9-inch iPad portrait viewport (1024 CSS px). */
.screen-fit,.screen-fit body{height:100%;overflow:hidden;overscroll-behavior:none}
.screen-fit .workspace{height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden}
.screen-fit .topbar{flex:none;height:64px}
.screen-fit main{width:100%;max-width:838px;flex:1;min-height:0;padding:16px 30px 10px;display:flex;flex-direction:column;overflow:hidden}
.screen-fit .reading-heading{flex:none;margin-bottom:12px}
.screen-fit .reading-heading h1{font-size:26px}
.screen-fit .eyebrow{margin-bottom:5px}
.screen-fit .annotation-toolbar{position:relative;flex:none;z-index:21}
.screen-fit .annotation-popout{position:absolute;top:100%;left:0;width:590px;max-width:100%;z-index:25}
.screen-fit .annotation-status{flex:none;margin:6px 0 10px;min-height:17px;line-height:1.4}
.screen-fit .mushaf-page{flex:1;min-height:0!important;padding:16px 28px 12px;display:flex;flex-direction:column;align-items:center;overflow:hidden}
.screen-fit .page-topline{width:100%;flex:none}
.screen-fit #annotation-fit{flex:none;margin:auto 0}
.screen-fit .page-number{flex:none;margin:15px auto 0}
.screen-fit .reading-footnote{flex:none;margin-top:8px}
.screen-fit .comparison-link{flex:none;margin-top:7px}
.screen-fit .reader-navigation{position:static;flex:none;padding-bottom:env(safe-area-inset-bottom)}
.screen-fit .navigation-inner{padding:12px 34px;min-height:68px}

.audio-controls{display:flex;position:relative;flex:none;align-items:center;border:1px solid #cbd1bc;border-radius:9px;background:#fffdf6}
.audio-controls>button{border:0;background:transparent;min-height:44px;min-width:44px;padding:6px 9px;color:var(--green);font-size:14px;border-radius:8px}
.audio-controls>button{position:relative}
.audio-controls>button:before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(36px,calc(100% - 4px));aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#fffefb 0%,#fffefb 38%,#f4f5ef 58%,#e5e9df 78%,#c6d0bf 100%);box-shadow:0 1px 6px #173f372b,inset 0 0 3px #173f371a;pointer-events:none}
.audio-controls>button svg{position:relative;z-index:1}
.audio-controls>button:hover:before,.audio-controls>button:focus-visible:before{box-shadow:0 1px 7px #173f3738,inset 0 0 4px #173f3722}
.audio-controls>button:active:before{box-shadow:inset 0 1px 5px #173f3726}
.audio-settings{position:absolute;top:calc(100% + 10px);left:0;width:280px;padding:16px;background:#fffdf6;border:1px solid #cbd1bc;border-radius:14px;box-shadow:0 8px 25px #173f3726;z-index:28;max-height:calc(100dvh - 85px);overflow:auto}
.audio-settings label{display:flex;flex-direction:column;gap:7px;font-size:12px;margin-bottom:14px}
.audio-memorise-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:14px}.audio-settings #audio-memorise-close{width:36px;min-height:36px;padding:0;font-size:24px;flex:none}#audio-memorise-toggle[aria-expanded=true]::before{box-shadow:0 0 0 2px currentColor,inset 0 0 3px #173f371a}#audio-memorise-toggle svg{width:25px;height:25px}
.audio-settings select,.audio-settings button{font:13px "Noto Sans",Arial,sans-serif;min-height:44px;border:1px solid #cbd1bc;background:#f2f1e9;color:var(--green);border-radius:8px;padding:8px;width:100%}
.audio-selected-line{position:relative;isolation:isolate;background:none}
.audio-selected-line::before{content:"";position:absolute;top:0;bottom:0;left:var(--selection-left);width:calc(var(--selection-right) - var(--selection-left));background:var(--selection-colour,#dce3eb);z-index:-1;pointer-events:none}
.madinah-line>.ayah.audio-selected,.madinah-line>.ayah-marker.audio-selected{background:transparent;box-shadow:none}
.madinah-line [data-ayah]{cursor:pointer;-webkit-tap-highlight-color:transparent}
.audio-settings p{font-size:12px;line-height:1.5;color:var(--green)}
.audio-settings .audio-speed-label{flex-direction:row;justify-content:space-between;align-items:center;margin-bottom:4px}.audio-speed-label output{font-variant-numeric:tabular-nums;color:var(--green);font-weight:600}
#audio-speed-slider{display:block;width:100%;min-height:44px;margin:0 0 8px;accent-color:var(--green);cursor:pointer}
.audio-speed-presets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-bottom:12px}
.audio-settings .audio-speed-presets button{padding:8px 2px;font-size:12px;font-variant-numeric:tabular-nums}
.audio-speed-presets button[aria-pressed=true]{background:var(--green);color:#fffdf6;border-color:var(--green)}
.audio-sleep-menu strong{display:block;margin-bottom:12px;font-size:14px}
.audio-sleep-presets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-bottom:10px}
.audio-sleep-menu button[aria-pressed=true]{background:var(--green);color:#fffdf6;border-color:var(--green)}
#audio-sleep-toggle.timer-active::after{content:"";position:absolute;right:5px;top:6px;width:6px;height:6px;background:currentColor;border-radius:50%;z-index:2}
.ayah.audio-current,.basmalah.audio-current{background:#dcead1;color:#173f37;border-radius:4px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.ayah-marker.audio-current{background:#dcead1;color:#173f37}
.madinah-line>.ayah.audio-current,.madinah-line>.ayah-marker.audio-current{background:transparent;border-radius:0;box-shadow:none}
.ayah.audio-word-current{background:#ede0f7;color:#35104c;border-radius:4px;outline:2px solid #9c27b0;outline-offset:1px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.madinah-line>.ayah.audio-word-current{background:#ede0f7;border-radius:4px}
/* Highlight changes colour only: saved ink and line geometry stay fixed. */
/* Compact top controls; the Quran reader has no bottom dock. */
html,body{height:100%;overflow:hidden}
.workspace{margin-left:0;height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden}
.sidebar{transform:translateX(-100%);visibility:hidden;transition:transform .2s,visibility .2s;z-index:30}
.drawer-open .sidebar{transform:translateX(0);visibility:visible}
.drawer-shade{position:fixed;inset:0;background:#15281c55;border:0;z-index:29}
.menu-toggle,.sidebar-close{display:block}.sidebar-close{margin-left:auto;font-size:25px}
.topbar,.screen-fit .topbar{height:64px;min-height:64px;flex:none;padding:0 16px;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;position:relative;z-index:25}
.topbar-left{gap:8px;min-width:0}.page-summary{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;border:1px solid #cbd1bc;border-radius:9px;padding:10px 12px;font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;background:#fffdf6}
.search-toggle{justify-self:end;min-width:44px;min-height:44px}.search-toggle svg{width:22px;height:22px}
.topbar .annotation-toolbar,.screen-fit .topbar .annotation-toolbar{position:static;margin:0;z-index:auto}
.topbar .annotation-switch{padding:3px;gap:2px;border-radius:12px;box-shadow:none;background:#fffdf6}
.topbar .annotation-switch button{min-height:40px;padding:7px 12px;gap:7px;font-size:12px;border-radius:9px}
.topbar .annotation-switch svg{width:19px;height:19px}.topbar .annotation-switch .tool-chevron{width:12px;height:12px}
.topbar .annotation-popout,.screen-fit .topbar .annotation-popout{position:absolute;top:100%;left:50%;width:590px;max-width:calc(100vw - 24px);transform:translate(-50%,-8px);z-index:26}
.topbar .tools-open .annotation-popout{transform:translate(-50%,0)}
.topbar .annotation-panel-card{margin:8px 0;padding:14px;background:#fffdf6;box-shadow:0 8px 25px #173f3726}
.topbar .annotation-panel-clip{max-height:calc(100dvh - 90px);overflow-y:auto;overscroll-behavior:contain}
main{flex:1;min-height:0;overflow-y:auto;overscroll-behavior-y:contain;padding-bottom:20px;-webkit-overflow-scrolling:touch}
.screen-fit main{max-width:838px;padding-bottom:10px}
.sidebar .navigation-inner{padding:12px 4px;gap:5px;flex-wrap:wrap;color:#f1ead9}.sidebar .page-turn{min-width:100px;color:#f1ead9}.sidebar .page-turn span{color:#a9bea9}.sidebar .page-counter{order:3;width:100%;justify-content:center}.sidebar .source-status{display:block;margin:8px 4px;color:#a9bea9}.sidebar .refresh-button{margin:4px;width:calc(100% - 8px)}
@media(max-width:600px){.topbar,.screen-fit .topbar{padding:0 8px;gap:4px;height:60px;min-height:60px}.topbar-left{gap:2px}.page-summary{font-size:10px;padding:9px 7px}.topbar .annotation-switch button{padding:7px 9px;min-width:40px}.topbar .annotation-switch button>span,.topbar .tool-chevron{display:none}.topbar .annotation-switch{gap:0}.topbar .annotation-panel-card{padding:12px}.reading-heading{margin-bottom:12px}main{padding-top:16px}}
@media(max-width:600px){.audio-controls>button{padding:4px;min-width:36px}.audio-settings{position:fixed;top:68px;left:12px;width:280px;max-width:calc(100vw - 24px)}.page-summary{max-width:70px;overflow:hidden;text-overflow:ellipsis}.topbar-left{gap:3px}}
/* Reading-only devices: centred page badge with menu/search at the edges. */
.reading-only-device .topbar{display:flex;justify-content:space-between}
.reading-only-device .page-summary{position:absolute;left:50%;transform:translateX(-50%)}
@media(max-width:350px){.page-summary{max-width:40px;padding:9px 3px;font-size:9px}.topbar-left{gap:2px}}
.reading-only-device .topbar-left{display:flex}.reading-only-device .page-summary{justify-self:auto}

/* SVG icons keep a consistent shape across operating systems. */
.audio-controls>button,.audio-settings button{display:inline-flex;align-items:center;justify-content:center}
.audio-controls svg{width:18px;height:18px;flex:none}
.audio-settings button svg{width:16px;height:16px;margin-right:7px;flex:none}
.sidebar-intro svg,.quick-links svg,.reading-footnote svg,.sidebar-footer a svg,.comparison-link a svg{width:14px;height:14px;vertical-align:middle}
.banner-star svg{width:1em;height:1em;vertical-align:middle}
.reader-page-arrows{flex:none;display:flex;justify-content:space-between;align-items:center;width:100%;max-width:838px;margin:0 auto;padding:4px 30px max(8px,env(safe-area-inset-bottom));height:60px}
.reader-arrow{position:relative;display:flex;align-items:center;justify-content:center;width:44px;height:44px;background:transparent;border:1px solid #cbd1bc;border-radius:50%;color:var(--green)}
.reader-arrow:hover:not(:disabled){background:#eaf0e3}.reader-arrow svg{width:22px;height:22px}
.arrow-tooltip{position:absolute;bottom:calc(100% + 7px);white-space:nowrap;background:#173f37;color:#fffdf6;padding:6px 9px;border-radius:6px;font-size:11px;opacity:0;visibility:hidden;pointer-events:none}
.reader-arrow:hover .arrow-tooltip,.reader-arrow:focus-visible .arrow-tooltip{opacity:1;visibility:visible}
.aya-search-target{background:#eee5cf;box-decoration-break:clone;-webkit-box-decoration-break:clone}
@media(max-width:600px){.reader-page-arrows{padding-left:20px;padding-right:20px}}
/* PC-only reflow: use the reading area's width rather than a shrunken column. */
.desktop-reader-fit.screen-fit main{max-width:1200px}
.desktop-reader-fit .reader-page-arrows{max-width:1200px}
.desktop-reader-fit .annotation-fixed.desktop-fluid-frame{width:100%!important;min-height:0!important}
/* PC drawer: keep sections intact and scroll instead of squeezing them away. */
.desktop-reader-fit .sidebar{width:300px;max-width:100vw;padding:20px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.desktop-reader-fit .sidebar>*{flex-shrink:0}
.desktop-reader-fit .brand{min-height:54px}
.desktop-reader-fit .brand img,.desktop-reader-fit .sidebar-close{flex:none}
.desktop-reader-fit .brand>div{min-width:0}
.desktop-reader-fit .brand-name{font-size:23px;white-space:nowrap}
.desktop-reader-fit .sidebar-intro{margin:16px 4px}
.desktop-reader-fit .quick-links button{padding-top:10px;padding-bottom:10px}
.desktop-reader-fit .jump-form{margin:16px 4px}
.desktop-reader-fit .surah-list{flex:none;height:clamp(160px,30dvh,320px);min-height:160px}
.sidebar .refresh-button{color:#000000}
.desktop-reader-fit.screen-fit main{overflow-y:auto}
.desktop-reader-fit.screen-fit .mushaf-page{flex:0 0 auto;overflow:visible}

/* A minimal settings drawer, separate from Quran search. */
.phone-device .reader-page-arrows,.tablet-device .reader-page-arrows{display:none}
#mushaf-page{touch-action:pan-y}
.sidebar{padding:24px 22px;display:flex;flex-direction:column;overflow-y:auto}
#settings-panel{display:flex;flex-direction:column;flex:1;min-height:160px}
#settings-panel .annotation-backup-row{margin-top:auto}
#settings-panel .font-choice{padding-bottom:16px;border-bottom:1px solid #73907766}
.drawer-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px;width:100%;min-height:44px;padding:0 0 16px;text-align:left;flex:none;border-radius:0;border-bottom:1px solid #73907766;cursor:pointer}
.drawer-heading #drawer-title{margin:0;font-size:20px;font-weight:500;color:#f1ead9}
.drawer-heading .sidebar-close{margin:0}.sidebar .font-choice{margin:0;letter-spacing:1.2px}
#search-panel{display:flex;flex-direction:column;flex:1;min-height:0}
#search-panel .jump-form{margin-top:0}#search-panel .surah-list{flex:1;min-height:120px;overflow-y:auto}
#search-panel .index-title{margin-top:24px}
main,.screen-fit main{padding-top:20px}
.page-summary{font-size:12px;max-width:none;overflow:visible;padding:10px 12px}
.reading-only-device .page-summary{max-width:none;overflow:visible}
@media(max-width:600px){.page-summary{font-size:10px;padding:9px 7px}.reading-only-device .page-summary{max-width:none}.audio-controls>button{min-width:30px}.topbar .annotation-switch button{min-width:34px;padding:7px}.topbar-left{gap:2px}main{padding-top:14px}}
@media(max-width:350px){.page-summary{font-size:9px;padding:9px 4px}.audio-controls>button{min-width:26px}.search-toggle{min-width:34px}}

/* Hide the page frame while retaining its measured spacing for page fitting. */
.madinah-preview .mushaf-page,.madinah-preview .page-frame{border-color:transparent;outline:none}
.madinah-preview .page-frame>.corner{display:none}
.madinah-preview .annotation-layer>rect{stroke:none}

/* Source-defined lines never wrap; scale the whole page on narrow screens. */
.layout-note{font-size:12px;line-height:1.6;color:#d6dece;margin:16px 0}
.madinah-preview .annotation-fixed{min-height:0!important}
.madinah-preview .page-content:after{display:none}
.madinah-line{display:flex;direction:rtl;align-items:center;justify-content:space-between;flex-wrap:nowrap;white-space:nowrap;font-family:var(--quran-font);font-size:var(--madinah-size,30px);line-height:2.1;min-height:63px;gap:2px}
.madinah-line>.ayah{flex:0 0 auto;white-space:nowrap}
.madinah-line[data-line-type="surah"],.madinah-line[data-line-type="basmalah"]{justify-content:center}
.madinah-line .surah-banner{width:100%;min-height:50px!important;margin:0!important;padding:0 16px!important}
.surah-banner-number{position:absolute;left:25%;top:50%;transform:translate(-50%,-50%);text-align:center;direction:ltr;font-family:"Noto Sans",Arial,sans-serif;font-size:22px;font-weight:700;line-height:1;color:#435c3d;font-variant-numeric:tabular-nums}
.surah-banner-number:first-child{left:75%}
.surah-banner h2{flex:0 1 40%;min-width:0;margin-inline:auto}
.madinah-line .basmalah{margin:0!important;font-size:29px!important}
.madinah-line .ayah-marker{flex:0 0 auto;margin:0 3px!important;height:23px!important;min-width:23px!important;font-size:13px!important}
.madinah-line{padding-inline:8px;box-sizing:border-box}
.madinah-preview main{width:100%;min-width:0}.madinah-preview .mushaf-page{width:100%;min-width:0}
/* Reference-style Quran navigation popup, shared by iPad and PC. */
.search-popup.drawer-open .sidebar{inset:50% auto auto 50%;transform:translate(-50%,-50%);width:min(590px,calc(100vw - 32px));max-height:calc(100dvh - 40px);border:1px solid #799483;border-radius:20px;padding:22px;box-shadow:0 20px 80px #102c2855;overflow-y:auto;transition:none}
.search-popup .drawer-heading{margin-bottom:18px}.search-popup #search-panel{flex:none;min-height:0}
.search-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:4px;border:1px solid #829b8566;border-radius:12px;background:#102c2840;margin-bottom:22px}
.search-tabs button{border:0;background:transparent;color:#d6e1d3;border-radius:8px;padding:11px;font-size:15px;min-height:44px}
.search-tabs button[aria-selected="true"]{background:#f1ead9;color:var(--green);box-shadow:0 2px 5px #0002}
.picker-fields,.picker-wheels{display:grid;grid-template-columns:minmax(0,1fr) 64px 72px 64px;gap:4px}
.picker-fields label{display:grid;gap:6px;text-align:center;font-size:12px;color:#d2dfcf}
.picker-fields input{width:100%;min-width:0;border:1px solid #829b8588;border-radius:6px;background:#ffffff0a;color:#f1ead9;text-align:center;min-height:42px;font-size:16px;appearance:textfield;-moz-appearance:textfield}
.picker-fields input::-webkit-inner-spin-button{appearance:none}
.picker-wheels{--wheel-height:clamp(132px,calc(100dvh - 330px),528px);position:relative;margin-top:12px;border-block:1px solid #829b8555}
.picker-wheels:before{content:"";position:absolute;inset:calc((var(--wheel-height) - 44px)/2) 0 auto;height:44px;background:#ffffff12;border-radius:8px;pointer-events:none}
.picker-wheel{height:var(--wheel-height);overflow-y:auto;position:relative;padding-block:calc((var(--wheel-height) - 44px)/2);scroll-snap-type:y mandatory;scrollbar-width:none;overscroll-behavior:contain;mask-image:linear-gradient(transparent,#000 12%,#000 88%,transparent);-webkit-mask-image:linear-gradient(transparent,#000 12%,#000 88%,transparent)}
.picker-wheel::-webkit-scrollbar{display:none}
.picker-wheel button{display:block;height:44px;min-height:44px;width:100%;border:0;background:transparent;color:#b4c8b6;font-size:16px;line-height:44px;padding:0 3px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;scroll-snap-align:center}
.picker-wheel button[aria-selected="true"]{color:#fff8e8;font-weight:600}
.picker-wheel button span{display:block;transform:scale(var(--wheel-scale,.48));transform-origin:center;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.picker-wheel button .search-surah-name{display:flex;justify-content:center;align-items:center;gap:5px}
.search-surah-name bdi{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.search-surah-name bdi[lang=ar]{flex-shrink:0;max-width:55%;font-family:"Noto Sans",Tahoma,Arial,sans-serif}
.picker-wheel:focus-visible{outline:2px solid #d5b774;outline-offset:-2px;border-radius:8px}
.picker-destination{text-align:center;font-size:12px;line-height:1.5;color:#d4dfcd;margin:18px 0}
.picker-go{display:block;min-height:44px;width:50%;margin:0 auto;border:1px solid #d5b774;border-radius:8px;background:#f1ead9;color:var(--green);font-size:16px;font-weight:600}
.picker-go:disabled{opacity:.5}
.search-popup #search-surah .surah-list,.search-popup #juz-list{height:300px;max-height:40dvh;min-height:100px;flex:none}
.search-popup .surah-search input{font-size:16px}.search-popup #search-panel .index-title{margin-top:0}
@media(max-width:600px){.search-popup.drawer-open .sidebar{padding:18px 12px}.picker-fields,.picker-wheels{grid-template-columns:minmax(0,1fr) 44px 54px 44px;gap:2px}.picker-wheel button{font-size:13px}}
@media(max-height:560px){.search-popup.drawer-open .sidebar{inset:16px auto auto 50%;transform:translateX(-50%);max-height:calc(100dvh - 32px)}}

/* Centre the current location; page and surah carry the visual emphasis. */
.madinah-preview .topbar,.madinah-preview.screen-fit .topbar{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
.madinah-preview .topbar-left{grid-column:1;grid-row:1;justify-self:start}
.page-summary{min-height:44px}.page-summary:hover{background:#edf0e6}.page-summary[aria-expanded="true"]{background:#edf0e6;border-color:var(--green)}
.madinah-preview .page-summary{grid-column:2;grid-row:1;position:static;transform:none;justify-self:center;gap:8px;max-width:none;padding:6px 14px;line-height:1.1;color:var(--green)}
.summary-page,.summary-surahs{font-size:28px;font-weight:700}
.summary-juz{font-size:12px;font-weight:600;flex:none}
.summary-separator{font-size:12px;font-weight:400;color:#89957f;flex:none}
@media(max-width:600px){
  .madinah-preview .topbar,.madinah-preview.screen-fit .topbar{grid-template-columns:auto minmax(0,1fr) auto;gap:6px}
  .madinah-preview .page-summary{gap:4px;padding:6px 8px;max-width:100%;min-width:0}
  .summary-page,.summary-surahs{font-size:24px}
  .summary-juz{font-size:10px}
  .madinah-preview .summary-multiple-surahs{display:grid;grid-template-columns:auto auto;gap:2px 8px;padding:3px 8px}
  .summary-multiple-surahs .summary-page{grid-column:1;grid-row:1}
  .summary-multiple-surahs .summary-juz{grid-column:2;grid-row:1;justify-self:end}
  .summary-multiple-surahs .summary-separator{display:none}
  .summary-multiple-surahs .summary-surahs{grid-column:1 / -1;grid-row:2;font-size:18px;white-space:nowrap;text-align:center;min-width:0}
}
@media(max-width:350px){
  .madinah-preview .page-summary{gap:3px;padding:6px 4px}
  .summary-page,.summary-surahs{font-size:20px}
  .summary-juz{font-size:9px}
  .summary-multiple-surahs .summary-surahs{font-size:14px}
  .madinah-preview .summary-multiple-surahs{padding:3px 4px}
}

/* Search follows the reader's paper surfaces and restrained green accents. */
.search-popup.drawer-open .sidebar{background:var(--paper);color:var(--ink);border-color:#cbd1bc;border-radius:16px;box-shadow:0 12px 40px #173f3726}
.search-popup .drawer-heading #drawer-title{color:var(--green);font-size:18px}
.search-popup .sidebar-close{color:var(--green);border-radius:8px}
.search-popup .sidebar-close:hover{background:#edf0e6}
.search-popup .search-tabs{background:#eeefe7;border-color:#d5dacb;border-radius:10px}
.search-popup .search-tabs button{color:#53665b}
.search-popup .search-tabs button[aria-selected="true"]{background:var(--paper);color:var(--green);box-shadow:0 1px 4px #173f371a}
.search-popup .picker-fields label{color:#596a5f}
.search-popup .picker-fields input{background:#fffefb;color:var(--ink);border-color:#cbd1bc;border-radius:8px}
.search-popup .picker-fields input:focus-visible{outline-color:var(--green)}
.search-popup .picker-wheels{border-color:#d9decf}
.search-popup .picker-wheels:before{background:#e9eee2;border:1px solid #d5ddcb}
.search-popup .picker-wheel button{color:#68796b}
.search-popup .picker-wheel button[aria-selected="true"]{color:var(--green)}
.search-popup .picker-wheel:focus-visible{outline-color:var(--green)}
.search-popup .picker-destination{color:#647362}
.search-popup .picker-go{background:var(--green);color:var(--paper);border-color:var(--green);border-radius:9px;font-size:15px}
.search-popup .picker-go:hover{background:var(--green-light)}
.search-popup .index-title h2{color:var(--green)}
.search-popup .index-title>span{color:#647362;border-color:#cbd1bc}
.search-popup .surah-search{color:#647362;border-color:#d5dacb}
.search-popup .surah-search input{color:var(--ink)}
.search-popup .surah-search input::placeholder{color:#647362}
.search-popup .surah-link{color:var(--ink)}
.search-popup .surah-link:hover{background:#edf0e6}
.search-popup .surah-link.selected{background:#e9eee2;color:var(--green);box-shadow:inset 2px 0 var(--gold)}
.search-popup .surah-index-number,.search-popup .surah-start-page,.search-popup .surah-link-name small,.search-popup .index-loading,.search-popup .no-results{color:#647362}
.search-popup .surah-list{scrollbar-color:#bac6b1 transparent}

/* Recite occupies the top-right toolbar cell, clear of the Quran text. */
.recitation-dock{grid-column:3;grid-row:1;justify-self:end;display:flex;align-items:center;justify-content:flex-end;pointer-events:none}
.recitation-button{pointer-events:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:52px;height:52px;flex:none;border:2px solid #6ce0aa;border-radius:50%;background:radial-gradient(circle at 50% 40%,#b5df64 0%,#66db8d 58%,#36c998 100%);color:#fff;box-shadow:0 0 18px #47d8a56b,0 4px 14px #173f3726;font-size:11px;font-weight:700}
.recitation-button svg{width:24px;height:24px;stroke-width:2.5}
.recitation-button:disabled{opacity:1;cursor:default}
.recitation-notice{position:absolute;top:calc(100% + 8px);right:12px;width:260px;max-width:calc(100vw - 24px);padding:10px 13px;border:1px solid #cbd1bc;border-radius:10px;background:var(--paper);color:var(--green);box-shadow:0 4px 16px #173f3726;font-size:12px;line-height:1.5;pointer-events:none}
.recitation-notice:empty{display:none}
@media(max-width:600px){.recitation-button{width:48px;height:48px;font-size:10px}.recitation-button svg{width:22px;height:22px}}

/* A continuous white reading surface, including the surrounding edges. */
.madinah-preview .workspace,.madinah-preview main,.madinah-preview .topbar,.madinah-preview .mushaf-page,.madinah-preview .page-frame{background:#fff}
.madinah-preview .mushaf-page{box-shadow:none}
.madinah-preview .mushaf-page:before{display:none}

/* Ink covers the viewport below the toolbar, retaining page-relative geometry. */
.madinah-preview .annotation-layer.annotation-expanded{position:fixed;left:0;right:0;bottom:0;width:100%;height:auto;z-index:22;overflow:hidden}
.annotation-expanded-active main,.annotation-expanded-active.screen-fit main{overflow:hidden}
.annotation-expanded-active .reader-page-arrows{visibility:hidden}
.madinah-preview .topbar{z-index:26}
.portrait-blocked .annotation-expanded{display:none}

/* All ink controls share one fixed toolbar surface; no expanding panel. */
.madinah-preview .topbar .annotation-switch{display:flex;gap:2px;padding:3px;background:#fffdf6;border-radius:12px;white-space:nowrap}
.madinah-preview .topbar .annotation-switch button{width:40px;min-width:40px;min-height:40px;padding:7px;gap:4px}
.madinah-preview .topbar .annotation-switch #annotation-erase[aria-pressed=true]{background:#facc15;color:#173f37;box-shadow:0 2px 6px #173f3726}
.madinah-preview .topbar .annotation-switch #annotation-undo,.madinah-preview .topbar .annotation-switch #annotation-redo{width:66px;min-width:66px;font-size:11px}
.madinah-preview .topbar .annotation-switch button>span{display:inline}
.madinah-preview .topbar .annotation-colour-label{position:relative;display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:7px;border:0;background:transparent;border-radius:9px;color:#ff5722;flex:none}
.madinah-preview .topbar .annotation-colour-label select{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.madinah-preview .topbar .annotation-colour-label:focus-within{outline:2px solid #173f37;outline-offset:1px}
.madinah-preview .topbar .annotation-colour-label:has(select:disabled){opacity:.4}
.sidebar .annotation-backup-row{flex-wrap:wrap}.sidebar .annotation-backup-row button{display:flex;align-items:center;gap:6px;background:transparent;border:1px solid #8b9d86;border-radius:9px;padding:10px;color:inherit;font-size:12px}

@media(max-width:480px){
  .madinah-preview .topbar .annotation-switch{gap:1px}
  .madinah-preview .topbar .annotation-switch button{width:38px;min-width:38px;padding:6px}
  .madinah-preview .topbar .annotation-colour-label{width:38px;padding:6px}
  .madinah-preview .topbar .annotation-switch #annotation-undo,.madinah-preview .topbar .annotation-switch #annotation-redo{width:55px;min-width:55px;gap:2px}
  .madinah-preview .topbar .annotation-switch #annotation-undo svg,.madinah-preview .topbar .annotation-switch #annotation-redo svg{width:15px;height:15px}
}
@media(max-width:360px){
  .madinah-preview .topbar .annotation-switch button{width:32px;min-width:32px;padding:4px}
  .madinah-preview .topbar .annotation-colour-label{width:32px;padding:4px}
  .madinah-preview .topbar .annotation-switch #annotation-undo,.madinah-preview .topbar .annotation-switch #annotation-redo{width:48px;min-width:48px;font-size:10px}
}


/* The top bar remains stationary; its contacts cannot pan or pinch the page. */
.topbar .menu-toggle{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:4px;flex:none}
.topbar .menu-toggle span{font-size:10px;line-height:1.2;font-weight:600}
.madinah-preview .topbar{position:sticky;top:0;flex-shrink:0;touch-action:none;overscroll-behavior:none}
.madinah-preview .topbar button,.madinah-preview .topbar select,.madinah-preview .topbar input{touch-action:none}


/* The Quran stays fitted; scrolling is confined to navigation/settings popups. */
html.madinah-preview,html:has(body.madinah-preview),body.madinah-preview,.madinah-preview .workspace{overscroll-behavior:none;overflow:hidden;overflow:clip}
.madinah-preview main,.madinah-preview.screen-fit main,.madinah-preview .annotation-expanded{overflow:hidden;overflow:clip;touch-action:none;overscroll-behavior:none}
.madinah-preview.screen-fit .mushaf-page{flex:1;min-height:0!important;touch-action:none}


/* Override the earlier desktop scrolling rules on the actual body/root split. */
body.madinah-preview #reader{overflow:hidden;overflow:clip;touch-action:none;overscroll-behavior:none}
html.screen-fit body.madinah-preview #mushaf-page{flex:1;min-height:0!important;touch-action:none}


/* Equal flexible sides center Search until the right controls need more room. */
.madinah-preview .topbar,.madinah-preview.screen-fit .topbar{height:64px;min-height:64px;grid-template-rows:64px;grid-template-columns:minmax(max-content,1fr) auto minmax(max-content,1fr);column-gap:8px;row-gap:0}
.madinah-preview .topbar-right{grid-column:3;grid-row:1;display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:0;flex-wrap:nowrap}
.madinah-preview .topbar .annotation-toolbar{margin:0;min-width:0;flex:0 0 auto}
.madinah-preview .topbar .annotation-switch{flex-wrap:nowrap;width:max-content}
.madinah-preview .topbar .annotation-switch button{flex-shrink:0}
.madinah-preview .topbar .recitation-dock{flex:none}
/* Narrow phones scroll the tools within the same row, retaining touch targets. */
@media(max-width:850px){
 .madinah-preview .topbar,.madinah-preview.screen-fit .topbar{grid-template-columns:max-content max-content minmax(0,1fr);column-gap:4px;padding:0 8px}
 .madinah-preview .topbar-right{gap:4px}
 .madinah-preview .topbar .annotation-toolbar{flex:0 1 auto;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;touch-action:pan-x;overscroll-behavior-x:contain}
 .madinah-preview .topbar .annotation-toolbar::-webkit-scrollbar{display:none}
 .madinah-preview .topbar .annotation-switch{touch-action:pan-x}
 .madinah-preview .topbar .annotation-switch button,.madinah-preview .topbar .annotation-switch select{touch-action:pan-x}
 .madinah-preview .page-summary{gap:3px;padding:6px 5px}
 .madinah-preview .summary-page,.madinah-preview .summary-surahs{font-size:20px}
}/* Equal gaps between edge controls, Search and the annotation tools. */
.madinah-preview .topbar,.madinah-preview.screen-fit .topbar{display:flex;align-items:center;justify-content:space-between}
.madinah-preview .topbar-right{display:contents}
.madinah-preview .topbar-left,.madinah-preview .topbar .page-summary{flex:none}
.madinah-preview .topbar .annotation-toolbar{flex:0 1 auto;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;touch-action:pan-x;overscroll-behavior-x:contain}
.madinah-preview .topbar .annotation-toolbar::-webkit-scrollbar{display:none}
.madinah-preview .topbar .annotation-switch,.madinah-preview .topbar .annotation-switch button,.madinah-preview .topbar .annotation-switch select{touch-action:pan-x}
.madinah-preview .page-summary{width:max-content;max-width:none}
.recite-panel{position:fixed;right:12px;top:80px;z-index:1000;width:370px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 150px);overflow:auto;overscroll-behavior:contain;touch-action:pan-y;background:var(--paper,#fffef8);color:var(--green,#203d33);border:1px solid #cbd1bc;border-radius:16px;padding:16px;box-shadow:0 8px 28px #173f3733;font-size:13px;line-height:1.5}.recite-panel[hidden]{display:none}.recite-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.recite-panel-heading h2{font-size:18px;margin:0}.recite-panel button{min-height:44px;border:1px solid #c5d0bb;border-radius:10px;background:#fffef8;color:#203d33;padding:8px 12px;font:inherit;cursor:pointer}.recite-panel-heading button{width:44px;flex:none;font-size:24px}.recite-panel label{display:block;font-size:12px;margin:8px 0 4px}.recite-panel select,.recite-panel input[type=number]{width:100%;min-height:44px;padding:8px;border:1px solid #bac7ad;border-radius:8px;background:white;color:#203d33;font:inherit;touch-action:manipulation}.recite-range-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.recite-panel #recite-bounds{font-size:11px;color:#647563;margin:6px 0}.recite-controls{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.recite-controls #recite-start{background:#286047;color:white}.recite-controls #recite-stop{color:#8c3535}.recite-panel button:disabled,.recite-file:has(input:disabled){opacity:.45;cursor:default}.recite-file{position:relative;display:flex!important;align-items:center;min-height:44px;border:1px solid #c5d0bb;border-radius:10px;padding:8px 12px;margin:0!important;overflow:hidden}.recite-file input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}.recite-panel #recite-status.error{color:#953d32}.recite-level{height:5px;background:#dfe5d5;border-radius:8px;overflow:hidden;margin:8px 0 16px}.recite-level>div{height:100%;width:0;background:#47aa73}.recite-feedback{border-top:1px solid #d8ddcc;padding-top:12px}.recite-feedback h3{margin:0;font-size:15px}.recite-feedback ul{padding:0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:6px;max-height:200px;overflow:auto}.recite-feedback li{background:#eef0e8;padding:8px;border-radius:8px;font-size:11px;overflow-wrap:anywhere}.recite-feedback li.matched{background:#e0efdf;color:#285339}.recite-feedback li.uncertain{background:#fff0d5;color:#7b521c}.recite-panel pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:11px;max-height:160px;overflow:auto}.recite-panel details{margin-top:12px}.recite-privacy,.recite-licences{font-size:10px;color:#647563}.recite-licences a{color:inherit}.recitation-button[aria-pressed=true]{background:#8c3535;color:white}.recite-match{background:#bfe6c6!important;border-radius:3px}.recitation-button{-webkit-touch-callout:none;touch-action:none}
/* In-app digits-only entry: numeric fields never invoke the OS keyboard. */
/* Actual ink swatches with labels, outside the scrolling toolbar. */
.madinah-preview .topbar .annotation-colour-label [hidden]{display:none!important}

/* Clockwise labels occupy a narrow column beside each history icon. */
.madinah-preview .topbar .annotation-switch #annotation-undo,.madinah-preview .topbar .annotation-switch #annotation-redo{position:relative;width:44px;min-width:44px;padding:0;font-size:11px}
.madinah-preview .topbar .annotation-switch #annotation-undo svg,.madinah-preview .topbar .annotation-switch #annotation-redo svg{position:absolute;left:4px;top:50%;width:18px;height:18px;transform:translateY(-50%)}
.madinah-preview .topbar .annotation-switch #annotation-undo>span,.madinah-preview .topbar .annotation-switch #annotation-redo>span{position:absolute;left:26px;top:50%;display:block;white-space:nowrap;font-size:6.6px;line-height:7.2px;transform:translate(-50%,-50%) rotate(90deg)}
.madinah-preview .topbar .annotation-colour-label{display:none}
#annotation-pen svg{fill:var(--pen-colour,#ff5722);stroke:currentColor;stroke-width:1.5}
.madinah-preview .topbar .annotation-switch :is(#annotation-pen,#annotation-highlight){transition:none}
.madinah-preview .topbar .annotation-switch :is(#annotation-pen,#annotation-highlight)[aria-pressed=true]{background:transparent;color:#173f37;border-radius:9px;box-shadow:inset 0 0 0 1.5px #8a9d87,0 1px 6px #173f372b,inset 0 0 5px #173f371a}
#annotation-highlight .highlighter-handle,#annotation-highlight .highlighter-tip{fill:var(--highlighter-colour,#ffeb3b)}
.ink-swatch{display:inline-block;flex:none;width:28px;height:28px;border-radius:50%;box-shadow:inset 0 0 0 1px #00000014}
.ink-colour-menu{position:fixed;z-index:1100;direction:ltr;width:176px;max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px);overflow:auto;overscroll-behavior:contain;touch-action:pan-y;padding:8px;border:1px solid #cbd1bc;border-radius:14px;background:#fffef9;box-shadow:0 8px 28px #173f3733;color:#173f37}
.ink-colour-menu[hidden]{display:none}
.ink-colour-menu button{display:flex;align-items:center;gap:14px;width:100%;min-height:48px;padding:8px 12px;border:0;border-radius:9px;background:transparent;color:inherit;font:inherit;font-size:14px;text-align:left;cursor:pointer}
.ink-colour-menu button:hover,.ink-colour-menu button:focus-visible{background:#edf2e8;outline:2px solid #173f37;outline-offset:-2px}
.ink-colour-menu button[aria-checked=true]{background:#edf2e8;font-weight:600}
.ink-colour-menu button[aria-checked=true] .ink-swatch{outline:3px solid #173f37;outline-offset:3px}
.picker-fields input[readonly]{cursor:pointer}
.number-keypad{width:320px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto;padding:18px;border:1px solid #cbd1bc;border-radius:18px;background:var(--paper);color:var(--green);box-shadow:0 16px 60px #173f3740}
.number-keypad::backdrop{background:#132d2766}
.keypad-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.keypad-heading h2{margin:0;font-size:20px}.keypad-heading button{width:44px;height:44px;border:0;border-radius:8px;background:transparent;font-size:28px}
#keypad-value{display:block;margin:12px 0 4px;padding:10px;border:1px solid #cbd1bc;border-radius:10px;background:#fff;font-size:32px;text-align:center;font-variant-numeric:tabular-nums;min-height:65px}
#keypad-range,#keypad-error{text-align:center;font-size:13px;margin:8px 0 12px}#keypad-error{color:#9a2424}
.keypad-digits{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.keypad-digits button{min-height:52px;border:1px solid #cbd1bc;border-radius:10px;background:#fff;font-size:24px}.keypad-digits button[data-keypad=clear]{font-size:15px}
.keypad-digits button:active{background:#e9eee2}#keypad-done{width:100%;min-height:48px;margin-top:12px;border:0;border-radius:10px;background:var(--green);color:white;font-size:17px;font-weight:600}
@media(max-height:520px){.number-keypad{padding:12px}.keypad-digits button{min-height:44px}#keypad-value{min-height:44px;padding:4px;margin-top:4px}#keypad-range{margin:5px 0}.keypad-heading button{height:36px}}

.recite-pick-bar{position:fixed;top:72px;left:12px;right:12px;z-index:50;display:flex;align-items:center;gap:8px;padding:10px;background:#f1f7ed;border:1px solid #65825b;border-radius:12px;box-shadow:0 2px 8px #0002;font-size:14px}.recite-pick-bar[hidden]{display:none}.recite-pick-bar span{flex:1;min-width:0}.recite-pick-bar button{flex-shrink:0;min-height:44px}.recite-picked{background:#dcebd2!important;border-radius:3px}

.recite-feedback[hidden],#recite-selection[hidden]{display:none}.recite-session-bar{background:#eef6e8;left:auto;right:12px;width:calc(100vw - 24px);max-width:520px}.recite-session-bar button{background:#214f3f;color:white;border:0;border-radius:8px;padding:0 18px}body:has(#revision-rail) .recite-session-bar{width:calc(100vw - 104px)}
/* Compact revision rail, outside the Quran's pointer/navigation surface. */
.revision-rail{position:fixed;top:calc(50% + 32px);transform:translateY(-50%);left:10px;width:70px;z-index:60;display:flex;flex-direction:column;align-items:center;gap:12px;font-family:"Noto Sans",Arial,sans-serif;color:#173f37;max-height:calc(100dvh - 160px);overflow-y:auto;overscroll-behavior:contain}
.drawer-open .revision-rail{display:none}
.revision-upcoming{position:relative;width:66px;flex-shrink:0;text-align:center;padding:0 3px 12px;color:var(--theme-text,#173f37)}.revision-upcoming[hidden]{display:none!important}.revision-upcoming::before{content:"";position:absolute;inset:18px 3px 0;background:currentColor;opacity:.09;clip-path:polygon(0 0,100% 0,50% 100%);pointer-events:none}.revision-upcoming>small{display:block;font-size:10px;opacity:.65;margin-bottom:6px}.revision-upcoming ol{position:relative;list-style:none;margin:0;padding:0;max-height:clamp(100px,22dvh,260px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}.revision-upcoming li{font-size:11px;line-height:22px;white-space:nowrap}.revision-rail>*{flex-shrink:0}body.phone-revision-top .revision-upcoming{grid-column:1/-1;grid-row:5;justify-self:center}body.phone-revision-top .revision-upcoming ol{max-height:88px}
.revision-backlog{position:fixed;left:10px;bottom:max(8px,env(safe-area-inset-bottom));width:70px;margin:0;text-align:center;font:400 10px/1.4 "Noto Sans",Arial,sans-serif;color:var(--theme-text,#173f37);opacity:.6;z-index:59;border:1px solid transparent;border-radius:8px;background:transparent;padding:6px 2px;min-height:44px;cursor:pointer;touch-action:manipulation}.revision-backlog:hover{opacity:1;border-color:currentColor}.revision-backlog:focus-visible{opacity:1;outline:2px solid currentColor;outline-offset:2px}.revision-backlog span{display:block}.revision-backlog[hidden],body.revision-off .revision-backlog,body.drawer-open .revision-backlog,body.anki-complete .revision-backlog{display:none}body.phone-revision-top .revision-backlog{left:0;bottom:0;width:100%;min-height:32px;display:flex;align-items:center;gap:4px;background:var(--theme-control,#fff);padding:2px 10px max(2px,env(safe-area-inset-bottom));opacity:1}body.phone-revision-top .revision-backlog span{opacity:.6}body.phone-revision-top:not(.revision-off) #reader{padding-bottom:36px!important}body.phone-revision-top .revision-backlog[hidden],body.phone-revision-top:is(.revision-off,.drawer-open,.anki-complete) .revision-backlog{display:none}
.revision-rail select{width:66px;border:1px solid #d7e2db;border-radius:9px;padding:7px 3px;background:white;font:600 12px "Noto Sans",sans-serif;color:#173f37}
#revision-rail,#revision-info,#revision-today{touch-action:pan-y}
.revision-rating{width:66px;min-height:64px;border:0;border-radius:13px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;font-size:13px;font-weight:700}
.revision-good{background:#27855b;color:white}.revision-weak{background:#f0c479;color:#513c1d}.revision-rating small{font-size:11px;font-weight:500}.revision-rating:disabled{opacity:.55}
.revision-rating[hidden],.revision-mistake[hidden]{display:none!important}.revision-mistake{width:66px;min-height:44px;padding:5px 2px;border:1px solid #c66d6d;border-radius:10px;background:#fff5f3;color:#8c3535;font:600 11px "Noto Sans",Arial,sans-serif}.revision-mistake[aria-pressed="true"]{background:#8c3535;color:white}.revision-mistake:disabled{opacity:.55}body.phone-revision-top #revision-mistake{grid-column:2/4;grid-row:4;width:100%;min-height:44px}
.revision-progress{border:1px solid #cddcd3;border-radius:13px;width:48px;height:80px;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#f5f9f6;font-size:22px;font-variant-numeric:tabular-nums}.revision-progress span:first-child{border-bottom:1px solid #9bb4a7;width:28px;text-align:center;padding-bottom:4px}.revision-progress span:last-child{padding-top:4px;font-size:18px}.revision-progress[hidden]{display:none}
#revision-stage{font-size:10px;font-weight:600}#revision-current{font-size:9px;text-align:center}.revision-info-button{width:62px;min-height:36px;padding:4px;border:1px solid #cddcd3;border-radius:9px;background:white;color:#173f37;font:600 11px "Noto Sans",Arial,sans-serif;line-height:1.2}
#revision-notice{font-size:9px;line-height:1.5;text-align:center;margin:0;overflow-wrap:anywhere}#revision-retry{font-size:11px;padding:8px;border:1px solid #cddcd3;border-radius:8px;background:white}
.revision-info{width:440px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 40px);overflow-y:auto;overscroll-behavior:contain;border:1px solid #d7e2db;border-radius:20px;padding:24px;color:#173f37;background:#fff;box-shadow:0 20px 70px #173f3733;font:13px/1.6 "Noto Sans",sans-serif}.revision-info::backdrop{background:#173f374d}.revision-info-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.revision-info h2{font-size:19px;margin:0}.revision-info h3{font-size:14px}.revision-info button,.revision-restore-label{padding:10px 12px;border:1px solid #d7e2db;border-radius:10px;background:#f5f9f6;color:#173f37;cursor:pointer;font-size:12px}.revision-info-heading button{font-size:24px;padding:0 10px}.revision-info-navigation{display:flex;gap:8px}.revision-info dl{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px}.revision-info dt{color:#63766b}.revision-info dd{margin:0;font-weight:600}.revision-info ol{padding-left:20px;font-size:11px}.revision-restore-label{display:block;margin-top:10px}.revision-restore-label input{display:block;width:100%;margin-top:7px;font-size:11px}
@media(max-width:800px){body.madinah-preview #reader{padding-left:84px!important;padding-right:8px!important}.revision-rail{left:5px;width:66px;gap:9px}.revision-rating{width:62px;min-height:58px}.revision-rail select{width:62px}}

/* PC/phone typography fits the visible page; tablet ink geometry stays fixed. */
.responsive-type-frame .madinah-line{min-height:0;line-height:2.1}
.responsive-type-frame .madinah-line .surah-banner{min-height:0!important}
.responsive-type-frame .madinah-line .surah-banner h2{font-size:var(--madinah-size)!important}
.responsive-type-frame .madinah-line .basmalah{font-size:var(--madinah-size)!important}
.responsive-type-frame .surah-banner-number{font-size:calc(var(--madinah-size) * .73);flex-basis:2em}
.responsive-type-frame .madinah-line .ayah-marker{height:calc(var(--madinah-size) * .77)!important;min-width:calc(var(--madinah-size) * .77)!important;font-size:calc(var(--madinah-size) * .43)!important}
body.reading-only-device.madinah-preview .topbar{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:4px}
body.reading-only-device.madinah-preview .topbar-right{display:flex;justify-content:flex-end;grid-column:3}
body.reading-only-device.madinah-preview .topbar-left{min-width:0;gap:2px}
body.reading-only-device.madinah-preview #page-summary{grid-column:2;justify-self:center;max-width:calc(100vw - 204px);overflow:hidden}
@media(max-width:400px){body.reading-only-device.madinah-preview .topbar{padding-inline:4px;gap:2px}body.reading-only-device.madinah-preview .summary-page,body.reading-only-device.madinah-preview .summary-surahs{font-size:18px}body.reading-only-device.madinah-preview .topbar-left .audio-controls>button{min-width:28px;width:28px}body.reading-only-device.madinah-preview #page-summary{max-width:calc(100vw - 188px)}}
.responsive-type-frame .surah-banner .banner-star{font-size:var(--madinah-size)!important}.responsive-type-frame .surah-banner:before,.responsive-type-frame .surah-banner:after{width:.5em;height:.5em}.responsive-type-frame .madinah-line .ayah-marker:before{inset:-2px!important}
.responsive-type-frame{padding:12px 1px!important}.responsive-type-frame .madinah-line{padding-inline:2px;gap:1px}.responsive-type-frame .madinah-line .ayah-marker{margin:0 1px!important}
@media(max-width:600px){body.reading-only-device.madinah-preview #mushaf-page{padding-inline:4px}}

.help-open{margin:18px 0 0;padding:12px 18px;min-height:44px;border:1px solid #c8d4ce;border-radius:10px;background:#f3f7f4;color:#173f37;font:inherit;font-weight:600;cursor:pointer;width:100%}
.reader-help{width:min(680px,calc(100vw - 32px));max-height:calc(100dvh - 40px);padding:0;border:1px solid #d2dbd5;border-radius:16px;background:#fff;color:#243b33;box-shadow:0 16px 60px #0003;overflow:hidden}
.reader-help[open]{display:flex;flex-direction:column}
.reader-help::backdrop{background:rgba(20,40,32,.45)}
.help-heading{display:flex;align-items:center;justify-content:space-between;flex-shrink:0;padding:12px 20px;border-bottom:1px solid #e0e7e2}
.help-heading h2{margin:0;font-size:22px}
.help-heading button{width:44px;height:44px;border:0;border-radius:50%;background:#f1f5f2;color:#173f37;font:inherit;font-size:28px;cursor:pointer}
.help-content{overflow:auto;overscroll-behavior:contain;touch-action:pan-y;min-height:0;padding:4px 24px 24px;font-size:16px;line-height:1.65;text-align:left}
.help-content h3{font-size:18px;margin:22px 0 8px;color:#173f37}
.help-content ul,.help-content ol{padding-left:24px;margin:8px 0 16px}
.help-content li{margin:6px 0}
.help-content p{margin:8px 0 16px}

.help-inline-icon{display:inline-block;width:1em;height:1em;vertical-align:-.12em}.close-svg{display:inline-block;width:22px;height:22px;vertical-align:middle;flex-shrink:0}
/* Phone revision ratings sit below the toolbar and reserve their own row. */
body.phone-revision-top .revision-rail{position:static;transform:none;width:100%;max-height:none;flex:none;display:grid;grid-template-columns:50px minmax(0,1fr) minmax(0,1fr) 34px 36px;align-items:center;gap:6px;padding:4px 6px;overflow:visible;background:white;z-index:24}
body.phone-revision-top .revision-rail select{width:50px;min-height:44px}
body.phone-revision-top .revision-rating{width:100%;min-height:44px;border-radius:10px;gap:2px}
body.phone-revision-top .revision-progress{width:34px;height:44px;font-size:14px;border-radius:8px}
body.phone-revision-top .revision-progress span{width:24px;font-size:13px;padding:1px!important}
body.phone-revision-top #revision-stage,body.phone-revision-top #revision-current{display:none}
body.phone-revision-top #revision-notice{grid-column:1/-1;font-size:11px}
body.phone-revision-top #revision-notice:empty{display:none}
body.phone-revision-top #revision-retry{grid-column:1/-1;min-height:44px}
body.phone-revision-top.drawer-open .revision-rail{display:none}
body.phone-revision-top.madinah-preview #reader{padding-left:8px!important;padding-right:8px!important}

#recite-pick-confirm[hidden]{display:none}#recite-pick-confirm{background:#214f3f;color:#fff;border:0;border-radius:8px;padding:0 12px}
.responsive-type-frame .madinah-line{line-height:var(--reader-line-height,1.95)}
.reader-font-scale-controls{margin:16px 0;padding-bottom:16px;border-bottom:1px solid #73907766;font-size:14px;line-height:1.5}
.reader-font-scale-controls label{display:flex;justify-content:space-between;gap:12px}
.reader-font-scale-controls input{width:100%;min-height:44px;accent-color:#d6c697;touch-action:pan-x}
.reader-font-scale-controls small{display:block;font-size:12px;color:#c5d4c4}
body.phone-revision-top #revision-info-open{grid-column:5;grid-row:1}

.recitation-button{background:transparent;border:0;box-shadow:none;color:#214f3f;gap:0}.recitation-button svg{width:30px;height:30px}.recitation-button[aria-pressed=true]{background:transparent;color:#8c3535}
.recitation-button{position:relative}
.recitation-button:before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:40px;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#fffefb 0%,#fffefb 38%,#f4f5ef 58%,#e5e9df 78%,#c6d0bf 100%);box-shadow:0 1px 6px #173f372b,inset 0 0 3px #173f371a;pointer-events:none}
.recitation-button svg{position:relative;z-index:1}
.recitation-button:hover:before,.recitation-button:focus-visible:before{box-shadow:0 1px 7px #173f3738,inset 0 0 4px #173f3722}
.recitation-button:active:before{box-shadow:inset 0 1px 5px #173f3726}
/* Scheduled surahs keep the original page geometry; neighbours are gently blurred. */
.madinah-line.revision-other-surah{filter:blur(1.6px);opacity:.5}.revision-other-surah-word{filter:blur(1.6px);opacity:.5}
#revision-today-open{border:1px solid #cddcd3;border-radius:9px;background:#f5f9f6;color:#173f37;padding:8px 4px;font:600 10px "Noto Sans",sans-serif;min-height:36px;max-width:70px}
#revision-today-open svg{display:block;width:22px;height:22px;margin:auto}.revision-start{width:66px;min-height:38px;border:0;border-radius:9px;background:#27855b;color:white;font:600 12px "Noto Sans",sans-serif}.revision-start:disabled{opacity:.5}.revision-presets{border:0;padding:0;margin:0}.revision-presets legend{margin-bottom:8px;font-weight:600}.revision-presets>div{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.revision-presets button{min-width:44px;min-height:44px;border:1px solid #cddcd3;border-radius:8px;background:white;color:#173f37}.revision-presets button[aria-pressed="true"]{background:#27855b;color:white}.revision-today .revision-presets label{display:flex;gap:6px;flex:1}.revision-presets input{max-width:90px}
.revision-today summary{cursor:pointer;font-weight:600;padding:12px 0}.revision-today form{display:grid;gap:12px}.revision-today label{display:grid;grid-template-columns:1fr 130px;gap:12px;align-items:center}.revision-today input,.revision-today select{min-width:0;width:100%;padding:8px;border:1px solid #cddcd3;border-radius:8px;background:white;color:#173f37;font:inherit}.revision-today #revision-study-start{width:100%;background:#27855b;color:white;font-weight:600}.revision-today #revision-today-list{max-height:180px;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y}.revision-today #revision-plan-error{margin:0;color:#914018}
body.phone-revision-top .revision-rail{grid-template-columns:48px minmax(0,1fr) minmax(0,1fr) 34px 44px 36px}
body.phone-revision-top .revision-info-button{width:44px;min-height:44px}
body.phone-revision-top #revision-start{grid-column:1;grid-row:1;width:48px;min-height:44px}body.phone-revision-top #revision-good{grid-column:3;grid-row:1}body.phone-revision-top #revision-weak{grid-column:2;grid-row:1}body.phone-revision-top #revision-progress{grid-column:4}body.phone-revision-top #revision-info-open{grid-column:5;grid-row:1}body.phone-revision-top #revision-today-open{grid-column:6;grid-row:1;min-height:44px}
/* PC/phone readability takes priority over shrinking a complete page. */
body.readability-scroll.madinah-preview #reader{display:block;overflow-x:hidden!important;overflow-y:auto!important;touch-action:pan-y!important;overscroll-behavior:contain}
body.readability-scroll.madinah-preview #mushaf-page{width:100%!important;min-width:0;height:auto;flex:none!important;overflow:visible!important;align-items:flex-start}
body.readability-scroll.madinah-preview #mushaf-page,body.readability-scroll #annotation-fit,body.readability-scroll #annotation-frame,body.readability-scroll #page-content{touch-action:pan-y!important}
body.readability-scroll #annotation-fit{margin:0 auto!important}
body.readability-scroll .reader-page-arrows{display:flex}

.recite-panel,.recite-feedback ul,.help-content,.revision-info,.revision-today,.sidebar,.audio-settings,.number-keypad,.ink-colour-menu{overflow-x:hidden;overflow-y:auto;overflow-wrap:anywhere}.recite-range-fields{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.reader-settings-group{border:1px solid #73907766;border-radius:12px;margin:18px 0 0;padding:12px;min-width:0;color:#edf5ee;flex-shrink:0}
.reader-settings-group legend{font-weight:700;font-size:14px;padding:0 6px}.reader-settings-group label:not(.setting-switch){display:flex;flex-direction:column;gap:6px;margin:6px 0 14px;font-size:13px}
.reader-settings-group select{width:100%;min-height:44px;border:1px solid #c5d4cb;border-radius:8px;background:#fff;color:#173f37;padding:8px;font:inherit}
.setting-switch{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;font-size:13px}.setting-switch input{width:22px;height:22px;flex:none;accent-color:#27855b}.setting-switch input:disabled{opacity:.4}
.reader-settings-group small{display:block;font-size:11px;line-height:1.6;color:#c0d5c8;margin:4px 0 8px}.reader-settings-group small[hidden]{display:none}#reader-options-status{font-size:12px;color:#ffdacb;line-height:1.5}#reader-options-status:empty{display:none}
#settings-panel{flex-shrink:0;min-height:calc(100dvh - 100px)}#settings-panel .annotation-backup-row{padding-top:20px}
body.revision-off #revision-rail,body.recitation-off #recitation-button{display:none!important}
body.annotation-off:not(.annotation-view-only) #annotation-layer,body.annotation-off #annotation-toolbar{display:none!important}
body.annotation-view-only #annotation-layer{pointer-events:none!important}
body.revision-off.madinah-preview #reader{padding-left:8px!important;padding-right:8px!important}
body.finger-annotation #reader,body.finger-annotation #annotation-fit,body.finger-annotation #annotation-frame,body.finger-annotation #page-content{touch-action:none!important}
body.finger-annotation .reader-page-arrows,body.book-mode .reader-page-arrows,body.ayah-reading .reader-page-arrows{display:flex!important}
body.ayah-reading #reader{display:block!important;overflow-y:auto!important;overflow-x:hidden!important;touch-action:pan-y!important}
body.ayah-reading #mushaf-page{height:auto!important;min-height:0!important;overflow:visible!important;flex:none!important;display:block!important;padding:12px 16px!important}
body.ayah-reading #annotation-fit,body.ayah-reading #annotation-frame{transform:none!important;position:relative!important;width:100%!important;height:auto!important;min-height:0!important;padding:0!important;overflow:visible!important}
body.ayah-reading #page-content{font-family:"Noto Sans",Arial,sans-serif;text-align:left;direction:ltr;display:block!important;width:100%!important;line-height:1.65!important;padding:0!important}
.translated-ayah{padding:18px 0;border-bottom:1px solid #e0e7e2}.translated-arabic{font:32px/2.1 var(--quran-font);white-space:normal;margin:0 0 12px;text-align:right}.translated-arabic .ayah{white-space:normal!important}.translated-english{font:16px/1.8 "Noto Sans",Arial,sans-serif;margin:0;color:#30483c;overflow-wrap:anywhere}.translation-credit{font:12px/1.6 "Noto Sans",Arial,sans-serif;color:#5f7467;margin:8px 0 20px}.translation-ayah-number{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:28px;border:1px solid #b4cabc;border-radius:50%;font:13px "Noto Sans",Arial,sans-serif;padding:3px}.ayah-reading .surah-banner{margin:16px 0!important}
body.book-mode #reader{overflow:hidden!important;display:flex!important;touch-action:none!important;padding-top:8px!important;padding-bottom:52px!important}
body.book-mode #mushaf-page{display:flex!important;width:100%!important;height:100%!important;flex:1!important;min-height:0!important;overflow:hidden!important;padding:0!important}
body.book-mode #annotation-fit,body.book-mode #annotation-frame{width:100%!important;height:100%!important;min-height:0!important;transform:none!important;padding:0!important;margin:0!important;overflow:hidden!important}
body.book-mode #page-content{display:flex!important;flex-direction:row;direction:rtl;gap:20px;width:100%!important;height:100%!important;min-height:0!important;padding:0!important}
.book-page{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;border-inline-end:1px solid #e0e7e2;padding:0 10px}.book-page:last-child{border:0}.book-page-number{font:600 14px "Noto Sans",Arial,sans-serif;text-align:center;margin:0 0 6px;padding:4px;direction:ltr}.book-page-lines{flex:1;min-height:0;overflow:hidden}.book-page .madinah-line{font-size:var(--madinah-size)!important;line-height:2.1!important;min-height:0!important;height:6.666%!important;padding:0 2px;gap:1px}.book-page .madinah-line .surah-banner{min-height:0!important;height:100%;padding:0 8px!important}.book-page .surah-banner h2{font-size:calc(var(--madinah-size)*1.1)!important}.book-page .surah-banner-number{font-size:calc(var(--madinah-size)*.8)!important}.book-page .basmalah{font-size:var(--madinah-size)!important}.book-page .ayah-marker{min-width:calc(var(--madinah-size)*.8)!important;height:calc(var(--madinah-size)*.8)!important;font-size:calc(var(--madinah-size)*.5)!important;margin:0 1px!important}.book-page .ayah-marker:before{inset:0!important}.book-page .ayah-marker:after{display:none}
.alternative-retry{min-height:44px;padding:10px 20px;border:1px solid #cadace;background:#f3f7f4;color:#173f37;border-radius:8px;font:inherit}
body.ayah-reading .summary-surahs,body.ayah-reading .summary-surahs+.summary-separator{display:none!important}body.ayah-reading .summary-juz{font-size:12px}.ayah-reading .reader-status{display:none}
/* Bottom navigation is reserved for complete-surah Arabic/English reading. */
body:not(.ayah-reading) .reader-page-arrows{display:none!important}
body.ayah-reading .reader-page-arrows{display:flex!important;visibility:visible!important}
body.tablet-wide-page #reader{display:block!important;overflow-y:auto!important;overflow-x:hidden!important;touch-action:pan-y!important}
body.tablet-wide-page #mushaf-page{height:auto!important;min-height:0!important;flex:none!important;overflow:visible!important;align-items:flex-start}
body.tablet-wide-page #annotation-fit{margin:0 auto!important;touch-action:pan-y!important}
body.tablet-wide-page #annotation-frame,body.tablet-wide-page #page-content{touch-action:pan-y!important}
body.book-mode #reader{padding-bottom:8px!important}
.annotation-glitter{pointer-events:none;stroke:none}
.annotation-angry-face{position:fixed;z-index:80;pointer-events:none;user-select:none;font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif;font-size:clamp(96px,12vw,150px);line-height:1;transform:translate(-50%,-50%);filter:drop-shadow(0 8px 9px #49380045);will-change:transform,opacity}
.glitter-fleck{animation:glitter-twinkle 2.4s ease-in-out infinite;opacity:.85}
.glitter-fall{animation-name:glitter-fall;animation-timing-function:linear}
.glitter-motion{animation:glitter-drip-live 3.2s linear infinite;opacity:0}
.glitter-pop{animation-name:glitter-pop-live}
.glitter-glint{animation-name:glitter-glint-live}
@keyframes glitter-drip-live{0%{opacity:0;transform:translate(0,-3px) scale(.65)}12%{opacity:1}65%{opacity:.95}90%,100%{opacity:0;transform:translate(var(--glitter-x),var(--glitter-y)) scale(.75)}}
@keyframes glitter-pop-live{0%,4%{opacity:0;transform:translate(0,0) scale(.4)}12%{opacity:1}32%{opacity:.9;transform:translate(var(--glitter-x),var(--glitter-y)) scale(.85)}46%,100%{opacity:0;transform:translate(var(--glitter-x),var(--glitter-y)) scale(.5)}}
@keyframes glitter-glint-live{0%,6%{opacity:0;transform:translate(0,0) scale(.3) rotate(0deg)}12%{opacity:1;transform:translate(0,0) scale(1.15) rotate(20deg)}25%{opacity:.95;transform:translate(var(--glitter-x),var(--glitter-y)) scale(.9) rotate(65deg)}36%,100%{opacity:0;transform:translate(var(--glitter-x),var(--glitter-y)) scale(.4) rotate(90deg)}}
@keyframes glitter-twinkle{0%,100%{opacity:calc(.35 * var(--glitter-strength,1))}50%{opacity:var(--glitter-strength,1)}}
@keyframes glitter-fall{0%{transform:translateY(0);opacity:0}15%{opacity:.95}85%{opacity:.7}100%{transform:translateY(var(--glitter-fall,8px));opacity:0}}
@media(prefers-reduced-motion:reduce){.glitter-fleck,.glitter-motion{animation:none;opacity:calc(.8 * var(--glitter-strength,1))}}
@font-face{font-family:"Amiri Regular";src:url("assets/amiri-regular.ttf") format("truetype");font-display:swap}
.tajweed-rule{color:inherit}.tajweed-enabled .tajweed-rule{color:var(--tajweed-colour)}
.tajweed-key{font:12px/1.7 "Noto Sans",sans-serif;direction:ltr;display:block;flex:none;padding:0 12px;border-bottom:1px solid #dbe6df;width:100%;box-sizing:border-box;background:white;color:#173f37}.tajweed-key[hidden]{display:none}.tajweed-key summary{cursor:pointer;min-height:44px;box-sizing:border-box;padding:12px 0;font-weight:600}.tajweed-key summary:focus-visible{outline:2px solid #ba9a59;outline-offset:2px}.tajweed-key-rules{display:flex;flex-wrap:wrap;gap:6px 14px;padding:0 0 12px}.tajweed-key-item{display:inline-flex;align-items:center;gap:5px}.tajweed-key-item i{width:10px;height:10px;border-radius:50%;flex:none}.tajweed-status{font:12px/1.6 "Noto Sans",sans-serif;color:#7c452c;margin:6px 12px;flex:none}.tajweed-status:empty{display:none}
body.reading-only-device .translated-ayah{padding:28px 0;margin-bottom:12px}
body.reading-only-device .responsive-type-frame .ayah-marker{margin-inline:7px!important}
body.reading-only-device .responsive-type-frame .madinah-line{padding-block:0px}
.gap-layout-notice{font:12px/1.5 "Noto Sans",sans-serif;color:var(--theme-text,#173f37);padding:7px 8px;margin-bottom:6px;border-bottom:1px solid var(--theme-border,#cbd8cd)}
.gap-layout-notice[hidden]{display:none}
body.tablet-zero-gap .madinah-line{height:50px;min-height:50px;line-height:1.6;padding-block:0;margin-block:0}
.reader-notes-open{min-width:36px;width:36px;padding:4px;gap:1px}.reader-notes-open svg{width:21px;height:21px}.reader-notes-open span{font-size:9px}
.ayah-notes-dialog{width:min(560px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;padding:20px;border:1px solid #ceddd3;border-radius:14px;color:#173f37;background:white;box-sizing:border-box;font:14px/1.6 "Noto Sans",sans-serif}.ayah-notes-dialog::backdrop,.book-colour-dialog::backdrop{background:#173f3766}.notes-heading{display:flex;justify-content:space-between;align-items:center}.notes-heading h2{margin:0}.notes-heading button{width:44px;height:44px;background:#f1f5f2;border:0;border-radius:50%}.notes-heading svg{width:20px;stroke:#173f37;stroke-width:2;fill:none}.notes-fields{display:flex;gap:12px;margin:16px 0}.notes-fields label{flex:1;min-width:0}.notes-fields select{display:block;width:100%;min-height:44px;font:inherit}.ayah-notes-dialog textarea{box-sizing:border-box;width:100%;font:16px/1.7 "Noto Sans",sans-serif;padding:12px;border:1px solid #bdd2c5;border-radius:8px;resize:vertical}.ayah-notes-dialog>button,.book-colour-dialog button{min-height:44px;padding:8px 20px;background:#27855b;color:white;border:0;border-radius:8px;font:inherit}.ayah-notes-dialog small{display:block;margin-top:12px}.reader-extra-backups{margin:16px 0}.reader-extra-backups button{min-height:44px;width:100%;margin:4px 0;border:1px solid #739077;border-radius:8px;background:#f3f7f4;color:#173f37;font:13px "Noto Sans",sans-serif}.reader-extra-backups p{font-size:12px;color:#ffdacb}.reader-extra-backups p:empty{display:none}
body.book-mode #annotation-layer{display:none!important}.book-page-lines{position:relative}.book-fixed-canvas{position:absolute;top:0;width:620px;padding:0 26px;box-sizing:border-box;transform-origin:top left;direction:rtl}.book-ink-layer{position:absolute;inset:0;width:620px;height:100%;pointer-events:none;overflow:hidden}.book-fixed-canvas .madinah-line{height:63px!important;min-height:63px!important;font-size:var(--madinah-size)!important;line-height:2.1!important;padding:0 8px!important;gap:2px!important}.book-fixed-canvas .surah-banner{min-height:50px!important;height:50px!important}.book-fixed-canvas .surah-banner h2{font-size:25px!important}.book-fixed-canvas .surah-banner-number{font-size:22px!important}.book-fixed-canvas .ayah-marker{height:23px!important;min-width:23px!important;font-size:13px!important;margin:0 3px!important}.book-colour-dialog{border:1px solid #bdd2c5;border-radius:12px;padding:20px;font:14px "Noto Sans",sans-serif}.book-colour-dialog select{display:block;min-height:44px;margin:12px 0;font:inherit}
[hidden]{display:none!important}.reader-first-open{width:min(440px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;border:1px solid #bed4c6;border-radius:14px;padding:22px;color:#173f37;background:white;box-sizing:border-box;font:14px/1.6 "Noto Sans",sans-serif}.reader-first-open::backdrop{background:#173f3766}.reader-first-open h2{margin-top:0}.reader-first-open label{display:block;margin:14px 0}.reader-first-open select{display:block;width:100%;min-height:44px;margin:6px 0;font:inherit}.reader-first-open button{width:100%;min-height:44px;background:#27855b;color:white;border:0;border-radius:8px;font:inherit}.reader-first-open small{display:block;margin-top:12px}.pen-computer #annotation-toolbar{display:flex!important}

.word-meaning-popup{position:fixed;z-index:1200;width:min(300px,calc(100vw - 16px));max-height:calc(100dvh - 16px);overflow:auto;box-sizing:border-box;padding:22px 24px 16px;border:1px solid #bdd2c5;border-radius:14px;background:#fff;color:#173f37;box-shadow:0 8px 32px #173f3730;text-align:center;font:16px/1.5 "Noto Sans",sans-serif}.word-meaning-close{position:absolute;right:2px;top:2px;width:36px;height:36px;border:0;border-radius:50%;background:transparent;color:inherit}.word-meaning-close svg{width:18px;fill:none;stroke:currentColor;stroke-width:2}.word-meaning-arabic{font:30px/1.8 "Amiri Quran",serif;margin:4px 0 8px}.word-meaning-text{font-weight:600}.word-meaning-popup small{display:block;font-size:10px;line-height:1.6;color:#61776d;margin-top:12px}.word-meaning-selected{background:#e6f2e9;border-radius:4px;box-shadow:0 0 0 2px #91b59d}.ayah[data-word]{-webkit-touch-callout:none}
.page-content .ayah,.translated-arabic,.tajweed-rule{font-variant-ligatures:common-ligatures contextual;font-feature-settings:"rlig" 1,"calt" 1,"liga" 1;letter-spacing:normal}.tajweed-rule{display:inline;unicode-bidi:normal}

/* Paint the iOS status safe area; theme-color alone does not colour standalone iPad views. */
:root{--device-status-top:env(safe-area-inset-top,0px);--device-status-colour:#333333}
html,body,html.screen-fit,html.screen-fit body,body.madinah-preview{background:var(--device-status-colour)}
body{padding-top:var(--device-status-top)}
body::before{content:"";position:fixed;inset:0 0 auto;height:var(--device-status-top);background:var(--device-status-colour);pointer-events:none;z-index:1100}
.workspace,.screen-fit .workspace{height:calc(100vh - var(--device-status-top));height:calc(100dvh - var(--device-status-top))}
.sidebar{top:var(--device-status-top)}
.book-page-lines>.book-ink-layer{position:absolute;inset:0;width:100%!important;height:100%!important;pointer-events:none;overflow:hidden}.annotation-off .book-ink-layer{display:none!important}.book-marks-status{flex:none;direction:ltr;font:12px/1.6 "Noto Sans",sans-serif;color:#914018;margin:4px 12px}.book-marks-status:empty{display:none}body:not(.book-mode) .book-marks-status{display:none}
.ayah-reading .surah-english-name{font:600 20px/1.5 "Noto Sans",Arial,sans-serif;color:#173f37;text-align:center;margin:0 0 24px;overflow-wrap:anywhere}
.surah-banner .page-surah-english{position:absolute;bottom:2px;left:5%;width:90%;font:600 11px/1.2 "Noto Sans",Arial,sans-serif;color:#173f37;text-align:center;white-space:normal;overflow-wrap:anywhere}
body.madinah-preview:not(.book-mode) .madinah-line .surah-banner:has(.page-surah-english) h2{transform:translateY(-12px)}
.book-page .surah-banner .page-surah-english{font-size:calc(var(--madinah-size)*.38)}

.settings-credits p,.settings-credits .recite-licences{font:12px/1.7 "Noto Sans",Arial,sans-serif;color:#ecf3eb;overflow-wrap:anywhere;margin:10px 0}.settings-credits a{color:#f4e5b8;text-decoration:underline}.settings-credits summary{font:13px/1.6 "Noto Sans",Arial,sans-serif;cursor:pointer;padding:8px 0;color:#ecf3eb}.settings-credits #settings-arabic-notice{white-space:pre-wrap}

.ayah-reading .surah-banner{padding:8px 20px 18px!important;min-height:76px!important}.ayah-reading .surah-banner h2{line-height:2.2!important}
.madinah-preview .page-summary{display:flex!important;flex-direction:column;gap:2px!important;padding-block:3px!important}.summary-location{display:flex;align-items:center;gap:6px}.summary-english-name{font:11px/1.3 "Noto Sans",Arial,sans-serif;max-width:170px;white-space:normal;text-align:center}.ayah-reading .summary-english-name{display:none}.summary-multiple-surahs .summary-location{display:grid;grid-template-columns:auto auto;gap:1px 6px}.summary-multiple-surahs .summary-english-name{font-size:9px;max-width:190px}
.pen-note-open{display:block;margin:16px 0 0 auto;min-height:44px;border:1px solid #bcd2c4;border-radius:8px;background:#f2f7f3;color:#173f37;padding:8px 14px;font:14px "Noto Sans",Arial,sans-serif}.pen-notes-dialog{box-sizing:border-box;width:min(960px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;border:1px solid #bdd2c5;border-radius:14px;background:white;color:#173f37;padding:18px;font:14px/1.6 "Noto Sans",Arial,sans-serif}.pen-notes-dialog::backdrop{background:#173f3766}.pen-notes-dialog h2{font-size:17px}.pen-note-tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:16px 0}.pen-note-tools button,.pen-note-tools select{min-height:44px;background:#f3f7f4;border:1px solid #bdd2c5;color:#173f37;border-radius:8px;padding:8px 12px;font:inherit}.pen-note-tools button[aria-pressed=true]{background:#173f37;color:white}#pen-note-pad{display:block;width:100%;height:auto;aspect-ratio:16/9;background:repeating-linear-gradient(white,white calc(12.5% - 1px),#e1ebe4 12.5%);border:1px solid #c8d8cc;box-sizing:border-box;touch-action:none;user-select:none}#pen-note-status{font-size:13px}
.summary-multiple-surahs .summary-location{display:flex!important;gap:4px}body.madinah-preview:not(.book-mode) .madinah-line .surah-banner h2{font-size:min(var(--madinah-size,25px),25px)!important;line-height:1.6!important;transform:translateY(-5px)}

/* User selection and setup */

#user-open{flex:0 0 40px;width:40px;min-width:40px;padding:0}.user-avatar{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:#e7eee8;font-size:23px;line-height:1}.user-dialog{box-sizing:border-box;width:min(420px,calc(100vw - 24px));max-height:calc(100dvh - 32px);overflow:auto;border:1px solid #cbd8cd;border-radius:20px;padding:26px;background:#fffdf7;color:#173f37;font-family:inherit;box-shadow:0 16px 60px #0004}.user-dialog::backdrop{background:#132b2580}.user-dialog h2{margin:0 24px 12px 0;font-size:24px}.user-dialog p{line-height:1.5}.user-dialog small{display:block;line-height:1.5;color:#64756a}.user-dialog button{font:inherit;cursor:pointer;min-height:42px;border:1px solid #cbd8cd;border-radius:10px;background:#edf2e9;color:#173f37;padding:8px 14px}.user-close{position:absolute;right:14px;top:12px;font-size:24px!important;background:transparent!important;border:0!important}.user-dialog label{display:block;margin:16px 0}.user-dialog input,.user-dialog select{display:block;box-sizing:border-box;width:100%;font:inherit;margin-top:6px;padding:10px;border:1px solid #b5c8ba;border-radius:8px;background:white;color:#173f37}.user-dialog [hidden]{display:none!important}#user-current{text-align:center;display:grid;justify-items:center;gap:10px;margin:18px 0}.user-avatar-large{width:72px;height:72px;font-size:44px}#user-current-name{font-size:20px;overflow-wrap:anywhere}#user-list{display:grid;gap:8px;margin:18px 0}#user-list button{display:flex;gap:12px;align-items:center;text-align:left;overflow-wrap:anywhere}#user-add,#user-start{width:100%;margin:14px 0;background:#173f37;color:white}.user-form-actions{display:flex;gap:10px;justify-content:flex-end}#user-error,#user-setup-error{color:#a12828}.user-setup #settings-panel{display:block!important}.user-setup .reader-extra-backups,.user-setup #pen-notes-backups,.user-setup #reader-credits{display:none!important}.user-setup .reader-settings-group{margin:16px 0}.user-setup .setting-switch{display:flex;align-items:center;justify-content:space-between;gap:12px}.user-setup input[type=checkbox]{width:24px;height:24px;flex:0 0 24px}.user-setup input[type=range]{padding:0}.user-setup #reader-options-status{color:#a12828}

.pen-note-tools button,.pen-note-tools select,.pen-note-open,.pen-notes-dialog .notes-heading button{border-radius:999px}.pen-note-tools button{padding-inline:18px}
#pen-notes-backups button{border-radius:999px}



/* Sunset keeps the original palette. Appearance changes colours only, never ink geometry. */
:root{--theme-surface:#fff;--theme-panel:#fffdf7;--theme-control:#edf2e9;--theme-text:#173f37;--theme-muted:#64756a;--theme-border:#b5c8ba;--theme-accent:#173f37;--theme-on-accent:#fff}
:root[data-theme=light]{color-scheme:light;--device-status-colour:#fff;--paper:#fff;--background:#fff;--theme-panel:#fff;--theme-control:#f4f6f5;--theme-border:#cbd8d0;--theme-sidebar:#fff;--theme-sidebar-text:#173f37;--theme-sidebar-muted:#526b5e}
:root[data-theme=dark]{color-scheme:dark;--device-status-colour:#0d1714;--green:#d8e8df;--green-light:#accabb;--ink:#edf3ec;--muted:#aabeb1;--paper:#14231d;--background:#0d1714;--gold:#d6b675;--theme-surface:#14231d;--theme-panel:#1b2e25;--theme-control:#273f32;--theme-text:#edf3ec;--theme-muted:#b8cabc;--theme-border:#536d5b;--theme-accent:#b5d6c0;--theme-on-accent:#13291d;--theme-sidebar:#101e18;--theme-sidebar-text:#edf3ec;--theme-sidebar-muted:#b8cabc}
.user-setup :is(.reader-settings-group,.font-choice,.reader-font-scale-controls,.setting-switch){color:var(--theme-text)}
.user-setup :is(.reader-settings-group small,.reader-font-scale-controls small){color:var(--theme-muted)}
.user-setup .reader-settings-group{border-color:var(--theme-border)}
html:is([data-theme=light],[data-theme=dark]) :is(.workspace,main,.topbar,.mushaf-page,.page-frame,.book-page,.book-page-lines,.reader-navigation){background:var(--theme-surface)!important;color:var(--theme-text)}
html:is([data-theme=light],[data-theme=dark]) :is(.page-content,.translated-arabic,.translated-english,.surah-english-name,.book-page-number,.revision-rail,.recitation-button){color:var(--theme-text)}
html:is([data-theme=light],[data-theme=dark]) :is(.sidebar){background:var(--theme-sidebar);color:var(--theme-sidebar-text)}
html:is([data-theme=light],[data-theme=dark]) .sidebar :is(.reader-settings-group,.setting-switch,.font-choice,label,.settings-credits p,.settings-credits summary,.settings-credits .recite-licences,.quick-links button,.surah-link,.jump-form input){color:var(--theme-sidebar-text)}
html:is([data-theme=light],[data-theme=dark]) .sidebar :is(small,.reader-font-scale-controls small,.brand-caption,.sidebar-intro,.sidebar-footer,.sidebar-footer a,.index-loading,.no-results,.jump-form span,.surah-index-number,.surah-start-page,.surah-search,.surah-search input::placeholder){color:var(--theme-sidebar-muted)}
html[data-theme=light] .sidebar :is(.settings-credits a,.quick-links button>span,.small-star){color:#7f6022}
html:is([data-theme=light],[data-theme=dark]) :is(dialog,.word-meaning-popup,.audio-settings,.recite-panel,.annotation-panel-card,.number-keypad,.ink-colour-menu){background:var(--theme-panel)!important;color:var(--theme-text);border-color:var(--theme-border)}
html:is([data-theme=light],[data-theme=dark]) :is(.page-summary,.annotation-switch,.user-avatar,.revision-progress,.recite-pick-bar,.recite-feedback li,#keypad-value,.pen-note-open){background:var(--theme-control)!important;color:var(--theme-text);border-color:var(--theme-border)}
html:is([data-theme=light],[data-theme=dark]) :is(dialog,.sidebar,.audio-settings,.recite-panel,.annotation-panel-card,.ink-colour-menu) :is(button,select,input:not([type=checkbox]):not([type=range]),textarea),html:is([data-theme=light],[data-theme=dark]) :is(.revision-info-button,#revision-today-open,#revision-retry,.keypad-digits button,.reader-navigation button){background:var(--theme-control);color:var(--theme-text);border-color:var(--theme-border)}
html:is([data-theme=light],[data-theme=dark]) #open-sidebar{background:var(--theme-control);color:var(--theme-text);border-color:var(--theme-border)}
html:is([data-theme=light],[data-theme=dark]) :is(.user-dialog small,.word-meaning-popup small,.translation-credit,.recite-privacy,.recite-licences,#recite-bounds,.revision-info dt,.page-number,.reading-footnote,.topbar-caption){color:var(--theme-muted)}
html:is([data-theme=light],[data-theme=dark]) :is(.help-content h3,.surah-banner h2,.surah-banner-number){color:var(--theme-text)}
html:is([data-theme=light],[data-theme=dark]) .surah-banner{background:var(--theme-control)!important;border-color:var(--theme-border);outline-color:var(--gold)}
html:is([data-theme=light],[data-theme=dark]) :is(.surah-banner:before,.surah-banner:after,.ayah-marker){background:var(--theme-control);color:var(--theme-text);border-color:var(--theme-border)}
html:is([data-theme=light],[data-theme=dark]) :is(.book-page,.translated-ayah,.topbar){border-color:var(--theme-border)}
html:is([data-theme=light],[data-theme=dark]) .recitation-button:before{background:radial-gradient(circle,var(--theme-surface),var(--theme-control));box-shadow:0 1px 6px #0003}
html:is([data-theme=light],[data-theme=dark]) .audio-controls>button{background:var(--theme-control);color:var(--theme-text)}
html:is([data-theme=light],[data-theme=dark]) :is(#user-start,#user-add,#keypad-done,#recite-start,#revision-study-start,.reader-first-open button){background:var(--theme-accent);color:var(--theme-on-accent)}
html[data-theme=dark] :is(#user-error,#user-setup-error,#reader-options-status,#keypad-error,#revision-plan-error,.book-marks-status,.notes-status.error,#recite-status.error){color:#ffb4a5}
html[data-theme=dark] :is(.ayah.audio-active,.ayah.audio-word-active,.ayah.search-highlight,.word-meaning-selected,.recite-picked,.recite-match){color:#14231d}
html[data-theme=dark] .recite-feedback li.matched{background:#254d32!important;color:#ddf4df}
html[data-theme=dark] .recite-feedback li.uncertain{background:#594421!important;color:#ffe2b2}
html[data-theme=dark] :is(.annotation-switch button[aria-pressed=true],.pen-note-tools button[aria-pressed=true]){background:#b5d6c0!important;color:#13291d}
/* The handwriting pad remains white so existing coloured ink stays legible. */
html:is([data-theme=light],[data-theme=dark]) .sidebar #drawer-title{color:var(--theme-sidebar-text)}
html:is([data-theme=light],[data-theme=dark]) :is(.audio-controls,.audio-controls>button:before){background:var(--theme-control);border-color:var(--theme-border)}
html[data-theme=dark] .audio-selected-line::before{background:#365246}
html[data-theme=dark] .search-popup .surah-link:is(:hover,.selected){background:var(--theme-control);color:var(--theme-text)}
html[data-theme=dark] :is(.annotation-panel-heading,.annotation-panel-hint,.annotation-status,.audio-settings p,.notes-status){color:var(--theme-muted)}
#recite-choice button{display:block;width:100%;border-radius:999px;margin:12px 0;padding:12px 16px;font:inherit}

/* Keep icon foregrounds and their actual surfaces paired in Dark mode. */
html[data-theme=dark] .topbar :is(.audio-controls>button,.annotation-switch button,.reader-notes-open,.recitation-button){color:var(--theme-text)!important}
html[data-theme=dark] .topbar :is(.audio-controls>button,.recitation-button)::before{background:radial-gradient(circle,#334e3e 0%,#273f32 70%,#20362b 100%)!important;box-shadow:0 1px 6px #0004,inset 0 0 0 1px #536d5b!important}
html[data-theme=dark] .topbar .annotation-switch button{background:transparent}
html[data-theme=dark] .topbar .annotation-switch button[aria-pressed=true]{background:var(--theme-accent)!important;color:var(--theme-on-accent)!important;box-shadow:inset 0 0 0 1px var(--theme-accent)!important}
html[data-theme=dark] .topbar .annotation-switch button:disabled{opacity:.55}
html[data-theme=dark] :is(.topbar,.reader-navigation,.sidebar,dialog,.recite-panel,.word-meaning-popup) button svg{color:inherit}
html[data-theme=dark] .page-turn svg{color:var(--theme-text)}
html[data-theme=dark] .ink-colour-menu button:is(:hover,:focus-visible,[aria-checked=true]){background:var(--theme-control);color:var(--theme-text);outline-color:var(--theme-accent)}
html[data-theme=dark] .ink-colour-menu button[aria-checked=true] .ink-swatch{outline-color:var(--theme-accent)}
html[data-theme=dark] .topbar .recitation-button[aria-pressed=true]{color:#ffb4a5!important}

/* Sketch-led user cards: icon above name, with a matching New user tile. */
#user-dialog{width:min(900px,calc(100vw - 32px));min-height:420px;padding:36px 40px;border-radius:32px}#user-dialog.user-welcome{width:min(500px,calc(100vw - 32px));min-height:500px;background:#fffdf7}#user-dialog h2{font-size:30px;font-weight:600}#user-dialog #user-description:empty{display:none}#user-dialog>#user-current{display:none!important}#user-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:24px;margin:54px 0 44px;align-items:start}#user-list .user-tile{display:flex;flex-direction:column;align-items:center;gap:10px;min-width:0}#user-list .user-tile-button{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;gap:16px;width:100%;max-width:180px;border:0;background:transparent;color:inherit;padding:4px 8px;margin:0;text-align:center;border-radius:16px;min-height:160px}#user-list .user-avatar{width:100px;height:100px;font-size:58px;background:#eef2e9;border:2px solid #dbe4d9;flex-shrink:0}#user-list .user-tile-name{font-size:20px;line-height:1.3;overflow-wrap:anywhere;max-width:100%}#user-list .user-selected .user-avatar{border-color:#39694e;box-shadow:0 0 0 4px #39694e12}#user-list .user-new-icon{font-size:60px;font-weight:300}#user-list #user-add>span:last-child{font-size:20px}#user-edit{min-height:32px;padding:4px 16px;font-size:14px;border-radius:20px}#user-form{text-align:center}#user-form .user-welcome-icon{display:flex;margin:34px auto 10px;width:120px;height:120px;font-size:70px;padding:0;border-radius:50%;border:2px solid #dbe4d9;background:#eef2e9}#user-form .user-icon-hint{font-size:12px}#user-form .user-name-label{margin:34px auto 24px;max-width:360px}#user-form #user-name{border-radius:30px;text-align:center;padding:16px 22px;font-size:22px;background:#fffefa}#user-form .user-form-actions{display:flex;justify-content:center;flex-wrap:wrap;margin:28px 0 14px}#user-form #user-save{border-radius:28px;min-width:190px;padding:13px 26px;background:#173f37;color:white}#user-form #user-cancel{border-radius:28px}#user-dialog>small{font-size:11px;text-align:center;margin-top:18px}#user-icon-choices{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:16px auto;max-width:310px}#user-icon-choices button{font-size:28px;padding:8px;min-width:0;border-radius:50%}#user-dialog button:focus-visible{outline:3px solid #b69551;outline-offset:4px}@media(max-width:550px){#user-dialog{padding:28px 20px;min-height:360px;border-radius:26px}#user-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px;margin:32px 0}#user-list .user-avatar{width:82px;height:82px;font-size:46px}#user-list .user-tile-button{min-height:135px;gap:12px}#user-list .user-tile-name,#user-list #user-add>span:last-child{font-size:17px}#user-dialog.user-welcome{min-height:470px}}

#user-dialog #user-list #user-add{background:transparent;color:inherit;border:0;margin:0}


.topbar .topbar-left>#open-sidebar{position:static;display:flex;flex:0 0 40px;width:40px;min-width:40px;height:44px;padding:4px;order:0;margin:0;align-items:center;justify-content:center;border-radius:12px;background:var(--theme-control,#eef2e8);color:var(--theme-text,inherit);border:1px solid var(--theme-border,#cbd8cd);box-shadow:0 2px 8px #173f371a}.topbar .topbar-left>#open-sidebar span{display:none}.topbar .topbar-left>#open-sidebar svg{width:24px;height:24px}@media(max-width:400px){body.reading-only-device.madinah-preview #page-summary{max-width:calc(100vw - 224px)}.topbar .topbar-left>#open-sidebar{flex-basis:36px;width:36px;min-width:36px}}

#user-delete,#user-delete-do{color:#a12828;background:#fff0eb;border-color:#dfb5aa}#user-delete{margin:8px auto}#user-delete-confirm{border:1px solid #dfb5aa;border-radius:16px;padding:12px;margin-top:14px;background:#fff9f5;color:#173f37}#user-delete-confirm p{margin-top:0}#user-dialog #user-restore{display:block;margin:18px auto 0;border:0;background:transparent;text-decoration:underline;font-size:13px}
@media(max-width:600px){body.reading-only-device.madinah-preview .topbar{grid-template-columns:max-content minmax(0,1fr) max-content}body.reading-only-device.madinah-preview #page-summary{min-width:0;width:auto;max-width:100%;justify-self:center}body.reading-only-device.madinah-preview #user-open{flex-basis:36px;width:36px;min-width:36px}body.reading-only-device.madinah-preview #ayah-notes-open{width:28px;min-width:28px;padding-inline:2px}}

/* Keep the profile immediately beside the microphone, with Settings first on the left. */
/* A complete Settings palette, shared with the first-open settings panel. */
:root{--settings-surface:#fff7e8;--settings-card:#fffaf1;--settings-control:#f4ead5;--settings-text:#173f37;--settings-muted:#596e60;--settings-border:#c8b991;--settings-accent:#876625;--settings-error:#a12828}
:root[data-theme=light]{--settings-surface:#fff;--settings-card:#fff;--settings-control:#f4f6f5;--settings-text:#173f37;--settings-muted:#526b5e;--settings-border:#cbd8d0;--settings-accent:#173f37}
:root[data-theme=dark]{--settings-surface:#101e18;--settings-card:#1b2e25;--settings-control:#273f32;--settings-text:#edf3ec;--settings-muted:#b8cabc;--settings-border:#536d5b;--settings-accent:#b5d6c0;--settings-error:#ffb4a5}
html[data-theme] #sidebar{background:var(--settings-surface);color:var(--settings-text);scrollbar-color:var(--settings-border) var(--settings-surface)}
html[data-theme] #settings-panel{color:var(--settings-text)}
html[data-theme] #sidebar #drawer-title,html[data-theme] #settings-panel :is(label,legend,.font-choice,.setting-switch){color:var(--settings-text)}
html[data-theme] #settings-panel .reader-settings-group{background:var(--settings-card);border-color:var(--settings-border);color:var(--settings-text)}
html[data-theme] #settings-panel :is(small,.settings-credits p,.settings-credits summary,.recite-licences){color:var(--settings-muted)}
html[data-theme] #settings-panel :is(a,.settings-credits a){color:var(--settings-accent)}
html[data-theme] #settings-panel :is(select,button,input:not([type=checkbox]):not([type=range]),textarea),html[data-theme] #sidebar #close-sidebar{background:var(--settings-control);color:var(--settings-text);border-color:var(--settings-border)}
html[data-theme] #settings-panel :is(.font-choice,.annotation-backup-row),html[data-theme] #sidebar .drawer-heading{border-color:var(--settings-border)}
html[data-theme] #settings-panel input:is([type=checkbox],[type=range]){accent-color:var(--settings-accent)}
html[data-theme] #settings-panel :is(button,select,input,a):focus-visible{outline-color:var(--settings-accent)}
html[data-theme] #settings-panel :is(#reader-options-status,#notes-backup-status,#pen-notes-backup-status){color:var(--settings-error)}
.recitation-dock{gap:8px}
.recitation-dock #user-open{pointer-events:auto}
@media(max-width:600px){.recitation-dock{gap:4px}}

/* Give the single Quran page the available reader area. Keep ink coordinates intact. */
body.madinah-preview:not(.book-mode):not(.ayah-reading) #reader{max-width:none;padding-top:2px;padding-bottom:2px}
body.madinah-preview:not(.book-mode):not(.ayah-reading) #mushaf-page{padding:2px 4px}
@media(min-width:801px){body.madinah-preview:not(.book-mode):not(.ayah-reading) #reader{padding-left:90px;padding-right:12px}}
body.tablet-device.madinah-preview:not(.book-mode):not(.ayah-reading) #reader{display:block!important;overflow-y:auto!important;overflow-x:hidden!important;touch-action:pan-y!important}
body.tablet-device.madinah-preview:not(.book-mode):not(.ayah-reading) #mushaf-page{height:auto;flex:none!important;overflow:visible!important;align-items:flex-start}
body.tablet-device.madinah-preview:not(.book-mode):not(.ayah-reading) #annotation-fit{margin:0 auto!important}
/* Lift the page as one surface, leaving its text and saved ink geometry intact. */
body.madinah-preview:not(.book-mode):not(.ayah-reading) #annotation-fit{top:-8px}
body.tablet-device.madinah-preview:not(.book-mode):not(.ayah-reading) #annotation-fit{top:-18px}
body.tablet-device.madinah-preview:not(.book-mode):not(.ayah-reading) :is(#annotation-fit,#annotation-frame,#page-content){touch-action:pan-y!important}

.offline-actions{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.offline-actions button{font:inherit;padding:9px 12px;border-radius:8px;border:1px solid currentColor;color:inherit;background:transparent}.offline-actions button:disabled{opacity:.5}#offline-status{overflow-wrap:anywhere}
/* Surah name stays beside P/S/J, keeping navigation and the toolbar on one row. */
.madinah-preview .topbar .page-summary{flex:0 1 auto;min-width:0;max-width:420px;flex-direction:row;flex-wrap:nowrap;gap:8px!important;height:44px;min-height:44px}
.page-summary .summary-location{flex:none;white-space:nowrap}
.page-summary .summary-english-name{flex:0 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left}
@media(max-width:600px){.madinah-preview .topbar .page-summary{gap:4px!important}.page-summary .summary-english-name{font-size:10px}}

.offline-view-notice{max-width:620px;margin:0 auto 12px;padding:12px;border:1px solid var(--theme-text);border-radius:10px;color:var(--theme-text);background:var(--theme-surface);font-size:14px;line-height:1.5}.offline-view-notice[hidden]{display:none}.offline-view-notice p{margin:0 0 8px}.offline-view-notice button{font:inherit;min-height:44px;padding:8px 14px;border:1px solid currentColor;border-radius:8px;background:transparent;color:inherit}
/* Larger colour-filled drawing icons stay within the existing tool buttons. */
.madinah-preview .topbar .annotation-switch :is(#annotation-pen,#annotation-highlight){padding:3px}
.madinah-preview .topbar .annotation-switch :is(#annotation-pen,#annotation-highlight) svg{width:28px;height:28px;flex:none}
/* Anki controls sit below the existing toolbar without crowding navigation. */
.anki-day-panel{text-align:center;margin:32px auto;padding:24px;max-width:520px;color:var(--theme-text,#173f37)}
.anki-completion-party{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:2000}.anki-completion-party span{position:absolute;width:9px;height:14px;opacity:0;animation:anki-party-pop 2800ms cubic-bezier(.2,.65,.4,1) forwards}@keyframes anki-party-pop{0%{opacity:1;transform:translate(0,0) rotate(0)}35%{opacity:1;transform:translate(var(--party-x),var(--party-y)) rotate(var(--party-turn))}80%{opacity:1}100%{opacity:0;transform:translate(var(--party-x),var(--party-fall)) rotate(calc(var(--party-turn) * 2))}}@media(prefers-reduced-motion:reduce){.anki-completion-party{display:none}}
.anki-day-panel button{margin:6px;padding:12px;border-radius:10px;border:1px solid var(--theme-border,#b5c9b9);background:var(--theme-control,#eef2e8);color:inherit}
body.anki-complete.madinah-preview:not(.book-mode):not(.ayah-reading) #reader,body.anki-complete #reader,body.anki-complete #revision-rail,body.anki-complete .reader-navigation{display:none!important}
.anki-filter{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}.anki-filter label{display:grid!important;grid-template-columns:minmax(0,1fr);gap:6px!important;margin:0!important;min-width:0}.anki-filter input,.anki-filter select{width:100%!important;min-width:0}.anki-check{display:flex!important;align-items:center;gap:8px}.anki-check input{width:auto!important}
.anki-filter label[hidden]{display:none!important}
#revision-advanced{margin-top:20px;border-top:1px solid var(--theme-border,#b5c9b9);padding-top:14px}#revision-advanced summary{cursor:pointer;font-weight:700}
.anki-progress-row{display:grid;grid-template-columns:minmax(0,1fr) 110px 75px auto;gap:7px;align-items:center;border-bottom:1px solid var(--theme-border,#b5c9b9);padding:12px 0;font-size:12px}
.anki-progress-row input,.anki-progress-row select{width:100%;min-width:0}.anki-progress-row small{grid-column:1/-1}.anki-progress-row button{padding:8px}
.anki-graduation{position:fixed;z-index:90;top:40%;left:50%;transform:translate(-50%,-50%);padding:24px 32px;border-radius:18px;background:var(--theme-control,#eef2e8);color:var(--theme-text,#173f37);box-shadow:0 12px 60px #173f3740;text-align:center;font-size:22px;pointer-events:none;animation:anki-celebrate .5s ease-out}
@keyframes anki-celebrate{from{opacity:0;transform:translate(-50%,-50%) scale(.8)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@media(prefers-reduced-motion:reduce){.anki-graduation{animation:none}}
@media(max-width:480px){.anki-progress-row{grid-template-columns:minmax(0,1fr) 100px 65px}.anki-progress-row button{grid-column:3}}
/* Keep revision fields at Safari's non-zooming text size and within the dialog. */
#revision-today input,#revision-today select{font-size:16px}
#revision-advanced{min-width:0;max-width:100%;overflow-wrap:anywhere}
#revision-advanced :is(input,select,button){box-sizing:border-box;max-width:100%;min-width:0}
.anki-progress-row>strong{min-width:0;overflow-wrap:anywhere}
@media(max-width:480px){
  #revision-today{width:calc(100vw - 24px);max-width:440px;padding:18px}
  .anki-progress-row{grid-template-columns:minmax(0,1fr) 76px auto}
  .anki-progress-row>strong{grid-column:1/-1}
  .anki-progress-row>select{grid-column:1;grid-row:auto}
  .anki-progress-row>input{grid-column:2}
  .anki-progress-row>button{grid-column:3}
}
.anki-progress-row{grid-template-columns:minmax(0,1fr) 85px}
.anki-progress-row>strong{grid-column:1/-1}
.anki-stage-boxes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;min-width:0}
#revision-advanced .anki-stage-boxes button{min-height:44px;padding:8px 3px;font-size:12px;grid-column:auto}
#revision-advanced .anki-stage-boxes button[aria-pressed=true]{background:var(--theme-accent,#276b50);color:var(--theme-on-accent,#fff);border-color:var(--theme-accent,#276b50);font-weight:700}
.anki-progress-row>input{grid-column:2}
@media(max-width:480px){.anki-progress-row{grid-template-columns:minmax(0,1fr) 70px}.anki-stage-boxes{grid-column:1}}
.anki-stage-boxes{grid-column:1}
.anki-value-row{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) 85px;gap:7px;min-width:0}
.anki-value-boxes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;min-width:0}
#revision-advanced .anki-value-boxes button{min-height:44px;padding:8px 3px;grid-column:auto;font-size:14px}
#revision-advanced .anki-value-boxes button[aria-pressed=true]{background:var(--theme-accent,#276b50);color:var(--theme-on-accent,#fff);border-color:var(--theme-accent,#276b50);font-weight:700}
@media(max-width:480px){.anki-value-row{grid-template-columns:minmax(0,1fr) 70px}}
/* Give the pen a little more colour area without resizing its button. */
.madinah-preview .topbar .annotation-switch #annotation-pen svg{width:32px;height:32px}
#feedback-open{width:100%;margin:24px 0 12px;padding:16px;text-align:center;line-height:1.5;white-space:normal;border:1px solid var(--settings-border);border-radius:12px;font:inherit}
#feedback-dialog{width:min(680px,calc(100vw - 24px));max-height:calc(100dvh - 32px);box-sizing:border-box;overflow:auto;padding:24px;border:1px solid var(--settings-border);border-radius:18px;background:var(--settings-surface);color:var(--settings-text);font-family:"Noto Sans",sans-serif}
#feedback-dialog::backdrop{background:rgba(0,0,0,.5)}
.feedback-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.feedback-heading h2{margin:0}.feedback-heading button{font-size:28px}
#feedback-dialog small{display:block;color:var(--settings-muted);line-height:1.6}
#feedback-dialog button,#feedback-dialog input,#feedback-dialog select,#feedback-dialog textarea{box-sizing:border-box;min-height:44px;padding:10px;border:1px solid var(--settings-border);border-radius:8px;background:var(--settings-control);color:var(--settings-text);font:inherit}
#feedback-dialog button{cursor:pointer}#feedback-dialog button:disabled{opacity:.6;cursor:wait}#feedback-dialog :focus-visible{outline:3px solid var(--settings-accent);outline-offset:2px}
.feedback-controls{display:flex;align-items:end;flex-wrap:wrap;gap:10px;margin-top:20px}.feedback-controls label{flex:1 1 180px}
#feedback-dialog label{display:flex;flex-direction:column;gap:6px}#feedback-dialog input,#feedback-dialog textarea{width:100%}#feedback-dialog textarea{resize:vertical}
#feedback-status{min-height:24px;color:var(--settings-accent)}.feedback-card{padding:16px;margin:12px 0;border:1px solid var(--settings-border);border-radius:12px;background:var(--settings-card);overflow-wrap:anywhere}.feedback-card h3{margin:0;font-size:17px}.feedback-card p{white-space:pre-wrap}.feedback-vote{margin-top:12px}#feedback-dialog .feedback-vote[aria-pressed=true]{border:2px solid var(--settings-accent)}
#feedback-form{display:flex;flex-direction:column;gap:12px;border-top:1px solid var(--settings-border);margin-top:24px;padding-top:16px}#feedback-form h3{margin:0}#feedback-form button{align-self:start}
@media(max-width:450px){#feedback-dialog{padding:16px}.feedback-controls label{flex-basis:100%}}

.ink-size-section{border-top:1px solid currentColor;margin-top:8px;padding-top:8px}.ink-size-heading{font-size:12px;font-weight:600;padding:6px 12px}.ink-size-circle{display:inline-block;flex:none;border-radius:50%;background:currentColor}.ink-size-section button{display:flex;align-items:center;gap:14px;min-height:48px;width:100%;padding:8px 12px;border:0;border-radius:9px;text-align:left;background:transparent;color:inherit;font:14px "Noto Sans",sans-serif}.ink-size-section button:is([aria-checked=true],[aria-pressed=true]){box-shadow:inset 0 0 0 2px currentColor;font-weight:600}
#annotation-erase{touch-action:none;-webkit-touch-callout:none;user-select:none}.erase-page-dialog{width:min(420px,calc(100vw - 32px));border:1px solid var(--settings-border,#bdd2c5);border-radius:16px;padding:24px;background:var(--settings-surface,#fffef9);color:var(--settings-text,#173f37);font:14px/1.5 "Noto Sans",sans-serif}.erase-page-dialog::backdrop{background:#0007}.erase-page-dialog h2{font-size:19px;margin:0 0 12px}.erase-page-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:24px}.erase-page-actions button{min-height:44px;padding:10px 16px;border:1px solid currentColor;border-radius:9px;font:inherit;background:transparent;color:inherit}.erase-page-actions .erase-page-confirm{background:#a13030;color:white;border-color:#a13030}

.marking-reminder{background:#fff1ad;color:#503a00;border:1px solid #d5ad34;border-left:5px solid #cf9800;border-radius:12px;padding:16px;margin:16px 0}.marking-reminder h3{color:#503a00;font-size:16px;margin:0 0 8px}.marking-reminder p{color:#503a00;font-size:13px;line-height:1.5;margin:8px 0}.marking-reminder button{background:#ffe17a;color:#503a00;border:1px solid #b18a18;border-radius:9px;min-height:44px;padding:10px 12px;font:inherit;width:100%;cursor:pointer}.marking-reminder summary{color:#503a00;font-size:13px;cursor:pointer;padding:8px 0}.marking-reminder textarea{display:block;box-sizing:border-box;width:100%;background:#fffbed;color:#503a00;border:1px solid #c8a64a;border-radius:8px;padding:10px;font:12px/1.5 monospace;resize:vertical}.marking-reminder button:focus-visible,.marking-reminder summary:focus-visible,.marking-reminder textarea:focus-visible{outline:3px solid #654a00;outline-offset:2px}

.account-dialog{width:min(92vw,480px);max-height:90dvh;border-radius:22px;padding:24px;background:var(--panel,#fff);color:var(--ink,#173f37);overflow:auto}.account-dialog label{display:block;margin:14px 0}.account-dialog input:not([type=checkbox]){box-sizing:border-box;width:100%;padding:12px;border:1px solid #aabbb4;border-radius:10px;font:inherit;font-size:16px}.account-actions,.account-user-actions,.account-sync-tools{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}.account-actions button,.account-user-actions button{padding:10px 14px;border-radius:12px;min-height:44px}.account-device-note{font-size:13px}.cloud-sync-status{background:#173f37;color:white;border-radius:9px;padding:10px 12px;font-size:13px;line-height:1.5;overflow-wrap:anywhere}.cloud-sync-status[data-sync-state=error]{background:#a23228}.cloud-sync-status[data-sync-state=pending]{background:#765700}

.revision-daily-progress{margin:0;width:100%;padding:6px 2px;border-radius:8px;background:#eef6ef;color:#173f37;font-size:11px;font-weight:600;line-height:1.5;text-align:center;overflow-wrap:normal}.revision-daily-progress[hidden]{display:none}body.phone-revision-top .revision-daily-progress{grid-column:1/-1;grid-row:1;padding:4px 6px;font-size:12px}.anki-day-progress{font-weight:600;color:#173f37}

.revision-daily-progress strong{display:block;font-size:16px;line-height:1.3;color:#145b3b}.revision-daily-progress small{display:block;margin-top:3px;font-size:10px;font-weight:400;line-height:1.4}body.phone-revision-top .revision-daily-progress strong{font-size:18px}body.phone-revision-top .revision-daily-progress small{font-size:11px}body.phone-revision-top #revision-start,body.phone-revision-top #revision-good,body.phone-revision-top #revision-weak,body.phone-revision-top #revision-progress,body.phone-revision-top #revision-info-open,body.phone-revision-top #revision-today-open{grid-row:2}

.revision-rating-actions{display:flex;flex-direction:column;gap:6px;width:100%}.revision-rating-actions button{min-height:36px;border:1px solid #9ab6a5;border-radius:9px;background:#fff;color:#173f37;font:600 12px "Noto Sans",Arial,sans-serif;cursor:pointer}.revision-rating-actions button:disabled{opacity:.4;cursor:default}.anki-day-panel .revision-rating-actions{max-width:180px;margin:12px auto}body.phone-revision-top .revision-rating-actions{grid-column:1/-1;grid-row:1;align-items:center}body.phone-revision-top .revision-rating-actions button{width:76px;min-height:36px}body.phone-revision-top .revision-daily-progress{grid-row:2}body.phone-revision-top #revision-start,body.phone-revision-top #revision-good,body.phone-revision-top #revision-weak,body.phone-revision-top #revision-progress,body.phone-revision-top #revision-info-open,body.phone-revision-top #revision-today-open{grid-row:3}

#anki-day-correction-notice:empty{display:none}#anki-day-correction-notice{font-size:13px;line-height:1.5}#anki-day-correction-retry[hidden]{display:none}
#user-open{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:46px}#user-toolbar-avatar{flex-shrink:0}#user-toolbar-name{display:block;width:36px;max-width:36px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;font:500 8px/9px "Noto Sans",Arial,sans-serif;color:inherit;letter-spacing:0}

#revision-daily-left{display:block;width:100%;min-height:36px;padding:3px;border:0;border-radius:6px;background:transparent;color:#145b3b;font:700 16px/1.3 "Noto Sans",Arial,sans-serif;cursor:pointer}#revision-daily-left:hover{background:#dceade}#revision-daily-left:focus-visible{outline:2px solid #145b3b;outline-offset:2px}body.phone-revision-top #revision-daily-left{font-size:18px;min-height:44px}.revision-order{width:min(680px,calc(100vw - 24px));max-height:85dvh;overflow:auto;padding:20px}.revision-order h3{margin:18px 0 8px;font-size:14px}.revision-order-table{overflow-x:auto;max-height:240px;overflow-y:auto}.revision-order table{width:100%;border-collapse:collapse;font-size:12px;text-align:left;table-layout:fixed}.revision-order th{position:sticky;top:0;background:#edf3ec;color:#173f37;font-weight:600}.revision-order th,.revision-order td{padding:9px 7px;border-bottom:1px solid #dae3d7;vertical-align:top;overflow-wrap:anywhere}.revision-order th:first-child,.revision-order td:first-child{width:20%;direction:ltr;unicode-bidi:plaintext}.revision-order-help{margin-top:14px;padding:10px;border-radius:8px;background:#f0f4ec;font-size:12px;line-height:1.55}.revision-order-coming{font-size:12px;text-align:center;color:#667465}.revision-order details{margin-top:16px}.revision-order summary{cursor:pointer;font-size:13px}#revision-order-pressure{padding:10px;background:#fff2d8;border-radius:8px;font-size:12px}@media(max-width:520px){.revision-order{padding:14px}.revision-order th,.revision-order td{padding:8px 5px;font-size:11px}.revision-order-table{max-height:190px}}

.revision-upcoming small{display:block;font-size:10px;line-height:1.35;margin-bottom:5px;opacity:.7}.revision-upcoming ol{max-height:clamp(60px,10dvh,130px)}.revision-tomorrow{position:relative;margin-top:12px;padding-top:9px;border-top:1px solid var(--theme-border,#d7e2db)}.revision-upcoming .revision-preview-note{font-size:8px;margin:5px 0 0;opacity:.55}.revision-upcoming.tomorrow-only .revision-tomorrow{margin-top:0;padding-top:0;border-top:0}.revision-upcoming.tomorrow-only ol{max-height:clamp(100px,22dvh,260px)}.revision-upcoming-today[hidden],#revision-upcoming-today[hidden]{display:none}.anki-day-panel .revision-upcoming{margin:24px auto 0;width:90px}.anki-day-panel .revision-upcoming ol{max-height:260px}body.phone-revision-top .revision-upcoming ol{max-height:66px}body.phone-revision-top .revision-upcoming.tomorrow-only ol{max-height:132px}

body.anki-complete .anki-graduation{top:90px;padding:10px 16px;font-size:16px}



.revision-order-future{margin-top:16px;padding:12px;border:1px solid #a9bdad;border-radius:12px}.revision-order-future h3{margin:0 0 6px}.revision-order-future>p{font-size:12px;line-height:1.5;margin:0 0 10px;overflow-wrap:anywhere}

.revision-order-future .revision-order-table{max-height:none;overflow:visible}

#revision-order-backlog-details>summary{margin-bottom:10px}