/* مبادرة التحوّل — site stylesheet. Fonts first (self-hosted woff2 subsets), then the main styles. */
@font-face{font-family:'Almarai';font-style:normal;font-weight:800;font-display:swap;src:url(../fonts/almarai-800-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD}
@font-face{font-family:'Almarai';font-style:normal;font-weight:800;font-display:swap;src:url(../fonts/almarai-800-arabic.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-400-arabic.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-500-arabic.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-700-arabic.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}

*{box-sizing:border-box;margin:0;padding:0}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{
  font-family:'IBM Plex Sans Arabic','Segoe UI',Tahoma,sans-serif;
  background:var(--paper); color:var(--ink);
  font-size:16px; line-height:1.85;
}
.display{font-family:'IBM Plex Sans Arabic','Segoe UI',Tahoma,sans-serif;font-weight:700}
.brand h1,.fname,.tbrand{font-family:'Almarai','IBM Plex Sans Arabic','Segoe UI',Tahoma,sans-serif;font-weight:700}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
a{color:var(--old);text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:3px solid var(--old);outline-offset:2px;border-radius:4px}
header.site :focus-visible,footer :focus-visible,.goal :focus-visible,.floorbox :focus-visible,.btnG:focus-visible{outline-color:var(--on-brand)}

/* ── Header ─────────────────────────── */
header.site{background:var(--navy-900);color:var(--on-brand);padding:0 0 34px;border-bottom:3px solid var(--gold)}
.brand{flex:1 1 520px;min-width:280px}
.brand h1{font-size:30px;line-height:1.45;font-weight:700;max-width:640px}
.brand h1 .hl{color:var(--gold);white-space:nowrap}
.ldots{display:inline-flex;gap:4px;margin-inline-start:6px;vertical-align:baseline}
.ld{width:9px;height:9px;border-radius:50%;display:inline-block}
.ld1{background:var(--blue-on-dark)}.ld2{background:var(--new-on-dark)}
.brand .tag{color:var(--on-dark);font-size:14px;max-width:560px;margin-top:6px}
.lawline{display:flex;align-items:center;gap:10px;margin-top:18px;flex-wrap:wrap;font-size:13px}
.lawpill{display:inline-flex;align-items:center;gap:7px;border-radius:999px;padding:4px 14px;border:1px solid rgba(201,162,75,.45)}
.lawpill.cur{background:rgba(30,95,168,.35)}
.lawpill.nxt{background:rgba(255,255,255,.06);border-style:dashed;color:var(--on-brand-line)}
.arrowsep{display:none}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block}
.dot.b{background:var(--blue-on-dark)}.dot.g{background:var(--new-on-dark)}


/* ── Goals strip (initiative) ───────── */
.goals{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}
.goal{background:linear-gradient(150deg,var(--navy-900) 0%,var(--navy-700) 60%,var(--navy-700) 100%);border-radius:14px;padding:22px 24px;color:var(--on-dark-soft);box-shadow:0 10px 26px -14px rgba(11,24,48,.55)}
.goal .glabel{color:var(--gold);font-size:13px;font-weight:700;margin-bottom:9px}
.goal h3{font-size:22px;color:var(--on-brand);margin-bottom:7px}
.goal p{font-size:13px;line-height:1.85;color:var(--on-dark)}
@media (max-width:860px){.goals{grid-template-columns:1fr}}

/* ── Stat tiles ─────────────────────── */

/* ── Controls ───────────────────────── */
.search{flex:1;min-width:230px;position:relative}
.search input{
  width:100%;padding:10px 14px 10px 40px;border:1px solid var(--line);border-radius:10px;
  font:inherit;background:var(--surface);color:var(--ink)
}
.search input::placeholder{color:var(--muted)}
.search svg{position:absolute;top:11px;inset-inline-start:12px;color:var(--muted)}
.chip{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 15px;font:inherit;font-size:13px;color:var(--ink2);cursor:pointer}
.chip:hover{border-color:var(--old)}
.chip.on{background:var(--sel-bg);border-color:var(--sel-bg);color:var(--sel-fg)}

/* ── Process map ────────────────────── */
.badge{flex:none;font-size:13px;border-radius:999px;padding:2px 10px;border:1px solid;white-space:nowrap}
.badge.full{background:var(--new-bg);color:var(--new-ink);border-color:var(--new-line)}
.badge.summary{background:var(--amber-bg);color:var(--amber-ink);border-color:var(--gold-tint-line)}
.empty{margin:40px auto;text-align:center;color:var(--muted);max-width:420px}

/* ── Detail view ────────────────────── */
.back{display:inline-flex;align-items:center;gap:6px;margin:22px 0 6px;font-size:13px}
.dhead{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px 24px;margin-top:8px}
.dhead h2,.dhead h1{font-size:30px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.dhead .summary{color:var(--ink2);margin-top:8px;max-width:760px}
.refrow{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.sec{margin-top:26px}
.sec>h3{font-size:18px;display:flex;align-items:center;gap:10px;margin-bottom:12px}
.sec>h3 .hint{font-size:13px;color:var(--muted);font-family:'IBM Plex Sans Arabic',sans-serif;font-weight:400}
.kps{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(290px,100%),1fr));gap:9px;list-style:none;padding:14px 16px}
.kps li{margin:0;border:1px solid var(--line);border-radius:9px;padding:9px 12px;padding-inline-start:28px;font-size:13px;line-height:1.9;background:var(--surface);position:relative}
.kps li::before{content:"";position:absolute;inset-inline-start:11px;top:14px;width:7px;height:7px;border-radius:50%;background:var(--old);opacity:.5}

.pane-new{
  background:var(--locked-bg);
  background-image:repeating-linear-gradient(45deg,transparent 0 7px,rgba(100,116,139,.07) 7px 14px);
  border:1.5px dashed var(--dash-line);border-radius:var(--radius);color:var(--locked)
}
/* Locked notice (regulation not issued yet, change card still pending): the one definition of .lockcard (css#12) —
   icon at the start of the first line, text aligned to the start, dashed grey frame with faint stripes */
.lockcard{display:flex;align-items:flex-start;gap:12px;padding:18px 22px;font-size:14px;line-height:1.9;color:var(--locked);
  border:1.5px dashed var(--locked);border-radius:var(--r-md);
  background:var(--grey-bg) repeating-linear-gradient(45deg,transparent 0 14px,rgba(100,116,139,.035) 14px 28px)}
.lockcard>svg{flex:none;margin-top:5px}
.lockcard b{color:var(--text)}

.cmp{display:flex;flex-direction:column;gap:14px}
.cmprow{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px}
.cmprow .topic{font-weight:700;font-size:14px;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.cmprow .topic::before{content:"";width:8px;height:8px;border-radius:2px;background:var(--old)}
.panes{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pane{border-radius:10px;padding:12px 15px;font-size:13px}
.pane .plabel{font-size:13px;font-weight:700;display:flex;align-items:center;gap:6px;margin-bottom:6px}
.pane-cur{background:var(--old-bg);border-inline-start:3px solid var(--old)}
.pane-cur .plabel{color:var(--old)}
.pane-new{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:6px;font-size:13px;padding:16px}
.pane-new .plabel{color:var(--locked)}
.pref{display:block;font-size:13px;color:var(--old);margin-top:8px}

.best{background:var(--surface);border:1px solid var(--line);border-inline-start:3px solid var(--new);border-radius:var(--radius);padding:16px 20px;font-size:13px;line-height:2}
.best .btitle{color:var(--new-ink);font-weight:700;display:flex;gap:8px;align-items:center;margin-bottom:6px}

details.scn{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:10px;overflow:hidden}
details.scn summary{
  list-style:none;cursor:pointer;padding:14px 18px;font-weight:500;font-size:14px;
  display:flex;align-items:center;gap:12px
}
details.scn summary::-webkit-details-marker{display:none}
details.scn summary .q{flex:1;font-size:13px}
details.scn summary .tw{flex:none;color:var(--muted);transition:transform .2s}
details.scn[open] summary .tw{transform:rotate(90deg)}
details.scn[open] summary{background:var(--old-bg)}
.scnbody{padding:4px 18px 16px;font-size:13px;line-height:1.95}
.scnbody .nownote{margin-top:12px;font-size:13px;color:var(--locked);background:var(--locked-bg);border:1px dashed var(--dash-line);border-radius:8px;padding:8px 12px;display:flex;gap:8px;align-items:center}
.wip{border:1.5px dashed var(--gold-tint-line);background:var(--amber-bg);color:var(--amber-ink);border-radius:var(--radius);padding:16px 20px;font-size:13px}
.srcs{font-size:13px;color:var(--muted)}
.srcs span{background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:2px 12px;display:inline-block;margin:3px 2px}

/* ── Shell: timeline + content ──────── */
.shell{display:grid;grid-template-columns:330px minmax(0,1fr);gap:26px;align-items:start;margin-top:24px}
aside.tl{position:sticky;top:14px;max-height:calc(100vh - 28px);overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;scrollbar-width:thin}
.tl h2{font-size:18px;display:flex;align-items:center;gap:8px}
.tl .tsub{font-size:13px;color:var(--muted);margin:2px 0 12px}
.tl .search{margin-bottom:12px;min-width:0}
.tl .search input{font-size:13px;padding:8px 12px;padding-inline-start:34px}
.tl .search svg{top:9px}
.tltoggle{display:none;width:100%;align-items:center;justify-content:space-between;font:inherit;font-size:14px;font-weight:700;color:var(--ink);background:none;border:0;cursor:pointer;padding:2px 0}
.tlgroup{margin-top:15px}
.tlgroup .gh{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--ink2)}
.gn{width:21px;height:21px;border-radius:50%;background:var(--brand);color:var(--on-brand);display:inline-flex;align-items:center;justify-content:center;font-size:13px;flex:none}
.gn.galert{background:var(--amber-fill)}
.tlgroup .gh .gcount{margin-inline-start:auto;font-size:13px;color:var(--muted);font-weight:400}
.tlnodes{margin-inline-start:10px;margin-top:4px;padding-inline-start:18px;border-inline-start:2px solid var(--line)}
.tnode{position:relative;display:block;font-size:13px;color:var(--ink2);padding:5px 6px;border-radius:8px;line-height:1.6}
.tnode::before{content:"";position:absolute;inset-inline-start:-24px;top:11px;width:10px;height:10px;border-radius:50%;background:var(--surface);border:2px solid var(--amber);box-sizing:border-box}
.tnode:hover{background:var(--paper);text-decoration:none}
.tnode.on{background:var(--old-bg);color:var(--old);font-weight:700}
.tnode.on::before{background:var(--old);border-color:var(--old);box-shadow:0 0 0 3px rgba(30,95,168,.18)}
.tnode.hide{display:none}
.tlgroup.hide{display:none}
.tlempty{display:none;font-size:13px;color:var(--muted);text-align:center;padding:10px 0}
.tlempty.show{display:block}
.tlegend{display:flex;gap:12px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin-top:14px;padding-top:10px;border-top:1px solid var(--line)}
.tlegend span{display:inline-flex;align-items:center;gap:5px}
.lgdot{width:9px;height:9px;border-radius:50%;display:inline-block;box-sizing:border-box}

/* ── Dashboard (home) ───────────────── */
.dash{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:20px 0}
.dbox{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px}
.dbox .dtitle{display:flex;align-items:center;gap:9px;font-weight:700;font-size:16px;margin-bottom:13px}
.dbox.cur .dtitle{color:var(--old)}
.phstats{display:flex;flex-direction:column;gap:8px}
.phstat{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--ink2);background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:7px 12px}
.phstat:hover{border-color:var(--old);text-decoration:none;color:var(--old)}
.phstat b{margin-inline-start:auto;color:var(--ink);font-size:14px;white-space:nowrap}
.dtotals{display:flex;gap:16px;flex-wrap:wrap;margin-top:13px;padding-top:11px;border-top:1px dashed var(--line);font-size:13px;color:var(--muted)}
.dtotals b{color:var(--ink);font-size:14px}
.dbox.new{background:var(--locked-bg);background-image:repeating-linear-gradient(45deg,transparent 0 7px,rgba(100,116,139,.06) 7px 14px);border:1.5px dashed var(--dash-line)}
.dbox.new .dtitle{color:var(--text)}
.newstats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.nstat{background:var(--surface);border:1px solid var(--line);border-radius:9px;padding:11px 10px;text-align:center}
.nstat .nv{font-size:22px;font-weight:700;color:var(--locked);display:flex;justify-content:center;align-items:center;gap:6px;line-height:1.4}
.nstat .nl{font-size:13px;color:var(--muted);margin-top:2px}
.newnote{font-size:13px;color:var(--muted);margin-top:11px}
.startrow{display:flex;gap:10px;margin-top:15px;flex-wrap:wrap;align-items:stretch}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--brand);color:var(--on-brand);border:0;border-radius:10px;padding:10px 20px;font:inherit;font-size:14px;font-weight:700;cursor:pointer}
.btn:hover{background:var(--brand-hover);color:var(--on-brand);text-decoration:none}
.jsel{flex:1;min-width:190px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;font:inherit;font-size:13px;background:var(--surface);color:var(--ink)}
@media (max-width:920px){.dash{grid-template-columns:1fr}}

/* ── New-law (unlocked) elements ────── */
.chgcard{background:var(--surface);border:1px solid var(--line);border-inline-start:4px solid var(--new);border-radius:var(--radius);padding:14px 18px}
.chgcard .ctitle{color:var(--new-ink);font-weight:700;font-size:16px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}
.chgcard ul{list-style:none;margin:0;padding:0}
.chgcard li{border:1px solid var(--line);border-inline-start:3px solid var(--new);border-radius:9px;padding:9px 13px;margin:8px 0;font-size:13px;line-height:1.95;background:var(--zebra)}
.chgcard .csrc{font-size:13px;color:var(--muted);margin-top:10px;border-top:1px dashed var(--line);padding-top:8px}
.pane-new.filled{background:var(--new-bg);background-image:none;border:1px solid var(--new-line);border-inline-start:3px solid var(--new-ink);display:block;text-align:start;color:var(--ink2);font-size:13px;padding:12px 15px}
.pane-new.filled .plabel{color:var(--new-ink);justify-content:flex-start}
.nref{display:block;font-size:13px;color:var(--new-ink);margin-top:8px}
.nownote.filled{color:var(--new-ink);background:var(--new-bg);border:1px solid var(--new-line)}
.badge.nx{background:var(--new-bg);color:var(--new-ink);border-color:var(--new-line)}

/* ── Overview (home) ────────────────── */
.homehead{margin-top:2px}
.homehead h2{font-size:22px}
.homehead p{color:var(--ink2);font-size:14px;max-width:640px}

@media (max-width:920px){
  .shell{display:block}
  aside.tl{position:static;max-height:none;margin-bottom:18px}
  .tltoggle{display:flex}
  .tl .tlbody{display:none;margin-top:10px}
  .tl.open .tlbody{display:block}
}

/* ── Tabs & landing big boxes ───────── */
.tabs{display:flex;gap:8px;margin-top:20px;justify-content:flex-start;flex-wrap:wrap}
.tabs[hidden]{display:none}
.tab{padding:7px 16px;border-radius:10px;background:rgba(255,255,255,.08);color:var(--on-dark-soft);font-size:13px;border:1px solid rgba(255,255,255,.16)}
.tab:hover{background:rgba(255,255,255,.16);text-decoration:none;color:var(--on-brand)}
.tab.on{background:var(--gold);border-color:var(--gold);color:var(--on-gold);font-weight:700}
.mission{text-align:center;margin:32px 0 0}
.mission .mlabel{color:var(--gold-ink);font-weight:700;font-size:13px}
.mission h2{font-size:30px;margin:8px 0 6px}
.mission p{color:var(--ink2);font-size:14px;max-width:640px;margin:0 auto}
.bigboxes{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:34px 0 10px;align-items:stretch}
.bigbox{display:flex;flex-direction:column;gap:10px;background:linear-gradient(155deg,var(--navy-900) 0%,var(--navy-700) 55%,var(--navy-700) 100%);border-radius:16px;padding:28px 26px;color:var(--on-dark-soft);box-shadow:0 14px 30px -16px rgba(11,24,48,.55);border:1px solid rgba(201,162,75,.25);transition:transform .16s ease}
.bigbox:hover{transform:translateY(-4px);text-decoration:none;border-color:var(--gold)}
.bigbox .bicon{font-size:30px}
.bigbox h3{font-size:22px;color:var(--on-brand);line-height:1.5}
.bigbox p{font-size:13px;color:var(--on-dark);line-height:1.9;flex:1}
.bigbox .go{color:var(--gold);font-weight:700;font-size:13px}
.bigbox.main{border:2px solid var(--gold);position:relative}
.bigbox.main h3{font-size:22px}
@media (max-width:900px){.bigboxes{grid-template-columns:1fr}}
.shell.noaside{display:block}
.bigbox.key{border:2px solid var(--gold);background:linear-gradient(155deg,var(--navy-700) 0%,var(--navy-700) 55%,var(--navy-700) 100%)}
.bigbox.key .go{color:var(--gold-soft)}
.bigbox{position:relative}
/* الصندوق الخامس العريض: أدوات تحسين العمليات */
.bigbox.wide{grid-column:1/-1;flex-direction:row;align-items:center;gap:20px;padding:24px 28px;background:linear-gradient(120deg,var(--navy-900) 0%,var(--navy-700) 45%,var(--navy-700) 100%);border:1.5px solid rgba(201,162,75,.45)}
.bigbox.wide .wtxt{flex:1;display:flex;flex-direction:column;gap:5px}
.bigbox.wide h3{font-size:22px}
.bigbox.wide p{flex:initial}
.bigbox.wide .go{white-space:nowrap}
@media (max-width:640px){.bigbox.wide{flex-direction:column;align-items:flex-start;gap:10px}}
/* صفحة الأدوات */

.optcards{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:18px}
@media (max-width:760px){.optcards{grid-template-columns:1fr}}
.optcard{background:linear-gradient(155deg,var(--navy-900),var(--navy-700));border:1.5px solid rgba(201,162,75,.4);border-radius:14px;padding:24px;color:var(--on-dark-soft);display:block}
.optcard:hover{border-color:var(--gold);text-decoration:none;transform:translateY(-3px);transition:.15s}
.optcard h3{color:var(--on-brand);font-size:18px;margin-bottom:8px}
.optcard p{font-size:13px;color:var(--on-dark);line-height:1.9}
.findbar{display:flex;gap:10px;margin:18px 0 8px}
.findbar input{flex:1;min-width:0;padding:14px 18px;border:2px solid var(--gold);border-radius:12px;font:inherit;font-size:16px;background:var(--surface);color:var(--ink)}
.findbar button{background:var(--brand);color:var(--on-brand);border:0;border-radius:12px;padding:0 26px;font:inherit;font-weight:700;cursor:pointer}
mark{background:var(--mark-bg);color:var(--ink);font-weight:700;padding:0 2px;border-radius:3px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.hitcard{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px 18px;margin-bottom:10px;font-size:13px;line-height:1.95}

/* ── Diff section ───────────────────── */
.dchip{display:inline-flex;align-items:center;font-size:13px;font-weight:700;border-radius:7px;padding:3px 12px;color:var(--on-brand)}
.artnum{display:inline-flex;flex-direction:column;align-items:center;border-radius:9px;padding:5px 14px;font-size:13px;line-height:1.5}
.artnum b{font-size:16px}
.artnum.before{background:var(--old-bg);color:var(--old);box-shadow:inset 0 0 0 1px var(--old-line)}
.artnum.after{background:var(--new-fill);color:var(--on-brand)}
.dstats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:16px 0}
.dstat{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;text-align:center}
.dstat .v{font-size:30px;font-weight:700}
.dstat .l{font-size:13px;color:var(--muted)}
.pane-old{background:var(--old-bg);border-inline-start:3px solid var(--old);border-radius:10px;padding:12px 15px;font-size:13px}
.pane-old .plabel{color:var(--old);font-size:13px;font-weight:700;margin-bottom:6px}
.pane-1448{background:var(--new-bg);border-inline-start:3px solid var(--new-ink);border-radius:10px;padding:12px 15px;font-size:13px}
.pane-1448 .plabel{color:var(--new-ink);font-size:13px;font-weight:700;margin-bottom:6px}
.pane-1448 u{text-decoration-color:var(--new-ink);text-underline-offset:3px}
.minhl{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:6px 22px}
.minhl li{margin:11px 0;font-size:13px}
.minhl li::marker{color:var(--gold)}

/* ── Library table ──────────────────── */
.libtable{width:100%;border-collapse:collapse;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;font-size:13px}
.libtable th{background:var(--brand);color:var(--on-brand);padding:9px 10px;font-size:13px;text-align:start;white-space:nowrap}
.libtable th .sortbtn{background:none;border:0;color:var(--brand-gold);cursor:pointer;font:inherit;font-weight:700}
.libtable td{padding:8px 10px;border-top:1px solid var(--line);vertical-align:top}
.libtable tr:hover td{background:var(--paper)}
.fltr{width:100%;min-width:70px;padding:5px 8px;border:1px solid rgba(255,255,255,.35);border-radius:7px;font:inherit;font-size:13px;background:rgba(255,255,255,.94);color:var(--ink)}
.libwrap{overflow-x:auto;position:relative;border-radius:var(--radius)}

@media (max-width:640px){
  .panes{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important}
  html{scroll-behavior:auto}
}

/* ═══ v3.5: محركات الحيوية ═══ */
/* توهج البطاقات وإمالتها + أيقونات مجهرية */
.bigbox{transition:transform .18s ease,box-shadow .2s ease,border-color .2s ease;will-change:transform}

.bigbox:hover{box-shadow:0 22px 44px -18px rgba(11,24,48,.65),0 10px 34px -14px rgba(201,162,75,.3)}
.bigbox .bicon{display:inline-block;transition:transform .2s cubic-bezier(.34,1.56,.64,1)}

.bigbox .go{position:relative}
.bigbox .go::after{content:"";position:absolute;inset-inline:0;bottom:-3px;height:1.5px;border-radius:2px;background:currentColor;transform:scaleX(0);transform-origin:100% 50%;transition:transform .2s ease}
.bigbox:hover .go::after{transform:scaleX(1)}
/* خط ذهبي يرسم نفسه تحت التبويبات + ripple */
.tab{position:relative;overflow:hidden}
.tab::after{content:"";position:absolute;inset-inline:14px;bottom:5px;height:2px;border-radius:2px;background:var(--gold);transform:scaleX(0);transform-origin:100% 50%;transition:transform .2s cubic-bezier(.22,.61,.36,1)}
.tab:hover::after{transform:scaleX(1)}
.tab.on::after{background:var(--on-gold);transform:scaleX(1)}
.findbar button{position:relative;overflow:hidden}
.ripple{position:absolute;border-radius:50%;transform:scale(0);background:rgba(255,255,255,.35);pointer-events:none}

