@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#f4f7f3;--card:#fff;--ink:#102b24;--muted:#728078;--green:#0c4738;--green2:#17664f;--gold:#d5b56d;--line:#e3eae4;--soft:#eaf2ec;--shadow:0 14px 40px rgba(16,43,36,.07)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',system-ui,sans-serif;-webkit-font-smoothing:antialiased}.app-shell{max-width:760px;margin:auto;min-height:100vh;padding:0 18px 20px}.topbar{display:flex;align-items:center;gap:12px;padding:19px 0 17px}.brand-mark,.footer-mark{width:43px;height:43px;border-radius:15px;background:var(--green);color:var(--gold);display:grid;place-items:center;font-size:26px;font-family:serif;box-shadow:0 6px 15px #0c473826}.brand-name{font:800 13px Manrope,sans-serif;letter-spacing:2px}.brand-sub{font-size:11px;color:var(--muted);margin-top:3px}.icon-btn{margin-left:auto;border:1px solid var(--line);background:var(--card);color:var(--green);border-radius:13px;width:41px;height:41px;font-size:21px}
.hero{position:relative;overflow:hidden;background:linear-gradient(130deg,#092b23,#105541 70%,#1a6249);color:#fff;border-radius:27px;padding:27px 22px 23px;box-shadow:0 18px 35px #0c473826}.hero:after{content:"۞";position:absolute;right:-14px;top:15px;font-size:130px;line-height:1;color:#ffffff09;pointer-events:none}.hero-label,.eyebrow{font-size:10px;font-weight:800;letter-spacing:1.8px}.hero-label{color:#e4cf97;display:flex;align-items:center;gap:8px}.pulse{width:6px;height:6px;background:#d9bd77;border-radius:50%;box-shadow:0 0 0 5px #d9bd771a}.hero h1{font:800 clamp(27px,7vw,38px)/1.17 Manrope,sans-serif;letter-spacing:-1.4px;margin:21px 0 9px}.hero h1 em{font-style:normal;color:#e2c77f}.hero p{color:#d1e0d8;font-size:13px;margin:0 0 22px}.search-wrap{display:flex;align-items:center;gap:9px;background:#fff;border-radius:15px;padding:0 13px;min-height:53px;position:relative;z-index:1}.search-icon{font-size:25px;color:var(--green)}.search-wrap input{border:0;outline:0;min-width:0;flex:1;font:500 14px 'DM Sans',sans-serif;color:var(--ink);background:transparent}.search-wrap input::placeholder{color:#8a978f}.clear-btn{border:0;background:var(--soft);color:var(--green);width:26px;height:26px;border-radius:50%;font-size:20px}.search-hint{position:relative;z-index:1;color:#c6d8ce;font-size:10px;margin:10px 3px 0}
.quick-nav{display:flex;justify-content:space-between;gap:5px;padding:12px 0 20px}.quick{flex:1;border:0;background:transparent;color:#819087;display:flex;align-items:center;flex-direction:column;gap:5px;padding:7px 2px;border-radius:13px}.quick span{font-size:21px}.quick small{font-size:10px;font-weight:600}.quick.active{background:#e4eee6;color:var(--green)}.view{animation:fade .22s ease}@keyframes fade{from{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:none}}.section-head{display:flex;align-items:center;justify-content:space-between;margin:3px 1px 13px}.eyebrow{color:#829087;font-size:9px}.section-head h2{font:800 22px Manrope,sans-serif;letter-spacing:-.7px;margin:5px 0 0}.round-symbol{width:37px;height:37px;display:grid;place-items:center;border-radius:13px;background:#e7eee7;color:#b39855;font-size:18px}.daily-card{border:1px solid #e2e9df;background:linear-gradient(145deg,#fff,#f7faf5);border-radius:22px;padding:20px;box-shadow:var(--shadow)}.daily-top{display:flex;align-items:center;justify-content:space-between;color:#8a9b8d;font-size:10px;font-weight:700;letter-spacing:.7px}.daily-badge{background:#e8f1e9;color:var(--green);padding:7px 10px;border-radius:20px}.arabic{font-family:'Noto Naskh Arabic','Amiri',serif;font-size:25px;line-height:1.9;text-align:right;direction:rtl;color:#174d3d;margin:18px 0}.hadith-text{font-size:14px;line-height:1.85;white-space:pre-wrap}.source{font-size:11px;color:#829087;margin-top:13px}.actions{display:flex;gap:8px;margin-top:17px;flex-wrap:wrap}.action-btn{border:1px solid var(--line);background:#fff;color:#496257;padding:9px 12px;border-radius:11px;font-size:11px;font-weight:700}.action-btn.saved{background:#e6f2e8;color:#17664f;border-color:#cce0d0}.mt{margin-top:28px}.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.feature{position:relative;text-align:left;min-height:140px;border:1px solid var(--line);background:var(--card);border-radius:19px;padding:16px;display:flex;align-items:flex-start;flex-direction:column;box-shadow:0 4px 15px #102b2405;color:var(--ink)}.feature-search{background:#e7f0e8;border-color:#dce9dc}.feature-icon{display:grid;place-items:center;width:34px;height:34px;background:#fff;border-radius:11px;color:var(--green);font-size:20px;margin-bottom:13px}.feature b{font-size:13px}.feature small{font-size:10px;color:var(--muted);margin-top:6px;line-height:1.5}.feature-arrow{position:absolute;right:14px;top:15px;color:#8ca093}.note{display:flex;gap:12px;margin:19px 0 10px;padding:15px;background:#f0ede3;border:1px solid #e9e3d1;border-radius:17px;color:#746644}.note>span{font-size:20px}.note b{font-size:12px}.note p{font-size:11px;line-height:1.7;margin:5px 0 0;color:#82785e}.section-desc{font-size:12px;color:var(--muted);line-height:1.7;margin:-2px 0 15px}.chapter-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}.chapter{display:flex;gap:11px;align-items:center;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:17px;padding:15px 12px;color:var(--ink);min-height:82px}.chapter-number{display:grid;place-items:center;flex:0 0 37px;height:37px;background:#e8f1e9;color:var(--green);border-radius:12px;font-size:14px;font-weight:800}.chapter b{font-size:12px;line-height:1.5}.chapter small{display:block;color:var(--muted);font-size:10px;margin-top:4px}.cards-list{display:flex;flex-direction:column;gap:12px}.hadith-card,.content-card{background:var(--card);border:1px solid var(--line);border-radius:19px;padding:17px;box-shadow:0 5px 18px #102b2405}.card-meta{display:flex;align-items:center;justify-content:space-between;color:#87948b;font-size:10px}.card-title{font-size:12px;font-weight:800;color:var(--green)}.hadith-card .arabic{font-size:23px;margin:10px 0}.hadith-card .hadith-text{font-size:13px}.count-pill{background:#e5eee6;color:var(--green);border-radius:30px;padding:7px 10px;font-size:11px;font-weight:800}.back-btn{border:0;background:transparent;color:var(--green);font-weight:700;padding:7px 0 17px}.detail-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:20px}.detail-card .arabic{font-size:28px}.detail-card .hadith-text{font-size:15px}.empty{padding:30px 18px;text-align:center;background:#fff;border:1px dashed #d7e1d8;border-radius:18px;color:var(--muted);font-size:13px;line-height:1.8}.empty b{display:block;color:var(--ink);font-size:15px;margin-bottom:5px}.skeleton{height:135px;border-radius:12px;background:linear-gradient(90deg,#eef2ec,#f8faf7,#eef2ec);background-size:200% 100%;animation:shimmer 1.5s infinite}@keyframes shimmer{to{background-position:-200% 0}}footer{display:flex;align-items:center;gap:10px;padding:28px 2px 12px;color:var(--green);font-size:12px}footer .footer-mark{width:30px;height:30px;font-size:18px;border-radius:10px}footer span{margin-left:auto;color:var(--muted);font-size:10px}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%,20px);background:#102b24;color:#fff;border-radius:12px;padding:12px 17px;font-size:12px;opacity:0;pointer-events:none;transition:.2s;z-index:20;max-width:90%;text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}[hidden]{display:none!important}
body.dark{--bg:#0b1713;--card:#13231c;--ink:#e8f1e9;--muted:#9eafa3;--line:#263a2f;--soft:#1b3328;--shadow:0 14px 40px #0003}body.dark .daily-card{background:#13231c;border-color:var(--line)}body.dark .feature-search,body.dark .quick.active{background:#1b3328;border-color:#2c4b3a}body.dark .chapter-number,body.dark .round-symbol,body.dark .count-pill{background:#1b3328;color:#d7c17f}body.dark .search-wrap,body.dark .action-btn,body.dark .detail-card{background:#13231c;color:var(--ink)}body.dark .search-wrap input{color:var(--ink)}body.dark .hadith-card,body.dark .content-card,body.dark .chapter,body.dark .empty{background:var(--card)}body.dark .arabic{color:#b7d9c5}body.dark .note{background:#29271e;border-color:#403b2a}body.dark .note p{color:#c3b991}
@media(min-width:600px){.app-shell{padding:0 28px 25px}.hero{padding:32px 30px}.feature-grid{grid-template-columns:repeat(4,1fr)}.feature{min-height:155px}.chapter-list{grid-template-columns:repeat(3,1fr)}}