:root{
  --roulette-red:#b6201d;
  --roulette-red-hot:#df2a24;
  --roulette-black:#111416;
  --roulette-green:#08704a;
  --felt:#0b5238;
  --felt-deep:#063824;
  --felt-line:rgba(244,238,222,.68);
  --cream:#f4eee2;
  --gold:#d6b984;
  --game-line:rgba(244,238,226,.18);
}

.roulette-page{
  min-width:320px;
  background:#070908;
  color:var(--cream);
}
.roulette-page [hidden]{display:none!important}

.roulette-page .noise{z-index:160;opacity:.028}
.roulette-page .cursor{z-index:0}
.roulette-page .roulette-nav{
  width:min(1440px,calc(100% - 48px));
  z-index:150;
  background:linear-gradient(180deg,rgba(7,9,8,.98),rgba(7,9,8,.88));
}
.roulette-page .roulette-nav.is-scrolled{
  position:fixed;
  top:0;
  height:70px;
  border:1px solid var(--line);
  border-top:0;
  backdrop-filter:blur(16px);
}
.roulette-nav nav a.active{color:var(--red)}
.roulette-nav nav a.active:after{width:100%}
.menu-toggle{display:none;border:0;background:transparent;color:var(--white);font:9px var(--mono);letter-spacing:.13em;cursor:pointer}
.menu-toggle i,.menu-toggle i:before,.menu-toggle i:after{display:block;width:19px;height:1px;background:currentColor;transition:.25s}
.menu-toggle i{position:relative;margin-left:9px}
.menu-toggle i:before,.menu-toggle i:after{content:"";position:absolute;left:0}
.menu-toggle i:before{top:-6px}.menu-toggle i:after{top:6px}
.roulette-nav.is-open .menu-toggle i{background:transparent}
.roulette-nav.is-open .menu-toggle i:before{top:0;transform:rotate(45deg)}
.roulette-nav.is-open .menu-toggle i:after{top:0;transform:rotate(-45deg)}

.roulette-arena{
  position:relative;
  z-index:1;
  min-height:100svh;
  padding:92px 18px 28px;
  background:
    radial-gradient(circle at 50% -10%,rgba(191,76,44,.16),transparent 38%),
    linear-gradient(180deg,#070908 0,#0a0d0b 100%);
}
.roulette-page main{padding-bottom:118px}

.game-shell{
  position:relative;
  width:min(1480px,100%);
  min-height:calc(100svh - 120px);
  margin-inline:auto;
  display:grid;
  grid-template-rows:58px minmax(690px,1fr) 28px;
  overflow:hidden;
  border:1px solid rgba(244,238,226,.22);
  background:
    radial-gradient(ellipse at 50% 24%,rgba(255,255,255,.085),transparent 34%),
    radial-gradient(ellipse at 10% 95%,rgba(0,0,0,.28),transparent 35%),
    linear-gradient(112deg,rgba(255,255,255,.022),transparent 30%,rgba(0,0,0,.1) 72%),
    var(--felt);
  box-shadow:0 38px 100px rgba(0,0,0,.42),inset 0 0 90px rgba(0,0,0,.2);
}
.game-shell:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  opacity:.16;
  pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitchTiles'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E");
  mix-blend-mode:soft-light;
}
.game-shell>*{position:relative;z-index:1}

.game-topbar{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(220px,1fr) auto minmax(250px,1fr);
  align-items:center;
  gap:24px;
  padding:0 20px;
  border-bottom:1px solid var(--game-line);
  background:rgba(4,15,11,.76);
}
.game-title{display:flex;align-items:center;gap:12px;min-width:0}
.game-title__mark{
  width:29px;
  height:29px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border:1px solid rgba(244,238,226,.52);
  border-radius:50%;
  font:600 8px var(--mono);
}
.game-title h1{
  display:block;
  margin:0;
  font:700 12px var(--sans);
  letter-spacing:.04em;
  line-height:1.1;
}
.game-title p{
  margin:4px 0 0;
  color:rgba(244,238,226,.54);
  font:7px var(--mono);
  letter-spacing:.14em;
}
.limit-plaque{
  display:flex;
  align-items:center;
  border:1px solid rgba(244,238,226,.2);
  background:rgba(4,14,10,.42);
}
.limit-plaque span{
  min-width:100px;
  padding:8px 13px;
  border-right:1px solid rgba(244,238,226,.14);
  text-align:center;
  font:500 9px var(--mono);
}
.limit-plaque span:last-child{border-right:0}
.limit-plaque i{
  margin-right:5px;
  color:rgba(244,238,226,.5);
  font-style:normal;
  font-size:7px;
  letter-spacing:.1em;
}
.game-utilities{display:flex;justify-content:flex-end;gap:7px}
.utility-button{
  min-width:68px;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:9px;
  padding:0 10px;
  border:1px solid rgba(244,238,226,.18);
  background:rgba(7,18,13,.54);
  color:var(--cream);
  cursor:pointer;
  font:7px var(--mono);
  letter-spacing:.09em;
}
.utility-button:hover:not(:disabled){border-color:rgba(244,238,226,.58);background:rgba(255,255,255,.06)}
.utility-button:disabled{opacity:.4;cursor:not-allowed}
.utility-button b{color:var(--gold);font-size:7px}
.utility-button--language{min-width:56px}

