@keyframes nest-spin{to{transform:rotate(360deg)}}.nest-spinner{animation:nest-spin .8s linear infinite}@media (prefers-reduced-motion: reduce){.nest-spinner{animation:none;opacity:.55}}.w-3{width:calc(var(--spacing) * 3)}.w-36{width:calc(var(--spacing) * 36)}.h-3{height:calc(var(--spacing) * 3)}.h-2\.5{height:calc(var(--spacing) * 2.5)}.mt-1\.5{margin-top:calc(var(--spacing) * 1.5)}.bottom-0{bottom:0}.end-0{inset-inline-end:0}.opacity-50{opacity:.5}.rounded-sm{border-radius:.25rem}.border-indigo-500{border-color:var(--color-indigo-500)}.text-\[10px\]{font-size:10px}@media (width >= 40rem){.sm\:block{display:block}}@media (hover:hover){.hover\:bg-slate-100:hover{background-color:var(--color-slate-100)}.dark .dark\:hover\:bg-slate-700:hover{background-color:var(--color-slate-700)}.hover\:text-amber-700:hover{color:var(--color-amber-700)}.dark .dark\:hover\:text-amber-300:hover{color:var(--color-amber-300)}}

/* L3.1 Teacher information architecture */
#nest-teacher-modes [role="tab"] { min-width: 0; }
#nest-teacher-modes [role="tabpanel"][hidden] { display: none !important; }
@media (max-width: 420px) {
  #nest-teacher-modes [role="tab"] { padding-inline: .45rem; font-size: .68rem; }
  #nest-teacher-modes [role="tab"] i { margin-inline-end: .2rem; }
}

/* L3.2 Quick Classroom presentation hardening */
#nest-classroom-panel {
  overflow: hidden;
}
#nest-classroom-panel .nest-quick-join-card {
  overflow: hidden;
}
#nest-classroom-panel .nest-quick-qr-frame {
  width: min(100%, 340px);
  padding: clamp(.55rem, 1.8vw, .85rem);
  box-sizing: border-box;
}
#nest-classroom-panel .nest-quick-qr-svg {
  width: 100%;
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
#nest-classroom-panel .nest-quick-qr-svg svg {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  aspect-ratio: 1 / 1;
  shape-rendering: crispEdges;
}
#nest-classroom-panel details summary {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
}
@media (max-width: 480px) {
  #nest-classroom-panel .nest-quick-qr-frame {
    width: min(100%, 250px);
    padding: .55rem;
  }
  #nest-classroom-panel .nest-quick-join-card {
    padding: 1rem;
  }
  #nest-classroom-panel .nest-quick-session > .flex.items-start.justify-between {
    align-items: flex-start;
  }
}
@media (min-width: 768px) {
  #nest-classroom-panel .nest-quick-qr-frame {
    width: min(100%, 330px);
  }
}


/* ══ Batch UX4 · أدوات مفقودة من بناء Tailwind المُنقّى ═══════════════════════
   ⚠️ تحقُّق إلزامي قبل أي كلاس جديد: البناء منقّى بدقّة، فالكلاس غير المولَّد
     **لا يفشل بصوت** — يُكتب في السمة ولا يفعل شيئًا. المسح أثبت أن
     `md:text-xl` و`leading-[1.1]` غير موجودين إطلاقًا في nest-tailwind.css
     (الموجود من المتجاوبات: md:text-base · sm:text-3xl/4xl/5xl/base/sm/xs ·
      lg:text-6xl · xl:text-7xl — لا غير).
   نقطة الانقطاع md = 48rem، مطابِقة لـ.md\:text-base في البناء نفسه. */
.md\:text-xl{@media (width >= 48rem){font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}}
.leading-\[1\.1\]{--tw-leading:1.1;line-height:1.1}


/* ══ Batch UX6 · UX3-4 — متغيّر خطّ غير معرّف ══════════════════════════════
   🔴 `.home-details-title{font-family:var(--font-display,serif)}` في كتلة
     <style> داخل index.html — و`--font-display` **غير معرّف في أي ملف**
     (مُتحقَّق منه في الخمسة: tailwind · styles · premium · safety-net · inline).
     ⟹ الـfallback `serif` يعمل، فعنوان الـFAQ يُرسم بـTimes New Roman
     وسط صفحة كل عناوينها Lora. عيب طباعي صامت.
   ✅ يُعرَّف بنفس قيمة `.font-display` حرفيًا: 'Lora',Georgia,var(--nest-sans) */
