Un orbe marino con la aurora alrededor, y todo lo que cuelga de él.

La web ya diseñó el shell móvil: top bar de 56 con wordmark, chip de ruta, campana y avatar; barra de 64 con cuatro pestañas y un FAB entre la segunda y la tercera; el <main> como único scroll. La app lo replica con safe areas de verdad —el notch arriba, el indicador de inicio abajo— y lo supera en dos sitios: el orbe y su muesca, y la campana que dice cuántas.

Tab activo con pop (escala 1 → 1,18 → 1 en 260 ms ease-spring + haptic light) y press a .95. Un Pressable que abre un modal (Almacén) se marca accessibilityRole="button" y accessibilityHint="Próximamente"; los otros tres son tab con selected. Las banderas salen de CountryFlag (SVG local), no del emoji del SO.

La firma visual de la app. La web tiene un disco de 48 en brand-700 con un anillo blanco; aurora-familia ya había decidido que el FAB móvil es una de las tres apariciones exactas de --grad-marca. El problema de un disco entero en degradado es que el + blanco cae sobre celeste-deep y lima y no contrasta. Solución: el núcleo es marino (el + blanco mide 15:1) y la aurora es el anillo de 5 px que lo rodea. Al tocar, el + gira a ×, el orbe vuela en diagonal y aterriza como roundel en la cabecera noche del sheet, que sube debajo. Una sola coreografía de 640 ms.

Con el perfil a medias el sheet no bloquea: avisa con la banda de IncompleteProfileBanner (warning-soft, tinta warning-deep 5,03:1) y deja tocar. El tap abre el ProfileGateModal de la web —plate primary/10, título Lemon Milk 24, lista de faltantes con warning-500, botones apilados— y guarda el destino: «Completar perfil» lleva a /complete-profile; al volver con el perfil completo, la app navega sola a donde se iba.

El corredor filtra toda la app: envíos, pagos, salidas. El chip del top bar abre el sheet de ruta con las mismas filas del CorridorSwitcher de escritorio —«Todas las rutas» y una por corredor con bandera, punto vivo y las cifras de corridors/stats— y la elección persiste en MMKV (el corridor-storage.ts de la web sobre localStorage). Al abrir la app con una ruta activa, el toast de bienvenida de CorridorPortalWelcome lo recuerda una vez por sesión.

1. Las filas del escritorio, a 44

   Plate de 36 con la bandera (o el globo muted para «Todas»), nombre corto + punto vivo, meta en 12 muted con metaShipments y metaInCustoms de corridors/stats. Activa: bg-accent + check brand-700. Elegir cierra el sheet e invalida las queries filtradas: envíos, pagos, salidas y los contadores.

2. Persistencia y saneo

   corridor-context.tsx hidrata desde MMKV al montar, sincroniza al cambiar y limpia sola si el corredor guardado ya no existe en corridors (desactivado). Sin sesión no hay corredor: el logout borra la clave.

3. La bienvenida es un toast de Sileo

   El texto de corridor-portal-welcome.tsx (todavía sin i18n en web —deuda anotada) en la pastilla expandida de MF-01: bandera en el disco, título en sileo-info, descripción al 50 %. 5 s, resorte de 640 al entrar, sessionStorage → un flag en memoria por arranque de la app.

4. ConnectionPill, la versión mínima

   La cantera (mobile-client/components/network) la dibuja como píldora gris #1f2937 con punto y «Reintentar». Aquí se redibuja con la pastilla Sileo de MF-01 para no tener dos toasts oscuros: punto rojo de 8, «Sin conexión», acción al 14 %. Detecta con NetInfo + /health; la resiliencia completa (cola, reintentos, estados por pantalla) es de MF-14.

Dos superficies, como en la web. La campana abre un sheet con las diez últimas y «Marcar todas»; «Ver todas las notificaciones» lleva a /account/notifications, el centro completo con la banda de día, las pestañas Todas / Sin leer / Leídas, los filtros de prioridad y tipo, y la lista —que en el teléfono no pagina: carga más al llegar al final. El icono y el plate de cada fila salen del mapa de los 38 tipos (notification-icons.ts): cinco categorías más las cuatro excepciones por tipo.

Decisión de Fabrizio en este estudio: el cuarto tab navega a /account/mas, como hace un tab nativo, y el MobileMoreSheet de la web no se porta. Una sola superficie: cabecera con avatar, nombre y correo sobre la aurora de día; Cuenta, Accesos, Preferencias y Cerrar sesión. El tab queda activo, la ruta es deep-linkeable y el gesto atrás funciona. Idioma abre un sheet con los tres locales; cambiar uno cambia la app entera sin reiniciar (i18next.changeLanguage + expo-localization solo para el default).

/account compone cuatro bloques y la app los replica en una columna: la banda de bienvenida (aurora de día, la que la web ya usa en el centro de notificaciones y que aurora-home pidió para el saludo), Mis envíos con los KPI-chips que filtran y el carrusel de cards, Pagos pendientes con el monto en display y «Pagar», y Próximas salidas con el calendario codificado por corredor. Todo filtrado por la ruta del chip. Pull-to-refresh nativo, skeletons que heredan la superficie y vacíos que invitan.

