/* ── SNAKE BORDER (balance card) ── */
.bal::before{
  content:'';position:absolute;inset:0;border-radius:16px;padding:1.5px;
  background:conic-gradient(from 0deg,transparent 0deg,var(--p) 80deg,rgba(167,139,250,.3) 140deg,transparent 200deg);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  pointer-events:none;
  animation:snakeRunFallback 2.5s linear infinite;
}
@supports (background: conic-gradient(from 0deg, red, blue)){
  @property --snake-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
  .bal::before{
    background:conic-gradient(from var(--snake-angle,0deg),transparent 0deg,var(--p) 80deg,rgba(167,139,250,.3) 140deg,transparent 200deg);
    animation:snakeRun 2.5s linear infinite;
  }
  @keyframes snakeRun{to{--snake-angle:360deg}}
}
@keyframes snakeRunFallback{to{transform:rotate(360deg)}}

/* ── BALANCE PULSE ── */
.bal.pulse{animation:bPulse 1.5s ease-out}
@keyframes bPulse{0%{box-shadow:0 0 0 0 rgba(240,180,41,.5)}70%{box-shadow:0 0 0 12px transparent}100%{box-shadow:none}}

/* ── STEP PULSE ── */
.step.active .step-dot::after{
  content:'';position:absolute;inset:-4px;border-radius:50%;
  border:1.5px solid rgba(255,255,255,.35);
  animation:stepPulse 1.6s ease-in-out infinite;
}
@keyframes stepPulse{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.45);opacity:0}100%{transform:scale(1);opacity:0}}

/* ── WIN POP ── */
.step.win .step-dot{animation:winPop .5s ease-out forwards}
@keyframes winPop{0%{transform:scale(.8)}60%{transform:scale(1.15)}100%{transform:scale(1)}}

/* ── PLATFORM STATUS PULSE ── */
.pss-ic.active{animation:psa 1.5s infinite}
@keyframes psa{0%,100%{box-shadow:0 0 0 0 rgba(167,139,250,.45)}60%{box-shadow:0 0 0 6px rgba(167,139,250,0)}}
.ps-steps .step-dot.active{animation:sp 1.5s infinite}
@keyframes sp{0%,100%{box-shadow:0 0 0 0 rgba(240,180,41,.5)}60%{box-shadow:0 0 0 4px rgba(240,180,41,0)}}

/* ── WITHDRAW DOTS ── */
.ws-sdot.active{border-color:var(--a);background:transparent;animation:wsp 1.4s infinite}
@keyframes wsp{0%,100%{box-shadow:0 0 0 0 rgba(240,180,41,.5)}60%{box-shadow:0 0 0 4px rgba(240,180,41,0)}}

/* ── TASK CLAIM ── */
.task-claimed{animation:taskClaim .5s ease forwards;pointer-events:none}
@keyframes taskClaim{0%{opacity:1;transform:translateX(0)}60%{opacity:0;transform:translateX(12px)}100%{opacity:0;height:0;margin:0;padding:0;overflow:hidden}}

/* ── BALANCE FLASH ── */
.bal-flash{animation:balFlash .8s ease}
@keyframes balFlash{0%{color:var(--a)}80%{color:var(--a)}100%{color:var(--w)}}

/* ── WELCOME CHIP AUTO-HIDE ── */
.welcome-chip{animation:welcomeHide 0s 10s forwards}
@keyframes welcomeHide{to{opacity:0;height:0;margin:0;padding:0;overflow:hidden}}

/* ── HELLO ANIMATION ── */
@keyframes helloIn{0%{opacity:0;transform:translateY(14px)}40%{opacity:1;transform:translateY(0)}80%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-10px)}}