bookworm-boot/download-panel.html

    <!-- DOWNLOAD Panel -->
    <section class="panel" data-panel="download" style="display:none">
      <div style="max-width:640px;margin:0 auto;padding:2rem 1rem">

        <div style="text-align:center;margin-bottom:2rem">
          <div style="font-size:3rem;margin-bottom:0.5rem">&#128218;</div>
          <h2 style="font-size:1.6rem;margin-bottom:0.3rem">Bookworm <span style="color:var(--accent,#58a6ff)">Portable</span></h2>
          <p style="color:var(--text-secondary,#8b949e);font-size:0.95rem">AI 编程助手桌面版 &#8212; 一键安装到你的电脑</p>
        </div>

        <div style="display:flex;gap:0.5rem;justify-content:center;flex-wrap:wrap;margin-bottom:1.5rem">
          <span style="background:var(--bg-tertiary,#21262d);border:1px solid var(--border,#30363d);border-radius:20px;padding:0.25rem 0.75rem;font-size:0.8rem"><b>92</b> Skills</span>
          <span style="background:var(--bg-tertiary,#21262d);border:1px solid var(--border,#30363d);border-radius:20px;padding:0.25rem 0.75rem;font-size:0.8rem"><b>18</b> Agents</span>
          <span style="background:var(--bg-tertiary,#21262d);border:1px solid var(--border,#30363d);border-radius:20px;padding:0.25rem 0.75rem;font-size:0.8rem"><b>34</b> Hooks</span>
          <span style="background:var(--bg-tertiary,#21262d);border:1px solid var(--border,#30363d);border-radius:20px;padding:0.25rem 0.75rem;font-size:0.8rem"><b>AES-256</b> &#21152;&#23494;</span>
        </div>

        <div style="background:var(--bg-secondary,#161b22);border:1px solid var(--border,#30363d);border-radius:12px;padding:1.5rem;text-align:center;margin-bottom:1.5rem">
          <h3 style="margin-bottom:0.8rem;font-size:1.1rem">Windows &#26700;&#38754;&#29256;</h3>
          <p style="color:var(--text-secondary,#8b949e);font-size:0.9rem;margin-bottom:1.2rem">
            &#22312;&#20320;&#30340;&#30005;&#33041;&#19978;&#36816;&#34892; Bookworm&#65292;&#23436;&#25972;&#30340; Claude Code + 97 &#20010;&#19987;&#23478; Skills<br>
            &#31163;&#32447;&#37197;&#32622;&#65292;API &#36890;&#36807;&#21152;&#23494;&#20013;&#36716;&#31449;&#36716;&#21457;
          </p>
          <a id="downloadSetupBtn" href="/api/download/setup" download="Bookworm-Setup.bat"
             style="display:inline-block;background:linear-gradient(135deg,#238636,#2ea043);color:#fff;font-size:1rem;font-weight:600;padding:0.75rem 2rem;border-radius:8px;text-decoration:none;cursor:pointer">
            &#11015; &#19979;&#36733;&#23433;&#35013;&#31243;&#24207; (4 KB)
          </a>
          <p style="color:var(--text-secondary,#8b949e);font-size:0.75rem;margin-top:0.5rem">Bookworm-Setup.bat &#8212; &#21452;&#20987;&#21363;&#21487;&#23433;&#35013;</p>
        </div>

        <div style="background:var(--bg-secondary,#161b22);border:1px solid var(--border,#30363d);border-radius:12px;padding:1.2rem 1.5rem;margin-bottom:1.5rem">
          <h4 style="margin-bottom:0.8rem;color:var(--accent,#58a6ff)">&#23433;&#35013;&#21482;&#38656; 3 &#27493;</h4>
          <div style="display:flex;gap:0.8rem;align-items:flex-start;margin-bottom:0.6rem">
            <span style="background:var(--accent,#58a6ff);color:#000;width:22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:0.75rem;font-weight:700;flex-shrink:0">1</span>
            <span>&#19979;&#36733;&#19978;&#26041;&#23433;&#35013;&#31243;&#24207;&#65292;&#21452;&#20987;&#36816;&#34892;</span>
          </div>
          <div style="display:flex;gap:0.8rem;align-items:flex-start;margin-bottom:0.6rem">
            <span style="background:var(--accent,#58a6ff);color:#000;width:22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:0.75rem;font-weight:700;flex-shrink:0">2</span>
            <span>&#36755;&#20837;&#31649;&#29702;&#21592;&#25552;&#20379;&#30340;&#23494;&#30721;</span>
          </div>
          <div style="display:flex;gap:0.8rem;align-items:flex-start">
            <span style="background:#3fb950;color:#000;width:22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:0.75rem;font-weight:700;flex-shrink:0">&#10003;</span>
            <span>&#23436;&#25104;&#65281;&#26700;&#38754;&#20986;&#29616; Bookworm &#22270;&#26631;&#65292;&#21452;&#20987;&#21551;&#21160;</span>
          </div>
        </div>

        <div style="background:var(--bg-secondary,#161b22);border:1px solid var(--border,#30363d);border-radius:12px;padding:1.2rem 1.5rem;margin-bottom:1.5rem">
          <h4 style="margin-bottom:0.5rem">&#31995;&#32479;&#35201;&#27714;</h4>
          <table style="width:100%;font-size:0.85rem;border-collapse:collapse">
            <tr style="border-bottom:1px solid var(--border,#30363d)"><td style="padding:0.4rem 0"><b>&#25805;&#20316;&#31995;&#32479;</b></td><td>Windows 10/11</td></tr>
            <tr style="border-bottom:1px solid var(--border,#30363d)"><td style="padding:0.4rem 0"><b>Node.js</b></td><td>18+ (<a href="https://nodejs.org" target="_blank" style="color:var(--accent,#58a6ff)">&#19979;&#36733;</a>)</td></tr>
            <tr style="border-bottom:1px solid var(--border,#30363d)"><td style="padding:0.4rem 0"><b>Git</b></td><td><a href="https://git-scm.com" target="_blank" style="color:var(--accent,#58a6ff)">&#19979;&#36733;</a></td></tr>
            <tr><td style="padding:0.4rem 0"><b>&#32593;&#32476;</b></td><td>&#38656;&#35201;&#20195;&#29702;/VPN (&#22269;&#20869;)</td></tr>
          </table>
        </div>

        <div style="display:grid;grid-template-columns:1fr 1fr;gap:0.8rem;margin-bottom:1.5rem">
          <div style="background:var(--bg-secondary,#161b22);border:1px solid var(--border,#30363d);border-radius:8px;padding:1rem;text-align:center">
            <div style="font-size:1.5rem;margin-bottom:0.3rem">&#9889;</div>
            <div style="font-weight:600;font-size:0.9rem">30 &#31186;&#21551;&#21160;</div>
            <div style="color:var(--text-secondary,#8b949e);font-size:0.75rem">&#23433;&#35013;&#21518;&#27599;&#27425;&#21452;&#20987;&#21363;&#21487;</div>
          </div>
          <div style="background:var(--bg-secondary,#161b22);border:1px solid var(--border,#30363d);border-radius:8px;padding:1rem;text-align:center">
            <div style="font-size:1.5rem;margin-bottom:0.3rem">&#128274;</div>
            <div style="font-weight:600;font-size:0.9rem">AES-256 &#21152;&#23494;</div>
            <div style="color:var(--text-secondary,#8b949e);font-size:0.75rem">&#20973;&#35777;&#19981;&#33853;&#30424;&#65292;&#36827;&#31243;&#32423;&#38548;&#31163;</div>
          </div>
          <div style="background:var(--bg-secondary,#161b22);border:1px solid var(--border,#30363d);border-radius:8px;padding:1rem;text-align:center">
            <div style="font-size:1.5rem;margin-bottom:0.3rem">&#128640;</div>
            <div style="font-weight:600;font-size:0.9rem">97 &#20010; AI &#19987;&#23478;</div>
            <div style="color:var(--text-secondary,#8b949e);font-size:0.75rem">&#20840;&#26632;&#24320;&#21457;/&#23433;&#20840;/&#26550;&#26500;/&#27979;&#35797;</div>
          </div>
          <div style="background:var(--bg-secondary,#161b22);border:1px solid var(--border,#30363d);border-radius:8px;padding:1rem;text-align:center">
            <div style="font-size:1.5rem;margin-bottom:0.3rem">&#127760;</div>
            <div style="font-weight:600;font-size:0.9rem">&#20013;&#36716;&#31449; API</div>
            <div style="color:var(--text-secondary,#8b949e);font-size:0.75rem">&#26080;&#38656; Claude &#36134;&#21495;</div>
          </div>
        </div>

        <div style="text-align:center;color:var(--text-secondary,#8b949e);font-size:0.75rem">
          Bookworm Portable v1.3 &#8212; &#22914;&#38656;&#24110;&#21161;&#35831;&#32852;&#31995;&#31649;&#29702;&#21592;
        </div>

      </div>
    </section>