/* الخلفية الحية للهيدر */
header.site{position:relative;overflow:hidden}
header.site .wrap{position:relative;z-index:2}
.hdot{position:absolute;border-radius:50%;pointer-events:none;z-index:1;opacity:.12}
/* الزر العائم للباحث */
#fab{position:fixed;bottom:24px;inset-inline-end:24px;z-index:60;display:flex;align-items:center;gap:9px;background:linear-gradient(135deg,var(--gold),var(--gold));color:var(--on-gold);font-weight:700;font-size:14px;border-radius:999px;padding:13px 20px;box-shadow:0 12px 30px -10px rgba(11,24,48,.5);border:1px solid rgba(255,255,255,.4);overflow:hidden;transition:transform .2s,box-shadow .2s}
#fab:hover{transform:translateY(-3px) scale(1.03);text-decoration:none;box-shadow:0 16px 36px -10px rgba(201,162,75,.55)}
#fab[hidden]{display:none}
#fab.lo{opacity:0;transform:translateY(14px);pointer-events:none}
#fab{transition:opacity .2s,transform .2s,box-shadow .2s}
#fab .fabic{font-size:16px}
@media (max-width:640px){#fab .ft{display:none}#fab{padding:13px 15px}}
@media print{#fab{display:none}}
/* نتائج الباحث تنبثق متدرجة */
@media (prefers-reduced-motion:no-preference){
/* الأورورا والنقاط اللامعة */
header.site::before{content:"";position:absolute;inset:-40%;z-index:0;pointer-events:none;background:radial-gradient(640px 340px at 18% 28%,rgba(127,177,232,.20),transparent 62%),radial-gradient(560px 320px at 82% 72%,rgba(105,201,165,.14),transparent 62%),radial-gradient(520px 300px at 55% 8%,rgba(201,162,75,.10),transparent 60%);}

/* النقطتان تنبضان وتتبادلان اللونين */
.ld{animation:ldbreathe 5s ease-in-out infinite}
.ld1{--c1:var(--blue-on-dark);--c2:var(--new-on-dark);background:var(--c1)}
.ld2{--c1:var(--new-on-dark);--c2:var(--blue-on-dark);background:var(--c1);animation-delay:2.5s}
@keyframes ldbreathe{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.3);opacity:1}}
/* انتقال ناعم بين الأقسام */
#app.vt{animation:viewIn .2s ease both} /* design-desktop#20: a short fade only; the 8px slide moved deep-linked articles and gave #app a transform */
@keyframes viewIn{from{opacity:0}to{opacity:1}}
/* خط الزمن يرسم نفسه */
#tlnav.draw .tlnodes{position:relative;border-inline-start-color:transparent}
#tlnav.draw .tlnodes::before{content:"";position:absolute;inset-inline-start:-2px;top:0;bottom:0;width:2px;background:linear-gradient(180deg,var(--gold) 0%,var(--line) 90%);transform-origin:top center}
}
/* إصلاحات: عنوان يعود للرئيسية + مركز دوران الأيقونة */
.brand h1 a{color:inherit}
.brand h1 a:hover{text-decoration:none;opacity:.93}
.bigbox .bicon{width:max-content;transform-origin:50% 55%;transition:transform .2s ease}
.bigbox:hover .bicon{transition:transform .2s cubic-bezier(.34,1.56,.64,1)}
/* أدوات: مرشد دمج اللجان */
.toolgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:4px}
@media (max-width:900px){.toolgrid{grid-template-columns:1fr}}
.tcard{display:flex;flex-direction:column;gap:9px;background:linear-gradient(155deg,var(--navy-900),var(--navy-700));border:1.5px solid rgba(201,162,75,.45);border-radius:14px;padding:22px;color:var(--on-dark-soft);position:relative;transition:transform .18s,box-shadow .2s}
.tcard:hover{transform:translateY(-3px);text-decoration:none;border-color:var(--gold);box-shadow:0 16px 34px -16px rgba(11,24,48,.6)}
.tcard h3{color:var(--on-brand);font-size:18px}
.tcard p{font-size:13px;color:var(--on-dark);line-height:1.9;flex:1}
.decl{background:var(--surface);border:1.5px solid var(--gold);border-radius:12px;padding:16px 18px;font-size:13px;line-height:2.05;white-space:pre-line}
.copybtn{background:var(--brand);color:var(--on-brand);border:0;border-radius:10px;padding:9px 22px;font:inherit;font-weight:700;cursor:pointer}
.copybtn:hover{background:var(--brand-hover)}
.lawq{background:var(--zebra);border-inline-start:3px solid var(--gold);border-radius:8px;padding:10px 14px;font-size:13px;line-height:2;color:var(--ink2);margin-top:8px;white-space:pre-line}
details.reftxt{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin-top:10px}
details.reftxt summary{cursor:pointer;font-weight:700;color:var(--old,var(--old));font-size:13px}
/* أيقونات SVG موحدة */
.ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;vertical-align:-4px;flex:none}
.ic14{width:14px;height:14px;vertical-align:-2px}
.ic16{width:16px;height:16px;vertical-align:-3px}
.ic28{width:28px;height:28px;vertical-align:-6px}
.bicon .ic{display:block}
/* بطاقات الخدمات */
.svcbadge{display:inline-flex;align-items:center;gap:5px;background:rgba(11,138,92,.18);border:1px solid rgba(105,201,165,.5);color:var(--new-on-dark);font-size:13px;font-weight:700;border-radius:999px;padding:2px 11px;width:max-content}
.svcout{list-style:none;margin:2px 0 0;padding:0;display:grid;gap:5px}
.svcout li{font-size:13px;color:var(--on-brand-line);display:flex;gap:7px;align-items:flex-start}
.svcout li .ic{margin-top:2px;color:var(--gold)}
.svcbtn{display:inline-block;background:var(--gold);color:var(--on-gold);font-weight:700;font-size:13px;border-radius:10px;padding:8px 20px;margin-top:4px;width:max-content}
.tcard:hover .svcbtn{background:var(--gold)}
/* §5 خلفيات الصناديق المتحركة */
.bgfx{position:absolute;inset:auto;inset-inline-end:12px;bottom:10px;width:122px;height:88px;overflow:hidden;pointer-events:none;z-index:0;opacity:.2;border-radius:10px}
.bigbox.wide .bgfx{width:172px;height:64px;bottom:8px}
.bigbox>*:not(.bgfx){position:relative;z-index:1}
.bgfx svg{width:100%;height:100%;display:block}
header.site.paused *,header.site.paused ::before,header.site.paused ::after,header.site.paused::before,header.site.paused::after{animation-play-state:paused!important}
@media (prefers-reduced-motion:no-preference){
.fxst{transform-box:fill-box;transform-origin:center}
.fxhl{opacity:.04}
.fxc1,.fxc3{transform-box:fill-box;transform-origin:50% 95%}
}
@media (prefers-reduced-motion:reduce){.bgfx{display:none}}
@media (max-width:719px){.bigbox:not(.wide) .bgfx{display:none}}
/* §3 مكوِّن اللجنة */
.svchead{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.svchead .tagl{font-size:13px;border-radius:999px;padding:2px 11px;font-weight:700}
.stepbar{display:flex;align-items:center;gap:9px;font-weight:700;font-size:16px;margin-bottom:10px}
.stepbar .sn{width:26px;height:26px;border-radius:50%;background:var(--brand);color:var(--brand-gold);display:inline-flex;align-items:center;justify-content:center;font-size:13px;flex:none}
.svcform{display:flex;gap:16px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 18px}
.svcform label{font-size:13px;display:flex;flex-direction:column;gap:5px;color:var(--ink2);font-weight:700}
.svcform label.inline{flex-direction:row;align-items:center;font-weight:400}
.svcform input[type=number],.svcform input[type=text],.svcform select{max-width:100%;padding:7px 10px;border:1px solid var(--line);border-radius:8px;font:inherit;font-size:13px;background:var(--surface);color:var(--ink);min-width:110px}
.segbtns{display:flex;gap:0;border:1.5px solid var(--line);border-radius:10px;overflow:hidden;width:max-content;max-width:100%;flex-wrap:wrap}
.segwrap{display:flex;flex-direction:column;gap:5px;min-width:0;max-width:100%}
.seglbl{font-size:13px;font-weight:700;color:var(--ink2)}
.segbtns button{border:0;background:var(--surface);padding:8px 16px;font:inherit;font-size:13px;cursor:pointer;color:var(--ink2)}
.segbtns button.on{background:var(--sel-bg);color:var(--sel-fg);font-weight:700}
.modegrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:760px){.modegrid{grid-template-columns:1fr}}
.modecard{border:2px solid var(--line);border-radius:12px;padding:14px 16px;cursor:pointer;background:var(--surface)}
.modecard b{display:block;margin-bottom:3px;font-size:14px}
.modecard p{font-size:13px;color:var(--muted);margin:0}
.modecard.cur.on{border-color:var(--old);background:var(--old-bg)}
.modecard.nxt.on{border-color:var(--new);background:var(--new-bg)}
.memwrap{overflow-x:auto;position:relative;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
table.memtbl{width:100%;border-collapse:collapse;font-size:13px;min-width:860px}
.memtbl th{background:var(--brand);color:var(--on-brand);font-weight:700;padding:8px 9px;font-size:13px;text-align:right;white-space:nowrap}
.memtbl td{border-top:1px solid var(--line);padding:6px 8px;vertical-align:middle}
@media screen and (min-width:641px) and (max-width:1100px){.memtbl th{padding:8px 6px}.memtbl td{padding:6px 5px}} /* mid widths: the longer header «لجنة فحص عروض الشراء المباشر؟» must not push «حذف» out of view */
.memtbl input[type=text]{width:120px;padding:6px 8px;border:1px solid var(--line);border-radius:7px;font:inherit;font-size:13px}
.memtbl select{padding:6px 7px;border:1px solid var(--line);border-radius:7px;font:inherit;font-size:13px;background:var(--surface)}
.memtbl .ck{text-align:center}
.memtbl .del{background:none;border:0;cursor:pointer;color:var(--danger);font-weight:700;font-size:14px;padding:2px 8px}
.addrow{margin-top:10px;background:var(--surface);border:1.5px dashed var(--gold);color:var(--gold-ink);border-radius:10px;padding:8px 20px;font:inherit;font-weight:700;cursor:pointer}
.addrow:hover{background:var(--amber-bg)}
.statcard{border-radius:14px;padding:18px 22px;display:flex;gap:18px;align-items:center;flex-wrap:wrap;border:2px solid}
.statcard.ok{background:var(--new-bg);border-color:var(--new)}
.statcard.miss{background:var(--amber-bg);border-color:var(--amber)}
.statcard.viol{background:var(--danger-bg);border-color:var(--danger)}
.statcard .big{font-size:18px;font-weight:700}
.statcard.ok .big{color:var(--new-ink)}.statcard.miss .big{color:var(--amber-ink)}.statcard.viol .big{color:var(--danger)}
.statcard .cnts{display:flex;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--ink2)}
.statcard .cnts b{font-size:14px}
.ncard{border:1px solid var(--line);border-inline-start:4px solid var(--line);border-radius:11px;background:var(--surface);padding:12px 15px;margin-bottom:9px}
.ncard .nt{font-weight:700;font-size:13px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ncard .nq{background:var(--zebra);border-inline-start:3px solid var(--line);border-radius:7px;padding:7px 11px;font-size:13px;color:var(--ink2);line-height:1.95;margin:7px 0 4px;white-space:pre-line}
.ncard .nfix{font-size:13px;color:var(--ink2)}
.ncard .nfix b{color:var(--ink)}
.ncard.n-ok{border-inline-start-color:var(--old)}
.ncard.n-new{border-inline-start-color:var(--new)}
.ncard.n-miss{border-inline-start-color:var(--amber);background:var(--amber-bg)}
.ncard.n-viol{border-inline-start-color:var(--danger);background:var(--danger-bg)}
.ncard.n-adv{border-inline-start-color:var(--amber);border-style:solid solid solid solid}
.repbar{display:flex;height:26px;border-radius:8px;overflow:hidden;border:1px solid var(--line)}
.repbar span{display:block;height:100%}
.replegend{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--ink2);margin-top:7px}
.replegend i{width:10px;height:10px;border-radius:3px;display:inline-block;margin-inline-end:4px}
.reptbl{width:100%;border-collapse:collapse;font-size:13px;margin-top:10px}
.reptbl th{background:var(--paper);padding:7px 10px;text-align:right;font-size:13px}
.reptbl td{border-top:1px solid var(--line);padding:7px 10px}
.lockgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:760px){.lockgrid{grid-template-columns:1fr}}
.lockbox{background:repeating-linear-gradient(45deg,var(--locked-bg),var(--locked-bg) 8px,var(--grey-bg) 8px,var(--grey-bg) 16px);border:1.5px dashed var(--locked);border-radius:11px;padding:11px 14px;color:var(--locked);font-size:13px}
.lockbox b{display:flex;gap:7px;align-items:center;color:var(--text);font-size:13px}
.lockbox .why{margin-top:6px}
.lockbox .why summary{cursor:pointer;font-size:13px;font-weight:700;color:var(--locked)}
.lockbox .why p{font-size:13px;line-height:1.9;margin:5px 0 0}
.chkl{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.chkl li{display:flex;gap:10px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px 13px;font-size:13px}
.chkl input{margin-top:3px;accent-color:var(--old)}
.xbtns{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
/* §4 مُحسِّن الخطة */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media(max-width:900px){.kpis{grid-template-columns:1fr 1fr}}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:13px;padding:14px 16px;text-align:center}
.kpi b{display:block;font-size:22px;color:var(--old)}
.kpi.warn b{color:var(--amber)}.kpi.bad b{color:var(--danger)}.kpi.good b{color:var(--new-ink)}
.kpi .kl{font-size:13px;color:var(--muted)}
.chartbox{background:var(--surface);border:1px solid var(--line);border-radius:13px;padding:14px 16px;margin-top:12px}
.chartbox h4{font-size:13px;margin-bottom:8px}
.chartbox svg{width:100%;height:auto;display:block}
.alttbl summary{cursor:pointer;font-size:13px;color:var(--old);font-weight:700;margin-top:6px}
.alttbl table{width:100%;border-collapse:collapse;font-size:13px;margin-top:6px}
.alttbl th{background:var(--paper);padding:5px 8px;text-align:right}
.alttbl td{border-top:1px solid var(--line);padding:5px 8px}
.floorbox{background:linear-gradient(155deg,var(--navy-900),var(--navy-700));color:var(--on-dark-soft);border:1.5px solid rgba(201,162,75,.5);border-radius:14px;padding:18px 22px}
.floorbox b{color:var(--gold)}
.floorbox .fr{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;font-size:13px}
.floorbox .fr span{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:3px 12px}
.ptbl{width:100%;border-collapse:collapse;font-size:13px}
.ptbl th{background:var(--brand);color:var(--on-brand);padding:7px 9px;text-align:right;white-space:nowrap;cursor:pointer}
.ptbl td{border-top:1px solid var(--line);padding:6px 9px}
.ptbl tr.crit td{background:var(--danger-bg)}
.badge-crit{background:var(--danger-bg);color:var(--danger);border:1px solid var(--danger-line);border-radius:999px;padding:1px 10px;font-size:13px;font-weight:700}
.badge-warn{background:var(--amber-bg);color:var(--amber-ink);border:1px solid var(--gold-tint-line);border-radius:999px;padding:1px 10px;font-size:13px;font-weight:700}
.runbtn{background:var(--gold);color:var(--on-gold);border:0;border-radius:11px;padding:11px 30px;font:inherit;font-weight:700;font-size:14px;cursor:pointer}
.runbtn:hover{background:var(--gold-hover)}
/* الظهور التدريجي المتدرّج */
.rev{opacity:0;transform:translateY(16px);transition:opacity .2s cubic-bezier(.22,.61,.36,1) var(--rd,0s),transform .2s cubic-bezier(.22,.61,.36,1) var(--rd,0s)}
.rev.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rev{opacity:1!important;transform:none!important}.hdot{display:none}}

/* ═══ تدقيق v4.2 ═══ */
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:fixed;top:-64px;inset-inline-start:12px;z-index:300;background:var(--gold);color:var(--on-gold);font-weight:700;border-radius:0 0 10px 10px;padding:10px 22px;transition:top .2s}
.skip:focus{top:0}
#app:focus{outline:none}
input::placeholder,textarea::placeholder{color:var(--muted)}
.findbar input,.svcform input[type=text],.svcform input[type=number],.svcform select,.memtbl input[type=text],.memtbl select,.search input,.jsel,.svcform textarea{border-color:var(--field-line)}
.findbar input{border-color:var(--gold-line)}
.sortbtn{min-height:28px;min-width:28px;display:inline-flex;align-items:center;justify-content:center}
@media print{
  #fab,#tabs,aside.tl,.banner,.hdots,.bgfx,.skip,#ann,.findbar,.tltoggle{display:none!important}
  header.site,.bigbox,.goal,.toolshero,footer,.optcard,.tcard,.floorbox,.dbox{background:none!important;color:var(--ink)!important;border-color:var(--line)!important;box-shadow:none!important}
  header.site *,.bigbox *,.goal *,.toolshero *,footer *,.optcard *,.tcard *,.floorbox *{color:var(--ink)!important}
  details>*{display:block!important}
  details::details-content{content-visibility:visible!important;display:block!important}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:13px;color:var(--muted)}
  .shell{display:block}
}

/* ═══ الحزمة المتوسطة v4.6: أرضية بطل + تكدس + تحقق ═══ */
.heroFloor{background:linear-gradient(150deg,var(--navy-900),var(--navy-700));border:1px solid var(--navy-700);border-radius:12px;padding:16px 18px;margin-bottom:14px;color:var(--on-brand-hi)}
.heroFloor .hfT{font-weight:700;font-size:14px;display:flex;gap:8px;align-items:center;margin-bottom:4px}
.heroFloor .hfS{font-size:13px;color:var(--on-dark);margin-bottom:12px}
.hfrow{display:flex;align-items:center;gap:12px;border-top:1px dashed var(--navy-700);padding:9px 0;flex-wrap:wrap}
.hfrow:first-of-type{border-top:0}
.hfband{flex:0 0 116px;font-size:13px;font-weight:700;color:var(--on-brand-line)}
.hfdate{font-size:18px;font-weight:700;color:var(--danger-on-dark);white-space:nowrap}
.hfdate.past{color:var(--danger-on-dark);text-decoration:underline wavy var(--danger-on-dark) 1px}
.hfleft{font-size:13px;color:var(--gold-soft);background:rgba(201,162,75,.14);border:1px solid rgba(201,162,75,.4);border-radius:999px;padding:2px 10px}
.hfleft.gone{color:var(--danger-on-dark);background:rgba(255,82,82,.12);border-color:rgba(255,82,82,.4)}
.hfnote{font-size:13px;color:var(--on-dark);margin-top:8px}
.valpanel{display:grid;gap:8px}
.valrow{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:9px;padding:9px 12px;font-size:13px;line-height:1.8;background:var(--surface)}
.valrow.err{border-color:var(--danger-line);background:var(--danger-bg);color:var(--burg-ink)}
.valrow.warn{border-color:var(--amber);background:var(--amber-bg);color:var(--amber-ink)}
.valrow.okv{border-color:var(--new-line);background:var(--new-bg);color:var(--new-ink)}
.valrow b{font-weight:700}
.bunchweeks{font-size:13px;color:var(--ink2);margin-top:8px;line-height:1.9}
.bunchweeks .wk{display:inline-block;background:var(--amber-bg);border:1px solid var(--amber);color:var(--amber-ink);border-radius:6px;padding:1px 7px;margin-inline-end:4px;font-weight:700;font-size:13px}
.quotbl{width:100%;border-collapse:collapse;margin-top:10px;font-size:13px}
.quotbl th,.quotbl td{border:1px solid var(--line);padding:7px 10px;text-align:center}
.quotbl th{background:var(--paper);font-size:13px;color:var(--ink2)}
.coibox{border:1px solid var(--line);border-radius:10px;background:var(--surface);padding:18px 20px;line-height:2.1;font-size:13px}
.coibox h4{font-size:14px;font-weight:700;margin-bottom:8px;color:var(--navy)}
.coifield{display:flex;gap:8px;align-items:baseline;margin:4px 0}
.coifield b{flex:0 0 auto;font-size:13px}
.coifield .dots{flex:1;border-bottom:1.5px dotted var(--dash-line);min-height:18px}
.coitext{border:1px solid var(--line);border-radius:8px;background:var(--zebra);padding:10px 14px;margin:10px 0;text-align:justify}
.coitbl{width:100%;border-collapse:collapse;margin:8px 0;font-size:13px}
.coitbl th,.coitbl td{border:1px solid var(--line);padding:8px;height:30px}
.coitbl th{background:var(--paper)}
.coisig{display:flex;gap:26px;margin-top:16px;flex-wrap:wrap}
.coisig span{flex:1;min-width:150px;border-top:1.5px dotted var(--dash-line);padding-top:5px;font-size:13px;color:var(--ink2);text-align:center}
@media print{
  body.coiP header,body.coiP .banner,body.coiP .tstrip,body.coiP #tabs,body.coiP footer,body.coiP #fab,body.coiP .back,body.coiP .dhead,body.coiP #tl,body.coiP .sec:not(.coi-print-target),body.coiP .skip{display:none!important}
  body.coiP::before,body.coiP::after{content:none!important}
  body.coiP .coi-noprint{display:none!important}
  body.coiP .coi-print-target details{border:0}
  body.coiP .coibox{border:0;padding:0}
}
.optcard.lockedopt{background:var(--locked-bg);background-image:repeating-linear-gradient(45deg,transparent 0 8px,rgba(100,116,139,.06) 8px 16px);border:1.5px dashed var(--dash-line);color:var(--locked)}
.optcard.lockedopt h3{color:var(--muted)}
.optcard.lockedopt p{color:var(--muted)}
.optcard.lockedopt:hover{transform:none;box-shadow:none}
.optlockchip{display:inline-flex;gap:6px;align-items:center;font-size:13px;font-weight:700;background:var(--line);border:1px solid var(--line);color:var(--text);border-radius:999px;padding:2.5px 10px;margin-top:8px}
.impcard{border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:var(--shadow);padding:14px 16px}
.impT{font-weight:700;font-size:14px;color:var(--ink);display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.impv{font-size:13px;font-weight:700;color:var(--text);display:inline-flex;align-items:center;gap:6px}
.impS{font-size:13px;color:var(--ink2);margin:6px 0 10px;line-height:1.9}
.imptbl{width:100%;border-collapse:collapse;font-size:13px}
.imptbl th{background:var(--paper);border:1px solid var(--line);padding:8px 12px;font-size:13px}
.imptbl th:first-child{color:var(--old)}
.imptbl th:last-child{color:var(--new-ink)}
.imptbl td{border:1px solid var(--line);padding:9px 12px;line-height:1.9;vertical-align:top}
.imptbl td:last-child{background:var(--zebra)}
.anshl{color:var(--new-ink);white-space:nowrap;background-image:linear-gradient(90deg,var(--new-on-dark),var(--blue-on-dark));background-repeat:no-repeat;background-size:100% 3px;background-position:0 100%;padding-bottom:5px}
/* ═══ v4.7: توحيد بطاقات دليل الممارس على نسق الفروقات ═══ */
.gref{display:inline-block;background:var(--old-bg);border:1px solid var(--old-line);color:var(--old);border-radius:999px;padding:0 8px;font-size:13px;font-weight:700;margin-inline-start:3px;white-space:nowrap;line-height:1.7}
.topic{border-bottom:1px solid var(--line);padding-bottom:9px;margin-bottom:12px;flex-wrap:wrap}

@media (prefers-reduced-motion:reduce){.devcard{transition:none}.devcard:hover{transform:none}}
/* ═══ المستجدات الأسبوعية v4.5 ═══ */
.wkcard{margin:16px 0 6px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);overflow:hidden}
.wkhead{display:flex;align-items:center;gap:12px;width:100%;text-align:start;padding:14px 16px;background:linear-gradient(180deg,var(--zebra),var(--zebra));border:0;cursor:pointer;font-family:inherit}
.wkhead:focus-visible{outline:2px solid var(--old);outline-offset:-2px}
.wkico{width:38px;height:38px;border-radius:10px;background:var(--old-bg);color:var(--old);display:grid;place-items:center;flex:none;border:1px solid var(--old-line)}
.wkt{flex:1;min-width:0}
.wkttl{display:block;font-weight:700;color:var(--ink);font-size:16px}
.wkrange{color:var(--gold-ink);background:var(--gold-tint);border-radius:999px;padding:2px 10px;font-size:13px;font-weight:700;margin-inline-start:8px;white-space:nowrap}
.wksub{display:block;font-size:13px;color:var(--muted);margin-top:3px}
.wkchev{color:var(--muted);transition:transform .25s;flex:none}
.wkhead.open .wkchev{transform:rotate(180deg)}
@media (prefers-reduced-motion:reduce){.wkchev{transition:none}}
#wkbody{padding:6px 16px 14px;border-top:1px solid var(--line)}
.wkitems{display:grid;gap:10px;margin:10px 0}
.wkitem{border:1px solid var(--line);border-radius:10px;padding:11px 13px;background:var(--surface)}
.wkimeta{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:5px}
.wktag{font-size:13px;font-weight:700;border-radius:999px;padding:2px 9px;border:1px solid}
.wk-mile{color:var(--new-ink);background:var(--new-bg);border-color:var(--new)}
.wk-doc{color:var(--old);background:var(--old-bg);border-color:var(--old-line)}
.wk-news{color:var(--ink2);background:var(--grey-bg);border-color:var(--line)}
.wk-watch{color:var(--amber-ink);background:var(--amber-bg);border-color:var(--amber)}
.wk-lib{color:var(--gold-ink);background:var(--gold-tint);border-color:var(--gold)}
.wkdate{font-size:13px;color:var(--muted);display:inline-flex;gap:4px;align-items:center}
.wkittl{font-weight:700;color:var(--ink);font-size:13px;line-height:1.6}
.wkdsc{font-size:13px;color:var(--ink2);line-height:1.75;margin-top:3px}
.wksrc{display:inline-flex;gap:5px;align-items:center;font-size:13px;font-weight:700;color:var(--old);margin-top:7px;text-decoration:none}
.wksrc:hover{text-decoration:underline}
.wkweek{border:1px dashed var(--line);border-radius:10px;margin:8px 0;background:var(--paper)}
.wkweek summary{cursor:pointer;padding:9px 13px;font-size:13px;font-weight:700;color:var(--ink2);display:flex;align-items:center;gap:8px;list-style:none}
.wkweek summary::-webkit-details-marker{display:none}
.wkweek[open] summary{border-bottom:1px dashed var(--line)}
.wkweek .wkitems{padding:0 12px 10px}
.wkn{margin-inline-start:auto;font-size:13px;color:var(--muted);font-weight:700}
.wknote{font-size:13px;color:var(--muted);border-top:1px dashed var(--line);padding-top:9px;margin-top:4px;line-height:1.8}
@media (max-width:640px){.wkrange{display:inline-block;margin-inline-start:0;margin-top:4px}}
/* ═══ الحزمة السريعة v4.3 ═══ */
.tstrip{background:var(--navy-900);border-bottom:1px solid rgba(201,162,75,.35);font-size:13px}
.tsin{display:flex;gap:18px;flex-wrap:wrap;padding:6px 20px}
.tsl{display:inline-flex;align-items:center;gap:7px;color:var(--on-brand-line)}
.tsl i{width:8px;height:8px;border-radius:50%;display:inline-block}
.tsl.cur i{background:var(--blue-on-dark)}
.tsl.nxt{color:var(--gold-soft)}
.tsl.nxt i{background:transparent;border:1.5px dashed var(--gold)}
.artbtn{font-size:13px;padding:4px 12px;min-height:26px}
.artcard.artflash{outline:3px solid var(--gold);outline-offset:3px;transition:outline-color .25s}
@media print{
  .tstrip{display:none!important}
  body::after{content:"هذا الدليل أداة توثيقية للاسترشاد وليس له أثر نظامي؛ المرجع الرسمي هو النص المنشور في الجريدة الرسمية (أم القرى).";display:block;margin-top:10px;padding-top:6px;border-top:1px solid var(--line);font-size:11pt;color:var(--muted)}
}

/* ═══ v5.0: الخلفيات الحية (الهوية الذهبية) ═══ */
.pagebg{position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27900%27%20height%3D%271200%27%20viewBox%3D%270%200%20900%201200%27%3E%3Cdefs%3E%3ClinearGradient%20id%3D%27p1%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%3Cstop%20offset%3D%270%27%20stop-color%3D%27%23C9A24B%27%20stop-opacity%3D%27.10%27%2F%3E%3Cstop%20offset%3D%27.55%27%20stop-color%3D%27%23C9A24B%27%20stop-opacity%3D%27.045%27%2F%3E%3Cstop%20offset%3D%271%27%20stop-color%3D%27%2314263B%27%20stop-opacity%3D%27.05%27%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpath%20d%3D%27M240%2C-40%20C40%2C320%20560%2C560%20260%2C1240%20L470%2C1240%20C820%2C560%20260%2C320%20450%2C-40%20Z%27%20fill%3D%27url%28%23p1%29%27%2F%3E%3C%2Fsvg%3E") no-repeat left -220px center/640px 125%,
    radial-gradient(54rem 36rem at 86% -10%,rgba(201,162,75,.13),transparent 62%),
    radial-gradient(64rem 44rem at -16% 26%,rgba(30,95,168,.055),transparent 58%),
    radial-gradient(50rem 36rem at 112% 84%,rgba(20,38,59,.05),transparent 62%),
    linear-gradient(180deg,var(--page-top) 0%,var(--paper) 34%,var(--paper) 100%)}
