/* 0.22.0 安装教程页（includes/guide22.php）。颜色跟随站点改版变量 --nr-*，浅色模式由站点切换。 */
.nex22-wrap{max-width:1040px;margin:0 auto;padding:28px 16px 64px}
.nex22{--g-bg:var(--nr-bg,#0a0e15);--g-card:#0f141d;--g-card2:#131a25;--g-line:var(--nr-line,#232d3f);--g-line2:var(--nr-line-2,#2a3550);--g-fg:#e8edf5;--g-soft:#c3ccda;--g-muted:var(--nr-muted,#8b95a8);--g-accent:var(--nr-accent,#0a6cff);--g-ice:#c8fbff;--g-gold:var(--nr-gold,#ffb547);--g-bad:#ff8a8a;--g-ok:#5ee0a0;--g-win:#1c1f26;--g-win2:#24282f;--g-winline:#33373f;--g-wintext:#e6e6e6;--g-hl:rgba(10,108,255,.16);
 color:var(--g-fg);font-size:15px;line-height:1.7}
html:is([data-bs-theme=light],[data-nex-theme=light],[data-theme=light]) .nex22{--g-card:#fff;--g-card2:#f7f9fc;--g-line:#e1e7f0;--g-line2:#d3dbe7;--g-muted:#5f6b7e;--g-fg:#111a2b;--g-soft:#3a4558;--g-ice:#0a6cff;--g-bad:#c0392b;--g-ok:#13804f;--g-gold:#a35f00;--g-win:#f9f9fb;--g-win2:#eef0f4;--g-winline:#d9dde4;--g-wintext:#1f232a;--g-hl:rgba(10,108,255,.1)}
.nex22 *{box-sizing:border-box}
.nex22 h1,.nex22 h2{color:var(--g-fg);text-wrap:balance;margin:0}
.nex22 a{text-decoration:none}

/* 头部 */
.nex22-head{padding:8px 0 28px;border-bottom:1px solid var(--g-line)}
.nex22-kicker{margin:0 0 6px;font:600 12px/1 var(--nr-num,ui-monospace,monospace);letter-spacing:.18em;color:var(--g-accent)}
.nex22-head h1{font-size:clamp(28px,4.4vw,42px);line-height:1.2;font-weight:800}
.nex22-head h1 em{font-style:normal;color:var(--g-ice)}
.nex22-lead{max-width:62ch;margin:12px 0 20px;color:var(--g-soft)}
.nex22-prep{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;padding:14px 16px;border:1px solid var(--g-line2);border-radius:12px;background:var(--g-card)}
.nex22-prep>div{display:flex;flex-direction:column;margin-right:auto;min-width:200px}
.nex22-prep>div b{font-size:15px}.nex22-prep>div span{font-size:13px;color:var(--g-muted)}
.nex22-btn{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 14px;border-radius:8px;background:var(--g-accent);color:#fff!important;font-size:14px;font-weight:600;transition:transform .15s,filter .15s}
.nex22-btn:hover{transform:translateY(-1px);filter:brightness(1.1)}
.nex22-btn.is-ghost{background:transparent;color:var(--g-fg)!important;border:1px solid var(--g-line2)}
.nex22-btn svg{transition:transform .15s}.nex22-btn:hover svg{transform:translateX(2px)}
/* 快捷导览 */
.nex22-nav{display:grid;gap:14px;margin-top:18px}
.nex22-ask,.nex22-toc{display:flex;align-items:flex-start;gap:12px}
.nex22-ask>b,.nex22-toc>b{flex:0 0 auto;padding-top:6px;font-size:13px;color:var(--g-muted);white-space:nowrap}
.nex22-ask>div,.nex22-toc>div{display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.nex22-ask a{padding:5px 12px;border-radius:999px;background:rgba(255,181,71,.1);border:1px solid rgba(255,181,71,.3);color:var(--g-fg)!important;font-size:13.5px;transition:background .15s,border-color .15s,transform .15s}
.nex22-ask a:hover{background:rgba(255,181,71,.2);border-color:var(--g-gold);transform:translateY(-1px)}
.nex22-toc a{display:inline-flex;align-items:center;gap:8px;padding:5px 12px 5px 5px;border-radius:999px;border:1px solid var(--g-line);color:var(--g-soft)!important;font-size:13.5px;transition:border-color .15s,color .15s}
.nex22-toc a:hover{border-color:var(--g-accent);color:var(--g-fg)!important}
.nex22-toc i{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--g-card2);border:1px solid var(--g-line2);font:normal 700 12px/1 var(--nr-num,ui-monospace,monospace);color:var(--g-ice)}
.nex22-toc a.is-warn i{color:var(--g-bad);border-color:var(--g-bad)}

/* 新手易错 */
.nex22-pits{padding:36px 0 8px;scroll-margin-top:80px}
.nex22-pits h2,.nex22-video h2{font-size:24px}
.nex22-pit-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.nex22-pit{display:flex;flex-direction:column;gap:8px;padding:14px 16px;border-radius:12px;background:var(--g-card);border:1px solid var(--g-line);border-top:3px solid var(--g-bad)}
.nex22-pit>b{display:flex;align-items:center;gap:8px;font-size:15.5px;color:var(--g-fg)}
.nex22-pit>b span{display:grid;place-items:center;width:20px;height:20px;border-radius:5px;background:var(--g-bad);color:#fff;font:700 11.5px/1 var(--nr-num,ui-monospace,monospace)}
.nex22-pit p{display:flex;gap:8px;margin:0;padding:6px 9px;border-radius:6px;font:13px/1.5 Consolas,"Microsoft YaHei",ui-monospace,monospace;word-break:break-all}
.nex22-pit p i{flex:0 0 auto;font-style:normal;font-weight:800}
.nex22-pit p.no{background:rgba(255,138,138,.1);color:var(--g-bad);text-decoration:line-through;text-decoration-color:rgba(255,138,138,.5)}
.nex22-pit p.no i{text-decoration:none}
.nex22-pit p.ok{background:rgba(94,224,160,.1);color:var(--g-ok)}
.nex22-pit small{margin-top:auto;font-size:12.5px;color:var(--g-muted)}
.nex22-step-text li.is-warn{padding-left:0;color:var(--g-fg)}
.nex22-step-text li.is-warn::before{display:none}
.nex22-step-text li.is-warn i{display:inline-block;margin-right:7px;padding:1px 6px;border-radius:4px;background:var(--g-bad);color:#fff;font:normal 700 11px/1.5 "Microsoft YaHei",system-ui,sans-serif;vertical-align:1px}

/* 演示视频 */
.nex22-video{padding:28px 0 8px;scroll-margin-top:80px}
.nex22-video-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin-bottom:14px}
.nex22-video-head span{color:var(--g-muted);font-size:14px}
.nex22-video video{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:12px;background:#000;border:1px solid var(--g-line2)}

/* 步骤 */
.nex22-steps{list-style:none;margin:0;padding:0;counter-reset:s}
.nex22-step{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:28px;padding:36px 0;border-bottom:1px solid var(--g-line);scroll-margin-top:80px}
.nex22-step-text{min-width:0}
.nex22-no{display:inline-block;margin-bottom:6px;font:600 12px/1 var(--nr-num,ui-monospace,monospace);letter-spacing:.12em;color:var(--g-accent)}
.nex22-step h2{font-size:22px;line-height:1.35}
.nex22-step-text>p{margin:8px 0 10px;color:var(--g-soft)}
.nex22-step-text ul{margin:0 0 14px;padding:0;list-style:none}
.nex22-step-text li{position:relative;padding-left:18px;margin:4px 0;font-size:14px;color:var(--g-soft)}
.nex22-step-text li::before{content:"";position:absolute;left:3px;top:.72em;width:6px;height:6px;border-radius:50%;background:var(--g-accent)}
.nex22-step-figs{display:grid;gap:16px;min-width:0}

/* 窗口示意图（类 Windows 11） */
.nex22-win{margin:0;border-radius:10px;overflow:hidden;background:var(--g-win);border:1px solid var(--g-winline);color:var(--g-wintext);font:13px/1.4 "Segoe UI","Microsoft YaHei",system-ui,sans-serif;box-shadow:0 10px 28px rgba(0,0,0,.28)}
.nex22-tb{display:flex;align-items:center;justify-content:space-between;height:32px;padding:0 0 0 12px;background:var(--g-win2)}
.nex22-tb .t{font-size:12px;opacity:.85}
.nex22-tb .c{display:flex}.nex22-tb .c i{width:40px;text-align:center;font-style:normal;font-size:12px;opacity:.6}
.nex22-addr{display:flex;align-items:center;gap:8px;margin:8px 10px 0;padding:5px 10px;border-radius:6px;background:var(--g-win2);font-size:12px}
.nex22-addr .nex22-ic{width:14px;height:14px;opacity:.7}
.nex22-wb{position:relative;padding:12px}
.nex22-ic{display:inline-block;width:22px;height:22px;flex:0 0 auto}.nex22-ic svg{display:block;width:100%;height:100%}
.nex22-grid{display:flex;gap:18px;padding:6px 4px 10px}
.nex22-tile{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;width:96px;padding:10px 6px;border-radius:6px;font-size:12px;text-align:center}
.nex22-tile .nex22-ic{width:46px;height:46px}
.nex22-tile.is-dim{opacity:.45}
.nex22-list{display:flex;flex-direction:column}
.nex22-row{position:relative;display:grid;grid-template-columns:22px minmax(0,1fr) 112px 64px 22px;align-items:center;gap:10px;padding:5px 8px;border-radius:5px;font-size:12.5px}
.nex22-row .n{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nex22-row .ty,.nex22-row .sz{opacity:.6;font-size:12px;white-space:nowrap}.nex22-row .sz{text-align:right}
.nex22-row.hd{opacity:.6;font-size:12px;padding-bottom:6px;border-bottom:1px solid var(--g-winline);margin-bottom:4px}
.is-hl{background:var(--g-hl);outline:1.5px solid var(--g-accent);outline-offset:-1.5px}
.nex22-row.is-go{outline-width:2px}
.nex22-row.is-no{opacity:.5}.nex22-row.is-no .n{text-decoration:line-through}
.nex22-pin{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--g-accent);color:#fff;font:700 11.5px/1 var(--nr-num,ui-monospace,monospace);box-shadow:0 0 0 3px rgba(10,108,255,.25);vertical-align:middle}
.nex22-tile .nex22-pin,.nex22-row .nex22-pin{position:absolute;right:-8px;top:-8px}
.nex22-row .nex22-pin{position:static;margin:0}
.nex22-row.is-no .nex22-pin{background:#6b778c;box-shadow:none}
.nex22-cap{margin-top:10px;padding-top:9px;border-top:1px dashed var(--g-winline);font-size:12px;line-height:1.8;opacity:.9}
.nex22-cap .nex22-pin{width:17px;height:17px;font-size:10.5px;box-shadow:none;margin-right:2px}
/* 右键菜单 */
.nex22-ctx-stage{position:relative;display:flex;align-items:flex-start;gap:12px;min-height:200px;padding:4px}
.nex22-ctx-stage>.nex22-row{width:180px;grid-template-columns:22px 1fr;margin-top:6px}
.nex22-ctx{display:flex;flex-direction:column;min-width:210px;margin-top:26px;padding:5px;border-radius:8px;background:var(--g-win2);border:1px solid var(--g-winline);box-shadow:0 8px 20px rgba(0,0,0,.3)}
.nex22-ctx span{position:relative;padding:5px 10px;border-radius:4px;font-size:12.5px}
.nex22-ctx span.sub::before{content:"";display:inline-block;width:12px;height:12px;margin-right:8px;vertical-align:-1px;border-radius:2px;background:linear-gradient(135deg,#d6303a 0 33%,#3a6fd6 33% 66%,#3aa65a 66%)}
.nex22-ctx span .nex22-pin{position:absolute;right:-12px;top:50%;margin-top:-10px}
.nex22-ctx hr{border:0;border-top:1px solid var(--g-winline);margin:4px 2px}
.nex22-mouse{position:absolute;left:30px;top:96px;padding:2px 7px;border-radius:4px;background:var(--g-gold);color:#1a1200;font-size:11px;font-weight:700}
/* WinRAR */
.nex22-rar-tools{display:flex;flex-wrap:wrap;gap:6px;padding-bottom:10px;margin-bottom:6px;border-bottom:1px solid var(--g-winline)}
.nex22-rar-tools span{position:relative;padding:6px 10px;border-radius:5px;background:var(--g-win2);font-size:12px}
.nex22-rar-tools .nex22-pin{position:absolute;right:-8px;top:-8px}
.nex22-dlg{margin-top:10px;padding:12px;border-radius:8px;border:1px solid var(--g-winline);background:var(--g-win2)}
.nex22-dlg b{font-size:12.5px;font-weight:600}
.nex22-path{position:relative;margin:8px 0 10px;padding:6px 10px;border-radius:4px;background:var(--g-win);font-family:Consolas,ui-monospace,monospace;font-size:12.5px}
.nex22-path .nex22-pin{position:absolute;right:8px;top:50%;margin-top:-10px}
.nex22-dlg-btn{display:flex;justify-content:flex-end;gap:6px}.nex22-dlg-btn span{padding:4px 16px;border-radius:4px;border:1px solid var(--g-winline);font-size:12px}.nex22-dlg-btn .ok{background:var(--g-accent);border-color:var(--g-accent);color:#fff}
/* 运行库示意 */
.nex22-rt{display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.nex22-rt-list{display:flex;flex-direction:column;gap:4px;flex:1;min-width:180px}
.nex22-rt-list span{padding:4px 10px;border-radius:4px;background:var(--g-win2);font-size:12px}
.nex22-rt-list span::before{content:"✓";margin-right:8px;color:#3aa65a;font-weight:700}
.nex22-rt-btn{position:relative;padding:12px 26px;border-radius:8px;background:var(--g-accent);color:#fff;font-weight:700;outline-color:var(--g-ice)!important}
.nex22-rt-btn .nex22-pin{position:absolute;right:-9px;top:-9px;background:var(--g-gold);color:#1a1200}

/* 常见报错 */
.nex22-errors{padding-top:40px;scroll-margin-top:80px}
.nex22-errors h2{font-size:24px}
.nex22-sub{margin:6px 0 16px;color:var(--g-muted);font-size:14px}
.nex22-err{border:1px solid var(--g-line);border-radius:10px;background:var(--g-card);margin-bottom:10px;transition:border-color .15s}
.nex22-err[open]{border-color:var(--g-line2)}
.nex22-err{scroll-margin-top:80px}.nex22-err.is-flash{animation:nex22-flash 1.4s ease-out}
@keyframes nex22-flash{0%,30%{border-color:var(--g-gold);box-shadow:0 0 0 4px rgba(255,181,71,.22)}100%{box-shadow:0 0 0 0 rgba(255,181,71,0)}}
.nex22-err summary{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;cursor:pointer;list-style:none;font-weight:600;font-size:15px}
.nex22-err summary::-webkit-details-marker{display:none}
.nex22-err summary::after{content:"+";margin-left:auto;padding-left:12px;color:var(--g-muted);font:400 20px/1 var(--nr-num,ui-monospace,monospace);transition:transform .2s}
.nex22-err[open] summary::after{transform:rotate(45deg)}
.nex22-err-ic{display:grid;place-items:center;flex:0 0 22px;height:22px;margin-top:1px;border-radius:6px;background:rgba(255,181,71,.15);color:var(--g-gold);font:800 13px/1 var(--nr-num,ui-monospace,monospace)}
.nex22-err-b{padding:0 16px 16px 50px;color:var(--g-soft);font-size:14px}
.nex22-err-b p{margin:0 0 6px}.nex22-err-b p b{color:var(--g-fg)}
.nex22-err-b ol{margin:0 0 12px;padding-left:20px}.nex22-err-b li{margin:3px 0}

@media (max-width:820px){
 .nex22-step{grid-template-columns:1fr;gap:18px;padding:28px 0}
 .nex22-err-b{padding-left:16px}
 .nex22-pit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .nex22-ask,.nex22-toc{flex-direction:column;gap:6px}.nex22-ask>b,.nex22-toc>b{padding-top:0}
}
@media (max-width:480px){
 .nex22-row{grid-template-columns:22px minmax(0,1fr) 54px 20px;gap:8px}.nex22-row .ty{display:none}
 .nex22-ctx-stage{flex-direction:column;min-height:0}.nex22-ctx{margin-top:0}.nex22-mouse{display:none}
 .nex22-tb .c i{width:28px}
 .nex22-pit-grid{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.nex22 *{transition:none!important}}