Make the web app installable as a PWA (Tier 1: app shell + offline fallback)

Adds a manifest, service worker, and branded icons so the site can be
installed to a home screen/desktop, plus an offline fallback page so a
dropped connection shows something friendlier than the browser's default
error. Icons are rasterized from the existing favicon.svg mark via
rsvg-convert. The manifest and service worker are served through small
Django views (not raw static files) so their asset URLs pick up
WhiteNoise's content-hashed filenames in prod/selfhosted, and the service
worker is served from the site root so its scope covers the whole app.

Does not include true offline task data or Web Push notifications --
those are tracked separately as larger follow-up projects.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

templates/base.html

@@ -9,6 +9,13 @@
     <!-- Favicon -->
     <link rel="icon" type="image/svg+xml" href="{% static 'favicons/favicon.svg' %}">
     <link rel="alternate icon" href="{% static 'favicons/favicon.svg' %}" type="image/svg+xml">
+    <link rel="apple-touch-icon" href="{% static 'favicons/apple-touch-icon-180.png' %}">
+
+    <!-- PWA -->
+    <link rel="manifest" href="{% url 'manifest' %}">
+    <meta name="theme-color" content="#3B82F6">
+    <meta name="mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-capable" content="yes">
 
     <link rel="stylesheet" href="{% static 'css/app.css' %}?v=6">
     {% block extra_css %}{% endblock %}

templates/manifest.webmanifest

@@ -0,0 +1,26 @@
+{% load static %}{
+    "name": "KeepItGoing",
+    "short_name": "KeepItGoing",
+    "start_url": "/",
+    "display": "standalone",
+    "background_color": "#ffffff",
+    "theme_color": "#3B82F6",
+    "icons": [
+        {
+            "src": "{% static 'favicons/icon-192.png' %}",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "{% static 'favicons/icon-512.png' %}",
+            "sizes": "512x512",
+            "type": "image/png"
+        },
+        {
+            "src": "{% static 'favicons/icon-512-maskable.png' %}",
+            "sizes": "512x512",
+            "type": "image/png",
+            "purpose": "maskable"
+        }
+    ]
+}

templates/offline.html

@@ -0,0 +1,19 @@
+{% extends 'base.html' %}
+
+{% block title %}You're Offline - KeepItGoing{% endblock %}
+
+{% block content %}
+<div class="empty-state">
+    <p>You're offline</p>
+    <p class="text-muted">This page isn't available without a connection. Reconnect and try again.</p>
+    <button class="btn btn-primary" onclick="window.location.reload()">Retry</button>
+</div>
+{% endblock %}
+
+{% block auth_content %}
+<div class="empty-state">
+    <p>You're offline</p>
+    <p class="text-muted">This page isn't available without a connection. Reconnect and try again.</p>
+    <button class="btn btn-primary" onclick="window.location.reload()">Retry</button>
+</div>
+{% endblock %}

templates/sw.js

@@ -0,0 +1,49 @@
+{% load static %}const CACHE_NAME = 'keepitgoing-shell-v1';
+const OFFLINE_URL = '{% url "offline" %}';
+
+const PRECACHE_URLS = [
+    "{% static 'css/app.css' %}",
+    "{% static 'js/app.js' %}",
+    "{% static 'favicons/favicon.svg' %}",
+    "{% static 'favicons/icon-192.png' %}",
+    "{% static 'favicons/icon-512.png' %}",
+    "{% static 'favicons/icon-512-maskable.png' %}",
+    "{% static 'favicons/apple-touch-icon-180.png' %}",
+    OFFLINE_URL,
+];
+
+self.addEventListener('install', (event) => {
+    event.waitUntil(
+        caches.open(CACHE_NAME).then((cache) => cache.addAll(PRECACHE_URLS))
+    );
+    self.skipWaiting();
+});
+
+self.addEventListener('activate', (event) => {
+    event.waitUntil(
+        caches.keys().then((keys) =>
+            Promise.all(keys.filter((key) => key !== CACHE_NAME).map((key) => caches.delete(key)))
+        )
+    );
+    self.clients.claim();
+});
+
+self.addEventListener('fetch', (event) => {
+    const request = event.request;
+
+    // Navigations: try the network first, fall back to the offline page.
+    if (request.mode === 'navigate') {
+        event.respondWith(
+            fetch(request).catch(() => caches.match(OFFLINE_URL))
+        );
+        return;
+    }
+
+    // Precached shell assets: serve from cache first.
+    const path = new URL(request.url).pathname;
+    if (PRECACHE_URLS.includes(path)) {
+        event.respondWith(
+            caches.match(request).then((cached) => cached || fetch(request))
+        );
+    }
+});