/* ==========================================================================
   Telkini v148 — إعادة تصميم: «طوّر مستواك» + الصفحة الرئيسية (مرجع: sahlab2.online)
   - يُحمَّل بعد tk-ref-ui.css. كل القواعد محصورة في #levelup-view و #home-view.
   - لا يغيّر أي وظيفة: نفس الأزرار و onclick (proGate / startRandomLevelUpPart / startRandomFullExam …).
   ========================================================================== */

/* ==========================================================================
   1) «طوّر مستواك» — Zufällige Prüfungen
   ========================================================================== */
body:has(#levelup-view:not(.hidden)),
body:has(#home-view:not(.hidden)) {
  background-color: #fafafa !important;
  background-image: radial-gradient(#d1d1d1 1px, transparent 0) !important;
  background-size: 24px 24px !important;
}
html.dark body:has(#levelup-view:not(.hidden)),
html.dark body:has(#home-view:not(.hidden)) {
  background-color: #0b1120 !important;
  background-image: radial-gradient(rgba(71, 85, 105, .55) 1px, transparent 0) !important;
}
body:has(#levelup-view:not(.hidden)) .tk-bg-glow { opacity: 0; }

#levelup-view#levelup-view { max-width: 1184px; padding: 84px 16px 96px !important; }
@media (max-width: 1023px) { #levelup-view#levelup-view { padding-top: 56px !important; } }
@media (max-width: 639px)  { #levelup-view#levelup-view { padding-top: 40px !important; } }

/* الرأس: الشارة + العنوان (يسار) والبطاقة (يمين) — البطاقة تحجز مكانها مثل المرجع */
#levelup-view > .relative:first-child { display: flex; flex-direction: column; gap: 12px; margin-bottom: 8px; }
@media (min-width: 1024px) { #levelup-view > .relative:first-child { min-height: 212px; } }
#levelup-view > .relative:first-child > div:nth-child(1),
#levelup-view > .relative:first-child > div:nth-child(2) { margin: 0 !important; }

#levelup-view > .relative:first-child > div:first-child > span {
  gap: 8px; padding: 6px 12px !important; border-radius: 8px !important;
  background: #ecfdf5 !important; color: #059669 !important;
  border: 1px solid rgba(167, 243, 208, .7) !important;
  box-shadow: 0 0 14px rgba(16, 185, 129, .18);
  font-family: var(--tkr-font-kufi, 'Cairo', sans-serif) !important; font-size: 10px !important; font-weight: 600 !important; letter-spacing: .025em;
}
#levelup-view > .relative:first-child > div:first-child > span > span:first-child {
  width: 6px !important; height: 6px !important; background: #10b981 !important;
  animation: tkrPulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
}
html.dark #levelup-view > .relative:first-child > div:first-child > span { background: rgba(16, 185, 129, .1) !important; color: #6ee7b7 !important; border-color: rgba(16, 185, 129, .25) !important; box-shadow: 0 0 18px rgba(16, 185, 129, .28); }
@media (max-width: 767px) { #levelup-view > .relative:first-child > div:first-child { display: none; } }

#levelup-view#levelup-view h1 {
  font-family: var(--tkr-font-ar, 'Tajawal', 'Cairo', sans-serif) !important; font-weight: 700 !important;
  font-size: 40px !important; line-height: 1 !important; letter-spacing: -.025em !important;
  color: #1e293b !important;
}
@media (min-width: 640px) { #levelup-view#levelup-view h1 { font-size: 60px !important; } }
@media (min-width: 768px) { #levelup-view#levelup-view h1 { font-size: 72px !important; } }
html.dark #levelup-view#levelup-view h1 { color: #f1f5f9 !important; }
@media (max-width: 767px) { #levelup-view > .relative:first-child { margin-bottom: 40px; } }

/* بطاقة «ما ستجده هنا» */
#levelup-view > .relative:first-child > div:nth-child(3) {
  width: 275px !important; padding: 0 !important; overflow: hidden;
  border-radius: 16px !important;
  border: 1px solid rgba(226, 232, 240, .6) !important;
  background: rgba(255, 255, 255, .92) !important;
  -webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1) !important;
  animation: tkLuFloatIn .6s cubic-bezier(.2, .8, .2, 1) both;
}
@keyframes tkLuFloatIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
#levelup-view > .relative:first-child > div:nth-child(3)::before {
  content: ''; display: block; height: 2.5px; width: 100%;
  background: linear-gradient(90deg, #10b981, #2dd4bf, #3b82f6);
}
html.dark #levelup-view > .relative:first-child > div:nth-child(3) { background: rgba(15, 23, 42, .9) !important; border-color: rgba(255, 255, 255, .07) !important; box-shadow: 0 8px 32px rgba(0, 0, 0, .35) !important; }
/* الرأس */
#levelup-view > .relative:first-child > div:nth-child(3) > div:first-child {
  gap: 10px !important; margin: 0 !important; padding: 14px 16px 12px !important;
  border-bottom: 1px solid #f1f5f9 !important;
}
html.dark #levelup-view > .relative:first-child > div:nth-child(3) > div:first-child { border-color: rgba(255, 255, 255, .05) !important; }
#levelup-view > .relative:first-child > div:nth-child(3) > div:first-child > div:first-child {
  width: 32px !important; height: 32px !important; border-radius: 12px !important;
  background: linear-gradient(135deg, rgba(16, 185, 129, .2), rgba(45, 212, 191, .1)) !important;
  border: 1px solid rgba(110, 231, 183, .3); color: #10b981 !important;
}
#levelup-view .tk-lu-head { display: flex; flex-direction: column; gap: 3px; }
#levelup-view .tk-lu-head > span { font-family: var(--tkr-font-ar, 'Tajawal', sans-serif) !important; font-size: 13px !important; font-weight: 700 !important; line-height: 1 !important; color: #1e293b !important; }
#levelup-view .tk-lu-sub { font-family: var(--tkr-font-kufi, 'Cairo', sans-serif); font-size: 10px; line-height: 1; color: #94a3b8; }
html.dark #levelup-view .tk-lu-head > span { color: #f1f5f9 !important; }
html.dark #levelup-view .tk-lu-sub { color: #64748b; }
/* القائمة: الأيقونة يمين ثم النص */
#levelup-view > .relative:first-child > div:nth-child(3) > div:last-child { padding: 14px 16px !important; }
#levelup-view > .relative:first-child > div:nth-child(3) > div:last-child > * + * { margin-top: 12px !important; }
#levelup-view > .relative:first-child > div:nth-child(3) > div:last-child > div {
  flex-direction: row-reverse; justify-content: flex-end !important; align-items: flex-start !important; gap: 10px !important;
}
#levelup-view > .relative:first-child > div:nth-child(3) > div:last-child > div > span {
  font-family: var(--tkr-font-kufi, 'Cairo', sans-serif) !important; font-size: 12px !important; line-height: 1.625 !important;
  color: #475569 !important; white-space: nowrap; padding-top: 2px;
}
html.dark #levelup-view > .relative:first-child > div:nth-child(3) > div:last-child > div > span { color: #cbd5e1 !important; }
#levelup-view > .relative:first-child > div:nth-child(3) > div:last-child > div > div {
  width: 30px !important; height: 30px !important; border-radius: 12px !important; margin-top: 2px;
}
#levelup-view > .relative:first-child > div:nth-child(3) > div:last-child > div:nth-child(1) > div { background: rgba(59, 130, 246, .1) !important; color: #3b82f6 !important; }
#levelup-view > .relative:first-child > div:nth-child(3) > div:last-child > div:nth-child(2) > div { background: rgba(139, 92, 246, .1) !important; color: #8b5cf6 !important; }
#levelup-view > .relative:first-child > div:nth-child(3) > div:last-child > div:nth-child(3) > div { background: rgba(249, 115, 22, .1) !important; color: #f97316 !important; }
#levelup-view > .relative:first-child > div:nth-child(3) svg { width: 13px !important; height: 13px !important; }
#levelup-view > .relative:first-child > div:nth-child(3) > div:first-child svg { width: 14px !important; height: 14px !important; }

/* B1 / B2 — كبسولة رمادية بزرين منفصلين (مثل المرجع) */
#levelup-view > div:has(> .tk-level-pill) { margin-bottom: 32px !important; }
#levelup-view .tk-level-pill.tk-level-pill {
  display: grid !important; grid-template-columns: 1fr 1fr; gap: 6px;
  width: 200px; height: auto !important; padding: 8px !important; border-radius: 16px !important;
  background: #f3f4f6 !important; box-shadow: 0 1px 2px rgba(0, 0, 0, .05) !important;
}
html.dark #levelup-view .tk-level-pill.tk-level-pill {
  background: rgba(255, 255, 255, .06) !important;
  box-shadow: inset 1px 1px 4px rgba(255, 255, 255, .2), inset -1px -1px 6px rgba(0, 0, 0, .3), 0 4px 12px rgba(0, 0, 0, .15) !important;
}
#levelup-view .tk-level-pill > button {
  height: auto !important; line-height: 24px !important;
  padding: 10px 16px !important; border-radius: 12px !important;
  font-family: var(--tkr-font-head, 'Outfit', sans-serif) !important; font-size: 16px !important; font-weight: 700 !important; letter-spacing: .025em;
  color: #000 !important; opacity: .6; background: transparent !important; box-shadow: none !important;
  transition: background-color .2s ease, opacity .2s ease, transform .2s ease, box-shadow .2s ease !important;
}
#levelup-view .tk-level-pill > button:hover { opacity: .9; }
#levelup-view .tk-level-pill > button.text-white {
  background: #10b981 !important; color: #fff !important; opacity: 1;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1) !important;
}
html.dark #levelup-view .tk-level-pill > button { color: rgba(255, 255, 255, .4) !important; opacity: 1; }
html.dark #levelup-view .tk-level-pill > button:hover { color: rgba(255, 255, 255, .75) !important; }
html.dark #levelup-view .tk-level-pill > button.text-white { color: #fff !important; }

