Docs/lui 151 readme adjustments

[luidgi-dev]

Summary

README pass before the app goes live: fixes two bugs that made the quick start
impossible to follow, surfaces the docs that were missing from the index, and adds
a header so the repo reads as a product rather than a source tree.

Also fixes two real bugs in the wireframe capture pipeline, found while re-exporting
the landing screenshots.

Quick start was broken

Anyone following the README to the letter failed at step 3.

• DATABASE_URL was missing from the .env.local block, although data/migrate.py
  reads it through os.getenv('DATABASE_URL').
• Python was not in the prerequisites, which listed only Node and npm, while step 3
  needs Python 3 with psycopg2-binary and python-dotenv.
• data/README.md said to create a .env file, while the runner loads .env.local
  from the repository root.

Header

• New banner, built as a wireframe rather than generated: design/wireframes/readme-banner.html
  is self-contained like the others, with the same OKLch tokens, the same Sora and
  DM Sans, ?clean and ?theme= support, and a capture recipe in the file header.
  Exported at 2x to public/readme-banner-{dark,light}.png, 1600x500, 20 KB each.
• The banner carries the mark and the tagline but no wordmark, so the product name
  stays real text under it. Text inside an image is invisible to GitHub search and
  with images disabled.
• # Strive sits under the banner. GitHub draws a border under README headings;
  placed there it separates the header from the content instead of cutting the
  header in two.
• A license badge beside CI, and a three-link row: live app, technical deep dive,
  documentation index. A technical reader asks what it is, whether they can see it,
  and where the substance is. The deep dive was previously reachable only from
  section 10.
• Screenshot row under the intro, using <picture> with prefers-color-scheme so
  it follows the reader's GitHub theme, with the light variant as fallback.
  Separated by non-breaking spaces: GitHub strips style attributes from README
  HTML and a table would draw cell borders.

README content

• DEEP_DIVE.md, BUILD_LOG.md and PITCH.md added to the documentation
  highlights, before ARCHITECTURE.md.
• A line on the demo, since the landing has a Try the demo button that needs no
  credentials, and that is how most people have actually seen the app.
• A status line, so a visitor can tell where the project stands.
• A Links section with the live app and the Instagram account.
• All 17 em-dashes removed, each sentence reworded rather than the character swapped.

Wireframe capture pipeline

Two silent bugs in rhythm.html and the-arc.html:

• ?theme= was ignored. The script read only clean and took the theme from
  prefers-color-scheme, so exports followed the host OS and the right variant came
  out by luck.
• The frame was not pinned in capture mode. ai-chat-v2.html pins it to 420x720
  anchored top-left; these two did not, so with the ~490px minimum layout width a
  headless browser applies, the centred frame was cropped from the left.

That is why they exported at 415x717 and 416x714 instead of 840x1440. Both files now
carry the pin, the theme parameter and a capture recipe, matching ai-chat-v2.html.

Captures also collapse the done-section details, which the wireframe keeps open on
purpose for design review, so the export matches the in-app default and therefore the
screenshot already in production.

Landing screenshots re-exported at 2x

rhythm and the-arc were 1x and soft on retina. They are now 840x1440, exactly
7/12, matching ai-chat-v2. Composition unchanged, verified against the previous
files before overwriting.
comment: it existed because the two images were 0.5788 and 0.5826 rather than 7/12.
<Image fill> with object-contain in a fixed-aspect container means no layout can
break from the format change.

What to check on the preview: the screenshots section of the landing. The images
should fill their frame edge to edge, with no thin band at top and bottom.

If it does not look right: git revert 7d8d2d3 reverts only the four PNGs. The
README references the same paths either way, so nothing else is affected.

Verified

All referenced images and all 23 markdown links resolve. No em-dashes left.
Re-exported screenshots compared against the previous ones before overwriting.

Closes LUI-151.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
strive	Ready	Preview	Sep 20, 2026 12:38pm UTC