/* Mesas nuevas (ruletas, Three Card Poker, Caribbean Stud, Sic Bo, Keno, Raspa y Gana). Móvil vertical primero.
   Todo lo provisional (fieltro, cartas, dados, fichas) se reemplaza solo cuando Andrés deja su arte en arte_casino/<clave>/. */
.lobby.mesa-nueva{max-width:520px;padding-left:.5rem;padding-right:.5rem}
.escena{border:1px solid #3a3322;border-radius:var(--r);padding:.7rem .6rem 1rem;background:radial-gradient(700px 400px at 50% 0,#12331f 0,#07140c 70%);overflow:hidden}
.escena.con-fondo{background-size:cover;background-position:center;background-repeat:no-repeat;box-shadow:inset 0 0 0 100vmax #00000066}
.escena h2{text-align:center;margin:.2rem 0 .4rem;font-size:1.3rem}
.esc-ruleta_americana{background:radial-gradient(700px 400px at 50% 0,#14402a 0,#06130b 70%)}
.esc-ruleta_francesa{background:radial-gradient(700px 400px at 50% 0,#1c2a66 0,#080b20 70%)}
.esc-tres_cartas{background:radial-gradient(700px 400px at 50% 0,#0f5c36 0,#041a0f 70%)}
.esc-caribe{background:radial-gradient(700px 400px at 50% 0,#0b6070 0,#031d23 70%)}
.esc-sicbo{background:radial-gradient(700px 400px at 50% 0,#7a0f12 0,#210406 70%)}
.esc-keno{background:radial-gradient(700px 400px at 50% 0,#43207a 0,#100520 70%)}
.esc-raspa{background:radial-gradient(700px 400px at 50% 0,#0f6b4a 0,#031a12 70%)}
.escena .suave,.escena label{text-shadow:0 1px 3px #000}
.fieltro{background:#0b3d1d;border:3px solid var(--oro2);border-radius:12px;padding:8px;background-size:cover;background-position:center}
.fieltro.con-mesa{background-color:transparent}
.fch{position:relative}
.fch span{pointer-events:none;text-shadow:0 1px 3px #000}
.fch.con-arte{border:0!important;background-color:transparent!important}
.fm{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);min-width:24px;height:24px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#ffd54a 45%,#b8860b);color:#1a1200;font:700 .62rem Segoe UI,sans-serif;display:grid;place-items:center;border:2px dashed #7a5a00;pointer-events:none;padding:0 2px;writing-mode:horizontal-tb;z-index:4}
.rt-botones{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;justify-content:center;margin:.4rem 0}
.gana-n{box-shadow:0 0 0 3px var(--oro) inset,0 0 14px var(--oro);animation:late .5s infinite alternate;z-index:2}
.pierde-n{opacity:.55}

/* ruleta */
.rt-rueda{text-align:center}
.rt-rueda canvas{width:100%;max-width:300px;aspect-ratio:1;display:block;margin:0 auto}
.rt-mesa{display:grid;grid-template-columns:40px repeat(3,1fr) 46px;grid-template-rows:42px repeat(12,38px) 38px;gap:3px;user-select:none;margin-top:.4rem}
.rt-ceros{display:flex;gap:3px}
.rt-ceros .rt-c{flex:1}
.rt-c,.rt-x,.rt-z{position:relative;display:grid;place-items:center;border:1px solid #ffffff33;border-radius:5px;color:#fff;font:700 .9rem Georgia,serif;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
.rt-c.rojo,.rt-x.rojo{background:var(--rojo)}.rt-c.negro,.rt-x.negro{background:#111}.rt-c.verde{background:#0b6b2e}
.rt-x{background:#0e4a24;font-size:.7rem;letter-spacing:.03em}
.rt-x.vert{writing-mode:vertical-rl;transform:rotate(180deg)}
.rt-x.vert .fm{transform:translate(-50%,-50%) rotate(180deg)}
.rt-c:hover,.rt-x:hover{outline:2px solid var(--oro);z-index:2}
.rt-n{position:relative}
.hs{position:absolute;z-index:3;width:18px;height:18px;border-radius:50%;background:#ffffff14;border:0;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
.hs:hover,.hs:active{background:#ffc627aa}
.hs-d{right:-11px;top:50%;margin-top:-9px}.hs-b{bottom:-11px;left:50%;margin-left:-9px}.hs-e{right:-11px;bottom:-11px}
.hs-c{left:-11px;top:50%;margin-top:-9px}.hs-l{left:-11px;bottom:-11px}
.rt-ceros-lista{display:flex;flex-wrap:wrap;gap:4px;justify-content:center;margin:.5rem 0}
.rt-z{background:#0e4a24;padding:.25rem .5rem;font-size:.75rem;min-width:52px}
.rt-z small{display:block;font:.55rem Segoe UI,sans-serif;color:#ffe27a}

/* cartas */
.cartas-m{display:flex;justify-content:center;gap:.35rem;min-height:84px;margin-top:.3rem}
.cm{flex:0 1 64px;aspect-ratio:5/7;border-radius:7px;background-size:cover;background-position:center;box-shadow:0 3px 10px #000a;display:inline-flex;flex-direction:column;align-items:center;justify-content:center}
.cartas-m.n5 .cm{flex-basis:56px}
.cm.con-arte{background-repeat:no-repeat}
.cm.papel{background:#fdf8ea;color:#111;border:1px solid #bbb;font-family:Georgia,serif}
.cm.papel b{font-size:1.35rem}.cm.papel i{font-style:normal;font-size:1.25rem;line-height:1}
.cm.papel.roja{color:#c62828}
.cm.dorso{background:repeating-linear-gradient(45deg,#7a1010,#7a1010 6px,#5a0c0c 6px,#5a0c0c 12px);border:2px solid var(--oro2)}
.mano-m{margin:.5rem 0;text-align:center}
.cartas-mesa .resultado{margin-bottom:0}
#apuestas label{margin:.5rem 0 .1rem}
#apuestas .fichas-sel{margin:.3rem 0}

/* dados */
.dados-fila{display:flex;justify-content:center;gap:.8rem;padding:.4rem}
.dados-fila.agitar .dado{animation:vibrar .12s infinite alternate}
.dado{display:inline-grid;grid-template:repeat(3,1fr)/repeat(3,1fr);width:64px;height:64px;padding:9px;gap:2px;background:linear-gradient(145deg,#fff8e8,#e6dcc2);border-radius:13px;box-shadow:0 4px 10px #000a,inset 0 -3px 0 #0002}
.dado i{border-radius:50%}.dado i.p{background:radial-gradient(circle at 35% 30%,#555,#000)}
.dado.con-arte{display:inline-block;background-color:transparent;background-repeat:no-repeat;box-shadow:none;padding:0}
.sb-dados{padding:.4rem}
.sb-mesa{margin-top:.5rem}
.sb-mesa h3{color:var(--oro);font-size:.8rem;margin:.6rem 0 .25rem;letter-spacing:.06em}
.sb-g2,.sb-g1,.sb-g5,.sb-g6,.sb-g7{display:grid;gap:3px}
.sb-g2{grid-template-columns:1fr 1fr}.sb-g1{grid-template-columns:1fr;margin-top:3px}.sb-g5{grid-template-columns:repeat(5,1fr)}.sb-g6{grid-template-columns:repeat(6,1fr)}.sb-g7{grid-template-columns:repeat(7,1fr)}
.sb{position:relative;min-height:44px;border-radius:6px;background:#14502a;color:#fff;border:1px solid #ffffff33;display:flex;flex-direction:column;align-items:center;justify-content:center;font:700 .85rem Georgia,serif;padding:2px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.sb small{font:.55rem Segoe UI,sans-serif;color:#ffe27a}
.sb.ancha{min-height:52px;font-size:.95rem;background:#7a1010}
.sb.dadobtn .dado{width:36px;height:36px;padding:4px;gap:1px;border-radius:8px}
.sb:hover{outline:2px solid var(--oro)}

/* keno */
.kn-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:4px}
.kn{aspect-ratio:1;border-radius:50%;background:#2b2b3a;color:#ddd;border:1px solid #6a5acd66;font:700 clamp(.7rem,3.5vw,1rem) Georgia,serif;padding:0;-webkit-tap-highlight-color:transparent;background-size:cover}
.kn.sel{background:#6a1b9a;color:#fff;border-color:var(--oro)}
.kn.sale{outline:2px solid #fff;transform:scale(1.1);background-color:#4a4a66;background-image:var(--bola,none)}
.kn.sel.sale.acierto{background-color:var(--oro);color:#1a1200;box-shadow:0 0 12px var(--oro)}
.kn-n{display:inline-flex;align-items:center;gap:.3rem;margin:0;text-transform:none;letter-spacing:0;font-size:.8rem}
.kn-n select{width:auto;padding:.3rem .4rem}

/* raspa y gana */
.rs-boleto{position:relative;max-width:420px;margin:.6rem auto;background:linear-gradient(160deg,#ffe27a,#f0b429);border:4px solid #b8860b;border-radius:16px;padding:.9rem;color:#4a1a00;background-size:cover;background-position:center}
.rs-boleto .resultado{margin-bottom:0;text-shadow:none;color:#4a1a00}
.rs-boleto .suave{color:#6b3a00;text-shadow:none}
.rs-cab{font:700 1.3rem Georgia,serif;text-align:center;color:#8e1a1a;letter-spacing:.1em}
.rs-zona{position:relative;aspect-ratio:3/2;margin:.6rem 0}
.rs-celdas{display:grid;grid-template:repeat(2,1fr)/repeat(3,1fr);height:100%;border:2px solid #7b5a00;border-radius:10px;overflow:hidden;background:#fff6d6}
.rs-celda{display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid #d9b95c}
.rs-m{font:700 clamp(1.1rem,6vw,1.8rem) Georgia,serif;color:#8e1a1a}
.rs-v{font-size:.7rem}
.rs-celda.gana-n{background:#ffe27a}
#rs-cv{position:absolute;inset:0;width:100%;height:100%;touch-action:none;border-radius:10px;cursor:crosshair}
.mesa-bj{max-width:520px;padding:14px 10px 18px!important;background-size:cover;background-position:center;box-shadow:inset 0 0 0 100vmax #00000033}
.mesa-bj .cartas{gap:.3rem}
.mesa-bj .cm{flex:0 1 60px}

/* GIRAR de las ruletas americana y francesa: entre la rueda y la mesa */
.rt-medio{margin:.5rem 0 .2rem}
.rt-medio .btn{min-width:60%}