/* بطاقات Teil 1 … Sprachbaustein 2 */
#levelup-view #levelup-grid, #levelup-view #levelup-skeleton { gap: 20px !important; margin-bottom: 24px; }
#levelup-view #levelup-grid:hover > .topic-card:not(:hover) { opacity: .6; }
#levelup-view #levelup-grid .topic-card {
  position: relative; display: flex; flex-direction: column; justify-content: flex-start !important;
  padding: 20px !important; border-radius: 16px !important;
  border: 2px solid rgba(253, 230, 138, .7) !important;
  background: rgba(255, 255, 255, .8) !important;
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .05) !important;
  transition: transform .3s cubic-bezier(.4, 0, .2, 1), box-shadow .3s cubic-bezier(.4, 0, .2, 1), border-color .3s ease, opacity .3s ease !important;
}
#levelup-view #levelup-grid .topic-card:hover {
  transform: translateY(-4px) scale(1.02); border-color: #fbbf24 !important;
  box-shadow: 0 20px 25px -5px rgba(245, 158, 11, .1), 0 8px 10px -6px rgba(245, 158, 11, .1) !important;
}
#levelup-view #levelup-grid .topic-card:active { transform: scale(.99); }
html.dark #levelup-view #levelup-grid .topic-card { background: #111827 !important; border-color: rgba(180, 83, 9, .4) !important; }
html.dark #levelup-view #levelup-grid .topic-card:hover { border-color: #f59e0b !important; }
/* السطر العلوي: الأيقونة + الشارات */
#levelup-view #levelup-grid .topic-card > div:first-child { align-items: flex-start !important; margin-bottom: 16px !important; }
#levelup-view #levelup-grid .topic-card > div:first-child > div:first-child {
  width: 44px !important; height: 44px !important; border-radius: 12px !important;
  background: rgba(245, 158, 11, .1) !important; color: #f59e0b !important;
}
#levelup-view #levelup-grid .topic-card > div:first-child > div:first-child svg { width: 20px !important; height: 20px !important; }
#levelup-view #levelup-grid .topic-card > div:first-child > div:last-child > span {
  font-family: var(--tkr-font-head, 'Outfit', sans-serif) !important; font-size: 10px !important; font-weight: 800 !important;
  padding: 2px 8px !important; border-radius: 6px !important; line-height: 16px;
}
#levelup-view #levelup-grid .topic-card > div:first-child > div:last-child > span:first-child { background: #f3f4f6 !important; color: #6b7280 !important; }
#levelup-view #levelup-grid .topic-card > div:first-child > div:last-child > span:last-child { background: #fef3c7 !important; color: #d97706 !important; border: 1px solid #fde68a; }
html.dark #levelup-view #levelup-grid .topic-card > div:first-child > div:last-child > span:first-child { background: rgba(51, 65, 85, .8) !important; color: #9ca3af !important; }
html.dark #levelup-view #levelup-grid .topic-card > div:first-child > div:last-child > span:last-child { background: rgba(120, 53, 15, .4) !important; color: #fbbf24 !important; border-color: rgba(180, 83, 9, .5); }
/* العنوان والوصف */
#levelup-view #levelup-grid .topic-card > div:nth-child(2) { margin-bottom: 20px !important; }
#levelup-view #levelup-grid .topic-card h3 {
  font-family: var(--tkr-font-head, 'Outfit', sans-serif) !important; font-size: 18px !important; font-weight: 700 !important; line-height: 1.25 !important;
  color: #d97706 !important; margin-bottom: 4px !important;
}
html.dark #levelup-view #levelup-grid .topic-card h3 { color: #fbbf24 !important; }
#levelup-view #levelup-grid .topic-card h3 + p {
  font-family: var(--tkr-font-kufi, 'Cairo', sans-serif) !important; font-size: 12px !important; color: #94a3b8 !important; text-align: left;
}
html.dark #levelup-view #levelup-grid .topic-card h3 + p { color: #64748b !important; }
/* الزر */
#levelup-view #levelup-grid .topic-card > button {
  margin-top: auto; padding: 12px !important; gap: 8px !important; border-radius: 12px !important;
  background: rgba(245, 158, 11, .1) !important; color: #d97706 !important;
  border: 1px solid #fde68a !important;
  font-family: var(--tkr-font-ar, 'Tajawal', sans-serif) !important; font-size: 14px !important; font-weight: 700 !important;
  transition: background-color .2s ease, transform .2s ease !important;
}
#levelup-view #levelup-grid .topic-card > button:hover { background: rgba(245, 158, 11, .2) !important; }
#levelup-view #levelup-grid .topic-card > button:active { transform: scale(.97); }
#levelup-view #levelup-grid .topic-card > button svg { width: 14px !important; height: 14px !important; }
html.dark #levelup-view #levelup-grid .topic-card > button { background: rgba(251, 191, 36, .1) !important; color: #fbbf24 !important; border-color: rgba(180, 83, 9, .5) !important; }

