/* GoFun motion: cyan light, tactile controls and slow campaign movement. */
:root{--fx-ease:cubic-bezier(.22,.68,.26,1);--fx-light:#4dffff}
:where(.fx-interactive){position:relative}
.fx-interactive{transition:transform .22s var(--fx-ease),background-color .22s,color .22s,border-color .22s,box-shadow .22s,filter .22s}
.fx-interactive .icon{transition:color .22s,transform .22s var(--fx-ease)}
.btn.primary{position:relative}
.btn.primary,.support-fab{overflow:hidden}
.btn.primary::after{content:'';position:absolute;inset:-80% -50%;background:linear-gradient(110deg,transparent 38%,#ffffff55 50%,transparent 62%);transform:translateX(-110%);opacity:0;pointer-events:none}

/* Only the original artwork moves; its container and copy keep their geometry. */
.hero-art{transform-origin:75% 50%;animation:gofun-dice-drift 18s ease-in-out infinite;will-change:transform}
@keyframes gofun-dice-drift{
  0%,100%{transform:translate3d(0,0,0) scale(1.045) rotate(.1deg)}
  50%{transform:translate3d(-.8%,-1%,0) scale(1.085) rotate(-.5deg)}
}
.top-right .btn.primary{background-image:linear-gradient(110deg,#00ddb8 0%,#00eeff 35%,#9affed 55%,#00ddb8 80%,#00eeff 100%);background-size:260% 100%;animation:gofun-register-flow 8s ease-in-out infinite}
@keyframes gofun-register-flow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.hero.is-offscreen .hero-art,.motion-paused .hero-art,.motion-paused .top-right .btn.primary{animation-play-state:paused}
.hero.is-offscreen .hero-art{will-change:auto}

/* The pointer light is decorative and never intercepts taps or rail swipes. */
.fx-surface{position:relative}
.fx-surface::before{content:'';position:absolute;inset:0;z-index:1;border-radius:inherit;background:radial-gradient(240px circle at var(--fx-x,50%) var(--fx-y,50%),#4dffff26,transparent 72%);opacity:0;transition:opacity .3s;pointer-events:none}
.hero.fx-surface::before{background:radial-gradient(340px circle at var(--fx-x,70%) var(--fx-y,50%),#4dffff1c,transparent 72%)}
.fx-surface.fx-hover::before{opacity:1}
.live-label,.game-label{z-index:2}
.game-play{z-index:3}
.provider-logos>span{transition:border-color .25s,box-shadow .25s,color .25s}

@media(hover:hover) and (pointer:fine){
  .btn:hover,.support-fab:hover{transform:translateY(-2px);box-shadow:0 6px 24px #00eeff30}
  .btn.primary:hover::after{opacity:1;transform:translateX(110%);transition:transform .8s var(--fx-ease),opacity .2s}
  .btn.secondary:hover,.icon-button:hover,.rail-control:hover{border-color:#4dffff80;background-color:#253a39;color:#baffff}
  .category:hover{border-color:#4dffff80;box-shadow:inset 0 0 0 1px #4dffff12,0 4px 16px #0002}
  .category:hover .icon{color:var(--fx-light);transform:translateY(-1px)}
  .game:hover,.live-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px #0004}
  .game:hover .game-cover::after{box-shadow:inset 0 0 0 1px #4dffff99}
  .game:hover img,.live-card:hover img{transition-duration:.65s}
  .provider-logos>span:hover{border-color:#4dffff80;color:#d5ffff;box-shadow:inset 0 0 18px #4dffff08}
  .nav-item:hover .icon,.top-tab:hover .icon{color:var(--fx-light);transform:translateX(2px)}
  .sub-cta:hover,.promo a:hover,.footer-links a:hover,.view-all:hover{color:var(--fx-light)}
  .sub-cta:hover .icon,.promo a:hover .icon{transform:translateX(3px)}
}
@media(hover:none),(pointer:coarse){
  .game:hover img,.live-card:hover img{transform:none}
  .game:hover .game-play{opacity:0}
  .fx-interactive:hover{filter:none}
}
.fx-interactive.is-pressed{transform:scale(.97);filter:brightness(.9);transition-duration:.1s}
.game.is-pressed,.live-card.is-pressed{transform:scale(.985)}
.category.is-pressed{border-color:var(--fx-light);background-color:#214440}
@media(hover:none),(pointer:coarse){.category.is-pressed{transform:none}}
.fx-interactive:focus-visible{box-shadow:0 0 0 5px #4dffff16}
.game:focus-visible .game-play{opacity:1}

/* A separate clipped layer keeps the existing navigation marker unclipped. */
.fx-ripple-layer{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none;z-index:5}
.fx-ripple{position:absolute;border-radius:50%;background:#4dffff45;border:1px solid #baffff66;transform:scale(.04);opacity:.65;animation:gofun-tap-wave .62s cubic-bezier(.16,.7,.3,1) forwards}
.btn.primary .fx-ripple,.support-fab .fx-ripple{background:#ffffff66;border-color:#fff8}
@keyframes gofun-tap-wave{to{transform:scale(1);opacity:0}}

/* Reveal only sections initially below the viewport, once. */
.motion-reveal{opacity:0;transform:translate3d(0,12px,0);transition:opacity .55s var(--fx-ease),transform .55s var(--fx-ease)}
.motion-reveal.is-visible{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  .hero-art{animation:none;transform:none;will-change:auto}
  .top-right .btn.primary{animation:none;background-position:35% 50%}
  .fx-surface::before,.btn.primary::after,.fx-ripple-layer{display:none}
  .motion-reveal{opacity:1;transform:none;transition:none}
  .fx-interactive.is-pressed,.game.is-pressed,.live-card.is-pressed{transform:none}
  .fx-interactive:hover,.fx-interactive:focus-visible,.fx-interactive .icon,.game:hover img,.live-card:hover img{transform:none}
}