/* Ayuda y chat de soporte. Van arriba a la IZQUIERDA, dentro de la banda de prueba (arriba a la derecha están refrescar, sonido e idioma de #ctl-casino);
   la banda reserva ese hueco con padding-left. Abajo no: ahí los juegos tienen fichas y apuestas. Sin banda (modo real) pasan abajo a la izquierda. */
.ay-botones{position:fixed;left:max(6px,env(safe-area-inset-left));top:2px;z-index:2147483000;display:flex;gap:6px;align-items:flex-start}
.ay-botones.ay-abajo{top:auto;bottom:max(8px,env(safe-area-inset-bottom));flex-direction:column}
.ay-btn{position:relative;height:24px;min-width:28px;padding:0 .45rem;border-radius:999px;border:1px solid var(--oro);background:#000c;color:var(--oro);display:grid;place-items:center;line-height:1;cursor:pointer}
.ay-btn svg{display:block;margin:auto;width:16px;height:16px}
.ay-botones.ay-abajo .ay-btn{width:38px;height:38px;padding:0;border-radius:50%}
body.ay-con-banda .banda-prueba{padding-left:78px}
.ay-pto{position:absolute;top:-4px;right:-4px;min-width:17px;height:17px;border-radius:9px;background:var(--rojo);color:#fff;font-size:.62rem;font-weight:700;line-height:17px;text-align:center;padding:0 3px}
.ay-pto[hidden]{display:none}
.ay-velo{position:fixed;inset:0;z-index:2147482500;background:#000b;display:flex;align-items:flex-end;justify-content:center}
.ay-velo[hidden]{display:none}
.ay-hoja{width:100%;max-width:520px;max-height:86vh;max-height:86dvh;height:min(86dvh,640px);display:flex;flex-direction:column;background:var(--negro2);border:1px solid var(--oro);border-bottom:0;border-radius:18px 18px 0 0;box-shadow:0 -10px 40px #000}
.ay-cab{display:flex;align-items:center;justify-content:space-between;padding:.6rem .9rem;border-bottom:1px solid #3a3322;color:var(--oro);font-family:Georgia,serif;letter-spacing:.04em}
.ay-x{background:none;border:0;color:var(--texto);font-size:1.7rem;line-height:1;padding:0 .3rem}
.ay-cuerpo{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:.4rem .9rem 1rem;display:flex;flex-direction:column}
.ay-sec{color:var(--oro);font-size:1rem;margin:1rem 0 .3rem}
.ay-q{border-bottom:1px solid #2a2a2a}
.ay-q summary{cursor:pointer;padding:.6rem 0;font-weight:600;list-style-position:inside}
.ay-p{color:var(--suave);font-size:.88rem;line-height:1.45;margin:.2rem 0 .7rem}
.ay-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.4rem}
.ay-juego{background:var(--negro3);border:1px solid #3a3322;border-radius:10px;color:var(--texto);padding:.55rem .5rem;font-size:.82rem;text-align:left}
.ay-juego:active{border-color:var(--oro)}
.ay-ir{width:100%;margin-top:.3rem}
.ay-lista{flex:1;min-height:120px;overflow-y:auto;display:flex;flex-direction:column;gap:.5rem;padding:.3rem 0}
.ay-vacio{color:var(--suave);font-size:.88rem;text-align:center;margin:auto}
.ay-msg{max-width:84%;border-radius:14px;padding:.45rem .7rem;display:flex;flex-direction:column;gap:.1rem}
.ay-msg.yo{align-self:flex-end;background:#3a2c08;border:1px solid var(--oro2)}
.ay-msg.soporte{align-self:flex-start;background:var(--negro3);border:1px solid #3a3322}
.ay-quien{color:var(--oro);font-size:.68rem;letter-spacing:.05em}
.ay-txt{margin:0;font:inherit;font-size:.92rem;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--texto)}
.ay-hora{color:var(--suave);font-size:.65rem;align-self:flex-end}
.ay-err{color:var(--mal);font-size:.8rem;min-height:1.1em;margin:.2rem 0}
.ay-form{display:flex;gap:.5rem;align-items:flex-end}
.ay-ta{flex:1;font:inherit;font-size:16px;color:var(--texto);background:var(--negro3);border:1px solid #3a3322;border-radius:12px;padding:.5rem .7rem;resize:none;min-width:0}
.ay-ta:focus{outline:2px solid var(--oro)}
.ay-enviar{padding:.65rem 1rem}
.ay-enviar:disabled{opacity:.5}
