/* محراب 5.33 — «المصحف الذكي»: محراب الوقت. القوس هو اليوم: الصلوات على منحناه وعلامة الشمس/القمر تسير عليه. ألوان brand.css فقط */ #mx{display:none} html[data-skin=mushaf] #app{visibility:hidden} html[data-skin=mushaf] #app .sheet,html[data-skin=mushaf] .rpanel,html[data-skin=mushaf] .sheet{visibility:visible} /* 5.38: لوحة الراديو تُنقل إلى body عند الفتح فكان قانون #app يخفيها؛ وتفتح الآن للأعلى من زر الشريط السفلي */ html[data-skin=mushaf] .rpanel.up{transform-origin:var(--ox,50%) 100%} html[data-skin=mushaf] .rpanel.up.in{animation-name:rpInUp}html[data-skin=mushaf] .rpanel.up.out{animation-name:rpOutUp} @keyframes rpInUp{from{opacity:0;transform:translateY(.7rem) scale(.9)}to{opacity:1;transform:none}} @keyframes rpOutUp{to{opacity:0;transform:translateY(.5rem) scale(.94)}} html[data-skin=mushaf] #app .ov{display:none} html[data-skin=mushaf] #mx{display:block;position:fixed;inset:0;z-index:50;background:var(--mh-page);color:var(--mh-page-ink);font-family:var(--mh-font-ui),'Cairo',system-ui,sans-serif;overflow:hidden;padding:env(safe-area-inset-top,0) env(safe-area-inset-right,0) env(safe-area-inset-bottom,0) env(safe-area-inset-left,0);--u:min(.72vw,1.2vh);--a:8px;transition:background 1.2s} #mx[data-t=night]{--mh-page:var(--mh-stage-1);--mh-page-ink:var(--mh-stage-ink);--mh-surface:var(--mh-stage-3);--mh-surface-2:var(--mh-stage-2);--mh-line:var(--mh-stage-line);--mh-ink-3:var(--mh-stage-ink-3);--mh-primary:var(--mh-stage-primary);--mh-page-num:var(--mh-stage-ink-3)} #mx .mx-fr{position:absolute;inset:calc(var(--u)*.9);border:2px solid var(--mh-fr-brown);box-shadow:0 0 0 1px var(--mh-fr-gold);pointer-events:none} #mx .mx-fr:before{content:"";position:absolute;inset:0;padding:calc(var(--u)*1.6);background:repeating-linear-gradient(45deg,var(--mh-fr-gold) 0 calc(var(--u)*.5),var(--mh-fr-teal) 0 calc(var(--u)*1.1));-webkit-mask:linear-gradient(var(--mh-fr-ink) 0 0) content-box exclude,linear-gradient(var(--mh-fr-ink) 0 0);mask:linear-gradient(var(--mh-fr-ink) 0 0) content-box exclude,linear-gradient(var(--mh-fr-ink) 0 0)} #mx .mx-w{position:absolute;inset:calc(var(--u)*3.2);display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;gap:calc(var(--u)*1.2)} #mx .mx-head{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:calc(var(--u)*1.5)} #mx .mx-pl{justify-self:center;max-width:100%;padding:.12em 1.3em;font-weight:800;font-size:calc(var(--u)*2);color:var(--mh-fr-ink);background:linear-gradient(180deg,var(--mh-fr-cream),var(--mh-fr-cream-2));border:1px solid var(--mh-fr-brown);border-radius:.7em;box-shadow:inset 0 0 0 2px var(--mh-fr-cream),inset 0 0 0 3px var(--mh-fr-gold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #mx .mx-pl.s{justify-self:start}#mx .mx-pl.e{justify-self:end} #mx .mx-main{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) minmax(0,1fr);gap:calc(var(--u)*1.6);min-height:0} #mx .mx-box{background:linear-gradient(180deg,var(--mh-surface),var(--mh-surface-2));border:1px solid var(--mh-line);border-radius:calc(var(--u)*1.4);box-shadow:inset 0 0 0 2px var(--mh-surface),inset 0 0 0 3px var(--mh-fr-gold)} #mx .mx-col{display:grid;align-content:center;gap:calc(var(--u)*1.2);min-height:0;transition:opacity 1.2s,filter 1.2s} /* قلب القوس */ #mx .c-clk{font-size:calc(var(--a)*4.6);font-weight:900;line-height:1;direction:ltr;white-space:nowrap;font-variant-numeric:tabular-nums} #mx .c-clk small{font-size:.34em;color:var(--mh-page-num);margin-inline-start:.3em} #mx .c-k{font-size:calc(var(--a)*3);color:var(--mh-ink-3);margin-top:calc(var(--a)*1.2)} #mx .c-n{font-size:calc(var(--a)*5.2);font-weight:900;color:var(--mh-primary);line-height:1.15} #mx .c-cd{font-size:calc(var(--a)*8.4);font-weight:900;line-height:1.05;direction:ltr;white-space:nowrap;font-variant-numeric:tabular-nums;transition:color .6s} #mx[data-soon="1"] .c-cd{color:var(--mh-danger);animation:mxb 1.6s ease-in-out infinite}#mx[data-soon="2"] .c-cd{color:var(--mh-danger);animation:mxb .8s ease-in-out infinite} @keyframes mxb{50%{transform:scale(1.05)}} #mx .c-sub{font-size:calc(var(--a)*2.9);color:var(--mh-ink-3);line-height:1.5} #mx .c-bar{width:78%;height:calc(var(--a)*.7);background:var(--mh-line-soft);border-radius:9em;overflow:hidden;margin-top:calc(var(--a)*.6)} #mx .c-bar i{display:block;height:100%;background:var(--mh-primary);transition:width .9s linear} #mx[data-ph=adhan] .c-n{color:var(--mh-page-num)}#mx[data-ph=adhan] .c-cd{color:var(--mh-fr-gold);font-size:calc(var(--a)*7)} #mx[data-ph=praying] .c-cd,#mx[data-ph=after] .c-cd,#mx[data-ph=praying] .c-bar,#mx[data-ph=after] .c-bar{display:none} #mx[data-ph=praying] .c-n{animation:mxb 5s ease-in-out infinite} #mx[data-ph=praying] .mx-col,#mx[data-ph=praying] .mx-strip{opacity:.12;filter:blur(2px)} @keyframes mxl{50%{opacity:.35}} /* الجانبان */ #mx .mx-now{padding:calc(var(--u)*1.8) calc(var(--u)*2);display:grid;gap:calc(var(--u)*.8)} #mx .mx-now .k{font-size:calc(var(--u)*1.8);color:var(--mh-ink-3)}#mx .mx-now .t{font-size:calc(var(--u)*3.2);font-weight:900;color:var(--mh-primary)} #mx .mx-now .x{font-size:calc(var(--u)*1.9);line-height:1.7}#mx .mx-now .r{font-size:calc(var(--u)*1.7);color:var(--mh-page-num);font-weight:800} #mx .mx-now .pb{height:calc(var(--u)*.6);background:var(--mh-line-soft);border-radius:9em;overflow:hidden}#mx .mx-now .pb i{display:block;height:100%;background:var(--mh-fr-gold);transition:width .9s linear} #mx[data-nahy="1"] .mx-now{border-color:var(--mh-danger);box-shadow:inset 0 0 0 2px var(--mh-surface),inset 0 0 0 3px var(--mh-danger)}#mx[data-nahy="1"] .mx-now .t{color:var(--mh-danger)} #mx .mx-bd{display:flex;flex-wrap:wrap;gap:.4em;justify-content:center} #mx .mx-bd span{padding:.15em .9em;font-size:calc(var(--u)*1.6);font-weight:800;color:var(--mh-fr-ink);background:linear-gradient(180deg,var(--mh-fr-cream),var(--mh-fr-cream-2));border:1px solid var(--mh-fr-brown);border-radius:99px} #mx .mx-card{display:grid;align-content:center;gap:calc(var(--u)*1);padding:calc(var(--u)*2);text-align:center;overflow:hidden;min-height:calc(var(--u)*22);transition:opacity .5s}#mx .mx-card.out{opacity:0} #mx .mx-ct{font-size:calc(var(--u)*1.8);font-weight:800;color:var(--mh-primary)} #mx .mx-cx{font-family:'Amiri Quran','Amiri',serif;font-size:calc(var(--u)*2.6);line-height:1.9} #mx .mx-cs{font-size:calc(var(--u)*1.8);color:var(--mh-page-num)} #mx .mx-tm{display:grid;grid-template-columns:repeat(3,1fr);gap:.4em;font-family:inherit;font-size:calc(var(--u)*2)}#mx .mx-tm span{display:grid}#mx .mx-tm b{direction:ltr} #mx .mx-dots{display:flex;justify-content:center;gap:.5em}#mx .mx-dots i{width:calc(var(--u)*.9);height:calc(var(--u)*.9);background:var(--mh-line);transform:rotate(45deg)}#mx .mx-dots i.on{background:var(--mh-fr-gold)} /* التذييل: إعلان + شريط الإجراءات */ #mx .mx-foot{display:flex;align-items:center;gap:calc(var(--u)*1.5);min-height:calc(var(--u)*5.6)} #mx .mx-tk{flex:1;min-width:0;text-align:center;font-size:calc(var(--u)*1.8);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #mx .mx-tk.n{padding:.25em 1em;font-weight:800;color:var(--mh-fr-ink);background:linear-gradient(180deg,var(--mh-fr-cream),var(--mh-fr-cream-2));border:1px solid var(--mh-fr-brown);border-radius:99px} #mx .mx-dk{position:relative;display:flex;gap:calc(var(--u)*.8);padding:calc(var(--u)*.7);border-radius:99px;transition:opacity .5s,transform .5s} #mx .mx-dk.idle{opacity:0;transform:translateY(60%);pointer-events:none} #mx .mx-dk button{width:calc(var(--u)*4.6);height:calc(var(--u)*4.6);padding:0;display:grid;place-items:center;color:var(--mh-fr-ink);background:linear-gradient(180deg,var(--mh-fr-cream),var(--mh-fr-cream-2));border:1px solid var(--mh-fr-brown);border-radius:50%;cursor:pointer;transition:transform .15s} #mx .mx-dk button:active{transform:scale(.88)}#mx .mx-dk button:focus-visible{outline:3px solid var(--mh-primary);outline-offset:2px} #mx .mx-dk svg{width:60%;height:60%;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round} #mx .mx-pv{position:absolute;bottom:calc(100% + var(--u));inset-inline-end:0;display:none;gap:calc(var(--u)*.6);padding:calc(var(--u)*1)}#mx .mx-pv.on{display:grid} #mx .mx-pv button{width:auto;height:auto;border-radius:.8em;padding:.4em 1.2em;font:800 calc(var(--u)*1.7) inherit;font-family:inherit;white-space:nowrap} #mx .mx-dim{position:absolute;inset:0;background:var(--mh-stage-edge);opacity:0;pointer-events:none;transition:opacity .8s;z-index:5} /* الحلقة */ #mx .mx-ring{position:relative;height:100%;max-width:100%;aspect-ratio:1;justify-self:center;align-self:center;min-height:0} #mx .mx-ring svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible} #mx .o1{fill:none;stroke:var(--mh-fr-brown);stroke-width:1.2}#mx .o2{fill:none;stroke:var(--mh-fr-gold);stroke-width:2} #mx .tk{stroke:var(--mh-line);stroke-width:.8}#mx .tk.b{stroke:var(--mh-fr-brown);stroke-width:1.4} #mx .trk{fill:var(--mh-surface);stroke:var(--mh-line);stroke-width:9} #mx .rbar{fill:none;stroke:var(--mh-primary);stroke-width:9;stroke-linecap:round;transition:stroke-dashoffset .9s linear} #mx .rhd{fill:var(--mh-fr-gold);stroke:var(--mh-fr-brown);stroke-width:2.5} #mx[data-soon="1"] .rbar,#mx[data-soon="2"] .rbar{stroke:var(--mh-danger)} #mx[data-ph=adhan] .rbar{stroke:var(--mh-fr-gold);filter:drop-shadow(0 0 4px var(--mh-fr-gold))} #mx .rpc{fill:none;stroke:var(--mh-fr-gold);stroke-width:1.5;opacity:0;transform-box:fill-box;transform-origin:50% 50%} #mx[data-ph=adhan] .rpc{animation:mxr 3.2s ease-out infinite}#mx[data-ph=adhan] .rpc+.rpc{animation-delay:1.6s} @keyframes mxr{from{transform:scale(.97);opacity:.9}to{transform:scale(1.18);opacity:0}} #mx .mx-core{position:absolute;inset:17%;display:grid;grid-template-rows:auto auto auto auto auto;justify-items:center;align-content:center;text-align:center;gap:calc(var(--a)*.4)} #mx .c-clk{display:block;padding:calc(var(--u)*1.2) calc(var(--u)*2);text-align:center;font-size:calc(var(--u)*11);font-weight:900;line-height:1.1;direction:ltr;white-space:nowrap;font-variant-numeric:tabular-nums} #mx .c-clk small{font-size:.3em;color:var(--mh-page-num);margin-inline-start:.3em} /* شريط الصلوات */ #mx .mx-strip{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:calc(var(--u)*1.2)} #mx .mx-pq{position:relative;display:grid;justify-items:center;gap:calc(var(--u)*.2);padding:calc(var(--u)*1.1) calc(var(--u)*.8);text-align:center;background:var(--mh-surface);border:1px solid var(--mh-line);border-radius:calc(var(--u)*1.2);transition:background .5s,opacity .5s} #mx .mx-pq .n{font-size:calc(var(--u)*2.4);font-weight:900}#mx .mx-pq .a{font-size:calc(var(--u)*3.4);font-weight:900;direction:ltr;font-variant-numeric:tabular-nums} #mx .mx-pq .i{font-size:calc(var(--u)*1.9);color:var(--mh-ink-3);min-height:1.4em}#mx .mx-pq .s{font-size:calc(var(--u)*1.9);font-weight:800;min-height:1.4em} #mx .mx-pq.past{opacity:.7} #mx .mx-pq.next{background:var(--mh-primary);color:var(--mh-on-primary);border-color:var(--mh-fr-gold);box-shadow:0 0 0 2px var(--mh-fr-gold);animation:mxp 3.6s ease-in-out infinite} #mx .mx-pq.next .i{color:inherit} #mx .mx-pq.now{border-color:var(--mh-fr-gold);box-shadow:0 0 0 3px var(--mh-fr-gold)} @keyframes mxp{50%{box-shadow:0 0 calc(var(--u)*2) var(--mh-fr-gold)}} @media (max-aspect-ratio:1/1){html[data-skin=mushaf] #mx{--u:min(1.7vw,1.1vh)} #mx .mx-main{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto} #mx .mx-ring{height:auto;width:100%;max-height:100%} #mx .mx-col.r .mx-now,#mx .mx-col.r .mx-bd{display:none} #mx .mx-main{grid-template-rows:auto minmax(0,1fr) auto} #mx .mx-strip{grid-template-columns:repeat(3,1fr)} #mx .c-clk{font-size:calc(var(--u)*8)}#mx .mx-card{min-height:0} #mx .mx-head{grid-template-columns:1fr 1fr}#mx .mx-pl.c{display:none} #mx .mx-dk button{width:calc(var(--u)*5.4);height:calc(var(--u)*5.4)}} /* ========================================================================== 5.38 — توحيد كل القوائم والنوافذ المنبثقة على هوية محراب (brand.css فقط) تشمل: الإعدادات، لوحة الراديو، التحكم عن بُعد (#mhs)، إطارا التحفيظ والمصحف (.msh)، لوحة التحكم (#mhAdm)، وشريط الصوت (#rcHud). تتبع الثيم (ورقي/ليلي) عبر data-theme على كل منها. الفكرة: إعادة ربط المتغيرات القديمة (--panel/--gold/--ivory…) برموز --mh-* داخل هذه العناصر فقط، ثم تعديلات مقصودة لما كان ألوانًا صلبة. ========================================================================== */ html[data-skin=mushaf] :is(.sheet,.rpanel,#rcHud,#mhs,#mhAdm,.msh){ --panel:var(--mh-surface);--line:var(--mh-line);--ink:var(--mh-surface-raised); --gold:var(--mh-primary);--gold-dim:var(--mh-line);--gold-rgb:var(--mh-teal-rgb); --ivory:var(--mh-ink);--muted:var(--mh-ink-3);--crimson:var(--mh-danger);--emerald:var(--mh-primary); color-scheme:light;font-family:var(--mh-font-ui),'Cairo',system-ui,sans-serif} html[data-skin=mushaf] :is(.sheet,.rpanel,#rcHud,#mhs,.msh)[data-theme=night]{color-scheme:dark} /* الخلفية الحاجبة */ html[data-skin=mushaf] .sheet,html[data-skin=mushaf] #mhs,html[data-skin=mushaf] .msh .mbk{background:var(--mh-scrim);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)} /* اللوحات: ورق كريمي + حدّ + إطار ذهبي رفيع كبطاقات الشاشة */ html[data-skin=mushaf] .panel,html[data-skin=mushaf] .rpanel,html[data-skin=mushaf] #mhs .c,html[data-skin=mushaf] .msh .mpn{ background:linear-gradient(180deg,var(--mh-surface),var(--mh-surface-2));color:var(--mh-ink);border:1px solid var(--mh-line); box-shadow:var(--mh-shadow),inset 0 0 0 2px var(--mh-surface),inset 0 0 0 3px rgba(var(--mh-gold-rgb),.9)} html[data-skin=mushaf] .panel-head{background:var(--mh-surface);border-bottom:1px solid var(--mh-line)} html[data-skin=mushaf] .panel h2,html[data-skin=mushaf] #mhs h2{color:var(--mh-primary);font-family:var(--mh-font-ui),'Cairo',sans-serif} html[data-skin=mushaf] .panel h3{color:var(--mh-accent-ink)} html[data-skin=mushaf] .panel h3::after{background:linear-gradient(270deg,var(--mh-line),transparent)} /* الحقول */ html[data-skin=mushaf] :is(.fields select,.fields input,.rp-head input,.rp-flt select,#mhs input){ background-color:var(--mh-surface-raised);color:var(--mh-ink);border:1px solid var(--mh-line);border-radius:.6rem} html[data-skin=mushaf] :is(.fields select,.fields input,.rp-head input,.rp-flt select,#mhs input):focus{border-color:var(--mh-primary);box-shadow:var(--mh-focus-ring);outline:none} html[data-skin=mushaf] :is(.fields select option,.rp-flt select option){background:var(--mh-surface-raised);color:var(--mh-ink)} html[data-skin=mushaf] .rp-head input::placeholder{color:var(--mh-ink-3)} html[data-skin=mushaf] .fields label,html[data-skin=mushaf] .msg,html[data-skin=mushaf] .hint{color:var(--mh-ink-3)} /* الأزرار: ثانوي = حدّ وأيقونة تيل على ورق، رئيسي = تيل مملوء */ html[data-skin=mushaf] .sheet .btn,html[data-skin=mushaf] .linkrows a,html[data-skin=mushaf] #mhs button{ background:var(--mh-surface-raised);color:var(--mh-primary);border:1px solid var(--mh-line);border-radius:.7rem;font-weight:700;text-shadow:none} html[data-skin=mushaf] .sheet .btn:hover,html[data-skin=mushaf] .linkrows a:hover,html[data-skin=mushaf] .linkrows a:focus-visible,html[data-skin=mushaf] #mhs button:hover{ background:var(--mh-press);border-color:var(--mh-primary);transform:none} html[data-skin=mushaf] .sheet .btn.pri,html[data-skin=mushaf] .sheet .btn.primary,html[data-skin=mushaf] #mhs button.pri{ background:var(--mh-primary);color:var(--mh-on-primary);border-color:var(--mh-primary)} html[data-skin=mushaf] .sheet .btn.pri:hover,html[data-skin=mushaf] #mhs button.pri:hover{background:var(--mh-primary-hover)} html[data-skin=mushaf] .sheet .btn.danger,html[data-skin=mushaf] #mhs button.bad,html[data-skin=mushaf] #mhs .err{color:var(--mh-danger);border-color:var(--mh-danger)} html[data-skin=mushaf] :is(.btn,select,input,button,a):focus-visible{outline:none;box-shadow:var(--mh-focus-ring)} /* لوحة الراديو */ html[data-skin=mushaf] .rpanel{background:linear-gradient(180deg,var(--mh-surface),var(--mh-surface-2));-webkit-backdrop-filter:none;backdrop-filter:none} html[data-skin=mushaf] .rp-head,html[data-skin=mushaf] .rp-tabs,html[data-skin=mushaf] .rp-chips,html[data-skin=mushaf] .rp-flt,html[data-skin=mushaf] .rp-stat,html[data-skin=mushaf] .lp-ctl,html[data-skin=mushaf] .rp-ctl{border-color:var(--mh-line-soft)} html[data-skin=mushaf] .rp-stop{background:var(--mh-danger-bg);border-color:var(--mh-danger);color:var(--mh-danger)} html[data-skin=mushaf] .rp-stop:hover{background:var(--mh-danger-bg);filter:brightness(.96)} html[data-skin=mushaf] .rp-ctl button,html[data-skin=mushaf] .lp-ctl button{background:var(--mh-surface-raised);color:var(--mh-primary);border:1px solid var(--mh-line)} html[data-skin=mushaf] .rp-ctl button:hover,html[data-skin=mushaf] .lp-ctl button:hover{background:var(--mh-press);border-color:var(--mh-primary)} html[data-skin=mushaf] .rp-tab{background:var(--mh-surface-raised);border-color:var(--mh-line);color:var(--mh-primary)} html[data-skin=mushaf] .rp-tab.on{background:var(--mh-primary);border-color:var(--mh-primary);color:var(--mh-on-primary)} html[data-skin=mushaf] .rp-chip{border-color:var(--mh-line);color:var(--mh-ink-2)} html[data-skin=mushaf] .rp-chip.on{background:rgba(var(--mh-teal-rgb),.12);border-color:var(--mh-primary);color:var(--mh-primary)} html[data-skin=mushaf] .rp-chip.on small{color:var(--mh-primary)} html[data-skin=mushaf] :is(.rp-lt,.rp-ch,.rp-back){background:var(--mh-surface-2);color:var(--mh-accent-ink);border-color:var(--mh-line-soft)} html[data-skin=mushaf] .rp-i{color:var(--mh-ink)} html[data-skin=mushaf] .rp-i:hover,html[data-skin=mushaf] .rp-i:focus-visible,html[data-skin=mushaf] .rp-g>summary:hover{background:var(--mh-hl)} html[data-skin=mushaf] .rp-i.on{background:rgba(var(--mh-teal-rgb),.14);color:var(--mh-primary)} html[data-skin=mushaf] .rp-g>summary,html[data-skin=mushaf] .rp-i.rp-h,html[data-skin=mushaf] .rp-stat b{color:var(--mh-accent-ink)} html[data-skin=mushaf] .rp-top>summary,html[data-skin=mushaf] .rp-cg[open]>summary{background:var(--mh-hl);border-color:var(--mh-line)} html[data-skin=mushaf] .rp-cg,html[data-skin=mushaf] .rp-sub{border-color:var(--mh-line-soft);background:transparent} html[data-skin=mushaf] .rp-g>summary span,html[data-skin=mushaf] .rp-ch small,html[data-skin=mushaf] .rp-chip small{background:var(--mh-press);color:var(--mh-ink-3)} html[data-skin=mushaf] .rp-list{scrollbar-color:var(--mh-line) transparent} /* التحكم عن بُعد (#mhs) */ html[data-skin=mushaf] #mhs .c{color:var(--mh-ink)} html[data-skin=mushaf] #mhs p,html[data-skin=mushaf] #mhs .nm{color:var(--mh-ink-2)} html[data-skin=mushaf] #mhs .code{color:var(--mh-primary)} html[data-skin=mushaf] #mhs .qr{background:var(--mh-surface-raised);border:1px solid var(--mh-line)} html[data-skin=mushaf] #mhs .pill{border-color:var(--mh-line);color:var(--mh-ink-2)} html[data-skin=mushaf] #mhs .pill i{background:var(--mh-ink-3)} html[data-skin=mushaf] #mhs .pill.on i{background:var(--mh-primary);box-shadow:0 0 0 4px rgba(var(--mh-teal-rgb),.2)} html[data-skin=mushaf] #mhs .pill.mid i{background:var(--mh-gold)} /* إطارا التحفيظ والمصحف ولوحة التحكم: خلفية المسرح التيلية بدل الأخضر الأسود */ html[data-skin=mushaf] .msh .mpn,html[data-skin=mushaf] .msh iframe,html[data-skin=mushaf] #mushafSheet .mfsp{background:var(--mh-stage-1)} html[data-skin=mushaf] .msh .mpn{border-color:var(--mh-stage-line);box-shadow:var(--mh-shadow)} html[data-skin=mushaf] #mushafSheet .mfsp{color:var(--mh-gold)} html[data-skin=mushaf] #mushafSheet .mfsp svg{stroke:var(--mh-gold)} html[data-skin=mushaf] #mhAdm,html[data-skin=mushaf] #mhAdm iframe{background:var(--mh-stage-1)} html[data-skin=mushaf] #mhAdm .x{background:var(--mh-stage-3);color:var(--mh-stage-ink);border-color:var(--mh-stage-line)} /* شريط الصوت والتلميحات */ html[data-skin=mushaf] #rcHud{background:var(--mh-surface);color:var(--mh-ink);border:1px solid var(--mh-line);box-shadow:var(--mh-shadow)} html[data-skin=mushaf] #rcHud i{background:var(--mh-press)}html[data-skin=mushaf] #rcHud i b{background:var(--mh-primary)} /* قائمة تجربة الحالات وشريط الإجراءات */ html[data-skin=mushaf] #mx .mx-pv{border-radius:calc(var(--u)*1.2)} /* 5.38: على الهاتف كان عمود الشبكة يتمدد (min-content) فيتجاوز المحتوى الحافة اليسرى ويُقصّ الشريط والساعة */ #mx .mx-w{grid-template-columns:minmax(0,1fr)} #mx .mx-w>*,#mx .mx-main>*,#mx .mx-col>*{min-width:0;max-width:100%} #mx .mx-dk{max-width:100%;flex-wrap:wrap;justify-content:center} @media (max-aspect-ratio:1/1){#mx .c-k{font-size:calc(var(--a)*2.4)}#mx .c-sub{font-size:calc(var(--a)*2.2)}#mx .mx-pl{font-size:calc(var(--u)*1.55);padding-inline:.7em}}