/* ═══════════════════════════════════════════════════════════════
   GQ Exam Pro — Student Surfaces v5
   شاشات الطالب: النتيجة · الأرشيف · بنك الأقسام · لوحة الطالب ·
   التقدّم · الفلاش كارد · دروس القراءة · الإشعارات.

   يعتمد على gqep-tokens.css.
   الجذر .gqep-v5-page يرفع الترجيح فوق exam.css القديم،
   وأسماء الكلاسات الأصلية محفوظة فلم يُمسّ أي هوك في JS/PHP.

   القاعدة الحاكمة: التصميم الأصلي 360×640. كل شبكة تبدأ بعمود واحد.
   ═══════════════════════════════════════════════════════════════ */

.gqep-v5-page,
.gqep-v5-page *,
.gqep-v5-page *::before,
.gqep-v5-page *::after{box-sizing:border-box}

.gqep-v5-page{
  font-family:var(--gqep-font);
  background:var(--gqep-bg);
  color:var(--gqep-tx);
  -webkit-font-smoothing:antialiased;
}
.gqep-v5-page button{font-family:inherit}

/* ── لبنات مشتركة ───────────────────────────────────────────── */
.gqep-v5-page .gqep-box{
  background:transparent;
  color:var(--gqep-tx);
  min-height:auto;
}

/* بطاقة قياسية */
.gqep-v5-page .gqep-stat-card,
.gqep-v5-page .gqep-exam-card,
.gqep-v5-page .gqep-section-card,
.gqep-v5-page .gqep-dpanel,
.gqep-v5-page .gqep-notification-card,
.gqep-v5-page .gqep-reading-card,
.gqep-v5-page .gqep-eval-box,
.gqep-v5-page .gqep-result-hero{
  background:var(--gqep-sf);
  border:1px solid var(--gqep-bd);
  border-radius:var(--gqep-r-lg);
  box-shadow:none;
}

/* ═══════════════ القسم البطولي ═══════════════
   عند المصمم: خلفية شفّافة تماماً ونص داكن على خلفية الصفحة.
   لا بلوك ملوّن ولا تدرّج — أي تدرّج بدرجات الأساسي ينقلب
   إلى بلوك فاتح في الوضع الداكن لأن السُّلَّم يُعكَس.
─────────────────────────────────────────────────── */
.gqep-v5-page .gqep-student-hero,
.gqep-v5-page .gqep-progress-hero,
.gqep-v5-page .gqep-dashboard-hero{
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:18px 2px 4px;
  margin:0 0 8px;
  background:transparent;
  border:0;
  border-radius:0;
  color:var(--gqep-tx);
  box-shadow:none;
}
.gqep-v5-page .gqep-student-hero-kicker{
  display:inline-block;
  padding:0;
  background:transparent;
  border-radius:0;
  font-size:var(--gqep-fs-caption);
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--gqep-tx3);
}
.gqep-v5-page .gqep-student-hero h1,
.gqep-v5-page .gqep-archive-title{
  margin:8px 0 6px;
  font-size:32px;
  font-weight:700;
  line-height:var(--gqep-lh-h1);
  color:var(--gqep-tx);
}
.gqep-v5-page .gqep-archive-sub,
.gqep-v5-page .gqep-student-hero p{
  margin:0;
  font-size:var(--gqep-fs-body-m);
  line-height:var(--gqep-lh-body-m);
  color:var(--gqep-tx2);
}
/* بطاقة المستخدم — بطاقة سطح عادية، لا زجاج على تدرّج */
.gqep-v5-page .gqep-dashboard-usercard{
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:16px;
  background:var(--gqep-sf);
  border:1px solid var(--gqep-bd);
  border-radius:var(--gqep-r-lg);
}
.gqep-v5-page .gqep-dashboard-avatar,
.gqep-v5-page .gqep-dashboard-avatar-placeholder{
  inline-size:48px;block-size:48px;border-radius:var(--gqep-r-full);
  object-fit:cover;display:grid;place-items:center;
  background:var(--gqep-p50);color:var(--gqep-p700);font-weight:700;font-size:18px;
}
.gqep-v5-page .gqep-dashboard-name{font-size:var(--gqep-fs-h3);font-weight:600;color:var(--gqep-tx)}
.gqep-v5-page .gqep-dashboard-email{font-size:var(--gqep-fs-body-s);color:var(--gqep-tx2)}
.gqep-v5-page .gqep-student-hero-actions{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.gqep-v5-page .gqep-student-cta,
.gqep-v5-page .gqep-student-cta-secondary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-block-size:var(--gqep-tap-min);
  padding:0 18px;
  border-radius:var(--gqep-r-md);
  font-size:var(--gqep-fs-body-m);
  font-weight:600;
  text-decoration:none;
}
.gqep-v5-page .gqep-student-cta{background:var(--gqep-p500);color:var(--gqep-on-primary);border:0}
.gqep-v5-page .gqep-student-cta:hover{background:var(--gqep-p600);color:var(--gqep-on-primary)}
.gqep-v5-page .gqep-student-cta-secondary{background:var(--gqep-sf);color:var(--gqep-tx2);border:1px solid var(--gqep-bd2)}

/* ═══════════════ تبويبات التصفية ═══════════════
   شريط رقاقات أفقي متمرّر — لا يلتفّ إلى صفوف على الجوال.
─────────────────────────────────────────────────── */
.gqep-v5-page .gqep-archive-tabs,
.gqep-v5-page .gqep-dashboard-tabs,
.gqep-v5-page .gqep-notification-filter,
.gqep-v5-page .gqep-fc-level-tabs,
.gqep-v5-page .gqep-fc-mode-tabs,
.gqep-v5-page .gqep-reading-library-tabs{
  display:flex;
  flex-wrap:nowrap;
  gap:var(--gqep-tap-gap);
  padding:2px 0;
  margin:0 0 16px;
  overflow-x:auto;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}
.gqep-v5-page .gqep-archive-tabs::-webkit-scrollbar,
.gqep-v5-page .gqep-dashboard-tabs::-webkit-scrollbar,
.gqep-v5-page .gqep-notification-filter::-webkit-scrollbar,
.gqep-v5-page .gqep-fc-level-tabs::-webkit-scrollbar,
.gqep-v5-page .gqep-fc-mode-tabs::-webkit-scrollbar,
.gqep-v5-page .gqep-reading-library-tabs::-webkit-scrollbar{display:none}