/* «امتحان كامل عشوائي» */
#levelup-view #levelup-full-card > div {
  margin-top: 0 !important; padding: 24px !important; gap: 16px !important;
  border-radius: 16px !important; border: 2px solid rgba(253, 230, 138, .7) !important;
  background: rgba(255, 255, 255, .8) !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .05) !important;
  transition: transform .3s cubic-bezier(.4, 0, .2, 1), box-shadow .3s ease, border-color .3s ease !important;
}
#levelup-view #levelup-full-card > div:hover {
  transform: translateY(-2px) scale(1.01); border-color: #fbbf24 !important;
  box-shadow: 0 10px 15px -3px rgba(245, 158, 11, .1), 0 4px 6px -4px rgba(245, 158, 11, .1) !important;
}
html.dark #levelup-view #levelup-full-card > div { background: rgba(30, 41, 59, .8) !important; border-color: rgba(180, 83, 9, .4) !important; }
#levelup-view #levelup-full-card > div > div:first-child { gap: 16px !important; }
#levelup-view #levelup-full-card > div > div:first-child > div:first-child {
  width: 48px !important; height: 48px !important; border-radius: 12px !important;
  background: rgba(245, 158, 11, .1) !important; color: #f59e0b !important;
}
#levelup-view #levelup-full-card > div > div:first-child > div:first-child svg { width: 22px !important; height: 22px !important; }
#levelup-view #levelup-full-card h3 {
  font-family: var(--tkr-font-ar, 'Tajawal', sans-serif) !important; font-size: 18px !important; font-weight: 700 !important; line-height: 1.25 !important;
  color: #d97706 !important; margin-bottom: 2px !important;
}
html.dark #levelup-view #levelup-full-card h3 { color: #fbbf24 !important; }
#levelup-view #levelup-full-card h3 + p { font-family: var(--tkr-font-kufi, 'Cairo', sans-serif) !important; font-size: 12px !important; color: #94a3b8 !important; white-space: normal; }
#levelup-view #levelup-full-card > div > span {
  font-family: var(--tkr-font-head, 'Outfit', sans-serif) !important; font-size: 11px !important; font-weight: 800 !important;
  padding: 6px 12px !important; border-radius: 12px !important;
  background: #fef3c7 !important; color: #d97706 !important; border: 1px solid #fde68a;
}
html.dark #levelup-view #levelup-full-card > div > span { background: rgba(120, 53, 15, .4) !important; color: #fbbf24 !important; border-color: rgba(180, 83, 9, .5); }

