# QR Menu — Authentication · Payment · Store · Wallet

Brand component group, **1:1 from `auth-payment-spec.md`** — all icons inline SVG, verbatim & brand-accurate.
Font **SF Pro Text / SF Pro Display** (fallback `-apple-system`) · radius **8px** · stage gap 48px, `align-items:flex-start`.
Column heading: SF Pro 20/400 · `-0.01em` · `--text-500`.

## 1 · Authentication — social login (327×56 · r8 · gap 12 · text 17/600)
- **Continue with Apple** — bg `#030303` (`--text-600`), Apple icon white, text white.
- **Continue with Google** — bg white, `1px solid #E5E5EA` (`--grey-300`), Google 4-colour icon, text `--text-500`.
- **Continue with Facebook** — bg `#1B74E8`, Facebook icon white, text white. List gap 16.

## 2 · Payment Method — pay buttons (327×56 · r8 · gap 8)
- **Apple Pay** — `#030303`, Apple icon + “Pay”. · **Google Pay** — white+border, Google icon + “Pay”. · **Umico Pay** — `#E72961`, “Umico Pay”.

## 3 · Store — badges (180×54 · r8 · `#000` · gap 10 · pad 0 16 · two-line)
- **Google Play** — Play triangle (4-colour) + `GET IT ON` / **Google Play**.
- **App Store** — Apple icon + `Download on the` / **App Store**.

## 4 · Wallet — badges
- **Google Wallet** — 198×56 · `#1F1F1F` · Play triangle + `Add to` / **Google Wallet**.
- **Apple Wallet** — 146×44 · `#000` · Apple icon + `Add to` / **Apple Wallet**.

## Tokens
`--text-500` ink · `--white-500` light · `--grey-300` hairline border · `--text-600` (#030303) Apple/black.
Brand colours kept as documented literals (no DS token): `#1B74E8` Facebook · `#E72961` Umico · `#1F1F1F` Google Wallet · `#000000` pure black.
Icons (Apple · Google · Facebook · Google Play triangle) are the spec §5 SVGs, verbatim.