.gqep-v5-page .gqep-archive-tab,
.gqep-v5-page .gqep-dtab,
.gqep-v5-page .gqep-fc-level-btn,
.gqep-v5-page .gqep-fc-mode-btn,
.gqep-v5-page .gqep-reading-library-tab,
.gqep-v5-page .gqep-reading-level-btn{
  flex:none;
  display:inline-flex;
  align-items:center;
  min-block-size:var(--gqep-tap-min);
  padding:10px 16px;
  background:var(--gqep-sf);
  border:1px solid var(--gqep-bd);
  border-radius:var(--gqep-r-full);
  font-size:13.5px;
  font-weight:600;
  color:var(--gqep-tx2);
  white-space:nowrap;
  cursor:pointer;
}
.gqep-v5-page .gqep-archive-tab.active,
.gqep-v5-page .gqep-dtab.active,
.gqep-v5-page .gqep-fc-level-btn.active,
.gqep-v5-page .gqep-fc-mode-btn.active,
.gqep-v5-page .gqep-reading-library-tab.active,
.gqep-v5-page .gqep-reading-level-btn.active{
  background:var(--gqep-p500);
  border-color:var(--gqep-p500);
  color:var(--gqep-on-primary);
}

/* ═══════════════ الأرشيف وبنك الأقسام ═══════════════ */
.gqep-v5-page.gqep-archive-wrap,
.gqep-v5-page .gqep-archive-wrap{
  max-inline-size:1180px;
  margin-inline:auto;
  padding:12px 14px 60px;
}
/* ترويسة المستوى — صفّ نصّي بسيط بلا خلفية ولا شريط جانبي */
.gqep-v5-page .gqep-archive-level-header{
  display:flex;
  align-items:center;
  gap:10px;
  margin:22px 0 12px;
  padding:0;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
}
.gqep-v5-page .gqep-archive-level-badge{
  padding:0;
  background:transparent!important;
  border-radius:0;
  font-size:13.5px;
  font-weight:600;
  color:var(--gqep-tx);
}
.gqep-v5-page .gqep-archive-level-count{
  font-size:12px;
  font-weight:400;
  color:var(--gqep-tx3);
}
.gqep-v5-page .gqep-archive-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
}
.gqep-v5-page .gqep-exam-card{
  display:flex;
  flex-direction:column;
  overflow:hidden;
  padding:0;
  transition:border-color var(--gqep-dur-fast) var(--gqep-ease),
             transform var(--gqep-dur-fast) var(--gqep-ease);
}
.gqep-v5-page .gqep-exam-card:hover{border-color:var(--gqep-p300)}
.gqep-v5-page .gqep-exam-card-thumb{
  aspect-ratio:16/9;
  overflow:hidden;
  background:var(--gqep-sf2);
}
.gqep-v5-page .gqep-exam-card-thumb img{
  inline-size:100%;block-size:100%;object-fit:cover;display:block;
}
.gqep-v5-page .gqep-exam-card-body{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:16px;
}
.gqep-v5-page .gqep-exam-card-meta{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.gqep-v5-page .gqep-exam-card-level,
.gqep-v5-page .gqep-exam-card-tag{
  padding:3px 10px;
  border-radius:var(--gqep-r-full);
  font-size:var(--gqep-fs-caption);
  font-weight:700;
  background:var(--gqep-sf2);
  color:var(--gqep-tx2);
  border:0;
}
.gqep-v5-page .gqep-exam-card-title{
  margin:0;
  font-size:var(--gqep-fs-h3);
  font-weight:var(--gqep-fw-h3);
  line-height:var(--gqep-lh-h3);
}
.gqep-v5-page .gqep-exam-card-title a{color:var(--gqep-tx);text-decoration:none}
.gqep-v5-page .gqep-exam-card-title a:hover{color:var(--gqep-p600)}
.gqep-v5-page .gqep-exam-card-stats{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:8px;
  padding:12px 0 0;
  border-block-start:1px solid var(--gqep-bd);
}
.gqep-v5-page .gqep-exam-stat{display:flex;flex-direction:column;gap:2px}
.gqep-v5-page .gqep-exam-stat-val{
  font-size:var(--gqep-fs-h3);
  font-weight:700;
  color:var(--gqep-tx);
  font-variant-numeric:tabular-nums;
}
.gqep-v5-page .gqep-exam-stat.pass .gqep-exam-stat-val{color:var(--gqep-ok-text)}
.gqep-v5-page .gqep-exam-stat.fail .gqep-exam-stat-val{color:var(--gqep-err-text)}
.gqep-v5-page .gqep-exam-stat-lbl{font-size:var(--gqep-fs-caption);color:var(--gqep-tx3)}
.gqep-v5-page .gqep-exam-card-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  min-block-size:46px;
  margin-block-start:4px;
  padding:12px;
  background:var(--gqep-p500);
  border:0;
  border-radius:var(--gqep-r-md);
  font-size:14px;
  font-weight:600;
  color:var(--gqep-on-primary)!important;
  text-decoration:none;
}
.gqep-v5-page .gqep-exam-card-btn:hover{background:var(--gqep-p600);text-decoration:none}
.gqep-v5-page .gqep-exam-card.is-locked{opacity:1;background:var(--gqep-sf2)}
.gqep-v5-page .gqep-exam-card.is-locked .gqep-exam-card-btn{background:var(--gqep-bd2);color:var(--gqep-tx2)!important}
.gqep-v5-page .gqep-archive-empty{
  display:flex;flex-direction:column;align-items:center;gap:10px;
  padding:56px 20px;text-align:center;color:var(--gqep-tx2);
}

