/* Dragon Tiger Royal y Andar Bahar Royal: mesa de crupier vista desde el asiento del jugador. Móvil vertical primero (~390 px de ancho, ~664 de alto útil).
   Orden fijo: mesa del crupier → botón Repartir → apuestas → fichas. Borde de cuero acolchado con costura, fieltro con luz de lámpara, zapato y bandeja de fichas
   dibujados por código; el arte de Andrés (fondo, mesa, crupier, zapato) se pone encima solo cuando existe. */
.as-pantalla{background:var(--rp-fondo,none) center/cover no-repeat,radial-gradient(520px 380px at 50% 0,#3a1a1066 0,#0000 70%),linear-gradient(180deg,#0b0605,#150b08 60%,#060302)}
.as-ab{background:var(--rp-fondo,none) center/cover no-repeat,radial-gradient(520px 380px at 50% 0,#6a102055 0,#0000 70%),linear-gradient(180deg,#0d0506,#1a0a0c 60%,#070304)}
.as-escena{flex:1 1 auto;min-height:150px;display:flex;flex-direction:column;padding:.25rem .45rem 0;gap:.2rem;position:relative;z-index:2}

/* historial de la sesión */
.as-hist{flex:none;height:24px;display:flex;align-items:center;justify-content:space-between;gap:.4rem;padding:0 .15rem}
.as-bolas{display:flex;gap:3px;min-width:0;overflow:hidden}
.as-bolas i{flex:none;display:grid;place-items:center;width:19px;height:19px;border-radius:50%;font:700 .6rem Georgia,serif;font-style:normal;color:#fff;box-shadow:inset 0 1px 2px #fff6,0 1px 2px #000a;border:1px solid #fff5}
.as-bolas i.dragon,.as-bolas i.andar{background:radial-gradient(circle at 35% 30%,#ff7a6e,#c4161c 60%,#6e0a0a)}
.as-bolas i.tiger,.as-bolas i.bahar{background:radial-gradient(circle at 35% 30%,#7fb6ff,#1f5fbf 60%,#0d2f6e)}
.as-bolas i.empate{background:radial-gradient(circle at 35% 30%,#8be29a,#2e8b3e 60%,#0e4a1c)}
.as-pcts{display:flex;gap:.5rem;flex:none;font:600 .66rem "Segoe UI",system-ui;color:#cdbf98;white-space:nowrap}
.as-pcts b{font-family:Georgia,serif}.as-pcts .dragon b,.as-pcts .andar b{color:#ff8b80}.as-pcts .tiger b,.as-pcts .bahar b{color:#8fc0ff}.as-pcts .empate b{color:#8be29a}
.as-vacio{font:600 .68rem "Segoe UI",system-ui;color:#8f866c}

/* la mesa */
.as-mesa{--cw:60px;position:relative;flex:1;min-height:120px;padding:9px;border-radius:28px;
  background:linear-gradient(145deg,#4a2c18,#1c0f08 38%,#2f1a0d 70%,#120804);box-shadow:0 14px 30px #000d,inset 0 2px 2px #fff2,inset 0 -3px 6px #000a}
.as-mesa::before{content:"";position:absolute;inset:4px;border-radius:24px;border:1.5px dashed #e8c77a77;pointer-events:none;z-index:2}
.as-fieltro{position:relative;width:100%;height:100%;border-radius:19px;overflow:hidden;border:2px solid #d4a62a;
  background:radial-gradient(90% 80% at 50% 35%,#13705a 0,#0b4a3c 52%,#052a22 100%);box-shadow:inset 0 0 40px #000c,inset 0 0 0 2px #0007}
.as-ab .as-fieltro{background:radial-gradient(90% 80% at 50% 35%,#7a1426 0,#52091a 52%,#2a0410 100%)}
.as-pantalla.con-mesa .as-fieltro{background:var(--rp-mesa) center/cover}
.as-fieltro::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.45;mix-blend-mode:overlay;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .5  0 0 0 0 .5  0 0 0 0 .5  0 0 0 .55 0'/></filter><rect width='160' height='160' filter='url(%23n)'/></svg>")}
.as-fieltro::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(75% 55% at 50% 12%,#ffe7a54d 0,#0000 72%),radial-gradient(120% 100% at 50% 50%,#0000 58%,#000a 100%)}
.as-trazos{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.as-marca{position:absolute;left:50%;top:62%;height:56%;aspect-ratio:1;transform:translate(-50%,-50%);opacity:.1;pointer-events:none}
.as-crupier{position:absolute;left:50%;top:-4%;height:46%;transform:translateX(-50%);filter:drop-shadow(0 6px 8px #000a);pointer-events:none}
.as-bandeja{position:absolute;left:7px;top:5px;width:68px;z-index:2;filter:drop-shadow(0 3px 3px #000a)}
.as-bandeja svg{display:block;width:100%;height:auto}
.as-zapato{position:absolute;top:2px;width:76px;z-index:2;filter:drop-shadow(0 4px 4px #000b)}
.as-zapato svg,.as-zapato img{display:block;width:100%;height:auto}
.as-dt .as-zapato{left:50%;transform:translateX(-50%)}
.as-ab .as-zapato{right:6px;width:68px}

/* sitios de las cartas */
.as-sitio{position:absolute;z-index:3;display:flex;flex-direction:column;align-items:center;gap:3px;perspective:800px}
.as-rotulo{font:700 .66rem Georgia,serif;letter-spacing:.14em;text-transform:uppercase;color:#f3dca0;text-shadow:0 1px 2px #000}
.as-dragon .as-rotulo,.as-andar .as-rotulo{color:#ff9d92}.as-tiger .as-rotulo,.as-bahar .as-rotulo{color:#9ccaff}
.as-hueco{position:relative;width:var(--cw);height:calc(var(--cw)*1.4);border-radius:6px;border:1.5px dashed #e2b53a88;background:#0003;perspective:800px}
.as-hueco .as-carta{position:absolute;inset:0;width:100%;height:100%}
.as-sitio.gano .as-rotulo{color:#fff2a8;text-shadow:0 0 8px #ffc627}
.as-dt .as-dragon{left:5%;top:34%;width:42%}.as-dt .as-tiger{right:5%;top:34%;width:42%}
.as-dt .as-vs{position:absolute;left:50%;top:64%;width:15%;aspect-ratio:1;transform:translate(-50%,-50%);z-index:2;opacity:.85}
.as-dt .as-vs img{display:block;width:100%;height:100%;filter:drop-shadow(0 2px 4px #000a)}
.as-ab .as-jk{left:50%;top:4px;transform:translateX(-50%);flex-direction:row;gap:5px}
.as-ab .as-jk .as-rotulo{writing-mode:vertical-rl;transform:rotate(180deg);font-size:.55rem}
.as-fila-ab{position:absolute;left:23%;right:2%;z-index:3;perspective:800px}
.as-ab .as-andar{top:36%;height:29%}.as-ab .as-bahar{top:68%;height:29%}
.as-fila-ab .as-rotulo{position:absolute;right:100%;top:50%;transform:translateY(-50%);margin-right:7px;font-size:.7rem}
.as-fila-ab.gano{box-shadow:0 0 0 1.5px #ffc627cc,0 0 14px #ffc62788;border-radius:6px;background:#ffc62714}
.as-cartas{position:relative;height:100%}
.as-cartas .as-carta{position:absolute;top:50%;margin-top:calc(var(--cw)*-.7);width:var(--cw);transition:transform .5s cubic-bezier(.3,.7,.3,1),left .25s}
.as-carta.brilla{box-shadow:0 0 0 2px #ffc627,0 0 16px #ffc627cc}
.as-carta.rp-giro.brilla .cara.frente{box-shadow:0 0 0 2px #ffc627,0 0 16px #ffc627cc}

/* quién ganó */
.as-aviso{position:absolute;z-index:6;display:flex;flex-direction:column;align-items:center;gap:0;background:#000d;border:1px solid #ffc627aa;border-radius:12px;padding:.14rem .8rem;white-space:nowrap;color:#ffe9a8;font:700 .86rem Georgia,serif;text-shadow:0 1px 3px #000;box-shadow:0 4px 12px #000b}
.as-aviso small{font:600 .62rem "Segoe UI",system-ui;color:#cdbf98;letter-spacing:.03em}
.as-aviso.dragon,.as-aviso.andar{border-color:#ff8b80;color:#ffd2cc}.as-aviso.tiger,.as-aviso.bahar{border-color:#8fc0ff;color:#cfe4ff}.as-aviso.empate{border-color:#8be29a;color:#d4ffdc}
.as-dt .as-aviso{left:50%;bottom:6px;transform:translateX(-50%)}
.as-ab .as-aviso{left:6px;top:30px;padding:.08rem .4rem;font-size:.7rem;max-width:92px;white-space:normal;text-align:center;line-height:1.15}
.as-aviso.va{animation:as-sale .45s cubic-bezier(.2,1.4,.4,1)}
@keyframes as-sale{from{opacity:0;scale:.6}to{opacity:1;scale:1}}
.as-dato{flex:none;min-height:46px;display:flex;align-items:center;justify-content:center;flex-direction:column}
.as-dato .rj-res{margin:0;width:100%;max-width:24rem}
.as-dato .rj-c{padding:.18rem .2rem}
.as-pista-txt{font:600 .76rem "Segoe UI",system-ui;text-align:center;color:#cdbf98;padding:0 .5rem}

/* botón entre la mesa y las apuestas */
.as-mando{flex:none;display:flex;gap:.55rem;align-items:center;justify-content:center;padding:.3rem .6rem .4rem;position:relative;z-index:6}
.as-repartir{flex:1;max-width:250px;font-size:1rem;padding:.5rem 1rem;letter-spacing:.06em;text-transform:uppercase;display:flex;gap:.5rem;justify-content:center;align-items:baseline}
.as-repartir b{font-size:.9rem;letter-spacing:0}
.as-lado{width:38px;height:38px;padding:0;border-radius:50%;font-size:1.15rem;line-height:1;display:grid;place-items:center}

/* apuestas */
.as-apuestas{flex:none;position:relative;z-index:3;margin:0 .45rem;padding:.4rem .35rem .3rem;border-radius:16px;display:flex;flex-direction:column;gap:4px;
  background:radial-gradient(120% 120% at 50% 0,#0f5a48,#0a3f33 60%,#062a22);border:2px solid #b8860b99;box-shadow:inset 0 0 22px #000a,0 6px 16px #000a}
.as-ab .as-apuestas{background:radial-gradient(120% 120% at 50% 0,#661022,#470a17 60%,#2a050d)}
.as-fila{display:grid;gap:4px}.as-fila.f1{grid-template-columns:1fr}.as-fila.f2{grid-template-columns:repeat(2,1fr)}.as-fila.f3{grid-template-columns:1fr 1.05fr 1fr}.as-fila.f5{grid-template-columns:repeat(5,1fr)}
.as-c{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:58px;padding:.15rem .15rem;border-radius:10px;color:#f5ecd2;overflow:hidden;
  background:linear-gradient(180deg,#ffffff18,#0000 55%),#0b3d34;border:1px solid #d4a62a88;font:700 .8rem Georgia,serif;line-height:1.1;text-align:center;touch-action:manipulation}
.as-c:active{transform:translateY(1px);filter:brightness(1.2)}
.as-c .as-ct{font-size:.86rem}
.as-c em{font:700 .68rem "Segoe UI",system-ui;font-style:normal;color:#ffc627}
.as-c.dragon,.as-c.andar{background:linear-gradient(180deg,#ffffff1c,#0000 55%),#7a1420;border-color:#ff8b80aa}
.as-c.tiger,.as-c.bahar{background:linear-gradient(180deg,#ffffff1c,#0000 55%),#14336e;border-color:#8fc0ffaa}
.as-c.empate{background:linear-gradient(180deg,#ffffff1c,#0000 55%),#0e5a24;border-color:#8be29aaa}
.as-c.palo{min-height:34px;background:linear-gradient(180deg,#ffffff14,#0000 55%),#2a2208;border-color:#ffc627}
.as-c.palo{flex-direction:row;gap:.5rem}
.as-c.palo .as-ap{margin:0}
.as-c.banda{min-height:46px;background:linear-gradient(180deg,#ffffff14,#0000 55%),#3a0a14}
.as-c.banda .as-ct{font-size:.84rem}
.as-c.con{border-color:#ffc627;box-shadow:0 0 0 1px #ffc627aa,0 0 10px #ffc62766}
.as-c.gana{border-color:#fff2a8;box-shadow:0 0 0 2px #ffc627,0 0 16px #ffc627;animation:as-pulso .8s ease-in-out 3}
.as-c.media{border-color:#cdbf98;box-shadow:0 0 0 1px #cdbf9899}
@keyframes as-pulso{50%{filter:brightness(1.5)}}
.as-c .as-ap{display:flex;pointer-events:none;margin-top:1px}
.as-c .as-ap:empty{display:none}
.as-c .as-ap>b{font:700 .62rem Georgia,serif;background:linear-gradient(180deg,#ffe58a,#c99a2a);border-radius:999px;padding:0 7px;color:#1a1200;box-shadow:0 1px 3px #000a;white-space:nowrap}
.as-c .as-pila{position:absolute;right:5px;bottom:3px;--t:22px;height:44px;pointer-events:none}
.as-tit{font:600 .58rem "Segoe UI",system-ui;letter-spacing:.05em;text-transform:uppercase;color:#cdbf98;padding:0 .2rem;line-height:1;text-align:center}
.as-nota{margin:0;font:600 .64rem "Segoe UI",system-ui;color:#cdbf98;text-align:center}

/* fichas */
.as-fichas{flex:none;padding:.15rem 0 calc(.3rem + env(safe-area-inset-bottom));position:relative;z-index:6;display:flex;gap:.3rem;justify-content:center}
.as-fichas .rp-ficha{--t:36px!important}
.as-modal{text-align:left}.as-modal h2,.as-modal>p:first-of-type{text-align:center}
.as-reg{list-style:none;padding:0;margin:.5rem 0}.as-reg li{display:flex;justify-content:space-between;gap:.5rem;padding:.2rem 0;border-bottom:1px solid #ffffff18;font-size:.88rem}.as-reg b{color:var(--oro,#ffc627)}
.as-pantalla .rp-titulo{flex:1 1 0;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.8rem;letter-spacing:0}
.as-reglas{width:30px;height:30px;padding:0;border-radius:50%;font:700 .95rem Georgia,serif;display:grid;place-items:center}
.as-pantalla .rp-barra{gap:.4rem;padding:.3rem .55rem}
.as-pantalla .rp-casino{padding:.28rem .6rem;font-size:.78rem}
.as-pantalla .rp-barra .saldo{font-size:.8rem!important;padding:.15rem .55rem!important}
.as-pantalla .rp-sub,.as-pantalla .rp-barra>span[style*="flex:1"]{display:none}
@media(max-height:700px){.as-c{min-height:50px}.as-c.banda{min-height:40px}.as-c.palo{min-height:30px}.as-apuestas{padding:.3rem .3rem .25rem}.as-hist{height:22px}}
