code/10006/10006_2.html

<html>
<head>
<meta charset="UTF-8">
<title>Fitbit Onboarding UI</title>
<style>
  body { margin:0; padding:0; background: transparent; font-family: Roboto, Arial, Helvetica, sans-serif; }
  #render-target {
    width:1080px; height:2400px;
    position:relative; overflow:hidden;
    background:#F4F5F3;
  }

  /* Status bar */
  .status-bar {
    position:absolute; top:0; left:0; width:100%; height:120px;
    padding:0 40px;
    display:flex; align-items:center; justify-content:space-between;
    color:#2F2F2F; font-size:38px; letter-spacing:0.2px;
  }
  .status-left { display:flex; align-items:center; gap:18px; }
  .status-right { display:flex; align-items:center; gap:28px; }

  /* Content */
  .content {
    position:absolute; left:64px; right:64px; top:180px;
  }
  .logo {
    width:120px; height:120px;
    display:flex; align-items:center; justify-content:flex-start;
    margin-bottom:40px;
  }
  h1 {
    font-size:72px; line-height:88px; margin:0 0 40px 0;
    color:#1E2A26; font-weight:700;
    letter-spacing:-0.5px;
  }
  .para {
    font-size:40px; line-height:60px; color:#6A706C;
    margin-bottom:42px;
  }

  /* Bottom actions */
  .actions {
    position:absolute; left:64px; right:64px; bottom:220px;
  }
  .btn {
    height:120px; border-radius:64px; display:flex; align-items:center; justify-content:center;
    font-size:40px; font-weight:600; letter-spacing:0.2px;
  }
  .btn-primary {
    background:#2E6F63; color:#FFFFFF; box-shadow: none;
  }
  .btn-outline {
    margin-top:30px;
    background:transparent; color:#2E6F63;
    border:2px solid #9AA8A3;
  }
  .link {
    text-align:center; margin-top:56px; color:#2E6F63; font-size:38px;
  }

  /* Utility small muted text style for secondary lines if needed */
  .muted { color:#7A807C; }
</style>
</head>
<body>
<div id="render-target">

  <!-- Status Bar -->
  <div class="status-bar">
    <div class="status-left">
      <span>10:02</span>
    </div>

    <div class="status-right">
      <!-- Cellular -->
      <svg width="36" height="36" viewBox="0 0 24 24">
        <rect x="2" y="16" width="2" height="5" fill="#2F2F2F"></rect>
        <rect x="6" y="12" width="2" height="9" fill="#2F2F2F"></rect>
        <rect x="10" y="8" width="2" height="13" fill="#2F2F2F"></rect>
        <rect x="14" y="4" width="2" height="17" fill="#2F2F2F"></rect>
      </svg>
      <!-- Wi-Fi -->
      <svg width="36" height="36" viewBox="0 0 24 24">
        <path d="M2 8c5-4 15-4 20 0" stroke="#2F2F2F" stroke-width="2" fill="none" />
        <path d="M5 12c4-3 10-3 14 0" stroke="#2F2F2F" stroke-width="2" fill="none" />
        <path d="M8 16c3-2 5-2 8 0" stroke="#2F2F2F" stroke-width="2" fill="none" />
        <circle cx="12" cy="19" r="2" fill="#2F2F2F"></circle>
      </svg>
      <!-- Do Not Disturb dot -->
      <svg width="12" height="12"><circle cx="6" cy="6" r="6" fill="#2F2F2F"></circle></svg>
      <!-- Battery -->
      <svg width="46" height="36" viewBox="0 0 28 16">
        <rect x="1" y="2" width="22" height="12" rx="2" ry="2" stroke="#2F2F2F" fill="none" stroke-width="2"></rect>
        <rect x="3" y="4" width="17" height="8" fill="#2F2F2F"></rect>
        <rect x="24" y="5" width="3" height="6" rx="1" fill="#2F2F2F"></rect>
      </svg>
    </div>
  </div>

  <!-- Main Content -->
  <div class="content">
    <!-- Fitbit dots logo -->
    <div class="logo">
      <svg width="120" height="120" viewBox="0 0 120 120">
        <!-- cluster of teal dots approximating Fitbit logo -->
        <circle cx="30" cy="50" r="9" fill="#2E6F63"></circle>
        <circle cx="54" cy="32" r="9" fill="#2E6F63"></circle>
        <circle cx="78" cy="20" r="9" fill="#2E6F63"></circle>
        <circle cx="54" cy="68" r="9" fill="#2E6F63"></circle>
        <circle cx="78" cy="56" r="9" fill="#2E6F63"></circle>
        <circle cx="102" cy="44" r="9" fill="#2E6F63"></circle>
        <circle cx="78" cy="92" r="9" fill="#2E6F63"></circle>
        <circle cx="54" cy="104" r="9" fill="#2E6F63"></circle>
        <circle cx="30" cy="86" r="9" fill="#2E6F63"></circle>
      </svg>
    </div>

    <h1>Looks like you're new to Fitbit</h1>

    <div class="para">We couldn't find a Fitbit profile associated with this Google Account.</div>

    <div class="para">If you've used Fitbit before, you can sign in to move your existing Fitbit profile and information to your Google Account.</div>
  </div>

  <!-- Bottom actions -->
  <div class="actions">
    <div class="btn btn-primary">Continue as a new user</div>
    <div class="btn btn-outline">Sign in with existing Fitbit account</div>
    <div class="link">Go back</div>
  </div>

</div>
</body>
</html>