:root{ --font-display: 'Lora', Georgia, var(--nest-sans); }

/* =====================================================================
   v251 · NEST DARK SYSTEM — Deep Navy + Emerald
   Goal: one coherent night identity across the whole product.
   Keep semantic status colors (success/warning/danger), but remove
   competing green-surface / blue-surface / purple-surface layering.
   ===================================================================== */
html.dark{
  --nest-ink:#F3F7F5;
  --nest-ink-muted:#C5D0CF;
  --nest-ink-subtle:#95A4A6;
  --nest-ink-invert:#08111F;
  --nest-surface:#0D1726;
  --nest-surface-raised:#111C2C;
  --nest-surface-sunken:#08111F;
  --nest-border:rgba(167,183,191,.14);
  --nest-border-strong:rgba(167,183,191,.24);
  --nest-brand-solid:#0C7556;
  --nest-brand-text:#7FD3B0;
  --nest-brand-soft:rgba(12,117,86,.14);
  --nest-success:#A7E0C2;
  --nest-warn:#FFB35C;
  --nest-danger:#FB7185;
  --nest-focus:#4FC596;
  --nest-focus-ring:0 0 0 3px rgba(79,197,150,.35);
  --shadow-elev-1:0 4px 16px -8px rgba(0,0,0,.46);
  --shadow-elev-2:0 14px 36px -16px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.035);
  --shadow-elev-3:0 24px 55px -20px rgba(0,0,0,.68),inset 0 1px 0 rgba(255,255,255,.04);
}

html.dark,
html.dark body{background:#08111F !important;color:var(--nest-ink) !important;}
html.dark body::before{
  background:
    radial-gradient(50% 40% at 7% 0%,rgba(12,117,86,.16),transparent 65%),
    radial-gradient(42% 34% at 94% 9%,rgba(22,74,112,.12),transparent 66%),
    radial-gradient(46% 38% at 50% 100%,rgba(12,117,86,.08),transparent 68%) !important;
}
html.dark body::after{display:none !important;}

/* Glass/surfaces: navy belongs to the surface system; green is the accent. */
html.dark .glass-panel{
  background:rgba(17,28,44,.88) !important;
  border-color:rgba(167,183,191,.13) !important;
  box-shadow:0 14px 34px -16px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.035) !important;
}
html.dark .glass-panel-dark{
  background:rgba(13,23,38,.92) !important;
  border-color:rgba(167,183,191,.11) !important;
}
html.dark nav.glass-panel{
  background:rgba(8,17,31,.92) !important;
  border-bottom-color:rgba(167,183,191,.12) !important;
  box-shadow:0 10px 30px -18px rgba(0,0,0,.65) !important;
}

