/* Roulette screen styles (neon design). Kept in their own file so the roulette design can change without touching style.css.
   Palette: bg #07090C, panels #10141A, accent #F26B2A, neon cyan #19E3FF and magenta #FF2D78, win #5FD39A, loss #E5544B, zero #14B87E. */
.rl-wrap { --rl-cyan: #19E3FF; --rl-mag: #FF2D78; --rl-win: #5FD39A; --rl-loss: #E5544B; --rl-zero: #14B87E; }
.rl-wrap .panel { padding: 12px; margin: 0 0 10px; }
.rl-wrap h2 { margin: 16px 0 8px; }
.rl-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.rl-top .back { margin: 0; }
.rl-pill { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px 6px 8px; border-radius: 999px; border: 1px solid rgba(242,107,42,.55); background: rgba(242,107,42,.1); font-size: 15px; }
.rl-pill .coin { width: 22px; height: 22px; }
.rl-pill b { font-weight: 700; }
.rl-pill span { color: #F26B2A; font-weight: 700; font-size: 12px; letter-spacing: .08em; }

.rl-wheelband { display: flex; align-items: center; gap: 8px; padding: 7px 12px; margin-bottom: 10px; border-radius: 12px; font-size: 12px; font-weight: 600; color: #d6dbe3;
  background: rgba(25,227,255,.06); border: 1px solid rgba(25,227,255,.35); }
.rl-wheelband.live { background: rgba(242,107,42,.12); border-color: rgba(242,107,42,.55); color: var(--brass-hi); animation: rl-pulse2 1.6s ease-in-out infinite; }
.rl-wheel-ico { flex: none; font-size: 15px; }
@keyframes rl-pulse2 { 0%, 100% { box-shadow: 0 0 0 rgba(242,107,42,0); } 50% { box-shadow: 0 0 14px rgba(242,107,42,.45); } }
@media (prefers-reduced-motion: reduce) { .rl-wheelband.live { animation: none; } }

.rl-hero { position: relative; overflow: hidden; border-radius: 18px; min-height: 130px; padding: 14px; display: flex; align-items: flex-end; margin-bottom: 10px;
  background: linear-gradient(90deg, rgba(7,9,12,.92) 8%, rgba(7,9,12,.35) 65%, rgba(7,9,12,0) 100%), url(img/roulette/banner-mia.jpg) 78% 25% / cover no-repeat, #10141A;
  border: 1px solid rgba(25,227,255,.35); box-shadow: 0 0 26px rgba(25,227,255,.12), inset 0 1px 0 rgba(255,255,255,.08); }
.rl-hero > div { max-width: 64%; }
.rl-hero small { display: block; font-weight: 700; font-size: 10px; letter-spacing: .22em; color: var(--rl-cyan); text-shadow: 0 0 10px rgba(25,227,255,.6); }
.rl-hero h1 { margin: 3px 0 4px; font-size: 21px; line-height: 1.05; text-shadow: 2px 0 rgba(25,227,255,.45), -2px 0 rgba(255,45,120,.45); }
.rl-hero p { margin: 0; font-size: 11.5px; line-height: 1.35; color: #c4cad4; }

.rl-dealer { display: flex; gap: 10px; align-items: center; padding: 8px 12px 8px 8px; margin-bottom: 10px; border-radius: 16px; background: linear-gradient(135deg, #151a22, #0d1117); border: 1px solid rgba(255,255,255,.1); }
.rl-croupier { width: 48px; height: 48px; flex: none; border-radius: 13px; object-fit: cover; object-position: top; background: #0a0e14; border: 1px solid rgba(25,227,255,.5); box-shadow: 0 0 16px rgba(25,227,255,.25); }
.rl-say { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.rl-say b { font-size: 16px; }
.rl-say > span { font-size: 11.5px; font-weight: 600; color: var(--rl-cyan); }
.rl-say p { margin: 4px 0 0; font-size: 13.5px; line-height: 1.35; color: #e6e9ee; }
.rl-say p.rl-win { color: var(--rl-win); font-weight: 600; }
.rl-say p.muted { color: #b4bbc6; }

.rl-n { display: inline-flex; align-items: center; justify-content: center; min-width: 34px; height: 34px; border-radius: 50%; font-weight: 700; font-size: 14px; color: #fff; border: 1px solid rgba(255,255,255,.18); background: #1b1b1f; }
.rl-n.red { background: rgba(216,30,91,.32); border-color: var(--rl-mag); box-shadow: inset 0 0 10px rgba(255,45,120,.18); }
.rl-n.black { background: rgba(25,227,255,.09); border-color: var(--rl-cyan); box-shadow: inset 0 0 10px rgba(25,227,255,.12); }
.rl-n.green { background: var(--rl-zero); border-color: #3de5ac; }
.rl-n.idle { background: var(--night-2); color: var(--muted); }
.rl-n.sm { min-width: 26px; height: 26px; font-size: 12px; }
.rl-n.big, .rl-n.spin { min-width: 84px; height: 84px; font-size: 34px; background-color: #07090C; }
.rl-n.big { box-shadow: 0 0 0 3px rgba(242,107,42,.55), 0 0 26px rgba(242,107,42,.45); }
.rl-n.big.red, .rl-n.spin.red { background-image: linear-gradient(rgba(216,30,91,.5), rgba(216,30,91,.5)); }
.rl-n.big.black, .rl-n.spin.black { background-image: linear-gradient(rgba(25,227,255,.16), rgba(25,227,255,.16)); }
.rl-n.big.green, .rl-n.spin.green { background-image: linear-gradient(var(--rl-zero), var(--rl-zero)); }
.rl-n.spin { opacity: .85; }

.rl-stage { position: relative; overflow: hidden; text-align: center; padding: 10px 10px 8px; margin-bottom: 10px; border-radius: 18px; background: radial-gradient(circle at 50% 38%, rgba(25,227,255,.1), rgba(7,9,12,0) 62%), #0d1117; border: 1px solid rgba(255,255,255,.08); }
.rl-reactfloat { position: absolute; inset: 0; pointer-events: none; z-index: 2; }
.rl-react-fly { position: absolute; bottom: 36%; font-size: 22px; animation: rl-fly 1.6s ease-out forwards; }
@keyframes rl-fly { 0% { transform: translate(0, 0) scale(.6); opacity: 0; } 15% { opacity: 1; transform: translate(0, 0) scale(1.1); } 100% { transform: translate(var(--rl-drift, 0), -120px) scale(1); opacity: 0; } }
.rl-reactions { display: flex; justify-content: center; gap: 10px; margin-top: 8px; position: relative; z-index: 1; }
.rl-react-btn { border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.04); border-radius: 999px; width: 34px; height: 34px; font-size: 17px; line-height: 1; cursor: pointer; transition: transform .12s; -webkit-tap-highlight-color: transparent; }
.rl-react-btn:active { transform: scale(.85); }
@media (prefers-reduced-motion: reduce) { .rl-react-fly { animation: none; opacity: 0; } }
.rl-wheelbox { position: relative; width: min(220px, 62%); aspect-ratio: 1; margin: 0 auto; }
.rl-wheel { display: block; width: 100%; height: 100%; filter: drop-shadow(0 0 18px rgba(25,227,255,.35)); animation: rl-turn 30s linear infinite; }
.rl-wheel.spin { animation: rl-turn .65s linear infinite, rl-glow 1.1s ease-in-out infinite; }
.rl-ball { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: center; }
.rl-ball .idle { min-width: 52px; height: 52px; font-size: 22px; background: rgba(7,9,12,.85); }
.rl-ball .big, .rl-ball .spin { min-width: 58px; height: 58px; font-size: 24px; }
.rl-ball .big { animation: rl-drop .45s cubic-bezier(.34,1.56,.64,1), rl-pulse 1.1s ease-in-out 1; }
@keyframes rl-turn { to { transform: rotate(360deg); } }
@keyframes rl-glow { 0%, 100% { filter: drop-shadow(0 0 20px rgba(255,45,120,.5)); } 50% { filter: drop-shadow(0 0 36px rgba(255,45,120,.85)); } }
@keyframes rl-drop { 0% { transform: translate(-50%, -160%) scale(.5); opacity: 0; } 65% { transform: translate(-50%, -46%) scale(1.1); opacity: 1; } 100% { transform: translate(-50%, -50%) scale(1); } }
@keyframes rl-pulse { 0%, 100% { box-shadow: 0 0 0 3px rgba(242,107,42,.55), 0 0 26px rgba(242,107,42,.45); } 50% { box-shadow: 0 0 0 6px rgba(242,107,42,.85), 0 0 42px rgba(242,107,42,.75); } }
@keyframes rl-fadeup { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .rl-wheel, .rl-wheel.spin, .rl-ball .big, .rl-res { animation: none !important; } }
.rl-last { display: flex; flex-wrap: wrap; gap: 5px; justify-content: center; margin-top: 8px; }

.rl-res { margin-top: 12px; padding: 10px 14px; border-radius: 16px; text-align: left; background: #10141A; border: 1px solid rgba(255,255,255,.1); animation: rl-fadeup .35s ease; }
.rl-res small { display: block; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: #9aa3b0; }
.rl-amt { display: flex; align-items: center; gap: 10px; margin-top: 4px; }
.rl-amt .coin { width: 30px; height: 30px; }
.rl-amt b { font-size: 30px; line-height: 1; font-weight: 600; }
.rl-res.win { border-color: rgba(95,211,154,.5); box-shadow: 0 0 20px rgba(95,211,154,.18); }
.rl-res.win b { color: var(--rl-win); text-shadow: 0 0 14px rgba(95,211,154,.5); }
.rl-res.lose b { color: var(--rl-loss); }
.rl-amt em { margin-left: auto; font-style: normal; font-weight: 700; font-size: 13px; letter-spacing: .12em; color: var(--rl-mag); border: 1.5px solid var(--rl-mag); border-radius: 6px; padding: 2px 8px; transform: rotate(-6deg); text-shadow: 0 0 8px rgba(255,45,120,.6); }

.rl-win { color: var(--brass-hi); font-weight: 600; }
.rl-table { background: linear-gradient(180deg, rgba(25,227,255,.04), rgba(255,45,120,.04)), #0d1117; border-color: rgba(255,255,255,.1); }

/* сворачиваемая панель выбора ставки — классическая раскладка стола (0 слева, 12×3 сетка, "2 to 1" справа) */
.rl-table > summary.rl-bets-sum { display: flex; align-items: center; gap: 8px; cursor: pointer; list-style: none; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); padding: 2px 2px 4px; -webkit-tap-highlight-color: transparent; }
.rl-bets-sum::-webkit-details-marker, .rl-bets-sum::marker { display: none; content: ""; }
.rl-bets-sum > span:first-child { flex: none; }
.rl-pick-info { flex: 1; min-width: 0; text-align: right; text-transform: none; letter-spacing: normal; font-size: 12.5px; color: #d6dbe3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rl-chev { flex: none; font-style: normal; transition: transform .2s; color: #F26B2A; }
.rl-table[open] .rl-chev { transform: rotate(180deg); }
.rl-table > *:not(summary) { margin-top: 8px; }

.rl-cgrid { display: grid; grid-template-columns: 30px 1fr 30px; gap: 4px; }
.rl-zerocol { display: flex; flex-direction: column; gap: 3px; }
.rl-zerocol .rl-n { flex: 1; width: 100%; height: auto; min-width: 0; border-radius: 8px 3px 3px 8px; cursor: pointer; font-family: inherit; font-size: 11px; }
.rl-numcols { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: 3px; }
.rl-numcols .rl-n.rl-cell { min-width: 0; width: 100%; height: 28px; border-radius: 5px; cursor: pointer; font-family: inherit; font-size: 11px; transition: transform .1s; }
.rl-numcols .rl-n.rl-cell:active { transform: scale(.9); }
.rl-colbets { display: flex; flex-direction: column; gap: 3px; }
.rl-colbet { flex: 1; min-width: 0; border-radius: 3px 8px 8px 3px; border: 1px solid rgba(25,227,255,.45); background: rgba(25,227,255,.05); color: #d6dbe3; font-weight: 700; font-size: 10px; cursor: pointer; font-family: inherit; }
.rl-dozens { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; margin: 4px 34px 0 !important; }
.rl-dozbtn { height: 30px; border-radius: 7px; border: 1px solid rgba(25,227,255,.45); background: rgba(25,227,255,.05); color: #d6dbe3; font-weight: 600; font-size: 11.5px; cursor: pointer; font-family: inherit; }
.rl-evenrow { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 4px; margin: 4px 34px 0 !important; }
.rl-evenrow button { height: 30px; border-radius: 7px; border: 1px solid rgba(25,227,255,.45); background: rgba(25,227,255,.05); color: #d6dbe3; font-weight: 600; font-size: 11px; cursor: pointer; font-family: inherit; }
.rl-diamond { padding: 0; display: flex; align-items: center; justify-content: center; }
.rl-diamond::after { content: ""; width: 13px; height: 13px; border-radius: 3px; transform: rotate(45deg); }
.rl-diamond.red::after { background: var(--rl-mag); box-shadow: 0 0 8px rgba(255,45,120,.6); }
.rl-diamond.black::after { background: #0a0e14; border: 1px solid var(--rl-cyan); box-shadow: 0 0 8px rgba(25,227,255,.4); }
.rl-n.on, .rl-colbet.on, .rl-dozbtn.on, .rl-evenrow button.on { outline: 2px solid #F26B2A; outline-offset: 1px; box-shadow: 0 0 14px rgba(242,107,42,.55); background: var(--brass-bg); border-color: rgba(242,107,42,.7); color: var(--brass-hi); }
.rl-diamond.on::after { box-shadow: 0 0 12px rgba(242,107,42,.8); }

.rl-chips { display: flex; justify-content: space-between; align-items: center; gap: 4px; margin: 10px 0; }
.rl-chipbtn { flex: 1; display: flex; justify-content: center; padding: 4px 0; border: 0; background: transparent; cursor: pointer; border-radius: 50%; transition: transform .12s; -webkit-tap-highlight-color: transparent; }
.rl-chipbtn:active { transform: scale(.9); }
.rl-chipbtn:focus-visible { outline: 2px solid #F26B2A; outline-offset: 2px; }
.rl-chip { display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 50%; }
.rl-chip img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 4px 8px rgba(0,0,0,.55)); }
.rl-chip i { font-style: normal; font-weight: 700; font-size: 15px; color: #fff; width: 100%; height: 100%; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  border: 3px dashed rgba(255,255,255,.75); box-shadow: inset 0 0 0 3px rgba(0,0,0,.25), 0 4px 10px rgba(0,0,0,.5); background: #7d8795; }
.rl-chip.c5 i, .rl-chip.c0\.5 i { background: #1f9d6f; }
.rl-bet .btn { box-shadow: 0 0 22px rgba(242,107,42,.35); }
.rl-bet .coin-btn, .rl-bet .coin-btn:hover { background: #F26B2A; color: #140803; border-color: transparent; font-weight: 700; }
.rl-bet .coin-btn:hover { background: #FF7D3D; }
.rl-bet .coin-btn:disabled { opacity: .6; }

/* итог раунда прямо на колесе + конфетти автореакций */
.rl-over { position: absolute; left: 50%; top: 64%; z-index: 3; display: none; pointer-events: none; }
.rl-over.show { display: block; transform: translateX(-50%); animation: rl-pop .5s cubic-bezier(.34, 1.56, .64, 1) both; }
.rl-over-in { position: relative; display: flex; align-items: center; gap: 8px; padding: 6px 14px 6px 8px; border-radius: 999px; white-space: nowrap; background: rgba(7, 9, 12, .84); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); border: 1.5px solid rgba(255, 255, 255, .25); }
.rl-over .coin { width: 24px; height: 24px; }
.rl-over b { font-size: 24px; line-height: 1; font-weight: 700; }
.rl-over.win .rl-over-in { border-color: rgba(95, 211, 154, .85); box-shadow: 0 0 22px rgba(95, 211, 154, .5); }
.rl-over.win b { color: var(--rl-win); text-shadow: 0 0 12px rgba(95, 211, 154, .6); }
.rl-over.lose .rl-over-in { border-color: rgba(229, 84, 75, .6); box-shadow: 0 0 14px rgba(229, 84, 75, .25); }
.rl-over.lose b { color: var(--rl-loss); }
.rl-over em { position: absolute; top: -13px; right: -10px; font-style: normal; font-weight: 700; font-size: 11px; letter-spacing: .12em; color: var(--rl-mag); background: rgba(7, 9, 12, .9); border: 1.5px solid var(--rl-mag); border-radius: 6px; padding: 1px 6px; transform: rotate(-8deg); text-shadow: 0 0 8px rgba(255, 45, 120, .6); }
@keyframes rl-pop { 0% { opacity: 0; transform: translateX(-50%) scale(.5); } 60% { opacity: 1; transform: translateX(-50%) scale(1.12); } 100% { opacity: 1; transform: translateX(-50%) scale(1); } }
.rl-wheelbox.win .rl-wheel { filter: drop-shadow(0 0 30px rgba(95, 211, 154, .75)); }
.rl-conf { position: absolute; top: 28%; width: 7px; height: 11px; border-radius: 2px; opacity: 0; animation: rl-conf 1.5s ease-out forwards; }
@keyframes rl-conf { 0% { opacity: 1; transform: translate(0, 0) rotate(0); } 100% { opacity: 0; transform: translate(var(--rl-dx, 0), 190px) rotate(var(--rl-rot, 360deg)); } }
@media (prefers-reduced-motion: reduce) { .rl-over.show { animation: none; } .rl-conf { display: none; } }

/* ---- крупнее и контрастнее текст, ярче цвета, фишки с деталями (только оформление) ---- */
.rl-wrap { --muted: #c2c9d4; --muted-2: #aab2bf; }
.rl-wrap .small { font-size: 14px; }
.rl-wrap .muted { color: #c2c9d4; }
.rl-hero p { font-size: 13px; color: #e1e5eb; }
.rl-say > span { font-size: 12.5px; }
.rl-say p { font-size: 15px; color: #f2f4f7; }
.rl-say p.muted { color: #d0d6df; }
.rl-bet .f > span { font-size: 12.5px; letter-spacing: .1em; color: #d3d9e2; }
.rl-bet .in { font-size: 19px; font-weight: 600; color: #fff; }
.rl-bet .seg button { font-size: 14.5px; font-weight: 600; color: #f2f4f7; border-color: rgba(255, 255, 255, .28); }
.rl-bet .coin-btn { font-size: 17px; }
.rl-table > summary.rl-bets-sum { font-size: 12.5px; color: #d3d9e2; }
.rl-pick-info { font-size: 14px; color: #fff; }
.rl-numcols .rl-n.rl-cell { height: 30px; font-size: 13px; font-weight: 800; }
.rl-zerocol .rl-n { font-size: 13px; font-weight: 800; }
.rl-colbet { font-size: 12px; color: #fff; border-color: rgba(25, 227, 255, .75); background: rgba(25, 227, 255, .12); }
.rl-dozbtn, .rl-evenrow button { font-size: 13px; color: #fff; border-color: rgba(25, 227, 255, .75); background: rgba(25, 227, 255, .12); }
.rl-n.sm { min-width: 28px; height: 28px; font-size: 13px; font-weight: 800; }
.rl-wrap .list-row b { font-size: 15px; }

/* цвета казино: красное, чёрное, зелёное зеро; неоновое свечение остаётся */
.rl-n.red { background: #d3172b; border-color: #ff6672; color: #fff; box-shadow: inset 0 0 10px rgba(255, 255, 255, .18), 0 0 9px rgba(255, 60, 75, .5); }
.rl-n.black { background: #14161b; border-color: #b4bccb; color: #fff; box-shadow: inset 0 0 10px rgba(255, 255, 255, .1), 0 0 8px rgba(190, 200, 220, .28); }
.rl-n.green { background: #0ea35f; border-color: #5ff0ae; color: #fff; box-shadow: inset 0 0 10px rgba(255, 255, 255, .18), 0 0 10px rgba(18, 217, 143, .55); }
.rl-n.idle { background: var(--night-2); box-shadow: none; }
.rl-n.big.red, .rl-n.spin.red { background-image: linear-gradient(rgba(211, 23, 43, .8), rgba(211, 23, 43, .8)); }
.rl-n.big.black, .rl-n.spin.black { background-image: linear-gradient(rgba(255, 255, 255, .07), rgba(255, 255, 255, .07)); }
.rl-n.big.green, .rl-n.spin.green { background-image: linear-gradient(#0ea35f, #0ea35f); }
.rl-wheelbox { filter: saturate(1.2) brightness(1.05); }

/* фишки в цветах казино, у всех одинаковые детали: кромка с пятнами, внутреннее кольцо, пунктир, блик, свечение своего цвета */
.rl-chip { width: 56px; height: 56px; }
.rl-wrap .rl-chip i { position: relative; isolation: isolate; --cb: #8c96a3; --cr: #e9edf2; --ce: #ffffff; --cs: #b9c1cc; --cg: rgba(185, 193, 204, .5); --ct: #fff;
  font-style: normal; font-weight: 800; font-size: 17px; color: var(--ct); text-shadow: 0 1px 3px rgba(0, 0, 0, .7);
  border: 0; background: radial-gradient(circle, var(--cb) 0 53%, var(--cr) 54% 58%, transparent 59%), repeating-conic-gradient(var(--ce) 0 15deg, var(--cs) 15deg 45deg);
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, .4), 0 5px 12px rgba(0, 0, 0, .6), 0 0 16px var(--cg); }
.rl-wrap .rl-chip i::before { content: ""; position: absolute; inset: 2px; border-radius: 50%; pointer-events: none; z-index: 1; background: linear-gradient(150deg, rgba(255, 255, 255, .45), rgba(255, 255, 255, 0) 42%, rgba(0, 0, 0, .18)); }
.rl-wrap .rl-chip i::after { content: ""; position: absolute; inset: 10px; border-radius: 50%; pointer-events: none; border: 1.5px dashed rgba(255, 255, 255, .55); }
.rl-wrap .rl-chip.c0\.1 i { --cb: #8c96a3; --cr: #e9edf2; --cs: #b9c1cc; --cg: rgba(185, 193, 204, .5); }
.rl-wrap .rl-chip.c0\.5 i { --cb: #e0559a; --cr: #ffd0e6; --cs: #ff7eb6; --cg: rgba(255, 126, 182, .6); }
.rl-wrap .rl-chip.c1 i { --cb: #f6f6f1; --cr: #2f6fe0; --ce: #2f6fe0; --cs: #f6f6f1; --cg: rgba(255, 255, 255, .55); --ct: #14284d; text-shadow: 0 1px 0 rgba(255, 255, 255, .8); }
.rl-wrap .rl-chip.c1 i::after { border-color: rgba(47, 111, 224, .6); }
.rl-wrap .rl-chip.c5 i { --cb: #d71f2f; --cr: #ffd0d4; --cs: #e8283a; --cg: rgba(255, 60, 70, .6); }
.rl-wrap .rl-chip.c10 i { --cb: #1c64d6; --cr: #cfe3ff; --cs: #2e7bf0; --cg: rgba(60, 140, 255, .6); }
.rl-wrap .rl-chip.c50 i { --cb: #12934f; --cr: #c6f6dc; --cs: #17b862; --cg: rgba(40, 220, 120, .6); }
.rl-wrap .rl-chip.c100 i { --cb: #16181d; --cr: #9aa3b0; --cs: #2a2d35; --cg: rgba(200, 210, 225, .4); }
.rl-wrap .rl-chip.c500 i { --cb: #6d2bb8; --cr: #e2ccff; --cs: #8a3fe0; --cg: rgba(160, 90, 255, .6); }
.rl-wrap .rl-chip.c1000 i { --cb: #c8921a; --cr: #fff1c0; --cs: #f0b92e; --cg: rgba(255, 200, 60, .65); --ct: #3b2603; text-shadow: 0 1px 0 rgba(255, 255, 255, .55); }

/* колесо крутится рукой: вращением управляет скрипт, тут только курсор и запрет прокрутки при перетаскивании */
.rl-wheelbox { cursor: grab; touch-action: none; -webkit-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; }
.rl-wheelbox.grab { cursor: grabbing; }
.rl-wheel { animation: none !important; will-change: transform; -webkit-user-drag: none; pointer-events: none; }
.rl-wheel.spin { animation: rl-glow 1.1s ease-in-out infinite !important; }

/* вёрстка не прыгает при результате: место под строки заранее, итог не шире колеса */
.rl-say p { min-height: 2.7em; }
.rl-last { flex-wrap: nowrap; overflow: hidden; height: 30px; margin-top: 8px; }
.rl-last .rl-n { flex: none; }
.rl-over { max-width: calc(100vw - 48px); }
@media (max-width: 380px) {
  .rl-over-in { gap: 6px; padding: 5px 10px 5px 6px; }
  .rl-over b { font-size: 19px; }
  .rl-over .coin { width: 20px; height: 20px; }
  .rl-over em { font-size: 10px; right: -6px; }
}

/* две кнопки под колесом: «Ставка» (раскрывает компактную карусель фишек) и «Крутить» */
.rl-ctl { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 8px; margin: 0 0 6px; }
.rl-ctl-stake { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 1px; min-height: 52px; padding: 6px 12px; border-radius: 14px; cursor: pointer; font-family: inherit; color: #fff;
  background: rgba(25, 227, 255, .08); border: 1.5px solid rgba(25, 227, 255, .6); box-shadow: 0 0 14px rgba(25, 227, 255, .2); }
.rl-ctl-stake .rl-ctl-cap { font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: #bfeff7; }
.rl-ctl-stake .rl-ctl-val { font-size: 17px; font-weight: 700; white-space: nowrap; }
.rl-ctl-stake .rl-ctl-val i { font-style: normal; display: inline-block; font-size: 12px; transition: transform .2s; }
.rl-ctl-stake.open .rl-ctl-val i { transform: rotate(180deg); }
.rl-ctl-stake:focus-visible, .rl-ctl-go:focus-visible { outline: 2px solid var(--brass-hi); outline-offset: 2px; }
.rl-ctl-go, .rl-ctl-go:hover { min-height: 52px; margin: 0; font-size: 17px; font-weight: 700; background: #F26B2A; color: #140803; border-color: transparent; animation: rl-cta 1.6s ease-in-out infinite; }
.rl-ctl-go:disabled { opacity: .65; animation: none; }
@keyframes rl-cta { 0%, 100% { box-shadow: 0 0 0 0 rgba(242, 107, 42, .65), 0 0 18px rgba(242, 107, 42, .35); } 50% { box-shadow: 0 0 0 7px rgba(242, 107, 42, 0), 0 0 28px rgba(242, 107, 42, .65); } }
.rl-hint { display: flex; align-items: center; justify-content: flex-end; gap: 6px; margin: 0 4px 10px; font-size: 12.5px; font-weight: 600; color: #ffd7bd; text-align: right; }
.rl-hint-ico { display: inline-block; animation: rl-point 1s ease-in-out infinite; }
@keyframes rl-point { 0%, 100% { transform: translateY(-3px); } 50% { transform: translateY(2px); } }

/* компактная карусель фишек: одна строка, листается пальцем */
.rl-bet { padding: 8px 10px !important; }
.rl-car { display: flex; align-items: center; gap: 6px; overflow-x: auto; scroll-snap-type: x proximity; padding: 4px 2px 6px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.rl-car::-webkit-scrollbar { display: none; }
.rl-car > * { flex: none; scroll-snap-align: center; }
.rl-carbtn { height: 34px; min-width: 40px; padding: 0 10px; border-radius: 17px; border: 1px solid rgba(255, 255, 255, .3); background: rgba(255, 255, 255, .06); color: #f2f4f7; font: 600 13px inherit; font-family: inherit; cursor: pointer; }
.rl-car .rl-chipbtn { flex: none; padding: 2px; }
.rl-wrap .rl-car .rl-chip { width: 42px; height: 42px; }
.rl-wrap .rl-car .rl-chip i { font-size: 13px; }
.rl-wrap .rl-car .rl-chip i::after { inset: 8px; }
.rl-stakein { display: flex; align-items: center; gap: 10px; margin-top: 2px; }
.rl-stakein .in { width: 110px; flex: none; min-height: 36px; padding: 4px 10px; font-size: 17px; }
.rl-stakein .small { min-width: 0; }
@media (prefers-reduced-motion: reduce) { .rl-ctl-go, .rl-hint-ico { animation: none; } }
