@font-face{font-family:'Alegreya Sans SC';src:url('assets/fonts/alegreya-sans-sc.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:'Roboto Slab';src:url('assets/fonts/roboto-slab.ttf') format('truetype');font-weight:100 900;font-display:swap}
@font-face{font-family:'Russo One';src:url('assets/fonts/russo-one.ttf') format('truetype');font-weight:400;font-display:swap}

/* Isolate the settled board so a highlighted cell can never cover a WILD. */
.board{isolation:isolate;z-index:1;contain:layout paint}
.wild-overlay{z-index:8;isolation:isolate}
.theme-fx{z-index:9}
.win-burst{z-index:10}
.game-shell .cell.wild-covered .symbol,.game-shell .cell.wild-covered .reward-value{visibility:hidden}
.game-shell .cell.wild-covered{box-shadow:none;background:transparent}
.game-shell .cell.wild-covered:after{display:none}
.game-shell .symbol,.game-shell .dust .symbol,.dust .cell .symbol,.vault .symbol,.mini-symbol{mix-blend-mode:normal;background-color:transparent;background-repeat:no-repeat}
.game-shell .symbol{will-change:auto;inset:5%}
.vault .symbol{inset:8%}
.game-shell .cell.is-match .symbol{animation:symbol-win .6s ease both}
.game-shell.moon .cell.is-match .symbol{animation:moon-hop .55s ease both}
.game-shell.dust .cell.is-match .symbol{animation:duel-hit .4s ease-out both}
.cell.is-match{z-index:2}

/* The only moving element during a base spin is the long strip in each column. */
.reel-motion-layer{position:absolute;pointer-events:none;z-index:3;overflow:hidden}
.reel-window{position:absolute;top:0;height:100%;overflow:hidden;contain:layout paint;will-change:filter}
.reel-track{position:absolute;left:0;right:0;top:0;will-change:transform;backface-visibility:hidden;transform:translate3d(0,0,0)}
.reel-item{position:relative;width:100%}
.reel-slot{position:absolute;left:0;right:0;top:0}
.cascade-slot{position:absolute;left:0;right:0;will-change:transform}
.game-shell .reel-motion-layer .symbol{animation:none!important;transition:none!important;transform:none!important;opacity:1;filter:none;visibility:visible;inset:5%}
.game-shell.vault .reel-motion-layer .symbol{inset:8%}
.board.is-motion>.cell>.symbol,.board.is-motion>.cell>.reward-value{visibility:hidden}
.board.is-motion>.cell{box-shadow:none}
.board.is-motion>.cell:after{display:none}

/* Vault cells charge and materialize in place. Locked cells receive no effect. */
.vault .cell.vault-revealing{isolation:isolate;animation:none;box-shadow:none}
.vault .cell.vault-revealing:after{display:none}
.vault-reveal-layer{position:absolute;inset:0;border-radius:50%;overflow:hidden;pointer-events:none;z-index:4}
.vault-charge-ring{position:absolute;inset:10%;border:2px solid #91eff5;border-left-color:transparent;border-right-color:transparent;border-radius:50%;box-shadow:inset 0 0 8px #86ecf366,0 0 8px #86ecf366;opacity:0}
.vault-charge-core{position:absolute;inset:12%;border-radius:50%;background:radial-gradient(circle,#d2ffffbb,#6fdfec66 32%,#35b4d422 55%,transparent 72%);opacity:0}
.vault-result{position:absolute;inset:0;opacity:0;will-change:opacity,transform}
.vault .vault-result .symbol{animation:none!important;inset:8%}
.vault .vault-result .reward-value,.vault .held .reward-value{animation:none!important}
.vault .vault-result:has(.reward-value) .symbol{opacity:.75}
.vault .spin-button.is-running svg{animation:vault-button-charge .8s ease-in-out infinite alternate}
@keyframes vault-button-charge{from{opacity:.45;filter:drop-shadow(0 0 0 #b7ffff)}to{opacity:1;filter:drop-shadow(0 0 6px #b7ffff)}}

/* Individual display faces for each game's interface. */
.game-shell.moon{--game-ui:'Alegreya Sans SC',sans-serif}
.game-shell.dust{--game-ui:'Roboto Slab',serif}
.game-shell.vault{--game-ui:'Russo One',sans-serif}
.game-shell .game-status,.game-shell .feature-button,.game-shell .bet-control>span,.game-shell .win-panel small,.game-shell .game-title>span,.game-shell .theme-feature>small,.game-shell .play-footer,.game-shell .play-wallet small{font-family:var(--game-ui);font-weight:500;text-transform:none;letter-spacing:.045em}
.game-shell.vault .game-status,.game-shell.vault .feature-button,.game-shell.vault .bet-control>span,.game-shell.vault .win-panel small{font-weight:400}
.game-shell .game-status{font-size:clamp(10px,2.65cqw,15px);line-height:1.25;min-height:8cqw;padding:1cqw 3cqw;gap:1.5cqw}
.moon .game-status{font-size:clamp(11px,3.15cqw,17px)}
.dust .game-status{font-size:clamp(10px,2.55cqw,14px);font-weight:600}
.game-shell .game-title>span{font-size:2.4cqw}
.game-shell .theme-feature>small{font-size:2.15cqw}
.game-shell .win-panel small{font-size:2.35cqw;line-height:1.25}
.game-shell .play-footer{font-size:1.85cqw;opacity:.8;letter-spacing:.04em}
.game-shell .feature-button{font-size:clamp(9px,2.25cqw,13px);line-height:1.25;min-height:10cqw;display:flex;align-items:center;justify-content:center;gap:1.5cqw;padding:1.5cqw 2cqw}
.game-shell .feature-button>span{float:none;flex-shrink:0;margin:0;font-size:5cqw}
.game-shell .win-panel{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;min-height:15cqw;padding:2cqw 5cqw}
.game-shell .win-panel strong{line-height:1.1;font-variant-numeric:tabular-nums}

/* All control bottoms share one baseline; decoration is contained in the button. */
.game-shell .game-controls{display:grid;grid-template-columns:minmax(0,1fr) 22cqw minmax(0,1fr);align-items:end;gap:3cqw;min-height:28cqw;padding:2cqw 5cqw 3cqw}
.game-shell .bet-control{width:100%;align-self:end;display:flex;flex-direction:column;gap:1.5cqw}
.game-shell .bet-control>span{font-size:2.5cqw;line-height:1.1}
.game-shell .bet-control>div{height:11cqw;margin:0;display:grid;grid-template-columns:8cqw minmax(0,1fr) 8cqw;align-items:center}
.game-shell .bet-control button{min-height:0;height:100%;width:100%;font-size:5cqw;padding:0}
.game-shell .bet-control b{font-size:4.2cqw;min-width:0;font-variant-numeric:tabular-nums}
.game-shell .aux-controls{width:100%;height:11cqw;display:flex;gap:1.5cqw;align-items:end;justify-content:flex-end;align-self:end}
.game-shell .aux-controls .icon-button{width:10.8cqw;height:11cqw;flex-shrink:0}
.game-shell .spin-button{width:22cqw;height:22cqw;align-self:end;justify-self:center;margin:0;transform:none;outline:0;transition:filter .15s}
.game-shell .spin-button:hover:enabled{transform:none;filter:brightness(1.12)}
.game-shell .spin-button:active:enabled{transform:none;filter:brightness(.9)}
.game-shell .spin-button svg{position:relative;z-index:2}
.dust .spin-button{height:19cqw;border-radius:7%;box-shadow:inset 0 0 0 .7cqw #b18750,0 1cqw 3cqw #0008}
.vault .spin-button{--octagon:polygon(27% 0,73% 0,100% 27%,100% 73%,73% 100%,27% 100%,0 73%,0 27%);position:relative;clip-path:var(--octagon);border:0;background:#75dce9;box-shadow:none}
.vault .spin-button:before,.vault .spin-button:after{content:'';position:absolute;clip-path:var(--octagon);pointer-events:none}
.vault .spin-button:before{inset:.7cqw;background:#153b4a}
.vault .spin-button:after{inset:1.4cqw;background:radial-gradient(circle at 35% 25%,#bafaff,#64cadc 65%,#285d72)}
.vault .feature-button{clip-path:none;border-radius:4px;border:1px solid #69c7d2;background:#163a46;box-shadow:inset 0 0 0 2px #15303b}
.game-shell .game-scene{min-height:24cqw}
@media(prefers-reduced-motion:reduce){.reel-motion-layer{display:none}.game-shell .cell.is-match .symbol{animation:none}}

/* Sport Manager App: shared SM monogram and room for the full name on phones. */
.brand{letter-spacing:1.2px;font-size:14px;gap:12px}
.brand-copy{line-height:1.1}
.brand-copy>strong{display:block;margin-top:3px;letter-spacing:3px}
.brand-mark{display:block;flex:none;width:40px;height:40px;font-style:normal}
.brand-mark img{display:block;width:100%;height:100%}
.brand small{font-size:6px;letter-spacing:1.1px;margin-top:7px}
.desktop-aside .brand{font-size:11px;gap:9px;letter-spacing:.6px}
.desktop-aside .brand-mark{width:33px;height:33px}
@media(max-width:680px){
  .site-header{height:auto;min-height:130px;display:grid;grid-template-columns:1fr auto;gap:14px;padding:16px 20px}
  .site-header .brand{font-size:13px;gap:10px;grid-column:1;grid-row:1}
  .site-header .brand-mark{width:34px;height:34px}
  .site-header .header-actions{display:contents}
  .site-header .header-actions>.icon-button{grid-column:2;grid-row:1;width:34px;height:34px}
  .site-header .wallet{grid-column:1/-1;grid-row:2;width:100%;padding:8px 12px}
  .site-header .wallet-plus{margin-left:auto}
  .portrait-label{display:none}
}