GD-ML/AndroidCode

1<html lang="en">2<head>3<meta charset="UTF-8">4<meta name="viewport" content="width=1080, initial-scale=1.0">5<title>Rise and Greet the Day</title>6<style>7  body { margin: 0; padding: 0; background: transparent; font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; }8  #render-target {9    width: 1080px;10    height: 2400px;11    position: relative;12    overflow: hidden;13    background: #1D252A;14    color: #FFFFFF;15  }16 17  /* Header icons */18  .top-bar {19    position: absolute;20    top: 60px;21    left: 40px;22    right: 40px;23    height: 64px;24  }25  .icon-left {26    position: absolute;27    left: 0;28    top: 0;29    width: 64px;30    height: 64px;31    opacity: 0.6;32  }33  .icon-right {34    position: absolute;35    right: 0;36    top: 0;37    width: 64px;38    height: 64px;39    opacity: 0.9;40  }41 42  /* Center avatar */43  .avatar {44    position: absolute;45    left: 50%;46    top: 940px;47    width: 280px;48    height: 280px;49    transform: translateX(-50%);50    border-radius: 50%;51    background: #E0E0E0;52    border: 1px solid #BDBDBD;53    display: flex;54    align-items: center;55    justify-content: center;56    color: #757575;57    font-size: 26px;58    text-align: center;59    line-height: 1.2;60  }61 62  /* Title area */63  .title-block {64    position: absolute;65    left: 60px;66    right: 60px;67    bottom: 420px;68    text-align: center;69  }70  .title {71    font-size: 64px;72    font-weight: 700;73    letter-spacing: 0.5px;74    margin-bottom: 36px;75    color: #FFFFFF;76  }77  .subtitle {78    font-size: 38px;79    color: #AAB2B9;80    margin-bottom: 26px;81  }82  .session {83    font-size: 36px;84    color: #A9B1B8;85  }86 87  /* Home indicator */88  .home-indicator {89    position: absolute;90    left: 50%;91    bottom: 46px;92    transform: translateX(-50%);93    width: 320px;94    height: 10px;95    background: #AEB6BD;96    border-radius: 6px;97    opacity: 0.6;98  }99</style>100</head>101<body>102<div id="render-target">103  <div class="top-bar">104    <!-- Music note icon -->105    <svg class="icon-left" viewBox="0 0 48 48">106      <circle cx="16" cy="34" r="6" fill="#9FA7AE"></circle>107      <rect x="20" y="10" width="6" height="24" fill="#9FA7AE"></rect>108      <rect x="26" y="10" width="12" height="4" fill="#9FA7AE"></rect>109    </svg>110 111    <!-- Close (X) icon -->112    <svg class="icon-right" viewBox="0 0 48 48">113      <line x1="12" y1="12" x2="36" y2="36" stroke="#E0E6EA" stroke-width="4" stroke-linecap="round"></line>114      <line x1="36" y1="12" x2="12" y2="36" stroke="#E0E6EA" stroke-width="4" stroke-linecap="round"></line>115    </svg>116  </div>117 118  <!-- Center circular portrait placeholder -->119  <div class="avatar">[IMG: Instructor Portrait]</div>120 121  <!-- Text content -->122  <div class="title-block">123    <div class="title">Rise and Greet the Day</div>124    <div class="subtitle">By Nico Hase</div>125    <div class="session">Session 1 - Awaken With Intention</div>126  </div>127 128  <!-- Home indicator -->129  <div class="home-indicator"></div>130</div>131</body>132</html>