/* ═══════════════════════════════════════════════════════════════
   منصة عمر عقل — هوية "محطة الميدان"
   أحياء · جيولوجيا · علوم متكاملة
   ─────────────────────────────────────────────────────────────
   الهوية: مختبر حيّ — أخضر حيوي (الحياة) + كهرماني صهاري (الأرض)
   + سماوي (العلوم المتكاملة)، على قاعدة معملية نظيفة.
   الزخارف: شبكة خلايا سداسية · حلزون DNA · طبقات صخرية · خطوط كنتور.
   ═══════════════════════════════════════════════════════════════ */

:root {
  /* ── الحياة (Biology) — الأخضر الحيوي ───────────────────── */
  --life-950: #04211A;
  --life-900: #063028;
  --life-800: #094537;
  --life-700: #0A6B52;
  --life-600: #068B67;
  --life-500: #00A878;
  --life-400: #2BC896;
  --life-300: #6FE0BC;
  --life-200: #AFF0DC;
  --life-100: #DCFAF0;

  /* ── الأرض (Geology) — الكهرماني الصهاري ────────────────── */
  --earth-900: #4A2410;
  --earth-800: #7A3D18;
  --earth-700: #A85527;
  --earth-600: #C96A2C;
  --earth-500: #E2803A;
  --earth-400: #F0A063;
  --earth-300: #F8C89B;
  --earth-100: #FDEDDD;

  /* ── العلوم المتكاملة — السماوي ──────────────────────────── */
  --aqua-800: #0B4F5E;
  --aqua-700: #10707F;
  --aqua-600: #1592A4;
  --aqua-500: #1FB6C9;
  --aqua-400: #57D2E0;
  --aqua-300: #9CE7EF;
  --aqua-100: #E0F8FB;

  /* ── توافُق مع المسميات القديمة ─────────────────────────── */
  --brand-950: var(--life-950);
  --brand-900: var(--life-900);
  --brand-800: var(--life-800);
  --brand-700: var(--life-700);
  --brand-600: var(--life-600);
  --brand-500: var(--life-500);
  --brand-400: var(--life-400);
  --brand-300: var(--life-300);
  --brand-100: rgba(0, 168, 120, 0.12);
  --brand-50:  rgba(0, 168, 120, 0.06);

  --gold-700: var(--earth-700);
  --gold-600: var(--earth-600);
  --gold-500: var(--earth-500);
  --gold-400: var(--earth-400);
  --gold-300: var(--earth-300);
  --gold-soft: rgba(226, 128, 58, 0.18);

  --brand: var(--life-700);
  --accent: var(--life-500);
  --accent-soft: rgba(0, 168, 120, 0.12);
  --accent-violet: var(--aqua-600);
  --accent-cyan: var(--aqua-500);
  --accent-amber: var(--earth-500);
  --accent-green: var(--life-500);
  --accent-gold: var(--earth-500);

  --insight: #00A878;
  --insight-strong: #0A6B52;
  --insight-soft: rgba(0, 168, 120, 0.12);

  --sky: var(--aqua-500);
  --sky-soft: rgba(31, 182, 201, 0.13);
  --earth: var(--earth-500);
  --earth-soft: rgba(226, 128, 58, 0.13);

  /* ── الأسطح — ورق المعمل ────────────────────────────────── */
  --page-bg: #F4F8F6;
  --page-bg-alt: #E8F0EC;
  --card-bg: #FFFFFF;
  --card: #FFFFFF;
  --card-bg-strong: #FFFFFF;
  --card-soft: #EEF5F2;
  --ink-plate: #072A22;

  --surface-soft: rgba(7, 42, 34, 0.04);
  --surface-strong: rgba(7, 42, 34, 0.08);
  --surface-highlight: rgba(0, 168, 120, 0.10);
  --surface-highlight-strong: rgba(0, 168, 120, 0.20);
  --glass: rgba(255, 255, 255, 0.72);
  --glass-border: rgba(7, 42, 34, 0.10);

  /* ── النص ───────────────────────────────────────────────── */
  --text: #14332B;
  --text-strong: #072A22;
  --muted: #5F7A72;
  --muted-strong: #3E5B53;
  --on-dark: #EAF7F2;

  /* ── الحدود والظلال ─────────────────────────────────────── */
  --border: rgba(7, 42, 34, 0.10);
  --border-strong: rgba(7, 42, 34, 0.20);
  --brand-border: rgba(0, 168, 120, 0.35);
  --gold-border: rgba(226, 128, 58, 0.45);

  --shadow-soft: 0 2px 10px rgba(6, 48, 40, 0.05), 0 8px 24px -12px rgba(6, 48, 40, 0.10);
  --shadow: 0 4px 16px rgba(6, 48, 40, 0.07), 0 18px 44px -20px rgba(6, 48, 40, 0.18);
  --shadow-strong: 0 8px 24px rgba(6, 48, 40, 0.10), 0 36px 72px -28px rgba(6, 48, 40, 0.28);
  --shadow-gold: 0 12px 32px -12px rgba(226, 128, 58, 0.45);
  --glow-life: 0 0 0 1px rgba(0, 168, 120, 0.22), 0 12px 36px -14px rgba(0, 168, 120, 0.5);
  --glow-earth: 0 0 0 1px rgba(226, 128, 58, 0.22), 0 12px 36px -14px rgba(226, 128, 58, 0.5);

  --primary: var(--life-700);
  --primary-strong: var(--life-800);
  --primary-weak: rgba(0, 168, 120, 0.12);

  /* ── الحقول ─────────────────────────────────────────────── */
  --field-bg: #FFFFFF;
  --field-text: var(--text);
  --field-border: rgba(7, 42, 34, 0.16);
  --field-focus: var(--life-500);

  /* ── الأزرار ────────────────────────────────────────────── */
  --btn-solid-bg: linear-gradient(135deg, #068B67 0%, #00A878 55%, #2BC896 100%);
  --btn-solid-text: #FFFFFF;
  --btn-gold-bg: linear-gradient(135deg, #C96A2C 0%, #E2803A 55%, #F0A063 100%);
  --btn-gold-text: #FFFFFF;

  /* ── الحالات ────────────────────────────────────────────── */
  --success: #068B67;
  --danger: #D24B3A;
  --warning: #C96A2C;
  --btn-success-bg: linear-gradient(135deg, #068B67, #00A878);
  --btn-success-text: #FFFFFF;
  --success-soft-bg: rgba(0, 168, 120, 0.12);
  --success-soft-border: rgba(0, 168, 120, 0.38);
  --danger-soft-bg: rgba(210, 75, 58, 0.10);
  --danger-soft-border: rgba(210, 75, 58, 0.35);
  --warning-soft-bg: rgba(226, 128, 58, 0.12);
  --warning-soft-border: rgba(226, 128, 58, 0.38);

  /* ── الأنصاف ────────────────────────────────────────────── */
  --radius-xs: 8px;
  --radius: 12px;
  --radius-lg: 18px;
  --radius-xl: 26px;
  --radius-2xl: 34px;
  --radius-pill: 999px;

  /* ── مفتاح الوضع ───────────────────────────────────────── */
  --sw-bg: var(--life-600);
  --sw-knob: #FFFFFF;

  /* ── الهيدر ─────────────────────────────────────────────── */
  --hdr-bg: rgba(255, 255, 255, 0.82);
  --hdr-text: var(--text-strong);
  --hdr-border: rgba(7, 42, 34, 0.09);
  --hdr-fade: transparent;

  /* ── التدرجات والتوهج ───────────────────────────────────── */
  --grid-line: rgba(7, 42, 34, 0.05);
  --page-glow-1: rgba(0, 168, 120, 0.13);
  --page-glow-2: rgba(31, 182, 201, 0.12);
  --page-glow-3: rgba(226, 128, 58, 0.10);

  --grad-brand: linear-gradient(135deg, #0A6B52, #00A878 60%, #2BC896);
  --grad-gold: linear-gradient(135deg, #C96A2C, #E2803A 60%, #F0A063);
  --grad-aqua: linear-gradient(135deg, #10707F, #1FB6C9 60%, #57D2E0);
  --grad-spectrum: linear-gradient(90deg, #00A878 0%, #1FB6C9 50%, #E2803A 100%);
  --grad-hero: linear-gradient(165deg, #F4F8F6 0%, #E8F2EE 45%, #DDEEF0 100%);
  --grad-plate: linear-gradient(160deg, #072A22 0%, #063028 45%, #05201C 100%);

  /* ── الخطوط ─────────────────────────────────────────────── */
  --font-display: 'Cairo', 'IBM Plex Sans Arabic', system-ui, sans-serif;
  --font-body: 'IBM Plex Sans Arabic', 'Cairo', system-ui, sans-serif;
  --font-calli: 'Cairo', system-ui, sans-serif;
  --font-mono: 'Space Grotesk', ui-monospace, 'SFMono-Regular', monospace;

  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-swift: cubic-bezier(0.4, 0, 0.2, 1);

  /* ── الزخارف العلمية (SVG مضمّنة) ───────────────────────── */
  /* شبكة خلايا سداسية */
  --hexcell: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='97' viewBox='0 0 56 97'%3E%3Cg fill='none' stroke='%2300A878' stroke-opacity='.14' stroke-width='1.1'%3E%3Cpath d='M28 0L56 16v32L28 64 0 48V16z'/%3E%3Cpath d='M28 65l28 16v32L28 129 0 113V81z'/%3E%3C/g%3E%3C/svg%3E");
  --hexcell-dark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='97' viewBox='0 0 56 97'%3E%3Cg fill='none' stroke='%232BC896' stroke-opacity='.13' stroke-width='1.1'%3E%3Cpath d='M28 0L56 16v32L28 64 0 48V16z'/%3E%3Cpath d='M28 65l28 16v32L28 129 0 113V81z'/%3E%3C/g%3E%3C/svg%3E");

  /* طبقات صخرية */
  --strata: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='14' viewBox='0 0 120 14'%3E%3Cg fill='none' stroke-linecap='round' stroke-width='2.4'%3E%3Cpath d='M2 4h30' stroke='%2300A878'/%3E%3Cpath d='M38 4h26' stroke='%231FB6C9'/%3E%3Cpath d='M70 4h48' stroke='%23E2803A'/%3E%3Cpath d='M2 10h44' stroke='%23E2803A' stroke-opacity='.5'/%3E%3Cpath d='M52 10h66' stroke='%2300A878' stroke-opacity='.5'/%3E%3C/g%3E%3C/svg%3E");
  --strata-dark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='14' viewBox='0 0 120 14'%3E%3Cg fill='none' stroke-linecap='round' stroke-width='2.4'%3E%3Cpath d='M2 4h30' stroke='%232BC896'/%3E%3Cpath d='M38 4h26' stroke='%2357D2E0'/%3E%3Cpath d='M70 4h48' stroke='%23F0A063'/%3E%3Cpath d='M2 10h44' stroke='%23F0A063' stroke-opacity='.5'/%3E%3Cpath d='M52 10h66' stroke='%232BC896' stroke-opacity='.5'/%3E%3C/g%3E%3C/svg%3E");

  /* خطوط كنتور طبوغرافية */
  --contour: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220' viewBox='0 0 220 220'%3E%3Cg fill='none' stroke='%230A6B52' stroke-opacity='.07' stroke-width='1.2'%3E%3Cpath d='M110 20c50 0 90 40 90 90s-40 90-90 90-90-40-90-90 40-90 90-90z'/%3E%3Cpath d='M110 44c36 0 66 30 66 66s-30 66-66 66-66-30-66-66 30-66 66-66z'/%3E%3Cpath d='M110 68c23 0 42 19 42 42s-19 42-42 42-42-19-42-42 19-42 42-42z'/%3E%3Cpath d='M110 94c9 0 16 7 16 16s-7 16-16 16-16-7-16-16 7-16 16-16z'/%3E%3C/g%3E%3C/svg%3E");
  --contour-dark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220' viewBox='0 0 220 220'%3E%3Cg fill='none' stroke='%232BC896' stroke-opacity='.08' stroke-width='1.2'%3E%3Cpath d='M110 20c50 0 90 40 90 90s-40 90-90 90-90-40-90-90 40-90 90-90z'/%3E%3Cpath d='M110 44c36 0 66 30 66 66s-30 66-66 66-66-30-66-66 30-66 66-66z'/%3E%3Cpath d='M110 68c23 0 42 19 42 42s-19 42-42 42-42-19-42-42 19-42 42-42z'/%3E%3Cpath d='M110 94c9 0 16 7 16 16s-7 16-16 16-16-7-16-16 7-16 16-16z'/%3E%3C/g%3E%3C/svg%3E");

  /* حلزون DNA */
  --helix: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='120' viewBox='0 0 40 120'%3E%3Cg fill='none' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M8 0c24 15 24 45 0 60S8 105 8 120' stroke='%2300A878' stroke-opacity='.5'/%3E%3Cpath d='M32 0C8 15 8 45 32 60s24 45 0 60' stroke='%231FB6C9' stroke-opacity='.5'/%3E%3Cg stroke='%23E2803A' stroke-opacity='.4'%3E%3Cpath d='M12 12h16M9 30h22M12 48h16M12 72h16M9 90h22M12 108h16'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");

  --leaf-dot: var(--hexcell);
  --greek-key: var(--strata);
  --greek-key-dark: var(--strata-dark);

  color-scheme: light;
}

/* ═══════════════════════════════════════════════════════════════
   الوضع الداكن — قاع سحيق مضيء
   ═══════════════════════════════════════════════════════════════ */
html[data-theme="dark"] {
  --life-950: #02100D;
  --life-900: #041C17;
  --life-800: #6FE0BC;
  --life-700: #2BC896;
  --life-600: #00A878;
  --life-500: #2BC896;
  --life-400: #6FE0BC;
  --life-300: #AFF0DC;

  --brand-950: #02100D;
  --brand-900: #041C17;
  --brand-800: #DCFAF0;
  --brand-700: #6FE0BC;
  --brand-600: #2BC896;
  --brand-500: #2BC896;
  --brand-400: #6FE0BC;
  --brand-300: #AFF0DC;
  --brand-100: rgba(43, 200, 150, 0.16);
  --brand-50:  rgba(43, 200, 150, 0.08);

  --gold-700: #F8C89B;
  --gold-600: #F0A063;
  --gold-500: #E2803A;
  --gold-400: #F0A063;
  --gold-300: #FDEDDD;
  --gold-soft: rgba(240, 160, 99, 0.16);

  --brand: #DCFAF0;
  --accent: #2BC896;
  --accent-soft: rgba(43, 200, 150, 0.16);
  --accent-violet: #57D2E0;
  --accent-cyan: #57D2E0;
  --accent-amber: #F0A063;
  --accent-green: #2BC896;
  --accent-gold: #F0A063;

  --insight: #2BC896;
  --insight-strong: #6FE0BC;
  --insight-soft: rgba(43, 200, 150, 0.15);

  --sky: #57D2E0;
  --sky-soft: rgba(87, 210, 224, 0.15);
  --earth: #F0A063;
  --earth-soft: rgba(240, 160, 99, 0.15);

  --page-bg: #04130F;
  --page-bg-alt: #07211B;
  --card-bg: #0A2A22;
  --card: #0A2A22;
  --card-bg-strong: #0D332A;
  --card-soft: #061B16;
  --ink-plate: #02100D;

  --surface-soft: rgba(220, 250, 240, 0.05);
  --surface-strong: rgba(220, 250, 240, 0.10);
  --surface-highlight: rgba(43, 200, 150, 0.13);
  --surface-highlight-strong: rgba(43, 200, 150, 0.24);
  --glass: rgba(10, 42, 34, 0.72);
  --glass-border: rgba(111, 224, 188, 0.16);

  --text: #F3FBF8;
  --text-strong: #FFFFFF;
  --muted: #C9E4DA;
  --muted-strong: #DDF1E8;
  --on-dark: #FFFFFF;

  --border: rgba(150, 220, 200, 0.14);
  --border-strong: rgba(43, 200, 150, 0.34);
  --brand-border: rgba(43, 200, 150, 0.35);
  --gold-border: rgba(240, 160, 99, 0.38);

  --shadow-soft: 0 2px 12px rgba(0, 0, 0, 0.4);
  --shadow: 0 6px 24px rgba(0, 0, 0, 0.5);
  --shadow-strong: 0 24px 64px rgba(0, 0, 0, 0.65);
  --shadow-gold: 0 12px 32px -12px rgba(240, 160, 99, 0.4);
  --glow-life: 0 0 0 1px rgba(43, 200, 150, 0.3), 0 14px 44px -16px rgba(43, 200, 150, 0.55);
  --glow-earth: 0 0 0 1px rgba(240, 160, 99, 0.3), 0 14px 44px -16px rgba(240, 160, 99, 0.5);

  --primary: #2BC896;
  --primary-strong: #6FE0BC;
  --primary-weak: rgba(43, 200, 150, 0.16);

  --field-bg: #06201A;
  --field-text: #F3FBF8;
  --field-border: rgba(150, 220, 200, 0.2);
  --field-focus: #2BC896;

  --btn-solid-bg: linear-gradient(135deg, #068B67 0%, #00A878 50%, #2BC896 100%);
  --btn-solid-text: #02100D;
  --btn-gold-bg: linear-gradient(135deg, #C96A2C 0%, #E2803A 50%, #F0A063 100%);
  --btn-gold-text: #1B0C04;

  --success: #2BC896;
  --danger: #F0705C;
  --warning: #F0A063;
  --btn-success-bg: linear-gradient(135deg, #068B67, #2BC896);
  --btn-success-text: #02100D;
  --success-soft-bg: rgba(43, 200, 150, 0.14);
  --success-soft-border: rgba(43, 200, 150, 0.4);
  --danger-soft-bg: rgba(240, 112, 92, 0.14);
  --danger-soft-border: rgba(240, 112, 92, 0.4);
  --warning-soft-bg: rgba(240, 160, 99, 0.14);
  --warning-soft-border: rgba(240, 160, 99, 0.4);

  --hdr-bg: rgba(7, 33, 27, 0.85);
  --hdr-text: #F0FCF7;
  --hdr-border: rgba(111, 224, 188, 0.16);

  --grid-line: rgba(220, 250, 240, 0.05);
  --page-glow-1: rgba(0, 168, 120, 0.22);
  --page-glow-2: rgba(31, 182, 201, 0.16);
  --page-glow-3: rgba(226, 128, 58, 0.12);

  --grad-brand: linear-gradient(135deg, #068B67, #2BC896 60%, #6FE0BC);
  --grad-gold: linear-gradient(135deg, #A85527, #E2803A 60%, #F0A063);
  --grad-aqua: linear-gradient(135deg, #10707F, #57D2E0);
  --grad-spectrum: linear-gradient(90deg, #2BC896 0%, #57D2E0 50%, #F0A063 100%);
  --grad-hero: linear-gradient(165deg, #04130F 0%, #07211B 50%, #06232A 100%);
  --grad-plate: linear-gradient(160deg, #04130F 0%, #07211B 100%);

  --sw-bg: #0A6B52;
  --sw-knob: #6FE0BC;

  --hexcell: var(--hexcell-dark);
  --strata: var(--strata-dark);
  --contour: var(--contour-dark);
  --leaf-dot: var(--hexcell-dark);
  --greek-key: var(--strata-dark);

  color-scheme: dark;
}

/* ═══════════════════════════════════════════════════════════════
   الأساس
   ═══════════════════════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

body {
  font-family: var(--font-body);
  color: var(--text);
  background: var(--page-bg);
  overflow-x: hidden;
  margin: 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.75;
  letter-spacing: 0;
}

/* خلفية الصفحة — شبكة خلايا + توهج حيوي */
body.legend-platform,
body.arabic-platform {
  background:
    radial-gradient(ellipse 60% 45% at 100% -5%, var(--page-glow-1), transparent 60%),
    radial-gradient(ellipse 50% 40% at -5% 20%, var(--page-glow-2), transparent 55%),
    radial-gradient(ellipse 45% 35% at 50% 105%, var(--page-glow-3), transparent 60%),
    var(--hexcell) 0 0 / 56px 97px,
    var(--page-bg);
}

body.legend-platform::before,
body.legend-platform::after,
body.arabic-platform::before,
body.arabic-platform::after {
  content: none !important;
  display: none !important;
}

.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 22px;
  position: relative;
  z-index: 1;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  letter-spacing: -0.01em;
  line-height: 1.3;
  margin: 0;
  color: var(--text-strong);
  font-weight: 800;
}

a { color: var(--life-700); text-decoration: none; }
html[data-theme="dark"] a { color: var(--life-400); }

::selection { background: var(--life-500); color: #FFFFFF; }

img { max-width: 100%; }

:focus-visible {
  outline: 2px solid var(--life-500);
  outline-offset: 3px;
  border-radius: 6px;
}

/* أرقام لاتينية بخط الأدوات */
.num, .lg-stat__val, .acc-stat__val {
  font-family: var(--font-mono);
  font-feature-settings: "tnum" 1;
}

.platform-logo__img--light { display: block; }
.platform-logo__img--dark { display: none; }
html[data-theme="dark"] .platform-logo__img--light { display: none; }
html[data-theme="dark"] .platform-logo__img--dark { display: block; }

/* ═══════════════════════════════════════════════════════════════
   عناصر مشتركة — الفاصل الطبقي وكبسولات الأيقونات
   ═══════════════════════════════════════════════════════════════ */
.lg-meander,
.lg-section__rule {
  display: block;
  width: 132px;
  height: 14px;
  margin: 18px auto 0;
  background-image: var(--strata);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 120px 14px;
  border: 0 !important;
  border-radius: 0 !important;
  opacity: .9;
}

/* كبسولة أيقونة سداسية — بصمة الهوية */
.omar-mark,
.lg-guide__icon,
.acc-companion__icon,
.lg-hdr__companionMark {
  display: grid;
  place-items: center;
  background: var(--insight-soft);
  color: var(--insight-strong);
  border-radius: 30% / 22%;
  clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);
}

.omar-hex {
  clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);
}

/* شريط طيفي رفيع — يعلو البطاقات المهمة */
.omar-spectrum-top {
  position: relative;
  overflow: hidden;
}
.omar-spectrum-top::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 3px;
  background: var(--grad-spectrum);
  z-index: 3;
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}