Create a responsive, mobile‑first admin dashboard for "Oh My GERD," the TCM‑based Acid Reflux tracking app by Liao. Use the exact Liao brand aesthetic (soft off‑white/clay background, sage‑green accents, Lora serif headings, clean sans body text, 2xl rounded cards, subtle leaf motifs). No clutter—minimalist boho meets modern wellness.

path is

app/admin

it gets triggered after Loggin in if the user and emails are admins, otherwise the app should redirect to the survey or the app/home

Include:

Authentication Gate:

Full‑screen card (80% width on mobile, centered) with:
Header (Lora, 28px, centered): "Admin Access"
Email input (placeholder "admin@ohmygerd.com", full‑width, sage border, 2xl rounding)
Password input (placeholder "••••••••", same style)
Primary CTA button (full‑width, sage‑green background, Lora medium 18px, text "Sign In")
Error message styling: soft red text, 14px sans‑serif

Dashboard Layout (Post‑authentication):

Header: White background with subtle shadow, 80px height
Left: "Oh My GERD Admin" (Lora, 20px semi‑bold, clay‑dark)
Right: "Sign Out" button (clay‑primary text, tappable)
Navigation: Sage‑green active states with white text, clay‑primary inactive states

Overview Tab - KPI Cards:

2x2 grid (desktop) / stacked (mobile), 2xl rounded cards with sage border
Card styling: White background, subtle shadow, lg padding
Icons: Sage‑green, 32px line icons (Users, Calendar, Pill, AlertCircle)
Metrics: Lora 28px semi‑bold, clay‑dark
Labels: 14px sans‑serif, clay‑primary
Trends: Sage‑green for positive, soft red for negative, 12px

Charts & Demographics:

Section headers: Lora 18px semi‑bold, clay‑dark
Chart containers: White background, 2xl rounded, sage border
Color palette: Sage‑green primary, clay‑primary secondary, soft grays
Time filters: Sage‑green toggle buttons with 2xl rounding

Data Tables:

Clean white background with sage border
Headers: Clay‑dark, 14px semi‑bold
Actions: Sage‑green buttons with 2xl rounding
Export controls: Sage‑green "Download CSV" buttons

Decorative Elements:

Faint leaf‑vein watermarks at 10% opacity in corners
Soft drop shadows under all cards
Subtle hover states with sage‑green accents

Responsive Behavior:

Mobile‑first approach with stacked layouts
Tab navigation converts to bottom tab bar on mobile
Cards maintain 2xl rounding and proper spacing

Mood: Professional yet calming—boho apothecary meets clean health tech analytics dashboard.

i need to add a screen after the user clicks on gets started or when he signes up using google, apple or facebook. this popup is " Consent". path is /consent

appears after /onboarding.

keep the same style, fonts and color of the other sections.

Modal Content:
[Icon: Shield line icon]

Headline: "Your Privacy Matters"

Body Text: "We respect your privacy. By using this app, you consent to collection & processing of your health and usage data as described in our Privacy Policy. You may withdraw consent anytime in Settings."

[Checkbox Component]
☐ "I agree to Privacy Policy & Terms"

[Links Row]
"Privacy Policy" | "Terms of Service"

[Button: "Continue" - Full width, phthalo-green, disabled if unchecked]
[Button: "Cancel" - Text only, clay-primary]

Footer
Height: 48px
Background: White
Content: "© 2025 Liao Herbal. All rights reserved."