/* Ruleta del bis (js/ruleta.js): el cilindro, el cartel del bis que salió y las chispas.
   La usan la web (index.html) y el panel del staff (staff.html). Usa los colores de cada página (--disp, --gold2…). */
.wheel{position:relative;height:300px;perspective:900px;touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none;
  -webkit-mask-image:linear-gradient(transparent,#000 28%,#000 72%,transparent);mask-image:linear-gradient(transparent,#000 28%,#000 72%,transparent)}
.wheel:active{cursor:grabbing}
.wheel.fija,.wheel.fija:active{cursor:default}
.wheel .sel{position:absolute;left:0;right:0;top:50%;height:58px;transform:translateY(-50%);border-block:1px solid rgba(227,176,75,.6);background:rgba(227,176,75,.08);border-radius:12px;pointer-events:none}
.cyl{position:absolute;inset:0;transform-style:preserve-3d}
.cyl div{position:absolute;left:0;right:0;top:50%;height:58px;margin-top:-29px;display:flex;align-items:center;justify-content:center;text-align:center;font-family:var(--disp);font-size:clamp(24px,4vw,32px);letter-spacing:1px;color:#8d93a5;backface-visibility:hidden;transition:color .2s;white-space:nowrap;overflow:hidden;padding:0 12px}
.cyl div.on{color:#fff;text-shadow:0 0 18px rgba(246,213,138,.8)}

/* cartel "el bis es…" encima de la ruleta (toca para cerrar) */
.bisWin{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:20px;background:radial-gradient(ellipse at center,rgba(92,58,18,.92),rgba(6,7,11,.96) 70%);opacity:0;pointer-events:none;transition:opacity .4s;cursor:pointer}
.bisWin.on{opacity:1;pointer-events:auto}
.bisWin small{font-size:13px;letter-spacing:5px;color:var(--gold2);font-weight:700}
.bisWin b{font-family:var(--disp);font-weight:400;font-size:clamp(54px,10vw,130px);line-height:.9;margin:4px 0 10px;padding:.14em .04em 0;background:linear-gradient(180deg,#fff 0%,#f6d58a 55%,#c48f2c 100%);-webkit-background-clip:text;background-clip:text;color:transparent;transform:scale(.6);transition:transform .7s cubic-bezier(.2,1.6,.4,1)}
.bisWin.on b{transform:none}
.bisWin span{font-size:13px;color:#e9d9b4}

.spark{position:fixed;width:7px;height:7px;border-radius:50%;pointer-events:none;z-index:400}
