@font-face{font-family:'Amiri';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/amiri-ar-400.woff2?v=b640f7cc59') format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Amiri';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/amiri-la-400.woff2?v=034ef8ba89') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Amiri';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/amiri-ar-700.woff2?v=bb99562a67') format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Amiri';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/amiri-la-700.woff2?v=3c577e3e44') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Noto Sans Arabic';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/sans-ar-400.woff2?v=24f329fc6c') format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Noto Sans Arabic';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/sans-la-400.woff2?v=44e6204ae6') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Noto Sans Arabic';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/sans-ar-600.woff2?v=758b66cd93') format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Noto Sans Arabic';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/sans-la-600.woff2?v=174a397d44') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Noto Sans Arabic';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/sans-ar-700.woff2?v=e2e732b086') format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Noto Sans Arabic';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/sans-la-700.woff2?v=ac985e4c28') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --bg:#0D1017; --panel:#141924; --panel2:#181E2B; --ink:#E9E7E1; --ink2:#C3C7D2;
  --muted:#99A0B2; --line:#262D3B; --amber:#E3A93F; --teal:#58A69C; --rust:#D07A56;
  /* لون إبراز رابع، كان في اللوحة الأصلية قبل 8d17480 ثم سقط مع إعادة بناء
     الـCSS. أُعيد لأن سبعة أحداث تتقاسم ثلاثة إبرازات (amber×3، teal×3،
     rust×1) فتتكرّر. متاح للحدث القادم، ولا يُعاد تلوين حدث منشور — بطاقته
     على X تحمل لونها الأول. التباين على الخلفية الداكنة 7.09:1. */
  --rose:#D08AA0;
  /* الكهرمانيّ حشواً غير الكهرمانيّ نصّاً: النصّ على خلفية فاتحة يلزمه
     تغميق ليبلغ 4.5:1، والحشو لا يلزمه — بل يبهت بالتغميق (زرّ كسوف ٢٠٢٧
     صار بنياً معتماً حين وُحِّدا). في الداكن هما واحد. */
  --amber-fill:var(--amber);
  /* العناوين واسم المشروع **أميري**، والمتن سانس — التقابل الذي كان في
     النسخة الأولى قبل 8d17480 ثم سقط.
     والأميري تحديداً لأنه ما كان يراه المؤلّف فعلاً: السلسلة القديمة كانت
     "Noto Naskh Arabic","Amiri",… وNoto Naskh غير مثبَّت على جهازه والأميري
     مثبَّت، فكان المتصفّح يسقط إليه. أي أن هويّة الموقع البصرية كانت أميرياً
     عند من يملكه وشيئاً آخر عند سواه.
     وكلاهما **مستضاف ذاتياً** (انظر font_face_css) فيراه الجميع سواءً. */
  --f-head:"Amiri",Georgia,serif;
  --f-body:"Noto Sans Arabic",system-ui,sans-serif;
  --f-mono:ui-monospace,"Cascadia Mono",Consolas,monospace;

  /* ═══ سلّم الأحجام ═══
     كانت 34 قيمة محشورة بين 9.5 و22.4px — فروق 0.2px لا تُرى وتُنتج فوضى.
     ثماني خطوات، ولا خطوة إلا وهي مستعملة. وأقصى انحراف عن القيمة القديمة
     4.4٪ (مقيس لكل قيمة على حدة) — دون عتبة الإدراك.
     **ولا تشمل نصوص SVG**: أحجامها إحداثيات في فضاء viewBox لا طباعة صفحة،
     فتحويلها إلى rem يكسر محاذاتها ويجعلها تفيض عند تكبير خطّ المتصفّح. */
  --fs-1:.68rem; --fs-2:.74rem; --fs-3:.8rem;  --fs-4:.86rem;
  --fs-5:.94rem; --fs-6:1.02rem; --fs-7:1.1rem; --fs-8:1.4rem;

  /* وارتفاعات السطر: كانت 11 قيمة، صارت أربعاً + الشعر.
     والثلاث المتبقية بوحدات rem (في الشريط الساعي) ليست طباعة بل أقفال
     ارتفاع تمنع انزياح التخطيط — تُترك عمداً. */
  --lh-tight:1.3; --lh-head:1.45; --lh-ui:1.7; --lh-body:1.95;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);
  font-size:var(--fs-7);line-height:var(--lh-body);-webkit-text-size-adjust:100%;overflow-x:hidden}
h1,h2,h3{font-family:var(--f-head);line-height:var(--lh-head);text-wrap:balance}
a{color:var(--amber)}
.num,.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
section{scroll-margin-top:5rem}
img{max-width:100%}

