/* ============================================================
   LeaderMas — القشرة الموحّدة لكل الألعاب (الهيدر + الأساسيات)
   هذا الملف ثابت ولا يتغيّر بين لعبة وأخرى.
   ألوان البراند: كحلي #04133a | أزرق #1a6bff | ذهبي #f5b53d
   ============================================================ */

:root{
  /* ألوان البراند الثابتة (الهيدر) */
  --lm-navy: #04133a;
  --lm-navy-2: #0a2558;
  --lm-blue: #1a6bff;
  --lm-gold: #f5b53d;
  --lm-blue-soft: #93c5fd;

  /* متغيرات الثيم — كل لعبة تعيد تعريفها لتلوين نفسها */
  --game-bg: #eef2fa;
  --game-accent: #1a6bff;
  --game-accent-2: #f5b53d;
  --game-ink: #14213d;
  --game-card: #ffffff;
}

*{ box-sizing: border-box; margin: 0; padding: 0; }

html, body{ height: 100%; }

body{
  font-family: 'Readex Pro', system-ui, 'Segoe UI', Tahoma, sans-serif;
  direction: rtl;
  background: var(--game-bg);
  color: var(--game-ink);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* ====================== الهيدر الموحّد ====================== */
.lm-header{
  background: var(--lm-navy);
  color: #fff;
  padding: 12px clamp(14px, 4vw, 32px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  box-shadow: 0 4px 24px rgba(4,19,58,.28);
  position: sticky;
  top: 0;
  z-index: 1000;
}
.lm-brand{ display: flex; align-items: center; gap: 11px; min-width: 0; }
.lm-brand img{ width: 42px; height: 42px; object-fit: contain; flex-shrink: 0; }
.lm-brand .lm-name{
  font-family: 'El Messiri', sans-serif;
  font-size: 17px; font-weight: 700; line-height: 1.05; color: #fff;
}
.lm-brand .lm-author{ font-size: 11px; color: rgba(255,255,255,.55); font-weight: 500; }

.lm-crumbs{ display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.lm-pill{
  font-size: 11px; font-weight: 700; padding: 5px 12px; border-radius: 20px;
  white-space: nowrap;
}
.lm-pill.course{ background: rgba(26,107,255,.25); color: var(--lm-blue-soft); }
.lm-pill.section{ background: rgba(255,255,255,.10); color: rgba(255,255,255,.75); font-weight: 600; }
.lm-sep{ color: rgba(255,255,255,.3); font-size: 12px; }

.lm-back{
  display: inline-flex; align-items: center; gap: 7px;
  background: var(--lm-gold); color: #1a0e00;
  font-family: 'Readex Pro', sans-serif; font-size: 13px; font-weight: 800;
  padding: 9px 16px; border-radius: 9px; text-decoration: none;
  border: none; cursor: pointer; transition: transform .15s ease, filter .15s ease;
}
.lm-back:hover{ transform: translateY(-1px); filter: brightness(1.05); }
.lm-back svg{ width: 15px; height: 15px; }

/* شريط ذهبي/أزرق رفيع تحت الهيدر */
.lm-rule{ height: 3px; background: linear-gradient(90deg, var(--lm-blue), var(--lm-gold), transparent); }

/* ====================== منطقة اللعبة ====================== */
.lm-stage{
  flex: 1;
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
  padding: clamp(16px, 4vw, 34px);
}

/* ====================== الفوتر الموحّد ====================== */
.lm-footer{
  text-align: center;
  padding: 16px;
  font-size: 12px;
  color: rgba(4,19,58,.55);
  background: transparent;
}
.lm-footer a{ color: var(--lm-blue); text-decoration: none; font-weight: 700; }

/* ====================== أدوات مشتركة ====================== */
.lm-btn{
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-family: 'Readex Pro', sans-serif; font-weight: 800; font-size: 15px;
  padding: 13px 26px; border-radius: 12px; border: none; cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.lm-btn:active{ transform: translateY(1px); }
.lm-btn-primary{ background: var(--lm-navy); color: #fff; }
.lm-btn-primary:hover{ filter: brightness(1.12); box-shadow: 0 8px 22px rgba(4,19,58,.25); }
.lm-btn-gold{ background: var(--lm-gold); color: #1a0e00; }
.lm-btn-gold:hover{ filter: brightness(1.05); box-shadow: 0 8px 22px rgba(245,181,61,.4); }
.lm-btn-ghost{ background: #fff; color: var(--lm-navy); border: 2px solid #d8e0f0; }
.lm-btn-ghost:hover{ border-color: var(--lm-blue); }
.lm-btn:disabled{ opacity: .5; cursor: not-allowed; transform: none; }

/* عنوان شعار El Messiri السريع */
.lm-display{ font-family: 'El Messiri', sans-serif; }

@media (max-width: 560px){
  .lm-brand .lm-author{ display: none; }
  .lm-crumbs .lm-pill.course{ display: none; } /* نُبقي اسم القسم فقط على الموبايل */
}