/* =====================================================================
   CF BROWSE v1 — الأقسام + بطاقة العمل + بطاقة المعلومات (Datasheet)
   ---------------------------------------------------------------------
   • نفس هوية الموقع: قيم --cf-* مطابقة لـ --hm-* / --sh-* / --mh-*
     (الخلفية #0b0d12 | السطح #141821 | التمييز #e63946 | الذهبي #ffb52a)
   • كل الأصناف بالبادئة cf- ومحصورة داخل .cf  → لا تعارض مع style.css
   • حمّل هذا الملف بعد style.css
   الفهرس:
     1) المتغيرات والتصفير      6) بطاقة العمل (Grid)
     2) فتات الخبز               7) وضع القائمة (Datasheet)
     3) رأس الصفحة + المثبّت     8) البطاقة المميّزة (Spotlight)
     4) بطاقة المعلومات (Hero)   9) الترقيم + الحالات + الحركة
     5) القسم + شريط الفلترة
   ===================================================================== */

/* ---------- 1) المتغيرات والتصفير ---------- */
.cf{
  --cf-bg:#0b0d12;
  --cf-surface:#141821;
  --cf-surface-2:#1b2030;
  --cf-line:rgba(255,255,255,.08);
  --cf-line-2:rgba(255,255,255,.15);
  --cf-text:#f3f5f9;
  --cf-soft:#dfe3ec;
  --cf-muted:#9aa3b5;
  --cf-accent:#e63946;
  --cf-accent-2:#c21d1d;
  --cf-gold:#ffb52a;
  --cf-green:#1fb457;
  --cf-r:16px;
  --cf-ease:cubic-bezier(.2,.7,.2,1);
  direction:rtl;
  text-align:right;
  color:var(--cf-text);
  font-family:inherit;
  font-size:13px;
  line-height:1.6;
  margin:0 0 12px;
}
.cf *,.cf *::before,.cf *::after{box-sizing:border-box}
.cf [hidden]{display:none!important}
.cf a{color:inherit;text-decoration:none}
.cf a:hover,.cf a:focus{text-decoration:none}
:where(.cf) :is(ul,ol){list-style:none;margin:0;padding:0;display:block}
.cf li{list-style:none}
.cf h1,.cf h2,.cf h3,.cf p,.cf dl,.cf dd,.cf dt,.cf figure{margin:0;padding:0}
.cf button,.cf select{font-family:inherit;font-size:inherit;color:inherit}
.cf img{max-width:100%;border:0}
.cf :focus-visible{outline:2px solid var(--cf-gold);outline-offset:2px;border-radius:8px}

/* ---------- 2) فتات الخبز + رأس الصفحة ----------
   نفس الإزاحة الداخلية لكل العناصر (17px = حدّ 1px + حشوة 16px) حتى يقع الخط الأحمر | في محاذاة واحدة
   مع عنوان الصفحة وعناوين الأقسام («آخر الإضافات» ...). */
.cf{--cf-inset:17px;--cf-h-fs:20px}      /* حجم موحَّد لعنوان الصفحة وعناوين الأقسام */
.cf-crumbs{margin:0 0 10px;padding:0 var(--cf-inset)}
.cf-crumbs ol{
  display:flex;flex-wrap:wrap;align-items:center;gap:2px 0;min-height:22px;
  padding:0 10px 0 0;border-right:4px solid var(--cf-accent);        /* الخط الأحمر | قبل المسار */
  font-size:12.5px;color:var(--cf-muted)
}
.cf-crumbs li{display:inline-flex;align-items:center}
.cf-crumbs li+li::before{content:"\2039";margin:0 9px;color:rgba(255,255,255,.3);font-size:16px;line-height:1}
.cf-crumbs a{color:var(--cf-soft)}
.cf-crumbs a:hover{color:var(--cf-gold)}
.cf-crumbs [aria-current="page"]{color:var(--cf-text);font-weight:700}

/* رأس الصفحة (عنوان + وصف): نفس كتلة القسم تماماً (خلفية/حد/حواف/حشوة) */
.cf-pagehead{padding:14px 16px 16px;background:var(--cf-bg);border:1px solid var(--cf-line);border-radius:22px}
.cf .cf-ph-title{
  display:flex;align-items:center;gap:8px;margin:0;padding:0 10px 0 0;border:0;border-right:4px solid var(--cf-accent);background:none;
  font-size:var(--cf-h-fs);font-weight:800;line-height:1.3;letter-spacing:0;text-align:right;color:var(--cf-text)
}
.cf .cf-ph-title i{color:var(--cf-gold);font-size:calc(var(--cf-h-fs) - 2px)}
.cf-pagehead .cf-sw{margin-top:12px;padding-top:12px;border-top:1px solid var(--cf-line)}
.cf .cf-ph-desc{margin:0;font-size:13.5px;line-height:1.95;color:var(--cf-soft)}

