/* math.css — مُستخرَج من SIM2/public/sim/ui/theme.css: الخطوط (١) وطبقة الرياضيات (١٢.أ) وحدها،
   كي تستعمل صفحات SIM3 مُعرِض mathtex.js دون باقي نظام تصميم SIM2. لا تعدّل هنا إلا مع mathtex.js. */
/* ═══════════════ ١. الخطوط ═══════════════
   Cairo مضمّن محلياً في assets/fonts/ — لا CDN ولا شبكة، فيعمل من file://
   كما يشترط CLAUDE.md §2.4. ملف متغيّر الوزن (400–900) في نسختين:
   العربية واللاتينية، و unicode-range يجعل المتصفح يحمّل ما يحتاجه فقط.
   المجموع ٦٤ كيلوبايت. **لا تستبدلهما برابط Google Fonts.** */
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url('../assets/fonts/cairo-arabic.woff2') format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1,
                 U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41,
                 U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC;
}
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url('../assets/fonts/cairo-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
                 U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
                 U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --font: 'Cairo', 'Tajawal', 'Dubai', 'Segoe UI', system-ui, -apple-system,
          'Noto Sans Arabic', Tahoma, sans-serif;
  --mono: 'JetBrains Mono', 'Cascadia Mono', ui-monospace, Consolas, 'SF Mono', monospace;

  /* مقياس الخطوط — نسبة ثابتة، لا أرقام عشوائية */
  --fs-hero:  clamp(30px, 5.4vw, 54px);
  --fs-h1:    clamp(22px, 3vw, 30px);
  --fs-h2:    clamp(18px, 2.2vw, 23px);
  --fs-h3:    17px;
  --fs-lg:    16px;
  --fs-body:  15px;
  --fs-sm:    13.5px;
  --fs-xs:    12.5px;
  --fs-xxs:   11.5px;

  /* مقياس المسافات — 4px كوحدة أساس */
  --s-1: 4px;   --s-2: 8px;   --s-3: 12px;  --s-4: 16px;
  --s-5: 20px;  --s-6: 24px;  --s-8: 32px;  --s-10: 40px;
  --s-12: 48px; --s-16: 64px; --s-20: 80px; --s-24: 96px;

  /* الحواف */
  --r-xs: 6px;  --r-sm: 10px; --r-md: 14px;
  --r-lg: 20px; --r-xl: 26px; --r-full: 999px;

  /* الحركة */
  --ease: cubic-bezier(.22, .68, .36, 1);
  --t-fast: .13s; --t-mid: .22s; --t-slow: .38s;

  /* ارتفاع موحّد لكل عناصر التحكّم */
  --ctl-h: 42px;
  --ctl-h-sm: 34px;
  --nav-h: 66px;
}

/* ────────── ١٢.أ الرياضيات (core/mathtex.js) ──────────
   طبقة عرض الرياضيات. كل صنف هنا يولّده mathtex.js، فلا تُعِد
   تسميته إلا مع تعديل ذلك الملف.

   ⚠ الاتجاه: `.mx` تحمل dir="ltr" في الـ HTML و`unicode-bidi: isolate`
     هنا، فلا تنقلب المعادلة داخل صفحة RTL. لا تُزِل أيّاً منهما.
   ⚠ القياسات بـ em لا px، فتتبع حجم الخط المحيط وتكبير المتصفح. */

/* خطوط TeX (Computer Modern عبر خطوط KaTeX، رخصة MIT — assets/fonts/
   KaTeX-LICENSE.txt). مضمّنة محلياً: لا CDN. الرياضيات بخطّها وحدها،
   والعربية بخطّ الواجهة: الخطّ العربي احتياطٌ في --math فيلتقط أي حرف
   عربي داخل 	ext{} ولا يمسّ الرموز. */