.casino-layout{
  min-width:0;
  min-height:690px;
  display:grid;
  grid-template-columns:78px minmax(0,1fr) 184px;
}
.chip-rail{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:22px 8px 14px;
  border-right:1px solid var(--game-line);
  background:rgba(3,31,20,.28);
}
.chip-rail>span,.chip-rail>p{
  margin:0;
  color:rgba(244,238,226,.64);
  font:7px var(--mono);
  letter-spacing:.13em;
  text-align:center;
}
.chip-rail>p{font-size:6px;line-height:1.45;color:rgba(244,238,226,.38)}
#chipSelector{
  width:100%;
  display:flex;
  flex:1;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:13px;
  margin:10px 0;
}
#chipSelector button{
  position:relative;
  width:52px;
  height:52px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:50%;
  color:#fff;
  cursor:pointer;
  font:700 11px var(--mono);
  background:
    repeating-conic-gradient(#f1eee8 0 10deg,transparent 10deg 20deg),
    #611594;
  box-shadow:0 5px 9px rgba(0,0,0,.38),inset 0 0 0 5px rgba(255,255,255,.12);
  transition:transform .18s ease,filter .18s ease,box-shadow .18s ease;
}
#chipSelector button:before{
  content:"";
  position:absolute;
  inset:6px;
  z-index:0;
  border:2px dashed rgba(255,255,255,.72);
  border-radius:50%;
  background:#671aa0;
}
#chipSelector button:nth-child(1),#chipSelector button:nth-child(1):before{background-color:#762293}
#chipSelector button:nth-child(2),#chipSelector button:nth-child(2):before{background-color:#1887a8}
#chipSelector button:nth-child(3),#chipSelector button:nth-child(3):before{background-color:#16499c}
#chipSelector button:nth-child(4),#chipSelector button:nth-child(4):before{background-color:#7135ae}
#chipSelector button:nth-child(5),#chipSelector button:nth-child(5):before{background-color:#a41f1b}
#chipSelector button i,#chipSelector button small{position:relative;z-index:1;font-style:normal}
#chipSelector button small{position:absolute;right:11px;bottom:9px;font:6px var(--mono)}
#chipSelector button:hover:not(:disabled){transform:translateY(-2px);filter:brightness(1.12)}
#chipSelector button.active{
  transform:scale(1.11);
  box-shadow:0 0 0 2px var(--cream),0 0 0 6px rgba(223,36,31,.64),0 7px 15px rgba(0,0,0,.48);
}
#chipSelector button:disabled{cursor:not-allowed;filter:grayscale(.5)}

