/* ═══════════════════════════════════════════════════════════════════════
   wn-polish.css — طبقة الصقل المشتركة (وناااسة)
   ───────────────────────────────────────────────────────────────────────
   كانت هذي الكتل الست محبوسة داخل <style> في dashboard.html وحده، فالصفحة
   العامة (Landing) — أول ما يشوفه الزائر الجديد — كانت تطلع بلا أي منها:
   بلا حلقات تركيز، بلا سكيلتون، بلا خلفية دافئة، بلا تنقّل سفلي بالجوال،
   وبلا ماسكوت بالجوال. استُخرجت هنا 2026-07-26 لتُحمَّل بالصفحتين معاً.
   ⚠️ الترتيب مقصود ويطابق ترتيبها الأصلي — لا تعيد ترتيبه.
   ⚠️ يجب تحميله **بعد** dash2.css وlanding.css (يعتمد على الفوز بالتساوي).
   ═══════════════════════════════════════════════════════════════════════ */

/* ══════════ wnMotionV4 ══════════ */
:root { --mo-spring: cubic-bezier(.34, 1.56, .64, 1); }

  /* ── 1) تتابع الهيدر عند التحميل ── */
  .wa-logo-wrap, .wa-nav, .wa-hdr-actions { animation: moDrop .5s var(--mo-spring) backwards; }
  .wa-nav { animation-delay: .08s; }
  .wa-hdr-actions { animation-delay: .16s; }
  @keyframes moDrop { from { opacity: 0; translate: 0 -14px; } }

  /* ── 2) الهيرو: ختم العنوان + «صفعة الستيكر» لكلمة وناااسة ── */
  .wa-eyebrow { animation: moRise .5s var(--mo-spring) .05s backwards; }
  .wa-hero-title { animation: moStamp .6s var(--mo-spring) .15s backwards; }
  .wa-hero-word { display: inline-block; animation: moSlap .6s var(--mo-spring) .5s backwards; }
  .wa-hero-sub { animation: moRise .55s var(--mo-spring) .62s backwards; }
  .wa-hero-cta { animation: moRise .55s var(--mo-spring) .74s backwards; }
  @keyframes moRise { from { opacity: 0; translate: 0 16px; } }
  @keyframes moStamp {
    0% { opacity: 0; scale: 1.18; rotate: 2deg; }
    60% { opacity: 1; }
    100% { scale: 1; rotate: 0deg; }
  }
  @keyframes moSlap {
    0% { opacity: 0; scale: 1.6; rotate: -8deg; }
    70% { opacity: 1; scale: .96; rotate: 1.5deg; }
    100% { opacity: 1; scale: 1; rotate: 0deg; }
  }

  /* ── 3) الماسكوت حيّ: طفو دائم + تمايل دوري، والنجوم تومض ── */
  .wa-mascot-img {
    animation: moFloat 4.2s ease-in-out infinite, moWiggle 9s ease-in-out 3s infinite;
    transform-origin: 50% 82%;
  }
  @keyframes moFloat { 0%, 100% { translate: 0 0; } 50% { translate: 0 -10px; } }
  @keyframes moWiggle {
    0%, 86%, 100% { rotate: 0deg; }
    89% { rotate: 2.6deg; } 93% { rotate: -2.2deg; } 97% { rotate: 1.2deg; }
  }
  .wa-mascot-star { animation: moTwinkle 2.8s ease-in-out infinite; }
  .wa-mascot-star--2 { animation-delay: .6s; }
  .wa-mascot-star--3 { animation-delay: 1.2s; }
  @keyframes moTwinkle { 0%, 100% { opacity: .5; scale: 1; } 50% { opacity: 1; scale: 1.3; } }

  /* ── 4) بطاقات الألعاب: قفزة دخول متدرجة (تعمل مع كل فلترة لأن العقد جديدة) ── */
  .wa-games-section.is-in .gcard { animation: moPop .55s var(--mo-spring) backwards; }
  .wa-grid > :nth-child(1)  { animation-delay: .02s; }
  .wa-grid > :nth-child(2)  { animation-delay: .07s; }
  .wa-grid > :nth-child(3)  { animation-delay: .12s; }
  .wa-grid > :nth-child(4)  { animation-delay: .17s; }
  .wa-grid > :nth-child(5)  { animation-delay: .22s; }
  .wa-grid > :nth-child(6)  { animation-delay: .27s; }
  .wa-grid > :nth-child(7)  { animation-delay: .32s; }
  .wa-grid > :nth-child(8)  { animation-delay: .37s; }
  .wa-grid > :nth-child(9)  { animation-delay: .42s; }
  .wa-grid > :nth-child(10) { animation-delay: .47s; }
  .wa-grid > :nth-child(11) { animation-delay: .52s; }
  .wa-grid > :nth-child(12) { animation-delay: .57s; }
  @keyframes moPop {
    0% { opacity: 0; translate: 0 22px; scale: .95; rotate: -1.2deg; }
    100% { opacity: 1; translate: 0 0; scale: 1; rotate: 0deg; }
  }

  /* ── 5) هوفر فيزيائي إضافي ── */
  .gcard { transition: rotate .35s var(--mo-spring); }
  .gcard:hover { rotate: -.6deg; }
  .gcard:hover .gcard-badge { animation: moBadge .45s var(--mo-spring); }
  @keyframes moBadge { 50% { rotate: -5deg; scale: 1.1; } }
  .gcard-play svg { transition: translate .3s var(--mo-spring); }
  .gcard-play:hover svg { translate: -4px 0; }

  /* ── 6) سحق-وتمدد عند الضغط (فلاتر/أزرار) + «ثونك» للفلتر المختار ── */
  .wa-filter:active, .wa-sort-btn:active, .btn-pri:active, .wa-cats-more:active, .wa-empty-cta:active {
    animation: moSquash .28s var(--mo-spring);
  }
  @keyframes moSquash { 40% { scale: 1.08 .9; } 100% { scale: 1 1; } }
  .wa-filter.is-active, .wa-sort-btn.is-active { animation: moThunk .35s var(--mo-spring); }
  @keyframes moThunk { 0% { scale: .9; } 60% { scale: 1.07; } 100% { scale: 1; } }

  /* ── 7) چيب الرصيد يقفز عند تغيّر الرصيد + الهدية تلوّح كل ~11 ثانية ── */
  .wa-tickets.is-bump { animation: moBump .6s var(--mo-spring); }
  @keyframes moBump {
    30% { scale: 1.16; rotate: -3deg; }
    60% { scale: .97; rotate: 2deg; }
    100% { scale: 1; rotate: 0deg; }
  }
  .wa-icbtn svg { animation: moWave 11s ease-in-out 5s infinite; transform-origin: 50% 85%; }
  @keyframes moWave {
    0%, 91%, 100% { rotate: 0deg; }
    93% { rotate: 14deg; } 95.5% { rotate: -10deg; } 98% { rotate: 6deg; }
  }

  /* ── 8) سهم الـCTA «يدعو» كل ~3.5 ثانية + نجوم الشريط الختامي تومض ── */
  .wa-hero-cta .btn-pri svg, .wa-cta-strip .btn-pri svg { animation: moNudge 3.5s ease-in-out 2s infinite; }
  @keyframes moNudge {
    0%, 86%, 100% { translate: 0 0; }
    90% { translate: -5px 0; } 95% { translate: 2px 0; }
  }
  .wa-cta-star { animation: moTwinkle 3.2s ease-in-out infinite; }
  .wa-cta-star--2 { animation-delay: .7s; }
  .wa-cta-star--3 { animation-delay: 1.4s; }

  /* ── 9) إحصاءات تتنفس مرة عند الظهور ── */
  .wa-quickstats.is-in .wa-qstat { animation: moPop .5s var(--mo-spring) backwards; }
  .wa-quickstats .wa-qstat:nth-child(2) { animation-delay: .08s; }
  .wa-quickstats .wa-qstat:nth-child(3) { animation-delay: .16s; }
  .wa-quickstats .wa-qstat:nth-child(4) { animation-delay: .24s; }

  /* ── 10) احترام تقليل الحركة: إطفاء كامل ── */
  @media (prefers-reduced-motion: reduce) {
    .wa-logo-wrap, .wa-nav, .wa-hdr-actions,
    .wa-eyebrow, .wa-hero-title, .wa-hero-word, .wa-hero-sub, .wa-hero-cta,
    .wa-mascot-img, .wa-mascot-star,
    .wa-games-section.is-in .gcard, .wa-quickstats.is-in .wa-qstat,
    .gcard, .gcard-play svg, .gcard:hover .gcard-badge,
    .wa-filter.is-active, .wa-sort-btn.is-active, .wa-tickets.is-bump,
    .wa-icbtn svg, .wa-hero-cta .btn-pri svg, .wa-cta-strip .btn-pri svg, .wa-cta-star {
      animation: none !important; transition: none !important;
    }
  }

