Ham Lab logo: PWA icon set + login screen

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>

web/public/sw.js

@@ -1,5 +1,5 @@
 // Ham Lab service worker: cache hashed assets, never the API, network-first for the shell.
-const CACHE = 'hamlab-v1';
+const CACHE = 'hamlab-v2';
 self.addEventListener('install', () => self.skipWaiting());
 self.addEventListener('activate', (e) => {
   e.waitUntil(caches.keys().then((ks) => Promise.all(ks.filter((k) => k !== CACHE).map((k) => caches.delete(k)))).then(() => self.clients.claim()));

web/src/Login.tsx

@@ -17,6 +17,7 @@ export default function Login({ onLogin }: { onLogin: () => void }) {
   return (
     <div className="center">
       <form className="login" onSubmit={submit}>
+        <img className="login-logo" src="/icons/logo.png" alt="" width={160} height={160} />
         <h1>Ham Lab</h1>
         <input type="password" autoFocus autoComplete="current-password" placeholder="password"
           value={pw} onChange={(e) => setPw(e.target.value)} />

web/src/styles.css

@@ -14,7 +14,8 @@ button { font: inherit; color: inherit; background: none; border: 0; cursor: poi
 
 /* login */
 .login { display: flex; flex-direction: column; gap: 10px; width: min(320px, 90vw); }
-.login h1 { margin: 0 0 8px; font-weight: 600; color: var(--accent); letter-spacing: .5px; }
+.login-logo { width: 160px; height: 160px; align-self: center; border-radius: 50%; margin-bottom: 4px; }
+.login h1 { text-align: center;  margin: 0 0 8px; font-weight: 600; color: var(--accent); letter-spacing: .5px; }
 .login input { padding: 10px 12px; background: var(--bg2); border: 1px solid var(--border); border-radius: 6px; color: var(--fg); font-size: 16px; }
 .login button, .primary { padding: 10px 12px; background: var(--accent); color: #111; border-radius: 6px; font-weight: 600; }
 .login button:disabled { opacity: .5; }