.pagebg::after{content:"";position:absolute;inset:0;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27240%27%20height%3D%27240%27%3E%3Cfilter%20id%3D%27n%27%3E%3CfeTurbulence%20type%3D%27fractalNoise%27%20baseFrequency%3D%270.8%27%20numOctaves%3D%272%27%20stitchTiles%3D%27stitch%27%2F%3E%3CfeColorMatrix%20type%3D%27saturate%27%20values%3D%270%27%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%27100%25%27%20height%3D%27100%25%27%20filter%3D%27url%28%23n%29%27%2F%3E%3C%2Fsvg%3E");background-size:240px 240px}
/* البطاقات الرئيسة: تدرج ضوء علوي + ظل طبقي + خط ضوء داخلي */
.dbox,.hitcard,.svcform,.modecard,.ncard,.kpi,.chartbox,.coibox,.decl,.minhl,.dstat,.memwrap,aside.tl{
  background-image:linear-gradient(180deg,var(--surface) 0%,var(--card-end) 100%);
  box-shadow:var(--shadow-sm),inset 0 1px 0 var(--hi-inset)}
.impcard,.wkcard{box-shadow:var(--shadow),inset 0 1px 0 var(--hi-inset);
  background-image:linear-gradient(180deg,var(--surface) 0%,var(--card-end) 100%)}
.libtable{box-shadow:var(--shadow-sm)}
.chgcard,.best,.kps li{background-image:linear-gradient(180deg,var(--sheen),rgba(255,255,255,0) 55%)}
/* ترويسة كل صفحة: خط ضوء ذهبي علوي + التدرج */
.dhead{background-image:
    linear-gradient(90deg,rgba(201,162,75,0) 4%,rgba(201,162,75,.5) 50%,rgba(201,162,75,0) 96%),
    linear-gradient(180deg,var(--surface) 0%,var(--card-end) 100%);
  background-size:100% 2px,100% 100%;background-repeat:no-repeat;background-position:top,0 0;
  box-shadow:var(--shadow-sm),inset 0 1px 0 var(--hi-inset);position:relative}
/* بطاقات الرئيسية: ارتكاز مظلل وارتفاع عند المرور */
a.optcard:hover{box-shadow:var(--shadow-lift)}
/* إيقاع صفوف المكتبة */
@media (max-width:719px){
  .pagebg{background-position:left -360px center,0 0,0 0,0 0}
}
@media print{.pagebg{display:none!important}}

/* ═══ v5.1: الحيوية الكاملة ═══ */
header.site::after{content:"";position:absolute;left:0;right:0;bottom:0;height:10px;pointer-events:none;background:var(--najdi) repeat-x left bottom}
.optcard{position:relative;overflow:hidden}
::selection{background:var(--gold-soft);color:var(--navy-900)}
html{scrollbar-color:var(--scroll-thumb) transparent}
::-webkit-scrollbar{width:13px;height:13px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border:3.5px solid var(--grey-bg);border-radius:9px}
::-webkit-scrollbar-thumb:hover{background:var(--scroll-thumb)}
.reptbl th,.alttbl th,.quotbl th,.coitbl th,.imptbl th{background:linear-gradient(180deg,var(--zebra),var(--grey-bg))}

/* ═══ v5.2: التذييل المرجعي + الشريط الحي ═══ */

/* ═══ v5.3: الهيرو المقسوم الأخضر/الكحلي ═══ */
.heroX{display:grid;grid-template-columns:1.55fr 1.05fr;align-items:stretch;position:relative;z-index:1;overflow:hidden;background:linear-gradient(150deg,var(--navy-900) 0%,var(--navy-900) 45%,var(--navy-700) 100%)}
.hx-main{padding:38px min(5vw,58px) 30px;position:relative;z-index:1}
.hx-side{position:relative;z-index:1;padding:34px 26px 38px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.hcta{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0 16px}
.btnG{display:inline-flex;align-items:center;gap:10px;background:linear-gradient(135deg,var(--gold),var(--gold));color:var(--on-gold);
  font-weight:700;font-size:14px;border-radius:999px;padding:11px 22px;box-shadow:0 10px 24px -10px rgba(201,162,75,.55);
  transition:transform .15s ease,box-shadow .15s ease}
.btnG:hover{transform:translateY(-2px);box-shadow:0 16px 34px -12px rgba(201,162,75,.7);text-decoration:none}
.btnG .car{font-size:16px}
.btnL{display:inline-flex;align-items:center;background:transparent;border:1.5px solid rgba(255,255,255,.45);color:var(--on-dark-soft);
  font-weight:700;font-size:14px;border-radius:999px;padding:11px 22px;transition:border-color .15s,transform .15s}
.btnL:hover{border-color:var(--gold);transform:translateY(-2px);text-decoration:none}
@media (max-width:880px){
  .heroX{grid-template-columns:1fr}
  .hx-side{display:none}
}

/* ═══ v5.4: تمثيل الباحث ═══ */
.refchip{font-size:13px;background:var(--brand);border:1px solid var(--brand-hover);color:var(--on-brand);border-radius:8px;padding:3px 12px;font-weight:700}
.approx{font-size:13px;color:var(--muted);border:1px dashed var(--line);border-radius:999px;padding:2px 9px}
.hitcard .hmeta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:9px}
.hacts{margin-inline-start:auto;display:flex;gap:6px}
.hcopy,.hmore{font-size:13px;font-weight:700;border:1px solid var(--line);background:var(--surface);color:var(--ink2);border-radius:8px;padding:3.5px 11px;cursor:pointer;transition:border-color .15s,color .15s}
.hcopy:hover,.hmore:hover{border-color:var(--gold);color:var(--gold-ink)}
.sugg{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:12px 0}
.sglbl{font-size:13px;color:var(--muted);font-weight:700}
.sgchip{font-size:13px;border:1px solid var(--old-line);background:var(--old-bg);color:var(--old);border-radius:999px;padding:4.5px 13px;cursor:pointer;transition:border-color .15s,transform .15s}
.sgchip:hover{border-color:var(--old);transform:translateY(-1px)}
.sgchip.h{background:var(--surface);border-style:dashed}
.fflt{display:flex;gap:8px;margin:8px 0 14px;flex-wrap:wrap}
.fflt button{font-size:13px;font-weight:700;border:1.5px solid var(--line);background:var(--surface);color:var(--ink2);border-radius:999px;padding:4.5px 15px;cursor:pointer}
.fflt button.on{background:var(--sel-bg);color:var(--sel-fg);border-color:var(--sel-bg)}
.fcount{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink2);margin:12px 0 4px;font-weight:700}
.fcount b{color:var(--ink);font-size:14px}
.etips{font-size:13px;color:var(--muted);line-height:2.1;margin-top:10px}
.fcross{margin-top:14px}
.fcrossbtn{background:linear-gradient(135deg,var(--gold),var(--gold));border:0;color:var(--on-gold);font-weight:700;font-size:13px;border-radius:999px;padding:10px 20px;cursor:pointer;box-shadow:0 8px 20px -8px rgba(201,162,75,.5)}
.empty .sugg{justify-content:center}

/* ═══ v5.7: الخطوط خلف العدّاد (يسار) + نقطة تتوقف وتكشف تغييرًا موثقًا ═══ */
.hlines{position:absolute;inset:0;z-index:0;pointer-events:none}
.hlines i{position:absolute;top:-60%;height:220%;width:1.5px;transform:rotate(27deg);transform-origin:top center;
  background:linear-gradient(180deg,transparent 4%,var(--ll,rgba(127,163,200,.15)) 48%,transparent 96%)}
.hlines i.g{--lc:rgba(201,162,75,.8);--ll:rgba(201,162,75,.26);width:2px}
.hlines i.b{--lc:rgba(127,177,232,.7);--ll:rgba(127,177,232,.2)}
/* v7.5.1: الحزمة نفسها (تباعد 130px) تُزاح يمينًا على الشاشات العريضة حتى تظهر النقطة المتحركة والبطاقة الأولى كاملتين؛ وتبقى البطاقات داخل مسرح العدّاد */
.hlines i:nth-child(1){inset-inline-end:calc(42% - 312px)}
.hlines i:nth-child(2){inset-inline-end:calc(42% - 182px)}
.hlines i:nth-child(3){inset-inline-end:calc(42% - 52px)}
.hlines i:nth-child(4){inset-inline-end:calc(42% + 78px)}
.hlines i:nth-child(5){inset-inline-end:calc(42% + 208px)}
@media (max-width:1280px){
  .hlines i:nth-child(1){inset-inline-end:278px}.hlines i:nth-child(2){inset-inline-end:378px}.hlines i:nth-child(3){inset-inline-end:478px}
  .hlines i:nth-child(4){inset-inline-end:578px}.hlines i:nth-child(5){inset-inline-end:678px}
  .hlines i b{max-width:min(270px,25vw)}
}
@media (max-width:1100px){
  .hlines i:nth-child(1){inset-inline-end:274px}.hlines i:nth-child(2){inset-inline-end:364px}.hlines i:nth-child(3){inset-inline-end:454px}
  .hlines i:nth-child(4){inset-inline-end:544px}.hlines i:nth-child(5){inset-inline-end:634px}
  .hlines i b{max-width:220px;padding:9px 12px 10px}
  .hlines i b .lt{font-size:13px}
}
.hlines i{--la:var(--blue-on-dark)}
.hlines i.g{--la:var(--gold-soft)}
.hlines i.b{--la:var(--blue-on-dark)}
.hlines i::before,.hlines i::after{content:"";position:absolute;left:50%;height:56%;opacity:0;will-change:transform;
  animation:dotUp 30s ease-in-out infinite;animation-delay:var(--ld,0s);pointer-events:none}
.hlines i::after{top:calc(28% - 3.5px);width:7px;margin-left:-3.5px;
  background:radial-gradient(circle at 50% 3.5px,var(--on-brand) 0 3px,transparent 3.6px) no-repeat;
  filter:drop-shadow(0 0 3px var(--la)) drop-shadow(0 0 9px var(--la))}
.hlines i::before{top:calc(28% - 60px);width:3px;margin-left:-1.5px;
  background:linear-gradient(180deg,transparent 0%,var(--lc,rgba(127,163,200,.85)) 50%,transparent 100%) no-repeat 50% 0/3px 120px}
.hlines i.dn::before,.hlines i.dn::after{animation-name:dotDown}
.hlines i b{position:absolute;top:50%;left:16px;width:max-content;max-width:min(300px,24vw);transform:rotate(-27deg) translateY(-50%);transform-origin:0 0;
  font-style:normal;display:flex;flex-direction:column;gap:4px;padding:11px 15px 12px;border-radius:12px;text-align:right;direction:rtl;
  background:rgba(9,20,40,.8);border:1px solid rgba(255,255,255,.14);border-left:3px solid var(--la);box-shadow:0 12px 32px rgba(3,10,24,.5);
  opacity:0;animation:lblShow 30s ease infinite;animation-delay:var(--ld,0s);will-change:opacity}
.hlines i.lf b{left:-16px;transform:rotate(-27deg) translate(-100%,-50%);border-left:1px solid rgba(255,255,255,.14);border-right:3px solid var(--la)}
.hlines i b .lk{align-self:flex-start;font-size:13px;font-weight:700;color:var(--gold-soft);background:rgba(201,162,75,.16);border:1px solid rgba(201,162,75,.5);border-radius:999px;padding:2px 10px;line-height:1.6}
.hlines i b .lt{font-size:14px;line-height:1.6;font-weight:700;color:var(--on-brand);text-wrap:balance}
.hlines i b .lt em{white-space:nowrap}
.hlines i b .lt em{font-style:normal;color:var(--gold-soft)}
.hlines i b .lw{font-size:13px;line-height:1.6;font-weight:700;color:rgba(196,212,232,.78)}
@supports ((backdrop-filter:blur(6px)) or (-webkit-backdrop-filter:blur(6px))){.hlines i b{background:rgba(9,20,40,.66);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}}
@keyframes dotUp{
  0%{transform:translateY(100%);opacity:0}
  1%{opacity:1}
  4%{transform:translateY(39.29%)}
  16%{transform:translateY(39.29%)}
  18.6%{opacity:1}
  20%{transform:translateY(0);opacity:0}
  20.1%{transform:translateY(100%)}
  100%{transform:translateY(100%);opacity:0}
}
@keyframes dotDown{
  0%{transform:translateY(0);opacity:0}
  1%{opacity:1}
  4%{transform:translateY(39.29%)}
  16%{transform:translateY(39.29%)}
  18.6%{opacity:1}
  20%{transform:translateY(100%);opacity:0}
  20.1%{transform:translateY(0)}
  100%{transform:translateY(0);opacity:0}
}
@keyframes lblShow{
  0%,3.6%{opacity:0}
  5.2%{opacity:1}
  15.4%{opacity:1}
  17%{opacity:0}
  100%{opacity:0}
}
@media (max-width:880px){
  .hlines i b{display:none}
  .hlines i:nth-child(1){inset-inline-end:calc(8% + 240px)}
  .hlines i:nth-child(2){inset-inline-end:calc(28% + 240px)}
  .hlines i:nth-child(3){inset-inline-end:calc(48% + 240px)}
  .hlines i:nth-child(4){inset-inline-end:calc(68% + 240px)}
  .hlines i:nth-child(5){inset-inline-end:calc(88% + 240px)}
}
@media (prefers-reduced-motion:reduce){.hlines i::before,.hlines i::after,.hlines i b{animation:none;opacity:0}}

/* ═══ v5.8: شريط الجدول الزمني: النشر ← (120) يومًا ← النفاذ ═══ */
.htl{grid-column:1/-1;position:relative;z-index:1;display:flex;align-items:center;gap:22px;
  padding:16px min(5vw,58px) 18px;border-top:1px solid rgba(255,255,255,.09)}
.htl-node{display:flex;flex-direction:column;gap:2px;min-width:max-content}
.htl-node b{font-size:13px;font-weight:700;color:rgba(196,212,232,.75)}
.htl-node span{font-size:13px;font-weight:700;color:var(--on-brand-hi)}
.htl-node.pub span{color:var(--gold)}
.htl-node.go span{color:var(--new-on-dark)}
.htl-trackwrap{flex:1;position:relative}
.htl-count{text-align:center;margin-bottom:9px;color:var(--on-dark-soft);font-size:14px;font-weight:700}
.htl-count b{font-size:40px;font-weight:700;color:var(--on-brand);line-height:1;margin-inline-end:7px;
  text-shadow:0 2px 18px rgba(201,162,75,.35)}
.htl-cap{display:block;text-align:center;margin-top:8px;font-size:13px;font-weight:700;
  color:rgba(196,212,232,.85);}
.htl-track{height:6px;border-radius:99px;background:rgba(255,255,255,.12);overflow:hidden}
.htl-track i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--new-on-dark),var(--gold));border-radius:99px;transition:width .2s ease}
@media (max-width:880px){
  .htl{flex-wrap:wrap;gap:10px 12px;padding:12px 18px 14px}
  .htl-node{flex:1}
  .htl-node.go{align-items:flex-end;text-align:end}
  .htl-trackwrap{order:3;flex-basis:100%;padding-top:14px}
}
@media print{.htl{display:none}}

/* ═══ v6.1: شبكة الأثر + الملخص التنفيذي + الأحكام الانتقالية ═══ */
.xstrip{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.xchip{display:inline-flex;align-items:center;gap:9px;background:var(--surface);border:1px solid var(--gold-tint-line);border-radius:999px;
  padding:9px 18px;font-size:13px;font-weight:700;color:var(--ink);box-shadow:var(--shadow-sm);transition:transform .15s,border-color .15s}
.xchip b{color:var(--gold-ink);background:var(--amber-bg);border-radius:999px;padding:1px 9px;font-size:13px}
.xchip:hover{border-color:var(--gold);text-decoration:none;transform:translateY(-1px)}
.ivbar{display:flex;gap:9px;flex-wrap:wrap;margin:14px 0}
.ivfbtn{border:1.5px solid var(--line);background:var(--surface);border-radius:999px;padding:7px 16px;font-size:13px;font-weight:700;color:var(--ink2);cursor:pointer;font-family:inherit}
.ivfbtn b{color:var(--muted);font-weight:700;margin-inline-start:4px}
.ivfbtn.on{border-color:var(--sel-bg);background:var(--sel-bg);color:var(--sel-fg)}
.ivfbtn.on b{color:var(--sel-sub)}
.ivgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.ivpcard{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow-sm);
  display:flex;flex-direction:column;gap:7px;transition:transform .15s,box-shadow .15s,border-color .15s}
.ivpcard:hover{border-color:var(--gold);text-decoration:none;transform:translateY(-2px);box-shadow:var(--shadow)}
.ivpcard>b{color:var(--ink);font-size:14px}
.ivpcard .ivph{font-size:13px;color:var(--muted);font-weight:700}
.ivpcard p{margin:0;font-size:13px;color:var(--ink2);line-height:1.95}
.ivpcard .impv{align-self:flex-start}
.xten{margin:6px 0 0;padding-inline-start:22px;display:grid;gap:10px}
.xten li{font-size:14px;line-height:2.05;color:var(--ink2)}
.xten li b{color:var(--ink)}
.trwrap{display:grid;gap:12px}
.trb{background:var(--surface);border:1px solid var(--line);border-inline-start:3px solid var(--gold);border-radius:var(--radius);
  padding:13px 16px;display:flex;gap:14px;align-items:flex-start;box-shadow:var(--shadow-sm)}
