WiseMeal: Al Calorie Tracker

Colors

• #F4F8FCBackground Pale Tint · screen background
• #1B283DPrimary Navy · headline text
• #657788Subhead Grey · subheading paragraph text
• #FBB03BTrophy Gold · trophy cup primary color
• #1976D2Primary Blue · progress bar · continue button fill
• #FFFFFFPure White · button text · radial backdrop glow

Type

• progress_counterSF Pro Display · 44px · 700 · #1976D2
• titleSF Pro Display · 86px · 800 · #1B283D
• subtitleSF Pro Text · 44px · 400 · #657788
• buttonSF Pro Display · 50px · 600 · #FFFFFF

Elements

• Navigation Bar · navigation_bar

  Top row featuring back arrow icon on left, blue progress track in center, '2 / 2' label on right. · Clean borderless bar with primary blue accents.

• Celebration Header · text_block

  Centered horizontally below top navigation; headline 'Goal Set. You've Got This!' followed by two-line explanatory subhead. · Bold centered typography with high contrast navy title and muted grey body.

• Trophy Illustration · graphic_asset

  Centered horizontally in lower-middle section, set against a soft circular ray burst background. · 3D rendered golden trophy cup with star emblem, dark grey pedestal base, target dartboard, floating blue mascot sphere, and spiral confetti ribbons.

• Continue Button · button

  Bottom anchored, height roughly 150 px, horizontal margins 48 px. · Solid vibrant blue filled pill button with white label.

Layout

Achievement/milestone screen with top progress header, centered motivational text block, large central celebratory 3D illustration, and bottom persistent action button.

Notes

Progress bar remains at 2/2 indicating questionnaire completion.