

.sm-escena{gap:.25rem}
.sm-mesa{position:relative;flex:none;align-self:stretch;width:100%;max-width:560px;margin-inline:auto;aspect-ratio:3/4;max-height:calc(100dvh - 400px);min-height:340px;container-type:size;overflow:hidden;background:#0b1a14;display:grid;place-items:center}
@media(max-width:600px){.sm-mesa{width:calc(100% + 1rem);max-width:none;margin-inline:-.5rem}}
.sm-banca{display:flex;flex-direction:column;align-items:center;gap:1cqw}
.sm-cartas-b{display:flex;min-height:calc(var(--cw)*1.4)}
.sm-cartas-b .rp-carta{margin-left:calc(var(--cw)*-.38)}.sm-cartas-b .rp-carta:first-child{margin-left:0}

.sm-puesto{z-index:2;--lh:1.45rem}.sm-puesto.yo{z-index:3}
.sm-cartas{position:absolute;left:0;top:0;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:.5cqw}
.sm-cartas.multi{flex-direction:row;gap:1.2cqw;--cw:calc(var(--cw0)*.74)}
.sm-mano{position:relative;display:flex;flex-direction:column;align-items:center;padding:.5cqw;border-radius:8px;border:1px solid transparent}
.sm-mano.activa{border-color:#ffc627;background:#ffc62722;box-shadow:0 0 10px #ffc627aa}
.sm-cs{display:flex}.sm-cs .rp-carta{margin-left:calc(var(--cw)*-.4)}.sm-cs .rp-carta:first-child{margin-left:0}
.sm-tot{font:700 clamp(.58rem,3cqw,.72rem) Georgia,serif;color:#fff3c0;background:#000d;border-radius:999px;padding:0 .5rem;line-height:1.45;white-space:nowrap;border:1px solid #e2b53a66}
.sm-mano .sm-tot{position:absolute;top:100%;left:50%;transform:translate(-50%,-40%);z-index:2}
.sm-nueva{animation:sm-reparte .38s ease-out both}
@keyframes sm-reparte{from{opacity:0;transform:translateY(-14cqw) scale(.6) rotate(-10deg)}to{opacity:1;transform:none}}
.sm-apu,.sm-nom{display:flex;align-items:center;justify-content:center;gap:.3rem;white-space:nowrap}
.sm-apu{position:absolute;left:var(--pl,0);top:var(--pt,-6cqw);transform:translate(var(--ptx,-50%),var(--pty,-100%));z-index:3}
.sm-nom{position:absolute;left:var(--ll,0);top:var(--lt,8cqw);transform:translate(var(--ltx,-50%),var(--lty,0))}
.sm-nom{max-width:40cqw;padding:.1rem .6rem;border-radius:999px;background:linear-gradient(180deg,#2a1d08f2,#120c03f2);border:1px solid #d4a62add;color:#ffe9a8;font:700 clamp(.6rem,3.1cqw,.8rem) Georgia,serif;box-shadow:0 2px 6px #000b}
.sm-puesto.yo .sm-nom{font-size:clamp(.64rem,3.2cqw,.8rem);padding:.12rem .6rem;max-width:52cqw}.sm-puesto.yo .sm-nom b{max-width:34cqw}.sm-puesto.yo .sm-nom small{font-size:.8em}
.sm-nom em{font:800 .85em Georgia,serif;font-style:normal;color:#1a1204;background:#e2b53a;border-radius:50%;min-width:1.35em;height:1.35em;display:inline-grid;place-items:center}
.sm-nom b{overflow:hidden;text-overflow:ellipsis;max-width:32cqw}.sm-puesto.medio:not(.yo) .sm-nom{max-width:42cqw}.sm-puesto.medio:not(.yo) .sm-nom b{max-width:34cqw}.sm-nom small{color:#7dd3ff;font-size:.85em}
.sm-puesto.yo .sm-nom{border-color:#7dd3ff;box-shadow:0 0 0 1px #7dd3ff66,0 2px 6px #000b}.sm-puesto.yo .sm-nom b{color:#7dd3ff}
.sm-puesto.turno .sm-nom{border-color:#ffc627;background:linear-gradient(180deg,#4a3607f2,#241a03f2);box-shadow:0 0 12px #ffc627aa}
.sm-puesto.turno::before{content:"";position:absolute;left:0;top:0;width:calc(var(--cw)*2.5);height:calc(var(--cw)*2);transform:translate(-50%,-50%);border-radius:50%;box-shadow:0 0 14px 3px #ffc62799;pointer-events:none}
.sm-ficha{font:800 clamp(.62rem,3.2cqw,.8rem) Georgia,serif;color:#fff;background:#000c;border:1px solid #e2b53a99;border-radius:999px;padding:0 .5rem}
.sm-mira{font:600 clamp(.56rem,2.8cqw,.7rem) "Segoe UI",sans-serif;color:#dfe9e4;background:#000a;border-radius:999px;padding:0 .45rem}
.sm-aus{font:600 .6rem "Segoe UI";color:#ff9d92}
.sm-res{font:800 clamp(.66rem,3.4cqw,.86rem) Georgia,serif;border-radius:999px;padding:0 .5rem;background:#000d;color:#fff;border:1px solid #fff4}
.sm-res.mas{color:#7dffb2;border-color:#7dffb2aa}.sm-res.menos{color:#ff9d92;border-color:#ff9d92aa}
.sm-libre{font:600 clamp(.52rem,2.6cqw,.66rem) "Segoe UI",sans-serif;color:#d9d2b4;background:#000a;border:1px dashed #d4a62a99;border-radius:999px;padding:.12rem .5rem;cursor:pointer}
.sm-puesto.libre .sm-nom{background:none;border:0;box-shadow:none;padding:0;max-width:none;left:0;top:0;transform:translate(-50%,-50%)}
.sm-portada{height:150px;border-radius:14px;border:2px solid #d4a62a;background:url(/static/portadas/blackjack_summit.webp) center 56%/cover no-repeat;box-shadow:0 4px 14px #000a}
.sm-entrada{padding-top:.5rem}
.sm-pantalla .fs-dato{min-height:30px}
@media(max-height:700px){.sm-pantalla .fm-fichas{--t:38px}}
.sm-cab-b{min-width:34px;padding:.3rem .5rem;flex:none}
.sm-pantalla .fs-cab{gap:.35rem}.sm-pantalla .fs-fase{font-size:.78rem;margin-left:auto;white-space:nowrap}
.sm-pantalla .fs-cab{gap:.3rem}.sm-pantalla .fs-fase{min-width:0;flex:1;text-align:right;overflow:hidden;text-overflow:ellipsis;font-size:.74rem;margin-left:0}
.sm-cab-b{min-width:32px;padding:.3rem .45rem}

@media (orientation:landscape) and (max-height:540px){
  .sm-pantalla .rp-cuerpo{padding:0}
  .sm-pantalla .sm-escena{display:grid;grid-template-columns:minmax(0,1fr) 224px;grid-template-rows:auto auto 1fr;column-gap:.4rem;row-gap:.2rem;padding:0 .4rem 0 0;overflow:hidden}
  .sm-pantalla .sm-mesa{grid-column:1;grid-row:1/4;width:100%;max-width:none;margin:0;aspect-ratio:auto;max-height:none;min-height:0;height:100%}
  .sm-pantalla .fs-cab{grid-column:2;grid-row:1;flex-wrap:wrap;gap:.25rem;padding-top:.2rem}
  .sm-pantalla .fs-codigo{font-size:1.05rem;padding:.2rem .5rem;letter-spacing:.16em}
  .sm-pantalla .fs-fase{flex:1 0 100%;text-align:left;margin:0}
  .sm-pantalla .fs-reloj{grid-column:2;grid-row:2}
  .sm-pantalla .fs-pie.fija{grid-column:2;grid-row:3;position:static;align-self:end;margin:0;padding:0 0 .3rem;background:none;display:flex;flex-direction:column;justify-content:flex-end;min-height:0;overflow-y:auto}
  .sm-pantalla .fs-pie .rp-boton{padding:.45rem .6rem;font-size:.92rem;min-height:0}
  .sm-pantalla .fs-mando{gap:.25rem;padding-bottom:0}
  .sm-pantalla .fs-dato{min-height:0;font-size:.74rem;padding:.1rem 0}
  .sm-pantalla .fm-fichas{padding-bottom:.1rem}.sm-pantalla .fm-fichas .rp-ficha{--t:30px!important}.sm-pantalla .fm-fichas button{padding:0}.sm-pantalla .fm-fichas>*{gap:.2rem}
  .sm-pantalla .rp-premio-max{font-size:.58rem;padding:.06rem .25rem;margin:0 auto .1rem}
  .sm-pantalla .fs-fila{gap:.25rem}.sm-pantalla .fs-fila .rp-boton{padding:.4rem .5rem;font-size:.82rem}
  .sm-puesto .sm-nom{font-size:clamp(.5rem,1.7cqw,.7rem);padding:.05rem .4rem;max-width:30cqw}.sm-puesto .sm-nom b{max-width:20cqw}.sm-puesto.yo .sm-nom{font-size:clamp(.52rem,1.8cqw,.74rem);max-width:36cqw}.sm-puesto.yo .sm-nom b{max-width:22cqw}
  .sm-puesto{--lh:1.2rem}
  .sm-ficha,.sm-res{font-size:clamp(.5rem,1.8cqw,.7rem)}.sm-mira{font-size:clamp(.46rem,1.5cqw,.6rem)}.sm-tot{font-size:clamp(.5rem,1.7cqw,.64rem)}
  .sm-libre{font-size:clamp(.46rem,1.5cqw,.6rem)}

  .sm-pantalla>.ab-barra{position:absolute!important;top:0!important;right:0!important;left:auto!important;width:224px;z-index:8;padding:2px 4px!important;background:#050302!important}
  .sm-pantalla>.ab-barra .ab-q{width:34px;height:34px;border-radius:9px}.sm-pantalla>.ab-barra .ab-q i,.sm-pantalla>.ab-barra .ab-q[data-a="apu"],.sm-pantalla>.ab-barra .ab-q[data-a="gra"]{display:none}
  .sm-pantalla>.ab-barra .ab-saldo{min-width:0;height:34px;padding:0 .4rem;font-size:.8rem}
  .sm-pantalla .fs-cab{margin-top:40px}
  .sm-pantalla .fs-pie .bjv-barra{padding-bottom:.2rem}
  .sm-pantalla>.ab-barra .ab-tit,.sm-pantalla>.ab-barra .ab-sub{display:none!important}
}

.bj-ch{display:inline-block;width:.95em;height:.95em;border-radius:50%;vertical-align:-.12em;margin-right:.1em;background:radial-gradient(circle at 35% 30%,#fff3b0 0,#ffc627 45%,#b8860b 100%);box-shadow:0 0 0 .08em #7a5200,inset 0 0 0 .13em #ffc627,inset 0 0 0 .2em #7a520099}

@media (orientation:landscape) and (max-height:420px){
  .sm-pantalla .fs-cab{flex-wrap:nowrap;gap:.2rem}.sm-pantalla .fs-codigo{font-size:.9rem;padding:.15rem .3rem;letter-spacing:.08em}.sm-pantalla .fs-wa{padding:.25rem .4rem;font-size:.72rem}.sm-pantalla .sm-cab-b{min-width:28px;padding:.25rem .3rem}
  .sm-pantalla .fs-fase{display:none}
  .sm-pantalla .fs-pie .bjv-barra{padding-bottom:.1rem}
  .sm-pantalla .fs-dato{font-size:.66rem;line-height:1.15}
  .sm-pantalla .rp-premio-max{font-size:.5rem;line-height:1.1;padding:.03rem .2rem}
  .sm-pantalla .fm-fichas .rp-ficha{--t:23px!important}.sm-pantalla .fm-fichas>*{gap:.08rem;flex-wrap:nowrap!important}
  .sm-pantalla .fs-pie .rp-boton{padding:.3rem .5rem;font-size:.8rem}
}

#sm-mando:has(.fs-acc){flex-direction:row;flex-wrap:wrap;justify-content:center}
#sm-mando .fs-acc{flex:1 1 30%;padding:.62rem .4rem}
.sm-pantalla .fs-pie #sm-mando .fs-acc{padding:.5rem .3rem;font-size:.9rem}
#sm-dato:has(.sm-razon){flex-direction:column;gap:0}
#sm-dato .sm-razon{font-size:.72rem;opacity:.85}

.sm-cambia{animation:sm-fundido .45s ease-out both}
@keyframes sm-fundido{from{opacity:.25}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.sm-cambia{animation:none}}

.sm-bandeja{width:100%;flex-wrap:nowrap;gap:.1rem;padding:.05rem 0 0;justify-content:space-between}
.sm-bandeja button{flex:1 1 0;min-width:0;display:flex;justify-content:center;padding:2px 0;min-height:38px;align-items:center;touch-action:manipulation}
.sm-bandeja .rp-ficha{--t:34px!important}
.sm-bandeja button.fuera{opacity:.35}
.sm-bandeja button.sel{transform:none;filter:none}
#sm-limpiar{min-height:40px;white-space:nowrap}
#sm-dato:has(.sm-pila){flex-direction:column;gap:0}
#sm-dato .sm-pila{font-size:.72rem;color:#ffe9a8}
@media (orientation:landscape) and (max-height:540px){.sm-bandeja .rp-ficha{--t:22px!important}.sm-bandeja button{min-height:26px}#sm-limpiar{min-height:30px}}

@media (orientation:portrait) and (max-height:700px){
  .sm-pantalla .fs-pie.fija{padding-top:.1rem}
  .sm-pantalla .bjv-yo .sm-nom{margin:.05rem 0}
  .sm-pantalla .fs-dato{min-height:0;font-size:.72rem;padding:.05rem 0}
  .sm-pantalla .rp-premio-max{font-size:.56rem;line-height:1.1;padding:.02rem .3rem;margin:0 auto .1rem}
  .sm-pantalla .fs-mando{gap:.2rem;padding-bottom:.1rem}
  .sm-pantalla .fm-fichas{padding-bottom:0}
  .sm-pantalla .sm-bandeja .rp-ficha{--t:27px!important}.sm-pantalla .sm-bandeja button{min-height:30px}
  .sm-pantalla #sm-limpiar{min-height:34px;padding:.3rem .55rem;font-size:.78rem}
  .sm-pantalla .fs-fila .rp-boton{padding:.35rem .5rem;font-size:.88rem}
  .sm-pantalla .fs-cab{gap:.25rem;padding:.1rem 0 0}
  .sm-pantalla .fs-codigo{font-size:.9rem;padding:.12rem .45rem;letter-spacing:.1em}
  .sm-pantalla .fs-wa,.sm-pantalla .sm-cab-b{min-height:30px;padding:.2rem .45rem;font-size:.74rem}
}

@property --yo-mh{syntax:"<length>";inherits:true;initial-value:0px}
@property --yo-tb{syntax:"<length>";inherits:true;initial-value:0px}
@media not all and (orientation:landscape) and (max-height:540px){
  .sm-pantalla .bjv{--yo-mh:100cqh;--yo-tb:var(--lt,calc(max(100cqh - var(--bw)/var(--ar),0px)/2 + min(0px,max(100cqh - var(--bw)/var(--ar),50cqh - var(--wc,.5)*var(--bw)/var(--ar)))))}
  .sm-pantalla .bjv .sm-puesto.yo.bjv-p{top:min(var(--y,70%),calc(var(--oy) + (var(--yo-mh) - 6px - var(--yo-tb) - var(--oy))/var(--z) - var(--cw)*.7 - .5cqw - .75rem));transition:top .3s ease}
}

.sm-pw{display:flex;flex-direction:column;align-items:center;gap:1px}
.sm-pw .rp-pila{--t:26px;height:calc(var(--t) + 30px);margin-bottom:.15rem}
.sm-bandeja button{position:relative}
.sm-bandeja button.puesta .rp-ficha{box-shadow:0 0 0 2px #ffc627,0 0 8px #ffc627aa}
.sm-cnt{position:absolute;top:-2px;right:0;font:800 .62rem Georgia,serif;font-style:normal;color:#1a1204;background:#ffc627;border-radius:999px;padding:0 .3rem;line-height:1.25;box-shadow:0 1px 3px #000a;pointer-events:none}
#sm-limpiar{background:#3a2a0a;border:1px solid #d4a62a;color:#ffe9a8;opacity:1}
#sm-limpiar:disabled{opacity:.55}
#sm-quitar{width:100%;border:1px solid #d4a62a;color:#ffe9a8;min-height:42px}
.fs-reloj.fs-libre i{background:#7dd3ff;opacity:.55}
@media (orientation:landscape) and (max-height:540px){.sm-pw .rp-pila{--t:14px;height:calc(var(--t) + 22px)}.sm-cnt{font-size:.5rem}}

.sm-apu.sm-apu-pila{top:0;transform:translate(-50%,-58%)}
.fs-tiempo{white-space:nowrap}
