/* مرشد — رموز التصميم (التوجه الأول) — مولّدة من murshid.tokens.json
   الاستخدام: استورد الملف مرة واحدة واقرأ var(--m-*) . لا قيم لونية مثبّتة خارج هذا الملف. */
:root {
  --m-green: #00F211; --m-green-deep: #00B80D; --m-green-tint: #DDFFDF;
  --m-ink: #0A0A0A; --m-ink-2: #38332F; --m-ink-3: #66605D;
  --m-sand: #FAFAF8; --m-sand-2: #F0EFEB; /* أوف وايت — البيج القديم #F5F0E8 أُلغي */ --m-surface: #FFFFFF;
  --m-purple: #A430BF; --m-purple-deep: #77218C; --m-purple-tint: #F4E6F8;
  --m-star: #8A6A00; --m-danger: #B3261E; --m-success: #1B7F2A;
  --m-line: rgba(10,10,10,.10); --m-line-strong: rgba(10,10,10,.18);
  --m-scrim: rgba(0,0,0,.75);

  --m-font: 'IBM Plex Sans Arabic', 'IBM Plex Sans', system-ui, sans-serif;
  --m-fs-display: 28px; --m-fs-h1: 22px; --m-fs-h2: 19px; --m-fs-h3: 16px;
  --m-fs-body: 14px; --m-fs-small: 12.5px; --m-fs-caption: 11px; --m-fs-nav: 10px;

  --m-sp-1: 4px; --m-sp-2: 8px; --m-sp-3: 12px; --m-sp-4: 16px; --m-sp-5: 20px;
  --m-sp-6: 24px; --m-sp-7: 32px; --m-sp-8: 40px; --m-page-inline: 16px; --m-section-gap: 22px;

  --m-r-xs: 8px; --m-r-sm: 12px; --m-r-md: 14px; --m-r-lg: 18px; --m-r-xl: 22px; --m-r-sheet: 28px; --m-r-pill: 999px;
  --m-tap: 44px; --m-icon: 22px; --m-icon-sm: 16px; --m-icon-lg: 28px; --m-fab: 56px;

  --m-sh-sheet: 0 -2px 12px rgba(0,0,0,.08);
  --m-sh-fab: 0 4px 16px rgba(0,242,17,.45);
  --m-sh-modal: 0 12px 40px rgba(0,0,0,.18);

  --m-t-fast: 120ms; --m-t-base: 200ms; --m-t-slow: 320ms; --m-ease: cubic-bezier(.2,.8,.2,1);

  /* أدوار دلالية — الصفحات تستخدم هذه لا اللون الخام */
  --m-bg: var(--m-sand); --m-fg: var(--m-ink); --m-fg-muted: var(--m-ink-3);
  --m-card: var(--m-surface); --m-card-line: var(--m-line);
  --m-brand-surface: var(--m-green); --m-on-brand: var(--m-ink);
  --m-cta: var(--m-purple); --m-on-cta: #FFFFFF; --m-link: var(--m-purple-deep);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --m-bg: #0A0A0A; --m-fg: #F5F0E8; --m-fg-muted: #A8A29E;
    --m-card: #161616; --m-card-line: rgba(245,240,232,.12);
    --m-brand-surface: #00F211; --m-on-brand: #0A0A0A;
    --m-link: #D28BE3;
  }
}
:root[data-theme="dark"] {
  --m-bg: #0A0A0A; --m-fg: #F5F0E8; --m-fg-muted: #A8A29E;
  --m-card: #161616; --m-card-line: rgba(245,240,232,.12);
  --m-brand-surface: #00F211; --m-on-brand: #0A0A0A;
  --m-link: #D28BE3;
}