/* ══════════════════════════════════════════════════════════
   MI Blog
══════════════════════════════════════════════════════════ */
.mbl{
  --ink:#111; --ink2:#55555c; --ink3:#8a8a92; --line:#ececec; --card:#fff; --soft:#f6f6f5; --chip:#f1f1f0;
  --body:'IBM Plex Sans Arabic','Tajawal',system-ui,sans-serif; --head:'handicraft','IBM Plex Sans Arabic',sans-serif;
  color:var(--ink); font-family:var(--body); box-sizing:border-box;
}
.mbl{--text:#222}
.mbl.is-dark{--text:#e6e6ea; --ink:#f4f4f4; --ink2:#b9b9bf; --ink3:#86868d; --line:rgba(255,255,255,.1); --card:#17171a; --soft:#1e1e22; --chip:rgba(255,255,255,.08)}
.mbl *,.mbl *::before,.mbl *::after{box-sizing:border-box}
.mbl a,.mbl a:hover,.mbl a:focus{text-decoration:none!important; box-shadow:none}
.mbl .mbl-card-cv,.mbl .mbl-card-cv:hover{color:inherit!important}
.mbl .mbl-cover,.mbl .mbl-cover *{color:var(--cv-fg)!important}
.mbl .mbl-cover.has-img,.mbl .mbl-cover.has-img *{color:#fff!important}

/* ── الغلاف ── */
.mbl-cover{position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:flex-end; gap:10px;
  container-type:inline-size; aspect-ratio:16/10; padding:7% 7% 6%; border-radius:18px;
  background:var(--cv-bg); color:var(--cv-fg)}
.mbl-cover::before{content:''; position:absolute; inset:0; background-image:var(--cv-pat); background-size:64px; opacity:.13;
  -webkit-mask:linear-gradient(160deg,#000 10%,transparent 75%); mask:linear-gradient(160deg,#000 10%,transparent 75%)}
.mbl-cover.has-img{background:#111 var(--cv-img) center/cover no-repeat; color:#fff}
.mbl-cover.has-img::before{background:linear-gradient(to top,rgba(0,0,0,.78),rgba(0,0,0,.05) 70%); opacity:1; -webkit-mask:none; mask:none}
.mbl-cover>*{position:relative}
.mbl-cv-cat{position:absolute; top:7%; inset-inline-start:7%; padding:5px 12px; border-radius:20px; font-size:max(11px,3.1cqw); font-weight:700;
  background:color-mix(in srgb,var(--cv-fg) 12%,transparent); border:1px solid color-mix(in srgb,var(--cv-fg) 22%,transparent); line-height:1.3}
.mbl-cover.has-img .mbl-cv-cat{background:rgba(255,255,255,.16); border-color:rgba(255,255,255,.3)}
.mbl .mbl-cv-t{margin:0!important; font-family:var(--head)!important; font-weight:800!important; color:inherit!important;
  font-size:7.4cqw!important; line-height:1.3!important; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden}
.mbl-cv-brand{font-size:max(10px,2.6cqw); opacity:.55; letter-spacing:.3px; font-family:system-ui,sans-serif}
.mbl-cover.is-hero{aspect-ratio:auto; min-height:clamp(260px,34vw,420px); border-radius:28px; padding:clamp(24px,5vw,56px)}
.mbl-cover.is-hero .mbl-cv-t{font-size:clamp(28px,4.4vw,54px)!important; -webkit-line-clamp:4; max-width:900px}
.mbl-cover.is-hero .mbl-cv-cat{font-size:13px; top:clamp(20px,3.4vw,36px); inset-inline-start:clamp(24px,5vw,56px)}
.mbl-cover.is-hero .mbl-cv-brand{font-size:12px}
.mbl-cover.is-feature .mbl-cv-t{font-size:6.4cqw!important}

/* ── البطاقات ── */
.mbl-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(16px,2.2vw,28px)}
.mbl-card{display:flex; flex-direction:column; gap:14px; min-width:0}
.mbl-card-cv{display:block; border-radius:18px; transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.mbl-card:hover .mbl-card-cv{transform:translateY(-4px); box-shadow:0 18px 40px -18px rgba(0,0,0,.4)}
.mbl-card-b{display:flex; flex-direction:column; gap:8px; padding:0 2px}
.mbl-meta{display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; font-size:12.5px; color:var(--ink3)}
.mbl-meta i{font-style:normal; opacity:.6}
.mbl .mbl-chip{padding:3px 10px; border-radius:20px; background:var(--chip); color:var(--ink2)!important; font-weight:600; font-size:12px}
.mbl .mbl-chip:hover{color:var(--ink)!important}
.mbl .mbl-card-t{margin:0!important; font-family:var(--head)!important; font-size:19px!important; line-height:1.5!important; font-weight:800!important}
.mbl .mbl-card-t a,.mbl .mbl-card-t a:hover{color:var(--ink)!important; background:linear-gradient(currentColor,currentColor) no-repeat 100% 100%/0 1.5px; transition:background-size .35s}
[dir=ltr] .mbl .mbl-card-t a,.mbl-card[dir=ltr] .mbl-card-t a{background-position:0 100%}
.mbl-card:hover .mbl-card-t a{background-size:100% 1.5px}
.mbl .mbl-card-x{margin:0!important; font-size:14.5px!important; line-height:1.85!important; color:var(--ink2)!important;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}

/* أحدث مقالة كبيرة */
.mbl-card.is-big{grid-column:1/-1; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:clamp(20px,3.5vw,48px); align-items:center;
  padding-bottom:clamp(20px,3vw,36px); margin-bottom:clamp(4px,1vw,12px); border-bottom:1px solid var(--line)}
.mbl-card.is-big .mbl-card-t{font-size:clamp(22px,2.6vw,32px)!important; line-height:1.4!important}
.mbl-card.is-big .mbl-card-x{-webkit-line-clamp:4; font-size:15.5px!important}
.mbl .mbl-more{align-self:flex-start; margin-top:6px; padding:10px 20px; border-radius:30px; background:var(--ink); color:var(--card)!important; font-weight:700; font-size:14px}

/* ── صفحة المقالات ── */
.mbl-list{width:100%; min-width:0; box-sizing:border-box; max-width:1200px; margin:0 auto; padding:clamp(28px,5vw,64px) clamp(16px,3vw,32px)}
.mbl-head{text-align:center; margin-bottom:clamp(28px,4vw,48px)}
.mbl .mbl-h{margin:0 0 10px!important; font-family:var(--head)!important; font-size:clamp(32px,4.6vw,54px)!important; font-weight:900!important; color:var(--ink)!important; line-height:1.15!important}
.mbl .mbl-sub{margin:0 auto!important; max-width:560px; font-size:15.5px!important; line-height:1.85!important; color:var(--ink2)!important}
.mbl-cats{display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:24px}
.mbl-cats a{padding:8px 16px; border-radius:30px; border:1px solid var(--line); color:var(--ink2)!important; font-size:13.5px; font-weight:600; transition:all .2s}
.mbl-cats a:hover{border-color:var(--ink3); color:var(--ink)!important}
.mbl-cats a.on{background:var(--ink); border-color:var(--ink); color:var(--card)!important}
.mbl-pages{display:flex; justify-content:center; gap:6px; margin-top:40px}
.mbl-pages a{min-width:40px; height:40px; display:flex; align-items:center; justify-content:center; border-radius:12px; border:1px solid var(--line); color:var(--ink)!important; font-weight:700}
.mbl-pages a.on{background:var(--ink); color:var(--card)!important; border-color:var(--ink)}
.mbl-empty{text-align:center; color:var(--ink3); padding:40px 0}

/* ── أحدث المقالات ── */
.mbl-latest{max-width:1200px; margin:0 auto; padding:clamp(24px,4vw,48px) clamp(16px,3vw,32px)}
.mbl-lh{display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:24px}
.mbl .mbl-h2{margin:0!important; font-family:var(--head)!important; font-size:clamp(24px,3vw,34px)!important; font-weight:900!important; color:var(--ink)!important}
.mbl .mbl-all{color:var(--ink)!important; font-weight:700; font-size:14.5px; white-space:nowrap; border-bottom:1.5px solid var(--ink3); padding-bottom:2px}

/* ── صفحة المقالة ── */
.mbl-single{width:100%; min-width:0; box-sizing:border-box; max-width:1200px; margin:0 auto; padding:clamp(14px,2.4vw,28px) clamp(16px,3vw,32px) clamp(40px,6vw,80px)}
.mbl-prog{position:fixed; inset-inline:0; top:0; height:3px; z-index:100000; pointer-events:none}
.mbl-prog i{display:block; height:100%; background:var(--ink); transform:scaleX(0); transform-origin:right; transition:transform .1s linear}
[dir=ltr] .mbl-prog i,.mbl-single[dir=ltr] .mbl-prog i{transform-origin:left}
.mbl-note{margin:0 0 14px!important; padding:10px 14px; border-radius:12px; background:#fff8e6; color:#7a5a00; font-size:14px!important; font-family:system-ui,sans-serif}
/* رأس المقالة: المسار + العنوان + التاريخ — من غير غلاف (إلا لو اخترته) */
.mbl-hero{max-width:900px; margin:0 auto clamp(22px,3vw,36px); padding-bottom:clamp(18px,2.4vw,26px); border-bottom:1px solid var(--line)}
.mbl-crumbs{display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-size:13px; color:var(--ink3); margin-bottom:12px}
.mbl .mbl-crumbs a{color:var(--ink2)!important; font-weight:600}
.mbl .mbl-crumbs a:hover{color:var(--ink)!important}
.mbl-crumbs i{font-style:normal; opacity:.6}
.mbl .mbl-title{margin:0!important; font-family:var(--head)!important; font-size:clamp(26px,3.6vw,44px)!important; line-height:1.35!important;
  font-weight:900!important; color:var(--ink)!important; letter-spacing:0!important}
.mbl-meta.is-hero{margin-top:14px; font-size:13.5px}
.mbl .mbl-copy{display:inline-flex; align-items:center; gap:6px}
.mbl .mbl-copy svg{width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round}
.mbl-hero-img{margin:clamp(18px,2.4vw,26px) 0 0!important; border-radius:20px; overflow:hidden; background:var(--soft)}
.mbl-hero-img img{display:block; width:100%!important; height:auto!important; max-width:none!important; border-radius:0!important}
.mbl-hero-img .mbl-cover{border-radius:0}
/* بلوك HTML / شورت كود */
.mbl-body .mbl-html{margin:1.5em 0}
.mbl-share{display:inline-flex; flex-wrap:wrap; gap:6px; margin-inline-start:auto}
.mbl-share a,.mbl .mbl-copy{padding:6px 12px; border-radius:20px; border:1px solid var(--line); background:none!important; color:var(--ink2)!important;
  font-size:12.5px; font-weight:600; font-family:inherit; cursor:pointer; line-height:1.4; box-shadow:none!important}
.mbl-share a:hover,.mbl .mbl-copy:hover{border-color:var(--ink3); color:var(--ink)!important}

.mbl-wrap{display:block; max-width:900px; margin:0 auto}
.mbl-wrap.has-toc{display:grid; grid-template-columns:minmax(0,840px) 250px; gap:48px; max-width:none; justify-content:center; align-items:start}
.mbl-toc{grid-column:2; grid-row:1; position:sticky; top:150px; font-size:13.5px}
.mbl-body{grid-column:1; grid-row:1; min-width:0}
.mbl-toc details{border-inline-start:2px solid var(--line); padding-inline-start:16px}
.mbl-toc summary{cursor:pointer; font-weight:700; color:var(--ink); margin-bottom:10px; list-style:none}
.mbl-toc summary::-webkit-details-marker{display:none}
.mbl-toc ol{list-style:none; margin:0!important; padding:0!important; display:grid; gap:8px}
.mbl-toc li{margin:0!important}
.mbl-toc li.l3{padding-inline-start:12px}
.mbl-toc a{color:var(--ink3)!important; line-height:1.6; display:block}
.mbl-toc a:hover{color:var(--ink)!important}

/* محتوى معمول بـ Elementor داخل المقالة: ياخد عرض المقالة كله */
.mbl-body .elementor .e-con{--width:100%!important; --content-width:100%; max-width:100%!important}
.mbl-body .elementor .elementor-widget{max-width:100%}
.mbl-body .elementor .elementor-widget-image:not(:has(img,svg,video)){display:none}
.mbl-body .elementor .e-con:not(:has(img,svg,video,iframe,table,p,h1,h2,h3,h4,ul,ol,.elementor-widget:not(.elementor-widget-image))){display:none}
/* النص */
.mbl-body{font-size:clamp(16.5px,1.3vw,18px); line-height:2; color:var(--text)}
.mbl-single[dir=ltr] .mbl-body{line-height:1.8}
.mbl-body>*:first-child{margin-top:0!important}
.mbl-body p:not(.mbl-html *){margin:0 0 1.25em!important; color:var(--text)!important; font-size:inherit!important; line-height:inherit!important}
.mbl-body h2,.mbl-body h3,.mbl-body h4{font-family:var(--head)!important; color:var(--ink)!important; font-weight:800!important; scroll-margin-top:150px}
.mbl-body h2{font-size:1.6em!important; line-height:1.45!important; margin:1.9em 0 .6em!important}
.mbl-body h3{font-size:1.25em!important; line-height:1.5!important; margin:1.6em 0 .5em!important}
.mbl .mbl-body a:not(.mbl-html *){color:var(--ink)!important; text-decoration:underline!important; text-decoration-thickness:1.5px; text-underline-offset:4px; text-decoration-color:var(--ink3)}
.mbl-body a:not(.mbl-html *):hover{text-decoration-color:var(--ink)}
.mbl-body ul,.mbl-body ol{margin:0 0 1.3em!important; padding-inline-start:1.4em!important}
.mbl-body li{margin:0 0 .45em!important}
.mbl-body li::marker{color:var(--ink3)}
.mbl-body strong{color:var(--ink); font-weight:700}
.mbl-body img,.mbl-body video,.mbl-body iframe{max-width:100%; height:auto; border-radius:16px}
.mbl-body figure{margin:1.6em 0!important}
.mbl-body figcaption{font-size:13.5px; color:var(--ink3); text-align:center; margin-top:8px}
.mbl-body blockquote{margin:1.6em 0!important; padding:18px 22px!important; border:0!important; border-inline-start:4px solid var(--ink)!important;
  background:var(--soft)!important; border-radius:0 14px 14px 0; font-style:normal!important; color:var(--ink)!important}
[dir=rtl] .mbl-body blockquote,.mbl-single[dir=rtl] .mbl-body blockquote{border-radius:14px 0 0 14px}
.mbl-body blockquote p:last-child{margin:0!important}
.mbl-body hr{border:0; height:1px; background:var(--line); margin:2.4em 0}
.mbl-body code{font-size:.88em; background:var(--soft); padding:2px 6px; border-radius:6px; direction:ltr; unicode-bidi:isolate}
.mbl-body pre{background:#141416; color:#eee; padding:18px; border-radius:14px; overflow:auto; direction:ltr; text-align:left; font-size:14px; line-height:1.7}
.mbl-body pre code{background:none; padding:0; color:inherit}
.mbl-tbl{margin:1.6em 0; border:1px solid var(--line); border-radius:14px; overflow-x:auto}
.mbl-body table{width:100%; border-collapse:separate; border-spacing:0; margin:0!important; font-size:.92em; line-height:1.6; border:0!important}
.mbl-body thead th{background:var(--soft); font-weight:700; color:var(--ink)}
.mbl-body th,.mbl-body td{padding:12px 16px; text-align:start; border-bottom:1px solid var(--line); white-space:nowrap}
.mbl-body tr:last-child td{border-bottom:0}
.mbl-body tbody tr:nth-child(even) td{background:var(--soft)}
.mbl-body .mbl-note-box{margin:1.5em 0!important; padding:16px 20px 16px 20px; border-radius:14px; background:var(--soft); border:1px solid var(--line); position:relative}
.mbl-body .mbl-note-box p{margin:0!important}
.mbl-body .mbl-note-box::before{display:block; font-weight:800; font-size:.85em; margin-bottom:4px; color:var(--ink)}
.mbl-body .mbl-note-box.is-tip::before{content:'💡 نصيحة'}
.mbl-body .mbl-note-box.is-warn::before{content:'⚠️ تنبيه'}
.mbl-single[dir=ltr] .mbl-note-box.is-tip::before{content:'💡 Tip'}
.mbl-single[dir=ltr] .mbl-note-box.is-warn::before{content:'⚠️ Heads up'}
.mbl-body .mbl-note-box.is-warn{background:rgba(245,166,35,.1); border-color:rgba(245,166,35,.35)}
.mbl-body .mbl-fig img{display:block; margin:0 auto}
.mbl-tags{display:flex; flex-wrap:wrap; gap:8px; margin-top:28px!important}
.mbl-tags span{padding:5px 12px; border-radius:20px; background:var(--chip); font-size:13px; color:var(--ink2)}

.mbl-cta{max-width:900px; margin:clamp(36px,5vw,64px) auto 0}
.mbl-rel{margin-top:clamp(48px,6vw,80px); padding-top:clamp(28px,4vw,44px); border-top:1px solid var(--line)}
.mbl-rel .mbl-h2{margin-bottom:22px!important}

/* ── الشاشات ── */
@media (max-width:1000px){
  .mbl-wrap.has-toc{display:block; max-width:900px; margin:0 auto}
  .mbl-toc{position:static; margin-bottom:28px; padding:14px 16px; border-radius:14px; background:var(--soft)}
  .mbl-toc details{border:0; padding:0}
  .mbl-toc summary{margin:0}
  .mbl-toc details[open] summary{margin-bottom:12px}
  .mbl-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mbl-card.is-big{grid-template-columns:1fr}
}
@media (max-width:640px){
  .mbl-grid,.mbl-grid.is-row{grid-template-columns:1fr}
  .mbl-grid.is-row{display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:14px; margin-inline:-16px; padding:0 16px 8px; scrollbar-width:none}
  .mbl-grid.is-row::-webkit-scrollbar{display:none}
  .mbl-grid.is-row .mbl-card{flex:0 0 82%; scroll-snap-align:start}
  .mbl-share{margin-inline-start:0; width:100%}
  .mbl-lh{align-items:center}
  .mbl-cover.is-hero{border-radius:20px}
}
@media (prefers-reduced-motion:reduce){.mbl *{transition:none!important}}

/* ══ [mi_latest_posts] — مقالة كبيرة + ليستة مرقّمة ══ */
.mbl-feat{display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:clamp(24px,4vw,56px); align-items:start}
.mbl-feat.is-solo{grid-template-columns:minmax(0,1fr); max-width:760px; margin-inline:auto}
.mbl-card.is-lead .mbl-card-t{font-size:clamp(21px,2.2vw,28px)!important; line-height:1.45!important}
.mbl-card.is-lead .mbl-card-x{-webkit-line-clamp:3}
.mbl .mbl-flist{list-style:none; margin:0!important; padding:0!important; display:flex; flex-direction:column}
.mbl-fi{position:relative; display:grid; grid-template-columns:auto minmax(0,1fr) 112px; gap:16px; align-items:center;
  padding:18px 0; border-bottom:1px solid var(--line); margin:0!important}
.mbl-fi:first-child{padding-top:0}
.mbl-fi:last-child{border-bottom:0}
.mbl-fn{font-family:var(--head); font-size:30px; font-weight:900; line-height:1; color:var(--ink); opacity:.16; min-width:2ch; transition:opacity .3s}
.mbl-fi:hover .mbl-fn{opacity:.9}
.mbl-fb{display:flex; flex-direction:column; gap:6px; min-width:0}
.mbl-fi .mbl-card-t{font-size:16.5px!important; line-height:1.55!important}
.mbl-fi .mbl-card-t a::after{content:''; position:absolute; inset:0}
.mbl-fi:hover .mbl-card-t a{background-size:100% 1.5px}
.mbl-fthumb{position:relative; display:block; aspect-ratio:4/3; border-radius:12px; overflow:hidden; background:var(--cv-bg);
  transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.mbl-fthumb::before{content:''; position:absolute; inset:0; background-image:var(--cv-pat); background-size:40px; opacity:.2}
.mbl-fthumb.has-img{background:#111 var(--cv-img) center/cover no-repeat}
.mbl-fthumb.has-img::before{display:none}
.mbl-fi:hover .mbl-fthumb{transform:scale(1.04)}
@media (max-width:900px){.mbl-feat{grid-template-columns:minmax(0,1fr)}}
@media (max-width:640px){.mbl-fi{grid-template-columns:auto minmax(0,1fr) 84px; gap:12px}.mbl-fn{font-size:24px}.mbl-fi .mbl-card-t{font-size:15px!important}}

/* ══════════════ صفحة كل المقالات ══════════════ */
.mbl-list{width:100%; min-width:0; box-sizing:border-box; max-width:1200px; margin:0 auto; padding:clamp(22px,4vw,48px) clamp(16px,3vw,32px) clamp(40px,6vw,80px)}
.mbl-ahead{display:flex; align-items:flex-end; justify-content:space-between; gap:20px 32px; flex-wrap:wrap; margin-bottom:22px}
.mbl-ahead-t{flex:1 1 380px; min-width:0}
.mbl-ahead .mbl-h{margin:0 0 8px!important}
.mbl-ahead .mbl-sub{margin:0!important; max-width:560px}
.mbl-search{position:relative; flex:0 1 340px; display:flex; align-items:center}
.mbl-search svg{position:absolute; inset-inline-start:14px; width:18px; height:18px; fill:none; stroke:var(--ink3); stroke-width:2; stroke-linecap:round; pointer-events:none}
.mbl .mbl-search input{width:100%; height:48px; padding:0 16px 0 16px!important; padding-inline-start:42px!important; border-radius:30px!important; border:1.5px solid var(--line)!important;
  background:var(--card)!important; color:var(--ink)!important; font:inherit; font-size:14.5px!important; box-shadow:none!important; outline:none; transition:border-color .2s}
.mbl .mbl-search input:focus{border-color:var(--ink)!important}
.mbl .mbl-search input::placeholder{color:var(--ink3)}
.mbl-filters{display:flex; align-items:center; justify-content:space-between; gap:12px 20px; flex-wrap:wrap; padding:14px 0; margin-bottom:clamp(20px,3vw,32px);
  border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.mbl-chips{display:flex; gap:8px; flex-wrap:wrap; min-width:0; max-width:100%}
.mbl .mbl-chips a,.mbl .mbl-sort a{display:inline-flex; align-items:center; gap:6px; padding:8px 15px; border-radius:30px; border:1px solid var(--line);
  color:var(--ink2)!important; font-size:13.5px; font-weight:700; white-space:nowrap; transition:all .2s; text-decoration:none!important}
.mbl .mbl-chips a small{font-size:11px; font-weight:700; padding:1px 7px; border-radius:20px; background:var(--chip); color:inherit; opacity:.85}
.mbl .mbl-chips a:hover,.mbl .mbl-sort a:hover{border-color:var(--ink3); color:var(--ink)!important}
.mbl .mbl-chips a.on{background:var(--ink); border-color:var(--ink); color:var(--card)!important}
.mbl .mbl-chips a.on small{background:rgba(127,127,127,.25)}
.mbl-sort{display:inline-flex; gap:2px; padding:3px; border-radius:30px; background:var(--chip)}
.mbl .mbl-sort a{border:0; padding:7px 13px; font-size:12.5px}
.mbl .mbl-sort a.on{background:var(--card); color:var(--ink)!important; box-shadow:0 2px 8px -3px rgba(0,0,0,.25)}
.mbl-info{display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; margin:0 0 20px!important; color:var(--ink2); font-size:14px}
.mbl-info span{color:var(--ink)}
.mbl .mbl-clear{margin-inline-start:auto; color:var(--ink3)!important; font-size:13px; font-weight:600}
.mbl .mbl-clear:hover{color:var(--ink)!important}
.mbl-empty{display:grid; justify-items:center; gap:6px; padding:56px 16px!important; border:1px dashed var(--line); border-radius:20px; text-align:center}
.mbl-empty b{color:var(--ink); font-size:18px}
.mbl-empty p{margin:0!important; color:var(--ink2)}
.mbl .mbl-empty a{margin-top:8px; padding:9px 18px; border-radius:30px; background:var(--ink); color:var(--card)!important; font-weight:700; font-size:14px}
/* أبرز المقالات */
.mbl-top{display:grid; grid-template-columns:minmax(0,1.55fr) minmax(0,1fr); gap:clamp(18px,2.6vw,32px); margin-bottom:clamp(32px,4vw,52px)}
.mbl-card.is-top .mbl-card-t{font-size:clamp(22px,2.4vw,30px)!important; line-height:1.4!important}
.mbl-card.is-top .mbl-card-x{-webkit-line-clamp:3}
.mbl-top-side{display:grid; gap:clamp(16px,2vw,24px); align-content:start}
.mbl-card.is-mini .mbl-card-x{display:none}
.mbl-card.is-mini .mbl-card-t{font-size:17px!important}
.mbl .mbl-sec{margin:0 0 18px!important; font-family:var(--head)!important; font-size:22px!important; font-weight:800!important; color:var(--ink)!important}
/* المزيد */
.mbl-morew{display:grid; justify-items:center; gap:8px; margin-top:clamp(28px,4vw,44px)}
.mbl .mbl-more-btn{padding:13px 28px; border-radius:30px; border:1.5px solid var(--ink); color:var(--ink)!important; font-weight:800; font-size:14.5px; transition:all .2s}
.mbl .mbl-more-btn:hover{background:var(--ink); color:var(--card)!important}
.mbl-morew small{color:var(--ink3); font-size:12.5px}
.mbl-card.is-in{animation:mblIn .45s ease both}
@keyframes mblIn{from{opacity:0; transform:translateY(10px)}to{opacity:1; transform:none}}
.mbl-list.is-loading .mbl-results{opacity:.45; pointer-events:none; transition:opacity .2s}
@media (max-width:900px){
  .mbl-top{grid-template-columns:minmax(0,1fr)}
  .mbl-top-side{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .mbl-list{padding-top:20px}
  .mbl-ahead{gap:16px}
  .mbl-search{flex:1 1 100%}
  .mbl-filters{flex-direction:column; align-items:stretch; padding:12px 0}
  /* التصنيفات سطر واحد بيتسحب — من غير ما أي اسم يتقص */
  .mbl-chips{flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; margin-inline:-16px; padding-inline:16px; scroll-padding-inline:16px}
  .mbl-chips::-webkit-scrollbar{display:none}
  .mbl .mbl-chips a{flex:none}
  .mbl-sort{align-self:flex-start}
  .mbl-top-side{grid-template-columns:minmax(0,1fr)}
  /* كروت مختصرة: صورة صغيرة + عنوان — أسهل في التصفح */
  .mbl-feed{display:flex!important; flex-direction:column; gap:0!important}
  .mbl-feed .mbl-card,.mbl-card.is-mini{display:grid; grid-template-columns:118px minmax(0,1fr); gap:14px; align-items:center; padding:14px 0; border-bottom:1px solid var(--line)}
  .mbl-feed .mbl-card:last-child{border-bottom:0}
  .mbl-feed .mbl-card .mbl-cover,.mbl-card.is-mini .mbl-cover{aspect-ratio:1/1; border-radius:14px; padding:10px}
  .mbl-feed .mbl-card .mbl-cv-t,.mbl-feed .mbl-card .mbl-cv-brand,.mbl-feed .mbl-card .mbl-cv-cat,
  .mbl-card.is-mini .mbl-cv-t,.mbl-card.is-mini .mbl-cv-brand,.mbl-card.is-mini .mbl-cv-cat{display:none}
  .mbl-feed .mbl-card .mbl-card-x{display:none}
  .mbl-feed .mbl-card .mbl-card-t,.mbl-card.is-mini .mbl-card-t{font-size:15.5px!important; line-height:1.55!important}
  .mbl-feed .mbl-card .mbl-card-b,.mbl-card.is-mini .mbl-card-b{gap:6px}
}