

html.ab{--sab:env(safe-area-inset-bottom,0px);--sat:env(safe-area-inset-top,0px);--ab-tira:var(--sat);--ab-pie:calc(22px + var(--sab));
  --ctl-top:var(--ab-tira)!important;--ctl-bar:var(--ab-tira)!important}
html.ab.ab-prueba{--ab-tira:calc(18px + var(--sat))}
body.ab{padding-top:var(--ab-tira)}

body.ab #banda-prueba,body.ab #ctl-sesion,body.ab #ctl-casino,body.ab #ay-botones,body.ab #letrero-prueba,
body.ab #app>.barra,body.ab .rp-barra,body.ab .dp-top,body.ab .mesa-barra #b-casino{display:none!important}

body.ab .rp-pantalla,body.ab .dp-sala,body.ab .mesa-marco{bottom:var(--ab-pie)}
body.ab .rs-pantalla,body.ab .bg-pantalla{--rs-h:calc(100vh - var(--ab-pie))!important;--rs-h:calc(100dvh - var(--ab-pie))!important}
body.ab.ab-b #app{padding-bottom:var(--ab-pie)}
body.ab .toast{bottom:calc(var(--ab-pie) + 12px)}

#ab-tira{position:fixed;top:0;left:0;right:0;z-index:2147483600;height:var(--ab-tira);box-sizing:border-box;padding:var(--sat) max(8px,env(safe-area-inset-right)) 0 max(8px,env(safe-area-inset-left));
 display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#8d1414,#6e0f0f);border-bottom:1px solid #3a0808;
 font:700 9.5px/1 -apple-system,"DejaVu Sans",sans-serif;letter-spacing:.1em;color:#fff;white-space:nowrap}
#ab-tira span{overflow:hidden;text-overflow:ellipsis}