.sky{position:fixed;inset:0;pointer-events:none;z-index:0}
.sky::before{content:"";position:absolute;top:0;left:0;width:1px;height:1px;
  border-radius:50%;box-shadow:18.1vw 66.1vh 0 rgba(233,231,225,0.5),23.9vw 95.2vh 0 rgba(233,231,225,0.7),18.3vw 29.5vh 0 rgba(233,231,225,0.5),19.6vw 89.9vh 0 rgba(233,231,225,0.25),32.4vw 67.5vh 0 rgba(233,231,225,0.35),86.6vw 94.4vh 0 rgba(233,231,225,0.35),16.9vw 20.0vh 0 rgba(233,231,225,0.5),57.6vw 20.2vh 0 rgba(233,231,225,0.7),21.6vw 29.9vh 0 rgba(233,231,225,0.25),34.3vw 40.5vh 0 rgba(233,231,225,0.7),53.8vw 59.3vh 0 rgba(233,231,225,0.5),82.6vw 60.0vh 0 rgba(233,231,225,0.5),55.2vw 28.1vh 0 rgba(233,231,225,0.35),49.6vw 79.4vh 0 rgba(233,231,225,0.35),19.0vw 64.7vh 0 rgba(233,231,225,0.7),13.1vw 51.3vh 0 rgba(233,231,225,0.25),91.2vw 20.1vh 0 rgba(233,231,225,0.5),53.4vw 34.0vh 0 rgba(233,231,225,0.7),8.9vw 14.8vh 0 rgba(233,231,225,0.35),48.9vw 25.0vh 0 rgba(233,231,225,0.25),54.3vw 20.4vh 0 rgba(233,231,225,0.7),79.2vw 81.8vh 0 rgba(233,231,225,0.25),98.5vw 13.3vh 0 rgba(233,231,225,0.25),47.8vw 81.7vh 0 rgba(233,231,225,0.35),38.5vw 12.9vh 0 rgba(233,231,225,0.7),68.0vw 36.1vh 0 rgba(233,231,225,0.5),33.8vw 84.6vh 0 rgba(233,231,225,0.5),91.3vw 43.4vh 0 rgba(233,231,225,0.25),89.9vw 42.4vh 0 rgba(233,231,225,0.35),61.5vw 80.7vh 0 rgba(233,231,225,0.7),0.6vw 55.6vh 0 rgba(233,231,225,0.7),54.9vw 0.9vh 0 rgba(233,231,225,0.5),42.2vw 40.4vh 0 rgba(233,231,225,0.7),86.9vw 83.6vh 0 rgba(233,231,225,0.35),22.5vw 85.4vh 0 rgba(233,231,225,0.35),95.8vw 73.0vh 0 rgba(233,231,225,0.5),49.6vw 78.0vh 0 rgba(233,231,225,0.25),93.0vw 75.9vh 0 rgba(233,231,225,0.35),97.3vw 52.4vh 0 rgba(233,231,225,0.35),26.2vw 7.6vh 0 rgba(233,231,225,0.35),13.0vw 30.0vh 0 rgba(233,231,225,0.5),6.5vw 32.8vh 0 rgba(233,231,225,0.5),93.7vw 71.9vh 0 rgba(233,231,225,0.7),69.9vw 82.8vh 0 rgba(233,231,225,0.7),74.1vw 99.6vh 0 rgba(233,231,225,0.25),27.3vw 43.4vh 0 rgba(233,231,225,0.25),56.5vw 40.2vh 0 rgba(233,231,225,0.25),21.6vw 16.2vh 0 rgba(233,231,225,0.35),69.4vw 64.8vh 0 rgba(233,231,225,0.25),10.7vw 84.3vh 0 rgba(233,231,225,0.5),77.8vw 55.8vh 0 rgba(233,231,225,0.7),53.0vw 8.8vh 0 rgba(233,231,225,0.25),87.5vw 88.7vh 0 rgba(233,231,225,0.5),16.2vw 97.6vh 0 rgba(233,231,225,0.25),22.0vw 86.2vh 0 rgba(233,231,225,0.7),53.0vw 90.7vh 0 rgba(233,231,225,0.7),85.9vw 67.7vh 0 rgba(233,231,225,0.7),75.8vw 50.9vh 0 rgba(233,231,225,0.35),65.7vw 20.4vh 0 rgba(233,231,225,0.25),39.7vw 75.1vh 0 rgba(233,231,225,0.25),57.7vw 28.0vh 0 rgba(233,231,225,0.35),53.9vw 71.3vh 0 rgba(233,231,225,0.5),1.8vw 12.9vh 0 rgba(233,231,225,0.7),27.6vw 52.7vh 0 rgba(233,231,225,0.35),26.9vw 13.7vh 0 rgba(233,231,225,0.7),61.3vw 61.4vh 0 rgba(233,231,225,0.7),6.1vw 60.6vh 0 rgba(233,231,225,0.5),50.7vw 61.2vh 0 rgba(233,231,225,0.5),80.0vw 69.0vh 0 rgba(233,231,225,0.25),19.0vw 63.7vh 0 rgba(233,231,225,0.35),2.3vw 96.9vh 0 rgba(233,231,225,0.5),99.3vw 23.6vh 0 rgba(233,231,225,0.7),6.7vw 55.1vh 0 rgba(233,231,225,0.35),2.9vw 54.5vh 0 rgba(233,231,225,0.35),46.0vw 73.5vh 0 rgba(233,231,225,0.7),48.0vw 18.9vh 0 rgba(233,231,225,0.7),32.3vw 26.3vh 0 rgba(233,231,225,0.5),13.3vw 37.8vh 0 rgba(233,231,225,0.5),73.5vw 69.9vh 0 rgba(233,231,225,0.5),89.5vw 37.3vh 0 rgba(233,231,225,0.25),66.1vw 74.8vh 0 rgba(233,231,225,0.35),39.1vw 9.0vh 0 rgba(233,231,225,0.5),34.9vw 21.2vh 0 rgba(233,231,225,0.25),88.5vw 87.4vh 0 rgba(233,231,225,0.35),34.1vw 1.4vh 0 rgba(233,231,225,0.5),20.0vw 92.9vh 0 rgba(233,231,225,0.35),81.4vw 94.5vh 0 rgba(233,231,225,0.35),34.5vw 63.1vh 0 rgba(233,231,225,0.25),58.9vw 12.6vh 0 rgba(233,231,225,0.5),94.3vw 5.5vh 0 rgba(233,231,225,0.35),33.9vw 68.9vh 0 rgba(233,231,225,0.5),77.7vw 32.2vh 0 rgba(233,231,225,0.5),86.0vw 28.4vh 0 rgba(233,231,225,0.5),23.4vw 47.2vh 0 rgba(233,231,225,0.7),41.7vw 80.9vh 0 rgba(233,231,225,0.25),27.4vw 15.3vh 0 rgba(233,231,225,0.35),49.0vw 23.1vh 0 rgba(233,231,225,0.5),81.2vw 47.7vh 0 rgba(233,231,225,0.5),30.7vw 38.4vh 0 rgba(233,231,225,0.5),75.6vw 92.2vh 0 rgba(233,231,225,0.7),30.9vw 29.4vh 0 rgba(233,231,225,0.25),69.7vw 99.4vh 0 rgba(233,231,225,0.35),75.7vw 67.5vh 0 rgba(233,231,225,0.7),4.5vw 59.8vh 0 rgba(233,231,225,0.5),5.5vw 78.1vh 0 rgba(233,231,225,0.7),83.1vw 84.6vh 0 rgba(233,231,225,0.25),41.6vw 61.7vh 0 rgba(233,231,225,0.5),48.1vw 85.7vh 0 rgba(233,231,225,0.35),100.0vw 93.4vh 0 rgba(233,231,225,0.7),81.2vw 54.6vh 0 rgba(233,231,225,0.35),71.5vw 75.7vh 0 rgba(233,231,225,0.25),22.4vw 75.4vh 0 rgba(233,231,225,0.7),34.0vw 26.1vh 0 rgba(233,231,225,0.5),67.8vw 54.2vh 0 rgba(233,231,225,0.5),57.1vw 71.2vh 0 rgba(233,231,225,0.35),28.2vw 3.6vh 0 rgba(233,231,225,0.25),71.3vw 18.8vh 0 rgba(233,231,225,0.35),32.8vw 94.5vh 0 rgba(233,231,225,0.25),47.0vw 29.9vh 0 rgba(233,231,225,0.5),83.0vw 63.0vh 0 rgba(233,231,225,0.5),22.5vw 27.0vh 0 rgba(233,231,225,0.7),40.7vw 7.0vh 0 rgba(233,231,225,0.7),31.3vw 33.8vh 0 rgba(233,231,225,0.35),72.4vw 88.2vh 0 rgba(233,231,225,0.25),78.5vw 67.6vh 0 rgba(233,231,225,0.35),16.4vw 94.6vh 0 rgba(233,231,225,0.25),0.6vw 13.2vh 0 rgba(233,231,225,0.7),84.2vw 12.5vh 0 rgba(233,231,225,0.35),83.7vw 61.4vh 0 rgba(233,231,225,0.7),40.6vw 33.9vh 0 rgba(233,231,225,0.7),43.1vw 4.8vh 0 rgba(233,231,225,0.7),87.4vw 49.5vh 0 rgba(233,231,225,0.5),90.6vw 68.7vh 0 rgba(233,231,225,0.7),5.7vw 9.0vh 0 rgba(233,231,225,0.5),15.6vw 67.8vh 0 rgba(233,231,225,0.5),61.4vw 12.9vh 0 rgba(233,231,225,0.5),99.5vw 11.2vh 0 rgba(233,231,225,0.25),2.9vw 30.2vh 0 rgba(233,231,225,0.5),96.7vw 45.7vh 0 rgba(233,231,225,0.35),88.7vw 39.3vh 0 rgba(233,231,225,0.5),74.5vw 6.3vh 0 rgba(233,231,225,0.7),88.4vw 98.9vh 0 rgba(233,231,225,0.5),95.4vw 52.4vh 0 rgba(233,231,225,0.35),55.9vw 1.6vh 0 rgba(233,231,225,0.7),63.7vw 38.1vh 0 rgba(233,231,225,0.25),50.6vw 66.3vh 0 rgba(233,231,225,0.5),63.1vw 67.9vh 0 rgba(233,231,225,0.25),31.6vw 4.5vh 0 rgba(233,231,225,0.5),21.1vw 17.5vh 0 rgba(233,231,225,0.35),93.8vw 47.3vh 0 rgba(233,231,225,0.35),71.6vw 4.7vh 0 rgba(233,231,225,0.5),98.6vw 27.7vh 0 rgba(233,231,225,0.35),61.0vw 95.5vh 0 rgba(233,231,225,0.35),36.1vw 64.9vh 0 rgba(233,231,225,0.7),72.2vw 35.0vh 0 rgba(233,231,225,0.35),42.8vw 39.0vh 0 rgba(233,231,225,0.35),47.0vw 36.0vh 0 rgba(233,231,225,0.35),49.7vw 31.0vh 0 rgba(233,231,225,0.35),11.6vw 92.3vh 0 rgba(233,231,225,0.5),70.6vw 0.6vh 0 rgba(233,231,225,0.25),47.8vw 61.4vh 0 rgba(233,231,225,0.25),67.8vw 51.2vh 0 rgba(233,231,225,0.25),55.9vw 71.9vh 0 rgba(233,231,225,0.5),84.8vw 33.1vh 0 rgba(233,231,225,0.5),91.6vw 54.9vh 0 rgba(233,231,225,0.35),99.7vw 79.5vh 0 rgba(233,231,225,0.35),87.9vw 24.0vh 0 rgba(233,231,225,0.5),88.2vw 85.1vh 0 rgba(233,231,225,0.5),39.2vw 91.5vh 0 rgba(233,231,225,0.35),65.2vw 15.6vh 0 rgba(233,231,225,0.25),25.6vw 94.0vh 0 rgba(233,231,225,0.7),59.4vw 62.3vh 0 rgba(233,231,225,0.5),59.5vw 63.4vh 0 rgba(233,231,225,0.25),20.0vw 25.8vh 0 rgba(233,231,225,0.7),54.2vw 28.4vh 0 rgba(233,231,225,0.7),41.5vw 46.0vh 0 rgba(233,231,225,0.7),44.6vw 89.1vh 0 rgba(233,231,225,0.7),54.2vw 49.2vh 0 rgba(233,231,225,0.5),53.3vw 86.3vh 0 rgba(233,231,225,0.35),71.1vw 25.9vh 0 rgba(233,231,225,0.25),83.7vw 72.1vh 0 rgba(233,231,225,0.35),5.4vw 16.7vh 0 rgba(233,231,225,0.35),71.6vw 9.2vh 0 rgba(233,231,225,0.5),16.4vw 2.4vh 0 rgba(233,231,225,0.35),83.0vw 83.6vh 0 rgba(233,231,225,0.7),93.8vw 76.9vh 0 rgba(233,231,225,0.25),93.0vw 96.9vh 0 rgba(233,231,225,0.35),76.5vw 86.9vh 0 rgba(233,231,225,0.25),91.5vw 0.0vh 0 rgba(233,231,225,0.7),42.4vw 83.8vh 0 rgba(233,231,225,0.35),86.8vw 65.3vh 0 rgba(233,231,225,0.5),43.4vw 21.8vh 0 rgba(233,231,225,0.5),26.6vw 42.9vh 0 rgba(233,231,225,0.7),27.7vw 25.6vh 0 rgba(233,231,225,0.25),67.5vw 12.1vh 0 rgba(233,231,225,0.7),5.5vw 58.1vh 0 rgba(233,231,225,0.35),33.0vw 11.8vh 0 rgba(233,231,225,0.25),1.2vw 0.2vh 0 rgba(233,231,225,0.5),97.7vw 45.5vh 0 rgba(233,231,225,0.25),81.4vw 46.7vh 0 rgba(233,231,225,0.7),35.7vw 21.1vh 0 rgba(233,231,225,0.35),78.8vw 57.1vh 0 rgba(233,231,225,0.7),37.3vw 74.8vh 0 rgba(233,231,225,0.5),1.7vw 81.0vh 0 rgba(233,231,225,0.5),19.3vw 64.9vh 0 rgba(233,231,225,0.7),67.8vw 93.2vh 0 rgba(233,231,225,0.25),69.8vw 1.8vh 0 rgba(233,231,225,0.5),91.9vw 44.3vh 0 rgba(233,231,225,0.25),39.8vw 51.1vh 0 rgba(233,231,225,0.25),1.0vw 31.3vh 0 rgba(233,231,225,0.25),74.8vw 41.8vh 0 rgba(233,231,225,0.7),46.0vw 69.7vh 0 rgba(233,231,225,0.25),82.2vw 92.0vh 0 rgba(233,231,225,0.7),2.2vw 56.1vh 0 rgba(233,231,225,0.35),6.3vw 87.8vh 0 rgba(233,231,225,0.7),34.1vw 12.6vh 0 rgba(233,231,225,0.25),50.5vw 40.6vh 0 rgba(233,231,225,0.25),46.8vw 18.5vh 0 rgba(233,231,225,0.5),50.3vw 42.8vh 0 rgba(233,231,225,0.35),17.4vw 50.7vh 0 rgba(233,231,225,0.25)}

/* ============ سماء نهارية — صفحة الطقس وحدها ============
   الفلك دائماً داكن؛ الطقس نهاريّ بطبيعته. صنف واحد يعيد كل متغيّر لوني،
   فيتبعه الموقع كلّه (نجوم مطفأة، بطاقات زجاجية، ألوان النصّ) بلا لمس مكوّن. */
