/* Lobby do operador sandbox. Tokens e componentes vêm de /brand (id-visual). */
/* Componentes com display próprio não podem vencer o atributo hidden. */
[hidden] { display: none !important; }
/* Títulos de painel abaixo de 36 px: Manrope, nunca Jersey 10 (id-visual, seção 4.1). */
.panel-title { margin: 0 0 var(--space-12); font: var(--weight-bold) var(--text-subheading) / var(--leading-subheading) var(--font-sans); }
.nav-right { display: flex; align-items: center; gap: var(--space-16); }
.player-chip { display: flex; align-items: center; gap: var(--space-8); font-size: var(--text-body-sm); }
.player-chip__name { color: var(--color-text-muted); }
.player-chip__balance { font-variant-numeric: tabular-nums; }

.lobby { padding-block: var(--space-48) var(--space-96); }
.small { font-size: var(--text-body-sm); margin: var(--space-8) 0 0; }

.login { max-width: 560px; margin: var(--space-48) auto; }
.login__title { margin: var(--space-8) 0 var(--space-16); }
.login__form { display: flex; gap: var(--space-12); align-items: end; margin-top: var(--space-24); }
.login__form .koi-field { flex: 1; }

.lobby__grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: var(--space-32); align-items: start; }
.section-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-16); margin-bottom: var(--space-24); }
.section-head h2 { margin: 0; }

.games { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: var(--space-16); margin: 0; padding: 0; list-style: none; }
.game {
  display: grid;
  grid-template-rows: 120px auto;
  width: 100%;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  background: var(--color-surface);
  box-shadow: var(--shadow-card);
  color: var(--color-text);
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: transform var(--duration-base) var(--ease-ui), border-color var(--duration-base) var(--ease-ui);
}
.game:hover:not(:disabled), .game:focus-visible { transform: translateY(-2px); border-color: var(--koi-orange-500); }
.game:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; }
.game:disabled { cursor: progress; opacity: 0.6; }
.game__art { display: grid; place-items: center; background: var(--koi-pond); }
.game__art { height: 132px; }
.game__art img { width: 100%; height: 100%; padding: var(--space-12); object-fit: contain; }
.game__art .koi-sprite { width: 48px; height: 48px; }
.game__body { display: grid; gap: var(--space-4); padding: var(--space-12); }
.game__name { font-weight: var(--weight-semibold); }
.game__meta { display: flex; flex-wrap: wrap; gap: var(--space-4); }

.side { display: grid; gap: var(--space-16); }
.deposit { display: flex; flex-wrap: wrap; gap: var(--space-8); }

.ledger, .callbacks, .free-list { display: grid; gap: var(--space-4); margin: var(--space-12) 0 0; padding: 0; list-style: none; max-height: 320px; overflow: auto; }
.row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: var(--space-8);
  align-items: baseline;
  padding: var(--space-8);
  border-radius: var(--radius-control);
  background: var(--color-surface-muted);
  font-size: var(--text-caption);
}
.row__amount { font-variant-numeric: tabular-nums; font-weight: var(--weight-semibold); }
.row__amount--in { color: var(--koi-success); }
.row__amount--out { color: var(--color-text); }
.row__detail { color: var(--color-text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.row .koi-tag { min-height: 20px; }

.free-form { display: grid; gap: var(--space-12); }
.free-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-12); }

.game-dialog { width: min(1280px, 96vw); height: min(820px, 92vh); padding: 0; border: 0; border-radius: var(--radius-card-lg); box-shadow: var(--shadow-raised); background: var(--koi-ink); }
.game-dialog[open] { display: grid; grid-template-rows: auto 1fr; }
.game-dialog::backdrop { background: color-mix(in srgb, var(--koi-ink) 70%, transparent); }
.game-dialog__bar { display: flex; align-items: center; gap: var(--space-16); padding: var(--space-8) var(--space-16); background: var(--koi-paper); }
.game-dialog__bar strong { flex: 1; }
.game-dialog__balance { font-variant-numeric: tabular-nums; font-weight: var(--weight-semibold); }
.game-dialog iframe { width: 100%; height: 100%; border: 0; }

@media (max-width: 960px) {
  .lobby__grid { grid-template-columns: 1fr; }
  .player-chip__name { display: none; }
}