.cf-pinned{padding:12px 12px 4px;background:var(--cf-bg);border:1px solid var(--cf-line);border-radius:22px;overflow:hidden}
.cf-pinned .cf-head{margin-bottom:4px}
#featured-carousel .carousel-inner{width:210px;height:310px;margin:10px}
#featured-carousel .carousel-info{position:relative;padding:0;border-radius:14px;overflow:hidden;border:1px solid var(--cf-line);background:var(--cf-surface)}
#featured-carousel .slider-movie-image{display:block;width:210px;height:310px;object-fit:cover;border:0;transition:transform .35s ease,opacity .35s ease}
#featured-carousel .box-details{
  position:absolute;bottom:0;right:0;width:100%;padding:20px 12px 12px;
  background:linear-gradient(transparent,#030715);
  transform:scale(.7);opacity:0;visibility:hidden;transition:.3s all ease
}
#featured-carousel .box-details h3{margin:0;font-size:14px!important;line-height:1.5;color:#fff}
#featured-carousel .box-details a{color:#fff}
#featured-carousel .owl-item>.carousel-inner:hover .box-details{visibility:visible;opacity:1;transform:scale(1)}
#featured-carousel .owl-item>.carousel-inner:hover .slider-movie-image{opacity:.25;transform:scale(1.15)}
.cf-pinned .owl-prev,.cf-pinned .owl-next{top:41%;opacity:.9}
.cf-pin{
  position:absolute;top:8px;right:8px;z-index:3;padding:2px 10px;border-radius:999px;
  background:linear-gradient(135deg,#ff4452,var(--cf-accent-2));color:#fff;font-size:11px;font-weight:800;
  box-shadow:0 4px 12px rgba(230,57,70,.35)
}

/* ---------- 4) بطاقة المعلومات (Datasheet Hero) ---------- */
.cf-hero{position:relative;isolation:isolate;overflow:hidden;background:var(--cf-bg);border:1px solid var(--cf-line);border-radius:22px}
.cf-hero-bg{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;overflow:hidden;background:var(--cf-bg)}
.cf-hero-bg i{
  position:absolute;top:-12%;right:-12%;bottom:-12%;left:-12%;
  background-size:cover;background-position:center 30%;
  filter:blur(26px) saturate(1.45) brightness(.62);transform:scale(1.06)
}
.cf-hero-bg::after{
  content:"";position:absolute;top:0;right:0;bottom:0;left:0;
  background:
    linear-gradient(0deg,var(--cf-bg) 0%,rgba(11,13,18,0) 46%),
    linear-gradient(270deg,rgba(11,13,18,.9) 0%,rgba(11,13,18,.55) 55%,rgba(11,13,18,.2) 100%)
}
.cf-hero-in{
  display:grid;align-items:start;
  grid-template-columns:188px minmax(0,1fr);
  grid-template-areas:"poster head" "poster rest";
  column-gap:24px;row-gap:12px;padding:20px 24px
}
.cf-hero-poster{grid-area:poster;align-self:start;position:relative;aspect-ratio:258/338;border-radius:16px;overflow:hidden;background:var(--cf-surface-2);box-shadow:0 22px 38px -12px #000,0 0 0 1px rgba(255,255,255,.14)}
.cf-hero-poster img{display:block;width:100%;height:100%;object-fit:cover}
.cf-hero-poster .cf-ring{width:44px;height:44px;top:8px;left:8px}
.cf-hero-poster .cf-ring b{font-size:12.5px}
.cf-hero-head{grid-area:head;display:flex;flex-direction:column;gap:8px;min-width:0}
.cf-hero-rest{grid-area:rest;display:flex;flex-direction:column;gap:12px;min-width:0}
.cf-kicker{display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700;color:var(--cf-gold)}
.cf .cf-h1{
  margin:0;padding:0 14px 0 0;border:0;border-right:5px solid var(--cf-gold);background:none;
  font-size:clamp(22px,2.6vw,30px);font-weight:700;line-height:1.4;letter-spacing:0;text-align:right;color:#fff;
  text-shadow:0 2px 24px rgba(0,0,0,.6)
}
.cf .cf-orig{font-size:12px;line-height:1.5;color:var(--cf-muted);direction:ltr;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cf-hero .cf-orig{font-size:13.5px;padding-right:19px}
.cf-pills{display:flex;flex-wrap:wrap;gap:8px}
.cf-pill{
  display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 12px;border-radius:999px;
  font-size:12px;font-weight:700;line-height:1;color:#fff;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)
}
.cf-pill i{font-size:12px;color:var(--cf-gold)}
.cf-pill.is-live{color:#35e08a;background:rgba(53,224,138,.12);border-color:rgba(53,224,138,.25)}
.cf-pill.is-live i{color:#35e08a}
.cf-pill.is-done{color:#ffd27a;background:rgba(255,181,42,.12);border-color:rgba(255,181,42,.25)}
.cf-pill.is-age{background:var(--ac,#3b5999);border-color:transparent}
.cf-pill.is-age i{color:#fff}
.cf-pill.is-q{border-color:transparent;direction:ltr}
:where(.cf-pill.is-q){background:#2a3042}
.cf-sw{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0;width:100%}
.cf .cf-lead{font-size:14px;line-height:1.9;color:var(--cf-soft);width:100%}
.cf-js .cf-clamp{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:var(--cf-lines,3);overflow:hidden}
.cf-js .cf-clamp.is-open{display:block;-webkit-line-clamp:unset}
.cf-more{
  display:none;align-items:center;gap:5px;padding:2px 0;border:0;background:none;cursor:pointer;
  font-size:12px;font-weight:700;color:var(--cf-gold)
}
.cf-js .cf-more{display:inline-flex}
.cf-more i{transition:transform .25s}
.cf-more[aria-expanded="true"] i{transform:rotate(180deg)}
.cf-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:8px}
.cf-tile{padding:7px 12px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid var(--cf-line)}
.cf-tile dt{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--cf-muted)}
.cf-tile dt i{color:var(--cf-accent);font-size:12px;width:14px;text-align:center}
.cf-tile dd{margin-top:0;font-size:13.5px;font-weight:800;color:var(--cf-gold);line-height:1.5}
.cf-hero-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px}
.cf-people{display:flex;flex-wrap:wrap;flex:1 1 auto;min-width:0;gap:8px}
.cf-person{display:inline-flex;align-items:center;gap:8px;padding:4px 12px 4px 5px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid var(--cf-line);transition:border-color .2s,background .2s}
.cf-person:hover{border-color:rgba(255,181,42,.5);background:rgba(255,181,42,.08)}
.cf-person img{display:block;flex:none;width:32px;height:32px;border-radius:50%;object-fit:cover;border:2px solid var(--cf-accent);background:var(--cf-surface-2)}
.cf-person span{display:flex;flex-direction:column;min-width:0;line-height:1.35}
.cf-person b{font-size:12.5px;font-weight:700;color:#fff;white-space:nowrap;max-width:104px;overflow:hidden;text-overflow:ellipsis}
.cf-person small{font-size:10.5px;color:var(--cf-muted)}
.cf-actions{display:flex;flex-wrap:wrap;flex:none;gap:8px}
.cf-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 18px;border-radius:12px;
  font-size:13.5px;font-weight:700;color:#fff;cursor:pointer;border:1px solid var(--cf-line-2);background:rgba(255,255,255,.08);
  transition:transform .2s var(--cf-ease),background .2s,border-color .2s
}
.cf-btn:hover{color:#fff;background:rgba(255,255,255,.14);transform:translateY(-1px)}
.cf-btn:not(.cf-btn--primary){padding:0 13px}
.cf-btn--primary{border-color:transparent;background:linear-gradient(135deg,#ff4452,var(--cf-accent-2));box-shadow:0 8px 20px rgba(230,57,70,.32)}
.cf-btn--primary:hover{background:linear-gradient(135deg,#ff5a66,#d32424);filter:brightness(1.05)}

@media (min-width:721px){                 /* ديسكتوب: الممثلون + الأزرار في صف واحد */
  .cf-hero-foot{flex-wrap:nowrap}
  .cf-people{flex-wrap:nowrap;overflow:hidden}
  .cf-person{flex:0 1 auto;min-width:0}
}

/* ---------- 5) القسم + شريط الفلترة ---------- */
.cf-sec{padding:14px 16px 16px;background:var(--cf-bg);border:1px solid var(--cf-line);border-radius:22px}
.cf-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px}
.cf .cf-h{
  display:flex;align-items:center;gap:8px;margin:0;padding:0 10px 0 0;border:0;border-right:4px solid var(--cf-accent);background:none;
  font-size:var(--cf-h-fs);font-weight:800;line-height:1.3;letter-spacing:0;color:var(--cf-text);text-align:right
}
.cf .cf-h i{color:var(--cf-gold);font-size:calc(var(--cf-h-fs) - 2px)}
.cf .cf-n{
  display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:999px;
  background:var(--cf-surface-2);border:1px solid var(--cf-line);font-size:11.5px;font-weight:700;color:var(--cf-muted)
}
.cf-head-tools{display:flex;align-items:center;gap:8px}
.cf-all{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 13px;border-radius:10px;background:var(--cf-surface);border:1px solid var(--cf-line);font-size:12.5px;font-weight:700;color:var(--cf-soft)}
.cf-all:hover{color:#fff;border-color:rgba(255,181,42,.45)}
.cf-all i{color:var(--cf-gold);font-size:12px}
.cf-view{display:inline-flex;padding:3px;gap:2px;border-radius:11px;background:var(--cf-surface);border:1px solid var(--cf-line)}
.cf-view button{display:inline-flex;align-items:center;justify-content:center;width:32px;height:28px;padding:0;border:0;border-radius:8px;background:none;color:var(--cf-muted);font-size:14px;cursor:pointer;transition:background .2s,color .2s}
.cf-view button:hover{color:#fff}
:root:not([data-cf-view="list"]) .cf-view [data-view="grid"],
:root[data-cf-view="list"] .cf-view [data-view="list"]{background:linear-gradient(135deg,#ff4452,var(--cf-accent-2));color:#fff}

.cf-bar{display:flex;flex-direction:column;gap:10px;margin:0 0 14px;padding:10px;background:var(--cf-surface);border:1px solid var(--cf-line);border-radius:16px}
.cf-chips{display:flex;gap:6px;overflow-x:auto;padding:0 0 2px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.cf-chips::-webkit-scrollbar{display:none}
.cf-chip{
  flex:none;height:32px;padding:0 14px;border-radius:999px;cursor:pointer;
  background:var(--cf-surface-2);border:1px solid var(--cf-line);color:var(--cf-muted);
  font-size:12.5px;font-weight:700;white-space:nowrap;transition:color .2s,border-color .2s,background .2s
}
.cf-chip:hover{color:#fff;border-color:var(--cf-line-2)}
.cf-chip[aria-pressed="true"]{background:linear-gradient(135deg,#ff4452,var(--cf-accent-2));border-color:transparent;color:#fff;box-shadow:0 6px 14px rgba(230,57,70,.28)}
.cf-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.cf-sel{position:relative;display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--cf-muted)}
.cf-sel>span{font-weight:700}
.cf-sel select{
  -webkit-appearance:none;appearance:none;height:34px;min-width:104px;max-width:170px;padding:0 12px 0 32px;border-radius:10px;cursor:pointer;
  background:var(--cf-surface-2) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' fill='none' stroke='%239aa3b5' stroke-width='1.6' stroke-linecap='round'/></svg>") no-repeat 12px center;
  border:1px solid var(--cf-line);color:var(--cf-text);font-size:12.5px;font-weight:700;text-overflow:ellipsis
}
.cf-sel select:hover{border-color:var(--cf-line-2)}
.cf-sel select option{background:#141821;color:#f3f5f9}
.cf-tools{display:flex;align-items:center;gap:10px;margin-right:auto}
.cf-count{font-size:12px;color:var(--cf-muted);white-space:nowrap}
.cf-count b{color:var(--cf-gold);font-weight:800}
.cf-reset{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px;border-radius:9px;border:1px solid var(--cf-line);background:none;color:var(--cf-soft);font-size:12px;font-weight:700;cursor:pointer}
.cf-reset:hover{color:#fff;border-color:var(--cf-accent)}
.cf-note{margin:-6px 0 12px;font-size:11.5px;color:var(--cf-muted)}
.cf-note i{color:var(--cf-gold);margin-left:5px}

/* الشبكة الديناميكية: أعمدة تتكيّف تلقائياً مع العرض */
.cf .cf-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(172px,1fr));gap:12px;margin:0;padding:0}
.cf .cf-item{display:flex;min-width:0;margin:0}

/* ---------- 6) بطاقة العمل (وضع الشبكة) ---------- */
.cf .cf-card{
  position:relative;isolation:isolate;display:flex;flex-direction:column;flex:1 1 auto;width:100%;min-width:0;
  background:var(--cf-surface);border:1px solid var(--cf-line);border-radius:var(--cf-r);overflow:hidden;
  transition:transform .25s var(--cf-ease),border-color .25s,box-shadow .25s
}
.cf .cf-stage{position:relative;flex:none;aspect-ratio:258/338;background:var(--cf-surface-2);overflow:hidden}
.cf .cf-media{position:absolute;top:0;right:0;bottom:0;left:0;display:block}
.cf .cf-media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--cf-ease)}
.cf .cf-media::after{
  content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;
  background:
    linear-gradient(0deg,rgba(11,13,18,.8) 0,rgba(11,13,18,0) 40%),
    linear-gradient(180deg,rgba(11,13,18,.42) 0,rgba(11,13,18,0) 24%)
}

/* الجودة (تُلوَّن بأصناف .quality-* القديمة نفسها) */
.cf-q{position:absolute;top:8px;right:8px;z-index:1;padding:3px 8px;border-radius:8px;font-size:10.5px;font-weight:800;line-height:1.5;letter-spacing:.2px;color:#fff;direction:ltr;box-shadow:0 4px 10px rgba(0,0,0,.4)}
:where(.cf-q){background:#2a3042}
.cf-q.quality-4k,.cf-pill.is-q.quality-4k{background:linear-gradient(135deg,#ffb52a,#e08a00);color:#1a1300}

/* التقييم: حلقة بارزة (نفس عتبات الألوان القديمة: <4.6 أحمر | حتى 6.9 ذهبي | 7+ أخضر) */
.cf-ring{
  --c:#ffbe00;position:absolute;top:8px;left:8px;z-index:1;width:40px;height:40px;border-radius:50%;
  display:grid;place-items:center;
  background:conic-gradient(var(--c) calc(var(--p)*1%),rgba(255,255,255,.18) 0);
  box-shadow:0 4px 12px rgba(0,0,0,.45)
}
.cf-ring::before{content:"";position:absolute;top:4px;right:4px;bottom:4px;left:4px;border-radius:50%;background:rgba(11,13,18,.9)}
.cf-ring b{position:relative;font-size:11.5px;font-weight:800;line-height:1;letter-spacing:0;color:#fff;font-variant-numeric:tabular-nums}
.cf-ring[data-lv="hi"]{--c:#2ed06a}
.cf-ring[data-lv="lo"]{--c:#ff4d4d}

/* حالة العمل */
.cf-flags{position:absolute;right:8px;bottom:8px;z-index:1;display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.cf-st{display:inline-flex;align-items:center;gap:6px;padding:2px 9px;border-radius:999px;font-size:10.5px;font-weight:800;line-height:1.7;background:rgba(11,13,18,.72);border:1px solid rgba(255,255,255,.12)}
.cf-st.is-live{color:#35e08a}
.cf-st.is-live::before{content:"";width:6px;height:6px;border-radius:50%;background:#35e08a;animation:cfPulse 1.6s ease-in-out infinite}
.cf-st.is-done{color:#ffd27a}
.cf-st.is-renew{color:#ff9f43}
@keyframes cfPulse{50%{opacity:.25;transform:scale(.7)}}

/* زر المعلومات (للمس فقط) */
.cf-info{
  display:none;position:absolute;left:8px;bottom:8px;z-index:3;width:30px;height:30px;padding:0;border-radius:50%;
  align-items:center;justify-content:center;cursor:pointer;font-size:13px;color:#fff;
  background:rgba(11,13,18,.78);border:1px solid var(--cf-line-2)
}
.cf-info .fa-times{display:none}
.cf-info[aria-expanded="true"] .fa-times{display:inline-block}
.cf-info[aria-expanded="true"] .fa-info{display:none}
@media (hover:none),(pointer:coarse){.cf-info{display:inline-flex}}

/* الجسم: عنوان مترجم + أصلي + حقائق مختصرة */
.cf-body{display:flex;flex-direction:column;gap:3px;min-width:0;padding:10px 11px 11px}
.cf .cf-title{
  margin:0;padding:0;border:0;background:none;text-align:right;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;
  font-size:13.5px;font-weight:800;line-height:1.5;letter-spacing:0;color:var(--cf-text)
}
.cf .cf-title a::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1}   /* البطاقة كلها قابلة للنقر */
.cf .cf-title a:hover,.cf .cf-title a:focus{color:var(--cf-gold)}
.cf-facts{display:flex;flex-wrap:wrap;gap:2px 10px;margin-top:3px;font-size:11.5px;line-height:1.6;color:var(--cf-muted)}
.cf-facts li{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.cf-facts i{color:var(--cf-gold);font-size:11px}

/* ملخّص التفاصيل: يظهر عند التمرير/التركيز (ديسكتوب) أو بزر ⓘ (لمس) */
.cf-sheet{
  position:absolute;top:0;right:0;left:0;z-index:2;aspect-ratio:258/338;
  display:flex;flex-direction:column;gap:7px;padding:11px;overflow:hidden;pointer-events:none;
  background:linear-gradient(0deg,rgba(11,13,18,.97) 0%,rgba(11,13,18,.95) 60%,rgba(11,13,18,.92) 100%);
  opacity:0;transform:translateY(8px);transition:opacity .25s ease,transform .35s var(--cf-ease)
}
.cf-sheet a,.cf-sheet button{pointer-events:auto}
@media (hover:hover) and (pointer:fine){
  .cf .cf-card:hover{transform:translateY(-3px);border-color:rgba(255,181,42,.45);box-shadow:0 18px 34px -14px rgba(0,0,0,.85)}
  .cf .cf-card:hover .cf-media img{transform:scale(1.05)}
  .cf .cf-card:hover .cf-sheet,.cf .cf-card:focus-within .cf-sheet{opacity:1;transform:none}
}
.cf .cf-card.is-open .cf-sheet{opacity:1;transform:none}
.cf-gen{font-size:11px;font-weight:700;line-height:1.5;color:var(--cf-gold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cf .cf-story{
  --cf-lines:4;margin:0;font-size:12px;line-height:1.75;color:var(--cf-soft);
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:var(--cf-lines);overflow:hidden;min-height:0
}
.cf-sheet .cf-more{display:none!important}
.cf-specs{display:flex;flex-direction:column;gap:3px;min-width:0}
.cf-spec{display:flex;align-items:center;gap:6px;min-width:0;font-size:11.5px;line-height:1.5}
.cf-spec dt{display:inline-flex;align-items:center;gap:5px;flex:none;color:var(--cf-muted)}
.cf-spec dt i{color:var(--cf-accent);font-size:11px;width:12px;text-align:center}
.cf-spec dd{min-width:0;color:var(--cf-soft);font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cf-spec.is-core{display:none}                   /* مكرَّرة في الجسم/الشارات بوضع الشبكة */
.cf-age{display:inline-block;padding:0 8px;border-radius:999px;background:var(--ac,#3b5999);color:#fff;font-size:10.5px;font-weight:800;line-height:1.7;direction:ltr}
.cf-cast{display:flex;flex-wrap:wrap;gap:4px;min-width:0;max-height:24px;overflow:hidden}
.cf-cast a{display:inline-block;max-width:100%;padding:1px 8px;border-radius:999px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.12);font-size:10.5px;line-height:1.7;color:var(--cf-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cf-cast a:hover{color:#fff;border-color:rgba(255,181,42,.5)}
.cf-go{
  position:relative;z-index:3;display:inline-flex;align-items:center;justify-content:center;gap:7px;
  margin-top:auto;height:32px;padding:0 14px;border-radius:10px;font-size:12px;font-weight:800;color:#fff;
  background:linear-gradient(135deg,#ff4452,var(--cf-accent-2));box-shadow:0 6px 14px rgba(230,57,70,.3)
}
.cf-go:hover{color:#fff;filter:brightness(1.08)}
.cf-go i{font-size:11px}

/* ---------- 7) وضع القائمة (Datasheet كامل بلا تمرير) ---------- */
:root[data-cf-view="list"] .cf .cf-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,440px),1fr))}
:root[data-cf-view="list"] .cf .cf-card{
  display:grid;align-content:start;
  grid-template-columns:128px minmax(0,1fr);
  grid-template-areas:"stage body" "stage sheet";
  grid-template-rows:auto 1fr
}
:root[data-cf-view="list"] .cf .cf-stage{grid-area:stage;align-self:start;margin:10px 10px 10px 0;border-radius:12px}
:root[data-cf-view="list"] .cf .cf-body{grid-area:body;padding:12px 4px 4px 14px}
:root[data-cf-view="list"] .cf .cf-title{font-size:15px;-webkit-line-clamp:2}
:root[data-cf-view="list"] .cf .cf-card.has-sheet .cf-facts{display:none}
:root[data-cf-view="list"] .cf .cf-card.has-sheet .cf-q,
:root[data-cf-view="list"] .cf .cf-info{display:none}
:root[data-cf-view="list"] .cf .cf-ring{width:34px;height:34px;top:6px;left:6px}
:root[data-cf-view="list"] .cf .cf-ring::before{top:3px;right:3px;bottom:3px;left:3px}
:root[data-cf-view="list"] .cf .cf-ring b{font-size:10.5px}
:root[data-cf-view="list"] .cf .cf-flags{right:6px;bottom:6px}
:root[data-cf-view="list"] .cf .cf-sheet,
:root[data-cf-view="list"] .cf .cf-card.is-open .cf-sheet{
  grid-area:sheet;position:static;aspect-ratio:auto;opacity:1;transform:none;overflow:visible;
  background:none;padding:2px 12px 12px 14px;gap:10px
}
:root[data-cf-view="list"] .cf .cf-story{--cf-lines:2;font-size:12.5px}
:root[data-cf-view="list"] .cf .cf-sheet .cf-more{display:inline-flex!important}
:root[data-cf-view="list"] .cf .cf-story.is-open{-webkit-line-clamp:unset}
:root[data-cf-view="list"] .cf .cf-specs{display:grid;grid-template-columns:repeat(auto-fit,minmax(112px,1fr));gap:6px 12px}
:root[data-cf-view="list"] .cf .cf-spec{display:flex;flex-direction:column;align-items:flex-start;gap:0;padding:6px 10px;border-radius:10px;background:rgba(255,255,255,.04);border:1px solid var(--cf-line)}
:root[data-cf-view="list"] .cf .cf-spec.is-core{display:flex}
:root[data-cf-view="list"] .cf .cf-spec dd{max-width:100%;font-size:12.5px}
:root[data-cf-view="list"] .cf .cf-cast{max-height:none}
:root[data-cf-view="list"] .cf .cf-go{margin-top:2px;align-self:flex-start;height:34px}
@media (min-width:768px){
  :root[data-cf-view="list"] .cf .cf-card:hover{transform:none}
}

/* ---------- 8) البطاقة المميّزة (Spotlight) — ديسكتوب فقط ---------- */
@media (min-width:768px){
  :root:not([data-cf-view="list"]) .cf .cf-item.is-feature{grid-column:span 2;grid-row:span 2}
  :root:not([data-cf-view="list"]) .cf .is-feature .cf-stage{flex:1 1 0;min-height:120px;aspect-ratio:auto}
  :root:not([data-cf-view="list"]) .cf .is-feature .cf-info{display:none}
  :root:not([data-cf-view="list"]) .cf .is-feature .cf-media img{object-position:center 18%}
  :root:not([data-cf-view="list"]) .cf .is-feature .cf-body{padding:12px 14px 4px}
  :root:not([data-cf-view="list"]) .cf .is-feature .cf-title{font-size:17px;-webkit-line-clamp:2}
  :root:not([data-cf-view="list"]) .cf .is-feature .cf-orig{font-size:12px}
  :root:not([data-cf-view="list"]) .cf .is-feature .cf-q{font-size:11.5px;padding:4px 10px}
  :root:not([data-cf-view="list"]) .cf .is-feature .cf-ring{width:48px;height:48px}
  :root:not([data-cf-view="list"]) .cf .is-feature .cf-ring b{font-size:13.5px}
  :root:not([data-cf-view="list"]) .cf .is-feature .cf-sheet,
  :root:not([data-cf-view="list"]) .cf .is-feature.cf-item .cf-card:hover .cf-sheet{
    position:static;aspect-ratio:auto;opacity:1;transform:none;overflow:visible;background:none;padding:2px 14px 14px;gap:9px
  }
  :root:not([data-cf-view="list"]) .cf .is-feature .cf-story{--cf-lines:3;font-size:12.5px}
  :root:not([data-cf-view="list"]) .cf .is-feature .cf-spec.is-core{display:flex}
  :root:not([data-cf-view="list"]) .cf .is-feature .cf-specs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px 12px}
  :root:not([data-cf-view="list"]) .cf .is-feature .cf-go{margin-top:2px}
  :root:not([data-cf-view="list"]) .cf .is-feature .cf-facts{display:none}
}

/* ---------- 9) الترقيم + الحالات + الحركة ---------- */
.cf-empty{padding:34px 16px;text-align:center;border:1px dashed var(--cf-line-2);border-radius:16px;color:var(--cf-muted)}
.cf-empty i{display:block;margin-bottom:8px;font-size:26px;color:var(--cf-gold)}
.cf-empty button{margin-top:10px}
.cf-pager{margin:14px 0 0}
.cf .cf-pager .pagination{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px;width:auto;margin:0;padding:0;background:none}
.cf .cf-pager .pagination a,
.cf .cf-pager .pagination b,
.cf .cf-pager .pagination span{
  display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;margin:0;padding:0 12px;
  border-radius:12px;background:var(--cf-surface);border:1px solid var(--cf-line);color:var(--cf-soft);
  font-family:inherit;font-size:13px;font-weight:700;line-height:1
}
.cf .cf-pager .pagination a:hover{background:var(--cf-surface-2);border-color:rgba(255,181,42,.45);color:#fff}
.cf .cf-pager .pagination b,
.cf .cf-pager .pagination a.current{background:linear-gradient(135deg,#ff4452,var(--cf-accent-2));border-color:transparent;color:#fff}

/* جوال */
@media (max-width:767px){
  .cf{--cf-inset:11px;--cf-h-fs:17px}
  .cf-sec{padding:12px 10px 12px;border-radius:18px}
  .cf-pagehead{padding:12px 10px 14px;border-radius:18px}
  .cf-pinned{border-radius:18px}
  .cf-all span{display:none}
  .cf .cf-grid{gap:10px}
  .cf-bar{padding:8px;gap:8px}
  .cf-row{gap:6px}
  .cf-sel>span{display:none}
  .cf-sel select{min-width:0;max-width:none;height:36px}
  .cf-tools{width:100%;justify-content:space-between;margin-right:0}
}
@media (max-width:600px){
  .cf .cf-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  :root[data-cf-view="list"] .cf .cf-grid{grid-template-columns:1fr}
  .cf-body{padding:9px 10px 10px}
  .cf .cf-title{font-size:13px}
  .cf .cf-story{--cf-lines:3;font-size:11.5px;line-height:1.7}
  .cf-gen{display:none}
  .cf-sheet{padding:9px;gap:6px}
  :root[data-cf-view="list"] .cf .cf-card{grid-template-columns:104px minmax(0,1fr)}
  :root[data-cf-view="list"] .cf .cf-title{font-size:14px}
  :root[data-cf-view="list"] .cf .cf-specs{grid-template-columns:repeat(2,minmax(0,1fr))}
  :root[data-cf-view="list"] .cf .cf-sheet{padding:2px 10px 12px 12px}
  :root[data-cf-view="list"] .cf .cf-gen{display:block}
}
@media (max-width:720px){
  .cf-hero-in{
    grid-template-columns:104px minmax(0,1fr);
    grid-template-areas:"poster head" "rest rest";
    column-gap:14px;row-gap:14px;padding:16px 14px
  }
  .cf-hero-poster{border-radius:12px;box-shadow:0 14px 26px -8px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.12)}
  .cf-hero-poster .cf-ring{width:36px;height:36px;top:6px;left:6px}
  .cf-hero-poster .cf-ring b{font-size:11px}
  .cf-hero-head{gap:8px}
  .cf-kicker{font-size:11.5px}
  .cf .cf-h1{font-size:18px;line-height:1.5;border-right-width:4px;padding-right:10px}
  .cf-hero .cf-orig{padding-right:14px;font-size:12px}
  .cf-pill{height:26px;padding:0 10px;font-size:11.5px}
  .cf .cf-lead{font-size:13.5px;line-height:1.9}
  .cf-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cf-hero-foot{flex-direction:column;align-items:stretch;gap:12px}
  .cf-actions{flex:1 1 100%}
  .cf-btn{flex:1 1 100%;height:46px}
  .cf-person img{width:40px;height:40px}
}
@media (prefers-reduced-motion:reduce){
  .cf *,.cf *::before,.cf *::after{transition:none!important;animation:none!important}
  .cf .cf-card:hover,.cf .cf-card:hover .cf-media img{transform:none!important}
}

/* نص القصة: محاذاة من الطرفين (ضبط) مع بقاء آخر سطر على اليمين */
.cf .cf-story,.cf .cf-lead,.cf .cf-ph-desc{text-align:justify;text-justify:inter-word;text-align-last:right;hyphens:none}
