/* ============================================================
   خبرنا — «سطور»: الرموز
   الهوية مأخوذة من السطور السوداء داخل فقاعة الشعار: حبر على ورق رمادي
   بارد، وقضبان مدوّرة الأطراف تبني الصفحة. لا لون إبراز غير الحبر؛
   الأحمر لـ«عاجل» وحده.

   الألوان كلها رموز: الوضع الداكن يعيد تعريف الرموز لا المكوّنات، مرّة
   لتفضيل النظام ومرّة لاختيار القارئ الصريح (data-theme)، واختيار «فاتح»
   الصريح يغلب نظاماً داكناً.
   ============================================================ */

:root {
  /* ---------- الخطوط ---------- */
  --f-sans: "KB Sans", "Noto Sans Arabic", system-ui, "Segoe UI", Tahoma, Arial, sans-serif;
  --f-text: "KB Text", "Noto Naskh Arabic", "Traditional Arabic", "Times New Roman", serif;
  --f-clock: "KB Clock", "Handjet", ui-monospace, "Cascadia Mono", Consolas, monospace;

  /* ---------- سلّم الأحجام ---------- */
  --fs-xs: 12px;
  --fs-sm: 14px;
  --fs-base: 16px;
  --fs-md: 18px;
  --fs-lg: 22px;
  --fs-xl: 28px;
  --fs-2xl: clamp(26px, 3.2vw, 36px);
  --fs-3xl: clamp(30px, 4.2vw, 48px);
  --fs-text: 19px;

  /* ---------- المسافات ---------- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;

  /* ---------- السطور: قضبان الشعار ---------- */
  --bar: 6px;          /* قضيب رأس القسم وعلامة العنوان */
  --bar-rule: 8px;     /* القضيب الذي يُغلق الترويسة */
  --bar-short: 56%;    /* طول السطر الثاني، كما في الشعار */

  /* ---------- التخطيط ---------- */
  --container: 1240px;
  --gutter: clamp(16px, 4vw, 32px);
  --header-h: 0px;

  /* ---------- الألوان: فاتح ---------- */
  --c-paper: #F5F5F3;
  --c-panel: #FFFFFF;
  --c-sunk: #EBEBE7;
  --c-ink: #111113;
  --c-ink-2: #3C3C41;
  --c-ink-3: #66666B;
  --c-bar: #141416;
  --c-line: #D9D9D4;
  --c-red: #CC2B31;
  --c-on-red: #FFFFFF;
  --c-scrim: rgba(17, 17, 19, 0.45);

  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --c-paper: #0F0F11;
    --c-panel: #17171A;
    --c-sunk: #1F1F23;
    --c-ink: #EFEFEC;
    --c-ink-2: #C6C6C1;
    --c-ink-3: #9C9C96;
    --c-bar: #EFEFEC;
    --c-line: #2C2C31;
    --c-red: #FF5C62;
    --c-on-red: #170405;
    --c-scrim: rgba(0, 0, 0, 0.6);

    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --c-paper: #0F0F11;
  --c-panel: #17171A;
  --c-sunk: #1F1F23;
  --c-ink: #EFEFEC;
  --c-ink-2: #C6C6C1;
  --c-ink-3: #9C9C96;
  --c-bar: #EFEFEC;
  --c-line: #2C2C31;
  --c-red: #FF5C62;
  --c-on-red: #170405;
  --c-scrim: rgba(0, 0, 0, 0.6);

  color-scheme: dark;
}