feat(web): align source with Interlock visual identity

[MaazAhmed47]

Aligns the website source in GitHub with the approved Interlock visual identity. Source alignment only — no redesign, no new features, no copy rewrite, no backend change.

Why this is needed now

main still carries the pre-refresh design. The production deploy triggered by the PR #37 merge re-published main to getinterlock.dev, which reverted the live site. Verified during this work:

• Deployed getinterlock.dev/ is now byte-identical to origin/main's interlock-web/index.html — both SHA-256 90948186dd8bb775…, 32 413 bytes.
• /interlock-lockup-white.svg and /interlock-favicon-white.svg return HTTP 404 in production.
• /favicon.ico is back to the 176-byte placeholder.

So the approved identity currently exists in neither main nor production. This PR restores it to source.

Scope

A. Brand assets

Six approved marks added to the Vite public directory:

interlock-lockup-white.svg, interlock-icon-white.svg, interlock-favicon-white.svg, interlock-lockup-mono.svg, interlock-icon-mono.svg, interlock-favicon-mono.svg

• White marks use #ffffff; mono marks use currentColor. No amber-accent variant is added or referenced — confirmed by extracting every colour literal from all six files.
• No redraw, recolour, rotation, crop, shadow, or bracket-offset change.
• PNG fallback included, and verified to be a pure uniform scale of the approved favicon rather than a re-draw or the icon: decoding it shows an opaque bounding box of x 5..58, y 5..58 and a mid-row column profile of [5..15] + [37..58]. Those match the 48-unit favicon geometry scaled ×4/3 exactly, and rule out interlock-icon-white.svg, which would give 8..56. Every fully opaque pixel is (255,255,255).

B. Header and favicon

• Desktop header renders interlock-lockup-white.svg at 28px, linked to /. Measured: logoHeight 28, logoSrc …/interlock-lockup-white.svg.
• Below 900px the same element swaps to interlock-favicon-white.svg at 28px — the favicon mark, not the ordinary icon. Measured: logoHeight 28, logoWidth 28, logoSrc …/interlock-favicon-white.svg. The dashboard mobile header uses the same mark at 28px.
• <link rel="icon" href="/interlock-favicon-white.svg" type="image/svg+xml"> plus the PNG fallback link.
• Dashboard navigation present and routing to /dashboard/; on mobile it is reachable through the nav toggle (verified by clicking it).

One geometry change, forced by arithmetic. Clear space equal to one bracket height is a required scope item. In the lockup viewBox the bracket is 30 of 36.8 units, so at a 28px lockup one bracket height is 22.83px, needing a bar of ≥73.65px. The existing 64px bar gave only 18px. The nav bar therefore moves 64px → 74px. Measured result: 23px top, 24px bottom, 24px left — all ≥22.83px. The mobile dropdown offset moves with it. For contrast, the previously approved 24px lockup needed 19.57px and fit the 64px bar, which is why 24px was originally chosen.

C. Visual system

Graphite near-black canvas (not the green-black variant); green reserved for approved/verified, amber for changed/review, red only for held/quarantined; Space Grotesk for display, JetBrains Mono for labels, hashes, statuses and evidence; thin borders and only the previously approved technical grid — no glow pools, gradients, or bokeh. Token values are the approved ones from the validated design, not reinvented.

D. Dashboard correctness carried over

Visible Dashboard navigation; severity-banded risk meter via riskSeverity; unavailable risk renders "Risk unavailable" and never 0/100 Low; THREAT SEVERITY and RISK SCORE remain separately labelled. Also contains the sidebar lockup, which is intrinsically 265.4px wide while the sidebar leaves 208px, so it previously rendered clipped as "Interloc".

No backend behaviour changed

All 23 changed files are under interlock-web/. Explicitly 0 changes in ROADMAP.md, core/, demo/, docs/, tests/, helm/, models/, routes/, proxy.py, config.py, .github/, requirements.txt, Dockerfile. No backend data contract, route, or configuration file is touched. src/api.ts is not modified.

Verification

Command	Result
npm ci	clean install
npm test	14 passed, 0 failed
tsc --noEmit	exit 0
npm run build	✓ 1586 modules, built in 4.54s
git diff --check	clean

Real-browser checks via CDP, at 1440px and true 390px mobile emulation:

Check	1440px desktop	390px mobile
Header mark	lockup, 28px	favicon mark, 28×28px
Clear space	23px top / 24px bottom / 24px left	23 / 24 / 24
Favicon links	4, incl. SVG image/svg+xml + PNG	same
Dashboard nav	visible, /dashboard/	reachable via nav toggle
Horizontal overflow	none (scrollWidth 1440 = innerWidth)	none (390 = 390)
Console errors	none	none
Keyboard focus	solid 3px rgb(95,237,131), offset 3px, :focus-visible matched under real Tab	same

All eight brand/favicon assets return HTTP 200 from the build output. Landing and dashboard both render; text is legible with no overlap.

One caveat, stated honestly. The dashboard emits two console errors when served from 127.0.0.1: a CORS rejection of https://interlock.onrender.com/health. This is environmental, not a defect and not introduced here — the call originates in src/api.ts, which this PR does not modify, and the deployed dashboard (same api.ts, allowed origin) measures zero console errors.

Difference vs the existing production deployment

Production currently serves the reverted pre-refresh design, so this source differs from it wholesale — that is the point of the PR. Two intentional differences also exist against the earlier approved deployment:

1. Header lockup 24px → 28px, with the nav bar 64px → 74px, per the required scope and the clear-space arithmetic above.
2. Sidebar sub-label reads "Runtime Trust", not the older "Security Gateway" that production shipped, matching current positioning.

Deployment

No deployment occurred from this work. Nothing was merged, tagged, or released; no Vercel project or linking changes; no production configuration modified. This PR is a draft.

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
interlock-web	Ready	Preview, Comment	Jul 29, 2026 6:13am