fix(mobile-nav): keep tab labels on one line so the row stays aligned

'Shops & Spots' wrapped to two lines and pushed its icon out of line with the
rest of the bar. Shorten nav.map to 'Spots' (en/es) and render every tab label
single-line (w-full truncate text-center), so long customised labels can't wrap
and misalign the bar either.

src/components/Layout.tsx

@@ -404,7 +404,7 @@ function MobileNav({
           )}
         </span>
         <span className={cn(
-          'text-[9px] xs:text-[10px] leading-tight tracking-wide uppercase transition-all',
+          'block w-full truncate text-center text-[9px] xs:text-[10px] leading-tight tracking-wide uppercase transition-all',
           active ? 'font-extrabold' : 'font-semibold',
         )}>
           {tab.labelKey ? t(tab.labelKey) : tab.label}
@@ -475,7 +475,7 @@ function MobileNav({
                   )}
                 </span>
                 <span className={cn(
-                  'text-[9px] xs:text-[10px] leading-tight tracking-wide uppercase transition-all',
+                  'block w-full truncate text-center text-[9px] xs:text-[10px] leading-tight tracking-wide uppercase transition-all',
                   tabActive ? 'font-extrabold' : 'font-semibold',
                 )}>
                   {isLoggedIn ? 'Profile' : 'Log In'}

src/i18n/en.ts

@@ -49,7 +49,8 @@ const en = {
   // Navigation
   nav: {
     home: 'Home',
-    map: 'Shops & Spots',
+    // Kept to one word so the mobile tab bar labels stay on a single line.
+    map: 'Spots',
     lab: 'The Lab',
     events: 'Events',
     crews: 'Crews',

src/i18n/es.ts

@@ -50,7 +50,7 @@ const es = {
   // Navigation
   nav: {
     home: 'Inicio',
-    map: 'Tiendas y Spots',
+    map: 'Spots',
     lab: 'El Lab',
     events: 'Eventos',
     crews: 'Crews',