@font-face { font-family: 'SIM TeX Main';  src: url('../assets/fonts/KaTeX_Main-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'SIM TeX Main';  src: url('../assets/fonts/KaTeX_Main-Bold.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'SIM TeX Math';  src: url('../assets/fonts/KaTeX_Math-Italic.woff2') format('woff2'); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: 'SIM TeX Size1'; src: url('../assets/fonts/KaTeX_Size1-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
:root {
  --math: 'SIM TeX Main', 'Cambria Math', 'Times New Roman', var(--font), serif;
  --math-it: 'SIM TeX Math', 'Cambria Math', 'Times New Roman', serif;
}

.mx {
  display: inline-block;
  direction: ltr;
  unicode-bidi: isolate;
  font-family: var(--math);
  font-size: 1.1em;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
  white-space: nowrap;
  text-align: center;
  vertical-align: middle;
}

/* رياضيات داخل جملة (SIM.math.autoHtml): بخطّ النصّ وعلى خطّ أساسه،
   لا بالخطّ الأحاديّ ولا منتصفَ السطر كصندوق المعادلات. */
.mx.mx-in {
  font-family: var(--math);
  vertical-align: baseline;
  line-height: 1;
  font-size: 1.1em;
  padding-inline: .1em;
  /* المسافة العربية ضيّقة في Cairo: «الزمن (x – t)» كانت تلتصق */
  margin-inline: .08em;
}
/* الكمية بوحدتها («6 s») جزءٌ من الجملة: بلا هامش، وإلا انفصلت عن
   النقطة بعدها («6 s .») */
.mx.mx-in.mx-q { margin-inline: 0; padding-inline: .04em; }
/* سطر معادلة فيه كلمات («slope = …»، «مساحة المستطيل = …»): الكلمات
   بخطّ النصّ لا الأحاديّ (الأحاديّ يفكّك العربية)، واتجاه السطر من أوّل
   حرف قويّ فيه، ويلتفّ بدل أن يُقتطع على الهاتف. */
.mx-line {
  font-family: var(--font);
  unicode-bidi: plaintext;
  white-space: normal;
  line-height: 1.9;
}
/* المائل يميل فوق ما بعده: هامش رفيع يمنع التصاق «v=» */
.mx .mx-var { padding-inline-end: .03em; }
/* اليونانية الكبيرة (Δ Ω) منتصبة بخطّ TeX الرئيسي، والصغيرة (θ ω) مائلة
   بخطّ TeX الرياضي عبر .mx-var — عُرف LaTeX */
.mx .mx-gr { font-family: var(--math); }
/* الرياضيات لا تتجاوز بطاقتها: في صناديق المعادلات وخطوات الحل والتفسير
   يلتفّ السطر الطويل بعد «=» أو «→» (مواضع <wbr> التي يضعها mathtex)
   لا في وسط حدّ. وخارجها تبقى المعادلة سطراً واحداً. */
[id$="-eq"] .mx,
[id$="-areaeq"] .mx,
.answer-steps .mx,
.ex-why .mx,
.eqpick-row .f .mx { white-space: normal; max-width: 100%; }
/* احتياط أخير لحدٍّ واحد أعرض من البطاقة: تمرير أفقي لا فيضان */
/* بلا overflow على أسطر المعادلات: overflow-y: hidden كان يقصّ المقام
   وخطّ الجذر (يمتدّان خارج سطر النصّ). السطر الطويل يلتفّ بعد «=». */
[id$="-eq"] > div,
[id$="-areaeq"] > div,
.answer-steps > div { max-width: 100%; padding-block: 3px; }

/* المتغيّرات مائلة، والوحدات والأرقام منتصبة — عُرف الطباعة الرياضية
   الذي يميّز «v» المتغيّر من «m» وحدة المتر. */
.mx .mx-var { font-style: italic; font-family: var(--math-it); font-weight: 400; }
.mx .mx-up,
.mx .mx-up i,
.mx .mx-fn { font-style: normal; font-family: var(--math); font-weight: 400; }
/* النصّ العربي داخل \text{} يعود RTL داخل معادلة LTR */
.mx .mx-up { unicode-bidi: isolate; }
.mx .mx-fn { padding-inline-end: .12em; }
.mx .mx-bold { font-weight: 700; }
.mx .mx-op { padding-inline: .2em; }              /* عملية ثنائية: + − × · (TeX: 4mu) */
.mx .mx-op.mx-rel { padding-inline: .28em; }      /* علاقة: = → ≈ (TeX: 5mu) */
.mx .mx-un { padding-inline: 0; }                 /* إشارة أحادية: −20 */
/* المؤثّرات الكبيرة ∫ ∑ ∏ — أكبر من النصّ ونازلة عن خطّه كما في TeX */
.mx .mx-big {
  display: inline-block;
  font-family: 'SIM TeX Size1', var(--math);
  font-size: 1.3em;
  line-height: 1;
  vertical-align: -.32em;
  margin-inline: .04em .06em;
}
/* حدود التكامل: العليا عند رأس العلامة والسفلى عند ذيلها */
.mx .mx-big + .mx-ss { font-size: .62em; row-gap: .75em; vertical-align: 1.05em; margin-inline: -.1em .12em; }
.mx .mx-big + sub.mx-sub1 { vertical-align: -.55em; margin-inline-end: .12em; }
/* الشرطة: f′ — أُسٌّ صغير ملتصق بما قبله */
.mx .mx-prime { font-size: .9em; vertical-align: .32em; line-height: 0; margin-inline: .02em 0; }
.mx .mx-fence { padding-inline: .04em; }
.mx .mx-sp { display: inline-block; }

/* الأمر غير المعروف يُعرض بلون تحذيري بدل أن تُخفى المعادلة —
   المعلّم يجب أن يرى خطأه لا صندوقاً فارغاً. */
.mx .mx-unknown {
  color: var(--danger);
  border-radius: var(--r-xs);
  padding: 0 .16em;
}

/* الكسر: بسط وخطّ ومقام في عمود واحد */
.mx .mx-frac {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  /* middle يضع منتصف الكسر — أي خطّه — على مستوى علامة «=» (مقيس:
     فرق 0.4px). كان هنا transform: translateY(.42em) يُنزل الكسر 6px تحت
     «=» ويُخرج المقام من سطره فيُقتطع؛ التحويل يُزيح الرسم لا التخطيط. */
  vertical-align: middle;
  margin-inline: .1em;
}
.mx .mx-num,
.mx .mx-den { display: block; padding: 0 .22em; font-size: .92em; }
.mx .mx-bar-line {
  display: block;
  width: 100%;
  min-width: 1.1em;
  height: 1px;
  background: currentColor;
  margin: .1em 0;
}

/* الجذر: العلامة √ ثم خطّ أفقي فوق المقدار */
/* الجذر: inline-block (خطّ أساسه خطّ ما تحت الجذر) والعلامة SVG مطلقة
   بطوله كاملاً — تتمدّد مع الكسور، وطرفها العلوي على خطّ الجذر. */
.mx .mx-sqrt {
  position: relative;
  display: inline-block;
  padding-inline-start: .62em;
  margin-inline: .08em;
  --mx-rule: max(1px, .055em);
}
.mx .mx-surd {
  position: absolute;
  inset-block: 0;
  left: 0;
  width: .62em;
}
.mx .mx-surd svg { display: block; width: 100%; height: 100%; overflow: visible; }
.mx .mx-surd path {
  fill: none;
  stroke: currentColor;
  stroke-width: var(--mx-rule);
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}
.mx .mx-rad {
  display: inline-block;
  border-top: var(--mx-rule) solid currentColor;
  padding: .12em .14em 0 .08em;
}
/* دليل الجذر النوني ∛: فوق ذراع العلامة القصيرة */
.mx .mx-idx { position: absolute; left: .02em; bottom: 52%; font-size: .6em; line-height: 1; }

/* الأُسس والسفليات */
.mx sup.mx-sup1,
.mx sub.mx-sub1 { font-size: .68em; line-height: 0; }
.mx sup.mx-sup1 { vertical-align: .58em; }
.mx sub.mx-sub1 { vertical-align: -.28em; }

/* أُسّ وسفلي على الحرف نفسه: عمود واحد بدل تراكب */
.mx .mx-ss {
  display: inline-flex;
  flex-direction: column;
  font-size: .68em;
  line-height: .9;
  /* خطّ أساس العمود هو سطره الأول (الأُسّ): نرفعه فيقع الأُسّ فوق خطّ
     النصّ والسفلي تحته — كانت .1em تُجلس الأُسّ على الخطّ نفسه */
  vertical-align: .36em;
  text-align: start;
}

/* الزخارف: المتجه والقبّعة والشريط. تُرسم بعنصر زائف فوق الحرف
   لا بمحرف مركّب (U+20D7)، لأن المحارف المركّبة تُزاح مع كل خط. */
.mx .mx-acc { position: relative; display: inline-block; }
.mx .mx-acc-b { display: inline-block; }
.mx .mx-acc::after {
  position: absolute;
  inset-inline: 0;
  top: -.62em;
  font-size: .8em;
  line-height: 1;
  text-align: center;
  pointer-events: none;
}
.mx .mx-vec::after   { content: '\2192'; font-size: .62em; top: -.62em; left: .14em; right: 0; }   /* → صغير كـ \vec في TeX، مُزاح مع المَيل */
.mx .mx-hat::after   { content: '\005E'; top: -.52em; }
.mx .mx-tilde::after { content: '\007E'; top: -.58em; }
.mx .mx-dot::after   { content: '\02D9'; top: -.66em; }
.mx .mx-bar::after   { content: ''; height: 1px; background: currentColor; top: -.18em; }

/* داخل صندوق المعادلات يكبر قليلاً — المعادلة هي المحتوى لا الحاشية */