@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700;800&family=Readex+Pro:wght@500;600;700&display=swap');

:root{
  --org:#FF5700; --org2:#FF7A33; --pur:#3A2666; --vio:#6A5BFF;
  --ink:#1E1B33; --mut:#7A7594; --bg:#FBFBFF; --card:#fff;
  --line:#ECEAF6; --line2:#F1EFFA; --soft:#F5F3FB; --softer:#F8F7FD;
  --ok:#1FA97C; --bad:#E5484D;
  --sh:0 10px 34px rgba(58,38,102,.08); --sh2:0 4px 14px rgba(58,38,102,.07);
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;overflow-x:hidden}
body{font-family:'Tajawal',system-ui,sans-serif;background:var(--bg);color:var(--ink);direction:rtl;font-size:14.5px;
  display:flex;flex-direction:column;height:100vh}
/* وضع الزائر: نخفي أدوات التطبيق ونظهر زر الدخول */
#topLogin{display:none;padding:8px 18px;font-size:13.5px}
body.guest #topLogin{display:inline-flex}
body.guest .search,body.guest #vtoggle,body.guest #uchip,body.guest #menuBtn{display:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,textarea,select{font-family:inherit;color:inherit}
a{color:inherit;text-decoration:none}
svg{display:block}
.hide{display:none!important}

/* ---------------- دخول ---------------- */
#login{flex:1;min-height:0;overflow:auto;display:flex;align-items:center;justify-content:center;padding:22px;
  background:radial-gradient(1100px 520px at 85% -10%,rgba(106,91,255,.10),transparent 60%),
             radial-gradient(900px 500px at 8% 108%,rgba(255,87,0,.08),transparent 55%),var(--bg)}
.login-grid{display:flex;gap:46px;align-items:center;max-width:1000px;width:100%}
.login-hero{flex:1.15;min-width:0}
.login-hero .eyebrow{display:inline-flex;align-items:center;gap:7px;background:#F1EEFF;color:var(--vio);
  font-weight:700;font-size:12.5px;padding:6px 14px;border-radius:999px;margin-bottom:18px}
.login-hero h1{font-family:'Readex Pro',Tajawal,sans-serif;font-size:38px;line-height:1.25;margin-bottom:14px}
.login-hero h1 b{color:var(--org)}
.login-hero p{color:var(--mut);font-size:16px;line-height:1.9;max-width:460px}
.login-feats{margin-top:26px;display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:480px}
.login-feats .f{display:flex;gap:10px;align-items:flex-start;background:var(--card);border:1px solid var(--line);
  border-radius:14px;padding:12px 14px;box-shadow:var(--sh2)}
.login-feats .f svg{width:20px;height:20px;color:var(--org);flex:none;margin-top:2px}
.login-feats .f b{display:block;font-size:13.5px}
.login-feats .f span{color:var(--mut);font-size:12px}
.login-card{flex:.85;background:var(--card);border:1px solid var(--line);border-radius:22px;box-shadow:var(--sh);
  padding:38px 34px;text-align:center;max-width:400px}
.login-card .mark{width:64px;height:64px;margin:0 auto 16px;border-radius:18px;background:#FFF3EC;
  display:flex;align-items:center;justify-content:center;color:var(--org)}
.login-card .mark svg{width:34px;height:34px}
.login-card h2{font-family:'Readex Pro',Tajawal,sans-serif;font-size:21px;margin-bottom:6px}
.login-card .sub{color:var(--mut);font-size:13.5px;margin-bottom:24px;line-height:1.8}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:11px 22px;border-radius:999px;
  font-weight:700;font-size:14px;transition:.15s}