/* Common Tailwind surfaces: collapse the old green/card-blue split. */
html.dark .bg-slate-950,
html.dark .bg-slate-900,
html.dark .bg-slate-800{background-color:#0D1726 !important;}
html.dark .bg-slate-700{background-color:#162235 !important;}
html.dark .bg-slate-600{background-color:#1B2A3D !important;}
html.dark [class*="dark\\:bg-slate-950"],
html.dark [class*="dark\\:bg-slate-900"],
html.dark [class*="dark\\:bg-slate-800"]{background-color:#0D1726 !important;}

/* Borders become neutral/cool; emerald only appears where it communicates state. */
html.dark .border-slate-800,
html.dark .border-slate-700,
html.dark .border-slate-600{border-color:rgba(167,183,191,.14) !important;}

/* Type hierarchy. */
html.dark .text-slate-100,
html.dark .text-slate-200{color:#EAF1EF !important;}
html.dark .text-slate-300{color:#C7D2D0 !important;}
html.dark .text-slate-400{color:#A8B5B7 !important;}
html.dark .text-slate-500{color:#8F9EA1 !important;}
html.dark .text-slate-600{color:#78888B !important;}
html.dark .dark\\:text-slate-300{color:#C7D2D0 !important;}
html.dark .dark\\:text-slate-400{color:#A8B5B7 !important;}
html.dark .dark\\:text-slate-500,
html.dark .dark\\:text-slate-600{color:#8F9EA1 !important;}

/* Emerald is the brand signal, not a page background. */
html.dark .text-emerald-200{color:#A7E0C2 !important;}
html.dark .text-emerald-300,
html.dark .text-emerald-400{color:#7FD3B0 !important;}
html.dark .text-emerald-500{color:#43BC8A !important;}
html.dark .bg-emerald-950{background:rgba(12,117,86,.16) !important;}
html.dark .bg-emerald-900{background:rgba(12,117,86,.18) !important;}
html.dark .bg-emerald-800{background:rgba(12,117,86,.22) !important;}

/* Interactive controls. */
html.dark #nav-dark-toggle-btn:hover,
html.dark #nav-lang-btn:hover,
html.dark #mobile-menu-btn:hover{background:#162235 !important;}
html.dark #nav-xp-pill-btn:hover{background:rgba(245,158,11,.12) !important;}
html.dark :where(button,a,input,select,textarea,summary,[tabindex]):focus-visible{
  outline-color:#4FC596 !important;
  box-shadow:0 0 0 3px rgba(79,197,150,.28) !important;
}

/* Mobile drawer. */
html.dark #mobile-menu-panel{
  background:#0D1726 !important;
  border-color:rgba(167,183,191,.14) !important;
}
html.dark #mobile-menu-panel .nav-drawer-item,
html.dark #mobile-menu-panel .nav-drawer-group>summary{color:#EAF1EF !important;}
html.dark #mobile-menu-panel .nav-drawer-submenu button{color:#BAC7C7 !important;}
html.dark #mobile-menu-panel .nav-drawer-item i,
html.dark #mobile-menu-panel .nav-drawer-group>summary i,
html.dark #mobile-menu-panel .nav-drawer-group>summary>span:first-child>i{
  color:#7FD3B0 !important;
}
html.dark #mobile-menu-panel .nav-drawer-group,
html.dark #mobile-menu-panel .nav-drawer-item{border-bottom-color:rgba(167,183,191,.10) !important;}
html.dark #mobile-menu-panel .nav-drawer-group>summary::after{background:rgba(167,183,191,.10) !important;}

/* Landing/home: navy shell + emerald highlights. */
html.dark #landing-section .hero-card-entrance{
  background:#111C2C !important;
  border-color:rgba(167,183,191,.14) !important;
}
html.dark #landing-section .hero-card-entrance .bg-slate-50{background:#0D1726 !important;}
html.dark #landing-section .home-path-card{
  background:rgba(17,28,44,.55) !important;
  border-color:rgba(167,183,191,.12) !important;
}
html.dark #landing-section .home-path-card:hover{
  background:rgba(12,117,86,.10) !important;
  border-color:rgba(79,197,150,.26) !important;
}
html.dark #landing-section .reveal-grid > .glass-panel,
html.dark #landing-section .home-proof-grid{
  background:rgba(17,28,44,.38) !important;
  border-color:rgba(167,183,191,.11) !important;
}
html.dark #landing-section #faq-section .home-details{background:#111C2C !important;}
html.dark #landing-section > section.max-w-4xl > div{
  background:linear-gradient(135deg,#0E3A2E,#0C7556) !important;
}

/* Curriculum: the cards must live in the same navy family as the page. */
html.dark #nest-curriculum-learning .nest-cefr-map,
html.dark #nest-curriculum-learning .nest-roadmap-shell{
  background:rgba(13,23,38,.68) !important;
  border-color:rgba(167,183,191,.12) !important;
}
html.dark #nest-curriculum-learning .nest-cefr-card,
html.dark #nest-curriculum-learning .nest-roadmap-card,
html.dark details.rounded-2xl.border article,
html.dark article.rounded-2xl.border.border-slate-200{
  background:#111C2C !important;
  border-color:rgba(167,183,191,.14) !important;
  box-shadow:0 14px 28px -22px rgba(0,0,0,.62) !important;
}
html.dark #nest-curriculum-learning .nest-cefr-card--active,
html.dark #nest-curriculum-learning .nest-roadmap-card--featured{
  background:linear-gradient(145deg,#142437,#111C2C) !important;
  border-color:rgba(79,197,150,.34) !important;
  box-shadow:0 16px 34px -22px rgba(12,117,86,.28),inset 0 1px 0 rgba(255,255,255,.04) !important;
}
html.dark #nest-curriculum-learning .nest-cefr-level-dot{
  background:#18273A !important;
  border-color:rgba(167,183,191,.18) !important;
}
html.dark #nest-curriculum-learning .nest-cefr-card--active .nest-cefr-level-dot{
  background:rgba(12,117,86,.18) !important;
  border-color:rgba(79,197,150,.42) !important;
  color:#7FD3B0 !important;
  box-shadow:0 0 0 5px rgba(79,197,150,.06) !important;
}
html.dark #nest-curriculum-learning .nest-cefr-list::before{
  background:linear-gradient(to bottom,rgba(79,197,150,.46),rgba(148,163,184,.12)) !important;
}
html.dark #nest-curriculum-learning .nest-cefr-card .nest-cefr-title{color:#F0F5F3 !important;}
html.dark #nest-curriculum-learning .nest-cefr-card .nest-cefr-name{color:#9EACAD !important;}

/* Teacher/advanced surfaces: convert decorative purple back to brand emerald. */
html.dark .nest-teacher-info-btn:hover,
html.dark .nest-teacher-info-btn[aria-expanded="true"]{border-color:rgba(79,197,150,.36) !important;color:#7FD3B0 !important;background:rgba(12,117,86,.10) !important;}
html.dark .nest-teacher-modal-kicker,
html.dark .nest-teacher-advanced-status,
html.dark .nest-teacher-advanced-mark,
html.dark .nest-teacher-advanced-cta{color:#A7E0C2 !important;border-color:rgba(79,197,150,.20) !important;background:rgba(12,117,86,.10) !important;}
html.dark .nest-teacher-flow-step>span,
html.dark .nest-teacher-advanced-feature-icon{color:#A7E0C2 !important;background:rgba(12,117,86,.12) !important;}
html.dark .nest-teacher-advanced-hero{
  border-color:rgba(79,197,150,.18) !important;
  background:linear-gradient(135deg,rgba(12,117,86,.13),rgba(17,28,44,.96) 58%,rgba(12,117,86,.06)) !important;
}
html.dark .nest-teacher-coming-panel,
html.dark .nest-teacher-tools-intro{
  border-color:rgba(79,197,150,.15) !important;
  background:linear-gradient(135deg,rgba(12,117,86,.09),rgba(17,28,44,.92) 60%) !important;
}

/* Guides: keep their typography, but use the same night canvas/surfaces. */
html.dark body.nest-guides-page{background:#08111F !important;}
html.dark .nest-guide-nav{background:rgba(8,17,31,.92) !important;border-color:rgba(167,183,191,.12) !important;}
html.dark .nest-guide-card{background:linear-gradient(145deg,#111C2C,#0D1726) !important;border-color:rgba(167,183,191,.13) !important;}
html.dark .nest-guide-card article section,
html.dark .nest-guide-card .cta{background:rgba(17,28,44,.72) !important;border-color:rgba(167,183,191,.12) !important;}

/* Keep semantic warning/error states recognizable. */
html.dark .text-amber-300,.dark .text-amber-400{color:#FFB35C !important;}
html.dark .text-rose-300,.dark .text-rose-400{color:#FB7185 !important;}

@media (max-width:640px){
  html.dark #nest-curriculum-learning .nest-cefr-card{background:#111C2C !important;}
}


/* =====================================================================
   v252 · RELEASE VISUAL CONSISTENCY
   Final dark-mode hardening: remove leftover decorative indigo/violet
   surfaces and keep the product-wide visual grammar Deep Navy + Emerald.
   Semantic warning/error colors remain untouched.
   ===================================================================== */
html.dark .nest-teacher-tools-section-head-share .nest-teacher-tools-section-icon,
html.dark .nest-teacher-tools-section-head-connected .nest-teacher-tools-section-icon{
  background:rgba(12,117,86,.12) !important;
  color:#A7E0C2 !important;
}
html.dark .nest-teacher-tools-intro{
  background:linear-gradient(135deg,rgba(12,117,86,.08),rgba(17,28,44,.94) 62%) !important;
}
html.dark .nest-teacher-advanced-hero{
  background:linear-gradient(135deg,rgba(12,117,86,.12),rgba(17,28,44,.96) 60%,rgba(12,117,86,.05)) !important;
}
html.dark .nest-teacher-info-btn:hover,
html.dark .nest-teacher-info-btn[aria-expanded="true"]{
  border-color:rgba(79,197,150,.36) !important;
  color:#7FD3B0 !important;
  background:rgba(12,117,86,.10) !important;
}

/* Do not let generic dark utility rules recolor curriculum surfaces green. */
html.dark #nest-curriculum-learning .nest-cefr-map,
html.dark #nest-curriculum-learning .nest-roadmap-shell{
  background:#0D1726 !important;
}
html.dark #nest-curriculum-learning .nest-cefr-card,
html.dark #nest-curriculum-learning .nest-roadmap-card{
  background:#111C2C !important;
}
html.dark #nest-curriculum-learning .nest-cefr-card--active,
html.dark #nest-curriculum-learning .nest-roadmap-card--featured{
  background:linear-gradient(145deg,#142437,#111C2C) !important;
}