GD-ML/AndroidCode

1<!DOCTYPE html>2<html lang="en">3<head>4<meta charset="UTF-8">5<meta name="viewport" content="width=1080, initial-scale=1.0">6<title>Generating Care Plan</title>7<style>8  body {9    margin: 0;10    padding: 0;11    background: transparent;12    font-family: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;13    color: #111111;14  }15  #render-target {16    width: 1080px;17    height: 2400px;18    position: relative;19    overflow: hidden;20    background: #FFFFFF;21  }22 23  /* Central content */24  .center-wrap {25    position: absolute;26    top: 360px;27    left: 0;28    right: 0;29    text-align: center;30    padding: 0 80px;31  }32  .illustration {33    width: 620px;34    height: 620px;35    margin: 0 auto 40px auto;36    background: #E0E0E0;37    border: 1px solid #BDBDBD;38    border-radius: 28px;39    display: flex;40    align-items: center;41    justify-content: center;42    color: #757575;43    font-size: 32px;44    letter-spacing: 0.2px;45  }46  .title {47    font-weight: 700;48    font-size: 56px;49    line-height: 1.2;50    color: #1B1B1B;51    margin: 28px 0 18px 0;52  }53  .subtitle {54    font-weight: 500;55    font-size: 36px;56    color: #9CA6B6;57    margin: 0;58  }59 60  /* Progress bar */61  .progress-area {62    position: absolute;63    left: 60px;64    right: 60px;65    bottom: 420px;66    height: 18px;67    background: transparent;68  }69  .progress-track {70    width: 100%;71    height: 8px;72    margin-top: 5px;73    background: #DDE5E8;74    border-radius: 6px;75    overflow: hidden;76  }77  .progress-fill {78    width: 94%;79    height: 100%;80    background: #1EC9AE;81    border-radius: 6px 0 0 6px;82  }83 84  /* Bottom system bar imitation */85  .system-bar {86    position: absolute;87    left: 0;88    right: 0;89    bottom: 0;90    height: 120px;91    background: #000000;92  }93  .gesture-pill {94    position: absolute;95    bottom: 34px;96    left: 50%;97    transform: translateX(-50%);98    width: 300px;99    height: 10px;100    background: #E0E0E0;101    border-radius: 6px;102    opacity: 0.95;103  }104</style>105</head>106<body>107<div id="render-target">108  <div class="center-wrap">109    <div class="illustration">[IMG: Cute plant pot illustration]</div>110    <div class="title">Generating care plan</div>111    <p class="subtitle">Analyzing all the required parameters...</p>112  </div>113 114  <div class="progress-area">115    <div class="progress-track">116      <div class="progress-fill"></div>117    </div>118  </div>119 120  <div class="system-bar">121    <div class="gesture-pill"></div>122  </div>123</div>124</body>125</html>