Skip to content

Parity Figma ↔ App (móvil)

Galería lado a lado del diseño en Figma y la implementación real en la app Android (Jetpack Compose), capturada con Maestro en el Playground. Método: el design-parity-playbook.md del repo terminales-solution. Las notas se miden (muestreo de píxel), no se estiman a ojo; la columna Notas es escrita a mano y se preserva entre regeneraciones. Desviaciones intencionales (donde la app mejora al diseño) se registran en intentional-deviations.md.

Veredicto: ✅ 40 · ⚠️ 15 · ❌ 0 · Actualizado desde los assets en disco.

Nodo Figma 21:50 · código app/src/main/java/com/axios/terminales/ui/components/terminales/atoms/TerminalesButton.kt

Figma App Notas Desviación (propuesta)
✅ Corregido. El contenedor Tonal ahora usa primary-soft #E6EEFA (TerminalesColors.PrimarySubtle) con contenido azul #0052CC, igual que el frame 21:50 (antes SecondaryContainer #E3F2FD). Filled #0052CC, disabled #E5E7EB y radio md correctos. El estado Pressed se comunica con ripple/state-layer de M3 (no intercambia a #003D99) — ver desviación. 🔶 Propuesta — El Pressed no oscurece a #003D99; usa el state-layer/ripple de Material 3.
Figma: n/a platform
ver desviaciones

Nodo Figma 34:73 · código app/src/main/java/com/axios/terminales/ui/components/terminales/atoms/TerminalesIconButton.kt

Figma App Notas Desviación (propuesta)
✅ Corregido. Las tres variantes (Standard/Outlined/Ghost) pintan el glifo en azul primary #0052CC por defecto, igual que el frame 34:73 (antes Outlined/Ghost usaban TextPrimary oscuro). Standard = squircle con relleno tonal; Outlined/Ghost mantienen la forma circular de M3 por convención de plataforma — ver desviación. Callers sobre fondos de color pasan contentColor explícito. 🔶 Propuesta — Outlined/Ghost usan la forma circular de M3 (OutlinedIconButton/IconButton) en vez del squircle del frame; Standard sí es squircle.
Figma: decidir: aceptar circular (plataforma) o unificar Standard a circular en el frame 34:73.
ver desviaciones

Nodo Figma 36:35 · código app/src/main/java/com/axios/terminales/ui/components/terminales/atoms/TerminalesTextField.kt