/* ═══ الثيم الفاتح — نظام واحد لا اثنان ═══
   كانت صفحة الطقس تعرّف أحد عشر رمزاً لونياً بنفسها، فصار للموقع لوحتان
   متوازيتان: أي تغيير في الكهرمانيّ يلزمه تعديل في موضعين.
   هنا **الرموز الدلالية مشتركة** لأي صفحة فاتحة، **والسماء وحدها خاصة
   بالطقس** (الخلفية والزجاج والحدّ الشفاف أدناه) — لأنها معالجة بصرية لا
   نظام لون.

   والقيم مأخوذة **بأفضل مُتحقَّق من اللوحتين**، لا بتبنّي إحداهما:
     ink  من اللوحة الأصلية (13.44:1 مقابل 11.22)
     ink2 وmuted من لوحة الطقس (8.62 و5.65 مقابل 7.61 و4.47)
     teal وrust ورose من الأصلية (5.20 و4.54 و4.82 مقابل 3.66 و3.75)
     amber جديد: كلاهما كان يسقط (3.14 و2.86)، و#8a5510 يبلغ 4.70
   وكلّها ≥4.5:1 على الخلفيات الثلاث: الورق والسماء والزجاج — مقيسة لا مقدَّرة. */
body.light{
  --bg:#FAF8F4; --panel:#FFFFFF; --panel2:#F1ECE2;
  --ink:#16181F; --ink2:#1f3d52; --muted:#375876; --line:#DEDAD2;
  --amber:#8a5510; --teal:#24645F; --rust:#A04A2C; --rose:#8E4A62;
  --amber-fill:#c26f12;   /* حشواً لا نصّاً — انظر التعليق في :root */
}
/* والطقس يرث ما سبق، ولا يعيد إلا ما تفرضه السماء: خلفيتها، وزجاج البطاقات
   فوقها، وحدّ شفاف يناسب الزجاج. أربعة رموز بدل أحد عشر. */
body.weather-light{
  --bg:#cfe3f2; --panel:rgba(255,255,255,.50); --panel2:rgba(255,255,255,.72);
  --line:rgba(15,42,61,.16);
}
/* السماء تنزلق مع الصفحة ولا تُثبَّت. والتثبيت (كما كان) يعيد شريط
   الداكن↖الفاتح في كل ملء شاشة، فيتبدّل ما خلف النصّ بحسب موضع التمرير
   ولا يثبت تباينٌ واحد. هنا: سماء داكنة حقيقية في نطاق الترويسة وحده،
   ثم لونٌ فاتح موحَّد لكل ما بعدها — فالتباين معلوم مقدَّماً. */