.trn{flex:none;font-weight:700;color:var(--gold-ink);background:var(--amber-bg);border-radius:9px;padding:3px 12px;font-size:13px;white-space:nowrap}
.trb p{margin:0;font-size:13px;line-height:2.05;color:var(--ink2)}
.xintro{font-size:14px;line-height:2.1;color:var(--ink2);background:var(--surface);border:1px dashed var(--gold-tint-line);border-radius:var(--radius);padding:13px 16px;margin:0}
.faqx{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.fq{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:13px 16px;box-shadow:var(--shadow-sm)}
.fq b{display:block;color:var(--ink);font-size:14px;margin-bottom:6px}
.fq b i{font-style:normal;color:var(--gold-ink);margin-inline-end:7px}
.fq p{margin:0;font-size:13px;line-height:2;color:var(--ink2)}
@media (max-width:980px){.ivgrid{grid-template-columns:1fr 1fr}.faqx{grid-template-columns:1fr}}
@media (max-width:640px){.ivgrid{grid-template-columns:1fr}}
@media print{.noprint,.xstrip,#tabs,.back{display:none!important}.xten li,.trb p,.fq p{font-size:13px}
.rev{opacity:1!important;transform:none!important}
*{transition:none!important;animation:none!important}
.heroX,.hx-side{background:none!important}.hlines,.pagebg,.flines{display:none!important}header.site::before,header.site::after{display:none!important}}

/* ═══ v6.3: ما ظل كما هو ═══ */
.samenote{color:var(--ink2);font-size:13px;margin:0 0 12px;line-height:2}
.samewrap{display:flex;flex-wrap:wrap;gap:9px}
.samechip{background:var(--new-bg);border:1px solid var(--new-line);color:var(--new-ink);border-radius:10px;
  padding:7px 13px;font-size:13px;font-weight:700;display:inline-flex;flex-direction:column;gap:2px}
.samechip i{font-style:normal;font-weight:700;font-size:13px;color:var(--muted)}

/* ═══ v6.5: التذييل بأسلوب البانر العلوي ═══ */
footer{position:relative;overflow:hidden;margin-top:56px;color:var(--on-brand-line);background:var(--navy-900);border-top:2px solid rgba(201,162,75,.55)}
.flines{display:none} /* decorative footer lines: retired in v7.5 (solid footer) */
.fgrid{display:grid;grid-template-columns:1.5fr .95fr .85fr 1.55fr;gap:30px;padding-top:40px;padding-bottom:26px;position:relative;z-index:1;align-items:start}
.fbrand .fname{color:var(--on-brand);font-size:18px;display:block;line-height:1.4}
.fbrand .fname .fhl{color:var(--gold)}
.fbrand .ftag{font-size:13px;color:var(--on-dark);margin-top:6px;line-height:1.9}
.fpath{display:flex;align-items:center;gap:8px;margin-top:14px;font-size:13px;font-weight:700;color:rgba(196,212,232,.75)}
.fpath i{flex:none;width:26px;height:1px;background:linear-gradient(90deg,var(--new-on-dark),var(--gold))}
.fhead{display:block;color:var(--gold);font-weight:700;font-size:14px;margin-bottom:11px}
.fcol a{display:block;color:var(--on-brand-line);margin:8px 0;font-size:13px;width:fit-content}
.fcol a:hover{color:var(--gold-soft);text-decoration:none}
.fnote p{color:var(--on-dark);font-size:13px;line-height:2.05;margin:0}
.fbottom{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding-top:18px;padding-bottom:20px;border-top:1px solid rgba(255,255,255,.1)}
.devcard{display:inline-flex;align-items:center;gap:12px;color:var(--on-brand-line);padding:4px 0}
.devcard:hover{text-decoration:none}
.devph{width:56px;height:56px;border-radius:50%;object-fit:cover;display:block;border:2px solid rgba(201,162,75,.75);box-shadow:0 4px 14px rgba(0,0,0,.35)}
.devtxt{display:flex;flex-direction:column;gap:2px;line-height:1.4}
.devlbl{font-size:13px;color:var(--gold-soft)}
.devname{font-size:14px;color:var(--on-brand);font-weight:700}
.devlink{display:inline-block;align-self:flex-start;margin-top:4px;padding:3px;border-radius:9px;background:linear-gradient(135deg,var(--gold-soft),var(--gold) 60%,var(--gold));box-shadow:0 2px 8px rgba(0,0,0,.35)}
.devlink b{display:grid;place-items:center;width:24px;height:24px;direction:ltr;font-family:Arial,Helvetica,sans-serif;font-size:14px;font-weight:700;color:var(--gold);background:var(--navy-900);border-radius:6px;line-height:1;padding-bottom:1px}
.devcard:hover .devname{color:var(--gold)}
.devcard:hover .devlink{filter:brightness(1.1);text-decoration:none}
.devcard:hover .devlink b{background:var(--navy-900)}
.fcopyline{color:var(--on-dark);font-size:13px}
@media (max-width:880px){
  .fgrid{grid-template-columns:1fr 1fr;gap:22px 18px;padding-top:30px}
  .fbrand,.fnote{grid-column:1/-1}
  .fbottom{flex-direction:column;align-items:flex-start;gap:12px}
}
@media (max-width:359px){.fgrid{grid-template-columns:1fr}}
.sgchip{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdays{font-size:22px;font-weight:700;color:var(--on-brand);margin:0 0 7px;line-height:1.4}
/* ═══ v6.5: إصلاحات التدقيق البصري ═══ */
@media (max-width:1100px){.libtable{font-size:13px}.libtable th,.libtable td{padding:8px 6px}.libtable td .badge{white-space:normal;line-height:1.5}}
.code{white-space:nowrap;direction:ltr;unicode-bidi:isolate;font-variant-numeric:tabular-nums}
@media (max-width:640px){.fcol a{padding:5px 0;margin:4px 0}.memtbl input[type=checkbox]{width:18px;height:18px;margin:6px;flex:none}.memtbl .del{min-width:36px;min-height:36px;display:inline-grid;place-items:center}.back{padding:8px 0}}
@media (max-width:480px){.htl-node b,.htl-cap,.nl,.ivph,.tagl,.plabel,.devlbl{font-size:13px}}
@media (min-width:900px){.kps{grid-template-columns:repeat(2,1fr)}}
.kps.kdates{grid-template-columns:1fr}
.nw{white-space:nowrap}
.mission h2.display{text-wrap:balance}
@media (max-width:1100px){.bgfx{width:92px;height:66px;opacity:.14}.bigbox.wide .bgfx{width:130px;height:48px}}
@media (max-width:360px){.svcform label{min-width:0}.svcform input[type=text],.svcform input[type=number],.svcform select{width:100%;min-width:0;box-sizing:border-box}}

/* ═══ v6.5: باحث دليل الفروقات ═══ */
.dsearch .findbar{margin:12px 0 6px}
.dsearch .findbar input{padding:12px 16px;font-size:14px}
.dcount{font-size:13px;color:var(--muted);margin:10px 0 8px;font-weight:700}
.dnone{font-size:13px;color:var(--ink2);margin:10px 0 0}
.dhit{display:block;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:8px 0;color:var(--ink);text-decoration:none;transition:border-color .2s,box-shadow .2s}
.dhit:hover{border-color:var(--gold);box-shadow:0 6px 18px -10px rgba(11,24,48,.35);text-decoration:none}
.dhit-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.dnum{background:var(--brand);color:var(--on-brand);font-weight:700;font-size:13px;border-radius:6px;padding:2px 10px}
.dold,.dfasl{font-size:13px;color:var(--muted);font-weight:700}
.dfasl::before{content:"·";margin-inline-end:6px}
.dhit-t{display:block;font-size:13px;line-height:1.9;color:var(--ink2)}

/* ═══ v6.8: الجوال: رأس مضغوط وتبويبات أفقية ═══ */
@media (max-width:880px){
  .tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:8px;margin-top:14px;padding-bottom:2px}
  .tabs::-webkit-scrollbar{display:none}
  .tab{flex:none;white-space:nowrap;padding:8px 13px;font-size:13px}
  .hx-main{padding:26px 18px 22px}
  .brand h1{font-size:22px;line-height:1.45}
  .brand .tag{font-size:13px;line-height:1.85;margin-top:10px}
  .hcta{margin:14px 0 10px}
  .lawline{display:none}
  .htl{padding:10px 18px 12px}
  .htl-count b{font-size:22px}
  .tsin{padding:5px 16px;gap:6px 14px}
  /* الصفحات الداخلية: الهوية والعدّاد المختصر والتبويبات فقط */
  body.inner .tltoggle{margin-top:10px}
  .hdot{display:none}
  .back{margin:14px 0 4px}
}

/* ═══ v7.0: البنود في أسطر، بطاقة الرقم، ترتيب قبل/بعد ═══ */
.cn{display:inline-block;color:var(--navy);font-weight:700;margin-top:6px;margin-inline-end:4px}
.cl{display:inline-block;color:var(--ink2);font-weight:700;margin-top:3px;margin-inline-start:16px;margin-inline-end:4px}
.pane-old .cn{color:var(--text)}
.hbody .cn,.hfull .cn{margin-top:5px}
.arrowba{color:var(--muted);font-size:16px}
.refchip.nbig{font-size:14px;padding:5px 14px;border-radius:9px}
.ntitle{font-size:13px;color:var(--ink2);font-weight:700}

.hitcard.nhit.exact{border-color:var(--navy);box-shadow:0 8px 24px -16px rgba(11,24,48,.5)}
.fmore{font-weight:700;color:var(--muted)}

/* ═══ v7.1: نمط البحث ═══ */
.fmode{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:4px 0 12px}
.fmlbl{font-size:13px;font-weight:700;color:var(--ink2)}
.fmode button{font-size:13px;font-weight:700;border:1.5px solid var(--line);background:var(--surface);color:var(--ink2);border-radius:999px;padding:4px 14px;cursor:pointer;min-height:30px}
.fmode button.on{background:var(--sel-bg);color:var(--sel-fg);border-color:var(--sel-bg)}
.fmhint{font-size:13px;color:var(--muted);line-height:1.7;flex-basis:100%}
.fmswitch{font:inherit;font-size:inherit;font-weight:700;color:var(--navy);background:var(--old-bg);border:1px solid var(--old-line);border-radius:999px;padding:2px 11px;cursor:pointer}
.fmswitch:hover{background:var(--old-bg)}
.dnone .fmswitch{margin:0 2px}
@media (max-width:480px){.fmhint{font-size:13px}}

/* ═══ v7.2: رأس مضغوط للصفحات الداخلية على كل الشاشات ═══ */
body.inner .tstrip{display:none}
/* شريط التبويبات اللاصق (خارج الهيدر) */
.tabsbar{position:sticky;top:0;z-index:140;background:var(--navy-900);border-bottom:1px solid rgba(201,162,75,.35)}
.tabsbar[hidden]{display:none}
.tabsbar .tabs{margin:0;padding:9px 0;animation:none}
.tabsbar.stuck{box-shadow:0 8px 22px -12px rgba(0,0,0,.55)}
@media print{.tabsbar{display:none!important}}
/* بحث الهيرو وروابط سريعة */
.hsearch{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:4px 0 12px;max-width:640px}
.hsearch #hq{flex:1 1 300px;min-width:0;padding:11px 14px;border-radius:11px;border:1px solid rgba(255,255,255,.5);background:rgba(255,255,255,.08);color:var(--on-brand);font:inherit;font-size:14px}
.hsearch #hq::placeholder{color:rgba(216,225,236,.65)}
.hsearch #hq:focus{outline:2px solid var(--gold);outline-offset:1px;background:rgba(255,255,255,.12)}
.hsearch button{padding:11px 18px;border-radius:11px;border:0;background:var(--gold);color:var(--on-gold);font:inherit;font-weight:700;cursor:pointer}
@media (max-width:600px){.hsearch #hq{flex-basis:150px}.hsearch{gap:6px}}
.hsopt{display:flex;gap:6px;flex-basis:100%;flex-wrap:wrap}
.hsopt label{font-size:13px;font-weight:700;color:var(--on-dark-soft);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:3px 11px;cursor:pointer;display:inline-flex;flex-direction:row;align-items:center;gap:6px;white-space:nowrap;line-height:1.6}
.hsopt label:has(input:checked){background:rgba(201,162,75,.18);border-color:var(--gold);color:var(--on-brand)}
.hsopt input{accent-color:var(--gold);margin:0;width:13px;height:13px;flex:none;padding:0}
.hquick{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0 0 6px;font-size:13px}
.hquick .hql{color:var(--on-dark);font-weight:700;margin-inline-end:2px}
.hquick a{color:var(--on-brand);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:4px 12px;text-decoration:none}
.hquick a:hover{background:rgba(201,162,75,.2);border-color:var(--gold);text-decoration:none}
.htl-link{display:block;text-align:center;margin-top:6px;font-size:13px;font-weight:700;color:var(--gold);text-decoration:none}
.htl-link:hover{text-decoration:underline}
/* البانر: تكرار محذوف */
.banner{display:none}
.tsl.upd{color:var(--gold-soft);text-decoration:none}
.tsl.upd:hover{text-decoration:underline}
/* فهرس صفحة العملية */
.ptoc{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.ptoc a{font-size:13px;font-weight:700;color:var(--navy);background:var(--old-bg);border:1px solid var(--old-line);border-radius:999px;padding:4px 12px;text-decoration:none}
.ptoc a:hover{background:var(--old-bg);text-decoration:none}
/* رقاقات المرحلة */
.phbar{display:flex;gap:8px;flex-wrap:wrap;margin:-4px 0 14px}
.phfbtn{font-size:13px;font-weight:700;border:1.5px solid var(--line);background:var(--surface);color:var(--ink2);border-radius:999px;padding:4.5px 13px;cursor:pointer}
.phfbtn b{font-weight:700;color:var(--muted)}
.phfbtn.on{background:var(--sel-bg);color:var(--sel-fg);border-color:var(--sel-bg)}.phfbtn.on b{color:var(--sel-sub)}
.ivnone{font-size:13px;color:var(--muted);padding:14px 0}
/* اللجنة: الخلاصة أولًا */
.sv1sum{display:flex;align-items:center;gap:16px;flex-wrap:wrap;background:var(--surface);border:1.5px solid var(--line);border-radius:14px;padding:14px 18px}
.sv1sum.ok{border-color:var(--new-on-dark);background:var(--new-bg)}.sv1sum.miss{border-color:var(--gold);background:var(--amber-bg)}.sv1sum.viol{border-color:var(--danger-line);background:var(--danger-bg)}
.sv1big{font-family:inherit;font-weight:700;font-size:22px;color:var(--navy);min-width:80px}
.sv1txt{flex:1;min-width:220px;display:flex;flex-direction:column;gap:3px}.sv1txt span{font-size:13px;color:var(--ink2)}
.sv1acts{display:flex;gap:8px;flex-wrap:wrap}.sv1acts a{font-size:13px;font-weight:700;color:var(--navy);background:var(--old-bg);border:1px solid var(--old-line);border-radius:999px;padding:5px 13px;text-decoration:none}
/* قوالب الخطة */
.plnpre{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:12px}
.plnpl{font-size:13px;font-weight:700;color:var(--ink2)}
.plnpre button{font:inherit;font-size:13px;font-weight:700;border:1.5px solid var(--line);background:var(--surface);color:var(--ink2);border-radius:999px;padding:5px 13px;cursor:pointer}
.plnpre button b{font-weight:700;color:var(--muted);margin-inline-start:4px}
.plnpre button.on{background:var(--sel-bg);color:var(--sel-fg);border-color:var(--sel-bg)}.plnpre button.on b{color:var(--sel-sub)}

/* ═══ v7.5: نظام الرموز والتنقيحات ═══ */
:root{
  --navy-900:#0F1E33; --navy-700:#1F3A5F; --ink:#14263B; --text:#2F3D4F; --muted:#5B6A7D;
  --paper:#F5F2EA; --surface:#FFFFFF; --line:#DDE4EB; --zebra:#F4F6F8;
  --gold:#C9A24B; --gold-ink:#7A5C1E; --gold-soft:#E8D9AE; --gold-hover:#B8923F; --gold-line:#A08033; --field-line:#7D8A9C;
  --tabsbar-h:65px;
  /* v7.6 dark-theme roles (css-dark): theme-invariant colours for content on navy/gold fills, plus role tokens that the
     DARK THEME block at the end re-maps. Light values equal the colours these rules used before (light theme unchanged). */
  --on-brand:#FFFFFF; --on-brand-line:#DDE4EB; --on-brand-hi:#EDF3FA; --on-gold:#14263B;
  --brand:#14263B; --brand-hover:#1F3A5F; --brand-ink:#1F3A5F; --brand-gold:#C9A24B;
  --sel-bg:#14263B; --sel-fg:#FFFFFF; --sel-sub:#E8D9AE;
  --new-fill:#0B6A48; --amber-fill:#8C5A12; --burg-ink:#7A1F2B; --ink3:#4A5A6E;
  --gold-tint:#E8D9AE; --gold-tint-line:#E8D9AE; --mark-bg:#E8D9AE; --dash-line:#AFC0D3;
  --card-end:rgba(244,246,249,.65); --hi-inset:rgba(255,255,255,.9); --sheen:rgba(255,255,255,.75);
  --shadow-card:0 1px 2px rgba(20,38,59,.05),0 10px 24px -14px rgba(20,38,59,.18); --bgfx-stroke:rgba(20,38,59,.35);
  --ins-bg:rgba(11,138,92,.16); --del-bg:rgba(179,58,58,.10); --del-strike:rgba(179,58,58,.65);
  --scroll-thumb:#1F3A5F; --chart-grey:#94A8BF; --chart-empty:#E7ECF1; --page-top:var(--amber-bg);
  --chart-navy:#14263B; --rep-amber:#B7791F; /* css-fix: chart-only navy and committee 'فني' amber (re-mapped in dark) */
  color-scheme:light;
  --new:#0B8A5C; --new-ink:#0B6A48; --new-bg:#EAF6F0; --new-line:#BCE3D2; --new-on-dark:#8FD6AE;
  --old:#1E5FA8; --old-bg:#EDF3FA; --old-line:#C6D7EC; --blue-on-dark:#7FB1E8;
  --amber:#B7791F; --amber-ink:#8C5A12; --amber-bg:#FBF3E4;
  --burg:#7A1F2B; --burg-bg:#F8ECEC; --grey-bg:#EEF1F4;
  --danger:#B33A3A; --danger-bg:#FBECEC; --danger-line:#EBC7C7; --danger-on-dark:#FF8A80;
  --on-dark:#AFC0D3; --on-dark-soft:#D8E1EC;
  --ink2:var(--text); --navy:var(--ink); --locked:var(--muted); --locked-bg:var(--grey-bg);
  --r-sm:8px; --r-md:12px; --r-pill:999px; --radius:12px;
  --fs-cap:13px; --fs-sm:14px; --fs-body:16px; --fs-h4:18px; --fs-h3:22px; --fs-h2:30px; --fs-hero:40px;
  --najdi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='10'%3E%3Cpath d='M2 10H22V7.5H19V5H16V2.5H13V0H11V2.5H8V5H5V7.5H2Z' fill='%23C9A24B' fill-opacity='.55'/%3E%3C/svg%3E");
  --shadow:0 1px 1px rgba(20,38,59,.045),0 4px 9px -4px rgba(20,38,59,.07),0 18px 38px -18px rgba(20,38,59,.17);
  --shadow-sm:0 1px 1.5px rgba(20,38,59,.05),0 6px 16px -9px rgba(20,38,59,.11);
  --shadow-lift:0 2px 3px rgba(20,38,59,.05),0 9px 18px -7px rgba(20,38,59,.11),0 28px 54px -22px rgba(20,38,59,.24);
}
/* D0: مقياس الأحجام ونص المتن */
body{font-size:var(--fs-body);line-height:1.85}
.sec p,.summary,.kps li,.pane,.imptbl td,.wkdsc,.xintro,.faqx p,.trb p,.hitcard,.ncard .nq,.about p,.priv p,.dhead .summary{color:var(--text)}
h2.display,#app h1.display{font-size:var(--fs-h2)} h3.display{font-size:var(--fs-h3)} h4{font-size:var(--fs-h4)}
@media (max-width:640px){:root{--fs-h4:17px;--fs-h3:19px;--fs-h2:24px;--fs-hero:30px}}
/* D3: ألوان دلالية لوسوم الفروقات */
.dchip.mod{background:var(--navy-700)} .dchip.new{background:var(--new-fill)} .dchip.del{background:var(--burg)} .dchip.same{background:var(--grey-bg);color:var(--ink3)}
/* D6: شريط الشرفات النجدية أسفل البطل وأعلى التذييل، وتذييل مصمت */
footer::before{content:"";position:absolute;left:0;right:0;top:0;height:10px;background:var(--najdi) repeat-x left top;transform:scaleY(-1)}
/* D7: سياسة الخصوصية في عمود قراءة واحد */
.kps>ul{grid-column:1/-1}
/* D5: صناديق الرئيسية بطاقات بيضاء */
.bigbox:not(.wide){background:var(--surface);color:var(--ink);border:1px solid var(--line);box-shadow:var(--shadow-card)}
.bigbox:not(.wide) h3{color:var(--ink)} .bigbox:not(.wide) p{color:var(--text);font-size:14px}
.bigbox:not(.wide) .go{color:var(--gold-ink)} .bigbox:not(.wide) .bicon{color:var(--ink)}
.bigbox:not(.wide):hover{border-color:var(--gold);transform:translateY(-2px)}
.bigbox:not(.wide) .bgfx svg *{stroke:var(--bgfx-stroke)}
.bigbox:not(.wide) .bgfx{opacity:.5}
/* D16: لا إمالة ولا توهج؛ رفع 2 بكسل مع ظل */
.bigbox:hover,.optcard:not(.lockedopt):hover,.tcard:hover,.ivpcard:hover{transform:translateY(-2px)!important;box-shadow:var(--shadow-lift)!important}
.bigbox .bicon,.bigbox:hover .bicon{transform:none!important}
/* D15: خامات أهدأ */
body.inner .pagebg{background:var(--paper)}
.pagebg::after{opacity:.025}
.lockbox,.optcard.lockedopt,.dbox.new{background-image:repeating-linear-gradient(45deg,transparent 0 14px,rgba(100,116,139,.035) 14px 28px);background-color:var(--grey-bg)}
.pane-new:not(.filled){background-image:repeating-linear-gradient(45deg,transparent 0 14px,rgba(100,116,139,.035) 14px 28px)}
/* D4: بطاقة رابط الفروقات في الباحث (كانت .ncard) */
.dcardlink{display:inline-block;font-size:13px;font-weight:700;color:var(--ink);background:var(--old-bg);border:1px solid var(--old-line);border-radius:var(--r-pill);padding:3px 11px;text-decoration:none;line-height:1.7}
.dcardlink:hover{background:var(--grey-bg);text-decoration:none}
.ncard{border-radius:11px}
/* D8: أرقام جدولية وعزل الرموز اللاتينية */
table,.cdays,.hcnum,.kpi b,.dstat .v,.phstat b,.tbadge,.htl-count,.wkdate,.sv1big{font-variant-numeric:tabular-nums}
bdi,.code{unicode-bidi:isolate}
/* D9: مكتبة الوثائق */
.libtable td .badge,.libtable td{white-space:normal}
.libtable td .badge{display:inline-block;line-height:1.7;height:auto;padding:3px 10px}
.libtable tbody tr:nth-child(even) td{background:var(--zebra)}
.libtable tbody tr:hover td{background:var(--old-bg)}
@media (max-width:760px){
  .libwrap{overflow:visible}
  .libtable{border:0;background:transparent;box-shadow:none;display:block}
  .libtable thead{display:none}
  .libtable tbody{display:block}
  .libtable tbody tr{display:block;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:6px 12px;margin-bottom:10px;box-shadow:var(--shadow-sm)}
  .libtable tbody tr[hidden]{display:none}
  .libtable td{display:block;border:0;padding:5px 0;white-space:normal}
  .libtable td::before{content:attr(data-label);display:block;font-size:13px;font-weight:700;color:var(--muted);margin-bottom:1px}
  .libtable td:not([data-label])::before{content:none}
  .libtable tbody tr:nth-child(even) td{background:transparent}
  .libtable tr#libempty td{padding:18px 6px}
}
/* D10: ترويسة الصفحات الداخلية: شريط لاصق واحد 64 بكسل */
body.inner header.site{display:none}
.tabsbar{background:var(--navy-900)}
.tabsbar .wrap{display:flex;align-items:center;gap:14px;min-height:64px}
.tbrand{color:#fff;font-size:16px;white-space:nowrap;text-decoration:none;display:inline-flex;align-items:center;gap:6px;flex:none}
.tbrand .hl{color:var(--gold)}
.tbrand:hover{text-decoration:none;color:#fff}
.tabsbar .tabs{flex:1 1 auto;justify-content:center;margin:0;padding:6px 0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;min-width:0}
.tabsbar .tabs::-webkit-scrollbar{display:none}
.tabsbar .tab{white-space:nowrap;flex:none;min-height:44px;display:inline-flex;align-items:center;gap:6px;font-size:14px}
.tbadge{flex:none;white-space:nowrap;font-size:13px;font-weight:700;color:var(--gold-soft);border:1px solid rgba(201,162,75,.5);border-radius:var(--r-pill);padding:5px 12px;background:rgba(201,162,75,.1)}
.tbadge:empty{display:none}
@media (max-width:880px){
  .tabsbar .wrap{gap:8px;padding:0 12px}
  .tbrand{font-size:14px}
  .tbadge{font-size:13px;padding:4px 9px}
  .tabsbar .tabs{justify-content:flex-start}
}
@media (max-width:600px){.tbadge{display:none}}
/* D12: وسوم بدل صناديق التظليل في العناوين؛ mark للباحث فقط */
h2 .tagl,h3 .tagl,h4 .tagl,.dhead h2 .tagl,.dhead h1 .tagl,.dhead h3 .tagl,.impT .tagl,.svchead .tagl,.cmprow .topic .tagl{font-size:13px;font-weight:700;padding:2px 10px;border-radius:var(--r-pill);vertical-align:middle;display:inline-block;line-height:1.7}
.tagl.b{background:var(--old-bg);color:var(--old);border:1px solid var(--old-line)}
.tagl.g{background:var(--new-bg);color:var(--new-ink);border:1px solid var(--new-line)}
.tagl.a{background:var(--amber-bg);color:var(--amber-ink);border:1px solid var(--gold-tint-line)}
.tagl.k{background:var(--grey-bg);color:var(--muted);border:1px dashed var(--muted)}
/* D13: وسم الأثر بنقطة ملوّنة */
.impv::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--muted);flex:none}
.impv.iv-a::before{background:var(--burg)} .impv.iv-b::before{background:var(--amber)} .impv.iv-k::before{background:var(--muted)}
/* D14: البطل */
.hlines i:nth-child(5){display:none}
.hlines i{--ll:rgba(127,163,200,.2)} .hlines i.g{--ll:rgba(201,162,75,.26)} .hlines i.b{--ll:rgba(127,177,232,.2)}
.tstrip{font-size:14px}
.hquick a{min-height:44px;display:inline-flex;align-items:center}
.hquick .hql{font:inherit;font-size:13px;font-weight:700;color:var(--on-dark);background:none;border:0;padding:0;cursor:default}
@media (max-width:640px){
  .hquick{gap:8px}
  .hquick .hql{cursor:pointer;color:#fff;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:var(--r-pill);padding:9px 14px;min-height:44px;display:inline-flex;align-items:center}
  .hquick .hql::after{content:"▾";content:"▾" / "";margin-inline-start:6px}
  .hquick:not(.open) a{display:none}
  .hquick.open .hql::after{content:"▴";content:"▴" / ""}
}
/* D17: الجوال */
@media (max-width:640px){
  .wrap{padding:0 12px}
  .dhead,.sec .kps,.cmprow,.dbox,.hitcard,.svcform,.coibox,.impcard,.ncard,.chartbox,.wkcard,.lockcard,.optcard,.tcard,.bigbox{padding-left:12px!important;padding-right:12px!important}
  .pane{padding:10px 12px}
  .imptbl,.imptbl tbody{display:block}
  .imptbl thead,.imptbl tr:first-child:has(th){display:none}
  .imptbl tr{display:block;border:1px solid var(--line);border-radius:var(--r-md);margin-bottom:10px;overflow:hidden}
  .imptbl td{display:block;border:0;border-top:1px solid var(--line);padding:9px 12px}
  .imptbl td:first-child{border-top:0}
  .imptbl td::before{content:attr(data-label);display:block;font-size:13px;font-weight:700;margin-bottom:2px}
  .imptbl td:first-child::before{color:var(--old)} .imptbl td:last-child::before{color:var(--new-ink)}
  .memwrap:has(> .memtbl),.memwrap:has(> .imptbl){overflow:visible}
  table.memtbl{min-width:0;display:block}
  .memtbl thead{display:none}
  .memtbl tbody{display:block}
  .memtbl tr{display:grid;grid-template-columns:1fr 1fr;gap:6px 10px;border:1px solid var(--line);border-radius:var(--r-md);padding:10px 12px;margin-bottom:10px;background:var(--surface)}
  .memtbl td{display:block;border:0;padding:0}
  .memtbl td::before{content:attr(data-label);display:block;font-size:13px;color:var(--muted);font-weight:700}
  .memtbl td:not([data-label])::before{content:none}
  .memtbl input[type=text],.memtbl select{width:100%}
  .memtbl td.ck{display:flex;align-items:center;gap:8px} .memtbl td.ck::before{display:inline;margin:0}
  .memtbl td:last-child{grid-column:1/-1;text-align:end}
  button,.btn,.chip,.tab,.phfbtn,.plnpre button,.fmode button,.copybtn,.runbtn,.addrow,.svcbtn,.jsel,.sortbtn{min-height:44px}
  .chip{padding-top:8px;padding-bottom:8px}
}
#fab.dn{opacity:0;transform:translateY(14px);pointer-events:none}
/* D18: الخدمات */
.toolgrid .soonrow{grid-column:1/-1;display:flex;align-items:center;gap:10px;padding:10px 14px;font-size:14px;color:var(--muted);background:var(--grey-bg);border:1px dashed var(--muted);border-radius:var(--r-sm)}
.toolgrid .soonrow h3{font-size:14px;color:var(--muted);margin:0}
.toolgrid .soonrow p{margin:0;font-size:14px}
/* D19: الرسوم البيانية */
.chunit{font-size:13px;color:var(--muted);margin:-4px 0 8px}
.srcline{font-size:13px;color:var(--muted);margin-top:8px}
/* D20: تمييز النص المعدّل في بطاقة المادة */
.pane-1448 u,u.wd-u{background:var(--ins-bg);text-decoration:underline;text-decoration-color:var(--new-ink);text-decoration-thickness:1.5px;text-underline-offset:2px;border-radius:2px}
/* D21: الطباعة */
@media print{
  @page{margin:14mm 12mm;@top-right{content:"مبادرة التحوّل لنظام المنافسات والمشتريات الحكومية الجديد";font-size:9pt;color:#5B6A7D} @bottom-center{content:counter(page) " / " counter(pages);font-size:9pt;color:#5B6A7D}}
  .tabsbar,#fab,.hquick{display:none!important}
}
/* AA: ذهبي على فاتح يستخدم gold-ink */
.bigbox:not(.wide) .go,.srcs a{color:var(--gold-ink)}

/* AA: تصحيحات تباين بعد الفحص */
.badge.summary,.wkrange,.wktag.wk-lib{background:var(--amber-bg)!important;color:var(--gold-ink)!important;border-color:var(--gold-tint-line)!important}
.hlines i b .lw{color:rgba(216,225,236,.9)}

/* ═══ v7.6: إصلاحات التدقيق + عناصر الواجهة الجديدة (css-styles) ═══ */
/* ── Focus rings with ≥3:1 on every surface (css#0, css#3, a11y#3, a11y#4, a11y#5) ── */
.tabsbar :focus-visible,.tstrip :focus-visible,.heroFloor :focus-visible{outline-color:var(--on-brand)} /* white on navy-900: 16.7:1 */
.libtable th :focus-visible,.memtbl th :focus-visible,.ptbl th:focus-visible{outline-color:var(--gold)} /* gold on the ink table header: 6.4:1 */
/* #fab and .totop float over the cream page and the navy footer: a two-tone ring works on both */
#fab:focus-visible,.totop:focus-visible{outline:3px solid var(--ink);outline-offset:2px;box-shadow:0 0 0 2px var(--surface),0 12px 30px -10px rgba(11,24,48,.5)}
#fab:focus-visible{opacity:1!important;transform:none!important;pointer-events:auto} /* a11y#5: never focusable while invisible */
:is(#app,header.site) [tabindex="-1"]:focus:not(:focus-visible){outline:none} /* route changes focus the title or the deep-link target */
/* v7.6.1: Safari/WebKit treats script focus after a tap as :focus-visible and drew a thick ring around every page title. These targets
   are not interactive (not in the tab order), so no ring is needed; deep-link cards still flash via .artflash. */
:is(#app,header.site) :is(h1,h2,h3)[tabindex="-1"]:focus{outline:none}
#app .sec[tabindex="-1"]:focus-visible,#app .artcard[tabindex="-1"]:focus-visible{outline-offset:4px;border-radius:var(--radius)}

/* ── Sticky tab bar: anchors, deep links and focused elements land below it (css#9, a11y#1, js-c#3, design-mobile#11) ── */
html:has(body.inner){scroll-padding-top:calc(var(--tabsbar-h) + 12px)}
body.inner .artcard,body.inner #app .sec[id^="d-"],body.inner .wkcard,body.inner #app{scroll-margin-top:calc(var(--tabsbar-h) + 14px)}
/* css#1, a11y#2, design-desktop#0: the sticky sidebar starts below the 65px tab bar */
@media (min-width:921px){body.inner aside.tl{top:calc(var(--tabsbar-h) + 14px);max-height:calc(100vh - var(--tabsbar-h) - 28px)}}
#tlnav a{scroll-margin-block:12px}
/* design-desktop#5: the sidebar heading is a section label, not a page title */
aside.tl h2.display{font-size:var(--fs-h4);line-height:1.5}
/* css#2: centred tabs between 881 and ~1090px clipped the first tab with no way to scroll to it; auto margins centre without clipping */
@media (min-width:881px){.tabsbar .tabs{justify-content:flex-start}.tabsbar .tab:first-child{margin-inline-start:auto}.tabsbar .tab:last-child{margin-inline-end:auto}}

/* ── Guide filters (js-a#0) and swipeable filter rows on phones (design-mobile#21) ── */
.ivgrid .ivpcard[hidden]{display:none}
@media (max-width:640px){
  .ivbar,.phbar{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:8px;margin-inline:-12px;padding-inline:12px;padding-bottom:2px;scroll-snap-type:x proximity}
  .ivbar::-webkit-scrollbar,.phbar::-webkit-scrollbar{display:none}
  .ivfbtn,.phfbtn{flex:none;scroll-snap-align:start}
}

/* ── Reading size on phones (design-mobile#3) and wide screens (design-desktop#14d) ── */
@media (max-width:640px){
  .pane,.pane.pane-new.filled,.trb p,.imptbl td,.lawq,.ncard .nq,.kps li,.chgcard li{font-size:15px;line-height:1.95}
  .pane .plabel{font-size:13px}
  .trb{flex-direction:column;gap:6px} /* design-mobile#23: the clause label sits above its text */
}
@media (min-width:1100px){.artcard .pane{font-size:15px;line-height:2}}

/* ── iOS focus zoom: every text control is ≥16px on phones (design-mobile#1) ── */
@media (max-width:760px){
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=button]):not([type=submit]),select,textarea{font-size:16px!important}
}

/* ── Touch targets (design-mobile#12, design-mobile#8, css#10, committee .del) ── */
@media (max-width:640px){
  #app .reftxt>summary,#app .alttbl>summary,#app .why>summary{padding-block:10px;min-height:44px}
  .segwrap{flex:1 1 100%}
  .segbtns{display:grid;grid-template-columns:1fr;width:100%}
  .segbtns button{text-align:start;padding:10px 14px;border-top:1px solid var(--line);min-height:44px}
  .segbtns button:first-child{border-top:0}
  .memtbl .del{min-height:44px;min-width:0;padding:0 14px;border:1px solid var(--danger);border-radius:var(--r-pill);font-size:14px;display:inline-flex;align-items:center}
}
.memtbl .del{font-family:inherit}
.memtbl .del:hover{text-decoration:underline}

/* ── Plan simulator buttons (design-desktop#8) ── */
#pRerun{background:transparent;color:var(--ink);border:1.5px solid var(--field-line);font-size:14px;padding:10px 22px}
#pRerun:hover{background:transparent;border-color:var(--ink)}

/* ── Motion (css#5, a11y#11, design-desktop#20, C3) ── */
html.motion-paused *,html.motion-paused *::before,html.motion-paused *::after{animation-play-state:paused!important}
html.motion-paused .hlines i b{opacity:0!important} /* no rotating card freezes half-faded; .hxfacts shows them instead */
html.motion-paused #app.vt{animation:none}
html.motion-paused{scroll-behavior:auto}
.tabsbar .ld{animation-iteration-count:2}
#app.vt{animation-duration:.18s}

/* ── Forced colours: keep the colour keys of charts and legends (css#23) ── */
@media (forced-colors:active){.replegend i,.lgdot,.repbar span,.dot,.tsl i,.ld{forced-color-adjust:none}}

/* ── Print (css#6, css#7, design-desktop#9, committee details.msec) ── */
@media print{
  .dchip,.artnum.after,.artnum.before,.refchip,.dnum,.libtable th,.memtbl th,.ptbl th,.gn,.tagl,.badge{background:none!important;color:var(--ink)!important;border:1px solid currentColor!important;box-shadow:none!important}
  .heroFloor{background:none!important;color:var(--ink)!important;border-color:var(--line)!important}
  .heroFloor *{color:var(--ink)!important}
  .trb,.dbox,.ncard,.kps li,.chgcard li,.hitcard,.wkitem,.impcard,.statcard,tr{break-inside:avoid}
  /* v7.6.1: comparison cards can be longer than a page (e.g. art. 43); keeping them whole pushed the first card to page 2 and left
     page 1 blank. Let them break between clauses, keep each clause/paragraph whole, and keep the card header with its text. */
  .cmprow{break-inside:auto}.cmprow .pane p,.cmprow .pane li,.cmprow .pane .cl{break-inside:avoid}.artcard>.arthead,.cmprow .ph{break-after:avoid}
  h2,h3,.dhead,.arthead{break-after:avoid}
  details.msec>summary::after{content:none!important}
  .totop,.themetog,.hxtools,.wdtog,.artjump,.libf-more,.recent-clear{display:none!important}
}

/* ── C2 theme toggle / C3 motion toggle (.themetog, .hxtools, .motiontog) ── */
.themetog{flex:none;width:36px;height:36px;display:inline-grid;place-items:center;padding:0;border-radius:50%;background:transparent;border:1.5px solid var(--gold);color:var(--gold);cursor:pointer;transition:background-color .15s,color .15s}
.themetog:hover{background:rgba(201,162,75,.16)}
.themetog[aria-pressed="true"]{background:var(--gold);color:var(--navy-900)}
.themetog .ic{width:16px;height:16px;vertical-align:0}
.hxtools{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin:-16px 0 8px}
.motiontog{font:inherit;font-size:13px;font-weight:700;line-height:1.4;color:var(--on-brand);background:transparent;border:1px solid rgba(255,255,255,.45);border-radius:var(--r-pill);padding:6px 14px;min-height:36px;cursor:pointer;transition:background-color .15s,border-color .15s,color .15s}
.motiontog:hover{border-color:var(--gold)}
.motiontog[aria-pressed="true"]{background:var(--gold);border-color:var(--gold);color:var(--navy-900)}
.motiontog[hidden]{display:none}
@media (min-width:881px){ /* top corner of the whole hero: hx-side is 1.05/1.55 = 67.74% of hx-main's width */
  .hxtools{position:absolute;top:16px;inset-inline-end:calc(24px - 67.74%);margin:0;z-index:3}
  /* v7.6.1: the tools sit over the side column, so the main column must stack ABOVE it (it was the same z-index and earlier in
     the DOM, so .hx-side covered the theme and motion buttons and swallowed every click). The side column is decorative only. */
  .hx-main{z-index:2}
  .hx-side{pointer-events:none}
}
@media (max-width:880px){.hxtools{margin:-10px 0 6px}}
@media (max-width:640px){.themetog{width:44px;height:44px}.motiontog{min-height:44px}}

/* ── C4 back to top ── */
.totop{position:fixed;bottom:24px;inset-inline-start:16px;z-index:60;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;padding:0;background:var(--navy-900);border:1.5px solid var(--gold);color:var(--gold);box-shadow:var(--shadow-sm),0 10px 24px -12px rgba(11,24,48,.55);cursor:pointer}
.totop:hover{background:var(--navy-700)}
.totop[hidden]{display:none}
.totop .ic{width:20px;height:20px;vertical-align:0}

/* ── Tabs on phones: all six visible as icon + short label (design-mobile#2) ── */
@media (max-width:480px){
  .tabsbar .tbrand{display:none}
  .tabsbar .wrap{padding:0 6px;gap:6px}
  .tabsbar .tabs{mask-image:none;-webkit-mask-image:none;gap:2px;width:100%;overflow:visible;padding:4px 0;scroll-snap-type:none}
  .tabsbar .tab{flex:1 1 0;min-width:0;flex-direction:column;justify-content:center;gap:1px;padding:4px 1px;font-size:12px;line-height:1.3;min-height:52px;border-radius:9px}
  .tabsbar .tab::after{bottom:3px;inset-inline:10px}
  .tabsbar .tl-full{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .tabsbar .tl-short{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}

/* ── Hero: radio fieldset (a11y#26) and static key-change list (design-desktop#3) ── */
fieldset.hsopt{border:0;margin:0;padding:0;min-width:0}
.hxfacts{width:100%;max-width:460px;margin:0 auto}
.hxf-h{font-size:13px;font-weight:700;color:var(--gold);margin:0 0 10px}
.hxf-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.hxf{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px 10px;align-items:start;padding:9px 13px 10px;border-radius:12px;background:rgba(9,20,40,.66);border:1px solid rgba(255,255,255,.14);border-inline-start:3px solid var(--gold-soft)}
.hxf:nth-child(even){border-inline-start-color:var(--blue-on-dark)}
.hxf .lk{grid-row:1/3;align-self:start;font-size:13px;font-weight:700;color:var(--gold-soft);background:rgba(201,162,75,.16);border:1px solid rgba(201,162,75,.5);border-radius:999px;padding:1px 9px;line-height:1.6;white-space:nowrap}
.hxf .lt{font-size:14px;line-height:1.6;font-weight:700;color:var(--on-brand);text-wrap:balance}
.hxf .lt em{font-style:normal;color:var(--gold-soft);white-space:nowrap}
.hxf .lw{font-size:13px;line-height:1.6;font-weight:700;color:rgba(216,225,236,.9)}

/* ── Latest-update link in the strip under the header ── */
.tsl.upd{display:inline-flex;align-items:center;gap:6px;max-width:100%;min-width:0}
.tsl.upd .tsu{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}

/* ── Counters keep their real value in the DOM; hidden on screen until the count-up starts (a11y#7) ── */
@media screen{[data-cv]:not([data-cd]){color:transparent!important}} /* !important: some counters carry an inline status colour */

/* ── Library: filter and sort panel ── */
.libfilters{display:grid;gap:10px;margin:14px 0 10px;padding:12px 14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-sm)}
.libf-main{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.libf-q{flex:1 1 280px}
.libf-sort{flex:0 1 220px}
.libf-extra{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px 10px}
.libf-field{display:flex;flex-direction:column;gap:4px;min-width:0}
.libf-lbl{font-size:13px;font-weight:700;color:var(--muted)}
.libfilters .fltr{width:100%;min-width:0;min-height:40px;padding:6px 10px;border:1px solid var(--field-line);border-radius:var(--r-sm);background:var(--surface);color:var(--ink);font:inherit;font-size:14px}
.libfilters .fltr:focus-visible{outline:2px solid var(--old);outline-offset:1px}
.libf-more{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px}
.libf-more[aria-expanded="true"]{background:var(--sel-bg);border-color:var(--sel-bg);color:var(--sel-fg)}
.libf-n{font-weight:700;color:var(--gold-ink)}
.libf-n:empty{display:none}
.libf-more[aria-expanded="true"] .libf-n{color:var(--sel-sub)}
.libf-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--muted);border-top:1px dashed var(--line);padding-top:8px}
.libf-count{display:inline-flex;align-items:center;gap:6px}
#libcount{font-weight:700;color:var(--ink)}
@media (min-width:761px){.libf-more{display:none}}
@media (max-width:760px){
  .libfilters{padding:10px 12px}
  .libf-q{flex:1 1 100%}
  .libf-sort,.libf-more{flex:1 1 0;min-width:0}
  .libf-more{min-height:44px}
  .libfilters:not(.open) .libf-extra{display:none}
  .libf-extra{grid-template-columns:1fr 1fr}
  .libf-extra .libf-field:first-child{grid-column:1/-1}
  .libfilters .fltr{min-height:44px}
}
/* five status tones (design-desktop#2); badges that wrap stay rectangles */
.libtable td .badge{border-radius:var(--r-sm)}
.badge.st-ok{background:var(--new-bg);color:var(--new-ink);border-color:var(--new-line)}
.badge.st-next{background:var(--surface);color:var(--brand-ink);border:1px dashed var(--brand-ink)}
.badge.st-old{background:var(--grey-bg);color:var(--muted);border-color:var(--line)}
.badge.st-info{background:var(--surface);color:var(--text);border-color:var(--line)}
.libtable td .badge.libdead{font-size:13px;margin-inline-start:4px;vertical-align:1px}
.libhost{display:inline-block;font-size:13px;font-weight:400;line-height:1.6;color:var(--muted);white-space:nowrap;border:1px dashed var(--field-line);border-radius:4px;padding:0 6px;unicode-bidi:isolate;vertical-align:1px}
@media (min-width:761px){.libtable td[data-label="المرجع"]{max-width:34ch}}
/* weekly report: always-visible freshness line */
.wkupd{margin:0;padding:0 16px 12px;font-size:13px;color:var(--ink2);background:var(--zebra);display:flex;gap:6px;align-items:baseline;flex-wrap:wrap}
.wkupd .ic{align-self:center}
.wkupd.stale{color:var(--amber-ink);background:var(--amber-bg);border-top:1px solid var(--gold-tint-line);padding-top:8px}
.wkupd-date{font-weight:700}
.wkvia{font-weight:400;color:var(--muted);font-size:13px}

/* ── Recently viewed (C1): landing and 404 ── */
.recent{margin:28px 0 8px}
#app .recent h2.display{font-size:var(--fs-h3);margin:0 0 10px}
.recent-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.recent-item{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:10px 14px;box-shadow:var(--shadow-sm);min-width:0}
.recent-item a{font-weight:700;color:var(--navy);min-height:24px;display:inline-flex;align-items:center;min-width:0}
.recent-item a:hover{color:var(--old)}
.recent-kind{flex:none;font-size:13px;font-weight:700;background:var(--amber-bg);color:var(--gold-ink);border-radius:999px;padding:1px 9px;line-height:1.7}
.recent-clear{margin-top:10px;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 15px;font:inherit;font-size:13px;color:var(--ink2);cursor:pointer}
.recent-clear:hover{border-color:var(--old)}
#app .dhead+.recent,#app .dhead~.recent{margin-top:18px}
@media (max-width:760px){.recent-list{grid-template-columns:1fr}.recent-clear{min-height:44px}}

/* ── Diff pages: word diff and its toggle (design-desktop#14) ── */
del.wd-del{background:var(--del-bg);color:inherit;text-decoration:line-through;text-decoration-color:var(--del-strike);border-radius:3px;padding:0 2px}
ins.wd-ins{background:var(--ins-bg);color:inherit;text-decoration:none;border-bottom:1.5px solid var(--new-ink);border-radius:3px;padding:0 2px}
.wdbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:10px}
.wdtog{font:inherit;font-size:13px;font-weight:700;border:1.5px solid var(--field-line);background:var(--surface);color:var(--ink2);border-radius:999px;padding:6px 14px;min-height:36px;cursor:pointer}
.wdtog:hover{border-color:var(--ink)}
.wdtog[aria-pressed="true"]{background:var(--sel-bg);border-color:var(--sel-bg);color:var(--sel-fg)}
.wdtog[aria-pressed="true"]::before{content:"\2713";content:"\2713" / "";margin-inline-end:6px;color:var(--sel-sub)}
.wdleg{font-size:13px;color:var(--muted);line-height:1.9}
/* fasl page: jump bar and card header */
nav.artjump{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
nav.artjump a.chip{font-size:13px;padding:4px 10px;text-decoration:none;color:var(--ink2);line-height:1.6}
nav.artjump a.chip:hover{border-color:var(--old);color:var(--old)}
@media (max-width:640px){
  nav.artjump{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-12px;padding:0 12px 2px;mask-image:linear-gradient(to right,transparent,#000 16px,#000 calc(100% - 16px),transparent);-webkit-mask-image:linear-gradient(to right,transparent,#000 16px,#000 calc(100% - 16px),transparent)}
  nav.artjump::-webkit-scrollbar{display:none}
  nav.artjump a.chip{flex:none;min-height:40px;display:inline-flex;align-items:center}
  /* the card identity stays visible under the tab bar while reading a long article */
  .arthead{position:sticky;top:var(--tabsbar-h);z-index:5;background:var(--surface);margin:-6px -12px 12px!important;padding:8px 12px;border-bottom:1px solid var(--line)}
  .arthead>.artnums{order:-1}
  .arthead .artnum{flex-direction:row;align-items:baseline;gap:6px;padding:3px 10px;line-height:1.5} /* one line keeps the stuck header short */
  .arthead .artnum b{font-size:15px}
  .arthead{row-gap:6px!important}
}
/* #/diff/law: legend chips and stat tiles are filters (design-desktop#22) */
.dfilter a.dchip{text-decoration:none;min-height:32px;transition:transform .15s,box-shadow .15s}
.dfilter a.dchip:hover{text-decoration:none;transform:translateY(-1px);box-shadow:var(--shadow-sm)}
.dfilter a.dchip[aria-current="true"]{outline:2px solid var(--gold);outline-offset:2px}
@media (max-width:640px){.dfilter a.dchip{min-height:44px}}
a.dstat{display:block;color:var(--ink);text-decoration:none;transition:border-color .15s,transform .15s,box-shadow .15s}
a.dstat:hover{border-color:var(--old);transform:translateY(-1px);box-shadow:var(--shadow);text-decoration:none}
a.dstat[aria-current="true"]{border-color:var(--gold);box-shadow:inset 0 0 0 1px var(--gold),var(--shadow-sm)}
/* unchanged-article chips are neutral links (design-desktop#10) */
.samechip{background:var(--grey-bg);border-color:var(--line);color:var(--ink)}
a.samechip{text-decoration:none}
a.samechip:hover,a.samechip:focus-visible{border-color:var(--old);text-decoration:none}
.dsrc-old{font-weight:700;color:var(--muted);font-size:13px}
/* #/search scope radios (design-desktop#21) */
.fscope{display:flex;flex-wrap:wrap;gap:8px 18px;margin:2px 0 16px;font-size:14px}
.fscope label{display:inline-flex;align-items:center;gap:6px;cursor:pointer;min-height:36px}
.fscope input[type=radio]{accent-color:var(--navy);width:16px;height:16px;margin:0}
@media (max-width:640px){.fscope label{min-height:44px}}

/* ── Committee service ── */
.memtbl .cklbl{display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;min-height:24px;min-width:24px}
.chkl input{width:18px;height:18px;flex:none}
#app input[type=range]{height:24px}
@media (min-width:641px){.memtbl .cklbl .cktx{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}}
@media (max-width:640px){.memtbl .cklbl{min-height:44px;font-size:13px;font-weight:700;color:var(--ink2)}}
.sv1undo{margin-inline-start:10px;font-size:13px;color:var(--muted)}
.sv1undo:empty{display:none}
.undobtn{font:inherit;font-size:13px;font-weight:700;color:var(--gold-ink);background:transparent;border:1px solid var(--gold);border-radius:var(--r-pill);padding:4px 12px;margin-inline-start:4px;cursor:pointer}
.undobtn:hover{background:var(--amber-bg)}
details.msec>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px;cursor:pointer}
details.msec>summary::-webkit-details-marker{display:none}
details.msec>summary h3.display{margin:0;display:flex;align-items:center;gap:10px}
details.msec>summary::after{content:"\25be";content:"\25be" / "";flex:none;color:var(--gold-ink);font-size:18px;line-height:1}
details.msec[open]>summary::after{content:"\25b4";content:"\25b4" / ""}
details.msec[open]>summary{margin-bottom:12px}
@media print{details.msec>*{display:block!important}}

/* ── Plan service: scrollable charts on phones (js-b#9) and small notes ── */
.tnote{font-size:13px;line-height:1.8;color:var(--muted)}
.chartbox .chscroll:focus-visible{outline-offset:2px}
@media (max-width:600px){
  .chartbox .chscroll{overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;padding-bottom:4px}
  .chartbox .chscroll>svg{min-width:860px}
}

/* ═══ v7.6b: صقل التصميم — شبكة البطل، نظام البطاقات والوسوم، إطار القراءة (css-polish) ═══ */
/* Scale used below (existing tokens + one radius): --r-lg feature cards (navy, home entries) · --r-md content cards · --r-sm items
   nested in a card · --r-pill tags, badges and filter pills. --measure ≈ 75–80 Arabic characters per line at any font size. */
:root{--r-lg:16px;--measure:32em;--measure-list:40em} /* --measure-list (css-fix): boxed short items, ≈95 characters */

/* ── Home hero on the 1080px page grid (design-desktop#4) ──
   The navy background stays full-bleed; the two columns sit inside the same frame as .wrap, so the title, CTAs and search line up
   with the cards below. .hlines (inset:0 on the padding box) keeps its full-bleed stage, so heroFit() and the rotating cards are
   unchanged; the 48px inner gap keeps those cards clear of the text column (measured at 900–1920px). */
@media (min-width:881px){
  .heroX{padding-inline:max(0px,calc((100% - 1080px)/2))}
  .hx-main{padding-inline:20px 48px}
  .htl{padding-inline:20px}
  .hxtools{inset-inline-end:calc(20px - 67.74%)} /* top corner of the frame, on the .wrap content edge */
}
@media (min-width:1440px){ /* from here the rotating cards end at x≈585 (1440 wide; further left on wider screens), so the text
  column can take 1.75fr and still keep about 20px clear of them: the quick paths and the two law pills stay on one row each, as in the
  full-bleed hero, and the hero keeps its height */
  .heroX{grid-template-columns:1.75fr 1fr}
  .hx-main{padding-inline:20px 24px}
  .hquick a{padding-inline:10px}
  .hxtools{inset-inline-end:calc(20px - 57.14%)} /* side = 1/1.75 of the main column */
}

/* ── Card system: one radius per level, one shadow for static cards (design-desktop#16) ── */
.goal,.optcard,.tcard,.floorbox{border-radius:var(--r-lg)}
.statcard,.sv1sum,.lockbox,.kpi,.chartbox,.ncard,.coibox,.heroFloor{border-radius:var(--r-md)}
.kps li,.chgcard li,.wkitem,.wkweek,.chkl li,.valrow,.phstat,.nstat,.pane,.lawq,.ncard .nq,.artnum,.trn,.samechip{border-radius:var(--r-sm)}
.kps,.cmprow,.chgcard,.best,.xintro,.impcard,.wkcard{box-shadow:var(--shadow-sm),inset 0 1px 0 var(--hi-inset)}
/* Accent bars: a coloured inline-start border on a rounded box thins into the corners, so that side is square (design-desktop#12) */
.pane-old,.pane-1448,.pane-cur,.pane-new.filled,.lawq,.trb,.chgcard,.chgcard li,.best,.ncard,.ncard .nq{border-start-start-radius:0;border-end-start-radius:0}
/* Home entry cards: the gold accent is a straight bar between the rounded corners (an inset shadow still curved and
   disappeared on hover, when the lift shadow replaced it) */
.bigbox:not(.wide)::before{content:"";position:absolute;top:-1px;inset-inline:var(--r-lg);height:3px;border-radius:0 0 3px 3px;background:var(--gold);pointer-events:none}

/* ── Tags and badges: one size, weight and shape (status colours stay per class) ── */
.badge,.tagl,.wktag,.recent-kind,.svcbadge,.wkrange,.optlockchip{font-size:13px;font-weight:700;line-height:1.7;padding:2px 10px;border-radius:var(--r-pill)}
/* ── Filter pills: same height, border and states on every page (guide, search, plan presets) ── */
.ivfbtn,.phfbtn,.fflt button,.plnpre button,.fmode button{display:inline-flex;align-items:center;gap:4px;min-height:34px;padding:0 14px;border:1.5px solid var(--line);border-radius:var(--r-pill);font-family:inherit;font-size:13px;font-weight:700;line-height:1.4}
:is(.ivfbtn,.phfbtn,.fflt button,.plnpre button,.fmode button):not(.on):hover{border-color:var(--field-line);color:var(--ink)}
.ivfbtn b,.phfbtn b,.plnpre button b{margin-inline-start:2px}
@media (max-width:640px){.ivfbtn,.phfbtn,.fflt button,.plnpre button,.fmode button{min-height:44px}}

/* ── One page-header pattern on inner routes (design-desktop#7) ──
   Icons next to the 30px titles were 16px (20px on the services); the services banner was the only navy header. */
.dhead h1>.ic,.dhead h2>.ic{width:24px;height:24px;flex:none;color:var(--gold-ink)}
.toolshero{color:var(--text);border:1px solid var(--line);border-radius:var(--r-md);padding:22px 24px;margin:24px 0 18px;
  background:linear-gradient(90deg,rgba(201,162,75,0) 4%,rgba(201,162,75,.5) 50%,rgba(201,162,75,0) 96%) top/100% 2px no-repeat,
    linear-gradient(180deg,var(--surface) 0%,var(--card-end) 100%) var(--surface);
  box-shadow:var(--shadow-sm),inset 0 1px 0 var(--hi-inset)}
.toolshero .tlabel{color:var(--gold-ink);font-weight:700;font-size:13px}
.toolshero h1,.toolshero h2{font-size:22px;color:var(--ink);margin:2px 0 0}
.toolshero p{font-size:var(--fs-body);line-height:1.85;color:var(--text);max-width:760px;margin-top:8px}
@media (max-width:640px){.toolshero{padding:22px 12px}}

/* ── Reading frame for legal text and prose (design-desktop#11, design-desktop#14d) ──
   Article and clause texts are 15px with line-height 2 at every width; prose stops at --measure. */
.pane:not(.pane-new),.pane-new.filled,.lawq,.trb p{font-size:15px;line-height:2}
#app .sec>p:not(.xintro):not(.samenote){max-width:var(--measure)}
/* Boxed text keeps its box full width and caps only the text (as .trb): the privacy clauses fill their panel instead of a
   half-empty one; the framed transition intro (.xintro, two lines) stays full width as before */
.kps>ul>li{font-size:15px;line-height:2;padding-inline-end:max(12px,calc(100% - var(--measure-list) - 30px))}

/* ── Phone, tablet and small-laptop tab bar: all six sections as icon + short label up to 1099px; between 481 and 1099px the
   full-label row did not fit and scrolled behind a fade, so three or four sections were out of sight (design-mobile#2) ── */
@media (min-width:481px) and (max-width:1099px){
  .tabsbar .tabs{mask-image:none;-webkit-mask-image:none;gap:4px;overflow:visible;padding:4px 0;scroll-snap-type:none}
  .tabsbar .tab{flex:1 1 0;min-width:0;flex-direction:column;justify-content:center;gap:1px;padding:4px 2px;font-size:12px;line-height:1.3;min-height:52px;border-radius:9px}
  .tabsbar .tab::after{bottom:3px;inset-inline:10px}
  .tabsbar .tl-full{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .tabsbar .tl-short{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
@media (min-width:481px) and (max-width:640px){.tabsbar .tbrand{display:none}}

/* ═══ DARK THEME (css-dark) ══════════════════════════════════════════════════════════════════════════════════════════
   One dark palette, written as two IDENTICAL token blocks:
     (A) :root[data-theme="dark"]                          the visitor chose dark (theme.js / the .themetog toggle);
     (B) prefers-color-scheme:dark + :root:not([data-theme="light"])   no choice stored, so the system setting applies.
   Both are wrapped in @media screen, so printing always uses the light palette (light values live in the v7.5 :root block).
   Navy header, tab bar, footer and navy feature cards keep their light colours: on the near-black page they read as navy
   blocks with their gold rules. Every rule in the stylesheet takes its colours from these tokens; the rules after the
   blocks map the colours that JS writes into SVG attributes and inline styles onto the same tokens.
   Contrast (WCAG 2.x relative luminance, computed for every token pair): body text ≥9.7:1 and captions ≥5.9:1 on every dark surface,
   status inks ≥7:1 on their tints, white on fills ≥4.9:1, field borders ≥3.5:1, focus ring ≥7.7:1. ── */
@media screen{
  /* DARK THEME — (A) the visitor chose dark */
  :root[data-theme="dark"]{
    /* surfaces and text */
    --paper:#0B0F14; /* page */
    --surface:#141B24; /* cards, fields */
    --zebra:#19212C; /* alt rows, nested blocks */
    --grey-bg:#1D2632; /* neutral tint, scrollbar track */
    --line:#2C3846; /* hairlines */
    --ink:#E6ECF3; /* 14.6:1 on cards, >=12.8:1 on every surface */
    --text:#C5CFDB; /* 11.0:1 on cards, >=9.7:1 */
    --muted:#94A3B5; /* 6.7:1 on cards, >=5.9:1 */
    --field-line:#66778C; /* field borders 3.8:1 on cards, 4.2:1 on the page */
    --field-bg:var(--surface); /* fields without their own background */
    --ink2:var(--text);
    --navy:var(--ink); /* text only; navy fills use --brand */
    --locked:var(--muted);
    --locked-bg:var(--grey-bg);
    --ink3:#B4C1D0;
    /* brand: navy blocks keep their light values; fills that sat on the page get a lighter navy */
    --navy-900:#0F1E33;
    --navy-700:#1F3A5F;
    --brand:#24426A; /* white text 10.2:1 */
    --brand-hover:#2D5283;
    --brand-ink:#A9C4E4;
    --brand-gold:#E2C27A; /* gold text on --brand 5.9:1 */
    --on-brand:#FFFFFF;
    --on-brand-line:#DDE4EB;
    --on-brand-hi:#EDF3FA;
    --on-gold:#14263B;
    --on-dark:#AFC0D3;
    --on-dark-soft:#D8E1EC;
    --sel-bg:#C9A24B; /* selected pill = gold, 7.1:1 against the card */
    --sel-fg:#0F1E33; /* 7.0:1 */
    --sel-sub:#4A3810; /* 4.7:1 */
    /* gold accent */
    --gold:#C9A24B;
    --gold-ink:#E2C27A; /* 10.0:1 */
    --gold-soft:#E8D9AE; /* text on navy */
    --gold-hover:#D8B45F;
    --gold-line:#B08E3E; /* gold field border 5.6:1 */
    --gold-tint:#3A3019;
    --gold-tint-line:#6E5A2C;
    --mark-bg:#5E4B1C; /* ink on it 7.0:1 */
    /* 1448 green / 1440 blue */
    --new:#5CC492;
    --new-ink:#8FD6AE; /* 10.1:1 */
    --new-bg:#0F2820;
    --new-line:#24593F;
    --new-on-dark:#8FD6AE;
    --new-fill:#1B7A53; /* white 5.3:1 */
    --old:#7FB1E8; /* 7.7:1, also the focus ring */
    --old-bg:#13233A;
    --old-line:#2C4B73;
    --blue-on-dark:#7FB1E8;
    /* status */
    --amber:#E0A84E;
    --amber-ink:#EBC27C;
    --amber-bg:#2A2112;
    --amber-fill:#9A6516; /* white 4.9:1 */
    --burg:#9E3444; /* fill, white 6.9:1 */
    --burg-bg:#2C1519;
    --burg-ink:#F2A0A0;
    --danger:#FF8A80;
    --danger-bg:#2E1719;
    --danger-line:#6E3232;
    --danger-on-dark:#FF8A80;
    /* depth and decoration */
    --dash-line:#55687F;
    --card-end:rgba(8,11,16,.28);
    --hi-inset:rgba(255,255,255,.035);
    --sheen:rgba(255,255,255,.025);
    --shadow:0 1px 1px rgba(0,0,0,.3),0 4px 9px -4px rgba(0,0,0,.35),0 18px 38px -18px rgba(0,0,0,.6);
    --shadow-sm:0 1px 1.5px rgba(0,0,0,.3),0 6px 16px -9px rgba(0,0,0,.45);
    --shadow-lift:0 2px 3px rgba(0,0,0,.3),0 9px 18px -7px rgba(0,0,0,.45),0 28px 54px -22px rgba(0,0,0,.7);
    --shadow-card:0 1px 2px rgba(0,0,0,.3),0 10px 24px -14px rgba(0,0,0,.55);
    --bgfx-stroke:rgba(230,236,243,.2);
    --ins-bg:rgba(143,214,174,.17);
    --del-bg:rgba(255,138,128,.15);
    --del-strike:rgba(255,138,128,.8);
    --scroll-thumb:#3A4D66;
    --page-top:#11161D; /* top of the landing background (light: the amber tint) */
    --chart-grey:#66778C;
    --chart-empty:#2C3846;
    --chart-navy:#A9B8CC; /* Gantt navy bars: 8.6:1 on cards, dE>=21 against the grey/blue/gold/green segments (was --ink, near-white) */
    --rep-amber:#D9822B; /* committee 'فني': dE 24.8 against gold 'مشتريات' (--amber #E0A84E was dE 8.6), 5.9:1 on cards */
    color-scheme:dark;
  }
}
@media screen and (prefers-color-scheme:dark){
  /* DARK THEME — (B) system preference, unless the visitor chose light (identical to block A) */
  :root:not([data-theme="light"]){
    /* surfaces and text */
    --paper:#0B0F14; /* page */
    --surface:#141B24; /* cards, fields */
    --zebra:#19212C; /* alt rows, nested blocks */
    --grey-bg:#1D2632; /* neutral tint, scrollbar track */
    --line:#2C3846; /* hairlines */
    --ink:#E6ECF3; /* 14.6:1 on cards, >=12.8:1 on every surface */
    --text:#C5CFDB; /* 11.0:1 on cards, >=9.7:1 */
    --muted:#94A3B5; /* 6.7:1 on cards, >=5.9:1 */
    --field-line:#66778C; /* field borders 3.8:1 on cards, 4.2:1 on the page */
    --field-bg:var(--surface); /* fields without their own background */
    --ink2:var(--text);
    --navy:var(--ink); /* text only; navy fills use --brand */
    --locked:var(--muted);
    --locked-bg:var(--grey-bg);
    --ink3:#B4C1D0;
    /* brand: navy blocks keep their light values; fills that sat on the page get a lighter navy */
    --navy-900:#0F1E33;
    --navy-700:#1F3A5F;
    --brand:#24426A; /* white text 10.2:1 */
    --brand-hover:#2D5283;
    --brand-ink:#A9C4E4;
    --brand-gold:#E2C27A; /* gold text on --brand 5.9:1 */
    --on-brand:#FFFFFF;
    --on-brand-line:#DDE4EB;
    --on-brand-hi:#EDF3FA;
    --on-gold:#14263B;
    --on-dark:#AFC0D3;
    --on-dark-soft:#D8E1EC;
    --sel-bg:#C9A24B; /* selected pill = gold, 7.1:1 against the card */
    --sel-fg:#0F1E33; /* 7.0:1 */
    --sel-sub:#4A3810; /* 4.7:1 */
    /* gold accent */
    --gold:#C9A24B;
    --gold-ink:#E2C27A; /* 10.0:1 */
    --gold-soft:#E8D9AE; /* text on navy */
    --gold-hover:#D8B45F;
    --gold-line:#B08E3E; /* gold field border 5.6:1 */
    --gold-tint:#3A3019;
    --gold-tint-line:#6E5A2C;
    --mark-bg:#5E4B1C; /* ink on it 7.0:1 */
    /* 1448 green / 1440 blue */
    --new:#5CC492;
    --new-ink:#8FD6AE; /* 10.1:1 */
    --new-bg:#0F2820;
    --new-line:#24593F;
    --new-on-dark:#8FD6AE;
    --new-fill:#1B7A53; /* white 5.3:1 */
    --old:#7FB1E8; /* 7.7:1, also the focus ring */
    --old-bg:#13233A;
    --old-line:#2C4B73;
    --blue-on-dark:#7FB1E8;
    /* status */
    --amber:#E0A84E;
    --amber-ink:#EBC27C;
    --amber-bg:#2A2112;
    --amber-fill:#9A6516; /* white 4.9:1 */
    --burg:#9E3444; /* fill, white 6.9:1 */
    --burg-bg:#2C1519;
    --burg-ink:#F2A0A0;
    --danger:#FF8A80;
    --danger-bg:#2E1719;
    --danger-line:#6E3232;
    --danger-on-dark:#FF8A80;
    /* depth and decoration */
    --dash-line:#55687F;
    --card-end:rgba(8,11,16,.28);
    --hi-inset:rgba(255,255,255,.035);
    --sheen:rgba(255,255,255,.025);
    --shadow:0 1px 1px rgba(0,0,0,.3),0 4px 9px -4px rgba(0,0,0,.35),0 18px 38px -18px rgba(0,0,0,.6);
    --shadow-sm:0 1px 1.5px rgba(0,0,0,.3),0 6px 16px -9px rgba(0,0,0,.45);
    --shadow-lift:0 2px 3px rgba(0,0,0,.3),0 9px 18px -7px rgba(0,0,0,.45),0 28px 54px -22px rgba(0,0,0,.7);
    --shadow-card:0 1px 2px rgba(0,0,0,.3),0 10px 24px -14px rgba(0,0,0,.55);
    --bgfx-stroke:rgba(230,236,243,.2);
    --ins-bg:rgba(143,214,174,.17);
    --del-bg:rgba(255,138,128,.15);
    --del-strike:rgba(255,138,128,.8);
    --scroll-thumb:#3A4D66;
    --page-top:#11161D; /* top of the landing background (light: the amber tint) */
    --chart-grey:#66778C;
    --chart-empty:#2C3846;
    --chart-navy:#A9B8CC; /* Gantt navy bars: 8.6:1 on cards, dE>=21 against the grey/blue/gold/green segments (was --ink, near-white) */
    --rep-amber:#D9822B; /* committee 'فني': dE 24.8 against gold 'مشتريات' (--amber #E0A84E was dE 8.6), 5.9:1 on cards */
    color-scheme:dark;
  }
}
/* Fields without their own background: UA white in light, the card colour in dark (zero specificity, so every rule wins) */
:where(input:not([type=checkbox],[type=radio],[type=range],[type=button],[type=submit],[type=reset],[type=color],[type=file]),select,textarea){background-color:var(--field-bg,Field)}
/* JS-built charts and inline colours (service-plan.js, service-committee.js, diff-search.js, core.js). Each hex is mapped to
   the token whose light value is that same hex, so the light theme is unchanged and the dark theme follows. CSS fill/stroke
   beat SVG presentation attributes; inline style="" needs !important. */
.chartbox svg [fill="#2F3D4F" i]{fill:var(--text)}
.chartbox svg [fill="#5B6A7D" i]{fill:var(--muted)}
.chartbox svg text[fill="#14263B" i]{fill:var(--ink)}
.chartbox svg :not(text)[fill="#14263B" i]{fill:var(--chart-navy)}
.chartbox svg [fill="#8C5A12" i]{fill:var(--amber-ink)}
.chartbox svg [fill="#1E5FA8" i]{fill:var(--old)}
.chartbox svg [fill="#B33A3A" i]{fill:var(--danger)}
.chartbox svg [fill="#B7791F" i]{fill:var(--amber)}
.chartbox svg [stroke="#B7791F" i]{stroke:var(--amber)}
.chartbox svg [fill="#0B8A5C" i]{fill:var(--new)}
.chartbox svg [fill="#94A8BF" i]{fill:var(--chart-grey)}
.replegend i[style*="#14263B" i]{background:var(--chart-navy)!important}
.replegend i[style*="#94A8BF" i]{background:var(--chart-grey)!important}
:is(.repbar span,.replegend i)[style*="#1E5FA8" i]{background:var(--old)!important}
:is(.repbar span,.replegend i)[style*="#0B8A5C" i]{background:var(--new)!important}
:is(.repbar span,.replegend i)[style*="#B7791F" i]{background:var(--rep-amber)!important}
.repbar span[style*="#E7ECF1" i]{background:var(--chart-empty)!important}
.tagl[style*="#FBECEC" i]{background:var(--danger-bg)!important;color:var(--danger)!important;border-color:var(--danger-line)!important}
.refchip[style*="background:#fff" i]{background:var(--surface)!important}
/* diff-search.js DS_TONE writes navy-700 / burg as inline text colours; the count-up hiding rule ([data-cv]) still wins */
.dstat-mod .v:not([data-cv]:not([data-cd])){color:var(--brand-ink)!important}
.dstat-del .v:not([data-cv]:not([data-cd])){color:var(--burg-ink)!important}
/* service-plan.js sets #pSumW style.color from JS (serialised as rgb()) */
#pSumW[style*="rgb(11, 106, 72)"]{color:var(--new-ink)!important}
#pSumW[style*="rgb(179, 58, 58)"]{color:var(--danger)!important}
/* .themetog: moon (switch to dark) in light, sun (switch back to light) on a gold disc in dark; navy surroundings in both */
.themetog{--sun-ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4'/%3E%3C/svg%3E");outline-offset:2px}
.themetog[aria-pressed="true"]:hover{background:var(--gold-soft);border-color:var(--gold-soft)}
.themetog[aria-pressed="true"] .ic{display:none}
.themetog[aria-pressed="true"]::before{content:"";width:18px;height:18px;background:currentColor;-webkit-mask:var(--sun-ic) center/contain no-repeat;mask:var(--sun-ic) center/contain no-repeat}
@media (forced-colors:active){.themetog[aria-pressed="true"]::before{forced-color-adjust:none;background:ButtonText}}

/* ═══ css-fix (wp5): QA fixes from qa-light / qa-dark ══════════════════════════════════════════════════════════════════ */
/* Back to top: below 1200px the page margin is narrower than the button, so at the start side (right) it covered the first
   words of right-aligned lines, checkboxes and the footer photo. It now stacks 10px above #fab in the inline-end (left)
   corner, where RTL lines end ragged; #fab is 58px tall at bottom 24px, and both can show at once (boot.js) */
@media (max-width:1199px){
  .totop{inset-inline-start:auto;inset-inline-end:24px;bottom:92px;transition:bottom .2s}
  #fab:is(.dn,.lo,[hidden])+.totop{bottom:24px} /* boot.js inserts .totop right after #fab: drop into its place while it is hidden */
}
@media (max-width:640px){
  .totop{inset-inline-end:26px;width:44px;height:44px} /* centred over the 48px phone #fab */
  /* the phone .wrap{padding:0 12px} shorthand zeroed the footer's block padding: the brand touched the najdi strip and the
     copyright the screen edge. Restore it, plus room for the last lines to scroll clear of the floating buttons */
  footer .fgrid{padding-block:28px 22px}
  footer .fbottom{padding-block:18px 20px}
  footer{padding-bottom:72px}
  /* swipeable filter rows: snap to the 12px gutter, not to the scroller edge (first pill was flush with the screen) */
  .ivbar,.phbar{scroll-padding-inline:12px}
}
/* Guide filters from 641px: six phase pills fit one row of the main column again */
@media (min-width:641px){.ivbar,.phbar{gap:6px}:is(.ivbar,.phbar) :is(.ivfbtn,.phfbtn){padding-inline:10px}}
/* Hero search on phones: the 16px input (iOS zoom floor) cut the hint mid-word; a 14px hint ending in an ellipsis */
@media (max-width:480px){.hsearch #hq{text-overflow:ellipsis}.hsearch #hq::placeholder{font-size:14px}}
/* Boxed short items: the box hugs a list-measure text column instead of standing half empty (transition clauses), the
   privacy points sit two per row like every other .kps grid, and the exec top ten keeps its article pills on the text line */
.trb{max-width:46rem} /* text ≈ 40em at 15px next to the clause label */
.xten li{max-width:var(--measure-list)}
@media (min-width:900px){
  .kps>ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .kps>ul>li{margin:0!important} /* !important: boot.js writes style="margin:12px 0" on each point; the grid gap replaces it */
  .kps>ul>li:last-child:nth-child(odd){grid-column:1/-1}
}
/* Committee check cards: the «غير مكتمل» pill was the same blue as «مستوفى»; it now follows its amber card */
.ncard.n-miss .nt .tagl.b{background:var(--surface);color:var(--amber-ink);border-color:var(--amber)}
/* Representation bar: a hairline between segments, so neighbouring hues never read as one block */
.repbar span+span{border-inline-start:2px solid var(--surface)}
/* Native checkboxes and the plan slider in the brand blue (was the UA default) */
:where(#app) input:is([type=checkbox],[type=range]){accent-color:var(--old)}
/* v7.6: publisher listing page shown next to a dead library link */
.libtable .libalt{display:inline-block;margin-inline-start:6px;font-size:13px;font-weight:700;color:var(--old)}
/* v7.6.1 print: an A4 page is narrower than 760px, so the phone card layout of the library kicked in (2 documents per page, ~100
   pages). In print, use a compact table instead, drop the on-screen filter controls and the per-card action buttons. */
@media print{
  .libfilters .libf-main,.libfilters .libf-extra,.libfilters .libf-more,.libf-bar button,.wdbar,.artjump,.artacts,.hcopy,.recent,.totop,.themetog,.motiontog{display:none!important}
  .libtable{display:table!important;width:100%;border-collapse:collapse;font-size:10.5pt}
  .libtable thead{display:table-header-group!important}
  .libtable tbody{display:table-row-group!important}
  .libtable tbody tr{display:table-row!important;border:0!important;box-shadow:none!important;padding:0!important;margin:0!important;background:none!important}
  .libtable tbody tr[hidden]{display:none!important}
  .libtable th,.libtable td{display:table-cell!important;border:1px solid #c9d1da!important;padding:4px 6px!important;vertical-align:top}
  .libtable td::before{content:none!important}
  .libtable thead .fltr,.libtable thead input,.libtable thead select,.libtable thead button{display:none!important}
  .libtable{table-layout:fixed}.libtable th,.libtable td{overflow-wrap:anywhere}
  .libtable a[href]::after{content:none!important} /* the address would push the other columns off the page */
  .libtable th:nth-child(1),.libtable td:nth-child(1){width:30%}.libtable th:nth-child(2),.libtable td:nth-child(2){width:11%}
  .libtable th:nth-child(3),.libtable td:nth-child(3){width:10%}.libtable th:nth-child(4),.libtable td:nth-child(4){width:12%}
  .libtable th:nth-child(5),.libtable td:nth-child(5){width:17%}.libtable th:nth-child(6),.libtable td:nth-child(6){width:20%}
  .libtable td .badge{white-space:normal!important;display:inline!important;border:0!important;padding:0!important;font-weight:700}
}
/* v7.6.1 print: the site footer (navigation columns, author card) is noise on paper and took most of a page on every print-out;
   keep only the copyright line and the print disclaimer. */
@media print{footer .fgrid,footer .flines,footer .devcard{display:none!important}footer{padding-top:6px!important;background:none!important;color:#5B6A7D!important}}
/* v7.6.1: items added by the automated weekly monitor, and the «آخر فحص آلي للمصادر» part of the freshness line */
.wktag.wk-auto{background:var(--zebra);color:var(--muted);border:1px dashed var(--line);font-weight:700}
.wkitem.is-auto{border-inline-start:2px dashed var(--line);padding-inline-start:10px}
.wkupd .wkchk-date{font-weight:700}
@media (max-width:560px){.wkupd .wkchk{flex-basis:100%}.wkupd .wkchk-sep{display:none}}
/* v7.7: «أدوات سريعة» row on the landing page (shortcuts registered by feature files through twQuick) */
.quicktools{margin:22px 0 4px}.quicktools h2{font-size:var(--fs-h4);margin:0 0 10px}
.qtrow{display:flex;flex-wrap:wrap;gap:10px}
.qtool{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 16px;border-radius:var(--r-pill);border:1px solid var(--line);background:var(--surface);color:var(--ink);font-weight:700;text-decoration:none}
.qtool:hover{border-color:var(--gold);text-decoration:none}.qtool .ic{color:var(--gold-ink)}
/* v7.7: transitional provisions — full text as published in Umm Al-Qura (core.js renderTransition, data/gazette.js) */
.gz{margin-top:14px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.gz>summary{cursor:pointer;min-height:44px;display:flex;align-items:center;gap:8px;padding:10px 16px;font-weight:700;font-size:14px;color:var(--ink)}
.gz>summary:hover{color:var(--gold-ink)}
.gzbody{padding:4px 16px 14px;border-top:1px solid var(--line)}
.gzbody p{margin:8px 0;font-size:14px;line-height:2.05;color:var(--ink2)}
.gzbody .gzc{text-align:center;font-weight:700;margin:4px 0}
.gzbody .gzs{text-align:end;font-weight:700}
.gzbody .gzsrc{font-size:13px;color:var(--muted);border-top:1px dashed var(--line);padding-top:8px}
@media print{.gz{border:0;background:none}.gz>summary{list-style:none;padding:0;min-height:0}.gzbody{border:0;padding:0}.gzbody p{color:#000}}

/* ════ v7.7 features — feat-core.css (merged into site.css at release: one render-blocking stylesheet instead of eight) ════ */
/* مبادرة التحوّل — v7.7 feature styles (feat-core.css). Tokens only (var(--…)) so the dark theme needs no extra rules. */

/* A1: only a linked article keeps the pill look (.gref in site.css); a chip that is not a link reads as plain text in parentheses */
a.gref{text-decoration:none;cursor:pointer}
a.gref:hover{border-color:var(--old);text-decoration:underline;text-underline-offset:3px}
a.gref:focus-visible{outline:3px solid var(--old);outline-offset:2px}
.grefs a.gref{margin-inline:2px}
.gref0,.grefs{white-space:normal}
.twnw{white-space:nowrap} /* a bracket stays on the line of the pill next to it */
/* review DP-5: on phones the article links of the exec and process pages (the core.js text blocks below) get a 44 px touch area, as
   #/numbers and #/pending do (feat-pages1.css): an invisible ::after. Its offsets count from the padding box, so -11px makes the 24 px
   chip 44 px tall; sideways 3 px, or up to 44 px wide for a narrow chip («22»): chips on one line stand at least 8 px apart, so each
   keeps the tap at its centre. A scenario's <summary> stays above the chips of its first answer line. Screen only: the look and the
   printout are unchanged */
@media screen and (max-width:760px){
  .xten a.gref,.chgcard a.gref,.imptbl a.gref,.kps a.gref,.cmp a.gref,.best a.gref,.scnbody a.gref{position:relative}
  .xten a.gref::after,.chgcard a.gref::after,.imptbl a.gref::after,.kps a.gref::after,.cmp a.gref::after,.best a.gref::after,
  .scnbody a.gref::after{content:"";position:absolute;inset:-11px min(-3px,calc(50% - 22px))}
  details.scn>summary{position:relative;z-index:1}
}

/* A6: a <select> is as wide as its longest option, so the longer 1448H titles («فتح العروض — لجنة فتح العروض وفحصها (كانت: …)») made
   the «اختر عملية مباشرة» list on #/guide push the one-column dashboard to 529 px at 390 px; the list now shrinks to its row (the open
   list still shows the full titles) */
.dash>.dbox{min-width:0}
.startrow .jsel{max-width:100%}

/* A3: the status chips sit under the process title (same .badge look), not inside the h1 */
.dbadges{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px}

/* A8: share / print actions of the exec and process pages */
.twacts{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:14px}
.twbtn{display:inline-flex;align-items:center;min-height:44px;padding:8px 16px;border-radius:10px;border:1.5px solid var(--line);background:var(--surface);
  color:var(--ink);font:inherit;font-size:14px;font-weight:700;cursor:pointer}
.twbtn:hover{border-color:var(--gold)}
.twbtn:focus-visible{outline:3px solid var(--old);outline-offset:2px}

/* A9: «شرح الموقع — ليس نصًا نظاميًا» — one small, quiet tag on every editorial block */
.twtag{display:inline-block;font-family:'IBM Plex Sans Arabic',sans-serif;font-size:13px;font-weight:400;line-height:1.6;color:var(--muted);
  border:1px dashed var(--dash-line);border-radius:var(--r-pill);padding:0 10px;white-space:nowrap;vertical-align:middle}
.twh{flex-wrap:wrap} /* headings that carry the tag wrap instead of overflowing at 390 px */
.twcap{font-size:13px;color:var(--muted);margin-top:8px}

/* A5: page-level notice when part of a process depends on the pending regulation */
.twpend{display:flex;gap:10px;align-items:flex-start;background:var(--amber-bg);border:1px solid var(--gold-tint-line);border-radius:var(--radius);
  padding:12px 16px;color:var(--amber-ink);font-size:14px;line-height:1.9}
.twpend svg{flex:none;margin-top:6px}
.twpend p{margin:0;color:var(--amber-ink)}
.twpend a{color:var(--amber-ink);font-weight:700;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}

/* A7: standstill trigger note on #/p/award (quotes of the law + what the law leaves open) */
.twnote{background:var(--surface);border:1px solid var(--line);border-inline-start:4px solid var(--gold);border-radius:var(--radius);padding:14px 18px;font-size:14px;line-height:2}
.twnote .twnh{font-weight:700;color:var(--ink);display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:6px}
.twnote p{margin:6px 0 0;color:var(--text)}
.twnote p b{color:var(--ink)}

/* A4: «عمليات مرتبطة» — neighbours in the guide order */
.prelg{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.prelc{display:flex;flex-direction:column;gap:4px;min-height:44px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:12px 16px;color:var(--ink);text-decoration:none}
.prelc:hover{border-color:var(--gold);text-decoration:none}
.prelc:focus-visible{outline:3px solid var(--old);outline-offset:2px}
.prelc b{font-size:15px;color:var(--ink);line-height:1.7}
.prelk{font-size:13px;color:var(--muted)}

/* A9: entry links on #/guide to the companion pages (shown only when registered); review SIM77-05 reuses them for the tool link on
   #/exec (readiness) and #/p/direct, #/p/limited-tender (justify) */
.twlinks{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.twlinks a{display:inline-flex;align-items:center;font-size:13px;font-weight:700;color:var(--navy);background:var(--old-bg);border:1px solid var(--old-line);
  border-radius:var(--r-pill);padding:5px 13px;text-decoration:none}
.twlinks a:hover{border-color:var(--old);text-decoration:none}
@media (max-width:640px){.twlinks a{min-height:44px}}

@media print{
  .twacts,.prel,.twlinks{display:none!important}
  a.gref,.twtag{background:none!important;color:var(--ink)!important;border:1px solid currentColor!important}
  .twtag{border-style:dashed!important}
  .twpend,.twnote{background:none!important;color:var(--ink)!important;border-color:var(--ink)!important;break-inside:avoid}
  .twpend p,.twpend a,.twnote p{color:var(--ink)!important}
}

/* ════ v7.7 features — feat-transition.css (merged into site.css at release: one render-blocking stylesheet instead of eight) ════ */
/* مبادرة التحوّل — v7.7 feature styles (feat-transition.css). Tokens only (var(--…)) so the dark theme needs no extra rules. */
/* #/transition (PKG-T): answer box, date helper, key dates, the «تنبيه» notice, clause labels / site notes / copy buttons, FAQ links.
   The .gz (gazette text) rules stay in site.css. */
.trsacts{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:14px}
.trsbox,.trsout{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;box-shadow:var(--shadow-sm);max-width:52rem}
.trsbox{border-inline-start:4px solid var(--gold);border-start-start-radius:0;border-end-start-radius:0}
.trsbox p,.trsout p{margin:0 0 10px;font-size:15px;line-height:2;color:var(--text)}
.trsbox p:last-child,.trsout p:last-child{margin-bottom:0}
.trsbox b{color:var(--ink)}
.trsnote{background:var(--amber-bg);border-radius:var(--r-sm);padding:8px 12px}
/* links inside running text need more than colour to stand out (WCAG 1.4.1) */
.trsbox p:not(.trsacts) a,.trsout a,.trsdt a,.fq a,.trsed a{text-decoration:underline;text-underline-offset:3px}
/* a link standing alone in an action row: 44 px tap target like the button beside it (DP-6: it was 30 px on iPhone); not underlined in
   the helper's answer either, as in the answer box */
.trsacts a{font-weight:700;color:var(--gold-ink);display:inline-flex;align-items:center;min-height:44px}
.trsout .trsacts a:not(:hover){text-decoration:none}
/* the helper */
.trsform{display:flex;flex-wrap:wrap;gap:12px 16px;align-items:flex-end;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;max-width:52rem}
.trsfld{display:flex;flex-direction:column;gap:5px;min-width:0;flex:1 1 13em;max-width:20em}
.trsfld label{font-size:14px;font-weight:700;color:var(--ink)}
.trsfld input{font:inherit;font-size:16px;min-height:44px;padding:6px 10px;border:1px solid var(--field-line);border-radius:var(--r-sm);background:var(--surface);color:var(--ink);width:100%}
.trsform .btn{min-height:44px}
.trshint{flex-basis:100%;margin:0;font-size:13px;color:var(--muted)}
.trsout{margin-top:12px}
.trsout:empty{display:none}
.trsout .trserr{color:var(--danger);font-weight:700}
.trsout .trsasm{font-size:13px;line-height:1.95;color:var(--muted);border-top:1px dashed var(--line);padding-top:8px;margin-top:10px}
.trsq{margin:6px 0 12px;padding:8px 14px;border-inline-start:3px solid var(--gold);background:var(--zebra);border-radius:var(--r-sm);border-start-start-radius:0;border-end-start-radius:0}
.trsq p{margin:0;font-size:14px;line-height:2.05}
/* the quote's source line is a <footer>: keep the site footer's navy band, gold border, najdi strip, phone padding (72 px) and white
   focus ring (site.css footer, footer::before, footer :focus-visible) off it */
.trsq footer{margin-top:4px;font-size:13px;color:var(--muted);position:static;overflow:visible;background:none;border:0;padding:0}
.trsq footer::before{content:none}
.trsq footer :focus-visible{outline-color:var(--old)}
.trsrel{margin:4px 0 12px;border:1px solid var(--line);border-radius:var(--r-sm);padding:0 12px}
.trsrel>summary{cursor:pointer;min-height:44px;padding:9px 0;font-size:14px;font-weight:700;color:var(--ink);line-height:1.8}
.trsrel[open]>summary{border-bottom:1px dashed var(--line);margin-bottom:8px}
/* key dates */
.trsdt{width:100%;max-width:60rem;border-collapse:separate;border-spacing:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);font-size:14px;box-shadow:var(--shadow-sm)}
.trsdt th,.trsdt td{padding:10px 12px;text-align:start;vertical-align:top;border-top:1px solid var(--line);line-height:1.9;color:var(--text)}
.trsdt thead th{border-top:0;background:var(--zebra);color:var(--ink);font-size:13px}
.trsdt thead th:first-child{border-start-start-radius:var(--radius)}.trsdt thead th:last-child{border-start-end-radius:var(--radius)}
.trsdt tbody th{color:var(--ink);font-weight:700;width:30%}
.trsdt small{display:block;font-weight:400;font-size:13px;color:var(--muted)}
.trsdt .badge{display:inline-block;line-height:1.7}
.trsdt .trsd{white-space:nowrap} /* a date breaks only between its Gregorian and Hijri forms */
.trsdt td:last-child{width:14em}
.trsdt .trsics{display:flex;width:max-content;margin-top:8px} /* its own line under the status */
.trscap{font-size:13px;color:var(--muted);margin-top:8px}
/* clause cards: the label names its instrument; site notes are set apart from the guide's wording */
.trsbx{flex:1 1 auto;min-width:0}
.trn .trsins{display:block;font-weight:500}
.trb .trsed{margin-top:8px;padding-top:6px;border-top:1px dashed var(--line);font-size:13px;line-height:1.95;color:var(--muted)}
.trb .trsed b{color:var(--ink)}
.trscp,.trsics{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:4px 12px;border:1px solid var(--field-line);border-radius:var(--r-sm);background:var(--surface);color:var(--ink);font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.trscp:hover,.trsics:hover{border-color:var(--gold);color:var(--gold-ink)}
.trb .trscp{margin-top:10px}
.gzbody .trscp{margin:0 0 10px}
/* the «تنبيه» notice (.trswarn) */
.trswarn{background:var(--amber-bg);border:1px solid var(--gold-tint-line);border-inline-start:4px solid var(--amber);border-radius:var(--radius);border-start-start-radius:0;border-end-start-radius:0;padding:12px 16px;margin:0 0 14px;max-width:60rem}
.trswarn p{margin:0;font-size:14px;line-height:2;color:var(--text)}
.trswarn b{color:var(--amber-ink)}
@media (max-width:640px){
  .trn .trsins{display:inline}
  .trscp,.trsics,.trstoc a{min-height:44px} /* tap target, as every button on phones (site.css D17) */
  .trstoc a{display:inline-flex;align-items:center} /* the jump row (.ptoc chips, site.css) */
  .trsbox,.trsout,.trsform{padding:14px 12px}
  .trsfld{max-width:none;flex-basis:100%}
  .trsdt,.trsdt tbody,.trsdt tr,.trsdt th,.trsdt td{display:block}
  .trsdt thead{display:none}
  .trsdt tbody tr{border-top:1px solid var(--line);padding:10px 12px}
  .trsdt tbody tr:first-child{border-top:0}
  .trsdt tbody th,.trsdt td,.trsdt td:last-child{border:0;padding:2px 0;width:auto}
  .trsdt td::before{content:attr(data-label);display:block;font-size:13px;font-weight:700;color:var(--muted)}
}
@media print{
  .trsdt thead{break-after:avoid}.trsdt tbody tr:first-child{break-before:avoid} /* DP-3: the table header never ends a page alone */
  /* DP-2: the helper's form does not print, so its section prints only with an answer (no lone heading, no bare input error) */
  .sec:has(>.trsform):has(>.trsout:empty),.sec:has(>.trsform):has(>.trsout>.trserr){display:none!important}
  .trsbox,.trsout,.trswarn,.trsdt,.trsrel{box-shadow:none!important;background:none!important;border-color:#888!important}
  .trsnote,.trsq,.trsdt thead th{background:none!important}
  .trsbox p,.trsout p,.trswarn p,.trswarn b,.trsdt th,.trsdt td,.trsq p,.trsq footer,.trb .trsed,.trsrel>summary{color:#000!important}
  .trsdt tr,.trsq{break-inside:avoid}
  /* print appends each external URL to its link (site.css): fixed columns and breakable text keep the table on the page */
  .trsdt{table-layout:fixed}.trsdt th,.trsdt td{overflow-wrap:anywhere}.trsdt .badge,.trsdt .trsd{white-space:normal}
  .trsdt thead th:nth-child(1){width:22%}.trsdt thead th:nth-child(2){width:18%}.trsdt thead th:nth-child(4){width:22%}
}

/* ════ v7.7 features — feat-diff.css (merged into site.css at release: one render-blocking stylesheet instead of eight) ════ */
/* مبادرة التحوّل — v7.7 feature styles (feat-diff.css). Tokens only (var(--…)) so the dark theme needs no extra rules. */

/* ── Article page (#/m/<n>, #/diff/f/<k>) ── */
/* C04: the asked article and its law, under the fasl title */
.artsub{margin-top:6px;font-size:var(--fs-sm);font-weight:700;color:var(--ink);line-height:1.8}
.artsub a{color:var(--old)}
/* B25: per-status counts of this fasl (replaces the bare legend; same chips as the cards) */
.dscnt{display:flex;gap:7px;flex-wrap:wrap;align-items:center}
.dscnt-l{font-size:13px;font-weight:700;color:var(--muted)}
.dscnt .dchip b{margin-inline-start:6px;font-variant-numeric:tabular-nums}
/* C05: the number means something else in the other law */
.dsamb{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:0 0 12px;padding:9px 12px;border-radius:var(--r-sm);
  background:var(--amber-bg);border:1px solid var(--gold-tint-line);border-inline-start:3px solid var(--gold);font-size:13px;line-height:1.8;color:var(--ink)}
.dsamb-h{font-weight:700;color:var(--gold-ink)}
.dsamb .dcardlink{white-space:normal}
.dsamb-here{font-weight:700;color:var(--ink2)}
.dsamb-corr{font-weight:700;color:var(--old)}
.dsamb-src{flex-basis:100%;font-size:13px;color:var(--muted)}
#dres .dsamb{margin-top:10px}
/* B2: a note of the official differences guide — official wording, so it is set apart from the site's own notes and, being neutral,
   is not mistaken for the blue 1440H or the green 1448H pane */
.dsgnote{margin-top:10px;padding:9px 12px;border-radius:var(--r-sm);background:var(--zebra);border:1px solid var(--line);border-inline-start:3px solid var(--ink3);font-size:13px;line-height:1.9;color:var(--text)}
.dsgnote-h{display:block;color:var(--ink);font-size:13px}
.dsgnote p{margin-top:2px}
.dsgnote-s{color:var(--muted)}
/* C35/B21: the site's notes under a 1448H card — small, muted, outside the official text */
.dsnotes{margin-top:10px;padding-top:8px;border-top:1px dashed var(--line);font-size:13px;line-height:1.9;color:var(--muted)}
.dsnotes ul{list-style:none;margin:2px 0 0;padding:0}
.dsnotes li{position:relative;padding-inline-start:12px}
.dsnotes li::before{content:"";position:absolute;inset-inline-start:2px;top:.85em;width:4px;height:4px;border-radius:50%;background:var(--gold)}
.dstag{display:inline-block;font-size:13px;font-weight:700;color:var(--gold-ink);background:var(--amber-bg);border:1px solid var(--gold-tint-line);border-radius:var(--r-pill);padding:0 10px;line-height:1.8}
/* card footer: C14 «نسخ السند النظامي» (kept out of the header, which sticks under the tab bar on phones) + B15 the article's
   own static page (view alone / print) */
.dsfoot{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-top:12px}
.dsalone{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:700;color:var(--old)}

/* ── Search page (#/search/new|current) ── */
.fsub{display:flex;flex-wrap:wrap;align-items:center;gap:2px 14px;margin-top:6px;font-size:var(--fs-sm);color:var(--ink2)}
.fsub a{font-weight:700;color:var(--old)}
details.fhelp{margin-top:8px}
details.fhelp>summary{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-size:13px;font-weight:700;color:var(--old);list-style:none}
details.fhelp>summary::-webkit-details-marker{display:none}
details.fhelp>summary::before{content:"+";content:"+" / "";display:inline-grid;place-items:center;width:18px;height:18px;border:1.5px solid currentColor;border-radius:50%;font-size:13px;line-height:1}
details.fhelp[open]>summary::before{content:"−";content:"−" / ""}
.fhelp-b{margin-top:8px;max-width:760px;font-size:var(--fs-sm);line-height:1.9;color:var(--text)}
.fhelp-b p+p{margin-top:6px}
.fsrcnote{font-size:13px;color:var(--muted);margin-top:14px;line-height:1.8} /* the source note under the results (not .fnote: the footer's «إشعار» column) */

/* ── v7.7 wave 2 (PKG-F) ── */
/* F1: results that did not come from the query itself — synonyms suggested by the site, or the automatic «مشابه» retry */
.fsyn{margin:6px 0 12px;padding:9px 12px;border-radius:var(--r-sm);background:var(--amber-bg);border:1px solid var(--gold-tint-line);border-inline-start:3px solid var(--gold);font-size:13px;line-height:1.9;color:var(--ink)}
.fsyn-h{display:block;color:var(--gold-ink);font-size:13px}
#dres .fsyn{margin-top:8px}
.fsynw{display:inline-block;font-size:13px;font-weight:700;color:var(--gold-ink);border:1px dashed var(--gold-tint-line);border-radius:var(--r-pill);padding:0 10px;line-height:1.8;white-space:normal}
/* F1 (B6): the site's own process pages that use the word — commentary, set apart from the law texts by a dashed frame and its tag */
.fproc{margin-top:16px;padding:10px 14px;border:1px dashed var(--line);border-radius:var(--radius);background:var(--surface)}
.fproc-h{font-size:13px;line-height:1.9;color:var(--ink2);margin:0 0 4px}
.fproc-h .dstag{margin-inline-end:6px}
.fproc-l{list-style:none;margin:0;padding:0}
.fproc-l li{padding:8px 0;border-top:1px solid var(--line);font-size:13px;line-height:1.9;color:var(--text)}
.fproc-l li:first-child{border-top:0}
.fproc-a{font-weight:700;color:var(--old);margin-inline-end:4px}
.fproc-t{display:flex;flex-wrap:wrap;gap:4px 2px;margin-top:4px}
.fproc-more{font-size:13px;color:var(--muted);margin-top:6px}
.fproc-more a{font-weight:700;color:var(--old)}
/* «م43/4»: the asked paragraph inside the article text (no bold: it is a whole paragraph) */
mark.fpara{font-weight:inherit;background:var(--amber-bg);box-shadow:inset 0 -2px 0 var(--gold-tint-line)}
/* F3: «يُشرح في: …» — the guide's process pages that cite this 1448H article (card notes and the number search) */
.dsxref{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px}
.dsxref-l{font-weight:700;color:var(--ink2)}
.dsxl{white-space:normal}
.fxr{margin-top:10px;padding-top:8px;border-top:1px dashed var(--line);font-size:13px;line-height:1.9;color:var(--muted)}

/* ── Phones: tap targets ≥ 44 px ── */
@media (max-width:640px){
  .dsamb .dcardlink,.dsamb-corr,.dsalone,.fsub a{min-height:44px;display:inline-flex;align-items:center;gap:5px} /* gap: flex drops the space before «←» */
  details.fhelp>summary{min-height:44px}
  .hacts .hcopy{min-width:44px} /* «نسخ» was 43 px wide at 390 */
  .artsub a{display:inline-block;padding-block:12px;margin-block:-12px} /* 44 px touch area inside the sentence, same line height */
  .dsxl,.fproc-t a.gref,.fproc-more a{min-height:44px;display:inline-flex;align-items:center}
  .fproc-a{min-height:44px;display:flex;align-items:center;width:fit-content} /* own line above its passage: a 44 px link inside the sentence spread its lines */
}

/* ── Print: controls hidden; notes and the asked-article lines print in ink ── */
@media print{
  #app .artacts,.dsfoot,.hcite,.dsamb-corr,.fsub a,details.fhelp,#app .fmode,#app .hmore{display:none!important} /* the count line already names the mode */
  .dsamb,.dsgnote,.dstag{background:none!important;border-color:var(--line)!important;color:var(--ink)!important}
  .dsamb-h,.dsgnote-h,.dsnotes{color:var(--ink)!important}
  .dsnotes li::before{background:var(--ink)}
  .dsnotes,.dsgnote,.dsamb{break-inside:avoid}
  .fsyn,.fproc,.fsynw,mark.fpara{background:none!important;border-color:var(--line)!important;color:var(--ink)!important;box-shadow:none!important}
  .fsyn-h,.fproc-h,.fproc-a,.dsxref-l{color:var(--ink)!important}
  mark.fpara{text-decoration:underline;text-underline-offset:3px}
  .dsxl{background:none!important;border-color:var(--line)!important;color:var(--ink)!important}
  .fsyn,.fproc-l li{break-inside:avoid}
}

/* ════ v7.7 features — feat-shell.css (merged into site.css at release: one render-blocking stylesheet instead of eight) ════ */
/* مبادرة التحوّل — v7.7 feature styles (feat-shell.css). Tokens only (var(--…)) so the dark theme needs no extra rules. */
/* C3: the countdown chip is now a link to #/transition. No display value here, so site.css still hides it at ≤600px (it would
   squeeze the tabs); the transparent ::before stretches the hit area to ≥44px without changing the pill. */
a.tbadge{position:relative;text-decoration:none;transition:background-color .15s,border-color .15s}
a.tbadge::before{content:"";position:absolute;inset:-5px -3px}
a.tbadge:hover{background:rgba(201,162,75,.22);border-color:var(--gold);text-decoration:none}
/* C4: the Umm al-Qura date under each date of the hero timeline (the hero is navy in both themes) */
.htl-node .htl-hj{font-size:13px;font-weight:400;color:var(--on-dark);font-variant-numeric:tabular-nums}
/* C5: on phones the latest-report line wraps instead of ending in an ellipsis, so its closing date («حتى …») is never cut */
@media (max-width:600px){
  .tsl.upd{align-items:flex-start}
  .tsl.upd .tsu{white-space:normal;overflow:visible;text-overflow:clip}
}
/* C6: the print footer (#shpfoot, filled by feat-shell.js) — off screen; in print it stacks under the copyright line of the site
   footer (site.css prints footer text in --ink, and hides the whole footer in the committee-draft printout, body.coiP). The
   footer's screen spacing (56px margin + 38px padding around one line) is tightened so the added lines cost no extra page. */
.shpfoot{display:none}
@media print{
  .shpfoot{break-before:avoid} /* keep the print footer with the copyright line */
  .quicktools{display:none!important} /* C2: the role shortcuts are navigation only, like .hquick (hidden by site.css) */
  footer{margin-top:14px!important}
  footer .fbottom{display:block!important;padding-block:6px 0!important}
  .shpfoot{display:block;margin-top:4px;font-size:9pt;line-height:1.6;break-inside:avoid}
  .shpfoot p{margin:0}
}

/* ════ v7.7 features — feat-lib.css (merged into site.css at release: one render-blocking stylesheet instead of eight) ════ */
/* مبادرة التحوّل — v7.7 feature styles (feat-lib.css). Tokens only (var(--…)) so the dark theme needs no extra rules. */

/* ── C22 library: «أحدث ما صدر» strip above the filters (library-weekly.js libNewHTML) ── */
.libnew{margin:14px 0 10px;padding:12px 14px;background:var(--surface);border:1px solid var(--line);border-inline-start:4px solid var(--gold);border-radius:var(--r-md);box-shadow:var(--shadow-sm)}
.libnew-h{display:flex;align-items:center;gap:8px;margin:0;font-size:var(--fs-h4);font-weight:700;color:var(--ink)}
.libnew-h .ic{color:var(--gold-ink)}
.libnew-sub{margin:2px 0 6px;font-size:13px;line-height:1.8;color:var(--muted)}
.libnew-cap{margin:10px 0 6px;font-size:13px;font-weight:700;color:var(--ink2)}
/* compact rows (not cards): two columns from 900px, separated by dashed rules like the filter bar */
.libnew-list{list-style:none;margin:0;padding:0;display:grid;gap:0 28px}
@media (min-width:900px){.libnew-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
.libnew-item{min-width:0;padding:6px 0 8px;border-top:1px dashed var(--line);font-size:13px;line-height:1.8}
.libnew-ttl{font-size:14px;line-height:1.7;overflow-wrap:anywhere}
.libnew-ttl a{padding-block:12px} /* inline: a ≥44px hit area without moving the line */
.libnew-meta{margin-top:2px;color:var(--muted);overflow-wrap:anywhere}
.libnew-type{font-weight:700;color:var(--ink2)}
.libnew-type::after{content:" ·";font-weight:400}
/* the status stays one rectangle: at the end of the line when it fits, else whole on the next line (as in the table) */
.libnew-meta .badge{display:inline-block;max-width:100%;white-space:normal;line-height:1.7;padding:1px 8px;margin:2px 0 0;margin-inline-start:4px;border-radius:var(--r-sm);vertical-align:baseline}
.libnew-more{margin-top:8px;border-top:1px dashed var(--line)}
.libnew-more>summary{cursor:pointer;min-height:44px;padding-block:10px;font-size:13px;font-weight:700;color:var(--ink2)}
.libnew-more[open]>summary{margin-bottom:4px}
.libnew-n{font-weight:400;color:var(--muted);margin-inline-start:4px}
.libnew-forms{display:flex;gap:6px;align-items:flex-start;margin:10px 0 0;padding-top:8px;border-top:1px dashed var(--line);font-size:13px;line-height:1.8;color:var(--ink2)}
.libnew-forms>.ic{flex:none;margin-top:5px;color:var(--gold-ink)}
.libnew-forms a{font-weight:700;padding-block:13px}
/* decision 1118 is also listed under section 7 (sec2) */
.libsec2{display:block;margin-top:2px;font-size:13px}

/* ── C24a/C38c committee: count line, its basis, and the neutral state of the untouched sample ── */
.sv1txt .sv1cnt{color:var(--ink)}
.sv1txt .sv1basis{color:var(--muted);line-height:1.8}
.sv1sum.demo .sv1big,.statcard.demo .big{color:var(--muted)}
.statcard.demo{background:var(--surface);border-color:var(--line)}

/* ── C17/B12 committee: decision draft label (screen: once above; print: header and footer) ── */
.sv1dlbl{display:inline-block;margin:0 0 8px;padding:3px 10px;font-size:13px;font-weight:700;line-height:1.7;color:var(--amber-ink);background:var(--amber-bg);border:1px solid var(--gold-tint-line);border-radius:var(--r-sm)}
.sv1dfoot{display:none}

@media print{
  .libnew{box-shadow:none;border-color:#c9d1da}
  .libnew-ttl a[href]::after{content:none!important} /* the addresses are in the catalogue below; here they would swamp the names */
  .libnew-more>summary{list-style:none;min-height:0;padding-block:4px}
  .sv1dfoot{display:block;margin:10px 0 0}
  .sv1dlbl{color:#000;background:none;border:1px solid #000}
  /* «اطبع مسودة القرار» (COI print mode, body.coiP + .coi-print-target on .coi-sec0): only the draft, framed by the label.
     Every printed page of the draft also carries the label in its top and bottom margin boxes (named page sv1draft, set on body
     only when the draft is the print target, so the two COI declarations are not labelled); browsers without @page margin
     boxes still print the in-flow label above and below the draft. */
  body.coiP:has(.coi-sec0.coi-print-target){page:sv1draft}
  @page sv1draft{
    @top-left{content:"مسودة استرشادية — ليست قرارًا نافذًا، وتُراجع نظاميًا قبل الاعتماد";font-size:9pt;font-weight:700;color:#000}
    @bottom-left{content:"مسودة استرشادية — ليست قرارًا نافذًا، وتُراجع نظاميًا قبل الاعتماد";font-size:9pt;color:#000}
  }
  body.coiP .coi-sec0>h3{display:none!important}
  body.coiP .coi-sec0 .sv1dlbl{display:block;text-align:center;font-size:10.5pt;padding:4px 8px}
  body.coiP .coi-sec0 .decl{border:0;background:none!important;box-shadow:none!important;padding:0;margin:12px 0;font-size:12pt;line-height:2;color:#000}
}

/* ════ v7.7 features — feat-pages1.css (merged into site.css at release: one render-blocking stylesheet instead of eight) ════ */
/* مبادرة التحوّل — v7.7 feature styles (feat-pages1.css). Tokens only (var(--…)) so the dark theme needs no extra rules. */
/* PKG-N1: #/corr (fxcr-), #/pending (fxpd-), #/numbers (fxnm-); shared bits fx1-. Print = light palette (the dark block is screen-only). */

/* ── shared ── */
#app h2.display.fx1-h{font-size:var(--fs-h4);display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:12px}
#app h2.display.fx1-h .hint{font-size:13px;color:var(--muted);font-family:'IBM Plex Sans Arabic',sans-serif;font-weight:400}
.fx1-src p{margin:0 0 6px;line-height:1.9}
.fx1-rel{display:flex;flex-wrap:wrap;gap:8px 18px;margin:18px 0 8px;font-size:14px;font-weight:700}
.fx1-rel a{display:inline-flex;align-items:center;min-height:44px}
.xbtns .copybtn.fx1-xl{background:var(--new-fill)}
.xbtns .copybtn.fx1-xl:hover{background:var(--new-fill);filter:brightness(1.12)} /* --new-ink is light green in the dark theme: white text would vanish */
.xbtns .copybtn.fx1-alt{background:var(--surface);color:var(--ink);border:1.5px solid var(--field-line)}
.xbtns .copybtn.fx1-alt:hover{background:var(--zebra)}
.xbtns .copybtn{min-height:44px}

/* ── #/corr ── */
.fxcr-leg{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:12px;font-size:13px}
.fxcr-st{display:inline-block;font-weight:700;border-radius:7px;padding:1px 9px;line-height:1.8;font-size:13px}
.fxcr-st.mod{background:var(--old-bg);color:var(--old);border:1px solid var(--old-line)}
.fxcr-st.new{background:var(--new-bg);color:var(--new-ink);border:1px solid var(--new-line)}
.fxcr-st.del{background:var(--burg-bg);color:var(--burg-ink);border:1px solid var(--danger-line)}
.fxcr-st.same{background:var(--grey-bg);color:var(--ink3);border:1px solid var(--line)}
.fxcr-st b{font-weight:800;margin-inline-start:4px}
.fxcr-star{color:var(--gold-ink);font-weight:700}
.fxcr-tools{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px 18px;align-items:end;margin:16px 0 10px;padding:12px 14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-sm)}
.fxcr-tools .xbtns{grid-column:1/-1}
.fxcr-q label,.fxcr-sort>span{display:block;font-size:13px;font-weight:700;color:var(--ink2);margin-bottom:6px}
.fxcr-q input{width:100%;min-height:44px;padding:8px 12px;border:1.5px solid var(--field-line);border-radius:var(--r-sm);background:var(--surface);color:var(--ink);font:inherit;font-size:16px}
.fxcr-q input:focus-visible{outline:2px solid var(--old);outline-offset:1px}
.fxcr-sort .segbtns button{min-height:44px}
.fxcr-ans{background:var(--old-bg);border:1px solid var(--old-line);border-inline-start:3px solid var(--gold);border-radius:var(--r-md);padding:10px 14px;margin:0 0 10px;font-weight:700;color:var(--ink)}
.fxcr-ans p{margin:2px 0;line-height:1.9}
.fxcr-n{font-size:13px;color:var(--muted);margin:4px 0 8px}
.fxcr-t{width:100%;border-collapse:collapse;background:var(--surface);border:1px solid var(--line);font-size:14px}
.fxcr-t th{background:var(--brand);color:var(--on-brand);padding:9px 10px;font-size:13px;text-align:start;vertical-align:bottom}
.fxcr-t td{padding:4px 10px;border-top:1px solid var(--line);vertical-align:middle;line-height:1.7}
.fxcr-t tbody tr:nth-child(even) td{background:var(--zebra)}
.fxcr-t td:nth-child(1),.fxcr-t td:nth-child(2){width:7.5em;white-space:nowrap}
.fxcr-no{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;font-weight:800;font-size:16px;color:var(--old)}
.fxcr-no:hover{text-decoration:underline}
.fxcr-none{display:inline-flex;align-items:center;justify-content:center;min-width:44px;color:var(--muted)}
.fxcr-many{display:block;font-size:13px;color:var(--muted);white-space:normal;line-height:1.5;margin-bottom:4px}
.fxcr-empty{padding:18px 10px!important;color:var(--muted)}
.fxcr-defs{list-style:none;margin:6px 0 10px;padding:0;display:grid;gap:6px}
.fxcr-defs li{line-height:1.9}

/* ── #/numbers ── */
.fxnm-x2{background:var(--surface);border:1px solid var(--line);border-inline-start:3px solid var(--gold);border-radius:var(--r-md);padding:12px 16px}
.fxnm-x2 p{margin:0 0 8px;line-height:1.9;font-size:14px}
.fxnm-x2 p:last-child{margin-bottom:0}
.fxnm-t{width:100%;border-collapse:collapse;margin-top:18px;background:var(--surface);border:1px solid var(--line);font-size:14px}
.fxnm-t thead th{background:var(--brand);color:var(--on-brand);padding:9px 12px;font-size:13px;text-align:start}
.fxnm-t thead th:nth-child(2),.fxnm-t thead th:nth-child(3){width:41%}
.fxnm-t tbody th{text-align:start;vertical-align:top;padding:12px;font-size:15px;color:var(--ink);background:var(--zebra);border-top:1px solid var(--line)}
.fxnm-t td{vertical-align:top;padding:10px 12px;border-top:1px solid var(--line);border-inline-start:1px solid var(--line)}
.fxnm-f+.fxnm-f{margin-top:12px;padding-top:12px;border-top:1px dashed var(--line)}
.fxnm-v{font-weight:800;font-size:16px;color:var(--ink);line-height:1.6}
.fxnm-x{font-weight:400;font-size:13px;color:var(--muted)}
.fxnm-q,.fxpd-q{margin:6px 0;padding:6px 10px;border-inline-start:3px solid var(--line);background:var(--zebra);border-radius:6px;color:var(--text);line-height:1.9;font-size:14px}
.fxnm-ref{text-decoration:none}
a.gref.fxnm-ref:hover,a.gref.fxnm-ref:focus-visible{text-decoration:underline}
.fxnm-pend{margin-top:8px;font-size:13px;line-height:1.9;color:var(--ink2)}
.fxnm-pend .tagl,.fxpd-intro .tagl,.fxpd-ist .tagl,.fxpd-t .tagl,.fxnm-x2 .tagl{font-size:13px;font-weight:700;padding:1px 9px;border-radius:var(--r-pill);display:inline-block;line-height:1.7}
.fxnm-note{margin:8px 0 0;font-size:13px;line-height:1.9;color:var(--ink2)}
.fxnm-list{margin:6px 0;font-size:13px}
.fxnm-list summary{cursor:pointer;color:var(--old);font-weight:700;min-height:44px;display:flex;align-items:center}
.fxnm-list ol{margin:4px 0 0;padding-inline-start:4px;line-height:1.9;list-style:none}
.fxnm-bad{color:var(--burg-ink);background:var(--burg-bg);border:1px solid var(--danger-line);border-radius:8px;padding:8px 10px;font-size:13px}

/* ── #/pending ── */
.fxpd-reg{background:var(--surface);border:1px solid var(--line);border-inline-start:3px solid var(--gold);border-radius:var(--r-md);padding:12px 16px}
.fxpd-reg p{margin:0 0 8px;line-height:1.9}
.fxpd-q .gref{margin-inline-start:6px}
.fxpd-h3{font-size:16px;margin:20px 0 10px;color:var(--ink)}
.fxpd-list{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.fxpd-ist{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:10px 14px;line-height:1.9;font-size:14px}
.fxpd-ist>a{font-weight:700}
.fxpd-ist p{margin:2px 0}
.fxpd-win{display:inline-block;margin-top:4px;font-size:13px;font-weight:700;border-radius:var(--r-pill);padding:1px 10px;background:var(--grey-bg);color:var(--ink3);border:1px solid var(--line)}
.fxpd-win.on{background:var(--new-bg);color:var(--new-ink);border-color:var(--new-line)}
.fxpd-t{width:100%;border-collapse:collapse;background:var(--surface);border:1px solid var(--line);font-size:14px}
.fxpd-t thead th{background:var(--brand);color:var(--on-brand);padding:9px 12px;font-size:13px;text-align:start}
.fxpd-t tbody th{text-align:start;vertical-align:top;padding:10px 12px;font-size:14px;color:var(--ink);border-top:1px solid var(--line);width:22%}
.fxpd-t td{vertical-align:top;padding:10px 12px;border-top:1px solid var(--line);border-inline-start:1px solid var(--line);line-height:1.9}
.fxpd-t td:nth-child(2){width:42%}
.fxpd-t td p{margin:0 0 6px}
.fxpd-t td p:last-child{margin-bottom:0}
.fxpd-cur{font-size:13px;color:var(--ink2)}
.fxpd-cur .tagl{margin-inline-start:4px}
.fxpd-gz{color:var(--text)}
.fxpd-star{color:var(--gold-ink);font-weight:800}
.fxpd-note{font-size:13px;line-height:1.9;margin:8px 0;color:var(--ink2)}
.fxpd-intro{line-height:1.9;font-size:14px;margin:0 0 10px;color:var(--text)}
.fxpd-idx{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.fxpd-idx .gref{margin:0}
.fxpd-bab{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);margin-bottom:10px}
.fxpd-bab>summary{cursor:pointer;font-weight:700;padding:10px 14px;min-height:44px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:var(--ink)}
.fxpd-bab>summary .hint{font-size:13px;color:var(--muted);font-weight:400}
.fxpd-bab dl{margin:0;padding:4px 14px 12px}
.fxpd-bab dt{margin-top:10px;font-weight:800}
.fxpd-bab dt a{display:inline-flex;align-items:center;min-height:32px}
.fxpd-bab dd{margin:4px 0 0;padding:6px 10px;border-inline-start:3px solid var(--line);background:var(--zebra);border-radius:6px;line-height:1.9;font-size:14px;color:var(--text)}
.fxpd-k{font-size:13px;font-weight:700;color:var(--muted);white-space:nowrap}
.fxpd-procs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(420px,100%),1fr));gap:12px}
.fxpd-proc{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:10px 14px;box-shadow:var(--shadow-sm)}
.fxpd-proc h3{font-size:15px;margin:0 0 6px;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px}
.fxpd-proc h3 .hint{font-size:13px;color:var(--muted);font-weight:400}
.fxpd-proc ul{list-style:none;margin:0;padding:0}
.fxpd-proc li{border-top:1px dashed var(--line);padding:6px 0}
.fxpd-proc li p{margin:2px 0 0;font-size:14px;line-height:1.9;color:var(--text)}
.fxpd-at{display:inline-flex;align-items:center;min-height:32px;font-size:13px;font-weight:700}

/* ── phones: tables become stacked cards (labels from data-label, as .libtable does); screen only, so an A4 print (≈700 px wide)
   keeps the side-by-side table ── */
@media (max-width:760px){.fxcr-tools{grid-template-columns:1fr}}
@media screen and (max-width:760px){
  .fxnm-t,.fxpd-t{border:0;background:transparent;display:block}
  .fxnm-t thead,.fxpd-t thead{display:none}
  .fxnm-t tbody,.fxpd-t tbody{display:block}
  .fxnm-t tr,.fxpd-t tr{display:block;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);margin-bottom:12px;box-shadow:var(--shadow-sm);overflow:hidden}
  .fxnm-t tbody th,.fxpd-t tbody th{display:block;width:auto;border-top:0;background:var(--zebra)}
  .fxnm-t td,.fxpd-t td{display:block;width:auto!important;border-inline-start:0}
  .fxnm-t td::before,.fxpd-t td::before{content:attr(data-label);display:block;font-size:13px;font-weight:700;color:var(--muted);margin-bottom:4px}
  /* 44 px tap targets (as site.css does for buttons ≤640 px); the article chips keep their look and get a larger invisible hit area */
  .fxpd-toc a,.fxnm-jump a,.fxpd-proc h3 a{min-height:44px;display:inline-flex;align-items:center}
  .fxpd-idx{gap:8px}
  .fxpd-idx .gref{min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center}
  .fxpd-bab dt a,.fxpd-at{min-height:44px}
  a.gref.fxnm-ref,.fxpd-q a.gref,.fxpd-t a.gref,.fxpd-note a.gref{position:relative}
  a.gref.fxnm-ref::after,.fxpd-q a.gref::after,.fxpd-t a.gref::after,.fxpd-note a.gref::after{content:"";position:absolute;inset:-11px -6px}
}
@media (max-width:480px){
  .fxcr-t{font-size:13px}
  .fxcr-t th,.fxcr-t td{padding-inline:6px}
  .fxcr-t td:nth-child(1),.fxcr-t td:nth-child(2){width:auto;white-space:normal}
  .fxcr-t th{font-size:13px;line-height:1.5}
}

/* ── print: controls off, table rows whole (a #/numbers row may break between its facts), quotes readable in black on white ── */
@media print{
  .fxcr-tools,.fx1-rel,.fxpd-toc,#fxnmP,#fxpdP{display:none!important}
  .fxcr-t,.fxnm-t,.fxpd-t{font-size:10.5pt}
  .fxcr-t th,.fxnm-t thead th,.fxpd-t thead th{background:none!important;color:#000!important;border-bottom:1.5px solid #000}
  .fxcr-t thead,.fxnm-t thead,.fxpd-t thead{display:table-header-group}
  .fxcr-t tr,.fxpd-ist,.fxpd-proc,.fxpd-bab dd,.fxnm-f,.fxpd-t td>*{break-inside:avoid} /* long two-law rows may break between facts */
  .fxnm-t tbody th,.fxpd-t tbody th{font-size:10.5pt}
  .fxnm-t thead th:first-child{width:14%}
  .fxcr-t tbody tr:nth-child(even) td,.fxnm-t tbody th{background:none!important}
  .fxcr-no{min-height:0;min-width:0;color:#000;font-size:11pt}
  .fxnm-q,.fxpd-q,.fxpd-bab dd{background:none!important;border-inline-start:2px solid #999;color:#000}
  .fxcr-st,.fxpd-win{background:none!important;color:#000!important;border:1px solid #000!important}
  .fxpd-bab,.fxpd-proc,.fxpd-ist,.fxpd-reg,.fxnm-x2,.fxcr-ans{box-shadow:none!important;background:none!important}
  .fxpd-bab>summary,.fxnm-list summary{min-height:0;padding:4px 0}
  .fxpd-procs{display:block}
  .fxpd-proc{margin-bottom:8px}
  /* DP-3: site.css keeps every tr whole; a two-law row taller than the space left then left the header alone at the foot of page 1 and
     a page about 70% empty. Rows may break between facts (each .fxnm-f stays whole), and the header stays with the first row. */
  .fxnm-t tbody tr{break-inside:auto}
  .fxnm-t thead{break-after:avoid}
  .fxnm-t tbody tr:first-child{break-before:avoid}
  /* DP-8: fixed columns, so the URLs that print after library links cannot squeeze the quoted text to two or three words a line */
  .fxpd-t{table-layout:fixed;width:100%}
  .fxpd-t thead th:nth-child(1){width:20%}
  .fxpd-t thead th:nth-child(2){width:42%}
  .fxpd-t td,.fxpd-t th{overflow-wrap:anywhere}
}

/* ════ v7.7 features — feat-pages2.css (merged into site.css at release: one render-blocking stylesheet instead of eight) ════ */
/* مبادرة التحوّل — v7.7 feature styles (feat-pages2.css). Tokens only (var(--…)) so the dark theme needs no extra rules. */
/* PKG-N2: #/services/readiness (feat-ready.js), #/services/clauses and #/services/justify (feat-checks.js). Every class starts with n2-. */

/* ── shared: notes under the title, quotes, «شرح الموقع» tag, regulation status, buttons ── */
.n2-notes{margin:12px 0 0;padding-inline-start:20px;font-size:14px;line-height:1.9;color:var(--text);max-width:860px}
.n2-notes li{margin:3px 0}
.n2-notes .n2-warn{font-weight:700;color:var(--amber-ink)}
.n2-notes+.n2-q{margin-top:12px}
.n2-acts{margin-top:14px;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.n2-acts .copybtn{min-height:44px}
.n2-xl{background:var(--new-fill)}
.n2-xl:hover{background:var(--new-fill);filter:brightness(1.1)}
.copybtn.n2-ghost{background:transparent;color:var(--ink);border:1.5px solid var(--field-line)}
.copybtn.n2-ghost:hover{background:var(--zebra)}
.n2-prog{margin-top:10px;font-size:14px;font-weight:700;color:var(--new-ink)}
.n2-prog:empty{display:none}
#app h2.display.n2-h{font-size:var(--fs-h3);display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.n2-q,.n2-pq{margin:6px 0;font-size:14px;line-height:1.95;color:var(--text)}
.n2-q{border-inline-start:3px solid var(--gold);background:var(--zebra);border-radius:8px;padding:6px 12px}
.n2-q cite,.n2-pq cite{display:block;font-style:normal;font-size:13px;font-weight:700;color:var(--gold-ink);line-height:1.7}
.n2-lead{font-size:15px;margin:0 0 12px;max-width:860px}
.n2-lead2{font-size:14px;color:var(--text);margin:0 0 12px;max-width:860px}
.n2-tag{display:inline-block;font-size:13px;font-weight:700;line-height:1.5;padding:0 8px;border-radius:var(--r-pill);background:var(--amber-bg);color:var(--amber-ink);border:1px solid var(--gold-tint-line);vertical-align:baseline}
.n2-site{font-size:13px;line-height:1.9;color:var(--text);margin:6px 0}
.n2-ref{font-size:13px;color:var(--muted);margin:4px 0}
.n2-reg{display:inline-block;font-size:13px;line-height:1.8;color:var(--muted);background:var(--grey-bg);border:1px dashed var(--muted);border-radius:var(--r-sm);padding:2px 10px;margin:6px 0}
.n2-note{font-size:13px;color:var(--new-ink);margin:6px 0;font-weight:700}
.n2-links{margin:4px 0 0;display:flex;flex-wrap:wrap;gap:0 16px}
.n2-links a,.n2-map a{display:inline-flex;align-items:center;min-height:44px;font-size:13px;font-weight:700}
.n2-in{width:100%;min-height:44px;padding:8px 10px;font:inherit;font-size:16px;color:var(--ink);background:var(--surface);border:1px solid var(--field-line);border-radius:var(--r-sm)}
.n2-in::placeholder{color:var(--muted)}
.n2-pv{display:none} /* print copy of a field (fxRdPv in feat-ready.js), shown instead of the field in print */

/* ── R1 readiness table: per item one row (item, owner, date, done) and one row with its basis across the width; cards on phones ── */
.n2-tblw{border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);overflow:hidden}
.n2-tbl{width:100%;border-collapse:collapse;font-size:14px}
.n2-tbl th{background:var(--brand);color:var(--on-brand);font-weight:700;font-size:13px;padding:9px 10px;text-align:start;vertical-align:bottom}
.n2-tbl th small{font-weight:400;font-size:13px;display:block}
.n2-tbl th:nth-child(1){width:40px}.n2-tbl th:nth-child(3){width:170px}.n2-tbl th:nth-child(4){width:230px}.n2-tbl th:nth-child(5){width:60px;text-align:center}
.n2-tbl td{padding:10px;vertical-align:top}
.n2-tbl tr.n2-r1>td{border-top:1px solid var(--line)}
.n2-tbl tr.n2-r2>td{padding-top:0;padding-bottom:14px}
.n2-no{font-weight:700;color:var(--muted);text-align:center}
.n2-item b{display:block;font-size:15px;line-height:1.7;color:var(--ink)}
.n2-src{display:block;font-size:13px;color:var(--muted);margin-top:4px}
.n2-x{display:block;font-size:13px;color:var(--text);margin-top:6px;line-height:1.8}
.n2-basis::before{content:attr(data-label);display:block;font-size:13px;font-weight:700;color:var(--muted);margin-bottom:2px}
.n2-bq{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(340px,100%),1fr));gap:8px 12px;align-items:start}
.n2-bq>.n2-q,.n2-bq>.n2-site,.n2-bq>.n2-ref{margin:0}
.n2-done{text-align:center}
.n2-ck{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:44px;min-height:44px;cursor:pointer;font-weight:700}
.n2-ck input,.n2-tick input{width:20px;height:20px;accent-color:var(--new-ink);flex:none;cursor:pointer}
@media (min-width:901px){.n2-ckt{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}}
.n2-tbl tr.n2-on>td{background:var(--new-bg)}

/* ── R2 clause cards (reuse .cmp/.cmprow/.panes) ── */
.n2-box{margin-top:14px;background:var(--zebra);border:1px solid var(--line);border-inline-start:3px solid var(--gold);border-radius:var(--radius);padding:12px 16px;max-width:900px}
#app .n2-box h2.n2-bh{font-size:var(--fs-h4);margin:0 0 6px}
.n2-lib{font-size:14px;line-height:1.9;color:var(--text);margin:8px 0 4px}
.n2-card .topic{flex-wrap:wrap}
.n2-card h3.n2-t{font-size:16px;margin:0;color:var(--ink)}
.n2-w{margin-inline-start:auto;font-size:13px;font-weight:400;color:var(--muted)}
.n2-map{display:flex;flex-wrap:wrap;align-items:center;gap:0 16px;font-size:13px;font-weight:700;color:var(--text);margin:-4px 0 6px}
.n2-card .pane .n2-pq{font-size:14px}
.pane-cur .n2-pq cite{color:var(--old)}
.pane-new .n2-pq cite{color:var(--new-ink)}
.n2-card.n2-on{border-color:var(--new-line);box-shadow:inset 0 0 0 1px var(--new-line)}

/* ── tick boxes (R2 «رُوجع», R3 grounds and conditions) ── */
.n2-ticks{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.n2-tick{display:flex;gap:10px;align-items:flex-start;min-height:44px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px 13px;font-size:14px;line-height:1.95;color:var(--text);cursor:pointer}
.n2-tick input{margin-top:6px}
.n2-tick cite{display:block;font-style:normal;font-size:13px;font-weight:700;color:var(--gold-ink);line-height:1.7}
.n2-tick:has(input:checked){background:var(--new-bg);border-color:var(--new-line)}
.n2-tick1{margin-top:10px;width:max-content;max-width:100%;align-items:center;font-weight:700;color:var(--ink)}
.n2-tick1 input{margin-top:0}
.n2-ticks li>.n2-reg{margin:4px 0 0;margin-inline-start:34px}

/* ── R3 checklist ── */
.n2-draft{margin:10px 0 0;display:inline-block;border:1.5px dashed var(--gold-tint-line);background:var(--amber-bg);color:var(--amber-ink);border-radius:var(--r-sm);padding:6px 14px;font-size:14px;font-weight:700;line-height:1.8}
.n2-seg button{font-size:14px;min-height:44px;padding:8px 16px}
.n2-acts .xbtns{gap:10px}
.n2-head{border-inline-start:3px solid var(--gold);background:var(--zebra);border-radius:8px;padding:8px 12px;margin:0 0 6px}
#app .n2-js h3.n2-h3{font-size:var(--fs-h4);margin:18px 0 8px;color:var(--ink)}
mark.n2-cond{background:var(--mark-bg);color:inherit;border-radius:3px;padding:0 2px}
.n2-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr));gap:12px 14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px}
.n2-fields1{grid-template-columns:1fr}
.n2-f{display:flex;flex-direction:column;gap:4px;font-size:14px;font-weight:700;color:var(--ink)}
.n2-f .n2-in{font-weight:400}
.n2-ta{min-height:110px;resize:vertical;line-height:1.8}

/* ── narrow screens and print: each readiness item becomes one card (its two rows joined) ── */
@media (max-width:900px){
  .n2-tblw{border:0;background:none;overflow:visible}
  .n2-tbl,.n2-tbl tbody{display:block}
  .n2-tbl thead{display:none}
  .n2-tbl tr.n2-r1{display:grid;grid-template-columns:28px minmax(0,1fr);gap:6px 8px;border:1px solid var(--line);border-bottom:0;border-radius:var(--r-md) var(--r-md) 0 0;padding:10px 12px 6px;background:var(--surface)}
  .n2-tbl tr.n2-r2{display:block;border:1px solid var(--line);border-top:0;border-radius:0 0 var(--r-md) var(--r-md);padding:2px 12px 10px;margin-bottom:10px;background:var(--surface)}
  .n2-tbl td{display:block;border:0!important;padding:0!important}
  .n2-tbl tr.n2-r1>td:not(.n2-no):not(.n2-item){grid-column:1/-1}
  .n2-tbl td.n2-no{text-align:start;padding-top:2px!important}
  .n2-tbl td[data-label]::before{content:attr(data-label);display:block;font-size:13px;font-weight:700;color:var(--muted);margin-bottom:2px}
  .n2-tbl [data-k="o"]::placeholder{color:transparent} /* DP-9: the caption above already says «المسؤول»; the hint is for the wide table */
  .n2-tbl td.n2-done{text-align:start}
  .n2-tbl tr.n2-on{background:var(--new-bg);border-color:var(--new-line)}
  .n2-tbl tr.n2-on>td{background:none}
}
@media (max-width:640px){
  .n2-w{margin-inline-start:0}
  .n2-tick1{width:auto}
  .n2-ticks li>.n2-reg{margin-inline-start:0}
}

/* ── print: controls hidden, fields become lines; long blocks may break between quotes, never inside one ── */
@media print{
  .n2-acts,.n2-links,.n2-seg,.n2-map a{display:none!important}
  .n2-tblw{overflow:visible;border:0}
  .n2-tbl tr.n2-r1{break-inside:avoid;break-after:avoid}
  .n2-tbl tr.n2-r2{break-inside:auto} /* site.css keeps every tr whole in print; a long basis row then left half-empty pages */
  .n2-card{break-inside:auto}.n2-card .topic,.n2-card .n2-map,.n2-card .plabel{break-after:avoid}
  .n2-tick,.n2-q,.n2-pq,.n2-fields,.n2-box,.n2-head,.n2-draft{break-inside:avoid}
  /* DP-1: a field prints only what fits its screen box (an input never wraps, a textarea keeps its screen height), so print shows
     its copy instead: the whole text, wrapped at the paper width; a blank copy keeps the line (or box) for writing by hand */
  #app .n2-in{display:none!important}
  .n2-pv{display:block;min-height:calc(1.8em + 17px);padding:8px 10px;font-size:16px;font-weight:400;line-height:1.8;color:var(--ink);border-bottom:1px dotted var(--ink);white-space:pre-wrap;overflow-wrap:anywhere}
  .n2-ta+.n2-pv{min-height:calc(7.2em + 18px);border:1px dotted var(--ink)} /* at least the 4-row box the page prints today */
  .n2-tbl tr.n2-on,.n2-tbl tr.n2-on>td,.n2-tick:has(input:checked){background:none!important}
  .n2-tag,.n2-reg,.n2-draft{background:none!important;color:var(--ink)!important;border:1px solid currentColor!important}
  mark.n2-cond{background:none;text-decoration:underline}
  .n2-q,.n2-box,.n2-head{background:none!important}
}
/* print: the committee member table uses the phone card layout (all fields, labelled check boxes) so no column is cut on A4 */
@media print{.memwrap:has(> .memtbl){overflow:visible;border:0;background:none}table.memtbl{min-width:0;display:block}.memtbl thead{display:none}.memtbl tbody{display:block}.memtbl tr{display:grid;grid-template-columns:repeat(3,1fr);gap:4px 10px;border:1px solid var(--line);border-radius:var(--r-md);padding:8px 12px;margin-bottom:8px}.memtbl td{display:block;border:0;padding:0}.memtbl td::before{content:attr(data-label);display:block;font-size:12px;color:var(--muted);font-weight:700}.memtbl td:not([data-label])::before{content:none}.memtbl input[type=text],.memtbl select{width:100%}.memtbl .cklbl{justify-content:flex-start}.memtbl td.ck{text-align:start}.memtbl .cklbl .cktx{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto;white-space:normal;font-size:12px;font-weight:700}.memtbl td:last-child{display:none}}