/**
 * Activity promo — popup + mining / invite / lottery pages
 */
.page-activity { padding-bottom: .5rem; }

.act-hero {
  margin: .2rem .24rem .28rem;
  padding: .4rem .32rem;
  border-radius: .28rem;
  text-align: center;
  background:
    radial-gradient(120% 80% at 50% 0%, rgba(255,255,255,.08), transparent 55%),
    linear-gradient(165deg, #161616, #090909);
  border: 1px solid rgba(255,255,255,.12);
}
.act-hero img { width: .88rem; height: .88rem; margin: 0 auto .16rem; display: block; }
.act-hero h1 {
  margin: 0;
  font-size: .36rem;
  font-weight: 800;
  color: #f5f5f5;
}
.act-hero p {
  margin: .12rem 0 0;
  font-size: .24rem;
  color: rgba(255,255,255,.55);
  line-height: 1.45;
}
.act-hero--mining { box-shadow: 0 0 .4rem rgba(34,211,238,.12); }
.act-hero--invite { box-shadow: 0 0 .4rem rgba(96,165,250,.12); }
.act-hero--lottery { box-shadow: 0 0 .4rem rgba(251,191,36,.14); }

.act-card {
  margin: 0 .24rem .24rem;
  padding: .28rem .24rem;
  border-radius: .24rem;
  background: linear-gradient(165deg, #151515, #0a0a0a);
  border: 1px solid rgba(255,255,255,.12);
}
.act-card h3 {
  margin: 0 0 .16rem;
  font-size: .28rem;
  color: #e5e7eb;
}
.act-stat {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: .12rem 0;
  font-size: .26rem;
  color: rgba(255,255,255,.55);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.act-stat b { color: #f8fafc; font-weight: 700; }
.act-btn { width: 100%; margin-top: .24rem; height: .8rem; }
.act-tip {
  margin-top: .16rem;
  padding: .12rem .14rem;
  border-radius: .12rem;
  font-size: .22rem;
  color: rgba(255,255,255,.5);
  background: rgba(255,255,255,.04);
}
.act-tip.ok {
  color: #6ee7b7;
  background: rgba(16,185,129,.1);
  border: 1px solid rgba(16,185,129,.25);
}
.act-progress {
  height: .12rem;
  border-radius: 99px;
  background: rgba(255,255,255,.08);
  overflow: hidden;
  margin: .08rem 0 .16rem;
}
.act-progress i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #3b82f6, #22d3ee);
  border-radius: 99px;
}
.act-code-box { margin-top: .2rem; }
.act-code-box label {
  display: block;
  font-size: .22rem;
  color: rgba(255,255,255,.45);
  margin: .12rem 0 .06rem;
}
.act-copy-row {
  display: flex;
  gap: .1rem;
  align-items: center;
}
.act-copy-row code {
  flex: 1;
  min-width: 0;
  padding: .14rem .14rem;
  border-radius: .12rem;
  background: #000;
  border: 1px solid rgba(255,255,255,.1);
  color: #e2e8f0;
  font-size: .22rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.act-copy-row code.link { font-size: .18rem; }
.act-copy-row .btn-copy {
  flex-shrink: 0;
  height: .64rem;
  padding: 0 .18rem;
  border-radius: .12rem;
  border: 1px solid rgba(255,255,255,.14);
  background: #1a1a1a;
  color: #93c5fd;
  font-size: .22rem;
}

/* —— Promo home popup —— */
.promo-modal {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: .4rem;
}
.promo-modal.hide { display: none; }
.promo-modal-mask {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.72);
  backdrop-filter: blur(4px);
}
.promo-modal-panel {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 6.8rem;
  max-height: 85vh;
  overflow: auto;
  border-radius: .32rem;
  padding: .36rem .28rem .32rem;
  background:
    radial-gradient(100% 60% at 50% 0%, rgba(37,99,235,.25), transparent 55%),
    linear-gradient(165deg, #1a1a1a, #080808);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 .2rem .6rem rgba(0,0,0,.55);
  animation: promoIn .45s cubic-bezier(.22,1,.36,1) both;
}
@keyframes promoIn {
  from { opacity: 0; transform: translateY(.3rem) scale(.96); }
  to { opacity: 1; transform: none; }
}
.promo-modal-panel .promo-hd {
  text-align: center;
  margin-bottom: .24rem;
}
.promo-modal-panel .promo-hd h3 {
  margin: 0;
  font-size: .36rem;
  font-weight: 800;
  color: #fff;
}
.promo-modal-panel .promo-hd p {
  margin: .08rem 0 0;
  font-size: .22rem;
  color: rgba(255,255,255,.5);
}
.promo-list { display: flex; flex-direction: column; gap: .14rem; }
.promo-item {
  display: flex;
  align-items: center;
  gap: .16rem;
  padding: .18rem .16rem;
  border-radius: .2rem;
  text-decoration: none;
  color: #fff;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.1);
  transition: background .15s;
}
.promo-item:active { background: rgba(255,255,255,.08); }
.promo-item img {
  width: .64rem;
  height: .64rem;
  flex-shrink: 0;
  border-radius: .14rem;
}
.promo-item .t { flex: 1; min-width: 0; }
.promo-item .t b {
  display: block;
  font-size: .28rem;
  font-weight: 700;
}
.promo-item .t span {
  display: block;
  margin-top: .04rem;
  font-size: .2rem;
  color: rgba(255,255,255,.5);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.promo-item .go {
  color: #93c5fd;
  font-size: .32rem;
}
.promo-close {
  display: block;
  width: 100%;
  margin-top: .24rem;
  height: .72rem;
  border-radius: .16rem;
  border: 1px solid rgba(255,255,255,.14);
  background: transparent;
  color: rgba(255,255,255,.65);
  font-size: .26rem;
}

/* —— Lottery stage / wheel —— */
.page-lottery .lotto-stage {
  position: relative;
  margin: .12rem .2rem .2rem;
  padding: .28rem .16rem .36rem;
  border-radius: .28rem;
  overflow: hidden;
  text-align: center;
  background:
    radial-gradient(70% 55% at 50% 42%, rgba(245,158,11,.16), transparent 62%),
    radial-gradient(90% 70% at 50% 100%, rgba(180,83,9,.12), transparent 55%),
    linear-gradient(180deg, #1a140c 0%, #0a0a0a 55%, #050505 100%);
  border: 1px solid rgba(245,158,11,.28);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 .12rem .4rem rgba(0,0,0,.45);
}
.lotto-live {
  display: inline-flex;
  align-items: center;
  gap: .1rem;
  margin: 0 auto .18rem;
  padding: .06rem .16rem;
  border-radius: .12rem;
  font-size: .2rem;
  color: #fde68a;
  background: rgba(0,0,0,.45);
  border: 1px solid rgba(245,158,11,.35);
}
.lotto-live .dot {
  width: .12rem;
  height: .12rem;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 .12rem #22c55e;
  animation: lottoPulse 1.4s ease-in-out infinite;
}
@keyframes lottoPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .35; }
}

.wheel-wrap {
  position: relative;
  width: 5.8rem;
  height: 5.8rem;
  margin: .1rem auto 0;
}
.wheel-ring {
  position: absolute;
  inset: -.08rem;
  border-radius: 50%;
  background:
    radial-gradient(circle at 30% 25%, #fde68a, transparent 42%),
    conic-gradient(from 0deg, #92400e, #fbbf24, #78350f, #f59e0b, #92400e, #fde68a, #78350f, #fbbf24, #92400e);
  box-shadow:
    0 0 0 .04rem rgba(0,0,0,.55),
    0 .1rem .28rem rgba(0,0,0,.55),
    inset 0 0 .12rem rgba(255,255,255,.25);
  z-index: 0;
}
.wheel-lights {
  position: absolute;
  inset: -.02rem;
  border-radius: 50%;
  z-index: 6;
  pointer-events: none;
  background: repeating-conic-gradient(
    from 6deg,
    #fff8 0 4deg,
    transparent 4deg 30deg
  );
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - .14rem), #000 calc(100% - .13rem));
  mask: radial-gradient(farthest-side, transparent calc(100% - .14rem), #000 calc(100% - .13rem));
  animation: lottoLights 1.2s steps(2) infinite;
  opacity: .85;
}
@keyframes lottoLights {
  0% { filter: brightness(1.15); }
  100% { filter: brightness(.55); }
}
.wheel-pointer {
  position: absolute;
  top: -.02rem;
  left: 50%;
  z-index: 8;
  width: .36rem;
  height: .52rem;
  margin-left: -.18rem;
  filter: drop-shadow(0 3px 4px rgba(0,0,0,.55));
}
.wheel-pointer i {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, #fff7ed 0%, #f59e0b 38%, #b45309 100%);
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  border-radius: .04rem .04rem 0 0;
}
.wheel {
  position: relative;
  z-index: 2;
  width: calc(100% - .28rem);
  height: calc(100% - .28rem);
  margin: .14rem;
  border-radius: 50%;
  border: .03rem solid rgba(0,0,0,.45);
  box-shadow:
    inset 0 0 0 .03rem rgba(255,255,255,.12),
    inset 0 0 .35rem rgba(0,0,0,.55);
  overflow: hidden;
  will-change: transform;
}
.wheel::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 50%, transparent 28%, rgba(0,0,0,.22) 72%, rgba(0,0,0,.4) 100%),
    repeating-conic-gradient(from 0deg, transparent 0 59.5deg, rgba(255,255,255,.08) 59.5deg 60deg);
  pointer-events: none;
  z-index: 1;
}
.wheel-icon {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 2;
  width: .92rem;
  margin-left: -.46rem;
  margin-top: -.52rem;
  text-align: center;
  transform-origin: center center;
  pointer-events: none;
}
.wheel-icon img {
  width: .46rem;
  height: .46rem;
  display: block;
  margin: 0 auto .04rem;
  border-radius: 50%;
  background: rgba(0,0,0,.4);
  border: 1px solid rgba(255,255,255,.28);
  box-shadow: 0 1px 3px rgba(0,0,0,.45);
}
.wheel-icon span {
  display: block;
  font-size: .15rem;
  font-weight: 700;
  color: #fff;
  text-shadow: 0 1px 2px rgba(0,0,0,.9);
  white-space: nowrap;
  max-width: .9rem;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 0 auto;
  letter-spacing: -.01em;
}
.wheel-hub {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 7;
  width: 1.36rem;
  height: 1.36rem;
  margin: -.68rem 0 0 -.68rem;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #1c1206;
  background:
    radial-gradient(circle at 35% 28%, #fff7ed, transparent 42%),
    linear-gradient(155deg, #fde68a 0%, #f59e0b 48%, #b45309 100%);
  border: .05rem solid #fff8e7;
  box-shadow:
    0 0 0 .06rem rgba(120,53,15,.55),
    0 .08rem .18rem rgba(0,0,0,.5),
    inset 0 -.06rem .1rem rgba(120,53,15,.35);
  cursor: pointer;
  user-select: none;
  line-height: 1.1;
  padding: .08rem;
}
.wheel-hub em {
  font-style: normal;
  font-size: .26rem;
  font-weight: 900;
  letter-spacing: .02em;
}
.wheel-hub small {
  display: block;
  margin-top: .04rem;
  font-size: .14rem;
  font-weight: 600;
  opacity: .72;
}
.wheel-hub[data-disabled="1"] {
  opacity: .55;
  cursor: default;
  filter: grayscale(.35);
}

/* Virtual winners marquee */
.lotto-marquee { padding-top: .22rem; padding-bottom: .18rem; }
.lotto-marquee-hd {
  margin: 0 0 .12rem;
  font-size: .24rem;
  font-weight: 700;
  color: #e5e7eb;
}
.lotto-marquee-viewport {
  height: 2.2rem;
  overflow: hidden;
  border-radius: .14rem;
  background: rgba(0,0,0,.35);
  border: 1px solid rgba(255,255,255,.08);
}
.lotto-marquee-track {
  animation: lottoMarquee 36s linear infinite;
  will-change: transform;
}
.lotto-marquee-viewport:hover .lotto-marquee-track {
  animation-play-state: paused;
}
@keyframes lottoMarquee {
  from { transform: translateY(0); }
  to { transform: translateY(-50%); }
}
.lotto-marquee-item {
  display: flex;
  align-items: center;
  gap: .08rem;
  padding: .1rem .14rem;
  font-size: .22rem;
  color: rgba(255,255,255,.55);
  border-bottom: 1px solid rgba(255,255,255,.05);
  white-space: nowrap;
}
.lotto-marquee-item b {
  color: #93c5fd;
  font-weight: 700;
  min-width: 1.1rem;
}
.lotto-marquee-item em {
  flex: 1;
  min-width: 0;
  font-style: normal;
  color: #fbbf24;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lotto-marquee-item i {
  font-style: normal;
  font-size: .18rem;
  color: rgba(255,255,255,.35);
}

.act-result-modal .result-badge {
  width: .48rem;
  height: .48rem;
  margin: 0 auto .12rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .28rem;
  color: #111;
  background: linear-gradient(145deg, #fde68a, #f59e0b);
}
.act-result-modal.lose .result-badge {
  background: linear-gradient(145deg, #9ca3af, #4b5563);
  color: #e5e7eb;
}

.act-prize-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.act-prize-list li {
  display: flex;
  align-items: center;
  gap: .12rem;
  padding: .1rem 0;
  border-bottom: 1px solid rgba(255,255,255,.06);
  font-size: .24rem;
  color: #e5e7eb;
}
.act-prize-list li img {
  width: .4rem;
  height: .4rem;
  border-radius: 50%;
}
.act-prize-list li span { flex: 1; }
.act-prize-list li em {
  font-style: normal;
  color: #fbbf24;
  font-weight: 700;
}
.act-hist-row {
  display: grid;
  grid-template-columns: 1.4fr .9fr 1.2fr;
  gap: .08rem;
  font-size: .2rem;
  color: rgba(255,255,255,.55);
  padding: .1rem 0;
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.act-hist-row b { color: #e5e7eb; font-weight: 600; }

.act-result-modal {
  position: fixed;
  inset: 0;
  z-index: 1300;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: .4rem;
}
.act-result-modal[hidden] { display: none !important; }
.act-result-mask {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.7);
}
.act-result-panel {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 5.6rem;
  padding: .4rem .32rem;
  border-radius: .28rem;
  text-align: center;
  background: linear-gradient(165deg, #1c1c1c, #0a0a0a);
  border: 1px solid rgba(255,255,255,.14);
}
.act-result-modal.win .act-result-panel {
  box-shadow: 0 0 .4rem rgba(34,197,94,.25);
}
.act-result-modal.lose .act-result-panel {
  box-shadow: 0 0 .4rem rgba(239,68,68,.2);
}
.act-result-panel img {
  width: .88rem;
  height: .88rem;
  margin: 0 auto .16rem;
  display: block;
}
.act-result-panel h3 {
  margin: 0 0 .1rem;
  font-size: .34rem;
  color: #fff;
}
.act-result-panel p {
  margin: 0 0 .24rem;
  font-size: .24rem;
  color: rgba(255,255,255,.65);
  line-height: 1.4;
}
.act-result-panel .btn-primary { width: 100%; height: .72rem; }

.act-toast {
  position: fixed;
  left: 50%;
  bottom: 1.4rem;
  z-index: 1400;
  transform: translateX(-50%);
  max-width: 80%;
  padding: .16rem .28rem;
  border-radius: .16rem;
  font-size: .24rem;
  color: #fff;
  background: rgba(20,20,20,.92);
  border: 1px solid rgba(255,255,255,.14);
}
.act-toast.ok { border-color: rgba(16,185,129,.4); color: #6ee7b7; }
.act-toast.err { border-color: rgba(239,68,68,.4); color: #fca5a5; }