* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { overflow-x: hidden; }
body {
  font-family: -apple-system, "Segoe UI", Roboto, system-ui, sans-serif;
  background: #0b1f17; color: #eaf5ee; line-height: 1.5;
  -webkit-text-size-adjust: 100%;
}
#wrap {
  max-width: 480px; margin: 0 auto; min-height: 100vh;
  background: radial-gradient(120% 50% at 50% 0%, #123f2b 0%, #0a1a13 62%);
  padding-bottom: 12px;
}

#bar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px; border-bottom: 1px solid #17492f;
}
.brand { display: flex; align-items: center; gap: 8px; font-weight: 800; font-size: 16px; }
.brand svg { fill: #2fe08a; }
.ref { font-size: 11px; color: #8fc4a8; }

#hero { text-align: center; padding: 22px 22px 6px; }
.kicker { font-size: 11.5px; font-weight: 800; letter-spacing: .1em; color: #2fe08a; }
#hero h1 { font-size: 28px; font-weight: 800; margin: 8px 0 4px; line-height: 1.15; }
#hero h1 b { color: #2fe08a; }
.amount { font-size: 20px; font-weight: 800; color: #eaf5ee; margin-bottom: 8px; }
.amount b {
  font-size: 26px;
  background: linear-gradient(90deg, #2fe08a, #7bed9f);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.sub { font-size: 14px; color: #a7c4b4; padding: 0 4px; }

#steps { padding: 18px 16px 4px; }
.step {
  display: flex; align-items: center; gap: 13px;
  background: #0e2a1b; border: 1px solid #1c4d31; border-radius: 12px;
  padding: 12px 14px; margin-bottom: 9px;
}
.n {
  flex: 0 0 30px; width: 30px; height: 30px; border-radius: 50%;
  background: linear-gradient(180deg, #2fe08a, #16b866); color: #05230f;
  font-weight: 800; font-size: 15px;
  display: flex; align-items: center; justify-content: center;
}
.step b { display: block; font-size: 14.5px; color: #f2fff8; }
.step small { font-size: 12.5px; color: #8fb8a1; }

#payouts { margin: 10px 16px 4px; background: #0e2a1b; border: 1px solid #1c4d31; border-radius: 12px; padding: 12px 14px; }
.po-head { font-size: 12px; color: #8fb8a1; text-align: center; margin-bottom: 8px; letter-spacing: .03em; }
.po { display: flex; justify-content: space-between; align-items: center; font-size: 14px; padding: 5px 0; border-top: 1px solid #16412a; }
.po:first-of-type { border-top: none; }
.who { color: #cfe6d9; }
.amt { color: #2fe08a; font-weight: 800; }

#cta-block { padding: 16px 18px 8px; text-align: center; }
#cta {
  display: block; text-decoration: none; text-align: center;
  background: linear-gradient(180deg, #3ef295, #16b866); color: #05230f;
  font-size: 18px; font-weight: 800; padding: 16px; border-radius: 13px;
  box-shadow: 0 8px 22px rgba(22, 184, 102, .4);
  animation: pulse 1.6s ease-in-out infinite;
}
@keyframes pulse { 50% { transform: scale(1.025); } }
.note { font-size: 11px; color: #7a9a88; margin-top: 10px; line-height: 1.4; }

#trust { list-style: none; display: flex; justify-content: center; gap: 16px; padding: 6px 12px; flex-wrap: wrap; }
#trust li { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: #a7c4b4; }
.pk { font-size: 15px; }

#foot { text-align: center; font-size: 12px; color: #5f8571; padding: 12px 20px 24px; }