:root {
  --color-primary-button-bg: #00c853; /* Default Pasgol Green */
  --angle: 0turn;
}

body {
  margin: 0;
  padding: 0;
  background-color: #000;
  font-family: Economica, sans-serif;
  color: #fff;
  overflow-x: hidden;
}

/* Ensure skeletal states have a pulse */
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .5; }
}

@charset "UTF-8";
@import"//fonts.googleapis.com/css?family=Economica";
.odometer.odometer-auto-theme,.odometer.odometer-theme-train-station,.odometer.odometer-auto-theme .odometer-digit,.odometer.odometer-theme-train-station .odometer-digit {
  display:inline-block;
  vertical-align:middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  position:relative
}
.odometer.odometer-auto-theme .odometer-digit .odometer-digit-spacer,.odometer.odometer-theme-train-station .odometer-digit .odometer-digit-spacer {
  display:inline-block;
  vertical-align:middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  visibility:hidden
}
.odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner,.odometer.odometer-theme-train-station .odometer-digit .odometer-digit-inner {
  text-align:left;
  display:block;
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  overflow:hidden
}
.odometer.odometer-auto-theme .odometer-digit .odometer-ribbon,.odometer.odometer-theme-train-station .odometer-digit .odometer-ribbon {
  display:block
}
.odometer.odometer-auto-theme .odometer-digit .odometer-ribbon-inner,.odometer.odometer-theme-train-station .odometer-digit .odometer-ribbon-inner {
  display:block;
  -webkit-backface-visibility:hidden
}
.odometer.odometer-auto-theme .odometer-digit .odometer-value,.odometer.odometer-theme-train-station .odometer-digit .odometer-value {
  display:block;
  -webkit-transform:translateZ(0)
}
.odometer.odometer-auto-theme .odometer-digit .odometer-value.odometer-last-value,.odometer.odometer-theme-train-station .odometer-digit .odometer-value.odometer-last-value {
  position:absolute
}
.odometer.odometer-auto-theme.odometer-animating-up .odometer-ribbon-inner,.odometer.odometer-theme-train-station.odometer-animating-up .odometer-ribbon-inner {
  transition:transform 2s
}
.odometer.odometer-auto-theme.odometer-animating-up.odometer-animating .odometer-ribbon-inner,.odometer.odometer-theme-train-station.odometer-animating-up.odometer-animating .odometer-ribbon-inner,.odometer.odometer-auto-theme.odometer-animating-down .odometer-ribbon-inner,.odometer.odometer-theme-train-station.odometer-animating-down .odometer-ribbon-inner {
  transform:translateY(-100%)
}
.odometer.odometer-auto-theme.odometer-animating-down.odometer-animating .odometer-ribbon-inner,.odometer.odometer-theme-train-station.odometer-animating-down.odometer-animating .odometer-ribbon-inner {
  transition:transform 2s;
  transform:translateY(0)
}
.odometer.odometer-auto-theme,.odometer.odometer-theme-train-station {
  font-family:Economica,sans-serif
}
.odometer.odometer-auto-theme .odometer-digit,.odometer.odometer-theme-train-station .odometer-digit {
  display:inline-block;
  vertical-align:middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  border-radius:.1em;
  background-image:url(data:image/svg+xml;
  base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzExMTExMSIvPjxzdG9wIG9mZnNldD0iMzUlIiBzdG9wLWNvbG9yPSIjMTExMTExIi8+PHN0b3Agb2Zmc2V0PSI1NSUiIHN0b3AtY29sb3I9IiMzMzMzMzMiLz48c3RvcCBvZmZzZXQ9IjU1JSIgc3RvcC1jb2xvcj0iIzExMTExMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzExMTExMSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==);
  background-size:100%;
  background-image:linear-gradient(to bottom,#111,#111 35%,#333 55%,#111 55%,#111);
  background-color:#222;
  padding:0 .15em;
  color:#fff
}
.odometer.odometer-auto-theme .odometer-digit+.odometer-digit,.odometer.odometer-theme-train-station .odometer-digit+.odometer-digit {
  margin-left:.1em
}
.odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner,.odometer.odometer-theme-train-station .odometer-digit .odometer-digit-inner {
  left:.15em
}
.jackpot-container {
  width:100%
}
.jackpot-grid {
  display:grid;
  gap:10px;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr))
}
.jackpot-grid.grid-cols-1 {
  grid-template-columns:1fr
}
.jackpot-grid.grid-cols-2 {
  grid-template-columns:repeat(2,1fr)
}
.jackpot-grid.grid-cols-3 {
  grid-template-columns:repeat(3,1fr)
}
.jackpot-grid.grid-cols-4 {
  grid-template-columns:repeat(4,1fr)
}
.jackpot-grid.grid-cols-5 {
  grid-template-columns:repeat(5,1fr)
}
.jackpot-grid.grid-cols-6 {
  grid-template-columns:repeat(6,1fr)
}
.jackpot-grid.grid-cols-7 {
  grid-template-columns:repeat(7,1fr)
}
.jackpot-grid.grid-cols-8 {
  grid-template-columns:repeat(8,1fr)
}
.jackpot-card {
  background:#0000001a;
  border-radius:15px;
  padding:15px;
  border:1px solid var(--color-primary-button-bg);
  text-align:center;
  transition:all .3s ease;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border:1px solid hsla(0,0%,100%,.1)!important;
  z-index:1;
  overflow:inherit!important;
  position:relative
}
.jackpot-card:before {
  content:" ";
  position:absolute;
  top:-1px;
  right:-1px;
  bottom:-1px;
  left:-1px;
  z-index:-1;
  border:inherit;
  border-radius:inherit;
  background-image:conic-gradient(from var(--angle),hsla(0,0%,100%,0) 80%,rgba(255,255,255,0) 88%,var(--color-primary-button-bg) 92%,rgba(255,255,255,0) 100%);
  background-origin:border-box;
  -webkit-mask:linear-gradient(#000,#000) content-box,linear-gradient(#000,#000);
  mask:linear-gradient(#000,#000),linear-gradient(#000,#000);
  -webkit-mask-clip:content-box,border-box;
  mask-clip:content-box,border-box;
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  animation:spin 3s linear infinite
}
@property --angle {
  syntax: "<angle>";
   inherits: true;
   initial-value: 0turn;
  
}
@keyframes spin {
  to {
    --angle: 1turn 
  }
  
}
.jackpot-card.odometer-active .odometer {
  animation:odometerActiveScale 1s ease-in-out
}
.jackpot-card .jackpot-icon {
  width:80px;
  height:80px;
  animation:imageZoom 1s infinite alternate forwards;
  overflow:hidden
}
.jackpot-card .jackpot-icon .jackpot-image {
  width:100%;
  height:100%;
  -o-object-fit:contain;
  object-fit:contain
}
.jackpot-card .jackpot-right {
  flex:1
}
.jackpot-card .jackpot-title {
  background:linear-gradient(45deg,#ffffff,var(--color-primary-button-bg),#ffffff);
  background-size:200% 100%;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  font-size:1rem;
  font-weight:700;
  margin:0;
  text-shadow:0 2px 4px rgba(0,0,0,.5);
  animation:gradientShift 3s ease-in-out infinite
}
.jackpot-card .animate-text {
  position:relative;
  top:0
}
.jackpot-card:nth-child(1) .jackpot-icon {
  animation-delay:0s
}
.jackpot-card:nth-child(2) .jackpot-icon {
  animation-delay:.2s
}
.jackpot-card:nth-child(3) .jackpot-icon {
  animation-delay:.4s
}
.jackpot-card:nth-child(4) .jackpot-icon {
  animation-delay:.6s
}
.jackpot-amount {
  display:flex;
  align-items:center;
  justify-content:center;
  margin:25px 0;
  gap:10px
}
.odometer-container {
  flex:1
}
.odometer {
  font-size:1.5rem;
  font-weight:700;
  color:#fff
}
.currency {
  font-size:2.5rem;
  color:gold;
  font-weight:700
}
.jackpot-progress {
  margin-top:20px
}
@keyframes progressShimmer {
  0% {
    background-position:200% 0
  }
  to {
    background-position:-200% 0
  }
  
}
.progress-text {
  color:#ccc;
  font-size:.9rem
}
.jackpot-trigger-modal {
  position:fixed;
  top:0;
  left:0;
  width:100vw;
  height:100vh;
  background:#000000e6;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:1000;
  animation:modalFadeIn .3s ease
}
@keyframes modalFadeIn {
  0% {
    opacity:0
  }
  to {
    opacity:1
  }
  
}
.trigger-content {
  background:linear-gradient(145deg,#1a1a2e,#16213e);
  border-radius:20px;
  padding:50px;
  text-align:center;
  border:3px solid #ffd700;
  box-shadow:0 0 50px #ffd700cc;
  position:relative;
  animation:triggerBounce .6s ease
}
@keyframes triggerBounce {
  0% {
    transform:scale(.3) rotate(-10deg)
  }
  50% {
    transform:scale(1.1) rotate(5deg)
  }
  to {
    transform:scale(1) rotate(0)
  }
  
}
.trigger-animation {
  position:relative
}
.fireworks {
  position:absolute;
  top:-20px;
  left:-20px;
  right:-20px;
  bottom:-20px;
  background:radial-gradient(circle at 20% 20%,#ffd700 2px,transparent 2px),radial-gradient(circle at 80% 20%,#ff6b6b 2px,transparent 2px),radial-gradient(circle at 20% 80%,#4ecdc4 2px,transparent 2px),radial-gradient(circle at 80% 80%,#45b7d1 2px,transparent 2px);
  animation:fireworksAnimation 2s ease-in-out infinite
}
@keyframes fireworksAnimation {
  0%,to {
    transform:scale(1) rotate(0)
  }
  50% {
    transform:scale(1.2) rotate(180deg)
  }
  
}
.confetti-container {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  pointer-events:none;
  overflow:hidden
}
.confetti {
  position:absolute;
  width:10px;
  height:10px;
  border-radius:50%;
  top:-10px;
  animation:confettiFall linear infinite
}
@keyframes confettiFall {
  0% {
    transform:translateY(-100vh) rotate(0);
    opacity:1
  }
  to {
    transform:translateY(100vh) rotate(720deg);
    opacity:0
  }
  
}
.winner-icon {
  font-size:4rem;
  margin-bottom:1rem
}
.winner-title {
  color:gold;
  font-size:3rem;
  margin:0 0 20px;
  text-shadow:0 4px 8px rgba(0,0,0,.5);
  animation:textGlow 1s ease-in-out infinite alternate
}
.winner-subtitle {
  color:#fff;
  font-size:1.8rem;
  margin:0 0 20px
}
.winner-name {
  color:gold;
  font-size:1.6rem;
  font-weight:700;
  margin:0 0 30px;
  text-shadow:0 2px 4px rgba(0,0,0,.5);
  animation:textGlow 2s ease-in-out infinite alternate
}
.winner-message {
  color:#ccc;
  font-size:1.2rem;
  margin:20px 0
}
.celebration-text {
  color:gold;
  font-size:1.5rem;
  font-weight:700;
  margin-top:20px;
  text-shadow:0 2px 4px rgba(0,0,0,.5)
}
@keyframes textGlow {
  0% {
    text-shadow:0 4px 8px rgba(255,215,0,.5)
  }
  to {
    text-shadow:0 4px 20px rgb(255,215,0)
  }
  
}
@keyframes cardExplosion {
  0% {
    transform:scale(1)
  }
  50% {
    transform:scale(1.1)
  }
  to {
    transform:scale(1.05)
  }
  
}
@keyframes cardGlow {
  0%,to {
    box-shadow:0 0 50px #ff6b6bcc,0 0 100px #ffd70099
  }
  50% {
    box-shadow:0 0 80px #ff6b6b,0 0 150px #ffd700cc
  }
  
}
.card-confetti-container {
  position:absolute;
  top:0;
  left:0;
  z-index:99999;
  width:100%;
  height:100%;
  pointer-events:none
}
.card-confetti {
  position:absolute;
  width:8px;
  height:8px;
  border-radius:50%;
  animation:cardConfettiFall linear infinite
}
@keyframes cardConfettiFall {
  0% {
    transform:translateY(-20px) rotate(0);
    opacity:1
  }
  to {
    transform:translateY(150px) rotate(360deg);
    opacity:0
  }
  
}
.explosion-overlay {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:#000000b3;
  -webkit-backdrop-filter:blur(5px);
  backdrop-filter:blur(5px);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:10;
  animation:explosionFadeIn .3s ease-out
}
.explosion-content {
  text-align:center;
  color:#fff;
  display:flex;
  flex-direction:column;
  line-height:12px;
  align-items:center;
  justify-content:center;
  gap:10px
}
.winner-celebration {
  font-size:2rem;
  animation:bounce 1s ease-in-out infinite
}
.winner-text {
  font-size:1rem;
  font-weight:700;
  color:gold;
  margin:0;
  animation:textGlow 1s ease-in-out infinite alternate
}
.winner-name-display {
  font-size:1rem;
  font-weight:700;
  margin:5px 0
}
.explosion-amount {
  font-size:1.4rem;
  color:#fff;
  font-weight:700;
  animation:pulse 1.5s ease-in-out infinite
}
@keyframes explosionFadeIn {
  0% {
    opacity:0
  }
  to {
    opacity:1
  }
  
}
@keyframes bounce {
  0%,20%,50%,80%,to {
    transform:translateY(0)
  }
  40% {
    transform:translateY(-30px)
  }
  60% {
    transform:translateY(-15px)
  }
  
}
@keyframes pulse {
  0%,to {
    transform:scale(1)
  }
  50% {
    transform:scale(1.1)
  }
  
}
@keyframes imageZoom {
  0% {
    transform:scale(1)
  }
  to {
    transform:scale(1.1)
  }
  
}
@keyframes gradientShift {
  0% {
    background-position:0% 50%
  }
  50% {
    background-position:100% 50%
  }
  to {
    background-position:0% 50%
  }
  
}
@keyframes odometerActiveGlow {
  0% {
    filter:brightness(1);
    transform:scale(1)
  }
  50% {
    filter:brightness(1.3) drop-shadow(0 0 10px rgba(255,215,0,.8));
    transform:scale(1.1)
  }
  to {
    filter:brightness(1);
    transform:scale(1)
  }
  
}
@keyframes odometerActiveTitleGlow {
  0% {
    color:var(--color-primary-button-bg);
    text-shadow:0 2px 4px rgba(0,0,0,.5)
  }
  50% {
    color:gold;
    text-shadow:0 2px 8px rgba(255,215,0,.8)
  }
  to {
    color:var(--color-primary-button-bg);
    text-shadow:0 2px 4px rgba(0,0,0,.5)
  }
  
}
@keyframes odometerActiveScale {
  0% {
    transform:scale(1);
    color:#fff
  }
  50% {
    transform:scale(1.05);
    color:gold
  }
  to {
    transform:scale(1);
    color:#fff
  }
  
}
@keyframes textShake {
  0%,to {
    top:0;
    text-shadow:0 2px 4px rgba(0,0,0,.5)
  }
  20% {
    top:-5px;
    text-shadow:0 3px 6px rgba(0,0,0,.6)
  }
  40% {
    top:0;
    text-shadow:0 4px 8px rgba(0,0,0,.7)
  }
  60% {
    top:5px;
    text-shadow:0 3px 6px rgba(0,0,0,.6)
  }
  80% {
    top:0;
    text-shadow:0 2px 5px rgba(0,0,0,.55)
  }
  
}
.skeleton-icon {
  width:75px;
  height:75px;
  border-radius:8px;
  background:linear-gradient(90deg,#ffffff1a 25%,#ffffff4d,#ffffff1a 75%);
  background-size:200% 100%;
  animation:skeleton-shine 1.5s ease-in-out infinite;
  position:relative;
  overflow:hidden
}
.skeleton-title {
  height:20px;
  width:60%;
  background:linear-gradient(90deg,#ffffff1a 25%,#ffffff4d,#ffffff1a 75%);
  background-size:200% 100%;
  border-radius:4px;
  margin-bottom:15px;
  animation:skeleton-shine 1.5s ease-in-out infinite;
  position:relative;
  overflow:hidden
}
.skeleton-amount {
  height:32px;
  width:80%;
  background:linear-gradient(90deg,#ffffff1a 25%,#ffffff4d,#ffffff1a 75%);
  background-size:200% 100%;
  border-radius:6px;
  animation:skeleton-shine 1.5s ease-in-out infinite;
  position:relative;
  overflow:hidden
}
@keyframes skeleton-shine {
  0% {
    background-position:-200% 0
  }
  to {
    background-position:200% 0
  }
  
}
.skeleton-card {
  pointer-events:none;
  opacity:.7
}
.skeleton-card .skeleton-icon {
  flex-shrink:0
}
.skeleton-card .jackpot-right {
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:center
}
.dark .skeleton-icon,.dark .skeleton-title,.dark .skeleton-amount {
  background:linear-gradient(90deg,#3741514d 25%,#4b556380,#3741514d 75%);
  background-size:200% 100%
}
.jackpot-winner h3 {
  color:#fff;
  font-size:1.8rem;
  margin:0 0 30px
}
.winner-amount {
  font-size:4rem;
  font-weight:700;
  color:gold;
  margin:20px 0;
  text-shadow:0 4px 8px rgba(0,0,0,.5);
  font-family:Courier New,monospace
}
.jackpot-winner p {
  color:#ccc;
  font-size:1.2rem;
  margin:20px 0 0
}
@media (max-width: 1024px) {
  .jackpot-grid,.jackpot-grid.grid-cols-4,.jackpot-grid.grid-cols-5,.jackpot-grid.grid-cols-6,.jackpot-grid.grid-cols-7,.jackpot-grid.grid-cols-8 {
    grid-template-columns:repeat(3,1fr)
  }
  
}
@media (max-width: 768px) {
  .jackpot-grid,.jackpot-grid.grid-cols-2,.jackpot-grid.grid-cols-3,.jackpot-grid.grid-cols-4,.jackpot-grid.grid-cols-5,.jackpot-grid.grid-cols-6,.jackpot-grid.grid-cols-7,.jackpot-grid.grid-cols-8 {
    grid-template-columns:repeat(2,1fr)
  }
  .jackpot-card {
    padding:15px
  }
  .trigger-content {
    padding:30px;
    margin:20px
  }
  .jackpot-winner h2 {
    font-size:2rem
  }
  .winner-amount {
    font-size:2.5rem
  }
  
}
@media (max-width: 400px) {
  .jackpot-grid,.jackpot-grid.grid-cols-2,.jackpot-grid.grid-cols-3,.jackpot-grid.grid-cols-4,.jackpot-grid.grid-cols-5,.jackpot-grid.grid-cols-6,.jackpot-grid.grid-cols-7,.jackpot-grid.grid-cols-8 {
    grid-template-columns:1fr
  }
  
}
.jackpot-brand-header[data-v-170923dc] {
  text-align:center;
  margin-bottom:40px
}
.brand-container[data-v-170923dc] {
  margin:0 auto
}
.brand-logo[data-v-170923dc] {
  margin-bottom:10px;
  display:flex;
  justify-content:center
}
.logo-image[data-v-170923dc] {
  max-height:120px;
  max-width:300px;
  -o-object-fit:contain;
  object-fit:contain;
  filter:drop-shadow(0 8px 16px rgba(255,215,0,.3));
  animation:logoGlow-170923dc 3s ease-in-out infinite alternate
}
.brand-title[data-v-170923dc] {
  font-size:2rem;
  font-weight:700;
  color:#fff;
  text-shadow:0 4px 8px rgba(0,0,0,.5),0 0 30px rgba(255,215,0,.5);
  margin:0 0 20px;
  letter-spacing:2px;
  animation:titleGlow-170923dc 2s ease-in-out infinite alternate
}
.brand-subtitle[data-v-170923dc] {
  font-size:1.5rem;
  color:#fff;
  text-shadow:0 2px 4px rgba(0,0,0,.7);
  margin:0;
  opacity:.9;
  animation:subtitlePulse-170923dc 3s ease-in-out infinite
}
@keyframes logoGlow-170923dc {
  0% {
    filter:drop-shadow(0 8px 16px rgba(255,215,0,.3))
  }
  to {
    filter:drop-shadow(0 8px 24px rgba(255,215,0,.6))
  }
  
}
@keyframes titleGlow-170923dc {
  0% {
    text-shadow:0 4px 8px rgba(0,0,0,.5),0 0 30px rgba(255,215,0,.5)
  }
  to {
    text-shadow:0 4px 12px rgba(0,0,0,.7),0 0 40px rgba(255,215,0,.8)
  }
  
}
@keyframes subtitlePulse-170923dc {
  0%,to {
    opacity:.9
  }
  50% {
    opacity:.7
  }
  
}
@media (max-width: 768px) {
  .jackpot-brand-header[data-v-170923dc] {
    padding:30px 15px 40px
  }
  .brand-title[data-v-170923dc] {
    font-size:2.5rem;
    letter-spacing:1px
  }
  .brand-subtitle[data-v-170923dc] {
    font-size:1.2rem
  }
  .logo-image[data-v-170923dc] {
    max-height:80px;
    max-width:200px
  }
  
}
@media (max-width: 480px) {
  .brand-title[data-v-170923dc] {
    font-size:2rem
  }
  .brand-subtitle[data-v-170923dc] {
    font-size:1rem
  }
  .logo-image[data-v-170923dc] {
    max-height:60px;
    max-width:150px
  }
  
}