/* ═══════════════ Gamex: the game list and host chat ═══════════════
   The games are built on the Quiz X primitives (.quiz-body, .quiz-screen,
   .quiz-game, .quiz-btn, .quiz-verdict) so the two game views read as one
   family; each game's own board is in its gamex_<game>.css. */

/* Host chat on the game list: the persona chat's bubbles and composer, but it
   sits in a scrolling screen, so the log sizes to its content up to a cap
   instead of filling the panel. */
.gx-chat {
  flex: 0 1 auto;
  max-height: 46vh;
  padding: 4px 4px 8px;
}
.gx-chat:empty { display: none; }
.gx-chat .bubble { font-size: 1.05rem; }
/* Replies are rendered markdown (<p>, <ul>), so drop pre-wrap's stray gaps. */
.gx-chat .bubble.md { white-space: normal; }
.gx-chat .bubble.md > :first-child { margin-top: 0; }
.gx-chat .bubble.md > :last-child { margin-bottom: 0; }
.gx-chat .bubble.md p { margin: 0 0 0.5em; }
.gx-chat .bubble.md ul { margin: 0 0 0.5em; padding-left: 1.2em; }
.gx-suggest {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  max-width: var(--w-form);
  margin-bottom: 4px;
}
.gx-suggest[hidden] { display: none; }
/* The chips stay above the log for the whole chat; dimmed while a reply streams. */
.gx-suggest[aria-busy="true"] .gx-chip { opacity: 0.5; cursor: progress; }
.gx-chip {
  font-family: var(--sans);
  font-size: 0.78rem;
  letter-spacing: 0.04em;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid var(--gold-dim);
  background: rgba(26, 16, 5, 0.5);
  color: var(--gold-lt);
  cursor: pointer;
  transition: border-color 0.2s, background 0.2s;
}
.gx-chip:hover,
.gx-chip:focus-visible {
  border-color: var(--gold);
  background: rgba(212, 160, 23, 0.12);
  outline: none;
}
.gx-chat-form .input { font-size: 1rem; }
.gx-fallback { display: flex; flex-direction: column; gap: 10px; }
.gx-fallback[hidden] { display: none; }
.gx-or { margin-top: 6px; }
.gx-teaser:disabled { cursor: default; opacity: 0.6; }
.gx-teaser:disabled:hover {
  border-color: var(--gold-dim);
  background: rgba(26, 16, 5, 0.5);
  box-shadow: none;
}