/* هيكل التحميل بنفس الشكل */
#levelup-view #levelup-skeleton > div { border-radius: 16px !important; border: 2px solid #f3f4f6 !important; box-shadow: none !important; }
html.dark #levelup-view #levelup-skeleton > div { border-color: #1f2937 !important; }

@media (max-width: 639px) {
  #levelup-view #levelup-full-card > div { padding: 18px !important; }
  #levelup-view #levelup-full-card h3 + p { font-size: 11px !important; }
}

/* ==========================================================================
   2) الصفحة الرئيسية
   ========================================================================== */
body:has(#home-view:not(.hidden)) .tk-bg-glow { opacity: .6; }
#home-view > main { padding-top: 72px !important; padding-bottom: 32px; }
@media (max-width: 1023px) { #home-view > main { padding-top: 48px !important; } }
@media (max-width: 639px)  { #home-view > main { padding-top: 28px !important; } }

/* --- البطل (Hero) --- */
#home-hero h1 {
  font-family: var(--tkr-font-ar, 'Tajawal', sans-serif) !important;
  font-weight: 400 !important; line-height: 1.25 !important; letter-spacing: 0 !important;
  color: #1f2937 !important;
  font-size: 34px !important;
}
@media (min-width: 640px) { #home-hero h1 { font-size: 42px !important; } }
@media (min-width: 1024px) { #home-hero h1 { font-size: 51px !important; } }
html.dark #home-hero h1 { color: #fff !important; }
#home-hero h1 .hero-accent {
  font-family: var(--tkr-font-head, 'Outfit', sans-serif) !important; font-weight: 500 !important;
  background: linear-gradient(90deg, #16a34a, #86efac) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  color: transparent !important; -webkit-text-fill-color: transparent !important;
}
#home-hero h1 .font-poppins:not(.hero-accent) { font-family: var(--tkr-font-head, 'Outfit', sans-serif) !important; font-weight: 400 !important; }
#home-hero p {
  font-family: var(--tkr-font-kufi, 'Cairo', sans-serif) !important;
  font-size: 15px !important; line-height: 1.75 !important; color: #475569 !important;
  max-width: 576px !important; margin-right: 0 !important;
}
html.dark #home-hero p { color: #cbd5e1 !important; }
#home-hero p .font-bold { color: #1e293b; }
html.dark #home-hero p .font-bold { color: #fff; }

/* الأزرار */
#home-hero .lg\:col-span-7 > div:last-child { gap: 12px !important; margin-right: 0 !important; justify-content: flex-end !important; }
@media (max-width: 639px) { #home-hero .lg\:col-span-7 > div:last-child { justify-content: center !important; } }
#home-hero .lg\:col-span-7 > div:last-child > button {
  padding: 16px 32px !important; border-radius: 16px !important;
  background: linear-gradient(90deg, #16a34a, #22c55e) !important;
  font-family: var(--tkr-font-ar, 'Tajawal', sans-serif) !important; font-size: 17px !important; font-weight: 700 !important;
  box-shadow: 0 10px 40px -10px rgba(22, 163, 74, .6) !important;
  transition: transform .3s ease, box-shadow .3s ease !important;
}
#home-hero .lg\:col-span-7 > div:last-child > button:hover { transform: translateY(-4px); box-shadow: 0 10px 40px -5px rgba(22, 163, 74, .8) !important; }
#home-hero .lg\:col-span-7 > div:last-child > button:active { transform: scale(.95); }
#home-hero .lg\:col-span-7 > div:last-child > a {
  padding: 16px 20px !important; border-radius: 16px !important;
  font-family: var(--tkr-font-ar, 'Tajawal', sans-serif) !important; font-size: 14px !important; font-weight: 700 !important;
  color: #334155 !important;
  transition: background-color .3s ease, transform .3s ease !important;
}
#home-hero .lg\:col-span-7 > div:last-child > a:hover { transform: translateY(-4px); }
#home-hero .lg\:col-span-7 > div:last-child > a[href*="wa.me"] { background: rgba(37, 211, 102, .1) !important; border: 1px solid rgba(37, 211, 102, .2) !important; }
#home-hero .lg\:col-span-7 > div:last-child > a[href*="wa.me"]:hover { background: rgba(37, 211, 102, .2) !important; }
#home-hero .lg\:col-span-7 > div:last-child > a[href="#telegram"] { background: rgba(38, 165, 228, .1) !important; border: 1px solid rgba(38, 165, 228, .2) !important; }
#home-hero .lg\:col-span-7 > div:last-child > a[href="#telegram"]:hover { background: rgba(38, 165, 228, .2) !important; }
html.dark #home-hero .lg\:col-span-7 > div:last-child > a { color: #e2e8f0 !important; }
html.dark #home-hero .lg\:col-span-7 > div:last-child > a[href*="wa.me"] { background: rgba(37, 211, 102, .05) !important; border-color: rgba(37, 211, 102, .15) !important; }
html.dark #home-hero .lg\:col-span-7 > div:last-child > a[href="#telegram"] { background: rgba(38, 165, 228, .05) !important; border-color: rgba(38, 165, 228, .15) !important; }

/* الشهادة: ظل أنعم */
#home-hero .certificate-sheet { box-shadow: 0 30px 60px -20px rgba(15, 23, 42, .25), 0 12px 24px -12px rgba(15, 23, 42, .15) !important; border-color: rgba(226, 232, 240, .8) !important; }

/* --- عناوين الأقسام --- */
#home-view section > h2, #home-view #trust-stats-section > div:first-child > h2 {
  position: relative;
  font-family: var(--tkr-font-ar, 'Tajawal', sans-serif) !important; font-weight: 400 !important;
  letter-spacing: -.01em; line-height: 1.375 !important; color: #1e293b !important;
}
#home-view section:not(#trust-stats-section) > h2 { font-size: 30px !important; }
@media (min-width: 768px) { #home-view section:not(#trust-stats-section) > h2 { font-size: 52px !important; } }
#home-view section:not(#trust-stats-section) > h2 > span {
  font-family: var(--tkr-font-head, 'Outfit', sans-serif) !important; font-weight: 700 !important;
  background: none !important; -webkit-background-clip: border-box !important; background-clip: border-box !important;
  color: #16a34a !important; -webkit-text-fill-color: #16a34a !important;
}
html.dark #home-view section:not(#trust-stats-section) > h2 > span { color: #4ade80 !important; -webkit-text-fill-color: #4ade80 !important; }
#home-view section:not(#trust-stats-section) > h2::before {
  content: ''; position: absolute; left: 50%; top: 50%; width: 128px; height: 128px; z-index: -1;
  transform: translate(-50%, -50%); border-radius: 50%;
  background: rgba(74, 222, 128, .2); filter: blur(60px); pointer-events: none;
}
html.dark #home-view section > h2, html.dark #home-view #trust-stats-section > div:first-child > h2 { color: #fff !important; }

/* --- بطاقات «لماذا Telkini» (زجاج أبيض بزوايا 40px مثل المرجع) --- */
#home-view .lf-card.lf-card {
  position: relative; overflow: hidden;
  padding: 32px !important; border-radius: 40px !important;
  background: rgba(255, 255, 255, .6) !important;
  -webkit-backdrop-filter: blur(24px) !important; backdrop-filter: blur(24px) !important;
  border: 1px solid rgba(255, 255, 255, .5) !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, .04) !important;
  transition: transform .5s cubic-bezier(.2, .8, .2, 1), box-shadow .5s ease !important;
}
@media (min-width: 768px) { #home-view .lf-card.lf-card { padding: 40px !important; } }
#home-view .lf-card.lf-card:hover { transform: translateY(-8px); box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25) !important; }
#home-view .lf-card.lf-card::after {
  content: ''; position: absolute; left: -80px; bottom: -80px; width: 192px; height: 192px; z-index: 0;
  border-radius: 50%; background: rgba(34, 197, 94, .1); filter: blur(50px); pointer-events: none;
  transition: background-color .5s ease;
}
#home-view .lf-card.lf-amber::after { background: rgba(245, 158, 11, .1); }
#home-view .lf-card.lf-card:hover::after { background: rgba(34, 197, 94, .2); }
#home-view .lf-card.lf-amber:hover::after { background: rgba(245, 158, 11, .2); }
#home-view .lf-card.lf-card > * { position: relative; z-index: 1; }
html.dark #home-view .lf-card.lf-card { background: rgba(15, 23, 42, .5) !important; border-color: rgba(51, 65, 85, .5) !important; box-shadow: 0 8px 30px rgba(0, 0, 0, .2) !important; }
/* الأيقونة يمين ثم العنوان */
#home-view .lf-card > div:first-child > div:first-child {
  flex-direction: row-reverse; justify-content: flex-end !important; gap: 16px; margin-bottom: 24px !important;
}
#home-view .lf-card .feature-icon {
  width: 56px !important; height: 56px !important; border-radius: 16px !important; flex-shrink: 0;
  background: #dcfce7 !important; color: #16a34a !important;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, .05);
}
#home-view .lf-card .feature-icon.icon-amber { background: #fef3c7 !important; color: #d97706 !important; }
html.dark #home-view .lf-card .feature-icon { background: rgba(20, 83, 45, .3) !important; color: #4ade80 !important; }
html.dark #home-view .lf-card .feature-icon.icon-amber { background: rgba(120, 53, 15, .3) !important; color: #fbbf24 !important; }
#home-view .lf-card h3 {
  font-family: var(--tkr-font-ar, 'Tajawal', sans-serif) !important; font-weight: 700 !important;
  font-size: 22px !important; line-height: 1.3 !important; color: #1e293b !important;
}
@media (min-width: 768px) { #home-view .lf-card h3 { font-size: 26px !important; } }
html.dark #home-view .lf-card h3 { color: #fff !important; }
#home-view .lf-card > div:first-child > p {
  font-family: var(--tkr-font-kufi, 'Cairo', sans-serif) !important;
  font-size: 15px !important; line-height: 1.85 !important; color: #475569 !important;
}
@media (min-width: 768px) { #home-view .lf-card > div:first-child > p { font-size: 16px !important; } }
html.dark #home-view .lf-card > div:first-child > p { color: #cbd5e1 !important; }
/* أزرار المجموعات داخل البطاقة */
#home-view .lf-card > div:last-child { border-top: 0 !important; padding-top: 0 !important; }
#home-view .lf-card a[href*="wa.me"] { background: rgba(37, 211, 102, .1) !important; color: #16a34a !important; border: 0 !important; border-radius: 12px !important; font-family: var(--tkr-font-kufi, 'Cairo', sans-serif); font-size: 13px !important; transition: background-color .3s ease !important; }
#home-view .lf-card a[href*="wa.me"]:hover { background: rgba(37, 211, 102, .2) !important; }
#home-view .lf-card a[href="#telegram"] { background: rgba(38, 165, 228, .1) !important; color: #0284c7 !important; border: 0 !important; border-radius: 12px !important; font-family: var(--tkr-font-kufi, 'Cairo', sans-serif); font-size: 13px !important; transition: background-color .3s ease !important; }
#home-view .lf-card a[href="#telegram"]:hover { background: rgba(38, 165, 228, .2) !important; }
html.dark #home-view .lf-card a[href*="wa.me"] { color: #25d366 !important; }
html.dark #home-view .lf-card a[href="#telegram"] { color: #38bdf8 !important; }
#home-view .lf-thumb { border-radius: 16px !important; }

/* --- قسم الثقة والأرقام --- */
#trust-stats-section > div:first-child > span {
  padding: 6px 14px !important; border-radius: 9999px !important;
  border: 1px solid rgba(167, 243, 208, .7);
  font-family: var(--tkr-font-kufi, 'Cairo', sans-serif); font-size: 11px !important; font-weight: 600 !important;
  box-shadow: 0 0 14px rgba(16, 185, 129, .18);
}
#trust-stats-section > div:first-child > h2 { font-size: 30px !important; }
@media (min-width: 768px) { #trust-stats-section > div:first-child > h2 { font-size: 42px !important; } }
#trust-stats-section > div:first-child > p { font-family: var(--tkr-font-kufi, 'Cairo', sans-serif); }
#trust-stats-section > div.grid > div {
  padding: 28px 24px !important; border-radius: 24px !important;
  background: rgba(255, 255, 255, .7) !important; border: 1px solid rgba(226, 232, 240, .8) !important;
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  box-shadow: 0 8px 30px rgba(0, 0, 0, .04);
  transition: transform .4s cubic-bezier(.2, .8, .2, 1), box-shadow .4s ease;
}
#trust-stats-section > div.grid > div:hover { transform: translateY(-4px); box-shadow: 0 20px 40px -12px rgba(0, 0, 0, .12); }
#trust-stats-section > div.grid > div > h3 { font-family: var(--tkr-font-head, 'Outfit', sans-serif) !important; font-weight: 700 !important; font-size: 40px !important; letter-spacing: -.02em; }
#trust-stats-section > div.grid > div > p { font-family: var(--tkr-font-kufi, 'Cairo', sans-serif); }
html.dark #trust-stats-section > div.grid > div { background: rgba(15, 23, 42, .5) !important; border-color: rgba(51, 65, 85, .5) !important; box-shadow: 0 8px 30px rgba(0, 0, 0, .2); }