@media (min-width:640px){
  .gqep-v5-page .gqep-archive-grid{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:1024px){
  .gqep-v5-page .gqep-archive-grid{grid-template-columns:repeat(3,1fr)}
}

/* ═══════════════ لوحة الطالب ═══════════════ */
.gqep-v5-page .gqep-dashboard{
  max-inline-size:1180px;
  margin-inline:auto;
  padding:12px 14px 60px;
}
.gqep-v5-page .gqep-dashboard-stats{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
  margin:0 0 18px;
}
.gqep-v5-page .gqep-stat-card{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:16px;
}
.gqep-v5-page .gqep-stat-label{
  font-size:var(--gqep-fs-body-s);
  color:var(--gqep-tx2);
}
.gqep-v5-page .gqep-stat-num{
  font-size:28px;
  font-weight:700;
  line-height:1.1;
  color:var(--gqep-tx);
  font-variant-numeric:tabular-nums;
}
.gqep-v5-page .gqep-dpanel{padding:0;overflow:hidden}
.gqep-v5-page .gqep-results-list,
.gqep-v5-page .gqep-speaking-list{display:flex;flex-direction:column}

/* صفّ نتيجة — بطاقة رأسية على الجوال، لا صفّ أفقي مضغوط */
.gqep-v5-page .gqep-result-row,
.gqep-v5-page .gqep-speaking-row{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:10px;
  padding:16px;
  border-block-end:1px solid var(--gqep-bd);
}
.gqep-v5-page .gqep-result-row:last-child,
.gqep-v5-page .gqep-speaking-row:last-child{border-block-end:0}
.gqep-v5-page .gqep-result-row-left,
.gqep-v5-page .gqep-speaking-row-info{
  display:flex;flex-direction:column;gap:6px;min-inline-size:0;
}
.gqep-v5-page .gqep-result-row-right,
.gqep-v5-page .gqep-speaking-row-actions{
  display:flex;align-items:center;justify-content:flex-start;gap:10px;flex-wrap:wrap;
}
.gqep-v5-page .gqep-result-exam-title{
  font-size:var(--gqep-fs-body-m);
  font-weight:600;
  color:var(--gqep-tx);
}
.gqep-v5-page .gqep-result-level-badge{
  align-self:flex-start;
  padding:2px 10px;
  background:var(--gqep-p50);
  border-radius:var(--gqep-r-full);
  font-size:var(--gqep-fs-caption);
  font-weight:700;
  color:var(--gqep-p700);
}
.gqep-v5-page .gqep-result-date,
.gqep-v5-page .gqep-speaking-date{font-size:var(--gqep-fs-body-s);color:var(--gqep-tx3)}
.gqep-v5-page .gqep-result-score-big{
  font-size:22px;font-weight:700;color:var(--gqep-tx);font-variant-numeric:tabular-nums;
}
.gqep-v5-page .gqep-result-score-detail{font-size:var(--gqep-fs-body-s);color:var(--gqep-tx2)}
.gqep-v5-page .gqep-result-btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-block-size:var(--gqep-tap-min);
  padding:0 14px;
  background:var(--gqep-sf2);
  border:1px solid var(--gqep-bd2);
  border-radius:var(--gqep-r-md);
  font-size:var(--gqep-fs-body-s);
  font-weight:600;
  color:var(--gqep-tx2)!important;
  text-decoration:none;
}
.gqep-v5-page .gqep-result-btn:hover{background:var(--gqep-sf3);text-decoration:none}
.gqep-v5-page .gqep-dashboard-empty{
  display:flex;flex-direction:column;align-items:center;gap:10px;
  padding:44px 20px;text-align:center;color:var(--gqep-tx2);
}
@media (min-width:768px){
  .gqep-v5-page .gqep-dashboard-stats{grid-template-columns:repeat(4,1fr)}
  .gqep-v5-page .gqep-result-row,
  .gqep-v5-page .gqep-speaking-row{flex-direction:row;align-items:center;justify-content:space-between}
  .gqep-v5-page .gqep-result-row-right{justify-content:flex-end}
}

/* ═══════════════ التقدّم ═══════════════ */
.gqep-v5-page .gqep-prog-app,
.gqep-v5-page .gqep-progress-page{
  max-inline-size:1180px;
  margin-inline:auto;
  padding:12px 14px 60px;
  background:transparent;
}
.gqep-v5-page .gqep-kpi-row{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
  margin:0 0 16px;
}
.gqep-v5-page .gqep-chart-history,
.gqep-v5-page .gqep-chart-levels,
.gqep-v5-page .gqep-weakness-bars,
.gqep-v5-page .gqep-history-table{
  padding:16px;
  margin:0 0 16px;
  background:var(--gqep-sf);
  border:1px solid var(--gqep-bd);
  border-radius:var(--gqep-r-lg);
  overflow-x:auto;
}
.gqep-v5-page .gqep-prog-loading,
.gqep-v5-page .gqep-prog-empty,
.gqep-v5-page .gqep-no-filter{
  padding:40px 20px;text-align:center;color:var(--gqep-tx2);
}
.gqep-v5-page .gqep-filter-level,
.gqep-v5-page .gqep-filter-result{
  min-block-size:var(--gqep-tap-min);
  padding:0 14px;
  background:var(--gqep-sf);
  border:1px solid var(--gqep-bd2);
  border-radius:var(--gqep-r-md);
  font-family:inherit;
  font-size:var(--gqep-fs-body-s);
  color:var(--gqep-tx);
}
@media (min-width:768px){
  .gqep-v5-page .gqep-kpi-row{grid-template-columns:repeat(4,1fr)}
}

/* ═══════════════ الإشعارات ═══════════════ */
.gqep-v5-page .gqep-notification-center{
  max-inline-size:900px;
  margin-inline:auto;
  padding:12px 14px 60px;
}
/* الهيدر القديم لهذه الشاشة مطبوع كـ <style> داخل PHP بألوان ثابتة.
   نتجاوزه بالتوكينات هنا بدل تعديل الـ PHP، فيبقى مصدر واحد للتصميم. */
.gqep-v5-page.gqep-notification-center{
  max-inline-size:900px;
  margin:0 auto;
  padding:12px 14px 60px;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
}
.gqep-v5-page .gqep-notification-center__hero{
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:22px 18px;
  margin:0 0 18px;
  background:linear-gradient(150deg,var(--gqep-p700),var(--gqep-p500));
  border:0;
  border-radius:var(--gqep-r-xl);
}
.gqep-v5-page .gqep-notification-center__hero h1{
  margin:0;
  font-size:var(--gqep-fs-h1);
  font-weight:var(--gqep-fw-h1);
  line-height:var(--gqep-lh-h1);
  color:#fff;
}
.gqep-v5-page .gqep-notification-center__hero p{
  margin:0;
  font-size:var(--gqep-fs-body-m);
  line-height:var(--gqep-lh-body-m);
  color:rgba(255,255,255,.86);
}
.gqep-v5-page .gqep-notification-center__kicker{
  align-self:flex-start;
  padding:3px 10px;
  background:rgba(255,255,255,.16);
  border-radius:var(--gqep-r-full);
  font-size:var(--gqep-fs-caption);
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#fff;
}

