# Loyalty Design System

## Tokens (`globals.css`)

- `--loyalty-accent` / `--loyalty-accent-soft`
- `--loyalty-success` / `--loyalty-warning` / `--loyalty-danger`
- Dark mode variants included

## Reuse

Primary UI from `@/components/ds` (PageHeader, DataTable, Dialog, Drawer, EmptyState, Badge, …).

Module-specific:

- `LoyaltyTablePage` / `LoyaltyStatGrid`
- `LoyaltyStatusChip`
- Portal shell accent colors

## Principles

RTL-first, mobile sidebar drawer, dark mode toggle in shell, keyboard shortcuts (`g h/m/p/r/c/w`).