/* نكس نت — نظام التصميم
   المرجع: بنية تطبيق أخبار (Newzia) — أبيض، بطاقات مدوّرة، حبّات تبويب، شريط سفلي.
   الهوية: ليموني #D6F901 · أسود · رمادي #8F8F8F (مقيسة من الملفّ المتّجه).
   الليموني لا يحمل نصّاً على الفاتح (تباين ~1.2:1): يكون خلفيةً ونصّها أسود. */
:root{
  --lime:#D6F901; --lime-d:#B8D600; --ink:#0D0D0F; --ink-2:#4B4E55; --ink-3:#7E828A;
  --bg:#F2F3F5; --card:#fff; --line:#E4E5E8; --line-2:#EEEFF1;
  --r-l:22px; --r:16px; --r-s:12px;
  --sh:0 1px 2px rgba(13,13,15,.04),0 10px 26px -16px rgba(13,13,15,.22);
  --sh-h:0 2px 4px rgba(13,13,15,.06),0 18px 36px -18px rgba(13,13,15,.32);
  --ease:cubic-bezier(.2,.7,.2,1);
  --f:"Readex Pro",system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scrollbar-color:#C9CBD0 transparent}
body{margin:0;font-family:var(--f);background:var(--bg);color:var(--ink);font-size:16px;line-height:1.7}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
h1,h2,h3{margin:0;line-height:1.45;font-weight:700;text-wrap:balance}
.num{font-variant-numeric:tabular-nums}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{width:min(1180px,100% - 40px);margin-inline:auto}
::selection{background:var(--lime);color:var(--ink)}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px;border-radius:8px}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#C9CBD0;border-radius:99px}
.skip{position:absolute;inset-inline-start:12px;top:-60px;background:var(--ink);color:#fff;padding:10px 16px;border-radius:10px;z-index:99}
.skip:focus{top:12px}
.ic{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.bi{width:18px;height:18px;fill:currentColor;flex:none}
.ph{display:block;width:100%;height:100%;background:linear-gradient(145deg,#E6E8EC,#D3D6DC)}

/* ── الترويسة: الشعار في البداية (يمين) والأزرار في الطرف المقابل ─────── */
.top{background:#fff;position:sticky;top:0;z-index:50;border-bottom:1px solid var(--line)}
/* سطرٌ واحد: الشعار · الأقسام في الوسط · الأزرار. «1fr auto 1fr» يضع الأقسام في
   وسط الصفحة فعلاً — «auto 1fr auto» يوسّطها بين الشعار والزرّ فتميل، لأن الشعار
   (115px) أعرض من زرّ البحث (42px). طُلب: «خليهم كلهم ع نفس السطر والأقسام وسط». */
.top-in{display:grid;grid-template-columns:1fr auto 1fr;grid-template-areas:"brand nav acts";align-items:center;gap:18px;min-height:68px}
.brand{grid-area:brand;justify-self:start}
.pills{grid-area:nav;min-width:0}
.top-r{grid-area:acts;justify-self:end}
.brand img{height:30px;width:auto}
/* الأزرار تُدفع بهامشها هي — دفعها بجارٍ مخفيٍّ على الجوال ألصقها بالشعار مرّة */
.top-r{display:flex;gap:6px}
.ib{display:grid;place-items:center;width:42px;height:42px;border-radius:99px;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer;transition:background .2s var(--ease)}
.ib:hover{background:var(--bg)}
.burger{display:none}

/* ── حبّات الأقسام: تُسحب أفقياً، والنشطة سوداء ─────────────────────── */
.pills-in{display:flex;gap:6px;padding:12px 0;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity}
.pills-in::-webkit-scrollbar{display:none}
.pill{flex:none;scroll-snap-align:start;padding:7px 18px;border-radius:99px;font-size:14.5px;font-weight:500;
  color:var(--ink-2);background:var(--bg);transition:background .2s var(--ease),color .2s var(--ease)}
.pill:hover{background:#E6E8EB;color:var(--ink)}
.pill.on{background:var(--ink);color:#fff}

/* ── الأبرز ───────────────────────────────────────────────────────────── */
.hero{display:grid;grid-template-columns:1.75fr 1fr;gap:16px;margin-top:22px}
.over{position:relative;display:block;overflow:hidden;border-radius:var(--r-l);isolation:isolate;background:#1a1b1e;color:#fff}
.over-t{position:absolute;inset:0;z-index:-2}
.over-t img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.over:hover .over-t img{transform:scale(1.04)}
.over::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,0) 38%,rgba(0,0,0,.78))}
.over-b{position:absolute;inset-inline:0;bottom:0;padding:22px 24px;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.h-lead{min-height:470px}
.h-lead h2{font-size:clamp(22px,2.3vw,31px);line-height:1.4;max-width:30ch}
.h-meta{display:flex;gap:8px;font-size:13.5px;color:rgba(255,255,255,.82)}
.h-meta i{font-style:normal;opacity:.6}
.h-bar{position:absolute;bottom:14px;inset-inline-start:24px;width:58px;height:4px;border-radius:99px;
  background:linear-gradient(to left,var(--lime) 42%,rgba(255,255,255,.3) 42%)}
.h-col{display:grid;grid-template-rows:1fr 1fr;gap:16px}
.h-side{min-height:0}
.h-side h3{font-size:17.5px;line-height:1.5}
.tag{display:inline-block;background:var(--lime);color:var(--ink);font-size:12.5px;font-weight:600;padding:4px 12px;border-radius:99px;line-height:1.5}

/* ── عناوين الكتل ─────────────────────────────────────────────────────── */
.blk{margin-top:46px}
.h2row{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.h2row h2{font-size:23px}
.more{display:inline-flex;align-items:center;gap:4px;font-size:14px;font-weight:500;color:var(--ink-2);padding:6px 12px 6px 8px;border-radius:99px;transition:background .2s var(--ease)}
.more:hover{background:#fff;color:var(--ink)}
.more .ic{width:18px;height:18px}
.meta{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--ink-3);margin-top:8px}
.meta i{font-style:normal;opacity:.55}
.m-sec{color:var(--ink-2);font-weight:500}

/* ── ١ قائمة بمصغّرات ────────────────────────────────────────────────── */
.list{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}
/* ارتفاعٌ ثابت وصفٌّ بصفرٍ صريح: `1fr` وحده حدّه الأدنى min-content فيتمدّد مع النصّ
   وتُقصّ الصورة الواحدة بنسبٍ مختلفة من صفٍّ لصفّ (خطأ وقع بثلاث طبقات) */
.li{display:grid;grid-template-columns:116px 1fr;grid-template-rows:minmax(0,1fr);gap:16px;height:136px;align-items:center;
  background:var(--card);border-radius:var(--r);padding:10px;box-shadow:var(--sh);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.li:hover{transform:translateY(-2px);box-shadow:var(--sh-h)}
.li-t{width:116px;height:116px;border-radius:var(--r-s);overflow:hidden;background:var(--bg)}
.li-t img{width:100%;height:100%;object-fit:cover}
.li-b{min-width:0;padding-inline-end:8px}
.li h3{font-size:16.5px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* ── ٢ بطاقات ─────────────────────────────────────────────────────────── */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{display:flex;flex-direction:column;background:var(--card);border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.card:hover{transform:translateY(-3px);box-shadow:var(--sh-h)}
.card-t{aspect-ratio:4/3;overflow:hidden;background:var(--bg)}
.card-t img{width:100%;height:100%;object-fit:cover}
.card-b{padding:14px 16px 16px}
.card h3{font-size:16.5px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ── ٣ مجلّة ──────────────────────────────────────────────────────────── */
.mag{display:grid;grid-template-columns:1.5fr 1fr;gap:16px}
.mag-lead{min-height:420px;grid-row:span 1}
.mag-lead h3{font-size:clamp(20px,1.9vw,26px);max-width:28ch}
.mag-side{display:grid;gap:12px;align-content:start}
.mini{display:grid;grid-template-columns:96px 1fr;grid-template-rows:minmax(0,1fr);gap:14px;height:116px;align-items:center;background:var(--card);border-radius:var(--r);padding:10px;box-shadow:var(--sh)}
.mini-t{width:96px;height:96px;border-radius:var(--r-s);overflow:hidden}
.mini-t img{width:100%;height:100%;object-fit:cover}
.mini h3{font-size:15.5px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mini .meta{margin-top:4px}
.rows{grid-column:1 / -1;display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:4px 22px;background:var(--card);border-radius:var(--r);padding:8px 18px;box-shadow:var(--sh)}
.row{display:grid;grid-template-columns:64px 1fr auto;gap:14px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line-2)}
.row-t{width:64px;height:64px;border-radius:10px;overflow:hidden}
.row-t img{width:100%;height:100%;object-fit:cover}
.row h3{font-size:15px;font-weight:600;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.row time{font-size:12.5px;color:var(--ink-3);white-space:nowrap}
.row:hover h3{text-decoration:underline;text-decoration-color:var(--lime-d);text-decoration-thickness:3px;text-underline-offset:5px}

/* ── ٤ معرض ───────────────────────────────────────────────────────────── */
.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.gal{aspect-ratio:16/10}
.gal h3{font-size:19px;max-width:32ch}
.gal .meta{color:rgba(255,255,255,.8);margin-top:0}

/* ── ٥ قائمة مزدوجة ───────────────────────────────────────────────────── */
.compact{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.li-s{grid-template-columns:92px 1fr;height:112px}
.li-s .li-t{width:92px;height:92px}
.li-s h3{font-size:15.5px;-webkit-line-clamp:2}

/* ── ٦ سجلّ ──────────────────────────────────────────────────────────── */
.ledger{background:var(--card);border-radius:var(--r);box-shadow:var(--sh);overflow:hidden}
.led{display:grid;grid-template-columns:112px 72px 1fr auto;gap:16px;align-items:center;padding:12px 18px;border-top:1px solid var(--line-2);transition:background .2s var(--ease)}
.led:first-child{border-top:0}
.led:hover{background:#FAFAFB}
.led time{font-size:13px;color:var(--ink-3)}
.led-t{width:72px;height:48px;border-radius:8px;overflow:hidden}
.led-t img{width:100%;height:100%;object-fit:cover}
.led h3{font-size:15.5px;font-weight:600;line-height:1.55}
.led-go{color:var(--ink-3)}
.led:hover .led-go{color:var(--ink)}

/* ── ٧ تسلسل يومي ─────────────────────────────────────────────────────── */
.tl{position:relative;padding-inline-start:26px}
.tl::before{content:"";position:absolute;inset-block:8px;inset-inline-start:6px;width:2px;background:linear-gradient(var(--line),transparent)}
.tl-day{position:relative;font-weight:700;font-size:14.5px;margin:22px 0 10px}
.tl-day:first-child{margin-top:0}
.tl-day::before{content:"";position:absolute;inset-inline-start:-26px;top:6px;width:14px;height:14px;border-radius:99px;background:var(--lime);border:3px solid var(--bg);box-shadow:0 0 0 1px var(--ink)}
.tl-i{display:grid;grid-template-columns:88px 1fr;grid-template-rows:minmax(0,1fr);gap:14px;height:94px;align-items:center;background:var(--card);border-radius:var(--r-s);padding:8px;margin-bottom:10px;box-shadow:var(--sh)}
.tl-t{width:88px;height:78px;border-radius:10px;overflow:hidden}
.tl-t img{width:100%;height:100%;object-fit:cover}
.tl-i h3{font-size:15.5px;font-weight:600;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tl-i .meta{margin-top:2px}

/* ── صفحة القسم ───────────────────────────────────────────────────────── */
.sec-h{padding:34px 0 22px}
.sec-h h1{font-size:clamp(28px,3.4vw,40px)}
.sec-h p{margin:.3rem 0 0;color:var(--ink-2)}

/* ── صفحة الخبر ───────────────────────────────────────────────────────── */
.art{max-width:820px;padding-top:22px}
.crumbs{display:flex;align-items:center;gap:6px;font-size:13.5px;color:var(--ink-3)}
.crumbs a:hover{color:var(--ink)}
.crumbs .sep{width:16px;height:16px}
.art-h{margin-top:16px}
.art-h h1{font-size:clamp(25px,3.3vw,38px);line-height:1.42;margin-top:12px}
.art-m{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;margin-top:16px;font-size:14px;color:var(--ink-3)}
.by{display:inline-flex;align-items:center;gap:9px;color:var(--ink);font-weight:500}
.by img{border-radius:8px}
.rt{display:inline-flex;align-items:center;gap:5px}
.rt .ic{width:17px;height:17px}
.art-fig{margin:22px 0 0}
.art-fig img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r-l)}
.art-fig figcaption{font-size:13px;color:var(--ink-3);margin-top:9px}
.art-body{background:var(--card);border-radius:var(--r-l);padding:28px 32px;margin-top:22px;box-shadow:var(--sh);font-size:18px;line-height:1.95}
.art-body p{margin:0 0 1.1em;max-width:68ch}
.art-body p:last-child{margin-bottom:0}
.art-share{display:flex;align-items:center;gap:8px;margin-top:18px;flex-wrap:wrap}
.art-share>span{font-size:14px;color:var(--ink-2);margin-inline-end:6px}
.sh{display:grid;place-items:center;width:42px;height:42px;border-radius:99px;background:#fff;border:1px solid var(--line);color:var(--ink);cursor:pointer;transition:background .2s var(--ease)}
.sh:hover{background:var(--lime);border-color:var(--lime)}
.rel{margin-top:44px}

/* ── بحث وصفحات ───────────────────────────────────────────────────────── */
.sbox{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:99px;padding:6px 18px;max-width:640px}
.sbox input{flex:1;border:0;outline:0;font:inherit;font-size:17px;padding:10px 0;background:transparent;color:var(--ink)}
.sbox:focus-within{border-color:var(--ink);box-shadow:0 0 0 3px var(--lime)}
.s-count{color:var(--ink-3);font-size:14px;min-height:1.7em}
.pol{max-width:820px}
.nf{text-align:center;padding:90px 0}
.nf h1{font-size:34px}.nf p{color:var(--ink-2)}
.btn{display:inline-block;background:var(--ink);color:#fff;padding:12px 26px;border-radius:99px;font-weight:600;margin-top:10px}
.btn:hover{background:#26282d}

/* ── التذييل: أسود، والشعار بنسخته الليمونية المشتقّة ─────────────────── */
.foot{background:var(--ink);color:rgba(255,255,255,.72);margin-top:70px;padding:48px 0 22px}
.foot-in{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px}
.f-about img{height:31px;width:auto}
.f-about p{font-size:14px;line-height:1.85;margin:14px 0 0;max-width:36ch}
.foot h4{color:#fff;font-size:14.5px;margin:0 0 12px;font-weight:600}
.foot-in a{display:block;font-size:14px;padding:4px 0;transition:color .2s var(--ease)}
.foot-in a:hover{color:var(--lime)}
.rss,.soc{display:flex!important;align-items:center;gap:8px}
.rss .ic,.soc .ic{width:18px;height:18px}
.foot-b{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.1);margin-top:34px;padding-top:18px;font-size:12.5px;color:rgba(255,255,255,.5)}

/* ── الدرج ────────────────────────────────────────────────────────────── */
.drawer{position:fixed;inset:0;z-index:80;background:rgba(13,13,15,.45);backdrop-filter:blur(3px)}
.drawer-p{position:absolute;inset-block:0;inset-inline-end:0;width:min(340px,86vw);background:#fff;padding:18px 20px;overflow:auto;box-shadow:-20px 0 50px -20px rgba(0,0,0,.35)}
.drawer-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.drawer-s a{display:block;font-size:19px;font-weight:600;padding:12px 4px;border-bottom:1px solid var(--line-2)}
.drawer-p2{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:18px}
.drawer-p2 a{font-size:14px;color:var(--ink-2)}
.tabbar{display:none}

/* ── الترويسة سطرين حين لا تتّسع الأقسام بجانب الشعار ───────────────── */
@media(max-width:1099px){
  .top-in{grid-template-columns:1fr auto;grid-template-areas:"brand acts" "nav nav";gap:0 12px;min-height:0;padding-top:12px}
  .pills{margin-inline:-20px;border-top:1px solid var(--line-2);margin-top:12px}
  .pills-in{padding:10px 0}
  .pill:first-child{margin-inline-start:20px}
  .pill:last-child{margin-inline-end:20px}
  .pills-in{scroll-padding-inline-start:20px}
}

/* ── تابلت ────────────────────────────────────────────────────────────── */
@media(max-width:1000px){
  .list{grid-template-columns:1fr}
  .cards{grid-template-columns:repeat(2,1fr)}
  .mag{grid-template-columns:1fr}
  .mag-lead{min-height:360px}
  .led{grid-template-columns:96px 64px 1fr auto}
}
@media(max-width:900px){
  .hero{grid-template-columns:1fr}
  .h-col{grid-template-columns:1fr 1fr;grid-template-rows:none}
  .h-side{min-height:230px}
  .h-lead{min-height:400px}
}

/* ── الجوال: بنية تطبيق أخبار لا سطحٌ مضغوط ─────────────────────────── */
@media(max-width:760px){
  .wrap{width:calc(100% - 32px)}
  .top-in{padding-top:10px}
  .brand img{height:26px}
  .burger{display:grid}
  /* حبّات تُسحب: الإزاحة هامشٌ على الأولى مع scroll-padding — الحشوة وحدها تُبتلع مع snap */
  .pills{margin-inline:-16px;margin-top:10px}
  .pill:first-child{margin-inline-start:16px}
  .pill:last-child{margin-inline-end:16px}
  .pills-in{scroll-padding-inline-start:16px}
  .hero{margin-top:14px}
  .h-col{display:none}
  .h-lead{min-height:360px;border-radius:20px}
  .blk{margin-top:34px}
  .h2row h2{font-size:20px}
  .li{grid-template-columns:104px 1fr;height:124px}
  .li-t{width:104px;height:104px}
  .li h3{font-size:15.5px}
  .cards{grid-template-columns:1fr 1fr;gap:12px}
  .card-b{padding:10px 12px 12px}
  .card h3{font-size:14.5px;-webkit-line-clamp:3}
  .card .meta{font-size:12px}
  .gallery,.compact{grid-template-columns:1fr}
  .gal h3{font-size:17px}
  .rows{grid-template-columns:1fr;padding:4px 14px}
  .led{grid-template-columns:64px 1fr;grid-template-rows:auto auto;gap:4px 12px;padding:12px 14px}
  .led-t{grid-row:1 / span 2;width:64px;height:64px}
  .led time{grid-column:2;font-size:12px}
  .led h3{grid-column:2;font-size:14.5px}
  .led-go{display:none}
  .art-body{padding:20px 18px;font-size:17px;border-radius:18px}
  .art-fig img{border-radius:18px}
  /* التذييل ثلاثة أعمدة جنب بعضها — العمود الواحد صُحّح مرّتين على موقعين */
  .foot-in{grid-template-columns:repeat(3,1fr);gap:18px 10px}
  .f-about{grid-column:1 / -1}
  .foot h4{font-size:13.5px}
  .foot-in a{font-size:13px}
  .foot{padding-bottom:96px}
  .tabbar{position:fixed;inset-inline:0;bottom:0;z-index:70;display:flex;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);
    border-top:1px solid var(--line);padding:6px 6px calc(6px + env(safe-area-inset-bottom))}
  .tabbar a{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 0;color:var(--ink-3);font-size:11.5px;font-weight:500}
  .tabbar .ic{width:23px;height:23px}
  .tabbar a[aria-current]{color:var(--ink)}
  .tabbar a[aria-current] .ic{background:var(--lime);border-radius:99px;padding:3px;width:40px;height:29px}
}
@media(max-width:400px){
  .foot-in a{font-size:12.5px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ── إضافات ووردبريس ─────────────────────────────────────────────────── */
/* صور wp_get_attachment_image تحمل width/height كسماتٍ تغلب aspect-ratio؛ داخل الصناديق الثابتة تُملأ صراحةً */
.li-t img,.card-t img,.mini-t img,.row-t img,.led-t img,.tl-t img,.over-t img{width:100%;height:100%;object-fit:cover}
.art-body h2,.art-body h3{margin:1.4em 0 .5em;line-height:1.5}
.art-body h2{font-size:1.3em}.art-body h3{font-size:1.12em}
.art-body img{max-width:100%;height:auto;border-radius:var(--r-s)}
.art-body figure{margin:1.2em 0}.art-body figcaption{font-size:13px;color:var(--ink-3);margin-top:6px}
.art-body a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--lime-d);text-decoration-thickness:2px;text-underline-offset:4px}
.art-body blockquote{margin:1.2em 0;padding:.4em 1.1em;border-inline-start:3px solid var(--ink);color:var(--ink-2)}
.art-body iframe,.art-body video{max-width:100%}
.pager{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:34px}
.pager a,.pager span.current,.pager .dots{display:inline-flex;align-items:center;gap:4px;min-width:42px;height:42px;justify-content:center;padding:0 12px;border-radius:99px;background:#fff;border:1px solid var(--line);font-size:14.5px}
.pager span.current{background:var(--ink);color:#fff;border-color:var(--ink)}
.pager a:hover{background:var(--bg)}
.pager .ic{width:18px;height:18px}
.empty{color:var(--ink-2);padding:30px 0}
.sbox .ic{color:var(--ink-3)}
.srch .list{margin-top:14px}

/* ── فقرات قصيرة: ريلز إنستجرام ببطاقات ٩:١٦ تُسحب أفقياً ──────────────
   الأسهم تُخفى على اللمس (الجوال يسحب بإصبعه) وتظهر على المؤشّر فقط.
   الشريط يمتدّ إلى حافّة الشاشة على الجوال بهوامش سالبة كي لا تُقصّ البطاقة
   الأخيرة خلف حدّ .wrap فتبدو القائمة منتهية وفيها بقيّة. */
.reels{position:relative}
.reels-in{display:flex;gap:14px;list-style:none;margin:0;padding:4px 0 10px;overflow-x:auto;
  scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.reels-in::-webkit-scrollbar{display:none}
.reel{flex:none;scroll-snap-align:start;width:min(206px,44vw)}
.reel-c{display:block;position:relative;width:100%;aspect-ratio:9/16;padding:0;border:0;cursor:pointer;
  border-radius:var(--r-l);overflow:hidden;background:#1a1b1e;color:#fff;box-shadow:var(--sh);
  transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.reel-c:hover{transform:translateY(-3px);box-shadow:var(--sh-h)}
.reel-c img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.reel-c:hover img{transform:scale(1.05)}
.reel-c::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(13,13,15,.82) 0%,rgba(13,13,15,.28) 38%,transparent 62%)}
.reel-t{position:absolute;inset-inline:12px;bottom:12px;z-index:2;font-family:var(--f);font-size:14px;
  font-weight:600;line-height:1.5;text-align:start;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
/* مثلّث التشغيل: حدٌّ أيسر في RTL يجعله يشير لليسار — نثبّته بـscaleX */
.reel-p{position:absolute;top:12px;inset-inline-start:12px;z-index:2;display:grid;place-items:center;
  width:34px;height:34px;border-radius:99px;background:rgba(255,255,255,.18);backdrop-filter:blur(6px)}
.reel-p::before{content:"";border-inline-start:11px solid #fff;border-top:7px solid transparent;
  border-bottom:7px solid transparent;margin-inline-start:3px;transform:scaleX(1)}
:dir(rtl) .reel-p::before{transform:scaleX(-1)}
.reels-a{position:absolute;top:calc(50% - 22px);z-index:3;display:none;place-items:center;width:44px;height:44px;
  border-radius:99px;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer;
  box-shadow:var(--sh);transition:background .2s var(--ease)}
.reels-a:hover{background:var(--bg)}
.reels-a.is-back{inset-inline-end:-14px}
.reels-a.is-next{inset-inline-start:-14px}
.reels-a[hidden]{display:none}
@media (hover:hover) and (pointer:fine){.reels-a{display:grid}}
@media (max-width:700px){
  .reels-in{padding-inline:20px;margin-inline:-20px}
  .reel{width:min(168px,42vw)}
}

/* نافذة التشغيل: إطار إنستجرام يُبنى عند الضغط ويُهدم عند الإغلاق */
.rlb{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:20px;
  background:rgba(13,13,15,.82);backdrop-filter:blur(4px)}
.rlb[hidden]{display:none}
.rlb-in{position:relative;width:min(420px,100%);aspect-ratio:9/16;max-height:86vh;
  border-radius:var(--r-l);overflow:hidden;background:#000}
.rlb-in iframe{width:100%;height:100%;border:0}
.rlb-x{position:absolute;top:-52px;inset-inline-end:0;display:grid;place-items:center;width:42px;height:42px;
  border-radius:99px;border:0;background:#fff;color:var(--ink);cursor:pointer}
@media (max-width:700px){.rlb{padding:14px}.rlb-x{top:auto;bottom:-54px;inset-inline-end:50%;transform:translateX(50%)}}