/* أدوات nerp.sa التفاعلية — تصميم مشترك بهوية الموقع */
:root{--plum:#3b123f;--deep:#260a2b;--plum2:#5a2b60;--gold:#c5a05a;--goldSoft:#eadbb9;--gold2:#f3e9d2;--rose:#c97887;--roseSoft:#f2dfe1;
  --ivory:#fbf8f3;--ivory2:#f4eee7;--paper:#fffdfa;--ink:#211827;--ink2:#5f5463;--line:#e7dfe5;--ok:#3f6b52;--okSoft:#e6f0e8;--bad:#9a3f39;--badSoft:#f7e7e3;--warn:#8a5a24;--warnSoft:#f8eedf}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--ivory:#140d16;--ivory2:#1d1520;--paper:#1d1520;--ink:#f4edf5;--ink2:#b9adbb;--line:#3a2c3d;--gold2:#3b3220;--roseSoft:#3a2230;--okSoft:#12301f;--badSoft:#3a1613;--warnSoft:#3b3220;--ok:#8fc4a4;--bad:#e8a39d;--warn:#e0b880}}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ivory);color:var(--ink);font-family:"IBM Plex Sans Arabic",-apple-system,"Segoe UI",Tahoma,sans-serif;line-height:1.75;font-size:16px}
a{color:var(--plum)}
.top{background:linear-gradient(135deg,var(--deep),var(--plum));color:#fffdfa}.top .w{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-block:14px}
.brand{color:#fffdfa;text-decoration:none;font-weight:700;font-size:1.1rem;display:flex;align-items:center;gap:10px}
.brand i{width:30px;height:30px;border-radius:50%;background:var(--gold);color:var(--deep);display:grid;place-items:center;font-style:normal;font-family:Georgia,serif}
.top nav{display:flex;gap:8px;flex-wrap:wrap}.top nav a{color:#fffdfa;opacity:.9;text-decoration:none;border:1px solid rgba(255,255,255,.4);border-radius:999px;padding:6px 14px;font-size:.85rem}
.w{max-width:960px;margin:0 auto;padding-inline:16px}main{padding:22px 0 56px}
.crumb{font-size:.85rem;color:var(--ink2);margin-bottom:12px}.crumb a{color:var(--ink2)}
h1{font-size:1.85rem;line-height:1.35;margin:0 0 8px;color:var(--plum)}h2{font-size:1.2rem;margin:0 0 12px;color:var(--plum)}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) h1,:root:not([data-theme="light"]) h2,:root:not([data-theme="light"]) a{color:var(--gold)}}
.lead{color:var(--ink2);margin:0 0 20px;font-size:1.02rem}
.card{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:20px 22px;margin-top:18px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}@media(max-width:640px){.grid2{grid-template-columns:1fr}}
.field{display:flex;flex-direction:column;gap:6px}.field label{font-weight:600;font-size:.92rem}
.field small{color:var(--ink2);font-size:.8rem}
input[type=number],input[type=text]{font:inherit;padding:11px 14px;border:1px solid var(--line);border-radius:12px;background:var(--gold2);color:var(--ink);width:100%}
input:focus{outline:2px solid var(--plum);outline-offset:1px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-weight:700;border:0;border-radius:999px;padding:12px 24px;background:var(--plum);color:#fffdfa;cursor:pointer;text-decoration:none}
.btn:hover{background:var(--deep)}.btn.gold{background:var(--gold);color:var(--deep)}.btn.line{background:transparent;color:var(--plum);border:1.5px solid var(--plum)}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.chip{font:inherit;font-size:.88rem;border:1.5px solid var(--plum);background:transparent;color:var(--plum);border-radius:999px;padding:7px 16px;cursor:pointer}
.chip.on{background:var(--plum);color:#fffdfa}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-top:6px}
.kpi{background:var(--ivory2);border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.kpi b{display:block;font-size:1.6rem;color:var(--plum);line-height:1.3}.kpi span{color:var(--ink2);font-size:.85rem}
.status{display:inline-block;border-radius:999px;padding:4px 14px;font-weight:700;font-size:.9rem}
.status.ok{background:var(--okSoft);color:var(--ok)}.status.bad{background:var(--badSoft);color:var(--bad)}.status.mid{background:var(--warnSoft);color:var(--warn)}
table.t{width:100%;border-collapse:collapse;font-size:.92rem}table.t th,table.t td{border-bottom:1px solid var(--line);padding:9px 8px;text-align:right}
table.t th{color:var(--ink2);font-weight:600;font-size:.82rem}table.t input{padding:7px 10px;max-width:130px}
.bar{height:12px;background:var(--ivory2);border-radius:99px;overflow:hidden;min-width:60px}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--rose),var(--gold));border-radius:99px}
.note{font-size:.85rem;color:var(--ink2);margin-top:12px}
.q{display:grid;grid-template-columns:1fr auto;gap:8px 16px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.q p{margin:0}.q .dim{display:block;font-size:.76rem;color:var(--ink2)}
.scale{display:flex;gap:4px;align-items:center;flex-wrap:wrap}.scale em{font-style:normal;font-size:.75rem;color:var(--ink2);min-width:46px}
.scale label{position:relative}.scale input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.scale span{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1.5px solid var(--line);font-weight:700;font-size:.85rem;background:var(--paper);cursor:pointer}
.scale input:checked+span{background:var(--plum);border-color:var(--plum);color:#fffdfa}.scale input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
.scale.want input:checked+span{background:var(--gold);border-color:var(--gold);color:var(--deep)}
@media(max-width:640px){.q{grid-template-columns:1fr}}
.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:.85rem;color:var(--ink2)}.legend i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-inline-end:6px;vertical-align:-1px}
.hide{display:none !important}
.tools{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.tool{display:flex;flex-direction:column;gap:8px;background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:18px;text-decoration:none;color:var(--ink)}
.tool:hover{border-color:var(--gold);box-shadow:0 12px 24px rgba(59,18,63,.08)}.tool b{color:var(--plum);font-size:1.05rem}.tool span{color:var(--ink2);font-size:.9rem}.tool em{font-style:normal;align-self:flex-start;background:var(--gold2);border-radius:999px;padding:2px 10px;font-size:.78rem}
.dlx{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;background:linear-gradient(135deg,var(--deep),var(--plum));color:#fffdfa;border:0}
.dlx h2{color:#fffdfa !important;margin:0}.dlx p{margin:4px 0 0;opacity:.85}
footer{border-top:1px solid var(--line);padding:22px 0;font-size:.85rem;color:var(--ink2);text-align:center}
@media print{.top,footer,.no-print{display:none !important}body{background:#fff}}
/* مسار الموارد البشرية بالعربي (/learn) */
.lhero{padding:6px 0 4px}.lnum{display:inline-block;background:var(--gold2);color:var(--plum);border-radius:999px;padding:3px 12px;font-size:.8rem;font-weight:700;margin-bottom:8px}
.lmeta{display:flex;gap:8px;flex-wrap:wrap}.lmeta span{border:1px solid var(--line);background:var(--paper);border-radius:999px;padding:4px 12px;font-size:.82rem;color:var(--ink2)}
.concepts{display:grid;gap:4px}.concept{display:grid;grid-template-columns:auto 1fr;gap:14px;padding:14px 0;border-bottom:1px solid var(--line)}.concept:last-child{border-bottom:0}
.cn{font-weight:800;color:var(--gold);font-size:1.1rem;line-height:1.6}.concept h3{margin:0 0 4px;font-size:1.05rem;color:var(--plum)}.concept p{margin:0}
.tip{margin-top:8px !important;background:var(--ivory2);border-inline-start:3px solid var(--gold);border-radius:8px;padding:8px 12px;font-size:.9rem;color:var(--ink2)}
.tip.sa{background:var(--okSoft);border-color:var(--ok);color:var(--ink)}
.mists{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.mist{background:var(--badSoft);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:4px}
.mist b{color:var(--bad)}.mist span{font-size:.9rem;color:var(--ink2)}
.tool.tl{border-color:var(--gold);background:var(--gold2)}
.qq{padding:16px 0;border-bottom:1px solid var(--line)}.qq:last-child{border-bottom:0}
.qt{margin:0 0 10px;font-weight:600}.qt span{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--plum);color:#fffdfa;font-size:.8rem;margin-inline-end:8px}
.qo{display:grid;gap:8px}.qo button{font:inherit;text-align:start;background:var(--paper);color:var(--ink);border:1.5px solid var(--line);border-radius:12px;padding:10px 14px;cursor:pointer;line-height:1.6}
.qo button:hover:not(:disabled){border-color:var(--plum)}.qo button:disabled{cursor:default}
.qo button.right{background:var(--okSoft);border-color:var(--ok);color:var(--ok);font-weight:600}.qo button.wrong{background:var(--badSoft);border-color:var(--bad);color:var(--bad)}
.qe{margin:10px 0 0;background:var(--ivory2);border-radius:10px;padding:10px 14px;font-size:.92rem}
.qscore{font-weight:700;color:var(--plum)}
.qres{margin-top:18px;background:var(--gold2);border-radius:14px;padding:16px 18px}.qres h3{margin:0;color:var(--plum)}.qres p{margin:4px 0 12px}
.lnav{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.lnav a{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:12px 14px;text-decoration:none;font-weight:700;display:flex;flex-direction:column}
.lnav a small{font-weight:400;color:var(--ink2);font-size:.78rem}.lnav a:hover{border-color:var(--gold)}
@media(max-width:640px){.lnav{grid-template-columns:1fr}}
.doms{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px;margin-top:18px}
.dom{display:flex;flex-direction:column;gap:8px;background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:18px;text-decoration:none;color:var(--ink)}
.dom:hover{border-color:var(--gold);box-shadow:0 12px 24px rgba(59,18,63,.08)}.dom b{color:var(--plum);font-size:1.1rem}.dom>span:not(.lnum){color:var(--ink2);font-size:.9rem;flex:1}.dom .lnum{align-self:flex-start;margin:0}
.dprog{display:block;height:8px;background:var(--ivory2);border-radius:99px;overflow:hidden}.dprog s{display:block;height:100%;background:linear-gradient(90deg,var(--rose),var(--gold));text-decoration:none}
.dst{font-style:normal;font-size:.8rem;color:var(--ink2)}.dom.done .dst{color:var(--ok);font-weight:700}
.steps{margin:0;padding-inline-start:20px}.steps li{margin:6px 0}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .concept h3,:root:not([data-theme="light"]) .dom b,:root:not([data-theme="light"]) .qres h3,:root:not([data-theme="light"]) .qscore,:root:not([data-theme="light"]) .lnum{color:var(--gold)}}