.casino-center{
  min-width:0;
  display:grid;
  grid-template-rows:minmax(340px,52%) minmax(320px,48%);
}
.wheel-panel{
  position:relative;
  min-height:340px;
  overflow:hidden;
  border-bottom:1px solid rgba(244,238,226,.11);
}
.wheel-panel:before{
  content:"";
  position:absolute;
  left:50%;
  bottom:-110px;
  width:min(820px,78%);
  height:240px;
  transform:translateX(-50%);
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(0,0,0,.52),rgba(0,0,0,0) 70%);
  filter:blur(8px);
}
.wheel-stage{
  position:relative;
  width:100%;
  height:100%;
  min-height:340px;
  perspective:1150px;
  perspective-origin:50% 23%;
}
.wheel-shadow{
  position:absolute;
  left:50%;
  top:74%;
  width:min(680px,72%);
  height:82px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:rgba(0,0,0,.54);
  filter:blur(22px);
}
.wheel-shell{
  position:absolute;
  left:50%;
  top:-114px;
  width:min(650px,76%);
  aspect-ratio:1;
  border-radius:50%;
  transform:translateX(-50%) rotateX(52deg) rotateZ(-2deg);
  transform-origin:50% 50%;
  transform-style:preserve-3d;
  background:
    radial-gradient(circle at 34% 25%,rgba(255,255,255,.3),transparent 17%),
    radial-gradient(circle,#2c2d2a 0 7%,#050606 7.4% 12.2%,#c4aa7d 12.7% 14.1%,#111313 14.7% 67%,#d4bf97 67.6% 69.2%,#713016 69.8% 75%,#b95f2d 75.8% 80%,#4b1c0e 81% 87%,#150806 88%);
  box-shadow:0 66px 55px rgba(0,0,0,.72),0 18px 0 #110706,inset 0 0 0 2px rgba(255,235,205,.22);
}
.wheel-shell:after{
  content:"";
  position:absolute;
  z-index:0;
  inset:5.5%;
  border:1px solid rgba(255,235,205,.28);
  border-radius:50%;
  box-shadow:inset 0 0 24px rgba(0,0,0,.9),0 0 0 6px rgba(33,12,7,.58);
  pointer-events:none;
}
.wheel-rim{
  position:absolute;
  inset:2.1%;
  z-index:1;
  border:1px solid rgba(255,222,178,.42);
  border-radius:50%;
  box-shadow:inset 0 0 34px rgba(0,0,0,.92),0 0 0 7px rgba(0,0,0,.36);
}
.wheel-rim:after{
  content:"";
  position:absolute;
  inset:8.5%;
  border:2px solid rgba(211,185,144,.28);
  border-radius:50%;
  box-shadow:0 0 0 6px rgba(0,0,0,.28),inset 0 0 18px rgba(0,0,0,.84);
}
.wheel-rotor{
  position:absolute;
  z-index:2;
  inset:10%;
  overflow:hidden;
  border-radius:50%;
  will-change:transform;
  box-shadow:inset 0 0 0 2px rgba(245,221,184,.38),inset 0 0 38px #000,0 0 0 5px #160b08;
}
.wheel-rotor:before{
  content:"";
  position:absolute;
  z-index:2;
  inset:0;
  border-radius:50%;
  background:repeating-conic-gradient(from -4.865deg,rgba(224,197,157,.75) 0 .6deg,transparent .6deg 9.73deg);
  -webkit-mask:radial-gradient(circle,transparent 0 71%,#000 71.5% 100%);
  mask:radial-gradient(circle,transparent 0 71%,#000 71.5% 100%);
  pointer-events:none;
}
.wheel-rotor:after{
  content:"";
  position:absolute;
  inset:20%;
  border-radius:50%;
  background:
    radial-gradient(circle at 37% 28%,rgba(255,255,255,.2),transparent 17%),
    repeating-conic-gradient(from 0deg,#4b1d0f 0 15deg,#74351d 15deg 30deg);
  box-shadow:inset 0 0 38px rgba(0,0,0,.75),0 0 0 3px rgba(222,194,150,.52),0 0 0 14px rgba(18,6,4,.72);
}
.wheel-slot{position:absolute;z-index:3;inset:0;transform:rotate(var(--slot-angle))}
.wheel-slot span{
  position:absolute;
  left:50%;
  top:4.65%;
  width:21px;
  height:22px;
  display:grid;
  place-items:center;
  transform:translateX(-50%);
  color:#fff;
  font:500 7px var(--mono);
  text-shadow:0 1px 3px #000;
  transition:background .25s ease,box-shadow .25s ease;
}
.wheel-slot.winner span{
  border-radius:50%;
  background:#fff;
  color:#080808;
  box-shadow:0 0 0 3px rgba(255,255,255,.22),0 0 18px rgba(255,255,255,.92);
}
.ball-orbit{
  position:absolute;
  z-index:6;
  inset:10.5%;
  border-radius:50%;
  pointer-events:none;
  will-change:transform;
}
.roulette-ball{
  position:absolute;
  left:50%;
  top:-5px;
  width:13px;
  height:13px;
  border-radius:50%;
  transform:translate(-50%,30px);
  background:radial-gradient(circle at 32% 25%,#fff 0 16%,#e8e4da 34%,#aaa69c 62%,#454545 100%);
  box-shadow:0 5px 8px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.5);
  will-change:transform;
}
.wheel-hub{
  position:absolute;
  z-index:5;
  inset:37%;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:
    radial-gradient(circle at 36% 27%,rgba(255,255,255,.28),transparent 17%),
    radial-gradient(circle,#87502c,#32160e 52%,#080505 73%);
  box-shadow:inset 0 0 22px rgba(0,0,0,.6),0 0 0 1px #c3aa80,0 0 0 9px #100705,0 0 0 10px rgba(238,212,174,.34);
}
.wheel-hub:before{
  content:"";
  position:absolute;
  top:11%;
  width:18%;
  aspect-ratio:1;
  border-radius:50%;
  background:linear-gradient(145deg,#f3f1eb,#6f706e);
  box-shadow:0 2px 5px #000;
}
.wheel-hub span{
  margin-top:11px;
  font-size:clamp(13px,1.45vw,21px);
  font-weight:800;
  letter-spacing:-.06em;
  text-shadow:0 2px 4px #000;
}
.wheel-stage.is-spinning .roulette-ball{filter:brightness(1.15)}
.wheel-caption{
  position:absolute;
  left:50%;
  bottom:13px;
  display:flex;
  align-items:center;
  gap:10px;
  transform:translateX(-50%);
  color:rgba(244,238,226,.52);
  font:7px var(--mono);
  letter-spacing:.14em;
  white-space:nowrap;
}
.wheel-caption i{width:26px;height:1px;background:rgba(244,238,226,.3)}
.round-result-banner{
  position:fixed;
  z-index:154;
  left:50%;
  bottom:128px;
  min-width:250px;
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:2px 18px;
  padding:13px 18px;
  transform:translate(-50%,14px) scale(.96);
  border:1px solid rgba(244,238,226,.34);
  background:rgba(5,13,9,.92);
  color:var(--cream);
  opacity:0;
  pointer-events:none;
  box-shadow:0 18px 55px rgba(0,0,0,.58);
  backdrop-filter:blur(13px);
  transition:opacity .28s ease,transform .28s ease;
}
.round-result-banner.is-visible{opacity:1;transform:translate(-50%,0) scale(1)}
.round-result-banner>span{
  grid-column:1/-1;
  color:rgba(244,238,226,.62);
  font:500 7px var(--mono);
  letter-spacing:.13em;
}
.round-result-banner strong{
  font:800 20px var(--sans);
  letter-spacing:-.035em;
}
.round-result-banner b{
  justify-self:end;
  color:var(--gold);
  font:800 25px var(--sans);
  letter-spacing:-.045em;
}
.round-result-banner[data-outcome="win"]{border-color:rgba(75,213,152,.62);box-shadow:0 18px 55px rgba(0,0,0,.58),0 0 38px rgba(75,213,152,.16)}
.round-result-banner[data-outcome="win"] strong{color:#79e5b2}
.round-result-banner[data-outcome="loss"]{border-color:rgba(223,42,36,.5)}
.round-result-banner[data-outcome="loss"] strong{color:#ff8b86}

.table-panel{
  min-width:0;
  padding:7px 24px 20px;
  background:linear-gradient(180deg,rgba(2,31,20,.03),rgba(2,31,20,.16));
}
.table-heading{
  height:47px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}
.table-heading>div{display:flex;align-items:baseline;gap:10px}
.table-heading span{color:var(--gold);font:7px var(--mono);letter-spacing:.14em}
.table-heading h2{margin:0;font:700 12px var(--sans);letter-spacing:.025em}
.table-heading p{
  max-width:520px;
  margin:0;
  color:rgba(244,238,226,.55);
  font:7px var(--mono);
  line-height:1.45;
  text-align:right;
}
.betting-scroll{width:100%;overflow:visible}
.number-grid{
  position:relative;
  min-width:620px;
  display:grid;
  grid-template-columns:52px repeat(12,minmax(42px,1fr)) 48px;
  grid-template-rows:repeat(3,49px);
  gap:1px;
  border:1px solid rgba(244,238,226,.58);
  background:rgba(244,238,226,.5);
}
.bet-target{
  position:relative;
  border:0;
  background:rgba(3,57,37,.92);
  color:var(--cream);
  cursor:pointer;
  transition:filter .16s ease,box-shadow .16s ease,background .16s ease;
}
.bet-target:hover:not(:disabled),.bet-target:focus-visible,.bet-target.is-preview{
  z-index:7;
  filter:brightness(1.2);
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.85);
}
.bet-target:disabled{cursor:not-allowed;filter:saturate(.65)}
.bet-target.number{font-size:15px;font-weight:700}
.bet-target.number.red{background:#a8221e}
.bet-target.number.black{background:#111416}
.bet-target.zero{
  grid-column:1;
  grid-row:1/4;
  background:#08704a;
  font-size:20px;
  font-weight:700;
}
.bet-target.column{font:500 17px var(--mono);color:rgba(244,238,226,.78)}
.bet-target .bet-marker,.inside-hotspot .bet-marker,.inside-zero-bet .bet-marker{
  position:absolute;
  z-index:24;
  left:50%;
  top:50%;
  width:31px;
  height:31px;
  display:grid;
  place-items:center;
  transform:translate(-50%,-50%);
  border:2px dashed rgba(255,255,255,.88);
  border-radius:50%;
  background:#c52420;
  color:#fff;
  font:500 6px var(--mono);
  font-style:normal;
  box-shadow:0 4px 12px rgba(0,0,0,.62);
  pointer-events:none;
}
.dozen-grid,.outside-grid{
  min-width:524px;
  display:grid;
  gap:1px;
  margin:1px 48px 0 52px;
  background:rgba(244,238,226,.52);
}
.dozen-grid{grid-template-columns:repeat(3,1fr)}
.outside-grid{grid-template-columns:repeat(6,1fr)}
.dozen-grid .bet-target,.outside-grid .bet-target{
  min-height:43px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(3,69,45,.86);
  font:500 9px var(--mono);
  letter-spacing:.07em;
}
.color-bet--red,.color-bet--black{background:rgba(3,69,45,.86)!important}
.color-diamond{
  width:28px;
  height:28px;
  transform:rotate(45deg) scale(.72);
  border:1px solid rgba(255,255,255,.55);
  background:#a8221e;
  box-shadow:inset 0 0 0 2px rgba(0,0,0,.3);
}
.color-bet--black .color-diamond{background:#111416}

.inside-hotspot{
  position:absolute;
  z-index:15;
  width:20px;
  height:20px;
  padding:0;
  border:0;
  border-radius:50%;
  background:transparent;
  color:transparent;
  cursor:pointer;
  transform:translate(-50%,-50%);
}
.inside-hotspot:before{
  content:"";
  position:absolute;
  inset:6px;
  border-radius:50%;
  background:transparent;
  transition:background .14s ease,box-shadow .14s ease;
}
.inside-hotspot:hover:before,.inside-hotspot:focus-visible:before{
  background:#fff;
  box-shadow:0 0 0 4px rgba(223,36,31,.78);
}
.inside-hotspot--street,.inside-hotspot--six-line{width:18px;height:30px}
.inside-hotspot--split{width:26px;height:17px}
.inside-hotspot--corner{width:22px;height:22px}
.betting-scroll>.inside-zero-strip{
  position:static;
  width:auto;
  min-width:620px;
  display:flex;
  align-items:center;
  gap:6px;
  padding:5px 48px 5px 52px;
  border:1px solid rgba(244,238,226,.26);
  border-top:0;
  background:rgba(2,46,30,.52);
}
.betting-scroll>.inside-zero-strip>span{
  margin-right:auto;
  color:rgba(244,238,226,.5);
}
.betting-scroll>.inside-zero-strip .inside-zero-bet{
  position:relative;
  min-height:25px;
  padding:0 9px;
  border:1px solid rgba(244,238,226,.22);
  border-radius:0;
  background:rgba(2,42,27,.82);
  color:rgba(244,238,226,.74);
  cursor:pointer;
  transform:none;
  font:6px var(--mono);
}
.betting-scroll>.inside-zero-strip .inside-zero-bet:hover,
.betting-scroll>.inside-zero-strip .inside-zero-bet:focus-visible{
  border-color:rgba(244,238,226,.8);
  background:rgba(8,112,74,.92);
}

.game-rail{
  min-width:0;
  display:flex;
  flex-direction:column;
  padding:14px 12px 12px;
  border-left:1px solid var(--game-line);
  background:rgba(3,31,20,.31);
}
.wheel-result{
  display:flex;
  flex-direction:column;
  align-items:center;
  padding-bottom:13px;
  border-bottom:1px solid var(--game-line);
  text-align:center;
}
.wheel-result>span,.recent-results>span,.bet-slip__head{
  color:rgba(244,238,226,.55);
  font:7px var(--mono);
  letter-spacing:.13em;
}
.result-number{
  width:62px;
  height:62px;
  display:grid;
  place-items:center;
  margin:10px 0;
  border:1px solid rgba(255,255,255,.22);
  border-radius:50%;
  background:var(--roulette-black);
  font-size:27px;
  font-weight:800;
  letter-spacing:-.07em;
  box-shadow:0 8px 16px rgba(0,0,0,.28);
}
.result-number.red{background:var(--roulette-red)}
.result-number.black{background:#15171a}
.result-number.green{background:var(--roulette-green)}
.result-number.is-empty{background:rgba(3,33,22,.52);color:rgba(244,238,226,.34)}
.wheel-result strong{font:500 8px var(--mono);letter-spacing:.08em;line-height:1.4}
.wheel-result small{
  display:block;
  margin-top:5px;
  color:rgba(244,238,226,.48);
  font:6px var(--mono);
  line-height:1.45;
}
.recent-results{padding:13px 0;border-bottom:1px solid var(--game-line)}
.recent-results>span{display:block;margin-bottom:10px;text-align:center}
#history{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
#history i{
  aspect-ratio:1;
  display:grid;
  place-items:center;
  border:1px solid rgba(244,238,226,.2);
  border-radius:50%;
  color:rgba(244,238,226,.58);
  font:500 7px var(--mono);
  font-style:normal;
}
#history i.red{border-color:rgba(218,47,42,.86);background:rgba(168,34,30,.82);color:#fff}
#history i.black{background:#151719;color:#fff}
#history i.green{border-color:#1b996b;background:#08704a;color:#fff}
.bet-slip{min-height:0;padding:12px 0;border-bottom:1px solid var(--game-line)}
.bet-slip__head{display:flex;justify-content:space-between}
.bet-slip__head small{font:inherit;color:var(--gold)}
.bet-slip__list{
  height:92px;
  margin-top:8px;
  overflow-y:auto;
  padding-right:3px;
  scrollbar-color:rgba(244,238,226,.32) transparent;
  scrollbar-width:thin;
}
.bet-slip__list p{margin:0;color:rgba(244,238,226,.42);font:6px var(--mono);line-height:1.55}
.bet-slip__list ul{display:flex;flex-direction:column;gap:3px;margin:0;padding:0;list-style:none}
.bet-slip__list li{
  display:flex;
  justify-content:space-between;
  gap:8px;
  padding:4px 0;
  border-bottom:1px solid rgba(244,238,226,.08);
  color:rgba(244,238,226,.7);
  font:6px var(--mono);
  line-height:1.3;
}
.bet-slip__list li b{color:#fff;white-space:nowrap}
.table-tools{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  margin-top:auto;
  border:1px solid var(--game-line);
  background:var(--game-line);
}
.table-tools button{
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:7px;
  border:0;
  background:rgba(3,36,23,.96);
  color:var(--cream);
  cursor:pointer;
  font:7px var(--mono);
  line-height:1.25;
}
.table-tools button b{font-size:11px}
.table-tools button:hover:not(:disabled){background:rgba(14,91,60,.95)}
.table-tools button:disabled{color:rgba(244,238,226,.25);cursor:not-allowed}
.table-tools .tool-primary{grid-column:1/-1;background:rgba(8,88,58,.94)}
.spin-button{
  width:104px;
  aspect-ratio:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2px;
  align-self:center;
  margin-top:10px;
  border:5px solid rgba(255,255,255,.22);
  border-radius:50%;
  background:linear-gradient(145deg,#dc2b26,#a91714);
  color:#fff;
  cursor:pointer;
  box-shadow:0 9px 0 #66100e,0 14px 20px rgba(0,0,0,.4),inset 0 0 0 2px rgba(255,255,255,.18);
  transition:transform .18s ease,filter .18s ease;
}
.spin-button i{font:500 29px var(--sans);line-height:.9;font-style:normal}
.spin-button strong{font:800 10px var(--sans);letter-spacing:.05em}
.spin-button:hover:not(:disabled){filter:brightness(1.12);transform:translateY(-2px)}
.spin-button:active:not(:disabled){transform:translateY(4px);box-shadow:0 5px 0 #66100e,0 9px 14px rgba(0,0,0,.4)}
.spin-button:disabled{filter:grayscale(.65) brightness(.55);cursor:not-allowed}

.game-ledger{
  position:fixed;
  z-index:145;
  left:50%;
  width:min(1480px,calc(100% - 36px));
  bottom:0;
  transform:translateX(-50%);
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-template-rows:minmax(78px,auto) 30px;
  align-items:stretch;
  gap:0;
  padding:0;
  border-top:1px solid var(--game-line);
  background:rgba(3,16,11,.96);
  box-shadow:0 -14px 34px rgba(0,0,0,.28);
  backdrop-filter:blur(14px);
}
.ledger-stat{
  min-width:0;
  min-height:78px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  padding:11px 28px;
  border-right:1px solid var(--game-line);
}
.ledger-stat--bet{align-items:center;text-align:center}
.ledger-stat--result{align-items:flex-end;border-right:0;text-align:right}
.ledger-stat span{color:var(--gold);font:500 8px var(--mono);letter-spacing:.15em}
.ledger-stat strong{
  margin-top:3px;
  color:#fff;
  font:800 clamp(24px,2.1vw,32px) var(--sans);
  font-variant-numeric:tabular-nums;
  letter-spacing:-.05em;
}
.ledger-stat>small{
  min-height:10px;
  margin-top:2px;
  color:rgba(244,238,226,.46);
  font:500 6px var(--mono);
  letter-spacing:.09em;
}
.ledger-result-line{display:flex;align-items:center;justify-content:flex-end;gap:10px}
.ledger-result-number{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  flex:0 0 30px;
  margin-top:3px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:50%;
  background:#15171a;
  color:#fff;
  font:700 10px var(--mono);
  font-style:normal;
}
.ledger-result-number.red{background:var(--roulette-red)}
.ledger-result-number.black{background:#15171a}
.ledger-result-number.green{background:var(--roulette-green)}
.ledger-result-number.is-empty{background:rgba(3,33,22,.52);color:rgba(244,238,226,.34)}
.ledger-stat--result[data-outcome="win"] #lastRoundValue{color:#79e5b2;text-shadow:0 0 22px rgba(75,213,152,.24)}
.ledger-stat--result[data-outcome="loss"] #lastRoundValue{color:#ff8b86}
.ledger-stat--result[data-outcome="push"] #lastRoundValue{color:var(--gold)}
#gameStatus{
  grid-column:1/-1;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  margin:0;
  min-height:30px;
  padding:0 14px;
  border-top:1px solid var(--game-line);
  text-align:center;
  font:7px var(--mono);
  letter-spacing:.1em;
}
#gameStatus i{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#4bd598;
  box-shadow:0 0 0 4px rgba(75,213,152,.12);
}
.simulation-strip{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 18px;
  background:#070a08;
  color:rgba(244,238,226,.42);
}
.simulation-strip p{margin:0;font:6px var(--mono);letter-spacing:.11em}

.rules-panel{
  position:absolute;
  z-index:40;
  right:17px;
  top:66px;
  width:min(360px,calc(100% - 34px));
  padding:20px;
  border:1px solid rgba(244,238,226,.26);
  background:rgba(5,18,13,.97);
  box-shadow:0 25px 60px rgba(0,0,0,.5);
}
.rules-panel>div{display:flex;align-items:center;justify-content:space-between;color:var(--gold);font:8px var(--mono);letter-spacing:.12em}
.rules-panel button{border:0;background:transparent;color:#fff;font-size:22px;cursor:pointer}
.rules-panel p{color:rgba(244,238,226,.65);font-size:11px;line-height:1.6}
.rules-panel ul{margin:15px 0 0;padding:0;list-style:none}
.rules-panel li{display:flex;justify-content:space-between;padding:8px 0;border-top:1px solid var(--game-line);font:7px var(--mono);letter-spacing:.07em}
.rules-panel li span{color:rgba(244,238,226,.5)}

.bank-dialog{
  width:min(610px,calc(100% - 28px));
  max-height:calc(100svh - 28px);
  padding:0;
  overflow:auto;
  border:1px solid rgba(244,238,226,.26);
  border-radius:0;
  background:
    radial-gradient(circle at 92% 4%,rgba(223,36,31,.17),transparent 35%),
    #0c100e;
  color:var(--cream);
  box-shadow:0 40px 120px #000;
}
.bank-dialog::backdrop{background:rgba(0,0,0,.86);backdrop-filter:blur(8px)}
.bank-dialog form{position:relative;padding:42px}
.dialog-close{
  position:absolute;
  right:22px;
  top:18px;
  border:0;
  background:transparent;
  color:#aaa;
  font-size:25px;
  cursor:pointer;
}
.bank-dialog form>span{color:var(--gold);font:8px var(--mono);letter-spacing:.14em}
.bank-dialog h2{
  margin:34px 0 20px;
  max-width:470px;
  font-size:clamp(37px,6vw,54px);
  line-height:.9;
  letter-spacing:-.065em;
}
.bank-dialog p{max-width:500px;color:#aaa69f;font-size:13px;line-height:1.65}
.bank-presets{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1px;
  margin-top:28px;
  background:var(--game-line);
}
.bank-presets button{
  height:48px;
  border:0;
  background:#121714;
  color:#fff;
  cursor:pointer;
  font:500 9px var(--mono);
}
.bank-presets button:hover,.bank-presets button.active{background:var(--felt);box-shadow:inset 0 0 0 1px rgba(255,255,255,.5)}
.bank-dialog label{display:block;margin:26px 0 9px;color:#8b8780;font:8px var(--mono);letter-spacing:.14em}
.bank-input-wrap{
  display:grid;
  grid-template-columns:48px 1fr;
  align-items:center;
  border:1px solid var(--game-line);
  background:#070908;
}
.bank-input-wrap>span{
  display:grid;
  place-items:center;
  height:62px;
  border-right:1px solid var(--game-line);
  color:var(--gold);
  font:500 18px var(--mono);
}
.bank-dialog input{
  width:100%;
  height:62px;
  padding:0 18px;
  border:0;
  outline:0;
  background:transparent;
  color:#fff;
  font:500 20px var(--mono);
}
.bank-dialog form>small{display:block;margin-top:8px;color:#77746e;font:7px var(--mono);letter-spacing:.08em}
.dialog-actions{
  display:grid;
  grid-template-columns:1fr 1.55fr;
  gap:1px;
  margin-top:27px;
  background:var(--game-line);
}
.dialog-actions button{
  height:58px;
  border:0;
  cursor:pointer;
  color:#fff;
  font:500 8px var(--mono);
  letter-spacing:.12em;
}
.dialog-cancel{background:#151816}
.dialog-confirm{display:flex;align-items:center;justify-content:space-between;padding:0 18px;background:var(--red)}
.bank-dialog.is-required .dialog-close,
.bank-dialog.is-required .dialog-cancel,
.bank-dialog[data-required="true"] .dialog-close,
.bank-dialog[data-required="true"] .dialog-cancel{display:none}
.bank-dialog.is-required .dialog-actions,
.bank-dialog[data-required="true"] .dialog-actions{grid-template-columns:1fr;background:transparent}

.roulette-footer{height:118px;display:grid;grid-template-columns:1fr 1fr auto;align-items:center}
.roulette-footer>p:nth-child(2){text-align:center;color:var(--grey);font:9px var(--mono);letter-spacing:.18em}
.roulette-footer p{font:9px var(--mono);letter-spacing:.1em}

@media(max-width:1180px){
  body.nav-open{overflow:hidden}
  .roulette-page .roulette-nav{z-index:170;left:0;right:0;transform:none;margin-inline:auto}
  .menu-toggle{display:flex;align-items:center;margin-left:auto;margin-right:18px;position:relative;z-index:2}
  .roulette-nav>.mark,.roulette-nav>#lang{position:relative;z-index:2}
  .roulette-nav nav{
    position:fixed;
    z-index:1;
    inset:0;
    width:100vw;
    height:100svh;
    display:flex!important;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    gap:0;
    padding:100px max(28px,calc((100vw - 900px)/2));
    background:rgba(8,8,8,.985);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-12px);
    transition:opacity .3s ease,visibility .3s ease,transform .3s ease;
  }
  .roulette-nav.is-open nav{opacity:1;visibility:visible;pointer-events:auto;transform:none}
  .roulette-nav nav a{width:100%;display:flex!important;padding:12px 0;border-bottom:1px solid var(--line);font:600 clamp(23px,4.3vw,40px) var(--sans);letter-spacing:-.04em}
  .roulette-nav nav a:after{display:none}
  .game-topbar{grid-template-columns:1fr auto}
  .limit-plaque{display:none}
  .casino-layout{grid-template-columns:70px minmax(0,1fr) 164px}
  .wheel-shell{width:min(610px,78%);top:-95px}
  .game-rail{padding-inline:10px}
}

@media(max-width:880px){
  .roulette-page .roulette-nav{height:75px;width:calc(100% - 28px)}
  .roulette-page .roulette-nav.is-scrolled{height:65px;padding:0 14px}
  .menu-toggle span{display:none}.menu-toggle{margin-right:12px}
  .roulette-nav nav{padding:84px 20px 30px}
  .roulette-nav nav a{padding:10px 0;font-size:clamp(22px,7.4vw,31px)}
  .roulette-arena{padding:75px 0 0}
  .game-shell{
    width:100%;
    min-height:auto;
    grid-template-rows:auto auto auto auto;
    border-left:0;
    border-right:0;
  }
  .game-topbar{min-height:58px;padding:10px 14px;gap:10px}
  .game-title p{display:none}
  .game-utilities{gap:4px}
  .utility-button{min-width:54px;height:32px;padding:0 7px}
  .utility-button span{display:none}
  .casino-layout{display:flex;flex-direction:column;min-height:0}
  .casino-center{display:contents}
  .wheel-panel{order:1;min-height:300px}
  .wheel-stage{min-height:300px;height:300px}
  .wheel-shell{width:min(610px,92vw);top:-96px;transform:translateX(-50%) rotateX(49deg) rotateZ(-2deg)}
  .wheel-shadow{width:78%;top:75%}
  .wheel-caption{bottom:10px}
  .chip-rail{
    order:3;
    flex-direction:row;
    padding:12px 14px;
    border:0;
    border-top:1px solid var(--game-line);
    border-bottom:1px solid var(--game-line);
  }
  .chip-rail>span{width:45px;text-align:left}
  .chip-rail>p{display:none}
  #chipSelector{flex:1;flex-direction:row;justify-content:center;gap:clamp(8px,3vw,18px);margin:0}
  #chipSelector button{width:44px;height:44px}
  #chipSelector button small{right:8px;bottom:7px}
  .table-panel{order:4;padding:8px 14px 18px}
  .table-heading{height:auto;min-height:46px}
  .table-heading p{display:none}
  .game-rail{
    order:2;
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:0 13px;
    padding:11px 14px;
    border:0;
    border-top:1px solid var(--game-line);
    border-bottom:1px solid var(--game-line);
  }
  .wheel-result{grid-row:1/3;padding:0 12px 0 0;border:0;border-right:1px solid var(--game-line)}
  .result-number{width:52px;height:52px;margin:5px 0;font-size:23px}
  .wheel-result small{display:none}
  .recent-results{padding:0;border:0}
  .recent-results>span{text-align:left;margin-bottom:7px}
  #history{display:flex;gap:5px}
  #history i{width:28px;height:28px;aspect-ratio:auto;flex:0 0 28px}
  .bet-slip{min-height:0;padding:9px 0 0;border:0}
  .bet-slip__list{height:43px}
  .bet-slip__list ul{display:grid;grid-template-columns:1fr 1fr;gap:2px 8px}
  .bet-slip__list li{min-width:0;padding:2px 0}
  .table-tools{grid-column:1/-1;grid-template-columns:repeat(4,1fr);margin-top:11px}
  .table-tools .tool-primary{grid-column:auto}
  .table-tools button{min-height:38px;flex-direction:column;gap:2px;font-size:6px}
  .spin-button{grid-column:1/-1;width:100%;height:58px;aspect-ratio:auto;flex-direction:row;margin-top:8px;border-width:2px;border-radius:0;box-shadow:0 5px 0 #66100e,0 9px 16px rgba(0,0,0,.36)}
  .spin-button i{font-size:22px}.spin-button strong{font-size:12px}
  .roulette-page main{padding-bottom:102px}
  .game-ledger{
    left:0;
    right:0;
    bottom:0;
    grid-template-columns:repeat(3,minmax(0,1fr));
    grid-template-rows:minmax(66px,auto) 26px;
    width:100%;
    transform:none;
    padding-bottom:env(safe-area-inset-bottom);
  }
  .ledger-stat{min-height:66px;padding:8px 12px}
  .ledger-stat--balance{align-items:flex-start;text-align:left}
  .ledger-stat--bet{align-items:center;text-align:center}
  .ledger-stat--result{align-items:flex-end;text-align:right}
  .ledger-stat strong{font-size:clamp(18px,4vw,24px)}
  .ledger-stat>small{font-size:5.5px}
  .ledger-result-number{width:26px;height:26px;flex-basis:26px;font-size:8px}
  #gameStatus{min-height:26px;font-size:6px}
  .round-result-banner{bottom:calc(105px + env(safe-area-inset-bottom));min-width:230px;padding:11px 15px}
  .round-result-banner strong{font-size:18px}
  .round-result-banner b{font-size:22px}
  .simulation-strip{min-height:30px;padding-inline:14px}
  .simulation-strip p:first-child{max-width:70%;line-height:1.4}
}

@media(max-width:620px){
  .game-title__mark{display:none}
  .game-title h1{font-size:10px}
  .utility-button{min-width:39px}
  .wheel-panel,.wheel-stage{min-height:260px;height:260px}
  .wheel-shell{width:116vw;top:-150px;transform:translateX(-50%) rotateX(48deg) rotateZ(-2deg)}
  .wheel-slot span{font-size:6px;width:16px;height:18px}
  .roulette-ball{width:9px;height:9px}
  .wheel-caption{bottom:7px}
  .chip-rail{padding-inline:8px}
  .chip-rail>span{display:none}
  #chipSelector{justify-content:space-between;gap:4px}
  #chipSelector button{width:41px;height:41px;font-size:9px}
  .table-panel{padding-inline:7px}
  .table-heading{padding-inline:5px}
  .table-heading>div{gap:7px}
  .table-heading h2{font-size:10px}
  .betting-scroll{overflow-x:hidden}
  .number-grid{min-width:0;width:100%;grid-template-columns:34px repeat(12,minmax(0,1fr)) 31px;grid-template-rows:repeat(3,45px)}
  .bet-target.number{font-size:10px}
  .bet-target.zero{font-size:15px}
  .bet-target.column{font-size:12px}
  .bet-target .bet-marker,.inside-hotspot .bet-marker,.inside-zero-bet .bet-marker{width:27px;height:27px;font-size:5px}
  .inside-hotspot{width:17px;height:17px}
  .inside-hotspot--street,.inside-hotspot--six-line{width:16px;height:24px}
  .inside-hotspot--split{width:20px;height:15px}
  .betting-scroll>.inside-zero-strip{
    width:100%;
    min-width:0;
    gap:3px;
    padding:5px 31px 5px 34px;
  }
  .betting-scroll>.inside-zero-strip>span{display:none}
  .betting-scroll>.inside-zero-strip .inside-zero-bet{
    flex:1 1 0;
    min-width:0;
    padding-inline:3px;
    font-size:5px;
  }
  .dozen-grid,.outside-grid{min-width:0;margin-left:34px;margin-right:31px}
  .dozen-grid .bet-target,.outside-grid .bet-target{min-height:38px;font-size:6px}
  .color-diamond{width:21px;height:21px}
  .game-rail{grid-template-columns:95px minmax(0,1fr);padding-inline:8px}
  #history i{width:25px;height:25px;flex-basis:25px;font-size:6px}
  .table-tools button span{font-size:5.5px;letter-spacing:0}
  .ledger-stat{padding-inline:7px}
  .ledger-stat span{font-size:6px;letter-spacing:.08em}
  .ledger-stat strong{font-size:clamp(16px,5.2vw,21px)}
  .ledger-stat>small{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .ledger-result-line{gap:5px}
  .ledger-result-number{width:23px;height:23px;flex-basis:23px}
  .round-result-banner{width:calc(100% - 32px);min-width:0;bottom:calc(105px + env(safe-area-inset-bottom))}
  .simulation-strip p:last-child{display:none}
  .simulation-strip p:first-child{max-width:100%;font-size:5.5px}
  .bank-dialog form{padding:32px 20px 24px}
  .bank-dialog h2{margin-top:29px;font-size:36px}
  .bank-presets{grid-template-columns:1fr 1fr}
  .dialog-actions{grid-template-columns:1fr}
  .dialog-actions button{height:52px}
  .roulette-footer{grid-template-columns:1fr;text-align:center;height:auto;padding:42px 0;gap:25px}
}

@media(max-width:380px){
  .ledger-stat{padding-inline:5px}
  .ledger-stat strong{font-size:clamp(12px,4vw,16px);letter-spacing:-.04em;white-space:nowrap}
  .ledger-result-line{gap:3px}
  .ledger-result-number{width:19px;height:19px;flex-basis:19px;font-size:6px}
  .round-result-banner{width:calc(100% - 20px);padding-inline:10px}
  .round-result-banner span{font-size:6px;letter-spacing:.08em}
  .round-result-banner strong{font-size:16px}
  .round-result-banner b{font-size:18px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  .round-result-banner{transition:none}
}