.btn svg{width:17px;height:17px}
.btn.primary{background:linear-gradient(135deg,var(--org),var(--org2));color:#fff;box-shadow:0 8px 22px rgba(255,87,0,.30)}
.btn.primary:hover{transform:translateY(-1px)}
.btn.ghost{background:var(--soft);color:var(--pur)}
.btn.ghost:hover{background:#EDEAF8}
.btn.danger{background:#FDECEC;color:var(--bad)}
.btn.wide{width:100%}
.login-card .note{margin-top:16px;color:var(--mut);font-size:12px;line-height:1.7}

/* ---------------- الهيكل ---------------- */
#app{display:flex;flex-direction:column;flex:1;min-height:0}
.top{background:var(--card);border-bottom:1px solid var(--line);z-index:40;flex:none}
.top .in{display:flex;align-items:center;gap:14px;padding:10px 18px;min-width:0}
.brand{display:flex;align-items:center;gap:9px;font-family:'Readex Pro',Tajawal,sans-serif;
  font-weight:700;font-size:18.5px;flex:none}
.brand .bmark{color:var(--org);width:29px;height:29px}
.brand .bmark svg{width:29px;height:29px}
.brand b{color:var(--org)}
.brand span{color:var(--pur)}
.search{flex:1;max-width:640px;position:relative;min-width:120px}
.search svg{width:17px;height:17px;color:var(--mut);position:absolute;right:14px;top:50%;transform:translateY(-50%)}
.search input{width:100%;border:1px solid var(--line);background:var(--softer);border-radius:999px;
  padding:9.5px 42px 9.5px 16px;font-size:14px;outline:none;transition:.15s}
.search input:focus{background:#fff;border-color:#CFC8F0;box-shadow:0 0 0 3px rgba(106,91,255,.10)}
.topend{margin-inline-start:auto;display:flex;align-items:center;gap:9px;flex:none}
.iconbtn{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  color:#5A5478;transition:.13s}
.iconbtn:hover{background:var(--soft)}
.iconbtn svg{width:19px;height:19px}
.iconbtn.on{background:#F1EEFF;color:var(--vio)}
.uchip{display:flex;align-items:center;gap:8px;padding:5px 12px 5px 6px;border:1px solid var(--line);
  border-radius:999px;background:var(--card)}
.uchip img,.uchip .uav{width:26px;height:26px;border-radius:50%;background:var(--pur);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700}
.uchip .un{font-size:13px;font-weight:500;max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.body{flex:1;display:flex;min-height:0}

/* ---------------- الشريط الجانبي ---------------- */
.side{width:242px;flex:none;border-inline-end:1px solid var(--line);background:var(--card);
  display:flex;flex-direction:column;padding:16px 12px 12px}
#newBtn{display:flex;align-items:center;gap:10px;background:linear-gradient(135deg,var(--org),var(--org2));
  color:#fff;font-weight:800;font-size:15px;padding:12px 18px;border-radius:16px;
  box-shadow:0 8px 22px rgba(255,87,0,.28);margin-bottom:16px;transition:.15s}
#newBtn:hover{transform:translateY(-1px)}
#newBtn svg{width:19px;height:19px}
.nav{display:flex;flex-direction:column;gap:2px}
.nav .it{display:flex;align-items:center;gap:11px;padding:9.5px 13px;border-radius:11px;color:#4A4566;
  font-weight:500;font-size:14px;transition:.12s;position:relative}
.nav .it svg{width:18.5px;height:18.5px;color:#8B84AC}
.nav .it:hover{background:var(--softer)}
.nav .it.on{background:#FFF3EC;color:var(--org);font-weight:700}
.nav .it.on svg{color:var(--org)}
.nav .sep{height:1px;background:var(--line2);margin:9px 6px}
.store{margin-top:auto;padding:13px 13px 6px}
.store .lbl{display:flex;justify-content:space-between;color:var(--mut);font-size:12px;margin-bottom:7px}
.store .bar{height:7px;background:var(--soft);border-radius:99px;overflow:hidden}
.store .bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--vio),var(--org));
  width:0%;transition:width .4s}

/* ---------------- المحتوى ---------------- */
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.crumbbar{display:flex;align-items:center;gap:6px;padding:13px 22px 8px;flex-wrap:wrap;min-height:47px}
.crumb{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.crumb a{padding:5px 11px;border-radius:9px;font-weight:600;color:#55506E;font-size:14.5px}
.crumb a:hover{background:var(--soft)}
.crumb a.cur{color:var(--ink);font-weight:800;font-size:16px}
.crumb .sepc{color:#C9C4E0}
.crumb .sepc svg{width:14px;height:14px}
.toolbar{margin-inline-start:auto;display:flex;align-items:center;gap:5px}
.toolbar .tb{display:inline-flex;align-items:center;gap:7px;padding:7.5px 13px;border-radius:10px;
  font-size:13px;font-weight:600;color:#4A4566;transition:.12s}
.toolbar .tb:hover{background:var(--soft)}
.toolbar .tb svg{width:16.5px;height:16.5px}
.toolbar .tb.warn{color:var(--bad)}
.selinfo{background:#F1EEFF;color:var(--vio);font-weight:700;font-size:12.5px;padding:6px 12px;border-radius:999px}

.files{flex:1;overflow:auto;padding:6px 22px 26px}
.gridwrap{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:13px}
.card{background:var(--card);border:1.5px solid var(--line);border-radius:15px;padding:0 0 11px;
  cursor:pointer;transition:.13s;position:relative;overflow:hidden;user-select:none}
.card:hover{box-shadow:var(--sh2);transform:translateY(-1px)}
.card.sel{border-color:var(--vio);box-shadow:0 0 0 3px rgba(106,91,255,.14)}
.card .thumb{height:104px;background:var(--softer);display:flex;align-items:center;justify-content:center;
  border-bottom:1px solid var(--line2);overflow:hidden}
.card .thumb svg{width:40px;height:40px}
.card .thumb img{width:100%;height:100%;object-fit:cover}
.card .cname{display:flex;align-items:center;gap:8px;padding:10px 12px 3px;font-weight:600;font-size:13.5px}
.card .cname .ic{flex:none;width:17px;height:17px}
.card .cname .ic svg{width:17px;height:17px}
.card .cname .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card .cmeta{padding:0 37px 0 12px;color:var(--mut);font-size:11.5px}
.card .starb{position:absolute;top:8px;inset-inline-start:8px;width:26px;height:26px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;color:#C9C4E0;background:rgba(255,255,255,.85);opacity:0;transition:.13s}
.card:hover .starb{opacity:1}
.card .starb.on{opacity:1;color:#F5A623}
.card .starb svg{width:15px;height:15px}
.card .dots{position:absolute;top:8px;inset-inline-end:8px;width:26px;height:26px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;color:#7A7594;background:rgba(255,255,255,.85);opacity:0;transition:.13s}
.card:hover .dots{opacity:1}
.card .dots svg{width:16px;height:16px}
.card .badge{position:absolute;bottom:44px;inset-inline-end:8px;background:rgba(58,38,102,.82);color:#fff;
  font-size:10.5px;padding:2px 8px;border-radius:99px;font-weight:600}

.listwrap{display:flex;flex-direction:column}
.lhead,.lrow{display:grid;grid-template-columns:minmax(200px,1fr) 130px 110px 150px 34px;gap:8px;align-items:center;
  padding:9px 12px;border-bottom:1px solid var(--line2)}
.lhead{color:var(--mut);font-size:12px;font-weight:700;position:sticky;top:0;background:var(--bg);z-index:2}
.lrow{cursor:pointer;border-radius:10px;border-bottom-color:transparent;user-select:none}
.lrow:hover{background:var(--softer)}
.lrow.sel{background:#F1EEFF}
.lrow .fnm{display:flex;align-items:center;gap:10px;font-weight:600;min-width:0}
.lrow .fnm .ic{width:19px;height:19px;flex:none}
.lrow .fnm .ic svg{width:19px;height:19px}
.lrow .fnm span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lrow .mut{color:var(--mut);font-size:12.5px}
.lrow .dots{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#7A7594}
.lrow .dots:hover{background:var(--soft)}
.lrow .dots svg{width:16px;height:16px}

.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:70px 20px;color:var(--mut)}
.empty svg{width:54px;height:54px;color:#D9D4EE;margin-bottom:14px}
.empty b{font-size:16px;color:#55506E;margin-bottom:5px}
.empty span{font-size:13px}
.trashnote{background:#FFF8EF;border:1px solid #F5E3C8;color:#8A6A2F;border-radius:12px;
  padding:10px 16px;font-size:12.5px;margin-bottom:12px}

/* سحب وإفلات */
#dropzone{position:fixed;inset:0;background:rgba(58,38,102,.34);z-index:200;display:flex;align-items:center;justify-content:center}
#dropzone .dz{background:var(--card);border:2px dashed var(--vio);border-radius:22px;padding:46px 66px;text-align:center}
#dropzone svg{width:44px;height:44px;color:var(--vio);margin:0 auto 12px}
#dropzone b{font-size:17px}

/* لوحة الرفع */
#uppanel{position:fixed;bottom:18px;inset-inline-start:18px;width:320px;background:var(--card);
  border:1px solid var(--line);border-radius:16px;box-shadow:var(--sh);z-index:180;overflow:hidden}
#uppanel .uphead{display:flex;align-items:center;justify-content:space-between;padding:11px 15px;
  background:var(--pur);color:#fff;font-weight:700;font-size:13px}
#uppanel .uphead button{color:#fff;opacity:.8;display:flex}
#uppanel .uphead svg{width:16px;height:16px}
#uppanel .uprows{max-height:220px;overflow:auto;padding:6px 0}
.uprow{display:flex;align-items:center;gap:10px;padding:7px 15px}
.uprow .ic{width:17px;height:17px;color:var(--mut);flex:none}
.uprow .ic svg{width:17px;height:17px}
.uprow .nm{flex:1;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.uprow .st{font-size:11px;color:var(--mut);flex:none}
.uprow .st.ok{color:var(--ok)} .uprow .st.bad{color:var(--bad)}
.uprow .pb{height:4px;background:var(--soft);border-radius:99px;overflow:hidden;flex:1}
.uprow .pb i{display:block;height:100%;background:var(--org);width:0%}

/* قائمة السياق */
#ctx{position:fixed;z-index:300;background:var(--card);border:1px solid var(--line);border-radius:14px;
  box-shadow:0 14px 44px rgba(30,27,51,.18);min-width:208px;padding:6px;overflow:hidden}
#ctx .ci{display:flex;align-items:center;gap:11px;padding:9px 13px;border-radius:9px;font-size:13.5px;
  font-weight:500;cursor:pointer;white-space:nowrap}
#ctx .ci:hover{background:var(--softer)}
#ctx .ci svg{width:17px;height:17px;color:#8B84AC}
#ctx .ci.warn{color:var(--bad)} #ctx .ci.warn svg{color:var(--bad)}
#ctx .csep{height:1px;background:var(--line2);margin:5px 8px}

/* المودالات */
.mback{position:fixed;inset:0;background:rgba(30,27,51,.42);z-index:400;display:flex;
  align-items:center;justify-content:center;padding:18px}
.modal{background:var(--card);border-radius:20px;box-shadow:0 24px 70px rgba(30,27,51,.25);
  width:100%;max-width:470px;max-height:88vh;display:flex;flex-direction:column;overflow:hidden}
.modal .mhead{display:flex;align-items:center;gap:10px;padding:17px 22px 13px;font-weight:800;font-size:16px}
.modal .mhead svg{width:19px;height:19px;color:var(--org)}
.modal .mhead .x{margin-inline-start:auto;width:30px;height:30px;border-radius:9px;display:flex;
  align-items:center;justify-content:center;color:var(--mut)}
.modal .mhead .x:hover{background:var(--soft)}
.modal .mbody{padding:2px 22px 18px;overflow:auto}
.modal .mfoot{display:flex;justify-content:flex-start;gap:9px;padding:13px 22px;border-top:1px solid var(--line2)}
.field{margin-bottom:13px}
.field label{display:block;font-size:12.5px;font-weight:700;color:#55506E;margin-bottom:6px}
.field input[type=text],.field input[type=email],.field input[type=number],.field select,.field textarea{
  width:100%;border:1px solid var(--line);border-radius:11px;padding:10px 13px;font-size:14px;outline:none;background:#fff}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#CFC8F0;box-shadow:0 0 0 3px rgba(106,91,255,.10)}
.mrow{display:flex;gap:9px}
.mrow>*{flex:1}
.shrow{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line2);font-size:13.5px}
.shrow:last-child{border-bottom:none}
.shrow .em{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;direction:ltr;text-align:right}
.shrow .pm{color:var(--mut);font-size:12px}
.shrow button{color:var(--bad);display:flex}
.shrow button svg{width:15px;height:15px}
.linkbox{display:flex;gap:8px;align-items:center;background:var(--softer);border:1px solid var(--line);
  border-radius:11px;padding:9px 12px;margin-top:4px}
.linkbox input{flex:1;border:none;background:none;outline:none;font-size:12px;direction:ltr;color:#4A4566}
.hint{color:var(--mut);font-size:12px;margin-top:7px;line-height:1.7}
.treewrap{max-height:290px;overflow:auto;border:1px solid var(--line);border-radius:12px;padding:7px}
.tnode{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:9px;cursor:pointer;font-size:13.5px;font-weight:500}
.tnode:hover{background:var(--softer)}
.tnode.on{background:#F1EEFF;color:var(--vio);font-weight:700}
.tnode svg{width:16px;height:16px;color:#B0A9D3;flex:none}
.tnode .tw{width:16px;height:16px;display:flex;align-items:center;justify-content:center;flex:none}

/* المعاينة */
#pview{position:fixed;inset:0;background:rgba(20,17,38,.92);z-index:500;display:flex;flex-direction:column}
#pview .phead{display:flex;align-items:center;gap:12px;padding:13px 20px;color:#fff}
#pview .phead .pnm{font-weight:700;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#pview .phead .pmeta{color:rgba(255,255,255,.55);font-size:12px}
#pview .phead .sp{flex:1}
#pview .phead .iconbtn{color:rgba(255,255,255,.85)}
#pview .phead .iconbtn:hover{background:rgba(255,255,255,.12)}
#pview .pbody{flex:1;display:flex;align-items:center;justify-content:center;min-height:0;padding:0 60px 20px;position:relative}
#pview .pbody img{max-width:100%;max-height:100%;border-radius:8px}
#pview .pbody iframe{width:100%;height:100%;border:none;border-radius:10px;background:#fff}
#pview .pbody video{max-width:100%;max-height:100%;border-radius:10px}
#pview .pbody audio{width:min(520px,90%)}
#pview .pbody pre{background:#fff;border-radius:12px;padding:22px;max-width:100%;max-height:100%;overflow:auto;
  font-size:13px;direction:ltr;text-align:left;width:min(860px,96%)}
#pview .pnavb{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:50%;
  background:rgba(255,255,255,.12);color:#fff;display:flex;align-items:center;justify-content:center}
#pview .pnavb:hover{background:rgba(255,255,255,.22)}
#pview .pnavb svg{width:20px;height:20px}
#pview .pnavb.prv{inset-inline-start:12px}
#pview .pnavb.nxt{inset-inline-end:12px}
#pview .noprev{color:rgba(255,255,255,.75);text-align:center}
#pview .noprev svg{width:52px;height:52px;margin:0 auto 14px;color:rgba(255,255,255,.4)}

/* المحرّرات */
.editor{position:fixed;inset:0;background:var(--bg);z-index:600;display:flex;flex-direction:column}
.ehead{display:flex;align-items:center;gap:11px;padding:9px 16px;background:var(--card);border-bottom:1px solid var(--line)}
.ehead .emark{width:32px;height:32px;border-radius:9px;background:#FFF3EC;color:var(--org);
  display:flex;align-items:center;justify-content:center;flex:none}
.ehead .emark svg{width:18px;height:18px}
.ehead input.etitle{border:none;outline:none;font-size:15.5px;font-weight:700;font-family:inherit;
  background:transparent;min-width:120px;flex:1;max-width:420px;border-radius:8px;padding:5px 8px}
.ehead input.etitle:hover{background:var(--softer)}
.ehead input.etitle:focus{background:var(--soft)}
.ehead .estat{color:var(--mut);font-size:12px;flex:none}
.ehead .estat.dirty{color:var(--org)}
.ehead .sp{flex:1}
.docwrap{flex:1;display:flex;min-height:0}
.docpane{flex:1;min-width:0;display:flex;flex-direction:column}
.docpane textarea{flex:1;border:none;outline:none;resize:none;padding:30px clamp(18px,6vw,70px);font-size:15.5px;
  line-height:2;background:var(--bg);font-family:'Tajawal',monospace}
.docprev{flex:1;min-width:0;border-inline-start:1px solid var(--line);background:#fff;overflow:auto;
  padding:30px clamp(18px,5vw,60px)}
.md{line-height:2;font-size:15px}
.md h1,.md h2,.md h3{font-family:'Readex Pro',Tajawal,sans-serif;margin:.9em 0 .4em;color:var(--pur)}
.md h1{font-size:26px}.md h2{font-size:21px}.md h3{font-size:17px}
.md p{margin:.5em 0}
.md ul,.md ol{margin:.5em 1.4em .5em 0;padding:0}
.md li{margin:.22em 0}
.md code{background:var(--soft);border-radius:6px;padding:2px 7px;font-size:13px;direction:ltr;unicode-bidi:embed}
.md pre{background:#241E3E;color:#EDEAFB;border-radius:12px;padding:16px;overflow:auto;direction:ltr;text-align:left;margin:.7em 0}
.md pre code{background:none;color:inherit;padding:0}
.md blockquote{border-inline-start:4px solid var(--org);background:var(--softer);border-radius:8px;
  padding:8px 16px;margin:.7em 0;color:#55506E}
.md a{color:var(--vio);text-decoration:underline}
.md hr{border:none;border-top:1px solid var(--line);margin:1.2em 0}
.md img{max-width:100%;border-radius:10px}
.md table{border-collapse:collapse;margin:.7em 0;width:100%}
.md th,.md td{border:1px solid var(--line);padding:7px 12px;font-size:13.5px}
.md th{background:var(--softer)}
.md input[type=checkbox]{accent-color:var(--org);margin-inline-end:6px}
.etools{display:flex;align-items:center;gap:3px;background:var(--card);border-bottom:1px solid var(--line);
  padding:5px 14px;flex-wrap:wrap}
.etools .tbn{display:flex;align-items:center;justify-content:center;min-width:31px;height:31px;padding:0 8px;
  border-radius:8px;color:#5A5478;font-weight:700;font-size:13px}
.etools .tbn:hover{background:var(--soft)}
.etools .tbn.on{background:#F1EEFF;color:var(--vio)}
.etools .tbn svg{width:16.5px;height:16.5px}
.etools .vsep{width:1px;height:20px;background:var(--line);margin:0 6px}

/* الكنفاس */
.cvwrap{flex:1;min-height:0;overflow:auto;background:#EFEDF8;display:flex}
.cvstage{margin:auto;padding:26px}
#cvel{background:#fff;box-shadow:0 10px 40px rgba(30,27,51,.14);border-radius:6px;touch-action:none;display:block}
.cvtools{display:flex;align-items:center;gap:4px;background:var(--card);border-bottom:1px solid var(--line);
  padding:6px 14px;flex-wrap:wrap}
.cvtools .tbn{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;color:#5A5478}
.cvtools .tbn:hover{background:var(--soft)}
.cvtools .tbn.on{background:#F1EEFF;color:var(--vio)}
.cvtools .tbn svg{width:18px;height:18px}
.cvtools .vsep{width:1px;height:22px;background:var(--line);margin:0 7px}
.cvtools .sw{width:23px;height:23px;border-radius:50%;border:2.5px solid transparent;cursor:pointer;flex:none}
.cvtools .sw.on{border-color:var(--pur);box-shadow:0 0 0 2px #fff inset}
.cvtools input[type=range]{width:90px;accent-color:var(--org)}
.cvtools .wlab{font-size:11.5px;color:var(--mut);min-width:22px;text-align:center}

/* ---------------- العارض الشامل ---------------- */
.vw-load{color:rgba(255,255,255,.75);font-size:15px}
.vw-doc{background:#fff;border-radius:14px;width:min(880px,96%);max-height:100%;overflow:auto;
  padding:34px clamp(20px,5vw,56px)}
.vw-doc .md,.fud-view{line-height:2.1;font-size:15px}
.vw-slides{background:transparent;padding:0}
.vw-slides .pslide{background:#fff;border-radius:14px;padding:22px 28px;margin-bottom:14px}
.vw-slides .pslide-n{color:#7A7594;font-size:11.5px;font-weight:700;margin-bottom:8px}
.vw-sheet{background:#fff;border-radius:14px;width:min(1100px,97%);height:92%;overflow:hidden;display:flex;flex-direction:column}

/* ---------------- المحرر الغني fudoc ---------------- */
.fdsel{border:1px solid var(--line);border-radius:9px;background:#fff;font-family:inherit;
  font-size:12.5px;font-weight:600;color:#4A4566;padding:5px 8px;outline:none;cursor:pointer}
.fud-wrap{flex:1;min-height:0;overflow:auto;background:#EFEDF8;padding:26px 14px 60px}
.fud-page{background:#fff;max-width:860px;margin:0 auto;min-height:calc(100vh - 220px);
  border-radius:8px;box-shadow:0 10px 40px rgba(30,27,51,.12);outline:none;
  padding:clamp(26px,6vw,64px);font-size:15.5px;line-height:2.1;color:var(--ink)}
.fud-page.ro{background:#fff}
.fud-page:focus{box-shadow:0 10px 40px rgba(30,27,51,.12),0 0 0 3px rgba(106,91,255,.14)}
.fud-page h1,.fud-page h2,.fud-page h3{font-family:'Readex Pro',Tajawal,sans-serif;color:var(--pur);margin:.8em 0 .35em}
.fud-page h1{font-size:27px}.fud-page h2{font-size:21px}.fud-page h3{font-size:17.5px}
.fud-page p{margin:.4em 0}
.fud-page ul,.fud-page ol{margin:.4em 1.5em .4em 0}
.fud-page li{margin:.2em 0}
.fud-page blockquote{border-inline-start:4px solid var(--org);background:var(--softer);
  border-radius:8px;padding:8px 16px;margin:.6em 0;color:#55506E}
.fud-page pre{background:#241E3E;color:#EDEAFB;border-radius:12px;padding:16px;overflow:auto;
  direction:ltr;text-align:left;margin:.6em 0;font-size:13px}
.fud-page a{color:var(--vio);text-decoration:underline}
.fud-page img{max-width:100%;border-radius:10px;margin:.4em 0}
.fud-page table{border-collapse:collapse;width:100%;margin:.6em 0}
.fud-page td,.fud-page th{border:1px solid var(--line);padding:8px 12px;min-width:60px}
.fud-page tr:first-child td{background:var(--softer)}
.fud-page input[type=checkbox]{accent-color:var(--org);margin-inline-end:7px;width:15px;height:15px}
.fud-page ul.fud-check{list-style:none;margin-inline-start:.3em}
.fud-view table{border-collapse:collapse;width:100%;margin:.6em 0}
.fud-view td,.fud-view th{border:1px solid var(--line);padding:7px 11px}
.fud-view input[type=checkbox]{accent-color:var(--org);margin-inline-end:6px}
.fud-view blockquote{border-inline-start:4px solid var(--org);background:var(--softer);border-radius:8px;padding:8px 16px;margin:.6em 0}
.fud-view img{max-width:100%;border-radius:10px}
.fud-view h1,.fud-view h2,.fud-view h3{font-family:'Readex Pro',Tajawal,sans-serif;color:var(--pur);margin:.7em 0 .3em}

/* ---------------- شبكة الجداول fusheet ---------------- */
.fsg-host{flex:1;min-height:0;display:flex;flex-direction:column;outline:none}
.fsg{display:flex;flex-direction:column;min-height:0;height:100%;outline:none}
.fsg-fbar{display:flex;align-items:center;gap:9px;padding:7px 14px;background:var(--card);
  border-bottom:1px solid var(--line);flex:none}
.fsg-ref{min-width:64px;text-align:center;background:var(--softer);border:1px solid var(--line);
  border-radius:8px;padding:6px 10px;font-size:12.5px;font-weight:700;color:var(--pur);direction:ltr}
.fsg-fx{color:var(--mut);display:flex}
.fsg-fx svg{width:17px;height:17px}
.fsg-fbar input{flex:1;border:1px solid var(--line);border-radius:9px;padding:7px 12px;
  font-size:13.5px;outline:none;font-family:ui-monospace,Menlo,monospace}
.fsg-fbar input:focus{border-color:#CFC8F0;box-shadow:0 0 0 3px rgba(106,91,255,.10)}
.fsg-scroll{flex:1;min-height:0;overflow:auto;background:#fff}
.fsg-tbl{border-collapse:separate;border-spacing:0;font-size:13px;table-layout:fixed}
.fsg-tbl th,.fsg-tbl td{border-inline-end:1px solid #E8E6F4;border-bottom:1px solid #E8E6F4;padding:0 9px;
  height:29px;min-width:88px;max-width:320px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;
  vertical-align:middle;text-align:right;position:relative}
.fsg-tbl thead th{background:#F6F5FB;color:#55506E;font-size:11.5px;font-weight:700;text-align:center;
  position:sticky;top:0;z-index:3;user-select:none;cursor:default}
.fsg-tbl .fsg-rh{background:#F6F5FB;color:#8B84AC;font-size:11px;font-weight:700;text-align:center;
  position:sticky;inset-inline-start:0;z-index:2;min-width:42px;width:42px;user-select:none}
.fsg-tbl .fsg-corner{position:sticky;inset-inline-start:0;top:0;z-index:4;background:#F0EEF8;min-width:42px;width:42px}
.fsg-tbl td{cursor:cell;background:#fff}
.fsg-tbl td.fsg-num{direction:ltr;text-align:left}
.fsg-tbl td.sel{background:#F1EEFF}
.fsg-tbl td.anch{outline:2px solid var(--vio);outline-offset:-2px;background:#fff}
.fsg-tbl td.editing{padding:0;overflow:visible}
.fsg-edit{position:absolute;inset:0;border:2px solid var(--vio);border-radius:3px;outline:none;
  padding:0 7px;font:inherit;background:#fff;z-index:5;min-width:100%}
.fsg-rz{position:absolute;inset-inline-start:-4px;top:0;bottom:0;width:8px;cursor:col-resize;z-index:5}
.fsg-tabs{display:flex;gap:5px;align-items:center;background:var(--card);border-top:1px solid var(--line);
  padding:6px 12px;overflow-x:auto;flex:none}
.fsg-tab{border:1px solid var(--line);background:var(--softer);border-radius:9px 9px 0 0;padding:6px 16px;
  font-size:12.5px;font-weight:700;color:#55506E;white-space:nowrap}
.fsg-tab.on{background:#fff;color:var(--org);border-bottom-color:#fff;box-shadow:0 -2px 8px rgba(58,38,102,.06)}
.fsg-tab.fsg-add{border-radius:9px;padding:6px 12px;font-size:15px}
.fsg-status{position:absolute;bottom:52px;inset-inline-start:16px;background:var(--pur);color:#fff;
  border-radius:999px;padding:6px 16px;font-size:12px;font-weight:600;pointer-events:none;z-index:20}
.fsg-status:empty{display:none}

/* توست */
#toasts{position:fixed;bottom:20px;right:50%;transform:translateX(50%);z-index:900;display:flex;
  flex-direction:column;gap:8px;align-items:center}
.toast{background:var(--pur);color:#fff;padding:10px 20px;border-radius:999px;font-size:13.5px;font-weight:600;
  box-shadow:0 10px 30px rgba(30,27,51,.3);display:flex;align-items:center;gap:9px;animation:tin .2s}
.toast.bad{background:var(--bad)}
.toast svg{width:16px;height:16px}
@keyframes tin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* الإدارة */
.adminwrap{padding:4px 0 30px}
.acards{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:13px;margin-bottom:20px}
.acard{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px 18px;box-shadow:var(--sh2)}
.acard .k{color:var(--mut);font-size:12.5px;margin-bottom:5px}
.acard .v{font-family:'Readex Pro',Tajawal,sans-serif;font-size:22px;font-weight:700;color:var(--pur)}
.atable{width:100%;border-collapse:collapse;background:var(--card);border-radius:14px;overflow:hidden;
  border:1px solid var(--line);margin-bottom:20px}
.atable th{background:var(--softer);text-align:right;padding:10px 14px;font-size:12.5px;color:#55506E}
.atable td{padding:9px 14px;border-top:1px solid var(--line2);font-size:13px}
.atable td.ltr{direction:ltr;text-align:right}
.atable .qedit{color:var(--vio);font-weight:700;cursor:pointer;font-size:12px}
.alog{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:6px 16px}
.alog .lr{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid var(--line2);font-size:12.5px;flex-wrap:wrap}
.alog .lr:last-child{border-bottom:none}
.alog .lt{color:var(--mut);flex:none;direction:ltr}
.alog .la{font-weight:700;color:var(--pur);flex:none}
.alog .ln{color:#4A4566}

.h2sec{font-family:'Readex Pro',Tajawal,sans-serif;font-size:16px;margin:4px 0 12px;color:var(--pur)}

/* استجابة */
@media(max-width:860px){
  .side{position:fixed;inset-inline-start:0;top:0;bottom:0;z-index:150;transform:translateX(100%);transition:.2s;box-shadow:var(--sh)}
  [dir=rtl] .side{transform:translateX(100%)}
  .side.open{transform:none}
  #menuBtn{display:flex!important}
  .login-grid{flex-direction:column;gap:26px}
  .login-hero h1{font-size:28px}
  .login-feats{grid-template-columns:1fr}
  .lhead,.lrow{grid-template-columns:minmax(140px,1fr) 90px 34px}
  .lhead .hcol3,.lrow .rcol3,.lhead .hcol4,.lrow .rcol4{display:none}
  .docwrap.split .docprev{display:none}
  #uppanel{width:calc(100vw - 36px)}
  .uchip .un{display:none}
}
#menuBtn{display:none}
#sideback{position:fixed;inset:0;background:rgba(30,27,51,.3);z-index:140}
@media(max-width:640px){
  .top .in{flex-wrap:wrap;row-gap:7px;padding:8px 12px;gap:9px}
  .search{order:5;flex-basis:100%;max-width:none}
  .ehead{flex-wrap:wrap;padding:8px 10px;gap:7px}
  .ehead input.etitle{min-width:90px;font-size:14px;flex:1 1 120px}
  .ehead .btn{padding:8px 14px;font-size:12.5px}
  .etools{padding:4px 8px;gap:2px}
  .etools .tbn{min-width:29px;height:29px}
  .fud-wrap{padding:12px 6px 40px}
  .fud-page{padding:20px 16px;min-height:60vh}
  .fsg-fbar{padding:6px 8px;gap:6px}
  .fsg-ref{min-width:52px;padding:6px 6px}
  .gridwrap{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
  .card .thumb{height:86px}
}