/* ======================================================================
   SOUFFLE & BOUM — menu, commandes de jeu, invite « Jouer », bandeau du Grand.
   ====================================================================== */

/* le menu des tables */
.tables .choix button.souffle{border-color:rgba(57,255,136,.5);background:linear-gradient(135deg,rgba(120,20,40,.55),rgba(200,120,20,.35));color:#fff3c0;font-weight:700}
.tables .choix button.souffle[aria-pressed="true"]{background:#e8a800;border-color:#fff3a0;color:#1a0a00}

/* à la machine : le comptoir de mises du jeu s'efface, nos commandes le remplacent */
body.souffleActif .enseigne{visibility:hidden}
/* le gain s'affiche déjà sur l'écran de la borne : le verdict du jeu ne garde que ses messages, en haut */
body.souffleActif #verdict{top:12px;bottom:auto}
body.souffleActif #verdict .gros{display:none}
body.souffleActif .mises > .lbl,body.souffleActif .mises > .saisie,body.souffleActif .mises > .jetons,body.souffleActif #serie{display:none}
.actionsX.souffleX{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:nowrap}
.actionsX.souffleX .sfPas{min-width:44px;padding:10px 0;font-size:20px;font-weight:800}
.actionsX.souffleX .sfMise{min-width:92px;text-align:center;font-family:"Fraunces",serif;font-weight:900;font-size:19px;color:var(--laiton-clair);font-variant-numeric:tabular-nums}
.actionsX.souffleX .sfSpin{min-width:128px;padding:13px 22px;font-size:19px;font-weight:900;letter-spacing:.06em;border-radius:999px;
  background:radial-gradient(circle at 40% 30%,#8dff9e,#19b43c 60%,#0b6a22);color:#062a0e;border:2px solid #d8ffe0;
  box-shadow:0 0 18px rgba(57,255,136,.55),inset 0 -3px 0 rgba(0,0,0,.25)}
.actionsX.souffleX .sfSpin:disabled{filter:grayscale(1);opacity:.5;box-shadow:none}
.actionsX.souffleX .sfAuto{min-width:78px}
.actionsX.souffleX .sfAuto[aria-pressed="true"]{background:#ff5a5a;border-color:#ffb0b0;color:#fff}
@media (max-width:900px){
  .actionsX.souffleX{gap:5px}
  .actionsX.souffleX .sfPas{min-width:38px;font-size:18px}
  .actionsX.souffleX .sfMise{min-width:74px;font-size:16px}
  .actionsX.souffleX .sfSpin{min-width:96px;padding:12px 14px;font-size:17px}
  .actionsX.souffleX .sfAuto{min-width:62px;font-size:12px}
}

/* à pied, devant une borne */
#souffleInvite{position:fixed;left:50%;bottom:110px;transform:translate(-50%,20px);z-index:30;opacity:0;pointer-events:none;
  font:inherit;font-size:16px;font-weight:800;color:#1a0a00;background:linear-gradient(180deg,#fff3a0,#e8a800);border:2px solid #fff;border-radius:999px;padding:12px 22px;
  box-shadow:0 6px 24px rgba(0,0,0,.45),0 0 20px rgba(255,210,58,.5);transition:opacity .2s,transform .2s;cursor:pointer}
#souffleInvite.vu{opacity:1;transform:translate(-50%,0);pointer-events:auto}

/* un Grand vient de tomber : tout le casino le voit */
#souffleGrand{position:fixed;left:50%;top:18%;transform:translate(-50%,-30px) scale(.9);z-index:70;opacity:0;pointer-events:none;
  display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;max-width:min(560px,92vw);
  background:radial-gradient(circle at 50% 0%,rgba(255,210,58,.35),rgba(20,6,2,.95) 70%);border:3px solid #ffd23a;border-radius:22px;padding:18px 26px;
  box-shadow:0 0 60px rgba(255,190,0,.55);transition:opacity .35s,transform .35s}
#souffleGrand.vu{opacity:1;transform:translate(-50%,0) scale(1)}
#souffleGrand b{font-family:"Fraunces",serif;font-weight:900;font-size:clamp(28px,6vw,46px);color:#ffe680;letter-spacing:.02em;text-shadow:0 3px 0 #7a3a00,0 0 20px rgba(255,190,0,.8);animation:sfPulse .6s ease-in-out infinite alternate}
#souffleGrand span{font-size:16px;color:#fff;font-weight:600}
@keyframes sfPulse{to{transform:scale(1.06)}}
/* écran bas (téléphone couché) : tout le bandeau tient sur une rangée en haut, le message passe dessous */
@media (min-width:901px) and (max-height:560px){ html body.souffleActif #verdict{top:58px} }