.gqep-v5-page .gqep-notification-card{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:16px;
  margin-block-end:10px;
}
.gqep-v5-page .gqep-notification-card.is-unread{
  border-inline-start:3px solid var(--gqep-p500);
}
.gqep-v5-page .gqep-notification-badge{
  align-self:flex-start;
  padding:2px 8px;
  background:var(--gqep-p50);
  border-radius:var(--gqep-r-full);
  font-size:var(--gqep-fs-caption);
  font-weight:700;
  color:var(--gqep-p700);
}
.gqep-v5-page .gqep-notification-meta{font-size:var(--gqep-fs-body-s);color:var(--gqep-tx3)}
.gqep-v5-page .gqep-channel-cards{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  margin:0 0 18px;
}
/* ── مصفوفة التفضيلات ──
   الجدول ممنوع على الجوال: يفرض تمريراً أفقياً ويكسر القراءة.
   يتحوّل إلى بطاقة لكل نوع إشعار وقنواته صفوف داخلها.
─────────────────────────────────────────────────── */
.gqep-v5-page .gqep-notification-matrix-wrap,
.gqep-v5-page #gqep-preference-matrix-wrap{
  overflow:visible;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
}
.gqep-v5-page .gqep-notification-table{
  inline-size:100%;
  min-inline-size:0;      /* القديم كان 980px فيفرض تمريراً أفقياً */
  border-collapse:collapse;
}
.gqep-v5-page .gqep-notification-table thead th{
  position:static;
  background:var(--gqep-sf2);
  color:var(--gqep-tx2);
  font-size:var(--gqep-fs-body-s);
}
.gqep-v5-page .gqep-notification-table th,
.gqep-v5-page .gqep-notification-table td{
  border-block-end:1px solid var(--gqep-bd);
}
.gqep-v5-page .gqep-notification-table__event-title{
  font-size:var(--gqep-fs-body-m);font-weight:700;color:var(--gqep-tx);
}
.gqep-v5-page .gqep-notification-table__event-desc{
  margin-block-start:6px;font-size:var(--gqep-fs-body-s);
  line-height:var(--gqep-lh-body-s);color:var(--gqep-tx2);
}
@media (max-width:767px){
  .gqep-v5-page .gqep-notification-table__event{min-inline-size:0!important;text-align:start!important}
  .gqep-v5-page .gqep-notification-table,
  .gqep-v5-page .gqep-notification-table tbody,
  .gqep-v5-page .gqep-notification-table tr,
  .gqep-v5-page .gqep-notification-table td{display:block;inline-size:100%}
  .gqep-v5-page .gqep-notification-table thead{display:none}
  .gqep-v5-page .gqep-notification-table tr{
    margin-block-end:10px;
    padding:14px;
    background:var(--gqep-sf);
    border:1px solid var(--gqep-bd);
    border-radius:var(--gqep-r-lg);
  }
  .gqep-v5-page .gqep-notification-table td{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    min-block-size:var(--gqep-tap-min);
    padding:6px 0;
    border:0;
  }
  .gqep-v5-page .gqep-notification-table td::before{
    content:attr(data-label);
    font-size:var(--gqep-fs-body-s);
    color:var(--gqep-tx2);
  }
  .gqep-v5-page .gqep-notification-table td:first-child{
    font-weight:600;
    color:var(--gqep-tx);
    border-block-end:1px solid var(--gqep-bd);
    margin-block-end:6px;
  }
}
.gqep-v5-page .gqep-notification-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  inline-size:var(--gqep-tap-min);
  block-size:var(--gqep-tap-min);
}
.gqep-v5-page .gqep-notification-toggle input{
  inline-size:22px;
  block-size:22px;
  accent-color:var(--gqep-p500);
  cursor:pointer;
}
.gqep-v5-page .gqep-notification-flash{
  padding:12px 14px;
  margin:0 0 14px;
  background:var(--gqep-ok-bg);
  border-radius:var(--gqep-r-md);
  font-size:var(--gqep-fs-body-s);
  color:var(--gqep-ok-text);
}
@media (min-width:640px){
  .gqep-v5-page .gqep-channel-cards{grid-template-columns:repeat(2,1fr)}
}

/* ═══════════════ الفلاش كارد ═══════════════ */
.gqep-v5-page .gqep-fc-app{
  max-inline-size:640px;
  margin-inline:auto;
  padding:12px 14px 60px;
}
.gqep-v5-page .gqep-fc-progress-wrap{
  display:flex;align-items:center;gap:12px;margin:0 0 14px;
}
.gqep-v5-page .gqep-fc-progress-bar{
  flex:1;block-size:6px;background:var(--gqep-sf3);
  border-radius:var(--gqep-r-full);overflow:hidden;
}
.gqep-v5-page .gqep-fc-progress-fill,
.gqep-v5-page .gqep-fc-prog-fill{block-size:100%;background:var(--gqep-p500)}
.gqep-v5-page .gqep-fc-counter{
  font-size:var(--gqep-fs-body-s);font-weight:600;color:var(--gqep-tx2);
  font-variant-numeric:tabular-nums;
}
.gqep-v5-page .gqep-fc-card{
  background:var(--gqep-sf);
  border:1px solid var(--gqep-bd);
  border-radius:var(--gqep-r-xl);
  box-shadow:var(--gqep-sh2);
}
.gqep-v5-page .gqep-fc-word{
  font-size:30px;font-weight:700;line-height:1.2;color:var(--gqep-tx);
  direction:ltr;
}
.gqep-v5-page .gqep-fc-trans{font-size:var(--gqep-fs-h3);color:var(--gqep-tx)}
.gqep-v5-page .gqep-fc-example{
  font-size:var(--gqep-fs-body-m);line-height:var(--gqep-lh-body-m);
  color:var(--gqep-tx2);direction:ltr;text-align:left;
}
.gqep-v5-page .gqep-fc-badge,
.gqep-v5-page .gqep-fc-level-badge,
.gqep-v5-page .gqep-fc-pill{
  padding:3px 10px;background:var(--gqep-p50);border-radius:var(--gqep-r-full);
  font-size:var(--gqep-fs-caption);font-weight:700;color:var(--gqep-p700);
}
/* أزرار التقييم — تُضغط مئات المرات في الجلسة */
.gqep-v5-page .gqep-fc-rating{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-block-start:16px;
}
.gqep-v5-page .gqep-fc-rate-btn{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  min-block-size:var(--gqep-tap-rate);
  padding:10px 6px;
  background:var(--gqep-sf);
  border:1.5px solid var(--gqep-bd2);
  border-radius:var(--gqep-r-md);
  cursor:pointer;
}
.gqep-v5-page .gqep-fc-rate-hard{border-color:var(--gqep-err);color:var(--gqep-err-text)}
.gqep-v5-page .gqep-fc-rate-medium{border-color:var(--gqep-warn);color:var(--gqep-warn-text)}
.gqep-v5-page .gqep-fc-rate-easy{border-color:var(--gqep-ok);color:var(--gqep-ok-text)}
.gqep-v5-page .gqep-fc-rate-label{font-size:var(--gqep-fs-body-s);font-weight:700}
.gqep-v5-page .gqep-fc-rate-sub{font-size:var(--gqep-fs-caption);color:var(--gqep-tx3)}
.gqep-v5-page .gqep-fc-icon-btn,
.gqep-v5-page .gqep-fc-audio-btn{
  inline-size:var(--gqep-tap-min);
  block-size:var(--gqep-tap-min);
  display:grid;place-items:center;
  background:var(--gqep-sf2);
  border:1px solid var(--gqep-bd);
  border-radius:var(--gqep-r-full);
  cursor:pointer;
}
.gqep-v5-page .gqep-fc-swipe-hint,
.gqep-v5-page .gqep-fc-tap-hint{
  margin-block-start:10px;text-align:center;
  font-size:var(--gqep-fs-body-s);color:var(--gqep-tx3);
}

