/* All idle movement stays in illustration, light and trim layers, outside the reels. */
#lobby,#play-view{position:relative;isolation:isolate}
.idle-space{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-1;contain:paint;--space-color:#9267e4}
.idle-space-glow{position:absolute;top:-100px;left:15%;width:min(80vw,1000px);height:650px;background:radial-gradient(ellipse,color-mix(in srgb,var(--space-color) 16%,transparent),transparent 68%);animation:idle-room-light 18s ease-in-out infinite}
.idle-space-orbit{position:absolute;top:180px;right:-230px;width:650px;height:650px;border:1px solid #a58bd416;border-radius:50%;animation:idle-orbit 70s linear infinite}
.idle-space-orbit:after{content:'';position:absolute;top:13%;left:14%;width:5px;height:5px;border-radius:50%;background:#c3afff99;box-shadow:0 0 15px #bd9dff99}
.idle-space-orbit:nth-child(3){top:310px;right:-140px;width:480px;height:480px;animation-duration:90s;animation-direction:reverse}
body[data-screen=moon] #play-view .idle-space{--space-color:#ac67b7}
body[data-screen=dust] #play-view .idle-space{--space-color:#d88c42}
body[data-screen=vault] #play-view .idle-space{--space-color:#2bd8e7}
#play-view .idle-space-orbit{right:calc(50% - 340px);top:calc(50% - 340px);width:680px;height:680px;border-color:color-mix(in srgb,var(--space-color) 10%,transparent)}
#play-view .idle-space-orbit:nth-child(3){right:calc(50% - 430px);top:calc(50% - 430px);width:860px;height:860px}
#play-view .idle-space-orbit:after{background:var(--space-color);box-shadow:0 0 20px var(--space-color)}

/* Shared lobby details: the type and wallet numbers themselves stay still. */
.brand-mark{isolation:isolate}
.brand-mark:after{content:'';position:absolute;inset:-5px;border:1px solid #7de6e640;border-radius:13px;animation:idle-brand 6s ease-in-out infinite;pointer-events:none}
.live-dot{animation:idle-beacon 3.8s ease-in-out infinite}
.note-star{animation:idle-orbit 36s linear infinite}
.club-emblem{position:relative;animation:idle-emblem 6s ease-in-out infinite}
.club-emblem:after{content:'';position:absolute;inset:-6px;border:1px dashed #bb99f04a;border-radius:50%;animation:idle-orbit 40s linear infinite}
.progress-track{position:relative;overflow:hidden}
.progress-track:after{content:'';position:absolute;inset:0 auto 0 -35%;width:35%;background:linear-gradient(90deg,transparent,#f1e5ff88,transparent);animation:idle-progress 9s ease-in-out infinite}
.card-visual{isolation:isolate}
.card-badge,.card-number,.card-title{z-index:2}
.card-art{animation:idle-card-camera 17s ease-in-out infinite;transform-origin:70% 35%}
.card-dust .card-art{animation-duration:23s;animation-delay:-6s;transform-origin:45% 30%}
.card-vault .card-art{animation-duration:20s;animation-delay:-10s;transform-origin:75% 40%}
.card-play>span:last-child{animation:idle-invitation 5s ease-in-out infinite}
.card-dust .card-play>span:last-child{animation-delay:-1.6s}
.card-vault .card-play>span:last-child{animation-delay:-3.2s}

/* Theme scenes share geometry, but every world has its own motion language. */
.idle-atmosphere{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none;contain:paint;transition:opacity .45s;--idle-tint:#f3cf87}
.card-visual .idle-atmosphere{mask-image:linear-gradient(#000 55%,transparent 100%)}
.game-scene .game-title,.game-scene .theme-feature,.game-scene .demo-stamp{z-index:2}
.scene-sparks{display:none}
.idle-aura,.idle-haze,.idle-orbit{position:absolute;pointer-events:none}
.idle-mote{position:absolute;left:var(--x);top:var(--y);width:var(--size);height:var(--size);border-radius:50%;background:var(--idle-tint);box-shadow:0 0 7px var(--idle-tint);opacity:0;animation:idle-firefly var(--duration) ease-in-out infinite;animation-delay:var(--phase)}
.idle-streak{position:absolute;left:18%;top:20%;width:70px;height:1px;background:linear-gradient(90deg,transparent,#fff1c9);transform:rotate(-25deg);opacity:0;animation:idle-shooting-star 15s ease-out infinite}
.idle-moon .idle-aura{inset:-15% -10% 15% 28%;border-radius:50%;background:radial-gradient(ellipse,#c2b5ff30,transparent 62%);animation:idle-moonlight 9s ease-in-out infinite}
.idle-moon .idle-haze{inset:30% -15% -25%;background:radial-gradient(ellipse at 25% 80%,#ab73d22c,transparent 65%);animation:idle-fog 14s ease-in-out infinite alternate}
.idle-moon .idle-orbit{width:75px;height:75px;right:12%;top:12%;border-radius:50%;background:radial-gradient(circle,#efddbc14,transparent 70%);animation:idle-moonlight 7s ease-in-out infinite reverse}
.moon .scene-art{animation:idle-scene-camera 19s ease-in-out infinite;transform-origin:65% 30%}

.idle-dust{--idle-tint:#ffca79}
.idle-dust .idle-aura{inset:0;background:radial-gradient(ellipse at 14% 35%,#ffb14a32,transparent 62%);animation:idle-sunset 8s ease-in-out infinite}
.idle-dust .idle-haze{inset:15% -35% -20%;background:radial-gradient(ellipse at 20% 90%,#d6ac7340,transparent 50%),radial-gradient(ellipse at 65% 65%,#e7c18b1c,transparent 55%);animation:idle-dust-cloud 13s ease-in-out infinite alternate}
.idle-dust .idle-mote{width:calc(var(--size)*.8);height:calc(var(--size)*.8);box-shadow:none;animation-name:idle-dust-grain;animation-timing-function:linear}
.idle-dust .idle-orbit{left:-20%;right:-20%;top:35%;height:30%;background:linear-gradient(172deg,transparent 35%,#ffc77716 47%,transparent 60%);animation:idle-sunbeam 12s ease-in-out infinite}
.idle-dust .idle-streak{display:none}
.dust .scene-art{animation:idle-scene-camera 25s ease-in-out infinite;animation-delay:-7s;transform-origin:45% 25%}

.idle-vault{--idle-tint:#83f2ff}
.idle-vault .idle-aura{inset:0;background:radial-gradient(ellipse at 48% 45%,#ffc26a45,transparent 44%),radial-gradient(ellipse at 8% 15%,#29cfe92c,transparent 50%);animation:idle-reactor 5s ease-in-out infinite}
.idle-vault .idle-haze{inset:35% -15% -30%;background:radial-gradient(ellipse at 40% 85%,#40bedd33,transparent 65%);animation:idle-fog 16s ease-in-out infinite alternate}
.idle-vault .idle-orbit{left:29%;top:4%;width:41%;aspect-ratio:1;border:1px dashed #ffd39e35;border-left-color:#b2ffff70;border-radius:50%;animation:idle-orbit 28s linear infinite;box-shadow:inset 0 0 20px #f4b25514}
.idle-vault .idle-orbit:before,.idle-vault .idle-orbit:after{content:'';position:absolute;inset:8%;border:1px solid #ffd39c30;border-right-color:transparent;border-radius:50%}
.idle-vault .idle-orbit:after{inset:-8%;border:1px dashed #73e5ef25}
.idle-vault .idle-mote{width:2px;height:calc(var(--size)*1.7);border-radius:2px;animation-name:idle-ion;animation-timing-function:linear}
.idle-vault .idle-streak{left:4%;top:18%;width:1px;height:30%;background:linear-gradient(transparent,#a7f6ff,transparent);animation:idle-current 7s ease-in-out infinite;transform:none}
.vault .scene-art{animation:idle-scene-camera 22s ease-in-out infinite;transform-origin:45% 35%}

/* Idle light lives in the cabinet rails and controls, never behind a held reward. */
.idle-frame{position:absolute;inset:0;pointer-events:none;z-index:2;overflow:hidden}
.idle-frame i{position:absolute;left:0;top:0;width:24%;height:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);animation:idle-rail 8s ease-in-out infinite;opacity:.65}
.idle-frame i:last-child{top:auto;bottom:0;animation-delay:-4s;animation-direction:reverse}
.dust .idle-frame i{animation-duration:12s;opacity:.5;width:16%}
.vault .idle-frame i{height:2px;width:30%;animation-duration:5s;box-shadow:0 0 7px #6ce9fc55}
.moon .idle-frame i{animation-duration:11s}
.spin-button{position:relative;overflow:hidden;isolation:isolate}
.idle-button-glow{position:absolute;inset:0;z-index:1;border-radius:inherit;pointer-events:none;background:radial-gradient(ellipse at 35% 25%,#fff9c27a,transparent 65%);animation:idle-button-light 4s ease-in-out infinite}
.dust .idle-button-glow{background:linear-gradient(110deg,transparent 25%,#ffeec45c 48%,transparent 65%);animation:idle-button-sweep 7s ease-in-out infinite}
.vault .idle-button-glow{background:radial-gradient(ellipse,#d5ffff88,transparent 65%);animation:idle-button-light 3.7s ease-in-out infinite}
.feature-button>span{animation:idle-feature-star 6s ease-in-out infinite}
.game-shell[data-busy=true] .idle-atmosphere{opacity:.35}
.game-shell[data-busy=true] .idle-frame,.game-shell[data-busy=true] .idle-button-glow{opacity:0}
.game-shell[data-busy=true] .idle-motion{animation-play-state:paused!important}

/* Settings, collection, rules, refill and About share a slow wash of light. */
dialog{isolation:isolate;overflow-x:hidden}
.idle-modal-glow{position:absolute;top:0;left:0;right:0;height:220px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 20% 0,#a078e633,transparent 65%);animation:idle-dialog-light 12s ease-in-out infinite}
.collection-item{position:relative;overflow:hidden}
.collection-item.unlocked:after{content:'';position:absolute;inset:-20%;background:linear-gradient(110deg,transparent 38%,#d8bdff15 49%,transparent 60%);animation:idle-badge-shine 9s ease-in-out infinite;pointer-events:none}
.collection-item:nth-child(2):after{animation-delay:-3s}
.collection-item:nth-child(3):after{animation-delay:-6s}
.collection-item.unlocked .mini-symbol{animation:idle-badge-float 5s ease-in-out infinite}
.collection-item:nth-child(2) .mini-symbol{animation-delay:-1.5s}
.collection-item:nth-child(3) .mini-symbol{animation-delay:-3s}

@keyframes idle-room-light{0%,100%{transform:translate(-6%,0) scale(.95);opacity:.65}50%{transform:translate(12%,6%) scale(1.1);opacity:1}}
@keyframes idle-orbit{to{transform:rotate(360deg)}}
@keyframes idle-brand{0%,100%{opacity:.25;transform:scale(.96)}50%{opacity:.8;transform:scale(1.06)}}
@keyframes idle-beacon{0%,100%{opacity:.4;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}
@keyframes idle-emblem{0%,100%{transform:translateY(0) rotate(-7deg)}50%{transform:translateY(-3px) rotate(7deg)}}
@keyframes idle-progress{0%,65%{transform:translateX(0);opacity:0}70%{opacity:1}100%{transform:translateX(400%);opacity:0}}
@keyframes idle-card-camera{0%,100%{transform:scale(1.025) translate(0,0)}50%{transform:scale(1.085) translate(-1%,-.5%)}}
@keyframes idle-scene-camera{0%,100%{transform:scale(1.02) translate(0,0)}50%{transform:scale(1.065) translate(-.6%,.3%)}}
@keyframes idle-invitation{0%,70%,100%{transform:translate(0,0);opacity:.65}85%{transform:translate(3px,-3px);opacity:1}}
@keyframes idle-firefly{0%,100%{transform:translate(0,8px) scale(.5);opacity:0}25%{opacity:.75}55%{transform:translate(12px,calc(-1*var(--travel))) scale(1);opacity:.9}80%{opacity:.15}}
@keyframes idle-moonlight{0%,100%{opacity:.45;transform:scale(.9)}50%{opacity:1;transform:scale(1.1)}}
@keyframes idle-fog{from{transform:translateX(-8%) scale(.95);opacity:.5}to{transform:translateX(8%) scale(1.12);opacity:1}}
@keyframes idle-shooting-star{0%,80%,100%{opacity:0;transform:translate(0,0) rotate(-25deg) scaleX(.2)}82%{opacity:.7}88%{opacity:0;transform:translate(170px,-65px) rotate(-25deg) scaleX(1)}}
@keyframes idle-sunset{0%,100%{opacity:.5}50%{opacity:1}}
@keyframes idle-dust-cloud{from{transform:translateX(-12%) scale(.95);opacity:.45}to{transform:translateX(12%) scale(1.08);opacity:.9}}
@keyframes idle-dust-grain{0%{opacity:0;transform:translate(-35px,10px)}20%,70%{opacity:.55}100%{opacity:0;transform:translate(90px,calc(-1*var(--travel)))}}
@keyframes idle-sunbeam{0%,100%{opacity:.2;transform:translateY(-10%) rotate(-3deg)}50%{opacity:1;transform:translateY(20%) rotate(3deg)}}
@keyframes idle-reactor{0%,100%{opacity:.45;transform:scale(.98)}50%{opacity:1;transform:scale(1.04)}}
@keyframes idle-ion{0%{opacity:0;transform:translateY(20px) scaleY(.5)}25%,70%{opacity:.65}100%{opacity:0;transform:translateY(calc(-1*var(--travel))) scaleY(1.2)}}
@keyframes idle-current{0%,40%,100%{transform:translateY(-80%);opacity:0}50%{opacity:.65}85%{transform:translateY(180%);opacity:0}}
@keyframes idle-rail{0%,100%{transform:translateX(-100%);opacity:0}15%,80%{opacity:.7}90%{transform:translateX(520%);opacity:0}}
@keyframes idle-button-light{0%,100%{opacity:.15;transform:scale(.8)}50%{opacity:.7;transform:scale(1.12)}}
@keyframes idle-button-sweep{0%,60%{opacity:0;transform:translateX(-100%)}70%{opacity:.8}100%{opacity:0;transform:translateX(100%)}}
@keyframes idle-feature-star{0%,100%{transform:translateY(0) rotate(0);opacity:.65}50%{transform:translateY(-2px) rotate(15deg);opacity:1}}
@keyframes idle-dialog-light{0%,100%{transform:translateX(-10%);opacity:.6}50%{transform:translateX(22%);opacity:1}}
@keyframes idle-badge-shine{0%,55%{transform:translateX(-90%)}100%{transform:translateX(90%)}}
@keyframes idle-badge-float{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-4px) rotate(3deg)}}

/* Stop motion that cannot be seen, and respect the OS reduced-motion preference. */
[hidden] .idle-motion,[data-motion-visible=false] .idle-motion,
[data-motion-visible=false] .card-play>span:last-child,
[data-motion-visible=false] .brand-mark:after,[data-motion-visible=false] .club-emblem:after,[data-motion-visible=false] .progress-track:after,
.modal-open #lobby .idle-motion,.modal-open #play-view .idle-motion,
.modal-open #lobby .brand-mark:after,.modal-open #play-view .brand-mark:after,
.modal-open .card-play>span:last-child,.modal-open .club-emblem:after,.modal-open .progress-track:after,
.page-hidden .idle-motion,.page-hidden .brand-mark:after,.page-hidden .club-emblem:after,.page-hidden .progress-track:after,.page-hidden .card-play>span:last-child,
.page-hidden .collection-item.unlocked:after,.page-hidden .collection-item.unlocked .mini-symbol{animation-play-state:paused!important}
@media(max-width:680px){.idle-mote:nth-of-type(n+8){display:none}.idle-space-orbit{display:none}.idle-space-glow{height:450px;width:110%;left:-5%}.idle-vault .idle-orbit{border-width:1px}}
@media(prefers-reduced-motion:reduce){
  .idle-motion,.brand-mark:after,.club-emblem:after,.progress-track:after,.card-play>span:last-child,.collection-item.unlocked:after,.collection-item.unlocked .mini-symbol{animation:none!important;transition:none!important}
  .idle-atmosphere,.idle-frame,.idle-button-glow,.idle-space-orbit,.brand-mark:after{display:none}
  .card-art,.scene-art{transform:none!important}
}