body.weather-light{
  background:linear-gradient(180deg,#2b5f98 0,#31659e 260px,#3a70a8 430px,
    #5c92c6 540px,#9cc1e1 620px,#cfe3f2 700px) no-repeat,#cfe3f2;
}
/* ترويسة عالية: شريط سحاب نظيف أعلاها، والنصّ تحته على أزرق خالص — فلا
   تمرّ سحابة خلف حرف. */
body.weather-light .hero{padding-top:17.5rem}
body.weather-light .sky{display:none}
body.weather-light nav{background:color-mix(in srgb,#bfe0f2 55%,transparent)}
/* الزرّ الممتلئ على الثيم الفاتح: حشوٌ مضيء ونصٌّ داكن. وكان نصّه بلون
   الخلفية الفاتحة على حشو كهرماني — 2.86:1، وهو إخفاق قائم قبل هذا العمل
   لا نتيجة له. والداكن على الحشو نفسه يبلغ 4.71:1. */
body.light .btn.solid,body.light .btn:hover{color:var(--ink)}
/* أعلى التدرّج أزرقُ داكن بعد تغميقه، فنصّ الترويسة يُقلَب إلى فاتح — ولولا
   ذلك لصار الرماديّ على الأزرق الداكن بالكاد يُقرأ (وقع فعلاً عند التغميق).
   والعنوان يبقى داكناً لأنه يقع على السحب البيضاء لا على السماء. */
/* نصّ الترويسة كلّه فاتح على الأزرق الداكن — ولا لون واحد يصلح لو مرّت
   السحابة خلفه (فاتح على سحابة بيضاء يختفي، وداكن على سماء داكنة يختفي)،
   ولذلك تُزاح السحب أسفل النصّ لا خلفه. انظر ‎.cloud‎ أدناه. */
body.weather-light .hero h1{color:#fff}
body.weather-light .hero .eyebrow{color:#dbeaf7}
body.weather-light .hero .lede{color:#eaf3fa}
/* الكهرماني الرفيع على السماء الزرقاء لا يُقرأ (قيس فعلاً: 1.8:1)، فيوضع
   على رقعة كهرمانية فاتحة تحفظ هويّة اللون وترفع التباين إلى 6.4:1. */
body.weather-light .sec-head .tag{color:#7d4200;background:#ffe3bd;
  padding:.14rem .58rem;border-radius:999px;
  border:1px solid rgba(125,66,0,.20)}
body.weather-light .stats div,body.weather-light .gauge-item,
body.weather-light .crit-list li,body.weather-light .scroll,
body.weather-light table{
  background:var(--panel);backdrop-filter:blur(14px) saturate(1.3);
  -webkit-backdrop-filter:blur(14px) saturate(1.3);
  border:1px solid rgba(255,255,255,.5);box-shadow:0 4px 18px rgba(20,60,90,.10)}
body.weather-light .stats div,body.weather-light .gauge-item{border-radius:16px}
body.weather-light th{background:rgba(255,255,255,.35)}
body.weather-light a{color:#0d6e93}
body.weather-light .sec-head{border-bottom-color:rgba(15,42,61,.14)}

/* غيوم بمحيط حقيقي (svg دوائر متراكبة، انظر _cloud_svg) تنجرف ببطء —
   لا تمويه تجريدي بلا حواف كما كان. أربع سحب بأحجام وأعماق مختلفة. */
/* مطلقة لا ثابتة: الثابتة تطفو فوق الجداول والرسوم في وسط الصفحة فتزاحم
   النصّ (وقع فعلاً). السحب تسكن نطاق السماء أعلى الصفحة وتنزلق مع التمرير. */
body.weather-light{position:relative;overflow-x:hidden}
.clouds{position:absolute;top:0;inset-inline:0;height:700px;
  pointer-events:none;z-index:0;overflow:hidden}
.cloud{position:absolute;filter:drop-shadow(0 10px 18px rgba(15,42,61,.18))}
/* المواضع بالبكسل لا بـvh (نطاق السماء ثابت 620px، والوحدة النسبية تُخرج
   السحابة عنه في الشاشات الطويلة)، وكلّها **أسفل نصّ الترويسة** (ينتهي عند
   ‎308px‎) لا خلفه — فالسحابة البيضاء خلف نصّ فاتح تمحوه. وهي هناك أقرب
   إلى الأفق، وهو موضعها الطبيعي أصلاً. */
.cloud.c1{top:52px;inset-inline-start:-12vw;width:min(46vw,440px);opacity:.97;
  animation:driftA 140s linear infinite}
.cloud.c2{top:120px;inset-inline-start:34vw;width:min(30vw,310px);opacity:.85;
  animation:driftB 175s linear infinite}
.cloud.c3{top:74px;inset-inline-start:66vw;width:min(26vw,250px);opacity:.92;
  animation:driftA 115s linear infinite reverse}
.cloud.c4{top:186px;inset-inline-start:6vw;width:min(20vw,190px);opacity:.55;
  animation:driftB 200s linear infinite}
@keyframes driftA{from{transform:translateX(0)}to{transform:translateX(16vw)}}
@keyframes driftB{from{transform:translateX(0)}to{transform:translateX(-14vw)}}
@media (prefers-reduced-motion:reduce){.cloud{animation:none}}
/* في الشاشات الضيّقة يلتفّ شريط التنقّل إلى ثلاثة صفوف (≈160px) فيدفع كل
   ما تحته، فتختفي السحب خلفه ويتّسع فراغ الترويسة. مقاسات نطاق السماء
   والسحب والحشو تُعاد هنا بحيث يبقى الترتيب نفسه: سحبٌ ثم نصّ على أزرق. */
@media (max-width:640px){
  body.weather-light{
    background:linear-gradient(180deg,#2b5f98 0,#31659e 300px,#3a70a8 470px,
      #4f88bf 560px,#9cc1e1 640px,#cfe3f2 720px) no-repeat,#cfe3f2}
  body.weather-light .hero{padding-top:11rem}
  .clouds{height:720px}
  .cloud.c1{top:175px;width:70vw}
  .cloud.c2{top:210px;width:52vw}
  .cloud.c3{top:185px;width:44vw}
  .cloud.c4{top:245px;width:36vw}
}

/* **اللصوق للشريط وحده.** وكانت القاعدة على `nav` عنصراً، فورثها
   `<nav class="crumbs">`: فتاتٌ لاصقٌ عند `top:0` وبـ`z-index:50` يزاحم
   الشريطَ على الموضع نفسه. والصنفُ الصريح يمنع توارثاً كهذا مستقبلاً. */
.site-nav{position:sticky;top:0;z-index:50;
  background:color-mix(in srgb,var(--bg) 82%,transparent);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav-in{max-width:76rem;margin:0 auto;padding:.65rem 1.2rem;
  display:flex;align-items:center;gap:1.2rem}
/* سطح المكتب: اللوحةُ كأنّها ليست هناك — أبناؤها في صفّ `.nav-in` نفسه،
   والزرُّ مخفيّ. **وظهورُ الروابط من كون اللوحة مفتوحةً في الترميز**، لا من
   قاعدةٍ تُكره محتوى `<details>` مغلقة على الظهور: تلك تُخرجها بعرض صفر
   داخل صندوق المحتوى المطويّ، وقد وقع ذلك فعلاً. */
.nav-panel{display:contents}
.nav-btn{display:none}
.brand{font-family:var(--f-head);font-weight:700;color:var(--amber);
  text-decoration:none;font-size:var(--fs-6)}
.nav-links{display:flex;gap:1.1rem;margin-inline-start:auto;align-items:center}
/* عناصر المستوى الأعلى: رابطٌ مباشر أو `summary`. ولا hover يفتح شيئاً —
   الفتح بالنقر واللمس والمفتاح، و`<details>` تتكفّل به بلا سطر JS. */
.nav-links .top{color:var(--ink2);text-decoration:none;font-size:var(--fs-4);
  font-family:var(--f-head);padding-bottom:.2rem;border-bottom:2px solid transparent;
  display:inline-block}
.nav-links .top:hover{color:var(--amber)}
.nav-links .top.on{color:var(--amber);border-color:var(--amber)}
.dd-wrap{position:relative}
summary.top{cursor:pointer;list-style:none;user-select:none}
summary.top::-webkit-details-marker{display:none}
summary.top::after{content:'▾';font-size:.8em;margin-inline-start:.3rem;opacity:.75}
details[open] > summary.top::after{content:'▴'}
summary.top:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:4px}
/* لوحة المنسدلة: تُطبَق فوق المحتوى ولا تزيح التخطيط، ولها سقفُ ارتفاع
   وتمريرٌ داخليّ — فقائمةٌ أطول من الشاشة لا يسقط آخرها بلا وصول. */
/* الصفحة RTL. ولو أُرسيت اللوحة بحافّة `summary` الأولى لنمَت **يساراً**
   فخرجت عن الشاشة (قِيس فعلاً: ‎-79px‎ ثم ‎-26px‎ بعد إزاحة الصفّ). فتُرسى
   بحافّتها الأخرى وتنمو **يميناً نحو وسط الصفحة** — والشريط مدفوعٌ إلى
   اليسار بـ`margin-inline-start:auto`، فما ينمو يميناً محتوىً بالبناء لا
   بحيلةٍ موضعية. (وقاعدة `:last-of-type` جُرّبت فانكسرت بأول إزاحة.) */
/* **والإرساءُ انقلب** حين خرج بندُ «الرئيسية» من الشريط (١٢ أغسطس ٢٠٢٦):
   انزاحت المنسدلات إلى اليمين، فصارت لوحةُ أولاها تتجاوز حافّة الشاشة
   بخمسة بكسلات عند ‎1280‎ ودونها. فأُرسيت بالحافّة المقابلة وصارت تنمو نحو
   وسط الصفحة — مقيسٌ سليماً من ‎645‎ إلى ‎1440‎. */
.dd{position:absolute;top:calc(100% + .6rem);inset-inline-start:0;z-index:60;
  min-width:15rem;max-width:min(22rem,calc(100vw - 2rem));
  max-height:min(70vh,26rem);overflow-y:auto;overscroll-behavior:contain;
  background:var(--panel);border:1px solid var(--line);border-radius:10px;
  padding:.45rem;display:flex;flex-direction:column;gap:.1rem;
  box-shadow:0 12px 34px rgba(0,0,0,.34)}
.dd a{display:block;padding:.44rem .6rem;border-radius:7px;text-decoration:none;
  color:var(--ink2);font-family:var(--f-head);font-size:var(--fs-4);
  border-bottom:0;white-space:nowrap}
.dd a:hover{background:var(--panel2);color:var(--amber)}
.dd a[aria-current="page"]{color:var(--amber);background:var(--panel2)}
.dd a.star{color:var(--amber)}
.dd-g{font-family:var(--f-head);font-size:var(--fs-3);color:var(--muted);
  padding:.5rem .6rem .2rem;letter-spacing:0}
.dd-g:first-child{padding-top:.2rem}
/* عنوانُ مجموعةٍ صار وجهةً — فيسلك سلوكَ الروابط في التركيز والتحويم */
a.dd-g-link{display:block;text-decoration:none;border-radius:7px;
  padding-bottom:.34rem}
a.dd-g-link:hover{background:var(--panel2);color:var(--amber)}
/* لمحة أربعة عشر يوماً — شبكةٌ مضغوطة تُمسَح بنظرة. خمسة حقول لكل خانة،
   واحتمال الهطول ثابتٌ فيها ولو كان صفراً فتتساوى الخانات. */
.ds-list{list-style:none;padding:0;margin:0;display:grid;gap:.5rem;
  grid-template-columns:repeat(auto-fill,minmax(7.2rem,1fr))}
.ds-cell{background:var(--panel);border:1px solid var(--line);border-radius:10px;
  padding:.6rem .5rem;display:flex;flex-direction:column;align-items:center;
  gap:.25rem;text-align:center}
.ds-cell b[data-k="day"]{font-family:var(--f-head);font-size:var(--fs-4);color:var(--ink)}
.ds-cell i[data-k="date"]{font-style:normal;font-size:var(--fs-3);color:var(--muted)}
.ds-ico{display:block;height:26px;color:var(--amber)}
.ds-ico svg,svg.ds-svg{width:26px;height:26px}
.ds-t{font-family:var(--f-mono);font-variant-numeric:tabular-nums;
  display:flex;gap:.4rem;align-items:baseline}
.ds-t b{color:var(--rust);font-size:var(--fs-5)}
.ds-t i{font-style:normal;color:var(--teal);font-size:var(--fs-4)}
.ds-pop{display:flex;align-items:center;gap:.22rem;color:var(--muted);
  font-family:var(--f-mono);font-size:var(--fs-3)}
.ds-pop svg{width:13px;height:13px}
@media (max-width:640px){
  .ds-list{grid-template-columns:repeat(auto-fill,minmax(5.6rem,1fr));gap:.4rem}
  .ds-cell{padding:.5rem .3rem}
}

/* فتات المسار — مشتقّ من بطاقة الصفحة، وموضعه تحت الشريط مباشرة.
   **وساكنٌ صراحةً**: لا يلتصق ولا يزاحم الشريطَ على `top` ولا على الطبقة. */
.crumbs{position:static;z-index:auto;
  border-bottom:1px solid var(--line);background:transparent}
.crumbs-in{max-width:76rem;margin:0 auto;padding:.5rem 1.2rem;
  font-family:var(--f-head);font-size:var(--fs-3);color:var(--muted);
  display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
.crumbs a{color:var(--ink2);text-decoration:none;border-bottom:1px solid transparent}
.crumbs a:hover{color:var(--amber);border-color:var(--amber)}
.crumbs [aria-current="page"]{color:var(--amber)}
.crumb-sep{opacity:.55}
body.weather-light .crumbs{background:color-mix(in srgb,#bfe0f2 45%,transparent)}
.attrib{font-size:var(--fs-3);opacity:.9}
/* وفي النطاق الضيّق من سطح المكتب (‎641‎–‎760‎) لا تتّسع الشاشة للوحةٍ مطلقة
   بجوار آخر بند، فتمتدّ بين حافّتَي الشريط كما في الهاتف — **والشريط نفسه
   يبقى شريطَ سطح مكتب**، فلا يتغيّر حدُّ زرّ القائمة. */
@media (min-width:641px) and (max-width:760px){
  .dd-wrap{position:static}
  .dd{inset-inline:.6rem;min-width:0;max-width:none}
}

/* ═══ الهاتف: تصميمٌ للهاتف، لا التفافُ شريطِ سطح المكتب ═══
   كان `flex-wrap` وحده استراتيجيةَ الضيق، فيبلغ الشريط ‎109px‎ دون ‎480‎
   و‎158px‎ دون ‎360‎ — خُمسَ الشاشة، ولاصقاً أبداً. وصار: **الشريط سطرٌ
   واحد** فيه الهويةُ وزرُّ القائمة، واللوحةُ تنسدل تحته بعرض الشاشة.

   **والمنسدلات داخلها تتدفّق سطراً سطراً لا مطلقةً** — فلا تخرج عن الشاشة
   ولا تتراكب اثنتان بحالٍ، والتراكبُ صار مستحيلاً بالبناء لا بالضبط. */
@media (max-width:640px){
  .nav-panel{position:static;display:block;margin-inline-start:auto}
  .nav-btn{display:inline-flex;align-items:center;gap:.4rem;cursor:pointer;
    list-style:none;user-select:none;font-family:var(--f-head);
    font-size:var(--fs-4);color:var(--ink2);
    border:1px solid var(--line);border-radius:9px;padding:.32rem .7rem}
  .nav-btn::-webkit-details-marker{display:none}
  .nav-btn::before{content:'☰';font-size:1em;line-height:1}
  details.nav-panel[open] > .nav-btn{color:var(--amber);border-color:var(--amber)}
  details.nav-panel[open] > .nav-btn::before{content:'✕'}
  .nav-btn:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
  .nav-panel > .nav-links{position:absolute;inset-inline:.6rem;
    top:calc(100% + .5rem);flex-direction:column;align-items:stretch;
    gap:.15rem;margin:0;padding:.5rem;z-index:60;
    max-height:min(72vh,30rem);overflow-y:auto;overscroll-behavior:contain;
    background:var(--panel);border:1px solid var(--line);border-radius:12px;
    box-shadow:0 14px 38px rgba(0,0,0,.36)}
  .nav-links .top{display:block;padding:.5rem .6rem;border-bottom:0;
    border-radius:8px}
  .nav-links > .top.on{background:var(--panel2)}
  /* المنسدلة داخل اللوحة: تتدفّق، ولا تُطلَق فوق شيء */
  .dd-wrap{position:static}
  .dd{position:static;min-width:0;max-width:none;max-height:none;
    overflow:visible;background:transparent;border:0;box-shadow:none;
    padding:.1rem .1rem .35rem;
    margin-inline-start:.75rem;border-inline-start:1px solid var(--line)}
  .dd a{white-space:normal}
}

.hero{position:relative;z-index:1;max-width:76rem;margin:0 auto;
  padding:4.4rem 1.2rem 4rem;display:flex;flex-direction:column;gap:1.2rem}
.hero.tall{min-height:82vh;justify-content:center}
/* تباعد الأحرف صفرٌ في كل نصّ عربي — العربية خطّ متّصل، والتباعد
   الموجب يباعد حروفها فيترهّل الشكل. والمواضع الأربعة أدناه كانت
   ‎.14em‎ و‎.16em‎×٢ و‎.06em‎، وكلها محتواها عربيّ محض (فُحص في الصفحات
   الاثنتي عشرة المولَّدة). وأصلها من قالب لاتينيّ كان معه
   `text-transform:uppercase` — وهو لا معنى له في العربية. */
.hero .eyebrow{font-family:var(--f-head);font-size:var(--fs-3);letter-spacing:0;
  color:var(--muted);font-weight:700}
.hero h1{font-size:clamp(2.1rem,6.4vw,3.6rem);color:var(--amber);font-weight:700}
.hero .slogan{font-family:var(--f-head);font-size:clamp(1.05rem,2.8vw,1.4rem);color:var(--ink)}
.hero .sub{color:var(--ink2);max-width:48rem;font-size:var(--fs-6)}
.hero .cta{display:flex;gap:.9rem;flex-wrap:wrap;margin-top:.4rem}
.btn{display:inline-block;font-family:var(--f-head);font-weight:700;font-size:var(--fs-5);
  border:1px solid var(--amber);border-radius:10px;padding:.6rem 1.3rem;
  text-decoration:none;color:var(--amber);background:transparent;cursor:pointer}
.btn.solid{background:var(--amber-fill);color:var(--bg)}
.btn:hover{background:var(--amber-fill);color:var(--bg)}
.btn.ghost{border-color:var(--line);color:var(--ink2)}
.btn.ghost:hover{border-color:var(--muted);background:transparent;color:var(--ink)}

.horizon{position:relative;height:26vh;min-height:11rem;margin-top:1rem;
  border-radius:16px;overflow:hidden}
.horizon::before{content:"";position:absolute;inset:0;
  background:radial-gradient(120% 100% at 78% 100%,rgba(227,169,63,.22),transparent 62%)}
.horizon::after{content:"";position:absolute;left:0;right:0;bottom:38%;height:2px;
  background:linear-gradient(90deg,transparent,var(--line) 18%,var(--muted) 70%,transparent)}
.hstar{position:absolute;bottom:calc(38% + 8px);width:7px;height:7px;border-radius:50%;
  background:var(--amber);
  box-shadow:0 0 8px 2px rgba(227,169,63,.9),0 0 26px 8px rgba(227,169,63,.35);
  animation:tw 2.6s ease-in-out infinite}
.hstar::after{content:attr(data-label);position:absolute;bottom:14px;right:-6px;
  font-family:var(--f-head);font-size:var(--fs-3);color:var(--amber);white-space:nowrap}
@keyframes tw{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(.7);opacity:.75}}
@media (prefers-reduced-motion:reduce){.hstar{animation:none}}

.banner{position:relative;z-index:1;max-width:76rem;margin:0 auto;padding:0 1.2rem}
.banner img{width:100%;border-radius:14px;border:1px solid var(--line);display:block}

.next-box{border:2px solid var(--amber);border-radius:14px;
  background:color-mix(in srgb,var(--panel) 88%,transparent);
  padding:1.2rem 1.4rem;display:flex;flex-direction:column;gap:.8rem;
  width:fit-content;max-width:100%}
.nb-l{font-family:var(--f-head);font-size:var(--fs-2);letter-spacing:0;
  color:var(--amber);font-weight:700}
.nb-t{font-family:var(--f-head);font-size:clamp(1rem,2.6vw,1.25rem)}
.countdown .cd-grid{display:flex;gap:1.1rem;flex-wrap:wrap}
.cd-grid span{display:flex;flex-direction:column;align-items:center;min-width:3.4rem}
.cd-grid b{font-family:var(--f-mono);font-size:clamp(1.5rem,3.6vw,2.2rem);
  color:var(--amber);font-variant-numeric:tabular-nums;line-height:var(--lh-tight)}
.cd-grid i{font-style:normal;font-size:var(--fs-2);color:var(--muted);font-family:var(--f-head)}
.cd-grid[hidden]{display:none}
/* حالتا الزمن الصريحتان — لا أربعةُ أصفارٍ تُقرأ عدّاً وقد مضى الموعد */
.cd-past,.nb-none{margin:.4rem 0 0;font-family:var(--f-head);
  font-size:var(--fs-4);color:var(--muted);line-height:var(--lh-ui)}
.cd-past[hidden],.nb-none[hidden],[data-ev="body"][hidden]{display:none}
.next-box.is-past{border-color:var(--line)}
.next-box .more{display:inline-block;margin-top:.5rem}

.wrap{position:relative;z-index:1;max-width:76rem;margin:0 auto;
  padding:3.4rem 1.2rem 6rem;display:flex;flex-direction:column;gap:4.6rem}
.sec-head{display:flex;align-items:baseline;gap:.9rem;border-bottom:1px solid var(--line);
  padding-bottom:.6rem;margin-bottom:1.6rem;flex-wrap:wrap}
.sec-head h2{font-size:clamp(1.45rem,3.8vw,1.9rem)}
.sec-head .tag{font-family:var(--f-head);font-size:var(--fs-3);color:var(--amber);font-weight:700}
.lede{color:var(--ink2);max-width:48rem;margin-bottom:1rem}
.crit-list{color:var(--ink2);max-width:48rem;margin:0 0 1rem;padding-inline-start:1.3rem;
  display:flex;flex-direction:column;gap:.4rem}
.reveal{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.stats div{background:var(--panel);padding:1.2rem 1rem;display:flex;
  flex-direction:column;gap:.25rem;align-items:center;text-align:center}
.stats b{font-family:var(--f-mono);font-size:clamp(1.4rem,3.4vw,2rem);color:var(--amber)}
.stats span{font-size:var(--fs-4);color:var(--muted);line-height:var(--lh-ui)}

/* ═══ الشهر في شريط — يومٌ لكل خانة، والمعلَّم عليه يوم حدث ═══
   auto-fill لا repeat(29) — فعدد أيام الشهر الهجري يتغيّر (29 أو 30)،
   والشريط يلتفّ من نفسه على الشاشة الضيّقة بلا استعلام مقاس. */
.mstrip{display:grid;grid-template-columns:repeat(auto-fill,minmax(1.7rem,1fr));
  gap:.28rem;margin-bottom:.9rem}
.mday{aspect-ratio:1;display:grid;place-items:center;border-radius:5px;
  background:var(--panel);border:1px solid var(--line);
  font-size:var(--fs-1);color:var(--muted);font-variant-numeric:tabular-nums}
.mday.hit{background:var(--ac,var(--amber));border-color:var(--ac,var(--amber));
  color:var(--bg);font-weight:700}
/* أول يوم من شهر هجريّ — يُرى الانتقال بدل أن يُقرأ رقمٌ يعود إلى الواحد */
.mday.mstart{border-inline-start:3px solid var(--teal)}
.mday.today{outline:2px solid var(--teal);outline-offset:1px}
.mkey{display:flex;flex-wrap:wrap;gap:.4rem 1.1rem;font-size:var(--fs-1);
  color:var(--muted);margin-bottom:.4rem}
.mkey b{color:var(--ink);font-weight:600}
.sm-stale{margin-top:.7rem;padding:.7rem .9rem;border-radius:10px;
  border:1px solid var(--rust);background:color-mix(in srgb,var(--rust) 9%,transparent);
  font-size:var(--fs-3);color:var(--ink2);line-height:var(--lh-ui)}
.sm-stale[hidden],[data-sm-body][hidden]{display:none}
.mkey i{display:inline-block;width:.7rem;height:.7rem;border-radius:2px;
  background:var(--ac,var(--amber));vertical-align:-1px;margin-inline-end:.35rem}
/* طرفا الشريط — أوّله يميناً وآخره يساراً، وبينهما طبيعةُ المدى */
.mends{display:flex;justify-content:space-between;align-items:flex-start;
  gap:.8rem;margin-top:.5rem;font-size:var(--fs-1);color:var(--muted)}
.me{display:flex;flex-direction:column;line-height:1.35;
  border-top:2px solid var(--line);padding-top:.3rem;min-width:5.5rem}
.me.lt{text-align:left}
.me b{color:var(--ink);font-weight:600}
.mn{flex:1;text-align:center;padding-top:.45rem;font-style:normal}
@media (max-width:34rem){.mn{display:none}}
.evs{display:grid;grid-template-columns:repeat(auto-fill,minmax(21rem,1fr));gap:1.3rem}
.ev{background:var(--panel);border:1px solid var(--line);border-radius:14px;
  padding:1.3rem 1.4rem;display:flex;flex-direction:column;gap:.75rem;
  border-top:3px solid var(--ac,var(--amber));text-decoration:none;color:inherit}
a.ev{transition:transform .2s ease,box-shadow .2s ease}
a.ev:hover{transform:translateY(-3px);
  box-shadow:0 16px 34px -18px color-mix(in srgb,var(--ac) 60%,transparent)}
.ev.next{box-shadow:0 0 0 2px var(--ac),0 14px 44px -18px color-mix(in srgb,var(--ac) 55%,transparent)}
.ev.past{opacity:.55}
.ev-top{display:flex;align-items:center;justify-content:space-between;gap:.6rem}
.chip{font-family:var(--f-head);font-size:var(--fs-2);font-weight:700;color:var(--ac);
  border:1px solid var(--ac);border-radius:8px;padding:.14rem .6rem;width:fit-content}
.st{font-family:var(--f-head);font-size:var(--fs-2);font-weight:700;color:var(--muted);
  border:1px solid var(--line);border-radius:8px;padding:.14rem .6rem}
.ev.next .st{color:var(--ac);border-color:var(--ac)}
.ev h3{font-size:var(--fs-8);color:var(--ink)}
.dates{display:flex;flex-wrap:wrap;gap:.45rem;color:var(--muted);font-size:var(--fs-4)}
.dates .sep{opacity:.5}
.dates .t{font-family:var(--f-mono)}
.dates small{font-family:var(--f-body);color:var(--muted)}
.ev-body{display:grid;grid-template-columns:minmax(8rem,10.5rem) 1fr;
  gap:1rem;align-items:center}
svg.dial{width:100%;height:auto;display:block}
.dring{fill:none;stroke:var(--line);stroke-width:1.4}
.dring.faint{stroke-dasharray:2 4;opacity:.6}
.dtick{stroke:var(--line);stroke-width:1}
.dtick.major{stroke:var(--muted);stroke-width:1.5}
.dlbl{font-family:var(--f-body);font-size:9.5px;fill:var(--muted);
  text-anchor:middle;dominant-baseline:middle}
.dlbl.main{font-family:var(--f-head);font-weight:700;fill:var(--ink2);font-size:10.5px}
.dray{stroke-width:3;stroke-linecap:round}
.dobs{fill:var(--muted)}
/* ═══ الطقس الآن الحيّ — هيكل عظمي بارتفاعات محجوزة ═══
   البطاقة والعدّاد يأخذان مقاسهما النهائي قبل وصول الردّ، فلا ينزاح
   شيء تحتهما حين يصل (لا CLS). والوميض يتوقّف مع تفضيل تقليل الحركة. */
#liveNow .stat-icon{min-height:74px}
#liveNow .gauge-item{min-height:200px}
#liveNow .lv-v{display:inline-block;min-width:3.4rem}
#liveNow.lv-loading .lv-v,
#liveNow.lv-loading .lv-when{background:linear-gradient(90deg,
   var(--line) 25%,var(--panel2) 37%,var(--line) 63%);
  background-size:400% 100%;border-radius:6px;color:transparent;
  animation:lvshine 1.4s ease infinite}
#liveNow.lv-loading .lv-when{display:inline-block;min-width:22rem;max-width:100%}
#liveNow.lv-loading .gauge-lbl{opacity:.45}
#liveNow .lv-needle{transition:transform .5s cubic-bezier(.4,1.4,.5,1)}
/* الإبرة تُخفى قبل وصول الردّ: إبرة عند أدنى المدى تُقرأ «ضغط منخفض»
   و«رياح شمالية»، وهذا رقم لم يصل بعدُ — إخفاؤها أصدق من إظهار صفر. */
#liveNow:not(.lv-ready) .lv-needle{visibility:hidden}
#liveNow .lv-uv-mark{transition:cx .5s ease}
@keyframes lvshine{from{background-position:100% 0}to{background-position:0 0}}
@media (prefers-reduced-motion:reduce){
  #liveNow.lv-loading .lv-v,#liveNow.lv-loading .lv-when{animation:none}
  #liveNow .lv-needle,#liveNow .lv-uv-mark{transition:none}}
/* ═══ الشمس والقمر — سبعة أيام محسوبة مسبقاً ═══
   لا هيكل عظمي ولا حالة فشل هنا: القسم مولَّد كاملاً وقت البناء. */
.sm-week{list-style:none;margin:1rem 0 0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:.6rem}
/* صفّ واحد بسبعة أعمدة على العريض: auto-fit وحده يعطي ٦ فيهبط السابع وحيداً */
@media (min-width:980px){.sm-week{grid-template-columns:repeat(7,minmax(0,1fr))}}
.sm-card{background:var(--panel);border:1px solid var(--line);border-radius:13px;
  padding:.8rem .85rem;display:flex;flex-direction:column;gap:.55rem}
.sm-card.today{border-color:var(--amber);
  background:color-mix(in srgb,var(--amber) 10%,var(--panel))}
.sm-head{display:flex;align-items:baseline;justify-content:space-between;gap:.4rem}
.sm-head b{font-size:var(--fs-5);color:var(--ink);font-weight:600}
.sm-card.today .sm-head b{color:var(--amber)}
.sm-head i{font-style:normal;font-size:var(--fs-2);color:var(--muted);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.sm-moon{display:flex;align-items:center;gap:.6rem}
.sm-moon svg{flex:none}
.sm-phase{min-width:0}
.sm-phase b{display:block;font-size:var(--fs-3);color:var(--amber);font-weight:600;
  line-height:var(--lh-tight)}
.sm-phase span{font-size:var(--fs-2);color:var(--muted);font-variant-numeric:tabular-nums}
.sm-rows{margin:0;padding:.5rem 0 0;border-top:1px solid var(--line);
  display:flex;flex-direction:column;gap:.22rem}
.sm-rows > div{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.sm-rows dt{display:flex;align-items:center;gap:.3rem;font-size:var(--fs-2);
  color:var(--ink2);margin:0}
.sm-rows dt .wicon{width:15px;height:15px;flex:none;opacity:.85}
.sm-rows dd{margin:0;font-size:var(--fs-3);font-weight:600;color:var(--ink);
  font-variant-numeric:tabular-nums;white-space:nowrap}

/* ═══ الحالة الآن: الحرارة والأيقونة والعظمى/الصغرى في صفٍّ واحد ═══
   العظمى والصغرى **بجوار** الحرارة عمداً — القارئ يسألهما معها. */
.lv-hero{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;
  margin:.2rem 0 1.1rem}
.lv-icon{flex:none;display:flex;align-items:center}
.lv-bigsvg{width:62px;height:62px;color:var(--amber)}
.lv-temp{font-family:var(--f-mono);font-size:3.1rem;line-height:1;font-weight:700;
  color:var(--ink);font-variant-numeric:tabular-nums}
.lv-side{display:flex;flex-direction:column;gap:.18rem;min-width:0}
.lv-cond{font-family:var(--f-head);font-size:var(--fs-6);color:var(--ink2);
  font-weight:700}
.lv-upd{color:var(--muted);font-variant-numeric:tabular-nums}
.lv-mm{display:flex;align-items:baseline;gap:.35rem;flex-wrap:wrap;
  font-variant-numeric:tabular-nums}
.lv-mm i{font-style:normal;font-size:var(--fs-1);color:var(--muted)}
.lv-mm b{font-size:var(--fs-5);color:var(--rust);font-weight:700}
.lv-mm b + i + b{color:var(--teal)}
.lv-mm.sub b{font-size:var(--fs-3);color:var(--ink2);font-weight:600}
#liveNow:not(.lv-ready) .lv-bigsvg{opacity:.18}

/* ═══ الساعات الخمس القادمة — ستّ خانات، ثلاثة أرقام لكلٍّ ═══ */
.n5-strip{list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));gap:.4rem;min-height:104px}
.n5-cell{background:var(--panel);border:1px solid var(--line);border-radius:11px;
  padding:.6rem .3rem;display:flex;flex-direction:column;align-items:center;
  gap:.3rem;text-align:center}
.n5-cell:first-child{border-color:var(--amber);
  background:color-mix(in srgb,var(--amber) 10%,var(--panel))}
.n5-t{font-size:var(--fs-2);color:var(--ink2);font-variant-numeric:tabular-nums;
  white-space:nowrap}
.n5-cell:first-child .n5-t{color:var(--amber);font-weight:700}
.n5-i{height:26px;display:flex;align-items:center}
.n5-svg{width:24px;height:24px;color:var(--ink2)}
.n5-cell:first-child .n5-svg{color:var(--amber)}
.n5-v{font-size:var(--fs-6);font-weight:700;color:var(--ink);
  font-variant-numeric:tabular-nums}
#liveNext5:not(.n5-ready) .n5-t,#liveNext5:not(.n5-ready) .n5-v{opacity:.25}
@media (max-width:38rem){
  .n5-strip{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ═══ ٤٨ ساعة بفترات اليوم — جدول يُمرَّر أفقياً، والزمن يمينَ يسار ═══
   التمرير داخل الصندوق وحده فلا تُجرّ الصفحة، والعمود الأول لاصقٌ فتبقى
   أسماء الصفوف مرئية مع التمرير. */
.pt-scroll{overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;
  -webkit-overflow-scrolling:touch;min-height:340px}
.pt-table{border-collapse:collapse;width:max-content;min-width:100%;
  font-variant-numeric:tabular-nums}
.pt-table th,.pt-table td{padding:.4rem .7rem;text-align:center;
  border-bottom:1px solid var(--line);white-space:nowrap;font-size:var(--fs-3)}
.pt-table tbody tr:last-child td,.pt-table tbody tr:last-child th{border-bottom:none}
.pt-h{position:sticky;inset-inline-start:0;z-index:2;background:var(--bg);
  text-align:right;color:var(--muted);font-size:var(--fs-2);font-weight:600;
  border-inline-end:1px solid var(--line)}
body.weather-light .pt-h{background:var(--paper,#EAF3FB)}
.pt-day{font-family:var(--f-head);font-size:var(--fs-5);color:var(--ink);
  border-bottom:2px solid var(--amber)}
.pt-day i{font-style:normal;font-size:var(--fs-2);color:var(--muted);
  margin-inline-start:.35rem}
.pt-part{color:var(--ink2);font-weight:600;font-size:var(--fs-2)}
.pt-part i{display:block;font-style:normal;font-size:var(--fs-1);color:var(--muted)}
.pt-ico{padding-block:.2rem}
.pt-svg{width:22px;height:22px;color:var(--amber)}
#liveParts:not(.pt-ready) .pt-scroll{opacity:.25}

/* ═══ أربعة عشر يوماً — بطاقة لكل يوم، بأربع مجموعات ═══ */
.dq-list{list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fill,minmax(15.5rem,1fr));gap:.7rem}
.dq-card{background:var(--panel);border:1px solid var(--line);border-radius:13px;
  padding:.85rem .9rem;display:flex;flex-direction:column;gap:.5rem}
.dq-head{display:flex;align-items:baseline;gap:.45rem;
  border-bottom:1px solid var(--line);padding-bottom:.45rem}
.dq-ico{flex:none;align-self:center;display:flex}
.dq-svg{width:26px;height:26px;color:var(--amber)}
.dq-head b{font-family:var(--f-head);font-size:var(--fs-5);color:var(--ink)}
.dq-head i{font-style:normal;font-size:var(--fs-2);color:var(--muted);
  margin-inline-start:auto;font-variant-numeric:tabular-nums}
.dq-g h4{margin:0 0 .15rem;font-family:var(--f-body);font-size:var(--fs-1);
  color:var(--muted);font-weight:600}
.dq-g dl{margin:0;display:flex;flex-direction:column;gap:.12rem}
.dq-g dl > div{display:flex;justify-content:space-between;gap:.6rem}
.dq-g dt{margin:0;font-size:var(--fs-2);color:var(--ink2)}
.dq-g dd{margin:0;font-size:var(--fs-3);font-weight:600;color:var(--ink);
  font-variant-numeric:tabular-nums;white-space:nowrap}
#liveDays:not(.dq-ready) .dq-card{opacity:.3}

/* ═══ المرحلة ٩ — ملخّصا الرئيسية، وصفحة الشمس والقمر ═══ */
.brf,.rb{background:var(--panel);border:1px solid var(--line);border-radius:14px;
  padding:1rem 1.1rem;display:flex;flex-wrap:wrap;align-items:center;gap:.9rem}
.brf-ico{flex:none;display:flex}
.brf-svg{width:44px;height:44px;color:var(--amber)}
.brf-t{flex:1 1 8rem;min-width:0}
.brf-t b{display:block;font-family:var(--f-mono);font-size:clamp(1.6rem,4vw,2.2rem);
  color:var(--amber);line-height:1.1}
.brf-t span{display:block;font-size:var(--fs-3);color:var(--ink2)}
.rb b[data-k="head"]{flex:1 1 100%;font-family:var(--f-head);font-size:var(--fs-6);
  color:var(--ink);line-height:var(--lh-ui)}
.rb span[data-k="when"]{flex:1 1 12rem;font-size:var(--fs-3);color:var(--ink2);
  line-height:var(--lh-ui)}
.rb.rb-live{border-color:var(--amber)}
.brf .more,.rb .more{margin-inline-start:auto}
.brf:not(.brf-ready) .rf-kv,.rb:not(.rb-ready) .rf-kv{opacity:.35}

.dl-chart{width:100%;height:auto;display:block;margin-top:.4rem;
  border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.sm-table td i{font-style:normal;color:var(--muted);font-size:var(--fs-1)}
.ph-list{list-style:none;margin:0;padding:0;display:grid;gap:.5rem;
  grid-template-columns:repeat(auto-fill,minmax(13rem,1fr))}
.ph-list li{background:var(--panel);border:1px solid var(--line);border-radius:11px;
  padding:.6rem .8rem}
.ph-list b{display:block;font-family:var(--f-head);font-size:var(--fs-4);color:var(--ink)}
.ph-list span{display:block;font-size:var(--fs-2);color:var(--muted);
  font-variant-numeric:tabular-nums}

/* ═══ توقّعات الأمطار (المرحلة ٨أ) — سؤالها «متى تمطر وكم؟» ═══ */
.rf-sec{margin-top:1.5rem}
.rf-sec h3{margin:0 0 .6rem;font-family:var(--f-head);font-size:var(--fs-6);
  color:var(--ink)}
.rf-lead{background:var(--panel);border:1px solid var(--amber);border-radius:14px;
  padding:1rem 1.1rem;display:flex;flex-wrap:wrap;align-items:center;gap:.9rem}
.rf-lead.rf-none{border-color:var(--line)}
.rf-ico{flex:none;display:flex}
.rf-svg{width:40px;height:40px;color:var(--amber)}
.rf-lead-t{flex:1 1 12rem;min-width:0}
.rf-lead-t b{display:block;font-family:var(--f-head);font-size:var(--fs-6);
  color:var(--ink);line-height:var(--lh-ui)}
.rf-lead-t span{display:block;margin-top:.2rem;font-size:var(--fs-2);
  color:var(--muted);line-height:var(--lh-ui)}
.rf-kv{margin:0;display:flex;flex-wrap:wrap;gap:.4rem 1.4rem}
.rf-kv > div{display:flex;flex-direction:column;gap:.1rem}
.rf-kv dt{margin:0;font-size:var(--fs-1);color:var(--muted)}
.rf-kv dd{margin:0;font-family:var(--f-mono);font-size:var(--fs-5);
  color:var(--ink);font-variant-numeric:tabular-nums}
.rf-wins{list-style:none;margin:0;padding:0;display:grid;gap:.7rem;
  grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
.rf-w{background:var(--panel);border:1px solid var(--line);border-radius:12px;
  padding:.85rem .95rem}
.rf-w-h{border-bottom:1px solid var(--line);padding-bottom:.45rem;margin-bottom:.5rem}
.rf-w-h b{display:block;font-family:var(--f-head);font-size:var(--fs-4);color:var(--ink)}
.rf-w-h i{display:block;font-style:normal;font-size:var(--fs-1);color:var(--muted);
  font-variant-numeric:tabular-nums;margin-top:.15rem}
.rf-w dl{margin:0;display:flex;flex-direction:column;gap:.18rem}
.rf-w dl > div{display:flex;justify-content:space-between;gap:.6rem}
.rf-w dt{margin:0;font-size:var(--fs-2);color:var(--ink2)}
.rf-w dd{margin:0;font-size:var(--fs-3);font-weight:600;color:var(--ink);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.rf-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.rf-parts{border-collapse:collapse;width:max-content;min-width:100%;
  font-size:var(--fs-3)}
.rf-parts th,.rf-parts td{padding:.45rem .7rem;text-align:center;
  border-bottom:1px solid var(--line);white-space:nowrap;
  font-variant-numeric:tabular-nums}
.rf-parts thead th{color:var(--muted);font-size:var(--fs-2);font-weight:600}
.rf-parts tbody th{text-align:start;font-weight:400}
.rf-parts tbody th b{font-family:var(--f-head);color:var(--ink)}
.rf-parts tbody th i{font-style:normal;color:var(--ink2);margin-inline-start:.4rem}
.rf-parts tbody th span{display:block;font-size:var(--fs-1);color:var(--muted)}
.rf-c{display:flex;align-items:center;gap:.35rem;justify-content:center}
.rf-psvg{width:20px;height:20px;color:var(--amber);flex:none}
.rf-peak{background:var(--panel);border:1px solid var(--line);border-radius:12px;
  padding:.85rem .95rem}
.rf-days{list-style:none;margin:0;padding:0;display:grid;gap:.6rem;
  grid-template-columns:repeat(auto-fill,minmax(13rem,1fr))}
.rf-day{background:var(--panel);border:1px solid var(--line);border-radius:12px;
  padding:.75rem .85rem;display:flex;flex-direction:column;gap:.4rem}
.rf-day[hidden]{display:none}
.rf-d-h{display:flex;align-items:baseline;gap:.45rem;
  border-bottom:1px solid var(--line);padding-bottom:.4rem}
.rf-d-h b{font-family:var(--f-head);font-size:var(--fs-4);color:var(--ink)}
.rf-d-h i{font-style:normal;font-size:var(--fs-2);color:var(--muted);
  margin-inline-start:auto;font-variant-numeric:tabular-nums}
.rf-day dl{margin:0;display:flex;flex-direction:column;gap:.15rem}
.rf-day dl > div{display:flex;justify-content:space-between;gap:.6rem}
.rf-day dt{margin:0;font-size:var(--fs-2);color:var(--ink2)}
.rf-day dd{margin:0;font-size:var(--fs-3);font-weight:600;color:var(--ink);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.rf-type{align-self:flex-start;font-size:var(--fs-1);color:var(--ink2);
  border:1px solid var(--line);border-radius:999px;padding:.1rem .55rem}
.rf-type[hidden]{display:none}
.rf-thunder{margin-top:.7rem;padding:.5rem .8rem;border-radius:8px;
  border:1px solid var(--rust);background:color-mix(in srgb,var(--rust) 9%,transparent);
  font-size:var(--fs-3);color:var(--ink2);line-height:var(--lh-ui)}
.rf-thunder[hidden]{display:none}
#liveRain:not(.rf-ready) .rf-w,#liveRain:not(.rf-ready) .rf-day,
#liveRain:not(.rf-ready) .rf-peak{opacity:.35}
@media (max-width:520px){
  .rf-days{grid-template-columns:repeat(auto-fill,minmax(10.5rem,1fr))}
  .rf-kv{gap:.4rem 1rem}}

/* رسالة فشل موحَّدة لأقسام الطقس الحيّة الأربعة */
.wx-fail{margin-top:.8rem;padding:.85rem 1rem;border-radius:10px;
  border:1px solid var(--rust);background:color-mix(in srgb,var(--rust) 10%,transparent);
  font-size:var(--fs-5);line-height:var(--lh-ui)}
.wx-fail[hidden]{display:none}
.wx-age{margin-top:.6rem;padding:.5rem .8rem;border-radius:8px;
  border:1px solid var(--amber);background:color-mix(in srgb,var(--amber) 8%,transparent);
  font-size:var(--fs-2);color:var(--ink2)}
.wx-age[hidden]{display:none}
.wx-attrib{margin-top:.7rem;padding-top:.6rem;border-top:1px solid var(--line)}
.wx-fail button{margin-inline-start:.6rem;font:inherit;font-size:var(--fs-4);
  color:var(--bg);background:var(--amber);border:none;border-radius:7px;
  padding:.22rem .8rem;cursor:pointer}
.wx-fail button:hover{filter:brightness(1.08)}
.lv-fail{margin-top:.8rem;padding:.85rem 1rem;border-radius:10px;
  border:1px solid var(--rust);background:color-mix(in srgb,var(--rust) 10%,transparent);
  font-size:var(--fs-5);line-height:var(--lh-ui)}
.lv-fail button{margin-inline-start:.6rem;font:inherit;font-size:var(--fs-4);
  color:var(--bg);background:var(--amber);border:none;border-radius:7px;
  padding:.22rem .8rem;cursor:pointer}
.lv-fail button:hover{filter:brightness(1.08)}

.gtrack{fill:none;stroke:var(--line);stroke-linecap:round}
.gfill{fill:none;stroke-linecap:round}
.gtick{stroke:var(--bg);stroke-width:2;stroke-linecap:butt;opacity:.75}
.gknob{stroke:#fff;stroke-width:2;filter:drop-shadow(0 1px 3px rgba(15,42,61,.35))}
.gknobc{fill:#fff}
.gval{font-family:var(--f-mono);font-size:17px;fill:var(--ink);font-weight:700;
  font-variant-numeric:tabular-nums}
.glbl{font-family:var(--f-body);font-size:9.5px;fill:var(--muted)}

.cface{filter:drop-shadow(0 2px 6px rgba(15,42,61,.18))}
.cring{fill:none;stroke:rgba(15,42,61,.22);stroke-width:1.5}
.ctick{stroke:var(--muted);stroke-width:1.2;stroke-linecap:round;opacity:.5}
.ctick.major{stroke:var(--ink2);stroke-width:2.4;opacity:.9}
.clbl{font-family:var(--f-head);font-size:10.5px;fill:var(--ink2);font-weight:700;
  text-anchor:middle}
.cneedle{filter:drop-shadow(0 1px 2px rgba(15,42,61,.35))}
.ctail{fill:rgba(15,42,61,.30)}
.chub{stroke:#fff;stroke-width:2.5}
.cval{font-family:var(--f-mono);font-size:12.5px;fill:#fff;font-weight:700;
  text-anchor:middle;font-variant-numeric:tabular-nums}
.wicon{color:var(--muted);flex-shrink:0}
.stat-icon{display:flex;align-items:center;gap:.35rem}
.gauge-row{display:flex;flex-wrap:wrap;gap:1.4rem;align-items:flex-start;margin-top:.6rem}
.gauge-item{display:flex;flex-direction:column;align-items:center;gap:.3rem;
  background:var(--panel);border-radius:12px;padding:.8rem 1rem;flex:1;min-width:9rem}
.gauge-item .gauge-lbl{font-family:var(--f-head);font-size:var(--fs-3);color:var(--ink2)}
svg.rainbars{width:100%;height:auto;display:block}
.rblbl{font-family:var(--f-body);font-size:11px;fill:var(--muted)}
.rbval{font-family:var(--f-mono);font-size:10.5px;fill:var(--ink2);font-variant-numeric:tabular-nums}
.rbaxis{stroke:var(--line);stroke-width:1}
.nums{display:flex;flex-direction:column;gap:.35rem}
.nrow{display:flex;justify-content:space-between;gap:.8rem;
  border-bottom:1px dashed var(--line);padding-bottom:.3rem}
.nrow dt{color:var(--muted);font-size:var(--fs-4)}
.nrow dd{font-family:var(--f-mono);color:var(--amber);font-weight:700;font-size:var(--fs-5)}
.hz{font-size:var(--fs-5);border-inline-start:3px solid var(--ac);
  padding:.45rem .8rem;background:var(--panel2);border-radius:0 8px 8px 0}
.crit{font-size:var(--fs-3);color:var(--muted)}
.more{align-self:flex-start;font-family:var(--f-head);font-size:var(--fs-4);
  color:var(--ac);font-weight:700}
.ics-line{margin-top:1.6rem;display:flex;align-items:center;gap:.9rem;flex-wrap:wrap}
/* «ما استُبعد ولماذا» — مطويّ افتراضاً، و`<details>` أصليّة فتعمل بلا JS */
.excl{background:var(--panel);border:1px solid var(--line);border-radius:14px;
  padding:0 1.3rem}
.excl>summary{cursor:pointer;list-style:none;padding:1.1rem 0;display:flex;
  align-items:baseline;gap:.6rem .8rem;flex-wrap:wrap}
.excl>summary::-webkit-details-marker{display:none}
.excl>summary::before{content:'+';font-family:var(--f-mono);color:var(--amber);
  font-size:1.05rem;line-height:1}
.excl[open]>summary::before{content:'−'}
.excl>summary:hover .xh{color:var(--amber)}
.excl .xh{font-family:var(--f-head);font-size:var(--fs-6);color:var(--ink);
  font-weight:600}
.excl .lede{margin:0 0 1rem}
.xlist{list-style:none;margin:0 0 1.3rem;padding:0;display:flex;
  flex-direction:column;gap:.65rem}
.xlist li{display:grid;grid-template-columns:minmax(8rem,auto) auto 1fr;
  gap:.25rem .9rem;align-items:baseline;padding-top:.65rem;
  border-top:1px solid var(--line);font-size:var(--fs-3);line-height:var(--lh-ui)}
.xlist li:first-child{border-top:0;padding-top:0}
.xlist b{color:var(--ink);font-weight:600}
.xlist .xn{color:var(--amber);white-space:nowrap}
.xlist .xw{color:var(--muted)}
/* والسببُ ينزل سطراً على الهاتف — فالثلاثةُ لا تسع في عرضٍ واحد */
@media (max-width:34rem){
  .xlist li{grid-template-columns:1fr auto}
  .xlist .xw{grid-column:1/-1}
}

.sharebar{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin-top:1.2rem}
.sharebar .copy{position:relative}
.sharebar .copy.done{border-color:var(--teal);color:var(--teal)}
.crumb{font-family:var(--f-head);font-size:var(--fs-4);color:var(--muted);
  text-decoration:none;display:inline-flex;align-items:center;gap:.4rem}
.crumb:hover{color:var(--amber)}
.pillnav{display:flex;flex-wrap:wrap;gap:.6rem}
.pill{font-family:var(--f-head);font-size:var(--fs-4);color:var(--ink2);
  text-decoration:none;border:1px solid var(--line);border-radius:999px;
  padding:.4rem 1rem;transition:border-color .15s ease,color .15s ease}
.pill:hover{border-color:var(--amber);color:var(--amber)}
.ics-note{color:var(--muted);font-size:var(--fs-4)}

.panels{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:1.3rem}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;
  padding:1.3rem 1.4rem;display:flex;flex-direction:column;gap:.7rem}
.panel h3{color:var(--amber);font-size:var(--fs-6)}
.panel p,.panel li{font-size:var(--fs-5);color:var(--ink2)}
.panel ul{padding-inline-start:1.1rem;display:flex;flex-direction:column;gap:.4rem}
.scroll{overflow-x:auto;border:1px solid var(--line);border-radius:10px;background:var(--panel)}
table{border-collapse:collapse;width:100%;min-width:24rem;font-size:var(--fs-5)}
th,td{text-align:right;padding:.6rem .9rem;border-bottom:1px solid var(--line)}
thead th{background:var(--panel2);font-family:var(--f-head);font-size:var(--fs-3);
  color:var(--ink2);font-weight:700}
tbody tr:last-child td{border-bottom:0}
tbody tr.mark td{background:color-mix(in srgb,var(--amber) 10%,transparent)}
tbody tr.cap td{color:var(--muted);font-style:italic}
td.n{font-family:var(--f-mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.ok{color:var(--teal);font-weight:700}

/* سطرُ رصد الشمس والقمر — بعرض القراءة، ويلتفّ على الضيّق. */
.sm-obs{margin:.9rem 0 0;max-width:52rem;font-size:var(--fs-5)}
.sm-obs .num{font-family:var(--f-mono)}

/* بوابةُ النجوم — خليّتا الاسم والظهور. والوسمُ وحده يلتفّ، فلا يمدّ الجدول. */
.st-name{display:flex;flex-direction:column;gap:.15rem}
.st-name b{font-size:var(--fs-6);color:var(--ink)}
.st-name .lat{font-family:var(--f-mono);font-size:var(--fs-2);color:var(--muted)}
.st-name .more{margin-top:.15rem;font-size:var(--fs-3)}
.st-app{display:flex;flex-direction:column;gap:.15rem}
.st-app b{font-size:var(--fs-6);color:var(--amber);white-space:nowrap}
.st-app>span{font-size:var(--fs-3);color:var(--muted);white-space:nowrap}
.st-app .when{white-space:normal;max-width:15rem;line-height:1.5}
.st-app .gate{color:var(--rust);white-space:normal;max-width:11rem}
.note{border-inline-start:3px solid var(--amber);background:var(--panel);
  padding:1rem 1.2rem;border-radius:0 10px 10px 0}
.note.warn{border-inline-start-color:var(--rust)}
.note h3{font-size:var(--fs-5);margin-bottom:.35rem}

.safety{background:#2A1410;border:2px solid var(--rust);border-radius:14px;
  padding:1.4rem 1.5rem;display:flex;flex-direction:column;gap:.7rem}
.safety h3{color:var(--rust);font-size:var(--fs-7)}
.safety ul{padding-inline-start:1.2rem;display:flex;flex-direction:column;gap:.5rem}
.safety li{color:var(--ink);font-size:var(--fs-5)}
.safety strong{color:var(--rust)}

.hero-big{max-width:76rem;margin:0 auto;padding:0 1.2rem}
.big-cta{border:2px solid var(--amber);border-radius:16px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--amber) 14%,var(--panel)),var(--panel));
  padding:2rem 1.8rem;display:flex;flex-direction:column;align-items:center;
  gap:.6rem;text-align:center;text-decoration:none;color:inherit}
.big-cta:hover{border-color:var(--ink)}
.big-cta .bl{font-family:var(--f-head);font-size:var(--fs-3);letter-spacing:0;
  color:var(--amber);font-weight:700}
.big-cta h3{font-size:clamp(1.3rem,3.4vw,1.9rem);color:var(--ink);max-width:44rem}
.big-cta p{color:var(--ink2);font-size:var(--fs-5);max-width:42rem;margin:0 auto}

.verse{background:var(--panel);border:1px solid var(--line);border-radius:14px;
  padding:2rem 1.6rem;text-align:center;display:flex;flex-direction:column;gap:1rem}
.verse blockquote{font-size:clamp(1.1rem,3.2vw,1.45rem);line-height:2.2}
.verse figcaption{color:var(--muted);font-size:var(--fs-5);border-top:1px solid var(--line);
  padding-top:1rem}
.verse strong{color:var(--amber)}

.quote-pub{border:1px dashed var(--line);border-radius:12px;padding:1.1rem 1.3rem;
  background:var(--panel2);white-space:pre-wrap;font-size:var(--fs-5);color:var(--ink2);
  line-height:var(--lh-body)}
.quote-pub b{color:var(--amber);font-family:var(--f-head);font-size:var(--fs-3);
  display:block;margin-bottom:.5rem;letter-spacing:0}

.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(20rem,1fr));gap:1.3rem}
.gcard{background:var(--panel);border:1px solid var(--line);border-radius:14px;
  overflow:hidden;display:flex;flex-direction:column}
.gcard img{display:block;width:100%}
.gcard .gtxt{padding:1.1rem 1.3rem;display:flex;flex-direction:column;gap:.4rem}
.gcard h3{color:var(--teal);font-size:var(--fs-7)}
.gcard p{font-size:var(--fs-5);color:var(--ink2)}

.linkgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:1rem}
.lcard{background:var(--panel);border:1px solid var(--line);border-radius:12px;
  padding:1.1rem 1.2rem;text-decoration:none;color:inherit;display:flex;
  flex-direction:column;gap:.3rem;border-top:3px solid var(--amber)}
.lcard:hover{border-color:var(--amber)}
.lcard b{font-family:var(--f-head);color:var(--ink)}
.lcard span{font-size:var(--fs-4);color:var(--muted)}

.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));gap:1.1rem}
.cards img{width:100%;border:1px solid var(--line);border-radius:10px;display:block}

.ladder-alt{position:relative;height:2px;background:var(--line);margin:2.4rem 0 3.2rem;
  border-radius:2px}
.ladder-pt{position:absolute;top:-5px;width:10px;height:10px;border-radius:50%;
  background:var(--amber);transform:translateX(50%)}
.ladder-pt.cap{background:var(--rust)}
.ladder-pt b{position:absolute;top:-2.1rem;right:-.6rem;font-family:var(--f-mono);
  font-size:var(--fs-3);color:var(--amber);white-space:nowrap}
.ladder-pt span{position:absolute;top:.9rem;right:-1.6rem;font-size:var(--fs-2);
  color:var(--muted);white-space:nowrap}

footer{position:relative;z-index:1;border-top:1px solid var(--line);
  padding:1.8rem 1.2rem 3rem;max-width:76rem;margin:0 auto;color:var(--muted);
  font-size:var(--fs-5);display:flex;flex-direction:column;gap:.6rem}
.handle{font-family:var(--f-mono);color:var(--amber);font-size:var(--fs-7);font-weight:700;
  text-decoration:none;width:fit-content}
.build{font-family:var(--f-mono);font-size:var(--fs-3);opacity:.85}

@media (max-width:640px){
  body{font-size:var(--fs-6)}
  .ev-body{grid-template-columns:1fr}
  svg.dial{max-width:13rem;margin:0 auto}
  .hero.tall{min-height:78vh}
  .ladder-pt b,.ladder-pt span{position:static;display:block}
}