Figma App Notas Desviación (propuesta)
✅ Default/Error/Disabled coinciden (relleno claro, borde error #EF4444, placeholder #9CA3AF). El estado Focus renderiza el aro azul con foco real (mismo mecanismo M3 verificado en Search Field); el seed estático no lo dispara — limitación de captura, no defecto. TerminalesTextField.kt cablea focusedBorderColor #2196F3 correctamente. —

Nodo Figma 37:35 · código app/src/main/java/com/axios/terminales/ui/components/terminales/atoms/TerminalesSearchField.kt

Figma App Notas Desviación (propuesta)
✅ Estado Active verificado con FOCO REAL (Maestro tap): borde y lupa azules (#2196F3 InputBorderFocused ≈ primary), relleno blanco #FFFFFF, texto Telcel y botón limpiar ✕ — coincide con el frame 37:35. Default gris #F7F9FC también coincide. La ❌ previa era una limitación de captura estática (el seed programático no dispara el visual de foco de M3), no un defecto del componente. 🔶 Propuesta — El campo agrega un botón limpiar (✕) con área táctil ~48dp cuando hay texto, ausente en el Figma Active.
Figma: Agregar un icono trailing de limpiar (✕) al variant Active del nodo 37:35 para reflejar el affordance implementado.
ver desviaciones

Nodo Figma 33:26 · código app/src/main/java/com/axios/terminales/ui/components/terminales/atoms/StatusBadge.kt

Figma App Notas Desviación (propuesta)
✅ Paridad exacta. Fill soft y color de texto por estado coinciden con Figma y con los tokens DS: Success fill medido #ECFCF5 (SuccessSubtle) · texto #10B981; Warning #FFFBEB (WarningSubtle) · #F59E0B; Danger #FEF2F2 (ErrorSubtle) · #EF4444; Info #EFF6FF (InfoSubtle) · #3B82F6 — idénticos en ambos PNG. Es tinte soft real, no alpha(main,0.12). Píldora full-round (TerminalesRadius.full 999dp), 12sp SemiBold, sin punto guía (igual que Figma). Los 4 estados (Success/Warning/Danger/Info) presentes. —

Nodo Figma 35:31 · código app/src/main/java/com/axios/terminales/ui/components/terminales/atoms/CategoryChip.kt

Figma App Notas Desviación (propuesta)
✅ Paridad exacta. Inactive fill medido #F0F4F8 (SurfaceVariant) con texto gris #6B7280 (TextSecondary); Active fill #E6EEFA (PrimarySubtle) con texto azul #0052CC (Primary) — ambos igualan Figma pixel a pixel (Figma: inactive #F0F4F8, active #E6EEFA). Tinte soft real, no alpha(primary,0.12). Píldora full-round (TerminalesRadius.full), 14sp SemiBold. Ambos estados Inactive/Active del frame presentes; el estilo Solid legacy (fill primario sólido + texto blanco) no aparece en Figma y se conserva solo para el no-op del catálogo POS, no es defecto de paridad. —

Nodo Figma 47:52 · código app/src/main/java/com/axios/terminales/ui/components/terminales/atoms/PinDots.kt

Figma App Notas Desviación (propuesta)
✅ Paridad correcta. Punto lleno en app = #0052CC (TerminalesColors.Primary), coincide con el azul del Figma #0050C0 (quantizado; = primary #0052CC de DESIGN.md). Punto vacío: contorno con TerminalesColors.Border #D1D5DB (stroke 1.5dp, CircleShape), que casa con el outline gris del Figma #D0D0D0 mejor que el token #E5E7EB de DESIGN.md. Diámetro 16dp uniforme para lleno y vacío, proporción idéntica a la del frame (dot ≈16px de alto). El conteo de 6 dots es uso del showcase (length=6); el frame solo muestra 2 dots de muestra (vacío+lleno). Estado isError reañade la rampa danger (#EF4444). Sin culpable. —

Nodo Figma 37:45 · código app/src/main/java/com/axios/terminales/ui/components/terminales/atoms/KeypadKey.kt

Figma App Notas Desviación (propuesta)
✅ Paridad correcta en el estado base. Tecla dígito Default: fondo blanco app #FFFFFF (TerminalesColors.KeypadKey) + dígito #1F2933 (TextPrimary), coincide con el Figma (tecla blanca + dígito oscuro #304040). Radio RoundedCornerShape(TerminalesRadius.md=12dp). El estado Presionado del Figma (fondo lavanda #E0E0F0 + dígito azul) se entrega en la app vía ripple de Material sobre la .clickable() en vez de reproducir el fill lavanda estático — decisión idiomática de Android (ver deviation_candidate). Nota: la tecla de Acción del screenshot se renderiza en azul (icono #1762D0 sobre fondo #F0F4F8), mientras el código actual usa tokens danger rojos (KeypadDelete #FEE2E2 / KeypadDeleteIcon #EF4444) en KeypadKey.kt — el screenshot parece anterior a ese cambio de token; el nodo Figma 37:45 no muestra tecla de acción, así que no es verificable contra el frame. 🔶 Propuesta — La tecla usa ripple de Material (.clickable) y target táctil ≥48dp en lugar del fill lavanda estático del estado Pressed del Figma.
Figma: Actualizar el nodo 37:45: documentar el estado Pressed como ripple/overlay de Material (no un fill lavanda fijo) y anotar el target táctil mínimo de 48dp para las teclas.
ver desviaciones

Nodo Figma 45:90 · código app/src/main/java/com/axios/terminales/ui/components/terminales/atoms/TerminalesAvatar.kt

Figma App Notas Desviación (propuesta)
✅ Variante soft correcta y NO invertida: relleno del círculo #E6EEFA (TerminalesColors.PrimarySubtle) e iniciales #0052CC (TerminalesColors.Primary), medidos idénticos en Figma (fill #E6EEFA, iniciales azul primary) y en la app. Forma círculo completo (CircleShape) y pasos de tamaño Small 32 / Medium 40 / Large 56 dp coinciden con la referencia. —

Nodo Figma 47:78 · código app/src/main/java/com/axios/terminales/ui/components/terminales/atoms/InlineAlert.kt

Figma App Notas Desviación (propuesta)
✅ Corregido. Radio ahora TerminalesRadius.sm (8dp) según DESIGN.md (antes md/12dp). Fondos soft por estado exactos (info #EFF6FF, warning #FFFBEB, danger #FEF2F2), glifos con color main correcto, texto #1F2933. —

Nodo Figma 43:44 · código app/src/main/java/com/axios/terminales/ui/components/terminales/molecules/TerminalesCards.kt

Figma App Notas Desviación (propuesta)
✅ Paridad. Superficie blanca CardBackground medida #FFFFFF en ambos lados; borde hairline en la variante plana (transición outer #F5F7FA → #EEEFF2 → #FFFFFF, token CardBorder #E5E7EB) igual que el trazo tenue de Figma; radio lg y estructura título oscuro / cuerpo gris coinciden. El eje Elevation Flat/Raised de las notas está cubierto: la app muestra ‘Plana’ (borde 1dp, level0) y ‘Elevada’ (sombra level2, sin borde), y TerminalesCard mapea exactamente esas dos variantes. Único matiz: el fondo de pantalla app es #F5F7FA vs #F5F5F5 de Figma (superficie, no la tarjeta). —

Nodo Figma 44:50 · código app/src/main/java/com/axios/terminales/ui/components/terminales/molecules/ProductCard.kt

Figma App Notas Desviación (propuesta)
✅ Paridad de color y estructura. Placeholder de imagen medido #F0F4F8 en ambos lados (token SurfaceVariant exacto); nombre #1F2933 (TextPrimary exacto); precio medido #0D5BCF ≈ Primary #0052CC (aclarado por antialias); pill de stock verde-suave fondo #ECFCF5 con texto verde #43C99C, y pill ‘Agotado’ rojo-suave fondo #FEF7F7 con texto #FCD8D8 (danger #EF4444). Ambos estados Default / OutOfStock presentes y ProductCard.kt los cablea (badge success ‘N en stock’ vs danger ‘Agotado’, umbral low-stock). Diferencia medible: el estado OutOfStock de la app baja toda la tarjeta a alpha 0.6 (nombre/precio atenuados), mientras que en Figma la tarjeta agotada mantiene opacidad plena; se trata como mejora de UX (ver deviation_candidate). 🔶 Propuesta — OutOfStock atenúa la tarjeta completa a alpha 0.6 y la vuelve no-clickable; Figma la deja a opacidad plena.
Figma: Añadir un estado OutOfStock con 60% de opacidad (y aspecto no-interactivo) a la variante del componente en Figma para reflejar el comportamiento del código.
ver desviaciones

Nodo Figma 43:57 · código app/src/main/java/com/axios/terminales/ui/components/terminales/molecules/KpiTile.kt

Figma App Notas Desviación (propuesta)
✅ Paridad. Superficie blanca medida #FFFFFF con borde hairline (transición #EEEFF2 → #FFFFFF, token CardBorder #E5E7EB) igual que Figma; etiqueta gris medida #969BA5 (TextSecondary #6B7280) sobre valor oscuro tabular (Figma valor #222C36 ≈ TextPrimary #1F2933). El eje Trend Up/Down está bien tintado: delta ascendente verde medido #0F9A6F/#169D73 (SuccessText #059669, familia success #10B981) y delta descendente rojo medido #F7A3A3 (danger Error #EF4444), coincidiendo con ‘+12.5% vs ayer’ verde y ‘-4.2% vs ayer’ rojo del diseño. KpiTile.kt usa figuras tabulares (tnum) y kpiTrendColor mapea los tokens correctos. —

Nodo Figma 41:60 · código app/src/main/java/com/axios/terminales/ui/components/terminales/molecules/ListRow.kt

Figma App Notas Desviación (propuesta)
✅ Corregido. El contenedor del icono guía ahora es círculo (CircleShape) con tinte primary-soft #E6EEFA e icono azul, igual que el frame 41:60 (antes cuadro redondeado + SurfaceVariant). El chevron se conserva gris (text-tertiary) como convención de plataforma — ver desviación. Título/subtítulo/badge correctos. 🔶 Propuesta — Chevron gris (text.tertiary) en lugar del azul primary de Figma
Figma: Re-tintar el chevron del frame list-row a text.tertiary gris (#9CA3AF) para alinear con la convención de Android; el azul se reserva para acciones.
ver desviaciones

Nodo Figma 43:66 · código app/src/main/java/com/axios/terminales/ui/components/terminales/molecules/SummaryRow.kt

Figma App Notas Desviación (propuesta)
✅ Corregido. La etiqueta TOTAL ahora usa TextPrimary #1F2933 cuando isTotal (antes TextSecondary), separando énfasis de color; el valor TOTAL azul #0052CC como opt-in. Subtotal y divisor correctos. —

Nodo Figma 47:60 · código app/src/main/java/com/axios/terminales/ui/components/terminales/molecules/ReceiptRow.kt

Figma App Notas Desviación (propuesta)
✅ Coincide con Figma: descripción en gris secondary #A0A0B0≈#6B7280 (no cae en el bug de usar primary), monto derecho en primary #101020≈#1F2933 con peso Medium, y divisor punteado presente en ambos (Canvas dashPathEffect, hairline ~1dp sobre #F5F7FA). Estructura de dos columnas idéntica. Sin culpable. —

Nodo Figma 44:80 · código app/src/main/java/com/axios/terminales/ui/components/terminales/molecules/CartBar.kt

Figma App Notas Desviación (propuesta)
✅ Corregido. El glifo del badge ahora es un carrito (TerminalesIcons.Cart) en vez de tarjeta de crédito, igual que Figma; barra azul #0052CC y badge translúcido correctos. La CTA Ver carrito se conserva como píldora blanca (afordancia mejor) — ver desviación. 🔶 Propuesta — La app dibuja ‘Ver carrito’ como píldora blanca (#FFFFFF) con chevron en vez del texto blanco plano del Figma.
Figma: Actualizar el frame 44:80 para renderizar ‘Ver carrito’ como botón/píldora blanca con chevron, o confirmar el texto plano como canónico.
ver desviaciones

Nodo Figma 44:69 · código app/src/main/java/com/axios/terminales/ui/components/terminales/molecules/QuantityStepper.kt

Figma App Notas Desviación (propuesta)
✅ Corregido. Los botones +/- ahora usan la variante Standard (FilledTonal) con relleno primary-soft #E6EEFA e iconos azules #0052CC, igual que Figma (antes Outlined gris). Geometría 36dp y − deshabilitado en el mínimo correctos. —

Nodo Figma 48:63 · código app/src/main/java/com/axios/terminales/ui/components/terminales/molecules/ProviderTile.kt

Figma App Notas Desviación (propuesta)
✅ Bug de label invisible CORREGIDO (label seleccionado azul #0052CC, visible). El badge usa el color de marca del proveedor (Telcel azul, AT&T, Movistar) con la inicial — DESVIACIÓN INTENCIONAL ACEPTADA (2026-07-26): el color de marca ayuda al reconocimiento rápido en la cuadrícula. El aro de selección va en el badge. ✅ Aceptada — Badge con color de marca del proveedor (Telcel azul, etc.) + inicial, en vez del badge gris/soft genérico del frame.
Figma: actualizar el nodo 48:63 a la variante con color de marca.
ver desviaciones

Nodo Figma 40:45 · código app/src/main/java/com/axios/terminales/ui/components/terminales/organisms/TerminalesTopBars.kt

Figma App Notas Desviación (propuesta)
⚠️ Re-auditado 2026-08-05: el componente TerminalesTopBar sigue correcto (barra blanca #FFFFFF, título oscuro #1F2933, divisor hairline; igual a 40:45) y se usa aún en pantallas secundarias/auth. CAMBIO de esta iteración: las top bars fueron REMOVIDAS de las 5 pantallas principales del shell (Inicio/Vender/Carrito/Reportes/Cuenta) — ahora sin barra; las notificaciones se movieron al FAB de navegación. Ver desviación. 🔶 Propuesta — Top bars removidas de las 5 pantallas principales del shell; notificaciones movidas al FAB de navegación.
Figma: En los frames M06/M11/M13/M24/M25 quitar la top bar; documentar notificaciones en el FAB. Conservar 40:45 para pantallas secundarias.
ver desviaciones

Nodo Figma 45:53 · código app/src/main/java/com/axios/terminales/ui/components/terminales/organisms/BottomNav.kt

Figma App Notas Desviación (propuesta)
⚠️ Re-auditado 2026-08-05 (online, sin banner). El item conserva paridad de estados (activo #0052CC / inactivo #9CA3AF), pero su contenedor (Bottom Nav Bar) fue reemplazado por el FAB de navegación en el shell. Se mantiene solo como referencia del DS. Ver desviación (bottom-nav → FAB). 🔶 Propuesta — El item de bottom-nav queda como referencia del DS; su contenedor fue reemplazado por el FAB de navegación global.
Figma: Deprecar el item 45:53 junto con el bottom-nav 45:56; mapear sus estados al FAB de navegación.
ver desviaciones

Nodo Figma 45:56 · código app/src/main/java/com/axios/terminales/ui/components/terminales/organisms/BottomNav.kt

Figma App Notas Desviación (propuesta)
⚠️ Re-auditado 2026-08-05 (online, sin banner). El componente BottomNav sigue en el DS (ahora con 6 destinos incl. «Más…») pero fue REEMPLAZADO en el shell por el FAB de navegación global (abajo-izquierda) — la bottom-nav ya NO se monta en producción. La captura muestra el showcase del DS. Ver desviación. 🔶 Propuesta — La bottom-nav fue reemplazada por un FAB de navegación global speed-dial (Inicio/Vender/Carrito/Reportes/Cuenta/Más/Notificaciones).
Figma: Deprecar el bottom-nav 45:56 en el diseño y crear el componente «FAB de navegación (speed-dial)».
ver desviaciones

Nodo Figma 48:66 · código app/src/main/java/com/axios/terminales/ui/components/terminales/organisms/BottomSheetHost.kt

Figma App Notas Desviación (propuesta)
✅ Tokens núcleo correctos (superficie #FFFFFF, radio superior ~24, título #1F2933, CTA #0052CC, scrim oscuro #626364). El drag handle y la ✕ usan tonos M3/oscuros más VISIBLES que el gris muy claro de Figma (#E3E6E9/#A6ACB7, bajo contraste) — se conservan por afordancia/contraste (ver desviación). Presencia de scrim + drag handle + cierre por gesto = convención M3. 🔶 Propuesta — Hoja modal M3: scrim oscuro, drag handle y ✕ con tono más visible que el gris muy claro de Figma; cierre por gesto.
Figma: actualizar el prototipo 48:66 para mostrar scrim + handle/✕ con tono representativo de M3.
ver desviaciones

Nodo Figma 52:27 · código app/src/main/java/com/axios/terminales/auth/LoginScreen.kt

Figma App Notas Desviación (propuesta)
⚠️ Misma pantalla de login: layout, proporción y tokens base coinciden — fondo #F5F7FA en ambos, tile de marca + wordmark bold + tagline gris, campos con relleno claro (#F5F7FA/#F7F9FC) y borde #E5E7EB, enlace ¿Olvidaste tu contraseña? azul #1862D1≈#0052CC, y el botón Entrar es el DS primario #0052CC en el frame. Único gap de STYLE: el botón secundario ‘Acceso rápido con PIN’ se renderiza con borde gris #E5E7EB + texto oscuro #1F2933 (variante DS Outlined neutral), mientras el frame lo dibuja como botón azul (borde + label #0052CC). No cuentan contra parity: el Entrar en gris #E5E7EB y el ‘Enviar enlace mágico’ en gris #9CA3AF son artefactos de captura del estado vacío/deshabilitado (formulario sin datos) — el frame muestra el estado activo; el wordmark ‘terminales’ vs ‘Terminales’ es copy/branding (feature) del recurso app_name; y el ojo de mostrar/ocultar contraseña es un extra del app. 🔶 Propuesta — El secundario ‘Acceso rápido con PIN’ usa la variante DS Outlined neutral (borde #E5E7EB + texto #1F2933) en vez del outline azul del frame (#0052CC).
Figma: Actualizar el frame 52:27 para que el botón secundario adopte el outline neutro (borde #E5E7EB + label #1F2933) en lugar del azul #0052CC.
ver desviaciones

Nodo Figma 300:4256 · código app/src/main/java/com/axios/terminales/auth/PinLoginScreen.kt

Figma App Notas Desviación (propuesta)
⚠️ Backspace CORREGIDO: la tecla de acción ahora usa soft-primary (#E6EEFA + icono #0052CC) en vez del token danger rojo — intención neutra igual que el frame 300:4256. Barra blanca + título a la izquierda confirmados; perfiles (JP/AM/LR), PIN dots y teclas de dígito coinciden. Residual menor de STYLE: el gap vertical entre teclas está colapsado (las teclas se leen como columnas conectadas) vs celdas separadas del frame — ajuste de spacing del teclado pendiente. El botón Desbloquear explícito es una desviación propuesta (submit accesible). (Nota: la tecla de borrar del teclado ya se corrigió a neutro soft-primary.) 🔶 Propuesta — La app añade un botón primario ‘Desbloquear’ bajo el teclado (submit explícito) que el frame 300:4256 no incluye.
Figma: Añadir un botón primario ‘Desbloquear’ entre el teclado y el enlace ‘Cambiar usuario’ en el frame 300:4256, con estados enabled/disabled/loading.
ver desviaciones

Nodo Figma 55:59 · código app/src/main/java/com/axios/terminales/auth/MfaScreen.kt

Figma App Notas Desviación (propuesta)
✅ Re-auditado 2026-08-07 (online, N86 720×1280). RESUELTO (#325/S1): el input OTP de 6 celdas segmentadas (TerminalesOtpInput), el contador «Reenviar código en M:SS» (ResendCode, 45s) y el CTA «Verificar» ya existen en código (MfaScreen.kt → ChallengeCodeForm). La captura muestra el selector de factor porque el medio-frame de entrada de código sólo se renderiza tras challengeId != null (cuando Appwrite emite el reto); el harness offline no tiene sesión para emitirlo (al tocar «Recibir código» surge «Algo salió mal»), así que ese estado es verificado en código, no capturable estáticamente. Tokens correctos y medidos (candado #E6EEFA, CTA/link #0052CC, fondo #F5F7FA): el defecto era la AUSENCIA de la feature, ahora presente. —

Nodo Figma 56:88 · código app/src/main/java/com/axios/terminales/auth/RecoveryScreens.kt

Figma App Notas Desviación (propuesta)
✅ Mismo screen (recuperar contraseña) y los tokens coinciden medidos. TOP BAR: confirmado el flip a blanco — barra #FFFFFF con título oscuro alineado a la izquierda “Recuperar contraseña” (≈ #1F2933) y flecha de regreso; igual que el Figma. Tile de ayuda azul claro + círculo de interrogación azul sólido #0052CC (idéntico Figma), headline bold oscuro “¿Olvidaste tu contraseña?”, subtítulo gris, label “Correo Electrónico” y TextField DS con borde claro (#E5E7EB ≈ Figma #F3F5F8) y valor oscuro. STYLE: paleta correcta, no hay tokens mal aplicados. Residuales, todos de ESTADO/captura (no defectos): (1) el CTA “Enviar enlace” aparece en estado DESHABILITADO — relleno gris medido #E5E7EB con texto #B7BBC3 — porque canSendRecovery=false al capturar; el Figma lo dibuja activo azul #0052CC, que es el token correcto del TerminalesButton cuando está enabled; (2) el banner informativo azul “Si el correo existe…” del Figma no aparece en la captura porque recoverySent=false, pero el código sí lo implementa (InlineAlert Info). FEATURE: el Figma incluye una campana de notificaciones al extremo derecho de la top bar que la app omite (AuthTopBar sólo lleva back+título); omisión deliberada y correcta en un flujo pre-login → ver deviation_candidate. Sin culpable de token. 🔶 Propuesta — La app omite la campana de notificaciones que el Figma dibuja en la top bar de recuperar contraseña
Figma: Eliminar el icono de campana del trailing de la top bar en el frame 56:88 (y demás frames del flujo auth) para reflejar una barra auth con solo flecha de regreso + título.
ver desviaciones

Nodo Figma 57:85 · código app/src/main/java/com/axios/terminales/auth/StoreSelectionScreen.kt

Figma App Notas Desviación (propuesta)
✅ Misma pantalla (selección de tienda/terminal). Layout idéntico: header con back + título “Selecciona tu tienda”, subtítulo, tres tarjetas de tienda (glifo circular + nombre/dirección + badge de estado) y CTA “Continuar”. Tokens medidos coinciden: CTA #0052CC en ambos (Figma #0052CC / app #0052CC), borde de tarjeta seleccionada = primary #0052CC, superficie de tarjeta #FFFFFF, fondo #F5F7FA idéntico, círculo del glifo seleccionado con tinte primary (Figma #A0BFEC / app #AAC5EE) y badges verde (Abierta) / ámbar (Sin turno). Afordancia de selección correcta: borde 2dp primary + relleno primary-subtle. STYLE: sin desviaciones de token/componente. FEATURE: única diferencia — el header de Figma lleva un icono de campana (notificaciones) arriba a la derecha que la app no renderiza; es una omisión menor en una pantalla pre-sesión, no rompe la paridad. 🔶 Propuesta — La app omite el icono de campana (notificaciones) del header que sí aparece en el frame de Figma.
Figma: Eliminar el icono de campana del header del frame 57:85 para alinearlo con el AuthTopBar (solo back + título).
ver desviaciones

Nodo Figma 300:4317 · código app/src/main/java/com/axios/terminales/ui/screens/home/HomeScreen.kt

Figma App Notas Desviación (propuesta)
✅ Re-auditado 2026-08-07 (online + sembrado, N86 720×1280). RESUELTO (#322/F1): AppShell reserva inset inferior = alto del nav-FAB; al hacer scroll al fondo la última fila de «Actividad reciente» ($89.00 · 01:40 p.m.) queda completamente por encima del FAB de navegación — ya no se recorta contenido. Saludo inline «Hola, Ana Cajera» + fecha, KPIs sembrados (Ventas hoy $184,320.00 · Transacciones 1284), CTA «Nueva venta» y grid de accesos. La divergencia vs el frame 300:4317 (top bar + bottom-nav) sigue siendo intencional → ver desviación. (Artefacto de harness, no defecto: FAB llave inglesa «Playground (dev)» abajo-derecha, gated a dashboard bajo startPlayground.) 🔶 Propuesta — Dashboard sin top bar (saludo inline) y sin bottom-nav: navegación global vía FAB speed-dial (Inicio/Vender/Carrito/Reportes/Cuenta/Más/Notificaciones).
Figma: Rehacer M06 300:4317 sin top bar (encabezado inline «Hola, {nombre}») y sin bottom-nav; documentar el FAB de navegación global.
ver desviaciones

Nodo Figma 67:303 · código app/src/main/java/com/axios/terminales/ui/screens/pos/CatalogScreen.kt

Figma App Notas Desviación (propuesta)
⚠️ Re-auditado 2026-08-07 (online + sembrado, N86). RESUELTO (#324/F5): el FAB de caja (kiosco) ya NO colisiona con la barra CTA inferior — el «+» abajo-izquierda queda despejado del bloque azul «$77.00 · Ver carrito». Encabezado ligero «Punto de venta» presente (#323/S10) y campo de búsqueda con lupa inline (F2). Residual (se conserva ⚠️): (a) la fila de chips de categoría sigue clippeando «Tiempo A…» al borde derecho sin afordancia de fade (S12, no aterrizado); (b) CAPTURA — bajo el harness de seed actual el grid de productos aparece VACÍO (el carrito sí siembra 4 artículos $77.00, pero el listado del catálogo no); es una regresión de siembra del catálogo revelada por la recaptura, NO un defecto de estilo → seguimiento en #350 (no se arregla en esta barrera). 🔶 Propuesta — POS en modo kiosco: sin top bar y sin FAB de navegación; FAB de operaciones de caja (Nueva venta/En espera/Mov. de caja/Asignar cliente/Cerrar turno/Anular venta), espejo del terminal/home web.
Figma: Actualizar M11 67:303 a layout kiosco (sin top bar, sin bottom-nav) con el FAB de caja; reconciliar el set de acciones con M35 300:4289.
ver desviaciones

Nodo Figma 300:4196 · código app/src/main/java/com/axios/terminales/ui/screens/pos/CartScreen.kt

Figma App Notas Desviación (propuesta)
✅ Re-auditado 2026-08-07 (online + sembrado, N86). RESUELTO (#324/F5): el FAB de caja ya no colisiona con la barra «Cobrar · $77.00» — el «+» abajo-izquierda queda despejado. Carrito sembrado (Coca-Cola ×2, Sabritas ×1, Leche Lala ×1), stepper de cantidad soft-blue, resumen Subtotal/Descuento/IVA/TOTAL $77.00 con TOTAL en primary. Encabezado «Venta actual» presente (#323/S10). Paridad con el frame 300:4196 en modo kiosco. 🔶 Propuesta — Carrito en modo kiosco: sin top bar y sin FAB de navegación; FAB de operaciones de caja.
Figma: Actualizar M13 300:4196 a layout kiosco (sin top bar, sin bottom-nav) con el FAB de caja.
ver desviaciones

Nodo Figma 76:503 · código app/src/main/java/com/axios/terminales/ui/screens/vas/VasServicePaymentScreen.kt

Figma App Notas Desviación (propuesta)
✅ Misma pantalla (Pago de servicio) — captura ahora poblada (flag VAS on + VasMocks). Layout idéntico: chips Categoría (Luz/Agua/Gas/Internet/Teléfono, 5 iguales al diseño), ProviderTile CFE, Número de referencia, SummaryRow Importe/Comisión/Total ($688.00) y CTA. Tokens medidos coinciden: fondo #F5F7FA=#F5F7FA, botón/Total en primary #0052CC. FEATURE: paridad completa — VasMocks.kt sirve las mismas 5 categorías + proveedor único CFE (Comisión Federal de Electricidad), sin carencias vs diseño. STYLE: sin desviación de token/componente. Única diferencia de ESTADO (no de token): la app deshabilita el CTA en gris #D0D3DA mientras la referencia obligatoria está vacía; Figma lo muestra azul #0052CC habilitado como snapshot lleno. Es gating de validación correcto (confirmado por M22, donde el campo opcional deja el CTA habilitado), no un defecto. —

Nodo Figma 83:647 · código app/src/main/java/com/axios/terminales/account/MyAccountScreen.kt

Figma App Notas Desviación (propuesta)
✅ Re-auditado 2026-08-07 (online + sembrado, N86). RESUELTO (#329/S9): las filas (Datos personales, Dispositivos y terminales, Seguridad, Apariencia, Soporte) se renderizan habilitadas con contraste adecuado — título en TextPrimary oscuro + subtítulo secundario gris + chevron, con ícono en círculo soft; ya no se leen como «cargando». Card de perfil (AC · Ana Cajera · Empleado). «Cerrar sesión» en outline danger. «Sin tienda asignada» es gap de seed, no defecto. 🔶 Propuesta — Mi cuenta sin top bar: el encabezado es la ProfileCard; navegación y notificaciones viven en el FAB global.
Figma: Quitar la top bar (y su campana) del frame 24 83:647; el encabezado pasa a ser la ProfileCard.
ver desviaciones

Nodo Figma 85:699 · código app/src/main/java/com/axios/terminales/reporting/ReportsScreen.kt

Figma App Notas Desviación (propuesta)
✅ Re-auditado 2026-08-07 (online + sembrado, N86). RESUELTO (#322/F1 + #323/S10): encabezado ligero «Reportes» presente y el inset inferior del nav-FAB aplica — al hacer scroll al fondo, «Corte Z», «Ventas del día» y el botón «Exportar / Compartir» quedan por encima del FAB. Sembrado: «Ventas del periodo $184,320.00», Transacciones 1284, Ventas por método (Efectivo $92,160 · Tarjeta $80,160 · Saldo $12,000). «Comisiones —» es gap de seed. La divergencia por top-bar removida es intencional → desviación. 🔶 Propuesta — Reportes sin top bar: título omitido; navegación en el FAB global.
Figma: Quitar la top bar del frame 25 85:699; opcionalmente añadir un encabezado inline «Reportes».
ver desviaciones

Nodo Figma 300:4041 · código app/src/main/java/com/axios/terminales/ui/screens/customers/ClientesListaScreen.kt

Figma App Notas Desviación (propuesta)
✅ Re-auditado 2026-08-07 (online, N86). RESUELTO (#333/F2): el campo «Buscar cliente…» usa lupa inline sin botón azul trailing. Lista sembrada (María González, Juan Pérez, Sofía Ramírez, Carlos López, Ana Torres, Cliente general) con avatar de iniciales + chevron. Encabezado «Clientes» con back. Paridad con 300:4041. —

Nodo Figma 300:4052 · código app/src/main/java/com/axios/terminales/ui/screens/customers/ClienteDetalleScreen.kt

Figma App Notas Desviación (propuesta)
✅ Re-captura correcta: ahora sí es el detalle del cliente. Paridad de tokens completa. Header avatar #E6EEFA + iniciales azules, nombre oscuro y subtítulo teléfono·email gris coinciden. Grid 2×2 de KpiTiles blancos sobre fondo #F5F7FA idéntico. Tokens medidos exactos: Total gastado en Primary azul (app #0040C0/#0050C0 vs figma #0050C0, ≈ #0052CC), Saldo (fiado) en Success verde (app #10B980 vs figma #10B080/#00B070, ≈ #10B981), Compras/Ticket prom. en neutro oscuro sobre blanco. Sección ‘Compras recientes’ con las mismas 3 filas mock (24 Oct #1042 $372.00 / 22 Oct #1019 $640.00 / 20 Oct #0987 $120.00), fecha·folio a la izquierda y monto a la derecha. CTA ‘Nueva venta’ medido #0052CC exacto en ambos lados. No hay desviación de STYLE ni de FEATURE en el contenido. Nota menor de chrome compartida: el ícono de campana del top app bar presente en Figma (gris #607080) está ausente en el app (igual que en M30); es shell global del app, no un defecto de contenido de esta pantalla. —

Nodo Figma 60:177 · código app/src/main/java/com/axios/terminales/notifications/NotificationsScreen.kt

Figma App Notas Desviación (propuesta)
⚠️ Misma pantalla, ahora poblada (3 notifs sembradas agrupadas por día). TopAppBar blanca #FFFFFF ‘Notificaciones’ + back correctas. Divergencias de ESTILO medidas: (1) Indicador de no-leído — la app pinta un punto ROJO #EF4444 a la DERECHA de la fila, mientras Figma usa punto AZUL (medido #CCDCF5 sobre tarjeta tintada #E6EEFA) a la IZQUIERDA + fondo de tarjeta azul claro para los no-leídos; token semántico equivocado (danger vs primary). (2) Contenedor de ícono — la app usa cuadro redondeado (squircle) tintado (glifo #0052CC), Figma usa CÍRCULO de color por tipo. (3) Cabecera — la app movió ‘marcar todas como leídas’ a un ícono de check en la app bar y OMITE la fila contadora ‘N sin leer’ + el link de texto azul ‘Marcar todas como leídas’ que dibuja Figma. Diferencia de formato (no estilo): agrupación por fecha absoluta ‘25 Jul 2025 / 24 Jul 2025’ (NotificationDayGrouper.kt) vs ‘Hoy / Ayer’ del Figma; y las filas muestran fecha como tercera línea en vez de hora HH:MM. Contenido distinto por datos sembrados (esperado). Culpable: NotificationRow/NotificationsScreen (forma de ícono + indicador no-leído + cabecera contadora). —

Nodo Figma 61:212 · código app/src/main/java/com/axios/terminales/shifts/ (grep-confirm)

Figma App Notas Desviación (propuesta)
⚠️ Misma pantalla (encabezado resumen + keypad numérico + monto + botón ‘Abrir turno’). STYLE: (1) el encabezado ShiftSummaryCard renderiza SummaryRow apiladas a sangre completa sobre Surface blanco sin card/radio (Terminal —, Cajero —, y una fila extra Fondo de caja $0.00) en vez de la Card blanca insertada de DOS columnas Terminal 🔶 Propuesta — Tecla borrar del keypad en rojo (#F58181, token KeypadDelete + ícono X) en vez del neutro azul del Figma (#F0F4F8 / ⌫ #83AAE4).
Figma: Actualizar el keypad del DS en Figma para que la tecla borrar use el fondo/ícono danger, alineando el diseño con NumericKeypad.KeypadDeleteButton.
ver desviaciones

Nodo Figma 300:4229 · código app/src/main/java/com/axios/terminales/shifts/ (grep-confirm)

Figma App Notas Desviación (propuesta)
⚠️ Misma pantalla, poblada. Divergencia estructural ACEPTADA (carve-out §4.6): la app usa 3 KpiTile + ‘Efectivo contado’ con NumericKeypad + ‘Diferencia’ + InlineAlert ‘Descuadre detectado’, EN LUGAR del desglose ‘Conteo por denominación’ + botón ‘Imprimir corte (Z)’ del Figma — NO es defecto. Tokens compartidos correctos y medidos: KpiTile fondo blanco #FFFFFF; tecla de borrado del keypad ahora en soft-primary (relleno azul #1F67D2 con glifo claro #D0DFF6, según DS, ya NO roja como en la nota vieja de M08); InlineAlert danger y ‘Diferencia -$92,160.00’ en rojo (verificado visualmente contra el rojo del Figma). RESIDUAL CONOCIDO (menor) confirmado con datos: los 3 KpiTile en fila truncan valores largos de dinero — se leen ‘$184,3…’, ‘$92,16…’, ‘$80,16…’ en vez del monto completo. Culpable del ⚠️: el ancho de KpiTile en fila de 3 (truncamiento), no la estructura del carve-out. —

Nodo Figma 63:258 · código app/src/main/java/com/axios/terminales/shifts/ (grep-confirm)

Figma App Notas Desviación (propuesta)
✅ Re-auditado 2026-08-07 (online + sembrado, N86). RESUELTO (#328/S2): (1) el FAB «+» ahora tiene tamaño acotado (píldora soft-blue abajo-derecha), ya no gigante cubriendo la lista; (2) el subtítulo muestra hora formateada «Entrada · 08:00 / Salida · 11:30 / Entrada · 13:15», no el timestamp ISO crudo; (3) cada fila lleva círculo de dirección por tipo (Entrada = «+» verde #41C59D en círculo soft; Salida = flecha roja) y las filas se agrupan en un Card. Montos medidos: −$500.00 rojo #F58888 (Error), +montos verde (Success) — coinciden con Figma 63:258. Cabecera «Movimientos de caja» con back. —

Nodo Figma 68:344 · código app/src/main/java/com/axios/terminales/ui/screens/pos/ProductDetailScreen.kt

Figma App Notas Desviación (propuesta)
⚠️ Re-capturado 2026-08-05 (online + sembrado, sin banner) — AHORA POBLADO (Coca-Cola 600ml, $18.00, «Refresco», Cantidad stepper, «Agregar al carrito · $18.00»); resuelve el 🔄 previo (estado loading). Top App Bar «Detalle» + back conservada (pantalla secundaria). Observaciones: «Existencias no disponibles» (stock 0 sembrado) y el nav FAB del shell se solapa con el CTA «Agregar al carrito» (mismo patrón de inset que F1). —

Nodo Figma 70:389 · código app/src/main/java/com/axios/terminales/ui/screens/pos/CheckoutScreens.kt

Figma App Notas Desviación (propuesta)
✅ Misma pantalla y paridad de tokens sólida. Título “Cobrar” + flecha atrás en ambos, Top App Bar blanca, fondo #F5F7FA. Tarjeta “Total a cobrar” con primario medido #0052CC == #0052CC (app). Lista de métodos idéntica en orden y copy: Efectivo (“Pago en efectivo + cambio”, seleccionado), Tarjeta (“Inserta, desliza o acerca”), Saldo (“Saldo del comercio”), Pago mixto (“Combina varios métodos”); tarjeta seleccionada con tinte azul claro #DCE4F0 (Figma) vs #E6EEFA (app) — misma familia, diferencia imperceptible. Botón “Continuar” azul primario en ambos. DIFERENCIAS solo de FEATURE/ESTADO, no de token: (1) monto $406.00 (frame) vs $77.00 (app) = dato del carrito; (2) la app deshabilita/atenúa la fila Saldo (CheckoutScreens.kt:133, fuera de alcance MVP) mientras el frame la dibuja activa; (3) la app añade el link “Más acciones” (SharedActionsSheet, CheckoutScreens.kt:69) y el bottom nav, ausentes en el frame aislado; (4) iconos de tender levemente distintos (Figma: cartera verde para Efectivo; app: billete en tile azul), ambos dentro del lenguaje azul del DS. STYLE: sin culpable de token. FEATURE: adiciones de la app (Más acciones, nav) y Saldo deshabilitado. —

Nodo Figma 71:403 · código app/src/main/java/com/axios/terminales/ui/screens/pos/ (grep-confirm CardCheckoutScreens.kt)

Figma App Notas Desviación (propuesta)
⚠️ Misma pantalla (título “Cobro con tarjeta” + flecha atrás, label “Monto a cobrar”, chips de preajuste $100/$200/$500/$1,000, NumericKeypad 3×4 y “Continuar” en ambos; NOTA: este frame es de chrome BLANCO, no lleva el blue-chrome de la barra). Fondo #F5F7FA vs #F5F7FA y teclas del keypad blancas #FFFFFF vs #FFFFFF coinciden. PERO hay dos desviaciones de STYLE reales (CardCheckoutScreens.kt / AmountChipButton.kt): (1) CHIPS de preajuste — Figma son PÍLDORAS grises sin borde ni sombra, relleno medido #F0F4F8, etiqueta entera “$100”…“$1,000”; la app renderiza TARJETAS blancas #FFFFFF con borde + sombra 2dp en un Row weight(1f) de ancho igual, y la etiqueta usa TerminalesFormat.moneyCents → agrega “.00” (“$100.00”), de modo que “$1,000.00” NO cabe y se PARTE en 3 líneas (“$1,0 / 00.0 / 0”) — defecto de formato+ancho. (2) TECLA BORRAR — Figma es azul (chrome del flujo de tarjeta), fondo medido #3D7BD7 con icono azul; la app la pinta ROJA: KeypadDelete #FEE2E2 / KeypadDeleteIcon #EF4444 (medido bg #F26363), desviándose del token azul del frame. DIFERENCIA de ESTADO (no defecto): monto $1,250.00 (frame) vs $0.00 (app, sin captura) y por eso “Continuar” sale deshabilitado en gris #E5E7EB. STYLE culpable: AmountChipButton (tarjeta blanca+sombra en vez de píldora gris; label moneyCents con .00 que provoca wrap) y token KeypadDelete rojo vs azul del frame. (Nota: la tecla de borrar del teclado ya se corrigió a neutro soft-primary.) —

Nodo Figma 82:631 · código app/src/main/java/com/axios/terminales/ (grep-confirm terminales_transfer)

Figma App Notas Desviación (propuesta)
✅ Re-auditado 2026-08-07 (online + sembrado, N86). RESUELTO (#333/F2): el campo «Buscar comercio o folio…» usa lupa inline (TerminalesDebouncedSearchField), sin el botón azul trailing extra que marcaba el defecto. Chips de recientes (Norte/Sur/Plaza/Mayoreo), «Monto a transferir $2,000.00» y CTA «Continuar» primary. Paridad con 82:631. —

Nodo Figma 86:740 · código app/src/main/java/com/axios/terminales/reporting/ (grep-confirm)

Figma App Notas Desviación (propuesta)
✅ Misma pantalla, AHORA POBLADA con las 3 filas sembradas (A-1042 $540.00 Pagado / A-1041 $128.50 Cancelado / A-1040 $89.00 Reembolsado). Andamiaje y tokens correctos y medidos: Top App Bar blanca ‘Historial’ + back; control segmentado ‘Por folio / Por fecha’ y chips ‘Hoy / Semana / Mes’ con pastilla azul en el activo; filas en Card con ícono de recibo circular. StatusBadge con tokens correctos por estado: Pagado en verde (fondo medido #A7E7D1, success), Cancelado en rojo (danger), Reembolsado en ámbar (warning) — cada uno como pastilla StatusBadge coincidente con el DS. Diferencias de ESTADO (no de estilo, no penalizan): la app abre por defecto en la pestaña ‘Por fecha’ (TicketHistoryViewModel init DATE) mientras el frame ilustra ‘Por folio’ seleccionada con el campo ‘Número de folio…’; y la app añade badge de no-leídas ‘2’ rojo donde Figma pone campana. El ícono de fila es recibo para las 3 (datos tipo ticket) vs la variación cart/recibo/teléfono del ejemplo Figma — diferencia de datos, esperado. —

Nodo Figma 291:951 · código app/src/main/java/com/axios/terminales/ (grep-confirm terminales_shift_add_movement)

Figma App Notas Desviación (propuesta)
✅ Re-auditado 2026-08-07 (online + sembrado, N86). RESUELTO (#326/S3): control segmentado «Entrada 🔶 Propuesta — La app captura el monto con un NumericKeypad bajo el display en lugar del campo de texto ‘Monto’ de Figma.
Figma: Actualizar el frame 291:951 para colocar el NumericKeypad del DS bajo el display de monto, conservando el campo Monto solo como display de solo lectura.
ver desviaciones

Nodo Figma 300:4185 · código app/src/main/java/com/axios/terminales/ui/screens/customers/VentasEnEsperaScreen.kt

Figma App Notas Desviación (propuesta)
✅ Re-auditado 2026-08-07 (online + sembrado, N86). Sembrado (#335): tabs «Mis carritos —

Nodo Figma 75:475 · código app/src/main/java/com/axios/terminales/reporting/TicketDetailScreen.kt (grep-confirm)

Figma App Notas Desviación (propuesta)
⚠️ Misma pantalla, AHORA POBLADA (ticket o-1 / Folio A-1042). Alta paridad estructural: Card con SummaryRows, StatusBadge ‘Pagado’ verde (fondo medido #A7E7D0, success), divisor punteado, ‘Total’ en negrita, InlineAlert ámbar ‘Cancelar o reembolsar requiere autorización de un supervisor’ (fondo medido #FFFBEB, warning) y botón outline DANGER ‘Cancelar / Reembolsar’ con texto/borde rojo (medido #F18A8B) — todos correctos vs Figma. Divergencia de ESTILO medida: los botones secundarios ‘Reimprimir’ / ‘Compartir’ usan outline NEUTRO (texto gris medido #60676F, borde gris claro) en lugar del outline PRIMARIO azul del Figma (texto azul, medido antialias #74A0E2). Divergencia de COPY: la app bar dice ‘Detalle de ticket’ vs ‘Ticket #1029’ del Figma (además sin campana). La app AGREGA fila ‘Subtotal’ y línea de tienda ‘Tienda Demo’ que el Figma no muestra (más detalle → candidato de desviación). Culpable del ⚠️: la variante de botón secundario neutro donde el DS/Figma pide primario-outline azul. 🔶 Propuesta — La app muestra desglose ‘Subtotal’ + ‘IVA’ + ‘Total’ y una línea de tienda (‘Tienda Demo’) en el detalle de ticket; el Figma sólo lista ‘IVA incluido’ + ‘TOTAL’ sin subtotal ni tienda.
Figma: Actualizar el frame 75:475 para incluir un SummaryRow ‘Subtotal’ y una línea de tienda emisora en el encabezado del ticket.
ver desviaciones

Nodo Figma 164:937 · código app/src/main/java/com/axios/terminales/notifications/NotificationDetailScreen.kt

Figma App Notas Desviación (propuesta)
⚠️ Misma pantalla, AHORA POBLADA (notif n-1 ‘Venta completada’, tipo transacción — por eso el contenido difiere del ejemplo ‘Stock bajo/Inventario’ del Figma; diferencia de datos, esperado). Andamiaje correcto: TopAppBar + cabecera (ícono + categoría + fecha) + título + cuerpo + Card ‘Detalles’ con SummaryRow + botones de texto. Botón ‘Marcar como no leída’ en azul (medido antialias #95BEE8, primary ✓). Divergencias de ESTILO medidas: (1) el contenedor del ícono es cuadro redondeado azul (glifo #0052CC) en vez del CÍRCULO de color del Figma — misma divergencia que M07; (2) ‘Descartar’ se pinta en ROJO danger (medido #F2A5A7) mientras el Figma lo usa en AZUL primary (medido antialias #B9CEEF). Divergencia de FEATURE: la app NO renderiza los botones de acción contextual — primario ‘Ver producto’ (azul, medido #95B7EA) + secundario outline ‘Realizar ajuste’ — que trae el Figma; parcialmente explicable porque la notif sembrada es transacción sin deep-link contextual, pero el andamiaje de CTA está ausente. Copy: ‘Notificaciones’ (plural) vs ‘Notificación’ del Figma. Culpable: forma de ícono (cuadro vs círculo) + token de ‘Descartar’ (rojo vs azul) + ausencia de CTA contextual. —

Nodo Figma 74:456 · código app/src/main/java/com/axios/terminales/ui/screens/terminales/TransferReceiptScreen.kt

Figma App Notas Desviación (propuesta)
⚠️ Same-screen OK: ambos muestran el comprobante de transferencia exitosa. Layout, copy y estructura idénticos: check verde (figma #68D3AF ≈ app #81DABD), título ‘Transferencia exitosa’, monto en azul (app #0052CC), tarjeta con De/Para/Concepto/Folio/Monto y botón primario ‘Listo’ (figma #3E7CD8 ≈ app #3C7BD8, ambos primary #0052CC). STYLE: el botón secundario ‘Compartir comprobante’ difiere — Figma usa variante outlined con texto y borde AZUL (#0052CC, scan #82AAE4), mientras la app usa TerminalesButtonVariant.Outlined con texto neutro oscuro (scan #A8ADB3) + borde gris claro y AGREGA un ícono Share (leadingIcon = TerminalesIcons.Share). No hay diferencia de FEATURE: mismos campos y textos. Diferencia menor de token en un botón. 🔶 Propuesta — El botón ‘Compartir comprobante’ incluye un ícono Share que refuerza el affordance de compartir.
Figma: Agregar un ícono Share como leadingIcon al botón secundario ‘Compartir comprobante’ en el frame 74:456.
ver desviaciones

Nodo Figma 300:4289 · código app/src/main/java/com/axios/terminales/ui/screens/customers/PosQuickActionsScaffold.kt

Figma App Notas Desviación (propuesta)
⚠️ Re-auditado 2026-08-07 (online + sembrado, N86). Speed-dial del FAB de caja (kiosco) con el set actualizado: Nueva venta · En espera · Mov. de caja · Asignar cliente · Cerrar turno · Anular venta — espejo del terminal/home web. Divergencia intencional vs M35 300:4289 (set de caja del rediseño de navegación) → ver desviación; no es defecto. 🔶 Propuesta — El FAB de caja añade «Cerrar turno» y «Anular venta» y quita «Abrir menú» respecto al set previo; íconos distintivos por acción.
Figma: Actualizar M35 300:4289 al set de 6 acciones (Nueva venta/En espera/Mov. de caja/Asignar cliente/Cerrar turno/Anular venta) con íconos por acción.
ver desviaciones

Nodo Figma 300:4086 · código app/src/main/java/com/axios/terminales/ui/screens/customers/AssignCustomerSheet.kt

Figma App Notas Desviación (propuesta)
✅ Re-auditado 2026-08-07 (online + sembrado, N86). RESUELTO (#333/F2): dentro del bottom-sheet «Asignar cliente», el campo «Buscar cliente…» usa lupa inline sin botón azul trailing. Botón «Agregar nuevo cliente» (dashed) + link «Ver todos los clientes». Scrim/handle M3. Alcanzado vía FAB de caja → «Asignar cliente». —

Nodo Figma 300:4129 · código app/src/main/java/com/axios/terminales/ui/screens/customers/QuickAddCustomerSheet.kt

Figma App Notas Desviación (propuesta)
✅ Same-screen OK: ambos son el bottom-sheet ‘Nuevo cliente’ sobre la ‘Venta actual’. FEATURE completo y en paridad: título ‘Nuevo cliente’, los 4 mismos campos en el mismo orden (Nombre completo, Teléfono, Correo (opcional), RFC (opcional, CFDI)) con idénticos placeholders (María González, 55 0000 0000, correo@ejemplo.com, XAXX010101000) y la fila de botones Cancelar (outlined azul, figma texto #83ABE6) + Guardar (primary #3B7AD8), confirmados en QuickAddCustomerSheet.kt:57-111 (los botones quedan bajo el fold en el screenshot de la app pero existen en código). App usa drag handle DS (#374151). STYLE menor: el fondo de los campos es un relleno gris claro estándar de la app (#F7F9FC) vs blanco del Figma (#FFFFFF), y la app añade asterisco rojo de requerido (scan #F9BBBB) en Nombre y Teléfono que el Figma no muestra — mejora, no regresión. 🔶 Propuesta — La app marca los campos obligatorios (Nombre completo, Teléfono) con un asterisco rojo de requerido.
Figma: Agregar el marcador de requerido (asterisco) a las etiquetas ‘Nombre completo’ y ‘Teléfono’ del frame 300:4129.
ver desviaciones

Nodo Figma 80:545 · código app/src/main/java/com/axios/terminales/ui/screens/vas/VasCaptureComponents.kt (grep-confirm VasAirtimeRoute)

Figma App Notas Desviación (propuesta)
✅ Misma pantalla (Tiempo Aire). Layout idéntico: chips Compañía (Telcel/Movistar/AT&T/Unefon/Bait, 5 iguales al diseño), Número de teléfono y grid Monto de 6 AmountChipButton ($10/$20/$50/$100/$200/$500) con $50 seleccionado. Tokens medidos coinciden exacto: chip seleccionado fill primary-soft #E6EEFA=#E6EEFA, fondo #F5F7FA, label activo en primary. FEATURE: paridad completa — VasMocks.kt aporta las mismas 5 compañías y las 6 denominaciones, sin carencias vs diseño. STYLE: sin desviación de token/componente. Única diferencia de ESTADO: CTA deshabilitado en gris #D0D3DA (teléfono obligatorio vacío) vs figma azul habilitado; es gating de validación correcto, no defecto de token. —

Nodo Figma 81:589 · código app/src/main/java/com/axios/terminales/ui/screens/vas/ (grep-confirm VasGiftCardRoute)

Figma App Notas Desviación (propuesta)
✅ Misma pantalla (Tarjeta de regalo). Paridad casi perfecta: chips Marca (Netflix/Spotify/PlayStation/Xbox/Amazon, 5 iguales al diseño), grid Denominación de 6 chips ($100/$200/$300/$500/$1,000/$1,500) con $200 seleccionado, campo Correo del destinatario (opcional), banner info ‘Se emitirá un código PIN…’ y CTA. Tokens medidos coinciden exacto: chip seleccionado primary-soft #E6EEFA, banner azul suave (#EFF6FF app), y CTA primary #0052CC=#0052CC habilitado en ambos (correo opcional no bloquea). FEATURE: paridad completa vía VasMocks.kt (mismas 5 marcas + 6 denominaciones), sin carencias. STYLE: sin desviación de token/componente. —