Doing it right with Google SEO while Dynamically Serving between desktop and mobile

Question

I've read the whole thing here on dynamic serving and I understood that setting the correct-http-headers is the key here!

My game plan is simple;

I will have a single url as ".com/myApp" and then I will serve my content dynamically. As a result, the mobile people will get "/myApp/index-mobile.php" and the desktop people will get "/myApp/index-desktop.php". And to handle the traffic, I will have the good old "index.php" sniffing the user-agent and acting like a traffic cop.

The question is where does the following key http header go?

header("Vary: User-Agent, Accept");

Will it go in index.php only?

What about index-mobile & index-desktop php pages. Are there certain things that I need to be worried about in their HTMLs to tell Google that one is a mobile site while the other one is the one serving the desktop populaion. Does canonicals & rel attributes come into play here as mentioned in the do's and don'ts of serving under seperate urls here?

Since serving dynamic content is borderline with "cloaking", I simply do not want to screw things up.

I'd appreciate your expert guidance on this important issue.

Thank you

I don't think I need to include the contents of my index.php, but for the completeness, I'll include it anyway.

<?php

  //  this index.php acts like a traffic cop 
  //directing traffic between mobile and desktop users - seamlessly. 

  require_once 'includes/Mobile_Detect.php';
  // http://mobiledetect.net/

  $detect = new Mobile_Detect;

  if ( $detect->isMobile() && !$detect->isTablet() ) {
    $user_agent = 'mobile';
  } else {
    $user_agent = 'desktop';
  }

  include ("index-{$user_agent}.php"); 
  //loads either index-desktop.php or index-mobile.php

  ?>