/* ═══════════════ دروس القراءة ═══════════════
   ثلاثة أعمدة على سطح المكتب، عمود واحد على الجوال.
─────────────────────────────────────────────────── */
.gqep-v5-page .gqep-reading-shell{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
  max-inline-size:1280px;
  margin-inline:auto;
  padding:12px 14px 60px;
}
.gqep-v5-page .gqep-reading-sidebar,
.gqep-v5-page .gqep-reading-panel{
  display:flex;flex-direction:column;gap:12px;
}
.gqep-v5-page .gqep-reading-main{display:flex;flex-direction:column;gap:14px;min-inline-size:0}
.gqep-v5-page .gqep-reading-toolbar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
  padding:12px;
  background:var(--gqep-sf);
  border:1px solid var(--gqep-bd);
  border-radius:var(--gqep-r-lg);
}
.gqep-v5-page .gqep-reading-btn{
  min-block-size:var(--gqep-tap-min);
  padding:0 16px;
  background:var(--gqep-sf2);
  border:1px solid var(--gqep-bd2);
  border-radius:var(--gqep-r-md);
  font-size:var(--gqep-fs-body-s);
  font-weight:600;
  color:var(--gqep-tx2);
  cursor:pointer;
}
.gqep-v5-page .gqep-reading-btn-primary{
  background:var(--gqep-p500);border-color:var(--gqep-p500);color:var(--gqep-on-primary);
}

/* ── شريط الصوت الثابت لدروس القراءة ──
   يُضاف إلى document.body مباشرة (لا إلى .gqep-v5-page) فيبقى ثابتاً
   بصرف النظر عن أي تمرير للمحتوى. يظهر فوق الشريط السفلي على الجوال،
   وكشريط سفلي كامل على سطح المكتب حيث لا يوجد شريط تنقّل ثابت يزاحمه.
─────────────────────────────────────────────────────────────────── */
.gqep-reading-audiobar{
  position:fixed;
  inset-inline:0;
  bottom:0;
  z-index:210;
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 12px;
  padding-block-end:calc(8px + var(--gqep-safe-bottom,0px));
  background:var(--gqep-sf);
  border-block-start:1px solid var(--gqep-bd);
  box-shadow:0 -4px 16px rgba(0,0,0,.08);
  font-family:var(--gqep-font);
}
.gqep-reading-audiobar[hidden]{display:none}
.gqep-reading-audiobar-btn,
.gqep-reading-audiobar-play{
  flex:none;
  display:grid;
  place-items:center;
  inline-size:40px;
  block-size:40px;
  padding:0;
  background:var(--gqep-sf2);
  border:1px solid var(--gqep-bd);
  border-radius:var(--gqep-r-full);
  color:var(--gqep-tx2);
  cursor:pointer;
}
.gqep-reading-audiobar-btn svg{inline-size:18px;block-size:18px}
.gqep-reading-audiobar-play{
  inline-size:44px;block-size:44px;
  background:var(--gqep-p500);
  border-color:var(--gqep-p500);
  color:var(--gqep-on-primary);
}
.gqep-reading-audiobar-play svg{inline-size:20px;block-size:20px}
.gqep-reading-audiobar-track{
  flex:1;
  min-inline-size:0;
}
.gqep-reading-audiobar-seek{
  inline-size:100%;
  accent-color:var(--gqep-p500);
  cursor:pointer;
}
.gqep-reading-audiobar-time{
  flex:none;
  font-size:var(--gqep-fs-caption);
  font-weight:600;
  color:var(--gqep-tx2);
  font-variant-numeric:tabular-nums;
  min-inline-size:5ch;
  text-align:center;
}
.gqep-reading-audiobar-speed{
  flex:none;
  min-block-size:36px;
  padding:0 6px;
  background:var(--gqep-sf2);
  border:1px solid var(--gqep-bd);
  border-radius:var(--gqep-r-sm);
  font-size:var(--gqep-fs-caption);
  color:var(--gqep-tx2);
}

