Restore the "Part of AI Lab" credit block in all three views and hide
it client-side once /auth/me (or fresh login) identifies the viewer as
alz@bii.dk. Everyone else sees it as before. Marked with data-ailab;
hidden via inline display:none since the flex containers override the
[hidden] attribute. No inline scripts — logic lives in the existing
page JS, CSP stays script-src 'self'.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Drop the "Part of AI Lab" credit block from the entrance welcome
lockup, desktop hero foot, and mobile credits. Flex-column gap
reflows the remaining two credits with no CSS changes.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Rework the supporter credits ("Backed by" / "Part of") into a
three-tier lockup — a small uppercase label over an upright Newsreader
serif name, with the parent body / issuing authority in a quieter
serif beneath — so the credits read in the deck's editorial voice
instead of as a foreign sans-serif caption. Applied consistently
across all three views:
- Entrance welcome screen: replaced three separately position:fixed
blocks (with hand-tuned top offsets) with one centred .welcome-credits
lockup; drops the brittle magic-number stacking.
- Timeline hero ("Fenja introduction"): left-aligned .support-credit
stack in place of the old .support / .support-bii lines.
- Mobile hero: matching .m-credit stack replacing .m-support / .m-backer.
Credits now read: Backed by Innofounder (Innovationsfonden); Part of
AI Lab (BioInnovation Institute); Part of The AI Regulatory Sandbox
(Datatilsynet & Digitaliseringsstyrelsen).
Also brings the mobile view to parity with the customer-facing desktop
deck: updated hero copy, platform-question framing, architecture layers,
Wiki deep-dive, deployment cards, and implementation roadmap; removes the
old "Join Project Bifrost" CTA + footer (mobile.js loses the join
handler, keeps the session check).
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
.m-logo img grows 34px → 48px. Masthead padding 14px/18px → 28/18/26
so the logo sits with noticeably more space above and below.
text-decoration:none is now applied across :link/:visited/:hover/
:active variants (plus border-bottom:0 on both the anchor and the
<img>) to defeat any browser default underline on the tappable
logo, including Safari's quirky behaviours.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
.m-logo img 22px → 34px; .m-logo gets text-decoration:none so the
wrapping <a href="/"> doesn't paint a default underline under the
wordmark on Safari / any browser with link styles leaking through.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Icons grow 72px → 148px and shift to top:-18px right:-18px so they
overflow the card edges. .m-cap gets overflow:hidden so the bleed
is clipped at the tile boundary — icon reads as an ornament tucked
into the top-right corner rather than a floating sticker. Num,
eyebrow, and title rows bump their right padding from 92 to 120 so
the text still clears the icon's visible silhouette.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Masthead is now the Fenja wordmark on its own, centred. The logout
handler and the .m-logout CSS are gone; mobile.js header comment
updated to reflect "two behaviours" (session check + join CTA).
Users who need to log out can do so from a desktop session or by
clearing cookies.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Capability cards now carry the desktop's per-layer colours —
sage / slate / clay / plum — with paper-toned text for contrast.
Icon, num, eyebrow, title, body all flipped to paper with per-
element alpha so the hierarchy still reads on the coloured tile.
Footer reintroduced as a stacked column of three supporter marks:
"Project Bifrost" serif lockup, Fenja AI wordmark, Innovationsfonden
mark. Centered, 26px gap, paper background, 44/56 top/bottom padding.
No "view desktop" link — the ?view=desktop query override still
works for anyone who needs it.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Timeline: 12 event tiles are now a horizontal scroll-snap carousel
instead of a vertical stack. Each card flex-basis: 84vw, snap-align
start, with paper-tile styling + a subtle shadow + "NN / 12" index
in the top-right. A "Swipe →" hint sits above the track. Zero JS —
pure CSS scroll-snap + -webkit-overflow-scrolling.
Hero: Fenja wordmark (36px) placed above the "For regulated
environments" eyebrow, whole section wrapped in a paper-2 strip
with 72/80px top/bottom padding and hairline rules top + bottom.
Sits visually as its own chapter instead of a continuation of the
previous section.
Transition strip ("How Fenja AI addresses this") gets vertical
rules above and below and 88px vertical padding so it reads as a
deliberate pause between the timeline and the platform sections.
Capability cards: 4 per-layer illustrations (ai.png, lightbulb,
blocs tools, agents.png — all already in fenja/illustrations/)
placed as 72×72 PNGs in the top-right of each card. Card content
padding-right bumped to 92px for the num/eyebrow/title rows so
long titles wrap around the icon instead of under it.
Project Bifrost: the desktop aurora arc reused as a static SVG
backdrop. Scaled to 190% viewport width (max 900px) so the arc
runs off both edges of the phone screen, matching the desktop's
"bridge spans the stage" feel.
Treasure-map stops: community.svg, council.svg, pilot.svg sit
as 220px-wide illustrations above each stop's text, replacing
the text-only mobile rendering.
Join CTA: now wrapped in an inset paper tile with a 1.5px ink
border, a shadow, and an accent hairline ornament floating above
the eyebrow. Enclosing section gets a paper-3 background to push
the tile forward. Button grows to 20px serif / 18×34 padding.
Section padding standardised to 56-120px vertical so sections
breathe. Body overflow-x:hidden on html/body as a safety net for
the wide arc + the carousel overflow.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
The footer added a wordmark row and a "view desktop" escape hatch
below the Join confirmation. Neither is worth the visual weight on
a phone screen — the masthead already has the wordmark, and the
?view=desktop override still works as a manual URL. Page now ends
at the join confirmation.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Desktop is a GSAP/Lenis/d3 animated experience that doesn't hold up
on phones. Rather than retrofitting media queries across 1200+ lines
of scroll-trigger code, add a completely isolated static mobile tree:
- protected/mobile/index.html — one-page static flow covering the
intro, 12 timeline events, hero, 4 capability cards, Bifrost
reveal, 3 participation stops, and Join CTA. All copy duplicated
from the desktop HTML on purpose — a shared data module would
re-couple the two trees.
- protected/mobile/mobile.css — paper/ink palette, all m-prefixed,
zero cascade overlap with the desktop CSS.
- protected/mobile/mobile.js — 60-line client: /auth/me check,
/api/bifrost-join POST + panel swap, /auth/logout. No GSAP, no
Lenis, no d3.
Routing (server.js):
- GET /timeline now UA-dispatches via MOBILE_UA_RE. Phone UAs get
the mobile page; everything else gets the desktop page.
- ?view=mobile and ?view=desktop query overrides take precedence
over the UA sniff — for bad guesses or previewing the other
version.
- Gating is unchanged: protected/mobile/ is inside protected/ so
the existing requireAuth + express.static gate covers it.
Docs:
- CLAUDE.md §routing now lists the UA dispatch as step 4.
- PROJECT.md gets a new "Mobile view" section explaining the
isolation rules (no shared JS/CSS, content duplicated manually).
- CHECKLIST.md gains section H0 with dispatch curl checks, render
verification on a phone, and an isolation audit that fails if
mobile classes leak into the desktop HTML or vice versa.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
