/* Royal Roulette 3D: navy and bright gold. */
.g-stage[data-game="roulette"]{padding:.4rem;background:#050b24}
.rl-wrap{position:relative;width:100%;height:min(84vh,900px);min-height:480px;border-radius:16px;overflow:hidden;background:radial-gradient(120% 90% at 50% 10%,#3a0b1c,#12061a 55%,#050b24);border:2px solid #E8B923;box-shadow:0 0 0 1px #021F54,0 18px 50px rgba(2,10,40,.6);touch-action:none;user-select:none;-webkit-user-select:none;color:#F7E7CE;font-family:system-ui,Arial,sans-serif}
@media (max-width:700px){.rl-wrap{height:calc(100vh - 20px);height:calc(100dvh - 20px);min-height:520px;border-radius:12px}}
.rl-wrap.is-full,.rl-wrap:fullscreen{height:100vh;height:100dvh;border-radius:0;border:0}
.rl-wrap.is-full{position:fixed;inset:0;z-index:9999}
.rl-cv{position:absolute;inset:0;width:100%;height:100%;display:block;outline:none;cursor:pointer}
.rl-top{position:absolute;top:8px;left:8px;right:8px;display:flex;flex-wrap:wrap;gap:6px;align-items:flex-start;pointer-events:none}
.rl-pill{padding:.3rem .7rem;border-radius:999px;background:linear-gradient(180deg,rgba(11,37,69,.92),rgba(2,15,50,.92));border:1.5px solid #E8B923;color:#FFD54F;font:800 1rem/1.2 system-ui,Arial;white-space:nowrap;box-shadow:0 2px 10px rgba(0,0,0,.45)}
.rl-pill strong{color:#FFE680}
.rl-corner{margin-left:auto;display:flex;gap:6px;pointer-events:auto}
.rl-cbtn{min-width:48px;min-height:48px;padding:0 .7rem;border-radius:12px;border:2px solid #E8B923;background:linear-gradient(180deg,#14306e,#061642);color:#FFD54F;font:800 1rem system-ui,Arial;cursor:pointer}
.rl-cbtn:focus-visible,.rl-chip:focus-visible{outline:3px solid #FFE680;outline-offset:2px}
.rl-hist{position:absolute;top:62px;left:8px;max-width:min(62%,520px);pointer-events:none}
.rl-hist ol{list-style:none;margin:0;padding:0;display:flex;gap:4px;flex-wrap:wrap}
.rl-hist li{min-width:2rem;height:2rem;padding:0 .2rem;border-radius:8px;display:flex;align-items:center;justify-content:center;font:900 .95rem system-ui,Arial;color:#F7E7CE;border:1.5px solid #E8B923;box-shadow:0 2px 6px rgba(0,0,0,.5)}
.rl-hist li.r{background:#a3101f}.rl-hist li.k{background:#111522}.rl-hist li.g{background:#0b7a3e}
.rl-hist li:first-child{transform:scale(1.15);box-shadow:0 0 12px #FFD54F}
.rl-hc{margin:.35rem 0 0;display:flex;gap:.8rem;font:800 .85rem system-ui,Arial;color:#FFD54F;text-shadow:0 1px 3px #000}
.rl-hc b{color:#F7E7CE;font-weight:700}
.rl-banner{position:absolute;left:50%;top:24%;transform:translate(-50%,-50%) scale(.6);opacity:0;transition:opacity .35s,transform .35s;pointer-events:none;text-align:center;padding:.8rem 1.6rem;border-radius:18px;background:radial-gradient(circle,rgba(20,40,100,.95),rgba(2,10,40,.95));border:3px solid #FFD54F;box-shadow:0 0 40px rgba(255,199,44,.55)}
.rl-banner.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.rl-banner b{display:block;font:900 3.2rem/1 Georgia,serif;color:#FFE680}
.rl-banner b.r{color:#ff5a6a}.rl-banner b.g{color:#47e08a}
.rl-banner span{display:block;margin-top:.3rem;font:800 1.15rem system-ui,Arial;color:#F7E7CE}
.rl-bot{position:absolute;left:6px;right:6px;bottom:6px;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 10px;padding:6px;border-radius:14px;background:linear-gradient(180deg,rgba(5,15,50,.55),rgba(2,8,30,.9));border:1.5px solid rgba(232,185,35,.6)}
.rl-chips{display:flex;gap:6px}
.rl-chip{width:54px;height:54px;border-radius:50%;cursor:pointer;font:900 1rem system-ui,Arial;color:#fffbe8;border:4px dashed rgba(255,250,235,.85);box-shadow:0 0 0 3px #1b1b1b inset,0 3px 8px rgba(0,0,0,.6);text-shadow:0 1px 2px #000}
.rl-chip.c1{background:#8b8f9a}.rl-chip.c5{background:#b3122a}.rl-chip.c25{background:#13733d}.rl-chip.c100{background:#191c26}.rl-chip.c500{background:#5b2a9c}.rl-chip.cmax{background:radial-gradient(circle,#FFF3B0 0 40%,#FFC400 41%);color:#3a2600;text-shadow:none;border-color:#7a5200;font-size:.85rem}
.rl-chip[aria-pressed="true"]{transform:translateY(-4px) scale(1.08);box-shadow:0 0 0 3px #1b1b1b inset,0 0 0 3px #FFD54F,0 0 16px #FFD54F}
.rl-acts{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.rl-acts .btn{min-height:50px;font-size:1.02rem;white-space:nowrap}
.rl-spin{min-width:130px;font-size:1.3rem!important}
.rl-acts .btn[disabled]{opacity:.45}
.rl-fine{flex-basis:100%;margin:0;text-align:center;font:700 .85rem system-ui,Arial;color:#FFD54F}
.rl-wrap[data-phase="spin"] .rl-bot{opacity:.55;pointer-events:none}
.rl-nogl{position:absolute;inset:20% 10%;padding:1rem;border-radius:14px;background:#0b2545;border:2px solid #E8B923;color:#F7E7CE}
@media (max-width:520px){.rl-top{gap:4px;flex-wrap:nowrap;top:6px;left:6px;right:6px}.rl-corner{margin-left:auto;gap:4px;flex:0 0 auto}.rl-cbtn{min-width:40px;min-height:40px;padding:0 .4rem;font-size:.8rem}.rl-hist{top:52px}.rl-hc{font-size:.75rem}.rl-bot{gap:6px 5px;padding:6px}.rl-acts{display:contents}.rl-chips{order:1;gap:4px;flex:0 0 auto;justify-content:center}.rl-chip{width:44px;height:44px;font-size:.9rem}.rl-acts .rl-spin,#rl-refill{order:2;flex:1 1 96px;min-width:96px;min-height:50px;font-size:1.2rem!important}#rl-refill{font-size:.85rem!important;line-height:1.1}.rl-acts .btn.alt{order:3;flex:1 1 calc(25% - 5px);min-width:0;min-height:54px;padding:.2rem .1rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font-size:.92rem;line-height:1.05;white-space:nowrap}.rl-acts .rl-ic{font-size:1.05rem;line-height:1}.rl-fine{order:4;flex-basis:100%;text-align:center;font-size:.75rem;margin:0}.rl-pill{font-size:.78rem;padding:.2rem .45rem}.rl-winp{display:none}.rl-hist{max-width:96%}.rl-hist li{min-width:1.7rem;height:1.7rem;font-size:.8rem}.rl-banner b{font-size:2.6rem}}
@media (max-height:520px) and (orientation:landscape){.rl-wrap{height:calc(100dvh - 10px);min-height:300px}.rl-pill{font-size:.85rem}.rl-cbtn{min-height:42px}.rl-bot{left:auto;right:6px;top:60px;width:206px;flex-direction:column;flex-wrap:nowrap;bottom:6px;justify-content:flex-end;gap:5px}.rl-chips{flex-wrap:wrap;justify-content:center;gap:4px}.rl-chip{width:42px;height:42px;font-size:.85rem}.rl-acts{display:grid;grid-template-columns:1fr 1fr;gap:4px;width:100%}.rl-acts .btn{min-height:40px;padding:.2rem .3rem;font-size:.9rem}.rl-acts .rl-spin,#rl-refill{grid-column:1/3;min-width:0}.rl-fine{font-size:.7rem}.rl-hist li{min-width:1.6rem;height:1.6rem}}

/* site Top button: the game has its own controls on phones; keep it off the table and the side panel */
@media (max-width:900px),(max-height:520px),(pointer:coarse){body.pg-roulette .btt{display:none!important}}
.rl-ic{display:inline-block}
/* phones: the table runs edge to edge (no page gutters) so the layout and controls get the full width */
@media (max-width:520px){.pg-roulette .g-stage[data-game="roulette"]{margin-left:-20px;margin-right:-20px;padding:0;border-left:0;border-right:0;border-radius:0}.pg-roulette .rl-wrap{border-radius:0}.rl-bot{left:4px;right:4px;bottom:4px}}
@media (max-height:520px) and (orientation:landscape){.rl-acts .btn.alt{min-height:50px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;line-height:1.05;padding:.2rem .1rem;font-size:.92rem}.rl-acts .rl-ic{font-size:1rem}}
@media (min-width:521px) and (min-height:521px){.rl-acts .btn{padding-left:.75rem;padding-right:.75rem}.rl-acts .btn.alt{min-width:0}}
@media (max-width:520px){.rl-top{flex-wrap:wrap;gap:5px}.rl-top>.rl-pill{flex:1 1 auto;min-width:0;text-align:center;font-size:.9rem;padding:.3rem .5rem;overflow:hidden;text-overflow:ellipsis}.rl-top{flex-wrap:nowrap}.rl-corner{flex:0 0 auto;margin-left:0;gap:5px}.rl-corner .rl-cbtn{min-height:44px;min-width:44px;font-size:.95rem}.rl-hist{top:58px}}
@media (max-width:370px){.rl-top>.rl-pill{font-size:.82rem;padding:.3rem .4rem}}

/* Nov 2026: 3-letter labels (100, 500, Max) fit inside the chip on phones */
.rl-chip{padding:0;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}
.rl-chip.c100,.rl-chip.c500,.rl-chip.cmax{font-size:.82rem;letter-spacing:-.03em}