body { background:#0f141a; color:#fff; }
  .card-gatevia{ background:#111a24; border:1px solid rgba(255,255,255,.06); border-radius:12px; }
  .progress{ height:10px; background:#0b1117; }
  .progress-bar{ background:#3cd07a; }
  .text-muted-2{ color:rgba(255,255,255,.6); }
  .btn-gvia{ background:#1b2b3a; border-color:#233242; color:#fff; }
  .btn-gvia:hover{ background:#213346; }
  .mini{ font-size:.9rem; }
  .mono{ font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace; }
  .pointer{ cursor:pointer; }

  .vf-row { display:flex; flex-wrap:wrap; align-items:center; gap:.75rem; }
  .vf-row .mini { line-height:1.2; }
  #vf-user-wtid { max-width:110px; }
  .vf-chip { padding:.15rem .5rem; border:1px solid rgba(255,255,255,.15); border-radius:6px; }
  
  #toast-stack { z-index: 1080; }
  .toast-gvia{
    background:#111a24; color:#fff;
    border:1px solid rgba(255,255,255,.06);
    border-radius:12px;
  }
  .toast-gvia .toast-header{
    background:transparent; color:#fff;
    border-bottom:1px solid rgba(255,255,255,.06);
  }
  .toast-gvia .btn-close{ filter: invert(1); }

  
  .toast-round{
    background:#182230;
    border:1px solid rgba(100,160,255,.25);
  }
  .toast-round .toast-header{
    border-bottom:1px solid rgba(100,160,255,.25);
  }

  /* ===== Loader (equalizer) ===== */
  .bar-loader{ --bar-w:6px; --bar-h:18px; --bar-gap:4px; --bar-color:#f6c34a; display:inline-flex; gap:var(--bar-gap); align-items:flex-end; vertical-align:middle; }
  .bar-loader span{ width:var(--bar-w); height:var(--bar-h); background:var(--bar-color); display:block; transform-origin:bottom center; animation:barPulse 1s ease-in-out infinite; border-radius:2px; opacity:.95; }
  .bar-loader span:nth-child(1){ animation-delay:0s; }
  .bar-loader span:nth-child(2){ animation-delay:.1s; }
  .bar-loader span:nth-child(3){ animation-delay:.2s; }
  .bar-loader span:nth-child(4){ animation-delay:.3s; }
  .bar-loader span:nth-child(5){ animation-delay:.4s; }
  @keyframes barPulse{ 0%,100%{ transform:scaleY(.35) } 50%{ transform:scaleY(1) } }
  .bar-loader.sm{ --bar-w:4px; --bar-h:14px; --bar-gap:3px; }
  .bar-loader.lg{ --bar-w:8px; --bar-h:28px; --bar-gap:5px; }
  
  
 
.progress-bar{ transition: width .45s ease; }


.num-bump{ animation: numBump .35s ease; }
@keyframes numBump{
  0%{ transform:scale(1) }
  30%{ transform:scale(1.08) }
  100%{ transform:scale(1) }
}


.glow-bump{ animation: poolGlow .8s ease; }
@keyframes poolGlow{
  0%  { box-shadow:0 0 0 rgba(60,208,122,0) }
  50% { box-shadow:0 0 24px rgba(60,208,122,.25) }
  100%{ box-shadow:0 0 0 rgba(60,208,122,0) }
}


#price-usdt, #pool-fee {
  position: relative;        
  display: inline-block;     
  vertical-align: baseline;
}


.delta-fly{
  position:absolute;
  left:100%;                 
  bottom:.1em;               
  margin-left:.4rem;        
  background:#143320; color:#3cd07a;
  border:1px solid rgba(60,208,122,.35);
  border-radius:8px; padding:2px 6px; font-size:.8rem;
  opacity:0; pointer-events:none;
  animation: deltaUp .9s ease forwards;
}

.delta-fly.up{
  background:#143320; color:#3cd07a; border:1px solid rgba(60,208,122,.35);
}
.delta-fly.down{
  background:#2b1717; color:#ff6b6b; border:1px solid rgba(255,107,107,.35);
}


#bal-usdt, #bal-gvia{
  position:relative;
  display:inline-block;
  vertical-align:baseline;
}

@keyframes deltaUp{
  0%   { transform:translateY(6px);  opacity:0 }
  25%  {                          opacity:1 }
  100% { transform:translateY(-14px); opacity:0 }
}


  
.countdown-danger{ color:#ff6b6b !important; }
.pulse{ animation:pulseRed 1s ease-in-out infinite; }
@keyframes pulseRed{
  0%   { text-shadow:0 0 0 rgba(255,107,107,0); transform:scale(1) }
  50%  { text-shadow:0 0 12px rgba(255,107,107,.55); transform:scale(1.06) }
  100% { text-shadow:0 0 0 rgba(255,107,107,0); transform:scale(1) }
}

 
.countdown-warn  { color:#f6c34a !important; }
.countdown-danger{ color:#ff6b6b !important; }

.pulse-yellow{ animation:pulseYellow 1s ease-in-out infinite; }
.pulse-red   { animation:pulseRed 1s ease-in-out infinite; }

@keyframes pulseYellow{
  0%   { text-shadow:0 0 0 rgba(246,195,74,0); transform:scale(1) }
  50%  { text-shadow:0 0 12px rgba(246,195,74,.55); transform:scale(1.04) }
  100% { text-shadow:0 0 0 rgba(246,195,74,0); transform:scale(1) }
}
@keyframes pulseRed{
  0%   { text-shadow:0 0 0 rgba(255,107,107,0); transform:scale(1) }
  50%  { text-shadow:0 0 12px rgba(255,107,107,.65); transform:scale(1.07) }
  100% { text-shadow:0 0 0 rgba(255,107,107,0); transform:scale(1) }
}
 
 .vf-ticket{ padding:2px 6px; border:1px solid rgba(255,255,255,.15); border-radius:6px; }
.vf-ticket.win{
  background:#143320; color:#3cd07a; border-color:rgba(60,208,122,.45);
  font-weight:600;
}
.vf-ticket.win i{ margin-left:4px; } 
.balance-pill{display:inline-flex;align-items:center;gap:.4rem;padding:.25rem .5rem;border:1px solid rgba(255,255,255,.12);border-radius:8px;background:#0b1117}
.balance-wrap{display:flex;gap:.5rem;flex-wrap:wrap}


.btn-compact{
  padding:.35rem .65rem;      
  font-size:.92rem;
  line-height:1.1;
  border-radius:9999px;
}


.btn-soft-amber{
  background:rgba(246,195,74,.12);
  color:#f6c34a;
  border:1px solid rgba(246,195,74,.28);
}
.btn-soft-amber:hover{ background:rgba(246,195,74,.2); }

.btn-soft-success{
  background:rgba(60,208,122,.12);
  color:#3cd07a;
  border:1px solid rgba(60,208,122,.28);
}
.btn-soft-success:hover{ background:rgba(60,208,122,.2); }


.btn-soft-amber:disabled,
.btn-soft-success:disabled{ opacity:.55; cursor:not-allowed; }



.progress{ position:relative; height:10px; background:#0b1117; border-radius:6px; overflow:hidden; }
.progress-bar{
  height:100%;
  width:0%;
  background:#ff6b6b; 
  transition: width .45s ease, background-color .3s ease, box-shadow .3s ease, filter .3s ease;
}


.progress-bar.striped{
  background-image: linear-gradient(45deg,
    rgba(255,255,255,.14) 25%, transparent 25%,
    transparent 50%, rgba(255,255,255,.14) 50%,
    rgba(255,255,255,.14) 75%, transparent 75%, transparent);
  background-size: 1rem 1rem;
  animation: progressStripe 1s linear infinite;
}
@keyframes progressStripe{
  from { background-position: 0 0; }
  to   { background-position: 1rem 0; }
}


.progress-bar.hit{
  box-shadow: 0 0 14px rgba(60,208,122,.35);
  filter: saturate(1.1);
}


.pb-red    { background:#ff6b6b !important; }
.pb-orange { background:#f6a34a !important; }
.pb-yellow { background:#f6c34a !important; }
.pb-green  { background:#3cd07a !important; }



.btn-soft-amber.time-lock:disabled{
  opacity: 1 !important;                
  cursor: not-allowed !important;
  border-color: rgba(246,195,74,.65);
  color: #ffe29a;
  background: rgba(246,195,74,.20);
  box-shadow: 0 0 0 rgba(246,195,74,0);
  animation: lockGlow 1.1s ease-in-out infinite; 
}
@keyframes lockGlow{
  0%   { box-shadow: 0 0 0 rgba(246,195,74,0);          transform: none; }
  50%  { box-shadow: 0 0 28px rgba(246,195,74,.65);      transform: scale(1.02); }
  100% { box-shadow: 0 0 0 rgba(246,195,74,0);           transform: none; }
}


.badge-lock{
  margin-left:.45rem;
  padding:.1rem .4rem;
  font-size:.72rem;
  border-radius:6px;
  background:rgba(255,255,255,.08);
  border:1px dashed rgba(255,255,255,.22);
  vertical-align:middle;
}

.btn-soft-fun{
  background: rgba(124,77,255,.14);
  color: #cdb7ff;
  border: 1px solid rgba(124,77,255,.35);
}
.btn-soft-fun:hover{
  background: rgba(124,77,255,.22);
  color: #ffffff;
}