@media (max-width:767px){
  /* فوق الشريط السفلي الثابت (56px + المنطقة الآمنة) لا فوقه */
  .gqep-reading-audiobar{
    bottom:calc(56px + var(--gqep-safe-bottom,0px));
    box-shadow:0 -2px 10px rgba(0,0,0,.06);
  }
  .gqep-reading-audiobar-speed{display:none}
  body:has(.gqep-reading-audiobar:not([hidden])) .gqep-v5-page{
    padding-block-end:calc(76px + 58px + var(--gqep-safe-bottom,0px));
  }
}
.gqep-v5-page .gqep-reading-fulltext{
  padding:20px;
  background:var(--gqep-sf);
  border:1px solid var(--gqep-bd);
  border-radius:var(--gqep-r-lg);
  direction:ltr;
  text-align:left;
}
.gqep-v5-page .gqep-reading-fulltext-paragraph{
  font-size:var(--gqep-fs-body-l);
  line-height:2;
  color:var(--gqep-tx);
  margin:0 0 16px;
}
.gqep-v5-page .gqep-reading-word{
  cursor:pointer;
  border-radius:4px;
  padding:0 1px;
  transition:background var(--gqep-dur-fast) var(--gqep-ease);
}
.gqep-v5-page .gqep-reading-word:hover{background:var(--gqep-p50)}
.gqep-v5-page .gqep-reading-sentence.is-active,
.gqep-v5-page .gqep-reading-inline-sentence.is-active{
  background:var(--gqep-a50);
  box-shadow:0 0 0 2px var(--gqep-a300);
  border-radius:var(--gqep-r-sm);
}
.gqep-v5-page .gqep-reading-tag{
  padding:3px 10px;background:var(--gqep-sf2);border-radius:var(--gqep-r-full);
  font-size:var(--gqep-fs-caption);color:var(--gqep-tx2);
}
.gqep-v5-page .gqep-reading-lesson-btn,
.gqep-v5-page .gqep-reading-library-card{
  display:flex;flex-direction:column;gap:6px;
  min-block-size:var(--gqep-tap-min);
  padding:14px;
  background:var(--gqep-sf);
  border:1px solid var(--gqep-bd);
  border-radius:var(--gqep-r-md);
  text-align:start;
  cursor:pointer;
}
.gqep-v5-page .gqep-reading-lesson-btn.is-active{border-color:var(--gqep-p500);background:var(--gqep-p50)}
/* شرح الكلمة: عمود جانبي على سطح المكتب، ورقة سفلية على الجوال */
.gqep-v5-page .gqep-reading-word-popover{
  position:fixed;
  inset-inline:0;
  bottom:0;
  z-index:1000;
  max-block-size:70vh;
  overflow-y:auto;
  padding:18px;
  padding-block-end:calc(18px + var(--gqep-safe-bottom));
  background:var(--gqep-sf);
  border-start-start-radius:var(--gqep-r-xl);
  border-start-end-radius:var(--gqep-r-xl);
  box-shadow:var(--gqep-sh3);
}
.gqep-v5-page .gqep-reading-word-popover[hidden]{display:none}
.gqep-v5-page .gqep-reading-word-popover-close{
  position:absolute;
  inset-inline-end:12px;
  top:12px;
  inline-size:var(--gqep-tap-min);
  block-size:var(--gqep-tap-min);
  display:grid;place-items:center;
  background:var(--gqep-sf2);
  border:1px solid var(--gqep-bd);
  border-radius:var(--gqep-r-full);
  font-size:20px;
  cursor:pointer;
}
@media (min-width:1024px){
  .gqep-v5-page .gqep-reading-shell{grid-template-columns:260px minmax(0,1fr)}
  .gqep-v5-page .gqep-reading-content{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px}
  .gqep-v5-page .gqep-reading-word-popover{
    position:static;max-block-size:none;box-shadow:none;
    border:1px solid var(--gqep-bd);border-radius:var(--gqep-r-lg);
  }
}

/* ═══════════════ شاشة النتيجة ═══════════════
   داخل المشغّل، لذلك تُقيَّد بـ .gqep-v5 لا .gqep-v5-page.
─────────────────────────────────────────────────── */
.gqep-v5 .gqep-result{display:flex;flex-direction:column;gap:14px}
.gqep-v5 .gqep-result-hero{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
  padding:24px 18px;
  background:var(--gqep-sf);
  border:1px solid var(--gqep-bd);
  border-radius:var(--gqep-r-xl);
  text-align:center;
}
.gqep-v5 .gqep-result-score{
  font-size:var(--gqep-fs-display);
  font-weight:var(--gqep-fw-display);
  line-height:var(--gqep-lh-display);
  color:var(--gqep-tx);
  font-variant-numeric:tabular-nums;
}
.gqep-v5 .gqep-result-pct{
  font-size:var(--gqep-fs-h2);
  font-weight:700;
  color:var(--gqep-p600);
  font-variant-numeric:tabular-nums;
}
.gqep-v5 .gqep-result-label{
  padding:6px 16px;
  background:var(--gqep-ok-bg);
  border-radius:var(--gqep-r-full);
  font-size:var(--gqep-fs-body-m);
  font-weight:700;
  color:var(--gqep-ok-text);
}
.gqep-v5 .gqep-result-hero.is-fail .gqep-result-label{
  background:var(--gqep-err-bg);color:var(--gqep-err-text);
}
.gqep-v5 .gqep-result-timeout{
  padding:12px 14px;
  background:var(--gqep-warn-bg);
  border-radius:var(--gqep-r-md);
  font-size:var(--gqep-fs-body-s);
  color:var(--gqep-warn-text);
}
.gqep-v5 .gqep-result-save-status{
  font-size:var(--gqep-fs-body-s);
  color:var(--gqep-tx3);
}
/* بطاقة تقييم الذكاء الاصطناعي */
.gqep-v5 .gqep-eval-box,
.gqep-v5 .gqep-eval-result{
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:18px;
  background:var(--gqep-sf);
  border:1px solid var(--gqep-bd);
  border-radius:var(--gqep-r-lg);
}
.gqep-v5 .gqep-eval-score-row{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
}
.gqep-v5 .gqep-eval-big-score{
  font-size:32px;font-weight:700;color:var(--gqep-tx);font-variant-numeric:tabular-nums;
}
.gqep-v5 .gqep-eval-grade{
  padding:3px 12px;background:var(--gqep-p50);border-radius:var(--gqep-r-full);
  font-size:var(--gqep-fs-body-s);font-weight:700;color:var(--gqep-p700);
}
.gqep-v5 .gqep-eval-wc{font-size:var(--gqep-fs-body-s);color:var(--gqep-tx2)}
.gqep-v5 .gqep-eval-criterion{display:flex;flex-direction:column;gap:6px}
.gqep-v5 .gqep-eval-crit-header{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  font-size:var(--gqep-fs-body-s);
}
.gqep-v5 .gqep-eval-crit-name{font-weight:600;color:var(--gqep-tx)}
.gqep-v5 .gqep-eval-crit-score{font-weight:700;color:var(--gqep-p600);font-variant-numeric:tabular-nums}
.gqep-v5 .gqep-eval-crit-bar{
  block-size:6px;background:var(--gqep-sf3);border-radius:var(--gqep-r-full);overflow:hidden;
}
.gqep-v5 .gqep-eval-crit-fill{block-size:100%;background:var(--gqep-p500)}
.gqep-v5 .gqep-eval-crit-comment{font-size:var(--gqep-fs-body-s);color:var(--gqep-tx2);line-height:var(--gqep-lh-body-s)}
.gqep-v5 .gqep-eval-student-text,
.gqep-v5 .gqep-eval-model-text{
  padding:14px;background:var(--gqep-sf2);border-radius:var(--gqep-r-md);
  font-size:var(--gqep-fs-body-m);line-height:var(--gqep-lh-body-m);
  direction:ltr;text-align:left;white-space:pre-wrap;
}
.gqep-v5 .gqep-eval-trigger-btn,
.gqep-v5 .gqep-eval-live-btn{
  min-block-size:var(--gqep-tap-min);
  padding:0 18px;
  background:var(--gqep-p500);border:0;border-radius:var(--gqep-r-md);
  font-size:var(--gqep-fs-body-m);font-weight:600;color:var(--gqep-on-primary);cursor:pointer;
}
/* المراجعة */
.gqep-v5 .gqep-review-section{
  display:flex;flex-direction:column;gap:12px;
  padding:18px;background:var(--gqep-sf);
  border:1px solid var(--gqep-bd);border-radius:var(--gqep-r-lg);
}
.gqep-v5 .gqep-review-heading{
  font-size:var(--gqep-fs-h3);font-weight:var(--gqep-fw-h3);color:var(--gqep-tx);
}
.gqep-v5 .gqep-review-item{
  display:flex;flex-direction:column;gap:8px;
  padding:14px;
  background:var(--gqep-sf2);
  border:1px solid var(--gqep-bd);
  border-inline-start:3px solid var(--gqep-bd2);
  border-radius:var(--gqep-r-md);
}
.gqep-v5 .gqep-review-item.is-correct{border-inline-start-color:var(--gqep-ok)}
.gqep-v5 .gqep-review-item.is-wrong{border-inline-start-color:var(--gqep-err)}
.gqep-v5 .gqep-review-q{
  font-size:var(--gqep-fs-body-m);font-weight:600;color:var(--gqep-tx);
  direction:ltr;text-align:left;
}
.gqep-v5 .gqep-review-choices{font-size:var(--gqep-fs-body-s);color:var(--gqep-tx2);direction:ltr;text-align:left}
.gqep-v5 .gqep-review-exp{
  padding:10px 12px;background:var(--gqep-ok-bg);border-radius:var(--gqep-r-sm);
  font-size:var(--gqep-fs-body-s);color:var(--gqep-ok-text);
}
.gqep-v5 .gqep-review-filter-notice{font-size:var(--gqep-fs-body-s);color:var(--gqep-tx3)}
.gqep-v5 .gqep-result-pdf-float{
  position:fixed;
  inset-inline-start:14px;
  bottom:calc(84px + var(--gqep-safe-bottom));
  z-index:900;
  display:inline-flex;align-items:center;gap:8px;
  min-block-size:var(--gqep-tap-min);
  padding:0 18px;
  background:var(--gqep-p600);
  border-radius:var(--gqep-r-full);
  font-size:var(--gqep-fs-body-s);font-weight:700;
  color:#fff!important;text-decoration:none;
  box-shadow:var(--gqep-sh2);
}

