Clay + 3D visual redesign (Slate & Coral palette, dark mode)

[SM649]

Summary

• Re-themes the app from the purple/indigo gradient look to a "Slate & Coral" Claymorphism + 3D visual language, driven by CSS-variable-backed Tailwind tokens (colors/shadows) so light/dark mode and the new palette apply site-wide with minimal template churn.
• Adds a persisted, client-side-only dark-mode toggle (localStorage, anti-flash inline script) in the dashboard topbar and public navbar.
• Dashboard sidebar and public navbar are deliberate flat/non-clay exceptions; every other surface (landing, about, login/register, dashboard/analyze, profile settings, history) gets the puffy dual-shadow clay treatment plus decorative .clay-blob shapes on hero sections.
• Adds loading="lazy" to chart/thumbnail images.
• Fixes a Critical bug found in final review: Tailwind v3 was silently dropping opacity-modified utilities (bg-positive/10, bg-primary/20, etc.) because their colors were bare var() hex values — converted to RGB-triplet + <alpha-value> form. Also fixed a footer/dark-mode background collision and removed a dead config token.

Known follow-ups (not fixed in this PR — flagged for a maintainer decision)

• Coral (#ff7a72) on white text is ~2.54:1 contrast, below WCAG AA (4.5:1) — a regression from the old palette's 6.13:1. Affects primary CTA buttons.
• Chart images (matplotlib PNGs from create_bar_chart.py) render on an opaque white background and show as white boxes in dark mode — fixing this needs a Python change, out of scope for this template/CSS-only PR.
• loading="lazy" on base64 data-URI images doesn't achieve real deferral (no network request to defer) — harmless but doesn't meet the originally-stated perf rationale.
• rel=preconnect for Google Fonts was not added (spec item, missed).
• A test user (task9testuser...) was created in the live Firestore users_data collection during manual verification and was not cleaned up (no delete-account route exists) — should be removed manually.

Test plan

• static/tailwind.css rebuilt and verified minified after every token/class-affecting change
• Grep-based verification per task (old classes absent, new classes present, exact occurrence counts)
• Live curl-based pass against a running instance: /, /about, /login, /register, dashboard /, /profile_settings, /history (empty-history branch)
• Human browser pass recommended before considering this fully verified: live dark-mode visuals, a populated /history page, Network-tab lazy-load check (not exercisable in this environment)

🤖 Generated with Claude Code

[SM649]

Structure & UX follow-up (10 new commits)

Added actual structural/UX improvements on top of the visual redesign above:

• Dashboard/analyze page: staged loading text ("Fetching comments → Analyzing sentiment → Extracting topics → Summarizing") and a staggered fade-in reveal of results instead of everything appearing at once.
• Sidebar: grouped into Main/Recent/Account, with a new "Recent Analyses" quick-jump list (backed by a new Database.get_recent_analyses + analyzed_at timestamp).
• History page: reworked into compact rich cards (thumbnail, sentiment chips, "View full report"/"Delete"), a stats strip (total analyses, avg. positive %, this week), and client-side search. Full charts/insights moved to a new /history/<video_id> detail page.
• Landing page: hero gained a looping CSS-only preview animation (fake data), and a new "See It In Action" sample-results section between Features and How It Works.
• Final review fix wave: projected the new sidebar query to avoid pulling full base64 chart/thumbnail payloads on every page load, sorted history newest-first, fixed a sidebar text-truncation bug, added a prefers-reduced-motion fallback, a search empty-state message, and a copy-honesty fix on the landing page.

Follow-ups for a maintainer (not code fixes — flagged for visibility)

• Firestore composite index needed: get_recent_analyses requires a composite index (username ASC + analyzed_at DESC) on video_analysis that hasn't been created yet — the sidebar's Recent list will render empty (safely, no crash) until someone with Firebase console access creates it. Firestore's own error message includes a direct "create this index" link the first time the query runs.
• A pre-existing Firestore user document has a trailing space in its username field (unrelated to this PR, found incidentally).
• The sentiment-analysis pipeline (Model.py/emoji_analyzer.py, untouched here) logs — but gracefully handles — "tensor size mismatch" errors for individual comments over ~512 tokens.
• The "no thumbnail" fallback still points at a dead via.placeholder.com URL (inherited, not introduced here).

🤖 Generated with Claude Code