Child Profile Setup Card

<div class="w-full bg-gray-100">
  <style>@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');</style>
  <div class="bg-gray-100 rounded-lg p-5 mb-7 relative" style="font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;">
    <div class="absolute top-2.5 right-2.5 w-7 h-7 bg-gray-300 rounded-full
      flex justify-center items-center text-xl cursor-pointer
      hover:bg-gray-400 transition-colors" title="Add another child">+</div>
    <div class="mb-5">
      <label class="block mb-2.5 font-medium">Name</label>
      <input type="text" value="Child 1" placeholder="Enter child's nickname" class="w-full p-2.5 border border-gray-300 rounded text-base
        focus:outline-none focus:ring-2 focus:ring-blue-500" />
    </div>
    <div class="mb-5">
      <label class="block mb-2.5 font-medium">Age</label>
      <div class="flex items-center">
        <div class="flex-1 h-1 bg-gray-300 relative rounded">
          <div class="absolute left-0 top-0 h-full w-1/3 bg-blue-500 rounded"></div>
          <div class="w-5 h-5 bg-white rounded-full absolute top-1/2 left-1/3
            transform -translate-x-1/2 -translate-y-1/2 shadow-md
            cursor-pointer border-2 border-gray-200
            hover:border-blue-500 transition-colors"></div>
        </div>
        <div class="ml-5 text-lg text-gray-600">08</div>
      </div>
    </div>
  </div>
</div>