/* Shared by the host loading cover and the isolated ready screen. */
@font-face { font-family: FroggyCoverDisplay; src: url('/player/fonts/DynaPuff.ttf') format('truetype'); font-weight: 400 700; font-display: swap; }
@font-face { font-family: FroggyCoverBody; src: url('/player/fonts/Dosis.ttf') format('truetype'); font-weight: 200 800; font-display: swap; }
.console-screen .player-frame .player-cover, body #overlay {
  box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; align-items: center;
  gap: 18px; padding: 16px; text-align: center; background: #142331a8; color: #fffdec;
}
.console-screen .player-frame .player-cover h2, body #overlay #game-title {
  margin: 0; font: 700 28px/1.1 FroggyCoverDisplay, sans-serif; text-shadow: none;
}
.console-screen .player-frame .player-cover p, body #overlay #game-description {
  margin: 0; min-height: 0; max-width: 320px; font: 500 16px/1.4 FroggyCoverBody, sans-serif;
}
.console-screen .player-frame .player-cover .pixel-button, body #overlay #start {
  box-sizing: border-box; margin: 6px 0 0; min-width: 110px; min-height: 46px; padding: 8px 18px;
  font: 750 24px/1.25 FroggyCoverBody, sans-serif; background: #b6ff00; color: #0028e4;
  border: 2px solid #0028e4; border-radius: 11px 9px 12px 8px; box-shadow: 2px 2px 0 #0028e4;
}
.console-screen .player-frame .player-download { position: absolute; bottom: 5px; left: 16px; right: 16px; font-size: 10px; }
.console-screen, body:has(> #overlay) { container-type: inline-size; container-name: player-lcd; }
@container player-lcd (max-width: 300px) {
  .console-screen .player-frame .player-cover, body #overlay { gap: 10px; padding: 8px; }
  .console-screen .player-frame .player-cover h2, body #overlay #game-title { font-size: 22px; }
  .console-screen .player-frame .player-cover p, body #overlay #game-description { font-size: 12px; display: block; }
}