/* The board stays central; controls explain rules without recommending moves. */
.screen--game .game-shell { flex: 0 0 auto; }
.screen--game .game-main { min-width: 0; }
.game-turn { text-align: center; min-height: 24px; padding: 4px 16px; line-height: 1.5; }
.game-course-status { font-size: 13px; color: var(--taupe); }
.game-technical { display: block; color: var(--gold); font-size: 13px; }
.game-experience { margin: 12px 16px 0; padding-top: 12px; border-top: 1px solid var(--line-soft); }
.game-experience__tools { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.game-tool, .game-speed select {
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--c-900);
  color: var(--taupe);
  font: 600 12px var(--font-ui);
}
.game-tool { padding: 8px 12px; cursor: pointer; }
.game-tool[aria-pressed="true"] { border-color: var(--terra-link); color: var(--cream); }
.game-tool[aria-pressed="true"]::before { content: '✓'; margin-right: 6px; }
.game-tool--finish { background: var(--terra); color: var(--terra-ink); border-color: var(--terra); }
.game-tool:hover, .game-speed select:hover { border-color: var(--terra-link); }
.game-tool:focus-visible, .game-speed select:focus-visible, .game-history summary:focus-visible {
  outline: 2px solid var(--gold); outline-offset: 3px;
}
.game-speed { display: flex; align-items: center; gap: 8px; color: var(--taupe); font-size: 12px; }
.game-speed select { max-width: 140px; padding: 8px; }
.game-experience__event { margin: 0 0 12px; color: var(--cream); font-size: 13px; line-height: 1.5; }
.game-experience__help, .game-experience__clock { color: var(--dim); margin: 10px 0 0; font-size: 12px; line-height: 1.6; }
.game-experience__clock { font-size: 11px; }
.game-experience [hidden] { display: none !important; }
.game-experience [data-lang-toggle] { margin-left: auto; }
.game-experience [data-lang-toggle] button { min-width: 44px; min-height: 44px; }
.game-history { margin: 12px 16px 0; border-top: 1px solid var(--line-soft); }
.game-history summary { padding: 12px 0; cursor: pointer; color: var(--taupe); font-size: 13px; }
.game-history .scroll-x { gap: 8px; padding-bottom: 8px; }
.game-secondary-actions { padding: 12px 16px 20px; justify-content: flex-end; gap: 8px; }
.game-resign { color: var(--dim); background: transparent; border: 1px solid var(--line); min-height: 44px; }
.game-resign:hover { color: var(--red-soft); border-color: var(--red-soft); }
.screen--game .plate__info { min-width: 0; }
.screen--game .plate__name { white-space: normal; flex-wrap: wrap; overflow-wrap: anywhere; }
.screen--game .plate__rating { line-height: 1.5; }
@media (max-width: 480px) {
  .game-speed { flex: 1 1 auto; justify-content: space-between; }
  .game-experience__tools { gap: 6px; }
  .game-tool { padding: 8px 10px; }
  .game-experience__help { max-width: 46ch; }
}
@media (min-width: 1024px) {
  .screen--game .game-shell { grid-template-columns: minmax(0, 1fr) 280px; }
  .screen--game .game-main { padding: 20px 28px 28px; }
  .game-experience { margin: 12px 0 0; }
  .game-experience__help { max-width: 64ch; }
  .screen--game .game-side { align-self: stretch; }
}
@media (prefers-reduced-motion: reduce) {
  .screen--game .plate, .screen--game .turn-tag { animation: none; transition: none; }
}