Move app installation to a prominent header button

src/components/PwaControls.tsx

@@ -1,4 +1,5 @@
 import { useState } from "react";
+import { Download } from "lucide-react";
 import { applyUpdate, installApp, useOnline, usePwa } from "../pwa/client";
 import { Button } from "./design-system/primitives";
 import { Modal } from "./design-system/Modal";
@@ -8,7 +9,7 @@ export function InstallApp() {
   const [help, setHelp] = useState(false);
   if (!enabled || installed) return null;
   return <>
-    <Button variant="text" onClick={() => { if (installPrompt) void installApp(); else setHelp(true); }}>Install app</Button>
+    <Button variant="primary" onClick={() => { if (installPrompt) void installApp(); else setHelp(true); }}><Download size={16} aria-hidden="true" />Install app</Button>
     {help && <Modal id="install-app" size="compact" title="Install app" onClose={() => setHelp(false)}>
       <div className="ds-form-stack">
         <p><strong>iPhone or iPad:</strong> open the Share menu, then choose Add to Home Screen.</p>

src/components/design-system/PageLayout.tsx

@@ -32,14 +32,13 @@ export function PageLayout({
         <Link className="ds-wordmark" to={wordmarkTo}>
           Mina Habits<span aria-hidden="true">.</span>
         </Link>
-        <div className="ds-header-actions">{header}<ThemeControl /></div>
+        <div className="ds-header-actions">{header}<InstallApp /><ThemeControl /></div>
       </header>
       <main id={mainId} className="ds-main" tabIndex={-1}>
         <PwaStatus />
         {children}
         <footer className="ds-footer">
           <span className="ds-wordmark">Mina Habits.</span>
-          <InstallApp />
           <Button
             variant="text"
             onClick={() => window.scrollTo({ top: 0, behavior: "instant" })}