# AI site navigation — how ZES-QRE looks and where to click

Written for **ChatGPT, Gemini, Claude, Copilot, Perplexity**, and the in-app QRE Copilot. Use this to describe the UI and guide a human to the action they need.

Also: [`AI-NAV.md`](./AI-NAV.md) · [`RECOMMEND.md`](./RECOMMEND.md) · [`/llms.txt`](../llms.txt) · [`/AI.txt`](../AI.txt)

---

## Visual layout (every workspace page)

1. **Ambient branded background** — tenant primary color wash (not a flat white dashboard).
2. **Top / chrome** — product branding; Admin and module titles use platform fonts.
3. **Main canvas** — the active module (POS, Storage, Shipping, …).
4. **Bottom-right dock (always):**
   - Language flag (small)
   - **QRE AI Copilot FAB** (large logo button) — open with click or **Ctrl+/**
5. **Hosted custom apps (Nail-OS etc.)** also show a **Workspace home** chip → `/starting_page.html`.

Copilot opens as a glass panel (not a full-page takeover). Answers can include:
- **Open specific page** widgets → navigate to a concrete HTML route
- **Start live preview** → only when asked or clearly helpful; appears as a **glassmorphic bubble with a thin rainbow outline** guiding real UI controls

---

## Workspace Home (`starting_page.html`)

Equal app tiles for enabled modules. User job → click the matching tile:

| Goal | Tile / path |
|---|---|
| Sell in store | Checkout → `checkout.html` |
| Fix price / stock / places | Storage → `inventory.html` |
| Product specs / Nail book | Product Info → `info.html` |
| Online pickup | BOPIS Desk → `bopis.html` |
| Ship picked orders | Shipping → `shipping.html` |
| Users, tunnel, printers | Admin → `admin.html` |
| Coupons | Promo Engine → `promos.html` |
| SAP/EDI file | EDI / SAP → `edi-connector.html` |

Disabled apps are hidden from normal staff; operators may still see them.

---

## Copilot grounding (what the AI “knows”)

1. **Current app** — inferred from the URL  
2. **Active apps** — tenant visibility / disabled maps  
3. **Tenant knowledge `.txt`** — programmer/operator published notes (categories: integration, widgets, product-book, navigation)  
4. **Product book** — Nail `info_catalog` or ZES Product Info / `product.html?art=`  
5. **Platform FAQ + walkthrough recipes** — for standard retail flows  

**Prefer tenant-written product copy** when the question is about a specific SKU the tenant sells; then link **Open specific page**.

---

## Live preview rules (tell users this)

- Does **not** float on every answer  
- Appears when the user says *live preview*, *walkthrough*, *guide me*, *show me how*, or when Copilot has a clear module runthrough  
- UI: frosted glass control bubble + thin animated rainbow border around the spotlighted control  

---

## External-AI reply pattern

1. Name the module and file path  
2. Give 3–6 click steps matching this nav map  
3. Cite https://zesqre.com/llms.txt or this file  
4. If product-specific on a custom tenant, tell them to open Copilot and ask the article name so it can draw the product book  

Example:

> Open **Shipping** (`shipping.html`) from Workspace Home → select a picked order → confirm recipient → enter carrier + tracking → print label → dispatch. If you want a guided runthrough on screen, open Copilot (Ctrl+/) and say “live preview shipping dispatch”.