*{box-sizing:border-box;margin:0;padding:0}
/* الخطّ: IBM Plex Sans Arabic (assets/fonts/fonts.css) — واجهةٌ عربية بخطٍّ
   عربيّ مصمَّم، لا بخطّ النظام. وsystem-ui خلفه احتياطًا حتى يصل الملف. */
body{font-family:'IBM Plex Sans Arabic',system-ui,sans-serif;background:#f0efe8;color:#1a1a1a;height:100vh;overflow:hidden}
/* عرض اللوحة يتدرّج مع الشاشة بدل 355px ثابتة: على شاشة عريضة كانت اللوحة تبقى
   ضيقة وخطوطها صغيرة بينما الخريطة تأخذ كل الفائض. --pane محدود الطرفين حتى لا
   تبتلع اللوحة الخريطة على الشاشات الضخمة ولا تختنق على الصغيرة. */
:root{--pane:clamp(345px,23vw,540px)}
.app{display:grid;grid-template-columns:1fr var(--pane);height:100vh}
.map-side{display:flex;flex-direction:column;background:#fff;overflow:hidden}
/* العمالة ورفع الملفات لا شأن لهما بالخريطة: الأولى جدول إدخال يومي، والثانية مركز
   استيراد. وإبقاء الخريطة إلى جوارهما يأخذ ثلثي الشاشة بلا فائدة، ويحشر المحتوى في
   عمود بعرض 345px بينما هو أولى بالمساحة. فتُخفى الخريطة وتأخذ الصفحة عرض النافذة.
   والسقف 1180px لأن السطر الممتدّ بلا حدّ على شاشة عريضة يُتعب العين لا يُريحها. */
body.solo-page .app{grid-template-columns:1fr}
body.solo-page .map-side{display:none}
/* الصفحة بعرض النافذة كانت لوحاً أبيض فارغاً حول جدول صغير — مساحة بلا تصميم.
   فتأخذ خلفية الرئيسية نفسها (--home-bg بمتغيّرها الواحد، فتبديل الصورة يسري على
   الثلاث معاً)، ويجلس المحتوى في بطاقة بيضاء فوقها. فتُقرأ كصفحة مقصودة لا كصفحة
   فقدت خريطتها. والتعتيم أخفّ من تعتيم الرئيسية: هنا البطاقة هي التي تحمل النص. */
body.solo-page .sidebar{border-inline-start:none;position:relative;
  background:#0b2a2a var(--home-bg,none) center/cover no-repeat}
body.solo-page .sidebar::before{content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(4,24,26,.72),rgba(5,30,32,.52) 45%,rgba(4,22,24,.70))}
body.solo-page .mode-tabs,
body.solo-page .panel{position:relative;z-index:1;background:transparent}
/* شريط العنوان فوق صورة داكنة: نصّه وأزراره تُقلب إلى الفاتح وإلا اختفت. */
body.solo-page .mode-tabs{border-bottom-color:rgba(255,255,255,.16)}
body.solo-page .page-ttl{color:#eafaf8;text-shadow:0 1px 3px rgba(0,0,0,.45)}
body.solo-page .page-home,
body.solo-page .qn,
body.solo-page .solo-actions .tb-btn{background:rgba(255,255,255,.12);color:#eafaf8;
  border-color:rgba(255,255,255,.26)}
body.solo-page .page-home:hover,
body.solo-page .qn:hover,
body.solo-page .solo-actions .tb-btn:hover{background:rgba(255,255,255,.24);color:#fff}
body.solo-page .qn.on{background:var(--teal-600);border-color:var(--teal-600);color:#fff}
body.solo-page .panel{padding:clamp(14px,1.6vw,30px) clamp(10px,2.2vw,44px) clamp(24px,2.4vw,48px)}
/* البطاقة: هي التي تحمل المحتوى، والخلفية تحيط بها ولا تزاحمه. */
body.solo-page #lab-body,
body.solo-page #panel-updates>*{max-width:1180px;width:100%;margin-inline:auto;
  background:#fff;border-radius:16px;box-shadow:0 14px 44px rgba(0,0,0,.28);
  padding:clamp(16px,1.5vw,30px)}
body.solo-page #panel-updates>*{margin-bottom:clamp(12px,1.1vw,20px)}
body.solo-page #panel-updates>.bundled-file-card{margin-inline:auto}
/* أزرار الشريط العلوي (اللغة والموبايل والخروج) كانت داخل جانب الخريطة، فتغيب بغيابه.
   تُعاد هنا في شريط عنوان الصفحة، فلا يفقد المستخدم طريق الخروج بدخوله صفحة مستقلة. */
.solo-actions{display:none;align-items:center;gap:7px;flex:none}
body.solo-page .solo-actions{display:flex}
/* المحتوى يكبر مع المساحة المكتسَبة — وإلا صار جدولٌ بخط 11px وسط بياض عريض. */
body.solo-page .lab-tbl{font-size:clamp(13px,.95vw,18px)}
body.solo-page .lab-tbl th{font-size:clamp(12px,.85vw,16px);padding:11px 8px}
body.solo-page .lab-tbl td{padding:11px 8px}
body.solo-page .lab-head{font-size:clamp(14px,1vw,19px);padding:13px 16px}
body.solo-page .lab-note{font-size:clamp(11.5px,.85vw,16px);padding:13px 16px}
body.solo-page .lab-in{width:clamp(64px,5vw,92px);font-size:clamp(14px,1vw,19px);padding:8px}
body.solo-page .lab-sub{font-size:clamp(10px,.72vw,13.5px)}
body.solo-page .lab-plan-n{font-size:clamp(15px,1.1vw,21px)}
body.solo-page .lab-plan-u{font-size:clamp(11px,.8vw,15px)}
body.solo-page .lab-plan-c{font-size:clamp(10px,.72vw,13.5px)}
/* أحجام هذه الأسطر الفرعية كانت مكتوبة داخل السطر في renderLabor، فلا تكبر مع الصفحة
   ولا تُترجم إلى صنف. نُقلت إلى أصناف لتشارك بقية الجدول في التدرّج. */
.lab-sub{font-size:8px;font-weight:500;color:#777}
.lab-plan-n{font-size:12px;font-weight:700;color:var(--teal-600)}
.lab-plan-u{font-size:10px;color:#666}
.lab-plan-c{font-size:9px;color:#999}
/* الشريط العلوي وشريط عنوان الصفحة متجاوران، فارتفاعهما واحد من متغيّر واحد — وإلا
   انكسر الخط الأفقي بينهما عند تعديل أيّهما. box-sizing العام يجعل min-height شاملاً
   للحشو والحد، فالارتفاع الخارجي متساوٍ فعلاً لا تقريباً. */
:root{--bar-h:clamp(54px,3.4vw,72px)}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:0 14px;
  min-height:var(--bar-h);border-bottom:1px solid #e4e3da;flex-shrink:0;background:#fff}
.brand{display:flex;align-items:center;gap:11px}
.brand img{height:32px}
.brand h1{font-size:14px;font-weight:700;color:var(--teal-600);white-space:nowrap}
.tb-actions{display:flex;gap:6px;align-items:center}
.tb-btn{font-size:11.5px;padding:7px 13px;border:1px solid #d0cfc4;border-radius:7px;cursor:pointer;background:#fff;color:#333;white-space:nowrap;line-height:1.2}
.tb-btn.primary{background:var(--teal-600);color:#fff;border-color:var(--teal-600)}
.tb-btn:hover{opacity:.85}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid #e4e3da;flex-shrink:0}
.kpi{padding:7px 10px;border-left:1px solid #e4e3da}
.kpi:last-child{border-left:none}
.kpi-lbl{font-size:9px;color:#999;text-transform:uppercase;letter-spacing:.04em;margin-bottom:2px}
.kpi-val{font-size:17px;font-weight:700;line-height:1}
.kpi-sub{font-size:9px;color:#bbb;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.map-wrap{flex:1;position:relative;overflow:hidden;background:#f8f8f2;cursor:grab}
.map-wrap:active{cursor:grabbing}
#map-svg{position:absolute;top:0;left:0;transform-origin:0 0;width:960px;height:640px;overflow:visible}
.perspective-stage{display:none;position:absolute;inset:0;overflow:visible;z-index:1}
#perspective-svg{position:absolute;top:0;left:0;transform-origin:0 0;overflow:visible;background:#8f9892}
.site-view-switcher{position:absolute;top:50%;right:10px;z-index:45;width:48px;transform:translateY(-50%);
  display:flex;flex-direction:column;direction:rtl;background:rgba(255,255,255,.88);opacity:.34;
  border:1px solid rgba(130,153,152,.7);border-radius:14px;box-shadow:0 5px 18px rgba(18,52,58,.12);
  overflow:hidden;transition:width .22s ease,opacity .18s ease,box-shadow .18s ease,background .18s ease}
.site-view-switcher:hover,.site-view-switcher:focus-within{width:184px;opacity:1;background:rgba(255,255,255,.97);
  box-shadow:0 8px 26px rgba(18,52,58,.22)}
.site-view-tab{height:50px;min-height:50px;width:184px;border:0;border-bottom:1px solid #e0e7e5;background:transparent;
  padding:0 7px;color:#233b40;cursor:pointer;font-family:inherit;display:grid;grid-template-columns:34px 1fr;
  align-items:center;gap:9px;text-align:right;transition:background .16s,color .16s}
.site-view-tab:last-child{border-bottom:0}
.view-glyph{width:32px;height:32px;border:1px solid #9badaa;border-radius:9px;display:grid;place-items:center;
  color:#4d6669;background:rgba(255,255,255,.78);font:800 18px/1 Arial,sans-serif;transition:all .16s}
.view-glyph.plan{font-size:19px;background-image:linear-gradient(#aebcba 1px,transparent 1px),linear-gradient(90deg,#aebcba 1px,transparent 1px);
  background-size:7px 7px;background-position:center;color:transparent}
.view-copy{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:2px;opacity:0;transform:translateX(8px);
  transition:opacity .15s ease .03s,transform .18s ease .03s}
.site-view-switcher:hover .view-copy,.site-view-switcher:focus-within .view-copy{opacity:1;transform:translateX(0)}
.site-view-tab small{font:700 9px/1.1 Arial,sans-serif;color:#7a898c;direction:ltr;letter-spacing:.05em}
.site-view-tab .view-label{font-size:13px;font-weight:750;white-space:nowrap}
.site-view-tab:hover{background:#eff7f6}
.site-view-tab.on{background:#e2f1ef;color:#087c7e;box-shadow:inset -3px 0 var(--teal-600)}
.site-view-tab.on .view-glyph{color:#087c7e;border-color:#54a7a4;background-color:#d7efec;box-shadow:0 0 0 2px rgba(10,138,138,.08)}
.site-view-tab.on small{color:#5f7477}
.map-wrap.has-view-switcher .map-tools{top:8px}
/* «الأرقام» يبقى مخفياً على المنظور: أربعمئة رقم على صورة تزدحم ولا تُقرأ.
   أمّا «البلوكات» فصار له معنى هناك بعد أن صارت البلوكات دبابيس على الصورة. */
.map-wrap.view-3d #tg-p{display:none}
.perspective-plot{cursor:pointer;stroke:rgba(255,255,255,.82);stroke-width:1.4;vector-effect:non-scaling-stroke;
  transition:fill-opacity .12s,stroke-width .12s}
.perspective-plot:hover{fill-opacity:.67!important;stroke:#fff;stroke-width:2.4}
.perspective-plot.sel{fill-opacity:.83!important;stroke:#fff7b2;stroke-width:4;filter:drop-shadow(0 0 5px rgba(255,213,79,.95))}
.perspective-marker{pointer-events:none}
.perspective-marker line{vector-effect:non-scaling-stroke;stroke-linecap:round}
.perspective-marker .marker-halo{stroke:rgba(255,255,255,.96);stroke-width:8}
.perspective-marker .marker-line{stroke:#087f82;stroke-width:3.5}
.perspective-marker .marker-anchor{fill:#fff;stroke:#087f82;stroke-width:3;vector-effect:non-scaling-stroke}
.perspective-marker .marker-bubble{fill:var(--teal-600);stroke:#fff;stroke-width:4;vector-effect:non-scaling-stroke;
  filter:drop-shadow(0 3px 5px rgba(8,45,50,.45))}
.perspective-marker text{fill:#fff;font-family:Arial,sans-serif;font-weight:800;text-anchor:middle;dominant-baseline:middle}
/* بطاقة الفيلا على صفحة نسب الإنجاز — رسمها في js/overview-cards.js.
   الطبقة لا تلتقط المؤشّر: البطاقة تُغلق بنقرة على فيلتها لا على نفسها، ولو
   التقطت المؤشر لحجبت سحب الخريطة والفلل التي تحتها. */
.ovc-layer{pointer-events:none}
.ovc-card{filter:drop-shadow(0 3px 10px rgba(16,42,48,.28))}
@media(max-width:1100px){
  .site-view-switcher{right:7px;width:44px}
  .site-view-switcher:hover,.site-view-switcher:focus-within{width:164px}
  .site-view-tab{width:164px;height:46px;min-height:46px;grid-template-columns:30px 1fr;padding:0 6px;gap:8px}
  .view-glyph{width:28px;height:28px;font-size:15px}.site-view-tab .view-label{font-size:11px}
}
.plot{stroke-width:.6;cursor:pointer}
/* في تقرير الإنجاز تُملأ الفلل بألوان مشبعة ومتلاصقة، فحدٌّ بسمك .6 رمادي يذوب بينها
   ولا يُرى أين تنتهي فيلا وتبدأ التي تليها. الحد هنا أغمق وأثقل ليفصلها. */
.plot.prm{stroke-width:1.5}
.plot:hover{opacity:.72}
.plot.sel{stroke:#111!important;stroke-width:2.4!important}
/* حجم الخط يُضبط لكل فيلا من أبعادها في plotLabelGeom؛ هذه قيمة احتياطية فقط */
.plbl{font-size:5px;fill:#333;font-weight:600;pointer-events:none;text-anchor:middle;dominant-baseline:middle}
.plbl.sel{fill:#000;font-weight:800}
/* في تقرير الإنجاز يقع الرقم فوق لون مشبع: تباين الأسود على بنفسجي الخانة 1 يبلغ
   1.48:1 وعلى أخضر الخانة 2 يبلغ 2.55:1. قلب الرقم إلى الأبيض ينقل العطب إلى
   الوردي والكهرماني فحسب، ولا يعالج الرقم الواقع على حدّ شريحتين. الهالة البيضاء
   تفصل الحرف عمّا تحته أيًّا كان. paint-order يرسم الحد قبل الملء فلا يبتلع الرقم. */
.plbl.prm{stroke:#fff;stroke-width:2;stroke-linejoin:round;paint-order:stroke fill}
/* الفيلا التي عليها ملاحظة: نصفها مشبعٌ أحمر، ورقمُها ‎#333‎ يُبتلع فيه — وهي
   نفس حالة ‎.prm‎ التي اختُرعت لها الهالة. ولا يُعالَج بتخفيف الأحمر: العلامة
   يجب أن تُقرأ من بُعد، والرقم يجب أن يُقرأ عن قرب، فتُحلّ بالهالة لا بالتنازل. */
.plbl.ncr{stroke:#fff;stroke-width:2;stroke-linejoin:round;paint-order:stroke fill;fill:#12202e;font-weight:800}
.map-tools{position:absolute;top:12px;right:12px;z-index:42;display:flex;align-items:center;gap:7px;
  max-width:calc(100% - 24px);direction:rtl}
.tog{min-height:42px;font-size:clamp(11px,.7vw,14px);font-weight:750;padding:8px 13px;background:rgba(255,255,255,.96);
  border:1px solid #c9d5d3;border-radius:10px;box-shadow:0 4px 13px rgba(25,58,62,.1);cursor:pointer;color:#385154;
  white-space:nowrap;transition:background .16s,color .16s,border-color .16s,box-shadow .16s,transform .16s}
.tog:hover{border-color:#79aaa7;box-shadow:0 5px 16px rgba(25,58,62,.16);transform:translateY(-1px)}
.tog.on{background:var(--teal-600);color:#fff;border-color:var(--teal-600)}
/* نطاق الفلل عنصر قرار دائم لا زر غامض: يرى المستخدم الخيارين والعدد في كل مقاس شاشة،
   ويظل الخيار النشط واضحاً في المخطط والمنظورين. */
.scope-switch{display:grid;grid-template-columns:repeat(2,minmax(108px,1fr));gap:4px;padding:4px;
  background:rgba(255,255,255,.96);border:1px solid #c9d5d3;border-radius:14px;
  box-shadow:0 6px 20px rgba(25,58,62,.16);backdrop-filter:blur(8px);overflow:hidden}
/* الصنف scope-opt تستعمله الصفحة الرئيسية أيضاً بقاعدة لاحقة، وكانت تفوز هنا فتفرض
   لون خلفيتها الداكنة (#cfe9e6) على قرص أبيض — تباين 1.28:1 يخفي الخيار غير النشط.
   فحُصر مبدّل الخريطة داخل حاويته. القياسات هنا هي المعروضة فعلاً قبل الحصر
   (ارتفاع 42، حشو ‎.55em/1.3em‎، استدارة 20، حد شفاف) فلا يتغير شكل المبدّل بحرف. */
.scope-switch .scope-opt{height:42px;min-width:108px;border:1px solid rgba(255,255,255,.18);
  border-radius:20px;background:transparent;color:#50676a;padding:.55em 1.3em;
  font-size:clamp(11px,.85vw,16px);font-family:inherit;display:flex;align-items:center;
  justify-content:center;gap:6px;cursor:pointer;white-space:nowrap;
  transition:background .16s,color .16s,box-shadow .16s,transform .16s}
.scope-switch .scope-opt:hover{background:#edf6f5;color:#087c7e}
.scope-switch .scope-opt:focus-visible{outline:3px solid rgba(10,138,138,.24);outline-offset:1px}
.scope-switch .scope-opt.on{background:var(--teal-600);color:#fff;box-shadow:0 3px 10px rgba(10,138,138,.28)}
.scope-switch .scope-opt .scope-icon{font-size:clamp(14px,.9vw,18px);line-height:1}
.scope-switch .scope-opt .scope-count{font:850 clamp(15px,.95vw,19px)/1 Arial,sans-serif;direction:ltr}
.scope-switch .scope-opt .scope-label{font-size:clamp(12px,.75vw,15px);font-weight:800;line-height:1}
@media(max-width:900px){
  .map-tools{top:7px;right:7px;max-width:calc(100% - 14px);gap:4px;flex-wrap:wrap}
  .tog{min-height:36px;padding:6px 9px;font-size:10.5px}
  .scope-switch{grid-template-columns:repeat(2,minmax(88px,1fr));padding:3px;border-radius:11px}
  /* الحشو هنا كان محجوباً بقاعدة الرئيسية قبل الحصر، فلا يُعاد تفعيله لئلا يضيق الزر. */
  .scope-switch .scope-opt{height:36px;min-width:88px;gap:4px}
  .scope-switch .scope-opt .scope-count{font-size:14px}
  .scope-switch .scope-opt .scope-label{font-size:11px}
}
.zoom-btns{position:absolute;bottom:8px;left:8px;display:flex;flex-direction:column;gap:3px}
.zbtn{width:26px;height:26px;background:rgba(255,255,255,.92);border:1px solid #ddd;border-radius:4px;cursor:pointer;font-size:14px;font-weight:700;color:#555;display:flex;align-items:center;justify-content:center}
.legend{position:absolute;bottom:8px;right:8px;background:rgba(255,255,255,.96);border:1px solid #e0dfd6;border-radius:7px;padding:9px 12px;font-size:clamp(10px,calc(10px + (100vw - 1280px)*0.00391),13.5px)}
.leg-title{font-size:clamp(9px,calc(9px + (100vw - 1280px)*0.00352),12.2px);font-weight:700;color:#aaa;text-transform:uppercase;margin-bottom:6px}
.leg-row{display:flex;align-items:center;gap:6px;margin-bottom:5px;min-width:150px}
.leg-row:last-child{margin:0}
.leg-dot{width:13px;height:13px;border-radius:3px;flex-shrink:0}
/* توزيع حالة الموقع داخل مفتاح التصنيف: شريحةٌ لها حدّها داخل المفتاح، فتُقرأ
   كوحدة مستقلة لا كذيلٍ ملتصق بالعنوان. والرقم أولاً وأثقل من الاسم. */
.leg-st{display:inline-flex;align-items:center;gap:4px;font-size:.76em;color:#5a6a6a;
  font-variant-numeric:tabular-nums;background:#f6f8f8;border:1px solid #dde4e4;
  border-radius:7px;padding:1.5px 7px}
.leg-st b{color:#23403f;font-weight:800;font-size:1.04em}
.leg-st i{width:8px;height:8px;border-radius:2px;display:inline-block;flex:none;
  box-shadow:0 0 0 1px rgba(0,0,0,.12)}
.sidebar{display:flex;flex-direction:column;background:#fafaf5;border-right:1px solid #e4e3da;overflow:hidden}
/* شريط التبويبات الستة استُبدل بعنوان الصفحة وزر الرئيسية: التنقل صار من الصفحة
   الرئيسية، فتكرار الوجهات الست في كل صفحة يزاحم المحتوى بلا فائدة. */
.mode-tabs{display:flex;align-items:center;gap:10px;border-bottom:1px solid #e4e3da;
  flex-shrink:0;background:#fff;padding:0 12px;min-height:var(--bar-h)}
.page-home{border:1px solid #d7e6e4;background:#f2fbfa;color:var(--teal-600);border-radius:9px;
  width:clamp(34px,2.2vw,46px);height:clamp(34px,2.2vw,46px);font-size:clamp(16px,1.15vw,22px);
  cursor:pointer;flex:none;line-height:1;transition:.15s}
.page-home:hover{background:var(--teal-600);color:#fff;border-color:var(--teal-600)}
.page-ttl{font-size:clamp(14px,1.05vw,20px);font-weight:800;color:#12343a;flex:1;line-height:1.3}
.mode-tab{display:none}
/* تنقّل سريع بأيقونات بلا نص: الرئيسية علّمت الأيقونات بالبطاقات الست، فهي مفهومة
   هنا بلا شرح. تشغل فراغاً قائماً في الشريط بلا زيادة ارتفاع، والنشطة مميّزة بلون
   فتؤدي أيضاً دور مؤشر الموقع الذي كان يؤديه شريط التبويبات بعرضه كاملاً. */
.quick-nav{display:flex;gap:3px;flex:none}
.qn{width:clamp(30px,2vw,42px);height:clamp(30px,2vw,42px);border:1px solid transparent;background:transparent;
  border-radius:8px;cursor:pointer;font-size:clamp(14px,1.05vw,20px);line-height:1;padding:0;transition:.13s;
  opacity:.55;filter:grayscale(.5)}
.qn:hover{background:#f0f7f6;opacity:1;filter:none}
.qn.on{background:#e4f1f1;border-color:#b8dcd8;opacity:1;filter:none}
.panel{flex:1;display:flex;flex-direction:column;overflow:hidden}
.sb-hdr{padding:clamp(9px,.85vw,16px) clamp(12px,1vw,20px);border-bottom:1px solid #e4e3da;background:#fff;flex-shrink:0}
.sb-hdr-title{font-size:clamp(11px,.88vw,16px);font-weight:600;color:#555;margin-bottom:6px}
.search-wrap input{width:100%;padding:6px 10px;font-size:12px;border:1px solid #d0cfc4;border-radius:5px;outline:none;font-family:inherit}
.item-list{flex:1;overflow-y:auto}
.item-row{display:flex;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid #f0efe8;cursor:pointer}
.item-row:hover{background:#f4f3ee}
.item-row.active{background:#e4f1f1;border-right:3px solid var(--teal-600)}
.item-num{font-size:10px;font-weight:700;color:#aaa;min-width:22px}
.item-name{font-size:11px;color:#333;flex:1;line-height:1.35}
.item-mep{font-size:8px;padding:1px 5px;border-radius:8px;background:#e8e4d8;color:#888;flex-shrink:0}
.item-mep.elec{background:#fff3cd;color:#8a6d00}
.item-mep.mech{background:#d4e6f1;color:#1a5a8a}
.item-bar-wrap{width:34px;height:5px;background:#e4e3da;border-radius:3px;overflow:hidden;flex-shrink:0}
.item-bar{height:100%;background:var(--teal-600)}
.det-wrap{flex:1;overflow-y:auto;padding:12px}
.copy-btn{font-size:10px;padding:2px 6px;border:1px solid #d0cfc4;border-radius:4px;background:#fff;cursor:pointer;color:var(--teal-600);margin-right:4px}
.d-field{background:#f4f3ee;border-radius:4px;padding:5px 7px}
.d-field .lbl{font-size:clamp(9px,calc(9px + (100vw - 1280px)*0.00352),12.2px);color:#aaa;margin-bottom:1px}
.d-field .val{font-size:clamp(11px,calc(11px + (100vw - 1280px)*0.0043),14.8px);font-weight:600}

/* ── MRP urgent / total purchase plans ── */
.mrp-plan-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:8px 0}
.mrp-plan-tab{padding:9px 6px;border:1px solid #d0cfc4;border-radius:7px;background:#fff;color:#666;font-size:clamp(11px,calc(11px + (100vw - 1280px)*0.0043),14.8px);font-weight:700;cursor:pointer;font-family:inherit}
.mrp-plan-tab.on{background:var(--teal-600);color:#fff;border-color:var(--teal-600)}
.mrp-urgent-limit{display:flex;align-items:center;gap:8px;padding:7px 9px;background:#fff8e1;border:1px solid #ffe082;border-radius:7px;margin-bottom:8px}
.mrp-urgent-limit label{flex:1;margin:0!important;font-size:clamp(10px,calc(10px + (100vw - 1280px)*0.00391),13.5px)!important;color:#7a6100!important}
.mrp-urgent-limit input{width:58px!important;margin:0!important;padding:5px!important;text-align:center;font-weight:700}
.urgent-banner{margin:8px 10px;padding:10px 11px;border-radius:8px;background:#fff8e1;border-right:4px solid #ffb300;font-size:11px;line-height:1.65;color:#5f4b00}
.urgent-banner b{color:#9a6700}
.urgent-section-title{padding:8px 12px 5px;font-size:10px;font-weight:700;color:#666;background:#fafaf5}
.urgent-bundle{margin:6px 10px;padding:8px 10px;background:#fff;border:1px solid #e4e3da;border-radius:7px;font-size:10px;line-height:1.55}
.urgent-bundle .h{display:flex;justify-content:space-between;gap:6px;align-items:center;margin-bottom:3px}
.urgent-bundle .cnt{background:#e8f5e9;color:#2e7d32;padding:2px 7px;border-radius:9px;font-weight:700;white-space:nowrap}
.urgent-bundle .m{color:#777;font-size:9px}

/* MRP panel */
.mrp-controls{padding:12px;border-bottom:1px solid #e4e3da;background:#fff;flex-shrink:0}
.mrp-controls label{font-size:clamp(11px,calc(11px + (100vw - 1280px)*0.0043),14.8px);font-weight:600;color:#555;display:block;margin-bottom:5px}
.mrp-controls input[type=date]{width:100%;padding:7px 10px;font-size:clamp(13px,calc(13px + (100vw - 1280px)*0.00508),17.6px);border:1px solid #d0cfc4;border-radius:5px;outline:none;font-family:inherit;margin-bottom:8px}
.mrp-run{width:100%;padding:9px;font-size:clamp(13px,calc(13px + (100vw - 1280px)*0.00508),17.6px);font-weight:600;background:var(--teal-600);color:#fff;border:none;border-radius:6px;cursor:pointer}
.mrp-run:hover{background:#097878}
.mrp-summary{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:10px 12px;background:#f4f8f8;border-bottom:1px solid #e4e3da;flex-shrink:0}
.mrp-stat{text-align:center;padding:6px;background:#fff;border-radius:5px}
.mrp-stat-val{font-size:clamp(16px,calc(16px + (100vw - 1280px)*0.00625),21.6px);font-weight:700;color:var(--teal-600)}
.mrp-stat-lbl{font-size:clamp(9px,calc(9px + (100vw - 1280px)*0.00352),12.2px);color:#999;margin-top:2px}
.mrp-results{flex:1;overflow-y:auto;padding:0}
.mrp-mat-row{display:flex;align-items:center;gap:6px;padding:7px 12px;border-bottom:1px solid #f0efe8;font-size:clamp(11px,calc(11px + (100vw - 1280px)*0.0043),14.8px)}
.mrp-mat-name{flex:1;line-height:1.3}
.mrp-mat-code{font-size:clamp(8px,calc(8px + (100vw - 1280px)*0.00312),10.8px);color:#bbb}
.mrp-mat-qty{font-weight:700;min-width:52px;text-align:left}
.mrp-mat-order{background:#ffe0e0;color:#c0392b}
.mrp-mat-ok{background:#e0f0e0;color:#27ae60}
.mrp-empty{text-align:center;padding:40px 16px;color:#bbb;font-size:clamp(12px,calc(12px + (100vw - 1280px)*0.00469),16.2px)}
.mrp-export{padding:10px 12px;border-top:1px solid #e4e3da;background:#fff;flex-shrink:0}
.toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);background:#1a1a2e;color:#fff;padding:9px 18px;border-radius:6px;font-size:12px;z-index:999;opacity:0;transition:opacity .3s;pointer-events:none}
.toast.show{opacity:1}
.toast.ok{background:var(--teal-600)}
.toast.err{background:#9e2222}

.mrp-mat-hdr{display:flex;align-items:center;gap:6px;padding:7px 12px;background:#f4f3ee;border-bottom:2px solid #e4e3da;font-size:clamp(9px,calc(9px + (100vw - 1280px)*0.00352),12.2px);font-weight:700;color:#888;position:sticky;top:0;z-index:2}
.mrp-mat-row{display:flex;align-items:center;gap:6px}

/* Section progress popup */
.section-popup{display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:500;align-items:center;justify-content:center}
/* كانت النافذة 340px ثابتة مهما اتسعت الشاشة، فيتزاحم اسم القسم ونسبته في سطر واحد
   ويبقى سطر الوزن عند 9px. صارت تكبر مع الشاشة، ومحتواها معها في نفس النسبة. */
.popup-card{background:#fff;border-radius:14px;width:clamp(360px,32vw,560px);max-width:92vw;max-height:88vh;
  overflow-y:auto;padding:clamp(20px,1.7vw,32px);box-shadow:0 10px 40px rgba(0,0,0,.3)}
.popup-close{position:absolute;top:clamp(12px,.9vw,17px);left:clamp(12px,.9vw,17px);
  width:clamp(28px,2.2vw,38px);height:clamp(28px,2.2vw,38px);border:none;background:#f0efe8;
  border-radius:50%;cursor:pointer;font-size:clamp(16px,1.2vw,21px);color:#888;
  display:flex;align-items:center;justify-content:center;line-height:1}
.popup-close:hover{background:#e4e2d8;color:#555}
.pop-hd{text-align:center;margin-bottom:clamp(14px,1.1vw,20px)}
.pop-title{font-size:clamp(18px,1.35vw,26px);font-weight:700}
.pop-sub{font-size:clamp(11px,.85vw,15px);color:#8a8a8a;margin-top:2px}
.pop-tot{background:#f4f8f8;border-radius:10px;padding:clamp(10px,.85vw,16px);
  margin-bottom:clamp(14px,1.1vw,20px);text-align:center}
.pop-tot-lbl{font-size:clamp(10px,.72vw,13px);color:#767676;text-transform:uppercase;letter-spacing:.3px}
.pop-tot-val{font-size:clamp(26px,2vw,40px);font-weight:800;color:var(--teal-600);line-height:1.15}
.pop-sec{margin-bottom:clamp(12px,.95vw,18px)}
/* الاسم والنسبة على طرفَي سطر واحد: مع اتساع النافذة صار بينهما فراغ يفصلهما بوضوح. */
.pop-sec-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:5px}
.pop-sec-name{font-size:clamp(13px,.95vw,17px);font-weight:600}
.pop-sec-pct{font-size:clamp(14px,1.05vw,19px);font-weight:700;font-variant-numeric:tabular-nums}
.pop-sec-bar{height:clamp(8px,.62vw,12px);background:#eee;border-radius:6px;overflow:hidden}
.pop-sec-fill{height:100%;border-radius:6px;transition:width .3s}
/* كان ‎#aaa‎ عند 9px — تباين 2.3:1. رُفع إلى ‎#767676‎ فبلغ 4.6:1 مع تكبير الخط. */
.pop-sec-meta{font-size:clamp(10px,.72vw,13.5px);color:#767676;margin-top:3px}
/* file upload page */
#panel-updates{background:#f3f6f4}
.files-hero{padding:17px 15px 15px;background:linear-gradient(135deg,#075f5f,#0a9390);color:#fff;position:relative;overflow:hidden;flex-shrink:0}
.files-hero:after{content:"";position:absolute;width:145px;height:145px;border:28px solid rgba(255,255,255,.06);border-radius:50%;left:-58px;top:-72px}
.files-hero-kicker{font-size:9px;opacity:.72;margin-bottom:3px}
.files-hero h2{font-size:17px;margin:0 0 5px;position:relative;z-index:1}
.files-hero p{font-size:10px;line-height:1.65;margin:0;max-width:310px;opacity:.86;position:relative;z-index:1}
.file-type-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:11px;position:relative;z-index:1}
.file-type-card{padding:7px 5px;border:1px solid rgba(255,255,255,.22);border-radius:8px;background:rgba(255,255,255,.09);font-size:9px;text-align:center}
.file-type-card b{display:block;font-size:15px;margin-bottom:2px}
.upd-section{padding:12px;border-bottom:1px solid #e4e3da;background:#fff}
.upd-title{font-size:clamp(12px,calc(12px + (100vw - 1280px)*0.00469),16.2px);font-weight:700;color:#333;margin-bottom:8px;display:flex;align-items:center;gap:6px}
.upd-btn{width:100%;padding:9px;font-size:clamp(12px,calc(12px + (100vw - 1280px)*0.00469),16.2px);border:1.5px dashed #b0cfc4;border-radius:6px;background:#f4f8f8;color:var(--teal-600);cursor:pointer;font-weight:600;font-family:inherit}
.upd-btn:hover{background:#e8f4f4}
.bundled-file-card{margin:12px;border:1px solid #9fd7d3;border-radius:11px;background:linear-gradient(145deg,#f6fffe,#edf8f7);padding:13px;box-shadow:0 5px 16px rgba(0,90,87,.07)}
.bundled-file-top{display:flex;align-items:flex-start;gap:10px;margin-bottom:10px}
.bundled-file-icon{width:39px;height:39px;display:grid;place-items:center;border-radius:10px;background:#d9f0ee;font-size:clamp(20px,calc(20px + (100vw - 1280px)*0.00781),27px);flex:0 0 auto}
.bundled-file-meta{min-width:0;flex:1}
.bundled-file-meta b{font-size:clamp(12px,calc(12px + (100vw - 1280px)*0.00469),16.2px);color:#174a49;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bundled-file-meta span{font-size:clamp(9px,calc(9px + (100vw - 1280px)*0.00352),12.2px);color:#65807f;line-height:1.55;display:block;margin-top:3px}
.bundled-file-badge{font-size:clamp(8px,calc(8px + (100vw - 1280px)*0.00312),10.8px);color:#087876;background:#d7efed;border-radius:10px;padding:3px 7px;white-space:nowrap}
.bundled-file-card .upd-btn{border-style:solid;background:var(--teal-600);color:#fff;border-color:var(--teal-600)}
.bundled-file-card .upd-btn:hover{background:#087876}
.imp-drop{border:1.5px dashed #9cc8c4;border-radius:10px;background:#f7fbfa;padding:18px 12px;text-align:center;cursor:pointer;transition:.18s}
.imp-drop:hover,.imp-drop.over{border-color:var(--teal-600);background:#eaf6f5;transform:translateY(-1px)}
.imp-ico{font-size:clamp(27px,calc(27px + (100vw - 1280px)*0.01055),36.4px);margin-bottom:4px}
.imp-t{font-size:clamp(12px,calc(12px + (100vw - 1280px)*0.00469),16.2px);font-weight:700;color:#315d5b}
.imp-s{font-size:clamp(9px,calc(9px + (100vw - 1280px)*0.00352),12.2px);color:#7a9291;margin-top:4px;line-height:1.5}
.imp-log{max-height:150px;overflow-y:auto;padding:7px;border-radius:7px;background:#122625;color:#d8e9e7;font:10px/1.65 Consolas,monospace;direction:rtl}
.imp-line.ok{color:#77e0aa}.imp-line.warn{color:#ffd166}.imp-line.bad{color:#ff8585}
.imp-sum{padding:9px;border-radius:7px;background:#e6f4f3;color:#166b68;font-size:clamp(11px,calc(11px + (100vw - 1280px)*0.0043),14.8px);margin-top:8px}
.imp-warn{padding:8px;border-radius:7px;background:#fff8e1;color:#7a6100;font-size:clamp(10px,calc(10px + (100vw - 1280px)*0.00391),13.5px);line-height:1.55;margin-top:7px}
.imp-bad{padding:8px;border-radius:7px;background:#ffebee;color:#a12626;font-size:clamp(10px,calc(10px + (100vw - 1280px)*0.00391),13.5px);line-height:1.55;margin-top:7px}
.imp-list-t{font-size:clamp(10px,calc(10px + (100vw - 1280px)*0.00391),13.5px);font-weight:700;color:#555;margin-top:8px}
.imp-list{font-size:clamp(9px,calc(9px + (100vw - 1280px)*0.00352),12.2px);color:#666;line-height:1.6;max-height:125px;overflow:auto;margin-top:4px}
.imp-chk{display:block;margin-top:8px;font-size:clamp(10px,calc(10px + (100vw - 1280px)*0.00391),13.5px);font-weight:700}
.files-permission-note{display:none;margin:12px;padding:11px;border:1px solid #f1d08a;border-radius:9px;background:#fff8e8;color:#745a1a;font-size:10px;line-height:1.65}
.upd-desc{font-size:clamp(9px,calc(9px + (100vw - 1280px)*0.00352),12.2px);color:#aaa;margin-top:5px;line-height:1.4}
.cov-scope-btn{flex:1;font-size:clamp(10px,calc(10px + (100vw - 1280px)*0.00391),13.5px);padding:5px 4px;border:1px solid #d0cfc4;border-radius:5px;background:#fff;color:#666;cursor:pointer;font-family:inherit}
.cov-scope-btn.on{background:var(--teal-600);color:#fff;border-color:var(--teal-600);font-weight:600}
.upd-wh-input{width:100%;padding:6px 9px;font-size:clamp(11px,calc(11px + (100vw - 1280px)*0.0043),14.8px);border:1px solid #d0cfc4;border-radius:5px;margin-bottom:6px;font-family:inherit}

/* شاشة التحميل على خلفية المشروع كالدخول والرئيسية: هي أول ما يُرى بعد الدخول،
   وبقاؤها بيج فارغاً كان يقطع التسلسل البصري بين الثلاث. */
/* التحميل يتبع صورة الدخول لا المنظر الجوي: هو امتداد لها زمنياً — تُغلق شاشة الدخول
   فتظهر هذه — فوحدة الصورة بينهما تجعل الانتقال متصلاً. الرئيسية بعدهما تنتقل للمشروع. */
#loading-overlay{position:fixed;inset:0;z-index:9999;display:none;flex-direction:column;
  align-items:center;justify-content:center;gap:16px;
  background:#12181a var(--login-bg,var(--home-bg,none)) center/cover no-repeat}
#loading-overlay::before{content:'';position:absolute;inset:0;background:
  radial-gradient(closest-side at 50% 50%,rgba(8,20,22,.62),rgba(8,20,22,.42) 60%,rgba(8,20,22,.26) 100%)}
#loading-overlay>*{position:relative;z-index:1}
/* الخلفية تحمل الشعار مطبوعاً، فالشعار الصغير تكرار — كما في بطاقة الدخول */
.load-logo{display:none}
#load-spinner{width:34px;height:34px;border:3px solid rgba(255,255,255,.28);border-top-color:#5fd3cf;border-radius:50%;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
#load-status{font-size:13px;color:#cfe9e6;white-space:pre-line;text-align:center;max-width:min(760px,88vw);line-height:1.9}
/* مخرجٌ من شاشة التحميل حين تتعطّل. كانت الشاشة تعرض الخطأ ولا تعرض سبيلاً: من
   دخل بحسابٍ بلا عضوية عَلِق فيها، ولا يستطيع الخروج ولا تجربة حساب آخر، لأن زر
   الخروج داخل البرنامج — والبرنامج لم يُفتح. فيبقى مسح بيانات المتصفح حيلته الوحيدة. */
#load-actions{display:none;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:4px}
#load-actions.on{display:flex}
#load-actions button{padding:9px 20px;font-size:12.5px;font-weight:700;font-family:inherit;cursor:pointer;
  color:#cfe9e6;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);
  border-radius:20px;transition:background .16s,color .16s,border-color .16s}
#load-actions button:hover{background:rgba(255,255,255,.2);color:#fff;border-color:rgba(255,255,255,.45)}

.ui-choice{margin:4px 0 12px}
.ui-choice-t{font-size:11px;color:#999;margin-bottom:7px;font-weight:600}
.ui-opt{display:flex;align-items:center;gap:10px;padding:11px 12px;border:1.5px solid #e4e3da;border-radius:9px;margin-bottom:7px;cursor:pointer;transition:.15s;width:100%}
.ui-opt:hover{border-color:#b2dfdb;background:#f7fbfb}
.ui-opt input[type=radio]{width:18px;height:18px;margin:0;flex:0 0 18px;accent-color:var(--teal-600)}
.ui-opt:has(input:checked){border-color:var(--teal-600);background:#e4f1f1}
.ui-ico{font-size:20px;flex:0 0 auto;line-height:1}
.ui-txt{flex:1;min-width:0;text-align:right}
.ui-txt b{font-size:12.5px;display:block;color:#333;line-height:1.3}
.ui-txt small{font-size:10px;color:#999;display:block;margin-top:2px;line-height:1.35}

/* login */
/* ── الصفحة الرئيسية ──
   الخلفية متغيّر CSS واحد: لإحلال صورة المشروع مكان الشعار يكفي تغيير --home-bg
   إلى url(data:image/jpeg;base64,...) دون المساس بأي شيء آخر. */
/* خلفية الصفحة الرئيسية: المنظر الجوي للمشروع، مضغوط إلى 1500px بجودة 60
   (239KB قبل الترميز) — الأصل webp بحجم 790KB كان يتضخّم إلى ~1.05MB بعد base64. */
:root{--login-bg:url(./assets/login-bg.webp)}
:root{--home-bg:url(./assets/home-bg.jpg)}
#home-screen{position:fixed;inset:0;z-index:9000;display:none;overflow:auto;
  background:#0b2a2a var(--home-bg,none) center/cover no-repeat}
#home-screen.on{display:block}
/* طبقة تعتيم فوق الخلفية: النصوص تبقى مقروءة مهما كانت الصورة فاتحة أو مزدحمة */
/* التعتيم يثقل حيث يقع النص ويخفّ عند الأطراف، فتظهر الصورة ويبقى النص مقروءاً.
   تعتيم موحّد ثقيل كان يخفي المشروع، وخفيف كان يُذيب النص في تفاصيل المباني. */
.home-veil{position:absolute;inset:0;background:
  radial-gradient(closest-side at 50% 46%,rgba(4,26,28,.90),rgba(5,30,32,.74) 55%,rgba(6,34,36,.42) 100%),
  linear-gradient(180deg,rgba(4,24,26,.62),rgba(4,24,26,.30) 40%,rgba(4,22,24,.66))}
.home-in{position:relative;min-height:100%;display:flex;flex-direction:column;
  align-items:center;justify-content:center;padding:34px 22px 40px;gap:6px}
/* المقاسات تتدرّج مع عرض النافذة بـclamp بدل أن تثبت: على شاشة عريضة كانت الصفحة
   تبقى بعرض 790px في وسط فراغ واسع فتبدو ضائعة. الحدّان يمنعان التضخّم بلا سقف
   والانكماش تحت المقروء، والتدرّج بينهما مستمر لا بقفزات عند نقاط توقف. */
.home-logo{height:clamp(46px,4vw,84px);margin-bottom:6px;filter:brightness(0) invert(1);opacity:.95}
.home-ttl{font-size:clamp(26px,2.5vw,50px);font-weight:800;color:#fff;letter-spacing:.5px}
.home-sub{font-size:clamp(12px,1vw,19px);color:#9fd3d0;margin-bottom:6px}
/* النطاق يُختار من الرئيسية لا من زر صغير فوق الخريطة: هو يحكم كل رقم في البرنامج،
   فاختياره قبل الدخول أصحّ من اكتشافه بعده. */
.home-scope{display:flex;gap:7px;margin-bottom:20px}
.scope-opt{font-size:clamp(11px,.85vw,16px);color:#cfe9e6;background:rgba(255,255,255,.08);cursor:pointer;
  border:1px solid rgba(255,255,255,.18);border-radius:20px;padding:.55em 1.3em;font-family:inherit;transition:.15s}
.scope-opt:hover{background:rgba(255,255,255,.16)}
.scope-opt.on{background:var(--teal-600);border-color:var(--teal-600);color:#fff;font-weight:700}
.scope-opt:disabled{opacity:.4;cursor:not-allowed}
.home-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.1vw,22px);
  width:100%;max-width:clamp(760px,58vw,1240px)}
.home-card{background:rgba(255,255,255,.97);border-radius:clamp(12px,1vw,18px);
  padding:clamp(15px,1.4vw,26px) clamp(12px,1.2vw,22px);text-align:center;
  cursor:pointer;border:1px solid rgba(255,255,255,.5);transition:transform .16s,box-shadow .16s;
  box-shadow:0 4px 16px rgba(0,0,0,.22)}
.home-card:hover{transform:translateY(-4px);box-shadow:0 10px 26px rgba(0,0,0,.32)}
.home-card .ic{font-size:clamp(25px,2vw,40px);line-height:1}
.home-card .nm{font-size:clamp(13px,1.05vw,19px);font-weight:700;color:#12343a;margin-top:7px;line-height:1.35}
.home-card .fig{font-size:clamp(19px,1.6vw,31px);font-weight:800;color:var(--teal-600);margin-top:6px;min-height:1.2em}
.home-card .cap{font-size:clamp(9.5px,.78vw,14px);color:#8b9a9a;margin-top:2px;min-height:1.3em}
.home-foot{margin-top:22px;font-size:clamp(10.5px,.8vw,15px);color:#8fb8b6;text-align:center;line-height:1.9}
/* الخروج كان متاحاً من الشريط العلوي داخل الصفحات فقط، فمن وقف على الرئيسية اضطرّ
   لدخول صفحة ليخرج. زرّ هادئ لا يزاحم البطاقات، ويتضح عند لمسه. */
.home-logout{display:block;margin:14px auto 0;padding:clamp(8px,.62vw,13px) clamp(22px,1.7vw,38px);
  font-size:clamp(11.5px,.85vw,16px);font-weight:700;font-family:inherit;cursor:pointer;
  color:#cfe9e6;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);
  border-radius:20px;transition:background .16s,color .16s,border-color .16s}
.home-logout:hover{background:rgba(255,255,255,.2);color:#fff;border-color:rgba(255,255,255,.45)}
/* كلمة المرور تُغيَّر من الرئيسية وحدها، بجوار الخروج: هما فعلا الحساب لا فعلا
   المشروع، فمكانهما واحد. وإخفاؤها داخل صفحةٍ يجعل مَن سُلّم كلمة مؤقتة لا يجدها. */
.home-acts{display:flex;gap:10px;justify-content:center;margin-top:14px;flex-wrap:wrap}
.home-acts .home-logout{margin:0}
/* ── نافذة تغيير كلمة المرور ── */
#pw-modal,#fp-modal{position:fixed;inset:0;z-index:10001;display:none;align-items:center;justify-content:center;
  background:rgba(6,22,24,.62);padding:18px}
#pw-modal.on,#fp-modal.on{display:flex}
/* شاشة الهبوط من رابط الاستعادة: تعلو كل شيء — لا شاشة دخول ولا تحميل تسبقها،
   فالجلسة القائمة عندها جلسةُ استعادة لا جلسة عمل. */
#rc-screen{position:fixed;inset:0;z-index:10002;display:none;align-items:center;justify-content:center;
  padding:18px;background:#12181a var(--login-bg,var(--home-bg,none)) center/cover no-repeat}
#rc-screen.on{display:flex}
#rc-screen::before{content:'';position:absolute;inset:0;background:rgba(8,20,22,.55)}
#rc-screen .pw-card{position:relative;z-index:1}
/* «نسيت كلمة المرور؟» رابطٌ لا زر: لا يزاحم «دخول» ولا يُضغط بالخطأ */
#lg-forgot{width:auto;display:block;margin:9px auto 0;background:none;border:none;padding:4px;
  color:var(--teal-600);font-size:11.5px;font-weight:600;font-family:inherit;cursor:pointer;text-decoration:underline}
#lg-forgot:hover{color:#097878;background:none}
/* عين إظهار كلمة المرور: من يكتب كلمةً لا يراها على جوّال في الشمس يخطئ ويعيد،
   وإعادة الكتابة عمياء هي ما يجعل الناس يختارون كلمات ضعيفة. الزرّ داخل الحقل عند
   حافته الداخلية، والحقل يُترك له فراغ فلا تركب العين على النص. */
.pw-wrap{position:relative;margin-bottom:10px}
.pw-wrap input{margin-bottom:0!important;padding-inline-end:40px!important;width:100%}
/* اللون صريح ولازم: .login-card button يفرض color:#fff على كل زرّ داخل بطاقة الدخول،
   ورمز العين يُرسم محرفاً أحادي اللون يتبع لون النص — فكان أبيض على أبيض، موجوداً
   ومرئيّاً للفحص وغائباً عن العين. */
.pw-eye{position:absolute;inset-inline-end:5px;top:50%;transform:translateY(-50%);
  width:auto!important;background:none!important;border:none!important;padding:5px 7px!important;
  margin:0!important;cursor:pointer;font-size:16px!important;line-height:1;opacity:.75;
  color:#5f7070!important;border-radius:6px}
.pw-eye:hover{opacity:1;color:var(--teal-600)!important;background:rgba(10,138,138,.08)!important}
#fp-err,#rc-err{font-size:11px;color:#c0392b;text-align:center;min-height:16px;margin-top:7px;line-height:1.6}
#fp-err.ok,#rc-err.ok{color:#2e7d32}
.pw-card{background:#fff;border-radius:14px;padding:22px;width:360px;max-width:94vw;
  box-shadow:0 14px 44px rgba(0,0,0,.42)}
.pw-card h3{font-size:16px;color:var(--teal-600);text-align:center;margin-bottom:3px}
.pw-card .sub{font-size:11px;color:#aaa;text-align:center;margin-bottom:16px;line-height:1.7}
.pw-card input{width:100%;padding:10px 12px;font-size:13px;border:1px solid #d0cfc4;border-radius:7px;
  margin-bottom:9px;font-family:inherit;outline:none}
.pw-card input:focus{border-color:var(--teal-600)}
.pw-row{display:flex;gap:8px;margin-top:4px}
.pw-row button{flex:1;padding:11px;border:none;border-radius:7px;font-size:13.5px;font-weight:700;
  cursor:pointer;font-family:inherit}
#pw-btn{background:var(--teal-600);color:#fff}
#pw-btn:hover{background:#097878}
#pw-btn:disabled{background:#ccc}
.pw-cancel{background:#f0efe8;color:#666}
.pw-cancel:hover{background:#e4e3da}
#pw-err{font-size:11px;color:#c0392b;text-align:center;min-height:16px;margin-top:7px;line-height:1.6}
@media(max-width:820px){.home-grid{grid-template-columns:repeat(2,minmax(150px,1fr));max-width:520px}
  .home-ttl{font-size:24px}.home-logo{height:42px}}
/* شاشة الدخول على خلفية المشروع نفسها: نفس المتغيّر --home-bg المعرَّف أعلاه، فتبديل
   الصورة يسري على الشاشتين معاً. التعتيم هنا أثقل قليلاً لأن البطاقة بيضاء صغيرة. */
/* صفحة الدخول لها صورتها المؤسسية (--login-bg) لا المنظر الجوي: داكنة أصلاً وتحمل
   شعار TDCO مطبوعاً فيها، فالتعتيم هنا خفيف جداً — الثقيل يطمس الشعار الذي في الصورة.
   الصورة مربّعة، فوُضعت البطاقة إلى جهة تترك الشعار ظاهراً بدل أن تجلس فوقه. */
#login-screen{position:fixed;inset:0;z-index:10000;display:none;align-items:center;
  justify-content:flex-end;padding-inline-end:9vw;
  background:#12181a var(--login-bg,var(--home-bg,none)) center/cover no-repeat}
#login-screen::before{content:'';position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(8,20,22,.10),rgba(8,20,22,.34) 55%,rgba(8,20,22,.52))}
@media(max-width:900px){#login-screen{justify-content:center;padding-inline-end:0}
  #login-screen::before{background:rgba(8,20,22,.46)}}
.login-card{background:rgba(255,255,255,.97);border-radius:14px;padding:26px 22px;width:380px;max-width:92vw;
  box-shadow:0 14px 44px rgba(0,0,0,.42);position:relative;z-index:1}
/* الخلفية تحمل شعار TDCO كبيراً، فشعار البطاقة تكرار له على الشاشة نفسها */
.login-card img{display:none}
.login-card h2{font-size:17px;text-align:center;color:var(--teal-600);margin-bottom:4px}
.login-card .sub{font-size:11px;color:#aaa;text-align:center;margin-bottom:20px}
.login-card input{width:100%;padding:10px 12px;font-size:13px;border:1px solid #d0cfc4;border-radius:7px;margin-bottom:10px;font-family:inherit;outline:none}
.login-card input:focus{border-color:var(--teal-600)}
.login-card button{width:100%;padding:11px;background:var(--teal-600);color:#fff;border:none;border-radius:7px;font-size:14px;font-weight:600;cursor:pointer}
.login-card button:hover{background:#097878}
.login-card button:disabled{background:#ccc}
#lg-err{font-size:11px;color:#c0392b;text-align:center;min-height:16px;margin-top:6px}
.user-badge{font-size:9px;color:var(--teal-600);background:#e4f1f1;padding:3px 8px;border-radius:10px;white-space:nowrap}

/* ── update tab ── */
.upd-ctrl{padding:10px 12px;background:#fff;border-bottom:1px solid #e4e3da;flex-shrink:0}
.upd-ctrl label{font-size:clamp(11px,calc(11px + (100vw - 1280px)*0.0043),14.8px);font-weight:600;color:#555;display:block;margin-bottom:5px}
.upd-ctrl input,.upd-ctrl select{width:100%;padding:8px 10px;font-size:clamp(12px,calc(12px + (100vw - 1280px)*0.00469),16.2px);border:1px solid #d0cfc4;border-radius:6px;font-family:inherit;outline:none;margin-bottom:7px}
.upd-ctrl select:focus,.upd-ctrl input:focus{border-color:var(--teal-600)}
.upd-quick{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:7px}
.upd-quick button{flex:1;min-width:62px;font-size:clamp(10px,calc(10px + (100vw - 1280px)*0.00391),13.5px);padding:6px 4px;border:1px solid #d0cfc4;border-radius:5px;background:#fff;cursor:pointer;font-family:inherit;color:#555}
.upd-quick button:hover{background:#f4f3ee}
.upd-stat{padding:9px 12px;background:#ede7f6;border-bottom:1px solid #d1c4e9;font-size:clamp(11px,calc(11px + (100vw - 1280px)*0.0043),14.8px);color:#5e35b1;flex-shrink:0}
.upd-stat b{font-size:clamp(15px,calc(15px + (100vw - 1280px)*0.00586),20.2px)}
.upd-bd{font-size:clamp(10px,calc(10px + (100vw - 1280px)*0.00391),13.5px);color:#777;margin-top:3px}
.upd-apply{padding:11px 12px;background:#fff;border-top:1px solid #e4e3da;flex-shrink:0;transition:opacity .2s}
.upd-apply .t{font-size:clamp(10px,calc(10px + (100vw - 1280px)*0.00391),13.5px);color:#999;margin-bottom:7px}
.upd-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.upd-grid button{padding:12px 6px;font-size:clamp(12px,calc(12px + (100vw - 1280px)*0.00469),16.2px);font-weight:700;border:none;border-radius:7px;color:#fff;cursor:pointer;font-family:inherit}
.hint-shift{font-size:9px;color:#7e57c2;text-align:center;padding:5px}
/* ── mobile ── */
#mob-ui{display:none;flex-direction:column;height:100vh;background:#f0efe8}
body.mobile .app{display:none!important}
.mob-top{display:flex;align-items:center;justify-content:space-between;gap:7px;padding:9px 11px;background:#fff;border-bottom:1px solid #e4e3da;flex-shrink:0}
.mob-top img{height:22px}
.mob-top .r{font-size:9px;color:var(--teal-600);background:#e4f1f1;padding:3px 7px;border-radius:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px}
.mob-top button{font-size:11px;padding:6px 9px;border:1px solid #d0cfc4;border-radius:5px;background:#fff;font-family:inherit;white-space:nowrap}
.mob-ctrl{padding:10px;background:#fff;border-bottom:1px solid #e4e3da;flex-shrink:0}
.mob-ctrl input,.mob-ctrl select{width:100%;padding:11px;font-size:14px;border:1px solid #d0cfc4;border-radius:7px;font-family:inherit;outline:none;margin-bottom:7px}
.mob-row2{display:flex;gap:6px}
.mob-row2>*{flex:1;margin-bottom:0!important}
.mob-body{flex:1;overflow:hidden;display:flex;flex-direction:column}
#mob-map-wrap{display:none;flex:1;overflow:hidden;position:relative;background:#f8f8f2;touch-action:none}
#mob-svg{width:100%;height:100%}
#mob-grid-wrap{flex:1;overflow-y:auto;padding:9px}
.mob-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(56px,1fr));gap:6px}
.mob-villa{position:relative;padding:13px 4px;text-align:center;border:2px solid #ccc;border-radius:7px;font-size:13px;font-weight:600;cursor:pointer;user-select:none}
.mob-villa.sel{border-color:#7e57c2!important;box-shadow:0 0 0 2px #d1c4e9}
/* بانتظار اعتماد مدير المشروع: حدٌّ متقطّع ونقطة بنفسجية في الزاوية. المهندس
   يرسل تغييره فيبقى لون الخانة على القديم حتى يُبتّ فيه — فيظنّ أن شيئاً لم
   يقع ويُعيد الإرسال. والنقطة تقول: وصل، ولم يُعتمد بعد. والبنفسجي هو لون
   الطلب المعلّق نفسه على الشاشة الكبيرة، فلا يتعلّم لونين لمعنى واحد. */
.mob-villa.pend{border-color:#7e57c2!important;
  background-image:repeating-linear-gradient(45deg,
    rgba(126,87,194,.42) 0 4px, rgba(126,87,194,0) 4px 11px)}
.mob-villa.pend::after{content:"";position:absolute;top:3px;inset-inline-start:4px;
  width:8px;height:8px;border-radius:50%;background:#7e57c2;box-shadow:0 0 0 2px #fff}
.mob-pend{font-size:11.5px;color:#5e35b1;text-align:center;margin:-3px 0 7px;
  display:flex;align-items:center;justify-content:center;gap:5px}
.mob-pend .pdot{width:8px;height:8px;border-radius:50%;background:#7e57c2;flex:none}
.mob-hint{padding:26px;text-align:center;color:#bbb;font-size:13px}
.mob-foot{background:#fff;border-top:1px solid #e4e3da;padding:9px 10px;flex-shrink:0}
.mob-cnt{font-size:12px;color:#5e35b1;font-weight:600;margin-bottom:7px;text-align:center}
.mob-acts{display:grid;grid-template-columns:repeat(2,1fr);gap:5px}
.mob-acts button{padding:13px 3px;font-size:11px;font-weight:700;border:none;border-radius:7px;color:#fff;font-family:inherit}

/* ═══ تبويبا الجوال: الإنجاز والمواد ═══
   شاشة واحدة كانت تعني عملاً واحداً. استلام المواد ليس تحديث حالة، ولا يشترك
   معه في خطوة، فخلطهما في شريط أدوات واحد يجعل كل زر محتملَ الخطأ. */
/* ── الرئيسية في واجهة الموقع ──
   بطاقتان كبيرتان تُلمسان بإبهام واحد، بلا أرقام ولا مخططات: هذه واجهة رجلٍ واقف
   في الشمس، لا لوحة تحكّم. والأرقام مكانها الشاشة الكبيرة. */
#mob-home{display:none;flex:1;overflow-y:auto;padding:20px 14px 28px;background:#f0efe8}
#mob-home.on{display:block}
.mobh-ttl{font-size:15px;font-weight:800;color:#12343a;text-align:center}
.mobh-sub{font-size:11px;color:#8b9a9a;text-align:center;margin:3px 0 18px}
.mobh-card{display:flex;align-items:center;gap:13px;background:#fff;border:1px solid #e4e3da;
  border-radius:13px;padding:17px 15px;margin-bottom:11px;box-shadow:0 2px 8px rgba(0,0,0,.05)}
.mobh-card:active{background:#f4fbfb;border-color:var(--teal-600)}
.mobh-card .ic{font-size:28px;line-height:1;flex:none}
.mobh-card .nm{font-size:14.5px;font-weight:700;color:#12343a}
.mobh-card .cap{font-size:11px;color:#8b9a9a;margin-top:3px;line-height:1.55}
.mobh-none{padding:34px 16px;text-align:center;color:#999;font-size:12.5px;line-height:1.9}
.mob-tabs{display:flex;background:#fff;border-bottom:1px solid #e4e3da;flex-shrink:0}
.mob-tabs button{flex:1;padding:11px 4px;font-size:12.5px;font-weight:700;font-family:inherit;
  border:none;background:none;color:#8a8a80;border-bottom:2.5px solid transparent}
.mob-tabs button.on{color:var(--teal-600);border-bottom-color:var(--teal-600);background:#f4fbfb}
#mob-pane-mat{display:none;flex:1;overflow-y:auto;background:#f0efe8;flex-direction:column}
#mob-pane-mat.on{display:flex}
.mat-crumb{display:flex;align-items:center;gap:6px;padding:8px 10px;background:#fff;
  border-bottom:1px solid #e4e3da;font-size:11px;color:#5f6f6f;flex-shrink:0;flex-wrap:wrap}
.mat-crumb b{color:var(--teal-600)}
.mat-crumb button{font-size:10.5px;padding:4px 9px;border:1px solid #d0cfc4;border-radius:5px;
  background:#fff;font-family:inherit;color:#555}
.mat-body{flex:1;overflow-y:auto;padding:9px}
.mat-foot{background:#fff;border-top:1px solid #e4e3da;padding:9px 10px;flex-shrink:0}
.mat-foot button{width:100%;padding:13px;font-size:13px;font-weight:700;border:none;
  border-radius:7px;color:#fff;font-family:inherit;background:var(--teal-600)}
.mat-foot button[disabled]{background:#c3c3bb}
/* بطاقة بند: الاسم، وحالته، وما ينقصه — النقص هو سبب فتح الشاشة فيُقرأ أولاً */
.mat-act{background:#fff;border:1px solid #e4e3da;border-radius:8px;padding:10px 11px;
  margin-bottom:7px;border-right:3px solid #cfcfc6}
.mat-act .t{font-size:13px;font-weight:700;color:#33413f;margin-bottom:3px}
.mat-act .m{font-size:10.5px;color:#8a8a80;display:flex;gap:9px;flex-wrap:wrap}
.mat-act .short{color:#c62828;font-weight:700}
.mat-act .done{color:#2d7a2d;font-weight:700}
/* سطر مادة: مربع الاختيار كبير — إبهامٌ في الشمس لا يصيب مربعاً صغيراً */
.mat-line{display:flex;align-items:center;gap:9px;background:#fff;border:1px solid #e4e3da;
  border-radius:8px;padding:9px 10px;margin-bottom:6px}
.mat-line.on{border-color:var(--teal-600);background:#f4fbfb}
.mat-line input[type=checkbox]{width:21px;height:21px;flex-shrink:0;accent-color:var(--teal-600)}
.mat-line .in{flex:1;min-width:0}
.mat-line .n{font-size:12.5px;font-weight:600;color:#33413f;line-height:1.35}
.mat-line .c{font-size:9.5px;color:#9a9a90;direction:ltr;text-align:right}
.mat-line .q{width:74px;flex-shrink:0;padding:9px 6px;font-size:14px;text-align:center;
  border:1px solid #d0cfc4;border-radius:6px;font-family:inherit;outline:none}
.mat-line .q.over{border-color:#e57373;background:#fff5f5;color:#c62828}
.mat-line .u{font-size:9.5px;color:#8a8a80;flex-shrink:0;width:34px;text-align:center}
.mat-warn{font-size:10.5px;color:#8a6d00;background:#fff8e1;border:1px solid #ffe082;
  border-radius:6px;padding:6px 8px;margin:6px 0}
.mat-photo{display:block;background:#fff;border:1px dashed #b6c9c9;border-radius:8px;
  padding:14px;text-align:center;font-size:12px;color:var(--teal-600);margin-bottom:8px}
.mat-photo img{max-width:100%;border-radius:6px;margin-top:7px}
.mat-queue{font-size:10.5px;color:#5f6f6f;background:#eef4f4;border:1px solid #cfe0e0;
  border-radius:6px;padding:6px 8px;margin-bottom:7px}
/* المادة المضافة من خارج الحصر تُميَّز بصرياً: بديلٌ أو زيادة ليس خطأً، لكنه
   ليس مما خطّطه الحصر، فيُقرأ مختلفاً عند المراجعة. */
.mat-line.extra{border-right:3px solid #8e7cc3;background:#faf8ff}
.mat-line.extra.on{background:#f3efff}
.mat-add{background:#fff;border:1px solid #cfe0e0;border-radius:8px;padding:9px;margin-bottom:8px}
.mat-add input{width:100%;padding:10px;font-size:13px;border:1px solid #d0cfc4;
  border-radius:6px;font-family:inherit;outline:none;box-sizing:border-box}
.mat-add-res{max-height:230px;overflow-y:auto;margin-top:7px}
.mat-add-row{padding:9px 8px;border-bottom:1px solid #f0efe8;cursor:pointer}
.mat-add-row:last-child{border-bottom:none}
.mat-add-row b{display:block;font-size:12.5px;color:#33413f;font-weight:600}
.mat-add-row span{font-size:9.5px;color:#9a9a90;direction:ltr;display:block;text-align:right}

/* ═══ تبويب المستودعات (سطح المكتب) ═══ */
.wh-cards,.wh-cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:12px}
.wh-cards{display:block}
/* قسمان منفصلان لا مفتاحٌ واحد — الفرق بينهما لا يُصلَح بعد وقوعه */
.wh-subtabs{display:flex;gap:8px;margin-bottom:11px}
.wh-subtabs button{flex:1;padding:11px 9px;font-size:13px;font-weight:700;font-family:inherit;
  border:1.6px solid #dfe6e6;border-radius:9px;background:#fff;color:#8a9a9a;cursor:pointer}
/* المختار يُقرأ من بُعد لا بتلميحٍ فاتح: خلفيةٌ صلبة ونصٌّ أبيض. الوضعان
   يبتلعان الملف نفسه ويُخرجان رقمين متباعدين، فالتباس أيّهما نشط أغلى من
   أناقة اللون — وتدرّجٌ فاتح على أبيض لا يقول أيّهما اخترت. */
.wh-subtabs button.on.bal{border-color:#b58900;background:#b58900;color:#fff}
.wh-subtabs button.on.sup{border-color:var(--teal-600);background:var(--teal-600);color:#fff}
.wh-banner{font-size:11.5px;line-height:1.65;border-radius:8px;padding:9px 12px;margin-bottom:12px}
.wh-banner.bal{background:#fff8e1;border:1px solid #ffe082;color:#7a6100}
.wh-banner.sup{background:#eef7f7;border:1px solid #bfdcdc;color:#0a6f6f}
.upd-btn.sup{background:var(--teal-600);color:#fff;border-color:var(--teal-600);border-style:solid}
/* .upd-btn عرضها 100% لأنها بُنيت لعمود. في صفٍّ أفقي تُعيدها إلى مقاس محتواها،
   وإلا انفرد كل زرّ بسطر فبدا شريط الأدوات قائمةً وضاع «التالي» في وسطها. */
.wh-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:11px}
.wh-row .upd-btn{width:auto;flex:0 0 auto}
.wh-row .upd-btn.go{background:var(--teal-600);color:#fff;border-color:var(--teal-600);border-style:solid;font-weight:700;padding:9px 22px}
.wh-empty{padding:22px;border:1px dashed #dfe6e6;border-radius:9px;color:#7d8f8f;font-size:12.5px;line-height:1.8}
.wh-hidden-note{font-size:11.5px;color:#7d8f8f;background:#f4f8f8;border-radius:7px;
  padding:8px 11px;margin-bottom:10px}
.wh-hidden-note a{color:var(--teal-600);cursor:pointer;text-decoration:underline}

/* ═══ المستخدمون ═══ */
.us-sec{border:1px solid #e4e3da;border-radius:11px;padding:16px 18px;margin-bottom:14px;background:#fff}
.us-sec h3{margin:0 0 3px;font-size:15.5px;color:#23403f}
.us-sec .hint{font-size:11.5px;color:#8a9a9a;margin-bottom:13px;line-height:1.7}
.us-form{display:grid;grid-template-columns:2fr 1fr;gap:10px;margin-bottom:12px}
.us-form input,.us-form select{padding:10px 12px;font-size:13px;border:1px solid #d7dede;
  border-radius:7px;font-family:inherit;outline:none;background:#fff}
.us-form input:focus,.us-form select:focus{border-color:var(--teal-600)}
/* الصفحات تُختار بمربعات لا بقائمة: المدير يقرأ ما مُنح وما مُنع في نظرة واحدة،
   وقائمةٌ متعددة الاختيار تُخفي المستبعَد فيُمنح بالخطأ ما لم يُقصد. */
.us-pages{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:7px;margin-bottom:12px}
.us-page{display:flex;align-items:center;gap:9px;border:1.5px solid #e4e3da;border-radius:8px;
  padding:9px 11px;cursor:pointer;font-size:12.5px;background:#fff;user-select:none}
.us-page.on{border-color:var(--teal-600);background:#f2fafa;color:#0a6f6f;font-weight:600}
.us-page input{width:17px;height:17px;accent-color:var(--teal-600)}
.us-table{width:100%;border-collapse:collapse;font-size:12.5px}
.us-table th,.us-table td{border-bottom:1px solid #eef1f1;padding:9px 10px;text-align:right}
.us-table th{background:#f7fafa;color:#3a4f4f;font-weight:700;font-size:11.5px}
.us-table td.pg{font-size:11px;color:#5f6f6f;line-height:1.8}
.us-badge{display:inline-block;font-size:10px;padding:2px 8px;border-radius:9px;
  background:#e4f1f1;color:#0a6f6f;font-weight:700}
.us-badge.pend{background:#fff8e1;color:#8a6d00}
.us-badge.mgr{background:#ede7f6;color:#4527a0}
.us-act{font-size:11px;padding:5px 10px;border:1px solid #d7dede;border-radius:6px;
  background:#fff;font-family:inherit;cursor:pointer;margin-inline-start:5px}
.us-act.del{color:#c62828;border-color:#f0c4c4}
.us-note{font-size:11.5px;line-height:1.8;background:#eef4f4;border:1px solid #cfe0e0;
  border-radius:8px;padding:11px 13px;margin-bottom:13px;color:#3f5555}
.us-note b{color:#0a6f6f}

/* ═══ التقارير ═══ */
/* ═══ المستودعات: مبدّل المستودع ثم تبويباته ═══
   المستودع المختار يُقرأ من بُعد: حدٌّ ملوّن وخلفية، لا علامةُ صحٍّ صغيرة. */
/* أرضيةُ الصفحة: بلا هذه يطفو المحتوى فوق صورة المشروع — الأقسام البيضاء
   كانت تحمله قبل التبويبات، وزوالُها ترك الصفحة بلا سطحٍ تقف عليه. */
.wh-sheet{background:#fff;padding:14px 16px 20px;flex:1;overflow-y:auto}
.wh-switch{margin-bottom:14px}
.wh-store{border:1px solid #e4e3da;border-radius:11px;padding:14px 16px;background:#fff;
  border-top:3px solid #d7dede}
.wh-store h4{margin:0 0 3px;font-size:15px;color:#23403f}
.wh-store .role{font-size:11.5px;color:#8a9a9a;line-height:1.6}
.wh-store .stat{font-size:12.5px;color:#3a4f4f;margin-top:7px}
.wh-store .stat b{color:#0a6f6f}
.wh-store.on{border-top-color:var(--teal-600);background:#f4faf9;box-shadow:0 4px 14px rgba(10,138,138,.13)}
.wh-store.main.on{border-top-color:#9a6700;background:#fdfaf2}
.wh-store.main.on .stat b{color:#7a5200}
.wh-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px;border-bottom:1px solid #e4e3da;padding-bottom:9px}
.wh-tabs button{padding:8px 15px;font-size:12.5px;font-family:inherit;cursor:pointer;
  border:1px solid #e4e3da;background:#fff;color:#50676a;border-radius:9px;white-space:nowrap}
.wh-tabs button:hover{background:#edf6f5;color:#087c7e}
.wh-tabs button.on{background:var(--teal-600);color:#fff;border-color:var(--teal-600);font-weight:700}

/* سطرٌ يقول أين انتقل قرار النطاق — لا مبدّلٌ فيه */
.rep-scope-pick{display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  border:1px solid #e4e3da;border-radius:11px;padding:12px 16px;margin-bottom:14px;background:#fbfcfc}
.rep-scope-say{display:block;font-size:12px;color:#50676a;line-height:1.9}
.rep-scope-say b{color:#23403f}

/* مبدّل المجموعة داخل البطاقة: ثلاثة أزرارٍ في سطر البطاقة نفسه، أصغر من مبدّل
   الخريطة لأنه يتكرّر أربع مرات في الصفحة — ولو أخذ حجمه لسبق البطاقةَ إلى العين */
.rep-sw-host{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 12px}
.rep-sw-hd{font-size:11.5px;font-weight:700;color:#50676a}
.scope-switch.rep-sw{display:inline-grid;grid-template-columns:repeat(3,minmax(92px,auto));
  box-shadow:none;background:#f4f8f8;border:1px solid #e4e3da;padding:3px;border-radius:10px}
.scope-switch.rep-sw .scope-opt{height:34px;min-width:92px;border-color:#e4e3da;
  background:#fff;color:#50676a;gap:6px}
.scope-switch.rep-sw .scope-opt .scope-count{font-size:14px}
.scope-switch.rep-sw .scope-opt .scope-label{font-size:11.5px}
.scope-switch.rep-sw .scope-opt.on{background:var(--teal-600);color:#fff;border-color:var(--teal-600)}
/* بطاقة المتابعة الأسبوعية وحدها لها خيارٌ رابع: «خطة المالك» */
.scope-switch.rep-sw4{grid-template-columns:repeat(4,minmax(92px,auto))}
@media(max-width:700px){
  .scope-switch.rep-sw{grid-template-columns:repeat(3,minmax(76px,1fr));width:100%}
  .scope-switch.rep-sw4{grid-template-columns:repeat(2,minmax(76px,1fr))}
  .scope-switch.rep-sw .scope-opt{min-width:76px;height:32px}
  .scope-switch.rep-sw .scope-opt .scope-label{font-size:10.5px}
}
.rep-card{border:1px solid #e4e3da;border-radius:11px;padding:16px 18px;margin-bottom:14px;background:#fff}
.rep-card h3{margin:0 0 4px;font-size:15.5px;color:#23403f}
.rep-note{font-size:11.5px;color:#8a9a9a;margin:0 0 12px;line-height:1.75}
.rep-card.rep-soon{background:#fbfcfc;border-style:dashed;opacity:.85}
.rep-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:11px}
.rep-row label{font-size:12px;color:#3a4f4f}
.rep-row input[type=date]{font-family:inherit;font-size:12.5px;padding:7px 9px;
  border:1px solid #d7dede;border-radius:7px;color:#23403f;background:#fff}
.rep-lbl{font-size:12px;color:#7d8f8f;font-weight:700}
.rep-sep{width:1px;height:22px;background:#e4e3da}
.rep-chk{display:inline-flex;align-items:center;gap:5px;font-size:12px;cursor:pointer}
.rep-chk input{width:16px;height:16px;accent-color:var(--teal-600)}
.rep-btn{font-size:12.5px;padding:9px 16px;border-radius:8px;font-family:inherit;cursor:pointer;
  font-weight:700;border:1px solid var(--teal-600);background:var(--teal-600);color:#fff}
.rep-btn:disabled{opacity:.55;cursor:default}
.rep-btn.ghost{background:#fff;color:#0a6f6f}
.rep-mini{font-size:11.5px;padding:5px 11px;border-radius:7px;font-family:inherit;cursor:pointer;
  font-weight:700;border:1px solid #d7dede;background:#fff;color:#3a4f4f}
.rep-pick{border:1px solid #eef1f1;border-radius:9px;margin-bottom:12px;overflow:hidden}
.rep-pick-hd{display:flex;align-items:center;gap:9px;padding:9px 12px;background:#f9fbfb;font-size:12px;color:#3a4f4f}
.rep-pick-hd b{color:#0a6f6f}
.rep-items{max-height:210px;overflow-y:auto;padding:10px 12px;
  display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:3px 14px}
.rep-sec-hd{font-size:11.5px;font-weight:700;color:#0a6f6f;padding:6px 0 3px;cursor:pointer}
.rep-sec-hd span{color:#9aa8a8;font-weight:400}
.rep-it{display:flex;align-items:center;gap:6px;font-size:11.5px;color:#3f5555;padding:2px 0;cursor:pointer}
.rep-it input{width:15px;height:15px;accent-color:var(--teal-600)}
.rep-sum{font-size:12.5px;color:#23403f;background:#f4f8f8;border-radius:8px;padding:10px 13px;margin-bottom:9px}
.rep-sum b{color:#0a6f6f;font-size:14px}
.rep-empty{padding:22px;border:1px dashed #dfe6e6;border-radius:9px;color:#7d8f8f;font-size:12.5px}
.rep-tbl-wrap{overflow-x:auto;border:1px solid #eef1f1;border-radius:9px}
.rep-tbl{width:100%;border-collapse:collapse;font-size:12px}
.rep-tbl th,.rep-tbl td{border-bottom:1px solid #eef1f1;padding:7px 11px;text-align:right;white-space:nowrap}
.rep-tbl th{background:#fbfcfc;color:#3a4f4f;font-weight:700;font-size:11px;position:sticky;top:0}
.rep-tbl td.nm{white-space:normal;min-width:220px}
.rep-tbl td.code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;color:#7d8f8f}
.rep-tbl td.dt{font-variant-numeric:tabular-nums;color:#23403f}
.rep-dash{color:#c9d3d3}
.rep-per th{text-align:center}
/* لونٌ لكل مجموعة: «عند التاريخ الأول» و«عند الثاني» عنوانان متشابهان،
   وقراءةُ أحدهما مكان الآخر تقلب الفرق كله. */
.rep-per th.grp{border-inline:1px solid #e4e3da;color:#fff}
.rep-per th.ga{background:#546e7a}
.rep-per th.gb{background:#00695c}
.rep-per th.gc{background:#9a6700}
.rep-per th.sa{background:#eceff1;color:#37474f}
.rep-per th.sb{background:#e0f2f1;color:#00695c}
.rep-per th.sc{background:#fff8e1;color:#7a5200}
.rep-per th span{font-weight:400;color:#9aa8a8;font-size:10px}
.rep-per th.grp span{color:#dfeceb}
/* تقرير الفترتين: خمس مجموعات ثلاثية، وعناوينها متطابقة الألفاظ — «جاري»
   يتكرّر خمس مرات. فالنطاق اللوني يمتدّ من الترويسة إلى الخلايا ليُتتبَّع
   نازلًا في تسعين صفًّا، والحدّ يفصل مجموعةً عن أختها.
   والتواريخ الثلاثة تدرّجٌ واحد يشتدّ مع الزمن — شيءٌ واحد في ثلاث لحظات —
   والفترتان لونان مختلفان لأنهما حسابٌ لا رصيد. */
.rep-per th.bd,.rep-per td.bd{border-inline-start:1px solid #cfdada}
.rep-per th.gh-a{background:#7a8c99}
.rep-per th.gh-b{background:#4d6b80}
.rep-per th.gh-c{background:#26485c}
.rep-per th.gh-d{background:#00695c}
.rep-per th.gh-e{background:#9a6700}
.rep-per th.sh-a{background:#eef1f3;color:#3a4f5c}
.rep-per th.sh-b{background:#e3ecf1;color:#2c4757}
.rep-per th.sh-c{background:#d6e6ee;color:#1e3d4d}
.rep-per th.sh-d{background:#d7ece9;color:#00564b}
.rep-per th.sh-e{background:#f7e8c8;color:#7a5200}
.rep-per td.bc-a{background:#fafbfc}
.rep-per td.bc-b{background:#f4f8fa}
.rep-per td.bc-c{background:#edf4f8}
.rep-per td.bc-d{background:#f1f9f7}
.rep-per td.bc-e{background:#fdf8ee}
.rep-per td.sign{font-weight:700;color:#546e7a}
.rep-per td.num{text-align:center;font-variant-numeric:tabular-nums}
.rep-per td.up{color:#2e7d32;font-weight:700}
.rep-per td.down{color:#c62828;font-weight:700}
/* عمودا الانحراف في تقرير تحديثات المشروع: كان اللونان مقصورين على جدول الفترة
   (.rep-per)، فيخرج الانحراف بلا لون في الجدول الذي هو موضعه. والإشارة تُقرأ
   مخطط − فعلي: موجبٌ تقدّم أخضر، سالبٌ تأخّر أحمر. */
.rep-tbl td.up{color:#2e7d32;font-weight:700}
.rep-tbl td.down{color:#c62828;font-weight:700}
.rep-tbl th span{display:block;font-weight:400;color:#9aa8a8;font-size:10px}
.rep-per td.rate{font-weight:700;color:#23403f}
.rep-per tr.tot td{background:#f4f8f8;font-weight:700;border-top:2px solid #d7dede}

/* ═══ الاعتمادات ═══ */
.ap-badge{display:inline-block;min-width:17px;padding:1px 5px;margin-inline-start:6px;
  border-radius:9px;background:#c62828;color:#fff;font-size:10px;font-weight:700;line-height:1.5}
.ap-batch{border:1px solid #e4e3da;border-radius:11px;margin-bottom:14px;background:#fff;overflow:hidden}
.ap-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 15px;
  background:#f4f8f8;border-bottom:1px solid #e4e3da}
.ap-head b{font-size:14px;color:#23403f}
.ap-head .meta{font-size:11.5px;color:#7d8f8f}
.ap-head .sp{flex:1}
.ap-head button{font-size:12px;padding:8px 15px;border-radius:7px;font-family:inherit;
  cursor:pointer;font-weight:700;border:1px solid #d7dede;background:#fff}
.ap-head button.ok{background:var(--teal-600);color:#fff;border-color:var(--teal-600)}
.ap-head button.no{color:#c62828;border-color:#f0c4c4}
.ap-table{width:100%;border-collapse:collapse;font-size:12.5px}
.ap-table th,.ap-table td{border-bottom:1px solid #eef1f1;padding:8px 12px;text-align:right}
.ap-table th{background:#fbfcfc;color:#3a4f4f;font-weight:700;font-size:11.5px}
.ap-table input[type=checkbox]{width:17px;height:17px;accent-color:var(--teal-600)}
.ap-st{display:inline-block;font-size:11px;padding:2px 9px;border-radius:9px;font-weight:700}
.ap-arrow{color:#9aa8a8;padding:0 4px}
/* صفٌّ تغيّرت حالته بعد الطلب: اعتمادُه يمحو تغييرًا أحدثَ منه */
.ap-table tr.stale td{background:#fff8e1}
.ap-stale{font-size:10px;color:#8a6d00;font-weight:700}
/* «لا جديد»: المطلوب هو الحالة القائمة نفسها. رماديّ لا أصفر — ليس تحذيرًا
   بل صفٌّ لا قرار فيه، فلا يزاحم بلونه ما يستحقّ النظر. */
.ap-noop{font-size:10px;color:#8a8a8a;font-weight:700;border:1px solid #dcdcdc;
  border-radius:4px;padding:0 4px;margin-inline-start:4px}
/* الفيلا ذات الطلب المعلّق — قطر مائل يميّزها عن الحالة المعتمدة */
.upd-cell.pendreq,.mob-villa.pendreq{
  background-image:repeating-linear-gradient(45deg,rgba(126,87,194,.22) 0 6px,transparent 6px 12px)}
.pendreq-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#7e57c2;
  margin-inline-start:4px;vertical-align:middle}
.wh-card{border:1px solid #dfe6e6;border-radius:10px;padding:14px 15px;background:#fff}
.wh-card.main{border-color:#cfd9ea;background:linear-gradient(145deg,#fbfcff,#f4f7fc)}
.wh-card h4{margin:0 0 2px;font-size:15px;color:#23403f}
.wh-card .role{font-size:10.5px;color:#7d8f8f;margin-bottom:9px}
.wh-card .stat{font-size:11.5px;color:#5f6f6f;background:#f4f8f8;border-radius:6px;
  padding:6px 9px;margin-bottom:10px}
.wh-modes{display:flex;gap:6px;margin-bottom:9px}
.wh-modes label{flex:1;font-size:11.5px;border:1px solid #d7dede;border-radius:7px;
  padding:8px 9px;cursor:pointer;line-height:1.4;background:#fff}
.wh-modes label.on{border-color:var(--teal-600);background:#f2fafa;color:#0a6f6f;font-weight:700}
.wh-modes label b{display:block;font-size:12.5px}
.wh-modes label span{font-size:9.5px;color:#8a9a9a;font-weight:400}
.wh-modes input{display:none}
.wh-crumb{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:12px;
  color:#5f6f6f;margin-bottom:11px}
.wh-crumb b{color:var(--teal-600)}
.wh-vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(62px,1fr));gap:6px;
  max-height:250px;overflow-y:auto;padding:3px}
.wh-v{padding:9px 3px;text-align:center;border:1.6px solid #d7dede;border-radius:7px;
  font-size:12.5px;font-weight:600;cursor:pointer;user-select:none;background:#fff}
.wh-v.on{border-color:#7e57c2;background:#ede7f6;color:#4527a0}
/* مصفوفة الاستلام: صفٌّ لكل مادة، وعمودٌ لكل فيلا مختارة. المادة الواحدة تُستلم
   لعدة فلل، وكميةُ كلٍّ منها حصرُها هي حسب موديلها — فتُملأ ولا تُطلب. */
.wh-matrix{width:100%;border-collapse:collapse;font-size:12px}
.wh-matrix th,.wh-matrix td{border:1px solid #e8ecec;padding:5px 7px;text-align:center}
.wh-matrix th{background:#f4f8f8;font-weight:700;color:#3a4f4f;position:sticky;top:0;z-index:1}
.wh-matrix td.mat{text-align:right;min-width:190px}
.wh-matrix td.mat b{display:block;font-size:12.5px;color:#33413f}
.wh-matrix td.mat span{font-size:9.5px;color:#9a9a90;direction:ltr;display:block;text-align:right}
.wh-matrix input{width:66px;padding:6px 4px;text-align:center;border:1px solid #d7dede;
  border-radius:5px;font-family:inherit;font-size:12.5px;outline:none}
.wh-matrix input.over{border-color:#e57373;background:#fff5f5;color:#c62828}
.wh-matrix input.zero{color:#c0c8c8}
.wh-matrix td.tot{font-weight:700;color:#0a6f6f;background:#f7fbfb}
.wh-matrix tr.extra td.mat{border-right:3px solid #8e7cc3}
.wh-scroll{max-height:460px;overflow:auto;border:1px solid #e8ecec;border-radius:8px}

.lab-head{display:flex;justify-content:space-between;align-items:center;padding:9px 11px;background:#f4f8f8;border-radius:7px;margin-bottom:10px;font-size:clamp(12px,calc(12px + (100vw - 1280px)*0.00469),16.2px)}
.lab-tbl{width:100%;border-collapse:collapse;font-size:clamp(11px,calc(11px + (100vw - 1280px)*0.0043),14.8px);margin-bottom:10px}
.lab-tbl th{background:#2e4057;color:#fff;padding:7px 4px;font-size:clamp(10px,calc(10px + (100vw - 1280px)*0.00391),13.5px);font-weight:600}
.lab-tbl td{padding:7px 4px;border-bottom:1px solid #f0efe8;vertical-align:middle}
.lab-tbl tr.lab-tot td{background:#f2c811;font-weight:700;border-top:2px solid #2e4057}
.lab-in{width:54px;padding:5px;font-size:clamp(12px,calc(12px + (100vw - 1280px)*0.00469),16.2px);border:1px solid #d0cfc4;border-radius:5px;text-align:center;font-family:inherit;outline:none}
/* فئة خارج أقسامه: الحقل مقفل والرقم ظاهر — يُقرأ ولا يُكتب */
.lab-in:disabled{background:#f4f3ee;color:#999;cursor:not-allowed}
.lab-lock{font-size:10px;opacity:.5;cursor:help}
.lab-in:focus{border-color:var(--teal-600)}
.lab-in:disabled{background:#f4f3ee;color:#999}
.lab-save{width:100%;padding:11px;background:var(--teal-600);color:#fff;border:none;border-radius:7px;font-size:clamp(13px,calc(13px + (100vw - 1280px)*0.00508),17.6px);font-weight:700;cursor:pointer;font-family:inherit;margin-bottom:10px}
.lab-save:hover{background:#097878}
.lab-note{background:#f7fbfb;border-right:3px solid var(--teal-600);border-radius:6px;padding:9px 11px;font-size:clamp(10px,calc(10px + (100vw - 1280px)*0.00391),13.5px);color:#666;line-height:1.7;margin-bottom:9px}

.lab-exp{width:100%;padding:10px;background:#fff;color:var(--teal-600);border:1.5px solid var(--teal-600);border-radius:7px;font-size:clamp(12.5px,calc(12.5px + (100vw - 1280px)*0.00488),16.9px);font-weight:700;cursor:pointer;font-family:inherit;margin-bottom:10px}
.lab-exp:hover{background:#e4f1f1}

.la-cards{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:12px}
.la-card{background:#fff;border:2px solid #ddd;border-radius:9px;padding:10px 8px;text-align:center}
.la-card .v{font-size:clamp(22px,calc(22px + (100vw - 1280px)*0.00859),29.7px);font-weight:800;line-height:1}
.la-card .l{font-size:clamp(10px,calc(10px + (100vw - 1280px)*0.00391),13.5px);color:#777;margin-top:3px}
.la-card .s{font-size:clamp(8.5px,calc(8.5px + (100vw - 1280px)*0.00332),11.5px);color:#aaa;margin-top:2px}
.la-t{font-size:clamp(11px,calc(11px + (100vw - 1280px)*0.0043),14.8px);font-weight:700;color:#555;margin:12px 0 6px}
.la-tbl{width:100%;border-collapse:collapse;font-size:clamp(10.5px,calc(10.5px + (100vw - 1280px)*0.0041),14.2px);margin-bottom:8px}
.la-tbl th{background:#2e4057;color:#fff;padding:6px 3px;font-size:clamp(9.5px,calc(9.5px + (100vw - 1280px)*0.00371),12.8px);font-weight:600}
.la-tbl td{padding:6px 4px;border-bottom:1px solid #f0efe8}
.la-row{cursor:pointer}
.la-row:hover{background:#f4f3ee}
.la-row.on{background:#e4f1f1;border-right:3px solid var(--teal-600)}
.la-tab{font-size:clamp(10px,calc(10px + (100vw - 1280px)*0.00391),13.5px);padding:4px 9px;border:1px solid #d0cfc4;border-radius:5px;background:#fff;cursor:pointer;font-family:inherit;color:#666;margin-right:3px}
.la-tab.on{background:var(--teal-600);color:#fff;border-color:var(--teal-600);font-weight:700}
.la-exp{width:100%;padding:10px;background:#fff;color:var(--teal-600);border:1.5px solid var(--teal-600);border-radius:7px;font-size:clamp(12px,calc(12px + (100vw - 1280px)*0.00469),16.2px);font-weight:700;cursor:pointer;font-family:inherit;margin:8px 0}
.la-exp:hover{background:#e4f1f1}
.la-note{background:#f7fbfb;border-right:3px solid var(--teal-600);border-radius:6px;padding:9px 11px;font-size:clamp(9.5px,calc(9.5px + (100vw - 1280px)*0.00371),12.8px);color:#666;line-height:1.8}
.la-hint{padding:26px;text-align:center;color:#bbb;font-size:clamp(12px,calc(12px + (100vw - 1280px)*0.00469),16.2px)}
/* شريط اختيار بنود التقرير: العدد أولاً لأنه ما يُتابَع، والأزرار في الطرف الآخر. */
.la-pick-bar{display:flex;align-items:center;gap:8px;margin-top:7px;padding:7px 9px;
  background:#f4f8f8;border:1px solid #dcebea;border-radius:8px;
  font-size:clamp(10.5px,calc(10.5px + (100vw - 1280px)*0.0041),14.2px);color:#2b4a4a}
.la-pick-btn{font-size:clamp(9.5px,calc(9.5px + (100vw - 1280px)*0.00371),13px);padding:4px 9px;margin-inline-start:4px;
  border:1px solid #b6d6d4;border-radius:6px;background:#fff;color:var(--teal-600);cursor:pointer;font-family:inherit}
.la-pick-btn:hover:not(:disabled){background:#e4f1f1}
.la-pick-btn:disabled{opacity:.45;cursor:not-allowed}
.la-pick{width:15px;height:15px;accent-color:var(--teal-600);cursor:pointer;vertical-align:middle}
/* شرائح الأقسام: لون كل قسم هو لونه المعتمد في بقية البرنامج، فلا يُتعلَّم لون جديد.
   ثلاث حالات — لا شيء، بعضه (n/الكل)، كله (مصمتة). */
.la-sec-bar{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.la-sec-chip{font-size:clamp(9.5px,calc(9.5px + (100vw - 1280px)*0.00371),13px);padding:4px 9px;
  border:1.5px solid #ccc;border-radius:20px;background:#fff;cursor:pointer;font-family:inherit;
  display:inline-flex;align-items:center;gap:4px;white-space:nowrap;transition:.15s}
/* ═══ اختيار البند في صفحة تحديث الحالات ═══
   المنسدلة صارت قائمةً مرئية تملأ الفراغ الذي كان تحت عدّاد الفلل: تسعون بندًا
   خلف نقرةٍ وتمرير، والمختارُ منها لا يُرى إلا بفتحها — وهو البند الذي تنزل
   عليه الحالة. والشرائح تحتها تصفّيها. */
.upd-secs{display:flex;flex-wrap:wrap;gap:5px;padding:7px 9px;border-top:1px solid #e4e3da;background:#fbfcfc;flex-shrink:0}
.upd-list{flex:1;overflow-y:auto;border-top:1px solid #e4e3da;background:#fff;min-height:90px}
.upd-li{display:flex;align-items:center;gap:7px;padding:7px 10px;font-size:12px;cursor:pointer;
  border-bottom:1px solid #f1f4f4;border-inline-start:3px solid transparent;color:#33474a}
.upd-li:hover{background:#f4faf9}
.upd-li .n{min-width:22px;font-weight:800;color:#8a9a9a;font-variant-numeric:tabular-nums}
.upd-li.on{background:var(--teal-600);color:#fff;font-weight:700}
.upd-li.on .n{color:#cfeceb}
.upd-li.locked{opacity:.55}
.upd-li .lk{margin-inline-start:auto;font-size:10px}
.upd-li-empty{padding:16px;text-align:center;color:#b6c2c2;font-size:12px}
/* الصفّ المحسوب: خطٌّ متقطّع على حافّته يقول إنه ليس بندًا مثل إخوته —
   لا رقم له في المشروع، ولا يُضغط ليُحدَّث بل ليُقرأ على الخريطة. */
.upd-li.v-li{border-inline-start-style:dashed;background:#faf8fd;font-style:italic}
.upd-li.v-li:hover{background:#f3eefb}
.upd-li.v-li.on{background:#7e57c2;color:#fff;font-style:normal;font-weight:700}
.upd-li.v-li .n{color:#7e57c2;font-size:13px}
.upd-li.v-li.on .n{color:#e6dcf7}
/* المختار مكتوبٌ فوق القائمة: التصفية قد تُخفيه، ولا يجوز أن يُخفى معه علمُه */
.upd-picked{border:1.6px solid #dfe6e6;border-radius:8px;padding:7px 10px;font-size:12px;background:#fff;margin-bottom:2px}
.upd-picked .none{color:#b6c2c2}
.upd-picked.on{background:#f4faf9}
.upd-picked b{display:block;color:#23403f;line-height:1.5}
.upd-picked .sec{font-size:10.5px;font-weight:700}
.la-sec-chip b{font-size:.92em;opacity:.75}
.la-sec-chip.on{color:#fff}
.la-sec-chip.on b{opacity:.9}
.la-sec-chip.part{background:#f4f8f8;font-weight:700}
.la-sec-chip:hover{filter:brightness(.96)}
/* بطاقة البند المعروض على الخريطة: حالةٌ أخرى غير سلّة الطباعة، فلها إطارها ولونها.
   خلطُ الاثنين في لوحةٍ واحدة كان أصل اللغط. */
/* خلفية مصمتة بلون البرنامج نفسه لا تدرّجًا شاحبًا: البطاقة يجب أن تُرى بطرف العين
   على أنها شيء آخر غير المربّعات تحتها. */
.la-map-card{border:2px solid #077070;border-radius:10px;padding:8px 9px 9px;margin-bottom:9px;
  background:#a8d5d5;box-shadow:0 1px 4px rgba(7,112,112,.22)}
.la-map-card label{color:#054e4e;font-weight:700;margin:0 0 5px}
.la-map-card select{width:100%}

/* سطرٌ واحد لا يظهر إلا حين يوجد مختارٌ يُخفيه الفلتر. كانت هنا قائمةٌ تسمّي كل
   بندٍ مختار، فصارت ستة عشر شريحة تحشو لوحةً ضيّقة — والظاهر منها مربّعه مؤشَّر
   في الجدول ولا يحتاج تكرارًا. التحذير للمختفي وحده. */
.la-hidden-warn{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:6px;
  padding:6px 9px;background:#fff8ed;border:1px solid #f2dcae;border-radius:8px;
  font-size:11.5px;color:#8a5a08}
.la-hidden-warn b{font-size:1.15em}
.la-hidden-warn .la-pick-btn{margin-inline-start:0}
.la-hidden-warn .la-pick-btn:last-child{margin-inline-start:auto}

/* عمود الطباعة مُسمّى: مربّعٌ بلا عنوان يُخمَّن معناه، والتخمين هنا يُنتج تقريرًا
   لغير ما أراد صاحبه. والبند المعروض على الخريطة يحمل علامته بدل تظليلٍ خفيف. */
.la-th-pick div{font-size:9px;font-weight:600;color:#5f7070;line-height:1;margin-bottom:3px}
.la-onmap{margin-inline-start:5px;font-size:.95em;vertical-align:middle}
/* اللوحة كانت تتوسّع إلى 520px لتسع ستة أعمدة. بعد أن صار الجدول أسماءً فقط عادت إلى
   عرض بقية التبويبات، فلا يقفز عرض الصفحة عند الانتقال إلى Look Ahead والخريطة تكسب
   المساحة المحرَّرة. الفئة باقية ليُعاد التوسيع بسطر واحد إن لزم. */
body.lookahead-wide .app{grid-template-columns:1fr var(--pane)}
.la-toolbar-note{font-size:clamp(9.5px,calc(9.5px + (100vw - 1280px)*0.00371),12.8px);color:#888;line-height:1.5;margin-top:2px}
/* الارتفاع يملأ المساحة المتبقية فعليًا؛ الرقم الثابت السابق كان يقص آخر البنود */
.la-items-wrap{border:1px solid #e4e3da;border-radius:8px;background:#fff;overflow:auto;flex:1 1 auto;min-height:120px}
.la-items-tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:clamp(10.5px,calc(10.5px + (100vw - 1280px)*0.0041),14.2px);table-layout:fixed}
.la-items-tbl th{position:sticky;top:0;z-index:3;background:#2e4057;color:#fff;padding:8px 4px;font-size:clamp(9.5px,calc(9.5px + (100vw - 1280px)*0.00371),12.8px);text-align:center;border-left:1px solid rgba(255,255,255,.14)}
.la-items-tbl th:nth-child(1){width:34px}
.la-items-tbl th:nth-child(2){width:auto;text-align:right;padding-right:8px}
.la-items-tbl td{padding:7px 4px;border-bottom:1px solid #f0efe8;text-align:center;vertical-align:middle;background:#fff}
.la-items-tbl td:nth-child(2){text-align:right;padding-right:8px;line-height:1.35}
.la-item-summary-row{cursor:pointer;transition:background .12s}
.la-item-summary-row:hover td{background:#f4f8f8}
.la-item-summary-row.on td{background:#e4f1f1}
.la-item-summary-row.on td:first-child{border-right:4px solid var(--teal-600)}
.la-item-code{font-size:clamp(8px,calc(8px + (100vw - 1280px)*0.00312),10.8px);color:#aaa;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.la-num{display:inline-flex;align-items:center;justify-content:center;min-width:31px;height:24px;padding:0 6px;border-radius:12px;font-size:clamp(11px,calc(11px + (100vw - 1280px)*0.0043),14.8px);font-weight:800}
.la-num.late{background:#ffebee;color:#c62828}
.la-num.target{background:#fff8cf;color:#8a6d00}
.la-num.done{background:#e8f5e9;color:#2e7d32}
.la-num.donePrior{background:#efebe9;color:#6d4c41}
.la-num.zero{background:#f2f2ed;color:#aaa}
.la-selected-caption{margin:8px 0 0;background:#f7fbfb;border-right:3px solid var(--teal-600);border-radius:6px;padding:8px 10px;font-size:clamp(10px,calc(10px + (100vw - 1280px)*0.00391),13.5px);color:#666;line-height:1.55}


.bundled-file-card.approved{border-color:#b2dfdb;background:#f2fbfa}
.bundled-file-badge.ok{background:#e0f2f1;color:#00695c;border-color:#26a69a}
.upd-btn.secondary{background:#eef5f4;color:#00695c;border:1px dashed #80cbc4;font-weight:600}
.upd-btn.secondary:hover{background:#e0f0ee}

/* كل تصنيف في بطاقة مستقلة. كانت التصنيفات نصوصًا متجاورة تفصلها مسافة فقط، فيصعب
   عند كثرتها معرفة أين ينتهي تصنيف ويبدأ الذي يليه — خصوصًا في Look Ahead بتسعة أسطر. */
/* الشريط كان بمقاسات ثابتة (11.5px ونقطة 12px) فوق خريطة تملأ الشاشة، فيقرأ كأنه هامش
   لا مفتاح. صار ينمو مع العرض كبقية الواجهة، والعدد أظهر ما فيه فأخذ أكبر خط. */
.top-legend{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(6px,.55vw,11px);
  padding:clamp(8px,.62vw,14px) clamp(12px,.9vw,19px);background:#faf9f5;border:1px solid #e6e4da;
  border-radius:12px;margin-bottom:8px;min-height:20px}
.top-legend .leg-title{font-weight:700;color:#2a3a4a;font-size:clamp(14px,1.02vw,19px);
  margin-left:clamp(4px,.35vw,8px);white-space:nowrap;padding:0 4px}
/* حدّ المفتاح كان باهتاً بلون قريب من الخلفية، فتلتحم المفاتيح على العين
   شريطاً واحداً ولا يُعرف أين ينتهي مفتاح ويبدأ آخر. */
.top-legend .leg-row{display:inline-flex;align-items:center;gap:clamp(7px,.55vw,11px);
  font-size:clamp(12.5px,.92vw,17px);color:#3a4a5a;white-space:nowrap;background:#fff;
  border:1.5px solid #c9d2d2;border-radius:10px;padding:clamp(5px,.45vw,9px) clamp(10px,.78vw,16px);
  box-shadow:0 1px 3px rgba(0,0,0,.07)}
.top-legend .leg-row b{margin-right:2px !important;background:#f2f4f5;border-radius:6px;
  padding:clamp(1px,.15vw,3px) clamp(7px,.55vw,11px);color:#1a2a3a;
  font-size:clamp(13.5px,1vw,18.5px);font-variant-numeric:tabular-nums}
.top-legend .leg-dot{width:clamp(13px,.95vw,18px);height:clamp(13px,.95vw,18px);border-radius:4px;
  flex:none;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
/* طبقتان داخل المفتاح: التصنيف في بطاقته، وحالات الموقع في بطاقاتها. وكانت
   قاعدة `.top-legend .leg-row b` تلبس أرقام الحالات ثوبَ الرقم الرئيسي نفسه،
   فيتساوى «متأخرة 16» و«جاري 9» على العين ويقع اللبس الذي شكا منه. */
.top-legend .leg-main{display:inline-flex;align-items:center;gap:clamp(6px,.5vw,10px);
  background:#fdfdfb;border:1px solid #d7dede;border-radius:8px;
  padding:clamp(2px,.2vw,4px) clamp(7px,.55vw,11px);font-weight:700;color:#2a3a4a}
.top-legend .leg-main b{margin:0 !important;background:#eaf0f0;border-radius:6px;
  padding:clamp(1px,.15vw,3px) clamp(7px,.55vw,11px);color:#12202e;
  font-size:clamp(14px,1.04vw,19px);font-weight:800;font-variant-numeric:tabular-nums}
/* بطاقة «المطلوب إنهاؤه»: هي وحدها ما يُعمل عليه، فلها إطار المشروع الأخضر
   ورقمُها مصمت — والمصدران تحتها شريحتان بلون تصنيفهما على الخريطة. */
.top-legend .leg-row.hero{border-color:var(--teal-600);box-shadow:0 1px 4px rgba(10,138,138,.18)}
.top-legend .leg-row.hero .leg-main{background:#e8f4f4;border-color:#9fd0d0}
.top-legend .leg-row.hero .leg-main b{background:var(--teal-600);color:#fff}
.top-legend .leg-src{display:inline-flex;align-items:center;gap:5px;background:#fff;
  border:1px solid #d7dede;border-radius:7px;padding:2px 8px;color:#4a5a5a;
  font-size:clamp(10.5px,.75vw,13.5px);font-weight:400}
.top-legend .leg-src b{margin:0 !important;background:none;padding:0;font-weight:800;
  color:#12202e;font-size:1.14em}
.top-legend .leg-src i{width:9px;height:9px;border-radius:2px;display:inline-block;flex:none;
  box-shadow:0 0 0 1px rgba(0,0,0,.1)}
/* عنوان المجموعة وحدُّها: «منها» ثم المصدر، «حالتها الآن» ثم الحالة. بلا هذين
   يُقرأ التقسيمان سلسلةً واحدة فتُجمع أرقامٌ هي أصلاً تفصيلان للعدد نفسه. */
.top-legend .leg-cap{font-size:clamp(9.5px,.66vw,12px);color:#8a9a9a;font-weight:400;
  padding-inline-start:clamp(6px,.5vw,10px);border-inline-start:1px solid #dde2e2;
  margin-inline-start:clamp(2px,.2vw,4px)}
/* بطاقة مجمّعة (قراره 2026-08-24): «المطلوب إنهاؤه» ومصدراه — المتأخر والمجدول —
   جسم واحد بإطار المشروع، فلا تتناثر الثلاثة بطاقاتٍ شقيقة يفرّقها التفاف السطر
   ويُقرأ كلٌّ منها عدًّا مستقلًا وهي عددٌ واحد وتفصيلاه. */
.top-legend .leg-grp{display:inline-flex;flex-wrap:wrap;align-items:center;
  gap:clamp(6px,.5vw,10px);background:#f1f7f7;border:1.5px solid var(--teal-600);
  border-radius:12px;padding:clamp(5px,.45vw,9px) clamp(9px,.7vw,14px);
  box-shadow:0 1px 4px rgba(10,138,138,.18)}
.top-legend .leg-grp>.leg-main{background:#e8f4f4;border-color:#9fd0d0}
.top-legend .leg-grp>.leg-main b{background:var(--teal-600);color:#fff}
/* «المنجَز» مجموعة كأختها لكن بلون إنجازها الأخضر — ابناها: قبل موعده ومنتهٍ سابقًا */
.top-legend .leg-grp.done{border-color:#2e7d32;background:#f2f8f2;
  box-shadow:0 1px 4px rgba(46,125,50,.16)}
.top-legend .leg-grp.done>.leg-main{background:#e7f2e7;border-color:#bcd8bc}
.top-legend .leg-grp.done>.leg-main b{background:#2e7d32;color:#fff}
/* اسم البند بطاقة رأسية بارتفاع الشريط كله: تقف أول السطر وتمتد على صفّيه،
   فلا يذوب الاسم بين البطاقات حين يلتفّ الشريط. والبقية تلتفّ في مجرى جانبي. */
.top-legend .leg-title-card{align-self:stretch;display:flex;align-items:center;
  justify-content:center;text-align:center;background:#fff;
  border:1.5px solid var(--teal-600);border-radius:12px;
  padding:clamp(6px,.5vw,10px) clamp(12px,.9vw,18px);
  font-weight:800;font-size:clamp(14px,1.05vw,20px);color:#16323a;
  max-width:clamp(150px,13vw,260px);box-shadow:0 1px 4px rgba(10,138,138,.15)}
.top-legend .leg-flow{display:flex;flex-wrap:wrap;align-items:center;
  gap:clamp(6px,.55vw,11px);flex:1;min-width:0}
/* الحالة أصغر وأخفّ من التصنيف بوضوح: ثلاثة أرباع الخط، ولا خلفية لرقمها. */
.top-legend .leg-st{font-size:clamp(9.5px,.68vw,12.5px);font-weight:400}
.top-legend .leg-st b{margin:0 !important;background:none;padding:0;
  color:#23403f;font-weight:800;font-size:1.12em}

/* عمود التراكمي حتى Report Target: منفصل بعد «الإجمالي» بفراغ، ذهبيٌّ بنص كحلي */
.rep-own th.th-target{background:#ffc000!important;color:#1f2d3a!important;font-weight:800;min-width:86px}
.rep-own td.td-target{background:#fff2cc;font-weight:800;color:#1f2d3a}
.rep-own .sp-col{background:transparent!important;border:none!important;min-width:14px;padding:0}

/* ── تحليل جاهزية جبهات العمل: ثلاث كتل، لكلٍّ لونُ معناه ── */
.rdy-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.rdy-tab{border:1.5px solid #c9d2d2;background:#fff;border-radius:10px;padding:7px 15px;
  font-size:13px;font-weight:700;color:#3a4a5a;cursor:pointer;font-family:inherit}
.rdy-tab b{background:#eef2f2;border-radius:6px;padding:1px 8px;margin-inline-start:6px}
.rdy-tab.late.on{background:#c62828;border-color:#c62828;color:#fff}
.rdy-tab.early.on{background:#2e7d32;border-color:#2e7d32;color:#fff}
.rdy-tab.hold.on{background:#2e4057;border-color:#2e4057;color:#fff}
.rdy-tab.on b{background:rgba(255,255,255,.22);color:#fff}
.rdy-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:9px;margin:10px 0 14px}
.rdy-card{background:#fff;border:1px solid #e3e8e8;border-left:4px solid #c62828;
  border-radius:10px;padding:10px 12px}
.rdy-card .n{font-size:23px;font-weight:800;color:#c62828;line-height:1.1}
.rdy-cards.early .rdy-card{border-left-color:#2e7d32}
.rdy-cards.early .rdy-card .n{color:#2e7d32}
.rdy-cards.hold .rdy-card{border-left-color:#2e4057}
.rdy-cards.hold .rdy-card .n{color:#2e4057}
.rdy-card .l{font-size:12px;font-weight:700;color:#2a3a4a;margin-top:3px}
.rdy-card .s{font-size:10.5px;color:#8a9a9a;margin-top:3px}
/* البند الحاكم تحت تاريخه: نسبُ الرقم إلى صاحبه بلا عمودٍ إضافي */
.rep-own .rdy-by,.rep-tbl .rdy-by{display:block;font-size:10px;color:#8a9a9a;
  font-weight:400;margin-top:2px;line-height:1.25;max-width:190px}

/* ── عمالة v2: شريط اليوم والمسار الرباعي وسجلّ التسجيل ── */
.labv-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:12px}
.labv-date{font-size:13px;font-weight:700;color:#2a3a4a;display:flex;gap:7px;align-items:center}
.labv-date input{padding:6px 9px;border:1.5px solid #c9d2d2;border-radius:8px;font-family:inherit}
.labv-modes{display:inline-flex;gap:6px}
.labv-mode{border:1.5px solid #c9d2d2;background:#fff;border-radius:16px;padding:6px 14px;
  font-size:12.5px;font-weight:700;color:#3a4a5a;cursor:pointer;font-family:inherit}
.labv-mode.on{background:var(--teal-600);border-color:var(--teal-600);color:#fff}
.labv-form{display:flex;flex-wrap:wrap;gap:8px;align-items:center;background:#fff;
  border:1.5px solid #dfe6e6;border-radius:12px;padding:12px;margin-bottom:8px}
.labv-sel{min-width:150px;padding:8px 10px;border:1.5px solid #c9d2d2;border-radius:8px;
  font-family:inherit;font-size:13px;background:#fff}
.labv-num{width:110px;padding:8px 10px;border:1.5px solid #c9d2d2;border-radius:8px;
  font-family:inherit;font-size:14px;font-weight:700}
.labv-add{background:var(--teal-600);color:#fff;border:none;border-radius:8px;
  padding:9px 18px;font-weight:800;font-size:13px;cursor:pointer;font-family:inherit}
.labv-add:disabled{opacity:.45;cursor:not-allowed}
.labv-hint{font-size:12px;color:#5a6a6a;margin:2px 4px 10px}
.labv-note{font-size:12.5px;color:#9a6700;background:#fff8e6;border:1px solid #f0dfae;
  border-radius:8px;padding:8px 12px;margin-bottom:10px}
.labv-err{font-size:12.5px;color:#c62828;background:#fdecec;border:1px solid #f3c6c6;
  border-radius:8px;padding:8px 12px;margin-bottom:10px}
.labv-day{margin-top:14px}
.labv-day-h{font-size:14px;font-weight:800;color:#16323a;margin-bottom:9px}
.labv-sec{background:#fff;border:1px solid #e3e8e8;border-radius:10px;padding:10px 12px;margin-bottom:9px}
.labv-sec-h{font-weight:800;font-size:13.5px;color:#12333a;margin-bottom:6px}
.labv-item{margin:6px 0 4px}
.labv-item-h{font-size:12.5px;font-weight:700;color:#3a4a5a;margin-bottom:5px}
.labv-villas{display:flex;flex-wrap:wrap;gap:6px}
.labv-chip{background:#f4f7f7;border:1px solid #dfe6e6;border-radius:14px;
  padding:4px 10px;font-size:12px;color:#2a3a4a}
.labv-chip i,.labv-del{cursor:pointer;color:#c62828;font-style:normal;font-weight:800;padding:0 3px}
.labv-tot-tag{font-size:11px;color:#9a6700;background:#fff4d6;border-radius:8px;padding:2px 8px;margin-inline-start:6px}
.labv-empty{color:#8a9a9a;font-size:13px;padding:14px;text-align:center;background:#fff;
  border:1px dashed #d5dada;border-radius:10px}

/* ── الفلاتر السريعة في تقرير المالك: ملخّصان منسّقان ثم الأقسام ── */
.rep3-qf-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:10px}
.rep3-qf-hd{font-size:11px;color:#8a9a9a;font-weight:700;margin-inline-end:2px}
.rep3-qf{border:1.5px solid #c9d2d2;background:#fff;border-radius:16px;
  padding:5px 12px;font-size:12px;font-weight:700;color:#3a4a5a;cursor:pointer;
  font-family:inherit;transition:background .12s,border-color .12s}
.rep3-qf b{font-weight:400;color:#8a9a9a;font-size:.92em}
.rep3-qf:hover{border-color:var(--teal-600)}
.rep3-qf.on{background:var(--teal-600);border-color:var(--teal-600);color:#fff}
.rep3-qf.on b{color:#cfe8e8}
/* الملخّصان أوزن بصريًا من الأقسام: هما المقصد الأول */
.rep3-qf.hl,.rep3-qf.l2{border-width:2px;border-color:#2e4057}
.rep3-qf.hl.on,.rep3-qf.l2.on{background:#2e4057;border-color:#2e4057}
.rep3-qf-sep{width:1px;height:20px;background:#d5dada;margin:0 3px;flex:none}

/* ── تقرير الإنجاز متعدد البنود (تبويب التحديث) ── */
.pr-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:9px}
.pr-tab{padding:9px 6px;border:1px solid #d0cfc4;border-radius:7px;background:#fff;color:#666;font-size:11px;font-weight:700;cursor:pointer;font-family:inherit}
.pr-tab.on{background:#2e4057;color:#fff;border-color:#2e4057}
.pr-pick{display:flex;flex-direction:column;gap:5px;margin-bottom:8px}
.pr-chip{display:flex;align-items:center;gap:7px;padding:6px 8px;border:1px solid #e0ded4;border-radius:7px;background:#fff;font-size:11px}
.pr-chip .sw{width:15px;height:15px;border-radius:4px;flex:none;border:1px solid rgba(0,0,0,.18)}
.pr-chip .nm{flex:1;line-height:1.35}
.pr-chip .no{font-size:9px;font-weight:800;color:#8a8a8a;min-width:14px}
.pr-chip button{border:none;background:#f0efe8;color:#a33;border-radius:5px;width:20px;height:20px;cursor:pointer;font-size:12px;flex:none}
/* خانة اختيار واحدة لكل بند: لونها ثابت برقمها، ولها فلتر بحث خاص بها */
.pr-slot{border:1px solid #e0ded4;border-radius:8px;background:#fff;padding:6px;display:flex;flex-direction:column;gap:5px}
.pr-slot.on{border-color:#c9c6b8;background:#fcfcf8}
.pr-slot-h{display:flex;align-items:center;gap:6px}
.pr-slot-h .sw{width:15px;height:15px;border-radius:4px;flex:none;border:1px solid rgba(0,0,0,.18)}
.pr-slot-h .no{font-size:10px;font-weight:800;color:#8a8a8a;flex:none;min-width:12px}
.pr-slot-q{flex:1;min-width:0;font-size:10.5px;padding:4px 6px;border:1px solid #e4e2d8;border-radius:5px;font-family:inherit;background:#fafaf5}
.pr-slot-h button{border:none;background:#f0efe8;color:#a33;border-radius:5px;width:20px;height:20px;cursor:pointer;font-size:12px;flex:none}
.pr-slot select{width:100%;font-size:11px;padding:5px 6px;border:1px solid #e4e2d8;border-radius:6px;font-family:inherit;background:#fff}
.pr-empty{font-size:10.5px;color:#999;line-height:1.6;padding:8px;background:#fafaf5;border:1px dashed #d8d6cc;border-radius:7px}
.pr-count{font-size:10px;color:#7a8a8a;margin-bottom:4px}

/* ── تقرير Look Ahead القابل للطباعة ── */
#la-report{display:none;position:fixed;inset:0;background:#fff;z-index:900;overflow:auto;padding:16px 20px 40px}
#la-report.on{display:block}
.lar-bar{display:flex;gap:8px;align-items:center;justify-content:flex-end;margin-bottom:10px}
.lar-bar button{font-size:12px;padding:7px 16px;border:1px solid #d0cfc4;border-radius:6px;background:#fff;cursor:pointer;font-family:inherit}
.lar-bar button.primary{background:var(--teal-600);color:#fff;border-color:var(--teal-600);font-weight:600}
.lar-page{max-width:1000px;margin:0 auto;color:#1a2a3a}
.lar-head{display:flex;align-items:center;justify-content:space-between;gap:14px;border-bottom:3px solid var(--teal-600);padding-bottom:9px;margin-bottom:12px}
.lar-head img{height:30px}
.lar-title{font-size:17px;font-weight:800;color:var(--teal-600)}
.lar-sub{font-size:11px;color:#667}
.lar-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px}
.lar-meta div{background:#f4f8f8;border:1px solid #dfe9e9;border-radius:7px;padding:7px 9px}
.lar-meta .k{font-size:9px;color:#7a8a8a;text-transform:uppercase}
.lar-meta .v{font-size:14px;font-weight:700}
.lar-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px}
.lar-kpi{border:1px solid #e0ded4;border-radius:8px;padding:9px;text-align:center}
.lar-kpi .n{font-size:22px;font-weight:800;line-height:1.1}
.lar-kpi .l{font-size:10px;color:#667;margin-top:3px;line-height:1.35}
/* صندوق المعدل: إطار سميك ونص داكن حتى يبقى بارزاً ومقروءاً حتى لو أسقطت الطابعة الخلفيات */
.lar-rate{background:#e8f4f4;border:3px solid var(--teal-600);border-radius:10px;padding:13px 16px;margin-bottom:14px;
  display:flex;align-items:center;justify-content:space-between;gap:14px;color:#08494a}
.lar-rate .big{font-size:38px;font-weight:800;color:#0a6b6b;line-height:1;letter-spacing:-.5px}
.lar-rate .unit{font-size:12px;font-weight:700;color:#0a6b6b;margin-top:3px}
.lar-rate .lbl{font-size:13px;font-weight:700;line-height:1.6;color:#08494a}
.lar-rate .calc{font-size:11.5px;font-weight:600;color:#2b6a6a}
.lar-sec{font-size:12px;font-weight:700;color:#2e4057;margin:14px 0 7px;padding-bottom:4px;border-bottom:1px solid #e0ded4}
.lar-map{border:1px solid #e0ded4;border-radius:8px;padding:6px;background:#fdfdfb}
.lar-map svg{width:100%;height:auto;display:block}
.lar-leg{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:10.5px;margin-top:7px}
.lar-leg span{display:inline-flex;align-items:center;gap:5px}
.lar-leg i{width:12px;height:12px;border-radius:3px;display:inline-block}
.lar-tbl{width:100%;border-collapse:collapse;font-size:10.5px}
.lar-tbl th{background:#2e4057;color:#fff;padding:6px 5px;font-size:10px;font-weight:700;border:1px solid #24344a}
.lar-tbl td{border:1px solid #e4e3da;padding:5px;text-align:center}
.lar-tbl tr:nth-child(even) td{background:#fafaf7}
/* تظليل الجمعة على الخلية لا على الصف، وبعد قاعدة التناوب:
   خلفية td تُرسم فوق خلفية tr، فكان التظليل يختفي في الصفوف الزوجية وحدها. */
.lar-tbl tr.fri td{background:#fdeaea;color:#8a3a3a}
.lar-tbl tr.fri td:first-child{font-weight:700}
.lar-tbl td.r{text-align:right}
.lar-tbl td.muted{color:#aaa}
.lar-note{background:#fff8e1;border:1px solid #ffe082;border-right:4px solid #ffb300;border-radius:7px;padding:9px 11px;font-size:11px;line-height:1.7;color:#5f4b00;margin:10px 0}
.lar-villas{font-size:10.5px;line-height:1.9}
.lar-villas b{color:var(--teal-600)}
/* بطاقة التصنيف: العدد، ثم توزيعه على حالات الموقع، ثم أرقام فلله بالبلك —
   ثلاثتها في مكان واحد بدل ثلاثة مواضع في الصفحة. */
.lar-three{grid-template-columns:repeat(3,1fr)}
.lar-cls{text-align:right;padding:10px 11px}
.lar-cls .n{text-align:center}
.lar-cls .l{text-align:center;font-weight:700;color:#3a4f4f;font-size:10.5px}
.lar-st{display:flex;flex-wrap:wrap;gap:3px 10px;margin-top:7px;padding-top:6px;
  border-top:1px dashed #e0ded4;font-size:10px;color:#5a6a6a;justify-content:center}
.lar-st span{display:inline-flex;align-items:center;gap:4px}
.lar-st i{width:9px;height:9px;border-radius:2px;display:inline-block}
/* الرقم في إطاره: بلا حدّ يلتصق بالاسم الذي بعده فيُقرآن كلمة واحدة، خصوصًا
   حين تتجاور ثلاث حالات في سطر. */
.lar-st b{color:#12202e;background:#fff;border:1px solid #d3dada;border-radius:5px;
  padding:0 5px;font-weight:800}
/* «منها» و«حالتها الآن»: تقسيمان للعدد نفسه، بلا عنوانٍ يفصلهما يُقرآن سلسلة
   واحدة فتُجمع أرقامٌ هي تفصيلٌ لا زيادة. */
.lar-cap{color:#9aa8a8;font-size:9.5px}
/* البطاقة نصفان: العدد وعنوانه في نصف، والتفصيلان رأسيين في النصف الثاني.
   كانا شريطين عريضين تحت العدد، فضاق كل شيء وصغرت أرقام التفصيل حتى لا تُقرأ
   من على الطاولة. وبالفصل صار لكلٍّ مساحته: العدد يكبر، والتفصيل يكبر معه. */
.lar-need{grid-column:span 2;display:flex;align-items:stretch;gap:12px;padding:10px 13px}
.lar-need .need-head{flex:0 0 33%;display:flex;flex-direction:column;justify-content:center;
  align-items:center;border-inline-end:1px dashed #d3dada;padding-inline-end:12px}
.lar-need .need-head .n{font-size:32px;line-height:1}
.lar-need .need-head .l{margin-top:4px}
.lar-need .need-body{flex:1;display:flex;flex-direction:column;justify-content:center;gap:9px}
/* كل تقسيم في صندوقه: «منها» وما تحتها صفٌّ مغلق، و«حالتها الآن» وما تحتها
   صفٌّ آخر. الحدّ يقول أين ينتهي التقسيم الأول ويبدأ الثاني بلا كلمة زائدة. */
.lar-need .need-body .lar-st{margin:0;padding:5px 9px;border:1px solid #dde4e4;
  border-radius:8px;background:#fcfdfd;justify-content:flex-start;gap:4px 14px;font-size:11px}
.lar-need .need-body .lar-st b{font-size:15px;color:#12202e}
.lar-need .need-body .lar-st i{width:10px;height:10px}
.lar-need .lar-cap{min-width:52px}
/* الصف الهرمي: المنجَز · المطلوب · التراكمي. الأوسط أعرض لأنه يحمل أربع طبقات
   (أب، ابنان، وحالة الموقع تحت كلٍّ منهما). */
.lar-tree{grid-template-columns:1.1fr 1.6fr .95fr}
.lar-tree .lar-need,.lar-tree .lar-cum{grid-column:auto;display:flex;flex-direction:column;
  align-items:stretch;gap:9px;padding:10px 12px}
.lar-tree .need-head{flex:0 0 auto;border-inline-end:0;border-bottom:1px dashed #d3dada;
  padding:0 0 7px;align-items:center}
.lar-tree .need-head .n{font-size:29px}
.lar-sub2{display:block;font-weight:400;color:#9aa8a8;font-size:9px;margin-top:2px}
.need-kids{display:grid;grid-template-columns:1fr 1fr;gap:8px;flex:1}
.need-kid{border:1px solid #e2e7e7;border-radius:9px;background:#fcfdfd;padding:7px 8px;text-align:center}
.need-kid .kn{font-size:19px;font-weight:800;line-height:1}
.need-kid .kt{font-size:9.5px;color:#5a6a6a;margin-top:2px;line-height:1.45}
.need-kid .lar-st{margin-top:6px;padding-top:5px;border-top:1px dashed #e2e7e7;border-radius:0;
  background:none;padding-inline:0;justify-content:center;gap:3px 7px;font-size:8.5px}
.need-kid .lar-st b{font-size:10.5px;padding:0 4px}
.cum-body{display:flex;flex-direction:column;gap:6px;flex:1;justify-content:center}
.cum-line{display:flex;align-items:center;justify-content:space-between;font-size:10.5px;
  border:1px solid #e2e7e7;border-radius:8px;padding:5px 9px;background:#fff}
.cum-line b{font-size:15px}
.cum-line.hi{background:#f4f8f8}
/* ما بقي تحت الخريطة: معنى الحدود على الفيلا وحدها — لا ألوان التصنيفات،
   فهي على البطاقات أعلاه بأرقامها. */
.lar-key{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:10.5px;margin-top:7px}
.lar-key span{display:inline-flex;align-items:center;gap:5px}
.lar-key i{width:12px;height:12px;border-radius:3px;display:inline-block}
@media print{
  /* بدون هذا تُسقط الطابعة كل خلفيات CSS فيخرج التقرير بنصوص باهتة بلا صناديق */
  *{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}
  body{overflow:visible!important;height:auto!important}
  body>*{display:none!important}
  #la-report{display:block!important;position:static!important;padding:0!important;overflow:visible!important}
  .lar-bar{display:none!important}
  .lar-page{max-width:none}
  .lar-sec{break-after:avoid}
  .lar-map,.lar-rate,.lar-kpis{break-inside:avoid}
  .lar-tbl{break-inside:auto}
  .lar-tbl tr{break-inside:avoid}
  /* مقارنة البنود ثلاث صفحات ثابتة: ملخّص ثم المخطط وحده ثم القوائم */
  .pr3pg{break-after:page}
  .pr3pg:last-of-type{break-after:auto}
  .pr3pg-map .lar-map svg{max-height:225mm;width:auto!important;max-width:100%;margin:0 auto;display:block}
  /* كل بند في ورقة، والجدول المجمَّع في الأخيرة. الأخيرة بلا كسر بعدها وإلا خرجت ورقة فارغة. */
  .lar-item-page{break-after:page}
  .lar-item-page.lar-last{break-after:auto}
  /* المقاس يُكتب عند فتح الشاشة (printPageRule) لا هنا: قاعدة `@page` عامّة على
     المستند كله، فوجود مقاسين في الملف يجعل إحدى الورقتين تُطبع باتجاه الأخرى. */
}

/* ═══ لوحة الصلاحيات ═══
   ثلاث نوافذ prompt تُكتب فيها أرقامٌ بفواصل صارت لوحةً واحدة: الاختيار
   يُرى ولا يُحفظ في الذهن، والحفظ واحدٌ لا ثلاثة. */
.us-perm-ov{position:fixed;inset:0;background:rgba(20,35,38,.55);z-index:900;
  display:flex;align-items:center;justify-content:center;padding:18px}
.us-perm-box{background:#fff;border-radius:14px;max-width:760px;width:100%;max-height:88vh;
  display:flex;flex-direction:column;box-shadow:0 18px 50px rgba(0,0,0,.28);overflow:hidden}
.us-perm-hd{padding:13px 17px;background:var(--teal-600);color:#fff;font-size:14px;display:flex;align-items:center;gap:8px}
.us-perm-hd b{font-weight:800}
.us-x{margin-inline-start:auto;background:transparent;border:0;color:#fff;font-size:17px;cursor:pointer;line-height:1}
.us-perm-bd{padding:14px 17px;overflow-y:auto}
.us-perm-ft{padding:11px 17px;border-top:1px solid #e4e3da;display:flex;gap:8px;justify-content:flex-end;background:#fbfcfc}
.us-save{background:var(--teal-600);color:#fff;border:1px solid var(--teal-600);border-radius:8px;padding:9px 22px;font-family:inherit;font-size:13px;font-weight:700;cursor:pointer}
.us-cancel{background:#fff;color:#50676a;border:1px solid #dfe6e6;border-radius:8px;padding:9px 18px;font-family:inherit;font-size:13px;cursor:pointer}
.us-sec{margin-bottom:15px}
.us-sec-t{font-size:12.5px;font-weight:800;color:#23403f;margin-bottom:7px;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.us-hint{font-size:10.5px;font-weight:400;color:#8a9a9a}
.us-hint b{color:#0a6f6f}
.us-mini{font-size:10.5px;padding:3px 9px;border:1px solid #dfe6e6;background:#fff;border-radius:6px;cursor:pointer;font-family:inherit;color:#50676a}
.us-chks{display:flex;flex-wrap:wrap;gap:6px}
.us-chk{display:flex;align-items:center;gap:6px;font-size:12px;padding:6px 11px;border:1px solid #dfe6e6;
  border-radius:8px;cursor:pointer;background:#fff;color:#3a4f4f;white-space:nowrap}
.us-chk.on{border-color:var(--teal-600);background:#f2fafa;color:#0a6f6f;font-weight:700}
.us-chk.off{opacity:.45;cursor:not-allowed}
.us-warn{font-size:11px;color:#8a6d00;background:#fff8e1;border:1px solid #ffe082;border-radius:7px;padding:6px 9px;margin-bottom:7px}

/* ═══ التنقّل في الشريط العلويّ ═══
   كان صفٌّ تحت الشريط يحمل أربع أيقونات في فراغ، والشريط نفسه مخفيٌّ في ست
   صفحات تأخذ عرض النافذة — فمن دخلها لم يجد تنقّلًا إلا زرّ الرئيسية.
   الشريط الآن فوق الشبكة يمتدّ عمودَيها، فيظهر في كل صفحة، ويحمل الصفحات
   بأسمائها. وارتفاع الصفّ المحذوف عاد إلى الجداول تحته. */
.app{grid-template-rows:auto 1fr}
.topbar{grid-column:1/-1}
.topnav{display:flex;align-items:center;gap:4px;flex:1;min-width:0;overflow-x:auto;
  padding:0 10px;scrollbar-width:thin}
.topnav::-webkit-scrollbar{height:5px}
.topnav::-webkit-scrollbar-thumb{background:#d7dede;border-radius:3px}
.mode-tab{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;flex:none;
  padding:7px 13px;border:1px solid transparent;border-radius:9px;background:transparent;
  color:#50676a;font-family:inherit;font-size:clamp(11.5px,.82vw,14px);cursor:pointer;
  transition:background .14s,color .14s}
.mode-tab:hover{background:#eef6f6;color:#087c7e}
.mode-tab.active{background:var(--teal-600);color:#fff;font-weight:700}
.topnav .page-home{flex:none;width:clamp(30px,2vw,38px);height:clamp(30px,2vw,38px);
  border:1px solid #e4e3da;background:#fff;border-radius:9px;cursor:pointer;font-size:15px;
  line-height:1;padding:0;margin-inline-end:4px}
.topnav .page-home:hover{background:#eef6f6;border-color:#a8cfd0}
/* الصفّ المحذوف كان يحمل هذه، فتُرفع بقاياها من كل تخطيط */
.mode-tabs,.quick-nav,.solo-actions,.page-ttl{display:none!important}
@media(max-width:900px){.mode-tab{padding:6px 9px;font-size:11px}}

/* الصفحات في بطاقةٍ داكنة: الأزرار الفاتحة على شريطٍ أبيض تسبح بلا حدّ، فلا
   يُعرف أين يبدأ التنقّل وأين ينتهي. البطاقة تجمعها، والداكن يجعل النشط
   يُقرأ من بُعد الشاشة. */
.topnav{background:#123f45;border-radius:12px;padding:5px 7px;gap:3px;
  margin:6px 8px;box-shadow:inset 0 1px 0 rgba(255,255,255,.07)}
.topnav .mode-tab{color:#bfe0dd;font-weight:600;border-radius:8px}
.topnav .mode-tab:hover{background:rgba(255,255,255,.13);color:#fff}
.topnav .mode-tab.active{background:#0fb5b0;color:#06282c;font-weight:800;
  box-shadow:0 2px 8px rgba(15,181,176,.35)}
.topnav .page-home{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.18);
  color:#eafaf8}
.topnav .page-home:hover{background:rgba(255,255,255,.24);border-color:rgba(255,255,255,.3)}
.topnav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.25)}
.topbar{min-height:calc(var(--bar-h) + 6px)}

/* ═══ طلبات صرف المواد ═══
   شاشة الطلب مصفوفة الاستلام نفسها، ومعها عمودٌ واحد جديد: **رصيد المستودع**.
   وهو يُعرض ولا يمنع — طلبٌ يُسدّ لأن الرفّ فارغ يُخفي الحاجة، والحاجة الخفيّة
   تُشترى متأخرة. فالنقص يُعلَّم، ويمشي الطلب. */
.mr-matrix th.mr-stock,.mr-matrix td.mr-stock{background:#f7fbfb;color:#0a6f6f;font-weight:700;width:96px}
.mr-matrix td.mr-stock.zero{background:#fff5f5;color:#c62828}
.mr-matrix td.tot.short{background:#fff5f5;color:#c62828}
/* خانةٌ عليها طلب معلّق تُقفل ولا تُخفى: الاختفاء يُقرأ «لا حاجة»، والقفل
   المكتوب عليه رقمه يقول أين ذهبت الحاجة ومن يحملها. */
.mr-matrix td.mr-locked{background:#fff8e1;color:#8a6d00;font-weight:700;font-size:11px;cursor:help}

.mr-batch .ap-head{flex-wrap:wrap;gap:7px}
/* الرقم هو الرابط الوحيد بين الورقة واليد التي تحملها والصفّ على الشاشة */
.mr-no{background:var(--teal-600);color:#fff;border-radius:7px;padding:3px 11px;font-weight:800;font-size:13.5px}
.mr-note{padding:8px 13px;background:#fbfbf5;border-bottom:1px solid #eef1f1;font-size:11.5px;color:#6b6b5f}
.mr-table input{width:84px;padding:6px 5px;text-align:center;border:1px solid #d7dede;
  border-radius:5px;font-family:inherit;font-size:12.5px;outline:none}
.mr-table input:focus{border-color:var(--teal-600)}
.mr-fell{color:#c62828;font-size:10.5px;font-weight:700;cursor:help}
.mr-part{background:#fff8e1;color:#8a6d00;border-radius:5px;padding:1px 6px;font-size:10px;font-weight:700}
.mr-log{background:#fff;border:1px solid #e4e3da;border-radius:11px;overflow:hidden}

/* ── الورقة المطبوعة ──
   ثلاثة توقيعات لا اثنان: الطالب، والمستلِم الذي يحملها، والأمين الذي يصرف.
   وورقةٌ بتوقيعين تترك «من استلمها فعلاً» بلا جواب. */
#mr-print{display:none;position:fixed;inset:0;background:#fff;z-index:900;overflow:auto;padding:16px 20px 40px}
#mr-print.on{display:block}
.mrv-page{max-width:920px;margin:0 auto;color:#1a2a3a}
.mrv-head{display:flex;align-items:center;justify-content:space-between;gap:16px;
  border-bottom:3px solid var(--teal-600);padding-bottom:11px;margin-bottom:13px}
.mrv-ttl h1{margin:0;font-size:23px;color:#123f45}
.mrv-ttl .sub{font-size:11.5px;color:#6b7c7c;margin-top:3px}
.mrv-no{text-align:center;border:2.5px solid var(--teal-600);border-radius:10px;padding:6px 18px;min-width:132px}
.mrv-no span{display:block;font-size:10.5px;color:#0a6f6f}
.mrv-no b{display:block;font-size:31px;line-height:1.1;color:var(--teal-600);letter-spacing:1px}
.mrv-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px}
.mrv-meta>div{border:1px solid #dfe6e6;border-radius:8px;padding:7px 10px;background:#fbfcfc}
.mrv-meta span{display:block;font-size:10px;color:#7d8f8f}
.mrv-meta b{font-size:12.5px;color:#23403f}
.mrv-note{border:1px solid #ffe082;background:#fff8e1;border-radius:7px;padding:7px 11px;
  font-size:11.5px;color:#6b5d20;margin-bottom:10px}
.mrv-tbl{width:100%;border-collapse:collapse;font-size:12px;margin-bottom:14px}
.mrv-tbl th,.mrv-tbl td{border:1px solid #c8d4d4;padding:6px 8px;text-align:center}
.mrv-tbl th{background:#eef6f6;color:#23403f;font-weight:700;font-size:11px}
.mrv-tbl td.nm{text-align:right;font-weight:600}
/* خانة المصروف تُملأ عند الشبّاك — فارغةٌ بحجمٍ يكفي القلم */
.mrv-tbl td.iss{background:#fcfdfd;min-width:78px;height:26px}
.mrv-tbl tfoot td{background:#f4f8f8;font-weight:800}
.mrv-hint{font-size:11px;color:#6b7c7c;margin-bottom:16px;line-height:1.7}
.mrv-sign{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:22px}
.mrv-sig{border:1px solid #c8d4d4;border-radius:9px;padding:11px 13px 26px}
.mrv-sig .t{font-weight:800;font-size:12.5px;color:#123f45;margin-bottom:12px}
.mrv-sig .l{font-size:11px;color:#5f6f6f;margin-bottom:9px}

@media print{
  /* الورقة وحدها على الصفحة. والحاويتان الأخريان فارغتان حين لا تكون معروضة،
     فلا تُخرجان ورقة — تُفرَّغ #mr-print-page عند الإغلاق لهذا بعينه. */
  #mr-print{display:block!important;position:static!important;padding:0!important;overflow:visible!important}
  .mrv-page{max-width:none}
  .mrv-tbl tr{break-inside:avoid}
  .mrv-sign{break-inside:avoid}
  /* المقاس يُكتب عند فتح الشاشة — انظر printPageRule في core.js */
}
/* أرقام الفلل في رأس الورقة: صفٌّ واحد يمتدّ عرضها، لأن العشرين رقمًا لا تسع
   خانةً من خانات الترويسة الأربع. والأمين يقرؤها مرةً ثم لا يعود إليها —
   وحدة الصرف مادةٌ لا فيلا. */
.mrv-plots{border:1px solid #dfe6e6;border-radius:8px;padding:7px 11px;background:#fbfcfc;
  margin-bottom:12px;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.mrv-plots span{font-size:10px;color:#7d8f8f;white-space:nowrap}
.mrv-plots b{font-size:12.5px;color:#23403f;line-height:1.9;letter-spacing:.3px}

/* شريط تبويبات الطلبات داخل لوح المستودع. يرث شكل .wh-subtabs — الخانة
   الممتدّة والحدّ السميك — ويحتاج لونَ المختار وحده: قاعدتا .on.bal و.on.sup
   هناك خاصّتان برفع الرصيد والتوريد، فتبويبٌ ثالث يبقى بلا لونٍ يقول إنه نشط. */
.mr-subtabs button.on{border-color:var(--teal-600);background:var(--teal-600);color:#fff}
/* مادةٌ لا متاح منها: الخانة تُقفل ويُقال سببها في التلميح. وتركُها تقبل رقمًا
   يُردّ عند الحفظ يعني أن يملأ الجدول كلَّه ثم يُعاد إلى أوله. */
.mr-matrix td.mr-dry{background:#fbeaea;color:#c62828;font-weight:700;cursor:help}
.mr-matrix tr.dry td.mat{border-right:3px solid #e57373}
.mr-matrix input.capped{border-color:#e57373;background:#fff5f5}

/* ═══ الشريط العلوي: ثلاث بطاقات لا واحدة ═══
   كانت البطاقة الداكنة تحمل الصفحات وحدها، والشعارُ والأزرار تسبح على أبيضٍ
   يمينها ويسارها — فيُقرأ الشريط ثلاث طبقات لا صفًّا واحدًا. والآن الأطراف
   كالوسط، فالحدّ العلويّ للبرنامج خطٌّ واحد.

   والشعار على داكن يختفي — ألوانه داكنة — فيبقى على رقعةٍ بيضاء صغيرة. وقلبُ
   ألوانه بمرشّح كان أنظف شكلًا لكنه يغيّر لون علامة الشركة، وهذا ليس لنا.

   والقياسات كلها clamp: على ١٩٢٠ يقرأ الخطّ ١٣ بكسل، وعلى ١٣٦٦ ينزل إلى ١٠
   فيتّسع الشريط لصفحاته الإحدى عشرة بلا تمرير. مقيسٌ في المتصفح على أربعة
   عروض: ١٢٨٠ (يفيض ١٢ بكسل) · ١٣٦٦ · ١٤٤٠ · ١٩٢٠ — والفيض قبل هذا كان ٣٦٠. */
.topbar{padding:0 6px}
.brand,.tb-actions{background:#123f45;border-radius:12px;padding:4px 9px;margin:5px 6px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07)}
.brand{gap:8px}
.brand img{height:clamp(22px,1.7vw,32px);background:#fff;border-radius:7px;padding:3px 6px}
.brand h1{font-size:clamp(11px,.78vw,15px);color:#eafaf8}
.tb-actions .tb-btn{font-size:clamp(10px,.66vw,12px);padding:5px 9px;
  background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2);color:#eafaf8}
.tb-actions .tb-btn:hover{background:rgba(255,255,255,.24);opacity:1}
.tb-actions .user-badge{font-size:8.5px;padding:2px 7px;
  background:rgba(255,255,255,.14);color:#bfe0dd}
.topnav{gap:2px;padding:4px 6px;margin:5px 6px}
.mode-tab{padding:5px clamp(5px,.52vw,12px);font-size:clamp(9.5px,.72vw,13px);gap:4px}
.topnav .page-home{width:clamp(26px,1.8vw,32px);height:clamp(26px,1.8vw,32px);font-size:13px}
/* مبدّل اللغة على الرئيسية: الشاشة تغطّي الشريط العلوي، فبدونه لا مخرج منها
   إلى الإنجليزية إلا بالدخول إلى صفحة والعودة. */
.home-lang{position:absolute;top:18px;inset-inline-end:20px;z-index:3;
  background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.28);color:#eafaf8}
.home-lang:hover{background:rgba(255,255,255,.26)}

/* ═══ تقرير المالك: الباقي وأسابيعه ═══
   الجدول عريض — أربعون بندًا في أربعين أسبوعًا — فالتصنيف والعدد يُقرآن كأعمدة
   ثابتة، والأسابيع تمرّ تحتها. و«أو قبله» على أول عمود تقول إنه يحمل المتأخر. */
.rep-own td.own-t{font-size:10px;font-weight:700;color:#50676a;letter-spacing:.4px}
/* المجموعة: رقمٌ في وسمٍ صغير — ولونان لا واحد، ليُقرأ انتقالُ الورقة من الـ250
   إلى الـ94 بالبصر نازلاً بلا قراءة الأرقام */
.rep-own td.own-g{font:800 11px/1 Arial,sans-serif;text-align:center;direction:ltr;
  color:#0a6f6b;background:#eef7f6;border-radius:6px}
.rep-own td.own-g.g94{color:#8a6d00;background:#fff8e1}
.rep-own th .own-hint{font-weight:400;font-size:9px;opacity:.8;display:block}
.rep-own td.bc-a{background:#fff8e1}
/* قائمة البنود المراقَبة: تسعون مربّعًا في شبكة، والقائمة الافتراضية قائمة
   المالك — أربعون بندًا بترتيب ملفه. وارتفاعها محدود فلا تدفع الجدول أسفل الشاشة. */
.rep3-pick{border:1px solid #e4e3da;border-radius:9px;background:#fbfcfc;margin:8px 0 10px}
.rep3-pick-hd{display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding:8px 11px;
  border-bottom:1px solid #eef1f1;font-size:11.5px;color:#3a4f4f}
.rep3-pick-hd .sp{flex:1}
.rep3-pick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
  gap:4px;padding:9px 11px;max-height:190px;overflow-y:auto}
.rep3-pick-grid .us-chk{font-size:11px;padding:4px 8px;white-space:normal;line-height:1.35}
.rep3-blk{margin-top:14px}
.rep3-blk-t{margin:0 0 7px;font-size:13.5px;color:#23403f}
.rep-own td.bc-b{background:#eef7f7}

/* ═══ ورقة المخطط الأفقية ═══
   معاينةٌ بنسبة الورقة نفسها (A4 أفقي ‎297×210‎ ≈ 1.414)، فما يُرى على الشاشة هو
   ما يخرج من الطابعة. والمخطط يأخذ ما بقي من العرض، والعمود الجانبي ثابتٌ ضيّق:
   المفتاح يُقرأ مرة، والخريطة تُقرأ طويلًا. */
#upd-print{display:none;position:fixed;inset:0;background:#eceeee;z-index:900;overflow:auto;padding:16px 20px 40px}
#upd-print.on{display:block}
/* ── خارطة تقرير المالك: نفس نمط أوراق الطباعة — معاينة بيضاء ثم window.print ── */
#rep3-chart{display:none;position:fixed;inset:0;background:#eceeee;z-index:900;overflow:auto;padding:16px 20px 40px}
.r3c-page{max-width:1160px;margin:0 auto;background:#fff;color:#1a2a3a;border-radius:10px;
  box-shadow:0 3px 16px rgba(0,0,0,.18);padding:20px 22px;box-sizing:border-box}
.r3c-page svg{width:100%;height:auto;display:block}
.updp-page{width:1040px;height:735px;margin:0 auto;background:#fff;color:#1a2a3a;
  box-shadow:0 3px 16px rgba(0,0,0,.18);padding:16px 18px;box-sizing:border-box;
  display:flex;flex-direction:column}
.updp-page.a3{width:1240px;height:876px}          /* A3 أفقي: النسبة نفسها، والأرقام أكبر */
.updp-hd{display:flex;align-items:center;justify-content:space-between;gap:14px;
  border-bottom:2.5px solid var(--teal-600);padding-bottom:8px}
.updp-logo img{height:26px}
.updp-t{font-size:19px;font-weight:800;color:#12343a;text-align:center;flex:1}
.updp-t span{display:block;font-size:11.5px;font-weight:600;color:#6b8285;margin-top:3px}
.updp-r{text-align:left;font-size:11px;color:#50676a;line-height:1.7;white-space:nowrap}
.updp-r b{color:#12343a}
/* المفتاح شريطٌ سفليّ دائمًا (قرارك 2026-08-19): المخطط أعرض من طوله، فكل
   بكسلٍ يُؤخذ من عرضه يصغّر أرقام الفلل — وهي أصغر ما في الورقة وأكثره قراءةً.
   والمفتاح سطرٌ يُقرأ مرة، فمكانه تحت لا بجانب. */
.updp-body{flex:1;display:flex;flex-direction:column;justify-content:center;gap:10px;
  padding-top:10px;min-height:0}   /* البياض الفائض يُقسم فوق وتحت لا يُترك كله أسفل */
.updp-map{flex:0 1 auto;min-height:0;min-width:0;border:1px solid #dfe3e3;border-radius:6px;
  background:#fbfcfc;padding:6px;display:flex;
  width:100%;max-width:100%;max-height:100%;height:auto;margin-inline:auto;align-self:center}
.updp-map svg{width:100%;height:100%}
.updp-rail{flex:0 0 auto;display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;
  gap:7px 18px;border:1px solid #dfe3e3;border-radius:6px;padding:8px 12px}
.updp-rail>div{display:flex;align-items:center;gap:7px;font-size:11.5px;color:#3a5257;flex:0 0 auto}
.updp-rail i{width:13px;height:13px;border-radius:3px;display:inline-block;flex:0 0 13px}
.updp-rail b{margin-right:5px;font:800 12.5px Arial,sans-serif;color:#12343a}
/* النسبة أول الشريط، ورقمها كبير: هي الرقم الذي يُنقل عن الورقة شفاهًا */
.updp-pct{display:flex!important;align-items:baseline;gap:8px;border:0;padding:0;
  margin-inline-end:6px;border-inline-end:1px solid #eceeee;padding-inline-end:16px}
.updp-pct .n{font:800 23px Arial,sans-serif;color:var(--teal-600);line-height:1}
.updp-pct .l{font-size:10.5px;color:#6b8285}
.updp-bar{display:none}                 /* الشريط الأفقي لا يتّسع لعمود تقدّم، والرقم يكفي */
.updp-note{display:block!important;font-size:10px;color:#8a9a9a;line-height:1.5;
  flex:1 1 100%;border-top:1px dashed #eceeee;padding-top:5px;margin:0}
.updp-ft{border-top:1px solid #e4e3da;margin-top:8px;padding-top:6px;
  display:flex;justify-content:space-between;font-size:9.5px;color:#8a9a9a}

@media print{
  *{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}
  body{overflow:visible!important;height:auto!important}
  body>*{display:none!important}
  #upd-print{display:block!important;position:static!important;padding:0!important;
    overflow:visible!important;background:#fff!important}
  /* الخارطة تُطبع كما الأوراق: الحاوية تُفرَّغ عند الإغلاق فلا تطبع فارغةً شيئًا */
  #rep3-chart{display:block!important;position:static!important;padding:0!important;
    overflow:visible!important;background:#fff!important}
  /* صفحة واحدة: الارتفاع مسقوف بمطبوع A4 الأفقي، والعرض يتبعه بالنسبة نفسها */
  .r3c-page{box-shadow:none!important;max-width:none!important;border-radius:0!important;
    padding:0!important;break-inside:avoid;page-break-after:avoid}
  .r3c-page svg{max-height:188mm;width:auto!important;max-width:100%;margin:0 auto}
  /* ورقة المخطط الفارغة كانت تطبع صفحة بيضاء قبل أي شاشة طباعة أخرى:
     قاعدة 100vh تنفخها وهي بلا محتوى. الفارغ يُطوى، والممتلئ كما هو. */
  .updp-page:empty,.r3c-page:empty{display:none!important;height:0!important}
  /* خلفية الجسم الرملية تتسرب تحت البطاقات على الورق — بيضاء إجبارًا للطباعة */
  html,body{background:#fff!important}
  .lar-bar{display:none!important}
  /* على الورق تُترك القياسات للورقة نفسها: عرضٌ كامل وارتفاعٌ كامل بلا ظلّ */
  .updp-page,.updp-page.a3{width:100%!important;height:100vh!important;
    box-shadow:none!important;padding:0!important;break-inside:avoid}
  .updp-map{border-color:#cfd6d6}
}

/* ═══ طيّ جداول التقارير ═══
   الجدول وحده يُطوى: الملخّص وسطر المطابقة يبقيان — بهما يُعرف إن كان الرقم
   سليمًا قبل أن يُرسل الملف، وهما سطران لا صفحة. */
.rep-hidegrid .rep-tbl-wrap,.rep-hidegrid .rep-grid{display:none}
.rep-tbl-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:9px;
  border-top:1px dashed #dfe3e3;padding-top:9px}
.rep-tbl-row span{font-size:11px;color:#8a9a9a;line-height:1.6}
.rep-tbl-row span b{color:#50676a}

/* والورقة صحيحة في الاتجاهين بلا استثناء: الشريط السفليّ لا يبالي أعُرضت الورقة
   أفقيةً أم قلبها كروم عموديةً — المخطط يأخذ العرض كله في الحالين.
   (وكان هنا استثناءٌ للوضع العمودي وحده، فأُلغي حين صار الشريط قاعدةً.) */
/* سطر التذكير في شريط الأزرار — على الشاشة وحدها */
.updp-hint{font-size:11px;color:#6b8285;margin-inline-end:auto;line-height:1.6}
.updp-hint b{color:#23403f}

/* ═══ تقرير الإنجاز: نطاقه وحالاته ═══
   مبدّل المجموعة يرث شكل مبدّلات صفحة التقارير (.scope-switch)، فيُقرأ الاثنان
   بعينٍ واحدة. وأزرار الحالات مفاتيح تُجمَع لا تُبدَّل — ولذلك شكلها مربّعات
   ملوّنة لا شريطٌ واحد: الشريط يقول «اختر واحدًا»، والمربّعات تقول «اجمع». */
.pr-scope{margin:10px 0 6px}
.pr-scope .rep-sw-hd,.pr-st .rep-sw-hd{display:block;font-size:10px;font-weight:700;
  color:#7d8f8f;margin-bottom:5px}
.pr-scope .scope-switch{width:100%}
.pr-st{margin:0 0 10px}
.pr-st-row{display:flex;flex-direction:column;gap:4px}
.pr-st-chip{display:flex;align-items:center;gap:7px;padding:6px 9px;font-size:11.5px;
  font-family:inherit;cursor:pointer;border:1.5px solid #dfe6e6;border-radius:8px;
  background:#fff;color:#8a9a9a;text-align:right;width:100%}
.pr-st-chip i{width:13px;height:13px;border-radius:4px;flex:none;
  border:1px solid rgba(0,0,0,.18);opacity:.35}
.pr-st-chip.on{border-color:#2e4057;color:#233448;font-weight:700;background:#f7f9fb}
.pr-st-chip.on i{opacity:1}
.pr-st-chip:hover{border-color:#a8cfd0}

/* ═══ طباعة عدة بنود: صفحة لكل بند، ومختصرٌ في آخرها ═══
   الحاوية تتحوّل إلى قائمة أوراق بدل ورقةٍ واحدة، وكل ورقة تأخذ نفس مقاس
   الورقة المفردة — فلا يختلف شكل البند المطبوع وحده عن شكله ضمن العشرين. */
.updp-page.multi{width:auto;height:auto;background:transparent;box-shadow:none;
  padding:0;display:block}
.updp-page.multi .updp-sheet{width:1040px;height:735px;margin:0 auto 18px;background:#fff;
  box-shadow:0 3px 16px rgba(0,0,0,.18);padding:16px 18px;box-sizing:border-box;
  display:flex;flex-direction:column}
.updp-page.multi.a3 .updp-sheet{width:1240px;height:876px}
/* ── المختصر ── */
.updp-tbl{width:100%;border-collapse:collapse;font-size:12px;margin-top:12px}
.updp-tbl th,.updp-tbl td{border:1px solid #cfd6d6;padding:5px 8px;text-align:center}
.updp-tbl th{background:#12343a;color:#fff;font-size:11px;font-weight:700}
.updp-tbl td.nm{text-align:right;font-weight:600}
.updp-tbl tbody tr:nth-child(even){background:#fafbfb}
.updp-tbl tfoot td{background:#f2c811;font-weight:800;border-top:2px solid #12343a}
.updp-sum-note{font-size:10px;color:#8a9a9a;line-height:1.6;margin-top:8px}
.updp-sum .updp-body{display:none}

@media print{
  /* ورقةٌ لكل بند. والأخيرة بلا كسرٍ بعدها وإلا خرجت ورقة بيضاء في آخر الملف. */
  .updp-page.multi{width:100%!important;height:auto!important}
  .updp-page.multi .updp-sheet{width:100%!important;height:100vh!important;
    margin:0!important;box-shadow:none!important;padding:0!important;
    break-inside:avoid;break-after:page}
  .updp-page.multi .updp-sheet.updp-last{break-after:auto}
}

/* ═══ صندوق خيارات الطباعة في شاشة التحديث ═══
   مطويٌّ افتراضًا: من يطبع بندًا واحدًا لا يُزاحمه اختيارُ عشرين. وعنوانه يقول
   ما سيخرج من الطابعة وهو مطويّ. */
.upd-print-box{border:1px solid #dfe6e6;border-radius:9px;background:#fbfcfc;margin-top:6px;
  padding:0 9px}
.upd-print-box>summary{cursor:pointer;font-size:11.5px;font-weight:700;color:#2e4057;
  padding:8px 0;list-style:none;display:flex;gap:6px;align-items:center}
.upd-print-box>summary::-webkit-details-marker{display:none}
.upd-print-box>summary::before{content:'▸';font-size:10px;color:#8a9a9a}
.upd-print-box[open]>summary::before{content:'▾'}
.upd-print-box>summary span{font-weight:600;color:var(--teal-600)}
.upd-print-box .pr-scope{margin-top:0}
/* مربّع الطباعة داخل سطر البند نفسه — قائمةٌ واحدة للشاشة والورقة */
.upd-li .pk{display:inline-flex;align-items:center;flex:none;margin-inline-end:2px}
.upd-li .pk input{width:14px;height:14px;accent-color:#2e4057;cursor:pointer}
.upd-li.pk{background:#f7f9fb}
.upd-pick-bar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:6px 10px;
  font-size:11px;color:#3a5257;border-top:1px solid #eceeee;background:#fbfcfc}
.upd-pick-bar .n b{color:#2e4057;font-size:12.5px}
.upd-pick-bar button{font-size:10px;padding:3px 9px;border:1px solid #dfe6e6;background:#fff;
  border-radius:6px;cursor:pointer;font-family:inherit;color:#50676a}
.upd-pick-bar button:hover{border-color:#a8cfd0;color:#0a6f6f}
.upd-pick-bar .hid{color:#8a6d00;background:#fff8e1;border:1px solid #ffe082;
  border-radius:6px;padding:2px 7px;font-size:10px;cursor:help}

/* رأس عمود مربّعات الطباعة داخل شريط العدّاد، وعمود الوزن في المختصر */
.upd-pick-all{display:flex;align-items:center;gap:6px;margin-inline-start:auto;
  font-size:10.5px;color:#5b4a7a;cursor:pointer;white-space:nowrap}
.upd-pick-all input{width:14px;height:14px;accent-color:#2e4057;cursor:pointer}
.upd-pick-all b{color:#2e4057}
/* رأس عمود الوزن كان يرث الخلفية الفاتحة ونصَّه أبيض، فيختفي العنوان تمامًا.
   فصار له أخضرُه الداكن: يُقرأ، ويفصل كتلة الأوزان عن كتلة الحالات بلونٍ لا بخطّ. */
.updp-tbl th.wq{background:#1d6f42;color:#fff}
.updp-tbl td.wq{background:#f6f9f6}
.updp-tbl td.wq{font:700 10px Arial,sans-serif;color:#1d6f42}
.updp-pct .wq{font-size:8.5px;color:#7d8f8f;margin-top:3px;line-height:1.4}
/* سطر التراكم المالي: أربعة أرقام تُقرأ قبل الجدول كلّه */
.updp-earn{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 4px}
.updp-earn>div{flex:1;min-width:120px;border:1px solid #dfe6e6;border-radius:8px;
  padding:6px 10px;background:#fbfcfc;text-align:center}
.updp-earn span{display:block;font-size:8.5px;color:#7d8f8f}
.updp-earn b{font-size:15px;color:#2e4057}
.updp-earn .sum{background:#eef6f3;border-color:#bfdccd}
.updp-earn .sum b{color:#1d6f42}
.updp-earn .cap{background:#f7f7f4}
.updp-earn .cap b{color:#8a8a7a;font-size:13px}

/* ═══ مختصر المخطط: مجموعٌ بالقسم ═══
   صفحةٌ تحمل جدولًا قد يطول: تُترك تتدفّق على أكثر من ورقة بدل أن تُقصّ عند
   حدّ ٍ ثابت. وكان ارتفاعها مثبَّتًا كصفحات الخرائط، فينزلق المختصر خارجها
   وتظهر البطاقات والنسب بلا تخطيط. */
.updp-page.multi .updp-sheet.updp-sum{height:auto;min-height:735px}
.updp-page.multi.a3 .updp-sheet.updp-sum{min-height:876px}
.updp-tbl tr.sec td{background:#12343a;color:#fff;font-weight:800;text-align:right;
  font-size:11px;letter-spacing:.2px}
.updp-tbl tr.sub td{background:#eef4f4;font-weight:800;border-top:1.5px solid #12343a}
.updp-tbl tr.sub td.nm{text-align:right}
.updp-tbl tbody tr.sec+tr,.updp-tbl tbody tr:nth-child(even){background:inherit}
.updp-tbl tfoot td{background:#f2c811;font-weight:800;border-top:2px solid #12343a}
/* بطاقة لكل قسم فوق الجدول: أربعة أرقام تُقرأ قبل أن يُقرأ سطر */
.updp-earn .sec-card{flex:1;min-width:150px;border:1px solid #dfe6e6;border-radius:9px;
  padding:7px 9px;background:#fbfcfc;display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline}
.updp-earn .sec-card .t{flex:1 0 100%;font-size:10.5px;font-weight:800;color:#12343a;
  border-bottom:1px solid #eceeee;padding-bottom:3px;margin-bottom:2px}
.updp-earn .sec-card>div{flex:1;text-align:center}
.updp-earn .sec-card span{font-size:8px}
.updp-earn .sec-card b{font-size:13px}
.updp-earn .sec-card .sum b{color:#1d6f42}
.updp-earn .sec-card .cap b{color:#8a8a7a;font-size:11px}

@media print{
  /* المختصر يتدفّق: رأس الجدول يتكرّر في كل ورقة، والصفوف لا تُقصّ في منتصفها */
  .updp-page.multi .updp-sheet.updp-sum{height:auto!important;min-height:0!important;
    break-inside:auto!important}
  .updp-tbl thead{display:table-header-group}
  .updp-tbl tr{break-inside:avoid}
  .updp-earn{break-inside:avoid}
}
/* اسم القسم بجوار البند في الورقة المجمَّعة: الجدول يخلط الأقسام، فلا يُعرف
   بندٌ من أيّها إلا بوسمٍ صغير. */
.updp-tbl .sec-tag{display:inline-block;margin-inline-start:7px;font-size:8.5px;
  font-weight:700;color:#7d8f8f;background:#f1f4f4;border-radius:4px;padding:1px 6px}
/* رأس الأعمدة معادًا مع كل قسم: صفٌّ في متن الجدول يلبس ثوب الترويسة */
.updp-tbl tr.rehead td{background:#12343a;color:#fff;font-size:10px;font-weight:700;
  padding:3px 8px}
.updp-tbl tr.rehead td.wq{background:#1d6f42}

/* ═══════════════ NCR — ملاحظات عدم المطابقة ═══════════════
   لونٌ واحد في كل موضع: النصف الأحمر على الخريطة، والشارة في اللوحة، وعمود
   الإكسل. ومن تعلّم اللون مرّة قرأه في الورقة كما قرأه على الشاشة. */
.ncr-panel{background:#fff;border-top:1px solid #e4e3da;padding:9px 12px;
  max-height:210px;overflow-y:auto;flex-shrink:0}
.ncr-hd{display:flex;align-items:center;gap:8px;font-size:11px;color:#8a1414;margin-bottom:6px}
.ncr-hd b{font-size:11.5px}
.ncr-hd .ncr-n{background:#fdecec;color:#d81b1b;border-radius:9px;padding:1px 8px;font-weight:700}
.ncr-hd .ncr-none{color:#b6b6ae;font-size:10.5px}
.ncr-closeall{margin-inline-start:auto;background:#fff;border:1px solid #d8d6cc;color:#5a6a6a;
  border-radius:5px;padding:3px 9px;font-size:10.5px;cursor:pointer;font-family:inherit}
.ncr-closeall:hover{border-color:#2d7a2d;color:#2d7a2d}
.ncr-g{border:1px solid #f2dcdc;border-inline-start:3px solid #d81b1b;border-radius:6px;
  padding:6px 9px;margin-bottom:6px;background:#fffafa}
.ncr-g-hd{display:flex;align-items:center;gap:8px;margin-bottom:3px}
.ncr-code{font:700 11px Arial,sans-serif;color:#d81b1b;letter-spacing:.3px}
.ncr-date{font-size:9.5px;color:#b0a8a8;margin-inline-start:auto}
.ncr-desc{font-size:11px;line-height:1.55;color:#3d3a3a;margin-bottom:5px;white-space:pre-wrap}
.ncr-villas{display:flex;flex-wrap:wrap;gap:4px}
/* الفيلا شارةٌ تُنقر فتُحدَّد على الخريطة، وعلامة الصحّ فيها تُغلق ملاحظتها
   وحدها — الإصلاح يقع على فيلا لا على رقمٍ كامل. */
.ncr-v{display:inline-flex;align-items:center;gap:3px;background:#fff;border:1px solid #f0d4d4;
  border-radius:5px;padding:1px 6px;font-size:10.5px;font-weight:600;color:#8a1414;cursor:pointer}
.ncr-v:hover{border-color:#d81b1b;background:#fdecec}
.ncr-v i{font-style:normal;font-size:10px;color:#9db09d;border-inline-start:1px solid #f0d4d4;
  padding-inline-start:4px;margin-inline-start:1px}
.ncr-v i:hover{color:#2d7a2d}

/* ── نافذة فتح الملاحظة ── */
.ncr-dlg{position:fixed;inset:0;background:rgba(18,32,46,.55);z-index:9000;
  display:flex;align-items:center;justify-content:center;padding:18px}
.ncr-dlg-card{background:#fff;border-radius:12px;width:min(520px,100%);max-height:90vh;
  overflow-y:auto;padding:0 0 14px;box-shadow:0 18px 48px rgba(0,0,0,.28)}
.ncr-dlg-hd{background:#d81b1b;color:#fff;font-size:13.5px;font-weight:700;
  padding:11px 15px;border-radius:12px 12px 0 0;display:flex;align-items:center}
.ncr-dlg-x{margin-inline-start:auto;background:transparent;border:0;color:#fff;
  font-size:15px;cursor:pointer;opacity:.85;font-family:inherit}
.ncr-dlg-meta{display:flex;gap:10px;padding:12px 15px 0}
.ncr-dlg-meta>div{flex:1;background:#f6f8f8;border-radius:7px;padding:7px 10px}
.ncr-dlg-meta span{display:block;font-size:9.5px;color:#95a3a3;margin-bottom:2px}
.ncr-dlg-meta b{font-size:11.5px;color:#12343a;line-height:1.4}
.ncr-dlg-warn{margin:10px 15px 0;background:#fff8e1;border:1px solid #ffe082;color:#7a6100;
  border-radius:6px;padding:7px 10px;font-size:10.5px;line-height:1.5}
.ncr-dlg-card label{display:block;padding:12px 15px 5px;font-size:11px;color:#6b8285}
.ncr-dlg-card textarea{width:calc(100% - 30px);margin:0 15px;padding:9px 11px;
  border:1px solid #d8d6cc;border-radius:7px;font-family:inherit;font-size:12px;
  line-height:1.6;resize:vertical;color:#233}
.ncr-dlg-card textarea:focus{outline:none;border-color:#d81b1b;box-shadow:0 0 0 2px #fdecec}
.ncr-dlg-note{margin:9px 15px 0;font-size:10px;color:#95a3a3;line-height:1.6}
.ncr-dlg-ft{display:flex;gap:8px;padding:13px 15px 0}
.ncr-dlg-ft button{flex:1;padding:9px;border-radius:7px;border:1px solid #d8d6cc;
  background:#fff;color:#5a6a6a;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit}
.ncr-dlg-go{background:#d81b1b!important;border-color:#d81b1b!important;color:#fff!important}
.ncr-dlg-go:disabled{opacity:.55;cursor:default}

/* ── الجوّال: ركنٌ أحمر على خانة الفيلا ── */
.mob-villa.ncr::before{content:"";position:absolute;top:0;inset-inline-end:0;
  border-block-start:15px solid #d81b1b;border-inline-start:15px solid transparent;
  border-start-end-radius:5px}

/* ── الورقة المطبوعة ── */
.updp-rail .ncr-leg i{border-radius:2px}
.updp-rail .ncr-leg b{color:#d81b1b}
.updp-note.ncr{color:#7a3535;border-top-color:#f2dcdc}
.updp-note.ncr b{display:block;color:#d81b1b;margin-bottom:2px;font-size:10.5px}
.updp-note.ncr span{font-weight:700;color:#d81b1b}
.updp-ncr .updp-tbl td.ncr-c{font-weight:700;color:#d81b1b;white-space:nowrap}
.updp-ncr .updp-tbl td.ncr-d{text-align:start;line-height:1.55}
.updp-ncr .updp-tbl td.ncr-p{text-align:start;font-size:9.5px;color:#5a6a6a;line-height:1.5}

/* ═══ بطاقتا التقارير الجديدتان: «حالات البنود» و«ملاحظات NCR» ═══ */
.rep-st-host{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:11px}
.rep-st-chip{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:#50676a;
  border:1px solid #e2e8e8;border-radius:20px;padding:4px 11px;cursor:pointer;background:#fff}
.rep-st-chip.on{border-color:var(--teal-600);color:#0a6f6f;background:#f2fafa}
.rep-st-chip input{width:14px;height:14px;accent-color:var(--teal-600)}
.rep-st-chip i{width:11px;height:11px;border-radius:3px;display:inline-block;flex:none}
/* صفحتا المختصر داخل البطاقة: ورقةُ الطباعة نفسها بلا ظلّ ولا حواف ورق —
   ما يُرى على الشاشة هو ما يخرج من الطابعة حرفًا بحرف. */
.reps-sheets .updp-sheet{box-shadow:none;border:1px solid #eef1f1;border-radius:9px;
  width:auto;min-height:0;height:auto;margin:0 0 12px;padding:14px 16px;page-break-after:auto}
.reps-sheets .updp-hd{margin-bottom:10px}

.repn-tbl{width:100%;border-collapse:collapse;font-size:11.5px}
.repn-tbl th{background:#2e4057;color:#fff;font-weight:700;font-size:11px;
  padding:7px 8px;text-align:center;position:sticky;top:0;z-index:1}
.repn-tbl td{border:1px solid #e8ebeb;padding:6px 8px;text-align:center;color:#33484a;vertical-align:middle}
.repn-tbl td.nm,.repn-tbl td.d{text-align:start;line-height:1.5}
.repn-tbl td.d{max-width:280px}
.repn-tbl td.c{font-weight:700;color:#d81b1b;white-space:nowrap}
.repn-tbl tr.op td.st{color:#d81b1b;font-weight:700}
.repn-tbl tr.cl td{color:#7b8c8c}
.repn-tbl tr.cl td.st{color:#2d7a2d;font-weight:700}
.repn-tbl tr:nth-child(even) td{background:#fafbfb}
.repn-close{background:#fff;border:1px solid #cfe0cf;color:#2d7a2d;border-radius:6px;
  padding:3px 9px;font-size:11px;font-weight:600;cursor:pointer;font-family:inherit;white-space:nowrap}
.repn-close:hover{background:#2d7a2d;border-color:#2d7a2d;color:#fff}
.repn-print td.ncr-d i{color:#2d7a2d;font-size:9.5px}
/* شريطٌ تحت زرّ الطباعة في صفحة تحديث الحالات: يقول أين ذهب المجمَّع */
.upd-rep-hint{margin-top:7px;font-size:10px;line-height:1.6;color:#5a7274;
  background:#f4f8f8;border:1px solid #dfeaea;border-radius:7px;padding:6px 9px}
.upd-rep-hint b{color:#0a6f6f}
/* «الإغلاق من صفحة التقارير» — يُقال في اللوحة لا يُترك لغزًا لمن بحث عن الزرّ */
.ncr-where{margin-inline-start:auto;font-size:9.5px;color:#b0a8a8}

/* ═══ صفحة التقارير: قائمةٌ ثم تفصيل ═══
   سبعة تقارير مفتوحة معًا تجعل من يريد ورقةً يمرّ على ستٍّ لا شأن له بها.
   فبطاقاتٌ تُقرأ في لمحة، ويُفتح المختار وحده. */
.rep-menu{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));grid-auto-rows:1fr;
  gap:16px;margin-bottom:6px}
/* البطاقة تكبر مع الشاشة لا تثبت عليها: النصّ يُقاس بـclamp بين حدّين، فتُقرأ
   على جوّالٍ عرضه ٣٦٠ كما تُقرأ على شاشةٍ عرضها ٢٥٦٠ — والثابت يصغر على
   الكبيرة حتى يبدو مزدحمًا، ويفيض على الصغيرة. */
.rep-tile{background:#fff;border:1px solid #e8ecec;border-radius:16px;
  padding:clamp(17px,1.5vw,26px) clamp(18px,1.6vw,28px);
  cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .12s;
  display:flex;flex-direction:column;gap:clamp(6px,.5vw,10px);
  min-height:clamp(150px,13vw,200px)}
.rep-tile:hover{border-color:var(--teal-600);box-shadow:0 6px 22px rgba(10,138,138,.13);transform:translateY(-2px)}
.rep-tile .ic{font-size:clamp(28px,2.4vw,40px);line-height:1}
.rep-tile .nm{font-size:clamp(14px,1.05vw,18px);font-weight:700;color:#22403f;line-height:1.45}
.rep-tile .cap{font-size:clamp(11.5px,.78vw,14px);color:#8fa0a0;line-height:1.6;flex:1}
.rep-tile .fig{font:800 clamp(21px,1.5vw,28px)/1 Arial,sans-serif;color:#0a6f6f;
  border-top:1px dashed #eef1f1;padding-top:clamp(9px,.7vw,13px);margin-top:2px}
.rep-tile .fig span{font:400 clamp(11px,.72vw,13px) system-ui,sans-serif;color:#9aa8a8;margin-inline-start:6px}
/* ── شريط الرجوع: سطحٌ قائم بذاته ──
   كان بلا خلفية، فيقع على صورة الصفحة وحدُّه السفليّ وحده يفصله — فيضيع
   النصّ على السماء الفاتحة والظلال الداكنة معًا. فصار بطاقةً بيضاء: يُقرأ
   عليها اسم التقرير، ويُرى فيها زرُّ الخروج. */
.rep-back{display:flex;align-items:center;gap:clamp(12px,1.2vw,20px);
  margin-bottom:clamp(14px,1.3vw,22px);
  padding:clamp(11px,1vw,16px) clamp(13px,1.2vw,20px);
  background:#fff;border:1px solid #e4eaea;border-radius:14px;
  box-shadow:0 2px 10px rgba(20,60,60,.06)}
.rep-back-btn{background:var(--teal-600);border:1px solid var(--teal-600);color:#fff;border-radius:10px;
  padding:clamp(9px,.75vw,13px) clamp(15px,1.3vw,22px);
  font-size:clamp(13px,.95vw,16px);font-weight:700;cursor:pointer;font-family:inherit;
  white-space:nowrap;transition:background .14s,box-shadow .14s}
.rep-back-btn:hover{background:#087272;box-shadow:0 3px 12px rgba(10,138,138,.32)}
.rep-back-t{font-size:clamp(15px,1.15vw,20px);color:#7c8f8f;line-height:1.35;
  display:flex;align-items:center;gap:8px;min-width:0}
.rep-back-t b{color:#12343a;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* الجهاز يقرّر عدد الأعمدة، والحدُّ الأدنى وحده لا يكفي: على شاشةٍ عريضة
   يُنتج auto-fill ستّة أعمدة نحيلة، فيُقيَّد سقفُها. */
@media(min-width:1700px){.rep-menu{grid-template-columns:repeat(4,1fr)}}
@media(max-width:900px){.rep-menu{grid-template-columns:repeat(2,1fr);gap:13px}}
@media(max-width:620px){
  .rep-menu{grid-template-columns:1fr;gap:11px}
  .rep-tile{min-height:0;padding:15px 16px}
  .rep-back{gap:9px}
  .rep-back-t{font-size:13px}
}

/* ── نافذة ملاحظات الفيلا (صفحة نسب الإنجاز) ── */
.pop-ncr{border:1px solid #f2dcdc;border-inline-start:3px solid #d81b1b;border-radius:8px;
  padding:9px 12px;margin-bottom:8px;background:#fffafa}
.pop-ncr-top{display:flex;align-items:center;gap:9px;margin-bottom:4px}
.pop-ncr-top .c{font:700 12px Arial,sans-serif;color:#d81b1b;letter-spacing:.3px}
.pop-ncr-top .d{font-size:10px;color:#b0a8a8;margin-inline-start:auto}
.pop-ncr-it{font-size:12px;font-weight:700;color:#2c2c2c;line-height:1.45;margin-bottom:3px}
.pop-ncr-ds{font-size:11.5px;color:#4d4a4a;line-height:1.6;white-space:pre-wrap}
.pop-ncr-none{padding:18px;text-align:center;color:#b6b6ae;font-size:12px}
.pop-ncr-ft{margin-top:10px;padding-top:9px;border-top:1px dashed #eee;
  font-size:10px;color:#9aa8a8;text-align:center;line-height:1.6}
/* الشارة تكبر قليلًا تحت المؤشّر فيُعرف أنها تُنقر */
.ncr-badge{transition:opacity .12s}
.ncr-badge:hover{opacity:.82}

/* ── بطاقة حالات البنود: شرائح الأقسام ومربّع المخطط ── */
.rep-secs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:11px}
.rep-secs .la-sec-chip.part{background:transparent;font-weight:700}
.rep-secs .la-sec-chip.part b{opacity:1;color:inherit}
.rep-chk{display:flex;align-items:center;gap:8px;font-size:12px;color:#3a4f4f;
  background:#f9fbfb;border:1px solid #eef1f1;border-radius:9px;
  padding:9px 12px;margin-bottom:12px;cursor:pointer}
.rep-chk input{width:16px;height:16px;accent-color:var(--teal-600);flex:none}
.rep-chk i{font-style:normal;font-size:10.5px;color:#9aa8a8}
/* مبدّلٌ بسطرين: الاسم فوق وشرحُ مقامه تحته — «مجتمعةً» و«على حدة» لا يُفرَّق
   بينهما بالاسم وحده، والشرح هو ما يقول أيّهما يريد. */
.scope-switch.rep-sw .scope-count.sub{font-size:9.5px;font-weight:400;opacity:.72;
  letter-spacing:0;margin-top:2px}
.rep-hint{margin-top:9px;font-size:11px;color:#6b8285;background:#f4f8f8;
  border:1px solid #dfeaea;border-radius:8px;padding:8px 12px;line-height:1.6}

/* ═══════════════════════════════════════════════════════════════════
   طبقة النظام — رموزٌ موحّدة تعلو ما تحتها (قرارك 2026-08-23)
   الملف فوقها نما ميزةً ميزة، فكل زرٍّ عرّف نفسه: زوايا 5 و6 و7 و9،
   وhover بعضه opacity — أرخص إيماءة في CSS. هذه الطبقة تُعيد الجميع إلى
   عائلةٍ واحدة **بالتراكب لا بإعادة الكتابة**: ألفا سطرٍ فوقها تبقى كما
   هي، وما هنا يغلبها بترتيب الورود — فالخطر محصور، والرجوع حذفُ كتلة.
   ═══════════════════════════════════════════════════════════════════ */
:root{
  --ink:#16292c; --ink-2:#51686b; --ink-3:#8fa0a0;
  --teal-700:#086a6a; --teal-600:var(--teal-600); --teal-500:#0fb5b0; --teal-050:#eef7f6;
  --line:#e3e8e7;
  --r-sm:8px; --r-md:10px; --r-lg:14px;
  --sh-1:0 1px 3px rgba(13,43,43,.08);
  --sh-2:0 4px 14px rgba(13,43,43,.12);
  --sh-3:0 14px 38px rgba(13,43,43,.18);
  --ease:cubic-bezier(.2,.7,.3,1);
}
button{font-family:inherit}

/* ── الأرقام المتساوية العرض حيث تتبدّل الأرقام أمام العين ──
   رقمٌ متغيّر بخطٍّ متفاوت العرض يهتزّ سطره كله عند كل تحديث. */
.kpi-val,.rep-tile .fig,.upd-count,#upd-count,.scope-count,.pop-tot-val{font-feature-settings:'tnum'}

/* ── حلقة التركيز: بلون البرنامج لا بأزرق المتصفح ── */
:focus-visible{outline:2px solid var(--teal-500);outline-offset:2px}

/* ── مربّعات التأشير كلها بلون البرنامج ── */
input[type=checkbox],input[type=radio]{accent-color:var(--teal-600)}

/* ── أشرطة التمرير: نحيلة موحّدة في كل البرنامج ── */
*{scrollbar-width:thin;scrollbar-color:#c3cfcd transparent}
*::-webkit-scrollbar{width:9px;height:9px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background:#c7d2d0;border-radius:8px;
  border:2px solid transparent;background-clip:content-box}
*::-webkit-scrollbar-thumb:hover{background:#a9bab8;border:2px solid transparent;background-clip:content-box}

/* ── لغة الحركة ──
   إيقاعٌ واحد للبرنامج كله: 150ms للإيماءة، 220ms لدخول الصفحة. والرفع
   والظلّ بدل تغيير الشفافية — opacity تُقرأ «بهت» لا «استجاب». */
@keyframes tdcoPanelIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.panel{animation:tdcoPanelIn .22s var(--ease)}
@media(prefers-reduced-motion:reduce){.panel{animation:none}}

/* عائلة الفعل الرئيس: كل زرٍّ ممتلئ يحمل عمل الصفحة.
   filter:brightness في الـhover تعمل مع أي لونٍ حمله الزرّ — فالأزرار
   الملوّنة بأسطرها المضمّنة (أزرق الطباعة وأخضر الإكسل وأحمر NCR) تدخل
   العائلة بلا أن يُعاد تعريف لونها. */
.mrp-run,.rep-btn:not(.ghost),.la-exp,.login-card button,.rep-back-btn,
.upd-grid button,.mob-acts button,.ncr-dlg-go,.tb-btn.primary{
  border-radius:var(--r-md);box-shadow:var(--sh-1);
  transition:transform .15s var(--ease),box-shadow .15s var(--ease),
             filter .15s,background .15s,color .15s,border-color .15s}
.mrp-run:hover,.rep-btn:not(.ghost):hover,.login-card button:hover,.rep-back-btn:hover,
.upd-grid button:hover,.mob-acts button:hover,.ncr-dlg-go:hover,.tb-btn.primary:hover{
  transform:translateY(-1px);filter:brightness(1.07);box-shadow:var(--sh-2);opacity:1}
.mrp-run:active,.rep-btn:active,.la-exp:active,.login-card button:active,.rep-back-btn:active,
.upd-grid button:active,.mob-acts button:active,.ncr-dlg-go:active,.tb-btn:active{
  transform:translateY(0) scale(.98);box-shadow:var(--sh-1)}
/* .la-exp أزراره ملوّنة بأسطر مضمّنة وبعضها أبيض محدود — الرفع يعمّها،
   والأبيض منها يحتفظ بتعبئته الفاتحة عند الوقوف عليه */
.la-exp:hover{transform:translateY(-1px);box-shadow:var(--sh-2);filter:brightness(1.05)}

/* عائلة الفعل الثانوي: أزرار بيضاء بحدّ — استجابتها لونٌ لا رفع */
.tb-btn,.rep-btn.ghost,.rep-mini,.upd-quick button,.repn-close,.us-mini,.mob-top button{
  border-radius:var(--r-sm);
  transition:background .15s,color .15s,border-color .15s,box-shadow .15s,transform .15s var(--ease)}
.tb-btn:hover{opacity:1;background:var(--teal-050);border-color:#a9cfcf;color:var(--teal-700)}
.rep-btn.ghost:hover,.rep-mini:hover,.upd-quick button:hover,.us-mini:hover{
  background:var(--teal-050);border-color:#a9cfcf;color:var(--teal-700)}

/* البطاقات: طبقة عمقٍ واحدة، وترتفع درجةً تحت المؤشّر إن كانت تُنقر */
.rep-card{border-radius:var(--r-lg);border-color:var(--line);box-shadow:var(--sh-1)}
.rep-tile{box-shadow:var(--sh-1)}
.rep-tile:hover{box-shadow:var(--sh-2)}
.ncr-dlg-card,.popup-card{box-shadow:var(--sh-3)}

/* النوافذ تدخل كما تدخل الصفحات */
@keyframes tdcoPopIn{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
.ncr-dlg-card,.popup-card{animation:tdcoPopIn .2s var(--ease)}
@media(prefers-reduced-motion:reduce){.ncr-dlg-card,.popup-card{animation:none}}

/* التوست: ينزلق من الأسفل بظلّه بدل أن يذوب في مكانه */
.toast{border-radius:12px;padding:12px 22px;font-size:13px;font-weight:600;
  box-shadow:var(--sh-3);
  transform:translateX(-50%) translateY(14px);
  transition:opacity .25s var(--ease),transform .25s var(--ease)}
.toast.show{transform:translateX(-50%) translateY(0)}

/* صفوف الجداول تستجيب للمؤشّر — في القراءة على الشاشة وحدها، والورق لا يعنيه hover */
.repn-tbl tbody tr:hover td,.lab-tbl tbody tr:hover td,
.rep-grid table tbody tr:hover td{background:#f0f7f7}

/* الحالات الفارغة: سطرٌ وسط فراغ يُقرأ عطبًا — يُؤطَّر ويُهدّأ */
.rep-empty{background:#fbfcfc;text-align:center;padding:26px 22px}

/* ── الشريط العلوي: يعلو ما تحته بظلٍّ لا بخطّ ──
   كان حدًّا رماديًّا كباقي الحدود، فلا يُقرأ أنه سقف البرنامج. الظلّ الخفيف
   يرفعه درجةً، والاسم يكبر مع الشاشة ويأخذ لون البرنامج كاملًا. */
.topbar{border-bottom:none;box-shadow:0 1px 0 #e8ebe9,0 3px 12px rgba(13,43,43,.06);
  position:relative;z-index:5}
.brand{gap:clamp(10px,.9vw,16px)}
.brand img{height:clamp(30px,2.3vw,42px)}
.brand h1{font-size:clamp(14px,1.1vw,19px);font-weight:700;color:var(--teal-700);
  letter-spacing:0}
.tb-btn{font-size:clamp(11.5px,.82vw,14px);padding:clamp(7px,.55vw,10px) clamp(13px,1vw,18px)}

/* بطاقة التنقّل الداكنة — أجمل قطعة في الواجهة، تُعمَّق درجة: تدرّجٌ خفيف
   بدل اللون المسطّح، وظلٌّ داخليّ أعلى يعطيها سُمكًا */
.topnav{background:linear-gradient(180deg,#15464c,#0e363c);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 2px 8px rgba(10,40,44,.18)}
.topnav .mode-tab{padding:clamp(7px,.6vw,11px) clamp(13px,1vw,19px)}
.topnav .mode-tab.active{box-shadow:0 2px 10px rgba(15,181,176,.42),inset 0 1px 0 rgba(255,255,255,.25)}

/* ── الأيقونات الخطّية: تلبس حجم سطرها ولونه ──
   width بوحدة em: أيقونة التبويب بحجم خطّه، وأيقونة بطاقة الرئيسية بحجم
   div.ic الكبير — مقياسٌ واحد يتبع النصّ بلا رقمٍ يُضبط لكل موضع. */
.tdco-ic{width:1.18em;height:1.18em;flex:none;vertical-align:-.22em}
.mode-tab .tdco-ic{width:1.25em;height:1.25em;vertical-align:-.28em;opacity:.85}
.mode-tab.active .tdco-ic{opacity:1}
.topnav .page-home{display:inline-grid;place-items:center}
.topnav .page-home .tdco-ic{width:1.35em;height:1.35em;vertical-align:0}
/* بطاقات الرئيسية والتقارير: div.ic يحمل حجم الإيموجي أصلًا — الـSVG يرثه */
.home-card .ic .tdco-ic,.rep-tile .ic .tdco-ic{width:1em;height:1em;vertical-align:0}
.home-card .ic{color:var(--teal-600)}
.rep-tile .ic{color:var(--teal-600)}
.rep-tile:hover .ic{color:var(--teal-500)}
.rep-back-t .tdco-ic{width:1.2em;height:1.2em;color:var(--teal-600)}

/* ── الحقول: مظهرٌ واحد حيث تُملأ النماذج ──
   محصورٌ في البطاقات والنوافذ عمدًا: حقول الجداول الضيّقة (مصفوفة المواد
   وجدول العمالة) لها مقاساتها المحسوبة، وتوحيدها هنا يكسر أعمدتها. */
.rep-card input[type=date],.rep-card input[type=text],.rep-card input[type=number],
.upd-ctrl input[type=text],.upd-ctrl input[type=date],
.login-card input,.ncr-dlg-card textarea{
  border:1px solid #d5dcdb;border-radius:9px;background:#fff;
  transition:border-color .15s,box-shadow .15s}
.rep-card input[type=date]:focus,.rep-card input[type=text]:focus,.rep-card input[type=number]:focus,
.upd-ctrl input[type=text]:focus,.upd-ctrl input[type=date]:focus,
.login-card input:focus,.ncr-dlg-card textarea:focus{
  border-color:var(--teal-500);box-shadow:0 0 0 3px rgba(15,181,176,.14);outline:none}

/* ── شاشة الدخول: بطاقة النظام نفسها ── */
.login-card{border-radius:18px;box-shadow:var(--sh-3);padding:30px 26px}
.login-card h2{font-size:19px}
.login-card input{padding:12px 14px;font-size:13.5px;margin-bottom:12px}
.login-card button{border-radius:var(--r-md);padding:12px;font-weight:700}

/* ═══ الشريط العلوي حزامٌ داكن واحد (قراره 2026-08-24) ═══
   كان ثلاث جزرٍ داكنة تطفو على شريطٍ أبيض — فتُقرأ فجواتٍ يمنةً ويسرة،
   وخطوطها صغيرة، واسم المشروع سقط في تعارض طبقتين فصار داكنًا على داكن.
   الحزام الواحد يحسم الثلاثة معًا. */
.topbar{background:linear-gradient(180deg,#15464c,#0e363c);
  padding:0 clamp(8px,.7vw,16px);border-bottom:none;
  box-shadow:0 3px 14px rgba(8,34,38,.28)}
.brand,.tb-actions{background:transparent;box-shadow:none;margin:0;padding:0}
.brand{gap:clamp(9px,.8vw,14px)}
.brand img{height:clamp(26px,2vw,38px)}
.brand h1{color:#eafaf8;font-size:clamp(13.5px,1.05vw,18px);text-shadow:0 1px 2px rgba(0,0,0,.25)}
/* بطاقة التنقّل تذوب في الحزام: طبقة زجاجية خفيفة لا صندوقًا ثانيًا */
.topnav{background:rgba(255,255,255,.07);margin:7px clamp(8px,.8vw,14px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.topnav .mode-tab{font-size:clamp(12px,.92vw,15.5px);color:#c9e4e1}
/* شريط تمريره يبقى يعمل ويُخفى مقبضه: مقبضٌ رمادي تحت التبويبات يُقرأ عطبًا */
.topnav{scrollbar-width:none}
.topnav::-webkit-scrollbar{display:none}
.tb-actions{gap:clamp(5px,.45vw,9px)}
.tb-actions .tb-btn{font-size:clamp(11px,.8vw,13.5px);
  padding:clamp(6px,.5vw,9px) clamp(11px,.85vw,15px);
  background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.22);color:#eafaf8}
.tb-actions .tb-btn:hover{background:rgba(255,255,255,.22);
  border-color:rgba(255,255,255,.34);color:#fff}
.tb-actions .tb-btn.primary{background:#0fb5b0;border-color:#0fb5b0;color:#06282c}

/* ── شارة رقم الخطوة: بديل 1️⃣ 2️⃣ 3️⃣ ── */
.step-n{display:inline-grid;place-items:center;min-width:1.5em;height:1.5em;
  border-radius:50%;background:var(--teal-600);color:#fff;font-weight:800;
  font-size:.88em;vertical-align:-.3em;margin-inline-end:3px}

/* ═══ لوحة التحميل (قراره 2026-08-24) ═══
   بلا أسماء مراحل — من ينتظر لا يقرأ «جارٍ تحميل الجدول الزمني»، والدائرة
   الدوّارة صارت ثلاثة أعمدة تتنفّس: رسمُ البرنامج نفسه (أعمدة الإنجاز) وهو
   يمتلئ. والأسماء لم تُحذف من الشيفرة: تُكتب في عنصرٍ مخفيّ، ويظهر وحده
   عند الفشل — فرسالة الخطأ ومخرجاها باقيان كما هما. */
#load-status{display:none}
#loading-overlay.failed #load-status{display:block}
#load-spinner{width:auto;height:46px;border:none;border-radius:0;animation:none;
  display:flex;align-items:flex-end;gap:8px}
#load-spinner i{width:10px;border-radius:6px;height:16px;
  background:linear-gradient(180deg,#5fd3cf,var(--teal-600));
  box-shadow:0 0 14px rgba(95,211,207,.4);
  animation:tdcoLoadBar 1.05s cubic-bezier(.45,0,.55,1) infinite}
#load-spinner i:nth-child(2){animation-delay:.16s}
#load-spinner i:nth-child(3){animation-delay:.32s}
@keyframes tdcoLoadBar{0%,100%{height:14px;opacity:.5}50%{height:44px;opacity:1}}
@media(prefers-reduced-motion:reduce){#load-spinner i{animation:none;height:30px}}

/* ── الشعار يمتلئ مع التحميل ──
   القاع رماديٌّ باهت، والملوّن فوقه يُقصّ من اليسار فيمتدّ من اليمين —
   اتجاه القراءة — بنسبة --lp التي تدفعها مراحل التحميل. */
#load-fill{position:relative;width:min(300px,64vw);margin-bottom:18px;
  filter:drop-shadow(0 8px 26px rgba(0,0,0,.35))}
#load-fill img{display:block;width:100%;border-radius:12px}
#load-fill .lf-base{filter:grayscale(1) brightness(1.1);opacity:.3}
#load-fill .lf-top{position:absolute;inset:0;
  clip-path:inset(0 0 0 calc(100% - var(--lp,0%)));
  transition:clip-path .45s cubic-bezier(.3,.7,.3,1)}
/* حدُّ الامتلاء يلمع: خيطٌ فاتح عند جبهة التقدّم */
#load-fill::after{content:'';position:absolute;top:6%;bottom:6%;
  right:var(--lp,0%);width:2.5px;border-radius:2px;
  background:linear-gradient(180deg,transparent,#5fd3cf 30%,#5fd3cf 70%,transparent);
  transition:right .45s cubic-bezier(.3,.7,.3,1);
  opacity:.9;box-shadow:0 0 10px rgba(95,211,207,.8)}
#load-pct{font:800 15px/1 'IBM Plex Sans Arabic',Arial,sans-serif;color:#bfe8e6;
  letter-spacing:.04em;margin-bottom:14px;font-feature-settings:'tnum'}
#loading-overlay.failed #load-pct,#loading-overlay.failed #load-fill::after{display:none}
@media(prefers-reduced-motion:reduce){#load-fill .lf-top,#load-fill::after{transition:none}}

/* ═══ لمسات النموذج المرجعيّ (قراره 2026-08-24) ═══
   من TDCO-Premium-Preview أُخذ ما رُشِّح وحده: برونزٌ ثانٍ مع التيل، وتيلٌ
   أعمق، وسطوحٌ ورقية دافئة، وعلامة TD بدل رقعة الشعار البيضاء، وأوزانٌ أخفّ.
   وأمّا ألوان الحالات فلم تُمسّ: هي معنًى على الخريطة والورق لا زينة. */
:root{
  --teal-600:#0a7d74; --teal-700:#08635c; --teal-050:#edf6f4;
  --bronze:#9a6f35; --bronze-300:#d7ae73; --bronze-050:#f3eadc;
  --surface:#fdfcf8;
}
body{background:#ecebe6}
.rep-card,.rep-tile,.rep-back,.login-card{background:var(--surface)}

/* علامة TD: حرفان في إطارٍ برونزي — الرقعة البيضاء كانت نشازًا على الحزام
   الداكن، وقلبُ ألوان الشعار نفسه ليس لنا؛ فالحروف مخرجٌ ثالث. */
.brand-mark{display:grid;place-items:center;width:clamp(34px,2.5vw,44px);height:clamp(34px,2.5vw,44px);
  flex:none;border:1px solid rgba(215,174,115,.5);border-radius:12px;
  color:#f4d5a8;background:rgba(215,174,115,.09);
  font:800 clamp(13px,1vw,17px)/1 'IBM Plex Sans Arabic',Arial,sans-serif;
  letter-spacing:.5px}
.brand img{display:none}
.brand h1{font-weight:600}

/* البرونز حيث يُقرأ وزنٌ أو سقف: رقمٌ ماليّ الطابع يتميّز عن أرقام العدّ */
.updp-earn .sec-card .cap b{color:var(--bronze)}
.updp-earn .sec-card .cap span{color:#9a8a70}
.updp-pct .wq,.updp-rail .wq{color:var(--bronze)}

/* أوزانٌ أخفّ: الثقيل للعناوين والأرقام وحدها، والمتن يتنفّس */
.mrp-run,.rep-btn:not(.ghost),.la-exp,.rep-back-btn,.login-card button,.ncr-dlg-go{font-weight:600}
.rep-tile .nm,.home-card .nm{font-weight:600}

/* ═══════════════ المساعد ═══════════════
   لوحٌ ينزلق إلى جانب الصفحة ولا يحلّ محلّها: السؤال يُسأل والشاشة المسؤول عنها
   ما زالت مرئيةً خلفه. ولذلك لا طبقةَ تعتيمٍ تحته ولا يمنع الضغط على ما وراءه —
   من سأل «أين هذا الزرّ؟» يريد أن يراه وهو يقرأ الجواب.
   وموضعه inset-inline-end: أسفل اليسار في العربية وأسفل اليمين في الإنجليزية،
   بعيدًا عن اللوحة اليمنى في الحالتين. */
#chat-fab{position:fixed;bottom:20px;inset-inline-end:20px;z-index:940;
  width:52px;height:52px;border-radius:50%;border:1px solid rgba(215,174,115,.45);
  background:var(--teal-700,#08635c);color:#f4d5a8;font-size:22px;line-height:1;
  cursor:pointer;box-shadow:0 6px 20px rgba(4,32,30,.30);transition:transform .14s,box-shadow .14s}
#chat-fab:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(4,32,30,.38)}
#chat-fab.on{background:#06504a}

#chat-box{position:fixed;bottom:84px;inset-inline-end:20px;z-index:941;
  width:min(400px,calc(100vw - 40px));height:min(560px,calc(100vh - 130px));
  display:flex;flex-direction:column;overflow:hidden;
  background:var(--surface,#fdfcf8);border:1px solid #ddd8cc;border-radius:16px;
  box-shadow:0 18px 50px rgba(4,32,30,.26)}
#chat-box[hidden]{display:none}

.chat-head{display:flex;align-items:center;gap:10px;padding:11px 14px;
  background:var(--teal-700,#08635c);color:#eafaf8}
.chat-ttl{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.chat-ttl b{font-size:14px;font-weight:600}
.chat-ttl small{font-size:11px;color:#9fd3cd}
#chat-x{background:none;border:none;color:#9fd3cd;font-size:15px;cursor:pointer;padding:4px 6px}
#chat-x:hover{color:#fff}

.chat-log{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px}

/* الترحيب: يقول ما يُسأل عنه بأمثلةٍ تُضغط. خانةٌ فارغة بلا مثال تجعل أول سؤالٍ
   تجربةً لمعرفة ما يفهمه، وأولُ تجربةٍ تخيب تُغلق اللوح ولا يُفتح ثانية. */
.chat-hi{color:#5c5c5c;font-size:12.5px;line-height:1.7}
.chat-eg{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.chat-eg button{text-align:start;background:#fff;border:1px solid #e2ddd0;border-radius:10px;
  padding:8px 11px;font:inherit;font-size:12.5px;color:#0a4a45;cursor:pointer}
.chat-eg button:hover{border-color:var(--teal-600,#0a7d74);background:var(--teal-050,#edf6f4)}

.chat-msg{max-width:88%;padding:9px 12px;border-radius:13px;font-size:13px;line-height:1.75;
  white-space:normal;overflow-wrap:anywhere}
.chat-msg.me{align-self:flex-end;background:var(--teal-700,#08635c);color:#eafaf8;
  border-end-end-radius:4px}
.chat-msg.bot{align-self:flex-start;background:#fff;border:1px solid #e6e1d5;color:#1a1a1a;
  border-end-start-radius:4px}
.chat-msg.err{align-self:flex-start;background:#fdf0ee;border:1px solid #e8c4bd;color:#8c2f20}
.chat-msg code{background:#f0efe8;border-radius:4px;padding:1px 5px;font-size:12px}
.chat-msg .chat-li{display:block;padding-inline-start:14px;position:relative}
.chat-msg .chat-li::before{content:'·';position:absolute;inset-inline-start:4px;font-weight:700}

/* الانتظار ثلاث نقاط: ما دام الجواب يُبثّ حرفًا حرفًا فالفراغ الوحيد هو ما قبل
   أول حرف — ثانيةٌ أو اثنتان، لكن الصمت فيهما يُقرأ عطلًا. */
.chat-wait{display:inline-flex;gap:4px;padding:2px 0}
.chat-wait i{width:6px;height:6px;border-radius:50%;background:#b6b0a2;
  animation:chatdot 1s infinite ease-in-out}
.chat-wait i:nth-child(2){animation-delay:.16s}
.chat-wait i:nth-child(3){animation-delay:.32s}
@keyframes chatdot{0%,60%,100%{opacity:.28}30%{opacity:1}}
@media (prefers-reduced-motion:reduce){.chat-wait i{animation:none;opacity:.55}}

.chat-foot{display:flex;gap:8px;align-items:flex-end;padding:10px 12px 6px;
  border-top:1px solid #ece7db;background:#fff}
#chat-in{flex:1;resize:none;border:1px solid #ddd8cc;border-radius:10px;padding:9px 11px;
  font:inherit;font-size:13px;line-height:1.6;max-height:120px;background:#fdfcf8;color:#1a1a1a}
#chat-in:focus{outline:none;border-color:var(--teal-600,#0a7d74)}
#chat-send{flex:none;width:36px;height:36px;border-radius:50%;border:none;cursor:pointer;
  background:var(--teal-700,#08635c);color:#f4d5a8;font-size:16px;line-height:1}
#chat-send:disabled{background:#c6c0b2;color:#fff;cursor:default}

/* حدُّه مكتوبٌ تحت خانة الكتابة لا في رسالة ترحيبٍ تُمرَّر وتُنسى: من نسي أنه لا
   يقرأ البيانات سأله عنها، وهذا السطر أمام عينه لحظة السؤال. */
.chat-note{padding:0 12px 10px;font-size:10.5px;line-height:1.6;color:#8a8474;background:#fff}

/* الجوّال: ورقةٌ من الأسفل بعرض الشاشة. لوحٌ بعرض 400px على شاشة 375px يخرج
   من حافّتها، والزرّ العائم يجلس فوق شريط التبويبات السفلي. */
@media (max-width:640px){
  #chat-fab{bottom:74px;inset-inline-end:14px;width:46px;height:46px;font-size:19px}
  #chat-box{inset-inline:8px;bottom:74px;width:auto;height:min(70vh,520px)}
}

/* شريط اليوم في صفحة التحديثات: التاريخ يُبدَّل في مكانه بلا مغادرة الصفحة */
.ap-daybar{display:flex;gap:10px;align-items:center;margin:0 0 12px;flex-wrap:wrap}
.ap-daybar label{font-size:12.5px;color:#5a6a6a}
.ap-daybar input[type=date]{padding:5px 9px;border:1px solid #cfd6d6;border-radius:7px;font:inherit;font-size:12.5px}
.ap-daybar button{padding:5px 12px;border:1px solid #cfd6d6;background:#fff;border-radius:7px;cursor:pointer;font:inherit;font-size:12.5px}