/* ═══════════════ قشرة تنقّل الطالب ═══════════════
   شريط علوي على سطح المكتب، شريط سفلي ثابت على الجوال
   لأن الثلث السفلي هو منطقة الإبهام.
─────────────────────────────────────────────────── */
.gqep-v5-page .gqep-student-shell{
  position:sticky;
  top:0;
  z-index:60;
  margin:0 0 16px;
  padding:8px 12px;
  background:var(--gqep-sf);
  border:1px solid var(--gqep-bd);
  border-radius:var(--gqep-r-lg);
  box-shadow:none;
  backdrop-filter:none;
}
.gqep-v5-page .gqep-student-shell-inner{
  display:flex;align-items:center;gap:12px;
}
.gqep-v5-page .gqep-student-brand{
  display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--gqep-tx);
}
.gqep-v5-page .gqep-student-brand-mark{
  inline-size:34px;block-size:34px;display:grid;place-items:center;
  background:var(--gqep-p500);border-radius:var(--gqep-r-sm);
  font-weight:800;font-size:13px;color:var(--gqep-on-primary);
}
.gqep-v5-page .gqep-student-brand-copy strong{font-size:var(--gqep-fs-body-m);font-weight:700}
.gqep-v5-page .gqep-student-brand-copy small{font-size:var(--gqep-fs-caption);color:var(--gqep-tx3)}
.gqep-v5-page .gqep-student-nav{
  display:flex;align-items:center;gap:4px;flex:1;
  overflow-x:auto;scrollbar-width:none;
}
.gqep-v5-page .gqep-student-nav::-webkit-scrollbar{display:none}
.gqep-v5-page .gqep-student-nav-link{
  display:inline-flex;align-items:center;gap:6px;
  min-block-size:var(--gqep-tap-min);
  padding:0 12px;
  border-radius:var(--gqep-r-md);
  font-size:var(--gqep-fs-body-s);
  font-weight:600;
  color:var(--gqep-tx2);
  text-decoration:none;
  white-space:nowrap;
}
.gqep-v5-page .gqep-student-nav-link:hover{background:var(--gqep-sf2);color:var(--gqep-tx);text-decoration:none}
.gqep-v5-page .gqep-student-nav-link.is-active{background:var(--gqep-p50);color:var(--gqep-p700)}
.gqep-v5-page .gqep-student-nav-link-icon{
  display:inline-flex;flex:none;
  inline-size:20px;block-size:20px;
}
.gqep-v5-page .gqep-student-nav-link-icon svg{inline-size:100%;block-size:100%}
/* على سطح المكتب الأيقونة والنص معاً */
.gqep-v5-page .gqep-student-nav-link-label{display:inline}
.gqep-v5-page .gqep-student-actions{
  display:flex;align-items:center;gap:8px;margin-inline-start:auto;
}
.gqep-v5-page .gqep-student-icon-link{
  inline-size:var(--gqep-tap-min);block-size:var(--gqep-tap-min);
  display:grid;place-items:center;
  background:var(--gqep-sf2);border:1px solid var(--gqep-bd);
  border-radius:var(--gqep-r-full);text-decoration:none;
}
.gqep-v5-page .gqep-student-avatar,
.gqep-v5-page .gqep-student-avatar-fallback{
  inline-size:34px;block-size:34px;border-radius:var(--gqep-r-full);
  object-fit:cover;display:grid;place-items:center;
  background:var(--gqep-p50);color:var(--gqep-p700);font-weight:700;
}
.gqep-v5-page .gqep-student-login-link{
  display:inline-flex;align-items:center;
  min-block-size:var(--gqep-tap-min);
  padding:0 16px;
  background:var(--gqep-p500);
  border-radius:var(--gqep-r-md);
  font-size:var(--gqep-fs-body-s);font-weight:600;
  color:var(--gqep-on-primary)!important;text-decoration:none;
}

