/* =====================================================================
   winnerZ V58 — clean casino layer
   Direction: the V57 reference, but flatter, quieter and fully branded.
   No neon, no glow, no glass. Keep the original V57 icon system/artwork.
   ===================================================================== */

:root{
  --wz-bg:#07131b;
  --wz-surface:#0b1c26;
  --wz-surface-2:#0e2430;
  --wz-surface-3:#122b38;
  --wz-line:#1f3a46;
  --wz-line-2:#2b4b58;
  --wz-text:#f3f6f7;
  --wz-muted:#8ea2aa;
  --wz-muted-2:#6f858e;
  --wz-accent:#d8b45b;
  --wz-accent-2:#b99542;
  --wz-green:#3f9a78;
  --wz-red:#b76770;
  --wz-blue:#4d7e9a;
  --wz-sidebar:192px;
  --wz-header:58px;
  --wz-radius:10px;
}

/* ---- global ---- */
html,body{background:var(--wz-bg)!important;color:var(--wz-text)!important}
body{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  overflow-x:hidden!important;
}
body:before,.bg-orbs,.color-stripe{display:none!important}
button,a,input,select,textarea{font-family:inherit!important}
svg{flex:none!important}
*{scrollbar-color:#2a414b #08151c}

/* ---- logo / wordmark ---- */
.site-header .winnerz-wordmark{display:flex!important;align-items:center!important;gap:10px!important;text-decoration:none!important}
.site-header .winnerz-wordmark .stakr-wordmark-text{
  color:#f4f6f7!important;
  font-size:18px!important;
  font-weight:900!important;
  letter-spacing:-.055em!important;
}
.winnerz-cardmark{
  position:relative!important;
  width:30px!important;height:30px!important;
  min-width:30px!important;
  display:block!important;
}
.winnerz-cardmark i{
  position:absolute!important;
  display:block!important;
  width:15px!important;height:21px!important;
  border:1px solid #d6dde0!important;
  border-radius:3px!important;
  background:#f7f7f4!important;
  box-shadow:0 2px 4px rgba(0,0,0,.18)!important;
}
.winnerz-cardmark i:before{
  content:"♠♥"!important;
  position:absolute!important;
  left:2px!important;top:1px!important;
  font-size:7px!important;
  letter-spacing:1px!important;
  color:#24313a!important;
  line-height:1!important;
}
.winnerz-cardmark i:first-child{left:2px!important;top:4px!important;transform:rotate(-8deg)!important}
.winnerz-cardmark i:last-child{right:1px!important;top:1px!important;transform:rotate(8deg)!important}
.winnerz-cardmark i:last-child:before{content:"♥♠"!important;color:#a6535f!important}

.casino-sidebar .winnerz-side-brand{display:flex!important;align-items:center!important;gap:10px!important;color:#f4f6f7!important;padding:5px 10px 16px!important}
.casino-sidebar .winnerz-side-brand > span:last-child{font-size:16px!important;font-weight:900!important;letter-spacing:-.05em!important}
.casino-sidebar .winnerz-side-brand .winnerz-cardmark{transform:scale(.88)!important;transform-origin:left center!important}

/* ---- shell ---- */
.site-header{
  left:var(--wz-sidebar)!important;right:0!important;top:0!important;
  height:var(--wz-header)!important;
  padding:0 18px!important;
  display:grid!important;
  grid-template-columns:1fr auto 1fr!important;
  align-items:center!important;
  gap:14px!important;
  background:#08151d!important;
  border-bottom:1px solid rgba(210,220,224,.08)!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  z-index:9000!important;
}
.site-header .winnerz-wordmark{grid-column:1!important;justify-self:start!important}
.site-header .stakr-auth-actions{grid-column:3!important;justify-self:end!important}
.stakr-login-btn,.stakr-signup-btn{
  height:36px!important;min-height:36px!important;
  padding:0 14px!important;border-radius:8px!important;
  font-size:11px!important;font-weight:850!important;
  box-shadow:none!important;
}
.stakr-login-btn{
  background:#0d202a!important;border:1px solid #29424d!important;color:#dbe3e6!important;
}
.stakr-signup-btn{
  background:var(--wz-accent)!important;border:1px solid var(--wz-accent-2)!important;color:#161b1d!important;
}
.stakr-login-btn:hover{background:#122a35!important;border-color:#3a5662!important}
.stakr-signup-btn:hover{background:#e0bf69!important}

.casino-sidebar{
  left:0!important;top:var(--wz-header)!important;bottom:0!important;
  width:var(--wz-sidebar)!important;height:calc(100vh - var(--wz-header))!important;
  padding:10px 9px!important;
  background:#08151d!important;
  border-right:1px solid rgba(210,220,224,.08)!important;
  box-shadow:none!important;
  overflow:hidden!important;
  z-index:8800!important;
}
.stakr-side-top,.stakr-side-bottom{gap:4px!important}
.stakr-side-bottom{padding-top:12px!important;border-top:1px solid rgba(210,220,224,.08)!important}
.stakr-side-item,.stakr-side-profile{
  min-height:42px!important;height:42px!important;
  padding:0 11px!important;gap:10px!important;
  border:1px solid transparent!important;border-radius:8px!important;
  background:transparent!important;
  color:#8fa1a8!important;
  font-size:11px!important;font-weight:760!important;
  box-shadow:none!important;
  transition:background-color .14s ease,border-color .14s ease,color .14s ease,transform .14s ease!important;
}
.stakr-side-item:hover,.stakr-side-profile:hover{
  background:#0d222d!important;border-color:#203d48!important;color:#edf3f5!important;
  transform:none!important;
}
.stakr-side-item.active{
  background:#132b36!important;border-color:#294754!important;color:#f4f7f8!important;
}
.stakr-side-item.active .ui-icon{color:#dfE5e7!important}
.stakr-profile-avatar{
  width:29px!important;height:29px!important;flex:0 0 29px!important;
  border-radius:7px!important;background:#10252f!important;
  border:1px solid #2a4854!important;color:#e5ecef!important;
}
.stakr-profile-copy strong{font-size:10px!important}.stakr-profile-copy small{font-size:9px!important;color:#718790!important}
.main{
  margin-left:var(--wz-sidebar)!important;
  width:calc(100% - var(--wz-sidebar))!important;
  padding:calc(var(--wz-header) + 16px) 20px 48px!important;
}

/* ---- home layout ---- */
.ref-home-layout{grid-template-columns:minmax(0,1fr) 260px!important;gap:14px!important}
.ref-home-side{width:260px!important}
.ref-side-card,.ref-fair-card{
  background:var(--wz-surface)!important;
  border:1px solid var(--wz-line)!important;
  border-radius:10px!important;
  box-shadow:0 8px 24px rgba(0,0,0,.12)!important;
}
.ref-card-title{font-size:10px!important;color:#b7c5ca!important}
.ref-wallet-amount{font-size:24px!important;font-weight:900!important}
.ref-wallet-actions{gap:6px!important}
.ref-wallet-actions button{
  height:36px!important;min-height:36px!important;
  border-radius:8px!important;
  box-shadow:none!important;font-size:10px!important;
}
.ref-deposit-btn{background:var(--wz-accent)!important;border:1px solid var(--wz-accent-2)!important;color:#171b1d!important}
.ref-withdraw-btn{background:#102630!important;border:1px solid #294854!important;color:#dce5e8!important}

/* ---- hero: clean, still using the reference artwork ---- */
.ref-hero{
  height:300px!important;
  border-radius:11px!important;
  border:1px solid #23404b!important;
  background:#0b1d27!important;
  box-shadow:0 10px 30px rgba(0,0,0,.16)!important;
  overflow:hidden!important;
}
.ref-hero-image{filter:none!important;transform:none!important}
.ref-hero-shade{background:linear-gradient(90deg,rgba(4,12,17,.72) 0%,rgba(4,12,17,.42) 46%,rgba(4,12,17,.16) 100%)!important}
.ref-hero-copy{padding:30px 32px!important}
.ref-hero-copy .ref-hero-kicker{color:#d8b45b!important;letter-spacing:.12em!important}
.ref-hero-copy h1{font-size:38px!important;line-height:.98!important;color:#f4f6f7!important;letter-spacing:-.055em!important;text-shadow:none!important}
.ref-hero-copy h1 span{color:#dce3e6!important}
.ref-hero-copy p{font-size:12.5px!important;line-height:1.55!important;color:#b2c0c5!important;max-width:470px!important}
.ref-yellow-btn{
  height:42px!important;padding:0 15px!important;border-radius:8px!important;
  background:var(--wz-accent)!important;color:#171b1d!important;
  border:1px solid var(--wz-accent-2)!important;
  box-shadow:none!important;
  font-size:11px!important;font-weight:900!important;
}
.ref-yellow-btn:hover{background:#e0bf69!important;transform:none!important}
.ref-yellow-btn span{display:none!important}

/* ---- tabs / search / categories ---- */
.ref-mode-row{gap:8px!important}
.ref-mode-card{
  min-height:50px!important;border-radius:9px!important;
  background:#0b1d27!important;border:1px solid var(--wz-line)!important;
  box-shadow:none!important;
}
.ref-mode-card.active{border-color:#36535e!important;background:#102630!important}
.stakr-searchbar{
  min-height:44px!important;height:44px!important;
  background:#091922!important;border:1px solid #1e3944!important;
  border-radius:8px!important;box-shadow:none!important;
}
.stakr-searchbar input{font-size:11px!important;color:#eef4f6!important}
.stakr-searchbar kbd{background:#10232c!important;border:1px solid #294550!important;color:#7d9199!important}
.ref-category-row{gap:7px!important}
.ref-category{
  min-height:40px!important;
  border-radius:8px!important;
  background:#0b1d27!important;
  border:1px solid #1e3944!important;
  color:#83979f!important;
  box-shadow:none!important;
}
.ref-category:hover{background:#0e2530!important;border-color:#2b4b58!important;color:#dce4e7!important}
.ref-category.active{background:#132b36!important;border-color:#36525d!important;color:#f0f4f5!important}
.ref-category .ref-cat-icon{color:inherit!important}

/* ---- ticker ---- */
.stakr-live-strip{
  background:#0a1b24!important;border:1px solid #1d3944!important;
  border-radius:8px!important;box-shadow:none!important;
}
.stakr-live-pulse{background:var(--wz-green)!important;box-shadow:none!important}
.stakr-live-ticker strong{color:#bfd0d5!important}
.stakr-live-ticker em{color:#82979f!important}

/* ---- section headers ---- */
.ref-section-head{margin:20px 2px 10px!important}
.ref-section-head h2{
  font-size:15px!important;color:#eef3f5!important;
  font-weight:850!important;letter-spacing:-.02em!important;
}
.ref-section-head h2 .ui-icon{color:#aa8e4c!important}
.ref-section-head a{color:#8fa3aa!important;font-size:10px!important}
.ref-section-head a:hover{color:#d5dee2!important}

/* ---- GAME CARDS: keep old colorful art, neutral chrome ---- */
.ref-game-grid,.game-grid{
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:10px!important;
}
.ref-gcard,.gcard,.game-card{
  display:flex!important;flex-direction:column!important;
  overflow:hidden!important;min-width:0!important;
  border-radius:8px!important;
  background:#0b1d27!important;
  border:1px solid #1f3c47!important;
  box-shadow:none!important;
  transition:transform .14s ease,border-color .14s ease,background-color .14s ease!important;
}
.ref-gcard:hover,.gcard:hover,.game-card:hover{
  transform:translateY(-2px)!important;
  border-color:#335461!important;
  background:#0e2430!important;
  box-shadow:0 10px 24px rgba(0,0,0,.13)!important;
}
.ref-gcard-art,.gcard-art,.game-card-art{
  aspect-ratio:4/5!important;height:auto!important;min-height:0!important;
  background:#0a1921!important;overflow:hidden!important;
}
.ref-gcard-image,.gcard-image,.game-card img,.ref-gcard-art img{
  width:100%!important;height:100%!important;display:block!important;
  object-fit:cover!important;object-position:center!important;
  filter:none!important;opacity:1!important;visibility:visible!important;
  transform:none!important;
  transition:transform .16s ease!important;
}
.ref-gcard:hover .ref-gcard-image,.gcard:hover .gcard-image{transform:scale(1.02)!important}
.ref-gcard-shade,.ref-gcard-sheen,.gcard-hover,.ref-play-overlay{display:none!important}
.ref-card-badges{top:7px!important;left:7px!important}
.ref-card-badge{
  border-radius:5px!important;padding:3px 5px!important;
  font-size:7px!important;box-shadow:none!important;
}
.ref-card-badge.live{background:#357a60!important;color:#fff!important}
.ref-card-badge.hot{background:#765b31!important;color:#fff3cf!important}
.ref-card-badge.new{background:#355e73!important;color:#edf4f7!important}
.ref-gcard .gfav{
  width:28px!important;height:28px!important;
  right:7px!important;top:7px!important;
  border-radius:7px!important;
  background:rgba(6,17,23,.88)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  box-shadow:none!important;
}
.ref-gcard .gfav.fav{background:#d8b45b!important;color:#171b1d!important}
.ref-gcard-meta{
  min-height:60px!important;padding:9px 9px 10px!important;
  background:#0b1d27!important;
}
.ref-gcard-name{font-size:10px!important;font-weight:850!important;color:#eef3f5!important}
.ref-gcard-prov{font-size:8px!important;color:#748a93!important}
.ref-gcard-cat{
  background:#122a35!important;border:1px solid #294855!important;
  border-radius:5px!important;color:#9eb0b7!important;font-size:7px!important;
}

/* ---- keep old icon set: quiet, crisp, never oversized ---- */
.ui-icon,.v50-action-icon,.v52-icon,.v56-icon,.v57-icon{
  filter:none!important;box-shadow:none!important;text-shadow:none!important;
}
.ui-icon svg,.v50-action-icon svg,.v52-icon svg,.v56-icon svg,.v57-icon svg{
  filter:none!important;box-shadow:none!important;
}

/* ---- game pages ---- */
body.on-game .main{
  padding:74px 20px 42px!important;
}
body.on-game .game-view{max-width:1480px!important}
body.on-game .game-layout{
  grid-template-columns:minmax(0,1fr) 340px!important;
  gap:14px!important;
}
body.on-game .game-area{
  min-height:700px!important;
  border-radius:12px!important;
  border:1px solid #21414c!important;
  background:#071923!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
body.on-game .game-area:before,body.on-game .game-area:after,
body.on-game .v43-stage:before,body.on-game .v43-stage:after,
body.on-game .v42-stage:before,body.on-game .v42-stage:after{display:none!important}
body.on-game .game-topbar{
  min-height:62px!important;
  border-bottom:1px solid rgba(214,224,228,.08)!important;
}
body.on-game .game-top-title .gt-icon{
  background:#102630!important;border:1px solid #294853!important;box-shadow:none!important;
}
body.on-game .bet-panel{
  position:sticky!important;top:74px!important;
  background:#0b1d27!important;border:1px solid #203e49!important;
  border-radius:10px!important;box-shadow:none!important;padding:14px!important;
}
.bet-input-shell{
  height:46px!important;background:#081821!important;
  border:1px solid #24404b!important;border-radius:8px!important;box-shadow:none!important;
}
.bet-input-shell:focus-within,.bet-input:focus{border-color:#54798a!important;box-shadow:0 0 0 2px rgba(84,121,138,.14)!important}
.bet-actions{gap:5px!important}
.bet-actions button{
  height:32px!important;border-radius:7px!important;
  background:#102630!important;border:1px solid #274651!important;color:#c9d6da!important;
  box-shadow:none!important;
}
.bet-actions button:hover{background:#15303b!important}
.game-play-btn{
  height:50px!important;border-radius:8px!important;
  background:var(--wz-accent)!important;border:1px solid var(--wz-accent-2)!important;
  color:#181b1c!important;box-shadow:none!important;
}
.game-play-btn:hover{background:#e0bf69!important;transform:none!important}
.status-line{box-shadow:none!important;text-shadow:none!important}

/* ---- blackjack / table games ---- */
.table-felt,.baccarat-table{
  background:#126349!important;
  border:1px solid #3e806f!important;
  box-shadow:none!important;
}
.playing-card{
  box-shadow:0 8px 14px rgba(0,0,0,.18)!important;
  border:1px solid #d9e0e2!important;
}
.hidden-card{
  background:#254754!important;
  border-color:#4a6b76!important;
  box-shadow:none!important;
}
.bj-actions button,.roulette-choice{
  box-shadow:none!important;
  border-radius:8px!important;
}

/* ---- dice / crash / limbo / slots / mines ---- */
.dice-display,.limbo-display,.crash-display{
  text-shadow:none!important;
  filter:none!important;
}
.dice-display.win,.limbo-display.win,.crash-display.win{color:#78bea1!important}
.dice-display.lose,.limbo-display.lose,.crash-display.lose{color:#cf7d85!important}
.coin{
  box-shadow:inset 0 0 0 4px #dcae37!important;
}
.slot-machine{
  background:#0b1d27!important;border:1px solid #26434e!important;box-shadow:none!important;
}
.slot-reel{
  background:#f4f5f3!important;color:#17232a!important;
  border:1px solid #d6dedf!important;box-shadow:none!important;
}
.mines-grid .mine-tile{
  background:#102a35!important;border:1px solid #2c4d59!important;
  box-shadow:none!important;
}
.mines-grid .mine-tile:hover{background:#163541!important}
.plinko-canvas,.crash-canvas{
  background:#081922!important;border:1px solid #274650!important;box-shadow:none!important;
}

/* ---- modals / dropdowns ---- */
.dropdown,.command-palette,.modal>div,.settings-v45{
  background:#0b1d27!important;
  border:1px solid #294652!important;
  box-shadow:0 20px 50px rgba(0,0,0,.30)!important;
  backdrop-filter:none!important;
}
.modal{background:rgba(4,10,13,.70)!important;backdrop-filter:none!important}
.modal-content{box-shadow:none!important}

/* ---- remove motion/glow leftovers ---- */
*,*:before,*:after{
  text-shadow:none;
}
[class*="glow"],[class*="neon"]{
  box-shadow:none!important;text-shadow:none!important;filter:none!important;
}
