:root{--ink:#153d32;--deep:#0b211a;--leaf:#176145;--gold:#b89450;--sand:#f5efe1;--paper:#fffaf1;--line:#dfd6c0;--muted:#617067;--radius:22px;--shadow:0 0 0 1px rgba(11,33,26,.055),0 8px 20px rgba(11,33,26,.055),0 18px 42px rgba(11,33,26,.055)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{margin:0;padding-bottom:86px;background:linear-gradient(180deg,#edf0e7 0,#f5f0e5 18rem,#f7f3eb 100%);color:var(--deep);font-family:Tajawal,system-ui,sans-serif}
button,input{font:inherit}
.icon{width:1.15em;height:1.15em;display:inline-block;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.screen{width:100%;min-height:100vh;background:rgba(255,250,241,.34)}
.top{height:74px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;background:rgba(255,250,241,.9);border-bottom:1px solid rgba(21,61,50,.1);position:sticky;top:0;z-index:10;backdrop-filter:blur(16px)}
.brand{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none}
.brand-mark{height:43px;width:43px;display:grid;place-items:center;border-radius:14px;background:var(--ink);color:#f4d491;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 5px 14px rgba(11,33,26,.16)}
.brand-mark .icon{width:23px;height:23px;stroke-width:1.7}
.brand strong{font-size:16px;display:block}.brand small{color:var(--muted);font-size:12px}
.menu{height:44px;min-width:44px;display:grid;place-items:center;border-radius:14px;border:1px solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer;transition-property:transform,background-color;transition-duration:150ms;transition-timing-function:ease-out}
.menu:active,.action:active,.chip:active{transform:scale(.96)}
.header-nav{display:none}.mobile-menu{position:fixed;z-index:9;top:68px;left:14px;right:14px;padding:8px;background:rgba(255,250,241,.98);border-radius:18px;box-shadow:var(--shadow);transform:translateY(-8px);opacity:0;pointer-events:none;transition-property:transform,opacity;transition-duration:180ms;transition-timing-function:cubic-bezier(.2,0,0,1)}
.mobile-menu.open{transform:translateY(0);opacity:1;pointer-events:auto}.mobile-menu a{min-height:44px;padding:0 13px;display:flex;align-items:center;gap:9px;border-radius:12px;color:var(--ink);text-decoration:none;font-size:14px;font-weight:700}.mobile-menu a:hover{background:var(--sand)}
main{padding:14px 14px 8px}.intro{padding:9px 3px 18px}.eyebrow{display:inline-flex;align-items:center;gap:6px;color:var(--leaf);font-size:12px;font-weight:800}.intro h1{font-family:Amiri,serif;font-size:29px;line-height:1.2;margin:4px 0 6px;text-wrap:balance}.intro p{color:var(--muted);font-size:14px;line-height:1.8;margin:0;max-width:52ch;text-wrap:pretty}
.today-section{margin:2px 0 24px;padding:18px;border-radius:26px;background:linear-gradient(135deg,#0e3f31,#176145);color:#fff;box-shadow:0 14px 38px rgba(11,33,26,.13);overflow:hidden;position:relative}.today-section:after{content:"";position:absolute;width:280px;height:280px;border-radius:50%;background:rgba(255,255,255,.045);left:-100px;bottom:-190px}.today-heading{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:end;gap:18px;margin-bottom:14px}.today-heading h2{display:flex;align-items:center;gap:8px;margin:0;font-family:Amiri,serif;font-size:26px;text-wrap:balance}.today-heading p{margin:3px 0 0;color:#dbe8df;font-size:13px;text-wrap:pretty}.today-date{font-variant-numeric:tabular-nums;color:#f2dba9;font-size:12px;font-weight:800;white-space:nowrap}.today-list{position:relative;z-index:1;display:grid;gap:10px}.today-card{min-width:0;padding:14px;border-radius:18px;background:rgba(255,250,241,.1);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);display:grid;gap:10px}.today-card-title{margin:0;font-size:17px;line-height:1.35;text-wrap:balance}.today-card-sheikh{margin:3px 0 0;color:#dcece2;font-size:13px}.today-card-meta{display:flex;flex-wrap:wrap;gap:7px}.today-card-meta span{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:9px;background:rgba(255,255,255,.09);font-size:12px}.today-card .action{background:#fffaf1;color:var(--ink);box-shadow:none}.today-card .action:hover{background:#f2e8d3}.today-empty{padding:18px;border-radius:16px;background:rgba(255,255,255,.09);color:#e7efe9;text-align:center;line-height:1.7}
.today-empty{grid-column:1/-1}
.new-badge{display:inline-flex;align-items:center;justify-content:center;min-height:28px;margin-block-end:7px;padding-inline:10px;border-radius:999px;background:#f2dba9;color:var(--deep);font-size:12px;font-weight:800;line-height:1;white-space:nowrap;box-shadow:0 0 0 1px rgba(11,33,26,.08),0 2px 6px rgba(11,33,26,.08)}
.time-left{display:grid;gap:6px}.time-left-head{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#f7e5ba;font-size:12px;font-weight:800;font-variant-numeric:tabular-nums}.time-track{height:7px;border-radius:999px;background:rgba(255,255,255,.15);overflow:hidden;box-shadow:inset 0 1px 2px rgba(0,0,0,.12)}.time-fill{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#f0d89f,#b89450);transition-property:width;transition-duration:500ms;transition-timing-function:cubic-bezier(.2,0,0,1)}
.next{border-radius:var(--radius);background:linear-gradient(135deg,#103e31,#176145);color:#fff;padding:18px;box-shadow:var(--shadow);position:relative;overflow:hidden}.next:after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;background:rgba(255,255,255,.055);left:-66px;bottom:-105px}.next-top{display:flex;align-items:center;justify-content:space-between;gap:12px;position:relative;z-index:1}.tag{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.13);color:#f7dba0;border:1px solid rgba(255,255,255,.17);border-radius:999px;padding:5px 10px;font-size:12px;font-weight:800}.countdown{font-variant-numeric:tabular-nums;color:#ecf1e8;font-size:12px}.next h2{font-family:Amiri,serif;font-size:26px;margin:14px 0 5px;line-height:1.1;position:relative;z-index:1;text-wrap:balance}.next p{margin:0;color:#e4ede5;font-size:14px;position:relative;z-index:1}.next-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px;position:relative;z-index:1}.next-meta span{display:inline-flex;align-items:center;gap:5px;font-size:12px;padding:5px 8px;border-radius:9px;background:rgba(255,255,255,.1)}
.tools{margin:16px 0 14px}.sheikh-browse{margin-top:11px;padding:12px 13px;border:1px solid var(--line);border-radius:16px;background:rgba(255,250,241,.8);display:grid;gap:7px}.sheikh-browse label{color:var(--ink);font-size:13px;font-weight:800}.sheikh-browse select{width:100%;min-height:44px;border:1px solid var(--line);border-radius:12px;background:var(--paper);padding:0 12px;color:var(--deep);font:700 14px Tajawal,sans-serif;outline:none}.sheikh-browse select:focus{border-color:var(--leaf);box-shadow:0 0 0 3px rgba(23,97,69,.12)}.sheikh-browse small{color:var(--muted);font-size:11px;line-height:1.5}.search{height:52px;position:relative;display:block}.search input{display:block;width:100%;height:100%;border:1px solid var(--line);border-radius:16px;background:var(--paper);padding:0 46px 0 16px;font-weight:700;font-size:14px;color:var(--deep);outline:none;box-shadow:0 3px 10px rgba(11,33,26,.04);transition-property:border-color,box-shadow;transition-duration:150ms}.search input:focus{border-color:var(--leaf);box-shadow:0 0 0 3px rgba(23,97,69,.12)}.search>.icon{position:absolute;right:16px;top:16px;color:var(--leaf)}.chips{display:flex;gap:8px;overflow:auto;padding:12px 1px 3px;scrollbar-width:none}.chips::-webkit-scrollbar{display:none}.chip{white-space:nowrap;min-height:40px;border:1px solid var(--line);border-radius:999px;padding:0 14px;background:rgba(255,250,241,.7);color:var(--ink);font-weight:700;font-size:13px;cursor:pointer;transition-property:transform,background-color,color,border-color;transition-duration:150ms}.chip.active{background:var(--ink);border-color:var(--ink);color:#fff}
.section-head{display:flex;justify-content:space-between;align-items:end;margin:19px 3px 11px}.section-head h2{display:flex;align-items:center;gap:7px;font-size:18px;margin:0;text-wrap:balance}.section-head h2 .icon{color:var(--gold)}.section-head span{font-variant-numeric:tabular-nums;color:var(--muted);font-size:12px}
.list{display:grid;gap:10px}.lesson{background:var(--paper);border-radius:20px;padding:15px;box-shadow:var(--shadow);position:relative;overflow:hidden}.lesson:before{content:"";position:absolute;right:0;top:16px;bottom:16px;width:4px;border-radius:5px;background:var(--gold)}.lesson-main{padding-right:9px}.lesson-title{font-size:19px;line-height:1.35;margin:0 0 4px;font-weight:800;text-wrap:balance}.sheikh{margin:0;color:var(--leaf);font-size:14px;font-weight:700;display:flex;align-items:center;gap:6px}.details{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:14px 0}.detail{min-height:54px;padding:7px 8px;background:var(--sand);border-radius:12px;display:grid;grid-template-columns:auto 1fr;align-content:center;column-gap:6px}.detail .icon{grid-row:1/3;color:var(--gold);margin-top:4px}.detail small{color:#847860;font-size:11px;font-weight:700}.detail span{font-size:12px;line-height:1.35;font-weight:700;text-wrap:pretty}.lesson-foot{display:flex;gap:8px}.action{display:inline-flex;min-height:44px;align-items:center;justify-content:center;gap:7px;border-radius:13px;border:0;padding:0 13px;background:var(--ink);color:#fff;text-decoration:none;font-weight:800;font-size:13px;cursor:pointer;transition-property:transform,background-color,box-shadow;transition-duration:150ms;transition-timing-function:ease-out}.action:hover{background:#1b523f}.action.secondary{background:transparent;color:var(--leaf);box-shadow:inset 0 0 0 1px #bfcbbd;flex:1}.action.secondary:hover{background:#f3f4e9}.action.primary{flex:1}.empty{padding:28px 16px;text-align:center;border:1px dashed #c8c4b0;border-radius:18px;color:var(--muted);background:rgba(255,250,241,.6);line-height:1.8}.load-more{width:100%;margin-top:2px;background:transparent;color:var(--leaf);box-shadow:inset 0 0 0 1px #bfcbbd}.desktop-note{margin-top:18px;padding:15px;border-radius:18px;background:#e8ece2;color:#53635a;font-size:13px;line-height:1.75;text-wrap:pretty}.desktop-note strong{display:flex;align-items:center;gap:6px;color:var(--ink);margin-bottom:3px}
.hadith-section{margin:24px 0 8px}.hadith-card{position:relative;overflow:hidden;padding:22px;border-radius:24px;background:var(--paper);box-shadow:var(--shadow);border-inline-start:4px solid var(--gold)}.hadith-card:after{content:"۞";position:absolute;inset-inline-end:18px;inset-block-start:8px;color:rgba(184,148,80,.13);font-family:Amiri,serif;font-size:72px;line-height:1}.hadith-kicker{display:inline-flex;align-items:center;gap:7px;color:var(--leaf);font-size:12px;font-weight:800}.hadith-text{position:relative;z-index:1;margin:10px 0 8px;max-width:70ch;font-family:Amiri,serif;font-size:21px;line-height:1.9;text-wrap:pretty}.hadith-source{color:var(--muted);font-size:13px;font-weight:700}.hadith-refresh{margin-top:14px;background:transparent;color:var(--leaf);box-shadow:inset 0 0 0 1px #bfcbbd}
.calendar-reminder-section{margin:18px 0 14px;display:grid;gap:12px}.calendar-download-panel,.reminder-interest-panel{position:relative;overflow:hidden;border-radius:24px;box-shadow:var(--shadow)}.calendar-download-panel{padding:22px;background:linear-gradient(135deg,#0b2e24,#176145);color:#fff}.calendar-download-panel:after{content:"";position:absolute;width:210px;height:210px;border:1px solid rgba(255,255,255,.1);border-radius:50%;inset-inline-end:-76px;inset-block-end:-122px;box-shadow:0 0 0 22px rgba(255,255,255,.025),0 0 0 44px rgba(255,255,255,.018)}.calendar-download-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:15px;background:rgba(255,250,241,.12);color:#f2dba9;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}.calendar-download-icon .icon{width:25px;height:25px}.calendar-download-panel h2,.reminder-interest-panel h2{font-family:Amiri,serif;font-size:25px;line-height:1.35;margin:14px 0 5px;text-wrap:balance}.calendar-download-panel p{position:relative;z-index:1;margin:0 0 16px;color:#dcece2;font-size:14px;line-height:1.8;max-width:56ch;text-wrap:pretty}.calendar-download-panel .action{position:relative;z-index:1;width:100%;background:#fffaf1;color:var(--ink);box-shadow:none}.calendar-download-panel .action:hover{background:#f2e8d3}.calendar-promise{position:relative;z-index:1;display:flex;align-items:center;gap:6px;margin-top:11px;color:#f2dba9;font-size:12px;font-weight:800}.reminder-interest-panel{padding:22px;background:var(--paper);border:1px solid rgba(21,61,50,.08)}.reminder-interest-kicker{display:inline-flex;align-items:center;gap:6px;color:var(--leaf);font-size:12px;font-weight:800}.reminder-interest-panel h2{margin-top:7px}.reminder-interest-panel>p{margin:0 0 15px;color:var(--muted);font-size:14px;line-height:1.8;text-wrap:pretty}.reminder-interest-grid{display:grid;gap:10px}.reminder-field{display:grid;gap:6px}.reminder-field span{color:var(--ink);font-size:12px;font-weight:800}.reminder-field input{width:100%;height:48px;border:1px solid var(--line);border-radius:13px;background:#fffdf7;padding:0 13px;color:var(--deep);outline:none;transition-property:border-color,box-shadow;transition-duration:150ms}.reminder-field input:focus{border-color:var(--leaf);box-shadow:0 0 0 3px rgba(23,97,69,.12)}.reminder-interest-form .action{width:100%;margin-top:11px}.reminder-privacy{display:block;margin-top:9px;color:#7a806f;font-size:11px;line-height:1.6}.reminder-status{min-height:20px;margin-top:8px;font-size:12px;font-weight:800}.reminder-status.success{color:var(--leaf)}.reminder-status.error{color:#9d3e31}
.bottom{position:fixed;z-index:8;bottom:0;left:50%;transform:translateX(-50%);width:min(720px,100%);background:rgba(255,250,241,.96);border-top:1px solid rgba(21,61,50,.12);padding:8px max(14px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(4,1fr);backdrop-filter:blur(15px)}.bottom a{min-height:52px;display:grid;place-content:center;gap:3px;text-align:center;color:#617067;text-decoration:none;font-size:11px;font-weight:700}.bottom a .icon{width:19px;height:19px;margin:auto}.bottom a.active{color:var(--leaf)}
:focus-visible{outline:3px solid rgba(184,148,80,.55);outline-offset:3px}
@media(min-width:640px){body{padding:0}.lesson{padding:18px}.details{grid-template-columns:repeat(4,1fr)}.today-list{grid-template-columns:repeat(2,minmax(0,1fr))}.reminder-interest-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.bottom{display:none}}
@media(min-width:900px){body{padding:0 0 40px}.top{height:82px;padding-right:max(30px,calc((100vw - 1320px)/2));padding-left:max(30px,calc((100vw - 1320px)/2));background:#fffaf1;backdrop-filter:none}.menu,.mobile-menu{display:none}.header-nav{display:flex;align-items:center;gap:4px}.header-nav a{min-height:42px;padding:0 14px;display:inline-flex;align-items:center;gap:7px;border-radius:12px;color:var(--ink);text-decoration:none;font-size:13px;font-weight:700;transition-property:background-color,color;transition-duration:150ms}.header-nav a:hover{background:var(--sand);color:var(--leaf)}main{width:min(1320px,100%);margin:auto;padding:30px}.today-section{padding:22px}.today-list{grid-template-columns:repeat(3,minmax(0,1fr))}.page-layout{display:grid;grid-template-columns:360px minmax(0,1fr);gap:30px;align-items:start}.sidebar{position:sticky;top:108px}.intro{padding-top:0}.intro h1{font-size:36px}.tools{margin-bottom:0}.content .section-head{margin-top:3px}.details{grid-template-columns:1fr 1fr}.lesson-foot{margin-top:2px}.calendar-reminder-section{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:16px}.calendar-download-panel,.reminder-interest-panel{padding:28px}}
@media(min-width:1180px){.list{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.load-more{grid-column:1/-1}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}