@media (max-width:767px){
  /* ── قشرة الجوال ──
     التنقّل وحده يصير شريطاً سفلياً ثابتاً (منطقة الإبهام).
     العلامة والإجراءات (اللغة، الوضع، الإشعارات، الحساب) تبقى أعلى
     الصفحة وتمرّ مع المحتوى — فلا يزيد عدد العناصر اللاصقة عن واحد،
     ولا تختفي الإجراءات عن الطالب.
  ── */
  .gqep-v5-page .gqep-student-shell{
    position:static;
    margin:0 0 14px;
    padding:8px 10px;
    border-radius:var(--gqep-r-md);
  }
  .gqep-v5-page .gqep-student-shell-inner{
    align-items:center;
    gap:8px;
  }
  .gqep-v5-page .gqep-student-brand-copy{display:none}
  .gqep-v5-page .gqep-student-actions{
    display:flex;
    margin-inline-start:auto;
    gap:6px;
  }

  /* شريط التنقّل السفلي الثابت — خمسة عناصر، هدف لمس 56px */
  .gqep-v5-page .gqep-student-nav{
    position:fixed;
    inset-inline:0;
    bottom:0;
    z-index:200;
    inline-size:100%;
    justify-content:space-between;
    gap:2px;
    padding:4px 6px;
    padding-block-end:calc(4px + var(--gqep-safe-bottom));
    background:var(--gqep-sf);
    border-block-start:1px solid var(--gqep-bd);
    box-shadow:0 -2px 14px rgba(0,0,0,.06);
    overflow-x:auto;
  }
  /* على الجوال: أيقونة فقط، بلا نص — القائمة السفلية يجب أن تبقى مضغوطة */
  .gqep-v5-page .gqep-student-nav-link{
    flex:1;
    flex-direction:column;
    justify-content:center;
    gap:2px;
    min-block-size:56px;
    padding:4px;
    font-size:var(--gqep-fs-caption);
    text-align:center;
  }
  .gqep-v5-page .gqep-student-nav-link-icon{inline-size:22px;block-size:22px}
  .gqep-v5-page .gqep-student-nav-link-label{display:none}
  /* مساحة أسفل الصفحة حتى لا يغطّي الشريط آخر المحتوى */
  .gqep-v5-page{padding-block-end:calc(76px + var(--gqep-safe-bottom))}
}

/* ═══════════════ حالات عامة ═══════════════ */
.gqep-v5-page .gqep-login,
.gqep-v5-page .gqep-dashboard-login{
  display:flex;flex-direction:column;align-items:center;gap:12px;
  padding:48px 20px;text-align:center;
  background:var(--gqep-sf);
  border:1px solid var(--gqep-bd);
  border-radius:var(--gqep-r-lg);
  color:var(--gqep-tx2);
}
.gqep-v5-page .gqep-error{
  padding:18px;background:var(--gqep-err-bg);
  border-radius:var(--gqep-r-md);color:var(--gqep-err-text);
}

/* ═══════════════════════════════════════════════════════════════
   الحالات: تحميل · فارغ · خطأ · بلا اتصال · مقفل
   مبنية من التوكينات، تعمل في الوضعين وفي الاتجاهين.
   ═══════════════════════════════════════════════════════════════ */

.gqep-v5-page .gqep-state,
.gqep-v5 .gqep-state{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  padding:44px 20px;
  text-align:center;
  background:var(--gqep-sf);
  border:1px solid var(--gqep-bd);
  border-radius:var(--gqep-r-lg);
}
.gqep-v5-page .gqep-state-icon,
.gqep-v5 .gqep-state-icon{
  display:grid;place-items:center;
  inline-size:56px;block-size:56px;
  background:var(--gqep-sf2);
  border-radius:var(--gqep-r-full);
  color:var(--gqep-tx3);
}
.gqep-v5-page .gqep-state-title,
.gqep-v5 .gqep-state-title{
  font-size:var(--gqep-fs-h3);
  font-weight:var(--gqep-fw-h3);
  color:var(--gqep-tx);
}
.gqep-v5-page .gqep-state-msg,
.gqep-v5 .gqep-state-msg{
  font-size:var(--gqep-fs-body-m);
  line-height:var(--gqep-lh-body-m);
  color:var(--gqep-tx2);
  max-inline-size:38ch;
}
.gqep-v5-page .gqep-state--error{border-color:var(--gqep-err);background:var(--gqep-err-bg)}
.gqep-v5-page .gqep-state--error .gqep-state-title{color:var(--gqep-err-text)}
.gqep-v5-page .gqep-state--locked{border-color:var(--gqep-warn);background:var(--gqep-warn-bg)}
.gqep-v5-page .gqep-state--locked .gqep-state-title{color:var(--gqep-warn-text)}

/* الحالات القائمة في الكود تأخذ نفس المظهر دون تغيير الماركب */
.gqep-v5-page .gqep-fc-state,
.gqep-v5-page .gqep-prog-loading,
.gqep-v5-page .gqep-prog-empty,
.gqep-v5-page .gqep-no-filter,
.gqep-v5-page .gqep-dashboard-empty,
.gqep-v5-page .gqep-archive-empty,
.gqep-v5-page .gqep-reading-empty,
.gqep-v5-page .gqep-notification-loading{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  padding:44px 20px;
  text-align:center;
  color:var(--gqep-tx2);
  font-size:var(--gqep-fs-body-m);
}
.gqep-v5-page .gqep-fc-state-icon{
  display:grid;place-items:center;
  inline-size:56px;block-size:56px;
  background:var(--gqep-sf2);
  border-radius:var(--gqep-r-full);
  font-size:24px;
}

/* هياكل التحميل */
.gqep-v5-page .gqep-skel,
.gqep-v5 .gqep-skel{
  background:linear-gradient(90deg,var(--gqep-sf2) 25%,var(--gqep-sf3) 37%,var(--gqep-sf2) 63%);
  background-size:400% 100%;
  border-radius:var(--gqep-r-sm);
  animation:gqep-skel 1.4s ease infinite;
}
@keyframes gqep-skel{from{background-position:100% 50%}to{background-position:0 50%}}
.gqep-v5-page .gqep-skel--line{block-size:14px;margin-block-end:10px}
.gqep-v5-page .gqep-skel--title{block-size:24px;inline-size:60%;margin-block-end:14px}
.gqep-v5-page .gqep-skel--card{block-size:180px;border-radius:var(--gqep-r-lg)}

/* شريط "بلا اتصال" — يظهر عبر كلاس على الجذر */
.gqep-offline-bar{
  position:fixed;
  inset-inline:0;
  top:0;
  z-index:1100;
  display:none;
  padding:10px 16px;
  background:var(--gqep-warn-bg,#FBF3E2);
  border-block-end:1px solid var(--gqep-warn,#B8801A);
  font-family:var(--gqep-font,system-ui,sans-serif);
  font-size:var(--gqep-fs-body-s,13px);
  font-weight:600;
  color:var(--gqep-warn-text,#8A5E10);
  text-align:center;
}
body.gqep-is-offline .gqep-offline-bar{display:block}
body.gqep-is-offline .gqep-v5-page,
body.gqep-is-offline .gqep-v5{opacity:.96}