La web ya tiene los tres y la app los trae tal cual: el banner de perfil incompleto entre el top bar y el main (se cierra 24 h), el ProfileGateModal que retiene la acción (§02) y el modal Próximamente del tab Almacén (§01). Aquí, el banner sobre el home completo, con lo que empuja y lo que no.

Cada coreografía de la pieza con su equivalente en nativo. La escala es la del estudio (80 / 160 / 260 / 420 / 640, ease-out, ease-in-out, ease-spring) que Fabrizio cerró en MF-01. Nada de aquí es obligatorio para usar la app: con «Reducir movimiento» activo todo se vuelve fade de 80 ms o nada.

Fuente de verdad de la escala: proposal/mogos-mobile-componentes.html §10 y packages/mobile-ui/src/theme/motion.ts (MF-01). Los 640 ms totales de la coreografía del orbe son 160 de press + 420 de vuelo + 60 de solape con el aterrizaje.

• Firma

  Orbe: núcleo marino, aurora alrededor

  Elegido por Fabrizio (2026-09-05) sobre el abanico radial y el cuadro marino con punto rojo. El disco entero en degradado se descartó al medir: el + blanco sobre celeste-deep da 2,2:1. Anillo de 5 px con --grad-marca, núcleo marino, + blanco a 15:1. La muesca de la barra es parte de la firma.

• Coreografía

  El orbe aterriza en el sheet

  Una sola coreografía de 640 ms: press, vuelo en diagonal con giro del +, aterrizaje como roundel en la cabecera noche. La cabecera noche es la banda de MF-01; el radio 20 del sheet de crear es el del modal Próximamente y es la única excepción al radio 10 de los sheets.

• Gate

  Crear pasa por el perfil, también desde el sheet

  La web móvil enlaza directo y solo /account gatea. La app aplica requireCompleteProfile a los dos tiles y avisa dentro del sheet con la banda de IncompleteProfileBanner. El callback se retiene: completar el perfil termina la acción sola.

• Más

  Pantalla, no sheet

  Elegido por Fabrizio (2026-09-05): el cuarto tab navega a /account/mas. MobileMoreSheet no se porta. Cabecera en banda de día en lugar del degradado brand; Idioma abre un sheet con es · en · zh (la página web solo alternaba es ↔ zh).

• Campana

  Contador visible, en marino

  La web esconde la cifra en sr-only y muestra un punto. En el teléfono la píldora de 16 con el número es lo útil. Marino y no rojo, por la misma regla que la web anotó en mobile-top-bar.tsx.

• Centro

  Scroll infinito, no paginación

  /account/notifications conserva banda, tabs y filtros; «Anterior / Siguiente» se vuelve FlashList + onEndReached sobre la misma API paginada. Las acciones por hover pasan a swipe en la fila y a action sheet en la card.

• Home

  La bienvenida es la banda de día

  PageFrame web no la tiene; aurora-home la pidió y la web ya la estrenó en el centro de notificaciones. La app la usa en el saludo y en la cabecera de Más. «Crear envío» sale de la cabecera porque ahora existe el orbe; «Ver tarifas» se queda.

• Verde

  success-500 del producto, no emerald de Tailwind

  El punto vivo del chip y de las filas de ruta usa emerald-500 en web, un color fuera de la paleta del producto. La app usa success-500 (#17b26a), que sí es token. Único cambio de color respecto a la web en toda la pieza; el resto de foráneos (red/blue del corridor-badge, blue-50 del aviso de tarifa) se replican y se anotan como deuda.

• Sombras

  Tintadas a marino, también el chrome

  Top bar y tabs llevan en web sombras en slate-900; aquí el mismo 4 % / 6 % sobre marino, y el orbe la sombra del FAB de aurora-familia. Cierra la decisión 4 de MF-01 para el shell.

• Fletes

  El tab existe; el contenido es de MF-06

  La pantalla Fletes se dibuja con su sub-nav (Fletes / Mis envíos) y skeleton para fijar el estado activo del tab y la cabecera; lo que va dentro lo decide el design-studio de MF-06.

• Almacén

  Flag de la web, modal de la web

  nav-feature-flags se lee igual: comingSoon → chip «Pronto» y modal; hidden (Mi Locker) → no existe. «Reservar storage» entra al sheet de crear como tercer tile el día que el flag cambie (DECISIONS #6).

• Red

  ConnectionPill = pastilla Sileo

  La píldora gris de la cantera se redibuja con el toast oscuro de MF-01 para no tener dos superficies negras. Versión mínima (NetInfo + /health); la resiliencia completa es de MF-14.

• Pregunta · Figma

  ¿Hay capturas del Home del Figma viejo?

  El brief pedía pedirlas. En el repo no hay ninguna (design/assets/fotos solo tiene el README). Esta pieza sigue a la web tal como está (DECISIONS #3). Si las capturas existen y traen algo que la web perdió, se revisa antes de goal-phases.

Las dos decisiones de este estudio —el orbe y Más como pantalla— las tomó Fabrizio en la sesión del 2026-09-05 con AskUserQuestion, una a una, sobre tres direcciones cada una. El resto son consecuencias de leer el código de apps/client y de las tres piezas anteriores.