/* ================= نفس v4 — تصميم وحركة وتجربة قراءة ================= */
:root { --nf-ease: cubic-bezier(.2, .8, .2, 1); --nf-spring: cubic-bezier(.34, 1.56, .64, 1); --nf-glass: rgb(var(--fx-fg) / .05); --nf-line: rgb(var(--fx-fg) / .12); }
html.nf-lock { overflow: hidden; }
.x-group[hidden], .section[hidden], [class^="nf-"][hidden], [class*=" nf-"][hidden] { display: none !important; }

/* ---------- حبيبات خفيفة فوق الخلفية (ثابتة، بلا حركة، لا تستقبل اللمس) ---------- */
.x-amb::after { animation: none !important; opacity: 0 !important; }
body::after {
  content: ""; position: fixed; inset: 0; z-index: 400; pointer-events: none; opacity: .045;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 180px 180px;
}

/* ---------- عناوين أكبر ومسافات أوسع ---------- */
.section { padding-block: clamp(56px, 9vw, 120px) !important; }
.section .head { margin-bottom: clamp(20px, 3vw, 36px); gap: 10px; }
.section .head h2, .x-h { font-weight: 700 !important; }
.section .head h2.x-h { display: block; overflow-wrap: anywhere; }
.nf-bcard .nf-chip { margin-bottom: 2px; }
.section .head h2 { font-size: clamp(34px, 7.4vw, 68px) !important; line-height: 1.15 !important; letter-spacing: -.015em; }
.section .head__sub { font-size: clamp(16px, 1.8vw, 20px); color: var(--text-secondary); }
.x-hero__tag { font-weight: 700 !important; }
.x-apply__t, .x-join h2 { font-weight: 700 !important; }
.nf-ghead { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.x-group h3 { font-size: clamp(22px, 3vw, 30px); font-weight: 700; }

/* ---------- انتقال الصفحات (View Transitions) ---------- */
@supports (view-transition-name: none) {
  .nf-vt::view-transition-old(root) { animation: nfOut .22s ease-in both; }
  .nf-vt::view-transition-new(root) { animation: nfIn .42s var(--nf-ease) both; }
  .x-nav { view-transition-name: nf-nav; }
  .nf-vt::view-transition-group(nf-nav) { animation: none; }
}
@keyframes nfOut { to { opacity: 0; transform: translateY(-8px); filter: blur(4px); } }
@keyframes nfIn { from { opacity: 0; transform: translateY(14px); filter: blur(6px); } }

/* ---------- زر البحث في الشريط ---------- */
.x-navsearch { flex: none; width: 36px; height: 36px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%; background: var(--fill-tertiary); color: var(--text-primary); cursor: pointer; transition: background .25s, transform .25s var(--nf-spring); }
.x-navsearch:hover { background: rgb(var(--fx-fg) / .14); }
.x-navsearch:active { transform: scale(.92); }
.x-navsearch svg { width: 17px; height: 17px; }
@media (max-width: 600px) { .x-navsearch { width: var(--tap); height: var(--tap); } }
kbd { font: 500 12px/1 ui-monospace, monospace; padding: 3px 7px; border-radius: 6px; border: 1px solid var(--nf-line); color: var(--text-secondary); background: var(--nf-glass); }

/* ---------- Bento ---------- */
.nf-bento { display: grid; gap: 16px; }
.nf-bento--goals { grid-template-columns: 1.35fr 1fr; grid-template-rows: auto auto; }
.nf-bento--goals > .x-goal:first-child { grid-row: span 2; min-height: 100%; }
.nf-bento--goals > .x-goal:first-child .x-goal__in { min-height: 100%; }
.nf-bento--goals > .x-goal:first-child .x-goal__f strong { font-size: clamp(48px, 7vw, 92px); }
.nf-bento--goals > .x-goal:first-child .x-goal__b .x-goal__t { font-size: clamp(22px, 2.4vw, 30px); line-height: 1.5; }
.nf-bento--goals .x-goal, .nf-bento--goals .x-goal__in { min-height: 210px; }
.nf-bento--goals .x-goal__f, .nf-bento--goals .x-goal__b { border-radius: 26px; padding: 26px 28px 30px; }
.nf-bento--work { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }
.nf-bento--work > .nf-tile { overflow: hidden; grid-column: span 2; display: grid; align-content: start; gap: 10px; padding: 28px !important; min-height: 220px; }
.nf-bento--work > .nf-tile:nth-child(1) { grid-column: span 4; grid-row: span 2; align-content: end; min-height: 380px; }
.nf-bento--work > .nf-tile:nth-child(1) h3 { font-size: clamp(30px, 4vw, 52px); line-height: 1.2; }
.nf-bento--work > .nf-tile:nth-child(1) p { font-size: clamp(17px, 1.6vw, 20px); max-width: 34ch; }
.nf-bento--work > .nf-tile:nth-child(4) { grid-column: span 6; grid-template-columns: auto 1fr; align-items: center; column-gap: 20px; min-height: 0; }
.nf-bento--work > .nf-tile:nth-child(4) .nf-ico { grid-row: span 2; }
.nf-tile h3 { font-size: clamp(22px, 2.4vw, 28px); font-weight: 700; }
.nf-tile p { color: var(--text-secondary); line-height: 1.8; }
.nf-ico { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: rgb(var(--fx-fg) / .08); border: 1px solid var(--nf-line); color: var(--text-primary); }
.nf-ico svg { width: 26px; height: 26px; }
.nf-bento--work > .nf-tile:nth-child(1) .nf-ico { width: 72px; height: 72px; border-radius: 22px; margin-bottom: auto; }
.nf-bento--work > .nf-tile:nth-child(1) .nf-ico svg { width: 36px; height: 36px; }
.nf-bento--work > .nf-tile:nth-child(1)::before { content: ""; position: absolute; inset-inline-end: -10%; top: -20%; width: 70%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(closest-side, rgb(var(--fx-fg) / .09), transparent); pointer-events: none; z-index: -1; }
@media (max-width: 860px) {
  .nf-bento--work { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .nf-bento--work > .nf-tile, .nf-bento--work > .nf-tile:nth-child(1), .nf-bento--work > .nf-tile:nth-child(4) { grid-column: span 1; grid-row: auto; min-height: 200px; }
  .nf-bento--work > .nf-tile:nth-child(1) { grid-column: span 2; min-height: 280px; }
  .nf-bento--work > .nf-tile:nth-child(4) { grid-column: span 2; }
}
@media (max-width: 600px) {
  .nf-bento--goals { grid-template-columns: 1fr; }
  .nf-bento--goals > .x-goal:first-child { grid-row: auto; }
  .nf-bento--goals > .x-goal:first-child, .nf-bento--goals > .x-goal:first-child .x-goal__in { min-height: 230px; }
  .nf-bento--goals .x-goal, .nf-bento--goals .x-goal__in { min-height: 170px; }
  .nf-bento--work { grid-template-columns: 1fr !important; }
  .nf-bento--work > .nf-tile, .nf-bento--work > .nf-tile:nth-child(n) { grid-column: auto; min-height: 0; }
  .nf-bento--work > .nf-tile:nth-child(1) { min-height: 260px; }
  .nf-bento--work > .nf-tile:nth-child(4) { grid-template-columns: 1fr; }
}

/* ---------- ضوء يتبع المؤشر (أجهزة الماوس فقط) ---------- */
@media (hover: hover) and (pointer: fine) {
  .nf-card, .x-goal__f, .nf-member, .nf-bcard, .nf-brick, .nf-rq__card, .nf-quiz { --sx: 50%; --sy: 0%; }
  .nf-card::before, .nf-member::before, .nf-bcard::before, .nf-brick::before, .nf-rq__card::before, .nf-quiz::before {
    content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 2; opacity: 0; transition: opacity .35s;
    background: radial-gradient(380px circle at var(--sx) var(--sy), rgb(var(--fx-fg) / .10), transparent 60%);
  }
  .nf-card:hover::before, .nf-member:hover::before, .nf-bcard:hover::before, .nf-brick:hover::before, .nf-rq__card:hover::before, .nf-quiz:hover::before { opacity: 1; }
  .x-goal:hover .x-goal__f { background: radial-gradient(380px circle at var(--sx) var(--sy), rgb(var(--fx-fg) / .12), rgb(var(--fx-fg) / .03) 70%) !important; }
}

/* ---------- الشخصية في الواجهة ---------- */
.x-hero { overflow: hidden; }
.nf-hmas { --tx: 0; --ty: 0; position: absolute; bottom: -4px; inset-inline-end: clamp(8px, 4vw, 56px); width: clamp(120px, 17vw, 230px); aspect-ratio: 424 / 632; z-index: 2; pointer-events: auto; cursor: pointer; -webkit-tap-highlight-color: transparent;
  transform: perspective(700px) rotateY(calc(var(--tx) * 9deg)) rotateZ(calc(var(--tx) * 2.5deg)) translateX(calc(var(--tx) * 6px)) translateY(calc(var(--ty) * 3px)); transition: transform .9s var(--nf-ease); transform-origin: 50% 100%;
  animation: nfMasIn 1s var(--nf-spring) 1.1s both; }
.nf-hmas__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: bottom; filter: drop-shadow(0 18px 30px rgb(0 0 0 / .45)); }
.nf-hmas.is-ready #nf-hmas-img { animation: nfBreath 4.5s ease-in-out infinite; transform-origin: 50% 100%; }
.nf-hmas.is-party #nf-hmas-img { animation: none; }

@keyframes nfMasIn { from { opacity: 0; transform: translateY(40px) scale(.9); } }
@keyframes nfWave { 0%, 100% { transform: rotate(0); } 25% { transform: rotate(-3deg); } 50% { transform: rotate(2.5deg); } 75% { transform: rotate(-2deg); } }
@keyframes nfBreath { 0%, 100% { transform: scaleY(1); } 50% { transform: scaleY(1.012) translateY(-1px); } }
@keyframes nfDance { 0% { transform: translateY(0) rotate(-6deg); } 100% { transform: translateY(-18px) rotate(6deg); } }
.x-hero__logo.is-tap img { animation: nfTap .28s var(--nf-spring) !important; }
@keyframes nfTap { 50% { transform: scale(.94); } }
@media (max-width: 720px) {
  .nf-hmas { width: 96px; inset-inline-end: 8px; opacity: .95; }

}

/* ---------- بطاقات المقالات ---------- */
.x-art-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)) !important; gap: 20px !important; }
.nf-card { position: relative; isolation: isolate; border-radius: 26px; background: linear-gradient(160deg, rgb(var(--fx-fg) / .07), rgb(var(--fx-fg) / .02)); border: 1px solid var(--nf-line); overflow: hidden; transition: transform .5s var(--nf-ease), border-color .3s, box-shadow .5s var(--nf-ease); }
@media (hover: hover) { .nf-card:hover { transform: translateY(-5px); border-color: rgb(var(--fx-fg) / .24); box-shadow: 0 30px 60px -32px rgb(0 0 0 / .8); } .nf-card:hover .nf-card__media img { transform: scale(1.045); } }
.nf-card__link { display: grid; color: inherit; text-decoration: none; height: 100%; }
.nf-card__link:focus-visible { outline: 2px solid var(--text-primary); outline-offset: -2px; border-radius: 26px; }
.nf-card__media { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; background: rgb(var(--fx-fg) / .06); }
.nf-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--nf-ease), opacity .5s; }
.nf-card__ph { position: absolute; inset: 0; display: grid; place-items: center; font-size: 54px; font-weight: 700; color: rgb(var(--fx-fg) / .14); }
.nf-chip { display: inline-flex; align-items: center; justify-self: start; width: fit-content; gap: 6px; padding: 5px 13px; border-radius: 999px; font-size: 13px; font-weight: 600; line-height: 1.3; background: #fff; color: #0b0b0c; }
.nf-chip--soft { background: rgb(var(--fx-fg) / .1); color: var(--text-primary); border: 1px solid var(--nf-line); }
.nf-card__chips { position: absolute; top: 14px; inset-inline-start: 14px; display: flex; gap: 6px; flex-wrap: wrap; z-index: 1; }
.nf-card__chips .nf-chip { box-shadow: 0 6px 18px rgb(0 0 0 / .35); }
.nf-card__chips .nf-chip--prev { background: rgb(10 10 12 / .7); backdrop-filter: blur(6px); margin: 0; }
.nf-card__body { display: grid; gap: 10px; padding: 20px 22px 22px; align-content: start; }
.nf-card__series { font-size: 13px; color: var(--text-secondary); }
.nf-card h3 { font-size: clamp(20px, 2vw, 23px); line-height: 1.45; font-weight: 700; }
.nf-card p { color: var(--text-secondary); line-height: 1.8; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nf-card__meta { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: 13px; color: var(--text-secondary); padding-top: 6px; border-top: 1px solid var(--nf-line); }
.nf-card__meta span { display: inline-flex; align-items: center; gap: 6px; }
.nf-card__meta svg, .nf-rt svg { width: 14px; height: 14px; }
.nf-bm { position: absolute; top: 12px; inset-inline-end: 12px; z-index: 3; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; border: 1px solid rgb(255 255 255 / .25); background: rgb(0 0 0 / .45); color: #fff; cursor: pointer; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); transition: transform .3s var(--nf-spring), background .25s; }
.nf-bm svg { width: 18px; height: 18px; }
.nf-bm[aria-pressed="true"] { background: #fff; color: #0b0b0c; }
.nf-bm[aria-pressed="true"] svg, .nf-tools [data-bm][aria-pressed="true"] svg { fill: currentColor; }
.nf-bm.is-pop, [data-bm].is-pop { animation: nfPop .45s var(--nf-spring); }
@keyframes nfPop { 40% { transform: scale(1.25); } }
img.nf-img { opacity: 0; }
img.nf-img.is-loaded { opacity: 1; transition: opacity .5s ease; }
.nf-card__media:has(img.nf-img:not(.is-loaded))::after, .nf-cover:has(img.nf-img:not(.is-loaded))::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 30%, rgb(var(--fx-fg) / .08) 50%, transparent 70%) 0 0 / 300% 100%; animation: nfShimmer 1.4s linear infinite; }
.nf-count { font-size: 14px; font-weight: 500; color: var(--text-secondary); margin-inline-start: 6px; }
.nf-ghost { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 8px 16px; border-radius: 999px; border: 1px solid var(--nf-line); background: var(--nf-glass); color: var(--text-primary); font: inherit; font-size: 15px; text-decoration: none; cursor: pointer; transition: background .25s, border-color .25s; }
.nf-ghost:hover { background: rgb(var(--fx-fg) / .1); border-color: rgb(var(--fx-fg) / .24); }
.nf-ghost svg { width: 16px; height: 16px; }
.nf-link { border: 0; background: none; padding: 4px 2px; color: var(--text-secondary); font: inherit; font-size: 14px; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.nf-link:hover { color: var(--text-primary); }

/* ---------- هياكل التحميل ---------- */
.nf-skel { display: grid; gap: 12px; padding: 0 0 22px; border-radius: 26px; border: 1px solid var(--nf-line); overflow: hidden; background: rgb(var(--fx-fg) / .03); }
.nf-skel i, .nf-skel b { display: block; background: linear-gradient(100deg, rgb(var(--fx-fg) / .06) 30%, rgb(var(--fx-fg) / .13) 50%, rgb(var(--fx-fg) / .06) 70%) 0 0 / 300% 100%; animation: nfShimmer 1.4s linear infinite; }
.nf-skel i { aspect-ratio: 16 / 10; }
.nf-skel b { height: 14px; margin-inline: 22px; border-radius: 8px; }
.nf-skel b:nth-of-type(1) { height: 22px; width: 70%; }
.nf-skel b.s { width: 40%; }
@keyframes nfShimmer { from { background-position: 100% 0; } to { background-position: -200% 0; } }

/* ---------- القارئ ---------- */
.x-read { --nf-fs: 18px; max-width: 760px !important; gap: 20px !important; }
.x-read h1 { font-size: clamp(32px, 5.4vw, 54px) !important; font-weight: 700; line-height: 1.3 !important; }
.x-read__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.nf-rt { display: inline-flex; align-items: center; gap: 5px; }
.nf-author-link { color: var(--text-primary); text-decoration: underline; text-decoration-color: rgb(var(--fx-fg) / .3); text-underline-offset: 5px; }
.nf-author-link:hover { text-decoration-color: currentColor; }
.nf-tools { position: sticky; top: 74px; z-index: 20; display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; padding: 6px; border-radius: 999px; border: 1px solid var(--nf-line); background: rgb(14 14 15 / .72); backdrop-filter: blur(16px) saturate(1.4); -webkit-backdrop-filter: blur(16px) saturate(1.4); }
.nf-tools__g { display: flex; gap: 4px; }
.nf-tools button { display: inline-flex; align-items: center; gap: 6px; min-height: 38px; min-width: 40px; justify-content: center; padding: 6px 12px; border: 0; border-radius: 999px; background: transparent; color: var(--text-primary); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; transition: background .2s; }
.nf-tools button:hover { background: rgb(var(--fx-fg) / .1); }
.nf-tools button[aria-pressed="true"] { background: #fff; color: #0b0b0c; }
.nf-tools button:disabled { opacity: .35; cursor: default; }
.nf-tools svg { width: 16px; height: 16px; }
@media (max-width: 600px) { .nf-tools { top: 66px; border-radius: 20px; } .nf-tools button span { display: none; } .nf-tools button { padding: 6px 10px; } }
.nf-cover { position: relative; margin: 0; border-radius: 26px; overflow: hidden; aspect-ratio: 1200 / 630; background: rgb(var(--fx-fg) / .05); }
.nf-cover img { width: 100%; height: 100%; object-fit: cover; border-radius: 0 !important; cursor: zoom-in; }
.x-read__body { font-size: var(--nf-fs) !important; line-height: 2.05 !important; transition: font-size .2s; }
.x-read__body h2 { font-size: calc(var(--nf-fs) * 1.38) !important; font-weight: 700; margin-top: 18px !important; line-height: 1.5; }
.x-read__body strong { color: var(--text-primary); }
.x-read__body blockquote { font-size: calc(var(--nf-fs) * 1.15); font-weight: 600; padding: 20px 24px !important; border-radius: 20px !important; background: linear-gradient(160deg, rgb(var(--fx-fg) / .08), rgb(var(--fx-fg) / .02)) !important; }
.x-read__body figure { margin: 8px 0; display: grid; gap: 10px; }
.x-read__body figure img { border-radius: 20px; cursor: zoom-in; transition: transform .4s var(--nf-ease); }
.x-read__body figure img:hover { transform: scale(1.01); }
.x-read__body figcaption { font-size: 14px; color: var(--text-secondary); text-align: center; }
.x-read__body ::selection { background: #fff; color: #000; }
.x-read.is-comfy { max-width: 680px !important; }
.x-read.is-comfy .x-read__body { color: #efe6d6; line-height: 2.35 !important; max-width: 60ch; letter-spacing: .005em; }
.x-read.is-comfy .x-read__body h2, .x-read.is-comfy .x-read__body strong { color: #f7efe1; }
.x-read.is-comfy .x-read__body blockquote { border-inline-start-color: #e9dcc5; }
.nf-sel-hint { font-size: 13px; color: var(--text-secondary); text-align: center; }
@media (hover: none) { .nf-sel-hint { display: none; } }
.nf-print-head, .nf-print-foot { display: none; }

/* السلسلة */
.nf-series { display: grid; gap: 14px; padding: 18px 20px; border-radius: 22px; border: 1px solid var(--nf-line); background: linear-gradient(160deg, rgb(var(--fx-fg) / .06), rgb(var(--fx-fg) / .015)); }
.nf-series__top { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 15px; }
.nf-series__k { display: inline-flex; align-items: center; gap: 8px; color: var(--text-secondary); }
.nf-series__k svg { width: 18px; height: 18px; }
.nf-series__top b { font-weight: 700; }
.nf-series__bar { position: relative; height: 6px; border-radius: 6px; background: rgb(var(--fx-fg) / .1); }
.nf-series__bar i { position: absolute; inset-block: 0; inset-inline-start: 0; border-radius: inherit; background: linear-gradient(90deg, rgb(var(--fx-fg) / .55), #fff); box-shadow: 0 0 14px rgb(255 255 255 / .4); }
[dir="rtl"] .nf-series__bar i { background: linear-gradient(270deg, rgb(var(--fx-fg) / .55), #fff); }
.nf-series__bar span { position: absolute; top: 50%; width: 10px; height: 10px; margin-inline-start: -5px; translate: 0 -50%; border-radius: 50%; background: #1a1a1b; border: 2px solid rgb(var(--fx-fg) / .3); }
[dir="rtl"] .nf-series__bar span { margin-inline-start: -5px; }
.nf-series__bar span.is-on { background: #fff; border-color: #fff; }
.nf-series__nav { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.nf-series__nav a { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 14px; color: var(--text-primary); text-decoration: none; font-size: 14px; font-weight: 600; line-height: 1.5; background: rgb(var(--fx-fg) / .05); transition: background .2s; }
.nf-series__nav a:hover { background: rgb(var(--fx-fg) / .1); }
.nf-series__nav a svg { width: 18px; height: 18px; flex: none; }
.nf-series__nav small { display: block; font-size: 12px; font-weight: 400; color: var(--text-secondary); }
.nf-series__r { justify-content: flex-end; text-align: end; grid-column: 2; }
.nf-series__soon { grid-column: 2; align-self: center; justify-self: end; font-size: 14px; color: var(--text-secondary); }

/* اختبر فهمك */
.nf-quiz { position: relative; isolation: isolate; display: grid; gap: 16px; margin-top: 18px; padding: clamp(20px, 4vw, 34px); border-radius: 28px; border: 1px solid var(--nf-line); background: linear-gradient(160deg, rgb(var(--fx-fg) / .08), rgb(var(--fx-fg) / .02)); }
.nf-quiz__head { display: flex; align-items: center; gap: 18px; }
.nf-quiz__head h2 { font-size: clamp(26px, 4vw, 36px); font-weight: 700; margin-top: 6px; }
.nf-quiz__head p { color: var(--text-secondary); }
.nf-quiz__mas, .x-read .nf-quiz__mas { width: auto; height: clamp(130px, 22vw, 190px); border-radius: 0; flex: none; filter: drop-shadow(0 12px 20px rgb(0 0 0 / .45)); }
.nf-quiz__mas.is-bob { animation: nfBob .5s var(--nf-spring); }
@keyframes nfBob { 40% { transform: translateY(-10px) scale(1.04); } }
.nf-q { border: 0; margin: 0; padding: 0; display: grid; gap: 10px; }
.nf-q legend { display: flex; align-items: baseline; gap: 10px; font-size: 18px; font-weight: 600; line-height: 1.6; margin-bottom: 10px; float: right; width: 100%; }
.nf-q legend b { display: inline-grid; place-items: center; flex: none; width: 28px; height: 28px; border-radius: 50%; background: #fff; color: #0b0b0c; font-size: 14px; }
.nf-q__opts, .nf-rq__opts { display: grid; gap: 8px; clear: both; }
.nf-opt { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 50px; padding: 12px 18px; border-radius: 16px; border: 1.5px solid var(--nf-line); background: rgb(var(--fx-fg) / .03); color: var(--text-primary); font: inherit; font-size: 16px; text-align: start; cursor: pointer; transition: background .2s, border-color .2s, transform .2s var(--nf-spring); }
.nf-opt:hover:not(:disabled) { border-color: rgb(var(--fx-fg) / .4); background: rgb(var(--fx-fg) / .07); }
.nf-opt:active:not(:disabled) { transform: scale(.98); }
.nf-opt:disabled { cursor: default; opacity: .55; }
.nf-opt.is-right { opacity: 1; background: #fff; color: #0b0b0c; border-color: #fff; }
.nf-opt.is-right::after { content: "✓"; font-weight: 700; }
.nf-opt.is-wrong { opacity: 1; border-color: rgb(255 120 120 / .7); background: repeating-linear-gradient(135deg, rgb(255 255 255 / .04) 0 8px, transparent 8px 16px); animation: nfShake .4s; }
.nf-opt.is-wrong::after { content: "✕"; color: #ff8a8a; font-weight: 700; }
@keyframes nfShake { 25% { transform: translateX(-6px); } 50% { transform: translateX(5px); } 75% { transform: translateX(-3px); } }
.nf-quiz__res { display: grid; justify-items: center; text-align: center; gap: 10px; padding: 20px; border-radius: 20px; background: rgb(var(--fx-fg) / .06); animation: nfIn .5s var(--nf-ease); }
.nf-quiz__score { display: flex; align-items: baseline; gap: 8px; }
.nf-quiz__score b { font-size: 56px; font-weight: 700; line-height: 1; }
.nf-quiz__score span { color: var(--text-secondary); font-size: 18px; }
.nf-quiz__res p { font-size: 18px; font-weight: 600; }

.nf-related { display: grid; gap: 16px; margin-top: 26px; padding-top: 26px; border-top: 1px solid var(--nf-line); }
.nf-related h2 { font-size: clamp(24px, 3vw, 32px); font-weight: 700; }
.nf-related .x-art-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)) !important; }
.nf-related .nf-card p { display: none; }
.nf-channel { display: grid; justify-items: center; gap: 12px; text-align: center; padding: 22px; border-radius: 22px; border: 1px dashed var(--nf-line); }
.nf-channel > div { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.nf-channel p { color: var(--text-secondary); }
.nf-chbtn { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 18px; border-radius: 999px; background: #fff; color: #0b0b0c; text-decoration: none; font-weight: 600; }
.nf-chbtn svg { width: 18px; height: 18px; }
.nf-channel--foot { border: 0; padding: 8px 0 0; }

/* زر الاقتباس ونافذته */
.nf-qbtn { position: absolute; z-index: 300; display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border: 0; border-radius: 999px; background: #fff; color: #0b0b0c; font: inherit; font-size: 14px; font-weight: 600; box-shadow: 0 12px 30px rgb(0 0 0 / .5); cursor: pointer; animation: nfIn .25s var(--nf-ease); }
.nf-qbtn svg { width: 16px; height: 16px; }
.nf-qbtn[hidden] { display: none; }

/* ---------- طبقات (بحث، عارض، مشاركة، تنفّس) ---------- */
.nf-so, .nf-lb, .nf-sh, .nf-br { position: fixed; inset: 0; z-index: 500; opacity: 0; transition: opacity .2s ease; }
.nf-so.is-on, .nf-lb.is-on, .nf-sh.is-on, .nf-br.is-on { opacity: 1; }
.nf-so[hidden], .nf-lb[hidden], .nf-sh[hidden], .nf-br[hidden] { display: none; }
.nf-so { display: grid; justify-items: center; align-items: start; padding: clamp(12px, 10vh, 110px) 14px 14px; background: rgb(0 0 0 / .6); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.nf-so__box { width: min(640px, 100%); max-height: min(70vh, 640px); display: grid; grid-template-rows: auto 1fr; overflow: hidden; border-radius: 24px; border: 1px solid rgb(255 255 255 / .14); background: rgb(22 22 24 / .92); box-shadow: 0 40px 80px -20px rgb(0 0 0 / .8), inset 0 1px 0 rgb(255 255 255 / .08); transform: translateY(-8px) scale(.98); transition: transform .3s var(--nf-ease); }
.nf-so.is-on .nf-so__box { transform: none; }
.nf-so__in { display: flex; align-items: center; gap: 10px; padding: 14px 18px; border-bottom: 1px solid rgb(255 255 255 / .1); }
.nf-so__in svg { width: 20px; height: 20px; color: var(--text-secondary); flex: none; }
.nf-so__in input { flex: 1; min-width: 0; height: 40px; border: 0; outline: 0; background: none; color: var(--text-primary); font: inherit; font-size: 18px; }
.nf-so__in input::placeholder { color: var(--text-secondary); }
.nf-so__in input::-webkit-search-cancel-button { display: none; }
.nf-so__res { overflow: auto; padding: 8px; overscroll-behavior: contain; }
.nf-so__k { padding: 10px 12px 4px; font-size: 12px; font-weight: 600; color: var(--text-secondary); }
.nf-so__note { padding: 12px; color: var(--text-secondary); font-size: 14px; }
.nf-so__it { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 14px; color: var(--text-primary); text-decoration: none; }
.nf-so__it.is-sel, .nf-so__it:hover { background: rgb(255 255 255 / .08); }
.nf-so__it img { width: 64px; height: 42px; object-fit: cover; border-radius: 10px; flex: none; }
.nf-so__ic { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: rgb(255 255 255 / .06); flex: none; }
.nf-so__ic svg { width: 18px; height: 18px; }
.nf-so__it b { display: block; font-weight: 600; line-height: 1.5; }
.nf-so__it small { color: var(--text-secondary); font-size: 13px; }
.nf-so__none { display: grid; justify-items: center; gap: 8px; text-align: center; padding: 18px 12px 24px; }
.nf-so__none img { width: auto; height: clamp(120px, 22vh, 170px); animation: nfBob 2.4s ease-in-out infinite; }
.nf-so__none span { color: var(--text-secondary); font-size: 14px; margin-bottom: 6px; }

.nf-lb { display: grid; place-items: center; background: rgb(0 0 0 / .94); touch-action: pan-y; }
.nf-lb__fig { margin: 0; display: grid; justify-items: center; gap: 10px; width: 100%; height: 100%; padding: 70px 70px 40px; align-content: center; }
.nf-lb__fig img { max-width: 100%; max-height: calc(100vh - 140px); object-fit: contain; border-radius: 14px; opacity: 0; transform: scale(.97); transition: opacity .3s, transform .4s var(--nf-ease); user-select: none; -webkit-user-drag: none; }
.nf-lb__fig img.is-in { opacity: 1; transform: none; }
.nf-lb__fig figcaption { color: rgb(255 255 255 / .7); font-size: 14px; }
.nf-lb__bar { position: absolute; top: 0; inset-inline: 0; display: flex; justify-content: space-between; align-items: center; padding: 14px; z-index: 2; }
.nf-lb__n { color: rgb(255 255 255 / .75); font-size: 14px; }
.nf-lb__btn { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; border: 1px solid rgb(255 255 255 / .18); background: rgb(255 255 255 / .08); color: #fff; cursor: pointer; text-decoration: none; transition: background .2s; }
.nf-lb__btn:hover { background: rgb(255 255 255 / .18); }
.nf-lb__btn svg { width: 20px; height: 20px; }
.nf-lb__nav { position: absolute; top: 50%; translate: 0 -50%; width: 52px; height: 52px; display: grid; place-items: center; border-radius: 50%; border: 1px solid rgb(255 255 255 / .18); background: rgb(255 255 255 / .08); color: #fff; cursor: pointer; z-index: 2; }
.nf-lb__nav svg { width: 22px; height: 22px; }
.nf-lb__prev { right: 14px; } .nf-lb__next { left: 14px; }
.nf-lb.is-single .nf-lb__nav { display: none; }
@media (max-width: 600px) { .nf-lb__fig { padding: 70px 10px 30px; } .nf-lb__nav { top: auto; bottom: 18px; translate: none; } }

.nf-sh { display: grid; place-items: center; padding: 16px; background: rgb(0 0 0 / .75); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.nf-sh__box { position: relative; display: grid; gap: 14px; justify-items: center; padding: 18px; border-radius: 26px; border: 1px solid rgb(255 255 255 / .14); background: rgb(22 22 24 / .95); max-height: 100%; }
.nf-sh__box img { height: min(66vh, 640px); width: auto; aspect-ratio: 9 / 16; border-radius: 16px; box-shadow: 0 20px 40px rgb(0 0 0 / .6); }
.nf-sh__acts { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }
.nf-sh__acts .x-cta { margin-top: 0; }
.nf-sh__acts svg { width: 16px; height: 16px; }
.nf-sh__x { position: absolute; top: -14px; inset-inline-start: -14px; background: #1a1a1b; }

/* التنفّس */
.nf-br { display: grid; align-content: center; justify-items: center; gap: 14px; padding: 24px; text-align: center; background: radial-gradient(80% 60% at 50% 40%, #1b1b1d, #050505); }
.nf-br__x { position: absolute; top: 16px; inset-inline-start: 16px; }
.nf-br__stage { position: relative; width: min(78vw, 380px); aspect-ratio: 1; display: grid; place-items: center; }
.nf-br__halo { position: absolute; inset: 8%; border-radius: 50%; background: radial-gradient(closest-side, rgb(255 255 255 / .16), transparent 70%); transform: scale(.75); transition: transform 4s ease-in-out, opacity 4s; opacity: .5; }
.nf-br[data-ph="in"] .nf-br__halo { transform: scale(1.15); opacity: 1; transition-duration: 4s; }
.nf-br[data-ph="out"] .nf-br__halo { transform: scale(.75); opacity: .5; transition-duration: 6s; }
.nf-br__cloud { width: 82%; height: auto; transform: scale(.72); transition-property: transform; transition-timing-function: cubic-bezier(.45, 0, .55, 1); transition-duration: 1.2s; filter: drop-shadow(0 0 1px rgb(255 255 255 / .9)) drop-shadow(0 0 18px rgb(255 255 255 / .12)) drop-shadow(0 20px 40px rgb(0 0 0 / .5)); animation: nfFloat 5s ease-in-out infinite; }
.nf-br__cloud.is-in { transform: scale(1.08); }
.nf-br.is-done .nf-br__cloud { animation: nfBob .7s var(--nf-spring) 2, nfFloat 5s ease-in-out 1.4s infinite; }
@keyframes nfFloat { 0%, 100% { translate: 0 0; } 50% { translate: 0 -8px; } }
.nf-br__phase { font-size: clamp(36px, 8vw, 60px); font-weight: 700; line-height: 1.2; min-height: 1.2em; }
.nf-br__sub { color: var(--text-secondary); font-size: 16px; min-height: 1.6em; }
.nf-br__bar { width: min(320px, 70vw); height: 4px; border-radius: 4px; background: rgb(255 255 255 / .1); overflow: hidden; }
.nf-br__bar i { display: block; height: 100%; background: #fff; transform: scaleX(0); transform-origin: right; }
.nf-br__acts { display: flex; gap: 10px; }
.nf-br__acts .x-cta { margin-top: 0; min-width: 140px; }

/* بطاقة التنفّس في الرئيسية */
.nf-bcard { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); align-items: center; gap: clamp(16px, 4vw, 48px); padding: clamp(24px, 4vw, 48px); border-radius: 32px; border: 1px solid var(--nf-line); background: radial-gradient(70% 90% at 15% 50%, rgb(var(--fx-fg) / .1), transparent 70%), linear-gradient(160deg, rgb(var(--fx-fg) / .06), rgb(var(--fx-fg) / .015)); }
.nf-bcard__img { width: 100%; max-width: 320px; height: auto; justify-self: center; filter: drop-shadow(0 20px 40px rgb(0 0 0 / .5)); animation: nfPuff 10s ease-in-out infinite; }
@keyframes nfPuff { 0%, 100% { transform: scale(.9); } 40% { transform: scale(1.04); } }
.nf-bcard__tx { display: grid; gap: 12px; justify-items: start; }
.nf-bcard h2 { font-size: clamp(34px, 6vw, 60px); font-weight: 700; line-height: 1.15; }
.nf-bcard p { color: var(--text-secondary); font-size: clamp(16px, 1.7vw, 19px); line-height: 1.8; max-width: 36ch; }
@media (max-width: 680px) { .nf-bcard { grid-template-columns: 1fr; text-align: center; } .nf-bcard__tx { justify-items: center; } .nf-bcard__img { max-width: 200px; } }

/* ---------- الفريق، الكتّاب، جدار المبدعين ---------- */
.nf-team { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 190px), 1fr)); gap: 16px; }
.nf-member { position: relative; isolation: isolate; display: grid; justify-items: center; gap: 8px; padding: 26px 16px 22px; border-radius: 24px; border: 1px solid var(--nf-line); background: linear-gradient(160deg, rgb(var(--fx-fg) / .07), rgb(var(--fx-fg) / .02)); color: var(--text-primary); text-decoration: none; text-align: center; transition: transform .4s var(--nf-ease), border-color .3s; }
a.nf-member:hover { transform: translateY(-4px); border-color: rgb(var(--fx-fg) / .25); }
.nf-member strong { font-size: 18px; font-weight: 700; }
.nf-member small { color: var(--text-secondary); font-size: 14px; }
.nf-ava { display: grid; place-items: center; width: 88px; height: 88px; border-radius: 50%; overflow: hidden; background: #fff; color: #0b0b0c; border: 3px solid rgb(var(--fx-fg) / .14); }
.nf-ava img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.nf-ava b { font-size: 34px; font-weight: 700; }
.nf-ava--xl { width: clamp(110px, 18vw, 150px); height: clamp(110px, 18vw, 150px); flex: none; }
.nf-ava--xl b { font-size: 56px; }
.nf-wall { columns: 3 220px; column-gap: 14px; }
.nf-brick { position: relative; isolation: isolate; display: grid; gap: 6px; break-inside: avoid; margin-bottom: 14px; padding: 18px 20px; border-radius: 20px; border: 1px solid var(--nf-line); background: linear-gradient(160deg, rgb(var(--fx-fg) / .06), rgb(var(--fx-fg) / .015)); color: var(--text-primary); text-decoration: none; }
.nf-brick strong { font-weight: 700; }
.nf-brick span { color: var(--text-secondary); line-height: 1.7; font-size: 15px; }
.nf-author { display: grid; gap: 26px; max-width: 980px; margin-inline: auto; width: 100%; padding-block: 24px 48px; }
.nf-author__head { display: flex; align-items: center; gap: clamp(16px, 4vw, 36px); padding: clamp(20px, 4vw, 36px); border-radius: 30px; border: 1px solid var(--nf-line); background: linear-gradient(160deg, rgb(var(--fx-fg) / .07), rgb(var(--fx-fg) / .015)); }
.nf-author__head > div { display: grid; gap: 8px; justify-items: start; }
.nf-author h1 { font-size: clamp(30px, 5vw, 50px); font-weight: 700; line-height: 1.2; }
.nf-author p { color: var(--text-secondary); font-size: 17px; line-height: 1.8; }
.nf-author .x-read__back { justify-self: start; color: var(--text-secondary); text-decoration: none; }
.nf-empty-mas { width: auto; height: 160px; }
@media (max-width: 600px) { .nf-author__head { flex-direction: column; text-align: center; } .nf-author__head > div { justify-items: center; } }

/* ---------- اختبار الدور ---------- */
.nf-rq__card { position: relative; isolation: isolate; display: grid; gap: 16px; max-width: 760px; margin-inline-start: 0; margin-inline-end: auto; padding: clamp(20px, 4vw, 34px); border-radius: 28px; border: 1px solid var(--nf-line); background: linear-gradient(160deg, rgb(var(--fx-fg) / .08), rgb(var(--fx-fg) / .02)); animation: nfIn .45s var(--nf-ease); }
.nf-rq__top { display: flex; justify-content: space-between; align-items: center; color: var(--text-secondary); font-size: 14px; }
.nf-rq__dots { display: flex; gap: 6px; }
.nf-rq__dots i { width: 28px; height: 5px; border-radius: 5px; background: rgb(var(--fx-fg) / .14); transition: background .3s; }
.nf-rq__dots i.is-on { background: rgb(var(--fx-fg) / .6); }
.nf-rq__dots i.is-done { background: #fff; }
.nf-rq__card h3 { font-size: clamp(22px, 3vw, 28px); font-weight: 700; line-height: 1.4; }
.nf-rq__opts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.nf-rq__res { grid-template-columns: auto 1fr; align-items: center; gap: clamp(14px, 3vw, 30px); }
.nf-rq__res img { width: auto; height: clamp(150px, 24vw, 230px); filter: drop-shadow(0 14px 24px rgb(0 0 0 / .5)); animation: nfBob .8s var(--nf-spring); }
.nf-rq__res > div { display: grid; gap: 10px; justify-items: start; }
.nf-rq__res h3 { font-size: clamp(28px, 4vw, 40px); }
.nf-rq__res p { color: var(--text-secondary); line-height: 1.8; }
.nf-rq__acts { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.nf-rq__acts .x-cta { margin-top: 0; }
.nf-rq .nf-link { justify-self: start; }
@media (max-width: 600px) { .nf-rq__opts { grid-template-columns: 1fr; } .nf-rq__res { grid-template-columns: 1fr; justify-items: center; text-align: center; } .nf-rq__res > div { justify-items: center; } }

/* ---------- نموذج الانضمام ---------- */
.nf-draft { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px; padding: 10px 14px; border-radius: 14px; background: rgb(var(--ap-rgb, 255 255 255) / .06); font-size: 14px; text-align: center; }
.nf-done-mas { width: clamp(150px, 30vw, 220px); height: auto; filter: drop-shadow(0 16px 26px rgb(0 0 0 / .5)); }
.x-done:has(.nf-done-mas) .x-done-check { width: 44px; height: 44px; margin-top: -30px; }
.x-done.is-on .nf-done-mas, .nf-done-mas.is-hop { animation: nfHop .7s var(--nf-spring) .15s 3 both; }
@keyframes nfHop { 0%, 100% { transform: translateY(0) scale(1, 1); } 30% { transform: translateY(-26px) scale(.98, 1.03); } 60% { transform: translateY(0) scale(1.04, .96); } }

/* ---------- حركة مخففة ---------- */
@media (prefers-reduced-motion: reduce) {
  .nf-hmas, .nf-hmas *, .nf-bcard__img, .nf-br__cloud, .nf-so__none img { animation: none !important; transition: none !important; }
  .nf-hmas { transform: none !important; }
  .nf-br__cloud { transform: scale(.9) !important; }
}
.x-rm .nf-hmas, .x-rm .nf-hmas *, .x-rm .nf-bcard__img, .x-rm .nf-br__cloud { animation: none !important; }

/* ---------- الطباعة / PDF ---------- */
@media print {
  @page { size: A4; margin: 0; }
  html, body { background: #fff !important; color: #111 !important; }
  body { padding: 14mm 16mm 16mm !important; margin: 0 !important; }
  body::after, .x-amb, .x-sprog, .x-nav, .foot, .x-mute, .x-toast, .x-intro, .nf-qbtn, .nf-so, .nf-lb, .nf-sh, .nf-br, .x-confetti { display: none !important; }
  .x-view:not(#view-article) { display: none !important; }
  #view-article { display: block !important; animation: none !important; }
  .page, .main { padding: 0 !important; margin: 0 !important; max-width: none !important; }
  .x-read { max-width: none !important; padding: 0 !important; gap: 10px !important; color: #111 !important; }
  .x-read__back, .nf-tools, .nf-series__nav, .nf-quiz, .nf-related, .nf-channel, .nf-sel-hint { display: none !important; }
  .nf-print-head { display: flex !important; justify-content: space-between; align-items: center; padding-bottom: 10px; margin-bottom: 6px; border-bottom: 2px solid #111; }
  .nf-print-head img { width: 90px; height: auto; }
  .nf-print-head span { font: 10pt/1 ui-monospace, monospace; color: #555; direction: ltr; }
  .nf-print-foot { display: block !important; margin-top: 18px; padding-top: 8px; border-top: 1px solid #bbb; font-size: 10pt; color: #555; text-align: center; }
  .x-read h1 { font-size: 24pt !important; color: #000 !important; }
  .x-read__meta, .x-read__meta a { color: #444 !important; font-size: 10pt; }
  .nf-chip { background: #111 !important; color: #fff !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .nf-series { border: 1px solid #ccc; background: none !important; padding: 8px 12px; }
  .nf-series__bar { display: none; }
  .nf-cover { aspect-ratio: auto; border-radius: 10px; max-height: 80mm; }
  .nf-cover img, img.nf-img { opacity: 1 !important; max-height: 80mm; object-fit: cover; }
  .x-read__body, .x-read.is-comfy .x-read__body { font-size: 12pt !important; line-height: 1.9 !important; color: #111 !important; max-width: none !important; }
  .x-read__body h2, .x-read__body strong, .x-read.is-comfy .x-read__body h2, .x-read.is-comfy .x-read__body strong { color: #000 !important; }
  .x-read__body h2 { font-size: 15pt !important; color: #000 !important; break-after: avoid; }
  .x-read__body blockquote { background: #f3f3f3 !important; border-inline-start: 3pt solid #111 !important; color: #111 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .x-read__body figure, .x-read__body img, blockquote { break-inside: avoid; }
  .x-read__body strong { color: #000 !important; }
  .x-read__src { color: #444 !important; border-color: #bbb !important; font-size: 10pt; }
  a { color: inherit !important; }
}
@media (hover: none) { .nf-ghost kbd, .nf-so__in kbd { display: none; } }

/* وسم المعاينة */
.nf-chip.nf-chip--prev { background: transparent; color: #f2f2f2; border: 1px dashed rgb(255 255 255 / .55); margin-inline-end: 6px; }
.nf-prev-note { margin: 14px 0 6px; padding: 10px 14px; border: 1px dashed rgb(255 255 255 / .3); border-radius: 14px; color: rgb(255 255 255 / .75); font-size: .92rem; background: rgb(255 255 255 / .03); }
@media print { .nf-chip--prev { border-color: #000; color: #000; } .nf-prev-note { color: #333; border-color: #999; } }

/* ردة فعل الشخصية */
.nf-hmas:focus-visible { outline: 2px solid rgb(255 255 255 / .6); outline-offset: 6px; border-radius: 18px; }
.nf-hmas.is-react #nf-hmas-img { animation: nfReact .55s cubic-bezier(.3,1.6,.5,1) both !important; transform-origin: 50% 100%; }
@keyframes nfReact { 0% { transform: scale(1,1) translateY(0); } 30% { transform: scale(1.06,.9) translateY(0); } 60% { transform: scale(.96,1.06) translateY(-14px); } 100% { transform: none; } }
.nf-hmas__bub { position: absolute; bottom: 100%; inset-inline-start: 50%; translate: 50% 6px; margin-bottom: 6px; white-space: nowrap; padding: 8px 14px; border-radius: 16px; background: #f4f4f4; color: #111; font-weight: 700; font-size: .9rem; box-shadow: 0 10px 26px rgb(0 0 0 / .45); opacity: 0; scale: .7; transition: opacity .2s, scale .25s cubic-bezier(.3,1.6,.5,1), translate .25s; pointer-events: none; }
.nf-hmas__bub::after { content: ""; position: absolute; top: 100%; inset-inline-start: 50%; translate: 50% 0; border: 7px solid transparent; border-top-color: #f4f4f4; }
.nf-hmas__bub.is-on { opacity: 1; scale: 1; translate: 50% 0; }
@media (max-width: 640px) { .nf-hmas__bub { font-size: .75rem; padding: 6px 10px; inset-inline-start: auto; inset-inline-end: 0; translate: 0 6px; } .nf-hmas__bub.is-on { translate: 0 0; } .nf-hmas__bub::after { inset-inline-start: auto; inset-inline-end: 30px; translate: 0 0; } }
@media (prefers-reduced-motion: reduce) { .nf-hmas.is-react #nf-hmas-img { animation: none !important; } }

/* ===== الهيكلة: ترقيم ===== */
.nf-org > div { position: relative; }
.nf-org__n { display: inline-block; font-size: .8rem; font-weight: 700; letter-spacing: .08em; color: rgb(255 255 255 / .45); margin-bottom: 8px; direction: ltr; }

/* ===== غيم: عضو الفريق ===== */
.nf-gm { display: grid; grid-template-columns: minmax(180px, 300px) 1fr; gap: clamp(20px, 4vw, 56px); align-items: center; padding: clamp(20px, 3vw, 36px); border-radius: 28px; background: linear-gradient(160deg, rgb(255 255 255 / .06), rgb(255 255 255 / .015)); border: 1px solid rgb(255 255 255 / .09); }
.nf-gm__ph { position: relative; display: grid; place-items: end center; min-height: 320px; }
.nf-gm__glow { position: absolute; inset: 12% 8% 0; border-radius: 50%; background: radial-gradient(closest-side, rgb(255 255 255 / .16), transparent); filter: blur(10px); }
.nf-gm__img { position: relative; height: clamp(280px, 34vw, 400px); width: auto; filter: drop-shadow(0 18px 30px rgb(0 0 0 / .5)); animation: nfBreath 4.5s ease-in-out infinite; transform-origin: 50% 100%; }
.nf-gm h3 { margin-top: 10px; font-size: clamp(2rem, 4vw, 2.8rem); }
.nf-gm__bio { color: rgb(255 255 255 / .78); line-height: 1.9; margin: 12px 0 18px; max-width: 62ch; }
.nf-gm__h { font-size: 1.05rem; margin: 6px 0 10px; color: #fff; }
.nf-gm__cta { margin-top: 18px; display: inline-flex; }
@media (max-width: 760px) { .nf-gm { grid-template-columns: 1fr; text-align: start; } .nf-gm__ph { min-height: 0; } .nf-gm__img { height: 260px; } }

/* ===== اسأل غيم ===== */
.nf-chat { display: grid; grid-template-columns: 220px 1fr; gap: 0; border-radius: 28px; overflow: hidden; border: 1px solid rgb(255 255 255 / .1); background: linear-gradient(170deg, rgb(255 255 255 / .06), rgb(255 255 255 / .015)); backdrop-filter: blur(14px); }
.nf-chat__side { position: relative; display: grid; place-items: end center; padding: 20px 10px 0; border-inline-end: 1px solid rgb(255 255 255 / .07); background: radial-gradient(120% 70% at 50% 100%, rgb(255 255 255 / .08), transparent 70%); }
.nf-chat__glow { position: absolute; inset: 30% 15% 0; border-radius: 50%; background: radial-gradient(closest-side, rgb(255 255 255 / .14), transparent); filter: blur(12px); }
.nf-chat__mas { position: relative; height: 330px; width: auto; filter: drop-shadow(0 14px 24px rgb(0 0 0 / .5)); transform-origin: 50% 100%; animation: nfBreath 4.5s ease-in-out infinite; }
.nf-chat__mas.is-pop { animation: nfReact .55s cubic-bezier(.3,1.6,.5,1) both, nfBreath 4.5s ease-in-out .6s infinite; }
.nf-chat__main { display: flex; flex-direction: column; min-width: 0; }
.nf-chat__top { display: flex; align-items: center; gap: 10px; padding: 14px 18px; border-bottom: 1px solid rgb(255 255 255 / .07); }
.nf-chat__top b { display: block; font-size: 1rem; }
.nf-chat__top small { color: rgb(255 255 255 / .55); font-size: .78rem; display: flex; align-items: center; gap: 6px; }
.nf-chat__av { width: 40px; height: 40px; border-radius: 50%; overflow: hidden; background: #2a2a2e; border: 1px solid rgb(255 255 255 / .15); flex: none; }
.nf-chat__av img { width: 100%; height: 160%; object-fit: cover; object-position: top; }
.nf-chat__dot { width: 7px; height: 7px; border-radius: 50%; background: #3ddc84; display: inline-block; box-shadow: 0 0 0 3px rgb(61 220 132 / .18); }
.nf-chat__log { height: 300px; overflow-y: auto; padding: 18px; display: flex; flex-direction: column; gap: 10px; scroll-behavior: smooth; overscroll-behavior: contain; }
.nf-msg { max-width: 82%; padding: 11px 15px; border-radius: 18px; line-height: 1.8; font-size: .95rem; animation: nfMsgIn .32s cubic-bezier(.2,.9,.3,1.2) both; }
.nf-msg--bot { align-self: flex-start; background: rgb(255 255 255 / .08); border: 1px solid rgb(255 255 255 / .08); border-start-start-radius: 6px; color: #f2f2f2; }
.nf-msg--me { align-self: flex-end; background: #f2f2f2; color: #111; border-start-end-radius: 6px; font-weight: 500; }
.nf-msg__link { display: table; margin-top: 10px; padding: 7px 14px; border-radius: 999px; background: #fff; color: #111; font-weight: 700; font-size: .85rem; text-decoration: none; }
@keyframes nfMsgIn { from { opacity: 0; transform: translateY(8px) scale(.96); } to { opacity: 1; transform: none; } }
.nf-typing { display: inline-flex; gap: 5px; padding: 4px 2px; }
.nf-typing i { width: 7px; height: 7px; border-radius: 50%; background: rgb(255 255 255 / .7); animation: nfDot 1s ease-in-out infinite; }
.nf-typing i:nth-child(2) { animation-delay: .15s; } .nf-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes nfDot { 0%, 80%, 100% { transform: translateY(0); opacity: .4; } 40% { transform: translateY(-5px); opacity: 1; } }
.nf-chat__chips { display: flex; gap: 8px; overflow-x: auto; padding: 10px 18px; border-top: 1px solid rgb(255 255 255 / .07); scrollbar-width: none; }
.nf-chat__chips::-webkit-scrollbar { display: none; }
.nf-qchip { flex: none; padding: 8px 14px; border-radius: 999px; border: 1px solid rgb(255 255 255 / .18); background: rgb(255 255 255 / .04); color: #eee; font: inherit; font-size: .85rem; cursor: pointer; transition: background .2s, border-color .2s, transform .2s; }
.nf-qchip:hover { background: rgb(255 255 255 / .12); border-color: rgb(255 255 255 / .35); transform: translateY(-1px); }
.nf-qchip.is-used { opacity: .5; }
.nf-chat__in { display: flex; gap: 8px; padding: 12px 18px 16px; }
.nf-chat__in input { flex: 1; min-width: 0; padding: 12px 16px; border-radius: 999px; border: 1px solid rgb(255 255 255 / .14); background: rgb(0 0 0 / .25); color: #fff; font: inherit; font-size: 16px; }
.nf-chat__in input:focus { outline: none; border-color: rgb(255 255 255 / .45); }
.nf-chat__in button { width: 46px; height: 46px; border-radius: 50%; border: 0; background: #f2f2f2; color: #111; display: grid; place-items: center; cursor: pointer; flex: none; }
.nf-chat__in button svg { width: 20px; height: 20px; }
@media (max-width: 760px) {
  .nf-chat { grid-template-columns: 1fr; }
  .nf-chat__side { display: none; }
  .nf-chat__log { height: 340px; }
  .nf-msg { max-width: 88%; }
}
@media (prefers-reduced-motion: reduce) { .nf-chat__mas, .nf-gm__img, .nf-msg, .nf-typing i { animation: none !important; } }
.x-rm .nf-chat__mas, .x-rm .nf-gm__img, .x-rm .nf-msg { animation: none !important; }

/* ===== أيقونة الأسئلة الشائعة العائمة + نافذة اسأل غيم ===== */
.nf-faqbtn { bottom: 72px !important; }
.nf-faqbtn.is-on { background: #fff; color: #0b0b0c; }
.nf-faq { position: fixed; z-index: 61; left: 18px; bottom: 126px; width: min(400px, calc(100vw - 36px)); max-height: min(620px, calc(100dvh - 150px)); display: flex; transform-origin: 0 100%; opacity: 0; transform: translateY(12px) scale(.96); transition: opacity .22s var(--nf-ease, ease), transform .26s cubic-bezier(.3,1.4,.5,1); pointer-events: none; }
.nf-faq.is-open { opacity: 1; transform: none; pointer-events: auto; }
.nf-faq[hidden] { display: none; }
.nf-faq .nf-chat { display: flex; width: 100%; grid-template-columns: none; box-shadow: 0 24px 60px rgb(0 0 0 / .55); background-color: #141416; }
.nf-faq .nf-chat__side { display: none; }
.nf-faq .nf-chat__main { flex: 1; min-height: 0; }
.nf-faq .nf-chat__log { height: auto; flex: 1; min-height: 160px; max-height: 300px; }
.nf-faq .nf-chat__top { position: relative; }
.nf-faq__x { margin-inline-start: auto; width: 34px; height: 34px; border-radius: 50%; border: 1px solid rgb(255 255 255 / .12); background: rgb(255 255 255 / .06); color: inherit; display: grid; place-items: center; cursor: pointer; }
.nf-faq__x:hover { background: rgb(255 255 255 / .14); }
.nf-faq__x svg { width: 16px; height: 16px; }
@media (max-width: 640px) { .nf-faq { bottom: 126px; } .nf-faq .nf-chat__log { max-height: 38dvh; } }
@media print { .nf-faq, .nf-faqbtn { display: none !important; } }
.nf-chat-home .nf-faq__x { display: none; }
/* الأسئلة الجاهزة: تلتف على عدة أسطر بدل التمرير الأفقي المخفي */
.nf-chat__chips { flex-wrap: wrap; overflow-x: visible; overflow-y: auto; max-height: 128px; overscroll-behavior: contain; scrollbar-width: thin; }
.nf-qchip { white-space: nowrap; }

/* ===== غيم المتحرك (WebP) في فريقنا والاختبار ===== */
img.is-loop { animation: none !important; }
.nf-rqw { display: grid; grid-template-columns: 170px minmax(0, 1fr); align-items: end; gap: clamp(12px, 3vw, 28px); max-width: 960px; }
.nf-rqw .nf-rq__card { margin: 0; max-width: none; }
.nf-rqg { position: relative; display: grid; justify-items: center; align-self: end; }
.nf-rqg__img { height: 300px; width: auto; filter: drop-shadow(0 14px 24px rgb(0 0 0 / .5)); transform-origin: 50% 100%; }
.nf-rqg__img.is-pop { animation: nfReact .55s cubic-bezier(.3,1.6,.5,1) both; }
.nf-rqg__bub { position: relative; z-index: 2; margin-bottom: 10px; max-width: 200px; padding: 8px 12px; border-radius: 16px; background: #fff; color: #0b0b0c; font-size: .82rem; font-weight: 600; line-height: 1.5; text-align: center; box-shadow: 0 10px 24px rgb(0 0 0 / .35); }
.nf-rqg__bub::after { content: ""; position: absolute; bottom: -6px; left: 50%; translate: -50% 0; border: 7px solid transparent; border-top-color: #fff; border-bottom: 0; }
.nf-rqg__bub.is-on { animation: nfIn .3s var(--nf-ease, ease); }
@media (max-width: 760px) {
  .nf-rqw { grid-template-columns: 1fr; }
  .nf-rqg { grid-template-columns: auto 1fr; justify-items: start; align-items: center; gap: 10px; }
  .nf-rqg__img { order: -1; height: 150px; }
  .nf-rqg__bub { margin: 0; max-width: none; text-align: start; }
  .nf-rqg__bub::after { left: 100%; right: auto; bottom: auto; top: 50%; translate: 0 -50%; border: 7px solid transparent; border-left-color: #fff; border-right: 0; }
}