/* Responsive finishing details, kept separate from the component catalogue. */
.mobile-nav .nav-item .nav-arrow{display:none}
.skip-link{opacity:0;pointer-events:none}
.skip-link:focus{opacity:1;pointer-events:auto}
.list-item>.value{max-width:45%;overflow-wrap:anywhere}
.stat-card strong{overflow-wrap:anywhere}
.game-top .tag{white-space:normal;text-align:right}
.wheel-view.detailed{background:#303747}
.wheel-disk{width:100%;height:100%}
.wheel-disk.spinning{animation:wheel-reveal 1s cubic-bezier(.15,.6,.2,1)}
@keyframes wheel-reveal{from{transform:rotate(720deg)}to{transform:rotate(0)}}
@media(max-width:650px){
 .hero-copy{width:82%}
 .hero h2{font-size:29px;max-width:245px}
 .hero>.art{width:51%;height:86%;right:-18px;bottom:-24px}
 .hero p{max-width:182px}
 .hero{min-height:245px}
 .mobile-nav{padding-top:10px;padding-bottom:calc(10px + env(safe-area-inset-bottom,0px))}
 .game-stage{min-width:0}
 .game-controls{min-width:0}
 .slot-reels{max-width:100%;padding:12px}
 .slot-symbol{width:clamp(47px,16vw,65px);font-size:40px}
 .game-top{flex-wrap:wrap}
 .game-top .tag{font-size:7px}
}
@media(max-width:350px){.hero h2{font-size:25px}.hero p{max-width:156px}.hero-copy{width:86%}.balance-value{font-size:30px}.page-head h1{font-size:23px}}