/* ══════════ wnUiuxV2 ══════════ */
/* ═══ §1 skip-link — يظهر فقط بتركيز الكيبورد، بهوية الحبر ═══ */
  .wn-skip {
    position: fixed; top: 12px; inset-inline-start: 12px; z-index: 10000;
    background: var(--cta, #f9d82e); color: var(--ink, #2c3e50);
    border: 2.5px solid var(--ink, #2c3e50); border-radius: 999px;
    box-shadow: 3px 3px 0 var(--ink, #2c3e50);
    padding: 10px 18px; font-weight: 800; font-size: 14px; text-decoration: none;
    transform: translateY(-220%); transition: transform .3s var(--mo-spring, ease);
  }
  .wn-skip:focus-visible { transform: translateY(0); outline: none; }

  /* ═══ §1 focus-states — حلقة صفراء على-هوية لكل تفاعلي ═══ */
  :is(a, button, [role="tab"], [tabindex]:not([tabindex="-1"])):focus-visible {
    outline: 3px solid var(--cta, #f9d82e);
    outline-offset: 2px;
  }

  /* ═══ §2 touch-target-size + tap-delay ═══
     (زر الهدية .wa-icbtn مستثنى — يبقى دائرة بمقاسه الأصلي الجميل) */
  .wa-filter, .wa-sort-btn, .btn-sm, .wa-cats-more, .wa-empty-cta {
    min-height: 44px; touch-action: manipulation;
  }
  .wa-icbtn { touch-action: manipulation; position: relative; }
  .wa-icbtn::after { content: ""; position: absolute; inset: -5px; border-radius: 50%; }

  /* ═══ §2 press-feedback — الضغطة «تنغرز» بالظل (نيو-بروتاليست أصيل) ═══ */
  .wa-filter:active, .wa-sort-btn:active, .wa-cats-more:active,
  .btn-pri:active, .btn-sm:active, .wa-empty-cta:active, .gcard-play:active {
    translate: 2px 2px;
    box-shadow: 1px 1px 0 var(--ink, #2c3e50) !important;
  }

  /* ═══ §6 number-tabular — أرقام ثابتة العرض (لا اهتزاز) ═══ */
  .wa-tickets-count, .wa-filter-count, .wa-cats-more em, .wa-notif-dot, .wa-notif-badge {
    font-variant-numeric: tabular-nums;
  }

  /* ═══ §5 مراسي ثابتة — العناوين ما تنغرز تحت الهيدر اللاصق ═══ */
  #games, #categories, #testimonials { scroll-margin-top: 96px; }

  /* ═══ §3 progressive-loading — سكيلتون شيمر بهوية البطاقات ═══ */
  .wn-skel-card {
    background: var(--surface, #fffbf2);
    border: 2.5px solid var(--ink, #2c3e50);
    border-radius: 18px;
    box-shadow: 4px 4px 0 var(--ink, #2c3e50);
    overflow: hidden;
    min-height: 320px;
    display: flex; flex-direction: column;
  }
  .wn-skel-img {
    height: 170px; flex-shrink: 0;
    background: var(--surface-2, #f4ead8);
    border-bottom: 2.5px solid var(--ink, #2c3e50);
    position: relative; overflow: hidden;
  }
  .wn-skel-body { padding: 16px; display: flex; flex-direction: column; gap: 12px; }
  .wn-skel-line {
    height: 14px; border-radius: 7px;
    background: var(--surface-2, #f4ead8);
    position: relative; overflow: hidden;
  }
  .wn-skel-line--w60 { width: 60%; }
  .wn-skel-img::after, .wn-skel-line::after {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(105deg, transparent 30%, rgba(255,255,255,.55) 50%, transparent 70%);
    translate: -100% 0;
    animation: wnShimmer 1.3s ease-in-out infinite;
  }
  @keyframes wnShimmer { to { translate: 100% 0; } }

  /* ═══ قارئ شاشة فقط ═══ */
  .wn-vh {
    position: absolute; width: 1px; height: 1px; margin: -1px;
    clip-path: inset(50%); overflow: hidden; white-space: nowrap;
  }

  /* ═══ §1 reduced-motion — إطفاء إضافات V2 ═══ */
  @media (prefers-reduced-motion: reduce) {
    .wn-skel-img::after, .wn-skel-line::after { animation: none; }
    .wn-skip { transition: none; }
    .wa-filter:active, .wa-sort-btn:active, .wa-cats-more:active,
    .btn-pri:active, .btn-sm:active, .wa-empty-cta:active, .gcard-play:active { translate: 0 0; }
  }

/* ══════════ wnSegbarV5 ══════════ */
.wa-filters {
    position: relative;
    display: inline-flex;
    gap: 2px;
    background: var(--surface, #fffbf2);
    border: 2.5px solid var(--ink, #2c3e50);
    border-radius: 999px;
    box-shadow: 4px 4px 0 var(--ink, #2c3e50);
    padding: 5px;
    max-width: 100%;
    overflow-x: auto;
    scrollbar-width: none;
    flex-wrap: nowrap;                 /* جوال: صف واحد يندفع أفقياً (iOS) بدل لخبطة صفّين */
    -webkit-overflow-scrolling: touch;
  }
  .wa-filters::-webkit-scrollbar { display: none; }
  .wa-filter { flex: 0 0 auto; }

  /* الإبهام المنزلق — قلب الفكرة */
  .wn-seg-thumb {
    position: absolute;
    top: 5px; left: 0;
    height: calc(100% - 10px);
    width: 80px;
    background: var(--cta, #f9d82e);
    border: 2px solid var(--ink, #2c3e50);
    border-radius: 999px;
    box-shadow: 2px 2px 0 var(--ink, #2c3e50);
    opacity: 0;
    transition:
      transform .5s var(--mo-spring, cubic-bezier(.34,1.56,.64,1)),
      width .5s var(--mo-spring, cubic-bezier(.34,1.56,.64,1)),
      opacity .2s ease;
    will-change: transform, width;
    pointer-events: none;
    z-index: 0;
  }

  /* العناصر فوق الإبهام — بلا صناديقها القديمة */
  .wa-filter {
    position: relative; z-index: 1;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 999px !important;
    color: var(--ink, #2c3e50) !important;
    opacity: .72;
    transition: opacity .25s ease;
    white-space: nowrap;
  }
  .wa-filter:hover { opacity: 1; transform: none !important; }
  .wa-filter.is-active { opacity: 1; animation: none; }

  /* العدّادات: المختار = حبر على الأصفر، الباقي = إطار خفيف */
  .wa-filter .wa-filter-count {
    background: transparent !important;
    border: 1.5px solid var(--ink, #2c3e50) !important;
    color: var(--ink, #2c3e50) !important;
    box-shadow: none !important;
    transition: background .3s ease, color .3s ease;
  }
  .wa-filter.is-active .wa-filter-count {
    background: var(--ink, #2c3e50) !important;
    color: var(--cta, #f9d82e) !important;
  }

  /* الضغطة تنغرز داخل الكبسولة (بدل غرزة الظل الخارجية) */
  .wa-filter:active { translate: 0 1px; box-shadow: none !important; }

  @media (prefers-reduced-motion: reduce) {
    .wn-seg-thumb { transition: opacity .2s ease; }
  }

/* ══════════ wnBgV6 ══════════ */
body::before {
    content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
    background:
      radial-gradient(620px 420px at 88% 6%,  rgba(249,216,46,.16), transparent 70%),
      radial-gradient(560px 420px at 8% 32%,  rgba(233,138,37,.10), transparent 70%),
      radial-gradient(640px 480px at 80% 88%, rgba(44,62,80,.05),   transparent 70%);
  }

/* ══════════ wnVisualV7b ══════════ */
body { font-synthesis: none; }
  .brand-font { font-weight: normal !important; letter-spacing: 0 !important; }
  .wa-hero-title { line-height: 1.08 !important; letter-spacing: 0 !important; }

/* ══════════ wnExtraV9 ══════════ */
/* ── ⑧ التذكرة المثقوبة: ثقبا قَصّ حقيقيان + ظل يتبع الشكل (drop-shadow يحترم الـmask) ── */
  .wa-tickets, .gcard-price {
    -webkit-mask:
      radial-gradient(circle 7px at 0 50%,   transparent 6.5px, #000 7px),
      radial-gradient(circle 7px at 100% 50%, transparent 6.5px, #000 7px);
    -webkit-mask-composite: source-in;
    mask:
      radial-gradient(circle 7px at 0 50%,   transparent 6.5px, #000 7px),
      radial-gradient(circle 7px at 100% 50%, transparent 6.5px, #000 7px);
    mask-composite: intersect;
    box-shadow: none !important;
    filter: drop-shadow(3px 3px 0 var(--ink, #2c3e50));
  }
  .gcard-price { filter: drop-shadow(2px 2px 0 var(--ink, #2c3e50)); }
  .wa-tickets { padding-inline: 18px !important; }
  .wa-tickets-label {
    border-inline-start: 2px dashed rgba(44, 62, 80, .4);
    padding-inline-start: 9px; margin-inline-start: 7px;
  }

  /* شارات البطاقات: أيقونة SVG محاذية للنص */
  .gcard-badge svg { width: .95em; height: .95em; vertical-align: -.12em; margin-inline-start: 3px; }

/* ══════════ wnRespV10 ══════════ */
/* ① التنقّل السفلي */
  .wn-bnav {
    position: fixed; inset-inline: 12px;
    bottom: calc(10px + env(safe-area-inset-bottom, 0px));
    z-index: 900; display: none; gap: 4px;
    background: var(--surface, #fffbf2);
    border: 2.5px solid var(--ink, #2c3e50);
    border-radius: 18px;
    box-shadow: 4px 4px 0 var(--ink, #2c3e50);
    padding: 6px;
  }
  .wn-bnav a {
    flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 3px; padding: 7px 4px; min-height: 44px;
    border-radius: 12px; text-decoration: none;
    color: var(--ink, #2c3e50); font-weight: 800; font-size: 11px;
  }
  .wn-bnav a svg { width: 21px; height: 21px; }
  .wn-bnav a.is-active { background: var(--cta, #f9d82e); box-shadow: 2px 2px 0 var(--ink, #2c3e50); }
  .wn-bnav a:active { translate: 1px 1px; }
  @media (max-width: 720px) {
    .wn-bnav { display: flex; }
    body { padding-bottom: 96px; }
    .wa-fab { bottom: calc(96px + env(safe-area-inset-bottom, 0px)) !important; }
  }
  /* ② التابلت: رجّع روابط الهيدر النصية (كانت تختفي بلا بديل من 1040) */
  @media (min-width: 721px) and (max-width: 1040px) {
    .wa-nav { display: flex !important; gap: 14px; }
    .wa-nav-link { font-size: 13.5px; }
    .wa-tickets-label, .wa-profile-greet { display: none; }
  }
  /* ③ الماسكوت المصغّر: يطفو فوق عنوان الهيرو لما يختفي الكبير */
  @media (max-width: 1040px) {
    .wa-hero-left::before {
      content: ""; display: block;
      width: 126px; aspect-ratio: 707 / 492;
      margin: 0 auto 10px;
      background: url('assets/mascot.webp') center / contain no-repeat;
      animation: moFloat 4.2s ease-in-out infinite;
      filter: drop-shadow(0 10px 14px rgba(44, 62, 80, .18));
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .wa-hero-left::before { animation: none !important; }
  }

/* ══════════════════════════════════════════════════════════════════════════
   wnRhythmV11 — بنود اليو-إكس من المراجعة البصرية 2026-07-26
   يُحمَّل آخر ملف، فالمحدّدات العادية تكفي (بلا !important).
   ══════════════════════════════════════════════════════════════════════════ */

/* ── ① إيقاع رأسي من درجتين ──────────────────────────────────────────────
   كان: ١١٩ / ١٥٢ / ١٥٩ / ٦٤px بين الأقسام — ثلاث متقاربة بلا سبب وواحدة نصفها،
   فالشريط الختامي يبان ملزوقاً بينما البقية تطفو. السبب: `.wa-main` فيه gap
   والأقسام تضيف هوامشها فوقه فتتراكم. الآن الفجوة وحدها تحكم:
   ٩٦px بين الأقسام المترابطة · ١٤٤px قبل تغيّر الموضوع. */
:root { --wn-rhythm: 96px; --wn-rhythm-lg: 144px; }
.wa-main { gap: var(--wn-rhythm); }
.wa-cats-section { margin-block: 0; }
.ln-how, .ln-faq, .ln-test { margin-top: 0; }
/* التقييمات = انتقال من «المنتج» إلى «دليل الناس» ⇒ الدرجة الأكبر */
.ln-test { margin-top: calc(var(--wn-rhythm-lg) - var(--wn-rhythm)); }
@media (max-width: 720px) { :root { --wn-rhythm: 56px; --wn-rhythm-lg: 84px; } }

/* ── ② شريط التصنيفات: إشارة «فيه بعد» ────────────────────────────────────
   ٥١ بطاقة × ١٦٨px ≈ ٨٬٥٧٠px، والظاهر ~٧ ⇒ ٤٤ تصنيفاً مخفياً بلا أي دليل بصري
   على أن الشريط ينسحب. تدرّج تلاشٍ على الحافة اليسرى يقطع بطاقة نصفين =
   أوضح إشارة بأقل ضجيج. يختفي عند نهاية التمرير (JS يضبط data-wn-end). */
.wa-cats-strip-wrap::after {
  content: ""; position: absolute; inset-block: 0; inset-inline-end: auto;
  left: 0; width: 56px; pointer-events: none; z-index: 2;
  background: linear-gradient(to left, transparent, var(--bg, #faf9f7) 82%);
  opacity: 1; transition: opacity .25s ease;
}
.wa-cats-strip-wrap[data-wn-end="1"]::after { opacity: 0; }

/* ── ③ أرضية مقاسات النص ──────────────────────────────────────────────────
   العربية تحتاج مقاساً أكبر من اللاتينية: التشكيل والنقاط والوصلات تفاصيل رأسية،
   وعند ١٣px على الجوال تتقارب «ثـ/تـ/نـ». كانت الأرضية ١١.٥px.
   سلّم ثابت: 12 · 14 · 16 · 18 · 22 · 28 — بلا كسور عشوائية. */
@media (max-width: 720px) {
  .wa-section-sub, .gcard-desc, .ln-faq-body, .ln-step-desc,
  .ln-test-text, .wa-cta-sub { font-size: 15px; }
  .wa-hero-sub { font-size: 16px; }
  .wa-filter, .wa-sort-btn { font-size: 14px; }
  .ln-trust-lbl, .wa-qstat-lbl { font-size: 13px; }
  .gcard-meta-item { font-size: 13px; }
}

/* ── ④ الجوال: عمودان بدل عمود واحد ───────────────────────────────────────
   الـLanding كانت ١٠٬٢٨١px (١٢ شاشة) و٦٥٪ منها شبكة الألعاب: بطاقة واحدة
   بالصف × ٤٢١px × ١٥ لعبة. عمودان مضغوطان ⇒ ٣ شاشات بدل ٨. */
@media (max-width: 720px) {
  .wa-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .wa-grid .gcard--wide { grid-column: span 2; }
  .gcard-desc { -webkit-line-clamp: 2; }
  .gcard-title { font-size: 15px; }
  .gcard-meta { flex-wrap: wrap; }
}
/* الشاشات الضيقة جداً: رجّع عموداً واحداً حتى لا ينضغط الغلاف */
@media (max-width: 359px) {
  .wa-grid { grid-template-columns: 1fr; }
  .wa-grid .gcard--wide { grid-column: auto; }
}

/* ── ⑤ الجوال: ترتيب الأقسام يتبع الـHTML كما هو ──────────────────────────
   🔙 [2026-07-28] **أُلغيت** قواعد `order` التي كانت ترفع التقييمات (`.ln-test`)
   فوق شبكة الألعاب على الجوال — قرار المالك: «رجّع التقييم تحت الألعاب زي قبل،
   أجمل من الحين فوق». فالترتيب رجع لترتيب الـDOM الطبيعي بالصفحتين:
     Landing   : hero ← how  ← games ← test ← faq ← cta
     dashboard : hero ← cats ← games ← test ← cta
   ⚠️ لا تُعِد قواعد `order` هنا: مجرّد إضافة order لعنصر واحد داخل `.wa-main`
   (وهو flex column) يقفز به فوق كل ما بقي على order:0 — بما فيه بانر التحقق
   وبانر الاستئناف، وهذي تنبيهات لازم تظل بالأعلى. لو احتجت ترتيباً مستقبلاً
   فرقّم **كل** الأقسام دفعةً واحدة لا قسماً واحداً. */

/* ── ⑦ أهداف اللمس: روابط الهيدر والفوتر ─────────────────────────────────
   كانت ٣٤–٤٠px (الحد ٤٤). wnUiuxV2 غطّى الأزرار ونسي الروابط.
   مقصور على أجهزة اللمس بـ(hover:none) — الديسكتوب يبقى بكثافته البصرية
   كما هي، فلا يتمدد الهيدر بلا داعٍ على الماوس. */
@media (hover: none) {
  .wa-nav-link, .ln-login, .ln-footer-nav a, .ln-footer-legal a, .wa-logo-wrap,
  .ln-social-btn, .wa-profile-menuitem {
    min-height: 44px;
    display: inline-flex; align-items: center;
    touch-action: manipulation;
  }
  .ln-faq-item summary { min-height: 48px; }
}

/* ── ⑧ شريط التقييمات على الجوال ──────────────────────────────────────────
   الكرت `min(360px, 82vw)` = ٣٣٩px داخل حاوية ٣٨١px عند ٤١٤px شاشة ⇒ ٨٩٪،
   ويقتطع قناع التلاشي ٧٪ من كل طرف، فالنتيجة كرت واحد وشظيتان — يقرأها
   المستخدم «مقصوص» لا «فيه بعده». بعد رفع التقييمات لأعلى الصفحة (الشاشة
   الثانية بدل العاشرة) صار الوضوح مهماً. ٧٢vw تُبقي ~٨٠px من التالي ظاهرة
   فتقول «اسحب» بوضوح، والفجوة تضيق فتزيد الكثافة بلا زحمة. */
@media (max-width: 720px) {
  .ln-rv-track { gap: 14px; }
  .ln-rv-track .ln-test-card { width: min(320px, 72vw); }
  .ln-test-grid.ln-rv-marquee { padding-block: 20px 12px; }
}
