/* Parhayi.com Round 34: shared style of the static READ pages (unique/read/*.html). Navy / green, light + dark, phone first. */
@font-face{font-family:"Gulzar";src:url(../fonts/gulzar.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Amiri Quran";src:url(../fonts/amiri-quran-arabic-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Amiri";src:url(../fonts/amiri-arabic-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Amiri";src:url(../fonts/amiri-arabic-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}
:root{--bg:#F4F8FB;--surface:#FFFFFF;--sunk:#EAF1F6;--ink:#1B3A5C;--navy:#1B3A5C;--green:#0F9D7A;--mint:#E2F6EF;--mut:#4F6072;--line:#D5DDE6;--link:#0B7C60}
:root[data-theme=dark]{--bg:#0e1722;--surface:#14202e;--sunk:#1b2a3b;--ink:#eef3f8;--navy:#9FD8C7;--mint:#12332f;--mut:#a9b8c8;--line:#2a3b4f;--link:#5fd6b4}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--link)}
.top{background:#1B3A5C;color:#fff;padding:10px 16px;display:flex;align-items:center;gap:12px;justify-content:space-between}
.top a.b{color:#fff;text-decoration:none;font-weight:700;font-size:16px;border:2px solid rgba(255,255,255,.4);border-radius:10px;min-height:46px;padding:0 14px;display:inline-flex;align-items:center;gap:2px}
.top .lg{display:inline-flex;align-items:center;min-height:46px}.top .lg img{height:36px;width:auto;display:block}
.top .l{display:flex;align-items:center;gap:10px}
.rd-w{max-width:800px;margin:0 auto;padding:16px 16px 56px}
.crumbs{font-size:14px;color:var(--mut);margin:4px 0 10px;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:2px 0}
.crumbs li:not(:last-child):after{content:">";margin:0 7px;color:var(--mut)}
.crumbs a{color:var(--link);text-decoration:none;display:inline-block;min-height:24px}
h1{font-size:27px;line-height:1.25;margin:6px 0 8px;color:var(--ink)}
h2{font-size:21px;line-height:1.3;margin:30px 0 10px;color:var(--ink);border-bottom:2px solid var(--green);padding-bottom:5px}
h3{font-size:18px;margin:20px 0 6px;color:var(--ink)}
p{margin:0 0 12px}
.meta{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px;padding:0;list-style:none}
.meta li{background:var(--sunk);border:1px solid var(--line);border-radius:999px;padding:3px 12px;font-size:14px;font-weight:600}
.pill{display:inline-block;border-radius:999px;padding:2px 12px;font-size:13.5px;font-weight:800;background:var(--mint);color:var(--link);border:1px solid var(--green)}
.pill.pr{background:var(--navy);color:var(--bg);border-color:var(--navy)}
.btns{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}
.btns a{flex:1 1 150px;min-height:48px;display:flex;align-items:center;justify-content:center;text-align:center;border-radius:12px;font-weight:800;text-decoration:none;padding:8px 14px;border:2px solid var(--navy);color:var(--navy);background:var(--surface)}
.btns a.g{background:var(--green);border-color:var(--green);color:#fff}
.btns a.n{background:#1B3A5C;border-color:#1B3A5C;color:#fff}
.box{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin:16px 0}
.box h3:first-child,.box h2:first-child{margin-top:0}
.fact{background:var(--mint);border-left:5px solid var(--green)}
.revise{background:var(--sunk);border-left:5px solid var(--navy)}
.mnemo{background:var(--surface);border:2px dashed var(--green)}
.box .bt{font-weight:800;margin:0 0 6px}
.gate{background:var(--surface);border:2px solid var(--navy);border-radius:16px;padding:18px 16px;margin:24px 0}
.gate h2{border:0;margin:0 0 6px;padding:0}
.gate .price{font-weight:800;color:var(--link)}
.premok{display:none}.is-prem .gate{display:none}.is-prem .premok{display:block}
ul,ol{margin:0 0 12px;padding-left:24px}li{margin:3px 0}
table{border-collapse:collapse;width:100%;margin:10px 0;font-size:15.5px;display:block;overflow-x:auto}
th,td{border:1px solid var(--line);padding:6px 9px;text-align:left;vertical-align:top}th{background:var(--sunk)}
.qa{border-top:1px solid var(--line);padding:10px 0}.qa .q{font-weight:800;margin:0 0 4px}.qa .q small{font-weight:600;color:var(--mut)}
.qa .a{margin:0}.qa .a div{margin:0 0 6px}
.mcq{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:10px 0}
.mcq .q{font-weight:700;margin:0 0 6px}.mcq ol{list-style:lower-alpha;margin:0 0 8px}
.mcq .rd-ans{font-weight:800;color:var(--link);margin:0}.mcq .why{margin:2px 0 0;font-size:15.5px;color:var(--mut)}
.pn{display:flex;gap:10px;flex-wrap:wrap;margin:26px 0 8px}
.pn a{flex:1 1 200px;min-height:50px;display:flex;flex-direction:column;justify-content:center;border:2px solid var(--line);background:var(--surface);border-radius:12px;padding:6px 14px;text-decoration:none;color:var(--ink);font-weight:700;font-size:15px}
.pn a small{color:var(--mut);font-weight:600;font-size:12.5px}.pn a.nx{text-align:right}
.list{list-style:none;padding:0;margin:0}.list li{margin:0;border-top:1px solid var(--line);padding:10px 0}
.list a.t{font-weight:800;text-decoration:none;display:inline-block;min-height:30px}
.list .sm{color:var(--mut);font-size:15.5px;margin:2px 0 0}
.gl dt{font-weight:800;margin-top:8px}.gl dd{margin:0 0 4px}
img,svg{max-width:100%;height:auto}
figure{margin:12px 0}figcaption{font-size:14px;color:var(--mut)}
.ar{font-family:"Amiri Quran","Amiri","Noto Naskh Arabic",serif;font-size:1.3em;line-height:2.1}
.ur,.urx{font-family:"Gulzar","Noto Nastaliq Urdu",serif;line-height:2.15;direction:rtl;text-align:right}
.ur .ar{display:block;text-align:center}.ur li .ar,.ur td .ar{display:inline}
.ur ul,.ur ol{padding-left:0;padding-right:26px}.ur th,.ur td{text-align:right}
.ur h2,.ur h3{font-family:"Gulzar",serif;line-height:1.9}.ur .qa .q small{font-family:system-ui,sans-serif}
.ur .box{border-left-width:1px}.ur .fact{border-right:5px solid var(--green);border-left:1px solid var(--line)}.ur .revise{border-right:5px solid var(--navy);border-left:1px solid var(--line)}
.ur-h{font-family:"Gulzar",serif;font-weight:400}
footer.ft{background:#1B3A5C;color:#dfe9f2;padding:22px 16px 30px;font-size:15px}
footer.ft .in{max-width:800px;margin:0 auto}footer.ft a{color:#fff;display:inline-flex;align-items:center;min-height:44px;margin-right:16px;font-weight:700}
footer.ft p{margin:4px 0 0;color:#b9c9d8;font-size:14px}
@media(min-width:700px){body{font-size:18px}h1{font-size:32px}.top{padding:10px 28px}}
@media(max-width:380px){.top a.b{padding:0 9px;font-size:15px}.top .lg img{height:30px}}