.ab-barra,.ab-barra *{box-sizing:border-box}
.ab-barra{position:relative;z-index:6;padding:6px max(8px,env(safe-area-inset-right)) 6px max(8px,env(safe-area-inset-left));display:flex;flex-direction:column;gap:6px;
 font-family:-apple-system,"DejaVu Sans",sans-serif;color:#ffc627;background:none;border:0;flex:none;-webkit-user-select:none;user-select:none}
.ab-fila{display:flex;align-items:center;justify-content:space-between;gap:5px}
.ab-q{flex:none;width:46px;height:46px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:0;margin:0;position:relative;
 border:1.5px solid #c9a227;border-radius:11px;background:rgba(10,8,3,.88);color:#ffc627;font:inherit;cursor:pointer;touch-action:manipulation;
 box-shadow:0 2px 7px rgba(0,0,0,.6),0 0 0 1px rgba(0,0,0,.35)}
.ab-q svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 1px #000);pointer-events:none}
.ab-q i{font:700 7.9px/1 -apple-system,"DejaVu Sans",sans-serif;font-style:normal;color:#f0d27a;white-space:nowrap;text-shadow:0 1px 2px #000;pointer-events:none;letter-spacing:-.2px}
.ab-q.solo svg{width:24px;height:24px}
.ab-q.on{background:linear-gradient(180deg,#ffe27a,#e7b93c 55%,#b8860b);color:#1a1200;border-color:#ffe27a}.ab-q.on i{color:#1a1200;text-shadow:none}
.ab-q.sello{width:40px;height:46px;padding:0;border:0;border-radius:50%;background:none;box-shadow:none}
.ab-q.sello img{display:block;width:40px;height:40px;object-fit:contain;pointer-events:none;filter:drop-shadow(0 1px 3px rgba(0,0,0,.75))}
.ab-q.sello img.gira{animation:ab-gira .6s ease-in-out 1}
@keyframes ab-gira{to{transform:rotate(360deg)}}
.ab-q::after{content:"";position:absolute;inset:-4px}
.ab-q .pto{position:absolute;top:3px;right:3px;width:8px;height:8px;border-radius:50%;background:#e33;border:1px solid #000}
.ab-q:active{transform:scale(.95)}
.ab-saldo{flex:1;min-width:0;height:46px;display:flex;align-items:center;justify-content:center;gap:6px;padding:0 4px;border:1.5px solid #c9a227;border-radius:11px;background:rgba(10,8,3,.88);
 color:#ffe27a;font:800 17px -apple-system,"DejaVu Sans",sans-serif;white-space:nowrap;box-shadow:0 2px 7px rgba(0,0,0,.6),0 0 0 1px rgba(0,0,0,.35);text-shadow:0 1px 2px #000;font-variant-numeric:tabular-nums}
.ab-saldo svg{flex:none;width:19px;height:19px}
.ab-saldo.largo{font-size:14.5px;gap:4px}.ab-saldo.largo svg{width:16px;height:16px}.ab-saldo.mini{font-size:13px}.ab-saldo.mini svg{display:none}
.ab-juego .ab-saldo{padding:0 6px;font-size:15px}.ab-juego .ab-saldo.largo{font-size:13px}.ab-juego .ab-saldo.mini{font-size:12px}
.ab-tit{flex:1;min-width:0;height:46px;display:flex;align-items:center;padding:0 9px;border:1.5px solid #c9a227;border-radius:11px;background:rgba(10,8,3,.88);
 font:700 13.5px/1.1 Georgia,serif;color:#ffc627;box-shadow:0 2px 7px rgba(0,0,0,.6),0 0 0 1px rgba(0,0,0,.35);text-shadow:0 1px 2px #000;overflow:hidden}
.ab-sub{display:flex;align-items:center;padding:0 4px;font:700 14px/1.15 Georgia,serif;color:#ffc627;text-shadow:0 1px 2px #000;min-width:0}
.ab-sub span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ab-tit span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

.ab-menu{display:flex;flex-direction:column;gap:6px}
.ab-menu[hidden]{display:none}
.ab-rej{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.ab-ses{align-self:center;display:flex;gap:16px;padding:5px 14px;border:1.5px solid #c9a227;border-radius:11px;background:rgba(10,8,3,.88);color:#cfc3a0;font:600 12px -apple-system,"DejaVu Sans",sans-serif;
 box-shadow:0 2px 7px rgba(0,0,0,.6);text-shadow:0 1px 2px #000}
.ab-ses b{color:#fff}
.ab-eq{align-self:center;max-width:100%;padding:4px 10px;border:1.5px solid #6b5a22;border-radius:11px;background:rgba(10,8,3,.88);color:#cfc3a0;font:600 11.5px -apple-system,"DejaVu Sans",sans-serif;text-align:center;box-shadow:0 2px 7px rgba(0,0,0,.6)}
.ab-eq .mcasilla{display:inline-block;margin:1px 2px}
.ab-idi{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.ab-idi[hidden]{display:none}
.ab-idi button{padding:7px 12px;border:1.5px solid #c9a227;border-radius:10px;background:rgba(10,8,3,.88);color:#ffc627;font:700 13px -apple-system,"DejaVu Sans",sans-serif}
.ab-idi button.sel{background:linear-gradient(180deg,#ffe27a,#e7b93c 55%,#b8860b);color:#1a1200;border-color:#ffe27a}

#ab-hoja,#ab-vel,#ab-banda{display:none}
body.ab-b #ab-hoja,body.ab-b #ab-vel{display:block}

body.ab-b #ab-banda{display:block;position:fixed;left:0;right:0;bottom:0;height:var(--ab-pie);background:#050302;z-index:2147483100;pointer-events:none}
#ab-hoja{position:fixed;left:0;right:0;bottom:0;z-index:2147483300;transform:translateY(var(--ty,100%));transition:transform .26s cubic-bezier(.2,.8,.2,1);
 font-family:-apple-system,"DejaVu Sans",sans-serif;touch-action:none;will-change:transform}
#ab-hoja.arr{transition:none}
#ab-hoja .tab{position:absolute;left:50%;top:calc(-20px - var(--sab));width:76px;height:20px;margin-left:-38px;display:flex;align-items:center;justify-content:center;
 background:rgba(10,8,3,.94);border:1.5px solid #c9a227;border-bottom:0;border-radius:11px 11px 0 0;color:#ffc627;touch-action:none;padding:0}
#ab-hoja.abierta .tab{top:-20px}
#ab-hoja .tab::before{content:"";position:absolute;left:-18px;right:-18px;top:-6px;bottom:0}
#ab-hoja .tab svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .26s;pointer-events:none}
#ab-hoja.abierta .tab svg{transform:rotate(180deg)}
#ab-hoja .cuerpo{background:rgba(10,8,3,.97);border-top:1.5px solid #c9a227;border-radius:16px 16px 0 0;padding:14px 12px calc(14px + var(--sab));box-shadow:0 -8px 24px rgba(0,0,0,.65)}
#ab-hoja .asa{width:40px;height:4px;border-radius:2px;background:#6b5a22;margin:-6px auto 10px}
#ab-hoja .ab-rej{gap:10px}
#ab-hoja .ab-q{width:80px;height:80px;border-radius:14px;gap:6px;background:rgba(30,24,8,.95)}
#ab-hoja .ab-q svg{width:30px;height:30px}
#ab-hoja .ab-q i{font-size:12px;font-weight:700;letter-spacing:0}
#ab-hoja .ab-menu{gap:10px}
#ab-hoja .ab-ses{gap:28px;padding:8px 14px;font-size:14px}
#ab-vel{position:fixed;inset:0;z-index:2147483200;background:#000;opacity:var(--vo,0);pointer-events:none;transition:opacity .26s}
#ab-vel.arr{transition:none}
#ab-vel.on{pointer-events:auto}

body.ab-b:has(#cajero,.ap-panel,.panel-adm,.velo,.mx-velo:not([hidden]),#ay-velo:not([hidden])) #ab-hoja,
body.ab-b:has(#cajero,.ap-panel,.panel-adm,.velo,.mx-velo:not([hidden]),#ay-velo:not([hidden])) #ab-banda,
body.ab-b:has(#cajero,.ap-panel,.panel-adm,.velo,.mx-velo:not([hidden]),#ay-velo:not([hidden])) #ab-vel{display:none}

body.ab:has(.rp-pantalla,.dp-sala,.mesa-marco,.pantalla)::after{content:"";position:fixed;left:0;right:0;bottom:0;height:var(--ab-pie);background:#050302;z-index:71;pointer-events:none}

body.ab .mx-tarjeta{bottom:calc(var(--ab-pie) + 10px)}

body.ab .panel-adm{padding-top:var(--ab-tira)}

@media(max-width:359px){.ab-q{width:42px}.ab-saldo svg{display:none}.ab-saldo,.ab-juego .ab-saldo{font-size:14px}.ab-saldo.largo,.ab-juego .ab-saldo.largo{font-size:12px}.ab-tit{font-size:12px;padding:0 6px}}

#ab-aviso{pointer-events:none;position:fixed;inset:0;z-index:2147483250;background:rgba(0,0,0,.6);display:flex;align-items:flex-end;justify-content:center;
 padding:0 18px calc(var(--ab-pie) + 38px);font-family:-apple-system,"DejaVu Sans",sans-serif}
#ab-aviso .tarj{pointer-events:auto;position:relative;width:100%;max-width:330px;box-sizing:border-box;padding:16px 16px 14px;border:1.5px solid #c9a227;border-radius:16px;background:rgba(14,10,3,.98);
 color:#f6e7b4;text-align:center;box-shadow:0 8px 30px rgba(0,0,0,.7)}
#ab-aviso p{margin:0 0 12px;font:600 15px/1.35 -apple-system,"DejaVu Sans",sans-serif}
#ab-aviso button{min-width:130px;padding:10px 20px;border:0;border-radius:11px;background:linear-gradient(180deg,#ffe27a,#e7b93c 55%,#b8860b);color:#1a1200;font:800 15px -apple-system,"DejaVu Sans",sans-serif}
#ab-aviso .fle{position:absolute;left:50%;bottom:-31px;width:30px;height:30px;margin-left:-15px;stroke:#ffc627;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;
 filter:drop-shadow(0 1px 3px #000);animation:ab-rebota 1s ease-in-out infinite}
@keyframes ab-rebota{50%{transform:translateY(6px)}}
@media(prefers-reduced-motion:reduce){#ab-aviso .fle{animation:none}}

body.ab .rs-sello{background:radial-gradient(circle at 50% 38%,#7a1a2e,#2a0610 75%)}

#ab-barra-p.ab-fija{position:sticky;top:var(--ab-tira);z-index:60;background:linear-gradient(180deg,#050302 82%,rgba(5,3,2,0))}
.ab-fija .ab-fila{flex-wrap:nowrap}
.mesa-marco>.ab-barra,.dp-sala>.ab-barra{flex:none;background:#050302}

body.ab #cajero.pantalla{z-index:80}

html.ab::before{content:"";position:fixed;top:0;left:0;right:0;height:var(--sat);background:#0a0a0a;z-index:2147483000;pointer-events:none}
html.ab{background-color:#0a0a0a}

.ab-q:not(.on):not(.sello),.ab-saldo,.ab-tit{background:#0a0803!important}
.ab-q:not(.sello),.ab-saldo,.ab-tit{border-color:#d4ac2e}

.ab-barra{padding-top:14px}
.ab-barra .ab-q,.ab-barra .ab-saldo,.ab-barra .ab-tit,.ab-barra .ab-ses,.ab-barra .ab-eq{box-shadow:none;text-shadow:none;filter:none;-webkit-backdrop-filter:none;backdrop-filter:none;opacity:1}
.ab-barra .ab-q svg,.ab-barra .ab-q.sello img,.ab-barra .ab-saldo svg{filter:none}
.ab-barra .ab-q i,.ab-barra .ab-sub,.ab-barra .ab-tit span{text-shadow:none}
.ab-barra::before,.ab-barra::after{content:none}
#ab-barra-p{background:#0a0a0a}
#ab-barra-p.ab-fija{background:#0a0a0a}

html.ab{--ab-top0:var(--sat);--ab-fr:13px;--ab-tira:calc(var(--ab-top0) + var(--ab-fr))}
html.ab.ab-prueba{--ab-top0:calc(18px + var(--sat));--ab-tira:calc(var(--ab-top0) + var(--ab-fr))}
#ab-tira{height:var(--ab-top0)}
html.ab::after{content:"SUMMIT ROYALE";position:fixed;top:var(--ab-top0);left:0;right:0;height:var(--ab-fr);box-sizing:border-box;z-index:2147483000;pointer-events:none;
 background:repeating-linear-gradient(45deg,#7a1010,#7a1010 14px,#5a0c0c 14px,#5a0c0c 28px);color:#ffe9a8;text-align:center;font:700 9px/13px -apple-system,"DejaVu Sans",sans-serif;letter-spacing:.14em;text-shadow:none}
.ab-barra{padding-top:8px}

html.ab{--ab-zona:12px;--ab-tira:calc(var(--ab-top0) + var(--ab-zona) + var(--ab-fr))}
html.ab.ab-prueba{--ab-tira:calc(var(--ab-top0) + var(--ab-zona) + var(--ab-fr))}
html.ab::before{height:calc(var(--ab-top0) + var(--ab-zona))}
html.ab::after{top:calc(var(--ab-top0) + var(--ab-zona))}
