phase-7: motion, an installable app, and a capture that survives no signal

GSAP carries the counter roll-ups, the bandeja card physics, the dialog
transitions and the three success moments FLOWS.md allows. Every one of
them checks prefers-reduced-motion first and does nothing when it is set.

boneyard and canvas-ui are not what SPEC.md's stack table says they are:
on npm the names belong to two abandoned projects that do neither job.
The skeletons were already ours; the two canvas spots are now sixty lines
each with no dependency. DECISIONS.md records the substitution.

The app installs, keeps a scan taken with no network in IndexedDB and
sends it when there is one, falls back to a page that explains itself,
and can push a deadline notice. Reading the log of what is queued is the
source of truth, so the notice clears when the capture actually lands.

The CSP now allows scripts by per-request nonce rather than by
'unsafe-inline'. That forced /offline to render per request: a
prerendered page carries a build-time nonce no live policy matches, so
its scripts were blocked and it never hydrated.

Two crashes fixed on the way. web-push throws on a VAPID subject that is
not https: or mailto:, and the code handed it APP_PUBLIC_URL, so any
machine with push keys died at boot; a misconfigured optional channel now
switches itself off and says why. And a subscription the push service
answers 410 for is deleted rather than retried forever.

Lighthouse on the production build: accessibility 100, best practices 96,
SEO 100, performance 73. The performance number is not trustworthy on
this machine and DECISIONS.md says why; total blocking time did fall from
17.6s to 1.7s once the hero canvas stopped drawing at full resolution
every frame and the landing page stopped importing GSAP.

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

apps/web/app/[locale]/(app)/perfil/notifications-section.tsx

@@ -3,6 +3,8 @@
 import type { ProfileDto } from '@impuestos/contracts';
 import { SUPPORTED_LOCALES, type Locale } from '@impuestos/i18n';
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
+import { PushOptIn } from '@/components/push-optin';
+import { ThemeToggle } from '@/components/theme-toggle';
 import { Card } from '@/components/ui/card';
 import { Skeleton } from '@/components/ui/skeleton';
 import { Switch } from '@/components/ui/switch';
@@ -83,11 +85,14 @@ export function NotificationsSection({ profile }: { profile: ProfileDto }) {
             </select>
           </label>
 
-          {/* Push and Telegram are hidden until they are configured (FLOWS.md section 9).
-              They are wired with the notification channels in phase 4. */}
+          {/* Push shows itself only where it can work; Telegram is linked from the bot
+              rather than here (FLOWS.md section 9: unconfigured channels stay hidden). */}
+          <PushOptIn />
         </div>
       ) : null}
 
+      <ThemeToggle />
+
       <div className="flex items-center justify-between gap-4 border-t pt-4">
         <span className="text-sm">{t('common.language')}</span>
         <select

apps/web/app/[locale]/(app)/perfil/profile-screen.tsx

@@ -8,6 +8,8 @@ import { Skeleton } from '@/components/ui/skeleton';
 import { useT } from '@/i18n/t';
 import { api } from '@/lib/api';
 import { DangerZone } from './danger-zone';
+import { InstallPrompt } from '@/components/install-prompt';
+import { Reveal } from '@/components/ui/reveal';
 import { DependentsSection } from './dependents-section';
 import { IdentitySection } from './identity-section';
 import { NotificationsSection } from './notifications-section';
@@ -53,12 +55,13 @@ export function ProfileScreen() {
   }
 
   return (
-    <div className="space-y-4 py-4">
+    <Reveal className="space-y-4 py-4">
       <h1 className="text-2xl font-semibold tracking-tight">{t('profile.title')}</h1>
       <IdentitySection profile={profile.data} />
       <DependentsSection />
       <NotificationsSection profile={profile.data} />
+      <InstallPrompt />
       <DangerZone />
-    </div>
+    </Reveal>
   );
 }