:root{
  --deep:#092b2e;
  --deep2:#0e3a3d;
  --gold:#f3cf69;
  --cream:#fff6dc;
  --ink:#173438;
  --soft:#f9edc8;
  --green:#9fe3b0;
  --rose:#ffd0c9;
  --blue:#c7e8ff;
  --lav:#ead7ff;
  --shadow:0 18px 45px rgba(0,0,0,.28);
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:
    radial-gradient(circle at top left, rgba(243,207,105,.18), transparent 32%),
    linear-gradient(135deg,#061d20,#0d373b 50%,#0b2427);
  color:var(--cream);
  min-height:100vh;
  overflow-x:hidden;
}
.bg-glow{position:fixed;border-radius:999px;filter:blur(35px);pointer-events:none;opacity:.32;z-index:-1}.bg-one{width:360px;height:360px;background:#f3cf69;top:-80px;right:-80px}.bg-two{width:300px;height:300px;background:#63d6b6;bottom:-80px;left:-70px}
.site-header{max-width:1240px;margin:auto;padding:28px 22px 10px;display:flex;justify-content:space-between;gap:18px;align-items:center}.brand{display:flex;gap:14px;align-items:center}.brand-mark{width:62px;height:62px;border-radius:22px;background:linear-gradient(145deg,#f8dc82,#c9992a);display:grid;place-items:center;font-size:30px;box-shadow:var(--shadow)}h1{margin:0;font-size:clamp(28px,4vw,48px);line-height:1}.brand p{margin:8px 0 0;color:#e9ddbd}.header-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;align-items:center}.main-btn,.pill-btn{border:0;border-radius:999px;padding:13px 18px;font-weight:900;cursor:pointer;transition:.2s transform,.2s opacity}.main-btn{background:linear-gradient(135deg,#ffe28a,#f1bd39);color:#102b2e;box-shadow:0 12px 25px rgba(0,0,0,.25)}.pill-btn{background:rgba(255,255,255,.12);color:var(--cream);border:1px solid rgba(255,255,255,.18)}.main-btn:hover,.pill-btn:hover{transform:translateY(-2px)}
.lang-switch{display:flex;gap:5px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.18);padding:5px;border-radius:999px}
.lang-btn{border:0;border-radius:999px;padding:9px 13px;font-weight:900;cursor:pointer;background:transparent;color:var(--cream)}
.lang-btn.active{background:var(--gold);color:#112f32}
html[dir="rtl"] body{font-family:Tahoma,Arial,"Segoe UI",sans-serif;text-align:right}
html[dir="rtl"] .brand{flex-direction:row-reverse}
html[dir="rtl"] .site-header{direction:rtl}
html[dir="rtl"] .header-actions{justify-content:flex-start}
html[dir="rtl"] .hero{direction:rtl}
html[dir="rtl"] .filters{direction:rtl}
html[dir="rtl"] .wall-top-strip{direction:rtl}
html[dir="rtl"] .modal-panel{direction:rtl;text-align:right}
html[dir="rtl"] .close-btn{right:auto;left:14px}
html[dir="rtl"] .modal h2{margin:0 0 8px 45px}
html[dir="rtl"] .modal-note{border-left:0;border-right:5px solid #d09b2f}
html[dir="rtl"] .detail-title h2{margin:0 0 0 45px}
html[dir="rtl"] input,html[dir="rtl"] textarea,html[dir="rtl"] select{direction:rtl;text-align:right}
.full{width:100%;margin-top:12px}.hero{max-width:1240px;margin:0 auto 16px;padding:12px 22px;display:grid;grid-template-columns:1.2fr .8fr;gap:16px;align-items:stretch}.hero-card{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);border-radius:28px;padding:24px;box-shadow:var(--shadow);backdrop-filter:blur(8px)}.arabic-line{font-size:24px;color:var(--gold);font-weight:800;margin-bottom:8px}.hero-card h2{margin:0 0 8px;font-size:34px}.hero-card p{margin:0;line-height:1.7;color:#eee3c5}.filters{display:flex;gap:9px;flex-wrap:wrap;align-content:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.13);border-radius:28px;padding:18px}.filter-btn{border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.1);color:var(--cream);border-radius:999px;padding:10px 13px;font-weight:800;cursor:pointer}.filter-btn.active{background:var(--gold);color:#112f32}.wall-wrap{max-width:1240px;margin:0 auto 30px;padding:0 22px}.wall-top-strip{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:12px 18px;border-radius:22px 22px 0 0;background:rgba(0,0,0,.20);border:1px solid rgba(255,255,255,.12);border-bottom:0}.wall-top-strip span{font-weight:900}.wall-top-strip small{color:#dacfac}.dua-wall{position:relative;min-height:630px;border-radius:0 0 28px 28px;border:1px solid rgba(255,255,255,.14);overflow:visible;background:
  radial-gradient(circle at 20px 20px, rgba(0,0,0,.09) 2px, transparent 3px) 0 0/34px 34px,
  linear-gradient(135deg, rgba(167,102,46,.58), rgba(120,74,38,.6)),
  #8a572f;
box-shadow:var(--shadow)}.dua-wall:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.05),transparent 18%,transparent 82%,rgba(0,0,0,.12));pointer-events:none}.sticky{position:absolute;width:235px;min-height:190px;padding:38px 18px 16px;color:var(--ink);border-radius:5px 5px 18px 5px;box-shadow:0 12px 24px rgba(0,0,0,.24);cursor:grab;user-select:none;transition:.18s transform,.18s box-shadow;transform:rotate(var(--rot));overflow:hidden;background:linear-gradient(145deg,#fff6d3,#e8d397)}.sticky:active{cursor:grabbing}.sticky{opacity:1}.sticky:hover{box-shadow:0 20px 35px rgba(0,0,0,.32);z-index:20!important}.sticky:before{content:"";position:absolute;top:12px;left:50%;width:70px;height:20px;transform:translateX(-50%) rotate(-2deg);background:rgba(255,255,255,.38);border:1px solid rgba(255,255,255,.35);box-shadow:0 2px 5px rgba(0,0,0,.12)}.sticky h3{font-size:18px;line-height:1.15;margin:0 0 10px}.sticky p{font-size:14px;line-height:1.35;margin:0 0 12px;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}.sticky-meta{display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:12px;font-weight:900}.cat{background:rgba(255,255,255,.42);padding:5px 8px;border-radius:999px}.ameen{white-space:nowrap}.answered-ribbon{position:absolute;right:-38px;top:18px;transform:rotate(38deg);background:#1c8b55;color:#fff;padding:5px 38px;font-size:12px;font-weight:900}.note-Healing{background:linear-gradient(145deg,#fff1a9,#f7d869)}.note-Guidance{background:linear-gradient(145deg,#c8f2ce,#93dba8)}.note-Family{background:linear-gradient(145deg,#ffd9d4,#ffaaa1)}.note-Forgiveness{background:linear-gradient(145deg,#e9ddff,#c9aeff)}.note-Hardship{background:linear-gradient(145deg,#d7efff,#a7d8f4)}.note-Ummah{background:linear-gradient(145deg,#fff0c7,#f0bd65)}.note-Answered{background:linear-gradient(145deg,#d5ffe1,#8ed99e)}.note-Provision{background:linear-gradient(145deg,#fff4bf,#eecb72)}.note-Student{background:linear-gradient(145deg,#d9f4ff,#aee4f5)}.note-General{background:linear-gradient(145deg,#fff6d3,#e8d397)}
.modal{position:fixed;inset:0;background:rgba(1,13,15,.72);display:none;place-items:center;padding:18px;z-index:100}.modal.open{display:grid}.modal-panel{position:relative;background:linear-gradient(145deg,#fff8e5,#f1dfb9);color:#173438;border-radius:28px;box-shadow:0 25px 70px rgba(0,0,0,.45);padding:24px;max-height:92vh;overflow:auto}.compact{width:min(560px,100%)}.wide{width:min(850px,100%)}.close-btn{position:absolute;top:12px;right:14px;border:0;background:#173438;color:#fff;width:36px;height:36px;border-radius:50%;font-size:24px;cursor:pointer}.modal h2{margin:0 45px 8px 0;font-size:30px}.modal-note{background:rgba(23,52,56,.08);border-left:5px solid #d09b2f;padding:12px;border-radius:12px;line-height:1.5}label{font-weight:900;margin:12px 0 6px;display:block}input,textarea,select{width:100%;border:1px solid rgba(23,52,56,.18);border-radius:14px;padding:13px;font:inherit;background:#fffdf6;color:#173438}textarea{min-height:130px;resize:vertical}.status{margin-top:12px;font-weight:800}.detail-title{display:flex;gap:10px;align-items:flex-start;justify-content:space-between}.detail-title h2{margin:0 45px 0 0}.detail-text{font-size:18px;line-height:1.7;background:#fffaf0;border-radius:18px;padding:16px;margin:15px 0}.detail-actions{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}.ameen-btn{border:0;background:linear-gradient(135deg,#173438,#24666c);color:#fff;border-radius:999px;padding:13px 18px;font-weight:900;cursor:pointer}.response-list{display:grid;gap:10px;margin-top:12px}.response{background:rgba(23,52,56,.08);border-radius:15px;padding:12px;line-height:1.5}.tiny{font-size:12px;opacity:.72;margin-top:6px}.empty{position:absolute;inset:0;display:grid;place-items:center;text-align:center;color:#fff6dc;font-weight:800;padding:40px}footer{text-align:center;color:#ddcfaa;padding:10px 20px 34px}
@media (max-width:850px){.site-header,.hero{grid-template-columns:1fr;display:grid}.site-header{align-items:start}.header-actions{justify-content:start}.hero{padding-top:6px}.dua-wall{min-height:auto;overflow:visible;background:#8a572f;padding:16px;display:grid;gap:16px}.sticky{position:relative!important;left:auto!important;top:auto!important;width:100%;min-height:unset;transform:none!important}.wall-top-strip{display:block}.wall-top-strip small{display:block;margin-top:4px}.brand-mark{width:52px;height:52px}.arabic-line{font-size:21px}}