docs: 🛡️ brand consistency, live site link, responsive presentation

[FiscalMindset]

What

• README — replaced the custom shield logo.png image with a 🛡️ heading (consistent with the site nav/footer + the share card) and added a Live site link → https://blindfold-rho.vercel.app
• Presentation (docs/index.html) — swapped the logo for a 🛡️ hero mark + gradient title, and added landscape / small-screen responsive rules so it holds up on phones
• Removed the now-unused assets/logo.png (the CLI dashboard already falls back to an inline SVG shield when the file is absent — verified in dashboard.ts)

Also (outside the diff)

• Repo About: homepage set to the live site; topics refreshed (+agentic-ai, +attestation, −web3)

---

Summary by cubic

Unifies branding across README and docs by replacing the PNG logo with a 🛡️ mark, adds a live site link, and makes the presentation responsive on phones and landscape screens. Removes an unused asset without affecting the CLI dashboard.

• Docs & Presentation
  • README: replace assets/logo.png with a 🛡️ heading; add “Live site” link → https://blindfold-rho.vercel.app
  • docs/index.html: swap hero logo for 🛡️ + gradient title; add small-screen and landscape responsive rules; update closing slide mark
  • Remove assets/logo.png (CLI dashboard already falls back to an inline SVG shield)

^{Written for commit ed8ca05. Summary will update on new commits.}

[qodo-code-review]

PR Summary by Qodo

Docs: replace logo with shield mark; add live site link; responsive slides

📝 Documentation ✨ Enhancement 🕐 10-20 Minutes

AI Description

• Replace README logo image with shield heading + tagline for brand consistency.
• Add a prominent “Live site” link to the README navigation row.
• Update docs presentation hero/closing to shield mark and improve small-screen responsiveness.

Diagram

graph TD
  R["README.md"] --> L(["Live site (Vercel)"])
  P["docs/index.html"] --> H["Shield-based hero"] --> S["Responsive CSS rules"]
  H --> C["Shield closing mark"]

Loading

High-Level Assessment

The following are alternative approaches to this PR:

1. Inline SVG shield instead of emoji

• ➕ More consistent rendering across platforms/fonts
• ➕ Matches existing fallback approach used elsewhere (if applicable)
• ➖ More markup/CSS to maintain than a single character
• ➖ Requires designing/choosing an SVG asset

2. Keep image logo but standardize usage

• ➕ Preserves exact brand visuals everywhere
• ➕ Avoids emoji/font rendering differences
• ➖ Requires asset management and responsive sizing everywhere
• ➖ Less consistent with nav/footer/share-card treatment if those use the shield mark

Recommendation: The current approach (emoji shield + CSS typography) is appropriate for docs: it removes asset coupling and aligns branding across README/presentation with minimal maintenance. If rendering consistency becomes an issue (e.g., different emoji glyphs), switch to an inline SVG shield as a drop-in replacement while keeping the same layout and responsive rules.

Files changed (2) +66 / -15

Enhancement (1) +62 / -13

index.htmlSwap logo images for shield hero/closing marks and add responsive styling +62/-13

Swap logo images for shield hero/closing marks and add responsive styling

• Replaces the hero and closing slide logo.png images with shield mark elements plus a gradient-styled title and tagline. Adds new CSS classes and media queries to improve layout/typography on small screens and landscape short viewports.

docs/index.html

Documentation (1) +4 / -2

README.mdReplace logo image with shield heading and add live site link +4/-2

Replace logo image with shield heading and add live site link

• Replaces the top-of-README logo image with an H1 shield title and a bold tagline. Adds a “Live site” link ahead of existing README navigation links.

README.md

[gitar-bot]

Important

You are using the Gitar free plan. Upgrade to unlock code review, CI analysis, auto-apply, custom automations, and more.

_Gitar

[qodo-code-review]

Code Review by Qodo

🐞 Bugs (1) 📘 Rule violations (1) 📜 Skill insights (0)

Context used

✅ Compliance rules (platform): 25 rules

✅ Skills: blindfold

1. Missing explain.md log entry 📘 Rule violation § Compliance

Description

The PR makes material documentation updates (README branding/live-site link and presentation
hero/responsiveness) but does not update explain.md with a corresponding status-table update and a
new dated running-log entry. This breaks the project’s requirement that explain.md remain the
up-to-date source of truth for material changes.

Code

README.md[18]

