# Inventaire des bugs mobiles — 13 plateformes Groupe KA (2026-08-19)

Audit : Playwright (Pixel 7 / chromium « android » + iPhone 13 / webkit « ios »),
accueil + 2 pages internes par site. Détails bruts : `report.json`,
captures : `audit/*.png`. Inventaire croisé avec la lecture du code source des
13 apps sur leurs nœuds (agents d'exploration, 2026-08-19).

Priorités : **P0** = bloquant (élément inutilisable) · **P1** = bug majeur
(comportement cassé dans un cas réel) · **P2** = finition.

## Causes racines COMMUNES (corrigées une fois dans ka-ui, propagées partout)

| # | Cause racine | Effet | Correctif ka-ui |
|---|---|---|---|
| R1 | `textarea` du widget KA Agent à 13,5 px | zoom automatique iOS au focus, sur les 13 sites | `agent/ka-agent.js` → 16 px |
| R2 | Bulle/panneau KA Agent sans safe-area sur `bottom` (padding-bottom parasite sur un bouton 58 px) | bulle collée sous la barre de geste iPhone | `bottom: calc(18px + env(safe-area-inset-bottom))` |
| R3 | Panneau KA Agent ouvert sans verrou de scroll ; pas de plein écran auto sur téléphone | la page défile derrière le chat | `html.kaa-lock` + plein écran auto ≤640 px + pas de focus clavier forcé au tap |
| R4 | Aucune échelle z-index commune (6 à 18 valeurs ad hoc par site, collision fab/cookie 80/80 sur food-ka, account-menu 60 < tabbar 85 sur resto-ka) | menus sous les barres, empilements imprévisibles | tokens.css : échelle `--z-*` documentée obligatoire |
| R5 | Pas de socle mobile commun (dvh, scroll-lock, barre basse, menu tactile) | chaque site réinvente (ou oublie) | tokens.css : `--vh100`, `.h-viewport`, `.ka-bottombar`+`has-bottombar`, `.ka-scroll-lock`, `.ka-menu`, `.ka-overlay` |
| R6 | Champs < 16 px déclarés par les CSS de site | zoom iOS au focus (constaté sur les 13 sites) | tokens.css : filet `font-size:max(16px,1em)!important` sous `(hover:none) and (pointer:coarse)` |
| R7 | `.gk-badge` 30 px de haut (13 sites) | cible tactile trop petite | tokens.css : extension de zone tactile `::after inset:-8px` au doigt |
| R8 | `viewport-fit=cover` absent (groupe-ka, vrai-prix, sorti-ka, job-ka, trouve-ka) | `env(safe-area-inset-*)` = 0 → toutes les safe-areas codées sont INERTES sur iPhone | à poser par site (meta/`export const viewport`) + règle README |
| R9 | `backdrop-filter` sur headers sticky contenant des éléments `position:fixed` | le `fixed` se re-parente au header (overlay menu réduit à 64 px de haut, backdrops de menus compte qui ne couvrent que le header) | règle README n°4 + correctifs par site (portal / retrait du blur) |

## Par site

### groupe-ka.com (M3U96b, Next 16 + Tailwind v4)
- **P0** — Overlay du menu mobile `fixed inset-0 z-[3000]` DANS le header `md:backdrop-blur-xl` : entre 768 et 1280 px le menu se résout par rapport au header (64 px) → menu inutilisable sur tablette/paysage. (R9)
- **P1** — Menu mobile CSS-only sans verrou de scroll : la page défile derrière le menu ouvert.
- **P1** — Débordement horizontal +141 px sur iOS (`div.ticker-inner`, marquee) — pas de `overflow-x` de garde (tokens.css non importé !).
- **P1** — `src/ka/tokens.css` PRÉSENT MAIS JAMAIS IMPORTÉ (tokens dupliqués dans globals.css, dérive garantie ; safe-area body absente). Pas de `viewport-fit=cover`. (R8)
- **P2** — stat-chips 33 px de haut (/stats), champs du widget (R1).

### lou-ka.com (M3U96b, Vite React)
- **P1** — `.account-backdrop` `fixed inset-0` rendu DANS le header `backdrop-filter:blur(16px)` → le voile ne couvre que 66 px ; tap « à l'extérieur » sous le header ne ferme pas le menu compte. (R9)
- **P1** — Bottom-sheet filtres (`.filterbar.open`) sans verrou de scroll d'arrière-plan.
- **P1** — Champs filtres < 16 px (`input#f-q`, selects) → zoom iOS. (R6)
- **P2** — `a.brand` 124×30 (cible), widget (R1-R3).
- (Bon élève par ailleurs : tabbar + safe-area + `--consent-h` + dvh partout.)

### immo-ka.com (M4M64a, Vite React)
- **P1** — Menu compte ouvert SANS blocage du scroll (constaté à l'audit sur android ET ios).
- **P1** — Bottom-sheet filtres sans verrou de scroll.
- **P1** — `a.ka-signup` 99×17 px — cible tactile quasi intapable.
- **P2** — `a.brand` 92×27, selects < 16 px résiduels, `frontend/styles.css` orphelin (46 Ko) à supprimer.

### vrai-prix.com (M3U96a, Next 16 + Tailwind v4)
- **P1** — Bandeau cookies `fixed bottom-0` SANS `env(safe-area-inset-bottom)` → boutons sous la barre de geste iPhone… et de toute façon inertes : pas de `viewport-fit=cover`. (R8)
- **P1** — Modale préférences cookies sans verrou de scroll.
- **P2** — `a.vp-display` 92×28 (cible), widget (R1-R3).
- (Hamburger CSS-only correct avec scroll lock JS ; blur header déjà limité à `md:` avec commentaire.)

### auto-ka.com (M4M64b, Vite React)
- **P1** — Menu compte sans verrou de scroll (aucun scroll-lock dans toute l'app).
- **P1** — Pas de navigation mobile structurée : nav en bande scrollable horizontale, cibles compressées. `select#f-sort` < 16 px. (R6)
- **P2** — `a.brand` 102×32 (cible).

### fabri-ka.com (M4M64a, Vite React) — le plus propre
- **P1** — `input#header-search-input` + selects < 16 px. (R6)
- **P2** — `.filters { max-height: calc(100vh …) }` (styles.css:1239) → dvh ; `a.logo` 98×29 ; grain redéfini z-0 localement (diverge de tokens 9999) — à réconcilier.

### food-ka.com (M4M64b, Vite React)
- **P1** — Collision z-index 80/80 entre `.fab` et `.cookie-banner` (deux fixed en bas au même niveau, chevauchement possible).
- **P1** — Lightbox ET bottom-sheet sans verrou de scroll (seul le hamburger locke).
- **P1** — `input#f-q` + selects < 16 px ; bandeau cookies /sources = 243 px de haut sans compensation. (R6)
- **P2** — `a.brand` 121×27, `gk-badge` (R7).

### api-ka.com (M3U96b, HTML statique + FastAPI)
- **P1** — Selects et input du playground < 16 px (`#pg-ep`, `#pgf-service`, `#pgf-page`, dates /stats). (R6)
- **P2** — widget (R1-R3) ; nav mobile en bande scrollable (fonctionnelle).

### trouve-ka.com (M2M32, Next 15 + Tailwind 3)
- **P0** — AUCUNE navigation mobile : les 4 liens de nav sont `hidden md:block` sans hamburger ni tabbar → sections inaccessibles au téléphone (sauf footer).
- **P1** — `viewport-fit=cover` absent → safe-areas inertes (R8) ; `min-h-screen` (100vh) sur body ; panneau chat plein écran sans verrou (R3).
- **P2** — `./ka/**` absent du `content` de tailwind.config.ts (piège futur) ; suggest-panel sous le grain (OK visuellement, à surveiller).

### crea-ka.com (M3U96b, SPA vanilla générée par build_frontend.py)
- **P1** — Boutons d'en-tête simplement masqués ≤940 px (compensé par la tabbar — vérifier que TOUTES les destinations restent joignables).
- **P2** — `a.brand` 112×26 (cible) ; widget (R1-R3) ; textarea < 16 px.

### resto-ka.com (M3U96b, Vite React — fork de lou-ka)
- **P1** — `.account-backdrop` fixed DANS le header blurré (même bug que lou-ka). (R9)
- **P1** — `account-backdrop` z-55 / `account-menu` z-60 SOUS la tabbar z-85 et le fab z-80 → le menu compte passe sous la barre basse. (R4)
- **P1** — Bottom-sheet filtres sans verrou de scroll ; 7 selects < 16 px. (R6)
- **P2** — `a.brand` 138×30, gk-badge (R7).

### sorti-ka.com (M3U96a, SPA mono-fichier index.html + FastAPI SSR)
- **P1** — `input#q`, `select#region`, `select#period` < 16 px. (R6)
- **P1** — `viewport-fit=cover` absent (R8) ; header sticky `backdrop-filter: blur(12px)` sans garde (piège R9, pas de fixed dedans aujourd'hui).
- **P2** — `a.brand` 98×26, gk-badge ; footer/badge recopiés à la main (resync inline).

### job-ka.com (M3U96a, Vite React)
- **P1** — Carte `/carte` : `.map-wrap { height: calc(100vh - 58px) }` → la carte bouge/déborde quand la barre du navigateur se replie, et le 58 px est faux quand le header wrappe sur 2 lignes → passer en dvh + hauteur de header mesurée.
- **P1** — Pas de menu mobile : 6 liens de nav en `flex-wrap` sur 2-3 lignes ≤600 px (header envahissant). 8 champs < 16 px. `viewport-fit=cover` absent. (R6, R8)
- **P2** — `a.logo` 63×31, gk-badge--dark (R7).

## Faux positifs identifiés à l'audit (écartés)
- `input#gk-menu` / `input#vp-menu` < 16 px : checkboxes `sr-only` des menus CSS-only (le script d'audit a été corrigé pour les ignorer).
- « pas de compensation padding sous la barre basse [button.kaa-btn/.fab] » : la bulle KA Agent et les FAB ne sont pas des barres pleine largeur — pas de compensation requise (script corrigé : seuil 60 % de largeur).
- fabri-ka bottom-nav « sans compensation » : la compensation existe sur `.app` (styles.css:500), le script ne regardait que body/main.