/* --- الوصول السريع للأقسام (بنفس بطاقات Lesen) --- */
#trust-stats-section > div[dir="rtl"] h3 { font-family: var(--tkr-font-ar, 'Tajawal', sans-serif) !important; font-weight: 700 !important; }
#trust-stats-section > div[dir="rtl"] > div:first-child > div > span:first-child {
  border: 1px solid rgba(167, 243, 208, .7); padding: 4px 12px !important; border-radius: 8px !important;
  font-family: var(--tkr-font-kufi, 'Cairo', sans-serif); font-size: 10.5px !important;
}
#trust-stats-section > div[dir="rtl"] > div:first-child > button {
  height: 42px; padding: 0 16px !important; border-radius: 16px !important;
  background: #f3f4f6 !important; color: rgba(0, 0, 0, .55) !important;
  font-family: var(--tkr-font-ar, 'Tajawal', sans-serif); font-size: 13px !important;
}
#trust-stats-section > div[dir="rtl"] > div:first-child > button:hover { background: rgba(229, 231, 235, .6) !important; color: #059669 !important; }
html.dark #trust-stats-section > div[dir="rtl"] > div:first-child > button { background: rgba(255, 255, 255, .06) !important; color: #d1d5db !important; }
#trust-stats-section .topic-card.topic-card {
  padding: 20px !important; border-radius: 16px !important;
  border: 2px solid #e5e7eb !important; background: #fff !important;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1) !important;
  transition: transform .3s cubic-bezier(.4, 0, .2, 1), box-shadow .3s ease, border-color .3s ease !important;
}
#trust-stats-section .topic-card.topic-card:hover {
  transform: translateY(-4px) scale(1.01); border-color: #6ee7b7 !important;
  box-shadow: 0 20px 25px -5px rgba(16, 185, 129, .1), 0 8px 10px -6px rgba(16, 185, 129, .1) !important;
}
#trust-stats-section .topic-card h4 { font-family: var(--tkr-font-head, 'Outfit', sans-serif) !important; font-weight: 700 !important; font-size: 18px !important; transition: color .2s ease; }
#trust-stats-section .topic-card h4.font-cairo { font-family: var(--tkr-font-ar, 'Tajawal', sans-serif) !important; }
#trust-stats-section .topic-card:hover h4 { color: #10b981 !important; }
#trust-stats-section .topic-card p { font-family: var(--tkr-font-kufi, 'Cairo', sans-serif); font-size: 12px !important; line-height: 1.75 !important; color: #6b7280 !important; }
#trust-stats-section .topic-card > div:last-child { border-color: #f3f4f6 !important; font-family: var(--tkr-font-kufi, 'Cairo', sans-serif); }
html.dark #trust-stats-section .topic-card.topic-card { background: #111827 !important; border-color: #1f2937 !important; }
html.dark #trust-stats-section .topic-card.topic-card:hover { border-color: #047857 !important; }
html.dark #trust-stats-section .topic-card p { color: #9ca3af !important; }
html.dark #trust-stats-section .topic-card > div:last-child { border-color: rgba(51, 65, 85, .6) !important; }

/* حركة دخول ناعمة للأقسام (تحترم «تقليل الحركة») */
@media (prefers-reduced-motion: reduce) {
  #levelup-view > .relative:first-child > div:nth-child(3), #home-view .lf-card.lf-card, #trust-stats-section > div.grid > div,
  #levelup-view #levelup-grid .topic-card, #trust-stats-section .topic-card { animation: none !important; transition: none !important; }
  #levelup-view #levelup-grid .topic-card:hover, #home-view .lf-card.lf-card:hover { transform: none; }
}
