@import url('https://fonts.googleapis.com/css2?family=Amiri:wght@400;700&family=Cairo:wght@400;600;700;800&display=swap');
:root{--bg:#f4f8f5;--card:#fff;--ink:#123b2f;--muted:#70827a;--p:#0b4a38;--p2:#17644e;--line:#dce8e1;--soft:#eaf2ed;--shadow:0 10px 30px rgba(11,70,53,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Cairo,Arial,sans-serif}body.dark{--bg:#07130f;--card:#10231b;--ink:#eff8f3;--muted:#9db4a9;--line:#254337;--soft:#183027;--shadow:none}
button,input,select{font:inherit}button{cursor:pointer}button:active{transform:scale(.98)}
.topbar{height:72px;background:linear-gradient(135deg,var(--p),var(--p2));color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 16px;position:sticky;top:0;z-index:50;box-shadow:0 4px 18px #0002}.brand{font-size:25px;font-weight:800}.brand small{font-size:10px;opacity:.7;margin-right:5px}.icon-btn{width:46px;height:46px;border:0;border-radius:15px;background:#ffffff18;color:#fff;font-size:23px}
.drawer{position:fixed;top:72px;right:0;width:min(320px,86vw);bottom:0;background:var(--card);z-index:70;transform:translateX(105%);transition:.25s;box-shadow:-12px 0 35px #0003;padding:16px}.drawer.open{transform:none}.drawer-title{font-size:22px;font-weight:800;padding:8px 10px 18px}.drawer button{display:block;width:100%;padding:15px;text-align:right;background:transparent;color:var(--ink);border:0;border-bottom:1px solid var(--line);border-radius:12px}.drawer button:hover{background:var(--soft)}#scrim{position:fixed;inset:72px 0 0;background:#0007;z-index:60;display:none}#scrim.open{display:block}
main{max-width:900px;margin:auto;padding:18px 14px 104px}.page{display:none}.page.active{display:block}.hero{background:linear-gradient(135deg,var(--p),var(--p2));color:#fff;border-radius:28px;padding:28px 24px;display:flex;align-items:center;justify-content:space-between;box-shadow:var(--shadow)}.hero h1{font:700 38px Amiri;margin:4px 0}.hero p{margin:0;opacity:.86}.hero-mark{font:78px Amiri;opacity:.25}.quick-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:14px}.quick-grid button{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:17px;text-align:right;color:var(--ink);box-shadow:var(--shadow)}.quick-grid i{font-style:normal;font-size:28px}.quick-grid b{display:block;font-size:18px;margin-top:5px}.quick-grid small{display:block;color:var(--muted);margin-top:3px}.card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:18px;margin-top:12px;box-shadow:var(--shadow)}.resume-card h3{margin:6px 0 13px}.eyebrow,.status,.muted{color:var(--muted);font-size:13px}.notice p{color:var(--muted);line-height:1.8}.primary{border:0;background:var(--p);color:#fff;border-radius:12px;padding:11px 17px}
.section-head{display:flex;align-items:center;gap:12px;margin:6px 0 15px}.section-head>div{flex:1}.section-head h2{margin:0;font-size:28px}.section-head span{color:var(--muted);font-size:12px}.back{width:46px;height:46px;border:1px solid var(--line);border-radius:15px;background:var(--card);color:var(--ink);font-size:22px}
.q-tools{display:grid;grid-template-columns:1fr 1fr auto auto;gap:8px}.q-tools input,.q-tools select,.q-tools button,.hadith-controls input,.hadith-controls button{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:13px;padding:11px;min-width:0}.q-tools select{grid-column:1/-1;grid-row:2}.q-tools input{grid-column:1/-1}.q-tools button{grid-row:3}.status{margin:9px 2px}.mushaf{background:var(--card);border:1px solid var(--line);border-radius:25px;padding:12px 14px 16px;box-shadow:var(--shadow)}.surah-banner{text-align:center;padding:12px;border-bottom:1px solid var(--line);margin-bottom:10px}.qtitle{font:700 34px Amiri}.qmeta{font-size:12px;color:var(--muted)}.qtext{font:31px/2.25 Amiri;text-align:justify;padding:6px 3px}.ayah{display:inline}.num{display:inline-flex;width:31px;height:31px;border:1px solid var(--p);border-radius:50%;align-items:center;justify-content:center;font:12px Cairo;color:var(--p);margin:0 4px}.q-actions{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:8px;margin-top:15px}.q-actions button{border:0;border-radius:12px;padding:12px;background:var(--p);color:#fff}
.switch{display:flex;gap:8px;margin-bottom:10px}.switch button,.chips button{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:13px;padding:10px 14px;white-space:nowrap}.switch button.active,.chips button.active{background:var(--p);color:#fff}.hadith-controls{display:grid;grid-template-columns:1fr auto auto;gap:8px}.book-count{color:var(--muted);font-size:12px;margin:9px 2px}.hadith{background:var(--card);border:1px solid var(--line);border-radius:19px;padding:18px;margin:10px 0}.hadith h3{margin:0 0 9px}.hadith p{font:24px/2 Amiri;margin:0}.hadith small{color:var(--muted)}
.chips{display:flex;gap:8px;overflow:auto;padding-bottom:4px}.chips::-webkit-scrollbar{height:3px}#azlist article{background:var(--card);border:1px solid var(--line);border-radius:19px;padding:18px;margin:10px 0}.aztext{font:24px/2 Amiri}.repeat{display:inline-block;margin-top:10px;background:var(--soft);padding:5px 9px;border-radius:9px;color:var(--muted);font-size:12px}.fiqhbox{white-space:pre-line;line-height:2;font-size:17px}
.tasbeeh{background:linear-gradient(145deg,var(--p),var(--p2));color:#fff;border-radius:30px;text-align:center;padding:22px}.tasbeeh select{width:100%;padding:13px;border:0;border-radius:14px;background:#fff;color:#173d31}.tasbeeh #counter{font-size:86px;margin:22px 0 0}.tasbeeh #chosen{font:28px Amiri;margin-bottom:16px}.tasbeeh #bead{width:min(72vw,310px);height:min(72vw,310px);border-radius:50%;border:0;background:#f8f5ed;color:#153e32;font-weight:700;box-shadow:inset 0 0 0 10px #0b463510,0 18px 35px #0003}.targets{display:flex;justify-content:center;gap:8px;margin-top:17px}.targets button{border:0;background:#fff;color:#173d31;border-radius:10px;padding:9px 15px}
.settings-card{display:grid;gap:20px}.settings-card label{display:grid;gap:9px}.settings-card input{width:100%}.danger{border:0;background:#9b2d2d;color:#fff;border-radius:12px;padding:12px}
.bottom-nav{position:fixed;bottom:0;left:0;right:0;height:78px;background:var(--card);border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(5,1fr);z-index:55;padding-bottom:env(safe-area-inset-bottom)}.bottom-nav button{border:0;background:transparent;color:var(--muted);font-size:21px}.bottom-nav small{display:block;font-size:10px;margin-top:2px}.bottom-nav button.active{color:var(--p);font-weight:800}
@media(min-width:700px){.quick-grid{grid-template-columns:repeat(4,1fr)}.qtext{font-size:34px}.q-tools{grid-template-columns:1fr 1fr auto auto}.q-tools input{grid-column:1}.q-tools select{grid-column:2;grid-row:1}.q-tools button{grid-row:1}}
@media(max-width:560px){.hero h1{font-size:34px}.hero-mark{font-size:60px}.hadith-controls{grid-template-columns:1fr 1fr}.hadith-controls input{grid-column:1/-1}.qtext{font-size:30px}.quick-grid{grid-template-columns:1fr 1fr}}
