/* Subasta Empresarial · sala 1920 × 1080; vertical 1080 × 1920.
   Cargar después de theme.css/game.css. Sin cambios al escalado de #stage. */
.screen.screen--lobby {
  display: none;
  grid-template-columns: 540px minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr) auto auto;
  align-items: stretch;
  justify-content: stretch;
  gap: 18px 46px;
  padding: 48px 72px 62px;
  color: var(--se-white);
  background: radial-gradient(ellipse at 10% 0, var(--se-purple-light), transparent 65%), var(--se-purple);
  font-family: var(--se-font-body);
  font-size: 28px;
  line-height: 1.3;
}
.screen--lobby.screen--active { display: grid; }
.screen--lobby > * { min-width: 0; }
.lobby__head { grid-column: 1 / -1; align-self: center; margin: 0; padding-bottom: 4px; color: var(--se-yellow); font: 400 88px/1.1 var(--se-font-title); text-align: center; text-shadow: 0 6px 0 var(--se-ink); text-wrap: balance; }
.lobby__head :is(h1, h2) { font: inherit; }
.lobby__join { grid-column: 1; grid-row: 2 / 5; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; padding: 22px 24px; border: var(--se-outline); border-radius: 36px; color: var(--se-ink); background: var(--se-cyan); box-shadow: 0 10px 0 var(--se-ink); text-align: center; }
.lobby__qr { flex: 0 0 auto; display: grid; place-items: center; width: 440px; height: 440px; padding: 22px; border: 6px solid var(--se-ink); border-radius: 24px; background: var(--se-white); box-shadow: 0 8px 0 var(--se-ink); }
.lobby__qr > :is(svg, img, canvas) { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: contain; image-rendering: pixelated; }
.lobby__url { max-width: 100%; color: var(--se-purple-dark); font-size: 28px; font-weight: 600; line-height: 1.2; overflow-wrap: anywhere; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.lobby__code { display: block; width: 100%; margin: 0; padding: 8px 10px 12px 24px; border: 4px solid var(--se-ink); border-radius: 20px; color: var(--se-yellow); background: var(--se-purple-dark); box-shadow: 0 6px 0 var(--se-ink); font: 400 108px/1 var(--se-font-title); letter-spacing: 14px; font-variant-numeric: tabular-nums; text-align: center; }
.lobby__steps { align-self: stretch; display: grid; gap: 8px; margin: 2px 0 0; padding-left: 34px; font-size: 25px; font-weight: 500; text-align: left; }
.lobby__steps li { padding-left: 5px; }
.lobby__steps li::marker { color: var(--se-purple-dark); font-weight: 700; }
.lobby__teams { grid-column: 2; grid-row: 2; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: minmax(132px, 1fr); align-content: start; gap: 18px; min-height: 0; }
.lobby__team { position: relative; display: flex; flex-direction: column; gap: 12px; min-width: 0; padding: 18px 20px 18px 28px; overflow: hidden; border: 4px solid var(--se-ink); border-radius: 24px; color: var(--se-ink); background: var(--se-white); box-shadow: 0 7px 0 var(--se-ink); }
.lobby__team::before { position: absolute; inset: 0 auto 0 0; width: 12px; content: ''; background: var(--team-color, var(--se-cyan)); }
.lobby__team-name { margin: 0; font: 400 34px/1.1 var(--se-font-title); overflow-wrap: anywhere; }
.lobby__members { display: flex; flex-wrap: wrap; align-content: start; gap: 8px; min-height: 0; overflow-y: auto; scrollbar-width: thin; }
.lobby__member { display: inline-flex; align-items: center; gap: 7px; max-width: 100%; padding: 5px 12px; border: 2px solid var(--se-ink); border-radius: var(--se-radius-pill); background: color-mix(in srgb, var(--team-color, var(--se-cyan)) 24%, var(--se-white)); color: var(--se-ink); font-size: 23px; line-height: 1.25; overflow-wrap: anywhere; }
.lobby__team--new { animation: lobby-arrive 480ms var(--se-ease) both; }
.lobby__empty { grid-column: 1 / -1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 24px; min-height: 240px; padding: 36px; border: 4px dashed var(--se-cyan); border-radius: 32px; color: var(--se-white); background: var(--se-purple-dark); font-size: 36px; text-align: center; text-wrap: balance; }
.lobby__empty > img { width: 180px; height: 160px; object-fit: contain; }
.lobby__count { grid-column: 2; grid-row: 3; margin: 0; color: var(--se-yellow); font: 400 36px/1.2 var(--se-font-title); text-align: center; }
.lobby__actions { grid-column: 2; grid-row: 4; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 16px; }
.lobby__solo { grid-column: 2; grid-row: 3; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 12px; padding: 10px 16px; border: 2px dashed var(--se-cyan); border-radius: 18px; font-size: 22px; }
/* Si hay jugadores sin equipo, comparten la franja inferior con el contador. */
.screen--lobby:has(.lobby__solo:not([hidden])) { grid-template-rows: auto minmax(0, 1fr) auto auto auto; }
.screen--lobby:has(.lobby__solo:not([hidden])) .lobby__join { grid-row: 2 / 6; }
.screen--lobby:has(.lobby__solo:not([hidden])) .lobby__count { grid-row: 4; }
.screen--lobby:has(.lobby__solo:not([hidden])) .lobby__actions { grid-row: 5; }
.live-badge { display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 6px 14px; border: 2px solid var(--se-ink); border-radius: var(--se-radius-pill); color: var(--se-ink); background: var(--se-ok); box-shadow: 0 3px 0 var(--se-ink); font: 600 20px/1.2 var(--se-font-body); letter-spacing: 1px; white-space: nowrap; vertical-align: middle; }
.bet-row.is-live-locked { border-radius: 16px; background: color-mix(in srgb, var(--se-ok) 14%, transparent); box-shadow: inset 4px 0 0 var(--se-ok), 0 0 18px color-mix(in srgb, var(--se-ok) 20%, transparent); }
.live-dot { display: inline-block; flex: 0 0 12px; width: 12px; height: 12px; margin-inline: 4px; border: 2px solid var(--se-ink); border-radius: 50%; background: var(--se-ok); vertical-align: middle; }
.live-dot.is-offline, .live-dot[data-status='closed'], .live-dot[data-status='connecting'] { background: color-mix(in srgb, var(--se-ink) 40%, var(--se-white)); box-shadow: none; }
#stage.is-portrait .screen--lobby { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto minmax(0, 1fr) auto auto; gap: 18px; padding: 70px 64px 76px; }
#stage.is-portrait .lobby__head { grid-column: 1; grid-row: 1; font-size: 88px; }
#stage.is-portrait .lobby__join { grid-column: 1; grid-row: 2; gap: 12px; padding: 22px 28px; }
#stage.is-portrait .lobby__qr { width: 440px; height: 440px; }
#stage.is-portrait .lobby__url { font-size: 30px; }
#stage.is-portrait .lobby__code { max-width: 620px; font-size: 100px; }
#stage.is-portrait .lobby__steps { align-self: center; gap: 4px; font-size: 25px; }
#stage.is-portrait .lobby__teams { grid-column: 1; grid-row: 3; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: minmax(125px, 1fr); gap: 18px; }
#stage.is-portrait .lobby__count { grid-column: 1; grid-row: 4; }
#stage.is-portrait .lobby__actions { grid-column: 1; grid-row: 5; }
#stage.is-portrait .lobby__solo { grid-column: 1; grid-row: 4; }
#stage.is-portrait .screen--lobby:has(.lobby__solo:not([hidden])) { grid-template-rows: auto auto minmax(0, 1fr) auto auto auto; }
#stage.is-portrait .screen--lobby:has(.lobby__solo:not([hidden])) .lobby__join { grid-row: 2; }
#stage.is-portrait .screen--lobby:has(.lobby__solo:not([hidden])) .lobby__count { grid-row: 5; }
#stage.is-portrait .screen--lobby:has(.lobby__solo:not([hidden])) .lobby__actions { grid-row: 6; }
/* Compatibilidad con el marcado del presentador: info agrupada y ajustes
   dentro de actions. El HUD existente conserva su franja superior. */
.lobby__info { display: flex; flex-direction: column; align-items: stretch; gap: 10px; width: 100%; }
.lobby__code-label { margin: 0; font-size: 18px; font-weight: 600; }
.lobby__solo:empty { display: none; }
.screen--lobby:has(.lobby__info) .lobby__solo { padding-block: 6px; }
.lobby__solo .lobby__member { padding: 3px 10px; font-size: 20px; }
.lobby__member.is-offline { border-style: dashed; background: var(--se-white); }
.lobby__remove { position: absolute; top: 10px; right: 10px; width: 40px; height: 40px; min-height: 40px; padding: 0; border: 2px solid var(--se-ink); border-radius: 50%; color: var(--se-ink); background: var(--se-pink); font-size: 22px; }
.lobby__team:has(.lobby__remove) .lobby__team-name { padding-right: 44px; }
.screen--lobby:has(.lobby__info) { grid-template-rows: auto minmax(0, 1fr) auto auto; gap: 14px 46px; padding-top: 104px; padding-bottom: 42px; }
.screen--lobby:has(.lobby__info) .lobby__head { font-size: 68px; }
.screen--lobby:has(.lobby__info) .lobby__join { grid-row: 2 / 5; }
.screen--lobby:has(.lobby__info) .lobby__code { font-size: 94px; }
.screen--lobby:has(.lobby__info) .lobby__steps { font-size: 23px; gap: 4px; }
.screen--lobby:has(.lobby__info) .lobby__solo { grid-row: 3; }
.screen--lobby:has(.lobby__info) .lobby__actions { grid-row: 4; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px 20px; }
.lobby__actions .lobby__count { grid-column: 1; grid-row: auto; align-self: center; font-size: 30px; }
.screen--lobby:has(.lobby__info) .lobby__actions .lobby__count,
#stage.is-portrait .screen--lobby:has(.lobby__info) .lobby__actions .lobby__count { grid-column: 1; grid-row: 2; }
.screen--lobby:has(.lobby__info) .lobby__actions > .btn { grid-column: 2; grid-row: 2; }
.lobby__actions .lobby__money { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 22px; }
.lobby__actions .lobby__money .chip { min-width: 76px; min-height: 56px; padding: 8px 14px; font-size: 26px; }
.lobby__actions .lobby__word { display: flex; align-items: center; gap: 12px; font-size: 23px; }
.lobby__word input { width: 32px; height: 32px; accent-color: var(--se-ok); }
.screen--lobby:has(.lobby__info) .lobby__actions .btn--big { min-height: 90px; padding: 18px 32px; font-size: 34px; }
#stage.is-portrait .screen--lobby:has(.lobby__info) { grid-template-rows: auto auto minmax(0, 1fr) auto auto; gap: 16px; padding: 110px 64px 48px; }
#stage.is-portrait .screen--lobby:has(.lobby__info) .lobby__head { font-size: 74px; }
#stage.is-portrait .screen--lobby:has(.lobby__info) .lobby__join { grid-row: 2; padding-block: 16px; gap: 10px; }
#stage.is-portrait .lobby__info { align-items: center; gap: 6px; }
#stage.is-portrait .screen--lobby:has(.lobby__info) .lobby__steps { font-size: 23px; }
#stage.is-portrait .screen--lobby:has(.lobby__info) .lobby__solo { grid-row: 4; }
#stage.is-portrait .screen--lobby:has(.lobby__info) .lobby__actions { grid-column: 1; grid-row: 5; }
@keyframes lobby-arrive { 0% { opacity: 0; transform: translateY(20px) scale(.95); } 70% { opacity: 1; transform: translateY(-5px) scale(1.01); } 100% { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .lobby__team--new, .live-badge, .live-dot, .bet-row.is-live-locked { animation: none !important; transition: none !important; } }