@font-face{font-family:Amiri Quran;src:url(/fonts/AmiriQuran.ttf) format("truetype");font-display:swap}@font-face{font-family:Amiri;src:url(/fonts/Amiri-Regular.ttf) format("truetype");font-weight:400;font-display:swap}@font-face{font-family:Amiri;src:url(/fonts/Amiri-Bold.ttf) format("truetype");font-weight:700;font-display:swap}@font-face{font-family:MT Typesetting;src:local("Arabic Typesetting"),local("ArabicTypesetting");size-adjust:128%;font-weight:400}@font-face{font-family:MT Typesetting;src:local("Arabic Typesetting Bold"),local("ArabicTypesetting-Bold"),local("Arabic Typesetting");size-adjust:128%;font-weight:700}:root{--ink:#1d1b2f;--muted:#5f5b78;--paper:#fffaf2;--card:#ffffff;--line:#ece4d6;--teal:#0f8b7d;--teal-soft:#e3f6f2;--amber:#e08a00;--amber-soft:#fff1d6;--indigo:#4f46e5;--indigo-soft:#ecebff;--rose:#e2366b;--rose-soft:#ffe5ee;--sky:#0284c7;--sky-soft:#e0f2fe;--violet:#8b3fd9;--violet-soft:#f3e8ff;--green:#2f9e44;--quran:"MT Typesetting","Amiri Quran","Scheherazade New","Amiri",serif;--arabic:"MT Typesetting","Amiri","Noto Naskh Arabic",serif;--sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--radius:18px;--shadow:0 10px 30px -12px rgba(48,30,90,0.25)}*{box-sizing:border-box}body,html{margin:0;padding:0}body{font-family:var(--sans);color:var(--ink);background:radial-gradient(1200px 500px at 110% -10%,#ffe1ec 0,transparent 60%),radial-gradient(900px 500px at -10% 0,#dff7f1 0,transparent 55%),var(--paper);min-height:100vh;line-height:1.55}a{color:var(--indigo);text-decoration:none}a:hover{text-decoration:underline}button{font-family:inherit}.ar{font-family:var(--arabic)}.ar,.q{direction:rtl}.q{font-family:var(--quran)}.topbar{position:-webkit-sticky;position:sticky;top:0;z-index:30;background:linear-gradient(90deg,#0f8b7d,#4f46e5 55%,#e2366b);color:#fff;box-shadow:0 6px 20px -10px rgba(79,70,229,.6)}.topbar-inner{max-width:1200px;margin:0 auto;padding:10px 18px;display:flex;align-items:center;gap:16px}.brand{display:flex;align-items:baseline;gap:10px;color:#fff;font-weight:800;font-size:20px;letter-spacing:.2px}.brand:hover{text-decoration:none}.brand .ar{font-size:24px;font-weight:700;opacity:.95}.nav{margin-left:auto;display:flex;gap:6px;align-items:center;flex-wrap:wrap}.nav a,.nav button{color:#fff;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);padding:6px 12px;border-radius:999px;font-size:14px;cursor:pointer}.nav a:hover,.nav button:hover{background:rgba(255,255,255,.26);text-decoration:none}.wrap{max-width:1200px;margin:0 auto;padding:22px 18px 80px}.hero{display:grid;grid-template-columns:1.2fr 1fr;grid-gap:24px;gap:24px;align-items:center;margin:10px 0 28px}.hero h1{font-size:40px;line-height:1.12;margin:0 0 10px;letter-spacing:-.5px}.hero h1 .grad{background:linear-gradient(90deg,var(--teal),var(--indigo),var(--rose));-webkit-background-clip:text;background-clip:text;color:transparent}.hero p{color:var(--muted);font-size:17px;margin:0 0 16px}.hero-card{background:var(--card);border-radius:24px;padding:22px;box-shadow:var(--shadow);border:1px solid var(--line);text-align:center}.hero-card .q{font-size:34px;line-height:2}.hero-card .tapme{display:inline-block;border-bottom:3px solid var(--rose);background:var(--rose-soft);border-radius:8px;padding:0 6px}.hero-card small{color:var(--muted);display:block;margin-top:6px}.cta{gap:10px;flex-wrap:wrap}.btn,.cta{display:inline-flex}.btn{align-items:center;gap:8px;border:0;cursor:pointer;padding:10px 18px;border-radius:999px;font-weight:700;font-size:15px;background:linear-gradient(90deg,var(--teal),var(--indigo));color:#fff;box-shadow:var(--shadow)}.btn:hover{text-decoration:none;filter:brightness(1.05)}.btn.alt{background:#fff;color:var(--indigo);border:2px solid var(--indigo-soft);box-shadow:none}.btn.small{padding:6px 12px;font-size:13px}.btn:disabled{opacity:.55;cursor:default}.stats{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}.stat{background:#fff;border:1px solid var(--line);border-radius:14px;padding:8px 12px;font-size:13px;color:var(--muted)}.stat b{color:var(--ink);font-size:16px;display:block}.section-title{display:flex;align-items:baseline;gap:10px;margin:26px 0 12px}.section-title h2{margin:0;font-size:22px}.search{margin-left:auto;padding:8px 14px;border-radius:999px;border:2px solid var(--line);min-width:220px;font-size:14px;background:#fff}.suras{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));grid-gap:12px;gap:12px}.sura-card{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;background:#fff;border:1px solid var(--line);color:var(--ink);transition:transform .12s,box-shadow .12s}.sura-card:hover{transform:translateY(-2px);box-shadow:var(--shadow);text-decoration:none}.sura-num{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;font-weight:800;color:#fff;flex:0 0 auto}.sura-card .names{flex:1 1;min-width:0}.sura-card .tl{font-weight:700;font-size:14px}.sura-card .meta{font-size:12px;color:var(--muted)}.sura-card .ar{font-size:22px}.reader-head{border-radius:24px;padding:18px 22px;color:#fff;margin-bottom:16px;display:flex;align-items:center;gap:16px;background:linear-gradient(120deg,#0f8b7d,#4f46e5 60%,#8b3fd9);box-shadow:var(--shadow)}.reader-head h1{margin:0;font-size:24px}.reader-head .ar{font-size:38px;margin-left:auto}.reader-head .sub{opacity:.9;font-size:14px}.reader-nav{display:flex;gap:8px;margin:0 0 14px;flex-wrap:wrap;align-items:center}.reader-nav .hint{color:var(--muted);font-size:13px;margin-left:auto}.legend{display:inline-flex;gap:10px;font-size:12px;color:var(--muted);align-items:center}.legend i{display:inline-block;width:18px;height:4px;border-radius:4px;vertical-align:middle;margin-right:4px}.layout{display:grid;grid-template-columns:minmax(0,1fr) 460px;grid-gap:18px;gap:18px;align-items:start}.layout.nopanel{grid-template-columns:minmax(0,1fr)}.mushaf{background:#fff;border-radius:24px;padding:18px 22px;border:1px solid var(--line);box-shadow:0 6px 20px -14px rgba(0,0,0,.25)}.bismillah{text-align:center;font-size:30px;margin:4px 0 14px;color:var(--teal)}.verses{direction:rtl;text-align:justify;font-family:var(--quran);font-size:31px;line-height:2.35}.verse{display:inline;padding:2px 0;border-radius:10px}.verse.active{background:linear-gradient(90deg,rgba(226,54,107,.07),rgba(79,70,229,.07))}.word{scroll-margin-top:110px;cursor:pointer;border-radius:8px;padding:0 2px;transition:background .12s;border-bottom:3px solid transparent;-webkit-tap-highlight-color:transparent}.word.ADJ,.word.N,.word.PN{border-bottom-color:rgba(15,139,125,.35)}.word.V{border-bottom-color:rgba(226,54,107,.4)}.word.DEM,.word.P,.word.PRON,.word.REL{border-bottom-color:rgba(95,91,120,.18)}.word:hover{background:var(--indigo-soft)}.word.sel{background:var(--amber-soft);border-bottom-color:var(--amber)}.word.saved{box-shadow:inset 0 -6px 0 rgba(139,63,217,.18)}.aya-num{display:inline-grid;place-items:center;font-family:var(--arabic);font-size:17px;color:var(--teal);min-width:34px;height:34px;margin:0 4px;border-radius:50%;border:2px solid var(--teal-soft);background:#f6fffd;vertical-align:middle;line-height:1}.panel{position:-webkit-sticky;position:sticky;top:74px;max-height:calc(100vh - 90px);overflow:auto;background:#fff;border-radius:24px;border:1px solid var(--line);box-shadow:var(--shadow)}.panel-head{padding:16px 18px 12px;background:linear-gradient(135deg,var(--amber-soft),var(--rose-soft) 60%,var(--violet-soft));border-bottom:1px solid var(--line)}.panel-close{float:right;border:0;background:rgba(255,255,255,.7);width:32px;height:32px;border-radius:50%;cursor:pointer;font-size:18px}.panel-word{font-family:var(--quran);font-size:46px;line-height:1.75;direction:rtl;text-align:center;margin-bottom:4px}.panel-ref{text-align:center;font-size:13px;color:var(--muted)}.chips{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:8px}.chip{border-radius:999px;padding:3px 10px;font-size:13px;background:#fff;border:1px solid var(--line)}.chip.root{background:var(--teal);color:#fff;border-color:var(--teal)}.chip.lem,.chip.root{font-family:var(--arabic);font-size:17px}.chip.lem{background:var(--indigo-soft);color:var(--indigo)}.chip.lem,.chip.pos{border-color:transparent}.chip.pos{background:var(--rose-soft);color:var(--rose)}.chip.vf{background:var(--violet-soft);color:var(--violet)}.chip.g,.chip.vf{border-color:transparent}.chip.g{background:var(--sky-soft);color:var(--sky)}.chip .ar{font-size:15px}.panel-body{padding:12px 14px 18px}.tabs{display:flex;gap:6px;margin:4px 0 12px;flex-wrap:wrap}.tab{border:2px solid var(--line);background:#fff;padding:6px 12px;border-radius:999px;cursor:pointer;font-size:13px;font-weight:700;color:var(--muted)}.tab.on.muf{border-color:var(--teal);color:var(--teal);background:var(--teal-soft)}.tab.on.maj{border-color:var(--amber);color:#a35f00;background:var(--amber-soft)}.tab.on.gram{border-color:var(--indigo);color:var(--indigo);background:var(--indigo-soft)}.tab.on.occ{border-color:var(--rose);color:var(--rose);background:var(--rose-soft)}.tab .ar{font-size:15px}.src{border-radius:18px;padding:12px 14px;margin-bottom:12px;border:1px solid var(--line)}.src.muf{background:linear-gradient(180deg,var(--teal-soft),#fff 120px);border-color:#bfe9e1}.src.maj{background:linear-gradient(180deg,var(--amber-soft),#fff 120px);border-color:#f6d9a3}.src h3{margin:0 0 4px;font-size:15px;display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}.src h3 .ar{font-size:20px}.src .by{font-size:12px;color:var(--muted)}.src .entry-head{font-size:22px;font-weight:700;color:var(--ink)}.para,.src .entry-head{font-family:var(--arabic);direction:rtl;margin:6px 0}.para{text-align:justify;font-size:19px;line-height:1.95}.para.here{background:#fff;border-right:5px solid var(--rose);border-radius:12px;padding:6px 10px;box-shadow:0 4px 14px -10px rgba(226,54,107,.6)}.para .qv{color:var(--teal)}.here-label{display:inline-block;font-size:12px;font-weight:800;color:var(--rose);background:var(--rose-soft);border-radius:999px;padding:2px 10px;margin:6px 0 2px}.more{border:0;background:none;color:var(--indigo);font-weight:700;cursor:pointer;padding:4px 0;font-size:13px}.page-ref{font-size:12px;margin-top:4px}.note,.page-ref{color:var(--muted)}.note{font-size:12.5px;background:#faf7f1;border:1px dashed var(--line);border-radius:12px;padding:8px 10px;margin:8px 0}.note.warn{background:#fff8e6;border-color:#f3d48a;color:#7a5600}.en-box{border-radius:14px;background:var(--indigo-soft);padding:10px 12px;margin:8px 0;font-size:14.5px}.en-box h4{margin:0 0 4px;font-size:13px;color:var(--indigo);text-transform:uppercase;letter-spacing:.4px}.en-box p{margin:6px 0}.empty{text-align:center;color:var(--muted);padding:30px 10px}.empty .q{font-size:30px;display:block;margin-bottom:6px;color:var(--teal)}.occ-list{display:flex;flex-wrap:wrap;gap:6px}.occ-list a{font-size:12px;background:var(--rose-soft);color:var(--rose);padding:2px 8px;border-radius:999px}.gram-table{width:100%;border-collapse:collapse;font-size:14px}.gram-table td{padding:6px 4px;border-bottom:1px solid var(--line);vertical-align:top}.gram-table td.ar{font-size:18px;text-align:right}.panel-actions{display:flex;gap:8px;justify-content:center;margin-top:10px;flex-wrap:wrap}.form-card{max-width:640px;margin:10px auto;background:#fff;border-radius:24px;padding:24px;border:1px solid var(--line);box-shadow:var(--shadow)}.form-card h1{margin:0 0 6px;font-size:26px}.form-card .lead{color:var(--muted);margin:0 0 16px}label.f{display:block;font-weight:700;font-size:14px;margin:14px 0 6px}input.t,select.t,textarea.t{width:100%;padding:10px 14px;border-radius:12px;border:2px solid var(--line);font-size:15px;font-family:inherit;background:#fff}input.t:focus,select.t:focus{outline:none;border-color:var(--indigo)}.choices{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));grid-gap:8px;gap:8px}.choice{border:2px solid var(--line);border-radius:14px;padding:10px 12px;cursor:pointer;background:#fff;text-align:left;font-size:14px}.choice b{display:block}.choice small{color:var(--muted);display:block;font-size:12px;margin-top:2px}.choice.on{border-color:var(--indigo);background:var(--indigo-soft)}.choice.on.c1{border-color:var(--teal);background:var(--teal-soft)}.choice.on.c2{border-color:var(--amber);background:var(--amber-soft)}.choice.on.c3{border-color:var(--rose);background:var(--rose-soft)}.err{color:#b42318;background:#fff0ee}.err,.ok{border-radius:10px;padding:8px 12px;font-size:14px;margin-top:10px}.ok{color:#126b33;background:#eafbf0}.quiz{border-radius:16px;background:linear-gradient(180deg,var(--sky-soft),#fff);padding:12px 14px;border:1px solid #cde8f7;margin-top:10px}.quiz .qq{font-weight:700;margin:10px 0 6px;font-size:14px}.quiz .opts{display:flex;gap:6px;flex-wrap:wrap}.quiz .opt{border:2px solid var(--line);background:#fff;border-radius:999px;padding:4px 12px;cursor:pointer;font-size:15px}.quiz .opt.on{border-color:var(--sky);background:var(--sky-soft)}.consent{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--muted);margin-top:8px}.saved-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));grid-gap:10px;gap:10px}.saved-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px}.saved-card .q{font-size:30px;text-align:center}.saved-card .meta{font-size:12px;color:var(--muted);text-align:center}.prose{max-width:820px}.prose h2{margin-top:28px}.prose li{margin:6px 0}.foot{text-align:center;color:var(--muted);font-size:13px;padding:30px 10px}@media (max-width:900px){.topbar-inner{padding:8px 12px;gap:10px}.nav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:4px}.nav::-webkit-scrollbar{display:none}.nav a,.nav button{padding:4px 10px;font-size:13px;white-space:nowrap}.wrap{padding:14px 12px 60px}.reader-head{padding:14px 16px;border-radius:18px}.reader-head h1{font-size:20px}.mushaf{padding:12px;border-radius:18px}.layout:not(.nopanel) .mushaf{margin-bottom:64vh}.panel-word{font-size:38px}.panel-head{padding:10px 14px}.chip{font-size:12px;padding:2px 8px}.chip.lem,.chip.root{font-size:15px}.para{font-size:18px}.hero{grid-template-columns:1fr}.hero h1{font-size:30px}.layout{grid-template-columns:minmax(0,1fr)}.verses{font-size:27px;line-height:2.25}.panel{position:fixed;left:0;right:0;bottom:0;top:auto;max-height:62vh;z-index:40;border-radius:24px 24px 0 0;box-shadow:0 -12px 40px -10px rgba(0,0,0,.35);animation:up .18s ease-out}.panel:before{content:"";display:block;width:44px;height:5px;border-radius:5px;background:#d9d2c4;margin:8px auto 0}.reader-head .ar{font-size:30px}.brand .en{display:none}}@keyframes up{0%{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}