/* Exact Neon Poker v0.9.34 roulette presentation. Generic shared rules are isolated to .roulette-app. */
.roulette-app{
  --bg: #030807;
  --panel: rgba(8, 24, 20, 0.78);
  --panel-strong: rgba(5, 17, 14, 0.94);
  --felt: #063f2f;
  --felt-deep: #032a20;
  --gold: #f6c85f;
  --gold-2: #ffe6a1;
  --mint: #61f2b6;
  --cyan: #74eaff;
  --danger: #ff6b7c;
  --text: #f6fff9;
  --muted: #9fbab0;
  --line: rgba(255,255,255,.1);
  --shadow: 0 22px 60px rgba(0,0,0,.42);
  --radius: 22px;
}

.roulette-app *{ box-sizing: border-box; }

.roulette-app{ min-height: 100%; background: var(--bg); }

.roulette-app{
  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    radial-gradient(circle at 50% -10%, rgba(19,116,83,.35), transparent 40%),
    linear-gradient(135deg, #020605 0%, #07140f 48%, #020605 100%);
}

.roulette-app button{ font: inherit; }
.roulette-app button:focus-visible{ outline: 3px solid rgba(116,234,255,.8); outline-offset: 3px; }
.roulette-app button:disabled{ opacity: .36; cursor: not-allowed; transform: none !important; filter: grayscale(.25); }
.roulette-app .hidden{ display: none !important; }





.roulette-app .glass{
  background: linear-gradient(145deg, rgba(13,35,29,.84), rgba(4,15,12,.72));
  border: 1px solid rgba(255,255,255,.1);
  box-shadow: var(--shadow), inset 0 1px rgba(255,255,255,.05);
  backdrop-filter: blur(18px);
}

















.roulette-app.layout{
  width: min(1480px, calc(100% - 30px));
  margin: 16px auto 30px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 290px;
  gap: 16px;
  align-items: start;
}






.roulette-app .table-copy{
  position: absolute; left: 50%; transform: translateX(-50%);
  color: rgba(246,200,95,.4); font-size: 11px; letter-spacing: .28em;
  white-space: nowrap; z-index: 0;
}
.roulette-app .table-copy-top{ top: 48%; }


















































.roulette-app .control-deck{ margin-top: 12px; border-radius: var(--radius); padding: 14px; }

.roulette-app .control-title{ min-width: 145px; }
.roulette-app .control-title span{ display:block; font-weight:900; }
.roulette-app .control-title small{ display:block; margin-top:4px; color:var(--muted); font-size:11px; }
.roulette-app .chips{ display:flex; align-items:center; gap:8px; }
.roulette-app .chip{
  width: 52px; height: 52px; border-radius:50%; cursor:pointer;
  color:#fff; font-weight:900; border:4px dashed rgba(255,255,255,.7);
  box-shadow: 0 7px 14px rgba(0,0,0,.35), inset 0 0 0 4px rgba(0,0,0,.15);
  transition: .18s ease;
}
.roulette-app .chip:hover{ transform: translateY(-5px) rotate(-6deg); filter:brightness(1.15); }
.roulette-app .chip:active{ transform: translateY(-1px) scale(.96); }
.roulette-app .chip-5{ background:#26835d; }
.roulette-app .chip-10{ background:#1e71b9; }
.roulette-app .chip-25{ background:#a43d4d; }
.roulette-app .chip-50{ background:#6c45a6; }
.roulette-app .chip-100{ background:#242b31; }

.roulette-app .secondary-btn,
.roulette-app .primary-btn{
  border:1px solid var(--line); color:var(--text); cursor:pointer; transition:.2s ease;
}
.roulette-app .secondary-btn{ height:42px; min-width:42px; border-radius:12px; background:rgba(255,255,255,.05); font-weight:800; }
.roulette-app .secondary-btn.wide{ padding:0 12px; font-size:12px; }
.roulette-app .secondary-btn:hover{ background:rgba(255,255,255,.11); transform:translateY(-2px); }
.roulette-app .primary-btn{
  min-height:52px; border-radius:15px; padding:0 21px;
  background:linear-gradient(135deg, var(--gold-2), var(--gold));
  color:#191406; border-color:rgba(255,255,255,.35); font-weight:1000;
  box-shadow:0 10px 24px rgba(246,200,95,.18), inset 0 1px rgba(255,255,255,.6);
}
.roulette-app .primary-btn:hover{ transform:translateY(-3px); filter:brightness(1.07); box-shadow:0 14px 30px rgba(246,200,95,.26); }













.roulette-app .side-panel{ border-radius:var(--radius); overflow:hidden; position:sticky; top:16px; }
.roulette-app .panel-section{ padding:19px; border-bottom:1px solid var(--line); }
.roulette-app .panel-section:last-child{ border-bottom:0; }

.roulette-app .panel-section h2{ margin:0 0 14px; font-size:14px; letter-spacing:.06em; }






.roulette-app .rule-list{ list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.roulette-app .rule-list li{ display:flex; justify-content:space-between; align-items:center; font-size:12px; }
.roulette-app .rule-list li span{ color:var(--muted); }
.roulette-app .rule-list li strong{ color:var(--text); }
.roulette-app .tip-box{ display:flex; gap:12px; align-items:flex-start; background:linear-gradient(135deg, rgba(246,200,95,.08), transparent); }
.roulette-app .tip-box h2{ margin-bottom:4px; color:var(--gold-2); }
.roulette-app .tip-box p{ margin:0; color:var(--muted); font-size:12px; line-height:1.5; }
.roulette-app .tip-icon{ color:var(--gold); font-size:24px; }






























@keyframes rv34_dealCard{
  0% { opacity:0; translate:250px -230px; rotate:18deg; scale:.7; }
  75% { opacity:1; translate:-3px 5px; rotate:-2deg; scale:1.03; }
  100% { opacity:1; translate:0 0; rotate:0deg; scale:1; }
}
@keyframes rv34_flipCard{ 0% { transform:rotateY(180deg); } 100% { transform:rotateY(0); } }
@keyframes rv34_statusPulse{ 0%,100%{transform:scale(1)} 50%{transform:scale(1.06)} }
@keyframes rv34_fadeIn{ from{opacity:0} to{opacity:1} }
@keyframes rv34_modalIn{ from{opacity:0; transform:translateY(20px) scale(.94)} to{opacity:1; transform:none} }
@keyframes rv34_drift{ from{transform:translate3d(0,-20px,0) scale(.9)} to{transform:translate3d(30px,45px,0) scale(1.08)} }
@keyframes rv34_particleFly{ to { transform:translate(var(--tx), var(--ty)) rotate(var(--rot)); opacity:0; } }
@keyframes rv34_bankrollFlash{ 0%,100%{transform:scale(1)} 45%{transform:scale(1.13); color:var(--mint)} }
@keyframes rv34_shake{ 0%,100%{transform:translateX(0)} 25%{transform:translateX(-7px)} 75%{transform:translateX(7px)} }

@media (max-width: 1120px){
  .roulette-app.layout{ grid-template-columns:1fr; }
  .roulette-app .side-panel{ position:relative; top:auto; display:grid; grid-template-columns:1fr 1fr 1fr; }
  .roulette-app .panel-section{ border-bottom:0; border-right:1px solid var(--line); }
  .roulette-app .panel-section:last-child{ border-right:0; }
  
  .roulette-app .control-title{ width:100%; }
  
  
}

@media (max-width: 760px){
  
  
  
  
  .roulette-app.layout{ width:min(100% - 16px, 1480px); }
  
  
  
  
  
  
  
  .roulette-app .table-copy{ font-size:8px; }
  .roulette-app .chips{ width:100%; justify-content:center; flex-wrap:wrap; }
  .roulette-app .chip{ width:48px; height:48px; }
  
  
  
  .roulette-app .side-panel{ grid-template-columns:1fr; }
  .roulette-app .panel-section{ border-right:0; border-bottom:1px solid var(--line); }
  .roulette-app .panel-section:last-child{ border-bottom:0; }
}



@media (prefers-reduced-motion: reduce){
  .roulette-app *,
.roulette-app *::before,
.roulette-app *::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

































































@keyframes rv34_authPanelIn{ from { opacity: 0; transform: translateY(24px) scale(.96); } to { opacity: 1; transform: none; } }
@keyframes rv34_authFormIn{ from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: none; } }
@keyframes rv34_authHalo{ from { transform: translate(-50%, -50%) scale(.88); opacity: .65; } to { transform: translate(-50%, -50%) scale(1.12); opacity: 1; } }
@keyframes rv34_cardFloatOne{ 0%, 100% { transform: rotate(-14deg) translateY(0); } 50% { transform: rotate(-11deg) translateY(-13px); } }
@keyframes rv34_cardFloatTwo{ 0%, 100% { transform: rotate(12deg) translateY(0); } 50% { transform: rotate(9deg) translateY(10px); } }
































































































































@keyframes rv34_socialSlide{ from { opacity: 0; transform: translateX(40px); } to { opacity: 1; transform: none; } }
@keyframes rv34_multiplayerIn{ from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes rv34_turnPulse{ 0%,100% { box-shadow: 0 0 0 0 rgba(246,200,95,.15); } 50% { box-shadow: 0 0 0 8px rgba(246,200,95,0); } }










.roulette-app .mini-chip{
  width: 17px; height: 17px; display: inline-grid; place-items: center; flex: 0 0 auto;
  margin-right: 5px; border: 3px dashed rgba(255,255,255,.8); border-radius: 50%;
  background: radial-gradient(circle, #ffe69a 0 38%, #b97618 40% 60%, #f5c95f 62%);
  box-shadow: 0 2px 7px rgba(0,0,0,.35); vertical-align: -3px;
}




















.roulette-app .round-result-banner{
  position: absolute; z-index: 40; top: 42%; left: 50%; min-width: min(620px, 86%);
  padding: 19px 26px; border: 2px solid currentColor; border-radius: 18px;
  text-align: center; font-size: clamp(25px, 3vw, 44px); font-weight: 1000; letter-spacing: .035em;
  transform: translate(-50%, -50%); box-shadow: 0 18px 50px rgba(0,0,0,.5); backdrop-filter: blur(11px);
  animation: rv34_resultPop .4s cubic-bezier(.2,.8,.2,1) both, rv34_resultGlow 1.3s ease-in-out infinite alternate;
}



@keyframes rv34_resultPop{ from { opacity: 0; transform: translate(-50%,-50%) scale(.62) rotate(-2deg); } to { opacity: 1; transform: translate(-50%,-50%) scale(1); } }
@keyframes rv34_resultGlow{ to { box-shadow: 0 18px 58px currentColor; } }





















































@keyframes rv34_avatarTurn{ 50% { transform: translateY(-4px) scale(1.05); box-shadow: 0 0 0 7px rgba(246,200,95,.12), 0 10px 24px rgba(0,0,0,.42); } }





@keyframes rv34_giftBounce{ 50% { transform: translateY(-4px) rotate(4deg); } }














































































































@media (max-width: 760px){
  
  .roulette-app .round-result-banner{ top: 38%; min-width: 90%; padding: 13px 15px; font-size: 22px; }
  
  
  
  
  
  
  
  
  
  
  
  
}





.roulette-app .primary-btn,
.roulette-app .secondary-btn{
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
}
.roulette-app .primary-btn:active,
.roulette-app .secondary-btn:active{ transform: translateY(1px) scale(.98); }
.roulette-app .primary-btn:hover{ animation: rv34_buttonShimmer 1.4s ease infinite; }
@keyframes rv34_buttonShimmer{ 50% { filter: brightness(1.12) saturate(1.1); box-shadow: 0 14px 32px rgba(246,200,95,.3), inset 0 1px rgba(255,255,255,.7); } }













@keyframes rv34_softResultIn{ from { opacity: 0; transform: translateY(-8px); } to { opacity: .92; transform: none; } }











@keyframes rv34_shopRailIn{ from { transform: translateX(100%); opacity: .7; } to { transform: none; opacity: 1; } }






















@keyframes rv34_wheelSpin{ to { transform: rotate(1080deg); } }


@keyframes rv34_giftFly{ 70% { transform: translate(calc(var(--tx) - 50%), calc(var(--ty) - 80%)) scale(1.15) rotate(12deg); } 100% { transform: translate(calc(var(--tx) - 50%), calc(var(--ty) - 50%)) scale(.35) rotate(-10deg); opacity: 0; } }






@keyframes rv34_tableBurst{ to { opacity: 0; transform: translate(calc(-50% + var(--x)), calc(-50% + var(--y))) rotate(180deg) scale(2.2); } }













.roulette-app .round-result-banner{
  top: 18px;
  right: 18px;
  left: auto;
  min-width: 0;
  max-width: min(330px, calc(100% - 36px));
  padding: 9px 12px;
  border-width: 1px;
  border-radius: 12px;
  font-size: clamp(13px, 1.8vw, 17px);
  letter-spacing: 0;
  transform: none;
  text-align: left;
  box-shadow: 0 10px 24px rgba(0,0,0,.28);
  backdrop-filter: none;
  animation: rv34_softResultIn .22s ease both;
}






@keyframes rv34_dealCardSoft{
  0% { opacity: 0; translate: 130px -115px; rotate: 8deg; scale: .86; }
  72% { opacity: 1; translate: -6px 4px; rotate: -1deg; scale: 1.02; }
  100% { opacity: 1; translate: 0 0; rotate: 0deg; scale: 1; }
}

















@keyframes rv34_giftFloat{
  0%, 100% { transform: translateY(0) rotate(-2deg); }
  50% { transform: translateY(-7px) rotate(3deg); }
}

@keyframes rv34_avatarTurnSmooth{
  0%, 100% { transform: translateY(0) scale(1); box-shadow: 0 8px 19px rgba(0,0,0,.4); }
  50% { transform: translateY(-5px) scale(1.04); box-shadow: 0 0 0 7px rgba(246,200,95,.12), 0 10px 24px rgba(0,0,0,.42); }
}




@keyframes rv34_giftFlySoft{
  0% { transform: translate(-50%, -50%) scale(.82) rotate(-6deg); opacity: 0; }
  12% { opacity: 1; }
  72% { transform: translate(calc(var(--tx) - 50%), calc(var(--ty) - 92%)) scale(1.12) rotate(8deg); opacity: 1; }
  100% { transform: translate(calc(var(--tx) - 50%), calc(var(--ty) - 50%)) scale(.72) rotate(0); opacity: 0; }
}














@keyframes rv34_tableGlowSweep{
  0% { opacity: 0; transform: scale(.55); }
  35% { opacity: 1; transform: scale(1); }
  100% { opacity: 0; transform: scale(1.22); }
}
@keyframes rv34_spectacleItemLand{
  0% { opacity: 0; transform: translateY(-120px) scale(.6) rotate(-10deg); }
  28% { opacity: 1; transform: translateY(0) scale(1.08) rotate(3deg); }
  62% { transform: translateY(-12px) scale(1) rotate(-2deg); }
  100% { opacity: 0; transform: translateY(28px) scale(.92) rotate(0); }
}
@keyframes rv34_tableCardWave{
  0% { opacity: 0; transform: translateY(35px) rotate(-12deg); }
  35% { opacity: 1; transform: translateY(-70px) rotate(9deg); }
  100% { opacity: 0; transform: translateY(-118px) rotate(24deg); }
}
@keyframes rv34_tableChipJump{
  0% { opacity: 0; transform: translateY(18px) scale(.7); }
  34% { opacity: 1; transform: translateY(-38px) scale(1.08); }
  100% { opacity: 0; transform: translateY(14px) scale(.9); }
}
@keyframes rv34_feltLuxuryPulse{
  0%, 100% { filter: none; box-shadow: inset 0 0 90px rgba(0,0,0,.5), inset 0 0 0 2px rgba(154,255,213,.055); }
  45% { filter: saturate(1.25) brightness(1.12); box-shadow: inset 0 0 90px rgba(0,0,0,.38), inset 0 0 0 4px rgba(246,200,95,.35), 0 0 36px rgba(246,200,95,.22); }
}








@keyframes rv34_wheelIdle{ to { transform: rotate(360deg); } }
@keyframes rv34_wheelSpinHero{ to { transform: rotate(1740deg); } }








/* Codex pass 3: cleaner navigation, table chips, roulette, chat, admin inputs. */




.home-game-btn.roulette{
  background: linear-gradient(135deg, #12221b, #a32333 48%, #111 49%, #172b22);
  border-color: rgba(255,255,255,.22);
}

.roulette-app button,
.roulette-app .primary-btn,
.roulette-app .secondary-btn{
  letter-spacing: 0;
}
.roulette-app .primary-btn,
.roulette-app .secondary-btn{
  min-height: 42px;
  font-size: 13px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 12px 24px rgba(0,0,0,.22);
  transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
}
.roulette-app .primary-btn:hover,
.roulette-app .secondary-btn:hover{
  transform: translateY(-2px);
  filter: brightness(1.08);
}
.roulette-app .primary-btn:not(:disabled){
  animation: rv34_buttonBreath 3.8s ease-in-out infinite alternate;
}
@keyframes rv34_buttonBreath{
  from { box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 12px 24px rgba(0,0,0,.22), 0 0 0 rgba(246,200,95,0); }
  to { box-shadow: inset 0 1px 0 rgba(255,255,255,.24), 0 14px 30px rgba(0,0,0,.28), 0 0 18px rgba(246,200,95,.14); }
}










@keyframes rv34_chipSettle{
  from { opacity: 0; translate: 0 -18px; scale: .82; }
  to { opacity: 1; translate: 0 0; scale: 1; }
}

.roulette-felt > .round-result-banner{
  top: 46% !important;
  right: auto !important;
  left: 50% !important;
  max-width: min(360px, calc(100% - 48px));
  min-width: 0;
  padding: 10px 16px;
  border-radius: 14px;
  transform: translate(-50%, -50%) !important;
  text-align: center;
  animation: rv34_resultFadeCenter 1.45s ease both;
}
@keyframes rv34_resultFadeCenter{
  0% { opacity: 0; translate: 0 8px; scale: .96; }
  14%, 72% { opacity: 1; translate: 0 0; scale: 1; }
  100% { opacity: 0; translate: 0 -8px; scale: .98; }
}


@keyframes rv34_cardDealGlide{
  0% { opacity: 0; translate: 180px -135px; rotate: 14deg; scale: .76; filter: blur(2px) drop-shadow(0 16px 14px rgba(0,0,0,.32)); }
  42% { opacity: 1; translate: 26px -20px; rotate: -4deg; scale: 1.04; filter: blur(.3px) drop-shadow(0 16px 14px rgba(0,0,0,.28)); }
  76% { translate: -5px 4px; rotate: 1deg; scale: 1.01; }
  100% { opacity: 1; translate: 0 0; rotate: 0deg; scale: 1; filter: none; }
}

.roulette-app{
  align-items: start;
}
.roulette-shell{
  display: grid;
  gap: 14px;
  min-width: 0;
}
.roulette-table-rim{
  padding: 14px;
  border-radius: 38px;
  background: linear-gradient(145deg, #3a1117, #16100d 38%, #253126);
  box-shadow: 0 24px 70px rgba(0,0,0,.42), inset 0 0 0 2px rgba(255,255,255,.08);
}
.roulette-felt{
  position: relative;
  display: grid;
  grid-template-rows: auto 1fr auto auto;
  min-height: 560px;
  padding: 34px;
  overflow: hidden;
  border-radius: 30px;
  background:
    radial-gradient(circle at 50% 35%, rgba(246,200,95,.14), transparent 26%),
    radial-gradient(ellipse at 50% 50%, #0f5b3d 0 38%, #083624 70%, #062218 100%);
  box-shadow: inset 0 0 90px rgba(0,0,0,.48), inset 0 0 0 2px rgba(154,255,213,.08);
}
.roulette-stage{
  display: grid;
  place-items: center;
  min-height: 280px;
}
.roulette-wheel{
  position: relative;
  display: grid;
  place-items: center;
  width: min(270px, 54vw);
  aspect-ratio: 1;
  border: 14px solid #321418;
  border-radius: 50%;
  background:
    repeating-conic-gradient(from -5deg, #101010 0 9.72deg, #a51f30 9.72deg 19.45deg, #08683e 19.45deg 29.18deg),
    radial-gradient(circle, #f6c85f 0 8%, #25100f 9% 18%, transparent 19%);
  box-shadow: inset 0 0 0 12px rgba(255,255,255,.08), inset 0 0 34px rgba(0,0,0,.58), 0 18px 42px rgba(0,0,0,.36);
  animation: rv34_rouletteIdle 18s linear infinite;
}
.roulette-wheel.spinning{
  animation: rv34_rouletteSpin 3.05s cubic-bezier(.12,.72,.12,1) both;
}
.roulette-ring{
  position: absolute;
  inset: 17%;
  border: 2px solid rgba(246,200,95,.6);
  border-radius: 50%;
}
.roulette-ball{
  position: absolute;
  top: 13%;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fffdf0;
  box-shadow: 0 3px 10px rgba(0,0,0,.35);
  transform-origin: 50% 118px;
  animation: rv34_ballOrbit 2.2s linear infinite;
}
.roulette-number{
  display: grid;
  place-items: center;
  width: 82px;
  height: 82px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 50%;
  color: #fff7d0;
  background: rgba(7,13,10,.82);
  font-size: 34px;
}
.roulette-number[data-color="red"]{ color: #ff7887; }
.roulette-number[data-color="black"]{ color: #f4f0e8; }
.roulette-number[data-color="green"]{ color: #80ffd0; }
@keyframes rv34_rouletteIdle{ to { transform: rotate(360deg); } }
@keyframes rv34_rouletteSpin{ to { transform: rotate(var(--roulette-spin, 1800deg)); } }
@keyframes rv34_ballOrbit{ to { rotate: -360deg; } }
.roulette-board{
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 7px;
  position: relative;
  z-index: 9;
}
.roulette-cell{
  min-height: 48px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 10px;
  color: #f2fff9;
  background: rgba(255,255,255,.055);
  font-weight: 1000;
}
.roulette-cell.red{ background: linear-gradient(135deg, #7f1725, #bd2b40); }
.roulette-cell.black{ background: linear-gradient(135deg, #070908, #242424); }
.roulette-cell.zero{ background: linear-gradient(135deg, #075e3a, #16a36b); }
.roulette-cell.selected{
  outline: 2px solid rgba(246,200,95,.82);
  box-shadow: 0 0 0 4px rgba(246,200,95,.12), 0 12px 24px rgba(0,0,0,.26);
}
.roulette-status{
  margin: 10px 0 0;
  color: rgba(232,255,246,.82);
  text-align: center;
  font-weight: 800;
}
.roulette-controls{
  grid-template-columns: minmax(160px, .8fr) minmax(260px, 1.1fr) minmax(260px, 1.4fr);
}
.roulette-actions{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}



















@keyframes rv34_giftFloatSmooth{
  from { transform: translateY(0) rotate(-2deg); }
  to { transform: translateY(-8px) rotate(3deg); }
}











@keyframes rv34_wheelBreath{
  from { transform: scale(1); filter: brightness(1); }
  to { transform: scale(1.018); filter: brightness(1.08); }
}
@keyframes rv34_wheelLights{ to { rotate: 360deg; } }
@keyframes rv34_wheelSpinSmooth{ to { transform: rotate(1800deg); } }


@keyframes rv34_chipFlyToBankroll{
  0% { opacity: 0; transform: translate(-50%, -50%) scale(.72); }
  10% { opacity: 1; }
  58% { transform: translate(calc(var(--tx) * .54 - 50%), calc(var(--ty) * .46 + var(--arc) - 50%)) scale(1.05); }
  100% { opacity: 0; transform: translate(calc(var(--tx) - 50%), calc(var(--ty) - 50%)) scale(.58); }
}


























@keyframes rv34_dragonOrbitTable{
  0% { opacity: 0; transform: translate(-280px, 70px) scale(.5) rotate(-18deg); }
  14% { opacity: 1; transform: translate(-210px, -90px) scale(.82) rotate(8deg); }
  38% { transform: translate(210px, -100px) scale(1) rotate(16deg); }
  62% { transform: translate(245px, 70px) scale(1.08) rotate(-8deg); }
  82% { opacity: 1; transform: translate(-120px, 118px) scale(.98) rotate(-18deg); }
  100% { opacity: 0; transform: translate(-280px, 70px) scale(.72) rotate(-22deg); }
}









@media (max-width: 920px){
  .roulette-board,
.roulette-actions,
.roulette-controls{
    grid-template-columns: 1fr;
  }
  .roulette-felt{
    min-height: 620px;
    padding: 24px 16px;
  }
  
}










@keyframes rv34_cardDealStable{
  0% {
    opacity: 0;
    filter: blur(3px) brightness(1.22);
    transform: translate3d(132px,-108px,0) rotateZ(9deg) rotateY(var(--card-face-rotation)) scale(.82);
  }
  46% {
    opacity: 1;
    filter: blur(.45px) brightness(1.08);
    transform: translate3d(18px,-14px,0) rotateZ(-2.2deg) rotateY(var(--card-face-rotation)) scale(1.035);
  }
  76% {
    opacity: 1;
    filter: blur(0) brightness(1.02);
    transform: translate3d(-4px,3px,0) rotateZ(.7deg) rotateY(var(--card-face-rotation)) scale(1.012);
  }
  100% {
    opacity: 1;
    filter: none;
    transform: translate3d(0,0,0) rotateZ(0) rotateY(var(--card-face-rotation)) scale(1);
  }
}
@keyframes rv34_cardRevealStable{
  0% { transform: rotateY(180deg) scale(.98); }
  55% { transform: rotateY(88deg) scale(1.015); }
  100% { transform: rotateY(0deg) scale(1); }
}





@keyframes rv34_chipPlaceStable{
  from {
    opacity: 0;
    transform: translate(-50%, -18px) scale(.9);
  }
  to {
    opacity: 1;
    transform: translate(-50%, 0) scale(1);
  }
}
























































/* Roulette schon auf der Spielauswahl klar als Beta kennzeichnen. */
#playRouletteButton{
  position: relative;
  overflow: visible;
}
#playRouletteButton .game-beta-badge{
  position: absolute;
  left: 50%;
  top: -11px;
  transform: translateX(-50%);
  padding: 3px 8px;
  border-radius: 999px;
  color: #171006;
  background: linear-gradient(135deg, #fff2b8, #f6c85f);
  box-shadow: 0 6px 15px rgba(0,0,0,.28);
  font-size: 8px;
  font-weight: 1000;
  letter-spacing: .14em;
  line-height: 1.2;
}













@keyframes rv34_cardDealBackStable{
  0% {
    opacity: 0;
    filter: blur(3px) brightness(1.2);
    transform: translate3d(132px,-108px,0) rotateZ(9deg) scale(.82);
  }
  46% {
    opacity: 1;
    filter: blur(.45px) brightness(1.08);
    transform: translate3d(18px,-14px,0) rotateZ(-2.2deg) scale(1.035);
  }
  76% {
    opacity: 1;
    filter: blur(0) brightness(1.02);
    transform: translate3d(-4px,3px,0) rotateZ(.7deg) scale(1.012);
  }
  100% {
    opacity: 1;
    filter: none;
    transform: translate3d(0,0,0) rotateZ(0) scale(1);
  }
}










































.roulette-app{
  touch-action: manipulation;
  -webkit-text-size-adjust: 100%;
}
.roulette-app button{
  touch-action: manipulation;
}
















































@keyframes rv34_insuranceCompactIn{
  from { opacity: 0; transform: translateY(8px) scale(.98); }
  to { opacity: 1; transform: none; }
}

































@keyframes rv34_dailyWheelResultSpin{
  0% { transform: rotate(0deg) scale(1); filter: brightness(1); }
  76% { filter: brightness(1.18); }
  92% { transform: rotate(calc(var(--daily-wheel-spin, 2160deg) - 4deg)) scale(1.018); }
  100% { transform: rotate(var(--daily-wheel-spin, 2160deg)) scale(1); filter: brightness(1.08); }
}
@keyframes rv34_wheelBreathV6{
  from { transform: scale(1); filter: brightness(1); }
  to { transform: scale(1.012); filter: brightness(1.07); }
}























































@keyframes rv34_spectacleVignette{
  0%,100% { opacity: 0; }
  14%,78% { opacity: 1; }
}
@keyframes rv34_spectacleRays{
  0% { opacity: 0; transform: translate(-50%,-50%) scale(.28) rotate(-40deg); }
  26% { opacity: .9; }
  76% { opacity: .62; }
  100% { opacity: 0; transform: translate(-50%,-50%) scale(1.2) rotate(100deg); }
}
@keyframes rv34_spectacleHalo{
  0% { opacity: 0; transform: translate(-50%,-50%) scale(.15) rotate(-30deg); }
  28% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%,-50%) scale(1.35) rotate(110deg); }
}
@keyframes rv34_spectacleCoreGlow{
  from { transform: scale(.9); opacity: .7; }
  to { transform: scale(1.12); opacity: 1; }
}
@keyframes rv34_spectacleHero{
  0% { opacity: 0; transform: translateY(-115px) scale(.45) rotate(-16deg); }
  23% { opacity: 1; transform: translateY(5px) scale(1.18) rotate(5deg); }
  42% { transform: translateY(-12px) scale(.98) rotate(-3deg); }
  60% { transform: translateY(0) scale(1.06) rotate(2deg); }
  82% { opacity: 1; transform: translateY(-4px) scale(1); }
  100% { opacity: 0; transform: translateY(35px) scale(.78) rotate(0); }
}
@keyframes rv34_spectaclePedestal{
  0% { opacity: 0; transform: translate(-50%,74px) scale(.25); }
  28%,76% { opacity: 1; transform: translate(-50%,74px) scale(1); }
  100% { opacity: 0; transform: translate(-50%,74px) scale(1.3); }
}
@keyframes rv34_spectacleSpark{
  0% { opacity: 0; transform: rotate(var(--angle)) translateX(20px) scale(.25); }
  22% { opacity: 1; }
  100% { opacity: 0; transform: rotate(var(--angle)) translateX(195px) scale(1.35); }
}
@keyframes rv34_spectacleCardOrbit{
  0% { opacity: 0; transform: rotate(calc(var(--i) * 45deg)) translateY(-25px) scale(.35); }
  28% { opacity: 1; }
  74% { opacity: .95; }
  100% { opacity: 0; transform: rotate(calc(var(--i) * 45deg + 145deg)) translateY(-175px) scale(.9); }
}
@keyframes rv34_spectacleChipOrbit{
  0% { opacity: 0; transform: rotate(calc(var(--i) * 30deg)) translateY(-12px) scale(.45); }
  24% { opacity: 1; }
  100% { opacity: 0; transform: rotate(calc(var(--i) * 30deg - 120deg)) translateY(-148px) scale(1.05); }
}

@keyframes rv34_feltLuxuryPulseV6{
  0%,100% { filter: none; }
  24% { filter: brightness(1.18) saturate(1.18); }
  48% { filter: brightness(.96) saturate(1.3); }
  72% { filter: brightness(1.12); }
}




@media (max-width: 760px){
  .roulette-app,
.roulette-app{
    touch-action: pan-x pan-y !important;
    overscroll-behavior-x: none;
  }
  .roulette-app button{
    touch-action: manipulation !important;
  }

  
  
  
  
  
  
  
  
  
  
  
  
  

  
  
  

  
  
  
  
  
  
  

  
  
  

  
}















































































/* Roulette-Startbutton mit gut lesbarem Kontrast. */
#playRouletteButton.roulette{
  color: #ffffff !important;
  background:
    linear-gradient(135deg, #922f75 0%, #5d2d92 52%, #1f5fa8 100%) !important;
  border: 1px solid rgba(255,255,255,.24) !important;
  box-shadow: 0 14px 30px rgba(67,30,113,.32) !important;
}
#playRouletteButton.roulette span{
  color: #ffffff !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.45);
}
#playRouletteButton.roulette .game-beta-badge{
  color: #201004 !important;
  background: linear-gradient(135deg, #fff4b7, #ffbd45) !important;
}



























































.roulette-app{
  --mobile-gap: 10px;
}


.roulette-app .tip-icon{
  animation: rv34_iconFloatV10 3.8s ease-in-out infinite alternate both !important;
  transform-origin: center;
}


@keyframes rv34_iconFloatV10{
  from { filter: brightness(1); scale: 1; rotate: -1deg; }
  to { filter: brightness(1.12); scale: 1.035; rotate: 1deg; }
}
@keyframes rv34_giftFloatV10{
  from { transform: translateY(1px) rotate(-3deg); filter: brightness(.96); }
  to { transform: translateY(-5px) rotate(4deg); filter: brightness(1.16); }
}
@keyframes rv34_gameButtonGlowV10{
  from { box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 12px 24px rgba(0,0,0,.22), 0 0 0 rgba(246,200,95,0); }
  to { box-shadow: inset 0 1px 0 rgba(255,255,255,.24), 0 16px 34px rgba(0,0,0,.3), 0 0 22px rgba(246,200,95,.17); }
}

















































































@keyframes rv34_reelFlowV10{
  0% { transform: translateY(-45%) scale(.82); opacity: .35; }
  50% { transform: translateY(0) scale(1); opacity: 1; }
  100% { transform: translateY(45%) scale(.82); opacity: .35; }
}










@media (max-width: 760px){
  .roulette-app,
.roulette-app{
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important;
  }
  .roulette-app{
    padding: 0 8px 86px !important;
  }
  .roulette-app button{
    font-size: 16px;
  }

  
  
  
  
  
  
  
  
  
  
  
  
  

  .roulette-app.layout{
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
  }
  
  
  
  

  .roulette-shell,
.roulette-app .side-panel{
    width: 100% !important;
    min-width: 0 !important;
  }
  .roulette-app .side-panel{
    margin-top: 12px !important;
  }
  .roulette-app .control-deck,
.roulette-controls{
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    padding: 12px !important;
  }
  .roulette-actions{
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }
  .roulette-app .chips{
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(5,minmax(0,1fr)) !important;
    gap: 5px !important;
  }
  
  .roulette-app .chip{
    width: 100% !important;
    min-width: 0 !important;
  }
  
  

  
  
  
  

  
  

  
  
  

  

  
  
  
  

  
  
  
  
  
  
  

  
  
  
  
  

  

  
  
}


@media (max-width: 390px){
  
  
  
  .roulette-app .chips{
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  }
}
















@keyframes rv34_chipPlaceStable{
  from, to {
    opacity: 1;
    transform: translateX(-50%);
  }
}




















/* Slots heißt sichtbar nur „Slots“ und trägt dasselbe Beta-Abzeichen wie Roulette. */















@keyframes rv34_luxuryShockwave{
  0% { opacity: 0; transform: translate(-50%, -50%) scale(.08); }
  18% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(1.28); }
}
@keyframes rv34_luxuryComet{
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) rotate(calc(var(--i) * 30deg)) translateY(-55px) scaleY(.3);
  }
  22% { opacity: 1; }
  78% { opacity: .85; }
  100% {
    opacity: 0;
    transform: translate(-50%, -50%) rotate(calc(var(--i) * 30deg + 100deg)) translateY(-240px) scaleY(1.2);
  }
}
@keyframes rv34_luxuryCrown{
  from { opacity: .45; transform: translate(-50%, -139px) scale(.94) rotate(-3deg); }
  to { opacity: 1; transform: translate(-50%, -151px) scale(1.08) rotate(3deg); }
}

























/* Roulette und Slots verwenden exakt dasselbe Beta-Abzeichen. */
#playRouletteButton{
  position: relative !important;
  overflow: visible !important;
}
#playRouletteButton .game-beta-badge{
  position: absolute !important;
  left: 50% !important;
  top: -11px !important;
  transform: translateX(-50%) !important;
  padding: 3px 8px !important;
  border: 0 !important;
  border-radius: 999px !important;
  color: #201004 !important;
  background: linear-gradient(135deg, #fff4b7, #ffbd45) !important;
  box-shadow: 0 6px 15px rgba(0,0,0,.28) !important;
  font-size: 8px !important;
  font-weight: 1000 !important;
  letter-spacing: .14em !important;
  line-height: 1.2 !important;
}
















@keyframes rv34_dragonTableFlight{
  0% {
    opacity: 0;
    transform: translate(-430px, -170px) scale(.45) rotate(-12deg);
  }
  8% {
    opacity: 1;
  }
  20% {
    transform: translate(160px, -145px) scale(.88) rotate(7deg);
  }
  36% {
    transform: translate(330px, 20px) scale(1.04) rotate(14deg);
  }
  52% {
    transform: translate(30px, 120px) scale(1.18) rotate(-6deg);
  }
  68% {
    transform: translate(-340px, 45px) scale(.98) rotate(-14deg) scaleX(-1);
  }
  82% {
    transform: translate(-120px, -105px) scale(1.08) rotate(5deg) scaleX(-1);
  }
  94% {
    opacity: 1;
    transform: translate(260px, -55px) scale(.82) rotate(10deg);
  }
  100% {
    opacity: 0;
    transform: translate(460px, -190px) scale(.42) rotate(18deg);
  }
}
@keyframes rv34_dragonWingBeat{
  from { transform: translateY(3px) rotate(-2deg) scaleY(.94); }
  to { transform: translateY(-4px) rotate(2deg) scaleY(1.06); }
}
@keyframes rv34_dragonBreath{
  from { opacity: .65; transform: scale(.78) rotate(-4deg); }
  to { opacity: 1; transform: scale(1.18) rotate(5deg); }
}
@keyframes rv34_dragonTrail{
  0% {
    opacity: .95;
    transform: translate(0,0) scale(1);
  }
  100% {
    opacity: 0;
    transform: translate(-105px, 22px) scale(.12);
  }
}
@keyframes rv34_dragonSkyPulse{
  from { opacity: .45; filter: saturate(.9); }
  to { opacity: 1; filter: saturate(1.35); }
}
@keyframes rv34_groundFireRise{
  0%,100% { opacity: 0; transform: translateY(10px) scale(.55); }
  30%,72% { opacity: .9; transform: translateY(-8px) scale(1.08); }
}


@media (max-width: 760px){
  
  
  
  
  
  
  @keyframes rv34_dragonTableFlight{
    0% { opacity: 0; transform: translate(-220px,-115px) scale(.4) rotate(-12deg); }
    10% { opacity: 1; }
    25% { transform: translate(75px,-100px) scale(.78) rotate(7deg); }
    43% { transform: translate(145px,5px) scale(.94) rotate(13deg); }
    60% { transform: translate(5px,75px) scale(1.02) rotate(-5deg); }
    76% { transform: translate(-150px,20px) scale(.86) rotate(-13deg) scaleX(-1); }
    92% { opacity: 1; transform: translate(100px,-55px) scale(.7) rotate(9deg); }
    100% { opacity: 0; transform: translate(230px,-120px) scale(.35) rotate(17deg); }
  }
}













































































@keyframes rv34_luxuryCurtainV13{
  0%,100% { opacity: 0; }
  12%,84% { opacity: 1; }
}
@keyframes rv34_luxuryRaysV13{
  0% { opacity: 0; transform: translate(-50%,-50%) rotate(-35deg) scale(.5); }
  16% { opacity: 1; }
  86% { opacity: .7; }
  100% { opacity: 0; transform: translate(-50%,-50%) rotate(150deg) scale(1.25); }
}
@keyframes rv34_luxuryRingV13{
  0% { opacity: 0; transform: scale(.15); }
  22% { opacity: 1; }
  100% { opacity: 0; transform: scale(5); }
}
@keyframes rv34_luxuryParticleV13{
  0% { opacity: 0; transform: rotate(var(--a)) translateX(20px) scale(.2); }
  22% { opacity: 1; }
  100% { opacity: 0; transform: rotate(var(--a)) translateX(310px) scale(1.2); }
}
@keyframes rv34_luxuryStarV13{
  0%,100% { opacity: 0; }
  30%,70% { opacity: 1; }
  100% { transform: rotate(var(--a)) translateX(290px) rotate(180deg); }
}
@keyframes rv34_luxuryTitleV13{
  from { opacity: 0; transform: translate(-50%,20px) scale(.8); }
  to { opacity: 1; transform: translate(-50%,0) scale(1); }
}
@keyframes rv34_dragonFullTableV13{
  0% { opacity: 0; transform: translate(-520px,-170px) scale(.4) rotate(-12deg); }
  7% { opacity: 1; }
  20% { transform: translate(180px,-150px) scale(.92) rotate(7deg); }
  34% { transform: translate(430px,5px) scale(1.12) rotate(15deg); }
  48% { transform: translate(70px,135px) scale(1.28) rotate(-5deg); }
  62% { transform: translate(-450px,60px) scale(1.05) rotate(-15deg) scaleX(-1); }
  76% { transform: translate(-80px,-125px) scale(1.18) rotate(6deg) scaleX(-1); }
  91% { opacity: 1; transform: translate(360px,-45px) scale(.85) rotate(11deg); }
  100% { opacity: 0; transform: translate(560px,-190px) scale(.38) rotate(18deg); }
}
@keyframes rv34_dragonBeatV13{
  from { transform: translateY(4px) rotate(-2deg) scaleY(.94); }
  to { transform: translateY(-5px) rotate(2deg) scaleY(1.07); }
}
@keyframes rv34_dragonBreathV13{
  from { opacity: .55; transform: scaleX(.65) scaleY(.8); }
  to { opacity: 1; transform: scaleX(1.3) scaleY(1.12); }
}
@keyframes rv34_dragonTrailV13{
  0% { opacity: 1; transform: translate(0,0) scale(1); }
  100% { opacity: 0; transform: translate(-125px,28px) scale(.1); }
}
@keyframes rv34_dragonGroundV13{
  0%,100% { opacity: 0; transform: translateY(14px) scale(.55); }
  32%,72% { opacity: 1; transform: translateY(-8px) scale(1.08); }
}
@keyframes rv34_fireworkBloomV13{
  0%,100% { opacity: 0; transform: scale(.3); }
  20%,72% { opacity: 1; transform: scale(1); }
}
@keyframes rv34_fireworkRayV13{
  0% { opacity: 0; height: 8px; }
  25% { opacity: 1; height: 58px; }
  100% { opacity: 0; height: 84px; transform: rotate(calc(var(--j) * 20deg)) translateY(-82px); }
}
@keyframes rv34_heroPulseV13{
  from { transform: translate(-50%,-50%) scale(.86) rotate(-3deg); }
  to { transform: translate(-50%,-50%) scale(1.13) rotate(3deg); }
}
@keyframes rv34_explosionRingV13{
  0% { opacity: 1; transform: translate(-50%,-50%) scale(.2); }
  100% { opacity: 0; transform: translate(-50%,-50%) scale(5.4); }
}
@keyframes rv34_rainV13{
  from { transform: translateY(-25px) rotate(0deg); opacity: 0; }
  12% { opacity: 1; }
  to { transform: translateY(560px) rotate(540deg); opacity: 0; }
}


@media (max-width: 760px){
  
  
  
  
  
  
  
  
  
  @keyframes rv34_dragonFullTableV13{
    0% { opacity: 0; transform: translate(-250px,-100px) scale(.35) rotate(-12deg); }
    8% { opacity: 1; }
    24% { transform: translate(85px,-95px) scale(.8) rotate(7deg); }
    42% { transform: translate(175px,5px) scale(.95) rotate(14deg); }
    58% { transform: translate(10px,80px) scale(1.02) rotate(-5deg); }
    74% { transform: translate(-180px,25px) scale(.85) rotate(-14deg) scaleX(-1); }
    90% { opacity: 1; transform: translate(130px,-50px) scale(.7) rotate(10deg); }
    100% { opacity: 0; transform: translate(260px,-110px) scale(.3) rotate(18deg); }
  }
}




























@keyframes rv34_spectacleVignette{
  0%,100% { opacity: 0; }
  14%,78% { opacity: 1; }
}
@keyframes rv34_spectacleRays{
  0% { opacity: 0; transform: translate(-50%,-50%) scale(.28) rotate(-40deg); }
  26% { opacity: .9; }
  76% { opacity: .62; }
  100% { opacity: 0; transform: translate(-50%,-50%) scale(1.2) rotate(100deg); }
}
@keyframes rv34_spectacleHalo{
  0% { opacity: 0; transform: translate(-50%,-50%) scale(.15) rotate(-30deg); }
  28% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%,-50%) scale(1.35) rotate(110deg); }
}
@keyframes rv34_spectacleCoreGlow{
  from { transform: scale(.9); opacity: .7; }
  to { transform: scale(1.12); opacity: 1; }
}
@keyframes rv34_spectacleHero{
  0% { opacity: 0; transform: translateY(-115px) scale(.45) rotate(-16deg); }
  23% { opacity: 1; transform: translateY(5px) scale(1.18) rotate(5deg); }
  42% { transform: translateY(-12px) scale(.98) rotate(-3deg); }
  60% { transform: translateY(0) scale(1.06) rotate(2deg); }
  82% { opacity: 1; transform: translateY(-4px) scale(1); }
  100% { opacity: 0; transform: translateY(35px) scale(.78) rotate(0); }
}
@keyframes rv34_spectaclePedestal{
  0% { opacity: 0; transform: translate(-50%,74px) scale(.25); }
  28%,76% { opacity: 1; transform: translate(-50%,74px) scale(1); }
  100% { opacity: 0; transform: translate(-50%,74px) scale(1.3); }
}
@keyframes rv34_spectacleSpark{
  0% { opacity: 0; transform: rotate(var(--angle)) translateX(20px) scale(.25); }
  22% { opacity: 1; }
  100% { opacity: 0; transform: rotate(var(--angle)) translateX(195px) scale(1.35); }
}
@keyframes rv34_spectacleCardOrbit{
  0% { opacity: 0; transform: rotate(calc(var(--i) * 45deg)) translateY(-25px) scale(.35); }
  28% { opacity: 1; }
  74% { opacity: .95; }
  100% { opacity: 0; transform: rotate(calc(var(--i) * 45deg + 145deg)) translateY(-175px) scale(.9); }
}
@keyframes rv34_spectacleChipOrbit{
  0% { opacity: 0; transform: rotate(calc(var(--i) * 30deg)) translateY(-12px) scale(.45); }
  24% { opacity: 1; }
  100% { opacity: 0; transform: rotate(calc(var(--i) * 30deg - 120deg)) translateY(-148px) scale(1.05); }
}

@keyframes rv34_feltLuxuryPulseV6{
  0%,100% { filter: none; }
  24% { filter: brightness(1.18) saturate(1.18); }
  48% { filter: brightness(.96) saturate(1.3); }
  72% { filter: brightness(1.12); }
}









































































































































@keyframes rv34_diamondHeroV22{
  0% { opacity: 0; transform: translate(-50%, -20%) scale(.15) rotate(-28deg); }
  17% { opacity: 1; transform: translate(-50%, -50%) scale(1.16) rotate(7deg); }
  29% { transform: translate(-50%, -50%) scale(.96) rotate(-3deg); }
  75% { opacity: 1; transform: translate(-50%, -52%) scale(1.04) rotate(2deg); }
  100% { opacity: 0; transform: translate(-50%, -75%) scale(.72) rotate(18deg); }
}
@keyframes rv34_diamondFloatV22{
  from { transform: translateY(5px) rotate(-3deg); filter: drop-shadow(0 24px 22px rgba(0,0,0,.58)) drop-shadow(0 0 24px #8be7ff); }
  to { transform: translateY(-8px) rotate(3deg); filter: drop-shadow(0 34px 28px rgba(0,0,0,.48)) drop-shadow(0 0 42px #e6fbff); }
}
@keyframes rv34_diamondBeamV22{
  from { opacity: .36; transform: translateX(-50%) rotate(-5deg) scaleX(.8); }
  to { opacity: .9; transform: translateX(-50%) rotate(5deg) scaleX(1.16); }
}
@keyframes rv34_diamondOrbitV22{
  from { transform: rotate(calc(var(--i) * 20deg)) translateX(74px) rotate(0deg) scale(.6); opacity: .2; }
  25% { opacity: 1; }
  50% { transform: rotate(calc(var(--i) * 20deg + 180deg)) translateX(clamp(125px, 24vw, 260px)) rotate(-180deg) scale(1.18); opacity: 1; }
  to { transform: rotate(calc(var(--i) * 20deg + 360deg)) translateX(74px) rotate(-360deg) scale(.6); opacity: .2; }
}
@keyframes rv34_throneRiseV22{
  0% { opacity: 0; transform: translate(-50%, 78%) scale(.42); }
  19% { opacity: 1; transform: translate(-50%, -58%) scale(1.18); }
  33% { transform: translate(-50%, -47%) scale(.96); }
  76% { opacity: 1; transform: translate(-50%, -51%) scale(1.05); }
  100% { opacity: 0; transform: translate(-50%, -86%) scale(.78); }
}
@keyframes rv34_thronePulseV22{
  from { transform: translateY(3px) scale(.97); filter: drop-shadow(0 25px 24px rgba(0,0,0,.62)) drop-shadow(0 0 25px rgba(255,193,44,.56)); }
  to { transform: translateY(-5px) scale(1.06); filter: drop-shadow(0 35px 26px rgba(0,0,0,.52)) drop-shadow(0 0 48px rgba(255,227,105,.9)); }
}
@keyframes rv34_thronePlatformV22{
  from { opacity: .52; transform: translateX(-50%) scale(.78); }
  to { opacity: 1; transform: translateX(-50%) scale(1.1); }
}
@keyframes rv34_throneCrownOrbitV22{
  from { transform: rotate(calc(var(--i) * 36deg)) translateX(82px) rotate(0deg) scale(.65); opacity: .2; }
  30%,70% { opacity: 1; }
  to { transform: rotate(calc(var(--i) * 36deg + 360deg)) translateX(clamp(130px, 25vw, 270px)) rotate(-360deg) scale(1.08); opacity: .1; }
}



















































































@keyframes rv34_pokerTurnPulse{
  0%, 100% { filter: brightness(1); }
  50% { filter: brightness(1.18); }
}











































@keyframes rv34_pokerCardDeal{
  from { opacity: 0; transform: translate3d(0, -60px, 0) rotate(-12deg) scale(.72); filter: blur(2px); }
  to { opacity: 1; filter: blur(0); }
}























































































@keyframes rv34_pokerLuxuryFloat{
  to { transform: translateY(-16px) rotate(3deg) scale(1.05); }
}

@keyframes rv34_pokerDragonFlight{
  0% { transform: translate(-120%, 45%) scale(.3) rotate(-14deg); opacity: 0; }
  20% { opacity: 1; }
  52% { transform: translate(0, -5%) scale(1.1) rotate(4deg); opacity: 1; }
  100% { transform: translate(125%, -48%) scale(.45) rotate(13deg); opacity: 0; }
}
































@keyframes rv34_matchmakingRadar{ to { transform: rotate(360deg); } }
@keyframes rv34_matchmakingDots{
  from { opacity: .35; transform: translateX(0); }
  to { opacity: 1; transform: translateX(-8px); }
}






















@keyframes rv34_pokerCardDealV26{
  0% {
    opacity: 0;
    transform: translate3d(var(--poker-deal-x, 0), var(--poker-deal-y, -120px), 0)
      rotate(var(--poker-deal-r, -8deg)) scale(.72);
    filter: blur(2.5px) brightness(1.25);
  }
  70% {
    opacity: 1;
    filter: blur(0) brightness(1.08);
  }
  100% {
    opacity: 1;
    transform: translate3d(0,0,0) rotate(0deg) scale(1);
    filter: blur(0) brightness(1);
  }
}

































@keyframes rv34_pokerCallPulse{
  to { border-color: rgba(255,211,109,.72); box-shadow: inset 4px 0 0 #ffd46c, 0 0 28px rgba(255,157,35,.18); }
}









@keyframes rv34_pokerTimerUrgent{ to { transform: translateY(-50%) scale(1.08); } }

@keyframes rv34_pokerActionTimerUrgent{ to { transform: scale(1.08); } }




































.roulette-app .chip-500{ background: linear-gradient(145deg, #8d5a12, #d69a28); }
.roulette-app .chip-1000{ background: linear-gradient(145deg, #2a4165, #3d72ba); }
.roulette-app .chip-2500{ background: linear-gradient(145deg, #5b225f, #a342ac); }
















@keyframes rv34_seatInviteFocusV27{
  50% { box-shadow: 0 0 0 2px rgba(85,255,202,.36), 0 0 34px rgba(48,255,190,.22); border-color: rgba(85,255,202,.65); }
}




.roulette-app .chips{ flex-wrap: wrap; }
.roulette-app .chip-1000,
.roulette-app .chip-2500{ font-size: .68rem; }














































@keyframes rv34_wheelWinnerPopV28{
  0% { scale: 1; filter: brightness(1); }
  30% { scale: 1.65; filter: brightness(1.9) drop-shadow(0 0 12px #ffe277); }
  62% { scale: 1.38; filter: brightness(1.55) drop-shadow(0 0 8px #ffe277); }
  100% { scale: 1.22; filter: brightness(1.28); }
}


.roulette-app .chip-5000{ background: linear-gradient(145deg, #111, #454545); border-color: #fff1a5 !important; box-shadow: inset 0 0 0 4px #191919, inset 0 0 0 7px #e7c763, 0 5px 14px rgba(0,0,0,.35); }











.roulette-app .chip-5000{ font-size: .61rem; }




























@keyframes rv34_pokerWinnerGlowV28{ to { filter: brightness(1.25); transform: translateY(-2px) scale(1.025); } }








/* =========================================================
   V29 · EINHEITLICHE SPIELANSICHTEN, POKER & ROULETTE-TISCH
   ========================================================= */












body.developer-mode > .roulette-app{ display: none !important; }












@keyframes rv34_wheelSectorLiftV29{
  0% { transform: translateX(-50%) translateY(0) translateZ(0) scale(.96); filter: brightness(1); box-shadow: 0 0 0 rgba(255,217,87,0); }
  38% { transform: translateX(-50%) translateY(-10px) translateZ(55px) scale(1.12); filter: brightness(1.22); box-shadow: 0 24px 32px rgba(0,0,0,.5), 0 0 32px rgba(255,213,78,.82), inset 0 0 0 2px rgba(255,255,255,.72); }
  72% { transform: translateX(-50%) translateY(-6px) translateZ(30px) scale(1.06); filter: brightness(1.12); }
  100% { transform: translateX(-50%) translateY(0) translateZ(8px) scale(1.02); filter: brightness(1.06); box-shadow: 0 10px 18px rgba(0,0,0,.32), 0 0 18px rgba(255,213,78,.42); }
}

































































/* Roulette: vollständiges europäisches Rad und echter Setztisch. */
.roulette-casino-shell{ min-width: 0; }
.roulette-casino-felt{
  display: grid !important;
  grid-template-columns: minmax(300px, 390px) minmax(650px, 1fr);
  grid-template-areas:
    "copy copy"
    "result result"
    "wheel table"
    "summary summary";
  align-items: center;
  gap: 18px 24px;
  min-height: 650px !important;
  padding: 42px 30px 28px !important;
  border-radius: 38px !important;
}
.roulette-casino-felt > .table-copy{ grid-area: copy; }
.roulette-casino-felt > .round-result-banner{ grid-area: result; }
.roulette-wheel-stage{ grid-area: wheel; display: grid; place-items: center; min-height: 390px; }
.roulette-betting-table{ grid-area: table; min-width: 0; }
.roulette-table-summary{ grid-area: summary; display: flex; align-items: center; justify-content: center; gap: 18px; }

.roulette-wheel-real{
  position: relative !important;
  width: 340px !important;
  height: 340px !important;
  border: 18px solid #7a4c20 !important;
  border-radius: 50%;
  overflow: visible !important;
  background:
    radial-gradient(circle at 50% 50%, #d8b25b 0 9%, #30251b 9.5% 16%, transparent 16.5%),
    radial-gradient(circle at 50% 50%, #18201e 0 51%, #d5b25d 51.5% 55%, #171312 55.5% 68%, #7a4c20 68.5% 100%) !important;
  box-shadow: 0 28px 60px rgba(0,0,0,.55), inset 0 0 0 4px #e9c979, inset 0 0 34px rgba(0,0,0,.82) !important;
  animation: none !important;
}
.roulette-number-ring,
.roulette-ball-track{
  position: absolute;
  inset: 0;
  border-radius: 50%;
  transform-origin: 50% 50%;
}
.roulette-number-ring{ z-index: 3; }
.roulette-pocket{
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  place-items: center;
  width: 25px;
  height: 42px;
  margin: -21px 0 0 -12.5px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 5px 5px 11px 11px;
  transform: rotate(var(--roulette-pocket-angle)) translateY(-137px);
  transform-origin: 50% 50%;
  box-shadow: inset 0 0 8px rgba(0,0,0,.55);
}
.roulette-pocket.red{ background: linear-gradient(#d94a54, #77151e); }
.roulette-pocket.black{ background: linear-gradient(#34373a, #050607); }
.roulette-pocket.green{ background: linear-gradient(#24a668, #075237); }
.roulette-pocket b{
  color: #fff;
  font-size: 9px;
  line-height: 1;
  transform: rotate(calc(var(--roulette-pocket-angle) * -1));
  text-shadow: 0 1px 2px #000;
}
.roulette-pocket.winning-pocket{
  z-index: 12;
  filter: brightness(1.7) drop-shadow(0 0 8px #ffe076);
  animation: rv34_roulettePocketWinV29 .8s ease-in-out 3 alternate;
}
@keyframes rv34_roulettePocketWinV29{ to { scale: 1.28; } }
.roulette-ball-track{ z-index: 8; pointer-events: none; }
.roulette-ball{
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: 14px !important;
  height: 14px !important;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #fff, #e6e0cf 42%, #8d8a80 100%) !important;
  box-shadow: 0 3px 7px rgba(0,0,0,.75), 0 0 8px rgba(255,255,255,.75) !important;
  transform: translate(-50%, -50%) translateY(-142px);
}
.roulette-spindle{
  position: absolute;
  z-index: 10;
  inset: 50% auto auto 50%;
  display: grid;
  place-items: center;
  width: 100px;
  height: 100px;
  border: 7px solid #b78a3b;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background: radial-gradient(circle at 38% 32%, #ffe5a1, #6f481c 46%, #16110c 49% 100%);
  box-shadow: 0 8px 22px rgba(0,0,0,.6), inset 0 0 0 3px rgba(255,255,255,.15);
}
.roulette-spindle i{ position: absolute; width: 7px; height: 74px; border-radius: 99px; background: linear-gradient(#f7d98b, #79501f); transform: rotate(45deg); }
.roulette-spindle i::after{ content: ""; position: absolute; inset: 0; transform: rotate(90deg); border-radius: inherit; background: inherit; }
.roulette-number{
  position: relative !important;
  z-index: 3;
  inset: auto !important;
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(8,10,10,.9);
  font-size: 24px !important;
}

.roulette-number-board{
  display: grid;
  grid-template-columns: 56px repeat(12, minmax(42px, 1fr)) 62px;
  grid-template-rows: repeat(3, 64px);
  gap: 4px;
  min-width: 720px;
}
.roulette-cell{
  position: relative;
  min-width: 0;
  min-height: 0;
  padding: 6px;
  border: 1px solid rgba(255,238,187,.48) !important;
  border-radius: 6px !important;
  color: #fff;
  background: linear-gradient(145deg, #19553d, #0a2f28) !important;
  font-weight: 1000;
  cursor: pointer;
  overflow: visible;
  transition: transform .15s ease, filter .15s ease, border-color .15s ease;
}
.roulette-number-cell{ font-size: 1.08rem; }
.roulette-cell.red{ background: linear-gradient(145deg, #a91f31, #5f111c) !important; }
.roulette-cell.black{ background: linear-gradient(145deg, #24272b, #060708) !important; }
.roulette-cell.zero{ background: linear-gradient(145deg, #16875a, #075137) !important; font-size: 1.4rem; }
.roulette-cell:hover,
.roulette-cell.drag-over{ transform: translateY(-2px); filter: brightness(1.22); border-color: #fff1a8 !important; z-index: 4; }
.roulette-cell.has-bet{ box-shadow: inset 0 0 0 2px rgba(255,220,92,.55), 0 0 18px rgba(255,203,56,.2); }
.roulette-cell.roulette-place-pop{ animation: rv34_roulettePlaceV29 .28s ease; }
@keyframes rv34_roulettePlaceV29{ 50% { transform: scale(1.1); } }
.roulette-cell.winning-number{ z-index: 8; animation: rv34_rouletteWinningCellV29 .7s ease-in-out 4 alternate; }
@keyframes rv34_rouletteWinningCellV29{ to { transform: translateY(-8px) scale(1.12); filter: brightness(1.65); box-shadow: 0 15px 28px rgba(0,0,0,.5), 0 0 28px #ffe16a; } }
.roulette-column-cell{ font-size: .58rem; letter-spacing: .03em; }
.roulette-bet-chip{
  position: absolute;
  z-index: 6;
  top: 50%;
  left: 50%;
  display: grid;
  place-items: center;
  min-width: 30px;
  height: 30px;
  padding: 0 5px;
  border: 3px dashed rgba(255,255,255,.75);
  border-radius: 50%;
  color: #10100d;
  background: linear-gradient(145deg, #ffe585, #d7a92e);
  box-shadow: 0 5px 10px rgba(0,0,0,.48), inset 0 0 0 3px rgba(91,57,7,.25);
  transform: translate(-50%, -50%);
  font-size: .55rem;
  pointer-events: none;
}
.roulette-outside-board{
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 4px;
  min-width: 720px;
  margin-top: 5px;
}
.roulette-outside-board .wide{ grid-column: span 2; min-height: 48px; }
.roulette-total-bet{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  border: 1px solid rgba(255,221,125,.27);
  border-radius: 14px;
  background: rgba(4,16,16,.74);
}
.roulette-total-bet small{ color: #b5c9c2; font-size: .6rem; letter-spacing: .1em; }
.roulette-total-bet strong{ display: inline-flex; align-items: center; gap: 6px; color: #fff0b2; }
.roulette-status{ margin: 0 !important; }
.roulette-chip-rack{ align-items: center; flex-wrap: wrap; }
.roulette-chips .chip.selected{ transform: translateY(-7px); filter: brightness(1.22); box-shadow: 0 0 0 4px rgba(255,218,95,.2), 0 11px 20px rgba(0,0,0,.45); }

@media (max-width: 1180px){
  .roulette-casino-felt{
    grid-template-columns: 1fr;
    grid-template-areas: "copy" "result" "wheel" "table" "summary";
  }
  .roulette-betting-table{ overflow-x: auto; padding-bottom: 8px; }
  
  
}

@media (max-width: 800px){
  
  
  
  
  
  
  .roulette-wheel-real{ width: 300px !important; height: 300px !important; }
  .roulette-pocket{ transform: rotate(var(--roulette-pocket-angle)) translateY(-120px); }
  .roulette-ball{ transform: translate(-50%, -50%) translateY(-125px); }
}

@media (max-width: 560px){
  
  
  
  
  
  
  
  .roulette-casino-felt{ padding: 42px 10px 20px !important; }
  .roulette-wheel-real{ width: 270px !important; height: 270px !important; }
  .roulette-pocket{ width: 21px; height: 34px; margin: -17px 0 0 -10.5px; transform: rotate(var(--roulette-pocket-angle)) translateY(-107px); }
  .roulette-pocket b{ font-size: 7px; }
  .roulette-ball{ width: 12px !important; height: 12px !important; transform: translate(-50%, -50%) translateY(-112px); }
  .roulette-spindle{ width: 84px; height: 84px; }
  .roulette-number-board,
.roulette-outside-board{ min-width: 650px; }
  .roulette-table-summary{ align-items: stretch; flex-direction: column; }
}

/* V29 Roulette-Nachjustierung: kompletter Tisch ohne abgeschnittene Felder. */
.roulette-number-board,
.roulette-outside-board{ min-width: 650px !important; }
.roulette-controls{
  display: grid !important;
  grid-template-columns: 170px minmax(0, 1fr) !important;
  gap: 12px 18px !important;
  align-items: center !important;
}
.roulette-controls .control-title{ min-width: 0; }
.roulette-chips{
  display: grid !important;
  grid-template-columns: repeat(9, minmax(48px, 1fr));
  justify-items: center;
  gap: 8px !important;
  min-width: 0;
}
.roulette-actions{
  grid-column: 1 / -1;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
  width: 100%;
}
@media (max-width: 800px){
  .roulette-controls{ grid-template-columns: 1fr !important; }
  .roulette-chips{ grid-template-columns: repeat(5, minmax(48px, 1fr)); }
  .roulette-actions{ grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 560px){
  .roulette-number-board,
.roulette-outside-board{ min-width: 620px !important; }
  .roulette-chips{ grid-template-columns: repeat(3, minmax(48px, 1fr)); }
}







@media (min-width: 1181px){
  .roulette-number-board,
.roulette-outside-board{ min-width: 610px !important; }
  .roulette-number-board{ grid-template-columns: 52px repeat(12, minmax(36px, 1fr)) 54px !important; }
  .roulette-casino-felt{ grid-template-columns: minmax(300px, .82fr) minmax(610px, 1.55fr) !important; column-gap: 18px !important; }
}

/* =========================================================
   V30 · KOMPAKTE ZAHLEN, STABILES POKER, ROULETTE & 3×3 SLOTS
   ========================================================= */


.roulette-app .chip,
.roulette-bet-chip{
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  text-align: center !important;
  line-height: 1 !important;
  text-indent: 0 !important;
  font-variant-numeric: tabular-nums;
}
.roulette-app .chip{ letter-spacing: -.02em; }






















































/* Roulette: weniger ungenutzte Höhe oberhalb, Verlauf direkt über dem Setzfeld. */
.roulette-casino-felt{
  min-height: 570px !important;
  padding: 18px 24px 20px !important;
  gap: 10px 20px !important;
}
.roulette-wheel-stage{ min-height: 350px !important; }
.roulette-casino-felt > .table-copy{ margin: 0 !important; padding: 0 !important; }
.roulette-history-strip{
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  margin-bottom: 7px;
  padding: 7px 9px;
  border: 1px solid rgba(255,226,139,.2);
  border-radius: 12px;
  background: rgba(3,13,14,.72);
  overflow: hidden;
}
.roulette-history-label{
  flex: 0 0 auto;
  color: #b7c8c3;
  font-size: .58rem;
  font-weight: 1000;
  letter-spacing: .14em;
}
.roulette-history-values{
  display: flex;
  min-width: 0;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: thin;
}
.roulette-history-number{
  display: grid;
  place-items: center;
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 50%;
  color: #fff;
  font-size: .68rem;
  font-weight: 1000;
  cursor: pointer;
}
.roulette-history-number.red{ background: #991f31; }
.roulette-history-number.black{ background: #15191d; }
.roulette-history-number.green{ background: #117a50; }
.roulette-history-empty{ color: #708a88; font-size: .68rem; }
.roulette-pocket b{
  transform-origin: 50% 50% !important;
  font-variant-numeric: tabular-nums;
}








@keyframes rv34_slotMatrixRoll{ 50% { transform: translateY(9px) scaleY(.8); filter: blur(1px); } }
@keyframes rv34_slotCellWin{ to { transform: translateY(-3px) scale(1.035); filter: brightness(1.25); } }









@media (max-width: 720px){
  
  
  
  .roulette-casino-felt{ padding-top: 12px !important; }
}





/* =========================================================
   V31 · POKER-SEITENLEISTE, REGELN & ROULETTE-AUSRICHTUNG
   ========================================================= */















































/* Roulette: Dutzende fluchten genau mit den jeweils vier Zahlen-Spalten. */
.roulette-casino-felt{
  min-height: 520px !important;
  padding-top: 8px !important;
}
.roulette-wheel-stage{ min-height: 316px !important; }
.roulette-outside-board{
  display: grid !important;
  grid-template-columns: 56px repeat(12, minmax(42px, 1fr)) 62px !important;
  grid-template-rows: 48px 48px !important;
  gap: 4px !important;
  min-width: 720px !important;
  margin-top: 4px !important;
}
.roulette-outside-board [data-roulette-bet="dozen1"]{ grid-column: 2 / span 4 !important; grid-row: 1 !important; }
.roulette-outside-board [data-roulette-bet="dozen2"]{ grid-column: 6 / span 4 !important; grid-row: 1 !important; }
.roulette-outside-board [data-roulette-bet="dozen3"]{ grid-column: 10 / span 4 !important; grid-row: 1 !important; }
.roulette-outside-board [data-roulette-bet="low"]{ grid-column: 2 / span 2 !important; grid-row: 2 !important; }
.roulette-outside-board [data-roulette-bet="even"]{ grid-column: 4 / span 2 !important; grid-row: 2 !important; }
.roulette-outside-board [data-roulette-bet="red"]{ grid-column: 6 / span 2 !important; grid-row: 2 !important; }
.roulette-outside-board [data-roulette-bet="black"]{ grid-column: 8 / span 2 !important; grid-row: 2 !important; }
.roulette-outside-board [data-roulette-bet="odd"]{ grid-column: 10 / span 2 !important; grid-row: 2 !important; }
.roulette-outside-board [data-roulette-bet="high"]{ grid-column: 12 / span 2 !important; grid-row: 2 !important; }
.roulette-outside-board .wide{ min-height: 48px !important; }

@media (max-width: 1180px){
  
  .roulette-casino-felt{ min-height: 0 !important; }
}

@media (max-width: 560px){
  
  
  
  
  
  .roulette-outside-board{
    grid-template-columns: 52px repeat(12, minmax(39px,1fr)) 58px !important;
    min-width: 650px !important;
  }
}


.roulette-number-board,
.roulette-outside-board{
  grid-template-columns: 56px repeat(12, minmax(42px, 1fr)) 62px !important;
  min-width: 720px !important;
}
@media (max-width: 560px){
  .roulette-number-board,
.roulette-outside-board{
    grid-template-columns: 52px repeat(12, minmax(39px, 1fr)) 58px !important;
    min-width: 650px !important;
  }
}





















#rouletteApp .roulette-casino-felt > .round-result-banner{ top: auto !important; left: auto !important; right: 14px !important; bottom: 14px !important; max-width: min(330px,44%) !important; transform: none !important; pointer-events: none; }
























@keyframes rv34_wheelExactSectorV323{ to { transform: scale(1.045); } }

/* Roulette: ausschließlich Ausrichtung, Kugel, Jetons und zusätzliche Einsatzpunkte. */
.roulette-number-ring{ transform: rotate(0deg); }
.roulette-pocket b{ transform-origin: center !important; white-space: nowrap; text-align: center; backface-visibility: hidden; }
.roulette-ball{ transform: translate(-50%,-50%) translateY(-132px); }
.roulette-cell{ text-align: center !important; line-height: 1.05 !important; overflow: hidden; }
.roulette-column-cell{ letter-spacing: 0 !important; white-space: normal !important; }
.roulette-bet-chip{ width: 34px !important; min-width: 34px !important; height: 34px !important; padding: 0 !important; display: grid !important; place-items: center !important; border-radius: 50% !important; color: #fff !important; font: 1000 .54rem/1 system-ui,sans-serif !important; text-align: center !important; transform: translate(-50%,-50%) !important; white-space: nowrap !important; pointer-events: none; }
.roulette-number-board{ position: relative; }
.roulette-inside-hotspot{ position: absolute; z-index: 15; width: 16px; height: 16px; padding: 0; margin: -8px 0 0 -8px; border: 2px solid rgba(255,241,168,.76); border-radius: 50%; background: rgba(4,30,24,.78); opacity: .42; cursor: pointer; }
.roulette-inside-hotspot:hover,
.roulette-inside-hotspot.has-bet,
.roulette-inside-hotspot.drag-over{ opacity: 1; filter: brightness(1.35); }
.roulette-inside-hotspot.street,
.roulette-inside-hotspot.six{ width: 20px; height: 10px; margin: -5px 0 0 -10px; border-radius: 4px; }
.roulette-inside-hotspot.corner{ width: 18px; height: 18px; margin: -9px 0 0 -9px; }
.roulette-inside-hotspot.zero-trio{ width: 18px; height: 12px; margin: -6px 0 0 -9px; }
.roulette-inside-hotspot.zero-corner{ width: 20px; height: 20px; margin: -10px 0 0 -10px; }
.roulette-inside-hotspot .roulette-bet-chip{ width: 31px !important; min-width: 31px !important; height: 31px !important; }






































@media (max-width: 760px){
  
  
  
  
  
  
  
  
  
  #rouletteApp .roulette-casino-felt > .round-result-banner{ right: 8px !important; bottom: 8px !important; max-width: calc(100% - 16px) !important; }
}




.roulette-app,
.roulette-app,
.roulette-app button{
  text-rendering: auto;
  -webkit-font-smoothing: subpixel-antialiased;
  -moz-osx-font-smoothing: auto;
  font-synthesis: none;
  font-kerning: normal;
}


.roulette-app .table-copy{
  font-size: max(11px, .69rem) !important;
  line-height: 1.25 !important;
}











/* Roulettekugel liegt bereits beim Öffnen sichtbar innerhalb des Kessels. */
.roulette-ball{
  transform: translate(-50%, -50%) translateY(-132px);
}
.roulette-pocket b{
  backface-visibility: hidden;
}


.roulette-inside-hotspot,
.roulette-inside-hotspot.street,
.roulette-inside-hotspot.six,
.roulette-inside-hotspot.corner,
.roulette-inside-hotspot.zero-split,
.roulette-inside-hotspot.zero-trio,
.roulette-inside-hotspot.zero-corner{
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  color: transparent !important;
  opacity: 1 !important;
  filter: none !important;
  outline: none !important;
}
.roulette-inside-hotspot:hover,
.roulette-inside-hotspot:focus-visible,
.roulette-inside-hotspot.has-bet,
.roulette-inside-hotspot.drag-over{
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  opacity: 1 !important;
  filter: none !important;
}
.roulette-inside-hotspot > .roulette-bet-chip{
  color: #fff !important;
  opacity: 1 !important;
}














/* Roulette: Zahlen bleiben fest in ihrem Fach und drehen nicht separat. */
.roulette-pocket b{
  transform: rotate(var(--roulette-pocket-counter-angle)) !important;
  transform-box: fill-box;
  transform-origin: center !important;
}
.roulette-ball{
  transform: translate(-50%, -50%) translateY(-153px);
}
@media (max-width: 800px){
  .roulette-ball{ transform: translate(-50%, -50%) translateY(-133px); }
}
@media (max-width: 560px){
  .roulette-ball{ transform: translate(-50%, -50%) translateY(-119px); }
}


















/* Roulette: Zahlen bleiben während der Radbewegung jederzeit aufrecht. */
.roulette-pocket b{
  transform: rotate(calc(var(--roulette-pocket-counter-angle) + var(--roulette-ring-counter-angle, 0deg))) !important;
}


.roulette-ball{
  opacity: 0 !important;
  visibility: hidden !important;
  transition: opacity .12s ease;
}
.roulette-wheel.ball-visible .roulette-ball{
  opacity: 1 !important;
  visibility: visible !important;
}


.roulette-bet-chip.chip-value-100,
.roulette-inside-hotspot > .roulette-bet-chip.chip-value-100{
  color: #221600 !important;
  background: radial-gradient(circle, #fff7c7 0 27%, #e7b52b 29% 55%, #5c4210 58%) !important;
  border-color: rgba(255,247,199,.78) !important;
}





/* =========================================================
   V32.8 · Roulette-Anzeigefehler & stabile Poker-Aktionsleiste
   Nur die beiden ausdrücklich beauftragten Bereiche werden korrigiert.
   ========================================================= */
































/* v33.0: Der auswählbare 100er-Roulettejeton entspricht dem gelegten Jeton. */
.roulette-chips .chip-100{
  color: #221600 !important;
  background: radial-gradient(circle, #fff7c7 0 27%, #e7b52b 29% 55%, #5c4210 58%) !important;
  border-color: rgba(255,247,199,.78) !important;
}


































































@media (max-width: 800px){
  .roulette-app,
.roulette-app{ width: 100%; max-width: 100%; overflow-x: hidden !important; }
  .roulette-app{ padding: 0 !important; }
  .roulette-app *,
.roulette-app *::before,
.roulette-app *::after{ max-width: 100%; box-sizing: border-box; }
  .roulette-app button{ font-size: max(16px, 1rem); }
  .roulette-app button,
.roulette-app .primary-btn,
.roulette-app .secondary-btn{
    min-height: 44px;
    touch-action: manipulation;
  }

  
  
  
  
  
  
  

  
  .roulette-app.layout,
.roulette-app,
#rouletteApp{
    width: calc(100% - 12px) !important;
    max-width: none !important;
    margin: 6px auto 14px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    min-width: 0 !important;
  }
  .roulette-app.layout{ grid-template-columns: minmax(0, 1fr) !important; }
  
  
  

  
  .roulette-controls,
.roulette-app .control-deck{
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 9px !important;
    padding: 10px !important;
  }
  .roulette-actions{
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
  }
  .roulette-actions > *{ width: 100% !important; min-width: 0 !important; }
  .roulette-app .chips,
.roulette-chips{
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 5px 3px 10px !important;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
  }
  .roulette-app .chips .chip{ flex: 0 0 auto !important; scroll-snap-align: start; }

  
  
  
  
  
  
  
  
  

  /* Roulette: wheel fits; betting board scrolls instead of clipping. */
  .roulette-shell,
.roulette-casino-shell{ width: 100% !important; min-width: 0 !important; }
  .roulette-table-rim,
.roulette-casino-felt{ width: 100% !important; min-width: 0 !important; padding: 10px !important; }
  .roulette-stage{ width: 100% !important; display: grid !important; justify-items: center !important; gap: 12px !important; }
  .roulette-wheel,
.roulette-wheel-real{
    width: min(286px, 88vw) !important;
    height: min(286px, 88vw) !important;
    min-width: 0 !important;
    flex: none !important;
  }
  .roulette-betting-table{ width: 100% !important; max-width: 100% !important; overflow-x: auto !important; overflow-y: visible !important; -webkit-overflow-scrolling: touch; }
  .roulette-number-board,
.roulette-outside-board,
.roulette-history-strip,
.roulette-table-summary{ min-width: 620px !important; }
  .roulette-controls{ margin-top: 9px !important; }
  .roulette-info{ width: 100% !important; }

  
  
  
  
  
  
  
  
  

  
  
  
  
  
  
  
  
  
  
  
  
  

  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  

  
  
  
  
  
  
  

  
}

@media (max-width: 430px){
  
  
  .roulette-actions{ grid-template-columns: minmax(0,1fr) !important; }
  
  
  
}

@media (max-width: 800px){
  
  
  
  .roulette-controls .roulette-chips{
    justify-content: flex-start !important;
    transform: none !important;
  }
  .roulette-controls .roulette-chips .chip{
    position: static !important;
    inset: auto !important;
    transform: none !important;
    width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;
    max-width: 54px !important;
    flex: 0 0 54px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 50% !important;
    font-size: .76rem !important;
  }
  .roulette-controls .roulette-chips .chip.selected{
    transform: translateY(-3px) !important;
  }
}













/* V33.2 mobile roulette: wheel is centered and only the betting board scrolls. */
@media (max-width: 800px){
  .roulette-casino-felt{
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "copy"
      "result"
      "wheel"
      "table"
      "summary" !important;
    align-items: stretch !important;
    overflow: hidden !important;
  }
  .roulette-wheel-stage,
.roulette-stage{
    grid-area: wheel !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 310px !important;
    overflow: visible !important;
  }
  .roulette-betting-table{
    grid-area: table !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding-bottom: 7px !important;
    scrollbar-width: thin;
  }
  .roulette-number-board,
.roulette-outside-board{
    width: 620px !important;
    min-width: 620px !important;
    max-width: none !important;
  }
  .roulette-history-strip,
.roulette-table-summary{
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .roulette-table-summary{
    grid-area: summary !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 7px !important;
  }
  
  
}






























@keyframes rv34_shopHoverHoldV334{
  from {
    filter: brightness(1.06);
    box-shadow: 0 12px 24px rgba(0,0,0,.24), 0 0 0 rgba(246,200,95,0);
  }
  to {
    filter: brightness(1.14);
    box-shadow: 0 16px 30px rgba(0,0,0,.3), 0 0 18px rgba(246,200,95,.16);
  }
}

























@keyframes rv34_blackjackTurnHoldV334{
  from { transform: translateY(-1px) scale(1.01); filter: brightness(1.04); }
  to { transform: translateY(-4px) scale(1.045); filter: brightness(1.14); }
}
@keyframes rv34_blackjackNameHoldV334{
  from { filter: brightness(1.02); box-shadow: inset 0 0 0 rgba(246,200,95,0); }
  to { filter: brightness(1.1); box-shadow: inset 0 0 18px rgba(246,200,95,.1); }
}











































@keyframes rv34_blackjackProfileGlowV335{
  from {
    filter: brightness(1.04);
    box-shadow: 0 0 0 3px rgba(246,200,95,.1), 0 8px 19px rgba(0,0,0,.4);
  }
  to {
    filter: brightness(1.14);
    box-shadow: 0 0 0 6px rgba(246,200,95,.15), 0 0 28px rgba(246,200,95,.38), 0 8px 19px rgba(0,0,0,.4);
  }
}
@keyframes rv34_blackjackRowGlowV335{
  from { filter: brightness(1.02); box-shadow: inset 0 0 0 rgba(246,200,95,0); }
  to { filter: brightness(1.1); box-shadow: inset 0 0 18px rgba(246,200,95,.1); }
}




@keyframes rv34_pokerProfileGlowV335{
  from { filter: brightness(1); }
  to { filter: brightness(1.14); }
}
@keyframes rv34_pokerRowGlowV335{
  from { filter: brightness(1); }
  to { filter: brightness(1.09); }
}




























@keyframes rv34_seamlessHighlightV336{
  0%, 100% {
    filter: brightness(1.04);
    box-shadow: 0 0 0 3px rgba(246,200,95,.10), 0 8px 19px rgba(0,0,0,.38);
  }
  50% {
    filter: brightness(1.14);
    box-shadow: 0 0 0 6px rgba(246,200,95,.15), 0 0 28px rgba(246,200,95,.36), 0 8px 19px rgba(0,0,0,.38);
  }
}
































































































































































































































@keyframes rv34_fixedWinnerGlowV3323{
  0%, 100% {
    filter: brightness(1.04);
    box-shadow: 0 0 0 3px rgba(255,213,87,.16), 0 0 22px rgba(255,200,52,.28), 0 12px 26px rgba(0,0,0,.44);
  }
  50% {
    filter: brightness(1.18);
    box-shadow: 0 0 0 5px rgba(255,213,87,.22), 0 0 36px rgba(255,200,52,.48), 0 12px 26px rgba(0,0,0,.44);
  }
}

































@keyframes rv34_blackjackLoseGlowV3324{
  0%, 100% {
    filter: brightness(.96);
    box-shadow: 0 0 0 3px rgba(255,75,95,.16), 0 0 20px rgba(255,52,79,.25), 0 10px 24px rgba(0,0,0,.42);
  }
  50% {
    filter: brightness(1.12);
    box-shadow: 0 0 0 5px rgba(255,75,95,.24), 0 0 34px rgba(255,52,79,.48), 0 10px 24px rgba(0,0,0,.42);
  }
}




































































































.roulette-app{
  --wf-ink: #07090d;
  --wf-paper: #0b1018;
  --wf-paper-2: #141b27;
  --wf-violet: #7a5cff;
  --wf-violet-dark: #5d43df;
  --wf-lime: #57821a;
  --wf-coral: #ff6b57;
  --wf-sky: #7dd7ff;
  --wf-muted: #aeb7c8;
  --wf-white: #202938;
  --wf-text: #f4f7fb;
  --wf-text-soft: #cbd2df;
  --wf-card: #f7f3e9;
  --wf-shadow: 8px 8px 0 #05070a;
  --wf-shadow-sm: 4px 4px 0 #05070a;

  --bg: var(--wf-paper);
  --panel: var(--wf-paper-2);
  --panel-strong: var(--wf-white);
  --felt: var(--wf-violet);
  --felt-deep: var(--wf-violet-dark);
  --gold: var(--wf-lime);
  --gold-2: var(--wf-lime);
  --mint: var(--wf-sky);
  --cyan: var(--wf-sky);
  --danger: var(--wf-coral);
  --text: var(--wf-text);
  --muted: var(--wf-muted);
  --line: var(--wf-ink);
  --shadow: var(--wf-shadow);
  --radius: 24px;
}

.roulette-app{
  background: var(--wf-paper) !important;
}

.roulette-app{
  color: var(--wf-ink) !important;
  background:
    radial-gradient(circle at 8% 10%, rgba(122, 92, 255, .14), transparent 28%),
    radial-gradient(circle at 93% 13%, rgba(200, 255, 61, .18), transparent 24%),
    radial-gradient(circle at 54% 92%, rgba(125, 215, 255, .14), transparent 24%),
    var(--wf-paper) !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
}

.roulette-app::before{
  content: "";
  position: fixed;
  inset: 0;
  z-index: -3;
  pointer-events: none;
  opacity: .22;
  background-image:
    linear-gradient(rgba(18,18,18,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(18,18,18,.035) 1px, transparent 1px);
  background-size: 34px 34px;
}






.roulette-app .glass{
  color: var(--wf-ink) !important;
  background: var(--wf-paper-2) !important;
  border: 2px solid var(--wf-ink) !important;
  box-shadow: var(--wf-shadow) !important;
  backdrop-filter: none !important;
}


.roulette-app h2,
.roulette-app strong,
.roulette-app button{
  letter-spacing: -.015em;
}

.roulette-app .control-title small,
.roulette-app .panel-section p,
.roulette-status{
  color: var(--wf-muted) !important;
}















.roulette-app .primary-btn,
.roulette-app .secondary-btn,
.roulette-cell{
  color: var(--wf-ink) !important;
  border: 2px solid var(--wf-ink) !important;
  font-weight: 900 !important;
  transition: transform .16s ease, box-shadow .16s ease, background-color .16s ease !important;
}
.roulette-app .primary-btn{
  color: var(--wf-white) !important;
  background: var(--wf-violet) !important;
  box-shadow: 5px 5px 0 var(--wf-ink) !important;
}
.roulette-app .secondary-btn{
  color: var(--wf-ink) !important;
  background: var(--wf-paper-2) !important;
  box-shadow: 4px 4px 0 var(--wf-ink) !important;
}



#spinRouletteButton{
  color: var(--wf-ink) !important;
  background: var(--wf-sky) !important;
}
.roulette-app .primary-btn:hover:not(:disabled),
.roulette-app .secondary-btn:hover:not(:disabled){
  transform: translate(-2px, -2px) !important;
  filter: none !important;
  box-shadow: 7px 7px 0 var(--wf-ink) !important;
  animation: none !important;
}

.roulette-app button:focus-visible{
  outline: 4px solid rgba(122, 92, 255, .35) !important;
  outline-offset: 3px !important;
}
.roulette-app button:disabled{
  opacity: .45 !important;
  filter: grayscale(.3) !important;
}


















































.roulette-app.layout,
.roulette-app{
  color: var(--wf-ink) !important;
}
.roulette-app .control-deck,
.roulette-controls,
.roulette-app .side-panel{
  color: var(--wf-ink) !important;
  background: var(--wf-paper-2) !important;
  border: 3px solid var(--wf-ink) !important;
  border-radius: 24px !important;
  box-shadow: var(--wf-shadow) !important;
  backdrop-filter: none !important;
}

.roulette-total-bet{
  color: var(--wf-ink) !important;
  background: var(--wf-white) !important;
  border: 2px solid var(--wf-ink) !important;
  border-radius: 14px !important;
  box-shadow: 3px 3px 0 var(--wf-ink) !important;
}
.roulette-total-bet strong{
  color: var(--wf-violet-dark) !important;
}






.roulette-app .table-copy{
  color: rgba(255,255,255,.72) !important;
  font-weight: 1000 !important;
}

















.roulette-app .chip,
.roulette-app .mini-chip{
  border-color: var(--wf-white) !important;
  outline: 2px solid var(--wf-ink);
  box-shadow: 4px 4px 0 rgba(18,18,18,.72) !important;
}
.roulette-app .chip:hover:not(:disabled){
  transform: translate(-2px,-4px) rotate(-4deg) !important;
  filter: brightness(1.06) !important;
}

.roulette-actions{
  gap: 10px !important;
}


.roulette-app .side-panel{
  overflow: hidden !important;
}
.roulette-app .panel-section{
  color: var(--wf-ink) !important;
  background: var(--wf-paper-2) !important;
  border-color: var(--wf-ink) !important;
}
.roulette-app .panel-section + .panel-section{
  border-top: 2px solid var(--wf-ink) !important;
}
.roulette-app .rule-list li{
  color: var(--wf-ink) !important;
  background: var(--wf-white) !important;
  border: 2px solid var(--wf-ink) !important;
  border-radius: 13px !important;
}

.roulette-app .rule-list strong{ color: var(--wf-violet-dark) !important; }
.roulette-app .tip-box{
  color: var(--wf-ink) !important;
  background: var(--wf-lime) !important;
}
.roulette-app .tip-icon{
  color: var(--wf-ink) !important;
  background: var(--wf-sky) !important;
  border: 2px solid var(--wf-ink) !important;
  box-shadow: 3px 3px 0 var(--wf-ink) !important;
}



















.roulette-app .round-result-banner{
  color: var(--wf-ink) !important;
  background: var(--wf-coral) !important;
  border: 2px solid var(--wf-ink) !important;
  box-shadow: 4px 4px 0 var(--wf-ink) !important;
}





/* Roulette */
.roulette-table-rim{
  background: var(--wf-ink) !important;
  border: 3px solid var(--wf-ink) !important;
  box-shadow: 11px 11px 0 rgba(255,107,87,.62) !important;
}
.roulette-felt{
  color: var(--wf-white) !important;
  background:
    radial-gradient(circle at 25% 28%, rgba(87,130,26,.16), transparent 28%),
    linear-gradient(145deg, var(--wf-violet), var(--wf-violet-dark)) !important;
  box-shadow: inset 0 0 0 3px var(--wf-lime), inset 0 0 0 7px var(--wf-ink) !important;
}
.roulette-wheel{
  border: 5px solid var(--wf-ink) !important;
  box-shadow: 8px 8px 0 var(--wf-ink), inset 0 0 0 4px var(--wf-lime) !important;
}
.roulette-spindle{
  color: var(--wf-ink) !important;
  background: var(--wf-lime) !important;
  border: 3px solid var(--wf-ink) !important;
}
.roulette-betting-table,
.roulette-history-strip,
.roulette-table-summary{
  color: var(--wf-ink) !important;
  background: var(--wf-paper-2) !important;
  border: 2px solid var(--wf-ink) !important;
  border-radius: 16px !important;
}
.roulette-cell{
  box-shadow: 3px 3px 0 var(--wf-ink) !important;
}
.roulette-cell.outside{ background: var(--wf-white) !important; }
.roulette-cell.red{ background: var(--wf-coral) !important; }
.roulette-cell.black{ color: var(--wf-white) !important; background: var(--wf-ink) !important; }





































@media (max-width: 1180px){
  
  
  .roulette-app.layout,
.roulette-app{
    width: calc(100% - 20px) !important;
  }
}

@media (max-width: 800px){
  .roulette-app::before{ background-size: 24px 24px; }
  .roulette-app .glass,
.roulette-app .control-deck,
.roulette-controls,
.roulette-app .side-panel{
    box-shadow: 5px 5px 0 var(--wf-ink) !important;
  }
  
  
  
  
  
  
  
  
  .roulette-table-rim{
    box-shadow: 6px 6px 0 var(--wf-violet-dark) !important;
  }
  .roulette-felt{
    box-shadow: inset 0 0 0 2px var(--wf-lime), inset 0 0 0 5px var(--wf-ink) !important;
  }
  .roulette-app .primary-btn,
.roulette-app .secondary-btn{
    box-shadow: 3px 3px 0 var(--wf-ink) !important;
  }
  
}













@media (max-width: 800px){
  
  
  
  
  
  
  
  
  .roulette-felt .roulette-status{
    color: var(--wf-ink) !important;
    font-weight: 900 !important;
  }
}





.roulette-app,
.roulette-app{
  background-color: var(--wf-paper) !important;
}

.roulette-app{
  color: var(--wf-text) !important;
  background:
    radial-gradient(circle at 8% 10%, rgba(122, 92, 255, .22), transparent 30%),
    radial-gradient(circle at 93% 13%, rgba(200, 255, 61, .10), transparent 25%),
    radial-gradient(circle at 54% 92%, rgba(125, 215, 255, .10), transparent 25%),
    linear-gradient(145deg, #080c13, var(--wf-paper) 52%, #090d15) !important;
}

.roulette-app::before{
  opacity: .34 !important;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px) !important;
}

.roulette-app .glass,
.roulette-app.layout,
.roulette-app,
.roulette-app .control-deck,
.roulette-controls,
.roulette-app .side-panel,
.roulette-app .panel-section{
  color: var(--wf-text) !important;
}

.roulette-app .glass,
.roulette-app .control-deck,
.roulette-controls,
.roulette-app .side-panel{
  background: var(--wf-paper-2) !important;
}





.roulette-app .panel-section p,
.roulette-status{
  color: var(--wf-muted) !important;
}

.roulette-total-bet,
.roulette-app .rule-list li,
.roulette-betting-table,
.roulette-history-strip,
.roulette-table-summary{
  color: var(--wf-text) !important;
  background: var(--wf-white) !important;
}

.roulette-app .secondary-btn{
  color: var(--wf-text) !important;
}

.roulette-app .primary-btn{
  color: var(--wf-text) !important;
}

#spinRouletteButton,
.roulette-app .tip-box,
.roulette-app .tip-icon,
.roulette-app .round-result-banner,
.roulette-spindle{
  color: var(--wf-ink) !important;
}

























.roulette-app .rule-list strong,
.roulette-total-bet strong{
  color: var(--wf-sky) !important;
}











.roulette-app .chip,
.roulette-app .mini-chip{
  border-color: var(--wf-card) !important;
}





.roulette-cell.outside{
  color: var(--wf-text) !important;
  background: var(--wf-white) !important;
}

.roulette-cell.black{
  color: var(--wf-text) !important;
}













@media (max-width: 800px){
  .roulette-felt .roulette-status{
    color: var(--wf-text) !important;
  }
}


.roulette-felt{
  color: var(--wf-text) !important;
}


















/* Alte Roulette-Verlaufsregel überschreiben und an das Webfix-Kartendesign angleichen. */
#playRouletteButton.roulette{
  color: var(--wf-ink) !important;
  background: var(--wf-lime) !important;
  border: 3px solid var(--wf-ink) !important;
  border-radius: 22px !important;
  box-shadow: 7px 7px 0 var(--wf-ink) !important;
}
#playRouletteButton.roulette span{
  color: var(--wf-ink) !important;
  text-shadow: none !important;
}
#playRouletteButton.roulette:hover:not(:disabled){
  transform: translate(-4px, -4px) !important;
  box-shadow: 11px 11px 0 var(--wf-ink) !important;
}





.roulette-app{
  --wf-lime: #57821a;
}



























/* Rechte 2-zu-1-Kolonne schmaler, damit sie nicht über das Roulettefeld hinausragt. */
.roulette-number-board,
.roulette-outside-board{
  grid-template-columns: 56px repeat(12, minmax(42px, 1fr)) 48px !important;
}
.roulette-column-cell{
  min-width: 0 !important;
  padding-right: 4px !important;
  padding-left: 4px !important;
  font-size: .54rem !important;
}

/* Roulette-Auszahlungen mit gleichmäßigen Innenabständen. */
#rouletteApp .rule-list li{
  gap: 20px !important;
  padding: 12px 16px !important;
  box-sizing: border-box !important;
}
#rouletteApp .rule-list li span{
  min-width: 0 !important;
  padding-left: 2px !important;
}
#rouletteApp .rule-list li strong{
  flex: 0 0 auto !important;
  margin-left: auto !important;
  padding-right: 2px !important;
  text-align: right !important;
}

@media (max-width: 560px){
  
  
  .roulette-number-board,
.roulette-outside-board{
    grid-template-columns: 52px repeat(12, minmax(39px, 1fr)) 44px !important;
    min-width: 636px !important;
  }
}














@keyframes rv34_blackjackAvatarLossBorderV344{
  0%, 100% {
    border-color: #ff3f59;
    box-shadow: 0 0 0 2px rgba(255,63,89,.28), 0 0 15px rgba(255,63,89,.34), 4px 4px 0 var(--wf-ink);
  }
  50% {
    border-color: #ff7184;
    box-shadow: 0 0 0 4px rgba(255,63,89,.34), 0 0 25px rgba(255,63,89,.58), 4px 4px 0 var(--wf-ink);
  }
}





/* Roulette auf Desktop etwas nach links setzen und den schwarzen Rahmen rechts verbreitern. */
@media (min-width: 1181px){
  #rouletteApp .roulette-table-rim{
    width: calc(100% + 34px) !important;
    max-width: none !important;
    margin-left: -24px !important;
    margin-right: -10px !important;
    padding-right: 34px !important;
    box-sizing: border-box !important;
  }
  #rouletteApp .roulette-casino-felt{
    width: 100% !important;
    max-width: none !important;
    grid-template-columns: minmax(300px, .78fr) minmax(660px, 1.62fr) !important;
    padding-right: 38px !important;
    box-sizing: border-box !important;
  }
  #rouletteApp .roulette-betting-table{
    position: relative !important;
    left: -8px !important;
    width: calc(100% + 8px) !important;
    max-width: none !important;
    overflow: visible !important;
  }
}





























@media (max-width: 800px){
  
  
  
  
  
  
  
  
  

  
  
  
  
  
  
  
  
  

  
  

  
  #rouletteApp .roulette-chips{
    position: relative !important;
    z-index: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 5px 3px 9px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-inline: contain !important;
    scroll-snap-type: x proximity !important;
  }
  #rouletteApp .roulette-chips .chip{
    position: relative !important;
    inset: auto !important;
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;
    flex: 0 0 46px !important;
    aspect-ratio: 1 / 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 50% !important;
    box-sizing: border-box !important;
    transform: none !important;
    scroll-snap-align: start !important;
  }
  #rouletteApp .roulette-chips .chip.selected{
    transform: none !important;
    z-index: 1 !important;
  }
  #rouletteApp .roulette-actions{
    position: relative !important;
    z-index: 3 !important;
  }

  
  #rouletteApp .roulette-cell{
    contain: layout !important;
  }
  
  
  
  

  /* Roulette-Zwischenwetten werden in lokalen Feldkoordinaten exakt zentriert. */
  #rouletteApp .roulette-number-board{
    position: relative !important;
    transform: none !important;
  }
  #rouletteApp .roulette-inside-hotspot{
    position: absolute !important;
    max-width: none !important;
    transform: none !important;
  }
  #rouletteApp .roulette-inside-hotspot > .roulette-bet-chip{
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    margin: 0 !important;
    padding: 0 !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 50% !important;
    transform: translate(-50%, -50%) !important;
    box-sizing: border-box !important;
  }
}



@media (max-width: 800px){
  
  
  

  
  
  
  
  
  
  
  
  
  
  
  
  

  
  
  
  
  
  
  
  
  

  
  
  
  
  
  
  

  /* Mobile Roulette-Zwischenwetten: jede unsichtbare Trefferfläche wird
     unabhängig von Form und Rahmen exakt um ihre Koordinate zentriert. */
  #rouletteApp .roulette-inside-hotspot,
#rouletteApp .roulette-inside-hotspot.street,
#rouletteApp .roulette-inside-hotspot.six,
#rouletteApp .roulette-inside-hotspot.corner,
#rouletteApp .roulette-inside-hotspot.zero-split,
#rouletteApp .roulette-inside-hotspot.zero-trio,
#rouletteApp .roulette-inside-hotspot.zero-corner{
    margin: 0 !important;
    box-sizing: border-box !important;
    transform: translate(-50%, -50%) !important;
    transform-origin: 50% 50% !important;
  }
  #rouletteApp .roulette-inside-hotspot > .roulette-bet-chip{
    position: absolute !important;
    inset: 50% auto auto 50% !important;
    margin: 0 !important;
    transform: translate(-50%, -50%) !important;
  }
}





@media (max-width: 800px){
  
  
  

  
  
  
  
  
  
  
  
  
  

  
  
  
  
  
  

  /* Die Multiplayer-Einsatzleiste erhält Abstand zum Tisch. Die Chipreihe
     verwendet exakt das bewährte mobile Roulette-Prinzip. */
  
  
  
  
}












































/* Roulette: Überschrift des europäischen Rads auf der hellen Infokarte. */
#rouletteApp .roulette-info .tip-box h2{
  color: #111111 !important;
  -webkit-text-fill-color: #111111 !important;
  text-shadow: none !important;
}





















































































@keyframes rv34_slotWebfixWinV0917{
  to { transform: translateY(-4px) scale(1.08); filter: drop-shadow(5px 6px 0 #071116) brightness(1.18); }
}

















































@keyframes rv34_slotSymbolWinV0919{ to { transform: translateY(-2px) scale(1.04) !important; filter: brightness(1.15) !important; } }











































.roulette-wheel.developer-wheel-hidden{ visibility: hidden !important; }
.roulette-ball.developer-ball-hidden{ display: none !important; }





































































































































































































































































.roulette-app button,
.roulette-app .chip{
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease, background-color .18s ease, border-color .18s ease !important;
}
.roulette-app .primary-btn:hover,
.roulette-app .secondary-btn:hover,
.roulette-app .chip:hover:not(:disabled),
.roulette-cell:hover{
  animation: none !important;
  animation-play-state: paused !important;
}
.roulette-app button:hover::before,
.roulette-app button:hover::after{
  animation: none !important;
}



.roulette-app{
  --admin-bg: #0b111b;
  --admin-surface: #111a29;
  --admin-surface-2: #172235;
  --admin-border: #05070a;
  --admin-text: #f4f7fb;
  --admin-muted: #aeb9ca;
}





















































































:is(button, [role="button"], .home-game-btn, .shop-item-card, .chip, .roulette-cell, .poker-player-row, .poker-empty-seat):hover{
  animation-name: none !important;
  animation-duration: 0s !important;
  animation-iteration-count: 1 !important;
}
:is(button, [role="button"], .home-game-btn, .shop-item-card, .chip, .roulette-cell, .poker-player-row, .poker-empty-seat):hover::before,
:is(button, [role="button"], .home-game-btn, .shop-item-card, .chip, .roulette-cell, .poker-player-row, .poker-empty-seat):hover::after{
  animation: none !important;
}






















.roulette-app button,
.roulette-app .chip,
.roulette-cell{
  animation: none !important;
  animation-name: none !important;
}
.roulette-app button::before,
.roulette-app button::after{
  animation: none !important;
  animation-name: none !important;
}

.roulette-app button:focus-visible{
  animation: none !important;
}









































.observer-roulette-live{
  grid-template-columns: minmax(220px, .8fr) minmax(260px, 1.2fr) !important;
  align-items: center !important;
}
.observer-roulette-wheel{
  width: min(260px, 100%) !important;
  aspect-ratio: 1 / 1 !important;
  margin: auto !important;
  padding: 18px !important;
  border: 5px solid #05070a !important;
  border-radius: 50% !important;
  background: repeating-conic-gradient(#d73a48 0 9.7deg, #111827 9.7deg 19.4deg, #1e8a51 19.4deg 29.1deg) !important;
  box-shadow: 7px 7px 0 #05070a !important;
}
.observer-roulette-ring{
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  height: 100% !important;
  border: 5px solid #05070a !important;
  border-radius: 50% !important;
  background: #f6f1e7 !important;
}
.observer-roulette-ring span{
  color: #05070a !important;
  font-size: clamp(2rem, 5vw, 4rem) !important;
  font-weight: 1000 !important;
}








































@media (max-width: 850px){
  
  .observer-roulette-live{
    grid-template-columns: 1fr !important;
  }
  
}
























@keyframes rv34_neonSideRailIn031{
  from { transform: translateX(108%); }
  to { transform: translateX(0); }
}






































@keyframes rv34_neonSideRailOut032{
  from { transform: translateX(0); }
  to { transform: translateX(108%); }
}














































.observer-roulette-live{ align-items: center !important; }
.observer-roulette-bets{ width: min(420px,100%); max-height: 230px; overflow: auto; }






































































@keyframes rv34_neonSocialRailIn034{ from { transform: translateX(108%); } to { transform: translateX(0); } }
@keyframes rv34_neonSocialRailOut034{ from { transform: translateX(0); } to { transform: translateX(108%); } }