/* Readable real player counts; no pixel font or artificial count-up. */
.hero-panel .status{font-family:Montserrat,system-ui,-apple-system,'Segoe UI',sans-serif;font-size:25px;font-weight:750;line-height:1.4;letter-spacing:0;font-variant-numeric:lining-nums tabular-nums;text-shadow:none;color:#ffe1ab}
.store-online{display:inline-flex;align-items:center;gap:8px;font:700 15px/1.5 Montserrat,system-ui,sans-serif;font-variant-numeric:lining-nums tabular-nums;letter-spacing:0;color:#ffe1ab}
.store-online::before{content:'';width:7px;height:7px;flex:none;border-radius:50%;background:#70d18a}
.store-online[data-online=unknown]::before{background:#c7bca8}.store-online[data-online=false]::before{background:#f17866}
@media(max-width:550px){.hero-panel .status{font-size:23px}}
.motion-control{display:block;margin:24px auto 0;min-height:44px;border-radius:9px;font:600 12px/1.4 system-ui,sans-serif;text-transform:none;padding:10px 18px}
.reading-progress{transform:scaleX(0)}
html[data-site-motion=on] :is(a,button,summary){transition:color .2s,background-color .2s,border-color .2s,box-shadow .25s,transform .25s}
html[data-site-motion=on] :is(input,select,textarea){transition:border-color .2s,box-shadow .25s,background-color .25s}
html[data-site-motion=on] :is(input,select,textarea):focus{box-shadow:0 0 0 4px #ffc76520}
html[data-site-motion=on] summary::after{content:'+';margin-left:auto;padding-left:16px;color:var(--gold);transition:rotate .25s}
html[data-site-motion=on] details[open]>summary::after{rotate:45deg}
html[data-site-motion=on] .logo-title .mascot{animation:cookie-mascot-drift 6s ease-in-out infinite}
html[data-site-motion=on] .mascot-halo{animation:cookie-halo-breathe 6s ease-in-out infinite}
html[data-site-motion=on] .hero-panel .status[data-online=true]::before{animation:cookie-status-glow 3s ease-in-out infinite}
html[data-site-motion=on] .store-intro{position:relative;isolation:isolate;overflow:hidden}
html[data-site-motion=on] .store-intro::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 20% 30%,#ffb34719,transparent 60%);animation:cookie-halo-breathe 9s ease-in-out infinite}
@media(hover:hover) and (pointer:fine){
 html[data-site-motion=on] :is(.product,.panel,.vote-card,.support-grid>a){transition:translate .3s,border-color .25s,box-shadow .3s}
 html[data-site-motion=on] :is(.product,.vote-card,.support-grid>a):hover{translate:0 -5px;box-shadow:0 14px 30px #0004}
 html[data-site-motion=on] .product img{transition:scale .4s,rotate .4s}
 html[data-site-motion=on] .product:hover img{scale:1.045;rotate:-2deg}
 html[data-site-motion=on] :is(.gold,[data-store-add]):not(:disabled):hover{box-shadow:0 4px 0 #845b16,0 0 24px #ffb64f40}
 html[data-site-motion=on] .category-tile .symbol{transition:rotate .35s,scale .35s}
 html[data-site-motion=on] .category-tile:hover .symbol{rotate:8deg;scale:1.08}
 html[data-site-motion=on] .footer-grid a:hover{translate:3px 0}
 html[data-site-motion=on] .footer-grid a{transition:translate .2s,color .2s}
 html[data-site-motion=on] .rank-table tbody tr{transition:background-color .25s}
 html[data-site-motion=on] .rank-table tbody tr:hover{background:#ffd3650b}
}
@keyframes cookie-mascot-drift{50%{translate:0 -10px;rotate:2deg}}
@keyframes cookie-halo-breathe{50%{opacity:.6;scale:1.08}}
@keyframes cookie-status-glow{50%{opacity:.6}}
html[data-site-motion=off]{scroll-behavior:auto!important}
html[data-site-motion=off] *,html[data-site-motion=off] *::before,html[data-site-motion=off] *::after{animation:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation:none!important;transition:none!important}}

/* Joining instructions stay in normal flow, with room for entry animation. */
.join-guide{display:grid;grid-template-columns:minmax(0,1fr);row-gap:28px}
.join-guide>.eyebrow,.join-guide>h2,.join-guide>.panel{margin-block:0}
.join-guide .join-grid{gap:24px;align-items:stretch;min-width:0}
.join-guide .panel{min-width:0;overflow-wrap:anywhere}
.join-guide .panel h3{margin-top:0;line-height:1.4}
.join-guide .panel p{margin-bottom:0}
.join-guide .panel button{max-width:100%}
.join-guide>details{padding-block:16px;margin:0}
.join-guide>.eyebrow+ h2{margin-top:-12px}
@media(max-width:550px){.join-guide{row-gap:24px}.join-guide .join-grid{grid-template-columns:minmax(0,1fr)}}