+[**🌐 Live site**](https://blindfold-rho.vercel.app)  ·  [**📦 Install**](#installation)  ·  [**📊 Interactive Presentation**](https://fiscalmindset.github.io/Blindfold/)  ·  [**⚡ Quickstart**](#quickstart)

Evidence

PR changes include a new README hero/title and a new Live site link, plus presentation
hero/responsive updates in docs/index.html. explain.md still shows the existing status table and
its running log entries end at 2026-06-28, with no new dated entry for this PR’s doc changes.

Rule 1915713: Update explain.md status row and dated log entry for each material change
README.md[18-18]
docs/index.html[349-380]
docs/index.html[541-546]
explain.md[41-52]
explain.md[70-78]

Agent prompt

The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
`explain.md` must be updated for each material change, including (1) the relevant status-table row and (2) a new dated entry appended to the running log. This PR changes the README hero/linking and the docs presentation hero/responsive behavior, but `explain.md` has no 2026-07-14 entry and no status update reflecting these doc changes.

## Issue Context
This repo treats `explain.md` as the single source of truth and requires it to be updated whenever material changes land.

## Fix Focus Areas
- explain.md[41-52]
- explain.md[70-78]
- README.md[18-18]
- docs/index.html[349-380]
- docs/index.html[541-546]

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools

---

2. Inline h2 breaks scaling 🐞 Bug ⚙ Maintainability

Description

In docs/index.html slide 12, the closing title uses an inline font-size: 2rem, so the existing
responsive media-query rules that downsize h2 on phones/landscape won’t apply to this element.
This makes the closing title ignore the intended responsive typography (inconsistent sizing vs other
slides on small screens).

Code

docs/index.html[931]

+          <h2 style="font-size: 2rem; margin-bottom: 10px;">Blindfold</h2>

Evidence

The closing slide title is styled inline, which takes precedence over author CSS rules, so the
responsive h2 sizing in the phone and landscape media queries will not affect it.

docs/index.html[927-934]
docs/index.html[418-423]
docs/index.html[495-504]

Agent prompt

The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
The closing slide title (`<h2>`) is styled inline (`font-size: 2rem; ...`), which overrides the stylesheet’s responsive `h2` rules in the 480px and landscape media queries.

## Issue Context
Other headings are controlled via CSS + media queries, but this one heading will not scale down with the rest of the deck on small/short viewports.

## Fix Focus Areas
- docs/index.html[927-935]
- docs/index.html[418-434]
- docs/index.html[495-507]

## Suggested fix
1. Change the closing slide heading to use a class, e.g.:
  - `<h2 class="close-title">Blindfold</h2>`
2. Add `.close-title` base styles near the other hero/close mark styles (instead of inline).
3. Add media-query overrides for `.close-title` inside the existing `@media (max-width: 480px)` and `@media (max-height: 520px) and (orientation: landscape)` blocks so it scales consistently with the rest of the typography.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools

---

[qodo-code-review]

1. Missing explain.md log entry 📘 Rule violation § Compliance

The PR makes material documentation updates (README branding/live-site link and presentation
hero/responsiveness) but does not update explain.md with a corresponding status-table update and a
new dated running-log entry. This breaks the project’s requirement that explain.md remain the
up-to-date source of truth for material changes.

Agent Prompt

## Issue description
`explain.md` must be updated for each material change, including (1) the relevant status-table row and (2) a new dated entry appended to the running log. This PR changes the README hero/linking and the docs presentation hero/responsive behavior, but `explain.md` has no 2026-07-14 entry and no status update reflecting these doc changes.

## Issue Context
This repo treats `explain.md` as the single source of truth and requires it to be updated whenever material changes land.

## Fix Focus Areas
- explain.md[41-52]
- explain.md[70-78]
- README.md[18-18]
- docs/index.html[349-380]
- docs/index.html[541-546]

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools

[qodo-code-review]

2. Inline h2 breaks scaling 🐞 Bug ⚙ Maintainability

In docs/index.html slide 12, the closing title uses an inline font-size: 2rem, so the existing
responsive media-query rules that downsize h2 on phones/landscape won’t apply to this element.
This makes the closing title ignore the intended responsive typography (inconsistent sizing vs other
slides on small screens).

Agent Prompt

## Issue description
The closing slide title (`<h2>`) is styled inline (`font-size: 2rem; ...`), which overrides the stylesheet’s responsive `h2` rules in the 480px and landscape media queries.

## Issue Context
Other headings are controlled via CSS + media queries, but this one heading will not scale down with the rest of the deck on small/short viewports.

## Fix Focus Areas
- docs/index.html[927-935]
- docs/index.html[418-434]
- docs/index.html[495-507]

## Suggested fix
1. Change the closing slide heading to use a class, e.g.:
   - `<h2 class="close-title">Blindfold</h2>`
2. Add `.close-title` base styles near the other hero/close mark styles (instead of inline).
3. Add media-query overrides for `.close-title` inside the existing `@media (max-width: 480px)` and `@media (max-height: 520px) and (orientation: landscape)` blocks so it scales consistently with the rest of the typography.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools