/* FDX_DS — تنسيق صفحة المرجع وحدها (العيّنات والجداول). ليس جزءاً من النظام الموزَّع. */
.fx-page code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.86em;direction:ltr;unicode-bidi:isolate;background:var(--fx-soft);border-radius:6px;padding:1px 6px;color:var(--fx-ink)}
:is(.fx-sec-dark,.fx-on-dark) code{background:var(--fx-dk-fill-2);color:#fff}
.ref-alt{background:var(--fx-paper);border-block:1px solid var(--fx-line)}
.ref-toc{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:28px}
.ref-toc a{font-size:14px;font-weight:700;color:var(--fx-ink);padding:8px 14px;border-radius:var(--fx-r-pill);border:1px solid var(--fx-line);background:var(--fx-paper);transition:border-color var(--fx-t-fast),color var(--fx-t-fast)}
.ref-toc a:hover{border-color:var(--fx-orange);color:var(--fx-orange-ink)}
.fx-hero .ref-sst{inset-inline-start:-8px;top:18%}
.ref-h3{display:flex;align-items:baseline;gap:10px;font-size:19px;margin:34px 0 14px}
.ref-h3 small{font-size:13px;font-weight:400;color:var(--fx-muted)}
.ref-sw{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}
.ref-sw figure{margin:0;border:1px solid var(--fx-line);border-radius:var(--fx-r-md);overflow:hidden;background:var(--fx-paper)}
.ref-sw i{display:block;height:84px;background:var(--c);border-bottom:1px solid var(--fx-line)}
.ref-sw figcaption{padding:10px 12px;display:grid;gap:2px;font-size:13px;line-height:1.5}
.ref-sw figcaption b{color:var(--fx-ink);font-size:14px}
.ref-sw figcaption span{color:var(--fx-muted)}
.ref-sw figcaption code{justify-self:start}
.ref-sw.sm{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}
.ref-sw.sm i{height:56px}
.ref-themes{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ref-th{background:var(--fx-bg);color:var(--fx-text);border:1px solid var(--fx-line);border-radius:var(--fx-r-lg);padding:18px}
.ref-th-h{display:block;color:var(--fx-ink);font-size:16px;margin-bottom:12px}
.ref-th-h small{font-weight:400;color:var(--fx-muted);font-size:13px}
.ref-type{display:grid;gap:4px;border-top:1px solid var(--fx-line)}
.ref-type>div{display:grid;grid-template-columns:260px 1fr;gap:20px;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--fx-line)}
.ref-tl{font-size:12.5px;color:var(--fx-muted);line-height:1.6}
.ref-t-d{font-size:var(--fx-fs-display);font-weight:700;line-height:var(--fx-lh-tight);letter-spacing:var(--fx-track-tight);color:var(--fx-ink)}
.ref-t-2{font-size:var(--fx-fs-h2);font-weight:700;line-height:var(--fx-lh-tight);color:var(--fx-ink)}
.ref-t-3{font-size:var(--fx-fs-h3);font-weight:700;line-height:var(--fx-lh-head);color:var(--fx-ink)}
.ref-t-n{font-size:22px;font-weight:700;color:var(--fx-ink);direction:ltr;text-align:end}
.ref-two{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:28px}
.ref-do,.ref-dont{border-radius:var(--fx-r-lg);padding:20px;border:1px solid var(--fx-line);background:var(--fx-bg)}
.ref-do>b,.ref-dont>b{display:flex;align-items:center;gap:8px;font-size:15px;margin-bottom:8px}
.ref-do>b{color:var(--fx-ok)}.ref-dont>b{color:var(--fx-tier-low)}
.ref-do>b .fx-ico,.ref-dont>b .fx-ico{width:18px;height:18px}
.ref-do small,.ref-dont small{display:block;margin-top:8px;color:var(--fx-muted);font-size:13px}
.ref-mk-demo{font-size:34px;font-weight:700;color:var(--fx-ink);line-height:1.3}
.ref-radii{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px}
.ref-radii>div{display:grid;gap:4px;font-size:13px;color:var(--fx-muted)}
.ref-radii i{display:block;height:84px;border-radius:var(--r);background:var(--fx-paper);border:1.5px solid var(--fx-orange)}
.ref-radii code{justify-self:start}
.ref-shadows{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin:30px 0}
.ref-shadows>div{background:var(--fx-paper);border-radius:var(--fx-r-lg);padding:26px 18px;display:grid;gap:4px;font-size:13px;color:var(--fx-muted)}
.ref-shadows code{justify-self:start}
.ref-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.ref-note{background:var(--fx-paper);border:1px solid var(--fx-line);border-radius:var(--fx-r-lg);padding:20px}
.ref-note b{display:block;color:var(--fx-ink);margin-bottom:6px}
.ref-note p{font-size:14.5px;color:var(--fx-muted)}
.ref-cmp{border:1px solid var(--fx-line);border-radius:var(--fx-r-card);background:var(--fx-paper);margin-bottom:22px;overflow:hidden}
.ref-cmp>header{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 16px;padding:18px 24px;border-bottom:1px solid var(--fx-line)}
.ref-cmp>header h3{font-size:21px}
.ref-cmp>header span{font-size:12.5px;color:var(--fx-muted);direction:ltr}
.ref-cmp-b{padding:22px 24px;display:grid;gap:18px;background:var(--fx-bg)}
.ref-cmp-b.ref-bleed{padding:22px 0}
.ref-see{font-size:14px;font-weight:700;color:var(--fx-orange-ink)}
.ref-ul{margin:0;padding-inline-start:20px;display:grid;gap:6px;font-size:14.5px;color:var(--fx-text)}
.ref-ul li::marker{color:var(--fx-orange)}
.ref-mini-stage{position:relative;isolation:isolate;overflow:hidden;border-radius:28px;background:var(--fx-stage);padding:28px}
.ref-mini-stage::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(45% 55% at 100% 0%,rgba(82,56,138,.6),transparent 70%),radial-gradient(40% 50% at 0% 100%,rgba(58,38,102,.55),transparent 70%)}
.fx-score{flex-wrap:wrap}
.ref-sa{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:28px;align-items:start}
.ref-sa-stage{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--fx-r-card);background:var(--fx-stage);height:460px}
.ref-sa-stage::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(40% 50% at 50% 40%,rgba(255,87,0,.24),transparent 72%),radial-gradient(45% 55% at 100% 0%,rgba(82,56,138,.6),transparent 70%)}
.ref-rings{top:42%;width:300px;height:300px}
.ref-sa-fig{position:absolute;left:50%;bottom:0;translate:-50% 0;height:92%;aspect-ratio:700/760;cursor:pointer;-webkit-mask-image:linear-gradient(to top,transparent 2%,#000 22%);mask-image:linear-gradient(to top,transparent 2%,#000 22%)}
.ref-sst2{inset-inline-start:16px;top:16px}
.ref-bub{inset-inline-end:16px;top:60px;margin:0}
.ref-sa-btns{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.ref-sa-btns button{padding:8px 16px;border-radius:var(--fx-r-pill);border:1px solid var(--fx-line);background:var(--fx-paper);font-weight:700;font-size:14px;color:var(--fx-ink)}
.ref-sa-btns button[aria-pressed="true"]{background:var(--fx-orange);border-color:var(--fx-orange);color:#fff}
.ref-tbl{width:100%;border-collapse:collapse;font-size:14px;margin-bottom:16px;background:var(--fx-paper);border-radius:var(--fx-r-md);overflow:hidden}
.ref-tbl th,.ref-tbl td{padding:10px 12px;text-align:start;border-bottom:1px solid var(--fx-line);vertical-align:top}
.ref-tbl th{font-size:13px;color:var(--fx-muted);background:var(--fx-soft)}
.ref-tbl td:first-child{font-weight:700;color:var(--fx-ink);white-space:nowrap}
.ref-rules{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.ref-rule{background:var(--fx-paper);border:1px solid var(--fx-line);border-radius:var(--fx-r-lg);padding:20px;border-top:3px solid var(--fx-orange)}
.ref-rule b{display:block;color:var(--fx-ink);font-size:17px;margin-bottom:6px}
.ref-rule p{font-size:14.5px;color:var(--fx-muted)}
.ref-def{margin-top:24px;border-radius:var(--fx-r-lg);padding:24px;background:var(--fx-orange-soft)}
.ref-def p{margin-top:8px;font-size:17px;line-height:1.9;color:var(--fx-ink)}
.ref-bounds{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.ref-b{border-radius:var(--fx-r-card);padding:24px;border:1px solid var(--fx-line);background:var(--fx-bg)}
.ref-b h3{display:flex;align-items:center;gap:10px;font-size:19px;margin-bottom:14px}
.ref-b h3 .fx-ico{width:22px;height:22px}
.ref-b.fixed h3 .fx-ico{color:var(--fx-v-ink)}.ref-b.free h3 .fx-ico{color:var(--fx-ok)}.ref-b.no h3 .fx-ico{color:var(--fx-tier-low)}
.ref-b ul{margin:0;padding-inline-start:18px;display:grid;gap:8px;font-size:14.5px}
.ref-b b{color:var(--fx-ink)}
.ref-steps{list-style:none;counter-reset:s;margin:0;padding:0;display:grid;gap:12px}
.ref-steps li{counter-increment:s;display:grid;grid-template-columns:44px 1fr;column-gap:16px;row-gap:6px;align-items:start;background:var(--fx-paper);border:1px solid var(--fx-line);border-radius:var(--fx-r-lg);padding:18px 20px}
.ref-steps li::before{content:counter(s);grid-row:span 3;width:44px;height:44px;border-radius:var(--fx-r-btn);background:var(--fx-orange);color:#fff;font-weight:700;display:grid;place-items:center}
.ref-steps b{color:var(--fx-ink);font-size:16px}
.ref-steps span{font-size:14.5px;color:var(--fx-muted)}
.ref-steps pre{margin:0;overflow:auto;background:var(--fx-navy);color:#E4E0F0;border-radius:var(--fx-r-md);padding:14px 16px;font-size:13px;line-height:1.7;text-align:left}
@media (max-width:980px){
  .ref-themes,.ref-two,.ref-grid3,.ref-bounds,.ref-sa{grid-template-columns:1fr}
  .ref-shadows{grid-template-columns:1fr 1fr}
  .ref-type>div{grid-template-columns:1fr;gap:6px}
}
@media (max-width:760px){
  .ref-cmp>header,.ref-cmp-b{padding-inline:16px}
  .ref-sa-stage{height:380px}
  .fx-hero .ref-sst{display:none}
}
