
.income-page {
  min-height: 100svh;
  padding-bottom: calc(var(--nav-height) + env(safe-area-inset-bottom));
  background: linear-gradient(180deg,#ff6270 0%,#ff9a80 42%,#ffc28e 100%);
}

.income-hero {
  min-height: 735px;
  position: relative;
  overflow: hidden;
  padding: max(72px,calc(52px + env(safe-area-inset-top))) 18px 36px;
  background:
    linear-gradient(145deg,transparent 0 31%,rgba(255,238,218,.23) 31% 31.8%,transparent 31.8% 62%,rgba(255,238,218,.18) 62% 62.8%,transparent 62.8%),
    radial-gradient(circle at 50% 70%,rgba(255,242,215,.94) 0 13%,rgba(255,195,151,.42) 34%,transparent 58%);
}

.income-title {
  width: 78%;
  min-height: 72px;
  margin: 0 auto;
  padding: 12px 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 17px;
  color: #fff;
  background: rgba(133,46,53,.68);
  font-size: 20px;
  font-weight: 700;
  text-align: center;
}

.pig-stage {
  position: absolute;
  left: 50%;
  top: 255px;
  width: 330px;
  height: 380px;
  transform: translateX(-50%);
}

.pig-body {
  position: absolute;
  left: 50%;
  bottom: 74px;
  width: 250px;
  height: 210px;
  transform: translateX(-50%);
  border-radius: 48% 48% 42% 42%;
  background:
    radial-gradient(circle at 38% 28%,rgba(255,255,255,.62),transparent 28%),
    linear-gradient(180deg,#ffe1af 0%,#ffb680 60%,#fa8b70 100%);
  box-shadow: inset -20px -20px 30px rgba(211,94,71,.12),0 26px 40px rgba(148,64,49,.16);
}

.pig-body:before,
.pig-body:after {
  content: "";
  position: absolute;
  top: -19px;
  width: 56px;
  height: 60px;
  background: #ffd39e;
  clip-path: polygon(50% 0,100% 100%,0 100%);
}

.pig-body:before { left: 40px; transform: rotate(-16deg); }
.pig-body:after { right: 38px; transform: rotate(16deg); }

.pig-snout {
  position: absolute;
  left: -38px;
  top: 74px;
  width: 84px;
  height: 66px;
  border-radius: 46%;
  background: linear-gradient(180deg,#ffc08d,#f59472);
}

.pig-eye {
  position: absolute;
  left: 28px;
  top: 66px;
  width: 22px;
  height: 14px;
  border-top: 5px solid #492c29;
  border-radius: 50%;
  transform: rotate(18deg);
}

.pig-slot {
  position: absolute;
  left: 50%;
  top: 24px;
  width: 74px;
  height: 6px;
  border-radius: 999px;
  background: rgba(161,78,60,.45);
  transform: translateX(-50%);
}

.claim-button {
  position: absolute;
  left: 50%;
  bottom: 80px;
  width: 52%;
  min-height: 68px;
  transform: translateX(-50%);
  border: 1px solid rgba(255,255,255,.26);
  border-radius: 27px;
  color: #b52f35;
  background: linear-gradient(180deg,rgba(255,218,181,.9),rgba(255,174,142,.88));
  font-size: 27px;
  font-weight: 800;
}

.rules-wrap {
  padding: 22px 16px 30px;
  background: linear-gradient(180deg,#ffc495 0%,#ffbd88 100%);
}

.rules-card {
  padding: 24px 20px 28px;
  border-radius: 22px;
  color: #fff4ec;
  background: linear-gradient(180deg,#c9423d 0%,#af292c 100%);
}

.rules-title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: 0 0 20px;
  font-size: 24px;
  font-weight: 800;
}

.rules-title:before,
.rules-title:after {
  content: "";
  width: 68px;
  height: 2px;
  background: rgba(255,232,214,.54);
}

.rules-card p {
  margin: 0 0 15px;
  font-size: 16px;
  line-height: 1.82;
  font-weight: 600;
}
