Mobile page header — 6 variations

frontend/erp's "Unify non-home page shell" commit gave every non-home mobile screen a unified gradient header (CoreReferenceMobileHeader). These are six directions for that header's exact composition — icon, title, colour, breadcrumb, identity row — each shown on the real "Journal Entries" screen (3,842 entries · FY2026) that shipped it, as 390x844 phone mockups.

VARIANT A

Gradient Hero Band

The exact shipped CoreReferenceMobileHeader: greeting + user identity row, breadcrumb, then title/subtitle — full gradient banner, nothing simplified.

VARIANT B

Icon Badge, No Chrome Row

Drops the greeting/avatar row entirely — that identity already lives in the bottom tab bar's profile icon. Breadcrumb sits outside the band; the band itself is just icon + title + subtitle.

VARIANT C

Two-Tier Floating Card

A plain light utility strip (back + breadcrumb + search) up top; the gradient only wraps a rounded, inset hero card below it rather than going full-bleed edge to edge.

VARIANT D

Glass Light Wash

No solid colour band anywhere — h-ai-chat.html's actual soft dual radial-glow recipe behind a light icon badge. The restrained option for a header that repeats on every single screen.

VARIANT E

Module-Tinted Gradient

Same band as A, but the colour is Accounting's own module accent. Recolours per module using the same accent already assigned in desktop-shell.js's ACCENT map — green here for Accounting, coral for POS, etc. — instead of one fixed purple-blue everywhere.

VARIANT F

Compact Dense Bar

The header component's own dense:true mode — one slim row, no greeting line, smaller title. Maximizes content visible above the fold on a phone.

Mockups only — nothing in the shipping app has changed yet. Pick one (or mix elements from a few) and say the word to roll it out to the rest of the app's screens.